@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Open+Sans:ital,wght@0,700;1,700&display=swap');

:root{
  --default-color-ovs: #11a4f7;
  --default-color-dom: #0abe01;
  --default-color-hatsu: #f72b01;
  --default-color-stu: #8E469C;
  --default-color-ec: #a56bd0;
  --default-color-brown: #3f2401;
  --default-color-red: #e50012;
  --default-color-blue: #1a0dab;
  --default-color-yellow: #ffe600;
  --default-color-gray: #a8a8a8;
  --default-color-pink: #e63d76;
  --bg-color-ovs: #e2f3fd;
  --bg-color-dom: #E0FCD3;
  --bg-color-ec: #ECDFF5;
  --bg-color-gray: #F2F2F2;
  --bg-color-hatsu: #FEE5E0;
  --font-size-sp: calc(24vw / 7.5);
  --cotent-width: min((710vw / 7.5), 992px);
  --img-arrow-down: url("/cmn/icon/icon_arrow_down.svg");
  --img-arrow-right: url("/cmn/icon/icon_arrow_right_black.svg");
  --img-arrow-right_wt: url("/cmn/icon/icon_arrow_right_white.svg");
  --img-copy: url("/cmn/icon/icon_copy.svg");
  --bg-img-setting: no-repeat center center / cover;
  --bg-shadow: 0 0 4px var(--default-color-gray);
  --bg-button-shadow: 0px 3px 0px 0px rgba(0 0 0 / 23%);
  --content-hover-speed: 0.3s;
}

body{
  font-family: 'Noto Sans JP', sans-serif;
  font-size: var(--font-size-sp);
  line-height: calc(20 / 14);
}
a{
  text-decoration: none;
  color: #333
}
.nosp{
  display: none
}
.inner{
  width: var(--cotent-width);
  margin: auto;
}

.mv__wrapper{
  width: 100%;
  height: calc(366vw / 7.5);
  background: url("../img/mv_photo_sp.jpg") no-repeat center center / 100vw;
  position: relative;
}
.title-logo img{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto
}
.main__content{
  padding: calc(80vw / 7.5) 0
}

/*** 海外・国内タブ ***/
.select-tab{
  display: flex;
  align-items: center;
  margin: 0 auto calc(40vw / 7.5);
  gap: calc(32vw / 7.5)
}
.select-tab>li{
  width: calc((100% - (32vw / 7.5)) / 2);
  border-radius: calc(16vw / 7.5);
  font-size: calc(40vw / 7.5);
  font-weight: 700;
  color: #FFF;
  padding: calc(10vw / 7.5) 0;
  text-align: center;
  position: relative;
  background: var(--default-color-gray);
  transition: background var(--content-hover-speed)
}
.select-tab>li.is-ovs:hover{
  background: var(--default-color-ovs);
}
.select-tab>li.is-dom:hover{
  background: var(--default-color-dom);
}
.select-tab>li.active.is-ovs{
  background: var(--default-color-ovs);
  padding: calc(16vw / 7.5) 0;
}
.select-tab>li.active.is-dom{
  background: var(--default-color-dom);
  padding: calc(16vw / 7.5) 0;
}
.select-tab>li.active.is-dom::after,
.select-tab>li.active.is-ovs::after{
  content: "";
  width: 0;
  height: 0;
  position: absolute;
  right: 0;
  bottom: calc(-32vw / 7.5);
  left: 0;
  margin: auto;
  border: calc(20vw / 7.5) solid transparent;
}
.select-tab>li.active.is-ovs::after{
  border-top: calc(20vw / 7.5) solid var(--default-color-ovs);
}
.select-tab>li.active.is-dom::after{
  border-top: calc(20vw / 7.5) solid var(--default-color-dom);
}
.select__content{
  display: none
}
.select__content.active{
  display: block;
}

