@charset "UTF-8";
html {
  font-size: 62.5%;
  height: 100vh;
  overscroll-behavior: none;
  overflow: hidden;
}

body {
  font-family: "Noto Sans JP", "游ゴシック", Yu Gothic, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, "sans-serif";
  font-size: 1.1666vw;
}
@media (max-width: 765px) {
  body {
    font-size: 3.5vw;
  }
}
body {
  font-weight: 400;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  line-height: 1.65;
}

*,
*:after,
*:before {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: inherit;
}

/* ブラウザ標準フォントを持つ要素を明示的にリセット */
button,
input,
select,
textarea {
  font-family: inherit;
}

/* 等幅系タグもリセット */
code,
pre,
kbd,
samp {
  font-family: inherit;
}

a {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

img {
  width: 100%;
  height: auto;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
}

li {
  list-style-type: none;
}

.mobile-none {
  display: inline-block;
}

.catch {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-top: 0.8em;
  z-index: 1000;
  pointer-events: none;
}
.catch img {
  width: 30%;
  height: auto;
  display: block;
}
.catch p {
  text-align: center;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .catch p {
    font-size: 3.9vw;
  }
}
.catch p {
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: 0.1em;
  text-shadow: 0 0 8px rgb(255, 255, 255), 0 0 16px rgba(255, 255, 255, 0.9), 0 0 18px rgba(255, 255, 255, 0.8), 0 0 28px rgba(255, 255, 255, 0.7), 0 0 40px rgba(255, 255, 255, 0.6);
}

.hero {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  scroll-snap-align: start;
}
.hero .hero-grid {
  transform: scale(4.5) rotate(-35deg);
}
.hero.pause-max .hero-grid {
  transform: scale(4.5) rotate(-35deg);
}
.hero.phase-1 .hero-grid {
  transform: scale(2.4) rotate(-20deg);
}
.hero.phase-3 .hero-grid {
  transform: scale(1.8) rotate(-15deg);
}
.hero.phase-4 .hero-grid {
  transform: scale(1) rotate(0deg);
}
.hero.disperse .glass.hide {
  opacity: 0;
  transform: scale(0.3);
}

.hero-grid {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 30px;
  justify-items: center;
  align-items: center;
  transform-origin: center center;
  transition: transform 1s ease-out;
}

.glass {
  width: 140px;
  height: 68px;
  background-size: 100% auto;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.55s ease-out, transform 0.55s ease-out;
}
.glass img {
  width: 70%;
}

.mobile-menu {
  display: none;
}

.hamburger {
  display: none;
}

.content {
  min-height: 100svh;
  scroll-snap-align: start;
  padding-top: 14%;
}

.wrapper {
  scroll-snap-type: y mandatory;
  height: 100dvh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.site-header {
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.9) 40%, rgba(255, 255, 255, 0)) 100%;
  z-index: 1100;
  pointer-events: none;
}
.site-header .mobile-header-line {
  display: none;
}
.site-header .header-top {
  background-color: #0d3581;
  color: #fff;
  pointer-events: all;
}
.site-header .header-top .header-inner .nav-top {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.6em;
}
.site-header .header-top .header-inner .nav-top ul {
  width: 72%;
  display: flex;
  justify-content: space-between;
}
.site-header .header-top .header-inner .nav-top ul li {
  flex: 1;
  text-align: center;
}
.site-header .header-top .header-inner .nav-top ul li.contact a {
  background-color: #007f41;
}
.site-header .header-top .header-inner .nav-top ul a {
  display: block;
  padding: 0.8em 0;
}
.site-header .header-bottom {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  pointer-events: all;
}
.site-header .header-bottom .logo {
  width: 17%;
  line-height: 1;
  margin-left: 2.5%;
}
.site-header .header-bottom .nav-bottom {
  width: 72%;
}
.site-header .header-bottom .nav-bottom ul {
  width: 100%;
  display: flex;
  justify-content: space-between;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .site-header .header-bottom .nav-bottom ul {
    font-size: 3.9vw;
  }
}
.site-header .header-bottom .nav-bottom ul li {
  flex: 1;
  text-align: center;
  border-left: 1px solid #0d3581;
}
.site-header .header-bottom .nav-bottom ul li a {
  display: block;
  padding: 0.6em;
  color: #0d3581;
  text-decoration: none;
  font-weight: 600;
}
.site-header .sns-wrap {
  display: flex;
  justify-content: flex-end;
  pointer-events: all;
}
.site-header .sns-btn {
  display: flex;
  justify-content: space-between;
  width: 9%;
  margin: 0.8em 2.2em 0 0;
}
.site-header .sns-btn .sns-icon {
  width: 22%;
  line-height: 1;
}

/* ===========================
   スライダー全体構成
   =========================== */
.slider {
  overflow-x: hidden;
  position: relative;
}
.slider .slider-track {
  display: flex;
  gap: 1.5em;
  will-change: transform;
  transform: translate3d(0, 0, 0);
}
.slider .slide {
  flex: 0 0 26%;
}
.slider .slide img {
  display: block;
  aspect-ratio: 1/1;
  -o-object-fit: cover;
     object-fit: cover;
}
.slider .slide:not([data-ready=true]) .slider-track {
  visibility: hidden;
}
.slider .slider-dots {
  display: flex;
  justify-content: center;
  gap: 1.8em;
  margin: 1.2em 0 0.5em;
}
.slider .slider-dots button {
  width: 0.6em;
  height: 0.6em;
  border-radius: 50%;
  border: none;
  background: #ccc;
  cursor: pointer;
}
.slider .slider-dots button.active {
  background: #000;
}

h1 {
  font-size: 4.5vw;
}
@media (max-width: 765px) {
  h1 {
    font-size: 8.4vw;
  }
}
h1 {
  font-weight: 800;
  color: #0d3581;
  letter-spacing: 0;
  line-height: 1;
  position: relative;
  z-index: 1;
}
h1 span {
  color: #007f41;
}

