/*=========================================================================================================================
* 프로젝트: 
* 파일명: layout.css  사이트 전체레이아웃 css
* 작업자: 김수연
* 작업일: 2018. 6 ~ 
=========================================================================================================================*/


@charset "utf-8"; 

*{box-sizing:border-box;font-size:1em}
html {font-size:100%;}
html.websize-1{font-size: 100%;}
html.websize-2{font-size: 110%;}
html.websize-3{font-size: 120%;}
html.websize-4{font-size: 130%;}
html.websize-5{font-size: 140%;}
html body {font-size:1rem;}
img{max-width:100%}

.ctt {margin-bottom: 50px;word-break:keep-all}

.txt_cnt { text-align: center!important;}

.ctt h4{font-size:1.250em;font-weight:300;margin-bottom:10px;position:relative;letter-spacing:-0.03em}
.ctt h4:before{position:absolute;top:-5px;left:0;background:#1f5dca;width:25px;height:4px;display:inline-block;content:''}
.ctt h4>span{font-size:18px}
.ctt h5{background:url(/images/site/main/h5_tit.png)0 center no-repeat;padding-left:10px;color:#1b4692;font-size:1.125em;font-weight:500;margin-bottom:10px;letter-spacing:-0.08em}
.ctt h5 span{font-size:0.938rem}

.ctt a[href^="http://"]{position:relative;padding-right:25px;display:inline-block;font-weight:300;letter-spacing:-0.08em}
.ctt a[href^="http://"]:after{position:absolute;top:5px;right:5px;content:' \f08e'  ; font-family: 'FontAwesome';}

.ctt a[href^="https://"]{position:relative;padding-right:25px;display:inline-block;font-weight:300;letter-spacing:-0.08em}
.ctt a[href^="https://"]:after{position:absolute;top:5px;right:5px;content:' \f08e'  ; font-family: 'FontAwesome';}

.box_blue{border:1px solid #ccd0e1;border-top:2px solid #059edb;border-bottom:1px solid #a2a5b2;padding:25px 20px 25px;vertical-align:middle;margin-bottom:40px}
.box_gray{background:#f4f5f9;padding:20px;}

.list_gray li{background:url(/images/site/main/dot_gray.png) 0 8px no-repeat;padding-left:13px;margin-bottom:5px}
.list_gray li strong{font-weight:300}

.hidden{font-size: 0 !important;    width: 0 !important;    height: 0 !important;    color: transparent !important;    line-height: 0 !important;position: absolute;    left: -1000px;    top: 0;    overflow: hidden;    text-indent: -30000px;}

#sub-wrap{padding:0 15px;margin-bottom:30px;min-height:300px}

/*float*/
.fl{float:left}
.fl{float:right}
.half{width:48%;float:left;margin-left:30px}

.third{width:30%;float:left;margin-left:35px}
.half:first-child,.third:first-child{margin-left:0}


/* Sprite Map */
.sprite {
	background:url(/images/site/mobile/sprite-map-icon.png) no-repeat;
	-webkit-background-size:300px 450px;
	background-size:300px 450px;
	display:inline-block;
	overflow:hidden;
	color:transparent;
	white-space:nowrap;
	font-size:0;
	line-height: 0;
	text-indent: -999px;
	vertical-align: middle;
}


/* Popup Window */
.window-wrap{
	background:rgba(0,0,0,.7);
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100vh;
	z-index: 1000
}

/* Slide Menu */
.slide-on{
	position: relative;
	overflow-x: hidden;
}
.slide{
	position: absolute;
	overflow-y: auto;
	top: 0;
	width: 100%;
	height: 100%;
	background:#fff;
}
.slider-group{
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}
.slide-leftmenu{
	left: 0;
}
.slide-rightmenu{
	right: 0;
}
.window-wrap, .slide{
	display:none;
}

/*-------------------------
top_grobal
-------------------------*/

.top_grobal{overflow:hidden;}
.top_grobal li{float:left;width:25%;vertical-align:middle}
.top_grobal li a{display:block;height:50px;color:#fff;text-align:center;font-size:0.8rem;width:100%;padding:12px 0 0 0;font-weight:500}
.top_grobal .link_01{width:20%}
.top_grobal .link_03{width:30%}
.top_grobal .link_01 a{background:#e73e97}
.top_grobal .link_02 a{background:#059edb}
.top_grobal .link_03 a{background:#f8aa11;letter-spacing:-0.08em}
.top_grobal .link_04 a{background:#38bc9a}
.top_grobal .link_05 a{background:#e9573f}

/*-------------------------
header
-------------------------*/
header{position:relative;height:90px;border-bottom:3px solid #1b4692;padding:20px 10px;}
header:after{content:'';clear:both;display:block}
header nav { display: inline-block;  vertical-align: middle; float:left}
header nav .all-menu a{float:left;width:50px;height:50px;background-position:0 0}
header .all_search{float:right;}
header .all_search a{;width:50px;height:50px;background-position:-52px 0}
header h1 a{background:url(/images/site/mobile/logo.png) 0 0 no-repeat;background-size:90%;;text-indent:-99999em;font-size:0;line-height:0;width:150px;height:50px;position:absolute;left:50%;margin-left:-65px;/* filter:grayscale(1); */}


/*-------------------------
footer
-------------------------*/
.dk_gray{background:#ccd1d9;padding:15px!important}
.site-link:after{content:'';display:block;clear:both}
.site-link dl{width:100%;position: relative;font-size:14px}
.site-link .Family_site{width:48%;float:right}
.site-link dl dt {}
.site-link dl dt a{display:block; padding: 8px 20px 8px 4%;position:relative;border:1px solid #a7b1c1;color:#656d78;background:#dbdfe4;;font-size:13px;font-weight:500}
.site-link dl dt a:after {content: "";display: block;position: absolute; right: 4%;top: 50%; margin-top: -2px; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 5px solid #333;  -webkit-transform: rotate(0deg);
    transform: rotate(0deg);  -webkit-transition: all .3s ease;  transition: all .3s ease;}
.site-link dt a.on:after {  -webkit-transform: rotate(180deg);   transform: rotate(180deg);}
.site-link dd { display: none;  position: absolute;  left: 0;  bottom: 40px;  width: 100%;  z-index: 101;}
.site-link dd ul { background: #fff; border: 1px solid #ddd;width:100%;padding:10px}
.site-link dd ul li {margin-bottom:8px}
.site-link dd ul li a{font-size:14px;}

.social-Area{background:#656d78;padding:15px 10px}
.social-Area ul {overflow:hidden}
.social-Area ul li{float:left;width:20%;position:relative}
.social-Area ul li:after{position:absolute;content:'';top:0;right:0;width:1px;height:100%;background:#fff}
.social-Area ul li:last-child:after{width:0}
.social-Area ul li a{color:#fff;text-align:center;display:block;font-size:12px}

.copyright-Area{background:#444a54;color:#fff;padding:15px}

.copy{overflow:hidden;margin-bottom:15px}
.copy li{float:left;width:25.0%}
.copy li a{display:block;text-align:center;padding:5px ;color:#d0d0d9;font-size:13px;letter-spacing:-0.08em}

.copyright-Area address{color:#d0d0d9;font-size:13px;word-break:keep-all;text-align:center}




/*-------------------------
js_tab 
-------------------------*/

.js_tab { position: absolute;left:50%;margin-left:-48%;bottom:-20px;  z-index: 10; width:96%;}
.js_tab .title { display: block;}
.js_tab .title a { padding: 3px 50px 3px 15px; font-size: 16px; display: block;  line-height: 40px; height:45px;overflow:hidden; color: #fff;  background: #059edb!important; border:1px solid #19428a;border-radius:3px; text-decoration: none;  position: relative;    text-overflow: ellipsis;   -o-text-overflow: ellipsis;   overflow: hidden;  white-space: nowrap;   word-wrap: normal !important;}
 .js_tab .title a:after {  content: "\f078";  display: block;  width: 13px;  height: 7px;  ;  position: absolute;  right: 15px;  top: 10%;  margin-top: -3px;
    -webkit-transform: rotate(0deg);   transform: rotate(0deg);   -webkit-transition: all .3s ease;    transition: all .3s ease;font-family: 'FontAwesome';}
.js_tab .title.on a:after {  -webkit-transform: rotate(180deg);   transform: rotate(180deg);top:90%}

 .tabBtn { display: none;   border: 1px solid #2061c2;   border-top: 0;   position: absolute;   left: 0;   width: 100%;   box-sizing: border-box;   margin: 0;background:#fff}
 .tabBtn a { display: block; width: auto;  text-align: left;  border: 0;  margin: 0;  border-bottom: 1px solid #d2d2d2;  padding: 8px 15px;  font-size: 15px;  line-height: 19px;   background: #fff;  font-weight: normal;color:#000}
 .tabBtn a.on, .tabBtn a:hover, .tabBtn a:active {  background: #f5f5f5;  color: #2061c2;}


/*-------------------------
담당자
-------------------------*/

.contact{border:1px solid #dfdfdf;border-bottom:1px solid #a9a9a9;background:#fff;margin-top:20px}
.contact ul{overflow:hidden;margin-top:5px}
.contact ul li{font-size:0.813rem;padding:5px 10px;float:left}
.contact ul li a{font-size:0.813rem;color:#000}
.contact ul li strong{font-weight:500;padding-left:27px;height:25px;display:inline-block}
.contact ul li:nth-child(1){width:100%;}
.contact ul li:nth-child(2){width:100%;}
.contact ul li:nth-child(3){width:50%;}
.contact ul li:nth-child(4){width:50%;}
.contact ul li:nth-child(1) strong{background:url(/images/site/main/cnt_ic_01.png)0 0 no-repeat;}
.contact ul li:nth-child(2) strong{background:url(/images/site/main/cnt_ic_02.png)0 0 no-repeat;}
.contact ul li:nth-child(3) strong{background:url(/images/site/main/cnt_ic_03.png)0 0 no-repeat;}
.contact ul li:nth-child(4) strong{background:url(/images/site/main/cnt_ic_04.png)0 0 no-repeat;}
.contact ul li:nth-child(5) {width:100%;margin-right:0;font-size:0.813em;letter-spacing:-0.05em;background:#f5f7f9;padding:5px 0}

/*-------------------------
가로스크롤
-------------------------*/
.h_scroll {overflow:auto;position:relative}
.h_scroll .tbl-calendar,.h_scroll .tbl-event, .h_scroll .tbl-basic{width:910px!important;}
.h_scroll .touch{background:url(/images/site/mobile/ic_hscroll.png)0 0 no-repeat;background-size:27px 27px;padding-left:30px;margin-bottom:10px;height:30px}


/*-------------------------
소셜&글자크기
-------------------------*/
.subtit [class^='js_mobile_']{position:relative;margin-bottom:40px;height: 30px;}
.subtit [class^='js_mobile_']:after{background:#e2e9f4;display:block;content:'';position:absolute;top:30px;left:0;width:100%;height:40px}

.article_btns{overflow:hidden;padding:0px ;border-top:1px solid #aab2bd;border-bottom:1px solid #aab2bd;margin-bottom:30px;z-index:9}
.article_btns_left{float:left}
.article_btns_left a:first-child{margin-left:0}
.article_btns_left a{display:inline-block;border-right:1px solid #aab2bd;font-size:18px;font-weight:700;width:40px;height:40px;line-height:40px;vertical-align:middle;text-align:center}
.article_btns_left .twitter{background:#0b9edb;color:#fff}
.article_btns_left .facebook{background:#1a4692;color:#fff}
.article_btns_right{float:right}
.article_btns_right a,.article_btns_right  span{height:40px;line-height:40px;vertical-align:middle}
.article_btns_right span{font-size:15px;letter-spacing:-0.08em}
.article_btns_right .font-size-item{display:inline-block;border-left:1px solid #aab2bd;border-right:1px solid #aab2bd;padding:0 10px;font-size:18px;font-weight:700;margin:0 5px;width:40px;text-align:center}
.article_btns_right span+a{margin-right:0!important}

/*-------------------------
english footer
-------------------------*/

/* layout */
#chinese *{font-family: "微软雅黑","Noto Sans KR",sans-serif}

/* site banner*/
.sitebnr-Area {overflow:hidden; padding:15px; }
.sitebnr-Area ft_bn { margin:0 auto; overflow:hidden; display:block; }
.sitebnr-Area ft_bn li { width:32%; height:36px; float:left; background-color:#fff; text-align:center; }
.sitebnr-Area ft_bn li a { display:block; width:100%; height:100%; }
.sitebnr-Area ft_bn li:nth-child(2) { margin:0 2%; }

/* footer */
.m_eng_copy address { font-size:0.563em!important; }
#chinese .m_eng_copy address {
    font-size: 0.688em!important;
}

/*-------------------------
english header
-------------------------*/

.header_lang { border-top:10px solid #1a4692; height:auto!important; }
.header_lang h1 a { background: url(/images/site/mobile/m_language/m_logo_eng.png) center center no-repeat!important; background-size:95%!important; left:48%!important; }

/*-------------------------
language 메뉴
-------------------------*/
/* header box */
.m_header_lang { height:55px!important;  }
.m_header_lang:after { content:""; display:block; clear:both; }
.m_header_lang .global { border-bottom:none; padding:10px; }
.m_header_lang .global a { margin-top:2px; }
.m_header_lang .global:after { content:""; display:block; clear:both; }

/* menu */
.gnb_wrap_eng { margin-top:55px!important; }

.gnb_wrap_eng .gnb_m>li:nth-child(2) p span { line-height:25px; padding-top:25px; }
.gnb_wrap_eng .gnb_m>li:nth-child(3) p span { line-height:100px; padding-top:0; }
.gnb_wrap_eng .snb_m>li .dpt2 .dpt_sm li a { line-height:20px; padding:10px;}

/* 로그인 2018.06.21 : 김수연 */

.loginArea{border:1px solid #d2dae5;background:#f5f7fb}
.loginArea .lgn_m_divide{background:#173974;padding:30px 0 30px}
.lgn_m_divide ul{overflow:hidden}
.lgn_m_divide ul li{float:left}
.lgn_m_divide ul li{margin-left:50px;margin-top:20px}
.login{padding:55px 25px 55px 25px;position:relative}
.login ul {position:relative}
.login ul li input[type="text"], .login ul li input[type="password"]{height:50px;width:100%}

.login ul li input::placeholder {color: #000;font-size:16px;font-weight:700}

.login .btn_login{display:block;width:100%;height:50px;}
.login .btn_login input{width:100%;display:block;text-align:center;line-height:50px;font-weight:700;font-size:20px;color:#fff;border-radius:3px;background:#0b9edb;}
.login .btn_login input *{-webkit-transition-delay: 0.05s;transition-delay: 0.05s;transition: 0.3s ease; -moz-transition: 0.3s ease; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease;}
.login .btn_login input:hover{background:#0b8adb}
.login .btn_login input:hover i{margin-right:10px}




.login .lgn_btn{border-top:1px solid #cbd3e4;padding-top:20px;margin-top:20px}
.login .lgn_btn a{border:1px solid #586b94;background:#8292b4;color:#fff;font-size:1rem;display:inline-block;text-align:center;width:100%;padding:10px 0;border-radius:3px}
.login .lgn_btn a:hover{background:#576a93}
.login .lgn_btn a:first-child{margin-bottom:10px}

.lgn_m_divide .form-checkbox{position:relative;text-align:left;cursor:pointer;overflow:hidden;display:inline-block}
.lgn_m_divide .form-checkbox.divide input { width: 25px; height: 25px;}
.lgn_m_divide .form-checkbox input{ position: absolute;  top: 50%;  left: 0;  margin-top: -10px;  opacity: 0;  filter: alpha(opacity=0);  width: 20px;  height: 20px;  cursor: pointer;   z-index: 2;}
.lgn_m_divide .form-checkbox input{ position: absolute;  top: 50%;  left: 0;  margin-top: -10px;  opacity: 0;  filter: alpha(opacity=0);  width: 20px;  height: 20px;  cursor: pointer;   z-index: 2;}
.lgn_m_divide .form-checkbox input[type="radio"] {  box-sizing: border-box;  padding: 0;}
.lgn_m_divide .form-checkbox.divide label {  padding-left: 34px;   /* font-size: 20px; */   font-size: 18px; line-height: 30px;color:#c0cadb;font-weight:300}
.lgn_m_divide .form-checkbox label{height: 30px; padding-left: 25px;   vertical-align: middle;     cursor: pointer;  font-weight: bold;}
.lgn_m_divide .form-checkbox label:after{ content: '';  position: absolute;  top: 50%;  left: 1px;  z-index: 1; margin-top: -10px;  width: 25px;  height: 25px;  background-repeat: no-repeat;  background-size: 20px;  display: inline-block;}
.lgn_m_divide .form-checkbox.divide label:after { margin-top: -12px;   width: 25px;   height: 25px;  background: url(/images/site/main/lgn_m_chk.png)0 0 no-repeat;  }
.lgn_m_divide .form-checkbox input:checked + label:after {   background-position: 0 bottom;}
.lgn_m_divide .form-checkbox input:checked + label{color:#fff}

.login .form-checkbox{position:relative;text-align:left;cursor:pointer;overflow:hidden;margin-top:10px;display:inline-block}
.login .form-checkbox.save input { margin-top: -12px;  width: 20px; height: 20px;}
.login .form-checkbox input{ position: absolute;  top: 50%;  left: 0;  margin-top: -10px;  opacity: 0;  filter: alpha(opacity=0);  width: 20px;  height: 20px;  cursor: pointer;   z-index: 2;}
.login .form-checkbox input{ position: absolute;  top: 50%;  left: 0;  margin-top: -10px;  opacity: 0;  filter: alpha(opacity=0);  width: 20px;  height: 20px;  cursor: pointer;   z-index: 2;}
.login .form-checkbox input[type="checkbox"] {  box-sizing: border-box;  padding: 0;}
.login .form-checkbox.save label {  padding-left: 34px;   /* font-size: 20px; */   font-size: 0.875rem; line-height: 24px;color:#656d78;font-weight:300}
.login .form-checkbox label{height: 25px; padding-left: 25px;   vertical-align: middle;     cursor: pointer;  font-weight: bold;}
.login .form-checkbox label:after{ content: '';  position: absolute;  top: 50%;  left: 1px;  z-index: 1; margin-top: -10px;  width: 20px;  height: 20px;  background-repeat: no-repeat;  background-size: 20px;  display: inline-block;}
.login .form-checkbox.save label:after { width: 20px;   height: 20px;  background-image: url(/images/site/main/lgn_chk.png);  background-size: 20px;}
.login .form-checkbox input:checked + label:after {   background-position: 0 bottom;}
.login .form-checkbox input:checked + label{color:#000}

/* 회원탈퇴  */
.memout{background:#173974;padding:30px 0 30px;position:relative}
.memout ul {position:relative}
.memout ul li input[type="text"], .memout ul li input[type="password"]{height:50px;width:100%}
.memout ul li input::placeholder {color: #000;font-size:16px;font-weight:700}
.memout .btn_out{display:block;width:100%;height:50px;}
.memout .btn_out a{display:block;text-align:center;line-height:100px;font-weight:700;font-size:20px;color:#fff;border-radius:3px;background:#0b9edb;width:176px;cursor:pointer;position:relative;}
.memout .btn_out a *{-webkit-transition-delay: 0.05s;transition-delay: 0.05s;transition: 0.3s ease; -moz-transition: 0.3s ease; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease;}
.memout .btn_out a:hover{background:#0b8adb}
.memout .btn_out a:hover i{margin-right:10px}


/* 검색결과 화면 */
.result_all{font-size:18px;font-weight:500;border-bottom:2px solid #000;padding:20px 0}
.result_all b{color:#059edb;}
.result_all span{color:#e33d22;}

.section{position: relative; overflow: hidden; padding: 25px 0 0;    border-bottom: 1px solid #000;}
.section h3{font-size:1.125em;font-weight:500;border-bottom:1px dashed #ccc;padding-bottom:20px;margin-bottom:25px}
.section h3 span{color:#656d78;font-size:0.875em;font-weight:300}
.section ul li a{color:#444a54;font-size:0.938em;font-weight:300}
.section ul li:after{display:block;content:'';clear:both}
.section ul li a:hover{text-decoration:underline;color:#059edb}
.section ul li a:hover b{color:#059edb}


.section.total {padding-bottom:0}
.section.total h3{margin-bottom:0}
.section.total ul{overflow:hidden;background:#f7f8fa;padding:25px 20px}


.section ul{}
.section ul li{margin-bottom:20px}
.section dl{margin-bottom:40px}
.section dl dt a{font-weight:500;color:#0b9edb}
.section dl dd{font-size:0.875em}
.section dl dd.info_etc{color:#8f9eb4;font-size:0.813em}
.section ul li table th,.section ul li table td{font-size:0.813em}
.section ul li div{margin:0 auto;width:100%;height:150px;overflow:hidden}
.section ul li div img{width:100%}

.result_more{text-align: right;  height: 27px;  padding: 0 20px 0 0;}

.result_more a{font-size:14px;font-weight:500;color:#444a54;position:relative;padding-right:20px}
.result_more a:after{content:'';display:block;position:absolute;top:5px;right:0;background:url(/images/site/main/btn_sch_more.png)0 0 no-repeat;width:11px;height:11px}