@charset "UTF-8";
/* freepage 共通css */
#tblLayout {
  width: 100%;
  list-style: none;
  padding: 0;
  margin: 0 auto;
}

.item-category { width: 100%; margin: 0; padding: 0; line-height: 1.5; font-size: 16px; }
.item-category * { margin: 0; padding: 0; list-style: none; }
.item-category img { width: 100%; height: auto; vertical-align: bottom; }
@media screen and (max-width: 960px) {
.item-category img { width: 100%; height: auto; }
}
/*-- --*/
.spOnly { display: none; }
.pcOnly { display: block; }

/*-- レイアウト --*/
.item-category .item-category__mv > h1 {
  max-width: 1200px;
  margin: 0 auto calc(10 / 1200 * 100%);
}
.item-category .item-category__note {
  text-align: center;
}
.item-category .item-category__note::before {
  content: "※";
}

/*-- コンテンツ --*/
.item-category .item-category__contents  {
  width: 100%;
  padding-top: 60px;
}
.item-category .item-category__contents--bg-coupon {
  background-color: #DBF5FA;
  padding-bottom: 60px;
}

/*-- 見出し --*/
.item-category .item-category__ttl {
  width: 100%;
  background-color: #fff;
  padding: 0.5%;
  text-align: center;
  font-size: 26px;
  font-weight: bold;
  margin-bottom: calc(25 / 1200 * 100%);
}
.item-category .item-category__ttl--coupon10-off,
.item-category .item-category__ttl--coupon15-off {
  color: #fff;
}
.item-category .item-category__ttl--coupon10-off {
  background-color: #E75470;
}
.item-category .item-category__ttl--coupon15-off {
  background-color: #008F64;
}
.item-category .item-category__ttl--category {
  background-color: transparent;
  font-size: 40px;
}
.item-category .item-category__ttl-img {
  margin-bottom: calc(25 / 1200 * 100%);
}

/*-- セクション --*/
.item-category .item-category__nav-wrapper,
.item-category .item-category__section-wrapper {
  padding: calc(60 / 1200 * 100%) 0;
}
.item-category .item-category__nav-wrapper {
  background-color: #fff;
}
.item-category .item-category__section-wrapper--coupon10-off {
  background-color: #FFCAD4;
}
.item-category .item-category__section-wrapper--coupon15-off {
  background-color: #D7EBC1;
}
.item-category .item-category__nav,
.item-category .item-category__section {
  max-width: 1200px;
  margin: 0 auto calc(30 / 1200 * 100%);
}
.item-category .item-category__section--coupon {
  margin: 0 auto calc(50 / 1200 * 100%);
}
.item-category .item-category__section-inner {
  margin-bottom: calc(20 / 1200 * 100%);
}

/*-- ナビ --*/
.item-category .item-category__nav:last-child {
  margin-bottom: 0;
}
.item-category .item-category__nav__ttl {
  font-size: 26px;
  font-weight: 700;
  text-align: center;
  color: #fff;
  padding: 8px;
  margin-bottom: 10px;  
}
.item-category .item-category__nav__ttl--15off {
  background-color: #0C9E90;
}
.item-category .item-category__nav__ttl--10off {
  background-color: #E75470;
}

.item-category .item-category__nav-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5vw;
}
.item-category .item-category__nav-list__link {
  width: 100%;
  border-radius: 10px;
  position: relative;
}
.item-category .item-category__nav-list__link--15off {
  background-color: #CCEFEB;
  border: 5px solid #008F64;
}
.item-category .item-category__nav-list__link--10off {
  background-color: #FFD2DB;
}
.item-category .item-category__nav-list__link::before {
  content: "";
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #009966;
  position: absolute;
  top: 50%;
  right: 13px;
  transform: translateY(-50%);
}
.item-category .item-category__nav-list__link::after {
  content: "";
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #fff;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-25%);
  z-index: 1;
}
.item-category .item-category__nav-list__link > a {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  font-weight: 700;
  color: #000;
  padding: 24px 10px;
}

