@import url("https://fonts.googleapis.com/css2?family=Jua&family=Nerko+One&family=Overpass:wght@400;600&display=swap");
/******************** layout ********************/
html{width:100%; min-height:840px; overflow-x:hidden;}
html{
    -ms-touch-action:pan-y;
    touch-action:pan-y;
}
body{}

.blind {
    border: 0 !important;
    clip: rect(0 0 0 0) !important;
    height: 1px !important;
    margin: -1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
}

.blind.focusable:active, .blind.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}
/*** base wrap ***/
#allwrap {width:100%; margin:0 auto; min-width:320px;}
#allwrap:after {content:""; display:block; clear:both;}
#allBg {display:none; position:absolute; left:0; top:0; width:100%; height:100%; background:#1b1b1c; opacity:0.6; overflow:hidden; z-index:200;}
#wrap {position:relative; width:100%; overflow: hidden !important; }
#wrap:after {content:""; display:block; clear:both;}

.pt_0 { padding-top: 0 !important; }
/* header */
#header {
    position: fixed;
    top: 0;
    z-index: 100;
    width: 100%;
    height: 130px;
    transition: height .3s ease-in-out;

}
@media (min-width:851px){
    #header .btn_m {display: none;}
}

#header.nav-up {
    background-color: #fff;
}
#header .header-wrap {
    position: relative;
}
#header.kinder-header.active,
#header.kinder-header.active.sticky {
    height: auto;
    background: #fff;
    height: 270px;
    transition: height .3s ease-in-out;
    border-bottom: 1px solid #dfdfdf;
}

#header .header-wrap h1.logo a {
    display: inline-block;
    width: 80px;
    height: 58px;
    background: url("/images/home/logo_eggschool.svg") 0 0 no-repeat;
    background-size: 100% auto;
    vertical-align: middle;
}
#wrap.eng #header .header-wrap h1.kinder-logo a, #wrap.jp #header .header-wrap h1.kinder-logo a {
    width: 300px;
    height: 50px;
    /*background: url("/images/home/logo_Kinder.svg") 0 0 no-repeat;*/
    background: url("/images/home/logo_Kinder_kr_new.svg") 0 0 no-repeat;
}

#header .header-wrap h1.kinder-logo {
    font-size: 0;
    position: absolute;
    top: 35px;
    left: 50px;
}

#header .header-wrap h1.kinder-logo a {
    display: inline-block;
    width: 138px;
    height: 40px;
    background: url("/images/home/logo_Kinder_kr.svg") 0 0 no-repeat;
    background-size: 100% auto;
    vertical-align: middle;
}

#header .header-wrap .utill-menu {
    position: absolute;
    right: 50px;
    top: 35px;
}

#header .header-wrap .utill-menu .language-select {
    display: inline-block;
    margin-top: 10px;
    position: relative;
    vertical-align: middle;
}

#header .header-wrap .utill-menu .language-select .label {
    display: block;
    font-family: Overpass;
    font-size: 16px;
    padding-right: 44px;
    height: 38px;
    line-height: 38px;
    background: url("/images/home/ic_arrow_down.svg") right 0 no-repeat;
    background-size: 38px auto;
    color: #fff;
    cursor: pointer;
}

#header .header-wrap .utill-menu .language-select ul {
    position: absolute;
    left: -10px;
    top: 54px;
    display: none;
    width: 80px;
    height: 144px;
    text-align: center;
    background: url("/images/home/select_bg.svg") 0 0 no-repeat;
    background-size: 80px auto;
    padding-top: 25px;
    font-size: 20px;
    line-height: 1.7;
}

#header .header-wrap .utill-menu .language-select ul li a {
    color: #fff;
    font-size: 14px;
    line-height: 28px;
}

#header .header-wrap .utill-menu .language-select ul li a:hover {
    color: #000000;
    text-decoration: underline;
}

#header .header-wrap .utill-menu .language-select ul li.active a {
    color: #000000;
    text-decoration: underline;
}

#header .header-wrap .utill-menu .mypape-select {
    display: inline-block;
    position: relative;
    vertical-align: middle;
}

#header .header-wrap .utill-menu .mypape-select .label {
    display: inline-block;
    vertical-align: middle;
    width: 82px;
    height: 42px;
    line-height: 42px;
    background: url("/images/home/btn_mypage.svg") 0 0 no-repeat;
    background-size: 100% auto;
    margin-left: 16px;
    cursor: pointer;
    font-size: 14px;
    text-align: center;
    color: #fff;
}

#header .header-wrap .utill-menu .mypape-select ul {
    position: absolute;
    left: 50%;
    top: 51px;
    display: none;
    width: 100px;
    height: 157px;
    text-align: center;
    background: url("/images/home/bg_mypage.png") 0 0 no-repeat;
    background-size: 100% auto;
    padding-top: 10px;
    font-size: 14px;
    line-height: 2;
    transform: translate(-45%, 0);
}

#header .header-wrap .utill-menu .mypape-select ul li a {
    color: #7c7c7c;
    font-size: 14px;
    line-height: 1.2;
    font-weight: 500;
    display: inline-block;
    margin-bottom: 0.5em;
}

#header .header-wrap .utill-menu .mypape-select ul li a:hover {
    color: #000000;
    text-decoration: underline;
}

#header .header-wrap .utill-menu .mypape-select ul li.active a {
    color: #000000;
    text-decoration: underline;
}

#header .header-wrap .utill-menu .mypape-select.active ul {
    display: block;
}

#header .header-wrap .utill-menu .btn-buy {
    display: inline-block;
    vertical-align: middle;
    width: 90px;
    height: 45px;
    line-height: 45px;
    text-align: center;
    background: url("/images/home/btn_buy.svg") 0 0 no-repeat;
    background-size: 100% auto;
    color: #fff;
    font-size: 14px;
}

#header .header-wrap .utill-menu .btn-login {
    display: inline-block;
    vertical-align: middle;
    width: 82px;
    height: 42px;
    line-height: 42px;
    text-align: center;
    background: url("/images/home/btn_login.svg") 0 0 no-repeat;
    background-size: 100% auto;
    margin-left: 16px;
    color: #fff;
    font-size: 14px;
}

#header .header-wrap .gnb {
    padding-top: 40px;
}

#header .header-wrap .gnb .nav {
    width: 100%;
    text-align: center;
    overflow: hidden;
}

#header .header-wrap .gnb .nav .depth01 {
    position: relative;
    display: inline-block;
    padding: 0 22px;
}

#header .header-wrap .gnb .nav .depth01 > a {
    display: block;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    font-family: "Overpass", sans-serif;
    height: 42px;
    line-height: 42px;
}

