@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap');
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: 'Noto Sans KR', AppeGothic, sans-serif;
	font-size: 16px;
	color: #1e293b;
	scroll-behavior: smooth;
}
html,body{
	width:100%;
	height:100%;
}
ul li {
	list-style: none;
}
body {
	background-color: #fff;
}
a {
	color: inherit;
	text-decoration: none;
	text-decoration-line: none;
}
.f-le {
	float: left;
}
.f-ri {
	float: right;
}
.cf::after {
	clear: both;
	content: '';
	display: block;
}
.m-auto {
	margin: 0 auto;
}
.m-top {
	margin-top: 120px;
}
.button {
	cursor: pointer;
	border-radius: 20px;
}

iframe {
	border: none;
}
.skip-link {
	display: none;
	width: 100%;
	text-align: center;
}
.skip-link span {
	display: block;
	font-size: 12px;
}

.slide{
	background-attachment: fixed;
	width:100%;
	height:100%;
	position: relative;
}
.wrapper{
	width:960px;
	height:200px;
	margin:0 auto;
	position:relative;
}
.slideno{
	position:absolute;
	bottom:0px;
	left:0px;
	font-size:100px;
	font-weight:bold;
	color:rgba(255,255,255,0.3);
}
.button{
	display:block;
	width:50px;
	height:50px;
	position:absolute;
	bottom:0px;
	left:50%;
	background-color:#333333;
	background-image:url(../images/arrow.png);
}
.button:hover{
	background-color:#494949;
	cursor:pointer;
}

/* 헤더오버 */
#header.hover .gnb > .w1340 > ul > li > a {color: #fff;}
#header.hover .gnb > .w1340 > ul > li:hover > a {color: #ff0000;}
#header.hover .gnb > .w1340 > ul > li > ul > li:hover > a {color: #ff0000;}
#header.hover .gnb > .w1340 > ul > li > a span {color: #fff;}
#header.hover .gnb > .w1340 > ul > li:hover > a span {color: #ff0000;}

/* 헤더액티브 */
#header.scroll-active {box-shadow: 0 1px 2px rgba(0,0,0,0.3);}
#header.scroll-active h1 {width: 140px; height: 52px; transition: all 0.3s; margin-top: 13px; z-index: 100000;}

/* 헤더 */
#header {width: 100%; position: fixed; top: 0; left: 0; height: 81px; box-sizing: border-box; background-color: rgba(0,0,0,0.3); box-shadow: 0 1px 2px rgba(0,0,0,0.3); transition: all 0.3s; z-index: 99996}
#header:after {content: ''; display: block; clear: both}
#header .white-bg {display: none; position: absolute; top: 100px; left: 0; width: 100%; height: 80px; background-color: #fff; border-bottom: 1px solid #e1e1e1; z-index: 99996}
#header h1 {float: left; position: relative; width: 198px; height: 74px; transition: all 0.3s; margin-left: 64px; margin-top: 3px; z-index: 100000;}
#header h1 a {display: block; width: 100%; height: 100%}
#header h1 a img {display: block; position: absolute; top: 0; left: 0; transition: all 0.3s; width: 100%; height: 100%}
#header .gnb {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); width: 100%; height: 100%; z-index: 99999;}
#header .gnb .w1340 {position: relative; width: 100%;}
#header .gnb .w1340:after {content: ''; display: block; clear: both}
/* 1뎁 */
#header .gnb > .w1340 > ul {min-width : 1100px; width : 100%; height: 100%; font-size: 0; text-align: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#header .gnb > .w1340 > ul > li{position: relative; display: inline-block; vertical-align: top; height: 100%; margin-right: 30px; margin-left: 30px;}
#header .gnb > .w1340 > ul > li:last-child {margin-right: 0;}
#header .gnb > .w1340 > ul > li > a {display: block; height:100%; box-sizing:border-box; font-size: 15px; font-weight: 500; color:#fff; text-align: center; line-height: 81px;}
#header .gnb > .w1340 > ul > li > a span {color: #fff; font-size: 11px;}
/* 2뎁 */
#header .gnb > .w1340 > ul > li > ul:after {display: block; content: ""; clear: both;}
#header .gnb > .w1340 > ul > li > ul {display: none; position: absolute; top: 81px; left: -30px; padding-top: 0; width: 180px; box-sizing: border-box; border-radius: 6px; background-color: rgba(0,0,0,0.3);}
#header .gnb > .w1340 > ul > li > ul > li {position: relative; text-align: left; display: block; padding-top: 5px; padding-left: 30px; padding-bottom: 5px; border-bottom: 1px solid rgba(255,255,255,0.2);}
#header .gnb > .w1340 > ul > li > ul > li:last-child {border-bottom: 0;}
#header .gnb > .w1340 > ul > li > ul > li > a {display: block; font-size: 16px; font-weight: 400; color: #fff; line-height: 1;}



#header .estimate_btn {float: right; position: relative; padding-right: 10%; margin-top: 21px; z-index: 100000;}
#header .estimate_btn .btn_more {
	display: block;
	width: 105px;
	height: 38px;
	background-color: #f56464;
	color: #fff;
	font-size: 14px;
	font-weight: 400;
	text-align: center;
	border-radius: 20px;
	line-height: 38px;
}


