@charset "utf-8";

/* *************** *
* 공통 CSS
/* *************** */
.dp_mobile{display: none;}
.text-hidden {
	width:1px;
	height:1px;
	margin: -1px;
	overflow:hidden;
	clip-path: polygon(0 0, 0 0, 0 0);
}
/* 글자넘어가면 점처리 */
.letterWrap {overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}

/* 로딩박스 */
.loading_box{width:100%; height:100%; position: fixed; top:0; left:0; z-index: 20000 ; display: none; }
.loading_box .bg{width:100%; position: absolute; top:0; left: 0; height: 100%; background-color: #000; opacity : 0.5; }
.loading_box img{position: absolute; top:50%; margin-top: -150px; left: 50%; margin-left: -150px; }

/* 마감 화면 처리 */
.deadline_box{width:100%; position: absolute; top:0; left:0; height:100%; z-index: 1;}
.deadline_box .deadline_bg{width:100%; height:100%; position: absolute; left:0; top:0; background: #000; opacity:0.5;}
.deadline_box .deadline_img{ width:125px !important; height:67px !important; position: absolute; top:50%; left: 50%; margin-left: -63px !important; margin-top:-34px !important;}

/* 공통 클래스 Css */
.clear {clear: both; } 
.pointer {cursor: pointer; }
.select {font-weight: bold; }  

.clearfix:after { visibility: hidden;display:block;font-size: 0;content:".";clear: both;height: 0;*zoom:1;}
.clearfix { display: inline-block; *display:inline; *zoom:1; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */

/* font_css */
.font_kopu {font-family:KoPubDotum;} 
.font_kopubatang {font-family:'KoPub Batang', serif; font-weight:bold;} 
.font_23 {font-size:23px;}
.font_bold {font-weight:bold;}

/* Input */
input.txt_st01 {padding:2px;border:1px solid #c8c8c8;color:#666;}
input.File_st01 {border:1px solid #c8c8c8;color:#666;}
textarea.st01 {padding:2px;border:1px solid #c8c8c8;color:#666;}
select.st01 {padding:2px;border:1px solid #c8c8c8;color:#666;}

/* BORDER */
.line_b1_w {border-bottom: 1px solid #737b7e;}
.line_t1_w {border-top: 1px solid #737b7e;}
.line_b1_b {border-bottom: 1px solid #000;}
.line_t1_b {border-top: 1px solid #000;}
.line_b1_g {border-bottom: 1px solid #737b7e;}
.line_t1_g {border-top: 1px solid #737b7e;} 
.line_b2_g {border-bottom: 1px solid #9F9F9F;}
.line_t2_g {border-top: 1px solid #9F9F9F;}

/* TEXT-ALING */
.textC { text-align:center !important; }
.textL { text-align:left !important; }
.textR { text-align:right !important; }

/* FONT-SIZE */
.fs14{font-size: 14px !important;}

/* COLOR */
.color_black {color:#000 !important;}
.color_blue {color:#6cbbf3;}
.color_white {color:#FFF;}
.bg_green_01 {background-color:#309878;}

/* DISPLAY */
.hide { visibility:hidden; }
.block { display:block; }
.none { display:none; }
.hide2 {overflow:hidden; position: absolute; top:0; left:0; width:0; height:0; font-size:0; line-height:0;} 
/* FLOAT */
.left { float:left; }
.right { float:right; }
.floatN { float:none; }

.clear:after{display:block; content:''; clear:both;}

.txt_nowrap {white-space:nowrap;}
.ls_m01 {letter-spacing:-1px;} /* Letter spacing */
.ls_nm {letter-spacing:normal !important;}

.fl {float:left !important; background: url('/kosep/pb/fr/images/sustainability/bg_service_ceo.jpg') top right no-repeat;}
.fr {float:right !important;}

/* clear class */
.clear {clear:both !important;}
.clfix:after {content:'.'; display:block; height:0px; clear:both; visibility:hidden;}
.clfix {display:inline-block;}
.clfix {display:block;}
* html .clfix {height:1%;} /* hides from ie-mac */
.clfix {zoom:1;} /*for ie 5.5-7*/

/* ALIGN */
.alC {text-align:center !important;}
.alL {text-align:left !important;}
.alR {text-align:right !important;}
.alJ {text-align:justify !important;}

.vaT {vertical-align:top !important;}
.vaM {vertical-align:middle !important;}
.vaB {vertical-align:bottom !important;}
.vapx {vertical-align:-1px !important;}

/*font-weight*/
.font_normal {font-weight:normal !important}

/* TEXT COLOR*/
.pointRe {color:#e60012 !important;}
.black { color:#262626 !important;}
.grayFS13 { color:#515151 !important; font-size:13px; font-weight:normal; }
.fc_org {color: #f55500 !important; }

/* TEXT SIZE */
.fs20 { font-size:20px; font-weight:600; }
.asterisk { background: url(/kosep/pb/fr/images/common/bg_asterisk.gif) 0 6px no-repeat;padding-left: 10px;margin-top: 10px; }
.redPoint { padding-left: 20px;margin-top: 5px; color:#e60012;} /* 2015.02.12 추가 */
.bluePoint { padding-left: 20px;margin-top: 5px; color:#0100ff;} /* 2015.02.12 추가 */
.bluePointA { margin-top: 5px; color:#0100ff;} /* 2016.02.12 추가 */
.asterisk.inner { margin-left:20px; }
.redPointA{ margin-top: 5px; color:#e60012;} /* 2016.02.17 추가 */

/* MARGIN */
.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;}
.mt450 { margin-top:470px !important;}
.mtMinus40 { margin-top:-40px !important;}
.mtMinus60 { margin-top:-60px !important;}
.mt47 { margin-top:47px !important;}
.mv10 { margin-top:30px !important; margin-bottom:-20px !important;}
.mv40 { margin-top:40px !important; margin-bottom:40px !important;}
.mv60 { margin-top:20px !important; margin-bottom:40px !important;}
.ml10 { margin-left:10px !important;}
.mb0 { margin-bottom:0px !important;}
.mb20 { margin-bottom:20px !important;}
.mb30 { margin-bottom:30px !important;}
.mb50 { margin-bottom:50px !important;}
.mb70 { margin-bottom:70px !important;}
.mb100 { margin-bottom:100px !important;}
.mbMinus40 { margin-bottom:-40px !important;}

/* PADDING */
.pt0 { padding-top:0px !important;}
.pt10 { padding-top:10px !important;}
.pt15 { padding-top:15px !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;}
.p60 { padding:40px 20px !important;}
.pb10 { padding-bottom:10px !important;}
.pl10 { padding-left:10px !important;}
.pl15 { padding-left:15px !important;}
.pl20 { padding-left:20px !important;}
.pl30 { padding-left:30px !important;}

/* HEIGHT */
.h230 { height:230px !important;}
.h260 { height:260px !important;}

.sub_header_gradation {
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(left,  #ffffff 0%, #ededed 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #ffffff 0%,#ededed 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #ffffff 0%,#ededed 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=1 ); /* IE6-9 */
}

/* POPUP 20180712 */
.modal_pop_wrap{display:none; position:fixed; top:0; right:0; left:0; bottom:0; z-index:500; background:rgba(0,0,0,0.5)}
.modal_pop_wrap .modal_pop{text-align:center; height:100%;}
.modal_pop_wrap .modal_pop > .inner_wrap{display:inline-block; position:relative; width:700px; max-height:700px; vertical-align:middle; text-align:left; box-sizing:border-box;}
.modal_pop:after{display:inline-block; content:''; height:100%; vertical-align:middle;}
.modal_pop .cont{overflow-y:auto; width:700px; height:610px; box-sizing:border-box; text-align:center;}
.modal_pop .btn_close{display:block; position:absolute; right:0; top:-50px; width:34px; height:33px; background:url('/kosep/static/img/common/btn_pop_close.png') 0 0 no-repeat;}
.modal_pop .img_open_pop{width:100%;}

/*********************
	Top Banner
**********************/
.top_banner_box {border-bottom:2px solid #999ba2; padding:35px 0 0 0; display: none;}
.top_banner_slide_box{position: relative;}
.top_banner_slide_arrow_left {width:5%; text-align:center; position: absolute;left: 0px;top: calc(50% - 20px); z-index: 1;}
.top_banner_slide_arrow_right {width:5%; text-align:center; position: absolute;right: 0px;top: calc(50% - 20px);}
.top_banner_slide_arrow_left img, .top_banner_slide_arrow_right img {max-width:100%;}
.top_banner_slide_contents {width:90%; float:left; box-sizing:border-box; }
.top_banner_slide_contents_one {box-sizing:border-box; text-align:center;}
.top_banner_slide_contents_one a:focus img, .top_banner_slide_contents_one a:focus img {border: 1px solid #07509f;}
.top_banner_close_box {text-align:right; padding:15px 5% 15px 0;; box-sizing:border-box; font-size:13px;}
.check_top_banner_close {height:13px; width:13px; border:1px solid #7b7b7b; background-color:#fff; vertical-align:middle;}
.btn_top_banner_close {background-color:transparent; border:none; margin:0 0 0 8px; width:15px; height:15px; background-image:url(/kosep/pb/fr/images/main/newMain/top_banner_close_btn.png); background-repeat:no-repeat; background-position:center center; cursor: pointer;}

.btn_top_banner_close_m{background-color:transparent; border:none;  background-repeat:no-repeat; background-position:center center; cursor: pointer;}
.banner_mobile_btn_box {display:none; box-sizing:border-box; padding:0.5%; background-color:#dddddd;}
.banner_mobile_btn_box:after { visibility: hidden;display:block;font-size: 0;content:".";clear: both;height: 0;*zoom:1;} 
.banner_mobile_btn {float:left; box-sizing:border-box; width:49%; margin:0.5%; text-align:center; padding:8px 0; font-weight:600; background-color:#fff; color:#404041; font-size:14px; letter-spacing:-1px;height: 32px;}
.bg_blue {background-color:#07509f; color:#fff;}
.bg_blue a{color:#fff;}

/*************************************
	err page
*************************************/
.service_iconBox_box {padding:0px 6px 6px 6px; position:relative; }
.service_iconBox_box_inner_box {border:1px solid #0e7cc1;}
.service_iconBox_box_blue_bar {width:100%; height:10px; background-color:#0e7cc1;}
.service_iconBox_box_close_btn {padding:15px 28px 5px 10px; text-align:right;}
.service_iconBox_box_close_btn img {cursor:pointer;}

.service_iconBox_box_low {float:left; width:50%; box-sizing:border-box; padding:0 30px;}
.service_iconBox_box_low_inner_box_title {margin:10px 0; background:url(/kosep/pb/fr/images/main/newMain/bg_dot_1.jpg) repeat-x center left;}
.service_iconBox_box_low_inner_box_title:after { visibility: hidden;display:block;font-size: 0;content:".";clear: both;height: 0;*zoom:1;}
.service_iconBox_box_low_inner_box_title h1 {font-size:20px; color:#636363; float:left; padding-right:10px; background-color:#fff; letter-spacing:-3px;word-spacing: -1px;font-weight: bolder;}
.service_iconBox_box_low_inner_box_title h1 span {color:#0e7cc1;}

.service_iconBox_box_low_inner_box_iconConBox {margin:20px 0;}
.service_iconBox_box_low_inner_box_iconConBox:after { visibility: hidden;display:block;font-size: 0;content:".";clear: both;height: 0;*zoom:1;}
.iconConBox_01 {float:left; width:33.3333%; box-sizing:border-box; text-align:center; margin:10px 0; padding:0 5px; cursor:pointer;}
.iconConBox_01_title {margin:2px 0 0 0; font-size:13px; color:#333;letter-spacing: -0.8px;}

.service_iconBox_box {display:none;}
.service_iconBox_box_close_btn_menu {padding:15px 28px 5px 10px; text-align:right;}
.service_iconBox_box_close_btn_menu img{cursor: pointer;}
.menu_service_contents{background-color: #fff;display: none;}

/* PC */
.guide_page .pcGuide{position:relative; margin: 10px;}
.guide_page .pcGuide img{width: 100%;}
.guide_page .pcGuide .btn_back{position: absolute; cursor:pointer; width:24%; left: 38%; bottom:8%; height: 8%; opacity:0;}

.guide_page .ieGuide{position:relative; margin: 20px auto; width: 460px;}
.guide_page .ieGuide img{width: 100%; }
.guide_page .ieGuide .btn_back{position: absolute; width: 118px; height: 36px; top: 371px; left: 177px; background-color: #fff;}


/******************************************************* 
* 1400px : Left-menu(250px) + 1024px + quick-menu(100px)
********************************************************/

@media all and (max-width:1102px){
	.top_banner_inner_box, .header_inner_box, .nav_inner_box ,.top_footer_inner_box, .footer_inner_box, .main_contents_square_box, .main_moreContents_customer_box {width:100% !important;} /* 171220 �섏젙 */
	.top_banner_slide_contents_one {width:100%; text-align:center;}
}

@media all and (max-width:880px){
	.service_iconBox_box_low {padding:5px;}
	.service_iconBox_box_low {width:100%; box-sizing:border-box; padding:0 20px;}
	
	/* POPUP 180712 */
	.modal_pop_wrap .modal_pop > .inner_wrap{width:100%; max-height:100%; height:100%;}
	.modal_pop .cont{max-height:calc(100% - 50px); height:100%; width:100%; overflow-y:auto;}
	.modal_pop .img_open_pop{margin-top:100px;}
	.modal_pop .btn_close{top:70px; right:15px; width:17px; height:17px; background-size:17px 17px;}
}

/*********************************** css ********************************/
@media all and (max-width:570px){	
	.top_banner_slide_contents_one img {width:100% !important; float:left;}
	.banner_mobile_btn_box {display:block;}
	.top_banner_close_box {display:none;}
/* 	.top_banner_slide_arrow_left {display:none;} */
/* 	.top_banner_slide_arrow_right {display:none;} */
	.top_banner_slide_contents {width:100%;}
	.top_banner_box {padding:0;}
	.top_banner_slide_contents_one {width:100%; padding:0;}
}