@charset "UTF-8";
/* ============================= 共通パーツレイアウト ============================= */
@media screen {
   :root {
      --color-text: #0E0E10;
      --color-gold: #D4AF37;
      --color-white: #FFFBEF;
      --color-red: #C01310;
      --color-ivory: #F8F3E1;
      --color-ivory2: #FFEDB6;
      --color-blue: #1361BB;

      --grad-red: linear-gradient(to right, #D43737 0%, #6E1D1D 100%);
      --grad-gold-light: linear-gradient(to top, #D4AF37 0%, #FFFFFF 100%);
      --grad-grey: linear-gradient(to bottom, #828282 0%, #131313 100%);
      --grad-gold-rich: linear-gradient(45deg, #D4AF37 0%, #FFEBAA 43%, #D4AF37 100%);

      --font-ten: "Ten Mincho", serif;
      --font-shippori: "Shippori Mincho", serif;
      --font-cormorant: "Cormorant Garamond", serif;
      --font-caveat: "Caveat", cursive;
      --font-didot: "GFS Didot", serif;
   }

   .text-grad-red {
      background: linear-gradient(to top, #D43737 0%, #E20B07 47%, #FF0400 100%);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      color: transparent;
      display: inline-block;
   }

   html,
   body {
      width: 100%;
      overflow-x: hidden;
   }

   body {
      font-family: var(--font-shippori);
      font-weight: 400;
      color: var(--color-text);
      font-size: 16px;
      line-height: 1.7;
      background-color: #fff;
      position: relative;
   }

   a {
      transition: opacity .3s;
   }

   a:hover {
      opacity: 0.7;
   }

   img {
      width: 100%;
   }

   .sp,
   .tb,
   .ssp,
   .ham {
      display: none;
   }

   .innerWrap {
      margin: 0 auto;
      width: 100%;
      max-width: 1200px;
   }

   main>section {
      margin-bottom: 180px;
   }

   .btn_cta {
      width: 100%;
      max-width: 448px;
      height: 72px;
   }

   .btn_cta a {
      width: 100%;
      height: 100%;
      background: var(--grad-red);
      box-shadow: 4px 4px 4px 0 rgba(255, 255, 255, 0.3);
      border-radius: 48px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      color: var(--color-white);
      font-weight: 500;
   }

   header .btn_cta a span,
   .hero .btn_cta a span {
      font-weight: 600;
      font-size: 24px;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 12px;
   }

   header .btn_cta a span::after,
   .hero .btn_cta a span::after {
      content: "";
      width: 11px;
      height: 14px;
      background-image: url(../img/arrow.svg);
      background-size: contain;
      background-repeat: no-repeat;
   }


   .btn_cta2 {
      max-width: 640px;
      height: 96px;
   }

   .btn_cta2 a {
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: row;
      box-shadow: 4px 4px 4px rgba(14, 14, 16, 0.6);
   }

   .btn_cta2 a::after {
      content: "";
      width: 45px;
      height: 45px;
      background-image: url(../img/arrow2.png);
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      margin-left: 24px;
   }

   h2.h2_common {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      font-size: 24px;
      margin-bottom: 56px;
   }

   h2.h2_common span {
      background: linear-gradient(to top, #D43737 0%, #E20B07 47%, #FF0400 100%);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      color: transparent;
      display: inline-block;
      font-family: var(--font-cormorant);
      font-size: 64px;
      display: flex;
      align-items: center;
      width: 100%;
      gap: .5em;
      line-height: 1.1;
   }

   h2.h2_common span::after {
      content: "";
      flex-grow: 1;
      height: 1px;
      background-color: var(--color-red);
   }

   h2.h2_common.h2_common_center {
      align-items: center;
   }

   h2.h2_common.h2_common_center span {
      justify-content: center;
   }

   h2.h2_common.h2_common_center span::before {
      content: "";
      flex-grow: 1;
      height: 1px;
      background-color: var(--color-red);
   }

   h2.h2_common.h2_common_white {
      color: var(--color-white);
   }

   h2.h2_common.h2_common_white span::before,
   h2.h2_common.h2_common_white span::after {
      background-color: var(--color-white);
   }

   h2.h2_common.h2_common_white span {
      background: none;
      -webkit-text-fill-color: var(--color-white);
      color: var(--color-white);
      font-family: var(--font-shippori);
   }

   .section-copy {
      font-weight: 700;
      font-size: 40px;
      margin-bottom: 56px;
   }

   .event .section-copy,
   .staff .section-copy,
   .consultant .section-copy,
   .awards .section-copy {
      text-align: center;
   }

   .about .section-copy {
      font-size: 48px;
   }

   .about .section-copy span {
      font-size: 40px;
   }
}

/* ============================= 共通ヘッダー・フッター ============================= */
@media screen {
   header {
      background-color: var(--color-text);
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      z-index: 1000;
   }

   header .innerWrap {
      max-width: 100%;
      height: 100px;
      padding-left: max(20px, (100% - 1200px) / 2);
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: var(--color-white);
   }

   header .innerWrap>div {
      display: flex;
      align-items: center;
      gap: 24px;
   }

   header .global-nav ul {
      display: flex;
      align-items: center;
      gap: 32px;
   }

   header .logo {
      width: 360px;
   }

   header .header-contact a {
      display: flex;
      align-items: center;
      justify-content: center;
      padding-left: 28px;
      padding-right: 28px;
      height: 100px;
      text-align: center;
      background-image: url(../img/arrow.svg), var(--grad-red);
      background-size: 12px 8px, auto;
      background-repeat: no-repeat, no-repeat;
      background-position: right 9px center, center;
   }

   main {
      padding-top: 100px;
   }

   footer {
      background-color: var(--color-ivory);
   }

   footer .innerWrap {
      color: var(--color-gold);
      text-align: center;
      padding: 24px 0 16px;
   }

   footer .innerWrap>p:first-child {
      font-size: 24px;
      margin-bottom: 8px;
   }

   footer .innerWrap>ul {
      margin-bottom: 24px;
   }

   footer .innerWrap>a {
      display: inline-block;
      width: 240px;
      margin-bottom: 24px;
   }
}

/* ============================= トップページ ============================= */
@media screen {
   .top .hero {
      background-color: var(--color-text);
      background-image: url(../img/bg_hero_pc.png);
      background-repeat: no-repeat;
      background-position: center center;
      background-size: auto 100%;
      position: relative;
   }

   .top .hero::after {
      content: "";
      width: 100%;
      max-width: 865px;
      aspect-ratio: 865 / 160;
      background-image: url(../img/logo_bold.svg);
      background-repeat: no-repeat;
      background-size: contain;
      background-position: right bottom;
      opacity: .4;
      position: absolute;
      bottom: 0;
      right: max(20px, calc(20px + (100vw - 1440px) / 2));
      z-index: 1;
   }

   .top .hero .innerWrap {
      height: 680px;
      color: var(--color-white);
      padding-top: 126px;
      z-index: 2;
      position: relative;
   }

   .top .hero h2 {
      font-family: var(--font-ten);
      font-size: 56px;
      text-shadow: 4px 4px 4px rgba(0, 0, 0, 0.7);
      margin-bottom: 24px;
   }

   .top .hero h2 span {
      font-size: 48px;
   }

   .top .hero .sub-copy {
      font-size: 24px;
      text-shadow: 4px 4px 4px rgba(0, 0, 0, 0.7);
      margin-bottom: 32px;
      font-weight: 600;
   }

   .top .hero .small-copy {
      margin-bottom: 48px;

      text-shadow: 4px 4px 4px rgba(0, 0, 0, 0.7);
   }

   .top .about .innerWrap {
      display: flex;
   }

   .top .about .innerWrap>div {
      width: 50%;
   }

   .top .about .innerWrap::after {
      content: "";
      width: 50%;
      height: auto;
      background-image: url(../img/img_about.png);
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
      border-radius: 40px 0 40px 0;
   }

   .top .service {
      background: linear-gradient(to top, #D4AF37 0%, #FFFFFF 40%);
      margin-bottom: 0;
   }

   .top .service .innerWrap>div {
      display: flex;
      justify-content: space-between;
      gap: 60px;
      padding-bottom: 40px;
   }

   .top .service .service-block {
      text-align: center;
   }

   .top .service .service-block>p:first-child {
      display: flex;
      flex-direction: column;
      align-items: center;
   }

   .top .service .service-block>p:first-child img {
      border-radius: 40px 0 40px 0;
   }

   .top .service .service-block>p:first-child::after {
      content: "PERSONAL";
      font-family: var(--font-caveat);
      font-size: 64px;
      color: rgba(14, 14, 16, 0.2);
      line-height: 1;
   }

   .top .service .service-block:last-child>p:first-child::after {
      content: "CORPORATE";
   }

   .top .service .service-block h3 {
      font-weight: 600;
      font-size: 32px;
      margin-top: -16px;
      margin-bottom: 16px;
      line-height: 1;
   }






   .top .cta {
      background: var(--grad-grey);
   }

   .top .cta .innerWrap {
      margin-left: max(0px, (100% - 1200px) / 2);
      margin-right: max(0px, (100% - 1440px) / 2);
      width: auto;
      max-width: none;
      display: grid;
      grid-template-columns: auto 1fr;
      align-items: stretch;
   }

   .top .cta .innerWrap::before {
      content: "";
      display: block;
      min-width: 0;
      min-height: 0;
      height: 100%;
      aspect-ratio: 357 / 415;
      background: url(../img/img_cta.png) no-repeat center / cover;
   }

   .top .cta .innerWrap>div {
      display: flex;
      flex-direction: column;
      align-items: center;
      padding-top: 56px;
      color: #fff;
      font-size: 32px;
      line-height: 1;
   }

   .top .cta .innerWrap>div>p:first-child {
      margin-bottom: 24px;
      text-shadow: 4px 4px 4px rgba(0, 0, 0, 0.7);
   }

   .top .cta .innerWrap>div>div {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      padding-left: 20px;
   }

   .top .cta .btn_cta {
      margin-bottom: 24px;
   }

   .top .cta .cta_tel,
   .top .cta .cta_insta {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      margin-bottom: 16px;
      text-shadow: 4px 4px 4px rgba(0, 0, 0, 0.7);
   }

   .top .cta .cta_insta a,
   .top .cta .cta_tel a {
      font-family: var(--font-didot);
   }

   .top .cta .cta_tel span,
   .top .cta .cta_insta span {
      font-size: 16px;
   }


   .top .cta .cta_tel a,
   .top .cta .cta_insta a {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 16px;
   }

   .top .cta .cta_tel a::before,
   .top .cta .cta_insta a::before {
      content: "";
      width: 26px;
      height: 26px;
      background-image: url(../img/icon_tel.svg);
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center center;
   }

   .top .cta .cta_tel a::before {
      transform: translateY(-2px);
   }

   .top .cta .cta_insta a::before {
      background-image: url(../img/icon_insta.svg);
   }

   .top .cta .innerWrap>div::after {
      content: "";
      display: block;
      width: 100%;
      max-width: 962px;
      aspect-ratio: 962 / 124;
      background: url(../img/logo_bold_nobottom.svg) no-repeat right bottom / contain;
      opacity: .8;
      margin-top: auto;
   }

   .top .cta .innerWrap>div *:last-child {
      margin-bottom: 0;
   }

   .top .event ul {
      display: flex;
      gap: 36px;
      margin-bottom: 40px;
   }

   .top .event .innerWrap>p:last-child {
      text-align: center;
      font-size: 24px;
   }

   .top .insurance h3 {
      width: 286px;
      height: 60px;
      border-radius: 30px;
      margin-bottom: 40px;
      color: var(--color-white);
      display: flex;
      justify-content: center;
      align-items: center;
      background: var(--color-gold);
      font-size: 32px;
      font-weight: 600;
   }

   .top .insurance ul {
      display: flex;
      gap: 24px;
   }

   .top .insurance .insurance-block {
      margin-bottom: 80px;
   }

   .top .insurance div.insurance-block:last-of-type {
      margin-bottom: 40px;
   }

   .top .insurance .innerWrap>p {
      font-size: 24px;
      text-align: center;
   }

   .top .policy .innerWrap>div {
      display: flex;
   }

   .top .policy .innerWrap>div>div {
      width: 50%;
   }

   .top .policy .innerWrap>div::after {
      content: "";
      width: 50%;
      height: auto;
      background-image: url(../img/img_policy.png);
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
      border-radius: 0 40px 0 40px;
   }

   .top .policy ul {
      display: flex;
      flex-direction: column;
      gap: 30px;
      line-height: 1.2;
   }

   .top .policy ul h3 {
      font-size: 24px;
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 12px;
   }

   .top .policy ul h3::before {
      content: "";
      width: 20px;
      height: 20px;
      background-image: url(../img/icon_check.png);
      background-size: contain;
      background-repeat: no-repeat;
      flex-shrink: 0;
   }

   .top .policy ul p {
      padding-left: 36px;
   }

   .top .section-copy {
      margin-bottom: 24px;
   }

   .top .brand {
      background-color: var(--color-ivory);
      padding-top: 40px;
      padding-bottom: 40px;
   }

   .top .brand ul {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 40px 30px;
      list-style: none;
      padding: 0;
      margin: 0;
   }

   .top .brand li {
      display: flex;
      justify-content: center;
      align-items: center;
   }

   .top .brand li img {
      max-width: 100%;
      height: auto;
   }

   .top .staff .section-copy {
      margin-bottom: 56px;
   }

   .top .staff ul {
      display: flex;
      gap: 24px;
   }

   .top .staff ul li {
      padding: 24px;
      background: var(--grad-gold-rich);
      flex: 1;
   }

   .top .staff .staff-photo {
      margin-bottom: 16px;
   }

   .top .staff .staff-photo img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
   }

   .top .staff h3 {
      margin-bottom: 32px;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 16px;
      line-height: 1;
      font-size: 40px;
      font-weight: 600;
   }

   .top .staff h3 span {
      font-size: 16px;
      font-weight: 400;
   }

   .top .staff .staff-comment {
      text-align: center;
      font-size: 24px;
   }

   .top .message .innerWrap {
      display: flex;
      gap: 44px;
   }

   .top .message .innerWrap::before {
      content: "";
      width: 43%;
      height: auto;
      background-image: url(../img/img_message.png);
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
   }

   .top .message .innerWrap>div>div p {
      margin-bottom: 32px;
   }

   .top .message .signature {
      font-size: 24px;
   }

   .top .consultant .section-copy {
      margin-bottom: 56px;
   }

   .top .consultant .flow-steps {
      display: flex;
      margin-bottom: 40px;
   }

   .top .consultant .flow-steps li:not(:last-child) {
      padding-right: 72px;
      background-image: url(../img/arrow_gold.svg);
      background-repeat: no-repeat;
      background-position: right 4px center;
      background-size: 60px 47px;
   }

   .top .consultant .innerWrap>p:last-child {
      text-align: center;
      font-size: 24px;
   }

   .top .cta2 .innerWrap::before {
      background: url(../img/img_cta2.png) no-repeat center / cover;
   }

   .top .partner .innerWrap {
      display: flex;
   }

   .top .partner .innerWrap::after {
      content: "";
      width: 50%;
      height: auto;
      background-image: url(../img/img_partners.png);
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
      border-radius: 0 40px 0 40px;
   }

   .top .partner li {
      font-size: 24px;
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 12px;
   }

   .top .partner li::before {
      content: "";
      width: 20px;
      height: 20px;
      background-image: url(../img/icon_check.png);
      background-size: contain;
      background-repeat: no-repeat;
      flex-shrink: 0;
   }

   .top .awards {
      background-image: url(../img/bg_awards.png);
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
      padding-top: 40px;
      padding-bottom: 40px;
      margin-bottom: 0;
   }

   .top .awards ul {
      display: flex;
      gap: 24px;
   }

   .top .emergency {
      background-color: var(--color-blue);
      padding-top: 80px;
      padding-bottom: 80px;
      margin-bottom: 0;
   }

   .top .emergency h2.h2_common {
      font-size: 32px;
      margin-bottom: 24px;
   }

   .top .emergency h2.h2_common span {
      font-size: 48px;
   }

   .top .emergency .innerWrap>p {
      text-align: center;
      font-size: 24px;
      color: var(--color-white);
   }

   .top .emergency .contact-table {
      display: grid;
      grid-template-columns: 25% 37.5% 37.5%;
      background-color: var(--color-text);
      gap: 1px;
      border: 1px solid var(--color-text);
      width: 100%;
      font-size: 28px;
      margin-bottom: 16px;
   }

   .top .emergency .contact-category {
      grid-row: span 2;
      background-color: var(--color-ivory2);
      padding: 40px 20px;
      display: flex;
      flex-direction: column;
      justify-content: center;
   }

   .top .emergency .contact-list,
   .top .emergency .contact-item {
      display: contents;
   }

   .top .emergency .company-name,
   .top .emergency .phone-number {
      background-color: var(--color-white);
      padding: 32px 4%;
      display: flex;
      align-items: center;
   }

   .top .emergency .phone-number {
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
   }

   .top .emergency .phone-number a {
      text-decoration: underline;
   }

   .top .emergency .category-sub {
      font-size: 22px;
      margin-top: 10px;
   }

   .top .emergency .phone-note {
      font-size: 22px;
      margin-top: 8px;
   }

   .top .contact {
      padding-top: 80px;
   }

   .top .contact h2 {
      width: 100%;
      max-width: 1200px;
      margin: 0 auto 16px;
      padding-left: 20px;
      padding-right: 20px;
   }

   .top .cta3 {
      margin-bottom: 0;
   }

   .top .cta3 .innerWrap::before {
      background: url(../img/img_cta3.png) no-repeat center / cover;
   }

   .top .cta3 .innerWrap>div {
      padding-top: 0;
   }
}

/* ============================= 個別ページ ============================= */
@media screen {
   .page .page-header {
      padding: 100px 0 80px;
      background-color: var(--color-ivory);
      margin-bottom: 80px;
   }

   .page .page-header-title {
      text-align: center;
   }

   .page .page-header-title .en {
      display: block;
      font-family: var(--font-cormorant);
      font-size: 64px;
      line-height: 1.1;
      color: var(--color-text);
      margin-bottom: 15px;
   }

   .page .page-header-title .jp {
      display: inline-block;
      font-size: 28px;
      font-weight: 700;
      line-height: 1.4;
      letter-spacing: 0.05em;
   }

   .page .page-body-section {
      margin-bottom: 100px;
   }

   .page .policy-heading {
      text-align: left;
      margin-bottom: 40px;
      border-bottom: 1px solid var(--color-text);
      padding-bottom: 15px;
   }

   .page .policy-heading .en {
      display: block;
      font-family: var(--font-cormorant);
      font-size: 36px;
      line-height: 1.2;
      color: var(--color-text);
   }

   .page .policy-heading .jp {
      display: block;
      font-size: 18px;
      font-weight: 700;
      margin-top: 5px;
   }

   .page .policy-content {
      max-width: 900px;
      margin: 0 auto;
      line-height: 1.9;
      font-family: var(--font-shippori);
   }

   .page .policy-content p {
      margin-bottom: 1.5em;
   }

   .page .policy-content h3 {
      font-size: 18px;
      font-weight: 700;
      margin: 48px 0 24px;
      display: flex;
      align-items: center;
   }

   .page .policy-content h4 {
      font-size: 16px;
      font-weight: 700;
      margin-bottom: 12px;
   }

   .page .policy-content .sub-title {
      font-weight: 700;
      margin-bottom: 8px;
   }

   .page .list-dot {
      list-style: none;
      padding-left: 0;
      margin-bottom: 2em;
   }

   .page .list-dot li {
      position: relative;
      padding-left: 1.5em;
      margin-bottom: 0.6em;
   }

   .page .list-dot li::before {
      content: "・";
      position: absolute;
      left: 0;
   }

   /* 数字付きリスト（CSSカウンタ） */
   .page .list-number {
      counter-reset: policy-counter;
      list-style: none;
      padding-left: 0;
      margin-top: 20px;
   }

   .page .list-number>li {
      counter-increment: policy-counter;
      margin-bottom: 48px;
      padding-left: 2.5em;
      position: relative;
   }

   .page .list-number>li::before {
      content: counter(policy-counter) ". ";
      position: absolute;
      left: 0;
      font-weight: 700;
      font-family: var(--font-cormorant);
      font-size: 1.1em;
   }

   .page .list-number.no-indent>li {
      padding-left: 1.5em;
      margin-bottom: 0.8em;
   }

   .page .recommend-box {
      margin: 40px 0;
      padding: 30px;
      background-color: var(--color-white);
      border: 1px solid #ddd;
   }

   .page .recommend-box dl dt {
      font-weight: 700;
      text-decoration: underline;
      margin-top: 1.5em;
   }

   .page .recommend-box dl dd {
      padding-left: 1em;
      margin-bottom: 0.5em;
   }

   /* 免責事項ボックス */
   .page .disclaimer-box {
      margin-top: 80px;
      padding: 40px;
      background-color: #fcfcfc;
      border: 1px solid #eee;
   }

   .page .disclaimer-box h3 {
      margin-top: 0;
   }

   /* 文末・署名 */
   .page .policy-footer {
      text-align: right;
      margin-top: 40px;
      font-weight: 500;
   }

   .page .policy-footer-note {
      text-align: left;
      font-size: 14px;
      margin-top: 80px;
      color: #666;
   }

   @media screen and (max-width: 768px) {
      .page .page-header {
         padding: 60px 0 40px;
      }

      .page .page-header-title .en {
         font-size: 36px;
      }

      .page .page-header-title .jp {
         font-size: 18px;
      }

      .page .page-body {
         padding-top: 40px;
      }

      .page .page-body-section {
         margin-bottom: 60px;
      }

      .page .policy-heading .en {
         font-size: 28px;
      }

      .page .policy-content {
         font-size: 15px;
      }

      .page .disclaimer-box {
         padding: 25px;
      }

      .page .list-number>li {
         padding-left: 2em;
      }
   }
}

/* ============================= 問い合わせフォーム ============================= */
@media screen {
   .page-contact .contact-form {
      max-width: 800px;
      margin: 0 auto;
      padding-top: 40px;
   }

   .page-contact .form-item {
      margin-bottom: 32px;
   }

   .page-contact .form-label,
   .page-contact .form-label-center {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 8px;
      font-weight: 700;
      font-size: 24px;
   }

   .page-contact .chip {
      display: inline-block;
      padding: 2px 8px;
      font-size: 16px;
      color: #fff;
      font-weight: 400;
      line-height: 1.2;
   }

   .page-contact .chip-required {
      background-color: var(--color-red);
      /* #C01310 */
   }

   .page-contact .chip-optional {
      background-color: var(--color-blue);
   }

   .page-contact .form-input input[type="text"],
   .page-contact .form-input input[type="email"],
   .page-contact .form-input input[type="tel"],
   .page-contact .form-input textarea {
      width: 100%;
      padding: 12px 16px;
      background-color: #eee;
      border: 1px solid #ddd;
      border-radius: 4px;
      font-family: inherit;
      font-size: 16px;
   }

   .page-contact .form-input textarea {
      resize: vertical;
   }

   .page-contact .form-item-checkbox {
      margin: 48px 0;
   }

   /* .page-contact .form-label-center {
      justify-content: center;
      margin-bottom: 24px;
      position: relative;
   }

   .page-contact .form-label-center::before,
   .page-contact .form-label-center::after {
      content: "";
      flex-grow: 1;
      height: 1px;
      background-color: #ccc;
   } */

   .page-contact .checkbox-group {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px 20px;
   }

   .page-contact .checkbox-group label {
      display: flex;
      align-items: center;
      gap: 8px;
      cursor: pointer;
      white-space: nowrap;
      font-size: 24px;
   }

   .page-contact .checkbox-other {
      grid-column: span 2;
   }

   .page-contact .input-other {
      flex-grow: 1;
      border: none !important;
      border-bottom: 1px solid #666 !important;
      background: transparent !important;
      border-radius: 0 !important;
      padding: 2px 5px !important;
   }

   .page-contact .form-agreement {
      text-align: center;
      margin-bottom: 32px;
   }

   .page-contact .form-agreement a {
      text-decoration: underline;
      color: var(--color-blue);
   }

   .page-contact .form-submit {
      text-align: center;
   }

   .page-contact .btn-submit {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 80px;
      font-size: 32px;
      font-weight: 700;
      color: var(--color-text);
      border-radius: 40px;
      background: linear-gradient(to right, #D4AF37 0%, #FDDA67 100%);
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
      cursor: pointer;
      transition: opacity 0.3s, transform 0.2s;
      border: none;
   }

   .page-contact .btn-submit:hover {
      opacity: 0.9;
      transform: translateY(-2px);
   }

   .page-contact .submit-note {
      margin-top: 16px;
      font-size: 14px;
      color: #333;
   }

   .page-contact .checkbox-other:has(input[type="checkbox"]:checked) .input-other {
      background-color: #fff !important;
      border-bottom: 2px solid var(--color-blue) !important;
      box-shadow: 0 2px 5px rgba(192, 19, 16, 0.1);
      outline: none;
   }

   .page-contact .input-other {
      transition: background-color 0.3s, border-color 0.3s, box-shadow 0.3s;
   }

   @media screen and (max-width: 768px) {
      .page-contact .checkbox-group {
         grid-template-columns: repeat(2, 1fr);
      }

      .page-contact .checkbox-other {
         grid-column: span 2;
      }

      .page-contact .checkbox-other span {
         display: flex;
         gap: 8px;
         align-items: center;
      }

      .page-contact .btn-submit {
         height: 64px;
         font-size: 24px;
      }
   }

   @media screen and (max-width: 480px) {
      .page-contact .checkbox-group {
         grid-template-columns: 1fr;
      }

      .page-contact .checkbox-other {
         grid-column: span 1;
      }

      .page-contact .checkbox-group label.checkbox-other {
         flex-direction: column;
         align-items: flex-start;
         gap: 10px;
      }

      .page-contact label.checkbox-other .input-other {
         width: 100%;
         padding-left: 0;
      }
   }

   /* ============================= エラー・バリデーション補完 ============================= */
   .page-contact input.is-error,
   .page-contact textarea.is-error {
      border: 2px solid var(--color-red) !important;
      background-color: #fff0f0 !important;
      /* 薄い赤背景で警告を強調 */
      outline: none;
   }

   /* ============================= モーダルシステム ============================= */
   .page .modal-overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(14, 14, 16, 0.85);
      display: none;
      justify-content: center;
      align-items: center;
      z-index: 2000;
      padding: 20px;
   }

   .page .modal-container {
      background-color: var(--color-white);
      width: 100%;
      max-width: 680px;
      max-height: 90vh;
      border-radius: 12px;
      overflow-y: auto;
      position: relative;
      padding: 40px;
      box-shadow: 0 15px 40px rgba(0, 0, 0, 0.4);
   }

   .page .modal-body h2 {
      font-family: var(--font-shippori);
      font-size: 28px;
      text-align: center;
      margin-bottom: 30px;
      color: var(--color-text);
   }

   .page .confirm-table {
      width: 100%;
      margin-bottom: 40px;
      border-collapse: collapse;
   }

   .page .confirm-table th,
   .page .confirm-table td {
      padding: 18px 15px;
      border-bottom: 1px solid #e0e0e0;
      text-align: left;
      font-size: 15px;
      line-height: 1.6;
   }

   .page .confirm-table th {
      width: 35%;
      background-color: var(--color-ivory);
      font-weight: 700;
      color: var(--color-text);
   }

   .page .modal-btns {
      display: flex;
      gap: 24px;
      justify-content: center;
      margin-top: 20px;
   }

   /* ボタン内の文字中央揃えを固定 */
   .page .btn-back,
   .page .btn-send {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 220px;
      height: 60px;
      padding: 0;
      line-height: 1;
      border-radius: 30px;
      font-weight: 700;
      font-size: 17px;
      cursor: pointer;
      transition: 0.3s;
      text-decoration: none;
   }

   .page .btn-back {
      background: #fff;
      border: 1px solid var(--color-gold);
      color: var(--color-gold);
   }

   .page .btn-send {
      background: linear-gradient(to right, #D4AF37 0%, #FDDA67 100%);
      border: none;
      color: var(--color-text);
      box-shadow: 0 4px 15px rgba(212, 175, 55, 0.3);
   }

   .page .btn-back:hover,
   .page .btn-send:hover {
      opacity: 0.8;
      transform: translateY(-1px);
   }

   .page .loader {
      text-align: center;
      padding: 50px 0;
   }

   .page .loader::after {
      content: "";
      display: inline-block;
      width: 44px;
      height: 44px;
      border: 4px solid var(--color-ivory2);
      border-top-color: var(--color-gold);
      border-radius: 50%;
      animation: spin 1s linear infinite;
   }

   @keyframes spin {
      to {
         transform: rotate(360deg);
      }
   }

   @media screen and (max-width: 540px) {
      .page .modal-btns {
         flex-direction: column;
         align-items: center;
         gap: 15px;
      }

      .page .btn-back,
      .page .btn-send {
         width: 100%;
         max-width: 280px;
      }
   }
}





/* ============================= レスポンシブ〜1440px ============================= */
@media screen and (max-width:1440px) {}

/* ============================= レスポンシブ〜1280px ============================= */
@media screen and (max-width:1280px) {
   .innerWrap {
      padding-left: 20px;
      padding-right: 20px;
   }
}

/* ============================= レスポンシブ〜1024px ============================= */
@media screen and (max-width:1080px) {
   .tb {
      display: revert;
   }

   .cta .pc {
      display: none;
   }

   .top .hero::after {
      right: 0;
   }

   .top .cta .innerWrap::before {
      content: none;
   }

   .top .cta .innerWrap {
      grid-template-columns: 1fr;
   }

   .top .cta .innerWrap>div {
      padding-top: 30px;
   }

   .top .cta .innerWrap>div>div {
      flex-direction: column-reverse;
      padding-left: 0;
   }

   .top .cta .innerWrap>div>div>div {
      margin: 0 auto 32px !important;
      width: 100%;
      max-width: 490px;
      display: flex;
      justify-content: center;
      gap: 16px;
      align-items: center;
   }

   .top .cta .innerWrap>div>div>div::after {
      content: "";
      width: clamp(90px, 32.12vw - 30.45px, 143px);
      aspect-ratio: 143 / 154;
      background-image: url(../img/img_cta.png);
      background-size: contain;
      background-position: center center;
      background-repeat: no-repeat;
   }

   .top .cta .cta_tel,
   .top .cta .cta_insta {
      align-items: flex-start;
      font-size: 24px;
   }

   .top .cta .cta_tel span {
      font-size: 16px;
   }

   .top .cta .cta_insta span {
      font-size: 12px;
   }


   .top .cta.cta2 .innerWrap>div>div>div::after {
      background-image: url(../img/img_cta2.png);
   }


   .top .cta3 .innerWrap>div>div>div::after {
      background-image: url(../img/img_cta3.png);
   }
}

/* ============================= レスポンシブ〜768px ============================= */
@media screen and (max-width:768px) {
   .pc {
      display: none;
   }

   .sp {
      display: revert;
   }

   h2.h2_common {
      align-items: center;
      margin-bottom: 40px;
   }

   h2.h2_common span {
      justify-content: center;
      font-size: 56px;
   }

   h2.h2_common span::before {
      content: "";
      flex-grow: 1;
      height: 1px;
      background-color: var(--color-red);
   }

   .section-copy {
      font-size: 32px;
   }

   .hero .innerWrap {
      padding-left: 0;
      padding-right: 0;
   }

   .hero .innerWrap>div>div {
      padding-left: 20px;
      padding-right: 20px;
   }

   .hero .innerWrap .btn_cta {
      width: calc(100% - 40px);
   }

   .about .section-copy {
      font-size: 40px;
   }

   .about .section-copy span {
      font-size: 32px;
   }

   header .logo {
      width: 300px;
   }

   footer .innerWrap {
      padding: 16px 0;
   }

   footer .innerWrap>p:first-child {
      font-size: 16px;
   }

   footer .innerWrap>ul {
      font-size: 12px;
      margin-bottom: 8px;
   }

   footer .innerWrap>a {
      width: 180px;
      margin-bottom: 16px;
   }

   main>section {
      margin-bottom: 80px;
   }

   .top .hero {
      background-image: url(../img/bg_hero_sp.png);
      background-size: cover;
   }

   .top .hero .innerWrap {
      height: calc(100svh - 100px);
      padding-top: 200px;
      padding-bottom: 120px;
      text-align: center;
      display: flex;
      justify-content: space-between;
      flex-direction: column;
   }

   .top .hero h2 {
      font-size: 40px;
      margin-bottom: 54px;
   }

   .top .hero h2 span {
      font-size: 32px;
   }

   .top .hero .sub-copy {
      margin-bottom: 64px;
   }

   .top .hero .small-copy {
      margin-bottom: 0;
   }

   .top .hero .btn_cta {
      margin: 0 auto;
   }

   .top .hero::after {
      width: 100%;
      background-position: center bottom;
   }

   .top .about {
      padding-bottom: 432px;
      z-index: 1;
      position: relative;
   }

   .top .about::before {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      aspect-ratio: 612 / 646;
      background-image:
         linear-gradient(to top, transparent 0%, #fff 100%),
         url('../img/img_about.png');
      background-size: cover;
      background-position: bottom;
      background-repeat: no-repeat;
      z-index: -1;
   }

   .top .about .innerWrap::after {
      content: none;
   }

   .top .about .innerWrap>div {
      width: 100%;
   }

   .top .service {
      background: none;
      margin-bottom: 80px;
   }

   .top .service .innerWrap>div {
      flex-direction: column;
      gap: 32px;
      padding-bottom: 0;
   }

   .top .service .service-block>p:first-child img {
      border-radius: 0;
   }

   .top .service .service-block {
      border-radius: 40px 0 40px 0;
      overflow: hidden;
      background: linear-gradient(to top, #D4AF37 0%, #FFFFFF 40%);
      padding-bottom: 20px;
   }

   .event .section-copy,
   .staff .section-copy,
   .consultant .section-copy,
   .awards .section-copy {
      text-align: left;
   }

   .top .event ul {
      flex-wrap: wrap;
      gap: 32px;
      margin-bottom: 24px;
   }

   .top .event ul li {
      width: calc((100% - 32px) / 2);
   }

   .top .event .innerWrap>p:last-child {
      font-size: 16px;
   }

   .top .insurance h3 {
      width: 100%;
      max-width: 378px;
      margin: 0 auto 16px;
   }

   .top .insurance .insurance-block {
      margin-bottom: 40px;
   }

   .top .insurance div.insurance-block:last-of-type {
      margin-bottom: 24px;
   }

   .top .insurance .innerWrap>p {
      font-size: 16px;
   }

   .top .insurance ul {
      flex-wrap: wrap;
      gap: 32px;
   }

   .top .insurance ul li {
      width: calc((100% - 32px) / 2);
   }

   .top .policy {
      padding-bottom: 480px;
      z-index: 1;
      position: relative;
      margin-bottom: 0;
   }

   .top .policy::before {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      aspect-ratio: 648 / 495;
      background-image: linear-gradient(to top, transparent 40%, #fff 100%),
         url('../img/img_policy.png');
      background-size: cover;
      background-position: bottom;
      background-repeat: no-repeat;
      z-index: -1;
   }

   .top .policy .innerWrap>div>div {
      width: 100%;
   }

   .top .policy .innerWrap>div::after {
      content: none;
   }

   .top .policy ul {
      padding-top: 16px;
   }

   .top .policy ul li p {
      line-height: 1.5;
   }

   .top .brand {
      padding-top: 80px;
      padding-bottom: 80px;
   }

   .top .brand ul {
      grid-template-columns: repeat(2, 1fr);
      gap: 24px 24px;
   }

   .top .staff ul {
      flex-direction: column;
   }

   .top .staff ul li {
      display: flex;
      gap: 24px;
      padding: 12px;
   }

   .top .staff ul li>p {
      width: 34%;
      flex-shrink: 0;
   }

   .top .staff h3 {
      margin-top: 12px;
      margin-bottom: 16px;
      align-items: flex-start;
      gap: 8px;
      font-size: 24px;
   }

   .top .staff .staff-comment {
      text-align: left;
      font-size: 16px;
   }

   .top .staff .staff-photo {
      margin-bottom: 0;
   }

   .top .message {
      padding-bottom: 410px;
      z-index: 1;
      position: relative;
   }

   .top .message::before {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      aspect-ratio: 500 / 652;
      background-image: linear-gradient(to top, transparent 30%, #fff 60%),
         url('../img/bg_message.png');
      background-size: cover;
      background-position: bottom;
      background-repeat: no-repeat;
      z-index: -1;
   }

   .top .message .innerWrap::before {
      content: none;
   }

   .top .message .innerWrap>div {
      width: 100%;
   }

   .top .consultant .flow-steps {
      margin-bottom: 24px;
      flex-wrap: wrap;
      gap: 24px;
   }

   .top .consultant .flow-steps li {
      width: calc((100% - 24px) / 2);
   }

   .top .consultant .flow-steps li:not(:last-child) {
      padding-right: 0;
      background-image: none;
   }

   .top .consultant .innerWrap>p:last-child {
      font-size: 16px;
   }

   .top .partner {
      padding-bottom: 230px;
      z-index: 1;
      position: relative;
      margin-bottom: 0;
   }

   .top .partner .innerWrap>div {
      width: 100%;
   }

   .top .partner .innerWrap::after {
      content: none;
   }

   .top .partner::before {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      aspect-ratio: 648 / 495;
      background-image: linear-gradient(to top, transparent 20%, #fff 80%),
         url('../img/img_partners.png');
      background-size: cover;
      background-position: bottom;
      background-repeat: no-repeat;
      z-index: -1;
   }

   .top .awards {
      padding-top: 80px;
      padding-bottom: 80px;
   }

   .top .awards ul {
      flex-direction: column;
      gap: 16px;
   }

   .top .awards ul>div {
      display: flex;
      gap: 16px;
      align-items: center;
   }

   .top .awards ul>div li {
      flex: 1;
   }

   .top .emergency h2.h2_common {
      font-size: 16px;
      margin-bottom: 40px;
      gap: 8px;
   }

   .top .emergency .contact-table {
      grid-template-columns: 1fr 1fr;
      font-size: 24px;
   }

   .top .emergency .contact-category {
      grid-column: 1 / 3;
      grid-row: auto;
      padding: 24px 15px;
      text-align: center;
      align-items: center;
   }

   .top .emergency .contact-category p {
      text-align: center;
   }

   .top .emergency .contact-category br.pc {
      display: none;
   }

   .top .emergency .contact-category span.sp {
      display: inline;
   }

   .top .emergency .company-name,
   .top .emergency .phone-number {
      padding: 24px 10px;
      text-align: center;
      justify-content: center;
      align-items: center;
   }

   .top .emergency .company-name {
      font-size: 24px;
      line-height: 1.3;
   }

   .top .emergency .phone-number {
      font-size: 24px;
   }

   .top .emergency .phone-number a {
      font-size: 32px;
      white-space: nowrap;
   }

   .top .emergency .category-sub,
   .top .emergency .phone-note {
      font-size: 16px;
      margin-top: 4px;
      text-align: center;
   }

   .top .emergency .company-name br.sp {
      display: block;
   }

   .top .emergency .innerWrap>p {
      font-size: 16px;
   }

   .top .cta3 .innerWrap>div>p:first-child {
      line-height: 1.5;
   }
}


/* ============================= レスポンシブ〜540px ============================= */
@media screen and (max-width:540px) {
   .ssp {
      display: revert;
   }

   h2.h2_common {
      font-size: 20px;
   }

   h2.h2_common span {
      font-size: 40px;
   }

   .section-copy {
      font-size: 20px;
   }

   .top .policy ul h3 {
      font-size: 20px;
   }

   .about .section-copy {
      font-size: 32px;
   }

   .about .section-copy span {
      font-size: 24px;
   }

   .btn_cta2 {
      height: 72px;
   }

   header .logo {
      width: 240px;
   }

   .top .hero h2 {
      font-size: 32px;
   }

   .top .hero h2 span {
      font-size: 24px;
   }

   .top .hero .sub-copy {
      font-size: 20px;
   }

   .top .cta .innerWrap>div {
      font-size: 24px;
   }

   .btn_cta2 a::after {
      width: 32px;
      height: 32px;
   }

   .top .event ul {
      gap: 16px;
   }

   .top .event ul li {
      width: calc((100% - 16px) / 2);
   }

   .top .insurance ul {
      gap: 16px;
   }

   .top .insurance ul li {
      width: calc((100% - 16px) / 2);
   }

   .top .consultant .flow-steps {
      gap: 12px;
   }

   .top .consultant .flow-steps li {
      width: calc((100% - 12px) / 2);
   }

   .top .brand ul {
      gap: 12px 12px;
   }

   .top .emergency .contact-table {
      font-size: 20px;
   }

   .top .emergency .category-sub,
   .top .emergency .phone-note {
      font-size: 12px;
   }

   .top .emergency .company-name {
      font-size: 20px;
   }

   .top .emergency .phone-number a {
      font-size: 24px;
   }

   .top .emergency h2.h2_common span {
      font-size: 32px;
   }


   .top .policy ul h3 {
      align-items: flex-start;
   }

   .top .policy ul h3::before {
      transform: translateY(5px);
   }

   .top .policy {
      padding-bottom: 320px;
   }
}


/* ============================= 高さ方向調整 ============================= */
@media screen and (max-width: 768px) and (max-height: 1100px) {
   header .innerWrap {
      height: 80px;
   }

   main {
      padding-top: 80px;
   }

   .top .hero .innerWrap {
      height: calc(100dvh - 80px);
      padding-top: 60px;
      padding-bottom: 80px;
   }

   .top .hero h2 {
      margin-bottom: 40px;
   }

   .top .hero .sub-copy {
      margin-bottom: 40px;
   }
}


/* ============================= ハンバーガーメニュー〜1280px ============================= */
@media screen and (max-width:1280px) {
   .ham {
      display: revert;
   }

   .header-contact {
      display: none;
   }

   .hamburger-menu {
      background: none;
      border: none;
      width: 30px;
      height: 20px;
      display: flex !important;
      flex-direction: column;
      justify-content: space-between;
      z-index: 1100;
      cursor: pointer;
   }

   .hamburger-menu .bar {
      width: 100%;
      height: 3px;
      background-color: var(--color-gold);
      transition: 0.3s;
      border-radius: 3px;
   }

   .header-menu-drawer {
      position: fixed;
      top: 0;
      right: -100%;
      width: 400px;
      height: 100vh;
      background: var(--grad-grey);
      padding: 100px 0 80px;
      flex-direction: column;
      align-items: flex-start;
      gap: 80px !important;
      transition: right 0.4s ease;
      z-index: 1050;
      overflow-y: auto;
   }

   @media (max-width: 768px) {
      .header-menu-drawer {
         width: 100%;
      }
   }

   .is-open .header-menu-drawer {
      right: 0;
   }

   .global-nav {
      padding: 0 15px;
   }

   .global-nav,
   .global-nav ul {
      width: 100%;
      flex-direction: column;
      gap: 0 !important;
   }

   .global-nav ul li {
      width: 100%;
      border-bottom: 3px dotted var(--color-white);
   }

   .global-nav ul li a {
      display: flex;
      align-items: center;
      padding: 20px 0 20px 16px;
      color: var(--color-white);
      font-size: 24px;
      font-weight: 600;
   }

   .global-nav ul li a::before {
      content: "";
      width: 0;
      height: 0;
      border-style: solid;
      border-width: 10px 0 10px 13px;
      border-color: transparent transparent transparent var(--color-white);
      margin-right: 15px;
      flex-shrink: 0;
   }

   .emergency-box {
      width: 100%;
      padding: 20px 15px 20px 31px;
      background-color: var(--color-white);
      color: var(--color-text);
      display: flex !important;
      align-items: center;
      font-weight: 600;
      font-size: 24px;
   }

   .emergency-box::before {
      content: "";
      width: 0;
      height: 0;
      border-style: solid;
      border-width: 10px 0 10px 13px;
      border-color: transparent transparent transparent var(--color-text);
      margin-right: 15px;
   }

   .header-menu-drawer .btn_cta {
      width: calc(100% - 30px);
      max-width: unset;
      margin: 0 auto;
   }

   .is-open .hamburger-menu .bar:nth-child(1) {
      transform: translateY(8.5px) rotate(45deg);
   }

   .is-open .hamburger-menu .bar:nth-child(2) {
      opacity: 0;
   }

   .is-open .hamburger-menu .bar:nth-child(3) {
      transform: translateY(-8.5px) rotate(-45deg);
   }

   .about-link {
      font-size: 0 !important;
   }

   .about-link::after {
      content: "ART OF LIFEについて";
      font-size: 24px;
   }

   @media screen and (max-height: 1100px) {
      .header-menu-drawer {
         padding: 60px 0 80px;
         gap: 32px !important;
      }

      .global-nav ul li a {
         padding: 10px 0 10px 16px;
         font-size: 20px;
      }

      .emergency-box {
         padding: 12px 15px 12px 31px;
         font-size: 20px;
      }

      .about-link::after {
         font-size: 20px;
      }
   }
}