@charset "UTF-8";

/*======================================
    Variables
======================================*/
:root {
  --anchor-scroll-offset: 106px;
  /* 768px〜1440pxで線形補間（1440px超は最大値で固定、768px以下はmax-widthメディアで上書き） */
  --fluid-min-vw: 768px;
  --fluid-span: 672;
  /* 375px〜768px: 375で従来SPサイズ、768でその2倍まで線形補間 */
  --fluid-sp-min-vw: 375px;
  --fluid-sp-span: 393;
  /* PC: メインビジュアルコピー(28→55px)と同じ比率でレイアウト値をスケール */
  --fluid-pc-mul: min(1, max(calc(28px / 55px), calc((28px + 27 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)) / 55px)));
}

@media screen and (max-width: 768px) {
  :root {
    /* SP: 375pxで1倍・768pxで2倍（フォントと同じ倍率） */
    --fluid-sp-mul: min(2, max(1, calc(1 + (100vw - var(--fluid-sp-min-vw)) / 393px)));
  }
}

/*======================================
    上書きスタイル
======================================*/
.drawer-icon {
  top: clamp(36px, calc(36px * var(--fluid-sp-mul)), calc(36px * 2));
  right: clamp(44px, calc(44px * var(--fluid-sp-mul)), calc(44px * 2));
}

.drawer-bars {
  width: clamp(28px, calc(28px * var(--fluid-sp-mul)), calc(28px * 2));
  height: clamp(16px, calc(16px * var(--fluid-sp-mul)), calc(16px * 2));
}

/*======================================
    Base
======================================*/
html {
  scroll-behavior: smooth;
  /* scroll-padding-top: var(--anchor-scroll-offset); */
}

body {}

/*======================================
    common
======================================*/
/* c-button */
.c-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: clamp(calc(291px * 28 / 55), calc(291px * var(--fluid-pc-mul)), 291px);
  height: clamp(calc(80px * 28 / 55), calc(80px * var(--fluid-pc-mul)), 80px);
  border-radius: clamp(calc(40px * 28 / 55), calc(40px * var(--fluid-pc-mul)), 40px);
  background-color: #0680c8;
  color: #fff;
  font-size: clamp(17px, calc(17px + 9 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 26px);
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .c-button {
    width: clamp(209px, calc(209px * var(--fluid-sp-mul)), calc(209px * 2));
    height: clamp(57px, calc(57px * var(--fluid-sp-mul)), calc(57px * 2));
    border-radius: clamp(28.5px, calc(28.5px * var(--fluid-sp-mul)), calc(28.5px * 2));
    font-size: clamp(17px, calc(17px + (100vw - var(--fluid-sp-min-vw)) * 17 / var(--fluid-sp-span)), 34px);
  }
}

/* c-contact-btn */
.c-contact-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: clamp(calc(134px * 28 / 55), calc(134px * var(--fluid-pc-mul)), 134px);
  max-width: 100%;
  height: clamp(calc(37px * 28 / 55), calc(37px * var(--fluid-pc-mul)), 37px);
  border: 1.35px solid #000;
  border-radius: clamp(calc(18.5px * 28 / 55), calc(18.5px * var(--fluid-pc-mul)), 18.5px);
  letter-spacing: 0.1em;
}

.c-contact-btn::after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(55%, -50%);
  z-index: 1;
  width: clamp(calc(32px * 28 / 55), calc(32px * var(--fluid-pc-mul)), 32px);
  height: clamp(calc(20px * 28 / 55), calc(20px * var(--fluid-pc-mul)), 20px);
  background: url(../img/renewal/arrow-icon-next.svg) no-repeat right center / contain;
  transition: transform 0.3s ease;
}

.c-contact-btn:hover::after {
  transform: translate(65%, -50%);
}

/* c-section-title */
.c-section-title {}

