@charset "utf-8";

/* CSS Document */

.nopc {
    display: none;
}

main * {
    box-sizing: border-box;
}


/* common */

section {
    padding: 60px 0 30px;
}

section .inner__box {
    width: 992px;
    margin: 0 auto;
}

.flex__box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    display: -ms-flexbox;
    -ms-flex-pack: justify;
    -ms-flex-wrap: wrap;
}


/* mv__container */

.mv__container {
    width: 100%;
    height: 600px;
    background: url(../images/pc_mv.jpg) no-repeat center / auto 600px;
    padding: 15px 0 0;
}

.mv__ttl {
    width: 992px;
    text-align: center;
    margin: auto;
}

.mv__ttl>img {
    width: 882px;
}


/* nav */

nav {
    width: 100%;
    background: #086a91;
}

ul.nav__box {
    width: 992px;
    margin: auto;
    justify-content: space-between;
}

ul.nav__box>li {
    flex: 0 0 calc(100% / 7);
    transition: 0.3s;
}

ul.nav__box>li>a {
    display: block;
    font-size: 16px;
    font-weight: 900;
    color: #FFF;
    text-align: center;
    position: relative;
    padding: 20px 0;
}

ul.nav__box>li:not(.nav__on)>a::after {
    display: inline-block;
    content: "";
    background: url(../images/button_arrow.png) no-repeat center / contain;
    width: 8px;
    height: 18px;
    position: absolute;
    top: 22px;
    right: 5px;
    margin: auto;
}

ul.nav__box>li:first-child>a::after,
ul.nav__box>li:nth-child(4)>a::after {
    right: 20px;
}

ul.nav__box>li:nth-child(3)>a::after,
ul.nav__box>li:last-child>a::after {
    right: 28px;
}

ul.nav__box>li a.nav__on,
ul.nav__box>li:hover {
    background: #000;
}

ul.nav__box>li a.nav__on::after,
ul.nav__box>li:hover>a::after {
    background: none;
}


/* map__container */

.map__container,
.content__container {
    background: url(../images/bg01.png) repeat;
}

.map__container h2 {
    font-size: 40px;
    font-weight: 900;
    text-align: center;
    margin-bottom: 10px;
}

.map__container h2::before {
    display: block;
    content: "";
    background: url(../images/mark01.png) no-repeat center / contain;
    width: 104px;
    height: 104px;
    margin: 0 auto 10px;
}

.left__content.kanto {
    width: 68%;
    height: 390px;
    background: url(../kanto/images/map_tokyo.png) no-repeat center / cover;
}


/* left content */

.map__station_button {
    position: relative;
}

.map__station_button li {
    width: 65px;
    height: auto;
    position: absolute;
}

li.haneda {
    top: 302px;
    left: 320px;
}

li.shinagawa {
    top: 276px;
    left: 246px;
}

li.tokyo {
    top: 170px;
    left: 381px;
}

li.ueno {
    top: 62px;
    left: 330px;
}

li.shinjuku {
    top: 118px;
    left: 161px;
}

li.shibuya {
    top: 188px;
    left: 161px;
}

li.ikebukuro {
    top: 82px;
    left: 185px;
}

li.yokohama {
    top: 335px;
    left: 17px;
}

li.chiba {
    top: 282px;
    right: 5px;
}


/* right content */

.right__content {
    background-color: #FFF;
    padding: 15px;
}

.right__content.kanto {
    width: 32%;
    height: 390px;
}

.right__content h3 {
    font-size: 16px;
    font-weight: 900;
    margin-bottom: 5px;
}

.right__content h3::before {
    content: "";
    display: inline-block;
    width: 28px;
    height: 37px;
    margin-right: 10px;
    vertical-align: middle;
}

.right__content h3:first-child:before {
    background: url(../images/ico_airport.png) no-repeat center / contain;
}

.right__content h3:last-of-type:before {
    background: url(../images/ico_train.png) no-repeat center / contain;
}

.station__button {
    margin-bottom: 20px;
}

.station__button li {
    width: calc(100% / 2 - 10px);
    margin-bottom: 10px;
}


/* content__container */

.content__container {
    padding: 0 0 30px;
}

.content__container h2 {
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 10px;
}

.content__container h2 small {
    font-size: 65%;
}

.content__container h2::before {
    content: "";
    display: inline-block;
    background: url(../images/ico01.png) no-repeat center / contain;
    width: 32px;
    height: 40px;
    margin-right: 10px;
    vertical-align: middle;
}

.product__info {
    justify-content: flex-start;
    margin-bottom: 30px;
}

.other__column {
    justify-content: flex-start;
}


/* .other__column>li:nth-child(2) {
    margin: 0 14px 15px 14px;
} */

.product__info>li {
    /*width: calc(100% / 3 - 10px);*/
    margin-bottom: 15px;
    position: relative;
    background: #FFF;
    width: calc((100% - 30px) / 3);
    margin-right: 15px;
}

