@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-family: 'jalnan';
    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 */


/* section2 */
.section2{
    padding: 5.20vw 0;
    width: 70.31vw;
    margin: 0 auto;
}
.section2 .map{
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid #ddd;
    width: 100%;
    height: 29.58vw;
    margin-bottom: 5.20vw;
}
.section2 .map .wrap_map{
    width: 100%;
    height: 100%;
}
.section2 .map .root_daum_roughmap{
    width: 100%;
    height: 100%;
}
.section2 .info{
    width: 100%;
    display: flex;
    border-top: 1px solid #153F91;
    border-bottom: 1px solid #153F91;
    margin-bottom: 5.20vw;
}
.section2 .info ul:nth-child(1){
    font-family: 'jalnan';
    width: 15%;
    background-color: #F6F6F6;
}
.section2 .info ul:nth-child(1) li{
    height: 2.60vw;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.04vw;
    font-weight: 500;

}
.section2 .info ul:nth-child(1) li:nth-child(1){
    border-bottom: 1px solid #153F91;
}
.section2 .info ul:nth-child(2){
    width: 85%;
}
.section2 .info ul:nth-child(2) li{
    height: 2.60vw;
    display: flex;
    align-items: center;
    padding-left: 3vw;
    font-size: 0.93vw;
    font-weight: 500;
}
.section2 .info ul:nth-child(2) li:nth-child(1){
    border-bottom: 1px solid #153F91;
}
.section2 .way .box{
    width: 100%;
    border-bottom: 1px solid #153F91;
    display: flex;
    margin-bottom: 2.08vw;
    padding-bottom: 2.08vw;
}
.section2 .way .box:last-child{
    margin-bottom: 0;
    padding-bottom: 0;
    border: 0;
}
.section2 .way .box figure{
    width: 4.16vw;
    height: 4.16vw;
    margin-right: 1.56vw;
    transition: 1s;
}
.section2 .way .box:hover figure{
    transform: scale(1.1);
}
.section2 .way .box figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.section2 .way .box .text h1{
    font-family: 'jalnan';
    margin-top: 0.3vw;
    font-size: 1.30vw;
    padding-bottom: 0.78vw;
    position: relative;
    margin-bottom: 1.56vw;
    font-weight: 500;
}
.section2 .way .box .text h1::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 10.41vw;
    height: 4px;
    background-color: #153F91;
}
.section2 .way .box .text .num{
    display: flex;
    margin-bottom: 1.04vw;
    align-items: center;
}
.section2 .way .box .text .num ul{
    display: flex;
    margin-right: 1.04vw;
}
.section2 .way .box .text .num ul li{
    width: 3.64vw;
    height: 1.30vw;
    margin-right: 0.78vw;
    background-color: #3AB449;
    color: #fff;
    border-radius: 0.65vw;
    display: flex;
    align-items: center;
    justify-content: center;
}
.section2 .way .box .text .num ul li:last-child{
    margin-right: 0;
}
.section2 .way .box .text .num p{
    font-size: 0.93vw;
}
.section2 .way .box .text .num p span{
    font-size: 0.72vw;
    color: #979595;
}
.section2 .way .box:nth-child(2) .text .num ul li:nth-child(n+4){
    width: 5.64vw;
}
.section2 .way .box .text > p{
    line-height: normal;
    font-weight: 500;
}
.section2 .way .box:last-child .text > p {
    font-size: 0.93vw;
    line-height: 2;
}
.section2 .way .box:last-child .text > p span{
    font-size: 0.83vw;
}
/* section2 */



