﻿@import url("../../../icon_new_6.6/css/all.min.css");
@import url(../../../File/css/event_header.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;}
/* css reset 歸0 end */
body *{font-family: 'Noto Sans TC', sans-serif;font-weight: ;}
a{text-decoration: underline;}
a:hover{text-decoration: none;}
ul,li,h1,h2,h3,dd,dl,p{margin:0;padding:0;}
ul,li,ol{list-style-type:none;}
.bg_padding{padding:1%;}
.bgcolor0{background-color: #f6f6f6;}
.bgcolor1{background-color: #ca3815;}
.bgcolor2{background-color: #cea966;}
.bgcolor3{background: linear-gradient(to right, #e1c07e 0%, #fcf2ea 30%, #f7ead9 70%, #cfac6e 100%);}
.bgcolor4{background-color: #fec549;}
small{font-size: 0.9rem;margin: auto 0.3rem;}
/*所有元素漸變0.5秒*/

*{transition: all .5s;}

#event_master *{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;}

/*DIY--設計可增加用樣式*/
#Master_title .phone{display: none;}
.group_title,.compare_list,.student,.point_bg,.sub_des,.course_list,.course_title,.course_note{margin: 1rem 0;}
.group_title{font-size: 3.0rem;font-weight: 900;color: white;padding: 1.5rem 0 0.2rem;text-align: center;filter: drop-shadow(1px 2px 4px #862108);}
.group_title strong{padding: 0.2rem 1.2rem;font-size: 3.0rem;font-weight: 900;color: #ca3815;background-color: wheat;border-radius: 3.0rem;margin-right: 0.5rem;filter: drop-shadow(1px 2px 4px #862108);}
.group_title b{color:#f5deb3;}
.group_title2 {font-size: 3.2rem;clip-path: polygon(100% 0, 95% 50%, 100% 100%, 0% 100%, 5% 50%, 0% 0%);color: #ffffff;background: linear-gradient(to right, #bd3110 0, #fb7c36 25%, #e95623 50%, #b12c10 100%);padding: 0.3rem 4.5rem;display: block;text-align: center;width: fit-content;margin: 3rem auto 1.5rem;}
.compare_list{background-color: white;}
.compare_list,.compare_list th,.compare_list td{border: 1px solid #8b6843;border-collapse: collapse;}
.compare_list th,.compare_list td{padding: 0.5rem;}
.compare_list th{padding: 0.5rem;border: 1px solid #8b6843;border-collapse: collapse;font-size: 1.4rem;color: #ca3815;background: linear-gradient(to right, #ac7d4a 0%, #c9a774 20%, #f1dbb4 80%, #ac7d4a 100%);}
.compare_list td.new{color: #f1aa17;font-weight: bold;font-size: 1.4rem;}
.row_th td:nth-child(1){font-weight: 900;padding: 0 1rem;word-break: keep-all;background-color: #5e4831;color: wheat;}
.row_th td:nth-child(1),.compare_list th{font-size: 1.2rem;}
.student{text-align: left;padding: 0.8rem 1.0rem;background-color: #f7ead9e0;border-left: solid 10px #b13e23;}
.student dt{font-size: 1.4rem;font-weight: 900;color: #b12c10;}
.student dd{font-size: 1.1rem;}
.student dd a{padding: 0.0rem 0.5rem;font-size: 1.0rem;color: #ca3815;background-color: #ffffff;border-radius: 2.0rem;margin-left: 0.5rem;}
.page_link{ width: 50%;margin: 0.5rem auto;}
.page_link a {color: #cb311c;font-size: 2.2rem;padding:4.5rem 2.5rem;border-radius: 50%;text-decoration: none;text-align: center;background: linear-gradient(to right, #ac7d4a 0%, #c9a774 20%, #f1dbb4 80%, #ac7d4a 100%);margin: 4% 2% 1%;font-weight: bold;}
.page_link a:hover{ position:relative; top:2px; left:2px;background-color: #d09844;border: 0px #fff solid;color: #fff;}
/*vue切換*/
.Vuecontainer {}
.Vuetabs { }
.Vuetabs ul {/*     list-style-type: none; margin-left:; */}
.Vuetabs a{cursor: pointer;padding: 1rem 3rem; color: #ca3815;background: #dec69e;font-size: 1.8rem;text-align: center;
width: calc(100%/2);}
.Vuetabs a:last-child {}
.Vuetabs a:hover {opacity: 0.8;}
.Vuetabs a.active {color: #FFF;background: #ca3815;cursor: default;text-align: center;}
.Vuecontent { background: #fff; }
.tabVuecontent { padding: 2rem; }
.fade-enter-active, .fade-leave-active {transition: opacity .5s;}
.fade-enter, .fade-leave-to{opacity: 0;transition: opacity 0s;}
.sub{color: #8b6843;font-weight: 900;font-size: 2.5rem;border-bottom: solid 1px;text-align: center;}
.sub_des{padding: 0.3rem;color: #8b6843;font-size: 1.5rem;border: double;border-left: solid 9px;
    border-right: solid 9px;}
.course_box li{width:45%;color:#fff;font-size:1.2em;counter-increment:li 1;position:relative;margin:0 auto;padding:1rem;border-radius:5px;background:#cea966;}
.course_box li::before{content:counter(li);color:#fff;font-size:3rem;position:absolute;top:12px;left:8px}
.question{font-size:1.25em;font-weight:700;color:#3e5b9f;}
.question img{max-width: 80%;}
.question>figure{position:relative;display:inline-block;width:100%;height:100%;line-height:100%;background-color:#fff;overflow:hidden}
.question>figure:before,.question>figure:after{content:'';position:absolute;display:block;width:0;height:0;transition:width .3s,height .3s .3s}
.question>figure:before{bottom:0;right:0;border-right:3px solid #3e5b9f;border-bottom:3px solid #3e5b9f;}
.question>figure:after{top:0;left:0;border-left:3px solid #3e5b9f;border-top:3px solid #3e5b9f;}
.point{border:1px solid #e1c07e;margin:1% 0 2%;padding:1.5% 3%;background-color:#fffbf3;box-shadow:0 2px 1px #f1f1ee}
.point a{color:#8b6843;}
.question>figure:hover:before,.question>figure:hover:after{content:'';position:absolute;display:block;width:99.5%;height:99%}
.question>figure:hover:before{bottom:0;right:0;background-color:#fff5e35e;border-right:3px solid #3e5b9f;border-bottom:3px solid #3e5b9f;}
.question>figure:hover:after{top:0;left:0;border-left:3px solid #3e5b9f;border-top:3px solid #3e5b9f;}

.course_title{background: #3e5b9f;color: white;width: 100%;padding: 0.3rem 3rem;font-size: 1.8rem;display: inline-block;margin: 1.6rem auto -9px;clip-path: polygon(100% 0, 98% 50%, 100% 100%, 0% 100%, 2% 50%, 0% 0%);text-align: center;}
.course_title2{color: white;width: 100%;padding: 0.3rem 3rem;font-size: 1.8rem;display: inline-block;margin: 1.6rem auto -9px;text-align: center;background: linear-gradient(to right, #ffffff00 0%, #ffe2a540 10%, #ffe2a540 90%, #ffffff00 100%);}
.course_list{background-color: white;margin-bottom: 2rem;}
.course_list,.course_list th,.course_list td{border: 1px solid #8b6843;border-collapse: collapse;}
.course_list td{padding: 0.5rem;font-size: 1.2rem;}
.course_list td:nth-child(even){background: #f5deb34f;}
.course_list:nth-of-type(4) td:nth-child(even){background: #fff;}
.course_list td a{color: #ca3815;}

.course_list th{padding: 0.5rem;border: 1px solid #8b6843;border-collapse: collapse;font-size: 1.4rem;color: #ca3815;background: linear-gradient(to right, #ac7d4a 0%, #c9a774 20%, #f1dbb4 80%, #ac7d4a 100%);}
.course_list th{font-size: 1.2rem;}
.course_note li{list-style: none;text-align: left;font-size: 1.2rem;color: #f5deb3;text-align: center;}
.course_note li strong{font-size: 1.5rem;color: #f5deb3;font-weight: bold;}
.ps{color: #faa591;font-size: 1.0rem;margin: -1rem auto 1rem;}
/*LINE&FB&banner舊稿複製*/
.LINE,.FB,.social_txt,.QRcode{float:left}
.LINE,.FB{width:50%;padding:2%}
.social_txt{width:70%;text-align:left}
.socialTitle{color:#ffed00;font-weight:700;font-size:1.7em;margin-bottom:2%}
.social_txt p{font-size:1.5em;line-height:1.6em}
.social_txt p,.QRcode a{color:#FFF}
.QRcode{text-align:center;font-size:1.3em}
.LINE{background:#44ba44}
.FB{background:#395692}
.mt_line img{width: 140px!important;height: 140px!important;}
.QRcode img{max-width:100%}
.link_box{margin:1% auto 2%}
.link_box>ul>li{width:calc(100%/3 - 10px);margin:0 auto;overflow:hidden}
.link_box>ul>li a:hover{transform:scale(1.05)}
.link_box>ul>li a{color:#000;display:inline-block}
.link_box>ul>li img{width:100%}




/*各大相容檢視*/
@media all and (min-width: 1px) and (max-width: 1200px){
	#Master_title .top_ad{display: none;}
	#Master_title .phone{width: 100%;display: inherit;}
    .LINE,.FB{width:100%;padding:3% 4%}
    .social_txt{width: 100%;}
    .link_box>ul>li{width:90%;margin:2% auto;text-align: center;}
    .link_box figcaption{text-align: center;}
    .qrimg{display: flex;flex-wrap: wrap;justify-content: center;}
    .QRcode{float: none;}
    .vl_text:nth-child(2) {
        right: 0rem;
    }
    .social_txt {
        text-align: center;
    }
@media (max-width: 767px) {
    .out_tb{overflow-x: scroll;}
    .compare_list{width: 700px;}
	.group_title {font-size: 1.7rem;padding: 0.5rem 0 0.2rem;}
	.group_title b {display: block;}
	.group_title strong {font-size: 1.8rem;display: block;width: max-content;margin: auto;}
	.group_title2 {font-size: 1.8rem;padding: 0.3rem 2.5rem;}
	.group_title2 span {display: block;}
	.course_box li{width:68%;padding:5% 7% 4% 12%;margin:1% auto;}
	.Vuetabs a {padding: 1rem 1rem;font-size: 1.5rem;}
	.compare_list td.new {font-size: 1.2rem;}
	.sub {font-size: 2.0rem;}
	.course_list {margin-bottom: 1rem;}
	.course_title {padding: 0.3rem 2rem;font-size: 1.5rem;margin: 0.6rem auto -9px;text-align: center;}
	.course_title2 {font-size: 1.5rem;}
    .page_link {width: 80%;}
	.page_link a {font-size: 1.5rem;padding: 2.5rem 1rem;}
    .tb_out{overflow-x: scroll;}
	.course_list {width: 150%;}
}
}
@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 {
}

/*站內原有樣式*/
#BodyContent{width:100%;padding:0;margin:0;	}
#BodyContainer_event{width:100%;margin:0;}
#BodyHeader_event_rwd{display:none;}

/*資料集中1200px寬外框*/
#event_master,#event_sec,#event_third,#event_fourth,#event_fifth{margin:0 auto;display:inline-block;width:1200px;padding:10px 0;}
#Master_title{display:block;}/*主圖位置ID*/

/*瀏覽器相容性通知*/
#noie{color: #FFF;width: 100%;height:60px;text-align: center;border: 1px solid #006699;	background-color: #3399CC;_z-index: 9999;z-index: 9999;	position:fixed; _top:expression(documentElement.scrollTop+"px");
    /*讓選單覆蓋內容不會隨著捲軸滑動而消失專用*/
left: 0;top: 0;}
#noie a{color: #FC0;}
.hottxt{ color: #ffd942; font-size: 13px; }

/* bodyHeader */
#BodyHeader_event,#header-share {width:100%;float:left;}
#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;display: inline;}
#BodyHeader_event a {color: #333;}
#BodyHeader_event a:hover {color: #666;/*position: relative;top: 2px;bottom: 2px;*/}


/*ask*/
#askarea SELECT {color: black;background-color: white;}
#askarea_out{background-color: #339966;}
#askarea{width: 1200px;margin: 0 auto;padding: 1rem 5rem;text-align: left;}
#askarea .asktitle{color: white;text-align: center;font-size: 1.4rem;}
#formlist SELECT,#formlist input{border-radius: 0.3rem;background-color: #FFF;border: #FFF;padding: 0.25rem;}
#formlist input[name="sContent"]{width:80%;}
#formlist label{display: block;margin: 1rem 0;color: white;font-size: 1.2rem;}
#formlist img{display: inline-block;}
#formlist input{color: #A1A1A1;}
#formlist input[type="submit"],#formlist input[type="reset"]{background-color: #eb543f;color: white;}
label > select {margin: 0 1rem;}
#formlist{justify-content: space-around;}


/* 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{width:10%;height:auto;vertical-align: middle;display: inline;}
#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;line-height: 2em;text-align: center;font-size: 1em;	list-style-type: none;	display:inline-block;}
/* Footer end */
@media (min-width:1201px) {
    #topbutton{display: none;}
    
}

@media all and (min-width: 1px) and (max-width: 1200px){
    
    @media (min-width: 768px) and (max-width: 1200px){
        .menu_btn {top: 1rem!important;}
    }
	
/*修正獨立event選單click按鈕大小*/
/* .st-content img{
    width: unset!important;
    height:unset!important;
}  */
/*TOP*/
#topbutton{width:50px;height:50px;color:#FFF;border-radius:50%;background-color:#000;opacity:.4;right:1%;bottom:17%;position:fixed;line-height:50px;font-size:15px;text-align:center;z-index:99}
#topbutton a{color:#FFF;text-decoration:none;line-height:50px}

.feature_group{width: calc(100%/1);}
.books > div:nth-child(1),.books > div:nth-child(2){display: none;}


/*****站內原有樣式Mobile*****/
/*隱藏的區塊*/
#BodyHeader_event,.hottxt,#noie{display:none;}
/*會撐開的版面控制*/
#BodyContent{width: 100%;padding:0;}
#BodyContainer_event{width: 100%;}
/*會撐開的版面控制END*/
/* 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;display: initial;padding: 0;}
/*orientation: portrait   直式
 orientation: landscape  橫式*/
#BodyHeader_event_rwd img {height: auto;margin:2.5% auto;}
@media screen and  (orientation:portrait) {#BodyHeader_event_rwd img {max-width: 50%;}}
@media screen and  (orientation:landscape) {#BodyHeader_event_rwd img {max-width: 25%;}}
/*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%;}}

/*資料集中1200px寬外框*/
#event_master,#event_sec,#event_third,#event_fourth,#event_fifth{margin:0 auto;display:inline-block;width:100%;}
/*ask*/
#askarea{width: 100%;padding: 0.8rem;}
#askarea .asktitle{font-size: 1.1rem;}
#askarea .asktitle > p{line-height: 2.2rem;}
#formlist{margin: 0 auto;}
#formlist label{font-size: 1.0rem;}
#formlist input[name="sContent"],#formlist label,#formlist SELECT,#formlist input{width:100%;margin: 0.25rem 0;}
#formlist input[type="submit"],#formlist input[type="reset"]{width: calc(100%/4.5);}


/*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;display: initial;}
@media screen and  (orientation:portrait) {#topli{right:1%;bottom:8%;}}
@media screen and  (orientation:landscape){#topli{right:1%;bottom:15.8%;}}


/* 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{width:40%;height:auto;margin-bottom:2%;margin: 0 auto;}
#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}
/* Footer end */

}


