@import url("common.css");

/* visual */
#visual {width:100%; height:100%;position:relative;  /*anim*/ clear:both; /*top:-30px; opacity:0 */}
#visual .slick-slider {position: relative; display: block;}
#visual .slick-list {position: relative; display: block; overflow: hidden;}
#visual .slick-slide {display: none; float: left; height: 100%; min-height: 1px;}
#visual .slick-initialized .slick-slide{display: block;}
#visual .slick-vertical .slick-slide{display: block; height: auto; border: 1px solid transparent;}

#visual .slick-prev, #visual .slick-next{ font-size: 0; line-height: 0; position: absolute; top: 53%; display: block; cursor: pointer; color: transparent; border: none; outline: none; background: transparent;}

#visual .cover01{background-image:url('../images/main/visual_01.jpg');}
#visual .cover02{background-image:url('../images/main/visual_02.jpg');}



#visual .sub_imgbox{height:100%;}
#visual .section{margin-bottom:2px;width:100%;height:100%;min-height:400px;position:relative;overflow:hidden;background-position:center;background-size:cover; border:0;}
#visual .sub_imgbox .slick-list ,
#visual .sub_imgbox .slick-track {height:100%;}


.slick-dots{position: absolute; right:20px; top:140px; z-index:99}
.slick-dots li{float:left; margin:0 2px}
.slick-dots li button{width:14px; height:14px; border:0; font-size:0; background-color:rgba(255,255,255,.4); cursor:pointer}
.slick-dots li.slick-active button{background-color:#fff}

/*#visual .text_area{width:100%;  text-align:center;color:#fff;position:absolute;top:57%;-moz-transform:translateY(-57%);-ms-transform:translateY(-57%);-webkit-transform:translateY(-57%);transform:translateY(-57%);z-index:1}*/

/*#visual .text_area{width: 100%; max-width:1170px; color:#fff;position:absolute;left: 50%; margin-left: -585px;top:32%;-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-webkit-transform:translateY(-50%);transform:translateY(-50%);z-index:1}*/

.visual_txt {clear:both;opacity:0;top:-30px; /*opacity:0;top:-30px; */}
#visual .text_area{position:relative; max-width:1170px; margin:220px auto 0 auto;  color:#fff; /*left: 50%; margin-left: -585px;*//*top:125px;*/ top:11%; z-index:1; }

#visual .text_area .eng1{position: relative; line-height:100%; color:#fff; font-size:50px; font-family: 'Montserrat', sans-serif; font-weight:800;  margin-bottom:10px;text-shadow: 0 0 5px rgba(0, 0, 0, 0.4);text-transform: uppercase;}
#visual .text_area .eng1:after{content:'';position:absolute; text-align: left; top:-19px; left:0%; margin-left:0px; /*border-bottom:1px solid rgba(255,255,255,1);*/  display: inline-block; width:31px; border-top:6px solid #fff;border-radius: 50px; }
#visual .text_area .eng1 span {color: #f9262f;line-height:100%;font-size:50px; font-family: 'Montserrat', sans-serif; font-weight:800;}

/*
#visual .cover03 .text_area .eng1:after{display:none;}
#visual .cover04 .text_area .eng1:after{display:none;}
*/
/*
#visual .text_area .eng2:after{content:'';position:absolute; bottom:6px; left:50%; margin-left:-225px; border-top:1px solid rgba(255,255,255,0.5); display: inline-block; width:450px; height:1px}

#visual .text_area .eng2{position: relative; line-height:100%; font-family: 'Montserrat', sans-serif; font-weight:100; font-size:50px;margin-bottom:25px; letter-spacing: 3pt;}

#visual .cover02 .text_area .eng2{letter-spacing:0;position: relative; line-height:100%; font-family: 'Montserrat', sans-serif; font-weight:700; font-size:50px;margin-bottom:25px;}

#visual .text_area .krt{-webkit-text-size-adjust: 100%; font-size:25px; font-family:'Montserrat', sans-serif; line-height:100%; margin-bottom:12px; letter-spacing:0px;}
*/
/*#visual .text_area .krt:after{content:'';position:absolute; top:2px; left:50%; margin-left:-225px; border-top:1px solid rgba(255,255,255,0.2); display: inline-block; width:450px; height:1px}
*/
#visual .text_area .krb{-webkit-text-size-adjust: 100%; font-size:20px; font-family:"NotoKR-Regular", Sans-serif; line-height:140%; margin-bottom:12px; letter-spacing:-1px;text-shadow: 0 0 5px rgba(0, 0, 0, 0.3);}
/*#visual .text_area .krb:after{content:'';position:absolute; top:2px; left:50%; margin-left:-225px; border-top:0px solid rgba(255,255,255,0.2); display: inline-block; width:450px; height:1px}*/
#visual .text_area .krb strong {font-family:"NotoKR-Bold", Sans-serif;}
#visual .text_area .krb br{display:block;}

#visual .text_area .kr{font-size:17px; color:rgba(255,255,255,0.8); line-height:24px; letter-spacing:-0.8px; -webkit-text-size-adjust: 100%;}
#visual .text_area .kr .none{display:none;}

#visual .text_area .vbtn{border-radius:50px; letter-spacing:-0.5px; padding:21px 0; font-size:15px; color:#fff; background:rgba(255,255,255,0.1);border:2px solid #fff; text-align:center; line-height:100%; display:block; width:206px; margin:50px auto 0 auto;transition: all 0.3s ease; -o-transition: all 0.3s ease;  -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; box-sizing: border-box;}
#visual .text_area .vbtn:hover{color:#fff;background:#b21b21; border:2px solid #b21b21;}

#visual .text_main {margin-top: 120px;}

/* Arrows */
#visual .sub_imgbox .slick-prev, #visual .sub_imgbox .slick-next{position: absolute; display: block; top:50%; width: 60px;height: 60px; padding: 0;  -webkit-transform: translate(0, -46%);    -ms-transform: translate(0, -46%);
	transform: translate(0, -46%);cursor: pointer;  color: transparent; border: none; outline: none; background: transparent; z-index:999; font-size:0}
