@charset "UTF-8";
/* =========================================================
flex - flex関連の指定
========================================================= */
/* =========================================================
shadow - シャドウ
デフォルトでは色が濃い目なので使う際に調整してください。
========================================================= */
/* =========================================================
other - その他
========================================================= */
/* =========================================================
color - 色の設定
========================================================= */
/* =========================================================
font - font-familyの設定など
========================================================= */
/* =========================================================
typography - テキスト関連の設定
========================================================= */
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* =========================================================
base - 基本設定
========================================================= */
body {
  background-color: #f7f7f7;
  overflow-x: hidden;
  font-size: calc(16 * (100vw / 520));
  line-height: 1.4;
  color: #394656;
  width: 100vw;
  position: relative;
  font-family: "Zen Kaku Gothic New", sans-serif;
  -webkit-font-feature-settings: "pkna";
  font-feature-settings: "pkna";
}
@media screen and (min-width: 520px) {
  body {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  body {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  body {
    overflow-x: hidden !important;
    font-size: 16px;
    font-size: 1rem;
  }
}

a {
  cursor: pointer;
  text-decoration: none;
  transition: .4s;
  line-height: 1;
}
a:hover {
  color: inherit;
}

p {
  color: #394656;
}

img {
  height: auto;
  vertical-align: bottom;
  max-width: 100%;
  width: auto;
}

.pc-show {
  display: none;
}
@media screen and (min-width: 980px) {
  .pc-show {
    display: block;
  }
}

@media screen and (min-width: 980px) {
  .sp-show {
    display: none;
  }
}

.pc-show-inline {
  display: none;
}
@media screen and (min-width: 980px) {
  .pc-show-inline {
    display: inline-block;
  }
}

/* =========================================================
section - コンテンツの大枠
========================================================= */
.l-container {
  width: 100%;
  padding-right: 25px;
  padding-left: 25px;
  margin: 0 auto;
}
@media screen and (min-width: 1150px) {
  .l-container {
    max-width: 1200px;
  }
}

/* =========================================================
header - ヘッダー
========================================================= */
/* =========================================================
main - メイン
========================================================= */
.l-main {
  position: relative;
}

/* =========================================================
footer - フッターのレイアウト
========================================================= */
/* =========================================================
sidemenu
========================================================= */
.l-sidemenu {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 980px) {
  .l-sidemenu {
    flex-direction: row;
  }
}
.l-sidemenu_left {
  /*background-color: #f0f0f0;
  position: sticky;
  top: 70px;
  z-index: 1;
  width: 96%;
  margin: auto;*/
  display: none;
}
@media screen and (min-width: 980px) {
  .l-sidemenu_left {
    /*background-color: inherit;
    top: 0;
    width: auto;
    margin: 0;*/
    position: relative;
    display: block;
  }
}
.l-sidemenu_right {
  padding: 5px 0 45px;
  width: 100%;
}
@media screen and (min-width: 980px) {
  .l-sidemenu_right {
    padding: 75px 0;
    width: calc(100% - 300px);
  }
}
.l-sidemenu-nav {
  position: sticky;
  top: 0;
  padding: 10px 20px;
  width: auto;
}
@media screen and (min-width: 980px) {
  .l-sidemenu-nav {
    padding: 20px;
    width: 300px;
  }
}
.l-sidemenu-nav--wrap:not(:first-of-type) {
  margin: 15px 0 0;
}
@media screen and (min-width: 980px) {
  .l-sidemenu-nav--wrap:not(:first-of-type) {
    margin: 25px 0 0;
  }
}
.l-sidemenu-nav--wrap.assessment {
  display: none;
}
@media screen and (min-width: 980px) {
  .l-sidemenu-nav--wrap.assessment {
    display: block;
  }
}
.l-sidemenu-nav--wrap.purchase {
  margin: 0;
}
.l-sidemenu-nav--wrap.purchase:not(:first-of-type) {
  margin: 0;
}
@media screen and (min-width: 980px) {
  .l-sidemenu-nav--wrap.purchase:not(:first-of-type) {
    margin: 25px 0 0;
  }
}
.l-sidemenu-nav--wrap dt {
  font-size: calc(16 * (100vw / 520));
  font-weight: 700;
}
@media screen and (min-width: 520px) {
  .l-sidemenu-nav--wrap dt {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .l-sidemenu-nav--wrap dt {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .l-sidemenu-nav--wrap dt {
    font-size: 16px;
    font-size: 1rem;
  }
}
.l-sidemenu-nav_list {
  display: flex;
  justify-content: center;
  flex-direction: row;
  margin: 5px 0 0;
}
@media screen and (min-width: 980px) {
  .l-sidemenu-nav_list {
    flex-direction: column;
    margin: 15px 0 0;
  }
}
.l-sidemenu-nav_list > li {
  width: calc(96% / 3);
}
@media screen and (min-width: 980px) {
  .l-sidemenu-nav_list > li {
    width: auto;
  }
}
.l-sidemenu-nav_list > li:not(:first-of-type) {
  margin: 0 0 0 2%;
}
@media screen and (min-width: 980px) {
  .l-sidemenu-nav_list > li:not(:first-of-type) {
    margin: 15px 0 0;
  }
}
.l-sidemenu-nav_list > li a {
  background-color: #0abf7d;
  border-radius: 5px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(15 * (100vw / 520));
  font-weight: 500;
  height: 50px;
  padding: 14px;
  text-align: center;
  transition: .4s;
}
@media screen and (min-width: 520px) {
  .l-sidemenu-nav_list > li a {
    font-size: calc(15 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .l-sidemenu-nav_list > li a {
    font-size: calc(15 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .l-sidemenu-nav_list > li a {
    font-size: 15px;
    font-size: 0.9375rem;
  }
}
.l-sidemenu-nav_list > li a:hover {
  background-color: #35d99d;
}
.l-sidemenu-nav_list > li a img {
  margin: 0 2px;
  max-width: 25px;
}
.l-sidemenu-nav_list > li a.tel {
  background-color: #f17989;
  background-image: url(../images/common/icon-tel.webp);
  background-repeat: no-repeat;
  background-size: 30px;
  background-position: left 15px center;
}
.l-sidemenu-nav_list > li a.tel:hover {
  background-color: #fab7c0;
}
.l-sidemenu-nav_list > li a.mail {
  background-color: #81a6c9;
  background-image: url(../images/common/icon-mail.webp);
  background-repeat: no-repeat;
  background-size: 30px;
  background-position: left 15px center;
}
.l-sidemenu-nav_list > li a.mail:hover {
  background-color: #99b9d7;
}
.l-sidemenu-nav_list > li a.counter {
  background-color: #b7d5cd;
  color: #394656;
}
@media screen and (min-width: 768px) {
  .l-sidemenu-nav_list > li a.counter {
    background-image: url(../images/common/icon-counter.webp);
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: left 15px center;
  }
}
.l-sidemenu-nav_list > li a.counter:hover {
  background-color: #cce9e2;
}
.l-sidemenu-nav_list > li a.delivery {
  background-color: #f9dad6;
  color: #394656;
}
@media screen and (min-width: 768px) {
  .l-sidemenu-nav_list > li a.delivery {
    background-image: url(../images/common/icon-delivery.webp);
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: left 15px center;
  }
}
.l-sidemenu-nav_list > li a.delivery:hover {
  background-color: #ffe6e3;
  color: #394656;
}
.l-sidemenu-nav_list > li a.bulgeout {
  background-color: #83c5e8;
  color: #394656;
}
@media screen and (min-width: 768px) {
  .l-sidemenu-nav_list > li a.bulgeout {
    background-image: url(../images/common/icon-bulgeout.webp);
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: left 15px center;
  }
}
.l-sidemenu-nav_list > li a.bulgeout:hover {
  background-color: #bde8ff;
}

/* =========================================================
title - 共通のタイトルやテキストなど
========================================================= */
/* =========================================================
text - 共通のテキストなど
========================================================= */
/* =========================================================
button - ボタン関係のコンポーネント
========================================================= */
.c-basic-btn a {
  background-color: #81a6c9;
  border-radius: 5px;
  color: #fff;
  display: block;
  font-size: calc(20 * (100vw / 520));
  margin: auto;
  max-width: 260px;
  padding: 16px 10px;
  position: relative;
  text-align: center;
  width: 96%;
}
@media screen and (min-width: 520px) {
  .c-basic-btn a {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-basic-btn a {
    font-size: calc(16 * (100vw / 980));
    max-width: 320px;
    padding: 23px 10px;
  }
}
@media screen and (min-width: 980px) {
  .c-basic-btn a {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-basic-btn a:hover {
  background-color: #9bbddd;
}
.c-basic-btn a::after {
  background-image: url(../images/common/icon-triangle01.svg);
  background-repeat: no-repeat;
  content: '';
  display: block;
  height: 16px;
  width: 16px;
  position: absolute;
  right: 5%;
  top: 0;
  bottom: 0;
  margin: auto;
  transform: rotate(-90deg);
}

/* =========================================================
txtarea - テキストエリア
========================================================= */
/* =========================================================
drawer
========================================================= */
.c-drawer {
  background-color: #f7f7f7;
  height: 100vh;
  padding: 0;
  max-width: 0;
  width: 90vw;
  overflow-y: scroll;
  overflow-x: hidden;
  position: fixed;
  right: -390px;
  transition: .4s;
  z-index: 501;
  scrollbar-color: #929292 #fff;
  scrollbar-width: thin;
}
.c-drawer::-webkit-scrollbar {
  width: 8px;
  background-color: #fff;
}
.c-drawer::-webkit-scrollbar-thumb {
  background: #929292;
  width: 6px;
  border-radius: 5px;
}
.c-drawer-btn label {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  cursor: pointer;
}
.c-drawer-btn .icon {
  background-color: #81a6c9;
  border-radius: 50px;
  cursor: pointer;
  height: 50px;
  width: 50px;
  position: relative;
  transition: .4s;
}
.c-drawer-btn .icon::before, .c-drawer-btn .icon::after {
  background-color: #fff;
  content: '';
  display: block;
  height: 2px;
  width: 18px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.c-drawer-btn .icon::before {
  top: 14px;
  transition: .4s;
}
.c-drawer-btn .icon::after {
  bottom: 14px;
  transition: .4s;
}
.c-drawer-btn .icon:hover {
  background-color: #6889a9;
}
.c-drawer-btn .icon .border {
  color: #fff;
  font-size: calc(11 * (100vw / 520));
  font-weight: 500;
  position: absolute;
  bottom: 5px;
  left: 0;
  right: 0;
  letter-spacing: -.1rem;
  margin: auto;
  text-align: center;
}
@media screen and (min-width: 520px) {
  .c-drawer-btn .icon .border {
    font-size: calc(11 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-drawer-btn .icon .border {
    font-size: calc(11 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-drawer-btn .icon .border {
    font-size: 11px;
    font-size: 0.6875rem;
  }
}
.c-drawer-highlighted {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 5px auto 0;
}
.c-drawer-highlighted li {
  margin: 0 0 8px;
  width: 49%;
}
.c-drawer-highlighted li:first-of-type {
  width: 100%;
}
.c-drawer-highlighted li a {
  border-radius: 5px;
  color: #394656;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(18 * (100vw / 520));
  font-weight: 500;
}
@media screen and (min-width: 520px) {
  .c-drawer-highlighted li a {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-drawer-highlighted li a {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-drawer-highlighted li a {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-drawer-highlighted li a::before {
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px;
  border-radius: 50px;
  content: '';
  display: block;
  height: 50px;
  width: 25px;
}
.c-drawer-highlighted li a.results {
  background-color: #b29443;
  color: #fff;
}
.c-drawer-highlighted li a.results:hover {
  background-color: #977c32;
}
.c-drawer-highlighted li a.results::before {
  background-image: url(../images/common/icon-results.webp);
  background-size: 30px;
  height: 50px;
  width: 40px;
}
.c-drawer-highlighted li a.shop {
  background-color: #b7d5cd;
}
.c-drawer-highlighted li a.shop:hover {
  background-color: #8fbdb1;
}
.c-drawer-highlighted li a.shop::before {
  background-image: url(../images/common/icon-shop.webp);
  background-size: 30px;
  height: 50px;
  width: 40px;
}
.c-drawer-highlighted li a.mypage {
  background-color: #f9dad6;
}
.c-drawer-highlighted li a.mypage:hover {
  background-color: #e7bdb8;
}
.c-drawer-highlighted li a.mypage::before {
  background-image: url(../images/common/icon-mypage.webp);
}
.c-drawer-assessment {
  background-color: #f0f0f0;
  margin: 20px auto 0;
  padding: 15px 8px;
}
.c-drawer-assessment_title {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(22 * (100vw / 520));
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 520px) {
  .c-drawer-assessment_title {
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-drawer-assessment_title {
    font-size: calc(20 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-drawer-assessment_title {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.c-drawer-assessment_title::before, .c-drawer-assessment_title::after {
  background-color: #FEF07F;
  content: '';
  display: block;
  height: 2px;
  width: 40px;
}
.c-drawer-assessment_title::before {
  transform: rotate(60deg);
}
.c-drawer-assessment_title::after {
  transform: rotate(-60deg);
}
.c-drawer-assessment_title .reduce {
  display: block;
  font-size: 80%;
}
.c-drawer-assessment_list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 15px auto 0;
}
.c-drawer-assessment_list > li {
  margin: 0 0 8px;
  width: 48%;
}
.c-drawer-assessment_list > li:nth-of-type(2n+1) {
  margin: 0 2% 8px 0;
}
.c-drawer-assessment_list > li a {
  border-radius: 5px;
  color: #394656;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(18 * (100vw / 520));
  font-weight: 500;
  padding: 10px;
  transition: .4s;
}
@media screen and (min-width: 520px) {
  .c-drawer-assessment_list > li a {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-drawer-assessment_list > li a {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-drawer-assessment_list > li a {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-drawer-assessment_list > li a img {
  margin: 0 6px 0 0;
  max-width: 25px;
}
.c-drawer-assessment_list > li a.counter {
  background-color: #b7d5cd;
}
.c-drawer-assessment_list > li a.counter:hover {
  background-color: #8fbdb1;
}
.c-drawer-assessment_list > li a.line {
  background-color: #0abf7d;
  color: #fff;
  font-size: calc(16 * (100vw / 520));
  max-height: 45px;
  letter-spacing: -.05rem;
  padding: 15px 5px;
}
@media screen and (min-width: 520px) {
  .c-drawer-assessment_list > li a.line {
    font-size: calc(14 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-drawer-assessment_list > li a.line {
    font-size: calc(14 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-drawer-assessment_list > li a.line {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.c-drawer-assessment_list > li a.line:hover {
  background-color: #35d99d;
}
.c-drawer-assessment_list > li a.line img {
  margin: 0 3px;
  max-width: 20px;
}
.c-drawer-assessment_list > li a.delivery {
  background-color: #f9dad6;
}
.c-drawer-assessment_list > li a.delivery:hover {
  background-color: #e7bdb8;
}
.c-drawer-assessment_list > li a.bulgeout {
  background-color: #83c5e8;
}
.c-drawer-assessment_list > li a.bulgeout:hover {
  background-color: #6889a9;
}
.c-drawer-nav {
  margin: 37px auto 0;
  padding: 0 10px;
}
.c-drawer-nav_title {
  font-size: calc(22 * (100vw / 520));
  font-weight: 700;
  margin: 0 0 15px;
  text-align: center;
}
@media screen and (min-width: 520px) {
  .c-drawer-nav_title {
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-drawer-nav_title {
    font-size: calc(20 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-drawer-nav_title {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.c-drawer-nav_title .reduce {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 80%;
}
.c-drawer-nav_title .reduce::before, .c-drawer-nav_title .reduce::after {
  background-color: #FEF07F;
  content: '';
  display: block;
  height: 2px;
  width: 20px;
  margin: 0 5px;
}
.c-drawer-nav_title .reduce::before {
  transform: rotate(60deg);
}
.c-drawer-nav_title .reduce::after {
  transform: rotate(-60deg);
}
.c-drawer-nav_list {
  display: flex;
  flex-wrap: wrap;
}
.c-drawer-nav_list > li {
  margin: 0 0 18px;
  width: 48%;
}
.c-drawer-nav_list > li:first-of-type {
  width: 100%;
}
.c-drawer-nav_list > li:nth-of-type(2n+3) {
  margin: 0 0 18px 4%;
}
.c-drawer-nav_list > li a {
  color: #394656;
  font-size: calc(16 * (100vw / 520));
  font-weight: 500;
  transition: .4s;
}
@media screen and (min-width: 520px) {
  .c-drawer-nav_list > li a {
    font-size: calc(14 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-drawer-nav_list > li a {
    font-size: calc(14 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-drawer-nav_list > li a {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.c-drawer-nav_list > li figure picture {
  background-color: #fff;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: .4s;
}
.c-drawer-nav_list > li figure picture:hover {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.c-drawer-nav_list > li figure picture img {
  max-height: 75px;
}
.c-drawer-nav_list > li figure figcaption {
  margin: 3px 0 0;
}
.c-drawer-nav_sublist {
  display: flex;
  flex-wrap: wrap;
}
.c-drawer-nav_sublist > li {
  margin: 0 0 18px;
  width: 48%;
}
.c-drawer-nav_sublist > li:nth-of-type(2n+2) {
  margin: 0 0 18px 4%;
}
.c-drawer-nav_sublist > li a {
  color: #394656;
  font-size: calc(16 * (100vw / 520));
  font-weight: 500;
  transition: .4s;
}
@media screen and (min-width: 520px) {
  .c-drawer-nav_sublist > li a {
    font-size: calc(14 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-drawer-nav_sublist > li a {
    font-size: calc(14 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-drawer-nav_sublist > li a {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.c-drawer-nav_sublist > li figure picture {
  background-color: #fff;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: .4s;
}
.c-drawer-nav_sublist > li figure picture:hover {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.c-drawer-nav_sublist > li figure picture img {
  max-height: 75px;
}
.c-drawer-nav_sublist > li figure figcaption {
  margin: 3px 0 0;
}
.c-drawer-about {
  background-color: #efece4;
  margin: 34px auto 0;
  padding: 15px 8px;
}
.c-drawer-about_title {
  font-size: calc(22 * (100vw / 520));
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 520px) {
  .c-drawer-about_title {
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-drawer-about_title {
    font-size: calc(20 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-drawer-about_title {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.c-drawer-about_title .reduce {
  display: block;
  font-size: 80%;
}
.c-drawer-about_list {
  display: flex;
  flex-wrap: wrap;
  margin: 15px 0 0;
}
.c-drawer-about_list > li {
  margin: 0 0 10px;
  width: 48%;
}
.c-drawer-about_list > li:nth-of-type(2n+2) {
  margin: 0 0 10px 4%;
}
.c-drawer-about_list > li a {
  background: #81a6c9;
  border: 3px solid #ffffff;
  border-radius: 5px;
  box-sizing: border-box;
  color: #fff;
  display: flex;
  align-items: center;
  font-size: calc(16 * (100vw / 520));
  font-weight: 500;
  min-height: 49px;
  padding: 5px;
  transition: .4s;
}
@media screen and (min-width: 520px) {
  .c-drawer-about_list > li a {
    font-size: calc(14 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-drawer-about_list > li a {
    font-size: calc(14 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-drawer-about_list > li a {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.c-drawer-about_list > li a::after {
  background-image: url(../images/common/icon-arrow02.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  content: '';
  display: block;
  height: 8px;
  width: 18px;
  margin: 0 0 0 5px;
  transition: .4s;
}
.c-drawer-about_list > li a:hover {
  background-color: #6889a9;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.c-drawer-about_list > li a img {
  margin: 0 6px 0 0;
  max-width: 20px;
}
.c-drawer-banner {
  margin: 25px 0 0;
}
.c-drawer-banner_list {
  display: flex;
  flex-wrap: wrap;
}
.c-drawer-banner_list > li {
  margin: 0 0 10px;
  width: 48%;
}
.c-drawer-banner_list > li:nth-of-type(2n+2) {
  margin: 0 0 10px 4%;
}
.c-drawer-banner_list > li a {
  transition: .4s;
}
.c-drawer-banner_list > li a:hover {
  opacity: .7;
}
.c-drawer-acc--container {
  max-height: 0;
  visibility: hidden;
  opacity: 0;
  transition: .4s;
}
.c-drawer-acc--more label {
  background: url(../images/common/icon-triangle01.svg) center no-repeat;
  background-size: 18px;
  background-color: #81A6C9;
  border-radius: 100%;
  cursor: pointer;
  display: block;
  width: 50px;
  height: 50px;
  margin: auto;
  transition: .4s;
}
.c-drawer-acc--more label:hover {
  background-color: #6889a9;
}
.c-drawer-acc--check:checked + .c-drawer-acc > .c-drawer-acc--container {
  max-height: 999vh;
  visibility: visible;
  opacity: 1;
}
.c-drawer-acc--check:checked + .c-drawer-acc > .c-drawer-acc--more label {
  transform: rotate(-180deg);
}

#drawer:checked + .c-drawer {
  padding: 5px 10px 15px;
  max-width: 390px;
  right: 0;
}
#drawer:checked + .c-drawer .c-drawer-btn .icon::before {
  top: -5px;
  transform: rotate(45deg);
}
#drawer:checked + .c-drawer .c-drawer-btn .icon::after {
  bottom: 5px;
  transform: rotate(-45deg);
}
#drawer:checked ~ .c-drawer-overlay {
  background-color: rgba(0, 0, 0, 0.5);
  cursor: pointer;
  height: 100vh;
  width: 100vw;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 500;
}

/* =========================================================
pagenation - ページ送り
========================================================= */
/* =========================================================
breadcrumbs
========================================================= */
.c-breadcrumbs--wrap {
  max-width: 1450px;
  margin: auto;
  width: 96vw;
  overflow-x: scroll;
  padding: 5px 0;
  scrollbar-width: none;
}
.c-breadcrumbs--wrap::-webkit-scrollbar {
  display: none;
}
.c-breadcrumbs--list {
  display: flex;
  align-items: center;
  width: 200vw;
}
@media screen and (min-width: 768px) {
  .c-breadcrumbs--list {
    width: auto;
  }
}
.c-breadcrumbs--list > li a {
  display: flex;
  align-items: center;
  color: #394656;
  font-size: calc(14 * (100vw / 520));
  line-height: 1.2;
}
@media screen and (min-width: 520px) {
  .c-breadcrumbs--list > li a {
    font-size: calc(12 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-breadcrumbs--list > li a {
    font-size: calc(12 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-breadcrumbs--list > li a {
    font-size: 12px;
    font-size: 0.75rem;
  }
}
.c-breadcrumbs--list > li a:hover {
  text-decoration: underline;
}
.c-breadcrumbs--list > li:not(:first-of-type) a::before {
  border-top: 1px solid #394656;
  border-right: 1px solid #394656;
  content: '';
  display: block;
  transform: rotate(45deg);
  height: 5px;
  width: 5px;
  margin: 0 5px;
}

/* =========================================================
navigation - グローバルナビなど
========================================================= */
/* =========================================================
followbtn
========================================================= */
.c-followbtn {
  background: #efece4;
  background: linear-gradient(0deg, #efece4 80%, rgba(239, 236, 228, 0) 80%);
  position: fixed;
  bottom: 0;
  width: 100vw;
}
.c-followbtn_list {
  display: flex;
  max-width: 768px;
  margin: auto;
}
.c-followbtn_list > li {
  padding: 0 5px;
  width: calc(100% / 3);
}
.c-followbtn_list > li a {
  display: block;
  padding: 0 0 6px;
}

/* =========================================================
focusbrand - 買取強化ブランド
========================================================= */
.c-focusbrand {
  background-color: #f0f0f0;
  padding: 50px 0;
}
@media screen and (min-width: 768px) {
  .c-focusbrand {
    padding: 80px 0;
  }
}
.c-focusbrand-nav_title {
  font-size: calc(24 * (100vw / 520));
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 520px) {
  .c-focusbrand-nav_title {
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-focusbrand-nav_title {
    font-size: calc(20 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-focusbrand-nav_title {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.c-focusbrand-nav_list {
  display: flex;
  flex-wrap: wrap;
  margin: 30px auto 0;
  max-width: 1200px;
  width: 96vw;
}
.c-focusbrand-nav_list > li {
  margin: 0 0 10px;
  width: calc(98% / 3);
}
@media screen and (min-width: 768px) {
  .c-focusbrand-nav_list > li {
    margin: 0 0 30px;
  }
}
.c-focusbrand-nav_list > li:nth-of-type(3n+2), .c-focusbrand-nav_list > li:nth-of-type(3n+3) {
  margin: 0 0 10px 1%;
}
@media screen and (min-width: 768px) {
  .c-focusbrand-nav_list > li:nth-of-type(3n+2), .c-focusbrand-nav_list > li:nth-of-type(3n+3) {
    margin: 0 0 30px 1%;
  }
}
.c-focusbrand-nav_list > li a {
  color: #394656;
  font-size: calc(17 * (100vw / 520));
  font-weight: 500;
  transition: .4s;
}
@media screen and (min-width: 520px) {
  .c-focusbrand-nav_list > li a {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-focusbrand-nav_list > li a {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-focusbrand-nav_list > li a {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-focusbrand-nav_list > li figure picture {
  background-color: #fff;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 5px;
  transition: .4s;
}
.c-focusbrand-nav_list > li figure picture:hover {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.c-focusbrand-nav_list > li figure picture img {
  max-height: 90px;
}
.c-focusbrand-nav_list > li figure figcaption {
  display: flex;
  align-items: center;
  margin: 5px 0 0;
}
@media screen and (min-width: 768px) {
  .c-focusbrand-nav_list > li figure figcaption {
    margin: 15px 0 0;
  }
}
@media screen and (min-width: 768px) {
  .c-focusbrand-nav_list > li figure figcaption::after {
    background-image: url(../images/common/icon-arrow01.webp);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    content: '';
    display: block;
    height: 25px;
    width: 25px;
    margin: 0 0 0 10px;
    transition: .4s;
  }
}
.c-focusbrand-nav_list > li figure figcaption span {
  display: none;
}
@media screen and (min-width: 768px) {
  .c-focusbrand-nav_list > li figure figcaption span {
    display: inline-block;
  }
}
.c-focusbrand-nav_sublist {
  display: flex;
  flex-wrap: wrap;
  margin: auto;
  max-width: 1200px;
  width: 96vw;
}
.c-focusbrand-nav_sublist > li {
  margin: 0 0 10px;
  width: calc(98% / 3);
}
@media screen and (min-width: 768px) {
  .c-focusbrand-nav_sublist > li {
    margin: 0 0 30px;
  }
}
.c-focusbrand-nav_sublist > li:nth-of-type(3n+2), .c-focusbrand-nav_sublist > li:nth-of-type(3n+3) {
  margin: 0 0 10px 1%;
}
@media screen and (min-width: 768px) {
  .c-focusbrand-nav_sublist > li:nth-of-type(3n+2), .c-focusbrand-nav_sublist > li:nth-of-type(3n+3) {
    margin: 0 0 30px 1%;
  }
}
.c-focusbrand-nav_sublist > li a {
  color: #394656;
  font-size: calc(17 * (100vw / 520));
  font-weight: 500;
  transition: .4s;
}
@media screen and (min-width: 520px) {
  .c-focusbrand-nav_sublist > li a {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-focusbrand-nav_sublist > li a {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-focusbrand-nav_sublist > li a {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-focusbrand-nav_sublist > li figure picture {
  background-color: #fff;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 5px;
  transition: .4s;
}
.c-focusbrand-nav_sublist > li figure picture:hover {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.c-focusbrand-nav_sublist > li figure picture img {
  max-height: 90px;
}
.c-focusbrand-nav_sublist > li figure figcaption {
  display: flex;
  align-items: center;
  margin: 5px 0 0;
}
@media screen and (min-width: 768px) {
  .c-focusbrand-nav_sublist > li figure figcaption {
    margin: 15px 0 0;
  }
}
@media screen and (min-width: 768px) {
  .c-focusbrand-nav_sublist > li figure figcaption::after {
    background-image: url(../images/common/icon-arrow01.webp);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    content: '';
    display: block;
    height: 25px;
    width: 25px;
    margin: 0 0 0 10px;
    transition: .4s;
  }
}
.c-focusbrand-nav_sublist > li figure figcaption span {
  display: none;
}
@media screen and (min-width: 768px) {
  .c-focusbrand-nav_sublist > li figure figcaption span {
    display: inline-block;
  }
}
.c-focusbrand-acc--container {
  max-height: 0;
  visibility: hidden;
  opacity: 0;
  transition: .4s;
}
.c-focusbrand-acc--more label {
  background: url(../images/common/icon-triangle01.svg) center no-repeat;
  background-size: 18px;
  background-color: #81A6C9;
  border-radius: 100%;
  cursor: pointer;
  display: block;
  width: 50px;
  height: 50px;
  margin: auto;
  transition: .4s;
}
.c-focusbrand-acc--more label:hover {
  background-color: #6889a9;
}
.c-focusbrand-acc--check:checked + .c-focusbrand-acc > .c-focusbrand-acc--container {
  max-height: 999vh;
  visibility: visible;
  opacity: 1;
}
.c-focusbrand-acc--check:checked + .c-focusbrand-acc > .c-focusbrand-acc--more label {
  transform: rotate(-180deg);
}

/* =========================================================
interface - 査定・買取方法のリンク
========================================================= */
.c-interface {
  padding: 60px 0;
}
@media screen and (min-width: 768px) {
  .c-interface {
    padding: 60px 0 80px;
  }
}
.c-interface--wrap {
  margin: auto;
  max-width: 1200px;
  width: 96vw;
}
.c-interface_title {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(24 * (100vw / 520));
  font-weight: 700;
  line-height: 1.4;
  margin: 0 0 15px;
  text-align: center;
}
@media screen and (min-width: 520px) {
  .c-interface_title {
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-interface_title {
    font-size: calc(20 * (100vw / 980));
    margin: 0 0 30px;
  }
}
@media screen and (min-width: 980px) {
  .c-interface_title {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.c-interface_title::before, .c-interface_title::after {
  background-color: #0abf7d;
  content: '';
  display: block;
  height: 66px;
  width: 2px;
}
.c-interface_title::before {
  transform: rotate(-30deg);
}
.c-interface_title::after {
  transform: rotate(30deg);
}
.c-interface_title.method {
  margin: 45px 0 20px;
}
@media screen and (min-width: 768px) {
  .c-interface_title.method {
    margin: 70px 0 30px;
  }
}
.c-interface_title.method::before, .c-interface_title.method::after {
  background-color: #ffee63;
}
.c-interface_title .text {
  padding: 0 33px;
}
.c-interface_btn {
  margin: auto;
  max-width: 390px;
  width: 90%;
}
.c-interface_btn a {
  background-color: #0abf7d;
  border-radius: 5px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(22 * (100vw / 520));
  font-weight: 500;
  padding: 12px;
  text-align: center;
  transition: .4s;
}
@media screen and (min-width: 520px) {
  .c-interface_btn a {
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-interface_btn a {
    font-size: calc(20 * (100vw / 980));
    padding: 18px;
  }
}
@media screen and (min-width: 980px) {
  .c-interface_btn a {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.c-interface_btn a:hover {
  background-color: #35d99d;
}
.c-interface_btn a img {
  margin: 0 8px 0;
  max-width: 30px;
}
@media screen and (min-width: 768px) {
  .c-interface_btn a img {
    max-width: 40px;
  }
}
.c-interface_btn a.counter {
  background-color: #b7d5cd;
  color: #394656;
}
.c-interface_btn a.counter:hover {
  background-color: #cce9e2;
}
.c-interface_btn a.delivery {
  background-color: #f9dad6;
  color: #394656;
}
.c-interface_btn a.delivery:hover {
  background-color: #ffe6e3;
  color: #394656;
}
.c-interface_btn a.bulgeout {
  background-color: #83c5e8;
  color: #394656;
}
.c-interface_btn a.bulgeout:hover {
  background-color: #bde8ff;
}
.c-interface_btnlist {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  max-width: 390px;
  margin: auto;
  width: 90%;
}
@media screen and (min-width: 768px) {
  .c-interface_btnlist {
    max-width: none;
  }
}
.c-interface_btnlist > li {
  width: 49%;
}
@media screen and (min-width: 768px) {
  .c-interface_btnlist > li {
    margin: 0 2% 0 0;
    width: calc(96% / 3);
  }
}
.c-interface_btnlist > li:first-of-type {
  margin: 0 0 10px;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .c-interface_btnlist > li:first-of-type {
    margin: 0 2% 0 0;
    width: calc(96% / 3);
  }
}
.c-interface_btnlist > li:last-of-type {
  margin: 0 0 0 2%;
}
@media screen and (min-width: 768px) {
  .c-interface_btnlist > li:last-of-type {
    margin: 0;
  }
}

/* =========================================================
itemlist
========================================================= */
.c-itemlist--wrap {
  margin: auto;
  max-width: 1200px;
  padding: 80px 0;
  width: 96%;
}
.c-itemlist_title {
  font-size: calc(24 * (100vw / 520));
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 520px) {
  .c-itemlist_title {
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-itemlist_title {
    font-size: calc(20 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-itemlist_title {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.c-itemlist_list {
  display: grid;
  grid-template-areas: "bk1 bk1 bk2 bk2" "bk3 bk3 bk4 bk4" "bk5 bk5 bk6 bk6" "bk7 bk7 bk8 bk8" "bk9 bk9 bk10 bk10" "bk11 bk11 bk12 bk12" "bk13 bk13 bk14 bk14" "bk15 bk15 bk16 bk16" "bk17 bk17 bk18 bk18 ";
  grid-template-columns: repeat(4, 0.4fr);
  grid-template-rows: repeat(7, 0.4fr);
  row-gap: 5px;
  column-gap: 5px;
  margin: 35px 0 0;
}
@media screen and (min-width: 768px) {
  .c-itemlist_list {
    grid-template-areas: "bk1 bk1 bk2 bk2" "bk1 bk1 bk2 bk2" "bk3 bk3 bk4 bk4" "bk5 bk5 bk6 bk6" "bk7 bk7 bk8 bk9" "bk10 bk11 bk12 bk13" "bk14 bk15 bk16 bk17";
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(7, 1fr);
    row-gap: 5px;
    column-gap: 5px;
  }
}
@media screen and (min-width: 768px) {
  .c-itemlist_list {
    row-gap: 10px;
    column-gap: 10px;
  }
}
@media screen and (min-width: 980px) {
  .c-itemlist_list {
    grid-template-areas: "bk1 bk1 bk1 bk1 bk1 bk2 bk2 bk2 bk2 bk2 bk3 bk3 bk3 bk3 bk3" "bk1 bk1 bk1 bk1 bk1 bk2 bk2 bk2 bk2 bk2 bk4 bk4 bk4 bk4 bk4" "bk5 bk5 bk5 bk5 bk5 bk6 bk6 bk6 bk6 bk6 bk7 bk7 bk7 bk7 bk7" "bk8 bk8 bk8 bk9 bk9 bk9 bk10 bk10 bk10 bk11 bk11 bk11 bk12 bk12 bk12" "bk13 bk13 bk13 bk14 bk14 bk14 bk15 bk15 bk15 bk16 bk16 bk16 bk17 bk17 bk17";
    grid-template-columns: repeat(15, 1fr);
    grid-template-rows: repeat(5, 1fr);
  }
}
@media screen and (min-width: 1400px) {
  .c-itemlist_list {
    row-gap: 20px;
    column-gap: 20px;
  }
}
.c-itemlist_list > li:nth-of-type(1) {
  grid-area: bk1;
}
.c-itemlist_list > li:nth-of-type(2) {
  grid-area: bk2;
}
.c-itemlist_list > li:nth-of-type(3) {
  grid-area: bk3;
}
.c-itemlist_list > li:nth-of-type(4) {
  grid-area: bk4;
}
.c-itemlist_list > li:nth-of-type(5) {
  grid-area: bk5;
}
.c-itemlist_list > li:nth-of-type(6) {
  grid-area: bk6;
}
.c-itemlist_list > li:nth-of-type(7) {
  grid-area: bk7;
}
.c-itemlist_list > li:nth-of-type(8) {
  grid-area: bk8;
}
.c-itemlist_list > li:nth-of-type(9) {
  grid-area: bk9;
}
.c-itemlist_list > li:nth-of-type(10) {
  grid-area: bk10;
}
.c-itemlist_list > li:nth-of-type(11) {
  grid-area: bk11;
}
.c-itemlist_list > li:nth-of-type(12) {
  grid-area: bk12;
}
.c-itemlist_list > li:nth-of-type(13) {
  grid-area: bk13;
}
.c-itemlist_list > li:nth-of-type(14) {
  grid-area: bk14;
}
.c-itemlist_list > li:nth-of-type(15) {
  grid-area: bk15;
}
.c-itemlist_list > li:nth-of-type(16) {
  grid-area: bk16;
}
.c-itemlist_list > li:nth-of-type(17) {
  grid-area: bk17;
}
.c-itemlist_list > li a {
  color: #394656;
}
.c-itemlist_list > li figure {
  background-color: #fff;
  border-radius: 5px;
  display: block;
  height: 100%;
  padding: 10px;
  transition: .4s;
}
@media screen and (min-width: 1400px) {
  .c-itemlist_list > li figure {
    padding: 20px;
  }
}
.c-itemlist_list > li figure:hover {
  background-color: #fefefe;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
}
.c-itemlist_list > li figure:hover picture {
  background-color: #e3e3e3;
}
.c-itemlist_list > li figure figcaption {
  display: flex;
  align-items: center;
  margin: 2px 0 0;
  font-size: calc(18 * (100vw / 520));
  font-weight: 500;
}
@media screen and (min-width: 520px) {
  .c-itemlist_list > li figure figcaption {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-itemlist_list > li figure figcaption {
    font-size: calc(16 * (100vw / 980));
    margin: 10px 0 0;
  }
}
@media screen and (min-width: 980px) {
  .c-itemlist_list > li figure figcaption {
    font-size: calc(16 * (100vw / 1150));
    margin: 10px 0 0;
  }
}
@media screen and (min-width: 1150px) {
  .c-itemlist_list > li figure figcaption {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-itemlist_list > li figure figcaption::after {
  background-image: url(../images/common/icon-arrow01.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  content: '';
  display: block;
  height: 15px;
  width: 15px;
  margin: 0 0 0 10px;
  transition: .4s;
}
@media screen and (min-width: 980px) {
  .c-itemlist_list > li figure figcaption::after {
    height: 20px;
    width: 20px;
  }
}
@media screen and (min-width: 1150px) {
  .c-itemlist_list > li figure figcaption::after {
    height: 25px;
    width: 25px;
  }
}
.c-itemlist_list > li figure picture {
  background-color: #f7f7f7;
  border-radius: 5px;
  display: block;
  transition: .4s;
  text-align: center;
}

/* =========================================================
shoplist
========================================================= */
.c-shoplist--wrap {
  margin: auto;
  max-width: 1200px;
  padding: 20px 0 40px;
  width: 96%;
}
@media screen and (min-width: 768px) {
  .c-shoplist--wrap {
    padding: 30px 0 80px;
  }
}
.c-shoplist_title {
  font-size: calc(24 * (100vw / 520));
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 520px) {
  .c-shoplist_title {
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-shoplist_title {
    font-size: calc(20 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-shoplist_title {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.c-shoplist--container {
  margin: 30px 0 0;
}
@media screen and (min-width: 768px) {
  .c-shoplist--container {
    margin: 50px 0 0;
  }
}
.c-shoplist--container.kanto .c-shoplist_list > li {
  width: 49%;
}
.c-shoplist--container.kanto .c-shoplist_list > li:not(:first-of-type) {
  margin: 0 0 0 2%;
}
.c-shoplist--container.kansai .c-shoplist_area::before {
  background-image: url(../images/common/icon-shoplist_pink.svg);
}
.c-shoplist--container.kansai .c-shoplist_area::after {
  background: radial-gradient(circle farthest-side, #ed99a4, #ed99a4 30%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0));
  background-size: 5px 6px;
}
.c-shoplist--container.kansai .c-shoplist_list {
  padding: 7px;
}
@media screen and (min-width: 768px) {
  .c-shoplist--container.kansai .c-shoplist_list {
    padding: 40px 40px 20px;
  }
}
.c-shoplist--container.kansai .c-shoplist_list > li {
  margin: 0 0 10px;
  width: calc(98% / 2);
}
@media screen and (min-width: 768px) {
  .c-shoplist--container.kansai .c-shoplist_list > li {
    margin: 0 0 20px;
    width: calc(96% / 3);
  }
}
.c-shoplist--container.kansai .c-shoplist_list > li:not(:nth-of-type(2n+1)) {
  margin: 0 0 10px 2%;
}
@media screen and (min-width: 768px) {
  .c-shoplist--container.kansai .c-shoplist_list > li:not(:nth-of-type(2n+1)) {
    margin: 0 0 20px;
  }
}
@media screen and (min-width: 768px) {
  .c-shoplist--container.kansai .c-shoplist_list > li:not(:nth-of-type(3n+1)) {
    margin: 0 0 20px 2%;
  }
}
.c-shoplist_area {
  display: flex;
  align-items: center;
  font-size: calc(18 * (100vw / 520));
  font-weight: 500;
}
@media screen and (min-width: 520px) {
  .c-shoplist_area {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-shoplist_area {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-shoplist_area {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-shoplist_area::before {
  background-image: url(../images/common/icon-shoplist_blue.svg);
  background-repeat: no-repeat;
  background-size: contain;
  content: '';
  display: block;
  height: 20px;
  width: 12px;
  margin: 0 .6rem 0 0;
}
.c-shoplist_area::after {
  background: radial-gradient(circle farthest-side, #9dd0eb, #9dd0eb 30%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0));
  background-size: 5px 6px;
  content: '';
  display: inline-block;
  flex-grow: 1;
  height: 5px;
  margin: 0 0 0 1rem;
}
.c-shoplist_list {
  background-color: #e5e5e5;
  border-radius: 5px;
  display: flex;
  flex-wrap: wrap;
  margin: 20px 0 0;
  padding: 7px;
}
@media screen and (min-width: 768px) {
  .c-shoplist_list {
    padding: 40px;
  }
}
.c-shoplist_list > li {
  background-color: #fff;
  border-radius: 5px;
  padding: 12px 7px;
  transition: .4s;
}
@media screen and (min-width: 768px) {
  .c-shoplist_list > li {
    padding: 20px;
  }
}
.c-shoplist_list > li:hover {
  background-color: #fefefe;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);
}
.c-shoplist_list > li:hover picture {
  opacity: .8;
}
.c-shoplist_list > li figure figcaption {
  color: #394656;
  display: flex;
  align-items: center;
  font-size: calc(18 * (100vw / 520));
  font-weight: 500;
  margin: 7px 0 0;
}
@media screen and (min-width: 520px) {
  .c-shoplist_list > li figure figcaption {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-shoplist_list > li figure figcaption {
    font-size: calc(16 * (100vw / 980));
    margin: 10px 0 0;
    padding: 0 10px;
  }
}
@media screen and (min-width: 980px) {
  .c-shoplist_list > li figure figcaption {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-shoplist_list > li figure figcaption::after {
  background-image: url(../images/common/icon-arrow01.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  content: '';
  display: block;
  height: 15px;
  width: 15px;
  margin: 0 0 0 5px;
  transition: .4s;
}
@media screen and (min-width: 768px) {
  .c-shoplist_list > li figure figcaption::after {
    height: 25px;
    width: 25px;
    margin: 0 0 0 10px;
  }
}
.c-shoplist_list > li figure picture {
  display: block;
  transition: .4s;
}
.c-shoplist_list > li figure picture img {
  border-radius: 5px;
}

/* =========================================================
faq - Q&A
========================================================= */
.c-faq {
  padding: 50px 0;
}
@media screen and (min-width: 768px) {
  .c-faq {
    padding: 80px 0;
  }
}
.c-faq--wrap {
  margin: auto;
  max-width: 1200px;
  width: 96vw;
}
.c-faq_title {
  font-size: calc(24 * (100vw / 520));
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 520px) {
  .c-faq_title {
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-faq_title {
    font-size: calc(20 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-faq_title {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.c-faq--container {
  display: flex;
  margin: 40px 0 0;
}
.c-faq_index {
  display: none;
}
@media screen and (min-width: 980px) {
  .c-faq_index {
    display: block;
    width: 450px;
  }
}
.c-faq_index > li label {
  background-image: linear-gradient(to right, #bfbfbf 0%, rgba(0, 0, 0, 0) 0%);
  background-size: 0 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  font-size: calc(16 * (100vw / 520));
  line-height: 1.4;
  margin: 0 0 25px;
  padding: 0;
  transition: .4s;
}
@media screen and (min-width: 520px) {
  .c-faq_index > li label {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-faq_index > li label {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-faq_index > li label {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-faq_index > li label:hover {
  background-image: linear-gradient(to right, #bfbfbf 2px, rgba(0, 0, 0, 0) 2px);
  background-size: 10px 2px;
  background-repeat: repeat-x;
  background-position: left bottom;
  font-weight: 700;
  padding: 0 0 20px;
}
.c-faq_index > li label::before {
  content: 'Q.';
  margin: 0 .6rem 0 0;
}
.c-faq_index > li label::after {
  background-image: url(../images/common/icon-arrow01.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  content: '';
  display: block;
  height: 25px;
  width: 25px;
  margin: 0 0 0 10px;
  transition: .4s;
}
.c-faq_detail {
  background-color: #fff;
  border-radius: 5px;
  height: 60vh;
  overflow-y: scroll;
  padding: 25px;
  width: 100%;
}
@media screen and (min-width: 980px) {
  .c-faq_detail {
    background-color: inherit;
    height: auto;
    margin: 0 0 0 4%;
    overflow-y: inherit;
    padding: 0;
    width: calc(96% - 450px);
  }
}
.c-faq_detail--wrap {
  margin: 0 0 60px;
}
@media screen and (min-width: 980px) {
  .c-faq_detail--wrap {
    margin: 0;
    max-height: 0;
    visibility: hidden;
    opacity: 0;
  }
}
.c-faq_detail--wrap .question {
  background-image: linear-gradient(to right, #bfbfbf 2px, rgba(0, 0, 0, 0) 2px);
  background-size: 10px 2px;
  background-repeat: repeat-x;
  background-position: left bottom;
  display: flex;
  color: #83c5e8;
  font-weight: bold;
  font-size: calc(18 * (100vw / 520));
  font-weight: 500;
  line-height: 1.4;
  margin: 0 0 25px;
  padding: 0 0 25px;
}
@media screen and (min-width: 520px) {
  .c-faq_detail--wrap .question {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-faq_detail--wrap .question {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-faq_detail--wrap .question {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-faq_detail--wrap .question::before {
  background-image: url(../images/common/icon-shoplist_blue.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top 0 left;
  content: 'Q.';
  display: block;
  height: 20px;
  line-height: 1.2;
  margin: 0 .6rem 0 0;
  width: 12px;
  padding: 0 0 3px 16px;
}
.c-faq_detail--wrap .answer {
  font-size: calc(18 * (100vw / 520));
  line-height: 2;
  margin: 0 0 10px;
}
@media screen and (min-width: 520px) {
  .c-faq_detail--wrap .answer {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-faq_detail--wrap .answer {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-faq_detail--wrap .answer {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-faq_detail--wrap .answer::before {
  background-image: url(../images/common/icon-shoplist_pink.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top 0 left;
  color: #f17989;
  content: 'A.';
  display: block;
  height: 20px;
  line-height: 1.2;
  margin: 0 .6rem 10px 0;
  width: 12px;
  padding: 0 0 3px 16px;
}
.c-faq_detail--check:checked + .c-faq_detail--wrap {
  max-height: 999vh;
  opacity: 1;
  visibility: visible;
}

/* =========================================================
voice - お客様の声
========================================================= */
.c-voice {
  padding: 50px 0;
}
@media screen and (min-width: 768px) {
  .c-voice {
    padding: 80px 0;
  }
}
.c-voice--wrap {
  margin: auto;
  max-width: 1200px;
  width: 96vw;
}
.c-voice_title {
  font-size: calc(24 * (100vw / 520));
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 520px) {
  .c-voice_title {
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-voice_title {
    font-size: calc(20 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-voice_title {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.c-voice--container {
  display: flex;
  margin: 40px 0 0;
}
.c-voice_index {
  display: none;
}
@media screen and (min-width: 980px) {
  .c-voice_index {
    display: block;
    width: 450px;
  }
}
.c-voice_index > li label {
  background-image: linear-gradient(to right, #bfbfbf 0%, rgba(0, 0, 0, 0) 0%);
  background-size: 0 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  font-size: calc(16 * (100vw / 520));
  line-height: 1.4;
  margin: 0 0 25px;
  padding: 0;
  transition: .4s;
}
@media screen and (min-width: 520px) {
  .c-voice_index > li label {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-voice_index > li label {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-voice_index > li label {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-voice_index > li label:hover {
  background-image: linear-gradient(to right, #bfbfbf 2px, rgba(0, 0, 0, 0) 2px);
  background-size: 10px 2px;
  background-repeat: repeat-x;
  background-position: left bottom;
  font-weight: 700;
  padding: 0 0 20px;
}
.c-voice_index > li label::after {
  background-image: url(../images/common/icon-arrow01.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  content: '';
  display: block;
  height: 25px;
  width: 25px;
  margin: 0 0 0 10px;
  transition: .4s;
}
.c-voice_detail {
  background-color: #fff;
  border-radius: 5px;
  height: 60vh;
  overflow-y: scroll;
  padding: 25px;
  width: 100%;
}
@media screen and (min-width: 980px) {
  .c-voice_detail {
    background-color: inherit;
    height: auto;
    margin: 0 0 0 4%;
    overflow-y: inherit;
    padding: 0;
    width: calc(96% - 450px);
  }
}
.c-voice_detail--wrap {
  margin: 0 0 60px;
}
@media screen and (min-width: 980px) {
  .c-voice_detail--wrap {
    margin: 0;
    max-height: 0;
    visibility: hidden;
    opacity: 0;
  }
}
.c-voice_detail--wrap .title {
  display: flex;
  color: #83c5e8;
  font-weight: bold;
  font-size: calc(18 * (100vw / 520));
  font-weight: 500;
  line-height: 1.4;
  margin: 0 0 10px;
}
@media screen and (min-width: 520px) {
  .c-voice_detail--wrap .title {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-voice_detail--wrap .title {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-voice_detail--wrap .title {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-voice_detail--wrap .title::before {
  background-image: url(../images/common/icon-shoplist_blue.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top 0 left;
  content: '';
  display: block;
  height: 20px;
  line-height: 1.2;
  margin: 0 .2rem 0 0;
  width: 12px;
  padding: 0 0 3px;
}
.c-voice_detail--wrap .customer {
  background-image: linear-gradient(to right, #bfbfbf 2px, rgba(0, 0, 0, 0) 2px);
  background-size: 10px 2px;
  background-repeat: repeat-x;
  background-position: left bottom;
  font-size: calc(18 * (100vw / 520));
  line-height: 2;
  margin: 0 0 25px;
  padding: 0 0 25px;
}
@media screen and (min-width: 520px) {
  .c-voice_detail--wrap .customer {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-voice_detail--wrap .customer {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-voice_detail--wrap .customer {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-voice_detail--wrap .staff {
  font-size: calc(18 * (100vw / 520));
  line-height: 2;
}
@media screen and (min-width: 520px) {
  .c-voice_detail--wrap .staff {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-voice_detail--wrap .staff {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-voice_detail--wrap .staff {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-voice_detail--check:checked + .c-voice_detail--wrap {
  max-height: 999vh;
  opacity: 1;
  visibility: visible;
}

.c-faq + .c-voice {
  padding: 10px 0 40px;
}
@media screen and (min-width: 768px) {
  .c-faq + .c-voice {
    padding: 10px 0 80px;
  }
}

/* =========================================================
author - 執筆
========================================================= */
.c-author {
  padding: 40px 0;
}
@media screen and (min-width: 768px) {
  .c-author {
    padding: 80px 0;
  }
}
.c-author--wrap {
  background-color: #fff;
  border-radius: 5px;
  margin: auto;
  max-width: 1000px;
  padding: 20px;
  width: 96vw;
}
.c-author--container {
  background-color: #efece4;
  border-radius: 5px;
  padding: 20px;
}
@media screen and (min-width: 768px) {
  .c-author--container {
    padding: 60px;
  }
}
.c-author_title {
  font-size: calc(24 * (100vw / 520));
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 520px) {
  .c-author_title {
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-author_title {
    font-size: calc(20 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-author_title {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.c-author_intro {
  display: flex;
  justify-content: space-between;
  flex-direction: column-reverse;
  margin: 25px 0 0 0;
}
@media screen and (min-width: 768px) {
  .c-author_intro {
    flex-direction: row;
    margin: 45px 0 0 0;
  }
}
.c-author_intro .textarea {
  background-image: linear-gradient(to right, #bfbfbf 2px, rgba(0, 0, 0, 0) 2px), linear-gradient(to left, #bfbfbf 2px, rgba(0, 0, 0, 0) 2px);
  background-size: 10px 2px,10px 2px;
  background-repeat: repeat-x,repeat-x;
  background-position: left top,right bottom;
  font-size: calc(18 * (100vw / 520));
  line-height: 2;
  max-width: 500px;
  padding: 15px 0;
}
@media screen and (min-width: 520px) {
  .c-author_intro .textarea {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-author_intro .textarea {
    font-size: calc(16 * (100vw / 980));
    padding: 30px 0;
  }
}
@media screen and (min-width: 980px) {
  .c-author_intro .textarea {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-author_intro figure {
  margin: 0 0 15px;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .c-author_intro figure {
    margin: 0 0 0 35px;
  }
}
.c-author_intro figure img {
  max-height: 170px;
}
.c-author_personal {
  margin: 10px 0 0 0;
}
.c-author_personal--wrap {
  display: flex;
  align-items: center;
}
.c-author_personal--wrap:not(:first-of-type) {
  margin: 10px 0 0;
}
.c-author_personal--wrap dt {
  border: 1px solid #394656;
  border-radius: 5px;
  font-size: calc(18 * (100vw / 520));
  font-weight: 500;
  text-align: center;
  width: 130px;
}
@media screen and (min-width: 520px) {
  .c-author_personal--wrap dt {
    font-size: calc(18 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-author_personal--wrap dt {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-author_personal--wrap dt {
    font-size: 12px;
    font-size: 0.75rem;
  }
}
.c-author_personal--wrap dd {
  font-size: calc(18 * (100vw / 520));
  margin: 0 0 0 10px;
}
@media screen and (min-width: 520px) {
  .c-author_personal--wrap dd {
    font-size: calc(18 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-author_personal--wrap dd {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-author_personal--wrap dd {
    font-size: 16px;
    font-size: 1rem;
  }
}

/* =========================================================
contact
========================================================= */
.c-contact {
  padding: 40px 0;
}
@media screen and (min-width: 768px) {
  .c-contact {
    padding: 80px 0;
  }
}
.c-contact--wrap {
  background-color: #fff;
  border-radius: 5px;
  margin: auto;
  max-width: 1000px;
  padding: 20px;
  width: 96vw;
}
.c-contact--container {
  background-color: #f2e5e6;
  border-radius: 5px;
  padding: 20px;
}
@media screen and (min-width: 768px) {
  .c-contact--container {
    padding: 50px;
  }
}
.c-contact--text {
  font-size: calc(19 * (100vw / 520));
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
}
@media screen and (min-width: 520px) {
  .c-contact--text {
    font-size: calc(19 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-contact--text {
    font-size: calc(20 * (100vw / 980));
    line-height: 1.6;
  }
}
@media screen and (min-width: 980px) {
  .c-contact--text {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.c-contact_link {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin: 15px auto 0;
  max-width: 570px;
}
@media screen and (min-width: 768px) {
  .c-contact_link {
    flex-direction: row;
    margin: 30px auto 0;
  }
}
.c-contact_link > li {
  width: 100%;
}
@media screen and (min-width: 768px) {
  .c-contact_link > li {
    width: 48%;
  }
}
@media screen and (min-width: 768px) {
  .c-contact_link > li:not(:first-of-type) {
    margin: 0 0 0 4%;
  }
}
.c-contact_link > li a.line {
  background-color: #0abf7d;
  border-radius: 5px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(18 * (100vw / 520));
  font-weight: 500;
  height: 50px;
  margin: 15px 0 0;
  padding: 14px;
  text-align: center;
  transition: .4s;
}
@media screen and (min-width: 520px) {
  .c-contact_link > li a.line {
    font-size: calc(18 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-contact_link > li a.line {
    font-size: calc(15 * (100vw / 980));
    margin: 0;
  }
}
@media screen and (min-width: 980px) {
  .c-contact_link > li a.line {
    font-size: 15px;
    font-size: 0.9375rem;
  }
}
.c-contact_link > li a.line:hover {
  background-color: #35d99d;
}
.c-contact_link > li a.line img {
  margin: 0 2px;
  max-width: 25px;
}
.c-contact_link > li a.tel {
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (min-width: 768px) {
  .c-contact_link > li a.tel {
    justify-content: flex-start;
  }
}
.c-contact_link > li a.tel img {
  max-width: 63px;
}
.c-contact_link > li a.tel .tel-info {
  font-size: calc(34 * (100vw / 520));
  text-align: center;
}
@media screen and (min-width: 520px) {
  .c-contact_link > li a.tel .tel-info {
    font-size: calc(34 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-contact_link > li a.tel .tel-info {
    font-size: calc(28 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-contact_link > li a.tel .tel-info {
    font-size: 28px;
    font-size: 1.75rem;
  }
}
.c-contact_link > li a.tel .tel-info .num {
  display: block;
  font-family: "Lato", serif;
  font-weight: 700;
}
.c-contact_link > li a.tel .tel-info .reduce {
  display: block;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 50%;
  font-weight: 500;
  margin: 5px 0 0;
}

/* =========================================================
chatbot
========================================================= */
#chatplusview, chat {
  position: relative;
  z-index: 2;
}

/* =========================================================
caption - 査定士が自ら、目の前で査定
========================================================= */
.c-caption {
  padding: 30px 0;
}
@media screen and (min-width: 768px) {
  .c-caption {
    padding: 60px 0 80px;
  }
}
.c-caption--wrap {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  flex-direction: row-reverse;
  margin: 0 auto;
  max-width: 980px;
  position: relative;
  width: 90%;
}
@media screen and (min-width: 980px) {
  .c-caption--wrap {
    flex-direction: row;
  }
}
.c-caption_img {
  width: 45%;
}
@media screen and (min-width: 980px) {
  .c-caption_img {
    width: auto;
  }
}
.c-caption_textarea {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
@media screen and (min-width: 980px) {
  .c-caption_textarea {
    flex-direction: row-reverse;
    flex-grow: 0;
    margin: 0 0 0 10%;
  }
}
.c-caption_textarea .title {
  font-size: calc(33 * (100vw / 520));
  font-weight: 500;
  margin: 3% 0 0;
}
@media screen and (min-width: 520px) {
  .c-caption_textarea .title {
    font-size: calc(45 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-caption_textarea .title {
    font-size: calc(45 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-caption_textarea .title {
    font-size: 54px;
    font-size: 3.375rem;
    margin: 15% 0 0;
    writing-mode: vertical-rl;
  }
}
.c-caption_textarea .title .dent {
  display: inline-block;
}
@media screen and (min-width: 980px) {
  .c-caption_textarea .title .dent {
    text-indent: 3rem;
  }
}
.c-caption_textarea .text {
  font-size: calc(20 * (100vw / 520));
  font-weight: 500;
}
@media screen and (min-width: 520px) {
  .c-caption_textarea .text {
    font-size: calc(30 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .c-caption_textarea .text {
    font-size: calc(30 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .c-caption_textarea .text {
    font-size: 32px;
    font-size: 2rem;
    margin: 0 0 0 7%;
    writing-mode: vertical-rl;
  }
}
.c-caption_textarea .text .line {
  margin: 0 0 0 8%;
  position: relative;
}
@media screen and (min-width: 980px) {
  .c-caption_textarea .text .line {
    margin: 0;
  }
}
.c-caption_textarea .text .line::before, .c-caption_textarea .text .line::after {
  background-color: #000;
  content: '';
  display: inline-block;
  margin: 5px;
  height: 1px;
  width: 14px;
}
@media screen and (min-width: 520px) {
  .c-caption_textarea .text .line::before, .c-caption_textarea .text .line::after {
    margin: 9px 5px;
  }
}
@media screen and (min-width: 980px) {
  .c-caption_textarea .text .line::before, .c-caption_textarea .text .line::after {
    margin: 15px 0;
    height: 25px;
    width: 1px;
  }
}

/* =========================================================
header
========================================================= */
.p-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: auto;
  padding: 18px 0 10px;
  width: 92vw;
}
@media screen and (min-width: 768px) {
  .p-header {
    display: block;
    margin: 0;
    padding: 50px 0 20px;
    width: auto;
  }
}
.p-header--wrap {
  display: flex;
  justify-content: space-between;
}
@media screen and (min-width: 768px) {
  .p-header--wrap {
    max-width: 1450px;
    margin: auto;
    width: 96vw;
  }
}
@media screen and (min-width: 768px) {
  .p-header--wrap.secondary {
    margin: 25px auto 0;
  }
}
.p-header--wrap.tertiary {
  display: block;
}
@media screen and (min-width: 768px) {
  .p-header--wrap.tertiary {
    display: none;
  }
}
.p-header-logo {
  display: flex;
  align-items: center;
  flex-grow: 1;
  max-width: 210px;
}
.p-header-logo picture {
  display: block;
  width: 100%;
}
.p-header-logo picture img {
  min-width: calc(160 * (100vw / 520));
}
@media screen and (min-width: 520px) {
  .p-header-logo picture img {
    min-width: 160px;
  }
}
@media screen and (min-width: 1150px) {
  .p-header-logo picture img {
    width: 210px;
    height: 49px;
  }
}
.p-header-search {
  display: none;
  flex-grow: 1;
  margin: auto;
  width: 92vw;
}
@media screen and (min-width: 768px) {
  .p-header-search {
    display: block;
    max-width: 610px;
    margin: 0 0 0 15px;
    width: auto;
  }
}
.p-header-search .search_form {
  display: flex;
}
.p-header-search .search_input {
  background-color: #fff;
  border: none;
  border-radius: 50px 0 0 50px;
  color: #9c9c9c;
  font-weight: 200;
  outline: none;
  font-size: calc(16 * (100vw / 520));
  padding: 12px 25px;
  transition: .4s;
  width: calc(100% - 60px);
}
@media screen and (min-width: 520px) {
  .p-header-search .search_input {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-header-search .search_input {
    font-size: calc(16 * (100vw / 980));
    padding: 16px 25px;
  }
}
@media screen and (min-width: 980px) {
  .p-header-search .search_input {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-header-search .search_input:hover {
  background-color: #eee;
}
.p-header-search .search_submit {
  background-color: #81a6c9;
  background-image: url("../images/common/icon-search_white.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px;
  border: none;
  border-radius: 0 50px 50px 0;
  font-size: calc(16 * (100vw / 520));
  transition: .4s;
  width: 60px;
}
@media screen and (min-width: 520px) {
  .p-header-search .search_submit {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-header-search .search_submit {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-header-search .search_submit {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-header-search .search_submit:hover {
  background-color: #6889a9;
  cursor: pointer;
}
.p-header-search_resultsbtn a {
  background: #b29443;
  border-radius: 50px;
  color: #fff;
  display: flex;
  align-items: center;
  font-size: calc(17 * (100vw / 520));
  font-weight: 500;
  text-align: center;
  max-width: 450px;
  padding: 8px 15px;
  position: relative;
  width: 100%;
}
@media screen and (min-width: 520px) {
  .p-header-search_resultsbtn a {
    font-size: calc(17 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-header-search_resultsbtn a {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-header-search_resultsbtn a {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-header-search_resultsbtn a::before {
  background-image: url(../images/common/icon-results.webp);
  background-size: 30px;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 50px;
  content: '';
  display: block;
  height: 30px;
  width: 30px;
  margin: 0 5px 0 0;
}
.p-header-search_resultsbtn a::after {
  background-image: url(../images/common/icon-triangle01.svg);
  background-repeat: no-repeat;
  content: '';
  display: block;
  height: 12px;
  width: 12px;
  position: absolute;
  right: 5%;
  top: 0;
  bottom: 0;
  margin: auto;
  transform: rotate(-90deg);
}
.p-header-tel {
  display: flex;
  align-items: center;
  flex-grow: 1;
  max-width: 270px;
  margin: 0 0 0 15px;
}
.p-header-tel--wrap {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.p-header-tel--wrap > a {
  color: #394656;
  font-family: "Lato", serif;
  font-size: calc(30 * (100vw / 520));
  font-weight: 700;
  letter-spacing: .06rem;
}
@media screen and (min-width: 520px) {
  .p-header-tel--wrap > a {
    font-size: calc(28 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-header-tel--wrap > a {
    font-size: calc(28 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-header-tel--wrap > a {
    font-size: 28px;
    font-size: 1.75rem;
  }
}
.p-header-tel--wrap .reduce {
  display: block;
  font-size: calc(14 * (100vw / 520));
  font-weight: 400;
  letter-spacing: .06rem;
  margin: 2px 0 0;
}
@media screen and (min-width: 520px) {
  .p-header-tel--wrap .reduce {
    font-size: calc(14 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-header-tel--wrap .reduce {
    font-size: calc(14 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-header-tel--wrap .reduce {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.p-header-tel--wrap .time {
  font-family: "Lato", serif;
  font-weight: 700;
  margin: 0 8px 0 0;
}
.p-header-tel .icon {
  display: none;
  padding: 0 12px 0 0;
  position: relative;
}
@media screen and (min-width: 520px) {
  .p-header-tel .icon {
    display: block;
  }
}
.p-header-tel .icon:before {
  background-image: url(../images/common/icon-phone_white.svg);
  background-color: #f17989;
  background-size: 38%;
  border-radius: 50px;
  background-repeat: no-repeat;
  background-position: center;
  content: '';
  display: block;
  height: 50px;
  width: 50px;
}
.p-header-tel .icon:after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 12.5px 19px 7.5px;
  border-color: transparent transparent #f17989 transparent;
  position: absolute;
  top: 55%;
  left: 36px;
}
.p-header-line {
  display: none;
  flex-grow: 1;
  max-width: 260px;
  margin: 0 0 0 15px;
}
@media screen and (min-width: 980px) {
  .p-header-line {
    display: block;
  }
}
.p-header-line a {
  background-color: #0abf7d;
  border-radius: 5px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(16 * (100vw / 520));
  padding: 11px;
  transition: .4s;
}
@media screen and (min-width: 520px) {
  .p-header-line a {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-header-line a {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-header-line a {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-header-line a:hover {
  background-color: #35d99d;
}
.p-header-line a img {
  margin: 0 6px;
  max-width: 30px;
}
.p-header-globalnav {
  display: none;
  flex-grow: 1;
  max-width: 920px;
}
@media screen and (min-width: 768px) {
  .p-header-globalnav {
    display: block;
  }
}
.p-header-globalnav ul.main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 50px;
}
.p-header-globalnav ul.main > li {
  display: flex;
  align-items: center;
  height: 50px;
  position: relative;
}
.p-header-globalnav ul.main > li > span,
.p-header-globalnav ul.main > li a {
  color: #394656;
  cursor: pointer;
  font-size: calc(16 * (100vw / 520));
  font-weight: 500;
}
@media screen and (min-width: 520px) {
  .p-header-globalnav ul.main > li > span,
  .p-header-globalnav ul.main > li a {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-header-globalnav ul.main > li > span,
  .p-header-globalnav ul.main > li a {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-header-globalnav ul.main > li > span,
  .p-header-globalnav ul.main > li a {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-header-globalnav ul.main > li:not(:first-of-type) {
  margin: 0 0 0 20px;
}
.p-header-globalnav ul.main > li:hover ul.sub {
  opacity: 1;
  visibility: visible;
  max-height: 999vh;
}
.p-header-globalnav ul.sub {
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  padding: 15px 10px;
  opacity: 0;
  visibility: hidden;
  max-height: 0;
  position: absolute;
  top: 50px;
  left: -60px;
  width: 240px;
  transition: .4s;
  z-index: 1;
}
.p-header-globalnav ul.sub > li > span,
.p-header-globalnav ul.sub > li a {
  color: #394656;
  cursor: pointer;
  font-size: calc(16 * (100vw / 520));
  font-weight: 500;
}
@media screen and (min-width: 520px) {
  .p-header-globalnav ul.sub > li > span,
  .p-header-globalnav ul.sub > li a {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-header-globalnav ul.sub > li > span,
  .p-header-globalnav ul.sub > li a {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-header-globalnav ul.sub > li > span,
  .p-header-globalnav ul.sub > li a {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-header-globalnav ul.sub > li a {
  background-color: #f8f8f8;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 15px;
  transition: .4s;
}
.p-header-globalnav ul.sub > li a::after {
  background-image: url(../images/common/icon-triangle02.svg);
  background-repeat: no-repeat;
  background-size: cover;
  content: '';
  display: block;
  height: 10px;
  width: 10px;
  position: relative;
  transform: rotate(-90deg);
}
.p-header-globalnav ul.sub > li a:hover {
  background-color: #9bbddd;
  color: #fff;
}
.p-header-globalnav ul.sub > li a:hover::after {
  background-image: url(../images/common/icon-triangle01.svg);
}
.p-header-globalnav ul.sub > li:not(:first-of-type) {
  margin: 6px 0 0;
}
.p-header-globalnav ul.sub > li.boundary::before {
  background: radial-gradient(circle farthest-side, #9dd0eb, #9dd0eb 30%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0));
  background-size: 5px 6px;
  content: '';
  display: inline-block;
  flex-grow: 1;
  height: 5px;
  margin: 0 0 8px 0;
  width: 100%;
}
.p-header-mypage {
  display: none;
  margin: 0 0 0 25px;
}
@media screen and (min-width: 1150px) {
  .p-header-mypage {
    display: block;
  }
}
.p-header-mypage a {
  color: #394656;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(16 * (100vw / 520));
  font-weight: 500;
}
@media screen and (min-width: 520px) {
  .p-header-mypage a {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-header-mypage a {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-header-mypage a {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-header-mypage a::before {
  background-color: #f9dad6;
  background-image: url(../images/common/icon-mypage.webp);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 25px;
  border-radius: 50px;
  content: '';
  display: block;
  height: 50px;
  width: 50px;
  margin: 0 10px 0 0;
  transition: .4s;
}
.p-header-mypage a::after {
  background-image: url(../images/common/icon-arrow01.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  content: '';
  display: block;
  height: 25px;
  width: 25px;
  margin: 0 0 0 10px;
  transition: .4s;
}
.p-header-mypage a:hover::before {
  background-color: #e7bdb8;
}
.p-header-drawerbtn {
  margin: 0 0 0 10px;
}
@media screen and (min-width: 520px) {
  .p-header-drawerbtn {
    margin: 0 0 0 10px;
  }
}
@media screen and (min-width: 768px) {
  .p-header-drawerbtn {
    margin: 0 0 0 25px;
  }
}
.p-header-drawerbtn label {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.p-header-drawerbtn .icon {
  background-color: #81a6c9;
  border-radius: 50px;
  height: 50px;
  width: 50px;
  position: relative;
  transition: .4s;
}
.p-header-drawerbtn .icon::before, .p-header-drawerbtn .icon::after {
  background-color: #fff;
  content: '';
  display: block;
  height: 2px;
  width: 18px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.p-header-drawerbtn .icon::before {
  top: 14px;
}
.p-header-drawerbtn .icon::after {
  bottom: 14px;
}
.p-header-drawerbtn .icon:hover {
  background-color: #6889a9;
}
.p-header-drawerbtn .icon .border {
  background-color: #fff;
  height: 2px;
  width: 18px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.p-header-drawerbtn .text {
  color: #394656;
  display: none;
  font-size: calc(16 * (100vw / 520));
  font-weight: 500;
  margin: 0 0 0 10px;
}
@media screen and (min-width: 520px) {
  .p-header-drawerbtn .text {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-header-drawerbtn .text {
    font-size: calc(16 * (100vw / 980));
    display: inline-block;
  }
}
@media screen and (min-width: 980px) {
  .p-header-drawerbtn .text {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-header-spnav {
  display: block;
  margin: auto;
  padding: 5px 0 10px;
  width: 92vw;
}
@media screen and (min-width: 768px) {
  .p-header-spnav {
    display: none;
  }
}
.p-header-spnav > .p-header-search {
  display: block;
}
@media screen and (min-width: 768px) {
  .p-header-spnav > .p-header-search {
    display: none;
  }
}
.p-header-spnav_list {
  display: flex;
  flex-wrap: wrap;
}
.p-header-spnav_list > li {
  margin: 10px 1% 0;
  width: calc(94% / 3);
}
.p-header-spnav_list > li > a,
.p-header-spnav_list > li .p-header-spnav--label {
  background-color: #ccc;
  border-radius: 5px;
  color: #394656;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(16 * (100vw / 520));
  font-weight: 500;
  min-height: calc(54 * (100vw / 520));
  width: 100%;
}
@media screen and (min-width: 520px) {
  .p-header-spnav_list > li > a,
  .p-header-spnav_list > li .p-header-spnav--label {
    font-size: calc(16 * (100vw / 768));
    min-height: calc(54 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-header-spnav_list > li > a,
  .p-header-spnav_list > li .p-header-spnav--label {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-header-spnav_list > li > a,
  .p-header-spnav_list > li .p-header-spnav--label {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-header-spnav_list > li > a .icon,
.p-header-spnav_list > li .p-header-spnav--label .icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.p-header-spnav_list > li > a .icon::before,
.p-header-spnav_list > li .p-header-spnav--label .icon::before {
  background-repeat: no-repeat;
  background-size: cover;
  content: '';
  display: block;
  height: 23px;
  width: 23px;
  margin: 0 3px 0 0;
}
.p-header-spnav_list > li > a.campaign,
.p-header-spnav_list > li .p-header-spnav--label.campaign {
  background-color: #faee68;
}
.p-header-spnav_list > li > a.campaign .icon::before,
.p-header-spnav_list > li .p-header-spnav--label.campaign .icon::before {
  background-image: url(../images/common/icon-campaign.webp);
}
.p-header-spnav_list > li > a.shop,
.p-header-spnav_list > li .p-header-spnav--label.shop {
  background-color: #b7d5cd;
}
.p-header-spnav_list > li > a.shop .icon::before,
.p-header-spnav_list > li .p-header-spnav--label.shop .icon::before {
  background-image: url(../images/common/icon-shop.webp);
}
.p-header-spnav_list > li > a.mypage,
.p-header-spnav_list > li .p-header-spnav--label.mypage {
  background-color: #f9dad6;
}
.p-header-spnav_list > li > a.mypage .icon::before,
.p-header-spnav_list > li .p-header-spnav--label.mypage .icon::before {
  background-image: url(../images/common/icon-mypage.webp);
}
.p-header-spnav--checkbox:checked ~ .p-header-spnav--container {
  visibility: visible;
  opacity: 1;
  max-height: 999vh;
  z-index: 501;
}
.p-header-spnav--checkbox:checked ~ .p-header-spnav--overlay {
  background-color: rgba(0, 0, 0, 0.5);
  cursor: pointer;
  height: 100vh;
  width: 100vw;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 500;
}
.p-header-spnav_banner {
  display: flex;
  flex-wrap: wrap;
}
.p-header-spnav_banner > li {
  margin: 0 1% 10px;
  width: calc(94% / 3);
}
.p-header-spnav--container {
  background-color: #fff;
  padding: 25px 0 10px;
  visibility: hidden;
  opacity: 0;
  position: fixed;
  max-height: 0;
  width: calc(92vw - 2%);
  transition: .4s;
}
.p-header-spnav--overlay {
  transition: .4s;
}
.p-header-spnav--close {
  background-color: #81a6c9;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -12px;
  right: -5px;
  height: 28px;
  width: 28px;
}
.p-header-float {
  background-color: rgba(247, 247, 247, 0.9);
  display: flex;
  align-items: center;
  justify-content: space-between;
  opacity: 0;
  visibility: hidden;
  max-height: 0;
  padding: 10px 2vw;
  position: fixed;
  width: 100vw;
  z-index: 499;
  transition: .4s;
}
@media screen and (min-width: 768px) {
  .p-header-float {
    display: none;
  }
}
.p-header-float > .p-header-search {
  display: block;
  margin: 0 0 0 10px;
  width: auto;
}
@media screen and (min-width: 768px) {
  .p-header-float > .p-header-search {
    display: none;
  }
}
.p-header-float > .p-header-search .search_input {
  padding: 12px 10px;
  width: calc(100% - 50px);
}
.p-header-float > .p-header-search .search_submit {
  width: 50px;
}
.p-header-float > .p-header-logo {
  max-width: 120px;
  min-width: calc(160*(100vw / 520));
}
.p-header .textline {
  position: relative;
}
.p-header .textline::after {
  background-color: #929292;
  content: '';
  display: block;
  height: 2px;
  width: 0;
  position: absolute;
  bottom: -4px;
  z-index: 0;
  transition: .4s;
}
.p-header .textline:hover::after {
  width: 100%;
}

/* =========================================================
footer - フッター内のクラス
========================================================= */
.p-footer {
  background-color: #fff;
  padding: 40px 0 calc(160 * (100vw / 768));
}
@media screen and (min-width: 768px) {
  .p-footer {
    padding: 50px 0;
  }
}
.p-footer--wrap {
  display: flex;
  justify-content: space-between;
  margin: auto;
  max-width: 1450px;
  width: 96vw;
}
.p-footer--wrap.secondary {
  margin: 25px auto 0;
}
@media screen and (min-width: 768px) {
  .p-footer--wrap.secondary {
    margin: 65px auto 0;
  }
}
.p-footer-logo {
  display: none;
  align-items: center;
  flex-grow: 1;
  max-width: 210px;
}
@media screen and (min-width: 768px) {
  .p-footer-logo {
    display: flex;
  }
}
.p-footer-logo picture {
  display: block;
  width: 100%;
}
.p-footer-logo picture img {
  min-width: calc(160 * (100vw / 520));
}
@media screen and (min-width: 520px) {
  .p-footer-logo picture img {
    min-width: 160px;
  }
}
.p-footer-search {
  flex-grow: 1;
  max-width: 610px;
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  .p-footer-search {
    margin: 0 0 0 15px;
  }
}
.p-footer-search .search_form {
  display: flex;
}
.p-footer-search .search_input {
  background-color: #f7f7f7;
  border: none;
  border-radius: 50px 0 0 50px;
  color: #9c9c9c;
  font-weight: 200;
  outline: none;
  font-size: calc(16 * (100vw / 520));
  padding: 12px 25px;
  transition: .4s;
  width: calc(100% - 60px);
}
@media screen and (min-width: 520px) {
  .p-footer-search .search_input {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-footer-search .search_input {
    font-size: calc(16 * (100vw / 980));
    padding: 16px 25px;
  }
}
@media screen and (min-width: 980px) {
  .p-footer-search .search_input {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-footer-search .search_input:hover {
  background-color: #eee;
}
.p-footer-search .search_submit {
  background-color: #81a6c9;
  background-image: url("../images/common/icon-search_white.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px;
  border: none;
  border-radius: 0 50px 50px 0;
  font-size: calc(16 * (100vw / 520));
  transition: .4s;
  width: 60px;
}
@media screen and (min-width: 520px) {
  .p-footer-search .search_submit {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-footer-search .search_submit {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-footer-search .search_submit {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-footer-search .search_submit:hover {
  background-color: #6889a9;
  cursor: pointer;
}
.p-footer-tel {
  display: none;
  align-items: center;
  flex-grow: 1;
  max-width: 270px;
  margin: 0 0 0 15px;
}
@media screen and (min-width: 768px) {
  .p-footer-tel {
    display: flex;
  }
}
.p-footer-tel--wrap {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.p-footer-tel--wrap > a {
  color: #394656;
  font-family: "Lato", serif;
  font-size: calc(28 * (100vw / 520));
  font-weight: bold;
  letter-spacing: .06rem;
}
@media screen and (min-width: 520px) {
  .p-footer-tel--wrap > a {
    font-size: calc(28 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-footer-tel--wrap > a {
    font-size: calc(28 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-footer-tel--wrap > a {
    font-size: 28px;
    font-size: 1.75rem;
  }
}
.p-footer-tel--wrap .reduce {
  display: block;
  font-size: calc(14 * (100vw / 520));
  font-weight: 400;
  letter-spacing: .06rem;
  margin: 2px 0 0;
}
@media screen and (min-width: 520px) {
  .p-footer-tel--wrap .reduce {
    font-size: calc(14 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-footer-tel--wrap .reduce {
    font-size: calc(14 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-footer-tel--wrap .reduce {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.p-footer-tel--wrap .time {
  font-family: "Lato", serif;
  margin: 0 8px 0 0;
}
.p-footer-tel .icon {
  padding: 0 12px 0 0;
  position: relative;
}
.p-footer-tel .icon:before {
  background-image: url(../images/common/icon-phone_white.svg);
  background-color: #f17989;
  background-size: 38%;
  border-radius: 50px;
  background-repeat: no-repeat;
  background-position: center;
  content: '';
  display: block;
  height: 50px;
  width: 50px;
}
.p-footer-tel .icon:after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 12.5px 19px 7.5px;
  border-color: transparent transparent #f17989 transparent;
  position: absolute;
  top: 55%;
  left: 36px;
}
.p-footer-line {
  display: none;
  flex-grow: 1;
  max-width: 260px;
  margin: 0 0 0 15px;
}
@media screen and (min-width: 980px) {
  .p-footer-line {
    display: block;
  }
}
.p-footer-line a {
  background-color: #0abf7d;
  border-radius: 5px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(16 * (100vw / 520));
  padding: 11px;
  transition: .4s;
}
@media screen and (min-width: 520px) {
  .p-footer-line a {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-footer-line a {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-footer-line a {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-footer-line a:hover {
  background-color: #35d99d;
}
.p-footer-line a img {
  margin: 0 6px;
  max-width: 30px;
}
.p-footer-nav {
  display: flex;
  flex-direction: column;
  width: 100%;
}
@media screen and (min-width: 1150px) {
  .p-footer-nav {
    flex-direction: row;
  }
}
.p-footer-nav_list01 {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  flex-grow: 1;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .p-footer-nav_list01 {
    flex-direction: row;
  }
}
@media screen and (min-width: 1150px) {
  .p-footer-nav_list01 {
    width: calc(100% - 325px - 80px);
  }
}
.p-footer-nav_list01--wrap {
  border-bottom: 1px solid #f7f7f7;
  margin: 0 0 10px;
}
@media screen and (min-width: 768px) {
  .p-footer-nav_list01--wrap {
    border-bottom: none;
    margin: 0;
  }
}
@media screen and (min-width: 768px) {
  .p-footer-nav_list01--wrap:not(:first-of-type) {
    margin: 0 0 0 30px;
  }
}
.p-footer-nav_list01--wrap dt {
  color: #394656;
  font-size: calc(16 * (100vw / 520));
  font-weight: 500;
  margin: 0 0 10px;
}
@media screen and (min-width: 520px) {
  .p-footer-nav_list01--wrap dt {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-footer-nav_list01--wrap dt {
    font-size: calc(16 * (100vw / 980));
    margin: 0 0 35px;
  }
}
@media screen and (min-width: 980px) {
  .p-footer-nav_list01--wrap dt {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-footer-nav_list01--wrap dd .subpage {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
@media screen and (min-width: 768px) {
  .p-footer-nav_list01--wrap dd .subpage {
    flex-direction: column;
  }
}
.p-footer-nav_list01--wrap dd .subpage > li {
  margin: 0 7px 7px 0;
}
@media screen and (min-width: 768px) {
  .p-footer-nav_list01--wrap dd .subpage > li {
    margin: 0 0 10px;
  }
}
.p-footer-nav_list01--wrap dd .subpage > li a {
  color: #394656;
  font-size: calc(14 * (100vw / 520));
}
@media screen and (min-width: 520px) {
  .p-footer-nav_list01--wrap dd .subpage > li a {
    font-size: calc(14 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-footer-nav_list01--wrap dd .subpage > li a {
    font-size: calc(14 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-footer-nav_list01--wrap dd .subpage > li a {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.p-footer-nav_list01--wrap dd .subpage > li a:hover {
  text-decoration: underline;
}
.p-footer-nav_list02 {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin: 20px 0 0;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .p-footer-nav_list02 {
    margin: 40px 0 0;
  }
}
@media screen and (min-width: 1150px) {
  .p-footer-nav_list02 {
    margin: 0 0 0 80px;
    max-width: 325px;
    width: auto;
  }
}
.p-footer-nav_list02 .page {
  display: flex;
  flex-wrap: wrap;
}
.p-footer-nav_list02 .page > li {
  margin: 0 25px 15px 0;
}
@media screen and (min-width: 1150px) {
  .p-footer-nav_list02 .page > li {
    margin: 0 0 35px;
    width: 48%;
  }
}
@media screen and (min-width: 1150px) {
  .p-footer-nav_list02 .page > li:nth-of-type(2n+2) {
    margin: 0 0 35px 4%;
  }
}
.p-footer-nav_list02 .page > li a {
  color: #394656;
  font-size: calc(16 * (100vw / 520));
  font-weight: 500;
}
@media screen and (min-width: 520px) {
  .p-footer-nav_list02 .page > li a {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-footer-nav_list02 .page > li a {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-footer-nav_list02 .page > li a {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-footer-mypage {
  margin: 20px 0 0;
}
@media screen and (min-width: 768px) {
  .p-footer-mypage {
    margin: 0;
  }
}
.p-footer-mypage a {
  color: #394656;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(16 * (100vw / 520));
  font-weight: 500;
}
@media screen and (min-width: 520px) {
  .p-footer-mypage a {
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-footer-mypage a {
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-footer-mypage a {
    font-size: 16px;
    font-size: 1rem;
  }
}
.p-footer-mypage a::before {
  background-color: #f9dad6;
  background-image: url(../images/common/icon-mypage.webp);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 25px;
  border-radius: 50px;
  content: '';
  display: block;
  height: 50px;
  width: 50px;
  margin: 0 10px 0 0;
  transition: .4s;
}
.p-footer-mypage a::after {
  background-image: url(../images/common/icon-arrow01.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  content: '';
  display: block;
  height: 25px;
  width: 25px;
  margin: 0 0 0 10px;
  transition: .4s;
}
.p-footer-mypage a:hover::before {
  background-color: #e7bdb8;
}
.p-footer-ltd_hikida {
  margin: 30px auto 0;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-footer-ltd_hikida {
    margin: 0 auto;
    text-align: left;
  }
}
.p-footer-ltd_hikida a {
  display: block;
  margin: 0 0 5px;
  transition: .4s;
}
.p-footer-ltd_hikida a:hover {
  opacity: .7;
}
.p-footer-ltd_hikida .authorization,
.p-footer-ltd_hikida .copyright {
  font-size: calc(14 * (100vw / 520));
}
@media screen and (min-width: 520px) {
  .p-footer-ltd_hikida .authorization,
  .p-footer-ltd_hikida .copyright {
    font-size: calc(14 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-footer-ltd_hikida .authorization,
  .p-footer-ltd_hikida .copyright {
    font-size: calc(14 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-footer-ltd_hikida .authorization,
  .p-footer-ltd_hikida .copyright {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.p-footer-ltd_hikida .authorization {
  margin: 15px auto 0;
}
.p-footer .textline {
  color: #394656;
  position: relative;
}
.p-footer .textline::after {
  background-color: #929292;
  content: '';
  display: block;
  height: 2px;
  width: 0;
  position: absolute;
  bottom: -4px;
  z-index: 0;
  transition: .4s;
}
.p-footer .textline:hover::after {
  width: 100%;
}

/* =========================================================
オールドエルメス
========================================================= */
.p-old-hermes-mv{
  background: url(../images/old-hermes/mv-bg.webp) repeat-x center bottom;
  background-size: cover;
}
.p-old-hermes-mv .p-old-hermes-mv--in{
  margin: 0 auto;
  max-width: 1000px;
  width: 100%;
  text-align: center;
}
.p-old-hermes-mv picture{

}
.p-old-hermes-mv img{
  display: inline-block;
  width: 100%;
}

.p-old-hermes-about{
  background: url(../images/old-hermes/about-bg.webp) repeat center;
  background-size: cover;
  padding: 30px;
}
.p-old-hermes-about .p-old-hermes-about--in{
  background: #ffffff;
  border-radius: 20px;
  margin: 0 auto;
  max-width: 1000px;
  padding: 20px;
  text-align: center;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .p-old-hermes-about .p-old-hermes-about--in{
    border-radius: 30px;
    padding: 40px;
  }
}
@media screen and (min-width: 768px) {
  .p-old-hermes-about .p-old-hermes-about--box{
    display: flex;
    vertical-align: middle;
    flex-direction: row-reverse;
  }
}
.p-old-hermes-about .p-old-hermes-about--box:first-of-type{
  border-bottom: 1px solid #C8C9CA;
  padding-bottom: 30px;
  margin-bottom: 30px;
}
@media screen and (min-width: 768px) {
  .p-old-hermes-about .p-old-hermes-about--box:first-of-type{
    flex-direction: row;
  }
  .p-old-hermes-about .p-old-hermes-about--box:first-of-type dl{
    padding-left: 5%;
    padding-right: 0;
  }
}
.p-old-hermes-about .p-old-hermes-about--box picture{
  width: 100%;
}
@media screen and (min-width: 768px) {
  .p-old-hermes-about .p-old-hermes-about--box picture{
    max-width: 30%;
  }
}
.p-old-hermes-about .p-old-hermes-about--box img{

}
.p-old-hermes-about .p-old-hermes-about--box dl{
}
@media screen and (min-width: 768px) {
  .p-old-hermes-about .p-old-hermes-about--box dl{
    padding-right: 5%;
    text-align: left;
    flex-grow: 1;
    width: 60%;
  }
}
.p-old-hermes-about .p-old-hermes-about--box dt{
  color: #3E3A39;
  font-size: calc(27 * (100vw / 520));
  font-weight: bold;
  line-height: 1.6;
  margin: 10px auto;
}
@media screen and (min-width: 520px) {
  .p-old-hermes-about .p-old-hermes-about--box dt{
    font-size: calc(27 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-old-hermes-about .p-old-hermes-about--box dt{
    font-size: calc(27 * (100vw / 980));
    text-align: left;
    margin: 0 auto 10px;
  }
}
@media screen and (min-width: 980px) {
  .p-old-hermes-about .p-old-hermes-about--box dt{
    font-size: 27px;
  }
}
.p-old-hermes-about .p-old-hermes-about--box dd{
  font-size: calc(18 * (100vw / 520));
  line-height: 1.6;
  text-align: left;
}
@media screen and (min-width: 520px) {
  .p-old-hermes-about .p-old-hermes-about--box dd{
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-old-hermes-about .p-old-hermes-about--box dd{
    font-size: calc(16 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-old-hermes-about .p-old-hermes-about--box dd{
    font-size: 16px;
  }
}

.p-old-hermes-how{
  background: #ffffff;
  padding: 50px 0;
}
.p-old-hermes-how .p-old-hermes-how--in{
  margin: 0 auto;
  max-width: 1000px;
  width: 90%;
  text-align: center;
}
.p-old-hermes-how h2{
  font-size: calc(25 * (100vw / 520));
  font-weight: 700;
  text-align: center;
  margin-bottom: 30px;
}
@media screen and (min-width: 520px) {
  .p-old-hermes-how h2{
    font-size: calc(25 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-old-hermes-how h2{
    font-size: calc(25 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-old-hermes-how h2{
    font-size: 25px;
  }
}

.p-old-hermes-how .p-old-hermes-how--contents{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto 20px;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .p-old-hermes-how .p-old-hermes-how--contents{
    margin-bottom: 30px;
  }
}
.p-old-hermes-how .p-old-hermes-how--contents section{
  width: 30%;
}
.p-old-hermes-how .p-old-hermes-how--contents picture{

}
.p-old-hermes-how .p-old-hermes-how--contents img{

}
.p-old-hermes-how .p-old-hermes-how--contents dl{

}
.p-old-hermes-how .p-old-hermes-how--contents dt{

}
.p-old-hermes-how .p-old-hermes-how--contents dd{
  text-align: left;
  font-size: calc(18 * (100vw / 520));
}
@media screen and (min-width: 520px) {
  .p-old-hermes-how .p-old-hermes-how--contents dd{
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-old-hermes-how .p-old-hermes-how--contents dd{
    font-size: calc(16 * (100vw / 980));
    max-width: 100%;
    text-align: center;
  }
}
@media screen and (min-width: 980px) {
  .p-old-hermes-how .p-old-hermes-how--contents dd{
    font-size: 16px;
  }
}
.p-old-hermes-how .p-old-hermes-how--contents dd .pc-show{
  display: none;
}
@media screen and (min-width: 768px) {
  .p-old-hermes-how .p-old-hermes-how--contents dd .pc-show{
    display: block;
  }
}

.p-old-hermes-how .p-old-hermes-how--line{
  background: #58BF38;
  border-radius: 40px;
  padding: 10px;
  margin:0 auto 20px;
  max-width: 600px;
}
@media screen and (min-width: 768px) {
  .p-old-hermes-how .p-old-hermes-how--line{
    display: flex;
    padding: 20px 40px;
  }
}
.p-old-hermes-how .p-old-hermes-how--line picture{
  display: none;
}
@media screen and (min-width: 768px) {
  .p-old-hermes-how .p-old-hermes-how--line picture{
    display: block;
    max-width: 150px;
  }
}
.p-old-hermes-how .p-old-hermes-how--line picture img{
  display: inline-block;
  max-width: 150px;
}

.p-old-hermes-how .p-old-hermes-how--contents dd .pc-show{
  display: none;
}
@media screen and (min-width: 768px) {
  .p-old-hermes-how .p-old-hermes-how--contents dd .pc-show{
    display: block;
  }
}

.p-old-hermes-how .p-old-hermes-how--line dl{
  padding-top: 10px;
}
@media screen and (min-width: 768px) {
  .p-old-hermes-how .p-old-hermes-how--line dl{
    padding: 0 0 0 30px;
    width: calc(100% - 150px);
  }
}
.p-old-hermes-how .p-old-hermes-how--line dt{
  font-weight: bold;
  font-size: calc(24 * (100vw / 520));
  max-width: 85%;
  margin: 0 auto;
}
@media screen and (min-width: 520px) {
  .p-old-hermes-how .p-old-hermes-how--line dt{
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-old-hermes-how .p-old-hermes-how--line dt{
    font-size: calc(20 * (100vw / 980));
    max-width: 100%;
  }
}
@media screen and (min-width: 980px) {
  .p-old-hermes-how .p-old-hermes-how--line dt{
    font-size: 18px;
  }
}
.p-old-hermes-how .p-old-hermes-how--line dt a{
  background: linear-gradient(to bottom,  #ffffff 0%,#008510 15%,#77b455 89%,#4b9505 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  border: 2px solid #017D10;
  border-radius: 100px;
  color: #ffffff;
  display: block;
  padding: 10px 20px;
  text-align: center;
}
.p-old-hermes-how .p-old-hermes-how--line dt a:hover{
  opacity: 0.7;
}

.p-old-hermes-how .p-old-hermes-how--line dd{
  color: #ffffff;
  padding-top: 10px;
  font-size: calc(24 * (100vw / 520));
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 520px) {
  .p-old-hermes-how .p-old-hermes-how--line dd{
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-old-hermes-how .p-old-hermes-how--line dd{
    font-size: calc(20 * (100vw / 980));
    text-align: left;
  }
}
@media screen and (min-width: 980px) {
  .p-old-hermes-how .p-old-hermes-how--line dd{
    font-size: 22px;
  }
}

.p-old-hermes-how .p-old-hermes-how--line dd span.pc-show{
  display: none;
  font-size: 100%;
  padding: 0;
}
@media screen and (min-width: 768px) {
  .p-old-hermes-how .p-old-hermes-how--line dd span.pc-show{
    display: block;
  }
}
.p-old-hermes-how .p-old-hermes-how--line dd span.sp-show{
  display: block;
  font-size: 100%;
  padding: 0;
}
@media screen and (min-width: 768px) {
  .p-old-hermes-how .p-old-hermes-how--line dd span.sp-show{
    display: none;
  }
}

.p-old-hermes-how .p-old-hermes-how--line dd span{
  display: block;
  font-size: 60%;
  padding: 10px 0;
}

.p-old-hermes-item{
  background: #F7F7F7;
  padding: 50px 0;
}
.p-old-hermes-item.birkin{
  padding-bottom: 0;
}
.p-old-hermes-item.birkin .p-old-hermes-item--in{
  border-bottom: 1px solid #C8C9CA;
  padding-bottom: 50px;
}
.p-old-hermes-item .p-old-hermes-item--in{
  margin: 0 auto;
  max-width: 1000px;
  width: 90%;
  text-align: center;
}
.p-old-hermes-item h2{
  font-size: calc(24 * (100vw / 520));
  font-weight: 700;
  text-align: center;
  margin-bottom: 20px;
}
@media screen and (min-width: 520px) {
  .p-old-hermes-item h2{
    font-size: calc(20 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-old-hermes-item h2{
    font-size: calc(25 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-old-hermes-item h2{
    font-size: 25px;
  }
}
.p-old-hermes-item ul{
  display: flex;
  flex-wrap: wrap;
  margin: 0 -10px;
}
.p-old-hermes-item li{
  width: 33%;
  padding: 0 5px 20px;
}
@media screen and (min-width: 768px) {
  .p-old-hermes-item li{
    padding: 0 10px 30px;
    width: 25%;
  }
}
.p-old-hermes-item li a{
  display: block;
  color: #000000;
}
@media screen and (min-width: 520px) {
  .p-old-hermes-item li a{
    padding: 0 10px;
  }
}
.p-old-hermes-item li a:hover{
  background: #ffffff;
}
.p-old-hermes-item picture{
  display: block;
}
.p-old-hermes-item img{
  object-fit: cover;
  max-height: 80px;
  margin: auto;
  width: auto;
}
@media screen and (min-width: 520px) {
  .p-old-hermes-item img{
  }
}
@media screen and (min-width: 768px) {
  .p-old-hermes-item img{
  max-height: 150px;
  }
}
@media screen and (min-width: 980px) {
  .p-old-hermes-item img{
  }
}
.p-old-hermes-item dl{
  padding-bottom: 5px;
}
.p-old-hermes-item dt{
  font-size: calc(16 * (100vw / 520));
  font-weight: bold;
  margin:10px auto 5px;
  line-height: 1.3;
}
@media screen and (min-width: 520px) {
  .p-old-hermes-item dt{
    font-size: calc(16 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-old-hermes-item dt{
    font-size: calc(16 * (100vw / 980));
    line-height: 1.6;
  }
}
@media screen and (min-width: 980px) {
  .p-old-hermes-item dt{
    font-size: 16px;
  }
}

.p-old-hermes-item dd{
  font-size: calc(19 * (100vw / 520));
}
@media screen and (min-width: 520px) {
  .p-old-hermes-item dd{
    font-size: calc(18 * (100vw / 768));
  }
}
@media screen and (min-width: 768px) {
  .p-old-hermes-item dd{
    font-size: calc(18 * (100vw / 980));
  }
}
@media screen and (min-width: 980px) {
  .p-old-hermes-item dd{
    font-size: 18px;
  }
}
.p-old-hermes-item dd .status{
  display: block;
  font-size: 70%;
  padding-bottom: 5px;
}
.p-old-hermes-item dd .pay{
  display: block;
  font-weight: bold;
}





.p-header-float {
  background-color: #f7f7f7;
}

.c-interface {
  padding: 35px 0;
}

.c-interface_title.method {
  margin: 0 0 20px;
}

.c-interface_title.line,
.c-interface_title.line + .c-interface_btn {
  display: none;
}
