@charset "utf-8";
/* CSS Document */

/* 202409 変更・追記cssは430行目付近から

/*------------------------------------*/
/*大セクション（class="section__xxx"）*/
/*------------------------------------*/
/*余白・サイズ*/
.section__main,
.section__info{
  width: 100%;
  margin: 0 auto 70px;
  position: relative;
}
@media (min-width: 1024px) {
  .section__main,
  .section__info{
    width: 70%;
    margin: 0 auto 80px;
  }
}
/*-----キャンペーン一覧だけ-----*/
@media (max-width: 1024px) {
  .section__main.campaign_list{
    font-size: 1.2rem;
    line-height: 2.2rem;
  }
}
/*-~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-*/
/*------------------------------------*/
/*benefit提携企業施設一覧       */
/*------------------------------------*/
/*-~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-*/
/*------------------------------------*/
/*メニュー（タグフィルター）                    */
/*------------------------------------*/
/*-----メニュー-----*/
div.menu > form.benefit_filter{
  padding: 0;
  border: solid 1px #aaa;
  border-radius: 10px;
  overflow: hidden; /*border-radiusが子要素に効くように*/
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
  min-height: 50px;
}
div.menu > form.benefit_filter > label{
  display: flex;
  width: 20%;
  padding: 0.5em;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-color: transparent;
}
div.menu > form.benefit_filter > label:not(:last-child){
  border-right: solid 1px #aaaaaa;
}
div.menu > form.benefit_filter > label.checked{
  background-color: orange;
  color: #fefefe;
  font-weight: 600;
  transition: all .2s; /*アニメーション設定*/
}
div.menu > form.benefit_filter > label > input{
  display: none;
}
div.section__main.benefit_top p.about{
  padding: 0 1em;
}
/*------------------------------------*/
/*リスト全体       */
/*------------------------------------*/
div.section__main.benefit_top dl.benefit_list{
  display: flex;
  flex-wrap: wrap;
  padding: 1em;
}
/*-----フィルターによる表示非表示-----*/
div.section__main.benefit_top dl.benefit_list > a.benefit_list__wrapper.hidden{
  display: none;
  margin-right: 0;
}
div.section__main.benefit_top dl.benefit_list > a.benefit_list__wrapper.shown{
  display: flex;
}
/*-----リスト幅調整-----*/
div.section__main.benefit_top dl.benefit_list > a.benefit_list__wrapper.shown{
  width: 48%;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-right: 4%;
  padding: 1.4rem 0;
  border-bottom: dashed 2px #aaaaaa;
}
div.section__main.benefit_top dl.benefit_list > a.benefit_list__wrapper.shown.list-nomargin{
  margin-right: 0;
}
@media (min-width: 800px) {
  div.section__main.benefit_top dl.benefit_list > a.benefit_list__wrapper.shown{
    width: 32%;
    margin-right: 2%;
  }
}

/*------------------------------------*/
/*リスト内       */
/*------------------------------------*/
/*-----カテゴリー-----*/
div.section__main.benefit_top dl.benefit_list > a.benefit_list__wrapper dd.category{
  font-size: 1.0rem;
  width: 100%;
}
@media (min-width: 800px) {
  div.section__main.benefit_top dl.benefit_list > a.benefit_list__wrapper dd.category{
    width: 80%;
  }
}
div.section__main.benefit_top dl.benefit_list > a.benefit_list__wrapper dd.category > span{
  border: solid 1px #aaaaaa;
  display: inline-block;
  width: 8.0rem;
  text-align: center;
  line-height: 1.6rem;
  background-color: #fefefe;
}
/*-----画像部分-----*/
div.section__main.benefit_top dl.benefit_list > a.benefit_list__wrapper > dd.logo{
  text-align: center;
}
div.section__main.benefit_top dl.benefit_list > a.benefit_list__wrapper img.logo{
  width: 100%;
  aspect-ratio: 16 / 9;
  background-color: #eeeeee;
  border: solid 1px #e7e7e7;
}
@media (min-width: 800px) {
  div.section__main.benefit_top dl.benefit_list > a.benefit_list__wrapper img.logo{
    width: 80%;
  }
}
/*-----企業・施設名-----*/
div.section__main.benefit_top dl.benefit_list > a.benefit_list__wrapper > dt.name{
  font-weight: 600;
  font-size: 1.6rem;
}


