@import url('https://fonts.googleapis.com/css2?family=Chiron+Sung+HK:wght@900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Chiron+Sung+HK:wght@200..900&family=Noto+Sans+HK:wght@100..900&display=swap');
:root{
	--item:#cc3333;
	--dark_item:#980023;
	--gold:#d7b14f;
	--dark_gold:#ba8500;
	--join1:#2ea58d;
	--join2:#00776f;
	--join3:#0a574c;
	--light:#FFFF79;
	--light_brown:#b79a32;
	--bgcolor_liner_red1:linear-gradient(90deg ,#980023 0%,#980023 85%,#98002300);
	--bgcolor_liner_red:linear-gradient(to right,#ffffff00 0%, #980023 10%, #980023 90%, #ffffff00 100%);
	--laurelWreath_right:url(../images/1501026_laurels_right.png) no-repeat top right;
	--laurelWreath_left:url(../images/1501026_laurels_left.png) no-repeat top left;
	--white:white;
}
h1,h2,h3{font-size:clamp(1.5rem, 1rem + 2vw, 3.1rem);text-align:center;font-family:"Noto Sans HK", sans-serif;font-weight:200;padding:1.2rem 1.8rem .8rem;margin:0 0 20px;color:var(--join2);}
small{font-size:.8em}
section p, div p{font-size:1.25em;line-height:1.9em;text-align:left;}
article{overflow: hidden;}
.bgcolor0{background:url(../images/1501026_bg.jpg) no-repeat top;background-size:100.5%;background-attachment:fixed;position:relative;background-image:#FFFF79;}
.bgcolor1{background-color:#F6F6F6;}
.bgcolor2{background:url(../images/0901057_dot2.png)top left no-repeat,linear-gradient(90deg,#d4efef 0%,#fdfbff 50%,#ffffffbf 60%,#d4efef 100%);border-top:6px dotted #fdba69cf;}
.bgcolor3{background:url(../images/0901057_dot2.png)top left no-repeat,linear-gradient(90deg,#eac689 0%,#fff9eb 50%,#fffdf1c9 60%,#dcc091 100%);border-top:6px dotted #f0fafacf;}
.bgcolor4{background:url(../images/0901057_dot2.png)top left no-repeat,linear-gradient(90deg,#e1d4ef 0%,#fdfbff 50%,#ffffffbf 60%,#e1d4ef 100%);border-top:6px dotted #f3e8d1;}
.target-fix{top:-3.5rem;position:relative;display:block;visibility:hidden;}
.text-center{text-align:center;}
.text_red{color:var(--item);}
.text_brown{color:var(--light_brown);}
.text_gold{color:var(--dark_gold);}
.text_yellow{color:var(--light);}
/*主圖*/
.bgcolor0 .hero{display:flex;align-items:center;justify-content:space-between;padding:0rem 2rem 0;max-width:100%;margin:0 auto -1rem;position:relative;z-index:1;}
.bgcolor0 .hero::before{position:absolute;content:'';width:1536px;height:286px;background:url("../images/big_light.png") center top / contain no-repeat;left:0;right:0;top:-50px;margin:auto;z-index:-1}
.bgcolor0 .hero::after{position:absolute;content:'';width:100%;height:100%;z-index:-2;filter:saturate(.7);left:0;right:0;top:0;bottom:0;margin:auto;background:linear-gradient(to bottom,rgb(237 104 2 / 60%) 4%,rgb(255 196 114 / 60%) 26%,rgb(255 255 255 / 70%) 40%,white 75%,transparent 97%)}
.bgcolor0 .main-title{flex:1 1 60%;position:relative;z-index:1;margin-right:-15rem;}
.bgcolor0 .hero-trophy{flex:0 0 40%;max-width:560px;aspect-ratio:1 / 1;pointer-events:none;filter:drop-shadow(0 12px 28px rgba(0,0,0,.25));transform:translateY(44px);}
.bgcolor0 .main-title h1{font-size:clamp(1.6rem, 1rem + 4vw, 6.6rem);}
.bgcolor0 .main-title h1 span{color:var(--join2);}
.rank_title{font-size:2rem;border-bottom:dotted 2px var(--gold);display:block;text-align:center;width:100%;}
.rank_title span{font-size:2.25rem;text-shadow:-1px 0 0 var(--item);}
.rank_cont{text-align:center;width:100%;}
.rank_cont .top{letter-spacing:6px;margin:auto -6px auto auto;padding:1.2rem 0 0;}
.rank_cont .ten{letter-spacing:-2px;}
.rank_cont .pr-1{padding:0 0.25rem 0 0;}
.main-title ul li{margin:auto 1%;}
.main-title{width:100%;}
.title_text{margin:0 auto;gap:2.2rem;}
.title_text img{width:100%;filter:none;}
.main-title h1{word-break:keep-all;overflow-wrap:anywhere;font-family:"Chiron Sung HK",serif;font-weight:900;color:var(--dark_item);text-shadow:2px 0 2px white,-2px 0 2px white,0 2px 2px white,0 -2px 2px white,0 0 6px white,0 0 15px white;letter-spacing:.15rem}
.main-title ul li{font-size:2rem;color:var(--white);}
.main-title ul li a{color:var(--join3);font-size:2.8rem;position:relative;z-index:1;}
.main-title ul li a::before{
	position:absolute;content:'';width:180px;height:190px;background:url("../images/light.png") no-repeat center / contain;
	top:0;left:0;right:0;bottom:0;margin:auto;animation:glow 3s ease-in-out infinite;z-index:-1;
}
@keyframes glow {
  0%   { opacity:.6; transform:scale(0.96); }
  50%  { opacity:1;  transform:scale(1); }
  100% { opacity:.6; transform:scale(0.96); }
}
.main-title ul li:hover{transform:scale(1.1);}
.main-title ul img{width:fit-content;filter:none;filter:drop-shadow(5px 5px 7px #edd);}
.main-title li small{font-size:2rem;color:var(--join3);}
.title-deco{width:fit-content;margin:auto;position:relative;font-family: "Microsoft YaHei", Times, serif;}
.title-deco::before,.title-deco::after{top:1rem;position:absolute;content:'';width:66px;height:101px;filter:drop-shadow(5px 5px 8px white);}
.title-deco::before{background:var(--laurelWreath_left);left:-1.5rem;}
.title-deco::after{background:var(--laurelWreath_right);right:-1.5rem;}
/*2025 司特‧調特全方位霸榜*/
.strength_flex{margin:15px 0 0;}
.strength_flex dl{padding:25px 2% 29px;background:var(--white);margin:.6rem auto 0;border-radius:1rem;border-top:solid 1px #f3bb20;box-shadow:0px 8px 4px -3px #0000003f;display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;width:100%;}
.strength_flex dt{font-size:2em;color:var(--join2);font-weight:bold;font-family:Verdana,"Microsoft JhengHei";line-height:2.8rem;padding:.3rem 0 .5rem;margin:0 0 10px;text-align:center;width:100%;}
.strength_flex dt span{margin-right:2%;display:block;font-weight:bold;font-size:1.3em;}
.strength_flex dd{font-size:1.7em;line-height:43px;/*margin:auto 1rem;display:inline-block;*/text-align:left;width:calc(100%/3);}
.strength_flex dd.text-center{text-align:center;}
.rank_box{width:80%;margin:auto;}
.strength_flex dd > font{color:var(--item);font-weight:bold;font-family:"Microsoft YaHei", Times, serif;}
.billboard-more{width:100%;margin-top:1rem;text-align:center;}
.billboard-more a{font-size:1.4rem;background-color:var(--item);color:var(--white);padding:.5rem 1.5rem .5rem .7rem;border-left:6px solid #f3d13c;clip-path:polygon(0% 0%, 90% 0, 100% 50%, 90% 100%, 0% 100%);position:relative;text-align:center;text-decoration:none;display:inline-block;}
.billboard-more:hover{transform:translateX(6px);}
.billboard-more a:hover{background-color:var(--dark_item);border-left:6px solid #dbb961;}
/*最強會法名師團*/
.teacher-intro{padding:1rem 0;}
.teacher-intro .VueCarousel{width:100%;}
.teacher-intro .tabVuecontent{width:100%;}
.teacher-tabs{justify-content:center;padding:1rem 0;}
.teacher-tabs a{font-size:1.9rem;margin:auto 1rem;cursor:pointer;filter:brightness(0.9);}
.teacher-tabs a.active{font-weight:bold;font-size:2.1rem; text-decoration:none;background:white;padding:0.1rem 2rem;color:var(--join2);border-radius:0.5rem;}
.teacher-tabs a.active::before{content:'';}
.teacher-card{width:90%;margin:auto;background:linear-gradient(to bottom, transparent 0%, white, 30%, white 70%, transparent 100%);border-radius:1rem;padding:1rem;filter:drop-shadow(0px 2px 4px white);}
.teacher-card dt{font-size:1.5rem;text-align:center;}
.teacher-card dt a{display:inline-block;text-decoration:none;color:white;background:var(--join2);padding:0.1rem .8rem;border-radius:0.5rem;margin-bottom:1.5rem;}
.teacher-card dd{margin:0.3rem auto;}
.teacher-card p{font-size:1.125rem;line-height:initial;text-align:justify;}
.teacher-card dd:nth-last-of-type(2){font-size:1.5rem;text-align:center;color:var(--dark_item);}
.teacher-card dd img{margin:auto;background:linear-gradient(30deg, #f9dc78, transparent);border-radius:50%;}
/*會法跨域整合*/
.advantage-tb{width:calc(100% - 1.5rem);margin:1rem auto;border-collapse:collapse;}
.advantage-tb th, .advantage-tb td{border:dotted 1px var(--gold);background-color:var(--white);padding:.25rem;text-align:center;}
.advantage-tb th{font-size:1.25rem;}
.advantage-tb tr th a:first-of-type{color:inherit;}
.advantage-tb tr:last-of-type td{border-radius:0 0 15px 15px;border:0;}
.advantage-tb .subject_title{display:table-cell;border:0;border-radius:15px 15px 0 0;background-color:var(--dark_item);font-size:1.8em;}
.advantage-box .subject_cont{width:calc(100%/2 - 1%);margin:auto;}
.advantage-tb tr a{color:var(--join2);}
.advantage-tb tr a i{border-bottom:1px dotted  var(--join1);font-size:1.3rem;}
.advantage-tb tr a i:hover{border-bottom:0px dotted  var(--join1);}
.advantage-tb{width:99%;margin:1rem auto;border-collapse:collapse;box-shadow:0px 2px 4px -3px var(--dark_item);border-radius:1rem;}
/*報考優勢*/
.subject_box{width:fit-content;margin:auto;}
.subject_card{margin:1rem auto;display:flex;flex-wrap:wrap;}
.subject_title{display:block;font-size:1.75rem;font-weight:bold;font-family:Verdana,"Microsoft JhengHei";margin:auto;text-align:center;background-color:var(--dark_item);color:white;line-height:1.5em;padding:0 3rem;}
.subject_title a{color:inherit;}
.subject_cont p{text-align:center;padding:1rem;line-height:29px;font-size:1.25rem;}
.subject_cont p strong{color:var(--item);font-family:Verdana,"Microsoft JhengHei"}
.subject_cont{text-align:left;margin:0 0 0 .5rem;border-radius:15px;overflow:hidden;background-color:var(--white);box-shadow:0px 2px 4px -3px var(--dark_item);}
.guide_btn{text-align:center;}
.guide_btn a{display:inline-block;text-decoration:blink;padding:.5rem 1.5rem;margin:1rem;text-decoration:blink;text-align:center;position:relative;overflow:hidden;border-radius:30px;color:#fffefe;font-size:1.6em;font-weight:bold;background-color:var(--join2);}
.audition_btn{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;}
.audition_btn .want{font-size:1.6em;color:var(--join2);}
.audition_btn .guide_btn a{font-size:1.2em;margin:auto 0.25rem;}
.guide_btn a:before{content:'';z-index:2;position:absolute;top:50%;left:100%;margin:-15px 0 0 1px;width:30px;height:30px;border-radius:50%;background:linear-gradient(110deg ,#00776f,#2ea58d,#2ea58d,#00776f);transform-origin:100% 50%;transform:scale3d(1, 2, 1);transition:transform 0.3s, opacity 0.3s;transition-timing-function:linear;}
.guide_btn a:hover:before{-webkit-transform:scale3d(9, 9, 1);transform:scale3d(18, 9, 1);color:var(--white);}
.guide_btn a span{position:relative;z-index:2;font-family:"Microsoft YaHei", Times, serif;}
.subject_mark{font-weight:bolder;font-size:2.5em;background:linear-gradient(90deg,transparent,#d2a944,#fff08b,#fdfac5,#d3ab45,transparent);color:var(--dark_item);margin:33px 0 0;border-bottom:solid 4px #d7b35a57;text-align:center;}
/*從基礎到進階*/
.subtitle{background:var(--bgcolor_liner_red);color:var(--white);margin:0 -5rem auto 0;text-shadow:2px 2px 5px #682e60;}
.subtitle::before{content:"";position:absolute;bottom:-20px;background:url(../images/0901057_shoaw.png) no-repeat;opacity:.5;width:1200px;height:19px;left:0;right:0;margin:auto;background-size:100%;}
.stage_title{background:var(--bgcolor_liner_red1);color:var(--white);font-size:2rem;padding:1rem 4.55rem 1rem 4.3rem;margin:auto .05rem auto 0;text-align:center;line-height:2.3rem;}
.subject_box_third .subject_title{padding:0 .5rem;}
.subject_box_third .stage_title{padding:1rem 2.8rem 1rem 2.6rem;}
/*見賢思齊*/
.experience_list{border-bottom:dotted 2px var(--gold);padding:1rem;margin:.5rem auto;text-align:justify;}
.experience_list p a{color:var(--join2);font-weight:bold;}
.experience_take{font-size:2em;color:var(--item);font-weight:bold; font-family:"Microsoft YaHei", Times, serif;padding:.5rem 0 .2rem;}
.experience_list:last-child{border:none;}
.experience_name{font-size:1.8em;}
.experience_name small{font-size:1.2rem; padding:0 .1rem;}
.experience_name span{color:var(--white);text-shadow:0 0 6px #25252583;font-weight:bold;padding:.1rem 2rem 0.1rem 1.5rem;background:linear-gradient(110deg ,#7e5699bd,#ac7cca,#bf89e0,#9d68bebd);background:var(--dark_gold);background:linear-gradient(90deg ,#ba8500,#ba8500,#ba8500,#ba8500,#ba850000);background:var(--bgcolor_liner_red1);}
/*榜單連年表現亮眼*/
.name_list{padding:1rem 2.5rem;margin:auto;}
.name_list li{font-size:1.75rem;width:calc(100%/3);border-left:6px solid #d7b14f;margin:.35rem 0;padding:0 0 0 .6rem;}
.name_list li span{color:var(--dark_item);padding:0 0.5rem 0 0;}
@media screen and (min-width:1700px){
	.main-title ul{width:calc(100% - 10%);}	
}
@media screen and (min-width:1536px){ 	
	.strength_flex{width:1200px;margin:auto;}
	.teacher-intro .VueCarousel-inner{justify-content:center;}
}
@media screen and (min-width:1201px) and (max-width:1700px){
	.main-title ul{width:100%;}
}
@media screen and (min-width:1201px){  	
	.main-title{margin:auto;}	
	.md\:block{display:block;}
}
@media screen and (max-width:1535px){
	.subtitle::before{display:none;}
	.bgcolor0 .hero::before{width:100%;top:-20px;}
	.main-title ul li{top:20%;}
	.teacher-intro .VueCarousel{width:85%;margin:auto;}
	.name_list li{width:calc(100% / 2);}	
}
@media screen and (max-width:1280px){
	.subject_cont{margin:.5rem auto;}
	.name_list li{font-size: 1.5rem;}
}
@media screen and (max-width:1200px){		
	.bgcolor0{background-size:100.5% 100%;}
	.strength_flex dt{font-size:2em;}
	.bgcolor0 .main-title{position:initial;margin-right:-5rem;}		
	.main-title ul img{width:100%;}	
	.guide_btn a{margin:10px 10px 0;}
	.order1{order:1;z-index:1;}
	.order2{order:2;}
	.order3{order:3;}
	.stage_title{margin:auto;}
	.subject_card{justify-content:center;}
}
@media screen and (max-width:1280px){
	.title-deco::before,.title-deco::after{top:0;bottom:0;margin:auto;}
	.stage_title{width:100%;margin:auto auto .5rem;}
	.title_text{width:100%;}
	.main-title ul li{width:calc(100%/3 - 6%);top:18%;}
}
@media screen and (max-width:1023px){
	.strength_flex dd{width:calc(100%/2);}
	.sm\:block{display:block;}
	.break-initial{word-break:initial;}
	.subject_cont{margin:.5rem auto;}
	.subject_title{padding:0;}
	.subject_box_third .subject_cont p{padding:1rem .5rem;font-size:1.125rem;}
	.name_list li span{display:block;}
	.mb-fixed{position: fixed;padding: 0.5rem 0;bottom: 0;left: 0;right: 0;background: linear-gradient(110deg, #00776f, #2ea58d, #2ea58d, #00776f);z-index: 2;}
	div.mb-fixed a{background:initial;padding: 0;overflow: initial;margin: auto 10px;}
	div.mb-fixed a::before{content: none;}
	div.mb-fixed a:first-of-type{display: none;}
	.pin_top{bottom:60px;}
}
@media screen and (max-width:767px){
	.bgcolor0 .hero{flex-direction:column-reverse;text-align:center;padding-bottom:20px;padding:0;}
	.bgcolor0 .hero::before{display:none;}
	.bgcolor0 .main-title{flex-basis:auto;margin-right:auto;}
	.bgcolor0 .hero-trophy{flex-basis:auto;width:min(360px, 92vw);max-width:none;transform:none;margin:0 0 -6rem -3rem;}
	.bgcolor0 .main-title{margin-right:auto;}
	.strength_flex dd{width:100%;font-size:1.45rem;}
	.br_mobile{display:block;}
	h1,h2,h3{margin:0;word-break:keep-all;overflow-wrap:anywhere;font-weight:bold;padding:1.2rem 1.8rem .8rem;}
	.subject_cont, .advantage-box .subject_cont{width:90%;margin:.5rem auto;}
	.subtitle{margin:auto;width:100%;}
	.experience_take{font-size:1.5em;}
	.experience_list{padding:1rem;}
	.main-title ul li{width:50%;font-size:1.25rem;margin:.5rem auto;height:fit-content;top:34%;}	
	.main-title li small{font-size:1rem;}
	.main-title ul li a::before{width:120px;height:130px;}
	.strength_flex dl{width:100%;}
	.billboard-more a{font-size:1.2rem;}
	.subject_mark{font-size:2em;}
	.strength_flex{margin:auto 1rem 1rem;}
	.strength_flex dd{font-size:1.25rem;margin:auto;line-height:35px;}
	.subject_title, .advantage-tb .subject_title{font-size:1.4em;}
	.advantage-tb th{font-size:1.125rem;}
	.strength_flex dt{font-size:1.4em;line-height:2.2rem;}
	small{font-size:.7em;}
	.strength_flex dt span{font-size:1.25em;}
	.rank_cont{width:80%;}
	.rank_title{font-size:1.5rem;word-break:keep-all;overflow-wrap:break-word;}
	.rank_title span{font-size:2rem;}
	.stage_title{font-size:1.65rem;margin:auto;background:var(--bgcolor_liner_red);width:90%;padding:0;}
	.subject_cont p{font-size:1.05rem;}
    .experience_name{font-size:1.3em;}
	.experience_take{font-size:1.15em;}
	section p, div p{font-size:1em;line-height:1.8em;}
	.guide_btn a{margin:.3rem;font-size:1.25em;padding:.3rem 1.3rem;background:linear-gradient(110deg ,#00776f,#2ea58d,#2ea58d,#00776f)}
	.audition_btn .guide_btn a{background:var(--join2)}
	.name_list{padding:1rem 0rem 1rem 1rem;}
	.rank_cont .top{letter-spacing:4px;margin:auto -4px auto auto;}
	.rank_cont .ten{letter-spacing:-1px;}
}
@media screen and (max-width:767px) and (orientation:portrait){
	.title-deco::before{left:0;}
	.title-deco::after{right:0;}
	.advantage-tb{display:block;width:89%;}	
	.name_list li{width:100%;font-size:1.25rem;}	
	.name_list li span{display:initial;}
	.title-deco{width:100%;}	
}
@media screen and (max-width:430px) and (orientation:portrait) { 
	.advantage-tb{overflow-x:auto;white-space:nowrap;}
	.advantage-tb tbody{width:100%;white-space:nowrap;}
}