﻿@import url("../../../icon_new/css/all.min.css");
/*css reset 歸0*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,caption,tfoot,thead {margin:0;padding:0;border:0;outline:0;font-size:100%;line-height:1.5em;}
blockquote,q {quotes:none;}
blockquote:before,blockquote:after,q:before,q:after {content:'';content:none;}
/*remember to define focus styles!*/
:focus {outline: 0;}
/*remember to highlight inserts somehow!*/
ins {text-decoration: none;}
del {text-decoration: line-through;}
/*所有元素漸變0.5秒*/
* {transition: all .5s;}
/*Back to top button */
#back-top {position: fixed;bottom: 30px;margin-left: -150px;right: 1%;z-index: 99;}
#back-top a {width:50px;height:50px;border-radius:50%;display: block;text-align: center;font: 11px/100% Arial, Helvetica, sans-serif;text-transform: uppercase;text-decoration: none;color: #bbb;transition: 1s;}
#back-top a:hover {color: #000;}
/*arrow icon (span tag)*/
#back-top span {width:50px;height:50px;display: block;margin-bottom: 7px;background: rgba(99, 99, 99, 0.74) url(../images/up-arrow.png) no-repeat center center;/*rounded corners*/border-radius:50%;/*background color transition*/transition: 1s;}
#back-top a:hover span {background-color: #777;}
/*body {font-family:"微軟正黑體", Arial;background: linear-gradient(to left, rgb(0 188 212 / 24%) 0%, rgb(255, 255, 255) 20%, rgb(255, 255, 255) 80%, rgb(249 255 193) 100%)}*/
body {font-family: 'Noto Sans TC', sans-serif;background:linear-gradient(to left,rgb(0 188 212/24%) 0%,rgb(255,255,255) 20%,rgb(255,255,255) 80%,rgb(249 255 193) 100%);/* background:url(../images/1111033_bg.jpg);*/background-size:114% 38%;background-position:0% 1%;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;}
a {text-decoration: underline;}
a:hover {text-decoration: none;}
ul,li {margin: 0px;padding: 0px;}
/*.bgcolor {background-color: #00bcd4a8;border-radius: 0 80px 0 80px;}*/
.bgcolor { background-color: #00bcd4a8; border-radius: 0 80px 0 80px; background: linear-gradient(to left,rgb(0 188 212/36%) 25%,#ffffffc4 35%,#ffffff87 65%,rgb(248 69 160/39%) 100%); }
.text-2xl {font-size: 1.5rem;}
.text-4xl {font-size: 2.25rem;}
.flex {display: flex;}
.flex-wrap {flex-wrap: wrap}
.justify-center {justify-content: center;}
h1 {font-size: 3rem;}
h2 {font-size: 2.5rem;}
h3 { font-size: 3.33rem; text-align: center; font-family: "Microsoft YaHei"; color: #ff5722; text-shadow: 0 0 5px #fff,0 0 10px #fff,0 0 16px #fff,0 0 16px #fff,0 0 16px #fff; letter-spacing: 8px; font-weight: normal; }
.main_title h1 { font-size: 6rem; letter-spacing: -2px; color: #70027ceb; text-shadow: 0 0 5px #fff,0 0 10px #fff,0 0 16px #fff,0 0 16px #fff,0 0 16px #fff; font-family: "Microsoft YaHei"; }
.main_title h2 { font-size: 3.5rem; line-height: 4rem; color: #f845a0; letter-spacing: -3px; text-shadow: 0 0 5px #fff,0 0 10px #fff,0 0 16px #fff,0 0 16px #fff,0 0 16px #fff; }
.main_title h3 { font-size: 2.25rem; text-align: center; font-family: "Microsoft YaHei"; color: #ff5722; text-shadow: 0 0 5px #fff,0 0 10px #fff,0 0 16px #fff,0 0 16px #fff,0 0 16px #fff; }

/*客製化從此*/
.sessions .indent{text-indent: 3em;}
/* bar */
.bar { width: 155px; height: auto; padding: 1rem; position: fixed; top: 36%; right: 0; z-index: 5; background-color: rgba(255,255,255,0.45); border-radius: 30px 0 0 30px; font-size: 1.2rem; font-weight: bold; text-align: center; display: flex; flex-wrap: wrap; justify-content: center; }
.bar a{color: black;}
.bar a:hover{color: #ee3100;}
.bar ul{display: flex;flex-wrap: wrap;justify-content: space-around;list-style: none;}
.bar img{max-width: 100%;vertical-align: bottom;}
/*主圖*/
.main_title{display: flex;align-items: center;justify-content: center;} 
.main_title img{width: auto;}
.main_title h1{margin: 0 0.7rem 0 0.5rem}
/*標題*/
.title{font-size:3rem;font-weight: 900;}
.subtitle{font-size: 2.5rem;font-weight: 900;text-align: center;}
.subtitle i { color: #F09; text-shadow: 0 0 5px #fff,0 0 10px #fff,0 0 16px #fff,0 0 16px #fff,0 0 16px #fff; font-size: 3rem; margin-right: 2%; }
iframe { width: 100%; height: auto; aspect-ratio: 16/9; }
.video_container{display: flex;justify-content: space-around;margin-top: 2.5rem;}
.video_content{width: 48%;}
.video-txt { background: #ee6a00; color: #fff; border-radius: 0px 0px 50px 50px; padding-bottom: 3%; }
.video-txt .subtitle {font-size:2.4rem;line-height:3rem;padding-top:2%;padding-bottom:2.1%;font-weight:900;/* color:#b38700;*//* text-shadow:0 0 5px #fff,0 0 10px #fff,0 0 16px #fff,0 0 16px #fff,0 0 16px #fff;*/  text-align:center;color:#fff;}
.transfer .subtitle { font-size: 2.5rem; line-height: 3rem; font-weight: 900; color: #074D83; text-shadow: 0 0 5px #fff,0 0 10px #fff,0 0 16px #fff,0 0 16px #fff,0 0 16px #fff; margin-right: 5%; margin-bottom: 3%; text-align: left; display: flex; }
#event_third .subtitle{font-size:3rem;line-height:3.2rem;/* font-weight:900;*/color:#ff5722;text-shadow:0 0 5px #fff,0 0 10px #fff,0 0 16px #fff,0 0 16px #fff,0 0 16px #fff;margin-bottom:1.8%;}
#event_sec .video .title{font-size:3rem;line-height:3.2rem;/* font-weight:900;*/color:rgb(255, 255, 255);margin-bottom:1.8%;box-shadow: 0 15px 10px rgba(129, 132, 149, 0.4); padding: .5rem 0;background: #ee6a00;}
#event_third .subtitle i{ color:#F09;text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 16px #fff, 0 0 16px #fff, 0 0 16px #fff;font-size: 3rem}
#event_master .subtitle { font-size: 3rem; line-height: 3.2rem; font-weight: 900; color: #ff5722; text-shadow: 0 0 5px #fff,0 0 10px #fff,0 0 16px #fff,0 0 16px #fff,0 0 16px #fff; margin:2% 0;}
#event_fourth .gift .title { font-size: 3.3rem; font-weight: normal; color: #ff52a7; margin: 0.5%; }
#event_fourth .video .title { font-size: 3.3rem; font-weight: normal; color: #ee6a00; margin: 0.5%; }
.icon { color: #e9dc7c; font-size: 1em; margin-right: 0.5rem; }
.video { margin-bottom: 2rem; }
.video-container {padding:1rem;/* border:10px #ee6a00 solid;*/background-color:#ee6a00;}
.videobox { position: relative; width: 100%; height: 0; padding-bottom: 56.25%; }
.videobox iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#event_fourth .title i{text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 16px #fff, 0 0 16px #fff, 0 0 16px #fff;}
.focus{color: #ff0000;background-color:#FFF;display: inline-block;padding: 0.5rem 1rem;border-radius: 50px;font-size: 1.5rem;font-weight: 700;margin-top: 0.5rem;text-align: center;}
/*預約*/
.lecture {border-radius: 10px;margin: 1rem 0;box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;background-color: #FFF;padding-bottom: 0.8rem;margin-bottom: 2.5rem;border: dashed skyblue 1px;}
.lecture .address{color: #ee6a00;text-align: center;margin-bottom: 2rem;}
.lecture .sessions dl{margin: 2rem 2rem;background-color: #d4d4d447;padding: 1rem 2rem;border-radius: 10px;width: 50%;}
.lecture .sessions dl .suject{background-color:#a1b617;color: #FFF;padding: 0 1rem;border-radius: 25px;margin-right: 1rem;}
.lecture .question dl dt{text-align: center;color:#074D83;font-size: 2.5rem;font-weight: 900;margin-bottom: 0.8rem;}
.lecture .question {font-size: 1.8rem;}
.reserve{color:#ee6a00;font-size: 2.8rem;font-weight: 900;text-align: center;}
.lecture a,.sessions a{color: #074D83;text-decoration: none;}
/*連結*/
.link{display: flex;justify-content: center;margin: 0rem 2rem 1.5rem;}
.link a {color: #fff;text-decoration: none;margin:1rem;width:100%;padding:0.4rem 2rem;color:#fff;background-color:#ee6a00;border-radius:50px;text-decoration:none;text-align:center;font-size:1.5rem;}
.link a:hover{background-color: #00bcd4;}
.link>div{cursor: pointer;}
.emoji{font-size: 2.5rem;}
.sessions,.question{text-align: justify;display: flex;justify-content: center;}
.sessions .icon {margin: 45px 18px 0px -5%;}
.sessions dd{font-size: 1.8rem;padding: 0.5rem;}
.sessions dd i { color: #974a9f; font-size: 2rem; }
.sessions .icon img{padding-left: 3rem;}
.transfer{display: flex;align-items: flex-end;}
.transfer dl {padding: 1% 2% 5%;}
.transfer dd { text-align: justify; font-size: 1.2rem; line-height: 2rem; }
.answer li { list-style-type: disc; }
.lecture .question dd{margin:0.5rem 0;}
/*設計專用樣式Start*/
.br_pc{ display:block;}
.gift_des i{ color:#bc65cb;}

/*設計專用樣式END*/


@media (min-width: 1201px) {
    /*body*/
    #BodyHeader_event,#header-share {width:100%;}
    #BodyHeader_event a,#BodyHeader_event #header-share {font-size: 1.1em;}
    #BodyHeader_event #header-share {margin:0 auto;	background-color: #FFF;}	
    #BodyHeader_event #header-share img {margin-bottom: 5px;}
    #BodyHeader_event a {color: #333;}
    #BodyHeader_event a:hover {color: #666;/*position: relative;top: 2px;bottom: 2px;*/}
    #BodyContent {width:100%;padding:0;margin:0;	}
    #BodyContainer_event {width:100%;margin:0;}
    #BodyHeader_event_rwd,#topli {display:none;}
    /*event*/
    .row100 {width:100%;}/*滿百100%區域*/
    #event_master {margin: 0% auto;display: inline-block;width: 1180px;padding: 60px 10px 10px;font-size: 1.4rem;}/*資料集中1200px寬外框*/
	#event_sec,#event_third,#event_fourth,#event_fifth {margin:2% auto;display:inline-block;width:1180px;padding:10px;font-size: 1.4rem;}/*資料集中1200px寬外框*/
    #Master_title {display: block;padding:0 0 1.5%;}/*主圖位置ID*/
    /*footer*/
    #BodyFooter_rwd,#footer_inline ul,#footer_inline ul li,#footer_address,#footer_address ul,#footer_address ul li {width:100%;}
    #BodyFooter_rwd {float: left;background-color:#FFF;}
    #BodyFooter_rwd a:hover {text-decoration: none;}
    #BodyFooter_rwd #footer_line {width: 90%;height: auto;margin:1% 5%;display: block;float: left;text-align: center;border-top: thin solid #999;}
    #BodyFooter_rwd #footer_inline a {color: #000;font-size:1em;}
    #BodyFooter_rwd #footer_inline ul {float: left;padding:0;margin:3% auto 0% auto;}
    #BodyFooter_rwd #footer_inline ul li {display: inline;line-height: 2em;font-size: 1em;	clear: both;	margin-right: 0.5em;}
    #BodyFooter_rwd #footer_inline ul li img {height:auto;vertical-align: middle;}
    #BodyFooter_rwd #footer_address {margin: 0% auto auto auto;text-align: center;}
    #BodyFooter_rwd #footer_address a {color:#000;}
    #BodyFooter_rwd #footer_address ul {padding:0;margin-bottom: 1%;text-align: center;}
    #BodyFooter_rwd #footer_address ul li {margin-right:0;float:left;line-height: 2em;text-align: center;font-size: 1em;	list-style-type: none;	display:inline-block;}
    /*ask*/
    #askarea_out * {font-family:"微軟正黑體";font-size:1em}
    #askarea_out {background-color:#00bcd4;width:100%;display:inline-block;text-align:left;border-radius: 0 80px 0 0;}
    #askarea {width:1200px;margin:0 auto}
    #askarea img {width:8%;height:auto}
    #askarea p {margin-top:1%;margin-bottom:1%;font-size:1.1em}
    #askarea .asktitle,#askarea .asktitle p {text-align:center;margin-top:2%;}
    #askarea .asktitle {color:#FFF;font-size:1.4em}
    #askarea #formlist {width:80%;margin:2% auto;color:#FFF}
    #askarea SELECT,#askarea input {border-radius:7px;background-color:#FFF;border:#FFF;padding:.5%;margin:auto 1% 1% auto;}
    #askarea SELECT {width:19.7%}
    #askarea input {color:#585858}
    #askarea input[name="sContent"] {width:50%}
    #askarea input[type="text"] {width:40%;height:20px}
    #askarea input[type="radio"] {margin-left:3%}
    #askarea input[type="submit"],#askarea input[type="reset"] {width:11%;height:45px;color: #fff;background-color: #b6ad17;padding: 0.5em;font-weight: bold;border: 2px #fff solid;}
    /*瀏覽器相容性通知*/
    #noie {color: #FFF;width: 100%;height:60px;text-align: center;border: 1px solid #006699;	background-color: #3399CC;z-index: 9999;position:fixed; _top:expression(documentElement.scrollTop+"px");/*讓選單覆蓋內容不會隨著捲軸滑動而消失專用*/left: 0;top: 0;}
    #noie a {color: #FC0;}
    .hottxt { color: #ffd942; font-size: 13px;}    
}

@media (max-width: 1200px) {
    /*隱藏的區塊*/
    #BodyHeader_event,.hottxt,#noie,.toparea {display:none;}
    /*會撐開的版面控制*/
    #BodyContent {width: 100%;padding:0;}
    #BodyContainer_event {width: 100%;}
    /*header*/
    #BodyHeader_event_rwd {text-align:center;width:100%;height:auto;margin:0 auto;background-color:#FFF;position:fixed;top:0;float:left;z-index:9;}
    /*portrait直式 landscape橫式*/
    #BodyHeader_event_rwd img {height: auto;margin:2.5% auto 0;}
    @media screen and (orientation:portrait) {#BodyHeader_event_rwd img {max-width: 50%;}}
    @media screen and (orientation:landscape) {#BodyHeader_event_rwd img {max-width: 25%;}}
    /*滿百100%區域*/
    .row100 {width:100%;}
    /*資料集中1200px寬外框*/
    #event_master,#event_sec,#event_third,#event_fourth,#event_fifth {margin:2% auto;display:inline-block;width:96%;padding:1%;}
    /*body*/
    #Master_title {display:block;}/*主圖位置ID*/
    @media all and (orientation : portrait) {#Master_title {margin-top: 15%;}}
    @media screen and  (orientation:landscape) {#Master_title {margin-top: 10%;}}
    /*event*/    
    .focus { display: block; margin: 0 15%; font-size: 1.2rem; }
    /*footer*/
    #BodyFooter_rwd,#footer_line,#footer_inline ul,#footer_inline ul li,#footer_address,#footer_address ul,#footer_address ul li {width:100%;float: left;}
    #BodyFooter_rwd {background-color:#FFF;margin-top:5%;}
    #BodyFooter_rwd #footer_line {margin:5% auto 3%;display:block;height:auto;text-align:center;border-top:thin solid #999}
    #BodyFooter_rwd #footer_inline a {color: #000;line-height: 2em;}
    #BodyFooter_rwd #footer_inline ul {padding:0;margin-bottom:1%;text-align:center}
    #BodyFooter_rwd #footer_inline ul li img {max-width:40%;height:auto;margin-bottom:2%}
    #BodyFooter_rwd #footer_inline ul li {display:inline-block;margin-right:auto;line-height:2em;font-size:1em;clear:both}
    #BodyFooter_rwd #footer_address {margin: 0% auto auto auto;text-align: center;}
    #BodyFooter_rwd #footer_address a {	color: #000;line-height: 2em;}
    #BodyFooter_rwd #footer_address ul {padding:0;text-align:center;margin-bottom:1%;clear:both}
    #BodyFooter_rwd #footer_address ul li {display:block;line-height:2em;text-align:center;font-size:.8em}
    /*ask*/
    #askarea {background-color:#00bcd4;width: 98%;height: auto;float: left;padding:4% 1% 2% 1%;}
    #askarea .asktitle,#askarea .asktitle p {text-align: center;}
    #askarea .asktitle {font-size: 1.0em;color: #FFF;/*margin-bottom:5%;*/}
    #askarea p {margin:0% auto auto 5%;	width: 90%;}
    #formlist {width: 99%;float: left;margin:2% auto auto 0%;padding-right:1%;font-size: 0.8em;color: #FFF;}
    input[name="sContent"] {width:50%;}
    input[type="text"] {width:99%;}
    SELECT,input {border-radius: 7px;font-size: 1.0em;margin:auto 1% 3% auto;background-color: #FFF;height:30px;}
    SELECT {width:100%;border: #FFF;	padding: 0.5%;}
    input {border: #FFF;padding: 1%;color: #585858;}
    input[type="submit"],input[type="reset"] {color:#fff;background-color:#b6ad17;-webkit-appearance:none;/*ios系統專用，默認的系統樣式*/font-size:1.2em;margin-top:5%;padding:2% 4%;height:auto}
    input[type="radio"] {width:1em;height:1em;margin-left: 3%;}
    /*TOP按鈕*/
    #topli,#topli a {color: #fff;text-decoration: none;}
    #topli {width:50px;height:50px;text-align:center;border-radius:9999em;background-color:#000;opacity:.4;position:fixed;line-height:50px;font-size:15px;}
    @media screen and (orientation:portrait) {#topli {right:1%;bottom:8%;}}
    @media screen and (orientation:landscape) {#topli {right:1%;bottom:15.8%;}}
}

@media (min-width: 992px) and (max-width: 1199px) {
    
}

@media (min-width: 768px) and (max-width: 991px) {   
}

@media (max-width: 767px) { 
/* .video-container{padding: 0;margin:0;} */
.bar { width: 86%; height: auto; padding: 0.5% 1% 1%; position: fixed; top: initial; bottom: 0; right: 0; left: 0; z-index: 5; background-color: rgb(7 77 131); border-radius: 0; text-align: center; align-items: center; justify-content: space-around; margin: 0 auto; border-radius: 12px 12px 0 0; }
.bar2{justify-content: right;}
/* .bar ul{width: 75%;} */
.bar li{margin: 0 0.5rem;}
.bar img{display: none;}
.bar ul { display: flex; flex-wrap: wrap; justify-content: space-around; list-style: none; background-color: rgb(7 77 131/85%); }
.bar ul a {color: #fff;font-size: 1rem;}
.br_mb{ display:block;}
.transfer .subtitle br{ display:none;}
.main_title img{ width:94%;}
.main_title h1 { margin: 0 0.4rem 0 0.4rem; }
.main_title h1 { font-size: 2.5rem; letter-spacing: 0; color: #70027ceb; text-shadow: 0 0 5px #fff,0 0 10px #fff,0 0 16px #fff,0 0 16px #fff,0 0 16px #fff; font-family: "Microsoft YaHei"; }
.main_title h2 {font-size: 1.8rem;line-height: 2rem;}
h3 { font-size: 1.2rem; letter-spacing: 2px; margin-bottom: 4%; }
.sessions dd {font-size: 1.2rem;}
.link{flex-wrap: wrap;}
.link a { color: #fff; padding: 1% .7%; background-color: #ee6a00; border-radius: 50px; text-decoration: none; text-align: center; font-size: 1rem; width: 23%; }
.transfer{ padding:5%;flex-wrap: wrap;}
.transfer dd { text-align: justify; font-size: 1rem; line-height: 1.8rem; margin-bottom: 5%; }
.transfer .subtitle { font-size: 1.5rem; line-height: 2rem; font-weight: 900;}
.video-txt .subtitle { font-size: 1.5rem; line-height: 2rem; font-weight: 900; color: #fff; }
.subtitle i {font-size: 2rem;display: block;}
#event_third .subtitle i {font-size: 2.3rem;display: contents;}
#event_third .subtitle,.video .title,#event_sec .video .title{font-size: 1.6rem;line-height: 2.3rem;text-align: center;margin-top: 3%;}
.video_container{flex-wrap: wrap;margin-top: 1rem;}
.video_content{width: 98%;margin-top: 0.5rem;}
.question {padding: 3% 10% 10%;}
#event_fourth {padding: 2%;}
#event_fourth .title {font-size: 1.6rem;line-height: 2.3rem;text-align: center;}
.link {margin: 0rem;}
.bgcolor {border-radius: 0 50px 0 50px;}
.main_title {padding: 4% 0 1%;}
.transfer dl {margin: 1.5rem auto;display: contents;padding: 2%;}
.sessions .icon img {/* width: 80%; */width: 150px;margin: 8% 0 0;}
.sessions .icon {margin: 0 -19px -53px 3px;margin: 0;}
.sessions { text-align: justify; display: flex; align-items: center; flex-direction: column; }
#event_fourth .video .title {font-size: 1.9rem;margin: 1.5% 0.5% 1.5%;}
#event_fourth .gift .title {font-size: 1.8rem;font-weight: bold;margin: 0.5% 0.5% 2.5%;}
.video-txt .des {padding: 0 5%;text-indent: -3.2rem;margin-left: 10%}
.icon {font-size: 1rem;margin-right: 0.5rem;margin-left: 10%;}
#back-top span {width:40px;height:40px;}
.lecture .question dl dt{font-size: 1.5rem;}
.lecture .question{font-size: 1.1rem;}
.lecture .sessions dl{width: 75%;margin: 0.5rem 2rem;}
.ps{font-size: 1rem;margin-left:1.2rem;}


}

@media screen and (-webkit-min-device-pixel-ratio:0) { /*Webkit*/
}
@-moz-document url-prefix() {/*Firefox*/
}
@media \0screen\,screen\9 {/*IE 6 7 8*/
}
@media screen\0 {/*IE 8 9 10 11*/
}
@media print {
}