@media all and (max-width:1330px){
	#header h1 {width: 140px; height: 52px; transition: all 0.3s; margin-left: 58px; margin-top: 13px; z-index: 100000;}
	#header .gnb > .w1340 > ul > li{margin-right: 20px; margin-left: 20px;}
	#header .gnb > .w1340 > ul {width : 100%; left : 60%;}
	#header .estimate_btn {padding-right: 5%;}
}

@media (max-width : 1250px){
	#header .gnb > .w1340 > ul{min-width: unset;}
}
@media (min-width:320px) and (max-width:480px){
	#header.scroll-active h1 {width: 86px; height: 32px; transition: all 0.3s; margin-left: 25px; margin-top: 24px; z-index: 100000;}
}


/* 모바일헤더 */
.black-bg {display: none; position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0,0,0,0.5); z-index: 88888}
.black-bg.on {display: block}
#header .mobile-gnb {display: none}

@media all and (max-width:1024px){
	#header {width: 100%; position: fixed; top: 0; left: 0; height: 81px; box-sizing: border-box; background-color: rgba(0,0,0,0.3); box-shadow: 0 1px 2px rgba(0,0,0,0.3); transition: all 0.3s; z-index: 99996}
	#header .estimate_btn {float: right; position: relative; margin-right: 38px; padding-right: 0; margin-top: 21px; z-index: 100000;}
	#header .mobile-menu-open {display: block; width: 45px; height: 35px; border-radius: 11px; background-color: rgba(255,255,255,0.4); box-sizing: border-box; position: relative; transition: all 0.4s; box-sizing: border-box; margin-top: 23px; float: right; margin-right: 88px; z-index: 100002;}
	#header .mobile-menu-open span {display: inline-block; transition: all 0.4s; box-sizing: border-box; position: absolute; left: 6px; width: 33px; height: 1px; border-radius: 1px; background-color: unset; border-bottom: 1px solid #fff}
	#header.hover span,
	#header.scroll-active span {border-bottom: 1px solid #fff}
	#header .mobile-menu-open.on span {border-bottom: 1px solid #000; left: 13px; width: 17px; height: 1px;}
	#header .mobile-menu-open.on {width: 45px; height: 35px; border-radius: 3px; background-color: rgba(255,255,255,1); border: 1px solid #7f7f7f; box-sizing: border-box; position: relative; transition: all 0.4s; box-sizing: border-box; margin-top: 23px; float: right; margin-right: 45px; z-index: 100002;}
	#header .mobile-menu-open span:nth-of-type(1) {top: 12px}
	#header .mobile-menu-open span:nth-of-type(2) {top: 17px}
	#header .mobile-menu-open span:nth-of-type(3) {bottom: 11px}
	#header .mobile-menu-open.on span:nth-of-type(1) {transform: translateY(5px) rotate(-45deg); -webkit-transform: translateY(5px) rotate(-45deg); -moz-transform: translateY(5px) rotate(-45deg); -o-transform: translateY(5px) rotate(-45deg); -ms-transform: translateY(5px) rotate(-45deg);}
	#header .mobile-menu-open.on span:nth-of-type(2) {opacity: 0}
	#header .mobile-menu-open.on span:nth-of-type(3) {transform: translateY(-5px) rotate(45deg); -webkit-transform: translateY(-5px) rotate(45deg); -moz-transform: translateY(-5px) rotate(45deg); -o-transform: translateY(-5px) rotate(45deg); -ms-transform: translateY(-5px) rotate(45deg);}
	
	#header .gnb {display: none;}
	#header .mobile-gnb {display: block; position: absolute; top: 0; left: -110%; background-color: #000; width: 100%;  height: 100%; min-height : 100vh; transition: all 0.5s; z-index: 100001;
		overflow-y : scroll; -webkit-overflow-scrolling: touch; }
	#header .mobile-gnb > h1 {margin-left: 45px; margin-top: 38px; width: 190px; height: 71px;}
	#header.scroll-active .mobile-gnb {top: 0}
	#header .mobile-gnb.on {left: 0}
	#header .mobile-gnb > ul {margin-top: 140px;}
	#header.scroll-active .mobile-gnb > ul {margin-top: 140px}
	#header .mobile-gnb > ul > li.active > a {background: url("../imgs/img_arr02_over.png") no-repeat 95% center; color: #ff0000;}
	#header .mobile-gnb > ul > li > a {display: block; width: 100%; height: 60px; box-sizing: border-box; padding-left: 45px; color: #fff; font-size: 24px; font-weight: 500; line-height: 60px; background: url("../imgs/img_arr02.png") no-repeat 95% center; transition: all 0.3s;}
	#header .mobile-gnb > ul > li.no_sub.active > a {background-image: none}
	#header .mobile-gnb > ul > li.no_sub > a {background-image: none}
	#header .mobile-gnb > ul > li.on > ul {display: block;}
	#header .mobile-gnb > ul > li > ul {display: none;}
	#header .mobile-gnb > ul > li > ul > li > a {display: block; width: 100%; height: 50px; box-sizing: border-box; font-size: 22px; line-height: 50px; font-weight: 400; color: #fff; padding-left: 60px; border-bottom: 1px solid #383838;}
	#header .mobile-gnb > ul > li > ul > li:last-child > a {border-bottom: 0;}
}
@media all and (max-width:768px){
	#header .mobile-gnb > ul > li > a {font-size: 18px;}
	#header .mobile-gnb > ul > li > ul > li > a {font-size: 16px;}
}
@media (min-width:320px) and (max-width:480px){
	#header h1 {width: 86px; height: 32px; transition: all 0.3s; margin-left: 25px; margin-top: 24px; z-index: 100000;}
	#header .estimate_btn {float: right; position: relative; margin-right: 15px; padding-right: 0; margin-top: 24px; z-index: 100000;}
	#header .estimate_btn .btn_more {
		width: 81px;
		height: 32px;
		line-height: 32px;
	}
	#header .mobile-menu-open {margin-right: 20px; height: 32px;}
	#header .mobile-menu-open span:nth-of-type(1) {top: 11px}
	#header .mobile-menu-open span:nth-of-type(2) {top: 16px}
	#header .mobile-menu-open span:nth-of-type(3) {bottom: 10px}
}

