@charset "utf-8";

:root{
    --color-main : #26B7BC;
    --color-snd7 : #5BC9CD;
    --color-snd3 : #C8EDEE;
    --color-snd2 : #D4F1F2;
    --color-snd1 : #EAF8F9;
    
    --color-thd : #AF52DE;

    --color-sub : #2E323B;
    --color-red : #EC171E;
    --color-blu : #1B80E4;
    --color-yel : #E8B931;
    --color-org : #EA5504;
    --color-bk1 : #111;
    --color-bk3 : #333;
    --color-bk6 : #666;
    --color-bk9 : #999;
    --color-gra : #aaa;
    --color-grb : #bbb;
    --color-grc : #ccc;
    --color-grd : #ddd;
    --color-gre : #eee;
    --color-wh4 : #f4f4f4;
    --color-wh8 : #f8f8f8;
    --color-whf : #fff;
}

* { letter-spacing: -0.05em; }

.swal2-styled.swal2-confirm {
    font-size: 16px !important;
    background: var(--color-sub) !important;
}

.wrapper.login2 { background-color: var(--color-whf);min-width: 320px;max-width: 640px; }

.flat_lg_warp { display: block;padding:10px 0px;padding-top:0px !important; }
.flat_lg_warp > .lg_form { padding:0px 40px; }

.flat_lg_warp > .lg_form > hgroup { display: block; padding:40px 0px 50px 0px; }
.flat_lg_warp > .lg_form > hgroup > h1 { display:inline-block; font-size:0px; width:130px;height:48px; background-image:url(../images/sco_bi.svg); background-position: center; background-repeat: no-repeat; background-size: contain;margin-bottom:70px;  } 
.flat_lg_warp > .lg_form > hgroup > h2 { display:block; font-size:35px; line-height: 40px; font-family:"Paperlogy"; font-weight: 800; text-align:left; color:var(--color-sub); letter-spacing: -0.05em;}
.flat_lg_warp > .lg_form > hgroup > h2 > b { display: inline-block;padding:0px 30px;border-radius: 40px;line-height:32px;font-size:18px;font-weight: 700;background-color: var(--color-sub);color: var(--color-whf) }
.flat_lg_warp > .lg_form > hgroup > h2 > b.deviceNum { display: none; }
.flat_lg_warp > .lg_form > hgroup > h2 > b.deviceNum.view { display: inline-block; }
.flat_lg_warp > .lg_form > hgroup > .guide_msg { display: block;background-color: transparent;padding:0px;  margin-top:70px; }
.flat_lg_warp > .lg_form > hgroup > .guide_msg > h4 { display:block; font-size:26px; line-height: 32px; font-family:"Paperlogy"; font-weight: 700; text-align:left; color:var(--color-sub); letter-spacing: -0.05em;}
.flat_lg_warp > .lg_form > hgroup > .guide_msg > h4 > b { font-weight: 700;color:var(--color-main); }
.flat_lg_warp > .lg_form > hgroup > .guide_msg > h4 > span { display:block;font-size:22px;line-height: 28px; }
.flat_lg_warp > .lg_form > hgroup > .guide_msg > p { display:block; font-size:16px; line-height: 20px; text-align:left; color:var(--color-bk9);margin-top:10px;letter-spacing: -0.05em;padding-left:0px; }
.flat_lg_warp > .lg_form > hgroup > .guide_msg > p::before { display: none; }

.flat_lg_warp > .lg_form > h4 { font-size:22px; font-family:"Paperlogy"; font-weight: 700; color:var(--color-sub);margin-bottom: 5px;letter-spacing: -0.05em;line-height: 30px;text-align: left;; }
.flat_lg_warp > .lg_form > form {  }
.flat_lg_warp > .lg_form > form > span { display: block;background-color: var(--color-gre);position: relative;padding-left:46px;border-radius: 5px; overflow: hidden; }
.flat_lg_warp > .lg_form > form > span + span {margin-top:10px;}
.flat_lg_warp > .lg_form > form > span > input[type=number] { display:block;width:100%;line-height: 46px; height:46px; border: 0px;font-size:15px;padding:0px 15px;letter-spacing: -0.05em; }
.flat_lg_warp > .lg_form > form > span > input::placeholder { color:var(--color-grb); }
.flat_lg_warp > .lg_form > form > span::before { content: '';display: block;position: absolute; top:8px;left:0px; height: 30px;line-height: 30px;font-size:24px;vertical-align: bottom;width: 46px;margin-right: 0px;font-family: 'xeicon' !important; color:var(--color-bk9);text-align:center; border-right: 1px solid var(--color-grd);}
.flat_lg_warp > .lg_form > form > span.hp::before { content:'\eaed'; }
.flat_lg_warp > .lg_form > form > button { display: block;width:100%;background-color: var(--color-main); line-height: 52px;height:52px;font-size:18px;font-weight: 600;margin-top:10px;letter-spacing: -0.05em;color:var(--color-whf);border-radius: 5px; }
.flat_lg_warp > .lg_form > form > button:disabled { background-color: var(--color-grb); }

.flat_lg_warp > .lg_form > form > span > input[type=text],
.flat_lg_warp > .lg_form > form > span > input[type=password] { display:block;width:calc( 100% - 50px );line-height: 46px; height:46px; border: 0px;font-size:15px;padding:0px 15px;letter-spacing: -0.05em; }
.flat_lg_warp > .lg_form > form > span > input::placeholder { color:var(--color-grb); }
.flat_lg_warp > .lg_form > form > span::before { content: '';display: block;position: absolute; top:8px;left:0px; height: 30px;line-height: 30px;font-size:24px;vertical-align: bottom;width: 46px;margin-right: 0px;font-family: 'xeicon' !important; color:var(--color-bk9);text-align:center; border-right: 1px solid var(--color-grd);}
.flat_lg_warp > .lg_form > form > span.id::before { content:'\e9f5'; }
.flat_lg_warp > .lg_form > form > span.pw::before { content:'\e966'; }