/* section3 */
.section3.mobile{
    display: none;
}
.section3{
    width: 100%;
    height: 50vw;
    position: relative;
}
.section3 .bg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.section3 .bg figure{
    width: 100%;
    height: 100%;
}
.section3 .bg figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.section3 .inner{
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
}
.section3 .inner > div{
    width: calc(100% / 2);
    height: 100%;
}
.section3 .inner .left{
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    
}
.section3 .inner .left > h1{
    font-size: 2.08vw;
    line-height: 1.75;
    font-weight: 600;
    padding-bottom: 1.56vw;
    margin-bottom: 2.08vw;
    border-bottom: 1px solid #153F91;
    width: 80%;
}
.section3 .inner .left > h1 p {
    color: #153F91;
    display: inline-block;
}
.section3 .inner .left > h1 p span{
    color: #1191D0;
}
.section3 .inner .left .table{
    display: none;
    padding-bottom: 2.08vw;
    border-bottom: 1px solid #153F91;
    margin-bottom: 2.08vw;
}
.section3 .inner .left .table h1{
    font-family: 'jalnan';
    font-size: 2.08vw;
    margin-bottom: 2.44vw;
}
.section3 .inner .left .table .cont ul{
    width: 100%;
    display: flex;
    height: 3.125vw;
}
.section3 .inner .left .table .cont ul li{
    height: 100%;
    width: calc(100% / 7);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.56vw;
}
.section3 .inner .left .table .cont ul:nth-child(1) li{
    color: #fff;
    background-color: #153F91;
    border-right: 1px solid #fff;
}
.section3 .inner .left .table .cont ul:nth-child(1) li:last-child{
    border-right: 0;
}
.section3 .inner .left .table .cont ul:nth-child(2) li:nth-child(1){
    background-color: #1191D0;
    border-top: 1px solid #fff;
    color: #fff;
}
.section3 .inner .left .table .cont ul:nth-child(3) li:nth-child(1){
    background-color: #1191D0;
    border-top: 1px solid #fff;
    color: #fff;

}
.section3 .inner .left .table .cont ul:nth-child(2) li:nth-child(n+2){
    border-right: 1px solid #C7C7C7;
    border-bottom: 1px solid #C7C7C7;
}
.section3 .inner .left .table .cont ul:nth-child(2) li:last-child{
    border-right: 0;
}
.section3 .inner .left .table .cont ul:nth-child(3) li:nth-child(n+2){
    border-right: 1px solid #C7C7C7;
}
.section3 .inner .left .table .cont ul:nth-child(3) li:last-child{
    border-right: 0;
}
.section3 .inner .left .call{
    display: flex;
    width: 80%;
    justify-content: space-between;
}
.section3 .inner .left .call>ul{
}
.section3 .inner .left .call>ul li:nth-child(1){
    font-family: 'jalnan';
    font-size: 2.08vw;
    margin-bottom: 1.56vw;
}
.section3 .inner .left .call>ul li:nth-child(2){
    font-size: 2.60vw;
    color: #153F91;
}
.section3 .inner .right{
    background-color: #0000009d;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;

}
.section3 .inner .right .box h1{
    font-family: 'jalnan';
    font-size: 2.08vw;
    font-weight: 700;
    margin-bottom: 2.60vw;
    text-align: center;
}
.section3 .inner .right .box .time{
    display: flex;
}
.section3 .inner .right .box .time ul:nth-child(1){
    margin-right: 1.56vw;
}
.section3 .inner .right .box .time ul:nth-child(1) li{
    display: flex;
    justify-content: space-between;
}

.section3 .inner .right .box .time ul li{
    font-size: 1.30vw;
    margin-bottom: 1.56vw;
}
.section3 .inner .right .box .time ul li:last-child{
    margin-bottom: 0;
}
.section3 .inner .right .box > span{
    display: block;
    margin-top: 2vw;
    text-align: center;
}
/* section3 */