/*-- クーポンフェア --*/
.item-category .item-category__ttl-otoku {
  background-color: #00897C;
  padding: 15px 0;
}
.item-category .item-category__ttl-otoku__img {
  width: 580px;
  margin: auto;
}
.item-category .item-category__coupon {
  max-width: 1200px;
  margin: 0 auto 60px;
}
.item-category .item-category__coupon__inner {
  background-color: #fff;
  border-radius: 0 0 20px 20px;
  padding: 50px;
}
.item-category .item-category__coupon__campaign-list > li:nth-child(n+2) {
  margin-top: 3%;
}
.item-category .item-category__coupon__ttl {
  background-color: #513932;
  border-radius: 20px 20px 0 0;
  text-align: center;
  padding: 10px 0;
}
.item-category .item-category__coupon__ttl__img {
  width: 580px;
  margin: auto;
}
.item-category .item-category__coupon__item {
  width: calc(700 / 920 * 100%);
  margin: 0 auto;
}
.item-category .item-category__coupon-code {
  width: calc(700 / 920 * 100%);
  margin: 0 auto calc(50 / 920 * 100%);
}
.item-category .item-category__coupon-code--top {
  width: 100%;
  margin: 0 auto 0;
}
.item-category .item-category__coupon-code__ttl {
  color: #fff;
  font-size: 24px;
  text-align: center;
  background-color: #323232;
  padding: 10px;
}
.item-category .item-category__coupon-code__inner {
  border: 1px solid #323232;
  background-color: #fff;
  border-top: none;
  position: relative;
  padding: 15px;
}
.item-category .coupon-code-txt {
  font-size: 300%;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}
.item-category .coupon-btn {
  width: 22%;
  background-color: #e4e4e4;
  border: 1px solid #777777;
  border-radius: 8px;
  font-size: 22px;
  padding: 10px 0;
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
  cursor: pointer;
  outline: none;
  text-align: center;
}
.item-category .item-category__coupon-details {
  max-width: 1000px;
  margin: 0 auto;
}
.item-category .item-category__coupon-details__ttl {
  background-color: #1e1e1e;
  text-align: center;
  font-size: 26px;
  font-weight: 700;
  color: #fff;
  padding: 0.5em 4em;
  position: relative;
  cursor: pointer;
}
.item-category .item-category__coupon-details__ttl::before,
.item-category .item-category__coupon-details__ttl::after {
  display: block;
  content: "";
  background-color: #fff;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  transition: transform .3s;
}
.item-category .item-category__coupon-details__ttl::after {
  width: 5px;
  height: 42px;
  right: calc(2em + 18px);
}
.item-category .item-category__coupon-details__ttl::before {
  width: 42px;
  height: 5px;
  right: 2em;
}
.item-category .item-category__coupon-details[open] .item-category__coupon-details__ttl::after {
  transform: translateY(-50%) rotate(90deg);
}
.item-category .item-category__coupon-details__ttl::-webkit-details-marker {
  display: none;
}
.item-category .item-category__coupon-details__inner {
  background-color: #fff;
  border: 1px solid #1e1e1e;
  text-align: left;
  line-height: 1.6;
  padding: 20px;
}
.item-category .item-category__coupon-details__section + .item-category__coupon-details__section {
  margin-top: 20px;
}
.item-category .item-category__coupon-details__section-ttl {
  font-weight: 700;
}
.item-category .item-category__coupon-details__notes-list > li {
  text-indent: -1em;
  padding-left: 1em;
}
.item-category .item-category__coupon-details__notes-list > li::before {
  content: "※";
}
.item-category .item-category__coupon-details__notes-red {
  color: #e60012;
}
.item-category .item-category__coupon-details__num-list > li {
  text-indent: -1.3em;
  padding-left: 1.3em;
}