#header .header-wrap .gnb .nav .depth01:hover, #header .header-wrap .gnb .nav .depth01.active {
    background: url("/images/home/bg_depth01_01.png") center 0 no-repeat;
}

#header .header-wrap .gnb .nav .depth01:nth-child(2):hover, #header .header-wrap .gnb .nav .depth01:nth-child(2) .active {
    background: url("/images/home/bg_depth01_02.png") no-repeat center 0 / 99%;
}

#header .header-wrap .gnb .nav .depth01:nth-child(4):hover, #header .header-wrap .gnb .nav .depth01:nth-child(4).active {
    background: url("/images/home/bg_depth01_04.png") center 0 no-repeat;
}

#header .header-wrap .gnb .nav .depth02 {
    width: 100%;
    opacity: 0;
    position: absolute;
    left: 50%;
    top: 25px;
    padding-top: 30px;
    transform: translate(-50%, 0);
}

#header .header-wrap .gnb .nav .depth02 li {
    display: block;
    margin: 0;
}

#header .header-wrap .gnb .nav .depth02 li a {
    position: relative;
    font-size: 16px;
    line-height: 2.25;
    color: #7c7c7c;
}
#header .header-wrap .gnb .nav .depth02 li:hover a,
#header .header-wrap .gnb .nav .depth02 li .active a {
    color: #000;
}
#header .header-wrap .gnb .nav .depth02 li a:after {
    content: "";
    position: absolute;
    bottom: -1px;
    right: 0;
    width: 0;
    height: 1px;
    background: #222;
    -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1);
    -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
    transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

#header .header-wrap .gnb .nav .depth02 li:hover, #header .header-wrap .gnb .nav .depth02 li .active {
    background: no-repeat;
}

#header .header-wrap .gnb .nav .depth02 li:hover a, #header .header-wrap .gnb .nav .depth02 li .active a {
    color: #000;
}

#header .header-wrap .gnb .nav .depth02 li:hover a::after, #header .header-wrap .gnb .nav .depth02 li .active a::after {
    right: auto;
    left: 0;
    width: 100%;
}

#header.kinder-header {
    opacity: 0;
    -webkit-transform: translateY(-180px);
    transform: translateY(-180px);
    height: 110px;
    transition: height .3s ease-in-out;
}

#header.kinder-header .utill-menu {
    display: inline-block;
}

#header.kinder-header .utill-menu .language-select {
    margin-left: 30px;
}

#header.kinder-header.nav-down {
    background: #fff;
    transition: all 0.25s ease-out;
}

#header.kinder-header.nav-down h1.kinder-logo {
    top: 35px;
    transition: all 0.25s ease-out;
}

#header.kinder-header.nav-down .header-wrap .utill-menu {
    top: 35px;
    transition: all 0.25s ease-out;
}
#header.kinder-header.nav-up .header-wrap .utill-menu .language-select .label,
#header.kinder-header.nav-down .header-wrap .utill-menu .language-select .label {
    color: #000000;
}

#header.kinder-header.nav-down .header-wrap .utill-menu .mypape-select .label {
    background-image: url("/images/home/btn_mypage_sticky.svg");
    color: #000;
}

#header.kinder-header.nav-down .gnb {
    padding: 40px 0;
    transition: all 0.25s ease-out;
}

#header.kinder-header.nav-down .gnb .nav .depth01 a {
    color: #000000;
}

#header.kinder-header.nav-down .utill-menu {
    display: inline-block;
}

#header.kinder-header.nav-down .utill-menu .btn-login {
    background-image: url("/images/home/login_sticky.svg");
    color: #000;
}

#header.kinder-header.sticky {
    background: transparent;
}

#header.kinder-header.sticky h1.kinder-logo {
    top: 35px;
    transition: all 0.25s ease-out;
}

#header.kinder-header.sticky .header-wrap .utill-menu {
    top: 35px;
    transition: all 0.25s ease-out;
}

#header.kinder-header.sticky .header-wrap .utill-menu .language-select .label {
    color: #fff;
}

#header.kinder-header.sticky .header-wrap .utill-menu .mypape-select .label {
    background-image: url("/images/home/btn_mypage.png");
}

#header.kinder-header.sticky .gnb {
    padding: 40px 0;
    transition: all 0.25s ease-out;
}

#header.kinder-header.sticky .gnb .nav .depth01 a {
    color: #fff;
}

#header.kinder-header.sticky .utill-menu {
    display: inline-block;
}

#header.kinder-header.sticky .utill-menu .btn-login {
    background: url("/images/home/btn_login.png") 0 0 no-repeat;
    background-size: 100% auto;
}

#header.kinder-header.active, #header.kinder-header.active.sticky {
    height: auto;
    background: #fff;
    height: 270px;
    transition: height .3s ease-in-out;
}

#header.kinder-header.active .nav, #header.kinder-header.active.sticky .nav {
    overflow: inherit;
}
#header.kinder-header.nav-up .nav .depth01 a,
#header.kinder-header.active .nav .depth01 a,
#header.kinder-header.active.sticky .nav .depth01 a {
    color: #000000;
}

#header.kinder-header.active .nav .depth02, #header.kinder-header.active.sticky .nav .depth02 {
    opacity: 1;
    transition: opacity .3s ease-in-out;
}

#header.kinder-header.active .nav .depth02 a, #header.kinder-header.active.sticky .nav .depth02 a {
    color: #000000;
}

#header.kinder-header.active .utill-menu .btn-login,
#header.kinder-header.nav-up .utill-menu .btn-login,
#header.kinder-header.active.sticky .utill-menu .btn-login {
    background-image: url("/images/home/login_sticky.svg");
    color: #000;
}
#header.kinder-header.nav-up .utill-menu .mypape-select .label,
#header.kinder-header.active .utill-menu .mypape-select .label,
#header.kinder-header.active.sticky .utill-menu .mypape-select .label {
    background-image: url("/images/home/btn_mypage_sticky.svg");
    color: #000;
}

#header.kinder-header.active .utill-menu .language-select .label, #header.kinder-header.active.sticky .utill-menu .language-select .label {
    color: #000;
}

#header.nav-up {
    top: 0px;
}


/* S:mobile nav - (jp) */
.m_gnb {
    display: none;
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 100;
    background-color: #fff;
    padding-top: 6vh;
    padding-bottom: 5vh;
    box-sizing: border-box;
}

.m_gnb_closed {
    position: absolute;
    top:34px;
    right: 20px;
    width: 24px;
    height: 24px;
    background: url(/images/home/m_close.svg) no-repeat 0 0 / cover;
    border: 0 solid #000;
}
.language_btn {
    position: absolute;
    left: 31px;
    top:28px;
}
.language_btn a {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 36px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.25;
    text-align: center;
    color: #000;
}
.language_btn a.on {
    background: url(/images/home/lang_bg.svg) no-repeat 0 0 / cover;
}
.m_menu {padding-left: 17px;}
.m_menu > li {
    margin-bottom: 5px;
}
.m_menu > li:last-child {
    margin-bottom: 0;
}

