@charset "UTF-8";
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 100;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 200;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 300;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 400;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}
:root {
  --text-color-white: #ffffff;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-weight: normal;
}

ul,
ol {
  list-style-type: none;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
  display: block;
}

audio,
canvas,
progress,
video {
  display: inline-block;
}

/* Links
   ========================================================================== */
a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration: none;
  display: block; /* 必要に応じて変えてね */
}

a:active,
a:hover {
  outline-width: 0;
}

img {
  border-style: none;
  max-width: 100%;
  vertical-align: bottom;
}

code,
kbd,
pre,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Forms
   ========================================================================== */
button,
input,
select,
textarea {
  font: inherit; /* 1 */
  margin: 0; /* 2 */
}

button,
input {
  /* 1 */
  overflow: visible;
}

button,
select {
  /* 1 */
  text-transform: none;
}

button,
html [type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button; /* 2 */
}

button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

textarea {
  resize: none;
}

[type=checkbox],
[type=radio] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

[type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

[type=search]::-webkit-search-cancel-button,
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-input-placeholder {
  color: inherit;
  opacity: 0.54;
}

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* -------------------------------------------------------------- */
/*  初期値設定  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  media query  */
/* -------------------------------------------------------------- */
@media screen and (max-width: 768px) {
  html {
    font-size: 2.5641025641vw;
  }
}
@media print, screen and (min-width: 769px) {
  html {
    font-size: 0.78125vw;
  }
}
/* -------------------------------------------------------------- */
/*  font-size 相対値化  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  position 配置 相対値化  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  width and height 相対値化  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  margin and padding 相対値化  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  要素横並び  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  角丸  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  ボタン  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  配置  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  ボタンロールオーバー  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  letter-spacing 相対値化  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  line-height 相対値化  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  gap 相対値化  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  border 相対値化  */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/* レイアウト調整用 */
/* -------------------------------------------------------------- */
.small {
  font-size: 80%;
}

.fix-box::before,
.fix-box::after {
  content: " ";
  display: table;
}

.fix-box::after {
  clear: both;
}

.f-Left {
  float: left;
}

.f-Right {
  float: right;
}

.in-bl {
  display: inline-block;
}

.t-Center {
  text-align: center;
}

.t-Left {
  text-align: left;
}

.t-Right {
  text-align: right;
}

.v-Top {
  vertical-align: top;
}

.v-Bottom {
  vertical-align: bottom;
}

span.Br::before {
  content: "\a";
  white-space: pre;
}

.is-relative {
  position: relative;
}

.is-absolute {
  position: absolute;
}

.f-bold {
  font-weight: bold;
}

.f-medium {
  font-weight: 500;
}

.f-sem {
  font-weight: 600;
}

.f-black {
  font-weight: 900;
}

.color-white {
  color: #ffffff;
}

.object-fit-img img {
  object-fit: cover;
  font-family: "object-fit: cover;";
  width: 100%;
  height: 100%;
}

.omission {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.divide-x > :not(:last-child) {
  border-inline-start-width: 0px;
  border-inline-end-width: 1px;
}

.divide-y > :not(:last-child) {
  border-top-width: 0px;
  border-bottom-width: 1px;
}

.inset-0 {
  inset: 0;
}

.flex {
  display: flex;
}

.flex-col {
  flex-direction: column;
}

.flex-col-reverse {
  flex-direction: column-reverse;
}

.flex-row {
  flex-direction: row;
}

.flex-row-reverse {
  flex-direction: row-reverse;
}

.sold-out {
  pointer-events: none !important;
  user-select: none !important;
  background-color: #a5a5a5 !important;
  background: #a5a5a5 !important;
  color: #fff !important;
}

/* -------------------------------------------------------------- */
/* ロールオーバーアニメーション用 */
/* -------------------------------------------------------------- */
a,
input[type=submit] {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

a:hover,
input[type=submit]:hover {
  opacity: 0.7;
}

/* -------------------------------------------------------------- */
/* フォーム用 */
/* -------------------------------------------------------------- */
.form-control,
textarea,
.tel-form-control {
  display: block;
  padding: 0.5em 1em;
  font-size: 1rem;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

.form-control:focus,
textarea:focus,
.tel-form-control:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}

.form-control::-moz-placeholder,
textarea::-moz-placeholder,
.tel-form-control::-moz-placeholder {
  color: #999;
  opacity: 1;
}

.form-control::-ms-input-placeholder,
textarea::-ms-input-placeholder,
.tel-form-control::-ms-input-placeholder {
  color: #999;
}

.form-control::-webkit-input-placeholder,
textarea::-webkit-input-placeholder,
.tel-form-control::-webkit-input-placeholder {
  color: #999;
}

.mw_wp_form .vertical-item + .vertical-item {
  margin-top: 0 !important;
}

/* -------------------------------------------------------------- */
/* オリジナルラジオボタン・セレクトボックス */
/* -------------------------------------------------------------- */
/*　オリジナルのラジオボタンを使う場合はコメントを外す

input[type=radio], input[type=checkbox] {
	display: none;
}

.radio {
  position: relative;
  display: inline-block;
  margin: 4px 20px 4px 0;
  padding: 3px 12px 3px 42px;
  cursor: pointer;
}

.radio:hover:after{
  border-color: #ccc;
}
.radio:after {
  -webkit-transition: border-color 0.1s linear;
  transition: border-color 0.1s linear;
  position: absolute;
  top: 50%;
  left: 15px;
  display: block;
  margin-top: -10px;
  width: 16px;
  height: 16px;
  border: 2px solid #bbb;
  border-radius: 10px;
  content: '';
}

.radio:before {
  -webkit-transition: opacity 0.1s linear;
  transition: opacity 0.1s linear;
  position: absolute;
  top: 50%;
  left: 20px;
  display: block;
  margin-top: -5px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #000;
  content: '';
  opacity: 0;
}

input[type=radio]:checked + .radio:before {
  opacity: 1;
}

input[type=checkbox]:checked + .checkbox:after {
    background: #fff;
}

.order-selecter-box label::after {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 5px 0 5px;
    border-color: #000 transparent transparent transparent;
    content: "";
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -5px;
    pointer-events: none;
}

select::-ms-expand {
    display: none;
}

*/
/* -------------------------------------------------------------- */
/* 調整用 */
/* -------------------------------------------------------------- */
/* margin */
.m-Auto {
  margin: 0 auto;
}

.m-Auto-10 {
  margin: 10px auto;
}

.m-Auto-20 {
  margin: 20px auto;
}

.m-Auto-30 {
  margin: 30px auto;
}

.m-Auto-40 {
  margin: 40px auto;
}

.m-Auto-50 {
  margin: 50px auto;
}

.m-L-10 {
  margin-left: 10px;
}

.m-L-20 {
  margin-left: 20px;
}

.m-L-30 {
  margin-left: 30px;
}

.m-L-40 {
  margin-left: 40px;
}

.m-L-50 {
  margin-left: 50px;
}

.m-L-60 {
  margin-left: 60px;
}

.m-L-70 {
  margin-left: 70px;
}

.m-L-80 {
  margin-left: 80px;
}

.m-L-90 {
  margin-left: 90px;
}

.m-L-100 {
  margin-left: 100px;
}

.m-R-10 {
  margin-right: 10px;
}

.m-R-20 {
  margin-right: 20px;
}

.m-R-30 {
  margin-right: 30px;
}

.m-R-40 {
  margin-right: 40px;
}

.m-R-50 {
  margin-right: 50px;
}

.m-R-60 {
  margin-right: 60px;
}

.m-R-70 {
  margin-right: 70px;
}

.m-R-80 {
  margin-right: 80px;
}

.m-R-90 {
  margin-right: 90px;
}

.m-R-100 {
  margin-right: 100px;
}

.m-T-10 {
  margin-top: 10px;
}

.m-T-20 {
  margin-top: 20px;
}

.m-T-30 {
  margin-top: 30px;
}

.m-T-40 {
  margin-top: 40px;
}

.m-T-50 {
  margin-top: 50px;
}

.m-T-60 {
  margin-top: 60px;
}

.m-T-70 {
  margin-top: 70px;
}

.m-T-80 {
  margin-top: 80px;
}

.m-T-90 {
  margin-top: 90px;
}

.m-T-100 {
  margin-top: 100px;
}

.m-B-10 {
  margin-bottom: 10px;
}

.m-B-20 {
  margin-bottom: 20px;
}

.m-B-30 {
  margin-bottom: 30px;
}

.m-B-40 {
  margin-bottom: 40px;
}

.m-B-50 {
  margin-bottom: 50px;
}

.m-B-60 {
  margin-bottom: 60px;
}

.m-B-70 {
  margin-bottom: 70px;
}

.m-B-80 {
  margin-bottom: 80px;
}

.m-B-90 {
  margin-bottom: 90px;
}

.m-B-100 {
  margin-bottom: 100px;
}

/* padding */
.p-L-10 {
  padding-left: 10px;
}

.p-L-20 {
  padding-left: 20px;
}

.p-L-30 {
  padding-left: 30px;
}

.p-L-40 {
  padding-left: 40px;
}

.p-L-50 {
  padding-left: 50px;
}

.p-L-60 {
  padding-left: 60px;
}

.p-L-70 {
  padding-left: 70px;
}

.p-L-80 {
  padding-left: 80px;
}

.p-L-90 {
  padding-left: 90px;
}

.p-L-100 {
  padding-left: 100px;
}

.p-R-10 {
  padding-right: 10px;
}

.p-R-20 {
  padding-right: 20px;
}

.p-R-30 {
  padding-right: 30px;
}

.p-R-40 {
  padding-right: 40px;
}

.p-R-50 {
  padding-right: 50px;
}

.p-R-60 {
  padding-right: 60px;
}

.p-R-70 {
  padding-right: 70px;
}

.p-R-80 {
  padding-right: 80px;
}

.p-R-90 {
  padding-right: 90px;
}

.p-R-100 {
  padding-right: 100px;
}

.p-T-10 {
  padding-top: 10px;
}

.p-T-20 {
  padding-top: 20px;
}

.p-T-30 {
  padding-top: 30px;
}

.p-T-40 {
  padding-top: 40px;
}

.p-T-50 {
  padding-top: 50px;
}

.p-T-60 {
  padding-top: 60px;
}

.p-T-70 {
  padding-top: 70px;
}

.p-T-80 {
  padding-top: 80px;
}

.p-T-90 {
  padding-top: 90px;
}

.p-T-100 {
  padding-top: 100px;
}

.p-B-10 {
  padding-bottom: 10px;
}

.p-B-20 {
  padding-bottom: 20px;
}

.p-B-30 {
  padding-bottom: 30px;
}

.p-B-40 {
  padding-bottom: 40px;
}

.p-B-50 {
  padding-bottom: 50px;
}

.p-B-60 {
  padding-bottom: 60px;
}

.p-B-70 {
  padding-bottom: 70px;
}

.p-B-80 {
  padding-bottom: 80px;
}

.p-B-90 {
  padding-bottom: 90px;
}

.p-B-100 {
  padding-bottom: 100px;
}

/* -------------------------------------------------------------- */
/* 20181221追記  */
/* -------------------------------------------------------------- */
/* margin */
.m-Auto-lr {
  margin-left: auto;
  margin-right: auto;
}

/* background */
.bg-white {
  background-color: #fff !important;
}

.bg-black {
  background-color: #000 !important;
}

/* color */
.color-white {
  color: #fff !important;
}

.color-black {
  color: #000 !important;
}

/* font-weight */
.fo-we-normal {
  font-weight: normal !important;
}

.fo-we-bold {
  font-weight: bold !important;
}

/* letter-spacing XDの値 */
.le-sp-50 {
  letter-spacing: 0.05em;
}

.le-sp-100 {
  letter-spacing: 0.1em;
}

.le-sp-150 {
  letter-spacing: 0.15em;
}

.le-sp-200 {
  letter-spacing: 0.2em;
}

/* -------------------------------------------------------------- */
/*  smp  */
/* -------------------------------------------------------------- */
@media only screen and (max-width: 768px) {
  .smp-f-left {
    float: left;
  }
  .smp-f-right {
    float: right;
  }
  .width-100 {
    width: 100%;
  }
  .width-49 {
    width: 49%;
  }
  .width-50 {
    width: 50%;
  }
  .width-33 {
    width: 33%;
  }
  span.smp-br::before {
    content: "\a";
    white-space: pre;
  }
  /* -------------------------------------------------------------- */
  /*  20181221追記  */
  /* -------------------------------------------------------------- */
  /* display: none; */
  .smp-d-none {
    display: none;
  }
  /* margin */
  .smp-m-Auto {
    margin: 0 auto;
  }
  .smp-m-Auto-lr {
    margin-right: auto;
    margin-left: auto;
  }
  .smp-m-Auto-10 {
    margin: 10px auto;
  }
  .smp-m-Auto-20 {
    margin: 20px auto;
  }
  .smp-m-Auto-30 {
    margin: 30px auto;
  }
  .smp-m-Auto-40 {
    margin: 40px auto;
  }
  .smp-m-Auto-50 {
    margin: 50px auto;
  }
  .smp-m-Auto-0-10 {
    margin: 0 auto 10px;
  }
  .smp-m-Auto-0-20 {
    margin: 0 auto 20px;
  }
  .smp-m-Auto-0-30 {
    margin: 0 auto 30px;
  }
  .smp-m-Auto-0-40 {
    margin: 0 auto 40px;
  }
  .smp-m-Auto-0-50 {
    margin: 0 auto 50px;
  }
  .smp-m-L-10 {
    margin-left: 10px;
  }
  .smp-m-L-20 {
    margin-left: 20px;
  }
  .smp-m-L-30 {
    margin-left: 30px;
  }
  .smp-m-L-40 {
    margin-left: 40px;
  }
  .smp-m-L-50 {
    margin-left: 50px;
  }
  .smp-m-R-10 {
    margin-right: 10px;
  }
  .smp-m-R-20 {
    margin-right: 20px;
  }
  .smp-m-R-30 {
    margin-right: 30px;
  }
  .smp-m-R-40 {
    margin-right: 40px;
  }
  .smp-m-R-50 {
    margin-right: 50px;
  }
  .smp-m-T-10 {
    margin-top: 10px;
  }
  .smp-m-T-20 {
    margin-top: 20px;
  }
  .smp-m-T-30 {
    margin-top: 30px;
  }
  .smp-m-T-40 {
    margin-top: 40px;
  }
  .smp-m-T-50 {
    margin-top: 50px;
  }
  .smp-m-B-10 {
    margin-bottom: 10px;
  }
  .smp-m-B-20 {
    margin-bottom: 20px;
  }
  .smp-m-B-30 {
    margin-bottom: 30px;
  }
  .smp-m-B-40 {
    margin-bottom: 40px;
  }
  .smp-m-B-50 {
    margin-bottom: 50px;
  }
  /* padding */
  .smp-p-10 {
    padding: 10px;
  }
  .smp-p-20-10 {
    padding: 20px 10px;
  }
  .smp-p-L-10 {
    padding-left: 10px;
  }
  .smp-p-L-20 {
    padding-left: 20px;
  }
  .smp-p-L-30 {
    padding-left: 30px;
  }
  .smp-p-L-40 {
    padding-left: 40px;
  }
  .smp-p-L-50 {
    padding-left: 50px;
  }
  .smp-p-R-10 {
    padding-right: 10px;
  }
  .smp-p-R-20 {
    padding-right: 20px;
  }
  .smp-p-R-30 {
    padding-right: 30px;
  }
  .smp-p-R-40 {
    padding-right: 40px;
  }
  .smp-p-R-50 {
    padding-right: 50px;
  }
  .smp-p-T-10 {
    padding-top: 10px;
  }
  .smp-p-T-20 {
    padding-top: 20px;
  }
  .smp-p-T-30 {
    padding-top: 30px;
  }
  .smp-p-T-40 {
    padding-top: 40px;
  }
  .smp-p-T-50 {
    padding-top: 50px;
  }
  .smp-p-B-10 {
    padding-bottom: 10px;
  }
  .smp-p-B-20 {
    padding-bottom: 20px;
  }
  .smp-p-B-30 {
    padding-bottom: 30px;
  }
  .smp-p-B-40 {
    padding-bottom: 40px;
  }
  .smp-p-B-50 {
    padding-bottom: 50px;
  }
}
/* -------------------------------------------------------------- */
/* PC */
/* -------------------------------------------------------------- */
@media print, screen and (min-width: 769px) {
  .pc-f-left {
    float: left;
  }
  .pc-f-right {
    float: right;
  }
  span.pc-br::before {
    content: "\a";
    white-space: pre;
  }
  /* -------------------------------------------------------------- */
  /* 20181221追記 */
  /* -------------------------------------------------------------- */
  /* display: none; */
  .pc-d-none {
    display: none;
  }
  /* margin */
  .pc-m-Auto {
    margin: 0 auto;
  }
  .pc-m-Auto-lr {
    margin-right: auto;
    margin-left: auto;
  }
  .pc-m-Auto-10 {
    margin: 10px auto;
  }
  .pc-m-Auto-20 {
    margin: 20px auto;
  }
  .pc-m-Auto-30 {
    margin: 30px auto;
  }
  .pc-m-Auto-40 {
    margin: 40px auto;
  }
  .pc-m-Auto-50 {
    margin: 50px auto;
  }
  .pc-m-Auto-0-10 {
    margin: 0 auto 10px;
  }
  .pc-m-Auto-0-20 {
    margin: 0 auto 20px;
  }
  .pc-m-Auto-0-30 {
    margin: 0 auto 30px;
  }
  .pc-m-Auto-0-40 {
    margin: 0 auto 40px;
  }
  .pc-m-Auto-0-50 {
    margin: 0 auto 50px;
  }
  .pc-m-L-10 {
    margin-left: 10px;
  }
  .pc-m-L-20 {
    margin-left: 20px;
  }
  .pc-m-L-30 {
    margin-left: 30px;
  }
  .pc-m-L-40 {
    margin-left: 40px;
  }
  .pc-m-L-50 {
    margin-left: 50px;
  }
  .pc-m-R-10 {
    margin-right: 10px;
  }
  .pc-m-R-20 {
    margin-right: 20px;
  }
  .pc-m-R-30 {
    margin-right: 30px;
  }
  .pc-m-R-40 {
    margin-right: 40px;
  }
  .pc-m-R-50 {
    margin-right: 50px;
  }
  .pc-m-T-10 {
    margin-top: 10px;
  }
  .pc-m-T-20 {
    margin-top: 20px;
  }
  .pc-m-T-30 {
    margin-top: 30px;
  }
  .pc-m-T-40 {
    margin-top: 40px;
  }
  .pc-m-T-50 {
    margin-top: 50px;
  }
  .pc-m-B-10 {
    margin-bottom: 10px;
  }
  .pc-m-B-20 {
    margin-bottom: 20px;
  }
  .pc-m-B-30 {
    margin-bottom: 30px;
  }
  .pc-m-B-40 {
    margin-bottom: 40px;
  }
  .pc-m-B-50 {
    margin-bottom: 50px;
  }
  /* padding */
  .pc-p-10 {
    padding: 10px;
  }
  .pc-p-20 {
    padding: 20px;
  }
  .pc-p-30 {
    padding: 30px;
  }
  .pc-p-L-10 {
    padding-left: 10px;
  }
  .pc-p-L-20 {
    padding-left: 20px;
  }
  .pc-p-L-30 {
    padding-left: 30px;
  }
  .pc-p-L-40 {
    padding-left: 40px;
  }
  .pc-p-L-50 {
    padding-left: 50px;
  }
  .pc-p-R-10 {
    padding-right: 10px;
  }
  .pc-p-R-20 {
    padding-right: 20px;
  }
  .pc-p-R-30 {
    padding-right: 30px;
  }
  .pc-p-R-40 {
    padding-right: 40px;
  }
  .pc-p-R-50 {
    padding-right: 50px;
  }
  .pc-p-T-10 {
    padding-top: 10px;
  }
  .pc-p-T-20 {
    padding-top: 20px;
  }
  .pc-p-T-30 {
    padding-top: 30px;
  }
  .pc-p-T-40 {
    padding-top: 40px;
  }
  .pc-p-T-50 {
    padding-top: 50px;
  }
  .pc-p-B-10 {
    padding-bottom: 10px;
  }
  .pc-p-B-20 {
    padding-bottom: 20px;
  }
  .pc-p-B-30 {
    padding-bottom: 30px;
  }
  .pc-p-B-40 {
    padding-bottom: 40px;
  }
  .pc-p-B-50 {
    padding-bottom: 50px;
  }
}
/* -------------------------------------------------------------- */
/*  共通  */
/* -------------------------------------------------------------- */
html {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: normal;
  color: #191818;
}

@font-face {
  font-family: "Futura PT";
  src: url("../fonts/Futura.ttc") format("truetype");
}
.pm {
  font-family: "Permanent Marker", cursive;
}

.sj {
  font-family: "Noto Serif JP", serif;
}

.lg {
  font-family: "Luckiest Guy", cursive;
}

.futuri {
  font-family: futura-pt, sans-serif;
  font-style: normal;
  font-weight: bold;
}

.mb31 {
  font-family: a-otf-midashi-go-mb31-pr6n, sans-serif;
  font-style: normal;
  font-weight: 600;
}

.b101 {
  font-family: "Futo Go B101", a-otf-gothic-bbb-pr6n, "Noto Sans JP", sans-serif;
  font-style: normal;
}

.mb31 {
  font-family: a-otf-midashi-go-mb31-pr6n, "Midashi Go MB31", sans-serif;
  font-style: normal;
}

.mincho {
  font-family: "A1明朝", sans-serif;
  font-style: normal;
}

.bbb {
  font-family: a-otf-gothic-bbb-pr6n, sans-serif;
  font-style: normal;
  font-weight: 400;
}

.jost {
  font-family: "Jost", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.futura {
  font-family: "Futura PT", sans-serif;
}

.zen-maru {
  font-family: "Zen Maru Gothic", sans-serif;
  font-style: normal;
}

.Footer {
  background-color: #ffffff;
}

.color_text {
  color: #bda255;
}

:root {
  --body-color: #191818;
  --green-color: #05A83D;
  --orange-color: #FF8E48;
  --yellow-color: #F3C60A;
  --pink-color: #F03692;
  --white-color: #FFFFFF;
  --cream-color: #FFFED8;
  --light-pink-color: #E34A94;
  --light-green-color: #B4D015;
  --light-orange-color: #FABA1E;
  --purple-color: #C973BF;
}

.text-green {
  color: var(--green-color);
}

.text-white {
  color: var(--white-color);
}

.text-orange {
  color: var(--orange-color);
}

.bg-light-pink {
  background-color: var(--light-pink-color);
}

.bg-green {
  background-color: var(--green-color);
}

.bg-light-green {
  background-color: var(--light-green-color);
}

.bg-light-orange {
  background-color: var(--light-orange-color);
}

.bg-orange {
  background-color: var(--orange-color);
}

/* -------------------------------------------------------------- */
/*  追随モーダル */
/* -------------------------------------------------------------- */
.fix-modal {
  z-index: 11;
  position: fixed;
  background-color: rgba(255, 255, 255, 0.7019607843);
}
.fix-modal p {
  color: #050c3e;
}
.fix-modal .fix-inlin .left-fix-inline {
  text-align: right;
  display: inline-block;
  vertical-align: middle;
}
.fix-modal .fix-inlin .left-fix-inline p {
  color: #050c3e;
  font-weight: 900;
}
.fix-modal .fix-modal-open {
  position: relative;
  display: inline-block !important;
  vertical-align: middle;
  color: #000000;
  background-color: #fff100;
  text-decoration: none;
  text-align: center;
}
.fix-modal .fix-modal-open::before {
  position: absolute;
  content: "";
  background-position: top left;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.fix-modal .modal {
  display: none;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
}
.fix-modal .modal-border {
  width: 100%;
  border-bottom: 1px solid #c9c9c9;
}
.fix-modal .modal__content a {
  padding: 0;
  position: relative;
  top: -5vw;
  right: -15vw;
  background-color: transparent;
  color: #ffffff;
}
.fix-modal .modal__content a::after {
  display: none;
}

.box-modal {
  margin: 0 auto;
}
.box-modal .modal {
  display: none;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
}
.box-modal .modal__bg {
  background: rgba(0, 0, 0, 0.8);
  position: absolute;
  width: 100%;
}
.box-modal .modal__content {
  background: #fff;
  left: 50%;
  padding: 40px;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 60%;
}

.select-modaal-item .modal-sale {
  border: 3px solid #000000;
}
.select-modaal-item .modal-sale p {
  color: #000000;
  margin-bottom: 0;
}
.select-modaal-item h2 {
  text-align: left;
}
.select-modaal-item .select-modal-img {
  display: inline-block;
  vertical-align: middle;
  border: 1px solid #d5d5d5;
}
.select-modaal-item .select-modal-img img {
  width: 100%;
}
.select-modaal-item .s-item-name {
  display: inline-block;
  vertical-align: bottom;
}
.select-modaal-item .form-item form dl {
  font-size: 0;
}
.select-modaal-item .form-item form dl dt {
  display: inline-block;
  font-size: 1vw;
  vertical-align: middle;
  color: #000000;
}
.select-modaal-item .form-item form dl dt p {
  font-size: 1rem;
  font-weight: bold;
  color: #000000;
}
.select-modaal-item .form-item form dl dd {
  display: inline-block;
  font-size: 1vw;
  vertical-align: middle;
  position: relative;
  color: #000000;
}
.select-modaal-item .form-item form dl dd input {
  border: none;
  font-weight: bold;
  background-color: #f5dd4f;
  color: #000000;
  font-family: a-otf-midashi-go-mb31-pr6n, sans-serif;
  font-style: normal;
  font-weight: 600;
}
.select-modaal-item .form-item form dl {
  font-size: 0;
}
.select-modaal-item .form-item form dl dt {
  font-size: 1vw;
  color: #000000;
}
.select-modaal-item .form-item form dl dt span {
  color: #000000;
}
.select-modaal-item .form-item form dl dd {
  font-size: 1vw;
  position: relative;
}
.select-modaal-item .form-item form dl dd input {
  border: none;
}

/* -------------------------------------------------------------- */
/*   */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/*  smp  */
/* -------------------------------------------------------------- */
@media screen and (max-width: 768px) {
  a {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
  /* -------------------------------------------------------------- */
  /* 追随モーダルボタン */
  /* -------------------------------------------------------------- */
  .modaal-close {
    top: 32vw !important;
  }
  .modal-border {
    margin: 4vw 0;
  }
  .modal__bg .js-point {
    background-color: transparent;
    font-size: 8vw !important;
    color: #ffffff;
    text-decoration: none;
    padding: 0;
  }
  .modal__bg .js-point::after {
    display: none;
    background-color: transparent;
  }
  .modal__bg .js-modal-close {
    position: relative;
    z-index: 1000;
    color: #ffffff;
    text-decoration: none;
    width: fit-content;
    margin-left: auto;
  }
  .fix-modal {
    bottom: 0vw;
    width: 100%;
    padding: 0 0 3.2vw;
  }
  .fix-modal .fix-modal-open {
    display: inline-block;
    vertical-align: middle;
    padding: 2.6vw 0 2.6vw 0vw;
    font-size: 0.93rem;
    border-radius: 3px;
    width: 100%;
    margin: 0 auto;
  }
  .fix-modal .fix-modal-open::before {
    width: 4vw;
    height: 4vw;
    left: 4vw;
    top: 3.5vw;
  }
  .fix-modal .fix-inlin {
    width: 64.26vw;
    margin: 0 auto;
    text-align: center;
  }
  .fix-modal .fix-inlin .left-fix-inline {
    margin-top: 1.5vw;
    margin-right: 1vw;
  }
  .fix-modal .fix-inlin .left-fix-inline p {
    font-size: 1.6rem;
  }
  .fix-modal .modal-content-all {
    height: 100%;
    width: 90%;
    margin: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: -2.5641025641vw;
  }
  .fix-modal .modal__content {
    background: #fff;
    padding: 10vw 5.3vw;
    overflow: hidden;
    overflow-y: scroll;
    height: 75%;
  }
  .fix-modal .modal__content a {
    padding: 0;
    top: -50vw;
    right: -15vw;
  }
  .fix-modal .modal__content h2 {
    margin: 3vw 0 !important;
  }
  .select-modaal-item {
    margin-top: 1.851vw;
  }
  .select-modaal-item .modal-mutta {
    margin-bottom: 20vw;
  }
  .select-modaal-item .modal-mutta:last-child {
    margin-bottom: 0;
  }
  .select-modaal-item .modal-sale {
    padding: 4vw 2vw;
  }
  .select-modaal-item .modal-sale p {
    text-align: center;
    font-size: 4.222vw;
  }
  .select-modaal-item h2 {
    font-size: 4.5vw;
  }
  .select-modaal-item .select-modal-img {
    width: 76.866667vw;
  }
  .select-modaal-item .select-modal-img img {
    width: 100%;
  }
  .select-modaal-item .select-modal-img-l {
    margin-right: 0;
    margin-left: 0;
  }
  .select-modaal-item .s-item-name {
    width: 43vw;
    margin-left: 1vw;
  }
  .select-modaal-item .s-item-name p {
    font-size: 7.2vw !important;
    margin-bottom: 0;
  }
  .select-modaal-item .s-item-name p span {
    font-size: 3vw;
  }
  .select-modaal-item .form-item {
    margin: 8vw auto 0;
  }
  .select-modaal-item .form-item form {
    margin-bottom: 1.4vw;
  }
  .select-modaal-item .form-item form dl dt {
    font-size: 2.1875rem;
    width: 79vw !important;
  }
  .select-modaal-item .form-item form dl dt p {
    font-size: 1rem;
    font-weight: bold;
  }
  .select-modaal-item .form-item form dl dt span {
    font-size: 0.675rem;
  }
  .select-modaal-item .form-item form dl dd .sold-out {
    top: -6vw;
    left: 6vw;
    width: 65vw;
  }
  .select-modaal-item .form-item form dl dd .bg-btn {
    margin-top: 2.537037vw;
    cursor: pointer;
    width: 76.866667vw;
    padding: 2.5641025641vw 0vw 2.5641025641vw 0vw;
    font-size: 1.8rem;
  }
  .select-modaal-item .form-item form dl .set_link_orange,
  .select-modaal-item .form-item form dl .set_link_gray {
    margin-top: 15.3846153846vw;
  }
  .select-modaal-item .form-item form dl .set_link_orange::before,
  .select-modaal-item .form-item form dl .set_link_gray::before {
    width: 76.866667vw !important;
    top: -10vw;
  }
  /* -------------------------------------------------------------- */
  /* 追随モーダル 終わり */
  /* -------------------------------------------------------------- */
  /* -------------------------------------------------------------- */
  /* SMPフッター */
  /* -------------------------------------------------------------- */
  blockquote {
    margin: 0 !important;
  }
  .Footer {
    margin-bottom: 0 !important;
    padding-bottom: 5vw !important;
    padding-top: 3vw !important;
  }
  .sqs-block-content p {
    margin-top: 3vw;
  }
  koyamachuya-page-footer {
    padding-bottom: 15vw !important;
  }
}
/* -------------------------------------------------------------- */
/* タブレット補正 */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/* PC */
/* -------------------------------------------------------------- */
@media screen and (min-width: 769px) {
  /* -------------------------------------------------------------- */
  /* 追随モーダルボタン */
  /* -------------------------------------------------------------- */
  .fix-modal {
    bottom: 0vw;
    width: 100%;
    z-index: 10;
  }
  .fix-modal .modal-border {
    margin-top: 1.5vw;
    margin-bottom: 1.5vw;
  }
  .fix-modal .modal__bg .js-point {
    background-color: transparent;
    font-size: 2vw !important;
    color: #ffffff;
    text-decoration: none;
  }
  .fix-modal .modal__bg .js-point::after {
    display: none;
    background-color: transparent;
  }
  .fix-modal .modal__bg .js-modal-close {
    position: relative;
    z-index: 1000;
    color: #ffffff;
    text-decoration: none;
    width: fit-content;
    margin-left: auto;
  }
  .fix-modal .fix-modal-open {
    padding: 0.7vw 0 0.7vw 0vw;
    font-size: 0.93rem;
    border-radius: 6px;
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.5);
    cursor: pointer;
    width: 100%;
    margin: 0 auto;
    display: block;
    transiion: all 0.3s ease;
  }
  .fix-modal .fix-modal-open::before {
    height: 1.59vw;
    width: 1.59vw;
    left: 3vw;
    top: 0.9vw;
  }
  .fix-modal .fix-modal-open:hover {
    opacity: 0.8;
  }
  .fix-modal .fix-inlin {
    width: 43.75vw;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 auto;
    padding: 1vw 0;
  }
  .fix-modal .fix-inlin .left-fix-inline {
    width: 24.21875vw;
  }
  .fix-modal .fix-inlin .left-fix-inline p {
    font-size: 2.3rem;
  }
  .fix-modal .fix-inlin .left-fix-inline p span {
    font-size: 1.125rem;
  }
  .fix-modal .fix-inlin a {
    width: 17.96875vw;
    padding: 0.9375vw 0vw 0.9375vw 0vw;
  }
  .fix-modal .modal-content-all {
    height: 100%;
    width: 40%;
    margin: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .fix-modal .modal__content {
    background: #fff;
    padding: 1.5vw;
    overflow: hidden;
    overflow-y: scroll;
    height: 75%;
  }
  .fix-modal .modal__content a {
    padding: 0;
    top: -50vw;
    right: -15vw;
  }
  .fix-modal .modal__content h2 {
    margin: 1vw 0 !important;
  }
  .select-modaal-item {
    margin-top: 1.851vw;
  }
  .select-modaal-item .modal-sale {
    padding: 1vw 2vw;
  }
  .select-modaal-item .modal-sale p {
    text-align: center;
    font-size: 1.275vw;
  }
  .select-modaal-item .modal-mutta {
    margin-bottom: 10vw;
    margin-left: 1vw;
  }
  .select-modaal-item .modal-mutta:last-child {
    margin-bottom: 0vw;
  }
  .select-modaal-item h2 {
    font-size: 2vw;
  }
  .select-modaal-item .select-modal-img {
    width: 21.875vw;
    margin-left: 1.5vw;
  }
  .select-modaal-item .select-modal-img img {
    width: 100%;
  }
  .select-modaal-item .select-modal-img-l {
    margin-right: 0;
    margin-left: 0;
  }
  .select-modaal-item .s-item-name {
    width: 13.5vw;
  }
  .select-modaal-item .s-item-name .txt-price {
    font-size: 1.8rem;
    margin-bottom: 0;
  }
  .select-modaal-item .s-item-name .txt-price span {
    font-size: 1vw;
  }
  .select-modaal-item .form-item {
    width: 100%;
  }
  .select-modaal-item .form-item form {
    margin-bottom: 1.4vw;
  }
  .select-modaal-item .form-item form dl dt {
    font-size: 2.1875rem;
    margin-top: 1vw;
  }
  .select-modaal-item .form-item form dl dt p {
    font-size: 1rem;
    font-weight: bold;
  }
  .select-modaal-item .form-item form dl dt span {
    font-size: 0.875rem;
  }
  .select-modaal-item .form-item form dl dd .sold-out {
    width: 24.62963vw;
    top: -2vw;
    left: 2vw;
  }
  .select-modaal-item .form-item form dl dd .bg-btn {
    margin-top: 1vw;
    cursor: pointer;
    width: 23.984375vw;
    transiion: all 0.3s ease;
    padding: 0.78125vw 0vw 0.78125vw 0vw;
    font-size: 1.8rem;
    border-radius: 0.5vw;
  }
  .select-modaal-item .form-item form dl dd .bg-btn:hover {
    opacity: 0.7;
    transiion: all 0.3s ease;
  }
  .select-modaal-item .form-item form dl .set_link_orange,
  .select-modaal-item .form-item form dl .set_link_gray {
    margin-top: 4.6875vw;
  }
  .select-modaal-item .form-item form dl .set_link_orange::before,
  .select-modaal-item .form-item form dl .set_link_gray::before {
    width: 23.984375vw  !important;
    top: -3.5vw;
  }
  /* -------------------------------------------------------------- */
  /* 追随モーダルボタン　終わり */
  /* -------------------------------------------------------------- */
  /* -------------------------------------------------------------- */
  /* 商品モーダル */
  /* -------------------------------------------------------------- */
  .modaal-gallery-item-wrap img {
    width: 100%;
  }
  .gallery_active_item img {
    width: 100%;
  }
  /* -------------------------------------------------------------- */
  /* 商品モーダル 終わり*/
  /* -------------------------------------------------------------- */
  /* -------------------------------------------------------------- */
  /* PC Header */
  /* -------------------------------------------------------------- */
  .Footer {
    padding-bottom: 7vw !important;
    margin-bottom: 0 !important;
    padding-top: 3vw !important;
  }
  .animation-loaded {
    max-width: 1180px !important;
  }
  #yui_3_17_2_1_1599483526069_172 {
    margin-top: 0 !important;
  }
  #yui_3_17_2_1_1599483526069_176 {
    max-width: 820px !important;
  }
  koyamachuya-page-footer {
    padding-bottom: 6vw !important;
  }
}
/*　IEのみ　*/
#progress-bar {
  position: fixed;
  top: 0;
  left: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--color-primary, #2a4a35), var(--color-accent, #c4a35a));
  z-index: 9999;
  width: 0%;
  transition: width 0.1s linear;
}

#cur {
  position: fixed;
  width: 6px;
  height: 6px;
  background: var(--color-primary, #2a4a35);
  border-radius: 50%;
  pointer-events: none;
  z-index: 10000;
  transform-origin: center;
  transition: transform 0.15s ease;
  display: none;
}

#cur-r {
  position: fixed;
  width: 30px;
  height: 30px;
  border: 1.5px solid rgba(26, 48, 40, 0.2);
  border-radius: 50%;
  pointer-events: none;
  z-index: 9999;
  transform-origin: center;
  transition: transform 0.3s ease, border-color 0.3s ease;
  display: none;
}

@media (max-width: 768px) {
  #cur,
  #cur-r {
    display: none !important;
  }
}
.rv {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

.rv.in {
  opacity: 1;
  transform: none;
}

.rv.d1 {
  transition-delay: 0.15s;
}

.rv.d2 {
  transition-delay: 0.3s;
}

.rv.d3 {
  transition-delay: 0.45s;
}

.rv.d4 {
  transition-delay: 0.6s;
}

.scroll-line {
  width: 1px;
  height: 3rem;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.5), transparent);
  animation: scrollLine 2s ease-in-out infinite;
}

