@charset "utf-8";

/* ==============================
 * font
 * ============================== */
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

/* ==============================
 * library
 * ============================== */
@import url(lib/normalize.min.css);
@import url(lib/animated.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.4/css/jquery-ui.min.css);

/* ==============================
 * base
 * ============================== */
h1, h2, h3, h4, h5, h6, fieldset,ul, ol, dl, dt, dd, p, button ,figure{margin:0;padding:0;}
body{font:normal 13px/1.3 '나눔고딕', 'Nanum Gothic','맑은 고딕','Malgun Gothic', sans-serif;color:#666;}
legend, caption{position:absolute;display:block;overflow:hidden;width:0px;height:0px;font-size:0;line-height:0;text-indent:-9999px;}
a{text-decoration:none;color:inherit;}
img{vertical-align:middle;}
fieldset, button{background:none;border:0px;}
ul:after,ol:after{content:'';display:block;clear:both;}
li{list-style:none;}
table{width:100%;border-spacing:0px;table-layout:fixed;}
iframe{width:100%;vertical-align:middle;border:0 none;}
hr{margin:10px 0;border:0 none;height:1px;background:#c9c9c9;}
ul:after {content:"";display: block; clear:both;}
/* Chrome, Safari용 스크롤 바 */
/*::-webkit-scrollbar{width:8px;height:8px;border:3px solid #fff;}
::-webkit-scrollbar-track{background:#efefef;-webkit-border-radius:10px;border-radius:10px;-webkit-box-shadow:inset 0 0 4px rgba(0,0,0,.2)}*/

/* ==============================
 * mobile_base
 * ============================== */
/*iphone 글자크기 자동조정 방지*/
/*body{-webkit-text-size-adjust:none;} */
/*안드로이드 주황색 포커스 제거 */
/*body{-webkit-tap-highlight-color:rgba(0, 0, 0, 0);} */
/*iphone 폼요소 리셋 */
/*input, select{-webkit-appearance:none;-webkit-border-radius:0}*/


/* ==============================
 * layout
 * ============================== */
html,body{height:100%;}
body.hidden{overflow:hidden;}
body.gnb_open {overflow:hidden;}
body.gnb_open:after {content:"";display: block; position:fixed;top:0;left:0;width: 100%;height: 100%; background: rgba(0,0,0,0.5);transition:ease-in}
body {overflow-y:scroll;background:#f5f5f8;}
#wrap{position:relative;}
#header .hd_wrap {position:absolute;top:0;left:0;background:#fff;border-top:3px solid #0785c2;border-bottom:1px solid #e5e5e5;z-index:100;}
#header .logo{width:200px;height:72px;border-right:1px solid #e5e5e5;text-align:center;border-bottom: 1px solid #e5e5e5;z-index: 120;padding: 5px;}
#header .logo img {max-width:100%;max-height:38px}
#header .logo:before{content:'';display:inline-block;height:100%;vertical-align:middle;}
#header .gnb_wrap{border-right:1px solid #e5e5e5;transition:all 0.3s ease-in}
#gnb>ul>li{border-bottom:1px solid #e5e5e5;}
#gnb>ul>li>a{position:relative;display:block;padding:0px 10px 0px 15px;font-weight:bold;font-size:14px;color:#222;line-height:47px;}
#gnb>ul>li.on>a,
#gnb>ul>li>a:hover {background:#f5f5f8;}
#gnb>ul>li>a:before,
#gnb>ul>li>a:hover:before {content:'';display:block;width:3px;position:absolute;left:0;top:50%;height:0;background:#222;transition:all 0.3s ease;}
#gnb>ul>li.on >a:before,
#gnb>ul>li>a:hover:before {top:0;height:100%;}
.btn_gnb {display: none;width: 30px; height:30px;text-indent: -999em;position: fixed;top:24px;left:15px;z-index: 200;}
.btn_gnb i {display: block;width: 100%;height:4px; background: #000;position:absolute;top:2px;left:0;}
.btn_gnb i:before,
.btn_gnb i:after {content:"";display: block;width: 100%;height:4px; background: #000;position:absolute;left:0;}
.btn_gnb i:before {top:12px;}
.btn_gnb i:after {top:24px;}
.gnb_open .btn_gnb i {background: transparent;}
.gnb_open .btn_gnb i:after {top:10px; transform:rotate(45deg)}
.gnb_open .btn_gnb i:before {top:10px; transform:rotate(135deg)}


.inner{width:1100px;margin:0 auto;}
.inner:after{content:''; display: block;clear: both;}
#container{position:relative;clear:both;padding-left:200px;}
#contents{padding:30px;}
#contents:after{content:''; display: block;clear: both;}

.cont_in{position:relative;padding:2em; background:#fff;border:1px solid #e0e5ec;}
h2 {margin-bottom: 10px;font-size: 30px;}
h3 {font-size: 20px;margin-bottom: 5px;}
h2 span {font-size: 16px; display: inline-block; vertical-align:middle;margin-left: 12px;font-weight: 500;}

footer .copy {text-align: right;padding: 15px;padding-right: 30px;border-top: 1px solid #e5e5e5;}
/* ==============================
 * common - 컨텐츠 공통
 * ============================== */
 h1, h2, h3, h4, h5, h6{color:#222;}

.t_red{color:#eb1c23;}
.t_black{color:#222222;}
.t_blue{color:#213ef4;}
.t_gray{color:#888;}

.t_center{text-align:center !important;}
.t_left{text-align:left;}
.t_right{text-align:right !important;}

.f_left{float:left;}
.f_right{float:right;}
.clear{clear:both;}
.clear:after{content:'';display:block;clear:both;}

.w_mini {width:35px !important;}
.w_10 {width:10% !important;}
.w_20 {width:20% !important;}
.w_30 {width:30% !important;}
.w_40 {width:40% !important;}
.w_50 {width:50% !important;}
.w_60 {width:60% !important;}
.w_70{width:70% !important;}
.w_80 {width:80% !important;}
.w_90 {width:90% !important;}
.w_100 {width:100% !important;}

.w10{width:10px !important;}
.w20{width:20px !important;}
.w30{width:30px !important;}
.w40{width:40px !important;}
.w50{width:50px !important;}
.w60{width:60px !important;}
.w70{width:70px !important;}
.w80{width:80px !important;}
.w90{width:90px !important;}
.w100{width:100px !important;}
.w150{width:150px !important;}
.w200{width:200px !important;}
.w300{width:300px !important;}
.w400{width:400px !important;}

.mb10{margin-bottom: 10px;}
.ml10{margin-left: 10px;}

.block{display:block !important;}
.inblock{display:inline-block !important;}
.hide{display:none !important;}
.hidden{overflow:hidden !important;}
.scr_y {overflow-y: scroll;}
.blind{position:absolute;display:block;overflow:hidden;width:0px;height:0px;font-size:0;line-height:0;text-indent:-9999px;}
.ellipsis{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis;}
.op80{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";filter:alpha(opacity=80);-moz-opacity:0.8;-khtml-opacity:0.8;opacity:0.8;}
.bg_layer{display:block;position:fixed;top:0;left:0;width:100%;height:100%;background:#333;opacity:0.6;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";filter:alpha(opacity=60);-moz-opacity:0.6;-khtml-opacity:0.6;z-index:200;}
.blur img{-webkit-filter:blur(6px);-moz-filter:blur(6px);filter:blur(6px);}
.grayscale img{
	filter:url(filters.svg#gray);/* Gecko and FF*/
	filter:gray;/* IE */
	-moz-filter:grayscale(1);
	-ms-filter:grayscale(100%);
	-o-filter:grayscale(100%);
	-webkit-filter:grayscale(1);}
a.grayscale:hover img, a.grayscale:focus img, a.grayscale:active img{
	filter:none;
	-moz-filter:none;
	-ms-filter:none;
	-o-filter:none;
	-webkit-filter:none;}

#btnTop{display:none;position:fixed;right:10px;bottom:10px;width:40px;line-height:40px;font-size:1.5em;text-align:center;color:#fff;background:#297d2e;opacity:0.7;filter:alpha(opacity=70);border-radius:100%;z-index:50;}
	#btnTop:hover, #toTop:focus, #toTop.hover{opacity:1;filter:alpha(opacity=100);}

/* form */
.input,.textarea{display:inline-block;height:30px;line-height:28px;padding:0px 10px;border:1px solid #d9d9d9;border-radius:0;background:#fff;-webkit-transition-duration:.1s;-moz-transition-duration:.1s;-o-transition-duration:.1s;transition-duration:.1s;vertical-align:middle;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-size:12px;}
.input.readonly, .textarea.readonly, .select.readonly {background: #f9f9f9 !important;}
.select:hover, .input:hover, .textarea:hover,
.select:focus, .input:focus, .textarea:focus{border-color:#777}
.select:read-only, .input:read-only, .textarea:read-only,
.select.readonly, .input.readonly, .textarea.readonly{border-color:#d9d9d9}
.select:disabled, .input:disabled, .textarea:disabled{background-color:#eee;}
.select{display:inline-block;height:30px;line-height:28px;padding:0 40px 0 10px;border:1px solid #d9d9d9;border-radius:0;vertical-align:middle;box-sizing:border-box;font-size:12px;
	-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-rtl-ordering:logical;background:#fff url(../images/bg_select.png) no-repeat right center;}
.select::-ms-expand{display:none;}
.select.h40{height:40px;line-height:38px;font-size:14px;}
.textarea{width:100%;height:100px;padding:10px;resize:none;line-height:1.3;box-sizing:border-box;}

.btn_input_wrap {padding-right: 100px; position: relative;}
.btn_input_wrap .button {position: absolute;top:0;right:0;width: 90px;}
 /* 버튼 */
.button_box{padding:39px 30px;text-align:center;}
.button{display:inline-block;position:relative;height:30px;line-height:28px;padding:0px 15px;border:1px solid #e0e5ec;background:#ffffff;text-align:center;color:#444;vertical-align:middle;font-size:12px;border-radius:2px;cursor:pointer;box-sizing: border-box;}
.button:hover,.button:focus,.button:active{text-decoration:none !important}
.button:active{transform:scale(0.95)}

.button.btn_red{background:#eb1c23;border-color:#eb1c23;color:#fff}
.button.btn_gray{background:#838d96;border-color:#838d96;color:#fff}
.button.btn_gray2{background:#f4f4f4;border-color:#b0b0b0;color:#878787;border-radius:3px;}
.button.btn_black{background:#1e2225;border-color:#1e2225;color:#fff}
.button.btn_green{background:#007a4f;border-color:#007a4f;color:#fff}
.button_wrap {margin: 20px 0;}

.radio{position:relative;display:inline-block;min-width:20px;min-height:20px;margin:3px 0;vertical-align:middle;}
.radio input[type="radio"]{opacity:0;position:absolute;left:0;top:0;width:20px;height:20px;margin:0;padding:0;z-index:1;}
.radio input:checked, .radio input:focus{outline:none! important}
.radio i{position:absolute;left:0;top:0;display:inline-block;width:20px;height:20px;}
.radio i:before{content:'';display:block;width:20px;height:20px;border:1px solid #d5d9e0;box-shadow:0 1px 2px rgba(0, 0, 0, 0.05);background:#fff;box-sizing:border-box;vertical-align:middle;}
.radio input:checked+i:before {border-color:#4b8ec3;}
.radio input+i:after{content:'';display:inline-block;position:absolute;}

.radio input+i:after{width:6px;height:9px;top:3px;left:6px;background:transparent;border:solid #ddd;border-width:0 2px 2px 0;transform:rotate(35deg);;}
.radio input:checked+i:after{border-color:#4b8ec3;}

 /* ==============================
 * popup
 * ============================== */
.pop_wrap{display:none;position:fixed;left:0;right:0;top:0;bottom:0;padding:10px;background:url(../images/bg_popup.png);overflow:auto;z-index:200;}
.pop_wrap .popup{position:relative;max-width:500px;margin:0 auto;border:1px solid #2d3143;background:#fff;}
.pop_wrap .pop_head{background:#4b8ec3;padding:12px 30px;border-bottom:1px solid #2d3143;height:26px;overflow:hidden;}
.pop_wrap .pop_head h1{color:#fff;font-size:20px;font-weight:normal;}
.pop_wrap .pop_cont{padding:15px;}
.pop_wrap .btn_close{display:block;width:50px;height:50px;position:absolute;right:0px;top:0px;background:url(../images/spr.png) no-repeat 0px -26px;text-indent:-999em;font-size:0;}

 /* ==============================
 * ie
 * ============================== */
.lt-ie9 .radio i:before{border:0 none;}
.lt-ie10 .select{padding:5px;background:none;}
.lt-ie10 .select.h40{padding:7px;}

@media only screen and (max-width: 950px){
#header .logo {width: 100% !important;}
#container {padding-left: 0 !important;}

#header .logo {position:fixed;top:0;left:0;width: 100%;background: #fff;border-bottom: 2px solid #0785c2;}
#header .hd_wrap {top:-300px;width: 100%;text-align: center;transition:top 0.3s ease-in;}
.gnb_open #header .hd_wrap {top:84px;position:fixed;}
#container {padding-left: 0;padding-top: 85px;}
.btn_gnb {display: block;} 
h2 {font-size: 20px;margin-bottom: 5px;}
h3 {font-size: 15px; margin-bottom: 5px;}
.cont_in {padding: 1em;}
.radio{min-width:14px;min-height:14px;}
.radio input[type="radio"]{width:14px;height:14px;}
.radio i{width:14px;height:14px;}
.radio i:before{width:14px;height:14px;}
.radio input+i:after{width:4px;height:7px;top:1px;left:4px;}

.btn_input_wrap {padding-right: 0; }
.btn_input_wrap .button {position:relative;width: 100%;margin-top: 5px;}
}