.m_menu > li > a {
    display: inline-block;
    align-items: center;
    justify-content: center;
    font-family: Overpass;
    font-size: 30px;
    font-weight: 600;
    letter-spacing: -0.05em;
    text-align: left;
    color: #000;
    width: auto;
    height: 66px;
    line-height: 66px;
    padding-left: 0.15em;
}
.m_menu > li:nth-child(1) > a {width: 9em;}
.m_menu > li:nth-child(2) > a {width: 6em;}
.m_menu > li:nth-child(3) > a {width: 6.2em;}
.m_menu > li:nth-child(4) > a {width: 6em;}
.m_menu > li:nth-child(1).on > a {background: url(/images/home/m_menu_01.svg) no-repeat 0 0 / contain;}
.m_menu > li:nth-child(2).on > a {background: url(/images/home/m_menu_02.svg) no-repeat 0 0 / contain;}
.m_menu > li:nth-child(3).on > a {background: url(/images/home/m_menu_03.svg) no-repeat 0 0 / contain;}
.m_menu > li:nth-child(4).on > a {background: url(/images/home/m_menu_04.svg) no-repeat 0 0 / contain;}

.m_menu > li > div {
    display: none;
    padding-left: 24px;
    margin:18px 0 40px;
}
.m_menu > li > div a {
    display: block;
    font-family: Overpass,'Noto Sans KR';
    font-size: 20px;
    font-weight: 600;
    line-height: 1.6;
    text-align: left;
    color: #000;
}
.m_menu > li > div a.kr {font-size: 18px;}

.sub_menu {
    margin-top: 5vh;
    padding-left: 20px;
}

.sub_menu li > a {
    display: block;
    font-family: Overpass;
    font-size: 24px;
    font-weight: 600;
    line-height: 0.83;
    text-align: left;
    color: #000;
    margin-bottom: 24px;
}
.sub_menu div {
    padding-left: 10px;
}
.sub_menu div a {
    display: block;
    font-family: 'Noto Sans KR';
    color: #000;
    font-size: 16px;
    margin-bottom: 10px;
}
.etc_menu {
    margin-top: 40px;
    padding-left: 40px;
    padding-bottom: 40px;
}
.etc_menu::before {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    background-color: #d1d1d1;
    margin-bottom: 40px;
}
.etc_menu a {
    font-family: 'Noto Sans KR';
    font-weight: 500;
    font-size: 16px;
    line-height: 2.19;
    color: #000;
}
/* E:mobile nav - (jp) */

/* footer */
#footer * {
    font-size: 16px;
    line-height: 1.63;
}

.en {
    font-family: "Overpass", sans-serif !important;
}
#footer .footer-wrap {
    position: relative;
    width: 1160px;
    margin: 210px auto 0;
    padding-top: 80px;
    padding-bottom: 70px;
    background: url("/images/home/footer_line.svg") 0 0 repeat-x;
    color: #7c7c7c;
}

#footer .footer-wrap .footer-nav a {
    color: #7c7c7c;

}

#footer .footer-wrap .footer-nav li {
    display: inline-block;
}

#footer .footer-wrap .footer-nav li + li::before {
    content: '';
    display: inline-block;
    margin: 0 8px 0 5px;
    width: 4px;
    height: 4px;
    border-radius: 4px;
    background-color: #7c7c7c;
    vertical-align: top;
    margin-top: 11px;
}

#footer .footer-wrap .footer-info {
    margin-top: 20px;
    font-size: 16px;
}

#footer .footer-wrap .footer-info .address {
    margin-bottom: 2px;
}

#footer .footer-wrap .footer-info > span:before {
    content: '';
    display: inline-block;
    margin: 0 8px 0 5px;
    width: 4px;
    height: 4px;
    border-radius: 4px;
    background-color: #7c7c7c;
    vertical-align: top;
    margin-top: 11px;
}

#footer .footer-wrap .footer-info > span.ceo:before {
    display: none;
}

#footer .footer-wrap .copy {
    margin-top: 20px;
    line-height: 1.63;
}

#footer.intro-footer {
    position: absolute;
    z-index: 2;
    width: 100%;
}

#footer.intro-footer .footer-nav a {
    color: #ffffff;
}

#footer.intro-footer .footer-nav a::before {
    background-color: #fff;
}

#footer.intro-footer .footer-wrap {
    margin: 0 auto;
    color: #ffffff;
}

#footer.intro-footer .footer-wrap .footer-info span:before {
    background-color: #fff;
}

/* S:sns  링크 추가 css */
#footer .footer-wrap .footer-familySite {
    margin-top: 20px;
    text-align: right;
}

.footer_side_block {
    position: absolute;
    top: 50px;
    right: 30px;
}

.fnb_sns_list {
    display: flex;
    gap: 0.5em;
}
.fnb_sns_item img {
    max-width: clamp(30px, 8vw, 48px);
}
/* E:sns  링크 추가 css */

/* loading */
#loading {display:none; position:fixed; left:0; top:0; width:100%; height:100%; z-index:9999;}
#loading .loadingBg {position:absolute; left:0; top:0; width:100%; height:100%; background:#1b1b1c; opacity:0.6; z-index:50;}
#dots {display:block; position:absolute; top:50%; left:50%; height:50px; width:50px; margin:-25px 0 0 -25px; z-index:60;}
#dots span {position:absolute; width:10px; height:10px; background:rgba(0, 0, 0, 0.25); border-radius:50%; -webkit-animation:dots 1s infinite ease-in-out;      animation:dots 1s infinite ease-in-out;}
#dots span:nth-child(1) {left:0px;-webkit-animation-delay:0.2s;animation-delay:0.2s;}
#dots span:nth-child(2) {left:15px;-webkit-animation-delay:0.3s;animation-delay:0.3s;}
#dots span:nth-child(3) {left:30px;-webkit-animation-delay:0.4s;animation-delay:0.4s;}
#dots span:nth-child(4) {left:45px;-webkit-animation-delay:0.3s;animation-delay:0.3s;}