/*-- カテゴリーリスト --*/
.item-category .item-category__category-list {
  max-width: 1000px;
  margin: 0 auto 30px;
}
.item-category .item-category__category-list__list {
  width: 1000px;
  display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: calc(15 / 1000 * 100%);
    margin: auto;
}
.item-category .item-category__category-list__txt {
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  margin-top: 20px;
}
.item-category .item-category__category-list__txt > small {
  font-size: 10px;
  vertical-align: top;
}
.item-category .item-category__category-list__txt--last {
  font-size: 18px;
  margin-top: 10px;
}

/*-- 商品リスト --*/
.item-category .item-category__item-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: calc(40 / 1200 * 100%);
}
.item-category .item-category__item-list > li{
  width: calc(290 / 1200 * 100%);
}
.item-category .item-category__item-list > li:nth-child(n+5) {
  margin-top: calc(20 / 1200 * 100%);
}
.item-category .item-category__item-list::before {
  content: "";
  display: block;
  width: calc(290 / 1200 * 100%);
  order: 1;
}
.item-category .item-category__item-list::after {
  content: "";
  display: block;
  width: calc(290 / 1200 * 100%);
}

/*-- トップに戻るボタン --*/
.item-category .item-category__top-btn {
  width: calc(468 / 1200 * 100%);
  margin: 0 auto calc(60 / 1200 * 100%);
}
.item-category .item-category__top-btn:last-child {
  margin-bottom: 0;
}
.item-category .item-category__txt-link {
  width: 100%;
  max-width: 500px;
  background-color: #0017AE;
  border-radius: 30px;
  margin: 0 auto 5%;
}
.item-category .item-category__txt-link > a {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0.6em 0.2em;
  font-size: 20px;
  color: #fff;
  text-decoration: none;
  text-align: center;
  border-radius: 30px;
  word-break: break-all;
}
.item-category .item-category__txt-link > a::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 15px;
  width: 9px;
  height: 9px;
  margin: auto;
  border-top: 2px solid #fff;
  border-left: 2px solid #fff;
  transform: translateY(-2px) rotate(135deg);
  box-sizing: border-box;
}

/*-- 導線バナー --*/
.item-category .item-category__other-list {
  width: calc(468 / 1200 * 100%);
    margin: calc(60 / 1000 * 100%) auto calc(30 / 1000 * 100%);
}

.item-category .item-category__other-list > li:first-child {
  margin-bottom: calc(20 / 1000 * 100%)
}

/*-- 追従バナー --*/
.item-category .item-category__point-bnr {
  display: block;
  position: fixed;
  right: 0;
  bottom: 50px;
  z-index: 4;
}
.item-category .item-category__point-bnr > a {
  display: block;
}

