﻿/* css reset 歸0 */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,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%}
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}
/* css reset 歸0 end */
body{margin:0 auto;padding:0;font-family:"微軟正黑體", Arial;}
#BodyContainer{margin:0 auto;}
#BodyContentEvent{width:100%}
#event{width:100%;margin:0 auto;}
#event a:hover{text-decoration:none;left:1px;top:1px;position:relative}
img{max-width:100%;}
picture { background-color: #e05f0b;background: linear-gradient(0deg, #ef8d20, #e36809);display: block;  text-align: center;}
.w-full{width:100%;}
.row100{width: 100%;}.row50{width: 48%;}.row33{width:32%;}
h1{ font-size:3rem; }
h2{ font-size:2rem; }
h3{ font-size:1.5rem; }
[class*="flex"]{display: flex;}
ul, li, ol {list-style-type: none;}
a:hover{position: relative;top: 1px;left: 1px;}
small{font-size: smaller;}
.bg1{}
.bg3,.bg4{padding:2.5% 10px;text-align: center;}
.bg2{background: linear-gradient(to right,#bb7c0e 10%, #e0ae59 60%,#bb7c0e 100%);}
.bg3{background: linear-gradient(to top,#7bdbff 0%,#fff 100%);}
.bg4{background: linear-gradient(to top,#ffd7a8 0%,#fff 100%);}
.bg5{background: linear-gradient(0deg, #ef8d20, #e36809);}
.bg6{background-color: #ffa0a0;}
.bg7{background-color: #EBEBEB;}
.red_hit{color: rgb(191 46 167);text-shadow: #FFF 0px 2px, #FFF 2px 0px, #FFF -2px 0px, #FFF 0px -2px, #FFF -1px -1px, #FFF 1px 1px, #FFF 1px -1px, #FFF -1px 1px;margin: 0 0.1em;font-size: 1.2em;font-weight: bold;}
/*display*/
.block{display:block}.inline-block{display:inline-block}
.inline{display:inline}
.flex{display:flex}.inline-flex{display:inline-flex}
.table{display:table}.table-row{display:table-row}.table-cell{display:table-cell}
.flex-row {flex-direction: row;}.flex-col {flex-direction: column;}
.flex-wrap{flex-wrap: wrap;}
/*定位*/
.fixed {position: fixed;}
.flex-1 {flex: 1 1 0%;}
.flex-auto {flex: 1 1 auto;}
.flex-initial {flex: 0 1 auto;}
.grid {display: grid;}
.inline-grid {display: inline-grid;}
/*對齊*/
.justify-center {justify-content: center;}
.justify-around {justify-content: space-around;}
.items-center {align-items: center;}
.content-around {align-content: space-around;}
.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}
.act_exam,.act_year{font-weight: bold;text-align: center;font-size:2.8rem;background: linear-gradient(45deg, #8b0400, #ad2b1b ,#8b0400);border-radius: 9px;display: inline-block;padding: 0 4%;color:white}
.group_list{width:100%;background-color: white;}
.group_list,.group_list th,.group_list td{border-collapse: collapse;border:1px #ccc dotted;}
.group_list th,.group_list td{padding:0.6rem 1.6rem;text-align: center;}
.group_list th{font-weight: 400;font-size: 1.05rem;}
.group_list td {font-size: 1.1rem;}
.group_list th:nth-child(1) { padding:0.6rem 1.6rem 0.6rem 0;}
.group_list tr:nth-child(odd){background:#f5f5f5;}
.group_list th {background-color:#e05f0b;color: #fff;}
.group_list th:nth-child(4){color:#ffff00;}
.group_list td:nth-child(4){color:#ae2c1c;font-weight: bolder;font-family: Verdana, "Microsoft JhengHei";}
.group_list td p{text-align: left;}
.group_list td p > a{color: #ae2c1c; font-size:1.2rem;}

.group_list th, .group_list td { position:relative;}
.group_list th .hours, .group_list td .hours{ text-align: center; display: inline-block; float: right;}
.group_list .hours{ padding:8px; min-height:42px; background:linear-gradient(to top, #f6a9355a 20%, #ffffff00 100%);}
.group_list div > span {padding: .2rem 1rem;border-radius: 10px;background: linear-gradient(90deg, #f6a935, #e16609);/*background-color:rgba(31,73,125,0.85);color:#ffffff;*/}
.group_list .audition {color:#ffffff; margin-left:15px;}
.group_list .audition:before { content: url(../Image/ico_audition.png); padding:0 2px;}
.group_list .audition:after { content: url(../Image/btn_play_xxxs.gif);padding:0;}

	
.box1_Bred {color: #ae2c1c;/*border-bottom: 1px ridge #ae2c1c;*/}
#event_discount>dl{width: calc(100%/2);border: 1px ridge #000; }
#event_discount>dl>dd{display: inline-block; margin: 0 2%;}
.label_title{text-align: left;font-size: 1.8em;margin:20px 0 5px;position: relative;    padding: 0 0 0 20px;}
.label_title:before{content:"";position: absolute;width: 0;height: 0;border-style:solid;border-color:transparent transparent transparent #ffa133;border-width:10px 0px 10px 10px;    left: 0;top: 9px;}
.label_txt{margin: 5px 0;text-align: left;}
.label_txt li{display: inline-block;margin: 0 2px;font-size: 0.90em;}
.explain{display: flex;justify-content: center;padding:.5rem;}
.explain div{border-bottom: 1px dashed #f6a935;}
.explain .luckyBag{width: 17%;padding: 1rem;}
.explain .luckyBag img{width: 100%;}
.explain h3 {font-size: 2.8rem;color: #e05f0b;padding: 1rem 0 .25rem;}
.explain ul{display: inline-block;padding: 1rem 0;margin: auto .5rem auto 1rem;}
.explain ul li{font-size: 1.9rem;line-height: 1.6rem;text-align: left;}
.explain_square ul li{list-style: square;margin: 0 0 0 3.5rem;}
.explain ul li i{color: #e05f0b;}
.explain ul li a{line-height: 3rem;color: #000;border-bottom: 1px dotted #666;padding: .25rem 0;}
.explain ul li a:hover{border-bottom: unset;}
.explain small{font-size: 1.55rem;}
.event_info div{padding:.25rem 0 1rem;width: 70%;margin: auto;}
.more_event{padding: 1rem 2rem 1rem .5rem;}
.more_event a{width: fit-content;font-size: 1.425rem;color: #ffffff;display: block;padding: .1rem 1rem;margin: .5rem;background: #e05f0b;border-radius: 50rem;}
.more_event a:hover{background: #ae2c1c;}

.special_flex{margin:10px 0 0;}
.special_flex > .special_list{width:calc(100% / 2);text-align: center;padding: 8px 0;background-color: #e46d09;}
.special_list h3{color:white; font-size: 2.5em;margin: 0 0 3px;}
.special_list a{color: #ffe345;font-size: 1.4em;margin: 0 6px;text-decoration: underline;}
.group{ background-color: white;border: solid 1px #d6d6d6;margin: 35px 0 35px;padding: 20px 26px;border-radius: 8px;}
.group .group_title+.label_title{margin:0px 0 5px;}   
.group_title{font-size: 2.3em;color: #1f497d;}
.buy {margin:0 auto 1rem;display: flex;justify-content: center;}
.buy a{box-shadow: 3px 3px 5px #00000062;background: #c70002;color: #fff8e6;padding: .1rem 1rem;font-size: 1.3rem;border-radius: 50rem;margin: auto;border: 2px solid #fee49a;text-decoration: none;display: inline-block;/*color: #1F497D;border: 1px solid #1F497D;padding: 0.25rem;*/}

#help {font-size: 1.15rem;text-align: left;background:#f1972c;border-radius: 1rem;padding: 1rem;position: fixed;right: 0;border-left: 1px solid;border-top: 1px solid;}
#help dt{color: #fffefd;}
#help:hover {background:#f1972c;}
#help a{color: #000;font-size: medium;padding: 0 0 0 .25rem;display: block;}
#help div:nth-child(2) dl:first-child a{color: #fffefd;font-size: 1.15rem;text-align: left;padding: unset;}

#experience{width: 1200px;margin: auto;padding: 1.5rem 2rem 2rem;}
#experience h3{font-size: 2.8rem;text-align: center;color: #fff;padding: 0 0 .25rem;}
.experience_stu{background: #ffc46a;border-radius: 1rem;padding: 1rem 2rem 2rem;}
.experience_stu a{color:var(--point_b);text-decoration: underline;}
.experience_stu a:hover{text-decoration:none;}
.experience_stu dl{padding: .5rem;border-bottom: 1px dashed #ffffff88}
.experience_stu dl dt{font-size: 1.6rem;font-weight: bold;color:var(--point_b);padding: .35rem 0;text-align: left;}
.experience_stu dl dd{font-size: 1.15rem;padding: .55rem 0 0;text-align: left;}
.experience_stu .pass{font-size: 1.25rem; color: #fff;padding: .25rem .8rem;border-radius: 1rem;background: linear-gradient(45deg, #8b0400, #ad2b1b, #8b0400);}
.experience_stu dl dd:nth-child(2){background: #fff;width: fit-content;padding:0 .8rem 0 .5rem;border-radius: 1rem;}

/* 共用 end */
/*PC*/
@media all and (min-width: 1201px){
#BodyContainer,#BodyContentEvent{width:100%;margin:0;}
#event_master,#event_info,#event_discount,#event_list,#event_Law,#event_License,#event_Cross,#event_change,#event_notice,#event_news,#BodyFooter_rwd{margin:0 auto;max-width:1400px; padding: 0px;}

.group_list div {text-align: left;font-size:1rem;padding:8px 3px 0}
.group_list .hours{ width:85px; padding:.6rem 1.3rem 0;position:absolute; bottom:0; right:0}
.group_list td .hours{ padding-bottom:1.6rem;}
.group_list th {width:15%;}
.group_list th:nth-child(1) {width:55%;}
.group_list td:nth-child(1) p {width:calc(100% - 85px);}
}
/*mobile*/
@media all and (min-width: 1px) and (max-width: 1200px){ 
body {margin:0;text-align:center;width:100%;}
.course_bg, #experience {width:100%;}
.explain ul {margin:auto .5rem;}
.explain .luckyBag {width: 22%;}
.explain_square h3 span{display: inline-block;line-height: 3.5rem;}
.explain div{flex-direction: column;}
.event_info div {padding: .6rem 0 1rem;width: 100%;margin: 0 auto ;}
.more_event {padding: 0 .5rem 1rem;}
.group { padding: 20px 15px;}
.group_list .audition {color: #ffffff;margin-left: 5px;}
.more_event a{display: inline;font-size: 1.6rem;padding: .35rem 1rem;margin: .5rem 1rem;}
#help{bottom: 0;width: 100%;border-radius: 1rem 1rem 0 0;}
#help div{display: flex;justify-content: center;align-items: center;flex-wrap: wrap;}
#help dl{padding: .5rem 1.5rem 0;}
#help dl dd , #help dl dd a{display: inline;}
#help div:first-child dl:first-child{border-right: 1px dotted;}
#help div:nth-child(2) dl:first-child {display: flex;flex-direction: row;}
#help div:nth-child(2) dl:first-child dt{padding: .25rem 1.2rem 0 0;}
#BodyFooter{margin: 0 auto 7rem;}
}
@media all and (min-width: 768px) and (max-width: 1200px){ 
.group_list th, .group_list td {
    padding: 0.6rem 0.5rem;
}
.group_list .hours{ width:60px; padding:0.75rem 0 0; max-height:62px; position:absolute; bottom:0; right:0}
.group_list td .hours {padding-bottom:1.6rem;}
.group_list th:nth-child(1) {width:60%;}
.group_list th:nth-child(2) {width:13%;}
.group_list td:nth-child(1) p {width:calc(100% - 50px);}
.group_list div {text-align: left; padding:8px 0 0}
}
@media(max-width:767px){
.group_list th, .group_list td {padding: 0.6rem 10px;}
.explain{flex-direction: column;}
.explain h3 {font-size: 2rem;}
.explain_square h3 span {line-height: 2.2rem;}
.explain_square ul li {margin: 0 0 0 2.5rem;}
.explain ul li a {line-height: 2.5rem;}
.explain small {font-size: 1.25rem;}
.explain ul{margin: auto;}
.explain ul li {font-size: 1.45rem;}
.explain .luckyBag {width: 25%;margin: auto;padding: unset;}
.more_event a {font-size: 1.3rem;}

.act_exam, .act_year {font-size: 2em;}
.group_title {font-size: 1.9em;margin: 0 0 5px;}
.label_title {font-size: 1.5em;}
.special_list h3 {font-size: 1.7em;}
.special_list a {font-size: 1.2em;display: block;line-height: 45px;}

.group_list th .hours { display: none; }
.group_list td .hours{ padding:10px 0 0;position:relative; float:none; width:130px; margin:0; max-height:30px; background:none}
.group_list td .hours:before { content: "時數："; }
.group_list th:nth-child(1) { padding:0.6rem;}
.group_list td:nth-child(1) p {width:100%;}
.group_list div{ padding:0; text-align:center;}
.group_list div > span {padding: .25rem;background-color:transparent; display:block; text-align:center;}
.group_list div span .subjects{ border-radius:10px; background-color:rgba(31,73,125,0.85);color:#ffffff; padding:1px 15px}
.group_list div span .audition {display:block;/*color:#272727;*/margin: .2rem auto 0;}
/* .group_list .audition:before { content: url(../Image/ico_audition_b.png); padding:0 2px;} */

#experience {padding: 1.5rem 1rem 2rem;}
#experience h3{font-size: 2rem;}
#experience h3 span{display: block;}
 
#help div:first-child dl:first-child {border-right: none;border-bottom: 1px dotted;width: 100%;padding: 0 .5rem .45rem;margin: 0 auto .55rem;}
#help div {justify-content: left;}
#help dl {padding: 0 .25rem;}
#help a {padding: 0 0 0 .2rem;}

#BodyFooter {margin: 0 auto 11rem;}
#footLOGO{padding: .5rem;}

}

/*讓專區按鈕黏在上面*/
.bg2 {  position: -webkit-sticky; position: sticky; top: 0; z-index:9; opacity:0.9;}
.special_list { cursor:pointer;}
@media (max-width:767px) {
    .bg3, .bg4 { padding: 50px 10px 15px;}
    .special_list span{display:none;}
    .stickyMe { position:sticky; top:80px;}
}