@charset "UTF-8";
/*!
 * ress.css • v4.0.0
 * MIT License
 * github.com/filipelinhares/ress
 */
/* # =================================================================
   # Global selectors
   # ================================================================= */
html {
  box-sizing: border-box;
  -webkit-text-size-adjust: 100%; /* Prevent adjustments of font size after orientation changes in iOS */
  word-break: normal;
  -moz-tab-size: 4;
  tab-size: 4;
}

*,
::before,
::after {
  background-repeat: no-repeat; /* Set `background-repeat: no-repeat` to all elements and pseudo elements */
  box-sizing: inherit;
}

::before,
::after {
  text-decoration: inherit; /* Inherit text-decoration and vertical align to ::before and ::after pseudo elements */
  vertical-align: inherit;
}

* {
  padding: 0; /* Reset `padding` and `margin` of all elements */
  margin: 0;
}

/* # =================================================================
     # General elements
     # ================================================================= */
hr {
  overflow: visible; /* Show the overflow in Edge and IE */
  height: 0; /* Add the correct box sizing in Firefox */
  color: inherit; /* Correct border color in Firefox. */
}

details,
main {
  display: block; /* Render the `main` element consistently in IE. */
}

summary {
  display: list-item; /* Add the correct display in all browsers */
}

small {
  font-size: 80%; /* Set font-size to 80% in `small` elements */
}

[hidden] {
  display: none; /* Add the correct display in IE */
}

abbr[title] {
  border-bottom: none; /* Remove the bottom border in Chrome 57 */
  /* Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari */
  text-decoration: underline;
  text-decoration: underline dotted;
}

a {
  background-color: transparent; /* Remove the gray background on active links in IE 10 */
}

a:active,
a:hover {
  outline-width: 0; /* Remove the outline when hovering in all browsers */
}

code,
kbd,
pre,
samp {
  font-family: monospace, monospace; /* Specify the font family of code elements */
}

pre {
  font-size: 1em; /* Correct the odd `em` font sizing in all browsers */
}

b,
strong {
  font-weight: bolder; /* Add the correct font weight in Chrome, Edge, and Safari */
}

/* https://gist.github.com/unruthless/413930 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

table {
  border-color: inherit; /* Correct border color in all Chrome, Edge, and Safari. */
  text-indent: 0; /* Remove text indentation in Chrome, Edge, and Safari */
}

/* # =================================================================
     # Forms
     # ================================================================= */
input {
  border-radius: 0;
}

/* Replace pointer cursor in disabled elements */
[disabled] {
  cursor: default;
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto; /* Correct the cursor style of increment and decrement buttons in Chrome */
}

[type=search] {
  -webkit-appearance: textfield; /* Correct the odd appearance in Chrome and Safari */
  outline-offset: -2px; /* Correct the outline style in Safari */
}

[type=search]::-webkit-search-decoration {
  -webkit-appearance: none; /* Remove the inner padding in Chrome and Safari on macOS */
}

textarea {
  overflow: auto; /* Internet Explorer 11+ */
  resize: vertical; /* Specify textarea resizability */
}

button,
input,
optgroup,
select,
textarea {
  font: inherit; /* Specify font inheritance of form elements */
}

optgroup {
  font-weight: bold; /* Restore the font weight unset by the previous rule */
}

button {
  overflow: visible; /* Address `overflow` set to `hidden` in IE 8/9/10/11 */
}

button,
select {
  text-transform: none; /* Firefox 40+, Internet Explorer 11- */
}

/* Apply cursor pointer to button elements */
button,
[type=button],
[type=reset],
[type=submit],
[role=button] {
  cursor: pointer;
  color: inherit;
}

/* Remove inner padding and border in Firefox 4+ */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/* Replace focus style removed in the border reset above */
button:-moz-focusring,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  outline: 1px dotted ButtonText;
}

button,
html [type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button; /* Correct the inability to style clickable types in iOS */
}

/* Remove the default button styling in all browsers */
button,
input,
select,
textarea {
  background-color: transparent;
  border-style: none;
}

a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
  outline-width: 0;
}

/* Style select like a standard input */
select {
  -moz-appearance: none; /* Firefox 36+ */
  -webkit-appearance: none; /* Chrome 41+ */
}

select::-ms-expand {
  display: none; /* Internet Explorer 11+ */
}

select::-ms-value {
  color: currentColor; /* Internet Explorer 11+ */
}

legend {
  border: 0; /* Correct `color` not being inherited in IE 8/9/10/11 */
  color: inherit; /* Correct the color inheritance from `fieldset` elements in IE */
  display: table; /* Correct the text wrapping in Edge and IE */
  max-width: 100%; /* Correct the text wrapping in Edge and IE */
  white-space: normal; /* Correct the text wrapping in Edge and IE */
  max-width: 100%; /* Correct the text wrapping in Edge 18- and IE */
}

::-webkit-file-upload-button {
  /* Correct the inability to style clickable types in iOS and Safari */
  -webkit-appearance: button;
  color: inherit;
  font: inherit; /* Change font properties to `inherit` in Chrome and Safari */
}

/* # =================================================================
     # Specify media element style
     # ================================================================= */
img {
  border-style: none; /* Remove border when inside `a` element in IE 8/9/10 */
}

/* Add the correct vertical alignment in Chrome, Firefox, and Opera */
progress {
  vertical-align: baseline;
}

/* # =================================================================
     # Accessibility
     # ================================================================= */
/* Specify the progress cursor of updating elements */
[aria-busy=true] {
  cursor: progress;
}

/* Specify the pointer cursor of trigger elements */
[aria-controls] {
  cursor: pointer;
}

/* Specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements */
[aria-disabled=true] {
  cursor: default;
}

:root {
  --color-primary: #ff7f00;
  --yumincho: YuMincho, "Yu Mincho", serif;
}

html {
  scroll-behavior: smooth;
}

main {
  font-family: Avenir, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", "Yu Gothic Medium", sans-serif;
  background: #fffaf4;
  overflow-x: hidden;
}

@media screen and (min-width: 1025px) {
  .u-hidden_lg {
    display: none;
  }
}

.u-show_lg {
  display: none;
}
@media screen and (min-width: 1025px) {
  .u-show_lg {
    display: block;
  }
}

header {
  padding: 0 1rem;
}

.header_inner {
  display: none;
  justify-content: space-between;
  align-items: center;
  max-width: 1800px;
  margin: auto;
}
@media screen and (min-width: 1025px) {
  .header_inner {
    display: flex;
  }
}

.header_menu {
  display: flex;
  align-items: center;
}

.header_menu_item {
  padding: 1em;
  color: #000;
  font-family: var(--yumincho);
  font-size: clamp(10px, 1.1vw, 18px);
  font-weight: bold;
  letter-spacing: 0.15em;
  text-decoration: none;
}

.header_menuBtn {
  position: fixed;
  top: 8px;
  right: 0;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  background: #454545;
  color: #fff;
  border-radius: 16px 0 0 16px;
  z-index: 5;
}
@media screen and (min-width: 1025px) {
  .header_menuBtn {
    display: none;
  }
}

.header_menuBtn_hamburger {
  position: relative;
  width: 24px;
  height: 24px;
}
.header_menuBtn_hamburger span {
  position: absolute;
  left: 0;
  display: block;
  width: 100%;
  height: 2px;
  background: #fff;
}
.header_menuBtn_hamburger span:first-child {
  top: calc(50% - 6px);
}
.header_menuBtn_hamburger span:nth-child(2) {
  top: 50%;
}
.header_menuBtn_hamburger span:nth-child(3) {
  top: calc(50% + 6px);
}

.header_drawer {
  position: fixed;
  top: 0;
  right: -100%;
  width: 100%;
  height: 100vh;
  z-index: 10;
  transition: right 0.3s;
}
.header_drawer.is-active {
  right: 0;
}
@media screen and (min-width: 1025px) {
  .header_drawer {
    display: none;
  }
}

.header_drawer_mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.header_drawer_body {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  padding: 1rem;
  background: var(--color-primary);
  z-index: 2;
}

.header_drawer_close {
  display: flex;
  justify-content: end;
}