@media screen and (max-width: 960px) {
  .spOnly { display: block; }
  .pcOnly { display: none; }

  .item-category .item-category__mv {
    padding: 0 3%;
  }

  /*-- レイアウト --*/
  .item-category .item-category__contents {
    padding: 5% 0;
  }
  .item-category .item-category__contents--top {
    padding: 5% 0 0;
  }

  /*-- ナビ --*/
  .item-category .item-category__nav-wrapper {
    padding-inline: 3%;
  }
  .item-category .item-category__nav__ttl {
    font-size: 18px;
  }

  .item-category .item-category__nav-list {
    gap: 1.5vw;
  }
  .item-category .item-category__nav-list__link {
    border-radius: 7px;
  }
  .item-category .item-category__nav-list__link--15off  {
    border: 3px solid #008F64
  }
  .item-category .item-category__nav-list__link::before {
    width: 20px;
    height: 20px;
    right: 5px;
  }
  .item-category .item-category__nav-list__link::after {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #fff;
    right: 10px;
  }
  .item-category .item-category__nav-list__link > a {
    font-size: 12px;
    padding: 15px 25px 15px 15px;
  }

  /*-- 見出し --*/
  .item-category .item-category__ttl {
    font-size: 16px;
    padding: 8px 0;
  }
  .item-category .item-category__medicine-ttl__ttl {
        width: 30%;
        font-size: 12px;
        padding: 7px 10px 5px;
  }
  .item-category .item-category__medicine-ttl__txt {
        width: 70%;
        font-size: 12px;
        padding: 7px 10px 5px;
  }

  /*-- 商品リスト --*/
  .item-category .item-category__section-wrapper {
    padding-inline: 3%;
    margin-inline: auto;
  }

  /*-- クーポン --*/
  .item-category .item-category__ttl-otoku {
    padding: 10px 0;
  }
  .item-category .item-category__ttl-otoku__img {
    width: 60%;
  }
  .item-category .item-category__coupon {
    padding-inline: 3%;
    margin: 0 auto 3%;
  }
  .item-category .item-category__coupon__ttl {
    border-radius: 10px 10px 0 0;
    padding: 5px;
  }
  .item-category .item-category__coupon__ttl__img {
    width: 80%;
  }
  .item-category .item-category__coupon__inner {
    border-radius: 0 0 10px 10px;
    padding: calc(50 / 1000 * 100%);
  }
  .item-category .item-category__coupon__item,
  .item-category .item-category__coupon-code {
    width: 100%;
  }
  .item-category .item-category__coupon-code__ttl {
    font-size: 14px;
    padding: 5px;
  }
  .item-category .item-category__coupon-code__inner {
    padding: 5px;
  }
  .item-category .coupon-code-txt {
    font-size: 180%;
    padding-right: 90px;
  }
  .item-category .coupon-btn {
    width: 80px;
    font-size: 12px;
    right: 7px;
    padding: 5px 0;
  }
  /*-- アコーディオン --*/
  .item-category .item-category__coupon-details__inner {
    font-size: 15px;
    padding: 5%;
  }
  .item-category .item-category__coupon-details__ttl {
    font-size: 14px;
  }
  .item-category .item-category__coupon-details__ttl::after {
    width: 3px;
    height: 25px;
    right: calc(1em + 11px);
  }
  .item-category .item-category__coupon-details__ttl::before {
    width: 25px;
    height: 3px;
    right: 1em;
  }
  .item-category .item-category__coupon__img {
    width: calc(900/ 1000 * 100%);
    margin: 10px auto 0;
  }
  .item-category .item-category__top-btn {
    width: calc(700 / 1000 * 100%);
  }
  .item-category .item-category__txt-link {
    width: 70%;
    margin: 0 auto 10%;
  }
  .item-category .item-category__txt-link > a {
    font-size: 15px;
  }
  .item-category .item-category__txt-link > a::after {
    transform: translateY(-1px) rotate(135deg);
  }

  /*-- カテゴリーリスト --*/
  .item-category .item-category__category-list {
    padding-inline: 3%;
    margin: 0 auto 5%;
  }
  .item-category .item-category__category-list__list {
    grid-template-columns: repeat(3, 1fr);
    width: 100%;
    gap: 2%;
  }
  .item-category .item-category__category-list__txt {
    font-size: 11px;
    margin-top: 5%;
  }
  .item-category .item-category__category-list__txt--last {
    font-size: 10px;
    margin-top: 2%;
  }
  .item-category .item-category__category-list__txt > small {
    font-size: 8px;
  }

  /*-- 小バナーエリア --*/
  .item-category .item-category__item-list > li {
    width: 49%;
  }

  .item-category .item-category__item-list > li:nth-child(n+3) {
    margin-top: calc(20 / 1000 * 100%);
  }

  /*-- 導線バナー --*/
  .item-category .item-category__other-list {
    width: 95%;
  }

  /*-- 追従バナー --*/
  .item-category .item-category__point-bnr {
    width: 15%;
    bottom: 65px;
  }
}