.c-section-title__main {
  font-size: clamp(20px, calc(20px + 8 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 28px);
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.995;
}

@media screen and (max-width: 768px) {
  .c-section-title__main {
    font-size: clamp(20px, calc(20px + (100vw - var(--fluid-sp-min-vw)) * 20 / var(--fluid-sp-span)), 40px);
    line-height: 1.551;
    letter-spacing: 0.1em;
  }
}

.c-section-title:has(.c-section-title__sub) .c-section-title__main {
  font-size: clamp(24px, calc(24px + 12 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 36px);
  letter-spacing: 0.18em;
}

@media screen and (max-width: 768px) {
  .c-section-title:has(.c-section-title__sub) .c-section-title__main {
    font-size: clamp(24px, calc(24px + (100vw - var(--fluid-sp-min-vw)) * 24 / var(--fluid-sp-span)), 48px);
    line-height: 1.49041667;
    letter-spacing: 0;
    text-align: center;
  }
}

.c-section-title__sub {
  font-family: "Helvetica";
  font-size: clamp(15px, calc(15px + 9 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 24px);
  font-weight: 700;
  letter-spacing: 0.025em;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .c-section-title__sub {
    margin-top: clamp(10px, calc(10px * var(--fluid-sp-mul)), calc(10px * 2));
    font-size: clamp(15px, calc(15px + (100vw - var(--fluid-sp-min-vw)) * 15 / var(--fluid-sp-span)), 30px);
    letter-spacing: 0.025em;
    text-align: center;
  }
}

/* 表示非表示 */
.u-show-sp {
  display: none;
}

@media screen and (max-width: 768px) {
  .u-show-sp {
    display: block;
  }
}

.u-show-pc {
  display: block;
}

@media screen and (max-width: 768px) {
  .u-show-pc {
    display: none;
  }
}

/*======================================
    l-inner
======================================*/
.l-inner {
  width: calc(1080px + (20px * 2));
  max-width: 100%;
  padding-right: 20px;
  padding-left: 20px;
  margin-right: auto;
  margin-left: auto;
}

@media screen and (max-width: 768px) {
  .l-inner {
    width: calc(1080px + (34px * 2));
    padding-right: clamp(34px, calc(34px * var(--fluid-sp-mul)), calc(34px * 2));
    padding-left: clamp(34px, calc(34px * var(--fluid-sp-mul)), calc(34px * 2));
  }
}

/*======================================
    l-header
======================================*/
.l-header {
  display: flex;
  align-items: center;
  position: fixed;
  top: clamp(calc(30px * 28 / 55), calc(30px * var(--fluid-pc-mul)), 30px);
  right: 0;
  left: 0;
  z-index: 100;
  width: 97%;
  height: clamp(calc(76px * 28 / 55), calc(76px * var(--fluid-pc-mul)), 76px);
  margin-right: auto;
  margin-left: auto;
  border-radius: clamp(calc(38px * 28 / 55), calc(38px * var(--fluid-pc-mul)), 38px);
  background-color: #fff;
  box-shadow: clamp(calc(7px * 28 / 55), calc(7px * var(--fluid-pc-mul)), 7px) clamp(calc(7px * 28 / 55), calc(7px * var(--fluid-pc-mul)), 7px) clamp(calc(5px * 28 / 55), calc(5px * var(--fluid-pc-mul)), 5px) rgba(0, 0, 0, 0.3);
}

@media screen and (max-width: 768px) {
  .l-header {
    top: clamp(17px, calc(17px * var(--fluid-sp-mul)), calc(17px * 2));
    width: 92%;
    height: clamp(54px, calc(54px * var(--fluid-sp-mul)), calc(54px * 2));
    border-radius: clamp(27px, calc(27px * var(--fluid-sp-mul)), calc(27px * 2));
  }
}

.l-header__inner {
  width: 100%;
  padding-right: clamp(calc(37px * 28 / 55), calc(37px * var(--fluid-pc-mul)), 37px);
  padding-left: clamp(calc(40px * 28 / 55), calc(40px * var(--fluid-pc-mul)), 40px);
}

@media screen and (max-width: 768px) {
  .l-header__inner {
    padding-right: clamp(23px, calc(23px * var(--fluid-sp-mul)), calc(23px * 2));
    padding-left: clamp(23px, calc(23px * var(--fluid-sp-mul)), calc(23px * 2));
  }
}

.l-header__wrap {
  display: grid;
  grid-template-columns: clamp(calc(187px * 28 / 55), calc(187px * var(--fluid-pc-mul)), 187px) auto;
  width: 100%;
}

@media screen and (max-width: 768px) {
  .l-header__wrap {
    grid-template-columns: clamp(116px, calc(116px * var(--fluid-sp-mul)), calc(116px * 2)) auto;
  }
}

.l-header__logo {
  position: relative;
}

.l-header__logo a {
  display: flex;
  align-items: center;
  width: 100%;
  height: clamp(calc(44px * 28 / 55), calc(44px * var(--fluid-pc-mul)), 44px);
}
.l-header__modal-btn {
  position: absolute;
  top: 50%;
  right: clamp(calc(-32px * 28 / 55), calc(-32px * var(--fluid-pc-mul)), -32px);
  transform: translate(100%, -42%);
  z-index: 1;
  width: clamp(calc(130px * 28 / 55), calc(130px * var(--fluid-pc-mul)), 130px);
  height: clamp(calc(42px * 28 / 55), calc(42px * var(--fluid-pc-mul)), 42px);
}

.l-header__modal-btn a {
  transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), filter 0.28s ease;
  transform: translateY(0);
  will-change: transform;
}

.l-header__modal-btn a:hover,
.l-header__modal-btn a:focus-visible {
  transform: translateY(-4px);
  filter: drop-shadow(0 8px 14px rgba(0, 0, 0, 0.18));
}

.l-header__modal-btn a:active {
  transform: translateY(-2px) scale(0.98);
}

.l-header__modal-btn a img {
  transition: opacity 0.28s ease;
}

.l-header__modal-btn a:active img {
  opacity: 0.92;
}

@media screen and (max-width: 768px) {
  .l-header__modal-btn {
    right: clamp(-10px, calc(-10px * var(--fluid-sp-mul)), calc(-10px * 2));
    transform: translate(100%, -32%);
    width: clamp(calc(103px * 28 / 55), calc(103px * var(--fluid-sp-mul)), 103px);
    height: clamp(calc(33px * 28 / 55), calc(33px * var(--fluid-sp-mul)), 33px);
  }
}

.l-header__nav {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .l-header__nav {
    display: none;
  }
}

.l-header__lists {
  display: flex;
  justify-content: flex-end;
  column-gap: clamp(calc(28px * 28 / 55), calc(28px * var(--fluid-pc-mul)), 28px);
}

.l-header__list {
  position: relative;
}

.l-header__list:has(.c-contact-btn) {
  margin-left: clamp(calc(13px * 28 / 55), calc(13px * var(--fluid-pc-mul)), 13px);
  padding-top: clamp(calc(3px * 28 / 55), calc(3px * var(--fluid-pc-mul)), 3px);
}

.l-header__list a,
.l-header__list span {
  display: flex;
  align-items: center;
  font-family: "Helvetica";
  font-size: clamp(14px, calc(14px + 2 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 16px);
  font-weight: 700;
  letter-spacing: 0.03em;
}

.l-header__list>a:not(.c-contact-btn),
.l-header__list>span {
  width: 100%;
  height: clamp(calc(44px * 28 / 55), calc(44px * var(--fluid-pc-mul)), 44px);
}

.l-header__list>span::after {
  display: block;
  content: "";
  position: absolute;
  bottom: clamp(-3px, calc(-3px * var(--fluid-pc-mul)), calc(-3px * 28 / 55));
  left: 50%;
  transform: translate(-50%, 0);
  z-index: 1;
  width: clamp(calc(23px * 28 / 55), calc(23px * var(--fluid-pc-mul)), 23px);
  height: clamp(calc(11px * 28 / 55), calc(11px * var(--fluid-pc-mul)), 11px);
  background: url(../img/renewal/arrow-icon-down.svg) no-repeat center bottom / contain;
  transition: transform 0.3s ease;
}

.l-header__list:hover>span::after,
.l-header__list:focus-within>span::after {
  transform: translate(-50%, 20%);
}

.l-header__sub-lists {
  display: flex;
  flex-direction: column;
  row-gap: clamp(calc(5px * 28 / 55), calc(5px * var(--fluid-pc-mul)), 5px);
  position: absolute;
  top: 100%;
  left: 0;
  padding-top: clamp(calc(22px * 28 / 55), calc(22px * var(--fluid-pc-mul)), 22px);
  transform: translate(0, 0);
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: visibility 0.3s ease, opacity 0.3s ease;
}

.l-header__list:hover .l-header__sub-lists,
.l-header__list:focus-within .l-header__sub-lists {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.l-header__sub-list a {
  display: block;
  padding-top: clamp(calc(7px * 28 / 55), calc(7px * var(--fluid-pc-mul)), 7px);
  padding-bottom: clamp(calc(7px * 28 / 55), calc(7px * var(--fluid-pc-mul)), 7px);
  font-family: "Noto Sans JP";
  font-size: clamp(13px, calc(13px + 2 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 15px);
  font-weight: 500;
  letter-spacing: 0.215em;
  white-space: nowrap;
}

/*======================================
    l-conversion-area
======================================*/
.l-conversion-area {
  position: fixed;
  bottom: clamp(calc(75px * 28 / 55), calc(75px * var(--fluid-pc-mul)), 75px);
  right: 0;
  width: clamp(calc(358px * 28 / 55), calc(358px * var(--fluid-pc-mul)), 358px);
  z-index: 100;
}

@media screen and (max-width: 768px) {
  .l-conversion-area {
    left: 0;
    bottom: clamp(20px, calc(20px * var(--fluid-sp-mul)), calc(20px * 2));
    width: 100%;
  }
}

.l-conversion-area__modal-btn {
  padding-right: clamp(calc(32px * 28 / 55), calc(32px * var(--fluid-pc-mul)), 32px);
  text-align: right;
}

.l-conversion-area__modal-btn a {
  display: inline-block;
  width: clamp(calc(100px * 28 / 55), calc(100px * var(--fluid-pc-mul)), 100px);
  height: clamp(calc(100px * 28 / 55), calc(100px * var(--fluid-pc-mul)), 100px);
}

@media screen and (max-width: 768px) {
  .l-conversion-area__modal-btn {
    padding-right: clamp(25px, calc(25px * var(--fluid-sp-mul)), calc(25px * 2));
  }
  .l-conversion-area__modal-btn a {
    width: clamp(67px, calc(67px * var(--fluid-sp-mul)), calc(67px * 2));
    height: clamp(67px, calc(67px * var(--fluid-sp-mul)), calc(67px * 2));
  }
}
.l-conversion-area__head {
  margin-top: clamp(calc(45px * 28 / 55), calc(45px * var(--fluid-pc-mul)), 45px);
  text-align: center;
}

@media screen and (max-width: 768px) {
  .l-conversion-area__head {}
}

.l-conversion-area__head span {
  display: block;
  position: relative;
}

@media screen and (max-width: 768px) {
  .l-conversion-area__head span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-direction: row-reverse;
    column-gap: clamp(5px, calc(5px * var(--fluid-sp-mul)), calc(5px * 2));
  }
}

.l-conversion-area__head span::before,
.l-conversion-area__head span::after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  z-index: 1;
  width: clamp(calc(15px * 28 / 55), calc(15px * var(--fluid-pc-mul)), 15px);
  height: clamp(calc(59px * 28 / 55), calc(59px * var(--fluid-pc-mul)), 59px);
}

@media screen and (max-width: 768px) {

  .l-conversion-area__head span::before,
  .l-conversion-area__head span::after {
    width: clamp(6px, calc(6px * var(--fluid-sp-mul)), calc(6px * 2));
    height: clamp(15px, calc(15px * var(--fluid-sp-mul)), calc(15px * 2));
  }
}

.l-conversion-area__head span::before {
  left: clamp(calc(26px * 28 / 55), calc(26px * var(--fluid-pc-mul)), 26px);
  background: url(../img/renewal/text-decoration-left_smart_pc.svg) no-repeat left center / contain;
}

.l-conversion-area__head span::after {
  right: clamp(calc(35px * 28 / 55), calc(35px * var(--fluid-pc-mul)), 35px);
  background: url(../img/renewal/text-decoration-right_smart_pc.svg) no-repeat right center / contain;
}

@media screen and (max-width: 768px) {
  .l-conversion-area__head span::before {
    left: clamp(-10px, calc(-10px * var(--fluid-sp-mul)), calc(-10px * 2));
    background: url(../img/renewal/text-decoration-left_smart_sp.svg) no-repeat left center / contain;
  }

  .l-conversion-area__head span::after {
    right: clamp(calc(-9px * 2), calc(-9px * var(--fluid-sp-mul)), -9px);
    background: url(../img/renewal/text-decoration-right_smart_sp.svg) no-repeat right center / contain;
  }
}

.l-conversion-area__text {
  font-size: clamp(15px, calc(15px + 13 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 28px);
  font-weight: 700;
  letter-spacing: 0.215em;
}

@media screen and (max-width: 768px) {
  .l-conversion-area__text {
    font-size: clamp(15px, calc(15px + (100vw - var(--fluid-sp-min-vw)) * 15 / var(--fluid-sp-span)), 30px);
    letter-spacing: 0.09em;
    line-height: 1;
  }
}

.l-conversion-area__note {
  margin-top: clamp(calc(8px * 28 / 55), calc(8px * var(--fluid-pc-mul)), 8px);
  font-size: clamp(9px, calc(9px + 3 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 12px);
  font-weight: 700;
  letter-spacing: 0.21em;
  line-height: 2.11046512;
}

@media screen and (max-width: 768px) {
  .l-conversion-area__note {
    margin-top: 0;
    font-size: clamp(9px, calc(9px + (100vw - var(--fluid-sp-min-vw)) * 9 / var(--fluid-sp-span)), 18px);
    letter-spacing: 0.06em;
    line-height: 1;
  }
}

.l-conversion-area__btn {
  margin-top: clamp(calc(18px * 28 / 55), calc(18px * var(--fluid-pc-mul)), 18px);
}

@media screen and (max-width: 768px) {
  .l-conversion-area__btn {
    margin-top: clamp(5px, calc(5px * var(--fluid-sp-mul)), calc(5px * 2));
    text-align: center;
  }
}

.l-conversion-area__btn a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  height: clamp(calc(72px * 28 / 55), calc(72px * var(--fluid-pc-mul)), 72px);
  background-color: #000;
  border-radius: clamp(calc(36px * 28 / 55), calc(36px * var(--fluid-pc-mul)), 36px) 0 0 clamp(calc(36px * 28 / 55), calc(36px * var(--fluid-pc-mul)), 36px);
  color: #f7bc00;
  font-size: clamp(16px, calc(16px + 5 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 21px);
  letter-spacing: 0.06em;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .l-conversion-area__btn a {
    width: clamp(311px, calc(311px * var(--fluid-sp-mul)), calc(311px * 2));
    height: clamp(44px, calc(44px * var(--fluid-sp-mul)), calc(44px * 2));
    border-radius: clamp(22px, calc(22px * var(--fluid-sp-mul)), calc(22px * 2));
    font-size: clamp(16px, calc(16px + (100vw - var(--fluid-sp-min-vw)) * 16 / var(--fluid-sp-span)), 32px);
  }
}

.l-conversion-area__btn a::after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  right: clamp(calc(44px * 28 / 55), calc(44px * var(--fluid-pc-mul)), 44px);
  transform: translate(0, -50%);
  z-index: 1;
  width: clamp(calc(11px * 28 / 55), calc(11px * var(--fluid-pc-mul)), 11px);
  height: clamp(calc(11px * 28 / 55), calc(11px * var(--fluid-pc-mul)), 11px);
  background: url(../img/renewal/arrow-icon-next_small.svg) no-repeat right center / contain;
  transition: transform 0.3s ease;
}

@media screen and (max-width: 768px) {
  .l-conversion-area__btn a::after {
    right: clamp(22px, calc(22px * var(--fluid-sp-mul)), calc(22px * 2));
    width: clamp(7px, calc(7px * var(--fluid-sp-mul)), calc(7px * 2));
    height: clamp(7px, calc(7px * var(--fluid-sp-mul)), calc(7px * 2));
  }
}

.l-conversion-area__btn a:hover::after {
  transform: translate(20%, -50%);
}

/*======================================
    l-onsee-modal
======================================*/
.l-onsee-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1000;
  width: 100%;
  height: 100%;
}

.l-onsee-modal.is-active {
  display: block;
}

.l-onsee-modal__overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.55);
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.4s ease;
}

.l-onsee-modal.is-visible .l-onsee-modal__overlay {
  opacity: 1;
}

.l-onsee-modal__contents {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -46%) scale(0.98);
  opacity: 0;
  width: 995px;
  max-width: calc(100% - 40px);
  max-height: calc(100vh - 40px);
  padding: 145px 80px 155px;
  background-color: rgba(247, 188, 0, 0.9);
  box-sizing: border-box;
  overflow-y: auto;
  color: #231815;
  transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}

