#banner{position:relative;width:100%;height:clamp(760px,50vw,960px);min-height:760px;background:#fff;overflow:hidden}
#banner .main-slider,#banner .slick-list,#banner .slick-track,#banner .item{height:100%}
#banner .item{position:relative;width:100%;overflow:hidden;background:#fff}
#banner .clip{position:absolute;inset:0;z-index:1;overflow:hidden;background:#dff6ff}
#banner video,#banner iframe{position:absolute;width:120%;height:120%;object-fit:cover;border:0;top:50%;left:50%;transform:translate(-50%,-50%);opacity:0;visibility:hidden;transition:opacity 1s ease;pointer-events:none}
#banner .item.video-ready video,#banner .item.video-ready iframe{opacity:1;visibility:visible}
#banner .item .bgBox{opacity:1;visibility:visible;transition:opacity 1s ease,visibility 1s ease,transform 8s cubic-bezier(.16,1,.3,1)}
#banner .item.video-ready .bgBox{opacity:0;visibility:hidden}
#banner .item>.pos_abs:has(video),#banner .item>.pos_abs:has(iframe){width:100%;height:100%;top:0;left:0;z-index:1}
#banner .bgBox{position:absolute;inset:0;background-repeat:no-repeat;background-position:center center;background-size:cover;transform:scale(1.06)}
#banner .slick-active .bgBox{animation:bannerBgIn 8s cubic-bezier(.16,1,.3,1) both}
#banner .banner_overlay{position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(255,255,255,.08) 0%,rgba(255,255,255,.01) 46%,rgba(255,255,255,.06) 100%);pointer-events:none}
#banner .info{position:absolute;inset:0;z-index:6;display:flex;align-items:flex-start;justify-content:center;text-align:center;pointer-events:none;display: none;}
#banner .banner_content{position:relative;width:min(1040px,80vw);margin:0 auto;padding-top:clamp(100px,8.2vw,155px);display:flex;flex-direction:column;align-items:center;pointer-events:auto}
#banner .banner_eyebrow{position:relative;display:flex;align-items:center;justify-content:center;gap:20px;margin:0 0 26px;font-family:Inter,"Noto Sans TC",sans-serif;font-size:12px;font-weight:800;line-height:1.5;letter-spacing:.28em;color:#58bfd0;text-align:center;text-transform:uppercase}


#banner .banner_content .txth3{position:relative;display:block;max-width: 800px;margin:0 auto;font-size: clamp(48px,4.8vw,53px);font-weight: 700;line-height:1.18;letter-spacing: .035em;color: var(--primary);text-align:center;text-wrap:balance;text-shadow:0 4px 18px rgba(255,255,255,.5)}
#banner .banner_content .txth3 span{position:relative;color:var(--secondary)}
#banner .banner_content .txth3 span:after{content:"";position:absolute;left:4%;right:4%;bottom:-5px;height:7px;border-bottom:3px solid rgba(var(--secondary-rgb),.5);border-radius:50%;transform:rotate(-2deg)}
#banner .slick-slide .txth3{opacity:0;transform:translateY(42px);filter:blur(8px)}
#banner .slick-active .txth3{animation:bannerTitleReveal 1s .25s cubic-bezier(.16,1,.3,1) both}
@keyframes bannerTitleReveal{0%{opacity:0;transform:translateY(42px);filter:blur(8px)}100%{opacity:1;transform:translateY(0);filter:blur(0)}}
#banner .banner_content .txt p{display:block;margin: 40px auto 0;max-width:650px;font-size:clamp(15px,1.15vw,19px);font-weight:500;line-height:1.8;letter-spacing:.03em;color: #d85579;text-align: center;}
#banner .banner_action{display:inline-flex;align-items:center;justify-content:center;gap:15px;height:58px;padding:0 24px 0 31px;border-radius:999px;background:#eb5d84;color:#fff;font-family:"Noto Sans TC",sans-serif;font-size:16px;font-weight:700;letter-spacing:.06em;box-shadow:0 12px 28px rgba(235,93,132,.25);transition:transform .35s ease,box-shadow .35s ease,background .35s ease;margin: 60px auto 0;}