@keyframes dots {
    0% {-webkit-transform:translateY(0px);transform:translateY(0px);-webkit-transform:translateY(0px);transform:translateY(0px);background:#d62d20;}
    25% {-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-transform:translateY(10px);transform:translateY(10px);background:#ffa700;}
    50% {-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-transform:translateY(10px);transform:translateY(10px);background:#008744;}
    100% {-webkit-transform:translateY(0px);transform:translateY(0px);-webkit-transform:translateY(0px);transform:translateY(0px);background:#0057e7;}
}
@-webkit-keyframes dots {
    0% {-webkit-transform:translateY(0px);transform:translateY(0px);background:#d62d20;}
    25% {-webkit-transform:translateY(10px);transform:translateY(10px);background:#ffa700;}
    50% {-webkit-transform:translateY(10px);transform:translateY(10px);background:#008744;}
    100% {-webkit-transform:translateY(0px);transform:translateY(0px);background:#0057e7;}
}
/** END of dots */



/*** content ***/
#content {position:relative; width:100%; z-index:10;}
#content:after {content:""; display:block; clear:both;}

/*** base inbox ***/
.layoutOutbox {position:relative; width:100%; margin:0 auto; padding:0 0 150px 0;}
.layoutOutbox:after {content:""; display:block; clear:both;}

.guideLayout {position:relative; max-width:1160px; margin:0 auto;}
.guideLayout:after {content:""; display:block; clear:both;}
/***** main section *****/
#mainSection {width:100%; overflow:hidden;}

/***************** media web **************/
@media all and (max-width:1280px){
    .guideLayout {width:auto; margin:0 20px;}
    #header .header-wrap h1.kinder-logo a {
        display: inline-block;
        width: 143px;
        height: 44px;
        background: url("/images/home/logo_Kinder_kr.svg") 0 0 no-repeat;
        background-size: 100% auto;
        vertical-align: middle;
    }
    #header .header-wrap .gnb .nav {
        width: 95%;
    }
    #wrap.eng #header .header-wrap h1.kinder-logo a, #wrap.jp #header .header-wrap h1.kinder-logo a {
        width: 62px;
        height: 44px;
        background: url(/images/home/logo_eggschool.svg) 0 0 no-repeat;
        background-size: 62px;
    }

}

/***************** mobile design **************/
/***************** media mobile **************/
@media all and (max-width:640px){
    /* base inbox */
    .guideLayout {margin:0 12px;}

    #header {
        position: fixed;
        top: 0;
        z-index: 100;
        width: 100%;
        height: 130px;
        transition: height .3s ease-in-out;
    }
    #header.kinder-header .btn_m {
        position: absolute;
        right:20px;
        top:24px;
        display: block;
        width: 27px;height: 24px;
        background: url(/images/home/btn_menu_w.svg) no-repeat 0 0 / cover;
        border: 0 solid #000;
    }
    #header.kinder-header.nav-up .btn_m {
        background: url(/images/home/btn_menu.svg) no-repeat 0 0 / cover;
    }
    #header.kinder-header {height: auto;}
    #header.kinder-header .header-wrap h1.kinder-logo,
    #header.kinder-header.sticky h1.kinder-logo {
        top: 24px;left: 20px;
    }
    #header.kinder-header .header-wrap .gnb,
    #header.kinder-header.sticky .header-wrap .utill-menu,
    #header.kinder-header .header-wrap .utill-menu {
        display: none;
    }

    #footer * {
        font-size: 4.26vw;
        line-height: 1.63;
    }
    .en {
        font-family: "Overpass", sans-serif !important;
    }
    #footer .footer-wrap {
        width: calc(100% - 40px);
        margin: 110px 20px 0;
        padding: 40px 0 30px;
        box-sizing: border-box;
        background: url("/images/home/footer_line.svg") 0 0 repeat-x;
        color: #7c7c7c;
    }

    #footer .footer-wrap .footer-nav a {
        color: #7c7c7c;

    }

    #footer .footer-wrap .footer-nav li {
        display: inline-block;
    }

    #footer .footer-wrap .footer-nav li + li::before {
        content: '';
        display: inline-block;
        margin: 0 8px 0 5px;
        width: 4px;
        height: 4px;
        border-radius: 4px;
        background-color: #7c7c7c;
        vertical-align: top;
        margin-top: 11px;
    }

    #footer .footer-wrap .footer-info {
        margin-top: 20px;
        font-size: 16px;
    }

    #footer .footer-wrap .footer-info .address {
        margin-bottom: 2px;
    }

    #footer .footer-wrap .footer-info > span:before {
        content: '';
        display: inline-block;
        margin: 0 8px 0 5px;
        width: 4px;
        height: 4px;
        border-radius: 4px;
        background-color: #7c7c7c;
        vertical-align: top;
        margin-top: 11px;
    }
    #footer .footer-wrap .footer-info > span:last-child:before {
        display: none;
    }
    #footer .footer-wrap .footer-info > span.ceo:before {
        display: none;
    }

    #footer .footer-wrap .copy {
        margin-top: 20px;
        line-height: 1.63;
    }

    #footer.intro-footer {
        position: absolute;
        z-index: 2;
        width: 100%;
    }

    #footer.intro-footer .footer-nav a {
        color: #ffffff;
    }

    #footer.intro-footer .footer-nav a::before {
        background-color: #fff;
    }

    #footer.intro-footer .footer-wrap {
        margin: 0 auto;
        color: #ffffff;
    }

    #footer.intro-footer .footer-wrap .footer-info span:before {
        background-color: #fff;
    }

    /* S:sns  링크 추가 css */
    .footer_side_block {
        position: relative;
        top: 0;
        left: 0;
        margin-top: 20px;
    }

    #footer .footer-wrap .footer-familySite {
        text-align: left;
        margin-top: 15px;
    }
    /* E:sns  링크 추가 css */
}

.skyscraper {
    position: fixed;
    right: 50px;
    bottom: 50px;
    transition: visibility 0.5s ease, opacity 0.5s ease;
    z-index: 1;
}

.skyscraper .btn-qna {
    display: block;
    padding-top: 70px;
    width: 60px;
    background: url("/images/home/ico_qna.png") center 0 no-repeat;
    background-size: 60px auto;
    font-size: 16px;
    text-align: center;
}

.skyscraper .btn-qna:hover + .bubble {
    visibility: visible;
    opacity: 1;
    animation-name: select;
    animation-duration: 700ms;
    animation-delay: 0ms;
}

.skyscraper .bubble {
    display: none;
    visibility: visible;
    opacity: 1;
}

.skyscraper .bubble {
    position: absolute;
    top: -140px;
    right: 30px;
    display: block;
    border-radius: 20px;
    border-bottom-right-radius: 0;
    background-color: #fbc600;
    padding: 20px 30px;
    opacity: 0;
    width: 316px;
    box-sizing: border-box;
    font-size: 18px;
    line-height: 1.67;
}

.skyscraper .bubble::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 0;
    height: 0;
    border: 20px solid transparent;
    border-top-color: #fbc600;
    border-bottom: 0;
    border-right: 0;
    margin-left: -10px;
    margin-bottom: -20px;
}

