@charset "utf-8";

/* ------------------------------------------------------------------------------
공통 레이아웃
------------------------------------------------------------------------------ */
#wrap {min-width:320px;width:100%;}
.info {position:relative;height:3rem;padding:1.1rem;border-bottom:1px solid #edeef0;background:#f3f2f5}
.logo_btn {width:2.5rem;height:2.5rem;position:absolute;top:0.4rem;left:1.5rem;background:url(../_Images/m/icon_logo.png) no-repeat 0 3px;background-size:170px 170px; padding-left:2.5rem;}
.logo_btn span {font-size:1.2rem;font-family:"ns-medium"; padding-top:0.3rem;}
.info_btn {width:2.6rem;height:2.6rem;position:absolute;top:0.5rem;right:0.6rem;background:url(../_Images/m/icon_logo.png) no-repeat -26px 0;background-size:170px 170px;}



.head {position:relative;height:5.3rem;padding:1.1rem;border-bottom:1px solid #edeef0;}
.head h1 {text-align:center;line-height:3rem;}
.head h1 a {font-family:"ns-medium";vertical-align:middle;}
.head h1 a::before {content:"";display:inline-block;height:3rem;vertical-align:middle;}
.menu_btn {width:2.7rem;height:2.4rem;position:absolute;top:1.5rem;left:1.5rem;background:url(../_Images/m/icon_sp.png) no-repeat 0 5px;background-size:250px 250px;}
.logout_btn {width:2.6rem;height:2.6rem;position:absolute;top:1.7rem;right:0.5rem;background:url(../_Images/m/icon_sp.png) no-repeat -58px 0;background-size:250px 250px;}
#container_main { background:url(../_Images/m/img_background.png) repeat left top;}
#container { background:#f7f7f7;}
#footer {width:100%;position:relative;padding:2.5rem 1.5rem;background:#363636;}
.foot_info {font-size:1.2rem;color:#fff;}
.foot_info b {font-family:"ns-medium";}
.name {font-size:1.3rem; color:#fff; font-weight:bold;}
.copy {color:#a6a6a6;}
.up_btn {position:fixed;bottom:1rem;right:1rem;width:4rem;height:4.1rem;background:url(../_Images/m/icon_sp.png) no-repeat 0 -30px;background-size:250px 250px;display:none;}



/* gnb */
.gnb {width:266px;position:fixed;top:0;left:-266px;bottom:0;z-index:100;background:#fff;}
.gnb_tit {font-family:"ns-medium";height:5.2rem;line-height:5.2rem;border-bottom:1px solid #005bab; background:#4d67a3 url(../_Images/m/btn_close.png) no-repeat right 50%; color:#ffffff; padding-left:1.8rem}
.gnb_tit a {font-family:"ns-medium";vertical-align:middle;color:#000;}
.gnb_tit a::before {content:"";display:inline-block;width:3rem;height:3rem;margin-right:0.5rem;background:url(../_Images/m/icon_sp.png) no-repeat -27px 0;background-size:250px 250px;vertical-align:middle;}
.gnb a {display:block;}
.gnb .depth1 > li.on > a {color:#2253af;}
.gnb .depth1 > li > a {position:relative;padding-left:1.8rem;line-height:4.8rem;font-family:"ns-medium";border-bottom:1px solid #e0e0e0;}
.gnb .depth1 > li > a::after {content:"";position:absolute;top:50%;right:1.8rem;width:1.1rem;height:1.1rem;margin-top:-0.7rem;background:url(../_Images/m/icon_sp.png) no-repeat -96px -17px;background-size:250px 250px;}
.gnb .depth1 > li.on > a::after {background-position:-96px -31px;width:1.1rem;height:0.2rem;margin-top:-0.1rem;}
.gnb .depth1 > li.on .depth2 {display:block;}
.gnb .depth2 {display:none;}
.gnb .depth2 > li > a {position:relative;padding-left:2.8rem;line-height:3.8rem;font-size:1.4rem;background:#f2f4f6;border-bottom:1px solid #d9dfe5;font-family:"ns-regular";}
.gnb .depth2 > li.on > a::after {background-position:-96px -31px;width:1.1rem;height:0.2rem;margin-top:-0.1rem;}
.gnb .depth2 > li > a::after {content:"";position:absolute;top:50%;right:1.8rem;width:1.1rem;height:1.1rem;margin-top:-0.7rem;background:url(../_Images/m/icon_sp.png) no-repeat -96px -17px;background-size:250px 250px;}
.gnb .depth2.arw > li > a::after,
.gnb .depth2 .gnb_arw::after {content:"";position:absolute;right:2rem;top:52%;width:0.8rem;height:1.1rem;background:url(../_Images/m/icon_sp.png) no-repeat -228px 0;background-size:250px 250px;}
.gnb .depth2 > li.on .depth3 {display:block;}
.gnb .depth3 {background:#e1e6ea;border-bottom:1px solid #d9dfe5;display:none;}
.gnb .depth3 li {padding-left:3.8rem;border-bottom:1px solid #d9dfe5;}
.gnb .depth3 li:last-child {border-bottom:0;}
.gnb .depth3 a {line-height:3.8rem;font-size:1.4rem;color:#666;}
.gnb .depth3 a::before {top:1.8rem;}
.gnb .depth3 a::after {content:"";position:absolute;right:2rem;top:1.3rem;width:0.8rem;height:1.1rem;background:url(../_Images/m/icon_sp.png) no-repeat -228px 0;background-size:250px 250px;}
/*.gnb .depth2,
.gnb .depth3 {display:none;}*/
.gnb-open {position:fixed;}


/* 서브 컨텐츠(기본) */
.sub_inner {padding:1.4rem 1.5rem 3rem 1.5rem;}
.sub_box {background:#f7f7f7;padding:2rem 1.5rem;border-radius:8px;}


/* 타이틀 */
.tit_type {display:block;height:3rem;line-height:3rem;font-size:1.7rem;font-family:"ns-medium";}
.nav {position:relative;height:5rem;line-height:5rem;background:url(../_Images/m/img_background.png) repeat 50% top;text-align:center;}
.sub_tit {font-size:1.8rem;color:#fff;font-family:"ns-medium";}
.back_btn {position:absolute;left:0;top:0;width:5rem;height:5rem;background:url(../_Images/m/btn_back.png) no-repeat 0 0;background-size:50px 50px;}

/* 버튼 */
.btn_type1 {padding:0 3rem;height:4rem;line-height:4rem;text-align:center;color:#fff;background:#afb4bb;font-size:1.5rem;font-family:"ns-medium";border-radius:3px;}
.btn_type2 {padding:1rem 3rem;text-align:center;color:#fff;background:#1b386e;font-size:1.5rem;font-family:"ns-medium";border-radius:3px;}
.calendar {width:3.0rem;height:3.0rem;background:url(../_Images/m/calendar.png) no-repeat 50% 50%;background-size:50px auto;vertical-align:middle;}
.camera {width:3.0rem;height:3.0rem;background:url(../_Images/m/btn_camera.png) no-repeat 50% 50%;background-size:50px auto;vertical-align:middle;}
.edit_btn {padding:0 1.5rem;height:3rem;line-height:2.8rem;text-align:center;border:1px solid #ccc;font-size:1.3rem;font-family:"ns-medium";}

.center_box {text-align:center;}
.right_box {text-align:right;}



/* 테이블 */
.tbl table {width:100%;}
.tbl.scroll { overflow-x:auto; margin-top:auto;}
.tbl_type1 {border-top:1px solid #1b386e;border-bottom:1px solid #cccccc;}
.tbl_type1 thead th {padding:1.2rem 0.5rem;font-size:1.3rem;font-family:"ns-medium";color:#333333;background:#e9e9e9;text-align:center;white-space:nowrap}
.tbl_type1 tbody td {padding:1.2rem 0.5rem;font-size:1.3rem;color:#333333;text-align:center;white-space:nowrap}
.tbl_type1 tbody td a {color:#0050c5;}
.tbl_type1 tbody tr {background:#fff;}
.tbl_type1 tbody tr:nth-child(even) {background:#e9e9e9;}

.tbl_type2 {border-top:1px solid #1b386e;border-bottom:1px solid #cccccc;}
.tbl_type2 tbody th {padding:1.2rem 1rem;font-size:1.3rem;font-family:"ns-medium";color:#333333;background:#e9e9e9;text-align:center;border-bottom:1px solid #cccccc;white-space:nowrap}
.tbl_type2 tbody td {padding:1.2rem 1rem;font-size:1.3rem;color:#333333;border-bottom:1px solid #cccccc;background:#fff;white-space:nowrap}
.tbl_type2 tbody td a {color:#333;}
.tbl_type2 tbody td .select {width:9rem;height:2.8rem;line-height:2.8rem;border:1px solid #ccc;border-radius:0;font-size:1.3rem;}
.tbl_type2 tbody td .input {height:2.8rem;line-height:2.8rem;padding-left:0.8rem;border:1px solid #ccc;font-size:1.3rem;}
.tbl_type2 tbody td .input::-webkit-input-placeholder {color:#777;}



/* ------------------------------------------------------------------------------
폼form
------------------------------------------------------------------------------ */
/* 인풋 */
.input {height:3.6rem;line-height:3.6rem;padding-left:0.8rem;border:1px solid #ccc;font-size:1.3rem;}
.input::-webkit-input-placeholder {color:#777;}

/* 인풋(검색) */
.search_input {border:1px solid #ccc; background:#fff;}
.search_input .input {width:calc(100% - 3.5rem);height:3.4rem;border:0;}
.search_input button {width:3.2rem;height:3.4rem;background:url(../_Images/m/btn_search.png) no-repeat 0 0;background-size:30px 33px;}


/* 셀렉트박스 */
.select {width:9rem;height:3.6rem;line-height:3.6rem;border:1px solid #ccc;border-radius:0;font-size:1.3rem;}


/* 체크박스 */
.checkbox {padding:0 0 1.5rem;}
.checkbox:after{ display:block; visibility:hidden; height:0; font-size:0; clear:both; content:'';}
.checkbox li { float:left; margin-right:2rem;}
.checkbox li label { color:#222; font-size:1.3rem;}
input[type='checkbox']{ -webkit-appearance:checkbox; border:0; border-radius:0; -webkit-appearance:none; background:url(../_Images/m/n_ch_off2.png) no-repeat left top; background-size:22px 21px; width:2.2rem; height:2.1rem; margin-right:0.3rem}
input:checked[type='checkbox']{ background:url(../_Images/m/n_ch_on2.png) no-repeat left top; background-size:22px 21px;}

/* 라디오 버튼 */
.label_radio label {font-size:1.3rem;color:#666;font-family:"ns-medium";}
.label_radio.on label {color:#385dae;}
.radio {
	width:1.6rem;
	height:1.6rem;
	-webkit-appearance:none; /* 크롬, 사파리 */
	-moz-appearance:none; /* 파폭 */
	appearance:none;
	border-radius:0;
	border:0;
}
.radio:checked {background-position:0 0;}

/* textarea */
.textarea {width:100%;resize:none;padding:2rem 1rem;border:1px solid #ccc;background:#fafafa;font-size:1.4rem;}
.textarea::-webkit-input-placeholder {color:#777;}

/* 폼(디자인) */
.form_box .search_input {width:calc(100% - 14.6rem);height:3.6rem;margin-left:0.6rem;}

.form_box1 {padding-bottom:1.5rem}
.form_box1 .search_input {width:calc(100% - 10rem);height:3.6rem;margin-left:0.6rem;}
.form_box1.type2 {padding:1.3rem 0;border-bottom:1px solid #d9dfe5;}

#login_wrap {min-width:320px;max-width:500px;width:100%; background:url(../_Images/m/login_logo.png) no-repeat center 4rem;background-size:12rem 12rem; margin:0 auto;}
#login_wrap article { overflow:hidden;}
/* 로그인 */
.login { background:#FFFFFF; padding:2rem 3rem 0rem;}
.login .ln { display:table; width:100%;}
.login .ln .g1 { display:table-cell; vertical-align:top;}
.login .ln .g1 .st { border:1px #B7B7B7 solid; border-radius:3px; padding:5px; margin:0 10px 10px 0; background:#fff;}
.login input[type='text'],
.login input[type='password'] { font-size:1.5rem; font-weight:bold; width:100%; border:0; border-bottom:0.1rem solid #b6b6b6; height:3.4rem; padding-left:2.5rem; margin-bottom:2.7rem}
.login input:focus {border-bottom:0.1rem solid #455356;}
.login input[type='text']:nth-child(1) {background:url(../_Images/m/icon_id.png) no-repeat left 50%; background-size:25px 25px;}
.login input[type='password']:nth-child(2) {background:url(../_Images/m/icon_pw.png) no-repeat left 50%; background-size:25px 25px;}

.login ::-webkit-input-placeholder { color:#b6b6b6; }
.login ::-moz-placeholder { color:#b6b6b6; } /* firefox 19+ */
.login :-ms-input-placeholder { color:#b6b6b6; } /* ie */
.login input:-moz-placeholder { color:#b6b6b6; }
.login .checkbox {margin-bottom:3rem}
.login .checkbox:after{ display:block; visibility:hidden; height:0; font-size:0; clear:both; content:'';}
.login .checkbox li { float:left; margin-right:2rem;}
.login .checkbox li label { color:#727272; font-size:1.3rem; vertical-align:middle}
.login .checkbox li label input { }
.login p {text-align:center; font-size:1.3rem; height:4rem}
.login p span a { padding:0rem 2rem; text-decoration:underline;}

/* 서브타이틀 */
#mainTitle {width: 100%; position: relative; height:5rem; color:#fff; font-size: 2.7rem; font-weight:bold; color:#455356; line-height:5rem; font-family:arial,sans-serif; margin-top:18rem;}
#mainTitle > p { text-align:center;}
#mainTitle > p > a {color:#fff;}

/* 체크박스 */
.checkbox {padding:0 0 1rem;}
.checkbox:after{ display:block; visibility:hidden; height:0; font-size:0; clear:both; content:'';}
.checkbox li { float:left; margin-right:2rem;}
.checkbox li label { color:#222; font-size:1.3rem;}

/* 로그인버튼 */
.btn_login { width:96%;padding:0 2rem;height:4.3rem;line-height:4.3rem;text-align:center;color:#fff;background:#5e75c3;font-size:1.5rem;font-family:"ns-medium";border-radius:2.3rem; vertical-align:middle}
.login_bt_area {text-align:center; margin-bottom:3rem;}