#visual .sub_imgbox .slick-prev{left:40px; background:url('../images/main/v_arrow_l.png') no-repeat left center;}
#visual .sub_imgbox .slick-next{right:40px; background:url('../images/main/v_arrow_r.png') no-repeat right center;}
#visual .sub_imgbox .slick-slider{position: relative;display: block;box-sizing: border-box;
	-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-touch-callout: none;-khtml-user-select: none;-ms-touch-action: pan-y;
		touch-action: pan-y;-webkit-tap-highlight-color: transparent;	}
#visual .sub_imgbox .slick-list{position: relative;display: block;overflow: hidden;margin: 0;padding: 0;}
#visual .sub_imgbox .slick-initialized .slick-slide{display: block;}

/*
#visual .scroll_down{width:88px; margin-left:-44px; position:absolute; bottom:0; left:50%; text-align:center; z-index:99;}
#visual .scroll_down:after{content:'';position:absolute; top:30px; left:50%; margin-left:-7px; display: inline-block; background:url(../images/main/mouse_down.png) no-repeat 50% 0px;width:31px; height:51px;}
#visual .scroll_down a{color:#f5f5f5; font-size:14px; font-weight:600; line-height:100%; font-family: 'Montserrat', sans-serif;}
#visual .about_wrap .line{background:rgba(255,255,255,0.5); width:0px; height:63px; margin:10px auto 0 auto}
*/


/* main */
#visual .scroll_down a {
	position:absolute; 
	bottom:55px; 
	left:50%; 
	margin-left:-80px; 
	padding-top:10px; /*padding-top:60px; */
	width:160px; 
	height:60px; 
	background:url("../images/main/mouse_down.png") 50% 0 no-repeat; 
	color:#f5f5f5;
	font-family: 'Montserrat', sans-serif;
	text-align:center;
	letter-spacing:3px;
	text-decoration:none;
	font-size:16px; 
	font-weight:800;
	line-height:100%;
	z-index:10;
	animation: scroll_ani 1.8s ease-in-out infinite;
}
#visual .scroll_down a{color:#f5f5f5; font-size:16px; font-weight:600; line-height:100%; font-family: 'Montserrat', sans-serif;}
@keyframes scroll_ani {          
       0% {bottom: 25px;} 
	   50% {bottom: 45px;}  
       100% {bottom: 25px;} 
}

