@charset "utf-8";

.main-visual {position: relative; width: 100%;}
.main-visual .main-slide .item {position: relative; width: 100%; height: 100vh;}
.main-visual .main-slide .img-box {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover; transform: scale(1.1); z-index: 1;}
.main-visual .main-slide .item:nth-child(1) .img-box {background-image: url('../img/main/main-visual01.jpg');}
.main-visual .main-slide .item:nth-child(2) .img-box {background-image: url('../img/main/main-visual02.jpg');}
.main-visual .main-slide .item:nth-child(3) .img-box {background-image: url('../img/main/main-visual03.jpg');}
.main-visual .item.slick-active .img-box {transform: scale(1); transition: all 3.5s;}
.main-visual .text-slide {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 1480px; width: 100%; padding: 0 20px; z-index: 5;}
.main-visual .text-slide .item {height: 100%; padding-top: 30px;}
.main-visual .text-slide .text-box {height: 100%; margin-top: 30px;}
.main-visual .text-slide .text-box h2 {font-size: 70px; font-weight: 100; line-height: 1.46em; color: #000;}
.main-visual .text-slide .text-box h2 .bold {font-weight: 700;}
.main-visual .text-slide .text-box h2 .blue {color: #2260FC; font-weight: 700;}
.main-visual .text-slide .slick-active .text-box h2 {animation: text-up 0.6s both 0.5s;}
@keyframes text-up {
    0% {
        filter: blur(5px);
        transform: translateY(-60px);
        opacity: 0;
    }

    100% {
        filter: blur(0);
        transform: translateY(0);
        opacity: 1;
    }
}

.main-visual .paging {display: flex; align-items: center; gap: 22px; margin-top: 110px;}
.main-visual .slick-dots {display: flex; gap: 14px;}
.main-visual .slick-dots button {position: relative; width: 72px; height: 7px; border-radius: 6px; border: 1px solid #2260FC; background: none; font-size: 0; transition: all 0.5s;}
.main-visual .slick-dots button:after {position: absolute; top: 0; left: 0; content: ''; width: 0; height: 100%; background: #2260FC;}
.main-visual .slick-dots .slick-active button:after {width: 100%; transition: all 3s;}
.main-visual .page-info {font-size: 15px; font-weight: 600; line-height: 1em; color: #2260FC;}
.main-visual .item.slick-active .text-box h2 {animation: text-up 1.5s both 0.5s;}

.m-section01 {height: 100vh; background: #2260FC; clip-path: circle(2% at 50% 50%); margin-bottom: 150px;}
.m-section01 .wrap {display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; height: 100%;}
.m-section01 .img-box {margin-bottom: 70px;}
.m-section01 .text-box p {font-size: 23px; font-weight: 600; line-height: 1.82em; color: #fff;} 

.m-section02 {position: relative; padding-top: 100px;}
.m-section02 .card-stack {position: relative; height: 100vh;}
.m-section02 .card {position: absolute; top: 0; left: 0; width: 100%; padding: 54px 65px; border: 1px solid #2260FC; background: #F3F6FF; border-radius: 30px 30px 0 0; box-shadow: 0 14px 0 0 #2260FC;}
.m-section02 .card .inner {display: flex; align-items: center; gap: 70px;}
.m-section02 .card .img-box {width: 49.5%;}
.m-section02 .card .text-box {display: flex; justify-content: space-between; width: 50.5%; margin-top: 45px;}
.m-section02 .card .text-box .text {max-width: 391px; width: 100%; padding-right: 10px;}
.m-section02 .card04 .text-box .text {max-width: 420px;}
.m-section02 .card .text-box h3 {font-size: 35px; font-weight: 600; line-height: normal; color: #000; margin-bottom: 62px;}
.m-section02 .card .text-box .sub-title {font-size: 23px; font-weight: 600; line-height: 1.82em; color: #2260FC; margin-bottom: 12px;}
.m-section02 .card .text-box .details {font-size: 20px; font-weight: 400; line-height: 1.79em; color: #666;}
.m-section02 .card .text-box .details .bold {font-weight: 600; color: #000; letter-spacing: -0.4px;}
.m-section02 .card .text-box .btn {max-width: 90px; width: 100%; margin-top: 124px;}
.btn-more {display: flex; justify-content: center; align-items: center; width: 90px; height: 90px; border-radius: 50%; border: 1px solid #2260FC; transition: all 0.5s;}
.btn-more:hover {background: #2260FC;}
.m-section02 .card .text-box .btn-more:hover img {filter: brightness(100); transition: all 0.5s;}
.m-section02 .card .slide-box {width: 1%; flex: 1 1 auto;}
.m-section02 .card .slide-box .items {margin: 0 -20px;}
.m-section02 .card .slide-box .item {padding: 0 20px;}
.m-section02 .card .slide-box .item a {position: relative;}
.m-section02 .card .slide-box .item a img {transition: all 0.6s;}
.m-section02 .card .slide-box .item a:hover img {opacity: 0.75; filter: blur(1.5px);}
.m-section02 .card .slide-box .item .item-text {position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 24px 27px;}
.m-section02 .card .slide-box .item .item-text .branch-name {font-size: 24px; font-weight: 800; line-height: normal; letter-spacing: -0.48px; color: #f2f2f2; margin-bottom: 2px;}
.m-section02 .card .slide-box .item .item-text .station-distance {font-size: 18px; font-weight: 600; line-height: normal; color: #f2f2f2;}
.m-section02 .card02 .text-box {display: block; max-width: 190px; width: 100%;} 
.m-section02 .card02 .text-box h3 {margin-bottom: 98px;}
.m-section02 .card .slick-arrow {width: 60px; height: 60px; border-radius: 50%; border: 1px solid #2260FC; background: transparent; font-size: 0; transition: all 0.5s;}
.m-section02 .card .slick-prev {background: url('../img/main/btn-slide-prev.png') no-repeat center center; margin-right: 23px;}
.m-section02 .card .slick-next {background: url('../img/main/btn-slide-next.png') no-repeat center center;}
.m-section02 .card .slick-prev:hover {background: #2260FC url('../img/main/btn-slide-prev-active.png') no-repeat center center;}
.m-section02 .card .slick-next:hover {background: #2260FC url('../img/main/btn-slide-next-active.png') no-repeat center center;}

.m-section03 {background: url('../img/main/section03_bg.jpg') no-repeat center center / cover; height: 100%; padding: 200px 0 400px;}
.m-section03 .wrap {display: flex; align-items: flex-start; gap: 125px;}
.m-section03 .title-box {position: sticky; top: 300px; max-width: 400px; width: 100%;}
.title-box h3 {font-size: 70px; font-weight: 700; line-height: 1.46em; color: #fff;}
.title-box p {font-size: 23px; font-weight: 600; line-height: 1.82em; color: #fff; margin-top: 20px;}
.btn-more-white {border: 1px solid #fff;}
.btn-more-white:hover {background: rgba(255,255,255,0.3);}
.m-section03 .btn-more-white {margin-top: 72px;}
.m-section03 .cont-box {width: 1%; flex: 1 1 auto; padding-right: 73px;}
.m-section03 .slick-list {overflow: visible;}
.m-section03 .cont-box .slide-items {display: flex; flex-wrap: wrap; margin: -24px -26px;}
.m-section03 .cont-box .slide-item {width: 50%; padding: 24px 26px;}
.m-section03 .cont-box .slide-item:nth-child(odd) {transform: translateY(210px);}
.m-section03 .cont-box .slide-item a {background: #fff; border-radius: 20px; padding: 45px 28px 55px 28px; transition: all 0.5s;}
.m-section03 .cont-box .img-box {margin-bottom: 53px;}
.m-section03 .cont-box .pic {position:relative; height:0; padding-bottom:53.53%; border-radius: 5px; overflow:hidden; transition:all 0.6s;}
.m-section03 .cont-box .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.6s;}
.m-section03 .cont-box a:hover .pic img {transform: translateY(-50%) scale(1.1);}
.m-section03 .cont-box .text-box .cate {display: inline-block; font-size: 16px; font-weight: 600; line-height: normal; color: #fff; background: #2260FC; padding: 4px 10px; margin-bottom: 20px;}
.m-section03 .cont-box .text-box .title {font-size: 20px; font-weight: 600; line-height: 1.54em; letter-spacing: -0.4px; color: #000; height:calc(1.54em * 1 * 2); overflow:hidden; text-overflow:ellipsis; word-break:break-all; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; margin-bottom: 44px;}
.m-section03 .cont-box .text-box .date {font-size: 14px; font-weight: 400; line-height: 1.47em; letter-spacing: -0.28px; color: #666;}
.m-section03 .cont-box .slick-dots {display: flex; justify-content: center; margin-top: 10px; gap: 10px;}
.m-section03 .cont-box .slick-dots li button {display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgba(255,255,255,0.5); font-size: 0; border: 0; transition: all 0.5s;}
.m-section03 .cont-box .slick-dots .slick-active button {background: #fff}

.m-section04 {padding: 156px 0 224px;}
.m-section04 .title-box h3 {color: #000; margin-bottom: 90px;}
.m-section04 .cont-box .wrap {display: flex; gap: 56px;}
.m-section04 .contact-box {width: 49.6%;}
.m-section04 .contact-box ul {display: flex; background: url('../img/main/section04-contact-bg.jpg') no-repeat center center/cover;}
.m-section04 .contact-box ul li {width: 33.3333%;}
.m-section04 .contact-box ul li a {display: flex; flex-direction: column; justify-content: space-between; height: 100%; padding: 73px 10px; text-align: center;}
.m-section04 .contact-box ul li .icon {margin-bottom: 18px; transition: all 0.5s;}
.m-section04 .contact-box ul li a:hover .icon {transform: translateY(-12px);}
/* .m-section04 .contact-box ul li .img {padding-top: 11px;} */
.m-section04 .contact-box ul li .title {font-size: 23px; font-weight: 600; line-height: 1.82em; color: #fff; margin-bottom: 16px;}
.m-section04 .contact-box ul li .details {font-size: 14px; line-height: 1.47em; letter-spacing: -0.28px; color: #fff;}
.m-section04 .contact-box ul li .arrow {margin-top: 37px;}
.m-section04 .catalogue-box {display: flex; flex-direction: column; justify-content: space-between; width: 50.4%; background: url('../img/main/section04-catalog-bg.jpg') no-repeat center center/cover; padding: 37px 70px 50px;} 
.m-section04 .catalogue-box .title {font-size: 35px; font-weight: 600; line-height: normal; color: #fff; margin-bottom: 8px;}
.m-section04 .catalogue-box .details {font-size: 14px; line-height: 1.47em; letter-spacing: -0.28px; color: #fff;}
.m-section04 .catalogue-box .download ul {display: flex; flex-direction: column; align-items: flex-end; gap: 10px;}
.m-section04 .catalogue-box .download ul li a {display: flex; justify-content: space-between; align-items: center; width: 236px; padding: 8px 46px 8px 50px; border-radius: 3px; border: 1px solid #FFF; background: rgba(0, 0, 0, 0.46); font-size: 16px; font-weight: 600; color: #fff; transition: all 0.3s;}
.m-section04 .catalogue-box .download ul li a:hover {color: #2260FC; background: #fff;}
.m-section04 .catalogue-box .download ul li .icon img {display: block;}
.m-section04 .catalogue-box .download ul li a:hover .icon img {filter: invert(40%) sepia(81%) saturate(6833%) hue-rotate(223deg) brightness(106%) contrast(98%);}