@keyframes float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-12px);
  }
}
@keyframes scrollLine {
  0% {
    transform: scaleY(0);
    transform-origin: top;
  }
  50% {
    transform: scaleY(1);
    transform-origin: top;
  }
  51% {
    transform-origin: bottom;
  }
  100% {
    transform: scaleY(0);
    transform-origin: bottom;
  }
}
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.loading.is-fadeout {
  opacity: 0;
  pointer-events: none;
}

.loading-frame {
  max-width: 100%;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow-x: hidden;
  position: relative;
}

.loading-frame img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Fade in all container when open page */
.top {
  opacity: 0;
  animation: fadeIn 1.2s ease-out forwards;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.bg-top-title {
  transform-origin: center;
  animation: shakeTitle 1.2s ease-in-out 0.2s 1 both;
}

@keyframes shakeTitle {
  0% {
    transform: rotate(0deg);
  }
  25% {
    transform: rotate(-2deg);
  }
  50% {
    transform: rotate(2deg);
  }
  75% {
    transform: rotate(-1deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
.js-wiggle {
  --wiggle-angle: 4deg;
  --wiggle-move: 3px;
  --wiggle-duration: 2.4s;
  --wiggle-delay: 0s;
  animation: wiggle var(--wiggle-duration) ease-in-out infinite;
  animation-delay: var(--wiggle-delay);
  transform-origin: center bottom;
}

@keyframes wiggle {
  0%, 100% {
    transform: rotate(0deg) translateY(0);
  }
  25% {
    transform: rotate(calc(var(--wiggle-angle) * -1)) translateY(calc(var(--wiggle-move) * -1));
  }
  50% {
    transform: rotate(0deg) translateY(0);
  }
  75% {
    transform: rotate(var(--wiggle-angle)) translateY(calc(var(--wiggle-move) * -1));
  }
}
.js-fade-up {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.9s ease-out, transform 0.9s ease-out;
}

.js-fade-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.js-fade-up[data-delay="1"] {
  transition-delay: 0.15s;
}

.js-fade-up[data-delay="2"] {
  transition-delay: 0.3s;
}

.js-fade-up[data-delay="3"] {
  transition-delay: 0.45s;
}

.js-fade-up[data-delay="4"] {
  transition-delay: 0.6s;
}

.js-scroll-fade {
  opacity: 0;
  transition: opacity 0.6s ease-out;
}
.js-scroll-fade.is-active {
  opacity: 1 !important;
}

.phone-inner {
  position: relative;
}

.phone-right {
  position: relative;
}

.phone-center {
  position: relative;
  z-index: 2;
  display: block;
}

.anima-left,
.anima-right {
  position: absolute;
  z-index: 1;
  pointer-events: none;
  max-width: none;
  opacity: 0;
  transition: transform 0.7s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.5s ease-out;
}

.anima-left {
  transform: translateX(150px);
}

.anima-right {
  transform: translateX(-150px);
}

.phone-right.is-active .anima-left,
.phone-right.is-active .anima-right {
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
}

.phone-right:not(.is-active) .anima-left,
.phone-right:not(.is-active) .anima-right {
  transition: transform 0.5s ease-in, opacity 0.4s ease-in;
}

#top-intro .top .bg-top {
  z-index: 1;
}
#top-intro .intro {
  background-image: url("../img/bg-intro_pc.webp");
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  z-index: 2;
}
#top-intro .intro .social {
  display: flex;
  justify-content: center;
  align-items: center;
}
#top-intro .intro .social a {
  display: block;
  transition: all 0.3s ease;
  cursor: pointer;
}
#top-intro .intro .social a:hover {
  opacity: 0.8;
}
#top-intro .intro .social a .toothclip {
  border-radius: 5rem;
  white-space: nowrap;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
}
#top-intro .intro .content {
  margin-left: auto;
  margin-right: auto;
}
#top-intro .intro .content .fruit-01 img,
#top-intro .intro .content .fruit-02 img,
#top-intro .intro .content .fruit-03 img,
#top-intro .intro .content .fruit-04 img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
#top-intro .intro .content .dummy-title {
  display: flex;
  margin-left: auto;
  margin-right: auto;
}
#top-intro .intro .content .dummy {
  height: auto;
}
#top-intro .intro .content .search-info-pc {
  display: flex;
}
#top-intro .intro .content .search-info-pc .search {
  cursor: pointer;
  transition: opacity 0.3s ease;
}
@media print, screen and (min-width: 769px) {
  #top-intro .intro .content .search-info-pc .search {
    border-radius: 1.5625vw;
  }
}
@media screen and (max-width: 768px) {
  #top-intro .intro .content .search-info-pc .search {
    border-radius: 5.1282051282vw;
  }
}
#top-intro .intro .content .search-info-pc .search:hover {
  opacity: 0.7;
}
#top-intro .intro .content .search-info-pc .search .search-img {
  top: 50%;
  transform: translateY(-50%);
}
#top-intro .intro .content .search-info-pc .search-01 {
  border: 0.3rem solid var(--green-color);
  color: var(--green-color);
}
#top-intro .intro .content .search-info-pc .search-02 {
  border: 0.3rem solid var(--orange-color);
  color: var(--orange-color);
}
#top-intro .intro .content .search-info-pc .search-03 {
  border: 0.3rem solid var(--yellow-color);
  color: var(--yellow-color);
}
#top-intro .intro .content .search-info-pc .search-04 {
  border: 0.3rem solid var(--pink-color);
  color: var(--pink-color);
}
#top-intro .intro .content .search-info-sp .search {
  cursor: pointer;
  transition: opacity 0.3s ease;
}
@media print, screen and (min-width: 769px) {
  #top-intro .intro .content .search-info-sp .search {
    border-radius: 1.5625vw;
  }
}
@media screen and (max-width: 768px) {
  #top-intro .intro .content .search-info-sp .search {
    border-radius: 5.1282051282vw;
  }
}
#top-intro .intro .content .search-info-sp .search:hover {
  opacity: 0.7;
}
#top-intro .intro .content .search-info-sp .search .search-img {
  top: 50%;
  transform: translateY(-50%);
}
#top-intro .intro .content .search-info-sp .search-01 {
  border: 0.2rem solid var(--green-color);
  color: var(--green-color);
}
#top-intro .intro .content .search-info-sp .search-02 {
  border: 0.2rem solid var(--orange-color);
  color: var(--orange-color);
}
#top-intro .intro .content .search-info-sp .search-03 {
  border: 0.2rem solid var(--yellow-color);
  color: var(--yellow-color);
}
#top-intro .intro .content .search-info-sp .search-04 {
  border: 0.2rem solid var(--pink-color);
  color: var(--pink-color);
}
#top-intro .intro .content .search-info-sp .search-info-01,
#top-intro .intro .content .search-info-sp .search-info-02 {
  display: flex;
  justify-content: center;
}

