@charset "utf-8";
.ranking-list li.ranking-sin a:before{ background: url(https://www.jtb.co.jp/kaigai/area/singapore/_images/mv_singapore.jpg); background-size: cover; background-position: -187px 0;background-repeat: no-repeat;}
.ranking-list li.ranking-sel a:before{ background: url(https://www.jtb.co.jp/ovs_air_static/asia/korea/seoul/_images/01756087958.jpg); background-size: cover; background-position: center; }
.ranking-list li.ranking-dps a:before{ background: url(https://www.jtb.co.jp/kaigai/area/bali/_images/mv_bali.jpg); background-size: cover; }

/* 画像差し替え
============================================================================= */
.popularcities-list li.popularcities-hkg a:before{ background: url(/ovs_fit_static/images/popularcities/htl/hkg.jpg);}
.popularcities-list li.popularcities-dad a:before{ background: url(/ovs_fit_static/images/popularcities/htl/dad.jpg); background-size: cover;}

/* スライダー対応
============================================================================= */
@media screen and (max-width: 759px){
    ul.campaign-list {
    display: flex;
    flex-wrap: wrap;
    margin: -5px 0 0 -5px;
    }
    ul.campaign-list li {
        margin: 5px 0 0 5px;
        width: calc(100% / 2 - 5px);
    }
    .slick-dots li button:before{font-size:2.0rem;}
    .otherproducts-list,
    .ranking-list:not(.js-slider){
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: center;
        /*margin: 30px -6px 0;*/
        flex-wrap: wrap;
        flex-direction: row;
        justify-content: flex-start;
    }
    .otherproducts-list > li,
    .ranking-list:not(.js-slider) li[class^="ranking-"] {
        width: calc(100% / 2 - 5px);
        padding: 3px;
    }
    .otherproducts-list,.ranking-list {max-width: 100% !important;}
}

/* インフォメーション対応
============================================================================= */
.kaigaiinfo .ttl{
    text-align: center;
}
.kaigaiinfo-sect{
    margin-top: 30px;
}
.kaigaiinfo-box{
    margin-top: 10px;
}
.kaigaiinfo-list{
    width: 100%;
    border-top: 1px solid #BCBDC2;
}
.kaigaiinfo-list + .kaigaiinfo-list{
    margin-top: 0;
    border-top: none;
}
.kaigaiinfo-list_item a{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 10px;
    transition: opacity .3s;
}
.kaigaiinfo-list_item .m-ico{
    margin-right: 0;
    color: #95999e;
}
@media screen and (min-width: 1000px) {
    .kaigaiinfo-wrap{
        display: flex;
        justify-content: space-between;
    }
    .kaigaiinfo-sect{
        width: calc(100% / 3 - 20px);
    }
    .kaigaiinfo-sect:last-child{
        width: calc((100% / 3) * 2 - 20px);
    }
    .kaigaiinfo-box{
        display: flex;
        justify-content: space-between;
        margin-top: 40px;
    }
    .kaigaiinfo-list{
        width: 100%;
        border-top: none;
    }
    .kaigaiinfo-list + .kaigaiinfo-list{
        margin-left: 40px;
    }
    .kaigaiinfo-list_item a{
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 17px 18px;
        transition: opacity .3s;
    }
    .kaigaiinfo-list_item a:hover{
        opacity: .6;
    }
}
@media screen and (max-width: 759px){
    .kaigaiinfo-list_item {border-bottom: 1px solid #BCBDC2;}
    .kaigaiinfo-sect.service{padding: 30px 0;}
}

/*外部リンク矢印調整*/
.info-list li a.icon_window:before{right: 10px;}
.info .info-list li:nth-child(2) a:after,
.info .info-list li:nth-child(3) a:after,
.info .info-list li:nth-child(4) a:after,
.info-list.service01 li:nth-child(1) a:after,
.info-list.service02 li:nth-child(1) a:after,
.info-list.service02 li:nth-child(2) a:after {
    content: unset;
}

/*外部アイコン*/
.info .info-list li:nth-child(1) a:after,
.info .info-list li:nth-child(5) a:after,
.info-list.service01 li:nth-child(1) a:after,
.info-list.service02 li:nth-child(1) a:after,
.info-list.service02 li:nth-child(2) a:after {
    content: "\e910";
    font-size: 1.8rem;
}
/* 調整 */
.sect.htlsearch-sect{ margin-top: 0; padding-top: 72px;}

/* cassette */
@media screen and (max-width: 767px){
  .el_cassette__list{ display: flex; margin-top: 8px;  overflow-x: scroll; scroll-behavior: smooth; -ms-overflow-style: none;scrollbar-width: none;} 
  .el_cassette__list::-webkit-scrollbar{ display: none;} /* Chrome/Safariで非表示 */
  .el_cassette__item{ flex: 0 0 80%; margin: 0 8px 16px;}
}
@media screen and (min-width: 768px){
  .el_cassette__list{ display: flex; flex-wrap: wrap; margin: 0 0 0 -12px; justify-content: space-between; align-items: stretch;}
  .el_cassette__item{ display: block; margin: 12px 0 0 12px; width: calc(100% / 4 - 12px);}
  .el_cassette__item:nth-child(n + 5) { margin-top: 2em; }
}
.el_cassette__item{ background-color: #fff; box-shadow: 0 0 .5em rgba(0,0,0,.2);}
.el_cassette__item a{ position: relative; display: flex; flex-direction: column; justify-content:space-between; color: #323743; height: 100%;}
.el_cassette__item .c-head { position: relative; overflow: hidden;width: 100%;}
.el_cassette__item .c-head::before { content:""; display: block; padding-top: 65.6061%;}
.el_cassette__item .c-head img { display: block; margin: 0 auto; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover; vertical-align: bottom; max-width: 100%;}
.el_cassette__item .c-bottom{ display: flex; flex: 1; flex-direction: column; padding: 24px 16px 12px 16px; position: relative; text-align: left; z-index: 4;}
.el_cassette__item .c-bottom .el_cassette__label{ position: absolute; display: flex; align-items: center; top: -16px; left: 8px; z-index: 99; color: #fff;}
.el_cassette__item .c-bottom .el_cassette__label .area { background-color: #eb7369; font-weight: bold; font-size: 1.4rem; padding: 4px 8px;}
.el_cassette__item .c-bottom .el_cassette__info{ flex: 1; margin-bottom: auto;}
.el_cassette__item .c-bottom .el_cassette__info .el_cassette__title span{ font-size: 1.8rem; font-weight: 700; line-height: 1.4;} 
.el_cassette__item .c-bottom .el_cassette__info .el_cassette__text_wrap{ margin-top: 8px;}
.el_cassette__item .c-bottom .el_cassette__info .el_cassette__lead span{ font-size: 1.4rem; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 3; margin-bottom: 8px;}
.el_cassette__item .c-bottom .el_cassette__info .el_cassette__point-room li{ font-size: 1.2rem; line-height: 1.5; position: relative; padding-left: 1.5em }
.el_cassette__item .c-bottom .el_cassette__info .el_cassette__point-room li::before{ position: absolute; top : 0; left: 0; color: #379cde; font-family: "Material Icons Round"; content: "\e53a"; }
.el_cassette__item .rating_wrap { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center;  -ms-flex-align: center; align-items: center; height: 24px;}
.el_cassette__item .rating_wrap .rating__stars img{ height: 14px; margin-right: 1px;}
.el_cassette__price { margin-top: 8px; text-align: center;}
.el_cassette__price-num{ color: #cc0d21; font-weight: bold;} 
.el_cassette__price-num span{ font-size: 1.75em; font-weight: bold;} 
.el_cassette__price-txt{ font-size: 1.4rem; margin-left: 2px;}
.el_cassette__price-date{ font-size: 1.2rem;}
.el_cassette__price-date span{ letter-spacing: 0.05em;}
.el_cassette__notice { text-align: right; margin-top: 24px;}
@media (max-width: 767px){ .el_cassette__notice { font-size: 1.1rem;}}
@media (min-width: 768px){ .el_cassette__notice { font-size: 1.3rem;}}

/* scrollbar */
@media (max-width: 767px){
  .el_cassette_scroll-container{ position: relative; width: 100%;}
  .el_cassette_scrollbar{ position: absolute; bottom: -8px; right: 0; left: 0; margin: 0 auto; width: 96%; height: 6px; background-color: rgba(0,0,0,0.1); border-radius: 5px;}
  .el_cassette_scrollbar .thumb{ position: absolute; top: 0; left: 0; height: 6px; background-color: #656972; border-radius: 5px; cursor: pointer; transition: background-color 0.2s;}
  .el_cassette_scrollbar .thumb:hover{ background-color: #656972;}
}
@media (min-width: 768px){
  .el_cassette_scrollbar{ display: none;}
}

/*タビナカ差し替え　20251211*/
.opt-list li.opt-activity a:before{ background: url(https://www.jtb.co.jp/kaigai_opt/img/front/srh/topSpecial/theme_activity.jpg); background-size: cover; }
.opt-list li.opt-citytour a:before{ background: url(https://www.jtb.co.jp/kaigai_opt/img/front/srh/topSpecial/theme_citytour.jpg); background-size: cover; }