﻿@import url("../../../../icon_new/css/all.min.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC&display=swap');
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,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}
:focus{outline:0}
ins{text-decoration:none}
del{text-decoration:line-through}
body{font-family:"微軟正黑體",Arial;color:var(--black);}
a{text-decoration:underline;}
a:hover{text-decoration:none;}
main{font-family:'Noto Sans TC', sans-serif;}
a{text-decoration:underline;color:inherit;}
a:hover{text-decoration:none;}
:root{
    --black:#383838;
    --blue:#005a98;
    --sky_blue:#4b9ec5;
    --red:#c30d23;
    --orange:#db8001;
    --green:#007f49;
    --d_yellow:#e7b132;
    --o_yellow:#fbc800;
    --yellow:#ffe900;
    --brown:#946134;
    --text1:2.3rem;
    --text2:1.7rem;
    --text3:1.5rem;
    --text4:1.3rem;
    --text5:1.2rem;
    --ff:microsoft yahei;
    --t_sh:1.2px 0 1px var(--black), -1.2px 0 1px var(--black), 0 1.2px 1px var(--black), 0 -1.2px 1px  var(--black);
}
.bg_padding{padding:1%;}
.bgcolor0{background:url("../../images/1307070_8.png");}
.bgcolor1{background-color:white;}
.bgcolor2{background-color:#FCFCFC;}
.bgcolor3{background-color:#DFDFDF;}
.bgcolor4{background-color:#FCFCFC;}
.bgcolor5{background-color:#DFDFDF;}
.block{display:block;}
.text-center{text-align:center;}
.ml-2{margin-left:0.5rem;}
.mt-4{margin-top:1rem;}
.mx-2{margin-left:0.5rem;margin-right:0.5rem;}
.m-auto{margin:auto;}
.w-full{width:100%;}
.flex{display:flex;}
.flex-wrap{flex-wrap:wrap;}
.grid{display:grid; }
h1{font-size:2rem;}
h2{font-size:1.75rem;}
h3{font-size:1.5rem;}
img{max-width:100%;height:auto;}
small{font-size:0.85em; }
/*標題*/
.main_title{font-size:var(--text3);font-family:var(--ff);font-weight:bold;}
.sale_title{font-size:var(--text2);background:var(--blue);color:white;text-align:center;font-family:var(--ff);font-weight:600;letter-spacing:0.08rem;}
.sale_list:nth-child(even) .sale_title{background:var(--orange); }
.sale_title span{color:var(--yellow);}
.exp_title,.type_title{font-size:var(--text1);text-align:center;}
/* main */
.banner{justify-content:center;align-items:center;background:url("../../images/1307070_1.png") center top / 100% auto no-repeat;padding:1.5rem 0; }
.main_sale_title{font-size:var(--text2); }
/*共用*/
.price_red{color:#f44923;font-weight:bolder;margin:0 .2rem;}
/*優惠內容*/
.sale_list{margin:1rem auto;font-size:var(--text5);}
.sale_list dl{margin:.5rem auto 1.5rem;align-items:flex-start; }
:is(.sale_list1, .sale_list2) dl{justify-content:space-between;grid-template-columns:17% 80%; }
:is(.sale_list1,.sale_list2) dt{font-size:var(--text3);background:var(--blue);color:white;display:inline-block;padding:0 .1rem;align-self:start;grid-area:1/1/2/2;text-align:center}
.sale_list2 dt{background:var(--orange); }
.sale_list2 dl:nth-of-type(1) dt:nth-of-type(1){background:none;color:var(--orange);font-size:var(--text3);text-align:center;grid-area:1/1/2/4;margin-bottom:0.5rem; }
.sale_list2 dt:nth-of-type(2){grid-area:2/1/3/2; }
.sale_list2 dt:nth-of-type(3){grid-area:3/1/4/2; }
.sale_list1 dd:nth-of-type(1){grid-area:1/2/2/4; }
.sale_list1 dd:nth-of-type(2){grid-area:2/2/3/4; }
.sale_list1 dd:nth-of-type(3){grid-area:3/2/4/4; }
.sale_list2 dl:nth-of-type(1) dd{grid-area:2/2/3/4; }
.sale_list2 dl:nth-of-type(2){grid-template-columns:25% 70%; }
.sale_list2 dl:nth-of-type(2) dd{grid-area:1/2/2/4; }
.sale_list_other dl{text-align:center;}
/*經驗談*/
.experience{background:var(--sky_blue);position:relative;margin-top:4.5rem;padding-bottom:1rem; }
.experience::before{position:absolute;content:'';background:url("../../images/1307070_10.png") center;width:100%;height:67px;top:-3.5rem;left:0}
.exp_title{padding:1.5rem 0 1rem;color:var(--yellow);font-weight:bold;font-family:var(--ff);text-shadow:var(--t_sh); }
.story_box figure{padding:0;margin:auto 0;text-align:center;transition:.3s ease;z-index:0;}
.story_box figure:is(:hover, :focus){transform:scale(1.35);z-index:5; }
.story_box figure:not(:hover, :focus-within){opacity:0.9; }
.man_pic img{border-radius:50%;background:white;}
.story_item{align-items:flex-start;justify-content:space-around;margin-bottom:1rem;}
.story_item dl{width:calc(100% - 38%);font-size:1.125rem;padding:0 0 0 1rem;}
.story_box{width:calc(100%/2 - 1rem);align-items:center;}
.story_box .story_tit{color:var(--o_yellow);font-size:1.2rem;margin-top:.6rem;text-shadow:var(--t_sh);text-align:center;margin:auto}
.story_box dl dt{color:var(--o_yellow);font-size:1.25rem;padding-bottom:0.125rem;margin-bottom:0.3rem;}
.story_box dl dt a{text-shadow:var(--t_sh); }
.story_box dl dt small{color:initial;font-weight:initial;font-size:initial;}
.story_box dl dd{padding:0;margin:auto;}
.story_box p{background:linear-gradient(to bottom,transparent 0%,#ffffffcc 20%);border-radius:8px;padding:1rem 0.5rem;margin:0 auto 0.25rem;text-align:justify;}
.grade{background-color:var(--o_yellow);color:var(--black);padding:0 0.5rem;width:fit-content;margin-right:.5rem;display:block;}
.g-top{color:var(--o_yellow);font-weight:bold;}
/*課程型態*/
.type_title{font-family:var(--ff);font-weight:bold;font-size:var(--text2); }
.type_title span{color:var(--brown); }
.type_content{justify-content:space-around;align-items:center;text-align:center;margin-top:1rem;margin-bottom:2.5rem;}
.type_item{width:calc(100%/3 - 10px);}
.type_stit{font-size:1.5rem;color:#007eb9;justify-content:center;align-items:center;}
.font_small{border-radius:50%;background:var(--brown);color:white;font-size:0.6em;padding:0 0.15rem; }
.study_type_container{position:relative; }
.study_type_container::before{position:absolute;content:'';background:url("../../images/1307070_6.png") center / cover;width:100%;height:57px;left:0;bottom:0}
#askarea{background-color:#0092b9;padding-top:2%;}
#askarea input[type="submit"],#askarea input[type="reset"]{background-color:#333;padding:0.5em;color:white !important;}
#toolbar input.img{vertical-align:middle;}
button{top:0.5rem;height:40px;width:40px}
.st-content img{height:auto;width:auto;}
@media screen and (min-width:1201px){
    #BodyHeader_event_rwd,#topli{display:none;}
    #BodyContentMainNavigator header h1{font-size:1.15em;float:left;}
    #BodyContentMainNavigator header img{margin:auto 3px;}	
    #BodyContainer_event{margin:0 auto;text-align:center;width:1000px;}
    /*資料集中1200px寬外框*/
    #event{width:750px;margin:auto;}
    #event_sec,#event_third,#event_fourth,#event_fifth,#event_sixth{padding:1rem;}
    #event_master{padding:0 3.5rem 1rem;}
    /* bodyHeader */
    #BodyHeader_event #header-share{line-height:2;margin:0 auto;	background:#FFF;}	
    #BodyHeader_event #header-share img{margin-bottom:5px;}
    #BodyHeader_event a,#BodyHeader_event{font-size:0.98em;}
    #BodyHeader_event a{color:#333;}
    #BodyHeader_event a:hover{text-decoration:none;position:relative;top:2px;bottom:2px;}
    /* Footer */
    #BodyFooter_rwd,#footer_line,#footer_address ul li,#footer_inline ul{display:inline-block;}
    #BodyFooter_rwd{width:100%;margin-top:2%;}
    #footer_address,#footer_address #adinfo_out,#footer_address #adinfo{margin:0 auto;width:100%;}
    #footer_inline ul,#footer_address ul{width:100%;margin:0% auto;}
    #footer_inline a,#footer_address a{color:#000}
    #footer_inline ul li{display:inline;margin:auto 1%;width:15%;}
    #footer_address ul li{width:100%;line-height:1.9em;font-size:0.95em;}
    #adinfo_out #adinfo{width:50%;display:inline;margin:auto 1%;}
    #footer_inline ul li img{width:16%;height:auto;vertical-align:middle;}
    #footer_line{width:90%;border-top:thin solid #999;margin:2% 5%}
    /*ask*/
    #askarea_out,#askarea{display:inline-block;}    
    #askarea{width:100%;}
    #askarea p{margin:0 auto;line-height:2.2em;}
    #askarea .asktitle{font-size:1.5em;color:#FFF;text-align:center;}
    #askarea #formlist,#askarea input[type="submit"],#askarea input[type="reset"]{font-size:1em;color:#FFF;}
    #askarea #formlist{width:80%;margin:3% auto auto 10%;padding-bottom:1%;}
    #askarea SELECT,#askarea input{border-radius:3px;}
    #askarea SELECT{width:10%;background:#FFF;border:#FFF;padding:0.5%;margin:auto 1% 1% auto;	width:15%;}
    #askarea input{background:#FFF;border:#FFF;padding:0.5%;margin:auto auto 1% 1%;color:#585858;}    
    #askarea input[name="sContent"]{width:50%;}
    #askarea input[type="text"]{width:35%;}
    #noie{color:#FFF;width:100%;height:60px;text-align:center;border:1px solid #006699;background:#3399CC;_z-index:9999;z-index:9999;	position:fixed;/*讓選單覆蓋內容不會隨著捲軸滑動而消失專用*/left:0;top:0;}
    #noie a{color:#FC0;}
    .hottxt{color:#ffd942;font-size:1.0em;}
}
@media screen and (max-width:1200px){
    /*隱藏的區塊*/
    #BodyHeader_event,.hottxt,#noie,#BodyContentMainNavigator,#BodyContentAd,#BodyMenu{display:none;}
    /*會撐開的版面控制*/
    #BodyContent,#BodyContainer_event,#BodyContentMainDetail_learning{width:100%;}
    #BodyContent{padding:0;}
    #BodyContentMainDetail_learning{float:left;margin:0;}
    /* Header */
    #BodyHeader_event_rwd{text-align:center;width:100%;height:auto;	margin:0 auto;background:#FFF;position:fixed;top:0;float:left;z-index:9;}
    @media screen and (orientation:portrait){#BodyHeader_event_rwd img{max-width:50%;height:40px;margin:0.5rem auto;}}
    @media screen and (orientation:landscape){#BodyHeader_event_rwd img{max-width:25%;height:40px;margin:0.5rem auto;}}    
    /*資料集中寬外框*/
    #event_master,#event_sec,#event_third,#event_fourth,#event_fifth,#event_sixth{margin:0% auto;display:inline-block;width:98%;padding:1%;}
    #Master_title{width:100%;margin-top:41px;}
    #Master_title img{width:80%;height:auto;}
    .buy_go{margin:3% 0;display:block;padding:0;}
    .buy_go li{line-height:1.9em;font-size:1.3em;}
    .buy_go li,.buy_go li a{font-weight:normal;}
    .buy_first:before{display:block;width:80%;margin:0 auto;}
    .stru_group{width:97.5%;padding:1%; display:inline-table;}
    .stru_title{font-size:5vw;margin:2% auto;}    
    .course_note{font-size:1.25em;line-height:1.9em;}
    .course_note a{margin-right:1%;}
    /* Footer */
    #BodyFooter_rwd{float:left;width:100%;background:#FFF;margin-top:5%;}
    #BodyFooter_rwd #footer_line{width:100%;margin-bottom:3%;margin-top:5%;display:block;float:left;height:auto;text-align:center;border-top-width:thin;	border-top-style:solid;border-top-color:#999;}
    #BodyFooter_rwd #footer_inline a{color:#000;line-height:2em;}
    #BodyFooter_rwd #footer_inline ul{float:left;padding:0;width:100%;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{float:left;display:inline-block;margin-right:auto;line-height:2em;font-size:1em;clear:both;width:100%;}
    #BodyFooter_rwd #footer_address{margin-top:0%;	float:left;width:100%;margin-right:auto;text-align:center;margin-left:auto;}
    #BodyFooter_rwd #footer_address a{color:#000;line-height:2em;}
    #BodyFooter_rwd #footer_address ul{float:left;padding:0;text-align:center;margin:0.5%;width:100%;clear:both;}
    #BodyFooter_rwd #footer_address ul li{float:left;display:block;width:100%;line-height:2em;text-align:center;font-size:.8em;}  
    /*ask*/
    #askarea{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:3% 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% 7% auto;background:#FFF;height:30px;}
    SELECT{width:100%;border:#FFF;	padding:0.5%;}
    input{border:#FFF;padding:0 1%;color:#C6C6C6;}
    input[type="submit"],input[type="reset"]{font-size:1em;margin-top:5%;padding:1%;height:auto}
    input[type="radio"]{width:1em;height:1em;margin-left:3%;}
    /*TOP按鈕*/
    #topli,#topli a{color:#fff;text-decoration:none;line-height:50px;}
    #topli{width:50px;height:50px;text-align:center;border-radius:9999em;background:#000;opacity:0.4;position:fixed;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 screen and (min-width:768px) and (max-width:1199px) and (orientation:portrait){
    .sale{margin:auto 3rem; }
    .story_box:nth-of-type(1) .story_tit:nth-of-type(2){margin-top:.6rem; }
    .story_box:last-of-type .story_tit:nth-of-type(2){margin-top:.8rem; }
} 
@media (max-width:767px){
    :root{--text1:1.7rem;--text2:1.5rem;--text3:1.4rem;--text4:1.2rem;--text5:1.1rem; }
    @media screen and ( width < 360px){:root{--text2:1.3rem;--text3:1.2rem;--text4:1.1rem;--text5:1rem; }#Master_title{margin-top:2rem !important;}.banner{padding:0 2rem;}}
    .story_box,.type_item{width:92%;justify-content:center;}
    .story_box:nth-of-type(1){margin-bottom:2rem; }
    .story_item dl{width:auto;}
    .sm\:block{display:block;}
    .banner{padding:2rem 2rem 0; }
    .main_sale_title{font-size:var(--text4);margin:1rem auto;}
    :is(.sale_list1, .sale_list2, .sale_list_other) dl{grid-template-columns:repeat(1, 1fr);text-align:center;margin:1rem 3rem; }
    :is(.sale_list1, .sale_list2) dt{grid-area:1/1/2/4;width:fit-content;margin:auto;padding:0 1rem; }
    .sale{margin:auto 1rem; }
    :is(.sale_title , .exp_title) span{display:block; }
    .sale_list1 dd:nth-of-type(1){grid-area:2/1/3/4; }
    .sale_list1 dd:nth-of-type(2){grid-area:3/1/4/4; }
    .sale_list1 dd:nth-of-type(3){grid-area:4/1/5/4; }
    .sale_list2 dl:nth-of-type(1) dt:nth-of-type(1){grid-area:1/1/2/4;width:initial; }
    .sale_list2 dl:nth-of-type(1) dt{grid-area:2/1/3/4; }
    .sale_list2 dl:nth-of-type(1) dd{grid-area:3/1/4/4; }
    .sale_list2 dl:nth-of-type(2) dd{grid-area:4/1/5/4; }
    .ps{text-align:center; }
    .story_box figure:not(:hover, :focus-within) {opacity:1; }
    .story_box figure:is(:hover, :focus){transform:scale(1); }
    .story_box:nth-of-type(1) .story_tit:nth-of-type(2){margin-top:0.6rem; }
    .study_type_container::before{height:3%; }
} 