.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 998;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
}
.modal-overlay.is-active {
  opacity: 1;
  visibility: visible;
}

.modal-info {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.95);
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.modal-info.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, -50%) scale(1);
}
.modal-info .info {
  display: none;
  background-color: var(--white-color);
}
@media print, screen and (min-width: 769px) {
  .modal-info .info {
    border-radius: 2.34375vw;
  }
}
@media screen and (max-width: 768px) {
  .modal-info .info {
    border-radius: 7.6923076923vw;
  }
}
.modal-info .info.is-active {
  display: flex;
  position: relative;
}

body.modal-open {
  overflow: hidden;
}

.navigation {
  display: flex;
  justify-content: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.navigation .btn-prev,
.navigation .btn-next {
  cursor: pointer;
  transition: transform 0.2s ease;
}
.navigation .btn-prev:hover,
.navigation .btn-next:hover {
  transform: scale(1.1);
}

.btn-close {
  cursor: pointer;
  border: none;
  display: flex;
  align-items: center;
  transition: all 0.3s ease;
  color: var(--white-color);
}
@media print, screen and (min-width: 769px) {
  .btn-close {
    border-radius: 1.875vw;
  }
}
@media screen and (max-width: 768px) {
  .btn-close {
    border-radius: 6.1538461538vw;
  }
}
.btn-close:hover {
  opacity: 0.8;
}

#test {
  background: transparent linear-gradient(180deg, #ffba00 0%, #ffb5cf 100%) 0% 0% no-repeat padding-box;
  width: 100%;
  height: auto;
  z-index: 2;
  overflow-x: clip;
}
#test .test-sep {
  z-index: -1;
}
#test .exam .container {
  background-color: var(--white-color);
  margin-left: auto;
  margin-right: auto;
}
@media print, screen and (min-width: 769px) {
  #test .exam .container {
    border-radius: 2.34375vw;
  }
}
@media screen and (max-width: 768px) {
  #test .exam .container {
    border-radius: 7.6923076923vw;
  }
}
#test .exam .container .test-title {
  left: 50%;
  transform: translateX(-50%);
}
#test .exam .container .test-deco-06,
#test .exam .container .test-deco-07,
#test .exam .container .test-deco-08,
#test .exam .container .test-deco-09 {
  z-index: -1;
}
#test .exam .container .test-deco-04 {
  z-index: 2;
}
#test .exam .container #form-kagome {
  margin-left: auto;
  margin-right: auto;
}
@media print, screen and (min-width: 769px) {
  #test .exam .container #form-kagome .check {
    border-radius: 0.78125vw;
  }
}
@media screen and (max-width: 768px) {
  #test .exam .container #form-kagome .check {
    border-radius: 2.5641025641vw;
  }
}
#test .exam .container #form-kagome .check:last-child {
  margin-bottom: 0vw;
}
#test .exam .container #form-kagome .check-inner {
  display: flex;
  position: relative;
}
#test .exam .container #form-kagome .check-inner .check-head,
#test .exam .container #form-kagome .check-inner .check-item {
  display: flex;
  align-items: center;
}
#test .exam .container #form-kagome .check-inner .check-head label,
#test .exam .container #form-kagome .check-inner .check-item label {
  font-weight: bold;
}
#test .exam .container #form-kagome .check-inner .check-content {
  background: var(--cream-color);
}
@media print, screen and (min-width: 769px) {
  #test .exam .container #form-kagome .check-inner .check-content {
    border-radius: 0.78125vw;
  }
}
@media screen and (max-width: 768px) {
  #test .exam .container #form-kagome .check-inner .check-content {
    border-radius: 2.5641025641vw;
  }
}
#test .exam .container #form-kagome .check-inner .check-content .check-group {
  display: flex;
  flex-wrap: wrap;
}
#test .exam .container #form-kagome .check-inner .check-text {
  color: var(--white-color);
}
#test .exam .container #form-kagome .check-inner .check-item input[type=radio] {
  appearance: none;
  -webkit-appearance: none;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  cursor: pointer;
  flex-shrink: 0;
  border: 0.1rem solid var(--body-color);
}
#test .exam .container #form-kagome input[type=radio] {
  background: var(--white-color);
}
#test .exam .container #form-kagome input[type=radio]:checked {
  background: var(--green-color);
  box-shadow: inset 0 0 0 0.4rem var(--white-color);
}
#test .exam .container #form-kagome .btn-check {
  position: relative;
  display: inline-block;
  border: none;
  background: var(--orange-color);
  cursor: pointer;
  z-index: 1;
  box-shadow: 0.9rem 1rem 0 0 #E66718;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
