@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url('https://fonts.googleapis.com/css?family=Libre+Franklin');
@import url('https://fonts.googleapis.com/css?family=Fascinate');
@import url('https://fonts.googleapis.com/css?family=Chango');
<link href="https://fonts.googleapis.com/css?family=Nanum+Myeongjo" rel="stylesheet"> 

/* 초기화 */
html {height:100%; width:100%; overflow-x: hidden; max-width: 100%;}
body {margin:0; padding:0; font-family:'Nanum Gothic', sans-serif; height:100%; max-width: 100%; overflow-x: hidden;}
body.scroll{overflow-y: hidden;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em; line-height:1.2;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}

#hd ul, nav ul, #ft ul {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle}
input, button {margin:0;padding:0; }
button {cursor:pointer}

textarea, select {font-family:"nngd";font-size:1em}
select {margin:0}
p {margin:0;padding:0;word-break:break-all;}
hr {display:none}
#textCon > pre {width:1180px; word-wrap: break-word;white-space: pre-wrap;white-space: -moz-pre-wrap;white-space: -pre-wrap;white-space: -o-pre-wrap;word-break:break-all;}
a:link, a:visited {text-decoration:none; color: inherit;}
a:hover, a:focus, a:active {color: inherit;}
ul, li {padding:0;margin:0;list-style:none;}

/*공통*/
.clr{clear:both; float:none;}
.textAL{text-align:left}
.textAC{text-align:center}
.textAR{text-align:right}

