﻿@import"https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300&display=swap";@font-face{font-family:Gaggenau;font-weight:400;src:url("../fonts/gaggenr.ttf")}@font-face{font-family:Gaggenau;font-weight:bold;src:url("../fonts/gaggenb.ttf")}@keyframes fading{0%{opacity:0}40%{opacity:1}60%{opacity:1}100%{opacity:0}}body{font-size:4.8vw;line-height:1.2;font-family:Gaggenau,"Noto Sans TC",sans-serif;font-weight:400;text-align:center;background-color:#000;color:#fff}body h1,body h2,body h3,body h4,body h5,body h6,body p{margin-block-start:0;margin-block-end:0}body h1{font-size:2.5em}body h2{font-size:2.22em}body h3{font-size:1.75em}body h4{font-size:1.5em}body h5{font-size:1.25em}body h6{font-size:.83em}body p.small{font-size:.83em}body span.single-line{display:inline-block}body a:link,body a:visited{text-decoration:none;color:#897b71}body a:hover,body a:active{text-decoration:underline}body section{position:relative;width:100%;display:flex;flex-direction:column;justify-content:center;align-content:flex-start;flex-wrap:wrap;padding-top:16vw;padding-bottom:16vw}body .container{width:100%;display:flex;flex-direction:row;justify-content:center;align-content:flex-start;flex-wrap:wrap;padding-left:8vw;padding-right:8vw}body section.toTopSection{width:initial;position:fixed;bottom:0;right:0;padding:0;z-index:100;font-size:.83em}body section.toTopSection .container{justify-content:flex-end;padding:0}body section.toTopSection .container .toTopButton{cursor:pointer;margin:5.3333333333vw;padding:2.6666666667vw;background-color:#727272}body section.toTopSection .container .toTopButton .arrow{animation-name:fading;animation-duration:2.5s;animation-iteration-count:infinite;animation-timing-function:ease-in-out}nav{width:100%;height:20vw;position:relative}nav #menu-toggle{display:none}nav #menu-toggle:checked~.container .menu{height:calc(100vh - 20vw)}nav #menu-toggle:checked~#overlay{opacity:1;z-index:9999}nav .container{z-index:10000;width:100% !important;max-width:initial !important;height:100%;background-color:#1e1e1e;align-content:center;justify-content:space-between;position:relative;padding:2.6666666667vw 8vw}nav .container .logo{display:flex;flex-direction:column;justify-content:center;align-content:flex-start;flex-wrap:wrap}nav .container .logo img{height:8vw}nav .container .menu-button-container{width:9.3333333333vw;height:8.8vw;padding:1.3333333333vw;position:relative}nav .container .menu-button-container .menu-button .bar{background-color:#fff;height:.2666666667vw;display:block;position:absolute;right:0}nav .container .menu-button-container .menu-button .bar:nth-child(1){width:6.6666666667vw;top:1.3333333333vw}nav .container .menu-button-container .menu-button .bar:nth-child(2){width:5.3333333333vw;top:4vw}nav .container .menu-button-container .menu-button .bar:nth-child(3){width:4vw;top:6.6666666667vw}nav .container .menu{position:absolute;top:0;left:0;width:100%;height:0;margin-top:20vw;transition:all .3s ease-in-out;background-color:#1e1e1e;overflow:scroll;-ms-overflow-style:none;scrollbar-width:none}nav .container .menu::-webkit-scrollbar{display:none}nav .container .menu .menuOptions{margin-block-start:0;margin-block-end:0;padding-inline-start:0;padding-top:8vw;padding-bottom:8vw;list-style:none;display:flex;flex-direction:column;justify-content:center;align-content:flex-start;flex-wrap:wrap;flex-wrap:nowrap;align-items:center;gap:60px}nav .container .menu .menuOptions li a{color:#fff}nav #overlay{transition:all .3s ease-in-out;position:fixed;z-index:-1;top:0;left:0;right:0;opacity:0;background-color:rgba(0,0,0,.7);width:100%;height:100%}footer{text-align:left}footer .container{justify-content:flex-start;display:flex;flex-direction:column;justify-content:center;align-content:flex-start;flex-wrap:wrap;gap:10.6666666667vw}footer .container .detailsWrapper{width:100%;display:flex;flex-direction:column;justify-content:center;align-content:flex-start;flex-wrap:wrap;align-content:flex-start;gap:5.3333333333vw}footer .container .detailsWrapper .detailBlocksWrapper{display:flex;flex-direction:column;justify-content:center;align-content:flex-start;flex-wrap:wrap;row-gap:2.6666666667vw}footer .container .detailsWrapper .detailBlocksWrapper .detailBlockContent.follow{display:flex;flex-direction:row;justify-content:center;align-content:flex-start;flex-wrap:wrap;column-gap:8vw}footer .container .detailsWrapper .detailBlocksWrapper .detailBlockContent.follow .fb{width:5.3333333333vw}footer .container .detailsWrapper .detailBlocksWrapper .detailBlockContent.follow .ig{width:5.3333333333vw}footer .container .detailsWrapper .detailBlocksWrapper .detailBlockContent.follow .yt{width:6.6666666667vw}footer .container .divider{width:100%;height:2px;background-color:#fff}footer .copyright{text-align:center;padding-top:10.6666666667vw;color:#727272}footer .copyright .container{justify-content:center}button{width:100%;padding:2.6666666667vw 5.3333333333vw;border:0;background-color:#e37222;color:#fff;cursor:pointer}@media screen and (min-width: 768px){body{font-size:18px}body section{padding-top:60px;padding-bottom:60px;align-content:center}body section.toTopSection .container .toTopButton{margin:40px;padding:20px}body .container{padding-left:30px;padding-right:30px;max-width:1200px}nav{height:75px}nav #menu-toggle:checked~.container .menu{height:calc(100vh - 75px)}nav .container{padding:10px 30px}nav .container .logo img{height:30px}nav .container .menu-button-container{width:35px;height:33px;padding:5px}nav .container .menu-button-container .menu-button .bar{height:1px}nav .container .menu-button-container .menu-button .bar:nth-child(1){width:25px;top:5px}nav .container .menu-button-container .menu-button .bar:nth-child(2){width:20px;top:15px}nav .container .menu-button-container .menu-button .bar:nth-child(3){width:15px;top:25px}nav .container .menu{margin-top:75px}nav .container .menu .menuOptions{padding-top:60px;padding-bottom:60px}footer .container{gap:40px}footer .container .detailsWrapper{gap:20px}footer .container .detailsWrapper .detailBlocksWrapper{row-gap:10px}footer .container .detailsWrapper .detailBlocksWrapper .detailBlockContent.follow{column-gap:30px}footer .container .detailsWrapper .detailBlocksWrapper .detailBlockContent.follow .fb{width:20px}footer .container .detailsWrapper .detailBlocksWrapper .detailBlockContent.follow .ig{width:20px}footer .container .detailsWrapper .detailBlocksWrapper .detailBlockContent.follow .yt{width:25px}footer .container .divider{height:1px}footer .copyright{padding-top:40px}button{width:initial;padding:20px 60px}}@media screen and (min-width: 1200px){nav .container .menu-button-container{display:none}nav .container .menu{position:initial;top:initial;left:initial;width:initial;transition:none;height:100%;margin-top:initial}nav .container .menu .menuOptions{display:flex;flex-direction:row;justify-content:center;align-content:flex-start;flex-wrap:wrap;height:100%;align-content:center;padding-top:initial;padding-bottom:initial}footer .container{display:flex;flex-direction:row;justify-content:center;align-content:flex-start;flex-wrap:wrap;justify-content:flex-start;align-items:flex-start}footer .container .detailsWrapper{width:initial;flex-basis:20%;flex-shrink:1;flex-grow:1;gap:20px}footer .container .detailsWrapper .detailBlocksWrapper .detailBlockContent.follow{column-gap:20px}}.swiper{width:100%;height:66vw;max-height:66vh;padding-bottom:10vw}.swiper .swiper-wrapper .swiper-slide{width:100%;height:100%;color:#fff;background-color:#000}.swiper .swiper-wrapper .swiper-slide video,.swiper .swiper-wrapper .swiper-slide picture,.swiper .swiper-wrapper .swiper-slide video>*,.swiper .swiper-wrapper .swiper-slide picture>*{width:100%;height:100%;object-fit:contain;object-position:50% top}.swiper .swiper-pagination{bottom:0}.swiper .swiper-pagination .swiper-pagination-bullet{width:4vw;height:4vw;position:relative;background-color:#fff;opacity:1;margin:0 2.6666666667vw}.swiper .swiper-pagination .swiper-pagination-bullet::before{box-sizing:border-box;content:" ";position:absolute;width:3.2vw;height:3.2vw;border-radius:1.6vw;left:.4vw;top:.4vw;background-color:#000}.swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::before{background-color:#fff;border-color:#000;border-style:solid;border-width:.6666666667vw}@media screen and (min-width: 768px){.swiper{padding-bottom:37.5px}.swiper .swiper-pagination .swiper-pagination-bullet{width:15px;height:15px;margin:0 10px}.swiper .swiper-pagination .swiper-pagination-bullet::before{width:12px;height:12px;border-radius:6px;left:1.5px;top:1.5px}.swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::before{border-width:2.5px}}main#classes section.slider{padding-top:0;padding-bottom:0}main#classes section.schedule .container{flex-direction:column;align-items:center;row-gap:10.6666666667vw}main#classes section.schedule .container p{max-width:900px}main#classes section.schedule .classList{display:flex;flex-direction:row;justify-content:center;align-content:flex-start;flex-wrap:wrap;gap:10.6666666667vw}main#classes section.schedule .classList .classBlock{padding:10.6666666667vw 8vw;background-color:#1e1e1e;text-align:left;flex-basis:100%;display:flex;flex-direction:column;justify-content:center;align-content:flex-start;flex-wrap:wrap;justify-content:space-between;row-gap:8vw}main#classes section.schedule .classList .classBlock .detailsWrapper{display:flex;flex-direction:row;justify-content:center;align-content:flex-start;flex-wrap:wrap;justify-content:flex-start;gap:5.3333333333vw}main#classes section.schedule .classList .classBlock .detailsWrapper .detailWrapper{font-size:.83em;flex-basis:calc(50% - 2.6666666667vw)}main#classes section.schedule .classList .classBlock .detailsWrapper .detailWrapper .detailInfo{color:#897b71}main#classes section.schedule .classList .classBlock .detailsWrapper .detailWrapper.endReg{font-size:unset;flex-basis:100%}main#classes section.schedule .classList .classBlock .detailsWrapper .detailWrapper.endReg .detailHeader{font-size:.83em}main#classes section.schedule .classList .classBlock .action a{color:#cf7b40;text-decoration:underline;cursor:pointer}main#classes section.form .container{row-gap:10.6666666667vw}main#classes section.form .container form{display:flex;flex-direction:column;justify-content:center;align-content:flex-start;flex-wrap:wrap;row-gap:10.6666666667vw;text-align:left}main#classes section.form .container form .controlWrapper{display:flex;flex-direction:column;justify-content:center;align-content:flex-start;flex-wrap:wrap;align-content:center;row-gap:5.3333333333vw}main#classes section.form .container form .controlWrapper .formControl{display:flex;flex-direction:column;justify-content:center;align-content:flex-start;flex-wrap:wrap;align-content:stretch;width:100%;max-width:600px}main#classes section.form .container form .controlWrapper .formControl.phone .row{display:flex;flex-direction:row;justify-content:center;align-content:flex-start;flex-wrap:wrap;justify-content:flex-start;align-items:center;column-gap:2.6666666667vw}main#classes section.form .container form .controlWrapper .formControl.phone .row input{flex-grow:1}main#classes section.form .container form .controlWrapper .formControl.agree{position:relative;width:100%}main#classes section.form .container form .controlWrapper .formControl.agree input[type=checkbox]{position:absolute;left:1.3333333333vw;top:1.3333333333vw;width:1px;height:1px;overflow:hidden;z-index:0}main#classes section.form .container form .controlWrapper .formControl.agree input[type=checkbox]:checked~label .checkmark::before{content:"✓";position:relative;top:-1.3333333333vw;left:.6666666667vw;text-shadow:.2666666667vw -.2666666667vw .6666666667vw #000;font-size:1.2em}main#classes section.form .container form .controlWrapper .formControl.agree label{position:relative;z-index:10;display:flex;flex-direction:row;justify-content:center;align-content:flex-start;flex-wrap:wrap;justify-content:flex-start;flex-wrap:nowrap;column-gap:4vw;font-size:.83em;background-color:#000}main#classes section.form .container form .controlWrapper .formControl.agree label .checkmark{align-self:flex-start;flex-shrink:0;width:4vw;height:4vw;border:.4vw solid #fff}main#classes section.form .container form .controlWrapper .formControl input,main#classes section.form .container form .controlWrapper .formControl select{padding:1.3333333333vw;background-color:#1e1e1e;border:0;color:#aaa}main#classes section.form .container form .controlWrapper .formControl select{width:100%;text-overflow:ellipsis}main#classes section.form .container form .terms{font-size:.83em}main#classes section.form .container form .terms ol{list-style-type:decimal;margin-block-start:2.6666666667vw;margin-block-end:0;padding-inline-start:5.3333333333vw}main#classes section.form .container form .terms ol li{padding-left:2.6666666667vw;padding-bottom:1.3333333333vw}@media screen and (min-width: 768px){main#classes section.schedule .container{row-gap:40px}main#classes section.schedule .classList{gap:40px}main#classes section.schedule .classList .classBlock{padding:40px 30px;row-gap:30px;flex-basis:350px;flex-shrink:1}main#classes section.schedule .classList .classBlock .detailsWrapper{gap:20px}main#classes section.schedule .classList .classBlock .detailsWrapper .detailWrapper{flex-basis:calc(50% - 10px)}main#classes section.form .container{row-gap:40px;max-width:900px}main#classes section.form .container form{row-gap:40px}main#classes section.form .container form .controlWrapper{row-gap:20px}main#classes section.form .container form .controlWrapper .formControl{row-gap:5px}main#classes section.form .container form .controlWrapper .formControl.phone .row{column-gap:20px}main#classes section.form .container form .controlWrapper .formControl.agree input[type=checkbox]{left:10px;top:10px}main#classes section.form .container form .controlWrapper .formControl.agree input[type=checkbox]:checked~label .checkmark::before{top:-10px;left:5px;text-shadow:2px -2px 5px #000;font-size:1.8em}main#classes section.form .container form .controlWrapper .formControl.agree label{align-items:center;column-gap:10px;padding-left:0}main#classes section.form .container form .controlWrapper .formControl.agree label .checkmark{width:20px;height:20px;border-width:2px}main#classes section.form .container form .controlWrapper .formControl input,main#classes section.form .container form .controlWrapper .formControl select{padding:10px}main#classes section.form .container form .terms ol{margin-block-start:10px;padding-inline-start:20px}main#classes section.form .container form .terms ol li{padding-left:10px;padding-bottom:10px}main#classes section.form button{width:fit-content;align-self:center}}@media screen and (min-width: 1200px){main#classes section.form .container form .controlWrapper .formControl.agree input[type=checkbox]:checked~label .checkmark::before{top:-10px;left:4px;font-size:1.8em;text-shadow:2px 2px 5px #000}}
