﻿:root {
    --white:#FFFFFF;
    --blue: #3e64ea;
    --grayish-blue: #F0F1F6;
    --pink: #F8849B;
    --tiffany: #3b949e;
    --nile-blue:#2d8c97;
    --dark-nile-blue:#20717b;
    --jasmine:#ffe55a;
    --light-gold:#b6915a;
    --gold:#98733d;
    --dark-gold:#97611a;
    --red:#a6232e;
    --dark-red:#8c070e;
}

.bgcolor{margin: 3.5rem auto 0;background:linear-gradient(90deg, #760006, #e42327, #760006) }
.section_wrap {padding: 1rem;}
.wrap_all{word-break: keep-all;overflow-wrap: break-word;-webkit-hyphens: auto;-moz-hyphens: auto;hyphens: auto;-webkit-text-size-adjust: 100%;}

/* 2025高普考新班開課 */
.banner_bg{background: url('../images/1309019_bg.jpg') no-repeat top center / 100%;}
.banner {width: 100%;/*max-width: 1200px;*/padding: 1.5rem 0 1rem;margin:0 auto ;text-align: center;}
.banner_m{display: none;}
.banner img{width: 100%;filter: drop-shadow(1px 5px 6px #0000001f);}
.banner h1 {font-size: 6rem;}
.branch {justify-content: center;}
.branch li {padding: 0 0.5rem;font-size: 2rem;}
.celebrate_des {font-size: 3rem;}

/* 好禮四重送 */
.gift_title {font-size: 5rem;color:var(--dark-red);position: relative;bottom: -3rem;}
.gift_title span{font-size: larger;}
.bg-border-purple {border-radius: 3rem;width: 97%;margin: auto;background:linear-gradient(90deg, #fcedbe, #f5db87, #e9c25b);padding: 4rem 0 2rem;}
.gift_item {font-size: 2.25rem;font-weight: bold;color: var(--dark-nile-blue);padding: 0 0 .5rem 1.25rem;}
.gift_box {font-size: 1.1rem;width: 96%;height: 98%;margin: auto;background-color:var(--white);border-radius: 2rem;border-bottom: 6px solid var(--dark-gold);padding: 1rem 1.5rem;position: relative;filter: drop-shadow(1px 2px 3px #0000003f);}
.gift_box::before{content: '';width: 180px;height: 80px; position: absolute;top: 0;right: 0;background: url('../images/1309019_rosette.png') no-repeat top / 100%;}
.gift_box p {font-size: large;border-left: 6px solid var(--light-gold);padding:.5rem .5rem .5rem 1rem;margin: 0 0 .5rem 0;background: linear-gradient(45deg, #f0e0b36a, transparent 80%);}
.gift_detail , .gift_box ul , .clean {line-height: 1.8rem;margin: 0 0 0 .8rem;}
.decimal {line-height: 1.8rem;margin: 1rem 0 0 .8rem;}
.gift_detail mark , .gift_box ul mark , .clean mark, .decimal mark{border-bottom: 2px dotted var(--light-gold);background: unset;}
.gift_box .decimal li i {color: var(--nile-blue);padding: .5rem .25rem 0 0;}
.gift_date span , .clean span , .decimal span{font-size: large;}
.gift_date li i {color: var(--nile-blue);}
.gift_wrap .hooper {height: auto;}
.gift_wrap .hooper-navigation {position: absolute;top: -2rem;right: 20%;width: fit-content;}
.gift_wrap .hooper-navigation button {font-size: 2rem;color:var(--white);padding: 0;}
.gift_wrap .hooper-liveregion {display: none;}
.gift_wrap .hooper-prev::before {content: '\f177';font-family: "Font Awesome 5 Free";font-weight: bold;}
.gift_wrap .hooper-next::after {content: '\f178';font-family: "Font Awesome 5 Free";font-weight: bold;}
.gift_wrap .hooper-prev {left: -3rem;}
.gift_wrap .hooper-next {right: -3rem;}
.gift_wrap .icon-arrowRight, .gift_wrap .icon-arrowLeft {display: none;}
.gift_detail {font-size: 1.3rem;border-bottom: 2px dotted var(--light-gold);padding: 0.5rem 0 0.125rem;display: block;width: fit-content;}
.price_tag {color:var(--red);font-size: larger;}
.gift_box a {font-weight: bold;margin: 0 2px;}
.gift_box ul {padding: 0.5rem 0 0;}
.gift_box .clean {padding: 0 0 0 1.35rem;}
.clean li {text-indent: -1.35rem;padding: 0.5rem 0 0;}
.clean li::before {content:'\f06b';font-family: "Font Awesome 5 Free";font-weight: bold;padding: 0 0.25rem 0 0;color:var(--nile-blue);}
.decimal .decimal_num{font-weight: bold;line-height: 1.8rem;color:var(--white);background-color: var(--nile-blue);border-radius: 50rem;padding:0 .37rem .12rem;}
.gift_box .note {background-color: #f3e6ca;border-radius: 1rem;margin: 1rem 0 0 1rem;padding: 0 .5rem;width: fit-content;font-size: 1rem;}

/* 好課享優惠 */
.price_title {font-size: 5rem;color:var(--white);}
.price_title span{font-size: larger;}
.class_title {font-size: 2.35rem;font-weight: bold;color:var(--jasmine);width: 100%;margin: 2rem auto .35rem 1rem;}
.class_title:first-of-type {margin: 0 auto .35rem 1.1rem;}
.course_box {width: calc(100%/2 - 1.5rem);margin: 0 auto;background-color: #faffff;border: 1px solid var(--tiffany);border-radius: 2rem;padding: 1.5rem 1.5rem 1rem;}
.case .triple {width: calc(100%/3 - 1.5rem);}
.course_box dl {text-align: center;padding: 0 0 .5rem;}
.course_box dl dt {font-size: 1.7rem;font-weight: bold;color:var(--dark-nile-blue);}
.class_tag {background-color: var(--gold);color: var(--white);padding: 0 .5rem .05rem;border-radius: .5rem;font-size: 1.25rem;font-weight: lighter;border: 2px solid #f0e0b3;margin: auto auto auto 0.5rem;}
.course_box ul > li {padding: .8rem ;font-weight: bold;font-size: 1.1rem;line-height: 1.3;border-top: 2px dotted #3b949e6e;}
.course_box ol {font-weight: initial;}
.course_box .decimal {padding: 0 0 0 1.25rem;}
.course_box .decimal li {list-style-type: decimal;}
.course_box .twice ul {width: calc(100%/3);}
.voucher ol {margin: 0.35rem auto auto auto;}
.voucher i {color: var(--nile-blue);padding: 0 0.25rem 0 0;}
.open_time {background-color: var(--gold);color: var(--white);font-size: 1.1rem;font-weight: lighter;border: 2px solid #f0e0b3;padding: 1px 0.5rem;border-radius: .25rem;margin: auto 2rem auto 1rem;}
.triple .open_date ol {display: flex;flex-direction: row;}
.triple .open_date li {width: calc(100% / 2 - 1%);font-size: large;border-left: 6px solid var(--light-gold);padding: .35rem .35rem .35rem 0.5rem;margin: .5rem 0 0 .1rem;background: linear-gradient(45deg, #f0e0b36a, transparent 80%);}
.open_slide {width: calc(100% - 20%);line-height: 2.1rem;margin: .25rem auto 0;border-radius: .25rem;background: linear-gradient(to right, transparent 0%,#f6de90 10%, #fcecbd 100%);}
.open_slide dl {display: flex;flex-wrap: wrap;font-size: 1.1rem;color: black;line-height: 2.4rem;justify-content: center;align-items: center;}
.open_slide dl dd small {padding: 0 5px 0 2px;}
.open_slide dl dt {border: 1px dotted var(--red);border-radius: 0.25rem;padding: .15rem .25rem;margin: auto 0.25rem auto 0;line-height: 1.3rem;background-color: var(--white);}
.open_slide .VueCarousel {width: calc(100% - 19%);}
.open_slide .VueCarousel-navigation button {color: var(--red);}
.open_slide .VueCarousel-navigation-prev[data-v-453ad8cd] {left: 0.5rem;}
.open_slide .VueCarousel-navigation-next[data-v-453ad8cd] {right: 0.5rem;}

/* 中區高手齊聲推薦 */
.bg-grayish-blue {background: linear-gradient(to right, #ffc9cc 10%, #ffeded 50%, #ffc9cc 90%);border-top: 4px solid var(--white);}
.reviews_title {text-align: center;color:var(--dark-gold);padding: 0 0 .5rem;font-size: 4.5rem;}
.reviews_tab {margin: auto auto 2rem;}
.reviews_tab a {background-color:#98733daa;border-radius: 0.25rem;padding: 0.25rem 1rem;color: var(--white);font-size: 1.25rem;margin: auto 0.5rem;}
.reviews_tab a.active {text-decoration: none;background-color:var(--gold);position: relative;}
.reviews_tab a.active::before{content: '▼';position: absolute;bottom: -20px;left: 45px;color: var(--gold);}
.reviews_box {width: calc(100%/2 - 2rem);margin: 1rem auto;}
.reviews_box .rank {font-size: 1.6rem;position: relative;margin: auto auto .2rem;}
.rank::before {content: '\f091';font-family: "Font Awesome 5 Free";font-weight: bold;color:var(--red);font-size: 2rem;position: absolute;top: -.25rem;left: 0;text-shadow: 0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff, 0 0 10px #fff, 0 0 5px #fff;}
.reviews_box .rank span {color: var(--dark-red);font-weight: bold;z-index: 3;position: relative;padding: 0 0 0 2.5rem;text-shadow: 0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff, 0 0 10px #fff, 0 0 5px #fff;}
.reviews_box ul{padding: 0 .25rem;}
.reviews_box ul li {font-size: 1.1rem;padding: .15rem 0;}
.reviews_box ul li a{font-size: larger;color:var(--dark-nile-blue);font-weight: bold;}
.reviews_box ul li:last-of-type a {color:var(--gold);font-weight: bold;font-size: inherit;}
.reviews_cont .note {text-align: center;padding: .5rem 0;}
.reviews_cont .last {margin: 1rem auto 1rem 1rem;}

#Ask {background: linear-gradient(45deg, var(--gold) , var(--light-gold) , var(--gold) ) !important;}
#Ask input[type="submit"], #Ask input[type="reset"]{border: 1px solid #dcc7ae !important;background: var(--red);}

@media screen and (min-width: 1536px) {
    .gift_wrap {width: 90%;margin: 1rem -5% auto auto;}
}

@media screen and (min-width: 1201px) {	
	.section_wrap, .gift_title {width: 1200px;margin: auto;}
    .section_wrap {padding:2rem 0 3rem;}
    .gift_wrap {width: 95%;margin: 1rem -5% auto auto;}
}

@media screen and (min-width: 768px) {	
    .gift_wrap .hooper {height: 390px;}
}

@media screen and (max-width: 1535px) {
    .gift_box .md\:block {display: initial;}
    .banner_bg{background: url('../images/1309019_bg.jpg') no-repeat top center / 125%;}
    .banner{display: none;}
    .banner_m{display: block;}
    .banner_m img{width: 100%;padding: 1.5rem 0 1rem;margin:0 auto ;text-align: center;}
}

@media screen and (max-width: 1200px) {
    .banner_bg {background: url('../images/1309019_bg.jpg') no-repeat top center / 130%;}
    .banner {width: 98%;margin: 0 auto;padding: 1rem 0 0;}
    .gift_title , .price_title {font-size: 2.8rem;padding: 0 2.5rem;bottom: -2rem;}
    .gift_wrap .hooper-navigation button {font-size: 1.5rem;}
    .gift_item ,.class_title {font-size: 1.9rem;padding: 0 0 .5rem 0;}
    .gift_box {font-size: 1.05rem;padding: 1rem 1.25rem;}
    .gift_box::before {content: '';width: 135px;height: 60px;}
    .gift_box p {padding: .5rem .5rem .5rem .8rem;}
    .gift_box p br{display: none;}
    .gift_detail {font-size: 1.25rem;}
    .decimal {margin: 1rem 0 0 .8rem;text-indent: -1.7rem;padding: 0 0 0 1.5rem;}
    .course_box {width: calc(100% / 2 - .5rem);}
    .course_box dl dt {font-size: 1.5rem;}
    .triple .open_date li  {width: 100%;}
    .class_tag {font-size: 1.15rem;}
    .course_box {padding: 1rem 1rem .5rem;}
    .case .triple {width: calc(100% / 3 - .5rem);}
    .open_slide {width: 100%;margin: .5rem auto;background: linear-gradient(to right, #f0e0b3 0%, #f0e0b3 10%, #f0e0b3 90%, #f0e0b3 100%);}  
    .open_time {margin: auto 1rem auto 0;}
    .open_slide .VueCarousel-navigation-prev[data-v-453ad8cd] {left: 1.5rem;}
    .reviews_title {font-size: 3rem;}
    .reviews_cont .note {padding: .5rem 0 1rem;}
}

@media screen and (max-width: 767px) and (orientation: portrait) { 
    .bgcolor {margin: 2rem auto 0;background: linear-gradient(90deg, #760006, #e42327, #760006);}
    .banner {width: 100%;overflow: hidden;padding: .5rem 0 0;}
    .gift_title {font-size: 2rem;padding: 0 2rem;bottom: -1.5rem;}
    .price_title {font-size: 2rem;padding: 1rem 2rem 0;}
    .gift_item, .class_title {font-size: 1.6rem;padding: 0 0 .5rem .5rem;}
    .gift_wrap .hooper {height: 380px;}
    .gift_wrap .hooper-navigation button {font-size: 1.25rem;padding: 1.25rem .25rem 0 0;}
    .gift_wrap .hooper-prev {left: -1.05rem;}
    .bg-border-purple {padding: 3rem 0 1rem;}
    .section_wrap {padding: 0;}
    .class_title:first-of-type {width: 90%;margin: auto;}
    .reviews_title {font-size: 2rem;padding: 1rem;}
    .case{padding: 0 0 1.5rem 0;}
    .course_box .twice ul {width: 100%;}
    .open_slide .VueCarousel {width: 80%;margin: auto;}
    .open_slide dl {padding: .5rem;line-height: 1.3rem;}
    .open_time {margin: .4rem auto 0;}
    .open_slide .VueCarousel-navigation-prev[data-v-453ad8cd] {left: .5rem;}
    .course_box, .case .triple {width: 95%;margin: auto;}
    .reviews_box {width: 95%;padding: 0 0 0 .8rem;margin: auto 0 1rem .8rem;}
    .reviews_box .rank {font-size: 1.3rem;}
    .reviews_tab a {font-size: 1.05rem;}
    .reviews_tab a.active::before {bottom: -16px;}
}