.l-onsee-modal.is-visible .l-onsee-modal__contents {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}

@media screen and (max-width: 768px) {
  .l-onsee-modal__contents {
    position: fixed;
    top: 0;
    left: 0;
    transform: none;
    transition: opacity 0.4s ease;
    will-change: auto;
    padding: clamp(115px, calc(115px * var(--fluid-sp-mul)), calc(115px * 2)) clamp(36px, calc(36px * var(--fluid-sp-mul)), calc(36px * 2)) clamp(120px, calc(120px * var(--fluid-sp-mul)), calc(120px * 2));
    width: 100%;
    max-width: 100%;
    height: 100vh;
    max-height: 100vh;
  }

  .l-onsee-modal.is-visible .l-onsee-modal__contents {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .l-onsee-modal__overlay,
  .l-onsee-modal__contents {
    transition: none;
  }

  .l-onsee-modal__contents {
    transform: translate(-50%, -50%) scale(1);
  }
}

.l-onsee-modal__inner {
  width: 545px;
  max-width: 100%;
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 768px) {
  .l-onsee-modal__inner {
    width: 100%;
  }
}

.l-onsee-modal__close {
  position: absolute;
  top: 40px;
  right: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0;
  background: transparent;
  border: none;
  cursor: pointer;
  color: #231815;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .l-onsee-modal__close {
    position: fixed;
    top: clamp(14px, calc(14px * var(--fluid-sp-mul)), calc(14px * 2));
    right: clamp(14px, calc(14px * var(--fluid-sp-mul)), calc(14px * 2));
  }
}

.l-onsee-modal__close-icon {
  position: relative;
  display: block;
  width: 65px;
  height: 65px;
}

.l-onsee-modal__close-icon::before,
.l-onsee-modal__close-icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 2px;
  background-color: #231815;
}

.l-onsee-modal__close-icon::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.l-onsee-modal__close-icon::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

@media screen and (max-width: 768px) {
  .l-onsee-modal__close-icon {
    width: clamp(65px, calc(65px * var(--fluid-sp-mul)), calc(65px * 2));
    height: clamp(65px, calc(65px * var(--fluid-sp-mul)), calc(65px * 2));
  }
}

.l-onsee-modal__close-text {
  margin-top: -6px;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0;
}

@media screen and (max-width: 768px) {
  .l-onsee-modal__close-text {
    font-size: clamp(13px, calc(13px * var(--fluid-sp-mul)), calc(13px * 2));
  }
}

.l-onsee-modal__icon {
  text-align: center;
  /* margin-bottom: clamp(calc(24px * 28 / 55), calc(24px * var(--fluid-pc-mul)), 24px); */
}

.l-onsee-modal__icon img {
  display: inline-block;
  width: 67px;
  height: auto;
}

@media screen and (max-width: 768px) {
  .l-onsee-modal__icon {
    /* margin-bottom: clamp(calc(20px * 2), calc(20px * var(--fluid-sp-mul)), calc(20px * 2)); */
  }

  .l-onsee-modal__icon img {
    width: clamp(67px, calc(67px * var(--fluid-sp-mul)), calc(67px * 2));
  }
}

.l-onsee-modal__title {
  text-align: center;
  font-weight: 700;
  font-size: 19px;
  line-height: 1.6;
  margin-top: 35px;
  letter-spacing: 0;
}

@media screen and (max-width: 768px) {
  .l-onsee-modal__title {
    margin-top: clamp(40px, calc(40px * var(--fluid-sp-mul)), calc(40px * 2));
    font-size: clamp(19px, calc(19px * var(--fluid-sp-mul)), calc(19px * 2));
  }
}

.l-onsee-modal__text {
  margin-top: 25px;
  font-weight: 700;
  font-size: 13px;
  line-height: 1.92307692;
  text-align: justify;
}

@media screen and (max-width: 768px) {
  .l-onsee-modal__text {
    margin-top: clamp(27px, calc(27px * var(--fluid-sp-mul)), calc(27px * 2));
    font-size: clamp(13px, calc(13px * var(--fluid-sp-mul)), calc(13px * 2));
  }
}

body.is-onsee-modal-open {
  overflow: hidden;
}

/*======================================
    l-top
======================================*/
.l-top {
  position: relative;
  z-index: 1;
  background: url(../img/renewal/main-bg_pc.png) no-repeat center top / contain;
}

@media screen and (max-width: 768px) {
  .l-top {
    background: url(../img/renewal/main-bg_sp.png) no-repeat center top / contain;
  }

  .l-top::after {
    display: block;
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 3.2%);
    z-index: -1;
    width: 100%;
    height: clamp(2301px, calc(2301px * var(--fluid-sp-mul)), calc(2301px * 2));
    background: url(../img/renewal/main-bg_bottom_sp.png) no-repeat center bottom / cover;
  }
}

