﻿
/* =========================
    共通
==================================*/

:root{
    --pdd:15px;
    --primary-color:#1D83D7;
    --bg-color:#ebf1fb;
    --border-color:#E0E5ED;
    --medium:18px;
    --gray3:#828282;
    --gray5:#E0E5ED;
}
/* 文字色 */
.nf_text-red{color:#EB5757;}
.nf_text-secondary{color:#FC8C29;}
.nf_text-gray2{color:#4F4F4F;}
.nf_text-gray3{color:#828282;}
.nf_text-gray4{color:#BDBDBD;}
.nf_text-gray5{color:#E0E5ED;}
.nf_text-dark{color:#A16207;}
.nf_text-primary{color:#1D83D7;}

/* =========================
    打消し
==================================*/
body:has(.research_wrap){overflow:hidden;}
body:has(.research_wrap:empty){overflow:inherit;}

html{
      height: -webkit-fill-available;
}
body{
  min-height: 100vh;
  min-height: -webkit-fill-available;
}

html > body {
    min-height: inherit;
    min-width: inherit;
    background: #fff;
}
.phone .content .ThemeGrid_Container {
    padding: 0 !important;
}
body:has(.research_wrap){overflow:hidden;}
body:has(.research_wrap:empty){overflow:inherit;}

/* モーダル */
.modal{padding: 0 !important;}
.modal-wrapper{height:100dvh;}
.modal-top {
    padding: 5px 10px !important;
    border-bottom: 1px solid var(--border-color);
    display: flex !important;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    background: #fff;
    width: 100%;
    z-index: 1;
}
.modal-title {
    font-size: 16px;
    font-weight: bold;
    padding-left: 20px;
}
.modal-close .btn,.modal-close a{border:none !important;}
.modal-content {
    max-height: 100dvh !important;
    padding: 60px 10px 10px !important;
    overflow-y:inherit !important;
    /* position: relative; */
}
.modal-close .btn span{font-size:20px;}
.modal{
    /* position:static !important; */
}

.MainBox{padding:10px;}
.content{position: static !important;}

.checkbox:checked:before, .TableRecords .TableRecords_Header [type="checkbox"]:checked:before {
    background-color: var(--primary-color) !important;
    border: var(--border-size-s) solid var(--primary-color) !important;
}
.Is_Default {
    background-color: var(--primary-color) !important;
}
.MultiHotel_wrap {
    font-size: 14px;
    max-height: 70dvh;
    min-height: 50dvh;
    overflow-y: scroll;
    padding-bottom: 40px;
    display: block;
    padding:10px;
}
.MultiHotel_wrap__inr{display: block;}
.tabs .tabs-content{padding:0 !important;}
.FlightFiter .accordion-item {
    border: none;
    border-bottom-width: none;
    border-bottom:1px solid var(--border-color);
    border-radius: 0 !important;

}
.FlightFiter .accordion-item .accordion-item-header{
    padding: 5px 0;
    font-size: 14px;
    border-radius: 0;
    font-weight: normal;
}
.FlightFiter .accordion-item .accordion-item-icon .fa {
    font-size: 14px;
    width: auto;
    color: var(--gray3);
}
.FlightFiter .accordion-item.is--open {
    border-top:none;
}
.FlightFiter .accordion-item .accordion-item-content.is--expanded{
    padding:0 !important;
}


/* =========================
        条件変更
==================================*/

.nfChange{
    background: var(--bg-color);
    padding: 10px;
    margin-top:0;
}
.nfChange__col2{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.nfChange--left{
    display: block;
    width: calc(100% - 100px);
}
.nfChange--dep{

}
.nfChange--pax{
    font-size:12px;
    color:var(--gray3);
}
.nfChange--btn {
    border: var(--border-color) solid 1px;
    background: #fff;
    width: 95px;
    font-size: 13px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 6px 0;
    border-radius: 4px;
}
.nfChange--input {
    position: relative;
    border: 1px solid var(--border-color);
    padding: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 4px;
    line-height: 1.3;
}
.nfChange__inpcol2{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.nfChange__inpBox{
    width: calc(100% / 2 - 10px);
}
.nf__icon{
    width: 20px;
}
.nfChange--right{
    width:calc(100% - 30px);
}
.nfChange--right-ttl{
    font-size:12px;
    color:var(--gray3);
}
.nf__checkbox_flight{
    display: flex;
    margin:10px 0;
}
.nf__checkbox_flight .checkbox{margin-right:10px;}
.nf__changeBox {
    width: calc(100% - 30px);
    align-items: center;
    display: flex;
    justify-content: space-between;
}
.nf_terms--date-icon{width: 20px;}
.nf_terms--input-box {
    width: calc(100% / 2 - 25px) !important;
}
.nf_terms--input-box2:nth-child(1) {
    border-right: 1px solid var(--border-color);
    width:70%;
}
.nf_terms--input-box2:nth-child(2) {
    width: 30%;
    padding-left: 15px;
}
.after__border{
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 12px;
    padding-bottom: 12px;
}
.nf__changeBox_mb{margin-bottom:12px;}
.nf__checkbox_flight2{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.nf__checkbox_flight2--l{
    width: 60%;
    display: flex;
    align-items: center;
}
.nf__checkbox_flight2--l .checkbox{margin-right: 10px;}
.nf__checkbox_flight2--r{
    width: 40%;
    text-align: right;
    font-size: 12px;
}
.AdRentacar{
    width: 50%;
    margin: 10px 0;
}
.Button.rentCheck {
    border: 2px solid var(--primary-color);
    background: var(--color-blue-lightest) !important;
    color: #222;
}

/* フライト */
.AirPortCond {
    background: var(--bg-color);
    margin: -60px -10px -10px;
    padding: 60px 10px 10px;
    /* overflow-y: scroll; */
    height: 100vh;
}
.AirPortCond:empty {
    height: inherit;
    display: none;
}
.nf__area-box{padding-bottom:100px;}
.AirPortCond--ttl{
    margin: 15px 0 10px;
    font-weight: bold;
}
.AirPortCond--ttl-col2 {
    margin-top: -5px;
    font-weight: bold;
    display: flex;
    align-items: center;
    padding:10px 0;
    justify-content: space-between;
}
.AirPortCond--ttl-col2-name{
    width: calc(100% - 20px);
}
.selMultiHotel .AirPortCond--ttl-col2-name{
    display:block !important;
}
.AirPortCond--ttl-col2-icon {
    padding: 10px;
    position: fixed;
    top: 4px;
    left: 0;
    color: var(--gray3);
    z-index:2;
    transform:translateZ(1px);
}
.selMultiHotel .AirPortCond--ttl-col2-icon{
    position: static;
}
.AirPortCond--ttl-col2-icon .type_selMulti{
    display: none;
}
.selMultiHotel .AirPortCond--ttl-col2-icon .type_selMulti{
    display: block;
}
.selMultiHotel .AirPortCond--ttl-col2-icon .type_term{
    display: none;
}
.modal-wrapper:has(.selMultiHotel) .modal-top{
    display: none !important;
}
.modal-wrapper:has(.selMultiHotel) .modal-content {
    padding: 0 !important;
}
.modal-wrapper:has(.selMultiHotel) .AirPortCond--ttl-col2{
    padding: 10px 10px 0;
    border-bottom: 1px solid var(--border-color);
}
.selMultiHotel .CalendarCond .AirPortCond--ttl-col2-icon,
.selMultiHotel .Area_wrap .AirPortCond--ttl-col2-icon{
    order:1;
}
.selMultiHotel .CalendarCond .AirPortCond--ttl-col2-name,
.selMultiHotel .Area_wrap .AirPortCond--ttl-col2-name{
    order:2;
}
.modal-wrapper:has(.selMultiHotel) .CalendarCond{
    margin:0;
}
.nf_terms-htl--allbtn-wrap{
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 20px;
    margin-bottom: 10px;
}


.AirPortCond__btn {
    background: #fff;
    border: 1px solid var(--border-color);
    text-align: center;
    padding: 10px;
    font-size: 12px;
    border-radius: 8px;
}
.AirPortCond__btn:hover{
    background:var(--primary-color);
    color:#fff;
}
.nf__area-box-cityList{
    background: #fff;
    display: block;
    border-radius: 8px;
    border: 1px solid var(--border-color);
    height: 40dvh;
    overflow-y: scroll;
}
.nf__area-box-city--parent--name:hover,
.nf__area-box-city--children__inr:hover{
    opacity:.6;
    text-decoration: underline;
}
.nf__area-box-city--parent{
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-top:1px solid var(--border-color);
}
.nf__area-box-cityListWrap:first-child .nf__area-box-city--parent{
    border-top:none;
}
.nf__area-box-city--parent--name{
    width: calc(100% - 20px);
    padding: 10px;
}
.nf__area-box-city--parent--icon{
    padding: 10px;
}
.nf__area-box-city--children{
    margin-left: 20px;
    display: block;
}
.nf__area-box-city--children__inr{
    padding: 10px 0 10px 10px;
    border-top: 1px solid var(--border-color);
}

/* カレンダー */
.CalendarCond {
    background: #fff;
    margin: -20px -10px -10px;
    position: relative;
    height: 100dvh;
}
.CalendarCond:empty {
    height: inherit;
    display: none;
}
.nf__htl_bottom_btn{
    display: block;
    background:#fff;
    /* position: -webkit-fixed;
    position: fixed; */
    bottom: 0;
    width: 100%;
    padding: 0 15px 15px;
    border-top: 1px solid var(--border-color);
}
.CalendarCond .CaleenadrTable {
    overflow-y: scroll;
    height: 55dvh;
}


/* 人数 */
.GuestCond{
    margin: -20px 0 0;
    height: 100dvh;
}
.GuestCond:empty {
    height: inherit;
    display: none;
}
.pm_pax--box{
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--border-color);
    padding: 5px 0;
    align-items: center;
}
.pm_pax--box--name{
    width:calc(100% - 20px);
}
.pm_pax--box--icon{
    padding:10px;
}
.pm_pax__box {
    padding: 10px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.pm_pax__box_ttl{
    width: 70%;
}
.pm_pax__box_calc{
    width: 30%;
}
.pm_pax__box_calc__inr{
    display:flex;
    flex-wrap:wrap;
    justify-content: space-between;
    align-items: center;
}
.pm_pax__box_calc__txt{font-size:10px;color:var(--gray3);}
.pm_pax__box_calc__inr .PMBtn,
.pm_pax__box_calc__inr .Number{
    width:calc(100% / 3 -10px);
}
.nf_pax-change_box {
    padding: 0 10px 10px;
    font-size: 14px;
    height: 43vh;
    overflow-y: scroll;
    padding-bottom: 40px;
    -webkit-overflow-scrolling: auto;
}
.nf__pax-room__fix {
    width: 100%;
    /* position: fixed; */
    padding: 10px 0;
    border-top: 1px solid var(--border-color);
    /* bottom: 0; */
    background:#fff;
}
.ann__txt {
    background: #F7F9FC;
    padding: 20px;
    margin: 0px 0 10px;
    font-size: 12px;
}
.nf__pax-room__fix-col2{
    display: flex;
    flex-wrap:wrap;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
}
.nf__pax-room__fix-col2-l{
    font-size: 12px;
    width: 40%;
    color: var(--gray3);
}
.nf__pax-room__fix-col2-r {
    font-size: 12px;
    width: 60%;
    text-align: right;
    display: flex;
    justify-content: space-around;
}
.nf__pax-room__fix-col2-r a {
    font-size: 12px;
    display: block;
    width: calc(100% / 2);
}

/* 目的地 */
.nf__area-box_wrap2{
    margin:10px 0;
}
.nf__area-box-city--parent2{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 10px;
    align-items: center;
    border-top:1px solid var(--border-color);
}
.nf__area-box-city--parent2-check{
    width: 20px;
}
.nf__area-box-city--parent2-check .checkbox{height:20px;}

.nf__area-box-city--parent2-label{
    width: calc(100% - 30px);
}
.nf__area-box-cityList--inr:first-child .nf__area-box-city--parent2{
    border-top:none;
}
.nf__area-box-city--children__inr2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    border-top: 1px solid var(--border-color);
}
.nf__area-box-cityList2 {
    background: #fff;
    display: block;
    border-radius: 8px;
    border: 1px solid var(--border-color);
    max-height: 55vh;
    overflow-y: scroll;
}
.searchboxarea{
    height:85dvh;
    overflow-y: scroll;
}
.Select_FlightWrapper{
    height:60dvh;
    overflow-y: scroll;
}

.nf__area-box-city--hotel{
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 10px;
    align-items: center;
    border-top:1px solid var(--border-color);
}


/* =========================
    フライト
==================================*/
.nf_flightCol2{
    display: flex;
    flex-wrap: wrap;
    margin-top:10px;
    justify-content: space-between;
}
.nf_term-air__table--box {
    /* width: calc(100% / 2 - 2px); */
    background: #fff;
    position: relative;
    width: 100%;
    padding: 15px;
    /* border-bottom: 1px solid var(--border-color); */
    /* border-right: 1px solid var(--border-color); */
    border-radius: 8px;
    margin-bottom: 10px;
}
.content_flight{margin-bottom:0 !important;}
.ChangeAirLink {
    padding: 10px 0;
    /* position: absolute; */
    bottom: -30px;
    text-align: center;
    width: 100%;
    left: 0;
    display: block;
}
.nf_term-air__table--box:nth-child(2){border-bottom: none;}

.nf__cmnTtl{
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 10px;
}
.nf_terms-air__btns{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 10px 10px;
}
.nf_terms-air__btns .CarrierTab_Inactive {
    height: inherit !important;
    width: 100% !important;
    min-width: inherit !important;
    text-align: center;
    color: #222;
    background-color: #FFF;
    border: solid 2px var(--border-color);
    border-radius: 8px !important;
    padding: 10px;
}
.nf_terms-air__btns .CarrierTab_Active {
    height: inherit;
    width: 100%;
    min-width: inherit;
    background-color: var(--bg-color);
    border: solid 2px var(--primary-color);
    border-radius: 8px;
    color: #222;
    padding: 10px;
}
.CarrierTab_Bottom{display:none !important;}
.nf__inputBtnWrap[disabled="disabled"]:has(.CarrierTab_Inactive) {
    background-color: transparent;
    opacity: 0.7;
}
.Area_wrap_inr{
    padding:10px;
}

.nf_term-air__tables {
    background: var(--bg-color);
    margin: 10px 0;
    padding: 10px 15px;
    position: relative;
    border-radius: 4px;
}
.nf_term-air__table--ttl{
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.nf_term-air__table--icon{
    background: var(--gray3);
    color: #fff;
    font-size: 12px;
    display: flex;
    align-items: center;
    padding: 2px 6px;
    border-radius: 8px;
    margin-right:10px;
}

.nf_term-air__table{
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding:10px 0 0;
    align-items: center;
}
.dpp_flight span:nth-child(2){
    width: 100% !important;
}
.dpp_time span:first-child {
    font-size: 24px !important;
    width: 100% !important;
    font-weight: bold !important;
}
.dpp_time span.nf_term-air__table--dep {
    font-size: 12px !important;
    font-weight: normal !important;
    color: #373636;
}
.dpp_flight span {
    font-size: 12px;
    word-break: break-all;
    margin-bottom: 0 !important;
}
.nf__comTxt{font-size:10px;text-align: center;}
.dpp_time {width: 40% !important;}
.dpp_flight {
    width: 20% !important;
    line-height: 1;
}

.tabs.justified .tabs-header-item{
    padding:10px 0 !important;
}
.tabs-header-item.active {
    border-bottom: 2px solid var(--primary-color) !important;
    color: var(--primary-color) !important;
}
.CarrierSubTab{
    margin-bottom:10px;
}
.nf__flight_alg {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    margin: 10px 0 20px;
}
.nf__flight_alg--inp {
    display: flex;
    border: 1px solid var(--border-color);
    align-items: center;
    padding: 10px;
    border-radius: 4px;
    font-weight: normal;
    width: calc(100% / 2 - 20px);
    font-size: 12px;
    box-shadow: 0 2px 2px 0px #f7f7f7;
}
.nf_terms--inr .fa{color:var(--gray3);}
.nf__flight_alg--ico{
    width: 20px;
}
.nf_terms-air__btns2 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px 10px;
    margin:10px 0;
}
.nf_terms-air__btn{
    text-align: center;
    color: #222;
    background-color: #FFF;
    border: solid 2px var(--border-color);
    border-radius: 8px;
    padding: 10px;
    font-size: 12px;
    font-weight: normal;
}
.nf_terms-air__btn.sel{
    background: var(--color-blue-lightest);
    border-color: var(--primary-color);
}
.FlightFiter__inr{
    border-top: 1px solid var(--border-color);
    padding-top: 10px;
}
.btn__alg{
    background: var(--primary-color) !important;
    border-radius: 4px !important;
    padding: 12px 0 !important;
}
.nf__flight_List-nor {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 20px 10px;
    border-radius: 8px;
    border: 2px solid var(--border-color);
    margin-bottom: 10px;
    box-shadow: 0 2px 2px 0px #f7f7f7;
}
.nf__flight_List-sel {
    background: var(--color-blue-lightest);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 20px 10px;
    border-radius: 8px;
}
.nf_term-air__timeBox {
    margin: 0 !important;
    width: 68%;
}
.nf_term-air__selBtn {
    width: 28%;
    font-size: 14px !important;
    text-align: center;
    color: var(--primary-color);
}
.nf_term-air__selBtn--inr {
    font-size: 14px !important;
    text-align: right;
    color: var(--primary-color);
}

.nf_term-air__selBtn2 {
    width: 28%;
    font-size: 14px !important;
}
.nf_term-air__timeBox-inr{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}
.nf_term-air__flight {
    width: 50px;
}
.nf_term-air__flight-ico span{
    width: 100%;
    display: block;
    font-size: 10px;
    transform: inherit;
}
.nf_term-air__flight-txt {
    font-weight: normal;
    font-size: 10px;
    color: var(--gray3);
    word-break: break-all;
}
.nf_term-air__time {
    font-weight: normal;
    text-align: center;
    width: calc((100% - 100px) / 2);
}
.nf_term-air__img{
    width:50px;
    display: block;
}
.nf__flight_List--time{
    font-size: 14px;
    display: block;
    font-weight: bold;
}
.nf_term-air__table--dep{font-size:10px;}
.Difference_Price{
    font-size:14px;
}
.Remaining_Seats{
    font-size: 12px;
    font-weight: normal;
}
.nf_term-air__table__btn{
    background: var(--primary-color) !important;
    display: block;
    color: #fff !important;
    text-align: center;
    border-radius: 8px;
    padding: 5px;
    width: 90%;
    margin: 5px 0 0;
}
.conflight__txt{
    font-size: 10px;
    text-align: center;
    margin: 10px 0;
}
.conflight__txt2 {
    font-size: 10px;
    text-align: center;
    margin: 10px 0;
    width: 100%;
    padding-left: 2.8rem;
    font-weight: normal;
}
.nf_term-air__timeBox-inr--body{
    width: 100%;
}
.nf_text-red::first-letter {
  color: var(--gray3);
}

/* =========================
    ホテル
==================================*/

.nf__HotelArea{margin-top:30px;}

.nf__cmnTtl_col2{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 0;
}
.nf__cmnTtl_col2--inr {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: calc(100% - 150px);
}
.htl-ttlBox {
    width: calc(100% - 30px) !important;
    margin-left: 10px;
}
.nf_terms-htl--add {
    display: block;
    width: 150px;
    font-size: 14px;
    font-weight: normal;
    text-align: right;
}
.nf_terms-htl--date{
    background: var(--bg-color);
    padding: 5px;
    margin: 5px 0;
    font-weight: bold;
    font-size: 13px;
}
.nf_terms-htl_btns{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 10px 0;
}
.nf__htl__left{margin:10px 0;}
.htlNarBtn a{
    border: 1px solid var(--border-color);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100px;
    border-radius: 4px;
    padding:  5px;
    color: #222;
    font-size: 12px;
    justify-content: space-around;
}
.htlNarBtn_sel{
    border: 1px solid var(--border-color);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 80px;
    border-radius: 4px;
    padding:  5px;
    color: #222;
    font-size: 12px;
    text-align: center;
     background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAOCAYAAAA8E3wEAAAAAXNSR0IArs4c6QAAAgpJREFUOBGlU79LW1EUPvfFPLQOQh06OPgHuKlV82NwqBYsndRSwTUPqVgpJS9DlyyCJFSUYKWR/gVugi46SCXRYNOpmq4OGTq0oKCBp32353vw5PblRtN6lnffOd+Pm7zvCOKy5pJFSTJCQux0PWwfS6fT1+jft1inpfrrYpukHBEkDvK5bNSAaNg0p9jsBwbVn5cf7mvk8z0t1oS258GDEIZHB/tnA9H4ZzacJpKD/UOxWrlULPjE/3lar5M2a6WEoFooZDxdW1o8gY5niMOXw0K1PxKvSClf8OuTvkjs29dSsYLZv1ZiPjnOl8+DZ4SMlx+XM7u+xo0hGuXDQoVNLxk8KoieP47Gd3ARH9zMc+aNPUCu3GRsWBhGKr+S+aTyWLe+EnM2385N4L83w+bg6vuF03pUfWf27btu58op8YUf8W9bX89lrCDKC02w2dX54BUSC6LjOFtWKtURxATfgQHWM0PaoaEprSHWolW2TxCJY/7wPbLmbiDiGr7XwgwYYMEBFxo6vNYQwFwufW6a5rNm1kWNPzjg6szQ+ys0QVDdunCgyqVCUcU1ir+KUc+3GgKIlPYOxb6TpEn+PiPquqjxJ0NM5ZezN/FXTdSzNqUqwD9b83ZSum4Gi8y7NYy++9vdk5LaOP42xz+L3l3VtCGE1HXxhG+JfyPjhqHREdR1uSv+Oj56fwCOW+0Oio0XpwAAAABJRU5ErkJggg==) no-repeat 90% center;
    background-size: 10px;
    line-height: 1.5;
}
.nf_terms-htl-cnt{
    border-bottom: 1px solid var(--border-color);
}
.nf_Htlcol2{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.nf_Htlcol2_ptn2{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.nf_terms-htl--rimg{
    width: 35%;
    height: 120px;
}
.nf_terms-htl--rimg img{
    object-fit: cover;
    height: 120px;
    width: 100%;
}
.nf_terms-htl--rtxt {
    width: calc(100% - 30% - 40px);
}
.nf_terms-htl--name {
    font-size: 14px !important;
    width: 100%;
    display: block;
    line-height: 1.5;
    padding-bottom: 10px;
}
.nf_terms-htl--rtxt .progress_textArea{
    margin-top:0;
}
.nf_terms-htl--info{
    font-size: 12px;
    line-height: 1.5;
    letter-spacing: 0.05em;
}
.nf_terms-htl--plan{
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 10px;
    background-color: #fff;
    margin-top:10px;
}
.nf_terms-htl--plan-col2{
    display: flex;
    flex-wrap:wrap;
    justify-content: space-between;
}
.nf_terms-htl--pname{
    width: calc(100% - 90px);
    font-weight: bold;
}
.nf_terms-htl--att {
    border: 1px solid #d27979;
    color: #d27979;
    font-size: 10px;
    padding: 2px 4px;
    border-radius: 4px;
    width: 65px;
    text-align: center;
}
.icon_sml{
    margin-left: 0px;
    border: 1px solid var(--border-color);
    font-size: 10px;
    padding: 2px 4px;
    display: inline-block;
    border-radius: 4px;
    font-weight: normal;
}
.nf_terms-htl--rimg2 {
    width: 30%;
}
.nf_terms-htl--rtxt2 {
    width: calc(100% - 30% - 20px);
}
.nf_text-xsmall-plan{font-size:12px;}
.nf_terms-htl--rtxt2 .house_area {
    margin: 0;
    padding-left: 0;
    line-height: 1.5;
    font-weight: normal;
    font-size: 12px;
    display: flex;
}
.nf_terms-htl--rtxt2 .icon_smoke{padding:0;}
.nf_terms-htl--ann {
    background: #feeeee;
    color: #EB5757;
    font-size: 10px;
    width: 45%;
    padding: calc(var(--pdd) / 2);
    border-radius: 4px;
}
.nf_terms-htl--prc{
    width:100%;   
    font-size: 12px;
    color: var(--gray3);
}
.nf_terms-htl--ann + .nf_terms-htl--prc {
    width: 55%;
}
.nf_flx__prc{
    font-size:120%;
}
.nf_flx__point {
    font-size: 12px;
    color: #333;
}
.nf_terms-htl--btn-wrap {
    display: inline-block;
    width: calc(100% / 2 - 5px);
    margin-right: 10px;
}
.nf__whtlBtn{
    margin-top:20px;
    display: flex;
    flex-wrap:wrap;
    justify-content: space-between;
}
.nf_terms-htl--btn-wrap {
    display: block;
    width: calc(100% / 2 - 5px);
    margin-right: 10px;
}
.nf_terms-htl--btn-wrap+.nf_terms-htl--btn-wrap{margin-right: 0;}


.nf_terms-htl--btn-wrap .nf_terms-htl--btn {
    padding: 10px 0;
    background: #fff;
    width: 100%;
    border: 1px solid var(--primary-color) !important;
    color: var(--primary-color) !important;
    border-radius: 4px;
    background:#fff !important;
}

.nf_terms-htl--btn-wrap .nf_terms-htl--btn.ptn2{
    background:var(--primary-color) !important;
    color:#fff !important;
}
.nf_terms-htl--all-btn {
    display: block;
    border-radius: 8px;
    text-align: center;
    font-size: 14px;
    margin-top: 15px;
    padding: 7px 0;
    border: 1px solid var(--primary-color);
    color: var(--primary-color);
    background: #fff;
    width: 100%;
    cursor:pointer;
}
.nf__htlLprc{margin-top:12px;}

.nf__plan_cio{
    display: flex;
    align-items: center;
    font-size: 12px;
}
.nf__plan_cin{
    padding: 0 5px;
    border-right: 1px solid var(--border-color);
}
.nf__plan_cot{
     padding: 0 5px;
}
.PlanTitle{font-size:16px;}
.PlanTitle_cion{margin:10px 0;}

.nf__planWrapBox{
    background: var(--bg-color);
    margin: 10px -10px 0;
    padding: 10px;
}
.nf__planWrapBox--inr-box{
    display: block;
    background: #fff;
    padding: 10px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
}
.nf__planWrapBox--inr-box--ttl{
    font-size: 14px;
    font-weight: bold;
}
.nf__planWrapBox--inr-box--col2{
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top:10px;
}
.nf__planWrapBox--inr-box--img{
    width: calc(100% / 2 - 10px);
}
.nf__planWrapBox--inr-box--txt {
    width: calc(100% / 2 - 10px) !important;
}
.nf__planWrapBox--inr-box--txt-r{
    font-size: 13px;
    color: var(--gray3);
}
.nf__planWrapBox--inr-box--txt-r span{color:var(--primary-color);}
.nf__planWrapBox--prc {
    padding: 10px 0;
    text-align: center;
    font-size: 14px;
}
.nf__planWrapBox--ann {
    background: #feeeee;
    color: #EB5757;
    font-size: 10px;
    margin-top:10px;
    padding: calc(var(--pdd) / 2);
    border-radius: 4px;
}
.nf__planWrapBox--btn{
    width: 80%;
    margin: 20px auto;
}
.nf__planWrapBox--btn .Button{
    background:var(--primary-color) !important;
    color:#fff !important;
    border:none !important;

}
.nf__planWrapBox--p{
    line-height: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}
.nf__planWrapBox--p .nf_terms-htl--att{
    margin-right: 5px;
}

.nf__hotelsTabs {
    border-bottom: 1px solid var(--border-color);
    padding-top: 40px;
}
.nf__hotelsTabs--tab {
    font-weight: bold;
    margin-right: 10px;
    padding: 5px 10px;
}
.nf__hotelsTabs--tab-on{
    font-weight: bold;
    margin-right: 10px;
    padding: 5px 10px;
    position: relative;
    text-align: center;
    color:var(--primary-color);
    border-bottom:2px solid var(--primary-color);
}
.nf__hotelsTabs--tab-on::before {
    content: "選択中";
    background: var(--bg-color);
    position: absolute;
    top: -30px;
    left: 0;
    width: 100%;
    font-size: 12px;
    padding: 4px 0;
    border-radius: 4px;
}
.nf__hotelsTabs--tab-on::after {
    content: "";
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    background: var(--bg-color);
    display: block;
    width: 20px;
    height: 10px;
    position: absolute;
    top: -8px;
    left: 31%;
}

/* 複数ホテル */
.SelectedHotel_wrap{

}
.SelectedHotel_wrap--ttl {
    padding: 10px 0;
    font-weight: bold;
}
.SelectedHotel_wrap__inr{
    background: var(--color-blue-lightest);
    padding: 15px;
    border-radius: 8px;
}
.SelectedHotel_wrap-col2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-bottom: 10px;
}
.nf__hotels_next{
    background: var(--primary-color);
    color: #fff;
    text-align: center;
    padding: 10px 0;
    border-radius: 8px;
    margin: 15px 0;
}
.targetHotelLabel{
    background: var(--color-orange-light);
    padding: 10px;
    border-radius: 8px;
    font-size: 12px;
    color: #fff;
    margin: 10px;
    box-shadow: rgb(0 0 0 / 10%) 0px 0px 5px 0px, rgb(0 0 0 / 10%) 0px 0px 1px 0px;
}
.bottomBar__3col {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    align-items: center;
    background: #fff;
    padding: 10px;
    border-top: 1px solid var(--border-color);
}
.bottomBar__box1 {
    border-right: 1px solid var(--border-color);
    width: calc(100% / 3 - -25px) !important;
    margin-right: 10px;
}
.bottomBar__box2{
    width: calc(100% / 3 - 5px) !important;
}
.bottomBar__box2 a{
    padding: 10px;
    background: var(--color-blue-lighter);
    border:1px solid  var(--color-blue-lighter);
    color: #3770a0;
    border-radius: 6px;
    font-size: 12px;
}
.bottomBar__box3 {
    width: calc(100% / 3 - 30px) !important;
    font-size: 12px;
}
.phone .bottomBar__box3 .btn {
    display: flex;
    width: 100%;
    margin-left: 0;
    align-items: center;
    padding: 0;
    padding: 10px;
    height: inherit;
}
.bottom_prcWrap {
    background: var(--bg-color);
    padding: 10px;
    margin-bottom: -1px;
    border: #fff solid 10px;
}
.phone .bottomBar__box3 .btn span{
    font-size: 10px;
}
.MainBox:has(.bottomBar){
    padding-bottom:150px;
}
.coupon_col2{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.coupon--inp{
    border: 1px solid var(--border-color) !important;
    padding: 10px !important;
    border-radius: 6px !important;
    width: calc(100% - 90px) !important;
}
.coupon--btn{
    border:solid 1px var(--primary-color);
    padding: 6px;
    width: 80px;
    display: block;
    text-align: center;
    border-radius: 6px;
}
.coupon--btn:hover{
    background:var(--primary-color);
    color:#fff;
}
.coupon_cls{
    background: var(--primary-color);
    text-align: center;
    padding: 10px;
    margin-top: 20px;
    border-radius: 6px;
}
.MultiHotel_wrap_col2 a{
    margin-left:15px;
}
.nf__htlLec div:empty + div {
    margin-top: 10px;
}
.menu-icon{display: none !important;}
/* PC */
@media screen and (min-width: 768px) {
    .nf_col2__pc{
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .nf__FlightArea{
        width: 400px;
    }
    .nf__HotelArea{
        width: calc(100% - 420px);
    }
    .bottomBar{
        background: #fff;
        width: 100%;
        border-top: 1px solid var(--border-color);
    }
    .bottomBar__pcWrap{
        display: flex;
        width: 800px;
        margin: 0 auto;
    }
    .bottomBar__3col{border:none;}
    .targetHotelLabel{
        text-align: center;
        font-size: 14px;
        box-shadow: none;
        width: 390px;
    }
    .nf__area-box-cityList2{
        max-height: 45vh;
    }
    .AirPortCond{
        /* height:65dvh; */
        height:90dvh;
    }
    .CalendarCond .CaleenadrTable {
        height: auto;
        padding-bottom: 40px;
        overflow-y: inherit;
    }
    .GuestCond {
        height: 65dvh;
    }
    .CalendarCond {
        height: 70dvh;
    }
    .MultiHotel_wrap{
        height: 55dvh;
    } 
    .modal-wrapper {
        height: 85dvh !important;
        overflow: hidden;
    }
    .nf__htl_bottom_btn{
        position: fixed;
    }
    .nf__pax-room__fix {
        position: fixed;
        left: 0;
        padding: 5px 15px 15px;
        bottom: 0;
    }
    .ann__txt {
        padding: 20px;
        margin: 0 0 10px;
        font-size: 12px;
    }
    .nf__icon {
        width: 24px;
    }
    .htl-ttlBox {
        width: calc(100% - 40px) !important;
        font-size: 20px;
    }
    .nf_terms-htl--add{
        font-size: 15px;       
    }
    .nfChange--dep {font-size: 16px;}
    .nfChange--pax{font-size:14px;}
    .nf__hotelsTabs--tab-on,
    .nf__hotelsTabs--tab{
        padding: 5px 20px;
        font-size: 16px;
    }
    .nf_terms-htl--date{font-size:14px;}
    .nf_terms-htl--rimg {width: 25%;}
    .nf_terms-htl--rtxt {
        width: calc(100% - 22% - 40px);
    }
    .nf_terms-htl--name.nf_terms-htl--name{
        font-size: 16px !important;
    }
    .nf_terms-htl--rtxt .progress_textArea {
        font-size: 12px;
        line-height: 1.8;
    }
    .SelectedHotel_wrap-col2--pc{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .SelectedHotel_wrap-col2--room{
        width: calc(100% - 220px);
    }
    .nf__whtlBtn{width: 200px;}
    .nf__whtlBtn .btn{ width: 100% !important;}
    .nf_text-xsmall-plan {
        font-size: 14px;
    }
    .nf__hotels_next {
        width: 300px;
        margin: 20px auto;
    }
    .sort-price-wrap{margin-left: 10px;}
    .htlNarBtn a,.htlNarBtn_sel{padding:10px;}
    .dpp_name {
        border-bottom: none;
        margin-bottom: 0;
    }
    .nf_terms-htl--info {font-size: 13px;}
    .nf_terms-htl--plan{
        margin:15px 0;
    }
    .nf__whtlBtn {
        width: 300px;
        margin: 25px auto 10px;
    }
    .nf_terms-htl--rtxt2 {
        text-align: left;
    }
    .nf_terms-htl--all-btn{padding:12px;}
    .nf__htlLec {
        width: 400px;
    }
    .nf__planWrapBox--btn {
        margin: 20px auto 10px;
    }
    .nf__planWrapBox--btn .Button{width: 100%;}
    .dpp_time {
        width: 35% !important;
    }
    .dpp_flight {
        width: 30% !important;
    }
    .nf__htl__left{width: 300px;}
    .nf__htlLprc{width: 100%;}
}