﻿/* CSS Document */
/*====================================================
全体
====================================================*/
/* フェード設定 */
.fadein {
  opacity: 0;
  transition: all ease 0.8s;
}
@keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
br {
  font-size: 0;
}
/*カラー共通　ここの色を変えれば全体が変わる*/ :root {
  --main-color: #0196b4;
  --sub-color: #dcdcdc;
  --accent-color: #e53934;
  --black-color: #292b2c;
  --yutai_back: #edf7fa;
  --yutai_all_back: #fff;
  --sports: #ed8700;
  --ninchishou: #98cb00;
  --kaigo: #3297cb;
  --reform: #009798;
}
.pc {
  display: block !important;
}
.sp {
  display: none !important;
}
/* 画面100%表示用↓ここから */
.mainContentMT {
  /*width: 100%;*/
}
/*　パンくずの表示くずれ防止　*/
.rootMT ul {
  overflow: hidden;
  width: 940px;
  margin: 0 auto;
}
/* 画面100%表示用↑ここまで */
#rcm_menu {
  font-family: Noto Sans JP, Hiragino Kaku Gothic ProN, Meiryo, sans-serif;
  font-feature-settings: "palt";
  margin-bottom: 15px;
}
/* ↓ここからヘッダー画像↓ */
/* ヘッダー画像 */
#rcm_menu img {
  text-align: center;
  /*width: 100%;*/
}
#head img {
  width: auto;
}
#rcm_menu #head {
  margin: 0;
}
#rcm_menu .head {
  width: 100%;
  text-align: center;
}
#btn_all {
  width: 100%;
  background: #fff;
  margin: 30px auto;
}
#btn_all .title {
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  margin: 0 auto 1em;
  color: var(--black-color);
  line-height: 1.2;
}
#btn_all .title span {
  display: inline-block;
  padding-bottom: .2em;
  border-bottom: 3px solid #292b2c;
  margin-bottom: .5em;
}
.btn_all {
  display: flex;
  justify-content: space-around;
  width: 940px;
  margin: 0 auto;
}
.btn a {
  box-sizing: border-box;
  width: calc(940px / 3 - 30px);
  text-align: center;
  display: block;
  transition: all ease .3s;
  margin: auto;
  position: relative;
}
ul.btn_all.pc {
  display: flex !important;
  justify-content: space-around;
  padding-bottom: 30px;
}
ul.btn_all.pc li:first-child, ul.btn_all.pc li:nth-child(3) {
  border-left: 1px solid #dcd3a8;
  border-right: 1px solid #dcd3a8;
  padding-top: 20px;
  padding-bottom: 20px;
}
ul.btn_all.pc li:nth-child(2) {
  padding-top: 20px;
  padding-bottom: 20px;
}

