@charset "utf-8";

/* ==========================================================================
	공통
========================================================================== */
/* main_tit */
.main_tit{margin-bottom:60px; text-align:center;}
.main_tit h4{font-size:16px; color:#222222; letter-spacing:-0.025em; font-weight:300; line-height:1.4; margin:0; margin-bottom:15px;}
.main_tit h3{font-size:48px; color:#231815; letter-spacing:0em; font-weight:500; line-height:1; margin:0;}
.main_tit i{display:inline-block; width:1px; height:40px; background:#888888; margin-top:30px;}



/* ==========================================================================
	main
========================================================================== */
.main_visual{position:relative; max-width:1920px; margin:0 auto;}
.main_visual .swiper-slide{position:relative; overflow:hidden;}
.main_visual .swiper-slide > img{position:relative; top:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -o-transform:translateX(-50%); -ms-transform:translateX(-50%); -moz-transform:translateX(-50%);}
.main_visual .swiper-slide video{position:relative; top:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -o-transform:translateX(-50%); -ms-transform:translateX(-50%); -moz-transform:translateX(-50%);}
.main_visual .text{position:absolute; top:42%; left:50%; width:90%; max-width:1400px; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -o-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); z-index:1;}
.main_visual .text h6{font-size:24px; color:#392d2a; letter-spacing:-0.025em; font-weight:500; line-height:1.2; margin:0; margin-bottom:30px; word-break:keep-all;}
.main_visual .text h2{position:relative; font-size:72px; color:#111111; letter-spacing:0.025em; font-weight:600; line-height:1; margin:0; padding-top:20px; padding-left:40px;}
.main_visual .text h2:before{content:''; position:absolute; top:0; left:0; display:block; width:1px; height:60px; background:#888888;}
.main_visual .text h2 span{color:#accd4a;}
.main_visual .swiper-container-horizontal>.swiper-pagination-bullets{bottom:auto; top:55%; left:50%; width:90%; max-width:1400px; text-align:left; padding-left:40px; box-sizing:border-box; transform:translateX(-50%); -webkit-transform:translateX(-50%); -o-transform:translateX(-50%); -ms-transform:translateX(-50%); -moz-transform:translateX(-50%); }
.main_visual .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 12px;}
.main_visual .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active{margin:0 10px;}
.main_visual .swiper-pagination-bullet{vertical-align:middle; width:8px; height:8px; background:#392d2a; border:2px solid #392d2a; box-sizing:border-box; opacity:1; transition:0.3s; -webkit-transition:0.3s; -o-transition:0.3s; -ms-transition:0.3s; -moz-transition:0.3s;}
.main_visual .swiper-pagination-bullet:focus{outline:none;}
.main_visual .swiper-pagination-bullet-active{width:12px; height:12px; margin:0 12px; background:transparent;}

.main_visual .scroll_box{position:absolute; bottom:80px; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -o-transform:translateX(-50%); -ms-transform:translateX(-50%); -moz-transform:translateX(-50%); z-index:1;}
.main_visual .scroll_box p{position:relative; font-size:14px; color:#392d2a; letter-spacing:0.025em; font-weight:500; margin-bottom:6px; animation:scroll 2s ease-in-out 0s infinite forwards;}
.main_visual .scroll_box .scroll{position:relative; width:24px; height:34px; margin:0 auto; border:2px solid #392d2a; border-radius:30px; box-sizing:border-box; animation:scroll 2s ease-in-out 0s infinite forwards;}
.main_visual .scroll_box .scroll i{position:absolute; width:2px; height:6px; background:#392d2a; left:50%; top:10px; transform:translateX(-50%); -webkit-transform:translateX(-50%); -o-transform:translateX(-50%); -ms-transform:translateX(-50%); -moz-transform:translateX(-50%); animation:scroll_dot 1s ease-in-out 0s infinite forwards;}

/* scroll_box animation */
@keyframes scroll{
	0% {bottom:-10px;}
	50% {bottom:5px;}
	100% {bottom:-10px;}
}
@keyframes scroll_dot{
	0% {top:13px;}
	50% {top:5px;}
	100% {top:13px;}
}

@media all and (max-width:1000px){
	.main_visual .text{text-align:center;}
	.main_visual .text h2{padding:0;}
	.main_visual .text h2:before{display:none;}
	.main_visual .swiper-container-horizontal>.swiper-pagination-bullets{top:auto; bottom:120px; text-align:center; padding-left:0;}
	.main_visual .scroll_box{bottom:40px;}
}


.main_con01{font-size:0; letter-spacing:-4px; padding:100px 0;}
.main_con01 h6{font-size:28px; color:#222222; letter-spacing:0em; font-weight:400; line-height:1.2; margin:0;}
.main_con01 p{font-size:18px; color:#666666; letter-spacing:-0.025em; font-weight:300; line-height:1.6; margin-top:10px; word-break:keep-all;}
.main_con01 a{position:absolute; bottom:0; right:0; display:block; width:60px; padding:29px 0; border-top-left-radius:30px; background:#fff; text-align:center; z-index:1;}
.main_con01 a i{position:relative; display:inline-block; width:16px; height:2px; background:#666666;}
.main_con01 a i:before{content:''; position:absolute; top:50%; left:50%; width:2px; height:16px; background:#666666; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -o-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%);}
.main_con01 .left_box{position:relative; display:inline-block; vertical-align:top; width:calc(50% - 5px); min-height:426px; margin-right:10px; padding:60px; padding-bottom:0; background:url('/img/main_con01_img01.jpg') no-repeat center center / cover; box-sizing:border-box;}
.main_con01 .right_box{display:inline-block; vertical-align:top; width:calc(50% - 5px); }
.main_con01 .right_box ul li{position:relative; min-height:208px; padding:60px; padding-bottom:0; background:url('/img/main_con01_img02.jpg') no-repeat center center / cover; box-sizing:border-box;}
.main_con01 .right_box ul li:nth-of-type(2){background-image:url('/img/main_con01_img03.jpg');}
.main_con01 .right_box ul li + li{margin-top:10px;}

@media all and (max-width:1000px){
	.main_con01{padding:80px 0;}
	.main_con01 .left_box{width:100%; margin-right:0; margin-bottom:10px;}
	.main_con01 .right_box{width:100%;}
}

.main_con02{position:relative; padding-bottom:100px; background:#fff; overflow:hidden;}
.main_con02 .swiper-slide{cursor:pointer;}
.main_con02 .swiper-slide *{transition:all 0.3s; -webkit-transition:all 0.3s; -o-transition:all 0.3s; -ms-transition:all 0.3s; -moz-transition:all 0.3s;}
.main_con02 .img_box{position:relative; padding-bottom:74%; overflow:hidden;}
.main_con02 .img_box img{position:absolute; top:50%; left:50%; width:100%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -o-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%);}
.main_con02 .hover_box{position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.7); z-index:1; opacity:0;}
.main_con02 .hover_box .text{position:absolute; bottom:60px; left:30px; opacity:0;}
.main_con02 .hover_box .text h6{font-size:20px; color:#fff; letter-spacing:0em; font-weight:400; margin:0; margin-bottom:10px;}
.main_con02 .hover_box .text p{font-size:16px; color:#fff; letter-spacing:-0.025em; font-weight:300; line-height:1.4; }

.main_con02 .swiper-slide:hover .img_box img{width:115%;}
.main_con02 .swiper-slide:hover .hover_box{opacity:1;}
.main_con02 .swiper-slide:hover .hover_box .text{left:60px; opacity:1;}

@media all and (max-width:1200px){
	.main_con02 .hover_box .text{bottom:40px;}
	.main_con02 .hover_box .text h6{margin-bottom:6px;}
	.main_con02 .swiper-slide:hover .hover_box .text{left:40px;}
}
@media all and (max-width:1000px){
	.main_con02{padding-bottom:80px;}
}

.main_con03{position:relative; padding:100px 0; background:url('/img/main_con03_bg.jpg') no-repeat center center / cover;}
.imgSwiper{overflow: hidden;}
.imgSwiper .swiper-pagination{position: unset; display: flex; align-items: center; justify-content: center;}
.imgSwiper .swiper-wrapper{margin-bottom: 50px;}
.imgSwiper .swiper-pagination-bullet{opacity: 1; background-color: #392d2a; box-sizing: border-box;}
.imgSwiper .swiper-pagination-bullet-active{width: 12px; height: 12px; background-color: transparent; border: 2px solid #392d2a;}

.main_con03 ul{font-size:0; letter-spacing:-4px;}
.main_con03 ul li{display:inline-block; vertical-align:top; width:calc(16.666666% - 8.4px); margin-right:10px; margin-bottom:10px; }
.main_con03 ul li:nth-of-type(6n){margin-right:0;}
.main_con03 ul li .img_box img{width:100%;}

@media all and (max-width:1200px){
	.main_con03 ul li{width:calc(25% - 7.8px);}
	.main_con03 ul li:nth-of-type(6n){margin-right:10px;}
	.main_con03 ul li:nth-of-type(4n){margin-right:0;}
}
@media all and (max-width:1000px){
	.main_con03{padding:80px 0;}
}
@media all and (max-width:767px){
	.main_con03 ul li{width:calc(33.333333% - 6.7px);}
	.main_con03 ul li:nth-of-type(4n){margin-right:10px;}
	.main_con03 ul li:nth-of-type(3n){margin-right:0;}
}

.main_con04{position:relative; padding:100px 0 150px; background:#fff; text-align:center;}
.main_con04 i{display:block; width:1px; height:40px; margin:0 auto 30px; background:#888888;}
.main_con04 h4{font-size:24px; color:#222222; letter-spacing:-0.025em; font-weight:400; line-height:1.5; margin:0; word-break:keep-all;}
.main_con04 h6{font-size:14px; color:#aaaaaa; letter-spacing:0.8em; font-weight:400; margin:0; margin-top:20px; }
.main_con04 a{display:block; width:90%; max-width:200px; font-size:18px; color:#fff; letter-spacing:-0.025em; font-weight:500; margin:50px auto 0; padding:14px 0; border-radius:4px; border-top-left-radius:28px; border-bottom-right-radius:28px; background:#222222; box-sizing:border-box; transition:all 0.3s; -webkit-transition:all 0.3s; -o-transition:all 0.3s; -ms-transition:all 0.3s; -moz-transition:all 0.3s;}
.main_con04 a:hover{background:#2dafd5;}

@media all and (max-width:1000px){
	.main_con04{padding:80px 0 100px;}
}