.product__info>li:nth-child(3n) {
    margin-right: 0
}

.product__info>li::after {
    content: "";
    border: 6px solid transparent;
    border-bottom: 6px solid #086990;
    border-right: 6px solid #086990;
    position: absolute;
    bottom: 0;
    right: 0;
}

.product__info li .photo__box {
    position: relative;
}

.product__info li h3 {
    color: #fff;
    background-color: rgb(0 0 0 / 80%);
    font-size: 16px;
    font-weight: 900;
    width: 100%;
    padding: 6px;
    position: absolute;
    left: 0;
    bottom: 0;
}

.product__info li h3 span {
    display: block;
    font-size: 14px;
    font-weight: normal;
}

.product__info li .text__box {
    background-color: #fff;
    padding: 10px;
}

.product__info li .text__box .hotel__info {
    margin-bottom: 10px;
}

.product__info .icon__item {
    justify-content: flex-start;
    align-content: flex-start;
}

.product__info li.icon {
    margin-right: 5px;
    display: none;
    position: relative
}

.product__info li.icon.true {
    display: block;
}

.product__info li.icon::before {
    content: "";
    width: 70px;
    height: 70px;
    display: inline-block;
}

.product__info .icon__item li.wifi::before {
    background: url(../images/ico_freewifi.png) no-repeat center / contain;
}

.product__info .icon__item li.vendingmachine::before {
    background: url(../images/ico_vendingmachine.png) no-repeat center / contain;
}

.product__info .icon__item li.icemachine::before {
    background: url(../images/ico_icemachine.png) no-repeat center / contain;
}

.product__info .icon__item li.smoking::before {
    background: url(../images/ico_smoking.png) no-repeat center / contain;
}

.product__info .icon__item li.conference::before {
    background: url(../images/ico_conference.png) no-repeat center / contain;
}

.product__info .icon__item li.bigbath::before {
    background: url(../images/ico_bigbath.png) no-repeat center / contain;
}

.product__info .icon__item li.breakfastservice::before {
    background: url(../images/ico_breakfastservice.png) no-repeat center / contain;
}

.product__info .icon__item li.coinlaundry::before {
    background: url(../images/ico_coinlaundry.png) no-repeat center / contain;
}

.product__info .icon__item li.convenience::before {
    background: url(../images/ico_convenience.png) no-repeat center / contain;
}

.product__info .icon__item li.parking::before {
    background: url(../images/ico_parking.png) no-repeat center / contain;
}

.product__info li .text__box .other__info span {
    display: block;
    font-size: 12px;
}

.product__info li .text__box .other__info span.price__text {
    font-size: 18px;
    color: #C00;
    font-weight: 900;
}


/*.product__info li .text__box .other__info span.price__text::after {
    content: "円";
}*/

.product__info li .text__box .other__info span:last-of-type::before {
    content: "（";
}

.product__info li .text__box .other__info span:last-of-type::after {
    content: "）";
}

.notice__list {
    margin-bottom: 25px;
}

.notice__list li {
    padding-left: 1em;
    position: relative;
}

.notice__list li::before {
    content: "※";
    position: absolute;
    top: 0;
    left: 0;
}


/* search__container */

.search__container {
    background: url(../images/search_photo.jpg) repeat center top;
    padding: 36px 0 0;
}

.search__container .rn-searchMod__navSection {
    background: none;
}

.search__container .navi--domHotelHikaku,
.search__container .navi--domFlights,
.search__container .navi--domKokunaiCar,
.search__container .navi--domKokunaiLeisure {
    display: none;
}


/* kyushu */

.left__content.kyushu {
    width: 68%;
    height: 480px;
    background: url(../kyushu/images/map_kyushu_okinawa.png) no-repeat center / cover;
}

.right__content.kyushu {
    width: 32%;
    height: 480px;
}

li.fukuoka_airport {
    top: 40px;
    left: 395px;
}

li.oita_airport {
    top: 85px;
    left: 596px;
}

li.nagasaki_airport {
    top: 150px;
    left: 365px;
}

li.miyazaki_airport {
    top: 318px;
    left: 556px;
}

li.kumamoto_airport {
    top: 186px;
    left: 506px;
}

li.kagoshima_airport {
    top: 310px;
    left: 437px;
}

li.naha_airport {
    top: 350px;
    left: 170px;
}

li.hakata_station {
    top: 67px;
    left: 420px;
}


/* li.tenjin_station {
    width: 32px;
    top: 52px;
    left: 72px;
} */

li.nagasaki_station {
    top: 178px;
    left: 365px;
}

li.miyazaki_station {
    top: 285px;
    left: 556px;
}

li.kumamoto_station {
    top: 186px;
    left: 435px;
}

li.kagoshima_station {
    top: 339px;
    left: 432px;
}


/* kansai */

.left__content.kansai {
    width: 68%;
    height: 380px;
    background: url(../kansai/images/map_kansai.png) no-repeat center / cover;
}

