@charset "utf-8";

body { overflow-y:scroll; -webkit-overflow-scrolling: touch; }

/* ==============================
 * common - 컨텐츠 공통
 * ============================== */
html {  
	/* html 폰트사이즈 수정시 전체 사이즈 변경가능 100% = 16px, 75% = 12px, 62.5% = 10px, 50% = 8px, 6.25% = 1px */
	font-size: 62.5%; 
	font-family: 'SpoqaHanSansNeo', sans-serif;
	/* veiwport에 따라 사이즈 변동됨. 디자인에 딱 맞추기 어려우므로 빼도됨 */
	/*font-size: calc(0.35vw + 8.74px);*/
}
/* 기본폰트사이즈 */	
body { font-size: 1.8rem; }

body.scrollLock { overflow:hidden; }
.hidden { position:absolute; top:0; left:0; font-size:0;}
 *{outline: 0; outline-color: transparent;}
 /* 글자 줄바꿈  */
.txtWS {white-space:pre-wrap;}

/* 글자 색상 */
.txtRed1 { color:#f4516c !important;}
.txtRed2 { color:#fd2d2d !important;}
.txtRed3 { color:#ff246f !important;}
.txtBlue1 { color:#0c91e5 !important;}
.txtBlue2 { color:#2382d3 !important;}
.txtBlue3 { color:#28aedb !important;}
.txtBlue4 { color:#85c8f2 !important;}
.txtBlue5 { color:#3d5199 !important;}
.txtBlue6 { color:#6075FF !important;}
.txtGreen1 { color:#06a2b4 !important;}
.txtBlack { color:#000 !important;}
.txtBlack1 { color:#333 !important;}
.txtBlack2 { color:#666 !important;}
.txtBlack3 { color:#999 !important;}
.txtBlack4 { color:#9ea3aa !important;}
.txtGray1 { color:#f5f6f8 !important;}
.txtGray2 { color:#cccccc !important;}
.txtGray3 { color:#dbdbdb !important;}
.txtWhite { color:#fff !important;}
.pointColor1 {color:#0141A2 !important;}
.pointColor2 {color:#0072E3 !important;}
.pointColor3 {color:#7EBFFF !important;}
.pointColor4 {color:#2873e3 !important;}

/* 폰트크기 */
.f0 {font-size: 0rem !important;}
.f8 {font-size: 0.8rem !important;}
.f9 {font-size: 0.9rem !important;}
.f10 {font-size: 1rem !important;}
.f11 {font-size: 1.1rem !important;}
.f12 {font-size: 1.2rem !important;}
.f13 {font-size: 1.3rem !important;}
.f14 {font-size: 1.4rem !important;}
.f15 {font-size: 1.5rem !important;}
.f16 {font-size: 1.6rem !important;} 
.f17 {font-size: 1.7rem !important;}
.f18 {font-size: 1.8rem !important;}
.f19 {font-size: 1.9rem !important;}
.f20 {font-size: 2rem !important;}
.f21 {font-size: 2.1rem !important;}
.f22 {font-size: 2.2rem !important;}
.f23 {font-size: 2.3rem !important;}
.f24 {font-size: 2.4rem !important;}
.f25 {font-size: 2.5rem !important;}
.f26 {font-size: 2.6rem !important;}
.f27 {font-size: 2.7rem !important;}
.f28 {font-size: 2.8rem !important;}
.f29 {font-size: 2.9rem !important;}
.f30 {font-size: 3rem !important;}
.f32 {font-size: 3.2rem !important;}
.f36 {font-size: 3.6rem !important;}
.f40 {font-size: 4rem !important;}

/* 정렬 */
.txtCenter { text-align:center !important;}
.txtRight { text-align:right !important;}
.txtLeft { text-align:left !important;}

.txtNormal { font-weight:normal !important;}
.txtBold { font-weight:bold !important;}
.txtExBold {  font-weight:800 !important;}

.fll {float: left;}
.flr {float: right;}
.clear {clear: both}

/* 테이블 용을 바꾸기 */
.disTb { display:table !important;}
.disTbC { display:table-cell !important;}

/* 글자 자르기 */
.txtCut { overflow:hidden; display:block; white-space: nowrap;text-overflow: ellipsis;}
.txtKeepall{word-break: keep-all;}
.txtUnderline {text-decoration: underline !important;}

.lh12{line-height:1.2}
.lh14{line-height:1.4}

.lp14 {letter-spacing: -0.14rem;}

.valingT {vertical-align: top;}
.valingM {vertical-align: middle;}
.valingB {vertical-align: bottom;}

.dpib {display:inline-block;}
.dpb {display:block;}
.dpN {display: none;}
.dpNone {display: none !important;}
.txtBInb {display:block;}

.disappear {display: none; transition: all .3s ease;}
.dpNone.appear,
.appear {display:block !important; transition: all .3s ease;}

.borderR {border-radius: 4px;}
.noneCursor,
a.noneCursor {cursor: unset;}

.jcontLeft {justify-content: left;}

/* 혹시 몰라 넣어놓는 간격들 */
.mt0 { margin-top:0px !important;}
.mt2 { margin-top:2px !important;}
.mt4 { margin-top:4px !important;}
.mt5 { margin-top:5px !important;}
.mt6 { margin-top:6px !important;}
.mt8 { margin-top:8px !important;}
.mt10 { margin-top:10px !important;}
.mt12 { margin-top:12px !important;}
.mt15 { margin-top:15px !important;}
.mt16 { margin-top:16px !important;}
.mt20 { margin-top:20px !important;}
.mt24 { margin-top:24px !important;}
.mt25 { margin-top:25px !important;}
.mt26 { margin-top:26px !important;}
.mt30 { margin-top:30px !important;}
.mt32 { margin-top:32px !important;}
.mt35 { margin-top:35px !important;}
.mt36 { margin-top:36px !important;}
.mt40 { margin-top:40px !important;}
.mt42 { margin-top:42px !important;}
.mt45 { margin-top:45px !important;}
.mt50 { margin-top:50px !important;}
.mt55 { margin-top:55px !important;}
.mt60 { margin-top:60px !important;}
.mt64 { margin-top:64px !important;}
.mt65 { margin-top:65px !important;}
.mt70 { margin-top:70px !important;}
.mt75 { margin-top:75px !important;}
.mt80 { margin-top:80px !important;}
.mt100 { margin-top:100px !important;}
.mt120 { margin-top:120px !important;}
.mb0 { margin-bottom:0px !important;}
.mb5 { margin-bottom:5px !important;}
.mb8 { margin-bottom:8px !important;}
.mb10 { margin-bottom:10px !important;}
.mb14 { margin-bottom:14px !important;}
.mb15 { margin-bottom:15px !important;}
.mb16 { margin-bottom:16px !important;}
.mb20 { margin-bottom:20px !important;}
.mb24 { margin-bottom:24px !important;}
.mb25 { margin-bottom:25px !important;}
.mb30 { margin-bottom:30px !important;}
.mb35 { margin-bottom:35px !important;}
.mb36 { margin-bottom:36px !important;}
.mb40 { margin-bottom:40px !important;}
.mb45 { margin-bottom:45px !important;}
.mb50 { margin-bottom:50px !important;}
.mb55 { margin-bottom:55px !important;}
.mb60 { margin-bottom:60px !important;}
.mb65 { margin-bottom:65px !important;}
.mb70 { margin-bottom:70px !important;}
.mb75 { margin-bottom:75px !important;}
.mb80 { margin-bottom:80px !important;}
.ml0 { margin-left:0px !important;}
.ml5 { margin-left:5px !important;}
.ml8 { margin-left:8px !important;}
.ml10 { margin-left:10px !important;}
.ml15 { margin-left:15px !important;}
.ml20 { margin-left:20px !important;}
.ml25 { margin-left:25px !important;}
.ml30 { margin-left:30px !important;}
.ml35 { margin-left:35px !important;}
.ml40 { margin-left:40px !important;}
.ml45 { margin-left:45px !important;}
.ml50 { margin-left:50px !important;}
.ml55 { margin-left:55px !important;}
.ml60 { margin-left:60px !important;}
.ml65 { margin-left:65px !important;}
.ml70 { margin-left:70px !important;}
.ml75 { margin-left:75px !important;}
.ml80 { margin-left:80px !important;}
.mr0 { margin-right:0px !important;}
.mr5 { margin-right:5px !important;}
.mr8 { margin-right:8px !important;}
.mr10 { margin-right:10px !important;}
.mr15 { margin-right:15px !important;}
.mr20 { margin-right:20px !important;}
.mr25 { margin-right:25px !important;}
.mr30 { margin-right:30px !important;}
.mr35 { margin-right:35px !important;}
.mr40 { margin-right:40px !important;}
.mr45 { margin-right:45px !important;}
.mr50 { margin-right:50px !important;}
.mr55 { margin-right:55px !important;}
.mr60 { margin-right:60px !important;}
.mr65 { margin-right:65px !important;}
.mr70 { margin-right:70px !important;}
.mr75 { margin-right:75px !important;}
.mr80 { margin-right:80px !important;}

.pt0 { padding-top:0px !important;}
.pt5 { padding-top:5px !important;}
.pt8 { padding-top:8px !important;}
.pt10 { padding-top:10px !important;}
.pt11 { padding-top:11px !important;}
.pt12 { padding-top:12px !important;}
.pt15 { padding-top:15px !important;}
.pt16 { padding-top:16px !important;}
.pt20 { padding-top:20px !important;}
.pt24 { padding-top:24px !important;}
.pt25 { padding-top:25px !important;}
.pt30 { padding-top:30px !important;}
.pt35 { padding-top:35px !important;}
.pt40 { padding-top:40px !important;}
.pt45 { padding-top:45px !important;}
.pt50 { padding-top:50px !important;}
.pt55 { padding-top:55px !important;}
.pt60 { padding-top:60px !important;}
.pt64 { padding-top:64px !important;}
.pt65 { padding-top:65px !important;}
.pt70 { padding-top:70px !important;}
.pt75 { padding-top:75px !important;}
.pt80 { padding-top:80px !important;}
.pb0 { padding-bottom:0px !important;}
.pb5 { padding-bottom:5px !important;}
.pb10 { padding-bottom:10px !important;}
.pb15 { padding-bottom:15px !important;}
.pb20 { padding-bottom:24px !important;}
.pb24 { padding-bottom:20px !important;}
.pb25 { padding-bottom:25px !important;}
.pb30 { padding-bottom:30px !important;}
.pb35 { padding-bottom:35px !important;}
.pb40 { padding-bottom:40px !important;}
.pb45 { padding-bottom:45px !important;}
.pb50 { padding-bottom:50px !important;}
.pb55 { padding-bottom:55px !important;}
.pb60 { padding-bottom:60px !important;}
.pb64 { padding-bottom:64px !important;}
.pb65 { padding-bottom:65px !important;}
.pb70 { padding-bottom:70px !important;}
.pb75 { padding-bottom:75px !important;}
.pb80 { padding-bottom:80px !important;}
.pb90 { padding-bottom:90px !important;}
.pb100 { padding-bottom:100px !important;}
.pb120 { padding-bottom:120px !important;}
.pl0 { padding-left:0px !important;}
.pl5 { padding-left:5px !important;}
.pl10 { padding-left:10px !important;}
.pl15 { padding-left:15px !important;}
.pl20 { padding-left:20px !important;}
.pl22 { padding-left:22px !important;}
.pl24 { padding-left:24px !important;}
.pl25 { padding-left:25px !important;}
.pl30 { padding-left:30px !important;}
.pl32 { padding-left:32px !important;}
.pl35 { padding-left:35px !important;}
.pl40 { padding-left:40px !important;}
.pl45 { padding-left:45px !important;}
.pl50 { padding-left:50px !important;}
.pl55 { padding-left:55px !important;}
.pl60 { padding-left:60px !important;}
.pl65 { padding-left:65px !important;}
.pl70 { padding-left:70px !important;}
.pl75 { padding-left:75px !important;}
.pl80 { padding-left:80px !important;}
.pr0 { padding-right:0px !important;}
.pr4 { padding-right:4px !important;}
.pr5 { padding-right:5px !important;}
.pr8 { padding-right:8px !important;}
.pr10 { padding-right:10px !important;}
.pr15 { padding-right:15px !important;}
.pr16 { padding-right:16px !important;}
.pr20 { padding-right:20px !important;}
.pr25 { padding-right:25px !important;}
.pr30 { padding-right:30px !important;}
.pr32 { padding-right:32px !important;}
.pr35 { padding-right:35px !important;}
.pr40 { padding-right:40px !important;}
.pr45 { padding-right:45px !important;}
.pr50 { padding-right:50px !important;}
.pr55 { padding-right:55px !important;}
.pr60 { padding-right:60px !important;}
.pr65 { padding-right:65px !important;}
.pr70 { padding-right:70px !important;}
.pr75 { padding-right:75px !important;}
.pr80 { padding-right:80px !important;}
 
.p20 {padding: 20px !important;}
.p24 {padding: 24px;}
.p25 {padding: 25px;}
.p2025 {padding: 20px 25px;}

.w100 {width: 100%;}
.w50 {width: 50%;}

/* 서비스 점검 안내 */
.serviceNotice {width: 100%; display: inline-block; padding: 40px 24px 50px 24px; box-sizing: border-box;}
.serviceNotice .logo {width: 100%; position: relative;}
.serviceNotice .logo .logoImg {width: 55px; height: 33px; display: block; background:url("../images/logo_box.png") no-repeat; background-size:100%;}
.serviceNotice .innerBox {width: 100%; display: inline-block; text-align: center;}
.serviceNotice .innerBox .iconWrap {width: 100%; position: relative; padding: 55px 0 24px 0; text-align: center;}
.serviceNotice .innerBox .iconWrap .icon {width: 80px; height: 80px; display: block; margin: 0 auto;}
.serviceNotice .innerBox .iconWrap .icon.exclamationFilled {background:url("../images/icon_exclamation_filled.png") no-repeat; background-size:100%;}
.serviceNotice .innerBox .tit {font-size: 2.8rem; color: #101116; font-weight: bold;}
.serviceNotice .innerBox .txt {font-size: 1.6rem; color: #101116; line-height: 2.2rem; word-break: keep-all;}
.serviceNotice .innerBox .subtxt {font-size: 1.4rem; color: #101116; line-height: 2rem; word-break: keep-all;}
.serviceNotice .innerBox .roundBox {width: 100%; display: inline-block; text-align: center; border: none; background-color: #f3f4f7; border-radius: 12px; padding: 34px 20px; box-sizing: border-box;}
.serviceNotice .innerBox .roundBox .tit {font-size: 1.8rem; line-height: 2.4rem; font-weight: normal; word-break: keep-all;}
.serviceNotice .innerBox .roundBox .pointColor {font-size: 1.8rem; color: #2873e3; font-weight: bold; line-height: 2.4rem;}
.serviceNotice .innerBox .roundBox .txt,
.serviceNotice .innerBox .roundBox .subtxt {color: #737684;}
.serviceNotice .innerBox .btn {width: 100%; display: block; font-size: 1.6rem; color: #101116;
	text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
}