/* ===== MAIN - VISUAL ===== */


.main-visual {position:relative;margin:0 auto;height:100vh;}
.main-visual .visual-slider {overflow:hidden;position:absolute;left:50%;top:50%;width:100%;height:100%;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-o-transform:translate(-50%, -50%);transform:translate(-50%, -50%);  }
.main-visual .visual-slider .swiper-slide {overflow:hidden;position:relative;height:100%;}
.main-visual .visual-slider .swiper-slide .vs-bg {position:absolute;left:0;top:0;width:100%;height:100%;background-repeat:no-repeat;background-position:center center;background-size:cover;-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-ms-transform:scale(1.1);-o-transform:scale(1.1);transform:scale(1.1);   transition-duration:3s;}
.main-visual .visual-slider .swiper-slide .vs-bg1{ background:url("../img/main/main_banner03.jpg") no-repeat 50% 50%; background-size:cover;}
.main-visual .visual-slider .swiper-slide .vs-bg2{ background:url("../img/main/main_banner02.jpg") no-repeat 50% 50%; background-size:cover;}
.main-visual .visual-slider .swiper-slide .vs-bg3{ background:url(../img/main/Visual03.jpg) no-repeat 50% 50%; background-size:cover;}
.main-visual .visual-slider .swiper-slide .vs-bg4{ background:url(../img/main/Visual04.jpg) no-repeat 50% 50%; background-size:cover;}