.l-top__main-visual {
  position: relative;
  z-index: 2;
}

.l-top__about {
  position: relative;
  z-index: 3;
  margin-top: clamp(-690px, calc(-690px * var(--fluid-pc-mul)), calc(-690px * 28 / 55));
  padding-top: clamp(calc(125px * 28 / 55), calc(125px * var(--fluid-pc-mul)), 125px);
  padding-bottom: clamp(calc(125px * 28 / 55), calc(125px * var(--fluid-pc-mul)), 125px);
}

@media screen and (max-width: 768px) {
  .l-top__about {
    margin-top: clamp(calc(-150px * 2), calc(-150px * var(--fluid-sp-mul)), -150px);
    padding-top: clamp(220px, calc(220px * var(--fluid-sp-mul)), calc(220px * 2));
    padding-bottom: clamp(54px, calc(54px * var(--fluid-sp-mul)), calc(54px * 2));
  }
}

.l-top__mission {
  padding-top: clamp(calc(125px * 28 / 55), calc(125px * var(--fluid-pc-mul)), 125px);
  padding-bottom: clamp(calc(125px * 28 / 55), calc(125px * var(--fluid-pc-mul)), 125px);
}

@media screen and (max-width: 768px) {
  .l-top__mission {
    padding-top: clamp(54px, calc(54px * var(--fluid-sp-mul)), calc(54px * 2));
    padding-bottom: clamp(54px, calc(54px * var(--fluid-sp-mul)), calc(54px * 2));
  }
}

.l-top__service {
  margin-top: clamp(-160px, calc(-160px * var(--fluid-pc-mul)), calc(-160px * 28 / 55));
  padding-top: clamp(calc(240px * 28 / 55), calc(240px * var(--fluid-pc-mul)), 240px);
  padding-bottom: clamp(calc(155px * 28 / 55), calc(155px * var(--fluid-pc-mul)), 155px);
}

@media screen and (max-width: 768px) {
  .l-top__service {
    margin-top: 0;
    padding-top: clamp(54px, calc(54px * var(--fluid-sp-mul)), calc(54px * 2));
    padding-bottom: clamp(75px, calc(75px * var(--fluid-sp-mul)), calc(75px * 2));
  }
}

.l-top__strength {
  margin-top: clamp(-30px, calc(-30px * var(--fluid-pc-mul)), calc(-30px * 28 / 55));
  padding-top: clamp(calc(185px * 28 / 55), calc(185px * var(--fluid-pc-mul)), 185px);
  padding-bottom: clamp(calc(245px * 28 / 55), calc(245px * var(--fluid-pc-mul)), 245px);
}

@media screen and (max-width: 768px) {
  .l-top__strength {
    /* margin-top: clamp(calc(-250px * 2), calc(-250px * var(--fluid-sp-mul)), -250px); */
    margin-top: 0;
    padding-top: clamp(75px, calc(75px * var(--fluid-sp-mul)), calc(75px * 2));
    padding-bottom: clamp(110px, calc(110px * var(--fluid-sp-mul)), calc(110px * 2));
  }
}

/*======================================
    l-page-media
======================================*/
.l-page-media {}

.l-page-media__main-visual {}

.l-page-media__about {
  margin-top: clamp(-265px, calc(-265px * var(--fluid-pc-mul)), calc(-265px * 28 / 55));
  padding-top: clamp(calc(60px * 28 / 55), calc(60px * var(--fluid-pc-mul)), 60px);
  padding-bottom: clamp(calc(60px * 28 / 55), calc(60px * var(--fluid-pc-mul)), 60px);
}

@media screen and (max-width: 768px) {
  .l-page-media__about {
    margin-top: 0;
    padding-top: clamp(40px, calc(40px * var(--fluid-sp-mul)), calc(40px * 2));
    padding-bottom: clamp(65px, calc(65px * var(--fluid-sp-mul)), calc(65px * 2));
  }
}

.l-page-media__gakushiru {
  padding-top: clamp(calc(140px * 28 / 55), calc(140px * var(--fluid-pc-mul)), 140px);
  padding-bottom: clamp(calc(160px * 28 / 55), calc(160px * var(--fluid-pc-mul)), 160px);
  background-color: #f8ead6;
}

@media screen and (max-width: 768px) {
  .l-page-media__gakushiru {
    padding-top: clamp(54px, calc(54px * var(--fluid-sp-mul)), calc(54px * 2));
    padding-bottom: clamp(70px, calc(70px * var(--fluid-sp-mul)), calc(70px * 2));
  }
}

/*======================================
    p-card
======================================*/
.p-card {}

.p-card__img {
  padding-bottom: clamp(calc(15px * 28 / 55), calc(15px * var(--fluid-pc-mul)), 15px);
}

@media screen and (max-width: 768px) {
  .p-card__img {
    padding-bottom: 0;
    text-align: center;
  }

  .p-card__img img {
    display: inline-block;
    width: 78%;
  }
}

.p-card__head {
  padding-left: clamp(calc(15px * 28 / 55), calc(15px * var(--fluid-pc-mul)), 15px);
  border-left: 2px solid #f7bc00;
}

@media screen and (max-width: 768px) {
  .p-card__head {
    display: flex;
    column-gap: clamp(17px, calc(17px * var(--fluid-sp-mul)), calc(17px * 2));
    padding-left: clamp(15px, calc(15px * var(--fluid-sp-mul)), calc(15px * 2));
    border-left: none;
    position: relative;
  }

  .p-card__head::before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(0, 0);
    z-index: 1;
    width: 2px;
    height: calc(100% - 12px);
    background-color: #f7bc00;
  }
}

.p-card__label {
  display: inline-block;
  height: clamp(calc(36px * 28 / 55), calc(36px * var(--fluid-pc-mul)), 36px);
}

@media screen and (max-width: 768px) {
  .p-card__label {
    height: clamp(30px, calc(30px * var(--fluid-sp-mul)), calc(30px * 2));
  }
}

.p-card__label img {
  display: block;
  width: 100%;
  height: 100%;
}

.p-card__titile {
  margin-top: clamp(calc(8px * 28 / 55), calc(8px * var(--fluid-pc-mul)), 8px);
  font-size: clamp(22px, calc(22px + 5 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 27px);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.39888889;
}

@media screen and (max-width: 768px) {
  .p-card__titile {
    margin-top: 0;
    font-size: clamp(20px, calc(20px + (100vw - var(--fluid-sp-min-vw)) * 20 / var(--fluid-sp-span)), 40px);
    line-height: 1.62590909;
    letter-spacing: 0;
    transform: translateY(clamp(calc(-6px * 2), calc(-6px * var(--fluid-sp-mul)), -6px));
  }
}

.p-card__text {
  margin-top: clamp(calc(23px * 28 / 55), calc(23px * var(--fluid-pc-mul)), 23px);
  font-size: clamp(13px, calc(13px + 2 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 15px);
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.86666667;
}

@media screen and (max-width: 768px) {
  .p-card__text {
    margin-top: clamp(15px, calc(15px * var(--fluid-sp-mul)), calc(15px * 2));
    font-size: clamp(13px, calc(13px + (100vw - var(--fluid-sp-min-vw)) * 13 / var(--fluid-sp-span)), 26px);
    line-height: 1.92307692;
    letter-spacing: 0.02em;
  }
}

.p-card__more {
  margin-top: clamp(calc(35px * 28 / 55), calc(35px * var(--fluid-pc-mul)), 35px);
}

@media screen and (max-width: 768px) {
  .p-card__more {
    margin-top: clamp(47px, calc(47px * var(--fluid-sp-mul)), calc(47px * 2));
    text-align: center;
  }
}

/*======================================
    p-main-visual
======================================*/
.p-main-visual {
  position: relative;
  padding-top: clamp(calc(310px * 28 / 55), calc(310px * var(--fluid-pc-mul)), 310px);
  padding-bottom: clamp(calc(850px * 28 / 55), calc(850px * var(--fluid-pc-mul)), 850px);
  z-index: 2;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .p-main-visual {
    padding-top: clamp(120px, calc(120px * var(--fluid-sp-mul)), calc(120px * 2));
    padding-bottom: clamp(305px, calc(305px * var(--fluid-sp-mul)), calc(305px * 2));
  }
}

.p-main-visual::after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: clamp(-66px, calc(-66px * var(--fluid-pc-mul)), calc(-66px * 28 / 55));
  transform: translate(0, 0);
  z-index: -1;
  width: clamp(calc(2125.5px * 28 / 55),
      calc(2125.5px * (28px + 27 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)) / 55px),
      clamp(calc(2125.5px * 28 / 55), calc(2125.5px * var(--fluid-pc-mul)), 2125.5px));
  height: clamp(calc(1344.5px * 28 / 55),
      calc(1344.5px * (28px + 27 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)) / 55px),
      clamp(calc(1344.5px * 28 / 55), calc(1344.5px * var(--fluid-pc-mul)), 1344.5px));
  background: url(../img/renewal/main-visual-bg_pc.png) no-repeat center center / cover;
}

