@charset "UTF-8";

/***********************************************************************************
 공통사항
************************************************************************************/
.wrap_full { position:relative; width:100%; max-width:600px; margin:0 auto; } 
.wrap_center { position:relative; width:93%; max-width:600px; margin:0 auto; } 
.wrap_center::after { content:''; display:block; clear:both; } 

.container { position:relative; width:100%; min-width:320px; max-width:600px; margin:0 auto; } 
.contents { padding-top:3em; } 
.sub_wrap .contents { min-height:40vh; } 
.flex { display:flex; } 
.not_scroll { position:fixed; overflow:hidden; overscroll-behavior:none; width:100%; height:100%; min-height:100vh !important; touch-action:none !important; } 
.not_scroll .container,
.not_scroll .sub_wrap { position:relative; top:0; } 

/***********************************************************************************
 color
************************************************************************************/
.color01 { color:#0b59b7 !important; } /* blue */
.color02 { color:#272625 !important; } /* black */
.color03 { color:#f1404b !important; } /* red */
.color04 { color:#5e5e5f !important; } /* grey01 */
.color05 { color:#b0b0b0 !important; } /* grey02 */

/***********************************************************************************
 버튼
************************************************************************************/
.btn { display:inline-block; position:relative; padding:1em; border:1px solid #bac2c6; background:#fff; letter-spacing:-0.01em; } 
.btn_s { background:#0b59b7; border:0; color:#fff; } 
.btn_l { background:#e5e8ed; border:0; color:#121212; } 
.btn_b { background:#5e5e5f; border:0; color:#fff; } 
.btn_c { background:#f1404b; border:0; color:#fff; } /*삭제*/
.btn_add { padding:.5em 1em; } 
.btn_add::before { content:'\2b'; display:inline-block; position:relative; top:-3px; margin-right:5px; font-size:1.5em; vertical-align:middle; } 
.btn_d { padding:.5em 1em; background:#fff; border-color:#f1404b; color:#f1404b; } /*삭제(아이콘)*/
.btn_d::before { content:''; display:inline-block; position:relative; top:-1px; margin-right:5px; width:7px; height:2px; background:#f1404b; color:#f1404b; vertical-align:middle; } /*삭제(아이콘)*/
.btn01 { background:#fff; border-color:#f1404b; color:#f1404b; } /*취소*/
.btn02 { background:#fff; border-color:#0b59b7; color:#0b59b7; } /*확인, 링크*/

.btn_download { border-color:#0b59b7; color:#0b59b7; font-weight:500; } 
.btn_download::before { content:'\f33d'; display:inline-block; margin-right:5px; color:#0b59b7; } 

/* btngroup */
.btngroup { margin:20px auto 0; } 
.btngroup.full button { width:100%; } 
.btngroup::after { content:''; display:block; clear:both; } 
.btngroup01 button { margin:0 auto; } 
.btngroup02 { display:flex; width:100%; } 
.btngroup02 button { flex:1; padding:15px 0; } 
.btngroup02 button:first-child { float:right; } 

/***********************************************************************************
 tab
************************************************************************************/
.tab_wrap { position: relative; margin:auto; } 
.tab_wrap .tab_cont { width:100%; } 

.tab_wrap .tab_li ul { display:flex; } 
.tab_wrap .tab_li li { position:relative; margin:0 2%; text-align:center; } 
.tab_wrap .tab_li li:first-child { margin-left:0; } 
.tab_wrap .tab_li li a { display:block; width:100%; padding-bottom:10%; height:100%; font-size:1.125em; font-weight:500; color:#aaaaa9; letter-spacing:-0.02em; } 

.tab_wrap01 .tab_li li.active a { position:relative; color:#272625; font-weight:600; } 
.tab_wrap01 .tab_li li.active a::after { content:''; position:absolute; bottom:0; left:0; width:100%; height:2px; background:#0b59b7; z-index:3; } 

.tab_wrap02 .tab_li li { width:50%; margin:0; } 
.tab_wrap02 .tab_li li a { height:50px; line-height:50px; padding-bottom:0; background:#e5e8ed; color:#5e5e5f; } 
.tab_wrap02 .tab_li li.active a { border-top:1px solid #0b59b7; border-left:1px solid #0b59b7; border-right:1px solid #0b59b7; background:#fff; color:#0b59b7; } 
.tab_wrap02 .tab_li li.active a::after { content:none; } 

/***********************************************************************************
 테이블
************************************************************************************/
table { position:relative; table-layout:fixed; line-height:1.4; } 
table th,
table td { padding:8px 6px; border:1px solid #e5e5e5; text-align:center; vertical-align:middle; } 
table thead { background:#f2f3f6; } 
table thead th { vertical-align:middle; } 

table.t_left { text-align:left; } 
table.t_center { text-align:center; } 
table .division { width:10%; } 
table .subject { width:15%; } 
table caption { text-align:left; margin-bottom:7px; font-weight:500; color:#272625; } 
table .tw_s { width:30%; } 
table .tw_m { width:35%; } 

table.nomal tbody th { background:#f2f3f6; }

.table_wrap { position:relative; } 
.table_wrap.scroll { overflow:auto; } 
.table_wrap.scroll table { max-width:100%; overflow:auto; white-space:nowrap; vertical-align:top; } 

.table_wrap.time { overflow:hidden; overflow-x:auto; border:1px solid #d4d4dc; } 
.table_wrap.time table { width:auto; overscroll-behavior: contain;}
.table_wrap.time th,
.table_wrap.time td { padding:10px; border-style:solid; border-width:0 1px 1px 0; } 
.table_wrap.time th { background:#f5f7fa; border-color:#d4d4dc; }
.table_wrap.time td { min-width:137px; border-color:#f0edf0; font-size:.95em; }
.table_wrap.time td.record { background:#f4f5f9; }
.table_wrap.time tr.lunch { background:url(/assets/mobile/img/border_1.png); }
.table_wrap.time tr:last-child td { border-bottom:none; } 
.table_wrap.time th.sticky,
.table_wrap.time td.sticky { position:sticky; left:0; border:0; background:#f5f7fa; } 
.table_wrap.time td.sticky { min-width:auto; max-width:70px; white-space:normal; font-size:.93em; font-weight:400; }
.table_wrap.time td.sticky span { display:block; margin-top:3px; font-size:.9em; }
.table_wrap.time th.sticky::after,
.table_wrap.time td.sticky::after { content:''; position: absolute; right:0; top:0; bottom:0; width:1px; height:100%; background:#d4d4dc; box-shadow: 2px 0px 5.22px 0.78px rgba(117, 117, 117, 0.16); } 
.table_wrap.time th.sticky::before,
.table_wrap.time td.sticky::before { content:''; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#d4d4dc; }

/***********************************************************************************
 팝업
************************************************************************************/
.popup_wrap { position:fixed; top:0; left:0; bottom:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.8); z-index: -1; opacity:0; transition:all 0.2s; } 
.popup_wrap.active { opacity:1; z-index:99999; } 
.popup { position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); width:90%; height:auto; max-width:600px; min-width:320px; background:#fff; animation:popup .3s linear forwards; } 
.popup .btngroup { margin:0 auto; font-size:1em; } 

.popup_cont { position:relative; } 
.popup_cont .title { position:relative; } 
.popup_cont .title span { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:60px; height:60px; border-radius:50%; box-shadow: 2px 3px 10px 0px rgba(53, 83, 203, 0.13); } 
.popup_cont .title01 span { background:url(/assets/mobile/img/popup_icon01.png) center no-repeat,linear-gradient(135deg, #8cb7fb, #2c66c0); text-indent:-9999px; } 
.popup_cont .title02 span { background:url(/assets/mobile/img/popup_icon02.png) center no-repeat,linear-gradient(135deg, #8cb7fb, #2c66c0); text-indent:-9999px; } 
.popup_cont .title span::before,
.popup_cont .title span::after { content:''; position:absolute; background:linear-gradient(135deg, #8cb7fb, #2c66c0); border-radius:50%; } 
.popup_cont .title span::before { top:0; right:-10px; width:10px; height:10px; } 
.popup_cont .title span::after { top:-9px; right:5px; width:5px; height:5px; } 
.popup_cont .cont { padding:60px 0 40px; width:95%; margin:0 auto; text-align:center; } 
.popup .btn_s { width:100%; padding:15px 0; background:#0b59b7; border:0; border-radius:0; font-size:1.1em; color:#fff; } 

 @-webkit-keyframes popup { 
 0% { -webkit-transform:translate(-50%,-30%); } 
 100% { -webkit-transform:translate(-50%,-50%); } 
 }
 @keyframes popup { 
 0% { transform:translate(-50%,-30%); } 
 100% { transform:translate(-50%,-50%); } 
 }

/***********************************************************************************
 서브 헤드
************************************************************************************/
.sub_head { position:relative; width:100%; max-width:600px; min-width:320px; margin:0 auto; padding:1em 0; text-align:center; background:#0b59b7; } 
.sub_head .btn_prev { position:absolute; left:0; top:50%; transform:translateY(-50%); width:30px; height:30px; background:url(/assets/mobile/img/btn_prev_w.png) center no-repeat; text-indent:-9999px; } 
.sub_head .btn_refresh { position:absolute; right:0; top:50%; transform:translateY(-50%); color:rgba(255, 255, 255, 0.93); background:none; } 
.sub_head .btn_refresh::before { content:''; position:absolute; left:-15px; top:50%; transform:translateY(-50%); width:12px; height:28px; margin-right:5px; background:url(/assets/mobile/img/icon_refresh.svg) center no-repeat; } 
.sub_head h3 { display:inline-block; color:#fff; font-size:1.35em; } 

/***********************************************************************************
 텍스트
************************************************************************************/
.txt_wrap { margin-bottom:1.6em; } 

.tip_wrap { position:relative; } 
.tip_wrap ul li { position:relative; margin-bottom:5px; word-break:keep-all; letter-spacing:-0.012em; } 
.tip_wrap ul li:last-child { margin-bottom:0; } 
.tip_wrap.gray02 { padding:15px; background:#f2f4f6; } 
.tip_wrap.gray02 strong { display:block; color:#272625; font-weight:500; } 

.tip_wrap01 { padding:15px; border:1px solid #0b59b7; border-radius:5px; box-shadow: 0px 0px 4.15px 0.85px rgba(85, 145, 240, 0.1); } 
.tip_wrap01 .tit { margin-bottom:8px; } 
.tip_wrap01 .tit span { font-weight:500; font-size:1.1em; letter-spacing:-0.02em; } 
.tip_wrap01 strong { margin-bottom:7px; font-weight:500; font-size:1.08em; color:#272625; letter-spacing:-0.01em; } 
.tip_wrap01 ul li::before { content:''; display:inline-block; position:relative; top:-2px; margin-right:3px; width:3px; height:3px; background:#8d96a4; vertical-align:middle; } 
.tip_wrap01 ul li strong { color:#0b59b7; font-weight:500; } 
.tip_wrap01.gray { border-color:#e5e5e5; box-shadow:none; } 
.tip_wrap01.gray ul li { color:#94959b; } 

.tip_wrap02 h4 { border-bottom:1px solid #cacaca; padding-bottom:5px; color:#22bd9b; font-weight:500; font-size:1.2em; letter-spacing:-0.02em; } 
.tip_wrap02 h4::before { content:''; display:inline-block; position:relative; top:5px; margin-right:5px; width:19px; height:19px; background:url(/assets/mobile/img/tip_wrap02.png) no-repeat; } 
.tip_wrap02 ul { margin-top:10px; } 

.tip_wrap03 { padding:15px; border:1px solid #e2e5ea; border-radius:10px; box-shadow: 0px 5px 5px 0px rgba(117, 117, 117, 0.08); } 
.tip_wrap03 ul li { position:relative; } 
.tip_wrap03 ul li::before { content:'-'; display:inline-block; padding-right:3px; color:#b0b0b0; } 

.alert_txt { display:block; margin-top:4px; } 
.alert_txt.s { font-size:.85em; } 
.alert_txt.m { font-size:.95em; } 
.alert_txt01 { color:#3a9ad9; } 
.alert_txt02 { color:#f1404b; } 
.alert_txt03 { color:#b0b0b0; } 

.alert_txt01::before,
.alert_txt02::before,
.alert_txt03::before { content:''; display:inline-block; position:relative; margin-right:3px; vertical-align:middle; } 
.alert_txt01::before { width:16px; height:16px; background:url(/assets/mobile/img/common.png) no-repeat; background-position:-101px -4px; } 
.alert_txt02::before { content:'\f071'; top:-1px; font-weight:500; font-size:1.25em; } 

.tit_h2 { margin-bottom:2.5em; } 
.tit_h2 h2 { margin-bottom:7px; line-height:1.3; color:#272625; font-size:2.2em; letter-spacing:-0.015em; font-weight:600; font-family:'N-Gothic'; } 
.tit_h2 p.sub_txt { font-size:1.067em; } 

.general .title { margin-bottom:2em; }
.general .tit_h2 { margin-bottom:1em; }
.general .tit_h2 h2 { font-size:1.9em; }

.tit_h3 { width:100%; margin-bottom:8px; } 
.tit_h3 h3 { font-size:1.5em; font-weight:500; letter-spacing:-0.02em; } 
.tit_h3 h3::before { content:''; display:inline-block; position:relative; top:-1px; margin-right:5px; width:14px; height:17px; background:url(/assets/mobile/img/h3_bullet.png) no-repeat; vertical-align:middle; } 
.tit_h3.s h3 { font-size:1.3em; }

.tit_h5 { width:100%; padding:10px; margin-bottom:10px; background:#f2f3f6; } 
.tit_h5.line { background:#e5e8ed; border-bottom:1px dashed #DEE3EA; } 
.tit_h5 h5 { font-size:1.15em; font-weight:500; letter-spacing:-0.015em; color:#282839; } 
.tit_h5 > .sub_txt { display:block; font-size:.85em; color:#5e5e5f; } 

.txt_wrap .li_num { counter-reset:list-number; } 
.txt_wrap .li_num > li { counter-increment:list-number; padding-bottom:7px; } 
.txt_wrap .li_num > li::before { content:counter(list-number); display:inline-block; position:relative; top:-1px; margin-right:5px; text-align:center; width:18px; height:18px; line-height:18px; border-radius:50%; font-size:.9em; vertical-align:text-top; } 
.txt_wrap .li_num.num01 > li::before { background:#0b59b7; color:#fff; }
.txt_wrap .li_num.num02 > li::before { background:#e1e8f0; }

.txt_wrap span.num { display:inline-block; position:relative; top:-1px; margin-right:5px; text-align:center; width:18px; height:18px; line-height:18px; border-radius:50%; font-size:.9em; vertical-align:text-top; color:#fff; }
.txt_wrap span.num01 { background:#0b59b7; }

/***********************************************************************************
 mediaquery
************************************************************************************/
@media screen and ( max-width :400px ) { table { table-layout:inherit; } 
 .popup_cont .cont { padding:50px 15px 30px; } 
 }