.h1-hidden {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.h1-rubi {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .h1-rubi {
    font-size: 3.9vw;
  }
}
.h1-rubi {
  font-weight: 600;
  color: #0d3581;
  position: relative;
  z-index: 1;
}

h2 {
  font-size: 2.6666vw;
}
@media (max-width: 765px) {
  h2 {
    font-size: 6vw;
  }
}
h2 {
  font-weight: 800;
  color: #0d3581;
  letter-spacing: 0.1em;
  line-height: 1;
}
h2 span {
  color: #007f41;
}

.bg-sho h2 {
  width: 50%;
  margin: 1em auto;
  transform: translateX(-0.5em);
}

.product-catch {
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .product-catch {
    font-size: 5.1vw;
  }
}
.product-catch {
  font-weight: 600;
  letter-spacing: 0.7em;
  text-align: center;
  font-family: "Noto Serif JP", serif;
}

.product-main-image {
  width: 100%;
  margin-bottom: 5em;
}

.page-content {
  width: 100%;
  position: relative;
  z-index: 1;
}

.switch-box {
  width: 18%;
  position: absolute;
  top: 6.5em;
  right: 2.5em;
  transition: color 0.3s ease, opacity 0.4s ease, transform 0.4s ease;
  z-index: 1200;
  opacity: 1;
  transform: translateY(0);
}
.switch-box p {
  text-align: center;
  color: #0d3581;
  margin-bottom: 0.2em;
  font-weight: 500;
}
.switch-box.fixed {
  position: fixed;
  top: 11em;
  opacity: 1;
  transform: translateY(0);
}
.switch-box.fadeout {
  position: fixed;
  top: 11em;
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
}

.exxe {
  opacity: 1;
}
.exxe .switch-box {
  opacity: 0;
  pointer-events: none;
}
.exxe .switch-box.gate-hide {
  opacity: 0;
  transform: translateY(-10px);
  pointer-events: none;
}
.exxe .switch-box.gate-show {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.switch-btn {
  width: 100%;
  display: inline-flex;
  overflow: hidden;
}
.switch-btn .btn {
  width: 50%;
  position: relative;
  padding: 0.5em 0;
  color: #0d3581;
  font-size: 1vw;
}
@media (max-width: 765px) {
  .switch-btn .btn {
    font-size: 2.8vw;
  }
}
.switch-btn .btn {
  font-weight: 500;
  letter-spacing: 0.1em;
  border: 1px solid #0d3581;
  cursor: pointer;
  z-index: 2;
  transition: color 0.3s;
  background-color: #fff;
}
.switch-btn .btn.active {
  color: #fff;
  background-color: #0d3581;
}
.switch-btn .btn .switch-btn .slide-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  transition: transform 0.3s ease;
  z-index: 1;
}

.switch-btn[data-mode=side] .slide-bg {
  transform: translateX(100%);
}

.exxe-switch p {
  color: #000;
}
.exxe-switch .switch-btn {
  width: 100%;
  display: inline-flex;
  overflow: hidden;
}
.exxe-switch .switch-btn .btn {
  width: 50%;
  position: relative;
  padding: 0.5em 0;
  color: #000;
  font-size: 1vw;
}
@media (max-width: 765px) {
  .exxe-switch .switch-btn .btn {
    font-size: 2.8vw;
  }
}
.exxe-switch .switch-btn .btn {
  font-weight: 500;
  letter-spacing: 0.1em;
  border: 1px solid #000;
  cursor: pointer;
  z-index: 2;
  transition: color 0.3s;
  background-color: #fff;
}
.exxe-switch .switch-btn .btn.active {
  color: #fff;
  background-color: #000;
}

.content-900 {
  width: 100%;
  padding: 0 12% 6em;
}
.content-900.bg-1 {
  background-color: #eae5da;
  position: relative;
}
.content-900.bg-1::before {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: -1px;
  padding: 11em 0;
  background-image: url(../image/bg-01.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top;
  pointer-events: none;
}
.content-900.bg-2 {
  background-color: #d4e0e6;
  position: relative;
}
.content-900.bg-2::before {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: -1px;
  padding: 11em 0;
  background-image: url(../image/bg-01.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top;
  pointer-events: none;
}

.content-900-long {
  width: 100%;
  padding: 0 12% 10em;
}
.content-900-long.bg-1 {
  background: #eae5da;
  position: relative;
  width: 100%;
}
.content-900-long.bg-1::before {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: -1px;
  padding: 11em 0;
  background-image: url(../image/bg-01.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top;
  pointer-events: none;
}
.content-900-long.bg-exxe {
  background-color: #eae5da;
  position: relative;
  background-image: url(../image/exxe-bg.webp);
  background-repeat: no-repeat;
  background-size: contain;
}
.content-900-long.bg-exxe::before {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: -1px;
  padding: 11em 0;
  background-image: url(../image/bg-01.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top;
  pointer-events: none;
}
.content-900-long.bg-sho {
  background: #d4e0e6;
  position: relative;
  width: 100%;
}
.content-900-long.bg-sho::before {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: -1px;
  padding: 11em 0;
  background-image: url(../image/bg-01.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top;
  pointer-events: none;
}

.content-900-short {
  width: 100%;
  padding: 0 12% 2em;
}

.content-900-veryshort {
  width: 100%;
  padding: 0 12% 0;
}

.content-1000 {
  width: 100%;
  padding: 0 8% 6.5em;
}
.content-1000.bg-1 {
  background: #eae5da;
  position: relative;
}
.content-1000.bg-1::before {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: -1px;
  padding: 11em 0;
  background-image: url(../image/bg-01.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top;
  pointer-events: none;
}
.content-1000.bg-2 {
  background: #d4e0e6;
  position: relative;
}
.content-1000.bg-2::before {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: -1px;
  padding: 11em 0;
  background-image: url(../image/bg-01.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top;
  pointer-events: none;
}

.content-1000-long {
  width: 100%;
  padding: 0 8% 9em;
}
.content-1000-long.bg-3 {
  background: #fff;
  position: relative;
}
.content-1000-long.bg-3::before {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: -1px;
  padding: 11em 0;
  background-image: url(../image/bg-02.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top;
  pointer-events: none;
}

.content-1000-short {
  width: 100%;
  padding: 0 8% 3em;
}
.content-1000-short.bg-company {
  position: relative;
  background-image: url(../image/about-us-img.webp);
  background-repeat: no-repeat;
  background-size: cover;
}
.content-1000-short.bg-company::before {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: -1px;
  padding: 11em 0;
  background-image: url(../image/bg-01.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top;
  pointer-events: none;
}
.content-1000-short.bg-4 {
  position: relative;
  background-image: url(../image/shop-map-bg.webp);
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}
.content-1000-short.bg-4::before {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: -1px;
  padding: 11em 0;
  background-image: url(../image/bg-03.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top;
  pointer-events: none;
}
.content-1000-short.bg-5 {
  background-color: #eae9ed;
}
.content-1000-short.bg-7 {
  position: relative;
  background-color: #d4e0e6;
  background-repeat: no-repeat;
  background-size: cover;
}
.content-1000-short.bg-7::before {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: -1px;
  padding: 11em 0;
  background-image: url(../image/bg-03.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top;
  pointer-events: none;
}

.content-1000-veryshort {
  padding: 0 8%;
}
.content-1000-veryshort .breadcrumb.top-padding {
  padding: 3em 0 1em;
}
.content-1000-veryshort.bg-1 {
  background: #eae5da;
  position: relative;
}
.content-1000-veryshort.bg-1::before {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: -1px;
  padding: 11em 0;
  background-image: url(../image/bg-01.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top;
  pointer-events: none;
}

.content-max {
  width: 100%;
}
.content-max.bg-2 {
  background-color: #d4e0e6;
  position: relative;
}
.content-max.bg-2::before {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: -1px;
  padding: 11em 0;
  background-image: url(../image/bg-01.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top;
}
.content-max.bg-5 {
  background-color: #eae9ed;
}
.content-max.bg-6 {
  background-color: #bdd0da;
}

.three-point {
  width: 100%;
  padding-top: 18%;
  margin-bottom: 2em;
}
.three-point h2 {
  width: 35%;
}

.three-point-box {
  display: flex;
  justify-content: space-between;
}

.three-point-brock {
  width: 31%;
  display: flex;
  flex-direction: column;
  margin-top: 0.5em;
}
.three-point-brock h3 {
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .three-point-brock h3 {
    font-size: 5.1vw;
  }
}
.three-point-brock h3 {
  font-weight: 700;
  margin-top: 0.5em;
}
.three-point-brock p {
  text-align: justify;
}

.more-btn {
  width: 20%;
  text-align: center;
  margin: auto;
  font-weight: 600;
  color: #fff;
  border-radius: 9999px;
}
.more-btn a {
  display: block;
  padding: 1em 0;
}
@media screen and (min-width: 781px) {
  .more-btn::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--color);
    transform: scaleX(0);
    transform-origin: right top;
    transition: transform 0.5s ease;
    mix-blend-mode: overlay;
    z-index: -1;
    opacity: 0.3;
  }
  .more-btn:hover::before {
    transform-origin: left top;
    transform: scaleX(1);
    opacity: 0.5;
  }
}

.link-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 1.2em 0.8em;
  justify-content: center;
  margin: 7em 0 3em;
}

.menu-item {
  display: block;
  width: 20%;
  padding: 1.6em 0;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .menu-item {
    font-size: 3.9vw;
  }
}
.menu-item {
  font-weight: 700;
  text-align: center;
  border-radius: 9999px;
}

.more-color {
  --color: #4b6cb3;
  background: #4b6cb3;
}

.color-1 {
  --color: #86b3e0;
  background: #86b3e0;
}

.color-2 {
  --color: #c7b6d2;
  background: #c7b6d2;
}

.color-3 {
  --color: #95cbc6;
  background: #95cbc6;
}

.color-4 {
  --color: #b9b475;
  background: #b9b475;
}

.color-5 {
  --color: #c6beb6;
  background: #c6beb6;
}

.color-6 {
  --color: #acc1cb;
  background: #acc1cb;
}

.color-7 {
  --color: #b9b9bf;
  background: #b9b9bf;
}

.color-8 {
  --color: #d6a8ad;
  background: #d6a8ad;
}

.color-red {
  background: #c8161d;
}

.color-blue {
  background: #0d3581;
}

.color-black {
  background: #000;
}

.color-gray {
  background: #eae9ed;
}

@media (min-width: 781px) {
  .color-box {
    position: relative;
    display: block;
    overflow: hidden;
    z-index: 0;
    transition: color 0.3s ease;
  }
  .color-box::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--color);
    transform: scaleX(0);
    transform-origin: right top;
    transition: transform 0.3s ease;
    mix-blend-mode: multiply;
    z-index: -1;
    opacity: 0.3;
  }
  .color-box:hover::before {
    transform-origin: left top;
    transform: scaleX(1);
    opacity: 0.5;
  }
}
.active-color {
  background-color: #0d3581;
  color: #fff;
}

.item-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  row-gap: 3em;
  -moz-column-gap: 5em;
       column-gap: 5em;
  margin: 2em auto;
}
.item-grid .item {
  background: #fff;
  position: relative;
  line-height: 1;
  border-top: 1px solid #000;
}
.item-grid .item .brand {
  position: absolute;
  width: 28%;
  top: 1.5em;
  left: 0;
}
.item-grid .top-product-details {
  position: absolute;
  bottom: 1.5em;
  left: 0;
  line-height: 1.3;
}
.item-grid .top-product-details span.price {
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .item-grid .top-product-details span.price {
    font-size: 4.4vw;
  }
}
.item-grid .top-product-details span.tax {
  font-size: 0.8333vw;
}
@media (max-width: 765px) {
  .item-grid .top-product-details span.tax {
    font-size: 2.3vw;
  }
}

.top-lens-title {
  display: flex;
  align-items: center;
  padding-top: 6em;
}
.top-lens-title p {
  margin-left: 1em;
}

.bg-color-1 {
  background-color: #eae5da;
}

.bg-color-2 {
  background-color: #d4e0e6;
}

.top-lens-box {
  display: flex;
  justify-content: space-between;
  margin: 1.2em 0 2em;
}

.top-lens-brock {
  width: 14.5%;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 9999px;
  color: #0d3581;
  background-color: #fff;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .top-lens-brock {
    font-size: 3.9vw;
  }
}
.top-lens-brock {
  font-weight: 600;
  padding: 2em 0;
}
.top-lens-brock .icon-box {
  width: 70%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.top-lens-brock .text-box {
  height: 5em;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
}

:root {
  --title-left: 12.5vw;
  --title-size: 17vw;
  --title-gap: 1.25vw;
  --slider-h: 17vw;
  --gap: 1.25vw;
}

.topics-slider-wrapper {
  position: relative;
  width: 100%;
  height: var(--slider-h);
  background-color: #eae5da;
  padding-top: 28em;
  overflow: hidden;
}

.topics-title {
  position: absolute;
  top: 50%;
  left: var(--title-left);
  transform: translateY(-50%);
  width: var(--title-size);
  height: var(--slider-h);
  color: #fff;
  background-color: #0d3581;
  display: grid;
  place-items: center;
  font-size: 2vw;
}
@media (max-width: 765px) {
  .topics-title {
    font-size: 5.6vw;
  }
}
.topics-title {
  font-weight: 700;
  border-radius: 0.7em;
  letter-spacing: 0.18em;
  z-index: 10;
}

.topics-slider {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  height: var(--slider-h);
  overflow: hidden;
}

.topics-slider-left {
  left: -20.4vw;
  width: 32%;
  transform: translateY(-50%);
}

.topics-slider-right {
  left: calc(var(--title-left) + var(--title-size) + var(--title-gap));
}
.topics-slider-right .topics-track {
  transform: translateX(5%);
}

.topics-track {
  display: flex;
  will-change: transform;
}

.topics-slide {
  flex: 0 0 auto;
  height: var(--slider-h);
  margin-right: var(--gap);
}
.topics-slide img {
  display: block;
  height: 100%;
  width: auto;
}

.info-wrapper {
  display: flex;
  justify-content: space-between;
  margin: 3em 0 1.5em;
}
.info-wrapper h2 {
  font-size: 2.5vw;
}
@media (max-width: 765px) {
  .info-wrapper h2 {
    font-size: 6vw;
  }
}
.info-wrapper h2 {
  line-height: 1;
}
.info-wrapper .deco-line {
  width: 100%;
  margin-top: 0.8em;
}

.page-info-title {
  display: flex;
  flex-direction: column;
}

.info-box {
  width: 80%;
}
.info-box ul {
  border-top: 1px solid #0d3581;
}
.info-box li {
  display: flex;
  border-bottom: 1px solid #0d3581;
  padding: 2em 0;
}
.info-box li .data {
  display: inline-block;
  width: 18%;
  color: #0d3581;
  padding-left: 0.5em;
  font-weight: 500;
}
.info-box li .article {
  display: flex;
  flex-direction: column;
  width: 82%;
}
.info-box li .title {
  width: 100%;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .info-box li .title {
    font-size: 3.9vw;
  }
}
.info-box li .title {
  font-weight: 500;
}
.info-box li a {
  display: block;
  width: 100%;
}

.top-shop-wrap {
  display: flex;
}

.top-shop-img {
  width: 50%;
  line-height: 0;
}

.top-shop-box {
  width: 50%;
  padding: 16em 0 0 4em;
}
.top-shop-box h2 {
  font-size: 2.5vw;
}
@media (max-width: 765px) {
  .top-shop-box h2 {
    font-size: 6vw;
  }
}
.top-shop-box h2 {
  line-height: 1;
}
.top-shop-box p {
  margin-top: 0.5em;
}
.top-shop-box .arrow {
  position: relative;
  display: inline-block;
  width: 36%;
  height: 1.5px;
  border-radius: 9999px;
  background-color: #0d3581;
  transform: translateY(-0.5em);
}
.top-shop-box .arrow::before {
  content: "";
  position: absolute;
  top: calc(50% - 1px);
  right: 0;
  width: 1.5em;
  height: 1.5px;
  border-radius: 9999px;
  background-color: #0d3581;
  transform: rotate(36deg);
  transform-origin: calc(100% - 1px) 50%;
}

.shop-btn {
  display: block;
  margin-top: 3em;
  font-weight: 600;
  color: #0d3581;
}

footer {
  padding: 5em 4% 3em;
  background-color: #0d3581;
  color: #fff;
}

.footer-in {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.footer-left {
  width: 60%;
  display: flex;
}

.footer-logo {
  width: 24%;
}

.footer-nav {
  width: 62%;
  display: flex;
  margin-left: 2em;
}
.footer-nav ul {
  width: 33.333%;
  padding-left: 1em;
  border-left: 1px solid #fff;
  line-height: 2;
  letter-spacing: 0.2em;
}
.footer-nav li:not(:first-child) {
  font-size: 95%;
}

.main-category {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .main-category {
    font-size: 3.9vw;
  }
}
.main-category {
  font-weight: 700;
}

.footer-right {
  width: 35%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.footer-right-in {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.footer-sns {
  width: 50%;
  display: flex;
  padding: 1em 0;
  justify-content: flex-end;
}
.footer-sns a {
  width: 12.5%;
  line-height: 1;
  margin-right: 1.2em;
}

#footer-contact-box {
  width: 50%;
  display: flex;
  justify-content: center;
  flex-direction: column;
}
#footer-contact-box .contact {
  width: 100%;
  background-color: #007f41;
  border-radius: 9999px;
  text-align: center;
  font-weight: 600;
}
#footer-contact-box .contact a {
  display: block;
  padding: 1em 0;
}

.privacypolicy {
  text-align: center;
  font-size: 1vw;
}
@media (max-width: 765px) {
  .privacypolicy {
    font-size: 2.8vw;
  }
}
.privacypolicy {
  letter-spacing: 0.2em;
  margin-top: 0.6em;
}

#copyright {
  text-align: right;
  font-size: 1vw;
}
@media (max-width: 765px) {
  #copyright {
    font-size: 2.8vw;
  }
}
#copyright {
  letter-spacing: 0.15em;
  white-space: nowrap;
}

/* パンくずリスト */
.breadcrumb {
  padding-top: 4.6em;
  position: relative;
  z-index: 1;
}
.breadcrumb li {
  display: inline;
  color: #4b6cb3;
  font-size: 1.1vw;
}
.breadcrumb li::after {
  content: "＞";
  padding: 0 0.2em;
}
.breadcrumb li:last-child {
  color: #0d3581;
}
.breadcrumb li:last-child::after {
  content: "";
}
.breadcrumb li a {
  transition: all 0.5s ease;
}
@media (min-width: 781px) {
  .breadcrumb li a:hover {
    color: #000;
    transition: all 0.5s ease;
  }
}
.breadcrumb.exxe li {
  color: #fff;
}
.breadcrumb.exxe li:last-child {
  color: #fff;
}
.breadcrumb.exxe li:last-child::after {
  content: "";
}

.glasses-btn {
  display: grid;
  width: 52%;
  text-align: center;
  font-weight: 500;
  margin-top: 1.5em;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.8em;
}
.glasses-btn a {
  display: block;
  width: 100%;
  padding: 0.8em 0;
  border-radius: 9999px;
}

.nihonme-glasses-btn {
  display: grid;
  width: 64%;
  text-align: center;
  font-weight: 500;
  margin: 2.5em 0 7em;
  grid-template-columns: repeat(4, 1fr);
  gap: 1em;
}
.nihonme-glasses-btn a {
  display: block;
  width: 100%;
  padding: 0.8em 0;
  border-radius: 9999px;
}

.page-wrap {
  margin-top: 4.2em;
}
.page-wrap h2 {
  text-align: center;
  line-height: 1.3em;
}

.page-wrap-1 {
  margin-top: 5.3em;
}

.page-wrap-2 {
  margin-top: 1em;
}

.page-wrap-3 {
  padding-top: 15em;
}
.page-wrap-3 h2 {
  font-size: 3.1666vw;
}
@media (max-width: 765px) {
  .page-wrap-3 h2 {
    font-size: 7vw;
  }
}

.deco-line {
  display: flex;
  width: 12.5%;
  height: 0.5em;
  margin: 0.6em 0;
  position: relative;
  z-index: 1;
}

.deco-line-pp {
  display: flex;
  width: 9%;
  height: 0.4em;
  margin-bottom: 0.4em;
  position: relative;
  z-index: 1;
}

.blue-line {
  display: block;
  width: 50%;
  background-color: #0d3581;
}

.green-line {
  display: block;
  width: 50%;
  background-color: #007f41;
}

.glasses-catch {
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-weight: 600;
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .glasses-catch {
    font-size: 4.4vw;
  }
}
.glasses-catch {
  letter-spacing: 0.2em;
  color: #0d3581;
}

.glasses-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5em;
  margin-top: 1.2em;
}
.glasses-list .item {
  background: #fff;
  position: relative;
  line-height: 1;
  aspect-ratio: 29/24;
}
.glasses-list .item .brand {
  position: absolute;
  width: 28%;
  top: 1.5em;
  left: 2em;
}
.glasses-list .item .mij-icon {
  position: absolute;
  width: 32%;
  bottom: 1.5em;
  right: 1.5em;
}
.glasses-list .sunglass-title {
  grid-column: 1/-1;
  margin: 2em 0 0.5em;
  text-align: center;
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  .glasses-list .sunglass-title {
    font-size: 6vw;
  }
}
.glasses-list .sunglass-title {
  font-weight: 800;
  letter-spacing: 0.2em;
}
.glasses-list .product-details-1 {
  position: absolute;
  bottom: 1.5em;
  left: 1.5em;
  line-height: 1.3;
}
.glasses-list .product-details-1 span.price {
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .glasses-list .product-details-1 span.price {
    font-size: 4.4vw;
  }
}
.glasses-list .product-details-1 span.tax {
  font-size: 0.8333vw;
}
@media (max-width: 765px) {
  .glasses-list .product-details-1 span.tax {
    font-size: 2.3vw;
  }
}

.exxe-banner {
  width: 100%;
  padding: 0 4%;
  background-image: url(../image/exxe-banner-bg.webp);
  background-size: cover;
  background-position: center;
  position: relative;
}
.exxe-banner .banner-btn {
  color: #fff;
  background-color: #000;
}

.banner-btn {
  position: absolute;
  bottom: 2.2em;
  right: 4%;
  width: 16.1%;
  border-radius: 9999px;
  text-align: center;
  font-weight: 600;
}
.banner-btn a {
  display: block;
  padding: 1em 0;
}

.exxe-banner-img {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: auto;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: 1;
}

.exxe-banner-wrap {
  width: 58%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2em 0;
  margin: 0 auto;
}

.exxe-logo {
  width: 25%;
  line-height: 0;
}

.exxe-catch {
  width: 34.5%;
}

.nihonmehangaku-banner {
  width: 100%;
  padding: 3%;
  background-color: #c8161d;
  position: relative;
}
.nihonmehangaku-banner .banner-btn {
  color: #c8161d;
  background-color: #d9bd52;
}

.nihonmehangaku-img {
  width: 40%;
  margin: 0 auto;
}

.page-nihonmehangaku-wrap {
  width: 100%;
  padding: 5% 0;
  background-color: #c8161d;
  position: relative;
}

.page-nihonme-caption {
  width: 25%;
  position: absolute;
  bottom: -1.3em;
  left: 50%;
  transform: translateX(-50%);
  padding: 0.8em 0;
  background-color: #ffe100;
  text-align: center;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .page-nihonme-caption {
    font-size: 3.9vw;
  }
}
.page-nihonme-caption {
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.1em;
  border-radius: 9999px;
}

.nihonmehangaku-page-title {
  width: 48%;
  margin: 0 auto;
}

.page-nihonmehangaku-content {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding-top: 3.5em;
  background-color: #d4e0e6;
}
.page-nihonmehangaku-content ul {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .page-nihonmehangaku-content ul {
    font-size: 3.9vw;
  }
}
.page-nihonmehangaku-content ul {
  font-weight: 500;
  padding-bottom: 2em;
}

.page-nihonmehangaku-box {
  width: 64%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2.5em 2.5em 1.8em;
  background-color: #fff;
  margin-bottom: 2.5em;
  border-radius: 0.7em;
  position: relative;
}
.page-nihonmehangaku-box .plus {
  width: 6%;
}

.example-icon {
  width: 6%;
  position: absolute;
  top: -1.6em;
  left: 1em;
}

.page-nihonmehangaku-img {
  width: 43%;
  line-height: 1;
}

.kids-banner {
  width: 100%;
  padding: 1.6em 4% 2.4em;
  background-color: #679944;
  text-align: center;
  position: relative;
}
.kids-banner .banner-btn {
  color: #fff;
  background-color: #0d3581;
}

.kids-support-title {
  color: #d9e480;
  font-size: 5vw;
}
@media (max-width: 765px) {
  .kids-support-title {
    font-size: 9.3vw;
  }
}
.kids-support-title {
  font-weight: 800;
  line-height: 1;
}
.kids-support-title span {
  display: block;
  font-size: 64%;
}

.kids-support-rubi {
  color: #d9e480;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .kids-support-rubi {
    font-size: 3.9vw;
  }
}
.kids-support-rubi {
  font-weight: 600;
}

.jms-title {
  color: #fff;
  font-size: 3.1666vw;
}
@media (max-width: 765px) {
  .jms-title {
    font-size: 7vw;
  }
}
.jms-title {
  font-weight: 700;
  line-height: 1;
}

.superbrand-brock {
  width: 100%;
  padding: 6% 4%;
  background-image: url(../image/superbrand-bg.webp);
  background-size: cover;
  background-position: center;
  text-align: center;
}
.superbrand-brock p {
  font-family: "Noto Serif JP", serif;
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .superbrand-brock p {
    font-size: 4.4vw;
  }
}
.superbrand-brock p {
  font-weight: 600;
  word-spacing: 2em;
  margin: 0.8em 0 1.2em;
  line-height: 1.9;
}
.superbrand-brock p span {
  padding-right: 0.4em;
}
.superbrand-brock .more-btn {
  color: #fff;
  background-color: #000;
}

.superbrand-catch {
  font-family: "Noto Serif JP", serif;
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .superbrand-catch {
    font-size: 5.1vw;
  }
}
.superbrand-catch {
  font-weight: 600;
  letter-spacing: 0.1em;
}

.superbrand-title {
  font-family: "Noto Serif JP", serif;
  font-size: 3.75vw;
}
@media (max-width: 765px) {
  .superbrand-title {
    font-size: 7.92vw;
  }
}
.superbrand-title {
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.08em;
}

.superbrand-example {
  width: 15%;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  margin: 0 auto;
  padding: 0.2em 0;
  font-weight: 600;
}

.application-support {
  width: 57%;
  display: block;
  text-align: center;
  margin: 4em auto 0;
  border: 1px solid #000;
  border-radius: 9999px;
}
.application-support p {
  padding: 0.7em 2em;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .application-support p {
    font-size: 3.9vw;
  }
}
.application-support p {
  font-weight: 600;
  letter-spacing: 0.08em;
}

.exxe-features-wrap {
  position: relative;
}

.exxe-main-img {
  width: 60%;
  position: absolute;
  top: 20em;
  left: -16%;
}

.exxe-page-catch {
  font-family: "Noto Serif JP", serif;
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  .exxe-page-catch {
    font-size: 6vw;
  }
}
.exxe-page-catch {
  font-weight: 600;
  letter-spacing: 0.46em;
  white-space: nowrap;
}

.exxe-features {
  display: flex;
  margin-top: 2em;
}

.exxe-basic {
  width: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}

.exxe-page-logo {
  width: 50%;
}

.mij-box {
  width: 50%;
  aspect-ratio: 2/1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 0 auto;
}
.mij-box .left,
.mij-box .right {
  display: grid;
  place-items: center;
  text-align: center;
  font-family: "Noto Serif JP", serif;
  line-height: 1.3;
  font-weight: 600;
}
.mij-box .left {
  background: #fff;
  color: #000;
  letter-spacing: 0;
}
.mij-box .right {
  background: #000;
  color: #fff;
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .mij-box .right {
    font-size: 4.4vw;
  }
}
.mij-box .right {
  font-weight: 700;
}

.exxe-movie {
  width: 44%;
}

.video-fluid {
  width: 100%;
  height: auto;
  display: block;
}

.vrs-ff {
  width: 50%;
  text-align: center;
  margin-top: 1.5em;
  border-right: 1px solid #000;
}
.vrs-ff:first-child {
  border-left: 1px solid #000;
}

.features-catch {
  font-size: 2vw;
}
@media (max-width: 765px) {
  .features-catch {
    font-size: 5.6vw;
  }
}
.features-catch {
  font-weight: 600;
}

.features-name {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .features-name {
    font-size: 3.9vw;
  }
}
.features-name {
  font-weight: 700;
  line-height: 1.3;
}

.features-catch-1 {
  width: 70%;
  padding: 0.8em 0;
  margin: 3.6em auto 1.5em;
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .features-catch-1 {
    font-size: 5.1vw;
  }
}
.features-catch-1 {
  font-weight: 600;
  letter-spacing: 0.2em;
  line-height: 1;
  background: linear-gradient(to right, rgba(197, 172, 90, 0) 0%, rgb(197, 172, 90) 15%, rgb(197, 172, 90) 85%, rgba(197, 172, 90, 0) 100%);
}

.features-img {
  padding: 0 10%;
  margin: 1em 0;
}

.exxe-guarantee-wrap {
  text-align: center;
  margin-top: 3em;
}
.exxe-guarantee-wrap .caption {
  font-size: 1vw;
}
@media (max-width: 765px) {
  .exxe-guarantee-wrap .caption {
    font-size: 2.8vw;
  }
}

.exxe-guarantee {
  width: 20%;
  font-family: "Noto Serif JP", serif;
  color: #fff;
  background-color: #000;
  padding: 0.5em 0;
  margin: 0 auto 0.5em;
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .exxe-guarantee {
    font-size: 4.4vw;
  }
}
.exxe-guarantee {
  line-height: 1;
}

.page-topcontents-wrap {
  margin-top: 4.5em;
}

.price-off {
  display: flex;
  align-items: flex-end;
  width: 72%;
  margin: 0 auto;
}

.price-off-in {
  width: 85%;
  display: flex;
  align-items: center;
}

.price-text {
  width: 23%;
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  .price-text {
    font-size: 6vw;
  }
}
.price-text {
  font-weight: 700;
  color: #c8161d;
  white-space: nowrap;
  line-height: 1.1;
}

.price-off-img {
  width: 77%;
}

.price-caption {
  width: 15%;
  display: flex;
  align-items: end;
  font-size: 1vw;
}
@media (max-width: 765px) {
  .price-caption {
    font-size: 2.8vw;
  }
}
.price-caption {
  white-space: nowrap;
}

.sunglass-price {
  display: flex;
  justify-content: space-between;
  width: 36%;
  margin: 1em auto 0;
}

.sunglass-price-1 {
  display: flex;
  justify-content: space-between;
  width: 46%;
}

.sunglass-price .price-left,
.sunglass-price-1 .price-left {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 38%;
  color: #fff;
  padding: 0.7em 0;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .sunglass-price .price-left,
  .sunglass-price-1 .price-left {
    font-size: 3.9vw;
  }
}
.sunglass-price .price-left,
.sunglass-price-1 .price-left {
  font-weight: 700;
  line-height: 1;
}
.sunglass-price .price-right,
.sunglass-price-1 .price-right {
  width: 58%;
  font-family: "Noto Serif JP", serif;
  font-size: 3.1666vw;
}
@media (max-width: 765px) {
  .sunglass-price .price-right,
  .sunglass-price-1 .price-right {
    font-size: 7vw;
  }
}
.sunglass-price .price-right,
.sunglass-price-1 .price-right {
  font-weight: 600;
  white-space: nowrap;
  line-height: 1;
}
.sunglass-price .price-right span,
.sunglass-price-1 .price-right span {
  font-size: 1vw;
}
@media (max-width: 765px) {
  .sunglass-price .price-right span,
  .sunglass-price-1 .price-right span {
    font-size: 2.8vw;
  }
}
.sunglass-price .price-right span,
.sunglass-price-1 .price-right span {
  margin-left: -0.5em;
}

.sunglass-main-img {
  display: flex;
  justify-content: space-between;
  margin-top: 2.2em;
  line-height: 0;
}

.sunglass-main-img-left {
  width: 64.3%;
}

.sunglass-main-img-right {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  width: 33.7%;
}

.sunglass-lens {
  width: 76%;
  margin: 3em auto 2em;
  padding: 1.5em 0 2em;
  border-top: 1.5px solid #0d3581;
  border-bottom: 1.5px solid #0d3581;
}

.sunglass-lens-head {
  text-align: center;
  font-size: 2.6666vw;
}
@media (max-width: 765px) {
  .sunglass-lens-head {
    font-size: 6vw;
  }
}
.sunglass-lens-head {
  font-weight: 700;
  color: #0d3581;
}

.sunglass-lens-p {
  text-align: center;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .sunglass-lens-p {
    font-size: 3.9vw;
  }
}
.sunglass-lens-p {
  line-height: 1.3;
}

.sunglass-price-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 1em;
}
.sunglass-price-wrap .plus {
  width: 3%;
  line-height: 0;
}

.sunglass-lens-caption {
  text-align: center;
  margin-top: 1em;
}

.l-option-price {
  font-family: "Noto Serif JP", serif;
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  .l-option-price {
    font-size: 6vw;
  }
}
.l-option-price {
  font-weight: 600;
  white-space: nowrap;
  line-height: 1;
}
.l-option-price .tax {
  font-size: 1vw;
}
@media (max-width: 765px) {
  .l-option-price .tax {
    font-size: 2.8vw;
  }
}
.l-option-price .tax {
  margin-left: -0.5em;
}

.enkin-price {
  width: 100%;
  font-family: "Noto Serif JP", serif;
  font-size: 2vw;
}
@media (max-width: 765px) {
  .enkin-price {
    font-size: 5.6vw;
  }
}
.enkin-price {
  font-weight: 600;
  white-space: nowrap;
  line-height: 1;
  border-top: 1px solid #000;
  margin-top: 0.5em;
  padding-top: 0.5em;
  text-align: center;
}
.enkin-price .tax {
  font-size: 1vw;
}
@media (max-width: 765px) {
  .enkin-price .tax {
    font-size: 2.8vw;
  }
}
.enkin-price .tax {
  margin-left: -0.5em;
}
.enkin-price .enkin {
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .enkin-price .enkin {
    font-size: 4.4vw;
  }
}
.enkin-price .enkin {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 600;
  display: inline-block;
  transform: translateY(-0.1em);
}

.sunglass-brand-brock {
  width: 100%;
  padding: 4% 4%;
  background-color: #c9c3bb;
  text-align: center;
}
.sunglass-brand-brock p {
  font-family: "Noto Serif JP", serif;
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .sunglass-brand-brock p {
    font-size: 4.4vw;
  }
}
.sunglass-brand-brock p {
  font-weight: 600;
  word-spacing: 2em;
  margin: 0.8em 0;
  line-height: 1.9;
}
.sunglass-brand-brock p span {
  padding-right: 0.4em;
}

.sunglass-brand-title {
  font-family: "Noto Serif JP", serif;
  font-size: 3.1666vw;
}
@media (max-width: 765px) {
  .sunglass-brand-title {
    font-size: 7vw;
  }
}
.sunglass-brand-title {
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.08em;
}
.sunglass-brand-title .word_space {
  padding-right: 0.3em;
}

.sunglass-brand-example {
  width: 20%;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  margin: 0 auto;
  padding: 0.2em 0;
  font-weight: 600;
}

.mixx-wrap {
  width: 100%;
  padding: 0 8%;
  background-color: #000;
  position: relative;
}

.mixx-introduction {
  width: 32%;
  padding: 3.5em 0;
}
.mixx-introduction p {
  color: #fff;
  text-align: justify;
  margin-top: 1em;
  line-height: 1.8;
}

.mixx-logo {
  width: 80%;
  margin: 0 auto;
}

.mixx-patents {
  width: 100%;
  text-align: center;
  color: #fff;
  background-color: #c8161d;
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .mixx-patents {
    font-size: 4.4vw;
  }
}
.mixx-patents {
  font-weight: 700;
  line-height: 1;
  margin-top: 1em;
  padding: 0.3em 0 0.5em;
}
.mixx-patents span {
  font-size: 1vw;
}
@media (max-width: 765px) {
  .mixx-patents span {
    font-size: 2.8vw;
  }
}

.mixx-main-img-1 {
  width: 39%;
  position: absolute;
  top: 3em;
  left: 35%;
}

.mixx-main-img-2 {
  width: 33%;
  position: absolute;
  bottom: 0.5em;
  right: 0;
}

.mixx-text {
  font-family: "Noto Serif JP", serif;
  text-align: center;
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .mixx-text {
    font-size: 5.1vw;
  }
}
.mixx-text {
  font-weight: 600;
  margin-top: 2.5em;
}

.mixx-item-wrap {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.6em 4em;
  padding: 0 10%;
  margin-top: 2em;
}

.mixx-item {
  line-height: 1;
}
.mixx-item p {
  font-size: 80%;
  margin-left: 1em;
}

.mixx-price-wrap {
  width: 36%;
  display: flex;
  justify-content: space-between;
  margin: 3em auto 5em;
}

.mixx-price {
  width: 47%;
  display: flex;
  justify-content: space-between;
}
.mixx-price .price-left {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 25%;
  color: #fff;
  padding: 0.2em 0;
  font-size: 80%;
  font-weight: 700;
  line-height: 1;
}
.mixx-price .price-right {
  width: 72%;
  font-family: "Noto Serif JP", serif;
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  .mixx-price .price-right {
    font-size: 6vw;
  }
}
.mixx-price .price-right {
  font-weight: 600;
  white-space: nowrap;
  line-height: 1;
}
.mixx-price .price-right span {
  font-size: 1vw;
}
@media (max-width: 765px) {
  .mixx-price .price-right span {
    font-size: 2.8vw;
  }
}
.mixx-price .price-right span {
  margin-left: -0.4em;
}

.mixx-feature-wrap {
  display: flex;
}

.mixx-bg {
  background: #d4e0e6;
}

.mixx-feature {
  padding-top: 5.4em;
}
.mixx-feature-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: auto;
  gap: 2.5em;
  align-items: center;
}

.mixx-feature-block h3 {
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .mixx-feature-block h3 {
    font-size: 4.4vw;
  }
}
.mixx-feature-block h3 {
  font-weight: 600;
  padding-bottom: 0.6em;
  margin-bottom: 0.6em;
  line-height: 1.3;
  border-bottom: 1px solid #000;
}
.mixx-feature-block p {
  text-align: justify;
}

.mixx-feature-image {
  text-align: center;
}
.mixx-feature-image .mixx-caption {
  position: absolute;
  bottom: 1em;
  right: 28%;
  font-size: 80%;
}

.mixx-pos-r1c2 {
  grid-column: 2/3;
  position: relative;
}
.mixx-pos-r1c2 h3::before {
  content: "";
  width: 1.2em;
  height: 1.2em;
  position: absolute;
  top: -1.3em;
  left: 0;
  background-image: url(../image/number-icon-01.webp);
  background-size: contain;
}

.mixx-pos-r1c3 {
  grid-column: 3/4;
  position: relative;
}
.mixx-pos-r1c3 h3::before {
  content: "";
  width: 1.2em;
  height: 1.2em;
  position: absolute;
  top: -1.3em;
  left: 0;
  background-image: url(../image/number-icon-02.webp);
  background-size: contain;
}

.mixx-pos-r2c1to2 {
  grid-column: 1/3;
  padding: 5em 8% 0 10%;
  position: relative;
}

.dashed-line-1,
.dashed-line-2,
.dashed-line-3 {
  height: 1px; /* 太さ */
  background-image: repeating-linear-gradient(to right, #000 0 0.3em, transparent 0.3em 0.6em);
  transform: rotate(-60deg);
}

.dashed-line-1 {
  width: 55%;
  position: absolute;
  top: 36%;
  left: 28%;
}
.dashed-line-1::before {
  content: "";
  width: 1.5em;
  height: 1.5em;
  position: absolute;
  top: -0.75em;
  left: -0.75em;
  background-image: url(../image/number-icon-01.webp);
  background-size: contain;
  transform: rotate(60deg);
  z-index: 1;
}

.dashed-line-2 {
  width: 48%;
  position: absolute;
  top: 28%;
  left: 68%;
}
.dashed-line-2::before {
  content: "";
  width: 1.5em;
  height: 1.5em;
  position: absolute;
  top: -0.75em;
  left: -0.75em;
  background-image: url(../image/number-icon-02.webp);
  background-size: contain;
  transform: rotate(60deg);
  z-index: 1;
}

.dashed-line-3 {
  width: 25%;
  position: absolute;
  bottom: 8%;
  left: 6%;
}
.dashed-line-3::before {
  content: "";
  width: 1.5em;
  height: 1.5em;
  position: absolute;
  top: -0.75em;
  right: -0.75em;
  background-image: url(../image/number-icon-03.webp);
  background-size: contain;
  transform: rotate(60deg);
  z-index: 1;
}

.mixx-pos-r2c3 {
  grid-column: 3/4;
}
.mixx-pos-r2c3 img {
  margin-top: 0.8em;
}

.mixx-pos-r3c1 {
  grid-column: 1/2;
  position: relative;
}
.mixx-pos-r3c1 h3::before {
  content: "";
  width: 1.2em;
  height: 1.2em;
  position: absolute;
  top: -1.3em;
  left: 0;
  background-image: url(../image/number-icon-03.webp);
  background-size: contain;
}

.mixx-pos-r3c2 {
  grid-column: 2/3;
}

.mixx-pos-r3c3 {
  grid-column: 3/4;
}

.mulch-bridge-wrap {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-top: 2.2em;
}

.mulch-bridge-box1 {
  width: 31.348%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.mulch-bridge-box2 {
  width: 66%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.mulch-bridge-1column {
  width: 100%;
  border-top: 1.5px solid #000;
  padding-top: 0.8em;
  display: flex;
  flex-direction: column;
}
.mulch-bridge-1column .comments {
  text-align: center;
  font-size: 1vw;
}
@media (max-width: 765px) {
  .mulch-bridge-1column .comments {
    font-size: 2.8vw;
  }
}
.mulch-bridge-1column .comments {
  margin-top: 2.8em;
}
.mulch-bridge-1column .comments::before {
  content: "◆";
  display: inline-block;
  width: 1em;
  height: 1em;
  color: #0d3581;
}

.mulch-bridge-2column {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.mulch-bridge-column {
  width: 47.498%;
}

.column-item-wrap {
  border-top: 1.5px solid #000;
  padding-top: 0.8em;
}
.column-item-wrap:last-child .mulch-bridge-item {
  margin: 0.5em auto 1.2em;
}

.mulch-bridge-head {
  text-align: center;
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .mulch-bridge-head {
    font-size: 5.1vw;
  }
}
.mulch-bridge-head {
  font-weight: 700;
}

.mulch-bridge-catch {
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .mulch-bridge-catch {
    font-size: 3.9vw;
  }
}
.mulch-bridge-catch {
  font-weight: 600;
}

.mulch-bridge-item {
  width: 80%;
  margin: 0.5em auto 3em;
  position: relative;
}
.mulch-bridge-item p {
  position: absolute;
  bottom: -1em;
  left: 0;
  line-height: 1.2;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .mulch-bridge-item p {
    font-size: 3.9vw;
  }
}
.mulch-bridge-item p {
  font-weight: 600;
}

.mulch-bridge-price {
  width: 100%;
  padding: 0.6em 0;
  background-color: #d4e0e6;
  border-radius: 9999px;
  text-align: center;
  line-height: 1.2;
  margin-top: 1.5em;
}
.mulch-bridge-price p {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .mulch-bridge-price p {
    font-size: 3.9vw;
  }
}
.mulch-bridge-price p {
  font-weight: 600;
}

.list-price {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .list-price {
    font-size: 3.9vw;
  }
}
.list-price {
  font-weight: 600;
}
.list-price .tax-included-price {
  font-size: 2vw;
}
@media (max-width: 765px) {
  .list-price .tax-included-price {
    font-size: 5.6vw;
  }
}

.large-price {
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .large-price {
    font-size: 4.4vw;
  }
}
.large-price {
  display: inline-block;
  transform: translateY(0.05em);
}

.tax-included-text {
  font-size: 1vw;
}
@media (max-width: 765px) {
  .tax-included-text {
    font-size: 2.8vw;
  }
}
.tax-included-text {
  font-weight: 400;
}

.concept-catch {
  font-family: "Noto Serif JP", serif;
  font-size: 2vw;
}
@media (max-width: 765px) {
  .concept-catch {
    font-size: 5.6vw;
  }
}
.concept-catch {
  font-weight: 600;
  line-height: 1.3;
}

.concept-introduction p {
  margin-top: 1em;
}

.concept-image-wrap {
  width: 66%;
  display: flex;
  gap: 2em;
  margin-top: 1.5em;
}

.qualification-wrap {
  width: 100%;
  padding: 4em 0 1em;
}
.qualification-wrap p {
  text-align: center;
  margin-top: 1.5em;
  line-height: 1.8;
  letter-spacing: 0.1em;
}

.qualification-title {
  width: 52%;
  display: flex;
  justify-content: space-between;
  font-size: 2.6666vw;
}
@media (max-width: 765px) {
  .qualification-title {
    font-size: 6vw;
  }
}
.qualification-title {
  font-weight: 700;
  color: #0d3581;
  letter-spacing: 0.05em;
  white-space: nowrap;
  margin: 0 auto;
}

.qualification-mark {
  width: 26%;
}

.qualification-catch {
  width: 52%;
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .qualification-catch {
    font-size: 5.1vw;
  }
}
.qualification-catch {
  font-weight: 600;
  color: #0d3581;
  border-top: 1.5px solid #0d3581;
  border-bottom: 1.5px solid #0d3581;
  padding: 0.7em 0;
  letter-spacing: 0.15em;
  line-height: 1;
  margin: 0 auto;
}

.horizontal_scroll {
  background-color: #eae9ed;
  padding: 6% 0;
}
.horizontal_scroll .sticky {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.horizontal_scroll h2 {
  margin-bottom: 2rem;
}
.horizontal_scroll .scroller {
  display: flex;
  width: 100%;
  padding: 0 8%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.horizontal_scroll .scroller::-webkit-scrollbar {
  display: none; /* Chrome, Safari */
}

.purchase-flow-body {
  text-align: center;
  margin-bottom: 6rem;
}

.slide-btn-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 0 8%;
}
.slide-btn-wrap p {
  margin: 0 1em;
}
.slide-btn-wrap .btn {
  width: 1em;
  height: 1em;
  position: relative;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  background: none;
  padding: 0 0.8em;
  cursor: pointer;
}
.slide-btn-wrap {
  /* ▶ */
}
.slide-btn-wrap .next::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 12px solid #0d3581;
}
.slide-btn-wrap {
  /* ◀ */
}
.slide-btn-wrap .prev::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-right: 12px solid #0d3581;
}

.slide-caption {
  font-weight: 500;
  line-height: 1;
  color: #0d3581;
}

.purchase-flow-block {
  flex: 0 0 25%; /* 1ブロックの幅 */
  text-align: center;
  padding-top: 3%;
  border-top: 3px solid #c5ac5a;
  border-left: 3px solid #c5ac5a;
  margin: 2em;
  position: relative;
}

.flow-img {
  padding-right: 5%;
  position: relative;
}

.flow-head {
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .flow-head {
    font-size: 5.1vw;
  }
}
.flow-head {
  font-weight: 600;
  margin-bottom: 1rem;
  color: #0d3581;
  line-height: 1.3;
}

.flow-arrow {
  width: 18%;
  position: absolute;
  top: 50%;
  left: -7%;
  transform: translateY(-50%);
}

.flow-text {
  position: absolute;
  bottom: -1.5em;
  left: 50%;
  transform: translateX(-50%);
  width: 80%;
  padding: 1em 0;
  color: #fff;
  background-color: #e36089;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .flow-text {
    font-size: 3.9vw;
  }
}
.flow-text {
  font-weight: 600;
  line-height: 1;
  border-radius: 9999px;
}

.about-us-content .breadcrumb li {
  color: #fff;
}
.about-us-content h1 {
  color: #c8d8e0;
}
.about-us-content h1 span {
  color: #fff;
}
.about-us-content .h1-rubi {
  color: #fff;
}
.about-us-content .blue-line {
  background-color: #c8d8e0;
}
.about-us-content .green-line {
  background-color: #fff;
}

.philosophy-wrap {
  color: #fff;
  margin-bottom: 0.5em;
}
.philosophy-wrap p {
  font-family: "Noto Serif JP", serif;
  font-size: 2vw;
}
@media (max-width: 765px) {
  .philosophy-wrap p {
    font-size: 5.6vw;
  }
}
.philosophy-wrap p {
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.5;
}

.philosophy-title {
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .philosophy-title {
    font-size: 5.1vw;
  }
}
.philosophy-title {
  font-weight: 600;
  letter-spacing: 0.2em;
  margin-bottom: 0.4em;
}

.exterior-img {
  width: 60%;
  position: absolute;
  bottom: 0;
  right: 0;
  line-height: 1;
}

.company-profile-wrap {
  margin-top: 4em;
}
.company-profile-wrap h2 {
  text-align: center;
}

.company-table {
  width: 85%;
  border-collapse: collapse;
  border-top: 2px solid #1b2a5c;
  border-bottom: 2px solid #1b2a5c;
  line-height: 1.6;
  margin: 1em auto 0;
}
.company-table th,
.company-table td {
  border-bottom: 1px solid #a7aaa9;
  padding: 2em 0 2em 3em;
}
.company-table th {
  width: 20%;
  background-color: #eae9ed;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
}
.company-table td {
  background-color: #fff;
}
.company-table tr:last-child th,
.company-table tr:last-child td {
  border: none;
}

.shop-list-wrap {
  width: 96%;
  margin: 0 auto;
  padding: 0 12% 2em;
}

.ms-shop-wrap {
  position: relative;
  width: 65%;
}
.ms-shop-wrap p {
  margin-top: 0.8em;
}
.ms-shop-wrap a {
  position: absolute;
  bottom: 0;
  right: 0;
  font-size: 1vw;
}
@media (max-width: 765px) {
  .ms-shop-wrap a {
    font-size: 2.8vw;
  }
}
.ms-shop-wrap a {
  font-weight: 600;
  color: #4b6cb3;
  text-decoration: underline;
}

.stores-img {
  width: 100%;
  padding: 2% 0 15.5% 15%;
}

.stores-number {
  position: absolute;
  width: 1.6em;
  height: 1.6em;
  line-height: 1;
}
.stores-number.number-1 {
  top: 24%;
  left: 28.3%;
}
.stores-number.number-2 {
  top: 31.3%;
  left: 28.6%;
}
.stores-number.number-3 {
  top: 33.2%;
  left: 39.2%;
}
.stores-number.number-4 {
  top: 58.4%;
  left: 42.4%;
}
.stores-number.number-5 {
  top: 60.9%;
  left: 53.9%;
}
.stores-number.number-6 {
  top: 65%;
  left: 56.6%;
}
.stores-number.number-7 {
  top: 68.9%;
  left: 55.1%;
}
.stores-number.number-8 {
  top: 65.2%;
  left: 76.4%;
}
.stores-number.number-9 {
  top: 71.6%;
  left: 74.6%;
}
.stores-number.number-10 {
  top: 66.3%;
  left: 53.6%;
}
.stores-number.number-11 {
  top: 74.2%;
  left: 46.7%;
}
.stores-number a {
  position: relative;
}
.stores-number p {
  width: 6em;
  position: absolute;
  top: -1.8em;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  color: #0d3581;
  font-size: 1vw;
}
@media (max-width: 765px) {
  .stores-number p {
    font-size: 2.8vw;
  }
}
.stores-number p {
  font-weight: 600;
}
.stores-number p.right-position {
  top: -0.2em;
  left: 0.2em;
  transform: none;
}
.stores-number p.left-position {
  top: -0.2em;
  left: auto;
  right: 1.2em;
  transform: none;
}

.ms-shop-title {
  width: 100%;
  padding: 0.6em 0;
  text-align: center;
  border-radius: 9999px;
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .ms-shop-title {
    font-size: 4.4vw;
  }
}
.ms-shop-title {
  font-weight: 800;
  color: #fff;
  background-color: #008893;
}

.shop-list-wrap-in {
  display: flex;
  justify-content: space-between;
  margin-top: 1.5em;
}

.shop-list-left {
  width: 65%;
}
.shop-list-left ul {
  width: 50%;
}
.shop-list-left ul span {
  color: #0d3581;
}

.shop-list-right {
  width: 30%;
}
.shop-list-right ul {
  width: 100%;
}

.shop-list-title {
  border-top: 2px solid #0d3581;
  border-bottom: 2px solid #0d3581;
  padding: 0.4em 0;
  text-align: center;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .shop-list-title {
    font-size: 3.9vw;
  }
}
.shop-list-title {
  font-weight: 700;
}

.shop-list {
  display: flex;
  justify-content: space-between;
}
.shop-list ul {
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .shop-list ul {
    font-size: 4.4vw;
  }
}
.shop-list ul {
  font-weight: 600;
  line-height: 2;
  margin-top: 1em;
}
.shop-list li {
  margin-bottom: 0.2em;
}
.shop-list li a {
  display: block;
  padding: 0.2em 0;
}

.shop-single-list {
  padding: 2em 4%;
}

.shop-single-list {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.shop-single-list ul {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .shop-single-list ul {
    font-size: 3.9vw;
  }
}
.shop-single-list ul {
  line-height: 1.5;
  flex: 1;
}
.shop-single-list li {
  margin-bottom: 0.2em;
}
.shop-single-list li a {
  display: block;
  padding: 0.2em 0;
}

.single-list-title {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .single-list-title {
    font-size: 3.9vw;
  }
}
.single-list-title {
  font-weight: 700;
  text-align: center;
  padding: 0.5em 0;
  margin: 0.5em 2em 0 0;
  letter-spacing: 0.2em;
  color: #0d3581;
  border-top: 2px solid #0d3581;
  border-bottom: 2px solid #0d3581;
  width: 14%;
}

.superbrand-banner {
  margin-top: 3em;
  padding: 0 12% 6em;
}
.superbrand-banner a {
  display: block;
  width: 64%;
  padding: 1.4em 0;
  background-color: #000;
  border-radius: 9999px;
  text-align: center;
  margin: 0.5em auto 0;
}
.superbrand-banner a p {
  color: #fff;
}

.superbrand-banner-catch {
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .superbrand-banner-catch {
    font-size: 4.4vw;
  }
}
.superbrand-banner-catch {
  font-weight: 600;
}

.superbrand-banner-head {
  text-align: center;
  font-family: "Noto Serif JP", serif;
  color: #c5ac5a;
  font-size: 2.5vw;
}
@media (max-width: 765px) {
  .superbrand-banner-head {
    font-size: 6vw;
  }
}
.superbrand-banner-head {
  font-weight: 600;
  line-height: 1;
  margin-bottom: 0.2em;
  letter-spacing: 0.1em;
}

.superbrand-top-wrap {
  background-color: #0d3581;
  padding: 6.85em 0;
  position: relative;
}
.superbrand-top-wrap h1 {
  text-align: center;
  color: #fff;
  font-size: 2.5vw;
}
@media (max-width: 765px) {
  .superbrand-top-wrap h1 {
    font-size: 6vw;
  }
}
.superbrand-top-wrap h1 {
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0.15em;
}
.superbrand-top-wrap::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url(../image/superbrand-page-bg.webp);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.superbrand-top-img {
  line-height: 1;
}

.superbrand-top-exterior {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 31%;
  line-height: 1;
}

.shop-brand-search {
  padding: 6em 0;
}
.shop-brand-search ul {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5em 1em;
}
.shop-brand-search li {
  text-align: center;
  width: 100%;
  border-radius: 9999px;
  color: #fff;
  background-color: #4b6cb3;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .shop-brand-search li {
    font-size: 3.9vw;
  }
}
.shop-brand-search li {
  font-weight: 700;
}
.shop-brand-search li a {
  display: block;
  padding: 1em 0;
}

.shop-brand-search-title {
  font-size: 2vw;
}
@media (max-width: 765px) {
  .shop-brand-search-title {
    font-size: 5.6vw;
  }
}
.shop-brand-search-title {
  font-weight: 800;
  text-align: center;
  color: #0d3581;
  margin-bottom: 1.6em;
}

.brand-shop-search {
  padding: 4.5em 12%;
}

.brand-name {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.order-brock {
  width: 20%;
  margin-bottom: 4em;
  border-left: 1px solid #000;
  padding-left: 1.2em;
}
.order-brock.ha-gyo {
  width: 40%;
}
.order-brock.ha-gyo .two-columns {
  display: flex;
  width: 100%;
}
.order-brock.ha-gyo .two-columns ul {
  width: 50%;
}
.order-brock li {
  width: 100%;
  font-weight: 500;
  line-height: 1.8;
}

.alphabetical-order {
  width: 5em;
  text-align: center;
  font-weight: 700;
  color: #fff;
  background-color: #000;
  padding: 0.5em 0;
  border-radius: 9999px;
  margin-bottom: 0.5em;
  line-height: 1;
}

.popup-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.8);
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.popup-overlay.show {
  display: flex;
}

.popup-content {
  max-width: 38%;
  text-align: center;
  background: #fff;
  padding: 1.5em 2em;
  border-radius: 1em;
  position: relative;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .popup-content {
    font-size: 3.9vw;
  }
}
.popup-content {
  font-weight: 500;
  margin-top: 10%;
}
.popup-content h3 {
  color: #0d3581;
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .popup-content h3 {
    font-size: 4.4vw;
  }
}
.popup-content h3 {
  font-weight: 700;
  border-bottom: 1.5px solid #0d3581;
  padding-bottom: 0.5em;
  margin-bottom: 0.5em;
  line-height: 1;
}
.popup-content ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}
.popup-content li {
  width: 8em;
}

.popup-close {
  position: absolute;
  top: 0.5em;
  right: 0.5em;
  font-size: 2vw;
  line-height: 1;
  cursor: pointer;
}

.q-and-a-wrap {
  width: 70%;
  margin: 0 auto 0;
  text-align: justify;
  position: relative;
  top: -7em;
  z-index: 1;
}
.q-and-a-wrap .q-and-a-box {
  margin-bottom: 3em;
}
.q-and-a-wrap .question {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.5em;
  border: none;
  border-radius: 1em;
  background: #d4e0e6;
  cursor: pointer;
  font-weight: 600;
  line-height: 1.3;
  -moz-appearance: none;
       appearance: none;
  outline: none;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
}
.q-and-a-wrap .question:focus, .q-and-a-wrap .question:active, .q-and-a-wrap .question:hover {
  background: #d4e0e6;
  outline: none;
}
.q-and-a-wrap .question::-moz-focus-inner {
  border: 0;
}
.q-and-a-wrap .q-label {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
  margin-right: 0.5em;
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  .q-and-a-wrap .q-label {
    font-size: 6vw;
  }
}
.q-and-a-wrap .q-label {
  font-weight: 800;
  line-height: 1;
  color: #0d3581;
}
.q-and-a-wrap .q-text {
  min-width: 0;
  display: flex;
  flex: 1 1 auto;
  text-align: left;
  padding-right: 1em;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .q-and-a-wrap .q-text {
    font-size: 3.9vw;
  }
}
.q-and-a-wrap .q-text {
  line-break: strict;
  word-break: normal;
  overflow-wrap: break-word;
}
.q-and-a-wrap .q-text,
.q-and-a-wrap .a-text {
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;
}
.q-and-a-wrap .q-text,
.q-and-a-wrap .a-text {
  word-break: normal !important;
  overflow-wrap: normal !important;
  line-break: strict;
  white-space: normal;
}
.q-and-a-wrap .q-caret {
  position: relative;
  width: 1.2em;
  height: 1.2em;
  flex-shrink: 0;
}
.q-and-a-wrap .q-caret::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 1.5px;
  background-color: currentColor;
  transform-origin: center;
  transition: opacity 0.2s ease;
  transform: translate(-50%, -50%);
}
.q-and-a-wrap .q-caret::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 1.5px;
  background-color: currentColor;
  transform-origin: center;
  transition: 0.2s ease;
  transform: translate(-50%, -50%) rotate(-90deg);
}
.q-and-a-wrap .question[aria-expanded=true] .q-caret::after {
  transform: translate(-50%, -50%) rotate(0deg);
}
.q-and-a-wrap .answer[hidden] {
  display: none !important;
}
.q-and-a-wrap .answer {
  margin-top: 0.8em;
  overflow: hidden;
  height: 0;
  opacity: 0;
  background-color: #eae5da;
  border-radius: 1em;
  pointer-events: none;
  transition: height 0.35s ease, opacity 0.25s ease;
}
.q-and-a-wrap .answer[hidden] {
  display: none;
}