.flat_lg_warp > .lg_box { padding:0px 40px;margin-top:60px; }
.flat_lg_warp > .lg_box > hgroup { display:none; }
.flat_lg_warp > .lg_box > .app_install { position: relative; display: block; padding:0px;border: 1px solid var(--color-grd);min-height: 60px;border-radius:6px;overflow:hidden; }
.flat_lg_warp > .lg_box > .app_install > img { display:block;width:100%;margin:0px;padding:0px; }

/*
.flat_lg_warp > .lg_box > .app_install { position: relative; display: block; padding:20px 20px 20px 90px;border: 1px solid var(--color-grd);min-height: 60px; }
.flat_lg_warp > .lg_box > .app_install > i { display:block; width:60px;height:60px; background-image:url(../images/qr_app_install_sco.svg); background-position: center; background-repeat: no-repeat; background-size: contain;position: absolute;top:20px;left:20px; }
.flat_lg_warp > .lg_box > .app_install > div { display: block;padding:5px 0px; }
.flat_lg_warp > .lg_box > .app_install > div > h5 { display:block; font-size:18px; line-height: 28px; font-family:"Paperlogy"; font-weight: 700; text-align:left; color:var(--color-sub); letter-spacing: -0.05em;}
.flat_lg_warp > .lg_box > .app_install > div > h5 > b { font-weight: 700;color:var(--color-main); }
.flat_lg_warp > .lg_box > .app_install > div > h5 > span { display:block;font-size:22px;line-height: 28px; }
.flat_lg_warp > .lg_box > .app_install > div > p { display:block; font-size:14px; line-height: 18px; text-align:left; color:var(--color-bk9);margin-bottom:4px;letter-spacing: -0.05em;padding-left:0px; }
*/
.flat_lg_warp > .copy { display: block; margin-top:60px;padding:10px 0px; text-align: center;font-size:14px;line-height: 20px;color: var(--color-bk9); }

@media (min-width: 960px) {
    .wrapper.login2 { max-width: 1280px; }

	.flat_lg_warp { padding:40px 0px 40px 0px;position: relative;font-size:0px;text-align: right;height: 100dvh;min-height: 760px;box-sizing: border-box; }
    .flat_lg_warp > .lg_form { padding:0px 0px;display:inline-block;width:calc( 50% - 160px );vertical-align: middle;position:absolute;top:50%; right:110px; transform: translateY(-50% ); }
    .flat_lg_warp > .lg_box { padding:0px 0px;margin-top:0px;display:inline-block;width:calc( 50% - 160px );vertical-align: middle;position:absolute;top:50%; left:110px; transform: translateY(-50% ); }
    .flat_lg_warp > .copy { margin-top:0px;position: absolute;bottom:0px;left:0px;right:0px; }

    .flat_lg_warp > .lg_form > hgroup { padding-top:0px; }
    .flat_lg_warp > .lg_form > hgroup > h1 { display: none;; }
    .flat_lg_warp > .lg_box > hgroup { display:block; }
    .flat_lg_warp > .lg_box > hgroup > h1 { display:block; font-size:0px; height:135px; background-image:url(../images/sco_bi_full.svg); background-position: center; background-repeat: no-repeat; background-size: contain;margin-bottom:70px;  } 
}

.pop[data-step="input"] > .btsheet { display: block; }
.pop[data-step="input"] > .tssheet { display: none; }
.pop[data-step="test"] > .btsheet { display: none; }
.pop[data-step="test"] > .tssheet { display: block; }

.pop > .tssheet { display: none; }
.pop > .tssheet.view { display: block; }
.pop > .tssheet > .text_wrap { display:block; padding:10px;position: absolute;border-radius: 0px;left: 50%;top:50%;transform: translate(-50%, -50%);overflow: hidden; }
.pop > .tssheet > .text_wrap > h2 { display:block; font-size:30px; line-height: 42px; font-family:"Paperlogy"; font-weight: 700; text-align:center; color:var(--color-whf); letter-spacing: -0.05em; }
.pop > .tssheet > .text_wrap > h2 > b { display: block;font-size:36px; font-weight: 700; }
.pop > .tssheet > .text_wrap > h4 { display:block; font-size:18px; line-height: 22px; text-align:center; color:var(--color-whf);margin-top:15px;letter-spacing: -0.05em; }
.pop > .tssheet > .text_wrap > p { display:block; font-size:64px; line-height: 70px; font-weight: 900; text-align:center; color:var(--color-org); letter-spacing: -0.05em;margin-top:25px; }
.pop > .tssheet > .bottom_noti { position: fixed;bottom:50px;left:0px;right:0px; display:block; padding:10px;font-size:13px;text-align: center;color:var(--color-whf);font-weight: 300;opacity: 0.7; }
.pop > .tssheet > .bottom_noti > b { font-weight: 700; }

