@charset "utf-8";

/* CSS Document */ 
/* ==================================================
	웹 폰트
================================================== */
/* @import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700'); */
@import url('//fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');
@import url('//fonts.googleapis.com/earlyaccess/nanumgothic.css');
@import url('//fonts.googleapis.com/earlyaccess/nanummyeongjo.css');
@import url('https://cdn.jsdelivr.net/gh/moonspam/NanumBarunGothic@latest/nanumbarungothicsubset.css');

/*
#popup{display:none;position:fixed; top:0; left:0;width:100%; height:100%;background:rgba(0,0,0,.5);z-index:1000;}
.popup {position:initial; width:auto !important; height:auto !important; background:none; }
*/
.poppins{font-family: 'Poppins','Noto Sans KR', sans-serif;}
.tips {font-size: 1.2rem; color: #92989c; letter-spacing: -.1px;}
/* ==================================================
	공통레이아웃
================================================== */
#footer {width:100%;}
.size {width:100%; max-width:1200px; height:auto; margin:0 auto;}
.inner  {width:100%; box-sizing:border-box;}
.wrapper {position:relative; width:100%; max-width:1800px; margin:0 auto; min-height:1250px;  box-sizing:border-box; padding:20px 0;}
.wrapper2 {position:relative; width:100%; box-sizing:border-box;}
.wrapper2 #footer .inner {padding: 16px 40px;}
.wrapBox {position:relative; box-sizing:Border-box;border-radius:40px; box-shadow: 7px 8px 53.1px 5.9px rgba(121, 150, 183, 0.16);overflow:hidden;}
.wrapBoxd {position:relative; box-sizing:Border-box;border-radius:40px; box-shadow: 7px 8px 53.1px 5.9px rgba(121, 150, 183, 0.16);overflow:hidden;}
/* ==================================================
	header
================================================== */
#header{position:absolute; width:296px; height:100%; min-height:1000px; z-index:200;}
#header .inner{height:100%;}
#header > .inner { background-color:#181a29;}
#header .top{position:absolute; left:0; top:0; width:100%; padding:60px 19px 40px; text-align:center; box-sizing:border-box; z-index:50;}

#header .top .profile{position:relative; margin-top:40px;}
#header .top .profile a{display:block;}
#header .top .profile .img{float:left; width:35%; text-align:right;}
#header .top .profile .img .img{max-width:57px; border-radius:50%;}
#header .top .profile .txt{position:absolute; left:35%; width:57%; height:100%; padding-left:10px; text-align:left; box-sizing:border-box;}
#header .top .profile .txt em{display:block; font-size:1.6rem; font-weight:500; color:#fff; line-height:1;}
#header .top .profile .txt p{font-size:13px; color:#858585; line-height:1.2; margin-top:3px;}
#header .top .profile .corp {display: block; line-height: 1; margin-top: 6px; font-size: 12px; font-weight: 500; color: #47de8b;}
#header .top .profile .corp_btn {display: inline-block; padding: 0 7px; height: 23px; line-height: 23px; font-size: 12px; font-weight: 500; color: #2fc673; border-radius: 5px; background: #1f4e3f; box-sizing: border-box;}


#header .top .btn_sign{display:block; margin-top:20px; height:60px; line-height:60px; font-size:1.6rem; font-weight:700; color:#fff; border-radius:10px; background: linear-gradient( to bottom, rgb(57,95,249) 20%, rgb(12,59,248) 100%); box-shadow: 0px 5px 10px 0px rgba(140, 140, 140, 0.22);}
#header .top .payList{margin-top:10px;}
#header .top .payList ul.pay_ver_2{width:103%; margin-left:-3%;}
#header .top .payList ul.pay_ver_2 li{float:left; width:47%; margin-left:3%;}
#header .top .payList ul li a{display:block; height:80px; border-radius:10px; background-color:#e1e9ee;}
#header .top .payList ul li em{display:block; font-size:1.4rem; font-weight:700; line-height:1;}
#header .top .payList ul li p{font-size:1.4rem; font-weight:300; line-height:1.2; margin-top:5px;font-size:0;}
#header .top .payList ul li p b{font-size:1.8rem; font-weight:900;display:inline-block;vertical-align:middle}
#header .top .payList ul li p span{padding:0 3px;font-size:1.4rem;box-sizing:border-box;display:inline-block;vertical-align:middle}

#header .mid{height:100%; padding-top:410px; box-sizing:border-box;}
#header .mid .inner{height:100%; background-color:#fff; border-radius:0 100px 0 0; }
/* depth1 */
#header .gnb .num{display:inline-block; width:17px; height:17px; line-height:17px; background-color:#2fc673; border-radius:50%; font-size:11px; font-weight:700; color:#fff; text-align:center; vertical-align:top; text-indent:-1px;}
#header .gnb a {position: relative; display:block; line-height: 1; box-sizing: border-box;}
#header .gnb > ul {padding:40px 40px 50px;}
#header .gnb > ul > li > a{padding:15px 0; padding-left: 30px; font-weight:700; color:#808087; line-height:1;font-size:0;}
#header .gnb > ul > li > a .img{position: absolute; top: 50%; left: 0; display:inline-block; text-align: center; width:18px; font-size: 0; vertical-align:middle; transform: translateY(-50%);}
#header .gnb > ul > li > a .img img {display: inline-block;}
#header .gnb > ul > li > a img.on{display:none;}

#header .gnb > ul > li > a .img.ico_small img{width:14px;}
#header .gnb > ul > li > a .img.ico_mid img{width:16px;}
#header .gnb > ul > li > a .img.ico_big img{width:18px;}

#header .gnb > ul > li > a span{display:inline-block;vertical-align:middle;font-size:1.8rem; }
#header .gnb > ul > li.active > a{color:#0d0d12;}
#header .gnb > ul > li.active > a img{display:none;}
#header .gnb > ul > li.active > a img.on{display:inline-block;}
/* depth2 */
#header .gnb > ul > li > ul{display:none; margin-top:10px; padding:20px 0; border-top:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf;}
#header .gnb > ul > li > ul > li{padding-top:20px;}
#header .gnb > ul > li > ul > li:first-of-type{padding-top:0;}
#header .gnb > ul > li > ul > li > a{ font-size:1.7rem; font-weight:700; color:#4468f9;}
/* depth3 */
#header .gnb > ul > li > ul > li > ul{padding: 8px 0 8px 12px;}
#header .gnb > ul > li > ul > li > ul > li > a{position:relative; display:block; padding:7px 0; padding-left:9px; font-size:1.5rem; font-weight:500;}
#header .gnb > ul > li > ul > li > ul > li > a:before{content:""; display:block; position:absolute; left:0; top:50%; margin-top:-2px; width:3px; height:3px; border-radius:50%; background-color:#111;}
#header .gnb > ul > li > ul > li > ul > li.active > a{font-weight:700; color:#0d0d12;}
#header .gnb > ul > li > ul > li > ul > li.active > a:before{background-color:#0d0d12;}
#header .gnb > ul > li > ul > li > ul > li:last-child .depth4 {padding: 0;}

/* depth4 */
#header .gnb .depth4 {padding-bottom: 10px; box-sizing: border-box;}
#header .gnb .depth4 > li > a {position:relative; padding: 5px 0; padding-left: 23px; font-size: 1.4rem; color: #777;}
#header .gnb .depth4 > li > a:before {content: ''; position: absolute; top: 50%; left: 15px; display: block; width: 4px; height: 1px; background: #777;}

#header .login_box {text-align: center;}
#header .login_box a {position: relative; display: inline-block; padding: 5px 10px;  line-height: 1; font-size: 1.4rem; font-weight: 900; box-sizing: border-box;}
#header .login_box a:before {content: ''; position: absolute; top: 0; right: 0; display: block; width: 6px; height: 6px; border-radius: 6px; background: #3ddc85;}

/* 22-04-11 추가 - 폴더 아이콘 */
#header .gnb > ul > li > ul > li.dirList > ul > li {position: relative;}
#header .gnb > ul > li > ul > li.dirList > ul > li > a {padding-left: 23px; }
#header .gnb > ul > li > ul > li.dirList > ul > li > ul ~ i {position: absolute; top: 10px; left: -15px; font-size: 6px; color: #ccc; cursor: pointer; width: 15px; height: 15px;}
#header .gnb > ul > li > ul > li.dirList > ul > li > ul ~ i.close {background: url('/resource/image/dir_close.png'); background-size: 8px; background-repeat: no-repeat;}
#header .gnb > ul > li > ul > li.dirList > ul > li > ul ~ i.open {background: url('/resource/image/dir_open.png'); background-size: 8px; background-repeat: no-repeat;}

#header .gnb > ul > li > ul > li.dirList > ul > li > a:after {content: ''; position: absolute; top: 50%; left: 0; display: block; margin-top: -8px; width: 18px; height: 18px; background-image: url('/resource/image/ico_folder5.svg'); background-repeat: no-repeat; background-position: 50% 50%; background-size: 100% auto;}

#header .gnb > ul > li > ul > li.dirList > ul > li > ul {display: none;}
#header .gnb > ul > li > ul > li.dirList > ul > li > ul > li > a {padding: 7px; padding-left: 43px; font-weight: 500;}
#header .gnb > ul > li > ul > li.dirList > ul > li > ul > li > a:before {display: none;}
#header .gnb > ul > li > ul > li.dirList > ul > li > ul > li > a:after {content: ''; position: absolute; top: 50%; left: 20px; display: block; margin-top: -8px; width: 18px; height: 18px; background-image: url('/resource/image/ico_folder5.svg'); background-repeat: no-repeat; background-position: 50% 50%; background-size: 100% auto;}


/* ==================================================
	footer
================================================== */
#footer .inner{padding:16px 60px;}
#footer .left{float:left;}
#footer .left > a{float:left; display:block; padding:0 10px; height:28px; line-height:28px; background-color:#8a99a4; border-radius:5px; font-size:12px; color:#fff;}
#footer .left ul{float:left; margin-left:13px; line-height:28px;}
#footer .left ul li{position:relative; float:left; margin-left:8px; padding-left:9px;}
#footer .left ul li:first-of-type{margin-left:0; padding-left:0;}
#footer .left ul li:before{content:""; display:block; position:absolute; left:0; top:50%; width:1px; height:10px; margin-top:-5px; background-color:#7f7f7f;}
#footer .left ul li:first-of-type:before{display:none;}
#footer .left ul li a{display:block; font-size:12px; color:#7f7f7f;}

#footer .copy{float:right; font-size:12px; color:#7f7f7f; line-height:28px;}



/*colspan*/
.cols {width:100%; position:relative;}
.cols:after {clear:both; content:''; display:block;}
.cols .col-wrap {width: 102%;margin-left: -2%;}
.cols .col {float:left; padding:50px; border-radius:20px; box-shadow:1px 2px 11.83px 1.17px rgb(121 150 183 / 11%); background-color:#fff; box-sizing:border-box; }
.cols .col-1 {width:100%;}
.cols .col-2 {width:48%; margin-left:2%; }
.cols .col-3 {width:31.3333%; margin-left:2%; }
.cols .col-4 {width:23%; margin-left:2%; }
.cols .col-5 {width:18%; margin-left:2%; }
.cols .col > em {display: block;    font-size: 2.2rem;    font-weight: 700;    color: #242940;    line-height: 1;}
.cols .col .box {padding:40px; box-sizing:border-box; border-radius:20px; box-shadow:2px 9px 13px rgba(0,0,0, 9%); background-color:#fff; border:1px solid #eee; position:relative;}

.box_title {letter-spacing: -.1rem;}
.box_title h3 {line-height: 1; font-size: 2rem; font-weight: 700;color:#242940 }
.box_title p {margin-top: 9px; line-height: 1.4; font-size: 1.4rem; color: #555; font-weight: 500;}

/*드롭박스*/
.drp_wrap {position:relative;border:1px solid #e2e7ea;background:#fff; border-radius:10px;box-sizing:border-box; transition: .5s;}
.drp_wrap.disabled {background: #F2F6F9;}
.drp_wrap > a{line-height:48px;position:relative;font-weight:500; border-radius:10px; color:#1560fd;font-size: 1.4rem; padding:0 14px;box-sizing:border-box;display:block;/* font-family: 'Poppins', sans-serif; */}
/* .drp_wrap > a:before{content:''; position:absolute; right:14px; top:50%; margin-top:-3px;width: 0;height: 0;border-style: solid;border-width: 6px 5px 0 5px;border-color: #1560fd transparent transparent transparent;} */
.drp_wrap > a:before{content:''; position:absolute; right:14px; top:50%; margin-top:-3px;  width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 7px solid #1560fd;}
.drp_wrap > ul{display: none; position: absolute; top: 48px; left: -1px; width: 100%; max-height: 205px; border-radius: 0 0 10px 10px; border: 1px solid #e2e7ea; border-top: 0; overflow: hidden; z-index: 5;background: #fff; transition:border-color .4s; -webkit-transition:border-color .4s; -moz-transition:border-color .4s; -o-transition:border-color .4s; overflow: auto;}
.drp_wrap > ul::-webkit-scrollbar {width: 3px; height: 3px;}
.drp_wrap > ul::-webkit-scrollbar-track {background: transparent; border-radius: 3px;}
.drp_wrap > ul::-webkit-scrollbar-thumb {background: #a4aeb4; border-radius: 3px;}
.drp_wrap > ul {scrollbar-face-color: transparent; scrollbar-track-color: transparent; scrollbar-arrow-color: none; scrollbar-highlight-color: transparent; scrollbar-3dlight-color: none; scrollbar-shadow-color: transparent; scrollbar-darkshadow-color: none;}
.drp_wrap > ul li{border-top: 1px solid #e2e7ea;}
.drp_wrap > ul li a{display: block; padding: 0 15px; height: 50px; line-height: 50px; font-size: 1.4rem; color: #929ca1; box-sizing: border-box;}
.drp_wrap.on {border-radius: 10px 10px 0 0; border-color: #1560fd;}
.drp_wrap.on > ul {border-color:#1560fd; z-index:30;}
/* 
.drp_wrap.st2 {border-color:#1560fd;}
.drp_wrap.st2.on > ul {border-color:#1560fd;}
*/



/*tabs*/
.tabs {width:100%;}
.tabs > ul {width:101%; margin-left:-1%; }
.tabs > ul > li {float:left; }
.tabs .tabs-4 li {width:24%; margin-left:1%;}
.tabs .tabs-3 li {width:32.3333%; margin-left:1%;}
.tabs .tabs-2 li {width:49%; margin-left:1%; }
.tabs .tabs-1 li {width:100%; }
.tabs li > a{font-size:1.4rem; color:#929ca1; letter-spacing:-.5px; font-weight:400; box-sizing:border-box; border:1px solid #dce1e4; border-radius:10px; display:block; text-align:center; height:60px; padding:0 10px; line-height:58px; background:#f7f8f9; transition:all .4s; -webkit-transition:all .4s; -moz-transition:all .4s; -o-transition:all .4s;}
.tabs ul li > a.active {border-color:#2168fd; color:#2168fd; font-weight:700; background:#fff; }

/* toggle - 1 */
.toggle input[type=checkbox]{height: 0;	width: 0; visibility: hidden;}
.toggle label {	cursor: pointer; text-indent: -9999px;width: 55px; height: 25px; background: #ddd; display: block; border-radius: 100px; position: relative;}
.toggle label:after {content: '';position: absolute;top: -.5px;left: 0;width: 26.5px;height: 26.5px;background: #fff;border-radius: 26px; box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.38);transition: 0.3s;}
.toggle input:checked + label {background: #1560fd;box-shadow: 2px 1px 7px 0.56px rgba(0, 0, 0, 0.2) inset;}
.toggle input:checked + label:after {left: 102%;transform: translateX(-100%);}

/* toggle - 2 */
.toggle.small label {width: 42px;	height: 20.5px;}
.toggle.small label:after {width: 20.5px; height: 20.5px;}

/* checkbox - 1 */
.chk input[type='checkbox'] {display: inline-block; position: absolute; left: -9999px; opacity: 0; visibility: hidden; width: 1px; height: 1px; filter: alpha(opacity=0); -ms-filter: alpha(opacity=0); overflow: hidden;}
.chk label {display: block; padding-left: 45px; font-size: 1.4rem; color: #929ca1; cursor: pointer; position: relative; height: 48px; line-height: 46px; background-color: #fff; box-sizing: border-box;}
.chk label:before {position: absolute; top: 50%; left: 10px; width: 25px; margin-top: -12.5px; height: 25px; box-sizing: border-box; background-color: #dbdfe2; border-radius: 5px; text-align: center;clear: both; content: ''; display: block; box-shadow: 2px 4px 3.8px 0.2px rgba(0, 0, 0, 0.1) inset;}
.chk input[type='checkbox']:checked + label {color: #155ffb;}
.chk input[type='checkbox']:checked + label:before {content:''; width: 25px; height: 25px; line-height: 25px; background-color: #1560fd; background-image: url('/resource/image/ico_check2.png'); background-repeat: no-repeat; background-position: 50% 50%;}
.chk.layout label {border: 1px solid #e2e7ea; border-radius: 10px;}

/* checkbox - 2 */
.chk_wrap input[type="checkbox"]{display: inline-block; position: absolute; left: -9999px; opacity: 0; visibility: hidden; width: 1px; height: 1px; filter: alpha(opacity=0); -ms-filter: alpha(opacity=0); overflow: hidden;}
.chk_wrap label {display: inline-block; padding-left: 25px; font-size: 1.4rem; font-weight: 500; color: #111; cursor: pointer; position: relative; line-height: 19px;}
.chk_wrap label.no_before {display: inline-block; padding-left: 0px; font-size: 1.4rem; font-weight: 500; color: #111; cursor: auto; position: relative; line-height: 19px;}
.chk_wrap label:before {position: absolute; left: 0; width: 20px; height: 20px; margin-top: -10px; box-sizing: border-box; border: 1px solid #111; border-radius: 3px; line-height: 20px; text-align: center;clear: both; content: ''; display: block;}
.chk_wrap label.no_before:before {content: none;}
.chk_wrap input[type="checkbox"]:checked + label:before {content:''; width: 20px; height: 20px; line-height: 20px; background-color: #111; background-image: url('/resource/image/ico_check.png'); background-repeat: no-repeat; background-position: 50% 50%;}

/* checkbox - 3 */
.chk_wrap.cl_bk label {color: #92989c;}
.chk_wrap.cl_bk label:before {background-color: #dde1e4;border-color: #dde1e4;box-shadow: 3px 2px 3.8px 0.2px rgba(0, 0, 0, 0.1) inset;}
.chk_wrap.cl_bk label.no_before:before {background-color: none;border-color: none;box-shadow: none;}
.chk_wrap.cl_bk input[type="checkbox"]:checked +label {color: #111;}
.chk_wrap.cl_bk input[type="checkbox"]:checked + label:before {background-color:#1f202d;}
.chk_wrap.cl_bk input[type="checkbox"]:disabled + label:before {background-color:#b6b6b6;}
/* checkbox - 3 - 파랗고 좀더 큰 체크박스 */
.chk_wrap.cl_bl label {padding-left:36px;font-size:1.5rem;font-weight:500;color:#111;line-height: 25px;}
.chk_wrap.cl_bl label:before {background-color: #dde1e4;border-color: #dde1e4;box-shadow: 3px 2px 3.8px 0.2px rgba(0, 0, 0, 0.1) inset; width: 25px;    height: 25px;    line-height: 25px;}
.chk_wrap.cl_bl input[type="checkbox"]:checked + label:before {background-color: #1560fd; border-color:#1560fd;width: 25px;    height: 25px;    background-image: url('/resource/image/ico_check2.png');    background-repeat: no-repeat;    background-position: 50% 50%;}
/* checkbox - 4 */
.chk2 input[type="checkbox"]{display: inline-block; position: absolute; left: -9999px; opacity: 0; visibility: hidden; width: 0; height: 0; overflow: hidden;}
.chk2 label{position:relative; display:inline-block; line-height:20px; padding-left:26px; font-size:1.3rem; cursor:pointer; height:auto; color:#111;}
.chk2 label:before{content:""; display:block; position:absolute; left:0; top:0; width:20px; height:20px; border:2px solid #1560fd; box-sizing:border-box; background-color:#fff; margin-top:0; border-radius:0; box-shadow:none;}
.chk2 input[type="checkbox"]:checked+label:before{background-image:url('/resource/image/ico_check_b.png'); background-repeat:no-repeat; background-position:50% 50%;}

/* 라디오박스 */
.customRadio {position:relative;}
.customRadio:after {clear:both; content:''; display:block;}
.customRadio input[type="radio"], .customRadio input[type="checkbox"] {display:inline-block;position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;visibility:hidden;opacity:0;}
.customRadio label {padding-left:25px; position:relative; display:inline-block; box-sizing:border-box;line-height:20px; font-size:1.5rem;;color:#73797c; font-weight:500;cursor:pointer;}
.customRadio label:before {position:absolute;left:0;top: 50%;margin-top:-10px;clear:both;content:'';display:block;border: 1px solid #a4aeb4 ;background: #fff;width:20px;height:20px;border-radius:16px;box-sizing:border-box;}
.customRadio label:after {position:absolute;left: 4px;top: 50%;margin-top: -6px;clear:both;content:'';display:block;background:#a4aeb4;width: 12px;height: 12px;border-radius:12px;}
.customRadio input:checked + label{color:#1560fd;}
.customRadio input:checked + label:after{background:#1560fd;}
.customRadio input:checked + label:before{background:#fff; border:1px solid #1560fd;}

/*좌우 이동 radio*/
.big_radio{display:inline-block; width:334px; border-radius:25px; box-shadow: 3px 3px 7px 0 rgba(0, 0, 0, 0.2) inset; background-color:#e2e5ec; position:relative;}
.big_radio > div{position:relative;}
.big_radio > div::before{content:''; display:block; clear:both; width:50%; height:50px; position:absolute; left:0; top:0; background-color:#395ff8; box-shadow:0 0 13px 1px rgba(71, 117, 213, 0.58); border-radius:25px; transition: 0.5s;}
.big_radio .ra1::before{left:0;}
.big_radio .ra2::before{left:50%;}
.big_radio p{float:left; width:50%; position:relative; z-index:5;}
.big_radio p input[type="radio"]{width:0; height:0; visibility:hidden; opacity:0; position:absolute; left:-999999px;}
.big_radio p label{display:block; height:50px; line-height:50px; font-size:1.5rem; font-weight:500; color:#797b84; letter-spacing:-0.5px; text-align:center; cursor:pointer;}
.big_radio p input[type="radio"]:checked + label{color:#fff;}

/* 아이콘 버튼 - 왼쪽 아이콘 */
a.icon_btn {position: relative; display: inline-block; padding: 0 14px; width: 96px; height: 36px; line-height: 36px; font-size: 1.3rem; color: #fff; box-sizing: border-box; border-radius: 5px; text-align: left; overflow: hidden; z-index: 1; box-shadow: 0px 5px 10px 0px rgb(140 140 140 / 22%);}
a.icon_btn.lgb {width: 140px;}
a.icon_btn:before {content: ""; display: block; position: absolute; right: 14px; top: 50%; margin-top: -4.5px; width: 11px; height: 9px; background-image: url('/resource/image/ico_more.png'); background-repeat: no-repeat; background-position: 50% 50%;}
/* 아이콘 버튼 - 왼쪽 아이콘 - 다운, 이동 등등 */
a.icon_btn.mvto:before{width:11px;height:11px; margin-top:-5.5px;background-image: url('/resource/image/ico_go3.svg');background-size:contain}
a.icon_btn.dwld:before{width:11px;height:11px; margin-top:-5.5px;background-image: url('/resource/image/down_ico.svg');background-size:contain}
a.icon_btn.remv:before{width:12px;height:2px;margin-top:-1px; background:#fff; }
a.icon_btn.plus:before{width:12px;height:12px;margin-top: -6px; background-image: url('/resource/image/ico_plus2.png'); }
a.icon_btn.doc_wte:before{width:12px;height:12px;margin-top: -6px; background-image: url('/resource/image/edit_ico_w.svg'); }

a.icon_btn.none_icon {text-align: center;}
a.icon_btn.none_icon:before {background: none;}

/* 아이콘 버튼 - 오른쪽 아이콘 */
a.icon_btn2 {position: relative; display: inline-block; padding: 0 14px; width: 85px; height: 30px; line-height: 30px; font-size: 12px; color: #fff; box-sizing: border-box; border-radius: 5px; text-align: right; overflow: hidden; z-index: 1; box-shadow: 0px 5px 10px 0px rgb(140 140 140 / 22%);}
a.icon_btn2:before {content: ""; display: block; position: absolute; left: 12px; top: 50%; margin-top: -6.5px; width: 11px; height: 13px; background-image: url('/resource/image/ico_remove2.png'); background-repeat: no-repeat; background-position: 50% 50%;}

/*버튼*/
.btn_wrap {font-size:0;text-align:center;margin-top:40px}
.btn_wrap > div{margin-left:-10px;}
/* .btn_wrap > div:first-child {margin-left: 0;}
.btn_wrap > div:first-child .btns {margin-left: 0;} */
.btn_wrap .btns{color:#f4f7f9; font-size:1.6rem; letter-spacing:-.05em;display:inline-block;vertical-align:middle;box-sizing:border-box;margin-left:10px;line-height:60px; border-radius:10px;background: rgb(65,102,249);background: linear-gradient(180deg, rgba(65,102,249,1) 0%, rgba(21,66,248,1) 100%); box-shadow: 4px 3px 10px 0px rgba(140, 140, 140, 0.22);}
.btn_wrap .btns.bk{background: rgb(59,61,63);background: linear-gradient(180deg, rgba(59,61,63,1) 0%, rgba(8,10,13,1) 100%);}
.btn_wrap .btns.gr{background: rgb(153,161,166);background: linear-gradient(180deg, rgba(153,161,166,1) 0%, rgba(124,136,142,1) 100%);}
.btn_wrap .btns.bd{background-image: none; background-color: #fff; border:1px solid #3159f9;color: #3159f9;}

.btn_wrap:after {clear:both; content:''; display:block;}
.btn_wrap .btns-1 {margin-left:0;}
.btn_wrap .btns-2 {margin-left:0;}
.btn_wrap .btns-1 .btns {width:100%; margin-left:0;}
.btn_wrap .btns-2 .btns {width:49%; margin-left:2%; max-width:100%;}
.btn_wrap .btns-2 .btns:first-child {margin-left:0;}
/*버튼내의 플러스 있는경우*/
.btn_wrap.hasBf{text-align:left;}
.btn_wrap.hasBf .btns{padding:0 20px;position:relative;width:100%;font-size:1.3rem;}
.btn_wrap.hasBf .btns:before{background:url('/resource/image/ico_plus2.svg');color:#fff;width:15px;height:15px; content:'';position:absolute; right:25px;top:50%; margin-top:-7.5px;}
/*테이블 내의 작은 버튼*/
.sm_btn_wrap > div{margin-left:-5px;}
.sm_btn_wrap .btns{color:#485ff4;text-align:center; border:1px solid #485ff4;font-size:1.3rem;width:100%; max-width:98px; letter-spacing:-.05em;display:inline-block;vertical-align:middle;box-sizing:border-box;margin-left:5px;line-height:34px; border-radius:5px;background:#fff;}
.sm_btn_wrap .btns.bk{color:#4c4c4c; border-color:#4c4c4c}

/*pageTitle안에 버튼이 있을 경우 - class="title"에 btn_wrap추가하여 사용*/
.btn_wrap h2{display:inline-block; vertical-align:middle;}
.btn_wrap .btns.tit_btn{width:102px; height:31px; line-height:31px; font-size:13px; font-weight:500; border-radius:5px; text-align:center;}

.btn_wrap.col2 > div {display: inline-block; width: calc(100% + 10px); width: -webkit-calc(100% + 10px); width: -moz-calc(100% + 10px);}
.btn_wrap.col2 .btns {width: calc(50% - 10px); width: -webkit-calc(50% - 10px); width: -moz-calc(50% - 10px); font-weight: 500; }

.btn_wrap.col3 > div {display: inline-block; width: calc(100% + 10px); width: -webkit-calc(100% + 10px); width: -moz-calc(100% + 10px);}
.btn_wrap.col3 .btns {width: calc(33.33333% - 10px); width: -webkit-calc(33.33333 - 10px); width: -moz-calc(33.33333 - 10px); font-weight: 500; }

/* 버튼 - 단독 */
a.cl_btn {display: inline-block; padding: 0 5px; height: 50px; line-height: 50px; font-size: 1.4rem; font-weight: 500; color: #fff; text-align: center; border-radius: 8px; background-color: #1560fd; box-sizing: border-box;}
a.cl_btn.cl_gr {background-color: #b6bdc2;}
a.cl_btn.cl_gn {background-color: #2fc673;}
a.cl_btn.cl_bd {background:#fff; color:#1560fd;line-height:48px;border:1px solid #1560fd} 
/* 버튼 - 이미지 있는 큰 버튼 */
a.img_btn {position: relative; display: block; padding: 0 20px; height: 50px; line-height: 48px; border-radius: 10px; font-size: 1.4rem; color: #fff; text-align: left; box-sizing: border-box;}
a.img_btn:before {content: ''; position: absolute; top: 50%; right: 25px; display: block; width: 16px; height: 16px; margin-top: -8px; background-image: url('/resource/image/ico_plus.png'); background-position: 50% 50%; background-repeat: no-repeat;}

.mgt10{margin-top:10px}
.mgt20{margin-top:20px}
.mgt30{margin-top:30px}
.blc{color:#3a60f9}

/* 버튼 - 닫기 */
.cls_btn {display: block; width: 16px; height: 16px; font-size: 0; color: transparent;  border-radius: 100%; background-color: #e9e9e9; background-image: url(/resource/image/ip_del_ico3.svg); background-repeat: no-repeat; background-position: 50% 50%;background-size: 6px;}
.close_btn {display: block; width: 35px; height: 35px; font-size: 0; color: transparent; border-radius: 35px; background-color: #1f202d; background-image: url(/resource/image/ico_close.png); background-repeat: no-repeat; background-position: 50% 50%;}

/* 버튼 - 가이드 */
.tlp_wrap {position: relative;}
.tlp_wrap a {display: block; width: 16px; height: 16px; border-radius: 16px; font-size: 0; color: transparent; background-color: #a4aeb4; background-image: url('/resource/image/s_tooltip.png'); background-repeat: no-repeat; background-position: 50% 50%;}
.tlp_wrap .tlp_box {display:none; position:absolute; left:30px; top:50%; transform:translate(0, -50%); background:#343541; border-radius:5px;}
.tlp_wrap .tlp_box p{position:relative; color:#fff; font-size:1.3rem;font-weight:300; line-height:1.4; padding:12px 14px; box-sizing:border-box;}
.tlp_wrap .tlp_box p:before{position:absolute; top:50%; margin-top:-6.5px; left:-10px;content:'';width: 0;height: 0;border-style: solid;border-width: 6.5px 10px 6.5px 0;border-color: transparent #343541 transparent transparent;}

/*Tooltip2*/
.tlp_area2{position:relative; width:180px; height:108px;}
.tlp_wrap2 .tlp_box2 {background:#343541; border-radius:5px;}
.tlp_wrap2 .tlp_box2 p{position:relative; color:#fff; font-size:1.3rem; font-weight:300; line-height:1.4; padding:12px 16px; box-sizing:border-box;}
.tlp_wrap2 .tlp_box2 p:before{position:absolute; content:''; width: 0; height: 0; border-style: solid;}
.tlp_wrap2 .tlp_box2_1 p:before{bottom:-9.5px; left:15px; border-width: 10.5px 6px 0 6px; border-color:#343541 transparent transparent transparent;}
.tlp_wrap2 .tlp_box2_2 p:before{top:-9.5px; left:15px; border-width:0 6px 10.5px 6px; border-color:transparent transparent #343541 transparent;}



/* 컨텐츠 상단 타이틀 */
#sub .contBox {padding:60px; box-sizing:border-box; position:relative; }
#sub .pageTitle {margin-bottom:20px; position:relative; z-index:100;}
#sub .pageTitle .title h2{font-size:2.6rem; font-weight:700; letter-spacing:-1.5px; margin:0; }
#sub .pageTitle .title p {font-size:1.4rem; font-weight:400; letter-spacing:-1.5px;}
#sub .pageTitle .drp_wrap {border-color:#1560fd; width:260px; position:absolute; right:0; bottom:0; }
#sub .pageTitle .navi {font-size: 0;}
#sub .pageTitle .navi a {position: relative; display: inline-block; padding: 0 5px; font-size: 1.4rem; color: #555; box-sizing: border-box;}
#sub .pageTitle .navi a:before {content: '-'; position: absolute; top: 50%; left: -2px; display: block; margin-top: -11px; font-size: 1.4rem; color: #555;}
#sub .pageTitle .navi a:first-child {padding-left: 0;}
#sub .pageTitle .navi a:first-child:before {display: none;}

/* 리스트 타입 */
.list_type a {display: inline-block; font-size: 0; color: transparent; background-repeat: no-repeat; background-position: 50% 50%; vertical-align: middle;}
.list_type .card {padding: 0 5px; width: 17px; height: 17px; background-image: url('/resource/image/ico_box.svg'); }
.list_type .card.on {background-image: url('/resource/image/ico_box_on.svg');}
.list_type .list {padding: 0 5px; width: 17px; height: 17px; background-image: url('/resource/image/ico_list.svg');  }
.list_type .list.on {background-image: url('/resource/image/ico_list_on.svg');}



/*오름차순 내림차순 버튼 - 테이블 상단*/
.srt_btn{display:inline-block;font-size:0;}
.srt_btn img{width:12px;margin-left:5px; display:inline-block;vertical-align:middle;}
.srt_btn b{display:inline-block;vertical-align:middle;color:#1560fd;font-size:1.3rem;} 
.srt_btn.t_ch a span{font-size:1.3rem;font-weight:700;color:#1560fd;line-height:38px; display:inline-block;vertical-align:middle;}
.srt_btn.desc img{transform:rotate(180deg)}

.srt_btn.t_ch{width:auto;text-align:center}
.srt_btn.t_ch a{display:block;border: 1px solid #e2e7ea;border-radius:5px;background: #ecf0f6;width:100%; padding: 0 5px;}
.srt_btn.t_ch .ch{display:none}
.srt_btn.t_ch.desc span{display:none}
.srt_btn.t_ch.desc .ch{display:inline-block}


/*컨텐츠 상단 체크박스 + 드롭다운  + 오름차순 내림차순 버튼*/
.col_box .drp_box{font-size:0;}
.col_box .drp_box .chk_wrap {display:inline-block;vertical-align:middle;    padding-left: 18px;    padding-right: 12px;}
.col_box .drp_box .chk_wrap label{width:20px;padding:0;}
.col_box .drp_wrap{max-width:210px;display:inline-block;vertical-align:middle;width:100%;border-radius:5px;border-color:#1560fd/*border-radius:5px;background:#ecf0f6;*/}
.col_box .drp_wrap.on{    border-radius: 5px 5px 0 0;}
.col_box .drp_wrap > a{line-height:38px;font-weight:700;/*border-color:#ecf0f6;font-size:1.3rem*/}
.col_box .drp_wrap > ul li a {height: 38px; line-height: 38px;}
/*.col_box .drp_wrap.on > a{border-color:#ecf0f6}*/
.col_box .drp_wrap > ul{top:38px}
.col_box .srt_btn{vertical-align:middle;margin-left:5px}



/* ==================================================
	skip
================================================== */
a.skip{display:block;position:absolute;top:-1px;z-index:999;width:0;height:0;overflow:hidden;text-align:center}
a.skip:active,a.skip:focus{z-index:999;width:100%;height:auto;padding:5px;background:#FFF}

a:hover{transition:all .4s ease; -webkit-transition:all .4s ease; -ms-transition:all .4s ease; -moz-transition:all .4s ease; -o-transition:all .4s ease;}


h2{margin:0 0 10px 0;}
input[type=button] {cursor:pointer !important;}
.bt{cursor:pointer !important;}


/* inptu / select / textarea */
input[type='text'],input[type='password'], input[type='tel'], input[type='email'], input[type='number'], input[type='url'], select {border:1px solid #cccccc; height:40px; line-height: 40px; vertical-align: middle; padding:0 5px; width:100%; box-sizing:border-box;}
input[class="userPW"] {vertical-align: middle; padding: 0 5px; width: 100% !important; box-sizing: border-box; outline: none; margin-top: 10px;}
input[class="userEmail"] {width: 100%; height: 40px; line-height: 40px; vertical-align: middle; padding: 0 5px; box-sizing: border-box; background-color: white;}
input[class="userEmail"]:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px white inset !important;	box-shadow: 0px 2px 11.83px 1.17px rgba(0, 0, 0, 0.09) !important;	transition: background-color 5000s ease-in-out 0s;}
textarea{border:1px solid #cccccc; }
input[readonly], input[readonly="readonly"], input:read-only {background:#fafafa;}

/* 셀렉트박스 */
.select{display:inline-block;  position:relative; height:40px; width:100%; vertical-align: middle;}
.select select{display: block; cursor: pointer;  max-width:100%;  -moz-appearance:none; /* Firefox */   -webkit-appearance:none; /* Safari and Chrome */  appearance:none;}
select::-ms-expand { display:none; } 
.select select:not([multiple]){right:5px;}
.select:not(.is-multiple):not(.is-loading)::after{border: 2px solid #333; border-radius: 2px; border-right: 0; border-top: 0; content: ' '; display: block; height: 6px; margin-top: -6px; pointer-events: none; position: absolute; top: 50%; transform: rotate(-45deg); transform-origin: center; width: 6px; right:10px; z-index: 4;}

/* 체크박스 */
.check_box { position:relative;}
.check_box input[type="checkbox"]{display:inline-block; position:absolute; left:-9999px; opacity:0; visibility:hidden; width:1px; height:1px; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); overflow:hidden; }
.check_box label {display:inline-block; padding-left:30px; color:#333; cursor:pointer; position:relative; line-height:24px;}
.check_box label:before  {position:absolute; left:0; top:50%; width:24px; height:24px; box-sizing:border-box; margin-top:-12px; border:1px solid #cccccc; line-height:20px; text-align:center; clear:both; content:''; display:block;}
.check_box input[type="checkbox"]:checked + label:before {content:'\2714'; font-size:18px; font-weight: 500;}

/* 라디오버튼 */
.radio_box { position:relative;}
.radio_box input[type="radio"]{display:inline-block; position:absolute; left:-9999px; opacity:0; visibility:hidden; width:1px; height:1px; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); overflow:hidden; }
.radio_box label {display:inline-block; padding-left:30px; color:#333; cursor:pointer; position:relative; line-height:24px;}
.radio_box label:before {position:absolute; left:0; top:50%; width:24px; height:24px; box-sizing:border-box; border-radius: 12px; margin-top:-12px; border:1px solid #cccccc; line-height:20px; text-align:center; clear:both; content:''; display:block;}
.radio_box label:after{position:absolute; content:'\2022'; font-size:30px; left:6px; top:0; line-height: 16px; font-weight: 500; display:none;}
.radio_box input[type="radio"]:checked + label:after {display:block;}
.swiper-wrapper { display: -webkit-box;}


/* input type="file"*/
.fileBox{position:relative;}
.fileBox .inputBox{float:left; box-sizing: border-box;}
.fileBox input[type="text"]{float:left;overflow:hidden;box-sizing:border-box;height:32px;padding:8px 10px;border:1px solid #cccccc;line-height:1;background:#fafafa;  box-sizing: border-box;}
.fileBox .fileBtn{float:left;margin-left:5px;  box-sizing: border-box;}
.fileBox .fileBtn label{display:inline-block;width:110px;font-size:14px;line-height:40px; height:40px; letter-spacing:-1px;color:#fff;background:#999;text-align:center; border-radius: 4px;  box-sizing: border-box;}
.fileBox .fileBtn input[type="file"]{visibility:hidden;width:0;height:0;padding:0;margin:0;}

/* pagenation */
.pagenate {width:100%; clear:both;}
.pagenate {text-align:center; margin:20px auto 0;}
.pagenate li {display:inline-block;font-weight:500; margin-left:3px;}
.pagenate li:first-child { margin-left:0px; }
.pagenate li a{display:inline-block; text-decoration:none; padding:0; width:22px; height:22px; line-height:22px; color: #1560fd; border-radius: 22px; font-size: 11px; box-sizing:border-box; margin-left:-1px; vertical-align:middle;}
.pagenate li a.board { text-indent:-9999em; margin-left:4px; }
.pagenate li a.board.first {background:#f3f3f3 url('/resource/image/ico_first.svg') no-repeat center center; background-size:16px 14px;}
.pagenate li a.board.prev {margin-right: 115px; background: url('/resource/image/ico_prev2.svg') no-repeat center center; background-size:9px 13px;}
.pagenate li a.board.next {margin-left:115px; background: url('/resource/image/ico_next2.svg') no-repeat center center; background-size:9px 13px;}
.pagenate li a.board.last {background:#f3f3f3 url('/resource/image/ico_last.svg') no-repeat center center; background-size:16px 14px;}
.pagenate li a.current {color:#fff; background-color:#1560fd; font-weight:400;}





/* scroll */
.scroll {overflow: auto; box-sizing: border-box;}
.scroll::-webkit-scrollbar {width: 5px; height: 5px;}
.scroll::-webkit-scrollbar-track {background: #e8edf1; border-radius: 3px;}
.scroll::-webkit-scrollbar-thumb {background: #a4aeb4; border-radius: 3px;}
.scroll {scrollbar-face-color: #e8edf1; scrollbar-track-color: #e8edf1; scrollbar-arrow-color: none; scrollbar-highlight-color: #e8edf1; scrollbar-3dlight-color: none; scrollbar-shadow-color: #b6bdc2; scrollbar-darkshadow-color: none;}


.wid10{width:10%;}
.wid20{width:20%;}
.wid30{width:30%;}
.wid40{width:40%;}
.wid50{width:50%;}
.wid60{width:60%;}
.wid70{width:70%;}
.wid80{width:80%;}
.wid90{width:90%;}
.wid100{width:100%;}

.max100 {max-width:100px;}
.max150 {max-width:150px;}
.max200 {max-width:200px;}
.max250 {max-width:250px;}
.max300 {max-width:300px;}
.max350 {max-width:350px;}
.max400 {max-width:400px;}
.max450 {max-width:450px;}
.max500 {max-width:500px;}
.max550 {max-width:550px;}
.max600 {max-width:600px;}
.max650 {max-width:650px;}
.max700 {max-width:700px;}
.max750 {max-width:750px;}
.max800 {max-width:800px;}
.max850 {max-width:850px;}
.max900 {max-width:900px;}
.max950 {max-width:950px;}
.max1000 {max-width:1000px;}

.mt0 {margin-top:0px !important;}
.mt10{margin-top:10px !important;}
.mt20{margin-top:20px !important;}
.mt30{margin-top:30px !important;}
.mt40{margin-top:40px !important;}
.mt50{margin-top:50px !important;}
.mt60{margin-top:60px !important;}
.mt70{margin-top:70px !important;}
.mt80{margin-top:80px !important;}
.mt90{margin-top:90px !important;}
.mt100{margin-top:100px !important;}

.mb0 {margin-bottom:0px !important;}
.mb10 {margin-bottom:10px !important;}
.mb20 {margin-bottom:20px !important;}
.mb30 {margin-bottom:30px !important;}
.mb40 {margin-bottom:40px !important;}
.mb50 {margin-bottom:50px !important;}
.mb60 {margin-bottom:60px !important;}
.mb70 {margin-bottom:70px !important;}
.mb80 {margin-bottom:80px !important;}
.mb90 {margin-bottom:90px !important;}
.mb100 {margin-bottom:100px !important;}

.ml0 {margin-left:0px !important;}
.ml10 {margin-left:10px !important;}
.ml20 {margin-left:20px !important;}
.ml30 {margin-left:30px !important;}
.ml40 {margin-left:40px !important;}
.ml50 {margin-left:50px !important;}

.mr0 {margin-right:0px !important;}
.mr10 {margin-right:10px !important;}
.mr20 {margin-right:20px !important;}
.mr30 {margin-right:30px !important;}
.mr40 {margin-right:40px !important;}
.mr50 {margin-right:50px !important;}


.pd0{padding:0 !important;}
.pt0{padding-top:0 !important;}
.pt10 {padding-top:10px !important;}
.pt20 {padding-top:20px !important;}
.pt30 {padding-top:30px !important;}
.pt40 {padding-top:40px !important;}
.pt50 {padding-top:50px !important;}
.pt60 {padding-top:60px !important;}
.pt70 {padding-top:70px !important;}

.pb10 {padding-bottom:10px !important;}
.pb20 {padding-bottom:20px !important;}
.pb30 {padding-bottom:30px !important;}
.pb40 {padding-bottom:40px !important;}
.pb50 {padding-bottom:50px !important;}
.pb60 {padding-bottom:60px !important;}
.pb70 {padding-bottom:70px !important;}


.auto {margin-left:auto !important; margin-right:auto !important;}
.bno{border:none !important;}
.blind{position:absolute; top:-999999px; width:0; height:0; font-size:0; overflow:hidden;}
.clear:after {clear:both;content:'';display:block;}
.hidden {text-indent:-9999px; width:0px; height:0px; line-height:0px; font-size:0px; opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); overflow:hidden; visibility:hidden;}


.fl_l{float:left !important;}
.fl_r{float:right !important;}


.wbreak{word-break:break-all !important;}

.tb {display:table;width:100%; height:100%}
.tbc {display:table-cell;width:100%; height:100%; vertical-align:middle;}
.img img{max-width:100%}
.pic {background-size: contain; background-position: center center;background-repeat: no-repeat;}
.pic img{max-width: 100%; opacity: 0;visibility: hidden;}
.back_img {background-position: center center; background-size: cover; background-repeat: no-repeat;}
.basic_img {width: 100%; max-width:100%; height:auto; visibility:hidden; opacity:0;}

.dpb{display:block;}
.inb{display:inline;}

/* .scroll{overflow-y:auto;}
.scroll::-webkit-scrollbar {width: 1px; height: 5px;}
.scroll::-webkit-scrollbar-track {background: #a4aeb4; width:1px;}
.scroll::-webkit-scrollbar-thumb {background: #000; border-radius: 2.5px; width:5px; height:108px;}
.scroll {scrollbar-face-color: #8a8a8a; scrollbar-track-color: #fff; scrollbar-arrow-color: none; scrollbar-highlight-color: #8a8a8a; scrollbar-3dlight-color: none; scrollbar-shadow-color: #8a8a8a; scrollbar-darkshadow-color: none;}
 */

/* Font */
.ft12 {font-size:12px !important;}
.ft13 {font-size:13px !important;}
.ft14 {font-size:14px !important;}
.ft15 {font-size:15px !important;}
.ft16 {font-size:16px !important;}
.ft17 {font-size:17px !important;}
.ft18 {font-size:18px !important;}
.ft19 {font-size:19px !important;}
.ft20 {font-size:20px !important;}
.ft21 {font-size:21px !important;}
.ft22 {font-size:22px !important;}
.ft23 {font-size:23px !important;}
.ft24 {font-size:24px !important;}
.ft25 {font-size:25px !important;}
.ft26 {font-size:26px !important;}
.ft27 {font-size:27px !important;}
.ft28 {font-size:28px !important;}
.ft29 {font-size:29px !important;}
.ft30 {font-size:30px !important;}
.ft31 {font-size:31px !important;}
.ft32 {font-size:32px !important;}
.ft65 {font-size:65px !important; letter-spacing:-4px; line-height:60px;}

.fs80{font-size:8rem;}
.fs70{font-size:7rem;}
.fs60{font-size:6rem;}
.fs55{font-size:5.5rem;}
.fs50{font-size:5rem;}
.fs45{font-size:4.5rem;}
.fs40{font-size:4rem;}
.fs35{font-size:3.5rem;}
.fs30{font-size:3rem;}
.fs25{font-size:2.5rem;}
.fs20{font-size:2rem;}
.fs18{font-size:1.8rem;}
.fs17{font-size:1.7rem;}
.fs16{font-size:1.6rem;}
.fs15{font-size:1.5rem;}
.fs14{font-size:1.4rem;}
.fs13{font-size:1.3rem;}
.fs12{font-size:1.2rem;}
.fs11{font-size:1.1rem;}
.fs10{font-size:1rem;}

.txt_l{text-align:left !important;}
.txt_c{text-align:center !important;}
.txt_r{text-align:right !important;}
.ver_t{vertical-align:top !important;}
.txt_b{font-weight:bold !important;}
.txt_line{text-decoration:underline !important;}

.txt_black {color:#000 !important;}
.txt_white {color:#fff !important;}

.fw200 {font-weight:200 !important;}
.fw300 {font-weight:300 !important;}
.fw400 {font-weight:400 !important;}
.fw500 {font-weight:500 !important;}
.fw600 {font-weight:600 !important;}
.fw800 {font-weight:800 !important;}

/* col width */
.col02 > * {width:50% !important;}
.col03 > * {width:33.3333% !important;}
.col04 > * {width:25% !important;}
.col05 > * {width:20% !important;}
.col06 > * {width:16.6666% !important;}
.col07 > * {width:14.285% !important;}
.col08 > * {width:12.5% !important;}
.col09 > * {width:11.1111% !important;}
.col10 > * {width:10% !important;}



/* animated */

.animate [class*='ani-']{opacity:1; filter:alpha(opacity=100); -ms-filter:alpha(opacity=100); transform:translate3d(0,0,0); -webkit-transform:translate3d(0,0,0); -o-transform:translate3d(0,0,0); -ms-transform:translate3d(0,0,0); -moz-transform:translate3d(0,0,0);}
.fromLeft:not(.done) {opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); transform:translate3d(-50px, 0, 0); -webkit-transform:translate3d(-50px, 0, 0); -o-transform:translate3d(-50px, 0, 0); -ms-transform:translate3d(-50px, 0, 0);  -moz-transform:translate3d(-50px,0,0);}
.fromRight:not(.done) {opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); transform:translate3d(50px, 0, 0); -webkit-transform:translate3d(50px, 0, 0); -o-transform:translate3d(50px, 0, 0); -ms-transform:translate3d(50px, 0, 0); -moz-transform:translate3d(50px, 0, 0); }
.fromBottom:not(.done) {opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); transform:translate3d(0, 100px, 0); -webkit-transform:translate3d(0, 100px, 0); -o-transform:translate3d(0, 100px, 0); -ms-transform:translate3d(0, 100px, 0); -moz-transform:translate3d(0, 100px, 0);}
.fromTop:not(.done) {opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); transform:translate3d(0, -100px, 0); -webkit-transform:translate3d(0, -100px, 0); -o-transform:translate3d(0, -100px, 0); -ms-transform:translate3d(0, -100px, 0); -moz-transform:translate3d(0, -100px, 0); }
.fromCenter:not(.done) {opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0); transform:scale(0.8) translate3d(0,0,0) ; -webkit-transform:scale(0.8) translate3d(0,0,0); -o-transform:scale(0.8) translate3d(0,0,0); -ms-transform:scale(0.8) translate3d(0,0,0); -moz-transform:scale(0.8) translate3d(0,0,0); }

.animate [class*='ani-'] {transition-property:transform, opacity; -webkit-transition-property:transform, opacity; transition-duration:0.8s; -webkit-transition-duration:0.8s; -o-transition-duration:.8s; -moz-transition-duration:.8s;   }
.animate.fast [class*='ani-'] {transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:.6s; -moz-transition-duration:.6s;}
.animate.slow [class*='ani-'] {transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; -moz-transition-duration:1s;  }

.animate .ani-1 {transition-delay:10ms; -webkit-transition-delay:10ms; -o-transition-delay:10ms; -moz-transition-delay:10ms;}
.animate .ani-2 {transition-delay:160ms; -webkit-transition-delay:160ms; -o-transition-delay:160ms; -moz-transition-delay:160ms;}
.animate .ani-3 {transition-delay:320ms; -webkit-transition-delay:320ms; -o-transition-delay:320ms; -moz-transition-delay:320ms;}
.animate .ani-4 {transition-delay:480ms; -webkit-transition-delay:480ms; -o-transition-delay:480ms; -moz-transition-delay:480ms;}
.animate .ani-5 {transition-delay:640ms; -webkit-transition-delay:640ms; -o-transition-delay:640ms; -moz-transition-delay:640ms;}
.animate .ani-6 {transition-delay:800ms; -webkit-transition-delay:800ms; -o-transition-delay:800ms; -moz-transition-delay:800ms;}
.animate .ani-7 {transition-delay:960ms; -webkit-transition-delay:960ms; -o-transition-delay:960ms; -moz-transition-delay:960ms;}
.aniamte .ani-8 {transition-delay:1120ms; -webkit-transition-delay:1120ms; -o-transition-delay:1120ms; -moz-transition-delay:1120ms;}
.aniamte .ani-9 {transition-delay:1280ms; -webkit-transition-delay:1280ms; -o-transition-delay:1280ms; -moz-transition-delay:1280ms; }
.animate .ani-10 {transition-delay:1440ms; -webkit-transition-delay:1440ms; -o-transition-delay:1440ms; -moz-transition-delay:1440ms; }
.animate .ani-11 {transition-delay:1600ms; -webkit-transition-delay:1600ms; -o-transition-delay:1600ms; -moz-transition-delay:1600ms; }
.fast.animate .ani-1 {transition-delay: 10ms;-webkit-transition-delay: 10ms; -o-transition-delay:10ms; -moz-transition-delay:10ms;}
.fast.animate .ani-2 {transition-delay: 140ms;-webkit-transition-delay: 140ms; -o-transition-delay:140ms; -moz-transition-delay:140ms;}
.fast.animate .ani-3 {transition-delay: 270ms;-webkit-transition-delay: 270ms; -o-transition-delay:270ms; -moz-transition-delay:270ms;}
.fast.animate .ani-4 {transition-delay: 400ms;-webkit-transition-delay: 400ms;-o-transition-delay:400ms; -moz-transition-delay:400ms;}
.fast.animate .ani-5 {transition-delay: 530ms;-webkit-transition-delay: 530ms;-o-transition-delay:530ms; -moz-transition-delay:530ms;}
.fast.animate .ani-6 {transition-delay: 660ms;-webkit-transition-delay: 660ms;-o-transition-delay:660ms; -moz-transition-delay:660ms;}
.fast.animate .ani-7 {transition-delay: 790ms;-webkit-transition-delay: 790ms;-o-transition-delay:790ms; -moz-transition-delay:790ms;}
.fast.animate .ani-8 {transition-delay: 920ms;-webkit-transition-delay: 920ms;-o-transition-delay:920ms; -moz-transition-delay:920ms;}

.slow.animate .ani-1 {transition-delay: 10ms;	-webkit-transition-delay: 10ms;-o-transition-delay:10ms;-moz-transition-delay:10ms;}
.slow.animate .ani-2 {transition-delay: 210ms;-webkit-transition-delay: 210ms;-o-transition-delay:210ms; -moz-transition-delay:210ms;}
.slow.animate .ani-3 {transition-delay: 420ms;-webkit-transition-delay: 420ms;-o-transition-delay:420ms; -moz-transition-delay:420ms;}
.slow.animate .ani-4 {transition-delay: 630ms;-webkit-transition-delay: 630ms;-o-transition-delay:630ms; -moz-transition-delay:630ms;}
.slow.animate .ani-5 {transition-delay: 840ms;-webkit-transition-delay: 840ms;-o-transition-delay:840ms; -moz-transition-delay:840ms;}
.slow.animate .ani-6 {transition-delay: 1050ms;-webkit-transition-delay: 1050ms;-o-transition-delay:1050ms; -moz-transition-delay:1050ms;}
.slow.animate .ani-7 {transition-delay: 1260ms;-webkit-transition-delay: 1260ms;-o-transition-delay:1260ms; -moz-transition-delay:1260ms;}
.slow.animate .ani-8 {transition-delay: 1470ms;-webkit-transition-delay: 1470ms;-o-transition-delay:1470ms; -moz-transition-delay:1470ms;}

.scale [class*='sc-'] {transform:scale(1); -webkit-transform:scale(1); -o-transform:scale(1); -ms-transform:scale(1); -moz-transform:scale(1); transition-property:transform; -webkit-transition-property:transform; -o-transition-property:transform; -moz-transition-property:transform; transition-duration:0.8s; -webkit-transition-duration:0.8s; -o-transition-duration:0.8s; -moz-transition-duration:0.8s; }

.scale .fromSc9:not(.done) {transform:scale(0.9); -webkit-transform:scale(0.9); -o-transform:scale(0.9); -ms-transform:scale(0.9); -moz-transform:scale(0.9);}
.scale .fromSc8:not(.done) {transform:scale(0.8); -webkit-transform:scale(0.8); -o-transform:scale(0.8); -ms-transform:scale(0.8); -moz-transform:scale(0.8);}
.scale .fromSc7:not(.done) {transform:scale(0.7); -webkit-transform:scale(0.7); -o-transform:scale(0.7); -ms-transform:scale(0.7); -moz-transform:scale(0.7); }
.scale .fromSc6:not(.done) {transform:scale(0.6); -webkit-transform:scale(0.6); -o-transform:scale(0.6); -ms-transform:scale(0.6); -moz-transform:scale(0.6); }
.scale .fromSc5:not(.done) {transform:scale(0.5); -webkit-transform:scale(0.5); -o-transform:scale(0.5); -ms-transform:scale(0.5); -moz-transform:scale(0.5); }
.scale .fromSc11:not(.done) {transform:scale(1.1); -webkit-transform:scale(1.1); -o-transform:scale(1.1); -ms-transform:scale(1.1); -moz-transform:scale(1.1);}
.scale .fromSc12:not(.done) {transform:scale(1.2); -webkit-transform:scale(1.2); -o-transform:scale(1.2); -ms-transform:scale(1.2); -moz-transform:scale(1.2); }
.scale .fromSc13:not(.done) {transform:scale(1.3); -webkit-transform:scale(1.3); -o-transform:scale(1.3); -ms-transform:scale(1.3); -moz-transform:scale(1.3); }
.scale .fromSc14:not(.done) {transform:scale(1.4); -webkit-transform:scale(1.4); -o-transform:scale(1.4); -ms-transform:scale(1.4); -moz-transform:scale(1.4);}
.scale .fromSc15:not(.done) {transform:scale(1.5); -webkit-transform:scale(1.5); -o-transform:scale(1.5); -ms-transform:scale(1.5); -moz-transform:scale(1.5); }

.scale .sc-1 {transition-delay:10ms; -webkit-transition-delay:10ms; -o-transition-delay:10ms; -moz-transition-delay:10ms;}
.scale .sc-2 {transition-delay:160ms; -webkit-transition-delay:160ms; -o-transition-delay:160ms; -moz-transition-delay:160ms;}
.scale .sc-3 {transition-delay:320ms; -webkit-transition-delay:320ms; -o-transition-delay:320ms; -moz-transition-delay:320ms;}
.scale .sc-4 {transition-delay:480ms; -webkit-transition-delay:480ms; -o-transition-delay:480ms; -moz-transition-delay:480ms;}
.scale .sc-5 {transition-delay:640ms; -webkit-transition-delay:640ms; -o-transition-delay:640ms; -moz-transition-delay:640ms;}
.scale .sc-6 {transition-delay:800ms; -webkit-transition-delay:800ms; -o-transition-delay:800ms; -moz-transition-delay:800ms;}
.scale .sc-7 {transition-delay:960ms; -webkit-transition-delay:960ms; -o-transition-delay:960ms; -moz-transition-delay:960ms;}
.scale .sc-8 {transition-delay:1120ms; -webkit-transition-delay:1120ms; -o-transition-delay:1120ms; -moz-transition-delay:1120ms;}

.fast.scale .sc-1 {transition-delay: 10ms;-webkit-transition-delay: 10ms; -o-transition-delay:10ms; -moz-transition-delay:10ms;}
.fast.scale .sc-2 {transition-delay: 140ms;-webkit-transition-delay: 140ms; -o-transition-delay:140ms; -moz-transition-delay:140ms;}
.fast.scale .sc-3 {transition-delay: 270ms;-webkit-transition-delay: 270ms; -o-transition-delay:270ms; -moz-transition-delay:270ms;}
.fast.scale .sc-4 {transition-delay: 400ms;-webkit-transition-delay: 400ms;-o-transition-delay:400ms; -moz-transition-delay:400ms;}
.fast.scale .sc-5 {transition-delay: 530ms;-webkit-transition-delay: 530ms;-o-transition-delay:530ms; -moz-transition-delay:530ms;}
.fast.scale .sc-6 {transition-delay: 660ms;-webkit-transition-delay: 660ms;-o-transition-delay:660ms; -moz-transition-delay:660ms;}
.fast.scale .sc-7 {transition-delay: 790ms;-webkit-transition-delay: 790ms;-o-transition-delay:790ms; -moz-transition-delay:790ms;}
.fast.scale .sc-8 {transition-delay: 920ms;-webkit-transition-delay: 920ms;-o-transition-delay:920ms; -moz-transition-delay:920ms;}


.slow.scale .sc-1 {transition-delay: 10ms;	-webkit-transition-delay: 10ms;-o-transition-delay:10ms;-moz-transition-delay:10ms;}
.slow.scale .sc-2 {transition-delay: 210ms;-webkit-transition-delay: 210ms;-o-transition-delay:210ms; -moz-transition-delay:210ms;}
.slow.scale .sc-3 {transition-delay: 420ms;-webkit-transition-delay: 420ms;-o-transition-delay:420ms; -moz-transition-delay:420ms;}
.slow.scale .sc-4 {transition-delay: 630ms;-webkit-transition-delay: 630ms;-o-transition-delay:630ms; -moz-transition-delay:630ms;}
.slow.scale .sc-5 {transition-delay: 840ms;-webkit-transition-delay: 840ms;-o-transition-delay:840ms; -moz-transition-delay:840ms;}
.slow.scale .sc-6 {transition-delay: 1050ms;-webkit-transition-delay: 1050ms;-o-transition-delay:1050ms; -moz-transition-delay:1050ms;}
.slow.scale .sc-7 {transition-delay: 1260ms;-webkit-transition-delay: 1260ms;-o-transition-delay:1260ms; -moz-transition-delay:1260ms;}
.slow.scale .sc-8 {transition-delay: 1470ms;-webkit-transition-delay: 1470ms;-o-transition-delay:1470ms; -moz-transition-delay:1470ms;}


.vertical-i {animation:vb 1s infinite;}

@keyframes vb {
	0%{
		bottom: 0;
	}
	50% {
		bottom:10px;
	}
	100% {
		bottom:0px; 
	}
}

@keyframes vt{
	0%{
		top: 0;
	}
	50%{
		top:10px;
	}
	100%{
		top:0;
	}
}

.zid-1 {z-index:1;}
.zid-2 {z-index:2;}
.zid-3 {z-index:3;}
.zid-4 {z-index:4;}
.zid-5 {z-index:5;}
.zid-6 {z-index:6;}
.zid-7 {z-index:7;}
.zid-8 {z-index:8;}
.zid-9 {z-index:9;}
.zid-10 {z-index:10;}


/* 헤더 - 알람 */
#alarm_wrap {position: absolute; top: 70px; right: -400px; width: 100%; height: 100%; max-width: 330px; background: #fff; z-index: 120; box-shadow: -12px 10px 20px 0px rgba(0, 0, 0, 0.1);}
#alarm_wrap > div {box-sizing: border-box;}
#alarm_wrap .tit_area {position: relative; padding: 0 27px; background: #345bf8;}
#alarm_wrap .tit_area strong {position: relative; display: block; padding-left: 25px; height: 57px; line-height: 62px; font-size: 1.8rem; color: #fff; font-weight: 700; letter-spacing: 0; box-sizing: border-box;}
#alarm_wrap .tit_area strong:before {content: ''; position: absolute; top: 50%; left: 0; display: block; margin-top: -7px; width: 17px; height: 19px; background-image: url('/resource/image/ico_alarm.svg'); background-position: 50% 50%; background-repeat: no-repeat;}
#alarm_wrap .cont_area {height: calc(100% - 130px); height: -webkit-calc(100% - 130px); height: -moz-calc(100% - 130px); padding-bottom: 30px; box-sizing: border-box;}
#alarm_wrap .cont_area ul {max-height: 100%; overflow: auto; }
#alarm_wrap .cont_area ul li {padding: 0 25px; border-top: 1px solid #e9eaeb; box-sizing: border-box;}
#alarm_wrap .cont_area ul li:first-child {border-top: 0;}
#alarm_wrap .cont_area ul li > div {position: relative; padding: 18px 0 18px 12px;box-sizing: border-box;}
#alarm_wrap .cont_area .tit:before {content: ''; position: absolute; top: 26px; left: 0; display: block; width: 6px; height: 6px; border-radius: 6px; background: #ff5944;}
#alarm_wrap .cont_area .tit a { display: block;}
#alarm_wrap .cont_area .tit em {display: block; line-height: 1.4; font-size: 1.5rem; font-weight: 500; color: #3b3d46; box-sizing: border-box;}
#alarm_wrap .cont_area .tit span {display: block; margin-top: 3px; line-height: 1.2; font-size: 12px; font-weight: 200; color: #a7aab6; box-sizing: border-box;}
#alarm_wrap .cont_area .cont {display: none; border-top: 1px solid #e7eaec; box-sizing: border-box;} 
#alarm_wrap .cont_area .cont p {line-height: 1.5;font-size: 1.5rem; font-weight: 300; color: #666;}
#alarm_wrap .cont_area ul li.on {background: #f4f6f7;}
#alarm_wrap .cont_area ul li.done .tit:before {background: #a7aab6;}
#alarm_wrap #alarm_close {position: absolute; top: 50%; right: 30px; display: block; margin-top: -9px; width: 19px; height: 19px; font-size: 0; color: transparent; background-image: url('/resource/image/ico_close2.png'); background-repeat: no-repeat; background-position: 50% 50%; background-size: cover;}
#alarm_wrap .scroll::-webkit-scrollbar-track {background: transparent;}
#alarm_wrap .scroll {scrollbar-face-color: transparent; scrollbar-track-color: transparent; scrollbar-arrow-color: none; scrollbar-highlight-color: transparent; scrollbar-3dlight-color: none; scrollbar-shadow-color: transparent; scrollbar-darkshadow-color: none;}

/* 도움말 */
.guide_box {position: relative; padding-left: 30px; font-size: 1.3rem; font-weight: 500; color: #a0a8ab; letter-spacing: -.08rem; box-sizing: border-box;}
.guide_box:before {content: ''; position: absolute; top: 1px; left: 5px; display: block; width: 18px; height: 18px; background-image: url("/resource/image/ico_guide.png"); background-repeat: no-repeat; background-position: 50% 50%; background-size: 100%;}

/*보이지 않는 스크롤*/
.hiddenScroll { overflow: scroll; -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ }
.hiddenScroll::-webkit-scrollbar { display: none; /* Chrome, Safari, Opera*/ }

/* 툴팁 */
/* .ui-tooltip {padding: 10px 20px; color: #fff; border-radius: 5px; background:#000;} */
.ui-tooltip {color: #fff !important; font-size: 1.2rem !important; background: #343541 !important; border-radius: 5px !important; box-shadow: none !important;}

.ui-widget.ui-widget-content { z-index: 100 !important; }

/* 엑셀 다운로드 버튼 */
.excelDownLoad { width: 180px !important; background-color: rgba(24,26,41); }



