/* ---reset.css--- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);
body {
	line-height: 1;
}
ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* ---reset.css--- */

html { font-family: "微軟正黑體", Arial; font-size:16px; -webkit-text-size-adjust:none;}

body,
html {
  overflow-x: hidden; position:relative;
}
* { -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */}
	
* a:link, * a:visited { text-decoration:none;}
* a:hover, * a:active { text-decoration:none;}
.clear { clear:both;}
@font-face { font-family: GOTHIC; src: url(../fonts/GOTHIC.TTF);}


/* --電腦版型------------------------------------- */
h1 { position:absolute; left:0; top:-1000px;}

a.outlink { display:block; position: absolute; left:0; top:0; z-index:9999;}
a.outlink img { display:block; width:296px;}

.mainCon { position:relative; max-width:1250px; margin: 0 auto 0 auto; width:90%;}

/* -- 首頁 -- */
#home { width:100%; position:relative; padding:110px 0 30px 0; background:url(../images/mainBG.jpg) no-repeat center 100px;}

h4 { display:none;}
h4:hover { display:block; width:69px; height:69px; background: url(../images/icon_Menu.png) no-repeat #43727a center center;}
#SUBMENU { display:none;}

#ADtxt { position:absolute; right:10px; bottom:10px; font-size:24px; color:#000; font-weight:bold;}

ul.navigation { max-width:1250px; margin: 0 auto 0 auto; width:90%; font-size:16px; text-align:center; position:relative; text-align:right; font-weight:bold;}
ul.navigation li { display:inline-block; margin: 0 0 0 25px; padding: 20px 0;}
ul.navigation li a { color:#fff; display:block; width:100%; padding: 20px 0;}
ul.navigation li a:hover { color:#fff100;}

img.btnjoin { position:fixed; bottom: 0; right:0; width:200px; z-index:9999;}
img.subT-1 { margin: 0 auto 25px auto; display: block; width:90%; max-width:690px;}
img.subT-2 { margin: 0 auto 15px auto; display: block; width:90%; max-width:690px;}
img.subT-3 { margin: 0 auto 60px auto; display: block; width:90%; max-width:690px;}
img.subT-4 { margin: 50px auto 100px auto; display: block; width:80%; max-width:489px;}
img.subT-5 { margin: 40px auto 50px auto; display: block; width:90%; max-width:905px;}
img.title { width:auto; display:block; margin: 60px auto 45px auto;}

#timeinfo { border-bottom:#4d4900 1px solid; border-top:#4d4900 1px solid; padding: 25px 0;}
#BG1 { background:url(../images/speakerBG.jpg) no-repeat center top fixed; margin:0;}

#fonTxt { font-size:45px; line-height:45px; font-weight:bolder; margin: 50px 0 0 0; width:100%; color:#fff; background:#acbb41; text-align:center; padding: 60px 0;}
#fonTxt b { display:block; font-size:20px; line-height:36px; color:#fff; padding:20px 0; text-align: left; width:90%; margin: 20px auto 0 auto; font-weight:normal; max-width:1000px;}
.fonTxtSub { display:block; padding: 15px 0 0 0; font-size:26px; color:#000; font-weight:bold;}

ul.speaker { width:90%; max-width:1300px; margin: 30px auto 0 auto; text-align:center;}
ul.speaker li { width:30%; margin: 0 1% 30px 1%; display:inline-block; vertical-align:top; color:#fff; font-size:18px; line-height:28px; text-align:center;}
ul.speaker li a { color:#3e4e58;}
ul.speaker li .more { display:block; margin: 5px auto 0 auto; color:#515b60; font-size:15px; font-weight:normal;}
ul.speaker li img { width:100%; max-width:260px; display:block; margin: 0 auto 15px auto;}
ul.speaker li .name { font-size:30px; display:block; margin-bottom:10px; color:#a7b63a; font-weight:bold;}
ul.speaker li a:hover .name { color:#839406;}
ul.speaker li a:hover .more { color: #000; font-weight:bold;}
ul.speaker li.list1 { background:url(../images/01.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:26%; margin-right:2%; text-align:left;}
ul.speaker li.list2 { background:url(../images/02.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:26%; margin-right:2%; text-align:left;}
ul.speaker li.list3 { background:url(../images/03.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:26%; margin-right:2%; text-align:left;}
ul.speaker li.list4 { background:url(../images/04.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:26%; margin-right:2%; text-align:left;}
ul.speaker li.list5 { background:url(../images/05.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:26%; margin-right:2%; text-align:left;}
ul.speaker li.list1 b,
ul.speaker li.list2 b,
ul.speaker li.list3 b,
ul.speaker li.list4 b,
ul.speaker li.list5 b { font-size:32px; font-weight:bold; display:block; margin-bottom:25px; color:#acbb41; line-height:40px;}

/* -- 活動議程 -- */

#agenda { font-size:18px; margin:0 auto; width:100%; padding: 10px 0 0 0;}
.warning { display:block; margin: 15px auto; text-align:center; display:block; color:#d7c5a3;}
#agenda>b { color:#1d323c; display:block; margin: 30px auto 5px auto; font-size:15px;}
#agenda table.M { display:none;}
#agenda table.pc { width:90%; margin: 20px auto 50px auto; text-align:left; max-width:1250px;}
#agenda table.pc th { text-align: left; padding: 20px 15px; color:#fff; font-size:18px;}
#agenda table.pc th.issue1 { }
#agenda table.pc th.issue2 {}
#agenda table.pc tr.rest td { }
#agenda table.pc td { font-size:18px; padding:20px 15px; border-bottom:#999 1px solid; line-height:27px; vertical-align: middle; background:rgba(255,255,255,.3);}
#agenda table.pc td.time { font-size:15px; width:10%;}
#agenda table.pc tr.rest td.issue { color:#666}
#agenda table.pc td .speakeritem { font-size:15px; color:#999;}
#agenda table.pc td.issue { font-size:26px; color: #1d323c; font-weight:bold; line-height:25px;}
#agenda table.pc td.issue b { font-size:20px; color: #333; font-weight: normal;}
#agenda table.pc td.issue .en { font-size:16px; font-weight:normal; line-height:22px; color:#666; margin-top:5px;}
#agenda table.pc td.speaker { font-size:18px; font-weight: bold; width:40%;}
#agenda table.pc td.speaker b { font-size:24px; color:#acbb41; font-weight:bold; display: inline-block; margin-right:5px;}
#agenda table.pc td.speaker .enS { font-size:16px; font-weight:normal; line-height:22px; color:#666; margin:3px 0 8px 0; display:block;}
#agenda table.pc td.issue-1 { background:#e18532; text-align: center; padding: 20px 0; color:#fff; font-size:22px; font-weight:bold;}
.linename { color:#CCC; display:inline-block; margin: 0 10px 0 5px;}
#agenda table .en { display:block; margin: 0 0 5px 0; font-size:14px; color: #999;}
.block,
.block-2,
.block-1 { color: #acbb41; font-size:18px; font-weight: bold; display: block; margin-bottom:5px; padding: 0 20px 0 0; border-right:#e1e1e1 2px solid; width: fit-content;}
.line { display:inline-block; margin: 0 5px; color:#999; font-weight:normal; font-size:18px;}
.noteTxt { width:95%; color:#1a2f39; font-size:18px; line-height:32px; padding: 30px 0 50px 0; text-align: left; margin: 0 auto; max-width:1250px;}
.noteTxt b { font-size:24px; font-weight:bolder; display:block; margin-bottom:20px; color:#97a62d;}
.titleS { display:block; margin: 3px 0 6px 0; font-size:13px; color:#999;}

img.PIC-M { display:none;}
img.PIC-PC { display:block;}

#logo { width:100%; background:rgba(255,255,255,.85); box-shadow: 0 0 10px #333; position:absolute; top:0; left:0; padding: 33px 0 25px 0;}
#logo img { display:block; width:auto; margin: 0 auto;}

ul.notelist { width:-webkit-calc(100% - 125px); width:-moz-calc(100% - 125px); width:calc(100% - 125px); float:right; border-left:#74b088 1px solid; padding-left:30px; font-size:16px; line-height:30px; margin-top:-50px;}


/* -- Footer -- */
footer { width:100%; text-align:center; color: #666; background:#fff; padding: 45px 0 55px 0; font-size:13px; position:relative; vertical-align:middle;}
footer b { display:block;}
footer img { display:inline-block; margin: 0 25px 30px 25px; vertical-align:middle;}

iframe { 
	aspect-ratio: 1200/675;
	display:inline-block; float:left; width:40%; margin: 0 4.5% 0 0;}
}

/* --窄螢幕版型------------------------------------- */
@media screen and (min-width: 1025px) and (max-width: 1249px) {

html { background:url(../images/homeBG.gif) no-repeat center top; background-size:2000px auto;}
.logoZone { text-align:center; width:90%; max-width:1270px; margin: 0 auto; min-height:100px;}
}


/* --平板版型------------------------------------- */

@media screen and (min-width: 768px) and (max-width: 1024px) {
html { background:url(../images/homeBG.gif) no-repeat center top; background-size:1800px auto;}
#home { width:100%; position:relative; padding:150px 0 0 10%;}
img.btnjoin { position:fixed; width:150px; z-index:9999;}

a.outlink { display:block; position: absolute; left:0; top:0; z-index:9999;}
a.outlink img { display:inline-block; vertical-align: central; width:250px;}

ul.speaker { width:90%; max-width:1300px; margin: 30px auto 75px auto;}
ul.speaker li { width:47%; margin: 40px 1% 0 1%; display:inline-block; vertical-align:top; color:#fff; font-size:18px; line-height:30px; text-align:center;}
ul.speaker li img { width:100%; max-width:240px; display:block; margin: 0 auto 15px auto;}
ul.speaker li .name { font-size:32px; display:block; margin-bottom:10px; font-weight:bold;}
ul.speaker li.list1 { background:url(../images/01.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:100%; margin:0; text-align:left;}
ul.speaker li.list2 { background:url(../images/02.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:100%; margin:0; text-align:left;}
ul.speaker li.list3 { background:url(../images/03.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:100%; margin:0; text-align:left;}
ul.speaker li.list4 { background:url(../images/04.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:100%; margin:0; text-align:left;}
ul.speaker li.list5 { background:url(../images/05.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:100%; margin:0; text-align:left;}
ul.speaker li.list1 b,
ul.speaker li.list2 b,
ul.speaker li.list3 b,
ul.speaker li.list4 b,
ul.speaker li.list5 b { font-size:32px; font-weight:bold; display:block; margin-bottom:25px; line-height:40px;}

#agenda table.pc th { text-align: left; padding: 10px; font-size:15px;}
#agenda table.pc td { font-size:16px; padding:15px 10px; line-height:27px;}
#agenda table.pc td.time { font-size:15px; width:8%;}
#agenda table.pc td.issue { font-size:20px; width:42%;}
#agenda table.pc td.issue .en { font-size:15px; font-weight:normal;}

/* -- 頁籤 -- */
ul.bookmark-3 { text-align:center; margin:-30px auto 20px auto; width:90%; max-width:1270px;}
ul.bookmark-3 li { font-size:16px; text-align: center; margin: 0 1px; display:inline-block; font-weight: bold; background:rgba(255,251,0,.25); color:#fff100; position:relative; padding: 25px 0; width: calc(20% - 2px);}
ul.bookmark-3 li.click, ul.bookmark-4 li.click { background:#fff100; color:#000;}
.content { font-size:18px; line-height:30px; color:#fff; margin: 0 auto; padding: 0 0 50px 0; width:90%;}
.logoZone { text-align:center; width:90%; max-width:1270px;}
#BG1 { background:url(../images/speakerBG.jpg) no-repeat -400px top fixed; margin:0; background-size:1500px auto;}
ul.article { width:100%; background:url(../images/articleBG.jpg) no-repeat -400px top fixed #fff100; background-size:1500px auto; padding: 80px 0 50px 0;}
ul.article li { width:70%; max-width:1300px; margin: 30px auto 75px auto; position:relative; text-align:center;}
ul.article li a { display:block; width:100%; color:#333; font-size:15px; line-height:24px;}
ul.article li a img,
ul.article li a:hover img,
iframe,
video { display: block; float:none; width:100%; margin: 0 auto 30px auto; max-width:510px;}
ul.article li a .more { width:120px; font-size:15px; background:#000; color:#fff100; font-size:15px; text-align:center; padding: 10px 0; margin: 30px 0 0 0; float:right;}
ul.article li a b { font-size:30px; font-weight:bold; display:block; margin-bottom:30px; color:#000; line-height:36px;}
.logoZone { text-align:center; min-height:none;}

.noteTxt { width:90%; margin: 0 auto;}
/* -- Footer -- */
footer { width:100%; text-align:center; padding: 45px 0 55px 0; font-size:16px;}
footer b { display:block; margin: 0 auto 10px auto;}
footer img { display: block; margin: 20px auto 50px auto; vertical-align:middle; height:60px;}
}

/* --手機版型------------------------------------- */

@media screen and (max-width: 767px) {

html { background:url(../images/homeBG.gif) no-repeat left top; background-size:1100px auto;}
#home { width:100%; position:relative; padding:90px 0 0 0; background:url(../images/mainBG.jpg) no-repeat -500px 130px; background-size: 1500px auto;}
img.btnjoin { position:fixed; width:90px; z-index:9999;}

h4 { width:95px; height:70px; background: url(../images/menu.png) no-repeat center center; background-size:95px 70px; position: fixed; top:0; right:0; display:block; z-index:9999999;}
h4:hover { display:block; width:95px; height:70px; background: url(../images/menu.png) no-repeat center center; background-size:95px 70px; cursor: pointer;}

ul.navigation { display:none;}

#fonTxt b { font-size:15px; line-height:30px; width:100%; margin-bottom:0;}
#fonTxt { display:block; font-size:22px; font-weight:bold; line-height:30px; margin-bottom:15px; padding: 30px 8%;}
.fonTxtSub { display:block; padding: 15px 0 0 0; font-size:20px; color:#000; font-weight:bold;}

ul.speaker { width:90%; max-width:1300px; margin: 30px auto 75px auto;}
ul.speaker li { width:100%; margin: 40px 0 0 0; display: block; vertical-align:top; font-size:15px; line-height:24px; text-align:left;}
ul.speaker li img { width:40%; max-width:240px; display: inline-block; margin: 0 15px 15px 0; float:left;}
ul.speaker li .name { font-size:24px; display:block; margin-bottom:10px; font-weight:bold;}
ul.speaker li.list1 { background:url(../images/01.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:100%; margin:0; text-align:left;}
ul.speaker li.list2 { background:url(../images/02.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:100%; margin:0; text-align:left;}
ul.speaker li.list3 { background:url(../images/03.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:100%; margin:0; text-align:left;}
ul.speaker li.list4 { background:url(../images/04.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:100%; margin:0; text-align:left;}
ul.speaker li.list5 { background:url(../images/05.png) no-repeat left top; font-size:16px; color:#c4c4c4; line-height:24px; padding: 50px 0 0 35px; width:100%; margin:0; text-align:left;}
ul.speaker li.list1 b,
ul.speaker li.list2 b,
ul.speaker li.list3 b,
ul.speaker li.list4 b,
ul.speaker li.list5 b { font-size:32px; font-weight:bold; display:block; margin-bottom:25px; line-height:40px;}

#agenda table.pc { display:none;}
#agenda table.M { display:block;}

#agenda table.M { width:90%; margin: 0 auto;}
#agenda table.M th { text-align: left; padding: 10px; font-size:13px; color:#fff;}
#agenda table.M td { font-size:14px; padding:15px 10px; line-height:24px; border-bottom:#999 1px solid; vertical-align: middle; background:rgba(255,255,255,.3);}
#agenda table.M td.time { font-size:13px; width:6%;}
#agenda table.M td.issue { font-size:22px; width:42%; font-weight:bold; color:#1d323c;}
#agenda table.M td.issue b { font-size:15px; color: #333; font-weight: normal; margin-right:5px;}
#agenda table.M td .speaker { font-size:15px; line-height:23px; font-weight: normal;}
#agenda table.M td .speaker b { font-size:20px; display:block; margin-top:10px; font-weight:bold; color:#acbb41;}
.linename { color:#CCC; display:inline-block; margin: 0 10px 0 0;}
.block,
.block-2,
.block-1 { font-size:15px; font-weight: bold; display: block; margin-bottom:5px; padding: 0 15px 0 0; width: fit-content; border:none;}
.noteTxt { font-size:16px; line-height:30px; padding: 30px 20px; text-align:left;}
.noteTxt b { font-size:20px; font-weight:bolder; display:block; margin-bottom:20px;}

/* -- Footer -- */
footer { width:100%; text-align:center; padding: 45px 0 55px 0; font-size:13px;}
footer b { display:block;}
footer img { display: block; margin: 5px auto 30px auto; vertical-align:middle; height:40px;}

img.subT-5 { margin: -30px auto 30px auto; display: block; width:100%; max-width:none;}
img.PIC-PC { display:none;}
img.PIC-M { display:block;}

#ADtxt { font-size:18px; color:#000; font-weight:bold;}
img.title { width:60%; display:block; margin: 60px auto 45px auto;}
}

@media all {
	.lightbox { display: none; }
	.fl-page .jumbotron { margin-top: 2em; }
	.fl-page .doc { margin: 2em 0;}
	.fl-page .btn-download { float: right; }
	.fl-page .btn-default { vertical-align: bottom; }
	.fl-page .btn-lg span { font-size: 0.7em; }
	.fl-page .footer { margin-top: 3em; color: #aaa; font-size: 0.9em;}
	.fl-page .footer a { color: #999; text-decoration: none; margin-right: 0.75em;}
	.fl-page .github { margin: 2em 0; }
	.fl-page .github a { vertical-align: top; }
	.fl-page .marketing a { color: #999; }
	/* override default feather style... */
	.fixwidth {	background: rgba(256,256,256, 0.8);}
	.fixwidth .featherlight-content { width: 500px; padding: 25px; color: #fff;	background: #111;}
	.fixwidth .featherlight-close {	color: #fff; background: #333;}
}
#myVideo { position: absolute; top: 0; left: 0; object-fit: cover; min-width: 100%; min-height: 100%; width: 100%; height: 100%;}
@media(max-width: 768px){
	.fl-page h1 span { display: block; }
	.fl-page .btn-download { float: none; margin-bottom: 1em; }
}