.answer-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.5em;
}

.a-label {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
  margin-right: 0.5em;
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  .a-label {
    font-size: 6vw;
  }
}
.a-label {
  font-weight: 800;
  line-height: 1;
  color: #007f41;
}

.a-text {
  display: flex;
  flex: 1 1 auto;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .a-text {
    font-size: 3.9vw;
  }
}

@media (prefers-reduced-motion: reduce) {
  .q-and-a-wrap .answer {
    transition: none;
  }
}
.q-and-a-wrap .q-and-a-box.is-open .answer {
  opacity: 1;
  pointer-events: auto;
}

.individual-stores-wrap {
  position: relative;
  top: -7em;
}

.store-overview-box {
  width: 50%;
  margin: 0 0 2em auto;
}

.shop-name {
  font-size: 2.5vw;
}
@media (max-width: 765px) {
  .shop-name {
    font-size: 6vw;
  }
}
.shop-name {
  font-weight: 700;
  color: #0d3581;
}
.shop-name.no-ms {
  padding-bottom: 0.3em;
  border-bottom: 1px solid #000;
}

.store-image {
  display: flex;
}
.store-image img {
  width: 50%;
}

.store-overview-icon {
  font-size: 1vw;
}
@media (max-width: 765px) {
  .store-overview-icon {
    font-size: 2.8vw;
  }
}
.store-overview-icon {
  border-bottom: 1px solid #000;
  margin-top: 0.5em;
  padding-bottom: 1.5em;
}
.store-overview-icon .ms-icon {
  display: inline-block;
  padding: 0.7em 1.5em;
  text-align: center;
  color: #fff;
  background-color: #008893;
  border-radius: 9999px;
  font-weight: 600;
  line-height: 1;
}