@media screen and (max-width: 768px) {
  .p-main-visual::after {
    top: 0;
    right: clamp(calc(-23px * 2), calc(-23px * var(--fluid-sp-mul)), -23px);
    left: initial;
    width: clamp(407px, calc(407px + (100vw - var(--fluid-sp-min-vw)) * 407 / var(--fluid-sp-span)), 814px);
    height: clamp(638px, calc(638px + (100vw - var(--fluid-sp-min-vw)) * 638 / var(--fluid-sp-span)), 1276px);
    background: url(../img/renewal/main-visual-bg_sp.png) no-repeat center center / cover;
  }
}

.p-main-visual__inner {}

.p-main-visual__contents {
  padding-left: calc(375 / 1080 * 100%);
}

@media screen and (max-width: 768px) {
  .p-main-visual__contents {
    padding-left: 0;
  }
}

.p-main-visual__copy {
  font-size: clamp(28px, calc(28px + 27 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 55px);
  font-weight: 700;
  letter-spacing: 0.07em;
  line-height: 1.46006158;
}

@media screen and (max-width: 768px) {
  .p-main-visual__copy {
    font-size: clamp(28px, calc(28px + (100vw - var(--fluid-sp-min-vw)) * 28 / var(--fluid-sp-span)), 56px);
    line-height: 1.48964286;
  }
}

.p-main-visual__text {
  margin-top: clamp(calc(30px * 28 / 55), calc(30px * var(--fluid-pc-mul)), 30px);
  font-size: clamp(14px, calc(14px + 11 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 25px);
  font-weight: 700;
  letter-spacing: 0.125em;
  line-height: 1.95684039;
}

@media screen and (max-width: 768px) {
  .p-main-visual__text {
    margin-top: clamp(12px, calc(12px * var(--fluid-sp-mul)), calc(12px * 2));
    font-size: clamp(14px, calc(14px + (100vw - var(--fluid-sp-min-vw)) * 14 / var(--fluid-sp-span)), 28px);
    letter-spacing: 0.1em;
    line-height: 1.89714286;
  }
}

/*======================================
    p-about
======================================*/
.p-about {
  position: relative;
  overflow: hidden;
}

.p-about::after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-49.3%, -52.5%);
  z-index: -1;
  width: clamp(calc(1563px * 28 / 55), calc(1563px * var(--fluid-pc-mul)), 1563px);
  height: clamp(calc(493px * 28 / 55), calc(493px * var(--fluid-pc-mul)), 493px);
  background: url(../img/renewal/about-bg_pc.png?ver=2) no-repeat center center / contain;
}

@media screen and (max-width: 768px) {
  .p-about::after {
    top: 0;
    transform: translate(-49%, 0);
    width: clamp(408px, calc(408px * var(--fluid-sp-mul)), calc(408px * 2));
    height: clamp(198px, calc(198px * var(--fluid-sp-mul)), calc(198px * 2));
    background: url(../img/renewal/about-bg_sp.png) no-repeat center center / contain;
  }
}

.p-about__inner {}

.p-about__contents {}

.p-about__section-title {
  text-align: center;
}

.p-about__text {
  margin-top: clamp(calc(42px * 28 / 55), calc(42px * var(--fluid-pc-mul)), 42px);
  font-size: clamp(12px, calc(12px + 6 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 18px);
  font-weight: 700;
  letter-spacing: 0.185em;
  line-height: 2.35;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .p-about__text {
    margin-top: clamp(14px, calc(14px * var(--fluid-sp-mul)), calc(14px * 2));
    font-size: clamp(12px, calc(12px + (100vw - var(--fluid-sp-min-vw)) * 12 / var(--fluid-sp-span)), 24px);
    line-height: 2.19583333;
    letter-spacing: 0.15em;
  }
}

.p-about__more {
  margin-top: clamp(calc(60px * 28 / 55), calc(60px * var(--fluid-pc-mul)), 60px);
  text-align: center;
}

@media screen and (max-width: 768px) {
  .p-about__more {
    margin-top: clamp(35px, calc(35px * var(--fluid-sp-mul)), calc(35px * 2));
  }
}

.p-about__more a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding-right: clamp(calc(30px * 28 / 55), calc(30px * var(--fluid-pc-mul)), 30px);
  padding-bottom: clamp(calc(18px * 28 / 55), calc(18px * var(--fluid-pc-mul)), 18px);
  font-family: Helvetica;
  font-size: clamp(17px, calc(17px + 8 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 25px);
  font-weight: 700;
  letter-spacing: 0.03em;
}

@media screen and (max-width: 768px) {
  .p-about__more a {
    font-size: clamp(17px, calc(17px + (100vw - var(--fluid-sp-min-vw)) * 17 / var(--fluid-sp-span)), 34px);
    padding-right: clamp(20px, calc(20px * var(--fluid-sp-mul)), calc(20px * 2));
    padding-bottom: clamp(12px, calc(12px * var(--fluid-sp-mul)), calc(12px * 2));
  }
}

.p-about__more a::after {
  display: block;
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  transform: translate(0, 0);
  z-index: 1;
  width: clamp(calc(288px * 28 / 55), calc(288px * var(--fluid-pc-mul)), 288px);
  height: clamp(calc(45px * 28 / 55), calc(45px * var(--fluid-pc-mul)), 45px);
  background: url(../img/renewal/arrow-icon-next_large.svg) no-repeat left center / contain;
}

@media screen and (max-width: 768px) {
  .p-about__more a::after {
    width: clamp(200px, calc(200px * var(--fluid-sp-mul)), calc(200px * 2));
    height: clamp(30px, calc(30px * var(--fluid-sp-mul)), calc(30px * 2));
  }
}

/*======================================
    p-mission
======================================*/
.p-mission {
  position: relative;
}

.p-mission::after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(0, -43%);
  z-index: -1;
  width: clamp(calc(1554px * 28 / 55), calc(1554px * var(--fluid-pc-mul)), 1554px);
  height: clamp(calc(1518px * 28 / 55), calc(1518px * var(--fluid-pc-mul)), 1518px);
  background: url(../img/renewal/mission-bg_pc.png) no-repeat right center / contain;
}

@media screen and (max-width: 768px) {
  .p-mission::after {
    top: 0;
    transform: translate(0, -20%);
    width: clamp(375px, calc(375px * var(--fluid-sp-mul)), calc(375px * 2));
    height: clamp(990px, calc(990px * var(--fluid-sp-mul)), calc(990px * 2));
    background: url(../img/renewal/mission-bg_sp.png) no-repeat right center / contain;
  }
}

.p-mission__inner {}

.p-mission__contents {}

.p-mission__wrap {}

.p-mission__box {
  width: calc(540 / 1080 * 100%);
}

@media screen and (max-width: 768px) {
  .p-mission__box {
    width: 100%;
  }
}

.p-mission__section-title {}

.p-mission__text-box {
  margin-top: clamp(calc(25px * 28 / 55), calc(25px * var(--fluid-pc-mul)), 25px);
}

@media screen and (max-width: 768px) {
  .p-mission__text-box {
    width: 76%;
    margin-top: clamp(23px, calc(23px * var(--fluid-sp-mul)), calc(23px * 2));
  }
}

