@charset "utf-8";
/* CSS Document */
:root{
  --red: #be3455;
  --khaki: #b39564;
  --brown: #99702e;
  --gray: #4c4c4c;
  --t_brown: rgba(153 112 46 / 80%);
  --f_sans: 'Noto Sans JP', sans-serif;
  --f_serif: 'Noto Serif JP', serif;
  --center_contain: no-repeat center center / contain;
  --shadow01: 0 0 4px 2px rgba(0 0 0 / 35%);
  --shadow02: 0 0 8px 2px rgba(0 0 0 / 35%);
}

.nosp{
  display: none;
}
.inner{
  width: 94vw;
  margin: auto;
}
.main *{
  box-sizing: border-box;
  font-family: 'Noto Serif JP', serif;
  color: var(--gray);
}
/*** タイトル周り ***/
.title-wrapper{
  width: 100%;
}
.title-logo{
  position: relative;
}
.period-data{
  width: 96vw;
  margin: auto;
  display: flex;
  justify-content: space-between;
  position: absolute;
  right: 0;
  left: 0;
  bottom: calc(40vw / 7.5);
}
.period-data p{
  width: calc(98% / 2);
  border-radius: calc(20vw / 7.5);
  font-family: var(--f_sans);
  font-size: calc(22vw / 7.5);
  font-weight: 700;
  text-align: center;
  padding: calc(4vw / 7.5) 0;
}
.ryokoshien{
  background: var(--red);
  color: #FFF;
}
.cpn-period{
  background: #FFF;
  color: var(--brown);
  letter-spacing: -0.05em;
}
.main-bodycopy{
  width: 94vw;
  margin: 0 auto calc(30vw / 7.5);
  font-size: calc(24vw / 7.5);
  font-weight: 500;
}
.select-map{
  display: none
}

/*** ナビ ***/
.select-area{
  width:100%;
  margin: auto;
  display: flex;
  justify-content: space-between;
}
.select-area>li{
  width: calc(100% / 5);
  background: var(--brown);
  border-right: 1px solid #FFF;
}
.area-name{
  height: 100%;
  text-align: center;
}
.area-name>span{
  height: 100%;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: calc(30vw / 7.5);
  font-weight: 400;
  color: #FFF;
  line-height: 1.2;
  position: relative;
  padding: calc(10vw / 7.5) 0 calc(30vw / 7.5);
}
.area-name>span::after{
  content: "";
  background: var(--center_contain);
  background-image: url("../img/arrow01.png");
  width:  calc(32vw / 7.5);
  height:  calc(12vw / 7.5);
  position: absolute;
  right: 0;
  bottom: calc(10vw / 7.5);;
  left: 0;
  margin: auto
}
.area-list{
  display: none;
}
.select-area>li:hover{
  background: var(--red);
}

/*** メインコンテンツ ***/
.select-content{
  display: none;
}
.select-content.is-active{
  display: block
}
.head-title{
  font-size: calc(72vw / 7.5);
  font-weight: 400;
  text-align: center;
  margin-bottom: calc(30vw / 7.5)
}
.head-title>span{
  color: var(--red);
}
.hotel-wrapper{
  padding: calc(80vw / 7.5) 0;
}
.hotel-list{
}
.hotel-list>li{
}
.hotel-list>li+li{
  margin-top: calc(30vw / 7.5)
}
.hotel-content__upper{
  display: flex;
  flex-wrap: wrap;
  margin-bottom: calc(30vw / 7.5);
}
.hotel-content__lower{
  display: flex;
  justify-content: space-between;
}
.hotel-img{
  order: 1;
  width: 70vw;
  padding-right: calc(20vw / 7.5);
  height: calc(300vw / 7.5);
  position: relative
}
.hotel-img>img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.hotel-img::before{
  content: "";
  background: no-repeat left top / contain;
  width: calc(61vw / 7.5);
  height: calc(184vw / 7.5);
  position: absolute;
  top: 0;
  left: 0;
}
/* 温泉アイコン */
.hotel-img.beppu::before{
  background-image: url("../img/badge_kyushu_beppu.gif");
}
.hotel-img.ibusuki::before{
  background-image: url("../img/badge_kyushu_ibushuki.gif");
}
.hotel-img.kirishima::before{
  background-image: url("../img/badge_kyushu_kirishima.gif");
}
.hotel-img.unzen::before{
  background-image: url("../img/badge_kyushu_unzen.gif");
}
.hotel-img.nagasaki::before{
  background-image: url("../img/badge_kyushu_nagasaki.gif");
}
.hotel-img.aso::before{
  background-image: url("../img/badge_kyushu_aso.gif");
}
.hotel-img.dogo::before{
  background-image: url("../img/badge_shikoku_dogo.gif");
}
.hotel-img.okudogo::before{
  background-image: url("../img/badge_shikoku_okudogo.gif");
  height: calc(224vw / 7.5);
}
.hotel-img.ashizuri::before{
  background-image: url("../img/badge_shikoku_ashizuri.gif");
  height: calc(257vw / 7.5);
}
.hotel-img.naruto::before{
  background-image: url("../img/badge_shikoku_naruto.gif");
}
.hotel-img.tama::before{
  background-image: url("../img/badge_shikoku_tamatsukuri.gif");
}
.hotel-img.awazu::before{
  background-image: url("../img/badge_kanto_awazu.gif");
  height: calc(216vw / 7.5);
}
.hotel-img.yamashiro::before{
  background-image: url("../img/badge_kanto_yamashiro.gif");
}
.hotel-img.hakone::before{
  background-image: url("../img/badge_kanto_hakone.gif");
}
.hotel-img.zao::before{
  background-image: url("../img/badge_tohoku_zao.gif");
}
.hotel-img.shido::before{
  background-image: url("../img/badge_tohoku_sidotaira.gif");
  height: calc(224vw / 7.5);
}
.hotel-img.asamushi::before{
  background-image: url("../img/badge_tohoku_asamushi.gif");
}
.hotel-img.naruko::before{
  background-image: url("../img/badge_tohoku_naruko.gif");
}
.hotel-img.akiu::before{
  background-image: url("../img/badge_tohoku_akiu.gif");
}
.hotel-img.nobori::before{
  background-image: url("../img/badge_hokkaido_noboribetsu.gif");
}
.hotel-img.jozankei::before{
  background-image: url("../img/badge_hokkaido_jozankei.gif");
  height: calc(224vw / 7.5);
}
.hotel-img.yunokawa::before{
  background-image: url("../img/badge_hokkaido_yunokawa.gif");
  height: calc(224vw / 7.5);
}
.hotel-img.tokachi::before{
  background-image: url("../img/badge_hokkaido_tokachigawa.gif");
  height: calc(224vw / 7.5);
}