.pop > .btsheet { display: none; max-width:520px;min-height:auto;height:auto;width:100%;background: var(--color-whf);position: absolute;left:0px;right:0px;bottom:0px;border-radius: 20px 20px 0px 0px;left: 50%;transform: translateX(-50%);overflow: hidden; }
.pop > .btsheet.view {display: block;}
.pop > .btsheet > header { position:relative;display:block;padding-bottom:0px;padding:10px 20px;border:0px; height:auto;box-shadow:none;background: transparent; }
.pop > .btsheet > header h1 { font-size:20px;font-weight:600;color:var(--color-bk3);line-height:50px;height:50px;overflow: hidden;font-family:"Paperlogy";letter-spacing: -0.05em;}
.pop > .btsheet > header .btns { display:block;position:absolute;top:10px;right:5px;height:50px; }
.pop > .btsheet > header .btns > button { display: inline-block;width:50px;line-height: 50px;height:50px;font-size:20px;color:var(--color-bk1);position: relative;top:auto;right:auto; }
.pop > .btsheet > header .btns > button::before { content: '\e921';font-family: 'xeicon' !important;}
.pop > .btsheet > section { height:auto;max-height: auto;width:100%; }

.pop > .btsheet > section > .init { display:block;padding:20px 20px 10px 20px; }
.pop > .btsheet > section > .init > h4 { display:block; font-size:22px; line-height: 28px; font-family:"Paperlogy"; font-weight: 700; text-align:center; color:var(--color-sub); letter-spacing: -0.05em; }
.pop > .btsheet > section > .init > h4 > b { font-weight: 700;color:var(--color-main); }
.pop > .btsheet > section > .init > p { display:block; font-size:0px;margin-top:30px; }
.pop > .btsheet > section > .init > p > span { display: block;background-color: var(--color-gre);position: relative;border-radius: 5px;border: 1px solid var(--color-gre);overflow: hidden; }
.pop > .btsheet > section > .init > p > span.readonly { display: block;background-color: var(--color-whf);position: relative;border-radius: 5px; }
.pop > .btsheet > section > .init > p > span > input[type=text],
.pop > .btsheet > section > .init > p > span > input[type=password],
.pop > .btsheet > section > .init > p > span > input[type=number] { display:block;width:100%;line-height: 44px; height:44px; border: 0px;font-size:15px;padding:0px 15px;letter-spacing: -0.05em; }
.pop > .btsheet > section > .init > p > span > input::placeholder { color:var(--color-grb); }


.pop > .btsheet > footer { padding:0px;border:0px; }
.pop > .btsheet > footer > .btns { display:block;font-size:0px;padding:11px 20px; }
.pop > .btsheet > footer > .btns > button { display: block;width:100%;border: 2px solid var(--color-main);background-color: var(--color-main); color:var(--color-whf); line-height: 44px;height:48px;font-size:16px;font-weight: 600;margin-top:0px;letter-spacing: -0.05em; border-radius: 5px; vertical-align: bottom;; }
.pop > .btsheet > footer > .btns > button:disabled { background-color: var(--color-grb);border: 2px solid var(--color-grb); }


.pop > .btsheet > section > .pin_setting { display:block;padding:30px 20px 50px 20px; }
.pop > .btsheet > section > .pin_setting > h4 { display:block; font-size:22px; line-height: 28px; font-family:"Paperlogy"; font-weight: 700; text-align:center; color:var(--color-sub); letter-spacing: -0.05em; }
.pop > .btsheet > section > .pin_setting > h4 > b { font-weight: 700;color:var(--color-main); }
.pop > .btsheet > section > .pin_setting > p { display:block; font-size:18px; line-height: 24px; font-weight: 600; text-align:center; color:var(--color-bk6);margin-bottom:4px;letter-spacing: -0.05em; }
.pop > .btsheet > section > .pin_setting > h4::before { content:attr(data-init); }
.pop > .btsheet > section > .pin_setting > p::before { content:attr(data-init); }

.pop > .btsheet > section > .pin_setting.input { }
.pop > .btsheet > section > .pin_setting.input > h4::before { content:attr(data-input); }
.pop > .btsheet > section > .pin_setting.input > p::before { content:attr(data-input); }


