@charset "utf-8";
@import url("common.css");
@import url("../font.css");

html {-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;}
body {font-family: 'Noto Sans KR'; color:#555; font-size:14px; letter-spacing: -0.04em;}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, address, dfn, em, font, img, samp, small, strong, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, article, aside, header, footer, figure, figcaption, nav, section {margin: 0; padding: 0; border:0;}

h1, h2, h3, h4, h5, h6 {font-weight: normal;}
ol, ul {list-style: none;}
em, address {font-style:normal;}
blockquote, q  {quotes:none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content:none;}
table  {border-collapse: collapse; border-spacing: 0; table-layout: fixed; border: 0; width: 100%;}
legend, caption {width: 0; height: 0; visibility: hidden; font-size: 0; line-height: 0;}
button  {margin: 0; padding: 0; border: 0; font: inherit; color: inherit; background: transparent; line-height: 1; cursor: pointer;}
a:link, a:visited, a:hover, a:active, a:focus {text-decoration: none; color: inherit; /*outline: none;*/}
b, strong {font-weight: 500;}
.hidden {text-indent: -9999px; overflow: hidden; line-height: 0; width: 0; height: 0; display: inline-block; position: absolute;}

input, select  {color: inherit; font-family: 'Noto Sans KR'; box-sizing: border-box; font-size: 14px; color: #555;}
input[type="text"], input[type="password"], input[type="email"] {padding: 5px 15px; border: 1px solid #a9a9a9; font-weight: 300;}
input[type="radio"] {margin: 0; vertical-align: middle; border: none; cursor:pointer;}
input[type="checkbox"] {margin: 0; vertical-align: middle; border: none; cursor:pointer;}
textarea  {resize: vertical; font: inherit;  overflow-y: auto; box-sizing: border-box; padding: 10px 15px; border:1px solid #a9a9a9; font-size: 14px; color: #555; font-weight: 300; width: 100%; display: block;}


input[type="text"]::placeholder, input[type="password"]::placeholder, input[type="email"] {color: #999; font-weight: 300}
input[type="text"]::-webkit-input-placeholder, input[type="password"]::-webkit-input-placeholder, input[type="email"]::-webkit-input-placeholder {color: #999; font-weight: 300}
input[type="text"]:-ms-input-placeholder, input[type="password"]:-ms-input-placeholder, input[type="email"]:-ms-input-placeholder {color: #999; font-weight: 300}
select {-webkit-appearance: none; -moz-appearance: none; appearance: none; background: url("../../images/front/sub/ic_select_arrow.png") no-repeat right 12px center #fff; background-size: 9px; padding-right: 35px; border: 1px solid #616161; font-weight: 300;}
select::-ms-expand { display: none; }

.css_radio:focus+label, .css_check:focus+label, .css_checkbox:focus+label {outline: 2px dotted #000;}

/* ================================
	skipnavigation
=============================== */
#skipnavigation a {position:absolute; top:-10000px; left:0; display: block;}
#skipnavigation a:focus:hover,
#skipnavigation a:focus,
#skipnavigation a:active {width: 100%; height: 35px; line-height: 32px; background: #3a589e; color: #fff; font-size: 15px; text-align: center; font-weight: 400; z-index: 9999; top: 0;}

/* ================================
	common
================================ */
.t_point {color: #da4267 !important;}
.t_b_point {color: #3a589e !important;}
.t_star:before {content: " * "; position: relative; top: 4px; left: 2px; padding-right: 2px;}
.t_pre {white-space:pre-line; font-family: inherit; font-size: inherit; color: inherit;}
.tw400 {font-weight: 400 !important;}
.tw300 {font-weight: 300 !important;}
.underl {text-decoration: underline !important;}

.tip {position: relative; font-size: 13px; padding-left:14px; font-weight: 400;}
.tip::before {content: '※'; color: #d00000; position: absolute; left: 0; top: 0;}
.tip2 {background:url(../../images/mng/bull_mando.png) no-repeat right 1px top 6px; padding-right:13px;}
.tip3 { background:url(../../images/mng/bull_mando.png) no-repeat left 5px; padding-left:12px; font-size: 13px; font-weight: 400;}


	/* display */
	.blind {text-indent: -9999px; overflow: hidden; line-height: 0; width: 0; height: 0; display: inline-block; position: absolute;}
	.dnone{display: none !important;}
	.diblk {display: block;}
	.dis_ib {display: inline-block;}
	.pchi {display: none !important;}

	/* align */
	.fl {float: left !important;}
	.fr {float: right !important;}
	.Lalign {text-align: left !important;}
	.Calign {text-align: center !important;}
	.Ralign {text-align: right !important;}
	.Talign {vertical-align: top !important;}
	.Valign {vertical-align: middle !important;}

	/* form */
	.css_select {display: inline-block; width:190px; vertical-align: middle; height: 38px; padding-left: 15px; letter-spacing: -0.06em;}
	.css_select_sm {display: inline-block; height: 35px; padding-left: 10px; vertical-align: middle; font-size: 14px; min-width:80px; background: #fff; color: #555; letter-spacing: -0.06em;}
	.css_count {display: inline-block; height: 35px; padding-left: 10px; vertical-align: middle; font-size: 14px; min-width:80px; color: #555; letter-spacing: -0.06em; margin-left: 5px; background: url(../../images/front/sub/ic_select_arrow.png) no-repeat right 12px center #fff; background-size: 9px;}

	.css_txt {display: inline-block; height:38px; width: 410px; max-width: 100%; vertical-align: middle; background:#fff;}
	.css_txt_md {display: inline-block; height:38px; width: 300px; max-width: 100%; vertical-align: middle; background:#fff;}
	.css_txt_sm {display: inline-block; height:38px; width: 120px; max-width: 100%; vertical-align: middle; background:#fff;}
	.readonly, input[type="text"]:disabled, input[type="text"]:read-only {background: #efefef;}

	.css_radio {position: absolute; left: 0; opacity: 0;}
	.css_radio+label {display: inline-block; vertical-align: middle; position: relative; padding-left: 22px; cursor: pointer; margin-right: 10px;}
	.css_radio+label:before {content: ''; position: absolute; left: 0; top: 5px; width: 15px; height: 15px; background: url(../../images/front/sub/radio_box.gif) no-repeat left center;}
	.css_radio:checked+label:before {background-position: -17px;}
	.css_radio2 {display: none;}
	.css_radio2+label {display: inline-block; vertical-align: middle; text-indent: -9999px; width: 20px; height: 20px; border: 1px solid #ababab; background-color: #ffffff; box-sizing: border-box; border-radius: 50px; position: relative; cursor: pointer;}
	.css_radio2:checked+label:before {content: ""; position: absolute; top: 4px; left: 4px; width: 10px; height: 10px; background: #3a589e; border-radius: 50px;}

	.css_check {position: absolute; left: 0; opacity: 0;}
	.css_check+label {display: inline-block; vertical-align: middle; text-indent: -9999px; width: 16px; height: 16px; background: url("../../images/front/sub/check_box.gif") left center; cursor: pointer;}
	.css_check:checked+label {content: ""; background-position: -16px center;}
	.css_checkbox {position: absolute; left: 0; opacity: 0;}
	.css_checkbox+label {position: relative; padding-left: 24px; cursor: pointer;}
	.css_checkbox+label:before {content: ''; position: absolute; left: 0; top: 3px; width: 16px; height: 16px; background: url(../../images/front/sub/check_box.gif) no-repeat left center; vertical-align: 1px;}

	.css_label {display: inline-block; vertical-align: middle; margin-right: 10px;}
	.css_txtarea.readonly {resize: none;}

	.css_checkbox:checked+label:before {background-position: -16px;}
	.css_min_text_box {width: 96%; height: 40px; border: 1px solid #a9a9a9;}
	.css_select_box {width: 189px; height: 40px; padding-left: 20px; background-position: right 20px center; font-size: 15px;}
	.css_select_boxs {width: 189px; height: 40px; padding-left: 20px; border-color: #616161; background-position: right 20px center; font-size: 15px; margin-right: 9px;}
	.css_select_long {width: 94%;}
	.css_min1_text_box {width: 116px; height: 38px; margin-right: 3px; border: 1px solid #a9a9a9;}
	.css_min2_text_box {width: 136px; height: 38px; margin: 0 12px 0 3px; border: 1px solid #a9a9a9;}
	.css_min3_text_box {width: 200px; height: 40px; margin: 0 25px 0 10px; border: 1px solid #a9a9a9;}
	.css_search01_text_box {width: 276px; height: 40px; margin-right: 10px; border: 1px solid #a9a9a9;}
	.css_search02_text_box {width: 386px; height: 40px; margin-right: 10px; border: 1px solid #a9a9a9;}
	.css_search03_text_box {width: 296px; height: 40px; margin-right: 10px; border: 1px solid #a9a9a9;}
	.css_search04_text_box {width: 245px; height: 40px; margin-right: 5px;  border: 1px solid #a9a9a9; vertical-align: middle;}
	.css_file_text_box {width: 260px; height: 40px; margin-right: 10px; border: 1px solid #a9a9a9;}
	.css_date_text_box {width: 334px; height: 40px; border: none;}
	.txt_all_box {resize: none; width: 100%; height: 254px; border: 1px solid #a9a9a9;}

	.css_b_label {margin-left: 10px; vertical-align: middle;}

	.form_textarea .letter_count {float: right; margin: 3px 0 4px; border: 1px solid #d0d4d8; padding: 3px 8px; font-size: 13px; background: #f5f5f5; letter-spacing: -0.5px;}
	.form_textarea .letter_count em {color: #da4267; font-weight: 600;}

	/* margin */
	.mr0 {margin-right: 0px !important;}
	.mr3 {margin-right: 3px !important;}
	.mr4 {margin-right: 4px !important;}
	.mr5 {margin-right: 5px !important;}
	.mr10 {margin-right: 10px !important;}
	.mr15 {margin-right: 15px !important;}

	.ml0 {margin-left: 0px !important;}
	.ml4 {margin-left: 4px !important;}
	.ml5 {margin-left: 5px !important;}
	.ml10 {margin-left: 10px !important;}

	.mt0 {margin-top: 0px !important;}
	.mt5 {margin-top: 5px !important;}
	.mt10 {margin-top: 10px !important;}
	.mt30 {margin-top: 30px !important;}
	.mt50 {margin-top: 50px !important;}

	.mb0 {margin-bottom: 0px !important;}
	.mb6 {margin-bottom: 6px !important;}
	.mb10 {margin-bottom: 10px !important;}
	.mb15 {margin-bottom: 15px !important;}
	.mb25 {margin-bottom: 25px !important;}

	/* padding */
	.p0 {padding: 0 !important;}
	.pl0 {padding-left: 0 !important;}
	.pl10 {padding-left: 10px !important;}
	.pl20 {padding-left: 10px !important;}

	.pr0 {padding-right: 0 !important;}

	.pt20 {padding-top: 20px !important;}

	.pb20 {padding-bottom: 20px !important;}

	.plr5 {padding: 5px 0;}

	/* width */
	.w50 {width: 50px;}
	.wp3 {width: 3%;}
	.wp4 {width: 4%;}
	.wp5 {width: 5%;}
	.wp6 {width: 6%;}
	.wp8 {width: 8%;}
	.wp9 {width: 9%;}
	.wp10 {width: 10%;}
	.wp11 {width: 11%;}
	.wp12 {width: 12%;}
	.wp13 {width: 13%;}
	.wp14 {width: 14%;}
	.wp15 {width: 15%;}
	.wp18 {width: 18%;}
	.wp20 {width: 20%;}
	.wp22 {width: 22%;}
	.wp30 {width: 30%;}
	.wp80 {width: 80%;}
	.wp100 {width: 100% !important;}

	.ws100 {width: 100px !important;}
	.ws170 {width: 170px !important;}

/* ================================
	TABLET
=============================== */
@media screen and (max-width: 800px) { /* 기존 max-width 1024 -> 800 으로 통합 */

	/* ================================
		common
	=============================== */
	body {font-size: 14px;}
	.mbhi {display: none !important;}
	.pchi {display: block !important;}
	.mWP20 {width: 20% !important;}
	.mWP25 {width: 25% !important;}
	.mWP40 {width: 40% !important;}
	.mWP50 {width: 50% !important;}
	.mWP80 {width: 80% !important;}
	.mW60 {width: 60px !important;}
	.mW65 {width: 65px !important;}
	.mW70 {width: 70px !important;}
	.mW85 {width: 85px !important;}
	.mW100 {width: 100px !important;}
	.mW115 {width: 115px !important;}
	.mW150 {width: 150px !important;}
	.mW180 {width: 180px !important;}
	.mW300 {width: 300px !important;}

	.css_input {height: 35px; font-size: 14px;}
	.css_select {height: 35px; font-size: 14px;}
	.css_count {min-width: 60px; margin-top: -15px;}
	.css_search01_text_box {width: 100%; margin: 0 0 10px 0;}

	/* 사파리 브라우저 모양 변형 방지 */
	input:not([type="radio"]):not([type="checkbox"]), textarea, button {-webkit-appearance:none; -moz-appearance:none; appearance:none;}
	input:not([type="radio"]):not([type="checkbox"]), textarea, button, select {-webkit-border-radius:0; -moz-border-radius:0; -o-border-radius:0; border-radius:0;}
}

.error {background: #fff000 !important;}