@charset "utf-8";
/* CSS Document */

.area_box {
    position: relative;
    top: 0;
    left: 0;
    background-color: #FAFAFA;
    padding: 10px 20px 10px 0px;
    margin: 0 10px 10px 0;
    min-height: 5em;
}
.ht {
    height: 6.6em;
    /*行数違いエリア横並びの高さ調整用*/
}
.area_main {
    font-size: 1.6rem;
    font-weight: bold;
    padding: 0 0 0.4em 2em;
}
.area_main a:hover {
    text-decoration: underline;
}
.area_main:before {
    content: '';
    width: 16px;
    height: 16px;
    background: #47adb0;
    border-radius: 50%;
    position: absolute;
    top: 13px;
    left: 10px;
    margin-top: 0px;
}
.area_main:after {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 6px;
    border-color: transparent transparent transparent #fff;
    position: absolute;
    top: 17px;
    left: 16px;
}
.area_pref {
    margin-left: 2.3em;
}
.area_pref li {
    display: inline;
    position: relative;
    vertical-align: top;
    width: auto;
    margin: 5px 0;
    padding: 0 10px 0;
    border-right: 1px solid #999;
    line-height: 1.6;
}
.area_pref li:first-child {
    padding-left: 0px;
}
.area_pref a:hover {
    text-decoration: underline;
}
.bnr_txt_noticon{
	margin-bottom: 1.4em;
	width: 220px;
	line-height: 1.4;
}


@media screen and (max-width:767px) {
    .area_box {
        padding: 10px 20px 10px 0px;
        margin: 0 10px 10px 10px;
        min-height: auto;
    }
    .ht {height: auto;}
	.bnr_txt_noticon{margin-bottom: 0.4em; width: auto;}
}




/*------------特集一覧　Ver2--------------*/
.photo_bnr {
    position: relative;
    width: 240px !important;
    height: 240px;
    background-size: contain;
    border-radius: 10px;
    margin-bottom: 20px;
    border: solid 1px #ccc;
}
.photo_bnr:hover {
    background-color: #fff;
    opacity: 0.7;
}
/*グラデ*/
.photo_bnr>.grad {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 30%;
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(34, 34, 34, 1) 40%);
    opacity: 0.7;
    border-radius: 0 0 10px 10px;
}
/*特集リンク範囲*/
.photo_bnr>a {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    z-index: 20;
}
/*特集リンクタイトル名*/
/*1行*/
.photo_bnr>a>.ttl {
    position: absolute;
    color: #fff;
    font-size: 1.6rem;
    bottom: 10px;
    left: 10px;
    line-height: 1.3;
    z-index: 10;
}
/*TDR用*/
.photo_bnr>a>.ttl_tdr {
    position: absolute;
    color: #222;
    font-size: 1.6rem;
    bottom: 10px;
    left: 10px;
    line-height: 1.2;
    z-index: 10;
}
/*やじるし*/
.photo_bnr>a>.arrow-right {
    position: absolute;
    bottom: 15px;
    right: 5px;
    display: inline-block;
    width: 13px;
    height: 13px;
    margin: 0 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
    z-index: 11;
}
/*やじるしTDR*/
.photo_bnr>a>.arrow_tdr {
    position: absolute;
    bottom: 15px;
    right: 5px;
    display: inline-block;
    width: 13px;
    height: 13px;
    margin: 0 10px;
    border-top: 2px solid #222;
    border-right: 2px solid #222;
    transform: rotate(45deg);
    z-index: 11;
}
/*ラベル*/
.photo_bnr>a>.label {
    position: absolute;
    top: 0;
    left: 10px;
    background-color: #f59143;
    padding: 8px 10px;
    text-align: center;
    color: #fff;
    font-size: 1.4rem;
    font-weight: normal;
    border-radius: 0 0 10px 10px;
}
/*各特集のバック画像*/
.v64_ski {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_ski.jpg);
}
.v64_goodvalue {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_goodvalue.jpg);
}
.v64_onsen {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_onsen.jpg);
}
.v64_business {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_business.jpg);
}
.v64_hitoritabi {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_hitoritabi.jpg);
}
.v64_early {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_early.jpg);
}
.v64_family {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_family.jpg);
}
.v64_train {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_train.jpg);
}
.v64_tdr {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_tdr.jpg);
}
.v64_hoshinoresorts {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_hoshinoresorts.jpg);
}
.v64_event {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_event.jpg);
}
.v64_joshitabi {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_joshitabi.jpg);
}
.v64_higaeri {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_higaeri.jpg);
}
.v64_fujiq {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_fujiq.jpg);
}
.v64_couple {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_couple.jpg);
}
.v64_zekkei {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_zekkei.jpg);
}
.v64_ranking {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_ranking.jpg);
}
.v64_renpaku {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_renpaku.jpg);
}
.v64_renkyu {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_renkyu.jpg);
}
.v64_longstay {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_longstay.jpg);
}
.v64_sekaiisan {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_sekaiisan.jpg);
}
.v64_tohoku {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_tohoku.jpg);
}
.v64_jreast_hotels {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_jreast_hotels.jpg);
}
.v64_princehotels {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_princehotels.jpg);
}
.v64_tokyuhotels {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_tokyuhotels.jpg);
}
.v64_coupon {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_coupon.jpg);
}
.v64_sakura {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_sakura.jpg);
}
.v64_spring {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_spring.jpg);
}
.v64_ouen {
    background-image: url(/content/dam/jretravel/at/images/feature/v64_ouen.jpg);
}

@media screen and (max-width:767px) {
    .area_box {
        padding: 10px 20px 10px 0px;
        margin: 0 10px 10px 10px;
        min-height: auto;
    }
    .ht {
        height: auto;
        /*行数違いエリア横並びの高さ調整用*/
    }
}


/*----- 追記 -----*/
.cmn_contents {
    overflow: hidden;
}
.swiper {
    max-width: 1000px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}
.swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
}
.swiper-wrapper {
    display: flex;
    flex-wrap: wrap;
    /* gap: 0 10px; */
    justify-content: flex-start;
}

@media screen and (min-width: 768px) {
    .swiper-button-prev,
    .swiper-button-next {
        display: none;
    }
    .swiper-slide {
        width: 240px;
        height: 240px;
    }
    .swiper-wrapper {
        gap: 0 10px;
    }
    .sp_mt0 {
        margin-top: 0 !important;
    }
}
@media screen and (max-width:767px) {
    .swiper-wrapper {
        flex-wrap: nowrap;
    }
}