/*-~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-*/
/*------------------------------------*/
/*benefit提携企業施設Post       */
/*------------------------------------*/
/*-~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-*/
/*追従ボタン　section__floatfooterにかぶらないようにする*/
main.benefit_post .followbtn{
  bottom: 80px;
}
/*------------------------------------*/
/*section__main内                  */
/*------------------------------------*/
div.section__main.benefit_post > div.mainimage > img{
  display: block;
  margin: 0 auto;
}
/*------------------------------------*/
/*section__info内                  */
/*------------------------------------*/
div.section__info.benefit_post{
  counter-reset: specialcounter 0;
}
div.section__info.benefit_post.special{
  margin-bottom: 40px;
}
div.section__info.benefit_post h3{
  font-size: 1.8rem;
  text-align: center;
  background-color: #dddddd;
  padding: 0.8rem;
  margin-bottom: 0.7rem;
}
div.section__info__content{
  padding: 1em;
  margin-bottom: 2.8rem;
  margin-top: 0;
}
/*------------------------------------*/
/*section__info内 通常の見出し        */
/*------------------------------------*/
div.section__info h4{
  border-left: solid 2px #5b9bd5;
  border-bottom: solid 1px #5b9bd5;
  padding: 0 1.0rem;
  margin-top: 1.4rem;
  font-size: 1.6rem;
}
div.section__info h4::first-letter{
  font-size: 2.4rem;
  color: #1755aa;
}
/*------------------------------------*/
/*section__info内 特典の見出し        */
/*------------------------------------*/
div.section__info h4.special{
  position: relative;
  margin-top: 4.0rem;
}
/*-----特典のリボン-----*/
div.section__info h4.special::before{
  counter-increment: specialcounter 1;
  content: "特典"counter(specialcounter)" ";
  display: inline-block;
  position: absolute;
  transform: translateY(-100%);
  left: 0;
  top: -10px;
  width: 7.2rem;
  background-color: #1755aa;
  color: #fefefe;
  font-weight: 600;
  font-family: meiryo;
  font-size: 1.2rem;
  padding-left: 1.2rem;
}
div.section__info h4.special::after{
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-right: solid 1.4rem #fefefe;
  border-top: solid 1.2rem transparent;
  border-bottom: solid 1.2rem transparent;
  border-left: none;
  position: absolute;
  transform: translateY(-100%);
  left: calc(8.4rem - 2.5rem);
  top: -10px;
}
@media (min-width: 800px) {
  div.section__info h4.special{
    padding-left: 9.0rem;
  }
  div.section__info h4.special::before{
    counter-increment: specialcounter 1;
    content: "特典"counter(specialcounter)" ";
    position: absolute;
    transform: translateY(0);
    left: 10px;
    top: 0;
    display: inline-block;
    width: 7.2rem;
    background-color: #1755aa;
    color: #fefefe;
    font-weight: 600;
    font-family: meiryo;
    font-size: 1.2rem;
    padding-left: 1.2rem;
  }
  div.section__info h4.special::after{
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    border-right: solid 1.4rem #fefefe;
    border-top: solid 1.2rem transparent;
    border-bottom: solid 1.2rem transparent;
    border-left: none;
    position: absolute;
    transform: translateY(0);
    left: calc(8.4rem - 1.5rem);
    top: 0;
  }
}
/*------------------------------------*/
/*section__info内 特典内容        */
/*------------------------------------*/
/*-----キャンペーン-----*/
div.benefit_post.special.campaign{
  padding: 1em;
  margin-bottom: 2.8rem;
}
div.section__info.benefit_post div.benefit_post.special.campaign div.term.centerlized__wrapper,
div.section__info.benefit_post div.benefit_post.special.campaign div.btn__wrapper{
  margin: 0 auto;
}
div.section__info.benefit_post div.term.centerlized__wrapper > dl.term{
  text-align: center;
}
div.section__info.benefit_post div.term.centerlized__wrapper > dl.term > dt{
  display: inline-block;
  padding: 0 3.5rem;
  position: relative;
}
div.section__info.benefit_post div.term.centerlized__wrapper > dl.term > dt::before,
div.section__info.benefit_post div.term.centerlized__wrapper > dl.term > dt::after{
  content: "";
  height: 2px;
  width: 2.8rem;
  background-color: #5b9bd5;
  position: absolute;
  transform: translateY(-50%);
  top: 50%;
}
div.section__info.benefit_post div.term.centerlized__wrapper > dl.term > dt::before{
  left: 0;
}
div.section__info.benefit_post div.term.centerlized__wrapper > dl.term > dt::after{
  right: 0;
}
div.section__info.benefit_post div.term.centerlized__wrapper > dl.term > dd{
  font-weight: 600;
  font-size: 1.6rem;
  padding: 0 0.8rem;
  margin-bottom: 1.4rem;
}
div.section__info__content.benefit_post.special > div.centerlized__wrapper.special.about{
  margin-top: 0.7rem;
  font-size: 1.6rem;
}
dl.special_info.benefit_post{
  margin: 1.4rem 0 2.8rem;
}
dl.special_info.benefit_post > div{
  margin-bottom: 2.1rem;
}
dl.special_info.benefit_post > div > dt{
  display: inline-block;
  width: 12.0rem;
  height: 2.4rem;
  text-align: center;
  border-bottom: dashed 1px #aaaaaa;
  margin-bottom: 0.7rem;
  font-weight: 600;
  font-size: 1.2rem;
  flex-shrink: 0;
}
@media (min-width: 800px) {
  dl.special_info.benefit_post > div{
    display: flex;
  }
  dl.special_info.benefit_post > div > dt{
    margin-right: 1.4rem;
  }
}
/*-----手順-----*/
dl.special_info.benefit_post > div.step > dd > ol.step > li:last-child{
  margin-bottom: 0;
}