/******************************
 SLIDE 1 
*******************************/
#slide1 {position: relative; width: 100%; height : 100%; box-sizing : border-box; overflow-x: hidden; overflow-y: hidden;}
#slide1 .wrap {width: 100%; height: 100%;}
#slide1 .sl01_con {position: absolute; top: 50%; left: 240px; transform: translateY(-50%); z-index: 100; transition: all 0.3s;}
#slide1 .sl01_con h2 {color: #fff; font-size: 24px; font-weight: 500; text-shadow: 1px 1px #000; letter-spacing: 3px; margin-bottom: 20px;}
#slide1 .sl01_con h1 {color: #fff; font-size: 60px; font-weight: 500; text-shadow: 1px 1px #000; letter-spacing: 2px; line-height: 1.3;}
#slide1 .sl01_con h3 {color: #fff; font-size: 22px; font-weight: 400; text-shadow: 1px 1px #000; margin-bottom: 50px;}
#slide1 .video_area {position: absolute; object-fit : cover;}
#slide1 .video_area video {width: auto; height: 100vh;}
#slide1 .background_video {z-index: -1; width: 100vw; position: absolute;}

/*
#slide1 video {position: absolute; left: 0; top: 0; max-width: 100%; max-height: 100%; } */
@media screen and (max-aspect-ratio: 1219/685) {
  #slide1 .background_video {
       width: auto;
       height: 100vh;
    }
}

.main_btn {position: relative;}
.main_btn a {display: block; border: 3px solid #fff; width: 122px; height: 42px; padding-top: 5px; border-radius: 3px; font-size: 16px; font-weight: 500; color: #fff; text-align: center;}
.main_btn a:hover {background: linear-gradient(to bottom, rgba(255, 255, 255, 0.5), transparent);}
@media all and (max-width:1024px){
	#slide1 {height: 515px;}
	#slide1 .sl01_con {left: 82px;}
	#slide1 .sl01_con h2 {font-size: 16px; letter-spacing: 3px; margin-bottom: 20px;}
	#slide1 .sl01_con h1 {font-size: 42px; letter-spacing: 2px; line-height: 1.3;}
	#slide1 .sl01_con h3 {font-size: 16px; margin-bottom: 40px;}
}

@media all and (max-width:768px){
	#slide1 {height: 100vh;}
	#slide1 .sl01_con {left: 26px;}
	#slide1 .sl01_con h2 {font-size: 14px; letter-spacing: 2px; margin-bottom: 15px;}
	#slide1 .sl01_con h1 {font-size: 34px; letter-spacing: 2px; line-height: 1.3;}
	#slide1 .sl01_con h3 {font-size: 14px;}
	#slide1 .background_video {left: -55%;}
}
/******************************
 SLIDE 2 
*******************************/
#slide2 {border-top: 1px solid #fff; width: 100%; height: 600px; border-bottom: 1px solid #fff; box-sizing: border-box;
}
#slide2 .wrap {width: 100%; height: 100%; background: url("../imgs/bg_section02.jpg") no-repeat left top; background-size: 100vw 100vh; background-attachment: fixed;}
#slide2 .sl02_con {position: absolute; top: 50%; left: 125px; transform: translateY(-50%); z-index: 100; transition: all 0.3s;}
#slide2 .sl02_con h1 a{display: block; color: #fff; font-size: 60px; font-weight: bold; text-shadow: 2px 2px 2px #000; margin-bottom: 30px;}
#slide2 .sl02_con h1 {display: block; color: #fff; font-size: 60px; font-weight: bold; text-shadow: 2px 2px 2px #000; margin-bottom: 30px;}
#slide2 .sl02_con h2 {font-size: 28px; color: #fff; font-weight: bold; text-shadow: 2px 2px #000; line-height: 1.2; margin-bottom: 10px;}
#slide2 .sl02_con h3 {font-size: 28px; color: #fff; width : 100%; font-weight: 400; text-shadow: 2px 2px #000; line-height: 1.5; margin-bottom: 60px;}
@media all and (max-width:1024px){
	#slide2 {height: 500px;}
	#slide2 .sl02_con {left: 60px;}
	#slide2 .sl02_con h1 a{font-size: 34px; margin-bottom: 25px;}
	#slide2 .sl02_con h1 {font-size: 34px; margin-bottom: 25px;}
	#slide2 .sl02_con h2 {font-size: 24px; margin-bottom: 5px;}
	#slide2 .sl02_con h3 {width: 90%; font-size: 24px; margin-bottom: 50px;}
}

