.introduct-item__ttl {
    font-weight: 400;
}

.introduct-item__layout + .introduct-item__img img {
  margin-inline: auto;
}

@media only screen and (min-width: 641px) {
  .safety-wrap img {
    width: auto;
  }

  .p-header-nav {
      display:flex;
      justify-content: flex-start;
      -moz-column-gap: 20px;
      column-gap: 20px
  }

  .p-header-nav__item {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: center;
      row-gap: 5px
  }

  .p-header-nav__item.pc_only {
      display: flex
  }

  .p-header-nav__item--btn {
      cursor: pointer
  }

  .p-header-nav__item--btn:hover {
      opacity: .6
  }

  .p-header-nav__icon img {
      width: auto
  }

  .p-header-nav__txt {
      color: #3c1e0f;
      font-size: 1.5rem
  }
}

@media only screen and (max-width: 640px) {
  .p-header-nav {
      display:flex;
      justify-content: flex-start;
      -moz-column-gap: min(calc((15 / 640) * 100vw), 15px);
      column-gap: min(calc((15 / 640) * 100vw), 15px)
  }

  .p-header-nav__item {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: center;
      row-gap: 5px
  }

  .p-header-nav__item.sp_only {
      display: flex
  }

  .p-header-nav__item--fix {
      width: min(calc((70 / 640) * 100vw), 70px)
  }

  .p-header-nav__item--fix.sp_only {
      display: flex;
      justify-content: center
  }

  .p-header-nav__icon img {
      height: min(calc((32 / 640) * 100vw), 32px);
      width: auto
  }

  .p-header-nav__txt {
      color: #3c1e0f;
      font-size: min(calc((14.5 / 640) * 100vw), 14.5px)
  }
}

@media only screen and (min-width: 641px) {
  .p-header-font {
      display:flex;
      justify-content: space-between;
      align-items: center
  }

  .p-header-font__label {
      font-size: 15px
  }

  .p-header-font__select-area {
      display: flex;
      width: 110px;
      box-sizing: border-box;
      border: 1px solid #614623
  }

  .p-header-font__select {
      width: 50%;
      padding: 5px 0;
      font-size: 15px;
      color: #614623;
      text-align: center
  }

  .font_large .p-header-font__select--large {
      background-color: #614623;
      color: #fff
  }

  .font_middle .p-header-font__select--middle {
      background-color: #614623;
      color: #fff
  }
}

@media only screen and (min-width: 641px) {
  .p-header-search {
      position:relative
  }

  .p-header-search__input {
      width: 100%;
      padding: 5px;
      box-sizing: border-box;
      font-size: 13px
  }

  .p-header-search__img {
      position: absolute;
      right: 5px;
      top: 50%;
      transform: translateY(-50%)
  }
}

@media only screen and (max-width: 640px) {
  .p-header-search {
      width:100%;
      position: relative;
      box-sizing: border-box;
      border-radius: 10px
  }

  .p-header-search__input {
      width: min(calc((480 / 640) * 100vw), 480px);
      height: min(calc((70 / 640) * 100vw), 70px);
      padding: min(calc((20 / 640) * 100vw), 20px) min(calc((30 / 640) * 100vw), 30px);
      box-sizing: border-box;
      border: 1px solid #614623;
      border-radius: 8px 0 0 8px;
      font-size: min(calc((25 / 640) * 100vw), 25px);
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
  }

  .p-header-search__img {
      width: min(calc((80 / 640) * 100vw), 80px);
      height: min(calc((70 / 640) * 100vw), 70px);
      padding: min(calc((15 / 640) * 100vw), 15px) min(calc((20 / 640) * 100vw), 20px);
      box-sizing: border-box;
      border-radius: 0 8px 8px 0;
      background: linear-gradient(to bottom, #917d65 50%, #614623 50%);
      position: absolute;
      right: 0;
      top: 50%;
      transform: translateY(-50%);
      z-index: 10
  }
}

@media only screen and (min-width: 641px) {
  .p-header-acc {
      width:100%;
      height: 0;
      overflow: hidden;
      transition: height .3s ease;
      background-color: #f7f6f4;
      position: absolute;
      top: 100%;
      left: 50%;
      transform: translateX(-50%);
      z-index: 100;
      box-sizing: border-box
  }

  .p-header-acc.open {
      border-top: 2px solid #614623
  }

  .p-header-acc__inner {
      width: 1200px;
      margin-left: auto;
      margin-right: auto;
      padding-top: 30px;
      padding-bottom: 40px
  }

  .p-header-acc__layout {
      display: flex;
      -moz-column-gap: 30px;
      column-gap: 30px
  }

  .p-header-acc__left {
      width: 320px
  }

  .p-header-acc__right {
      width: 850px
  }

  .p-header-acc__ttl {
      font-size: 30px;
      font-weight: bold
  }

  .p-header-acc__list {
      display: flex;
      flex-direction: column;
      row-gap: 15.5px;
      margin-top: 30px
  }

  .p-header-acc__list--column2 {
      flex-direction: row;
      flex-wrap: wrap;
      row-gap: 30px;
      -moz-column-gap: 30px;
      column-gap: 30px
  }

  .p-header-acc__list--column2 a {
      width: 410px
  }

  .p-header-acc__main {
      margin-top: 30px
  }

  .p-header-acc__close {
      width: 170px;
      margin-top: 50px;
      margin-left: auto;
      margin-right: auto
  }
}

@media only screen and (min-width: 641px) {
  .p-header-product-list {
      display:flex;
      flex-wrap: wrap;
      justify-content: flex-start;
      -moz-column-gap: 30px;
      column-gap: 30px;
      row-gap: 20px
  }

  .p-header-product-list__item {
      width: 215px
  }

  .p-header-product-list__item--long {
      width: 460px
  }

  .p-header-product-list--column4 .p-header-product-list__item {
      width: 275px
  }
}

@media only screen and (min-width: 641px) {
  .p-header-product-card {
      width:100%;
      display: inline-block;
      border: 1px solid #614623;
      border-radius: 10px;
      box-sizing: border-box
  }

  .p-header-product-card__img {
      line-height: 0
  }

  .p-header-product-card__img img {
      width: 100%
  }
}

@media only screen and (min-width: 641px) {
  .p-header-ranking-card {
      width:100%;
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding-top: 10px;
      border: 1px solid #614623;
      border-radius: 10px;
      background-color: #fff;
      box-sizing: border-box;
      position: relative
  }

  .p-header-ranking-card__package {
      text-align: center;
      line-height: 0
  }

  .p-header-ranking-card__package img {
      width: 80%;
      margin: 0 auto
  }

  .p-header-ranking-card__tags {
      margin: 5px
  }

  .p-header-ranking-card__link {
      margin-top: 6px
  }

  .p-header-ranking-card::before {
      content: "";
      width: 60px;
      height: 55px;
      position: absolute;
      top: -4px;
      left: 15px;
      background-size: 100% auto;
      background-repeat: no-repeat
  }

  .p-header-ranking-card--1::before {
      background-image: url(/shared/assets/img/common/header/ranking_num_1.png)
  }

  .p-header-ranking-card--2::before {
      background-image: url(/shared/assets/img/common/header/ranking_num_2.png)
  }

  .p-header-ranking-card--3::before {
      background-image: url(/shared/assets/img/common/header/ranking_num_3.png)
  }

  .p-header-ranking-card--4::before {
      background-image: url(/shared/assets/img/common/header/ranking_num_4.png)
  }

  .p-header-ranking-card--5::before {
      background-image: url(/shared/assets/img/common/header/ranking_num_5.png)
  }

  .p-header-ranking-card--6::before {
      background-image: url(/shared/assets/img/common/header/ranking_num_6.png)
  }

  .p-header-ranking-card--7::before {
      background-image: url(/shared/assets/img/common/header/ranking_num_7.png)
  }

  .p-header-ranking-card--8::before {
      background-image: url(/shared/assets/img/common/header/ranking_num_8.png)
  }

  .p-header-ranking-card--9::before {
      background-image: url(/shared/assets/img/common/header/ranking_num_9.png)
  }

  .p-header-ranking-card--10::before {
      background-image: url(/shared/assets/img/common/header/ranking_num_10.png)
  }
}

@media only screen and (min-width: 641px) {
  .c-arrow-btn {
      display:flex;
      flex-direction: column;
      justify-content: center;
      row-gap: 10px;
      width: 100%;
      padding: 15px 20px;
      border: 1px solid #614623;
      border-radius: 10px;
      box-sizing: border-box
  }

  .c-arrow-btn--right {
      position: relative
  }

  .c-arrow-btn--right::before {
      content: "";
      width: 18px;
      height: 18px;
      background-image: url(/shared/assets/img/common/header/icon/arrow_black.png);
      background-repeat: no-repeat;
      background-size: 100% auto;
      position: absolute;
      right: 20px;
      top: 50%;
      transform: translateY(-50%)
  }

  .c-arrow-btn--right15 {
      right: 15px
  }

  .c-arrow-btn--registration {
      padding: 20px
  }

  .c-arrow-btn--registration::before {
      top: auto;
      bottom: 20px;
      transform: none
  }

  .c-arrow-btn--registration .c-arrow-btn__ttl {
      padding-left: 30px;
      position: relative
  }

  .c-arrow-btn--registration .c-arrow-btn__ttl::before {
      content: "";
      width: 18px;
      height: 26px;
      background-image: url(/shared/assets/img/common/header/icon/registration.png);
      background-repeat: no-repeat;
      background-size: 100% auto;
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%)
  }

  .c-arrow-btn__ttl {
      font-size: 2.2rem
  }

  .c-arrow-btn__note {
      font-size: 1.6rem
  }

  .c-arrow-btn__txt {
      font-size: 2.1rem;
      line-height: 1.4
  }

  .c-arrow-btn__txt--small {
      font-size: 2rem;
      letter-spacing: -1.2px
  }

  .c-arrow-btn__txt--small-small {
      font-size: 1.8rem
  }

  .c-arrow-btn--brown {
      flex-direction: row;
      background-color: #614623
  }

  .c-arrow-btn--brown .c-arrow-btn__txt {
      color: #fff
  }

  .c-arrow-btn--brown.c-arrow-btn--right::before {
      background-image: url(/shared/assets/img/top/icon/arrow_03.png)
  }

  .c-arrow-btn--icon {
      flex-direction: row
  }

  .c-arrow-btn--icon::after {
      content: "";
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%)
  }

  .c-arrow-btn--qa::after {
      width: 30px;
      height: 28px;
      background-image: url(/shared/assets/img/common/header/icon/qa.png);
      left: 20px
  }

  .c-arrow-btn--potage::after {
      width: 26px;
      height: 24px;
      background-image: url(/shared/assets/img/common/sidenav/icon/potage.png);
      left: 10px
  }

  .c-arrow-btn--nouen::after {
      width: 34px;
      height: 34px;
      background-image: url(/shared/assets/img/common/sidenav/icon/nouen.png);
      left: 12px
  }

  .c-arrow-btn--shun::after {
      width: 20px;
      height: 25px;
      background-image: url(/shared/assets/img/common/sidenav/icon/shun.png);
      left: 15px
  }
}

@media only screen and (min-width: 641px) {
  .c-arrow-big-btn {
      display:flex;
      align-items: center;
      -moz-column-gap: 20px;
      column-gap: 20px;
      width: 100%;
      padding: 25px 20px;
      border: 1px solid #614623;
      border-radius: 10px;
      box-sizing: border-box;
      color: #614623
  }

  .c-arrow-big-btn--right {
      position: relative
  }

  .c-arrow-big-btn--right::before {
      content: "";
      width: 18px;
      height: 18px;
      background-image: url(/shared/assets/img/common/header/icon/arrow_black.png);
      background-repeat: no-repeat;
      background-size: 100% auto;
      position: absolute;
      right: 20px;
      top: 50%;
      transform: translateY(-50%)
  }

  .c-arrow-big-btn--brown {
      background-color: #614623;
      color: #fff
  }

  .c-arrow-big-btn--brown::before {
      background-image: url(/shared/assets/img/common/header/icon/arrow_white.png)
  }

  .c-arrow-big-btn__icon {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 60px
  }

  .c-arrow-big-btn__cont {
      display: flex;
      flex-direction: column;
      row-gap: 10px
  }

  .c-arrow-big-btn__ttl {
      font-size: 2.8rem
  }

  .c-arrow-big-btn__note {
      font-size: 1.6rem
  }

  .c-arrow-big-btn__txt {
      font-size: 2.2rem;
      line-height: 1.5
  }

  .c-arrow-big-btn__txt--small {
      letter-spacing: -1.2px
  }
}

