body *{font-family:"Noto Sans TC",sans-serif}
#event_master, #event_sec, #event_third, #event_fourth *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
:root{--linear1:linear-gradient(45deg, white 60%, #d5d1cb 100%);--golden1:#c08e0f;--orange1:#e96800;--blue1:#2e9fcc;--green1:#3c6b60;--font_family1:"Noto Serif TC",serif;--border1:solid 1px #cfcfcf;--bgcolor1:#eee8e0;--bgcolor2:#fffce9;--join1:#de523f;--join2:#00bcd4;--white:#fff;--join4:#ffefbb;--join1:#a7302d;--join5:#639;--join6:#64468c;--join7:#a77a00;}
.bg_padding{padding:1%}
.bg0{background:url(../images/1311035_bg.jpg) no-repeat center top/100%,url(../images/1311035_bg2.jpg) no-repeat bottom center/100% fixed}
.bg1{background: url(../images/1311035_bg2.jpg) no-repeat bottom center / 100% fixed;}
.bg2{background: url(../images/1311035_bg3.jpg) repeat-y center / 100%;filter: drop-shadow(0px 2px 5px #0000002a);}
.bg_gold {background: url(../images/1311035_bg_y.jpg) no-repeat center top / 100% auto, url(../images/1311035_bg2.jpg) no-repeat bottom center / 100% fixed;}
.wrap_all{word-break: keep-all;overflow-wrap: break-word;-webkit-hyphens: auto;-moz-hyphens: auto;hyphens: auto;-webkit-text-size-adjust: 100%;}

.banner img {padding: 2.5rem 0 0;filter: drop-shadow(0px 2px 5px #0000003a);}
#event_master, #event_sec, #event_third, #event_fourth{display: inline-block;width: 1200px;padding: .5rem 1rem 2.5rem;position: relative;}
.group_title{font-size: 3.2rem;width: fit-content;margin: 1.5rem auto 0;font-weight:700;color:transparent;font-family:"Noto Serif TC",serif;background:linear-gradient(0deg,#080808,#4a4a4a);-webkit-background-clip:text;background-clip:text;position:relative}
.group_title .circle{font-size:3.5rem;font-family:"Noto Serif TC",serif;color:var(--white);background:linear-gradient(0deg,#806219,#b19755);border-radius:50rem;padding:0 .9rem .3rem;font-weight:500;margin:0 .3rem}
.tabVuecontent  .group_title{font-size: 2.6rem;margin:.5rem auto 0;}
.title_style_red {color: transparent;background: linear-gradient(0deg, #a01d1a, #d53d2a);border-bottom: 4px double #d53d2a;-webkit-background-clip: text;background-clip: text;}
.title_style_gold {color: transparent;background: linear-gradient(0deg, #835e00, #c1972b);border-bottom: 4px double #c1972b;-webkit-background-clip: text;background-clip: text;}
.container {padding: 0 0 2rem;}
.content_title{border-bottom:var(--border1);padding:1rem .5rem .5rem;margin: 0 auto 1rem;font-size:1.8rem;font-family:var(--font_family1);position:relative;text-align:center;}
/* .content_title::before{background:var(--golden1);position:absolute;content:"";clip-path:polygon(100% 0,0 100%,100% 100%);width:25px;height:25px;left:1rem;top:.7rem} */
.content_title span{font-size:2rem;color:var(--join7)}
.exam_offer{margin:1rem auto;text-align:center}
.exam_offer dt{font-size:2rem;color:var(--join5);font-weight:900}
.course_list a,.exam_offer a,.page_note a{color:var(--join6);text-decoration:underline}
.offer_bglist dt{background: linear-gradient(90deg, #c59a3a, #caa74c);color: var(--white);text-shadow:2px 2px 4px #0000002a;border-radius:6px 6px 0 0;border-top:var(--border1)}
.offer_bglist dd,.offer_bglist dt{box-shadow:gray 0 10px 10px -10px;padding: .35rem .5rem;font-size: 1.3rem;border-left:var(--border1);border-right:var(--border1)}
.redtxt{color:var(--join1)}
.offer_bglist dd{background-color:var(--white);border-radius:0 0 6px 6px;border-bottom:var(--border1);border-left:var(--border1);border-right:var(--border1)}
.offer_list{width:calc(100% / 2.1);text-align:center;margin:0 .5rem}
.offer_list .redtxt{font-size: 1.35rem;font-weight: bold;padding: .2rem;}
.course_title{font-size:3.2rem;text-align:center;font-family:var(--font_family1);margin:1.5rem auto 1rem;font-weight: bold;color: transparent;background: linear-gradient(0deg, #080808, #4a4a4a);-webkit-background-clip: text;background-clip: text;width: fit-content;border-bottom: 4px double #4a4a4a;}
.course_list{background: url(../images/1311035_bg3.jpg) repeat-y center / 100%;padding: .2rem 0 0;filter: drop-shadow(0px 2px 5px #0000003a);}
.course_list,.course_list th,.course_list td{border-collapse:collapse;font-size: 1.2rem;border:1px var(--join6) dotted;padding:.35rem;text-align:center;}
.course_list th{background: var(--join6);color: var(--white);border:1px #ffffff4a dotted;font-size: 1.3rem;font-weight: 300;padding: .45rem;}
.course_list tr:nth-child(even){background: #fcd0002a;}
.media_title{font-size: 2.6rem;color: var(--join5);border-bottom: 4px double var(--join5);width: fit-content;padding: 0 .25rem .25rem 1rem;margin: 1.8rem auto 1rem;font-weight: 700;text-align:center;font-family:var(--font_family1)}
#media{color:#000;font-size:1rem;background:var(--linear1); border:var(--border1);border-radius: 12px;padding:2% 3%;width: 98%;margin: 1rem auto;text-align:left}
.stuednt{font-size: 1.4rem;line-height: 2rem;font-weight: 600;color: #4d2980;margin-right:2%}
.pTitleS{font-size: 1.3rem;line-height: 1.8rem;color: var(--golden1);padding: .25rem 0;margin-bottom: .5rem;position: relative;left: 0;border-bottom: dashed 1px var(--golden1);}
/* .pTitleS::before{content: '';width: 13px;height: 13px; background:  var(--golden1); clip-path: polygon(0 50%, 100% 100%, 100% 0);position: absolute;left: -13px;top: 12px;} */
.subject ,.student2 dd:nth-child(2) {font-size:1.2rem;width: fit-content;color: var(--join1);background: var(--white);border-radius: 50rem;line-height: 1.75rem;padding: 0 1rem 0 0;}
.subject span ,.student2 dd:nth-child(2) span {color: var(--white);background: var(--join1);border-radius: 50rem;padding: 0 .5rem;margin: 0 .5rem 0 0;}
.content{font-size:1.1rem;padding: .25rem;}
#media a{color:#333;text-decoration:underline}
#media a:hover{text-decoration:none}
.linkmore{font-size: 1.25rem;font-weight: 700;text-align: center;color: var(--white);background: var(--join1);padding: .35rem 1.5rem;margin: .25rem auto 1.25rem;border-radius: 50rem;border: 5px double #e9e9e9;width: fit-content;}
.linkmore:hover {position: relative;left: 1px;top: 1px;}
.page_note{font-size:1.3rem;margin:1.5rem 0;text-align: center;}
.Vuetabs a:nth-child(1).active{background:linear-gradient(0deg, #3d2680, #7d66ac);position:relative;z-index:1}
.Vuetabs a:nth-child(1){background:linear-gradient(0deg, #3d26806a, #7d66ac6a)}
.Vuetabs a:nth-child(2){background:linear-gradient(0deg, #a12a006a, #e67e2e6a)}
.Vuetabs a:nth-child(2).active{background:linear-gradient(0deg, #a12a00, #e67e2e);position:relative;z-index:1}
.Vuetabs a{cursor:pointer;text-align: center;padding:.5rem 0;width:calc(100% / 2);margin:.5rem auto 0;color:var(--white);font-size:1.8rem;font-family:Verdana,"Microsoft JhengHei"}
.Vuetabs a.active{text-decoration:underline}
.tabVuecontent {padding:0 2rem;}
.tabVuecontent1 {background: #f3edffaa;border-bottom: 4px double#c7beda;}
.tabVuecontent2 {background: #ffededaa;border-bottom: 4px double#f4c8a6;}
.fade-enter-active,.fade-leave-active{transition:opacity .5s}
.fade-enter,.fade-leave-to{opacity:0;transition:opacity 0s}
.student_area{padding: .25rem 0 1.5rem;}
.student dt{font-size: 1.8rem;border-bottom: var(--border1);color:var(--join7);padding: 1rem 0 .5rem;margin: 0 auto 1rem;position: relative;text-align: center;}
.student dt small{color: #000;font-size: 1.6rem;font-family: var(--font_family1);}
.student dd{text-align:left;font-size: 1.1rem;padding: .25rem;line-height: 1.75rem;}
.student{width:calc(100%/2);padding: .25rem;font-size: 1.1rem;}
.progress_bg{display:block;margin:0 0 3%}
.progress_list{display:table;width:100%}
.progress_list dl{width:25%;text-align:center;display:table-cell;vertical-align:bottom}
.progress_list dd{margin:0;color:var(--white);filter: drop-shadow(0 2px 5px #0000003a);font-size:1.2rem;border-radius: 1.5rem 0 0 0;}
.progress_list dl:nth-of-type(1) dd{background:linear-gradient(0deg, #806319dd, #b19755);padding:3%}
.progress_list dl:nth-of-type(2) dd{background:linear-gradient(0deg, #a12a00dd, #e67e2e);padding:7%}
.progress_list dl:nth-of-type(3) dd{background:linear-gradient(0deg, #8d1f1ddd, #d53d2a);padding:11%}
.progress_list dl:nth-of-type(4) dd{background:linear-gradient(0deg, #3d2680dd, #7d66ac);padding:10%}
.progress_list dt{font-size: 1.2rem;margin: 0 0 .25rem;}
.lerning{padding:0 0 .8rem;margin: 1rem auto 2rem;background:url(../images/1310014_bg3.jpg) repeat-y;filter:drop-shadow(0 2px 5px #0000003a);}
.lerning{border-bottom:3px var(--join1) solid;width:calc(100%/4 - 2%);height:160px; background: url(../images/1311035_bg3.jpg) repeat-y center / 100%;}
.lerning dt{line-height:2rem;text-align:center;padding:.6rem 0 1.2rem;clip-path:polygon(0 0,100% 0,100% 80%,50% 100%,0 80%);}
.lerning dt{font-size:1.2rem;color:var(--join4);background:var(--join1);}
.lerning dd{font-size:1.05rem;text-align:left;padding:.6rem .5rem 0 1rem;}
.lerning a{border-bottom:1px dotted var(--join4);}
.lerning a:hover{border-bottom:unset;}
.arrow{width:2.5%;}
.arrow dt img{width:90%;display:inline-block;}

*{transition:all .5s}
#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;}
#back-top span{width:50px;height:50px;display:block;margin-bottom:7px;background:rgba(99,99,99,.74) url(../images/up-arrow.png) no-repeat center center;border-radius:50%;transition:1s;}
#back-top a:hover span{background-color:#777;}
#askarea SELECT{color:#000;background-color:#fff;}
#askarea_out{background: linear-gradient(45deg, #c59a3a, #c5ac5b);}
#askarea{width:1200px;margin:0 auto;padding:1rem 5rem;text-align:left;}
#askarea .asktitle{color:#fff;text-align:center;font-size:2rem;margin:17px;}
#formlist SELECT,#formlist input{border-radius:.3rem;background-color:#fff;border:#fff;padding:.25rem;}
#askarea SELECT{background-color:#fff;border:#fff;padding:.5%;margin:auto 1% 1% auto;}
#formlist label{display:block;margin:1rem 0;color:#fff;font-size:1.2rem;}
#formlist img{display:inline-block;}
#formlist input{color:#585858;}
#askarea input[type=reset],#askarea input[type=submit]{padding:.5em;margin-top:2%;border:2px #fff solid;color:#fff!important}
#askarea input[type=submit]{background-color:#64468c;}
#askarea input[type=reset]{background-color:#8d9297;}
label>select{margin:0 1rem;}
#formlist{justify-content:space-around;}
#askarea textarea[name=sContent]{width:98%;height:300px;font-size:1.15em;border:7px #ffcac3 solid;padding:10px;}
#askarea input[type=text]{width:32%;}
#askcontent{color:#fff;line-height:2.5rem;}

@media all and (min-width:1px) and (max-width:1200px){
    #event_master, #event_sec, #event_third, #event_fourth{margin: 0 auto;display: inline-block;width: 100%;padding: .5rem 1rem 1.5rem;}
    .banner img {padding: 2.5rem 0 0;width: 98%;margin: auto;}
    .group_title {text-align: center;margin: 1.5rem auto 1rem;}
    .group_title .circle {font-size: 2.5rem;padding: 0 0.7rem .3rem;}
    .bg0 {background: url(../images/1311035_bg.jpg) no-repeat center top / 120% auto, url(../images/1311035_bg2.jpg) no-repeat top center / 145% auto;}
    .bg1 {background: url(../images/1311035_bg2.jpg) no-repeat bottom center / 150% 100%;}
    .bg_gold {background: url(../images/1311035_bg_y.jpg) no-repeat center top / 245% auto, url(../images/1311035_bg2.jpg) no-repeat bottom center / 145% 100%;}
    .progress_list dl {width: 50%;display: inline-grid;padding: 0 0 1.25rem;}
    .tabVuecontent {padding: 0 2rem 1.5rem;}
    .lerning{width:95%;display:block;margin:.5rem 6rem;height:160px}
    .arrow{transform:rotate(90deg);display:block;width:4%;margin:.5rem}
    .student{width:100%;padding: .5rem .25rem;}
    .linkmore {font-size: 1.2rem;margin: .25rem auto;}
    .course_list, .course_list th, .course_list td {border: 1px #64468ccc dotted;}
    .offer_list{width: 80%;margin: 1rem auto;}
    #askarea{width:100%;padding:.8rem}
    #askarea .asktitle{font-size:1.1rem}
    #askarea .asktitle>p{line-height:2.2rem}
    #formlist{margin:0 auto}
    #askarea input[type=text],#askarea select{width:100%}
    #askarea input[type=checkbox]{width:initial}
    #formlist label{font-size:1rem}
    #formlist SELECT,#formlist input,#formlist input[name=sContent],#formlist label{margin:.25rem 0}
    #formlist input[type=reset],#formlist input[type=submit]{width:calc(100% / 4.5)}

}

@media all and (min-width:1px) and (max-width:767px){
    .group_title , .course_title {font-size: 1.6rem;margin: 1.5rem auto .3rem;line-height: 2.6rem;}
    .group_title .circle {font-size: 1.65rem;padding: 0 0.45rem .2rem;}
    .tabVuecontent {padding: 0 .5rem 1.5rem;}
    .Vuetabs a ,.stuednt ,.subject, .student2 dd:nth-child(2)  {font-size: 1.15rem;}
    .content_title , .student dt small {font-size: 1.25rem;padding: 1rem .25rem .5rem;}
    .content_title span , .student dt {font-size: 1.35rem;}
    .media_title{font-size: 1.35rem;border-bottom: 3px double var(--join5);padding: 0 .25rem .15rem 1rem;margin: 1.3rem auto 0;}
    .pTitleS {font-size: 1.1rem;line-height: 1.8rem;padding: 0 0 .25rem;}
    .subject span, .student2 dd:nth-child(2) span {padding: 0 .5rem .15rem;}
    .content {font-size: 1rem;padding: .5rem 0 .5rem .25rem;}
    .student dd {font-size: 1rem;line-height: 1.5rem;}
    .student_area .student:nth-child(1) dd{text-indent: -1rem;padding: 0 0 0 1rem;}
    .tabVuecontent .group_title {font-size: 1.4rem;line-height: 2.4rem;}
    .progress_list dl {width: 100%;padding: .5rem 0 0;}
    .progress_list dl:nth-of-type(1) dd ,.progress_list dl:nth-of-type(2) dd ,.progress_list dl:nth-of-type(3) dd, .progress_list dl:nth-of-type(4) dd{padding: .5rem;border-radius: 1rem 0;}
    .progress_list dt ,.progress_list dd ,.course_list, .course_list th, .course_list td ,.lerning dd {font-size: 1.1rem;}
    .course_out  {overflow-x: scroll;}
    .course_list {width: 800px;}
    .offer_list {width: 96%;margin: .5rem auto;}
    .offer_bglist dd, .offer_bglist dt {padding: .2rem .5rem;font-size: 1.1rem;}
    .offer_list .redtxt ,.exam_offer dd{font-size: 1.2rem;}
    .page_note {font-size: 1rem;margin: 1rem 0;}
    .lerning {margin: .5rem auto;height: auto;}
    .arrow {width: 6%;}
    .lerning dt {font-size: 1.2rem;padding: .35rem 0 .8rem;}

}