@charset "utf-8";

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

@import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css');

body{font-family:"Nanum Square","NanumSquare", sans-serif !important; letter-spacing:0px !important;}

/*tablet화면 서식 */
@media screen and (min-width:768px) and (max-width:1199px) {

	/*모바일 아이콘 숨기기*/
	#toggle,
	label.fa-bars,
	.sr_btn,
	nav > h2 {
		display: none;
	}
	
ol, li{
	line-height: 30px;
	overflow: hidden; 
	text-overflow: ellipsis; 
    white-space: nowrap; }

	/*헤더영역*/
	header {
		width: 100%;
		height: 90px;
		position: relative;
		background-color: #fff;
		margin-bottom: 20px;
	}

	section {
		width: 100%;
	}

	.lnb_wrap {
		width: 100%;
		height: 35px;
		background-color: #004d91;
	}

	.lnb_wrap > .lnb {
		float: right;
		/*width: 100%;*/
		height: 30px;
		/*margin: 0px auto;
		padding-left: 550px;*/
		padding-top: 12px;
		/*box-sizing: border-box;*/
	}

	.lnb li {
		float: left;
		/*text-align: right;*/
		padding: 5px 20px;
		border-right: 1px solid #ffffff;
		line-height: 4px;
		font-size: 12px;
		font-family: "나눔스퀘어OTF_ac BOLD", "맑은고딕", arial, sans-serif;
	}

	.lnb li:nth-child(4) {
		border-right: none;
	}

	.lnb a {
		color: #ffffff;
		text-decoration: none;
	}


	.lnb a:hover {
		color: #a2a1a1;
		font-weight: bold;
	}

	.smk_5 > h2 {
		padding: 40px 0px 15px;
		color: #333;
		font-weight: bold;
		font-size: 18px;
		border-bottom: 0px solid #333;
	}


	h1 img {
		width: 100px;
		height: 35px;
	}

	h1 {
		position: absolute;
		left: 48%;
		top: 30px;
		margin: 28px 0px;
		z-index: 1000;
	}

	/*토글메뉴 */
	label.fa-bars,
	i.fa-search,
	i.fa-user-alt {
		display: block;
		position: absolute;
		z-index: 9999;
		font-size: 40px;
	}

	label.fa-bars {
		bottom: 0px;
		left: 5px;
	}

	i.fa-search {
		bottom: 0px;
		right: 20px;
	}

	i.fa-user-alt {
		bottom: -1px;
		right: 80px;
	}

	label.fa-bars > span,
	i.fa-user-alt > span,
	i.fa-search > span {
		display: none;
	}

	label.fa-bars {
		left: 10px;
	}

	i.fa-search {
		right: 10px;
	}
			
    .fa-times{
	color:#fff;
	font-size:2.4rem; /* 12px의 2.4배를 키운다. */
	position:absolute;
	right:4%;
	top:4%;
		}

    .fa-times > span{display:none;}    
    
    
/* 닫기 버튼의 위치 */
	nav > label.fa-times{
	transform: rotate(0deg);
	transition:0.5s;
		}
	nav > label.fa-times:hover{
	transform: rotate(180deg);
		}
	
	#gnb_wrap{width:100%;
		height:100%;
		position:fixed;
		left:-100%; /* 브라우저의 화면 왼쪽 바깥으로 안보이게 숨김 */
		top:0px;
		background-color:rgba(0,0,0,.7);
		z-index:9999;
		transition:0.5s;
		}
			
/* 전체메뉴를 클릭시 토글에 체크되면서 아래 동생들중 nav가 날라옴 */
	#toggle:checked ~ #gnb_wrap{left:0%;}
    

 .gnb {
	padding:5%;
	text-indent:10px;
	}

.gnb > li > a{
	padding-top: 20px;
	width:100%;
	height:40px;
	color: #00c9ed;
	font-size:1.4em;
	font-weight: bold;
	}	
	.sub{
		padding-bottom: 20px;
	}	
.sub > li{
	width:100%;
	height:28px;
	border-bottom:1px solid #ccc;
	}

.sub > li > a{
	color:#fff;
	display:block;
	line-height:28px;
	text-indent:10px;
	font-size:1em;
	}
.sub > li:hover > a{
	background-color:#fff;
	color:#333;
	}
	
	
.visual{width:100%;}

.cont01 img {
	width: 100%;
	min-height: 100%;
	}

.cont01 {
	width: 100%;
	}

.cont02 img {
		width: 100%;
	}
	
.cont02{width: 100%; margin: 0px auto;}

.list_box_gray{
	}
	
.list_box_gray li {
		width: 23.8%;
		float: left;
		
		margin: 12px 0 0 1.2%;
		padding: 0px;
		font-size: 100%;
		line-height: 22px;
		text-align: left;
		font-weight: bold;
	}
	
/*.cont02 > .list_box_gray li:last-child {
		display: none;
	}*/

.list_box_gray li em.tag_1 {
		padding: 2px 5px;
		width: 18%;
		height: 22px;
		background: #00a0e9;
		border-radius: 4px;
	}

em {
		/*display: inline-block;*/
		color: #fff;
		font-style: normal;
	}

.wrap_tag {
		height: 30px;
		margin-top: 12px;
	}	
.list_box_gray li .tag {
		line-height: 25px;
		vertical-align: top;
		overflow: hidden;
		color: #717070;
	}
	


.wrap_tag > .tag_txt{
	overflow: hidden;
	height: 30px;
	line-height: 40px;
	text-align: right;
}