@media print, screen and (min-width: 769px) {
  #test .exam .container #form-kagome .btn-check {
    border-radius: 3.90625vw;
  }
}
@media screen and (max-width: 768px) {
  #test .exam .container #form-kagome .btn-check {
    border-radius: 12.8205128205vw;
  }
}
#test .exam .container #form-kagome .btn-check:hover {
  transform: translateY(2px);
  box-shadow: 0 0.6rem 0 0 var(--orange-color);
  opacity: 0.8;
}
#test .result {
  background-color: var(--cream-color);
  display: none;
  margin-left: auto;
  margin-right: auto;
}
@media print, screen and (min-width: 769px) {
  #test .result {
    border-radius: 2.34375vw;
  }
}
@media screen and (max-width: 768px) {
  #test .result {
    border-radius: 7.6923076923vw;
  }
}
#test .result.is-show {
  display: block;
}
#test .result .score {
  display: flex;
  align-items: end;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
}
#test .result .underline-score {
  background-color: #ffe59b;
  margin-left: auto;
  margin-right: auto;
}
#test .result .compliment {
  width: 100%;
  background-color: var(--green-color);
  border-bottom-left-radius: 3rem;
  border-bottom-right-radius: 3rem;
  display: flex;
  align-items: center;
}
#test .result .compliment .comp-text {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

#point {
  background-image: url("../img/point-bg_pc.webp");
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  height: 167rem;
  z-index: 2;
  position: relative;
}
#point .point-sep {
  width: 100%;
}
#point picture {
  display: block;
}
#point picture img {
  width: 100%;
  height: 100%;
}
#point .content-point .point-fruit,
#point .content-point .point-title,
#point .content-point .point-line,
#point .content-point .point-goal {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
#point .content-point .point-list {
  background-image: url("../img/point-bg-content.webp");
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  width: 104rem;
  height: 82.95rem;
  margin-left: auto;
  margin-right: auto;
}
#point .content-point .point-list .text {
  rotate: -10deg;
}
#point .content-point .point-list .text span {
  display: block;
  z-index: 1;
  position: relative;
}
#point .content-point .point-list .text span::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -0.4rem;
  width: 100%;
  height: 1.4rem;
  z-index: -1;
}
#point .content-point .point-list .text-01 {
  color: var(--orange-color);
}
#point .content-point .point-list .text-01 span::after {
  background-color: #FEED9D;
}
#point .content-point .point-list .text-02 {
  color: var(--green-color);
}
#point .content-point .point-list .text-02 span::after {
  background-color: #BCFFD3;
}
#point .content-point .point-list .text-03 {
  color: var(--purple-color);
}
#point .content-point .point-list .text-03 span::after {
  background-color: #F8D5F5;
}

#fruit-about {
  background-image: url("../img/fruit-about-bg_pc.webp");
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  z-index: 3;
  position: relative;
}
#fruit-about .container {
  background: var(--white-color);
  box-shadow: 0rem 0rem 1rem rgba(0, 0, 0, 0.3607843137);
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
}
@media print, screen and (min-width: 769px) {
  #fruit-about .container {
    border-radius: 1.5625vw;
  }
}
@media screen and (max-width: 768px) {
  #fruit-about .container {
    border-radius: 5.1282051282vw;
  }
}
#fruit-about .container .content .title {
  color: #08B3B4;
  white-space: nowrap;
}

.bg-sep-green {
  background-color: var(--green-color);
}

