/**
 * season's greeting > css > 회장님용
 * version : 250926
 * version : 251023
 * version : 251029
 * version : 251106
 * version : 251112
*/

/* font */
@font-face{
    font-family:'HyundaiKRLight';
    src:url("/etc/designs/hyundai/ww/en/font/HyundaiSansHeadKRLight.eot"),
    url("/etc/designs/hyundai/ww/en/font/HyundaiSansHeadKRLight.woff2") format("woff2"),
    url("/etc/designs/hyundai/ww/en/font/HyundaiSansHeadKRLight.woff") format("woff");
    font-weight:normal;
    font-style:normal;
    font-display:swap;
}

@font-face{
    font-family:'HyundaiKRRegular';
    src:url("/etc/designs/hyundai/ww/en/font/HyundaiSansHeadKRRegular.eot"),
    url("/etc/designs/hyundai/ww/en/font/HyundaiSansHeadKRRegular.woff2") format("woff2"),
    url("/etc/designs/hyundai/ww/en/font/HyundaiSansHeadKRRegular.woff") format("woff");
    font-weight:normal;
    font-style:normal;
    font-display:swap;
}

@font-face{
    font-family:'HyundaiKRHeadMedium';
    src:url("/etc/designs/hyundai/ww/en/font/HyundaiSansHeadKRMedium.eot"),
    url("/etc/designs/hyundai/ww/en/font/HyundaiSansHeadKRMedium.woff2") format("woff2"),
    url("/etc/designs/hyundai/ww/en/font/HyundaiSansHeadKRMedium.woff") format("woff");
    font-weight:normal;
    font-style:normal;
    font-display:swap;
}

@font-face{
    font-family:'HyundaiSansHeadCN-Light';
    src:url("/etc/designs/hyundai/ww/en/font/cn/HyundaiSansHeadCN-Light.eot"),
    url("/etc/designs/hyundai/ww/en/font/cn/HyundaiSansHeadCN-Light.woff2") format("woff2"),
    url("/etc/designs/hyundai/ww/en/font/cn/HyundaiSansHeadCN-Light.woff") format("woff");
    font-weight:normal;
    font-style:normal;
    font-display:swap;
}

@font-face{
    font-family:'HyundaiSansHeadCN-Regular';
    src:url("/etc/designs/hyundai/ww/en/font/cn/HyundaiSansHeadCN-Regular.eot"),
    url("/etc/designs/hyundai/ww/en/font/cn/HyundaiSansHeadCN-Regular.woff2") format("woff2"),
    url("/etc/designs/hyundai/ww/en/font/cn/HyundaiSansHeadCN-Regular.woff") format("woff");
    font-weight:normal;
    font-style:normal;
    font-display:swap;
}

@font-face{
    font-family:'HyundaiSansHeadCN-Medium';
    src:url("/etc/designs/hyundai/ww/en/font/cn/HyundaiSansHeadCN-Medium.eot"),
    url("/etc/designs/hyundai/ww/en/font/cn/HyundaiSansHeadCN-Medium.woff2") format("woff2"),
    url("/etc/designs/hyundai/ww/en/font/cn/HyundaiSansHeadCN-Medium.woff") format("woff");
    font-weight:normal;
    font-style:normal;
    font-display:swap;
}