.hotel-name{
  order: 3;
  width: 100%;
  font-size: calc(32vw / 7.5);
  font-weight: 700;
  color: var(--brown);
  margin:  calc(10vw / 7.5) auto;
}
.hotel-name>small{
  font-size: calc(24vw / 7.5);
  color: var(--brown);
}
.hotel-txt{
  order: 4;
  flex: 1;
  font-size: calc(24vw / 7.5);
}
.hotel-person{
  order: 2;
  display: flex;
  flex-direction: column;
}
.person-img{
  display: block;
  width: calc(180vw / 7.5);
  position: relative
}
.person-img>img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.person-data{
  width: calc(180vw / 7.5);
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--brown);
  font-size: calc(26vw / 7.5);
  font-weight: 700;
  color: #FFF;
  text-align: center;
  padding: calc(6vw / 7.5);
  flex-grow: 1;
}
.person-data.ss,
.person-data.mm{
  font-size: calc(22vw / 7.5);
  line-height: 1.2
}
.person-data::before{
  content: "おもてなし代表";
  font-size: calc(22vw / 7.5);
  font-weight: 500;
  display: block;
}
.tokuten-img>img{
  width: calc(220vw / 7.5);
  height: calc(220vw / 7.5);
  border-radius: 50%;
}
.tokuten-data{
  flex: 1;
  margin-left: calc(20vw / 7.5);
  position: relative;
  padding-top: calc(60vw / 7.5);
}
.tokuten-data::before{
  content: "";
  background: url("../img/badge_tokuten.gif") var(--center_contain);
  width: calc(320vw / 7.5);
  height: calc(43vw / 7.5);
  position: absolute;
  top: 0;
  right: 0;
  left: 0;  
  margin: 0 auto calc(20vw / 7.5);
}
.tokuten-data>li{
  font-family: var(--f_sans);
  font-size: calc(24vw / 7.5);
  font-weight: 700;
  position: relative;
  padding-left: 1.0em;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.tokuten-data>li:first-child{
  padding-left: 0!important
}
.tokuten-data>li:not(:first-child)::before{
  content: "・";
  position: absolute;
  top: 0;
  left: 0;
}
.tokuten-data>li.original::before{
  content: "【HISオリジナル特典】";
  display: block;
  color: var(--red);
}
.tokuten-data>li.limited::before{
  content: "【HIS限定特典】";
  display: block;
  color: var(--red);
}
.tokuten-data>li small{
  font-family: var(--f_sans);
  font-size: calc(22vw / 7.5);
  font-weight: 400;
}
.tokuten-data>li.no-disp{
  display: none;
}
.note-txt:empty{
  display: none
}
.tokuten-data>li.note-txt{
  font-family: var(--f_sans);
  font-size: calc(22vw / 7.5);
  font-weight: 400;
  position: relative;
  padding-left: 1.0em;  
}
.tokuten-data>li.note-txt::before{
  content: "※";
  position: absolute;
  top: 0;
  left: 0;
}

/*** ツアー商品 ***/
.tour-contents{
  background: url("../img/bg_tour.jpg") repeat;
  padding: calc(80vw / 7.5) 0;
}
.sub-title{
  font-size: calc(44vw / 7.5);
  font-weight: 500;
  color: var(--red);
  text-align: center;
  margin-bottom: calc(30vw / 7.5)
}
.sub-title>span{
  display: inline-block;
  margin-right: calc(10vw / 7.5);
  color: var(--gray);
}
.product-list>li *{
  font-family: var(--f_sans);
}
.product-list.card-style>li .product-list__item .item-photo__wrapper .item-txt__port{
  background: var(--t_brown);
}
.item-label{
  right: 0!important;
  left: auto!important;
  background: var(--red);
  font-family: var(--f_serif);
  font-weight: 500;
  color: #FFF;
  text-align: center;
  padding: calc(6vw / 7.5);
}
.more-link{
  width: 100%;
  margin: calc(30vw / 7.5) auto;
}
.more-link>a{
  display: block;
  background: var(--red);
  font-size: calc(26vw / 7.5);
  font-weight: 500;
  color: #FFF;
  text-align: center;
  position: relative;
  box-shadow: var(--shadow01);
  padding: calc(20vw / 7.5);
}
.more-link>a::after{
  content: "";
  background: url("../img/arrow02.png") var(--center_contain);
  width: calc(18vw / 7.5);
  height: calc(26vw / 7.5);
  position: absolute;
  top: 0;
  right: 1%;
  bottom: 0;
  margin: auto;
}
.more-link>a:hover{
  background: var(--brown);
}