#special {
  background-image: url("../img/bg-spec_pc.webp");
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
}
#special .special-text-img {
  width: 100%;
}
#special .phone-wrap {
  display: block;
  padding: 3.6rem;
  background: rgba(255, 255, 255, 0.3);
  margin-left: auto;
  margin-right: auto;
}
@media print, screen and (min-width: 769px) {
  #special .phone-wrap {
    border-radius: 2.34375vw;
  }
}
@media screen and (max-width: 768px) {
  #special .phone-wrap {
    border-radius: 7.6923076923vw;
  }
}
#special .phone-content {
  display: flex;
  background-color: var(--white-color);
  margin-left: auto;
  margin-right: auto;
}
@media print, screen and (min-width: 769px) {
  #special .phone-content {
    border-radius: 2.34375vw;
  }
}
@media screen and (max-width: 768px) {
  #special .phone-content {
    border-radius: 7.6923076923vw;
  }
}
#special .phone-content .version-01,
#special .phone-content .version-02 {
  display: flex;
  align-items: center;
}
#special .phone-content .version-01 .btn-version,
#special .phone-content .version-02 .btn-version {
  position: relative;
  display: flex;
  align-items: center;
  background: var(--white-color);
  cursor: pointer;
  z-index: 1;
  box-shadow: 0.9rem 1rem 0 0 var(--green-color);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  margin-left: auto;
  margin-right: auto;
}
@media print, screen and (min-width: 769px) {
  #special .phone-content .version-01 .btn-version,
  #special .phone-content .version-02 .btn-version {
    border-radius: 3.90625vw;
  }
}
@media screen and (max-width: 768px) {
  #special .phone-content .version-01 .btn-version,
  #special .phone-content .version-02 .btn-version {
    border-radius: 12.8205128205vw;
  }
}
#special .phone-content .version-01 .btn-version:hover,
#special .phone-content .version-02 .btn-version:hover {
  transform: translateX(10px) translateY(10px);
  box-shadow: none;
  opacity: 0.8;
}
#special .bottom-special .title-bottom,
#special .bottom-special .sub-title-bottom,
#special .bottom-special .title-bottom-img,
#special .bottom-special .four-fruit-bottom {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
#special .bottom-special .bottom-text-02 {
  margin-left: auto;
  margin-right: auto;
}
#special .bottom-special .btn-bottom {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--white-color);
  cursor: pointer;
  z-index: 1;
  box-shadow: 0.9rem 1rem 0 0 var(--green-color);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  margin-left: auto;
  margin-right: auto;
}
@media print, screen and (min-width: 769px) {
  #special .bottom-special .btn-bottom {
    border-radius: 3.90625vw;
  }
}
@media screen and (max-width: 768px) {
  #special .bottom-special .btn-bottom {
    border-radius: 12.8205128205vw;
  }
}
#special .bottom-special .btn-bottom:hover {
  transform: translateX(10px) translateY(10px);
  box-shadow: none;
  opacity: 0.8;
}

#footer-end {
  display: flex;
  align-items: end;
  justify-content: center;
}
#footer-end .list-social-footer,
#footer-end .footer-logo {
  display: flex;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
}
#footer-end .list-social-footer a,
#footer-end .footer-logo a {
  cursor: pointer;
  transition: all 0.3s ease;
}
#footer-end .list-social-footer a .toothclip,
#footer-end .footer-logo a .toothclip {
  border-radius: 5rem;
  white-space: nowrap;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
}
#footer-end .list-social-footer a:hover,
#footer-end .footer-logo a:hover {
  opacity: 0.8;
}
#footer-end .footer-logo {
  justify-content: space-between;
}
#footer-end .list-social-footer {
  justify-content: center;
}

.note {
  font-size: 0.6em;
  vertical-align: top;
  position: relative;
  top: -0.3em;
}

.js-copy-link {
  position: relative;
}

.toothclip {
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  font-weight: bold;
  white-space: nowrap;
  color: #191818;
  border-radius: 0.4rem;
  box-shadow: 0 0.2rem 0.6rem rgba(0, 0, 0, 0.25);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.toothclip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 0.35rem;
  border-style: solid;
  border-color: white transparent transparent transparent;
}
.toothclip.is-show {
  opacity: 1;
  transform: translateX(-50%) translateY(-0.2rem);
}