@media all and (max-width:768px){
	#slide2 {height: 400px;}
	#slide2 .sl02_con {left: 26px;}
	#slide2 .sl02_con h1 a {font-size: 25px; margin-bottom: 20px;}
	#slide2 .sl02_con h1 {font-size: 25px; margin-bottom: 20px;}
	#slide2 .sl02_con h2 {width: 80%; font-size: 14px; line-height: 1.5; margin-bottom: 0;}
	#slide2 .sl02_con h3 {width: 85%; font-size: 14px; margin-bottom: 40px;}
}

/******************************
 SLIDE 3 
*******************************/
#slide3 {
	border-bottom: 1px solid #fff;
	width: 100%;
	height: 600px;
	box-sizing: border-box;
}
#slide3 .wrap {width: 100%; height: 100%; background: url("../imgs/bg_section03.jpg") no-repeat left top;  background-size: 100vw 100vh; background-attachment: fixed;}
#slide3 .sl03_con {position: absolute; top: 50%; left: 125px; transform: translateY(-50%); z-index: 100; transition: all 0.3s;}
#slide3 .sl03_con h1 a {display: block; color: #fff; font-size: 60px; font-weight: bold; text-shadow: 2px 2px 2px #000; margin-bottom: 30px;}
#slide3 .sl03_con h1 {display: block; color: #fff; font-size: 60px; font-weight: bold; text-shadow: 2px 2px 2px #000; margin-bottom: 30px;}
#slide3 .sl03_con h2 {font-size: 28px; color: #fff; font-weight: bold; text-shadow: 2px 2px #000; line-height: 1.2; margin-bottom: 10px;}
#slide3 .sl03_con h3 {width: 100%; font-size: 28px; color: #fff; font-weight: 400; text-shadow: 2px 2px #000; line-height: 1.5; margin-bottom: 60px;}

@media all and (max-width:1024px){
	#slide3 {height: 500px;}
	#slide3 .wrap {width: 100%; height: 100%; background: url("../imgs/bg_section03.jpg") no-repeat left top; background-size: cover;}
	#slide3 .sl03_con {left: 60px;}
	#slide3 .sl03_con h1 a {font-size: 34px; margin-bottom: 25px;}
	#slide3 .sl03_con h1 {font-size: 34px; margin-bottom: 25px;}
	#slide3 .sl03_con h2 {font-size: 24px; margin-bottom: 5px;}
	#slide3 .sl03_con h3 {width: 90%; font-size: 24px; margin-bottom: 50px;}
}

@media all and (max-width:768px){
	#slide3 {height: 400px;}
	#slide3 .sl03_con {left: 26px;}
	#slide3 .sl03_con h1 a {font-size: 25px; margin-bottom: 20px;}
	#slide3 .sl03_con h1 {font-size: 25px; margin-bottom: 20px;}
	#slide3 .sl03_con h2 {width: 80%; font-size: 14px; line-height: 1.5; margin-bottom: 0;}
	#slide3 .sl03_con h3 {width: 85%; font-size: 14px; margin-bottom: 40px;}
}

/******************************
 SLIDE 4 
*******************************/

#slide4{
	background:#000;
	width: 100%;
	height: 470px;
	border-bottom: 1px solid #fff;
	box-sizing: border-box;
}

#slide4 .swiper {
	position: relative;
	width: 100%;
	padding-top: 10px;
	padding-bottom: 10px;
	box-sizing: border-box;
}