@media only screen and (min-width: 641px) {
  .c-close-btn {
      padding:10px 60px 10px 40px;
      background-color: #614623;
      border-radius: 50px;
      box-sizing: border-box;
      position: relative;
      cursor: pointer
  }

  .c-close-btn__txt {
      color: #fff;
      font-size: 2.2rem
  }

  .c-close-btn::before {
      content: "";
      width: 18px;
      height: 18px;
      background-image: url(/shared/assets/img/common/header/icon/close.png);
      background-repeat: no-repeat;
      background-size: 100% auto;
      position: absolute;
      right: 20px;
      top: 50%;
      transform: translateY(-50%)
  }

  .c-close-btn:hover {
      opacity: .6
  }
}

@media only screen and (max-width: 640px) {
  .c-close-btn {
      display:flex;
      justify-content: center;
      padding: min(calc((30 / 640) * 100vw), 30px) 0;
      background-color: #efece9
  }

  .c-close-btn__txt {
      display: flex;
      align-items: center;
      color: #614623;
      font-size: min(calc((25 / 640) * 100vw), 25px);
      position: relative
  }

  .c-close-btn__txt::after {
      content: "";
      display: inline-block;
      width: min(calc((30 / 640) * 100vw), 30px);
      height: min(calc((30 / 640) * 100vw), 30px);
      margin-left: min(calc((15 / 640) * 100vw), 15px);
      background-image: url(/shared/assets/img/common/sidenav/sp/close.png);
      background-repeat: no-repeat;
      background-size: 100% auto
  }
}

@media only screen and (min-width: 641px) {
  .c-header-card-link {
      display:flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      color: #614623;
      background-color: #fff;
      border-radius: 0 0 10px 10px;
      box-sizing: border-box;
      position: relative
  }

  .c-header-card-link::before {
      content: "";
      width: 18px;
      height: 18px;
      background-image: url(/shared/assets/img/common/header/icon/arrow_black.png);
      background-repeat: no-repeat;
      background-size: 100% auto;
      position: absolute;
      right: 10px;
      top: 50%;
      transform: translateY(-50%)
  }

  .c-header-card-link--h50 {
      height: 50px
  }

  .c-header-card-link--h60 {
      height: 60px
  }

  .c-header-card-link--h70 {
      height: 70px
  }

  .c-header-card-link__txt {
      padding-right: 10px;
      font-size: 1.8rem;
      line-height: 1.4;
      text-align: center
  }

  .c-header-card-link__txt--small {
      font-size: 1.4rem
  }

  .c-header-card-link--brown {
      background-color: #614623;
      color: #fff
  }

  .c-header-card-link--brown::before {
      background-image: url(/shared/assets/img/top/icon/arrow_03.png)
  }
}

@media only screen and (max-width: 640px) {
  .c-close-btn {
      display:flex;
      justify-content: center;
      padding: min(calc((30 / 640) * 100vw), 30px) 0;
      background-color: #efece9
  }

  .c-close-btn__txt {
      display: flex;
      align-items: center;
      color: #614623;
      font-size: min(calc((25 / 640) * 100vw), 25px);
      position: relative
  }

  .c-close-btn__txt::after {
      content: "";
      display: inline-block;
      width: min(calc((30 / 640) * 100vw), 30px);
      height: min(calc((30 / 640) * 100vw), 30px);
      margin-left: min(calc((15 / 640) * 100vw), 15px);
      background-image: url(/shared/assets/img/common/sidenav/sp/close.png);
      background-repeat: no-repeat;
      background-size: 100% auto
  }
}

@media only screen and (min-width: 641px) {
  .c-header-card-tag {
      padding:4px 0;
      font-size: 1.2rem;
      color: #614623;
      background-color: #f7f6f4;
      text-align: center;
      line-height: 1.2
  }

  .c-header-card-tag+.c-header-card-tag {
      margin-top: 5px
  }
}

@media only screen and (min-width: 641px) {
  .l-header {
      font-family:"筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
      position: relative
  }

  .l-header__inner {
      padding: 30px 0
  }

  .l-header__layout {
      display: flex;
      justify-content: space-between;
      -moz-column-gap: 70px;
      column-gap: 70px;
      width: 1200px;
      margin-left: auto;
      margin-right: auto
  }

  .l-header__left {
      display: flex;
      align-items: center;
      -moz-column-gap: 15px;
      column-gap: 15px
  }

  .l-header__logo img {
      width: auto
  }

  .l-header__right {
      display: flex;
      align-items: center;
      -moz-column-gap: 20px;
      column-gap: 20px;
      width: 850px
  }

  .l-header__input {
      display: flex;
      row-gap: 10px;
      flex-direction: column;
      width: 190px
  }

  .l-header__input.pc_only {
      display: flex !important
  }
}

@media only screen and (max-width: 640px) {
  .l-header {
      font-family:"筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
      position: relative
  }

  .l-header__inner {
      padding: min(calc((30 / 640) * 100vw), 30px) min(calc((15 / 640) * 100vw), 15px)
  }

  .l-header__layout {
      display: flex;
      justify-content: space-between;
      -moz-column-gap: min(calc((30 / 640) * 100vw), 30px);
      column-gap: min(calc((30 / 640) * 100vw), 30px);
      margin-left: auto;
      margin-right: auto
  }

  .l-header__left {
      display: flex;
      align-items: center;
      -moz-column-gap: min(calc((10 / 640) * 100vw), 10px);
      column-gap: min(calc((10 / 640) * 100vw), 10px)
  }

  .l-header__logo {
      width: min(calc((100 / 640) * 100vw), 100px)
  }

  .l-header__logo img {
      width: 100%
  }

  .l-header__right {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      width: min(calc((370 / 640) * 100vw), 370px)
  }
}

@media only screen and (min-width: 641px) {
  .l-main {
      padding-bottom:100px
  }
}

@media only screen and (min-width: 641px) {
  .p-sidenav-lineup__item {
      padding:5px;
      position: relative;
      color: #614623;
      border-bottom: solid 1px #d6d2cf
  }

  .p-sidenav-lineup__item:first-of-type {
      border-top: solid 1px #d6d2cf
  }

  .p-sidenav-lineup__item--arrow::after {
      content: "";
      width: 14px;
      height: 14px;
      background-image: url(/shared/assets/img/common/sidenav/icon/arrow_right.png);
      background-size: 100% auto;
      position: absolute;
      right: 10px;
      top: 50%;
      transform: translateY(-50%)
  }

  .p-sidenav-lineup__item--gray {
      background-color: #eae9e5
  }

  .p-sidenav-lineup__item--hover {
      transition: all .2s ease
  }

  .p-sidenav-lineup__item--hover:hover {
      color: #fff;
      background-color: #614623;
      border-radius: 6px
  }

  .p-sidenav-lineup__link {
      display: block;
      padding: 10px;
      font-size: 1.25rem
  }

  .p-sidenav-lineup__link--hover {
      transition: all .2s ease
  }

  .p-sidenav-lineup__link--hover:hover {
      color: #fff;
      background-color: #614623;
      border-radius: 6px
  }

  .p-sidenav-lineup__hover-list {
      width: 200px;
      visibility: hidden;
      opacity: 0;
      position: absolute;
      right: -100%;
      top: 0;
      z-index: 100;
      transition: all .5s ease
  }

  .p-sidenav-lineup__hover-list.active {
      visibility: visible;
      opacity: 1
  }
}

@media only screen and (min-width: 641px) {
  .p-sidenav-tel {
      padding:15px;
      border-top: 1px solid #d6d2cf
  }

  .p-sidenav-tel__txt {
      font-size: 1.25rem;
      text-align: center
  }

  .p-sidenav-tel__number {
      margin-top: 10px;
      font-size: 2.1rem;
      text-align: center
  }

  .p-sidenav-tel__number+.p-sidenav-tel__txt {
      margin-top: 10px
  }

  .p-sidenav-tel:last-of-type {
      border-bottom: 1px solid #d6d2cf
  }
}

@media only screen and (min-width: 641px) {
  .p-sidenav-member {
      color:#614623
  }

  .p-sidenav-member__user {
      font-size: 1.8rem
  }

  .p-sidenav-member__status {
      font-size: 1.8rem
  }
}

@media only screen and (max-width: 640px) {
  .p-sidenav-member {
      padding:min(calc((30 / 640) * 100vw), 30px);
      background-color: #614623
  }

  .p-sidenav-member__user {
      font-size: min(calc((30 / 640) * 100vw), 30px);
      color: #fff
  }

  .p-sidenav-member__status {
      font-size: min(calc((20 / 640) * 100vw), 20px);
      color: #fff
  }
}

