.about .section10 .wrap{
    display: flex;
    justify-content: space-between;
    padding-bottom: clamp(100px, 10vw, 180px);
}
.about .section10 .ps-name{
    height: auto;
    text-transform: uppercase;
}
.about .section10 .ps-name p{
    position: sticky;
    top: clamp(0px, 15vw, 300px);
}
.about .section10 .about-ps{
    width: clamp(0px,58vw,1100px);
    display: grid;
    grid-template-columns: 100%;
    row-gap: clamp(154px, 15vw, 286px);
}
.about .section10 .day,
.about .section10 .night{
    position: relative;
}
.about .section10 .img{
    width: 100%;
    aspect-ratio: 110/54;
}
.about .section10 .title{
    position: absolute;
    font-family: var(--e-deco-font-1);
    font-size: 8.8rem;
    top: -130px;
    right: 0;
    z-index: 1;
    color: var(--color-4);
}
.about .section10 .subject{
    padding-top: 40px;
    padding-bottom: 40px;
}
.about .section10 .content{
    font-family: var(--k-main-font-1);
    line-height: 2;
}
.about .section20{
    background-color: var(--color-2);
    padding-top: clamp(0px, 13vw, 240px);
    padding-bottom: clamp(0px, 13vw, 240px);
}
.about .section20 .wrap {
    display: flex;
    justify-content: space-between;
}
.about .section20 .title{
    grid-area: title;
}
.about .section20 .title h2{
}
.about .section20 .title p{
    font-family: var(--k-main-font-1);
    font-size: 1rem;
    padding-top: clamp(20px, 2vw, 34px);
    padding-bottom: clamp(39px, 3.5vw, 60px);
}
.about .section20 .title a{
    font-size: var(--f-size-2);
    display: inline-block;
    padding: 9px 30px;
    background-color: #fff;
    transition: all .5s;
}
.about .section20 .title a:hover{
    background-color: var(--color-8);
    color: #fff;
}
.about .section20 .content{
    grid-area: content;
    width: clamp(0px, 53vw, 1000px);
    height: clamp(300px, 40vw, 600px);
}
.about .section20 .content iframe{
    width: 100%;
    height: 100%;
    border: none;
}

@media(width < 1400px){
}
@media(width < 1024px){
    .about .section10 .wrap{
        padding-top: 150px;
    }
    .about .section10 .about-ps{
        width: 100%;
    }
    .about .section10 .ps-name{
        display: none;
    }
    .about .section20 .wrap {
        flex-direction: column-reverse;
    }
    .about .section10 .title{
        font-size: 8rem;
        top: -104px;
    }
    .about .section10 .img{
        aspect-ratio: 35/30;
    }
    .about .section10 .content{
        font-weight: 300;
    }
    .about .section20{
        padding-top: 56px;
        padding-bottom: 56px;
    }
    .about .section20 .content{
        width: 100%;
    }
    .about .section20 .title{
        padding-top: 30px;
    }
    .about .section20 .title p{
        font-weight: 300;
    }
    .about .section20 .title a{
        padding: 9px 15px;
    }
}
@media(width < 768px){
    .about .section10 .title{
        font-size: 4.5rem;
        top: -53px;
    }
}
@media(width < 576px){
}
/*************************************************/
.about .section50 .wrap{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 100vh;
    gap: clamp(30px,5vw,50px);
}
.about .section50 .tour-page-typo2 p{
    word-break: auto-phrase !important;
}
.about .section50 figure{
    width: 100%;
    margin: 0;
}
.about .section50 figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.about .section50 .tour-page-typo-wrapper{
    text-align: right;
    align-self: center;
    display: flex;
    flex-direction: column;
    gap: 45px;
}
.about .section60 .tour-content{
    border-top: 1px solid var(--color-1);
    padding-top: 50px;
    padding-bottom: 50px;
}
.about .section60 .tour-content:last-child{
    border-bottom: 1px solid var(--color-1);
}
.tour-item-wrapper{
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    align-items: center;
    gap: 50px;
}