#slide4 .swiper-slide {
	position: relative;
	background-position: center;
	background-size: cover;
	width: 30%;
	height: 440px;
}
.swiper-slide a {position: relative; width: 100%; height: 100%;}
.swiper-slide a h3 {position: absolute; left: 50%; bottom: 25px; width:calc(100% - 30px); transform: translateX(-50%); color: #fff; font-size: 28px; font-weight: 400; text-align: center; text-shadow: 2px 2px 2px #000; padding: 0 15px; box-sizing: border-box; word-wrap: break-word; word-break: break-all;}
.swiper-slide a:hover h3 {bottom: 50px; transition: all 0.3s;}
.swiper-slide a img {border: 2px solid #fff; border-radius: 10px; display: block; width: 100%; height: 100%; transition: all 0.2s linear;}
.swiper-button-next {margin-right: 18px; display: block; background: url('../imgs/btn_next.png') no-repeat right top; background-size: 34px auto;}
.swiper-button-next:hover {background: url('../imgs/btn_next_over.png') no-repeat right top; background-size: 34px auto;}
.swiper-button-prev {margin-left: 18px; background: url('../imgs/btn_prev.png') no-repeat left top; background-size: 34px auto;}
.swiper-button-prev:hover {background: url('../imgs/btn_prev_over.png') no-repeat; background-size: 34px auto;}

.swiper-button-next::after,
.swiper-button-prev::after {
  display: none;
}




@media all and (max-width:1024px){
	#slide4 {width: 100%; height: 280px; box-sizing: border-box;}
	#slide4 .swiper {padding-top: 15px; padding-bottom: 15px; box-sizing: border-box;}
	#slide4 .swiper-slide {height: 250px;}
}
@media all and (max-width:768px){
	#slide4 {width: 100%; height:140px; box-sizing: border-box;}
	#slide4 .swiper {padding-top: 10px; padding-bottom: 10px; box-sizing: border-box;}
	#slide4 .swiper-slide {height: 120px;}
	.swiper-slide a h3 {bottom: 15px; font-size: 14px;}
	.swiper-slide a:hover h3 {bottom: 30px; transition: all 0.3s;}
	.swiper-button-next {background-size: 22px auto;}
	.swiper-button-next:hover {background-size: 22px auto;}
	.swiper-button-prev {background-size: 22px auto;}
	.swiper-button-prev:hover {background-size: 22px auto;}
	.swiper-button-next {margin-right: 5px;}
	.swiper-button-prev {margin-left: 5px;}
}


/******************************
 SLIDE 5 
*******************************/
#slide5 {
	border-bottom: 1px solid #fff;
	width: 100%;
	height: 600px;
	box-sizing: border-box;
}
#slide5 .wrap {width: 100%; height: 100%; background: url("../imgs/main_aboutus_bg_1.jpg") no-repeat left top;  background-size: 100vw 100vh; background-attachment: fixed;}
#slide5 .sl05_con {position: absolute; top: 50%; left: 125px; transform: translateY(-50%); z-index: 100; transition: all 0.3s;}
#slide5 .sl05_con h1 a {display: block; color: #fff; font-size: 60px; font-weight: bold; text-shadow: 2px 2px 2px #000; margin-bottom: 30px;}
#slide5 .sl05_con h1 {display: block; color: #fff; font-size: 60px; font-weight: bold; text-shadow: 2px 2px 2px #000; margin-bottom: 30px;}
#slide5 .sl05_con h2 {width: 100%; font-size: 28px; color: #fff; font-weight: bold; text-shadow: 2px 2px #000; line-height: 1.2; margin-bottom: 10px;}
#slide5 .sl05_con h3 {width: 100%; font-size: 28px; color: #fff; font-weight: 400; text-shadow: 2px 2px #000; line-height: 1.5; margin-bottom: 60px;}

@media all and (max-width:1024px){
	#slide5 {height: 500px;}
	#slide5 .wrap {width: 100%; height: 100%; background: url("../imgs/bg_section05.jpg") no-repeat left top; background-size: cover;}
	#slide5 .sl05_con {left: 60px;}
	#slide5 .sl05_con h1 a {font-size: 34px; margin-bottom: 25px;}
	#slide5 .sl05_con h1 {font-size: 34px; margin-bottom: 25px;}
	#slide5 .sl05_con h2 {font-size: 24px; margin-bottom: 5px;}
	#slide5 .sl05_con h3 {width: 90%; font-size: 24px; margin-bottom: 50px;}
}
@media all and (max-width:768px){
	#slide5 {height: 400px;}
	#slide5 .sl05_con {left: 26px;}
	#slide5 .sl05_con h1 a {font-size: 25px; margin-bottom: 20px;}
	#slide5 .sl05_con h1 {font-size: 25px; margin-bottom: 20px;}
	#slide5 .sl05_con h2 {width: 80%; font-size: 14px; line-height: 1.5; margin-bottom: 0;}
	#slide5 .sl05_con h3 {width: 85%; font-size: 14px; margin-bottom: 40px;}
}

/******************************
 SLIDE 6 
*******************************/
#slide6 {position: relative; width: 100%; height: 328px; box-sizing: border-box; background: #000;}
#slide6 .wrap {position: relative; width: 100%; height: 100%;}
#slide6 .wrap h1 {text-align: center; padding-top: 20px;  font-size: 48px; font-weight: bold; text-shadow: 2px 2px 2px #000;
/*color: #6ec1e4;*/
color : #fff;}
#slide6 .wrap h3 {text-align: center; padding-top: 10px; font-size: 21px; color: #fff; font-weight: bold; text-shadow: 2px 2px 2px #000;}
/* banner */
#slide6 .wrap .banner01 {position: absolute; bottom: 84px; left: 0; width: 100%; height: 64px; margin:0 auto; padding:0; overflow: hidden; background: #fff;}
#slide6 .wrap .banner02 ul,
#slide6 .wrap .banner01 ul {position: absolute; margin: 0px; padding:0;}
#slide6 .wrap .banner02 ul li,
#slide6 .wrap .banner01 ul li {float: left; margin:0; padding:0;}
#slide6 .wrap .banner02 ul li img,
#slide6 .wrap .banner01 ul li img {width: 128px; height: 64px;}

#slide6 .wrap .banner02 {position: absolute; bottom: 0; left: 0; width: 100%; height: 64px; margin:0 auto; padding:0; overflow: hidden; background: #fff;}

@media all and (max-width:1024px){
	#slide6 {height: 304px;}
	#slide6 .wrap .banner01 {bottom: 73px; height: 50px;}
	#slide6 .wrap .banner02 {height: 50px;}
	#slide6 .wrap .banner02 ul li img,
	#slide6 .wrap .banner01 ul li img {width: 100px; height: 50px;}
}
@media all and (max-width:768px){
	#slide6 {height: 286px;}
	#slide6 .wrap h1 {font-size: 50px;}
	#slide6 .wrap h3 {padding-top: 20px; }
	#slide6 .wrap .banner01 {bottom: 63px; height: 38px;}
	#slide6 .wrap .banner02 {height: 38px;}
	#slide6 .wrap .banner02 ul li img,
	#slide6 .wrap .banner01 ul li img {width: 76px; height: 38px;}
}
@media (min-width:320px) and (max-width:480px){
	#slide6 {height: 310px;}
	#slide6 .wrap h1 {font-size: 30px; padding-top: 30px;}
	#slide6 .wrap h3 {font-size: 14px; padding: 10px 10px 0 10px; padding-top: 20px; }
	#slide6 .wrap .banner01 {bottom: 81px; height: 61px;}
	#slide6 .wrap .banner02 {height: 61px;}
	#slide6 .wrap .banner02 ul li img,
	#slide6 .wrap .banner01 ul li img {width: 122px; height: 61px;}
}

/******************************
 SLIDE 7 
*******************************/
#slide7 {
	border-bottom: 1px solid #fff;
	width: 100%;
	height: 600px;
	box-sizing: border-box;
}
#slide7 .wrap {width: 100%; height: 100%; background: url("../imgs/bg_section07.jpg") no-repeat left top;  background-size: 100vw 100vh; background-attachment: fixed;}
#slide7 .sl07_con {position: absolute; top: 50%; left: 125px; transform: translateY(-50%); z-index: 100; transition: all 0.3s;}
#slide7 .sl07_con h1 a {display: block; color: #fff; font-size: 60px; font-weight: bold; text-shadow: 2px 2px 2px #000; margin-bottom: 30px;}
#slide7 .sl07_con h1 {display: block; color: #fff; font-size: 60px; font-weight: bold; text-shadow: 2px 2px 2px #000; margin-bottom: 30px;}
#slide7 .sl07_con h2 {width: 100%; font-size: 28px; color: #fff; font-weight: bold; text-shadow: 2px 2px #000; line-height: 1.2; margin-bottom: 10px;}
#slide7 .sl07_con h3 {width: 100%; font-size: 28px; color: #fff; font-weight: 400; text-shadow: 2px 2px #000; line-height: 1.5; margin-bottom: 60px;}

