.inner{width: 1400px; margin: 0 auto; }


html, body {-ms-overflow-style: none; /* IE and Edge */scrollbar-width: none; /* Firefox */}
.swiper-slide {-ms-overflow-style: none; /* IE and Edge */scrollbar-width: none; /* Firefox */}
.swiper-slide::-webkit-scrollbar, .swiper-slide::-webkit-scrollbar {display: none; /* Chrome, Safari, Opera*/}
/* #main{height: 100%} */


#main .visual {position: relative;}
#main .visual .video_wrap {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#main .visual video {width: 100%; height: 100%; object-fit: cover;}
#main .visual .txt_wrap {width: 100%; height: 100%; max-width: 1600px; margin: 0 auto; display: flex; justify-content: flex-end; align-items: flex-end; flex-direction: column; padding: 0 0 150px; text-align: right; }
#main .visual .txt_wrap h2 {color: #fff; font-size: 5rem; font-weight: 600; transform: translateY(-50px); opacity: 0; margin-bottom: 20px; text-shadow: 2px 2px 10px rgba(0,0,0,0.3);}
#main .visual .txt_wrap p {color: #fff; font-size: 2rem; font-weight: 600; transform: translateY(-50px); opacity: 0;}
#main .visual .txt_wrap.on h2, 
#main .visual .txt_wrap.on p {transform: translateY(0); transition: all 0.8s; opacity: 1;}
#main .visual .main-pagination {font-size: 0; width: auto; gap: 20px 0; display: flex; align-items: center; flex-direction: column; left: 60px; bottom: 150px;}
#main .visual .main-pagination .swiper-pagination-current {color: #fff; font-size: 2rem; font-weight: 600;}
#main .visual .main-pagination .swiper-pagination-current:after {content:''; display: block; width: 1px; height: 27px; background-color: #fff; opacity: 0.8; position: absolute; top: 44px; left: 9px;}
#main .visual .main-pagination .swiper-pagination-total {color: #fff; opacity: 0.5; font-size: 1.8rem; font-weight: 500;}
#main .main_menu { padding: 60px 0;}
#main .main_menu .card_wrap {display: flex; align-items: center; justify-content: center; margin-bottom: 60px;}
#main .main_menu .card_wrap .card {background-color: #6eb86b; width: 320px; height: 280px; }
#main .main_menu .card_wrap .card:nth-child(even) {background-color: #20a7c4;}
#main .main_menu .card_wrap .card:last-child {margin-right: 0;}
#main .main_menu .card_wrap .card a {display: flex; align-items: center; justify-content: center; flex-direction: column; color: #fff; width: 100%; height: 100%; font-size: 1.6rem; font-weight: 600;}
#main .main_menu .card_wrap .card img {height: 70px; width: auto; margin-top: 20px;}
#main .main_menu .box_wrap {display: flex; align-items: center; justify-content: center; max-width: 1000px; margin: 0 auto;}
#main .main_menu .box_wrap .box {position: relative; width: 33.33%; border-right: 1px solid #ccc;}
#main .main_menu .box_wrap .box:last-child {border-right: 0;}
#main .main_menu .box_wrap .box:after {content: ''; display: block; width: 28px; height: 28px; position: absolute; right: 30px; top: -5px; background-image: url('/img/right_arrow_light.png'); background-repeat: no-repeat; background-size: contain;}
#main .main_menu .box_wrap .box:hover:after {animation:arr_move 1s infinite ease-out normal;}
#main .main_menu .box_wrap a {display: block; width: 100%; height: 100%; padding: 0 30px; box-sizing: border-box; position: relative;}
#main .main_menu .box_wrap h3 {font-size: 1.5rem; margin-bottom: 20px; font-weight: 600;}
#main .main_menu .box_wrap p {font-size: 1.2rem; font-weight: 500;}
@keyframes arr_move {
    0% {
        right:30px;
        opacity:1;
    }
    50%{
        opacity:0.4;
    }
    100% {
        right:10px;
        opacity:0;
    }
}