/*-----各チェック、申込ボタン-----*/
p.errormsg.hidden{
  display: none;
}
div.section__info.benefit_post.special input.hidden{
  display: none;
}
div.section__info.benefit_post.special div.btn__wrapper.checkandbutton{
  display: flex;
  flex-direction: column;
  align-items: center;
}
div.section__info.benefit_post.special div.btn__wrapper.checkandbutton input[type="checkbox"]{
  scale: 1.3;
}

/*------------------------------------*/
/*section__info内 店舗等情報        */
/*------------------------------------*/
dl.section__info__content__about > div{
  margin-bottom: 1.4rem;
}
dl.section__info__content__about > div:not(.access),
dl.section__info__content__about > div.access > div.access__wrapper{
  display: flex;
}
dl.section__info__content__about dt{
  flex-shrink: 0;
  display: inline-block;
  width: 12.0rem;
  height: 2.4rem;
  text-align: center;
  border-bottom: dashed 1px #aaaaaa;
  margin-bottom: 0.7rem;
  margin-right: 0.7rem;
  font-weight: 600;
  font-size: 1.2rem;
}
dl.section__info__content__about > div > dd > p{
  padding-left: 0.7rem;
}
dl.section__info__content__about > div.contact dd.tel::before{
  content: "";
  display: inline-block;
  width: 1.1rem;
  height: 1.1rem;
  background-image: url(../images/common/icon-tel2.png);
  background-size: contain;
  background-position: center;
  margin: 0 0.3rem;
}
dl.section__info__content__about > div.access ul.access_list > li{
  font-size: 1.2rem;
  line-height: 2.0rem;
}
/*-----マップ用-----*/
dl.section__info__content__about > div.access dd.map{
  margin: 0 auto;
  padding: 0.7rem;
  width: 100%;
  height: 300px;
}
dl.section__info__content__about > div.access dd.map > iframe {
  width: 100%;
  height: 100%;
}
@media (min-width: 1024px) {
  dl.section__info__content__about > div.access dd.map{
    max-width: 100%;
    width: 700px;
    height: 400px;
  }
}



/*------------------------------------------------------*/
/*202409 変更・追記css
/*------------------------------------------------------*/

/*------------------------------------*/
/*大セクション（class="section__xxx"）*/
/*------------------------------------*/
/*余白・サイズ*/
main{
    margin-top: 50px;
}

.section__main,
.section__info{
    width: 96%;
    max-width: 900px;
}