.right__content.kansai {
    width: 32%;
    height: 380px;
}

li.kansai_airport {
    width: 80px;
    top: 338px;
    left: 66px;
}

li.kobe_airport {
    top: 154px;
    left: 23px;
}

li.itami_airport {
    top: 66px;
    left: 208px;
}

li.osakaumeda_station {
    width: 80px;
    top: 142px;
    left: 276px;
}

li.namba_station {
    width: 50px;
    top: 223px;
    left: 273px;
}

li.shinosaka_station {
    top: 110px;
    left: 280px;
}

li.sannomiya_station {
    width: 60px;
    top: 106px;
    left: 30px;
}

li.kyoto_station {
    top: 3px;
    right: 3px;
}


/* hokkaido */

.left__content.hokkaido {
    width: 68%;
    height: 370px;
    background: url(../hokkaido/images/map_hokkaido.png) no-repeat center / cover;
}

.right__content.hokkaido {
    width: 32%;
    height: 370px;
}

li.asahikawa_airport {
    top: 150px;
    left: 445px;
}

li.hakodate_airport {
    top: 333px;
    left: 350px;
}

li.newchitose_airport {
    width: 86px;
    top: 222px;
    left: 338px;
}

li.asahikawa_station {
    top: 118px;
    left: 445px;
}

li.hakodate_station {
    top: 305px;
    left: 350px;
}

li.sapporo_station {
    top: 194px;
    left: 360px;
}


/* chubu_hokuriku */

.left__content.chubu_hokuriku {
    width: 68%;
    height: 370px;
    background: url(../chubu_hokuriku/images/map_chubu_hokuriku.png) no-repeat center / cover;
}

.right__content.chubu_hokuriku {
    width: 32%;
    height: 370px;
}

li.nagoya_airport {
    width: 75px;
    top: 92px;
    left: 260px;
}

li.toyama_airport {
    top: 115px;
    left: 102px;
}

li.komatsu_airport {
    top: 140px;
    left: 25px;
}

li.nagoya_station {
    top: 134px;
    left: 196px;
}

li.sakae_station {
    top: 134px;
    left: 265px;
}

li.kanazawa_station {
    top: 110px;
    left: 25px;
}

li.toyama_station {
    top: 85px;
    left: 102px;
}


/* chugoku_shikoku */

.left__content.chugoku_shikoku {
    width: 68%;
    height: 440px;
    background: url(../chugoku_shikoku/images/map_chugoku_shikoku.png) no-repeat center / cover;
}

.right__content.chugoku_shikoku {
    width: 32%;
    height: 440px;
}

li.hiroshima_airport {
    top: 168px;
    left: 290px;
}

li.takamatsu_airport {
    top: 205px;
    left: 450px;
}

li.matsuyama_airport {
    top: 255px;
    left: 270px;
}

li.hiroshima_station {
    top: 168px;
    left: 218px;
}

li.takamatsu_station {
    top: 178px;
    left: 450px;
}

li.matsuyama_station {
    top: 284px;
    left: 270px;
}


/* tohoku */

.left__content.tohoku {
    width: 68%;
    height: 450px;
    background: url(../tohoku/images/map_tohoku.png) no-repeat center / cover;
}

.right__content.tohoku {
    width: 32%;
    height: 450px;
}

li.sendai_station {
    top: 282px;
    left: 336px;
}

li.sendai_airport {
    top: 310px;
    left: 376px;
}

li.aomori_station {
    top: 66px;
    left: 264px;
}

li.aomori_airport {
    top: 66px;
    left: 196px;
}

li.akita_station {
    top: 166px;
    left: 240px;
}

li.akita_airport {
    top: 166px;
    left: 172px;
}


/***JSON調整 ***/

.product__info>li:empty {
    display: none;
}

/*** 記事コンテンツ ***/
.article-wrapper{
  margin: 30px auto;
  padding: 50px 20px 20px;
  background: #FFF;
  position: relative
}
.article-wrapper::before{
  content: "合わせて読みたいおすすめ記事";
  background: #086990;
  padding: 4px;
  text-align: center;
  font-size: 14px;
  color: #FFF;
  position: absolute;
  top: 0;
  left: 0;
}
.article-list>li>a{
  position: relative;
  padding-left: 1.0em;
  text-decoration: underline;
}
.article-list>li>a+a{
  margin-top: 6px;
}
.article-list>li>a::before{
  content: "・";
  position: absolute;
  top: 0;
  left: 0;  
}

.banner-wrapper{
  margin: auto;
  text-align: center;
}
.banner-wrapper a{
  display: block
}
.banner-wrapper a:hover{
  opacity: 0.8
}
.banner-wrapper img{
  width: auto;
}

.bnr-area{
  margin: 0 auto 50px;
  text-align: center;
}
.bnr-area a{
  display: block
}
.bnr-area a:hover{
  opacity: 0.7
}