@media screen and (max-width: 1140px) {
    .mobile {
        display: block;
    }
    .web {
        display: none;
    }
    .skyscraper {
        right: 20px;
    }
    .skyscraper.visible .bubble {
        top: -111px;
        padding: 15px 28px;
        width: 284px;
        box-sizing: border-box;
        font-size: 16px;
        line-height: 1.63;
        visibility: visible;
        opacity: 1;
        animation-name: select;
        animation-duration: 700ms;
        animation-delay: 0ms;
    }
    .skyscraper.visible .bubble::after {
        content: '';
        position: absolute;
        bottom: 0;
        right: 0;
        width: 0;
        height: 0;
        border: 20px solid transparent;
        border-top-color: #fbc600;
        border-bottom: 0;
        border-right: 0;
        margin-left: -10px;
        margin-bottom: -20px;
    }
}

.clear_float {
    clear: both;
}

#chat-icon{
    bottom: 125px !important;
}

#regular_sub{
    position: fixed;
    height: 60px;
    width: 100%;
    background-color: #ffc000;
    color: white;
    text-align: center;
    line-height: 60px;
    font-size: 40px;
    bottom: 0px;
    z-index: 10;
    cursor: pointer;
}

#buy_stage{
    position: relative;
    width: 100%;
    max-width: 1160px;
    margin: 0 auto;
}
#buy_stage .bs_wrap{
    position: relative;
    width: 25%;
    padding: 1px;
    box-sizing: border-box;
    float: left;
}
#buy_stage .bs_status{
    position: relative;
    width: 100%;
    background-color: #bfbfbf;
    color:white;
    text-align: center;
    padding: 20px 0px;
    box-sizing: border-box;
}

.bs_status .bs_row{
    line-height: 24px;
    font-size: 1.5rem;
    font-family: "Noto Sans KR", "돋움", Dotum, Helvetica, Arial, sans-serif;
}


#buy_products{
    position: relative;
    width: 100%;
    padding: 40px;
    box-sizing: border-box;
}

#buy_products .bp_product{
    position: relative;
    width: 100%;
    padding-top: 40px;
    padding-bottom: 20px;
    box-sizing: border-box;
}



.first_page_products .bp_product{
    border-top: 1px solid #c6c6c6;
}

.first_page_products .bp_product:last-child{
    border-bottom: 1px solid #c6c6c6;
}

.first_page_products .bppdw_top:nth-child(2n){
    padding-top: 20px;
    box-sizing: border-box;
}

#buy_products .bp_product .bpp_full_top{
    position: relative;
    width: 100%;
    padding-bottom: 20px;
    box-sizing: border-box;
}

#buy_products .bp_product .bpp_full_top .bpp_title{
    position: relative;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
    color: black;
}

#buy_products .bp_product .bpp_full_top .bpp_type{
    position: relative;
    width: 25%;
    float: left;
    text-align: center;
}

#buy_products .bp_product .bpp_full_top .bpp_price{
    position: relative;
    width: 25%;
    float: left;
    text-align: center;
}

.bpp_ori_pri{
    text-decoration-line: line-through;
}

.bpp_dis_pri{
    font-weight: bold;
}


#buy_products .bp_product .bpp_full_top .bpp_select{
    position: relative;
    width: 20%;
    float: left;
    text-align: center;
    box-sizing: border-box;
    padding-top: 20px;
}

#buy_products .bp_product .bpp_full_info{
    position: relative;
    width: 100%;
    display: initial;
}

#buy_products .bp_product .bpp_full_info .bppfi_hl{
    position: relative;
    width: 100%;
    text-align: center;
    color: red;
}

#buy_products .bp_product .bpp_full_info .bppfb_detail{
    position: relative;
    width: 100%;
}

#buy_products .bp_product .bpp_full_info .bppfb_detail .bppfbd_option_title{
    position: relative;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    color: black;
    margin-bottom: 30px;
}

#buy_products .bp_product .bpp_full_info .bppfb_detail .bppfbd_option_desc{
    position: relative;
    width: 60%;
    float: left;
}

.course_type{
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
    list-style-type: disc;
}

.course_type:nth-child(2){
    margin-top: 10px;
}

#buy_products .bp_product .bpp_full_info .bppfb_detail .bppfbd_option_extra{
    position: relative;
    width: 40%;
    float: left;
    padding-top: 40px;
    box-sizing: border-box;
}

#buy_products .bp_product .bpp_full_info .bppfb_detail .bppfbd_option_extra .bppfbdoe_img{
    position: relative;
    width: 40%;
    float: left;
    text-align: right;
    padding-right: 20px;
    box-sizing: border-box;
}

#buy_products .bp_product .bpp_full_info .bppfb_detail .bppfbd_option_extra .bppfbdoe_name{
    position: relative;
    width: 60%;
    float: left;
    padding-top: 30px;
    box-sizing: border-box;
    font-size: 17px;
    color: black;
}
#buy_products .bp_product .bpp_title{
    position: relative;

    text-align: left;
    font-weight: bold;
    font-size: 24px;
    padding-bottom: 20px;
    box-sizing: border-box;
}


#buy_products .bp_product .bpp_detail{
    position: relative;
    width: 100%;
    float: left;
}

#buy_products .bp_product .bpp_detail .bppd_wrap{
    position: relative;
    width: 100%;
}

#buy_products .bp_product .bpp_detail .bppd_wrap{
    position: relative;
    width: 100%;
}

#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_top{
    position: relative;
    width: 100%;
}

#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_top .bppdwt_type{
    position: relative;
    --widthA: 100%;
    --widthB: calc(var(--widthA) / 14);
    --widthC: calc(var(--widthB) * 5);
    width: var(--widthC);
    float: left;
    text-align: center;
}

#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_top .bppdwt_price{
    position: relative;
    --widthA: 100%;
    --widthB: calc(var(--widthA) / 14);
    --widthC: calc(var(--widthB) * 5);
    width: var(--widthC);
    float: left;
    text-align: center;
}

#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_top .bppdwt_select{
    position: relative;
    --widthA: 100%;
    --widthB: calc(var(--widthA) / 14);
    --widthC: calc(var(--widthB) * 4);
    width: var(--widthC);
    float: left;
    text-align: center;
}

#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_bot{
    position: relative;
    width: 100%;
    display: initial;
}

#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_bot .bppdwb_desc{
    position: relative;
    --widthA: 100%;
    --widthB: calc(var(--widthA) / 14);
    --widthC: calc(var(--widthB) * 9);
    width: var(--widthC);
    float: left;
    text-align: center;
}
#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_bot .bppdwb_extra{
    position: relative;
    --widthA: 100%;
    --widthB: calc(var(--widthA) / 14);
    --widthC: calc(var(--widthB) * 5);
    width: var(--widthC);
    float: left;
    text-align: center;
    padding-top: 40px;
    box-sizing: border-box;
}