@media all and (max-width:1024px){
	#slide7 {height: 500px;}
	#slide7 .wrap {width: 100%; height: 100%; background: url("../imgs/bg_section05.jpg") no-repeat left top; background-size: cover;}
	#slide7 .sl07_con {left: 60px;}
	#slide7 .sl07_con h1 a {font-size: 34px; margin-bottom: 25px;}
	#slide7 .sl07_con h1 {font-size: 34px; margin-bottom: 25px;}
	#slide7 .sl07_con h2 {font-size: 24px; margin-bottom: 5px;}
	#slide7 .sl07_con h3 {width: 90%; font-size: 24px; margin-bottom: 50px;}
}
@media all and (max-width:768px){
	#slide7 {height: 400px;}
	#slide7 .sl07_con {left: 26px;}
	#slide7 .sl07_con h1 a {font-size: 25px; margin-bottom: 20px;}
	#slide7 .sl07_con h1 {font-size: 25px; margin-bottom: 20px;}
	#slide7 .sl07_con h2 {width: 80%; font-size: 14px; line-height: 1.5; margin-bottom: 0;}
	#slide7 .sl07_con h3 {width: 85%; font-size: 14px; margin-bottom: 40px;}
}

/******************************
 SLIDE 8
*******************************/
#slide8 {
	border-bottom: 1px solid #fff;
	width: 100%;
	height: 600px;
	box-sizing: border-box;
}
#slide8 .wrap {width: 100%; height: 100%; background: url("../imgs/bg_section08.jpg") no-repeat left top;  background-size: 100vw 100vh; background-attachment: fixed;}



/* main vedio */
html, body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	min-height: 100vh;
	position: relative;
}

@keyframes zoomEffect {
	0% {
		transform: translate(-50%, -50%) scale(1.15);
	}
	100% {
		transform: translate(-50%, -50%) scale(1);
	}
}

.video-container-main {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	min-height: 100vh;
	background: #000;
}

.video-container-main iframe {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	border: 0;
	pointer-events: none;
	animation: zoomEffect 1s ease-out 3s forwards;
	transform: translate(-50%, -50%) scale(1.15);
}

.main-content-section {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 2s ease, transform 2s ease;
}

.main-content-section.fade-in {
    opacity: 1;
    transform: translateY(0);
}



@media (min-aspect-ratio: 16/9) {
	.video-container-main iframe {
		height: 56.25vw;
		width: 100vw;
	}
}

@media (max-aspect-ratio: 16/9) {
	.video-container-main iframe {
		height: 100vh;
		width: 177.78vh;
	}
}

/* 모바일 대응을 위한 추가 스타일 */
@media screen and (max-width: 768px) {
	.video-container-main {
		height: 100vh; /* 모바일에서는 뷰포트 높이로 강제 */
	}
}