/* 반응형 */
@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;
    }
    /* section1 */


    /* section2 */
    .section2{
        padding: 100px 0;
        width: 100%;
    }
    .section2 > .map{
        width: calc(100% - 40px);
        height: calc(100vw - 40px);
        margin: 0 auto;
        margin-bottom: 10vw;
    }
    .section2 .map .root_daum_roughmap .wrap_map{
        height: 100% !important;
    }
    .section2 .map .root_daum_roughmap .wrap_map .map{
        width: 100%;
        height: 100%;
    }
    .section2 .info{
        padding: 0 20px;
        border: none;
        margin-bottom: 20vw;
    }
    .section2 .info ul:nth-child(1){
        border-bottom: 1px solid #153F91;
        width: 30%;
    }
    .section2 .info ul:nth-child(1) li{
        font-size: 3.2vw;

        height: 6vw;
    }
    .section2 .info ul:nth-child(2) li{
        font-size: 3.2vw;

        height: 6vw;
    }
    .section2 .info ul:nth-child(1) li:nth-child(1){
        border-top: 1px solid #153F91;
    }
    .section2 .info ul:nth-child(2) li:nth-child(1){
        border-top: 1px solid #153F91;
    }
    .section2 .info ul:nth-child(2){
        width: 70%;
        border-bottom: 1px solid #153F91;

    }
    .section2 .way .box .text{
        width: calc(100% - 10vw);
    }
    .section2 .way{
        padding: 0 20px;
    }
    .section2 .way .box{
        margin-bottom: 10vw;
        padding-bottom: 10vw;
    }
    .section2 .way .box figure{
        width: 10vw;
        height: 10vw;
    }
    .section2 .way .box .text h1{
        font-size: 4vw;
        margin: 1.2vw 0 3vw;
        line-height: normal;
        padding-bottom: 2vw;
    }
    .section2 .way .box .text h1::after{
        height: 1px;
        width: 30vw;
    }
    .section2 .way .box .text .num ul{
        margin-right: 2vw;
    }
    .section2 .way .box .text .num ul li{
        width: 10vw;
        height: 4vw;
        border-radius: 3.65vw;
        font-size: 2.8vw;
    }
    .section2 .way .box .text .num p{
        font-size: 2.8vw;
    }
    .section2 .way .box .text .num{
        margin-bottom: 2vw;
    }
    .section2 .way .box:nth-child(2) .text .num{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    .section2 .way .box:nth-child(2) .text .num ul li:nth-child(n+4){
        width: 16.64vw;
    }
    .section2 .way .box:nth-child(2) .text .num ul{
        margin-bottom: 2vw;
    }
    .section2 .way .box .text > p{
        font-size: 2.8vw
    }
    .section2 .way .box .text .num p span{
        font-size: 2.5vw;
    }
    .section2 .way .box:last-child .text > p{
        font-size: 2.8vw;
    }
    .section2 .way .box:last-child .text > p span{
        font-size: 2.8vw;
    }
    /* section2 */




    /* section3 */
    .section3.mobile{
        display: block;
    }
    .section3.pc{
        display: none;
    }
    .section3{
        height: max-content;
    }
    .section3 .inner{
        flex-direction: column;
    }
    .section3 .inner > div{
        width: 100%;
        height: 100vw;
    }
    .section3 .inner .left{
        position: relative;
        height: 100vw;
        border-top: 1px solid #153F91;
        
    }
    .section3 .inner .left .bg{
        position: absolute;
        top: 0;
        right: -100%;
        left: unset;
        width: 200%;
        height: 100%;
    }
    .section3 .inner .left > h1{
        text-align: center;
        font-size: 5vw;
        line-height: 1.6;
        padding-bottom: 6vw;
        margin-bottom: 6vw;
    }
    .section3 .inner .left .table{
        position: relative;
    }
    .section3 .inner .left .table h1{
        text-align: center;
        font-size: 5vw;
        margin-bottom: 6vw;
    }
    .section3 .inner .left .table .cont ul{
        height: 5vw;
    }
    .section3 .inner .left .table .cont ul li{
        font-size: 2.5vw;
    }
    .section3 .inner .left .table{
        border-bottom: none;
        padding-bottom: 0;
        margin-bottom: 5vw;
    }
    .section3 .inner .left .call{
        position: relative;
        flex-direction: column;
        align-items: center;
    }
    .section3 .inner .left .call>ul{
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 2vw;
    }
    .section3 .inner .left .call>ul:last-child{
        margin-bottom: 0;
    }
    .section3 .inner .left .call>ul li{
        
    }
    .section3 .inner .left .call>ul li:nth-child(1){
        font-size: 4vw;
        margin-right: 2vw;
        margin-bottom: 0;
    }
    .section3 .inner .left .call>ul li:nth-child(2){
        font-size: 5vw;
    }
    .section3 .inner .right{
        position: relative;
        height: 100vw;
    }
    .section3 .inner .right .bg{
        position: absolute;
        top: 0;
        left: -100%;
        width: 200%;
        height: 100%;
    }
    .section3 .inner .right .box{
        position: relative;
    }
    .section3 .inner .right .box .time{
        justify-content: center;
    }
    .section3 .inner .right .box h1{
        font-size: 5vw;
        margin-bottom: 10vw;
    }
    .section3 .inner .right .box .time ul:nth-child(1){
        margin-right: 6vw;
    }
    .section3 .inner .right .box .time ul li{
        font-size: 4vw;
        margin-bottom: 6vw;
    }
    .section3 .inner .right .box > span{
        font-size: 4vw;
        margin-top: 8vw;
    }
    /* section3 */
}   
/* 반응형 */