#banner .banner_eyebrow:before,#banner .banner_eyebrow:after{content:"";display:block;width:34px;height:1px;background:rgba(88,191,208,.55)}
#banner .txt{overflow:hidden}
#banner .banner_content>.txt:first-of-type{max-width:960px;margin:0;font-family:"Noto Sans TC",sans-serif;font-size:clamp(48px,4.6vw,78px);font-weight:900;line-height:1.18;letter-spacing:-.055em;text-align:center;text-wrap:balance;background:linear-gradient(100deg,#174b60 0%,#174b60 30%,#2494aa 48%,#eb5d84 68%,#d84c73 82%,#174b60 100%);background-size:160% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 5px 16px rgba(255,255,255,.45))}
#banner .banner_content>.txt:nth-of-type(2){max-width:720px;margin:27px auto 0}
#banner .banner_content>.txt:nth-of-type(2) p{display:block;margin:0;font-family:"Noto Sans TC",sans-serif;font-size:clamp(16px,1.1vw,19px);font-weight:600;line-height:1.95;letter-spacing:.04em;color:#405d68;text-align:center;text-wrap:balance;text-shadow:0 2px 10px rgba(255,255,255,.6)}
#banner .banner_action{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:15px;height:60px;margin:35px auto 0;padding:0 19px 0 31px;border-radius:999px;background:linear-gradient(135deg,#eb5d84 0%,#f4789b 100%);color:#fff;font-family:"Noto Sans TC",sans-serif;font-size:15px;font-weight:800;letter-spacing:.08em;box-shadow:0 15px 38px rgba(235,93,132,.28);transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s ease,background .4s ease}
#banner .banner_action span{
    color: var(--white);
    font-weight: 600;
}
#banner .banner_action:before{content:"";position:absolute;inset:1px;border:1px solid rgba(255,255,255,.22);border-radius:inherit;pointer-events:none}
#banner .banner_action i{display:flex;align-items:center;justify-content:center;width:29px;height:29px;border-radius:50%;background:rgba(255,255,255,.18);transition:transform .4s cubic-bezier(.16,1,.3,1),background .35s ease}
#banner .banner_action svg{width:14px;height:14px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#banner .banner_action:hover{transform:translateY(-5px) scale(1.02)!important;background:linear-gradient(135deg,#df4c77 0%,#ef6f94 100%);box-shadow:0 22px 48px rgba(235,93,132,.36)}
#banner .banner_action:hover i{transform:translateX(4px);background:rgba(255,255,255,.25)}
#banner .banner_link{position:absolute;inset:0;z-index:7}
#banner .banner_note{position:absolute;z-index:5;display:flex;flex-direction:column;font-family:"Comic Sans MS","Noto Sans TC",cursive;font-size:clamp(17px,1.35vw,25px);font-weight:600;line-height:1.22;letter-spacing:.02em;color:#258ca8;pointer-events:none}
#banner .banner_note_left{top:26%;left:5.5%;align-items:flex-start;transform:rotate(-7deg)}
#banner .banner_note_right{top:28%;right:4.5%;align-items:flex-start;transform:rotate(6deg)}
#banner .banner_note_left:after,#banner .banner_note_right:after{content:"";display:block;width:43px;height:2px;margin-top:8px;border-radius:999px;background:#eb5d84;transform:rotate(-18deg)}
#banner .banner_sign{position:absolute;z-index:5;display:flex;flex-direction:column;gap:4px;pointer-events:none}
#banner .banner_sign span{display:block;padding:6px 15px;border-radius:4px;background:#e5c887;font-family:Inter,"Noto Sans TC",sans-serif;font-size:11px;font-weight:700;color:#47504d;box-shadow:0 3px 7px rgba(0,0,0,.08)}
#banner .banner_sign_left{left:6%;bottom:27%;transform:rotate(-3deg)}
#banner .banner_sign_right{right:6%;bottom:25%;transform:rotate(3deg)}
#banner .banner_sign_right span:nth-child(1){background:#efbc9e}
#banner .banner_sign_right span:nth-child(2){background:#f5d881}
#banner .banner_sign_right span:nth-child(3){background:#9fd2c3}
#banner .banner_balloon{position:absolute;z-index:4;width:60px;height:78px;border-radius:50% 50% 45% 45%;background:repeating-linear-gradient(90deg,#e95c83 0,#e95c83 12px,#fff 12px,#fff 23px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.8);opacity:.92;pointer-events:none}
#banner .banner_balloon:after{content:"";position:absolute;left:50%;bottom:-22px;width:1px;height:24px;background:#8e8176;transform:translateX(-50%)}
#banner .banner_balloon_left{top:14%;left:18%;transform:rotate(-7deg)}
#banner .banner_balloon_right{top:10%;right:19%;transform:rotate(8deg) scale(.8)}
#banner .banner_cloud{position:absolute;z-index:3;width:160px;height:55px;border-radius:999px;background:rgba(255,255,255,.82);filter:blur(.1px);pointer-events:none}
#banner .banner_cloud:before,#banner .banner_cloud:after{content:"";position:absolute;border-radius:50%;background:inherit}
#banner .banner_cloud:before{width:75px;height:75px;left:22px;bottom:0}
#banner .banner_cloud:after{width:96px;height:96px;right:18px;bottom:0}
#banner .banner_cloud_01{top:13%;left:-50px;opacity:.65}
#banner .banner_cloud_02{top:15%;right:-40px;opacity:.55}
#banner .banner_bottom_cloud{position:absolute;left:-3%;right:-3%;bottom:-52px;z-index:8;height:140px;pointer-events:none}
#banner .banner_bottom_cloud:before{content:"";position:absolute;left:0;right:0;bottom:0;height:84px;background:#fff}
#banner .banner_bottom_cloud .cloud{position:absolute;bottom:-3px;width:25%;height:180px;border-radius:90% 90% 0 0;background:#fff}
#banner .banner_bottom_cloud .cloud_01{left:-4%;width:29%}
#banner .banner_bottom_cloud .cloud_02{left:17%;bottom:20px;width:27%;height:120px}
#banner .banner_bottom_cloud .cloud_03{left:38%;bottom:31px;width:28%;height:95px}
#banner .banner_bottom_cloud .cloud_04{left:61%;bottom:21px;width:28%;height:110px}
#banner .banner_bottom_cloud .cloud_05{right:-5%;width:26%;height:170px}
#banner .banner_dots{position:absolute;left:50%;bottom:32px;z-index:10;display:none;align-items:center;gap:8px;transform:translateX(-50%)}
#banner .banner_dots button{position:relative;width:7px;height:7px;padding:0;border:0;border-radius:50%;background:#85ccd6;cursor:pointer;transition:width .35s ease,border-radius .35s ease,background .35s ease}
#banner .banner_dots button.active{width:28px;border-radius:999px;background:#e95d84}
#banner .slick-slide .banner_eyebrow{opacity:0;transform:translateY(18px)}
#banner .slick-slide .banner_content>.txt:first-of-type{opacity:0;transform:translateY(45px)}
#banner .slick-slide .banner_content>.txt:nth-of-type(2){opacity:0;transform:translateY(28px)}
#banner .slick-slide .banner_action{opacity:0;transform:translateY(24px) scale(.96)}
#banner .slick-slide .banner_note_left{opacity:0;transform:translate(-35px,20px) rotate(-14deg)}
#banner .slick-slide .banner_note_right{opacity:0;transform:translate(35px,20px) rotate(14deg)}
#banner .slick-slide .banner_balloon_left{opacity:0;transform:translateY(35px) rotate(-12deg) scale(.75)}
#banner .slick-slide .banner_balloon_right{opacity:0;transform:translateY(35px) rotate(12deg) scale(.65)}
#banner .slick-slide .banner_sign_left{opacity:0;transform:translateX(-45px) rotate(-8deg)}
#banner .slick-slide .banner_sign_right{opacity:0;transform:translateX(45px) rotate(8deg)}
#banner .slick-slide .banner_cloud_01{opacity:0;transform:translateX(-40px)}
#banner .slick-slide .banner_cloud_02{opacity:0;transform:translateX(40px)}
#banner .slick-active .banner_eyebrow{animation:bannerEyebrowIn .7s .15s cubic-bezier(.16,1,.3,1) both}
#banner .slick-active .banner_content>.txt:first-of-type{animation:bannerTitleIn .9s .28s cubic-bezier(.16,1,.3,1) both}
#banner .slick-active .banner_content>.txt:nth-of-type(2){animation:bannerDescIn .8s .48s cubic-bezier(.16,1,.3,1) both}
#banner .slick-active .banner_action{animation:bannerActionIn .75s .68s cubic-bezier(.16,1,.3,1) both}
#banner .slick-active .banner_note_left{animation:bannerNoteLeft 1s .78s cubic-bezier(.16,1,.3,1) both}
#banner .slick-active .banner_note_right{animation:bannerNoteRight 1s .9s cubic-bezier(.16,1,.3,1) both}
#banner .slick-active .banner_balloon_left{animation:bannerBalloonLeftIn 1.1s .55s cubic-bezier(.16,1,.3,1) both,bannerFloatLeft 5s 1.8s ease-in-out infinite}
#banner .slick-active .banner_balloon_right{animation:bannerBalloonRightIn 1.1s .7s cubic-bezier(.16,1,.3,1) both,bannerFloatRight 6s 2s ease-in-out infinite}
#banner .slick-active .banner_sign_left{animation:bannerSignLeft 1s .95s cubic-bezier(.16,1,.3,1) both}
#banner .slick-active .banner_sign_right{animation:bannerSignRight 1s 1.05s cubic-bezier(.16,1,.3,1) both}
#banner .slick-active .banner_cloud_01{animation:bannerCloudLeft 1.4s .2s cubic-bezier(.16,1,.3,1) both,bannerCloudFloatLeft 7s 1.6s ease-in-out infinite}
#banner .slick-active .banner_cloud_02{animation:bannerCloudRight 1.4s .3s cubic-bezier(.16,1,.3,1) both,bannerCloudFloatRight 8s 1.8s ease-in-out infinite}
@keyframes bannerBgIn{0%{transform:scale(1.1)}100%{transform:scale(1)}}
@keyframes bannerEyebrowIn{0%{opacity:0;transform:translateY(18px)}100%{opacity:1;transform:translateY(0)}}
@keyframes bannerTitleIn{0%{opacity:0;transform:translateY(45px);filter:blur(8px)}100%{opacity:1;transform:translateY(0);filter:blur(0)}}
@keyframes bannerDescIn{0%{opacity:0;transform:translateY(28px)}100%{opacity:1;transform:translateY(0)}}
@keyframes bannerActionIn{0%{opacity:0;transform:translateY(24px) scale(.96)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes bannerNoteLeft{0%{opacity:0;transform:translate(-35px,20px) rotate(-14deg)}100%{opacity:1;transform:translate(0,0) rotate(-7deg)}}
@keyframes bannerNoteRight{0%{opacity:0;transform:translate(35px,20px) rotate(14deg)}100%{opacity:1;transform:translate(0,0) rotate(6deg)}}
@keyframes bannerBalloonLeftIn{0%{opacity:0;transform:translateY(35px) rotate(-12deg) scale(.75)}100%{opacity:.92;transform:translateY(0) rotate(-7deg) scale(1)}}
@keyframes bannerBalloonRightIn{0%{opacity:0;transform:translateY(35px) rotate(12deg) scale(.65)}100%{opacity:.92;transform:translateY(0) rotate(8deg) scale(.8)}}
@keyframes bannerFloatLeft{0%,100%{transform:translateY(0) rotate(-7deg)}50%{transform:translateY(-13px) rotate(-3deg)}}
@keyframes bannerFloatRight{0%,100%{transform:translateY(0) rotate(8deg) scale(.8)}50%{transform:translateY(-16px) rotate(4deg) scale(.8)}}
@keyframes bannerSignLeft{0%{opacity:0;transform:translateX(-45px) rotate(-8deg)}100%{opacity:1;transform:translateX(0) rotate(-3deg)}}
@keyframes bannerSignRight{0%{opacity:0;transform:translateX(45px) rotate(8deg)}100%{opacity:1;transform:translateX(0) rotate(3deg)}}
@keyframes bannerCloudLeft{0%{opacity:0;transform:translateX(-40px)}100%{opacity:.65;transform:translateX(0)}}
@keyframes bannerCloudRight{0%{opacity:0;transform:translateX(40px)}100%{opacity:.55;transform:translateX(0)}}
@keyframes bannerCloudFloatLeft{0%,100%{transform:translateX(0) translateY(0)}50%{transform:translateX(12px) translateY(-5px)}}
@keyframes bannerCloudFloatRight{0%,100%{transform:translateX(0) translateY(0)}50%{transform:translateX(-14px) translateY(6px)}}
@media(max-width:1440px){#banner{height: 800px;}#banner .banner_content{width:min(900px,76vw);padding-top:105px}#banner .banner_content>.txt:first-of-type{font-size:60px}#banner .banner_sign_left{left:4%}#banner .banner_sign_right{right:4%}}
@media(max-width:1280px){#banner{height:760px;min-height:720px}#banner .banner_content>.txt:first-of-type{font-size:54px}#banner .banner_note{font-size:18px}#banner .banner_sign{bottom:23%}#banner .banner_balloon_left{left:14%}#banner .banner_balloon_right{right:15%}}
@media(max-width:1024px){#banner{height: 680px;min-height: 680px;}#banner .banner_content{width:82%;padding-top:100px}#banner .banner_content>.txt:first-of-type{font-size:48px}#banner .banner_content>.txt:nth-of-type(2) p{font-size:16px}#banner .banner_note_left{left:3%}#banner .banner_note_right{right:3%}#banner .banner_sign{display:none}#banner .banner_balloon{transform:scale(.75)}#banner .banner_bottom_cloud{bottom:-64px}}
@media(max-width:768px){#banner{height: 560px;min-height: 560px;}#banner .bgBox{background-position:center center}#banner .banner_overlay{background:linear-gradient(180deg,rgba(255,255,255,.04) 0%,rgba(255,255,255,.04) 45%,rgba(255,255,255,.18) 100%)}#banner .banner_content{width:90%;padding-top:85px}#banner .banner_eyebrow{margin-bottom:16px;font-size:10px;letter-spacing:.2em}#banner .banner_eyebrow:before,#banner .banner_eyebrow:after{width:22px}#banner .banner_content>.txt:first-of-type{font-size:40px;line-height:1.22}#banner .banner_content>.txt:nth-of-type(2){margin-top:18px}#banner .banner_content>.txt:nth-of-type(2) p{max-width:520px;font-size:15px;line-height:1.8}#banner .banner_action{height:52px;margin-top:24px;padding:0 18px 0 24px;font-size:14px}#banner .banner_note{font-size:14px}#banner .banner_note_left{top:22%;left:2%}#banner .banner_note_right{top:28%;right:2%}#banner .banner_balloon_left{top:15%;left:5%}#banner .banner_balloon_right{top:14%;right:7%}#banner .banner_bottom_cloud{height:110px}#banner .banner_dots{bottom:22px}}
@media(max-width:560px){#banner{height:650px;min-height:650px}#banner .banner_content{width:92%;padding-top:74px}#banner .banner_content>.txt:first-of-type{font-size:34px;letter-spacing:-.04em}#banner .banner_content>.txt:nth-of-type(2) p{font-size:14px}#banner .banner_note{display:none}#banner .banner_balloon{width:43px;height:58px}#banner .banner_balloon_left{top:11%;left:5%}#banner .banner_balloon_right{top:12%;right:5%}#banner .banner_cloud{opacity:.45;display: none;}#banner .banner_bottom_cloud{bottom: -52px;}#banner .banner_action{height:48px;padding:0 17px 0 21px;font-size:13px}}
@media(max-width:480px){#banner{height: 380px;min-height: 380px;}#banner .banner_content{padding-top:72px}#banner .banner_eyebrow{display:none}#banner .banner_content>.txt:first-of-type{font-size:30px;line-height:1.25}#banner .banner_content>.txt:nth-of-type(2){margin-top:14px}#banner .banner_content>.txt:nth-of-type(2) p{max-width:315px;font-size:13px;line-height:1.7}#banner .banner_action{margin-top:20px}#banner .banner_balloon{display:none}#banner .banner_dots{bottom:18px}}
@media(prefers-reduced-motion:reduce){#banner .bgBox,#banner .banner_eyebrow,#banner .banner_content>.txt,#banner .banner_action,#banner .banner_note,#banner .banner_balloon,#banner .banner_sign,#banner .banner_cloud{animation:none!important;transition:none!important;opacity:1!important;transform:none!important}}