.logo_slider {background-color: #fff;}
.logo_slider .swiper-wrapper{transition-timing-function: linear;}
.logo_slider .swiper{width : 100%;}
.logo_slider img{width : 150px;}
.logo_slider_01 {margin : 20px auto;}

@media (max-width: 1100px){
	.logo_slider img{width : 100px;}
}



.expected h3{font-size : 1.25rem;}


/*    .setting_information_imgs{position : fixed; top : 66vh; right : 10px; z-index : 11111;}*/
/*.setting_information_imgs .image_box img{width : 180px;}*/

/*.setting_information_imgs .image_box #pc_telLink{display : block;}*/
/*.setting_information_imgs .image_box #mobile_telLink, .setting_information_imgs .image_box #mobile_telLink img{display : none;}*/


/*@media screen and (max-width : 768px) {*/
/*	.setting_information_imgs{right : 10px;}*/

/*	.setting_information_imgs .image_box #pc_telLink{display : none;}*/
/*	.setting_information_imgs .image_box #mobile_telLink, .setting_information_imgs .image_box #mobile_telLink img {display : block;}*/

/*}*/


/******************************
 SLIDE 11
*******************************/
#slide11 {border-top: 1px solid #fff; width: 100%; height: auto; border-bottom: 1px solid #fff; box-sizing: border-box;}
#slide11 .wrap {width: 100%; height: 100%; background: url("../imgs/bg_section03.jpg") no-repeat left top; background-size: 100vw 100vh; background-attachment: fixed;}
#slide11 .sl11_con {width : 100%; transition: all 0.3s;}
#slide11 .sl11_con h1 a{display: block; color: #fff; font-size: 60px; font-weight: bold; text-shadow: 2px 2px 2px #000; margin-bottom: 30px;}
#slide11 .sl11_con h1 {display: block; color: #fff; font-size: 60px; font-weight: bold; text-shadow: 2px 2px 2px #000; margin-bottom: 30px;}
#slide11 .sl11_con h2 {font-size: 28px; color: #fff; font-weight: bold; text-shadow: 2px 2px #000; line-height: 1.2; margin-bottom: 10px;}
#slide11 .sl11_con h3 {font-size: 28px; color: #fff; width : 100%; font-weight: 400; text-shadow: 2px 2px #000; line-height: 1.5; margin-bottom: 60px;}
@media all and (max-width:1024px){
	#slide11 .sl11_con {left: 60px;}
	#slide11 .sl11_con h1 a{font-size: 34px; margin-bottom: 25px;}
	#slide11 .sl11_con h1 {font-size: 34px; margin-bottom: 25px;}
	#slide11 .sl11_con h2 {font-size: 24px; margin-bottom: 5px;}
	#slide11 .sl11_con h3 {width: 90%; font-size: 24px; margin-bottom: 50px;}
}

@media all and (max-width:768px){
	#slide11 .sl11_con {left: 26px;}
	#slide11 .sl11_con h1 a {font-size: 25px; margin-bottom: 20px;}
	#slide11 .sl11_con h1 {font-size: 25px; margin-bottom: 20px;}
	#slide11 .sl11_con h2 {width: 80%; font-size: 14px; line-height: 1.5; margin-bottom: 0;}
	#slide11 .sl11_con h3 {width: 85%; font-size: 14px; margin-bottom: 40px;}
}


.counting-title p, .counting-title span{text-shadow: 2px 2px 2px #000;}


/******************************
 SLIDE 12
*******************************/
#slide12 {border-top: 1px solid #fff; width: 100%; height: auto; border-bottom: 1px solid #fff; box-sizing: border-box;}
#slide12 .wrap {width: 100%; height: 100%; background: url("../imgs/main_free_bg_1.jpg") no-repeat left top; background-size: 100vw 100vh; background-attachment: fixed;}
#slide12 .sl12_con {width : 100%; transition: all 0.3s;}
#slide12 .sl12_con h1 a{display: block; color: #fff; font-size: 60px; font-weight: bold; text-shadow: 2px 2px 2px #000; margin-bottom: 30px;}
#slide12 .sl12_con h1 {display: block; color: #fff; font-size: 60px; font-weight: bold; text-shadow: 2px 2px 2px #000; margin-bottom: 30px;}
#slide12 .sl12_con h2 {font-size: 28px; color: #fff; font-weight: bold; text-shadow: 2px 2px #000; line-height: 1.2; margin-bottom: 10px;}
#slide12 .sl12_con h3 {font-size: 28px; color: #fff; width : 100%; font-weight: 400; text-shadow: 2px 2px #000; line-height: 1.5; margin-bottom: 60px;}

#slide12 .sl12_con #benefits_wrapper{padding : 0 3%;}
#slide12 .sl12_con #benefits_wrapper p{text-align: center; margin-bottom : 50px; text-shadow: 2px 2px 2px #000;}
#slide12 .sl12_con #benefits_wrapper p span{font-size : 2.4em; font-weight : 500; color : #fff;}
#slide12 .sl12_con #benefits_wrapper p .emp{font-size : 60px; font-weight : 600; color : #fff;}
#slide12 .sl12_con .no-wrap{white-space: nowrap;}


/* 상단 3개 */
#slide12 .sl12_con #main_benefits_wrapper{width : 90%; margin : 0 auto;}
#slide12 .sl12_con #main_benefits{display : flex; justify-content: center; align-items: center;}
#slide12 .sl12_con #main_benefits img{width : 100%; transition : all 0.3s ease;}
#slide12 .sl12_con #main_benefits img:hover{}

.benefits_wrapper{position: relative;}
.benefits_wrapper .sample{position: absolute; bottom : 0.8vw; right : 1vw; width : 11vw; height : 6vw; cursor : pointer; z-index : 4;}

.benefits_wrapper .sample.idcard{position: absolute; bottom : 0.8vw; right : 1vw; width : 13vw; height : 7.5vw; cursor : pointer; z-index : 4;}

.benefits_wrapper #idcard_button{position: absolute; top : 50%; left : 50%; width : 6vw; height : 3vw; border-radius : 25px;
	transform : translate(-50%, -50%); cursor : pointer; display : flex; align-items : center; text-align: center; justify-content: center;
	border : 3px solid #fff; color : #fff; font-weight : 600; background-color: rgba(0,0,0,0.4); transition : all 0.3s ease;}

.benefits_wrapper #idcard_button:hover{color : #ff0000; border : 3px solid #ff0000; }
.benefits_wrapper #idcard_button:hover .image{color : #ff0000; border : 3px solid #ff0000; }

.benefits_wrapper .image{ display : block; transition : all 0.3s ease; }
.benefits_wrapper .image_hover{ display : none; transition : all 0.3s ease; }


.benefits_wrapper .button_01:hover ~ .image{display : none;}
.benefits_wrapper .button_01:hover ~ .image_hover{ display : block; }


#custom-modal3 .modal-video-container div{width : 100%;}
#custom-modal3 .modal-video-container div img{width : 100%;}




/* 하단 15개 */
#slide12 .sl12_con #sub_benefits_wrapper{width : 90%; display : grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; gap : 20px; margin : 50px auto 135px auto;}
#slide12 .sl12_con #sub_benefits_wrapper img{width : 100%; transition : all 0.3s ease;}
#slide12 .sl12_con #sub_benefits_wrapper img:hover{}



/* modal */
.modal-custom-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 1000;
}

.modal_custom {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: white;
	padding: 20px;
	border-radius: 5px;
	width: 80%;
	max-width: 800px;
	z-index: 1001;
}

.modal-custom-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
}