li.btn a img {
  transition: all 1s ease-out;
  -webkit-transition: all 1s ease-out;
  -moz-transition: all 1s ease-out;
  -o-transition: all 1s ease-out;
  -ms-transition: all 1s ease-out;
}
ul.btn_all.pc li.btn a:hover img {
  opac ity: 0;
}
ul.btn_all.pc li.btn.omiyage a {
  background: url("../img/btn01_a.jpg") no-repeat;
  background-position: center;
}
ul.btn_all.pc li.btn.buffet a {
  background: url("../img/btn02_a.jpg") no-repeat;
  background-position: center;
}
ul.btn_all.pc li.btn.lunch a {
  background: url("../img/btn03_a.jpg") no-repeat;
  background-position: center;
}
ul.btn_all.pc li.btn.omiyage.on a, ul.btn_all.pc li.btn.buffet.on a, ul.btn_all.pc li.btn.lunch.on a {
  pointer-events: none;
}
ul.btn_all.pc li.btn.omiyage.on a img, ul.btn_all.pc li.btn.buffet.on a img, ul.btn_all.pc li.btn.lunch.on a img {
  opacity: 0;
}
.btn a:link, .btn a:visited {
  text-decoration: none;
}
.bikou {
  text-align: right;
  margin: 1em;
  font-size: 14px;
}
@media screen and (min-width: 768px) {}
/* ↑ここまでヘッダー画像↑ */
@media screen and (min-width: 768px) {
  /* 表示行数の位置調整 */
  .leisureLayoutMT .layer02MT {
    width: 940px;
    margin: 0 auto;
  }
  .layer02MT {
    height: 0px;
  }
  /* 表示行数 */
  .displayMT {
    overflow: hidden;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 100;
    margin-right: 20px;
    font-family: Noto Sans JP, Hiragino Kaku Gothic ProN, Meiryo, sans-serif;
    font-weight: bold;
  }
}
/* 表示行数 */
.displayMT dl dt {
  color: var(--black-color);
}
/* 1・2・・・次・最後 */
.pagingMT {
  margin-left: 30px;
}
/* 1・2・・・次・最後 */
.pagingMT li a {
  color: var(--black-color);
}
/* 1・2・・・次・最後 */
.pagingMT li.active {
  color: var(--black-color);
}
/* 表示行数下の水色線の削除 */
.punctuationMT {
  background: none;
  margin-bottom: 40px;
}
/* ページ全体背景 */
.leisureLayoutMT {
  background-color: var(--yutai_all_back);
}
/* 紐づけ優待全体 */
.leisureBox01MT {
  color: var(--black-color);
  background-color: var(--yutai_back);
  font-family: Noto Sans JP, Hiragino Kaku Gothic ProN, Meiryo, sans-serif;
  font-feature-settings: "palt";
  width: 940px;
  box-sizing: border-box;
  margin: 40px auto 0px;
  padding: 30px 40px 30px 40px;
  border: 1px solid var(--yutai_back);
}
.leisureLayoutMT h3.txtB {
  font-size: 12px;
}
/* 優待メニュータイトル */
.leisureBox01MT a {
  color: var(--black-color);
  font-size: 23px;
}
/* 特典内容欄 */
.leisureLayoutMT .leisureBox01MT .privilegeMT {
  border: none;
}
/* 特典内容欄　枠線 */
.leisureLayoutMT .leisureBox01MT .privilegeMT dl {
  background: none;
  border: none;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
}
/* 特典1 */
.leisureLayoutMT .leisureBox01MT .privilegeMT dt {
  float: inherit;
  position: inherit;
  top: inherit;
  margin: inherit;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  background-color: var(--main-color);
  border: solid 1px var(--main-color)
}
/* 特典内容欄　長さ */
.leisureLayoutMT .leisureBox01MT .privilegeMT dd {
  width: 850px;
  padding: 10px;
  box-sizing: border-box;
  font-size: 15px;
  border: solid 1px var(--main-color);
  margin: 0;
  /*border-top: none;*//*★★なぜかnoneで設定してあった。なぜ？？？特典2の上部線が消えちゃう★★*/
}
.leisureLayoutMT .leisureBox01MT .privilegeMT dl:first-child dd {
  border-top: solid 1px var(--main-color);
}
/* 特典内容欄　強調 */
.leisureLayoutMT dd .txtRed {
  color: var(--accent-color);
  font-weight: bold;
  font-size: 18px;
}
/* 優待紹介テキスト　位置調整 */
.leisureBox01MT .innerMT {
  display: flex;
}
/* 優待紹介テキスト　位置調整 */
.leisureBox01MT .txtBoxMT {
  width: 594px;
  float: none;
}
/* 優待紹介テキスト */
.leisureBox01MT .txtBoxMT p.mb10 {
  font-size: 15px;
  line-height: 2;
  text-align: justify;
  max-height: 8rem;
  margin: 0 !important;
  position: relative;
}
.leisureLayoutMT .ImgBoxMT img {
  border: none;
}
@media screen and (min-width: 768px) {
  /* 優待紹介テキスト　グラデ背景 */
  p.mb10::before {
    content: "";
    width: 100%;
    height: 8rem;
    display: block;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 50%, var(--yutai_back) 80%);
    position: absolute;
    top: 0;
  }
  .leisureBox01MT .txtBoxMT p.txt14b.mb10::before {
    display: none;
  }
  /*特典内容はログイン後に表示　テキスト*/
  .leisureLayoutMT .leisureBox01MT .privilegeMT p a::before {
    content: "※特典内容はログイン後に表示されます";
    width: 100%;
    height: 100%;
    text-align: center;
    display: block;
    font-weight: 700;
    font-size: 15px;
    padding: 10px;
    border: solid 2px var(--main-color);
    box-sizing: border-box;
    background-color: #fff;
  }
  /*ログイン後に特典表示の画像削除*/
  .privilegeMT p a img {
    display: none;
  }
}
/*↓ ここからスマホ ↓*/
@media screen and (max-width: 767px) {
  .pc, ul.btn_all.pc {
    display: none !important;
  }
  .sp {
    display: block !important;
  }
  #rcm_menu .head {
    height: inherit;
    width: 100%;
  }
  #rcm_menu .head img {
    width: 100%;
    padding: 0;
    position: relative;
    left: inherit;
    transform: inherit;
  }
  #rcm_menu .head a {
    right: 2vw;
    bottom: 2vw;
    width: 25vw;
    height: 25vw;
  }
  .bikou {
    text-align: left;
    margin: 0.5em;
    font-size: 3.5vw;
  }
  #btn_all {
    margin: 8vw auto 0;
  }
  #btn_all .title {
    font-size: 6vw;
    margin: 0 auto 4vw;
  }
  .btn_all {
    width: 100%;
    box-sizing: border-box;
    flex-wrap: wrap;
  }