/*.cont02{width: 100%; margin: 0px auto;}

.cont02 > li{margin: 26px 2px 46px 10px;
	float: left;}*/

.cont03 img {
		width: 100%;
	}
.cont03_title{width: 100%; margin: 0px auto;}
	/*.cont02_img {width: 100%;}*/


.cont03 {
		width: 100%;
		text-align: center;
	}

.cont03_sub_tt {
	display: none;
	margin: 10px 0px 50px 5%;
	float: left;
	font-family: "나눔스퀘어OTF_ac ExtraBOLD", "맑은고딕", arial, sans-serif;
	}

.cont03_sub_tt > .sub_tt_1 {
	display: none;
	text-align: left;
	font-size: 40px;
	font-weight: bold;
	color: #070606;
	margin-bottom: 50px;
	overflow: hidden;
	}

.cont03_sub_tt > .sub_tt_2 {
	display: none;
	text-align: left;
	font-size: 20px;
	color: #595757;
	line-height: 32px;
	font-weight: bold;
	margin-bottom: 30px;
	}

.cont03_sub_tt > .sub_tt_3 {
	display: none;
	text-align: left;
	font-size: 14px;
	color: #898989;
	line-height: 22px;
	}
/*.cont_bk > .cont03_sub > li:last-child {
	display: none;
}*/

.cont_bk {
	width: 100%;
	height: 970px;
	background-color: #e7e8ea;
	}

.cont03_main {
	width: 100%;
	float: left;
/*	background-image: url('../img/0626_953x505.jpg');*/

	}

.cont03_sub {
	width: 100%;
	float: left;
	margin-top: 20px;
	}

.cont03_sub li {
	margin-right: 1%;
	float: left;
	width: 24%;
	padding: 0px;
	font-size: 100%;
	line-height: 20px;
	text-align: left;
	}

.cont03_sub_tag {
	padding: 15px 0px 15px 0px;
	font-weight: bold;
	font-size: 100%;
	color: #2484c6;
	}

.tag_txt1 {
	font-weight: bold;
	font-size:  100%;
	overflow: hidden;
	color: #333;
	margin-bottom: 5px;
	}

.tag_txt2 {
	font-size: 100%;
	padding-bottom: 5px;
	color: #333;
	}
	
.cont04_img {
	width: 10%;
	/*height: 505px;*/
	/*		background-image:url(../img/0625_953x505_2.jpg);*/
		}

.cont04_main {
	width: 50%;
	}
	
.cont04_1 {
	width: 100%;
	/*height: 600px;*/
	float: right;
	/*border: 1px solid #333;*/
	padding: 66px 0px 0px 0px;
	}

.cont04_main {
	float: right;
	padding: 10px 3% 0px 0px;
	/*border:1px solid #f00;*/
	}
	.cont04_main img{
		width: 100%;
	}
.cont04_1 > .cont04_img {
	width: 50%;
	/*	overflow: hidden;*/
	float: right;
	/*height: 505px;*/
	background-image: url(../img/0625_953x505_2.jpg);
	}
	
.cont04_sub {
	width: 100%;
	float: left;
	margin-top: 20px;
	}

.cont04_sub_tt {
	display: none;
	margin: 0px 0px 0px 1.5%;
	font-family: "나눔스퀘어OTF_ac ExtraBOLD", "맑은고딕", arial, sans-serif;
	text-align: left;
	font-size: 100%;
	color: #898989;
	line-height: 24px;
	}


.cont04_sub li {
	float: left;
	width: 23.5%;
	padding: 0px;
	font-size: 100%;
	line-height: 20px;
	text-align: left;
	}


.cont04_sub_tag {
	font-family: "나눔스퀘어OTF_ac ExtraBOLD", "맑은고딕", arial, sans-serif;
	padding: 15px 0px 15px 0px;
	font-weight: bold;
	font-size: 100%;
	color: #2484c6;
	}



/*푸터 서식*/

footer {
	width: 100%;
	background-color: #bbbcbf;
	}

.f_inner {
	width: 70%;
	/*background-color: aqua;*/
	position: relative; /*부모설정*/
	}

.f_inner > .f_lnb {}

.btn_top {
	width: 5%;
	padding: -10px 0px 0px 0px;
	margin-left: 10%;
	}

.f_inner > .f_lnb > li {
	float: left;
	margin: 1%;
	text-align: center;
	border:none;
	}

.f_inner > .f_lnb > li a {
	padding-right: 10%;
	/*color: #fff;*/
	font-size: 100%;
	font-weight: bold;
	}


/*푸터 주소 올라간 거 행갈이로 내려주는 서식*/

.f_ad_wrap {
	background-color: #777676;
	width: 100%;
	height: 100px;
	}

.f_ad {
	position: relative;
	width: 100%;
	/*height: 80px;*/
	padding: 20px 0px 0px 0px;
	/*border: 1px solid #fff;*/
	margin: 0px auto;
	}

.f_ad h3 {
	/*width: 150px;*/
	text-align: center;
	float: left;
	left: 2%;
	position: static;
	top: 22px;
	}

address {
	font-size: 100%;
	position: static;
	line-height: 16px;
	color: #fff;
	left: 20%;
	font-style: normal;
	float: left;
	padding-left: 20px;
	/*이탤릭체 풀어주기*/
	}

/*sns 메뉴 목록*/
/*좌우배치.부모와 자식요소를 잡아주었던 이유*/
.f_ad > .sns_lnb {
	clear: both;
	float: right;
	position: static;
	}

.f_ad > .sns_lnb > li {
		float: left;
		margin: 0px 5 0px 0px;
	}

address > span {
	float: right;
}
}