@charset "utf-8";
#container{ padding-top:0;}

/* header*/
#header{ background:none;}
#header:before{ display:none;}
#gnb > li .tit > a{ color:#fff;}
.headerWrap .logo { background:#c31b24 url('../images/common/ci_w.png') no-repeat 50% 50%; width:180px; height:100px;}
.headerWrap .logo a{ width:180px;}
.bn_siteMap{ background:url('../images/common/btn_siteMap.png') no-repeat 100% 50%;}
.util li a,
.util li a:hover:before{ color:#fff;}
.util li a:hover{ color:#ec1744;}

/* header.on */
#header.on{ background:#fff;}
#header.on:before{ content:''; display:block; background:#d8d9da; width:100%; height:1px; position:absolute; top:99px;}
#header.on #gnb > li .tit > a{ color:#333;}
#header.on .headerWrap .logo { background: url('../images/common/ci.png') no-repeat left 10px center; width:230px; height:100px;}
#header.on .headerWrap .logo a{ width:230px;}
#header.on .bn_siteMap{ background:url('../images/common/btn_siteMap_b.png') no-repeat 100% 50%;}
#header.on .util li a,
#header.on .util li a:hover:before{ color:#737373;}
#header.on .util li a:hover{ color:#ec1744;}
#gnb > li > div > ul > li > a{color: #585858;}


/****** visualRolling ******/
.rslides { margin: 0 auto; position: relative;  list-style: none;  overflow: hidden;  width: 100%;  padding: 0; height: 880px }
.rslides li {  -webkit-backface-visibility: hidden;  position: absolute;  display: none;  width: 100%;  left: 0;  top: 0; height: 880px; background-repeat: no-repeat; background-position: 50% 0; background-size: cover;}
.rslides li:first-child {  position: relative;  display: block;  float: left;  }
.rslides img {  display: block;  height: auto; width: 100%;  border: 0;  }
.rslides li img.pc{ display:block;}
.rslides li img.mb{ display:none;}

.rslides li .txt{display:block;width: 100%;padding: 240px 0 0 0;position: absolute;z-index: 2;}
.rslides li .txt dt,
.rslides li .txt dd{color:#fff;}
.rslides li .txt dt{font-size: 4em;line-height: 1.1em;font-weight:700;margin-bottom: 30px;text-align: center;}
.rslides li .txt dt:after{ content:''; display:block; background:#c31b24; width:100px; height:2px; margin:35px auto 0 auto;}
.rslides li .txt dt em{ font-weight:700;}
.rslides li .txt dd{font-size: 1.125em;line-height:1.6;font-weight:normal;text-align: center;}
.rslides li .txt dd em{ display:block;}

.rslides_container {position: relative;width: 100%;z-index: 2;}
.centered-btns_nav { display:none;overflow: hidden; position:absolute; width:49px; height:49px; background:url('../images/main/arr_big.png') no-repeat 0 0; top:50%; text-indent: -9999px;}
.centered-btns_nav.next:active{background-position:-68px -68px; }
.centered-btns_nav.next { left:10px; background-position:0 0; z-index:4;}
.centered-btns_nav.next:hover {background-position:0 -68px;}
.centered-btns_nav.prev { right:10px; background-position:-68px 0; z-index:4;}
.centered-btns_nav.prev:hover {background-position:-68px -68px;}

.transparent-btns_nav {  z-index: 3;  position: absolute;  -webkit-tap-highlight-color: rgba(0,0,0,0);  top: 0;  left: 0;  display: block;  background: #fff; /* Fix for IE6-9 */  opacity: 0;  filter: alpha(opacity=1);  width: 48%;  text-indent: -9999px;  overflow: hidden;  height: 91%;  }
.transparent-btns_nav.next {  left: auto;  right: 0;  }
.large-btns_nav {  z-index: 3;  position: absolute;  -webkit-tap-highlight-color: rgba(0,0,0,0);  opacity: 0.6;  text-indent: -9999px;  overflow: hidden;  top: 0;  bottom: 0;  left: 0;  background: #000 url("themes.gif") no-repeat left 50%;  width: 38px;  }
.large-btns_nav:active {  opacity: 1.0;  }
.large-btns_nav.next {  left: auto;  background-position: right 50%;  right: 0;  }
.centered-btns_nav:focus,
.transparent-btns_nav:focus,
.centered-btns_nav:focus{  outline: none; }
.centered-btns_tabs,
.transparent-btns_tabs,
.centered-btns_tabs{position: absolute;left:0;top:550px;z-index: 100;display: block; text-align: center; width: 100%}
.centered-btns_tabs li,
.transparent-btns_tabs li,
.centered-btns_tabs li {  display: inline-block;  float: none; margin-right: 7px;  }
.centered-btns_tabs a,
.transparent-btns_tabs a,
.centered-btns_tabs a {  text-indent: -9999px;  overflow: hidden;  -webkit-border-radius: 15px;  -moz-border-radius: 15px;  border-radius: 15px;  background: rgba(255,255,255,0.5); display: inline-block;-webkit-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);  -moz-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);  box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);  width: 15px;  height: 15px;}
.centered-btns_here a,
.transparent-btns_here a,
.centered-btns_here a {  background: rgba(255,255,255,1);}

@media only screen and (max-width: 1024px){
	.rslides,
	.rslides li {height: 620px;}
	.rslides li .txt{padding-top: 90px;}
	.rslides li .txt dt{font-size:3.5em; margin-bottom:25px;}
	.rslides li .txt dt:after{margin-top: 30px; width:80px;}
	.centered-btns_tabs, .transparent-btns_tabs, .large-btns_tabs{top: 350px;}
	.rslides img{ width:auto; height: 100%; }
	
}

@media only screen and (max-width: 640px){
	.rslides,
	.rslides li {height: 450px;}
	.rslides li .txt{padding-top: 70px;}
	.rslides li .txt dt{font-size:3.2em; margin-bottom:20px;}
	.rslides li .txt dt:after{margin-top: 25px; width:70px;}
	.centered-btns_tabs{top:inherit;bottom: 180px;}
	.centered-btns_nav{ display:none;}
	.centered-btns_tabs a, .transparent-btns_tabs a, .large-btns_tabs a{ width:12px; height: 12px;}
	.centered-btns_tabs li { margin-right: 5px;}
}

@media only screen and (max-width: 480px){
	.rslides,
	.rslides li {height: 400px;}
	.rslides li .txt{padding-top: 40px;}
	.rslides li .txt dt{font-size:3em; margin-bottom:18px;}
	.rslides li .txt dt:after{margin-top: 22px; width:60px;}
	.rslides li .txt dt em{ display:block;}
	.rslides li .txt dd{ font-size:14px;}
	.centered-btns_tabs, .transparent-btns_tabs, .large-btns_tabs{bottom: 150px;}
	
}

/****** visualRolling ******/
.visualRolling {position: relative; width:100%;} 
.visualRolling:after{content:"";clear:both;	display:block;}
.visualRolling .arrow a {display:block; position:absolute; width:49px; height:49px; background:url('../images/main/arr_big.png') no-repeat 0 0;}
.visualRolling .arrow a span {position:absolute; top:-5000px; left:-5000px; width:0; height:0; font-size:0; line-height:0; overflow:hidden;}
.visualRolling .arrow .next {top:45%; left:10px; background-position:0 0; z-index:4;}
.visualRolling .arrow a.next:hover {background-position:0 -68px;}
.visualRolling .arrow .prev {top:45%; right:10px; background-position:-68px 0; z-index:4;}
.visualRolling .arrow a.prev:hover {background-position:-68px -68px;}
.visualRolling .event_pic {position:relative; width:100%; height:880px; overflow:hidden; }
.visualRolling .event_pic ul {position:relative; height:880px; background:#e6e7eb; }
.visualRolling .event_pic li {position:relative; text-align:center;height:880px; background:#e6e7eb;}
.visualRolling .event_pic li.pic{background-position:100% 0; background-repeat:none;background-size: cover;}
.visualRolling .rolling_btn {position:absolute; left:50%; bottom:225px; width:100px; margin:0 0 0 -50px;overflow:hidden; z-index:5; text-align:center;}
.visualRolling .rolling_btn li { display:inline-block; margin:5px; list-style:none; cursor:pointer;}
.visualRolling .rolling_btn li a { padding:0px}
.event_pic ul li .txt{display:block;box-sizing:border-box;margin:0 auto;width:1100px;padding: 240px 0 0 0;position:relative;z-index: 2;}
.event_pic ul li .txt dt,
.event_pic ul li .txt dd{color:#fff;/*text-shadow: 0px 0px 5px rgba(0,0,0,0.5);font-family:'Nanum Square';*/}
.event_pic ul li .txt dt{ font-size: 65px;line-height: 1.1em;font-weight:700; margin-bottom: 30px;}
.event_pic ul li .txt dt:after{ content:''; display:block; background:#c31b24; width:100px; height:2px; margin:35px auto 0 auto;}
.event_pic ul li .txt dt em{ font-weight:700;}
.event_pic ul li .txt dd{ font-size: 18px;line-height:1.6; font-weight:normal;}
.event_pic ul li .txt dd em{ display:block;}

/****** section ******/
.section {padding:0; position:relative; background:#fff; margin:0 auto; box-sizing:border-box;}
.inner{ position:relative; margin:0 auto; width:1080px; }
.section div{ vertical-align:top;}
.section h2{ font-size:2.5em; color:#000; text-align:center; font-weight:500; margin-bottom:55px; line-height:1em; }
.section h2 span:before{ content:''; display:block; background:#c31b24; width:60px; height:1px; margin:20px auto 15px auto;}
.section h2 strong{ font-weight:700;}
.section h2 span{ font-size:14px; color:#6e6e6e; line-height: 1em; font-weight: 300; display:block; font-family: 'Noto Sans KR','Malgun Gothic', '맑은 고딕', sans-serif;}
.section p{ line-height:1.6; text-align:left; font-size:14px; color:#8c8c8c;}


/****** con01 ******/
.con01{width: 100%;z-index: 3;background: none;}
.con01 .inner{ margin: -205px auto 0 auto;}
.proBox{ text-align:center;}
.proBox li{ display:inline-block; width:340px; position:relative; margin:0 12px; box-sizing:border-box; }
.proBox li a{ display:block;}
.proBox li:first-child{ margin-left:0;}
.proBox li:last-child{ margin-right:0}
.proBox li .pic{ display:block; overflow:hidden;}
.proBox li .tit{ display:block; background:#c31b24; color:#fff; height:45px; line-height:45px;font-size: 0.98em; padding-left: 22px; text-align: left; }
.proBox li a img{transition: 0.4s all ease; -webkit-transition: 0.4s all ease; -moz-transition: 0.4s all ease; -ms-transition: 0.4s all ease; -o-transition: 0.4s all ease;}

.proBox li a:hover img{-ms-transform: scale(1.2); -webkit-transform: scale(1.2); transform: scale(1.2);}

/****** con02 ******/
.con02{ width:100%; background:#fff; overflow:hidden;}
.quickBox{}
.quickBox li { float:left; width:25%; padding:45px 0 45px 70px;}
.quickBox li .txt{ color:#323232; font-size: 1.125em; letter-spacing: -0.04em;}
.quickBox li .txt span{ color:#8d8d8d; font-size:0.78em; display:block; line-height:1.4}
.quickBox li .txt span em{ display:inline-block;}

.quickBox li.mb{ display: none;}
.quickBox li:nth-child(1){ background:url('../images/main/ico_quick00.png') no-repeat 0 50%;}
.quickBox li:nth-child(4){ background:url('../images/main/ico_quick01.png') no-repeat 0 50%;}
.quickBox li:nth-child(5),
.quickBox li:nth-child(3){ background:url('../images/main/ico_quick02.png') no-repeat 0 50%;}
.quickBox li:nth-child(6),
.quickBox li:nth-child(2){ background:url('../images/main/ico_quick03.png') no-repeat 0 50%;}
.quickBox li:nth-child(7){ background:url('../images/main/ico_quick04.png') no-repeat 0 50%;}

/****** con03 ******/ 
.con03{ background:#eaeaea; overflow:hidden;}
.con03 .inner{ padding:70px 0;}
.con03 h2{ margin-bottom:40px;}

.proBox2 {position:relative;}
.proBox2 .arrow{position:relative;}
.proBox2 .arrow a {position:absolute; right:0; top:40px; display:block; width:70px; height:70px; z-index:2; background:url('../images/main/arrow_pro.png') no-repeat; }
.proBox2 .arrow a span { visibility:hidden; text-indent:-9999px;}
.proBox2 .arrow a.prev{ background-position: 0 0;  left:0;}
.proBox2 .arrow a.next{ background-position: -70px 0 ; right:0;}
.proBox2 .arrow a.prev:hover{ background-position: 0 -70px; }
.proBox2 .arrow a.next:hover{ background-position: -70px -70px;}
.proBox2 .scroll-img {position:relative;width: 870px;height: 210px;margin:0 auto;overflow: hidden;text-align: center;}
.proBox2 .scroll-img ul {position:relative;width: 12000px;height: 210px;margin: 0px 0 0 -15px;padding:0;}
.proBox2 .scroll-img ul li {display:inline-block;margin: 0 15px;width: 150px;height: 210px;float: left;position:relative;}
.proBox2 .scroll-img ul li a {display:block; width:100%;}
.proBox2 .scroll-img ul li a p.pic{display:block;width: 150px;height: 150px;background:#fff;border-radius:50%;margin: 0 auto 20px auto;overflow:hidden;}
.proBox2 .scroll-img ul li a p.pic img{}
.proBox2 .scroll-img ul li a:hover{ text-decoration:underline;}
.proBox2 .scroll-img ul li a p{color:#000;text-align:center;font-size: 1em;line-height: 1.4em;}
.proBox2 .scroll-img ul li a p span{color:#6a6a6a;display:block;font-size: 0.8em;line-height: 1.2em;}

/****** con04 ******/ 
.newsBox h2 { font-family: 'Noto Sans KR','Malgun Gothic', '맑은 고딕', sans-serif; font-size:1.05em; color:#232323; font-weight:500; text-align:left; position:absolute; top:0; left:0; margin-bottom:0; line-height:70px;}
.newsBox {height: 70px;padding:28px 30px 25px 0;  overflow:hidden; position: relative;}
.newsBox .more{ position:absolute; right:0;top: 21px;}
.newsBox .more a{ display:block; width:30px; height:30px; background:url('../images/main/ico_more.png') no-repeat 50% 50%; font-size:0;}
.newsBox ul{ padding-left:150px;}
.newsBox li{ float:left; width:50%; height:70px;}
.newsBox li a{ display:block; overflow:hidden;text-overflow:ellipsis;white-space:nowrap; padding-right: 10px; line-height: 1em;}
.newsBox li a img{ margin-right:7px;}

@media screen and (max-width:1024px) {
	
	/****** visualRolling ******/
	.visualRolling .event_pic,
	.visualRolling .event_pic ul,
	.visualRolling .event_pic li{ height:940px;}
	.visualRolling .event_pic li.pic{background-position:50% 0;}
	.event_pic ul li .txt{ width:auto; padding:290px 40px;}
	.event_pic ul li .txt dt{}
	.event_pic ul li .txt dd{}
	.visualRolling .rolling_btn{ bottom:175px;}
	
	/****** section ******/
	.section,
	.inner{ width:100%; }
	.inner{padding: 0 1.5%;box-sizing:border-box;}
	.section h3{ font-weight:400;}
	
	/****** con01 ******/
	.con01 .inner{ margin-top: -155px;}
	.proBox li{ width:31%; margin: 0 1%;}	
	.proBox li span{}
	.proBox li .pic{ height:110px;}
			
	
	/****** con02 ******/
	.con02{ height:auto;}
	
	
		
	/****** con03 ******/
	.con03 .inner{ padding:50px 0;}
	.con03 h2{font-size: 2.2em;margin-bottom: 35px;}
	.proBox2{ padding:0 20px;}
	.proBox2 .scroll-img{width:510px !important}
	.proBox2 .arrow a{background-size: 100px; width:50px; height:50px; top:50px;}
	.proBox2 .arrow a.next{ background-position: -50px 0 ; right:0;}
	.proBox2 .arrow a.prev:hover{ background-position: 0 -50px; }
	.proBox2 .arrow a.next:hover{background-position: -50px -50px;}
	
	/****** con04 ******/ 
	.newsBox ul{ padding-left:130px;}
}
@media screen and (max-width:720px) {
	.quickBox {padding: 25px 0; overflow: hidden;}
	.quickBox li{ width:50%; padding: 15px 0 15px 70px;}
}

@media screen and (max-width:640px) {
	
	/****** visualRolling ******/
	.visualRolling .event_pic,
	.visualRolling .event_pic ul,
	.visualRolling .event_pic li{ height:515px;}
	.visualRolling .event_pic li.pic{background-position: 80% 0;}
	.visualRolling .arrow .next,
	.visualRolling .arrow .prev	{ top:35%;}
	.event_pic ul li .txt{ width:auto; padding:90px 30px; }
	.event_pic ul li .txt dt{ font-size:48px; margin-bottom:20px;}
	.event_pic ul li .txt dt em{ display:block;}
	.event_pic ul li .txt dt:after{ margin:30px auto 0 auto;}
	.event_pic ul li .txt dd{ font-size:14px;}
	.visualRolling .rolling_btn{ bottom:150px;}

	/****** con01 ******/
	.con01 .inner{ margin-top: -130px;}
	.proBox li .pic{  height:90px;}
	.proBox li .tit{ height:40px; text-align: center; padding-left: 0}	
	.proBox li a img{ width:235px;}
	
	/****** con03 ******/	
	.con03 .inner{ padding:30px 0;}
	.con03 h2{ font-size:25px; margin-bottom:25px;}
	.proBox2 .scroll-img {width:150px !important;}
	
	/****** con04 ******/ 
	.newsBox ul{ padding-left:115px;}
	.newsBox li{width:100%}
}

@media screen and (max-width:480px){
	/****** con01 ******/
	.proBox li a img{ width:195px;}
	
	/****** con02 ******/
	.quickBox{ padding:15px 0;}
	.quickBox li{ background-size:50px !important; padding: 15px 0 15px 60px;}
	.quickBox li .txt span em {display: block;}
	.quickBox li.mb{ display: block;}
	.quickBox li:nth-child(3),
	.quickBox li:nth-child(5),
	.quickBox li:nth-child(6){display: none;}
	.quickBox li:nth-child(4){}
	.quickBox li:nth-child(5){}
}

@media screen and (max-width:325px){
	.quickBox li{ background-size:45px !important; padding: 15px 0 15px 55px;}
}