@charset "utf-8";
/* 기본설정 */
/* @import "default.css"; */


/* section01 */
* { box-sizing: border-box;}
.section01 {
    width: 100%;
    padding: 140px 0;
    display: flex;
    flex-direction: column;
    position: relative;
    color: #fff;
    background: url(/html/images/tour/tour_bg.jpg) no-repeat center center;
    background-attachment: fixed;
}


.row {
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 14vw;
    position: relative;
}
.row.second, .row.third {
    margin-top: -7.8vw;
}

.box {
    width: 30.83vw;
    height: 30vw;
    position: relative;
    background-size: cover;
    background-position: center;
    
    overflow: hidden;
}
.box  .tour-img {
    border-radius: 51px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
}

/* left는 위, right는 아래로 내려가는 구조 */
.row .left {
    margin-top: 0;
}


.row .right {
    margin-top: 20vw;
}


/* 텍스트 영역 (제목/설명/출처) */
.textWrap {
    width: 100%;
    padding: 20px;
    position: relative;
}


.textWrap h2 {
    font-size: 40px;
    margin: 0 0 10px;
    color: #fff;
}

.textWrap p {
    margin: 0 0 6px;
    font-size: 16px;
}

.textWrap span {
    font-size: 13px;
    position: absolute;
    top: 24px;
    right: 30px;
}

/* 마우스오버 시 view 버튼 텍스트 변경 */
.btn-box {
    width: 93px !important;
}
.btn-box .text02{ 
  display: none;
}
.btn-box:hover span{ 
  display: none;
}
.btn-box:hover .text02{ 
  display: inline;
}

@media(max-width:1400px){
    .box  .tour-img {
        border-radius: 20px;
    }
    .textWrap {
        padding: 13px;
    }
    .textWrap h2 {
        font-size: 30px;
    }

    .textWrap p {
        font-size: 14px;
    }
    .textWrap span { 
        font-size: 11px;
        top: 5px;
        right: 5px;
    }
}
@media(max-width:1024px){
    .box {
        width: 66.66vw;
        height: auto;
        margin-bottom: 40px;
    }
    .row { display: block;}
    .row .right {
        margin-top: 0;
        margin-left: auto;
    }
    .row.second, .row.third {
        margin-top: 0;
    }
    
}
@media(max-width:768px){
    .section01 {
        padding: 110px 0 90px;
    }
    .box {
        margin: 0 15px 20px;
    }
    .textWrap h2 {
        font-size: 5vw;
        margin-bottom: 5px;
        text-decoration: underline;
    }

    .textWrap p {
        font-size: 3.06vw;
    }
    .textWrap span { 
        font-size: 2.22vw;
        top: 5px;
        right: 5px;
    }
    .btn-box {
        width: max-content !important;
    }
}