.p-mission__text {
  font-size: clamp(12px, calc(12px + 3 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 15px);
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.85666667;
}

@media screen and (max-width: 768px) {
  .p-mission__text {
    font-size: clamp(12px, calc(12px + (100vw - var(--fluid-sp-min-vw)) * 12 / var(--fluid-sp-span)), 24px);
    line-height: 1.8625;
    letter-spacing: 0.04em;
  }
}

.p-mission__text+.p-mission__text {
  margin-top: clamp(calc(25px * 28 / 55), calc(25px * var(--fluid-pc-mul)), 25px);
}

@media screen and (max-width: 768px) {
  .p-mission__text+.p-mission__text {
    margin-top: clamp(23px, calc(23px * var(--fluid-sp-mul)), calc(23px * 2));
  }
}

.p-mission__message {
  margin-top: clamp(calc(50px * 28 / 55), calc(50px * var(--fluid-pc-mul)), 50px);
  font-size: clamp(14px, calc(14px + 11 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 25px);
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.98099762;
}

@media screen and (max-width: 768px) {
  .p-mission__message {
    margin-top: clamp(20px, calc(20px * var(--fluid-sp-mul)), calc(20px * 2));
    font-size: clamp(14px, calc(14px + (100vw - var(--fluid-sp-min-vw)) * 14 / var(--fluid-sp-span)), 28px);
    line-height: 1.97142857;
    letter-spacing: 0.03em;
  }
}

/*======================================
    p-service
======================================*/
.p-service {
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .p-service {
    overflow: visible;
  }
}

.p-service::after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0%);
  z-index: -1;
  width: clamp(calc(2202px * 28 / 55), calc(2202px * var(--fluid-pc-mul)), 2202px);
  height: clamp(calc(1452px * 28 / 55), calc(1452px * var(--fluid-pc-mul)), 1452px);
  background: url(../img/renewal/service-bg_pc.png) no-repeat center center / contain;
}

@media screen and (max-width: 768px) {
  .p-service::after {
    display: none;
  }
}

.p-service__inner {}

.p-service__contents {}

.p-service__items {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: clamp(calc(165px * 28 / 55), calc(165px * var(--fluid-pc-mul)), 165px);
}

@media screen and (max-width: 768px) {
  .p-service__items {
    row-gap: clamp(97px, calc(97px * var(--fluid-sp-mul)), calc(97px * 2));
  }
}

.p-service__item {
  min-width: 0;
}

.p-service__head {}

.p-service__catch {
  text-align: center;
}

.p-service__catch span {
  display: inline-block;
  position: relative;
  padding-right: clamp(calc(48px * 28 / 55), calc(48px * var(--fluid-pc-mul)), 48px);
  padding-left: clamp(calc(58px * 28 / 55), calc(58px * var(--fluid-pc-mul)), 58px);
  font-size: clamp(14px, calc(14px + 6 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 20px);
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.8;
}

@media screen and (max-width: 768px) {
  .p-service__catch span {
    padding-right: clamp(40px, calc(40px * var(--fluid-sp-mul)), calc(40px * 2));
    padding-left: clamp(40px, calc(40px * var(--fluid-sp-mul)), calc(40px * 2));
    font-size: clamp(14px, calc(14px + (100vw - var(--fluid-sp-min-vw)) * 14 / var(--fluid-sp-span)), 28px);
    line-height: 1.845;
    letter-spacing: 0.1em;
  }
}

.p-service__catch span::before,
.p-service__catch span::after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  z-index: 1;
}

.p-service__catch span::before {
  left: 0;
  width: clamp(calc(37px * 28 / 55), calc(37px * var(--fluid-pc-mul)), 37px);
  height: clamp(calc(63px * 28 / 55), calc(63px * var(--fluid-pc-mul)), 63px);
  background: url(../img/renewal/text-decoration-left.svg) no-repeat left center / contain;
}

@media screen and (max-width: 768px) {
  .p-service__catch span::before {
    width: clamp(26px, calc(26px * var(--fluid-sp-mul)), calc(26px * 2));
    height: clamp(44px, calc(44px * var(--fluid-sp-mul)), calc(44px * 2));
  }
}

.p-service__catch span::after {
  right: 0;
  width: clamp(calc(38px * 28 / 55), calc(38px * var(--fluid-pc-mul)), 38px);
  height: clamp(calc(63px * 28 / 55), calc(63px * var(--fluid-pc-mul)), 63px);
  background: url(../img/renewal/text-decoration-right.svg) no-repeat right center / contain;
}

@media screen and (max-width: 768px) {
  .p-service__catch span::after {
    width: clamp(26px, calc(26px * var(--fluid-sp-mul)), calc(26px * 2));
    height: clamp(44px, calc(44px * var(--fluid-sp-mul)), calc(44px * 2));
  }
}

.p-service__section-title {
  position: relative;
  width: fit-content;
  margin: clamp(calc(15px * 28 / 55), calc(15px * var(--fluid-pc-mul)), 15px) auto 0;
  font-size: clamp(20px, calc(20px + 10 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 30px);
  font-weight: 900;
  letter-spacing: 0.18em;
  line-height: 1.51666667;
  text-align: center;
  z-index: 0;
}

@media screen and (max-width: 768px) {
  .p-service__section-title {
    font-size: clamp(20px, calc(20px + (100vw - var(--fluid-sp-min-vw)) * 20 / var(--fluid-sp-span)), 40px);
    line-height: 1.645;
  }
}

.p-service__section-title::after {
  content: "";
  position: absolute;
  left: -0.2em;
  width: calc(100% + 0.4em);
  height: 0.7em;
  bottom: -0.15em;
  background-color: #f7bc00;
  z-index: -1;
}

@media screen and (max-width: 768px) {
  .p-service__section-title::after {
    left: -0.6em;
    width: calc(100% + 1em);
    bottom: 0em;
  }
}

.p-service__wrap {
  display: grid;
  align-items: end;
  grid-template-columns: 1fr 2.5fr;
  column-gap: clamp(calc(40px * 28 / 55), calc(40px * var(--fluid-pc-mul)), 40px);
  margin-top: clamp(calc(64px * 28 / 55), calc(64px * var(--fluid-pc-mul)), 64px);
}

@media screen and (max-width: 768px) {
  .p-service__wrap {
    display: flex;
    flex-direction: column-reverse;
    row-gap: clamp(30px, calc(30px * var(--fluid-sp-mul)), calc(30px * 2));
    margin-top: clamp(50px, calc(50px * var(--fluid-sp-mul)), calc(50px * 2));
  }
}

.p-service__box {
  padding-bottom: clamp(calc(8px * 28 / 55), calc(8px * var(--fluid-pc-mul)), 8px);
}

.p-service__img {}

.p-service__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: clamp(calc(25px * 28 / 55), calc(25px * var(--fluid-pc-mul)), 25px);
  margin-top: clamp(calc(10px * 28 / 55), calc(10px * var(--fluid-pc-mul)), 10px);
}

@media screen and (max-width: 768px) {
  .p-service__scroll-area {
    margin-inline: calc(50% - 50vw);
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
  }

  .p-service__cards {
    width: clamp(968px, calc(968px * var(--fluid-sp-mul)), calc(968px * 2));
    justify-items: center;
    /* grid-template-columns: 1fr; */
    column-gap: clamp(30px, calc(30px * var(--fluid-sp-mul)), calc(30px * 2));
    row-gap: clamp(20px, calc(20px * var(--fluid-sp-mul)), calc(20px * 2));
    padding-right: clamp(34px, calc(34px * var(--fluid-sp-mul)), calc(34px * 2));
    padding-left: clamp(34px, calc(34px * var(--fluid-sp-mul)), calc(34px * 2));
  }
}

.p-service__card {}

@media screen and (max-width: 768px) {
  .p-service__card {
    /* width: 97%; */
  }
}

/*======================================
    p-strength
======================================*/
.p-strength {
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .p-strength {
    overflow: visible;
  }
}

.p-strength::after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  width: clamp(calc(1925px * 28 / 55), calc(1925px * var(--fluid-pc-mul)), 1925px);
  height: clamp(calc(2221px * 28 / 55), calc(2221px * var(--fluid-pc-mul)), 2221px);
  background: url(../img/renewal/strength-bg.png) no-repeat center center / contain;
}

@media screen and (max-width: 768px) {
  .p-strength::after {
    display: none;
  }
}

.p-strength__inner {}

.p-strength__contents {}

.p-strength__section-title {}

