@charset "UTF-8";
/*
特設サイト追記部分
*/
/*----------------------------------------------------
  全体
----------------------------------------------------*/
body {}
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
/*------------------------------------------------------------------------------------------clearfix、マージン関連*/
.clearfix {
  *zoom: 1;
}
.clearfix:after {
  content: ' ';
  display: table;
  clear: both;
}
/*------------------------------------------------------------------------------------------WEBフォント*/
.webfont {
  font-family: "itc-avant-garde-gothic-pro", sans-serif;
  font-weight: 600;
  font-style: normal;
}
/*----------------------------------------------------
  PCとタブレット・スマホの切り替え
----------------------------------------------------*/
.nonpc {
  display: block;
}
.pc {
  display: none;
}
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ブレークポイント・PC*/
@media screen and (min-width: 768px) {
  .nonpc {
    display: none;
  }
  .pc {
    display: block;
  }
}
img {
  vertical-align: bottom;
}
/*------------------------------------------------------------------------------------------a*/
a {
  opacity: 1;
  color: #000;
  text-decoration: none;
  transition: all 0s;
}
a:active, a:hover, a:focus {
  color: #000;
  outline: 0;
}
.overwhite {
  background-color: #ffffff;
  display: block;
  opacity: 1;
}
.overwhite:hover img {
  text-decoration: none;
  filter: alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
}
@media screen and (min-width: 1200px) {
  a, .overwhite img {
    transition: all .3s;
  }
}
/* ====================================================
 footer（マージンを消す）
==================================================== */
/* footer style */
#l-footer {
  margin-top: 0;
}
@media screen and (min-width: 1200px) {
  #l-footer {
    margin-top: 0;
  }
}
@media screen and (min-width: 768px) and (max-width: 1199px) {
  #l-footer {
    margin-top: 0;
  }
}
#l-footer .footer-pagetop { /*z-index調整*/
  z-index: 10;
}
/* ====================================================
　c-mainImg
==================================================== */
#c-mainImg {
  width: 100%;
  height: 100%;
  margin: 0 0 10% 0;
  padding: 0;
  text-align: center;
}
#c-mainImg img {
  width: 100%;
  min-width: 100%;
  height: auto;
  margin: 0 auto;
}
/* ====================================================
　btnList
==================================================== */
#btnList {
  width: 100%;
  padding: 0 5%;
  margin: 0 0 10% 0;
}
#btnList ul li {
  text-align: left;
  color: #333;
  font-size: 90%;
  font-weight: bold;
  border: 1px solid #ccc;
}
#btnList ul li a {
  display: block;
  width: 100%;
  height: auto;
  padding: 3%;
  transition: all 0s;
  text-decoration: none;
}
#btnList ul li.list_card {
  border: 1px solid #ccc;
  overflow: hidden;
  background: #fff;
  text-align: center;
}
#btnList ul li.list_card a {
  color: #333;
  display: block;
  height: 100%;
}
#btnList ul li.list_card a:hover {
  background: #fff;
  filter: alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
}
/*------------------------------------------------------------------------------------------矢印*/
.c-btn-arrow_r {
  display: block;
  width: 100%;
  margin: 0;
  text-decoration: none;
  line-height: 1.3;
  position: relative;
  transition: all .0s;
}
.c-btn-arrow_r:after {
  content: '';
  display: block;
  position: absolute;
  right: 3%;
  top: 50%;
  margin-top: -4px;
  padding-right: 5px;
  width: 8px;
  height: 8px;
  border-top: 2px solid #767676;
  border-right: 2px solid #767676;
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.c-btn-arrow_r:hover:after {
  border-top: 2px solid #ccc;
  border-right: 2px solid #ccc;
}
/*------------------------------------------------------------------------------------------改行位置*/
br.sp {
  display: inline;
}
@media screen and (min-width: 1200px) {
  br.sp {
    display: none;
  }
  br.pc {
    display: inline;
  }
}
/* ====================================================
　content
==================================================== */
.c-content {
  width: 100%;
  margin: 0 0 15% 0;
}
.l_content_wrap {
  width: 100%;
  padding: 0 5%;
}
/* ====================================================
　アンカーナビゲーション
==================================================== */
#anchorNav {
  width: 100%;
  margin: 15% 0;
  background: #fff0f8;
}
#anchorNav li {
  width: 50%;
  float: left;
  text-align: center;
  color: #333;
  background: #fff0f8;
  text-align: center;
  font-size: calc(1.5rem + ((1vw - 3.2px) * 2.2321)); /* 24px @ 320px increasing to 34px @ 768px */
  /* Note: The calc base value (1.125rem) MUST be stated in REM to maintain accessibility */
  /* Where: 2.2321 = 100 * font-size_difference / viewport_width_difference */
  font-feature-settings: "palt";
  line-height: 1.4;
}
#anchorNav li:nth-child(3n) {
  background: none;
}
#anchorNav li:nth-child(2), #anchorNav li:nth-child(3), #anchorNav li:nth-child(6), #anchorNav li:nth-child(7) {
  background: #ffcce7;
}
/*#anchorNav li img {
  max-width: 30%;
  height: auto;
  vertical-align: middle;
}*/
#anchorNav li a {
  display: block;
  width: 100%;
  height: auto;
  padding: 6% 0;
  transition: all .0s;
  text-decoration: none;
}
#anchorNav li a:hover {
  color: rgba(51, 51, 51, 0.8);
  background: rgba(255, 255, 255, 0.25);
}
/* ====================================================
　各ブロック
==================================================== */
.s-contentbox01 {
  width: 100%;
  margin: 0 0 14% 0;
}
.s-contentbox01:last-child {
  width: 100%;
  margin: 0;
}
.s-contentbox01:before {
  content: " ";
  margin-top: -72px;
  height: 72px;
  display: block;
  visibility: hidden;
}
.c-content h2 {
  width: 100%;
  height: 100%;
  margin: 0 auto 5% auto;
  text-align: left;
  overflow: hidden;
  position: relative;
  font-size: calc(2.25rem + ((1vw - 3.2px) * 2.2321)); /* 36px @ 320px increasing to 46px @ 768px */
  /* Note: The calc base value (1.125rem) MUST be stated in REM to maintain accessibility */
  /* Where: 2.2321 = 100 * font-size_difference / viewport_width_difference */
  font-feature-settings: "palt";
  line-height: 1.4;
  padding: 0 0 0 0.3rem;
  color: #fff;
  border-bottom: 4px solid #e3007f;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
/*見出しの背景を斜めにする*/
.skewX {
  width: auto;
  display: inline-block;
  transform: skew(-10deg);
  background: #e3007f;
}
.c-content h2 span, .skewX span {
  width: 100%;
  height: 100%;
  display: inline-block;
  transform: skewX(10deg);
  padding: 0 2rem;
}
/* ====================================================
　ショップリスト
==================================================== */
.shop_listBox {
  /*display: block;*/
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  justify-content: space-between;
}
.shop_list {
  width: calc(50% - 8% / 2);
  padding: 0 0 5% 0;
  margin: 0 0 6% 0;
}
/* 最後の要素 + 最後から２つ目のliが奇数の場合、その要素 */
.shop_list:last-child, .shop_list:nth-last-child(2):nth-child(odd) {
  padding-bottom: 0;
  margin-bottom: 0;
}
.shop_list .list-thumb {
  display: block;
  width: 100%;
}
.shop_list .list-thumb > dt {
  width: 70%;
  margin: 0 auto 5% auto;
  border: 1px solid #ccc;
  background: #fff;
}
.shop_list .list-thumb > dt:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
  min-height: 100px; /* 任意のmin-heightを入力 */
}
.shop_list .list-thumb > dt img {
  height: auto;
  vertical-align: middle;
}
.shop_list .list-thumb > dt a {
  position: relative;
  display: block;
}
.shop_list .list-thumb > dd {
  display: inline-block;
  width: 100%;
  position: relative;
}
.shop_list .shop_name, .shop_list .shop_name02 {
  padding: 0 0 1% 0;
  margin: 0 0 5% 0;
  line-height: 1.25em;
  font-weight: bold;
  font-size: calc(1rem + ((1vw - 3.2px) * 1.5625)); /* 16px @ 320px increasing to 23px @ 768px */
  /* Where: 1.5625 = 100 * font-size_difference / viewport_width_difference */
  font-feature-settings: "palt";
  letter-spacing: .025em;
  word-break: break-all;
  text-justify: inter-ideograph;
  text-align: center;
}
.shop_list .shop_name a, .shop_list .shop_name02 a {
  text-decoration: none;
}
.shop_list .shop_name span {
  font-size: 90%;
  display: block;
}
.shop_list .lead {
  width: 100%;
  font-size: calc(0.875rem + ((1vw - 3.2px) * 2.2321)); /* 14px @ 320px increasing to 24px @ 768px */
  /* Where: 2.2321 = 100 * font-size_difference / viewport_width_difference */
  font-feature-settings: "palt";
  letter-spacing: .025em;
  word-break: break-all;
  text-justify: inter-ideograph;
  font-weight: bold;
  line-height: 1.6;
  overflow: hidden;
  color: #e60011;
  background: #fff0f8;
  padding: 4%;
}
.shop_list .lead02 {
  width: 100%;
  font-size: calc(0.875rem + ((1vw - 3.2px) * 2.2321)); /* 14px @ 320px increasing to 24px @ 768px */
  /* Where: 2.2321 = 100 * font-size_difference / viewport_width_difference */
  font-weight: bold;
  line-height: 1.3;
  overflow: hidden;
  color: #333;
  background: #e0f3ff;
  padding: 2%;
  position: absolute;
  bottom: 0;
}
.shop_list .lead span.caution_l, .shop_list .lead02 span.caution_l, .shop_list .lead span.caution_r, .shop_list .lead02 span.caution_r {
  color: #333;
  font-size: 80%;
  display: block;
}
.border {
  /*border-bottom: 1px dotted #b3b3b3;*/
}
.notes01 {
  font-size: calc(0.75rem + ((1vw - 3.2px) * 2.2321)); /* 12px @ 320px increasing to 22px @ 768px */
  /* Where: 2.2321 = 100 * font-size_difference / viewport_width_difference */
  padding: 5%;
  margin: 0 5%;
  border: 1px solid #ccc;
}
/*リンクボックス*/
.linkbox {
  position: relative;
}
.linkbox a {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  text-indent: -9999px;
  opacity: 1;
}
.linkbox a:hover {
  filter: alpha(opacity=50); /* IE 6,7*/
  -ms-filter: "alpha(opacity=50)"; /* IE 8,9 */
  -moz-opacity: 0.5; /* FF , Netscape */
  -khtml-opacity: 0.5; /* Safari 1.x */
  opacity: 0.5;
  zoom: 1; /*IE*/
  background: #fff;
}
@media screen and (min-width: 1200px) {
  .linkbox a, .linkbox a:hover {
    transition: all .3s;
  }
}
/*----------------------------------------------------
  バナー
----------------------------------------------------*/
.btnBox {
  width: 100%;
  margin: 4% 0;
  text-align: center;
  color: #fff;
  font-size: 120%;
}
.btnBox li {
  margin: 20px 0;
}
.btnBox img {
  width: 100%;
  min-width: 100%;
  height: auto;
  margin: 0 auto;
}
/* ====================================================
　以下ブレークポイント設定
==================================================== */
/*----------------------------------------------------ブレークポイント・PCサイズ以上*/
@media screen and (min-width: 1200px) {
  #c-mainImg {
    width: 100%;
    height: 100%;
    margin: 0 0 70px 0;
    padding: 0;
    text-align: center;
  }
  #btnList {
    margin: 0 0 70px 0;
  }
  #btnList ul {
    width: 100%;
    max-width: 550px;
    margin: 0 auto;
  }
  #btnList ul li {
    width: 100%;
    font-size: 100%;
  }
  #btnList ul li.list_card img {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
  }
  #btnList ul li a {
    width: 100%;
    padding: 15px;
    transition: all 0.3s;
  }
  .c-content {
    width: 100%;
    margin: 0 0 100px 0;
  }
  .l_content_wrap {
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    padding: 0;
  }
  #anchorNav {
    width: 100%;
    max-width: 1080px;
    margin: 100px auto;
    background: #fff0f8;
  }
  #anchorNav li {
    width: 25%;
    height: auto;
    font-size: 171%;
  }
  /*#anchorNav li img {
    max-width: 16.5%;
    height: auto;
    vertical-align: middle;
  }*/
  #anchorNav li a {
    height: auto;
    padding: 10px 0;
    transition: all 0.3s;
  }
  #anchorNav li a:hover {
    transition: all .3s;
  }
  #anchorNav li:nth-child(3n) {
    background: none;
  }
  #anchorNav li:nth-child(2), #anchorNav li:nth-child(4), #anchorNav li:nth-child(5), #anchorNav li:nth-child(7) {
    background: #ffcce7;
  }
  .s-contentbox01 {
    width: 100%;
    margin: 0 0 90px 0;
  }
  .s-contentbox01:before {
    content: " ";
    margin-top: -100px;
    height: 100px;
    display: block;
    visibility: hidden;
  }
  .c-content h2 {
    margin: 0 auto 30px auto;
    font-size: 258%;
    padding: 0 0 0 4.5px;
    border-bottom: 2px solid #e3007f;
  }
  .shop_listBox {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .shop_list {
    width: calc(50% - 50px / 2);
    padding: 0 0 0 0;
    margin: 0 0 50px 0;
  }
  .shop_list .list-thumb {
    display: flex;
    width: 100%;
  }
  .shop_list .list-thumb > dt {
    width: 35%;
    margin: 0 3% 0 0;
  }
  .shop_list .list-thumb > dt:before {
    min-height: 172px; /* 任意のmin-heightを入力 */
  }
  .shop_list .list-thumb > dt img {
    height: auto;
    vertical-align: middle;
  }
  .shop_list .list-thumb > dt a {
    position: relative;
    display: block;
  }
  .shop_list .list-thumb > dd {
    display: table-cell;
    width: 65%;
    position: relative;
  }
  .shop_list .lead, .shop_list .lead02 {
    font-size: 100%;
    position: absolute;
    bottom: 0;
  }
  .shop_list .shop_name, .shop_list .shop_name02 {
    font-size: 114%;
    text-align: left;
  }
  .shop_list .lead, .shop_list .lead02 {
    padding: 10px;
    font-size: 100%;
  }
  .shop_list .lead span.caution_l, .shop_list .lead02 span.caution_l {
    font-size: 90%;
    display: inline;
    padding: 0 1em 0 0;
  }
  .shop_list .lead span.caution_r, .shop_list .lead02 span.caution_r {
    font-size: 90%;
    display: inline;
    padding: 0 0 0 1em;
  }
  .border {
    border-bottom: none;
  }
  .notes01 {
    margin: 0;
    padding: 30px;
    font-size: 85%;
  }
}
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ブレークポイント・タブレットサイズ以上PCサイズ以下*/
@media screen and (min-width: 768px) and (max-width: 1199px) {
  #c-mainImg {
    margin: 0 0 7% 0;
    padding: 0;
    text-align: center;
  }
  #btnList {
    padding: 0;
    margin: 0 0 7% 0;
  }
  #btnList ul {
    width: 80%;
    max-width: 500px;
    margin: 0 auto;
  }
  .c-content {
    width: 100%;
    margin: 0 0 10% 0;
  }
  .l_content_wrap {
    width: 100%;
    margin: 0 auto;
  }
  #anchorNav {
    width: 100%;
    margin: 12% 0;
  }
  #anchorNav li {
    width: 25%;
    font-size: calc(1.5rem + ((1vw - 7.68px) * 2.3202)); /* 24px @ 768px increasing to 34px @ 1199px */
  }
  #anchorNav li:nth-child(3n) {
    background: none;
  }
  #anchorNav li:nth-child(2), #anchorNav li:nth-child(4), #anchorNav li:nth-child(5), #anchorNav li:nth-child(7) {
    background: #ffcce7;
  }
  #anchorNav li a {
    height: auto;
    padding: 15px 0;
  }
  /*#anchorNav li img {
    max-width: 18%;
    height: auto;
    vertical-align: middle;
  }*/
  .s-contentbox01 {
    margin: 0 0 9% 0;
  }
  .c-content h2 {
    margin: 0 auto 3% auto;
    font-size: calc(2.25rem + ((1vw - 7.68px) * 2.3202)); /* 36px @ 768px increasing to 46px @ 1199px */
    padding: 0 0 0 0.3rem;
  }
  .shop_listBox {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .shop_list {
    width: calc(50% - 5% / 2);
    padding: 0 0 3% 0;
    margin: 0 0 3% 0;
  }
  .shop_list .list-thumb {
    display: block;
    width: 100%;
  }
  .shop_list .list-thumb > dt {
    width: 40%;
    margin: 0 auto 3% auto;
  }
  .shop_list .list-thumb > dt:before {
    min-height: 108px; /* 任意のmin-heightを入力 */
  }
  .shop_list .list-thumb > dd {
    display: inline-block;
    width: 100%;
    position: relative;
  }
  .shop_list .shop_name, .shop_list .shop_name02 {
    font-size: calc(1rem + ((1vw - 7.68px) * 1.6241)); /* 16px @ 768px increasing to 23px @ 1199px */
    /* Where: 1.8561 = 100 * font-size_difference / viewport_width_difference */
    margin: 0 0 3% 0;
    text-align: center;
  }
  .shop_list .lead, .shop_list .lead02 {
    font-size: calc(0.875rem + ((1vw - 7.68px) * 1.3921)); /* 14px @ 768px increasing to 20px @ 1199px */
    /* Where: 1.3921 = 100 * font-size_difference / viewport_width_difference */
  }
  .border {
    border-bottom: none;
  }
  .notes01 {
    padding: 3%;
    font-size: calc(0.75rem + ((1vw - 7.68px) * 1.8149)); /* 12px @ 768px increasing to 22px @ 1319px */
    /* Note: The calc base value (0.75rem) MUST be stated in REM to maintain accessibility */
    /* Where: 1.8149 = 100 * font-size_difference / viewport_width_difference */
  }
}