@charset "utf-8";

/* section1 */
.section1{
    margin-top: 5.20vw;
    width: 100vw;
    height: 20.60vw;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.section1 .bg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.section1 .bg figure{
    width: 100%;
    height: 100%;
}
.section1 .bg figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.section1 .text{
    position: relative;
    text-align: center;
    color: #fff
}
.section1 .text p{
    font-size: 0.93vw;
    font-weight: 700;
    letter-spacing: 1.11vw;
}
.section1 .text h1{
    font-size: 2.08vw;
    margin-top: 1.56vw;
    padding-bottom: 2.08vw;
    margin-bottom: 2.08vw;
    position: relative;
    font-weight: 700;
}
.section1 .text h1::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 7.81vw;
    height: 1px;
    background-color: #fff;
}
.section1 .text span{
    font-size: 1.04vw;
}
.section1 .text span br{
    display: none;
}
/* section1 */




/* section2 */
.section2{
    padding: 100px 0;
    width: 90vw;
    margin: 0 auto;
}
.section2 .inner{
    width: 100%;
    display: flex;
    height: 40vw;
    border: 1px solid #c7c7c7;
}
.section2 .inner .menu{
    width: 15%;
    height: 100%;
}
.section2 .inner .menu li{
    width: 100%;
    height: calc(100% / 3);
    background-color: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.30vw;
    border-bottom: 1px solid #c7c7c7;
    cursor: pointer;
}
.section2 .inner .menu li.on{
    background-color: #fff;
    border-left: 5px solid #1191d0;
}
.section2 .inner .menu li:last-child{
    border-bottom: 0;
}
.section2 .inner .cont{
    padding: 1.56vw;
    width: 85%;
}
.section2 .inner .cont .box{
    display: none;
}
.section2 .inner .cont .box.on{
    display: block;
}
.section2 .inner .cont .box table thead tr:nth-child(1){
    height: 2.08vw;
}
.section2 .inner .cont .box table thead tr:nth-child(2){
    height: 5.20vw;
}
.section2 .inner .cont .box table{
    width: 100%;
}
.section2 .inner .cont .box table thead tr th{
    vertical-align: middle;
    line-height: normal;
    background-color: #1191d0;
    border: 1px solid #fff;
    color: #fff;
    font-size: 1.04vw;
}
.section2 .inner .cont .box table tbody tr{
    height: 2.60vw;
}
.section2 .inner .cont .box table tbody tr td{
    text-align: center;
    vertical-align: middle;
    border: 1px solid #c7c7c7;
    line-height: normal;
    font-size: 0.86vw;
}
.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{
    position: static;
    margin-top: 2vw;
}
.swiper-button-next, .swiper-button-prev{
    top: unset;
    bottom: 0;
}
.swiper-button-next:after, .swiper-button-prev:after{
    font-size: 1.04vw;
    color: #1191d0;
}
.swiper-fade .swiper-slide-active{
    opacity: 1 !important;
}
.swiper-slide{
    opacity: 0 !important;
    cursor: pointer;
}
.swiper-pagination-fraction{
    font-size: 1.04vw;
}
.swiper-pagination-current{
    color: #1191d0;
}
/* section2 */




/* 반응형 */
@media screen and (max-width:500px) {
            /* section1 */
            .section1{
                margin-top: 50px;
                height: 80vw;
            }
            .section1 .text p{
                font-size: 2.4vw;
                letter-spacing: 1.92vw;
            }
            .section1 .text h1{
                font-size: 6vw;
                margin-top: 3vw;
                padding-bottom: 4vw;
                margin-bottom: 4vw;
            }
            .section1 .text h1::after{
                width: 20vw;
            }
            .section1 .text span{
                font-size: 3.2vw;
                line-height: 2;
            }
            .section1 .text span br{
                display: block;
            }
    
            /* section1 */



            /* section2 */
            .section2{
                width: 100%;
            }
            .section2 .inner{
                flex-direction: column;
                height: max-content;
            }
            
            .section2 .inner .menu{
                width: 100%;
                display: flex;
            }
            .section2 .inner .menu li{
                width: calc(100% / 3);
                height: 10vw;
                font-size: 3.6vw;
                border-right: 1px solid #c7c7c7;
            }
            .section2 .inner .menu li:last-child{
                border-bottom: 1px solid #c7c7c7;
            }
            .section2 .inner .menu li.on{
                border-left: none;
                border-top:2px solid #1191d0;
            }
            .section2 .inner .cont{
                padding: 50px 0;
                width: 100%;
            }
            .section2 .inner .cont .box table thead tr:nth-child(1){
                height: 10vw;
            }
            .section2 .inner .cont .box table thead tr:nth-child(2){
                height: 20vw;
            }
            .section2 .inner .cont .box table tbody tr{
                height: 10vw;
            }
            .section2 .inner .cont .box table thead tr th{
                font-size: 2.5vw;
            }
            .section2 .inner .cont .box table tbody tr td{
                font-size: 2.3vw;
            }
            .swiper-button-next:after, .swiper-button-prev:after{
                font-size: 4vw;
            }
            .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{
                margin-top: 4vw;
                font-size: 4vw;
            }
            /* section2 */
    
}
/* 반응형 */