/*** コンテンツ部分 ***/
.flex__content{
  display: flex;
  flex-wrap: wrap;
  gap: calc(32vw / 7.5);
}
.flex__content.ultra,
.flex__content.gakusei{
  margin-bottom: calc(32vw / 7.5);
}
.flex__content+.flex__content.gakusei{
  margin-top: calc(32vw / 7.5);
}
.content__wrapper{
  position: relative;
  width: 100%;
  border: calc(8vw / 7.5) solid;
  border-top: none;
  background: #FFF;
}
.is-ovs.content__wrapper{
  border-color: var(--default-color-ovs);
}
.is-dom.content__wrapper{
  border-color: var(--default-color-dom);
}
.is-gakusei.content__wrapper{
  border-color: var(--default-color-stu);
}
.flex__content.ultra .content__wrapper{
  border-color: var(--default-color-hatsu);
}
.is-ec.content__wrapper{
  border-color: var(--default-color-ec);
}
.plan__dst{
  font-size: calc(40vw / 7.5);
  font-weight: bold;
  color: #FFF;
  text-align: center;
  padding: calc(8vw / 7.5);
  line-height: 1.2;
  background: #333
}
.is-ovs .plan__dst{
  background: var(--default-color-ovs);
}
.is-dom .plan__dst{
  background: var(--default-color-dom);
}
.is-gakusei .plan__dst{
  background: var(--default-color-stu);
}
.flex__content.ultra .plan__dst{
  background: var(--default-color-hatsu);
}
.is-ec .plan__dst{
  background: var(--default-color-ec);
}

.notice__txt{
  width: 100%;
  margin: calc(40vw / 7.5) auto 0;
  font-weight: bold;
  color: var(--default-color-brown);
  text-align: center;
}
.notice__txt>small{
  width: fit-content;
  display: block;
  font-size: calc(30vw / 7.5);
  color: #FFF;
  background: var(--default-color-red);
  padding: calc(8vw / 7.5);
  margin: auto
}
.notice__txt>span{
  font-size: calc(40vw / 7.5);
}

.aori__txt{
  width: 100%;
  font-size: calc(46vw / 7.5);
  font-weight: bold;
  color: #FFF;
  background: var(--default-color-red);
  text-align: center;
  padding: calc(16vw / 7.5) 0;
}

/*表示部分*/
.plan__dspbox{
  padding: calc(16vw / 7.5);
}
.plan__title{
  color: var(--default-color-brown);
  font-weight: bold;
  padding: calc(16vw / 7.5);
  margin-bottom: calc(16vw / 7.5);
  background: #F2F2F2
}
.is-ovs .plan__title{
  background: var(--bg-color-ovs);
}
.is-dom .plan__title{
  background: var(--bg-color-dom);
}
.flex__content.ultra .plan__title{
  background: var(--bg-color-hatsu);
}
.is-ec .plan__title{
  background: var(--bg-color-ec);
}
.title__catch{
  font-size: calc(26vw / 7.5);
  display: block;
}
.flex__content.ultra .title__catch{
  font-size: var(--font-size-sp);
}
.title__main{
  font-size: calc(40vw / 7.5);
  line-height: 1.2
}
.title__main>small{
  font-size: calc(26vw / 7.5);
  display: block
}
.term__list>li:not(.note__txt){
  text-indent: -0.5em;
  padding-left: 0.5em;
}
.term__list>li>span{
  display: block;
}
.plan__items{
  margin-top: calc(24vw / 7.5);
}
.detail__midashi{
  font-size: calc(28vw / 7.5);
  font-weight: bold;
  border-left: calc(8vw / 7.5) solid;
  padding-left: calc(8vw / 7.5);
  margin-bottom: calc(8vw / 7.5);
}
.detail__txt{
  font-weight: bold;
  word-wrap: break-word;
}
.detail__txt>li a{
  font-weight: normal;
  color: var(--default-color-blue);
  text-decoration: underline
}
.note__txt{
  display: block;
  font-size: calc(22vw / 7.5);
  font-weight: normal;
  padding-left: 1.0em;
  text-indent: -1.0em;
}
.except__txt{
  display: block;
  font-size: calc(22vw / 7.5);
  font-weight: normal;
}