/* -------------------------------------------------------------- */
/*  smp  */
/* -------------------------------------------------------------- */
@media screen and (max-width: 768px) {
  #top-intro .top {
    position: relative;
    width: 100%;
    height: 160vw;
    overflow: hidden;
  }
  #top-intro .top .bg-top-img {
    z-index: 2;
    top: 8.7179487179vw;
    left: 7.6923076923vw;
    width: 84.6153846154vw;
    height: 15.5717948718vw;
  }
  #top-intro .top .bg-top-title {
    z-index: 2;
    top: 35.4692307692vw;
    right: 6.2333333333vw;
    width: 85.9384615385vw;
    height: 73.641025641vw;
  }
  #top-intro .top .bg-top-deco {
    z-index: 2;
    top: 92.5641025641vw;
    left: 2.5641025641vw;
    width: 97.4358974359vw;
    height: 93.2743589744vw;
  }
  #top-intro .top .top-deco-01 {
    z-index: 0;
    top: 94.6153846154vw;
    left: 3.1769230769vw;
    width: 73.7461538462vw;
    height: 56.1153846154vw;
  }
  #top-intro .intro {
    background-image: url("../img/bg-intro_sp.webp");
    margin-top: -13.3333333333vw;
    height: 348.0615384615vw;
  }
  #top-intro .intro .social {
    gap: 1.7rem;
    padding-top: 21.5384615385vw;
  }
  #top-intro .intro .social .line,
  #top-intro .intro .social .x {
    width: 14.358974359vw;
    height: 14.358974359vw;
  }
  #top-intro .intro .social .link {
    width: 10.7692307692vw;
    height: 10.7692307692vw;
  }
  #top-intro .intro .social .toothclip {
    font-size: 0.8rem;
    letter-spacing: 0rem;
    line-height: 1.4;
    padding: 0.5rem 0.5rem;
    margin-bottom: 0.3rem;
  }
  #top-intro .intro .social .toothclip::after {
    border-width: 0.35rem;
  }
  #top-intro .intro .content .fruit-01 {
    width: 20.3358974359vw;
    height: 34.3461538462vw;
    top: -32.0512820513vw;
    left: 4.358974359vw;
  }
  #top-intro .intro .content .fruit-02 {
    width: 20.3692307692vw;
    height: 34.4vw;
    top: -32.0512820513vw;
    right: 4.358974359vw;
  }
  #top-intro .intro .content .fruit-03 {
    width: 19.2717948718vw;
    height: 34.0025641026vw;
    top: 203.8461538462vw;
    left: 3.7948717949vw;
  }
  #top-intro .intro .content .fruit-04 {
    width: 19.4461538462vw;
    height: 34.3153846154vw;
    top: 203.8461538462vw;
    right: 3.641025641vw;
  }
  #top-intro .intro .content .dummy-title {
    margin-top: 49.7435897436vw;
    width: 69.2307692308vw;
    height: 30.5128205128vw;
  }
  #top-intro .intro .content .title {
    font-size: 1.8rem;
    line-height: 3.05rem;
    letter-spacing: 0.09rem;
    margin-top: 3.0769230769vw;
  }
  #top-intro .intro .content .search-info-pc {
    display: none !important;
  }
  #top-intro .intro .content .search-info-sp {
    margin-top: 4.8717948718vw;
  }
  #top-intro .intro .content .search-info-sp .search-container-01 .search-info-01,
  #top-intro .intro .content .search-info-sp .search-container-01 .search-info-02,
  #top-intro .intro .content .search-info-sp .search-container-02 .search-info-01,
  #top-intro .intro .content .search-info-sp .search-container-02 .search-info-02 {
    gap: 5rem;
    flex-shrink: 0;
  }
  #top-intro .intro .content .search-info-sp .search-container-01 .green-orange-smooth,
  #top-intro .intro .content .search-info-sp .search-container-02 .green-orange-smooth {
    margin-left: 1.0256410256vw;
    width: 98.4615384615vw;
    height: 56.6666666667vw;
  }
  #top-intro .intro .content .search-info-sp .search-container-01 .yellow-pink-smooth,
  #top-intro .intro .content .search-info-sp .search-container-02 .yellow-pink-smooth {
    margin-left: 5.1282051282vw;
    width: 89.7435897436vw;
    height: 56.9230769231vw;
  }
  #top-intro .intro .content .search-info-sp .search {
    width: 30.7692307692vw;
  }
  #top-intro .intro .content .search-info-sp .search .search-img {
    right: 0.93rem;
    width: 5.3051282051vw;
    height: 5.3051282051vw;
  }
  #top-intro .intro .content .search-info-sp .search .text {
    font-size: 1.3rem;
    line-height: 1.9rem;
    letter-spacing: 0.065rem;
  }
  #top-intro .intro .content .search-info-sp .search-01 {
    padding: 1.5384615385vw 0vw 1.5384615385vw 5.8333333333vw;
  }
  #top-intro .intro .content .search-info-sp .search-02 {
    padding: 1.5384615385vw 0vw 1.5384615385vw 3.2948717949vw;
  }
  #top-intro .intro .content .search-info-sp .search-03 {
    padding: 1.5384615385vw 0vw 1.5384615385vw 2.6666666667vw;
  }
  #top-intro .intro .content .search-info-sp .search-04 {
    padding: 1.5384615385vw 0vw 1.5384615385vw 8.2307692308vw;
  }
  .modal-info .text {
    width: 69.2307692308vw;
    margin-left: auto;
    margin-right: auto;
    font-size: 2rem;
    line-height: 3.6rem;
    letter-spacing: 0.1rem;
  }
  .modal-info .info {
    flex-direction: column;
    width: 79.4871794872vw;
    height: 161.5384615385vw;
  }
  .modal-info .info .info-title-01,
  .modal-info .info .info-title-02,
  .modal-info .info .info-title-03,
  .modal-info .info .info-title-04 {
    margin-left: auto;
    margin-right: auto;
    display: block;
  }
  .modal-info .info img {
    width: 100%;
    height: 100%;
  }
  .modal-info .info .navigation {
    gap: 20.6rem;
    transform: translateX(-50%);
    top: 41.3333333333vw;
  }
  .modal-info .info .navigation .btn-prev,
  .modal-info .info .navigation .btn-next {
    width: 8.2051282051vw;
    height: 8.2051282051vw;
  }
  .modal-info .btn-close {
    gap: 2.1rem;
    bottom: 3.29rem;
    left: 50%;
    transform: translateX(-50%);
    width: 35.8974358974vw;
    height: 12.2820512821vw;
    font-size: 1.8rem;
    line-height: 2.6rem;
    letter-spacing: 0.09rem;
    padding-left: 5.1282051282vw;
  }
  .modal-info .btn-close img {
    width: 6.1538461538vw;
    height: 6.1538461538vw;
  }
  .modal-info .info-01 {
    border: 0.5rem solid var(--green-color);
    padding-top: 7.6923076923vw;
  }
  .modal-info .info-01 .info-title-01 {
    margin-top: 4.1538461538vw;
    margin-bottom: 5.3256410256vw;
    width: 44.4897435897vw;
    height: 11.5974358974vw;
  }
  .modal-info .info-01 .fruit-img-01 {
    margin-left: 4.8717948718vw;
    width: 67.4358974359vw;
    height: 67.4358974359vw;
  }
  .modal-info .info-01 .btn-close {
    background-color: var(--green-color);
  }
  .modal-info .info-02 {
    border: 0.7rem solid var(--orange-color);
    padding-top: 7.1794871795vw;
  }
  .modal-info .info-02 .info-title-02 {
    margin-top: 10.0487179487vw;
    margin-bottom: 4.9487179487vw;
    width: 52.8102564103vw;
    height: 11.9743589744vw;
  }
  .modal-info .info-02 .fruit-img-02 {
    margin-left: 11.7948717949vw;
    width: 61.5384615385vw;
    height: 61.5384615385vw;
  }
  .modal-info .info-02 .btn-close {
    background-color: var(--orange-color);
  }
  .modal-info .info-03 {
    border: 0.7rem solid var(--yellow-color);
    padding-left: 0vw;
  }
  .modal-info .info-03 .info-title-03 {
    margin-top: 3.8974358974vw;
    margin-bottom: 5.4358974359vw;
    width: 58.3717948718vw;
    height: 11.2205128205vw;
  }
  .modal-info .info-03 .fruit-img-03 {
    margin-left: 12.0512820513vw;
    width: 52.8205128205vw;
    height: 72.8205128205vw;
  }
  .modal-info .info-03 .btn-close {
    background-color: var(--yellow-color);
  }
  .modal-info .info-04 {
    border: 0.7rem solid var(--pink-color);
    padding-top: 6.9230769231vw;
  }
  .modal-info .info-04 .info-title-04 {
    margin-top: 6.4615384615vw;
    margin-bottom: 5.6153846154vw;
    width: 33.8282051282vw;
    height: 10.8vw;
  }
  .modal-info .info-04 .fruit-img-04 {
    margin-left: 10.2564102564vw;
    width: 56.6666666667vw;
    height: 65.8974358974vw;
  }
  .modal-info .info-04 .btn-close {
    background-color: var(--pink-color);
  }
  #test {
    margin-top: 5.4615384615vw;
    padding-bottom: 46.1538461538vw;
  }
  #test .test-sep {
    top: -19.4871794872vw;
    width: 100vw;
  }
  #test .exam {
    padding-top: 17.3846153846vw;
  }
  #test .exam .container {
    width: 89.7435897436vw;
  }
  #test .exam .container .test-title-text-01 {
    margin-top: 12.7692307692vw;
    width: 80.3102564103vw;
    height: 33.8666666667vw;
    margin-left: 5.1282051282vw;
  }
  #test .exam .container .test-title {
    width: 74.358974359vw;
    height: 25.2461538462vw;
    top: -16.4102564103vw;
    left: 2.5641025641vw;
    transform: none;
  }
  #test .exam .container .test-title-img-01 {
    margin-top: 7.958974359vw;
    width: 33.3333333333vw;
    height: 54.3128205128vw;
    margin-left: auto;
    margin-right: auto;
    display: block;
  }
  #test .exam .container .test-deco-01 {
    width: 31.3vw;
    height: 31.3vw;
    top: -20.2564102564vw;
    right: -6.1538461538vw;
  }
  #test .exam .container .test-deco-02 {
    rotate: 28deg;
    width: 38.6076923077vw;
    height: 38.6076923077vw;
    top: 68.5641025641vw;
    left: -6.4102564103vw;
  }
  #test .exam .container .test-deco-03 {
    width: 44.8717948718vw;
    height: 44.8717948718vw;
    top: 63.5641025641vw;
    right: -13.0769230769vw;
  }
  #test .exam .container .test-deco-04 {
    width: 46.1538461538vw;
    height: 46.1538461538vw;
    bottom: 6.4871794872vw;
    right: -5.1282051282vw;
  }
  #test .exam .container .test-deco-05 {
    rotate: 23deg;
    width: 14.3769230769vw;
    height: 14.4256410256vw;
    bottom: 39.0512820513vw;
    left: 4.8205128205vw;
  }
  #test .exam .container .test-deco-06 {
    width: 57.7025641026vw;
    height: 57.3230769231vw;
    top: -20.0256410256vw;
    left: -22.5641025641vw;
  }
  #test .exam .container .test-deco-07 {
    width: 57.7025641026vw;
    height: 57.3230769231vw;
    top: -11.0256410256vw;
    right: -31.0256410256vw;
  }
  #test .exam .container .test-deco-08 {
    width: 57.7025641026vw;
    height: 57.3230769231vw;
    bottom: -60.2564102564vw;
    left: -20.2564102564vw;
  }
  #test .exam .container .test-deco-09 {
    max-width: none;
    width: 111.5076923077vw;
    height: 50.2435897436vw;
    bottom: -115.641025641vw;
    right: -53.0769230769vw;
  }
  #test .exam .container .test-title-01 {
    width: 203.5897435897vw;
    height: 68.2051282051vw;
    margin-top: 27.7435897436vw;
    margin-left: 30.7692307692vw;
  }
  #test .exam .container .sub-title-sp {
    margin-top: 3.1230769231vw;
    font-size: 1.1rem;
    line-height: 1.6rem;
    letter-spacing: 0.055rem;
  }
  #test .exam .container .sub-title {
    margin-top: 13.3333333333vw;
    font-size: 2rem;
    line-height: 3.005rem;
    letter-spacing: 0.1rem;
  }
  #test .exam .container #form-kagome {
    width: 79.4871794872vw;
    margin-top: 3.8461538462vw;
    padding-bottom: 15.0102564103vw;
  }
  #test .exam .container #form-kagome .btn-check {
    box-shadow: 0.8rem 1.5rem 0rem 0rem #E66718;
    text-align: left;
    padding-left: 8.9743589744vw;
    width: 76.9230769231vw;
    height: 25.641025641vw;
    margin-top: 16.8615384615vw;
    font-size: 2.2rem;
    line-height: 3.1rem;
    letter-spacing: 0.11rem;
  }
  #test .exam .container #form-kagome .check-error {
    font-size: 1.5rem;
    line-height: 2.2rem;
    letter-spacing: 0.15rem;
  }
  #test .exam .container #form-kagome .check:last-child {
    margin-bottom: 0vw;
  }
  #test .exam .container #form-kagome .check-inner {
    gap: 2.6rem;
    flex-direction: column;
    padding: 5.1282051282vw 5.1282051282vw 5.1282051282vw 5.1282051282vw;
    margin-bottom: 7.6923076923vw;
  }
  #test .exam .container #form-kagome .check-inner .check-content {
    display: flex;
    flex-direction: column;
    width: 69.2307692308vw;
    padding: 5.8974358974vw 0vw 5.8974358974vw 5.1282051282vw;
  }
  #test .exam .container #form-kagome .check-inner .check-content .check-group {
    gap: 2rem;
    flex-direction: column;
  }
  #test .exam .container #form-kagome .check-inner .check-head {
    gap: 1.88rem;
  }
  #test .exam .container #form-kagome .check-inner .check-head .check-number {
    position: relative;
    width: 15.6897435897vw;
    height: 18.6487179487vw;
  }
  #test .exam .container #form-kagome .check-inner .check-head .check-text {
    font-size: 2.4rem;
    line-height: 3.5rem;
    letter-spacing: 0.12rem;
  }
  #test .exam .container #form-kagome .check-inner .check-item {
    gap: 1rem;
  }
  #test .exam .container #form-kagome .check-inner .check-item label {
    font-size: 1.5rem;
    line-height: 2.1rem;
    letter-spacing: 0.075rem;
  }
  #test .result {
    margin-top: 15.3846153846vw;
    width: 79.4871794872vw;
  }
  #test .result .test-result-01 {
    width: 73.5974358974vw;
    height: 25.641025641vw;
    top: -8.9743589744vw;
    left: -7.6923076923vw;
  }
  #test .result .score {
    gap: 0.8rem;
    padding-top: 15.4358974359vw;
  }
  #test .result .score .test-score-0 {
    width: auto;
    height: 15.0717948718vw;
  }
  #test .result .score .text {
    font-size: 1.5rem;
    line-height: 2.1rem;
    letter-spacing: 0.075rem;
  }
  #test .result .underline-score {
    width: 64.1025641026vw;
    height: 3.9282051282vw;
    margin-top: -2.5641025641vw;
  }
  #test .result .compliment {
    flex-direction: column;
    margin-top: 6.5282051282vw;
    padding-top: 3.3333333333vw;
    padding-bottom: 2.8974358974vw;
    height: 100%;
  }
  #test .result .compliment .test-result-02 {
    margin-top: 3.5128205128vw;
    width: 72.1307692308vw;
    height: 20.6923076923vw;
  }
  #test .result .compliment .comp-text {
    font-size: 2rem;
    line-height: 2.9rem;
    letter-spacing: 0.1rem;
  }
  #point {
    background-image: url("../img/point-bg_sp.webp");
    height: 156.97rem;
    margin-top: -25.3846153846vw;
  }
  #point .content-point {
    padding-top: 17.9487179487vw;
  }
  #point .content-point .point-fruit {
    width: 53.8461538462vw;
    height: 28.0794871795vw;
  }
  #point .content-point .point-title {
    margin-top: 5.1794871795vw;
    width: 89.7435897436vw;
    height: 34.1025641026vw;
  }
  #point .content-point .point-line {
    margin-top: 3.4102564103vw;
    width: 89.7435897436vw;
    height: 2.4846153846vw;
  }
  #point .content-point .point-goal {
    margin-top: 13.9487179487vw;
    width: 89.7435897436vw;
    height: 25.5692307692vw;
  }
  #point .content-point .point-list {
    background-image: url("../img/point-bg-content_sp.webp");
    width: 69.0538461538vw;
    height: 243.3333333333vw;
    margin-top: 2.641025641vw;
  }
  #point .content-point .point-list .text {
    font-size: 1.5rem;
    line-height: 2.2rem;
    letter-spacing: 0.075rem;
  }
  #point .content-point .point-list .text span::after {
    bottom: 0rem !important;
    height: 0.943rem;
  }
  #point .content-point .point-list .text-01 {
    top: 11.7435897436vw;
    left: 8.6153846154vw;
  }
  #point .content-point .point-list .text-01 span:nth-child(1)::after {
    width: 10.642rem;
  }
  #point .content-point .point-list .text-01 span:nth-child(2)::after {
    width: 12.825rem;
  }
  #point .content-point .point-list .text-01 span:nth-child(3)::after {
    width: 6.175rem;
  }
  #point .content-point .point-list .text-02 {
    top: 95.1282051282vw;
    left: 8.1538461538vw;
  }
  #point .content-point .point-list .text-02 span:nth-child(1)::after {
    width: 10.454rem;
  }
  #point .content-point .point-list .text-02 span:nth-child(2)::after {
    width: 12.613rem;
  }
  #point .content-point .point-list .text-03 {
    top: 190.7692307692vw;
    left: 8.1025641026vw;
  }
  #point .content-point .point-list .text-03 span:nth-child(1)::after {
    width: 10.626rem;
  }
  #point .content-point .point-list .text-03 span:nth-child(2)::after {
    width: 9.781rem;
  }
  #point .content-point .point-list .text-03 span:nth-child(3)::after {
    width: 11.191rem;
  }
  #fruit-about {
    background-image: url("../img/fruit-about-bg_sp.webp");
    margin-top: -9.7435897436vw;
    padding-top: 22.8205128205vw;
    padding-bottom: 14.2051282051vw;
  }
  #fruit-about .container {
    flex-direction: column;
    width: 89.7435897436vw;
  }
  #fruit-about .container .product {
    top: -8.4615384615vw;
    left: 5.1282051282vw;
    width: 80.7692307692vw;
    height: 86.9794871795vw;
  }
  #fruit-about .container .content {
    margin-top: 80.5128205128vw;
    margin-bottom: 10.5128205128vw;
  }
  #fruit-about .container .content .title {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    width: 64.1025641026vw;
    font-size: 2.4rem;
    line-height: 3.4rem;
    letter-spacing: 0.12rem;
  }
  #fruit-about .container .content .text {
    width: 79.4871794872vw;
    margin-top: 2.3076923077vw;
    font-size: 1.5rem;
    line-height: 2.7rem;
    letter-spacing: 0.075rem;
  }
  #fruit-about .container .content .text-01 {
    width: 79.4871794872vw;
    margin-top: 5.8974358974vw;
    font-size: 1.3rem;
    line-height: 2rem;
    letter-spacing: 0.065rem;
  }
  .bg-sep-green {
    height: 14.1025641026vw;
    margin-top: -14.1025641026vw;
    margin-bottom: -0.2564102564vw;
  }
  #special {
    background-image: url("../img/bg-spec_sp.webp");
    padding-bottom: 14.8717948718vw;
    overflow-x: hidden;
    position: relative;
  }
  #special .special-text-img {
    height: 41.7948717949vw;
    margin-top: 6.3076923077vw;
  }
  #special .phone-wrap {
    padding: 2rem;
    margin-top: -12.0512820513vw;
    width: 89.7435897436vw;
  }
  #special .phone-content {
    gap: 0rem;
    flex-direction: column;
    padding: 6.1538461538vw 5.1282051282vw 8.8205128205vw 5.1282051282vw;
  }
  #special .phone-content .phone-left .special-title {
    width: 69.2307692308vw;
    height: 56.1666666667vw;
  }
  #special .phone-content .phone-left .special-text {
    margin-top: 3.7564102564vw;
    font-size: 1.5rem;
    line-height: 2.6rem;
    letter-spacing: 0.075rem;
    width: 69.2307692308vw;
  }
  #special .phone-content .phone-right {
    margin-top: 5.2051282051vw;
  }
  #special .phone-content .phone-right .phone-inner {
    width: 40.8923076923vw;
    margin-left: auto;
    margin-right: auto;
  }
  #special .phone-content .phone-right .anima-left {
    top: 3.64rem;
    left: -10.3rem;
  }
  #special .phone-content .phone-right .anima-right {
    top: 3.64rem;
    right: -12.1rem;
  }
  #special .phone-content .phone-right .anima-left {
    width: 47.6717948718vw;
    height: 67.8179487179vw;
  }
  #special .phone-content .phone-right .anima-right {
    width: 48.9846153846vw;
    height: 67.8025641026vw;
  }
  #special .phone-content .phone-right .special-phone {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 40.8923076923vw;
    height: 82.2538461538vw;
  }
  #special .phone-content .version-01,
  #special .phone-content .version-02 {
    flex-direction: column;
    gap: 0.9rem;
  }
  #special .phone-content .version-01 .btn-version,
  #special .phone-content .version-02 .btn-version {
    border: 0.3rem solid var(--green-color);
    gap: 1.718rem;
    box-shadow: 0.8rem 0.8rem 0 var(--green-color);
    padding-left: 5.641025641vw;
    width: 69.2307692308vw;
    height: 20.5128205128vw;
    font-size: 1.7rem;
    line-height: 2.5rem;
    letter-spacing: 0.085rem;
  }
  #special .phone-content .version-01 .btn-version .btn-down,
  #special .phone-content .version-02 .btn-version .btn-down {
    width: 5.8666666667vw;
    height: 6.8384615385vw;
  }
  #special .phone-content .version-01 {
    margin-top: 11.3487179487vw;
  }
  #special .phone-content .version-02 {
    margin-top: 7.0897435897vw;
  }
  #special .phone-content .text {
    text-align: center;
    font-size: 1.8rem;
    line-height: 2.4rem;
    letter-spacing: 0.09rem;
    width: 51.2820512821vw;
  }
  #special .bottom-special {
    position: relative;
    padding-top: 9.6487179487vw;
  }
  #special .bottom-special .title-bottom {
    margin-top: 19.2307692308vw;
    width: 94.6179487179vw;
    height: 37.8205128205vw;
  }
  #special .bottom-special .sub-title-bottom {
    margin-top: 0.4615384615vw;
    width: 82.5641025641vw;
    height: 24.6564102564vw;
  }
  #special .bottom-special .anima-bottom {
    position: relative;
    z-index: -1;
  }
  #special .bottom-special .anima-bottom .special-ani-01 {
    top: -72.3076923077vw;
    left: 3.7435897436vw;
    width: 29.6179487179vw;
    height: 32.3769230769vw;
  }
  #special .bottom-special .anima-bottom .special-ani-02 {
    top: -81.7948717949vw;
    right: 2.5641025641vw;
    width: 36.5666666667vw;
    height: 47.2307692308vw;
  }
  #special .bottom-special .anima-bottom .special-ani-03 {
    top: -1.5384615385vw;
    left: 7.6923076923vw;
    width: 42.2487179487vw;
    height: 41.6025641026vw;
  }
  #special .bottom-special .anima-bottom .special-ani-04 {
    top: 7.1282051282vw;
    right: 8.8205128205vw;
    width: 39.3794871795vw;
    height: 34.7717948718vw;
  }
  #special .bottom-special .bottom-text-01 {
    text-align: left;
    width: 91.0256410256vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 40.8897435897vw;
    font-size: 1.5rem;
    line-height: 2.768rem;
    letter-spacing: 0.075rem;
  }
  #special .bottom-special .bottom-text-02 {
    width: 89.7435897436vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 9.2307692308vw;
    font-size: 1.3rem;
    line-height: 2.38rem;
    letter-spacing: 0.065rem;
  }
  #special .bottom-special .title-bottom-img {
    margin-top: 18.0512820513vw;
    width: 61.0256410256vw;
    height: 19.2307692308vw;
  }
  #special .bottom-special .four-fruit-bottom {
    margin-top: -1.2820512821vw;
    width: 96.4102564103vw;
    height: 39.2307692308vw;
  }
  #special .bottom-special .btn-bottom {
    border: 0.5rem solid var(--green-color);
    box-shadow: 0.8rem 0.8rem 0 var(--green-color);
    width: 89.7435897436vw;
    height: 28.2051282051vw;
    font-size: 2rem;
    line-height: 3rem;
    letter-spacing: 0.1rem;
    margin-top: 2.358974359vw;
  }
}
@media screen and (max-width: 768px) and (min-width: 769px) {
  #special .bottom-special .btn-bottom {
    border-radius: 4.296875vw;
  }
}
@media screen and (max-width: 768px) and (max-width: 768px) {
  #special .bottom-special .btn-bottom {
    border-radius: 14.1025641026vw;
  }
}
@media screen and (max-width: 768px) {
  #footer-end {
    padding-top: 10.2564102564vw;
    padding-bottom: 10.6025641026vw;
  }
  #footer-end .footer-logo {
    gap: 2.523rem;
  }
  #footer-end .footer-logo .footer-logo-passnavi {
    width: 33.3333333333vw;
    height: 9.6205128205vw;
  }
  #footer-end .footer-logo .footer-logo-kagome {
    width: 29.4282051282vw;
    height: 14.5743589744vw;
  }
  #footer-end .list-social-footer {
    margin-top: 7.3871794872vw;
    gap: 1.2rem;
  }
  #footer-end .list-social-footer a {
    width: 15.8974358974vw;
    height: 15.8974358974vw;
  }
  #footer-end .list-social-footer .toothclip {
    font-size: 0.8rem;
    letter-spacing: 0rem;
    line-height: 1.4;
    padding: 0.5rem 0.9rem;
    margin-bottom: 0.6rem;
  }
  #footer-end .list-social-footer .toothclip::after {
    border-width: 0.35rem;
  }
  #footer-end .text-footer-sp {
    margin-top: 6.4102564103vw;
    font-size: 1.1rem;
    line-height: 1.75rem;
    letter-spacing: 0.055rem;
  }
}
/* -------------------------------------------------------------- */
/* PC */
/* -------------------------------------------------------------- */
@media print, screen and (min-width: 769px) {
  #top-intro .top {
    height: 54.0625vw;
  }
  #top-intro .top .bg-top-img {
    z-index: 2;
    top: 7.8125vw;
    left: 14.0625vw;
    width: 30.46875vw;
    height: 5.60703125vw;
  }
  #top-intro .top .shape {
    z-index: 10;
    width: 100%;
    top: 37.890625vw;
    right: 0vw;
    height: 16.25vw;
  }
  #top-intro .top .bg-top-title {
    z-index: 2;
    right: 2.9703125vw;
    width: 48.071875vw;
    height: 42.87734375vw;
  }
  #top-intro .top .bg-top-deco {
    z-index: 2;
    top: 18.0390625vw;
    left: 20.71875vw;
    width: 62.27734375vw;
    height: 50.58125vw;
  }
  #top-intro .top .top-deco-01 {
    z-index: 0;
    top: 43.75vw;
    left: 0.96796875vw;
    width: 22.46953125vw;
    height: 17.09765625vw;
  }
  #top-intro .intro {
    margin-top: -16.5625vw;
    height: 123.75vw;
  }
  #top-intro .intro .social {
    gap: 1.6rem;
    padding-top: 18.125vw;
  }
  #top-intro .intro .social .line,
  #top-intro .intro .social .x {
    width: 4.375vw;
    height: 4.375vw;
  }
  #top-intro .intro .social .link {
    width: 3.28125vw;
    height: 3.28125vw;
  }
  #top-intro .intro .social .toothclip {
    font-size: 0.8rem;
    letter-spacing: 0rem;
    line-height: 1.4;
    padding: 0.5rem 0.9rem;
    margin-bottom: 0.4rem;
  }
  #top-intro .intro .social .toothclip::after {
    border-width: 0.35rem;
  }
  #top-intro .intro .content {
    background-image: url("../img/ka-bg-intro_pc.webp");
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    margin-top: 7.5vw;
    width: 76.5625vw;
    height: 76.5625vw;
  }
  #top-intro .intro .content .fruit-01 {
    width: 13.30625vw;
    height: 22.471875vw;
    top: 8.59375vw;
    left: 1.3328125vw;
  }
  #top-intro .intro .content .fruit-02 {
    width: 13.32734375vw;
    height: 22.5078125vw;
    top: 8.59375vw;
    right: 2.29765625vw;
  }
  #top-intro .intro .content .fruit-03 {
    width: 12.60859375vw;
    height: 22.2484375vw;
    bottom: 11.140625vw;
    left: -1.484375vw;
  }
  #top-intro .intro .content .fruit-04 {
    width: 12.72421875vw;
    height: 22.45234375vw;
    bottom: 11.140625vw;
    right: -1.796875vw;
  }
  #top-intro .intro .content .dummy-title {
    padding-top: 12.1875vw;
    width: 28.203125vw;
  }
  #top-intro .intro .content .title {
    font-size: 2rem;
    line-height: 3.233rem;
    letter-spacing: 0.1rem;
    margin-top: 1.484375vw;
  }
  #top-intro .intro .content .dummy {
    margin-top: 1.09375vw;
    margin-left: 8.90625vw;
    width: 57.578125vw;
    height: 22.34375vw;
  }
  #top-intro .intro .content .search-info-sp {
    display: none !important;
  }
  #top-intro .intro .content .search-info-pc {
    gap: 2rem;
    margin-left: 13.9453125vw;
    margin-top: -1.171875vw;
  }
  #top-intro .intro .content .search-info-pc .search {
    width: 10.9375vw;
  }
  #top-intro .intro .content .search-info-pc .search .search-img {
    right: 1rem;
    width: 1.959375vw;
    height: 1.959375vw;
  }
  #top-intro .intro .content .search-info-pc .search .text {
    font-size: 1.6rem;
    line-height: 2.4rem;
    letter-spacing: 0.08rem;
  }
  #top-intro .intro .content .search-info-pc .search-01 {
    padding: 0.546875vw 0vw 0.703125vw 2.34375vw;
  }
  #top-intro .intro .content .search-info-pc .search-02 {
    padding: 0.58125vw 0vw 0.66875vw 1.40625vw;
  }
  #top-intro .intro .content .search-info-pc .search-03 {
    padding: 0.58125vw 0vw 0.66875vw 1.171875vw;
  }
  #top-intro .intro .content .search-info-pc .search-04 {
    padding: 0.58125vw 0vw 0.66875vw 3.22734375vw;
  }
  .modal-info .text {
    font-size: 2.2rem;
    line-height: 4.2rem;
    letter-spacing: 0.11rem;
  }
  .modal-info .info {
    width: 70.3125vw;
    height: 43.75vw;
  }
  .modal-info .info .navigation {
    gap: 71.6rem;
  }
  .modal-info .info .navigation .btn-prev,
  .modal-info .info .navigation .btn-next {
    width: 4.0625vw;
    height: 4.0625vw;
  }
  .modal-info .btn-close {
    gap: 2.1rem;
    right: 7.3rem;
    bottom: 7.51rem;
    margin-left: auto;
    width: 10.9375vw;
    height: 3.7421875vw;
    font-size: 1.8rem;
    line-height: 2.6rem;
    letter-spacing: 0.09rem;
    padding-left: 1.5625vw;
  }
  .modal-info .btn-close img {
    width: 1.875vw;
    height: 1.875vw;
  }
  .modal-info .info-01 {
    border: 0.7rem solid var(--green-color);
    gap: 1.9rem;
    padding-left: 5.15625vw;
    padding-top: 6.328125vw;
  }
  .modal-info .info-01 .info-title-01 {
    margin-top: 2.5vw;
    margin-bottom: 2.8203125vw;
    width: 18.50078125vw;
    height: 4.82265625vw;
  }
  .modal-info .info-01 .fruit-img-01 {
    width: 25.625vw;
    height: 30.46875vw;
  }
  .modal-info .info-01 .btn-close {
    background-color: var(--green-color);
  }
  .modal-info .info-02 {
    border: 0.7rem solid var(--orange-color);
    gap: 1.7rem;
    padding-left: 6.640625vw;
    padding-top: 7.578125vw;
  }
  .modal-info .info-02 .info-title-02 {
    margin-top: 3.125vw;
    margin-bottom: 2.65625vw;
    width: 21.9609375vw;
    height: 4.9796875vw;
  }
  .modal-info .info-02 .fruit-img-02 {
    width: 24.296875vw;
    height: 27.34375vw;
  }
  .modal-info .info-02 .btn-close {
    background-color: var(--orange-color);
  }
  .modal-info .info-03 {
    border: 0.7rem solid var(--yellow-color);
    gap: 3.2rem;
    padding-left: 6.328125vw;
    padding-top: 6.484375vw;
  }
  .modal-info .info-03 .info-title-03 {
    margin-top: 4.21875vw;
    margin-bottom: 2.96875vw;
    width: 24.27421875vw;
    height: 4.66640625vw;
  }
  .modal-info .info-03 .fruit-img-03 {
    width: 23.4375vw;
    height: 29.0625vw;
  }
  .modal-info .info-03 .btn-close {
    background-color: var(--yellow-color);
  }
  .modal-info .info-04 {
    border: 0.7rem solid var(--pink-color);
    gap: 2.4rem;
    padding-top: 5.078125vw;
    padding-left: 6.640625vw;
  }
  .modal-info .info-04 .info-title-04 {
    margin-top: 6.015625vw;
    margin-bottom: 2.6953125vw;
    width: 14.06796875vw;
    height: 4.490625vw;
  }
  .modal-info .info-04 .fruit-img-04 {
    width: 23.75vw;
    height: 29.140625vw;
  }
  .modal-info .info-04 .btn-close {
    background-color: var(--pink-color);
  }
  #test {
    margin-top: 7.8125vw;
    padding-bottom: 12.6796875vw;
  }
  #test .test-sep {
    top: -21.0546875vw;
    width: 121.875vw;
  }
  #test .exam {
    padding-top: 2.328125vw;
  }
  #test .exam .container {
    width: 81.25vw;
    padding-bottom: 8.578125vw;
  }
  #test .exam .container .test-title {
    width: 51.06171875vw;
    height: 15.7609375vw;
    top: -9.53125vw;
  }
  #test .exam .container .test-deco-01 {
    width: 17.421875vw;
    height: 17.421875vw;
    top: -10.15625vw;
    right: 4.375vw;
  }
  #test .exam .container .test-deco-02 {
    rotate: 28deg;
    width: 17.9578125vw;
    height: 17.9578125vw;
    top: 9.4140625vw;
    left: -6.484375vw;
  }
  #test .exam .container .test-deco-03 {
    width: 20.9375vw;
    height: 20.9375vw;
    top: 8.609375vw;
    right: -8.75vw;
  }
  #test .exam .container .test-deco-04 {
    width: 29.859375vw;
    height: 21.01875vw;
    bottom: 2.953125vw;
    right: -6.015625vw;
  }
  #test .exam .container .test-deco-05 {
    rotate: -25deg;
    width: 7.13515625vw;
    height: 6.5546875vw;
    bottom: 12.5546875vw;
    left: 10.84375vw;
  }
  #test .exam .container .test-deco-06 {
    width: 27.0375vw;
    height: 26.859375vw;
    top: -6.953125vw;
    left: -12.421875vw;
  }
  #test .exam .container .test-deco-07 {
    width: 27.0375vw;
    height: 26.859375vw;
    top: -11.953125vw;
    right: -15.625vw;
  }
  #test .exam .container .test-deco-08 {
    width: 27.0375vw;
    height: 26.859375vw;
    bottom: -3.359375vw;
    left: -17.890625vw;
  }
  #test .exam .container .test-deco-09 {
    width: 52.25vw;
    height: 21.875vw;
    bottom: -14.84375vw;
    right: -16.328125vw;
  }
  #test .exam .container .test-title-01 {
    width: 62.03125vw;
    height: 20.78125vw;
    margin-top: 8.453125vw;
    margin-left: 9.375vw;
  }
  #test .exam .container .sub-title {
    margin-top: 4.59375vw;
    font-size: 2.4rem;
    line-height: 3.5rem;
    letter-spacing: 0.12rem;
  }
  #test .exam .container #form-kagome {
    width: 70.3125vw;
    margin-top: 1.71875vw;
  }
  #test .exam .container #form-kagome .btn-check {
    width: 46.875vw;
    height: 7.8125vw;
    margin-top: 5.484375vw;
    font-size: 3rem;
    line-height: 4.4rem;
    letter-spacing: 0.15rem;
  }
  #test .exam .container #form-kagome .check-error {
    font-size: 1.5rem;
    line-height: 2.2rem;
    letter-spacing: 0.15rem;
  }
  #test .exam .container #form-kagome .check-08 .check-inner .check-content .check-group {
    gap: 1rem;
  }
  #test .exam .container #form-kagome .check-inner {
    gap: 2.6rem;
    padding: 1.5625vw 1.5625vw 1.5625vw 1.5625vw;
    margin-bottom: 1.5625vw;
  }
  #test .exam .container #form-kagome .check-inner .check-content {
    width: 47.65625vw;
    padding: 1.953125vw 0vw 1.875vw 1.5625vw;
  }
  #test .exam .container #form-kagome .check-inner .check-content .check-group {
    gap: 3rem;
  }
  #test .exam .container #form-kagome .check-inner .check-head {
    gap: 1.88rem;
    width: 17.5vw;
  }
  #test .exam .container #form-kagome .check-inner .check-head .check-number {
    width: 4.78046875vw;
    height: 5.68203125vw;
    top: 1.09375vw;
  }
  #test .exam .container #form-kagome .check-inner .check-head .check-text {
    padding-left: 6.25vw;
    font-size: 2.4rem;
    line-height: 3.4rem;
    letter-spacing: 0.12rem;
  }
  #test .exam .container #form-kagome .check-inner .check-item {
    gap: 1rem;
  }
  #test .exam .container #form-kagome .check-inner .check-item label {
    font-size: 1.5rem;
    line-height: 2.1rem;
    letter-spacing: 0.075rem;
  }
  #test .result {
    margin-top: 6.70859375vw;
    width: 81.25vw;
  }
  #test .result .test-result-01 {
    width: 38.721875vw;
    height: 12.64609375vw;
    top: -3.359375vw;
    left: -7.34375vw;
  }
  #test .result .score {
    gap: 1.5rem;
    padding-top: 5.2171875vw;
  }
  #test .result .score .test-score-0 {
    width: 20.69140625vw;
    height: 8.96328125vw;
  }
  #test .result .score .text {
    font-size: 3.1rem;
    line-height: 4.5rem;
    letter-spacing: 0.155rem;
  }
  #test .result .underline-score {
    width: 37.96875vw;
    height: 1.71875vw;
    margin-top: -0.78125vw;
  }
  #test .result .compliment {
    margin-top: 5.703125vw;
    height: 11.71875vw;
  }
  #test .result .compliment .test-result-02 {
    width: 18.90625vw;
    height: 9.15625vw;
    top: 1.5078125vw;
    left: 6.25vw;
  }
  #test .result .compliment .test-result-03 {
    width: 19.1734375vw;
    height: 9.33828125vw;
    top: 1.46875vw;
    right: 6.375vw;
  }
  #test .result .compliment .comp-text {
    font-size: 2.6rem;
    line-height: 3.85rem;
    letter-spacing: 0.13rem;
  }
  #point {
    margin-top: -1.5625vw;
  }
  #point .point-sep {
    top: -4.21875vw;
    height: 8.39609375vw;
  }
  #point .point-deco-01,
  #point .point-deco-02 {
    top: -1.5625vw;
    width: 17.1875vw;
    height: 45.3125vw;
  }
  #point .point-deco-01 {
    left: 0vw;
  }
  #point .point-deco-02 {
    right: 0vw;
  }
  #point .content-point {
    padding-top: 3.90625vw;
  }
  #point .content-point .point-fruit {
    width: 25.78125vw;
    height: 13.009375vw;
  }
  #point .content-point .point-title {
    margin-top: 1.5234375vw;
    width: 60.9375vw;
    height: 12.03125vw;
  }
  #point .content-point .point-line {
    margin-top: 1.565625vw;
    width: 60.89921875vw;
    height: 0.8734375vw;
  }
  #point .content-point .point-goal {
    margin-top: 3.2671875vw;
    width: 64.0875vw;
    height: 9.971875vw;
  }
  #point .content-point .point-list {
    margin-top: 2.7625vw;
  }
  #point .content-point .point-list .text {
    font-size: 2.4rem;
    line-height: 3.1rem;
    letter-spacing: 0.12rem;
    height: 7.578125vw;
  }
  #point .content-point .point-list .text-01 {
    top: 5.328125vw;
    left: 3.90625vw;
  }
  #point .content-point .point-list .text-01 span:nth-child(1)::after {
    width: 16.4rem;
  }
  #point .content-point .point-list .text-01 span:nth-child(2)::after {
    width: 20.6rem;
  }
  #point .content-point .point-list .text-01 span:nth-child(3)::after {
    width: 10rem;
  }
  #point .content-point .point-list .text-02 {
    top: 5.34375vw;
    left: 53.6171875vw;
  }
  #point .content-point .point-list .text-02 span:nth-child(1)::after {
    width: 16.4rem;
  }
  #point .content-point .point-list .text-02 span:nth-child(2)::after {
    width: 20.6rem;
  }
  #point .content-point .point-list .text-03 {
    top: 42.4453125vw;
    left: 28.6015625vw;
  }
  #point .content-point .point-list .text-03 span:nth-child(1)::after {
    width: 16.4rem;
  }
  #point .content-point .point-list .text-03 span:nth-child(2)::after {
    width: 15.6rem;
  }
  #point .content-point .point-list .text-03 span:nth-child(3)::after {
    width: 17.7rem;
  }
  #fruit-about {
    margin-top: -3.203125vw;
    padding-top: 8.75vw;
    padding-bottom: 6.25vw;
  }
  #fruit-about .container {
    width: 76.5625vw;
  }
  #fruit-about .container .product {
    top: -2.34375vw;
    left: 1.0546875vw;
    width: 37.22890625vw;
    height: 44.490625vw;
  }
  #fruit-about .container .content {
    margin-left: 39.0625vw;
    margin-top: 2.65625vw;
    margin-bottom: 2.96875vw;
  }
  #fruit-about .container .content .title {
    width: 31.015625vw;
    font-size: 3.8rem;
    line-height: 4.8rem;
    letter-spacing: 0.19rem;
  }
  #fruit-about .container .content .text {
    width: 34.375vw;
    margin-top: 0.234375vw;
    font-size: 1.5rem;
    line-height: 2.7rem;
    letter-spacing: 0.075rem;
  }
  #fruit-about .container .content .text-01 {
    width: 34.375vw;
    margin-top: 1.015625vw;
    font-size: 1.3rem;
    line-height: 2rem;
    letter-spacing: 0.065rem;
  }
  .bg-sep-green {
    height: 10.703125vw;
    margin-top: -10.703125vw;
    margin-bottom: -0.078125vw;
  }
  #special {
    padding-bottom: 5.859375vw;
  }
  #special .special-text-img {
    height: 14.140625vw;
    margin-top: 5.625vw;
  }
  #special .phone-wrap {
    margin-top: -6.796875vw;
    width: 87.5vw;
  }
  #special .phone-content {
    gap: 13rem;
    padding: 2.8125vw 0vw 2.8046875vw 3.125vw;
  }
  #special .phone-content .phone-left .special-title {
    width: 39.84375vw;
    height: 10.578125vw;
  }
  #special .phone-content .phone-left .special-text {
    margin-top: 1.921875vw;
    font-size: 1.5rem;
    line-height: 2.5rem;
    letter-spacing: 0.075rem;
    width: 38.28125vw;
  }
  #special .phone-content .phone-left .version-01,
  #special .phone-content .phone-left .version-02 {
    gap: 1.6rem;
  }
  #special .phone-content .phone-left .version-01 .btn-version,
  #special .phone-content .phone-left .version-02 .btn-version {
    border: 0.3rem solid var(--green-color);
    gap: 1.719rem;
    padding-left: 1.71875vw;
    width: 21.09375vw;
    height: 5.46875vw;
    font-size: 1.7rem;
    line-height: 2.5rem;
    letter-spacing: 0.085rem;
  }
  #special .phone-content .phone-left .version-01 .btn-version .btn-down,
  #special .phone-content .phone-left .version-02 .btn-version .btn-down {
    width: 1.7875vw;
    height: 2.08359375vw;
  }
  #special .phone-content .phone-left .version-01 {
    margin-top: 1.5625vw;
  }
  #special .phone-content .phone-left .version-02 {
    margin-top: 1.5625vw;
  }
  #special .phone-content .phone-left .text {
    font-size: 1.6rem;
    line-height: 2.65rem;
    letter-spacing: 0.08rem;
    width: 15.625vw;
  }
  #special .phone-content .phone-right {
    margin-top: -0.078125vw;
  }
  #special .phone-content .phone-right .anima-left {
    top: 2.3rem;
    left: -17.7rem;
  }
  #special .phone-content .phone-right .anima-right {
    top: 3.48rem;
    right: -19.6rem;
  }
  #special .phone-content .phone-right .anima-left {
    width: 22.59765625vw;
    height: 32.390625vw;
  }
  #special .phone-content .phone-right .anima-right {
    width: 22.38046875vw;
    height: 30.9765625vw;
  }
  #special .phone-content .phone-right .special-phone {
    width: 17.09296875vw;
    height: 34.3828125vw;
  }
  #special .bottom-special {
    margin-top: 4.46796875vw;
  }
  #special .bottom-special .title-bottom {
    margin-top: 12.671875vw;
    width: 57.81640625vw;
    height: 7.98046875vw;
  }
  #special .bottom-special .sub-title-bottom {
    margin-top: 3.5625vw;
    width: 32.825vw;
    height: 8.9109375vw;
  }
  #special .bottom-special .anima-bottom .special-ani-01 {
    top: -5.859375vw;
    left: 2.34375vw;
    width: 25.78125vw;
    height: 48.39609375vw;
  }
  #special .bottom-special .anima-bottom .special-ani-02 {
    top: -10.859375vw;
    right: 1.1796875vw;
    width: 28.509375vw;
    height: 55.9125vw;
  }
  #special .bottom-special .bottom-text-01 {
    margin-top: 2.0265625vw;
    font-size: 1.5rem;
    line-height: 2.761rem;
    letter-spacing: 0.075rem;
  }
  #special .bottom-special .bottom-text-02 {
    margin-top: 1.875vw;
    font-size: 1.3rem;
    line-height: 2.333rem;
    letter-spacing: 0.065rem;
    width: 36.71875vw;
  }
  #special .bottom-special .title-bottom-img {
    margin-top: 6.25vw;
    width: 28.125vw;
    height: 6.87578125vw;
  }
  #special .bottom-special .four-fruit-bottom {
    margin-top: -0.3125vw;
    width: 55.86015625vw;
    height: 23.78515625vw;
  }
  #special .bottom-special .btn-bottom {
    border: 0.3rem solid var(--green-color);
    width: 42.96875vw;
    height: 7.8125vw;
    font-size: 2.2rem;
    line-height: 3.2rem;
    letter-spacing: 0.11rem;
    margin-top: 0.6171875vw;
  }
  #footer-end {
    padding-top: 3.359375vw;
    padding-bottom: 5.3125vw;
  }
  #footer-end .text-footer {
    margin-bottom: 3.28125vw;
    font-size: 1.1rem;
    line-height: 1.6rem;
    letter-spacing: 0.055rem;
  }
  #footer-end .footer-content {
    margin-left: 4.53125vw;
    margin-right: 3.59375vw;
  }
  #footer-end .footer-logo {
    gap: 5rem;
  }
  #footer-end .footer-logo .footer-logo-passnavi {
    width: 20.3125vw;
    height: 5.8625vw;
  }
  #footer-end .footer-logo .footer-logo-kagome {
    width: 17.96875vw;
    height: 8.89921875vw;
  }
  #footer-end .list-social-footer {
    margin-top: 3.60078125vw;
    gap: 1.9rem;
  }
  #footer-end .list-social-footer a {
    width: 7.890625vw;
    height: 7.96875vw;
  }
  #footer-end .list-social-footer .toothclip {
    font-size: 0.8rem;
    letter-spacing: 0rem;
    line-height: 1.4;
    padding: 0.5rem 0.9rem;
    margin-bottom: 0.4rem;
  }
  #footer-end .list-social-footer .toothclip::after {
    border-width: 0.35rem;
  }
}