.store-address {
  line-height: 1.4;
  border-bottom: 1px solid #000;
  padding: 1em 0;
}
.store-address .address-1 {
  font-family: "Noto Serif JP", serif;
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .store-address .address-1 {
    font-size: 5.1vw;
  }
}
.store-address .address-1 {
  font-weight: 600;
}
.store-address .address-2 {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .store-address .address-2 {
    font-size: 3.9vw;
  }
}
.store-address .address-2 a {
  padding-left: 2em;
}

.store-overview {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .store-overview {
    font-size: 3.9vw;
  }
}
.store-overview p {
  padding: 1em 0;
  border-bottom: 1px solid #000;
}
.store-overview span {
  width: 18%;
  display: inline-block;
  font-weight: 600;
}

.store-superbrand {
  background-color: #eae9ed;
  padding: 2.5em 5em 2.2em;
  margin-top: 2.5em;
}
.store-superbrand .brandpage-link {
  width: 100%;
  text-align: center;
  margin-top: 2em;
}
.store-superbrand .brandpage-link a {
  display: inline-block;
  padding: 1em 2em;
  background-color: #fff;
  border-radius: 9999px;
  line-height: 1;
  letter-spacing: 0.1em;
}

.store-brand-item {
  margin-top: 1em;
}
.store-brand-item ul {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.2em;
}
.store-brand-item li {
  font-weight: 500;
  white-space: nowrap;
}