#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_bot .bppdwb_desc .bppdwbd_row{
    position: relative;
    width: 100%;
}

#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_bot .bppdwb_desc .bppdwbd_row .bppdwbdr_title{
    position: relative;
    width: 100%;
    text-align: left;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
    list-style-type: disc;
    color: black;
}

#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_bot .bppdwb_desc .bppdwbd_row .bppdwbdr_prods{
    position: relative;
    width: 100%;
    text-align: left;
    word-break: break-word;
    font-size: 17px;
    color: black;
    line-height: 24px;
}

#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_bot .bppdwb_extra .bppdwbe_img{
    position: relative;
    width: 40%;
    float: left;
    text-align: right;
    padding-right: 20px;
    box-sizing: border-box;
}

#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_bot .bppdwb_extra .bppdwbe_name{
    position: relative;
    width: 60%;
    float: left;
    padding-top: 30px;
    box-sizing: border-box;
}

#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_bot .bppdwb_monthly_desc .bppdwbmd_title{
    position: relative;
    width: 100%;
    text-align: left;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}

#buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_bot .bppdwb_monthly_desc .bppdwbmd_prods{
    position: relative;
    width: 100%;
    text-align: left;
    word-break: break-word;
}

.goods_select_btn{
    border-radius: 22px;
    line-height: 24px;
    font-size: 24px;
    background-color: #bfbfbf;
    color: white;
    padding: 8px;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    width: 50%;
    min-width: 135px;
    margin: 0 auto;
}

.gsb_marginer{
    margin-top: 20px !important;
    box-sizing: border-box;
}

#buy_products .bp_product .bpp_pen{
    position: relative;
    width: 100%;

}

#buy_products .bp_product .bpp_pen .bppp_title{
    position: relative;
    width: 30%;
    float: left;
    text-align: center;
    font-weight: bold;
    font-size: 16px;
}

#buy_products .bp_product .bpp_pen .bppp_type{
    position: relative;
    width: 25%;
    float: left;
    text-align: center;
}

#buy_products .bp_product .bpp_pen .bppp_price{
    position: relative;
    width: 25%;
    float: left;
    text-align: center;
}

#buy_products .bp_product .bpp_pen .bppp_select{
    position: relative;
    width: 20%;
    float: left;
    text-align: center;
}

#buy_products .bp_product .bpp_pen .bppp_select .bppps_chk{
    position: relative !important;
    width: 20px;
    height: 20px;
    margin: 0 auto !important;
    opacity: initial !important;
    cursor: pointer;
}



#buy_address #final_title{
    margin-top: 40px;
}

#buy_payment{

    position: relative;
}
#buy_payment .bppfb_detail{
    box-sizing: border-box;
}

#buy_payment .bpm_price{
    position: relative;
    width: 100%;
    margin-top: 20px;
}

#buy_payment .bpm_price .bpmp_title{
    position: relative;
    float: left;
    width: 30%;
    text-align: left;
    font-size: 26px;
    padding-left: 40px;
    box-sizing: border-box;
    line-height: 41px;
}

#buy_payment .bpm_price .bpmp_num{
    position: relative;
    float: left;
    width: 50%;
    text-align: right;
    line-height: 41px;
}

#buy_payment .bpm_price .bpmp_num #bpmpn_amount{
    position: relative;
    color: #c0504d;
    font-size: 26px;
    line-height: 41px;
}

#buy_payment .bpm_price .bpmp_num #bpmpn_currency{
    position: relative;
    color: #c0504d;
    font-size: 26px;
    line-height: 41px;
}

#buy_payment .bpm_price .bpmp_inst{
    position: relative;
    float: left;
    width: 20%;
    text-align: right;
    font-size: 26px;
    line-height: 41px;
}

#buy_finish{
    position: relative;
}

#buy_finish #final_title{
    margin-top: 40px;
}

#buy_finish .tbl{
    margin: 0 auto !important;
}

.bp_staging{
    margin-top: 20px;
    position: relative;
    width: 100%;
}
.bp_staging .bgs_wrap{
    position: relative;
    width: 50%;
    box-sizing: border-box;
    float: left;
}
.bp_staging .bgs_wrap:nth-child(1){
    text-align: right;
    padding-right: 40px;

}
.bp_staging .bgs_wrap:nth-child(2){
    text-align: left;
    padding-left: 40px;
}
.bgs_btn{

    position: relative;
    width: 180px;
    height: 70px;
    line-height: 70px;
    display: inline-block;
    font-family: "Jua", sans-serif;
    background: url(/images/home/btn_more@2x.png) center center no-repeat;
    background-size: auto 68px;
    text-align: center;
    transition: right 0.25s ease-in-out;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.bgsbtn_arrow{
    display: inline-block;
    width: 38px;
    height: 38px;
    background: url(/images/home/ok@2x.png) 0 center no-repeat;
    background-size: 38px auto;
    vertical-align: top;
    margin-top: 16px;
    transition: right 0.25s ease-in-out;
    margin-left: 10px;
}

.bgsbtn_arrow_left{
    display: inline-block;
    width: 38px;
    height: 38px;
    background: url(/images/home/goods_arrow_left.png) 0 center no-repeat;
    background-size: 38px auto;
    vertical-align: top;
    margin-top: 16px;
    transition: right 0.25s ease-in-out;
    margin-right: 10px;
}

.gbs_card_exist{
    position: relative;
    padding: 40px;
    box-sizing: border-box;
    text-align: center;
    border-top: 3px solid #c2c2c2;
}

.gbs_card_exist .gce_title{
    position: relative;
    font-weight: bold;
    text-align: center;
    font-size: 20px;
    margin-bottom: 14px;
}

.gbs_card_exist .gce_num{
    position: relative;
    padding: 20px;
    box-sizing: border-box;
    background-color: #f2f2f2;
    display: inline-block;
    margin-bottom: 14px;
}

.gbs_card_exist .gce_num .gcen_text{
    position: relative;
    font-size: 16px;
}

.gbs_card_exist .gce_num .gcen_text .gcen_digit{
    position: relative;
}

.gbs_card_exist .gce_inst1{
    position: relative;
    margin-bottom: 14px;
    font-size: 16px;
}

.gbs_card_exist .gce_inst2{
    position: relative;
    margin-bottom: 14px;

    word-break: break-word;
}

.gbs_card_exist .gce_btn{
    position: relative;
    padding: 20px;
    box-sizing: border-box;
    background-color: #c00000;
    color: white;
    font-size: 20px;
    text-align: center;
    display: inline-block;
    border-radius: 16px;
}

.oo_list{
    position: relative;
    width: 100%;
}

.oo_wrap{
    position: relative;
    width: 50%;
    box-sizing: border-box;
    padding: 0px 5% 20px 5%;

    float: left;
}
.order_obj{
    position: relative;
    width: 100%;
    border-radius: 14px 14px 14px 14px;

}
.order_obj .oo_top{
    position: relative;

    border-radius: 14px 14px 0px 0px;
}
.order_obj .oo_top #oot_k{
    position: relative;
    color: white;
    font-size: 24px;
    text-align: center;
    background-color: #244e9e;
    border-radius: 14px 14px 0px 0px;
    padding: 10px 15%;

    box-sizing: border-box;
}
.order_obj .oo_top #oot_pre_k{
    position: relative;
    color: white;
    font-size: 24px;
    text-align: center;
    background-color: #e72327;
    border-radius: 14px 14px 0px 0px;
    padding: 10px 15%;
    box-sizing: border-box;
}
.order_obj .oo_top #oot_pen{
    position: relative;
    color: white;
    font-size: 24px;
    text-align: center;
    background-color: #60c7c8;
    border-radius: 14px 14px 0px 0px;
    padding: 10px 15%;
    box-sizing: border-box;
}