.main_btn1{margin-top:50px; font-weight:600; font-family: 'Montserrat', sans-serif; border-radius:140px; padding:18px 0; font-size:13px; color:#2d3133; background:rgba(255,255,255,0.9);
text-align:center; line-height:100%; display:block; width:140px; transition: all 0.3s ease; -o-transition: all 0.3s ease;  -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease;}
.main_btn1:hover{color:#fff;background:#006eb7}


.main_btn2{font-family: 'Montserrat', sans-serif; font-weight:600; border-radius:50px; padding:21px 0; font-size:13px; color:#2d3133; background:rgba(255,255,255,0.9); text-align:center; line-height:100%; display:block; width:206px; margin:40px auto 0 auto;transition: all 0.3s ease; -o-transition: all 0.3s ease;  -ms-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease;}
.main_btn2:hover{color:#fff;background:#006eb7}




.main_line{width:1px; background:#333; height:80px;}
.main_sq{background:#333; width:8px; height:8px; border-radius:8px;}

h3.main_title{font-size:35px; font-family: 'Montserrat', sans-serif; line-height:100%; font-weight:400; color:#2d3133; text-align:center; letter-spacing: 0em; margin-bottom: 5px;}
h3.main_title span{font-family: 'Montserrat', sans-serif; font-weight:900; color: #2d3133; letter-spacing: 0em;}
p.margin_smtxt{font-size:17px; color:#999; line-height:140%; letter-spacing:-0.9px; text-align:center;}


/* Contents */
.contentArea .more {font-weight:800; font-family:'Montserrat', sans-serif; color:#b21b21; font-size:12px;  text-decoration:underline;}
.contentArea a.more {width:134px; height:47px; line-height:47px; background-color:rgba(255,255,255,0.8); display:block; margin:30px auto 0 auto;text-decoration:none; -webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}
.contentArea a.more:hover {background-color:#144e94; color:#fff; -webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}





/*============= about_wrap =============*/
#about_wrap{width:100%; position: relative; top: 0px; overflow: hidden; background:#f5f5f5; padding:120px 0 127px 0; /*padding:83px 0 127px 0;*/}
#about_wrap h3{text-align:center;}
#about_wrap p{text-align:center;}
#about_wrap p br {display:block;}

#about_wrap .about_in{position: relative; overflow: hidden; max-width:1170px; margin:0 auto;}
#about_wrap .about_box {position:relative; top:0px; z-index:99; }
#about_wrap .about_box ul {margin:0px auto; width:100%; max-width:1170px; overflow:hidden; padding:85px 0 0 0;}
#about_wrap .about_box li {float:left; width: 29%;  margin-right:6.5%; /*box-sizing:border-box;*/}
#about_wrap .about_box li.three {margin-right:0%;}
#about_wrap .about_box li a {display:block;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}
#about_wrap .about_box li a:hover {-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}
#about_wrap .about_box li a:hover > p.about_img{opacity:.8}
#about_wrap .about_box li a:hover > .txt p.tit{color:#000}
#about_wrap .about_box li a:hover > .txt p.sub_txt{color:#888;}
#about_wrap .about_box li a:hover > .txt p.more{color:#fff !important;padding:0 0 0 55px;background:#af070d url('../images/main/more_icon.png') 80% 14px no-repeat;}

#about_wrap .about_box li a p {}

#about_wrap .about_box li a .txt {width:100%; padding:0px; box-sizing:border-box; }
#about_wrap .about_box li a .txt p.tit {font-size:24px; color:#333; letter-spacing:-0.5pt;}
#about_wrap .about_box li a .txt p.sub_txt {font-size:15px; color:#888; letter-spacing:-0.5pt; line-height:150%; padding: 10px 0 15px 0;}
#about_wrap .about_box li a .txt p.more{ max-width:320px; height:36px; background-color:#af070d; vertical-align: middle;}
#about_wrap .about_box li a .txt p.more:hover {}

#about_wrap .about_box li a .txt .more { text-align: left; margin-top: 15px; color:#fff !important; text-decoration: none !important; padding:0 0 0 40px;  margin-left: 0px; background:#af070d url('../images/main/more_icon.png') 90% 14px no-repeat; font-size:12px;line-height:40px;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}


#about_wrap li a {display:block; width:100%; padding-top:120px; padding-bottom:0px; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;transition:all 0.3s;}
#about_wrap li a:hover {-webkit-transition:all 0.3s;-moz-transition:all 0.3s;transition:all 0.3s;}
	#about_wrap li.one a {background:url('/images/main/about_icon_01.png') center 8px no-repeat;}
	#about_wrap li.two a {background:url('/images/main/about_icon_02.png') center 8px no-repeat;}
	#about_wrap li.three a {background:url('/images/main/about_icon_03.png') center 8px no-repeat;}	

	#about_wrap li.one a:hover {background:url('/images/main/about_icon_01.png') center 3px no-repeat;}
	#about_wrap li.two a:hover {background:url('/images/main/about_icon_02.png') center 3px no-repeat;}
	#about_wrap li.three a:hover {background:url('/images/main/about_icon_03.png') center 3px no-repeat;}
/*============= //about_wrap =============*/


/*============= about_wrap =============*/
#repr_wrap{width:100%; position: relative; overflow: hidden; background:#f5f5f5; padding:104px 0 100px 0;}
#repr_wrap h3{text-align:center;}
#repr_wrap p{text-align:center;}
#repr_wrap p br {display:none;}
#repr_wrap .repr_in{position: relative; overflow: hidden; max-width:1170px; margin:0 auto;}
#repr_wrap .repr_box {position:relative; top:0px; z-index:99; }
#repr_wrap .repr_box ul {margin:0px auto; width:100%; max-width:1170px; overflow:hidden; padding:0px 0 0 0;}
#repr_wrap .repr_box li {float:left; width: 25%;}
#repr_wrap .repr_box li a {display:block;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}
#repr_wrap .repr_box li a:hover {-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}
#repr_wrap .repr_box li a:hover > p.repr_img{opacity:.8;}

/* img over */
#repr_wrap .repr_box li a .repr_img { width: 100%; height: 197px; min-height: 197px; overflow: hidden; position: relative;}
#repr_wrap .repr_box li a .repr_img img {position: absolute; top: -9999px; right: -9999px; bottom: -9999px; left: -9999px; margin: auto; min-width: 100%; min-height: 100%; }
#repr_wrap .repr_box li:hover a .repr_img img { animation:vs_img 3s ease-in-out; -webkit-animation:vs_img 3s ease-in-out; -moz-animation:vs_img 3s ease-in-out;}

@keyframes vs_img { 
	0% { transform:scale(1,1); -webkit-transform:scale(1,1); -moz-transform:scale(1,1);}
	100% { transform:scale(1.15,1.15); -webkit-transform:scale(1.15,1.15); -moz-transform:scale(1.15,1.15);}
}

/* //img over */

#repr_wrap .repr_box li a p {}
	#repr_wrap .repr_box li .one a p.repr_img {background:url('../images/main/repr_img01.jpg') center center no-repeat;}
	#repr_wrap .repr_box li.two a p.repr_img {background-image:url('../images/main/repr_img02.jpg');}
	#repr_wrap .repr_box li.three a p.repr_img {background-image:url('../images/main/repr_img03.jpg');}
	#repr_wrap .repr_box li.four a p.repr_img {background-image:url('../images/main/repr_img04.jpg');}

.txt_red a .txt { background: #af070d;}
.txt_red a .txt p.tit { color:#fff !important; }
.txt_red a .txt p.sub_txt { color:rgba(255,255,255,0.9) !important; }
.txt_red a .txt p.more { color:#fff !important; }

.txt_white a .txt { background: #fff;}
.txt_white a .txt p.tit { color:#222 !important; }
.txt_white a .txt p.more {color:#b21b21 !important;}

#repr_wrap .repr_box li a .txt {width:100%; padding:22px 0 26px 0; box-sizing:border-box; }
#repr_wrap .repr_box li a .txt p.tit {font-size:24px; letter-spacing:-0.5pt;}
#repr_wrap .repr_box li a .txt p.sub_txt {font-size:15px; color:#888; letter-spacing:-0.5pt; line-height:150%; padding: 10px 0 15px 0;}
#repr_wrap .repr_box li a .txt p.more{vertical-align: middle;}
#repr_wrap .repr_box li a .txt p.more:hover {}

#repr_wrap .repr_box li a .txt .more {text-decoration: none !important;font-size:12px;line-height:120%;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}


#repr_wrap li a {display:block; width:100%; padding-top:0px; padding-bottom:0px; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;transition:all 0.3s;}
#repr_wrap li a:hover {-webkit-transition:all 0.3s;-moz-transition:all 0.3s;transition:all 0.3s;}

/*============= //about_wrap =============*/



/*============= vision_wrap =============*/

/* vision */
#vision_wrap{width:100%; position: relative; overflow: hidden; background:#fff; padding:83px 0 90px 0;}
#vision_wrap h3{text-align:center; padding-bottom: 34px;}
#vision_wrap p{text-align:center;}
#vision_wrap p br {display:none;}
.titkr {font-size: 32px !important; line-height: 135%;}
#vision_wrap .vision_in{position: relative; overflow: hidden; max-width:1170px; margin:0 auto;}
#vision_wrap .vision_box {position:relative; top:0px; z-index:99; }

.vision_con{position:relative; overflow:hidden;}
.vision_con h3.title{margin-bottom:40px;font-family:'NotoKR-Light',sans-serif; font-size: 30px;}
.vision_con h5.sub_stitle{text-align:center;}
.vision_con .icon_list{position:relative; overflow:hidden; margin-top:0px}
.vision_con .icon_list dl{position:relative; float:left; width:29.9145299145%; text-align:center; margin-right:5.12820512821%}
.vision_con .icon_list dl:last-child{margin-right:0}
.vision_con .icon_list dl .icon{width:200px; height:200px; margin:0 auto 20px auto; border-radius: 100%;}

.vision_con .icon_list dl.one .icon{background:url('../images/main/vision_icon01.png') center no-repeat, #af070d; background-size: 75px;}
.vision_con .icon_list dl.two .icon{background:url('../images/main/vision_icon02.png') center no-repeat, #eaeaea; background-size: 75px;}
.vision_con .icon_list dl.three .icon{background:url('../images/main/vision_icon03.png') center no-repeat, #af070d; background-size: 75px;}

.vision_con .icon_list dl:after {position: absolute;right: -50px; top: 75px; display: block; width: 41px; height: 41px;background: url('../images/main/plus.png') center no-repeat;background-size:41px; content: '';}
.vision_con .icon_list dl:nth-child(1):after{display:none;}
.vision_con .icon_list dl:nth-child(3):after{display:none;}

.vision_con .icon_list dl p.sub_bt {font-family:'NotoKR-Regular', Sans-serif;font-weight: 400; line-height: 150%; font-size: 24px; letter-spacing: -0.8pt; color: #333; margin-top: -5px;}
.vision_con .icon_list dl p.sub_engt{font-family: 'Montserrat', sans-serif; font-weight: 600; line-height: 140%; font-size: 20px;}
.vision_con .icon_list dl p.sub_txt {font-family:'NotoKR-Regular', Sans-serif;font-weight: 400; line-height: 150%; font-size: 15px; letter-spacing: -0.8pt; color: #888; padding-top: 5px;}
.vision_con .icon_list dl p.sub_txt br {display: block !important;}

.vision_con .icon_list dl.one p.sub_engt{color:#af070d}
.vision_con .icon_list dl.two p.sub_engt{color:#af070d}
.vision_con .icon_list dl.three p.sub_engt{color:#af070d}

/*============= //vision_wrap =============*/




/*******************************************************************************
	@media 1024px~1200px
*******************************************************************************/
@media all and (max-width:1200px){

	

#visual .text_area{ width: 95%; margin:200px auto 0 auto; top:11%; }

	
/*** product_wrap ***/
#product_wrap .inner {width: 96%;}
#product_wrap .slick-slider {width: 96%; margin:0 auto; }
#product_wrap .slick-slide {position:relative; }
#product_wrap .slick-slide {}
#product_wrap dl{width:97%; margin:0 auto;}
#product_wrap dl a{width:100%;}
#product_wrap .slick-active dl a:after{width:100%;}
	
}
	
/*******************************************************************************
	@media 1024px~1200px
*******************************************************************************/
@media all and (max-width:1169px){

	
#visual .text_area{ width: 95%; margin:180px auto 0 auto; top:11%; }


	
h3.main_title{font-size:35px;}
p.margin_smtxt{font-size:15px; line-height:22px;}


/*============= about_wrap =============*/

#about_wrap .about_in{width: 95%;}
#about_wrap .about_box ul {padding:65px 0 0 0;}
#about_wrap .about_box li {width: 30%;  margin-right:5%;}
#about_wrap .about_box li.three {margin-right:0%;}
#about_wrap .about_box li a:hover > .txt p.more{padding:0 0 0 55px;background:#af070d url('../images/main/more_icon.png') 80% 14px no-repeat;}

#about_wrap .about_box li a p {}

#about_wrap .about_box li a .txt {width:100%; }
#about_wrap .about_box li a .txt p.tit {font-size:22px;letter-spacing:-0.5pt;}
#about_wrap .about_box li a .txt p.sub_txt {font-size:14px; letter-spacing:-0.5pt; line-height:150%; padding: 10px 0 15px 0;}
#about_wrap .about_box li a .txt p.more{ max-width:320px; height:36px;}
#about_wrap .about_box li a .txt p.more:hover {}

#about_wrap .about_box li a .txt .more { text-align: left; margin-top: 15px;padding:0 0 0 40px;  margin-left: 0px; background:#af070d url('../images/main/more_icon.png') 90% 14px no-repeat; font-size:12px;line-height:40px;}
	
/*============= //about_wrap =============*/	
	
/*============= repr_wrap =============*/
#repr_wrap{width:100%; padding:104px 0 100px 0;}
#repr_wrap .repr_in {width: 95%;}
#repr_wrap .repr_box li {float:left; width: 25%;height: auto;}

	/* img over */
#repr_wrap .repr_box li a .repr_img { width: 100%; height: auto; min-height: 170px;}
/* //img over */

#repr_wrap .repr_box li a .txt {width:100%; padding:22px 0 26px 0;}
#repr_wrap .repr_box li a .txt p.tit {font-size:22px; letter-spacing:-0.5pt;}
#repr_wrap .repr_box li a .txt p.sub_txt {font-size:14px;letter-spacing:-0.5pt; line-height:150%; padding: 10px 8px 0px 8px; height: 40px;}

#repr_wrap .repr_box li a .txt .more {font-size:12px;line-height:120%;}

/*============= //repr_wrap =============*/








/*******************************************************************************
	@media 1100px
*******************************************************************************/
@media all and (max-width:1100px){
	


}
	
/*******************************************************************************
	@media 980~1024px
*******************************************************************************/
@media all and (max-width:1024px){


#visual .text_area{ width: 95%; margin:165px auto 0 auto; top:11%; }
#visual .text_area .eng1{line-height:100%;font-size:45px; margin-bottom:10px;}
#visual .text_area .eng1:after{}
#visual .text_area .eng1 span {line-height:100%;font-size:45px;}	
#visual .text_area .krb{font-size:19px; line-height:140%; margin-bottom:12px; letter-spacing:-1px;}

		
/*============= about_wrap =============*/
#about_wrap{width:100%; padding:83px 0 110px 0;}

#about_wrap .about_box ul {padding:45px 0 0 0;}
#about_wrap .about_box li {width: 32%;  margin-right:2%;}

/*============= //about_wrap =============*/	

/*============= vision_wrap =============*/

/* vision */

#vision_wrap .vision_in{width:95%;}

.vision_con .icon_list dl p.sub_bt {line-height: 150%; font-size: 22px; letter-spacing: -0.8pt;margin-top: -5px;}
.vision_con .icon_list dl p.sub_engt{line-height: 140%; font-size: 18px;letter-spacing: -0.5pt;}
.vision_con .icon_list dl p.sub_txt {line-height: 150%; font-size: 14px; letter-spacing: -0.8pt; color: #888; padding-top: 5px;}

/*============= //vision_wrap =============*/	

}


/*******************************************************************************
	@media 768~980px
*******************************************************************************/
@media all and (max-width:980px){


.main_btn1{font-size:13px; width:130px;}
.main_btn2{width:130px; font-size:13px;}

/* 비주얼 */
#visual .sub_imgbox .slick-prev, #visual .sub_imgbox .slick-next{background-size:40px; width:40px; height:40px;}
#visual .sub_imgbox .slick-prev{left:2%}
#visual .sub_imgbox .slick-next{right:2%}
#visual .text_area .vbtn{font-size:14px; width:160px; padding:15px 0; margin:40px auto 0 auto;}

#visual .scroll_down a{font-size:13px;}
#visual .scroll_down .line{height:40px;}

	
#about_wrap .about_box li a .txt p.sub_txt {height: 50px;}


}

/*******************************************************************************
	@media 768px ~ 860px
*******************************************************************************/
@media all and (max-width:860px) { 


h3.main_title{font-size:32px; letter-spacing: 0px;}
	
	
/*============= vision_wrap =============*/

/* vision */

.titkr {font-size: 30px !important; line-height: 135%;}
.vision_con .icon_list dl .icon{width:180px; height:180px; margin:0 auto 20px auto; border-radius: 100%;}
.vision_con .icon_list dl.one .icon{background-size: 65px;}
.vision_con .icon_list dl.two .icon{background-size: 65px;}
.vision_con .icon_list dl.three .icon{background-size: 65px;}

.vision_con .icon_list dl:after {right: -42px; top: 75px; width: 41px; height: 41px;background-size:41px; }
/*============= //vision_wrap =============*/	
	
/*============= repr_wrap =============*/

#repr_wrap .repr_box li {float:left; width: 50%;height: auto;}

	/* img over */
#repr_wrap .repr_box li a .repr_img { width: 100%; height: auto; min-height: 180px;}

/*============= //repr_wrap =============*/
	
}


/*******************************************************************************
	@media 640px~780px
*******************************************************************************/
@media all and (max-width:780px){


.main_line{height:60px}
h3.main_title{font-size:28px}
p.margin_smtxt{font-size:14px; letter-spacing:-0.5px;}

.main_btn1{font-size:12px; padding:15px 0; width:120px;}
.main_btn2{font-size:12px; padding:15px 0; width:120px;}

.titkr {font-size: 26px !important; line-height: 135%;}
#vision_wrap h3{padding-bottom: 28px;}

/* 비주얼 */
#visual .text_area{ width: 95%; margin:160px auto 0 auto; top:11%; }
#visual .text_area .eng1{line-height:100%;font-size:40px; margin-bottom:10px;}
#visual .text_area .eng1:after{}
#visual .text_area .eng1 span {line-height:100%;font-size:40px;}	
#visual .text_area .krb{font-size:18px; line-height:140%; margin-bottom:12px; letter-spacing:-1px;}




}


/*******************************************************************************
	@media 640px~768px
*******************************************************************************/
@media all and (max-width:768px){

.contentArea h3.tit {font-size:26px;}
.contentArea .more {font-size:11px;}
.contentArea a.more {font-size:11px; width:100px; height:38px; line-height:38px;}

/*============= about_wrap =============*/

#about_wrap .about_box li a .txt p.tit {font-size:20px;letter-spacing:-0.5pt;}
#about_wrap .about_box li a .txt p.sub_txt {height: 40px; font-size:13px; letter-spacing:-0.5pt; line-height:150%; padding: 10px 0 15px 0;}


/*============= //about_wrap =============*/	
#repr_wrap .repr_box li a .txt p.tit {font-size:20px; letter-spacing:-0.5pt;}
#repr_wrap .repr_box li a .txt p.sub_txt {font-size:13px;letter-spacing:-0.5pt; line-height:150%; padding: 8px 8px 8px 8px; height: auto;}	

	
/*============= vision_wrap =============*/

/* vision */
#vision_wrap{padding:70px 0 45px 0;}
#vision_wrap h3{text-align:center; padding-bottom: 20px;}
#vision_wrap p{text-align:center;}
#vision_wrap p br {display:none;}
.titkr {font-size: 26px !important; line-height: 135%;}

.vision_con .icon_list dl{float:left; width:47%; text-align:center; margin-right:5.12820512821%; padding-bottom: 30px}
.vision_con .icon_list dl:last-child{margin-right:0;padding-bottom: 0px;}
.vision_con .icon_list dl .icon{width:200px; height:200px; margin:0 auto 20px auto; border-radius: 100%;}

.vision_con .icon_list dl.one {width: 100%;clear: both; margin: 0 auto;}	
.vision_con .icon_list div {width: 100%; margin: 0 auto; text-align: center; clear: both;}

	
.vision_con .icon_list dl.one .icon{background-size: 75px;}
.vision_con .icon_list dl.two .icon{background-size: 75px;}
.vision_con .icon_list dl.three .icon{background-size: 75px;}

.vision_con .icon_list dl:after {right: -42px; top: 75px; width: 41px; height: 41px;background-size:41px; }
.vision_con .icon_list dl:nth-child(1):after{display:none;}
.vision_con .icon_list dl:nth-child(3):after{display:none;}

.vision_con .icon_list dl p.sub_bt {line-height: 150%; font-size: 20px; letter-spacing: -0.8pt;margin-top: -5px;}
.vision_con .icon_list dl p.sub_engt{line-height: 140%; font-size: 16px;letter-spacing: -0.2pt;}
.vision_con .icon_list dl p.sub_txt {line-height: 150%; font-size: 13px; letter-spacing: -0.3pt; color: #888; padding-top: 5px;}
.vision_con .icon_list dl p.sub_txt br {display: none!important;}


/*============= //vision_wrap =============*/	
	

}
/*******************************************************************************
	@media ~640px
*******************************************************************************/
@media all and (max-width:640px){


.main_line{height:30px;}
h3.main_title{font-size:24px}
p.margin_smtxt{font-size:13px; line-height:20px}




/* 비주얼 */
#visual .text_area{ width: 95%; margin:160px auto 0 auto; top:11%; }
#visual .text_area .eng1{font-size:33px; margin-bottom:10px;}
#visual .text_area .eng1:after{}
#visual .text_area .eng1 span {line-height:100%;font-size:33px;}	
#visual .text_area .krb{font-size:16px; line-height:140%; margin-bottom:12px; letter-spacing:-1px;}

#visual .text_area .kr{font-size:13px; line-height:20px; letter-spacing:-0.4px;}
#visual .text_area .vbtn{font-size:13px}
#visual .sub_imgbox .slick-prev, #visual .sub_imgbox .slick-next{background-size:30px; width:30px; height:30px;}


#visual .cover03{background-image:url('../images/main/visual_03.jpg');}

/* Contents */
.contentArea  .tit_box h3.tit {margin-bottom:10px;}
.contentArea  a.more {margin-top:20px}


/*============= about_wrap =============*/
#about_wrap{width:100%; padding:60px 0 80px 0;}
#about_wrap p br {display:block;}

#about_wrap .about_in{width: 95%;}
#about_wrap .about_box ul {padding:45px 0 0 0;}
#about_wrap .about_box li {width: 100%;  margin-right:0%; margin-bottom: 4%;}
#about_wrap .about_box li.three {margin-right:0%; margin-bottom: 0%;}
#about_wrap .about_box li a:hover > .txt p.more{padding:0 0 0 55px;background:#af070d url('../images/main/more_icon.png') 80% 14px no-repeat;}

#about_wrap .about_box li a .txt {width:100%; }
#about_wrap .about_box li a .txt p.tit {font-size:18px;letter-spacing:-0.5pt;}
#about_wrap .about_box li a .txt p.sub_txt {height:auto; font-size:13px; letter-spacing:-0.5pt; line-height:150%; padding: 10px 0 15px 0;}
#about_wrap .about_box li a .txt p.more{margin: 0 auto; max-width:280px; height:36px;}
#about_wrap .about_box li a .txt p.more:hover {}

#about_wrap .about_box li a .txt .more { text-align: left; margin-top: 15px;padding:0 0 0 40px;  margin-left: 0px; background:#af070d url('../images/main/more_icon.png') 90% 14px no-repeat; font-size:12px;line-height:38px;}

/*============= //about_wrap =============*/	
		
/*============= repr_wrap =============*/
#repr_wrap{width:100%; padding:84px 0 80px 0;}
#repr_wrap .repr_in {width: 95%;}
#repr_wrap .repr_box li {float:left; width: 50%;height: auto;}

	/* img over */
#repr_wrap .repr_box li a .repr_img { width: 100%; height: auto; min-height: 160px;}
/* //img over */

#repr_wrap .repr_box li a .txt {width:100%; padding:20px 0 24px 0;}
#repr_wrap .repr_box li a .txt p.tit {font-size:18px; letter-spacing:-0.5pt;}
#repr_wrap .repr_box li a .txt p.sub_txt {font-size:13px;letter-spacing:-0.5pt; line-height:150%; padding: 8px 8px 8px 8px; height: auto;}
#repr_wrap .repr_box li a .txt .more {font-size:12px;line-height:120%;}

/*============= //repr_wrap =============*/	



/*============= vision_wrap =============*/

/* vision */
#vision_wrap{padding:70px 0 45px 0;}
#vision_wrap h3{text-align:center; padding-bottom: 10px;}
#vision_wrap p{text-align:center;}
#vision_wrap p br {display:none;}
.titkr {font-size: 22px !important; line-height: 135%;}

.vision_con .icon_list dl{float:left; width:47%; text-align:center; margin-right:5.12820512821%; padding-bottom: 30px}
.vision_con .icon_list dl:last-child{margin-right:0;padding-bottom: 0px;}
.vision_con .icon_list dl .icon{width:180px; height:180px; margin:0 auto 20px auto; border-radius: 100%;}

.vision_con .icon_list dl.one {width: 100%;clear: both; margin: 0 auto;}	
.vision_con .icon_list div {width: 100%; margin: 0 auto; text-align: center; clear: both;}

	
.vision_con .icon_list dl.one .icon{background-size: 65px;}
.vision_con .icon_list dl.two .icon{background-size: 65px;}
.vision_con .icon_list dl.three .icon{background-size: 65px;}

.vision_con .icon_list dl:after {right: -38px; top: 75px; width: 35px; height: 35px;background-size:35px; }
.vision_con .icon_list dl:nth-child(1):after{display:none;}
.vision_con .icon_list dl:nth-child(3):after{display:none;}

.vision_con .icon_list dl p.sub_bt {line-height: 150%; font-size: 18px; letter-spacing: -0.8pt;margin-top: -5px;}
.vision_con .icon_list dl p.sub_engt{line-height: 140%; font-size: 16px;letter-spacing: -0.2pt;}
.vision_con .icon_list dl p.sub_txt {line-height: 150%; font-size: 13px; letter-spacing: -0.3pt; color: #888; padding-top: 2px;}
.vision_con .icon_list dl p.sub_txt br {display: none!important;}


/*============= //vision_wrap =============*/	



}

/*******************************************************************************
	@media ~569px
*******************************************************************************/
@media all and (max-width:569px){

	

/*============= vision_wrap =============*/

/* vision */

.vision_con .icon_list dl:after {right: -34px; top: 75px; width: 35px; height: 35px;background-size:35px; }
/*============= //vision_wrap =============*/
	
}
/*******************************************************************************
	@media ~480px
*******************************************************************************/
@media all and (max-width:480px){

h3.main_title{font-size:20px;}

.main_btn1{font-size:11px; width:110px;}
.main_btn2{font-size:11px; width:110px;}


/* 비주얼 CENTER
#visual .text_area { 
	width: 100%;
	text-align: center;
	color: #fff;
	position: absolute;
	top: 70%; 
	-moz-transform: translateY(-57%);
	-ms-transform: translateY(-57%);
	-webkit-transform: translateY(-57%);
	transform: translateY(-57%);
	z-index: 1;
}*/
/* 비주얼 */
	
#visual .cover01{background-image:url('../images/main/visual_01_m.jpg');}
#visual .cover02{background-image:url('../images/main/visual_02_m.jpg');}
	
#visual .text_area{ width: 90%; margin:160px auto 0 auto; top:11%; }
#visual .text_area .eng1{font-size:28px; margin-bottom:10px;}
#visual .text_area .eng1:after{}
#visual .text_area .eng1 span{font-size:28px; margin-bottom:10px;}	
#visual .text_area .krb{font-size:15px; line-height:140%; margin-bottom:12px; letter-spacing:-0.5px;}

#visual .text_area .kr{font-size:12px; line-height:18px; letter-spacing:-0.4px;}
#visual .text_area .vbtn{font-size:12px; width:140px;margin: 20px auto 0px auto;}


#visual .sub_imgbox .slick-prev, #visual .sub_imgbox .slick-next{display:none !important;}


/*============= repr_wrap =============*/
#repr_wrap{width:100%; padding:74px 0 70px 0;}
#repr_wrap .repr_in {width: 85%;}
#repr_wrap .repr_box li {float:left; width: 100%;height: auto;}

	/* img over */
#repr_wrap .repr_box li a .repr_img { width: 100%; height: auto; min-height: 200px;}
/* //img over */

#repr_wrap .repr_box li a .txt {width:100%; padding:20px 0 20px 0;}
#repr_wrap .repr_box li a .txt p.tit {font-size:18px; letter-spacing:-0.5pt;}
#repr_wrap .repr_box li a .txt p.sub_txt {font-size:13px;letter-spacing:-0.5pt; line-height:150%; padding: 5px 8px 5px 8px; height: auto;}
#repr_wrap .repr_box li a .txt .more {font-size:12px;line-height:120%;}

/*============= //repr_wrap =============*/		
	
/*============= vision_wrap =============*/

/* vision */
#vision_wrap{padding:70px 0 75px 0;}
#vision_wrap h3{text-align:center; padding-bottom: 10px;}

.titkr {font-size: 20px !important; line-height: 135%;}

.vision_con .icon_list dl{float:left; width:100%; text-align:center; margin-right:0%; padding-bottom: 35px}
.vision_con .icon_list dl:last-child{margin-right:0;padding-bottom: 0px;}


/*============= //vision_wrap =============*/	



}

/*******************************************************************************
	@media ~380px
*******************************************************************************/
@media all and (max-width:380px){


/* 비주얼 */
#visual .text_area{ width: 90%; margin:160px auto 0 auto; top:11%; }
#visual .text_area .eng1{font-size:26px; margin-bottom:10px;}
#visual .text_area .eng1:after{width:25px;}
#visual .text_area .eng1 span{font-size:26px; margin-bottom:10px;}
#visual .text_area .krb{font-size:15px; line-height:140%; margin-bottom:12px; letter-spacing:-0.5px;}


#visual .text_area .kr{font-size:12px; line-height:18px; letter-spacing:-0.4px;}
#visual .text_area .vbtn{font-size:12px; width:140px;margin: 20px auto 0px auto;}

	
/*============= repr_wrap =============*/
#repr_wrap .repr_box li a .repr_img { width: 100%; height: auto; min-height: 180px;}

/*============= //repr_wrap =============*/	
	
	


}




/*******************************************************************************
	@media ~320px
*******************************************************************************/
@media all and (max-width:320px){



}