@charset "utf-8";

/* m_txt */
.m_txt{}
.m_txt h4{font-family: 'Play', serif; color: #222; opacity: 0.3; font-size: 17px; margin-bottom: 55px;}
.m_txt h3{font-size: 50px; font-weight: 300; color: #222222;}
.m_txt h3 span{font-weight: 900;}
.m_txt p{font-size: 17px; font-weight: 500; color: #777777; margin-top: 27px; line-height: 1.8em;}

@media all and (max-width:1280px){
	.m_txt h4{font-size: 16px; margin-bottom: 45px;}
	.m_txt h3{font-size: 42px;}
	.m_txt p{font-size: 16px; margin-top: 24px; line-height: 1.7em;}
}
@media all and (max-width:1024px){
	.m_txt h4{margin-bottom: 40px;}
	.m_txt h3{font-size: 38px;}
}
@media all and (max-width:768px){
	.m_txt h4{margin-bottom: 35px; font-size: 15px;}
	.m_txt h3{font-size: 34px;}
	.m_txt p{font-size: 15px;}
}
@media all and (max-width:500px){
	.m_txt h4{margin-bottom: 30px;}
	.m_txt h3{font-size: 28px;}
}

/* #mVisual */
#mVisual{margin-top: 100px; height: calc(100vh - 100px); width: 100%; position: relative;}
#mVisual .visual{position: relative; width: 100%; height: 100%; overflow: hidden; 
					background:url('/images/main/mv-bg.webp') no-repeat center center; background-size:cover}
#mVisual .visual iframe{position: absolute; left: 50%; transform: translate(-50%, -50%); width: 108vw; height: 115.5vh; top: 50%; pointer-events: none;}

 #mv-vod { position: absolute; left: 0; top:0; width: 100%; height: 100vh; object-fit: cover; }

#mVisual .txt{position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); padding-bottom: 120px;}
#mVisual .txt .inner{}
#mVisual .txt .inner h3{font-family: 'Play', serif; font-size: 70px; color: #fff;}
#mVisual .txt .inner p{ font-size: 20px; color: #fff; font-weight: 600; margin-top: 40px;}


@media all and (max-width:1600px){
	#mVisual .txt{width: 100%;}
}
@media all and (max-width:1280px){
	#mVisual{margin-top: 64px; height: 60vw;}
	#mVisual .txt{padding-bottom: 90px;}
	#mVisual .txt .inner h3{font-size: 56px;}
	#mVisual .txt .inner p{font-size: 19px; margin-top: 35px;}
}
@media all and (max-width:1024px){
	#mVisual .txt{padding-bottom: 75px;}
	#mVisual .txt .inner h3{font-size: 48px;}
	#mVisual .txt .inner p{font-size: 18px; margin-top: 32px;}
}
@media all and (max-width:768px){
	#mVisual{height: 100vw;}
	#mVisual .visual iframe{width: 178vw;}
	#mVisual .txt{padding-bottom: 60px;}
	#mVisual .txt .inner h3{font-size: 42px;}
	#mVisual .txt .inner p{font-size: 17px; margin-top: 28px;}
}
@media all and (max-width:480px){
	#mVisual{height: 135vw;}
	#mVisual .visual iframe{width: 241vw;}
	#mVisual .txt{padding-bottom: 50px;}
	#mVisual .txt .inner h3{font-size: 32px;}
	#mVisual .txt .inner p{font-size: 16px; margin-top: 20px; width: 80%; word-break: keep-all; line-height: 1.6em;}
}


/* sec1 */
.sec1{ position: relative;}
.sec1 > .inner{position: absolute; left: 50%; transform: translateX(-50%); top: -100px; z-index: 2;}
.sec1 > .inner .img_box{position: relative; display: inline-block;}
.sec1 > .inner .img_box .img{}
.sec1 > .inner .img_box .img img{max-width: 100%; height: 100%; object-fit: cover;}
.sec1 > .inner .img_box .link{display: inline-block; background: #0068b7 url(/images/main/sec1_link_icon.webp) no-repeat right 40px top 40px / 49px; padding: 40px; min-width: 325px; position: absolute; bottom: 30px; right: -60px;}
.sec1 > .inner .img_box .link .top{}
.sec1 > .inner .img_box .link .top h3{font-size: 32px; color: #fff;}
.sec1 > .inner .img_box .link .top h4{font-size: 13px; color: #fff; opacity: 0.3; margin-top: 5px;}
.sec1 > .inner .img_box .link .bot{margin-top: 50px;}
.sec1 > .inner .img_box .link .bot a{font-size: 16px; font-weight: 700; color: #fff; display: inline-flex; align-items: center; gap:12px;}
.sec1 > .inner .img_box .link .bot a span{height: 10px;}
.sec1 > .inner .img_box .link .bot a span img{max-width: 12px;}

.sec1 .bg{background:url(/images/main/sec1_bg.webp) no-repeat center center / cover; padding: 100px 0 180px; margin-top: 200px;}
.sec1 .bg .inner{display: flex; justify-content: flex-end;}
.sec1 .bg .inner .box{width: 50%;}
.sec1 .bg .inner .box .m_txt{margin-bottom: 150px;}
.sec1 .bg .inner .box .list{display: flex;}
.sec1 .bg .inner .box .list li{text-align: center; display: flex; flex-direction: column;}
.sec1 .bg .inner .box .list li+li{padding-left: 105px; margin-left: 105px; border-left: 1px solid #e2e2e2;}
.sec1 .bg .inner .box .list li h3{font-family: 'Gmarket Sans'; font-weight: 500; font-size: 20px;}
.sec1 .bg .inner .box .list li h3 span{font-weight: 700; font-size: 45px;}
.sec1 .bg .inner .box .list li h4{font-size: 20px; font-weight: 700; color: #333333; margin-top: 20px;}
.sec1 .bg .inner .box .list li p{font-size: 15px; font-weight: 500; color: #777777; margin-top: 8px;}
.sec1 .bg .inner .box .list li p br.mo{display: none;}

@media all and (max-width:1600px){
	.sec1 > .inner{top: -60px;}
	.sec1 > .inner .img_box .img img{max-width: 90%;}
	.sec1 > .inner .img_box .link{right: 30px;}
	.sec1 .bg{margin-top: 140px; padding: 80px 0 120px;}
	.sec1 .bg .inner .box{width: 54%;}
	.sec1 .bg .inner .box .m_txt{padding-left: 50px;}
	.sec1 .bg .inner .box .list{justify-content: space-between;}
	.sec1 .bg .inner .box .list li{width: 100%;}
	.sec1 .bg .inner .box .list li+li{padding-left: 0; margin-left: 0;}
}
@media all and (max-width:1280px){
	.sec1 > .inner .img_box .img img{max-width: 76%;}
	.sec1 > .inner .img_box .link{padding: 35px; min-width: 300px; background-size: 45px; right:170px;}
	.sec1 > .inner .img_box .link .top h3{font-size: 27px;}
	.sec1 .bg .inner .box .m_txt{margin-bottom: 65px; padding-left: 40px;}
	.sec1 .bg .inner .box .list li h3{font-size: 19px;}
	.sec1 .bg .inner .box .list li h3 span{font-size: 38px;}
	.sec1 .bg .inner .box .list li h4{font-size: 19px; margin-top: 16px;}
}
@media all and (max-width:1024px){
	.sec1 > .inner{top: -20px;}
	.sec1 > .inner .img_box .img img{max-width: 54%;}
	.sec1 > .inner .img_box .link{min-width: 0; width: 100%;max-width: 54%; right: 0; position: static;margin-top: -60px; padding: 30px;}
	.sec1 > .inner .img_box .link .top h3{font-size: 25px;}
	.sec1 > .inner .img_box .link .bot a{font-size: 15px;}
	.sec1 .bg{padding: 50px 0 100px;}
	.sec1 .bg .inner .box{width: 54%;}
	.sec1 .bg .inner .box .m_txt{padding-left: 20px;}
	.sec1 .bg .inner .box .m_txt p br{display: none;}
	.sec1 .bg .inner .box .list li h3{font-size: 18px;}
	.sec1 .bg .inner .box .list li h3 span{font-size: 30px;}
	.sec1 .bg .inner .box .list li h4{font-size: 18px; margin-top: 14px;}
}
@media all and (max-width:768px){
	.sec1{display: flex; flex-direction: column-reverse;}
	.sec1 > .inner{top: 0; position: relative; left: 0; transform: translateX(0); padding-top: 40px;}
	.sec1 > .inner .img_box{width: 100%;}
	.sec1 > .inner .img_box .link{max-width: 74%; position: absolute; bottom: -60px; right: 20px; padding: 25px; margin-top: 0; background-size: 40px; background-position: right 30px top 30px;}
	.sec1 > .inner .img_box .img{text-align: center;}
	.sec1 > .inner .img_box .img img{width: 100%; max-width: 100%; height: 120vw; object-fit: cover;}
	.sec1 .bg{margin-top: 0px; padding: 60px 0 80px;}
	.sec1 .bg .inner .box{width: 100%;}
	.sec1 .bg .inner .box .m_txt{padding-left: 0; margin-bottom: 50px;}
	.sec1 .bg .inner .box .list li h3{font-size: 17px;}
	.sec1 .bg .inner .box .list li h3 span{font-size: 26px;}
	.sec1 .bg .inner .box .list li h4{font-size: 17px; margin-top: 12px;}
	.sec1 .bg .inner .box .list li p{font-size: 14px;}
}
@media all and (max-width:480px){
	.sec1 > .inner .img_box .link{max-width: 80%; right: 15px;}
	.sec1 > .inner .img_box .link .top h3{font-size: 22px;}
	.sec1 > .inner .img_box .link .bot{margin-top: 40px;}
	.sec1 .bg{padding: 50px 0 70px;}
	.sec1 .bg .inner .box .list li:nth-child(1){text-align: left;}
	.sec1 .bg .inner .box .list li:nth-child(2){width: 120%;}
	.sec1 .bg .inner .box .list li:nth-child(3){text-align: right;}
	.sec1 .bg .inner .box .list li h3{font-size: 16px;}
	.sec1 .bg .inner .box .list li h3 span{font-size: 24px;}
	.sec1 .bg .inner .box .list li h4{font-size: 16px; margin-top: 10px;}
	.sec1 .bg .inner .box .list li p br.mo{display: block;}
}


/* sec2 */
.sec2{padding: 100px 0; overflow-x: hidden;}
.sec2 .inner{}
.sec2 .inner .top{display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 70px;}
.sec2 .inner .top .l_cont{}
.sec2 .inner .top .l_cont .m_txt{}
.sec2 .inner .top .l_cont .m_txt.flex{display: flex; align-items: flex-end; gap:100px;}
.sec2 .inner .top .l_cont .m_txt.flex .l_box{}
.sec2 .inner .top .l_cont .m_txt.flex .r_box{}
.sec2 .inner .top .r_cont{}
.sec2 .inner .top .r_cont .arrow_box{display: flex; gap:5px;}
.sec2 .inner .top .r_cont .arrow_box .arrow{cursor: pointer;}
.sec2 .inner .top .r_cont .arrow_box .arrow.prev{}
.sec2 .inner .top .r_cont .arrow_box .arrow.next{}
.sec2 .inner .bot{width: 120%;}
.sec2 .inner .bot .list{}
.sec2 .inner .bot .list li{margin-right: 30px; border: 1px solid #e9e9e9; height: 420px; position: relative;}
.sec2 .inner .bot .list li .img{}
.sec2 .inner .bot .list li .img img{max-width: 100%;}
.sec2 .inner .bot .list li .txt{text-align: center; transition: 0.625s; position: absolute; width: 100%; bottom: -47.5%; background: transparent;}
.sec2 .inner .bot .list li:hover .txt{background: linear-gradient(to bottom, transparent, #07b4e7, #0068b7);}
.sec2 .inner .bot .list li:hover .txt{position: absolute; bottom: 0;}
.sec2 .inner .bot .list li .txt .t_txt{padding-top: 70px;}
.sec2 .inner .bot .list li .txt .t_txt h3{font-size: 30px; font-weight: 800; margin-bottom: 7px; transition: .4s;}
.sec2 .inner .bot .list li:hover .txt .t_txt h3{color: #fff;}
.sec2 .inner .bot .list li .txt .t_txt h4{font-family: 'Play', serif; font-size: 14px; opacity: 0.4; transition: .4s;}
.sec2 .inner .bot .list li:hover .txt .t_txt h4{ color: #fff;}
.sec2 .inner .bot .list li .txt .b_txt{font-size: 18px; font-weight: 500; line-height: 1.8em; color: #fff; opacity: 0; transition: .4s; padding-bottom: 70px;}
.sec2 .inner .bot .list li:hover .txt .b_txt{opacity: 1;}
.sec2 .inner .bot .list li .txt .b_txt::before{content: ''; display: block; width: 1px; height: 34px; margin-left: auto; margin-right: auto; background-color: #fff; margin-top: 22px; margin-bottom: 22px;}
.sec2 .inner .bot .list li .txt .b_txt p{}

@media all and (max-width:1280px){
	.sec2{padding: 90px 0;}
	.sec2 .inner .top{margin-bottom: 60px;}
	.sec2 .inner .top .l_cont .m_txt.flex{gap:20px;}
	.sec2 .inner .top .r_cont .arrow_box .arrow img{max-width: 56px;}
	.sec2 .inner .bot .list li{margin-right: 25px; height: 400px;}
	.sec2 .inner .bot .list li .img img{max-width: 440px;}
	.sec2 .inner .bot .list li .txt{bottom: -44.5%;}
	.sec2 .inner .bot .list li .txt .t_txt h3{font-size: 27px;}
	.sec2 .inner .bot .list li .txt .b_txt{font-size: 17px; line-height: 1.7em;}
	.sec2 .inner .bot .list li .txt .b_txt::before{height: 30px; margin-top: 18px; margin-bottom: 18px;}
}
@media all and (max-width:1024px){
	.sec2 .inner .top{margin-bottom: 55px;}
	.sec2 .inner .top .l_cont .m_txt.flex{flex-direction: column; align-items: flex-start; gap:0;}
	.sec2 .inner .bot .list li{margin-right: 22px; height: 350px;}
	.sec2 .inner .bot .list li .img img{max-width: 400px;}
	.sec2 .inner .bot .list li .txt{bottom: -44.5%;}
	.sec2 .inner .bot .list li .txt .t_txt h3{font-size: 25px;}
	.sec2 .inner .bot .list li .txt .b_txt{padding-bottom: 40px;}
	.sec2 .inner .bot .list li .txt .b_txt::before{height: 28px; margin-top: 17px; margin-bottom: 17px;}
}
@media all and (max-width:768px){
	.sec2{padding: 140px 0 80px;}
	.sec2 .inner{width: 100%;}
	.sec2 .inner .top{margin-bottom: 50px; padding-left: 3%; padding-right: 3%;}
	.sec2 .inner .top .r_cont .arrow_box{display: none;}
	.sec2 .inner .bot{width: 100%;}
	.sec2 .inner .bot .list li{margin-right: 16px; height: 320px;}
	.sec2 .inner .bot .list li .img img{max-width: 360px;}
	.sec2 .inner .bot .list li .txt{bottom: -44.5%;}
	.sec2 .inner .bot .list li .txt .t_txt h3{font-size: 23px;}
	.sec2 .inner .bot .list li .txt .b_txt{font-size: 16px; line-height: 1.6em;}
	.sec2 .inner .bot .list li .txt .b_txt::before{height: 25px; margin-top: 15px; margin-bottom: 15px;}
	.sec2 .inner .bot .list li.slick-current .txt{background: linear-gradient(to bottom, transparent, #07b4e7, #02b2e6);}
	.sec2 .inner .bot .list li.slick-current .txt{position: absolute; bottom: 0;}
	.sec2 .inner .bot .list li.slick-current .txt .t_txt h3{color: #fff;}
	.sec2 .inner .bot .list li.slick-current .txt .t_txt h4{ color: #fff;}
	.sec2 .inner .bot .list li.slick-current .txt .b_txt{opacity: 1;}
}
@media all and (max-width:480px){
	.sec2 .inner .top{margin-bottom: 40px;}
	.sec2 .inner .top .m_txt p br{display: none;}
	.sec2 .inner .bot .list li{margin-right: 14px; height: 300px;}
	.sec2 .inner .bot .list li .img img{max-width: 270px;}
	.sec2 .inner .bot .list li .txt{bottom: -42.5%;}
	.sec2 .inner .bot .list li .txt .t_txt h3{font-size: 23px;}
	.sec2 .inner .bot .list li .txt .b_txt{font-size: 16px; line-height: 1.6em;}
	.sec2 .inner .bot .list li .txt .b_txt::before{height: 25px; margin-top: 15px; margin-bottom: 15px;}
}


/* sec3 */
.sec3{background: url(/images/main/sec3_bg.webp) no-repeat center center / cover; padding: 150px 0;}
.sec3 .inner{}
.sec3 .inner .m_txt{text-align: center;}
.sec3 .inner .cont{margin-top: 60px;}
.sec3 .inner .cont .box{display: flex;}
.sec3 .inner .cont .box .video{width: 920px;  height:519px; position: relative;}
.sec3 .inner .cont .box .video video{width: 100%;}
.sec3 .inner .cont .box .img{width: 920px; position: relative;}
.sec3 .inner .cont .box .img img{ width:100%}
.sec3 .inner .cont .box .video .play{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); cursor: pointer; z-index: 2;}
.sec3 .inner .cont .box .video .play img{max-width: 100%;}
.sec3 .inner .cont .box .txt{width: calc(100% - 920px); background: #0068b7 url('/images/main/sec3_txtbg.png') no-repeat  left top; background-size:cover;  padding: 120px 80px; position: relative; display: flex; flex-direction: column; justify-content: space-between;}
.sec3 .inner .cont .box .txt > .num{position: absolute; right: 60px; top: 60px; font-family: 'Play', serif; font-size: 120px; color: #fff; opacity: 0.15; line-height: 1em; font-weight: 700;}
.sec3 .inner .cont .box .txt .tit{}
.sec3 .inner .cont .box .txt .tit h4{font-family: 'Play', serif; font-size: 14px; color: #fff; opacity: 0.4; margin-bottom: 15px;}
.sec3 .inner .cont .box .txt .tit h3{font-size: 36px; color: #fff; font-weight: 800; margin-bottom: 40px;}
.sec3 .inner .cont .box .txt .tit p{font-size: 17px; font-weight: 500; color: #fff; line-height: 1.6em;}
.sec3 .inner .cont .box .txt .arrows{display: flex; align-items: center; gap:28px;}
.sec3 .inner .cont .box .txt .arrows .arrow{cursor: pointer;}
.sec3 .inner .cont .box .txt .arrows .arrow.prev{}
.sec3 .inner .cont .box .txt .arrows .arrow.next{}
.sec3 .inner .cont .box .txt .arrows .arrow img{}
.sec3 .inner .cont .box .txt .arrows .num{color: rgba(255,255,255,0.5); font-size: 16px; font-weight: 600; }
.sec3 .inner .cont .box .txt .arrows .num b{color: #FFF; font-weight: 800;}
.sec3 .inner .cont .box .txt .arrows .num span{ font-weight: 800; }

@media all and (max-width:1600px){
	.sec3{padding: 120px 0;}
	.sec3 .inner .cont .box .txt{padding: 60px 80px;}
	.sec3 .inner .cont .box .txt .tit h3{margin-bottom: 30px;}
	.sec3 .inner .cont .box .txt .tit p br{display: none;}
	.sec3 .inner .cont .box .txt .arrows{margin-top: 40px;}
}
@media all and (max-width:1399px){
	.sec3 .inner .cont .box .video {width: 800px;  height:450px;}
	.sec3 .inner .cont .box .txt {width: calc(100% - 800px);}

	.sec3 .inner .cont .box .img{width: 800px; }
}
@media all and (max-width:1280px){
	.sec3{padding: 100px 0;}
	.sec3 .inner .cont{margin-top: 50px;}
	.sec3 .inner .cont .box .video{width: 60%; height:32vw}
	.sec3 .inner .cont .box .video .play img{max-width: 85px;}
	.sec3 .inner .cont .box .video video{height: 100%; object-fit: cover;}
	.sec3 .inner .cont .box .img{width: 60%;}
	.sec3 .inner .cont .box .img img {height: 100%; object-fit: cover;}
	.sec3 .inner .cont .box .txt{padding: 50px 60px; width: 40%;}
	.sec3 .inner .cont .box .txt > .num{right: 40px; top: 40px; font-size: 100px;}
	.sec3 .inner .cont .box .txt .tit h3{font-size: 32px; margin-bottom: 20px;}
	.sec3 .inner .cont .box .txt .tit p{font-size: 16px;}
}
@media all and (max-width:1024px){
	.sec3{padding: 90px 0;}
	.sec3 .inner .cont{margin-top: 45px;}
	.sec3 .inner .cont .box .video .play img{max-width: 80px;}
	.sec3 .inner .cont .box .txt{padding: 40px 50px;}
	.sec3 .inner .cont .box .txt > .num{right: 30px; top: 30px; font-size: 72px;}
	.sec3 .inner .cont .box .txt .tit h3{font-size: 27px; margin-bottom: 16px;}
	.sec3 .inner .cont .box .txt .tit p{font-size: 16px;}
	.sec3 .inner .cont .box .txt .arrows{margin-top: 60px;}
}
@media all and (max-width:768px){
	.sec3{padding: 80px 0;}
	.sec3 .inner .m_txt{text-align: left;}
	.sec3 .inner .m_txt h3 br{display: none;}
	.sec3 .inner .cont .box{flex-direction: column-reverse; gap:0;}
	.sec3 .inner .cont .box .txt{width: 100%; padding: 30px;}
	.sec3 .inner .cont .box .txt .tit h3{font-size: 24px;}
	.sec3 .inner .cont .box .txt > .num{right: 25px; top: 25px; font-size: 60px;}
	.sec3 .inner .cont .box .video{width: 100%;  height:53vw}
	.sec3 .inner .cont .box .video .play img{max-width: 76px;}
	.sec3 .inner .cont .box .img{width: 100%;}
	.sec3 .inner .cont .box .txt .arrows{margin-top: 45px; gap:20px;}
	.sec3 .inner .cont .box .txt .arrows .num{font-size: 15px;}
	.sec3 .inner .cont .box .txt .arrows .arrow img{max-width: 40px;}
}
@media all and (max-width:768px){
	.sec3{padding: 70px 0;}
	.sec3 .inner .cont{margin-top: 40px;}
	.sec3 .inner .cont .box .txt{padding: 25px;}
	.sec3 .inner .cont .box .txt .tit h3{font-size: 22px;}
	.sec3 .inner .cont .box .txt > .num{right: 20px; top: 20px; font-size: 48px;}
	.sec3 .inner .cont .box .txt .tit p{font-size: 15px;}
	.sec3 .inner .cont .box .video{width: 100%;}
	.sec3 .inner .cont .box .video .play img{max-width: 64px;}
	.sec3 .inner .cont .box .img{width: 100%;}
	.sec3 .inner .cont .box .txt .arrows{margin-top: 45px; gap:20px;}
	.sec3 .inner .cont .box .txt .arrows .num{font-size: 14px;}
	.sec3 .inner .cont .box .txt .arrows .arrow img{max-width: 37px;}
}


/* sec4 */
@keyframes arrow{
	0%{top: 0;}
	100%{top: 12px;}
}
.sec4{padding: 150px 0;}
.sec4 .inner{display: flex; align-items: flex-start;}
.sec4 .inner .l_cont{width: 47.5%; padding-top: 0px; top: 180px; position: sticky;}
.sec4 .inner .l_cont .m_txt{}
.sec4 .inner .l_cont .scroll{margin-top: 150px; display: flex; flex-direction: column;}
.sec4 .inner .l_cont .scroll .arrow{}
.sec4 .inner .l_cont .scroll .arrow .box{width: 10px; height: 16px; margin-bottom: 8px; text-align: center; overflow: hidden;display: flex; flex-direction: column; justify-content: flex-end;}
.sec4 .inner .l_cont .scroll .arrow .box img{max-width: 100%; animation: arrow 1s infinite; position: relative;}
.sec4 .inner .l_cont .scroll .arrow p{}
.sec4 .inner .l_cont .scroll .arrow p img{}
.sec4 .inner .r_cont{width: 52.5%; display: grid; grid-template-columns: repeat(2, 1fr);}
.sec4 .inner .r_cont .box{max-width: 380px; width: 100%; position: relative;}
.sec4 .inner .r_cont .box.box1{}
.sec4 .inner .r_cont .box.box2{top: 140px; margin-left: auto;}
.sec4 .inner .r_cont .box.box3{margin-top: 120px;}
.sec4 .inner .r_cont .box .img{width: 100%; height: 460px; position: relative;}
.sec4 .inner .r_cont .box.box1 .img{background: url(/images/main/sec4_img1.webp) no-repeat center center / cover;}
.sec4 .inner .r_cont .box.box2 .img{background: url(/images/main/sec4_img2.webp) no-repeat center center / cover;}
.sec4 .inner .r_cont .box.box3 .img{background: url(/images/main/sec4_img3.webp) no-repeat center center / cover;}
.sec4 .inner .r_cont .box .img .list{position: absolute; right: 20px; bottom: 30px; display: flex; flex-direction: column; gap:5px;}
.sec4 .inner .r_cont .box .img .list li{position: relative;}
.sec4 .inner .r_cont .box .img .list li a{display: block; width: 200px; font-size: 18px; font-weight: 600; color: #fff; padding: 14px 20px; background: rgba(0,0,0,0.4); border-radius: 25px; transition: .4s;}
.sec4 .inner .r_cont .box .img .list li:hover a{background-color: #06b0d5;}
.sec4 .inner .r_cont .box .img .list li a span{position: absolute; right: 20px; top: 50%; transform: translateY(-50%); display: inline-flex; align-items: center;}
.sec4 .inner .r_cont .box .txt{margin-top: 30px;}
.sec4 .inner .r_cont .box .txt h3{font-size: 36px; font-weight: 800;}
.sec4 .inner .r_cont .box .txt h3 span{font-size: 14px; opacity: 0.3;}
.sec4 .inner .r_cont .box .txt p {font-size: 17px; font-weight: 500; color: #777777; line-height: 1.6em; margin-top: 25px;}

@media all and (max-width:1600px){
	.sec4{padding: 120px 0;}
	.sec4 .inner .l_cont{width: 42.5%;}
	.sec4 .inner .r_cont{width: 57.5%;}
	.sec4 .inner .r_cont .box.box2{margin-left: 30px;}
}
@media all and (max-width:1280px){
	.sec4{padding: 100px 0;}
	.sec4 .inner .l_cont{top: 140px;}
	.sec4 .inner .l_cont .scroll{margin-top: 120px;}
	.sec4 .inner .r_cont .box.box2{top: 170px;}
	.sec4 .inner .r_cont .box.box3{margin-top: 90px;}
	.sec4 .inner .r_cont .box .img{height: 420px;}
	.sec4 .inner .r_cont .box .img .list li a{width: 180px; font-size: 17px; padding: 12px 17px;}
	.sec4 .inner .r_cont .box .txt{margin-top: 25px;}
	.sec4 .inner .r_cont .box .txt h3{font-size: 32px;}
	.sec4 .inner .r_cont .box .txt h3 span{font-size: 13px;}
	.sec4 .inner .r_cont .box .txt p{font-size: 16px; margin-top: 20px;}
}
@media all and (max-width:1024px){
	.sec4{padding: 90px 0;}
	.sec4 .inner .l_cont{padding-right: 40px; width: calc(100% - 44%);}
	.sec4 .inner .l_cont .m_txt h3 br{display: none;}
	.sec4 .inner .r_cont{gap:40px 20px; grid-template-columns: repeat(1, 1fr); width: 44%;}
	.sec4 .inner .r_cont .box .img{height: 400px;}
	.sec4 .inner .r_cont .box .img .list{right: 20px; bottom: 25px;}
	.sec4 .inner .r_cont .box .img .list li a{width: 170px; font-size: 16px; padding: 10px 15px;}
	.sec4 .inner .r_cont .box.box2{margin-left: 0; top: 0;}
	.sec4 .inner .r_cont .box.box3{margin-top: 0;}
	.sec4 .inner .r_cont .box .txt h3{font-size: 28px; display: flex; flex-direction: column; gap:4px;}
	.sec4 .inner .r_cont .box .txt p{margin-top: 15px;}
	.sec4 .inner .r_cont .box .txt p br{display: none;}
}
@media all and (max-width:768px){
	.sec4{padding: 80px 0;}
	.sec4 .inner{flex-direction: column;}
	.sec4 .inner .l_cont{position: static; width: 100%; margin-bottom: 40px;}
	.sec4 .inner .l_cont .scroll{display: none;}
	.sec4 .inner .r_cont{gap:0px 25px; grid-template-columns: repeat(2, 1fr); width: 44%; width: 100%;}
	.sec4 .inner .r_cont .box .img{height: 60vw;}
	.sec4 .inner .r_cont .box .img .list{right: 10px; bottom: 15px;}
	.sec4 .inner .r_cont .box .img .list li a{width: 160px; font-size: 15px; padding: 8px 12px;}
	.sec4 .inner .r_cont .box.box2{top: 190px;}
	.sec4 .inner .r_cont .box.box3{margin-top: 60px;}
	.sec4 .inner .r_cont .box .txt{margin-top: 20px;}
	.sec4 .inner .r_cont .box .txt h3{font-size: 24px;}
	.sec4 .inner .r_cont .box .txt p{font-size: 15px; margin-top: 16px;}
}
@media all and (max-width:480px){
	.sec4{padding: 70px 0;}
	.sec4 .inner .r_cont{gap:40px 20px; grid-template-columns: repeat(1, 1fr);}
	.sec4 .inner .r_cont .box.box2{top: 0px;}
	.sec4 .inner .r_cont .box.box3{margin-top: 0px;}
	.sec4 .inner .r_cont .box .img{height: 100vw;}
	.sec4 .inner .r_cont .box .txt{margin-top: 16px;}
	.sec4 .inner .r_cont .box .txt h3{font-size: 22px;}
	.sec4 .inner .r_cont .box .txt p{margin-top: 12px;}
}


/* sec5 */
.sec5{padding: 150px 0; background: url(/images/main/sec5_bg.webp) no-repeat center center / cover; text-align: center;}
.sec5 .m_txt{}
.sec5 .partner_box{margin-top: 70px;}
.sec5 .partner_box .list{}
.sec5 .partner_box .list.list1{}
.sec5 .partner_box .list.list2{margin-top: 20px;}
.sec5 .partner_box .list .swiper-wrapper {transition-timing-function: linear !important;}
.sec5 .partner_box .list .swiper-slide{max-width: 230px; margin-right: 20px;}
.sec5 .partner_box .more{}
.sec5 .more{margin-top: 80px;}
.sec5 .more .btn{padding: 20px 28px; line-height: 1em; display: inline-flex; font-size: 16px; font-weight: 700; border:1px solid #222222; border-radius: 30px; align-items: center; gap:0 56px;}
.sec5 .more .btn span{height: 12px;}
.sec5 .more .btn span img{max-width: 100%;}
.sec5 br.mo{display: none}

@media all and (max-width:1600px){
	.sec5{padding: 120px 0;}
}
@media all and (max-width:1280px){
	.sec5{padding: 100px 0;}
	.sec5 .partner_box{margin-top: 60px;}
	.sec5 .more{margin-top: 70px;}
	.sec5 .more .btn{padding: 18px 26px; gap:0 50px;}
	.sec5 .partner_box .list .swiper-slide{max-width: 210px;}
	.sec5 .partner_box .list .swiper-slide img{max-width: 100%;}
}
@media all and (max-width:1024px){
	.sec5{padding: 90px 0;}
	.sec5 .partner_box{margin-top: 50px;}
	.sec5 .more{margin-top: 60px;}
	.sec5 .partner_box .list .swiper-slide{max-width: 180px;}
}
@media all and (max-width:768px){
	.sec5{padding: 80px 0;}
	.sec5 .m_txt{text-align: left; padding-left: 3%; padding-right: 3%;}
	.sec5 .partner_box{margin-top: 45px;}
	.sec5 .more{margin-top: 55px;}
	.sec5 .more .btn{padding: 16px 24px; gap:0 37px; font-size: 15px;}
	.sec5 .partner_box .list .swiper-slide{max-width: 160px;}
	.sec5 br.mo{display: block}
}
@media all and (max-width:480px){
	.sec5{padding: 70px 0;}
	.sec5 .partner_box{margin-top: 40px;}
	.sec5 .more{margin-top: 50px;}
	.sec5 .more .btn{padding: 14px 22px; gap:0 33px; }
	.sec5 .partner_box .list .swiper-slide{max-width: 140px;}
}


/* sec6 */
.sec6{display: flex;}
.sec6 .cont{width: 50%; height: 400px; padding: 0 8.3333333%; background-repeat: no-repeat; background-size: cover; background-position: center center;}
.sec6 .cont.l_cont{background-image: url(/images/main/sec6_bg1.webp);}
.sec6 .cont.r_cont{background-image: url(/images/main/sec6_bg2.webp);}
.sec6 .cont .txt{padding-top: 70px;}
.sec6 .cont .txt h3{font-size: 45px; font-weight: 300; color: #fff; margin-bottom: 20px;}
.sec6 .cont .txt h3 span{font-weight: 700;}
.sec6 .cont .txt p{font-size: 17px; font-weight: 500; color: #fff; line-height: 1.6em;}
.sec6 .cont .txt a.more{margin-top: 50px; display: inline-flex; width: 70px; height: 70px; border-radius: 100%; justify-content: center; align-items: center; border: 1px solid #fff;}
.sec6 .cont .txt a.more img{max-width:100%;}

@media all and (max-width:1600px){
	.sec6 .cont{padding: 0 5%;}
}
@media all and (max-width:1280px){
	.sec6 .cont{height: 370px;}
	.sec6 .cont .txt h3{font-size: 40px;}
	.sec6 .cont .txt p{font-size: 16px;}
	.sec6 .cont .txt p br{display: none;}
	.sec6 .cont .txt a.more{margin-top: 40px; width: 64px; height: 64px;}
}
@media all and (max-width:1024px){
	.sec6 .cont{height: 350px;}
	.sec6 .cont .txt{padding-top: 60px;}
	.sec6 .cont .txt h3{font-size: 36px;}
	.sec6 .cont .txt a.more{margin-top: 35px; width: 60px; height: 60px;}
}
@media all and (max-width:768px){
	.sec6{flex-direction: column;}
	.sec6 .cont{width: 100%; height: auto; padding: 50px 3%;}
	.sec6 .cont .txt{padding-top: 0;}
	.sec6 .cont .txt h3{font-size: 32px;}
	.sec6 .cont .txt p{font-size: 15px;}
	.sec6 .cont .txt a.more{margin-top: 32px; width: 56px; height: 56px;}
}
@media all and (max-width:480px){
	.sec6 .cont{width: 100%; height: auto; padding: 40px 3%;}
	.sec6 .cont .txt h3{font-size: 27px;}
	.sec6 .cont .txt a.more{margin-top: 28px; width: 52px; height: 52px;}
}