.store-superbrand-head {
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .store-superbrand-head {
    font-size: 5.1vw;
  }
}
.store-superbrand-head {
  font-weight: 700;
  text-align: center;
  position: relative;
}
.store-superbrand-head::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 60%;
  display: block;
  width: 40%;
  height: 1px;
  background-color: #000;
  transform: translateY(-50%);
}
.store-superbrand-head::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 60%;
  display: block;
  width: 40%;
  height: 1px;
  background-color: #000;
  transform: translateY(-50%);
}

.store-privatebrand-head {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .store-privatebrand-head {
    font-size: 3.9vw;
  }
}
.store-privatebrand-head {
  font-weight: 700;
  text-align: center;
  margin: 2em 0 0.6em;
}

.store-privatebrand-item ul {
  display: flex;
  justify-content: center;
}
.store-privatebrand-item li {
  margin: 0 1.8em;
  font-weight: 500;
}

#access-map-wrap {
  margin: 0 0 10em;
}

#access-map-title {
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  #access-map-title {
    font-size: 6vw;
  }
}
#access-map-title {
  font-weight: 700;
  text-align: center;
  color: #0d3581;
}

#access-map {
  width: 75%;
  height: 0;
  overflow: hidden;
  padding-bottom: 45%;
  position: relative;
  margin: 1em auto 2em;
}
#access-map iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.contactlens-wrap {
  display: flex;
  justify-content: center;
  padding: 3em 0 4em;
}