.btn a {
    box-sizing:inherit;
    width:inherit;
    text-align:inherit;
    display:inherit;
    transition:none;
    margin: auto;
    position: inherit;
}
ul.btn_all.sp {
    width: 95%;
	padding-bottom: 20px;
}

ul.btn_all.sp li.btn {
    width: 90%;
    padding: 18px 10px;
    border-top: 1px solid #dcd3a8;
}
	ul.btn_all.sp li.btn:last-child {
    border-bottom: 1px solid #dcd3a8;
}
  .recommended a:active, .recommended a:active::after, .recommended a:active p::after {
    color: var(--black-color);
    border-color: var(--black-color);
  }
  .sports a:active, .sports a:active::after, .sports a:active p::after {
    color: var(--sports);
    border-color: var(--sports);
  }
  .ninchishou a:active, .ninchishou a:active::after, .ninchishou a:active p::after {
    color: var(--ninchishou);
    border-color: var(--ninchishou);
  }
  .kaigo a:active, .kaigo a:active::after, .kaigo a:active p::after {
    color: var(--kaigo);
    border-color: var(--kaigo);
  }
  .reform a:active, .reform a:active::after, .reform a:active p::after {
    color: var(--reform);
    border-color: var(--reform);
  }
  #fftop_recomDetail .reBox {
    padding: 0px;
  }
  #rcm_menu {
    font-size: 0;
    margin-bottom: 3.947vw;
  }
  /* ヘッダー画像 */
  #rcm_menu img {
    text-align: center;
    width: 100%;
  }
  /*　全体背景　*/
  .leisureLayoutMT {
    background-color: var(--yutai_all_back);
  }
  /* 全体フォント */
  section.leisureBox02MT.mb20 {
    font-family: Noto Sans JP, Hiragino Kaku Gothic ProN, Meiryo, sans-serif;
    color: var(--black-color);
  }
  /* 全体フォント */
  article p {
    color: inherit;
    font-size: inherit;
    line-height: inherit;
  }
  /* 表示行数 */
  #fftop_recomDetail .displayMT {
    margin: 0;
  }
  /* 表示行数 */
  #fftop_recomDetail .displayMT dl dt {
    display: table-cell;
    width: 5em;
    font-size: 3.947vw;
    padding-left: 10px;
    color: var(--black-color);
    font-weight: bold;
    font-family: Noto Sans JP, Hiragino Kaku Gothic ProN, Meiryo, sans-serif;
  }
  /* 表示行数 */
  #fftop_recomDetail .displayMT dl dd {
    font-weight: bold;
    font-family: Noto Sans JP, Hiragino Kaku Gothic ProN, Meiryo, sans-serif;
  }
  /* 1 2 3 次 最後　ボタン */
  #fftop_recomDetail .pagingMT {
    margin: 20px auto 10px;
  }
  /* 1 2 3 次 最後　ボタン */
  #fftop_recomDetail .pagingMT li {
    background-color: #fff;
    color: var(--black-color);
    font-size: 3.947vw;
    font-weight: bold;
    font-family: Noto Sans JP, Hiragino Kaku Gothic ProN, Meiryo, sans-serif;
  }
  /* 1 2 3 次 最後　ボタン */
  .recmPager .pagingMT li a {
    color: var(--main-color);
  }
  /* 全体枠 */
  #fftop_recomDetail .leisureBox02MT .BlocMT {
    background: var(--yutai_back) !important;
    margin: 3.947vw auto;
    padding: 8vw 3vw 8vw 3vw;
    width: 95vw;
    border: none;
  }
  /* カテゴリ名 */
  .leisureLayoutMT h3.txtB {
    background: none;
    padding: 0;
    color: inherit;
    font-size: 3.2vw;
    margin: 0 auto 0.25rem;
  }
  /* 写真・優待内容レイアウト */
  #fftop_recomDetail .leisureBox02MT .BlocMT .innerMT {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  /* 写真 pタグ */
  #fftop_recomDetail .leisureBox02MT .innerMT .ImgBoxMT {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto 0.5rem;
  }
  /* 写真　imgタグ*/
  #fftop_recomDetail .leisureBox02MT .innerMT .ImgBoxMT img {
    display: block;
    width: 100%;
    height: auto;
    box-sizing: border-box;
  }
  /*　おすすめ画像　*/
  ul.NumMT li img {
    width: 16vw;
    height: auto;
  }
  /*　申込番号　*/
  #fftop_recomDetail .leisureBox02MT .innerMT .txtBoxMT .NumMT li {
    font-size: 3.2vw;
    color: var(--black-color);
  }
  /* 優待名 */
  #fftop_recomDetail .leisureBox02MT .innerMT .txtBoxMT h4 {
    color: var(--black-color);
    font-size: 5vw;
    margin: 10px 0 10px;
  }
  /* 会員特典 */
  #fftop_recomDetail .leisureBox02MT p.privilegeHeading {
    font-size: 4.2vw;
    font-weight: 600;
    color: #fff;
    background-color: var(--main-color);
    padding: 0.25rem 0.5rem;
    margin-top: 0.5rem;
  }
  /* 会員特典の枠 */
  #fftop_recomDetail .leisureBox02MT .privilegeMT {
    background: #fff;
    border: 0.1em solid var(--main-color);
    padding: 0;
  }
  /* 会員特典欄内の枠　個々 */
  #fftop_recomDetail .leisureBox02MT .privilegeMT dl {
    font-size: 3.947vw;
    color: var(--black-color);
    padding: 0.5rem;
    border-bottom: solid var(--main-color) 0.1em;
    box-sizing: border-box;
  }
  #fftop_recomDetail .leisureBox02MT .privilegeMT dl:last-child {
    border: none;
  }
  /* 会員特典欄内のテキスト */
  #fftop_recomDetail .leisureBox02MT .privilegeMT dl dd {
    font-size: 3.947vw;
    color: var(--black-color);
    padding: 0;
  }
  /* 会員特典欄内のテキスト　強調 */
  .leisureLayoutMT dd .txtRed {
    font-size: 4.5vw;
  }
  /*ログイン後に特典表示の画像削除*/
  #fftop_recomDetail .leisureBox02MT .privilegeMT p img {
    display: none;
  }
  /*ログイン後に特典表示のテキスト*/
  #fftop_recomDetail .leisureBox02MT .privilegeMT p::before {
    content: "※特典内容はログイン後に表示されます";
    width: 100%;
    height: 100%;
    text-align: center;
    display: block;
    font-weight: 700;
    font-size: 3.947vw;
    box-sizing: border-box;
    padding: 1rem 0;
    background-color: #fff;
  }
}