@media only screen and (min-width: 641px) {
  .p-about {
      padding-top:230px;
      padding-bottom: 100px;
      position: relative;
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
  }

  .p-about::before {
      content: "";
      display: inline-block;
      width: 100%;
      max-width: 1920px;
      height: 69px;
      background-image: url(/shared/assets/img/top/back_line_01.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      z-index: 2;
      position: absolute;
      left: 50%;
      top: 70px;
      transform: translateX(-50%)
  }

  .p-about__inner {
      width: 1200px;
      margin-left: auto;
      margin-right: auto;
      position: relative
  }

  .p-about__inner::before {
      content: "";
      display: inline-block;
      width: 197px;
      height: 207px;
      background-image: url(/shared/assets/img/top/about_back_01.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      z-index: 5;
      position: absolute;
      right: -280px;
      top: -210px
  }

  .p-about__inner::after {
      content: "";
      display: inline-block;
      width: 280px;
      height: 337px;
      background-image: url(/shared/assets/img/top/about_back_02.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      z-index: 5;
      position: absolute;
      left: -320px;
      bottom: -180px
  }

  .p-about__bnr {
      margin-top: 70px;
      line-height: 0;
      position: relative
  }

  .p-about__btn {
      width: 380px;
      position: absolute;
      left: 50%;
      bottom: 30px;
      transform: translateX(-50%)
  }
}

@media only screen and (max-width: 640px) {
  .p-about {
      padding-top:min(calc((210 / 640) * 100vw), 210px);
      padding-bottom: min(calc((50 / 640) * 100vw), 50px);
      position: relative
  }

  .p-about::before {
      content: "";
      display: inline-block;
      width: 100%;
      height: min(calc((50 / 640) * 100vw), 50px);
      background-image: url(/shared/assets/img/top/sp/back_line_01.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      z-index: 2;
      position: absolute;
      left: 50%;
      top: min(calc((70 / 640) * 100vw), 70px);
      transform: translateX(-50%)
  }

  .p-about::after {
      content: "";
      display: inline-block;
      width: min(calc((120 / 640) * 100vw), 120px);
      height: min(calc((130 / 640) * 100vw), 130px);
      background-image: url(/shared/assets/img/top/about_back_01.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      z-index: 5;
      position: absolute;
      right: min(calc((18 / 640) * 100vw), 18px);
      top: min(calc((50 / 640) * 100vw), 50px)
  }

  .p-about__inner {
      width: min(calc((580 / 640) * 100vw), 580px);
      margin-left: auto;
      margin-right: auto
  }

  .p-about__bnr {
      margin-top: min(calc((40 / 640) * 100vw), 40px);
      line-height: 0;
      position: relative
  }

  .p-about__bnr img {
      width: 100%
  }

  .p-about__btn {
      width: min(calc((370 / 640) * 100vw), 370px);
      margin-left: auto;
      margin-right: auto;
      position: absolute;
      left: 50%;
      bottom: min(calc((30 / 640) * 100vw), 30px);
      transform: translateX(-50%)
  }
}

@media only screen and (min-width: 641px) {
  .p-recommend {
      padding-top:90px;
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
  }

  .p-recommend__inner {
      width: 1200px;
      display: flex;
      -moz-column-gap: 60px;
      column-gap: 60px;
      margin-left: auto;
      margin-right: auto;
      position: relative
  }

  .p-recommend__inner::before {
      content: "";
      display: inline-block;
      width: 278px;
      height: 1289px;
      background-image: url(/shared/assets/img/top/recommend_back_01.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      top: 400px;
      left: -350px
  }

  .p-recommend__inner::after {
      content: "";
      display: inline-block;
      width: 349px;
      height: 1607px;
      background-image: url(/shared/assets/img/top/recommend_back_02.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      top: -10px;
      right: -360px
  }

  .p-recommend__left {
      width: 200px
  }

  .p-recommend__right {
      width: 940px
  }

  .p-recommend__catch {
      margin-bottom: 30px;
      position: relative;
      z-index: 1
  }

  .p-recommend__catch::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 60%;
      height: 15px;
      background: linear-gradient(to right, #efece9, #fff);
      z-index: 1
  }

  .p-recommend__catch-txt {
      font-size: 2.8rem;
      position: relative;
      z-index: 10
  }

  .p-recommend__lead {
      margin-top: 40px
  }

  .p-recommend__list {
      display: grid;
      grid-template-columns: repeat(2, 440px);
      justify-content: space-between;
      row-gap: 60px;
      margin-top: 70px
  }

  .p-recommend__list--scroll {
      display: block
  }

  .p-recommend__block {
      margin-left: -1px
  }

  .p-recommend__block+.p-recommend__catch {
      margin-top: 40px
  }

  .p-recommend__item {
      -moz-column-gap: 30px;
      column-gap: 30px;
      padding-bottom: 20px
  }

  .p-recommend__card {
      width: 340px
  }

  .p-recommend .splide__arrow {
      background: none
  }

  .p-recommend .splide__arrow--next {
      right: -1em
  }

  .p-recommend .splide__arrow--prev {
      left: -1em
  }

  .p-recommend .not-slider {
      visibility: visible;
      position: static
  }

  .p-recommend .not-slider .splide__arrows {
      display: none
  }
}

@media only screen and (max-width: 640px) {
  .p-recommend {
      font-family:"筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
  }

  .p-recommend__lead {
      margin-top: min(calc((30 / 640) * 100vw), 30px);
      position: relative
  }

  .p-recommend__lead::before {
      content: "";
      display: inline-block;
      width: min(calc((86 / 640) * 100vw), 86px);
      height: min(calc((96 / 640) * 100vw), 96px);
      background-image: url(/shared/assets/img/top/sp/icon/tomato.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      right: calc((-50 / 640)*100vw);
      top: calc((-20 / 640)*100vw)
  }

  .p-recommend__list {
      margin-top: min(calc((60 / 640) * 100vw), 60px)
  }

  .p-recommend__right {
      width: min(calc((580 / 640) * 100vw), 580px);
      margin-left: auto;
      margin-right: auto;
      position: relative
  }

  .p-recommend__catch {
      margin-bottom: min(calc((50 / 640) * 100vw), 50px);
      position: relative;
      z-index: 1
  }

  .p-recommend__catch::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 80%;
      height: min(calc((15 / 640) * 100vw), 15px);
      background: linear-gradient(to right, #efece9, #fff);
      z-index: 1
  }

  .p-recommend__catch-txt {
      font-size: min(calc((32 / 640) * 100vw), 32px);
      position: relative;
      z-index: 10
  }

  .p-recommend__block+.p-recommend__catch {
      margin-top: min(calc((100 / 640) * 100vw), 100px)
  }

  .p-recommend__item {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      row-gap: min(calc((40 / 640) * 100vw), 40px)
  }

  .p-recommend__card {
      width: min(calc((280 / 640) * 100vw), 280px)
  }

  .p-recommend .splide {
      visibility: visible;
      position: static
  }

  .p-recommend .splide__arrows {
      display: none
  }
}

@media only screen and (min-width: 641px) {
  .p-recommend-card {
      width:100%;
      height: 100%;
      border: 1px solid #614623;
      box-sizing: border-box;
      position: relative
  }

  .p-recommend-card::after {
      content: "";
      display: inline-block;
      width: 23px;
      height: 23px;
      background-image: url(/shared/assets/img/top/icon/triangle.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      bottom: 0;
      right: 0
  }

  .p-recommend-card a {
      height: 100%;
      display: flex;
      flex-direction: column
  }

  .p-recommend-card__thumb {
      line-height: 0
  }

  .p-recommend-card__thumb img {
      width: 100%
  }

  .p-recommend-card__body {
      height: 100%;
      display: flex;
      justify-content: space-between;
      flex-direction: column;
      padding: 20px 10px
  }

  .p-recommend-card__body+.p-recommend-card__body {
      margin-top: 60px
  }

  .p-recommend-card__ttl {
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 2.2rem;
      font-weight: bold;
      color: #614623;
      text-align: center
  }

  .p-recommend-card__lead {
      margin-top: 10px;
      font-size: 1.4rem;
      color: #614623;
      text-align: center;
      letter-spacing: 1.5px
  }

  .p-recommend-card__lead--small {
      font-size: 1.4rem;
      letter-spacing: -0.2px
  }
}

@media only screen and (max-width: 640px) {
  .p-recommend-card {
      width:100%;
      height: 100%;
      border: 1px solid #614623;
      box-sizing: border-box;
      position: relative
  }

  .p-recommend-card::after {
      content: "";
      display: inline-block;
      width: min(calc((35 / 640) * 100vw), 35px);
      height: min(calc((35 / 640) * 100vw), 35px);
      background-image: url(/shared/assets/img/top/icon/triangle.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      bottom: -1px;
      right: 0
  }

  .p-recommend-card a {
      display: block
  }

  .p-recommend-card__thumb {
      line-height: 0
  }

  .p-recommend-card__thumb img {
      width: 100%
  }

  .p-recommend-card__body {
      padding: min(calc((20 / 640) * 100vw), 20px) min(calc((15 / 640) * 100vw), 15px)
  }

  .p-recommend-card__ttl {
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: min(calc((24 / 640) * 100vw), 24px);
      font-weight: bold;
      color: #614623;
      text-align: center
  }

  .p-recommend-card__ttl--small {
      display: block;
      font-size: min(calc((22 / 640) * 100vw), 22px)
  }

  .p-recommend-card__lead {
      margin-top: min(calc((20 / 640) * 100vw), 20px);
      font-size: min(calc((18 / 640) * 100vw), 18px);
      color: #614623
  }

  .p-recommend-card__lead--small {
      letter-spacing: -0.6px
  }

  .p-recommend-card+.p-recommend-card {
      margin-top: min(calc((50 / 640) * 100vw), 50px)
  }
}

@media only screen and (max-width: 640px) {
  .p-sidenav-acc__layout {
      display:flex;
      justify-content: space-between
  }

  .p-sidenav-acc__layout--column2 {
      padding: min(calc((20 / 640) * 100vw), 20px) min(calc((30 / 640) * 100vw), 30px)
  }

  .p-sidenav-acc__left {
      display: flex;
      flex-direction: column;
      justify-content: center
  }

  .p-sidenav-acc__greet {
      font-size: min(calc((23 / 640) * 100vw), 23px)
  }

  .p-sidenav-acc__name {
      font-size: min(calc((31 / 640) * 100vw), 31px)
  }

  .p-sidenav-acc__ttl {
      padding: min(calc((30 / 640) * 100vw), 30px);
      font-size: min(calc((25 / 640) * 100vw), 25px);
      position: relative
  }

  .p-sidenav-acc__ttl::after {
      content: "";
      width: min(calc((40 / 640) * 100vw), 40px);
      height: min(calc((40 / 640) * 100vw), 40px);
      background-image: url(/shared/assets/img/common/sidenav/sp/plus.png);
      background-size: 100% 100%;
      position: absolute;
      right: min(calc((30 / 640) * 100vw), 30px);
      top: 50%;
      transform: translateY(-50%)
  }

  .p-sidenav-acc__ttl--link {
      display: block
  }

  .p-sidenav-acc__ttl--link::after {
      background-image: url(/shared/assets/img/common/sidenav/sp/arrow_black.png)
  }

  .p-sidenav-acc__ttl.active::after {
      background-image: url(/shared/assets/img/common/sidenav/sp/minus.png)
  }

  .p-sidenav-acc__right {
      width: min(calc((260 / 640) * 100vw), 260px)
  }

  .p-sidenav-acc__cont {
      height: 0;
      overflow: hidden
  }

  .p-sidenav-acc__cont--menu {
      height: auto;
      margin-top: min(calc((20 / 640) * 100vw), 20px)
  }

  .p-sidenav-acc__inner {
      margin-top: min(calc((20 / 640) * 100vw), 20px);
      margin-bottom: min(calc((50 / 640) * 100vw), 50px)
  }

  .p-sidenav-acc__inner--recommend {
      padding: 0 min(calc((30 / 640) * 100vw), 30px)
  }

  .p-sidenav-acc__inner--about {
      padding: 0 min(calc((30 / 640) * 100vw), 30px)
  }

  .p-sidenav-acc__inner--category {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      row-gap: min(calc((40 / 640) * 100vw), 40px);
      padding: 0 min(calc((40 / 640) * 100vw), 40px)
  }

  .p-sidenav-acc__inner--category a {
      width: min(calc((260 / 640) * 100vw), 260px)
  }

  .p-sidenav-acc__inner--ranking {
      display: flex;
      flex-wrap: wrap;
      -moz-column-gap: min(calc((30 / 640) * 100vw), 30px);
      column-gap: min(calc((30 / 640) * 100vw), 30px);
      row-gap: min(calc((70 / 640) * 100vw), 70px);
      padding: 0 min(calc((50 / 640) * 100vw), 50px)
  }

  .p-sidenav-acc__inner--ranking a {
      display: block;
      width: min(calc((240 / 640) * 100vw), 240px)
  }

  .p-sidenav-acc__inner--enjoy {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      row-gap: min(calc((30 / 640) * 100vw), 30px);
      padding: 0 min(calc((20 / 640) * 100vw), 20px)
  }

  .p-sidenav-acc__inner--enjoy a {
      display: block;
      width: min(calc((280 / 640) * 100vw), 280px)
  }

  .p-sidenav-acc__inner--menu {
      width: min(calc((560 / 640) * 100vw), 560px);
      margin-left: auto;
      margin-right: auto
  }

  .p-sidenav-acc__inner--menu a+a {
      margin-top: min(calc((30 / 640) * 100vw), 30px)
  }

  .p-sidenav-acc__inner--contact {
      display: flex;
      flex-direction: column;
      row-gap: min(calc((40 / 640) * 100vw), 40px);
      padding: 0 min(calc((40 / 640) * 100vw), 40px)
  }

  .p-sidenav-acc__inner--contact a {
      width: 100%
  }

  .p-sidenav-acc__btn {
      width: min(calc((560 / 640) * 100vw), 560px);
      margin-left: auto;
      margin-right: auto
  }

  .p-sidenav-acc__btn+.p-sidenav-acc__btn {
      margin-top: min(calc((40 / 640) * 100vw), 40px)
  }

  .p-sidenav-acc__btn--small {
      width: min(calc((350 / 640) * 100vw), 350px)
  }

  .p-sidenav-acc__bnr img {
      width: 100%
  }

  .p-sidenav-acc .splide {
      visibility: visible;
      position: static
  }

  .p-sidenav-acc .splide__arrows {
      display: none
  }
}

@media only screen and (max-width: 640px) {
  .p-header-tel-area {
      background-color:#f7f6f4;
      border: 1px solid #614623
  }

  .p-header-tel-area__txt {
      font-size: min(calc((18 / 640) * 100vw), 18px);
      text-align: center
  }

  .p-header-tel-area__item {
      padding: min(calc((20 / 640) * 100vw), 20px) 0
  }

  .p-header-tel-area__item+.p-header-tel-area__item {
      border-top: 1px dotted #614623
  }
}

@media only screen and (max-width: 640px) {
  .p-header-tel-item {
      display:flex;
      align-items: center;
      justify-content: center;
      padding: min(calc((40 / 640) * 100vw), 40px) min(calc((30 / 640) * 100vw), 30px) min(calc((30 / 640) * 100vw), 30px) min(calc((30 / 640) * 100vw), 30px)
  }

  .p-header-tel-item+.p-header-tel-item {
      border-top: 2px dotted #614623
  }

  .p-header-tel-item__inner {
      display: flex;
      align-items: center;
      justify-content: center;
      -moz-column-gap: min(calc((30 / 640) * 100vw), 30px);
      column-gap: min(calc((30 / 640) * 100vw), 30px)
  }

  .p-header-tel-item__icon {
      display: flex;
      align-items: center;
      width: min(calc((80 / 640) * 100vw), 80px)
  }

  .p-header-tel-item__icon img {
      width: 100%
  }

  .p-header-tel-item__ttl {
      font-size: min(calc((17 / 640) * 100vw), 17px);
      text-align: center
  }

  .p-header-tel-item__num {
      font-size: min(calc((44 / 640) * 100vw), 44px);
      font-weight: bold
  }
}

@media only screen and (min-width: 641px) {
  .c-border-btn {
      display:flex;
      justify-content: center;
      align-items: center;
      padding: 8px;
      border: 1px solid #614623;
      border-radius: 5px;
      box-sizing: border-box
  }

  .c-border-btn__txt {
      font-size: 1.2rem;
      color: #614623
  }
}

@media only screen and (min-width: 641px) {
  .c-more-btn {
      display:flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      padding: 10px 0;
      background-color: #fff;
      border: 1px solid #614623;
      border-radius: 50px;
      position: relative;
      transition: all .3s ease
  }

  .c-more-btn::after {
      content: "";
      display: inline-block;
      width: 23px;
      height: 23px;
      background-image: url(/shared/assets/img/top/icon/arrow_02.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      top: 50%;
      right: 20px;
      transform: translateY(-50%)
  }

  .c-more-btn__txt {
      font-size: 2.3rem;
      color: #614623;
      line-height: 1
  }

  .c-more-btn--white .c-more-btn__txt {
      color: #fff
  }

  .c-more-btn--white {
      background-color: transparent;
      border: 1px solid #fff
  }

  .c-more-btn--white::after {
      background-image: url(/shared/assets/img/top/icon/arrow_03.png)
  }

  .c-more-btn:hover {
      background-color: #614623;
      border: 1px solid #614623;
      opacity: 1
  }

  .c-more-btn:hover::after {
      background-image: url(/shared/assets/img/top/icon/arrow_03.png)
  }

  .c-more-btn:hover .c-more-btn__txt {
      color: #fff
  }
}

@media only screen and (max-width: 640px) {
  .c-more-btn {
      display:flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      padding: 10px 0;
      background-color: #fff;
      border: 1px solid #614623;
      border-radius: 50px;
      position: relative
  }

  .c-more-btn::after {
      content: "";
      display: inline-block;
      width: min(calc((25 / 640) * 100vw), 25px);
      height: min(calc((25 / 640) * 100vw), 25px);
      background-image: url(/shared/assets/img/top/icon/arrow_02.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      top: 50%;
      right: min(calc((20 / 640) * 100vw), 20px);
      transform: translateY(-50%)
  }

  .c-more-btn__txt {
      font-size: min(calc((23 / 640) * 100vw), 23px);
      color: #614623;
      line-height: 1
  }

  .c-more-btn--white .c-more-btn__txt {
      color: #fff
  }

  .c-more-btn--white {
      background-color: transparent;
      border: 1px solid #fff
  }

  .c-more-btn--white::after {
      background-image: url(/shared/assets/img/top/icon/arrow_03.png)
  }

  .c-more-btn--brown {
      background-color: #614623
  }

  .c-more-btn--brown .c-more-btn__txt {
      color: #fff
  }

  .c-more-btn--brown::after {
      background-image: url(/shared/assets/img/common/header/icon/arrow_white.png)
  }

  .c-more-btn--qa {
      position: relative
  }

  .c-more-btn--qa::before {
      content: "";
      display: inline-block;
      width: min(calc((36 / 640) * 100vw), 36px);
      height: min(calc((32 / 640) * 100vw), 32px);
      background-image: url(/shared/assets/img/common/header/icon/qa.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      top: 50%;
      left: min(calc((20 / 640) * 100vw), 20px);
      transform: translateY(-50%)
  }
}

@media only screen and (min-width: 641px) {
  .c-menu-btn {
      display:inline-block
  }

  .c-menu-btn__txt {
      font-size: 1.8rem;
      color: #614623
  }
}

@media only screen and (max-width: 640px) {
  .c-menu-btn {
      display:inline-block;
      width: 100%;
      padding: min(calc((20 / 640) * 100vw), 20px) min(calc((30 / 640) * 100vw), 30px);
      box-sizing: border-box
  }

  .c-menu-btn__txt {
      font-size: min(calc((24 / 640) * 100vw), 24px);
      color: #614623
  }

  .c-menu-btn--arrow {
      position: relative
  }

  .c-menu-btn--arrow::before {
      content: "";
      width: min(calc((18 / 640) * 100vw), 18px);
      height: min(calc((18 / 640) * 100vw), 18px);
      background-image: url(/shared/assets/img/common/footer/icon/arrow_black.png);
      background-repeat: no-repeat;
      background-size: 100% auto;
      position: absolute;
      right: min(calc((30 / 640) * 100vw), 30px);
      top: 50%;
      transform: translateY(-50%)
  }
}

@media only screen and (max-width: 640px) {
  .c-half-shadow-btn {
      display:flex;
      align-items: center;
      justify-content: flex-start;
      -moz-column-gap: min(calc((20 / 640) * 100vw), 20px);
      column-gap: min(calc((20 / 640) * 100vw), 20px);
      height: min(calc((100 / 640) * 100vw), 100px);
      padding-left: min(calc((40 / 640) * 100vw), 40px);
      color: #000;
      border-radius: 10px;
      border: 1px solid #715d46;
      background-color: #fff;
      box-sizing: border-box;
      position: relative
  }

  .c-half-shadow-btn::before {
      content: "";
      width: 100%;
      height: 50%;
      background-color: #f7f6f4;
      border-radius: 0 0 10px 10px;
      position: absolute;
      bottom: 0;
      left: 0;
      z-index: 1
  }

  .c-half-shadow-btn__icon {
      display: flex;
      justify-content: center;
      align-items: center;
      height: calc((40 / 640)*100vw);
      width: calc((30 / 640)*100vw);
      position: relative;
      z-index: 10
  }

  .c-half-shadow-btn__icon img {
      height: calc((40 / 640)*100vw);
      width: auto
  }

  .c-half-shadow-btn__txt {
      font-size: min(calc((24 / 640) * 100vw), 24px);
      line-height: 1.4;
      position: relative;
      z-index: 10
  }

  .c-half-shadow-btn__txt--big {
      font-size: min(calc((26 / 640) * 100vw), 26px)
  }

  .c-half-shadow-btn__txt--small {
      font-size: min(calc((18 / 640) * 100vw), 18px)
  }

  .c-half-shadow-btn--center {
      text-align: center;
      justify-content: center;
      padding-left: 0
  }

  .c-half-shadow-btn--brown {
      justify-content: center;
      height: min(calc((70 / 640) * 100vw), 70px);
      padding-left: 0;
      color: #fff;
      background-color: #917d65;
      border: none
  }

  .c-half-shadow-btn--brown::before {
      background-color: #715d46
  }

  .c-half-shadow-btn--icon {
      padding-left: min(calc((30 / 640) * 100vw), 30px)
  }

  .c-half-shadow-btn--arrow::after {
      content: "";
      width: min(calc((30 / 640) * 100vw), 30px);
      height: min(calc((30 / 640) * 100vw), 30px);
      background-image: url(/shared/assets/img/common/sidenav/sp/arrow_black.png);
      background-size: 100% 100%;
      z-index: 10;
      position: absolute;
      right: min(calc((20 / 640) * 100vw), 20px);
      top: 50%;
      transform: translateY(-50%)
  }

  .c-half-shadow-btn--row2 {
      display: flex;
      align-items: flex-start;
      justify-content: center;
      flex-direction: column;
      height: min(calc((170 / 640) * 100vw), 170px)
  }

  .c-half-shadow-btn--radius {
      border-radius: 50px
  }

  .c-half-shadow-btn--radius::before {
      border-radius: 0 0 50px 50px
  }
}

@media only screen and (min-width: 641px) {
  .l-sidenav__ttl {
      padding:15px 0;
      font-size: 1.5rem;
      text-align: center;
      background-color: #614623;
      color: #fff
  }

  .l-sidenav__cont {
      padding: 20px 10px 30px 10px;
      background-color: #f7f6f4
  }

  .l-sidenav__cont--pd0 {
      padding-left: 0;
      padding-right: 0
  }

  .l-sidenav__cont--pdt10 {
      padding-top: 10px
  }

  .l-sidenav__cont--pdb16 {
      padding-bottom: 16px
  }

  .l-sidenav__txt {
      font-size: 1.25rem;
      margin-bottom: 20px
  }

  .l-sidenav__txt--center {
      text-align: center
  }

  .l-sidenav__txt:last-of-type {
      margin-bottom: 0
  }

  .l-sidenav__txt+.l-sidenav__btn {
      margin-top: 15px
  }

  .l-sidenav__cont--pd0 .l-sidenav__list {
      margin-left: 10px;
      margin-right: 10px
  }

  .l-sidenav__list+.l-sidenav__btn {
      margin-top: 20px
  }

  .l-sidenav__list--border {
      margin: 0 !important;
      padding: 15px;
      border-bottom: 1px solid #d6d2cf
  }

  .l-sidenav__list--small {
      padding-left: 15px
  }

  .l-sidenav__cont--pd0 .l-sidenav__btn {
      margin-left: 10px;
      margin-right: 10px
  }

  .l-sidenav__btn+.l-sidenav__list {
      margin-top: 20px
  }

  .l-sidenav__btn+.l-sidenav__btn {
      margin-top: 8px
  }

  .l-sidenav__link {
      display: inline-block;
      padding-left: 15px;
      position: relative
  }

  .l-sidenav__link::before {
      content: "";
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background-color: #614623;
      position: absolute;
      left: 0;
      top: 9px;
      transform: translateY(-50%)
  }

  .l-sidenav__lineup {
      margin-top: 20px;
      margin-bottom: 30px
  }

  .l-sidenav__lead {
      font-size: 14px
  }

  .l-sidenav__lead--center {
      text-align: center
  }

  .l-sidenav__lead--border {
      margin: 20px 0 10px 0 !important;
      padding: 15px;
      border-top: 1px solid #d6d2cf;
      border-bottom: 1px solid #d6d2cf
  }

  .l-sidenav__cont--pd0 .l-sidenav__lead {
      margin-left: 10px;
      margin-right: 10px
  }

  .l-sidenav__tel:first-of-type {
      margin-top: 10px
  }

  .l-sidenav__member {
      margin-bottom: 20px
  }
}

@media only screen and (max-width: 640px) {
  .l-sidenav {
      height:100%;
      width: 100%;
      background-color: #fff;
      box-sizing: border-box;
      border-top: 1px solid #614623;
      overflow-y: auto;
      position: fixed;
      z-index: 999;
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
      line-height: 1.3
  }

  .l-sidenav__item+.l-sidenav__item {
      border-top: 1px solid #c0b5a7
  }

  .l-sidenav__top-btn {
      width: min(calc((380 / 640) * 100vw), 380px);
      margin-top: min(calc((60 / 640) * 100vw), 60px);
      margin-bottom: min(calc((10 / 640) * 100vw), 10px);
      margin-left: auto;
      margin-right: auto
  }

  .l-sidenav__bottom-btn {
      width: min(calc((380 / 640) * 100vw), 380px);
      margin-top: min(calc((10 / 640) * 100vw), 10px);
      margin-bottom: min(calc((50 / 640) * 100vw), 50px);
      margin-left: auto;
      margin-right: auto
  }
}

@media only screen and (min-width: 641px) {
  .p-footer-cont {
      display:flex;
      -moz-column-gap: 100px;
      column-gap: 100px
  }

  .p-footer-cont__list {
      display: flex;
      flex-direction: column;
      row-gap: 20px
  }

  .p-footer-cont__item {
      font-size: 1.8rem
  }
}

@media only screen and (min-width: 641px) {
  .l-footer {
      color:#3c1e0f;
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
  }

  .l-footer__main {
      padding: 60px 0;
      background-color: #f7f6f4
  }

  .l-footer__inner {
      width: 1200px;
      margin-left: auto;
      margin-right: auto
  }

  .l-footer__layout {
      display: flex;
      justify-content: space-between;
      -moz-column-gap: 100px;
      column-gap: 100px
  }

  .l-footer__heading {
      font-size: 30px;
      font-weight: bold;
      letter-spacing: 1px
  }

  .l-footer__list {
      margin-top: 40px
  }

  .l-footer__copy {
      padding: 15px 0;
      background-color: #614623;
      text-align: center
  }

  .l-footer__copy-txt {
      font-size: 1.8rem;
      color: #fff
  }

  .l-footer__nav {
      padding: 20px 0;
      background-color: #fff
  }

  .l-footer__nav-inner {
      position: relative;
      display: flex;
      justify-content: flex-start;
      flex-wrap: wrap;
      gap: 10px 0;
      padding: 0 0 0 12px
  }

  .l-footer__nav-inner::after {
      content: "";
      width: 1px;
      height: 100%;
      background-color: #fff;
      position: absolute;
      top: 0;
      right: 12px
  }

  .l-footer__item {
      margin-right: 12px;
      padding-right: 12px;
      border-right: 1px solid #d7d2cf
  }

  .l-footer__item:last-child {
      border-right: none
  }
}

@media only screen and (max-width: 640px) {
  .l-footer {
      color:#3c1e0f;
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
  }

  .l-footer__item+.l-footer__item {
      border-top: 1px solid #d7d2cf
  }

  .l-footer__nav {
      background-color: #f7f6f4
  }

  .l-footer__copy {
      padding: min(calc((15 / 640) * 100vw), 15px) 0;
      background-color: #614623;
      text-align: center
  }

  .l-footer__copy-txt {
      font-size: min(calc((16 / 640) * 100vw), 16px);
      color: #fff
  }
}

@media only screen and (min-width: 641px) {
  .c-section-ttl {
      display:flex;
      justify-content: center;
      align-items: center
  }

  .c-section-ttl__txt {
      font-size: 3.5rem;
      font-weight: bold
  }

  .c-section-ttl--icon {
      position: relative
  }

  .c-section-ttl--icon::before {
      content: "";
      display: inline-block;
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      background-repeat: no-repeat;
      background-size: 100% auto
  }

  .c-section-ttl--lineup {
      padding-top: 70px
  }

  .c-section-ttl--lineup::before {
      width: 68px;
      height: 46px;
      background-image: url(/shared/assets/img/top/icon/lineup.png)
  }

  .c-section-ttl--ranking {
      padding-top: 70px
  }

  .c-section-ttl--ranking::before {
      width: 68px;
      height: 45px;
      background-image: url(/shared/assets/img/top/icon/ranking.png)
  }
}

@media only screen and (max-width: 640px) {
  .c-section-ttl {
      display:flex;
      justify-content: center;
      align-items: center
  }

  .c-section-ttl__txt {
      font-size: min(calc((34 / 640) * 100vw), 34px);
      font-weight: bold
  }

  .c-section-ttl--icon {
      position: relative
  }

  .c-section-ttl--icon::before {
      content: "";
      display: inline-block;
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      background-repeat: no-repeat;
      background-size: 100% auto
  }

  .c-section-ttl--lineup::before {
      content: none
  }

  .c-section-ttl--lineup .c-section-ttl__txt {
      padding-left: min(calc((40 / 640) * 100vw), 40px);
      padding-right: min(calc((40 / 640) * 100vw), 40px);
      position: relative
  }

  .c-section-ttl--lineup .c-section-ttl__txt::before {
      content: "";
      display: inline-block;
      width: min(calc((18 / 640) * 100vw), 18px);
      height: min(calc((32 / 640) * 100vw), 32px);
      background-image: url(/shared/assets/img/top/sp/icon/lineup_01.png);
      background-repeat: no-repeat;
      background-size: 100% auto;
      position: absolute;
      top: 50%;
      left: 0;
      transform: translateY(-50%)
  }

  .c-section-ttl--lineup .c-section-ttl__txt::after {
      content: "";
      display: inline-block;
      width: min(calc((18 / 640) * 100vw), 18px);
      height: min(calc((32 / 640) * 100vw), 32px);
      background-image: url(/shared/assets/img/top/sp/icon/lineup_02.png);
      background-repeat: no-repeat;
      background-size: 100% auto;
      position: absolute;
      top: 50%;
      right: 0;
      transform: translateY(-50%)
  }

  .c-section-ttl--ranking {
      padding-top: min(calc((70 / 640) * 100vw), 70px)
  }

  .c-section-ttl--ranking::before {
      width: min(calc((68 / 640) * 100vw), 68px);
      height: min(calc((45 / 640) * 100vw), 45px);
      background-image: url(/shared/assets/img/top/icon/ranking.png)
  }
}

@media only screen and (min-width: 641px) {
  .c-contact-btn {
      display:inline-block;
      width: 100%;
      padding: 20px 60px 20px 50px;
      border: 1px solid #614623;
      position: relative;
      cursor: pointer;
      box-sizing: border-box
  }

  .c-contact-btn::after {
      content: "";
      display: inline-block;
      width: 23px;
      height: 23px;
      background-image: url(/shared/assets/img/top/icon/arrow_02.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      top: 50%;
      right: 20px;
      transform: translateY(-50%)
  }

  .c-contact-btn__txt {
      font-size: 2rem;
      color: #614623;
      line-height: 1
  }
}

@media only screen and (min-width: 641px) {
  .c-read-btn {
      display:flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      padding: 10px 0;
      border-radius: 50px;
      background-color: #fff;
      position: relative
  }

  .c-read-btn__txt {
      font-size: 3.2rem;
      color: #614623;
      line-height: 1
  }
}

@media only screen and (max-width: 640px) {
  .c-read-btn {
      display:flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      padding: 5px 0;
      border-radius: min(calc((50 / 640) * 100vw), 50px);
      background-color: #fff;
      position: relative
  }

  .c-read-btn__txt {
      font-size: min(calc((18 / 640) * 100vw), 18px);
      color: #614623;
      line-height: 1
  }
}

.c-title--lineup_detail-h1 {
  background-color: #49a836;
  color: #fff;
  font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
  font-weight: bold;
  text-align: center
}

.c-title--lineup_detail-h1.tomatojp {
  background-color: #bc1a1f
}

.c-title--lineup_detail-h1.pomegranate {
  background-color: #4b280a
}

.c-title--lineup_detail-h1.grapemix {
  background-color: #4b280a
}

@media only screen and (min-width: 641px) {
  .c-title--lineup_detail-h1 {
      padding:10px 20px;
      font-size: 4.3rem
  }
}

@media only screen and (max-width: 640px) {
  .c-title--lineup_detail-h1 {
      padding:3% 0;
      font-size: min(calc((46 / 640) * 100vw), 46px)
  }
}

@media only screen and (min-width: 641px) {
  .c-title--lineup_detail-h2 {
      padding:100px 0 0 0
  }
}

@media only screen and (max-width: 640px) {
  .c-title--lineup_detail-h2 {
      padding:0 3% 3% 3%;
      background-color: #f1efe4
  }
}

.c-title--lineup_detail-h2 .c-title__inner {
  position: relative;
  margin: auto
}

@media only screen and (min-width: 641px) {
  .c-title--lineup_detail-h2 .c-title__inner {
      width:960px
  }

  .c-title--lineup_detail-h2 .c-title__inner::before {
      content: "";
      display: block;
      position: absolute;
      left: 50%;
      bottom: 0;
      transform: translateX(-50%);
      width: 100vw;
      min-width: 1200px;
      height: 100%;
      background-color: #f1efe4;
      z-index: -1
  }
}

.c-title--lineup_detail-h2 .c-title__icon {
  position: absolute;
  left: 0;
  color: #438d00;
  width: 40px
}

@media only screen and (min-width: 641px) {
  .c-title--lineup_detail-h2 .c-title__icon {
      top:-15px
  }
}

@media only screen and (max-width: 640px) {
  .c-title--lineup_detail-h2 .c-title__icon {
      top:-20px;
      right: 0;
      margin: auto
  }
}

.c-title--lineup_detail-h2 .c-title__icon img {
  width: 100%;
  height: auto
}

.c-title--lineup_detail-h2 .c-title__txt {
  font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
  color: #438d00;
  font-weight: bold;
  line-height: 1.5
}

@media only screen and (min-width: 641px) {
  .c-title--lineup_detail-h2 .c-title__txt {
      padding:40px 0;
      font-size: 3.5rem
  }
}

@media only screen and (max-width: 640px) {
  .c-title--lineup_detail-h2 .c-title__txt {
      padding:10% 0 5% 0;
      font-size: min(calc((34 / 640) * 100vw), 34px);
      text-align: center
  }
}

@media only screen and (min-width: 641px) {
  .c-title--lineup_detail-h2 .c-title__img {
      position:absolute;
      right: 0;
      bottom: 10px
  }
}

.c-title--lineup_detail-h3 {
  margin: 0 0 20px 0;
  font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
}

.c-title--lineup_detail-h3 .c-title__icon {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: 1em;
  padding: 5px 1em;
  border-radius: 5px 5px 0 0;
  background-color: #5a4624;
  color: #fff;
  text-align: center
}

@media only screen and (min-width: 641px) {
  .c-title--lineup_detail-h3 .c-title__icon {
      font-size:3rem
  }
}

@media only screen and (max-width: 640px) {
  .c-title--lineup_detail-h3 .c-title__icon {
      margin-left:auto;
      margin-right: auto;
      font-size: min(calc((46 / 640) * 100vw), 46px)
  }

  .c-title--lineup_detail-h3 .c-title__icon::before,.c-title--lineup_detail-h3 .c-title__icon::after {
      content: "";
      position: absolute;
      bottom: 0;
      display: block;
      width: 28vw;
      height: 1px;
      background-color: #5a4624
  }

  .c-title--lineup_detail-h3 .c-title__icon::before {
      left: -30vw
  }

  .c-title--lineup_detail-h3 .c-title__icon::after {
      right: -30vw
  }
}

.c-title--lineup_detail-h3 .c-title__icon span {
  display: block
}

@media only screen and (min-width: 641px) {
  .c-title--lineup_detail-h3 .c-title__icon span {
      font-size:1.4rem
  }
}

@media only screen and (max-width: 640px) {
  .c-title--lineup_detail-h3 .c-title__icon span {
      font-size:min(calc((21 / 640) * 100vw), 21px)
  }
}

.c-title--lineup_detail-h3 .c-title__txt {
  font-weight: bold;
  line-height: 1.5
}

@media only screen and (min-width: 641px) {
  .c-title--lineup_detail-h3 .c-title__txt {
      font-size:3.2rem
  }
}

@media only screen and (max-width: 640px) {
  .c-title--lineup_detail-h3 .c-title__txt {
      font-size:min(calc((45 / 640) * 100vw), 45px);
      text-align: center
  }
}

@media only screen and (min-width: 641px) {
  .c-title--lineup_detail-h3 .c-title__txt span {
      font-size:2.6rem
  }
}

@media only screen and (max-width: 640px) {
  .c-title--lineup_detail-h3 .c-title__txt span {
      font-size:min(calc((32 / 640) * 100vw), 32px)
  }
}

.c-title--development-h3 {
  margin: 0 0 20px 0;
  font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
}

.c-title--development-h3 .c-title__txt {
  font-weight: bold;
  line-height: 1.5
}

@media only screen and (min-width: 641px) {
  .c-title--development-h3 .c-title__txt {
      font-size:3.2rem
  }
}

@media only screen and (max-width: 640px) {
  .c-title--development-h3 .c-title__txt {
      font-size:min(calc((36 / 640) * 100vw), 36px)
  }
}

@media only screen and (min-width: 641px) {
  .c-title--development-h3 .c-title__txt span {
      font-size:2.6rem
  }
}

@media only screen and (max-width: 640px) {
  .c-title--development-h3 .c-title__txt span {
      font-size:min(calc((32 / 640) * 100vw), 32px)
  }
}

.c-title--customer_voice-h2 {
  font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
  text-align: center
}

.c-title--customer_voice-h2 .c-title__icon {
  margin: auto
}

@media only screen and (min-width: 641px) {
  .c-title--customer_voice-h2 .c-title__icon {
      width:54px
  }
}

@media only screen and (max-width: 640px) {
  .c-title--customer_voice-h2 .c-title__icon {
      width:10%
  }
}

.c-title--customer_voice-h2 .c-title__txt {
  margin-top: .5em;
  font-weight: bold;
  line-height: 1.5
}

@media only screen and (min-width: 641px) {
  .c-title--customer_voice-h2 .c-title__txt {
      font-size:3.5rem
  }
}

@media only screen and (max-width: 640px) {
  .c-title--customer_voice-h2 .c-title__txt {
      font-size:min(calc((34 / 640) * 100vw), 34px)
  }
}

.c-title--customer_voice-h2 .c-title__note {
  margin-top: .5em
}

@media only screen and (min-width: 641px) {
  .c-title--customer_voice-h2 .c-title__note {
      font-size:2.4rem
  }
}

@media only screen and (max-width: 640px) {
  .c-title--customer_voice-h2 .c-title__note {
      font-size:min(calc((24 / 640) * 100vw), 24px)
  }
}

.c-txt--superscript {
  vertical-align: super;
  font-size: 80%
}

.c-txt--font_size-small {
  font-size: 60%
}

.c-txt--color_red {
  font-weight: normal;
  color: #be1a20
}

.c-txt--underline-solid {
  border-top: 1px solid #d1d0d0
}

.c-txt--underline-solid span {
  border-bottom: 1px solid #d1d0d0;
  padding-bottom: 1em
}

@media only screen and (min-width: 641px) {
  .c-notes ul li {
      font-size:1.4rem
  }
}

@media only screen and (max-width: 640px) {
  .c-notes ul li {
      font-size:min(calc((16 / 640) * 100vw), 16px)
  }
}

.c-anchor--nav-lineup_detail {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  padding: 5px 0
}

@media only screen and (min-width: 641px) {
  .c-anchor--nav-lineup_detail {
      text-align:center
  }
}

@media only screen and (max-width: 640px) {
  .c-anchor--nav-lineup_detail {
      display:flex;
      align-items: center;
      border-bottom: 1px solid #5a4624
  }
}

.c-anchor--nav-lineup_detail * {
  box-sizing: border-box
}

.c-anchor--nav-lineup_detail .c-anchor__icon {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto
}

@media only screen and (min-width: 641px) {
  .c-anchor--nav-lineup_detail .c-anchor__icon {
      width:30px;
      height: 35px
  }
}

@media only screen and (max-width: 640px) {
  .c-anchor--nav-lineup_detail .c-anchor__icon {
      width:20px;
      height: 25px
  }
}

.c-anchor--nav-lineup_detail .c-anchor__icon svg {
  width: 100%;
  height: auto
}

@media only screen and (min-width: 641px) {
  .c-anchor--nav-lineup_detail .c-anchor__nav-txt {
      margin-top:15px
  }
}

@media only screen and (max-width: 640px) {
  .c-anchor--nav-lineup_detail .c-anchor__nav-txt {
      width:calc(100% - 20px - 16px);
      height: -webkit-fit-content;
      height: -moz-fit-content;
      height: fit-content;
      padding: 0 1em
  }
}

.c-anchor--nav-lineup_detail .c-anchor__nav-txt .txt {
  font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
}

@media only screen and (min-width: 641px) {
  .c-anchor--nav-lineup_detail .c-anchor__nav-txt .txt {
      display:flex;
      justify-content: center;
      align-items: center;
      min-height: 2em;
      font-size: 2.6rem;
      line-height: 1.2
  }
}

@media only screen and (max-width: 640px) {
  .c-anchor--nav-lineup_detail .c-anchor__nav-txt .txt {
      font-size:min(calc((32 / 640) * 100vw), 32px)
  }
}

.c-anchor--nav-lineup_detail::after {
  content: "";
  display: block;
  margin: auto;
  background-image: url(/shared/assets/img/lineup/common/arrow_01.svg);
  background-repeat: no-repeat;
  background-size: 100% auto
}

@media only screen and (min-width: 641px) {
  .c-anchor--nav-lineup_detail::after {
      position:absolute;
      left: 0;
      right: 0;
      bottom: -20px;
      width: 16px;
      height: 16px
  }
}

@media only screen and (max-width: 640px) {
  .c-anchor--nav-lineup_detail::after {
      width:12px;
      height: 12px
  }
}

.c-btn--voice {
  margin: auto
}

@media only screen and (min-width: 641px) {
  .c-btn--voice {
      width:290px
  }
}

@media only screen and (max-width: 640px) {
  .c-btn--voice {
      width:70%
  }
}

.c-btn--voice input {
  display: none
}

.c-btn--voice label {
  display: block;
  position: relative;
  padding: 10px;
  border: 1px solid #5a4624;
  border-radius: 50vw;
  text-align: center;
  line-height: 1;
  cursor: pointer
}

@media only screen and (min-width: 641px) {
  .c-btn--voice label {
      font-size:2rem
  }
}

@media only screen and (max-width: 640px) {
  .c-btn--voice label {
      font-size:min(calc((24 / 640) * 100vw), 24px)
  }
}

.c-btn--voice label span {
  display: none
}

.c-btn--voice label::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background-image: url('data:image/svg+xml;utf8,<svg height="20.5" width="19.5" xmlns="http://www.w3.org/2000/svg"><path d="m9.37.925c5.129 0 9.287 4.159 9.287 9.289s-4.158 9.289-9.287 9.289c-5.13 0-9.288-4.159-9.288-9.289s4.158-9.289 9.288-9.289z" fill="%235a4624" fill-rule="evenodd"/><path d="m4.942 10.18 3.561 3.322 5.712-6.992" fill="none" stroke="%23ffffff" stroke-opacity="1" /></svg>');
  background-repeat: no-repeat
}

.c-btn--voice label::after {
  content: "参考になった"
}

.c-btn--voice label:hover {
  opacity: .8
}

.c-btn--voice input[type=radio]:checked+label {
  background-color: #5a4624;
  color: #fff
}

.c-btn--voice input[type=radio]:checked+label::before {
  background-image: url('data:image/svg+xml;utf8,<svg height="20.5" width="19.5" xmlns="http://www.w3.org/2000/svg"><path d="m9.37.925c5.129 0 9.287 4.159 9.287 9.289s-4.158 9.289-9.287 9.289c-5.13 0-9.288-4.159-9.288-9.289s4.158-9.289 9.288-9.289z" fill="%23ffffff" fill-rule="evenodd"/><path d="m4.942 10.18 3.561 3.322 5.712-6.992" fill="none" stroke="%235a4624" stroke-opacity="1" /></svg>');
  background-repeat: no-repeat
}

.c-btn--voice input[type=radio]:checked+label::after {
  content: "ありがとうございます"
}

.c-btn--voice_more {
  box-sizing: border-box;
  display: block;
  position: relative;
  padding: 10px;
  border: 1px solid #5a4624;
  border-radius: 50vw;
  background-color: #fff;
  text-align: center;
  line-height: 1;
  cursor: pointer
}

@media only screen and (min-width: 641px) {
  .c-btn--voice_more {
      width:370px;
      font-size: 2rem
  }
}

@media only screen and (max-width: 640px) {
  .c-btn--voice_more {
      width:100%;
      font-size: min(calc((24 / 640) * 100vw), 24px)
  }
}

.c-btn--voice_more::before {
  content: "＋";
  display: block;
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  width: 20px
}

.c-btn--voice_more:hover {
  opacity: .8
}

.c-btn--voice_more.open::before {
  content: "\0ff0d"
}

.c-btn--review {
  box-sizing: border-box;
  display: block;
  position: relative;
  padding: 10px;
  border: 1px solid #5a4624;
  border-radius: 50vw;
  text-align: center;
  line-height: 1;
  cursor: pointer
}

@media only screen and (min-width: 641px) {
  .c-btn--review {
      width:370px;
      font-size: 2rem
  }
}

@media only screen and (max-width: 640px) {
  .c-btn--review {
      width:100%;
      font-size: min(calc((24 / 640) * 100vw), 24px)
  }
}

.c-btn--review::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  background-image: url(/shared/assets/img/lineup/common/btn_icon01.png);
  background-size: 100% auto
}

@media only screen and (min-width: 641px) {
  .c-btn--review::before {
      width:24px;
      height: 24px
  }
}

@media only screen and (max-width: 640px) {
  .c-btn--review::before {
      width:18px;
      height: 18px
  }
}

.c-btn--review:hover {
  opacity: .8
}

@media only screen and (min-width: 641px) {
  .p-ranking {
      padding-top:60px;
      padding-bottom: 90px;
      background-color: #f7f6f4;
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
      position: relative;
      z-index: 5
  }

  .p-ranking__inner {
      width: 1200px;
      margin-left: auto;
      margin-right: auto
  }

  .p-ranking__list {
      display: grid !important;
      grid-template-columns: repeat(4, 274px);
      justify-content: space-between;
      margin-top: 70px !important
  }

  .p-ranking .splide {
      visibility: visible
  }
}

@media only screen and (max-width: 640px) {
  .p-ranking {
      padding-top:min(calc((40 / 640) * 100vw), 40px);
      padding-bottom: min(calc((50 / 640) * 100vw), 50px);
      background-color: #f7f6f4;
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
      position: relative;
      z-index: 5
  }

  .p-ranking__lead {
      width: min(calc((530 / 640) * 100vw), 530px);
      margin-top: min(calc((40 / 640) * 100vw), 40px);
      margin-left: auto;
      margin-right: auto;
      font-size: min(calc((21 / 640) * 100vw), 21px)
  }

  .p-ranking .splide {
      margin-left: min(calc((60 / 640) * 100vw), 60px);
      margin-top: min(calc((70 / 640) * 100vw), 70px)
  }

  .p-ranking .splide__track {
      padding-top: 6px
  }
}

@media only screen and (min-width: 641px) {
  .p-ranking-item {
      text-align:center;
      position: relative
  }

  .p-ranking-item::before {
      content: "";
      width: 89px;
      height: 82px;
      position: absolute;
      top: -6px;
      left: 20px;
      background-size: 100% auto
  }

  .p-ranking-item:nth-child(1)::before {
      background-image: url(/shared/assets/img/top/icon/ranking_num_1.png)
  }

  .p-ranking-item:nth-child(2)::before {
      background-image: url(/shared/assets/img/top/icon/ranking_num_2.png)
  }

  .p-ranking-item:nth-child(3)::before {
      background-image: url(/shared/assets/img/top/icon/ranking_num_3.png)
  }

  .p-ranking-item:nth-child(4)::before {
      background-image: url(/shared/assets/img/top/icon/ranking_num_4.png)
  }

  .p-ranking-item__package {
      line-height: 1
  }

  .p-ranking-item__lead {
      margin-top: 30px;
      font-size: 1.7rem
  }

  .p-ranking-item__ttl {
      display: inline-block;
      margin-top: 15px;
      border-bottom: 1px solid #000
  }

  .p-ranking-item__txt {
      padding: 0 15px;
      font-size: 2.6rem;
      font-weight: bold
  }

  .p-ranking-item__txt--small {
      font-size: 2.4rem
  }
}

@media only screen and (max-width: 640px) {
  .p-ranking-item {
      width:min(calc((240 / 640) * 100vw), 240px) !important;
      text-align: center;
      position: relative
  }

  .p-ranking-item::before {
      content: "";
      width: min(calc((89 / 640) * 100vw), 89px);
      height: min(calc((82 / 640) * 100vw), 82px);
      position: absolute;
      top: -6px;
      left: min(calc((20 / 640) * 100vw), 20px);
      background-size: 100% auto
  }

  .p-ranking-item--1::before {
      background-image: url(/shared/assets/img/top/icon/ranking_num_1.png)
  }

  .p-ranking-item--2::before {
      background-image: url(/shared/assets/img/top/icon/ranking_num_2.png)
  }

  .p-ranking-item--3::before {
      background-image: url(/shared/assets/img/top/icon/ranking_num_3.png)
  }

  .p-ranking-item--4::before {
      background-image: url(/shared/assets/img/top/icon/ranking_num_4.png)
  }

  .p-ranking-item__package {
      line-height: 1
  }

  .p-ranking-item__package img {
      width: 100%
  }

  .p-ranking-item__lead {
      margin-top: min(calc((20 / 640) * 100vw), 20px);
      font-size: min(calc((16 / 640) * 100vw), 16px);
      letter-spacing: -0.4px
  }

  .p-ranking-item__ttl {
      display: inline-block;
      margin-top: min(calc((15 / 640) * 100vw), 15px);
      border-bottom: 1px solid #000
  }

  .p-ranking-item__txt {
      padding: 0 min(calc((5 / 640) * 100vw), 5px);
      font-size: min(calc((24 / 640) * 100vw), 24px);
      font-weight: bold
  }

  .p-ranking-item__txt--small {
      font-size: min(calc((22 / 640) * 100vw), 22px)
  }
}

@media only screen and (min-width: 641px) {
  .p-enjoy {
      padding-top:240px;
      padding-bottom: 130px;
      background-color: #fff;
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
      position: relative
  }

  .p-enjoy::before {
      content: "";
      display: inline-block;
      width: 100%;
      height: 300px;
      background-image: url(/shared/assets/img/top/enjoy_back.png);
      background-size: 100% 100%;
      background-repeat: no-repeat;
      position: absolute;
      left: 50%;
      top: 0;
      transform: translateX(-50%)
  }

  .p-enjoy__inner {
      width: 1200px;
      margin-left: auto;
      margin-right: auto;
      position: relative
  }

  .p-enjoy__lead {
      margin-top: 30px
  }

  .p-enjoy__conts {
      margin-top: 110px
  }

  .p-enjoy__btn {
      width: 370px;
      margin-left: auto;
      margin-right: auto;
      margin-top: 50px
  }

  .p-enjoy__bnr {
      position: relative;
      margin-top: 130px
  }

  .p-enjoy__bnr+.p-enjoy__bnr {
      margin-top: 50px
  }

  .p-enjoy__bnr-btn {
      width: 380px;
      position: absolute;
      left: 50%;
      bottom: 20px;
      transform: translateX(-50%)
  }
}

@media only screen and (max-width: 640px) {
  .p-enjoy {
      padding-top:min(calc((140 / 640) * 100vw), 140px);
      padding-bottom: min(calc((70 / 640) * 100vw), 70px);
      background-color: #fff;
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
      position: relative
  }

  .p-enjoy::before {
      content: "";
      display: inline-block;
      width: 100%;
      height: min(calc((120 / 640) * 100vw), 120px);
      background-image: url(/shared/assets/img/top/sp/enjoy_back.png);
      background-size: 100% 100%;
      background-repeat: no-repeat;
      position: absolute;
      left: 50%;
      top: 0;
      transform: translateX(-50%)
  }

  .p-enjoy__inner {
      position: relative
  }

  .p-enjoy__ttl {
      width: min(calc((520 / 640) * 100vw), 520px);
      margin-left: auto;
      margin-right: auto
  }

  .p-enjoy__lead {
      width: min(calc((520 / 640) * 100vw), 520px);
      margin-top: min(calc((40 / 640) * 100vw), 40px);
      margin-left: auto;
      margin-right: auto
  }

  .p-enjoy__conts {
      margin-top: min(calc((90 / 640) * 100vw), 90px)
  }

  .p-enjoy__conts+.p-enjoy__conts {
      margin-top: min(calc((150 / 640) * 100vw), 150px)
  }

  .p-enjoy__btn {
      width: min(calc((370 / 640) * 100vw), 370px);
      margin-left: auto;
      margin-right: auto;
      margin-top: min(calc((60 / 640) * 100vw), 60px)
  }

  .p-enjoy__bnr {
      position: relative;
      width: min(calc((580 / 640) * 100vw), 580px);
      margin-left: auto;
      margin-right: auto;
      margin-top: min(calc((70 / 640) * 100vw), 70px)
  }

  .p-enjoy__bnr-btn {
      width: min(calc((370 / 640) * 100vw), 370px);
      margin-left: auto;
      margin-right: auto;
      position: absolute;
      left: 50%;
      bottom: min(calc((20 / 640) * 100vw), 20px);
      transform: translateX(-50%)
  }
}

@media only screen and (min-width: 641px) {
  .p-enjoy-conts__icon {
      display:flex;
      align-items: center;
      justify-content: center
  }

  .p-enjoy-conts__ttl {
      margin-top: 10px;
      font-size: 3.5rem;
      font-weight: bold;
      text-align: center
  }

  .p-enjoy-conts__posts {
      margin-top: 30px !important
  }

  .p-enjoy-conts .splide {
      visibility: visible
  }
}

@media only screen and (max-width: 640px) {
  .p-enjoy-conts__icon {
      display:flex;
      align-items: center;
      justify-content: center
  }

  .p-enjoy-conts__icon img {
      width: auto
  }

  .p-enjoy-conts__ttl {
      margin-top: min(calc((20 / 640) * 100vw), 20px);
      font-size: min(calc((35 / 640) * 100vw), 35px);
      font-weight: bold;
      text-align: center
  }

  .p-enjoy-conts__posts {
      margin-top: min(calc((30 / 640) * 100vw), 30px) !important
  }
}

@media only screen and (min-width: 641px) {
  .p-enjoy-posts {
      display:flex;
      justify-content: space-between
  }

  .p-enjoy-posts__item {
      width: 350px
  }

  .p-enjoy-posts__img {
      line-height: 1
  }

  .p-enjoy-posts__ttl {
      margin-top: 30px;
      margin-left: 15px;
      margin-right: 15px;
      border-bottom: 1px solid #614623
  }

  .p-enjoy-posts__txt {
      font-size: 2.4rem;
      text-align: center
  }

  .p-enjoy-posts__txt--small {
      font-size: 2.3rem;
      letter-spacing: -2px
  }

  .p-enjoy-posts__txt--left {
      text-align: left
  }
}

@media only screen and (max-width: 640px) {
  .splide__slide.splide__slide--active.splide__slide--clone {
      transform:translateX(-50%);
      left: 50%;
      right: initial
  }

  .p-enjoy-posts__item {
      width: min(calc((350 / 640) * 100vw), 350px) !important
  }

  .p-enjoy-posts__img {
      line-height: 1
  }

  .p-enjoy-posts__ttl {
      margin-top: min(calc((30 / 640) * 100vw), 30px);
      margin-left: min(calc((15 / 640) * 100vw), 15px);
      margin-right: min(calc((15 / 640) * 100vw), 15px);
      border-bottom: 1px solid #614623
  }

  .p-enjoy-posts__txt {
      font-size: min(calc((24 / 640) * 100vw), 24px);
      text-align: center
  }

  .p-enjoy-posts__txt--small {
      font-size: min(calc((23 / 640) * 100vw), 23px);
      letter-spacing: -2px
  }

  .p-enjoy-posts__txt--left {
      text-align: left
  }
}

@media only screen and (min-width: 641px) {
  .p-lineup {
      padding-top:60px;
      padding-bottom: 70px;
      background-color: #f7f6f4;
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
  }

  .p-lineup__lead {
      margin-top: 40px
  }

  .p-lineup__tab {
      margin-top: 60px;
      position: relative
  }

  .p-lineup__tab::after {
      content: "";
      display: inline-block;
      width: 220px;
      height: 184px;
      background-image: url(/shared/assets/img/top/lineup_back_01.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      left: calc(50% + 860px);
      top: 140px;
      transform: translateX(-50%)
  }
}

@media only screen and (max-width: 640px) {
  .p-lineup {
      padding-top:min(calc((70 / 640) * 100vw), 70px);
      padding-bottom: min(calc((80 / 640) * 100vw), 80px);
      background-color: #f7f6f4;
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
  }

  .p-lineup__lead {
      margin-top: min(calc((40 / 640) * 100vw), 40px)
  }

  .p-lineup__tab {
      margin-top: min(calc((50 / 640) * 100vw), 50px);
      position: relative
  }
}

@media only screen and (min-width: 641px) {
  .p-trouble {
      padding-bottom:180px;
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
  }

  .p-trouble__inner {
      width: 1200px;
      margin-left: auto;
      margin-right: auto
  }

  .p-trouble__list {
      margin-top: 80px
  }
}

@media only screen and (max-width: 640px) {
  .p-trouble {
      padding-bottom:min(calc((80 / 640) * 100vw), 80px);
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
  }

  .p-trouble__inner {
      width: min(calc((580 / 640) * 100vw), 580px);
      margin-left: auto;
      margin-right: auto
  }

  .p-trouble__list {
      margin-top: min(calc((50 / 640) * 100vw), 50px)
  }
}

@media only screen and (min-width: 641px) {
  .p-trouble-list {
      display:flex;
      justify-content: space-between
  }

  .p-trouble-list__item {
      width: 360px;
      position: relative
  }

  .p-trouble-list__thumb {
      line-height: 1
  }

  .p-trouble-list__btn {
      width: 230px;
      position: absolute;
      left: 50%;
      bottom: 30px;
      transform: translateX(-50%)
  }
}

@media only screen and (max-width: 640px) {
  .p-trouble-list {
      display:flex;
      justify-content: space-between
  }

  .p-trouble-list__item {
      width: min(calc((180 / 640) * 100vw), 180px);
      position: relative
  }

  .p-trouble-list__thumb {
      line-height: 1
  }

  .p-trouble-list__btn {
      width: min(calc((130 / 640) * 100vw), 130px);
      position: absolute;
      left: 50%;
      bottom: min(calc((15 / 640) * 100vw), 15px);
      transform: translateX(-50%)
  }
}

@media only screen and (min-width: 641px) {
  .p-contact {
      font-family:"筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
      line-height: 1.5
  }

  .p-contact__inner {
      width: 1200px;
      margin-left: auto;
      margin-right: auto
  }

  .p-contact__layout {
      display: flex;
      justify-content: space-between;
      margin-top: 50px
  }

  .p-contact__item {
      width: 560px
  }
}

@media only screen and (max-width: 640px) {
  .p-contact {
      margin-bottom:min(calc((40 / 640) * 100vw), 40px);
      font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
  }
}

@media only screen and (min-width: 641px) {
  .p-contact-item__ttl {
      font-size:3.5rem;
      text-align: center
  }

  .p-contact-item__thumb {
      margin-top: 50px
  }

  .p-contact-item__sns {
      margin-top: 30px
  }

  .p-contact-item__tel {
      margin-top: 50px
  }

  .p-contact-item__btn {
      margin-top: 30px;
      width: 100%
  }

  .p-contact-item__ssl {
      display: flex;
      justify-content: space-between;
      align-items: center;
      -moz-column-gap: 30px;
      column-gap: 30px;
      margin-top: 40px
  }

  .p-contact-item__ssl .sslseal {
      width: 160px
  }

  .p-contact-item__ssl .sslseal img {
      width: 100%
  }

  .p-contact-item__ssl .secure_txt {
      font-size: 1.8rem
  }
}

@media only screen and (max-width: 640px) {
  .p-contact-item {
      background-color:#fff
  }

  .p-contact-item:first-of-type {
      padding-top: min(calc((60 / 640) * 100vw), 60px);
      padding-bottom: min(calc((20 / 640) * 100vw), 20px);
      background-color: #f7f6f4
  }

  .p-contact-item__inner {
      width: min(calc((580 / 640) * 100vw), 580px);
      margin-left: auto;
      margin-right: auto
  }

  .p-contact-item__ttl {
      font-size: min(calc((34 / 640) * 100vw), 34px);
      text-align: center
  }

  .p-contact-item__thumb {
      margin-top: min(calc((40 / 640) * 100vw), 40px)
  }

  .p-contact-item__sns {
      margin-top: min(calc((40 / 640) * 100vw), 40px)
  }

  .p-contact-item__ssl .p-contact-item__inner {
      display: flex;
      gap: min(calc((40 / 640) * 100vw), 40px);
      align-items: center;
      padding-top: min(calc((40 / 640) * 100vw), 40px)
  }

  .p-contact-item__ssl .secure_txt {
      font-size: min(calc((18 / 640) * 100vw), 18px)
  }
}

@media only screen and (min-width: 641px) {
  .p-sns-item {
      display:flex;
      align-items: center;
      -moz-column-gap: 35px;
      column-gap: 35px;
      padding-bottom: 20px;
      border-bottom: 2px dotted #614623
  }

  .p-sns-item__icon {
      display: flex;
      justify-content: center
  }

  .p-sns-item__ttl {
      line-height: 1
  }

  .p-sns-item__desc {
      font-size: 1.8rem;
      line-height: 1.4
  }

  .p-sns-item+.p-sns-item {
      padding-top: 20px
  }
}

@media only screen and (max-width: 640px) {
  .p-sns-item {
      display:flex;
      align-items: center;
      -moz-column-gap: min(calc((30 / 640) * 100vw), 30px);
      column-gap: min(calc((30 / 640) * 100vw), 30px);
      padding-bottom: min(calc((20 / 640) * 100vw), 20px)
  }

  .p-sns-item__icon {
      display: flex;
      justify-content: center;
      width: min(calc((100 / 640) * 100vw), 100px)
  }

  .p-sns-item__conts {
      width: min(calc((450 / 640) * 100vw), 450px);
      display: flex;
      align-items: flex-start;
      flex-direction: column;
      padding: 6px 0
  }

  .p-sns-item__ttl {
      line-height: 1
  }

  .p-sns-item+.p-sns-item {
      padding-top: min(calc((20 / 640) * 100vw), 20px);
      border-top: 2px dotted #614623
  }
}

@media only screen and (min-width: 641px) {
  .p-tel-area {
      border:1px solid #614623
  }

  .p-tel-area__item {
      padding: 20px 0
  }

  .p-tel-area__item+.p-tel-area__item {
      border-top: 2px dotted #614623
  }

  .p-tel-area__txt {
      font-size: 1.8rem;
      text-align: center
  }
}

@media only screen and (max-width: 640px) {
  .p-tel-area {
      margin-top:min(calc((40 / 640) * 100vw), 40px);
      background-image: url(/shared/assets/img/top/sp/contact_back.png);
      background-size: 100% 100%
  }

  .p-tel-area__item {
      padding: min(calc((20 / 640) * 100vw), 20px) 0
  }

  .p-tel-area__item+.p-tel-area__item {
      border-top: 2px dotted #614623
  }

  .p-tel-area__txt {
      text-align: center
  }
}

@media only screen and (min-width: 641px) {
  .p-tel-item {
      display:flex;
      align-items: center;
      justify-content: center
  }

  .p-tel-item__inner {
      display: flex;
      align-items: center;
      -moz-column-gap: 30px;
      column-gap: 30px
  }

  .p-tel-item__ttl {
      font-size: 1.8rem;
      text-align: center
  }

  .p-tel-item__num {
      font-size: 4.8rem;
      font-weight: bold
  }
}

@media only screen and (max-width: 640px) {
  .p-tel-item__inner {
      display:flex;
      align-items: center;
      justify-content: center;
      -moz-column-gap: min(calc((15 / 640) * 100vw), 15px);
      column-gap: min(calc((15 / 640) * 100vw), 15px);
      width: min(calc((400 / 640) * 100vw), 400px);
      margin-left: auto;
      margin-right: auto
  }

  .p-tel-item__icon {
      display: flex;
      align-items: center;
      width: min(calc((30 / 640) * 100vw), 30px)
  }

  .p-tel-item__ttl {
      font-size: min(calc((30 / 640) * 100vw), 30px);
      text-align: center;
      color: #fff
  }

  .p-tel-item__lead {
      border-top: 2px dotted #fff;
      margin-top: min(calc((15 / 640) * 100vw), 15px);
      padding-top: min(calc((15 / 640) * 100vw), 15px);
      font-size: min(calc((18 / 640) * 100vw), 18px);
      text-align: center;
      color: #fff
  }
}

@media only screen and (min-width: 641px) {
  .p-introduct-item {
      position:relative;
      z-index: 10
  }

  .p-introduct-item__inner {
      display: grid;
      grid-template-columns: 800px 320px;
      justify-content: space-between
  }

  .p-introduct-item__thumb {
      grid-column: 1/2;
      grid-row: 1/5;
      line-height: 0
  }

  .p-introduct-item__icon {
      margin-top: 10px;
      text-align: center
  }

  .p-introduct-item__ttl {
      margin-top: 10px;
      font-size: 3.5rem;
      font-weight: bold;
      color: #614623;
      line-height: 1.5142857143;
      text-align: center
  }

  .p-introduct-item__lead {
      margin-top: 20px;
      font-size: 2rem;
      line-height: 2;
      text-align: center
  }

  .p-introduct-item__btn {
      margin-top: 30px
  }

  .p-introduct-item:nth-of-type(even) .p-introduct-item__inner {
      grid-template-columns: 320px 800px
  }

  .p-introduct-item:nth-of-type(even) .p-introduct-item__thumb {
      grid-column: 2/3
  }

  .p-introduct-item:nth-of-type(2) {
      position: relative
  }

  .p-introduct-item:nth-of-type(2)::before {
      content: "";
      display: inline-block;
      width: 332px;
      height: 224px;
      background-image: url(/shared/assets/img/top/product-introduct_back_02.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      left: -340px;
      top: 100px
  }

  .p-introduct-item:nth-of-type(3) {
      position: relative
  }

  .p-introduct-item:nth-of-type(3)::before {
      content: "";
      display: inline-block;
      width: 224px;
      height: 354px;
      background-image: url(/shared/assets/img/top/product-introduct_back_03.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      right: -330px;
      top: 40px
  }

  .p-introduct-item+.p-introduct-item {
      margin-top: 170px
  }
}

@media only screen and (max-width: 640px) {
  .p-introduct-item {
      padding-top:min(calc((80 / 640) * 100vw), 80px);
      padding-bottom: min(calc((60 / 640) * 100vw), 60px)
  }

  .p-introduct-item--header {
      padding: 0
  }

  .p-introduct-item--header::before {
      content: none
  }

  .p-introduct-item__inner {
      width: min(calc((580 / 640) * 100vw), 580px);
      margin-left: auto;
      margin-right: auto;
      position: relative;
      z-index: 5
  }

  .p-introduct-item__thumb {
      line-height: 0
  }

  .p-introduct-item__thumb img {
      width: 100%
  }

  .p-introduct-item__img {
      width: min(calc((390 / 640) * 100vw), 390px);
      margin-left: auto;
      margin-right: auto;
      margin-top: min(calc((50 / 640) * 100vw), 50px)
  }

  .p-introduct-item__icon {
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: min(calc((20 / 640) * 100vw), 20px)
  }

  .p-introduct-item__icon img {
      width: auto
  }

  .p-introduct-item__ttl {
      margin-bottom: min(calc((30 / 640) * 100vw), 30px);
      font-size: min(calc((34 / 640) * 100vw), 34px);
      font-weight: bold;
      color: #614623;
      line-height: 1.5142857143;
      text-align: center
  }

  .p-introduct-item__lead {
      margin-top: min(calc((50 / 640) * 100vw), 50px);
      font-size: min(calc((22 / 640) * 100vw), 22px);
      line-height: 2;
      text-align: center
  }

  .p-introduct-item__package {
      width: min(calc((540 / 640) * 100vw), 540px);
      margin-left: auto;
      margin-right: auto;
      margin-top: min(calc((50 / 640) * 100vw), 50px)
  }

  .p-introduct-item__btn {
      width: min(calc((370 / 640) * 100vw), 370px);
      margin-left: auto;
      margin-right: auto;
      margin-top: min(calc((40 / 640) * 100vw), 40px)
  }

  .p-introduct-item:nth-of-type(even) {
      background-color: #f7f6f4
  }

  .p-introduct-item:nth-of-type(2) {
      position: relative
  }

  .p-introduct-item:nth-of-type(2)::before {
      content: "";
      display: inline-block;
      width: min(calc((240 / 640) * 100vw), 240px);
      height: min(calc((115 / 640) * 100vw), 115px);
      background-image: url(/shared/assets/img/top/sp/back_line_02.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      z-index: 1;
      right: 0;
      bottom: 0
  }

  .p-introduct-item:nth-of-type(2)::after {
      content: "";
      display: inline-block;
      width: min(calc((170 / 640) * 100vw), 170px);
      height: min(calc((100 / 640) * 100vw), 100px);
      background-image: url(/shared/assets/img/top/sp/product-introduct_back_01.png);
      background-size: 100% auto;
      background-repeat: no-repeat;
      position: absolute;
      left: 0;
      top: 0
  }
}

.p-breadcrumb_trail {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto 10px auto;
  font-size: 1.2rem;
  line-height: 16px
}

@media only screen and (max-width: 640px) {
  .p-breadcrumb_trail {
      font-size:1rem
  }
}

.p-breadcrumb_trail a,.p-breadcrumb_trail a:link,.p-breadcrumb_trail a:visited {
  text-decoration: none
}

.p-breadcrumb_trail a:hover,.p-breadcrumb_trail a:active {
  text-decoration: underline
}

.p-breadcrumb_trail ul {
  padding: 6px 12px;
}

.p-breadcrumb_trail ul li, .p-breadcrumb_trail ul li a {
    display: inline;
    line-height: 1.7;
    font-size: 12px;
}

.p-breadcrumb_trail ul li::after {
  content: "＞";
  display: inline;
  margin: 0 5px
}

.p-breadcrumb_trail ul li:last-child::after {
  display: none
}

body {
  font-family: "筑紫A丸ゴシック","ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"
}

@media only screen and (min-width: 641px) {
  .pc_only {
      display:block
  }

  .sp_only {
      display: none
  }

  body {
      min-width: 1200px
  }

  body .wrap .conts {
      margin-top: 0
  }

  body .conts {
      overflow-x: hidden
  }

  body .safety-wrap {
      margin-bottom: 230px;
      font-family: "Hiragino Kaku Gothic Pro",Meiryo,Osaka,"MS PGothic",sans-serif
  }

  .fv__inner {
      width: 1200px;
      margin-left: auto;
      margin-right: auto;
      position: relative
  }

  .fv__ttl {
      color: #2ca45c;
      font-size: 3.4rem;
      font-weight: bold;
      line-height: 1.5294117647;
      position: absolute;
      top: 80px;
      left: 110px
  }

  .fv__lead-wrap {
      width: 510px;
      position: absolute;
      bottom: 70px;
      left: 110px
  }

  .fv__lead {
      font-size: 1.5rem;
      line-height: 1.8
  }

  .fv__lead+.fv__lead {
      margin-top: 20px
  }

  .introduct {
      margin-top: 110px
  }

  .introduct__inner {
      width: 960px;
      margin-left: auto;
      margin-right: auto
  }

  .introduct__ttl+.introduct__item {
      margin-top: 130px
  }

  .introduct__item+.introduct__item {
      margin-top: 150px
  }

  .introduct__banner {
      margin-top: 130px
  }

  .introduct-ttl {
      color: #2ca45c;
      font-size: 4rem;
      font-weight: bold;
      line-height: 2;
      text-align: center
  }

  .introduct-ttl__lead {
      font-size: 3rem;
      color: #000;
      font-weight: normal
  }

  .introduct-item__ttl {
      font-size: 3.6rem;
      color: #000;
      position: relative
  }

  .introduct-item__ttl::before {
      content: "";
      display: inline-block;
      width: 100px;
      height: 8px;
      background-color: #2ca45c;
      position: absolute;
      left: 0;
      bottom: -40px
  }

  .introduct-item__layout {
      display: flex;
      -moz-column-gap: 30px;
      column-gap: 30px;
      margin-top: 100px
  }

  .introduct-item__layout+.introduct-item__img {
      margin-top: 40px
  }

  .introduct-item__txt {
      font-size: 1.7rem;
      line-height: 1.8;
      color: #000
  }

  .introduct-item__txt--indent {
      padding-left: 1em;
      text-indent: -1em
  }

  .introduct-item__txt+.introduct-item__txt {
      margin-top: 40px
  }

  .introduct-item__img--center {
      text-align: center
  }

  .introduct-item__img+.introduct-item__txt {
      margin-top: 40px
  }
}

@media only screen and (max-width: 640px) {
  .pc_only {
      display:none
  }

  .sp_only {
      display: block
  }

  body .wrap .conts {
      margin-top: 0
  }

  body .safety-wrap {
      margin-bottom: min(calc((130 / 750) * 100vw), 130px);
      font-family: "Hiragino Kaku Gothic Pro",Meiryo,Osaka,"MS PGothic",sans-serif
  }

  .l-sidenav img {
      width: 100%
  }

  .p-breadcrumb_trail ul li, .p-breadcrumb_trail ul li a{
    font-size: 10px;
  }

  .fv__inner {
      position: relative
  }

  .fv__ttl {
      width: min(calc((650 / 750) * 100vw), 650px);
      color: #2ca45c;
      font-size: min(calc((50 / 750) * 100vw), 50px);
      font-weight: bold;
      line-height: 1.5294117647;
      text-align: center;
      position: absolute;
      top: min(calc((100 / 750) * 100vw), 100px);
      left: 50%;
      transform: translateX(-50%)
  }

  .fv__lead-wrap {
      width: min(calc((650 / 750) * 100vw), 650px);
      position: absolute;
      bottom: min(calc((90 / 750) * 100vw), 90px);
      left: 50%;
      transform: translateX(-50%)
  }

  .fv__lead {
      font-size: min(calc((28 / 750) * 100vw), 28px);
      line-height: 1.6
  }

  .fv__lead+.fv__lead {
      margin-top: min(calc((60 / 750) * 100vw), 60px)
  }

  .introduct {
      margin-top: min(calc((180 / 750) * 100vw), 180px)
  }

  .introduct__inner {
      width: min(calc((650 / 750) * 100vw), 650px);
      margin-left: auto;
      margin-right: auto
  }

  .introduct__ttl+.introduct__item {
      margin-top: min(calc((190 / 750) * 100vw), 190px)
  }

  .introduct__item+.introduct__item {
      margin-top: min(calc((200 / 750) * 100vw), 200px)
  }

  .introduct__banner {
      margin-top: min(calc((190 / 750) * 100vw), 190px)
  }

  .introduct-ttl {
      color: #2ca45c;
      font-size: min(calc((50 / 750) * 100vw), 50px);
      font-weight: bold;
      line-height: 2;
      text-align: center
  }

  .introduct-ttl__lead {
      font-size: min(calc((38 / 750) * 100vw), 38px);
      color: #000;
      font-weight: normal
  }

  .introduct-item__ttl {
      font-size: min(calc((48 / 750) * 100vw), 48px);
      color: #000;
      position: relative;
      line-height: 1.4
  }

  .introduct-item__ttl::before {
      content: "";
      display: inline-block;
      width: min(calc((140 / 750) * 100vw), 140px);
      height: 8px;
      background-color: #2ca45c;
      position: absolute;
      left: 0;
      bottom: -6.6666666667vw
  }

  .introduct-item__layout {
      display: flex;
      flex-direction: column;
      row-gap: min(calc((40 / 750) * 100vw), 40px);
      margin-top: min(calc((130 / 750) * 100vw), 130px)
  }

  .introduct-item__layout+.introduct-item__img {
      margin-top: min(calc((50 / 750) * 100vw), 50px)
  }

  .introduct-item__left {
      order: 2
  }

  .introduct-item__right {
      order: 1
  }

  .introduct-item__txt {
      font-size: min(calc((30 / 750) * 100vw), 30px);
      line-height: 1.8;
      color: #000
  }

  .introduct-item__txt--indent {
      padding-left: 1em;
      text-indent: -1em
  }

  .introduct-item__txt+.introduct-item__txt {
      margin-top: min(calc((40 / 750) * 100vw), 40px)
  }

  .introduct-item__img+.introduct-item__txt {
      margin-top: min(calc((50 / 750) * 100vw), 50px)
  }
}



/*# sourceMappingURL=style.css.map */