.contactlens-wrap-in {
  display: flex;
  flex-direction: column;
}

.contactlens-icon {
  width: 22%;
  padding: 1em 0;
  text-align: center;
  color: #fff;
  background-color: #4b6cb3;
  border-radius: 9999px;
  font-size: 1vw;
}
@media (max-width: 765px) {
  .contactlens-icon {
    font-size: 2.8vw;
  }
}
.contactlens-icon {
  font-weight: 600;
  line-height: 1;
}

.contactlens-brock {
  display: flex;
  margin-top: 0.5em;
}

.contactlens-shop-name {
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .contactlens-shop-name {
    font-size: 5.1vw;
  }
}
.contactlens-shop-name {
  font-weight: 700;
  line-height: 1.2;
  padding-right: 1em;
}

.contactlens-shop-address {
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-left: 1px solid #000;
  padding: 0 1em;
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .contactlens-shop-address {
    font-size: 4.4vw;
  }
}
.contactlens-shop-address {
  line-height: 1;
}
.contactlens-shop-address a {
  display: block;
  margin-top: 0.4em;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .contactlens-shop-address a {
    font-size: 3.9vw;
  }
}

.contactlens-shop-overview {
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-left: 1px solid #000;
  padding-left: 1em;
  line-height: 1;
}
.contactlens-shop-overview p:first-child {
  margin-bottom: 0.6em;
}
.contactlens-shop-overview span {
  font-weight: 600;
  padding-right: 0.6em;
}

.lens-introduction {
  font-size: 2.5vw;
}
@media (max-width: 765px) {
  .lens-introduction {
    font-size: 6vw;
  }
}
.lens-introduction {
  font-weight: 600;
  text-align: center;
  line-height: 1.1;
  letter-spacing: 0.1em;
  color: #0d3581;
}
.lens-introduction span {
  font-size: 120%;
  font-weight: 800;
}

.zeroen {
  width: 35%;
  margin: 0.6em auto 0;
}

.lens-type-wrap {
  display: flex;
  justify-content: space-between;
  margin-top: 2em;
}
.lens-type-wrap p {
  text-align: center;
}

.lens-type-left {
  width: 38.2%;
}
.lens-type-left .lens-type-box {
  width: 46%;
}

.lens-type-right {
  width: 58.8%;
}
.lens-type-right .lens-type-box {
  width: 29.9%;
}

.lens-type-brock {
  display: flex;
  justify-content: space-between;
  margin-top: 1.4em;
}

.lens-type-title {
  width: 100%;
  padding: 0.8em 0;
  color: #fff;
  background-color: #4b6cb3;
  text-align: center;
  border-radius: 9999px;
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .lens-type-title {
    font-size: 4.4vw;
  }
}
.lens-type-title {
  font-weight: 600;
  line-height: 1;
}

.lens-type {
  width: 100%;
  font-size: 2.5vw;
}
@media (max-width: 765px) {
  .lens-type {
    font-size: 6vw;
  }
}
.lens-type {
  font-weight: 500;
  background-color: #fff;
  padding: 1em 0;
  text-align: center;
  line-height: 1.1;
  color: #0d3581;
}
.lens-type span {
  display: inline-block;
  font-size: 73%;
}

.lens-type-catch {
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .lens-type-catch {
    font-size: 4.4vw;
  }
}
.lens-type-catch {
  font-weight: 600;
  color: #0d3581;
  margin: 0.5em 0 0.8em;
  padding-bottom: 1em;
  border-bottom: 1px solid #0d3581;
  line-height: 1.3;
  white-space: nowrap;
}

.common-features {
  margin: 3.5em 0 3em;
}
.common-features h3 {
  text-align: center;
  font-size: 2vw;
}
@media (max-width: 765px) {
  .common-features h3 {
    font-size: 5.6vw;
  }
}
.common-features h3 {
  font-weight: 700;
  color: #0d3581;
  letter-spacing: 0.1em;
}

.common-features-wrap {
  width: 80%;
  display: flex;
  justify-content: space-between;
  margin: 0.6em auto 0;
}

.lens-3column-box {
  width: 31.5%;
  font-weight: 500;
}
.lens-3column-box .column-box-in {
  width: 100%;
  min-height: 22.4em;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding: 1.8em;
  border: 1.5px solid #4b6cb3;
}
.lens-3column-box p {
  text-align: center;
}
.lens-3column-box p.align-change {
  text-align: justify;
}

.column-box-in-wrap img {
  margin-top: 0.8em;
}

.option-price-box {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.lens-features-name {
  width: 100%;
  padding: 0.8em 0;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .lens-features-name {
    font-size: 3.9vw;
  }
}
.lens-features-name {
  font-weight: 600;
  color: #fff;
  background-color: #4b6cb3;
  text-align: center;
  line-height: 1;
}

.lens-option-wrap {
  padding-top: 10em;
}
.lens-option-wrap h2 {
  width: 65%;
  font-size: 2.5vw;
}
@media (max-width: 765px) {
  .lens-option-wrap h2 {
    font-size: 6vw;
  }
}
.lens-option-wrap h2 {
  border-bottom: 2px solid #0d3581;
  padding-bottom: 0.6em;
}

.lens-option-price {
  font-family: "Noto Serif JP", serif;
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  .lens-option-price {
    font-size: 6vw;
  }
}
.lens-option-price {
  font-weight: 600;
  white-space: nowrap;
  line-height: 1;
  margin-top: 0.3em;
}
.lens-option-price span {
  font-size: 1vw;
}
@media (max-width: 765px) {
  .lens-option-price span {
    font-size: 2.8vw;
  }
}
.lens-option-price span {
  margin-left: -0.5em;
}

.lens-option-brock {
  border-bottom: 2px solid #0d3581;
}

.lens-option-box {
  display: flex;
  justify-content: space-between;
  margin: 0.6em 0 2.8em;
}

.lens-option-box-in {
  width: 30%;
  line-height: 1;
}

.recommended-options {
  margin-top: 2.5em;
}
.recommended-options h3 {
  text-align: center;
  font-size: 2vw;
}
@media (max-width: 765px) {
  .recommended-options h3 {
    font-size: 5.6vw;
  }
}
.recommended-options h3 {
  font-weight: 700;
  color: #0d3581;
  letter-spacing: 0.1em;
}

.recommended-options-wrap {
  display: flex;
  justify-content: space-between;
  margin-top: 0.8em;
}

.lens-info {
  padding: 5em 12%;
  background-color: #eae5da;
  text-align: center;
}
.lens-info p {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .lens-info p {
    font-size: 3.9vw;
  }
}
.lens-info p {
  margin-top: 0.2em;
}
.lens-info p::before {
  content: "◆";
  display: inline-block;
  width: 1em;
  height: 1em;
  color: #0d3581;
}

.lens-info-head {
  font-size: 2.6666vw;
}
@media (max-width: 765px) {
  .lens-info-head {
    font-size: 6vw;
  }
}
.lens-info-head {
  font-weight: 700;
  color: #0d3581;
}

.lens-info-price {
  font-family: "Noto Serif JP", serif;
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  .lens-info-price {
    font-size: 6vw;
  }
}
.lens-info-price {
  font-weight: 600;
  white-space: nowrap;
  line-height: 1;
}
.lens-info-price .tax {
  font-size: 1vw;
}
@media (max-width: 765px) {
  .lens-info-price .tax {
    font-size: 2.8vw;
  }
}
.lens-info-price .tax {
  margin-left: -0.5em;
}

.page-common-wrap {
  margin-top: 3em;
  padding-top: 1.5em;
  border-top: 1px solid #000;
}
.page-common-wrap h2 {
  text-align: center;
  font-size: 2.5vw;
}
@media (max-width: 765px) {
  .page-common-wrap h2 {
    font-size: 6vw;
  }
}
.page-common-wrap:first-child {
  margin: 0;
  padding: 0 0 1.5em;
  border: none;
}
.page-common-wrap:last-child {
  padding-bottom: 4em;
}
.page-common-wrap .remarks {
  text-align: center;
  margin-bottom: 2.5em;
}

.page-common-box,
.page-common-box-1,
.page-common-box-2 {
  width: 68%;
  text-align: center;
  background-color: #fff;
  padding: 1.8em 0;
  line-height: 1.4;
  border-radius: 0.7em;
}

.page-common-box {
  padding: 1.8em 0;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .page-common-box {
    font-size: 3.9vw;
  }
}
.page-common-box {
  font-weight: 700;
  margin: 0.8em auto 0;
}

.page-common-box-1 {
  padding: 2.4em 0 1.8em;
  position: relative;
  font-size: 107%;
  margin: 0 auto 2em;
}
.page-common-box-1 span {
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .page-common-box-1 span {
    font-size: 4.4vw;
  }
}
.page-common-box-1 span {
  font-weight: 600;
}

.page-common-box-2 {
  padding: 1.5em;
  position: relative;
  font-size: 107%;
  margin: 0 auto;
}
.page-common-box-2 .emphasis {
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .page-common-box-2 .emphasis {
    font-size: 4.4vw;
  }
}
.page-common-box-2 .emphasis {
  font-weight: 600;
}

.page-common-box-text-1,
.page-common-box-text-2 {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 48%;
  padding: 0.8em 0;
  text-align: center;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .page-common-box-text-1,
  .page-common-box-text-2 {
    font-size: 3.9vw;
  }
}
.page-common-box-text-1,
.page-common-box-text-2 {
  font-weight: 600;
  color: #0d3581;
  background-color: #e7d479;
  line-height: 1;
  border-radius: 9999px;
}

.page-common-box-text-1 {
  color: #0d3581;
  background-color: #e7d479;
  top: -1.3em;
}

.page-common-box-text-2 {
  color: #fff;
  background-color: #0d3581;
  top: -0.5em;
}

.page-common-box-in-1 {
  border: 2px solid #0d3581;
  padding: 2em 0;
  border-radius: 0.3em;
  margin-bottom: 1em;
}

.page-common-box-in-2 {
  border: 2px solid #008893;
  padding: 1.2em 0;
  border-radius: 0.3em;
  position: relative;
}
.page-common-box-in-2 .after-ms {
  display: inline-block;
  font-family: "Noto Serif JP", serif;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .page-common-box-in-2 .after-ms {
    font-size: 3.9vw;
  }
}
.page-common-box-in-2 .after-ms {
  font-weight: 600;
  margin-top: 0.2em;
}
.page-common-box-in-2 .ms-arrow-bottom {
  width: 3.8%;
  position: absolute;
  top: 7.2em;
  left: 50%;
  transform: translateX(-50%);
  line-height: 1;
}

.warranty-wrap {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-top: 1.5em;
}

.warranty-box {
  width: 30%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.warranty-box p {
  text-align: center;
}
.warranty-box ul {
  width: 100%;
  font-size: 0.8333vw;
}
@media (max-width: 765px) {
  .warranty-box ul {
    font-size: 2.3vw;
  }
}
.warranty-box ul {
  white-space: nowrap;
}
.warranty-box ul .indent {
  margin-left: 1em;
}
.warranty-box ul.green li::before {
  content: "●";
  display: inline-block;
  width: 1em;
  height: 1em;
  color: #007f41;
}
.warranty-box ul.red li::before {
  content: "●";
  display: inline-block;
  width: 1em;
  height: 1em;
  color: #c8161d;
}
.warranty-box ul.gray li::before {
  content: "●";
  display: inline-block;
  width: 1em;
  height: 1em;
  color: #3e3f3f;
}

.warranty-name {
  width: 100%;
  text-align: center;
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .warranty-name {
    font-size: 5.1vw;
  }
}
.warranty-name {
  font-weight: 700;
  padding: 0.7em 0;
  margin-bottom: 0.5em;
  color: #fff;
  line-height: 1;
}
.warranty-name.color-1 {
  background-color: #007f41;
}
.warranty-name.color-2 {
  background-color: #c8161d;
}
.warranty-name.color-3 {
  background-color: #3e3f3f;
}

.warranty-arrow {
  width: 7%;
  margin: 0.5em 0 0.3em;
  line-height: 1;
}

.warranty-explanation {
  width: 100%;
  height: 6.8em;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .warranty-explanation {
    font-size: 3.9vw;
  }
}
.warranty-explanation {
  font-weight: 700;
  background-color: #fff;
  line-height: 1.4;
  text-align: center;
  margin-bottom: 0.5em;
}

.not-applicable {
  width: 100%;
  text-align: left;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .not-applicable {
    font-size: 3.9vw;
  }
}
.not-applicable {
  font-weight: 700;
  color: #007f41;
}

.ms-main-title {
  font-size: 3.5vw;
}
@media (max-width: 765px) {
  .ms-main-title {
    font-size: 7.45vw;
  }
}
.ms-main-title {
  font-weight: 700;
  text-align: center;
  color: #008893;
  letter-spacing: 0.08em;
  margin-top: 1em;
}

.ms-wrap {
  text-align: center;
}

.ms-top-brock {
  background-color: #008893;
  color: #fff;
  margin-top: 1em;
  padding: 2.4em 0;
  line-height: 1;
  border-radius: 0.7em;
}
.ms-top-brock .ms-brock-head {
  font-size: 3.1666vw;
}
@media (max-width: 765px) {
  .ms-top-brock .ms-brock-head {
    font-size: 7vw;
  }
}
.ms-top-brock .ms-brock-head {
  font-weight: 500;
  letter-spacing: 0.1em;
}
.ms-top-brock .ms-brock-head span {
  color: #e1d38f;
}
.ms-top-brock .ms-brock-catch {
  font-family: "Noto Serif JP", serif;
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .ms-top-brock .ms-brock-catch {
    font-size: 5.1vw;
  }
}
.ms-top-brock .ms-brock-catch {
  font-weight: 600;
  margin: 0.6em;
}
.ms-top-brock .lens-maker {
  width: 50%;
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .ms-top-brock .lens-maker {
    font-size: 5.1vw;
  }
}
.ms-top-brock .lens-maker {
  font-weight: 700;
  padding: 0.45em 0;
  margin: 0 auto 0.5em;
  letter-spacing: 0.1em;
  background: linear-gradient(to right, rgba(13, 53, 129, 0) 0%, rgb(13, 53, 129) 15%, rgb(13, 53, 129) 85%, rgba(13, 53, 129, 0) 100%);
}
.ms-top-brock .select-lens {
  width: 36%;
  margin: 0 auto;
}

.jms-brock,
.msp-brock {
  width: 58%;
  padding: 1.7em 0;
  margin: 7em auto 0;
  font-weight: 700;
  color: #fff;
  line-height: 1;
  border-radius: 0.7em;
}
.jms-brock .age-range,
.msp-brock .age-range {
  width: 70%;
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .jms-brock .age-range,
  .msp-brock .age-range {
    font-size: 4.4vw;
  }
}
.jms-brock .age-range,
.msp-brock .age-range {
  border-bottom: 1px solid #fff;
  padding-bottom: 0.5em;
  margin: 0 auto 0.5em;
}
.jms-brock .ms-title,
.msp-brock .ms-title {
  font-size: 2vw;
}
@media (max-width: 765px) {
  .jms-brock .ms-title,
  .msp-brock .ms-title {
    font-size: 5.6vw;
  }
}

.jms-brock {
  background-color: #679944;
}

.msp-brock {
  background-color: #435c99;
}

.ms-explanation {
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .ms-explanation {
    font-size: 5.1vw;
  }
}
.ms-explanation {
  font-weight: 600;
  margin-top: 0.4em;
}

.ms-image-title {
  width: 57%;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .ms-image-title {
    font-size: 3.9vw;
  }
}
.ms-image-title {
  font-weight: 600;
  text-align: center;
  border-top: 1.5px solid #000;
  border-bottom: 1.5px solid #000;
  padding: 0.6em 0;
  line-height: 1;
  margin: 1.8em auto 1em;
}

.jms-image {
  width: 80%;
  margin: 0 auto;
}

.ms-free-exchange-1,
.ms-free-exchange-2 {
  width: 46%;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .ms-free-exchange-1,
  .ms-free-exchange-2 {
    font-size: 3.9vw;
  }
}
.ms-free-exchange-1,
.ms-free-exchange-2 {
  font-weight: 700;
  line-height: 1;
  padding: 0.4em 0 0.8em;
  color: #fff;
  border-radius: 9999px;
  margin: 1em auto;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  letter-spacing: 0.1em;
}
.ms-free-exchange-1 span,
.ms-free-exchange-2 span {
  font-size: 130%;
}
.ms-free-exchange-1 .number-size,
.ms-free-exchange-2 .number-size {
  font-size: 160%;
  transform: translateY(0.06em);
}

.ms-free-exchange-1 {
  background-color: #679944;
}

.ms-free-exchange-2 {
  background-color: #435c99;
}

.ms-flow-text {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .ms-flow-text {
    font-size: 3.9vw;
  }
}
.ms-flow-text {
  font-weight: 500;
  text-align: left;
  margin: 0.8em auto;
  display: inline-block;
}
.ms-flow-text .warranty-type {
  font-weight: 700;
}
.ms-flow-text .dot {
  font-weight: 400;
}
.ms-flow-text span {
  margin-right: 0.2em;
}

.ms-image-text {
  font-family: "Noto Serif JP", serif;
  font-size: 2vw;
}
@media (max-width: 765px) {
  .ms-image-text {
    font-size: 5.6vw;
  }
}
.ms-image-text {
  font-weight: 600;
  color: #c8161d;
}

.msp-image {
  width: 55%;
  display: flex;
  justify-content: space-between;
  margin: 0.5em auto 2em;
  line-height: 1;
}

.msp-img-left,
.msp-img-center,
.msp-img-right {
  width: 30%;
  background-repeat: no-repeat;
  background-size: contain;
  padding: 10.5em 2.5em 0;
}

.msp-img-left {
  background-image: url("../image/msp-img-01bg.webp");
}

.msp-img-center {
  background-image: url("../image/msp-img-02bg.webp");
}

.msp-img-right {
  background-image: url("../image/msp-img-03bg.webp");
}

.ms-caption {
  text-align: center;
}
.ms-caption::before {
  content: "◆";
  display: inline-block;
  width: 1em;
  height: 1em;
  color: #0d3581;
}

#videoOverlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 10000;
}
#videoOverlay.show {
  display: flex;
}

