body {
    margin: 0;
    font-family: 'NEXONLv1Gothic';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

code {
    font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
        monospace;
}

.App {
  text-align: center;
}

.App-logo {
  height: 40vmin;
  pointer-events: none;
}

@media (prefers-reduced-motion: no-preference) {
  .App-logo {
    animation: App-logo-spin infinite 20s linear;
  }
}

.App-header {
  background-color: #282c34;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: calc(10px + 2vmin);
  color: white;
}

.App-link {
  color: #61dafb;
}

@keyframes App-logo-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* -------------------------넥슨고딕------------------------- */
@font-face {
    font-family: 'NEXONLv1Gothic';
    font-weight: 400;
    font-style: normal;
    src: url("/static/media/NEXON%20Lv1%20Gothic%20OTF.8f9046cec117d22030d4.eot"),
        url("/static/media/NEXON%20Lv1%20Gothic%20OTF.eb1217e4bc7f9fe24aac.woff") format('woff');
}

@font-face {
    font-family: 'NEXONLv1Gothic';
    font-weight: 300;
    font-style: normal;
    src: url("/static/media/NEXON%20Lv1%20Gothic%20OTF%20Light.871db397a1f52ba04449.eot"),
        url("/static/media/NEXON%20Lv1%20Gothic%20OTF%20Light.846c9b6d2062d0b807c1.woff") format('woff');
}

@font-face {
    font-family: 'NEXONLv1Gothic';
    font-weight: 700;
    font-style: normal;
    src: url("/static/media/NEXON%20Lv1%20Gothic%20OTF%20Bold.7ad113623db67efd2a2d.eot"),
        url("/static/media/NEXON%20Lv1%20Gothic%20OTF%20Bold.fea89342b1b0f7a386b6.woff") format('woff');
}

@font-face {
    font-family: 'KyoboHandwriting2019';
    src: url(/static/media/KyoboHandwriting2019.0a4860d960659eb1620b.eot),
        url(/static/media/KyoboHandwriting2019.78299eb591482a53ff96.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}

/* -------------------------넥슨 메이플체------------------------- */
@font-face {
    font-family: 'Maple';
    src: url(/static/media/MaplestoryLight.62723a08fddf0b86b9fd.eot),
        url(/static/media/MaplestoryLight.181047d24de52316389e.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}

/* -------------------------국민연금체------------------------- */
@font-face {
    font-family: 'NPS';
    src: url(/static/media/NPSfont_regular.6b68815b01dff36289c6.eot), url(/static/media/NPSfont_regular.5bceb3464b101df3beb8.woff);
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'NPS';
    src: url(/static/media/NPSfont_bold.2589a4389867bcdbb0c1.eot), url(/static/media/NPSfont_bold.ceff45dc6823cec1d4d5.woff);
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'NPS';
    src: url(/static/media/NPSfont_extrabold.6f4144610b79fbcebe1b.eot), url(/static/media/NPSfont_extrabold.2124f9b9244a9a4f6270.woff);
    font-weight: bold;
    font-style: normal;
}

/* -------------------------나눔스퀘어------------------------- */
@font-face {
    font-family: 'nanum';
    src: url(/static/media/NanumSquareR.a5386b4d73f72b4542db.eot), url(/static/media/NanumSquareR.99d675599ff36e82677e.woff);
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'nanum';
    src: url(/static/media/NanumSquareL.e70d85a730acd1c31f93.eot), url(/static/media/NanumSquareL.111d6e195973e7b05d18.woff);
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'nanum';
    src: url(/static/media/NanumSquareB.f2ccd36ad62ffd7d6945.eot), url(/static/media/NanumSquareB.1690ade543a61c137f24.woff);
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'nanum';
    src: url(/static/media/NanumSquareEB.21f923ebc916467d71e4.eot), url(/static/media/NanumSquareEB.214116183723c54d5d7f.woff);
    font-weight: 900;
    font-style: normal;
}
/* -------------------------강원교육모두체------------------------- */
@font-face {
    font-family: 'EduAll';
    src: url(/static/media/EduAllBold.f9a9c67e2d800fb8287f.eot), url(/static/media/EduAllBold.8eaefb5b786b8cf34f6b.woff) format('woff');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'EduAll';
    src: url(/static/media/EduAllLight.0255b7661c41108d0414.eot), url(/static/media/EduAllLight.0199f2fa3d48c9d10dc8.woff) format('woff');
    font-weight: lighter;
    font-style: normal;
}

/* -------------------------시니어관련 글씨체------------------------- */
@font-face {
    /* 한글 재민체 - 그림 만들기 */
    font-family: 'Jaemin3';
    src: url(/static/media/Jaemin3-Regular.3c18c385e6725ff9262b.eot),
        url(/static/media/Jaemin3-Regular.6d7b3dc6cb4329e882bb.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    /* 학교안심 투호 - 숏폼 만들기 */
    font-family: 'Tuho';
    src: url(/static/media/HakgyoansimTuho.5602d59da6e72c9384e1.eot),
        url(/static/media/HakgyoansimTuho.cfda12e17613937e478e.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    /* 김정철서체 - 편지 쓰기(regular) */
    font-family: 'KimjungchulScript';
    src: url(/static/media/KimjungchulScript-Regular.39dc23cf7f29ea6ac804.eot),
        url(/static/media/KimjungchulScript-Regular.4189812a99bbc898f1a5.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    /* 김정철서체 - 편지 쓰기(bold) */
    font-family: 'KimjungchulScript';
    src: url(/static/media/KimjungchulScript-Bold.1b4dc97fffcd58207da6.eot),
        url(/static/media/KimjungchulScript-Bold.68bf5abb30c212f85f40.woff) format('woff');
    font-weight: bold;
    font-style: bold;
}
@font-face {
    /* 김정철서체 - 편지 쓰기(light) */
    font-family: 'KimjungchulScript';
    src: url(/static/media/KimjungchulScript-Light.172051e4974fc6e29a00.eot),
        url(/static/media/KimjungchulScript-Light.588ee62fbde3f906944d.woff) format('woff');
    font-weight: light;
    font-style: light;
}
@font-face {
    /* 온글잎 재건사체 - 음악 만들기 */
    font-family: 'JAEGEONSA';
    src: url(/static/media/JAEGEONSA.7f8efb1a44320d320aeb.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}

.heart{position:absolute;width:24px;height:24px;background-color:red;transform:rotate(-45deg);animation:popHeart .5s forwards;z-index:9999999}.heart::before,.heart::after{content:"";position:absolute;width:24px;height:24px;background-color:red;border-radius:50%}.heart::before{top:-12px;left:0}.heart::after{left:12px}@keyframes popHeart{0%{opacity:1;transform:scale(1) rotate(-45deg)}50%{opacity:.5;transform:scale(1.2) rotate(-45deg)}100%{opacity:0;transform:scale(0.5) rotate(-45deg)}}
.big-section{width:100%;height:100vh;background-color:rgba(0,0,0,.9);display:flex;flex-direction:column;align-items:center;justify-content:center;position:fixed;top:0;left:0;z-index:10000000000004}.big-section img.fullscreen{height:100%;width:100%;object-fit:contain}.big-section .close-big-section{background-color:#fac41d;width:70px;height:70px;position:absolute;top:10%;right:5%;padding:1.5rem;cursor:pointer;border:none;border-radius:50%}.big-section .print-btn{position:absolute;bottom:3rem;right:5rem;cursor:pointer;display:flex;gap:.5rem;align-items:center;padding:1rem 3rem;font-family:"Maple";font-size:1.5rem;border:none;border-radius:4px}@media screen and (max-width: 1366px){.big-section .close-big-section{right:5%}}
.wide-view-modal{width:100%;min-height:100vh;position:fixed;top:0;left:0;z-index:90;background-color:rgba(0,0,0,.8)}.wide-view-modal .inner{max-height:100vh;height:100vh;overflow-y:auto;padding:2rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;position:relative}.wide-view-modal .inner .close-modal-btn{background-color:#ffc377;border:none;border-radius:50%;cursor:pointer;display:flex;justify-content:center;align-items:center;margin-left:auto;padding:.8rem;position:absolute;right:20px;top:50px;width:46px;height:46px}.wide-view-modal .inner .close-btn{width:30%;padding:1rem;text-align:center;font-size:24px;background-color:var(--bs-blue-primary);color:var(--bs-white);cursor:pointer;transition-duration:.3s}.wide-view-modal .inner .close-btn:hover{background-color:var(--bs-blue-hovered)}.wide-view-modal .inner .wide-image{width:28vw}.wide-view-modal .print-page{display:none;page-break-after:always}@media screen and (min-width: 1441px)and (max-width: 1540px){.wide-view-modal .inner .wide-image{width:28vw}.wide-view-modal .inner .close-btn{width:30%;text-align:center;font-size:32px}}@media screen and (min-width: 1367px)and (max-width: 1440px){.wide-view-modal .inner .wide-image{width:26vw}.wide-view-modal .inner .close-btn{width:30%;text-align:center;font-size:32px}}@media screen and (min-width: 1023px)and (max-width: 1366px){.wide-view-modal .inner .wide-image{width:45vw}.wide-view-modal .inner .close-btn{width:30%;text-align:center;font-size:32px}}@media screen and (min-width: 901px)and (max-width: 1022px){.wide-view-modal .inner{gap:.5rem}.wide-view-modal .inner .wide-image{width:30vw}.wide-view-modal .inner .close-btn{width:35%;text-align:center;font-size:24px}}@media screen and (min-width: 801px)and (max-width: 900px){.wide-view-modal .inner{gap:.5rem}.wide-view-modal .inner .wide-image{width:35%}.wide-view-modal .inner .close-btn{width:35%;text-align:center;font-size:24px}}@media screen and (min-width: 768px)and (max-width: 800px){.wide-view-modal .inner{gap:.5rem}.wide-view-modal .inner .wide-image{width:35%}.wide-view-modal .inner .close-btn{width:35%;text-align:center;font-size:24px}}@media(orientation: portrait){.wide-view-modal .inner .wide-image{width:60%}.wide-view-modal .inner .close-btn{width:60%;padding:2rem}}
.print-detail-modal.print-page{width:100%;min-height:100vh;position:fixed;top:0;left:0;background-color:rgba(0,0,0,.8)}.print-detail-modal.print-page .inner{overflow-y:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;max-width:100%;width:100%;position:relative}.print-detail-modal.print-page .inner figure{margin-top:2rem;width:100%}.print-detail-modal.print-page .inner .writing-conts{position:absolute;top:16%;width:60%;z-index:999}.print-detail-modal.print-page .inner .writing-conts .writing-tit{font-size:50px;font-weight:700;margin-bottom:2rem;text-align:center}.print-detail-modal.print-page .inner .writing-conts .writing-all{text-align:center;line-height:2;font-size:32px;width:100%;margin:0 auto;height:auto;font-family:"KyoboHandwriting2019"}.print-detail-modal.print-page .inner .close-btn{width:50%;padding:1rem;text-align:center;font-size:32px;background-color:var(--bs-blue-primary);color:var(--bs-white);cursor:pointer;transition-duration:.3s}.print-detail-modal.print-page .inner .close-btn:hover{background-color:var(--bs-blue-hovered)}@media screen and (min-width: 1023px)and (max-width: 1366px){.print-detail-modal .inner figure{margin-top:2rem;width:90%}}@media screen and (min-width: 768px)and (max-width: 1024px){.print-detail-modal{display:flex}.print-detail-modal .inner figure{margin-top:2rem;width:90%}.print-detail-modal .inner .writing-conts{top:25%}.print-detail-modal .inner .writing-conts .writing-all{width:70%;padding:0 3rem}}@media print{.print-page{display:block;width:100%;height:auto;page-break-after:always}.print-detail-modal,.wide-view-modal{display:block;width:100%;height:auto;position:static;background-color:#fff;color:#000}.print-detail-modal .inner,.wide-view-modal .inner{display:block;width:100%;height:auto}.print-detail-modal .inner figure,.wide-view-modal .inner figure{margin-top:0;width:100%}.print-detail-modal .inner .writing-conts,.wide-view-modal .inner .writing-conts{position:static;width:100%;top:auto}.print-detail-modal .inner .writing-conts .writing-tit,.wide-view-modal .inner .writing-conts .writing-tit{font-size:24px;margin-bottom:1rem}.print-detail-modal .inner .writing-conts .writing-all,.wide-view-modal .inner .writing-conts .writing-all{font-size:16px;width:100%;padding:0}.print-detail-modal .inner .close-btn,.wide-view-modal .inner .close-btn{display:none}}
.drawing-list{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:2rem;position:relative}.drawing-list li{width:30%;position:relative;border-radius:8px;overflow:hidden;cursor:pointer;background:none}.drawing-list li .polaroid-bg{width:100%;position:absolute;top:10%;background:none;height:auto;overflow:hidden;padding:0}.drawing-list li .polaroid-bg input[type=checkbox]{display:none}.drawing-list li .polaroid-bg input[type=checkbox]+label{display:inline-block;width:1.5rem;height:1.5rem;border:2px solid #fff;background-color:#fff;border-radius:2px;cursor:pointer;position:absolute;left:30px;top:20px;z-index:50}.drawing-list li .polaroid-bg input[type=checkbox]+label::before{content:"✔";width:14px;height:14px;color:#007bff;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%) scale(0);transition:transform .2s ease-in-out;border-radius:2px;z-index:10}.drawing-list li .polaroid-bg input[type=checkbox]+label p{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);opacity:.2}.drawing-list li .polaroid-bg input[type=checkbox]:checked+label:before{transform:translate(-50%, -50%) scale(1)}.drawing-list li .polaroid-bg input[type=checkbox]:checked+label p{display:none}.drawing-list li .polaroid-bg .polaroid-conts{width:100%;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 1rem}.drawing-list li .polaroid-bg .polaroid-conts .creation-frame{aspect-ratio:5/5;position:relative;width:100%;overflow:hidden}.drawing-list li .polaroid-bg .polaroid-conts .creation-frame img{position:absolute;width:100%;top:50%;left:50%;transform:translate(-50%, -50%)}.drawing-list li .polaroid-bg .polaroid-conts .creation-frame img.border{border:8px solid #efca50}.drawing-list li .polaroid-bg .polaroid-conts .wide-big-btn{display:flex;align-items:center;position:absolute;top:0;right:1rem;padding:1rem;gap:.5rem;background-color:rgba(0,0,0,.5);cursor:pointer}.drawing-list li .polaroid-bg .polaroid-conts .wide-big-btn span{color:var(--bs-white);font-family:"Maple"}.drawing-list li .polaroid-bg .polaroid-conts .text-info{display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:1rem;font-family:"Maple";font-size:1.25rem}.drawing-list li .polaroid-bg .polaroid-conts .text-info p:first-child{color:var(--bs-blue-primary);font-weight:bold;line-height:1.4}.drawing-list li .polaroid-bg .polaroid-conts .text-info p:nth-child(2){font-size:14px}.drawing-list::after{content:"";width:30%;height:0}
.writing-list{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2.5rem}.writing-list .writing{width:30%;cursor:pointer;position:relative}.writing-list .writing.border{border:8px solid #efca50}.writing-list .writing input[type=checkbox]{display:none}.writing-list .writing input[type=checkbox]+label{display:inline-block;width:1.5rem;height:1.5rem;border:2px solid #fff;background-color:#fff;border-radius:2px;cursor:pointer;position:absolute;left:30px;top:60px;z-index:50}.writing-list .writing input[type=checkbox]+label::before{content:"✔";width:14px;height:14px;color:#007bff;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%) scale(0);transition:transform .2s ease-in-out;border-radius:2px;z-index:10}.writing-list .writing input[type=checkbox]+label p{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);opacity:.2}.writing-list .writing input[type=checkbox]:checked+label:before{transform:translate(-50%, -50%) scale(1)}.writing-list .writing input[type=checkbox]:checked+label p{display:none}.writing-list .writing .writing-txt{width:100%;position:absolute;top:40%;left:50%;transform:translate(-50%, -50%);text-align:center;font-family:"Maple"}.writing-list .writing .writing-txt .writing-tit{font-size:22px;margin-bottom:1rem;line-height:1.4}.writing-list .writing .writing-txt .writing-tit.writing-context{font-size:18px;font-weight:lighter;width:85%;margin:0 auto;line-height:1.6;white-space:pre-line;display:-webkit-box;-webkit-line-clamp:11;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;color:#404040}.writing-list .writing .writing-txt .peom-create-date{color:#c2c2c2;margin-top:1.5rem}.writing-list::after{content:"";width:30%;height:0}
.toggle-btn-list{margin:40px 0 20px;display:flex;align-items:center;gap:1rem;justify-content:center}.toggle-btn-list .made-title{font-size:24px;font-weight:600;color:var(--bs-blue-primary)}.toggle-btn-list .toggle-btn{border:none;font-size:18px;border-radius:16%;padding:8px 18px;font-family:"Maple";background:none;border:none;margin-right:1rem;cursor:pointer;font-family:"Maple";width:10%}.toggle-btn-list .toggle-btn.active{background-color:var(--bs-blue-primary);color:var(--bs-white);border:1px solid var(--bs-blue-primary);font-weight:700}.selectbox{float:right;border:none;font-size:24px;font-family:"NEXONLv1Gothic";cursor:pointer}.tab-contents{margin-top:3rem;padding-bottom:0}.tab-contents .empty-contents{display:flex;flex-direction:column;align-items:center;justify-content:center}.tab-contents .empty-contents figure{width:30%}.tab-contents .empty-contents figure.drawing{width:25%}.tab-contents .empty-contents figure.story{width:40%}.tab-contents .empty-contents p{padding:2rem 0;font-size:1.8rem;text-align:center;line-height:1.2}.tab-contents .empty-contents p .mobile-only{display:none}.tab-contents .empty-contents p span{padding:0 .5rem}.tab-contents .empty-contents button{background-color:var(--bs-blue-primary);border:none;padding:.8rem 1.25rem;border-radius:4px;color:var(--bs-white);cursor:pointer;transition:.3s;font-size:1rem}.tab-contents .empty-contents button:hover{background-color:var(--bs-blue-hovered)}.tab-contents .story4u-contents{display:flex;flex-wrap:wrap;justify-content:space-between;padding:20px 0;width:100%}.tab-contents .story4u-contents li{cursor:pointer;position:relative;width:30%;border-radius:0px 6.448px 6.448px 0px;overflow:hidden}.tab-contents .story4u-contents li .book-info{position:absolute;width:90%;top:7%;left:50%;transform:translateX(-50%)}.tab-contents .story4u-contents li .book-info .book-cover img{aspect-ratio:4/3;object-fit:cover}.tab-contents .story4u-contents li .book-info .book-shadow{position:absolute;top:0;left:0;background-color:rgba(0,0,0,.3);width:12px;height:100%}.tab-contents .story4u-contents li .book-info .book-white{border-radius:1.612px;background-color:var(--bs-white);box-shadow:-2px 1.29px 1.29px 0px rgba(0,0,0,.25);width:90%;height:10px;position:absolute;bottom:10px;right:11px}.tab-contents .story4u-contents li .book-info .book-name-container{left:50%;position:absolute;text-align:center;top:45%;transform:translate(-50%, -50%);width:100%;z-index:20}.tab-contents .story4u-contents li .book-info .book-name-container .book-title{color:var(--bs-white);font-size:1.25rem;line-height:1.2;position:relative;z-index:10;font-family:"Maple";margin-bottom:.6rem}.tab-contents .story4u-contents li .book-info .book-name-container .book-title .book-title-stroke{width:100%;position:absolute;top:0;left:0;z-index:-1;-webkit-text-stroke:8px #008d69}.tab-contents .story4u-contents li .book-info .book-name-container .work-name{color:var(--bs-white);font-size:1.2rem;line-height:1.2;position:relative;z-index:10;font-family:"Maple"}.tab-contents .story4u-contents li .book-info .book-name-container .work-name .book-title-stroke{width:100%;position:absolute;top:0;left:0;z-index:-1;-webkit-text-stroke:6px #008d69}.tab-contents .story4u-contents li .book-info .book-name-container .work-date{color:var(--bs-white);font-size:1rem;line-height:1.2;position:absolute;z-index:10;font-family:"Maple";color:#000;bottom:-45px;left:50%;transform:translateX(-50%)}.tab-contents .story4u-contents li .book-info .book-name-container .work-date .book-title-stroke{width:100%;position:absolute;top:0;left:0;z-index:-1;-webkit-text-stroke:4px #fff}.tab-contents .story4u-contents li .book-info .play-state-btn{width:40%;display:flex;position:absolute;top:10px;left:10px;z-index:99}.tab-contents .story4u-contents li .book-info .play-state-btn button{border:none;background:none;cursor:pointer}.tab-contents .story4u-contents::after{content:"";width:300px;height:0}@media screen and (max-width: 1440px){.toggle-btn-list{flex-direction:column;align-items:flex-start}.toggle-btn-list.row{flex-direction:row}.tab-contents .drawing-list{justify-content:space-between;gap:1rem}.tab-contents .drawing-list li{width:30%}.tab-contents .drawing-list li .test .wide-big-btn{right:1rem}.tab-contents .drawing-list li .test .text-info{font-size:1.25rem}.tab-contents .writing-list{gap:1rem}.tab-contents .writing-list .writing{width:30%}.tab-contents .story4u-contents{width:100%}.tab-contents .story4u-contents li{width:47%}.tab-contents .story4u-contents li .book-cover{height:424px;left:2px;position:absolute;overflow:hidden;top:-1.5px;width:99%;z-index:10}.tab-contents .story4u-contents li .book-name-container .book-title{font-size:2.8rem}.tab-contents .story4u-contents li .book-name-container .book-title .book-title-stroke{width:100%;position:absolute;top:0;left:0;z-index:-1;-webkit-text-stroke:8px #008d69}.tab-contents .story4u-contents li .book-name-container .work-name{font-size:2rem}.tab-contents .story4u-contents li .book-name-container .work-date{font-size:1.5rem}.tab-contents .story4u-contents li .play-state-btn{width:40%}.tab-contents .story4u-contents::after{content:"";width:47%;height:0}}@media screen and (max-width: 1100px){.tab-contents .drawing-list{justify-content:space-between;gap:1rem}.tab-contents .drawing-list li{width:47%}.tab-contents .drawing-list li .test .wide-big-btn{right:1rem}.tab-contents .drawing-list li .test .text-info{font-size:1.25rem}.tab-contents .writing-list{gap:1rem}.tab-contents .writing-list .writing{width:47%}.tab-contents .story4u-contents{width:100%}.tab-contents .story4u-contents li{width:47%}.tab-contents .story4u-contents li .book-cover{height:424px;left:2px;position:absolute;overflow:hidden;top:-1.5px;width:99%;z-index:10}.tab-contents .story4u-contents li .book-name-container .book-title{font-size:2.8rem}.tab-contents .story4u-contents li .book-name-container .book-title .book-title-stroke{width:100%;position:absolute;top:0;left:0;z-index:-1;-webkit-text-stroke:8px #008d69}.tab-contents .story4u-contents li .book-name-container .work-name{font-size:2rem}.tab-contents .story4u-contents li .book-name-container .work-date{font-size:1.5rem}.tab-contents .story4u-contents li .play-state-btn{width:40%}.tab-contents .story4u-contents::after{content:"";width:30%;height:0}}@media(orientation: portrait){.toggle-btn-list{flex-direction:column;align-items:flex-start}.tab-contents .empty-contents{display:flex;flex-direction:column;align-items:center;justify-content:center}.tab-contents .empty-contents figure{width:70%}.tab-contents .empty-contents figure.drawing{width:70%}.tab-contents .empty-contents figure.story{width:70%}.tab-contents .empty-contents p{padding:2rem 0;font-size:1.8rem;text-align:center}.tab-contents .empty-contents p .mobile-only{display:block}.tab-contents .empty-contents button{background-color:var(--bs-blue-primary);border:none;padding:.8rem 1.25rem;border-radius:4px;color:var(--bs-white);cursor:pointer;transition:.3s;font-size:1rem}.tab-contents .empty-contents button:hover{background-color:var(--bs-blue-hovered)}.tab-contents .drawing-list{justify-content:space-between;gap:1rem}.tab-contents .drawing-list li{width:47%}.tab-contents .writing-list{gap:1rem}.tab-contents .writing-list .writing{width:47%}}
.view-all-button-wrapper{position:fixed;bottom:-10px;left:10px;cursor:pointer}.conts-list{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2.5rem}.conts-list .individual-conts{width:30%;max-height:none;max-height:initial;border-radius:8px;overflow:hidden;display:flex;flex-direction:column;align-items:center;background-color:var(--bs-white);cursor:pointer;padding-top:1rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25);position:relative}.conts-list .individual-conts .work-image{width:90%}.conts-list .individual-conts .work-image .wide-big-btn{display:flex;align-items:center;position:absolute;top:1rem;right:18px;padding:1rem;gap:.5rem;background-color:rgba(0,0,0,.5);cursor:pointer}.conts-list .individual-conts .work-image .wide-big-btn span{color:var(--bs-white);font-family:"Maple"}.conts-list .individual-conts .work-desc{padding:1.25rem 1rem;border-top:none;border-radius:8px;display:flex;flex-direction:column;gap:1rem;width:90%}.conts-list .individual-conts .work-desc .work-tit{font-size:20px;color:var(--bs-blue-primary);font-weight:700;font-family:"Maple"}.conts-list .individual-conts .work-desc .worker{flex-shrink:0;font-size:24px;font-family:"Maple"}.conts-list .individual-conts .work-desc .work-date{font-family:"Maple"}.creation-btn-container{display:flex;gap:1rem;position:relative;z-index:10}.creation-btn-container .btn-cancel{padding:10px 20px;font-size:16px;cursor:pointer;display:flex;align-items:center;border:none;color:var(--bs-white);font-family:"Maple";border-radius:.25rem;background-color:#6c757d}.creation-btn-container .btn-delete{padding:10px 20px;font-size:16px;cursor:pointer;display:flex;align-items:center;border:none;color:var(--bs-white);font-family:"Maple";border-radius:.25rem;background-color:#fd7e14}.creation-btn-container .btn-delete.disabled{opacity:.5;cursor:not-allowed}.creation-btn-container .btn-delete.enabled{opacity:1;cursor:pointer}.creation-btn-container .btn-download{padding:10px 20px;font-size:16px;cursor:pointer;display:flex;align-items:center;border:none;color:var(--bs-white);font-family:"Maple";border-radius:.25rem;background-color:#68af9e}.creation-btn-container .btn-download.disabled{opacity:.5;cursor:not-allowed}.creation-btn-container .btn-download.enabled{opacity:1;cursor:pointer}.search-bar{display:flex;justify-content:center;margin:3rem 0;gap:1rem}.search-bar input{width:50%;border:none;font-family:"Maple";padding:1.5rem;border-radius:.5rem;font-size:1rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}.search-bar button{padding:1.5rem 2rem;cursor:pointer;border:none;border-radius:.5rem;font-family:"Maple";font-size:1rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25);background-color:#66bf30;color:var(--bs-white)}.slide-up-menu{position:fixed;bottom:-100px;left:0;width:100%;background-color:hsla(0,0%,100%,.8);box-shadow:0 -2px 10px rgba(0,0,0,.1);display:flex;justify-content:center;gap:1rem;padding:10px 0;transition:bottom .3s ease-in-out;z-index:60}.slide-up-menu.show{bottom:0}.slide-up-menu button{padding:10px 20px;font-size:16px;cursor:pointer;display:flex;align-items:center;border:none;color:var(--bs-white);font-family:"Maple";border-radius:.25rem}.slide-up-menu button.btn-cancel{background-color:#6c757d}.slide-up-menu button.btn-delete{background-color:#fd7e14}.slide-up-menu button.btn-delete.disabled{opacity:.5;cursor:not-allowed}.slide-up-menu button.btn-delete.enabled{opacity:1;cursor:pointer}.slide-up-menu button.btn-download{background-color:#68af9e}.slide-up-menu button.btn-download.disabled{opacity:.5;cursor:not-allowed}.slide-up-menu button.btn-download.enabled{opacity:1;cursor:pointer}@media screen and (max-width: 1440px){.conts-list{justify-content:space-between}.conts-list::after{content:"";width:30%;height:0}}@media(orientation: portrait){.conts-list{gap:1.5rem}.conts-list .individual-conts{width:47%}}
.shortform-list{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2rem;position:relative}.shortform-list li{width:30%;background:none;border-radius:8px;overflow:hidden;position:relative}.shortform-list li .polaroid-bg{position:absolute;top:10%;left:50%;transform:translateX(-50%);width:90%;background:none;height:auto;overflow:hidden}.shortform-list li .polaroid-bg .video-container.selected{border:8px solid #efca50}.shortform-list li .polaroid-bg input[type=checkbox]{display:none}.shortform-list li .polaroid-bg input[type=checkbox]+label{display:inline-block;width:1.5rem;height:1.5rem;border:2px solid #fff;background-color:#fff;border-radius:2px;cursor:pointer;position:absolute;left:40px;top:40px;z-index:50}.shortform-list li .polaroid-bg input[type=checkbox]+label::before{content:"✔";width:14px;height:14px;color:#007bff;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%) scale(0);transition:transform .2s ease-in-out;border-radius:2px;z-index:10}.shortform-list li .polaroid-bg input[type=checkbox]+label p{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);opacity:.2}.shortform-list li .polaroid-bg input[type=checkbox]:checked+label:before{transform:translate(-50%, -50%) scale(1)}.shortform-list li .polaroid-bg input[type=checkbox]:checked+label p{display:none}.shortform-list li .polaroid-bg .text-info{display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:1rem;font-family:"Maple";font-size:1.25rem}.shortform-list li .polaroid-bg .text-info p:first-child{color:var(--bs-blue-primary);font-weight:bold;line-height:1.4}
.music-detail-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:9999;background-color:rgba(0,0,0,.5);font-family:"Maple"}.music-detail-modal .inner{height:100vh !important;display:flex;align-items:center;justify-content:center;flex-direction:column}.music-detail-modal .inner .close-big-section{background-color:#fac41d;width:70px;height:70px;position:absolute;top:10%;right:5%;padding:1.5rem;cursor:pointer;border:none;border-radius:50%}.music-detail-modal .inner .lyric-result-container{display:flex;align-items:stretch;justify-content:center;gap:2.5rem;width:100%;position:relative;z-index:10}.music-detail-modal .inner .lyric-result-container .left{width:60%;border:10px solid #f5c938;padding:3rem 1rem 1rem;background-color:var(--bs-white);border-radius:24px;position:relative}.music-detail-modal .inner .lyric-result-container .left .refresh-button{position:absolute;top:20px;left:20px;width:160px;cursor:pointer}.music-detail-modal .inner .lyric-result-container .left .music-player{display:flex;flex-direction:column;align-items:center;justify-content:center}.music-detail-modal .inner .lyric-result-container .left .music-player .music-cover-box{width:30%}.music-detail-modal .inner .lyric-result-container .left .music-player .music-cover-box .music-title{font-size:1.25rem;margin:.5rem}.music-detail-modal .inner .lyric-result-container .left .music-player .player-controls{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:16px;width:50%}.music-detail-modal .inner .lyric-result-container .left .music-player .player-controls .progress-wrapper{display:flex;align-items:center;width:100%;gap:8px}.music-detail-modal .inner .lyric-result-container .left .music-player .player-controls .progress-wrapper span{font-size:14px;color:#333;width:50px;text-align:center}.music-detail-modal .inner .lyric-result-container .left .music-player .player-controls .progress-wrapper input[type=range]{flex:1 1;-webkit-appearance:none;height:6px;border-radius:3px;background:#dfdfdf;outline:none;cursor:pointer}.music-detail-modal .inner .lyric-result-container .left .music-player .player-controls .progress-wrapper input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;height:14px;width:14px;background:#f92457;border-radius:50%;cursor:pointer}.music-detail-modal .inner .lyric-result-container .left .music-player .player-controls .progress-wrapper input[type=range]::-moz-range-thumb{height:14px;width:14px;background:#f92457;border-radius:50%;cursor:pointer}.music-detail-modal .inner .lyric-result-container .left .music-player .player-controls .buttons{display:flex;gap:16px}.music-detail-modal .inner .lyric-result-container .left .music-player .player-controls .buttons button{background:none;border:none;cursor:pointer;padding:6px;transition:transform .2s ease;width:100px;height:100px}.music-detail-modal .inner .lyric-result-container .left .music-player .player-controls .buttons button:hover{transform:scale(1.1)}.music-detail-modal .inner .lyric-result-container .right{width:40%;border:10px solid #f5c938;padding:1rem;background-color:var(--bs-white);border-radius:24px;display:flex;flex-direction:column;align-items:center;justify-content:center}.music-detail-modal .inner .lyric-result-container .right p{max-height:400px;overflow-y:auto;padding-right:8px;text-align:center;font-size:2rem;line-height:2}
.music-list{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem;position:relative}.music-list li{width:30%;background:none;border-radius:8px;overflow:hidden;position:relative}.music-list li .music-prev{position:absolute;top:10%;left:50%;transform:translateX(-50%);width:90%;background:none;height:auto;overflow:hidden;cursor:pointer}.music-list li .music-prev.selected{border:8px solid #efca50}.music-list li .music-prev input[type=checkbox]{display:none}.music-list li .music-prev input[type=checkbox]+label{display:inline-block;width:1.5rem;height:1.5rem;border:2px solid #fff;background-color:#fff;border-radius:2px;cursor:pointer;position:absolute;left:20px;top:20px;z-index:50}.music-list li .music-prev input[type=checkbox]+label::before{content:"✔";width:14px;height:14px;color:#007bff;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%) scale(0);transition:transform .2s ease-in-out;border-radius:2px;z-index:10}.music-list li .music-prev input[type=checkbox]+label p{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);opacity:.2}.music-list li .music-prev input[type=checkbox]:checked+label:before{transform:translate(-50%, -50%) scale(1)}.music-list li .music-prev input[type=checkbox]:checked+label p{display:none}.music-list li .music-prev .music-cover{width:95%;margin:0 auto}.music-list li .music-prev .text-info{display:flex;align-items:center;justify-content:space-between;width:95%;margin:0 auto;margin-top:1rem;font-family:"Maple";font-size:1.25rem}.music-list li .music-prev .text-info p:first-child{color:var(--bs-blue-primary);font-weight:bold;line-height:1.4}.music-list li .music-prev .music-play-btn{width:60%;margin:0 auto}
.prompt-edu-contents{display:flex;flex-wrap:wrap;justify-content:space-between;padding:20px 0;width:100%}.prompt-edu-contents li{cursor:pointer;position:relative;width:30%;border-radius:0px 6.448px 6.448px 0px;overflow:hidden}.prompt-edu-contents li input[type=checkbox]{display:none}.prompt-edu-contents li input[type=checkbox]+label{display:inline-block;width:1.5rem;height:1.5rem;border:2px solid #fff;background-color:#fff;border-radius:2px;cursor:pointer;position:absolute;left:40px;top:40px;z-index:50}.prompt-edu-contents li input[type=checkbox]+label::before{content:"✔";width:14px;height:14px;color:#007bff;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%) scale(0);transition:transform .2s ease-in-out;border-radius:2px;z-index:10}.prompt-edu-contents li input[type=checkbox]+label p{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);opacity:.2}.prompt-edu-contents li input[type=checkbox]:checked+label:before{transform:translate(-50%, -50%) scale(1)}.prompt-edu-contents li input[type=checkbox]:checked+label p{display:none}.prompt-edu-contents li .book-info{position:absolute;width:90%;top:7%;left:50%;transform:translateX(-50%)}.prompt-edu-contents li .book-info .creation-cover{position:absolute;bottom:20px;right:30px;width:4vw;border-radius:50%;overflow:hidden;border:4px solid #905343;box-shadow:0 6px 10px rgba(0,0,0,.15)}.prompt-edu-contents li .book-info .book-shadow{position:absolute;top:0;left:0;background-color:rgba(0,0,0,.3);width:12px;height:100%}.prompt-edu-contents li .book-info .book-white{border-radius:1.612px;background-color:var(--bs-white);box-shadow:-2px 1.29px 1.29px 0px rgba(0,0,0,.25);width:90%;height:10px;position:absolute;bottom:10px;right:11px}.prompt-edu-contents li .book-info .book-name-container{left:50%;position:absolute;text-align:center;top:45%;transform:translate(-50%, -50%);width:100%;z-index:20}.prompt-edu-contents li .book-info .book-name-container .book-title{color:var(--bs-white);font-size:1.25rem;line-height:1.2;position:relative;z-index:10;font-family:"Maple";margin-bottom:.6rem}.prompt-edu-contents li .book-info .book-name-container .book-title .book-title-stroke{width:100%;position:absolute;top:0;left:0;z-index:-1;-webkit-text-stroke:8px #008d69}.prompt-edu-contents li .book-info .book-name-container .work-name{color:var(--bs-white);font-size:1.2rem;line-height:1.2;position:relative;z-index:10;font-family:"Maple"}.prompt-edu-contents li .book-info .book-name-container .work-name .book-title-stroke{width:100%;position:absolute;top:0;left:0;z-index:-1;-webkit-text-stroke:6px #008d69}.prompt-edu-contents li .book-info .book-name-container .work-forbidden{margin-top:1rem}.prompt-edu-contents li .book-info .book-name-container .work-date{color:var(--bs-white);font-size:1rem;line-height:1.2;position:absolute;z-index:10;font-family:"Maple";color:#000;bottom:-45px;left:50%;transform:translateX(-50%)}.prompt-edu-contents li .book-info .book-name-container .work-date .book-title-stroke{width:100%;position:absolute;top:0;left:0;z-index:-1;-webkit-text-stroke:4px #fff}.prompt-edu-contents li .book-info .play-state-btn{width:40%;display:flex;position:absolute;top:10px;left:10px;z-index:99}.prompt-edu-contents li .book-info .play-state-btn button{border:none;background:none;cursor:pointer}.prompt-edu-contents::after{content:"";width:300px;height:0}
.pe-detail-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:9999;background-color:rgba(0,0,0,.5);font-family:"Maple"}.pe-detail-modal .inner{height:100vh !important;display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative}.pe-detail-modal .inner .close-big-section{background-color:#fac41d;width:70px;height:70px;position:absolute;top:5%;right:0%;padding:1.5rem;cursor:pointer;border:none;border-radius:50%}.pe-detail-modal .inner .pe-detail-panel{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.pe-detail-modal .inner .pe-detail-panel .pe-detail-header{text-align:center;display:inline-flex;justify-content:center;background-color:var(--bs-white);flex-direction:column;align-items:center;width:40%;border:4px solid #7c4134;padding:1rem;border-radius:24px}.pe-detail-modal .inner .pe-detail-panel .pe-detail-header .title{font-size:1.6rem;margin-bottom:.5rem}.pe-detail-modal .inner .pe-detail-panel .pe-detail-header .subtitle{opacity:.7}.pe-detail-modal .inner .pe-detail-panel .pe-tabs{width:clamp(320px,80%,960px);margin:2rem auto 1.5rem;padding:8px;display:flex;align-items:center;justify-content:center;gap:10px;border:4px solid #7c4134;border-radius:999px;background:#fffaf0;box-shadow:0 6px 0 rgba(124,65,52,.18)}.pe-detail-modal .inner .pe-detail-panel .pe-tabs li{text-align:center;flex:1 1;text-align:center;cursor:pointer;-webkit-user-select:none;user-select:none;padding:.75rem 1rem;border-radius:999px;font-weight:900;font-size:clamp(14px,1.1vw,18px);line-height:1;color:#7c4134;background:hsla(0,0%,100%,.7);border:3px solid rgba(0,0,0,0);position:relative;transition:transform .15s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease}.pe-detail-modal .inner .pe-detail-panel .pe-tabs li.active{background:linear-gradient(180deg, #f9d548, #f4bf36);border-color:#7c4134;color:#3b241e;box-shadow:0 6px 0 rgba(124,65,52,.25),inset 0 0 0 3px #fff3bf;transform:translateY(-1px)}.pe-detail-modal .inner .pe-detail-panel .pe-tabs li.active::after{content:"";position:absolute;bottom:-10px;left:50%;transform:translateX(-50%);width:24px;height:6px;border-radius:999px;background:#7c4134;opacity:.9}.pe-detail-modal .inner .pe-detail-panel .pe-content{width:100%;display:flex;align-items:stretch;justify-content:center;gap:1rem}.pe-detail-modal .inner .pe-detail-panel .pe-content>*{width:50%;position:relative}.pe-detail-modal .inner .pe-detail-panel .pe-content .pe-left{position:relative}.pe-detail-modal .inner .pe-detail-panel .pe-content .pe-left .current-result-image{border-radius:24px;border:8px solid #7c4134}.pe-detail-modal .inner .pe-detail-panel .pe-content .pe-left .badge{position:absolute;left:50%;top:-20px;transform:translateX(-50%);width:10vw}.pe-detail-modal .inner .pe-detail-panel .pe-content .pe-right{background-color:var(--bs-white);padding:3rem;background-color:var(--bs-white);border-radius:24px;position:relative;border:8px solid #7c4134}.pe-detail-modal .inner .pe-detail-panel .pe-content .pe-right .badge{position:absolute;left:50%;top:-20px;transform:translateX(-50%);width:10vw}.pe-detail-modal .inner .pe-detail-panel .pe-content .pe-right .prompt-title{text-align:center;font-size:2rem;border-bottom:1px solid #d3d3d3;padding-bottom:1rem;margin-bottom:1rem}.pe-detail-modal .inner .pe-detail-panel .pe-content .pe-right .prompt-list{text-align:center;font-size:1.5rem;line-height:2;width:100%;flex-direction:column}.pe-detail-modal .inner .pe-detail-panel .pe-content .pe-right .prompt-list li{width:100%}
.floating-btn{position:fixed;bottom:-9px;left:264px;z-index:9999999999}.floating-btn .floating-container{position:relative}.floating-btn .floating-container .bubble{width:300px;position:relative;bottom:187px;right:20px;z-index:99}.floating-btn .floating-container .char{position:absolute;width:310px;bottom:0;right:-55px;transform:rotate(359deg);z-index:99}.floating-btn .back-magickid{width:460px;padding:1rem;position:absolute;bottom:0;right:-20px;cursor:pointer}@media screen and (min-width: 1367px)and (max-width: 1540px){.floating-btn .floating-container{display:none}}@media screen and (min-width: 1023px)and (max-width: 1366px){.floating-btn{display:none}.floating-btn .floating-container .bubble{width:260px;bottom:148px;right:13px}.floating-btn .floating-container .char{width:280px;bottom:0;right:-76px}.floating-btn .back-magickid{bottom:-1px}}@media screen and (min-width: 901px)and (max-width: 1022px){.floating-btn{display:none}.floating-btn .floating-container .bubble{width:210px;bottom:132px;right:27px}.floating-btn .floating-container .char{width:220px;bottom:0;right:-47px}.floating-btn .back-magickid{width:370px}}@media screen and (min-width: 801px)and (max-width: 900px){.floating-btn{display:none}.floating-btn .floating-container .bubble{width:210px;bottom:-91px;right:-63px}.floating-btn .floating-container .char{width:220px;bottom:0;right:-127px}.floating-btn .back-magickid{width:370px}}@media screen and (min-width: 768px)and (max-width: 800px){.floating-btn{display:none}.floating-btn .floating-container .bubble{width:210px;bottom:-91px;right:-63px}.floating-btn .floating-container .char{width:220px;bottom:0;right:-127px}.floating-btn .back-magickid{width:370px}}@media screen and (max-width: 767px){.floating-btn{display:none}.floating-btn .floating-container .bubble{width:210px;bottom:130px;right:0px}.floating-btn .floating-container .char{width:220px;bottom:0;right:-63px}.floating-btn .back-magickid{width:370px}}@media(orientation: portrait){.floating-btn{display:none}.floating-btn .floating-container .char{right:-60px}.floating-btn .floating-container .bubble{bottom:130px;right:20px}}
.removal-section{width:100%;min-height:100vh;background-color:rgba(0,0,0,.5);position:fixed;top:0;left:0}.removal-section .inner{position:relative;height:100vh}.removal-section .inner .removal-box{padding:1rem;width:50%;background-color:var(--bs-white);position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;border-radius:.5rem}.removal-section .inner .removal-box p{font-family:"Maple";font-size:2.2rem}.removal-section .inner .removal-box button{font-family:"Maple";border:none;padding:.5rem 3rem;border-radius:.25rem;cursor:pointer;background-color:#6c757d;color:var(--bs-white);font-size:1.25rem}
.confirm-section{width:100%;min-height:100vh;background-color:rgba(0,0,0,.5);position:fixed;top:0;left:0;z-index:100}.confirm-section .inner{position:relative;height:100vh}.confirm-section .inner .confirm-box{padding:2rem 1rem;width:50%;background-color:var(--bs-white);position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;border-radius:.5rem}.confirm-section .inner .confirm-box p{font-family:"Maple";font-size:1.8rem}.confirm-section .inner .confirm-box .confirm-btn-container{display:flex;gap:1rem;align-items:center}.confirm-section .inner .confirm-box .confirm-btn-container button{padding:10px 20px;font-size:16px;cursor:pointer;display:flex;align-items:center;border:none;color:var(--bs-white);font-family:"Maple";border-radius:.25rem}.confirm-section .inner .confirm-box .confirm-btn-container button.btn-cancel{background-color:#6c757d}.confirm-section .inner .confirm-box .confirm-btn-container button.btn-delete{background-color:#fd7e14}
.writing-detail-modal{width:100%;min-height:100vh;position:fixed;top:0;left:0;background-color:rgba(0,0,0,.8);z-index:9999}.writing-detail-modal .inner{height:100vh;overflow-y:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;position:relative}.writing-detail-modal .inner .close-modal-btn{background-color:#ffc377;border:none;border-radius:50%;cursor:pointer;display:flex;justify-content:center;align-items:center;margin-left:auto;padding:.8rem;position:absolute;right:20px;top:50px;width:46px;height:46px}.writing-detail-modal .inner figure{margin-top:2rem;width:90%;position:relative}.writing-detail-modal .inner figure .play-state-btn{position:absolute;top:60px;left:10px;display:flex;z-index:20}.writing-detail-modal .inner figure .play-state-btn button{border:none;background:none;width:100px;cursor:pointer}.writing-detail-modal .inner .writing-conts{position:absolute;top:50%;transform:translateY(-50%);width:80%}.writing-detail-modal .inner .writing-conts .writing-tit{font-size:30px;font-weight:700;margin-bottom:2rem;text-align:center}.writing-detail-modal .inner .writing-conts .writing-all{text-align:center;line-height:2;font-size:40px;width:100%;padding:0 1rem;margin:0 auto;height:300px;overflow-y:scroll;font-family:"KyoboHandwriting2019"}.writing-detail-modal .inner .close-btn{width:50%;padding:1rem;text-align:center;font-size:32px;background-color:var(--bs-blue-primary);color:var(--bs-white);cursor:pointer;transition-duration:.3s;font-family:"Maple";border:none}.writing-detail-modal .inner .close-btn:hover{background-color:var(--bs-blue-hovered)}.writing-detail-modal .print-page{display:none;page-break-after:always}@media screen and (min-width: 1023px)and (max-width: 1366px){.writing-detail-modal .inner figure{margin-top:2rem;width:90%}}@media screen and (min-width: 901px)and (max-width: 1022px){.writing-detail-modal{display:flex}.writing-detail-modal .inner figure{margin-top:0rem;width:70%}.writing-detail-modal .inner figure .play-state-btn{top:40px}.writing-detail-modal .inner figure .play-state-btn button{width:70px}.writing-detail-modal .inner .writing-conts{top:48%;transform:translateY(-50%)}.writing-detail-modal .inner .writing-conts .writing-tit{font-size:26px;margin-bottom:1rem}.writing-detail-modal .inner .writing-conts .writing-all{height:250px;width:70%;padding:0 3rem;font-size:30px}}@media screen and (max-width: 900px){.writing-detail-modal{display:flex}.writing-detail-modal .inner figure{margin-top:0rem;width:95%}.writing-detail-modal .inner figure .play-state-btn{position:absolute;top:40px;left:10px;display:flex;z-index:20}.writing-detail-modal .inner figure .play-state-btn button{border:none;background:none;width:70px;cursor:pointer}.writing-detail-modal .inner .writing-conts{top:26%}.writing-detail-modal .inner .writing-conts .writing-tit{font-size:26px;margin-bottom:1rem}.writing-detail-modal .inner .writing-conts .writing-all{height:250px;width:70%;padding:0 3rem;font-size:30px}}@media(orientation: portrait){.writing-detail-modal .inner .writing-conts{width:90%;top:48%;transform:translateY(-50%)}}
.scroll-to-top{position:fixed;bottom:0px;right:0px;z-index:1000}.scroll-to-top .scroll-button{background:none;color:#fff;border:none;width:200px;height:200px;font-size:20px;border-radius:50%;cursor:pointer;transition:opacity .3s ease-in-out;display:flex;flex-direction:column;align-items:center;justify-content:center}.scroll-to-top .scroll-button figure{width:48px;height:48px}.scroll-to-top .scroll-button:hover::before{content:"Scroll Top!";font-family:"Maple";color:var(--bs-blue-primary);font-size:14px;font-weight:900}@media screen and (min-width: 1367px)and (max-width: 1440px){.scroll-to-top{right:40px;bottom:40px}.scroll-to-top .scroll-button{width:98px;height:98px}.scroll-to-top .scroll-button figure{width:36px;height:36px}.scroll-to-top .scroll-button:hover{background-color:#5baa29}}@media screen and (min-width: 1023px)and (max-width: 1366px){.scroll-to-top{right:40px;bottom:40px}.scroll-to-top .scroll-button{width:98px;height:98px}.scroll-to-top .scroll-button figure{width:36px;height:36px}.scroll-to-top .scroll-button:hover{background-color:#5baa29}}@media screen and (max-width: 1022px){.scroll-to-top{right:40px;bottom:40px}.scroll-to-top .scroll-button{width:80px;height:80px}.scroll-to-top .scroll-button figure{width:28px;height:28px}.scroll-to-top .scroll-button:hover{background-color:#5baa29}}
.contents{min-height:auto}.contents.work-con{background:#7bb3ff;padding-top:3rem;position:relative}.contents.work-con .inner{position:relative;z-index:2}.contents.work-con .tree-left-top{position:absolute;top:0;left:0;display:none}.contents.work-con .right-top-tree{position:absolute;top:100px;right:0;width:15%;display:none}.contents.work-con .grass{position:absolute;top:50%;left:10%;display:none}.contents.work-con .grass-2{position:absolute;top:8%;right:30%;display:none}.contents.work-con .con-bottom{position:fixed;width:100%;bottom:0;left:0}.contents.work-con .con-top{position:fixed;width:100%;top:0;left:0;z-index:1}.contents.work-con .right-contents{height:auto}.contents.work-con .right-contents.work-con{padding:0 0 100px}.contents.work-con .right-contents.work-con .selectbox{font-family:"Maple";border-radius:3rem;padding:.25rem .5rem;font-size:1.25rem}.contents .school-tit{display:flex;align-items:center;justify-content:space-between}.contents .school-tit .print-btn{display:flex;align-items:center;gap:.4rem;border:none;padding:.8rem;border-radius:4px;cursor:pointer}.contents .school-tit .print-btn span{font-size:16px}
.wrapper.nav-open .hub-title{padding-top:6rem}@media(max-width: 1024px){.wrapper.nav-open .hub-title{padding-top:3rem}}.transition-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:999999999 !important;pointer-events:none;overflow:hidden;animation:revealCircle 1.8s ease forwards;display:flex;align-items:center;justify-content:center;-webkit-clip-path:circle(0% at 50% 50%);clip-path:circle(0% at 50% 50%)}.new-nav-container{position:fixed;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:"Maple"}.new-nav-container.sea-position{bottom:20px;right:-30px}.new-nav-container.hub-position{bottom:140px;right:40px}.new-nav-container.payment-position{bottom:20px;right:20px;z-index:999}.new-nav-container.payment-position.has-scroll-button{bottom:220px}.new-nav-container.payment-position.no-scroll-button{bottom:20px}.new-nav-container .nav-toggle-btn{z-index:10;background:none;border:none;cursor:pointer;font-weight:bold;border-radius:8px;margin-bottom:.5rem}.new-nav-container .nav-menu-list{background-color:#134388;padding:0;border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;overflow:hidden;transition:max-height .6s ease,opacity .4s ease;max-height:0;opacity:0;margin:0;margin-bottom:.5rem}.new-nav-container .nav-menu-list.open{max-height:600px;opacity:1;padding:1.5rem .5rem}.new-nav-container .nav-menu-list li{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.45rem;cursor:pointer;border-bottom:1px solid hsla(0,0%,100%,.5);width:100%;padding-bottom:1.25rem;transition:transform .3s ease}.new-nav-container .nav-menu-list li:last-child{border-bottom:none;padding-bottom:0}.new-nav-container .nav-menu-list li p{color:var(--bs-white)}.new-nav-container .nav-menu-list li figure.teacher-new-badge{width:3vw}.new-nav-container .navigation{width:160px;cursor:pointer}@media(max-width: 1440px){.new-nav-container{align-items:center;gap:.5rem}.new-nav-container.payment-position{bottom:150px}.new-nav-container.payment-position .navigation{width:120px}.new-nav-container.hub-position{top:10px;bottom:auto;bottom:initial;flex-direction:row}.new-nav-container.hub-position .navigation{width:120px}.new-nav-container.hub-position .nav-menu-list{flex-direction:row;max-width:0;opacity:0;overflow:hidden;transform:scaleX(0);transform-origin:left center;transition:all .4s ease;transition:opacity .3s ease,transform .4s ease,max-width .4s ease}.new-nav-container.hub-position .nav-menu-list li{border-bottom:none;border-right:1px solid hsla(0,0%,100%,.5);padding-bottom:0;padding-right:1.25rem}.new-nav-container.hub-position .nav-menu-list li:last-child{border-right:none;padding-right:0}.new-nav-container.hub-position .nav-menu-list li p{white-space:nowrap}.new-nav-container.hub-position .nav-menu-list.open{max-width:800px;opacity:1;transform:scaleX(1);padding:.8rem 1.25rem}}
.overlay-section{position:absolute;inset:0;width:100%;height:100dvh;background:linear-gradient(180deg, #4994f8 0%, #b4d8fc 100%);overflow:hidden;z-index:999 !important}.overlay-section .overlay-item{position:absolute}.overlay-section .overlay-item.ex-cloud-1{left:-100px;top:60px;width:20vw}.overlay-section .overlay-item.ex-cloud-2{right:10px;top:50px;width:10vw}.overlay-section .overlay-item.ex-cloud-bottom-1{bottom:0;left:0;width:30vw}.overlay-section .overlay-item.ex-cloud-bottom-2{bottom:0;right:0;width:43vw}.overlay-section .overlay-item.ex-rainbow{bottom:100px;right:-100px;width:40vw;transform:rotate(340deg)}.overlay-section .inner{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.overlay-section .inner .ex-char{width:80%;position:relative;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center}.overlay-section .inner .ex-char .transition-riv{width:100%}.overlay-section .inner .ex-char .transition-riv canvas{width:100% !important;height:auto !important}.overlay-section .inner .ex-char .transition-char{width:95%}.overlay-section .inner .ex-char figure{width:70%}@supports not (height: 100dvh){.overlay-section{height:100vh}}
.new-login-wrap{background-color:#eef3fe}.new-login-wrap .login-container{height:100vh;display:flex}.new-login-wrap .login-container .login-form{flex:1 1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0}.new-login-wrap .login-container .login-form .logo{width:360px;cursor:pointer}.new-login-wrap .login-container .login-form .login-text{text-align:center}.new-login-wrap .login-container .login-form .login-text h3{font-size:50px;font-weight:700;color:#009c19}.new-login-wrap .login-container .login-form .login-text p{font-size:28px;margin-top:2rem;font-weight:lighter}.new-login-wrap .login-container .login-form .login-text{font-family:"nanum";color:#888;margin:2rem 0;font-size:24px;font-weight:700}.new-login-wrap .login-container .login-form form{display:flex;flex-direction:column;width:30%}.new-login-wrap .login-container .login-form form input{border:1px solid #ddd;width:100%;padding:1.8rem;border-radius:4px;font-family:"nanum";font-size:14px}.new-login-wrap .login-container .login-form form input:first-child{margin-bottom:.5rem}.new-login-wrap .login-container .login-form form .login-btn{border:none;width:100%;padding:1.5rem 2rem;border-radius:4px;font-family:"nanum";background-color:var(--bs-blue-primary);color:var(--bs-white);font-size:16px;margin-top:.5rem;cursor:pointer;font-size:18px;font-weight:900}.new-login-wrap .login-container .login-form .input-error{font-family:"nanum";color:red;text-align:center;margin-top:1.5rem}.new-login-wrap .login-container .login-form .login-error{font-size:1rem;font-family:"nanum";color:red;margin-top:1.5rem}.new-login-wrap .login-container .login-form .login-form-sub-text{display:flex;align-items:center;justify-content:space-between;width:30%;font-family:"nanum";margin:.5rem 0 2rem;color:#888}.new-login-wrap .login-container .login-form .login-form-sub-text p{cursor:pointer}.new-login-wrap .login-container .login-form .sns-login-container{margin-top:2rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem}.new-login-wrap .login-container .login-form .sns-login-container .sns-text{width:100%;text-align:center;margin:1rem auto}.new-login-wrap .login-container .login-form .sns-login-container .sns-text span{color:#888;width:100%;display:block;text-align:center}.new-login-wrap .login-container .login-form .sns-login-container figure{width:80%;cursor:pointer}
.verification-wrap{height:100vh;background-color:#eef3fe;width:100%}.verification-wrap .inner{height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column;font-family:"nanum";width:100%}.verification-wrap .inner .email-verification-container{width:100%}.verification-wrap .inner .email-verification-container h2{font-size:2rem;text-align:center;font-weight:700}.verification-wrap .inner .email-verification-container .sub-text{line-height:1.4;text-align:center;margin:2rem 0 4rem}.verification-wrap .inner .email-verification-container form{display:flex;flex-direction:column;width:90%;margin:0 auto}.verification-wrap .inner .email-verification-container form input{border:1px solid #134388;font-family:"nanum";padding:17px 16px 16px;border-radius:.25rem;margin:.25rem 0 .8rem}.verification-wrap .inner .email-verification-container form button{background-color:#134388;border:none;border-radius:3rem;padding:1rem;color:var(--bs-white);font-weight:900;cursor:pointer}.verification-wrap .inner .email-verification-container .error-text{color:red;width:100%;text-align:center;margin-top:2rem}.verification-wrap .inner .email-verification-container .error-text.num-only{margin-top:0}.verification-wrap .inner .email-verification-container .find-pw{display:flex;text-align:center;justify-content:center;width:100%;margin:8rem 0}.verification-wrap .inner .email-verification-container .find-pw .back-to-login{font-weight:900;margin-left:.5rem;cursor:pointer;color:#134388;text-decoration:underline;text-underline-position:under}@media screen and (max-width: 900px){.reset-wrap .inner .reset-container{width:100% !important}.reset-wrap .inner .reset-container form{width:100% !important}}
.reset-wrap{width:100%;height:100vh;position:fixed;top:0;left:0;background-color:#eef3fe;z-index:99999}.reset-wrap .inner{height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column;font-family:"nanum"}.reset-wrap .inner .back-link{text-align:center;margin-top:1rem;cursor:pointer}.reset-wrap .inner .back-link:hover{text-decoration:underline}.reset-wrap .inner .reset-container{width:70%}.reset-wrap .inner .reset-container h2{font-size:2rem;text-align:center;font-weight:700}.reset-wrap .inner .reset-container .sub-text{line-height:1.4;text-align:center;margin:2rem 0 4rem}.reset-wrap .inner .reset-container form{display:flex;flex-direction:column;width:90%;margin:0 auto}.reset-wrap .inner .reset-container form input{border:1px solid #134388;padding:17px 16px 16px;border-radius:.25rem;margin:.25rem 0 2rem;color:#000 !important;font-size:1rem}.reset-wrap .inner .reset-container form .password-message{text-align:center;margin-bottom:2rem}.reset-wrap .inner .reset-container form .password-message.text-blue{color:blue}.reset-wrap .inner .reset-container form .password-message.text-red{color:red}.reset-wrap .inner .reset-container form button{background-color:#134388;border:none;border-radius:3rem;padding:1rem;color:var(--bs-white);font-weight:900;cursor:pointer}.reset-wrap .inner .reset-container form button.cancel-btn{background-color:#d3d3d3;margin-top:.8rem;font-weight:500}@media screen and (max-width: 1000){.reset-wrap .inner{width:100%}.reset-wrap .inner .reset-container{width:100%}}
.membership-wrap{position:absolute;top:0;left:0;z-index:9999;width:100%;min-height:100vh;background-color:#ecf1fd;font-family:"NEXONLv1Gothic" !important}.join-section{padding:100px 0 100px}.join-section .txt-container{width:100%;font-family:"nanum"}.join-section .txt-container h4{font-size:24px;font-family:"nanum"}.join-section .txt-container p{color:gray;margin:.5rem 0 1rem}.join-section .join-tit{font-size:36px;margin-bottom:3rem;font-weight:700}.join-section .membership-form{border-top:1px solid #111}.join-section .membership-form .inputs{padding:1.5rem 1rem;display:flex;align-items:center;border-bottom:var(--is-border);font-family:"nanum"}.join-section .membership-form .inputs p{width:20%}.join-section .membership-form .inputs p .required{font-weight:900;color:var(--bs-blue-primary)}.join-section .membership-form .inputs input{border:var(--is-border);width:30%;height:46px;padding:0 1rem;border-radius:4px}.join-section .membership-form .inputs .email{width:15%}.join-section .membership-form .inputs .at{padding:0 .5rem}.join-section .membership-form .inputs .email-options{height:46px;width:120px;border:var(--is-border);border-radius:4px;margin:0 1rem;padding:0 .2rem;background-color:var(--bs-white)}.join-section .membership-form .inputs .overlap-chk{height:46px;width:120px;border:var(--is-border);border-radius:4px;cursor:pointer}.join-section .membership-form .inputs .overlap-chk.id-chk{margin-left:1rem}.join-section .membership-form .inputs .overlap-chk{background-color:var(--bs-blue-primary);color:var(--bs-white)}.join-section .membership-form .inputs .overlap-chk:hover{background-color:var(--bs-blue-hovered)}.join-section .membership-form .inputs .colored-input{background-color:#f3f3f3;border-color:#f3f3f3}.join-section .membership-form .inputs .error-message{color:red;font-size:14px;margin-left:1rem;flex:1 1}.join-section .membership-form .inputs .message-success{color:blue}.join-section .form-btns{width:100%;display:flex;justify-content:center;gap:.5rem;margin-top:3rem}.join-section .form-btns button{padding:.8rem 2.5rem;border:none;border-radius:4px;cursor:pointer}.join-section .form-btns button.join-btn{background-color:var(--bs-blue-primary);color:var(--bs-white)}.join-section .form-btns button.join-btn:hover{background-color:var(--bs-blue-hovered)}.join-section .terms-container .check-inputs{width:50%;margin:2rem auto;font-family:"nanum"}.join-section .terms-container .term-box span{display:flex;padding-left:1.6rem}.join-section .terms-container input[type=checkbox]{display:none}.join-section .terms-container input[type=checkbox]+label{display:flex;width:20px;height:20px;border:1.6px solid #707070;position:relative}.join-section .terms-container input[type=checkbox]:checked+label::after{content:"✔";font-size:16px;width:20px;height:20px;text-align:center;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}.join-section .terms-container .term-detail{font-size:14px;font-weight:700;color:var(--bs-blue-primary);border-bottom:1px solid var(--bs-blue-primary);padding-bottom:.1rem;cursor:pointer;font-weight:900}.join-section .terms-container .term-total-box{border:var(--is-border);border-radius:4px;padding:1rem;line-height:1.5;color:#5f5f5f;height:200px;overflow-y:scroll;font-family:"nanum"}@media screen and (max-width: 767px){.join-section .membership-form .inputs{flex-direction:column;align-items:flex-start;gap:.5rem}.join-section .membership-form .inputs p{width:100%}.join-section .membership-form .inputs input{width:100%}.join-section .membership-form .inputs .overlap-chk{width:100%}.join-section .membership-form .inputs .email-options{width:100%;padding:0;margin:0}.join-section .membership-form .inputs .email{width:100%}.join-section .terms-container .check-inputs{width:100%}}
.landscape-modal{width:100%;min-height:100vh;background-color:rgba(0,0,0,.5);position:fixed;top:0;left:0;z-index:9999;display:none}.landscape-modal .inner{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center}.landscape-modal .inner figure{width:50%}.landscape-modal .inner .land-txt-container{width:70%;background-color:var(--bs-white);border-radius:.5rem;padding:2rem;display:flex;flex-direction:column;align-items:center;justify-content:center}.landscape-modal .inner .land-txt-container p{font-family:"Maple";font-size:2rem;margin-bottom:1rem;color:#252525;text-align:center;line-height:1.4}.landscape-modal .inner .land-txt-container button{font-family:"Maple";border:none;background-color:var(--bs-blue-primary);color:var(--bs-white);padding:.8rem 2rem;border-radius:4px;cursor:pointer;font-size:18px}@media(orientation: portrait){.landscape-modal{display:block}.landscape-modal .inner figure{width:70%}.landscape-modal .inner .land-txt-container{width:90%}.landscape-modal .inner .land-txt-container button{padding:1rem 4rem;font-size:20px}}
.new-login-wrap-test{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:2rem 0;background-color:#eef3fe;font-family:"nanum";overflow-y:scroll !important}.new-login-wrap-test .inner{width:70%}.new-login-wrap-test .inner .logo{width:280px;margin:0 auto 3rem;cursor:pointer}.new-login-wrap-test .inner .login-benefit-banner{width:60%;margin:20px auto;text-align:right;animation:move 1s linear alternate infinite}.new-login-wrap-test .inner .login-benefit-banner span{background-color:#ffc;border:1px solid #f9f993;border-radius:4px;font-size:14px;padding:5px 10px;color:var(--bs-blue-primary);font-weight:900}.new-login-wrap-test .inner .login-container{width:60%;margin:0 auto;padding:20px;border-radius:8px;background-color:#fff}.new-login-wrap-test .inner .login-container .button-group{border-bottom:1px solid #ddd;margin-bottom:1rem}.new-login-wrap-test .inner .login-container .button-group .login-type-button{font-family:"nanum";border:none;background:none;padding:.5rem 2rem;font-size:1rem;cursor:pointer;color:#8f8f93;width:33%}.new-login-wrap-test .inner .login-container .button-group .login-type-button.active{border-bottom:3px solid var(--bs-blue-primary);font-weight:900;color:var(--bs-blue-primary)}.new-login-wrap-test .inner .login-container .login-form{max-height:0;overflow:hidden;transition:max-height .5s ease,opacity .5s ease,padding .5s ease;opacity:0;padding:0 10px}.new-login-wrap-test .inner .login-container .login-form .error{color:red;margin:20px 0 0;text-align:center;font-size:14px}.new-login-wrap-test .inner .login-container .login-form .find-container{display:flex;align-items:center;justify-content:space-between;margin:8px 0 34px}.new-login-wrap-test .inner .login-container .login-form.open{max-height:700px;opacity:1;padding:10px;border-radius:4px}.new-login-wrap-test .inner .login-container .login-form h2{margin-bottom:15px;text-align:center;font-size:20px}.new-login-wrap-test .inner .login-container .login-form input{width:100%;padding:20px;margin-bottom:10px;border:none;border-radius:4px;background-color:#f1f1f3;font-family:"nanum"}.new-login-wrap-test .inner .login-container .login-form button{width:100%;padding:10px;margin-bottom:5px;border:none;border-radius:4px;cursor:pointer;font-size:16px;font-family:"nanum"}.new-login-wrap-test .inner .login-container .login-form button.forgot-password-button{width:auto;padding:0;background:none;text-align:left;font-size:14px}.new-login-wrap-test .inner .login-container .login-form button.forgot-password-button:hover{text-decoration:underline}.new-login-wrap-test .inner .login-container .login-form button.forgot-password-button.teacher-forgot{margin:8px 0 34px}.new-login-wrap-test .inner .login-container .login-form button.sign-up-button{width:auto;padding:0;background:none;font-size:14px;display:flex;align-items:center}.new-login-wrap-test .inner .login-container .login-form button.sign-up-button:hover{text-decoration:underline}.new-login-wrap-test .inner .login-container .login-form button.login-btn{width:100%;margin:0 auto;padding:1rem;background-color:var(--bs-blue-primary);color:var(--bs-white);font-weight:900;transition-duration:.2s}.new-login-wrap-test .inner .login-container .login-form button.login-btn:hover{background-color:var(--bs-blue-hovered)}.new-login-wrap-test .inner .login-container .login-form .sns-login-container{margin-top:2rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem}.new-login-wrap-test .inner .login-container .login-form .sns-login-container .login-naver-btn{width:30%}.new-login-wrap-test .inner .login-container .login-form .sns-login-container .sns-text{width:100%;text-align:center;margin:1rem auto .5rem;font-size:14px;color:dimgray}.new-login-wrap-test .inner .login-container .login-form .sns-login-container figure{width:60%;cursor:pointer}@keyframes move{0%{transform:translateY(-5px)}100%{transform:translateY(0px)}}@media only screen and (max-width: 1500px){.new-login-wrap-test .inner .login-container{width:80%}.new-login-wrap-test .inner .login-benefit-banner{width:80%}}@media only screen and (max-width: 1200px){.new-login-wrap-test .inner{width:80%}.new-login-wrap-test .inner .login-container{width:80%}.new-login-wrap-test .inner .login-benefit-banner{width:80%}}@media only screen and (max-width: 1000px){.new-login-wrap-test .inner{width:90%}.new-login-wrap-test .inner .logo{width:200px}.new-login-wrap-test .inner .login-container{width:100%;padding:10px}.new-login-wrap-test .inner .login-container .login-form .sns-login-container .login-naver-btn{width:70%}.new-login-wrap-test .inner .login-benefit-banner{width:100%}}
.floating-chat-btn{position:fixed;right:50px;bottom:30px;width:90px;height:90px;z-index:99999;border:none;background:none;cursor:pointer;animation:movin-up 1s infinite alternate}@keyframes movin-up{100%{transform:translateY(0.5px)}}@media screen and (max-width: 900px){.floating-chat-btn{right:15px;bottom:15px}}
#header{position:fixed;top:0;left:0;z-index:99;width:100%;background-color:var(--bs-white);padding:1rem 0;border-bottom:var(--is-border);font-family:"NEXONLv1Gothic"}#header .logo{width:230px;cursor:pointer}#header .header-left{display:flex;align-items:center;gap:3rem}#header .header-left .navi{display:flex;align-items:center;gap:2rem}#header .header-left .navi li{cursor:pointer;font-size:1.25rem}#header .header-left .utils{display:flex;align-items:center;gap:1rem}#header .header-left .utils li{cursor:pointer;font-size:1.25rem}#header .header-left .utils .login-btn{background:var(--bs-blue-primary);color:var(--bs-white)}#header .header-left .utils .sign-btn{border-radius:4px;background:var(--bs-blue-primary);color:var(--bs-white)}#header .hamburger-mobile{display:none}@media screen and (max-width: 1440px){#header .logo{width:180px}}@media screen and (max-width: 1000px){#header .logo{width:140px}#header .header-left{display:none}#header .hamburger-mobile{display:block}#header .hamburger-mobile button{border:none;background:none;cursor:pointer}#header .hamburger-mobile .ham-fixed{width:100%;min-height:100vh;position:fixed;top:0;left:0;z-index:999999 !important;background-color:var(--bs-white)}#header .hamburger-mobile .ham-fixed .close-m{position:relative;display:flex;justify-content:flex-end}#header .hamburger-mobile .ham-fixed .close-m button{width:3.5rem;height:3.5rem;cursor:pointer}#header .hamburger-mobile .ham-fixed .navi{padding:0rem 1rem}#header .hamburger-mobile .ham-fixed .navi li{font-size:1rem;cursor:pointer;font-weight:bold}#header .hamburger-mobile .ham-fixed .navi li:not(.utils){padding:1.5rem;border-bottom:var(--is-border)}#header .hamburger-mobile .ham-fixed .navi li.utils{width:100%;position:fixed;left:0;bottom:0;padding:1rem 1.5rem}#header .hamburger-mobile .ham-fixed .navi li.utils .btn{padding:1rem 1.5rem;text-align:center;font-size:.875rem}#header .hamburger-mobile .ham-fixed .navi li.utils .btn.login-btn{border:1px solid var(--bs-blue-primary);color:var(--bs-blue-primary);margin-bottom:.5rem}#header .hamburger-mobile .ham-fixed .navi li.utils .btn.sign-btn{background-color:var(--bs-blue-primary);color:var(--bs-white)}}
#footer{background-color:#343434;padding:3rem 0}#footer .inner{display:flex;align-items:center;justify-content:center;flex-direction:column}#footer .inner .copy-right{color:var(--bs-white);opacity:.5}#footer .inner .website{color:var(--bs-white);opacity:.5;cursor:pointer;margin-bottom:2rem}#footer .inner .co-ceo,#footer .inner .tel{color:var(--bs-white);opacity:.5;cursor:pointer;margin-bottom:2rem}#footer .inner .policy{display:flex;gap:1rem;margin-bottom:2rem;color:var(--bs-white);opacity:.5;cursor:pointer}#footer .inner .policy .policy-1:hover{font-weight:bold}#footer .inner .policy .policy-2:hover{font-weight:bold}#footer .inner .footer-tit-area{width:100%;margin-bottom:60px;display:flex;justify-content:space-between}#footer .inner .footer-tit-area .footer-logo{width:190px;flex-shrink:0;opacity:.6}#footer .inner .footer-tit-area .area-desc{width:56%;text-align:right;color:#fff;opacity:.5;line-height:1.4}#footer .inner .footer-main-con{width:100%;border-top:1px solid hsla(0,0%,100%,.3);display:flex;align-items:flex-end;padding-top:40px}#footer .inner .footer-main-con .left{width:100%;display:flex;justify-content:space-between;color:#fff;opacity:.5}#footer .inner .footer-main-con .left dl{width:248px;flex-shrink:1;margin-bottom:39px}#footer .inner .footer-main-con .left dl dt{font-weight:600;font-size:18px;margin-bottom:12px;padding-left:10px}#footer .inner .footer-main-con .left dl dd{font-size:1rem;font-weight:300;padding-left:10px;line-height:1.4}#footer .inner .footer-main-con .right{flex:1 1;margin-bottom:39px;color:#fff;opacity:.5;text-align:right;line-height:1.3}@media screen and (max-width: 767px){#wrap #footer .inner{font-size:14px;align-items:flex-start}#wrap #footer .inner .footer-tit-area{flex-direction:column}#wrap #footer .inner .footer-tit-area .footer-logo{width:140px}#wrap #footer .inner .footer-tit-area .area-desc{width:100%;text-align:left;margin-top:2rem;font-size:14px}#wrap #footer .inner .footer-main-con .left{flex-wrap:wrap}#wrap #footer .inner .footer-main-con .left dl{flex-shrink:1;width:100%}#wrap #footer .inner .footer-main-con .left dl dt{font-size:14px;padding-left:0}#wrap #footer .inner .footer-main-con .left dl dd{font-size:14px;padding-left:0}}
.first-login-section{width:100%;height:100vh;background-color:rgba(0,0,0,.5);font-family:"Maple";position:fixed;top:0;left:0;z-index:9999999910000000}.first-login-section .inner{max-width:70%;height:100%;display:flex;align-items:center;justify-content:center}.first-login-section .inner .setting-container{width:80%;background-color:#4ca05d;padding:1rem;border-radius:30px}.first-login-section .inner .setting-container .container-conts{width:100%;height:100%;background-color:var(--bs-white);padding:.5rem;border-radius:30px}.first-login-section .inner .setting-container .container-conts .terms-container .check-inputs{width:50%;margin:2rem auto;font-family:"nanum"}.first-login-section .inner .setting-container .container-conts .terms-container .term-box span{display:flex;padding-left:1.6rem}.first-login-section .inner .setting-container .container-conts .terms-container input[type=checkbox]{display:none}.first-login-section .inner .setting-container .container-conts .terms-container input[type=checkbox]+label{display:flex;width:20px;height:20px;border:1.6px solid #707070;position:relative}.first-login-section .inner .setting-container .container-conts .terms-container input[type=checkbox]:checked+label::after{content:"✔";font-size:16px;width:20px;height:20px;text-align:center;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}.first-login-section .inner .setting-container .container-conts .terms-container .term-detail{font-size:14px;font-weight:700;color:var(--bs-blue-primary);border-bottom:1px solid var(--bs-blue-primary);padding-bottom:.1rem;cursor:pointer;font-weight:900}.first-login-section .inner .setting-container .container-conts .terms-container .term-total-box{border:var(--is-border);border-radius:4px;padding:1rem;line-height:1.5;color:#5f5f5f;height:200px;overflow-y:scroll;font-family:"nanum"}.first-login-section .inner .setting-container .container-conts h3{text-align:center;margin:1rem 0;font-size:2rem;font-weight:bold}.first-login-section .inner .setting-container .container-conts .desc{text-align:center;margin:1rem 0}.first-login-section .inner .setting-container .container-conts form .input{display:flex;align-items:center;border-bottom:var(--is-border);padding:1.5rem 1rem}.first-login-section .inner .setting-container .container-conts form .input:last-child{border-bottom:none}.first-login-section .inner .setting-container .container-conts form .input .error-message{font-size:14px;margin-top:.5rem;margin-left:.5rem;color:red}.first-login-section .inner .setting-container .container-conts form .input .label{width:15%}.first-login-section .inner .setting-container .container-conts form .input input{flex:1 1;border:var(--is-border);height:46px;border-radius:4px;padding:0 1rem;font-family:"Maple"}.first-login-section .inner .setting-container .container-conts form .input input.school-read{background-color:#ddd;color:gray}.first-login-section .inner .setting-container .container-conts form .input .login-code-button{font-family:"Maple";border:none;padding:.8rem;border-radius:4px;margin-left:1rem;cursor:pointer;transition-duration:.3s}.first-login-section .inner .setting-container .container-conts form .input .login-code-button.active{background-color:#4aa9f9;color:var(--bs-white);font-weight:bold}.first-login-section .inner .setting-container .container-conts form .input .login-code-button.active:hover{background-color:#2b92e6}.first-login-section .inner .setting-container .container-conts form .submit-btn{background:none;border:none;width:150px;margin:1rem auto .8rem;display:flex;cursor:pointer}
.terms-section .terms-header{display:flex;align-items:center;justify-content:space-between;padding:20px;background-color:#484848}.terms-section .terms-header h1{font-size:28px;color:var(--bs-white);font-weight:900;font-family:"nanum"}.terms-section .terms-header .close-btn{background-color:#333;border:1px solid #000;color:var(--bs-white);padding:9px 10px;font-size:14px;font-weight:900;font-family:"nanum";cursor:pointer}.terms-section .inner{padding:2rem 0}.terms-section .inner .contents-all{font-family:"nanum";line-height:1.8}.terms-section .inner .contents-all .first-title{font-weight:900;font-size:1.5rem}.terms-section .inner .contents-all .section-title{font-weight:900;font-size:1.15rem;margin-top:2rem;padding-top:2rem}.terms-section .inner hr{border:.5px solid #ddd}.terms-section .inner .indented-item{padding-left:20px}.terms-section .inner .indented-item.level-1{padding-left:20px}.terms-section .inner .indented-item.level-2{padding-left:40px}.terms-section .inner .indented-item.level-3{padding-left:60px}.terms-section .close-cover{display:flex;justify-content:center;margin:2rem 0 4rem}.terms-section .close-cover button{padding:10px 20px;background-color:#333;font-family:"nanum";font-size:14px;border:1px solid #000;color:var(--bs-white);cursor:pointer}
.right-contents.payment{font-family:"Maple" !important}.right-contents.payment .arrow-container{display:flex;align-items:center;justify-content:space-between;width:90%;margin:0 auto;padding:1rem 0}.right-contents.payment .arrow-container .logo{width:140px;cursor:pointer}.right-contents.payment .arrow-container figure{cursor:pointer;width:64px}.right-contents.payment .inner .success-message{display:flex;flex-direction:column;align-items:center;justify-content:center;height:80vh}.right-contents.payment .inner .success-message .big-tit{color:#898d95;font-size:.8rem;font-weight:900}.right-contents.payment .inner .success-message .small-tit{color:#426eec;font-size:2rem;font-weight:bold;margin-top:.5rem}.right-contents.payment .inner .success-message .small-tit.fail{color:#f44336}.right-contents.payment .inner .success-message .figure{width:16%;margin:1rem 0}.right-contents.payment .inner .success-message .desc-text{color:#898d95;font-size:1.25rem}.right-contents.payment .inner .success-message .success-detail{padding:1.25rem;border:1px solid #ddd;border-radius:.5rem;overflow:hidden;box-shadow:0px 2px 4px 0px rgba(0,0,0,.08);width:35%;margin-top:2rem}.right-contents.payment .inner .success-message .success-detail p{display:flex;align-items:center;justify-content:space-between;margin:1rem 0}.right-contents.payment .inner .success-message .success-detail p span.left-tit{color:#898d95}.right-contents.payment .inner .success-message .success-detail p span.right-tit{color:#426eec;font-weight:700}.right-contents.payment .inner .success-message .button-container{margin-top:1.5rem;display:flex;align-items:center;gap:10px}.right-contents.payment .inner .success-message .button-container button{border:none;color:var(--bs-white);font-weight:700;padding:1rem 2rem;cursor:pointer;border-radius:.25rem}.right-contents.payment .inner .success-message .button-container button.writing{background-color:#fac41d}.right-contents.payment .inner .success-message .button-container button.drawing{background-color:#66bf30}.right-contents.payment .inner .fail-message{display:flex;flex-direction:column;align-items:center;gap:1rem;margin-top:40px}.right-contents.payment .inner .fail-message .big-tit{color:#898d95;font-size:.8rem;font-weight:900}.right-contents.payment .inner .fail-message .small-tit{color:#f44336;font-size:2rem;font-weight:bold;margin-top:.5rem}.right-contents.payment .inner .fail-message figure{width:18%;margin:0 auto}.right-contents.payment .inner .fail-message .desc-text{color:#898d95;font-size:1.25rem}.right-contents.payment .inner .fail-message .fail-detail{padding:1.25rem;border:1px solid #ddd;border-radius:.5rem;overflow:hidden;box-shadow:0px 2px 4px 0px rgba(0,0,0,.08);width:55%;margin-top:2rem}.right-contents.payment .inner .fail-message .fail-detail p{display:flex;align-items:center;justify-content:space-between}.right-contents.payment .inner .fail-message .fail-detail p:nth-child(2){margin:1rem 0}.right-contents.payment .inner .fail-message .fail-detail p span.left-tit{color:#898d95}.right-contents.payment .inner .fail-message .fail-detail p span.right-tit{color:#f44336;font-weight:700}.right-contents.payment .inner .fail-message .recharge-btn{background-color:#66bf30;border:none;color:var(--bs-white);font-weight:700;padding:1rem 2rem;cursor:pointer;border-radius:.25rem}
.right-contents{min-height:100vh}.right-contents .charge-container{display:flex;align-items:center;flex-direction:column;justify-content:center;font-family:"nanum";margin-top:56px;width:100%}.right-contents .charge-container .title-container{margin-bottom:2rem}.right-contents .charge-container .title-container h2{color:#242424;text-align:center;font-size:28px;font-weight:700;list-style:42px;margin-bottom:12px}.right-contents .charge-container .title-container p{color:#969696;font-size:1rem;font-weight:400}.right-contents .charge-container .bean-container{width:70%;flex:0 0 50%}.right-contents .charge-container .bean-container .remain-bean-box{min-height:1rem;background-color:var(--bs-white);padding:24px;line-height:1.4rem;border-radius:8px;border:1px solid #e0e0e0;display:flex;align-items:center;justify-content:space-between}.right-contents .charge-container .bean-container .remain-bean-box .box-left{font-size:28px;line-height:40px}.right-contents .charge-container .bean-container .remain-bean-box .box-right{font-size:28px;font-weight:700;line-height:40px}.right-contents .charge-container .bean-container .bean-notice{margin:12px 0 24px;padding:24px;border-radius:10px;background-color:#f9f9f9;list-style-type:disc}.right-contents .charge-container .bean-container .bean-notice li{color:#969696;font-size:14px}.right-contents .charge-container .bean-container .charge-list{display:flex;flex-direction:column}.right-contents .charge-container .bean-container .charge-list .charge-item{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid #c2c2c2;line-height:40px}.right-contents .charge-container .bean-container .charge-list .charge-item .item-right button{min-width:104px;color:var(--bs-blue-primary);background-color:var(--bs-white);border-color:var(--bs-blue-primary);border:1px solid var(--bs-blue-primary);cursor:pointer;height:44px;padding:0 14px;font-size:16px;border-radius:.25rem}.right-contents .charge-container .bean-container .charge-list .charge-item .item-right button:hover{background-color:var(--bs-blue-primary);color:var(--bs-white)}.right-contents .charge-container .bean-container .charge-list .charge-item .item-right button.selected{background-color:var(--bs-blue-primary);color:var(--bs-white)}.right-contents .charge-container .bean-container .charge-list .charge-item .item-left{display:flex;align-items:center;gap:.8rem}.right-contents .charge-container .bean-container .charge-list .charge-item .item-left .charge-amont.origin{text-decoration:line-through;color:#969696}.right-contents .charge-container .bean-container .charge-list .charge-item .item-left .charge-amont.promotion{font-weight:900;color:#f77043;font-size:1.25rem}.right-contents .charge-container .bean-container .button-next{line-height:46px;margin-top:1.5rem;width:100%;font-family:"nanum";border-radius:.25rem;color:#969696;background-color:#e0e0e0;border:none;transition-duration:.3s}.right-contents .charge-container .bean-container .button-next:not(:disabled){background-color:var(--bs-blue-primary);color:var(--bs-white);font-weight:bold}.right-contents .divider{width:100%;border:.8px solid #ddd;margin-top:4rem}.right-contents .table-container{margin-top:4rem;width:100%}.right-contents .table-container p{font-family:"nanum";text-align:center;margin-bottom:1.5rem}.right-contents .table-container table{width:100%;border-collapse:collapse;margin:20px 0;font-size:1em;font-family:"nanum"}.right-contents .table-container table thead th{background-color:#dceaf7;color:#fff;padding:20px;text-align:left;border:1px solid #d6d6d6;text-align:center;color:#000;font-weight:bold}.right-contents .table-container table tbody td{border:1px solid #dee2e6;padding:20px;vertical-align:middle}.right-contents .table-container table body tr:hover{background-color:#f1f1f1}.right-contents .table-container table th,.right-contents .table-container table td{text-align:center}.right-contents .table-container table .rowspan{font-weight:bold}
.right-contents{min-height:100vh}.right-contents .charge-container{display:flex;align-items:center;flex-direction:column;justify-content:center;font-family:"nanum";padding:56px 0 70px;margin-top:0;width:100%}.right-contents .charge-container .title-container{margin-bottom:3rem}.right-contents .charge-container .title-container h2{color:#242424;text-align:center;font-size:28px;font-weight:700;list-style:42px;margin-bottom:12px}.right-contents .charge-container .title-container p{color:#969696;font-size:1rem;font-weight:400}.right-contents .charge-container .reminder-container{width:70%}.right-contents .charge-container .reminder-container .reminder-box{min-height:1rem;background-color:var(--bs-white);padding:24px;line-height:1.4rem;border-radius:8px;border:1px solid #e0e0e0}.right-contents .charge-container .reminder-container .reminder-box .reminder-top{display:flex;align-items:center;justify-content:space-between;line-height:40px}.right-contents .charge-container .reminder-container .reminder-box .reminder-top .top-left{font-size:28px}.right-contents .charge-container .reminder-container .reminder-box .reminder-top .top-right{font-size:28px;font-weight:900;color:var(--bs-blue-primary)}.right-contents .charge-container .reminder-container .reminder-box .reminder-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:16px;gap:10px}.right-contents .charge-container .reminder-container .reminder-box .reminder-bottom .bottom-left{display:flex;align-items:center;justify-content:space-between;flex:1 1;line-height:40px;gap:10px}.right-contents .charge-container .reminder-container .reminder-box .reminder-bottom .bottom-left .charge-beans-txt{flex-shrink:0}.right-contents .charge-container .reminder-container .reminder-box .reminder-bottom .bottom-left .final-line{height:1px;background-color:#bdbdbd;width:100%}.right-contents .charge-container .reminder-container .payment-choice-container{border:1px solid #e0e0e0;border-radius:12px;margin-top:1.5rem;overflow:hidden}.right-contents .charge-container .reminder-container .payment-choice-container .payment-option{padding:20px 24px;display:flex;align-items:center}.right-contents .charge-container .reminder-container .payment-choice-container .payment-option figure{width:52px;margin:0 .3rem}.right-contents .charge-container .reminder-container .payment-choice-container .payment-option input[type=checkbox]{display:none}.right-contents .charge-container .reminder-container .payment-choice-container .payment-option .custom-checkbox{display:flex;align-items:center;cursor:pointer;position:relative;padding-left:10px;font-size:16px}.right-contents .charge-container .reminder-container .payment-choice-container .payment-option .custom-checkbox::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:20px;height:20px;border-radius:50%;border:1px solid #bdbdbd;background-color:rgba(0,0,0,0);transition:background-color .3s ease,border-color .3s ease;display:none}.right-contents .charge-container .reminder-container .payment-choice-container .payment-option input[type=checkbox]:checked+.custom-checkbox::before{background-color:#fff;border:1px solid #bdbdbd}.right-contents .charge-container .reminder-container .payment-choice-container .payment-option .custom-checkbox::after{content:"";position:absolute;left:5px;top:50%;transform:translateY(-50%) scale(0);width:10px;height:10px;border-radius:50%;background-color:var(--bs-blue-primary);transition:transform .3s ease}.right-contents .charge-container .reminder-container .payment-choice-container .payment-option input[type=checkbox]:checked+.custom-checkbox::after{transform:translateY(-50%) scale(1)}.right-contents .charge-container .reminder-container .policy-check-form{margin:1rem 0;padding:.5rem 0}.right-contents .charge-container .reminder-container .policy-check-form label{cursor:pointer}.right-contents .charge-container .reminder-container .policy-check-form .terms-container{display:flex;align-items:center;justify-content:space-between;margin:.5rem 0}.right-contents .charge-container .reminder-container .policy-check-form .terms-container .term-detail{font-size:14px;font-weight:700;color:var(--bs-blue-primary);border-bottom:1px solid var(--bs-blue-primary);padding-bottom:.1rem;cursor:pointer}.right-contents .charge-container .reminder-container .check-inputs{width:100%}.right-contents .charge-container .reminder-container .check-inputs.policy{width:auto}.right-contents .charge-container .reminder-container .check-inputs input[type=checkbox]{display:none}.right-contents .charge-container .reminder-container .check-inputs input[type=checkbox]+label{border:1.6px solid #707070;display:flex;height:20px;position:relative;width:20px}.right-contents .charge-container .reminder-container .check-inputs input[type=checkbox]:checked+label:after{content:"✔";font-size:1rem;height:20px;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:20px;text-align:center}.right-contents .charge-container .reminder-container .check-inputs .term-box{width:auto;height:auto;display:block}.right-contents .charge-container .reminder-container .check-inputs .term-box.policy span{display:flex;padding-left:.4rem}.right-contents .charge-container .reminder-container .check-inputs .term-box span{display:flex;padding-left:1.6rem}.right-contents .charge-container .reminder-container .policy-box{background-color:#f9f9f9;width:100%;padding:16px 32px;border-radius:8px;margin-bottom:12px;display:none}.right-contents .charge-container .reminder-container .policy-box ul{list-style-type:disc}.right-contents .charge-container .reminder-container .policy-box ul li{font-size:14px;font-weight:400;line-height:20px;color:#969696}.right-contents .charge-container .reminder-container .term-total-box{border:var(--is-border);border-radius:4px;padding:1rem;line-height:1.5;color:#5f5f5f;height:200px;overflow-y:scroll}.right-contents .charge-container .reminder-container .button-container{display:flex;align-items:center;gap:20px}.right-contents .charge-container .reminder-container .button-container button{padding:12px 24px;font-size:14px;line-height:23px;border-radius:888889000px;border:none;cursor:pointer;font-family:"nanum"}.right-contents .charge-container .reminder-container .button-container button.before-btn{border:1px solid var(--bs-blue-primary);background:none;color:var(--bs-blue-primary)}.right-contents .charge-container .reminder-container .button-container button.charge-btn{flex:1 1;transition-duration:.3s}.right-contents .charge-container .reminder-container .button-container button.charge-btn:not(:disabled){background-color:var(--bs-blue-primary);color:var(--bs-white);font-weight:bold}@media(max-width: 768px){.right-contents .charge-container .bean-container{width:100%}.right-contents .charge-container .bean-container .remain-bean-box .box-left{font-size:20px}.right-contents .charge-container .bean-container .remain-bean-box .box-right{font-size:22px}.right-contents .charge-container .reminder-container{width:100%}.right-contents .charge-container .reminder-container .reminder-box .reminder-top .top-left{font-size:20px}.right-contents .charge-container .reminder-container .reminder-box .reminder-top .top-right{font-size:22px}}
.wrapper{min-height:100vh;width:100%;position:relative;background:url(/static/media/training.6785a906e3ef0aa63ebf.svg) no-repeat bottom/cover}.wrapper.writing-background{background:url(/static/media/writing-winter-bg.93b93bae11b92d6d54f8.svg) no-repeat bottom/cover}.wrapper.drawing-background{background:url(/static/media/drawing-winter-bg.23f1aa0b2a46a85007a6.svg) no-repeat bottom/cover}.wrapper.shortform-background{background:url(/static/media/shortform-winter-bg.2d279a7aebe1d17666d9.svg) no-repeat bottom/cover}.wrapper.music-background{background:url(/static/media/music-winter-bg.f43524ab30fff10c0fe2.svg) no-repeat bottom/cover}.wrapper.play-background{background:url(/static/media/playground-bg.220fe1191ef51def4b67.svg) no-repeat bottom/cover}.wrapper.play-topic-selection-background{background:url(/static/media/amusement-bg.e588ad5890c5c18a3518.svg) no-repeat bottom/cover}.wrapper.play-riddle-background{background:url(/static/media/riddle-bg-2.a509e8d73a2335fbab21.svg) no-repeat center/cover;overflow:hidden}.wrapper.play-riddle-background .inner{max-width:none;width:90%}.wrapper.play-ox-background{background:url(/static/media/ox-bg.ea5e435a6eadfc8dd8b0.svg) no-repeat center/cover;overflow:hidden}.wrapper.prompt_edu-background{background:url(/static/media/prompt_edu-winter-bg.940a7e1adc5626f8e5d2.svg) no-repeat bottom/cover}.wrapper .shortform-airplane{position:absolute;top:3%;left:0;width:19%}.wrapper .shortform-airplane-winter{position:absolute;top:0%;left:-100px;width:30vw}.wrapper .shortform-airplane-winter canvas{width:100% !important;height:auto !important}.wrapper .drawing-girl{position:absolute;bottom:100px;width:19%;left:-40px}.wrapper .drawing-girl-winter{position:absolute;width:35vw;bottom:100px;left:-160px}.wrapper .drawing-girl-winter canvas{width:100% !important;height:auto !important}.wrapper .music-nikki{position:absolute;bottom:100px;width:19%;left:0px}.wrapper .music-nikki-winter{position:absolute;bottom:100px;width:40vw;left:-250px}.wrapper .music-nikki-winter canvas{width:100% !important;height:auto !important}.wrapper .writing-nikki{position:absolute;bottom:100px;width:19%}.wrapper .writing-nikki-winter{position:absolute;bottom:100px;left:-150px;width:35vw}.wrapper .writing-nikki-winter canvas{width:100% !important;height:auto !important}.wrapper .inner{max-width:70%;height:100vh;display:flex;flex-direction:column;align-items:center;padding:6rem 0;position:relative}.wrapper .inner .swiper-3d .swiper-slide-shadow-left{opacity:0 !important}.wrapper .inner .swiper-3d .swiper-slide-shadow-right{opacity:0 !important}.wrapper .inner .hub-title{font-size:2.4rem;font-family:"Maple"}.wrapper .inner .category-map{margin:2rem 0 2rem;display:flex;gap:1rem}.wrapper .inner .category-map .category-btn{border:2px solid #afafaf;border-radius:3rem;padding:.8rem 2rem;font-family:"Maple";color:#484848;font-size:1.25rem;cursor:pointer;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15)}.wrapper .inner .category-map .category-btn.selected{background-color:#0c9de3;border-color:#0c9de3;color:var(--bs-white);font-weight:bold}.wrapper .inner .square-swiper-wrapper{width:100%;height:calc(100vh - 220px);padding:1rem 0 3rem;z-index:0;position:relative}.wrapper .inner .square-swiper-wrapper .square-slide{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;cursor:pointer}.wrapper .inner .square-swiper-wrapper .square-slide .cover-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;background:#f8f8f8;display:flex;justify-content:center;align-items:center}.wrapper .inner .square-swiper-wrapper .square-slide .cover-placeholder .spinner{border:4px solid rgba(0,0,0,.1);border-top:4px solid #3498db;border-radius:50%;width:30px;height:30px;animation:spin 1s linear infinite}.wrapper .inner .square-swiper-wrapper .square-slide .music-state-btn-container{display:flex;position:absolute;top:20px;left:10px;z-index:990;gap:.5rem}.wrapper .inner .square-swiper-wrapper .square-slide .music-state-btn-container button{background:#fff;border:none;width:80px;height:80px;padding:.7rem;cursor:crosshair;border-radius:50%;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}.wrapper .inner .square-swiper-wrapper .square-slide .music-state-btn-container.music-drawing button{background:none;border:none;border-radius:none;box-shadow:none}.wrapper .inner .square-swiper-wrapper .square-slide .square-image-box{position:relative}.wrapper .inner .square-swiper-wrapper .square-slide .square-image-box figure img{border-radius:8px;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15)}.wrapper .inner .square-swiper-wrapper .square-slide .square-image-box figure .model_badge{position:absolute;top:16px;left:16px;width:62px;box-shadow:none}.wrapper .inner .square-swiper-wrapper .square-slide .badge-container{position:absolute;top:0;left:0;z-index:10;display:flex;align-items:center}.wrapper .inner .square-swiper-wrapper .square-slide .badge-container .badge{width:100px}.wrapper .inner .square-swiper-wrapper .square-slide p{font-family:"Maple";margin-top:2rem;font-size:1.6rem;color:#2b2b2b;width:70%;line-height:1.2;text-align:center}.wrapper .inner .square-swiper-wrapper .square-slide .circle{position:absolute;right:0;bottom:0;z-index:999;display:flex;justify-content:center;align-items:center;width:46px;height:46px;background-color:var(--bs-white);border-radius:50%;cursor:pointer;padding:5px}.wrapper .inner .square-swiper-wrapper .square-slide.circle-shape .music-state-btn-container{left:50%;transform:translateX(-50%)}.wrapper .inner .all-conts-btn{width:80px;height:80px;background-color:var(--bs-white);box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15);padding:1.25rem;border-radius:50%;gap:.2rem;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;position:fixed;right:70px;bottom:3rem;z-index:10}.wrapper .inner .all-conts-btn figure{width:60%}.wrapper .inner .all-conts-btn p{font-family:"Maple"}.wrapper .inner .all-view-btn{width:80px;height:80px;background-color:var(--bs-white);box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15);padding:1.25rem;border-radius:50%;gap:.2rem;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;z-index:10;position:fixed;left:70px;bottom:3rem}.wrapper .inner .all-view-btn figure{width:60%}.wrapper .inner .all-view-btn p{font-family:"Maple"}.swiper-3d .swiper-slide-shadow-right{background-image:none}.swiper-3d .swiper-slide-shadow-left{background-image:none}@media(max-height: 800px){.wrapper .inner{padding:4rem 0}}@media(max-height: 600px){.wrapper .inner{padding:2rem 0}.wrapper .inner .category-map{margin:1rem 0}.wrapper .inner .category-map .category-btn{font-size:1rem;padding:.6rem 1rem}}@media screen and (max-width: 1440px){.wrapper .drawing-girl{position:absolute;top:20px;bottom:auto;bottom:initial;width:16%;left:-40px}.wrapper .music-nikki{position:absolute;top:30px;bottom:auto;bottom:initial;width:19%;left:0px}.wrapper .writing-nikki{position:absolute;top:30px;left:-30px;bottom:auto;bottom:initial;width:15%}.wrapper .inner{max-width:90% !important}.wrapper .inner .hub-title{font-size:1.8rem}.wrapper .inner .square-swiper-wrapper{width:90%}.wrapper .inner .square-swiper-wrapper .square-slide p{font-size:1.2rem;margin-top:1rem}.wrapper .inner .category-map{margin:1rem 0}.wrapper .inner .category-map .category-btn{font-size:1rem;padding:.6rem 1.5rem}}@media screen and (max-width: 1300px){.wrapper.writing-background{background:url(/static/media/writing-winter-bg.93b93bae11b92d6d54f8.svg) no-repeat bottom/cover}.wrapper.drawing-background{background:url(/static/media/drawing-winter-bg.23f1aa0b2a46a85007a6.svg) no-repeat bottom/cover}.wrapper.shortform-background{background:url(/static/media/shortform-winter-bg.2d279a7aebe1d17666d9.svg) no-repeat bottom/cover}.wrapper.music-background{background:url(/static/media/music-winter-bg.f43524ab30fff10c0fe2.svg) no-repeat bottom/cover}}@media screen and (min-width: 1441px)and (max-width: 1540px){.wrapper .inner .square-swiper-wrapper .square-slide p{margin-top:1rem;font-size:1.4rem}.wrapper .inner .all-conts-btn{bottom:2rem}.wrapper .inner .all-view-btn{bottom:2rem}}@media screen and (min-width: 1367px)and (max-width: 1440px){.wrapper .inner .square-swiper-wrapper .square-slide p{margin-top:1rem;font-size:1.25rem}.wrapper .inner .all-conts-btn{bottom:2rem}.wrapper .inner .all-view-btn{bottom:2rem}}@media screen and (min-width: 1023px)and (max-width: 1366px){.wrapper .inner .hub-title{font-size:2rem}.wrapper .inner .square-swiper-wrapper .square-slide p{margin-top:1rem;font-size:1.2rem}.wrapper .inner .square-swiper-wrapper .square-slide .music-state-btn-container button{width:60px;height:60px}.wrapper .inner .all-conts-btn{bottom:2rem}.wrapper .inner .all-view-btn{bottom:2rem}}@media screen and (min-width: 901px)and (max-width: 1022px){.wrapper .inner .category-map{margin:1.25rem 0 0}.wrapper .inner .category-map .category-btn{font-size:1rem;padding:.7rem 1.8rem}.wrapper .inner .hub-title{font-size:1.8rem}.wrapper .inner .square-swiper-wrapper .square-slide p{margin-top:1rem;font-size:1.2rem}.wrapper .inner .square-swiper-wrapper .square-slide .music-state-btn-container button{width:60px;height:60px}.wrapper .inner .all-conts-btn{bottom:2rem}.wrapper .inner .all-view-btn{bottom:2rem}}@media screen and (max-width: 900px){.wrapper .inner .category-map{margin:1.25rem 0 0}.wrapper .inner .category-map .category-btn{font-size:1rem;padding:.7rem 1.8rem}.wrapper .inner .square-swiper-wrapper .square-slide p{margin-top:1rem;font-size:1rem}.wrapper .inner .square-swiper-wrapper .square-slide .music-state-btn-container button{width:60px;height:60px}.wrapper .inner .all-conts-btn{bottom:2rem}.wrapper .inner .all-view-btn{bottom:2rem}}@media screen and (max-height: 700px){.wrapper .inner{height:auto;padding:2rem 0 3rem}.wrapper .inner .hub-title{font-size:2rem}.wrapper .inner .square-swiper-wrapper{height:70vh !important;padding-bottom:1rem}.wrapper .inner .square-swiper-wrapper .square-slide p{font-size:1.2rem;margin-top:1rem}.wrapper .inner .square-swiper-wrapper .square-slide .circle{bottom:50px !important}.wrapper .inner .square-swiper-wrapper .square-image-box{max-width:380px;margin:0 auto}.wrapper .inner .square-swiper-wrapper .square-image-box figure{aspect-ratio:1/1}.wrapper .inner .square-swiper-wrapper .square-image-box img{width:100%;height:100%;object-fit:cover;border-radius:8px}.swiper-pagination{bottom:10px !important}}
/**
 * Swiper 11.1.1
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2024 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: April 9, 2024
 */

/* FONT_START */
@font-face {
  font-family: 'swiper-icons';
  src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA");
  font-weight: 400;
  font-style: normal;
}
/* FONT_END */
:root {
  --swiper-theme-color: #007aff;
  /*
  --swiper-preloader-color: var(--swiper-theme-color);
  --swiper-wrapper-transition-timing-function: initial;
  */
}
:host {
  position: relative;
  display: block;
  margin-left: auto;
  margin-right: auto;
  z-index: 1;
}
.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
  display: block;
}
.swiper-vertical > .swiper-wrapper {
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  transition-timing-function: initial;
  transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
  box-sizing: content-box;
}
.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}
.swiper-horizontal {
  touch-action: pan-y;
}
.swiper-vertical {
  touch-action: pan-x;
}
.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
  display: block;
}
.swiper-slide-invisible-blank {
  visibility: hidden;
}
/* Auto Height */
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
  height: auto;
}
.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}
.swiper-backface-hidden .swiper-slide {
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
/* 3D Effects */
.swiper-3d.swiper-css-mode .swiper-wrapper {
  perspective: 1200px;
}
.swiper-3d .swiper-wrapper {
  transform-style: preserve-3d;
}
.swiper-3d {
  perspective: 1200px;
}
.swiper-3d .swiper-slide,
.swiper-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}
/* CSS Mode */
.swiper-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  /* For Firefox */
  -ms-overflow-style: none;
  /* For Internet Explorer and Edge */
}
.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}
.swiper-css-mode.swiper-horizontal > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}
.swiper-css-mode.swiper-vertical > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper {
  scroll-snap-type: none;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: none;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper::before {
  content: '';
  flex-shrink: 0;
  order: 9999;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: center center;
  scroll-snap-stop: always;
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
  -webkit-margin-start: var(--swiper-centered-offset-before);
          margin-inline-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
  height: 100%;
  min-height: 1px;
  width: var(--swiper-centered-offset-after);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
  -webkit-margin-before: var(--swiper-centered-offset-before);
          margin-block-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper::before {
  width: 100%;
  min-width: 1px;
  height: var(--swiper-centered-offset-after);
}
/* Slide styles start */
/* 3D Shadows */
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-3d .swiper-slide-shadow {
  background: rgba(0, 0, 0, 0.15);
}
.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  transform-origin: 50%;
  box-sizing: border-box;
  border: 4px solid #007aff;
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent;
}
.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader {
  animation: swiper-preloader-spin 1s infinite linear;
}
.swiper-lazy-preloader-white {
  --swiper-preloader-color: #fff;
}
.swiper-lazy-preloader-black {
  --swiper-preloader-color: #000;
}
@keyframes swiper-preloader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* Slide styles end */

:root {
  --swiper-navigation-size: 44px;
  /*
  --swiper-navigation-top-offset: 50%;
  --swiper-navigation-sides-offset: 10px;
  --swiper-navigation-color: var(--swiper-theme-color);
  */
}
.swiper-button-prev,
.swiper-button-next {
  position: absolute;
  top: 50%;
  top: var(--swiper-navigation-top-offset, 50%);
  width: calc(44px / 44 * 27);
  width: calc(var(--swiper-navigation-size) / 44 * 27);
  height: 44px;
  height: var(--swiper-navigation-size);
  margin-top: calc(0px - (44px / 2));
  margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
  z-index: 10;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--swiper-theme-color);
  color: var(--swiper-navigation-color, var(--swiper-theme-color));
}
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}
.swiper-button-prev.swiper-button-hidden,
.swiper-button-next.swiper-button-hidden {
  opacity: 0;
  cursor: auto;
  pointer-events: none;
}
.swiper-navigation-disabled .swiper-button-prev,
.swiper-navigation-disabled .swiper-button-next {
  display: none !important;
}
.swiper-button-prev svg,
.swiper-button-next svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform-origin: center;
}
.swiper-rtl .swiper-button-prev svg,
.swiper-rtl .swiper-button-next svg {
  transform: rotate(180deg);
}
.swiper-button-prev,
.swiper-rtl .swiper-button-next {
  left: 10px;
  left: var(--swiper-navigation-sides-offset, 10px);
  right: auto;
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev {
  right: 10px;
  right: var(--swiper-navigation-sides-offset, 10px);
  left: auto;
}
.swiper-button-lock {
  display: none;
}
/* Navigation font start */
.swiper-button-prev:after,
.swiper-button-next:after {
  font-family: swiper-icons;
  font-size: 44px;
  font-size: var(--swiper-navigation-size);
  text-transform: none !important;
  letter-spacing: 0;
  font-feature-settings: ;
  font-variant: normal;
  font-variant: initial;
  line-height: 1;
}
.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
  content: 'prev';
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev {
  right: 10px;
  right: var(--swiper-navigation-sides-offset, 10px);
  left: auto;
}
.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
  content: 'next';
}
/* Navigation font end */

:root {
  /*
  --swiper-pagination-color: var(--swiper-theme-color);
  --swiper-pagination-left: auto;
  --swiper-pagination-right: 8px;
  --swiper-pagination-bottom: 8px;
  --swiper-pagination-top: auto;
  --swiper-pagination-fraction-color: inherit;
  --swiper-pagination-progressbar-bg-color: rgba(0,0,0,0.25);
  --swiper-pagination-progressbar-size: 4px;
  --swiper-pagination-bullet-size: 8px;
  --swiper-pagination-bullet-width: 8px;
  --swiper-pagination-bullet-height: 8px;
  --swiper-pagination-bullet-border-radius: 50%;
  --swiper-pagination-bullet-inactive-color: #000;
  --swiper-pagination-bullet-inactive-opacity: 0.2;
  --swiper-pagination-bullet-opacity: 1;
  --swiper-pagination-bullet-horizontal-gap: 4px;
  --swiper-pagination-bullet-vertical-gap: 6px;
  */
}
.swiper-pagination {
  position: absolute;
  text-align: center;
  transition: 300ms opacity;
  transform: translate3d(0, 0, 0);
  z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}
.swiper-pagination-disabled > .swiper-pagination,
.swiper-pagination.swiper-pagination-disabled {
  display: none !important;
}
/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal {
  bottom: 8px;
  bottom: var(--swiper-pagination-bottom, 8px);
  top: auto;
  top: var(--swiper-pagination-top, auto);
  left: 0;
  width: 100%;
}
/* Bullets */
.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transform: scale(0.33);
  position: relative;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  transform: scale(0.33);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  transform: scale(0.33);
}
.swiper-pagination-bullet {
  width: 8px;
  width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
  height: 8px;
  height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));
  display: inline-block;
  border-radius: 50%;
  border-radius: var(--swiper-pagination-bullet-border-radius, 50%);
  background: #000;
  background: var(--swiper-pagination-bullet-inactive-color, #000);
  opacity: 0.2;
  opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);
}
button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  -webkit-appearance: none;
          appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}
.swiper-pagination-bullet:only-child {
  display: none !important;
}
.swiper-pagination-bullet-active {
  opacity: 1;
  opacity: var(--swiper-pagination-bullet-opacity, 1);
  background: var(--swiper-theme-color);
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
}
.swiper-vertical > .swiper-pagination-bullets,
.swiper-pagination-vertical.swiper-pagination-bullets {
  right: 8px;
  right: var(--swiper-pagination-right, 8px);
  left: auto;
  left: var(--swiper-pagination-left, auto);
  top: 50%;
  transform: translate3d(0px, -50%, 0);
}
.swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 6px 0;
  margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
  display: block;
}
.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
}
.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  transition: 200ms transform,
        200ms top;
}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 4px;
  margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
}
.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}
.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform,
        200ms left;
}
.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform,
    200ms right;
}
/* Fraction */
.swiper-pagination-fraction {
  color: inherit;
  color: var(--swiper-pagination-fraction-color, inherit);
}
/* Progress */
.swiper-pagination-progressbar {
  background: rgba(0, 0, 0, 0.25);
  background: var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25));
  position: absolute;
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: var(--swiper-theme-color);
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: scale(0);
  transform-origin: left top;
}
.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  transform-origin: right top;
}
.swiper-horizontal > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-horizontal,
.swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite {
  width: 100%;
  height: 4px;
  height: var(--swiper-pagination-progressbar-size, 4px);
  left: 0;
  top: 0;
}
.swiper-vertical > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-vertical,
.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite {
  width: 4px;
  width: var(--swiper-pagination-progressbar-size, 4px);
  height: 100%;
  left: 0;
  top: 0;
}
.swiper-pagination-lock {
  display: none;
}

.in-class{position:absolute;left:50%;top:20px;background-color:#fff8c0;border:1px solid #ffed8e;padding:.8rem;transform:translateX(-50%);text-align:center;border-radius:4px;color:#ee9600;display:flex;align-items:center;gap:.8rem;font-family:"Maple" !important}.in-class em{font-weight:bold;font-size:1.4rem}@media screen and (max-width: 1366px){.in-class{position:absolute;left:50%;top:20px;right:auto;right:initial;background-color:#fff8c0;border:1px solid #ffed8e;padding:.8rem;transform:translateX(-50%);text-align:center;border-radius:4px;color:#ee9600;display:flex;align-items:center;gap:.8rem}.in-class em{font-weight:bold;font-size:1.4rem}}@media screen and (min-width: 901px)and (max-width: 1022px){.in-class{position:absolute;left:50%;top:20px;right:auto;right:initial;background-color:#fff8c0;border:1px solid #ffed8e;padding:.8rem;transform:translateX(-50%);text-align:center;border-radius:4px;color:#ee9600;display:flex;align-items:center;gap:.4rem}.in-class em{font-weight:bold;font-size:1rem}}@media screen and (max-width: 900px){.in-class{position:absolute;left:50%;top:20px;right:auto;right:initial;background-color:#fff8c0;border:1px solid #ffed8e;padding:.8rem;transform:translateX(-50%);text-align:center;border-radius:4px;color:#ee9600;display:flex;align-items:center;gap:.4rem;display:none}.in-class em{font-weight:bold;font-size:1rem}}
.all-view-section{width:100%}.all-view-section.writing-background-color{background:#ffe5e5}.all-view-section.drawing-background-color{background:#e8fde0}.all-view-section.shortform-background-color{background:#fdf6d3}.all-view-section.inventory-background-color{background:#f1e8fd}.all-view-section.music-background-color{background:#f1e8fd}.all-view-section.prompt_edu-background-color{background:#f1e8fd}.all-view-section{position:relative;position:absolute;top:0;left:0;z-index:9999;overflow-y:auto;height:100%}.all-view-section .absolute{position:fixed}.all-view-section .absolute.cloud-1{top:30px;left:10px;width:200px}.all-view-section .absolute.cloud-2{right:30px;top:100px;width:260px}.all-view-section .absolute.dumble-1{bottom:0;left:0}.all-view-section .absolute.dumble-2{bottom:0;right:0}.all-view-section .inner{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:70px 0}.all-view-section .inner .all-view-title-container{position:relative;width:100%;display:flex;align-items:center}.all-view-section .inner .all-view-title-container h2{text-align:center;font-family:"Maple";font-size:2rem;text-align:center;width:100%}.all-view-section .inner .all-view-title-container .fav-arrow-back{position:absolute;right:0;top:-12px;cursor:pointer;width:100px;display:flex;flex-direction:column;align-items:center;justify-content:center}.all-view-section .inner .all-view-title-container .fav-arrow-back::after{content:"뒤로가기";font-family:"Maple";text-align:center;margin-top:.5rem}.all-view-section .inner .search-list-all{width:100%}.all-view-section .inner .search-list-all .search-bar{width:100%;display:flex;justify-content:center;margin-top:4rem;gap:1rem}.all-view-section .inner .search-list-all .search-bar input{width:50%;border:none;font-family:"Maple";padding:1.25rem;border-radius:.5rem;font-size:1rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}.all-view-section .inner .search-list-all .search-bar button{padding:1.25rem 2rem;cursor:pointer;border:none;border-radius:.5rem;font-family:"Maple";font-size:1rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25);background-color:#66bf30;color:var(--bs-white)}.all-view-section .inner .search-list-all .no-results{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:1.5rem;line-height:1.6}.all-view-section .inner .search-list-all .no-results .hints{text-align:center;margin-top:1rem;margin-bottom:1rem;font-size:1.1rem}.all-view-section .inner .search-list-all .no-results .reset-button{border:none;padding:.9rem 1.5rem;font-size:.8rem;background-color:var(--bs-blue-primary);color:var(--bs-white);cursor:pointer;border-radius:.25rem}.all-view-section .inner .all-view-training-container{display:flex;justify-content:space-between;flex-wrap:wrap;row-gap:4rem;padding:5rem 0 0}.all-view-section .inner .all-view-training-container::after{content:"";width:30%;height:0}.all-view-section .inner .all-view-training-container li{width:30%;flex-shrink:0;position:relative}.all-view-section .inner .all-view-training-container li .badge-container{position:absolute;left:0;top:-30px;width:100px}.all-view-section .inner .all-view-training-container li .square-image-box img{box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15);border-radius:8px}.all-view-section .inner .all-view-training-container li .square-image-box .model_badge{position:absolute;top:16px;left:16px;width:62px;box-shadow:none}.all-view-section .inner .all-view-training-container li .fav-title-container{display:flex;align-items:center;justify-content:space-between;margin-top:1rem}.all-view-section .inner .all-view-training-container li .fav-title-container .title{font-family:"Maple";font-size:1.8rem;color:#2b2b2b;width:70%;text-align:left;line-height:1.4}.all-view-section .inner .all-view-training-container li .fav-title-container .circle{display:flex;justify-content:center;align-items:center;width:46px;height:46px;background-color:var(--bs-white);cursor:pointer;padding:5px;border-radius:50%}@media screen and (min-width: 1024px)and (max-width: 1366px){.all-view-section .inner .all-view-training-container li{width:30%}.all-view-section .inner .all-view-training-container li .fav-title-container .title{font-size:1.6rem}}@media screen and (min-width: 920px)and (max-width: 1023px){.all-view-section .inner .all-view-training-container li{width:48%}.all-view-section .inner .all-view-training-container li .fav-title-container .title{font-size:1.6rem}}@media screen and (max-width: 919px){.all-view-section .inner .all-view-training-container li{width:48%}.all-view-section .inner .all-view-training-container li .fav-title-container .title{font-size:1.4rem}}
.favorite-section{width:100%;min-height:100vh;background-color:#fef7e9;position:absolute;top:0;left:0;z-index:999999}.favorite-section .inner{width:100%;height:100%;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:70px 0}.favorite-section .inner .fav-title-container{position:relative;width:100%;display:flex;align-items:center}.favorite-section .inner .fav-title-container h2{text-align:center;font-family:"Maple";font-size:2rem;text-align:center;width:100%}.favorite-section .inner .fav-title-container .fav-arrow-back{position:absolute;right:0;top:-12px;cursor:pointer;width:100px;display:flex;flex-direction:column;align-items:center;justify-content:center}.favorite-section .inner .fav-title-container .fav-arrow-back::after{content:"뒤로가기";font-family:"Maple";text-align:center;margin-top:.5rem}.favorite-section .inner .categories-container{display:flex;margin:2rem 0;gap:1rem}.favorite-section .inner .categories-container .category-btn{border:2px solid #bebebe;padding:1rem;border-radius:3rem;font-family:"Maple";color:#bebebe;font-size:1.25rem;cursor:pointer}.favorite-section .inner .categories-container .category-btn.on{border-color:#0c9de3;background-color:#0c9de3;color:var(--bs-white);font-weight:bold}.favorite-section .inner .fav-txt-container{width:100%;text-align:center;margin:3rem 0;font-family:"Maple"}.favorite-section .inner .fav-txt-container h4{font-size:2.5rem;margin-bottom:1.25rem}.favorite-section .inner .fav-txt-container p{color:#8f8e80;font-size:1.8rem}
.fav-list-all{width:100%;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;column-gap:2rem;row-gap:6rem;font-family:"Maple" !important}.fav-list-all::after{content:"";width:30%}.fav-list-all .fav-list-cont{width:30%;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer}.fav-list-all .fav-list-cont.drawing .fav-image figure{border-radius:2rem}.fav-list-all .fav-list-cont .fav-image figure{border-radius:2rem;overflow:hidden;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15)}.fav-list-all .fav-list-cont .fav-title-container{display:flex;align-items:center;justify-content:space-between;margin-top:1rem}.fav-list-all .fav-list-cont .fav-title-container .fav-text{width:70%;font-size:1.8rem;line-height:1.4}.fav-list-all .fav-list-cont .fav-title-container .fav-heart{width:60px;height:60px;background-color:var(--bs-white);border-radius:50%;cursor:pointer;padding:1rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15)}@media screen and (min-width: 1024px)and (max-width: 1366px){.fav-list-all .fav-list-cont{width:30%}.fav-list-all .fav-list-cont .fav-text{font-size:1.6rem}}@media screen and (min-width: 920px)and (max-width: 1023px){.fav-list-all .fav-list-cont{width:48%}.fav-list-all .fav-list-cont .fav-text{font-size:1.6rem}}@media screen and (max-width: 919px){.fav-list-all .fav-list-cont{width:48%}.fav-list-all .fav-list-cont .fav-text{font-size:1.4rem}}
.play-background .inner{width:90%;height:100vh !important;max-width:none}.play-background .inner .plays{position:absolute;cursor:pointer}.play-background .inner .plays.twen{left:0;width:520px}.play-background .inner .plays.ox{bottom:50px;left:50%;transform:translateX(-50%);width:640px}.play-background .inner .plays.quiz{right:0;width:640px}
.play-topic-selection{padding-top:2rem;font-family:"Maple" !important}.play-topic-selection .topic-title{font-weight:900;text-align:center;margin-bottom:2rem;font-size:2rem}.play-topic-selection .topic-list{display:flex;align-items:center;justify-content:space-between;width:100%}.play-topic-selection .topic-list .topic-list-item{width:30%;min-height:100px;cursor:pointer;box-shadow:0px 2px 4px 0px rgba(0,0,0,.15);border-radius:1.15rem}.play-topic-selection .back-button{padding:10px 20px;background-color:#ff9800;color:#fff;border:none;border-radius:25px;font-size:16px;font-weight:bold;cursor:pointer;transition:background-color .3s ease,transform .2s ease;box-shadow:0 4px 6px rgba(0,0,0,.1);margin:40px auto 0;display:flex}.play-topic-selection .back-button:hover{background-color:#fb8c00;transform:translateY(-2px)}
.ox-quiz-play{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;font-family:"Maple" !important}.ox-quiz-play .testing{position:absolute;right:-280px;bottom:-40px;z-index:999;width:460px}.ox-quiz-play .quiz-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;width:100%;height:100%}.ox-quiz-play .quiz-wrap .hint-btn{border:none;padding:10px 20px;font-family:"Maple";font-size:1.25rem;border-radius:.5rem;cursor:pointer;position:absolute;top:85px;right:30px;background-color:#7ec178;color:var(--bs-white);transition-duration:.3s}.ox-quiz-play .quiz-wrap .hint-btn:hover{background-color:#6caa66}.ox-quiz-play .quiz-wrap .quiz-bg{position:absolute;width:100%}.ox-quiz-play .quiz-wrap.correct{animation:correct-feedback .3s ease}.ox-quiz-play .quiz-wrap.wrong{animation:wrong-feedback .3s ease}.ox-quiz-play .quiz-wrap .quiz-contents{position:absolute}.ox-quiz-play .quiz-wrap .quiz-contents .progress-bar{width:100%;height:8px;background-color:#e0e0e0;border-radius:4px;margin-bottom:3rem;overflow:hidden}.ox-quiz-play .quiz-wrap .quiz-contents .progress-bar .progress{height:100%;background-color:#76c7c0;transition:width .3s ease}.ox-quiz-play .quiz-wrap .quiz-contents .question{margin-bottom:2rem;font-size:3rem;text-align:center;font-weight:900}.ox-quiz-play .quiz-wrap .quiz-contents .answer-buttons{display:flex;align-items:center;justify-content:center;gap:1rem}.ox-quiz-play .quiz-wrap .quiz-contents .answer-buttons .btn{border:none;background-color:var(--bs-white);font-family:"Maple";font-weight:900;font-size:13rem;width:300px;height:300px;cursor:pointer;color:#eae8e9;transition:transform .5s,color .5s}.ox-quiz-play .quiz-wrap .quiz-contents .answer-buttons .btn:hover{transform:scale(1.1)}.ox-quiz-play .quiz-wrap .quiz-contents .answer-buttons .btn:hover.btn-x{color:#fd7e14}.ox-quiz-play .quiz-wrap .quiz-contents .answer-buttons .btn:hover.btn-o{color:#007bff}.ox-quiz-play .quiz-wrap .hint{text-align:center}.ox-quiz-play .quiz-wrap .hint p{font-size:2.2rem;line-height:1.4}.ox-quiz-play .quiz-wrap .hint p:first-child{margin:.6rem 0}@keyframes correct-feedback{0%{background-color:rgba(0,0,0,0)}50%{background-color:rgba(0,255,0,.5)}100%{background-color:rgba(0,0,0,0)}}@keyframes wrong-feedback{0%{background-color:rgba(0,0,0,0)}50%{background-color:rgba(255,0,0,.5)}100%{background-color:rgba(0,0,0,0)}}

.riddle-play.click{width:100%;height:100%;font-family:"Maple" !important;padding-top:2rem;display:flex;flex-direction:column;align-items:center;position:relative}.riddle-play.click .action-buttons{display:flex;align-items:center;justify-content:center;width:100%;margin-top:2rem}.riddle-play.click .action-buttons .check-answer-button{font-weight:bold;font-family:"Maple";cursor:pointer;background-color:#ffd94c;color:#ff7a00;border:none;padding:12px 24px;border-radius:50px;font-size:20px;font-weight:bold;box-shadow:0 4px 6px rgba(0,0,0,.2);display:flex;align-items:center;gap:8px;cursor:pointer;position:relative;outline:none;text-shadow:1px 1px 0px #fff;transition:all .3s ease}.riddle-play.click .action-buttons .check-answer-button:hover{background-color:#ffc93c;transform:translateY(-2px);box-shadow:0 6px 8px rgba(0,0,0,.3)}.riddle-play.click .action-buttons .check-answer-button .arrow{font-size:20px;font-weight:bold}.riddle-play.click .drag-drop-container{display:flex;flex-direction:column-reverse;justify-content:space-between;gap:1.5rem;margin-top:20px;width:90%;margin:0 auto}.riddle-play.click .droppable-section.selected-options{border-radius:150px;padding:10px;min-height:120px;background-color:rgba(0,0,0,0);border:2px dashed #ccc;display:flex;flex-direction:column;align-items:center;justify-content:center}.riddle-play.click .droppable-section.available-options{display:flex;align-items:center;justify-content:space-between}.riddle-play.click .droppable-section h4{text-align:center;margin-bottom:10px}.riddle-play.click .droppable-section h4.drag-title{font-family:"Maple";font-size:2rem;color:var(--bs-white);font-weight:bold;opacity:.7}.riddle-play.click .droppable-section h4.drag-title:hover{color:#deb887}.riddle-play.click .feedback-section{margin-top:20px;text-align:center}.riddle-play.click .feedback-section .feedback{font-size:1.2em;margin-bottom:10px}.riddle-play.click .feedback-section .next-button,.riddle-play.click .feedback-section .retry-button{padding:10px 20px;font-size:1em;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s ease}.riddle-play.click .feedback-section .next-button.next-button,.riddle-play.click .feedback-section .retry-button.next-button{background-color:#4caf50;color:#fff}.riddle-play.click .feedback-section .next-button.next-button:hover,.riddle-play.click .feedback-section .retry-button.next-button:hover{background-color:#45a049}.riddle-play.click .feedback-section .next-button.retry-button,.riddle-play.click .feedback-section .retry-button.retry-button{background-color:#f44336;color:#fff}.riddle-play.click .feedback-section .next-button.retry-button:hover,.riddle-play.click .feedback-section .retry-button.retry-button:hover{background-color:#da190b}.riddle-play.click .feedback-section .next-button.retry-button img,.riddle-play.click .feedback-section .retry-button.retry-button img{width:20px;height:20px;margin-right:5px}.riddle-play.click .feedback-section .next-button.retry-button span,.riddle-play.click .feedback-section .retry-button.retry-button span{vertical-align:middle}.riddle-play.click .dropped-option{padding:10px 20px;background-color:#d1e7dd;border:1px solid #badbcc;border-radius:4px}.riddle-play.click .question-section{width:100%;height:100%;text-align:center;position:relative}.riddle-play.click .question-section .board{position:absolute;width:95%;left:50%;transform:translateX(-50%)}.riddle-play.click .question-section .riddle-conts{height:100%;width:90%;position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;flex-direction:column}.riddle-play.click .question-section .riddle-conts .question-box{border-radius:1rem;padding:2rem;line-height:1.2;font-size:2rem;color:var(--bs-white);display:flex;flex-direction:column;align-items:center;justify-content:center}.riddle-play.click .question-section .riddle-conts .question-box .riddle-text{font-size:5rem;margin-top:1rem}.riddle-play.click .question-section .riddle-conts .question-box p:first-child{margin-bottom:1rem;font-size:1rem;font-weight:900;opacity:.5}.riddle-play.click .question-section .riddle-conts .question-box .show-answer-btn{background-color:#ffd94c;color:#ff7a00;border:none;padding:12px 24px;border-radius:50px;font-size:20px;font-weight:bold;box-shadow:0 4px 6px rgba(0,0,0,.2);display:flex;align-items:center;gap:8px;cursor:pointer;position:relative;outline:none;text-shadow:1px 1px 0px #fff;transition:all .3s ease;font-family:"Maple";margin-top:2rem;cursor:pointer}.riddle-play.click .question-section .riddle-conts .question-box .show-answer-btn:hover{background-color:#ffc93c;transform:translateY(-2px);box-shadow:0 6px 8px rgba(0,0,0,.3)}.riddle-play.click .question-section .riddle-conts .question-box .show-answer-btn .arrow{font-size:20px;font-weight:bold}.riddle-play.click .question-section .riddle-conts .options-container .option-button{background:none;border:none;position:relative;cursor:pointer;transition-duration:.3s}.riddle-play.click .question-section .riddle-conts .options-container .option-button .option-text{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);font-family:"Maple";font-size:3rem}.riddle-play.click .question-section .riddle-conts .options-container .option-button:hover{transform:translateY(-20px)}.riddle-play.click .question-section .riddle-conts .options-list{width:100%;display:flex;flex-wrap:wrap;justify-content:center;gap:1rem}.riddle-play.click .character{position:absolute;left:50%;bottom:-180px;width:45%}.riddle-play.click .feedback-section .feedback{font-size:1.5rem;margin:1rem 0}.riddle-play.click .feedback-section .retry-button{display:flex;align-items:center;font-family:"Maple";border:none;padding:10px 20px;border-radius:.25rem;cursor:pointer;background-color:#66bb6a;gap:.25rem;justify-content:center;margin:0 auto;transition-duration:.2s}.riddle-play.click .feedback-section .retry-button figure{width:30px}.riddle-play.click .feedback-section .retry-button span{color:var(--bs-white);font-weight:900;font-size:1rem}.riddle-play.click .feedback-section .retry-button:hover{background-color:#529856}.riddle-play.click .feedback-section .next-button{display:flex;align-items:center;font-family:"Maple";border:none;padding:10px 20px;border-radius:.25rem;cursor:pointer;background-color:#66bb6a;gap:.25rem;justify-content:center;margin:0 auto;transition-duration:.2s;color:var(--bs-white);font-size:1.25rem;font-weight:900;background-color:#1f3a79}.riddle-play.click .feedback-section .next-button:hover{background-color:#0f224e}.riddle-play.click .prompt-section{position:fixed;top:0;left:0;z-index:999999;background-color:rgba(0,0,0,.5);width:100%;height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2rem}.riddle-play.click .prompt-section figure{width:13%}.riddle-play.click .prompt-section .propmt-title{color:var(--bs-white);font-size:4rem;font-weight:900}.riddle-play.click .prompt-section .countdown{color:var(--bs-white);font-size:3rem;font-weight:900}
.notice-modal{width:100%;height:100vh;position:fixed;top:0;left:0;z-index:99999999999;display:flex;align-items:center;justify-content:center;background-color:rgba(0,0,0,.6)}.notice-modal .modal-container{width:50%}.notice-modal .modal-container .notice-button-container{display:flex;justify-content:flex-end;padding:.5rem;gap:1rem}.notice-modal .modal-container .notice-button-container button{border:none;background:none;font-family:"Maple";font-size:1.25rem;font-weight:900;color:var(--bs-white);cursor:pointer}.notice-modal .modal-container .notice-header{background-color:#484848;color:var(--bs-white);font-size:28px;padding:20px;margin-bottom:15px;display:flex;align-items:center;justify-content:space-between}.notice-modal .modal-container .notice-header button{background-color:#333;border:1px solid #000;padding:7px 10px;font-weight:bold;font-size:14px;color:var(--bs-white);cursor:pointer}.notice-modal .modal-container .notice-header button:hover{background-color:#111}.notice-modal .modal-container .close-cover{display:flex;justify-content:center;padding:25px 0;border-top:1px solid #eee}.notice-modal .modal-container .close-cover .close-btn-bottom{background-color:#333;border:1px solid #000;font-size:14px;color:var(--bs-white);cursor:pointer;padding:10px 20px 6px 20px}.notice-modal .modal-container .close-cover .close-btn-bottom:hover{background-color:#111}@media screen and (max-width: 1440px){.notice-modal .modal-container{width:70%}}
.notice-contents-wrap{width:100%;height:100vh;overflow-y:scroll;background-color:rgba(0,0,0,.5);display:flex;align-items:center;flex-direction:column;justify-content:center;position:fixed;top:0;left:0;z-index:99999}.notice-contents-wrap .notice-button-container{width:50%;display:flex;justify-content:flex-end;padding:.5rem;gap:1rem}.notice-contents-wrap .notice-button-container button{border:none;background:none;font-family:"Maple";font-size:1rem;color:var(--bs-white);cursor:pointer}.notice-contents-wrap .notice-contents{display:flex;flex-direction:column;background-color:#fff;width:50%;height:100vh;margin:0 auto;max-height:calc(100vh - 200px);border-radius:10px;overflow-y:scroll;padding:2rem 0;position:relative}.notice-contents-wrap .notice-contents .notice-char{position:-webkit-sticky;position:sticky;width:160px;bottom:0}.notice-contents-wrap .notice-contents .notice-char.arial{right:0}.notice-contents-wrap .notice-contents .notice-title{font-weight:bold;font-size:2rem;text-align:center;margin-bottom:20px;font-family:"Maple";width:60%;margin:0 auto}.notice-contents-wrap .notice-contents .images-container{display:flex;justify-content:center;flex-direction:column;align-items:center;gap:.5rem}.notice-contents-wrap .notice-contents .images-container figure{width:90%}.notice-contents-wrap .notice-contents .notice-text-container{width:100%;text-align:center;padding:20px 0 0}.notice-contents-wrap .notice-contents .button-flex{width:100%;display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:1rem}.notice-contents-wrap .notice-contents .button-flex .detail-view{font-family:"Maple";font-size:1.25rem;display:inline-flex;justify-content:center;align-items:center;width:40%;color:#623317;font-weight:900;padding:1rem;cursor:pointer;border:none;border-radius:8px;background-color:#f6ce4d;border:4px solid #efa131}.notice-contents-wrap .notice-contents .button-flex .detail-view.blog{background-color:#f1fef2;border:4px solid #52bb5a;color:#52bb5a}.spinner-container{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.spinner{width:40px;height:40px;border:5px solid #f3f3f3;border-top:5px solid #3498db;border-radius:50%;animation:spin 1s linear infinite}@media screen and (max-width: 1440px){.notice-contents-wrap .notice-button-container{width:70%}.notice-contents-wrap .notice-contents{width:70%}}
.loading-spinner{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;text-align:center;font-size:1.2rem;color:#333;font-family:"Maple";font-weight:bold}.loading-spinner .spinner{border:4px solid rgba(0,0,0,.1);border-top:4px solid #3498db;border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin-bottom:10px}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
.training-page-wrap{width:100%;height:100vh}.training-page-wrap.writing-bg{background:url(/static/media/winter-training-bg.b3a53c1b20b25cd087e6.svg) no-repeat bottom/cover}.training-page-wrap.drawing-bg{background:url(/static/media/winter-training-bg.b3a53c1b20b25cd087e6.svg) no-repeat bottom/cover}.training-page-wrap.shortform-bg{background:url(/static/media/winter-training-bg.b3a53c1b20b25cd087e6.svg) no-repeat bottom/cover}.training-page-wrap.shortform-bg-kn{background:url(/static/media/deep-sea.bb32b90283eb6464640b.svg) no-repeat bottom/cover}.training-page-wrap.writing-bg-kn{background:url(/static/media/deep-sea.bb32b90283eb6464640b.svg) no-repeat bottom/cover}.training-page-wrap.ulju-default-bg{background:url(/static/media/petroglyphs-writing.2f7ca3e799fa4dd35f6e.svg) no-repeat bottom/cover}.training-page-wrap .inner{width:85%;height:100%;max-width:none;display:flex;align-items:center}.training-page-wrap .inner .fire{position:fixed}.training-page-wrap .inner .fire.fire-1{bottom:-40px;left:-20px;z-index:99999 !important;width:11vw}.training-page-wrap .inner .fire.fire-2{bottom:-20px;right:-55px;z-index:99999 !important;width:17vw}@media screen and (max-width: 1300px){.training-page-wrap.writing-bg{background:url(/static/media/training-tr-tab.cf81a3cf1a8119cbd7e8.svg) no-repeat bottom/cover}.training-page-wrap.drawing-bg{background:url(/static/media/training-tr-tab.cf81a3cf1a8119cbd7e8.svg) no-repeat bottom/cover}.training-page-wrap.shortform-bg{background:url(/static/media/training-tr-tab.cf81a3cf1a8119cbd7e8.svg) no-repeat bottom/cover}}@media only screen and (max-width: 1200px){.training-page-wrap{width:100%;height:100vh}}
.long-loading{width:100%;min-height:100vh;position:fixed;top:0;left:0;z-index:999999999;background:url(/static/media/winter-loadibg-bg.8544c8b693d51aefac09.svg) no-repeat bottom/cover}.long-loading.ulju{background:url(/static/media/gallery-loading-ulju.f42292611a0e20988cd1.svg) no-repeat bottom/cover}.long-loading .inner{max-width:1400px;display:flex;flex-direction:column;align-items:center;justify-content:center}.long-loading .inner .lighting{position:absolute;left:50%;transform:translateX(-50%);width:10vw}.long-loading .inner .music-play-btn{width:120px;position:absolute;top:70px;left:240px;border:none;background:rgba(0,0,0,0);cursor:pointer;z-index:9}.long-loading .inner .loading-tit{text-align:center;padding-top:11vh;position:relative;z-index:2;font-size:36px;font-family:"Maple"}.long-loading .inner .progress-bar{margin:1rem auto;height:20px;width:80%}.long-loading .inner .selected-kr{text-align:center;font-size:1.5rem;display:flex;align-items:center;justify-content:center;gap:.5rem;font-family:"Maple";width:100%}.long-loading .inner .selected-kr .selected-kr-container{display:flex;align-items:center;gap:.6rem;max-width:60%;overflow-x:scroll;overflow-y:hidden}.long-loading .inner .selected-kr .selected-kr-container em{color:#66bf30;font-weight:bold;font-size:2rem;padding:.3rem .8rem;background-color:var(--bs-white);border-radius:.5rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25);display:flex;flex-shrink:0;margin-bottom:.5rem}.long-loading .inner .clock{position:fixed;top:50px;right:250px;width:100px;animation:swing 2s ease-in-out infinite}.long-loading .inner .clock .count-down{position:absolute;top:55%;left:50%;transform:translateX(-50%);font-size:32px;font-weight:bold;font-family:"Maple"}.long-loading .inner .clock .count-down.red{color:red}.long-loading .inner .clock::before{content:"남은시간";font-size:18px;display:block;margin:.5rem auto;text-align:center;font-family:"Maple"}.long-loading .inner .gallery-list{display:flex;align-items:center;justify-content:space-between;margin-top:2rem;margin-left:auto;margin-right:auto}.long-loading .inner .gallery-list .item{width:30%;border:1px solid #1c2238;padding:1rem;position:relative}.long-loading .inner .gallery-list .item .item-inner{position:relative}.long-loading .inner .gallery-list .item .item-inner figure{width:100%;height:480px;background-color:gray;overflow:hidden}.long-loading .inner .gallery-list .item .item-inner figure img{object-fit:cover;height:100%}.long-loading .inner .gallery-list .item .item-inner .desc{padding:2rem 1rem;width:100%;background-color:hsla(0,0%,100%,.6);position:absolute;bottom:0;text-align:center;display:flex;flex-direction:column;gap:.8rem;font-size:24px;font-family:"Maple"}.long-loading .inner .gallery-list .item .item-inner .desc span.category{font-size:20px}.long-loading .inner .people{position:absolute;bottom:10px}.long-loading .inner .people.people-1{right:620px;display:none}.long-loading .inner .people.people-2{left:10px}.long-loading .inner .people.people-3{right:20px}.long-loading .gallery-bottom{width:100%;height:40px;background-color:#c8c8c9;position:fixed;bottom:0;z-index:-1}@media screen and (max-width: 1300px){.long-loading{background:url(/static/media/deep-sea-loading.ade3419b774691a320ba.svg) no-repeat bottom/cover}}@media screen and (min-width: 1441px)and (max-width: 1540px){.long-loading .inner .selected-kr{margin-bottom:2rem}.long-loading .inner .lighting{width:170px}.long-loading .inner .loading-tit{padding-top:5rem}.long-loading .inner .gallery-list{width:80%;margin:0 auto}.long-loading .inner .music-play-btn{left:150px;top:40px}.long-loading .inner .clock{top:40px;right:130px}.long-loading .inner .gallery-bottom{height:40px}}@media screen and (min-width: 1367px)and (max-width: 1440px){.long-loading .inner .lighting{width:170px}.long-loading .inner .loading-tit{padding-top:5rem}.long-loading .inner .gallery-list{width:80%;margin:0 auto}.long-loading .inner .music-play-btn{left:150px;top:40px}.long-loading .inner .clock{top:40px;right:130px}.long-loading .inner .gallery-bottom{height:40px}}@media screen and (min-width: 1023px)and (max-width: 1366px){.long-loading .gallery-bottom{height:30px}.long-loading .inner .loading-tit{font-size:30px}.long-loading .inner .selected-kr .selected-kr-container em{font-size:1.4rem}.long-loading .inner .music-play-btn{top:40px;left:30px}.long-loading .inner .clock{right:40px;width:90px}.long-loading .inner .clock .count-down{font-size:28px}.long-loading .inner .gallery-list{width:84vw;margin:2rem auto}.long-loading .inner .gallery-list .item .item-inner figure{height:390px}}@media screen and (min-width: 901px)and (max-width: 1022px){.long-loading .gallery-bottom{height:30px}.long-loading .inner .lighting{width:130px}.long-loading .inner .loading-tit{padding-top:3.5rem;font-size:28px}.long-loading .inner .music-play-btn{top:40px;left:30px;width:100px}.long-loading .inner .clock{top:25px;right:35px;width:70px}.long-loading .inner .gallery-list{width:93%;margin:1rem auto}.long-loading .inner .gallery-list .item{padding:.5rem}.long-loading .inner .gallery-list .item .item-inner figure{height:380px}.long-loading .inner .progress-bar{margin:1rem auto}}@media screen and (min-width: 801px)and (max-width: 900px){.long-loading .gallery-bottom{height:30px}.long-loading .inner .lighting{width:260px}.long-loading .inner .loading-tit{padding-top:9.5rem;font-size:28px}.long-loading .inner .music-play-btn{top:40px;left:30px;width:100px}.long-loading .inner .clock{top:25px;right:35px;width:70px}.long-loading .inner .gallery-list{width:95%;margin:1rem auto}.long-loading .inner .gallery-list .item{padding:.5rem}.long-loading .inner .gallery-list .item .item-inner figure{height:370px}.long-loading .inner .progress-bar{margin:1rem auto}}@media screen and (min-width: 768px)and (max-width: 800px){.long-loading .gallery-bottom{height:30px}.long-loading .inner .lighting{width:130px}.long-loading .inner .loading-tit{padding-top:3.5rem;font-size:28px}.long-loading .inner .music-play-btn{top:40px;left:30px;width:100px}.long-loading .inner .clock{top:25px;right:35px;width:70px}.long-loading .inner .gallery-list{width:93%;margin:1rem auto}.long-loading .inner .gallery-list .item{padding:.5rem}.long-loading .inner .gallery-list .item .item-inner figure{height:360px}.long-loading .inner .progress-bar{margin:1rem auto}}@media screen and (max-width: 767px){.long-loading .gallery-bottom{height:30px}.long-loading .inner .lighting{width:130px}.long-loading .inner .loading-tit{padding-top:3.5rem;font-size:28px}.long-loading .inner .music-play-btn{top:40px;left:30px;width:100px}.long-loading .inner .clock{top:25px;right:35px;width:70px}.long-loading .inner .gallery-list{width:93%;margin:1rem auto}.long-loading .inner .gallery-list .item{padding:.5rem}.long-loading .inner .gallery-list .item .item-inner figure{height:340px}.long-loading .inner .progress-bar{margin:1rem auto}}@media(orientation: portrait){.long-loading .inner .lighting{width:310px}.long-loading .inner .loading-tit{padding-top:11rem}.long-loading .inner .progress-bar{width:70%;height:40px;border-radius:3rem;margin:1rem auto}.long-loading .inner .progress-bar .progress{border-radius:3rem}.long-loading .inner .gallery-list li:first-child{width:80%;margin:0 auto}.long-loading .inner .gallery-list li:nth-child(2){display:none}.long-loading .inner .gallery-list li:nth-child(3){display:none}}
.progress-bar{width:30%;height:50px;background-color:#d9d9d9;border-radius:10px;margin:0 auto;overflow:hidden}.progress-bar .progress{height:100%;background-color:#f67891;color:#fff;display:flex;align-items:center;justify-content:center;transition:width .6s;font-weight:bold;border-radius:10px}
.ongoing-section{width:100%;min-height:100vh;background-color:rgba(0,0,0,.5);position:fixed;top:0;left:0;z-index:99999999}.ongoing-section .inner{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.ongoing-section .inner figure{width:32%;margin-bottom:1rem;animation:move .8s infinite alternate}.ongoing-section .inner .txt-container{padding:2rem 4rem;border-radius:4px;background-color:var(--bs-white);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem}.ongoing-section .inner .txt-container p{font-size:2rem;font-family:"Maple";text-align:center;line-height:1.4}.ongoing-section .inner .txt-container button{border:none;font-family:"Maple";padding:1rem 4rem;border-radius:4px;font-size:20px;cursor:pointer;background-color:var(--bs-blue-primary);color:var(--bs-white)}@keyframes move{100%{transform:translateY(-10px)}}
.loading-section{width:100%;min-height:100vh;background-color:rgba(0,0,0,.8);position:fixed;top:0;left:0;z-index:99999}.loading-section .inner{height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem}.loading-section .inner .loading-robot{width:30%;animation:loading-robot 1s infinite alternate}.loading-section .inner .loading-txt{font-size:1.8rem;padding:1rem;background-color:var(--bs-white);border-radius:8px;width:90%;min-height:140px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:"Maple"}@keyframes loading-robot{100%{transform:translateY(10px)}}.arm{animation:arm 1s infinite alternate}.sparkle{animation:sparkle .8s infinite alternate}@keyframes arm{100%{transform:rotate(1.5deg)}}@keyframes sparkle{0%{opacity:.5}50%{opacity:1}100%{opacity:.5}}
.error-modal-section{width:100%;min-height:100vh;background-color:rgba(0,0,0,.7);position:fixed;top:0;left:0;z-index:99999}.error-modal-section .inner{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem}.error-modal-section .inner .sleeping-robot{width:28%}.error-modal-section .inner .error-text-container{width:80%;background-color:var(--bs-white);padding:2rem;border-radius:.5rem;text-align:center;font-family:"Maple"}.error-modal-section .inner .error-text-container .main-txt{font-size:24px;margin-bottom:1rem}.error-modal-section .inner .error-text-container .main-txt .writing-text-result p{font-size:2rem;line-height:1.5}.error-modal-section .inner .error-text-container .btn-container{display:flex;align-items:center;justify-content:center}.error-modal-section .inner .error-text-container .btn-container .close-btn{background-color:var(--bs-blue-primary);color:var(--bs-white);display:inline-flex;cursor:pointer;padding:1.05rem 2rem;font-size:1.25rem;text-align:center;display:flex;align-items:center;justify-content:center;transition-duration:.3s}.error-modal-section .inner .error-text-container .btn-container .close-btn:hover{background-color:var(--bs-blue-hovered)}
.tr-bg-yellow{width:100%;font-family:"Maple" !important}.tr-bg-yellow .inner{width:100%;display:flex;padding:60px 0;flex-direction:column;align-items:center;justify-content:center}.tr-bg-yellow .inner .tr-box-yellow.my-pic{width:100%;background-color:var(--bs-white);border-radius:.5rem;position:relative;height:70%;overflow:hidden;padding:1rem 0}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .guide-txt{font-weight:bold;font-size:2rem;margin-bottom:1rem}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .upload-box{display:flex;flex-direction:column;align-items:center;justify-content:center;width:70%;height:390px;overflow:hidden;background-color:#f5f5f5;padding:5rem 0;border:2px solid #cecece;border-style:dashed;border-radius:4px}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .upload-box p{color:#777;font-size:24px;font-weight:bold}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .upload-box .upload-pic{width:30%}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .upload-box .sub-txt{color:#e00;font-size:1rem}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .upload-pic-btn{border:none;background-color:#f9be06;display:flex;align-items:center;gap:.5rem;padding:.6rem 2rem;border-radius:4px;cursor:pointer}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .upload-pic-btn p{font-size:1.8rem}.tr-bg-yellow .step-btns{display:flex;align-items:center;gap:1rem;color:var(--bs-white);margin-top:1rem;position:fixed;bottom:30px}.tr-bg-yellow .step-btns .button{padding:1.25rem 5rem;font-size:24px;border-radius:.4rem;cursor:pointer}.tr-bg-yellow .step-btns .button.button-prev{background-color:#b0b0b0}.tr-bg-yellow .step-btns .button.button-next{background-color:#66bf30}@media screen and (min-width: 1441px)and (max-width: 1540px){.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .guide-txt{margin-bottom:.5rem}}@media screen and (max-width: 1440px){.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .guide-txt{margin-bottom:.5rem}}@media screen and (max-width: 1439px){.tr-bg-yellow .inner{padding:0}.tr-bg-yellow .inner .tr-box-yellow.my-pic{margin-top:0rem}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .guide-txt{font-size:1.6rem}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .upload-box{height:calc(100vh - 380px)}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .upload-pic-btn figure{width:24px}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .upload-pic-btn p{font-size:1rem}}@media screen and (max-width: 1200px){.tr-bg-yellow .inner{padding:0}.tr-bg-yellow .inner .tr-box-yellow.my-pic{margin-top:0rem}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .guide-txt{font-size:1.2rem}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box figure{width:60px}.tr-bg-yellow .inner .tr-box-yellow.my-pic .upload-box .upload-box p{font-size:1rem}}
.tr-box.start{width:100%;background-color:var(--bs-white);border-radius:.5rem;position:relative;z-index:99999;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1rem;padding:1rem 0;height:70vh;font-family:"Maple" !important}.tr-box.start .guide-txt{text-align:center;font-size:2rem;line-height:1.4}.tr-box.start .guide-txt .training-topic-title{color:#66bf30;font-weight:bold}.tr-box.start .char-btns{width:100%;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:1rem}.tr-box.start .char-btns .btn{transition:.3s;cursor:pointer;overflow:hidden;padding:0;width:47%}.tr-box.start .char-btns .btn.border{border:.8rem solid #66bf30;border-radius:34px}.start-btn{color:var(--bs-white);background-color:#66bf30;padding:1.25rem 5rem;font-size:24px;font-weight:bold;border-radius:.4rem;cursor:pointer;position:fixed;bottom:-300px;left:50%;z-index:99999999;transform:translateX(-50%);transition:bottom .5s ease}.start-btn.active{bottom:30px}@media screen and (max-width: 1500px){.tr-box.start .char-btns{width:90%}.tr-box.start .guide-txt{font-size:1.8rem}}@media screen and (max-width: 1400px){.tr-box.start .char-btns{width:100%}.tr-box.start .guide-txt{font-size:1.6rem}}@media screen and (max-width: 1300px){.tr-box.start .char-btns{width:100%}.tr-box.start .guide-txt{font-size:1.6rem}.start-btn{font-size:20px}}@media screen and (max-width: 1200px){.tr-box.start .char-btns{width:100%}}@media screen and (max-width: 900px){.tr-box.start .char-btns{width:100%}}
.alarm-section{width:100%;min-height:100vh;background:rgba(0,0,0,.5);position:fixed;top:0;left:0;z-index:99999;font-family:"Maple" !important}.alarm-section .inner{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.alarm-section .inner figure{width:65%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.alarm-section .inner .alarm-txt-container{position:absolute;bottom:17%;text-align:center}.alarm-section .inner .alarm-txt-container p{font-size:2.3rem;line-height:1.4}.alarm-section .inner .alarm-txt-container button{margin-top:1.5rem;background-color:#66bf30;border:none;color:var(--bs-white);font-weight:bold;padding:.8rem 2.5rem;font-size:1.5rem;border-radius:4rem;cursor:pointer;transition-duration:.3s}.alarm-section .inner .alarm-txt-container button:hover{background-color:#60b32d}@media screen and (min-width: 1023px)and (max-width: 1366px){.alarm-section .inner .alarm-txt-container{bottom:18%}.alarm-section .inner .alarm-txt-container p{font-size:1.7rem}}@media screen and (min-width: 901px)and (max-width: 1022px){.alarm-section .inner figure{width:60%}.alarm-section .inner .alarm-txt-container{bottom:10%}.alarm-section .inner .alarm-txt-container p{font-size:1.8rem}}@media screen and (max-width: 900px){.alarm-section .inner figure{width:60%}.alarm-section .inner .alarm-txt-container{bottom:10%}.alarm-section .inner .alarm-txt-container p{font-size:1.7rem}}
.box-all{width:100%}.tr-box.guide{width:100%;background-color:var(--bs-white);border-radius:.5rem;position:relative;height:auto;min-height:calc(100vh - 220px);overflow:hidden;display:flex;flex-direction:column;justify-content:center;font-family:"Maple" !important}.tr-box.guide .guide-long-txt{width:60%;position:relative;top:0%;left:40%;transform:translate(-50%, 0%);line-height:2.4;font-size:2rem;padding:1rem;background-color:#eee;border-radius:1rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15);max-height:480px;overflow-y:scroll;height:auto}.tr-box.guide .guide-long-txt::after{content:"";position:absolute;bottom:10px;right:0px;width:10px;height:0;border:40px solid rgba(0,0,0,0);border-top-color:#eee;border-right:0;margin-bottom:-10px;transform:rotate(45deg);display:none}.tr-box.guide .speaking-char{position:absolute;right:50px;bottom:-110px;width:19%}.tr-box.guide .speaking-char.arial{width:22%}.tr-box.guide .speaking-char.ulju{width:24vw}.btn-container{display:flex;align-items:center;gap:1.25rem;position:fixed;bottom:30px;left:50%;transform:translateX(-50%)}.btn-container .button-prev{color:var(--bs-white);background-color:#b0b0b0;padding:1.25rem 5rem;font-size:24px;font-weight:bold;border-radius:.4rem;cursor:pointer}.btn-container .button-next{color:var(--bs-white);background-color:#66bf30;padding:1.25rem 5rem;font-size:24px;font-weight:bold;border-radius:.4rem;cursor:pointer}@media screen and (min-width: 1441px)and (max-width: 1540px){.tr-box.guide{max-height:calc(100vh - 300px)}.tr-box.guide .guide-long-txt{font-size:1.6rem}}@media screen and (min-width: 1367px)and (max-width: 1440px){.tr-box.guide{height:67%}.tr-box.guide .guide-long-txt{font-size:1.6rem}}@media screen and (min-width: 1023px)and (max-width: 1366px){.tr-box.guide{max-height:calc(100vh - 300px);padding:0}.tr-box.guide .guide-long-txt{width:65%;font-size:1.5rem}.tr-box.guide .speaking-char.arial{bottom:-60px}}@media screen and (min-width: 901px)and (max-width: 1022px){.tr-box.guide{max-height:calc(100vh - 300px)}.tr-box.guide .guide-long-txt{font-size:1.4rem}.tr-box.guide .speaking-char.arial{bottom:-60px}}@media screen and (min-width: 901px)and (max-width: 1022px){.btn-container .button-next{font-size:1rem}.btn-container .button-prev{font-size:1rem}.tr-box.guide{max-height:calc(100vh - 300px)}.tr-box.guide .guide-long-txt p{font-size:1rem}.tr-box.guide .speaking-char{bottom:-60px}}@media screen and (max-width: 900px){.btn-container .button-next{font-size:1rem}.btn-container .button-prev{font-size:1rem}.tr-box.guide{max-height:calc(100vh - 300px)}.tr-box.guide .guide-long-txt p{font-size:1rem}.tr-box.guide .speaking-char{bottom:-60px}}
.magic-bean-toss{display:inline-block}.tr-box.selcomplete{width:100%;height:calc(100vh - 220px);overflow-y:scroll;background-color:var(--bs-white);padding:1.5rem 0;border-radius:.5rem;font-family:"Maple" !important}.tr-box.selcomplete .complete-txt{text-align:center;font-size:28px;font-weight:bold}.tr-box.selcomplete .divider{width:90%;height:1px;background-color:#bcbcbc;margin:30px auto}.tr-box.selcomplete .express-bubbles{width:90%;margin:0 auto}.tr-box.selcomplete .express-bubbles .char-says-bubble-conts{display:flex;gap:1.5rem;margin:0 auto 40px}.tr-box.selcomplete .express-bubbles .char-says-bubble-conts .speaking-char-conts{width:10%;flex-shrink:0}.tr-box.selcomplete .express-bubbles .char-says-bubble-conts .guide-long-txt-conts{background-color:#eee;padding:1rem;font-size:2rem;border-radius:1rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15);line-height:2.4}.tr-box.selcomplete .express-bubbles .ai-says-bubble-conts{display:flex;gap:1.5rem;margin-left:auto;width:60%;justify-content:flex-end;align-items:flex-start}.tr-box.selcomplete .express-bubbles .ai-says-bubble-conts figure{width:25%}.tr-box.selcomplete .express-bubbles .ai-says-bubble-conts .guide-long-txt-conts{background-color:#546ffe;color:var(--bs-white);padding:1rem;font-size:2rem;border-radius:1rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15);line-height:2.4}.step-btns{display:flex;align-items:center;gap:1rem;color:var(--bs-white);position:fixed;bottom:30px}.step-btns .button{font-family:"Maple";padding:1.25rem 5rem;font-size:24px;border-radius:.4rem;cursor:pointer}.step-btns .button.button-prev{background-color:#b0b0b0}.step-btns .button.button-next{background-color:#66bf30}@keyframes typing{from{width:0}to{width:100%}}.typing{border-radius:2px solid;animation:typing 2s stesp(30, end),blink-caret .75 step-end infinite}@keyframes blink-caret{from,to{border-color:rgba(0,0,0,0)}50%{border-color:#000}}.prompt-finish-box{padding:.4rem;background-color:var(--bs-white);border-radius:.5rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}@media screen and (min-width: 1441px)and (max-width: 1540px){.tr-box.selcomplete{padding:1rem 0}.tr-box.selcomplete .express-bubbles .char-says-bubble-conts .guide-long-txt-conts{font-size:1.75rem}}@media screen and (min-width: 1367px)and (max-width: 1440px){.tr-box.selcomplete{padding:1rem 0}.tr-box.selcomplete .express-bubbles .char-says-bubble-conts .guide-long-txt-conts{font-size:1.75rem}}@media screen and (min-width: 1023px)and (max-width: 1366px){.tr-box.selcomplete .complete-txt{font-size:20px}.tr-box.selcomplete .express-bubbles .char-says-bubble-conts .guide-long-txt-conts{font-size:1.6rem}.tr-box.selcomplete .express-bubbles .ai-says-bubble-conts figure{width:25%}.tr-box.selcomplete .express-bubbles .ai-says-bubble-conts .guide-long-txt-conts{font-size:1.6rem}.step-btns .button{font-size:1.25rem}}@media screen and (min-width: 901px)and (max-width: 1022px){.tr-box.selcomplete .complete-txt{font-size:18px}.tr-box.selcomplete .express-bubbles .char-says-bubble-conts .guide-long-txt-conts{font-size:1.6rem}.tr-box.selcomplete .express-bubbles .ai-says-bubble-conts figure{width:25%}.tr-box.selcomplete .express-bubbles .ai-says-bubble-conts .guide-long-txt-conts{font-size:1.6rem}.step-btns .button{font-size:1rem}}@media screen and (max-width: 900px){.tr-box.selcomplete .complete-txt{font-size:18px}.tr-box.selcomplete .express-bubbles .char-says-bubble-conts .guide-long-txt-conts{font-size:1.6rem}.tr-box.selcomplete .express-bubbles .ai-says-bubble-conts figure{width:25%}.tr-box.selcomplete .express-bubbles .ai-says-bubble-conts .guide-long-txt-conts{font-size:1.6rem}.step-btns .button{font-size:1rem}}
.tr-box.complete{display:flex;align-items:center;padding:20px;background-color:var(--bs-white);border-radius:.5rem;overflow-y:scroll;width:100%;height:calc(100vh - 220px)}.tr-box.complete .complete-image{min-height:500px;width:100%;overflow:hidden;display:flex;justify-content:center;position:relative}.tr-box.complete .complete-image.generating{width:30%;flex-direction:column}.tr-box.complete .complete-image.generating .waiting-text{font-family:"NPS";text-align:center;font-size:1.6rem;margin-bottom:2rem;line-height:1.4}.tr-box.complete .complete-image .result-image-conts{width:100%}.tr-box.complete .complete-image .big-size-btn{position:absolute;top:0;right:0;box-shadow:0 1.98px 3.959px 0 rgba(0,0,0,.2509803922);background-color:rgba(0,0,0,.2);padding:1rem;display:flex;align-items:center;gap:.5rem;color:var(--bs-white);font-family:"NPS";font-size:1.25rem;cursor:pointer}.tr-box.complete .complete-txt-container{flex:1 1;display:flex;align-items:center;justify-content:center;flex-direction:column}.tr-box.complete .complete-txt-container h3{font-family:"NPS";font-weight:bold;font-size:24px;margin-bottom:1rem}.tr-box.complete .complete-txt-container .divider{width:90%;height:1px;background-color:#bcbcbc;margin:0px auto}.tr-box.complete .complete-txt-container .complete-txt-all{text-align:center;font-family:"NPS";font-size:24px;line-height:1.4;margin:40px 0;width:100%}.tr-box.complete .complete-txt-container .complete-txt-all .keyword-container{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap;max-height:160px;overflow-y:scroll;background-color:#f0f0f0;padding:.5rem;border-radius:.5rem;width:90%;margin:0 auto}.tr-box.complete .complete-txt-container .complete-txt-all .keyword-container span{color:#66bf30;font-weight:bold;font-size:1.8rem;display:flex;align-items:center;justify-content:center;cursor:pointer}.tr-box.complete .complete-txt-container .complete-txt-all .keyword-container span.keyword{padding:.3rem .8rem;background-color:var(--bs-white);border-radius:.5rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25);margin-bottom:1rem;display:inline-flex}.tr-box.complete .complete-txt-container .complete-button-container{width:90%;display:flex;flex-direction:column;justify-content:center;gap:12px}.tr-box.complete .complete-txt-container .complete-button-container .remake-btn-wrap{display:flex;justify-content:space-between}.tr-box.complete .complete-txt-container .complete-button-container .remake-btn-wrap button{border:none;border-radius:4px;padding:1.2rem 0;font-family:"NPS";font-size:24px;cursor:pointer;color:var(--bs-white);background-color:#b0b0b0;display:flex;align-items:center;justify-content:center;gap:.5rem;width:48%}.tr-box.complete .complete-txt-container .complete-button-container .remake-btn-wrap button span{font-size:1.25rem;font-weight:bold}.tr-box.complete .complete-txt-container .complete-button-container .print-experience{display:flex;justify-content:center;align-items:center;font-family:"NPS";gap:.5rem;background-color:#f8ce44;color:#272727;font-size:2rem;border:none;border-radius:4px;padding:1.2rem 0;cursor:pointer}.remake-button{font-family:"NPS";color:var(--bs-white);background-color:#66bf30;padding:1.25rem 5rem;font-size:24px;font-weight:bold;border-radius:.4rem;cursor:pointer}@media screen and (max-width: 1440px){.tr-box.complete{height:calc(100vh - 280px);overflow-y:scroll;overflow-x:hidden}.tr-box.complete .wrapper-box .complete-image{min-height:380px}.tr-box.complete .complete-txt-container .complete-button-container .remake-btn-wrap button figure{width:24px}.tr-box.complete .complete-txt-container .complete-button-container .remake-btn-wrap button span{font-weight:500}.tr-box.complete .complete-txt-container .complete-button-container .print-experience{font-size:1.25rem}.tr-box.complete .complete-txt-container .complete-txt-all{margin:20px 0}.tr-box.complete .complete-txt-container .complete-txt-all .keyword-container span{font-size:1.25rem}.tr-box.complete .complete-txt-container .complete-txt-all .keyword-container span.keyword{margin-bottom:0}}@media screen and (max-width: 1023px){.tr-box.complete .complete-txt-container .complete-txt-all .keyword-container span{font-size:1rem}}
.view-all-modal{width:100%;min-height:100vh;position:fixed;top:0;left:0;z-index:90;background-color:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center}.view-all-modal .inner{height:100%;overflow-y:auto;border-radius:4px;padding:3rem 2rem;text-align:center;position:relative}.view-all-modal .inner .close-modal-btn{background-color:#ffc377;border:none;border-radius:50%;cursor:pointer;display:flex;justify-content:center;align-items:center;margin-left:auto;padding:.8rem;position:absolute;right:20px;top:50px;width:46px;height:46px}.view-all-modal .inner .titles{font-size:2rem;font-weight:700;color:var(--bs-white)}.view-all-modal .inner .slide-container{display:flex;align-items:center;justify-content:center}.view-all-modal .inner .slide-container button{all:unset;cursor:pointer}.view-all-modal .inner .slide-container .all-list{display:flex;justify-content:center;margin:3rem 1rem;gap:1.5rem}.view-all-modal .inner .slide-container .all-list li{width:520px;height:670px;border-radius:4px;overflow:hidden;position:relative}.view-all-modal .inner .slide-container .all-list li.selected{border:10px solid #fec816}.view-all-modal .inner .slide-container .all-list li .paper-text-conts{font-family:"KyoboHandwriting2019";position:absolute;top:50px;left:50%;transform:translateX(-50%);font-size:28px;line-height:1.4;height:420px;width:75%;overflow:auto}.view-all-modal .inner .select-btn{background-color:var(--bs-blue-primary);display:inline-flex;color:var(--bs-white);cursor:pointer;transition-duration:.3s;font-size:24px;padding:1rem 3rem}.view-all-modal .inner .select-btn:hover{background-color:var(--bs-blue-hovered)}@media screen and (max-width: 1440px){.view-all-modal .inner .slide-container .all-list{margin:1rem}.view-all-modal .inner .slide-container .all-list li{width:80%;height:auto}.view-all-modal .inner .slide-container button{width:100px}.view-all-modal .inner .select-btn{width:50%;padding:1.8rem;text-align:center;font-size:32px;justify-content:center}}
.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:99999999;background-color:rgba(0,0,0,.5);display:flex;justify-content:center;align-items:center}.modal-overlay .await-char{position:absolute;top:45%;left:50%;transform:translate(-50%, -50%);width:20%}.modal-overlay .await-char.nikki-class{width:15%}.modal-overlay .modal-content{background-color:#fff;padding:36px 20px;border-radius:8px;text-align:center;box-shadow:0 2px 10px rgba(0,0,0,.1);width:35%;position:relative;top:140px;z-index:10;display:flex;align-items:center;justify-content:center;flex-direction:column}.modal-overlay .modal-content h3{font-family:"Maple";font-size:2rem;margin-bottom:1rem;line-height:1.4}.modal-overlay .modal-content h3 span{color:#66bf30;font-weight:bold}.modal-overlay .modal-content h3 span.blue{color:#3378db}.modal-overlay .modal-content .modal-buttons{margin-top:20px;display:flex}.modal-overlay .modal-content .modal-buttons button{cursor:pointer;display:flex;align-items:center;margin:0 10px;padding:10px 20px;border:none;background-color:#007bff;color:#fff;cursor:pointer;border-radius:4px;font-family:"Maple";font-size:1.6rem;transition-duration:.3s}.modal-overlay .modal-content .modal-buttons button:hover{background-color:#0056b3}.modal-overlay .modal-content .modal-buttons button.change-no{background-color:#c8c8c8}
.survey-wrap{position:fixed;bottom:-30px;left:20px;font-family:"Maple"}.survey-wrap.complete{bottom:-60px}.survey-wrap.complete .star-container{margin-bottom:.6rem}.survey-wrap .close{cursor:pointer;margin-bottom:.5rem}.survey-wrap .star-container{padding:1rem;background-color:var(--bs-white);border-radius:.5rem;box-shadow:0px 4px 4px 0px rgba(0,0,0,.15)}.survey-wrap .star-container p{text-align:center;line-height:1.4;cursor:pointer}.survey-wrap .star-container .stars{display:flex;justify-content:center;margin-top:.5rem}
.tr-box.writing-complete{padding:1rem 0;overflow-y:scroll;background-color:var(--bs-white);border-radius:.5rem;width:100%;height:calc(100vh - 220px);font-family:"Maple" !important}.tr-box.writing-complete .complete-txt-container{text-align:center}.tr-box.writing-complete .complete-txt-container .guide-txt{font-weight:bold;font-size:24px;margin-bottom:1rem}.tr-box.writing-complete .complete-txt-container .divider-line{width:80%;height:1px;background-color:#bcbcbc;margin:0 auto 1.25rem}.tr-box.writing-complete .tes{display:flex;flex-direction:column;align-items:center;width:80%;height:auto;margin:0 auto;padding-bottom:2rem}.tr-box.writing-complete .tes .result-char-bubble{display:flex;gap:1rem;align-items:flex-start;margin-right:auto;width:100%}.tr-box.writing-complete .tes .result-char-bubble figure{width:100px}.tr-box.writing-complete .tes .result-char-bubble .complete-bubble{background-color:#d9d9d9;flex:1 1;border-radius:8px;padding:1rem;font-size:1.8rem;line-height:1.4;position:relative;overflow-x:scroll}.tr-box.writing-complete .tes .result-char-bubble .complete-bubble::after{content:"";position:absolute;top:50%;left:-10px;width:0;height:0;border-style:solid;border-width:10px 10px 10px 0;border-color:rgba(0,0,0,0) #d9d9d9 rgba(0,0,0,0) rgba(0,0,0,0);transform:translateY(-50%)}.tr-box.writing-complete .tes .result-char-bubble .complete-bubble em{background-color:var(--bs-white);padding:.4rem;border-radius:4px;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}.tr-box.writing-complete .tes .result-char-bubble .complete-bubble .keyword-container{display:flex;gap:1rem}.tr-box.writing-complete .tes .result-char-bubble .complete-bubble .keyword-container .keyword{padding:.5rem;background-color:#fff;border-radius:.5rem;cursor:pointer;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:30%;text-align:center;line-height:1.4}.tr-box.writing-complete .tes .ai-answer{display:flex;align-items:flex-end;gap:.5rem;margin:1rem 0;width:100%}.tr-box.writing-complete .tes .ai-answer figure{flex-shrink:0;width:18%}.tr-box.writing-complete .tes .ai-answer .user-reply{flex:1 1;position:relative;background-color:#fdf8e9;border-radius:8px;padding:1rem;font-size:1.8rem;color:var(--text-black);display:flex;justify-content:flex-start;line-height:1.6;box-shadow:-1px 1.98px 3.959px 0px rgba(0,0,0,.25)}.tr-box.writing-complete .tes .ai-answer .user-reply.reply{margin-left:auto}.tr-box.writing-complete .tes .ai-answer .user-reply.loading{padding:2rem}.tr-box.writing-complete .tes .ai-answer .user-reply::after{content:"";position:absolute;top:50%;right:-8px;width:0;height:0;border-style:solid;border-width:10px 0 10px 10px;border-color:rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0) #fdf8e9;transform:translateY(-50%)}.tr-box.writing-complete .tes .regenerate-btn{display:flex;align-items:center;background-color:#ffc73a;border:none;padding:.6rem 1.2rem;border-radius:6px;cursor:pointer;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25);margin:2rem 0}.tr-box.writing-complete .tes .regenerate-btn figure{width:32px}.tr-box.writing-complete .tes .regenerate-btn span{font-size:1.25rem;color:var(--bs-white)}.step-btns{display:flex;align-items:center;gap:1rem;color:var(--bs-white);position:fixed;bottom:30px}.step-btns .button{padding:1.25rem 5rem;font-size:24px;border-radius:.4rem;cursor:pointer;border:none;color:#fff}.step-btns .button.button-prev{background-color:#b0b0b0}.step-btns .button.button-next{background-color:#66bf30}@media screen and (max-width: 1400px){.tr-box.writing-complete .tes .regenerate-btn{margin:2rem 0 1rem}}@media screen and (min-width: 1441px)and (max-width: 1540px){.tr-box.writing-complete{max-height:500px;overflow-y:scroll}.tr-box.writing-complete .tes .result-char-bubble .complete-bubble{font-size:1.6rem;line-height:2}.tr-box.writing-complete .tes .ai-answer .user-reply{font-size:1.6rem}}@media screen and (min-width: 1367px)and (max-width: 1440px){.tr-box.writing-complete{max-height:500px;overflow-y:scroll}.tr-box.writing-complete .tes .result-char-bubble .complete-bubble{font-size:1.6rem}.tr-box.writing-complete .tes .ai-answer .user-reply{font-size:1.6rem}}@media screen and (min-width: 1023px)and (max-width: 1366px){.tr-box.writing-complete{max-height:490px;overflow-y:scroll}.tr-box.writing-complete .tes .result-char-bubble .complete-bubble{font-size:1.6rem}.tr-box.writing-complete .tes .ai-answer .user-reply{font-size:1.6rem}}@media screen and (min-width: 901px)and (max-width: 1022px){.tr-box.writing-complete{max-height:400px;overflow-y:scroll}.tr-box.writing-complete .tes .result-char-bubble .complete-bubble{font-size:1.3rem}.tr-box.writing-complete .tes .ai-answer .user-reply{font-size:1.3rem}.step-btns .button{font-size:1rem}}@media screen and (max-width: 900px){.tr-box.writing-complete{max-height:310px;overflow-y:scroll}.tr-box.writing-complete .tes .result-char-bubble .complete-bubble{font-size:1.3rem}.tr-box.writing-complete .tes .ai-answer .user-reply{font-size:1.3rem}}
.multi-image-loading{width:90%;height:calc(100vh - 220px);font-family:"Maple" !important;background-color:var(--bs-white);display:flex;align-items:center;justify-content:center;flex-direction:column;border-radius:.5rem;position:fixed;top:50%;left:50%;transform:translate(-50%, -50%);z-index:9999}.multi-image-loading p{font-size:1.5rem;text-align:center;margin-top:1rem;line-height:1.4}.tr-box.result-selection{background-color:var(--bs-white);border-radius:.5rem;height:auto;overflow-y:scroll;overflow-x:hidden;padding:10px 0;position:relative;width:100%;height:calc(100vh - 220px);display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:"Maple" !important}.tr-box.result-selection .title-container{text-align:center}.tr-box.result-selection .title-container .multi-com{width:400px}.tr-box.result-selection .few-image-text{font-size:1.25rem;text-align:center;line-height:1.4;margin-top:1rem}.tr-box.result-selection .result-container{display:flex;justify-content:center;flex-wrap:wrap;gap:1rem;margin:1rem 0;height:500px}.tr-box.result-selection .result-container figure{transition-duration:.3s;cursor:pointer;aspect-ratio:1/1}.tr-box.result-selection .result-container figure.selected{border:10px solid #fec816}.tr-box.result-selection .result-container figure.aspect-3-4{aspect-ratio:3/4}.tr-box.result-selection .result-container figure.aspect-16-9{aspect-ratio:16/9}.tr-box.result-selection .result-container figure.aspect-5-5{aspect-ratio:5/5}.tr-box.result-selection .result-container .view-button{position:absolute;top:0;right:0;border:none;background-color:rgba(0,0,0,.5019607843);display:flex;align-items:center;gap:.4rem;padding:1rem;border-radius:.5rem;cursor:pointer}.tr-box.result-selection .result-container .view-button figure.big-white{all:unset;aspect-ratio:unset}.tr-box.result-selection .result-container .view-button span{color:var(--bs-white)}.tr-box.result-selection .result-container.layout-16-9{display:grid;grid-template-columns:repeat(2, 1fr);grid-gap:1rem;gap:1rem;width:60%;margin:0 auto}.tr-box.result-selection .result-container.layout-16-9 figure{width:100%;aspect-ratio:16/9}.tr-box.result-selection .result-container figure{border-radius:.5rem;overflow:hidden;position:relative;width:24%}.tr-box.result-selection .result-container figure img{width:100%;height:100%;object-fit:cover;display:block}.tr-box.result-selection .result-container figure.aspect-5-5{width:23%;aspect-ratio:5/5}.tr-box.result-selection .result-container figure.aspect-16-9{width:100%;aspect-ratio:16/9}.tr-box.result-selection .result-container figure.aspect-3-4{width:23%;aspect-ratio:3/4}.tr-box.result-selection .result-container figure.few-images{width:30%}@media(max-width: 768px){.tr-box.result-selection .result-container figure{width:100%}}@media screen and (max-width: 1200px){.tr-box.result-selection .title-container .multi-com{width:280px}.tr-box.result-selection .result-container .view-button{padding:.7rem;border-radius:.25rem}}
.gallery-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);display:flex;justify-content:center;align-items:center;z-index:99999999;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.gallery-overlay.open{opacity:1;visibility:visible}.gallery-content{position:relative;background:#fff;padding:20px;border-radius:8px;width:90%;max-height:90vh;display:flex;flex-direction:column;align-items:center;overflow:hidden;box-sizing:border-box;transition:transform .3s ease,opacity .3s ease;transform:scale(0.8);opacity:0}.gallery-content.open{transform:scale(1);opacity:1}.gallery-content.aspect-1-1{width:90%}.gallery-content.aspect-16-9{width:90%}.gallery-content.aspect-3-4{width:90%}.gallery-content.aspect-auto{width:90%}.gallery-content .close-button{position:absolute;top:10px;right:15px;z-index:10000000000;background:#fac41d;border:none;font-size:2rem;cursor:pointer;color:#fff;width:60px;height:60px;border-radius:50%;display:flex;justify-content:center;align-items:center}.gallery-content .gallery-image-container{position:relative;width:100%;height:auto;flex:1 1;display:flex;align-items:center;justify-content:center}.gallery-content .gallery-image-container .gallery-image{width:70%;max-width:100%;aspect-ratio:auto}.gallery-content .gallery-image-container.aspect-1-1 .gallery-image{width:40%}.gallery-content .gallery-image-container.aspect-16-9 .gallery-image{width:60%}.gallery-content .gallery-image-container.aspect-3-4 .gallery-image{width:30%}.gallery-content .gallery-image-container .nav-button{position:absolute;top:50%;transform:translateY(-50%);background:hsla(0,0%,100%,.7);border:none;padding:10px;cursor:pointer;border-radius:50%;transition:background .3s ease}.gallery-content .gallery-image-container .nav-button:hover{background:#fff}.gallery-content .gallery-image-container .nav-button figure img{width:100%;height:100%;object-fit:contain}.gallery-content .gallery-image-container .nav-button.left{left:10px}.gallery-content .gallery-image-container .nav-button.right{right:10px}.gallery-content .select-button{margin-top:15px;padding:10px 20px;background:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:1rem;transition:background .3s ease;font-family:"Maple"}.gallery-content .select-button:hover{background:#0056b3}@media(max-width: 768px){.gallery-content .gallery-content{padding:15px;width:95%;max-width:90vw}.gallery-content .gallery-content.aspect-1-1 .gallery-image-container .gallery-image{width:60%}.gallery-content .gallery-content.aspect-16-9 .gallery-image-container .gallery-image{width:70%}.gallery-content .gallery-content.aspect-3-4 .gallery-image-container .gallery-image{width:65%}.gallery-content .nav-button{padding:8px}.gallery-content .nav-button figure{width:20px;height:20px}.gallery-content .select-button{font-size:.9rem;padding:8px 16px}}@media(max-width: 480px){.gallery-content .gallery-content{padding:10px;width:95%;max-width:95vw}.gallery-content .gallery-content.aspect-1-1 .gallery-image-container .gallery-image{width:70%}.gallery-content .gallery-content.aspect-16-9 .gallery-image-container .gallery-image{width:80%}.gallery-content .gallery-content.aspect-3-4 .gallery-image-container .gallery-image{width:75%}.gallery-content .nav-button{padding:6px}.gallery-content .nav-button figure{width:18px;height:18px}.gallery-content .select-button{font-size:.8rem;padding:6px 12px}}
.modal-overlay.shortform{position:fixed;top:0;left:0;width:100%;height:100%;z-index:99999999;background-color:rgba(0,0,0,.5);display:flex;justify-content:center;align-items:center}.modal-overlay.shortform .await-char{position:absolute;top:45%;left:50%;transform:translate(-50%, -50%);width:20%}.modal-overlay.shortform .await-char.nikki-class{width:15%}.modal-overlay.shortform .modal-content{background-color:#fff;padding:36px 20px;border-radius:8px;text-align:center;box-shadow:0 2px 10px rgba(0,0,0,.1);width:65%;position:relative;top:0;z-index:10;display:flex;align-items:center;justify-content:center;flex-direction:column;overflow:hidden}.modal-overlay.shortform .modal-content .modal-title{font-size:1.5rem;font-family:"Maple";margin-bottom:1rem}.modal-overlay.shortform .modal-content .content-container{display:flex;align-items:center;justify-content:space-between}.modal-overlay.shortform .modal-content .content-container .container-left{width:43%}.modal-overlay.shortform .modal-content .content-container .container-left .selected-image{width:70%}.modal-overlay.shortform .modal-content .content-container .container-right{flex:1 1;display:flex;flex-direction:column;text-align:left;font-family:"Maple"}.modal-overlay.shortform .modal-content .content-container .container-right .confirm-title{font-size:2rem}.modal-overlay.shortform .modal-content .content-container .container-right .shortform-desc{font-size:1.25rem;margin-top:1rem;color:#5f5f5f}.modal-overlay.shortform .modal-content .modal-buttons{margin-top:4rem;display:flex}.modal-overlay.shortform .modal-content .modal-buttons button{cursor:pointer;display:flex;align-items:center;margin:0 10px;padding:10px 30px;border:none;background-color:#007bff;color:#fff;cursor:pointer;border-radius:4px;font-family:"Maple";font-size:1.4rem;transition-duration:.3s}.modal-overlay.shortform .modal-content .modal-buttons button:hover{background-color:#0056b3}.modal-overlay.shortform .modal-content .modal-buttons button.change-no{background-color:#c8c8c8}.modal-overlay.shortform .modal-content .modal-buttons button.cancel-button{background-color:#dc3545;color:#fff}.modal-overlay.shortform .modal-content .modal-buttons button.cancel-button:hover{background-color:#c82333}.modal-overlay.shortform .modal-content .modal-buttons button.confirm-button{background-color:#28a745;color:#fff}.modal-overlay.shortform .modal-content .modal-buttons button.confirm-button:hover{background-color:#218838}.modal-overlay.shortform .happy{width:260px;position:absolute;bottom:-90px;right:20px}@media screen and (max-width: 1440px){.modal-overlay.shortform .happy{display:none}}@media screen and (max-width: 1200px){.modal-overlay.shortform .happy{display:none}.modal-overlay.shortform .modal-content{width:75%}.modal-overlay.shortform .modal-content .content-container .container-left .selected-image{width:100%}.modal-overlay.shortform .modal-content .content-container .container-right{text-align:center}.modal-overlay.shortform .modal-content .content-container .container-right .confirm-title{font-size:1.5rem;line-height:1.4}.modal-overlay.shortform .modal-content .modal-buttons{justify-content:center;width:100%;margin-top:2rem}}
.tr-box.drawing-talking{width:100%;max-height:calc(100vh - 220px);overflow-y:scroll;background-color:var(--bs-white);padding:1rem 0;border-radius:.5rem;font-family:"Maple" !important}.tr-box.drawing-talking .complete-txt-container{text-align:center}.tr-box.drawing-talking .complete-txt-container p{font-size:2rem;margin-bottom:1rem}.tr-box.drawing-talking .complete-txt-container .divider-line{width:80%;height:1px;background-color:#bcbcbc;margin:0 auto 1.25rem}.tr-box.drawing-talking .bubble-area{display:flex;flex-direction:column;align-items:center;width:80%;margin:0 auto;gap:.5rem}.tr-box.drawing-talking .bubble-area .result-char-bubble{display:flex;gap:1rem;align-items:flex-start;margin-right:auto}.tr-box.drawing-talking .bubble-area .result-char-bubble figure{width:80px}.tr-box.drawing-talking .bubble-area .result-char-bubble .complete-bubble{background-color:#fff;flex:1 1;border-radius:8px;padding:1rem;font-size:1.6rem;position:relative;line-height:1.6;border:2px solid #a1beed}.tr-box.drawing-talking .bubble-area .result-char-bubble .complete-bubble.compare{margin-top:1rem}.tr-box.drawing-talking .bubble-area .result-char-bubble .complete-bubble.compare .compare-pictures{display:flex;justify-content:space-between;margin-top:.5rem}.tr-box.drawing-talking .bubble-area .result-char-bubble .complete-bubble.compare .compare-pictures figure{width:49%;min-height:400px}.tr-box.drawing-talking .bubble-area .result-char-bubble .complete-bubble.compare .compare-texts{display:flex;justify-content:space-between;margin-top:.5rem}.tr-box.drawing-talking .bubble-area .result-char-bubble .complete-bubble.compare .compare-texts .text-result{width:100%;position:relative}.tr-box.drawing-talking .bubble-area .result-char-bubble .complete-bubble.compare .compare-texts .text-result figure{width:100%}.tr-box.drawing-talking .bubble-area .result-char-bubble .complete-bubble.compare .compare-texts .text-result .text-result-contents{width:100%;background-color:#fdf8e9;padding:1rem;border-radius:.5rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25);font-size:1.7rem}.tr-box.drawing-talking .bubble-area .result-char-bubble .complete-bubble.compare .compare-texts .text-result .text-result-contents::-webkit-scrollbar{width:6px}.tr-box.drawing-talking .bubble-area .result-char-bubble .complete-bubble.compare .compare-texts .text-result .text-result-contents::-webkit-scrollbar-thumb{background:#bebebe}.tr-box.drawing-talking .bubble-area .result-char-bubble.compare{width:100%}.tr-box.drawing-talking .bubble-area .user-reply{position:relative;background-color:#fff;border-radius:8px;padding:1rem;font-size:1.25rem;color:#1d1d1d;margin-top:1rem;display:flex;justify-content:flex-end;border:1px solid #d5d5d5}.tr-box.drawing-talking .bubble-area .user-reply button{font-size:1.6rem;padding:.3rem 1.5rem;border-radius:3rem;border:none;cursor:pointer;border:1px solid #dedede}.tr-box.drawing-talking .bubble-area .user-reply.reply{margin-left:auto}.tr-box.drawing-talking .bubble-area .user-reply::before{width:120%;content:"여기를 클릭해볼까요?↓";position:absolute;top:-34px;right:0;text-align:center;animation:move-click .5s infinite alternate}.step-btns{display:flex;align-items:center;gap:1rem;color:var(--bs-white);position:fixed;bottom:30px}.step-btns .button{padding:1.25rem 5rem;font-size:24px;border-radius:.4rem;cursor:pointer}.step-btns .button.button-prev{background-color:#b0b0b0}.step-btns .button.button-next{background-color:#66bf30}@keyframes move-click{100%{top:-28px}}@media screen and (min-width: 1441px)and (max-width: 1540px){.tr-box.drawing-talking{max-height:500px}}@media screen and (min-width: 1367px)and (max-width: 1440px){.tr-box.drawing-talking{max-height:500px}}@media(max-width: 1200px){.tr-box.drawing-talking .bubble-area .result-char-bubble figure{width:60px}.tr-box.drawing-talking .bubble-area .result-char-bubble .complete-bubble{font-size:1.2rem}.tr-box.drawing-talking .bubble-area .result-char-bubble .complete-bubble.compare .compare-texts .text-result .text-result-contents{font-size:1.2rem}}@media screen and (min-width: 1023px)and (max-width: 1366px){.tr-box.drawing-talking{max-height:490px}.tr-box.drawing-talking .bubble-area{width:90%;gap:1rem}.tr-box.drawing-talking .bubble-area .result-char-bubble .complete-bubble.compare .compare-texts .text-result .text-result-contents{font-size:1.5rem;line-height:2}.tr-box.drawing-talking .bubble-area .user-reply button{font-size:1.4rem}}@media screen and (min-width: 901px)and (max-width: 1022px){.tr-box.drawing-talking{max-height:400px}.tr-box.drawing-talking .complete-txt-container p{font-size:1.25rem}.tr-box.drawing-talking .bubble-area{width:90%}.tr-box.drawing-talking .bubble-area .user-reply button{font-size:1.4rem}.step-btns .button{font-size:1rem}}@media screen and (max-width: 900px){.tr-box.drawing-talking{max-height:310px;margin-top:2rem}.tr-box.drawing-talking .complete-txt-container p{font-size:1.25rem}.tr-box.drawing-talking .bubble-area{width:90%}.tr-box.drawing-talking .bubble-area .user-reply button{font-size:1.4rem}.step-btns .button{font-size:1rem}}
.tr-bg.contents-complete{width:100%;font-family:"Maple" !important}.tr-bg.contents-complete .inner{flex-direction:column;gap:.5rem}.tr-bg.contents-complete .inner .experience-flag{width:300px;margin:0 auto}.tr-bg.contents-complete .inner .experience-txt{font-weight:bold;color:#5a9a5a;font-size:4rem;animation:text-scale .8s infinite alternate;margin:1rem 0;text-align:center}.tr-bg.contents-complete .inner .experience-sub-txt{font-size:2rem;text-align:center}.tr-bg.contents-complete .inner .experience-sub-txt.white{color:var(--bs-white)}.tr-bg.contents-complete .inner .char-says-bubble{display:flex;align-items:flex-start;gap:1rem;margin-top:1rem}.tr-bg.contents-complete .inner .char-says-bubble .say-bubble{display:flex;flex-direction:column;background-color:var(--bs-white);border:1px solid #a1beed;padding:1rem;gap:1rem;flex:1 1;border-radius:.5rem;position:relative}.tr-bg.contents-complete .inner .char-says-bubble .say-bubble button{width:100%;height:90px;border:none;border-radius:6px;color:var(--bs-white);font-size:2.2rem}.tr-bg.contents-complete .inner .char-says-bubble .say-bubble button.start-all-over{background-color:#c8c8c8}.tr-bg.contents-complete .inner .char-says-bubble .say-bubble button.another-experience{background-color:#66bf30}.tr-bg.contents-complete .inner .char-says-bubble .say-bubble button.print-experience{background-color:#e8bd30;color:#272727}.tr-bg.contents-complete .inner .char-says-bubble .say-bubble::after{content:"";position:absolute;right:-15px;top:50%;width:0;height:0;border:15px solid rgba(0,0,0,0);margin-top:-15px;margin-right:-15px;border-left-color:#fff}.tr-bg.contents-complete .inner .char-says-bubble .say-bubble::before{content:"";position:absolute;right:0;top:50%;width:0;height:0;border:15px solid rgba(0,0,0,0);margin-top:-15px;margin-right:-15px;border-left-color:#a1beed;right:-16px}.tr-bg.contents-complete .inner .char-says-bubble figure{width:30%}.tr-bg.contents-complete .inner .char-says-bubble figure.arial{width:40%}@keyframes text-scale{100%{transform:scale(0.9)}}@media screen and (min-width: 1441px)and (max-width: 1540px){.tr-bg.contents-complete .inner .experience-flag{width:270px}.tr-bg.contents-complete .inner .experience-txt{font-size:3rem}.tr-bg.contents-complete .inner .char-says-bubble figure{width:30%}}@media screen and (min-width: 1367px)and (max-width: 1440px){.tr-bg.contents-complete .inner .char-says-bubble figure{width:30%}}@media screen and (min-width: 1023px)and (max-width: 1366px){.tr-bg.contents-complete .inner .experience-txt{font-size:3rem}.tr-bg.contents-complete .inner .experience-flag{width:200px}.tr-bg.contents-complete .inner .char-says-bubble figure{width:30%}.tr-bg.contents-complete .inner .char-says-bubble figure.arial{width:25%}}@media screen and (min-width: 901px)and (max-width: 1022px){.tr-bg.contents-complete .inner .experience-txt{font-size:2rem}.tr-bg.contents-complete .inner .experience-flag{width:200px}.tr-bg.contents-complete .inner .char-says-bubble{width:70%}.tr-bg.contents-complete .inner .char-says-bubble figure{width:25%}}@media screen and (max-width: 900px){.tr-bg .inner .experience-txt{font-size:2rem}.tr-bg .inner .experience-flag{width:200px}.tr-bg .inner .char-says-bubble{width:70%}.tr-bg .inner .char-says-bubble figure{width:25%}}
.tr-box.selection{padding:30px 0 10px;height:70vh;width:100%;overflow-y:scroll;overflow-x:hidden;background-color:var(--bs-white);position:relative;border-radius:.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:"Maple" !important}.tr-box.selection .text-wrap{width:100%;text-align:center;display:flex;justify-content:center;align-items:center;gap:.5rem;font-size:24px}.tr-box.selection .arrow-btns{display:flex;justify-content:space-between;align-items:center;width:100%;padding:.5rem 2rem}.tr-box.selection .arrow-btns .arrow{cursor:pointer;background:none;border:none;position:relative;transition-duration:.3s;width:100px}.tr-box.selection .arrow-btns .arrow:hover{transform:scale(1.1)}.tr-box.selection .arrow-btns .arrow.arrow-prev::after{content:"";font-family:"Maple"}.tr-box.selection .arrow-btns .arrow.arrow-next{animation:pulse-wobble 1.5s ease-in-out infinite}@keyframes pulse-wobble{0%,100%{transform:scale(1) rotate(0deg)}25%{transform:scale(1.1) rotate(5deg)}50%{transform:scale(1) rotate(0deg)}75%{transform:scale(1.1) rotate(-5deg)}}.tr-box.selection .arrow-btns .arrow.arrow-next::after{content:"더 많은 선택지가 있어요!";font-family:"Maple";color:#66bf30;font-weight:bold;width:180%;position:absolute;top:-30px;left:50%;transform:translateX(-50%);font-size:1rem;animation:text-move .8s infinite alternate}@keyframes text-move{100%{top:-25px}}.tr-box.selection .selction-swiper{width:95%;overflow:hidden !important;margin:0 auto;padding-bottom:2rem;height:500px}.tr-box.selection .selction-swiper .swiper-wrapper.few-items{justify-content:center}.tr-box.selection .selction-swiper .swiper-wrapper .swiper-slide{border-radius:8px;box-shadow:0 1.98px 3.959px 0 rgba(0,0,0,.1019607843);background-color:#f1f1f1;cursor:pointer;transition:border .3s;overflow:hidden;display:flex;flex-direction:column;height:100%}.tr-box.selection .selction-swiper .swiper-wrapper .swiper-slide figure{width:100%;height:100%;overflow:hidden;position:relative;background-color:#fff}.tr-box.selection .selction-swiper .swiper-wrapper .swiper-slide figure img{width:120%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.tr-box.selection .selction-swiper .swiper-wrapper .swiper-slide p{display:flex;align-items:center;justify-content:center;font-size:24px;padding:1.5rem 0;text-align:center;line-height:1.4;flex-grow:1;display:flex;align-items:center;justify-content:center;text-align:center}.tr-box.selection .selction-swiper .swiper-wrapper .swiper-slide.border{border:12px solid #fac41d}.tr-box.selection .view-all-button{display:flex;align-items:center;border:none;border-radius:4px;padding:.8rem;cursor:pointer;background-color:#66bf30;color:var(--bs-white);margin-left:1rem}.step-btns{display:flex;align-items:center;gap:1rem;color:var(—bs-white);position:fixed;bottom:-100px;left:50%;transform:translateX(-50%);transition:bottom .5s ease;z-index:999;color:var(--bs-white)}.step-btns.active{bottom:30px}.step-btns .button{padding:1.25rem 5rem;font-size:24px;border-radius:.4rem;cursor:pointer}.step-btns .button.button-prev{background-color:#b0b0b0}.step-btns .button.button-next{background-color:#66bf30}@media screen and (max-width: 1441px){.tr-box.selection{padding:10px 0}.tr-box.selection .text-wrap{margin-bottom:1rem}.tr-box.selection .selction-swiper{width:80%}.tr-box.selection .selction-swiper .text-wrap{margin-bottom:1rem}.tr-box.selection .selction-swiper .swiper-wrapper .swiper-slide{min-height:auto}.tr-box.selection .selction-swiper .swiper-wrapper .swiper-slide p{padding:.5rem 0;font-size:20px}}@media screen and (min-width: 1440px)and (max-width: 1540px){.tr-box.selection{border-radius:.5rem}.tr-box.selection .selction-swiper{width:80%}.tr-box.selection .arrow-btns{position:absolute;top:50%;transform:translateY(-50%);padding:0}.tr-box.selection .arrow-btns .arrow{width:80px}.tr-box.selection .arrow-btns .arrow.arrow-next::after{content:""}.step-btns .button{font-size:1.25rem}}@media screen and (min-width: 1367px)and (max-width: 1440px){.tr-box.selection{border-radius:.5rem}.tr-box.selection .selction-swiper{width:80%}.tr-box.selection .arrow-btns{position:absolute;top:50%;transform:translateY(-50%);padding:0}.tr-box.selection .arrow-btns .arrow{width:80px}.tr-box.selection .arrow-btns .arrow.arrow-next::after{content:""}.step-btns .button{font-size:1.25rem}}@media screen and (min-width: 1023px)and (max-width: 1366px){.tr-box.selection{border-radius:.5rem}.tr-box.selection .selction-swiper{width:80%;height:340px}.tr-box.selection .arrow-btns{position:absolute;top:50%;transform:translateY(-50%);padding:0}.tr-box.selection .arrow-btns .arrow{width:80px}.tr-box.selection .arrow-btns .arrow.arrow-next::after{content:""}.step-btns .button{font-size:1.25rem}}@media screen and (min-width: 901px)and (max-width: 1022px){.tr-box.selection{border-radius:.5rem}.tr-box.selection .selction-swiper{width:80%}.tr-box.selection .arrow-btns{position:absolute;top:50%;transform:translateY(-50%);padding:0}.tr-box.selection .arrow-btns .arrow{width:80px}.tr-box.selection .arrow-btns .arrow.arrow-next::after{content:""}.step-btns .button{font-size:1rem}.swiper-wrapper{margin-top:1rem}}@media screen and (max-width: 900px){.tr-box.selection{border-radius:.5rem;height:auto}.tr-box.selection .selction-swiper{width:80%}.tr-box.selection .arrow-btns{position:absolute;top:50%;transform:translateY(-50%);padding:0}.tr-box.selection .arrow-btns .arrow{width:80px}.tr-box.selection .arrow-btns .arrow.arrow-next::after{content:""}.step-btns .button{font-size:1rem}.swiper-wrapper{margin-top:1rem}}
.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.5);display:flex;justify-content:center;align-items:center}.modal-contents{background-color:#fff;padding:40px 20px 0 40px;border-radius:8px;width:80%;max-height:80%;overflow-y:auto;position:relative}.modal-contents .close-button{position:absolute;top:10px;right:10px;background:none;border:none;font-size:20px;cursor:pointer;font-family:"Maple"}.modal-contents h3{font-family:"Maple";margin-bottom:2rem;text-align:center;font-size:2rem}.modal-contents .modal-items{display:flex;flex-wrap:wrap;justify-content:center;gap:20px}.modal-contents .modal-items .modal-item{display:flex;flex-direction:column;align-items:center;width:20%;border-radius:6px;overflow:hidden;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25);transition:all .3s;font-size:2rem}.modal-contents .modal-items .modal-item.selected{border:12px solid #fac41d}.modal-contents .modal-items .modal-item img{object-fit:cover}.modal-contents .modal-items .modal-item p{padding:1rem;background-color:#f6f6f6;width:100%;text-align:center;font-family:"Maple"}.modal-contents .confirm-button-wrap{position:-webkit-sticky;position:sticky;bottom:0;width:100%;background-color:hsla(0,0%,100%,.8);padding:.8rem;display:flex;justify-content:center;opacity:0}.modal-contents .confirm-button-wrap.active{bottom:0;opacity:1}.modal-contents .confirm-button-wrap .confirm-button{font-family:"Maple";border:none;display:flex;justify-content:center;width:10%;font-size:1.25rem;color:var(--bs-white);border-radius:4px;cursor:pointer;background:none}
.tr-box.w-selection{padding:30px 0;background-color:var(--bs-white);width:100%;position:relative;border-radius:.5rem;height:calc(100vh - 220px);font-family:"Maple" !important}.tr-box.w-selection .text-wrap{width:100%;text-align:center;display:flex;justify-content:center;gap:.5rem;font-size:24px}.tr-box.w-selection .arrow-btns{display:flex;justify-content:space-between;align-items:center;width:100%;padding:1rem 2rem}.tr-box.w-selection .arrow-btns .arrow{cursor:pointer;background:none;border:none;position:relative;transition-duration:.3s;width:100px}.tr-box.w-selection .arrow-btns .arrow:hover{transform:scale(1.1)}.tr-box.w-selection .arrow-btns .arrow.arrow-prev::after{content:"";font-family:"Maple"}.tr-box.w-selection .arrow-btns .arrow.arrow-next::after{content:"더 많은 선택지가 있어요!";font-family:"Maple";color:#66bf30;font-weight:bold;width:180%;position:absolute;top:-30px;left:50%;transform:translateX(-50%);font-size:1rem;animation:text-move .8s infinite alternate}@keyframes text-move{100%{top:-25px}}.tr-box.w-selection .writing-selection-container{display:flex;align-items:center;justify-content:center;gap:2rem;height:520px;padding:1rem 1rem 2rem 1rem;overflow:hidden !important;position:relative}.tr-box.w-selection .writing-selection-container .swiper-wrapper.few-items{justify-content:center}.tr-box.w-selection .writing-selection-container .swiper-wrapper .writing-selections{width:30%;height:100%;background-color:#f1f1f1;cursor:pointer;border-radius:8px;overflow:hidden !important;transition:border .3s;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.1);display:flex;flex-direction:column;align-items:center;justify-content:center}.tr-box.w-selection .writing-selection-container .swiper-wrapper .writing-selections figure{width:100%;height:100%;overflow:hidden;position:relative;background-color:#fff}.tr-box.w-selection .writing-selection-container .swiper-wrapper .writing-selections figure img{width:120%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.tr-box.w-selection .writing-selection-container .swiper-wrapper .writing-selections p{display:flex;align-items:center;justify-content:center;height:20%;font-size:24px;line-height:1.4;text-align:center}.tr-box.w-selection .writing-selection-container .swiper-wrapper .writing-selections.border{border:12px solid #fac41d}.step-btns{display:flex;align-items:center;gap:1rem;color:var(--bs-white);position:fixed;bottom:-300px;left:50%;transform:translateX(-50%);transition:bottom .5s ease;cursor:pointer;z-index:999}.step-btns.active{bottom:30px}.step-btns .button{padding:1.25rem 5rem;font-size:24px;border-radius:.4rem;cursor:pointer}.step-btns .button.button-prev{background-color:#b0b0b0}.step-btns .button.button-next{background-color:#66bf30;display:flex;align-items:center}.step-btns .button.button-next figure{width:24px}@media screen and (max-width: 1300px){.step-btns .button{font-size:20px}}@media screen and (max-width: 1440px){.tr-box.w-selection .writing-selection-container .swiper-wrapper .writing-selections p{font-size:18px}}@media screen and (min-width: 1441px)and (max-width: 1540px){.tr-box.w-selection{padding:20px 0}.tr-box.w-selection .arrow-btns{padding:0}.tr-box.w-selection .arrow-btns .arrow{width:75px}.tr-box.w-selection .arrow-btns .arrow.arrow-next::after{content:"";width:180%;animation:none;top:-53px}.tr-box.w-selection .text-wrap{margin-bottom:2rem}.tr-box.w-selection .arrow-btns{position:absolute;top:50%;transform:translateY(-50%)}.tr-box.w-selection .writing-selection-container{width:90%;margin:0 auto}.tr-box.w-selection .writing-selection-container .writing-selections{height:360px}}@media screen and (min-width: 1367px)and (max-width: 1440px){.tr-box.w-selection .arrow-btns{padding:0}.tr-box.w-selection .arrow-btns .arrow{width:90px}.tr-box.w-selection .arrow-btns .arrow.arrow-next::after{width:180%;animation:none;top:-53px;content:""}.tr-box.w-selection .text-wrap{margin-bottom:2rem}.tr-box.w-selection .arrow-btns{position:absolute;top:50%;transform:translateY(-50%);padding:0 1rem}.tr-box.w-selection .writing-selection-container{width:80%;margin:0 auto;height:360px}.tr-box.w-selection .writing-selection-container .writing-selections{height:360px}}@media screen and (min-width: 1023px)and (max-width: 1366px){.tr-box.w-selection .arrow-btns .arrow{width:100px}.tr-box.w-selection .arrow-btns .arrow.arrow-next::after{width:180%}.tr-box.w-selection .writing-selection-container{height:340px;padding:0 2rem}}@media screen and (min-width: 901px)and (max-width: 1022px){.tr-box.w-selection .arrow-btns{display:none}.tr-box.w-selection .arrow-btns .arrow{width:100px}.tr-box.w-selection .arrow-btns .arrow.arrow-next::after{width:180%}.tr-box.w-selection .writing-selection-container{height:300px;padding:0 2rem}.step-btns .button{font-size:1rem}}@media screen and (max-width: 900px){.tr-box.w-selection .arrow-btns{display:none}.tr-box.w-selection .arrow-btns .arrow{width:100px}.tr-box.w-selection .arrow-btns .arrow.arrow-next::after{width:180%}.tr-box.w-selection .writing-selection-container{height:300px;padding:0 2rem}.step-btns .button{font-size:1rem}}
.tr-box.after-selcomplete{width:100%;background-color:var(--bs-white);padding:60px 0;border-radius:.5rem;position:relative;overflow:hidden;display:flex;flex-direction:column;font-family:"Maple" !important;height:calc(100vh - 220px)}.tr-box.after-selcomplete .complete-txt{text-align:center;font-size:28px;font-weight:bold}.tr-box.after-selcomplete .divider{width:90%;height:1px;background-color:#bcbcbc;margin:30px auto}.tr-box.after-selcomplete .guide-long-txt{width:60%;position:relative;top:0;left:40%;transform:translate(-50%, 0);line-height:2.4;font-size:2rem;padding:1rem;background-color:#eee;border-radius:1rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15)}.tr-box.after-selcomplete .guide-long-txt .complete-txt{text-align:center;font-size:28px;font-weight:bold}.tr-box.after-selcomplete .guide-long-txt .select-box{padding:.3rem .8rem;background-color:var(--bs-white);border-radius:.5rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25);font-weight:bold}.tr-box.after-selcomplete .speaking-char{position:absolute;right:30px;bottom:-130px;width:19%}.tr-box.after-selcomplete .speaking-char.arial{width:23%;bottom:-80px}.tr-box.after-selcomplete .speaking-char.ulju{width:24vw}.tr-box.after-selcomplete .start-btn{color:var(--bs-white);background-color:#66bf30;padding:1.25rem 5rem;font-size:24px;font-weight:bold;border-radius:.4rem;cursor:pointer}.step-btns{display:flex;align-items:center;gap:1rem;color:var(--bs-white);position:fixed;bottom:30px}.step-btns .button{padding:1.25rem 5rem;font-size:24px;border-radius:.4rem;cursor:pointer}.step-btns .button.button-prev{background-color:#b0b0b0}.step-btns .button.button-next{background-color:#66bf30;display:flex;align-items:center;gap:.5rem}.step-btns .button.button-next figure{width:24px}@media screen and (min-width: 1441px)and (max-width: 1540px){.tr-box.after-selcomplete{padding:30px 0}.tr-box.after-selcomplete .speaking-char{width:22%}.tr-box.after-selcomplete .guide-long-txt{line-height:2}.guide-long-txt{line-height:2;font-size:1.75rem}}@media screen and (min-width: 1367px)and (max-width: 1440px){.tr-box.after-selcomplete{padding:20px 0}.tr-box.after-selcomplete .speaking-char{width:22%}.tr-box.after-selcomplete .guide-long-txt{line-height:2;font-size:1.75rem}}@media screen and (min-width: 1023px)and (max-width: 1366px){.tr-box.after-selcomplete{padding:30px 0}.tr-box.after-selcomplete .complete-txt{font-size:20px}.tr-box.after-selcomplete .guide-long-txt{width:65%;font-size:1.45rem;line-height:2}.tr-box.after-selcomplete .speaking-char{width:23%}.tr-box.after-selcomplete .start-btn{font-size:20px}.tr-box.after-selcomplete .step-btns .button{font-size:1.25rem}.start-btn{font-size:20px}.step-btns .button{font-size:1.25rem}}@media screen and (min-width: 901px)and (max-width: 1022px){.tr-box.after-selcomplete{padding:20px 0}.tr-box.after-selcomplete .complete-txt{font-size:18px}.tr-box.after-selcomplete .guide-long-txt{font-size:1.2rem}.tr-box.after-selcomplete .divider{margin:10px auto}.tr-box.after-selcomplete .speaking-char{width:23%;bottom:-90px}.divider{margin:10px auto}.speaking-char{width:23%;bottom:-90px}.step-btns .button{font-size:1rem}}@media screen and (max-width: 900px){.tr-box.after-selcomplete{padding:20px 0}.tr-box.after-selcomplete .complete-txt{font-size:18px}.tr-box.after-selcomplete .guide-long-txt{font-size:1.2rem}.tr-box.after-selcomplete .divider{margin:10px auto}.tr-box.after-selcomplete .speaking-char{width:23%;bottom:-90px}.divider{margin:10px auto}.speaking-char{width:23%;bottom:-90px}.step-btns .button{font-size:1rem}}
.tr-bg{font-family:"Maple" !important}.tr-bg.shortform{width:100%;height:calc(100vh - 220px);background-color:var(--bs-white);overflow-y:scroll}.tr-bg.shortform .tr-box.shortform{width:100%;height:100%;background-color:var(--bs-white);border-radius:1rem;overflow-y:scroll;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:1rem}.tr-bg.shortform .tr-box.shortform .form-title{display:inline-flex;align-items:center;justify-content:center;background-color:#f4f8fe;border:1px solid #e3e9f1;padding:10px 20px;border-radius:4px;font-weight:bold;color:#404451}.tr-bg.shortform .tr-box.shortform .video-container{position:relative;margin:0 auto;display:flex;justify-content:center;align-items:center;max-height:70vh;background-color:#000}.tr-bg.shortform .tr-box.shortform .video-container.ratio-16-9{width:106.6666666667vh;height:60vh}.tr-bg.shortform .tr-box.shortform .video-container.ratio-9-16{width:39.375vh;height:auto}.tr-bg.shortform .tr-box.shortform .video-container.ratio-3-4{width:52.5vh;height:auto}.tr-bg.shortform .tr-box.shortform .video-container.ratio-5-5{width:60vh;height:auto}.tr-bg.shortform .tr-box.shortform .video-container.ratio-4-3{width:40vh;height:auto}.tr-bg.shortform .tr-box.shortform .video-container iframe{width:100%;height:100%}.tr-bg.shortform .tr-box.shortform .fullscreen-button{display:flex;align-items:center;color:var(--bs-white);padding:8px 20px;border-radius:4px;background-color:#707070;border:none;cursor:pointer;gap:.5rem;font-size:1rem}@media(max-width: 1024px){.tr-box.shortform .video-container{max-height:60vh}.tr-box.shortform .video-container.ratio-16-9{width:106.6666666667vh;height:auto}.tr-box.shortform .video-container.ratio-5-5{width:60vh;height:auto}.tr-box.shortform .video-container.ratio-3-4{width:45vh;height:auto}}@media(max-width: 768px){.tr-box.shortform .video-container{max-height:50vh}.tr-box.shortform .video-container.ratio-16-9{width:88.8888888889vh;height:auto}.tr-box.shortform .video-container.ratio-5-5{width:50vh;height:auto}.tr-box.shortform .video-container.ratio-3-4{width:37.5vh;height:auto}}@media(max-width: 480px){.tr-box.shortform .video-container{max-height:40vh}.tr-box.shortform .video-container.ratio-16-9{width:71.1111111111vh;height:auto}.tr-box.shortform .video-container.ratio-5-5{width:40vh;height:auto}.tr-box.shortform .video-container.ratio-3-4{width:30vh;height:auto}}
.music-qr-wrapper{position:fixed;top:0;left:0;z-index:9999999;width:100%;height:100svh;font-family:"Maple";background-color:rgba(0,0,0,.7)}.music-qr-wrapper .inner{height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center}.music-qr-wrapper .inner .qr-box-container{width:50%;border:10px solid #f8da45;padding:1rem;background-color:var(--bs-white);border-radius:24px;position:relative}.music-qr-wrapper .inner .qr-box-container .qr-title{width:70%;margin:0 auto}.music-qr-wrapper .inner .qr-box-container .sample-qr{width:30%;margin:2rem auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.music-qr-wrapper .inner .qr-box-container .desc{font-size:1.25rem;line-height:1.4;text-align:center}.music-qr-wrapper .inner .qr-box-container .qr-close-btn{width:100px;margin:1rem auto 0;cursor:pointer}.music-qr-wrapper .inner .swim-animation{position:fixed;bottom:120px;right:300px;width:380px}
.card-game-container{width:100%;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;position:fixed;top:0;left:0;z-index:9999;background:url(/static/media/game-test-bg.e5eb9330f521b618d38f.svg) no-repeat bottom/cover;overflow-y:auto}.card-game-container .inner{flex-direction:column;align-items:center;justify-content:center;height:100%}.card-game-container .inner .clock{position:absolute;top:50px;right:160px;width:100px;animation:swing 2s ease-in-out infinite}.card-game-container .inner .clock .count-down{position:absolute;top:55%;left:50%;transform:translateX(-50%);font-size:32px;font-weight:bold;font-family:"Maple"}.card-game-container .inner .clock .count-down.red{color:red}.card-game-container .inner .clock::before{content:"남은시간";font-size:18px;display:block;margin:.5rem auto;text-align:center;font-family:"Maple"}.card-game-container .inner .music-play-btn{width:120px;position:absolute;top:70px;left:160px;border:none;background:rgba(0,0,0,0);cursor:pointer;z-index:9}.card-game-container .inner h1{margin-bottom:2rem;font-size:2.5rem;text-align:center;font-family:"Maple";font-weight:bold;margin-top:20px}.card-game-container .inner .sub-text{font-family:"Maple";margin-bottom:2rem;color:#000;opacity:.7;font-size:1.25rem;text-align:center}.card-game-container .inner .card-game{display:grid;grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));grid-gap:20px;gap:20px;width:100%;max-width:1000px;padding:10px 0 30px;margin:0 auto}.card-game-container .inner .card{aspect-ratio:6/8;perspective:1000px;cursor:pointer;position:relative;width:100%;height:auto}.card-game-container .inner .card.flipped .card-inner{transform:rotateY(180deg)}.card-game-container .inner .card .card-inner{position:absolute;width:100%;height:100%;text-align:center;transition:transform .6s;transform-style:preserve-3d;top:0;left:0}.card-game-container .inner .card .card-front,.card-game-container .inner .card .card-back{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;display:flex;align-items:center;justify-content:center;border:none;border-radius:10px;box-shadow:0 4px 6px rgba(0,0,0,.1)}.card-game-container .inner .card .card-front{background-color:#fff;color:#000;transform:rotateY(180deg)}.card-game-container .inner .card .card-front img{width:85%;height:85%;object-fit:contain;border-radius:8px}.card-game-container .inner .card .card-back{background:linear-gradient(135deg, #a8edea, #fed6e3);background:var(--card-back-gradient, linear-gradient(135deg, #a8edea, #fed6e3));color:#fff;font-size:3rem;font-weight:bold;display:flex;align-items:center;justify-content:center;border-radius:10px;box-shadow:0 4px 6px rgba(0,0,0,.1);transition:transform .3s ease-in-out;position:relative;font-family:"Maple"}.card-game-container .inner .game-complete-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:10}.card-game-container .inner .game-complete-message{background:#fff;padding:2em;border-radius:10px;box-shadow:0 4px 12px rgba(0,0,0,.3);font-family:"Maple";display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem}.card-game-container .inner .game-complete-message figure{width:30%}.card-game-container .inner .game-complete-message h2{margin-bottom:20px;color:#4caf50;font-size:2rem}.card-game-container .inner .game-complete-message .restart-button{padding:.7em 1.4em;font-size:1.2rem;cursor:pointer;border:none;border-radius:5px;background-color:#4caf50;color:#fff;font-family:"Maple";transition:background-color .3s}.card-game-container .inner .game-complete-message .restart-button:hover{background-color:#45a049}@media screen and (min-aspect-ratio: 16/9){.card-game-container .inner .card-game{display:grid;grid-template-columns:repeat(5, minmax(140px, 160px));grid-gap:12px;gap:12px;max-width:1000px;width:90%;margin:0 auto;grid-auto-rows:1fr;justify-content:center;align-content:center;place-items:center}}@media only screen and (max-width: 1300px){.card-game-container .inner{padding-top:40px}.card-game-container .inner .clock{width:80px;right:20px;top:40px}.card-game-container .inner .music-play-btn{width:100px;left:20px;top:60px}.card-game-container .inner h1{font-size:1.8rem;margin-bottom:1.6rem}.card-game-container .inner .card-game{grid-template-columns:repeat(5, 1fr)}}
.gacha-bg{width:100%;height:100svh;background-color:#212125;position:fixed;top:0;left:0;background:url(/static/media/gacha-bg.85e6806124088ca7237d.svg) no-repeat bottom/cover}.gacha-bg .inner{position:relative;height:100svh}.gacha-bg .inner .gacha-container{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;position:absolute;bottom:0;left:50%;transform:translateX(-50%)}.gacha-bg .inner .gacha-container .gacha-title{width:360px;margin-bottom:1rem;animation:scale-up-up .8s infinite alternate}.gacha-bg .inner .gacha-container .gacha{width:38%;cursor:pointer}.gacha-bg .inner .gacha-container .gacha-animation{width:80%}.gacha-bg .inner .riddle-twins{position:absolute;bottom:0;left:250px}.gacha-bg .inner .riddle-mystery{position:absolute;bottom:0;right:200px}.gacha-bg .inner .effects{position:absolute}.gacha-bg .inner .effects.twinkle{width:100px;top:100px;left:300px}.gacha-bg .inner .effects.twinkle-2{width:140px;right:200px}.gacha-bg .inner .effects.twinkle-3{width:140px;left:200px}@keyframes scale-up-up{100%{transform:scale(1.1)}}@media screen and (max-width: 1500px){.gacha-bg .inner .gacha-container .gacha{width:45%}.gacha-bg .inner .gacha-container .gacha-animation{width:52%}.gacha-bg .inner .riddle-twins{width:200px;left:100px}.gacha-bg .inner .riddle-mystery{right:100px;width:200px}.gacha-bg .inner .effects.twinkle{width:80px;left:100px}.gacha-bg .inner .effects.twinkle-2{width:80px;right:80px}.gacha-bg .inner .effects.twinkle-3{width:80px;left:100px}}@media screen and (max-width: 1200px){.gacha-bg .inner .gacha-container .gacha{width:45%}.gacha-bg .inner .gacha-container .gacha-animation{width:52%}.gacha-bg .inner .riddle-twins{width:200px;left:100px}.gacha-bg .inner .riddle-mystery{right:100px;width:200px}.gacha-bg .inner .effects.twinkle{width:80px;left:100px}.gacha-bg .inner .effects.twinkle-2{width:80px;right:80px}.gacha-bg .inner .effects.twinkle-3{width:80px;left:100px}}
.lyrics-block .answerImage{width:15vw;margin:0 auto}.lyrics-block .q-say{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem}.lyrics-block .q-say figure{width:4vw}.lyrics-block .q-say .bubble{position:relative}.lyrics-block .q-say .bubble p{position:relative;z-index:10}.lyrics-block .q-say .bubble .saybubble{position:absolute;top:0;left:0;width:100%}.gacha-result-modal{position:fixed;top:0;left:0;z-index:90;width:100%;height:100svh;background-color:rgba(0,0,0,.8);display:flex;flex-direction:column;align-items:center;justify-content:center;animation:genieAppear 1.5s ease-out forwards;transform:scale(0.9);opacity:0;filter:blur(10px) brightness(1.5)}.gacha-result-modal .inner{display:flex;align-items:center;justify-content:center}.gacha-result-modal .inner .modal-paper{padding:1rem;background-color:var(--bs-white);border:4px solid #7e4234;border-radius:24px;display:flex;align-items:center;justify-content:center;flex-direction:column}.gacha-result-modal .inner .modal-paper .riddle-title-flag{width:400px;position:relative;top:-50px}.gacha-result-modal .inner .modal-paper .modal-question{font-family:"Maple";text-align:center;font-size:2rem;line-height:1.6;width:80%;margin:0 auto}.gacha-result-modal .inner .modal-paper .riddle-answer-button{border:none;background:none;cursor:pointer;margin:2rem auto}@keyframes genieAppear{0%{transform:scale(0.9);opacity:0;filter:blur(10px) brightness(1.5)}50%{transform:scale(1.05);opacity:.8;filter:blur(4px) brightness(1.2)}100%{transform:scale(1);opacity:1;filter:blur(0px) brightness(1)}}
.quiz-screen-container{width:100%;height:100svh;background-color:#b56627;position:fixed;top:0;left:0}.quiz-screen-container .inner{position:relative;height:100svh;font-family:"Maple"}.quiz-screen-container .inner .riddle-default{position:absolute;bottom:0;left:-170px;width:460px}.quiz-screen-container .inner .quiz-container{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem}.quiz-screen-container .inner .quiz-container .quiz-con{background-color:var(--bs-white);border:6px solid #7e4234;padding:1rem;border-radius:16px;width:100%;position:relative}.quiz-screen-container .inner .quiz-container .quiz-con .remaining-attempts{text-align:right;color:var(--bs-white);font-weight:900;font-size:1.25rem;position:absolute;right:1rem}.quiz-screen-container .inner .quiz-container .quiz-con .remaining-attempts .riddle-remain-box{width:160px;z-index:-1}.quiz-screen-container .inner .quiz-container .quiz-con .remaining-attempts .riddle-remain-box p{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:100%;text-align:center}.quiz-screen-container .inner .quiz-container .quiz-con.quiz-box{position:relative}.quiz-screen-container .inner .quiz-container .quiz-con.quiz-box .riddle-title-flag{width:410px;position:absolute;left:50%;top:-40px;transform:translateX(-50%)}.quiz-screen-container .inner .quiz-container .quiz-con.quiz-box .border{margin:0 auto;width:80%;margin:1.5rem auto}.quiz-screen-container .inner .quiz-container .quiz-con.quiz-box .question{text-align:center;margin-top:1rem;font-size:36px;line-height:1.5;width:80%;margin:0 auto}.quiz-screen-container .inner .quiz-container .quiz-con.quiz-box .question-bubble-area{position:relative}.quiz-screen-container .inner .quiz-container .quiz-con.quiz-box .question-bubble-area .feedback-bubble{text-align:center;font-size:30px;margin:1rem auto}.quiz-screen-container .inner .quiz-container .quiz-con.quiz-box .question-bubble-area .hint-button-group{display:flex;justify-content:center;margin-top:1rem}.quiz-screen-container .inner .quiz-container .quiz-con.quiz-box .question-bubble-area .hint-button-group button{border:none;background:none;cursor:pointer}.quiz-screen-container .inner .quiz-container .quiz-con.quiz-box .question-bubble-area .riddle-hint-char{width:460px;margin:1rem auto 0}.quiz-screen-container .inner .quiz-container .quiz-con.quiz-box .hint-navigation{display:flex;align-items:center;justify-content:center;gap:.5rem}.quiz-screen-container .inner .quiz-container .quiz-con.quiz-box .hint-navigation button{cursor:pointer;width:60px;background:none;border:none}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box.none{display:none}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .options p{text-align:center;font-weight:900;font-size:22px}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .options .border{margin:0 auto;width:80%;margin:1.5rem auto;border-bottom:1px solid #b4b4b4}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .options .option-btns{margin:0 auto;width:80%;max-height:250px;overflow-y:scroll;display:flex;flex-wrap:wrap;justify-content:center;gap:1rem}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .options .option-btns .answer-button{font-family:"Maple";font-size:20px;padding:1rem 2rem;border-radius:3rem;border:none;width:270px;text-align:center;font-size:32px;cursor:pointer;background-color:#fffbe0;transition-duration:.2s;box-shadow:0px 5px 0px 0px #feec87}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .options .option-btns .answer-button:hover{border:4px solid #feec87}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .selected-bubble{text-align:center;font-size:30px;line-height:1.3}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .submit-confirm{text-align:center;font-size:30px;line-height:1.3}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .submit-confirm .button-container{width:30%;margin:1.5rem auto 0}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .submit-confirm .button-container .submit{border:none;background:none;cursor:pointer}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .question-bubble-area.correct{display:flex;align-items:center;justify-content:center;gap:1rem}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .question-bubble-area.correct .answer-image{width:30%}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .question-bubble-area.correct .answer-text{font-size:2rem;margin:.8rem 0;position:relative;width:30%}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .question-bubble-area.correct .answer-text .riddle-correct-paper{width:100%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .question-bubble-area.correct .answer-text p{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .question-bubble-area.failed{display:flex;flex-direction:row-reverse;align-items:center;justify-content:center;gap:1rem}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .question-bubble-area.failed .failed-answer{text-align:center;font-size:28px;margin-bottom:1rem;line-height:1.4}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .question-bubble-area.failed .failed-answer .correct-answer{color:#267fe5;font-weight:900}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .question-bubble-area.failed .failed-answer .answer-image{width:20%}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .question-bubble-area.failed .answer-image{width:20%}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .button-container.correct{display:flex;justify-content:center;align-items:center;margin-top:1rem}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .button-container.correct button{border:none;background:none;cursor:pointer}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .button-container.failed{display:flex;justify-content:center;align-items:center;margin-top:1rem}.quiz-screen-container .inner .quiz-container .quiz-con.answer-box .button-container.failed button{border:none;background:none;cursor:pointer}.quiz-screen-container .inner .confetti-animation{position:fixed;left:20px;bottom:20px;width:300px}.quiz-screen-container .inner .confetti-animation-right{position:fixed;right:20px;bottom:20px;width:300px;transform:rotateY(180deg)}
.tr-box.writing-complete.fish{font-family:"Maple" !important}.tr-box.writing-complete.fish .tes{display:flex;flex-direction:row;gap:1rem;width:90%}.tr-box.writing-complete.fish .tes .fish{width:35%}.tr-box.writing-complete.fish .tes .text-section{flex:1 1;display:flex;flex-direction:column;align-items:center;justify-content:center}.tr-box.writing-complete.fish .tes .text-section .keyword-container{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap;max-height:160px;background-color:#f0f0f0;padding:.5rem;border-radius:.5rem;width:100%;margin:0 auto}.tr-box.writing-complete.fish .tes .text-section .keyword-container span{color:#66bf30;font-weight:bold;font-size:1.8rem;display:flex;align-items:center;justify-content:center;cursor:pointer}.tr-box.writing-complete.fish .tes .text-section .keyword-container span.keyword{padding:.3rem .8rem;background-color:var(--bs-white);border-radius:.5rem;box-shadow:0px 1.98px 3.959px rgba(0,0,0,.25);display:inline-flex}.tr-box.writing-complete.fish .tes .text-section .info{margin-top:2rem;font-size:2rem;text-align:center}.tr-box.writing-complete.fish .tes .text-section .info h3{margin-bottom:1rem;font-weight:900}.tr-box.writing-complete.fish .tes .text-section .info p{font-size:1.6rem;line-height:1.6;color:#4d4d4d;white-space:pre-line;width:100%;margin:0 auto}@media screen and (max-width: 1441px){.tr-box.writing-complete.fish .tes .text-section .info{margin-top:1rem}.tr-box.writing-complete.fish .tes .text-section .info h3{font-size:1.5rem}.tr-box.writing-complete.fish .tes .text-section .info p{font-size:1.4rem}.tr-box.writing-complete.fish .tes .text-section .keyword-container span.keyword{font-size:1.5rem}}@media screen and (max-width: 1200px){.tr-box.writing-complete.fish .tes{flex-direction:column;align-items:center}.tr-box.writing-complete.fish .tes .text-section{width:100%}.tr-box.writing-complete.fish .tes .text-section .info{font-size:1.5rem}.tr-box.writing-complete.fish .tes .text-section .info p{width:100%;font-size:1.3rem}.tr-box.writing-complete.fish .tes .text-section .keyword-container span.keyword{font-size:1.25rem}}
.fish-loading{position:fixed;top:0;z-index:99999;left:0;width:100%;height:100vh;overflow:hidden;background:linear-gradient(180deg, #1c1f34 0%, #0c0f22 100%);font-family:"Maple"}.fish-loading.shake{animation:screen-shake .3s ease-in-out}.fish-loading .progress-zone{display:flex;align-items:center;justify-content:center;width:80%;margin:2rem auto;font-family:"Maple"}.fish-loading .progress-zone .progress-text{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.fish-loading .progress-zone .progress-text p{color:var(--bs-white);font-size:1.5rem;margin-bottom:.5rem}.fish-loading .progress-zone .clock{width:100px;animation:swing 2s ease-in-out infinite;position:relative}.fish-loading .progress-zone .clock .count-down{position:absolute;top:55%;left:50%;transform:translateX(-50%);font-size:32px;font-weight:bold;font-family:"Maple"}.fish-loading .progress-zone .clock .count-down.red{color:red}.fish-loading .progress-zone .clock::before{content:"남은시간";font-size:18px;display:block;margin:.5rem auto;text-align:center;font-family:"Maple";color:var(--bs-white)}.fish-loading .progress-zone .music-play-btn{width:120px;border:none;background:rgba(0,0,0,0);cursor:pointer;z-index:9}.fish-loading .effect-plus-one{position:absolute;font-size:24px;font-weight:bold;color:#ff0;animation:floatUp 1s ease-out;pointer-events:none;transform:translate(-50%, -50%);z-index:10}.fish-loading .effect-plus-one.trash-text{color:#4de2ba}@keyframes floatUp{0%{opacity:1;transform:translate(-50%, -50%) scale(1)}100%{opacity:0;transform:translate(-50%, -80%) scale(1.5)}}.fish-loading .effect-warning{position:absolute;color:#f44336;font-weight:bold;font-size:1.2rem;animation:fadeUp 1s ease-out forwards;z-index:100}@keyframes fadeUp{0%{opacity:1;transform:translateY(0px)}100%{opacity:0;transform:translateY(-20px)}}.fish-loading .bg-sand-loading{position:fixed;width:100%;bottom:0;left:0}.fish-loading .fish-zone{position:absolute;width:100%;height:80%;z-index:2;bottom:0}.fish-loading .fish{position:absolute;animation-iteration-count:infinite;animation-direction:alternate;animation-timing-function:linear;transform-origin:center center;transition:none !important;cursor:pointer}.fish-loading .fish.move-left{animation-name:move-left}.fish-loading .fish.move-right{animation-name:move-right}.fish-loading .fish.move-up{animation-name:move-up}.fish-loading .fish.move-down{animation-name:move-down}.fish-loading .fish.move-diagonal{animation-name:move-diagonal}.fish-loading .score-ui{position:absolute;top:20px;right:20px;color:#fff;font-size:20px;background:rgba(0,0,0,.5);padding:8px 12px;border-radius:10px;z-index:5}.fish-loading .pre-message,.fish-loading .countdown{position:absolute;top:40%;left:50%;transform:translate(-50%, -50%);color:#fff;font-size:24px;background:rgba(0,0,0,.5);padding:16px 24px;border-radius:10px;z-index:10;animation:fadeIn .5s ease;text-align:center}.fish-loading .countdown{font-size:64px;font-weight:bold;animation:pop .6s ease}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes pop{0%{transform:translate(-50%, -50%) scale(1.5);opacity:0}50%{transform:translate(-50%, -50%) scale(1.2);opacity:1}100%{transform:translate(-50%, -50%) scale(1);opacity:1}}@keyframes move-left{0%{transform:translateX(0) scaleX(1)}49.9%{transform:translateX(-74px) scaleX(1)}50%{transform:translateX(-75px) scaleX(-1)}100%{transform:translateX(-150px) scaleX(-1)}}@keyframes move-right{0%{transform:translateX(0) scaleX(1)}49.9%{transform:translateX(74px) scaleX(1)}50%{transform:translateX(75px) scaleX(-1)}100%{transform:translateX(150px) scaleX(-1)}}@keyframes move-up{0%{transform:translateY(0) scaleX(1)}49.9%{transform:translateY(-49px) scaleX(1)}50%{transform:translateY(-50px) scaleX(-1)}100%{transform:translateY(-100px) scaleX(-1)}}@keyframes move-down{0%{transform:translateY(0) scaleX(1)}49.9%{transform:translateY(49px) scaleX(1)}50%{transform:translateY(50px) scaleX(-1)}100%{transform:translateY(100px) scaleX(-1)}}@keyframes move-diagonal{0%{transform:translate(0, 0) scaleX(1)}49.9%{transform:translate(74px, 74px) scaleX(1)}50%{transform:translate(75px, 75px) scaleX(-1)}100%{transform:translate(150px, 150px) scaleX(-1)}}@keyframes screen-shake{0%{transform:translate(1px, 1px)}10%{transform:translate(-1px, -2px)}20%{transform:translate(-3px, 0px)}30%{transform:translate(3px, 2px)}40%{transform:translate(1px, -1px)}50%{transform:translate(-1px, 2px)}60%{transform:translate(-3px, 1px)}70%{transform:translate(3px, 1px)}80%{transform:translate(-1px, -1px)}90%{transform:translate(1px, 2px)}100%{transform:translate(1px, -2px)}}
.training-header{width:100%;position:absolute;top:0;left:0;padding:1rem 0;z-index:9999}.training-header .inner{display:flex;align-items:center;justify-content:space-between}.training-header .inner .drawing-logo{width:240px;border:none;background:none;cursor:pointer}.training-header .inner .go-hub-btn{font-family:"Maple";background-color:#ffb93e;border:none;padding:.8rem 1.25rem;color:var(--bs-white);font-size:1.25rem;border-radius:4px;box-shadow:0 2px 2px 0 rgba(0,0,0,.2509803922);cursor:pointer}@media screen and (min-width: 1367px)and (max-width: 1440px){.drawing-header .inner .drawing-logo{width:160px}.drawing-header .inner .go-hub-btn{font-size:1.15rem;padding:.7rem 1rem}}@media(max-width: 1200px){.training-header .inner .go-hub-btn{font-size:1rem;padding:.8rem 1rem}}@media screen and (min-width: 1023px)and (max-width: 1366px){.drawing-header .inner .drawing-logo{width:140px}.drawing-header .inner .go-hub-btn{font-size:1.15rem;padding:.7rem 1rem}}@media screen and (min-width: 901px)and (max-width: 1022px){.drawing-header .inner .drawing-logo{width:140px}.drawing-header .inner .go-hub-btn{font-size:1rem;padding:.5rem .8rem}}@media screen and (max-width: 900px){.drawing-header .inner .drawing-logo{width:140px}.drawing-header .inner .go-hub-btn{font-size:1rem;padding:.5rem .8rem}}
#wrap{font-family:"NEXONLv1Gothic"}#wrap .section-1{position:relative;overflow:hidden;height:auto;padding:20vh 0;height:100vh;overflow:hidden;background:linear-gradient(135deg, #134388 0%, #0f2441 118.74%),#fff}#wrap .section-1 .inner{flex-direction:column;position:relative;z-index:10}#wrap .section-1 .sub-title{color:var(--bs-white);font-size:1.6rem;margin-bottom:1rem}#wrap .section-1 .sparkle-particle{width:100%;position:absolute;bottom:-430px}#wrap .section-1 .bean-right{position:absolute;width:200px;right:-20px;animation:move-up-down 1s infinite alternate}#wrap .section-1 .bean-left{position:absolute;width:300px;left:-80px;top:500px;animation:move-up-down 1s infinite alternate}#wrap .section-1 .bottom-bean{position:absolute;bottom:-100px}#wrap .section-1 .start-mk-btn{padding:1rem 3rem;margin-top:2rem;border:none;cursor:pointer;border-radius:50px;font-size:1rem;background-color:#f8de62;border:4px solid #fff;cursor:pointer}#wrap .section-1 .start-mk-btn:hover{background-color:#eaca27}#wrap .section-1 .char-main-container{position:absolute;bottom:-100px;left:50%;transform:translateX(-50%);display:flex}#wrap .section-1 .main-title{text-align:center;font-size:3rem;color:var(--bs-white);font-weight:400;line-height:1.2;width:100%}#wrap .section-1 .main-title span{font-weight:bold;display:inline-block;font-size:5rem}#wrap .section-1 .main-title span b{color:#f8de62}#wrap .section-1 .scroll{position:absolute;bottom:90px;left:50%;transform:translatex(-50%);z-index:2;display:inline-block;color:#fff;transition:opacity .3s;z-index:10000;font-size:20px;font-weight:100}#wrap .section-1 .scroll span{position:absolute;top:0;left:50%;width:24px;height:24px;margin-left:-12px;border-left:1px solid #fff;border-bottom:1px solid #fff;transform:rotate(-45deg);animation:sdb05 1.5s infinite;box-sizing:border-box}@keyframes sdb05{0%{transform:rotate(-45deg) translate(0, 0);opacity:0}50%{opacity:1}100%{transform:rotate(-45deg) translate(-20px, 20px);opacity:0}}@keyframes move-up-down{0%{transform:translateY(0)}100%{transform:translateY(-10px)}}@keyframes scale-up{0%{transform:scale(1)}100%{transform:scale(1.05)}}#wrap .section-1 .scroll:hover{opacity:.5}#wrap .section-1 .inner{height:100%;display:flex;align-items:center}#wrap .section-1 .left .left-main-txt{font-family:"HS-Regular";color:var(--bs-white);font-size:88px}#wrap .section-1 .left .left-main-txt .main-explain-txt{width:50%}#wrap .section-1 .left .left-main-txt .main-explain-txt-center{display:none}#wrap .section-1 .left .left-main-txt .main-white-logo{position:relative}#wrap .section-1 .left .left-main-txt .main-white-logo .white-logo{width:600px;position:relative;z-index:2}#wrap .section-1 .left .left-main-txt .main-white-logo .circle{position:absolute;top:30px;left:0}#wrap .section-1 .left .btn-box{margin-top:3rem;display:flex;gap:1rem;cursor:pointer}#wrap .section-1 .left .btn-box .start-btn{width:60%;padding:20px 24px;border-radius:4px;background:#e8bd30;color:var(--bs-blue-primary);font-weight:700;text-align:center;font-size:22px}#wrap .section-1 .left .btn-box .requst-btn{width:20%;border-radius:4px;padding:16px 0;text-align:center;background:#fff;color:var(--bs-blue-primary);font-weight:700;display:none}#wrap .section-1 .right-robot{position:relative;bottom:-50px;animation:robot 1s infinite alternate}#wrap .video-section{padding:200px 0 100px;font-family:"NEXONLv1Gothic"}#wrap .video-section .inner .video-wrap{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden}#wrap .video-section .inner .video-wrap iframe{position:absolute;top:0;left:0;width:100%;height:100%}#wrap .video-section .inner h3{font-weight:bold;text-align:center;margin:180px 0 30px;font-size:2rem;color:var(--bs-blue-primary)}#wrap .video-section .inner .join-text{text-align:center;font-size:1.15rem;opacity:.7}#wrap .video-section .inner .tit-container{width:100%;text-align:center}#wrap .video-section .inner .tit-container .sub-tit-en{color:var(--bs-blue-primary);font-weight:700;font-size:26px;margin-bottom:2rem}#wrap .video-section .inner .tit-container h2{font-size:46px;font-weight:700;line-height:1.2;margin-bottom:2rem}#wrap .video-section .inner .tit-container .sub-tit-kr{color:#4d4d4d;line-height:1.4;font-size:20px}#wrap .promotion-section .logo-slide-container{margin-top:40px}#wrap .promotion-section .logo-slide-container .slide{width:100%;height:300px}#wrap .promotion-section .logo-slide-container .slide.slide-1{margin:-180px 0;background:url(/static/media/infinite-logo-1.5f7f9b722cc700235a5f.svg) 0/3000px repeat-x;animation:slideLeft-data-v-003e81a0 100s linear infinite}#wrap .promotion-section .logo-slide-container .slide.slide-2{margin:-180px 0;background:url(/static/media/infinite-logo-2.cb62f8614468e8e37adb.svg) 0/3000px repeat-x;animation:slideRight-data-v-003e81a0 100s linear infinite}@keyframes slideLeft-data-v-003e81a0{0%{background-position:0}100%{background-position:-3000px}}@keyframes slideRight-data-v-003e81a0{0%{background-position:-3000px}100%{background-position:0}}#wrap .section-2{padding:200px 0}#wrap .section-2 .inner{width:1180px}#wrap .section-2 .left{width:40%}#wrap .section-2 .left .sub-tit-en{color:var(--bs-blue-primary);font-weight:700;font-size:26px;margin-bottom:2rem}#wrap .section-2 .left h2{font-size:46px;font-weight:700;line-height:1.2;margin-bottom:2rem}#wrap .section-2 .left .sub-tit-kr{color:#4d4d4d;line-height:1.4;font-size:20px;margin-bottom:2rem}#wrap .section-2 .left .request-btn{background-color:var(--bs-blue-primary);color:var(--bs-white);display:inline-flex;align-items:center;gap:.5rem;transition-duration:.3s;padding:20px 24px;cursor:pointer}#wrap .section-2 .left .request-btn:hover{background-color:var(--bs-blue-hovered)}#wrap .section-2 .right{justify-content:flex-end;display:flex;flex-wrap:wrap;gap:1rem;width:50%}#wrap .section-2 .right .right-conts-box{width:260px;background-color:var(--bs-bg-blue-light);padding:2rem;border-radius:16px;box-shadow:0px 4px 4px 0px rgba(0,0,0,.25)}#wrap .section-2 .right .right-conts-box .icon-box{width:60px;height:60px;border-radius:8px;background-color:var(--bs-blue-primary);padding:1rem}#wrap .section-2 .right .right-conts-box .text-box{margin-top:7rem}#wrap .section-2 .right .right-conts-box .text-box .text-tit{font-size:26px;line-height:1.2;font-weight:700;margin-bottom:.7rem}#wrap .section-2 .right .right-conts-box .text-box p{color:#848484;line-height:1.4;font-size:18px}#wrap .section-3{background-color:#eef3fe;padding:160px 0;position:relative}#wrap .section-3 .tit-container{width:100%;text-align:center}#wrap .section-3 .tit-container .sub-tit-en{color:var(--bs-blue-primary);font-weight:700;font-size:26px;margin-bottom:.8rem}#wrap .section-3 .tit-container h2{font-size:46px;font-weight:700;line-height:1.2;margin-bottom:.8rem}#wrap .section-3 .tit-container .sub-tit-kr{color:#4d4d4d;line-height:1.4;font-size:20px}#wrap .section-3 .motivation-list{display:flex;justify-content:center;align-items:flex-start;gap:6rem;width:80%;margin:80px auto 0}#wrap .section-3 .motivation-list::before{content:"";display:block;width:100%;height:1px;background-color:rgba(0,0,0,.17);position:absolute;top:52%;left:0}#wrap .section-3 .motivation-list li{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;z-index:10}#wrap .section-3 .motivation-list li figure{background-color:var(--bs-white);width:80px;height:80px;padding:.5rem;border-radius:8px;border:1px solid #e4e4e4;box-shadow:0px 4px 4px 0px rgba(0,0,0,.25)}#wrap .section-3 .motivation-list li dl{margin-top:1.5rem;text-align:center}#wrap .section-3 .motivation-list li dl dt{font-size:20px;font-weight:700;line-height:1.2;margin-bottom:.8rem}#wrap .section-3 .motivation-list li dl dd{line-height:1.4;font-size:18px;color:#848484}#wrap .section-3 .request-btn{background-color:var(--bs-blue-primary);color:var(--bs-white);display:inline-flex;align-items:center;justify-content:center;position:relative;left:52%;top:30px;transform:translateX(-50%);gap:.5rem;transition-duration:.3s;padding:20px 24px;cursor:pointer}#wrap .section-3 .request-btn:hover{background-color:var(--bs-blue-hovered)}#wrap .section-4{padding:100px 0}#wrap .section-4 .left{width:40%}#wrap .section-4 .left .sub-tit-en{color:var(--bs-blue-primary);font-weight:700;font-size:26px;margin-bottom:2rem}#wrap .section-4 .left h2{font-size:46px;font-weight:700;line-height:1.2;margin-bottom:2rem}#wrap .section-4 .left .sub-tit-kr{color:#4d4d4d;line-height:1.4;font-size:20px;margin-bottom:2rem}#wrap .section-4 .left .request-btn{background-color:var(--bs-blue-primary);color:var(--bs-white);display:inline-flex;align-items:center;gap:.5rem;transition-duration:.3s;padding:20px 24px;cursor:pointer}#wrap .section-4 .left .request-btn:hover{background-color:var(--bs-blue-hovered)}#wrap .section-4 .right li{position:relative;margin-bottom:2rem}#wrap .section-4 .right li figure{width:90%}#wrap .section-4 .right li .text{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:80%}#wrap .section-4 .right li .text .chat-tit{color:var(--bs-blue-primary);font-weight:700;font-size:26px;margin-bottom:.8rem}#wrap .section-4 .right li .text p{color:#848484;font-size:20px;line-height:1.2}#wrap .section-4 .right li:nth-child(2){display:flex;justify-content:flex-end}#wrap .section-4 .right li:nth-child(2) .text{left:50%;text-align:right}#wrap .section-4 .right li:last-child figure{width:90%}#wrap .bold{font-weight:700;padding-left:.3rem}@keyframes robot{100%{transform:rotate(1deg)}}@media screen and (min-width: 1367px)and (max-width: 1440px){#wrap .section-1 .main-title{font-size:4rem}#wrap .section-1 .main-title span{font-size:4rem}#wrap .section-1 .char-main-container{width:40%}#wrap .section-1 .scroll{bottom:60px}#wrap .section-1 .bean-left{width:200px;left:0;top:370px}#wrap .section-1 .start-mk-btn{margin-top:1rem}#wrap .section-1 .sub-title{font-size:1.4rem}}@media screen and (min-width: 1024px)and (max-width: 1366px){#wrap .section-1{height:90vh;padding:17vh 0 15vh}#wrap .section-1 .sub-title{color:var(--bs-white);font-size:1.4rem;margin-bottom:1rem}#wrap .section-1 .main-title{font-size:4rem}#wrap .section-1 .main-title span{font-size:4rem}#wrap .section-1 .char-main-container{bottom:-100px;width:50%}#wrap .section-1 .sparkle-particle{bottom:0;width:110%}#wrap .section-1 .bean-right{width:160px;top:200px}#wrap .section-1 .start-mk-btn{margin-top:1.5rem;padding:1rem 3rem;font-size:16px}#wrap .section-1 .bean-left{width:200px;left:0;top:400px}#wrap .section-2 .inner{width:90%}#wrap .section-2 .inner .right .right-conts-box{width:46%}#wrap .section-4 .right li .text p{font-size:1rem}}@media screen and (min-width: 768px)and (max-width: 1023px){#wrap .section-1{height:95vh}#wrap .section-1 .scroll{bottom:50px}#wrap .section-1 .sub-title{color:var(--bs-white);font-size:1.3rem;margin-bottom:1rem}#wrap .section-1 .main-title{font-size:3rem}#wrap .section-1 .main-title span{font-size:3rem}#wrap .section-1 .char-main-container{bottom:-90px;width:50%}#wrap .section-1 .sparkle-particle{bottom:0;width:110%}#wrap .section-1 .bean-right{width:100px;top:100px}#wrap .section-1 .start-mk-btn{margin-top:1.5rem;padding:1rem 3rem;font-size:16px}#wrap .section-1 .bean-left{width:140px;left:0;top:400px}#wrap .video-section{padding:140px 0 100px}#wrap .video-section .inner h3{margin:120px 0 20px;font-size:1.6rem;line-height:1.4}#wrap .video-section .inner .tit-container h2{font-size:36px}#wrap .promotion-section .logo-slide-container .slide{height:260px}#wrap .section-2{padding:140px 0}#wrap .section-2 .inner{flex-direction:column;width:90%}#wrap .section-2 .inner .right{gap:initial;width:100%;margin-top:5rem;justify-content:space-between}#wrap .section-2 .inner .right .right-conts-box{width:48%}#wrap .section-2 .inner .right .right-conts-box .text-box{margin-top:2rem}#wrap .section-2 .inner .right .right-conts-box .text-box .text-tit{font-size:20px}#wrap .section-2 .inner .right .right-conts-box .text-box p{font-size:1rem}#wrap .section-2 .inner .right .right-conts-box:nth-child(3),#wrap .section-2 .inner .right .right-conts-box:last-child{margin-top:2rem}#wrap .section-2 .inner .left{width:100%}#wrap .section-2 .inner .left h2{font-size:36px}#wrap .section-2 .inner .left .sub-tit-kr{font-size:18px}#wrap .section-3 .tit-container h2{font-size:36px}#wrap .section-3 .tit-container .sub-tit-kr{font-size:18px}#wrap .section-3 .motivation-list{width:100%}#wrap .section-3 .motivation-list::before{top:52%}#wrap .section-3 .motivation-list li dl dt{font-size:18px}#wrap .section-3 .motivation-list li dl dd{font-size:1rem}#wrap .section-4 .inner{flex-direction:column}#wrap .section-4 .inner .right{width:100%;margin-top:3rem}#wrap .section-4 .inner .right li figure{width:90%}#wrap .section-4 .inner .right li:nth-child(2) .text{right:0;left:50%}#wrap .section-4 .inner .left{width:100%}#wrap .section-4 .inner .left h2{font-size:36px;margin-bottom:1rem}#wrap .section-4 .inner .left .sub-tit-kr{font-size:18px}}@media screen and (max-width: 767px){#wrap .section-1{height:95vh;padding:17vh 0 15vh}#wrap .section-1 .sub-title{color:var(--bs-white);font-size:1.2rem;margin-bottom:1rem}#wrap .section-1 .main-title{font-size:2.5rem}#wrap .section-1 .main-title span{font-size:1.7rem}#wrap .section-1 .char-main-container{bottom:-30px;width:70%}#wrap .section-1 .sparkle-particle{bottom:0;width:110%}#wrap .section-1 .bean-right{width:100px;top:100px}#wrap .section-1 .start-mk-btn{margin-top:1.5rem;padding:.8rem 2rem;font-size:14px}#wrap .section-1 .bean-left{width:100px;left:0;top:300px}#wrap .section-1 .scroll{font-size:16px;bottom:50px}#wrap .video-section{padding:80px 0 100px}#wrap .video-section .inner .join-text{line-height:1.4;font-size:1rem}#wrap .video-section .inner h3{margin:120px 0 20px;font-size:28px;line-height:1.4}#wrap .video-section .inner .tit-container .sub-tit-en{font-size:20px;margin-bottom:1rem}#wrap .video-section .inner .tit-container h2{font-size:28px;line-height:1.4}#wrap .promotion-section .logo-slide-container{margin-top:20px}#wrap .promotion-section .logo-slide-container .slide{height:230px}#wrap .promotion-section .logo-slide-container .slide.slide-1{margin:-180px 0;background:url(/static/media/infinite-logo-1.5f7f9b722cc700235a5f.svg) 0/2000px repeat-x;animation:slideLeft-data-v-003e81a0 100s linear infinite}#wrap .promotion-section .logo-slide-container .slide.slide-2{margin:-180px 0;background:url(/static/media/infinite-logo-2.cb62f8614468e8e37adb.svg) 0/2000px repeat-x;animation:slideRight-data-v-003e81a0 100s linear infinite}#wrap .section-2{padding:240px 0 200px}#wrap .section-2 .inner{flex-direction:column;width:90%}#wrap .section-2 .inner .right{gap:initial;width:100%;margin-top:3rem;justify-content:space-between;gap:1rem}#wrap .section-2 .inner .right .right-conts-box{width:100%}#wrap .section-2 .inner .right .right-conts-box .text-box{margin-top:2rem}#wrap .section-2 .inner .right .right-conts-box .text-box p{font-size:1rem}#wrap .section-2 .inner .right .right-conts-box .text-box .text-tit{font-size:18px}#wrap .section-2 .inner .right .right-conts-box:nth-child(3),#wrap .section-2 .inner .right .right-conts-box:last-child{margin-top:0}#wrap .section-2 .inner .left{width:100%}#wrap .section-2 .inner .left h2{font-size:28px;line-height:1.4;margin-bottom:1rem}#wrap .section-2 .inner .left .sub-tit-kr{font-size:1rem}#wrap .section-2 .inner .left .sub-tit-en{font-size:20px;margin-bottom:1rem}#wrap .section-2 .inner .left .request-btn{font-size:186x;padding:20px 24px}#wrap .section-3{padding:60px 0}#wrap .section-3 .tit-container h2{font-size:28px;line-height:1.4}#wrap .section-3 .tit-container .sub-tit-kr{font-size:1rem}#wrap .section-3 .tit-container .sub-tit-en{margin-bottom:1rem;font-size:20px}#wrap .section-3 .motivation-list{width:95%;flex-direction:column;gap:3rem;margin:50px auto 0}#wrap .section-3 .motivation-list::before{top:52%;display:none}#wrap .section-3 .motivation-list li{width:100%}#wrap .section-3 .motivation-list li dl dt{font-size:18px}#wrap .section-3 .motivation-list li dl dd{font-size:16px}#wrap .section-4 .inner{flex-direction:column}#wrap .section-4 .inner .right{width:100%;margin-top:3rem}#wrap .section-4 .inner .right li figure{width:100%}#wrap .section-4 .inner .right li:nth-child(2) .text{width:80%;right:30px}#wrap .section-4 .inner .right .text p{font-size:1rem}#wrap .section-4 .inner .right .text .chat-tit{font-size:20px}#wrap .section-4 .inner .left{width:100%}#wrap .section-4 .inner .left h2{font-size:28px;line-height:1.4;margin-bottom:1rem}#wrap .section-4 .inner .left .sub-tit-en{font-size:20px;margin-bottom:1rem}#wrap .section-4 .inner .left .sub-tit-kr{font-size:1rem;line-height:1.5}#wrap .section-4 .inner .left .request-btn{font-size:14px;padding:20px 24px}}
[data-aos][data-aos][data-aos-duration="50"],body[data-aos-duration="50"] [data-aos]{transition-duration:50ms}[data-aos][data-aos][data-aos-delay="50"],body[data-aos-delay="50"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="50"].aos-animate,body[data-aos-delay="50"] [data-aos].aos-animate{transition-delay:50ms}[data-aos][data-aos][data-aos-duration="100"],body[data-aos-duration="100"] [data-aos]{transition-duration:.1s}[data-aos][data-aos][data-aos-delay="100"],body[data-aos-delay="100"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="100"].aos-animate,body[data-aos-delay="100"] [data-aos].aos-animate{transition-delay:.1s}[data-aos][data-aos][data-aos-duration="150"],body[data-aos-duration="150"] [data-aos]{transition-duration:.15s}[data-aos][data-aos][data-aos-delay="150"],body[data-aos-delay="150"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="150"].aos-animate,body[data-aos-delay="150"] [data-aos].aos-animate{transition-delay:.15s}[data-aos][data-aos][data-aos-duration="200"],body[data-aos-duration="200"] [data-aos]{transition-duration:.2s}[data-aos][data-aos][data-aos-delay="200"],body[data-aos-delay="200"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="200"].aos-animate,body[data-aos-delay="200"] [data-aos].aos-animate{transition-delay:.2s}[data-aos][data-aos][data-aos-duration="250"],body[data-aos-duration="250"] [data-aos]{transition-duration:.25s}[data-aos][data-aos][data-aos-delay="250"],body[data-aos-delay="250"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="250"].aos-animate,body[data-aos-delay="250"] [data-aos].aos-animate{transition-delay:.25s}[data-aos][data-aos][data-aos-duration="300"],body[data-aos-duration="300"] [data-aos]{transition-duration:.3s}[data-aos][data-aos][data-aos-delay="300"],body[data-aos-delay="300"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="300"].aos-animate,body[data-aos-delay="300"] [data-aos].aos-animate{transition-delay:.3s}[data-aos][data-aos][data-aos-duration="350"],body[data-aos-duration="350"] [data-aos]{transition-duration:.35s}[data-aos][data-aos][data-aos-delay="350"],body[data-aos-delay="350"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="350"].aos-animate,body[data-aos-delay="350"] [data-aos].aos-animate{transition-delay:.35s}[data-aos][data-aos][data-aos-duration="400"],body[data-aos-duration="400"] [data-aos]{transition-duration:.4s}[data-aos][data-aos][data-aos-delay="400"],body[data-aos-delay="400"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="400"].aos-animate,body[data-aos-delay="400"] [data-aos].aos-animate{transition-delay:.4s}[data-aos][data-aos][data-aos-duration="450"],body[data-aos-duration="450"] [data-aos]{transition-duration:.45s}[data-aos][data-aos][data-aos-delay="450"],body[data-aos-delay="450"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="450"].aos-animate,body[data-aos-delay="450"] [data-aos].aos-animate{transition-delay:.45s}[data-aos][data-aos][data-aos-duration="500"],body[data-aos-duration="500"] [data-aos]{transition-duration:.5s}[data-aos][data-aos][data-aos-delay="500"],body[data-aos-delay="500"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="500"].aos-animate,body[data-aos-delay="500"] [data-aos].aos-animate{transition-delay:.5s}[data-aos][data-aos][data-aos-duration="550"],body[data-aos-duration="550"] [data-aos]{transition-duration:.55s}[data-aos][data-aos][data-aos-delay="550"],body[data-aos-delay="550"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="550"].aos-animate,body[data-aos-delay="550"] [data-aos].aos-animate{transition-delay:.55s}[data-aos][data-aos][data-aos-duration="600"],body[data-aos-duration="600"] [data-aos]{transition-duration:.6s}[data-aos][data-aos][data-aos-delay="600"],body[data-aos-delay="600"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="600"].aos-animate,body[data-aos-delay="600"] [data-aos].aos-animate{transition-delay:.6s}[data-aos][data-aos][data-aos-duration="650"],body[data-aos-duration="650"] [data-aos]{transition-duration:.65s}[data-aos][data-aos][data-aos-delay="650"],body[data-aos-delay="650"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="650"].aos-animate,body[data-aos-delay="650"] [data-aos].aos-animate{transition-delay:.65s}[data-aos][data-aos][data-aos-duration="700"],body[data-aos-duration="700"] [data-aos]{transition-duration:.7s}[data-aos][data-aos][data-aos-delay="700"],body[data-aos-delay="700"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="700"].aos-animate,body[data-aos-delay="700"] [data-aos].aos-animate{transition-delay:.7s}[data-aos][data-aos][data-aos-duration="750"],body[data-aos-duration="750"] [data-aos]{transition-duration:.75s}[data-aos][data-aos][data-aos-delay="750"],body[data-aos-delay="750"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="750"].aos-animate,body[data-aos-delay="750"] [data-aos].aos-animate{transition-delay:.75s}[data-aos][data-aos][data-aos-duration="800"],body[data-aos-duration="800"] [data-aos]{transition-duration:.8s}[data-aos][data-aos][data-aos-delay="800"],body[data-aos-delay="800"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="800"].aos-animate,body[data-aos-delay="800"] [data-aos].aos-animate{transition-delay:.8s}[data-aos][data-aos][data-aos-duration="850"],body[data-aos-duration="850"] [data-aos]{transition-duration:.85s}[data-aos][data-aos][data-aos-delay="850"],body[data-aos-delay="850"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="850"].aos-animate,body[data-aos-delay="850"] [data-aos].aos-animate{transition-delay:.85s}[data-aos][data-aos][data-aos-duration="900"],body[data-aos-duration="900"] [data-aos]{transition-duration:.9s}[data-aos][data-aos][data-aos-delay="900"],body[data-aos-delay="900"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="900"].aos-animate,body[data-aos-delay="900"] [data-aos].aos-animate{transition-delay:.9s}[data-aos][data-aos][data-aos-duration="950"],body[data-aos-duration="950"] [data-aos]{transition-duration:.95s}[data-aos][data-aos][data-aos-delay="950"],body[data-aos-delay="950"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="950"].aos-animate,body[data-aos-delay="950"] [data-aos].aos-animate{transition-delay:.95s}[data-aos][data-aos][data-aos-duration="1000"],body[data-aos-duration="1000"] [data-aos]{transition-duration:1s}[data-aos][data-aos][data-aos-delay="1000"],body[data-aos-delay="1000"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1000"].aos-animate,body[data-aos-delay="1000"] [data-aos].aos-animate{transition-delay:1s}[data-aos][data-aos][data-aos-duration="1050"],body[data-aos-duration="1050"] [data-aos]{transition-duration:1.05s}[data-aos][data-aos][data-aos-delay="1050"],body[data-aos-delay="1050"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1050"].aos-animate,body[data-aos-delay="1050"] [data-aos].aos-animate{transition-delay:1.05s}[data-aos][data-aos][data-aos-duration="1100"],body[data-aos-duration="1100"] [data-aos]{transition-duration:1.1s}[data-aos][data-aos][data-aos-delay="1100"],body[data-aos-delay="1100"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1100"].aos-animate,body[data-aos-delay="1100"] [data-aos].aos-animate{transition-delay:1.1s}[data-aos][data-aos][data-aos-duration="1150"],body[data-aos-duration="1150"] [data-aos]{transition-duration:1.15s}[data-aos][data-aos][data-aos-delay="1150"],body[data-aos-delay="1150"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1150"].aos-animate,body[data-aos-delay="1150"] [data-aos].aos-animate{transition-delay:1.15s}[data-aos][data-aos][data-aos-duration="1200"],body[data-aos-duration="1200"] [data-aos]{transition-duration:1.2s}[data-aos][data-aos][data-aos-delay="1200"],body[data-aos-delay="1200"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1200"].aos-animate,body[data-aos-delay="1200"] [data-aos].aos-animate{transition-delay:1.2s}[data-aos][data-aos][data-aos-duration="1250"],body[data-aos-duration="1250"] [data-aos]{transition-duration:1.25s}[data-aos][data-aos][data-aos-delay="1250"],body[data-aos-delay="1250"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1250"].aos-animate,body[data-aos-delay="1250"] [data-aos].aos-animate{transition-delay:1.25s}[data-aos][data-aos][data-aos-duration="1300"],body[data-aos-duration="1300"] [data-aos]{transition-duration:1.3s}[data-aos][data-aos][data-aos-delay="1300"],body[data-aos-delay="1300"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1300"].aos-animate,body[data-aos-delay="1300"] [data-aos].aos-animate{transition-delay:1.3s}[data-aos][data-aos][data-aos-duration="1350"],body[data-aos-duration="1350"] [data-aos]{transition-duration:1.35s}[data-aos][data-aos][data-aos-delay="1350"],body[data-aos-delay="1350"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1350"].aos-animate,body[data-aos-delay="1350"] [data-aos].aos-animate{transition-delay:1.35s}[data-aos][data-aos][data-aos-duration="1400"],body[data-aos-duration="1400"] [data-aos]{transition-duration:1.4s}[data-aos][data-aos][data-aos-delay="1400"],body[data-aos-delay="1400"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1400"].aos-animate,body[data-aos-delay="1400"] [data-aos].aos-animate{transition-delay:1.4s}[data-aos][data-aos][data-aos-duration="1450"],body[data-aos-duration="1450"] [data-aos]{transition-duration:1.45s}[data-aos][data-aos][data-aos-delay="1450"],body[data-aos-delay="1450"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1450"].aos-animate,body[data-aos-delay="1450"] [data-aos].aos-animate{transition-delay:1.45s}[data-aos][data-aos][data-aos-duration="1500"],body[data-aos-duration="1500"] [data-aos]{transition-duration:1.5s}[data-aos][data-aos][data-aos-delay="1500"],body[data-aos-delay="1500"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1500"].aos-animate,body[data-aos-delay="1500"] [data-aos].aos-animate{transition-delay:1.5s}[data-aos][data-aos][data-aos-duration="1550"],body[data-aos-duration="1550"] [data-aos]{transition-duration:1.55s}[data-aos][data-aos][data-aos-delay="1550"],body[data-aos-delay="1550"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1550"].aos-animate,body[data-aos-delay="1550"] [data-aos].aos-animate{transition-delay:1.55s}[data-aos][data-aos][data-aos-duration="1600"],body[data-aos-duration="1600"] [data-aos]{transition-duration:1.6s}[data-aos][data-aos][data-aos-delay="1600"],body[data-aos-delay="1600"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1600"].aos-animate,body[data-aos-delay="1600"] [data-aos].aos-animate{transition-delay:1.6s}[data-aos][data-aos][data-aos-duration="1650"],body[data-aos-duration="1650"] [data-aos]{transition-duration:1.65s}[data-aos][data-aos][data-aos-delay="1650"],body[data-aos-delay="1650"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1650"].aos-animate,body[data-aos-delay="1650"] [data-aos].aos-animate{transition-delay:1.65s}[data-aos][data-aos][data-aos-duration="1700"],body[data-aos-duration="1700"] [data-aos]{transition-duration:1.7s}[data-aos][data-aos][data-aos-delay="1700"],body[data-aos-delay="1700"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1700"].aos-animate,body[data-aos-delay="1700"] [data-aos].aos-animate{transition-delay:1.7s}[data-aos][data-aos][data-aos-duration="1750"],body[data-aos-duration="1750"] [data-aos]{transition-duration:1.75s}[data-aos][data-aos][data-aos-delay="1750"],body[data-aos-delay="1750"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1750"].aos-animate,body[data-aos-delay="1750"] [data-aos].aos-animate{transition-delay:1.75s}[data-aos][data-aos][data-aos-duration="1800"],body[data-aos-duration="1800"] [data-aos]{transition-duration:1.8s}[data-aos][data-aos][data-aos-delay="1800"],body[data-aos-delay="1800"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1800"].aos-animate,body[data-aos-delay="1800"] [data-aos].aos-animate{transition-delay:1.8s}[data-aos][data-aos][data-aos-duration="1850"],body[data-aos-duration="1850"] [data-aos]{transition-duration:1.85s}[data-aos][data-aos][data-aos-delay="1850"],body[data-aos-delay="1850"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1850"].aos-animate,body[data-aos-delay="1850"] [data-aos].aos-animate{transition-delay:1.85s}[data-aos][data-aos][data-aos-duration="1900"],body[data-aos-duration="1900"] [data-aos]{transition-duration:1.9s}[data-aos][data-aos][data-aos-delay="1900"],body[data-aos-delay="1900"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1900"].aos-animate,body[data-aos-delay="1900"] [data-aos].aos-animate{transition-delay:1.9s}[data-aos][data-aos][data-aos-duration="1950"],body[data-aos-duration="1950"] [data-aos]{transition-duration:1.95s}[data-aos][data-aos][data-aos-delay="1950"],body[data-aos-delay="1950"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1950"].aos-animate,body[data-aos-delay="1950"] [data-aos].aos-animate{transition-delay:1.95s}[data-aos][data-aos][data-aos-duration="2000"],body[data-aos-duration="2000"] [data-aos]{transition-duration:2s}[data-aos][data-aos][data-aos-delay="2000"],body[data-aos-delay="2000"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2000"].aos-animate,body[data-aos-delay="2000"] [data-aos].aos-animate{transition-delay:2s}[data-aos][data-aos][data-aos-duration="2050"],body[data-aos-duration="2050"] [data-aos]{transition-duration:2.05s}[data-aos][data-aos][data-aos-delay="2050"],body[data-aos-delay="2050"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2050"].aos-animate,body[data-aos-delay="2050"] [data-aos].aos-animate{transition-delay:2.05s}[data-aos][data-aos][data-aos-duration="2100"],body[data-aos-duration="2100"] [data-aos]{transition-duration:2.1s}[data-aos][data-aos][data-aos-delay="2100"],body[data-aos-delay="2100"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2100"].aos-animate,body[data-aos-delay="2100"] [data-aos].aos-animate{transition-delay:2.1s}[data-aos][data-aos][data-aos-duration="2150"],body[data-aos-duration="2150"] [data-aos]{transition-duration:2.15s}[data-aos][data-aos][data-aos-delay="2150"],body[data-aos-delay="2150"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2150"].aos-animate,body[data-aos-delay="2150"] [data-aos].aos-animate{transition-delay:2.15s}[data-aos][data-aos][data-aos-duration="2200"],body[data-aos-duration="2200"] [data-aos]{transition-duration:2.2s}[data-aos][data-aos][data-aos-delay="2200"],body[data-aos-delay="2200"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2200"].aos-animate,body[data-aos-delay="2200"] [data-aos].aos-animate{transition-delay:2.2s}[data-aos][data-aos][data-aos-duration="2250"],body[data-aos-duration="2250"] [data-aos]{transition-duration:2.25s}[data-aos][data-aos][data-aos-delay="2250"],body[data-aos-delay="2250"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2250"].aos-animate,body[data-aos-delay="2250"] [data-aos].aos-animate{transition-delay:2.25s}[data-aos][data-aos][data-aos-duration="2300"],body[data-aos-duration="2300"] [data-aos]{transition-duration:2.3s}[data-aos][data-aos][data-aos-delay="2300"],body[data-aos-delay="2300"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2300"].aos-animate,body[data-aos-delay="2300"] [data-aos].aos-animate{transition-delay:2.3s}[data-aos][data-aos][data-aos-duration="2350"],body[data-aos-duration="2350"] [data-aos]{transition-duration:2.35s}[data-aos][data-aos][data-aos-delay="2350"],body[data-aos-delay="2350"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2350"].aos-animate,body[data-aos-delay="2350"] [data-aos].aos-animate{transition-delay:2.35s}[data-aos][data-aos][data-aos-duration="2400"],body[data-aos-duration="2400"] [data-aos]{transition-duration:2.4s}[data-aos][data-aos][data-aos-delay="2400"],body[data-aos-delay="2400"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2400"].aos-animate,body[data-aos-delay="2400"] [data-aos].aos-animate{transition-delay:2.4s}[data-aos][data-aos][data-aos-duration="2450"],body[data-aos-duration="2450"] [data-aos]{transition-duration:2.45s}[data-aos][data-aos][data-aos-delay="2450"],body[data-aos-delay="2450"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2450"].aos-animate,body[data-aos-delay="2450"] [data-aos].aos-animate{transition-delay:2.45s}[data-aos][data-aos][data-aos-duration="2500"],body[data-aos-duration="2500"] [data-aos]{transition-duration:2.5s}[data-aos][data-aos][data-aos-delay="2500"],body[data-aos-delay="2500"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2500"].aos-animate,body[data-aos-delay="2500"] [data-aos].aos-animate{transition-delay:2.5s}[data-aos][data-aos][data-aos-duration="2550"],body[data-aos-duration="2550"] [data-aos]{transition-duration:2.55s}[data-aos][data-aos][data-aos-delay="2550"],body[data-aos-delay="2550"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2550"].aos-animate,body[data-aos-delay="2550"] [data-aos].aos-animate{transition-delay:2.55s}[data-aos][data-aos][data-aos-duration="2600"],body[data-aos-duration="2600"] [data-aos]{transition-duration:2.6s}[data-aos][data-aos][data-aos-delay="2600"],body[data-aos-delay="2600"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2600"].aos-animate,body[data-aos-delay="2600"] [data-aos].aos-animate{transition-delay:2.6s}[data-aos][data-aos][data-aos-duration="2650"],body[data-aos-duration="2650"] [data-aos]{transition-duration:2.65s}[data-aos][data-aos][data-aos-delay="2650"],body[data-aos-delay="2650"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2650"].aos-animate,body[data-aos-delay="2650"] [data-aos].aos-animate{transition-delay:2.65s}[data-aos][data-aos][data-aos-duration="2700"],body[data-aos-duration="2700"] [data-aos]{transition-duration:2.7s}[data-aos][data-aos][data-aos-delay="2700"],body[data-aos-delay="2700"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2700"].aos-animate,body[data-aos-delay="2700"] [data-aos].aos-animate{transition-delay:2.7s}[data-aos][data-aos][data-aos-duration="2750"],body[data-aos-duration="2750"] [data-aos]{transition-duration:2.75s}[data-aos][data-aos][data-aos-delay="2750"],body[data-aos-delay="2750"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2750"].aos-animate,body[data-aos-delay="2750"] [data-aos].aos-animate{transition-delay:2.75s}[data-aos][data-aos][data-aos-duration="2800"],body[data-aos-duration="2800"] [data-aos]{transition-duration:2.8s}[data-aos][data-aos][data-aos-delay="2800"],body[data-aos-delay="2800"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2800"].aos-animate,body[data-aos-delay="2800"] [data-aos].aos-animate{transition-delay:2.8s}[data-aos][data-aos][data-aos-duration="2850"],body[data-aos-duration="2850"] [data-aos]{transition-duration:2.85s}[data-aos][data-aos][data-aos-delay="2850"],body[data-aos-delay="2850"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2850"].aos-animate,body[data-aos-delay="2850"] [data-aos].aos-animate{transition-delay:2.85s}[data-aos][data-aos][data-aos-duration="2900"],body[data-aos-duration="2900"] [data-aos]{transition-duration:2.9s}[data-aos][data-aos][data-aos-delay="2900"],body[data-aos-delay="2900"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2900"].aos-animate,body[data-aos-delay="2900"] [data-aos].aos-animate{transition-delay:2.9s}[data-aos][data-aos][data-aos-duration="2950"],body[data-aos-duration="2950"] [data-aos]{transition-duration:2.95s}[data-aos][data-aos][data-aos-delay="2950"],body[data-aos-delay="2950"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2950"].aos-animate,body[data-aos-delay="2950"] [data-aos].aos-animate{transition-delay:2.95s}[data-aos][data-aos][data-aos-duration="3000"],body[data-aos-duration="3000"] [data-aos]{transition-duration:3s}[data-aos][data-aos][data-aos-delay="3000"],body[data-aos-delay="3000"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="3000"].aos-animate,body[data-aos-delay="3000"] [data-aos].aos-animate{transition-delay:3s}[data-aos][data-aos][data-aos-easing=linear],body[data-aos-easing=linear] [data-aos]{transition-timing-function:cubic-bezier(.25,.25,.75,.75)}[data-aos][data-aos][data-aos-easing=ease],body[data-aos-easing=ease] [data-aos]{transition-timing-function:ease}[data-aos][data-aos][data-aos-easing=ease-in],body[data-aos-easing=ease-in] [data-aos]{transition-timing-function:ease-in}[data-aos][data-aos][data-aos-easing=ease-out],body[data-aos-easing=ease-out] [data-aos]{transition-timing-function:ease-out}[data-aos][data-aos][data-aos-easing=ease-in-out],body[data-aos-easing=ease-in-out] [data-aos]{transition-timing-function:ease-in-out}[data-aos][data-aos][data-aos-easing=ease-in-back],body[data-aos-easing=ease-in-back] [data-aos]{transition-timing-function:cubic-bezier(.6,-.28,.735,.045)}[data-aos][data-aos][data-aos-easing=ease-out-back],body[data-aos-easing=ease-out-back] [data-aos]{transition-timing-function:cubic-bezier(.175,.885,.32,1.275)}[data-aos][data-aos][data-aos-easing=ease-in-out-back],body[data-aos-easing=ease-in-out-back] [data-aos]{transition-timing-function:cubic-bezier(.68,-.55,.265,1.55)}[data-aos][data-aos][data-aos-easing=ease-in-sine],body[data-aos-easing=ease-in-sine] [data-aos]{transition-timing-function:cubic-bezier(.47,0,.745,.715)}[data-aos][data-aos][data-aos-easing=ease-out-sine],body[data-aos-easing=ease-out-sine] [data-aos]{transition-timing-function:cubic-bezier(.39,.575,.565,1)}[data-aos][data-aos][data-aos-easing=ease-in-out-sine],body[data-aos-easing=ease-in-out-sine] [data-aos]{transition-timing-function:cubic-bezier(.445,.05,.55,.95)}[data-aos][data-aos][data-aos-easing=ease-in-quad],body[data-aos-easing=ease-in-quad] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-quad],body[data-aos-easing=ease-out-quad] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-quad],body[data-aos-easing=ease-in-out-quad] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos][data-aos][data-aos-easing=ease-in-cubic],body[data-aos-easing=ease-in-cubic] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-cubic],body[data-aos-easing=ease-out-cubic] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-cubic],body[data-aos-easing=ease-in-out-cubic] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos][data-aos][data-aos-easing=ease-in-quart],body[data-aos-easing=ease-in-quart] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-quart],body[data-aos-easing=ease-out-quart] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-quart],body[data-aos-easing=ease-in-out-quart] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos^=fade][data-aos^=fade]{opacity:0;transition-property:opacity,transform}[data-aos^=fade][data-aos^=fade].aos-animate{opacity:1;transform:translateZ(0)}[data-aos=fade-up]{transform:translate3d(0,100px,0)}[data-aos=fade-down]{transform:translate3d(0,-100px,0)}[data-aos=fade-right]{transform:translate3d(-100px,0,0)}[data-aos=fade-left]{transform:translate3d(100px,0,0)}[data-aos=fade-up-right]{transform:translate3d(-100px,100px,0)}[data-aos=fade-up-left]{transform:translate3d(100px,100px,0)}[data-aos=fade-down-right]{transform:translate3d(-100px,-100px,0)}[data-aos=fade-down-left]{transform:translate3d(100px,-100px,0)}[data-aos^=zoom][data-aos^=zoom]{opacity:0;transition-property:opacity,transform}[data-aos^=zoom][data-aos^=zoom].aos-animate{opacity:1;transform:translateZ(0) scale(1)}[data-aos=zoom-in]{transform:scale(.6)}[data-aos=zoom-in-up]{transform:translate3d(0,100px,0) scale(.6)}[data-aos=zoom-in-down]{transform:translate3d(0,-100px,0) scale(.6)}[data-aos=zoom-in-right]{transform:translate3d(-100px,0,0) scale(.6)}[data-aos=zoom-in-left]{transform:translate3d(100px,0,0) scale(.6)}[data-aos=zoom-out]{transform:scale(1.2)}[data-aos=zoom-out-up]{transform:translate3d(0,100px,0) scale(1.2)}[data-aos=zoom-out-down]{transform:translate3d(0,-100px,0) scale(1.2)}[data-aos=zoom-out-right]{transform:translate3d(-100px,0,0) scale(1.2)}[data-aos=zoom-out-left]{transform:translate3d(100px,0,0) scale(1.2)}[data-aos^=slide][data-aos^=slide]{transition-property:transform}[data-aos^=slide][data-aos^=slide].aos-animate{transform:translateZ(0)}[data-aos=slide-up]{transform:translate3d(0,100%,0)}[data-aos=slide-down]{transform:translate3d(0,-100%,0)}[data-aos=slide-right]{transform:translate3d(-100%,0,0)}[data-aos=slide-left]{transform:translate3d(100%,0,0)}[data-aos^=flip][data-aos^=flip]{-webkit-backface-visibility:hidden;backface-visibility:hidden;transition-property:transform}[data-aos=flip-left]{transform:perspective(2500px) rotateY(-100deg)}[data-aos=flip-left].aos-animate{transform:perspective(2500px) rotateY(0)}[data-aos=flip-right]{transform:perspective(2500px) rotateY(100deg)}[data-aos=flip-right].aos-animate{transform:perspective(2500px) rotateY(0)}[data-aos=flip-up]{transform:perspective(2500px) rotateX(-100deg)}[data-aos=flip-up].aos-animate{transform:perspective(2500px) rotateX(0)}[data-aos=flip-down]{transform:perspective(2500px) rotateX(100deg)}[data-aos=flip-down].aos-animate{transform:perspective(2500px) rotateX(0)}
#wrap .requst-btn{padding:16px 24px;color:var(--bs-white);background-color:var(--bs-blue-primary);border:none;font-size:24px;border-radius:4px;cursor:pointer}#wrap .solution-section-1{width:100%;min-height:100vh;background:linear-gradient(180deg, #eef3fe 80.28%, rgba(238, 243, 254, 0) 100%)}#wrap .solution-section-1 .inner{height:100vh}#wrap .solution-section-1 .inner .left .tit{font-size:56px;line-height:1.3}#wrap .solution-section-1 .inner .left p{margin:2rem 0 4rem;font-size:24px;color:#6b6b6b}#wrap .solution-section-2{width:100%;padding:15vh 0;background:#3343cb;position:relative;overflow:hidden;position:relative;z-index:1}#wrap .solution-section-2 .circle-empty{position:absolute;bottom:-360px;left:0}#wrap .solution-section-2 .circle{position:absolute;top:-210px;right:-130px}#wrap .solution-section-2 .inner{height:100%}#wrap .solution-section-2 .inner .left{width:40%;color:var(--bs-white)}#wrap .solution-section-2 .inner .left h2{font-size:54px;font-weight:900;margin-bottom:4rem}#wrap .solution-section-2 .inner .left ul{display:flex;flex-direction:column;gap:2rem}#wrap .solution-section-2 .inner .left ul li{font-size:24px;line-height:1.4;opacity:.8;position:relative}#wrap .solution-section-2 .inner .left ul li em{font-weight:bold;opacity:1}#wrap .solution-section-2 .inner .left ul li::before{content:"✔";display:inline-block;position:relative;left:-6px;color:var(--bs-white);opacity:.8}#wrap .solution-section-2 .inner .right{width:80%}#wrap .solution-section-3{width:100%;padding:15vh 0;background:#ecebee}#wrap .solution-section-3 .inner{height:100%}#wrap .solution-section-3 .inner .left{width:52%;color:var(--bs-white)}#wrap .solution-section-3 .inner .right{width:40%;text-align:right}#wrap .solution-section-3 .inner .right h2{font-size:54px;font-weight:900;margin-bottom:4rem}#wrap .solution-section-3 .inner .right ul{display:flex;flex-direction:column;gap:2rem}#wrap .solution-section-3 .inner .right ul li{font-size:24px;line-height:1.4;opacity:.6}#wrap .solution-section-3 .inner .right ul li::before{content:"✔";display:inline-block;position:relative;left:-6px}#wrap .solution-section-4{width:100%;padding:15vh 0;background:#edc838;position:relative;overflow:hidden}#wrap .solution-section-4 .circle-big{position:absolute;right:-240px;top:-340px}#wrap .solution-section-4 .circle-small{position:absolute;bottom:-274px;left:-70px}#wrap .solution-section-4 .inner{height:100%;position:relative;z-index:1}#wrap .solution-section-4 .inner .left{width:40%;color:var(--bs-black)}#wrap .solution-section-4 .inner .left h2{font-size:54px;font-weight:900;margin-bottom:4rem}#wrap .solution-section-4 .inner .left ul{display:flex;flex-direction:column;gap:2rem}#wrap .solution-section-4 .inner .left ul li{font-size:24px;line-height:1.4;opacity:.6;position:relative}#wrap .solution-section-4 .inner .left ul li::before{content:"✔";position:relative;left:-6px}#wrap .solution-section-4 .inner .right{width:70%}#wrap .solution-section-5{padding:6rem 0;background-color:#f6f6f6}#wrap .solution-section-5 .inner .tit{margin-bottom:3rem}#wrap .solution-section-5 .inner .accordian-list .accordion-item{border-radius:10px;box-shadow:0 6px 6px rgba(0,0,0,.15);background-color:var(--bs-white);margin-bottom:1rem;cursor:pointer}#wrap .solution-section-5 .inner .accordian-list .accordion-item button{padding:2rem;font-size:1.5rem;font-weight:70;border-radius:10px;background-color:#fff;word-break:keep-all;position:relative;display:flex;align-items:center;width:100%;text-align:left;border:0;font-weight:700;color:var(--bs-black);cursor:pointer;font-family:"NEXONLv1Gothic"}#wrap .solution-section-5 .inner .accordian-list .accordion-item button::after{content:"";width:1.25rem;height:1.25rem;margin-left:auto;transition:transform .2s ease-in-out;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB1SURBVHgB7ZMxDoAgDEVbXQk7XFa4mV4GDsABqg40RJcm4KD2TQwtj5D/Ad7OLB303i/GmNVaC6WUTbqH0kHnHNVzzlm8N8HDqOAHAo7bmXMiCtAJIoaUUrwJ2pz30vaEv+h4fYQBXO/RJqvgS4Ka71F9UZgdk5YnkXDb/6oAAAAASUVORK5CYII=);background-size:24px auto;background-repeat:no-repeat;background-position:100%;padding-left:1rem;box-sizing:content-box;transform:transform .2s ease-in-out}#wrap .solution-section-5 .inner .accordian-list .accordion-item button.show::after{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABGSURBVHgB7c6xFQAhCAPQcFvAsqfLwhjcNdpYSuMzv0qVBCCi88kIZvZmZsMmEWnu3pcBVU0UiYjZ+4zwv+8oUNVDRFf5AFI9EwGzYVHeAAAAAElFTkSuQmCC);transform:rotate(-180deg)}#wrap .solution-section-5 .inner .accordian-list .accordion-item .accordion-collapse:not(.show){display:none}#wrap .solution-section-5 .inner .accordian-list .accordion-item .accordion-collapse:not(.show)::after{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABGSURBVHgB7c6xFQAhCAPQcFvAsqfLwhjcNdpYSuMzv0qVBCCi88kIZvZmZsMmEWnu3pcBVU0UiYjZ+4zwv+8oUNVDRFf5AFI9EwGzYVHeAAAAAElFTkSuQmCC);transform:rotate(-180deg)}#wrap .solution-section-5 .inner .accordian-list .accordion-item .accordion-collapse .accordion-body{background:rgba(0,0,0,0);color:#343434;font-weight:400;font-size:1.125rem;line-height:1.8;padding:0 2rem 2rem}@keyframes move{100%{transform:translateY(-10px)}}@media screen and (min-width: 1023px)and (max-width: 1366px){#wrap .requst-btn{padding:12px 16px;font-size:20px}#wrap .solution-section-1 .inner .left .tit{font-size:48px}#wrap .solution-section-1 .inner .right{width:45%}#wrap .solution-section-2{height:auto;padding:12vh 0}#wrap .solution-section-2 .inner .left h2{margin-bottom:3rem;font-size:42px}#wrap .solution-section-2 .inner .left ul{gap:1.5rem}#wrap .solution-section-2 .inner .left ul li{font-size:20px}#wrap .solution-section-2 .inner .right{width:50%}#wrap .solution-section-3{height:auto;padding:12vh 0}#wrap .solution-section-3 .inner .right{width:50%}#wrap .solution-section-3 .inner .right h2{margin-bottom:3rem;font-size:42px}#wrap .solution-section-3 .inner .right ul{gap:1.5rem}#wrap .solution-section-3 .inner .right ul li{font-size:20px}#wrap .solution-section-4{height:auto;padding:12vh 0}#wrap .solution-section-4 .inner .left h2{margin-bottom:3rem;font-size:42px}#wrap .solution-section-4 .inner .left ul{gap:1.5rem}#wrap .solution-section-4 .inner .left ul li{font-size:20px}#wrap .solution-section-4 .inner .right{width:55%}#wrap .go-guide-section{padding:5rem 0}#wrap .go-guide-section.white{background-color:#f6f6f6}#wrap .go-guide-section .inner h3{text-align:center;font-weight:600;font-size:2rem;color:#272727}#wrap .go-guide-section .inner .arrow{margin:40px auto;display:flex;justify-content:center;width:40px}#wrap .go-guide-section .inner .guide-container{display:flex;align-items:center;justify-content:center;gap:2rem}#wrap .go-guide-section .inner .guide-container .guide-btn{cursor:pointer;padding:1rem;background-color:var(--bs-white);border-radius:4px;border:1px solid #e7e7e7;font-size:1.25rem;color:#565656}}@media screen and (min-width: 901px)and (max-width: 1022px){#wrap .requst-btn{padding:12px 16px;font-size:20px}#wrap .solution-section-1 .inner .left .tit{font-size:48px}#wrap .solution-section-1 .inner .right{width:45%}#wrap .solution-section-2{height:auto;padding:12vh 0}#wrap .solution-section-2 .inner{flex-direction:column-reverse;gap:3rem}#wrap .solution-section-2 .inner .left{width:100%;text-align:center}#wrap .solution-section-2 .inner .left .pc-only{display:none}#wrap .solution-section-2 .inner .left h2{margin-bottom:3rem;font-size:42px}#wrap .solution-section-2 .inner .left ul{gap:1.5rem}#wrap .solution-section-2 .inner .left ul li{font-size:20px}#wrap .solution-section-2 .inner .right{width:70%}#wrap .solution-section-3{height:auto;padding:12vh 0}#wrap .solution-section-3 .inner{flex-direction:column;gap:3rem}#wrap .solution-section-3 .inner .right{width:100%;text-align:center}#wrap .solution-section-3 .inner .right h2{margin-bottom:3rem;font-size:42px}#wrap .solution-section-3 .inner .right ul{gap:1.5rem}#wrap .solution-section-3 .inner .right ul li{font-size:20px}#wrap .solution-section-4{height:auto;padding:12vh 0}#wrap .solution-section-4 .circle-small{display:none}#wrap .solution-section-4 .inner{flex-direction:column-reverse;gap:3rem}#wrap .solution-section-4 .inner .left{width:100%;text-align:center}#wrap .solution-section-4 .inner .left h2{margin-bottom:3rem;font-size:42px}#wrap .solution-section-4 .inner .left ul{gap:1.5rem}#wrap .solution-section-4 .inner .left ul li{font-size:20px}#wrap .solution-section-4 .inner .right{width:60%}}@media screen and (max-width: 900px){#wrap .requst-btn{padding:1rem 28px;font-size:14px}#wrap .solution-section-1{height:auto}#wrap .solution-section-1 .inner{flex-direction:column;justify-content:center;gap:3rem}#wrap .solution-section-1 .inner .left{text-align:center}#wrap .solution-section-1 .inner .left .tit{font-size:28px;line-height:1.5}#wrap .solution-section-1 .inner .left p{margin:1rem 0 2rem;font-size:1rem;line-height:1.4}#wrap .solution-section-1 .inner .right{width:100%}#wrap .solution-section-1 .inner .right figure{width:80%;margin:0 auto}#wrap .solution-section-2{height:auto;padding:12vh 0}#wrap .solution-section-2 .inner{flex-direction:column-reverse;gap:3rem}#wrap .solution-section-2 .inner .left{width:100%;text-align:center}#wrap .solution-section-2 .inner .left .pc-only{display:none}#wrap .solution-section-2 .inner .left h2{margin-bottom:24px;font-size:28px;line-height:1.4}#wrap .solution-section-2 .inner .left ul{gap:24px}#wrap .solution-section-2 .inner .left ul li{font-size:16px}#wrap .solution-section-2 .inner .right{width:90%}#wrap .solution-section-3{height:auto;padding:12vh 0}#wrap .solution-section-3 .inner{flex-direction:column;gap:3rem}#wrap .solution-section-3 .inner .left{width:90%}#wrap .solution-section-3 .inner .right{width:100%;text-align:center}#wrap .solution-section-3 .inner .right h2{margin-bottom:24px;font-size:28px;line-height:1.4}#wrap .solution-section-3 .inner .right ul{gap:24px}#wrap .solution-section-3 .inner .right ul li{font-size:16px}#wrap .solution-section-4{height:auto;padding:12vh 0}#wrap .solution-section-4 .circle-small{display:none}#wrap .solution-section-4 .inner{flex-direction:column-reverse;gap:3rem}#wrap .solution-section-4 .inner .left{width:100%;text-align:center}#wrap .solution-section-4 .inner .left h2{margin-bottom:24px;font-size:28px;line-height:1.4}#wrap .solution-section-4 .inner .left ul{gap:24px}#wrap .solution-section-4 .inner .left ul li{font-size:16px}#wrap .solution-section-4 .inner .right{width:90%}#wrap .solution-section-5{height:auto;padding:12vh 0}#wrap .solution-section-5 .inner .accordian-list .accordion-item button{padding:1.5rem;font-size:1rem}#wrap .solution-section-5 .inner .accordian-list .accordion-item .accordion-collapse .accordion-body{font-size:.95rem}#wrap .go-guide-section .inner .guide-container{flex-direction:column}#wrap .go-guide-section .inner .guide-container .guide-btn{width:80%;text-align:center}}
#wrap .floating-image{max-width:612px;width:100%}#wrap .key-section-1{width:100%;min-height:100vh;background:linear-gradient(180deg, #fff2a6 39.13%, rgba(251, 233, 123, 0) 100%)}#wrap .key-section-1 .inner{height:100vh}#wrap .key-section-1 .inner .left .tit{font-size:56px;line-height:1.3}#wrap .key-section-1 .inner .left p{margin:2rem 0 4rem;font-size:24px;color:#6b6b6b}#wrap .key-section-shortform{width:100%;padding:120px 0 60px}#wrap .key-section-shortform .inner{grid-column-gap:130px}#wrap .key-section-shortform .inner .left{max-width:506px;width:100%;flex:1 1}#wrap .key-section-shortform .inner .left .contents-new{width:160px;animation:scaleUp 1s infinite alternate}#wrap .key-section-shortform .inner .left .en-txt{display:flex;align-items:center;gap:.5rem}#wrap .key-section-shortform .inner .left .en-txt span{color:var(--bs-blue-primary);font-weight:700}#wrap .key-section-shortform .inner .left h2{font-size:54px;font-weight:700;margin:16px 0 50px}#wrap .key-section-shortform .inner .left ul{display:flex;flex-direction:column;gap:1rem}#wrap .key-section-shortform .inner .left ul li{color:#7b7b7b;line-height:1.4;font-size:20px}#wrap .key-section-shortform .inner .right{flex:1 1}#wrap .key-section-2{width:100%;padding:120px 0 60px}#wrap .key-section-2 .inner{grid-column-gap:130px}#wrap .key-section-2 .inner .left{max-width:506px;width:100%;flex:1 1}#wrap .key-section-2 .inner .left .en-txt{display:flex;align-items:center;gap:.5rem}#wrap .key-section-2 .inner .left .en-txt span{color:var(--bs-blue-primary);font-weight:700}#wrap .key-section-2 .inner .left h2{font-size:54px;font-weight:700;margin:16px 0 50px}#wrap .key-section-2 .inner .left ul{display:flex;flex-direction:column;gap:1rem}#wrap .key-section-2 .inner .left ul li{color:#7b7b7b;line-height:1.4;font-size:20px}#wrap .key-section-2 .inner .right{flex:1 1}#wrap .key-section-3{width:100%;padding:60px 0}#wrap .key-section-3 .inner{grid-column-gap:130px}#wrap .key-section-3 .inner .right{max-width:506px;width:100%;flex:1 1}#wrap .key-section-3 .inner .right .en-txt{display:flex;align-items:center;gap:.5rem}#wrap .key-section-3 .inner .right .en-txt span{color:var(--bs-blue-primary);font-weight:700}#wrap .key-section-3 .inner .right h2{font-size:54px;font-weight:700;margin:16px 0 50px}#wrap .key-section-3 .inner .right ul{display:flex;flex-direction:column;gap:1rem}#wrap .key-section-3 .inner .right ul li{color:#7b7b7b;line-height:1.4;font-size:20px}#wrap .key-section-3 .inner .left{flex:1 1}#wrap .key-section-4{width:100%;padding:120px 0 60px}#wrap .key-section-4 .inner{grid-column-gap:130px}#wrap .key-section-4 .inner .left{max-width:506px;width:100%;flex:1 1}#wrap .key-section-4 .inner .left .en-txt{display:flex;align-items:center;gap:.5rem}#wrap .key-section-4 .inner .left .en-txt span{color:var(--bs-blue-primary);font-weight:700}#wrap .key-section-4 .inner .left h2{font-size:54px;font-weight:700;margin:16px 0 50px}#wrap .key-section-4 .inner .left ul{display:flex;flex-direction:column;gap:1rem}#wrap .key-section-4 .inner .left ul li{color:#7b7b7b;line-height:1.4;font-size:20px}#wrap .key-section-4 .inner .right{flex:1 1}#wrap .key-section-5{width:100%;padding:60px 0 120px}#wrap .key-section-5 .inner{grid-column-gap:130px}#wrap .key-section-5 .inner .right{max-width:506px;width:100%;flex:1 1}#wrap .key-section-5 .inner .right .en-txt{display:flex;align-items:center;gap:.5rem}#wrap .key-section-5 .inner .right .en-txt span{color:var(--bs-blue-primary);font-weight:700}#wrap .key-section-5 .inner .right h2{font-size:54px;font-weight:700;margin:16px 0 50px}#wrap .key-section-5 .inner .right ul{display:flex;flex-direction:column;gap:1rem}#wrap .key-section-5 .inner .right ul li{color:#7b7b7b;line-height:1.4;font-size:20px}#wrap .key-section-5 .inner .left{flex:1 1}#wrap .key-section-6{width:100%;padding:120px 0 60px}#wrap .key-section-6 .inner{grid-column-gap:130px}#wrap .key-section-6 .inner .left{max-width:506px;width:100%;flex:1 1}#wrap .key-section-6 .inner .left .en-txt{display:flex;align-items:center;gap:.5rem}#wrap .key-section-6 .inner .left .en-txt span{color:var(--bs-blue-primary);font-weight:700}#wrap .key-section-6 .inner .left h2{font-size:54px;font-weight:700;margin:16px 0 50px}#wrap .key-section-6 .inner .left ul{display:flex;flex-direction:column;gap:1rem}#wrap .key-section-6 .inner .left ul li{color:#7b7b7b;line-height:1.4;font-size:20px}#wrap .key-section-6 .inner .right{flex:1 1}#wrap .go-guide-section{padding:5rem 0}#wrap .go-guide-section.gray{background-color:#f6f6f6}#wrap .go-guide-section .inner{display:flex;flex-direction:column;align-items:center}#wrap .go-guide-section .inner h3{text-align:center;font-weight:600;font-size:2rem;color:#272727}#wrap .go-guide-section .inner .arrow{margin:40px auto;display:flex;justify-content:center;width:40px}#wrap .go-guide-section .inner .start_btn{border:none;font-size:1.25rem;cursor:pointer;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;background:var(--bs-blue-primary);color:var(--bs-white);border-radius:4px;padding:10px}#wrap .go-guide-section .inner .guide-container{display:flex;align-items:center;justify-content:center;gap:2rem}#wrap .go-guide-section .inner .guide-container .guide-btn{cursor:pointer;padding:1rem;background-color:var(--bs-white);border-radius:4px;border:1px solid #e7e7e7;font-size:1.25rem;color:#565656}@media screen and (min-width: 1023px)and (max-width: 1366px){#wrap .key-section-1 .inner .left .tit{font-size:2.625rem}#wrap .key-section-1 .inner .left p{font-size:20px;line-height:1.4}#wrap .key-section-shortform .inner{grid-column-gap:60px}#wrap .key-section-shortform .inner .left h2{font-size:42px;margin:16px 0 40px}#wrap .key-section-2 .inner{grid-column-gap:60px}#wrap .key-section-2 .inner .left h2{font-size:42px;margin:16px 0 40px}#wrap .key-section-3 .inner{grid-column-gap:60px}#wrap .key-section-3 .inner .right h2{font-size:42px;margin:16px 0 40px}#wrap .key-section-4 .inner{grid-column-gap:60px}#wrap .key-section-4 .inner .left h2{font-size:42px;margin:16px 0 40px}#wrap .key-section-5 .inner{grid-column-gap:60px}#wrap .key-section-5 .inner .right h2{font-size:42px;margin:16px 0 40px}#wrap .key-section-6 .inner{grid-column-gap:60px}#wrap .key-section-6 .inner .left h2{font-size:42px;margin:16px 0 40px}}@media screen and (min-width: 901px)and (max-width: 1022px){#wrap .key-section-1 .inner .left .tit{font-size:2.625rem}#wrap .key-section-1 .inner .left p{font-size:20px;line-height:1.4}#wrap .key-section-shortform .inner{grid-column-gap:13%}#wrap .key-section-shortform .inner .left h2{font-size:42px;margin:16px 0 40px}#wrap .key-section-2 .inner{grid-column-gap:13%}#wrap .key-section-2 .inner .left h2{font-size:42px;margin:16px 0 40px}#wrap .key-section-3 .inner{grid-column-gap:13%}#wrap .key-section-3 .inner .right h2{font-size:42px;margin:16px 0 40px}#wrap .key-section-4 .inner{grid-column-gap:13%}#wrap .key-section-4 .inner .left h2{font-size:42px;margin:16px 0 40px}#wrap .key-section-5 .inner{grid-column-gap:13%}#wrap .key-section-5 .inner .right h2{font-size:42px;margin:16px 0 40px}#wrap .key-section-6 .inner{grid-column-gap:13%}#wrap .key-section-6 .inner .left h2{font-size:42px;margin:16px 0 40px}}@media screen and (max-width: 900px){#wrap .floating-image{max-width:560px;width:100%}#wrap .key-section-1{height:auto}#wrap .key-section-1 .inner{flex-direction:column;justify-content:center;gap:3rem}#wrap .key-section-1 .inner .left{text-align:center}#wrap .key-section-1 .inner .left .tit{font-size:28px;line-height:1.4}#wrap .key-section-1 .inner .left p{font-size:1rem;line-height:1.4;margin:1rem 0 2rem}#wrap .key-section-1 .inner .right{width:80%}#wrap .key-section-shortform .inner{grid-column-gap:0;flex-direction:column;gap:36px}#wrap .key-section-shortform .inner .left{display:flex;flex-direction:column;align-items:center;text-align:center}#wrap .key-section-shortform .inner .left h2{font-size:28px;line-height:1.4;margin:16px 0 30px}#wrap .key-section-shortform .inner .left ul li{font-size:1rem}#wrap .key-section-2 .inner{grid-column-gap:0;flex-direction:column;gap:36px}#wrap .key-section-2 .inner .left{display:flex;flex-direction:column;align-items:center;text-align:center}#wrap .key-section-2 .inner .left h2{font-size:28px;line-height:1.4;margin:16px 0 30px}#wrap .key-section-2 .inner .left ul li{font-size:1rem}#wrap .key-section-3 .inner{grid-column-gap:0;flex-direction:column-reverse;gap:36px}#wrap .key-section-3 .inner .right{display:flex;flex-direction:column;align-items:center;text-align:center}#wrap .key-section-3 .inner .right h2{font-size:28px;line-height:1.4;margin:16px 0 30px}#wrap .key-section-3 .inner .right ul li{font-size:1rem}#wrap .key-section-4 .inner{grid-column-gap:0;flex-direction:column;gap:36px}#wrap .key-section-4 .inner .left{display:flex;flex-direction:column;align-items:center;text-align:center}#wrap .key-section-4 .inner .left h2{font-size:28px;line-height:1.4;margin:16px 0 30px}#wrap .key-section-4 .inner .left ul li{font-size:1rem}#wrap .key-section-5 .inner{grid-column-gap:0;flex-direction:column-reverse;gap:36px}#wrap .key-section-5 .inner .right{display:flex;flex-direction:column;align-items:center;text-align:center}#wrap .key-section-5 .inner .right h2{font-size:28px;line-height:1.4;margin:16px 0 30px}#wrap .key-section-5 .inner .right ul li{font-size:1rem}#wrap .key-section-6 .inner{grid-column-gap:0;flex-direction:column;gap:36px}#wrap .key-section-6 .inner .left{display:flex;flex-direction:column;align-items:center;text-align:center}#wrap .key-section-6 .inner .left h2{font-size:28px;line-height:1.4;margin:16px 0 30px}#wrap .key-section-6 .inner .left ul li{font-size:1rem}#wrap .go-guide-section .inner .guide-container{flex-direction:column}#wrap .go-guide-section .inner .guide-container .guide-btn{width:80%;text-align:center}}@keyframes scaleUp{100%{transform:scale(1.2)}}
#wrap .price-section-1{width:100%;min-height:100vh;background:linear-gradient(180deg, #e0ffe2 56.74%, rgba(197, 255, 200, 0) 100%)}#wrap .price-section-1 .inner{height:100vh}#wrap .price-section-1 .inner .left .tit{font-size:56px;line-height:1.3}#wrap .price-section-1 .inner .left p{margin:2rem 0 4rem;font-size:24px;color:#6b6b6b;line-height:1.6}#wrap .price-section-2{width:100%;padding:15vh 0}#wrap .price-section-2 .inner .price-box-container{display:flex;justify-content:center;gap:3rem}#wrap .price-section-2 .inner .price-box-container .price-box{border:1px solid #dcdcdc;border-radius:1rem;padding:4rem 1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;width:500px;position:relative;overflow:hidden}#wrap .price-section-2 .inner .price-box-container .price-box .recommand-tag{position:absolute;top:26px;right:-57px;transform:rotate(45deg);color:var(--bs-white);background-color:#134388;width:200px;text-align:center;padding:5px 52px;font-weight:700;font-size:20px}#wrap .price-section-2 .inner .price-box-container .price-box.basic{border:2px solid #134388;background:#f9fbff}#wrap .price-section-2 .inner .price-box-container .price-box.basic .plan-tit{color:#134388}#wrap .price-section-2 .inner .price-box-container .price-box .plan-tit{font-size:56px;font-weight:bold}#wrap .price-section-2 .inner .price-box-container .price-box .plan-desc{margin:40px 0;text-align:center;font-family:"EduAll";font-size:24px}#wrap .price-section-2 .inner .price-box-container .price-box .plan-desc dt{margin-bottom:1rem;font-weight:bold}#wrap .price-section-2 .inner .price-box-container .price-box .plan-desc dd:not(:last-child){margin-bottom:.5rem}#wrap .price-section-2 .inner .price-box-container .price-box .divider{width:100%;border:.5px solid #d4d4d4}#wrap .price-section-2 .inner .price-box-container .price-box .plan-reward{margin:40px 0;display:flex;flex-direction:column;gap:.5rem}#wrap .price-section-2 .inner .price-box-container .price-box .plan-reward li{font-size:18px;display:flex;align-items:center;line-height:1.4}#wrap .price-section-2 .inner .price-box-container .price-box .plan-reward li::before{content:"•";color:#134388;font-size:40px}#wrap .price-section-2 .inner .price-box-container .price-box .request-small-btn{font-family:"NEXONLv1Gothic";color:var(--bs-white);background-color:var(--bs-blue-primary);border:none;padding:.8rem 1.4rem;border-radius:4px;cursor:pointer;font-size:18px}#wrap .price-section-2 .inner .price-box-container .price-box .request-small-btn.start{position:relative}#wrap .price-section-2 .inner .price-box-container .price-box .request-small-btn.start::before{content:"지금 가입하면 최대 3,500콩 제공!";position:absolute;right:0;top:60px;background-color:#f8de62;color:#1d1d1d;font-family:"EduAll";font-size:18px;padding:.5rem 1rem;border-radius:6px;font-weight:bold;animation:moving-reward .7s linear alternate infinite;width:120%}#wrap .price-section-2 .inner .price-box-container .price-box .request-small-btn.start::after{content:"";position:absolute;top:calc(6px + 100%);right:15px;width:0;height:0;border-left:8px solid rgba(0,0,0,0);border-right:8px solid rgba(0,0,0,0);border-bottom:8px solid #f8de62;animation:moving-tale-reward .7s linear alternate infinite}@keyframes moving-reward{100%{top:62px}}@keyframes moving-tale-reward{100%{top:calc(8px + 100%)}}@media screen and (min-width: 1023px)and (max-width: 1366px){#wrap .price-section-1 .inner .left .tit{font-size:48px}#wrap .price-section-1 .inner .right{width:45%}#wrap .price-section-2 .inner .price-box-container .price-box .plan-tit{font-size:48px}#wrap .price-section-2 .inner .price-box-container .price-box .plan-desc{font-size:22px}#wrap .price-section-2 .inner .price-box-container .price-box .plan-reward li::before{font-size:20px;display:inline-block;margin-right:.5rem}#wrap .price-section-2 .inner .price-box-container .price-box .plan-reward li{font-size:1rem}}@media screen and (min-width: 901px)and (max-width: 1022px){#wrap .price-section-1 .inner .left .tit{font-size:48px}#wrap .price-section-1 .inner .right{width:45%}#wrap .price-section-2 .inner .price-box-container .price-box .plan-tit{font-size:48px}#wrap .price-section-2 .inner .price-box-container .price-box .plan-desc{font-size:22px}#wrap .price-section-2 .inner .price-box-container .price-box .plan-reward li::before{font-size:20px;display:inline-block;margin-right:.5rem}#wrap .price-section-2 .inner .price-box-container .price-box .plan-reward li{font-size:1rem}}@media screen and (max-width: 900px){#wrap .price-section-1{height:auto}#wrap .price-section-1 .inner{flex-direction:column;justify-content:center;gap:3rem}#wrap .price-section-1 .inner .left{text-align:center}#wrap .price-section-1 .inner .left .tit{font-size:28px;line-height:1.4}#wrap .price-section-1 .inner .left p{font-size:16px;margin:1rem 0 2rem}#wrap .price-section-1 .inner .right{width:60%}#wrap .price-section-2{padding:12vh 0}#wrap .price-section-2 .inner .price-box-container{flex-direction:column}#wrap .price-section-2 .inner .price-box-container .price-box{width:100%}#wrap .price-section-2 .inner .price-box-container .price-box .plan-tit{font-size:28px}#wrap .price-section-2 .inner .price-box-container .price-box .plan-desc{font-size:22px}#wrap .price-section-2 .inner .price-box-container .price-box .plan-reward li::before{font-size:20px;display:inline-block;margin-right:.5rem}#wrap .price-section-2 .inner .price-box-container .price-box .plan-reward li{font-size:1rem}}
#wrap .guide-section-1{width:100%;min-height:100vh;background:linear-gradient(180deg, #fadae6 56.74%, rgba(197, 255, 200, 0) 100%)}#wrap .guide-section-1 .inner{height:100vh}#wrap .guide-section-1 .inner .left .tit{font-size:56px;line-height:1.3}#wrap .guide-section-1 .inner .left p{margin:2rem 0 4rem;font-size:24px;color:#6b6b6b}#wrap .guide-section-2{padding:3rem 0 6rem}#wrap .guide-section-2 .inner .service-list{position:relative;display:flex;z-index:3;align-items:center;justify-content:center;flex-wrap:wrap;padding:0;margin:0;transition:all .5s}#wrap .guide-section-2 .inner .service-list li{position:relative;box-sizing:border-box;max-width:33.3%;width:533px;margin:0;padding:40px;color:#272727;cursor:pointer;box-sizing:border-box;transition:all .5s}#wrap .guide-section-2 .inner .service-list li:hover{border:8px solid #f5841f;border-radius:8px}#wrap .guide-section-2 .inner .service-list li .num{position:absolute;top:40px;right:40px;font-weight:400;font-size:24px;line-height:32px}#wrap .guide-section-2 .inner .service-list li .service-title{font-weight:900;font-size:32px;line-height:42px;height:143px}#wrap .guide-section-2 .inner .service-list li .service-description{font-weight:400;font-size:1rem;line-height:24px}#wrap .guide-section-2 .inner .service-list li .service-img{margin-top:24px}@media screen and (min-width: 1023px)and (max-width: 1366px){#wrap .guide-section-1 .inner .left .tit{font-size:2.625rem}#wrap .guide-section-1 .inner .left p{font-size:20px;line-height:1.4}}@media screen and (min-width: 901px)and (max-width: 1022px){#wrap .guide-section-1 .inner .left .tit{font-size:2.625rem}#wrap .guide-section-1 .inner .left p{font-size:20px;line-height:1.4}#wrap .guide-section-2 .inner .service-list{flex-direction:column}#wrap .guide-section-2 .inner .service-list li{max-width:100%}#wrap .guide-section-2 .inner .service-list li .service-title{height:auto;margin-bottom:1rem}}@media screen and (max-width: 900px){#wrap .floating-image{max-width:560px;width:100%}#wrap .guide-section-1{height:auto}#wrap .guide-section-1 .inner{flex-direction:column;justify-content:center;gap:3rem}#wrap .guide-section-1 .inner .left{text-align:center}#wrap .guide-section-1 .inner .left .tit{font-size:28px;line-height:1.4}#wrap .guide-section-1 .inner .left p{font-size:1rem;line-height:1.4;margin:1rem 0 2rem}#wrap .guide-section-1 .inner .right{width:45%}#wrap .guide-section-2 .inner .service-list{flex-direction:column}#wrap .guide-section-2 .inner .service-list li{max-width:100%}#wrap .guide-section-2 .inner .service-list li .service-title{height:auto;margin-bottom:1rem}}
.inquery-section{width:100%;background-color:var(--bs-white);font-family:"nanum";padding:60px 0;position:fixed;z-index:99999;overflow-y:scroll;height:100vh}.inquery-section .inner .arrow-container{display:flex;align-items:center;justify-content:space-between}.inquery-section .inner .arrow-container .logo{width:200px;cursor:pointer}.inquery-section .inner .arrow-container figure{cursor:pointer;width:100px}.inquery-section .inner .tit-area{margin:50px 0}.inquery-section .inner .tit-area h5{font-size:1.25rem;margin-bottom:1rem;font-weight:700}.inquery-section .inner .tit-area h2{font-size:2.25rem;font-weight:500;line-height:1.6}.inquery-section .inner .contact-form{display:flex;align-items:flex-start;border-top:var(--is-border);padding:2rem 0}.inquery-section .inner .contact-form h4{font-size:1.75rem;font-weight:700;flex:0 0 360px}.inquery-section .inner .contact-form .form-check-container{flex:1 1;margin-top:.5rem}.inquery-section .inner .contact-form .form-check-container .form-check{display:block;min-height:1.5rem;margin-bottom:.125rem;padding-left:0;margin-top:.75rem;display:block}.inquery-section .inner .contact-form .form-check-container .form-check input{width:0;opacity:0}.inquery-section .inner .contact-form .form-check-container .form-check input:checked~label::after{transform:scale(1)}.inquery-section .inner .contact-form .form-check-container .form-check label{cursor:pointer;font-size:1.25rem;font-weight:500;padding-left:2rem;position:relative}.inquery-section .inner .contact-form .form-check-container .form-check label::before{content:"";display:block;width:24px;height:24px;border:2px solid #111;border-radius:50%;position:absolute;top:calc(50% - 12px);left:0}.inquery-section .inner .contact-form .form-check-container .form-check label::after{content:"";display:block;width:12px;height:12px;background-color:#111;border-radius:50%;position:absolute;top:calc(50% - 4px);left:8px;transform:scale(0);transform-origin:center center;transition:all .2s ease-in-out 0s}.inquery-section .inner .contact-form .form-row-container{flex:1 1}.inquery-section .inner .contact-form .form-row-container .form-row{margin-top:1.5rem}.inquery-section .inner .contact-form .form-row-container .form-row:nth-of-type(1){margin-top:0}.inquery-section .inner .contact-form .form-row-container .form-row.agree-check{display:flex;align-items:center}.inquery-section .inner .contact-form .form-row-container .form-row.agree-check .checkbox-custom{display:inline-block;width:20px;height:20px;margin-right:10px;border:2px solid #999;cursor:pointer;position:relative}.inquery-section .inner .contact-form .form-row-container .form-row.agree-check .form-check-input:checked+.form-check-label .checkbox-custom::after{content:"";position:absolute;left:5px;top:1px;width:4px;height:8px;border:solid #000;border-width:0 3px 3px 0;transform:rotate(45deg)}.inquery-section .inner .contact-form .form-row-container .form-row.agree-check .form-check-label{display:flex;align-items:center}.inquery-section .inner .contact-form .form-row-container .form-row.agree-check .text{font-weight:normal;color:#000}.inquery-section .inner .contact-form .form-row-container .form-row.agree-check .text em{color:var(--bs-blue-primary);font-weight:bold}.inquery-section .inner .contact-form .form-row-container .form-row.agree-check .form-check-input{display:none}.inquery-section .inner .contact-form .form-row-container .form-row label{font-size:1.25rem;line-height:1.5rem;font-weight:700;margin-bottom:.5rem;display:block}.inquery-section .inner .contact-form .form-row-container .form-row label span{color:var(--bs-blue-primary);margin-left:.15rem}.inquery-section .inner .contact-form .form-row-container .form-row .form-control{min-height:50px;font-size:1rem;display:block;width:100%;padding:.375rem .75rem;font-weight:400;line-height:1.5;color:#212529;background-color:var(--bs-white);background-clip:padding-box;border:1px solid #ced4da;-webkit-appearance:none;appearance:none;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;font-family:"nanum"}.inquery-section .inner .contact-form .form-row-container .form-row .form-control:focus{color:#212529;border-color:#86b7fe;outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.inquery-section .inner .contact-form .form-row-container .form-row select{min-height:50px;font-size:1rem;display:block;width:100%;padding:.375rem .75rem;font-weight:400;line-height:1.5;color:#212529;background-color:var(--bs-white);background-clip:padding-box;border:1px solid #ced4da;font-family:"nanum";transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.inquery-section .inner .contact-form .form-row-container .form-row select:focus{color:#212529;border-color:#86b7fe;outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.inquery-section .inner .contact-form.btn-area button{background-color:var(--bs-blue-primary);color:var(--bs-white);padding:.8rem 2.5rem;cursor:pointer;font-size:1.25rem;font-weight:700;border:none;font-family:"nanum"}.inquery-section .inner .contact-form.btn-area{display:flex;justify-content:flex-end;border-top:var(--is-border);border-end-end-radius:100px;padding:2rem;font-size:1.25rem}.inquery-section .inner .more-info{background-color:#f5f5f5;padding:3.5rem;border-radius:1rem;margin-top:6rem}.inquery-section .inner .more-info h5{font-size:1.75rem;font-weight:700;margin-bottom:1rem}.inquery-section .inner .more-info strong{font-size:3rem;line-height:4rem;position:relative;font-weight:900}.inquery-section .inner .more-info strong::after{content:"";display:block;width:100%;height:3px;background-color:#111;position:absolute;bottom:2px;left:0}.inquery-section .inner .more-info .visit-info{margin-top:3rem}.inquery-section .inner .more-info .visit-info dl{margin-top:1.75rem;display:flex}.inquery-section .inner .more-info .visit-info dl dt{display:inline-flex;align-items:center;flex:200px 0;font-size:1.25rem;font-weight:700}.inquery-section .inner .more-info .visit-info dl dt svg{margin-right:.25rem}.inquery-section .inner .more-info .visit-info dl dd{font-weight:500;font-size:1.25rem;line-height:1.4}@media screen and (max-width: 1022px){.inquery-section .inner .tit-area{text-align:center}.inquery-section .inner .tit-area h2{font-size:1.4rem}.inquery-section .inner .contact-form{flex-direction:column}.inquery-section .inner .contact-form h4{flex:0 0 auto;font-size:1.25rem}.inquery-section .inner .contact-form .form-check-container .form-check{margin-top:2rem}.inquery-section .inner .contact-form .form-row-container{width:100%;margin-top:3rem}.inquery-section .inner .contact-form .form-row-container .form-row label{font-size:1rem}.inquery-section .inner .contact-form.btn-area{padding:0}.inquery-section .inner .contact-form.btn-area button{width:100%;margin-left:0;padding:1.4rem 2.5rem;margin-top:2rem}.inquery-section .inner .form-box{flex-direction:column;border-top:none}.inquery-section .inner .form-box h4{flex:0 0 auto;font-size:1.25rem}.inquery-section .inner .form-box .form-check-container{flex:0 0 auto;width:100%;border-top:var(--is-border);padding:1rem 0;margin-top:.75rem}.inquery-section .inner .form-box .form-check-container .form-check{margin-bottom:3rem}.inquery-section .inner .form-box .form-row-container{flex:0 0 auto;width:100%;border-top:var(--is-border);padding:1rem 0;margin-top:.75rem}.inquery-section .inner .form-box.btn-area{padding:2rem 0}.inquery-section .inner .form-box.btn-area button{width:100%;padding:1.5rem 2.5rem}.inquery-section .inner .more-info{padding:2rem}.inquery-section .inner .more-info h5{font-size:1.1rem}.inquery-section .inner .more-info strong{font-size:2rem}.inquery-section .inner .more-info .visit-info{margin-top:3rem}.inquery-section .inner .more-info .visit-info dl{flex-direction:column}.inquery-section .inner .more-info .visit-info dl dt{flex:auto 0}.inquery-section .inner .more-info .visit-info dl dd{margin:1rem 0;font-size:1rem}}@media screen and (max-width: 700px){.inquery-section .inner .arrow-container figure{width:64px}.inquery-section .inner .arrow-container .logo{width:140px}.inquery-section .inner .form-box .form-row-container .form-row .form-control{font-size:14px}.inquery-section .inner .form-box .form-row-container .form-row select{font-size:14px}.inquery-section .inner .more-info strong{font-size:1.25rem;font-weight:normal}.inquery-section .inner .more-info strong::after{height:1px}}
.kakao-request-btn{position:fixed;bottom:20px;right:20px;width:80px;cursor:pointer;z-index:9999}@media screen and (max-width: 800px){.kakao-request-btn{width:64px}}
.wrap .inner{display:flex;flex-direction:column;align-items:center;padding-top:150px}.wrap .inner h1{font-size:60px;font-weight:700;color:#1a1a1a;margin-bottom:24px}.wrap .inner h2{color:#1a1a1a;font-size:34px;font-weight:700;text-decoration:underline;text-underline-offset:3px;width:100%;margin-bottom:24px}.wrap .inner ul{display:grid;grid-template-columns:repeat(3, 1fr);grid-gap:24px;gap:24px;width:100%;margin-bottom:100px}.wrap .inner ul img{width:100%;height:100%;object-fit:contain}.wrap .inner ul span{color:#1a1a1a;font-size:16px;font-weight:400}.wrap .inner ul div{color:#1a1a1a;font-size:22px;font-weight:700;margin-top:20px;line-height:1.3}.wrap .inner .img_box{height:300px;display:flex;justify-content:center;align-items:center;margin-bottom:24px}@media(max-width: 767px){.inner{margin-top:100px}.inner h1{font-size:28px}.inner h2{font-size:22px}.inner ul{display:flex;flex-direction:column}.inner ul img{margin-bottom:12px}.inner ul span{font-size:14px}.inner ul div{font-size:16px;margin-top:12px}}@media(max-width: 1023px)and (min-width: 768px){.inner h1{font-size:40px}.inner h2{font-size:28px}.inner ul span{font-size:14px}.inner ul div{font-size:18px}.inner ul img{width:100%;height:200px;margin-bottom:24px}}
.nickname-wrap{background-color:#eef3fe;min-height:100vh;overflow:hidden}.nickname-wrap .logo{width:530px;margin-bottom:5rem}.nickname-wrap .nickname-container{width:100%;display:flex}.nickname-wrap .nickname-container .nickname-robot{width:35%;display:flex;position:relative}.nickname-wrap .nickname-container .nickname-robot .box{width:60px;min-height:100vh;background-color:var(--bs-blue-primary);flex-shrink:0;position:relative;z-index:2}.nickname-wrap .nickname-container .nickname-robot .robot-img{flex-shrink:0;position:absolute;left:60px;bottom:0;z-index:99}.nickname-wrap .nickname-container .nickname-form{flex:1 1;display:flex;flex-direction:column;align-items:center;justify-content:center;width:50%}.nickname-wrap .nickname-container .nickname-form h3{font-size:40px;font-weight:700;color:var(--bs-blue-primary)}.nickname-wrap .nickname-container .nickname-form p{margin:1.5rem 0;font-size:32px;color:gray;font-weight:300;margin-bottom:5rem}.nickname-wrap .nickname-container .nickname-form .nick-form{width:50%}.nickname-wrap .nickname-container .nickname-form .nick-form .nick-inputs{display:flex;gap:1rem}.nickname-wrap .nickname-container .nickname-form .nick-form .nick-inputs input[type=text]{border:var(--is-border);padding:2rem;border-radius:4px;font-family:"Maple";font-size:24px;width:80%}.nickname-wrap .nickname-container .nickname-form .nick-form .nick-inputs button{border:var(--is-border);padding:2rem;border-radius:4px;cursor:pointer}.nickname-wrap .nickname-container .nickname-form .nick-form .nick-inputs button figure{width:40px}.nickname-wrap .nickname-container .nickname-form .nick-form .submit-btn{padding:1.25rem;font-family:"Maple";width:100%;display:block;border:none;margin-top:1rem;background-color:var(--bs-blue-primary);color:var(--bs-white);font-weight:700;font-size:18px;border-radius:4px;cursor:pointer;margin-left:0}@media screen and (min-width: 1367px)and (max-width: 1440px){.nickname-wrap .logo{width:360px}.nickname-wrap .nickname-container .nickname-form p{margin-bottom:3rem}}@media screen and (min-width: 1023px)and (max-width: 1366px){.nickname-wrap .logo{width:360px}.nickname-wrap .nickname-container .nickname-form p{margin-bottom:3rem}.nickname-wrap .nickname-container .nickname-form .nick-form{width:80%}}@media screen and (min-width: 901px)and (max-width: 1022px){.nickname-wrap .logo{width:300px}.nickname-wrap .nickname-container .nickname-robot .robot-img{width:100%}.nickname-wrap .nickname-container .nickname-form h3{font-size:28px}.nickname-wrap .nickname-container .nickname-form p{margin-bottom:3rem;font-size:22px}.nickname-wrap .nickname-container .nickname-form .nick-form{width:80%}}@media screen and (max-width: 900px){.nickname-wrap .logo{width:300px}.nickname-wrap .nickname-container{height:100%}.nickname-wrap .nickname-container .nickname-robot{display:none}.nickname-wrap .nickname-container .nickname-robot .robot-img{width:100%}.nickname-wrap .nickname-container .nickname-form h3{font-size:28px}.nickname-wrap .nickname-container .nickname-form p{margin-bottom:3rem;font-size:22px}.nickname-wrap .nickname-container .nickname-form .nick-form{width:80%}}
.contents{background:#92cd81}.contents.sea{background:url(/static/media/kn-shcool-status.872b46fe7a789d7782b4.svg) no-repeat bottom/cover}.contents .teacher-main{padding:40px 0 40px}.contents .teacher-main .inner{max-width:85%;height:100%}.contents .teacher-main .inner .teacher-tab{margin-top:1rem}.contents .teacher-main .inner .teacher-button-container{display:flex;align-items:center;gap:.8rem}.contents .teacher-main .inner .teacher-button-container button{font-family:"Maple";border:none;border-radius:.5rem;padding:.8rem 1.25rem;cursor:pointer;font-size:1rem;display:flex;align-items:center;gap:.25rem;box-shadow:0px 2px 4px 0px rgba(0,0,0,.25)}.contents .teacher-main .inner .teacher-button-container button.bean-distribute-btn{background-color:#d45a4e;border:4px solid #d14347;color:var(--bs-white)}.contents .teacher-main .inner .teacher-button-container button.create-student-id-btn{background-color:#4caf50;border:4px solid #24933e;color:var(--bs-white)}.contents .teacher-main .inner .teacher-button-container button.delete-student-id-btn{background-color:#ff8f00;border:4px solid #dc830d;color:var(--bs-white)}.contents .teacher-main .inner .teacher-button-container button figure{width:24px}.custom-toast-container .Toastify__toast{font-family:"Maple";font-size:16px;padding:12px 20px;border-radius:12px;min-height:auto;position:fixed;z-index:100 !important;width:20vw;text-align:center;display:flex;align-items:center;justify-content:center}
.selecte-notice{padding:1rem;font-family:"Maple";position:absolute;left:50%;transform:translateX(-50%);background-color:#fff1ba;border-radius:8px;box-shadow:0px 2px 4px 0px rgba(0,0,0,.25);animation:scale-up 1s infinite alternate}.selected-count{padding:1rem;font-family:"Maple";position:absolute}.toggle-tab-list{display:flex;justify-content:space-between;gap:1rem;margin-top:1.5rem;cursor:pointer}.toggle-tab-list .toggle-button-container button{border:none;background:none;font-size:20px;padding-bottom:.5rem;color:#b8b8b8;cursor:pointer;font-family:"Maple"}.toggle-tab-list .toggle-button-container button.active{border-bottom:2px solid var(--bs-blue-primary);color:var(--bs-blue-primary);font-weight:700}.toggle-tab-list .situation-list{display:flex;justify-content:flex-end;gap:1rem;font-family:"Maple"}.toggle-tab-list .situation-list li{padding:1rem;background-color:var(--bs-bg-blue);box-shadow:0px 2px 4px 0px rgba(0,0,0,.25);border-radius:8px}.toggle-tab-list .situation-list li em{color:var(--bs-blue-primary);font-weight:700;padding-left:.5rem}.tab-contents .options-container{margin-bottom:2rem;margin-left:auto;width:100%;display:flex;justify-content:space-between}.tab-contents .options-container .search-form{flex:1 1}.tab-contents .options-container .search-form .input-search{padding:.8rem .6rem;border-radius:4px;border-color:#f1f1f1;border:1px solid #c2c2c3;width:45%;cursor:pointer}.tab-contents .options-container .search-form button{padding:.8rem 1.5rem;cursor:pointer;border-radius:4px;border:none;margin-left:.5rem;background-color:var(--bs-blue-primary);color:var(--bs-white);font-weight:bold;font-size:14px;transition-duration:.3s}.tab-contents .options-container .search-form button:hover{background-color:var(--bs-blue-hovered)}.tab-contents .options-container .select-wrap{display:flex;align-items:center;gap:1rem}.tab-contents .options-container .select-wrap select{width:33%;font-size:18px;background-color:var(--bs-white);padding:.4rem;cursor:pointer;border:none}.tab-contents .tab-head-conts{display:flex;justify-content:space-between;align-items:flex-end;font-family:"Maple"}.tab-contents .tab-head-conts .conts-left{display:flex;align-items:center;gap:1rem}.tab-contents .tab-head-conts .conts-left figure{width:80px;height:80px;border-radius:50%;background-color:#dcdcdc}.tab-contents .tab-head-conts .conts-left p{font-size:24px;color:#474747;margin-bottom:.5rem}.tab-contents .tab-head-conts .conts-left h3{font-size:28px;font-weight:700}.tab-contents .tab-head-conts .conts-right{padding:1rem;background-color:var(--bs-bg-blue);border-radius:8px}.tab-contents .tab-head-conts .conts-right em{font-weight:bold;color:var(--bs-blue-primary);padding-left:.25rem}.tab-contents .select-date-container{margin:1rem auto}.tab-contents .select-date-container label{margin-right:.5rem}.tab-contents .select-date-container label.month{margin-left:.5rem}.tab-contents .select-date-container select{border:none;padding:.5rem 1rem;border-radius:.25rem}.tab-contents .table-caption-list{display:flex;justify-content:flex-end;margin-top:1rem;gap:1rem}.tab-contents .table-caption-list li{font-family:"Maple"}.tab-contents .table-caption-list li:first-child::before{content:"";display:inline-block;width:12px;height:12px;border-radius:50%;background-color:#f977e8;margin-right:.3rem}.tab-contents .table-caption-list li:nth-child(2)::before{content:"";display:inline-block;width:12px;height:12px;border-radius:50%;background-color:#fbc100;margin-right:.3rem}.tab-contents .table-caption-list li:nth-child(3)::before{content:"";display:inline-block;width:12px;height:12px;border-radius:50%;background-color:#00a072;margin-right:.3rem}.tab-contents .table-caption-list li:nth-child(4)::before{content:"";display:inline-block;width:12px;height:12px;border-radius:50%;background-color:#04cfa0;margin-right:.3rem}.tab-contents .table-caption-list li:nth-child(5)::before{content:"";display:inline-block;width:12px;height:12px;border-radius:50%;background-color:#ee962d;margin-right:.3rem}.tab-contents .table-caption-list li:nth-child(6)::before{content:"";display:inline-block;width:12px;height:12px;border-radius:50%;background-color:#5932ea;margin-right:.3rem}.tab-contents .table-all .student-table-wrapper{width:100%;overflow-x:auto}.tab-contents .table-all .student-table{min-width:1550px;width:100%;margin-top:1rem;text-align:center;table-layout:fixed;font-family:"Maple";color:#121212;overflow-x:scroll}.tab-contents .table-all .student-table thead{line-height:50px;display:table;table-layout:fixed;width:100%;border-bottom:1px solid #eaeaea;border-top:1px solid #eaeaea;background-color:#f7f7f7;border-top-left-radius:6px;border-top-right-radius:6px}.tab-contents .table-all .student-table thead tr th{vertical-align:middle}.tab-contents .table-all .student-table thead tr th.left{border-left:1px solid #eaeaea}.tab-contents .table-all .student-table thead tr th.bottom{border-bottom:1px solid #eaeaea}.tab-contents .table-all .student-table thead tr th.bold{font-weight:900}.tab-contents .table-all .student-table tbody{display:block;max-height:400px;overflow-y:auto;cursor:pointer;background-color:var(--bs-white)}.tab-contents .table-all .student-table tbody tr.selected-row{background-color:#e6e6e6}.tab-contents .table-all .student-table tbody tr:hover{background-color:#e6e6e6}.tab-contents .table-all .student-table tbody tr{border-bottom:1px solid #eaeaea;display:table;width:100%;table-layout:fixed}.tab-contents .table-all .student-table tbody tr td{border-radius:30px;padding:1.2rem .8rem}.tab-contents .table-all .student-table tbody tr td span{padding:1.2rem .8rem;border-radius:24px;color:#121212;font-weight:700}.tab-contents .table-all .student-table tbody tr td span.no-data{color:#bfbfbf;font-weight:lighter}.tab-contents .table-all .student-table tbody tr td .activity-info .count{color:#2563eb;font-weight:900;margin-bottom:.2rem}.tab-contents .table-all .student-table tbody tr td .activity-info .beans{color:gray;font-size:14px}.tab-contents .table-all .student-table tbody td{border-radius:30px;padding:1.2rem .8rem;color:#121212}.tab-contents .table-all .student-table tbody td span{padding:1.2rem .8rem;border-radius:24px;font-weight:700;color:#121212}.tab-contents .all-school-situation{width:100%;text-align:center;table-layout:fixed}.tab-contents .all-school-situation thead{border-bottom:1px solid #222;line-height:50px;display:table;width:100%;table-layout:fixed;width:100%;border-bottom:1px solid #eaeaea;border-top:1px solid #eaeaea;background-color:#f7f7f7}.tab-contents .all-school-situation thead tr th{vertical-align:middle}.tab-contents .all-school-situation thead tr th.left{border-left:1px solid #eaeaea}.tab-contents .all-school-situation thead tr th.bottom{border-bottom:1px solid #eaeaea}.tab-contents .all-school-situation thead tr th.bold{font-weight:900}.tab-contents .all-school-situation tbody{display:block;max-height:600px;overflow-y:auto;cursor:pointer;background:var(--bs-white)}.tab-contents .all-school-situation tbody tr{line-height:60px;border-bottom:1px solid #eaeaea;display:table;width:100%;table-layout:fixed}.tab-contents .all-school-situation tbody tr td.text-red{color:red;font-weight:700}.tab-contents .all-school-situation tbody tr td.text-blue{color:var(--bs-blue-primary);font-weight:700}.tab-contents .info-txt{color:var(--bs-blue-primary);margin-top:1rem}@keyframes scale-up{0%{transform:translateX(-50%) scale(1)}100%{transform:translateX(-50%) scale(1.05)}}@media(orientation: portrait){.contents .teacher-main .tab-contents .student-table tbody{max-height:800px;cursor:pointer}.contents .teacher-main .tab-contents .all-school-situation tbody{max-height:800px;cursor:pointer}}
.usage-btn{position:fixed;bottom:50px;left:50px;width:108px;height:108px;background-color:var(--bs-blue-primary);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;gap:.5rem;z-index:99999}.usage-btn figure{width:30%}.usage-btn span{font-family:"Maple";color:var(--bs-white);text-align:center;line-height:1.2}@media screen and (min-width: 1367px)and (max-width: 1440px){.usage-btn{width:98px;height:98px;right:40px;bottom:40px}.usage-btn figure{width:20%}.usage-btn span{font-family:.8rem}}@media screen and (min-width: 1023px)and (max-width: 1366px){.usage-btn{width:98px;height:98px;right:40px;bottom:40px}.usage-btn figure{width:20%}.usage-btn span{font-family:.8rem}}@media screen and (max-width: 1022px){.usage-btn{width:90px;height:90px;right:40px;bottom:40px;gap:.25rem}.usage-btn figure{width:20%}.usage-btn span{font-family:.4rem}}
.usage-modal{width:100%;min-height:100vh;position:fixed;top:0;left:0;z-index:999999999;background-color:rgba(0,0,0,.8)}.usage-modal .inner{height:100vh !important;overflow-y:auto;padding:2rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;position:relative}.usage-modal .inner h3{color:var(--bs-white);font-family:"Maple";font-size:2.2rem;padding-bottom:1rem}.usage-modal .inner .table-wrapper{max-height:600px;overflow-y:auto;width:100%}.usage-modal .inner .table-wrapper table{width:100%;border-collapse:collapse;font-size:1em;font-family:"nanum";background-color:#f8f9fa}.usage-modal .inner .table-wrapper table thead th{position:-webkit-sticky;position:sticky;top:0;background-color:#dceaf7;z-index:2;background-color:#dceaf7;color:#fff;padding:20px;text-align:left;border:1px solid #d6d6d6;text-align:center;color:#000;font-weight:bold}.usage-modal .inner .table-wrapper table tbody td{border:1px solid #dee2e6;padding:20px;vertical-align:middle}.usage-modal .inner .table-wrapper table body tr:hover{background-color:#f1f1f1}.usage-modal .inner .table-wrapper table th,.usage-modal .inner .table-wrapper table td{text-align:center}.usage-modal .inner .table-wrapper table .rowspan{font-weight:bold}.usage-modal .inner .close-modal-btn{background-color:#ffc377;border:none;border-radius:50%;cursor:pointer;display:flex;justify-content:center;align-items:center;margin-left:auto;padding:.8rem;position:absolute;right:20px;top:50px;width:46px;height:46px}@media screen and (min-width: 1441px)and (max-width: 1540px){.usage-modal .inner h3{font-size:2rem}.usage-modal .inner figure{width:90%}}@media screen and (min-width: 1367px)and (max-width: 1440px){.usage-modal .inner h3{font-size:1.8rem}.usage-modal .inner figure{width:85%}}@media screen and (min-width: 1023px)and (max-width: 1366px){.usage-modal .inner h3{font-size:1.8rem}.usage-modal .inner figure{width:95%}}
.modal-overlay .inner .distribute-bean-modal{background-color:var(--bs-white);padding:1rem;background-color:var(--bs-white);border:8px solid #ea8a37;border-radius:1rem;width:100%;min-height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem;position:relative}.modal-overlay .inner .distribute-bean-modal .distribute-bean-btn{width:13vw}.modal-overlay .inner .distribute-bean-modal .distribute-bean-desc{font-size:1.25rem;line-height:1.4;text-align:center;margin-top:1rem}.modal-overlay .inner .distribute-bean-modal .student-list{margin:1rem 0;display:flex;align-items:center;justify-content:center;gap:.5rem;width:50%}.modal-overlay .inner .distribute-bean-modal .student-list p{color:#535353}.modal-overlay .inner .distribute-bean-modal .count{display:inline-block;width:50%;height:46px;margin:1rem 0;padding:.5rem;font-family:"Maple";border:1px solid #c9c9c9;border-radius:4px}.modal-overlay .inner .distribute-bean-modal .button-group{display:flex;align-items:center;gap:.5rem;margin-top:1rem}.modal-overlay .inner .distribute-bean-modal .button-group button{border:none;padding:.8rem 1.25rem;cursor:pointer;border-radius:4px;display:flex;align-items:center;gap:.25rem}.modal-overlay .inner .distribute-bean-modal .button-group button figure{width:24px}.modal-overlay .inner .distribute-bean-modal .button-group button span{font-size:1.1rem}.modal-overlay .inner .distribute-bean-modal .button-group button.cancel{background-color:#aeaeae;color:var(--bs-white)}.modal-overlay .inner .distribute-bean-modal .button-group button.cancel figure{width:18px}.modal-overlay .inner .distribute-bean-modal .button-group button.confirm{background-color:#d45a4e;color:var(--bs-white)}
.modal-overlay .inner{font-family:"Maple";width:100%}.modal-overlay .inner .create-modal-conts{background-color:var(--bs-white);border:8px solid #ea8a37;border-radius:1rem;width:100%;min-height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem;position:relative}.modal-overlay .inner .create-modal-conts .create-title{width:20vw}.modal-overlay .inner .create-modal-conts .desc{font-size:1rem;margin-top:1rem}.modal-overlay .inner .create-modal-conts .number-of-student{display:inline-block;width:50%;height:46px;margin:1rem 0;padding:.5rem;font-family:"Maple";border:1px solid #c9c9c9;border-radius:4px}.modal-overlay .inner .create-modal-conts .create-id-btn{border:none;background:none;width:9vw;cursor:pointer}.modal-overlay .inner .create-modal-conts .close-modal{border:none;background-color:#ffd23c;padding:.8rem;border-radius:50%;position:absolute;top:10px;right:10px;width:46px;cursor:pointer}.modal-overlay .inner .create-modal-conts .complete-generate-id{font-size:1.25rem;margin-top:1rem}.modal-overlay .inner .create-modal-conts .complete-generate-id em{font-weight:bold;color:var(--bs-blue-primary)}.modal-overlay .inner .create-modal-conts .generated-id-list{width:50%;display:flex;align-items:center;justify-content:center;gap:.5rem;margin:1rem 0}.modal-overlay .inner .create-modal-conts .generated-id-list li{color:#535353}
.slide-up-menu{background-color:rgba(0,0,0,0);transition:background-color .3s ease}.slide-up-menu.show{background-color:rgba(0,0,0,.4)}.slide-up-menu .bean-action-btns{display:flex;align-items:center;gap:.5rem}.slide-up-menu .bean-action-btns .bean-action-label{color:var(--bs-white);font-family:"Maple";font-size:1.1rem}.slide-up-menu .bean-action-btns .bean-action-label em{font-weight:bold;color:#fbc100}.slide-up-menu .bean-action-btns button{cursor:pointer;color:#555}.slide-up-menu .bean-action-btns button.distribute-btn{background-color:#d45a4e;border:1px solid #d14347;color:var(--bs-white);display:flex;align-items:center;gap:.25rem}.slide-up-menu .bean-action-btns button.distribute-btn figure{width:24px}.slide-up-menu .bean-action-btns button.delete-btn{background-color:#ff8f00;border:1px solid #dc830d;color:var(--bs-white);font-weight:900}
.modal-overlay{font-family:"Maple"}.modal-overlay.delete-id .modal-content{top:auto;top:initial;background-color:var(--bs-white);border:8px solid #ea8a37;border-radius:1rem;width:60%;min-height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem;position:relative}.modal-overlay.delete-id .modal-content .delete-title{width:12vw}.modal-overlay.delete-id .modal-content .delete-desc{font-size:1.25rem;line-height:1.6}.modal-overlay.delete-id .modal-content .delete-desc em{color:#f95749;font-weight:bold}.modal-overlay.delete-id .modal-content .modal-buttons button{cursor:pointer;font-size:1.2rem}.modal-overlay.delete-id .modal-content .modal-buttons button.confirm-btn{background-color:#ff8f00}.modal-overlay.delete-id .modal-content .modal-buttons button.cancel-btn{background-color:#aeaeae}
.bean-modal-backdrop{width:100%;height:100vh;background-color:rgba(0,0,0,.7);position:fixed;top:0;left:0;z-index:99999 !important;display:flex;align-items:center;justify-content:center;flex-direction:column}.bean-modal-backdrop .modal-header{width:80%;margin:0 auto 1rem;display:flex;align-items:center;justify-content:space-between;color:var(--bs-white)}.bean-modal-backdrop .modal-header h3{font-size:1.25rem}.bean-modal-backdrop .modal-header button{font-size:1.3rem;font-weight:900;padding:.5rem .7rem;border-radius:50%;border:none;cursor:pointer}.bean-modal-backdrop .bean-history-table{width:80%;margin:0 auto;text-align:center;table-layout:fixed;font-family:"Maple";background-color:#fff;border-radius:.5rem}.bean-modal-backdrop .bean-history-table thead{border-bottom:1px solid #222;line-height:50px;display:table;width:100%;table-layout:fixed;width:100%}.bean-modal-backdrop .bean-history-table tbody{display:block;max-height:500px;overflow-y:auto;cursor:pointer}.bean-modal-backdrop .bean-history-table tbody tr{line-height:60px;border-bottom:1px solid #eaeaea;display:table;width:100%;table-layout:fixed}.bean-modal-backdrop .bean-history-table tbody tr td.text-red{color:red;font-weight:700}.bean-modal-backdrop .bean-history-table tbody tr td.text-blue{color:var(--bs-blue-primary);font-weight:700}
.expired-section{width:100%;min-height:100vh;background-color:rgba(0,0,0,.5);position:fixed;top:0;left:0;z-index:999}.expired-section .inner{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:.5rem}.expired-section .inner figure{width:40%}.expired-section .inner .expired-container{width:80%;padding:2rem;background-color:var(--bs-white);border-radius:.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.25rem}.expired-section .inner .expired-container p{font-family:"Maple";font-size:32px;text-align:center;line-height:1.4}.expired-section .inner .expired-container button{font-family:"Maple";border:none;background:none;color:var(--bs-white);background-color:var(--bs-blue-primary);padding:.8rem 1.5rem;font-size:20px;border-radius:4px;cursor:pointer}@media screen and (min-width: 1367px)and (max-width: 1440px){.expired-section .inner figure{width:30%}}@media screen and (min-width: 1023px)and (max-width: 1366px){.expired-section .inner figure{width:30%}}@media screen and (min-width: 901px)and (max-width: 1022px){.expired-section .inner figure{width:40%}.expired-section .inner .expired-container p{font-size:26px}}@media screen and (max-width: 900px){.expired-section .inner figure{width:50%}.expired-section .inner .expired-container p{font-size:26px}}
.contents.history{background:#7bb3ff}.contents.history .tree-left-top{position:absolute;top:0;display:none;left:0}.contents.history .right-top-tree{position:absolute;top:100px;right:0;display:none;width:15%}.contents.history .grass{position:absolute;top:50%;left:10%;display:none}.contents.history .grass-2{position:absolute;top:10%;right:30%;display:none}.contents.history .con-bottom{position:fixed;width:100%;bottom:0;left:0}.contents.history .con-top{position:fixed;width:100%;top:0;left:0;z-index:1}.contents.history.sea{background:url(/static/media/kn-shcool-status.872b46fe7a789d7782b4.svg) no-repeat bottom/cover}.history-detail{position:relative;z-index:10}.history-detail .remain-beans-container{display:flex;align-items:center;justify-content:space-between;margin-bottom:3rem;font-family:"Maple";padding-top:1rem}.history-detail .remain-beans-container .charge-beans{padding:8px;font-family:"nanum";background-color:var(--bs-blue-primary);border:none;color:var(--bs-white);font-weight:900;border-radius:.25rem;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;background-color:#83c732;box-shadow:0px 2px 4px 0px rgba(0,0,0,.15);position:relative}.history-detail .remain-beans-container .charge-beans figure{width:25%}.history-detail .remain-beans-container .charge-beans span{font-size:1rem}.history-detail .remain-beans-container .left{display:flex;align-items:center;gap:10px}.history-detail .remain-beans-container .history-tit{font-size:40px;font-weight:bold;font-family:"Maple"}.history-detail .remain-beans-container .history-tit em{color:var(--bs-blue-primary)}.history-detail .remain-beans-container .remain-beans{flex-shrink:0}.history-detail .options-container{width:220px;margin-left:auto;margin-bottom:2rem;display:flex;align-items:center;justify-content:space-between}.history-detail .options-container .options{font-size:18px;width:46%;display:inline-block;border:var(--is-border);border-radius:4px}.history-detail .bean-history{width:100%;text-align:center;table-layout:fixed;font-family:"Maple";background-color:hsla(0,0%,100%,.5);border-radius:.5rem}.history-detail .bean-history thead{border-bottom:1px solid #222;line-height:50px;display:table;width:100%;table-layout:fixed;width:100%}.history-detail .bean-history tbody{display:block;max-height:500px;overflow-y:auto;cursor:pointer}.history-detail .bean-history tbody tr{line-height:60px;border-bottom:1px solid #eaeaea;display:table;width:100%;table-layout:fixed}.history-detail .bean-history tbody tr td.text-red{color:red;font-weight:700}.history-detail .bean-history tbody tr td.text-blue{color:var(--bs-blue-primary);font-weight:700}@media(orientation: portrait){.contents .history-detail .bean-history tbody{max-height:800px;cursor:pointer}}@media(max-width: 768px){.contents .history-detail .remain-beans-container{flex-direction:column}.contents .history-detail .remain-beans-container .left{flex-direction:column-reverse;align-items:flex-start;gap:2rem}.contents .history-detail .remain-beans-container .left .history-tit{font-size:20px}.contents .history-detail .remain-beans-container .charge-beans{width:100%;padding:14px;justify-content:center;display:flex;align-items:center;gap:.5rem;background-color:#83c732;box-shadow:0px 2px 4px 0px rgba(0,0,0,.15)}.contents .history-detail .remain-beans-container .charge-beans figure{display:block;width:32px}.contents .history-detail .remain-beans-container .charge-beans span{font-size:1.25rem;font-family:"Maple"}.contents .history-detail .remain-beans-container .remain-beans{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-top:1rem}.contents .history-detail .remain-beans-container .remain-beans figure{width:50%}.contents .history-detail .remain-beans-container .remain-beans p{font-size:20px;font-family:"Maple"}.contents .history-detail .options-container .options{font-size:14px;padding:.4rem}}
.manual-wrap{width:100%;background-color:#f4f7fe;padding:2rem 0;position:relative}.manual-wrap .cover-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;background:#f8f8f8;display:flex;justify-content:center;align-items:center}.manual-wrap .cover-placeholder .spinner{border:4px solid rgba(0,0,0,.1);border-top:4px solid #3498db;border-radius:50%;width:30px;height:30px;animation:spin 1s linear infinite}.manual-wrap .fav-arrow-back{position:fixed;right:50px;top:50px;cursor:pointer;width:100px;display:flex;flex-direction:column;align-items:center;justify-content:center}.manual-wrap .fav-arrow-back::after{content:"뒤로가기";font-family:"EduAll";text-align:center;margin:.5rem;font-size:1.25rem}.manual-wrap .image-frame{width:60%;background-color:var(--bs-white);padding:2rem;margin:0 auto;border-radius:1rem}.manual-wrap .image-frame .manual-image{width:100%;border-radius:1r .25em;overflow:hidden}.manual-wrap .hi-animation{position:fixed;bottom:30px;right:0;cursor:pointer}.manual-wrap .hi-animation::before{content:"Top";font-family:"EduAll";text-align:center;display:inline-block;width:100%;margin-bottom:14px;font-size:1.25rem}
.worksheet-section{width:100%;min-height:100vh;background-color:#e4fafd}.worksheet-section .all-download-container{background-color:#e4fafd;padding:3rem;margin-top:-1.5rem}.worksheet-section .all-download-container .inner{display:flex;align-items:center;justify-content:space-between}.worksheet-section .all-download-container .inner .all-download-left{text-align:center;margin:0 auto}.worksheet-section .all-download-container .inner .all-download-left h3{font-family:"Maple";font-weight:bold;color:var(--bs-blue-primary);font-size:3.2rem;margin-bottom:2rem}.worksheet-section .all-download-container .inner .all-download-left p{font-family:"Maple";line-height:1.5;font-size:32px;letter-spacing:-1.28px}.worksheet-section .all-download-container .inner .all-download-left p.plan-desc{font-size:1.25rem;margin-top:1rem;color:var(--bs-blue-primary)}.worksheet-section .all-download-container .inner .all-download-right{background-color:var(--bs-white);padding:1rem;border:10px solid #dbbc67;border-radius:1.6rem;cursor:pointer;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}.worksheet-section .all-download-container .inner .all-download-right .all-download-pic{width:50%;margin:0 auto}.worksheet-section .all-download-container .inner .all-download-right .right-all-download-container{display:flex;align-items:center;justify-content:center;gap:.5rem}.worksheet-section .all-download-container .inner .all-download-right .right-all-download-container .download-circle{width:15%}.worksheet-section .all-download-container .inner .all-download-right .right-all-download-container .download-circle figure{background-color:var(--bs-blue-primary);border-radius:50%;padding:.8rem}.worksheet-section .all-download-container .inner .all-download-right .right-all-download-container p{font-family:"Maple";color:var(--bs-blue-primary);font-size:2rem;font-weight:bold}@media screen and (min-width: 1441px)and (max-width: 1540px){.worksheet-section .all-download-container .inner .all-download-left h3{font-size:2.8rem}.worksheet-section .all-download-container .inner .all-download-left p{font-size:24px;line-height:1.6}}@media screen and (min-width: 1367px)and (max-width: 1440px){.worksheet-section .all-download-container .inner .all-download-left h3{font-size:2.6rem}.worksheet-section .all-download-container .inner .all-download-left p{font-size:22px;line-height:1.6}}@media screen and (min-width: 1023px)and (max-width: 1366px){.worksheet-section .all-download-container .inner .all-download-left h3{font-size:2.6rem}.worksheet-section .all-download-container .inner .all-download-left p{font-size:22px;line-height:1.6}}@media screen and (min-width: 901px)and (max-width: 1022px){.worksheet-section .all-download-container .inner .all-download-left h3{font-size:2.4rem}.worksheet-section .all-download-container .inner .all-download-left p{font-size:20px;line-height:1.6}}@media screen and (max-width: 900px){.worksheet-section .all-download-container .inner .all-download-left h3{font-size:2.2rem}.worksheet-section .all-download-container .inner .all-download-left p{font-size:18px;line-height:1.6}}
.worksheet-list{display:flex;justify-content:space-between;gap:5rem;padding:3rem 0 8rem;flex-wrap:wrap;font-family:"Maple" !important}.worksheet-list::after{content:"";width:28%}.worksheet-list li{width:28%;flex-shrink:0;cursor:pointer;position:relative}.worksheet-list li .new-badge{background-color:#66bf30;color:var(--bs-white);display:inline-flex;position:absolute;top:10px;right:10px;z-index:99;padding:.5rem 1rem;border-radius:.25rem;font-weight:bold;font-size:14px;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}.worksheet-list li figure{border-radius:.5rem;overflow:hidden;position:relative}.worksheet-list li figure::before{content:"";position:absolute;top:0;left:0;display:block;width:100%;height:100%;border-radius:.5rem;border:solid 4px rgba(112,112,112,.12);z-index:10}.worksheet-list li .worksheet-title{text-align:center;margin-top:1rem;font-size:1.25rem;line-height:1.4;font-weight:bold}.worksheet-list li .hashtags{display:flex;justify-content:center;gap:.8rem;margin-top:1rem}.worksheet-list li .hashtags p{background-color:#e6f6e9;padding:.5rem;border-radius:.25rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}.worksheet-list li .hashtags p.easy{background-color:#add8e6}.worksheet-list li .hashtags p.normal{background-color:#1e90ff;color:var(--bs-white)}.worksheet-list li .hashtags p.hard{background-color:#00008b;color:var(--bs-white)}.worksheet-list li .hashtags p.months{background-color:#edcbb6}.worksheet-list li:hover figure::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:.5rem;background:url(/static/media/detail-view-circle.f4eaae7b5cffbeb6fe99.svg) rgba(53,53,53,.5) no-repeat 50% 50%/124px 124px;z-index:20}@media screen and (min-width: 901px)and (max-width: 1135px){.worksheet-list li{width:45%}}@media screen and (min-width: 768px)and (max-width: 900px){.worksheet-list li{width:100%}}@media screen and (max-width: 767px){.worksheet-list li{width:100%}}
.filter-options{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;margin-top:2rem;font-family:"Maple" !important}.filter-options .input-field{width:100%;display:flex;justify-content:center}.filter-options .input-field input{width:40%;padding:.8rem;border:none;border-radius:.25rem;border:1px solid #ccc}.filter-options .select-field{display:flex;align-items:center;gap:1rem}.filter-options .select-field select{padding:10px;border:1px solid #ccc;border-radius:4px;background-color:#f9f9f9;font-size:1rem;outline:none;transition:border-color .3s ease;-webkit-appearance:none;appearance:none;cursor:pointer;text-align:center}.filter-options .select-field select:hover{border-color:#888}.filter-options .select-field select:focus{border-color:#555}.filter-options .select-field select option{padding:10px}.filter-options .select-field .reset-button{font-size:1rem;padding:10px 20px;cursor:pointer;border:none;border-radius:.25rem;color:var(--bs-white);background-color:#ccc;display:flex;align-items:center;justify-content:center;gap:.25rem}.filter-options .select-field .reset-button figure{width:20%}.filter-options .select-field .reset-button:enabled{background-color:#0056b3}.filter-options .select-field .reset-button:disabled{background-color:#ccc;cursor:not-allowed}.no-results{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:1.5rem;line-height:1.6;margin-top:2rem}.no-results .hints{text-align:center;margin-top:1rem;margin-bottom:1rem;font-size:1.1rem}.no-results .reset-button{border:none;padding:.9rem 1.5rem;font-size:.8rem;background-color:var(--bs-blue-primary);color:var(--bs-white);cursor:pointer;border-radius:.25rem}
.worksheet-detail{width:100%;min-height:100vh;background:#e8fbfd;padding-bottom:3rem;padding-top:60px;font-family:"Maple" !important}.worksheet-detail .inner{background-color:var(--bs-white);padding:2rem}.worksheet-detail .inner .worksheet-prev{display:flex;flex-direction:column;align-items:stretch;gap:.5rem}.worksheet-detail .inner .worksheet-prev .prev-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.worksheet-detail .inner .worksheet-prev .prev-top .view-all-list{display:inline-flex;align-items:center;border:none;justify-content:center;border:none;align-items:center;gap:.3rem;padding:.5rem;border-radius:4px;cursor:pointer}.worksheet-detail .inner .worksheet-prev .prev-top .view-all-list span{color:#393939;font-size:16px}.worksheet-detail .inner .worksheet-prev .prev-top .view-all-list{background-color:#fff;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15);cursor:pointer}.worksheet-detail .inner .worksheet-prev .prev-top .back-to-list{display:inline-flex;align-items:center;border:none;justify-content:center;border:none;align-items:center;gap:.3rem;padding:.5rem;border-radius:4px;cursor:pointer}.worksheet-detail .inner .worksheet-prev .prev-top .back-to-list span{color:#393939;font-size:16px}.worksheet-detail .inner .worksheet-prev .prev-top .back-to-list{background-color:#fff;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15);cursor:pointer;margin-left:auto}.worksheet-detail .inner .worksheet-prev .prev-container{display:flex;gap:2rem}.worksheet-detail .inner .worksheet-prev .prev-container .prev-left{width:35%;flex-shrink:0}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right{flex:1 1;background-color:#fff;display:flex;flex-direction:column;justify-content:center;border-radius:.5rem;position:relative}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container{background-color:#e3f4ff;padding:1rem;border-radius:.5rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15);margin-bottom:2rem}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container .calendar{display:flex;align-items:center;border:none;border:none;display:flex;align-items:center;gap:.3rem;padding:.5rem;border-radius:4px;cursor:pointer}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container .calendar span{color:#393939;font-size:18px}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container .calendar{background-color:#fdf8e9;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.15);cursor:pointer}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container h2{font-size:2.5rem;margin-bottom:1rem}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container .hashtags{display:flex;gap:.8rem;margin-top:1rem}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container .hashtags p{background-color:#e6f6e9;padding:.5rem;border-radius:.25rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container .hashtags p.easy{background-color:#add8e6}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container .hashtags p.normal{background-color:#1e90ff;color:var(--bs-white)}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container .hashtags p.hard{background-color:#00008b;color:var(--bs-white)}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right h3{font-size:2rem;color:var(--bs-blue-primary)}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right h3::after{content:"";display:block;width:100%;height:2px;background-color:var(--bs-blue-primary);margin:1rem 0}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right dl{font-size:1.25rem;line-height:2}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right dl span{margin-right:.5rem}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right dl dd{margin-left:1rem}.worksheet-detail .inner .tip-link-container{margin:5rem 0}.worksheet-detail .inner .tip-link-container h3{font-size:1.8rem;color:var(--bs-blue-primary);font-weight:bold}.worksheet-detail .inner .tip-link-container h3::after{content:"";display:block;width:100%;height:2px;background-color:var(--bs-blue-primary);margin:1rem 0}.worksheet-detail .inner .tip-link-container .tip-box{width:100%;background-color:#fffae6;padding:1rem;border-radius:.5rem;box-shadow:0px 4px 4px 0px rgba(0,0,0,.05);display:flex;align-items:center}.worksheet-detail .inner .tip-link-container .tip-box .guide{padding:0 .5rem;font-weight:900;flex-shrink:0}.worksheet-detail .inner .tip-link-container .tip-box .guide em{padding-left:.25rem}.worksheet-detail .inner .tip-link-container .tip-box .link{font-weight:lighter;color:#888;font-size:15px;line-height:1.2}.worksheet-detail .inner .tip-link-container .tip-box::before{content:"";background:url(/static/media/linked.2e6f76b221c763f410f6.svg) no-repeat center/cover;display:inline-flex;width:16px;height:16px;flex-shrink:0}.worksheet-detail .inner .tip-link-container .tip-box{cursor:pointer}.worksheet-detail .inner .tip-link-container .tip-box:hover{text-decoration:underline}.worksheet-detail .inner .tip-link-container .tip-box:hover{text-decoration:underline}.worksheet-detail .inner .detail-plan-container{margin:5rem 0}.worksheet-detail .inner .detail-plan-container h3{font-size:1.8rem;color:var(--bs-blue-primary);font-weight:bold}.worksheet-detail .inner .detail-plan-container h3::after{content:"";display:block;width:100%;height:2px;background-color:var(--bs-blue-primary);margin:1rem 0}.worksheet-detail .inner .detail-plan-container .realtion{margin-bottom:5rem}.worksheet-detail .inner .detail-plan-container .realtion table{width:100%;table-layout:fixed;border-collapse:collapse}.worksheet-detail .inner .detail-plan-container .realtion table th{padding:1rem;background-color:#e3f4ff;border-left:6px solid #fff}.worksheet-detail .inner .detail-plan-container .realtion table th:first-child{border-left:0}.worksheet-detail .inner .detail-plan-container .realtion table td{text-align:center;padding:1rem 0}.worksheet-detail .inner .detail-plan-container .realtion table td span{line-height:2.1}.worksheet-detail .inner .detail-plan-container .realtion table td span::before{content:"";background:url(/static/media/linked.2e6f76b221c763f410f6.svg) no-repeat center/cover;display:inline-flex;width:16px;height:16px}.worksheet-detail .inner .detail-plan-container .realtion table td span{cursor:pointer}.worksheet-detail .inner .detail-plan-container .realtion table td span:hover{text-decoration:underline}.worksheet-detail .inner .detail-plan-container .prepare p{line-height:1.8;font-size:1.25rem}.worksheet-detail .inner .detail-plan-container .worksheet-all-list{margin-top:4rem}.worksheet-detail .inner .detail-plan-container .worksheet-all-list .extra{margin-top:2rem}.worksheet-detail .inner .detail-plan-container .worksheet-all-list .area{display:flex;gap:1rem}.worksheet-detail .inner .detail-plan-container .worksheet-all-list .area figure{width:30%;cursor:pointer}.worksheet-detail .inner .detail-plan-container .worksheet-all-list .download-btn{background-color:var(--bs-blue-primary);display:flex;align-items:center;justify-content:center;padding:1rem;margin-top:1rem;border-radius:.5rem;gap:.5rem;cursor:pointer;transition-duration:.2s}.worksheet-detail .inner .detail-plan-container .worksheet-all-list .download-btn .download-left{display:flex;align-items:center;justify-content:flex-end;gap:.5rem}.worksheet-detail .inner .detail-plan-container .worksheet-all-list .download-btn .download-left figure{width:7%}.worksheet-detail .inner .detail-plan-container .worksheet-all-list .download-btn .download-left p{color:var(--bs-white);font-size:1.5rem}.worksheet-detail .inner .detail-plan-container .worksheet-all-list .download-btn .download-right{width:32px}.worksheet-detail .inner .detail-plan-container .worksheet-all-list .download-btn:hover{background-color:var(--bs-blue-hovered)}.worksheet-detail .inner .detail-plan-container .worksheet-all-list .download-btn.all-download{background-color:#8bc562}.worksheet-detail .inner .detail-plan-container .worksheet-all-list .download-btn.all-download:hover{background-color:#74ad4c}@media screen and (min-width: 1367px)and (max-width: 1440px){.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container h2{font-size:2.2rem}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right h3{font-size:1.8rem}}@media screen and (min-width: 1023px)and (max-width: 1366px){.worksheet-detail .inner .worksheet-prev .back-to-list{width:9%}}@media screen and (min-width: 901px)and (max-width: 1022px){.worksheet-detail .inner .worksheet-prev .prev-container{flex-direction:column;align-items:center}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right{padding:0}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container{text-align:center}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container .hashtags{justify-content:center}.worksheet-detail .inner .worksheet-prev .prev-container .prev-left{width:40%}.worksheet-detail .inner .worksheet-prev .back-to-list{width:9%}}@media screen and (min-width: 768px)and (max-width: 900px){.worksheet-detail .inner .worksheet-prev .prev-container{flex-direction:column;align-items:center}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right{padding:0}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container{text-align:center}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container .hashtags{justify-content:center}.worksheet-detail .inner .worksheet-prev .prev-container .prev-left{width:40%}.worksheet-detail .inner .worksheet-prev .back-to-list{width:11%}}@media screen and (max-width: 767px){.worksheet-detail .inner .worksheet-prev .prev-container{flex-direction:column;align-items:center}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right{padding:0}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right h3{font-size:1.5rem}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container{text-align:center}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container h2{font-size:1.5rem}.worksheet-detail .inner .worksheet-prev .prev-container .prev-right .plan-tit-container .hashtags{justify-content:center}.worksheet-detail .inner .worksheet-prev .prev-container .prev-left{width:100%}.worksheet-detail .inner .worksheet-prev .back-to-list{width:22%}.worksheet-detail .inner .detail-plan-container h3{font-size:1.5rem}}
.inventory-wrapper{background:url(/static/media/temp-bg.85cbe75de073c3f4a572.svg) no-repeat bottom/cover}
.intro-inner{width:100%;margin:0 auto;display:flex;justify-content:center;font-family:"Maple" !important}.intro-inner .intro-container{width:100%;display:flex;align-items:stretch;justify-content:space-between}.intro-inner .intro-container .intro-left{width:48%;display:flex;flex-direction:column;align-items:stretch;justify-content:stretch}.intro-inner .intro-container .intro-left .left-title{font-size:2rem;margin-top:1rem}.intro-inner .intro-container .intro-left .left-result-container{padding:1rem;background-color:#a4c1e6;margin-top:1rem;border-radius:.5rem;flex-grow:1;display:flex;flex-direction:column;justify-content:center}.intro-inner .intro-container .intro-left .left-result-container .result-title{color:var(--bs-white);text-align:center;font-size:1.25rem}.intro-inner .intro-container .intro-left .left-result-container .result-preview{width:100%;display:flex;align-items:center;justify-content:center;gap:1.5rem;margin-top:1rem}.intro-inner .intro-container .intro-left .left-result-container .result-preview .preview{width:40%}.intro-inner .intro-container .intro-left .left-result-container .result-preview .preview figure{height:400px;overflow:hidden;position:relative}.intro-inner .intro-container .intro-left .left-result-container .result-preview .preview figure img{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:100%;height:100%;object-fit:cover}.intro-inner .intro-container .intro-left .left-result-container .result-preview figcaption{padding:10px 20px;background-color:var(--bs-white);display:inline-block;margin-top:1rem;border-radius:.25rem;justify-content:center;width:100%;text-align:center;color:#66bf30;font-weight:bold;font-size:1.25rem;line-height:1.4}.intro-inner .intro-container .intro-right{background-color:var(--bs-white);width:48%;border-radius:.5rem}.intro-inner .intro-container .intro-right .right-bg-container{padding:1rem;height:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.intro-inner .intro-container .intro-right .right-bg-container .mini-text{font-size:1.25rem}.intro-inner .intro-container .intro-right .right-bg-container .right-title{font-size:2rem;margin:3rem 0}.intro-inner .intro-container .intro-right .right-bg-container .divider{width:100%;height:1px;border:.5px solid #ddd;margin:1rem 0}.intro-inner .intro-container .intro-right .right-bg-container .activity-badge{padding:10px 20px;background-color:gray;border-radius:#b5b5b5;display:inline-block;border-radius:.25rem;color:var(--bs-white)}.intro-inner .intro-container .intro-right .right-bg-container .activity-desc{font-size:1.5rem;line-height:1.8;margin:3rem 0}.intro-inner .intro-container .intro-right .right-bg-container .start-activity{width:100%;border:none;padding:1.25rem 0;border-radius:.25rem;font-size:1.25rem;font-weight:700;background-color:#f2b04e;cursor:pointer}
.test-inner{width:90%;margin:0 auto;position:relative}@keyframes shake{0%{transform:translate(1px, 1px) rotate(0deg)}10%{transform:translate(-1px, -2px) rotate(-1deg)}20%{transform:translate(-3px, 0px) rotate(1deg)}30%{transform:translate(3px, 2px) rotate(0deg)}40%{transform:translate(1px, -1px) rotate(1deg)}50%{transform:translate(-1px, 2px) rotate(-1deg)}60%{transform:translate(-3px, 1px) rotate(0deg)}70%{transform:translate(3px, 1px) rotate(-1deg)}80%{transform:translate(-1px, -1px) rotate(1deg)}90%{transform:translate(1px, 2px) rotate(0deg)}100%{transform:translate(1px, -2px) rotate(-1deg)}}@keyframes fadeIn{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes tada{0%{transform:scale(0.5) rotate(-20deg);opacity:0}20%{transform:scale(1.2) rotate(10deg);opacity:1}40%{transform:scale(0.9) rotate(-5deg)}60%{transform:scale(1.05) rotate(3deg)}80%{transform:scale(1) rotate(0deg)}100%{transform:scale(1) rotate(0deg)}}@keyframes sparkleBackground{0%{background-position:0 0}100%{background-position:100px 100px}}@keyframes sparkle{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.8}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}100%{opacity:1;transform:translateY(0)}}@keyframes fillStar{0%{transform:scale(0.8);opacity:.5}100%{transform:scale(2);opacity:1}}@keyframes glow{0%{box-shadow:0 0 5px rgba(255,235,59,0)}50%{box-shadow:0 0 20px rgba(255,235,59,.7)}100%{box-shadow:0 0 5px rgba(255,235,59,0)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}100%{transform:scale(1)}}.progress-bar{width:60%;height:20px;background-color:#eee;border-radius:10px;overflow:hidden;margin:20px auto;flex-shrink:0}.progress-bar-fill{height:100%;background-color:#4caf50;width:0%;transition:width .4s ease;animation:glow 1s ease-in-out}.character-container{position:relative;width:100%;height:50px;border:none;border-radius:50px;margin:20px 0}.character{position:absolute;bottom:-15px;transform:translateX(-50%);transition:left .5s ease;width:50px}.wrong-gif-container{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:500px;display:none;justify-content:center;align-items:center;z-index:10}.wrong-gif-container.visible{display:flex}.wrong-gif{width:400px;height:auto;z-index:6}.wrong-gif.visible{display:block}.correct-card-container{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.4);border-radius:15px;box-shadow:0 4px 20px rgba(0,0,0,.3);z-index:20;display:flex;flex-direction:column;align-items:center;padding:20px;animation:tada .8s ease-out forwards}.correct-card .close-button{position:absolute;top:10px;right:15px;background:none;border:none;font-size:1.5em;cursor:pointer;color:hotpink;transition:color .3s}.correct-card .close-button:hover{color:#ff1493}.correct-card-container.fade-out{animation:fadeOutScale .5s forwards}.correct-card{position:relative;display:flex;flex-direction:column;align-items:center}.correct-card img{width:100px;height:100px;border-radius:50%;margin-bottom:15px;box-shadow:0 4px 10px rgba(0,0,0,.2)}.correct-card h4{font-family:"Maple";font-size:1.8rem;color:hotpink;margin-bottom:10px;text-shadow:1px 1px 2px rgba(0,0,0,.1)}.correct-card p{font-size:1.2rem;color:#333;text-align:center}.correct-card-container.fade-out{animation:fadeOutScale .5s forwards}.situation-container{display:flex;align-items:stretch;gap:2rem;width:100%}.situation-container .polaroid-card{position:relative;background:#fff;padding:10px 10px 20px 10px;border:10px solid #fff;box-shadow:0 10px 20px rgba(0,0,0,.2);border-radius:10px;max-width:320px;animation:tada .8s ease-out forwards;transform-style:preserve-3d;perspective:1000px;transition:transform .3s;flex-shrink:0}.situation-container .polaroid-card:hover{transform:rotateY(5deg)}.situation-container .polaroid-card .polaroid-image{width:100%;height:auto;border-radius:5px;box-shadow:0 4px 10px rgba(0,0,0,.1)}.situation-container .polaroid-card h4{font-family:"Maple";text-align:center;margin-top:1rem;font-size:1.25rem}.situation-container .situation-text{flex:1 1;flex-direction:column;align-items:center;justify-content:center;position:relative;padding-top:30px}.situation-container .situation-text p{font-family:"Maple";text-align:center;font-size:1.8rem;line-height:2.2;animation:fadeIn .8s ease-in-out}.situation-container .situation-text .situation-btn-container{display:flex;align-items:center;justify-content:center;gap:.5rem;margin:1rem 0;position:absolute;bottom:30px;width:100%}.situation-container .situation-text .situation-btn-container button{border:none;font-family:"Maple";padding:20px 50px;border-radius:5px;font-size:20px;cursor:pointer;transition:background-color .3s ease;color:#fff}.situation-container .situation-text .situation-btn-container button.btn-try-again{background-color:#28a745;transition:background-color .3s ease,transform .2s ease;animation:pulse 1.5s infinite}.situation-container .situation-text .situation-btn-container button.btn-try-again:hover{background-color:hotpink;transform:scale(1.05)}.situation-container .situation-text .situation-btn-container button.btn-go-different{background-color:#fd7e14}.situation-container .situation-text .situation-btn-container button.btn-go-different:hover{background-color:#e67e22}.situation-container .situation-text .btn-next-step{background:linear-gradient(90deg, #00bfff, #1e90ff);color:#fff;border:none;border-radius:50px;padding:15px 30px;font-size:1.2rem;font-weight:bold;text-transform:uppercase;cursor:pointer;box-shadow:0 6px 15px rgba(0,0,255,.3);transition:all .3s ease-in-out;display:flex;align-items:center;justify-content:center;position:absolute;left:50%;transform:translateX(-50%);bottom:30px;margin:0 auto;font-family:"Maple"}.situation-container .situation-text .btn-next-step:hover{background:linear-gradient(90deg, #1e90ff, #00bfff);box-shadow:0 8px 20px rgba(0,0,255,.4)}.shake{animation:shake .5s;animation-iteration-count:1}.union-container{display:flex;align-items:stretch;justify-content:space-between;position:relative}.union-container::before{content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);height:100%;width:20px;display:flex;flex-direction:column;justify-content:center;gap:15px}.union-container::before .punch-hole{width:12px;height:12px;background-color:#fff;border-radius:50%;box-shadow:0 0 2px rgba(0,0,0,.2)}.union-container .union-item{background:linear-gradient(180deg, #ffc5d9 0%, #b8b8d4 50%, #9b9bc1 100%);padding:1rem;border-radius:10px;position:relative}.union-container .union-item.left{width:30%}.union-container .union-item.right{width:69%}.union-container .union-item .common-inner{background-color:#fffcf7;border-radius:10px;height:100%}.union-container .union-item .common-inner.left-inner{padding:2rem;display:flex;flex-direction:column;align-items:center}.union-container .union-item .common-inner.left-inner video{width:80%}.union-container .union-item .common-inner.left-inner .ai-image-figure{width:100%;height:400px;overflow:hidden;position:relative}.union-container .union-item .common-inner.left-inner .ai-image-figure img{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.union-container .union-item .common-inner.left-inner .text-area{width:100%;padding:1rem;font-size:1.5rem;line-height:1.5;font-family:"Maple";text-align:center;margin-top:auto}.union-container .union-item .common-inner.right-inner{width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:2rem}.union-container .union-item .common-inner.right-inner .total-title-container{width:100%;position:relative}.union-container .union-item .common-inner.right-inner .total-title-container .stars-container{display:flex;gap:10px;justify-content:center;float:right}.union-container .union-item .common-inner.right-inner .total-title-container .stars-container .star-icon{width:40px;height:40px;background:url(/static/media/star-empty.6109b367d05b466412d2.svg) no-repeat center center;background-size:contain;transition:transform .3s,background .3s}.union-container .union-item .common-inner.right-inner .total-title-container .stars-container .star-icon.filled{background:url(/static/media/star-filled.4862eb6e50ff6bae93dc.svg) no-repeat center center;transform:scale(2);animation:fillStar .2s ease-in-out}.union-container .union-item .common-inner.right-inner .total-title-container .title-underline{position:relative}.union-container .union-item .common-inner.right-inner .total-title-container .title-underline h3{font-family:"Maple";font-size:2rem;text-align:center;color:#000;margin-bottom:20px;position:relative;animation:fadeIn 1s ease-in-out;margin-bottom:3rem;position:relative;z-index:1}.union-container .union-item .common-inner.right-inner .total-title-container .title-underline figure{position:absolute;top:-20px;left:50%;transform:translateX(-50%);width:55%}.union-container .union-item .common-inner.right-inner .answer-text-container{width:100%;display:flex;justify-content:center;flex-wrap:wrap;gap:1rem;margin-top:1.5rem;cursor:pointer}.union-container .union-item .common-inner.right-inner .answer-text-container .answer-text.four{width:48%;background-color:#f0f0f0;display:flex;align-items:center;font-family:"Maple";font-size:1.25rem;border-radius:200px;overflow:hidden;transition:background-color .3s,transform .2s;box-shadow:0 6px 10px rgba(0,0,0,.15)}.union-container .union-item .common-inner.right-inner .answer-text-container .answer-text.four img{transition-duration:.3s}.union-container .union-item .common-inner.right-inner .answer-text-container .answer-text.four span{transition-duration:.3s}.union-container .union-item .common-inner.right-inner .answer-text-container .answer-text.four:hover{background-color:#f8d66a;transform:translateY(-2px)}.union-container .union-item .common-inner.right-inner .answer-text-container .answer-text.four:hover img{transform:scale(1.2)}.union-container .union-item .common-inner.right-inner .answer-text-container .answer-text.four:hover span{font-size:2.8rem}.union-container .union-item .common-inner.right-inner .answer-text-container .answer-text.four:active{background-color:#f8d66a;transform:translateY(0) img;transform-transform:scale(1.2)}.union-container .union-item .common-inner.right-inner .answer-text-container .answer-text.four figure{width:200px;height:200px;background-color:#faebd7;flex-shrink:0}.union-container .union-item .common-inner.right-inner .answer-text-container .answer-text.four span{font-size:2rem;flex:1 1;text-align:center}.union-container .union-item .common-inner.right-inner .answer-text-container .answer-text.two{width:40%;padding:1rem;border-radius:.5rem;box-shadow:0px 2px 4px 0px rgba(0,0,0,.15);background-color:var(--bs-white);cursor:pointer;transition:all .5s}.union-container .union-item .common-inner.right-inner .answer-text-container .answer-text.two span{font-size:2rem;flex:1 1;text-align:center;font-family:"Maple";display:inline-flex;margin:1rem auto 0;justify-content:center;width:100%}.union-container .union-item .common-inner.right-inner .answer-text-container .answer-text.two:hover{scale:1.2;background-color:#f8d66a}
.review-inner{display:flex;justify-content:center;align-items:center;padding:20px;width:90%;margin:0 auto;position:relative;flex-direction:column;font-family:"Maple" !important}.review-inner .review-container{width:100%;background:#fff;padding:30px;border-radius:10px;box-shadow:0 4px 6px rgba(0,0,0,.1)}.review-inner .review-container .review-title{font-size:2rem;text-align:center;margin-bottom:2rem}.review-inner .review-container .review-desc{text-align:center;color:gray;margin-bottom:2rem}.review-inner .review-container .card-list{width:100%;display:flex;flex-wrap:wrap;gap:20px;justify-content:center}.review-inner .review-container .card-list.more-than-three .polaroid-card-review{width:18%}.review-inner .review-container .card-list .polaroid-card-review{width:22%;padding:10px;background:#fff;border:1px solid #ececec;box-shadow:2px 2px 5px rgba(0,0,0,.1);cursor:pointer;text-align:center;border-radius:5px;transition:transform .2s}.review-inner .review-container .card-list .polaroid-card-review:hover{transform:scale(1.05)}.review-inner .review-container .card-list .polaroid-card-review figure{margin:0;padding:0}.review-inner .review-container .card-list .polaroid-card-review figure img{width:100%;height:auto;border-radius:5px}.review-inner .review-container .card-list .polaroid-card-review h4{margin-top:10px;font-size:2rem;color:#333}.review-inner .review-container .polaroid-card-review{width:22%;padding:10px;background:#fff;border:1px solid #ececec;box-shadow:2px 2px 5px rgba(0,0,0,.1);cursor:pointer;text-align:center;border-radius:5px;transition:transform .2s}.review-inner .review-container .polaroid-card-review:hover{transform:scale(1.05)}.review-inner .review-container .polaroid-card-review figure{margin:0;padding:0}.review-inner .review-container .polaroid-card-review figure img{width:100%;height:auto;border-radius:5px}.review-inner .review-container .polaroid-card-review h4{margin-top:10px;font-size:2rem;color:#333}.review-inner .review-container .card-detail{text-align:center}.review-inner .review-container .card-detail .back-to-list{margin:3rem 0 0;padding:10px 30px;background:#007bff;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background .3s;font-size:1.5rem}.review-inner .review-container .card-detail .back-to-list:hover{background:#0056b3}.review-inner .review-container .card-detail .card-conts{width:100%;display:flex;justify-content:center;align-items:center;gap:2rem}.review-inner .review-container .card-detail .polaroid-card{width:20%}.review-inner .review-container .card-detail p{font-size:2rem;color:#555}.review-inner .btn-container{display:flex;gap:1rem;margin-top:1.5rem;justify-content:center}.review-inner .btn-container button{border:none;padding:12px 24px;font-size:1.3rem;font-weight:600;border-radius:.25rem;cursor:pointer;transition:background-color .3s ease,transform .2s ease;padding:1.2rem 3rem}.review-inner .btn-container button:hover{transform:scale(1.05)}.review-inner .btn-container button:active{transform:scale(0.98)}.review-inner .btn-container .reset-button{background-color:#f44336;color:#fff}.review-inner .btn-container .reset-button:hover{background-color:#d32f2f}.review-inner .btn-container .other-experience-button{background-color:#4caf50;color:#fff}.review-inner .btn-container .other-experience-button:hover{background-color:#388e3c}.text-to-speech-wrapper{margin-bottom:2rem;display:flex;justify-content:center;gap:1.25rem}.text-to-speech-wrapper .text-to-speech-button{border:none;background:none !important;padding:5px;cursor:pointer}.text-to-speech-wrapper .text-to-speech-button img{width:80px;height:80px}.text-to-speech-wrapper .text-to-speech-button:hover{transform:none}.text-to-speech-wrapper .text-to-speech-button:active{transform:none}
.inventory-bg{background:url(/static/media/temp-bg.85cbe75de073c3f4a572.svg) no-repeat bottom/cover}
#mobile-wrap{width:100%;min-height:100vh;height:100vh;background-color:#faf6f3;display:flex}#mobile-wrap .m-inner{width:90%;height:100%;margin:0 auto;display:flex;align-items:center;justify-content:center}#mobile-wrap .m-inner .right-contents{padding:0}#mobile-wrap .m-inner .usage-btn{display:none}#mobile-wrap .m-inner .contents{background:none}#mobile-wrap .m-inner .contents .history-detail .new-header{display:none}#mobile-wrap .m-inner .contents .history-detail .options-container .options{padding:.2rem;font-family:"Maple"}#mobile-wrap .m-inner .contents .history-detail .remain-beans-container .left{gap:1rem}#mobile-wrap .m-inner .contents .history-detail .remain-beans-container .left .history-tit{font-size:1rem}#mobile-wrap .m-inner .contents .history-detail .remain-beans-container .charge-beans{width:70%;margin:0 auto;padding:10px}#mobile-wrap .m-inner .contents .history-detail .remain-beans-container .charge-beans span{font-size:16px}#mobile-wrap .m-inner .contents .history-detail .remain-beans-container .remain-beans figure{display:none}#mobile-wrap .m-inner .contents .history-detail .inner{width:100% !important;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center}#mobile-wrap .m-inner .contents .history-detail .remain-beans-container{margin-bottom:1rem}#mobile-wrap .m-inner .contents .history-detail .bean-history thead{line-height:1.4}#mobile-wrap .m-inner .contents .history-detail .bean-history tbody{max-height:260px;font-size:14px}#mobile-wrap .m-inner .contents .history-detail .bean-history tbody tr{line-height:1.4}
.m-hub-wrapper{width:100%;font-family:"Maple"}.m-hub-wrapper .go-pc{width:90%;margin:0 auto;border-radius:8px;overflow:hidden;box-shadow:0px 2px 4px 0px rgba(0,0,0,.15)}.m-hub-wrapper .m-hub-title{font-size:1.25rem;text-align:center;margin:1rem 0 .25rem}.m-hub-wrapper .m-swiper-item{cursor:pointer}.m-hub-wrapper .m-swiper-item .prev-badge{position:absolute;top:10px;left:10px;width:110px}.m-hub-wrapper .m-swiper-item .m-content-thumb{border-radius:14px;box-shadow:0px 2px 4px 0px rgba(0,0,0,.15)}.m-hub-wrapper .m-swiper-item p{font-size:1.15em;text-align:center;margin-top:.5rem;padding:1rem;background-color:var(--bs-white);border-radius:5px;font-weight:bold;color:#10996e}
.bottom-banner{position:fixed;bottom:0;width:100%;cursor:pointer}
.m-header{position:fixed;width:100%;height:60px;background-color:#fff;display:flex;align-items:center;border-bottom:1px solid #fbeac7;background-color:#fcf5e6;z-index:9999}.m-header .m-header-inner{width:90%;margin:0 auto;display:flex;align-items:center;justify-content:space-between}.m-header .m-header-inner .m-logo{width:120px;cursor:pointer}.m-header .m-header-inner .nav-box{width:40px;height:40px;border-radius:100%;position:relative;background-color:#ff6714;display:flex;align-items:center;justify-content:center;cursor:pointer}.m-header .m-header-inner .nav-box figure{width:24px}.m-header .mobile-menu-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);display:flex;justify-content:flex-end;z-index:9999;font-family:"Maple"}.m-header .mobile-menu-overlay .mobile-menu-content{background-color:#fff;width:250px;height:100%;padding:20px;box-sizing:border-box;position:relative}.m-header .mobile-menu-overlay .mobile-menu-content .menu-close-btn{position:absolute;right:10px;top:10px;background:none;border:none;font-size:16px;cursor:pointer;font-family:"Maple";width:32px;height:32px;background-color:#ff6714;border-radius:50%;color:var(--bs-white);font-weight:bold;cursor:pointer;display:flex;align-items:center;justify-content:center}.m-header .mobile-menu-overlay .mobile-menu-content ul{margin:60px 0 0 0;padding:0;list-style:none}.m-header .mobile-menu-overlay .mobile-menu-content ul li{padding:10px 0;border-bottom:1px solid #eee;cursor:pointer}
.m-upload-wrapper{width:100%;font-family:"Maple" !important}.m-upload-wrapper .m-upload-box-wrapper{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem}.m-upload-wrapper .m-upload-box-wrapper .guide-txt{font-weight:bold;font-size:2rem;margin-bottom:1rem}.m-upload-wrapper .m-upload-box-wrapper .m-upload-box{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:auto;overflow:hidden;background-color:#f5f5f5;padding:3rem 0;border:2px solid #cecece;border-style:dashed;border-radius:4px}.m-upload-wrapper .m-upload-box-wrapper .m-upload-box figure{width:60px}.m-upload-wrapper .m-upload-box-wrapper .m-upload-box p{color:#777;font-size:18px;font-weight:bold}.m-upload-wrapper .m-upload-box-wrapper .m-upload-box .upload-pic{width:30%;display:flex;align-items:center;justify-content:center}.m-upload-wrapper .m-upload-box-wrapper .m-upload-box .sub-txt{color:#e00;font-size:14px;margin-top:1rem}.m-upload-wrapper .m-upload-box-wrapper .upload-pic-btn{font-family:"Maple";border:none;background-color:#f9be06;display:flex;align-items:center;gap:.5rem;padding:.6rem 2rem;border-radius:4px;cursor:pointer}.m-upload-wrapper .m-upload-box-wrapper .upload-pic-btn figure{width:24px}.m-upload-wrapper .m-upload-box-wrapper .upload-pic-btn p{font-size:1rem}.m-upload-wrapper .upload-next-btn{font-weight:900;position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background-color:#10996e;color:#fff;border:none;padding:.8rem 2rem;border-radius:10px;font-size:1rem;cursor:pointer;transition:all .5s ease;display:flex;align-items:center;justify-content:center;width:50%}
.m-selection-wrapper{font-family:"Maple";width:100%}.m-selection-wrapper .m-selection-title{text-align:center;margin-bottom:.5rem;font-size:1.2rem}.m-selection-wrapper .m-selection-desc{font-size:14px;text-align:center;margin-bottom:1rem;color:#10996e;font-weight:900}.m-selection-wrapper .m-selection-item{cursor:pointer;border-radius:14px}.m-selection-wrapper .m-selection-item img{transition-duration:.3s}.m-selection-wrapper .m-selection-item.selected img{transform:scale(1.05);border:8px solid #ffb93e;border-radius:14px}.m-selection-wrapper .m-selection-item .m-content-thumb{border-radius:14px}.m-selection-wrapper .m-selection-item p{font-size:1.15em;text-align:center;margin-top:.5rem;padding:1rem;background-color:var(--bs-white);border-radius:5px;font-weight:bold}.m-selection-wrapper .next-button{font-family:"Maple";font-weight:900;position:fixed;bottom:-100px;left:50%;transform:translateX(-50%);background-color:#ffb93e;color:#fff;border:none;padding:.8rem 2rem;border-radius:10px;font-size:1rem;cursor:pointer;transition:all .5s ease;opacity:0;display:flex;align-items:center;justify-content:center;width:50%}.m-selection-wrapper .next-button.visible{bottom:20px;opacity:1}
.m-result-wrapper{font-family:"Maple"}.m-result-wrapper .m-result-tit{text-align:center;font-weight:900;color:#10996e;margin-bottom:1rem}.m-result-wrapper figure{border-radius:8px;overflow:hidden}.m-result-wrapper .m-option-btn-container{background-color:hsla(0,0%,100%,.9);position:fixed;bottom:0;left:0;z-index:9999;padding:1rem;width:100%;display:flex;align-items:center;justify-content:center;gap:.5rem}.m-result-wrapper .m-option-btn-container button{font-family:"Maple";border:none;padding:.6rem 1.2rem;border-radius:.25rem;cursor:pointer;font-size:1rem;background-color:#add8e6;color:#3a3a3a}.m-result-wrapper .m-option-btn-container button.another-contents-btn{background-color:#ff6714;color:var(--bs-white)}
.go-pc-modal{width:100%;height:100vh;background-color:var(--bs-white);background-color:#faf6f3;position:fixed;top:0;left:0;font-family:"Maple";overflow-y:scroll;overflow-x:hidden}.go-pc-modal .m-characters-section{margin:100px 0 0;position:relative}.go-pc-modal .m-characters-section .m-char-tit{text-align:center;line-height:1.5;font-size:1.25rem;font-weight:900}.go-pc-modal .m-characters-section .m-char-tit span.nikki{color:#10996e}.go-pc-modal .m-characters-section .m-char-tit span.arial{color:#134388}.go-pc-modal .m-characters-section .char{width:80%;margin:0 auto}.go-pc-modal .m-characters-section .star{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:110%;animation:move 1s linear alternate infinite}@keyframes move{from{top:45%}to{top:50%}}.go-pc-modal .m-more-conts-section{margin:4rem 0}.go-pc-modal .m-more-conts-section .m-more-conts-tit{font-weight:900;font-size:18px;width:90%;text-align:center;margin:.5rem auto;color:#10996e}.go-pc-modal .m-more-conts-section .m-recommand-contents img{border-radius:1rem}.go-pc-modal .m-more-conts-section .m-recommand-contents p{color:#1d1d1d;line-height:1.4;margin:1rem 0 .25rem;font-weight:bold}.go-pc-modal .m-more-conts-section .m-recommand-contents span{font-size:14px;opacity:.5}.go-pc-modal .button-container{padding:0 0 4rem;display:flex;align-items:center;justify-content:center}.go-pc-modal .button-container button{border:none;font-family:"Maple";font-size:1rem;padding:.6rem 1.8rem;cursor:pointer;background-color:var(--bs-blue-primary);color:var(--bs-white);border-radius:8px}
.m-making-wrapper{width:100%;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:"Maple" !important;gap:.5rem;position:relative}.m-making-wrapper .m-making-tit{font-size:1.5rem}.m-making-wrapper .m-making-tit span{font-weight:900;color:#10996e}.m-making-wrapper .m-making-char{width:70%}.m-making-wrapper .floating-bean{position:absolute;animation:move-top 1s infinite alternate;z-index:0}.m-making-wrapper .floating-bean.top{right:4px;top:60px;width:70px}.m-making-wrapper .floating-bean.bottom{left:0;bottom:100px;width:100px;transform:scaleX(-1)}.m-making-wrapper .m-making-btn{font-family:"Maple";font-weight:900;position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background-color:#ffb93e;color:#fff;border:none;padding:.8rem 2rem;border-radius:10px;font-size:1rem;cursor:pointer;transition:all .5s ease;display:flex;align-items:center;gap:.5rem}.m-making-wrapper .m-making-btn figure{width:24px}@keyframes move-top{to{transform:translateY(-10px)}}@keyframes move-bottom{to{transform:translateY(-5px)}}
.m-loading-wrapper{font-family:"Maple";padding-top:26px}.m-loading-wrapper .progress-bar{margin:0 auto 1rem;width:90%;height:18px}.m-loading-wrapper .progress-bar .progress{font-size:14px;background-color:#10996e;font-family:"Maple"}.m-loading-wrapper .m-loading-tit{text-align:center;font-size:1.15rem;line-height:1.6;margin-bottom:.7rem}.m-loading-wrapper .m-loading-item{width:86%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.m-loading-wrapper .m-loading-item figure{border-radius:8px;overflow:hidden;margin-bottom:.5rem;max-height:380px;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}.m-loading-wrapper .m-loading-item .desc{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;color:rgba(0,0,0,.7);font-size:14px}
.class-page{font-family:"Maple";background-color:#e4fafd;min-height:100vh;padding-top:3rem}.class-page .inner{max-width:80%}.class-page .inner .download-btn{display:flex;align-items:center;gap:.5rem;padding:.8rem 2rem;cursor:pointer;border:none;background-color:var(--bs-blue-primary);border-radius:25px;transition-duration:.3s}.class-page .inner .download-btn:hover{background-color:var(--bs-blue-hovered)}.class-page .inner .download-btn figure{width:24px}.class-page .inner .download-btn span{font-family:"Maple";font-size:1rem;color:var(--bs-white)}@media screen and (max-width: 1440px){.class-page .inner{max-width:90%}}
.chapter-container{padding:3rem 0;font-family:"Maple" !important}.chapter-container .chap-tit-container{border-bottom:1px solid #fff;margin-bottom:1.5rem;padding:0 1rem .8rem;font-size:22px;display:flex;align-items:center;justify-content:space-between}.chapter-container .chap-tit-container .view-all-btn{border:none;padding:.5rem 1.25rem;border-radius:.25rem;cursor:pointer;transition-duration:.5s;background-color:#8bd15c;color:var(--bs-white);font-weight:900}.chapter-container .chap-tit-container .view-all-btn:hover{background-color:#77b54d}.chapter-container .lesson-swiper-wrapper{position:relative;width:100%;z-index:10}.chapter-container .lesson-swiper-wrapper:not(:first-child){margin-top:3rem}.chapter-container .lesson-swiper-wrapper .button-wrapper{width:110%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);z-index:99;display:flex;justify-content:space-between;z-index:-1}.chapter-container .lesson-swiper-wrapper .button-wrapper button{background:none;border:none;width:60px;cursor:pointer}.chapter-container .lesson-swiper-wrapper .button-wrapper button.custom-next{position:relative;z-index:9999 !important}.chapter-container .lesson-swiper-wrapper .swiper-wrapper{display:flex;margin-bottom:3rem;cursor:pointer}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item{background-color:var(--bs-white);border-radius:12px;flex-shrink:0;cursor:pointer;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25);display:flex;flex-direction:column;position:relative}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item .class-badge{font-weight:900;position:absolute;top:8px;left:8px;z-index:3;background-color:#1d1d1d;padding:.5rem;border-radius:.5rem;font-size:14px;color:var(--bs-white);box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item .cover-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;background:#f8f8f8;display:flex;justify-content:center;align-items:center}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item .cover-placeholder .spinner{border:4px solid rgba(0,0,0,.1);border-top:4px solid #3498db;border-radius:50%;width:30px;height:30px;animation:spin 1s linear infinite}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item .class-thumb{border-top-left-radius:12px;border-top-right-radius:12px;width:100%;position:relative;display:flex;justify-content:center;align-items:center}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item .class-thumb img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item dl{padding:1rem;flex-grow:1}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item dl dt{font-size:1.2rem;margin-bottom:1rem;line-height:1.4}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item dl .hashtags{display:flex;flex-wrap:wrap;gap:.8rem;margin-bottom:.8rem}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item dl .hashtags dd{background-color:#e6f6e9;padding:.5rem;border-radius:.25rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25);white-space:nowrap}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item dl .hashtags dd.calendar{background-color:#edcbb6}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item dl .hashtags dd.easy{background-color:#add8e6}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item dl .hashtags dd.normal{background-color:#1e90ff;color:var(--bs-white)}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item dl .hashtags dd.hard{background-color:#00008b;color:var(--bs-white)}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@media screen and (max-width: 1370px){.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item{min-height:440px}.chapter-container .lesson-swiper-wrapper .swiper-wrapper .chapter-item dl .hashtags dd{font-size:14px}}
.tc-all-view-modal{width:100%;height:100vh;background-color:rgba(0,0,0,.7);position:fixed;top:0;left:0;z-index:999;display:flex;justify-content:center;align-items:center}.tc-all-view-modal .inner{max-width:80%;background-color:#fff;padding:40px 20px 0 40px;border-radius:8px;width:80%;max-height:80%;overflow-y:auto;position:relative}.tc-all-view-modal .inner .close-button{position:fixed;top:100px;right:100px;background:none;border:none;font-size:20px;cursor:pointer;font-family:"Maple"}.tc-all-view-modal .inner h3{font-family:"Maple";margin-bottom:2rem;text-align:center;font-size:2rem}.tc-all-view-modal .inner .modal-items{width:100%;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:1rem;padding-bottom:1rem}.tc-all-view-modal .inner .modal-items .lesson-item{width:30%;background-color:var(--bs-white);border-radius:12px;flex-shrink:0;cursor:pointer;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25);position:relative}.tc-all-view-modal .inner .modal-items .lesson-item .class-badge{font-weight:900;position:absolute;top:8px;left:8px;z-index:3;background-color:#1d1d1d;padding:.5rem;border-radius:.5rem;font-size:14px;color:var(--bs-white);box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}.tc-all-view-modal .inner .modal-items .lesson-item .cover-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;background:#f8f8f8;display:flex;justify-content:center;align-items:center}.tc-all-view-modal .inner .modal-items .lesson-item .cover-placeholder .spinner{border:4px solid rgba(0,0,0,.1);border-top:4px solid #3498db;border-radius:50%;width:30px;height:30px;animation:spin 1s linear infinite}.tc-all-view-modal .inner .modal-items .lesson-item .class-thumb{border-top-left-radius:12px;border-top-right-radius:12px;background-color:#777;width:100%;position:relative;display:flex;justify-content:center;align-items:center}.tc-all-view-modal .inner .modal-items .lesson-item .class-thumb img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.tc-all-view-modal .inner .modal-items .lesson-item dl{padding:1rem}.tc-all-view-modal .inner .modal-items .lesson-item dl dt{font-size:1.2rem;margin-bottom:1rem;line-height:1.4}.tc-all-view-modal .inner .modal-items .lesson-item dl .hashtags{display:flex;gap:.8rem}.tc-all-view-modal .inner .modal-items .lesson-item dl .hashtags dd{margin-bottom:.8rem;font-family:"Maple";background-color:#e6f6e9;padding:.5rem;border-radius:.25rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}.tc-all-view-modal .inner .modal-items .lesson-item dl .hashtags dd.calendar{background-color:#edcbb6}.tc-all-view-modal .inner .modal-items .lesson-item dl .hashtags dd.easy{background-color:#add8e6}.tc-all-view-modal .inner .modal-items .lesson-item dl .hashtags dd.normal{background-color:#1e90ff;color:var(--bs-white)}.tc-all-view-modal .inner .modal-items .lesson-item dl .hashtags dd.hard{background-color:#00008b;color:var(--bs-white)}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@media screen and (max-width: 1200px){.tc-all-view-modal .inner{max-width:90%;padding:8px}.tc-all-view-modal .inner .close-button{top:10px;right:10px}.tc-all-view-modal .inner .modal-items .lesson-item{min-height:410px}.tc-all-view-modal .inner .modal-items .lesson-item dl .hashtags{flex-wrap:wrap}.tc-all-view-modal .inner .modal-items .lesson-item dl .hashtags dd{font-size:14px;margin-bottom:0;white-space:nowrap}.tc-all-view-modal .inner .modal-items .lesson-item dl dt{font-size:1rem}}@media screen and (max-width: 900px){.tc-all-view-modal .inner .modal-items .lesson-item{width:48%}}
.teaching-plan-section{background:#7bb3ff;width:100%;min-height:100vh;position:relative;font-family:"Maple" !important}.teaching-plan-section .tree-left-top{position:absolute;top:0;display:none;left:0}.teaching-plan-section .right-top-tree{position:absolute;top:100px;right:0;display:none;width:15%}.teaching-plan-section .grass{position:absolute;top:50%;display:none;left:10%}.teaching-plan-section .grass-2{position:absolute;top:10%;right:30%;display:none}.teaching-plan-section .con-bottom{position:fixed;width:100%;bottom:0;left:0}.teaching-plan-section .con-top{position:fixed;width:100%;top:0;left:0;z-index:1}.teaching-plan-section .inner{max-width:80%;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;z-index:90}.teaching-plan-section .inner .welcome-text{font-weight:900;margin-bottom:2rem;font-size:2rem}.teaching-plan-section .inner .welcome-text span{padding-right:.5rem}.teaching-plan-section .inner .plan-container{width:100%;padding:2rem;background-color:var(--bs-white);border-radius:20px;display:flex;align-items:stretch;justify-content:space-between;gap:1.5rem;box-shadow:0px 4px 4px 0px rgba(0,0,0,.15)}.teaching-plan-section .inner .plan-container .plan-box{width:49%;padding:3rem 1rem;border-radius:.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center}.teaching-plan-section .inner .plan-container .plan-box figure{width:180px}.teaching-plan-section .inner .plan-container .plan-box h3{font-size:2rem;font-weight:900;margin:2rem 0}.teaching-plan-section .inner .plan-container .plan-box p{color:#8a8578;margin-bottom:3rem;line-height:1.6;text-align:center;font-size:1.25rem}.teaching-plan-section .inner .plan-container .plan-box button{border:none;padding:.8rem 3rem;cursor:pointer;color:var(--bs-white);border-radius:4px;font-size:1rem;font-weight:900}.teaching-plan-section .inner .plan-container .plan-box button.purple{background:radial-gradient(92.05% 50% at 50% 50%, #a79de7 0%, #9684f1 100%)}.teaching-plan-section .inner .plan-container .plan-box button.yellow{background:radial-gradient(92.05% 50% at 50% 50%, #f0bd60 0%, #e7a939 100%)}.teaching-plan-section .inner .plan-container .plan-box button.blue{background:radial-gradient(92.05% 50% at 50% 50%, #8adafc 0%, #63ccf8 100%)}.teaching-plan-section .inner .plan-container .plan-box.blue{position:relative;border:1px solid #8adafc;background:linear-gradient(180deg, #8adafc 0%, #def5fd 100%)}.teaching-plan-section .inner .plan-container .plan-box.blue::before{content:"선생님이신가요?";position:absolute;top:-30px;left:0;background-color:#4cc7fc;color:#fff;font-size:1.25rem;padding:.5rem 1rem;border-radius:6px;font-weight:700;text-align:center;white-space:nowrap;z-index:1;animation:move-up 1s linear alternate infinite}.teaching-plan-section .inner .plan-container .plan-box.blue::before::after{content:"";position:absolute;bottom:-15px;left:50%;transform:translateX(-50%);border-left:10px solid rgba(0,0,0,0);border-right:10px solid rgba(0,0,0,0);border-top:15px solid #f0bd60}.teaching-plan-section .inner .plan-container .plan-box.purple{position:relative;border:1px solid #beb5f3;background:linear-gradient(180deg, #beb5f3 0%, #e4e0f9 100%)}.teaching-plan-section .inner .plan-container .plan-box.purple::before{content:"선생님이신가요?";position:absolute;top:-30px;left:0;background-color:#afa4f0;color:#fff;font-size:1.25rem;padding:.5rem 1rem;border-radius:6px;font-weight:700;text-align:center;white-space:nowrap;z-index:1;animation:move-up 1s linear alternate infinite}.teaching-plan-section .inner .plan-container .plan-box.purple::before::after{content:"";position:absolute;bottom:-15px;left:50%;transform:translateX(-50%);border-left:10px solid rgba(0,0,0,0);border-right:10px solid rgba(0,0,0,0);border-top:15px solid #f0bd60}.teaching-plan-section .inner .plan-container .plan-box.yellow{position:relative;border:1px solid #f2cb87;background:linear-gradient(180deg, #f2cb87 0%, #f6e9e5 100%)}.teaching-plan-section .inner .plan-container .plan-box.yellow::before{content:"AI매직포유가 처음이라면?";position:absolute;top:-30px;left:0;background-color:#f0bd60;color:#fff;font-size:1.25rem;padding:.5rem 1rem;border-radius:6px;font-weight:700;text-align:center;white-space:nowrap;z-index:1;animation:move-up 1s linear alternate infinite}.teaching-plan-section .inner .plan-container .plan-box.yellow::before::after{content:"";position:absolute;bottom:-15px;left:50%;transform:translateX(-50%);border-left:10px solid rgba(0,0,0,0);border-right:10px solid rgba(0,0,0,0);border-top:15px solid #f0bd60}.teaching-plan-section .twin{position:absolute;bottom:0;right:0;width:300px}@keyframes move-up{100%{top:-20px}}@media screen and (max-width: 1600px){.teaching-plan-section .inner{max-width:90%}}@media screen and (max-width: 1400px){.teaching-plan-section{min-height:120vh}.teaching-plan-section .inner .plan-container .plan-box h3{font-size:1.2rem;margin:1rem 0}.teaching-plan-section .inner .plan-container .plan-box p{font-size:1rem}}
.deep-sea-section{width:100%;height:100svh;background:linear-gradient(180deg, #8ef0cd 0%, #457caa 50.48%, #0f224b 100%);position:relative}.deep-sea-section .logout-btn{position:absolute;bottom:10px;right:10px;padding:.8rem;transition-duration:.3s;display:flex;align-items:center;gap:1rem;cursor:pointer;border-radius:.25rem;border:none;background-color:#ececec;z-index:999}.deep-sea-section .logout-btn span{color:#969696;font-family:"Maple"}.deep-sea-section .logout-btn:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.2509803922)}.deep-sea-section .myHistory-btn{position:absolute;top:10px;right:10px;padding:.8rem;transition-duration:.3s;display:flex;align-items:center;gap:.25rem;cursor:pointer;border-radius:.25rem;border:none;background-color:#ececec;z-index:999}.deep-sea-section .myHistory-btn span{color:#969696;font-family:"Maple"}.deep-sea-section .myHistory-btn:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.2509803922)}.deep-sea-section .inner{padding-top:3rem;max-width:90%}.deep-sea-section .inner .deep-sea-title{width:800px;margin:0 auto;animation:rotateFadeIn .5s ease-out 2s forwards}.deep-sea-section .inner .sea-menu-list{display:flex;align-items:center;justify-content:center;gap:2rem;margin-top:3rem;cursor:pointer}.deep-sea-section .inner .sea-menu-list .menu-item{transition-duration:.2s}.deep-sea-section .inner .sea-menu-list .menu-item:hover{transform:scale(1.1);z-index:999}.deep-sea-section .sea-left-top{position:fixed;top:0;left:0}.deep-sea-section .sea-right-top{position:fixed;right:-50px;top:0px}.deep-sea-section .sea-left{position:fixed;bottom:-5px;left:0;z-index:2;width:400px}.deep-sea-section .sea-right{position:fixed;bottom:-5px;right:0;z-index:2;width:420px}.deep-sea-section .sea-sand{position:fixed;bottom:-140px;z-index:1;width:100%}.deep-sea-section .logo{position:absolute;bottom:150px;left:50%;transform:translateX(-50%);width:15vw;z-index:10;animation:logo-rotate-in-strong 1s cubic-bezier(0.25, 0.8, 0.25, 1) 2s forwards}@keyframes rotateFadeIn{0%{transform:rotate(-180deg) scale(0.5);opacity:0}100%{transform:rotate(0deg) scale(1);opacity:1}}@keyframes logo-rotate-in-strong{0%{opacity:0;transform:translateX(-50%) scale(0.2) rotate(-360deg)}60%{opacity:.8;transform:translateX(-50%) scale(1.1) rotate(-20deg)}100%{opacity:1;transform:translateX(-50%) scale(1) rotate(0deg)}}@media screen and (max-width: 1440px){.deep-sea-section .inner .deep-sea-title{width:600px}}@media screen and (max-width: 1200px){.deep-sea-section .sea-right{width:360px}.deep-sea-section .sea-left{width:340px}.deep-sea-section .sea-left-top{width:300px}.deep-sea-section .sea-right-top{width:200px}.deep-sea-section .sea-sand{bottom:-70px}.deep-sea-section .inner .deep-sea-title{width:600px}}@media screen and (max-width: 1024px){.deep-sea-section .sea-right{width:360px}.deep-sea-section .sea-left{width:340px}.deep-sea-section .sea-left-top{width:300px}.deep-sea-section .sea-right-top{width:200px}.deep-sea-section .sea-sand{bottom:-70px}.deep-sea-section .inner{max-width:95% !important}.deep-sea-section .inner .deep-sea-title{width:500px}.deep-sea-section .inner .sea-menu-list{gap:1rem}}
.splash-wrap{position:absolute;width:100vw;height:100vh;top:0;left:0;background-image:url(/static/media/bg.1a80b839cc4ec93af7c3.svg);background-position:center;background-repeat:no-repeat;background-size:cover;z-index:9999}.splash-wrap .absolute{position:absolute}.splash-wrap .absolute.kn-logo{left:50%;transform:translateX(-50%);top:40px;width:40vw}.splash-wrap .absolute.nikki{left:22%;top:30%;width:23vw}.splash-wrap .absolute.arial{right:20%;top:30%;width:30vw;z-index:10}.splash-wrap .absolute.icon1{bottom:0}.splash-wrap .absolute.icon2{left:0;bottom:0;width:25vw}.splash-wrap .absolute.icon3{right:0;bottom:0;width:20vw}.splash-wrap .absolute.logo{bottom:40px;left:50%;transform:translateX(-50%);width:35vw;animation:logo-wiggle .6s ease-in-out infinite}.fade-out{animation:splash-fade-out .8s ease forwards}@keyframes splash-fade-out{0%{opacity:1}100%{opacity:0}}@keyframes logo-wiggle{0%{transform:translateX(-50%) rotate(0deg)}20%{transform:translateX(calc(-50% - 5px)) rotate(-3deg)}40%{transform:translateX(calc(-50% + 5px)) rotate(3deg)}60%{transform:translateX(calc(-50% - 5px)) rotate(-2deg)}80%{transform:translateX(calc(-50% + 5px)) rotate(2deg)}100%{transform:translateX(-50%) rotate(0deg)}}
.wrapper .home-btn{position:fixed;top:30px;left:30px;width:80px;z-index:99;cursor:pointer}.wrapper .bg-sand{position:fixed;bottom:0;left:0;width:100%;display:none}.wrapper.lyric-page{background:url(/static/media/winter-music-bg.cd01c8e064715a8e5c38.svg) no-repeat bottom/cover;position:relative}.wrapper.lyric-page .inner{max-width:none;width:90%}.wrapper.ulju-song-bg{background:url(/static/media/petroglyphs-song.58623f3ac184b981bca0.svg) no-repeat bottom/cover}.wrapper .inner .fire{position:fixed;z-index:999}.wrapper .inner .fire.fire-3{left:0;bottom:0;width:21vw}.wrapper .inner .fire.fire-4{right:-50px;bottom:0;width:13vw}@media screen and (max-width: 1400px){.wrapper.lyric-page .inner{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center}}
.lyric-basic-container{width:100%;padding:2rem;border:10px solid #f5c938;background-color:var(--bs-white);border-radius:24px;position:relative}.lyric-basic-container .lyric-step{position:absolute;left:50%;top:-70px;transform:translateX(-50%);width:400px}.lyric-basic-container .big-box{display:flex;align-items:center;justify-content:center;gap:1rem}.lyric-basic-container .big-box .left{width:50%;border-right:1px dashed #a9a9a9;padding:1rem}.lyric-basic-container .big-box .left .subject{margin-bottom:2rem}.lyric-basic-container .big-box .left .subject .lyric-subject{width:180px}.lyric-basic-container .big-box .left .subject .subject-container{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}.lyric-basic-container .big-box .left .subject .subject-container button{cursor:pointer;font-family:"Maple";border:1px solid #adadad;padding:.8rem 1rem;font-size:1.2rem;background:#fff;color:#707070;border-radius:36px}.lyric-basic-container .big-box .left .subject .subject-container button.active{background-color:#f69999;border:1px solid #f17c7c;color:var(--bs-white)}.lyric-basic-container .big-box .left .content .lyric-contents{width:180px;margin-bottom:.5rem}.lyric-basic-container .big-box .left .content .contents-container{width:100%;background-color:#eceaea;border-radius:8px}.lyric-basic-container .big-box .left .content .contents-container textarea{background:none;border:none;width:100%;font-family:"Maple";padding:1rem;min-height:160px;font-size:1.25rem;color:#4f4f4f}.lyric-basic-container .big-box .left .content .lyric-example-textarea{line-height:1.6;padding:.5rem;font-size:1.1rem;font-weight:900;color:#3275c8}.lyric-basic-container .big-box .left .content .make-lyric-button{width:160px;margin-left:auto;margin-top:1rem;cursor:pointer}.lyric-basic-container .big-box .left .content .make-lyric-button.animate{animation:pop .8s ease-in-out infinite}.lyric-basic-container .big-box .left .content .warning{margin-top:8px;color:red;line-height:1.4}.lyric-basic-container .big-box .right{width:50%;padding:1rem}.lyric-basic-container .big-box .right .lyric-wait{width:80%;margin:0 auto}.lyric-basic-container .big-box .right .lyrics-result{width:100%}.lyric-basic-container .big-box .right .lyrics-result .result-title{display:flex;flex-direction:row-reverse;align-items:center;margin-bottom:1rem}.lyric-basic-container .big-box .right .lyrics-result .result-title .select-melody-button{width:180px;cursor:pointer;margin-left:auto;cursor:pointer}.lyric-basic-container .big-box .right .lyrics-result .result-title .select-melody-button.animate{animation:pop .8s ease-in-out infinite}.lyric-basic-container .big-box .right .lyrics-result .result-title .lyric-complete-btn{width:180px}.lyric-basic-container .big-box .right .lyrics-result .edit-toggle-button{width:120px;cursor:pointer;margin-left:auto;margin-top:.5rem}.lyric-basic-container .big-box .right .lyrics-result .lyric-texts{width:100%;max-height:460px;background-color:#f2f2f2;padding:1rem;border-radius:1rem;font-family:"Maple";overflow-y:auto}.lyric-basic-container .big-box .right .lyrics-result .lyric-texts p{font-size:2rem;line-height:1.6;text-align:center;white-space:pre-wrap}.lyric-basic-container .big-box .right .lyrics-result .lyric-texts p.lyric-label{font-size:1.5rem;color:#9d9d9d;display:block}.lyric-basic-container .big-box .right .lyrics-result .lyric-texts textarea{background:none;border:none;width:100%;font-family:"Maple";padding:1rem;min-height:auto;font-size:1.5rem;line-height:1.6;color:#4f4f4f;text-align:center;resize:none;overflow-y:auto}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.1)}100%{transform:scale(1)}}@media screen and (max-width: 1440px){.lyric-basic-container{padding:1rem}.lyric-basic-container .lyric-step{width:310px;top:-50px}.lyric-basic-container .big-box .left .subject .lyric-subject{width:120px}.lyric-basic-container .big-box .left .subject .subject-container button{font-size:1rem}.lyric-basic-container .big-box .left .content .lyric-contents{width:120px}.lyric-basic-container .big-box .left .content .make-lyric-button{width:140px}.lyric-basic-container .big-box .left .content .contents-container textarea{min-height:200px}.lyric-basic-container .big-box .right{padding:0}.lyric-basic-container .big-box .right .lyric-wait{width:90%}.lyric-basic-container .big-box .right .lyrics-result .result-title .select-melody-button{width:140px}.lyric-basic-container .big-box .right .lyrics-result .result-title .lyric-complete-btn{width:140px}.lyric-basic-container .big-box .right .lyrics-result .lyric-texts{max-height:420px}.lyric-basic-container .big-box .right .lyrics-result .lyric-texts p{font-size:1.25rem}}@media screen and (max-width: 1024px){.lyric-basic-container .big-box .left .content .contents-container textarea{font-size:.8rem}.lyric-basic-container .big-box .left .content .make-lyric-button{width:100px}.lyric-basic-container .big-box .left .subject .subject-container button{font-size:.8rem;padding:.6rem}}
.loading-bg{width:100%;height:100svh;background-color:rgba(0,0,0,.8);position:fixed;top:0;left:0;z-index:9999}.loading-bg .inner{height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center}.loading-bg .inner .shortloading-char{width:30%}.loading-bg .inner p{font-family:"Maple";font-size:2rem;color:var(--bs-white);margin-top:4rem}
.genre-select-container{width:100%;padding:2rem;border:10px solid #f5c938;background-color:var(--bs-white);border-radius:24px;position:relative}.genre-select-container .lyric-step{position:absolute;left:50%;top:-70px;transform:translateX(-50%);width:400px}.genre-select-container .big-box{display:flex;align-items:center;justify-content:center;gap:1rem}.genre-select-container .big-box .genre-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:1rem;max-height:620px;overflow-y:scroll}.genre-select-container .big-box .genre-container .genre-card{width:20%;background-color:#fcf8ed;border-radius:16px;padding:1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:"Maple"}.genre-select-container .big-box .genre-container .genre-card .cover{border-radius:50%;overflow:hidden;border:16px solid #fbf0cc}.genre-select-container .big-box .genre-container .genre-card .genre-title{font-size:1.15rem;margin:1rem auto}.genre-select-container .big-box .genre-container .genre-card .genre-description{color:#7f7f7f;margin-bottom:.5rem;text-align:center;line-height:1.4}.genre-select-container .big-box .genre-container .genre-card .pre-listen{width:120px;cursor:pointer}@media screen and (max-width: 1440px){.genre-select-container .lyric-step{width:310px;top:-50px}.genre-select-container .big-box .genre-container{max-height:480px}.genre-select-container .big-box .genre-container .genre-card{width:30%}.genre-select-container .big-box .genre-container .genre-card .cover{width:80%;border:10px solid #fbf0cc}}
.genre-preview-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center}.genre-preview-modal .modal-backdrop{position:absolute;background:rgba(0,0,0,.7);width:100%;height:100%}.genre-preview-modal .modal-content{position:relative;background:#fff;width:50%;padding:5rem 1.5rem 1.5rem;border-radius:20px;text-align:center}.genre-preview-modal .modal-content .music-prev-title{position:absolute;top:-50px;left:50%;transform:translateX(-50%)}.genre-preview-modal .modal-content .modal-contents-flex{display:flex;align-items:center;justify-content:center;gap:1rem;width:100%}.genre-preview-modal .modal-content .modal-contents-flex .modal-left{width:40%;border-radius:16px;overflow:hidden}.genre-preview-modal .modal-content .modal-contents-flex .modal-right{width:50%;font-family:"Maple"}.genre-preview-modal .modal-content .modal-contents-flex .modal-right .genre-title{font-size:2rem;margin-bottom:1rem}.genre-preview-modal .modal-content .modal-contents-flex .modal-right .genre-desc{margin-bottom:1rem;color:#7e7e7e}.genre-preview-modal .modal-content .modal-contents-flex .modal-right .audio-player{width:100%;margin:1rem 0}.genre-preview-modal .modal-content .button-group{display:flex;justify-content:center;align-items:center;margin-top:1.5rem;gap:1rem;width:40%;margin:1.5rem auto 0}.genre-preview-modal .modal-content .button-group .cancel-btn{cursor:pointer}.genre-preview-modal .modal-content .button-group .confirm-btn{cursor:pointer}@media screen and (max-width: 1400px){.genre-preview-modal .modal-content{width:80%}.genre-preview-modal .modal-content .music-prev-title{width:340px}}
.custom-audio-player{display:flex;flex-direction:column;align-items:center;gap:1rem;font-family:"Maple"}.custom-audio-player .seekbar-container{display:flex;align-items:center;width:100%;max-width:300px;gap:.5rem;font-size:14px;color:#333}.custom-audio-player .seekbar-container input[type=range]{flex:1 1;-webkit-appearance:none;appearance:none;height:6px;border-radius:3px;background:linear-gradient(to right, #f36 0%, #eee 0%);outline:none}.custom-audio-player .seekbar-container input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:#f36;border-radius:50%;cursor:pointer;box-shadow:0 0 2px #888}.custom-audio-player .controls{display:flex;justify-content:center;align-items:center;gap:2rem}.custom-audio-player .controls .control-btn{background:none;border:none;cursor:pointer}.custom-audio-player .controls .play-btn{background:none;border:none;cursor:pointer}
.multi-image-loading .multi-image-loading-char{display:flex;flex-direction:column;justify-content:center;align-items:center}.multi-image-loading .multi-image-loading-char svg{width:80% !important;margin:0 auto}.music-cover-container{width:100%;padding:2rem;border:10px solid #f5c938;background-color:var(--bs-white);border-radius:24px;position:relative;min-height:640px}.music-cover-container .lyric-step{position:absolute;left:50%;top:-70px;transform:translateX(-50%);width:400px}.music-cover-container .big-box{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding-top:2rem}.music-cover-container .big-box .cover-desc{margin-top:1rem;font-family:"Maple";font-size:1.75rem;text-align:center;line-height:1.4}.music-cover-container .big-box .cover-desc span{color:var(--bs-blue-primary);font-weight:900}.music-cover-container .big-box .cover-list{display:flex;align-items:center;justify-content:center;gap:1rem;width:100%;margin-top:2rem}.music-cover-container .big-box .cover-list .cover-item{width:23%;transition-duration:.5s;cursor:pointer}.music-cover-container .big-box .cover-list .cover-item.selected{border:14px solid #ffd23c;border-radius:1rem;overflow:hidden}.music-cover-container .big-box .next-btn{cursor:pointer;margin-top:.5rem}@media screen and (max-width: 1400px){.music-cover-container{min-height:540px}.music-cover-container .big-box{padding-top:0}.music-cover-container .big-box .cover-list{flex-wrap:wrap;overflow-y:scroll;max-height:380px;margin-top:1rem}.music-cover-container .big-box .cover-list .cover-item{width:40%}.music-cover-container .big-box .next-btn{position:fixed;bottom:20px}}
.result-wrapper{width:100%;font-family:"Maple"}.result-wrapper .complete-buttons{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:1rem}.result-wrapper .complete-buttons .reset{width:260px;cursor:pointer;position:relative;z-index:99}.result-wrapper .complete-buttons .music-down{cursor:pointer;position:relative;z-index:99}.result-wrapper .complete-buttons .music-save{cursor:pointer;position:relative;z-index:99;width:250px;border:none;background:none}.result-wrapper .lyric-step-end{width:560px;margin:0 auto 1rem}.result-wrapper .confetti-right{position:fixed;top:0;right:0;width:800px;z-index:0}.result-wrapper .confetti-left{position:fixed;top:0;left:0;width:800px;z-index:0}.result-wrapper .lyric-1{width:120px;margin:0 auto 1rem}.result-wrapper .lyrics-text .lyric-label{font-size:1.5rem;color:#9d9d9d;display:block}.result-wrapper .cover{width:100%;margin:0 auto}.result-wrapper .lyric-result-container{display:flex;align-items:stretch;justify-content:center;gap:2.5rem;width:100%;position:relative;z-index:10}.result-wrapper .lyric-result-container .left{width:60%;border:10px solid #f5c938;padding:3rem 1rem 1rem;background-color:var(--bs-white);border-radius:24px;position:relative}.result-wrapper .lyric-result-container .left .refresh-button{position:absolute;top:20px;left:20px;width:160px;cursor:pointer}.result-wrapper .lyric-result-container .left .music-player{display:flex;flex-direction:column;align-items:center;justify-content:center}.result-wrapper .lyric-result-container .left .music-player .music-cover-box{width:30%}.result-wrapper .lyric-result-container .left .music-player .music-cover-box .music-title{font-size:1.25rem;margin:.5rem}.result-wrapper .lyric-result-container .left .music-player .player-controls{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:16px;width:50%}.result-wrapper .lyric-result-container .left .music-player .player-controls .progress{display:flex;align-items:center;width:100%;gap:8px}.result-wrapper .lyric-result-container .left .music-player .player-controls .progress span{font-size:14px;color:#333;width:50px;text-align:center}.result-wrapper .lyric-result-container .left .music-player .player-controls .progress input[type=range]{flex:1 1;-webkit-appearance:none;height:6px;border-radius:3px;background:#dfdfdf;outline:none;cursor:pointer}.result-wrapper .lyric-result-container .left .music-player .player-controls .progress input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;height:14px;width:14px;background:#f92457;border-radius:50%;cursor:pointer}.result-wrapper .lyric-result-container .left .music-player .player-controls .progress input[type=range]::-moz-range-thumb{height:14px;width:14px;background:#f92457;border-radius:50%;cursor:pointer}.result-wrapper .lyric-result-container .left .music-player .player-controls .buttons{display:flex;gap:16px}.result-wrapper .lyric-result-container .left .music-player .player-controls .buttons button{background:none;border:none;cursor:pointer;padding:6px;transition:transform .2s ease;width:100px;height:100px}.result-wrapper .lyric-result-container .left .music-player .player-controls .buttons button:hover{transform:scale(1.1)}.result-wrapper .lyric-result-container .right{width:40%;max-height:60vh;overflow-y:scroll;border:10px solid #f5c938;padding:1rem;background-color:var(--bs-white);border-radius:24px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.result-wrapper .lyric-result-container .right p{text-align:center;font-size:2rem;line-height:2}@media screen and (max-width: 1440px){.result-wrapper{margin-top:-2rem}.result-wrapper .lyric-1{width:100px}.result-wrapper .confetti-right,.result-wrapper .confetti-left{width:400px}.result-wrapper .lyric-step-end{width:400px}.result-wrapper .reset{width:200px}.result-wrapper .lyric-result-container{gap:1rem}.result-wrapper .lyric-result-container .left{width:50%;padding:1rem}.result-wrapper .lyric-result-container .left .music-player .player-controls{width:90%}.result-wrapper .lyric-result-container .left .music-player .music-cover-box{width:45%}.result-wrapper .lyric-result-container .left .music-player .music-cover-box .music-title{text-align:center}.result-wrapper .lyric-result-container .right{width:50%}.result-wrapper .lyric-result-container .right p{padding-right:0;max-height:380px;width:100%;font-size:1.25rem}}
.initial-wrapper{width:100%;height:100vh;background:url(/static/media/hangeul-game-bg.7a61ab7c27a202fd5cd8.svg) no-repeat bottom/cover;font-family:"Maple";position:fixed;top:0;left:0;z-index:999999 !important}.initial-wrapper.ulju{background:url(/static/media/basic-loading-ulju.107e1b2ed19099878314.svg) no-repeat bottom/cover}.initial-wrapper .initial-left{position:fixed;left:0;bottom:0;width:20vw}.initial-wrapper .initial-left.ulju{display:none}.initial-wrapper .initial-right{position:fixed;right:10vw;bottom:0;width:7vw}.initial-wrapper .initial-right.ulju{display:none}.initial-wrapper .ulju-loading-1{position:fixed;left:26px;bottom:10px;width:17vw}.initial-wrapper .ulju-loading-2{position:fixed;right:-30px;bottom:10px;width:17vw}.initial-wrapper .inner{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;height:100vh}.initial-wrapper .inner .initial-title{position:absolute;top:3vw;left:50%;transform:translateX(-50%);width:20vw}.initial-wrapper .inner .music-play-btn{width:120px;border:none;background:rgba(0,0,0,0);cursor:pointer;z-index:9;position:absolute;left:50px;top:50px}.initial-wrapper .inner .clock{width:100px;animation:swing 2s ease-in-out infinite;position:absolute;right:50px;top:50px}.initial-wrapper .inner .clock .count-down{position:absolute;top:55%;left:50%;transform:translateX(-50%);font-size:32px;font-weight:bold;font-family:"Maple"}.initial-wrapper .inner .clock .count-down.red{color:red}.initial-wrapper .inner .clock::before{content:"남은시간";font-size:18px;display:block;margin:.5rem auto;text-align:center;font-family:"Maple";color:var(--bs-white)}.initial-wrapper .initial-game-modal{text-align:center;border-radius:16px;margin:0 auto;position:absolute;width:50%;top:50%;left:50%;transform:translate(-50%, -50%)}.initial-wrapper .initial-game-modal .loading-desc{width:100%;font-size:1.5rem;line-height:1.4}.initial-wrapper .initial-game-modal .slot-wrapper{display:flex;justify-content:center;gap:20px;margin:20px 0}.initial-wrapper .initial-game-modal .slot-box{width:130px;height:130px;border:4px solid #4f4f4f;border-radius:12px;background:#fffdf4;font-size:6rem;font-weight:bold;display:flex;align-items:center;justify-content:center;transition:transform .2s ease-in-out;box-shadow:0 4px 12px rgba(0,0,0,.15)}.initial-wrapper .initial-game-modal .rolling{animation:bounce .4s infinite}.initial-wrapper .initial-game-modal .reroll-button{padding:12px 24px;font-size:1.25rem;background:#ffcb05;border:none;border-radius:8px;cursor:pointer;font-weight:bold;box-shadow:0 3px 6px rgba(0,0,0,.1);transition:background .2s;font-family:"Maple"}.initial-wrapper .initial-game-modal .reroll-button:hover{background:#ffda40}.initial-wrapper .initial-game-modal .reroll-button:disabled{background:#ddd;cursor:not-allowed}.initial-wrapper .initial-game-modal .input-area{width:100%;margin-top:1rem}.initial-wrapper .initial-game-modal .input-area input{font-family:"Maple";border:none;padding:1rem .5rem;border-radius:.25rem;width:50%;box-shadow:0px 2px 4px 0px rgba(0,0,0,.15)}.initial-wrapper .initial-game-modal .input-area button{font-family:"Maple";margin-left:.5rem;padding:1rem 2rem;border-radius:.25rem;border:none;background-color:#306b47;color:var(--bs-white);font-size:1rem;cursor:pointer}.initial-wrapper .initial-paper{position:relative;width:75%}.initial-wrapper .initial-paper.ulju{display:none}.initial-wrapper .answer-list-container{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;bottom:4vw;gap:.8rem}.initial-wrapper .answer-list-container h4{font-size:1.5rem}.initial-wrapper .answer-list-container .answer-list{display:flex;flex-wrap:wrap;gap:1rem}.initial-wrapper .answer-list-container .answer-list li{font-size:1.5rem;padding:.5rem 1.2rem;background-color:var(--bs-white);border-radius:.25rem;border:4px solid #204ba1}@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}@media screen and (max-width: 1440px){.initial-wrapper .initial-paper{width:90%}.initial-wrapper .inner .music-play-btn{width:90px;top:30px;left:30px}.initial-wrapper .inner .clock{width:90px;top:30px;right:30px}.initial-wrapper .inner .clock::before{font-size:14px}.initial-wrapper .initial-game-modal .loading-desc{font-size:1.2rem}.initial-wrapper .initial-game-modal .slot-box{width:110px;height:110px;font-size:4rem}.initial-wrapper .answer-list-container h4{font-size:1.2rem}.initial-wrapper .answer-list-container .answer-list li{font-size:1rem}}
.download-section{font-family:"Maple";background-color:hsl(198,76%,68%);height:100vh;position:relative}.download-section .inner{padding-top:1rem}.download-section .inner .download-container .download-title{width:60%;margin:0 auto 1rem}.download-section .inner .download-container .how-to-text{font-size:1.2rem;font-weight:bold;text-align:center}.download-section .inner .download-container .how-to{width:93%;position:fixed;bottom:10px;left:50%;transform:translateX(-50%);margin:.8rem auto}.download-section .inner .download-container .music-cover{width:70%;margin:0 auto 1rem}.download-section .inner .download-container .music-controller{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-bottom:1rem}.download-section .inner .download-container .music-controller input[type=range]{width:70%;-webkit-appearance:none;appearance:none;height:6px;border-radius:3px;background:linear-gradient(to right, #f36 0%, #eee 0%);outline:none}.download-section .inner .download-container .music-controller input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:#f36;border-radius:50%;cursor:pointer;box-shadow:0 0 2px #888}.download-section .inner .download-video{width:100%;margin:1rem auto}.download-section .inner .playstate-btn{border:none;background:none;width:100px}.download-section .inner .download-text{position:relative;z-index:999;cursor:pointer;width:80%;margin:0 auto}.download-section .inner .download-text details{padding:8px;border-radius:12px;background-color:#fff7ed;font-family:"Maple";box-shadow:0 2px 8px rgba(0,0,0,.05);text-align:center}.download-section .inner .download-text details summary{padding:8px;border-radius:12px;background-color:#fff7ed;font-family:"Maple";box-shadow:0 2px 8px rgba(0,0,0,.05);text-align:center}.download-section .inner .download-text details figure img{width:100%;height:auto;display:block}.download-section .bg-sand-m{position:fixed;bottom:0;width:100%}
.transition-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:999 !important;pointer-events:none;overflow:hidden;animation:revealCircle 1.8s ease forwards;display:flex;align-items:center;justify-content:center;-webkit-clip-path:circle(0% at 50% 50%);clip-path:circle(0% at 50% 50%)}.sea-main{width:100%;min-height:100vh;background:linear-gradient(180deg, #bce8fc 0%, #50b5e3 100%);background-size:100% 200%;animation:waveBackground 2s ease-in-out infinite alternate;overflow:hidden;position:relative}.sea-main.zoom-out{animation:zoomOutBackground 2s ease forwards}.sea-main .test-title{font-size:2rem;margin-bottom:3rem;width:100px}.sea-main .sea-inner{width:95%;height:100vh;position:relative;margin:0 auto;padding-top:1rem}.sea-main .sea-inner .sea-icon{position:absolute;cursor:pointer}.sea-main .sea-inner .sea-icon.clicked{animation:scaleUp .5s ease-in-out forwards;z-index:9999}.sea-main .sea-inner .sea-icon.shortform{left:0;width:24vw}.sea-main .sea-inner .sea-icon.storybook{left:0;bottom:0;width:22vw}@keyframes floatUpDown2{0%{bottom:90px}50%{bottom:100px}100%{bottom:90px}}.sea-main .sea-inner .sea-icon.drawing{top:31%;left:20%;width:24vw}.sea-main .sea-inner .sea-icon.writing{top:5%;right:35%;width:24vw}.sea-main .sea-inner .sea-icon.music{right:7%;top:45%;width:18vw}.sea-main .sea-inner .sea-icon.music .new-badge-sparkle{position:absolute;top:-35px;right:0;width:6vw}.sea-main .sea-inner .sea-icon.storyland{bottom:20px;right:25%;width:24vw}@keyframes floatUpDown{0%{bottom:120px}50%{bottom:130px}100%{bottom:120px}}.sea-main .sea-inner .sea-icon.october{bottom:0;left:28%;width:20vw}.sea-main .sea-inner .sea-icon.october .conts-new-badge{position:absolute;left:-55px;bottom:10px;width:6vw;z-index:9;animation:floatUpDown2 2s ease-in-out infinite}.sea-main .sea-inner .sea-icon.october .octopus-main-title{position:absolute;bottom:10px;left:-23%;width:9vw}.sea-main .sea-inner .sea-icon.whale{top:40%;right:38%;animation:move .8s infinite alternate;width:15vw}.sea-main .sea-inner .sea-icon.boat{top:40%;left:0;width:21vw}.sea-main .sea-inner .sea-icon.my-island{width:22vw;right:7%}.sea-main .sea-inner .sea-icon.my-island .remain-beans{background-color:hsla(0,0%,100%,.5);position:absolute;bottom:0;right:70px;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.25rem .5rem;border-radius:10px}.sea-main .sea-inner .sea-icon.my-island .remain-beans figure{width:36px}.sea-main .sea-inner .sea-icon.my-island .remain-beans p{font-family:"Maple";font-size:1.25rem}.sea-main .sea-inner .sea-icon.island{bottom:30px;left:24%;width:4vw;display:none}.sea-main .sea-inner .sea-icon.island-2{top:44%;right:30%;width:4vw}.sea-main .sea-inner .sea-icon.wave5{top:22%;left:26%;width:10vw}.sea-main .sea-inner .sea-icon.wave3{bottom:10%;right:10%;width:10vw}.sea-main .sea-inner .sea-icon.swim-girl{left:26%;top:8%;width:6vw}@keyframes move{100%{top:40.5%}}@keyframes waveBackground{0%{background-position:0% 0%}100%{background-position:0% 100%}}@keyframes cloudFadeOut{0%{opacity:1;transform:scale(1) translateX(0)}100%{opacity:0;transform:scale(1.2) translateX(50%)}}@keyframes zoomOutBackground{0%{transform:scale(1.2)}100%{transform:scale(1)}}@keyframes revealCircle{0%{-webkit-clip-path:circle(0% at 50% 50%);clip-path:circle(0% at 50% 50%)}100%{-webkit-clip-path:circle(150% at 50% 50%);clip-path:circle(150% at 50% 50%)}}@media(max-width: 1440px){.sea-main .sea-inner .sea-icon.my-island{width:24vw;right:5%}.sea-main .sea-inner .sea-icon.my-island .remain-beans p{font-size:1rem}.sea-main .sea-inner .sea-icon.storybook{width:24vw;bottom:3%}.sea-main .sea-inner .sea-icon.boat{left:-30px}.sea-main .sea-inner .sea-icon.whale{right:31%}.sea-main .sea-inner .sea-icon.island-2{right:28%;top:35%}.sea-main .sea-inner .sea-icon.storyland{width:28vw;bottom:40px}.sea-main .sea-inner .sea-icon.writing{width:26vw;right:33%}.sea-main .sea-inner .sea-icon.drawing{top:35%;left:20%;width:26vw}.sea-main .sea-inner .sea-icon.wave5{left:28%}.sea-main .sea-inner .sea-icon.wave3{width:8vw;bottom:20%;right:13%}.sea-main .sea-inner .sea-icon.music{right:10%;top:45%;width:18vw}}@media(max-width: 1024px)and (min-aspect-ratio: 0.95){.sea-main .sea-inner .sea-icon.drawing{width:30vw;left:18%}.sea-main .sea-inner .sea-icon.my-island{right:0%;width:25vw}.sea-main .sea-inner .sea-icon.my-island .remain-beans p{font-size:1rem}.sea-main .sea-inner .sea-icon.writing{right:28%;width:28vw}.sea-main .sea-inner .sea-icon.wave5{left:30%}.sea-main .sea-inner .sea-icon.wave3{width:8vw;bottom:20%;right:13%}.sea-main .sea-inner .sea-icon.swim-girl{left:30%;width:8vw}.sea-main .sea-inner .sea-icon.shortform{width:27vw}.sea-main .sea-inner .sea-icon.boat{left:-50px}.sea-main .sea-inner .sea-icon.music{right:12%;width:20vw;top:40%}.sea-main .sea-inner .sea-icon.whale{right:31%}.sea-main .sea-inner .sea-icon.island-2{top:35%;right:40%}.sea-main .sea-inner .sea-icon.storybook{width:24vw;bottom:8%}.sea-main .sea-inner .sea-icon.storyland{bottom:30px;right:21%;width:28vw}.sea-main .sea-inner .sea-icon.october{bottom:4%}}@media(min-aspect-ratio: 1)and (max-aspect-ratio: 1.2){.sea-main .sea-inner .sea-icon.drawing{width:32vw;left:18%;top:40%}.sea-main .sea-inner .sea-icon.my-island{right:0%;width:28vw}.sea-main .sea-inner .sea-icon.my-island .remain-beans p{font-size:1rem}.sea-main .sea-inner .sea-icon.writing{right:32%;width:29vw}.sea-main .sea-inner .sea-icon.wave5{top:30%;left:30%}.sea-main .sea-inner .sea-icon.wave3{width:8vw;bottom:20%;right:11%}.sea-main .sea-inner .sea-icon.swim-girl{left:30%;top:20%;width:8vw}.sea-main .sea-inner .sea-icon.shortform{width:28vw}.sea-main .sea-inner .sea-icon.boat{left:-50px;width:23vw;top:35%}.sea-main .sea-inner .sea-icon.music{right:7%;width:24vw;top:37%}.sea-main .sea-inner .sea-icon.whale{right:32%}.sea-main .sea-inner .sea-icon.island-2{top:35%;right:40%}.sea-main .sea-inner .sea-icon.storybook{width:27vw;bottom:8%}.sea-main .sea-inner .sea-icon.storyland{bottom:30px;right:17%;width:31vw}.sea-main .sea-inner .sea-icon.october{bottom:4%;left:29%}}@media(min-aspect-ratio: 1.2)and (max-aspect-ratio: 1.25){.sea-main .sea-inner .sea-icon.drawing{width:30vw;left:18%}.sea-main .sea-inner .sea-icon.my-island{right:0%;width:25vw}.sea-main .sea-inner .sea-icon.my-island .remain-beans p{font-size:1rem}.sea-main .sea-inner .sea-icon.writing{right:28%;width:28vw}.sea-main .sea-inner .sea-icon.wave5{left:30%}.sea-main .sea-inner .sea-icon.wave3{width:8vw;bottom:20%;right:13%}.sea-main .sea-inner .sea-icon.swim-girl{left:30%;width:8vw}.sea-main .sea-inner .sea-icon.shortform{width:27vw}.sea-main .sea-inner .sea-icon.boat{left:-50px}.sea-main .sea-inner .sea-icon.music{right:12%;width:20vw;top:40%}.sea-main .sea-inner .sea-icon.whale{right:31%}.sea-main .sea-inner .sea-icon.island-2{top:35%;right:40%}.sea-main .sea-inner .sea-icon.storybook{width:24vw;bottom:8%}.sea-main .sea-inner .sea-icon.storyland{bottom:30px;right:21%;width:28vw}.sea-main .sea-inner .sea-icon.october{bottom:4%}}@media(min-aspect-ratio: 1.25)and (max-aspect-ratio: 1.3){.sea-main .sea-inner .sea-icon.drawing{width:30vw;left:18%}.sea-main .sea-inner .sea-icon.my-island{right:0%;width:25vw}.sea-main .sea-inner .sea-icon.my-island .remain-beans p{font-size:1rem}.sea-main .sea-inner .sea-icon.writing{right:28%;width:28vw}.sea-main .sea-inner .sea-icon.wave5{left:30%}.sea-main .sea-inner .sea-icon.wave3{width:8vw;bottom:20%;right:13%}.sea-main .sea-inner .sea-icon.swim-girl{left:30%;width:8vw}.sea-main .sea-inner .sea-icon.shortform{width:27vw}.sea-main .sea-inner .sea-icon.boat{left:-50px}.sea-main .sea-inner .sea-icon.music{right:12%;width:20vw;top:40%}.sea-main .sea-inner .sea-icon.whale{right:31%}.sea-main .sea-inner .sea-icon.island-2{top:35%;right:40%}.sea-main .sea-inner .sea-icon.storybook{width:24vw;bottom:8%}.sea-main .sea-inner .sea-icon.storyland{bottom:30px;right:21%;width:28vw}.sea-main .sea-inner .sea-icon.october{bottom:4%}}@media(min-width: 768px)and (min-aspect-ratio: 0.8)and (max-aspect-ratio: 0.95){.sea-main .sea-inner .sea-icon.shortform{width:33vw}.sea-main .sea-inner .sea-icon.music{width:32vw;top:36%;right:10%}.sea-main .sea-inner .sea-icon.my-island{width:33vw}.sea-main .sea-inner .sea-icon.boat{top:30%}.sea-main .sea-inner .sea-icon.wave5{top:40%}.sea-main .sea-inner .sea-icon.swim-girl{top:33%}.sea-main .sea-inner .sea-icon.writing{right:32%;width:34vw;top:18%}.sea-main .sea-inner .sea-icon.drawing{width:40vw;top:45%;left:6%}.sea-main .sea-inner .sea-icon.storyland{right:14%;width:39vw;bottom:7%}.sea-main .sea-inner .sea-icon.wave3{bottom:34%;right:23%}.sea-main .sea-inner .sea-icon.october{bottom:1%;left:34%}.sea-main .sea-inner .sea-icon.island{left:31%}.sea-main .sea-inner .sea-icon.storybook{width:33vw;bottom:6%}.sea-main .sea-inner .sea-icon.boat{width:27vw}.sea-main .sea-inner .sea-icon.whale{display:none}.sea-main .sea-inner .sea-icon.island-2{top:45%;right:50%}}@media(max-width: 1440px)and (min-aspect-ratio: 1.95){.sea-main .sea-inner .sea-icon.shortform{width:20vw}.sea-main .sea-inner .sea-icon.swim-girl{left:22%}.sea-main .sea-inner .sea-icon.wave5{left:22%}.sea-main .sea-inner .sea-icon.wave3{bottom:10%}.sea-main .sea-inner .sea-icon.writing{width:22vw;right:40%}.sea-main .sea-inner .sea-icon.my-island{width:20vw;right:10%}.sea-main .sea-inner .sea-icon.island-2{top:30%;right:33%;width:3vw}.sea-main .sea-inner .sea-icon.boat{width:18vw;top:34%}.sea-main .sea-inner .sea-icon.drawing{width:22vw;left:23%}.sea-main .sea-inner .sea-icon.storybook{width:21vw}.sea-main .sea-inner .sea-icon.island{width:3vw}.sea-main .sea-inner .sea-icon.storyland{width:23vw;right:28%}.sea-main .sea-inner .sea-icon.music{width:16vw}.sea-main .sea-inner .sea-icon.october{width:18vw}}@media(max-aspect-ratio: 0.8){.sea-main .sea-inner .sea-icon.shortform{width:33vw}.sea-main .sea-inner .sea-icon.music{width:32vw;top:36%;right:10%}.sea-main .sea-inner .sea-icon.my-island{width:33vw}.sea-main .sea-inner .sea-icon.boat{top:30%}.sea-main .sea-inner .sea-icon.wave5{top:40%}.sea-main .sea-inner .sea-icon.swim-girl{top:33%}.sea-main .sea-inner .sea-icon.writing{right:32%;width:34vw;top:18%}.sea-main .sea-inner .sea-icon.drawing{width:40vw;top:45%;left:6%}.sea-main .sea-inner .sea-icon.storyland{right:14%;width:39vw;bottom:7%}.sea-main .sea-inner .sea-icon.wave3{bottom:34%;right:23%}.sea-main .sea-inner .sea-icon.october{bottom:1%;left:34%}.sea-main .sea-inner .sea-icon.island{left:31%}.sea-main .sea-inner .sea-icon.storybook{width:33vw;bottom:6%}.sea-main .sea-inner .sea-icon.boat{width:27vw}.sea-main .sea-inner .sea-icon.whale{display:none}.sea-main .sea-inner .sea-icon.island-2{top:45%;right:50%}}
@charset "UTF-8";/*!
 * animate.css - https://animate.style/
 * Version - 4.1.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2020 Animate.css
 */
:root {
  --animate-duration: 1s;
  --animate-delay: 1s;
  --animate-repeat: 1;
}
.animate__animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-duration: var(--animate-duration);
  animation-duration: var(--animate-duration);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animate__animated.animate__infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.animate__animated.animate__repeat-1 {
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-iteration-count: var(--animate-repeat);
  animation-iteration-count: var(--animate-repeat);
}
.animate__animated.animate__repeat-2 {
  -webkit-animation-iteration-count: calc(1 * 2);
  animation-iteration-count: calc(1 * 2);
  -webkit-animation-iteration-count: calc(var(--animate-repeat) * 2);
  animation-iteration-count: calc(var(--animate-repeat) * 2);
}
.animate__animated.animate__repeat-3 {
  -webkit-animation-iteration-count: calc(1 * 3);
  animation-iteration-count: calc(1 * 3);
  -webkit-animation-iteration-count: calc(var(--animate-repeat) * 3);
  animation-iteration-count: calc(var(--animate-repeat) * 3);
}
.animate__animated.animate__delay-1s {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
  -webkit-animation-delay: var(--animate-delay);
  animation-delay: var(--animate-delay);
}
.animate__animated.animate__delay-2s {
  -webkit-animation-delay: calc(1s * 2);
  animation-delay: calc(1s * 2);
  -webkit-animation-delay: calc(var(--animate-delay) * 2);
  animation-delay: calc(var(--animate-delay) * 2);
}
.animate__animated.animate__delay-3s {
  -webkit-animation-delay: calc(1s * 3);
  animation-delay: calc(1s * 3);
  -webkit-animation-delay: calc(var(--animate-delay) * 3);
  animation-delay: calc(var(--animate-delay) * 3);
}
.animate__animated.animate__delay-4s {
  -webkit-animation-delay: calc(1s * 4);
  animation-delay: calc(1s * 4);
  -webkit-animation-delay: calc(var(--animate-delay) * 4);
  animation-delay: calc(var(--animate-delay) * 4);
}
.animate__animated.animate__delay-5s {
  -webkit-animation-delay: calc(1s * 5);
  animation-delay: calc(1s * 5);
  -webkit-animation-delay: calc(var(--animate-delay) * 5);
  animation-delay: calc(var(--animate-delay) * 5);
}
.animate__animated.animate__faster {
  -webkit-animation-duration: calc(1s / 2);
  animation-duration: calc(1s / 2);
  -webkit-animation-duration: calc(var(--animate-duration) / 2);
  animation-duration: calc(var(--animate-duration) / 2);
}
.animate__animated.animate__fast {
  -webkit-animation-duration: calc(1s * 0.8);
  animation-duration: calc(1s * 0.8);
  -webkit-animation-duration: calc(var(--animate-duration) * 0.8);
  animation-duration: calc(var(--animate-duration) * 0.8);
}
.animate__animated.animate__slow {
  -webkit-animation-duration: calc(1s * 2);
  animation-duration: calc(1s * 2);
  -webkit-animation-duration: calc(var(--animate-duration) * 2);
  animation-duration: calc(var(--animate-duration) * 2);
}
.animate__animated.animate__slower {
  -webkit-animation-duration: calc(1s * 3);
  animation-duration: calc(1s * 3);
  -webkit-animation-duration: calc(var(--animate-duration) * 3);
  animation-duration: calc(var(--animate-duration) * 3);
}
@media print, (prefers-reduced-motion: reduce) {
  .animate__animated {
    -webkit-animation-duration: 1ms !important;
    animation-duration: 1ms !important;
    -webkit-transition-duration: 1ms !important;
    transition-duration: 1ms !important;
    -webkit-animation-iteration-count: 1 !important;
    animation-iteration-count: 1 !important;
  }

  .animate__animated[class*='Out'] {
    opacity: 0;
  }
}
/* Attention seekers  */
@-webkit-keyframes bounce {
  from,
  20%,
  53%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0) scaleY(1.1);
    transform: translate3d(0, -30px, 0) scaleY(1.1);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0) scaleY(1.05);
    transform: translate3d(0, -15px, 0) scaleY(1.05);
  }

  80% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0) scaleY(0.95);
    transform: translate3d(0, 0, 0) scaleY(0.95);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0) scaleY(1.02);
    transform: translate3d(0, -4px, 0) scaleY(1.02);
  }
}
@keyframes bounce {
  from,
  20%,
  53%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0) scaleY(1.1);
    transform: translate3d(0, -30px, 0) scaleY(1.1);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0) scaleY(1.05);
    transform: translate3d(0, -15px, 0) scaleY(1.05);
  }

  80% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0) scaleY(0.95);
    transform: translate3d(0, 0, 0) scaleY(0.95);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0) scaleY(1.02);
    transform: translate3d(0, -4px, 0) scaleY(1.02);
  }
}
.animate__bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}
@-webkit-keyframes flash {
  from,
  50%,
  to {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}
@keyframes flash {
  from,
  50%,
  to {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}
.animate__flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.animate__pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
}
@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.animate__rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}
@-webkit-keyframes shakeX {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}
@keyframes shakeX {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}
.animate__shakeX {
  -webkit-animation-name: shakeX;
  animation-name: shakeX;
}
@-webkit-keyframes shakeY {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
}
@keyframes shakeY {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
}
.animate__shakeY {
  -webkit-animation-name: shakeY;
  animation-name: shakeY;
}
@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.animate__headShake {
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-name: headShake;
  animation-name: headShake;
}
@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
.animate__swing {
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}
@-webkit-keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%,
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }

  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%,
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }

  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.animate__tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes wobble {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes wobble {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}
@-webkit-keyframes jello {
  from,
  11.1%,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}
@keyframes jello {
  from,
  11.1%,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}
.animate__jello {
  -webkit-animation-name: jello;
  animation-name: jello;
  -webkit-transform-origin: center;
  transform-origin: center;
}
@-webkit-keyframes heartBeat {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  14% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }

  28% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  42% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }

  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes heartBeat {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  14% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }

  28% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  42% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }

  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.animate__heartBeat {
  -webkit-animation-name: heartBeat;
  animation-name: heartBeat;
  -webkit-animation-duration: calc(1s * 1.3);
  animation-duration: calc(1s * 1.3);
  -webkit-animation-duration: calc(var(--animate-duration) * 1.3);
  animation-duration: calc(var(--animate-duration) * 1.3);
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
}
/* Back entrances */
@-webkit-keyframes backInDown {
  0% {
    -webkit-transform: translateY(-1200px) scale(0.7);
    transform: translateY(-1200px) scale(0.7);
    opacity: 0.7;
  }

  80% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes backInDown {
  0% {
    -webkit-transform: translateY(-1200px) scale(0.7);
    transform: translateY(-1200px) scale(0.7);
    opacity: 0.7;
  }

  80% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
.animate__backInDown {
  -webkit-animation-name: backInDown;
  animation-name: backInDown;
}
@-webkit-keyframes backInLeft {
  0% {
    -webkit-transform: translateX(-2000px) scale(0.7);
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }

  80% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes backInLeft {
  0% {
    -webkit-transform: translateX(-2000px) scale(0.7);
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }

  80% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
.animate__backInLeft {
  -webkit-animation-name: backInLeft;
  animation-name: backInLeft;
}
@-webkit-keyframes backInRight {
  0% {
    -webkit-transform: translateX(2000px) scale(0.7);
    transform: translateX(2000px) scale(0.7);
    opacity: 0.7;
  }

  80% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes backInRight {
  0% {
    -webkit-transform: translateX(2000px) scale(0.7);
    transform: translateX(2000px) scale(0.7);
    opacity: 0.7;
  }

  80% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
.animate__backInRight {
  -webkit-animation-name: backInRight;
  animation-name: backInRight;
}
@-webkit-keyframes backInUp {
  0% {
    -webkit-transform: translateY(1200px) scale(0.7);
    transform: translateY(1200px) scale(0.7);
    opacity: 0.7;
  }

  80% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes backInUp {
  0% {
    -webkit-transform: translateY(1200px) scale(0.7);
    transform: translateY(1200px) scale(0.7);
    opacity: 0.7;
  }

  80% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
.animate__backInUp {
  -webkit-animation-name: backInUp;
  animation-name: backInUp;
}
/* Back exits */
@-webkit-keyframes backOutDown {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  20% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: translateY(700px) scale(0.7);
    transform: translateY(700px) scale(0.7);
    opacity: 0.7;
  }
}
@keyframes backOutDown {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  20% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: translateY(700px) scale(0.7);
    transform: translateY(700px) scale(0.7);
    opacity: 0.7;
  }
}
.animate__backOutDown {
  -webkit-animation-name: backOutDown;
  animation-name: backOutDown;
}
@-webkit-keyframes backOutLeft {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  20% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: translateX(-2000px) scale(0.7);
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }
}
@keyframes backOutLeft {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  20% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: translateX(-2000px) scale(0.7);
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }
}
.animate__backOutLeft {
  -webkit-animation-name: backOutLeft;
  animation-name: backOutLeft;
}
@-webkit-keyframes backOutRight {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  20% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: translateX(2000px) scale(0.7);
    transform: translateX(2000px) scale(0.7);
    opacity: 0.7;
  }
}
@keyframes backOutRight {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  20% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: translateX(2000px) scale(0.7);
    transform: translateX(2000px) scale(0.7);
    opacity: 0.7;
  }
}
.animate__backOutRight {
  -webkit-animation-name: backOutRight;
  animation-name: backOutRight;
}
@-webkit-keyframes backOutUp {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  20% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: translateY(-700px) scale(0.7);
    transform: translateY(-700px) scale(0.7);
    opacity: 0.7;
  }
}
@keyframes backOutUp {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  20% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }

  100% {
    -webkit-transform: translateY(-700px) scale(0.7);
    transform: translateY(-700px) scale(0.7);
    opacity: 0.7;
  }
}
.animate__backOutUp {
  -webkit-animation-name: backOutUp;
  animation-name: backOutUp;
}
/* Bouncing entrances  */
@-webkit-keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.animate__bounceIn {
  -webkit-animation-duration: calc(1s * 0.75);
  animation-duration: calc(1s * 0.75);
  -webkit-animation-duration: calc(var(--animate-duration) * 0.75);
  animation-duration: calc(var(--animate-duration) * 0.75);
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}
@-webkit-keyframes bounceInDown {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0) scaleY(3);
    transform: translate3d(0, -3000px, 0) scaleY(3);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0) scaleY(0.9);
    transform: translate3d(0, 25px, 0) scaleY(0.9);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0) scaleY(0.95);
    transform: translate3d(0, -10px, 0) scaleY(0.95);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0) scaleY(0.985);
    transform: translate3d(0, 5px, 0) scaleY(0.985);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes bounceInDown {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0) scaleY(3);
    transform: translate3d(0, -3000px, 0) scaleY(3);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0) scaleY(0.9);
    transform: translate3d(0, 25px, 0) scaleY(0.9);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0) scaleY(0.95);
    transform: translate3d(0, -10px, 0) scaleY(0.95);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0) scaleY(0.985);
    transform: translate3d(0, 5px, 0) scaleY(0.985);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}
@-webkit-keyframes bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0) scaleX(3);
    transform: translate3d(-3000px, 0, 0) scaleX(3);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0) scaleX(1);
    transform: translate3d(25px, 0, 0) scaleX(1);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0) scaleX(0.98);
    transform: translate3d(-10px, 0, 0) scaleX(0.98);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0) scaleX(0.995);
    transform: translate3d(5px, 0, 0) scaleX(0.995);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0) scaleX(3);
    transform: translate3d(-3000px, 0, 0) scaleX(3);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0) scaleX(1);
    transform: translate3d(25px, 0, 0) scaleX(1);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0) scaleX(0.98);
    transform: translate3d(-10px, 0, 0) scaleX(0.98);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0) scaleX(0.995);
    transform: translate3d(5px, 0, 0) scaleX(0.995);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInRight {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0) scaleX(3);
    transform: translate3d(3000px, 0, 0) scaleX(3);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0) scaleX(1);
    transform: translate3d(-25px, 0, 0) scaleX(1);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0) scaleX(0.98);
    transform: translate3d(10px, 0, 0) scaleX(0.98);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0) scaleX(0.995);
    transform: translate3d(-5px, 0, 0) scaleX(0.995);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes bounceInRight {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0) scaleX(3);
    transform: translate3d(3000px, 0, 0) scaleX(3);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0) scaleX(1);
    transform: translate3d(-25px, 0, 0) scaleX(1);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0) scaleX(0.98);
    transform: translate3d(10px, 0, 0) scaleX(0.98);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0) scaleX(0.995);
    transform: translate3d(-5px, 0, 0) scaleX(0.995);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}
@-webkit-keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0) scaleY(5);
    transform: translate3d(0, 3000px, 0) scaleY(5);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.95);
    transform: translate3d(0, 10px, 0) scaleY(0.95);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0) scaleY(0.985);
    transform: translate3d(0, -5px, 0) scaleY(0.985);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0) scaleY(5);
    transform: translate3d(0, 3000px, 0) scaleY(5);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.95);
    transform: translate3d(0, 10px, 0) scaleY(0.95);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0) scaleY(0.985);
    transform: translate3d(0, -5px, 0) scaleY(0.985);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}
/* Bouncing exits  */
@-webkit-keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  50%,
  55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}
@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  50%,
  55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}
.animate__bounceOut {
  -webkit-animation-duration: calc(1s * 0.75);
  animation-duration: calc(1s * 0.75);
  -webkit-animation-duration: calc(var(--animate-duration) * 0.75);
  animation-duration: calc(var(--animate-duration) * 0.75);
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}
@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.985);
    transform: translate3d(0, 10px, 0) scaleY(0.985);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0) scaleY(3);
    transform: translate3d(0, 2000px, 0) scaleY(3);
  }
}
@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.985);
    transform: translate3d(0, 10px, 0) scaleY(0.985);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0) scaleY(3);
    transform: translate3d(0, 2000px, 0) scaleY(3);
  }
}
.animate__bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}
@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0) scaleX(0.9);
    transform: translate3d(20px, 0, 0) scaleX(0.9);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0) scaleX(2);
    transform: translate3d(-2000px, 0, 0) scaleX(2);
  }
}
@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0) scaleX(0.9);
    transform: translate3d(20px, 0, 0) scaleX(0.9);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0) scaleX(2);
    transform: translate3d(-2000px, 0, 0) scaleX(2);
  }
}
.animate__bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}
@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0) scaleX(0.9);
    transform: translate3d(-20px, 0, 0) scaleX(0.9);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0) scaleX(2);
    transform: translate3d(2000px, 0, 0) scaleX(2);
  }
}
@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0) scaleX(0.9);
    transform: translate3d(-20px, 0, 0) scaleX(0.9);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0) scaleX(2);
    transform: translate3d(2000px, 0, 0) scaleX(2);
  }
}
.animate__bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}
@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0) scaleY(0.985);
    transform: translate3d(0, -10px, 0) scaleY(0.985);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0) scaleY(0.9);
    transform: translate3d(0, 20px, 0) scaleY(0.9);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0) scaleY(3);
    transform: translate3d(0, -2000px, 0) scaleY(3);
  }
}
@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0) scaleY(0.985);
    transform: translate3d(0, -10px, 0) scaleY(0.985);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0) scaleY(0.9);
    transform: translate3d(0, 20px, 0) scaleY(0.9);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0) scaleY(3);
    transform: translate3d(0, -2000px, 0) scaleY(3);
  }
}
.animate__bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}
/* Fading entrances  */
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}
.animate__fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}
@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}
@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}
@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}
@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}
@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}
@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}
@-webkit-keyframes fadeInTopLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, -100%, 0);
    transform: translate3d(-100%, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInTopLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, -100%, 0);
    transform: translate3d(-100%, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInTopLeft {
  -webkit-animation-name: fadeInTopLeft;
  animation-name: fadeInTopLeft;
}
@-webkit-keyframes fadeInTopRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, -100%, 0);
    transform: translate3d(100%, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInTopRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, -100%, 0);
    transform: translate3d(100%, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInTopRight {
  -webkit-animation-name: fadeInTopRight;
  animation-name: fadeInTopRight;
}
@-webkit-keyframes fadeInBottomLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 100%, 0);
    transform: translate3d(-100%, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInBottomLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 100%, 0);
    transform: translate3d(-100%, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInBottomLeft {
  -webkit-animation-name: fadeInBottomLeft;
  animation-name: fadeInBottomLeft;
}
@-webkit-keyframes fadeInBottomRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 100%, 0);
    transform: translate3d(100%, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInBottomRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 100%, 0);
    transform: translate3d(100%, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__fadeInBottomRight {
  -webkit-animation-name: fadeInBottomRight;
  animation-name: fadeInBottomRight;
}
/* Fading exits */
@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}
.animate__fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}
@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
.animate__fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}
@-webkit-keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}
@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}
.animate__fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}
@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
.animate__fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}
@-webkit-keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}
@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}
.animate__fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}
@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
@keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
.animate__fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}
@-webkit-keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}
@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}
.animate__fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}
@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
@keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
.animate__fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}
@-webkit-keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}
@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}
.animate__fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}
@-webkit-keyframes fadeOutTopLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, -100%, 0);
    transform: translate3d(-100%, -100%, 0);
  }
}
@keyframes fadeOutTopLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, -100%, 0);
    transform: translate3d(-100%, -100%, 0);
  }
}
.animate__fadeOutTopLeft {
  -webkit-animation-name: fadeOutTopLeft;
  animation-name: fadeOutTopLeft;
}
@-webkit-keyframes fadeOutTopRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, -100%, 0);
    transform: translate3d(100%, -100%, 0);
  }
}
@keyframes fadeOutTopRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, -100%, 0);
    transform: translate3d(100%, -100%, 0);
  }
}
.animate__fadeOutTopRight {
  -webkit-animation-name: fadeOutTopRight;
  animation-name: fadeOutTopRight;
}
@-webkit-keyframes fadeOutBottomRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 100%, 0);
    transform: translate3d(100%, 100%, 0);
  }
}
@keyframes fadeOutBottomRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 100%, 0);
    transform: translate3d(100%, 100%, 0);
  }
}
.animate__fadeOutBottomRight {
  -webkit-animation-name: fadeOutBottomRight;
  animation-name: fadeOutBottomRight;
}
@-webkit-keyframes fadeOutBottomLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 100%, 0);
    transform: translate3d(-100%, 100%, 0);
  }
}
@keyframes fadeOutBottomLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 100%, 0);
    transform: translate3d(-100%, 100%, 0);
  }
}
.animate__fadeOutBottomLeft {
  -webkit-animation-name: fadeOutBottomLeft;
  animation-name: fadeOutBottomLeft;
}
/* Flippers */
@-webkit-keyframes flip {
  from {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}
@keyframes flip {
  from {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}
.animate__animated.animate__flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}
@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
.animate__flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}
@-webkit-keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
.animate__flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}
@-webkit-keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}
@keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}
.animate__flipOutX {
  -webkit-animation-duration: calc(1s * 0.75);
  animation-duration: calc(1s * 0.75);
  -webkit-animation-duration: calc(var(--animate-duration) * 0.75);
  animation-duration: calc(var(--animate-duration) * 0.75);
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}
@-webkit-keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}
@keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}
.animate__flipOutY {
  -webkit-animation-duration: calc(1s * 0.75);
  animation-duration: calc(1s * 0.75);
  -webkit-animation-duration: calc(var(--animate-duration) * 0.75);
  animation-duration: calc(var(--animate-duration) * 0.75);
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}
/* Lightspeed */
@-webkit-keyframes lightSpeedInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes lightSpeedInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__lightSpeedInRight {
  -webkit-animation-name: lightSpeedInRight;
  animation-name: lightSpeedInRight;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}
@-webkit-keyframes lightSpeedInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0) skewX(30deg);
    transform: translate3d(-100%, 0, 0) skewX(30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(-20deg);
    transform: skewX(-20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(5deg);
    transform: skewX(5deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes lightSpeedInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0) skewX(30deg);
    transform: translate3d(-100%, 0, 0) skewX(30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(-20deg);
    transform: skewX(-20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(5deg);
    transform: skewX(5deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__lightSpeedInLeft {
  -webkit-animation-name: lightSpeedInLeft;
  animation-name: lightSpeedInLeft;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}
@-webkit-keyframes lightSpeedOutRight {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}
@keyframes lightSpeedOutRight {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}
.animate__lightSpeedOutRight {
  -webkit-animation-name: lightSpeedOutRight;
  animation-name: lightSpeedOutRight;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}
@-webkit-keyframes lightSpeedOutLeft {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(-100%, 0, 0) skewX(-30deg);
    transform: translate3d(-100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }
}
@keyframes lightSpeedOutLeft {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(-100%, 0, 0) skewX(-30deg);
    transform: translate3d(-100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }
}
.animate__lightSpeedOutLeft {
  -webkit-animation-name: lightSpeedOutLeft;
  animation-name: lightSpeedOutLeft;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}
/* Rotating entrances */
@-webkit-keyframes rotateIn {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateIn {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
.animate__rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
  -webkit-transform-origin: center;
  transform-origin: center;
}
@-webkit-keyframes rotateInDownLeft {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateInDownLeft {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
.animate__rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
}
@-webkit-keyframes rotateInDownRight {
  from {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateInDownRight {
  from {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
.animate__rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
  -webkit-transform-origin: right bottom;
  transform-origin: right bottom;
}
@-webkit-keyframes rotateInUpLeft {
  from {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateInUpLeft {
  from {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
.animate__rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
}
@-webkit-keyframes rotateInUpRight {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateInUpRight {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
.animate__rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
  -webkit-transform-origin: right bottom;
  transform-origin: right bottom;
}
/* Rotating exits */
@-webkit-keyframes rotateOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}
@keyframes rotateOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}
.animate__rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
  -webkit-transform-origin: center;
  transform-origin: center;
}
@-webkit-keyframes rotateOutDownLeft {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}
@keyframes rotateOutDownLeft {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}
.animate__rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
}
@-webkit-keyframes rotateOutDownRight {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
@keyframes rotateOutDownRight {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
.animate__rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
  -webkit-transform-origin: right bottom;
  transform-origin: right bottom;
}
@-webkit-keyframes rotateOutUpLeft {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
@keyframes rotateOutUpLeft {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
.animate__rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
}
@-webkit-keyframes rotateOutUpRight {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}
@keyframes rotateOutUpRight {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}
.animate__rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
  -webkit-transform-origin: right bottom;
  transform-origin: right bottom;
}
/* Specials */
@-webkit-keyframes hinge {
  0% {
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%,
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%,
  80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}
@keyframes hinge {
  0% {
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%,
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%,
  80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}
.animate__hinge {
  -webkit-animation-duration: calc(1s * 2);
  animation-duration: calc(1s * 2);
  -webkit-animation-duration: calc(var(--animate-duration) * 2);
  animation-duration: calc(var(--animate-duration) * 2);
  -webkit-animation-name: hinge;
  animation-name: hinge;
  -webkit-transform-origin: top left;
  transform-origin: top left;
}
@-webkit-keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
    transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }

  50% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  70% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
    transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }

  50% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  70% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.animate__jackInTheBox {
  -webkit-animation-name: jackInTheBox;
  animation-name: jackInTheBox;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}
@keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}
.animate__rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut;
}
/* Zooming entrances */
@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  50% {
    opacity: 1;
  }
}
@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  50% {
    opacity: 1;
  }
}
.animate__zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}
@-webkit-keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.animate__zoomInDown {
  -webkit-animation-name: zoomInDown;
  animation-name: zoomInDown;
}
@-webkit-keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.animate__zoomInLeft {
  -webkit-animation-name: zoomInLeft;
  animation-name: zoomInLeft;
}
@-webkit-keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.animate__zoomInRight {
  -webkit-animation-name: zoomInRight;
  animation-name: zoomInRight;
}
@-webkit-keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.animate__zoomInUp {
  -webkit-animation-name: zoomInUp;
  animation-name: zoomInUp;
}
/* Zooming exits */
@-webkit-keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  to {
    opacity: 0;
  }
}
@keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  to {
    opacity: 0;
  }
}
.animate__zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}
@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.animate__zoomOutDown {
  -webkit-animation-name: zoomOutDown;
  animation-name: zoomOutDown;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}
@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
  }
}
@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
  }
}
.animate__zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
  animation-name: zoomOutLeft;
  -webkit-transform-origin: left center;
  transform-origin: left center;
}
@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
  }
}
@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
  }
}
.animate__zoomOutRight {
  -webkit-animation-name: zoomOutRight;
  animation-name: zoomOutRight;
  -webkit-transform-origin: right center;
  transform-origin: right center;
}
@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.animate__zoomOutUp {
  -webkit-animation-name: zoomOutUp;
  animation-name: zoomOutUp;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}
/* Sliding entrances */
@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}
@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}
@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.animate__slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
/* Sliding exits */
@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
@keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
.animate__slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown;
}
@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
.animate__slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}
@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
.animate__slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}
@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
.animate__slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

.senior-main-page{width:100%;height:100vh;position:relative;background:url(/static/media/senior-main-bg.ce103f1931114ee1a9a9.svg) no-repeat bottom/cover}.senior-main-page .go-magic-home{position:fixed;top:20px;left:20px;cursor:pointer;z-index:10;width:10vw}.senior-main-page .senior-top-deco .signboard-container{width:100%;height:136px;background-color:#234a2b;position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.senior-main-page .senior-top-deco .signboard-container .senior-main-title{width:28vw}.senior-main-page .senior-top-deco .main-deco-flag{position:relative;top:-32px}.senior-main-page .wide-inner .senior-menu-list{display:flex;align-items:center;justify-content:center;gap:.5rem}.senior-main-page .wide-inner .senior-menu-list li{cursor:pointer}.senior-main-page .senior-deco-right{position:fixed;right:-53px;bottom:6px;z-index:10}.senior-main-page .senior-bottom-deco{position:fixed;bottom:0;left:0;width:100%;height:40px;background-color:#381f12}@keyframes main-menu-in{to{opacity:1;transform:translateY(0) scale(1)}}.senior-main-page{--main-ease: cubic-bezier(0.2, 0.8, 0.2, 1);--main-stagger: 100ms}.senior-main-page .wide-inner .senior-menu-list li.senior-menu{opacity:0;transform:translateY(12px) scale(0.98);animation:main-menu-in 480ms var(--main-ease) forwards}.senior-main-page .wide-inner .senior-menu-list li.senior-menu:nth-child(1){animation-delay:calc(200ms + 1*var(--main-stagger))}.senior-main-page .wide-inner .senior-menu-list li.senior-menu:nth-child(2){animation-delay:calc(200ms + 2*var(--main-stagger))}.senior-main-page .wide-inner .senior-menu-list li.senior-menu:nth-child(3){animation-delay:calc(200ms + 3*var(--main-stagger))}.senior-main-page .wide-inner .senior-menu-list li.senior-menu:nth-child(4){animation-delay:calc(200ms + 4*var(--main-stagger))}.senior-main-page .wide-inner .senior-menu-list li.senior-menu:nth-child(5){animation-delay:calc(200ms + 5*var(--main-stagger))}.senior-main-page .wide-inner .senior-menu-list li.senior-menu:nth-child(6){animation-delay:calc(200ms + 6*var(--main-stagger))}.senior-main-page .wide-inner .senior-menu-list li.senior-menu:nth-child(7){animation-delay:calc(200ms + 7*var(--main-stagger))}.senior-main-page .wide-inner .senior-menu-list li.senior-menu:nth-child(8){animation-delay:calc(200ms + 8*var(--main-stagger))}@media(prefers-reduced-motion: reduce){.senior-main-page .senior-menu-list li.senior-menu{animation:none !important;opacity:1 !important;transform:none !important}}
.senior-shortform{width:100%;height:100vh;background-color:#2e2e2e;display:flex;align-items:center;justify-content:center;font-family:"Tuho"}.senior-shortform button{border:none;background:none}.senior-shortform .wide-inner{width:100%;padding:.8rem;border-radius:.5rem;background-color:#262434;border:2px solid var(--bs-white);display:flex;align-items:center;justify-content:center;gap:1rem}.senior-shortform .wide-inner .senior-shortform-left{width:85%;height:auto;background-color:#2c2e41;border:2px solid #1f1f1f;border-radius:1rem;padding:1rem}.senior-shortform .wide-inner .senior-shortform-left .senior-shortform-conts{background-color:#282828;border:2px solid #828282;border-radius:2rem;overflow:hidden}.senior-shortform .wide-inner .senior-shortform-left .senior-shortform-conts .panel{height:90vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.senior-shortform .wide-inner .senior-shortform-right .shortform-adjust{width:10vw}
.panel{height:90vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.panel.panel-intro{background:url(/static/media/senior-shortform-intro-bg.324bff2bf07f95f15b23.svg) no-repeat center/cover;position:relative}.panel.panel-intro .tv-screen{position:relative;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;text-align:center}.panel.panel-intro .tv-screen figure{margin:0}.panel.panel-intro .tv-screen img{display:block}.panel.panel-intro .tv-screen{filter:saturate(0.95) contrast(1.02)}.panel.panel-intro .tv-screen::before{content:"";pointer-events:none;position:absolute;inset:0;background:linear-gradient(to bottom, rgba(255, 255, 255, 0.04) 0%, rgba(0, 0, 0, 0.04) 2%, transparent 3%);background-size:100% 3px;opacity:0;transition:opacity .6s ease .7s}.panel.panel-intro .tv-screen::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 50%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.35) 100%);opacity:0;animation:tvFlicker 1.2s ease-in-out 1.1s 2 alternate}.panel.panel-intro.power-on .tv-screen{animation:tvOn 900ms ease-out forwards}.panel.panel-intro.power-on .tv-screen::before{opacity:.35}.panel.panel-intro.power-on .tv-screen::after{opacity:1}.panel.panel-intro .intro-title{width:min(65vw, 920px);margin:0 auto;transform:scale(0);animation:introScale .8s ease-out forwards;animation-delay:.7s}.panel.panel-intro .home{position:absolute;top:10px;left:10px;cursor:pointer}.panel.panel-intro .desc{font-size:clamp(1.6rem,3vw,3rem);line-height:1.3;color:var(--bs-white);position:relative;opacity:0;transform:translateY(20px);animation:rotateScaleUp .5s ease-out forwards;animation-delay:1.2s}.panel.panel-intro .desc span{color:#fffb88}.panel.panel-intro .desc .deco{position:absolute}.panel.panel-intro .desc .deco.deco-1{right:-30px;bottom:40px}.panel.panel-intro .desc .deco.deco-2{left:-40px;top:-25px}.panel.panel-intro .intro-next{cursor:pointer;width:clamp(80px,10vw,180px);opacity:0;transform:scale(0.8);animation:popUp .6s ease-out forwards;animation-delay:2s}@keyframes introScale{0%{transform:scale(0);opacity:0}60%{transform:scale(1.1);opacity:1}100%{transform:scale(1);opacity:1}}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}100%{opacity:1;transform:translateY(0)}}@keyframes rotateScaleUp{0%{opacity:0;transform:rotate(0deg) scale(0)}100%{opacity:1;transform:rotate(360deg) scale(1)}}@keyframes popUp{0%{opacity:0;transform:scale(0.8)}100%{opacity:1;transform:scale(1)}}@keyframes tvOn{0%{transform-origin:center;transform:scaleY(0.005) scaleX(1);filter:brightness(2) contrast(1.2)}35%{transform:scaleY(0.02) scaleX(1);filter:brightness(2.5)}65%{transform:scaleY(0.02) scaleX(0.02);filter:brightness(2.2) contrast(1.25)}100%{transform:scaleY(1) scaleX(1);filter:none}}@keyframes tvFlicker{0%{filter:brightness(1) contrast(1)}50%{filter:brightness(1.07) contrast(1.05)}100%{filter:brightness(1) contrast(1)}}@media(prefers-reduced-motion: reduce){.panel.panel-intro .tv-screen,.panel.panel-intro .intro-title,.panel.panel-intro .desc,.panel.panel-intro .intro-next{animation:none !important;transition:none !important;opacity:1 !important;transform:none !important}}
.panel{height:90vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.panel.panel-upload{position:relative}.panel.panel-upload .tit{position:absolute;top:10px;width:12vw;z-index:1}.panel.panel-upload .upload-box{width:95%;background-color:#3d3d3d;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:.25rem;padding:1rem;height:70vh;position:relative}.panel.panel-upload .upload-box .shortform-backward-btn{position:absolute;top:10px;left:10px;cursor:pointer}.panel.panel-upload .upload-box .re-upload{position:absolute;right:10px;top:10px;cursor:pointer}.panel.panel-upload .upload-box .placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem}.panel.panel-upload .upload-box .placeholder p{text-align:center;font-size:3rem;color:#c5c5c5}.panel.panel-upload .upload-box .placeholder p .white{color:var(--bs-white);animation:pulse 1.5s infinite}@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}.panel.panel-upload .upload-box .placeholder p .small{font-size:1.5rem}.panel.panel-upload .upload-box .preview{width:30%}.panel.panel-upload .upload-box .preview img{animation:fadeZoomIn .8s ease-out}@keyframes fadeZoomIn{0%{opacity:0;transform:scale(0.8)}100%{opacity:1;transform:scale(1)}}.panel.panel-upload .upload-box .desc{color:var(--bs-white);margin-top:1rem;font-size:2rem}.panel.panel-upload .upload{width:8vw;margin-top:1rem;cursor:pointer}.panel.panel-upload .upload:hover{filter:brightness(1.2) contrast(1.1);transform:scale(1.05);transition:all .2s ease}
.panel{height:90vh;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:"Tuho"}.panel.panel-filter{position:relative}.panel.panel-filter .tit{position:absolute;top:10px;width:30vw;z-index:1}.panel.panel-filter .filter-box{width:95%;background-color:#3d3d3d;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:.25rem;padding:4rem 1rem 1rem 1rem;height:73vh;position:relative}.panel.panel-filter .filter-box .shortform-backward-btn{position:absolute;top:10px;left:10px;cursor:pointer}.panel.panel-filter .filter-box .filter-box-desc{color:#f0cf4b;font-size:3rem;margin-bottom:1rem}.panel.panel-filter .filter-box .filter-list{width:70%;display:flex;align-items:center;justify-content:space-between}.panel.panel-filter .filter-box .filter-list li{width:30%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;cursor:pointer;transition-duration:.2s}.panel.panel-filter .filter-box .filter-list li p{font-size:2rem;color:var(--bs-white);font-family:"Tuho";margin-top:.5rem}.panel.panel-filter .filter-box .filter-list li:hover{transform:scale(1.1)}.panel.panel-filter .filter-box .filter-list li.is-selected .thumb{transform:scale(1.1);margin-bottom:1rem}.panel.panel-filter .filter-box .filter-list li.is-selected .label{color:#f0cf4b;font-size:2.5rem;font-family:"Tuho"}.panel.panel-filter .filter-box .directly-textarea{width:70%;font-family:"Tuho";margin-top:1rem;border:none;border-radius:.25rem;font-size:1.25rem;height:5.5vh}.panel.panel-filter .complete-btn{width:10vw;margin-top:1rem}
.panel.panel-complete{position:relative}.panel.panel-complete .tit{position:absolute;top:10px;width:14vw;z-index:1}.panel.panel-complete .filter-box{width:95%;background-color:#3d3d3d;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:.25rem;padding:1rem;height:73vh;position:relative}.panel.panel-complete .filter-box .home{position:absolute;left:10px;top:10px;cursor:pointer}.panel.panel-complete .filter-box .result-video{width:30vw}.panel.panel-complete .filter-box .senior-shortform-download-btn{position:absolute;right:10px;top:10px;cursor:pointer;width:10vw}.panel.panel-complete .shortform-complete-button{width:10vw;margin-top:1rem;cursor:pointer}
.senior-qr-overlay{width:100%;height:100vh;background-color:rgba(0,0,0,.8);position:fixed;top:0;left:0;z-index:90;display:flex;justify-content:center}.senior-qr-overlay .senior-qr-modal{width:90%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem}.senior-qr-overlay .senior-qr-modal .qr-actions{display:flex;justify-content:center;align-items:center;cursor:pointer;gap:1rem}.senior-qr-overlay .senior-qr-modal .qr-actions button{border:none;background:none;cursor:pointer}.senior-qr-overlay .senior-qr-modal .qr-close-btn{border:none;background:none;cursor:pointer;width:6vw}
.senior-loading-section{width:100%;height:100vh;background-color:#23242e;position:fixed;top:0;left:0;z-index:999 !important;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem}.senior-loading-section .borders{position:fixed}.senior-loading-section .borders.border-top-gray{top:0;left:0}.senior-loading-section .borders.border-bottom-navy{bottom:0;left:0}.senior-loading-section .borders.border-left-navy{position:fixed;top:0;left:0}.senior-loading-section .borders.border-right-navy{position:fixed;top:0;right:0}.senior-loading-section .senior-loading-question-container{width:95%;margin:0 auto;background-color:#212121;padding:2rem 1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.senior-loading-section .senior-loading-question-container .senior-loading-header{display:flex;justify-content:space-between;align-items:center;font-size:14px;width:100%;color:var(--bs-white)}.senior-loading-section .senior-loading-question-container .senior-loading-header .senior-loading-head-title{width:28vw}.senior-loading-section .senior-loading-question-container .progress-bar{margin:10px auto}.senior-loading-section .senior-loading-question-container .quiz-image-figure{width:45%;aspect-ratio:16/9;border-radius:12px;margin-top:12px;border-radius:.25rem;overflow:hidden}.senior-loading-section .senior-loading-question-container .loading-question-title{font-size:34px;font-weight:700;margin:1rem auto;color:var(--bs-white);font-family:"Maple"}.senior-loading-section .senior-loading-question-container .loading-option-list{display:flex;align-items:center;gap:1.5rem}.senior-loading-section .senior-loading-question-container .loading-option-list li .optionBtnBig{width:100%;display:flex;align-items:center;gap:10px;text-align:left;padding:14px 1rem;min-height:56px;border-radius:14px;border:1px solid #e5e7eb;background-color:var(--bs-white);cursor:pointer;font-size:1rem;line-height:1.2;transition:background-color .15s ease,border-color .15s ease}.senior-loading-section .senior-loading-question-container .loading-option-list li .optionBtnBig.is-correct{border-color:#16a34a;background:#ecfdf5}.senior-loading-section .senior-loading-question-container .loading-option-list li .optionBtnBig.is-wrong{border-color:#f59e0b;background:#fff7ed}.senior-loading-section .senior-loading-question-container .loading-option-list li .optionBtnBig .badge{width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background-color:#eef2ff;color:#3730a3;font-weight:700;flex:0 0 auto}.senior-loading-section .senior-loading-question-container .loading-option-list li .optionBtnBig .label{display:inline-block;white-space:normal}.senior-loading-section .senior-loading-question-container .bottomBar{display:flex;align-items:center;justify-content:space-between;margin-top:12px}.senior-loading-section .senior-loading-question-container .bottomBar .hint-btn{padding:0 12px;height:40px;border-radius:10px;background-color:#eef2ff;color:#3730a3;border:none;cursor:pointer}.senior-loading-section .senior-loading-question-container .feedback-area{margin-top:8px}.senior-loading-section .senior-loading-question-container .feedback-area span{font-weight:700}.senior-loading-section .senior-loading-question-container .feedback-area span.correct{color:#059669}.senior-loading-section .senior-loading-question-container .feedback-area span.wrong{color:#dc2626}.senior-loading-section .senior-loading-question-container .hint-text{color:var(--bs-white);margin-top:.5rem}.senior-loading-section .senior-loading-question-container .senior-loading-correct-btn{padding:0 1rem;border-radius:10px;background-color:#4f46e5;color:var(--bs-white);border:none;cursor:pointer;height:46px}.senior-loading-section .tv-navigation{width:40vw}
.senior-drawing{width:100%;height:100vh;background-color:#2e2e2e;display:flex;align-items:center;justify-content:center;background:url(/static/media/senior-drawing-bg.ecde4c9cec696cd78e0c.svg) no-repeat center/cover;position:relative;font-family:"Jaemin3"}.senior-drawing .top-deco{width:100%;height:50px;background-color:#42261a;border-bottom:14px solid #26150d;position:absolute;top:0;left:0}.senior-drawing .senior-drawing-signboard{position:absolute;left:50%;transform:translateX(-50%);top:0;width:24vw;z-index:1}.senior-drawing .wide-inner{width:100%;height:85vh;background:url(/static/media/senior-drawing-inner-bg.30cb02953ff4eccb62ad.svg) no-repeat center/cover;border:8px solid #42261a;border-radius:1rem}
.drawing-intro-container{text-align:center;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.drawing-intro-container .home{position:absolute;top:10px;left:10px;cursor:pointer}.drawing-intro-container .title{font-size:4rem;animation:shineIn 1.2s ease forwards}.drawing-intro-container .desc{font-size:2rem;line-height:1.6;margin:4rem auto;opacity:0;filter:blur(6px);animation:fadeClear 1.8s ease forwards;animation-delay:.4s}.drawing-intro-container .senior-drawing-start-btn{width:10vw;cursor:pointer;opacity:0;transform:translateY(20px);animation:fadeClear .8s ease-out forwards;animation-delay:1.2s}@keyframes shineIn{0%{opacity:0;transform:translateY(20px) scale(0.95)}100%{opacity:1;transform:translateY(0) scale(1)}}@keyframes fadeClear{0%{opacity:0;filter:blur(6px)}50%{opacity:.5;filter:blur(3px)}100%{opacity:1;filter:blur(0)}}
.senior-drawing-upload-container{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.senior-drawing-upload-container .nav-container{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:99%;display:flex;align-items:center;justify-content:space-between}.senior-drawing-upload-container .nav-container .nav-container-btn{width:7vw}.senior-drawing-upload-container .drawing-upload-box{display:flex;flex-direction:column;align-items:center;justify-content:center;height:70%;width:80%;margin:1.5rem auto 0;border:1px solid #a6a6a6;border-radius:24px}.senior-drawing-upload-container .drawing-upload-box .placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:2rem}.senior-drawing-upload-container .drawing-upload-box .preview{width:20vw}.senior-drawing-upload-container .drawing-upload-box .desc{text-align:center;font-size:1.6rem;margin-top:1rem}.senior-drawing-upload-container .upload{display:block;width:10vw;cursor:pointer;margin-top:2rem;background:none;border:none;margin:1rem auto}
.drawing-loading-bg{height:100%;background:url(/static/media/senior-drawing-loading-bg.5d8805d735863e419ffb.svg) no-repeat bottom/cover;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;position:relative}.drawing-loading-bg .drawing-loading-title{width:18vw}.drawing-loading-bg .laundry-container{position:relative}.drawing-loading-bg .laundry-container .senior-drawing-loading-laundry{width:18vw}.drawing-loading-bg .laundry-container .senior-drawing-bubble-1{position:absolute;top:0;right:-180px;width:10vw}.drawing-loading-bg .laundry-container .senior-drawing-bubble-2{position:absolute;top:0;left:-110px;width:8vw}
.base-result-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:2rem;position:relative}.base-result-container .drawing-backward-btn{position:absolute;top:10px;left:10px;cursor:pointer;width:6.5vw}.base-result-container .base-complete-text{font-size:2rem;margin-bottom:2rem}.base-result-container .result-border{border:2px solid #a6a6a6;position:relative;width:80%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:1rem;padding:1.25rem}.base-result-container .result-border .complete-ribbon{position:absolute;left:50%;top:-40px;transform:translateX(-50%);width:25vw}.base-result-container .result-border .senior-base-drawing-result{width:20vw}.base-result-container .drawing-next-btn{width:10vw;cursor:pointer}
.senior-drawing-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;position:relative}.senior-drawing-container .drawing-backward-btn{position:absolute;top:10px;left:10px;width:6.5vw;cursor:pointer;z-index:99}.senior-drawing-container .senior-drawing-desc{font-size:2rem;margin-bottom:2rem}.senior-drawing-container .drawing-filter-list{display:flex;align-items:center;justify-content:center}.senior-drawing-container .drawing-filter-list li button{border:none;background:none;cursor:pointer;font-family:"Jaemin3";transition-duration:.2s;position:relative}.senior-drawing-container .drawing-filter-list li button:hover{transform:scale(1.1)}.senior-drawing-container .drawing-filter-list li button .hanger{width:10vw;position:absolute;top:-4vw;left:50%;transform:translateX(-50%)}.senior-drawing-container .drawing-filter-list li button .label{font-size:1.5rem;margin-top:.5rem}.senior-drawing-container .drawing-filter-list li.is-selected button .thumb{transform:rotate(10deg)}.senior-drawing-container .drawing-filter-list li.is-selected button .hanger{width:10vw;position:absolute;top:-4vw;transform:rotate(10deg) translateX(-50%)}.senior-drawing-container .drawing-filter-list li.is-selected button .label{color:#cc2f1f;font-size:2rem}.senior-drawing-container .drawing-filter-actions{width:8vw;margin-top:2rem;cursor:pointer}
.senior-drawing-complete{width:100%;height:100%;background:url(/static/media/senior-drawing-complete.425fe76d8e916223d0d4.svg) no-repeat center/cover;position:relative;display:flex;align-items:center;justify-content:center}.senior-drawing-complete .home{position:absolute;top:10px;left:10px;cursor:pointer}.senior-drawing-complete .drawing-download-btn{position:absolute;top:10px;right:10px;cursor:pointer;width:10vw;background:none;border:none}.senior-drawing-complete .filter-result-container{position:relative;width:50%;margin:0 auto;display:flex;justify-content:center}.senior-drawing-complete .filter-result-container .drawing-complete-title{width:15vw;position:absolute;top:-50px}.senior-drawing-complete .filter-result-container .complete-sticker{position:absolute;top:0;right:60px}.senior-drawing-complete .filter-result-container .filter-result-image{width:30vw;aspect-ratio:5/5}.senior-drawing-complete .filter-result-container .complete-sticker-2{position:absolute;bottom:0;left:0}.senior-drawing-complete .complete-char{position:absolute;bottom:-1px}.senior-drawing-complete .complete-char.complete-girl{width:21vw;left:46px}.senior-drawing-complete .complete-char.complete-boy{width:14vw;right:324px}.senior-drawing-complete .complete-sparkle{position:absolute}.senior-drawing-complete .complete-sparkle.sparkle-1{left:20%;top:1vw;width:14vw}.senior-drawing-complete .complete-sparkle.sparkle-2{right:20%;top:1vw;width:14vw}
.senior-writing{width:100%;height:100vh;background:url(/static/media/senior-writing-bg.557abd1334d5d0857af9.svg) no-repeat center/cover;padding-top:30px;overflow:hidden;font-family:"KimjungchulScript"}.senior-writing .wide-inner{width:100%;position:relative;aspect-ratio:16/9;background:url(/static/media/senior-writing-inner-bg.4a4b4544fdc15b8b9473.svg) top/cover no-repeat;border-radius:1rem}.senior-writing .wide-inner.result{width:90%;background:url(/static/media/senior-reulst-inner-bg.fe6c33bd4a2d6eddd4ad.svg) top/cover no-repeat}
.writing-intro-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;height:90%;position:relative}.writing-intro-container .writing-intro-title,.writing-intro-container .writing-intro-desc,.writing-intro-container .intro-start-btn{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease;will-change:opacity,transform}.writing-intro-container .home-btn{position:absolute;top:60px;left:60px;cursor:pointer}.writing-intro-container .writing-intro-title{width:36vw;margin-bottom:2rem;transition-delay:.05s}.writing-intro-container .writing-intro-desc{font-size:2rem;color:#6b604f;line-height:1.4;text-align:center;font-weight:500;transition-delay:.25s}.writing-intro-container .writing-intro-desc .last-line{display:inline-block;white-space:nowrap;overflow:hidden;border-right:2px solid #6b604f;width:0;animation:typing 4s steps(40, end) forwards,blink .8s step-end infinite}@keyframes typing{from{width:0}to{width:100%}}@keyframes blink{50%{border-color:rgba(0,0,0,0)}}.writing-intro-container.ready .writing-intro-title,.writing-intro-container.ready .writing-intro-desc,.writing-intro-container.ready .intro-start-btn{opacity:1;transform:translateY(0)}.writing-intro-container.ready .writing-intro-desc .last-line{animation:typing 3.6s steps(42, end) forwards,caretBlink .9s step-end infinite;animation-delay:.85s}.writing-intro-container .intro-start-btn{width:12vw;margin-top:4rem;cursor:pointer;transition-delay:.55s}.writing-intro-container .senior-writing-intro-deco{position:absolute}.writing-intro-container .senior-writing-intro-deco.senior-writing-intro-pen{top:170px;left:-100px;width:24vw}.writing-intro-container .senior-writing-intro-deco.senior-writing-intro-post{bottom:50px;right:0}@keyframes typing{from{width:0}to{width:100%}}@keyframes caretBlink{50%{border-color:rgba(0,0,0,0)}}@media(prefers-reduced-motion: reduce){.writing-intro-container .writing-intro-title,.writing-intro-container .writing-intro-desc,.writing-intro-container .intro-start-btn{transition:none !important;opacity:1 !important;transform:none !important}.writing-intro-container .last-line{animation:none !important;width:auto !important;border-right:0 !important}}
.letter-que-container{padding-top:70px}.letter-que-container .fade-up{opacity:0;transform:translateY(10px);transition:opacity .35s ease,transform .35s ease;will-change:opacity,transform}.letter-que-container.is-show .fade-up{opacity:1;transform:translateY(0)}.letter-que-container.is-show .letter-question-title.fade-up{transition-delay:.02s}.letter-que-container.is-show .option-list.fade-up{transition-delay:.08s}.letter-que-container.is-show .question-actions.fade-up{transition-delay:.14s}.letter-que-container.is-show .progress-number.fade-up{transition-delay:.18s}.letter-que-container.is-show .option-list li{transition:opacity .3s ease,transform .3s ease;opacity:1;transform:translateY(0)}.letter-que-container .option-list li{opacity:0;transform:translateY(8px)}.letter-que-container.is-show .option-list li:nth-child(1){transition-delay:0.09s}.letter-que-container.is-show .option-list li:nth-child(2){transition-delay:0.12s}.letter-que-container.is-show .option-list li:nth-child(3){transition-delay:0.15s}.letter-que-container.is-show .option-list li:nth-child(4){transition-delay:0.18s}.letter-que-container.is-show .option-list li:nth-child(5){transition-delay:0.21s}.letter-que-container.is-show .option-list li:nth-child(6){transition-delay:0.24s}.letter-que-container.is-show .option-list li:nth-child(7){transition-delay:0.27s}.letter-que-container.is-show .option-list li:nth-child(8){transition-delay:0.3s}.letter-que-container.is-show .option-list li:nth-child(9){transition-delay:0.33s}.letter-que-container.is-show .option-list li:nth-child(10){transition-delay:0.36s}.letter-que-container.is-show .option-list li:nth-child(11){transition-delay:0.39s}.letter-que-container.is-show .option-list li:nth-child(12){transition-delay:0.42s}.letter-que-container button{border:none;background:none;font-family:"KimjungchulScript";cursor:pointer}.letter-que-container .senior-letter-notice{width:40vw;margin:0 auto}.letter-que-container .letter-question-title{width:50vw;margin:2rem auto 5rem}.letter-que-container .option-list{display:flex;flex-wrap:wrap;justify-content:center;gap:3rem}.letter-que-container .option-list li{flex-grow:1;flex-shrink:1;flex-basis:calc(30% - 1rem);max-width:calc(30% - 1rem);text-align:center}.letter-que-container .option-list li button{font-size:3rem;color:#553f20;font-weight:900}.letter-que-container .option-list li button span{position:relative}.letter-que-container .option-list li button span .complete-circle{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:130%}.letter-que-container .option-list .custom-input{width:100%;display:flex;justify-content:center}.letter-que-container .option-list .custom-input input{width:100%;flex:1 1;padding:.5rem;border:none;border-radius:.25rem;font-size:1rem;font-family:"KimjungchulScript";box-shadow:0 2px 4px 0 rgba(0,0,0,.15)}.letter-que-container .option-list .custom-input .error-text{margin-top:6px;font-size:14px;color:#e74c3c}.letter-que-container .question-actions{position:fixed;left:50%;bottom:70px;width:90%;transform:translateX(-50%);display:flex;align-items:center;justify-content:space-between}.letter-que-container .question-actions button{font-size:2rem;font-weight:900}.letter-que-container .question-actions button.btn-prev{color:#9d763e}.letter-que-container .question-actions button.btn-next{color:#553f20}.letter-que-container .progress-number{position:fixed;left:50%;bottom:70px;transform:translateX(-50%);font-size:1.2rem}
.letter-confirm-container{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.letter-confirm-container .fade-up{opacity:0;transform:translateY(10px);transition:opacity .35s ease,transform .35s ease}.letter-confirm-container.is-show .fade-up{opacity:1;transform:translateY(0)}.letter-confirm-container .senior-writing-confirm-pen{position:fixed;top:4dvw;left:-2vw;width:13vw}.letter-confirm-container .senior-writing-confirm-title{padding-top:35px;width:36vw;margin-bottom:1rem}.letter-confirm-container .btn-edit-all{position:absolute;top:40px;right:80px}.letter-confirm-container .btn-edit-all button{border:none;background:none;cursor:pointer}.letter-confirm-container .btn-edit-all .btn-edit{width:12vw}.letter-confirm-container .btn-edit-all .edit-all-actions{display:flex;align-items:center}.letter-confirm-container .btn-edit-all .edit-all-actions .btn-save{width:12vw}.letter-confirm-container .btn-edit-all .edit-all-actions .btn-cancel{font-family:"KimjungchulScript";font-weight:900;font-size:1.5rem}.letter-confirm-container .qa-list{width:90%;margin:2rem auto;display:flex;flex-direction:column;gap:4rem}.letter-confirm-container .qa-list li{display:flex;align-items:center;flex-direction:column;font-size:2rem;font-weight:900}.letter-confirm-container .qa-list li .user-answers{width:90%;display:flex;align-items:center}.letter-confirm-container .qa-list li .user-answers .question{width:65%;color:#9d763e}.letter-confirm-container .qa-list li .user-answers .answer{color:#553f20}.letter-confirm-container .qa-list li .user-answers .answer-input{width:60%;height:2vw;font-family:"KimjungchulScript";font-size:1.4rem;border:none;border-radius:4px;padding-left:.5rem;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25)}.letter-confirm-container .qa-list li .confirm-under-line{width:100%;margin-top:1rem}.letter-confirm-container .make-letter-btn{width:10vw;margin-top:2rem;cursor:pointer}.letter-confirm-container .confirm-actions{position:fixed;bottom:70px;left:100px}.letter-confirm-container .confirm-actions button{border:none;background:none;font-family:"KimjungchulScript";color:#9d763e;font-weight:900;font-size:1.8rem;cursor:pointer}
.loading-letter-container{width:80%;margin:0 auto;padding-top:35px;position:relative}.loading-letter-container .loading-text-container{width:100%;position:absolute;top:45%;left:50%;transform:translate(-50%, -50%);font-family:"KimjungchulScript";color:#5f4014;line-height:1.6;text-align:center;font-weight:900}.loading-letter-container .loading-text-container .loading-desc{width:100%;font-size:2.2rem;margin-bottom:2rem;white-space:pre-line}.loading-letter-container .loading-text-container .progress-bar{width:40%;background-color:#f3eddd}.loading-letter-container .loading-text-container .progress-bar .progress{background-color:#9c7d5e}.writing-postbox{width:30vw;position:fixed;bottom:0;left:50%;transform:translateX(-50%)}
.complete-nav{position:fixed;top:40px;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:space-between;width:88%}.complete-nav figure{cursor:pointer}.complete-nav .letter-action-buttons{display:flex;flex-direction:column;align-items:center;gap:.5rem}.complete-nav .letter-action-buttons button{border:none;background:none;cursor:pointer}.complete-nav .letter-action-buttons .save-letter-btn{width:11vw}.complete-nav .letter-action-buttons .btn-edit{width:12vw}.complete-nav .letter-action-buttons .edit-buttons{display:flex;flex-direction:column;align-items:center;gap:.5rem}.complete-nav .letter-action-buttons .edit-buttons .btn-save{width:12vw}.complete-nav .letter-action-buttons .edit-buttons .btn-cancel{font-family:"KimjungchulScript";color:#2b160f;font-size:1.25rem;font-weight:900;cursor:pointer}.senior-reulst-letter{position:fixed;bottom:-24vw;left:50%;transform:translateX(-50%);width:94.5%}.senior-writing-confirm-pen{position:fixed;width:20vw;left:-100px;top:10vw}.resultText{text-align:center;white-space:pre-line;position:fixed;top:40%;left:50%;transform:translate(-50%, -50%);font-size:2.1rem;line-height:1.6;color:#2b160f;max-height:65vh;overflow-y:scroll;padding:0 1.5rem;width:60%}.resultText::-webkit-scrollbar{width:10px}.resultText::-webkit-scrollbar-thumb{background:#9a866a;border-radius:10px}.resultText::-webkit-scrollbar-track{background:rgba(192,192,192,.1)}.resultText-input{width:67%;height:50vh;height:28vw;text-align:center;white-space:pre-line;position:fixed;top:45%;left:50%;transform:translate(-50%, -50%);font-size:2.1rem;line-height:1.6;color:#2b160f;font-family:"KimjungchulScript";border:none;box-shadow:0px 1.98px 3.959px 0px rgba(0,0,0,.25);border-radius:4px}.resultText-input::-webkit-scrollbar{width:10px}.resultText-input::-webkit-scrollbar-thumb{background:#9a866a;border-radius:10px}.resultText-input::-webkit-scrollbar-track{background:rgba(192,192,192,.1)}.senior-reulst-post{width:19vw;position:fixed;right:3vw;bottom:1vw}
.senior-music{width:100%;height:100vh;background-color:#2b160f;font-family:"JAEGEONSA"}.senior-music .wide-inner{width:100%;height:100vh;position:relative;background:url(/static/media/senior-music-inner-bg.f6341c3c463a8245434f.svg) center/contain no-repeat;display:flex;flex-direction:column;align-items:center;justify-content:center}.senior-music .wide-inner .music-signboard{width:20vw;position:fixed;left:50%;top:10px;z-index:9;transform:translateX(-50%)}
.music-intro-bg{width:95%;height:83%;margin:0 auto;background:url(/static/media/senior-music-intro-bg.cda5fef38d6dc929f751.svg) no-repeat center/cover;border-radius:36px;position:relative;overflow:hidden}.music-intro-bg .home{position:absolute;top:10px;left:10px;cursor:pointer;z-index:999}.music-intro-bg .light{position:absolute;top:10px}.music-intro-bg .light.light-left{left:0}.music-intro-bg .light.light-left img{animation:swingLeft 4s ease-in-out infinite alternate}.music-intro-bg .light.light-right{right:0}.music-intro-bg .light.light-right img{animation:swingRight 4s ease-in-out infinite alternate}.music-intro-bg .intro-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}.music-intro-bg .intro-container .intro-main-desc{font-size:4rem;color:#f6cf4c;opacity:0}.music-intro-bg .intro-container .intro-main-desc.pop-in{animation:popInKey 560ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;animation-delay:80ms}.music-intro-bg .intro-container .music-start-btn{width:10vw;margin:1rem auto;cursor:pointer;position:relative;z-index:99;transform:translateY(6px);opacity:0;animation:fadeUp 500ms cubic-bezier(0.2, 0.8, 0.2, 1) 380ms forwards}.music-intro-bg .intro-container .music-char{opacity:0;transform-origin:50% 60%}.music-intro-bg .intro-container .music-char.rotate-in{animation:rotateInKey 820ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;animation-delay:220ms}@keyframes swingLeft{0%{transform:rotate(-15deg);opacity:.6}50%{transform:rotate(5deg);opacity:1}100%{transform:rotate(-15deg);opacity:.6}}@keyframes swingRight{0%{transform:rotate(15deg);opacity:.6}50%{transform:rotate(-5deg);opacity:1}100%{transform:rotate(15deg);opacity:.6}}@keyframes popInKey{0%{opacity:0;transform:scale(0.8) translateY(8px)}60%{opacity:1;transform:scale(1.06) translateY(0)}100%{opacity:1;transform:scale(1)}}@keyframes rotateInKey{0%{opacity:0;transform:rotateY(-360deg) scale(0.6)}100%{opacity:1;transform:rotate(0deg) scale(1)}}@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.senior-genre-container{width:95%;height:83%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;--enter-dur: 500ms;--stagger: 80ms;--easing: cubic-bezier(0.2, 0.8, 0.2, 1);opacity:0;transform:translateY(-8px);animation:container-in var(--enter-dur) var(--easing) forwards}.senior-genre-container .music-stepback-btn{position:absolute;top:20px;left:20px;width:6vw;cursor:pointer}.senior-genre-container .genre-desc{text-align:center;color:var(--bs-white);font-size:2rem;margin-bottom:1rem;padding-top:50px;opacity:0;transform:translateY(-6px);animation:title-in 420ms var(--easing) 60ms forwards}.senior-genre-container .genre-list{display:flex;align-items:center;width:97%;gap:1.2rem}.senior-genre-container .genre-list li{width:24%;box-sizing:border-box;position:relative;isolation:isolate;transition:transform 220ms var(--easing),box-shadow 220ms var(--easing);opacity:0;transform:translateY(10px) scale(0.98);animation:item-in 420ms var(--easing) forwards}.senior-genre-container .genre-list li:nth-child(1){animation-delay:calc(120ms + 1*var(--stagger))}.senior-genre-container .genre-list li:nth-child(2){animation-delay:calc(120ms + 2*var(--stagger))}.senior-genre-container .genre-list li:nth-child(3){animation-delay:calc(120ms + 3*var(--stagger))}.senior-genre-container .genre-list li:nth-child(4){animation-delay:calc(120ms + 4*var(--stagger))}.senior-genre-container .genre-list li:nth-child(5){animation-delay:calc(120ms + 5*var(--stagger))}.senior-genre-container .genre-list li:nth-child(6){animation-delay:calc(120ms + 6*var(--stagger))}.senior-genre-container .genre-list li:nth-child(7){animation-delay:calc(120ms + 7*var(--stagger))}.senior-genre-container .genre-list li:nth-child(8){animation-delay:calc(120ms + 8*var(--stagger))}.senior-genre-container .genre-list li:nth-child(9){animation-delay:calc(120ms + 9*var(--stagger))}.senior-genre-container .genre-list li:nth-child(10){animation-delay:calc(120ms + 10*var(--stagger))}.senior-genre-container .genre-list li:nth-child(11){animation-delay:calc(120ms + 11*var(--stagger))}.senior-genre-container .genre-list li:nth-child(12){animation-delay:calc(120ms + 12*var(--stagger))}@keyframes item-in{to{opacity:1;transform:translateY(0) scale(1)}}.senior-genre-container .genre-list li .thumb img{display:block;width:100%;height:auto;transition:transform 220ms var(--easing),filter 220ms var(--easing)}.senior-genre-container .genre-list li:hover .thumb img{transform:translateY(-2px) scale(1.02)}.senior-genre-container .genre-list li button{border:none;background:none;cursor:pointer}.senior-genre-container .genre-list li.is-selected{z-index:1;border:6px solid #ff4d4d;border-radius:1rem;box-shadow:0 0 0 6px rgba(255,77,77,.15)}@keyframes selected-glow{0%{box-shadow:0 0 0 0 rgba(255,77,77,.25)}50%{box-shadow:0 0 0 10px rgba(255,77,77,.08)}100%{box-shadow:0 0 0 0 rgba(255,77,77,0)}}.senior-genre-container .actions{display:flex;justify-content:center}.senior-genre-container .actions .next-btn{border:none;background:none;cursor:pointer;width:10vw;margin-top:1rem;animation:float 3.2s ease-in-out infinite}@keyframes container-in{to{opacity:1;transform:translateY(0)}}@keyframes title-in{to{opacity:1;transform:translateY(0)}}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
.senior-lyric-container{width:95%;height:83%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;position:relative;opacity:0;transform:translateY(-8px);padding-top:1rem;animation:lyric-enter 800ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards}.senior-lyric-container .music-stepback-btn{position:absolute;top:20px;left:20px;width:6vw;cursor:pointer}.senior-lyric-container .lyric-desc{color:var(--bs-white);font-size:2rem;text-align:center}.senior-lyric-container .user-select-genre{color:var(--bs-white);font-size:1.5rem}.senior-lyric-container .user-select-genre span{color:#f6cf4c}.senior-lyric-container .senior-lyric-area{width:80%;background-color:#ebdfc7;color:#6d6d6d;border:none;border-radius:.5rem;height:50vh;font-size:2.5rem;padding:.5rem;font-family:"JAEGEONSA";transition-duration:.3s}.senior-lyric-container .senior-lyric-area:focus{transform:scale(1.01);box-shadow:0 0 0 4px rgba(255,234,180,.9),0 6px 18px rgba(0,0,0,.18)}.senior-lyric-container .senior-lyric-area.has-text{animation:area-pulse 900ms ease-out 1}.senior-lyric-container .make-lyric-button{width:10vw;transition:transform 180ms ease,filter 200ms ease;cursor:pointer;margin-top:1rem}.senior-lyric-container .make-lyric-button.is-enabled{animation:btn-pop 380ms cubic-bezier(0.2, 0.8, 0.2, 1) 60ms 1;cursor:pointer}.senior-lyric-container .make-lyric-button.is-enabled:hover{transform:translateY(-2px) scale(1.02)}.senior-lyric-container .make-lyric-button.is-enabled:active{transform:translateY(0) scale(0.99)}.senior-lyric-container .make-lyric-button.is-disabled{pointer-events:none;filter:grayscale(1) brightness(0.9);transform:none}@keyframes lyric-enter{to{opacity:1;transform:translateY(0)}}@keyframes area-pulse{0%{box-shadow:0 0 0 0 rgba(255,234,180,0)}40%{box-shadow:0 0 0 10px rgba(255,234,180,.25)}100%{box-shadow:0 0 0 0 rgba(255,234,180,0)}}@keyframes btn-pop{0%{transform:scale(0.98)}60%{transform:scale(1.03)}100%{transform:scale(1)}}
.senior-lyric-result{width:95%;height:83%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.senior-lyric-result .music-stepback-btn{position:absolute;top:20px;left:20px;width:6vw;cursor:pointer}.senior-lyric-result .lyric-result-title{text-align:center;color:var(--bs-white);font-size:2rem;line-height:1.4;margin-bottom:1rem}.senior-lyric-result .lyrics-box{width:95%;background-color:#ebdfc7;border-radius:.5rem;height:50vh;overflow-y:scroll;font-size:2rem;padding:.5rem;font-family:"Jaemin3";text-align:center;line-height:1.6;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.senior-lyric-result .lyrics-box .edit-toggle-btn{position:absolute;top:10px;right:10px;cursor:pointer;border:none;background:none}.senior-lyric-result .lyrics-box.editing .lyric-block{width:80%}.senior-lyric-result .lyrics-box.editing .lyric-block .lyric-edit-area{width:100%;font-family:"Jaemin3";font-size:1.5rem;border:none;background-color:#eceaea;text-align:center;line-height:1.4}.senior-lyric-result .make-music-btn{cursor:pointer;border:none;background:none;width:10vw;margin-top:1rem}
.music-loading-bg{width:95%;height:83%;margin:0 auto;background:url(/static/media/senior-music-intro-bg.cda5fef38d6dc929f751.svg) no-repeat center/cover;border-radius:36px;position:relative;overflow:hidden}.music-loading-bg .light{position:absolute;top:10px}.music-loading-bg .light.light-left{left:0}.music-loading-bg .light.light-right{right:0}.music-loading-bg .intro-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}.music-loading-bg .intro-container .intro-main-desc{font-size:4rem;color:#f6cf4c}.music-loading-bg .intro-container .progress-bar{width:40%}.music-loading-bg .intro-container .progress-bar .progress{background-color:#a45c1c;color:#f6cf4c}.music-loading-bg .intro-container .music-start-btn{width:10vw;margin:1rem auto;cursor:pointer;position:relative;z-index:99}.music-loading-bg .intro-container .music-loading-char{width:30vw}
.senior-music-result-container{display:flex;flex-direction:column;align-items:center;justify-content:center;width:95%;height:83%;background:url(/static/media/senior-music-result-bg-5.814eb4076ecd29526eaa.svg) no-repeat center/cover;opacity:0;transform:translateY(-14px);animation:page-in 900ms cubic-bezier(0.25, 1, 0.5, 1) forwards;border-radius:38px;position:relative}.senior-music-result-container .home{position:absolute;top:10px;left:10px;cursor:pointer}@keyframes page-in{to{opacity:1;transform:translateY(0)}}.senior-music-result-container .music-result-title{font-size:1.8rem;line-height:1.4;text-align:center;color:var(--bs-white);margin-bottom:2rem;opacity:0;transform:translateY(-8px);animation:title-in 720ms cubic-bezier(0.25, 1, 0.5, 1) 120ms forwards}@keyframes title-in{to{opacity:1;transform:translateY(0)}}.senior-music-result-container .senior-music-result-tit{color:var(--bs-white);font-size:1.6rem;text-align:center;line-height:1.4;margin-bottom:1rem}.senior-music-result-container .music-results{display:flex;align-items:center;justify-content:center;width:65%}.senior-music-result-container .music-results .music-result-card{width:45%;position:relative}.senior-music-result-container .music-results .music-result-card button{border:none;background:none;cursor:pointer;position:absolute;left:50%;top:46%;transform:translate(-50%, -50%)}.senior-music-result-container .music-results .music-result-card button.cover-btn{width:100%;border-radius:50%;overflow:hidden}.senior-music-result-container .music-results .music-result-card .title{text-align:center;font-size:1.5rem;color:var(--bs-white);margin-top:.5rem}.senior-music-result-container .music-focus{display:flex;align-items:stretch;justify-content:center;gap:1rem;width:65%;display:flex;align-items:center;justify-content:center;gap:1rem;opacity:0;transform:translateY(10px) scale(0.98);animation:focus-in 600ms cubic-bezier(0.25, 1, 0.5, 1) forwards}@keyframes focus-in{to{opacity:1;transform:translateY(0) scale(1)}}.senior-music-result-container .music-focus .left-pane{width:40%;animation:left-pop 680ms cubic-bezier(0.2, 0.8, 0.2, 1) 60ms both}@keyframes left-pop{0%{transform:scale(0.98)}60%{transform:scale(1.02)}100%{transform:scale(1)}}.senior-music-result-container .music-focus .left-pane .back-to-list{border:none;background:none;cursor:pointer;margin-bottom:.5rem;color:var(--bs-white);transition:transform 160ms ease;color:#f6cf4c}.senior-music-result-container .music-focus .left-pane .back-to-list:hover{transform:translateX(-2px)}.senior-music-result-container .music-focus .left-pane .back-to-list{font-family:"JAEGEONSA";font-size:1.5rem}.senior-music-result-container .music-focus .left-pane .cover.large{border-radius:50%;overflow:hidden;box-shadow:0 10px 28px rgba(0,0,0,.28)}.senior-music-result-container .music-focus .left-pane .cover.large img{display:block;width:100%;height:auto;animation:record-spin 12s linear infinite;animation-play-state:paused;transform-origin:50% 50%;will-change:transform;-webkit-backface-visibility:hidden;backface-visibility:hidden}.senior-music-result-container .music-focus .left-pane .cover.large.is-playing img{animation:record-spin 12s linear infinite;animation-play-state:running}.senior-music-result-container .music-focus .left-pane .title{color:var(--bs-white);text-align:center;margin:1rem auto;font-size:1.5rem}.senior-music-result-container .music-focus .left-pane audio{width:100%}.senior-music-result-container .music-focus .left-pane audio{width:100%}.senior-music-result-container .music-focus .left-pane .title{color:var(--bs-white);text-align:center}.senior-music-result-container .music-focus .left-pane .audio-ui{margin-top:.75rem;padding:.75rem 1rem;border-radius:1rem;background:linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.06));backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 10px 26px rgba(0,0,0,.25);border:1px solid hsla(0,0%,100%,.18);transition:transform 200ms ease,box-shadow 240ms ease}.senior-music-result-container .music-focus .left-pane .audio-ui:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(0,0,0,.28)}.senior-music-result-container .music-focus .left-pane .audio-ui:active{transform:translateY(0)}.senior-music-result-container .music-focus .left-pane .audio-ui audio{width:100%;display:block;outline:none;accent-color:#ff7a7a;filter:drop-shadow(0 2px 6px rgba(0, 0, 0, 0.16));border-radius:.75rem;accent-color:#fff}.senior-music-result-container .music-focus .left-pane .audio-ui audio::-webkit-media-controls-enclosure{border-radius:.75rem;background:rgba(20,20,20,.6);box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.06)}.senior-music-result-container .music-focus .left-pane .audio-ui audio::-webkit-media-controls-panel{background:rgba(0,0,0,0);filter:invert(1)}.senior-music-result-container .music-focus .left-pane .audio-ui audio::-webkit-media-controls-play-button{transform:scale(1.05);filter:drop-shadow(0 1px 4px rgba(0, 0, 0, 0.25))}.senior-music-result-container .music-focus .left-pane .audio-ui audio::-webkit-media-controls-timeline{background:linear-gradient(90deg, rgba(255, 122, 122, 0.35), rgba(255, 122, 122, 0.15));border-radius:999px;height:4px;margin:0 .6rem}.senior-music-result-container .music-focus .left-pane .audio-ui audio::-webkit-media-controls-current-time-display,.senior-music-result-container .music-focus .left-pane .audio-ui audio::-webkit-media-controls-time-remaining-display{text-shadow:0 1px 2px rgba(0,0,0,.4);font-weight:600}.senior-music-result-container .music-focus .left-pane .audio-ui audio::-webkit-media-controls-mute-button{transform:scale(1.05)}.senior-music-result-container .music-focus .left-pane .audio-ui audio::-webkit-media-controls-volume-slider{border-radius:999px;background:hsla(0,0%,100%,.12);filter:invert(1)}@supports not (-webkit-appearance: none){.senior-music-result-container .music-focus .left-pane .audio-ui audio{background:rgba(20,20,20,.6);padding:.5rem}}.senior-music-result-container .music-focus .right-pane{width:50%;border-radius:.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;line-height:1.6;font-size:1.25rem;position:relative}.senior-music-result-container .music-focus .right-pane .qr-btn{font-family:"JAEGEONSA";border:none;margin-top:2rem;padding:.8rem 1.5rem;cursor:pointer;font-size:1rem;background-color:#f6cf4c;border-radius:.5rem}.senior-music-result-container .music-focus .right-pane.lyrics-pane{flex:1 1;text-align:center}.senior-music-result-container .music-focus .right-pane.lyrics-pane .lyrics-title{color:var(--bs-white);font-size:1.5rem;border-bottom:1px solid hsla(0,0%,100%,.5);width:90%;padding-bottom:1rem}.senior-music-result-container .music-focus .right-pane.lyrics-pane .lyrics-box{margin-top:2rem}.senior-music-result-container .music-focus .right-pane.lyrics-pane .lyrics-box .lyric-block{line-height:1.6}.senior-music-result-container .music-focus .right-pane.lyrics-pane .lyrics-box .lyric-block p{font-size:1.7rem;color:#b5b5b5}.senior-music-result-container .music-focus .right-pane.lyrics-pane .lyrics-box .lyric-block p:not(.lyric-label){color:var(--bs-white)}@keyframes record-spin{to{transform:rotate(360deg)}}
.letter-card{position:relative}.letter-card .letter-contents-all{width:95%;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 auto}.letter-card .letter-contents-all .letter-contents{position:absolute;top:4vw;left:50%;transform:translateX(-50%);font-family:"KimjungchulScript";text-align:center;white-space:pre-line;width:90%;font-size:1.05rem;line-height:1.6;max-height:40vh;overflow-y:scroll;padding:0 1rem}.letter-card .letter-contents-all .letter-contents::-webkit-scrollbar{width:6px}.letter-card .letter-contents-all .letter-contents::-webkit-scrollbar-thumb{background:#9a866a;border-radius:10px}.letter-card .letter-contents-all .letter-contents::-webkit-scrollbar-track{background:rgba(192,192,192,.1)}.letter-card .letter-contents-all .letter-contents.is-editing{background-color:#e4e4e4}.letter-card .senior-download-letter{position:absolute;bottom:0}
.senior-download-section{font-family:"Maple";background-color:hsl(198,76%,68%);min-height:100vh;position:relative}.senior-download-section .inner{padding-top:1rem}.senior-download-section .inner .download-container .download-title{width:60%;margin:0 auto 1rem}.senior-download-section .inner .download-container .writing-toolbar{margin:1rem auto;width:95%}.senior-download-section .inner .download-container .writing-toolbar .contents-modify-btn{border:none;padding:.5rem 1rem;border-radius:4px;display:flex;justify-content:flex-end;margin-left:auto;cursor:pointer}.senior-download-section .inner .download-container .writing-toolbar .font-controls{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:1rem;font-size:14px}.senior-download-section .inner .download-container .writing-toolbar .font-controls .font-size{flex-shrink:0}.senior-download-section .inner .download-container .writing-toolbar .font-controls input[type=range]{width:180px;border:none}.senior-download-section .inner .download-container .writing-toolbar .font-controls button{width:32px;height:32px;border-radius:8px;border:1px solid #eee;background:#fff;cursor:pointer}.senior-download-section .inner .download-container .how-to-text{font-size:1.2rem;font-weight:bold;text-align:center}.senior-download-section .inner .download-container .how-to{width:93%;position:fixed;bottom:10px;left:50%;transform:translateX(-50%);margin:.8rem auto}.senior-download-section .inner .download-container .download-actions{display:flex;justify-content:center;margin:2rem auto}.senior-download-section .inner .download-container .download-actions button{border:none;background:none;cursor:pointer}.senior-download-section .inner .download-container .music-cover{width:70%;margin:0 auto 1rem}.senior-download-section .inner .download-container .music-controller{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-bottom:1rem}.senior-download-section .inner .download-container .music-controller input[type=range]{width:70%;-webkit-appearance:none;appearance:none;height:6px;border-radius:3px;background:linear-gradient(to right, #f36 0%, #eee 0%);outline:none}.senior-download-section .inner .download-container .music-controller input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:#f36;border-radius:50%;cursor:pointer;box-shadow:0 0 2px #888}.senior-download-section .inner .download-container .writing-actions{margin-top:1rem;display:flex;justify-content:center}.senior-download-section .inner .download-container .writing-actions button{background:none;border:none;cursor:pointer}.senior-download-section .inner .download-video{width:100%;margin:1rem auto}.senior-download-section .inner .playstate-btn{border:none;background:none;width:100px}.senior-download-section .inner .download-text{position:relative;z-index:999;cursor:pointer;width:80%;margin:0 auto}.senior-download-section .inner .download-text details{padding:8px;border-radius:12px;background-color:#fff7ed;font-family:"Maple";box-shadow:0 2px 8px rgba(0,0,0,.05);text-align:center}.senior-download-section .inner .download-text details summary{padding:8px;border-radius:12px;background-color:#fff7ed;font-family:"Maple";box-shadow:0 2px 8px rgba(0,0,0,.05);text-align:center}.senior-download-section .inner .download-text details figure img{width:100%;height:auto;display:block}.senior-download-section .bg-sand-m{position:fixed;bottom:0;width:100%}
.prompt-edu-intro{width:100%;height:100vh;background-color:#efefff;position:relative;overflow:hidden}.prompt-edu-intro.is-animate .octopus-bubble-1{animation-delay:0s,.6s}.prompt-edu-intro.is-animate .octopus-bubble-2{animation-delay:.35s,.95s}.prompt-edu-intro.is-animate .octopus-bubble-3{animation-delay:.7s,1.3s}.prompt-edu-intro.is-animate .octopus-bubble{animation-name:bubble-in,bubble-float;animation-duration:.6s,4.5s;animation-timing-function:ease-out,ease-in-out;animation-fill-mode:forwards,both;animation-iteration-count:1,infinite}.prompt-edu-intro.is-animate .wide-inner .prompt_edu_intro_title{animation:title-drop .9s cubic-bezier(0.25, 0.85, 0.2, 1.2) .1s forwards}.prompt-edu-intro.is-animate .wide-inner .prompt_edu_intro_title::before{animation:title-shadow .9s ease-out .1s forwards}.prompt-edu-intro.is-animate .wide-inner .prompt_edu_intro_title::after{animation:impact-ring .38s ease-out .88s forwards}.prompt-edu-intro.is-animate .wide-inner{animation:scene-shake 120ms ease-in .86s 1}.prompt-edu-intro .go-back{position:absolute;top:10px;left:10px;width:4vw;z-index:1;cursor:pointer}.prompt-edu-intro .edu_intro_sea{width:100%;position:fixed;left:0;bottom:0}.prompt-edu-intro .edu_intro_sea .blue-sea{height:35vh;background-color:#5576dc}.prompt-edu-intro .wide-inner{height:100vh;position:relative}.prompt-edu-intro .wide-inner .prompt_edu_intro_title{width:57vw;position:absolute;top:-20px;left:50%;transform:translateX(-50%);position:absolute;top:-20px;left:50%;transform:translateX(-50%) translateY(-160px) rotate(-3deg) scale(1.02);opacity:0;will-change:transform,opacity;z-index:5}.prompt-edu-intro .wide-inner .prompt_edu_intro_title::before,.prompt-edu-intro .wide-inner .prompt_edu_intro_title::after{content:"";position:absolute;left:50%;transform:translateX(-50%);pointer-events:none}.prompt-edu-intro .wide-inner .prompt_edu_intro_title::before{bottom:-10px;width:34vw;height:10px;border-radius:50%;background:rgba(0,0,0,.12);filter:blur(2px);opacity:0}.prompt-edu-intro .wide-inner .prompt_edu_intro_title::after{bottom:-12px;width:0;height:2px;background:rgba(0,0,0,.12);border-radius:2px;opacity:0}.prompt-edu-intro .prompt_edu_intro_octopus{position:fixed;bottom:50px;left:50%;transform:translateX(-50%);width:46vw}.prompt-edu-intro .octopus-bubble{position:absolute;z-index:9;opacity:0;transform:translateY(10px) scale(0.98);filter:drop-shadow(0 6px 10px rgba(0, 0, 0, 0.08))}.prompt-edu-intro .octopus-bubble.is-visible{animation:bubble-in .6s ease-out forwards,bubble-float 4.5s ease-in-out .6s infinite}.prompt-edu-intro .octopus-bubble.octopus-bubble-1{top:13vh;width:30vw}.prompt-edu-intro .octopus-bubble.octopus-bubble-2{top:17vh;right:0;width:30vw}.prompt-edu-intro .octopus-bubble.octopus-bubble-3{bottom:26vh;left:0;width:34vw}.prompt-edu-intro .octopus-bubble.octopus-bubble-1{top:13vh;width:30vw}.prompt-edu-intro .octopus-bubble.octopus-bubble-2{top:17vh;right:0;width:30vw}.prompt-edu-intro .octopus-bubble.octopus-bubble-3{bottom:26vh;left:0vw;width:34vw}.prompt-edu-intro .deco{position:absolute;animation:float-sway 6s ease-in-out infinite;will-change:transform}.prompt-edu-intro .deco.prompt_edu_intro_jewel{bottom:10vh;left:0;width:8vw;animation-duration:7s;animation-delay:0s}.prompt-edu-intro .deco.prompt_edu_intro_compass{bottom:5vh;left:15vw;width:10vw;animation-duration:6.5s;animation-delay:1s}.prompt-edu-intro .deco.prompt_edu_intro_flag{bottom:3vh;right:18vw;width:14vw;animation-duration:8s;animation-delay:.5s}.prompt-edu-intro .deco.prompt_edu_intro_map{bottom:16vh;right:10vw;width:10vw;animation-duration:7.5s;animation-delay:1.2s}.prompt-edu-intro .deco.prompt_edu_intro_key{bottom:6vh;right:0;width:8vw;animation-duration:6s;animation-delay:.8s}.prompt-edu-intro .prompt_edu_intro_island{position:absolute;right:-6vw;bottom:30vh;width:14vw}.prompt-edu-intro .prompt_edu_intro_btn{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);cursor:pointer;width:18vw;z-index:99}@keyframes bubble-in{from{opacity:0;transform:translateY(16px) scale(0.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes bubble-float{0%{transform:translateY(0) scale(1)}50%{transform:translateY(-6px) scale(1.005)}100%{transform:translateY(0) scale(1)}}@media(prefers-reduced-motion: reduce){.prompt-edu-intro .octopus-bubble{animation:none !important;opacity:1;transform:none}}@keyframes bubble-bounce-in{0%{opacity:0;transform:scale(0.5) translateY(30px)}60%{opacity:1;transform:scale(1.15) translateY(-8px)}80%{transform:scale(0.95) translateY(4px)}100%{transform:scale(1) translateY(0)}}@keyframes bubble-bounce-loop{0%,100%{transform:translateY(0) scale(1)}30%{transform:translateY(-12px) scale(1.08)}60%{transform:translateY(4px) scale(0.96)}}@keyframes float-sway{0%{transform:translateY(0) rotate(0deg)}25%{transform:translateY(-4px) rotate(-1deg)}50%{transform:translateY(2px) rotate(1deg)}75%{transform:translateY(-3px) rotate(0.5deg)}100%{transform:translateY(0) rotate(0deg)}}@keyframes title-drop{0%{opacity:0;transform:translateX(-50%) translateY(-160px) rotate(-3deg) scale(1.02)}70%{opacity:1;transform:translateX(-50%) translateY(0) rotate(0deg) scale(1.01)}85%{opacity:1;transform:translateX(-50%) translateY(8px) scale(0.98, 1.03)}100%{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}}@keyframes title-shadow{0%{opacity:0;transform:translateX(-50%) scaleX(0.6)}70%{opacity:1;transform:translateX(-50%) scaleX(0.9)}85%{opacity:1;transform:translateX(-50%) scaleX(1.15)}100%{opacity:1;transform:translateX(-50%) scaleX(0.95)}}@keyframes impact-ring{0%{opacity:0;width:0;transform:translateX(-50%) scaleX(1)}20%{opacity:1;width:10vw}100%{opacity:0;width:34vw;transform:translateX(-50%) scaleX(1)}}@keyframes scene-shake{0%{transform:translateY(0)}25%{transform:translateY(1.2px)}50%{transform:translateY(-1px)}75%{transform:translateY(0.6px)}100%{transform:translateY(0)}}
.prompt-edu-guide{width:100%;height:100vh;background-color:#e4d6c9;position:relative;overflow:hidden}.prompt-edu-guide .wide-inner{height:100vh;position:relative}.prompt-edu-guide .navigations{display:flex;align-items:center;justify-content:space-between;width:100%;position:absolute;top:20px;left:0;z-index:90;cursor:pointer}.prompt-edu-guide .navigations .home-btn{width:4vw}.prompt-edu-guide .navigations .go-hub-btn{width:9vw}.prompt-edu-guide .edu-guide-title{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.prompt-edu-guide .edu-guide-title .edu-guide-title-img{width:20vw;position:absolute;top:10px}.prompt-edu-guide .edu-guide-title .edu-guide-title-text{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem;position:relative;z-index:1;padding-top:10px}.prompt-edu-guide .edu-guide-title .edu-guide-title-text .subject{width:8vw}.prompt-edu-guide .edu-guide-title .edu-guide-title-text .subject-text{color:var(--bs-white);font-size:2rem;font-weight:900}.prompt-edu-guide .edu-guide-container{width:80%;height:90%;margin:0 auto;position:relative}.prompt-edu-guide .edu-guide-container .guide-paper{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:100%}.prompt-edu-guide .edu-guide-container .guide-text{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);text-align:center;color:#7c4134;white-space:pre-line;line-height:1.6;font-size:1.8rem;width:90%;font-weight:900}.prompt-edu-guide .edu-guide-container .guide-text p:not(:last-child){margin-bottom:1.4rem}.prompt-edu-guide .edu-guide-container .guide-text p.character-dialogue{font-weight:900;color:#b71c1c;font-size:2.3rem}.prompt-edu-guide .guide-next-btn{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);width:9vw;cursor:pointer;z-index:90;transition-duration:.3s}.prompt-edu-guide .guide-next-btn:hover{scale:1.1}.prompt-edu-guide .pirate{position:fixed;bottom:-100px;width:20vw}.prompt-edu-guide .pirate.pirate-nikki{left:0}.prompt-edu-guide .pirate.pirate-arial{right:0}.prompt-edu-guide figure img{display:block;max-width:100%;height:auto}.prompt-edu-guide.is-animate .navigations{animation:fade-in 400ms ease-out both 50ms}.prompt-edu-guide.is-animate .edu-guide-title-img{animation:drop-in 600ms cubic-bezier(0.2, 0.8, 0.2, 1) both 120ms}.prompt-edu-guide.is-animate .edu-guide-title-text{animation:fade-up 500ms ease-out both 240ms}.prompt-edu-guide.is-animate .edu-guide-container .guide-paper{animation:paper-unfold 800ms ease-out both 200ms}.prompt-edu-guide.is-animate .edu-guide-container .guide-text p{opacity:0;transform:translateY(8px)}.prompt-edu-guide.is-animate .edu-guide-container .guide-text p:nth-child(1){animation:fade-up 420ms ease-out both calc(300ms + 90ms)}.prompt-edu-guide.is-animate .edu-guide-container .guide-text p:nth-child(2){animation:fade-up 420ms ease-out both calc(300ms + 180ms)}.prompt-edu-guide.is-animate .edu-guide-container .guide-text p:nth-child(3){animation:fade-up 420ms ease-out both calc(300ms + 270ms)}.prompt-edu-guide.is-animate .edu-guide-container .guide-text p:nth-child(4){animation:fade-up 420ms ease-out both calc(300ms + 360ms)}.prompt-edu-guide.is-animate .edu-guide-container .guide-text p:nth-child(5){animation:fade-up 420ms ease-out both calc(300ms + 450ms)}.prompt-edu-guide.is-animate .edu-guide-container .guide-text p:nth-child(6){animation:fade-up 420ms ease-out both calc(300ms + 540ms)}.prompt-edu-guide.is-animate .edu-guide-container .guide-text p:nth-child(7){animation:fade-up 420ms ease-out both calc(300ms + 630ms)}.prompt-edu-guide.is-animate .edu-guide-container .guide-text p:nth-child(8){animation:fade-up 420ms ease-out both calc(300ms + 720ms)}.prompt-edu-guide.is-animate .guide-next-btn{animation:pop-pulse 900ms ease-out 600ms backwards,breathing 3.4s ease-in-out 1.2s infinite}.prompt-edu-guide.is-animate .pirate{animation:float-sway 7s ease-in-out infinite 300ms}@keyframes fade-in{from{opacity:0}to{opacity:1}}@keyframes fade-up{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes drop-in{0%{opacity:0;transform:translateY(-20px) scale(0.98)}60%{opacity:1;transform:translateY(2px) scale(1.02)}100%{opacity:1;transform:translateY(0) scale(1)}}@keyframes paper-unfold{0%{opacity:0;transform:translate(-50%, -50%) rotate(-6deg) scale(0.92);filter:drop-shadow(0 0 0 rgba(0, 0, 0, 0))}55%{opacity:1;transform:translate(-50%, -50%) rotate(2deg) scale(1.02);filter:drop-shadow(0 10px 18px rgba(0, 0, 0, 0.1))}100%{opacity:1;transform:translate(-50%, -50%) rotate(0) scale(1);filter:drop-shadow(0 6px 12px rgba(0, 0, 0, 0.08))}}@keyframes float-sway{0%{transform:translateY(0) rotate(0)}25%{transform:translateY(-4px) rotate(-1deg)}50%{transform:translateY(2px) rotate(1deg)}75%{transform:translateY(-3px) rotate(0.5deg)}100%{transform:translateY(0) rotate(0)}}@keyframes pop-pulse{0%{transform:translateX(-50%) scale(0.85);opacity:0}60%{transform:translateX(-50%) scale(1.06);opacity:1}100%{transform:translateX(-50%) scale(1);opacity:1}}@keyframes breathing{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.03)}}@media(prefers-reduced-motion: reduce){.prompt-edu-guide.is-animate,.prompt-edu-guide .pirate,.prompt-edu-guide .guide-next-btn,.prompt-edu-guide .guide-paper,.prompt-edu-guide .edu-guide-title-img,.prompt-edu-guide .edu-guide-title-text,.prompt-edu-guide .guide-text p,.prompt-edu-guide .navigations{animation:none !important}}@media screen and (max-width: 1525px){.prompt-edu-guide .edu-guide-container{width:95%}}@media screen and (max-width: 1440px){.prompt-edu-guide .navigations .home-btn{width:5.5vw}.prompt-edu-guide .navigations .go-hub-btn{width:12vw}.prompt-edu-guide .edu-guide-title .edu-guide-title-img{width:24vw;z-index:9}.prompt-edu-guide .edu-guide-title .edu-guide-title-text{z-index:10}.prompt-edu-guide .edu-guide-container .guide-text{top:46%;font-size:1.7rem}}@media screen and (max-width: 1240px){.prompt-edu-guide .edu-guide-title .edu-guide-title-img{width:25vw}.prompt-edu-guide .edu-guide-container .guide-text{font-size:1.75rem}}@media screen and (max-width: 1040px){.prompt-edu-guide .edu-guide-container .guide-text{font-size:1.25rem}}
.prompt-edu-preview{width:100%;min-height:100vh;background-color:#e4d6c9;position:relative;overflow-x:hidden}.prompt-edu-preview .right-top-leaf{position:absolute;top:0;right:0;width:20vw;transform-origin:top right;animation:leaf-sway 5.5s ease-in-out infinite}.prompt-edu-preview .prev-page-btn{position:absolute;top:20px;left:20px;width:9vw;z-index:9;cursor:pointer}.prompt-edu-preview .wide-inner{padding-top:20px}.prompt-edu-preview .cloud-container{width:100%;display:flex;align-items:center;justify-content:space-between}.prompt-edu-preview .cloud-container .cloud{width:25%}.prompt-edu-preview .prev-octopus{position:absolute;left:-30px;bottom:30vh;width:20vw;z-index:1}.prompt-edu-preview .prev-octopus .prompt_edu_intro_octopus{transform:scaleX(-1)}.prompt-edu-preview .prompt_edu_intro_island{position:absolute;right:-1vw;bottom:35vh;width:10vw;z-index:9}.prompt-edu-preview .sea{width:100%;background-color:#1ab2d6;height:40vh;position:relative;z-index:0;overflow:hidden}.prompt-edu-preview .sea::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 0% 50%, rgba(255, 255, 255, 0.12), transparent 60%),radial-gradient(120% 80% at 100% 50%, rgba(255, 255, 255, 0.1), transparent 60%);mix-blend-mode:screen;animation:sea-glint 6.5s ease-in-out infinite}.prompt-edu-preview .jewel-box{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);z-index:1;width:45vw}.prompt-edu-preview .sand{position:absolute;bottom:0;z-index:0;width:100%}.prompt-edu-preview .sand-left-leaf{position:absolute;bottom:-1px;left:0;z-index:5;width:18vw}.prompt-edu-preview .make-prompt-btn{border:none;background:none;cursor:pointer;position:absolute;bottom:-1px;right:0;width:18vw;z-index:3;animation:make-breathe 2.6s ease-in-out infinite;filter:drop-shadow(0 6px 18px rgba(0, 0, 0, 0.25))}.prompt-edu-preview .wide-inner{min-height:100vh;width:100%;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);z-index:2;display:flex;flex-direction:column;align-items:center}.prompt-edu-preview .wide-inner .octopus-drawing-title{margin-bottom:1rem;width:16vw;animation:fadeInDown .8s ease-out}.prompt-edu-preview .wide-inner .examle-image{width:35%;border:12px solid #7c4134;border-radius:1rem;overflow:hidden;transform:scale(0.5);opacity:0;animation:popIn .8s ease-out both;animation-delay:.2s}@keyframes popIn{0%{transform:scale(0.3);opacity:0}50%{transform:scale(1.2);opacity:1}70%{transform:scale(0.9)}100%{transform:scale(1);opacity:1}}@keyframes zoomIn{from{transform:scale(0.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes fadeInDown{from{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-10px)}100%{transform:translateY(0)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}100%{transform:scale(1)}}@keyframes leaf-sway{0%,100%{transform:rotate(0deg)}40%{transform:rotate(2.2deg)}60%{transform:rotate(-1.2deg)}}@keyframes sea-glint{0%,100%{transform:translateY(0);opacity:.6}50%{transform:translateY(-6px);opacity:.85}}@keyframes make-breathe{0%{transform:translateY(0) scale(1)}20%{transform:translateY(-8px) scale(1.05)}40%{transform:translateY(0) scale(0.98)}60%{transform:translateY(-4px) scale(1.02)}100%{transform:translateY(0) scale(1)}}@media screen and (max-width: 1440px){.prompt-edu-preview .prev-page-btn{width:12vw}}
.prompt-edu-level-select{width:100%;height:100vh;background:url(/static/media/level-select-bg.52b67045937bdbc392ed.svg) no-repeat bottom/cover;position:relative;overflow:hidden}.prompt-edu-level-select .seagull{position:absolute;z-index:9;animation:seagull-float 5.5s ease-in-out infinite;will-change:transform}.prompt-edu-level-select .seagull.seagull-left{left:10px;top:10vw;width:8vw}.prompt-edu-level-select .seagull.seagull-right{right:0;top:100px;width:8vw;animation-delay:.9s}.prompt-edu-level-select .level-cloud{position:absolute;animation:cloud-drift 26s linear infinite;opacity:.9}.prompt-edu-level-select .level-cloud.level-cloud-left{left:-100px;top:100px;animation-duration:30s}.prompt-edu-level-select .level-cloud.level-cloud-right{right:-100px;top:100px;animation-duration:22s}.prompt-edu-level-select .wide-inner .navigations{display:flex;align-items:center;justify-content:space-between;width:95%;position:absolute;top:20px;left:50%;transform:translateX(-50%);z-index:90;cursor:pointer}.prompt-edu-level-select .wide-inner .navigations .home-btn{width:4vw}.prompt-edu-level-select .wide-inner .navigations .go-hub-btn{width:9vw}.prompt-edu-level-select .wide-inner .level-select-title{width:34vw;margin:0 auto;transform-origin:center bottom;animation:title-pop-in .7s cubic-bezier(0.2, 0.9, 0.2, 1.2) .15s both}.prompt-edu-level-select .wide-inner .level-grid{width:100%;display:flex;align-items:center;justify-content:center;margin-top:3rem;gap:1rem}.prompt-edu-level-select .wide-inner .level-grid .level-chip{border:none;background:none;cursor:pointer;width:25%;opacity:1;transform:none;transition:transform .25s ease,filter .25s ease}.prompt-edu-level-select .wide-inner .level-grid .level-chip:hover{transform:translateY(-6px) rotate(-1deg) scale(1.03)}.prompt-edu-level-select .wide-inner .level-grid .level-chip:active{transform:translateY(0) scale(0.96);filter:saturate(1.1)}.prompt-edu-level-select .wide-inner .level-grid .level-chip .level-icon{display:block;width:100%;height:auto;opacity:0;transform:translateY(14px) scale(0.98);animation:chip-in .5s ease-out forwards;transition:transform .25s ease}.prompt-edu-level-select .wide-inner .level-grid .level-chip:hover .level-icon{transform:translateY(0) scale(1.06)}.prompt-edu-level-select .wide-inner .level-grid .level-chip:nth-child(1) .level-icon{animation-delay:.05s}.prompt-edu-level-select .wide-inner .level-grid .level-chip:nth-child(2) .level-icon{animation-delay:.15s}.prompt-edu-level-select .wide-inner .level-grid .level-chip:nth-child(3) .level-icon{animation-delay:.25s}.prompt-edu-level-select .wide-inner .level-grid .level-chip:nth-child(4) .level-icon{animation-delay:.35s}.prompt-edu-level-select .wide-inner .level-grid .level-chip:nth-child(5) .level-icon{animation-delay:.45s}@keyframes seagull-float{0%{transform:translateY(0) rotate(0deg)}30%{transform:translateY(-6px) rotate(-1deg)}60%{transform:translateY(3px) rotate(1deg)}100%{transform:translateY(0) rotate(0deg)}}@keyframes cloud-drift{0%{transform:translateX(0)}50%{transform:translateX(18px)}100%{transform:translateX(0)}}@keyframes title-pop-in{0%{opacity:0;transform:translateY(-24px) scale(0.96)}70%{opacity:1;transform:translateY(0) scale(1.02)}100%{transform:translateY(0) scale(1)}}@keyframes chip-in{0%{opacity:0;transform:translateY(14px) scale(0.98)}100%{opacity:1;transform:translateY(0) scale(1)}}
.prompt-edu-play{width:100%;min-height:100vh;background-color:#e4d6c9;position:relative;overflow-x:hidden;padding-top:20px}.prompt-edu-play .prev-page-btn{position:absolute;top:20px;left:20px;width:9vw;z-index:9;cursor:pointer}.prompt-edu-play .wide-inner{position:relative}.prompt-edu-play .wide-inner .play-title{width:24vw;margin:0 auto .6rem}.prompt-edu-play .wide-inner .scenario-title-container{position:relative}.prompt-edu-play .wide-inner .scenario-title-container .play-ground-title{width:16vw;margin:0 auto}.prompt-edu-play .wide-inner .scenario-title-container .scenario_title{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);color:#7c4134;font-size:1.5rem;font-weight:900}.prompt-edu-play .wide-inner .play-desc{margin:2rem auto 1rem;text-align:center;font-size:1.6rem;color:#7c4134;font-weight:900}.prompt-edu-play .wide-inner .play-desc span{display:inline-block;margin-top:.8rem;font-weight:900;color:#b71c1c}.prompt-edu-play .wide-inner .example-toggle-btn{border:none;background:none;width:100%;margin-left:auto;display:flex;justify-content:flex-end;margin-bottom:1rem}.prompt-edu-play .wide-inner .example-toggle-btn img{width:10vw;cursor:pointer}.prompt-edu-play .wide-inner .edu-play-container{padding-bottom:15rem;width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem}.prompt-edu-play .wide-inner .edu-play-container .example-panel{opacity:0;transform:translateY(6px);transition:opacity .45s ease,transform .55s cubic-bezier(0.22, 1, 0.36, 1)}.prompt-edu-play .wide-inner .edu-play-container .example-panel.visible{opacity:1;transform:translateY(0)}.prompt-edu-play .wide-inner .edu-play-container .example-panel .example-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.prompt-edu-play .wide-inner .edu-play-container .example-panel .example-header h4{font-size:1.25rem;color:#7c4134}.prompt-edu-play .wide-inner .edu-play-container .example-panel .example-header .example-close-btn{width:40px;height:40px;border:none;background-color:#a9724a;cursor:pointer;color:var(--bs-white);border-radius:50%;font-size:1.2rem}.prompt-edu-play .wide-inner .edu-play-container .example-panel .example-figure{border:8px solid #7c4134;border-radius:1rem}.prompt-edu-play .wide-inner .edu-play-container .example-panel .example-figure img{border-radius:.5rem}.prompt-edu-play .wide-inner .edu-play-container .team-panel{position:relative;width:49%}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list{position:absolute;top:0;left:0;width:100%;height:100%;max-height:98%;overflow-y:scroll;padding:3rem;overflow-y:auto;scroll-behavior:smooth}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list::-webkit-scrollbar{width:10px}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list::-webkit-scrollbar-thumb{background:#cdb492;border-radius:10px}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list::-webkit-scrollbar-track{background:rgba(192,192,192,.1)}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .team-info{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .team-info .team-name{padding:1rem;background-color:var(--bs-white);display:inline-flex;border-radius:.5rem;border:2px solid #a9724a;color:#7c4134;font-weight:900;font-size:1.25rem}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .team-info .total-questions{color:#7c4134;font-weight:900;font-size:1.25rem}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card{padding:1rem;background-color:#fff7df;border-radius:.5rem;position:relative}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .tick-badge{position:absolute;top:10px;left:10px;width:26px;height:26px;border-radius:50%;background:#18a957;box-shadow:0 2px 6px rgba(0,0,0,.12);overflow:hidden;pointer-events:none;animation:tickPop 320ms ease-out;display:flex;align-items:center;justify-content:center}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .tick-badge::before{content:"";width:6px;height:12px;border-right:3px solid #fff;border-bottom:3px solid #fff;transform:rotate(45deg)}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card:not(:last-child){margin-bottom:2rem}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card.animate-in{animation:fadeUpIn .4s ease-out both;animation-delay:0ms;animation-delay:var(--delay, 0ms);will-change:transform,opacity}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .question{width:100%;display:flex;align-items:flex-start;justify-content:space-between}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .question .q-left strong{font-size:1rem}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .question .q-left p{color:#6b6b6b;font-weight:900;font-size:1.3rem;margin:.8rem 0}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .question .hint-inline{margin-top:8px;padding:10px 12px;border-radius:10px;background:#fff8d3;border:1px solid #f3d36b;font-size:16px;line-height:1.4;margin-bottom:.8rem}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .question .hint-inline strong{display:block;margin-bottom:4px;text-align:center;color:#af6352;font-weight:900}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .question .hint-btn{background-color:#c6742a;border:none;padding:.5rem 1.25rem;border-radius:.25rem;color:var(--bs-white);cursor:pointer;transition-duration:.3s}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .question .hint-btn:hover{font-weight:900;scale:1.1}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .confirmed-row{width:100%;display:flex;align-items:center;justify-content:space-between}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .confirmed-row .confirmed-text{padding:.8rem 1.25rem;background-color:#e8e8e8;color:#4b4b4b;border-radius:.25rem;width:95%}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .confirmed-row .modify-btn{margin-left:.5rem;font-size:1.25rem;border:none;background:none;cursor:pointer;transition-duration:.3s}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .confirmed-row .modify-btn:hover{font-weight:900;scale:1.1}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .input-row{width:100%;display:flex;align-items:center}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .input-row textarea{width:95%;border:1px solid #a9724a;border-radius:.25rem;padding:.25rem;font-size:1.5rem}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .input-row .answer-confirm-btn{margin-left:.5rem;font-size:1.25rem;border:none;background:none;cursor:pointer;transition-duration:.3s}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .input-row .answer-confirm-btn:hover{font-weight:900;scale:1.1}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .warning{color:red;margin-top:8px;line-height:1.4}.prompt-edu-play .footer-actions{position:absolute;bottom:100px;right:0;z-index:9}.prompt-edu-play .footer-actions button{border:none;background:none;cursor:pointer;width:10vw}.prompt-edu-play .play-bottom{width:100%;position:absolute;bottom:0;left:0}@keyframes fadeUpIn{from{opacity:0;transform:translateY(12px) scale(0.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion: reduce){.step-card.animate-in{animation:none !important}}@media screen and (max-width: 1440px){.prompt-edu-play .prev-page-btn{width:12vw}.prompt-edu-play .wide-inner .play-desc{font-size:1.4rem}.prompt-edu-play .wide-inner .example-toggle-btn img{width:14vw}.prompt-edu-play .wide-inner .edu-play-container{padding-bottom:13rem}.prompt-edu-play .wide-inner .edu-play-container .example-panel.visible{width:30%}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list{padding:2rem}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .team-info{display:flex;align-items:center;justify-content:space-between}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .team-info .team-name{padding:.8rem;font-size:1rem}.prompt-edu-play .wide-inner .edu-play-container .team-panel .team-prompt-list .step-card .input-row textarea{font-size:1rem}}@keyframes tickPop{0%{transform:scale(0.7);opacity:0}60%{transform:scale(1.08);opacity:1}100%{transform:scale(1);opacity:1}}.pulse-border{animation:borderPulse 600ms ease-out}@keyframes borderPulse{0%{box-shadow:0 0 0 0 rgba(24,169,87,.35)}100%{box-shadow:0 0 0 0 rgba(24,169,87,0)}}@media(prefers-reduced-motion: reduce){.tick-badge,.pulse-border{animation:none !important}}
.prompt-edu-result{width:100%;min-height:100vh;background-color:#e4d6c9}.prompt-edu-result .wide-inner{max-width:95%;padding-bottom:1rem}.prompt-edu-result .wide-inner .bgm-toggle-btn{position:absolute;right:2rem;top:40px;z-index:20;display:flex;align-items:center;gap:.5rem;background-color:var(--bs-white);border-radius:44px;box-shadow:0 6px 0 rgba(124,65,52,.18);padding:1rem}.prompt-edu-result .wide-inner .bgm-toggle-btn .ios-switch{position:relative;display:inline-block;width:52px;height:32px;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.prompt-edu-result .wide-inner .bgm-toggle-btn .ios-switch input{position:absolute;opacity:0;width:0;height:0}.prompt-edu-result .wide-inner .bgm-toggle-btn .ios-switch .slider{position:absolute;inset:0;border-radius:999px;background:#d1d5db;transition:.25s ease}.prompt-edu-result .wide-inner .bgm-toggle-btn .ios-switch .slider::before{content:"";position:absolute;top:2px;left:2px;width:28px;height:28px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.35);transition:.25s ease}.prompt-edu-result .wide-inner .bgm-toggle-btn .ios-switch input:checked+.slider{background:#34c759}.prompt-edu-result .wide-inner .bgm-toggle-btn .ios-switch input:checked+.slider::before{transform:translateX(20px)}.prompt-edu-result .wide-inner .result-title{width:40vw;margin:0 auto}.prompt-edu-result .wide-inner .result-desc{text-align:center;line-height:1.6;font-size:1.5rem;font-weight:900;margin:1rem auto 2.5rem}.prompt-edu-result .wide-inner .prompt-result-container{width:100%;display:flex;align-items:center;justify-content:center}.prompt-edu-result .wide-inner .prompt-result-container .octopus-picture{position:relative;width:27%;border-radius:.25rem}.prompt-edu-result .wide-inner .prompt-result-container .octopus-picture .octopus-drawing-title{width:10vw;position:absolute;left:50%;transform:translateX(-50%);top:-20px}.prompt-edu-result .wide-inner .prompt-result-container .octopus-picture .octopus-drawing{border-radius:14px;overflow:hidden}.prompt-edu-result .wide-inner .prompt-result-container .result-thumbs-container{display:flex;align-items:center;justify-content:center;gap:1rem;flex:1 1}.prompt-edu-result .wide-inner .prompt-result-container .result-thumbs-container .result-thumb{width:47%;background-color:var(--bs-white);padding:2rem;border:1px dashed #a45725;border-radius:14px;overflow:hidden}.prompt-edu-result .wide-inner .prompt-result-container .result-thumbs-container .result-thumb.is-dragging{opacity:.6;transform:scale(0.98) rotate(-1deg);box-shadow:0 12px 28px rgba(0,0,0,.12);cursor:grabbing}.prompt-edu-result .wide-inner .prompt-result-container .result-thumbs-container .result-thumb.is-drag-over{border-color:#c6742a;background-image:repeating-linear-gradient(-45deg, rgba(198, 116, 42, 0.08) 0 12px, transparent 12px 24px);background-size:40px 40px;animation:barberpole .6s linear infinite}.prompt-edu-result .wide-inner .prompt-result-container .result-thumbs-container .result-thumb .result-thumb-inner{position:relative}.prompt-edu-result .wide-inner .prompt-result-container .result-thumbs-container .result-thumb .result-thumb-inner .team-drawing-title{width:10vw;position:absolute;left:50%;transform:translateX(-50%);top:-20px}.prompt-edu-result .show-vote-result-btn{position:absolute;right:10px;border:none;background:none;width:11vw;cursor:pointer}@keyframes barberpole{from{background-position:0 0}to{background-position:40px 0}}@media screen and (max-width: 1400px){.prompt-edu-result .wide-inner .result-desc{font-size:1.25rem}}
.prompt-edu-loading{width:100%;height:100vh;background:linear-gradient(180deg, #ffe191 0%, #ffc022 100%);overflow:hidden;position:relative}.prompt-edu-loading .loading-desc{color:#0e3a73;font-size:2rem;text-align:center;font-weight:900;line-height:1.4;padding-top:3rem}.prompt-edu-loading .progress-bar .progress{background-color:#134d99}.prompt-edu-loading .testing-lottie{width:100%;position:absolute;bottom:-50px;left:0}.prompt-edu-loading .loading-wave{width:100%;position:absolute;bottom:-20px;left:0}
.prompt-edu-door{width:100%;height:100vh;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background-color:#000;perspective:1000px}.prompt-edu-door .click-text{position:absolute;left:50%;top:8%;transform:translateX(-50%);z-index:90;font-size:2rem;color:var(--bs-white);background-color:rgba(0,0,0,.5);padding:1rem;border-radius:.25rem;animation:twinkle .7s infinite alternate}.prompt-edu-door .door{width:50%;height:100%;overflow:hidden;position:relative;cursor:pointer}.prompt-edu-door .door.door-left{transform-origin:left center}.prompt-edu-door .door.door-left .door-in-left{width:100%;height:100%;object-fit:cover;display:block}.prompt-edu-door .door.door-right{transform-origin:right center}.prompt-edu-door .door.door-right .door-in-right{width:100%;height:100%;object-fit:cover;display:block}.prompt-edu-door .door .door-nikki{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:30vw}.prompt-edu-door .door .door-arial{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:30vw}.prompt-edu-door.open .door-left{animation:doorOpenLeft 1s forwards ease-in-out}.prompt-edu-door.open .door-right{animation:doorOpenRight 1s forwards ease-in-out}@keyframes doorOpenLeft{from{transform:rotateY(0deg)}to{transform:rotateY(-90deg)}}@keyframes doorOpenRight{from{transform:rotateY(0deg)}to{transform:rotateY(90deg)}}@keyframes twinkle{from{opacity:.5}to{opacity:1}}@media screen and (max-width: 1400px){.prompt-edu-door .click-text{font-size:1.5rem}}
.prompt-edu-final{width:100%;min-height:100vh;background-color:#2cc1f2;position:relative}.prompt-edu-final .team-select-btn{position:absolute;right:0%;bottom:5%;color:#111;background-color:#fff;display:block;z-index:99;border:none;padding:16px;font-size:20px;box-shadow:0 6px 0 rgba(124,65,52,.18);border-radius:50px;cursor:pointer}.prompt-edu-final .vote-deco-items{position:fixed;bottom:0px;left:0;width:100%}.prompt-edu-final .wide-inner{height:100vh;position:relative;padding-top:10px}.prompt-edu-final .wide-inner .navigations{display:flex;align-items:center;justify-content:space-between;width:100%;position:absolute;top:20px;left:50%;transform:translateX(-50%);z-index:90;cursor:pointer}.prompt-edu-final .wide-inner .navigations .home-btn{width:4vw}.prompt-edu-final .wide-inner .navigations .go-hub-btn{width:9vw}.prompt-edu-final .wide-inner .vote-title{width:13vw;margin:0 auto;position:relative;z-index:9}.prompt-edu-final .wide-inner .retry-btn-container{position:relative;z-index:90;display:flex;align-items:center;justify-content:center}.prompt-edu-final .wide-inner .retry-btn-container button{border:none;background:none;cursor:pointer}.prompt-edu-final .wide-inner .bgm-toggle-btn{position:absolute;right:2rem;top:15%;z-index:20;display:flex;align-items:center;gap:.5rem;background-color:var(--bs-white);border-radius:44px;box-shadow:0 6px 0 rgba(124,65,52,.18);padding:1rem}.prompt-edu-final .wide-inner .bgm-toggle-btn .ios-switch{position:relative;display:inline-block;width:52px;height:32px;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.prompt-edu-final .wide-inner .bgm-toggle-btn .ios-switch input{position:absolute;opacity:0;width:0;height:0}.prompt-edu-final .wide-inner .bgm-toggle-btn .ios-switch .slider{position:absolute;inset:0;border-radius:999px;background:#d1d5db;transition:.25s ease}.prompt-edu-final .wide-inner .bgm-toggle-btn .ios-switch .slider::before{content:"";position:absolute;top:2px;left:2px;width:28px;height:28px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.35);transition:.25s ease}.prompt-edu-final .wide-inner .bgm-toggle-btn .ios-switch input:checked+.slider{background:#34c759}.prompt-edu-final .wide-inner .bgm-toggle-btn .ios-switch input:checked+.slider::before{transform:translateX(20px)}.prompt-edu-final .wide-inner .result-navigation{position:absolute;right:0;top:50%;transform:translateY(-50%);z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;list-style:none;margin:0;padding:8px;width:clamp(120px,15vw,240px);border:4px solid #7c4134;border-radius:24px;background:#fffaf0;box-shadow:0 6px 0 rgba(124,65,52,.18);gap:10px}.prompt-edu-final .wide-inner .result-navigation button{position:absolute;top:8px;right:8px;z-index:100;background-color:rgba(0,0,0,0);border:none}.prompt-edu-final .wide-inner .result-navigation li{position:relative;width:100%;text-align:center;cursor:pointer;-webkit-user-select:none;user-select:none;padding:.9rem 1rem;border-radius:999px;font-weight:900;font-size:clamp(14px,.9vw,18px);line-height:1;color:#7c4134;background:hsla(0,0%,100%,.75);border:3px solid rgba(0,0,0,0);transition:transform .15s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease}.prompt-edu-final .wide-inner .result-navigation li:active{transform:translateX(0);box-shadow:0 4px 10px rgba(124,65,52,.12)}.prompt-edu-final .wide-inner .result-navigation li.active{background:linear-gradient(180deg, #f9d548, #f4bf36);border-color:#7c4134;color:#3b241e;box-shadow:0 6px 0 rgba(124,65,52,.25),inset 0 0 0 3px #fff3bf;transform:translateX(-1px)}.prompt-edu-final .wide-inner .result-navigation li.active::before{content:"";position:absolute;right:calc(100% + 6px);top:50%;transform:translateY(-50%) rotate(45deg);width:10px;height:10px;background:#7c4134;border-radius:2px}.prompt-edu-final .wide-inner .prompt-result-all-container{width:70%;margin:0 auto;position:relative;z-index:1;display:flex;align-items:stretch;justify-content:center;gap:1rem;position:relative;top:-14px}.prompt-edu-final .wide-inner .prompt-result-all-container .badge{position:absolute;left:50%;top:-100px;transform:translateX(-50%)}.prompt-edu-final .wide-inner .prompt-result-all-container .left{width:50%;padding:1rem;background-color:var(--bs-white);border-radius:24px;position:relative}.prompt-edu-final .wide-inner .prompt-result-all-container .left .badge{position:absolute;left:50%;top:-20px;transform:translateX(-50%);width:10vw}.prompt-edu-final .wide-inner .prompt-result-all-container .left .result-left-image{border-radius:14px}.prompt-edu-final .wide-inner .prompt-result-all-container .right{width:50%;padding:3rem;background-color:var(--bs-white);border-radius:24px;position:relative}.prompt-edu-final .wide-inner .prompt-result-all-container .right .badge{position:absolute;left:50%;top:-20px;transform:translateX(-50%);width:10vw}.prompt-edu-final .wide-inner .prompt-result-all-container .right .prompt-title{text-align:center;font-size:2rem;border-bottom:1px solid #d3d3d3;padding-bottom:1rem;margin-bottom:1rem}.prompt-edu-final .wide-inner .prompt-result-all-container .right .prompt-blur-wrap{position:relative}.prompt-edu-final .wide-inner .prompt-result-all-container .right .prompt-blur-wrap.blurred .prompt-list{filter:blur(8px);pointer-events:none;-webkit-user-select:none;user-select:none;height:45vh}.prompt-edu-final .wide-inner .prompt-result-all-container .right .prompt-blur-wrap .reveal-blur{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.1);-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);border:none;cursor:pointer;font-weight:700;font-size:1rem;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.45)}.prompt-edu-final .wide-inner .prompt-result-all-container .right .prompt-blur-wrap .reveal-blur:focus-visible{outline:3px solid #ffd54f;outline-offset:-3px}.prompt-edu-final .wide-inner .prompt-result-all-container .right .prompt-blur-wrap .reveal-blur figure{width:95%}.prompt-edu-final .wide-inner .prompt-result-all-container .right .prompt-list{text-align:center;font-size:1.5rem;line-height:2;white-space:normal;word-break:break-word;max-height:450px;overflow-y:auto}@media screen and (max-width: 1400px){.prompt-edu-final .wide-inner .navigations .home-btn{width:5.5vw}.prompt-edu-final .wide-inner .navigations .go-hub-btn{width:12vw}.prompt-edu-final .wide-inner .prompt-result-all-container{width:90%}.prompt-edu-final .wide-inner .prompt-result-all-container .left .badge{width:14vw}.prompt-edu-final .wide-inner .prompt-result-all-container .right .badge{width:14vw}.prompt-edu-final .wide-inner .result-navigation{top:auto;top:initial;bottom:-10%}.prompt-edu-final .wide-inner .result-navigation li{width:90%}.prompt-edu-final .wide-inner .retry-btn-container .retry-q{width:23vw}.prompt-edu-final .wide-inner .retry-btn-container .new-q{width:16vw}}
.ulju-contents-intro{width:100%;height:100vh;background:url(/static/media/ulju-intro-bg.fd86913e8c588a1ccc25.svg) center/cover no-repeat;overflow:hidden}.ulju-contents-intro .inner{max-width:75%;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.ulju-contents-intro .inner .title{text-align:center;color:#f8de3d;font-weight:900;font-size:3rem;opacity:0;transform:translateY(20px);animation:fadeUp .8s ease forwards}.ulju-contents-intro .inner .desc{text-align:center;color:var(--bs-white);font-size:1.5rem;margin:1.5rem auto 3rem;opacity:0;transform:translateY(20px);animation:fadeUp .8s ease forwards}.ulju-contents-intro .inner .contents-intro-container{width:100%;display:flex;align-items:center;justify-content:center;gap:2rem}.ulju-contents-intro .inner .contents-intro-container .ex-contents{cursor:pointer;transition-duration:.3s;opacity:0;transform:scale(0.8);animation:bounceIn .6s ease-out forwards}.ulju-contents-intro .inner .contents-intro-container .ex-contents:hover{scale:1.05}@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}@keyframes bounceIn{50%{opacity:1;transform:scale(1.1)}100%{opacity:1;transform:scale(1)}}
.survey-intro-section{width:100%;height:100vh;background:url(/static/media/survey-intro-bg.618e6e4c0e48043cfab7.svg) no-repeat bottom/cover;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.survey-intro-section .wide-inner{width:100%;height:95vh;padding:2rem;border:6px solid #72bced;border-radius:24px;background-color:var(--bs-white);display:flex;flex-direction:column;align-items:center;justify-content:center}.survey-intro-section .wide-inner .home-btn{position:fixed;top:40px;left:70px;width:4vw;cursor:pointer}.survey-intro-section .wide-inner .default-logo{width:16vw;margin-bottom:2rem}.survey-intro-section .wide-inner .survey-desc{text-align:center;line-height:1.4;font-size:2rem;border-top:1px solid #c1c1c1;width:95%;padding-top:2rem}.survey-intro-section .wide-inner .survey-step{width:40vw}.survey-intro-section .wide-inner .survey-desc-last{margin-top:2rem;font-size:2rem}.survey-intro-section .wide-inner .survey-start-btn{margin-top:2rem;cursor:pointer;width:10vw;transition-duration:.3s}.survey-intro-section .wide-inner .survey-start-btn:hover{transform:scale(1.1)}.survey-intro-section .survey-intro-char{position:absolute;bottom:-160px;width:23vw}.survey-intro-section .survey-intro-char.nikki{left:-100px}.survey-intro-section .survey-intro-char.arial{right:-80px;width:25vw}@media screen and (max-width: 1440px){.survey-intro-section .wide-inner .survey-desc{font-size:1.4rem}.survey-intro-section .wide-inner .survey-desc-last{font-size:1.4rem}.survey-intro-section .wide-inner .survey-start-btn{width:14vw}.survey-intro-section .wide-inner .home-btn{width:6vw}}
.survey-experience-select{width:100%;height:100vh;background:url(/static/media/experience-select-bg.13da68abfb9991828215.svg) no-repeat bottom/cover;position:relative;overflow:hidden}.survey-experience-select .wide-inner{width:100%}.survey-experience-select .wide-inner .select-header{padding:3rem 0 2rem;width:100%;display:flex;align-items:center;justify-content:space-between;position:relative}.survey-experience-select .wide-inner .select-header .step-box{width:7vw;position:relative}.survey-experience-select .wide-inner .select-header .step-box .step-sub-label{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);color:var(--bs-white);font-size:1.5rem;width:100%;text-align:center;font-weight:900}.survey-experience-select .wide-inner .select-header .center-text-container{position:absolute;left:50%;transform:translateX(-50%);text-align:center}.survey-experience-select .wide-inner .select-header .center-text-container h3{font-size:32px;margin-bottom:.8rem}.survey-experience-select .wide-inner .select-header .center-text-container p{background-color:#e56b24;padding:.6rem 2rem;border-radius:28px;font-size:1.25rem;color:var(--bs-white);display:inline-block;animation:introBubble .5s ease-out;line-height:1.6}.survey-experience-select .wide-inner .experience-all-container{display:grid;grid-gap:clamp(12px,2vw,24px);gap:clamp(12px,2vw,24px);grid-template-columns:repeat(auto-fit, minmax(24%, 1fr));align-items:stretch}.survey-experience-select .wide-inner .experience-all-container button{border:none;background:none}.survey-experience-select .wide-inner .experience-all-container .exp-card{cursor:pointer;display:grid;transition:transform .15s ease-out,filter .15s ease-out;animation:expCardFadeUp .4s ease-out}.survey-experience-select .wide-inner .experience-all-container .exp-card:hover{transform:translateY(-2px)}.survey-experience-select .wide-inner .experience-all-container .exp-card strong{margin-top:8px;font-size:1.1rem}.survey-experience-select .bottom-purple{position:absolute;bottom:0;left:0;width:100%;height:40px;background-color:#7e72f7}@keyframes expCardFadeUp{0%{opacity:0;transform:translateY(12px) scale(0.98)}100%{opacity:1;transform:translateY(0) scale(1)}}@keyframes introBubble{0%{transform:scale(0.9);opacity:0}60%{transform:scale(1.05);opacity:1}100%{transform:scale(1)}}@media screen and (max-width: 1440px){.survey-experience-select .wide-inner .select-header .center-text-container h3{font-size:24px}.survey-experience-select .wide-inner .select-header .center-text-container p{font-size:1rem}.survey-experience-select .wide-inner .step-box .step-sub-label{font-size:1rem}.survey-experience-select .wide-inner .experience-all-container{grid-template-columns:repeat(auto-fit, minmax(20vw, 1fr))}}
:root{--wrap-radius: 999px;--knob-size: 28px;--knob-ring: 4px}.pb-wrap{position:relative;width:100%;max-width:220px;border-radius:999px;border-radius:var(--wrap-radius);padding:10px;background:#fff;box-shadow:0 8px 0 rgba(0,0,0,.06)}.pb-track{position:relative;width:100%;height:100%;border-radius:999px;border-radius:var(--wrap-radius);overflow:hidden;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}.pb-fill{position:absolute;left:0;top:0;bottom:0;border-radius:999px;border-radius:var(--wrap-radius);transition:width 300ms ease}.pb-knob{position:absolute;top:50%;transform:translateY(-50%);width:28px;width:var(--knob-size);height:28px;height:var(--knob-size);border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.25),0 0 0 1px rgba(0,0,0,.04);display:grid;place-items:center;transition:left 400ms ease-out,box-shadow 200ms ease}.pb-knob-core{display:block;width:calc(28px - 4px*2);width:calc(var(--knob-size) - var(--knob-ring)*2);height:calc(28px - 4px*2);height:calc(var(--knob-size) - var(--knob-ring)*2);border-radius:50%}.pb-wrap:focus-within .pb-knob{outline:3px solid #ffd54f;outline-offset:2px}
.experiece-choice-container{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:1rem;margin-top:1rem;max-height:73vh;overflow-y:scroll}.experiece-choice-container .choice-item{width:18%;position:relative;animation:contentCardFadeUp .35s ease-out;transition:transform .15s ease-out,box-shadow .15s ease-out}.experiece-choice-container .choice-item.best-selected .contents-info figure{border:8px solid #2e3192}.experiece-choice-container .choice-item.worst-selected .contents-info figure{border:8px solid #dd3423}.experiece-choice-container .choice-item:hover{transform:translateY(-4px)}.experiece-choice-container .choice-item .contents-info{width:80%;position:relative;bottom:-30px;margin:0 auto;background-color:#fffae6;border-top-right-radius:24px;border-top-left-radius:24px;cursor:pointer}.experiece-choice-container .choice-item .contents-info p{padding:1rem;text-align:center;color:#8d592a;font-size:1.2rem}.experiece-choice-container .choice-item .badge-img{position:absolute;bottom:0;right:0;width:9vw}.experiece-choice-container .choice-item .badge-img.badge-best{animation:badgePop .22s ease-out}.experiece-choice-container .choice-item .badge-img.badge-worst{animation:badgePop .22s ease-out}.can-next-btn{cursor:pointer;background:none;border:none;position:fixed;right:36px;bottom:20px;z-index:1;width:10vw;transition:transform .15s ease-out,filter .15s ease-out}.can-next-btn:hover{transform:translateY(-2px) scale(1.03);filter:drop-shadow(0 6px 10px rgba(0, 0, 0, 0.2))}.can-next-btn:active{transform:translateY(0) scale(0.98);filter:none}@keyframes contentCardFadeUp{0%{opacity:0;transform:translateY(10px) scale(0.97)}100%{opacity:1;transform:translateY(0) scale(1)}}@keyframes badgePop{0%{transform:scale(0) rotate(-10deg);opacity:0}60%{transform:scale(1.1) rotate(2deg);opacity:1}100%{transform:scale(1) rotate(0deg);opacity:1}}@media screen and (max-width: 1440px){.can-next-btn{width:14vw}}
.type-all-container{display:flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:1rem;margin-top:.5rem}.type-all-container .type-card{width:18%;cursor:pointer;position:relative;animation:contentCardFadeUp .35s ease-out;transition:transform .15s ease-out,box-shadow .15s ease-out}.type-all-container .type-card:hover{transform:translateY(-4px)}.type-all-container .type-card.best-selected{border:6px solid blue;border-radius:32px}.type-all-container .type-card.worst-selected{border:6px solid red;border-radius:32px}.type-all-container .type-card .badge-img{position:absolute;bottom:10px;right:10px;width:10vw}.type-all-container .type-card .badge-img.badge-best{animation:badgePop .22s ease-out}.type-all-container .type-card .badge-img.badge-worst{animation:badgePop .22s ease-out}@keyframes contentCardFadeUp{0%{opacity:0;transform:translateY(10px) scale(0.97)}100%{opacity:1;transform:translateY(0) scale(1)}}@keyframes badgePop{0%{transform:scale(0) rotate(-10deg);opacity:0}60%{transform:scale(1.1) rotate(2deg);opacity:1}100%{transform:scale(1) rotate(0deg);opacity:1}}
.rejoin-cards{display:flex;justify-content:center;gap:1rem;margin-top:2rem}.rejoin-cards .rejoin-card{width:25%;aspect-ratio:1/1;border:none;background-color:#fff7f7;padding:1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:1rem;cursor:pointer;transition-duration:.3s}.rejoin-cards .rejoin-card .title{font-size:1.5rem;font-weight:900}.rejoin-cards .rejoin-card .desc{font-size:.875rem;margin-top:1rem;color:#707070}.rejoin-cards .rejoin-card img{width:14vw}.rejoin-cards .rejoin-card.positive{background-color:#eff8ff}.rejoin-cards .rejoin-card.positive .title{color:#0068ff}.rejoin-cards .rejoin-card.positive.selected{border:6px solid #0068ff}.rejoin-cards .rejoin-card.negative .title{color:#f30}.rejoin-cards .rejoin-card.negative img{width:12vw;margin-top:2rem}.rejoin-cards .rejoin-card.negative.selected{border:6px solid #f30}.reason-title{margin:2rem auto;font-size:2rem;text-align:center}.reason-chip-list{width:80%;margin:1rem auto;display:flex;justify-content:center;align-items:center;gap:1rem}.reason-chip-list .reason-chip{font-size:1.25rem;padding:1rem;border-radius:32px;border:1px solid #999;background-color:var(--bs-white);color:#919191;cursor:pointer;animation:contentCardFadeUp .35s ease-out;transition:transform .15s ease-out,box-shadow .15s ease-out}.reason-chip-list .reason-chip:hover{transform:translateY(-4px)}.reason-chip-list .reason-chip.active{font-weight:900}.reason-chip-list .reason-chip.active.yes{color:#0068ff;border:1px solid #0068ff;background-color:#eff8ff}.reason-chip-list .reason-chip.active.no{color:#f30;border:1px solid #f30;background-color:#ffe3dc}@keyframes contentCardFadeUp{0%{opacity:0;transform:translateY(10px) scale(0.97)}100%{opacity:1;transform:translateY(0) scale(1)}}@media screen and (max-width: 1440px){.reason-chip-list .reason-chip{font-size:1rem}}
.survey-complete-modal{position:fixed;inset:0;background-color:rgba(0,0,0,.7);width:100%;height:100vh;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;animation:modal-fade-in 280ms ease-out}.survey-complete-modal .complete-survey{width:80vw;margin:0 auto;animation:modal-pop 420ms cubic-bezier(0.16, 1, 0.3, 1)}.survey-complete-modal .complete-survey-btn{border:none;background:none;cursor:pointer;width:10vw;position:fixed;left:50%;transform:translateX(-50%);bottom:50px;transition:.3s}.survey-complete-modal .complete-survey-btn:hover{scale:1.1}.survey-complete-modal .complete-survey-btn:active{transform:translateY(0) scale(0.98);filter:none}@keyframes modal-fade-in{from{opacity:0}to{opacity:1}}@keyframes modal-pop{0%{opacity:0;transform:scale(0.85) translateY(20px)}60%{opacity:1;transform:scale(1.02) translateY(0)}100%{opacity:1;transform:scale(1)}}
.summary-container{max-width:80%;height:80vh;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;margin:0 auto;gap:1rem;overflow-y:scroll;padding:2rem 0}.summary-container .type-block{width:48%;position:relative;animation:contentCardFadeUp .35s ease-out;transition:transform .15s ease-out,box-shadow .15s ease-out}.summary-container .type-block .type-title p{text-align:center;position:relative;z-index:10;font-size:1.25rem;color:var(--bs-white);font-weight:900}.summary-container .type-block .type-title .subject{width:10vw;position:absolute;left:50%;top:-8px;transform:translateX(-50%)}.summary-container .type-block .cards{display:flex;align-items:center;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:93%}.summary-container .type-block .cards .card{position:relative}.summary-container .type-block .cards .card .card-container{position:absolute;padding:1rem 1.5rem 1rem 1rem}.summary-container .type-block .cards .card .card-container .title{text-align:center;margin:.6rem auto;color:#8d592a;font-size:1.2rem}.summary-container .type-block .cards .card .card-container .thumbnail{border-radius:10px}@keyframes contentCardFadeUp{0%{opacity:0;transform:translateY(10px) scale(0.97)}100%{opacity:1;transform:translateY(0) scale(1)}}