@import url(../../../File/icon/css/all.min.css);
:root {
/* --red: #f54337; */
--red:#c4413d;
--blue: #0f8cce;
--yellow:#ffff00;
--pink:#dd005c;
/* --darkBlue :#0173a6; */
--darkBlue : #185c77;
--grey:#3f3f3f;
--white :#fff;
--linear_red:linear-gradient(45deg, #d6635d, #c1423e);
--linear_red_light:linear-gradient(45deg, #cf5e5a, #e8726e);
--linear:linear-gradient(90deg,#5b3ab7 0%, #4d56b1 9%,#9451b5 80%,#d43686 98%);
/* --linear_transparent:linear-gradient(90deg,#5b3ab7bd 0%, #4d56b1bd 9%,#9451b5bd 80%,#d43686bd 98%); */
--linear_transparent:linear-gradient(-90deg, #d98d9a 0%, #db8c9a 9%, #efb1bc 80%, #e6a0ae 98%);
--linear_light: linear-gradient(45deg, #d7b2da,#c2b2e4,#bab6e5,#c6c6f1, #b4cedb);
/* --img_bg :url(../images/1205035_bg.png) no-repeat center / cover; */
--img_bg :url(../images/1404072_bg.jpg) no-repeat center / cover;
}
ul,li{list-style:none}
*{transition:all .5s;-webkit-transition:all .5s;-moz-transition:all .5s;-o-transition:all .5s;box-sizing:border-box}
a , .answer_list th , .note{word-break: keep-all;overflow-wrap: break-word;-webkit-hyphens: auto;-moz-hyphens: auto;hyphens: auto;-webkit-text-size-adjust: 100%;}
a:hover{transform:scale(1.03);text-decoration: none;}
.w-full{width:100%}
/*對齊*/
.justify-center {justify-content: center;}
.justify-around {justify-content: space-around;}
.content-around{align-content: space-around;}
.items-center {align-items: center;}
.text-left {text-align: left;}
.text-center {text-align: center;}
.text-right{text-align: right;}
/*內外距*/
.p-0 {padding: 0;}.p-2 {padding: 0.5rem;}
.p-4 {padding: 1rem;}.p-3 {padding: 0.75rem;}
.px-2 {padding-left: 0.5rem; padding-right: 0.5rem;}
.m-1 {margin: 0.25rem;}.m-2 {margin: 0.5rem;}
.mr-1 {margin-right: 0.25rem;}.mr-2 {margin-right: 0.5rem;}
.mr-3 {margin-right: 0.75rem;}
.mt-2 {margin-top: 0.5rem;}.mt-3 {margin-top: 0.75rem;}
.my-auto {margin-top: auto;margin-bottom: auto;}.mx-auto {margin-left: auto; margin-right: auto;}
.mx-0 {margin-left: 0; margin-right: 0;}.my-1 {margin-top: 0.25rem;margin-bottom: 0.25rem;}
.mx-1 {margin-left: 0.25rem;margin-right: 0.25rem;}
.my-2 {margin-top: 0.5rem;margin-bottom: 0.5rem;}.my-4 {margin-top: 1rem;margin-bottom: 1rem;}
.my-0 {margin-top: 0; margin-bottom: 0;}
/*字級*/
.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}
.text-base{font-size:1rem}.text-lg{font-size:1.125rem}
.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}
.text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}
.text-5xl{font-size:3rem}.text-6xl{font-size:4rem}
.leading-loose {line-height: 2;}
.font-bold {font-weight: 700;}
.font-extrabold {font-weight: 800;}
.font-black {font-weight: 900;}

/*相關連結*/
#Related{width:100%;padding:1rem 0;margin: 1rem auto 0;background:#369fc6;background: var(--img_bg);box-shadow: 0 -2px 3px #0000001f;}
#Related ul.rela_out{width: calc(100% - 6%);margin:0 auto;text-align:center}
.rela_out li a,.rela_out li{font-size:1.12rem;font-weight: 600;color:var(--white);color: var(--darkBlue);}
.rela_out li a:hover{color: var(--red)/*var(--pink)*/;font-size: larger;}
.rela_out li{display:inline-block;margin:.3% 1.2%}

/* .bgcolor0{background: linear-gradient(122deg,#ffff9d 9%,#0f8cce 18%, #0f8cce 24%,#0f8cce 47%,#ffff9d 60%);} */
.bgcolor0{background: var(--linear_transparent);}

[class*="flex"]{display:flex;flex-wrap:wrap;display:-ms-flexbox;}
#event{font-family:"Microsoft JhengHei"}
#event i{margin-right:2px}
#event h1{font-size:2.3rem}
#event h2{font-size:2rem}
#event h3{font-size:1.8rem}
small{font-size: smaller;}

/*主圖*/
.banner img{width: 100%;max-width:100%;}
/* .masterBanner img{max-width:100%;}
.masterBanner{width: 100%;margin: 0 auto;display: grid;grid-template-columns: repeat(4,25%);grid-template-rows: repeat(3,33.3%);padding: 4% 0 0;    height: 490px;overflow: hidden;    position: relative;}
.masterBanner .title{grid-column: 1 / span 4;justify-items: center;display: grid;    align-items: center;}
.woman{grid-column: 1 / span 2;grid-row-end: span 2;    display: grid;align-items: flex-end;}
.man{grid-column: 3 / span 2;    display: grid;justify-items: flex-end;align-items: flex-end;grid-row-end: span 2;}
.masterBanner p{position: absolute;left: 0;right: 0;text-align: center;bottom: 10px;background-color: var(--yellow);display: inline-block;margin: 0 15%;font-size: 1.35rem;    height:40px;line-height:39px;padding: 2px 0;z-index: 2;    color: var(--red);}
.masterBanner p:before,.masterBanner p:after{content:"";width: 0;height: 0;position: absolute;border-style:solid;top:0;}
.masterBanner p:before{right:-20px;border-width:20px 0px 20px 20px;border-color:transparent transparent transparent var(--yellow)}  
.masterBanner p:after{left: -20px;border-width: 20px 20px 20px 0px;border-color: transparent var(--yellow) transparent transparent;} */

/*講座內容*/
.lecture{padding:0% 2% 3%}
/*.lecture_bg{margin:0 auto}
 .lecture_box{width: 49%;margin: 1% auto 0%;background: #FFF;text-align: center;}
.lecture_box>div{font-size:1.4rem;padding:5px 0;background:var(--red);color:#FFF;text-align:center;position: relative;}
.lecture_box>div:before{content: "";position: absolute;left: 30%;top: 12px;width: 17px;height: 17px;background: url(../images/1004081_icon.png)no-repeat;}
.lecture_box>ul{margin:2% 6% 5%}
.lecture_box>ul>li{font-size:1.1rem;line-height:2em;text-align:left;position: relative;padding: 0 0 0 15px;}
.lecture_box>ul>li:before{content: "";position: absolute;width: 5px;height: 5px;background-color: var(--red);border-radius: 50%;top: 14px;left: 0;}
.lecture_box>button{border:0;background:var(--blue);text-align:center;font-size:1.05rem;margin:0 auto 5%;padding:6px 25px;font-family:"Microsoft JhengHei";border-radius:20px;position:relative}
.lecture_box>button a{width:100%;display:inline-block;text-decoration:none;color:#FFF}
.lecture_box>button:after{content:"\f061";position:absolute;right:30%;top:10px;opacity:0;font-family:"Font Awesome 5 Free";font-weight:900;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;color:#FFF;font-size:1.1rem}
.lecture_box>button:hover:after{right:8%;opacity:1;color:#FFF}
.lecture_box>button:hover{padding-right:35px;background:var(--red)}
.gift{margin:3% auto 2%;font-size:1.3rem;line-height:1.8em;color:#fff;text-align:center}
.gift span{background:var(--red);color:#FFF;border-radius:50%;width:25px;height:25px;line-height:25px;display:inline-block;font-size:1.1rem;margin:0 3px 0 5px}
.gift a{color:var(--red);display:inline-block} */
.note{font-size:.9rem;text-align:center;margin:0 auto 1.5rem;/*color: #fff;*/color: #3f3f3f;}
.recommend_link{margin:4% auto 1%}
.recommend_link>li{font-size:1.3rem;line-height:1.7em;text-align:center;color:var(--pink);font-weight:bold;}
.recommend_link>li>a{color:var(--white);display:inline-block;line-height: 2.5rem;}

/*切換*/
.Vuetabs{justify-content: center;padding: 0 1rem;}
.Vuetabs a{width: calc(90%/2);cursor: pointer;color:var(--white);text-align: center;box-shadow: 2px 2px 5px #0000003f;font-weight: bold;font-size: 2rem;padding: .2rem;margin: 1rem auto .8rem;transition: 0.2s;background:var(--linear_red) /*var(--linear_transparent)*/;}
.Vuetabs a:hover {background-color: #aaa;color:var(--white);background: var(--linear_red_light)/*var(--linear_light)*/;}
.Vuetabs a.active {background-color:var(--white);margin: 1rem auto 0;cursor: default;font-size: 2.2rem;background: var(--img_bg);color: var(--grey);box-shadow: none;}
.tabVuecontent { padding: 2rem;display: flex;flex-wrap: wrap;justify-content: space-around;}
.Vuecontent{margin: 0 1rem;background:var(--img_bg);box-shadow: 2px 2px 6px #0000003f;}
.fade-enter-active, .fade-leave-active {transition: opacity .5s;}
.fade-enter, .fade-leave-to{opacity: 0;transition: opacity 0s;}
.ytplay{width: calc(100%/2.1);text-align: center;padding: 0 0 1.5rem;}
.ytplay dt{color: var(--grey);font-size: 1.5rem;font-weight: bold;}
.ytplay dd{box-shadow: 2px 2px 5px #0000001f;}
.ytplay iframe{height: 13rem;}
.download_area{padding: 1rem 0 1.2rem;}
.download li{font-weight: 900;}
.download a{font-size: 1.6rem;color: var(--red)/*var(--pink)*/;text-decoration: none;background: linear-gradient(20deg, #e5e5e5 10%, white 60%);padding: 0.25rem 1rem;box-shadow: 2px 2px 5px #0000001f;}
.download a:hover{font-size:  1.7rem;}

.answer_title{font-size: 2.7rem;color:var(--grey);padding: .8rem 0 .1rem;}
.answer_list,.answer_list th,.answer_list td{border-collapse: collapse;text-align: center;}
.answer_list{margin:0 1rem;}
.answer-title {background: var(--linear_transparent)/*var(--linear_light)*/;font-size: 2rem;padding: 1.5rem 0 .3rem;color:var(--grey);border-bottom: 6px dotted var(--white);font-weight: bold;width: 100%;}
.answer_list th{background: var(--linear_light);font-size: 2rem;padding: 1.5rem 0 .3rem;color:var(--grey);border-bottom: 6px dotted var(--white);}
.answer_list td{font-size: 1.65rem;padding: 1rem 0;color: var(--darkBlue);font-weight: bold;}
.answer_list a{color: var(--darkBlue);line-height: 1.5rem;}
.answer_list a:hover{color: var(--pink);font-size: 1.75rem;}
.answer_list table {display: flex;justify-content: center;}
.answer_list tr {display: inline-flex;flex-wrap: wrap;justify-content: center;}
.answer_list tr td {width: auto;margin: auto 0.5rem;}

/*LINE&FB&banner舊稿複製*/
.LINE,.FB,.social_txt,.QRcode{float:left}
.LINE,.FB{width:50%;padding:2%}
.social_txt{width:100%;text-align:left}
.socialTitle ,.socialTitle a{color:var(--white);font-weight:700;font-size: 1.3rem;text-align: center;margin-bottom:2%}
.social_txt p{font-size:1.2rem;line-height:1.6em;text-align: center;}
.social_txt p,.QRcode a{color:var(--white);}
.QRcode{text-align:center;font-size:1.3em;margin: 0 auto;}
.LINE{background:#44ba44}
.FB{background:#395692}
.QRcode img{max-width: 75%;width: 150px;margin: 0 auto;}
.FB .qrimg img {border: 3px solid #000;}
.link_box{padding: 1.5%;margin: 0 auto 3%;text-align: center;}
.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: var(--white);display:inline-block}
.link_box>ul>li img{width:100%}
.navlink{margin:4% auto 1%;text-align:center}
.navlink li{margin:0 2%;display:inline-block}
.navlink a,.nav_media a{font-size:1.3rem;background:#003c79;color:var(--white);padding:8px 20px;text-decoration:none;display:inline-block;border-radius:10px}
/*表單*/
.askarea_out,#formlist SELECT,#formlist input{font-family:"Microsoft JhengHei"}
.askarea_out{padding:4% 2%;background: var(--img_bg);box-shadow: 0 3px 6px #0000001f;}
.asktitle{font-size:1.7rem;color:var(--grey);font-weight:bold;text-align:center}
#formlist{width:90%;margin:4% auto 1%;font-size:1.05rem;color:var(--grey);}
#formlist p{margin:1.5% auto;line-height:2em}
#formlist SELECT,#formlist input{border-radius:7px;font-size:1.05rem;background:var(--white);border:var(--white);padding:.5% 1%;color:var(--grey);margin:auto .5%;box-shadow: 1px 1px 3px #0000001f;}
#formlist SELECT{width:18%}
#formlist input[type="text"]{width:40%}
#formlist input[name="sRandomCode"]{width:20%;margin-left:1%}
#formlist input[type="submit"],#formlist input[type="reset"]{margin:2% 1% auto auto;padding:.5em;color: var(--white);font-weight: bold;background: var(--linear_red_light)/*linear-gradient(40deg,#4d56b180 0%, #5b3ab780 30%,#9451b580 60%,#d4368580 100%)*/;box-shadow: 1px 1px 5px #0000003f;}
#formlist input[type="submit"]:hover,#formlist input[type="reset"]:hover{box-shadow: 1px 1px 5px #00000000;position: relative;top: 1px;}

/*講座客製專用表單*/
/* #order_date{width:100%;margin:2% auto;text-align:center}
#order_date_tab1:checked ~ #order_date_content1,
#order_date_tab2:checked ~ #order_date_content2,
#order_date_tab3:checked ~ #order_date_content3,
#order_date_tab4:checked ~ #order_date_content4{display:block}
#order_date_tab1,#order_date_tab2,#order_date_tab3,#order_date_tab4{display:none}
#order_date_content1,#order_date_content2,#order_date_content3,#order_date_content4{display:none}
.order_date_tabs>label{display:inline-block;font-size:1.2rem;border-radius:6px 6px 0 0;background:var(--red);color:#FFF;padding:5px 20px;margin:0 auto;text-align:center;transition:all 0.3s linear;cursor:pointer}
.order_date_tabs>label:before{font-weight:400;margin-right:10px}
.order_date_tabs>label:hover{background:#006aa2;transform:scale(1.02)}
.order_date_tabs>input:checked + label{background:#006aa2}
.order_date_box{width:96%;margin:0 auto 1%;background:#006aa2;color:#fff;border-radius:6px}
.order_date_title{text-align:center;font-size:1.2em;line-height:1.8em;background:var(--red);border-radius:6px 6px 0 0}
.order_date_list{margin:0 auto;padding:1% 2% 3% 6%}
.order_date_list li{width:calc(100%/2);margin:1.5% 0;text-align:left;font-size:1.05rem;line-height:1.8em}
#order_date input[type="checkbox"]{appearance:none;-moz-appearance:none;-webkit-appearance:none;outline:none;cursor:pointer;top:6px;width:45px;height:25px;position: relative;background:#bedae6;box-shadow:#dfdfdf 0 0 0 0 inset;border-radius:15px;border:0;margin:0 8px 0 0}
#order_date input[type="checkbox"]:before{content:'';width:25px;height:25px;position:absolute;top:0;left:0;border-radius:20px;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,0.4)}
#order_date input[type="checkbox"]:checked{border-color:#64bd63;box-shadow:#64bd63 0 0 0 16px inset;background:#64bd63}
#order_date input[type="checkbox"]:checked:before{left:22px}
.check-switch-anim{transition:border cubic-bezier(0,0,0,1) 0.4s,box-shadow cubic-bezier(0,0,0,1) .4s}
.check-switch-anim:before{transition:left .3s}
.check-switch-anim:checked{box-shadow:#3C92DC 0 0 0 16px inset;background-color:#3C92DC;transition:border ease 0.4s,box-shadow ease 0.4s,background-color ease 1.2s}
.check-switch-anim:checked:before{transition:left .3s}
.bottomlink{position:fixed;bottom:3%;right:2%;background:var(--red);padding:1% 2%;border-radius:50px;font-size:1.125em;text-align:center;z-index:9}
.bottomlink a{color:#FFF} */

/*-----------------PC-------------------*/
@media all and (min-width: 1201px){
#topbutton,#BodyHeader_event_rwd{display:none}
/* #divsion_menu ul,#divsion_menu li{list-style-image: url(http://doctor.get.com.tw/File/Image/doctor_new_icon_arr_org.gif)} */
#BodyContentMainNavigator ul li,#BodyContentMainNavigator h1{font-size:15px}
/*bodyHeader*/
#BodyHeader_event #header-share{width:100%;margin:0 auto;line-height:2em;font-size:13px;background:var(--white);}
#BodyHeader_event #header-share img{margin-bottom:5px}
#BodyHeader_event a{color:#333}
/*OLD IE*/
/* #noie{color:#FFF;width:100%;height:60px;text-align:center;border:1px solid #069;background-color:#39C;_z-index:9999;z-index:9999;position:fixed;_top:expression(documentElement.scrollTop+"px");left:0;top:0}
#noie a{color:#FC0} */
}

/*------------MB-----------------*/
@media (max-width: 767px){
#Related{display:none}
.lecture{padding:4%}
.tabVuecontent {padding: 1rem;}
/* .gift{font-size:1.25rem;    margin: 0% auto 2%;}
.gift strong{display:block;line-height:2em}
.lecture_bg{margin:4% auto}
.lecture_box{width:100%;margin:2% auto}
.lecture_box>div{font-size:1.25rem}
.lecture_box>ul{margin:2% 4% 4% 6%}
.lecture_box>ul>li{font-size:1.05rem}
.lecture_box>button{margin:0 auto 3%} 
.recommend_link{margin:6% auto 2%}
.recommend_link>li{text-align:left;font-size:1.15rem;margin:0 auto 1%}*/

.Vuetabs a{padding: .2rem 0;}
.Vuetabs a , .Vuetabs a.active{font-size: 1.6rem;}
.ytplay {width: calc(100%);}
.ytplay dt {font-size: 1.4rem;}
.note {margin:  auto ;line-height: 1.5rem;}
.download_area {padding: 0.5rem;}
.download li {padding: 0.5rem;}
.download a {font-size: 1.3rem;}
.answer_title {font-size: 2rem;margin: 0.5rem auto 0;}
.answer_list{margin: auto;}
.answer_list th {font-size: 1.55rem;}
.answer_list td {font-size: 1.3rem;}
.recommend_link>li {padding: 0.5rem 0;}
.recommend_link>li>a {line-height: 2rem;}
.askarea_out{padding:6% 5%}
.asktitle{font-size:1.4rem}
#formlist{width:100%;margin:7% auto 0;font-size:1rem}
#formlist p{line-height:1.5em;font-size:1rem}
#formlist p:nth-last-of-type(3){margin-bottom:7%}
#formlist SELECT,#formlist input{margin:0 auto 7%}
#formlist input[type="text"],#formlist SELECT{width:100%;height:35px;font-size:1rem;padding:1%;box-sizing:border-box}
#formlist input[name="sRandomCode"]{width:25%;height:30px;margin:0 1% 7%}
#formlist input[type="submit"], #formlist input[type="reset"]{margin:0 2% auto auto} 
/* #order_date{margin:0 auto 7%}
.order_date_box{width:100%;margin:0 auto 2%}
.order_date_tabs>label{font-size:1.1rem;padding:5px 15px}
.order_date_list li{width:100%}
.bottomlink{padding:2% 0}*/
#BodyFooter_rwd{padding-bottom:50px}
@media screen and (max-width:650px){
/* .bgcolor0 {background: linear-gradient( 122deg,#ffff9d 4%,#0f8cce 10%, #0f8cce 13%,#0f8cce 30%,#ffff9d 39%);} */
.masterBanner{height:auto}
.masterBanner p {margin: 0 9%;font-size:0.95rem;line-height: 33px;}
}
}
@media all and (min-width:768px) and (max-width: 1200px){
.bottomlink{padding:1% 0}
#BodyFooter_rwd{padding-bottom:55px}
}
@media (max-width:1200px){
    .LINE,.FB{width:100%;padding:3% 4%}
    .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;}
    /* .vl_text:nth-child(2) {right: 0rem;}
    .social_txt {text-align: center;} */
    
.media_group,.specail_group,.spec_out,.social_txt,.QRcode,.gradelist li {width: calc(100%/1);}
/* .vl_text{writing-mode:inherit;position: inherit;order:1;width: 100%;text-align: center;margin: 1rem 0;}
.student_photo img{order: 2;}
.spec_out{order: 3;} */

#BodyMenu,#BodyContentAd,#BodyContentMainNavigator,#BodyHeader_event,#noie{display:none}
#BodyContainer_event,#BodyContent,#BodyContentMain{width:100%;margin:0 auto;padding:0}
#topbutton{width:50px;height:50px;color:var(--white);border-radius:50%;background-color:#000;opacity:.4;right:1%;bottom:23%;position:fixed;line-height:50px;font-size:15px;text-align:center;z-index:99}
#topbutton a{color:var(--white);text-decoration:none;line-height:50px}
/* .bottomlink{width:100%;bottom:0;right:0;border-radius:0;opacity:0.9} */
}