/* 공통 */
body, html{overflow:hidden;}
body{background:#fff;}

html[lang="ko"] body{font-family:'HyundaiKRRegular';}
html[lang="ko"] #container .seasons-greeting__form input[type="text"]{font-family:'HyundaiKRHeadMedium';}
html[lang="ko"] .seasons-greeting__form-text{font-family:'HyundaiKRRegular';}
html[lang="ko"] .seasons-greeting__result-text{font-family:'HyundaiKRHeadMedium';}

html[lang="en"] .seasons-greeting__form-text{letter-spacing:-0.64px;}

html[lang="cn"] body{font-family:'HyundaiSansHeadCN-Regular';}
html[lang="cn"] #container .seasons-greeting__form input[type="text"]{font-family:'HyundaiSansHeadCN-Medium';letter-spacing:-0.64px;}
html[lang="cn"] #container .seasons-greeting__form input[type="text"]::placeholder{font-family:'HyundaiSansHeadCN-Light';}
html[lang="cn"] .seasons-greeting__form-text{font-family:'HyundaiSansHeadCN-Regular';}
html[lang="cn"] .seasons-greeting__form .seasons-greeting__btn button{font-family:'HyundaiSansHeadCN-Regular';}
html[lang="cn"] .seasons-greeting__result-text{font-family:'HyundaiSansHeadCN-Medium';}

.seasons-greeting__wrap button:hover{text-decoration:none;}
.seasons-greeting__wrap img{width:100%;height:100%;object-fit:cover;}
.seasons-greeting__wrap .span-margin{margin-left:-4px;}
.seasons-greeting__intro{position:fixed;top:0;left:0;right:0;bottom:0;width:100%;min-height:100vh;height:100%;box-sizing:border-box;overflow:hidden;z-index:10;transition: 1s ease;}
.seasons-greeting__logo{position:absolute;left:32px;top:24px;}
.seasons-greeting__lang{position:absolute;right:32px;top:24px;display:flex;gap:8px;}
.seasons-greeting__lang-btn{position:relative;color:rgba(255,255,255,.6);}
.seasons-greeting__lang-btn:nth-child(2){padding:0 8px;}
.seasons-greeting__lang-btn:nth-child(2)::before,
.seasons-greeting__lang-btn:nth-child(2)::after{content:'';display:block;position:absolute;top:50%;width:2px;height:12px;background:rgba(255,255,255,.2);transform:translateY(-50%);}
.seasons-greeting__lang-btn:nth-child(2)::before{left:0;}
.seasons-greeting__lang-btn:nth-child(2)::after{right:0;}
.seasons-greeting__lang-btn:hover,
.seasons-greeting__lang-btn:focus{text-decoration:none;color:rgba(255,255,255,.6);}
.seasons-greeting__lang-btn.active{text-decoration:underline;color:rgba(255,255,255,1);}
.seasons-greeting__intro .seasons-greeting__inner{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;margin:0 auto;}
.seasons-greeting__intro .seasons-greeting__visual{width:100%;height:100%;}
.seasons-greeting__intro .seasons-greeting__logo{filter: invert(100%) sepia(0%) saturate(7481%) hue-rotate(79deg) brightness(99%) contrast(107%);}
.seasons-greeting__btn button{width:100%;height:56px;font-size:18px;}
.seasons-greeting__btn button:hover{text-decoration:none;}

.seasons-greeting__visual .visual__pc{display:block;height:100%;}
.seasons-greeting__visual .visual__mo{display:none;}

.seasons-greeting__write{position:relative;width:100%;height:100%;min-height:100vh;}
.seasons-greeting__write .seasons-greeting__inner{display:flex;justify-content:space-between;height:100%;}
.seasons-greeting__write .seasons-greeting__logo{position:static;}
.seasons-greeting__write-content{max-width:400px;width:auto;}
.seasons-greeting__form{display:flex;flex-direction:column;width:auto;height:100%;}
#container .seasons-greeting__form input[type="text"]{width:100%;height:54px;padding:0;font-size:29px;border-width:0 0 2px;border-color:#e5e7eb;outline:none;font-family:'HyundaiMedium';}
#container .seasons-greeting__form input[type="text"]::placeholder{color:#e5e7eb;font-family:'HyundaiLight';}
#container .seasons-greeting__form input[type="text"]:focus{border-color:#0000ff;}
.seasons-greeting__form-text{margin:36px 0 80px 0;font-size:20px;}
.seasons-greeting__form .seasons-greeting__btn button{background:#ccc;color:#fff;}
.seasons-greeting__form .seasons-greeting__btn button.on{background:#0000ff;}

.seasons-greeting__result-card{position:relative;}
.seasons-greeting__result-text{position:absolute;top:40px;left:24px;max-width:calc(100% - 48px);font-size:34px;line-height:39px;color:#fff;font-family:'HyundaiMedium';}
.seasons-greeting__result .seasons-greeting__btn{display:flex;gap:10px;margin-top:20px;}
.seasons-greeting__result .save-btn{background:#eceff2;color:#0000ff;}
.seasons-greeting__result .share-btn{background:#0000ff;color:#fff;}
.seasons-greeting__result .seasons-greeting__reset{display:flex;justify-content:center;margin-top:20px;}
.seasons-greeting__result .seasons-greeting__reset button{display:flex;align-items:center;gap:8px;color:#888;}
.seasons-greeting__result .seasons-greeting__reset img{width:20px;height:20px;filter: invert(60%) sepia(1%) saturate(5671%) hue-rotate(27deg) brightness(90%) contrast(76%);}

.seasons-greeting__preview{display:flex;justify-content:center;align-items:center;width:100%;min-height:100svh;}
.seasons-greeting__preview .seasons-greeting__inner{padding:0 32px;max-width:544px;width:100%;height:auto;}
.seasons-greeting__preview .seasons-greeting__preview-card{padding:0 32px;margin:0 auto;max-width:480px;width:100%;}
.seasons-greeting__preview .seasons-greeting__card{position:relative;}
.seasons-greeting__preview .seasons-greeting__card-text{position:absolute;top:40px;left:24px;max-width:calc(100% - 48px);font-size:34px;line-height:39px;color:#fff;font-family:'HyundaiMedium';}
.seasons-greeting__preview .seasons-greeting__btn{margin-top:28px;}
.seasons-greeting__preview .seasons-greeting__btn button{width:100%;height:56px;background:#0000ff;color:#fff;}

.seasons-greeting__popup{display:none;justify-content:center;align-items:center;position:fixed;top:0;left:0;right:0;bottom:0;background:#0003;}
.seasons-greeting__popup.open{display:flex;}
.seasons-greeting__popup-inner{display:flex;justify-content:center;align-items:center;position:relative;padding:16px;background:#fff;}
.seasons-greeting__popup-inner.name,
.seasons-greeting__popup-inner.complete{max-height:72px;}
.seasons-greeting__popup-inner.name .seasons-greeting__popup-cont,
.seasons-greeting__popup-inner.complete .seasons-greeting__popup-cont{display:flex;align-items:center;gap:8px;margin-top:0;}
.seasons-greeting__popup-cont{padding:24px 32px;margin-top:12px;text-align:center;}
.seasons-greeting__popup-cont img{width:auto;height:auto;}
.seasons-greeting__popup-title{margin-bottom:24px;font-size:18px;}
.seasons-greeting__popup-close{position:absolute;top:16px;right:16px;width:16px;height:16px;}
.seasons-greeting__popup-close::before, .seasons-greeting__popup-close::after{content:'';display:block;position:absolute;top:8px;left:0;width:16px;height:2px;background:#000;transform:rotate(45deg);}
.seasons-greeting__popup-close::after{transform:rotate(-45deg);}
.seasons-greeting__popup-icon{display:flex;justify-content:center;align-items:center;gap:16px;}
.seasons-greeting__popup .seasons-greeting__icon{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:14px;font-family:'HyundaiTextRegular';color:#666;}

/* pc */
@media print, screen and (min-width: 1024px) and (max-width: 20000px) {

    .seasons-greeting__intro .seasons-greeting__inner{max-width:1120px;}

    /* write */
    .seasons-greeting__write{padding:80px 0;}
    .seasons-greeting__write .seasons-greeting__visual{width:100vw;height:auto;overflow:hidden;}
    .seasons-greeting__scroll{display:none;}
    .seasons-greeting__write-content{display:none;}
    .seasons-greeting__write-content.on{display:block;margin:0 80px;}

    .seasons-greeting__form-text{margin:36px 0 80px 0;line-height:28px;}
    .seasons-greeting__write .seasons-greeting__logo{margin-top:auto;}
    .seasons-greeting__write .seasons-greeting__btn{margin-top:48px;}
    .seasons-greeting__write video{width:100%;height:100%;object-fit:cover;transform:scale(1.01);}
    .seasons-greeting__form-content{display:flex;flex-direction:column;justify-content:space-between;width:100%;height:auto;}
}

@media print, screen and (min-width: 1280px) and (max-width: 1536px){
    .seasons-greeting__write-content{margin:0 60px;}
}

@media print, screen and (min-width: 1024px) and (max-width: 1279px){
    .seasons-greeting__write{padding:60px 0;}
    .seasons-greeting__write-content{margin:0 40px;}
}

@media print, screen and (min-width:0) and (max-width:1023px) {
    .seasons-greeting__visual .visual__pc{display:none;}
    .seasons-greeting__visual .visual__mo{display:block;height:100%;}
    
    /* intro */
    .seasons-greeting__intro .seasons-greeting__inner{padding:0 24px;}

    /* write */
    .seasons-greeting__write{height:auto;}
    .seasons-greeting__visual video{width:100%;height:100%;object-fit:cover;}
    .seasons-greeting__write .seasons-greeting__visual{width:100%;}
    .seasons-greeting__write .seasons-greeting__inner{flex-direction:column;align-items:center;}
    .seasons-greeting__write .seasons-greeting__visual{position:relative;height:100svh;}
    .seasons-greeting__write-content{display:none;align-items:center;margin:0 auto;padding:0 24px;min-height:100vh;height:100%;}
    .seasons-greeting__write-content + .seasons-greeting__write-content{padding:0;}
    .seasons-greeting__write-content.on{display:flex;}
    .seasons-greeting__form-text{line-height:22px;font-size:16px;font-family:'HyundaiTextRegular';}
    .seasons-greeting__form .seasons-greeting__btn{margin-top:48px;}
    .seasons-greeting__scroll{display:block;position:absolute;left:50%;bottom:24px;width:86px;height:auto;transform:translateX(-50%);text-align:center;color:#fff;}
    .seasons-greeting__scroll img{width:26px;height:auto;filter: invert(100%) sepia(0%) saturate(7481%) hue-rotate(79deg) brightness(99%) contrast(107%);animation:bounce 1s infinite;}

    .seasons-greeting__preview .seasons-greeting__inner{padding:0 24px;}
    .seasons-greeting__preview .seasons-greeting__preview-card{padding:0;}

    @keyframes bounce {
        0%,to {
            transform: translateY(-25%);
            animation-timing-function: cubic-bezier(.8,0,1,1)
        }

        50% {
            transform: none;
            animation-timing-function: cubic-bezier(0,0,.2,1)
        }
    }
}

/* mobile */
@media screen and (min-width:0) and (max-width: 767px){
    .seasons-greeting__logo{top:15px;left:24px;width:auto;height:auto;}
    .seasons-greeting__logo img{width:100%;height:100%;object-fit:cover;}
    .seasons-greeting__lang{top:15px;right:24px;}
    .seasons-greeting__btn button{height:52px;}
        
    .seasons-greeting__write-content + .seasons-greeting__write-content{display:none;margin:0;position:fixed;max-width:100vw;width:100%;height:100svh;}
    .seasons-greeting__write-content + .seasons-greeting__write-content.on{display:block;}
    .seasons-greeting__write-content + .seasons-greeting__write-content.on .seasons-greeting__write .seasons-greeting__visual{display:none;}
    .seasons-greeting__result{position:fixed;min-height:100svh;width:100%;}
    .seasons-greeting__result-card{position:fixed;width:100%;height:100%;}
    .seasons-greeting__result-card img{width:100%;height:100svh;object-fit:cover;}
    .seasons-greeting__result .seasons-greeting__result-text{font-size:clamp(40px, 2vw, 63px);line-height:clamp(46px, 4vw, 69px);}
    .seasons-greeting__write-content + .seasons-greeting__write-content .seasons-greeting__btn{padding:0 24px;width:100%;position:absolute;bottom:24px;left:0;}
    .seasons-greeting__write-content + .seasons-greeting__write-content .seasons-greeting__reset{width:100%;position:absolute;bottom:100px;left:0;}
    .seasons-greeting__result .seasons-greeting__reset button{color:#fff;}
    .seasons-greeting__result .seasons-greeting__reset img{filter: invert(100%) sepia(0%) saturate(7481%) hue-rotate(79deg) brightness(99%) contrast(107%);}

    .seasons-greeting__preview .seasons-greeting__inner{height:100%;padding:0 24px;}
    .seasons-greeting__preview .seasons-greeting__btn{margin-top:20px;}
}