.order_obj .oo_body{
    position: relative;
    padding: 30px 8px;
    padding-top: 20px;
    box-sizing: border-box;
    background-color: white;
    border-radius: 0px 0px 14px 14px;
    border-right: 1px solid #d3d3d3;
    border-bottom: 1px solid #d3d3d3;
    border-left: 1px solid #d3d3d3;
}

.order_obj .oo_body .oob_row{
    position: relative;
    margin-bottom: 20px;
}

.order_obj .oo_body .oob_row:last-child{
    margin-bottom: 0;
}

.order_obj .oo_body .oob_row .oobr_title{
    position: relative;
    width: 35%;
    float: left;
    font-size: 15px;
    padding-left: 10px;
    box-sizing: border-box;
    font-weight: bold;
}

.order_obj .oo_body .oob_row .oobr_value{
    position: relative;
    width: 65%;
    float: left;
    font-size: 14px;
}

.order_obj .oo_body .oob_row .oo_empha{
    color: #f00;
}
.order_obj .oo_body .oob_row .btn_wrap{
    margin: 0 auto !important;
}
.order_obj .oo_body .oob_row .btn_wrap .btn_cancel{
    margin: 0 auto !important;
}
.so_pen_img{
    text-align: center;
}
.so_cancel{
    margin: 0 !important;
    text-align: center;
}

.so_cancel .btn_cancel{
    display: inline-flex !important;
    margin: 0 !important;
    background-color: #ea3f45 !important;
    text-align: center;
}

.mpli_top{
    position: relative;
    width: 100%;
    text-align: center;
}

.mpli_top .mplit_elem{
    position: relative;
    width: 24.5%;
    text-align: center;
    background-color: #ed3a40;
    background-color: #d3d3d3;
    line-height: 24px;
    color: white;
    font-size: 18px;
    padding: 14px 0px;
    display: inline-block;
    word-break: break-word;
    border-left: 1px solid white;
    border-right: 1px solid white;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

}
.mpli_top .mplit_elem:hover{
    background-color: #ed3a40;
    transition: 0.3s;
}

@media screen and (max-width: 960px) {
    .mpli_top .mplit_elem{
        font-size: 12px;
    }
}


.mpli_top .mplite_last{

    line-height: 24px !important;
}