/* 動画モーダルはブランド用より大きく */
#videoContent {
  position: relative;
  width: 90%;
  height: auto;
  max-height: 90vh;
  aspect-ratio: 16/9;
  background: #000;
  border-radius: 1em;
  overflow: hidden;
  /* 閉じるボタン */
}
#videoContent #videoClose {
  position: absolute;
  top: 8px;
  right: 10px;
  font-size: 28px;
  line-height: 1;
  border: 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
  z-index: 1;
  outline: none;
  box-shadow: none;
}
#videoContent #videoClose:focus, #videoContent #videoClose:focus-visible {
  outline: none;
  box-shadow: none;
}
#videoContent video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

/* 背景スクロール抑止用 */
body.modal-open {
  overflow: hidden;
  touch-action: none;
}

.jrms-manga-wrap {
  width: 65%;
  margin: 0 auto 6em;
}

.jrms-img {
  width: 100%;
  margin: 0 auto;
  line-height: 1;
}
.jrms-img img {
  margin-bottom: 2em;
  border: 1px solid #000;
}
.jrms-img img:last-child {
  margin: 0;
}
.jrms-img p {
  text-align: right;
  margin-bottom: 6em;
}

.jrms_banner {
  width: 100%;
  line-height: 1;
  margin-bottom: 7em;
}
.jrms_banner a {
  width: 100%;
}

.privacypolicy-wrap {
  padding: 0 15%;
}

.privacypolicy-brock {
  margin-bottom: 3em;
}
.privacypolicy-brock ul {
  margin-top: 0.4em;
  line-height: 1.8;
}
.privacypolicy-brock ul.weight {
  font-weight: 500;
}
.privacypolicy-brock ul.google-box li {
  line-height: 1.4;
  margin-top: 0.8em;
}
.privacypolicy-brock ul.google-box li p {
  font-weight: 700;
}
.privacypolicy-brock ul.google-box li a {
  color: #4b6cb3;
  font-weight: 500;
}
.privacypolicy-brock Li {
  text-indent: -1em;
  padding-left: 1em;
}
.privacypolicy-brock p.text-red {
  color: #c8161d;
  text-indent: -1em;
  padding-left: 1em;
}

.privacypolicy-head {
  font-size: 2vw;
}
@media (max-width: 765px) {
  .privacypolicy-head {
    font-size: 5.6vw;
  }
}
.privacypolicy-head {
  font-weight: 700;
}

.privacypolicy-admin {
  font-weight: 500;
  margin-top: 5em;
}

.hearingaid-introduction {
  text-align: center;
  margin-top: 0.5em;
}

.hearingaid-top-img {
  margin: 1.5em auto 1em;
  width: 38%;
}

.hearingaid-wrap h3 {
  color: #0d3581;
  font-size: 2vw;
}
@media (max-width: 765px) {
  .hearingaid-wrap h3 {
    font-size: 5.6vw;
  }
}
.hearingaid-wrap h3 {
  text-align: center;
  font-weight: 700;
}

.symptoms-wrap {
  width: 84%;
  background: #fff;
  margin: 1em auto 2.8em;
  padding: 2.5% 3% 3%;
}
.symptoms-wrap p {
  display: block;
  text-align: center;
  background-color: #eae9ed;
  margin-top: 1em;
  padding: 0.8em;
}

.symptoms-wrap-in {
  display: flex;
}
.symptoms-wrap-in ul {
  width: 50%;
  font-family: "Noto Serif JP", serif;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .symptoms-wrap-in ul {
    font-size: 3.9vw;
  }
}
.symptoms-wrap-in ul {
  font-weight: 700;
  line-height: 1.8;
}

.hearing-brock {
  width: 90%;
  margin: 1em auto;
}

.hearing-brock-arrow {
  position: absolute;
  bottom: -2.5em;
  left: 50%;
  transform: translateX(-50%);
  width: 7%;
  margin: 0.5em 0 0.3em;
  line-height: 1;
}

.column-box {
  background: #fff;
  width: 100%;
  height: 16.5em;
  position: relative;
}

.hearing-brock-top {
  display: flex;
  justify-content: space-between;
  margin-bottom: 2.5em;
}
.hearing-brock-top .column-left {
  width: 31%;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}
.hearing-brock-top .column-right {
  width: 65.5%;
  display: flex;
  flex-direction: column;
}
.hearing-brock-top .column-right-in {
  display: flex;
  justify-content: space-between;
}
.hearing-brock-top .column-right-in .column-box {
  width: 47.3282%;
}

.column-box-head {
  font-weight: 800;
  text-align: center;
  padding: 0.5em 0;
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .column-box-head {
    font-size: 5.1vw;
  }
}

.column-box-body {
  padding: 2em 0;
  text-align: center;
}
.column-box-body .note {
  margin-top: 0.5em;
}

.child-column {
  display: flex;
  padding-left: 2em;
}
.child-column ul {
  width: 50%;
  font-weight: 600;
  text-align: left;
  padding-left: 0.5em;
}

.hearing-brock-bottom {
  display: grid;
  grid-template-columns: 1fr 2.1fr;
  gap: 2em;
  line-height: 1.3;
}

.bottom-in-1,
.bottom-in-2 {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2.2em;
  text-align: center;
}

.bottom-in-1 {
  background: #b9b475;
  line-height: 1.4;
  padding: 1.2em 0;
}

.bottom-in-2 {
  background: #0d3581;
  color: #fff;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .bottom-in-2 {
    font-size: 3.9vw;
  }
}
.bottom-in-2 {
  font-weight: 600;
  padding: 1.237em 0;
}

.hearingaid-content-wrap {
  padding-top: 5em;
}
.hearingaid-content-wrap h2 {
  text-align: center;
  font-size: 2.5vw;
}
@media (max-width: 765px) {
  .hearingaid-content-wrap h2 {
    font-size: 6vw;
  }
}
.hearingaid-content-wrap h2 {
  border-bottom: 2px solid #0d3581;
  padding-bottom: 0.4em;
}

.first-hearingaid-flow {
  padding: 5.5% 0 0 7%;
}
.first-hearingaid-flow ul {
  margin-bottom: 3.4em;
}
.first-hearingaid-flow ul:last-child {
  margin: 0;
}
.first-hearingaid-flow li {
  display: flex;
  justify-content: space-between;
  position: relative;
}
.first-hearingaid-flow li .step-number {
  width: 32%;
}
.first-hearingaid-flow li .step-number P {
  padding: 1.4em 0;
  background-color: #4b6cb3;
  color: #fff;
  text-align: center;
  border-radius: 9999px;
  line-height: 1;
  position: relative;
  z-index: 1;
}
.first-hearingaid-flow li .step-number P span {
  display: block;
  font-family: "Noto Serif JP", serif;
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  .first-hearingaid-flow li .step-number P span {
    font-size: 6vw;
  }
}
.first-hearingaid-flow li .step-number P span {
  font-weight: 600;
}
.first-hearingaid-flow li .hearingaid-flow-box {
  width: 40%;
  display: flex;
  justify-content: space-between;
}
.first-hearingaid-flow li .hearingaid-flow-item {
  width: 65%;
  padding: 1.4em 0;
  background-color: #eae5da;
  text-align: center;
  border-radius: 9999px;
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .first-hearingaid-flow li .hearingaid-flow-item {
    font-size: 5.1vw;
  }
}
.first-hearingaid-flow li .hearingaid-flow-item {
  font-weight: 600;
  line-height: 1;
}
.first-hearingaid-flow li .hearingaid-flow-body {
  width: 58%;
  display: flex;
  align-items: center;
}

.hearingaid-flow-arrow {
  width: 2.2%;
  position: absolute;
  bottom: -3.6em;
  left: 6.5%;
  transform: translate(-50%, -100%);
  transition: transform 0.45s ease, opacity 0.45s ease;
  z-index: -1;
}

.hearingaid-flow-arrow.is-in {
  transform: translate(-50%, 0);
}

.rabio-box {
  text-align: center;
  margin-top: 2em;
}
.rabio-box .shoulder-copy {
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .rabio-box .shoulder-copy {
    font-size: 4.4vw;
  }
}
.rabio-box .shoulder-copy {
  font-weight: 600;
  color: #0d3581;
  letter-spacing: 0.1em;
}
.rabio-box .rabio-logo {
  width: 24%;
  margin: 0 auto;
  line-height: 1;
}
.rabio-box p {
  font-size: 2vw;
}
@media (max-width: 765px) {
  .rabio-box p {
    font-size: 5.6vw;
  }
}
.rabio-box p {
  font-weight: 600;
  font-family: "Noto Serif JP", serif;
  letter-spacing: 0.1em;
}