.tour-typo1{
    text-align: center;
}

.tour-typo2 .address{
    margin-bottom: 10px;
}
.tour-item-wrapper img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.tour-image-item{
    height: 100%
}
@media(width < 1400px){
}
@media(width < 1024px){
    .about .section50 .wrap{
        grid-template-columns: 1fr;
        grid-template-rows: 1fr auto;
    }
    .tour-item-wrapper{
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr auto;
    }
}
@media(width < 768px){
}
@media(width < 576px){
}
/***********************************************/
.room-preview .section10{
    padding-top: clamp(60px, 14vw, 150px);
}
.room-preview .section10 .wrap{
    display: grid;
    grid-template-columns: 1fr;
    position: relative;
}
.room-preview .section10 .img{
    position: relative;
    /*overflow: hidden;*/
}
.room-preview .section10 img{
    width: 100%;
    height: clamp(170px, 25vw,450px);
    cursor: pointer;
}
.room-preview .section10 .text{
    display: flex;
    justify-content: space-between;
    padding-top: clamp(30px, 2vw, 35px);
    gap: 25px;
}
.room-preview .section10 .title{
    cursor: pointer;
}
.room-preview .section10 .tag{
    display: flex;
    gap: clamp(2px, .5vw, 10px);
}
.room-preview .section10 .tag span{
    display: inline-block;
    height: max-content;
    padding: clamp(5px, .6vw ,9px)  clamp(12px, 2vw ,39px);
    border: 1px solid #D9D9D9;
    border-radius: 50px;
    font-size: var(--f-size-2);
    word-break: keep-all;
    margin-left: 0;
    margin-right: 0;
    cursor: pointer;
    transition: all .3s;
}
.room-preview .section10 .tag span:hover{
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);
}
.room-preview .section10 .deco{
    position: absolute;
    top: -113px;
    right: 0;
    color: var(--color-4);
    font-family: var(--e-deco-font-1);
    font-size: 7.5rem;
    font-weight: 700;
}

@media(width < 1400px){
}
@media(width < 1024px){
    .room-preview .section10 .text{
        flex-direction: column;
    }
    .room-preview .section10 .tag span{
    }
    .room-preview .section10 .deco{
        font-size: 50px;
        top: -50px;
    }
}
@media(width < 768px){
}
@media(width < 576px){
}