@media screen and (max-width: 960px) {
    .download_list > div {
        position: relative;
        right: auto;
        bottom: auto;
        text-align: center;
    }

    .oo_wrap{
        padding: 0px 2% 20px 2%;
    }
}
@media screen and (max-width: 640px){



    .bs_status .bs_row{
        line-height: 15px;
        font-size: 15px;
    }
    .bp_staging{
        margin-top: 20px;
        position: relative;
        width: 100%;
    }
    .bp_staging .bgs_wrap{
        position: relative;
        width: 50%;
        box-sizing: border-box;
        float: left;
    }
    .bp_staging .bgs_wrap:nth-child(1){
        text-align: right;
        padding-right: 40px;

    }
    .bp_staging .bgs_wrap:nth-child(2){
        text-align: left;
        padding-left: 40px;
    }
    .bgs_btn{

        position: relative;
        width: 128.5px;
        height: 50px;
        line-height: 50px;
        display: inline-block;
        font-family: "Jua", sans-serif;
        background: url(/images/home/btn_more@2x.png);
        background-size: contain;
        text-align: center;
        transition: right 0.25s ease-in-out;
        cursor: pointer;
        user-select: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
    }

    .bgsbtn_arrow{
        display: inline-block;
        width: 30px;
        height: 30px;
        background: url(/images/home/ok@2x.png);
        background-size: contain;
        vertical-align: top;
        margin-top: 10px;
        transition: right 0.25s ease-in-out;
        margin-left: 10px;
    }


    .bgsbtn_arrow_left{
        display: inline-block;
        width: 30px;
        height: 30px;
        background: url(/images/home/goods_arrow_left.png);
        background-size: contain;
        vertical-align: top;
        margin-top: 10px;
        transition: right 0.25s ease-in-out;
        margin-left: 10px;
    }

    .bs_status div {
        font-size: 10px;
    }

    .first_page_products{
        padding: 0px !important;
    }

    #buy_products{
        padding:0px;
    }

    #buy_products .bp_product .bpp_full_top .bpp_title {
        width: initial;
        float: initial;
        margin-bottom: 14px;
    }

    #buy_products .bp_product .bpp_detail{
        float: initial;
        width: initial;
        padding: 0px 20px;
        box-sizing: border-box;
    }
    #buy_products .bp_product .bpp_title {
        width: initial;
        float: initial;
        margin-bottom: 14px;
    }

    #buy_products .bp_product .bpp_pen .bppp_title {
        width: initial;
        float: initial;
        margin-bottom: 14px;
    }

    #buy_products .bp_product .bpp_full_top .bpp_price  {
        width: 30%;
    }

    #buy_products .bp_product .bpp_full_top .bpp_price {
        width: initial;
    }
    #buy_products .bp_product .bpp_full_top .bpp_type{
        text-align: left !important;
    }

    #buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_top .bppdwt_type{
        width: 30%;
        text-align: left !important;
    }
    #buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_top .bppdwt_price{
        width: initial;
    }

    #buy_products .bp_product .bpp_full_top .bpp_select{
        float: right;
        margin-right: 24px;
    }
    #buy_products .bp_product .bpp_full_info .bppfb_detail .bppfbd_option_desc{
        width: 75%;
    }

    #buy_products .bp_product .bpp_full_info .bppfb_detail .payment_desc{
        width: 60% !important;
    }

    #buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_top .bppdwt_select{
        float: right;
    }

    #buy_products .bp_product .bpp_pen .bppp_select{
        float: right;
        margin-right: 24px;
    }

    .goods_select_btn{
        min-width: 80px;
        font-size: 14px;
    }

    .bgs_btn{
        font-size: 14px;
    }

    #container{
        padding-top: 50px !important;
    }

    .bppdwbdr_title{
        font-size: 20px;
        font-weight: bold;
        margin-bottom: 10px;
    }
    .bppdwbmd_title{
        font-size: 20px;
        font-weight: bold;
        margin-bottom: 10px;
    }
    #buy_products .bp_product .bpp_full_info .bppfb_detail .bppfbd_option_title{
        width: initial;
        float: initial;
    }
    #buy_products .bp_product .bpp_full_info .bppfb_detail .bppfbd_option_extra .bppfbdoe_img{
        float: initial;
        width: 100%;
        text-align: center !important;
        padding: 0;
    }
    #buy_products .bp_product .bpp_full_info .bppfb_detail .bppfbd_option_extra .bppfbdoe_name{
        float: initial;
        width: 100%;
        text-align: center;
    }

    #buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_bot .bppdwb_extra .bppdwbe_img{
        float: initial;
        width: 100%;
        text-align: center !important;
        padding: 0;
    }
    #buy_products .bp_product .bpp_detail .bppd_wrap .bppdw_bot .bppdwb_extra .bppdwbe_name{
        float: initial;
        width: 100%;
        padding-top: 30px;
    }

    .bppfbd_option_title{
        word-break: break-all;
        font-size: 20px;
        font-weight: bold;
    }

    .course_type{
        font-size: 20px;
        font-weight: bold;
        margin-bottom: 10px;
    }

    .ct2_marg{
        margin-top: 10px;
    }

    .tbl .input_p.card{
        width: 70px !important;
    }
    input[type='text'], input[type='password']{
        width: 80% !important;
    }

    #mobile_input_card_bday{
        width: 100px ! important;
    }

    #buy_products .bp_product .bpp_full_info .bppfi_hl{
        text-align: left;
    }

    .bm_inner_box{
        width: 80% !important;
    }
    #buy_modal .bm_inner_box .bmi_notice{
        text-align: left;
    }

    #buy_payment .bpm_price{
        position: relative;
        width: 100%;
    }

    #buy_payment .bpm_price .bpmp_title{
        position: relative;
        float: left;
        width: 30%;
        text-align: left;
        font-size: 18px;
        padding-left: 20px;
        box-sizing: border-box;
        line-height: 41px;
    }

    #buy_payment .bpm_price .bpmp_num{
        position: relative;
        float: left;
        width: 45%;
        text-align: right;
    }

    #buy_payment .bpm_price .bpmp_num #bpmpn_amount{
        position: relative;
        color: #c0504d;
        font-size: 26px;
    }

    #buy_payment .bpm_price .bpmp_num #bpmpn_currency{
        position: relative;
        color: #c0504d;
        font-size: 26px;
    }

    #buy_payment .bpm_price .bpmp_inst{
        position: relative;
        float: left;
        width: 25%;
        text-align: right;
        font-size: 18px;
        line-height: 41px;
    }


    .gbs_card_exist{
        position: relative;
        padding: 20px;
        box-sizing: border-box;
        text-align: center;
        border-top: 3px solid #c2c2c2;
    }

    .gbs_card_exist .gce_title{
        position: relative;
        font-weight: bold;
        text-align: left;
        word-break: break-word;
        font-size: 20px;
        margin-bottom: 14px;
    }

    .gbs_card_exist .gce_num{
        position: relative;
        padding: 20px;
        box-sizing: border-box;
        background-color: #f2f2f2;
        display: inline-block;
        margin-bottom: 14px;
    }

    .gbs_card_exist .gce_num .gcen_text{
        position: relative;
        font-size: 16px;
    }

    .gbs_card_exist .gce_num .gcen_text .gcen_digit{
        position: relative;
    }

    .gbs_card_exist .gce_inst1{
        position: relative;
        margin-bottom: 14px;
        font-size: 16px;
        text-align: left;
        word-break: break-word;
    }

    .gbs_card_exist .gce_inst2{
        position: relative;
        margin-bottom: 14px;
        text-align: left;
        word-break: break-word;
    }

    .gbs_card_exist .gce_btn{
        position: relative;
        padding: 20px;
        box-sizing: border-box;
        background-color: #c00000;
        color: white;
        font-size: 20px;
        text-align: center;
        display: inline-block;
    }


    .oo_wrap{
        position: relative;
        width: 100%;
        box-sizing: border-box;
        padding: 0px 5% 20px 5%;
    }
}


@media (max-width:850px) {
    #header.kinder-header .header-wrap .gnb,
    #header.kinder-header.sticky .header-wrap .utill-menu, #header.kinder-header .header-wrap .utill-menu {
        display: none;
    }

    .btn_m {
        position: absolute;
        right: 20px;
        top: 24px;
        display: block;
        width: 27px;
        height: 24px;
        background: url(/images/home/btn_menu_w.svg) no-repeat 0 0 / cover;
        border: 0 solid #000;
    }
}


#popup_modal{
    z-index: 20;
    width: 100%;
    height: 100%;
    position: fixed;
    display: initial;
    top:0;
    background-color: rgba(0, 0, 0, 0.2);
}

#popup_modal .bm_inner_box{
    position: absolute;
    width: 400px;
    border-radius: 5px;
    left: 50%;
    transform: translateX(-50%) scale(1.0);
    top: 150px;
    background-color: white;
    padding: 15px;
    box-sizing: border-box;
    box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s linear;
    transform-style: preserve-3D;
    transform-origin: center;
}

.bm_inner_box_scale {
    transform:translateX(-50%) scale(1.0) !important;
}

#popup_modal .bm_inner_box .bmi_notice{
    text-align: left;
    margin-top: 50px;
    font-size: 20px;
}

#popup_modal .bm_inner_box .bmib_bot{
    position: relative;
    width: 100%;
    margin-top: 200px;
    text-align: center;
}

#popup_modal .bm_inner_box .bmib_bot .bmibb_close{
    position: relative;
    padding: 5px 10px;
    box-sizing: border-box;
    text-align: center;
    display: inline-block;
    border-radius: 5px;
    font-size: 20px;
    line-height: 20px;
    background-color: #76e;
    margin: 0 auto;
    color: white;
}