.p-strength__lead {
  margin-top: clamp(calc(23px * 28 / 55), calc(23px * var(--fluid-pc-mul)), 23px);
  font-size: clamp(20px, calc(20px + 2 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 22px);
  font-weight: 700;
  letter-spacing: 0.18em;
  line-height: 2.06818182;
}

@media screen and (max-width: 768px) {
  .p-strength__lead {
    margin-top: clamp(15px, calc(15px * var(--fluid-sp-mul)), calc(15px * 2));
    font-size: clamp(20px, calc(20px + (100vw - var(--fluid-sp-min-vw)) * 20 / var(--fluid-sp-span)), 40px);
    letter-spacing: 0.08em;
    line-height: 1.9;
    text-align: center;
  }
}

.p-strength__items {
  margin-top: clamp(calc(65px * 28 / 55), calc(65px * var(--fluid-pc-mul)), 65px);
}

@media screen and (max-width: 768px) {
  .p-strength__scroll-area {
    margin-inline: calc(50% - 50vw);
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    padding-right: clamp(34px, calc(34px * var(--fluid-sp-mul)), calc(34px * 2));
    padding-left: clamp(34px, calc(34px * var(--fluid-sp-mul)), calc(34px * 2));
  }

  .p-strength__items {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    /* justify-items: center; */
    column-gap: clamp(30px, calc(30px * var(--fluid-sp-mul)), calc(30px * 2));
    row-gap: clamp(40px, calc(40px * var(--fluid-sp-mul)), calc(40px * 2));
    width: clamp(890px, calc(890px * var(--fluid-sp-mul)), calc(890px * 2));
    margin-top: clamp(36px, calc(36px * var(--fluid-sp-mul)), calc(36px * 2));
  }
}

.p-strength__item {
  min-width: 0;
}

@media screen and (max-width: 768px) {
  .p-strength__item {
    /* width: 87%; */
  }
}

.p-strength__wrap {
  display: flex;
  align-items: center;
  column-gap: calc(65 / 1080 * 100%);
}

@media screen and (max-width: 768px) {
  .p-strength__wrap {
    flex-direction: column;
    /* row-gap: clamp(30px, calc(30px * var(--fluid-sp-mul)), calc(30px * 2)); */
    row-gap: 0;
  }
}

.p-strength__item:nth-child(even) .p-strength__wrap {
  flex-direction: row-reverse;
}

@media screen and (max-width: 768px) {
  .p-strength__item:nth-child(even) .p-strength__wrap {
    flex-direction: column;
  }
}

.p-strength__img {
  width: calc(517 / 1080 * 100%);
  padding-left: clamp(calc(12px * 28 / 55), calc(12px * var(--fluid-pc-mul)), 12px);
}

@media screen and (max-width: 768px) {
  .p-strength__img {
    width: 100%;
    padding-left: 0;
    text-align: center;
  }

  .p-strength__img img {
    display: inline-block;
    width: calc(254 / 276 * 100%);
  }
}

.p-strength__item:nth-child(even) .p-strength__img {
  padding-left: 0;
  padding-right: clamp(calc(12px * 28 / 55), calc(12px * var(--fluid-pc-mul)), 12px);
}

.p-strength__box {
  width: calc(498 / 1080 * 100%);
  padding-bottom: clamp(calc(18px * 28 / 55), calc(18px * var(--fluid-pc-mul)), 18px);
}

@media screen and (max-width: 768px) {
  .p-strength__box {
    width: 100%;
    padding-bottom: 0;
  }
}

.p-strength__title {}

.p-strength__title-ja {
  font-size: clamp(22px, calc(22px + 8 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 30px);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.53333333;
}

@media screen and (max-width: 768px) {
  .p-strength__title-ja {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: clamp(100px, calc(100px * var(--fluid-sp-mul)), calc(100px * 2));
    font-size: clamp(22px, calc(22px + (100vw - var(--fluid-sp-min-vw)) * 22 / var(--fluid-sp-span)), 44px);
    line-height: 1.62590909;
    text-align: center;
  }
}

.p-strength__title-en {
  margin-top: clamp(calc(8px * 28 / 55), calc(8px * var(--fluid-pc-mul)), 8px);
  font-family: "Helvetica";
  color: #f7bc00;
  font-size: clamp(24px, calc(24px + 6 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 30px);
  font-weight: 300;
  letter-spacing: 0.025em;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .p-strength__title-en {
    margin-top: clamp(-4px, calc(-4px * var(--fluid-sp-mul)), calc(-4px * 2));
    font-size: clamp(24px, calc(24px + (100vw - var(--fluid-sp-min-vw)) * 24 / var(--fluid-sp-span)), 48px);
    line-height: 1;
    text-align: center;
  }
}

.p-strength__text {
  margin-top: clamp(calc(25px * 28 / 55), calc(25px * var(--fluid-pc-mul)), 25px);
  font-size: clamp(13px, calc(13px + 2 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 15px);
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.86666667;
}

@media screen and (max-width: 768px) {
  .p-strength__text {
    margin-top: clamp(21px, calc(21px * var(--fluid-sp-mul)), calc(21px * 2));
    font-size: clamp(13px, calc(13px + (100vw - var(--fluid-sp-min-vw)) * 13 / var(--fluid-sp-span)), 26px);
    line-height: 1.92307692;
    letter-spacing: 0.02em;
  }
}

/*======================================
    p-strength
======================================*/
.p-media-visual {
  padding-top: clamp(calc(180px * 28 / 55), calc(180px * var(--fluid-pc-mul)), 180px);
  padding-bottom: clamp(calc(470px * 28 / 55), calc(470px * var(--fluid-pc-mul)), 470px);
  background: url(../img/renewal/media/main-visual_pc.png) no-repeat center center / cover;
}

@media screen and (max-width: 768px) {
  .p-media-visual {
    padding-top: clamp(100px, calc(100px * var(--fluid-sp-mul)), calc(100px * 2));
    padding-bottom: clamp(30px, calc(30px * var(--fluid-sp-mul)), calc(30px * 2));
    background: url(../img/renewal/media/main-visual_sp.png) no-repeat center center / cover;
  }
}

.p-media-visual__inner {}

.p-media-visual__contents {}

.p-media-visual__title {
  font-size: clamp(17px, calc(17px + 3 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 20px);
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.827;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .p-media-visual__title {
    font-size: clamp(17px, calc(17px + (100vw - var(--fluid-sp-min-vw)) * 17 / var(--fluid-sp-span)), 34px);
  }
}

.p-media-visual__text {
  margin-top: clamp(calc(148px * 28 / 55), calc(148px * var(--fluid-pc-mul)), 148px);
  font-size: clamp(24px, calc(24px + 24 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 48px);
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.67352397;
}

@media screen and (max-width: 768px) {
  .p-media-visual__text {
    margin-top: clamp(385px, calc(385px * var(--fluid-sp-mul)), calc(385px * 2));
    font-size: clamp(24px, calc(24px + (100vw - var(--fluid-sp-min-vw)) * 24 / var(--fluid-sp-span)), 48px);
    line-height: 1.67344498;
    text-align: center;
  }
}

/*======================================
    p-media-about
======================================*/
.p-media-about {}

.p-media-about__inner {}

.p-media-about__contents {}

.p-media-about__section-title {
  font-size: clamp(20px, calc(20px + 3 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 23px);
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.58869565;
}

@media screen and (max-width: 768px) {
  .p-media-about__section-title {
    font-size: clamp(20px, calc(20px + (100vw - var(--fluid-sp-min-vw)) * 20 / var(--fluid-sp-span)), 40px);
    line-height: 1.951;
  }
}

.p-media-about__description {
  margin-top: clamp(calc(20px * 28 / 55), calc(20px * var(--fluid-pc-mul)), 20px);
  font-size: clamp(12px, calc(12px + 3 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 15px);
  font-weight: 500;
  letter-spacing: 0.1em;
  /* line-height: 2.436; */
}

@media screen and (max-width: 768px) {
  .p-media-about__description {
    margin-top: clamp(15px, calc(15px * var(--fluid-sp-mul)), calc(15px * 2));
    font-size: clamp(12px, calc(12px + (100vw - var(--fluid-sp-min-vw)) * 12 / var(--fluid-sp-span)), 24px);
    line-height: 2.19583333;
    letter-spacing: 0.15em;
  }
}

.p-media-about__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: clamp(calc(35px * 28 / 55), calc(35px * var(--fluid-pc-mul)), 35px);
  margin-top: clamp(calc(30px * 28 / 55), calc(30px * var(--fluid-pc-mul)), 30px);
}

@media screen and (max-width: 768px) {
  .p-media-about__cards {
    grid-template-columns: 1fr;
    row-gap: clamp(50px, calc(50px * var(--fluid-sp-mul)), calc(50px * 2));
  }
}

.p-media-about__card {}

.p-media-about__img {}

.p-media-about__head {
  position: relative;
  margin-top: clamp(calc(3px * 28 / 55), calc(3px * var(--fluid-pc-mul)), 3px);
  padding-left: clamp(calc(45px * 28 / 55), calc(45px * var(--fluid-pc-mul)), 45px);
}

@media screen and (max-width: 768px) {
  .p-media-about__head {
    margin-top: clamp(5px, calc(5px * var(--fluid-sp-mul)), calc(5px * 2));
    padding-left: 0;
  }
}

.p-media-about__head::before {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: clamp(-14px, calc(-14px * var(--fluid-pc-mul)), calc(-14px * 28 / 55));
  transform: translate(0, -46%);
  z-index: 1;
  width: clamp(calc(67px * 28 / 55), calc(67px * var(--fluid-pc-mul)), 67px);
  height: clamp(calc(71px * 28 / 55), calc(71px * var(--fluid-pc-mul)), 71px);
}

@media screen and (max-width: 768px) {
  .p-media-about__head::before {
    left: clamp(calc(-14px * 2), calc(-14px * var(--fluid-sp-mul)), -14px);
    width: clamp(50px, calc(50px * var(--fluid-sp-mul)), calc(50px * 2));
    height: clamp(53px, calc(53px * var(--fluid-sp-mul)), calc(53px * 2));
  }
}

.p-media-about__card:nth-child(1) .p-media-about__head::before {
  background: url(../img/renewal/media/number-icon_01.svg) no-repeat center center / contain;
}

.p-media-about__card:nth-child(2) .p-media-about__head::before {
  background: url(../img/renewal/media/number-icon_02.svg) no-repeat center center / contain;
}

.p-media-about__card:nth-child(3) .p-media-about__head::before {
  background: url(../img/renewal/media/number-icon_03.svg) no-repeat center center / contain;
}

.p-media-about__title {
  display: flex;
  align-items: center;
  height: clamp(calc(92px * 28 / 55), calc(92px * var(--fluid-pc-mul)), 92px);
  padding-left: clamp(calc(15px * 28 / 55), calc(15px * var(--fluid-pc-mul)), 15px);
  border-bottom: 1px solid #0680c8;
  color: #0680c8;
  font-size: clamp(18px, calc(18px + 1 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 19px);
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.27625;
}

@media screen and (max-width: 768px) {
  .p-media-about__title {
    height: clamp(80px, calc(80px * var(--fluid-sp-mul)), calc(80px * 2));
    padding-left: clamp(45px, calc(45px * var(--fluid-sp-mul)), calc(45px * 2));
    font-size: clamp(20px, calc(20px + (100vw - var(--fluid-sp-min-vw)) * 18 / var(--fluid-sp-span)), 38px);
    line-height: 1.3;
  }
}

.p-media-about__label {
  margin-top: clamp(calc(5px * 28 / 55), calc(5px * var(--fluid-pc-mul)), 5px);
  padding-left: clamp(calc(62px * 28 / 55), calc(62px * var(--fluid-pc-mul)), 62px);
  color: #e3982f;
  font-size: clamp(13px, calc(13px + 1 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 14px);
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.442;
}

@media screen and (max-width: 768px) {
  .p-media-about__label {
    padding-left: 0;
    font-size: clamp(15px, calc(15px + (100vw - var(--fluid-sp-min-vw)) * 15 / var(--fluid-sp-span)), 30px);
    letter-spacing: 0.05em;
  }
}

.p-media-about__text {
  margin-top: clamp(calc(18px * 28 / 55), calc(18px * var(--fluid-pc-mul)), 18px);
  font-size: clamp(13px, calc(13px + 2 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 15px);
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.68;
}

@media screen and (max-width: 768px) {
  .p-media-about__text {
    margin-top: clamp(20px, calc(20px * var(--fluid-sp-mul)), calc(20px * 2));
    font-size: clamp(13px, calc(13px + (100vw - var(--fluid-sp-min-vw)) * 13 / var(--fluid-sp-span)), 26px);
    line-height: 1.92307692;
    letter-spacing: 0.02em;
  }
}

.p-media-about__copy {
  margin-top: clamp(calc(75px * 28 / 55), calc(75px * var(--fluid-pc-mul)), 75px);
  font-size: clamp(24px, calc(24px + 12 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 36px);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.76888889;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .p-media-about__copy {
    margin-top: clamp(85px, calc(85px * var(--fluid-sp-mul)), calc(85px * 2));
    font-size: clamp(24px, calc(24px + (100vw - var(--fluid-sp-min-vw)) * 24 / var(--fluid-sp-span)), 48px);
    letter-spacing: 0.1em;
    line-height: 1.67344498;
  }
}

.p-media-about__visual {
  margin-top: clamp(calc(20px * 28 / 55), calc(20px * var(--fluid-pc-mul)), 20px);
}

@media screen and (max-width: 768px) {
  .p-media-about__visual {
    margin-top: clamp(70px, calc(70px * var(--fluid-sp-mul)), calc(70px * 2));
    padding-top: clamp(40px, calc(40px * var(--fluid-sp-mul)), calc(40px * 2));
    padding-bottom: clamp(40px, calc(40px * var(--fluid-sp-mul)), calc(40px * 2));
    margin-inline: calc(50% - 50vw);
    overflow: hidden;
  }

  .p-media-about__visual img {
    transform: scale(1.115) translateX(1.4%);
  }
}

.p-media-about__note {
  margin-top: clamp(calc(28px * 28 / 55), calc(28px * var(--fluid-pc-mul)), 28px);
  font-size: clamp(14px, calc(14px + 1 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 15px);
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.68;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .p-media-about__note {
    margin-top: clamp(25px, calc(25px * var(--fluid-sp-mul)), calc(25px * 2));
    font-size: clamp(14px, calc(14px + (100vw - var(--fluid-sp-min-vw)) * 14 / var(--fluid-sp-span)), 28px);
    letter-spacing: 0.1em;
    line-height: 1.845;
    text-align: left;
  }
}

/*======================================
    p-gakushiru
======================================*/
.p-gakushiru {}

.p-gakushiru__inner.l-inner {
  width: calc(1240px + (20px * 2));
}

.p-gakushiru__contents {
  text-align: center;
}

.p-gakushiru__section-title {
  font-size: clamp(24px, calc(24px + 4 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 28px);
  font-weight: 700;
  letter-spacing: 0.1em;
}

@media screen and (max-width: 768px) {
  .p-gakushiru__section-title {
    font-size: clamp(24px, calc(24px + (100vw - var(--fluid-sp-min-vw)) * 24 / var(--fluid-sp-span)), 48px);
    letter-spacing: 0;
    line-height: 1.49041667;
  }
}

.p-gakushiru__text {
  margin-top: clamp(calc(30px * 28 / 55), calc(30px * var(--fluid-pc-mul)), 30px);
  font-size: clamp(18px, calc(18px + 6 * (100vw - var(--fluid-min-vw)) / var(--fluid-span)), 24px);
  font-weight: 700;
  letter-spacing: 0.225em;
  line-height: 2.10958333;
}

@media screen and (max-width: 768px) {
  .p-gakushiru__text {
    margin-top: clamp(18px, calc(18px * var(--fluid-sp-mul)), calc(18px * 2));
    font-size: clamp(18px, calc(18px + (100vw - var(--fluid-sp-min-vw)) * 18 / var(--fluid-sp-span)), 36px);
    line-height: 1.85555556;
    letter-spacing: 0.03em;
    white-space: nowrap;
  }
}

.p-gakushiru__box {
  margin-top: clamp(calc(60px * 28 / 55), calc(60px * var(--fluid-pc-mul)), 60px);
  padding-top: clamp(calc(65px * 28 / 55), calc(65px * var(--fluid-pc-mul)), 65px);
  padding-bottom: clamp(calc(70px * 28 / 55), calc(70px * var(--fluid-pc-mul)), 70px);
  padding-right: clamp(calc(34px * 28 / 55), calc(34px * var(--fluid-pc-mul)), 34px);
  padding-left: clamp(calc(34px * 28 / 55), calc(34px * var(--fluid-pc-mul)), 34px);
  background-color: #fff;
}

.p-gakushiru__box img {
  display: inline-block;
  width: clamp(calc(1080px * 28 / 55), calc(1080px * var(--fluid-pc-mul)), 1080px);
  max-width: 100%;
}

@media screen and (max-width: 768px) {
  .p-gakushiru__box {
    margin-top: clamp(56px, calc(56px * var(--fluid-sp-mul)), calc(56px * 2));
    margin-inline: calc(50% - 50vw);
    padding-top: clamp(55px, calc(55px * var(--fluid-sp-mul)), calc(55px * 2));
    padding-bottom: clamp(60px, calc(60px * var(--fluid-sp-mul)), calc(60px * 2));
    padding-right: clamp(34px, calc(34px * var(--fluid-sp-mul)), calc(34px * 2));
    padding-left: clamp(34px, calc(34px * var(--fluid-sp-mul)), calc(34px * 2));
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .p-gakushiru__box img {
    width: clamp(907px, calc(907px * var(--fluid-sp-mul)), calc(907px * 2));
    max-width: clamp(907px, calc(907px * var(--fluid-sp-mul)), calc(907px * 2));
  }
}