@charset "utf-8";
/*main_visual*/
.main_visual{position: relative; overflow: hidden; height: 100%;}
.main_visual .swiper-container{height: 100%;}
.main_visual .swiper-slide{position: relative; box-sizing: border-box;}
.main_visual .swiper-slide .bg_box{position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden;}
.main_visual .swiper-slide .bg_box img{width: 100%; height: 100%; object-fit: cover; object-position: center center; max-width: unset; transform: scale(1.5); transition: 3s;}
.main_visual .swiper-slide-active .bg_box img{transform: scale(1);}
.main_visual .swiper-slide .inner{display: flex; align-items: center; height: 100%; z-index: 10;}
.main_visual .swiper-slide .inner.right{justify-content: right;}
.main_visual .swiper-slide .inner.center{justify-content: center; text-align: center;}
.main_visual .swiper-slide .inner .txt_box{opacity: 0; transform: translateY(200px); transition: 3s;}
.main_visual .swiper-slide-active .inner .txt_box{opacity: 1; transform: translateY(0);}
.main_visual .swiper-slide .txt_box p{font-size: var(--fz-52); letter-spacing: 0.1em; line-height: 1.1388; color: #fff;}
/* .main_visual .swiper-slide .txt_box p::first-letter{font-size: var(--fz-72); font-weight: 700;} */
.main_visual .swiper-slide .txt_box h2{font-size: var(--fz-72);letter-spacing: 0; color:#ffffff; line-height: 1.1388; font-weight: 300; position: relative;}
.main_visual .swiper-slide .txt_box h2 span{color: #a9fff5; font-weight: 700;}

.main_visual .scroll_down{position: absolute; bottom: 90px; left: 50%; transform: translateX(-50%); z-index: 10;
}


.mv_logo_tit {
    position: absolute;
    /* bottom: 50%;
    left: 50%;
    transform: translate(-50%,-50%); */
    bottom: 105%;
    left: 0;
    z-index: 20;
    width: 100%;
}


.mv_logo_tit.second_logo {
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
}

.inner  .txt_box h2 .mv_logo_tit p {
    color: #fff;
    font-size: 45px;
    letter-spacing: unset;
}




.main_visual .scroll_down p{font-size: 16px; letter-spacing: 0; font-weight: 500; color:#ffffff;}
.main_visual .scroll_down .circle_box{text-align: center;}
.main_visual .scroll_down .circle_box i{display: block; margin-top:20px; animation: ScrollDown infinite 1.5s linear;}

  @keyframes ScrollDown{
    0% {transform: translateY(0px) }
    50% {transform:translateY(-18px)}
	100% {transform:translateY(0px)}
}

.main_visual .swiper-pagination{left: 0; width: 100px; height: 100%; bottom: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 80px; border-right: 1px solid rgba(255,255,255,.5); box-sizing: border-box;}
.main_visual .swiper-pagination .swiper-pagination-bullet{background-color: rgba(255,255,255,.5); width: 12px; height: 12px; position: relative; transition: .3s;}
.main_visual .swiper-pagination .swiper-pagination-bullet-active:before{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); content: ''; width: calc(100% + 6px); height: calc(100% + 6px); border-radius: 50%; border: 3px solid #fff; box-sizing: border-box;}


@media all and (max-width:1600px){
    .main_visual .swiper-slide .txt_box{padding-left: 100px;}
}

@media all and (max-width:1024px){
    .main_visual .swiper-slide{height: 820px;}
    .main_visual .swiper-slide .inner .txt_box{transform: translateY(100px);}
    .main_visual .swiper-slide-active .inner .txt_box{transform: translateY(0);}
}

@media all and (max-width:768px){
    .main_visual .swiper-slide{height: 100vh;}

    .main_visual .swiper-slide .txt_box{padding-left: 0;}

    .inner  .txt_box h2 .mv_logo_tit p {
        color: #fff;
        font-size: 30px;
        letter-spacing: unset;
    }


    .main_visual .swiper-pagination{height: 60px; width: 100%; flex-direction: row; border-right: none; border-top: 1px solid rgba(255,255,255,.5);}

    .main_visual .swiper-slide .inner{justify-content: center; text-align: center;}
    .main_visual .swiper-slide .inner.right{text-align: left; justify-content: center;}
}


/*main con01*/
.main .con01{background: url(/img/main_con01_bg01.jpg)no-repeat center center / cover;}
.main .con01 .tab_con{width: 100%; display: flex; box-sizing: border-box; height: 100%; flex-wrap: wrap;}
.main .con01 .tab_con > li{width: 33.333%; box-sizing: border-box;  display: flex; align-items: center; height: 100%; position: relative; overflow: hidden;}
.main .con01 .tab_con > li:before{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; opacity: 0; background-position: center center; background-repeat: no-repeat; background-size: cover; transition: .5s; opacity: .3; background-color: var(--bg-color);}
.main .con01 .tab_con > li:hover:before{transform: scale(1.2); background-image:var(--bg); opacity: 1;}
.main .con01 .tab_con > li:hover .in_box .btn_box{display: flex;}
.main .con01 .tab_con > li .in_box{max-width: 180px; width: 100%; margin: 0 auto; position: relative; z-index: 3; display: flex; flex-direction: column;  gap: 40px;}
.main .con01 .tab_con > li .in_box .tit_box p{font-size: var(--fz-42); letter-spacing: 0; font-weight: 700; color:#222222; line-height: 1.238em; text-align: center; white-space: nowrap;}
.main .con01 .tab_con > li:hover .tit_box p{color: #fff;}
.main .con01 .tab_con > li .in_box .btn_box{display: none; flex-wrap: wrap; gap: 20px; transition: .5s; justify-content: center;}
.main .con01 .tab_con > li .in_box .btn_box li{width: 100%; box-sizing: border-box; }
.main .con01 .tab_con > li .in_box .btn_box li a{display: flex; align-items: center; justify-content: center ;text-align: center; border:1px solid #ffffff ; font-size: var(--fz-16); font-weight: 500; letter-spacing: 0; color:#fff; line-height: 1.25em; height: 100%; border-radius: 10px; box-sizing: border-box; width: 100%; transition: .5s; padding: 20px 0; background-color: rgba(0,0,0,.1);}
.main .con01 .tab_con > li .in_box .btn_box li:hover a{background-color: var(--main-color); border-color: var(--main-color);}
@media all and (max-width:1024px){
}

@media all and (max-width:768px){
    .main .con01 .tab_con{height: 1300px;}
    .main .con01 .tab_con > li{height:33.333%; width: 100%;}
}

/*main con02*/
.main .con02{background-image: url(/img/main_con02_bg01.png); background-repeat: no-repeat; background-position: right top -200px; background: linear-gradient(90deg, rgba(249,249,249,1) 50%, rgba(255,255,255,0) 50%);}
.main .con02 .top_wrap{display: flex; justify-content: space-between; flex-wrap: wrap; gap: 30px; align-items: center;}

.main .con02 .bot_wrap{margin-top: 30px;}
.main .con02 .tab_con{display: none; align-items: center; position: relative;}
.main .con02 .tab_con.on{display: flex;}
.main .con02 .bot_wrap .left_box{width: 100%; max-width: 700px;}
.main .con02 .bot_wrap .left_box .swiper-container{max-width: 620px; box-shadow: 15px 26px 49.5px 0.5px rgba(0, 0, 0, 0.1); overflow: hidden; background-color: #fff; border-radius: 20px;}
.main .con02 .bot_wrap .left_box .swiper-slide{text-align: center;}
.main .con02 .bot_wrap .left_box .swiper-slide img{max-width: fit-content; width: 100%; opacity: 0; transition: 1.5s; transform: scale(0);}
.main .con02 .bot_wrap .left_box .swiper-slide-active img{opacity: 1; transform: scale(1);}

.main .con02 .bot_wrap .right_box{width: 100%; max-width: 700px; padding-left: 80px; box-sizing: border-box;}
.main .con02 .bot_wrap .right_box .info_box{display: none;}
.main .con02 .bot_wrap .right_box .info_box.on{display: block;}
.main .con02 .bot_wrap .right_box .tit_box p{font-size: var(--fz-32); color: #222222; letter-spacing: 0; font-weight: 700;}
.main .con02 .bot_wrap .right_box .txt_list{margin-top: 50px;}
.main .con02 .bot_wrap .right_box .txt_list ul li{color: #888888; font-size: 18px; line-height: 1.5555em;}
.main .con02 .bot_wrap .right_box .txt_list .more_btn{margin-top: 70px; }
.main .con02 .bot_wrap .right_box .txt_list .more_btn a{display: flex; flex-direction: column; font-size: 16px; color: var(--main-color); letter-spacing: 0; font-weight: 700; padding: 10px 0;}  
.main .con02 .bot_wrap .right_box .txt_list .more_btn a i{margin-top: -10px; display: inline-block; transition: .3s;}
.main .con02 .bot_wrap .right_box .txt_list .more_btn a:hover i{transform: translateX(30px);}

.main .con02 .swiper_btn_box{position: absolute; right: 0; bottom: 100%; z-index: 3; display: flex;  gap: 10px;}
.main .con02 .swiper_btn_box .swiper_btn{width: 65px; height: 65px; box-sizing: border-box; border-radius: 50%; border: 1px solid #b5b5b5; background-color: #fff; background-repeat: no-repeat; background-position: center center; cursor: pointer; }
.main .con02 .swiper_btn_box .swiper_btn:hover{border-color: var(--main-color);}

.main .con02 .swiper_btn_box .swiper_btn.prev_btn{background-image: url(/img/main_con02_prev02.png);}
.main .con02 .swiper_btn_box .swiper_btn.prev_btn:hover{background-image: url(/img/main_con02_prev01.png);}
.main .con02 .swiper_btn_box .swiper_btn.next_btn{background-image: url(/img/main_con02_next02.png);}
.main .con02 .swiper_btn_box .swiper_btn.next_btn:hover{background-image: url(/img/main_con02_next01.png);}

@media all and (max-width:1024px){
    .main #fullpage .con02{padding: 80px 0;}
    .main .con02{background: linear-gradient(360deg, rgba(249,249,249,1) 40%, rgba(255,255,255,0) 40%);}
    .main .con02 .bot_wrap .left_box .swiper-container{max-width: none;}
    .main .con02 .top_wrap > div{ width: 100%;}
    .main .con02 .main_tit h3 br{display: none;}
    .main .con02 .tab_box ul{margin: 0 auto;}
    .main .con02 .tab_con{flex-wrap: wrap; gap: 30px;}
    .main .con02 .bot_wrap .left_box,
    .main .con02 .bot_wrap .right_box{max-width: none;}
    .main .con02 .bot_wrap .right_box{padding-left: 0;}
    .main .con02 .swiper_btn_box{position: unset; transform: none; flex-direction: row; justify-content: center; width: 100%;}
}

/*main con03*/
.main .con03{ background: url(/img/main_con03_bg01.jpg)no-repeat center center /cover;}
.main .con03 .inner{gap:30px;}
.main .con03 .right_box ul{display: flex; flex-wrap: wrap; gap: 30px;}
.main .con03 .right_box ul li{width: calc(25% - 22.5px); border-radius: 10px; background-color: #fff; box-sizing: border-box; height: 80px; display: flex; align-items: center; justify-content: center;}
.main .con03 .right_box ul li img{max-width: fit-content; width: 100%;}

@media all and (max-width:1200px){
    .main .con03 .inner{ flex-wrap: wrap;}
    .main .con03 .left_box,
    .main .con03 .right_box{max-width: none;}
}

@media all and (max-width:768px){
    .main .con03{padding: 120px 0;}
    .main .con03 .right_box ul li{width: calc(33.333% - 20px);}
}

@media all and (max-width:650px){
    .main .con03 .right_box ul li{width: calc(50% - 15px);}
}

/*main con04*/
.main .con04 .map_box{height: 525px; width: 100%;}
.main .con04 .map_info{position: absolute; right: 60px; top: 50%; transform: translateY(-50%); padding: 30px 50px; background-color: #ffffff; border-radius:10px; z-index: 3; box-shadow: 15px 26px 49.5px 0.5px rgba(0, 0, 0, 0.1);}
.main .con04 .map_info ul li{padding: 30px 0; display: flex; align-items: center;}
.main .con04 .map_info ul li + li{border-top: 1px solid #eeeeee;}
.main .con04 .map_info ul li .tit{display: flex; align-items: center; gap: 10px; min-width: 137px;}
.main .con04 .map_info ul li .tit i{display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; box-sizing: border-box;}
.main .con04 .map_info ul li .tit b{font-size: var(--fz-18); color: var(--black-color); letter-spacing: 0; font-weight: 700;}
.main .con04 .map_info ul li .txt p{font-size: var(--fz-16); color: #666666; letter-spacing: 0;}

@media all and (max-width:1024px){
    .main .con04 .map_box{height: 400px;}
    .main .con04 .map_info{position: unset; transform: none; width: 100%; box-sizing: border-box; margin-top: 30px; padding:0 50px}
    .main .con04 .map_info ul{display: flex; flex-wrap: wrap;}
    .main .con04 .map_info ul li{width: 50%;}
}

@media all and (max-width:768px){
    .main .con04 .map_info ul li{width: 100%;}
}

/* footer */
.footer_width_custom {
    min-width: 205.5px;
}

@media all and (max-width:1024px){
    .footer_width_custom {
        min-width: unset;
    }
}