.pop > .btsheet > section > .pin_setting > .num_dots { display: block;font-size:0px;text-align:center;padding:50px 0px; }
.pop > .btsheet > section > .pin_setting > .num_dots > i { display: inline-block;content:'';width:20px;height:20px;border:2px solid var(--color-grb);border-radius: 50%;margin:0px 5px;vertical-align: bottom; }
.pop > .btsheet > section > .pin_setting > .num_dots[data-nth="1"] > i:nth-child(-n+1) { border:2px solid var(--color-sub);background: var(--color-sub); }
.pop > .btsheet > section > .pin_setting > .num_dots[data-nth="2"] > i:nth-child(-n+2) { border:2px solid var(--color-sub);background: var(--color-sub); }
.pop > .btsheet > section > .pin_setting > .num_dots[data-nth="3"] > i:nth-child(-n+3) { border:2px solid var(--color-sub);background: var(--color-sub); }
.pop > .btsheet > section > .pin_setting > .num_dots[data-nth="4"] > i:nth-child(-n+4) { border:2px solid var(--color-sub);background: var(--color-sub); }
.pop > .btsheet > section > .pin_setting > .num_dots[data-nth="5"] > i:nth-child(-n+5) { border:2px solid var(--color-sub);background: var(--color-sub); }
.pop > .btsheet > section > .pin_setting > .num_dots[data-nth="6"] > i:nth-child(-n+6) { border:2px solid var(--color-sub);background: var(--color-sub); }
.pop > .btsheet > section > .pin_setting > .guide_msg { display: block;font-size:0px;text-align:center; }
.pop > .btsheet > section > .pin_setting > .guide_msg > h5 { display:block; font-size:18px; line-height: 24px; text-decoration: underline; font-weight: 700; text-align:center; color:var(--color-main); letter-spacing: -0.05em; }
.pop > .btsheet > section > .pin_setting > .guide_msg > p { display:block; font-size:14px; line-height: 20px; text-align:center; color:var(--color-bk6);margin-top:4px;letter-spacing: -0.05em; }
.pop > .btsheet > footer > .safety_keys { display:block;font-size:0px;padding:10px;margin-left:-5px;margin-top:0px; background-color: #D2D3D8; }
.pop > .btsheet > footer > .safety_keys > button { display: inline-block; width: calc( ( 100% / 3 ) - 5px ); margin-top:8px;margin-left:5px; height:50px;line-height: 50px;background: var(--color-whf);color: var(--color-bk1); font-size:24px;box-shadow: 0px 2px 4px rgba(0,0,0,0.1);font-weight: 600;border-radius: 5px;vertical-align: bottom; }
.pop > .btsheet > footer > .safety_keys > button:nth-child(-n+3) { margin-top:0px; }
.pop > .btsheet > footer > .safety_keys > button:nth-child(10) { font-size:18px;font-weight: 400; }
.pop > .btsheet > footer > .safety_keys > button:nth-child(12) { font-size:0px; }
.pop > .btsheet > footer > .safety_keys > button:nth-child(12)::before { display: block;width:24px;height:50px;background-image:url(../images/ico_backspace.svg);background-repeat: no-repeat;background-size: contain;background-position: center;content:'';margin:0 auto;}
.pop > .btsheet > footer > .safety_keys > button:active { box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 4px inset;background:rgba(255,255,255,0.6); }

body.mask:before { display:none !important; }
body.noscroll > .wrapper { filter: blur(10px);-webkit-filter: blur(10px);position: relative; }
.wrapper.main { background-color: var(--color-whf);min-height:auto !important; }

header.flat { display:block;height:70px;position: sticky;top:0px;right:0px;left:0px;padding:10px 10px;transform: none; background:var(--color-whf);box-shadow:none;box-sizing: border-box;z-index: 9;box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.05);} 
header.flat > .btns { display:block;position:absolute;top:10px;height:50px; padding-right:0px; }
header.flat > h1 { display: block; padding:0px 35px;font-size:20px;font-weight:600;color:var(--color-bk3);line-height:50px;height:50px;overflow: hidden;font-family:"Paperlogy";letter-spacing: -0.05em;}
header.flat > span.search { display: none;background-color: var(--color-gre);position: relative;border-radius: 25px;border: 1px solid var(--color-grc);margin:0px 35px; }
header.flat > span.search > input[type=text] { display:block;width:100%;line-height: 48px; height:48px; border: 0px;font-size:15px;padding:0px 20px;letter-spacing: -0.05em; }
header.flat > span.search > button { display: block;width:40px;line-height: 48px;height:48px;font-size:20px;color:var(--color-bk1);position: absolute; top:0px;right:5px; }
header.flat > span.search > button::before { content: '\e97a';font-family: 'xeicon' !important;}

header.flat > .btns.lt { left:5px; }
header.flat > .btns.rt { right:5px; } 
header.flat > .btns > button { display: inline-block;width:40px;line-height: 50px;height:50px;font-size:20px;color:var(--color-bk1); }
header.flat > .btns > button.history_backward::before { content: '\e93b';font-family: 'xeicon' !important;}
header.flat > .btns > button.search_cancel { display: none; }
header.flat > .btns > button.search_cancel::before { content: '\e921';font-family: 'xeicon' !important;}
header.flat > .btns > button.search_cancel.show { display: block; }
.login_flat > header.flat { display:none; }
.academy_search > header.flat > h1 { display:none; }
.academy_search > header.flat > span.search { display:block; }
.app_install > header.flat { display:none; }

.main > header.flat { padding:10px 15px;background-color: var(--color-whf);text-align: left; }
.main > header.flat > .btns.lt { display:none; }
.main > header.flat > h1 { padding-left:5px; }
.main > header.flat > .btns.rt { right:15px;}
.main > header.flat > h1 > a { display:inline-block; vertical-align: middle; font-size:0px; width:130px;height:50px; background-image:url(../images/sco_top_bi_temp.svg); background-position: center 4px; background-repeat: no-repeat; background-size: contain; }
header.flat > .btns > button { width:40px; }
header.flat > .btns > button.add::before { content: '\e919';font-size:28px;font-family: 'xeicon' !important;display:block;}
header.flat > .btns > button.menu::before { content: '\e91c';font-size:28px;font-family: 'xeicon' !important;display:block;}
header.flat > .btns > button.menu + div.tool { display:none;position: absolute;top:50px;right:0px;background-color: var(--color-sub);padding:15px 25px;border-radius: 10px;; }
header.flat > .btns > button.menu + div.tool > a { display:block;color: var(--color-whf);font-size:15px;font-weight: 600; line-height: 40px;text-align:center; }
header.flat > .btns > button.menu.opened + div.tool { display:block; }

@media (min-width: 960px) {
    .main > header.flat { height:80px;padding:15px 30px; }
    .main > header.flat > .btns.rt { right:30px;}
}