.header_drawer_logo {
  height: 32px;
}
.header_drawer_logo img {
  height: 100%;
}

.header_drawer_menu {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 3rem;
}

.header_drawer_menu_item {
  padding: 0.5em;
  color: #fff;
  font-size: 24px;
  text-decoration: none;
}

footer {
  padding-bottom: 1rem;
}
@media screen and (min-width: 1025px) {
  footer {
    padding-bottom: 4rem;
    background: linear-gradient(#ffa065 60%, #f4f4f4 60%);
  }
}

.footer_content {
  display: flex;
  justify-content: space-between;
  padding: 1rem;
  background: #f4f4f4;
}
@media screen and (min-width: 1025px) {
  .footer_content {
    flex-direction: column;
    -webkit-clip-path: polygon(0 0, 100% 70%, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 70%, 100% 100%, 0 100%);
    padding: 3rem 3rem 0;
  }
}
.footer_title_text {
  font-family: YuMincho, "Yu Mincho", serif;
  font-size: 8px;
  font-weight: bold;
}
@media screen and (min-width: 600px) {
  .footer_title_text {
    font-size: 16px;
  }
}
.footer_logo {
  display: flex;
  align-items: baseline;
}
.footer_logo_jp img {
  height: 100%;
}
@media screen and (min-width: 600px) {
  .footer_logo_jp {
    height: 48px;
  }
}
.footer_logo_en img {
  height: 100%;
}
@media screen and (min-width: 600px) {
  .footer_logo_en {
    height: 32px;
  }
}
.footer_address {
  margin-top: 1em;
  font-family: YuMincho, "Yu Mincho", serif;
  font-size: 7px;
}
@media screen and (min-width: 600px) {
  .footer_address {
    font-size: 14px;
  }
}
.footer_tel {
  margin-top: 1em;
  font-size: 7px;
}
@media screen and (min-width: 600px) {
  .footer_tel {
    font-size: 14px;
  }
}
.footer_tel a {
  color: inherit;
  text-decoration: none;
}
.footer_app {
  display: grid;
  grid-template: "text text" auto "btn qr" auto/54px 44px;
  gap: 8px;
}
@media screen and (min-width: 600px) {
  .footer_app {
    grid-template: "text text" auto "btn qr" auto/96px 80px;
  }
}
.footer_app_text {
  font-family: YuMincho, "Yu Mincho", serif;
  grid-area: text;
  font-size: 7px;
}
@media screen and (min-width: 600px) {
  .footer_app_text {
    font-size: 14px;
  }
}
.footer_app_btn {
  display: inline-block;
  width: 100%;
}
.footer_app_btn img {
  width: 100%;
}
.footer_app_qr {
  width: 100%;
}
.footer_app_qr img {
  width: 100%;
}
.footer_totop {
  padding: 0 1rem 1rem;
  border-bottom: 1px solid #000;
  background: #f4f4f4;
}
.footer_totop_btn {
  display: flex;
  align-items: center;
  width: fit-content;
  margin: 0 0 0 auto;
}

.heading {
  display: flex;
  align-items: baseline;
  border-bottom: 1px solid #000;
  font-weight: bold;
}
@media screen and (min-width: 1025px) {
  .heading {
    max-width: 1720px;
    margin: auto;
    padding-left: 4rem;
    border-bottom: 2px solid #000;
  }
}

.heading.heading__right {
  justify-content: end;
}

.heading.heading__center {
  display: block;
  text-align: center;
  border-bottom: 1px solid #000;
}
@media screen and (min-width: 1025px) {
  .heading.heading__center .heading_en {
    font-size: 70px;
  }
}
.heading.heading__center .heading_jp {
  color: var(--color-primary);
  font-size: 14px;
}
@media screen and (min-width: 1025px) {
  .heading.heading__center .heading_jp {
    font-size: 28px;
  }
}

.heading_en {
  color: #fff;
  -webkit-text-stroke: 1px #000;
  letter-spacing: 0.15em;
  overflow: hidden;
}
@media screen and (min-width: 600px) {
  .heading_en {
    font-size: 32px;
    -webkit-text-stroke: 2px #000;
  }
}
@media screen and (min-width: 1025px) {
  .heading_en {
    font-size: clamp(48px, 5vw, 70px);
    -webkit-text-stroke: 3px #000;
  }
}
.heading_en span {
  display: inline-block;
  transform: translate(0, 105%);
}
.heading_en.js_show span {
  animation: eachCharUp 0.5s forwards;
}
.heading_en img {
  height: 100%;
}

@keyframes eachCharUp {
  0% {
    transform: translate(0, 105%);
  }
  100% {
    transform: translate(0, 0);
  }
}
.heading_jp {
  margin-left: 1em;
  font-size: 8px;
  font-weight: bold;
}
@media screen and (min-width: 600px) {
  .heading_jp {
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .heading_jp {
    font-size: 28px;
  }
}

.hero {
  position: relative;
  height: 84vh;
  color: #fff;
  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="1540" height="1061" viewBox="0 0 1540 1061"><path d="M1540 958.463C1540 980.935 1526.03 1000.11 1506.29 1007.82C1504.17 1008.64 1501.97 1009.35 1499.7 1009.91C1492.41 1011.7 1486.55 1017.2 1484.94 1024.5C1484.41 1026.85 1483.79 1029.09 1483.11 1030.73C1475.55 1048.53 1457.94 1061 1437.4 1061H102.625C82.065 1061 64.446 1048.53 56.9161 1030.73C56.2101 1029.09 55.5924 1026.85 55.0924 1024.5C53.4746 1017.17 47.6212 1011.67 40.3266 1009.91C38.0617 1009.35 35.8851 1008.64 33.7378 1007.82C13.9716 1000.11 0 980.906 0 958.463V102.566C0 80.094 13.9716 60.9162 33.7084 53.2097C35.8262 52.3861 38.0323 51.6802 40.2972 51.1213C47.5918 49.3271 53.4452 43.8267 55.063 36.532C55.5924 34.1789 56.2101 31.9435 56.8866 30.2963C64.446 12.4715 82.0944 0 102.625 0H1437.37C1457.94 0 1475.55 12.4715 1483.08 30.2669C1483.79 31.9141 1484.41 34.1495 1484.91 36.5026C1486.53 43.8267 1492.38 49.3271 1499.67 51.0919C1501.94 51.6508 1504.11 52.3567 1506.26 53.1803C1526 60.8867 1539.97 80.094 1539.97 102.537V958.434L1540 958.463Z" fill="black"/></svg>');
  mask-repeat: no-repeat;
  mask-position: 0 0;
  mask-size: 100% 100%;
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="1540" height="1061" viewBox="0 0 1540 1061"><path d="M1540 958.463C1540 980.935 1526.03 1000.11 1506.29 1007.82C1504.17 1008.64 1501.97 1009.35 1499.7 1009.91C1492.41 1011.7 1486.55 1017.2 1484.94 1024.5C1484.41 1026.85 1483.79 1029.09 1483.11 1030.73C1475.55 1048.53 1457.94 1061 1437.4 1061H102.625C82.065 1061 64.446 1048.53 56.9161 1030.73C56.2101 1029.09 55.5924 1026.85 55.0924 1024.5C53.4746 1017.17 47.6212 1011.67 40.3266 1009.91C38.0617 1009.35 35.8851 1008.64 33.7378 1007.82C13.9716 1000.11 0 980.906 0 958.463V102.566C0 80.094 13.9716 60.9162 33.7084 53.2097C35.8262 52.3861 38.0323 51.6802 40.2972 51.1213C47.5918 49.3271 53.4452 43.8267 55.063 36.532C55.5924 34.1789 56.2101 31.9435 56.8866 30.2963C64.446 12.4715 82.0944 0 102.625 0H1437.37C1457.94 0 1475.55 12.4715 1483.08 30.2669C1483.79 31.9141 1484.41 34.1495 1484.91 36.5026C1486.53 43.8267 1492.38 49.3271 1499.67 51.0919C1501.94 51.6508 1504.11 52.3567 1506.26 53.1803C1526 60.8867 1539.97 80.094 1539.97 102.537V958.434L1540 958.463Z" fill="black"/></svg>');
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: top;
  -webkit-mask-size: cover;
  margin-left: 3%;
  margin-right: 3%;
  margin-top: 2rem;
}
.hero_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: none;
}
@media screen and (min-width: 1025px) {
  .hero_bg {
    display: block;
  }
}
.hero_bgImg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  visibility: hidden;
  transform: scale(1.1);
  transition: opacity 1s ease-in-out, visibility 1s, transform 4s linear;
}
.hero_bgImg.is-active {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}
.hero_logo {
  position: absolute;
  top: 5rem;
  right: 2rem;
  font-family: YuMinsho, "Yu Minsho", serif;
  font-size: 2.25rem;
  text-align: center;
  letter-spacing: 0.2em;
  line-height: 1.1;
}
@media screen and (min-width: 1025px) {
  .hero_logo {
    display: none;
  }
}
.hero_logo span {
  font-size: 0.75rem;
  line-height: 1;
  letter-spacing: normal;
}
.hero_logo img {
  vertical-align: top;
}
.hero_text {
  position: absolute;
  bottom: 2rem;
  left: 2rem;
  font-family: var(--yumincho);
  font-weight: 900;
  writing-mode: vertical-rl;
}
@media screen and (min-width: 1025px) {
  .hero_text {
    bottom: 5rem;
    left: 80px;
    width: 100%;
    font-size: clamp(20px, 2vw, 32px);
    letter-spacing: 0.1em;
    writing-mode: horizontal-tb;
    text-shadow: 0 10px 10px rgba(0, 0, 0, 0.1607843137);
  }
  .hero_text b {
    font-size: 48px;
  }
}
.hero_sec {
  position: absolute;
  top: 53%;
  left: 2%;
  transform: translateY(-50%);
  z-index: 2;
  padding: 40px 80px;
  color: black;
  font-family: var(--yumincho);
}
.hero_sec::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url(../img/hero-text-bg.png);
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0.7;
  z-index: -1;
}
.hero_sec h1 {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 1rem;
  line-height: 58px;
  letter-spacing: 2px;
}
@media screen and (min-width: 1025px) {
  .hero_sec h1 {
    font-size: 48px;
    margin-bottom: 2rem;
  }
}
.hero_sec ul {
  list-style: none;
  margin-bottom: 2rem;
  letter-spacing: 1px;
}
.hero_sec ul li {
  margin: 0.5rem 0;
  padding-left: 1.8em;
  position: relative;
}
.hero_sec ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.2em;
  width: 1.2em;
  height: 1.2em;
  background-image: url("/img/knife-icon.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter: hue-rotate(20deg) saturate(2) brightness(1.2);
}
@media screen and (min-width: 1025px) {
  .hero_sec ul li {
    font-size: 20px;
  }
}
.hero_sec a {
  display: inline-block;
  padding: 1rem 2rem 1rem 3rem;
  background: #ff7600;
  font-family: sans-serif;
  color: white;
  text-decoration: none;
  border-radius: 36px;
  font-weight: bold;
  transition: background 0.3s;
}
.hero_sec a:hover {
  background: #e56600;
}
.hero_nums {
  position: absolute;
  z-index: 2;
  bottom: 3%;
  right: 40px;
}
.hero_nums ul {
  display: flex;
  list-style: none;
  gap: 10px;
}
.hero_nums ul li {
  padding: 20px;
  background-image: url(../img/hero-num.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  text-align: center;
  font-size: 26px;
  font-weight: bold;
  font-family: var(--yumincho);
  color: #694806;
  text-shadow: -1px -1px 0 #f9f0dd, 1px -1px 0 #f9f0dd, -1px 1px 0 #f9f0dd, 1px 1px 0 #f9f0dd;
}
@media screen and (min-width: 1025px) {
  .hero_nums ul li {
    padding: 20px 12px;
    font-size: 26px;
  }
}
@media screen and (max-width: 768px) {
  .hero {
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='760' height='1372' viewBox='0 0 760 1372' fill='none'><g clip-path='url(%23clip0_603_9)'><path d='M760 1287.26C760 1305.83 750.928 1321.68 738.112 1328.05C736.736 1328.73 735.304 1329.31 733.833 1329.77C729.096 1331.26 725.295 1335.8 724.245 1341.84C723.901 1343.77 723.5 1345.63 723.061 1346.99C718.152 1361.69 706.711 1372 693.379 1372H66.6399C53.289 1372 41.8481 1361.69 36.9585 1346.99C36.5001 1345.63 36.099 1343.77 35.7743 1341.84C34.7238 1335.78 30.9229 1331.23 26.1861 1329.77C24.7154 1329.31 23.302 1328.73 21.9077 1328.05C9.0725 1321.68 0 1305.81 0 1287.26L0.00183105 84.7654C0.00183105 66.1934 9.07433 50.3439 21.8904 43.975C23.2656 43.2944 24.6981 42.7109 26.1688 42.2491C30.9056 40.7662 34.7065 36.2204 35.757 30.1918C36.1008 28.247 36.5019 26.3995 36.9412 25.0382C41.8499 10.307 53.3099 0 66.6417 0H693.362C706.713 0 718.154 10.307 723.043 25.0139C723.502 26.3752 723.903 28.2227 724.228 30.1675C725.278 36.2204 729.079 40.7662 733.816 42.2248C735.287 42.6866 736.7 43.2701 738.094 43.9507C750.91 50.3196 759.983 66.1934 759.983 84.7411L759.981 1287.24L760 1287.26Z' fill='%23363A40'/></g><defs><clipPath id='clip0_603_9'><rect width='760' height='1372' fill='white'/></clipPath></defs></svg>");
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='760' height='1372' viewBox='0 0 760 1372' fill='none'><g clip-path='url(%23clip0_603_9)'><path d='M760 1287.26C760 1305.83 750.928 1321.68 738.112 1328.05C736.736 1328.73 735.304 1329.31 733.833 1329.77C729.096 1331.26 725.295 1335.8 724.245 1341.84C723.901 1343.77 723.5 1345.63 723.061 1346.99C718.152 1361.69 706.711 1372 693.379 1372H66.6399C53.289 1372 41.8481 1361.69 36.9585 1346.99C36.5001 1345.63 36.099 1343.77 35.7743 1341.84C34.7238 1335.78 30.9229 1331.23 26.1861 1329.77C24.7154 1329.31 23.302 1328.73 21.9077 1328.05C9.0725 1321.68 0 1305.81 0 1287.26L0.00183105 84.7654C0.00183105 66.1934 9.07433 50.3439 21.8904 43.975C23.2656 43.2944 24.6981 42.7109 26.1688 42.2491C30.9056 40.7662 34.7065 36.2204 35.757 30.1918C36.1008 28.247 36.5019 26.3995 36.9412 25.0382C41.8499 10.307 53.3099 0 66.6417 0H693.362C706.713 0 718.154 10.307 723.043 25.0139C723.502 26.3752 723.903 28.2227 724.228 30.1675C725.278 36.2204 729.079 40.7662 733.816 42.2248C735.287 42.6866 736.7 43.2701 738.094 43.9507C750.91 50.3196 759.983 66.1934 759.983 84.7411L759.981 1287.24L760 1287.26Z' fill='%23363A40'/></g><defs><clipPath id='clip0_603_9'><rect width='760' height='1372' fill='white'/></clipPath></defs></svg>");
    -webkit-mask-size: contain;
    height: 100vh;
  }
  .hero .hero_bg {
    display: block;
  }
  .hero-sp {
    transform: translateY(-60vw);
  }
  .hero_sec {
    position: relative;
    transform: none;
    margin: 5%;
    padding: 34px 28px;
    top: auto;
    bottom: -50%;
    text-align: center;
    left: 0;
    right: 0;
    width: 90%;
    max-width: 370px;
    margin: auto;
  }
  .hero_sec::before {
    background-size: 100% 100%;
    background-position: center;
  }
  .hero_sec h1 {
    font-size: 20px;
    line-height: 32px;
    margin-bottom: 4px;
  }
  .hero_sec ul {
    text-align: left;
    display: inline-block;
    margin-bottom: 16px;
  }
  .hero_sec ul li {
    font-size: 14px;
  }
  .hero_nums {
    position: relative;
    bottom: 22%;
    right: 0px;
    width: 85%;
    margin: auto;
    margin-bottom: 14vw;
  }
  .hero_nums ul {
    justify-content: space-between;
    gap: 4px;
  }
  .hero_nums ul li {
    padding: 3px;
    font-size: 12px;
    text-shadow: none;
    color: #ffffff;
  }
}

.scroll {
  display: none;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin-top: 10rem;
  font-family: Avenir, sans-serif;
}
@media screen and (min-width: 1025px) {
  .scroll {
    display: flex;
  }
}
.scroll_text {
  font-size: 20px;
}
.scroll_line {
  height: 300px;
  margin-top: 1rem;
  border-left: 1px dashed #000;
}

.scroll.scroll_sm {
  position: absolute;
  bottom: 4%;
  right: 45px;
  display: flex;
  width: fit-content;
}
@media screen and (min-width: 1025px) {
  .scroll.scroll_sm {
    display: none;
  }
}
.scroll.scroll_sm .scroll_text {
  font-size: 15px;
}
.scroll.scroll_sm .scroll_line {
  height: 106px;
  border-color: #cecece;
}
.scroll.scroll_sm {
  display: none;
}

.strength {
  --side-length: 200px;
  padding: 5rem 1rem;
  font-family: var(--yumincho);
  font-weight: 900;
  letter-spacing: 0.15em;
  line-height: 1.5;
}
@media screen and (min-width: 600px) {
  .strength {
    --side-length: 240px;
  }
}
@media screen and (min-width: 1025px) {
  .strength {
    --side-length: 372px;
    padding-top: 410px;
  }
}
.strength_copy {
  width: fit-content;
  margin: 5rem auto 0;
  letter-spacing: 0.15em;
}
@media screen and (min-width: 600px) {
  .strength_copy {
    font-size: 28px;
  }
}
@media screen and (min-width: 1025px) {
  .strength_copy {
    font-size: clamp(32px, 4vw, 60px);
  }
}
.strength_title {
  position: relative;
  width: fit-content;
  margin: 5rem auto 0;
  padding-bottom: 0.5em;
  font-size: 1.1rem;
}
.strength_title::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 150px;
  height: 1px;
  background: #000;
  transform: translate(-50%, 0);
}
@media screen and (min-width: 600px) {
  .strength_title {
    font-size: 32px;
  }
}
@media screen and (min-width: 1025px) {
  .strength_title {
    font-size: 48px;
  }
}
.strength_list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2rem;
  margin-top: 2rem;
  padding: 0 1rem;
}
@media screen and (min-width: 1025px) {
  .strength_list {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    max-width: 1400px;
    margin: 120px auto 0;
    padding: 0;
  }
}
.strength_item {
  position: relative;
  width: var(--side-length);
  height: var(--side-length);
  padding: 24px 1rem 0;
  background: url(../img/strength-bg.png) center/contain no-repeat;
}
.strength_item:nth-child(2) {
  align-self: flex-end;
}
@media screen and (min-width: 1025px) {
  .strength_item {
    padding: 80px 32px 0;
  }
  .strength_item:nth-child(2) {
    align-self: center;
  }
}
.strength_item_num {
  --diameter: 2rem;
  position: absolute;
  top: 0;
  left: 50%;
  display: inline-block;
  width: var(--diameter);
  height: var(--diameter);
  background: linear-gradient(140deg, #ff7600 30%, #803b00 70%);
  color: #fff;
  text-align: center;
  line-height: var(--diameter);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (min-width: 600px) {
  .strength_item_num {
    --diameter: 3rem;
    font-size: 32px;
  }
}
@media screen and (min-width: 1025px) {
  .strength_item_num {
    --diameter: 96px;
    font-size: 54px;
  }
}
.strength_item_title {
  font-size: 0.9rem;
  text-align: center;
}
@media screen and (min-width: 600px) {
  .strength_item_title {
    font-size: 24px;
  }
}
@media screen and (min-width: 1025px) {
  .strength_item_title {
    font-size: clamp(32px, 4vw, 55px);
  }
}
.strength_item_text {
  margin-top: 9px;
  font-size: 9px;
  line-height: 1.8;
}
@media screen and (min-width: 600px) {
  .strength_item_text {
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .strength_item_text {
    font-size: 18px;
  }
}
@media screen and (max-width: 768px) {
  .strength {
    padding: 0rem 0rem;
    transform: translateY(-30vw);
  }
  .strength_copy {
    margin: 0 auto 0;
    font-size: 14px;
    line-height: 26px;
  }
  .strength_item_text {
    font-size: 12px;
  }
  .strength_list {
    position: relative;
  }
  .strength_list::before {
    content: "";
    background: url(../img/miyabun-bg.png);
    position: absolute;
    display: block;
    top: 24%;
    right: -14%;
    height: 100%;
    width: 50%;
    background-repeat: no-repeat;
    opacity: 0.5;
    transform: translateX(-200%);
    transition: transform 1.5s ease-out 1s, opacity 1.5s ease-out 1s;
  }
  .strength_list.js_show::before {
    transform: translateX(0);
    opacity: 1;
  }
}

.committed {
  display: flex;
  flex-direction: column;
  padding: 5rem 1rem;
  font-family: var(--yumincho);
}
@media screen and (min-width: 1025px) {
  .committed {
    padding: 5rem 5rem;
  }
}
.committed_title {
  font-size: 1.5rem;
  font-weight: 900;
  letter-spacing: 0.15em;
}
@media screen and (min-width: 600px) {
  .committed_title {
    font-size: 40px;
  }
}
@media screen and (min-width: 1025px) {
  .committed_title {
    font-size: 56px;
  }
}
.committed_text {
  order: 2;
  margin-top: 1.5rem;
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  line-height: 2;
}
@media screen and (min-width: 600px) {
  .committed_text {
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .committed_text {
    order: 1;
    font-size: 24px;
  }
}
.committed_img {
  order: 1;
  margin: 3rem auto 0;
  width: 90%;
  max-width: 960px;
}
@media screen and (min-width: 1025px) {
  .committed_img {
    order: 2;
    margin-top: 96px;
  }
}
.committed_img img,
.committed_img video {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.committed_copy {
  order: 3;
  margin-top: 10rem;
  font-size: 1.25rem;
  letter-spacing: 0.15em;
  text-align: center;
}
@media screen and (min-width: 600px) {
  .committed_copy {
    font-size: 32px;
  }
}
@media screen and (min-width: 1025px) {
  .committed_copy {
    margin-top: 500px;
    font-size: clamp(48px, 5vw, 72px);
  }
}
.committed_copy_en {
  order: 4;
  display: none;
}
@media screen and (min-width: 1025px) {
  .committed_copy_en {
    display: block;
    font-size: 26px;
    text-align: center;
  }
}

.point {
  background: url(../img/miyabun-bg.png) top 4rem left -120px/80% no-repeat;
}
@media screen and (min-width: 600px) {
  .point {
    background-position: -15rem 50rem;
    background-size: 65%;
  }
}
@media screen and (min-width: 1025px) {
  .point {
    padding: 400px 1rem;
  }
}
.point_list {
  max-width: 1400px;
  margin: auto;
}
.point_item {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.point_item:not(:first-child) {
  margin-top: 3rem;
}
.point_item:not(:last-child) .point_item_content {
  padding-bottom: 3rem;
  border-bottom: 1px dashed #ff7f00;
}
@media screen and (min-width: 1025px) {
  .point_item:not(:last-child) .point_item_content {
    border-bottom: none;
  }
}
.point_item_num {
  --diameter: 60px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: var(--diameter);
  height: var(--diameter);
  background: #ff7600;
  color: #fff;
  font-size: 0.5rem;
  font-weight: bold;
  line-height: 1;
  text-align: center;
  border-radius: 50%;
}
@media screen and (min-width: 600px) {
  .point_item_num {
    --diameter: 100px;
    font-size: 12px;
  }
}
@media screen and (min-width: 1025px) {
  .point_item_num {
    width: 100%;
    height: auto;
    background: none;
    color: #ff7600;
    font-size: 40px;
    text-transform: uppercase;
  }
}
.point_item_num span {
  font-size: 2rem;
  display: block;
  line-height: 1;
}
@media screen and (min-width: 600px) {
  .point_item_num span {
    font-size: 48px;
  }
}
@media screen and (min-width: 1025px) {
  .point_item_num span {
    display: none;
  }
}
.point_item_num_pc {
  display: none;
}
@media screen and (min-width: 1025px) {
  .point_item_num_pc {
    display: flex;
    align-items: center;
    width: 100%;
  }
  .point_item_num_pc img {
    margin: 0 2rem;
  }
  .point_item_num_pc::before, .point_item_num_pc::after {
    content: "";
    width: 100%;
    height: 1px;
    background: #ff7600;
  }
}
.point_item_title {
  font-weight: bold;
}
@media screen and (min-width: 600px) {
  .point_item_title {
    font-size: 28px;
  }
}
@media screen and (min-width: 1025px) {
  .point_item_title {
    margin-top: 3rem;
    font-size: min(60px, 4.5vw);
    font-family: YuMincho, "Yu Mincho", serif;
  }
}
.point_item_title b {
  color: #ff7474;
}
@media screen and (min-width: 1025px) {
  .point_item_title b {
    color: #000;
  }
}
.point_item_content {
  max-width: 234px;
}
@media screen and (min-width: 600px) {
  .point_item_content {
    max-width: 420px;
  }
}
@media screen and (min-width: 1025px) {
  .point_item_content {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 100%;
    margin-top: 3rem;
  }
}
.point_item_img {
  position: relative;
  width: 100%;
}
@media screen and (min-width: 1025px) {
  .point_item_img {
    flex: 0 0 50%;
    width: 50%;
  }
}
.point_item_img img {
  width: 100%;
}
.point_item_imgTxt {
  position: absolute;
  bottom: 10px;
  left: 10px;
  color: #fff;
  font-family: var(--yumincho);
  font-size: 8px;
}
@media screen and (min-width: 1025px) {
  .point_item_imgTxt {
    font-size: 14px;
  }
}
.point_item_text {
  font-size: 10px;
  line-height: 2;
}
@media screen and (min-width: 600px) {
  .point_item_text {
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .point_item_text {
    margin-left: 2rem;
    font-family: YuMincho, "Yu Mincho", serif;
    font-size: 28px;
  }
}

.flow {
  position: relative;
  padding: 3rem 1rem;
}
@media screen and (min-width: 1025px) {
  .flow {
    padding: 3rem 0;
  }
}
.flow_text {
  margin-top: 1em;
  font-size: 8px;
  line-height: 1.8;
}
@media screen and (min-width: 600px) {
  .flow_text {
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .flow_text {
    max-width: 1720px;
    margin: 1em auto;
    padding-left: 4rem;
    font-size: min(30px, 2vw);
  }
}
.flow_text b {
  color: var(--color-primary);
  font-weight: normal;
}
.flow_list {
  margin-top: 5rem;
  padding: 1rem;
  background: url(../img/flow-bg.svg) top 1rem left 30%/auto 83% no-repeat;
}
@media screen and (min-width: 1025px) {
  .flow_list {
    display: grid;
    grid-template-columns: repeat(3, min(400px, 30%));
    justify-content: space-around;
    align-items: flex-start;
    padding-bottom: 16vw;
    background: url(../img/flow-line1.svg) top 250px left 200px/100% no-repeat, url(../img/flow-line2.svg) bottom 200px right 200px/100% no-repeat;
  }
}
.flow_item {
  position: relative;
  display: flex;
  align-items: center;
  padding: 1rem;
  background: #ffe5c3;
  border-radius: 12px;
}
.flow_item:not(:first-child) {
  margin-top: 28px;
}
@media screen and (min-width: 1025px) {
  .flow_item {
    display: grid;
    grid-template: "step" 66px "title" auto "img" auto "text" auto/auto;
    background: none;
  }
  .flow_item:nth-child(3n+2) {
    transform: translateY(8vw);
  }
  .flow_item:nth-child(3n) {
    transform: translateY(16vw);
  }
}
.flow_item[data-type=wait] {
  flex-direction: row-reverse;
  background: #f5f5f5;
}
@media screen and (min-width: 1025px) {
  .flow_item[data-type=wait] {
    background: none;
  }
}
.flow_item[data-type=wait] .flow_item_content {
  margin: 0 1rem 0 0;
}
@media screen and (min-width: 600px) {
  .flow_item[data-type=wait] .flow_item_content {
    margin: 0 2rem 0 0;
  }
}
.flow_item[data-type=wait] .flow_item_title {
  background: #d6d6d6;
  color: #000;
}
@media screen and (min-width: 1025px) {
  .flow_item[data-type=wait] .flow_item_title {
    background: none;
  }
}
.flow_item[data-type=finish] {
  background: #fff1e3;
}
@media screen and (min-width: 1025px) {
  .flow_item[data-type=finish] {
    background: none;
  }
}
.flow_item[data-type=finish] .flow_item_title {
  background: #ff0a00;
}
@media screen and (min-width: 1025px) {
  .flow_item[data-type=finish] .flow_item_title {
    background: none;
    color: #ff8100;
  }
}
.flow_item_step {
  position: absolute;
  top: -2rem;
  left: -1rem;
}
@media screen and (min-width: 1025px) {
  .flow_item_step {
    grid-area: step;
    position: relative;
    top: auto;
    left: auto;
    height: 64px;
    margin: 0;
    text-align: center;
  }
}
.flow_item_step img {
  height: 100%;
  vertical-align: top;
}
.flow_item_img {
  flex: 0 0 40%;
  aspect-ratio: 1/1;
}
@media screen and (min-width: 1025px) {
  .flow_item_img {
    grid-area: img;
    border-radius: 8px;
    overflow: hidden;
  }
}
.flow_item_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  vertical-align: top;
}
.flow_item_content {
  flex: 1;
  margin-left: 1rem;
}
@media screen and (min-width: 600px) {
  .flow_item_content {
    margin-left: 2rem;
  }
}
@media screen and (min-width: 1025px) {
  .flow_item_content {
    display: contents;
  }
}
.flow_item_days {
  font-weight: bold;
  letter-spacing: 0.1em;
  text-align: center;
}
@media screen and (min-width: 1025px) {
  .flow_item_days {
    grid-area: step;
    font-family: YuMincho, "Yu Mincho", serif;
    font-size: min(40px, 2.5vw);
  }
}
.flow_item_title {
  padding: 0.5em;
  background: #ff8100;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  border-radius: 3em;
}
@media screen and (min-width: 600px) {
  .flow_item_title {
    font-size: 24px;
  }
}
@media screen and (min-width: 1025px) {
  .flow_item_title {
    grid-area: title;
    padding: 0;
    background: none;
    color: #ff8100;
    font-size: min(50px, 3vw);
  }
}
.flow_item_text {
  margin-top: 1rem;
  font-size: 8px;
  line-height: 1.5;
}
@media screen and (min-width: 600px) {
  .flow_item_text {
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .flow_item_text {
    grid-area: text;
    padding: 0 2rem;
  }
}
.flow_note ul {
  padding-left: 1.5em;
  font-size: 10px;
}
@media screen and (min-width: 600px) {
  .flow_note ul {
    font-size: 16px;
  }
}
.flow_note a {
  color: inherit;
}
@media screen and (min-width: 1025px) {
  .flow_note {
    position: absolute;
    top: 10rem;
    right: 4rem;
    width: 540px;
  }
}
@media screen and (min-width: 1025px) {
  .flow_note.flow_note__bl {
    top: auto;
    right: auto;
    bottom: 3rem;
    left: 2rem;
  }
}

.order_btnWrapper {
  margin-top: 3rem;
  text-align: center;
}
@media screen and (min-width: 1025px) {
  .order_btnWrapper {
    margin-top: 5rem;
  }
}
@media screen and (min-width: 1025px) {
  .order_btnWrapper[data-media=md] {
    display: none;
  }
}
.order_btnWrapper[data-media=lg] {
  display: none;
}
@media screen and (min-width: 1025px) {
  .order_btnWrapper[data-media=lg] {
    display: block;
  }
}
.order_btn {
  position: relative;
  display: inline-block;
  padding: 0.5rem 4rem;
  background: #fcfcfc;
  border: 3px solid #ffa921;
  border-radius: 13px;
  box-shadow: 10px 10px 6px rgba(0, 0, 0, 0.1607843137);
}
@media screen and (min-width: 1025px) {
  .order_btn {
    border-radius: 1em;
  }
}
.order_btn:hover .order_btn_knife {
  margin: 0 -1em 0 1em;
}
.order_btn:hover .order_btn_char {
  left: 152px;
}
@media screen and (min-width: 1025px) {
  .order_btn:hover .order_btn_char {
    left: 196px;
  }
}
.order_btn_knife {
  height: 2.5rem;
  transition: margin 0.3s;
}
@media screen and (min-width: 1025px) {
  .order_btn_knife {
    height: 4rem;
  }
}
.order_btn_knife img {
  height: 100%;
}
.order_btn_char {
  position: absolute;
  top: 12px;
  left: 136px;
  transition: left 0.3s;
}
@media screen and (min-width: 1025px) {
  .order_btn_char {
    height: 2rem;
    left: 180px;
  }
}
.order_btn_char img {
  height: 100%;
}
.order_btn_text {
  position: absolute;
  bottom: 0.5rem;
  left: 1.5rem;
  color: #ffa921;
  font-size: 9px;
  font-weight: bold;
}
@media screen and (min-width: 1025px) {
  .order_btn_text {
    font-size: 16px;
  }
}

.order_btn__sm {
  padding: 0.5rem 2rem;
  text-decoration: none;
}
.order_btn__sm .order_btn_char {
  left: 106px;
}
.order_btn__sm .order_btn_text {
  position: relative;
  bottom: 0;
  left: 0;
  font-size: 12px;
}

.order_btn__noborder {
  padding: 0 1rem;
  text-align: center;
  border: none;
  box-shadow: none;
  text-decoration: none;
}
.order_btn__noborder .order_btn_text {
  position: relative;
  top: 0;
  left: 0;
  color: #000;
  font-size: clamp(10px, 1.1vw, 18px);
  font-family: var(--yumincho);
  letter-spacing: 0.15em;
}
.order_btn__noborder .order_btn_knife {
  height: 2.5em;
}
.order_btn__noborder .order_btn_char {
  top: 36px;
  left: 100px;
  height: 1.2em;
}

.order_btn__noborder:hover .order_btn_char {
  left: 118px;
}

.effect {
  position: relative;
  padding: 3rem 1rem;
}
@media screen and (min-width: 1025px) {
  .effect {
    padding: 150px 1rem;
  }
}
.effect_bg {
  display: none;
}
@media screen and (min-width: 1025px) {
  .effect_bg {
    position: absolute;
    display: block;
    top: -50px;
    right: -360px;
  }
}
.effect_text {
  position: relative;
  margin-top: 1em;
  font-size: 8px;
  line-height: 1.8;
}
@media screen and (min-width: 600px) {
  .effect_text {
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .effect_text {
    max-width: 1720px;
    margin: 1em auto;
    padding-left: 4rem;
    font-size: min(30px, 2vw);
  }
}
.effect_text b {
  color: var(--color-primary);
  font-weight: normal;
}
.effect_itemUnit {
  position: relative;
}
@media screen and (min-width: 1025px) {
  .effect_itemUnit {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    max-width: 1600px;
    margin: 160px auto;
  }
}
.effect_item {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  margin-top: 3rem;
}
@media screen and (min-width: 1025px) {
  .effect_item {
    flex: 1;
    flex-direction: column;
    align-items: start;
    max-width: 720px;
  }
}
.effect_item.effect_item_rev {
  flex-direction: row-reverse;
}
@media screen and (min-width: 1025px) {
  .effect_item.effect_item_rev {
    flex-direction: column;
  }
}
.effect_item.effect_item_rev .effect_item_title,
.effect_item.effect_item_rev .effect_item_label {
  color: #ff0000;
}
.effect_item_media {
  flex: 0 0 55%;
  text-align: center;
}
.effect_item_title {
  font-family: var(--yumincho);
  font-size: 15px;
  font-weight: 900;
  letter-spacing: 0.1em;
}
@media screen and (min-width: 1025px) {
  .effect_item_title {
    font-size: 60px;
  }
}
.effect_item_label {
  font-family: var(--yumincho);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.1em;
}
@media screen and (min-width: 1025px) {
  .effect_item_label {
    font-size: 35px;
  }
}
.effect_item_video {
  width: 100%;
}
.effect_item_video video {
  width: 100%;
}
.effect_item_text {
  padding-bottom: 1em;
  font-family: var(--yumincho);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.1em;
}
@media screen and (min-width: 1025px) {
  .effect_item_text {
    font-size: 18px;
  }
}

.about {
  position: relative;
  padding: 3rem 1rem;
  background: url(../img/bg-miyabun.svg) center right -100px/300px no-repeat;
}
@media screen and (min-width: 1025px) {
  .about {
    background: url(../img/bg-about.svg) center left -400px/50% no-repeat;
  }
}
.about_text {
  margin-top: 1em;
  font-size: 8px;
  line-height: 1.8;
  text-align: right;
}
@media screen and (min-width: 600px) {
  .about_text {
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .about_text {
    max-width: 1720px;
    margin: 1em auto;
    padding-left: 4rem;
    font-size: min(30px, 2vw);
  }
}
.about_text b {
  color: var(--color-primary);
  font-weight: normal;
}
.about_list {
  padding: 3rem 1rem 0;
}
@media screen and (min-width: 1025px) {
  .about_list {
    max-width: 1680px;
    margin: auto;
    padding: 3rem 3rem;
  }
}
.about_item {
  position: relative;
  padding: 2rem 0 0;
}
.about_item:not(:first-child) {
  margin-top: 3rem;
}
@media screen and (min-width: 1025px) {
  .about_item {
    display: grid;
    grid-template: "title title" auto "img text" auto/50% auto;
    gap: 2rem 5rem;
  }
  .about_item:nth-child(2n) {
    grid-template: "title title" auto "text img" auto/auto 50%;
  }
  .about_item:nth-child(2n) .about_item_title {
    justify-self: flex-end;
  }
}
.about_item_num {
  position: absolute;
  top: 0;
  left: -1rem;
}
@media screen and (min-width: 1025px) {
  .about_item_num {
    display: none;
  }
}
.about_item_num img {
  object-fit: contain;
}
.about_item_img {
  grid-area: img;
  align-items: center;
  width: 100%;
}
.about_item_img img {
  width: 100%;
}
@media screen and (min-width: 1025px) {
  .about_item_img img {
    box-shadow: 40px 45px 45px rgba(0, 0, 0, 0.1607843137);
  }
}
.about_item_title {
  grid-area: title;
  margin-top: 1.5em;
  font-size: 18px;
  font-weight: bold;
}
.about_item_title b {
  color: var(--color-primary);
}
@media screen and (min-width: 600px) {
  .about_item_title {
    font-size: 32px;
  }
}
@media screen and (min-width: 1025px) {
  .about_item_title {
    width: fit-content;
    background: linear-gradient(transparent 70%, #fff26f 70%);
    font-family: YuMincho, "Yu Mincho", serif;
    font-size: clamp(32px, 4vw, 58px);
    letter-spacing: 0.15em;
  }
}
.about_item_text {
  grid-area: text;
  margin-top: 1em;
  font-size: 10px;
  line-height: 2;
}
@media screen and (min-width: 600px) {
  .about_item_text {
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .about_item_text {
    align-self: center;
    font-size: 28px;
    letter-spacing: 0.1em;
  }
}

.guide {
  padding: 3rem 1rem;
}
@media screen and (min-width: 1025px) {
  .guide {
    background: url(../img/bg-guide.svg) right -200px center/50% no-repeat;
  }
}
.guide_text {
  margin-top: 1em;
  font-size: 8px;
  line-height: 1.8;
  text-align: right;
}
@media screen and (min-width: 600px) {
  .guide_text {
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .guide_text {
    max-width: 1720px;
    margin: 1em auto;
    padding-left: 4rem;
    font-size: min(30px, 2vw);
  }
}
.guide_text b {
  color: var(--color-primary);
  font-weight: normal;
}
.guide_list {
  margin-top: 4rem;
}
@media screen and (min-width: 1025px) {
  .guide_list {
    display: grid;
    grid-template: "first second" auto "third third" auto/auto auto;
    gap: 3rem;
    padding: 0 3rem;
  }
}
.guide_item {
  position: relative;
  padding: 0 1rem 1rem;
  background: #fff;
  border: 1px solid #ff7600;
}
@media screen and (min-width: 1025px) {
  .guide_item {
    background: rgba(255, 255, 255, 0.6);
  }
}
.guide_item:not(:first-child) {
  margin-top: 3rem;
}
.guide_item:first-child {
  grid-area: first;
  align-self: start;
}
.guide_item:nth-child(2) {
  grid-area: second;
}
@media screen and (min-width: 1025px) {
  .guide_item:nth-child(2) {
    margin-top: 8rem;
  }
}
.guide_item:nth-child(3) {
  grid-area: third;
}
.guide_item_title {
  width: 200px;
  margin: -1rem auto 0;
  padding: 0.5em;
  background: var(--color-primary);
  color: #fff;
  font-weight: bold;
  text-align: center;
}
@media screen and (min-width: 600px) {
  .guide_item_title {
    font-size: 24px;
  }
}
.guide_item_img {
  width: 100%;
  height: 120px;
  padding: 2rem 1rem;
}
@media screen and (min-width: 1025px) {
  .guide_item_img {
    height: 240px;
  }
}
.guide_item_img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.guide_item_text {
  padding-top: 1rem;
  border-top: 1px dashed #707070;
  font-size: 8px;
}
@media screen and (min-width: 600px) {
  .guide_item_text {
    font-size: 16px;
  }
}
.guide_item_note {
  width: fit-content;
  margin: auto;
  text-indent: -1em;
}
.guide_item_desc {
  margin-top: 1em;
  font-size: 8px;
  text-align: center;
}
.guide_item_desc b {
  color: var(--color-primary);
}
@media screen and (min-width: 600px) {
  .guide_item_desc {
    font-size: 16px;
  }
}

.order {
  padding: 3rem 1rem;
}
@media screen and (min-width: 1025px) {
  .order {
    background: url(../img/bg-order.svg) center left -200px/50% no-repeat;
    padding: 150px 1rem;
  }
}
.order_text {
  margin-top: 1em;
  font-size: 10px;
  line-height: 1.7;
  text-align: center;
}
.order_text b {
  color: #ff0000;
}
@media screen and (min-width: 600px) {
  .order_text {
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .order_text {
    font-size: min(2vw, 32px);
  }
}
.order_list {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: fit-content;
  margin: 4rem auto 0;
}
@media screen and (min-width: 1025px) {
  .order_list {
    margin-top: 232px;
  }
}
.order_item {
  display: inline-block;
  width: 180px;
  margin: auto;
  color: #000;
  font-family: Avenir, sans-serif;
  font-weight: bold;
  letter-spacing: 0.15em;
  text-decoration: none;
}
@media screen and (min-width: 1025px) {
  .order_item {
    width: 512px;
  }
}
.order_item:not(:first-child) {
  margin-top: 3rem;
}
@media screen and (min-width: 1025px) {
  .order_item:not(:first-child) {
    margin-top: 120px;
  }
}
.order_item_label {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.order_item_icon {
  width: 40px;
}
@media screen and (min-width: 1025px) {
  .order_item_icon {
    width: 112px;
  }
}
.order_item_icon img {
  width: 100%;
}
.order_item_num {
  font-size: 14px;
}
@media screen and (min-width: 1025px) {
  .order_item_num {
    font-size: 30px;
  }
}
.order_item_num b {
  font-size: 18px;
}
@media screen and (min-width: 1025px) {
  .order_item_num b {
    font-size: 51px;
  }
}
.order_item_price {
  font-size: 18px;
}
@media screen and (min-width: 1025px) {
  .order_item_price {
    font-size: 51px;
  }
}
.order_item_btn {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 32px;
  background: #fff;
  text-align: center;
  font-size: 10px;
  border: 3px solid var(--color-primary);
  border-radius: 3em;
  box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.2666666667);
  transition: background 0.3s, color 0.3s, font-size 0.3s;
}
@media screen and (min-width: 1025px) {
  .order_item_btn {
    height: 83px;
    font-size: 32px;
  }
}
.order_item_btn:hover {
  background: var(--color-primary);
  color: #fff;
}
@media screen and (min-width: 1025px) {
  .order_item_btn:hover {
    font-size: 36px;
  }
}

.colored {
  position: relative;
  background: linear-gradient(#fdd1b4, #ffa065);
  overflow: hidden;
}
.colored::before {
  content: "";
  position: absolute;
  bottom: -25vw;
  left: 0;
  width: 100%;
  height: 50vw;
  background: #f4f4f4;
  transform: skewY(20deg);
  z-index: 0;
}
@media screen and (min-width: 1025px) {
  .colored::before {
    display: none;
  }
}

.voice {
  padding: 3rem 1rem;
}
@media screen and (min-width: 1025px) {
  .voice {
    background: url(../img/bg-voice.svg) top 400px right -200px/40% no-repeat;
  }
}
.voice_text {
  margin-top: 1em;
  font-size: 8px;
  line-height: 1.8;
}
@media screen and (min-width: 600px) {
  .voice_text {
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .voice_text {
    max-width: 1720px;
    margin: 1em auto;
    padding-left: 4rem;
    font-size: min(30px, 2vw);
  }
}
.voice_text b {
  color: var(--color-primary);
  font-weight: normal;
}
.voice_list {
  margin-top: 3rem;
  padding: 0 1rem;
}
@media screen and (min-width: 1025px) {
  .voice_list {
    padding: 3rem;
  }
}
@media screen and (min-width: 1025px) {
  .voice_item {
    display: flex;
    align-items: end;
  }
}
@media screen and (min-width: 1025px) {
  .voice_item:nth-child(2n) {
    justify-content: end;
  }
}
.voice_item:nth-child(2n) .voice_item_text {
  background: url(../img/balloon-square-reverse.png) center/100% 100% no-repeat;
}
@media screen and (min-width: 1025px) {
  .voice_item:nth-child(2n) .voice_item_text {
    background: url(../img/balloon-oval-reverse.png) center/100% 100% no-repeat;
  }
}
.voice_item:nth-child(2n) .voice_item_person {
  margin: -1rem 2rem 0 auto;
}
@media screen and (min-width: 1025px) {
  .voice_item:nth-child(2n) .voice_item_person {
    margin: 0;
  }
}
.voice_item:not(:first-child) {
  margin-top: 3rem;
}
@media screen and (min-width: 1025px) {
  .voice_item:nth-child(2n+1) {
    flex-direction: row-reverse;
    justify-content: start;
  }
}
.voice_item_text {
  padding: 2em 1em 8em;
  background: url(../img/balloon-square.png) center/100% 100% no-repeat;
  font-size: 8px;
  line-height: 2;
}
@media screen and (min-width: 600px) {
  .voice_item_text {
    padding: 2em 2em 6em;
    font-size: 16px;
  }
}
@media screen and (min-width: 1025px) {
  .voice_item_text {
    flex: 0 0 720px;
    padding: 5em 5em 8em;
    background: url(../img/balloon-oval.png) center/100% 100% no-repeat;
  }
}
.voice_item_person {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: fit-content;
  margin: -1rem auto 0 2rem;
}
@media screen and (min-width: 1025px) {
  .voice_item_person {
    flex: 0 0 160px;
    margin: 0;
  }
}
.voice_item_icon {
  width: 50px;
}
@media screen and (min-width: 600px) {
  .voice_item_icon {
    width: 80px;
  }
}
.voice_item_icon img {
  width: 100%;
}
.voice_item_name {
  color: #fff;
  font-size: 14px;
}
@media screen and (min-width: 600px) {
  .voice_item_name {
    font-size: 20px;
  }
}

.question {
  position: relative;
  padding: 3rem 1rem;
}
@media screen and (min-width: 1025px) {
  .question {
    background: url(../img/bg-faq.svg) top 140px left -120px/25% no-repeat;
  }
}
.question_list {
  margin-top: 4rem;
}
@media screen and (min-width: 1025px) {
  .question_list {
    max-width: 1260px;
    margin: 6rem auto 0;
  }
}
.question_item:not(:first-child) {
  margin-top: 1rem;
}
@media screen and (min-width: 1025px) {
  .question_item:not(:first-child) {
    margin-top: 2rem;
  }
}
.question_item_q {
  display: flex;
  padding: 1em;
  background: #fff;
  font-size: 12px;
  transition: background 0.3s;
}
@media screen and (min-width: 600px) {
  .question_item_q {
    font-size: 20px;
  }
}
.question_item_q_text {
  margin-left: 1em;
  flex: 1;
}
.question_item_q_icon {
  height: 1.5em;
}
.question_item_q_icon img {
  height: 100%;
}

.question_item_a {
  display: flex;
  margin-top: 8px;
  padding: 0 1em;
  background: #fffcbe;
  font-size: 12px;
  line-height: 0;
  overflow: hidden;
  transition: padding 0.3s, line-height 0.3s;
}
@media screen and (min-width: 600px) {
  .question_item_a {
    font-size: 20px;
  }
}

.question_item_a_text {
  margin-left: 1em;
}

.question_item.is_open .question_item_q {
  background: #d3d3d3;
}
.question_item.is_open .question_item_a {
  padding: 1em;
  line-height: 1.5;
}

@media screen and (max-width: 768px) {
  .committed_text, p {
    font-size: 14px;
  }
  .point_item_title {
    margin: 10px 0;
  }
  .point_item_content {
    max-width: 90%;
  }
  .heading_jp {
    font-size: 9px;
  }
  .flow_text {
    margin-top: 4px;
    font-size: 12px;
  }
  .flow_list {
    padding: 0;
  }
  .flow_item_text {
    font-size: 12px;
  }
  .flow_note {
    margin-top: 10px;
  }
  .effect_item_text {
    font-size: 12px;
  }
  .about_text, .guide_te, .guide_text {
    margin-top: 6px;
    font-size: 10px;
  }
  .about_item_text {
    font-size: 14px;
  }
  .about_list {
    padding: 0;
  }
  .guide_item_note {
    font-size: 14px;
    padding: 0 10px;
  }
  .guide_item_desc {
    font-size: 12px;
  }
  .voice_text {
    margin-top: 6px;
    font-size: 12px;
  }
  .voice_item_text {
    font-size: 12px;
  }
}
.fixed-purchase-btn {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.7);
  padding: 20px 0;
  z-index: 999;
  display: flex;
  justify-content: center;
}
.fixed-purchase-btn__link {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: #ffa921;
  border: 3px solid #ffffff;
  border-radius: 25px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  text-decoration: none;
  transition: all 0.3s ease;
}
.fixed-purchase-btn__link:hover {
  background: #ff9500;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
}
@media screen and (min-width: 1025px) {
  .fixed-purchase-btn__link {
    padding: 16px 32px;
    gap: 12px;
  }
}
.fixed-purchase-btn__text {
  color: #ffffff;
  font-size: 14px;
  font-weight: bold;
  font-family: var(--yumincho);
  letter-spacing: 0.1em;
  white-space: nowrap;
}
@media screen and (min-width: 1025px) {
  .fixed-purchase-btn__text {
    font-size: 18px;
  }
}
.fixed-purchase-btn__icon {
  height: 20px;
}
@media screen and (min-width: 1025px) {
  .fixed-purchase-btn__icon {
    height: 24px;
  }
}
.fixed-purchase-btn__icon img {
  height: 100%;
  filter: brightness(0) invert(1);
}
.fixed-purchase-btn .fixed-purchase-btn__right {
  display: none;
}
@media screen and (max-width: 768px) {
  .fixed-purchase-btn {
    padding: 8px 4px 4px 4px;
    background: #e94919;
    width: 100%;
  }
  .fixed-purchase-btn__icon {
    height: 14px;
  }
  .fixed-purchase-btn__link {
    border: 0;
    border-radius: inherit;
    width: fit-content;
    padding: 20px;
    display: flex;
    background: none;
    box-shadow: none;
  }
  .fixed-purchase-btn__text {
    font-family: sans-serif;
    font-size: 15px;
  }
  .fixed-purchase-btn .fixed-purchase-btn__right {
    display: block;
  }
  .fixed-purchase-btn .fixed-purchase-btn__right-price {
    color: #f5ff1a;
    margin-bottom: 4px;
    font-size: 11px;
  }
  .fixed-purchase-btn .fixed-purchase-btn__right-shipping {
    color: white;
    padding: 5px 0px;
    border: 1px solid white;
    border-radius: 8px;
    font-size: 13px;
    text-align: center;
  }
}

.btn,
a.btn,
button.btn {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  user-select: none;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}

.btn-wrap {
  margin: 30px 0;
  text-align: center;
}

a.btn-c {
  font-size: 24px;
  position: relative;
  padding: 26px 0 20px !important;
  width: 100%;
  color: #fff;
  background: #e94919;
  box-shadow: 0 5px 0 #d44114;
}
@media screen and (min-width: 1025px) {
  a.btn-c {
    font-size: 24px;
    padding: 22px 90px 20px 90px;
  }
}

a.btn-c span {
  font-size: 14px;
  position: absolute;
  top: -1.25rem;
  left: calc(50% - 150px);
  display: block;
  width: 300px;
  padding: 0.2rem 0;
  color: #d44114;
  border: 2px solid #d44114;
  border-radius: 100vh;
  background: #fff;
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
}
@media screen and (min-width: 1025px) {
  a.btn-c span {
    font-size: 14px;
    width: 350px;
    left: calc(50% - 175px);
  }
}

a.btn-c span:before,
a.btn-c span:after {
  position: absolute;
  left: calc(50% - 10px);
  content: "";
}

a.btn-c span:before {
  bottom: -10px;
  border-width: 10px 10px 0 10px;
  border-style: solid;
  border-color: #d44114 transparent transparent transparent;
}

a.btn-c span:after {
  bottom: -7px;
  border-width: 10px 10px 0 10px;
  border-style: solid;
  border-color: #fff transparent transparent transparent;
}

a.btn-c i {
  margin-right: 1rem;
  font-size: 1.4rem;
}
@media screen and (min-width: 1025px) {
  a.btn-c i {
    font-size: 1.6rem;
  }
}

a.btn-c:hover {
  transform: translate(0, 3px);
  color: #fff;
  background: #eb5b30;
  box-shadow: 0 2px 0 #d44114;
}

.fade-in {
  opacity: 0;
}

.fade-in.js_show {
  animation: fadeIn 1s forwards;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fade-down {
  opacity: 0;
  transform: translate(0, -100px);
}

.fade-down.js_show {
  animation: fadeDown 1s forwards;
}

@keyframes fadeDown {
  from {
    opacity: 0;
    transform: translate(0, -100px);
  }
  to {
    opacity: 1;
    transform: translate(0, 0);
  }
}
.fade-up {
  opacity: 0;
  transform: translate(0, 100px);
}

.fade-up.js_show {
  animation: fadeUp 1s forwards;
}

@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translate(0, 100px);
  }
  to {
    opacity: 1;
    transform: translate(0, 0);
  }
}
.fade-fromL {
  opacity: 0;
  transform: translate(-100px, 0);
}

.fade-fromL.js_show {
  animation: fadeFromL 1s forwards;
}

@keyframes fadeFromL {
  from {
    opacity: 0;
    transform: translate(-100px, 0);
  }
  to {
    opacity: 1;
    transform: translate(0, 0);
  }
}
.fade-fromR {
  opacity: 0;
  transform: translate(100px, 0);
}

.fade-fromR.js_show {
  animation: fadeFromR 1s forwards;
}

@keyframes fadeFromR {
  from {
    opacity: 0;
    transform: translate(100px, 0);
  }
  to {
    opacity: 1;
    transform: translate(0, 0);
  }
}

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