﻿
.main_visual {height: 100vh;position: relative;}	
.main_slide {width: 100%;height: 100%;}
.owl-stage-outer,.owl-stage,.owl-item {height: 100%;} 
.main_banner {width: 100%;height: 100%;background-repeat: no-repeat;-webkit-background-size: cover;background-size: cover;background-position: center center;}
.main_banner.banner1 {background-image: url("/resources/img/main/main_bg1.jpg?v=2");}
.main_banner.banner2 {background-image: url("/resources/img/main/main_bg2.jpg");}
.main_banner.banner3 {background-image: url("/resources/img/main/main_bg3.jpg?v=1");}
.main_banner.banner4 {background-image: url("/resources/img/main/main_bg4.jpg?v=1");}
.main_banner.banner5 {background-image: url("/resources/img/main/main_bg5.jpg");}

.banner_cont {position: absolute;left: 0;top: 0;width: 100%;height: 100%;display: flex;align-items: center;z-index: 10;}
.banner_txt {color: #FFF;font-family: "Montserrat";font-size: 70px;font-weight: 700;}
.banner_nav {margin-bottom: 30px;display: flex;align-items: center;gap: 20px;}
.banner_counter span {font-weight: 700;color: #fff;font-size: 20px;font-family: "Montserrat";}

.banner_menu_wrap {position: absolute;left: 0;bottom: 0;width: 100%;padding: 50px 0;background-color: rgb(0 0 0 / 50%);z-index: 10;}
.banner_menu {display: flex;align-items: center; justify-content: center;gap: 90px;position: relative;padding: 0 20px;}
.banner_menu li a {opacity: 0.4;}
.banner_menu li.on a,
.banner_menu li a:hover {opacity: 1;}

.main_section {background-color: #000;}
.section_div {width: 100%;height: 100%;display: flex;}
.section_div > div {width: 50%;}
.section_right img {display: block;object-fit: cover; width: 100%; height: 100%;}

.section_cont_flex {display: flex;align-items: center; justify-content: center;width: 100%;height: 100%;max-width: 600px;margin: 0 auto 0 auto;}
.section_cont .logo {margin-bottom: 30px;}
.section_cont .tit {font-size: 56px;font-weight: 800;color: #fff;margin-bottom: 50px;}
.section_cont .txt {font-size: 20px;font-weight: 500;color: #fff;margin-bottom: 80px;line-height: 1.5;} 
.section_cont .btn {display: inline-flex;padding: 20px 30px;align-items: center;gap: 20px;border-radius: 30px;border: 2px solid #FFF;isolation: isolate;transition: background-color 350ms ease;position: relative;overflow: hidden;}
.section_cont .btn span {font-size: 16px;font-weight: 700;font-family: "Montserrat";color: #fff;position: relative;z-index: 2;}
.section_cont .btn img {position: relative;z-index: 2;}
.section_cont .btn:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50px;
    overflow: hidden;
    isolation: isolate;
    z-index: 2;
    box-sizing: border-box;
}
.section_cont .btn:after {
    content: "";
    position: absolute;
    width: 140%;
    height: 140%;
    border-radius: 50%;
    top: -20%;
    left: -20%;
    transform: translateY(87%);
    background-color: #FFFFFF;
    transition: transform 350ms cubic-bezier(0.165, 0.84, 0.44, 1);
    z-index: 1;
	 background-color: #fff;
}
.section_cont .btn:hover:after{transform: translateY(0);}
.section_cont .btn:hover span {color: #000;}
.section_cont .btn:hover img {filter: invert(100%);}

#fp-nav.left {left: 60px;}
#fp-nav ul li a {width: 10px;height: 10px;}
#fp-nav ul li a span, .fp-slidesNav ul li a span {width: 10px;height: 10px;background-color: #fff;opacity: 0.5;}
#fp-nav ul li a.active span, .fp-slidesNav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li:hover a.active span {width: 10px;height: 10px;margin: -2px 0px 0px -2px;opacity: 1;}
#fp-nav ul li:hover a span, .fp-slidesNav ul li:hover a span {margin: -2px 0 0 -2px;}

@media (max-width: 1560px) {
	#fp-nav.left {left: 20px;}
}
@media (max-width: 1499px) {
	.section_cont .tit {font-size: 50px;}
	.banner_menu {gap: 50px;}
}

@media (max-width: 1429px) {

}
@media (max-width: 1399px) {
	.banner_txt {font-size: 50px;}
	.banner_menu {gap: 30px;}
	#fp-nav.left {left: 10px;}
	.section_cont .tit {font-size: 40px;}
	.section_cont_flex {max-width: 500px;}
}
@media (max-width: 1259px) {
	.banner_nav {margin-left: 30px;}
	.banner_txt {margin-left: 30px;}
	.banner_menu img {width: 200px;}
}
@media (max-width: 1200px) {

}
@media (max-width: 1219px) {
	.banner_menu {gap: 20px;}
	.banner_menu img {width: 175px;}
	.section_cont .tit {font-size: 30px;}
	.section_cont .txt {font-size: 18px;}
	.section_cont_flex {max-width: 400px;}
}

@media (max-width: 991px) {
	.banner_counter span {font-size: 16px;}
	.banner_nav {margin-bottom: 15px;gap: 10px;}
	.banner_txt {font-size: 40px;}
	.banner_menu img {width: 130px;}
	.section_cont .logo img {width: 50%;}
	.section_cont .logo {margin-bottom: 15px;}
	.section_cont .tit {margin-bottom: 25px;}
	.section_cont .txt {font-size: 16px;margin-bottom: 40px;}
	.section_cont .btn span {font-size: 14px;}
	.section_cont_flex {max-width: 300px;}
	#fp-nav.left {left: 5px;}
	.section_div {flex-direction: column;}
	.section_div > div {width: 100%;height: 50%;}
	.section_cont_flex {max-width: 700px;}
	.section_cont .tit {font-size: 25px;}
	.section_cont .logo img {width: auto;}
}

@media (max-width: 767px) {
	#fp-nav.left {display: none;}
	.banner_menu {flex-direction: column;gap: 15px;}
	.banner_menu_wrap {padding: 20px 0;}
	.banner_nav {margin-left: 0;}
	.banner_txt {margin-left: 0;font-size: 30px;}
	.section_cont .tit {font-size: 20px;margin-bottom: 15px;}
	.section_cont .txt {font-size: 14px;margin-bottom: 20px;}
	.section_cont .btn {padding: 15px 20px;gap: 10px;}
	.section_cont_flex {max-width: 100%;padding: 0 14px;}
	.section_cont .logo img {width: 50%;}
}

@media (max-width: 575px) {
	.banner_txt {font-size: 25px;padding-bottom: 50px;}
}