.main-visual .visual-slider .swiper-slide .vs-txt {display:flex;flex-direction:column;justify-content:center;position:relative;margin:0 auto;max-width:150em;width:70%;height:100%;z-index:1;}
.main-visual .visual-slider .swiper-slide .vs-txt h2 {opacity:0;font-size:60px;color:#ffffff;font-weight:700;-webkit-transform:translateY(40px);-moz-transform:translateY(40px);-ms-transform:translateY(40px);-o-transform:translateY(40px);transform:translateY(40px);}
.main-visual .visual-slider .swiper-slide .vs-txt p {opacity:0;font-size:30px;font-weight: 300;color:#ffffff;letter-spacing:-0.028em;line-height:1.556em;-webkit-transform:translateY(40px);-moz-transform:translateY(40px);-ms-transform:translateY(40px);-o-transform:translateY(40px);transform:translateY(40px);   font-weight:500;}
.main-visual .visual-slider .swiper-button-prev {left:auto;right:8.5%;top:50%;z-index:10;margin-top:-170px}
.main-visual .visual-slider .swiper-button-prev:after {display:none;}
.main-visual .visual-slider .swiper-button-next {right:8.5%;top:50%;margin-top:-30px;}
.main-visual .visual-slider .swiper-button-next:after {display:none;}
.main-visual .visual-slider .swiper-button-prev, .main-visual .visual-slider .swiper-button-next{ position:absolute;background:none;width:100px;height:100px;border-radius:50%;border:1px solid #fff;z-index:10; text-align:center;}
.main-visual .visual-slider .swiper-button-prev i, .main-visual .visual-slider .swiper-button-next i{ line-height:100px; display:inline-block; color:#fff; font-size:30px;}
.main-visual .visual-slider .swiper-pagination {position:absolute;right:8.5%;top:50%;left:auto;bottom:auto;z-index:10;margin-top:7.083em;width:5.833em;font-size:1.2rem;color:#ffffff;letter-spacing:0.333em;font-style:italic;}
.main-visual .visual-slider .swiper-pagination span {font-style:normal;}
.main-visual .visual-slider .swiper-slide.swiper-slide-active .vs-bg {-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transition:transform 1.4s;-moz-transition:transform 1.4s;-ms-transition:transform 1.4s;-o-transition:transform 1.4s;transition:transform 1.4s;}
.main-visual .visual-slider .swiper-slide.swiper-slide-active .vs-txt h2 {opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);-ms-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0);-webkit-transition:opacity 1s, transform 1.4s;-moz-transition:opacity 1s, transform 1.4s;-ms-transition:opacity 1s, transform 1.4s;-o-transition:opacity 1s, transform 1.4s;transition:opacity 1s, transform 1.4s;}
.main-visual .visual-slider .swiper-slide.swiper-slide-active .vs-txt p {opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);-ms-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0);-webkit-transition:opacity 1s, transform 1.4s;-moz-transition:opacity 1s, transform 1.4s;-ms-transition:opacity 1s, transform 1.4s;-o-transition:opacity 1s, transform 1.4s;transition:opacity 1s, transform 1.4s;-webkit-transition-delay:0.1s;-moz-transition-delay:0.1s;-ms-transition-delay:0.1s;-o-transition-delay:0.1s;transition-delay:0.1s;}
.hide {position: absolute;left: -9999%;font-size: 0;line-height: 0;text-indent: -9999px;}




.mainContents h1{ font-size:25px; font-weight:500;}
.vs-img {position: relative; width:100%;}

.swiper-slide .vs-txt {
    position: absolute;
    top: 50%;
    left: 30%;
    transform: translate( -50%, -50% );
    color: white;
  }

.vs-txt h2 { font-size: 60px; font-weight: 800;}
.vs-txt p {font-size:25px; font-weight: 300; padding-top:30px;}





.slick-dots li {
	position: absolute;

}

.slick-dots li button {
	width: 58px;
    height: 6px;
    margin-right: 1px;
    border-radius: 0;
    background-color: #fff;
    opacity: 0.4;
    transform: skew(-35deg);
	text-indent: -9999em; 
	cursor: pointer;
	border: 2px solid #fff;
	box-shadow: 0 0 0 0 transparent; 
	vertical-align: middle;
	color: #fff; 
	background-color: #fff; 
	transition: all .3s ease; 
	opacity: .4;
}

.slick-dots li button:focus {outline: none;}

.slick-dots li button:hover {opacity: 1;}

.slick-dots li.slick-active button {opacity: 1;}




.mainContents h1{ font-size:25px; font-weight:500;}
#sec_01{ display:flex;}
/* 팝업존 */
.facilities{position:relative; width:100%;  float:right;}
.facilities h3{ font-size:20px; line-height:20px; font-family:'NotoM'; color:#222;}
.facilities .facilities_list{display:block; margin:25px 0 0;}
.facilities .facilities_list p{ position:relative;display:table; float:left;  margin:0 15px;}
.facilities .facilities_list p span{ position:absolute; bottom:25px; left:30px; color:#fff; text-align:left; line-height:35px;}
.facilities .facilities_list p span b{ display:block; font-size:30px;}
.facilities .facilities_list p:before{ content:'';position:absolute; bottom:0; left:0; width:100%; height:100%; background:url(../img/main/sec-0107.png) repeat-x 50% 100%;}
.facilities .facilities_list a{display:table-cell; vertical-align: middle; width:100%; text-align:center; background:#f0f0f0; overflow:hidden;}
.facilities .facilities_list a img{width:auto; height:auto; max-width:100%; max-height:100%;}
.facilities .facilities_list .slick-arrow{position:absolute; top:200px; text-align:center; overflow:hidden; cursor:pointer; background:none;  z-index:1; font-size:0;}
.facilities .facilities_list .slick-next:before, .facilities .facilities_list .slick-prev:before{background:#c2c2c2; border-radius:50%; display:block;  width:50px; height:50px; line-height:50px;font-family:xeicon; font-size:30px; color:#fff; }
.facilities .facilities_list .slick-next{right:-90px; }
.facilities .facilities_list .slick-next:before{ content:"\e93e"; }
.facilities .facilities_list .slick-prev{ left:-90px;}
.facilities .facilities_list .slick-prev:before{content:"\e93b"; }
.facilities .control a{position:absolute; right:30px; top:2px; width:20px; height:20px; display:block; text-indent:-9999%; overflow:hidden;}



/* 슬라이드 공용 */
.slick-slider{transition:all ease-in-out .3s; 	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; }
.slick-slide{ display:none; height:100%; min-height:1px; vertical-align:middle; }
.slick-list{ overflow:hidden; }
.slick-list.dragging{ cursor:pointer; }
.slick-initialized .slick-slide{ display:inline-block; }
.slick-arrow.slick-hidden { display:none; }
.slick-current { opacity:1; display:block; }


#sec_02{ background:#efefef; padding:50px 0; text-align:center;}
#sec_02 ul{ display:flex; padding:0 9%;}
#sec_02 li{ float:left; position:relative; width:calc(100% / 4);}
#sec_02 li span{ padding-left:30px; line-height:100px;vertical-align:top; font-size:25px;}
#sec_02 li a{ display:inline-block; padding:0 30px 0 10px; height:100%;-webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s;}
#sec_02 li a:before{content:''; display:inline-block; width:100px; height:100px; border-radius:50%; }
#sec_02 li:nth-child(1) a:before{ background:#fff url(../img/main/sec-0201.png) no-repeat 50% 50%; background-size:auto 55%;}
#sec_02 li:nth-child(2) a:before{ background:#fff url(../img/main/sec-0202.png) no-repeat 50% 50%; background-size:auto 55%;}
#sec_02 li:nth-child(3) a:before{ background:#fff url(../img/main/sec-0203.png) no-repeat 50% 50%; background-size:auto 55%;}
#sec_02 li:nth-child(4) a:before{ background:#fff url(../img/main/sec-0204.png) no-repeat 50% 50%; background-size:auto 55%;}
#sec_02 li:last-child{ margin-right:0;}
#sec_02 li a:hover{ background:#fff; border-radius:100px;}

#sec_03{ display:flex;}
#sec_03 .area{ float:left; }
#sec_03 .s01{ width:30%; margin-right:100px;}
#sec_03 .s02{ width:calc((100% - 60%) - 200px);}


.main_pro {position:relative; width:100%; float:left;}
.main_pro button{cursor:pointer;}
.main_pro .pro{position:relative; height:100%; z-index:0; text-align:center;} 
.main_pro .pro div{height:100%;}
.main_pro .pro p{display:table; height:100%; float:left;}
.main_pro .pro p a{display:table-cell; vertical-align: middle; padding:0; margin:0;}
.main_pro .pro img{width:auto; height:auto; max-width:100%; max-height:100%; transition:all .3s ease; -ms-transition:all .3s ease; -webkit-transition:all .3s ease; }
.main_pro .pro .slick-counter{position: absolute; right:0; top:-50px; width:50px; height:30px; line-height:30px;  color:#333;font-size:17px; text-align:right;}
.main_pro .pro .slick-arrow{position:absolute; right:0; top:-50px;overflow:hidden; z-index:1; font-size:0; background:none;}
.main_pro .pro .slick-prev{right:118px;}
.main_pro .pro .slick-next{right:40px; }
.main_pro .pro .slick-prev:before, .main_pro .pro .slick-next:before{  font-family:xeicon;; font-size:30px; color:#000;}
.main_pro .pro .slick-prev:before{content:"\e93c";}
.main_pro .pro .slick-next:before{content:"\e93f"}
.main_pro .control{position:absolute; right:85px; top:0px; z-index:1;}
.main_pro .control a{display:block; font-size:0; overflow:hidden;}
.main_pro .control a i{ font-size:30px; color:#000;}
.main_pro .control a.btn_stop{}
.main_pro .control a.btn_play{display:none;}



.section01 {
		background: url("../img/main/background01.jpg") no-repeat center center /cover;
		background-size: cover;
		 }

.section02 {
		background: url("../img/main/background02.jpg") no-repeat center center /cover;
		display:flex;
		background-size: cover;
		 }
.section03 {
}

.section04 {
		background: url("../img/main/background04.jpg") no-repeat center center /cover;
		
		 }


.section02 .inner{width:1400px; display:flex;margin: 0 auto;}
.section02 .area { padding-right:5%;}
/*.section02 .list {padding-left:5%;}*/


.section04 .area b{color:#ffe82a; font-size:35px; line-height: 60px; font-weight:600;}


/*section01*/



.section01 li {
	transition:all 0.5s;
}

.section01 li:hover {
	/*background-color: rgba(21,29,130,0.50);*/
}


.title02 {
	text-align: center;
	font-weight:800;
	font-size:55px;
	color:#000;
	padding-top: 100px;


}

.sub_title02 {
	text-align: center;
	font-weight:300;
	font-size: 20px;
	color:#000;
	padding-top:10px;
}

.title03 {
	text-align: left;
	font-weight:800;
	font-size:50px;
	color:#fff;
	line-height: 70px;


}

.sub_title03 {
	text-align: left;
	font-weight:300;
	font-size: 19px;
	color:#fff;
	padding-top:30px;
	line-height: 30px;

}

.title04 {
	text-align: left;
	font-weight:800;
	font-size:55px;
	color:#fff;
	line-height: 70px;


}

.sub_title04 {
	text-align: left;
	font-weight:300;
	font-size: 23px;
	color:#fff;
	padding-top:30px;
	line-height: 30px;

}

.sub_title04_1 {
	text-align: left;
	font-weight:300;
	font-size: 23px;
	color:#fff;
	padding-top:0;
	line-height: 30px;

}

.product_wrap{
	text-align: center;
	padding-top:30px;
}

.product_item {
	position:relative;
	list-style: none;
	display:inline-block;
	padding: 0 15px;
	
}

.product_list {
	padding-bottom: 100px;;
}

.detail_icon {
	padding-top:40%;
	line-height: 40px;
}

.snap {
	position: absolute;
	background: rgba(54,91,156,0.86);
    color: #f1f1f1;
    left: 14px;
    top: 0;
    width: 94%;
	height:100%;
	opacity: 0;
	transition:all 0.5s;
	

}

.snap:hover {
	opacity: 1;
}



.product_text {
	color:#fff;
	font-size:25px;
	text-align: center;
	position: absolute;
	top:94%;
	left: 50%;
	transform: translate( -50%, -50% );
}

/*section01끝*/


/*section02*/

.section02 .inner {
	padding: 120px 0;
}

.list {
	text-align: left;
	width:45%;
	}

.list ul{
	display: flex;
	padding:10px 0;
	}

.list .name {
	display: inline-block;
	padding-bottom: 5px;
	font-size: 27px; color:#fff;
	}

.list .text {
	font-size: 15px;
	font-weight:300;
	color: #fff; 
	line-height:150%;
	padding:30px 0;
	color:#fff;
	}

.list .view {
	display: inline-block;
	font-size: 15px; 
	color:#fff;
	font-weight: 100;
	}


.list li {
	padding: 40px 30px;
	display: inline-block;
	position: relative;
	width: calc((100% / 2) - 5px);
	background-color:rgba(17,17,17,0.50);
	margin-right:25px;
	transition: all 0.5s;
	}

.list li:hover {
	background-color: rgba(21,29,130,0.50);
	}

.list {
	padding-top: 0;
	text-align: left;
	}

.list li:last-child {
	margin-right:0;
	}

/*section02 끝*/

/*section03*/

.list-wrap {
    display: flex;
	flex-wrap: wrap;
}

.main_section ul li {
    display: table;
    width: calc(100% / 3);
    overflow: hidden;
    color: #fff;
    text-align: center;
}

.main_section ul li:nth-child(1) {
    background-image: url("../img/main/background03_3_1.jpg");	
	background-size:cover;
}

.main_section ul li:nth-of-type(2) {
    background-image: url("#");
}

.main_section ul li:nth-of-type(3) {
    background-image: url("../img/main/background03_4_1.jpg");
	background-size: cover;
}

.main_section ul li .area {
    padding: 120px 50px 200px 50px;
}


.btn-lg .text {
	color:#fff;
}

.list-wrap .list {
	text-align: left;
}

.title {
	font-size: 40px;
	font-weight: 800;
	padding: 20px 0 20px 0;
}

.desc {
	font-size: 17px;
	font-weight: 300;
	padding-bottom: 50px;
}

.mid_title {
	text-align: center;
	color:#000;
	font-size: 60px;
	font-weight: 800;
	padding-bottom:50px;
}

.mid_desc {
	text-align: center;
	color:#000;
	font-size: 20px;
	font-weight: 400;
	padding-bottom: 50px;
}

.mid_desc b {
	text-align: center;
	color:#242BAC;
	font-size: 30px;
	font-weight: 800;
	padding-bottom: 50px;
}



.list-wrap .list .text {
	border: 1px solid;
	border-color: rgba(255,255,255,.2);
	border-radius: 10px;
	padding:10px 30px;	
	transition: all 0.3s;
}

.list-wrap .list .text:hover {
	background-color: rgba(150,150,150,0.50);
}




/*
.list-wrap .list .title {
	color :#fff;
	font-size:45px;
	font-weight:800;
	padding:30px 50px;
	margin-top:50px;
}

.list-wrap .list .desc {
	color :#fff;
	font-size:22px;
	font-weight:200;
	padding:40px 50px;
}

.list-wrap .list .mid_title {
	color :#000;
	font-size:60px;
	font-weight:800;
	padding:30px 50px;
	margin-top:50px;
	text-align: center;
}

.list-wrap .list .mid_desc {
	color :#000;
	font-size:33px;
	font-weight:400;
	padding:30px 50px;
	line-height: 55px;
	text-align: center;
}

.mid_desc b{
	font-size:40px;
	color:#003fc1;
	font-weight:800;
	line-height:35px;
}


.list-wrap .list a {
	padding:30px 50px;
	
}
*/



/*section03 끝 */

/*section04 */
.section04 .inner {
		margin:auto;
		width:1400px;
		padding: 100px 0;
		}

.esg_wrap {
	padding:100px 0 0 0;
	width:1400px;
	margin:auto;
	}

.esg_list {
	display:flex;
	flex-wrap:wrap;
	}

.esg_item {
	width:33.3%;
	padding:40px 0;
	background-color:rgba(0,0,0,.2);
	}

.esg_inner {
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	position:relative;
    transform: perspective(1px) translateZ(0);
    transition-duration: 0.3s;
    transition-property: transform;
	height:230px;
	
	
	}
.esg_inner::after {
	top:50%;
	right:-1px;
	transform:translate(40%, -50%);
	}

.esg_inner:hover, .esg_inner:focus, .esg_inner:active {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.esg_inner {
	text-align: center;
	border-right:1px solid rgba(255,255,255,.1);
}
.double_bar::after {
    content: "";
    position: absolute;
    width: 5px;
    height: 20px;
	border-radius: 5px;
    background: linear-gradient(#db9133 25%, transparent 25% 75%, #007dc6 75% 25%);
	}	



.esg_inner01 {
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	position:relative;
    transform: perspective(1px) translateZ(0);
    transition-duration: 0.3s;
    transition-property: transform;
	height:230px;
	
	
	}
.esg_inner01::after {
	top:50%;
	right:-1px;
	transform:translate(40%, -50%);
	}

.esg_inner01:hover, .esg_inner:focus, .esg_inner:active {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.esg_inner01 {
	text-align: center;
}


.esg_icon {
	display:flex;
	justify-content:center;
	align-items:center;
	height:45px;
	display:inline-block;
	}

.esg_title {
	margin-top:40px;
	font-size:30px;
	font-weight:600;
	color:#fff;
	line-height:1;
	}

.esg_category {
	margin-top:10px;
	font-size:20px;
	color:rgba(255,255,255,.6);
	font-weight: 200;
	}


.button {
	margin-top:30px;
    padding: 15px;
	opacity: 0;
	visibility: hidden;
    cursor: pointer;
    border: 1px solid #fff;
    color: #fff;
	margin: 25px 0 -75px;
	transition: visibility .3s, opacity .3s, margin-bottom .3s, color .3s, background-color .3s;
}
.button:hover {
	
}






@media all and ( max-width: 1920px ){
	
	
	
	
	
}
@media all and ( max-width: 1680px ){
	
	
	
}

@media all and ( max-width: 1440px ){
	
.section01{
	height: auto;
	padding-bottom:50px; 
	}
	
	.snap {
		display: none;
	}
.title02 {
    font-size: 35px;
	padding-top:50px;

}
.sub_title02 {

    font-size: 13px;
}
	.product_list{
		display: flex;
	}
	
	.product_item img{
		width:100%;
		margin:auto;
	}
	
	.product_text {
		font-size:20px;

	}
	
/*section04*/

.title04{
		font-size: 30px;
	padding-top:30px;
	}
.sub_title04{
		font-size:20px;
	}
.sub_title04_1{
		font-size: 20px;
		line-height: 10px;
	}
.section04 .area {
	padding:0 60px;
	}
	
	.section04 .inner {
		width:100%;
	}
.section04 .area b {
		font-size: 25px;
	}
	
.esg_wrap {
		width:90%;
	}
	
.esg_wrap {
    padding :30px 0;
}
	
.esg_item:not(:last-child)::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 80%;
    height: 1px;
    background-color: rgba(255,255,255,.1);
    transform: translateX(-50%);
}
	


	

	
.esg_title {
		font-size: 20px;
	}
.esg_category {
		font-size: 15px;
	}


/*section04끝*/
	
}


@media all and ( max-width: 1280px ){
	.main-visual .visual-slider .swiper-slide.swiper-slide-active .vs-txt h2 {
		font-size:50px;
	}
	
.main-visual .visual-slider .swiper-slide.swiper-slide-active .vs-txt p {
		font-size:35px;
	}
	
	.list {padding-top:0;}

	/*	main_section*/
.main_section .list {
    width: 100%;
	text-align: center;
}
.main_section ul li .area {
    padding: 50px 50px 50px 50px;
}

.mid_title {
		font-size: 40px;
}
	
/*	main_section끝 */
	
}







@media all and ( max-width: 1080px ){
.main-visual-btn {
    position: absolute;
    bottom: 30px;
    left: 0;
    width: 100%;
    text-align: center;
}

	
.main-visual .visual-slider .swiper-button-prev, .main-visual .visual-slider .swiper-button-next {
    position: relative;
    right: auto;
    display: inline-block;
    margin: 0 5px;
    width: 37px;
    height: 37px;
    border: none;
    background: rgba(177,177,177,0.5);
}
.main-visual .visual-slider .swiper-button-prev i, .main-visual .visual-slider .swiper-button-next i {
    line-height: 37px;
    font-size: 20px;
}
/*	section02*/
	.section02 .inner	{
		display: block;
	}	
	
.section02 {
		height: auto;
	}
.title03 {
	width:100%;
	text-align: center;
    font-weight: 800;
    font-size: 40px;
    color: #fff;
    padding-top: 5%;
    line-height: 40px;
}
.sub_title03 {
    text-align: center;
    font-weight: 300;
    font-size: 17px;
    color: #fff;
    padding-top: 30px;
    line-height: 20px;
}
.section02 .list {padding-top: 40px;}
.list .name {
	font-size: 18px;
    display: inline-block;
    padding-bottom: 5px;
    color: #fff;
}
	.section02 .inner {padding:60px 0;}
.list .text {
    font-size: 15px;
    font-weight: 300;
    color: #fff;
    line-height: 150%;
    color: #fff;
}
	
.list {
	width:100%;

}
.list ul {
		width:90%;
		padding-bottom: 50px;
		margin: auto;
	}
	
.list li {    
	text-align: left;
    padding: 20px 15px;
}
/*	section02끝*/
	
}
@media all and ( max-width: 940px ){
	.product_text {font-size:16px;}
	
}

@media all and ( max-width: 800px ){
	.esg_item {
    position: relative;
    width: 100%;
    padding: 30px;}
		
	.esg_inner::after {
    top: 100%;
    right: 50%;
    width: 12px;
    height: 3px;
    background: linear-gradient(to right, #db9133 25%, transparent 25% 75%, #007dc6 75% 25%);
    transform: translate(50%, 28px);

}
	.esg_inner {
    border-right :none;
	height:150px;
}
	
.esg_inner01 {
	height:150px;
}
	
	.ft_info .area01 {padding:0;}
	.ft_info .area02 { padding-top:0;}
	
}

@media all and ( max-width: 640px ){
	
	/*메인비주얼*/
.main-visual {
    height: 450px;
}
	
.main-visual-btn {
    position: absolute;
    bottom: 30px;
    left: 0;
    width: 100%;
    text-align: center;
}
	
.main-visual .visual-slider .swiper-button-prev, .main-visual .visual-slider .swiper-button-next {
    position: relative;
    right: auto;
    display: inline-block;
    margin: 0 5px;
    width: 37px;
    height: 37px;
    border: none;
    background: rgba(177,177,177,0.5);
}
.main-visual .visual-slider .swiper-button-prev i, .main-visual .visual-slider .swiper-button-next i {
    line-height: 37px;
    font-size: 20px;
}
	
.main-visual .visual-slider .swiper-slide.swiper-slide-active .vs-txt h2 {
		font-size:30px;
	}
	
.main-visual .visual-slider .swiper-slide.swiper-slide-active .vs-txt p {
		font-size:15px;
	}
	
	/*메인비주얼*/
	
	/*section01*/
	
.section01{
	height: auto;
	padding-bottom:20%; 
	}
	
	.snap {
		display: none;
	}
.title02 {
    font-size: 35px;
	padding-top:50px;

}
.sub_title02 {

    font-size: 13px;
}
	.product_list{
		display: flex;
	}
	
	.product_item img{
		width:100%;
		margin:auto;
	}
	
	.product_text {
		font-size:10px;

	}
	

	
/*	section01 끝 */
	
/*section02*/
	.section02 .inner	{
		display: block;
	}	
	
.section02 {
		height: auto;
	}
.title03 {
	width:100%;
	text-align: center;
    font-weight: 800;
    font-size: 30px;
    color: #fff;
    padding-top: 40px;;
    line-height: 40px;
}
.sub_title03 {
    text-align: center;
    font-weight: 300;
    font-size: 13px;
    color: #fff;
    padding-top: 30px;
    line-height: 20px;
}
.section02 .list .name {
	font-size: 18px;

}
.section02 .list .text {
    font-size: 13px;

}
	
.section02 .list {
    padding-top: 50px;
	width:100%;

}
.section02 .list ul {
		width:90%;
		padding-bottom: 40px;
	}
	
.section02 .list li {    
	text-align: left;
    padding: 20px 15px;
}
/*	section02 끝*/
/*	main_section*/
.main_section .list {
    width: 100%;
	text-align: center;
}
.main_section ul li .area {
    padding: 50px 50px 50px 50px;
}

.mid_title {
		font-size: 40px;
}
	
/*	main_section끝 */
	
/* section04 */	
.esg_item {
    position: relative;
    width: 100%;
    padding: 30px;
}
	
.title04{
		font-size: 30px;
	}
.sub_title04{
		font-size:20px;
	}
.sub_title04_1{
		font-size: 20px;
		line-height: 10px;
	}
.section04 .area {
	padding:0 30px;
	}
	
	.section04 .inner {
		width:100%;
	}
.section04 .area b {
		font-size: 25px;
	}
	
.esg_wrap {
		width:90%;
	}
	
.esg_wrap {
    padding :40px 0;
}
	
.esg_item:not(:last-child)::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 80%;
    height: 1px;
    background-color: rgba(255,255,255,.1);
    transform: translateX(-50%);
}
	
.esg_inner::after {
    top: 100%;
    right: 50%;
    width: 12px;
    height: 3px;
    background: linear-gradient(to right, #db9133 25%, transparent 25% 75%, #007dc6 75% 25%);
    transform: translate(50%, 28px);
}

	
.esg_inner {
    border-right :none;
	height:150px;
}
	
.esg_inner01 {
	height:150px;
}
	
.esg_title {
		font-size: 20px;
	}
.esg_category {
		font-size: 15px;
	}


@media all and ( max-width: 480px ){
	
	.title {padding-bottom: 20px;}
	.title04 {padding-top:30px;}
	
	.ft_info span{font-size: 16px;}
	.ft_info b {font-size: 13px;}
	
}

@media all and ( max-width: 400px ){
}