aside.nav { display: none; position: fixed; right: 0px; background: #f2f2f2; top: 0px; bottom: 0px; width: 70%; max-width: 380px; z-index: 1000; box-shadow: 0px 0px 10px 10px rgba(0,0,0,0.05); }
aside.nav > header { display: block; padding: 20px 20px 15px 20px; position: relative; }
aside.nav > header > h2 { font-size: 18px; font-weight: 400; line-height: 28px; height: 28px; }
aside.nav > header > h2 > b { font-size: 20px; font-weight: 600; }
aside.nav > header > p { font-size: 14px; font-weight: 400; line-height: 20px; height: 20px; color: #999; }
aside.nav > header > .btn_nav { position: absolute; right: 0px; width: 60px; height: 60px; top: 5px; }
aside.nav > header > .btn_nav::before { font-family: 'xeicon' !important; content: "\e921"; display: block; font-size: 30px; width: 60px; height: 60px; line-height: 60px; text-align: center; }
aside.nav > header > .btns { display: block; margin-top: 0px; font-size: 0px; border: 1px solid #ddd; margin-top: 10px; background: #fff; border-radius: 5px; }
aside.nav > header > .btns > a { display: inline-block; padding: 0px 0px; width: 50%; height: 36px; line-height: 36px; font-size: 13px; text-align: center; color: #666; letter-spacing: -0.5px; }
aside.nav > header > .btns > a + a { margin-left: -1px; border-left: 1px solid #eee; }
aside.nav > header > .btns > a::before { display: inline-block; height: 36px; line-height: 36px; text-align: center; font-family: 'xeicon' !important; font-size: 16px; vertical-align: bottom; margin-right: 5px; color: #999; }
aside.nav > header > .btns > a.setting::before { content: "\e986"; } 
aside.nav > header > .btns > a.logout::before { content: "\e972"; }
aside.nav > ul.summary { display: block; margin-top: 0px; font-size: 0px; background:var(--color-main); padding: 15px 0px; }
aside.nav > ul.summary > li { display: inline-block; width: 33.3333%; text-align: center; padding: 0px 0px; }
aside.nav > ul.summary > li + li { margin-left: -1px; border-left: 1px solid rgba(255, 255, 255, 0.4); }
aside.nav > ul.summary > li > span { display: block; font-size: 11px; color: rgba(255, 255, 255, 0.7); line-height: 18px; height: 18px; letter-spacing: -0.5px; }
aside.nav > ul.summary > li > strong { display: block; font-size: 26px; color: #fff;font-weight: 600; padding: 2px 0px; letter-spacing: -0.5px; line-height: 30px; height: 30px; }
aside.nav > ul.summary > li > em { display: block; font-size: 12px; color: rgba(255, 255, 255, 0.7); line-height: 18px; height: 18px; }
aside.nav > ul.summary > li > em > b { font-size: 12px; font-weight: 500; }
aside.nav > nav { display: block; height: calc(100% - 231px); overflow: hidden; overflow-y: scroll; }
aside.nav > nav > ul { display: block; }
aside.nav > nav > ul > li { display: block; background: #fff; position: relative; }
aside.nav > nav > ul > li + li { border-top: 1px solid #eee; }
aside.nav > nav > ul > li > a { display: block; line-height: 56px; padding: 0px 20px; font-size: 16px; font-weight: 500; position: relative; z-index: 2; letter-spacing: -0.5px; }
aside.nav > nav > ul > li > a > i { display: inline-block; line-height: 56px; width: 30px; text-align: center; margin-right: 0px; text-align: left; font-size: 20px; color: #999; vertical-align: bottom; }
aside.nav > nav > ul > li > a > i::before { line-height: 56px; height: 56px; display: block; }
aside.nav > nav > ul > li.spl { font-size: 0px; margin-top: 20px; margin: 15px; border: 1px solid #ddd; overflow: hidden; border-radius: 10px; }
aside.nav > nav > ul > li.spl > a { display: inline-block; width: 50%; text-align: center; font-size: 14px; padding: 0px 0px; line-height: 46px; }
aside.nav > nav > ul > li.spl > a.full { width: 100%; border-bottom: 1px solid #ddd; }
aside.nav > nav > ul > li.spl > a+a { border-left: 1px solid #ddd; margin-left: -1px; }
aside.nav > nav > ul > li > dl { display: none; border-top: 1px solid #eee; background: #eee; padding: 10px 0px; }
aside.nav > nav > ul > li.subs:after { font-family: 'xeicon' !important; content: "\e942"; vertical-align: middle; position: absolute; top: 0px; right: 15px; display: block; color: #999; font-size: 15px; height: 56px; line-height: 56px; z-index: 1; }
aside.nav > nav > ul > li.opened:after { content: "\e945"; }
aside.nav > nav > ul > li.opened > dl { display: block; }
aside.nav > nav > ul > li > dl > dd { display: block; }
aside.nav > nav > ul > li > dl > dd > a { display: block; padding: 0px 30px 0px 50px; line-height: 38px; position: relative; font-size: 14px; }
aside.nav > nav > ul >li > dl > dd > a::before { position: absolute; top: 19px; left: 40px; background: #999; width: 2px; height: 2px; display: block; content: ''; } 
aside.nav > nav > a { display: block; width: 160px; text-align: center; background: #382063; color: #fff; line-height: 40px; border: 0px solid #ccc; margin: 30px auto 30px auto; border-radius: 5px; }

.dp_cards { display: block;border-radius: 0px;position: relative;overflow: hidden;padding-bottom:0px;background-color: var(--color-whf); }
.dp_cards .card { display:block;padding:20px; }
.dp_cards .card { opacity: 0.5; }
.dp_cards .card.slick-current { opacity: 1; }

.dp_cards .card > .daily_plan { display:block;border-radius: 15px;position: relative;background-color: var(--color-snd3);padding:24px;padding-top:44px;padding-bottom:44px; }
.dp_cards .card.disabled > .daily_plan { background-color: var(--color-gre);}
.dp_cards .card.disabled > .daily_plan > .academy > h2   { color: var(--color-bk9);}
.dp_cards .card > .daily_plan > .academy { display: block;position: relative; }
.dp_cards .card > .daily_plan > .academy > .btns { position: absolute; top:-26px;right:-6px;display:block;font-size:0px; }
.dp_cards .card > .daily_plan > .academy > .btns > button { display:inline-block;width:36px;height:36px;line-height:36px;font-size:0px;position: relative; }
.dp_cards .card > .daily_plan > .academy > .btns > button.card_chatting:before { font-family: 'xeicon' !important; content:"\ea15";color:rgba(46,50,59,0.5);font-size:24px;}
.dp_cards .card > .daily_plan > .academy > .btns > button.card_chatting > em { display: block; position:absolute; top:0px;right:0px; background-color: var(--color-red);color:var(--color-whf); text-align: center; display: block; font-size: 10px;line-height:16px;min-width:12px;padding:0px 2px; font-weight: 400;box-sizing: unset;border-radius: 8px; }
.dp_cards .card > .daily_plan > .academy > .btns > button.card_chatting > em[data-cnt="0"] { display: none; }
.dp_cards .card > .daily_plan > .academy > .btns > button.card_chatting > em::before { content: attr(data-cnt); }
.dp_cards .card > .daily_plan > .academy > .btns > button.card_menu:before { font-family: 'xeicon' !important; content:"\e949";color:rgba(46,50,59,0.5);font-size:24px;}
.dp_cards .card > .daily_plan > .academy > .btns > button.card_menu + div.tool { display:none;position: absolute;top:50px;right:0px;background-color: var(--color-sub);padding:15px 25px;border-radius: 10px;z-index: 10; }
.dp_cards .card > .daily_plan > .academy > .btns > button.card_menu + div.tool > a { display:block;color: var(--color-whf);font-size:15px;font-weight: 600; line-height: 40px;text-align:center; white-space: nowrap; }
.dp_cards .card > .daily_plan > .academy > .btns > button.card_menu.opened + div.tool { display:block; }

.dp_cards .card > .daily_plan > .academy > dl.warning_status { display: block;font-size:0px; }
.dp_cards .card > .daily_plan > .academy > dl.warning_status > dd { display: inline-block;font-size:0px;text-align: center;color:var(--color-whf);background-color: var(--color-bk9);width:42px;padding: 6px 0px;border-radius: 3px; }
.dp_cards .card > .daily_plan > .academy > dl.warning_status > dd > span { font-size:12px;line-height:14px;display: block; }
.dp_cards .card > .daily_plan > .academy > dl.warning_status > dd > b { font-size:20px;line-height:22px;display: block;font-weight: 600; }
.dp_cards .card > .daily_plan > .academy > dl.warning_status > dd + dd { margin-left:2px; }
.dp_cards .card > .daily_plan > .academy > dl.warning_status > dd:first-child { background-color: var(--color-red); }
.dp_cards .card > .daily_plan > .academy > dl.warning_status > dd:last-child { background-color: var(--color-yel); }
.dp_cards .card > .daily_plan > .academy > h2 { display:block; font-size:30px; line-height: 34px; font-family:"Paperlogy"; font-weight: 700; text-align:left; color:var(--color-main); letter-spacing: -0.05em;margin-top:5px; }
.dp_cards .card > .daily_plan > .academy > p { display:block; font-size:15px; line-height: 20px; font-family:"Paperlogy"; font-weight: 700; text-align:left; color:rgba(0,0,0,0.3); letter-spacing: -0.05em;margin-top:15px; }
.dp_cards .card > .daily_plan > .academy > dl.week { display: block;font-size:0px;margin-top:10px; }
.dp_cards .card > .daily_plan > .academy > dl.week > dd { display: inline-block;font-size:11px;background-color: rgba(46,50,59,0.25);color:var(--color-whf);width:18px;height:18px;line-height: 18px;text-align: center;; }
.dp_cards .card > .daily_plan > .academy > dl.week > dd + dd { margin-left:1px; }
.dp_cards .card > .daily_plan > .academy > dl.week > dd.on { background-color: rgba(46,50,59,0.8); }
.dp_cards .card > .daily_plan > .academy > a.mod { position: absolute; bottom:0px;right:0px;display:block;font-size:13px;background-color: var(--color-sub);color:#fff;line-height:28px;padding:0px 10px;border-radius: 5px; }
.dp_cards .card > .daily_plan > .academy > span.rest { position: absolute; bottom:0px;right:0px;display:block;font-size:14px;color:rgba(0,0,0,0.3);line-height:18px; }
.dp_cards .card > .daily_plan > .academy > span.rest > b { font-weight: 700;color:rgba(0,0,0,0.5); }
.dp_cards .card > .daily_plan > .academy > button.checkin { display: none;width:180px;background-color: var(--color-main); line-height: 52px;height:52px;font-size:18px;font-weight: 600;letter-spacing: -0.05em;color:var(--color-whf);border-radius: 5px;position: absolute;bottom:0px;right:0px; }
.dp_cards .card > .daily_plan > .academy > button.checkin:disabled { background-color: var(--color-grb); }

.dp_cards .card > .daily_plan > .ticket { background-color: var(--color-whf);border-radius: 5px;padding:12px;margin-top:15px;position: relative;padding-right:70px;min-height:38px; }
.dp_cards .card > .daily_plan > .ticket > h3 { display:block; }
.dp_cards .card > .daily_plan > .ticket > h3 > b { display:inline-block;font-size:16px;font-weight: 600;line-height: 20px;vertical-align: bottom;margin-right:5px; }
.dp_cards .card > .daily_plan > .ticket > h3 > span { display: inline-block;font-size:12px;font-weight: 300;line-height: 20px;vertical-align: bottom;color:var(--color-bk9); }
.dp_cards .card > .daily_plan > .ticket > p { display:block;font-size:0px;line-height: 18px;word-break : keep-all; }
.dp_cards .card > .daily_plan > .ticket > p > span { display:inline-block;font-size:12px;color: var(--color-bk6);line-height: 18px;vertical-align: bottom;margin-right:8px; }
.dp_cards .card > .daily_plan > .ticket > .rest_qty { position: absolute;top:50%;transform: translateY(-50%);right:12px;font-size:0px; }
.dp_cards .card > .daily_plan > .ticket > .rest_qty > b { display:inline-block;vertical-align: bottom;font-size:35px; line-height: 40px; font-weight: 700;} 
.dp_cards .card > .daily_plan > .ticket > .rest_qty > span { display:inline-block;vertical-align: bottom;padding-bottom:4px; margin-left:5px;} 
.dp_cards .card > .daily_plan > .ticket > .rest_qty > span > em { display:block;vertical-align: bottom;font-size:10px; line-height: 14px; font-weight: 400;color:var(--color-grb);} 
.dp_cards .card > .daily_plan > .ticket > .rest_qty > span > b { display:block;vertical-align: bottom;font-size:16px; line-height: 20px; font-weight: 400;} 

.dp_cards .card > .daily_plan > .dp_list { background-color: rgba(255,255,255,0.4);border-radius: 5px;padding:12px 12px;margin-top:15px;position: relative;overflow: hidden;overflow-y: auto;height:104px; }
.dp_cards .card > .daily_plan > .dp_list > p {display: block;font-size:14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;vertical-align: bottom;line-height:26px;padding-right:60px;position: relative; }
.dp_cards .card > .daily_plan > .dp_list > p > i { display: inline-block;width:30px;font-size:14px;text-align: left;vertical-align: bottom;line-height:26px; }
.dp_cards .card > .daily_plan > .dp_list > p > b { display: inline-block;width:36px;font-size:14px;font-weight:600; text-align: left;margin-right:10px;vertical-align: bottom;line-height:26px; }
.dp_cards .card > .daily_plan > .dp_list > p > span { display: inline-block;font-size:14px;text-align: left;vertical-align: bottom;line-height:26px; }
.dp_cards .card > .daily_plan > .dp_list > p > em { position:absolute; display:block;top:0px;right:0px;font-size:14px;font-weight:600; text-align: right;vertical-align: bottom;line-height:26px; }
.dp_cards .card > .daily_plan > .dp_list > p.nodata { padding-right:0px;display: block;font-size:14px;color:rgba(0,0,0,0.4);text-align: center;line-height: 104px; }

.dp_cards .card > .daily_plan > .dp_list.disabled > h2 { display:block; font-size:22px; line-height: 32px; font-family:"Paperlogy"; font-weight: 700; text-align:left; color:var(--color-sub); letter-spacing: -0.05em; }
.dp_cards .card > .daily_plan > .dp_list.disabled > p { display:block; font-size:12px; line-height: 20px; text-align:left; color:var(--color-bk6); letter-spacing: -0.05em;margin-top:0px;padding-right:0px; }
.dp_cards .card > .daily_plan > .dp_list.disabled > button { display: block;width:140px;background-color: var(--color-main); line-height: 42px;height:42px;font-size:16px;font-weight: 600;margin-top:10px;letter-spacing: -0.05em;color:var(--color-whf);border-radius: 5px; }
.dp_cards .card > .daily_plan > .dp_list.disabled > button:disabled { background-color: var(--color-grb); }

.dp_cards .card > .week_result { display:block;border-radius: 15px;position: relative;background-color: var(--color-gre);padding:20px 15px;margin-top:15px;}
.dp_cards .card > .week_result > span { display:block;line-height: 16px;font-size:12px;color:var(--color-grb);text-align: right; }
.dp_cards .card > .week_result > div { display: block;font-size:0px; height:100px; }
.dp_cards .card > .week_result > div > p { display: inline-block;width:calc( 100% / 7 );position: relative;height:100%; }
.dp_cards .card > .week_result > div > p > i { display: block;background-color: var(--color-grc);width:12px;margin:0 auto;position: absolute;bottom:25px;left:50%;transform: translateX(-50%);border-radius: 8px 8px 0px 0px; }
.dp_cards .card > .week_result > div > p > i.high { background-color: var(--color-main); }
.dp_cards .card > .week_result > div > p > b { display: block; font-size:12px;line-height:20px;padding-top:4px;margin-top:-24px;background-color:var(--color-gre);font-weight:600;text-align: center;position: absolute;bottom:0px;left:0px;right:0px;}
.dp_cards .card > .week_result > div > p > b.red { color:var(--color-red); }
.dp_cards .card > .week_result > div > p > b.blue { color:var(--color-blu); }
.dp_cards .card > .week_result > div > p > span { display: none;position:absolute;top:-84px;left:50%;transform:translateX(-50%);background:var(--color-sub);color:var(--color-whf);width:auto;padding:12px;border-radius:5px;font-size:13px;line-height:16px;white-space: nowrap;text-align:right; }
.dp_cards .card > .week_result > div > p > span > b { display:block;font-size:15px;font-weight:600;margin-top:6px; }


.dp_cards .card > .week_result > div > p > span:after,
.dp_cards .card > .week_result > div > p > span:before { top: 100%; margin-bottom: 0px; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.dp_cards .card > .week_result > div > p > span:after { border-color: transparent; border-top-color:var(--color-sub); border-width: 4px; margin-left: -4px; }
.dp_cards .card > .week_result > div > p > span:before { border-color: transparent; border-top-color:var(--color-sub); border-width: 5px; margin-left: -5px; }


.dp_cards .card > .time_schedule { display:block;position: relative;background-color: var(--color-gre);padding:20px 20px;margin-top:15px;margin-left:-20px;margin-right:-20px;font-size:0px; white-space: nowrap; overflow: hidden;overflow-x: auto;}
.dp_cards .card > .time_schedule > p { display: inline-block;width:60px;padding:10px;border-radius: 8px;background-color: var(--color-whf);margin-left:5px;vertical-align: bottom; }
.dp_cards .card > .time_schedule > p > i { display:block;background-color: var(--color-gre);color:var(--color-grb);font-size:11px;text-align: center;line-height: 32px;border-radius: 5px;margin-bottom:5px; }
.dp_cards .card > .time_schedule > p.on > i { background-color: var(--color-sub);color:var(--color-whf); }
.dp_cards .card > .time_schedule > p > span { display:block;color:var(--color-sub);font-size:10px;text-align: center;line-height: 14px;min-height:28px; }
.dp_cards .card > .time_schedule > p > span > b { display:block;font-size:11px;font-weight:600;text-align: center;line-height: 14px; }

@media (min-width: 600px) {

    .dp_cards .card > .time_schedule > p { width:calc( 100% / 7 - 5px );padding:10px;box-sizing: border-box; }
}

.dp_cards .dots { position: fixed;bottom:78px;height:4px;left:50%;transform: translateX(-50%);font-size:0px; }
.dp_cards .dots > i { width:40px;height:4px;display:inline-block;background-color: var(--color-grd);vertical-align: bottom; }
.dp_cards .dots > i.on { background-color: var(--color-snd); }
.dp_cards .dots > ul.slick-dots { display:block;font-size:0px; }
.dp_cards .dots > ul.slick-dots > li { width:40px;height:4px;display:inline-block;background-color: var(--color-grc);vertical-align: bottom;opacity: 0.5; }
.dp_cards .dots > ul.slick-dots > li > button { display: none;; }
.dp_cards .dots > ul.slick-dots > li.slick-active { background-color: var(--color-main);opacity: 0.5; }
.dp_cards .dots > ul.slick-dots > li + li { margin-left:0px; }
.dp_cards .slick-list { padding:0px !important; }

.footer_btns { display:block;height:70px;position: sticky;bottom:0px;right:0px;left:0px;background:var(--color-whf);box-shadow:none;padding:11px 20px;z-index: 10;box-sizing: border-box;box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.05);}
.footer_btns > button { display: block;width:100%;background-color: var(--color-main); line-height: 48px;height:48px;font-size:18px;font-weight: 600;letter-spacing: -0.05em;color:var(--color-whf);border-radius: 5px; }
.footer_btns > button:disabled { background:var(--color-grb); }
.footer_btns > button.waiting { background:var(--color-bk9); }


@media (min-width: 960px) {

    .dp_cards { padding:40px 80px;position: absolute;left:50%;top:50%; transform: translate(-50%, -50%);margin-top:-50px; }
    .dp_cards .card { padding:40px;background-color: var(--color-snd3);border-radius: 15px;position: relative; }
    .dp_cards .card > .daily_plan { padding:0px; }
    .dp_cards .card.disabled { background-color: var(--color-gre);}
    .dp_cards .card > .daily_plan > .academy > .btns { top:-6px;right:-6px; }
    .dp_cards .card > .daily_plan > .academy > span.rest { right:200px;}
    .dp_cards .card > .daily_plan > .academy > button.checkin { display: block;}
    
    .dp_cards .card > .daily_plan > .ticket { border-radius: 8px; }
    .dp_cards .card > .daily_plan > .dp_list { background-color: var(--color-whf);height:144px;padding:20px 12px;box-sizing: border-box; width: calc( (100% - 10px) / 2 );border-radius: 8px;margin-top:10px; }

    .dp_cards .card > .week_result { position: absolute;right:40px;bottom:102px; border-radius: 8px;background-color: var(--color-whf);padding:20px 12px;margin-top:15px;box-sizing: border-box;width: calc( (100% - 90px) / 2 );}
    .dp_cards .card > .week_result > div { height:88px; }
    .dp_cards .card > .week_result > div > p > b { background-color:var(--color-whf);}

    .dp_cards .card > .time_schedule { background-color: transparent;padding:0px;margin-top:10px;margin-left:-5px;margin-right:0px;overflow: hidden !important;}
    .dp_cards .card > .time_schedule > p { width:calc( 100% / 7 - 5px );padding:10px;box-sizing: border-box; }
    .dp_cards .card > .time_schedule > p > i { display:inline-block;width:32px;margin-bottom:0px;margin-right:10px;vertical-align: bottom; }
    .dp_cards .card > .time_schedule > p > span { display:inline-block;text-align: left;min-height:28px;padding:2px 0px;vertical-align: bottom; }


    .dp_cards .dots { bottom:56px; }
    .dp_cards .dots > ul.slick-dots > li { background-color: var(--color-whf); }
    .dp_cards .dots > ul.slick-dots > li.slick-active { background-color: var(--color-sub);opacity: 1; }
    .footer_btns {  display: none; }
}