.rabio-item-box {
  display: flex;
  margin-top: 0.8em;
}

.rabio-item {
  width: 50%;
  display: flex;
  flex-direction: column;
}
.rabio-item .item-title {
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .rabio-item .item-title {
    font-size: 4.4vw;
  }
}
.rabio-item .item-title {
  font-weight: 600;
  color: #fff;
  background: #4b6cb3;
  padding: 0.4em 0;
}
.rabio-item.rabio-1 {
  padding-right: 3%;
  border-right: 1px solid #000;
}
.rabio-item.rabio-2 {
  padding-left: 3%;
}

.rabio-caption {
  margin-top: 1em;
}

.rabio-price {
  text-align: center;
  margin: 1em 0 0.5em;
}
.rabio-price span.price-1 {
  font-size: 2vw;
}
@media (max-width: 765px) {
  .rabio-price span.price-1 {
    font-size: 5.6vw;
  }
}
.rabio-price span.price-1 {
  font-weight: 700;
  color: #c8161d;
  margin-right: 0.5em;
}
.rabio-price span.price-2 {
  font-family: "Noto Serif JP", serif;
  font-size: 2.6666vw;
}
@media (max-width: 765px) {
  .rabio-price span.price-2 {
    font-size: 6vw;
  }
}
.rabio-price span.price-2 {
  font-weight: 600;
  color: #c8161d;
}
.rabio-price span.price-3 {
  font-family: "Noto Serif JP", serif;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .rabio-price span.price-3 {
    font-size: 3.9vw;
  }
}
.rabio-price span.price-3 {
  font-weight: 600;
  color: #c8161d;
}
.rabio-price span.price-4 {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .rabio-price span.price-4 {
    font-size: 3.9vw;
  }
}
.rabio-price span.price-4 {
  font-weight: 600;
  color: #c8161d;
  margin: 0 0.3em;
}
.rabio-price span.price-5 {
  color: #c8161d;
}

.hearingaid-value {
  text-align: center;
  padding-top: 5em;
}
.hearingaid-value .value-head {
  font-size: 2.5vw;
}
@media (max-width: 765px) {
  .hearingaid-value .value-head {
    font-size: 6vw;
  }
}
.hearingaid-value .value-head {
  font-weight: 700;
  color: #c8161d;
  letter-spacing: 0.1em;
}
.hearingaid-value .value-wrap {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  margin: 0.5em 0 0.3em;
}
.hearingaid-value .maker-price {
  font-size: 1.5vw;
}
@media (max-width: 765px) {
  .hearingaid-value .maker-price {
    font-size: 4.4vw;
  }
}
.hearingaid-value .maker-price {
  font-weight: 700;
}
.hearingaid-value .waribiki {
  width: 26%;
  margin: 0 0.5em;
}
.hearingaid-value .w-value {
  font-size: 1.6666vw;
}
@media (max-width: 765px) {
  .hearingaid-value .w-value {
    font-size: 5.1vw;
  }
}
.hearingaid-value .w-value {
  font-weight: 600;
}
.hearingaid-value .w-value::before {
  content: "◆";
  width: 1em;
  height: 1em;
  color: #c8161d;
}

.signia-wrap {
  margin-top: 4.4em;
}
.signia-wrap .signia-title {
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  .signia-wrap .signia-title {
    font-size: 6vw;
  }
}
.signia-wrap .signia-title {
  font-weight: 700;
  color: #c8161d;
  text-align: center;
  padding: 0.5em;
  border-top: 2px solid #c8161d;
  border-bottom: 2px solid #c8161d;
  line-height: 1;
}

.signia-box {
  width: 100%;
  display: flex;
  justify-content: space-between;
  position: relative;
  margin-top: 2.5em;
}
.signia-box .signia-item {
  width: 28%;
}
.signia-box::before {
  content: "";
  position: absolute;
  top: 0;
  width: 1px;
  height: 100%;
  background: #000;
  left: 32%;
  transform: translateX(-50%);
}
.signia-box::after {
  content: "";
  position: absolute;
  top: 0;
  width: 1px;
  height: 100%;
  background: #000;
  left: 68%;
  transform: translateX(-50%);
}

.hearingaid-others {
  display: flex;
  justify-content: space-between;
  margin: 7em 0;
}
.hearingaid-others .others-box {
  width: 48%;
  line-height: 1;
}

.hearingaid-maker-wrap p {
  text-align: center;
}

.hearingaid-maker-head {
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  .hearingaid-maker-head {
    font-size: 6vw;
  }
}
.hearingaid-maker-head {
  font-weight: 700;
  border-top: 2px solid #0d3581;
  color: #0d3581;
  text-align: center;
  padding-top: 0.3em;
}

.hearingaid-maker {
  display: flex;
  justify-content: space-between;
}
.hearingaid-maker .maker-logo img {
  width: auto;
  height: 6.3em;
}

/* お問い合わせ */
#form-box .mw-note {
  font-size: 1.1666vw;
}
@media (max-width: 765px) {
  #form-box .mw-note {
    font-size: 3.5vw;
  }
}
#form-box .mw-note {
  margin: 3em 0 1em;
  color: #c00;
}

.form-information {
  display: flex;
  width: 100%;
  margin-top: 4em;
}

.security-block {
  display: flex;
  width: 40%;
}
.security-block .ItemRA {
  width: 14%;
  line-height: 1;
}
.security-block .ItemRA input {
  width: 100%;
}
.security-block p {
  width: 86%;
  padding-left: 1em;
  font-size: 1vw;
}
@media (max-width: 765px) {
  .security-block p {
    font-size: 2.8vw;
  }
}
.security-block p {
  line-height: 1.5;
}

.form-information-in {
  width: 60%;
  border-left: 1px solid #0d3581;
  padding-left: 1em;
}

.mw-form {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .mw-form {
    font-size: 3.9vw;
  }
}

.mw-row {
  display: grid;
  grid-template-columns: 20% 80%;
  padding: 2em 0;
  border-bottom: 1px solid #0d3581;
}
.mw-row:first-child {
  border-top: 1px solid #0d3581;
}
.mw-row.mw-row-message {
  align-items: flex-start;
}

.mw-label {
  display: flex;
  align-items: center;
  font-weight: 600;
}

.mw-field-1 {
  width: 100%;
}
.mw-field-1 p {
  display: flex;
  align-items: center;
}
.mw-field-1.mw-zip {
  width: 36%;
}
.mw-field-1.mw-zip p {
  display: flex;
  align-items: center;
}

.mw-field-2.mw-radio {
  padding: 0.65em 0;
}
.mw-field-2.tel {
  width: 60%;
}
.mw-field-2 p {
  margin-left: 4.5em;
}

.mw-input,
.mw-textarea {
  width: 100%;
  background: #fff;
  border: none;
  padding: 1em;
  position: relative;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .mw-input,
  .mw-textarea {
    font-size: 3.9vw;
  }
}

.mw-textarea {
  min-height: 12em;
  resize: vertical;
}

/* 2カラム（姓・名など） */
.mw-2col {
  display: grid;
  grid-template-columns: 36% 36%;
}

.mw-sub {
  display: flex;
  align-items: center;
}
.mw-sub p {
  display: flex;
  align-items: center;
}

.mw-sub-label {
  width: 4.6em;
  text-align: right;
  padding-right: 0.5em;
  white-space: nowrap;
}

.mw-prefix {
  width: 4.6em;
  text-align: right;
  padding-right: 0.5em;
}

/* 住所 */
.mw-address .mw-line {
  width: 36%;
  margin-bottom: 2em;
}
.mw-address .mw-line:last-child {
  margin-bottom: 0;
}
.mw-address .mw-line.pref .mw-input {
  text-align: center;
}
.mw-address .mw-line-1 .wpcf7-form-control-wrap {
  width: 91% !important;
}
.mw-address .mw-line-1.city {
  margin-bottom: 2em;
}

/* 年齢 */
.mw-age {
  width: 45.5%;
}
.mw-age p {
  display: flex;
  align-items: center;
}

.mw-suffix {
  margin-left: 0.5em;
}

/* 性別 */
.mw-radio .wpcf7-list-item {
  margin: 0 3em 0 0;
}

/* ボタン */
.mw-actions {
  display: flex;
  justify-content: center;
  margin-top: 2em;
}
.mw-actions p {
  display: flex;
  justify-content: space-between;
  width: 45.5%;
}
.mw-actions .mw-btn {
  border: none;
  color: #ffffff;
  padding: 0.6em 0;
  cursor: pointer;
  text-align: center;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .mw-actions .mw-btn {
    font-size: 3.9vw;
  }
}
.mw-actions .mw-btn {
  font-weight: 500;
  width: 45%;
  border-radius: 9999px;
}
.mw-actions .mw-btn-primary {
  background: #0d3581;
}
.mw-actions .mw-btn-clear {
  background: #007f41;
}
.mw-actions br {
  display: none;
}

.wpcf7-form-control-wrap {
  width: 74%;
}

.wpcf7-not-valid-tip {
  position: absolute;
  font-size: 0.9em;
}

.wpcf7 form.invalid .wpcf7-response-output {
  color: #dc3232;
  border: none;
  margin: 2em 0 1em;
  padding: 0;
}

.wpcf7-spinner {
  width: 2em;
  height: 2em;
  margin: 0;
}

#send-info {
  width: 75%;
  margin: 4em auto 1.5em;
}

table.confirmation {
  width: 75%;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  table.confirmation {
    font-size: 3.9vw;
  }
}
table.confirmation {
  margin: 0 auto;
}
table.confirmation tr {
  border-bottom: 1px solid #000;
}
table.confirmation tr:first-child {
  border-top: 1px solid #000;
}
table.confirmation th {
  width: 25%;
  border-right: 1px solid #000;
  background: #c9c3bb;
  text-align: left;
  padding-left: 1.5em;
}
table.confirmation td {
  width: 75%;
  padding: 1.8em 0 1.8em 1.5em;
}

.contact_btn_box {
  width: 100%;
  display: flex;
  justify-content: center;
}

.contact_btn {
  width: 18.5%;
  margin: 2em 1em 0;
}

.wpcf7-submit {
  width: 100%;
  padding: 0.6em 0;
  background: #0d3581;
  color: #fff;
  border: none;
  border-radius: 9999px;
  cursor: pointer;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .wpcf7-submit {
    font-size: 3.9vw;
  }
}
.wpcf7-submit {
  font-weight: 500;
}

.wpcf7-previous {
  width: 100%;
  padding: 0.6em 0;
  background: #007f41;
  color: #fff;
  border: none;
  border-radius: 9999px;
  cursor: pointer;
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .wpcf7-previous {
    font-size: 3.9vw;
  }
}
.wpcf7-previous {
  font-weight: 500;
}

.your-message p {
  white-space: pre-wrap;
}

.page-complete {
  display: flex;
  flex-direction: column;
  min-height: calc(100dvh - var(--headerH));
}

.page-complete > section {
  flex: 1;
}

#complete-message {
  text-align: center;
  margin-top: 5em;
}
#complete-message p {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  #complete-message p {
    font-size: 3.9vw;
  }
}
#complete-message p span {
  font-size: 2.25vw;
}
@media (max-width: 765px) {
  #complete-message p span {
    font-size: 6vw;
  }
}
#complete-message p span {
  font-family: "Noto Serif JP", serif;
  font-weight: 600;
  display: inline-block;
  margin-bottom: 0.3em;
}

#return-home {
  font-weight: 600;
  width: 19.5%;
  color: #fff;
  margin: 2em auto 0;
  background: #0d3581;
  border-radius: 9999px;
}
#return-home a {
  display: block;
  padding: 1em 0;
}

.flyer-single {
  margin-top: 2.5em;
}

.flyer-single__inner {
  width: 100%;
}

.flyer-gallery {
  display: flex;
  flex-direction: column;
}

.flyer-gallery__item {
  display: block;
  border: 1px solid #cccccc;
  margin-bottom: 3em;
}

/* PhotoSwipe 拡大縮小ボタン */
.pswp__button--custom-zoom-in,
.pswp__button--custom-zoom-out {
  width: 44px;
  height: 44px;
  font-size: 24px;
  line-height: 1;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pswp__button--custom-zoom-in::before,
.pswp__button--custom-zoom-out::before {
  display: none;
}

#toolbarViewerRight {
  display: none !important;
}

.contactlens-notes {
  font-size: 1vw;
}
@media (max-width: 765px) {
  .contactlens-notes {
    font-size: 2.8vw;
  }
}
.contactlens-notes {
  margin: 0.5em 0 0 1em;
}
.contactlens-notes::before {
  content: "※";
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-left: -1em;
}

.topics-slider-dots {
  display: flex;
  justify-content: center;
  gap: 1.8em;
  position: absolute;
  bottom: 5em;
  left: 50%;
  transform: translateX(-50%);
}

.topics-slider-dot {
  width: 0.6em;
  height: 0.6em;
  border-radius: 50%;
  border: none;
  background: #ccc;
  cursor: pointer;
}

.topics-slider-dot.is-active {
  background: #000;
}

#container404 {
  min-height: 75vh;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}
#container404 h1 span {
  color: #007f41;
}
#container404 p {
  margin: 1.5em 0;
}

.lead-404 {
  font-size: 1.3333vw;
}
@media (max-width: 765px) {
  .lead-404 {
    font-size: 3.9vw;
  }
}
.lead-404 {
  font-weight: 600;
}

.return-404-btn {
  width: 18%;
  background-color: #007f41;
  border-radius: 9999px;
  text-align: center;
  font-weight: 600;
  color: #fff;
  margin: 0 auto 3em;
}
.return-404-btn a {
  display: block;
  padding: 1em 0;
}

.pc-none {
  display: none;
}

@media (min-width: 760px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}
/* ページ内リンク位置調節 */
#jms,
#ms,
#superbrand {
  scroll-margin-top: 80px;
}/*# sourceMappingURL=common.css.map */