.modal-custom-title {
	font-size: 20px;
	font-weight: bold;
	margin: 0;
}

.modal-custom-close-btn {
	background: none;
	border: none;
	font-size: 24px;
	cursor: pointer;
	padding: 0;
}

.modal-video-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.modal-video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@keyframes fade {
	0%, 100% { opacity: 1; }
	50% { opacity: 0.6; }
}


@media all and (max-width:1024px){
	#slide12 .sl12_con {left: 60px;}
	#slide12 .sl12_con h1 a{font-size: 34px; margin-bottom: 25px;}
	#slide12 .sl12_con h1 {font-size: 34px; margin-bottom: 25px;}
	#slide12 .sl12_con h2 {font-size: 24px; margin-bottom: 5px;}
	#slide12 .sl12_con h3 {width: 90%; font-size: 24px; margin-bottom: 50px;}


	#slide12 .sl12_con #benefits_wrapper p .emp{font-size : 34px; font-weight : 600; color : #fff;}

	#slide12 .sl12_con #main_benefits_wrapper{width : 100%;}
	#slide12 .sl12_con #sub_benefits_wrapper{margin-bottom : 100px;}

}



@media all and (max-width:768px){
	#slide12 .sl12_con {left: 26px;}
	#slide12 .sl12_con h1 a {font-size: 25px; margin-bottom: 20px;}
	#slide12 .sl12_con h1 {font-size: 25px; margin-bottom: 20px;}
	#slide12 .sl12_con h2 {width: 80%; font-size: 14px; line-height: 1.5; margin-bottom: 0;}
	#slide12 .sl12_con h3 {width: 85%; font-size: 14px; margin-bottom: 40px;}

	#slide12 .sl12_con #benefits_wrapper p{text-align: center; margin-bottom : 30px; }
	#slide12 .sl12_con #benefits_wrapper p span{font-size : 1.3em; font-weight : 500; color : #fff;}
	#slide12 .sl12_con #benefits_wrapper p .emp{font-size : 25px; font-weight : 600; color : #fff;}
	#slide12 .sl12_con #main_benefits{flex-direction: column; width : 80%; margin : 0 auto;}
	#slide12 .sl12_con #sub_benefits_wrapper{grid-template-columns: 1fr 1fr 1fr; gap : 10px;}
	#slide12 .sl12_con #sub_benefits_wrapper{margin-bottom : 40px; margin-top : 40px;}

	.modal_custom {width : 90%;}


	.benefits_wrapper .sample{position: absolute; bottom : 2.8vw; right : 3vw; width : 32vw; height : 18vw; cursor : pointer;  z-index : 4;}
	.benefits_wrapper .sample.idcard{width : 33vw; height : 20vw; border : 2px solid #fff; bottom : 2vw; right : 3vw;}
	.benefits_wrapper #idcard_button{position: absolute; top : 50%; left : 50%; width : 80px; height : 30px; border-radius : 25px;
	transform : translate(-50%, -50%); cursor : pointer; display : flex; align-items : center; text-align: center; justify-content: center;
	border : 3px solid #fff; color : #fff; font-weight : 400; background-color: rgba(0,0,0,0.4); font-size : 13px;}
}

@media all and (max-width:500px){
	.benefits_wrapper .sample.idcard{width : 33vw; height : 20vw; border : 2px solid #fff; bottom : 2vw; right : 3vw;}
	.counting-title p:nth-child(1) {font-size : 22px;}
}



/* Safari용 대체 스타일 */
@supports (-webkit-touch-callout: none) {
    #slide12 .wrap, #slide11 .wrap, #slide_count .wrap, #slide2 .wrap, .package_show_box .wrap, #slide5 .wrap {
        background-attachment: unset; /* fixed 대신 scroll 사용 */
        /* 또는 background-attachment 속성 제거 */
    }
}