/*foot*/
.footer{background-color:#363636; color:#8c8c8c; font-size:10px; line-height:16px; padding:24px 14px;}

/*main*/
.wrap{width:100%; overflow:hidden; position:relative;}
.header{border-bottom:1px solid #ccc; position:relative;}
.header::after{clear: both; content: " "; display: block;}
.header > h1{padding:10px 14px; float:left;}
.header > h2 > a > img{height:38px;}
.gnbBt{float:right; color:#0095fa; padding:15px; font-size:24px; cursor:pointer;}
.backBt{position:absolute; top:0; left:0; color:#0095fa !important; display:inline-block; padding:15px; font-size:24px; }
.subgnbBt{position:absolute; top:0; right:0;}
.header > h2{text-align:center; float:left; width:100%; line-height:58px; color:#0095fa; font-size:24px;}

.mainNotice{padding:14px; width:100%; box-sizing:border-box;}
.mainNotice > h3{font-size:21px; padding-bottom:10px; border-bottom:1px solid #ccc;}
.mainNotice > ul{padding-top:10px; width:100%;}
.mainNotice > ul > li{width:100%;}
.mainNotice > ul > li > a{font-size:12px; line-height:28px; text-overflow:ellipsis; display:inline-block; white-space:nowrap; word-wrap:normal; width:100%; overflow-x:hidden;}

.mainInstar{background-color:#f3f3f3;}
.mainInstar > h3{text-align:center; padding:20px 0 10px;}
.mainInstar > h3 > img{height:26px;}

.mainutube{background-color:#f3f3f3;}
.mainutube > h3{text-align:center; padding:20px 0 10px;}
.mainutube > h3 > img{height:26px;}
.mainutube > ul{ height: 130px;}

.mainutube > ul > li:first-child{float:left; width:50%; position: relative;}
.mainutube > ul > li:last-child{float:right; width:50%; position: relative;}
.mainutube > ul > li > iframe {position: absolute; width: 100%; height: 130px;}
.mainutube > ul::after{clear: both; content: " "; display: block;}

#instafeed > a{display:inline-block; width:calc( 100%  / 3 );}
#instafeed > a > img{width:100%;}

.mainMenuQuick > ul > li{float:left; width:50%; height:111px; text-align:center;}
.mainMenuQuick > ul > li.no1{background:url(../_img/main_menu_quick_bg1.jpg); background-size:110%;}
.mainMenuQuick > ul > li.no2{background:url(../_img/main_menu_quick_bg2.jpg); background-size:110%;}
.mainMenuQuick > ul > li.no3{background:url(../_img/main_menu_quick_bg3.jpg); background-size:110%;}
.mainMenuQuick > ul > li.no4{background:url(../_img/main_menu_quick_bg4.jpg); background-size:110%;}
.mainMenuQuick > ul > li > a{display:inline-block; width:100%; height:100%; color:#fff; font-weight:700; box-sizing:border-box; padding-top:20px;}
.mainMenuQuick > ul > li > a > img{width:110px; margin-bottom:5px;}
.mainMenuQuick > ul::after{clear: both; content: " "; display: block;}

.mainSnsQuick > ul > li{width:25%; float:left; text-align:center; padding:20px 0;}
.mainSnsQuick > ul > li > a{display:inline-block; width:100%; height:100%; font-size:11px; color:#2b5b00; font-weight:700;}
.mainSnsQuick > ul::after{clear: both; content: " "; display: block;}
.mainSnsQuick > ul > li > a > img{width:43px; margin-bottom:5px;}

.gnb_bg{position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.6); display:none;}
.gnb_layer{background-color:#fff; position:absolute; top:0; right:-100%; width:90%; height:100%;}
.gnbLayerHead > span{display:inline-block;  padding:12px; cursor:pointer; color:#009bfa; font-size:24px;}
.gnbLayerHead{text-align:right;}
.gnbLayerbody > ul > li > ul{display:none;}
.gnbLayerbody > ul > li{border-bottom:1px solid #e8e8e8}
.gnbLayerbody > ul > li > h3{width:100%; font-size:13px;}
.gnbLayerbody > ul > li > h3 > a{display:inline-block; box-sizing:border-box; padding:14px; width:100%; cursor:pointer;}
.gnbLayerbody > ul > li > h3 > a.on{color:#009bfa; font-weight:700;}
.gnbLayerbody > ul > li > h3 > a > span{float:right; display:inline-block;}
.gnbLayerbody > ul > li > ul{border-top:1px solid #e8e8e8}
.gnbLayerbody > ul > li > ul > li > a{display:inline-block; width:100%; text-indent:20px; line-height:30px; font-size:12px;}

.subVisual{height:100px; width:100%; text-align:center; color:#fff; font-weight:700; font-size:24px; line-height:100px;}
.subVisual.no1{background:url(../_img/sub_visual1.jpg); background-size:cover;}
.subVisual.no2{background:url(../_img/sub_visual2.jpg); background-size:cover;}
.subVisual.no3{background:url(../_img/sub_visual3.jpg); background-size:cover;}
.subVisual.no4{background:url(../_img/sub_visual4.jpg); background-size:cover;}
.subVisual.no5{background:url(../_img/sub_visual5.jpg); background-size:cover;}
.subVisual.no6{background:url(../_img/sub_visual6.jpg); background-size:cover;}
.subVisual.no7{background:url(../_img/sub_visual7.jpg); background-size:cover;}
.subVisual.no8{background:url(../_img/sub_visual8.jpg); background-size:cover;}


.subTCpntentH2W{text-align:center;}
.subTCpntentH2W > h2{font-size:24px; padding:20px 0 5px; }
.subTCpntentH2W > .bar{display:inline-block; background-color:#009bfa; width:20px; height:2px; margin-bottom:10px;}
.subTCpntentH2W > p{font-size:12px; padding:5px 14px; line-height:18px;}
.subTCpntentH3W{text-align:center;}
.subTCpntentH3W > h3{font-size:18px; padding:20px 0 5px; color:#009bfa;}
.subTCpntentPW{text-align:center;}
.subTCpntentPW > p{font-size:13px;line-height:24px; padding:0 10px;}


.pathLayer > ul{text-align:center; padding:12px 0;}
.pathLayer > ul > li{display:inline-block;}
.pathLayer > ul > li > a{display:inline-block; padding:2px 14px; font-size:12px;}
.pathLayer > ul > li.on > a{background-color:#0095fa; color:#fff;}

.subTCpntentPW > p > img{width:100%;}
.subTCpntentPW{width:100%;}
.subTCpntentPW > p {box-sizing:border-box;}

.subTCpntentPW > ul{font-size:13px; line-height:24px;}
.subTCpntentPW > ul > li{padding:4px;}

/*게시판*/
.borderNormalListTab > ul{padding:16px 14px;}
.borderNormalListTab > ul::after{clear: both; content: " "; display: block;}
.borderNormalListTab > ul > li{width:calc( 100%  / 3 ); float:left;}
.borderNormalListTab > ul > li > a{box-sizing:border-box; display:inline-block; border:1px solid #ccc; width:100%; text-align:center; line-height:40px;  font-size:13px;}
.borderNormalListTab > ul > li.on > a{background-color:#009bfa; color:#fff; font-weight:700;}
.borderNormalList{padding:0 14px;}
.borderNormalList > ul{border-top:1px solid #ccc;}
.borderNormalList > ul > li{border-bottom:1px solid #ccc; padding:0 10px;}
.borderNormalList > ul > li > a{display:inline-block; line-height:40px; font-size:13px; text-overflow:ellipsis; display:inline-block; white-space:nowrap; word-wrap:normal; width:70%; overflow-x:hidden;}
.borderNormalList > ul > li > span{display:inline-block; float:right; width:46px; line-height:40px; font-size:12px;}
.borderNormalList > ul > li > span > b{color:#009bfa;}
.borderNormalListBtW > ul{text-align:center;}
.borderNormalListBtW > ul > li{display:inline-block;}
.borderNormalListBtW > ul > li > a{display:inline-block;  line-height:40px; background-color:#333; color:#fff; padding:0 20px;}

/*페이징*/
#paging{float:left; width:100%; padding:38px 0 33px; text-align:center; font-size:16px;}
#paging::after{clear: both; content: " "; display: block;}
#paging > ul {display:inline-block; position:relative; padding:0 38px 0 40px;}
#paging > ul::after{clear: both; content: " "; display: block;}
#paging > ul > li {display:inline-block; height:25px; line-height:25px; text-align:center;}
#paging > ul > li a{color:#666666; display:block; width:24px; height:25px;  position: relative; font-size:12px;}
#paging > ul > li.on > a{color:#0095fa; font-weight:700;}
#paging > ul > div{position:absolute; width:30px; height:25px; line-height:25px;}
#paging > ul > div > a{display:block; width:30px; height:25px; border:1px solid #e3e3e3; }
#pageBtLL{top:0; left:-29px; display:none;}
#pageBtL{top:0; left:0;}
#pageBtR{top:0; right:0;}
#pageBtRR{top:0; right:-29px; display:none;}

.borderNormalView{text-align:left; padding:0 14px;}
.borderNormalView > table{width:100%; border-top:2px solid #333; font-size:13px; padding-bottom:40px;}
.borderNormalView > table > tbody > tr > th, .borderNormalView > table > tbody > tr > td{border-bottom:1px solid #ccc; padding:10px 0;}
.borderNormalView > table > tbody > tr > td{line-height:24px;}
.borderNormalView > table > tbody > tr > td  img{width:100% !important; height:auto !important;}
.borderNormalView > table > tbody > tr > th > span{display:inline-block; font-weight:400; color:#999; padding-top:8px;}
.borderNormalView > table > tbody > tr > th{color:#009bfa;}

.borderNormalView > table > tbody > tr > td input[type=text]{box-sizing:border-box; width:100%; line-height:40px; text-indent:5px;}
.borderNormalView > table > tbody > tr > td input[type=password]{box-sizing:border-box; width:40%; line-height:40px; text-indent:5px;}
.borderNormalView > table > tbody > tr > td textarea{box-sizing:border-box; padding:5px;}
.borderNormalView > table > tbody > tr > td select{width:40%;}

.implantEventFormW{background-color:#404040;  padding:24px 14px;}
.implantEventFormW h3{color:#fff; padding-bottom:20px; font-size:16px;}
.implantEventFormW input{width:100%; line-height:40px; margin-bottom:5px; text-indent:6px; box-sizing:border-box;}
.implantEventFormW textarea{width:100%; line-height:21px; margin-bottom:15px; text-indent:6px; box-sizing:border-box; font-size:13px; height:200px;}
.implantEventFormSubmit{background-color:#0095fa; color:#fff; display:inline-block; cursor:pointer; padding:14px 24px;}
.implantEventFormW > form > .bt{padding:30px 14px 10px; box-sizing:border-box;}
.implantEventFormW > form > .bt > ul{text-align:center; box-sizing:border-box;}
.implantEventFormW > form > .bt > ul > li{display:inline-block; width:46%; padding:4px 0; text-align:center;  box-sizing:border-box;}
.implantEventFormW > form > .bt > ul > li > a > img{ width:90%;}

/*개인정보취급방침*/
#more2{color:#999; font-size:10px;}
#story2{padding:10px 0; font-size:10px;}

/*팝업 레이어*/
.layerPop{
	position:fixed;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	background-color:#fff;
	box-shadow:0 0 10px rgba(0,0,0,0.5);
	display:none;
	z-index:9999;
	max-width:90%;
	max-height:80vh;
	overflow-y:auto;
	border-radius:5px;
	width:auto;
	min-width:280px;
}
.layerPop.on{
	display:block;
}
.layerPop.on::before{
	content:'';
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,0.5);
	z-index:-1;
}
.layerPop > .con{
	box-sizing:border-box;
}
.layerPop > .con img{
	max-width:100%;
	height:auto;
}
.layerPop > .bt{
	font-size:12px;
	border-top:1px solid #e8e8e8;
	background-color:#f5f5f5;
	display:-webkit-box;
	display:-webkit-flex;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack:justify;
	-webkit-justify-content:space-between;
	-ms-flex-pack:justify;
	justify-content:space-between;
	-webkit-box-align:center;
	-webkit-align-items:center;
	-ms-flex-align:center;
	align-items:center;
}
.layerPop > .bt > span{
	display:inline-block;
	padding:8px 12px;
	cursor:pointer;
	font-size:12px;
}
.layerPop > .bt > span.close{
	font-size:14px;
}
.layerPop > .bt > span.close i{
	margin-right:5px;
}