/** アコーディオン **/
.accordion__button{
  width: calc(360vw / 7.5);
  margin: auto auto calc(24vw / 7.5);
  border-radius: calc(40vw / 7.5);
  border: 1px solid #333;
  font-size: calc(26vw / 7.5);
  text-align: center;
  padding: calc(16vw / 7.5);
  position: relative
}
.accordion__button::after{
  content: "";
  background: var(--bg-img-setting);
  background-image: url("../img/ico_open.svg");
  width: calc(24vw / 7.5);
  height: calc(24vw / 7.5);
  position: absolute;
  top: 0;
  right: calc(24vw / 7.5);
  bottom: 0;
  margin: auto
}
.accordion__button.is-open::after{
  background-image: url("../img/ico_close.svg");
}
.plan__details{
  padding: calc(16vw / 7.5) calc(16vw / 7.5) calc(32vw / 7.5);
  display: none;
  font-weight: bold;
}
.plan__details>.plan__items:first-child{
  margin-top: 0
}

/** 利用方法 **/
.detail__txt.howto>li{
  font-weight: normal;
}
.detail__txt.howto>li>span{
  display: inline-block;
  background: #333;
  font-size: calc(22vw / 7.5);
  color: #FFF;
  padding: 0 calc(4vw / 7.5) calc(4vw / 7.5);
}
/** 注意事項 **/
.detail__txt.notice>li{
  font-size: calc(22vw / 7.5);
  font-weight: normal;
  padding-left: 1.0em;
  text-indent: -1.0em;
}
/*** 遷移ボタン ***/
.link__button{
  display: flex;
  flex-wrap: wrap;
  gap: calc(24vw / 7.5);
  margin: calc(24vw / 7.5) auto 0;
}
.link__button>a{
  display: block;
  width: 100%;
  margin: auto;
  background: var(--default-color-yellow);
  border-radius: 100px;
  box-shadow: var(--bg-button-shadow);
  font-size: calc(26vw / 7.5);
  font-weight: 700;
  text-align: center;
  padding: calc(16vw / 7.5) calc(24vw / 7.5);
  position: relative;
}
.link__button>a.ovs_button{
  background: var(--default-color-ovs);
  color: #FFF
}
.link__button>a.dom_button{
  background: var(--default-color-dom);
  color: #FFF
}
.link__button>a::after{
  content: "";
  background: var(--img-arrow-right) var(--bg-img-setting);
  width: calc(48vw / 7.5);
  height: calc(48vw / 7.5);
  position: absolute;
  top: 0;
  right: calc(8vw / 7.5);
  bottom: 0;
  margin: auto;
}
.link__button>a.ovs_button::after,
.link__button>a.dom_button::after{
  background: var(--img-arrow-right_wt)
}
.link__button.is-none::after{
  display: block;
  content: "※対象ツアーはございません"
}
.link__button>a.is-hide{
  display: none;
}


