body {color: #161931;}
.body-landing-style{font-family: poppins,"Poppins",nanumSquare,"nanumSquare", sans-serif;}
.body-landing-style .btn-blue-new,
.body-landing-style .btn-blue-new:hover,
.body-landing-style .btn-blue-new:active{box-shadow: none;}

.body-landing-style .btn-landing-line.grey{ background-color: #fff; border: solid 1px rgba(151, 151, 151, 0.5);
    width: 100%; color: #333; box-sizing: border-box;border-radius: 5px; }

/*header*/
.header-landing-style{padding: 0 24px;background: #fff;transition: -webkit-transform 0.4s; transition: transform 0.4s;
    transition: transform 0.4s, -webkit-transform 0.4s;}
.header-landing-style.nexon-header-style {padding-top: 62px;}
.header-landing-style img{width: 140px; max-height: 72px; object-fit: cover; -ms-max-height: 72px;}
.header-landing-style .wrap-logo-style{padding: 24px 0; border-bottom: 1px solid rgba(0, 0, 0, 0.07);}

.scroll-down .header-landing-style{ transform: translate3d(0, -100%, 0)}
.scroll-up .header-landing-style{transform: translate3d(0,0,0);width: 100%;height: 56px;padding: 0;position: fixed;top: 0;}
.scroll-up .header-landing-style img{height: 40px;max-width: 100px;}
.scroll-up .header-landing-style .wrap-logo-style{padding: 8px 0;max-width: 100%;}

/*content*/
.main-landing-style{min-height: 100vh;}
.title-landing-style{line-height: 1.33;font-size: 24px;color: #333;}
.wrap-email-verification .description-landing-style{text-align: center;}
/* email verification popup ↓ */
.description-landing-style{line-height: 1.71; text-align: left;}
/* email verification popup ↑ */
.description-landing-style.error-text-career {color: #f25952; font-weight: 500;}
.duration-screener-style{line-height: 2;}
.content-landing-style{max-width: 664px;box-sizing: border-box;width: 100%;padding: 0 32px;/* min-height: 100vh; */}
/* .content-landing-style .section-landing-style:first-child{padding-top: 40px;} */
.content-landing-style .section-landing-style{padding: 30px 0;}
.content-landing-style .section-landing-style:not(:last-child){border-bottom: 1px solid #eceef1;}
.content-landing-style .section-landing-style:last-child:not(:only-child){margin-bottom: 100px;}
.body-landing-style .wrap-alert-modal-style{padding: 30px 40px;}
.content-landing-style .section-login-style{padding-top: 120px;}

.wrap-alert-page-style{min-height: 100vh;max-width: 100%;padding: 0;display: flex;align-items: center;justify-content: center;flex-direction: column;padding: 20px 0;background-color: #f8fafc;}
.wrap-alert-page-style .content-alert-style{max-width: 450px;width: 100%;padding: 70px 50px;border: 10px solid #e6edff;background: #fff;}
.wrap-alert-page-style .info-verify-style{padding: 0 50px;max-width: 450px;}

.content-landing-style .landing-notice-content-style li{display: flex; line-height: 1.69;}
.content-landing-style a.btn-common-new{width: 100%; justify-content: center;}
.read-only-style:read-only{background:url(/img/dashboard/common/ic-check-blue.svg);background-size: 24px;
    background-position: calc(100% - 6px) 11px;background-repeat: no-repeat;  white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis; padding-right: 30px}
.body-landing-style .btn-apply-style{
    position: static;
    transition: -webkit-transform 0.4s;
    transition: transform 0.4s;
    transition: transform 0.4s, -webkit-transform 0.4s;
    /* margin-top: 30px; */
    }
.body-landing-style .btn-apply-style.fixed{position: fixed; bottom: 0; width: 100%; border-radius: 0; left: 0; right: 0;}

/*screener*/
.body-landing-style .btn-start-screener-style{border-radius: 0px;max-width: 600px;margin: auto;display: block;margin-bottom: 30px;}
.icon-loading-style{-webkit-animation-duration: 0.75s; -moz-animation-duration: 0.75s; animation-duration: 0.75s;
    -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite;
    -webkit-animation-name: rotate-forever; -moz-animation-name: rotate-forever; animation-name: rotate-forever;
    -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; animation-timing-function: linear;
    height: 16px; width: 16px; border: 2px solid #ffffff;border-right-color: transparent; border-radius: 50%; display: inline-block;}
.loading-disabled-style{position: relative;}
.loading-disabled-style:before{content:''; position: fixed;left: 0;top: 0;width: 100%;height: 100%;background: rgba(255,255,255,0.0); cursor: default;}
/*login*/
.body-landing-style .login-warning-area-style{
    padding: 12px 8px;
    position: relative;
    box-sizing: border-box;
    display: flex;
    text-align: left;
    border-radius: 1px;
    border: solid 1px #ffcad7;
    background-color: rgba(255, 202, 215, 0.2);
    /* margin-bottom: 16px; */
    line-height: 1.75;
    margin-top: 32px;
    /* align-items: center; */
    }
.view-password-style{position: absolute;right: 0;top: 50%;transform: translateY(-50%); background-repeat: no-repeat; background-size: 24px; background-position: center;}
.body-landing-style .input-password-style{padding-right: 30px;}
.view-password-style.clicked img:last-child{display: block;}
.view-password-style.clicked img:not(:last-child){display: none;}
.view-password-style:not(.clicked) img:last-child{display: none;}
/*modal email , modal alert*/
/* The modal is hidden by nexon GNB(62px) -> Add .nexon-gnb-style to .modal-common-new */
.modal-byou-email-style .modal-common-new{width: 364px;/* height: 500px; */position: relative;border-radius: 5px;}
.modal-byou-email-style .modal-common-new.nexon-gnb-style {bottom: -31px;}
.body-landing-style .modal-byou-alert-style{width: 364px;max-height: 400px; border-radius: 5px;}
.modal-byou-alert-style .btn-common-new.btn-confirm-style,
.modal-byou-email-style .btn-common-new.btn-confirm-style {flex-shrink: 0; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;}
.modal-byou-email-style .btn-close-style{position: absolute;right: 0;top: 0;bottom: 0;left: 0;width: 100%;height: 100%;}

/*modal email verifying*/
.modal-progress-payment-style{margin: 0 auto; overflow: hidden; background-color: #ffffff; box-sizing: border-box;
    width: 500px; height: 350px; border-radius: 1px; background-color: #ffffff;}
.bar-progress-animation { width: 200px; height: 4px; border-radius: 2px;
    background-image: linear-gradient(to right, #dfe6ee, #6a96ff, #4d77dd, #6a96ff, #6a96ff, #dfe6ee); transition: 0.4s linear;
    transition-property: width, background-color; animation: colorAnimation 1s infinite;}

@media (max-width:700px){
    .body-landing-style .title-landing-style{font-size: 20px;}
}

/*modal gating*/
.landing-gating-option-style{width: 360px;border-radius: 10px;margin: auto;}
.landing-gating-option-style .arrow-app-style{right: 16px;}
.landing-gating-option-style > *:not(:last-child){border-bottom:1px solid rgba(76,76,76,0.12);}

@keyframes rotate-forever {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes colorAnimation {
    0% {
        background-image: linear-gradient(to right, #dfe6ee, #4d77dd, #dfe6ee, #dfe6ee, #dfe6ee, #dfe6ee);
    }
    20% {
        background-image: linear-gradient(to right,#dfe6ee, #dfe6ee, #4d77dd, #dfe6ee, #dfe6ee, #dfe6ee);
    }
    40% {
        background-image: linear-gradient(to right, #dfe6ee, #dfe6ee, #dfe6ee, #4d77dd, #dfe6ee, #dfe6ee);
    }
    60% {
        background-image: linear-gradient(to right,#dfe6ee, #dfe6ee, #dfe6ee, #dfe6ee, #4d77dd, #dfe6ee);
    }
    100% {
        background-image: linear-gradient(to right, #dfe6ee, #dfe6ee, #dfe6ee, #dfe6ee, #dfe6ee, #4d77dd);
    }
}
@media(max-width: 700px) {
    .landing-gating-option-style{margin-bottom: 12px;margin-top: auto;max-width: 360px;width: calc(100% - 24px);}
}