/*************************************************/
.room-detail .wrap{
    position: relative;
}
.room .room-detail-content{
    display: grid;
    grid-template-columns: 1fr auto;
    position: relative;
    height: auto;
}
.room-detail-text{
    padding-bottom: clamp(42px, 15vw, 300px);
    line-height: 1.8;
}
.room .title{
    margin-bottom: 30px;
}
.room .content{
    line-height: 2;
}
.room .content b{font-weight: 500;}
.room-detail-text-wrap{
    position: sticky;
    top: 15%;
    padding-right: 20px;
}
.room-detail-img{
    width: clamp(0px, 48vw ,920px);
    display: grid;
    grid-template-columns: repeat(2, calc(clamp(0px, 48vw ,920px)/2));
    gap: 20px;
}
.room-detail-img img{
    width: 100%;
    height: clamp(0px, 40vw ,680px);
}
.room-detail-img img:nth-child(3n+1){
    grid-column: span 2;
    width: 100%;
}
.room-detail .deco{
    position: absolute;
    top: -111px;
    right: 0px;
    color: var(--color-4);
    font-family: var(--e-deco-font-1);
    font-size: 7.5rem;
    font-weight: 700;
}
@media(width < 1400px){
}
@media(width < 1024px){
    .preview-section .title,
    .room-detail .title{
        padding-top: 100px;
        padding-bottom: 40px;
        padding-right: 20px;
    }
    .room-detail-img{
        width: 100%;
        grid-template-columns: 50% 50%;
        gap:10px
    }
    .room-detail-img img{
       width: 100%;
    }
    .room-detail-text-wrap{
        top: 25%;
    }
    .room-detail .deco{
        display: none;
    }
    .room .room-detail-content{
        grid-template-columns: 1fr;
    }
    .room .title{
        padding-top: 0;
        padding-bottom: 0;
        margin-bottom: 0;
    }
    .room .content{
        font-weight: 300;
    }
}
@media(width < 768px){
}
@media(width < 576px){
}
/************************************************/
.special img{
    width: 100%;
}
.special .section10 .wrap{
    display: flex;
    justify-content: space-between;
    overflow: hidden;
}
.special .section10 .title{
    line-height: 1.3;
}
.special .section10 .content li{
    text-align: right;
}
.special .section10 .content a{
    display: inline-block;
    padding-left: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    font-family: var(--k-main-font-1);
    color: var(--color-4);
    transition: all .3s;
    word-break: keep-all;
}
.special .section10 .content a::after{
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: var(--color-4);
    transform: scaleX(0);
    transition: all .3s;
}
.special .section10 .content a.active{
    color: var(--color-8);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.special .section10 .content a:not(.active):hover::after{
    transform: scaleX(1);
}
.special .section20 .deco{
    position: absolute;
    bottom: -88px;
    right: 0px;
    color: var(--color-4);
    font-family: var(--e-deco-font-1);
    font-size: 7.5rem;
    font-weight: 700;
}
.special .section20 .img{
    position: relative;
    aspect-ratio: 154/90;
}
.special .section20 img{
    width: 100%;
    height: 100%;
}
.special .section-wrap{
    display: flex;
}
.special .section30 .wrap{
    padding-right: clamp(125px, 9vw, 172px);
    padding-top: clamp(85px, 19vw, 350px);
    position: relative;
}
.special .section30 .img{
    position: relative;
    aspect-ratio: 1/1;
    padding-bottom: clamp(0px, 12vw ,60px );
}
.special .section30 img{
    width: 100%;
    height: 100%;
}
.special .section30 .title{
    margin-bottom: clamp(30px, 1.5vw,30px);
}
.special .section30 .content{
    line-height: 1.5;
}
.special .section30 .deco{
    position: absolute;
    top: -120px;
    right: -129px;
}
.special .section30 .deco text{
    font-size: 1rem;
    font-family: var(--k-main-font-1);
}
.special .section30 .deco .flower{
    position: absolute;
    top: -20px;
    right: -6px;
}
.special .section40{
    padding-bottom: 0;
}
.special .section40 .wrap{
    padding-top: clamp(85px, 19vw, 350px);
    padding-left: clamp(125px, 9vw, 172px);
}
.special .section40 img{
    aspect-ratio: 3/4;
    padding-bottom: 70px;
}
.special .reserve-btn{
    font-family: var(--k-main-font-2);
    display: inline-block;
    padding: 20px 60px;
    border-radius: 50px;
    border: 1px var(--color-1) solid;
    margin-top: clamp(30px, 8vw,150px);
    font-size: 1.7rem;
    transition: all .3s;
}
.special .reserve-btn:hover{
    box-shadow: 0 2px 10px rgba(0,0,0,0.5);
}
.special .section-wrap{
    padding-bottom: clamp(100px, 10vw, 180px);
}
@media(width < 1400px){
}
@media(width < 1024px){
    .special .section10 .title,
    .special .section30 .title{
        word-break: keep-all;
    }
    .special .section10 .content a{
        padding-top: 5px;
        padding-bottom: 5px;
    }
    .special .section10 .content a:first-child{
        padding-top: 0;
    }
    .special .section20 .wrap{
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .special .section20 .deco {
        font-size: 4rem;
        bottom: -40px;
        right: 0;
    }
    .special .section20 img{
        aspect-ratio: 35/30;
    }
    .special .section30 img{
        aspect-ratio: 1/1;
    }
    .special .section30 .content{
    }
    .special .section40 img{
        aspect-ratio: 26/36;
    }
    .special .section-wrap{
        display: block;
    }
    .special .section40 p{
        /*display: none;*/
    }

    .special .section30 .deco{
        transform: scale(0.5);
        transform-origin: top;
        top: -47px;
        right: -8px;
    }
    .special .section30 .img{
        padding-right: 95px;
        padding-bottom: 30px;

    }
    .special .section30 .deco textPath{
        font-size: 1.2rem;

    }
    .special .reserve-btn{
        display: none;
    }

    .special .section40 img{
        padding-bottom: 30px;
    }

}
@media(width < 768px){
}
@media(width < 576px){
}
 /************************************************/
.reserve .header{
    background-color: unset;
}
.reserve .header.top{
    background-color: var(--color-1);
}
.reserve-info .section10 .wrap{
    padding-top: clamp( 98px, calc( 120px + clamp(0px,3.5vw,67px)), 187px) ;
    padding-left: clamp(0px, 11vw, 188px);
    padding-right: clamp(0px, 11vw, 188px);
}
.reserve-info .section10 .img{
    width: 100%;
    aspect-ratio: 154/92;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.reserve-info .section30 .wrap{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: clamp(0px, 6.5vw, 124px);
    row-gap: clamp(0px, 10vw, 186px);
    grid-template-areas:
            "info notice"
            "refund refund";
}
.reserve-info .section30 .title{
    font-family: var(--k-main-font-2);
    color: var(--color-4);
    font-size: 2rem;
    font-weight: 700;
    padding-bottom: 2px
}
.reserve-info .section30 .content p{
    line-height: 2;
}
.reserve-info .section30 .content>p:nth-child(1){
    font-family: var(--k-main-font-2);
    font-size: 1rem;
    padding-bottom: clamp(0px, 1.5vw, 21px);
}
.reserve-info .section30 .content{
    font-size: var(--f-size-2);
    font-weight: 400;
    padding-top: clamp(30px, 2.5vw, 43px);
    padding-bottom: clamp(30px, 2vw, 40px);
    border-bottom: 1px solid #C1C1C1;
}
.reserve-info .section30 .content:last-child{
    border-bottom: none;
}
.reserve-info .section30 .info{
    grid-area: info;
}
.reserve-info .section30 .notice{
    grid-area: notice;
}
.reserve-info .section30 .refund{
    grid-area: refund;
}
.reserve-info .section30 .refund table{
    width: 100%;
}
.reserve-info .section30 .refund td{
    text-align: center;
    padding-top: clamp(0px, 1.5vw, 29px);
    padding-bottom: clamp(0px, 1.5vw, 29px);
}
.reserve-info .section30 .refund td p{
    padding-bottom: 0;
}
.reserve-info .section30 .refund tr:nth-child(1) td{
    background-color: var(--color-4);
    border-right: white 1px solid;
}
.reserve-info .section30 .refund tr:nth-child(2) td{
    border-right: 1px solid var(--color-4);
}
.reserve-info .section30 .refund tr:nth-child(2) td:last-child{
    border-right: none;
}
@media(width < 1400px){
}
@media(width < 1024px){
    .reserve .header .logo img{
        filter : none;
    }
    .reserve .menu-btn span{
        background-color: var(--color-8);
    }
    .reserve .header{
        background-color: unset;
    }
    .reserve .header.top{
        background-color: unset;
    }
    .reserve-info .section10 .img{
        aspect-ratio: 1/1;
    }
    .reserve-info .section20 .wrap {
    }
    .reserve-info .section30 .wrap{
        display: block;
    }
    .reserve-info .notice,
    .reserve-info .refund{
        padding-top: 100px;
    }
    .reserve-info .section30 .content{
        font-weight: 400;
    }
    .reserve-info .section30 .refund table{
        width: calc(100% + 60px);
        transform: translateX(-30px);
    }
}
@media(width < 768px){
}
@media(width < 400px){
    .rsv_cal_t{
        display: grid;
        grid-template-areas: "tit tit" "prv next";
    }
    .prv{
        grid-area: prv;
    }
    .next{
        grid-area: next;
        margin-left: auto;
    }
    #tit{
        grid-area: tit;
        font-size: 10px !important;
    }
}