/*: 特典の場合＝tokuten__box使用 **/
.tokuten__box{
  background: var(--bg-color-gray);
  padding: calc(16vw / 7.5);
  margin-top: calc(16vw / 7.5);
}
.tokuten__midashi{
  color: #FFF;
  background-color: var(--default-color-ovs);
  display: inline-block;
  padding: 0 calc(4vw / 7.5);
  margin-bottom: calc(8vw / 7.5)
}
.detail__txt+.tokuten__midashi{
  margin-top: calc(24vw / 7.5);
}
.detail__txt.count{
  counter-reset: alphabet;
}
.detail__txt.count>li{
  counter-increment: alphabet;
  padding-left: 1.2em;
  position: relative;
}
.detail__txt.count>li::before{
  content: counter(alphabet, upper-alpha) ":";
  position: absolute;
  top: 0;
  left: 0;
}
.detail__txt.count>li+li:not(.tokuten__note){
  margin-top: calc(16vw / 7.5);
}
.pink__txt{
  color: var(--default-color-pink)
}
.link__txt{
  display: block;
  color: var(--default-color-blue);
  text-decoration: underline;
}
.tokuten__note{
  display: block;
  font-size: calc(22vw / 7.5);
}
.tokuten__txt_sub{
  background: linear-gradient(transparent 50%, #FF0 50%);
}
/*商品リスト*/
.product__list{
  margin-top: calc(16vw / 7.5);
  display: flex;
  flex-direction: column;
  gap: calc(8vw / 7.5)
}
.product__list> .product__list__midashi{
  width: 100%;
  font-weight: bold
}
.product__list>li>a.is-link{
  font-weight: normal;
  color: var(--default-color-blue);
  text-decoration: underline
}

/*** クーポンの場合＝coupon__box使用 ***/
.coupon__box{
  margin-top: calc(16vw / 7.5)
}
.coupon__list{
  display: flex;
  flex-wrap: wrap;
  gap: calc(16vw / 7.5);
}
.coupon__list>li{
  width: 100%;
  border-radius: calc(8vw / 7.5);
  box-shadow: var(--bg-shadow);
  background: var(--default-color-red);
  padding: calc(16vw / 7.5);
  color: #FFF;
  position: relative;
  display: flex;
  flex-direction: column;
}
.coupon__condition{
  text-align: center;
}
.coupon__price{
  font-family: 'Open Sans', sans-serif;
  font-weight: bold;
  letter-spacing: -0.05em;
  line-height: 1.0;
  text-align: center;
  padding-bottom: calc(8vw / 7.5);
}
.coupon__price .price__txt{
  font-size: calc(64vw / 7.5);
  font-weight: bold;
  display: block;
  padding: calc(8vw / 7.5)
}
.coupon__price em{
  font-size: calc(96vw / 7.5);
  font-weight: bold;    
}
.coupon__price .price__txt{
  font-size: calc(64vw / 7.5);
  font-weight: bold;    
}
.coupon__note{
  display: block;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: calc(24vw / 7.5);
  margin: calc(16vw / 7.5) auto calc(8vw / 7.5);
}
.coupon__code{
  font-size: calc(40vw / 7.5);
  font-weight: bold;
  color: #333;
  text-align: center;
  background: var(--bg-color-gray);
  padding: calc(8vw / 7.5) calc(40vw / 7.5) calc(8vw / 7.5) calc(8vw / 7.5);
  cursor: pointer;
  position: relative;
}
.coupon__code.s_txt{
  font-size: calc(30vw / 7.5);
}
.coupon__code::after {
  content: "";
  background: var(--img-copy) var(--bg-img-setting);
  width: calc(36vw / 7.5);
  height: calc(36vw / 7.5);
  position: absolute;
  top: calc(8vw / 7.5);
  right: calc(8vw / 7.5);
}
.coupon__code.is-none{
  display: none
}
.coupon__price:has(+.is-none)::after{
  content: "店舗にてご予約を承ります。";
  display: block;
  font-size: calc(30vw / 7.5);
  font-weight: bold;
  color: #333;
  text-align: center;
  background: #FFF;
  margin-top: calc(8vw / 7.5);
  padding: calc(16vw / 7.5);
}
.msgBoard{
  width: 100%;
  display: none;
  text-align: center;
}
/* クーポン終了 */
.coupon__list>li.is-end::before{
  content: "";
  background: rgba(0 0 0 / 70%);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.coupon__list>li.is-end::after{
  content: "受付終了";
  display: block;
  width: 4em;
  height: 1.5em;
  font-size: calc(48vw / 7.5);
  font-weight: bold;
  text-align: center;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}
.coupon__list>li.is-end .coupon__code{
  display: none
}

/***グルメ特典***/
.flex__content.food .plan__title{
  padding: calc(16vw / 7.5) 0 0;
}
.plan__img{
  width: 100%;
  height: calc(300vw / 7.5);
}
.plan__img>img{
  width: 100%;
  height: 100%;
  object-position: center;
  object-fit: cover
}
.flex__content.food .term__list>li{
  text-indent: 0;
  padding-left: 0
}
.flex__content.food .term__list>li>span{
  display: inline;
}

/*ハワイの対象商品*/
.flex__content.food .content__wrapper:first-child .plan__items.shipping .detail__txt>li>span{
  display: none
}

/***学生特典ページ導線バナー***/
.bnr__area{
  margin: calc(32vw / 7.5) auto;
  text-align: center;
}
.bnr__area>a{
  display: block;
}
.bnr__area.is-hide{
  display: none
}

/*ウルトラクーポンWOW+と高速バス */
.dom_ultra5 .detail__txt>li:nth-child(n+12),
.dom_ultra6 .detail__txt>li:nth-child(n+11),
.dom_ultra7 .detail__txt>li:nth-child(n+9){
  display: none
}
