@charset "utf-8";

/* ------------------------	sub	-----------------------------------------*/

#i-am-progress-indicator  {	z-index:9;	position:fixed;	left:-1%;	width:12%;	height:3px;	background:#046939;}
.boximg{display: block; width:90%; max-width: 800px; margin: 0 auto;	padding: 30px 0;}
/* .boximg::after{	display: block;	clear: both;} */

#subcont{ width:100%;}
/* .subsect{ width:100%; max-width:1000px; margin:0 auto; padding:20px 25px 100px 25px; background-color:#fff;} */
.subsect ul li .moreover{ position:relative;}
.subsect ul li .moreover a{ display:block;}
.subsect ul li .moreover a .over{ position:absolute; left:0; top:0; width:100%; height:100%;
	background-color:#000; transition: all 0.3s ease-in-out; opacity:0;}
.subsect ul li .moreover a .over img{ position:absolute; width:60px; left:calc(50% - 30px); top:calc(50% - 30px); }
.subsect ul li .moreover a:hover .over{ opacity:0.5;}

.subsect ul.s1{width:100%;max-width:1071px;margin:0 auto;}
.subsect ul.s1 li{padding:0;margin-top:20px;width:100%;max-width:1071px;
	height:350px;
}
.subsect ul.s1 li a{position: relative;display:block;width:100%;height:350px;text-decoration:none;color:#fff;}
.subsect ul.s2 li{	padding-top:10px;	font-size: 16.5px; margin-top: 30px;}
.subsect ul.s2{width:100%; margin: 0 auto;padding:0 0 30px 0;}

.chp1{float:left;width:calc(50% - 35px);font-size:20px;height:200px;padding:40px 0 0 35px;}
.chp1 > span{font-size:25px;font-weight:bold;padding-bottom: 10px;}
.partsp1{float:left; width:calc(50% - 35px); font-size:20px; height:200px; padding:40px 0 0 35px;
	font-family: 'NanumSquare', 'sans-serif';}
.partsp1 > span{font-size:25px;}
.chp2{float:right;width:calc(50% - 35px);font-size:15px;text-align:right;line-height:24px;
	height:350px; box-sizing: border-box;
	font-family: 'Noto Sans KR','Nanum Gothic','나눔고딕', 'sans-serif';
	padding:40px 35px 0 0;}
.chp3{float:left;width:calc(100% - 70px);height:50px;padding:0 35px 0 35px;font-size:20px;}
.y1{float:left;width:70px;text-align:center;}
.wline{float:left;width:calc(100% - 140px);height:24px;background:url('../images/wline.png') repeat-x 0 15px;}
.y2{float:right;width:70px;text-align:center;}
.smtitle, .smtitle1, .ctitle1, .ctitle2{word-break: keep-all;}
.ctitle1{font-size:26px; font-family: 'NanumSquare', 'sans-serif';	margin-bottom: 20px;color:#000;
/* color:#083562; */
font-weight: bold;}
.ctitle1 span, .ctitle2 span{font-size:19px; color:#4c4c4c;}
.ctitle2{font-size:24px; font-family: 'NanumSquare', 'sans-serif'; color:#000;
font-weight: bold; margin-top: 30px; margin-bottom: 30px;}

.csubtext{ font-size:15px; padding:0 0 15px 0; line-height:1.6; word-break: keep-all;
	font-family: '나눔고딕','Nanum Gothic', 'sans-serif';}
.csubtext1{ font-size:17px; padding:0 0 15px 0; line-height:1.6; word-break: keep-all;text-align:justify;}
.csubtext2{font-size:18px; padding:5px 0 0px 0; line-height:1.4;color:#046939; font-weight: normal;word-break: keep-all;}
.csubtext1 .title2{font-size: 22px;font-weight: bold;line-height:3em;color:#000;}
.csubcontent2{width:calc(100% - 80px);border:1px solid #8dc63f;background-color:#edf6e7;padding:40px;line-height: 30px;}
.csubcontent2 > span:first-child{display:block;text-align:center;font-size:30px;font-weight:bold;color:#10693a;}
.csubcontent2 > span:last-child{display:block;font-size:20px;color:#000;font-weight:bold;}

.sstitle{font-size:23px;text-decoration:none;padding:0 0 20px 0;line-height:40px;}
.stext{font-size:18px;text-align:justify;line-height:35px;letter-spacing:0;}
.simg{text-align:center;padding:40px 0 40px 0;}
.simg img{width:100%;max-width:1000px;}
.simg p{font-size:11px;color:#888;padding:5px 0 5px 0;}

ul.botfunc{width:100%;margin-top:80px;}
.botfunc::after{display:block;content:'';clear:both;}
.likeit{float:left}
.likeit a{display:block;padding:5px;background-color:#fff;border:1px solid #000;
	border-radius:3px;font-size:13px;text-decoration:none;color:#000;}
.likeit a:hover{background-color:#f7f7f7;}
.snslink{float:right;margin-top:3px;}

ul.botnav{width:100%;border-top:1px solid #ccc;padding-top:20px;margin-top:20px;}
.botnav::after{display:block;content:'';clear:both;}
.botnav li{float:left;width:calc(100% / 3);height:40px;}
.botnav li a{display:block;width:;padding:10px;font-size:12px;color:#676767;transition: all 0.3s ease-in-out;}
.botnav li a:hover{color:#c30036;}
.botnav li.menubtn a{border:1px solid #ccc;border-radius:3px;color:#c30036}
.botnav li.menubtn a:hover{background-color:#c30036;color:#fff;}
.botnav .prevbtn{text-align:left;}
.botnav .menubtn{text-align:center;}
.botnav .nextbtn{text-align:right;}

.sidenav {height: 100%;width: 0;position: fixed;z-index: 30;top: 0;right: 0;background-color: #fff;overflow-x: hidden;transition: 0.5s;padding-top: 100px;font-size:15px;}
.sidenav a {padding: 5px 5px 5px 40px;text-decoration: none;color: #000;display: block;transition: 0.3s;}
.sidenav .closebtn {position: absolute;top: 35px;right: 25px;}
.searchbox{display:none;z-index:50;position:fixed;top:80px;left:50%;margin-left:225px;width:274px;height:70px;padding:0 0 0 20px;background:url('../images/searchpop.png') no-repeat 0;}
.dsearchinput{width:170px;height:33px;margin:0;padding:0;border:1px solid #ccc;vertical-align:top;margin-top:20px;padding:0 10px 0 10px;}
.dsearchbtn{margin-top:20px;}
.msearch{padding:15px 5px 5px 40px;}
.msearchinput{width:150px;height:33px;margin:0;padding:0;border:1px solid #ccc;vertical-align:top;}
.bbg{display:none;z-index:20;width:100%;height:100%;position:fixed;top:0;left:0;background-color:rgba(0,0,0,0.7);transition: 0.5s;overflow:hidden;}

/*검색결과*/
.search_page_title{padding:10px 0 0 0;border-bottom:1px solid #000;}
.search_cont{padding:20px 0 20px 0;border-bottom:1px solid #ccc;}
.page_title{font-size:18px;font-weight:bold;}
.page_navi{float:left;width:80%;height:auto;line-height:30px;font-size:14px;color:#6b6b6b;}
.page_link{float:right;display:block;width:150px;padding:5px;font-size:14px;text-align:center;color:#fff;background-color:#c30036;}
.search_text{width:100%;height:110px;font-size:15px;margin:20px 0 10px 0;line-height:22px;/*글자자르기*/display:inline-block;white-space:normal;overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;}

.paging{width:100%;margin:30px 0 30px 0;}
.paging > ul{width:610px;height:32px;margin:0 auto;padding:0;}
.paging > ul > li{float:left;width:40px;margin-left:5px;border:1px solid #ccc;}
.paging > ul > li.arr{border:none;width:30px;}
.paging > ul > li > a{display:block;width:100%;height:30px;line-height:30px;font-size:13px;text-align:center;text-decoration:none;color:#000;}
.paging > ul > li > a.on{background-color:#c30036;color:#fff;}

ul.tabs {margin:0;padding:0;float:left;list-style:none;height:32px;border:1px solid #e8e8e8;width:calc(100% - 3px);}
ul.tabs li{float:left;margin:0;padding:0;height:32px;line-height:32px;border-left:1px solid #e8e8e8;margin-bottom: -1px;overflow: hidden;position: relative;width:calc(100% / 5 - 1px);}
ul.tabs li:first-child {border:0;}
ul.tabs li a {text-decoration:none;color:#777777;display: block;font-size:12px;width:100%;text-align:center;transition: all 0.3s ease-in-out;}
ul.tabs li a:hover {font-weight:bold;background-color:#c30036;color:#FFF;}
html ul.tabs li.active, html ul.tabs li.active a {background-color:#c30036;color:#FFF;font-weight:bold;}

/* 700~1023 */
@media (max-width:1023px){
.img2 li{float:none;width:100%;}
.img3 li{float:none;width:100%;}
.img4 li{float:none;width:100%;}
.img5 li{float:none;width:100%;}
.ssize li img{max-width:400px;}
#header .topsect .toplogo{margin-left:20px;}
#header .topsect .topnav{display:none;}
#header .topsect .topnavm{display:inline;}
#mtopnav{display:inline;}
#subvisual .subtext{width:calc(100% - 40px);height:auto;padding:0 20px 0 20px;text-align:center;left:0;text-align:center;}
#subcont ul{width:calc(100% - 20px);}

.chp1{float:none;font-size:16.5px;width:calc(100% - 20px);padding:20px 0 0 20px;height:auto;}
.chp1 > span{font-size:20px;font-weight:bold;}
.chp2{float:none;width:calc(100% - 40px);height:160px;padding:10px 20px 0 20px;
font-size:14px;
text-align:left;opacity:.8/*column-count:2;coumn-gap:20px;*/}
.chp3{float:none;width:calc(100% - 40px);padding:0 20px 0 20px;font-size:20px;}
.hd{height:140px;}
.mimg{width:100%;}



.page_navi{float:none;width:100%;line-height:20px;margin:10px 0 10px 0;}
.page_link{float:none;width:100%;margin:10px 0 10px 0;}
}

/* ~ 699 */
@media (max-width:699px){
/* .subsect ul.s1 li a{height: 310px;}   */
.chp1, .chp2, .chp3{ float:none;}
.chp1, .partsp1{ width:100%; line-height: 1.4;}
.chp2{ width:86%; height: auto; line-height:20px;  font-size:13px; text-align: left; padding-bottom: 0px;
  /* max-height: 130px; overflow: hidden;  text-overflow: ellipsis;   display: -webkit-box;
    -webkit-line-clamp: 4;  -webkit-box-orient: vertical; */}
.chp3{ position: absolute;  display: inline-block; width:calc(100% - 30px); height:20px; bottom: 20px;
   padding:0 15px; font-size:20px; }
.partsp1{height: 73px; padding: 20px 0 0 20px;}
.y1{float:left;width:70px;text-align:center;}
.wline{float:left;width:calc(100% - 140px);height:24px;background:url('../images/wline.png') repeat-x 0 15px;}
.y2{float:right;width:70px;text-align:center;}

.paging > ul{width:100%;}
#subcont ul{width:100%;}
.csubtext1{line-height: 1.5;text-align:left;}
}

/******* sub01 *****/
#subcont2 {  margin: 0 auto;}
.greeimg {  float: left;  width: 45%;  height: auto;  margin: 80px 30px 20px 0;}
.greetext, .smtitle, .smtitle1, .gtext, .gtext1{font-family: 'NanumSquare', 'sans-serif';	}
.greetext {  float: left;  width: calc(55% - 51px);  padding-left: 20px;
	margin-bottom: 30px;	border-left: 1px solid #083562;	}
.smtitle {  font-size: 32px;  color: #046939;  padding: 20px;  line-height: 50px;}
.smtitle1 {  font-size: 24px; color: #333333; padding: 10px 0 20px 0;  line-height: 50px;}
.smtitle2 {  font-size: 32px;   padding: 10px 0 20px 0;  line-height: 50px;}
.smtitle2 span{  color: #75983e; font-weight: bold;}

.gtext {  font-size: 20px;  line-height: 40px;  padding-top: 15px;  letter-spacing: -0.8px;}
.gtext1 {  font-size: 20px;   padding-top: 15px;  letter-spacing: -0.8px;}
.greetext2 {	display: none;  float: left;  width: calc(50% - 51px);
  border-left: 1px solid #083562;  padding-left: 20px;  margin-bottom: 30px;}
.greesign {  float: right;  width: 263px;}
.clear {  clear: both;}

@media (max-width: 999px){
.gtext{font-size: 18px; line-height: 1.7;}
.smtitle, .smtitle1, .smtitle2{	margin-top: 30px;	font-size: 26px;	line-height: 1.6;}
.greetext {  width: 100%;  border-left: none;  padding: 0;}
.acont .gtext, .acont .gtext1{	width: 100%;	border-left: none;	padding: 0;}
.greeimg {	position: relative;	display: block;  width: 100%;  height: auto;
  margin: 0 auto;	text-align: center;}
}
@media all and (max-width:768px){
.smtitle, .smtitle1, .smtitle2 {	font-size: 24px;	line-height: 1.3; margin: 15px 0 10px;}
.ctitle1, .ctitle2{	font-size: 24px;	line-height: 1.3; margin: 15px 0 10px;}
.csubtext2{line-height: 1.4;}
}

/******* sub02 *****/
#txt .photobox[data-type="3"].revers .item:nth-child(1) { margin-left: 4em;  margin-right: 0;}
.photos[data-type="3"][data-src] {  position: relative;  padding: 1.2em 1.2em 1.2em 0;}
.photos[data-type="3"][data-src]:not([class*="no_bg"]):before { opacity: 0; content: ""; display: block; position: absolute;
  right: 0em;  top: 0;  width: 50%;  height: 100%;  padding: 1.2em; background-color: #f1f1f1; box-sizing: border-box;
  animation-name: photobox_type_3_before;  animation-fill-mode: forwards;  animation-iteration-count: 1;
  animation-direction: linear;  animation-duration: 1s;  animation-delay: 1s; -webkit-animation-name: photobox_type_3_before;
  -webkit-animation-fill-mode: forwards;  -webkit-animation-iteration-count: 1;  -webkit-animation-direction: linear;
  -webkit-animation-duration: 1s;  -webkit-animation-delay: 1s;}
.photos[data-type="3"][data-src] img {  width: 100%;}
#txt .photobox[data-type="3"].revers .item {  float: right;}
.btn_group {  margin-top: 2em;}
#txt .btns.type_2 {  color: #1f8ecd;  border-width: 0.1em;  border-color: #1f8ecd;}
#txt .btns span {  display: block;  position: relative;  z-index: 100;
  padding: 0.6em 3em 0.6em 1.2em;  font-size: 1em;}
/******* sub03 *****/
#subvisual {   position: relative;  width: 100%;  overflow: hidden;}
#subvisual .subimg {  width: 100%;  height: 300px;  text-align: center;}
#subvisual .subtext {  position: absolute; width: 100%; max-width: 1000px; height: 40px; left: calc(50% - 500px);
	top: 50%;	transform: translateY(-50%);  font-size: 30px;  color: #fff;  text-shadow: 1px 1px 3px rgba(0,0,0,0.8);}

.sub04{	width: 100%;}
.sub04txt02{	font-size: 60px;	color: #999999;	font-family: 'Titillium Web','sans-serif';}
.sub04 ul li{	display: inline-block;	width: calc(50% - 5px);	margin-bottom: 5px;}
.sub04Box li {	position: relative;	display: block;	width: 100%;
  margin-bottom: 10px;  font-size: 16px;  line-height: 1.6em;}
.sub04Box li div{	display: inline-block;}
.sub04Box li .sub04BoxL{	text-align: center;	width: 14%;	vertical-align: top;}
.sub04Box li .sub04BoxL p{	vertical-align: middle;	width: 104px;	height: 111px;
	display: inline-block;	border:1px solid #ffffff;	border-radius: 50%;}
.sub04Box li .sub04BoxR{	width: 83%;}
.sub04Box li .sub04BoxR p.acont{	font-size: 16px;}
.sub04Box li .sub04BoxL p.sub04img01{border:4px solid #eec045;}
.sub04Box li .sub04BoxL p.sub04img02{border:4px solid #69d9e3;}
.sub04Box li .sub04BoxL p.sub04img03{border:4px solid #bd9cce;}
.sub04Box li .sub04BoxL p.sub04img04{border:3px solid #8ac865;}
.sub04Box li .sub04BoxL p.sub04img05{border:3px solid #6ab2e2;}
.sub04Box li .sub04BoxL p.sub04img06{border:3px solid #f8a88c;}

.sub04img01{background: url(../img/sub/sub04/sub04_img01.jpg)no-repeat center/cover;}
.sub04img02{background: url(../img/sub/sub04/sub04_img02.jpg)no-repeat center/cover;}
.sub04img03{background: url(../img/sub/sub04/sub04_img03.jpg)no-repeat center/cover;}
.sub04img04{background: url(../img/sub/sub04/sub04_img04.jpg)no-repeat center/cover;}
.sub04img05{background: url(../img/sub/sub04/sub04_img05.jpg)no-repeat center/cover;}
.sub04img06{background: url(../img/sub/sub04/sub04_img06.jpg)no-repeat center/cover;}

/******/
.cultbl{color:#000;margin-top:50px;}
.cultbl > td{padding:20px 0 0 0;line-height:15px;}
.cultbl td.title{width:15%;max-width:80px;border-top:3px solid #808285;color:#25411d;font-size:17px;font-weight:bold;vertical-align:top;}
.cultbl td.content{font-size:17px;padding-left:80px;}
.cultbl td.content > span{font-weight:bold;}
.cultbl td.content > ul{list-style-type:disc;}
.cultbl td.content > ul > li{padding:0;}


@media all and (max-width:768px){
.sub04Box li .sub04BoxL p{ width: 77%;	height: 11vw;	}
.sub04txt02{	font-size: 40px;}
}
/**************/
.subsect { width:calc(100% - 60px);max-width: 1000px;margin: 0 auto; padding: 20px 30px 50px 30px; background-color: #fff;  }
.stsect {	display: block;  width: 100%;  margin: 0 0 30px 0;}
#part1, #part2, #part3, #part4, #part5 {  position: absolute;  margin-top: -100px;  visibility: hidden;}
.stsect::after {  display: block;  content: "";  clear: both;}
.stsect > dt {  width: 100%;  font-size: 20px;  font-weight: bold;  color: #083562;
  border-bottom: 1px solid #ccc;  padding: 20px 0 10px 0;}
.stsect > dt .stpart {  float: left;  font-size: 14px;  margin-right: 10px;  line-height: 29px;}
/*.stsect .stcont {margin: 25px 0 10px 10px;
  padding: 0;  cursor: pointer;  overflow: hidden;}*/

.stsect .stcont {
	display: inline-block; box-sizing: border-box; float: left;
	width: calc(100% / 2 - 12px);
	 margin: 25px 6px 10px 6px;
  padding: 0;  cursor: pointer;  overflow: hidden;}

.stsect #stimg {padding-bottom:30px; text-align:center;}

.stsect .stimg {  float: left;  width: 200px;  height: 200px;  padding: 5px;
  margin: 0 10px 0 0;  border: 1px solid #ccc; }

.stsect .sttitle {  font-size: 16.5px; color:#083562; font-weight:bold;}
.stsect .text1 {  font-size: 15px; color:#919191; margin:20px 0 20px 0; }
.stsect .text2 {  font-size: 16.5px; color:#919191 }
.stsect .sttext {	font-size: 14px;  color: #919191;  margin-top: 8px;  line-height: 18px;}



@media all and (max-width:1023px){
.subsect{width:calc(100% - 50px); padding: 10px 15px 30px 15px;max-width: inherit;}
.subsect ul.s2{width:99%;padding:0 0 30px 0;}
#subvisual .subtext { width: calc(100% - 40px);  height: auto;  padding: 0 20px;  text-align: center;  left: 0;}
}

@media (max-width: 699px){
.stsect > dt .stpart{float: inherit;}
.stsect .stcont { width: 100%; margin: 20px 0 0 0; padding: 0; float: none; cursor: pointer;}
.subsect{ width:calc(90% - 10px); padding: 0; }

}
