/* 共通設定
-------------------------------------*/
@font-face{
  font-family:"Helvetica";
  src:url("../fonts/Helvetica.woff2") format("woff2"),url("../fonts/Helvetica.woff") format("woff");
  font-weight:normal;
  font-style:normal;
}
@font-face{
  font-family:"Helvetica";
  src:url("../fonts/Helvetica-bold.woff2") format("woff2"),url("../fonts/Helvetica-bold.woff") format("woff");
  font-weight:bold;
  font-style:normal;
}
*:focus{outline:none!important;box-shadow:none!important;}
html,body{margin:0;padding:0;width:100%;overflow-x:hidden;}
body{font-family:"Noto Sans JP","Helvetica",sans-serif;color:#171717;font-weight:500;background:#fff;}
img{max-width:100%;height:auto;vertical-align:bottom;}
.container-fluid{padding-left:0!important;padding-right:0!important;}
:root{
  --blue:#1f73aa;
  --deep-blue:#2f83bd;
  --yellow:#d7c646;
  --light:#e8f7fc;
  --line:#8f9da4;
}

/* Header */
.site-header{
  position:fixed;
  top:0;left:0;
  width:100%;
  padding:28px 5%;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  box-sizing:border-box;
  background:transparent;
  transition:.3s ease;
  z-index:9999;
}
.site-header.scroll{background:rgba(255,255,255,.96);padding:18px 5%;box-shadow:0 5px 18px rgba(0,0,0,.08);}
.site-header h1{margin:0;width:112px;line-height:1;}
.site-header h1 img{width:112px;transition:.3s ease;}
.site-header.scroll h1 img{width:88px;}
.site-header nav{padding-top:13px;}
.site-header nav a{margin-left:46px;color:#111;font-size:17px;font-weight:900;text-decoration:none;letter-spacing:.06em;transition:.2s;}
.site-header nav a:hover{color:var(--blue);}

/* MV */
.mv{position:relative;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);overflow:hidden;height:100vh;min-height:650px;}
.mv-img{width:100%;height:100%;object-fit:cover;display:block;filter:brightness(.94);}
.mv-copy{position:absolute;left:15%;top:43%;transform:translateY(-50%);color:#fff;font-weight:900;letter-spacing:.08em;text-shadow:0 3px 10px rgba(0,0,0,.32);z-index:3;}
.mv-copy p{font-size:35px;line-height:1.65;margin:0 0 14px;}
.mv-copy strong{font-size:38px;line-height:1;}

/* Plus */
.plus{position:absolute;display:block;color:currentColor;z-index:2;pointer-events:none;}
.plus::before,.plus::after{content:"";position:absolute;background:currentColor;}
.plus::before{width:180px;height:54px;left:0;top:63px;}
.plus::after{width:54px;height:180px;left:63px;top:0;}
.plus-yellow{color:rgba(215,198,70,.88);right:14%;top:115px;transform:scale(1.34);}
.plus-blue{color:rgba(31,115,170,.94);right:8%;top:275px;transform:scale(.9);}
.plus-gray{color:#8a8a8a;left:43%;bottom:330px;transform:scale(2.05);opacity:.55;z-index:1;}

/* Common */
.section{position:relative;padding:86px 0;}
.news,.about,.service,.contact{background:var(--light);}
.inner{width:min(1080px,90%);margin:0 auto;position:relative;z-index:2;}
h2{font-size:42px;line-height:1.2;letter-spacing:.1em;margin:0 0 38px;font-weight:900;}
h2 span{color:var(--yellow);margin-right:15px;}
.about h2 span,.products h2 span{color:var(--blue);}
h3{font-size:19px;line-height:1.9;margin:0 0 25px;font-weight:900;}
p{line-height:2.05;margin:0 0 12px;font-size:14px;font-weight:700;}

/* dots */
.dot-triangle{position:absolute;width:260px;height:220px;background-image:radial-gradient(#6e858d 1.2px, transparent 1.2px);background-size:10px 10px;clip-path:polygon(0 0,100% 50%,0 100%);opacity:.64;z-index:1;pointer-events:none;}
.news-dot{left:0;top:48px;}
.about-dot-left{left:0;top:-55px;}
.about-dot-right{right:72px;top:34px;transform:rotate(180deg);}
.service-dot-left{left:72px;top:40px;}

/* NEWS */
.news{padding-top:72px;padding-bottom:78px;}
.news-inner{display:grid;grid-template-columns:240px 1fr;gap:30px;align-items:start;}
.news-list{max-width:650px;margin-left:auto;width:100%;}
.news-list dl{display:flex;align-items:center;gap:28px;border:3px solid #9cafb7;border-radius:13px;padding:24px 34px;margin:0 0 20px;background:rgba(255,255,255,.14);}
.news-list dt{font-weight:900;font-size:14px;white-space:nowrap;}
.news-list dd{margin:0;font-size:15px;font-weight:800;}

/* ABOUT / SERVICE */
.about{padding-top:74px;padding-bottom:40px;overflow:hidden;}
.about::after{content:"";position:absolute;right:0;top:110px;width:0;height:0;border-style:solid;border-width:0 0 310px 420px;border-color:transparent transparent var(--deep-blue) transparent;z-index:0;}
.service{padding-top:70px;padding-bottom:90px;overflow:hidden;}
.service::before{content:"";position:absolute;left:0;bottom:0;width:0;height:0;border-style:solid;border-width:360px 0 0 500px;border-color:transparent transparent transparent var(--yellow);z-index:0;}
.two-col{display:grid;grid-template-columns:1fr 500px;gap:70px;align-items:center;}
.two-col.reverse{grid-template-columns:500px 1fr;}
.section-text{position:relative;z-index:3;}
.photo-cross-wrap{position:relative;width:560px;max-width:100%;height:360px;z-index:3;}
/*.photo-cross-wrap::after{content:"";position:absolute;right:18px;bottom:5px;width:410px;height:260px;border:4px solid var(--line);z-index:0;}*/
.photo-cross-wrap img{position:relative;z-index:2;width:100%;height:100%;object-fit:contain;}
.photo-about{justify-self:end;transform:translateX(22px);}
.photo-service{justify-self:start;transform:translateX(-15px);}
.photo-service::after{right:42px;bottom:2px;width:400px;height:260px;}

/* Products */
.products{background:#fff;padding-top:74px;padding-bottom:70px;overflow:hidden;}
.product-list{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;}
.product-card{border:3px solid #aaa;border-radius:18px;padding:18px;text-align:center;background:#fff;overflow:hidden;}
.product-card img{width:100%;aspect-ratio:1.1/1;object-fit:contain;}
.product-card p{margin:12px 0 0;font-weight:900;font-size:14px;}

/* Contact */
.contact{padding:74px 0 170px;overflow:hidden;}
.contact-boxes{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:stretch;}
.contact-box{background:#2f83bd;color:#fff;padding:26px 36px;min-height:86px;display:flex;align-items:center;justify-content:center;gap:35px;box-sizing:border-box;}
.contact-box p{margin:0;min-width:104px;font-size:14px;font-weight:900;line-height:1.65;letter-spacing:.04em;}
.contact-right{display:flex;flex-direction:column;align-items:flex-start;}
.contact-right strong{display:block;font-size:34px;font-weight:900;line-height:1.15;letter-spacing:.04em;white-space:nowrap;}
.contact-right small{display:block;margin-top:5px;font-size:11px;font-weight:800;line-height:1.4;}
.contact-box a{display:inline-block;background:#fff;color:#1f73a8;min-width:250px;padding:14px 28px;border-radius:8px;text-align:center;text-decoration:none;font-size:16px;font-weight:900;}
.contact-dot{right:70px;top:80px;transform:rotate(180deg);opacity:.48;}
.tri{position:absolute;display:block;z-index:0;}
.tri-yellow-contact{left:0;bottom:70px;width:0;height:0;border-style:solid;border-width:130px 0 0 260px;border-color:transparent transparent transparent var(--yellow);}
.tri-blue-contact{right:0;bottom:170px;width:0;height:0;border-style:solid;border-width:60px 0 60px 230px;border-color:transparent transparent transparent var(--deep-blue);}

/* Footer */
.footer{position:relative;background:var(--light);text-align:center;padding:0 20px 45px;margin-top:-125px;z-index:2;}
.footer img{width:135px;margin-bottom:24px;}
.footer p{font-size:13px;font-weight:700;line-height:1.8;margin-bottom:15px;}
.footer small{font-size:11px;font-weight:700;}

/* Responsive */
@media(max-width:991px){
  .site-header{background:#fff;padding:12px 18px;align-items:center;box-shadow:0 3px 12px rgba(0,0,0,.08);}
  .site-header h1,.site-header h1 img{width:70px;}
  .site-header nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px 16px;padding-top:0;}
  .site-header nav a{margin:0;color:#111;font-size:13px;letter-spacing:.04em;}
  .mv{height:520px;min-height:520px;margin-top:94px;}
  .mv-copy{left:7%;top:43%;width:86%;}
  .mv-copy p{font-size:25px;}
  .mv-copy strong{font-size:29px;}
  .plus-yellow{right:5%;top:70px;transform:scale(.86);}
  .plus-blue{right:-2%;top:190px;transform:scale(.62);}
  .plus-gray{left:46%;bottom:50px;transform:scale(1.25);}
  .news-inner,.two-col,.two-col.reverse{grid-template-columns:1fr;gap:36px;}
  .news-list{margin-left:0;max-width:none;}
  .photo-cross-wrap{width:100%;height:320px;}
  .photo-about,.photo-service{justify-self:center;transform:none;}
  .product-list{grid-template-columns:repeat(2,1fr);}
  .contact-boxes{grid-template-columns:1fr;gap:22px;}
  .contact-box{flex-direction:column;text-align:center;gap:14px;padding:32px 24px;}
  .contact-right{align-items:center;}
  .contact-box a{width:100%;min-width:0;}
}
@media(max-width:576px){
  .site-header{display:block;text-align:center;}
  .site-header h1{margin:0 auto 10px;}
  .site-header nav{justify-content:center;}
  .mv{height:500px;min-height:500px;margin-top:118px;}
  .mv-copy p{font-size:22px;}
  .mv-copy strong{font-size:26px;}
  .section{padding:58px 0;}
  h2{font-size:30px;margin-bottom:26px;}
  h3{font-size:17px;}
  p{font-size:13px;}
  .news-list dl{display:block;padding:22px 24px;}
  .news-list dt{margin-bottom:7px;}
  .photo-cross-wrap{height:265px;}
  .photo-cross-wrap::after{right:10px;bottom:10px;width:75%;height:70%;}
  .product-list{grid-template-columns:1fr 1fr;gap:16px;}
  .contact-right strong{font-size:28px;}
  .footer{margin-top:-80px;padding-bottom:35px;}
}

/* フェードイン */
.fadeUp{
    opacity:0;
    transform:translateY(50px);
    transition:
        opacity .8s ease,
        transform .8s ease;
}

.fadeUp.active{
    opacity:1;
    transform:translateY(0);
}

/* フェードイン 左右 */
.fadeLeft,
.fadeRight,
.fadeUp{
  opacity:0;
  transition:opacity 1.2s ease, transform 1.2s ease;
}

.fadeLeft{
  transform:translateX(-50px);
}

.fadeRight{
  transform:translateX(50px);
}

.fadeUp{
  transform:translateY(50px);
}

.fadeLeft.active,
.fadeRight.active,
.fadeUp.active{
  opacity:1;
  transform:translate(0,0);
}

/* ========================================
   下層ページ共通ヘッダー
======================================== */

/* 固定ヘッダー */
.subpage-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  padding: 22px 5%;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.07);
  z-index: 9999;
  box-sizing: border-box;
}

.site-header__inner {
  width: min(1200px, 100%);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* ロゴ */
.site-header__logo {
  width: 100px;
  margin: 0;
  line-height: 1;
}

.site-header__logo a {
  display: block;
}

.site-header__logo img {
  display: block;
  width: 100%;
  height: auto;
}

/* ナビゲーション */
.site-header__nav {
  padding: 0;
}

.site-header__nav .ham-menu {
  display: flex;
  align-items: center;
  gap: 42px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-header__nav .ham-menu-list {
  margin: 0;
  padding: 0;
}

.site-header__nav .ham-menu-list a {
  position: relative;
  display: block;
  padding: 10px 0;
  color: #171717;
  font-size: 15px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-decoration: none;
  transition: color 0.25s ease;
}

.site-header__nav .ham-menu-list a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 2px;
  width: 0;
  height: 2px;
  background: var(--blue);
  transition: width 0.25s ease;
}

.site-header__nav .ham-menu-list a:hover,
.site-header__nav .ham-menu-list a.is-current {
  color: var(--blue);
}

.site-header__nav .ham-menu-list a:hover::after,
.site-header__nav .ham-menu-list a.is-current::after {
  width: 100%;
}

/* ========================================
   下層ページ メインビジュアル
======================================== */

.page-hero {
  position: relative;
  min-height: 430px;
  margin-top: 144px;
  display: flex;
  align-items: center;
  background:
    linear-gradient(
      115deg,
      rgba(232, 247, 252, 1) 0%,
      rgba(232, 247, 252, 0.96) 55%,
      rgba(218, 241, 249, 1) 100%
    );
  overflow: hidden;
}

/* 右側の淡い三角形 */
.page-hero::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 260px 420px;
  border-color: transparent transparent rgba(47, 131, 189, 0.12)
    transparent;
}

/* 黄色のアクセント */
.page-hero::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 110px;
  height: 7px;
  background: var(--yellow);
}

.page-hero__inner {
  position: relative;
  z-index: 3;
  width: min(1080px, 90%);
  margin: 0 auto;
}

/* 英語タイトル */
.page-hero__en {
  margin: 0 0 12px;
  color: var(--blue);
  font-family: "Helvetica", "Noto Sans JP", sans-serif;
  font-size: clamp(42px, 6vw, 72px);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.14em;
}

/* 日本語タイトル */
.page-hero__title {
  margin: 0;
  color: #171717;
  font-size: clamp(20px, 2.2vw, 28px);
  font-weight: 900;
  line-height: 1.5;
  letter-spacing: 0.15em;
}

/* タイトル下の線 */
.page-hero__line {
  display: block;
  width: 72px;
  height: 4px;
  margin-top: 26px;
  background: var(--yellow);
}

/* ドット装飾 */
.page-hero__dots {
  position: absolute;
  left: 5%;
  top: 55px;
  width: 220px;
  height: 180px;
  background-image: radial-gradient(
    rgba(31, 115, 170, 0.35) 1.3px,
    transparent 1.3px
  );
  background-size: 11px 11px;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  opacity: 0.65;
}

/* プラス装飾 */
.page-hero__plus {
  position: absolute;
  display: block;
  width: 150px;
  height: 150px;
  pointer-events: none;
}

.page-hero__plus::before,
.page-hero__plus::after {
  content: "";
  position: absolute;
  background: currentColor;
}

.page-hero__plus::before {
  top: 53px;
  left: 0;
  width: 150px;
  height: 44px;
}

.page-hero__plus::after {
  top: 0;
  left: 53px;
  width: 44px;
  height: 150px;
}

.page-hero__plus--yellow {
  right: 13%;
  top: 70px;
  color: rgba(215, 198, 70, 0.85);
  transform: scale(0.85);
}

.page-hero__plus--blue {
  right: 6%;
  bottom: 42px;
  color: rgba(31, 115, 170, 0.9);
  transform: scale(0.58);
}

/* ========================================
   パンくず
======================================== */

.breadcrumb {
  background: #fff;
  border-bottom: 1px solid #e5eaed;
}

.breadcrumb__inner {
  width: min(1080px, 90%);
  margin: 0 auto;
  padding: 16px 0;
  color: #777;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.breadcrumb__inner a {
  color: var(--blue);
  text-decoration: none;
}

.breadcrumb__inner span::before {
  content: "/";
  display: inline-block;
  margin: 0 13px;
  color: #aeb7bc;
}

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

  .subpage-header {
    padding: 12px 20px;
  }

  .site-header__inner {
    min-height: 70px;
  }

  .site-header__logo {
    width: 72px;
  }

  /*
   * 既存のcommon.jsとハンバーガーメニューのCSSを
   * そのまま利用するため、toggleは残しています。
   */
  .toggle {
    position: relative;
    z-index: 10001;
  }

  .site-header__nav .ham-menu {
    gap: 18px;
  }

  .site-header__nav .ham-menu-list a {
    font-size: 13px;
  }

  .page-hero {
    min-height: 330px;
    margin-top: 94px;
  }

  .page-hero__dots {
    left: -40px;
    top: 35px;
    transform: scale(0.8);
  }

  .page-hero__plus--yellow {
    right: 4%;
    top: 40px;
    transform: scale(0.65);
  }

  .page-hero__plus--blue {
    right: -2%;
    bottom: 20px;
    transform: scale(0.42);
  }
}

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

  .subpage-header {
    padding: 10px 16px;
  }

  .site-header__inner {
    min-height: 64px;
  }

  .site-header__logo {
    width: 65px;
  }

  .page-hero {
    min-height: 280px;
    margin-top: 84px;
  }

  .page-hero__inner {
    width: calc(100% - 40px);
  }

  .page-hero__en {
    font-size: 38px;
    letter-spacing: 0.08em;
  }

  .page-hero__title {
    font-size: 19px;
  }

  .page-hero__line {
    width: 55px;
    height: 3px;
    margin-top: 20px;
  }

  .page-hero__plus--yellow {
    right: -20px;
    top: 30px;
    transform: scale(0.48);
  }

  .page-hero__plus--blue {
    right: -38px;
    bottom: 5px;
    transform: scale(0.32);
  }

  .breadcrumb__inner {
    width: calc(100% - 40px);
    padding: 13px 0;
  }
}

/* ========================================
   Contactフォーム調整
======================================== */

#main_contact {
  max-width: 900px;
  margin: 0 auto;
  padding: 55px 60px;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 12px 40px rgba(31, 115, 170, 0.08);
}

#main_contact .form-group {
  margin-bottom: 24px;
}

#main_contact label {
  display: inline-block;
  margin-bottom: 8px;
  color: #171717;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

#main_contact .form-control {
  min-height: 52px;
  padding: 12px 16px;
  border: 1px solid #d8e1e6;
  border-radius: 8px;
  background: #fff;
  font-size: 14px;
  transition:
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

#main_contact textarea.form-control {
  min-height: 180px;
  resize: vertical;
}

#main_contact .form-control:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 4px rgba(31, 115, 170, 0.1) !important;
}

#main_contact .badge-danger {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  height: 21px;
  margin-left: 8px !important;
  padding: 0 7px;
  border-radius: 4px;
  background: #df4050;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  vertical-align: middle;
  letter-spacing: 0.05em;
}

#main_contact p.error,
#main_contact span.error {
  color: #d93646;
  font-size: 12px;
  font-weight: 700;
}

#main_contact .form-group.error .form-control {
  border-color: #d93646;
  background: #fffafa;
}
#main_contact .privacy {
  max-height: 430px;
  padding: 32px 36px;
  border: 1px solid #dce5e9;
  border-radius: 12px;
  background: #f8fbfc;
}

#main_contact .privacy .lead {
  margin-bottom: 24px;
  color: var(--blue);
  font-size: 18px;
  font-weight: 900;
}

#main_contact .privacy h6 {
  margin: 24px 0 8px;
  color: #171717;
  font-size: 14px;
  font-weight: 900;
}

#main_contact .privacy p,
#main_contact .privacy li {
  font-size: 13px;
  line-height: 1.9;
}

#main_contact .privacy ul {
  padding-left: 22px;
}#main_contact .btn.form {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 360px;
  min-height: 72px;
  padding: 18px 65px 18px 35px;
  border: none;
  border-radius: 8px;
  background: var(--blue);
  color: #fff;
  font-size: 15px;
  font-weight: 900;
  line-height: 1.6;
  letter-spacing: 0.06em;
  box-shadow: 0 8px 24px rgba(31, 115, 170, 0.22);
  transition:
    background 0.25s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

#main_contact .btn.form::after {
  content: "→";
  position: absolute;
  right: 28px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 21px;
  transition: right 0.25s ease;
}

#main_contact .btn.form:hover {
  background: #195f8d;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(31, 115, 170, 0.28);
}

#main_contact .btn.form:hover::after {
  right: 22px;
}.form-agreement {
  margin-top: 14px;
  color: #68757c;
  font-size: 12px;
  font-weight: 500;
}footer {
  position: relative;
  margin-top: 100px;
  padding: 70px 0 40px;
  background: var(--light);
  overflow: hidden;
}

footer::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 130px;
  height: 6px;
  background: var(--yellow);
}

footer .container {
  position: relative;
  z-index: 2;
}

footer .row.top.end {
  align-items: flex-end;
}

footer p {
  margin-bottom: 0;
  color: #37434a;
  font-size: 12px;
  line-height: 1.9;
}

footer .footer-logo {
  width: 130px;
  max-width: 100%;
}

footer .copyright {
  margin-top: 32px !important;
  color: #7b858a;
  font-size: 11px;
}@media screen and (max-width: 767px) {

  #main_contact {
    padding: 35px 22px;
    border-radius: 12px;
  }

  #main_contact .form-group {
    margin-bottom: 20px;
  }

  #main_contact .form-control {
    min-height: 48px;
    font-size: 16px;
  }

  #main_contact .privacy {
    max-height: 380px;
    padding: 24px 20px;
  }

  #main_contact .btn.form {
    width: 100%;
    min-width: 0;
    min-height: 66px;
    padding: 16px 55px 16px 20px;
  }

  footer {
    margin-top: 70px;
    padding: 55px 0 30px;
    text-align: center;
  }

  footer .footer-logo {
    width: 105px;
    margin-top: 40px;
  }
}

/* =====================================
   お問い合わせ 確認・完了画面
===================================== */

/* 下層ページ共通タイトル */
.subpage-visual {
  position: relative;
  min-height: 360px;
  padding: 170px 5% 90px;
  background: var(--light);
  overflow: hidden;
  box-sizing: border-box;
}

.subpage-visual::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 150px 0 0 300px;
  border-color: transparent transparent transparent rgba(31, 115, 170, .08);
}

.subpage-visual::after {
  content: "";
  position: absolute;
  right: 8%;
  top: 70px;
  width: 230px;
  height: 190px;
  background-image: radial-gradient(
    rgba(110, 133, 141, .55) 1.2px,
    transparent 1.2px
  );
  background-size: 10px 10px;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}

.subpage-visual__inner {
  position: relative;
  z-index: 3;
  width: min(1080px, 90%);
  margin: 0 auto;
}

.subpage-visual__en {
  margin: 0 0 10px;
  color: var(--blue);
  font-size: 15px;
  font-weight: 900;
  letter-spacing: .24em;
  line-height: 1.4;
}

.subpage-visual h2 {
  margin: 0;
  font-size: clamp(38px, 5vw, 64px);
  font-weight: 900;
  letter-spacing: .08em;
  line-height: 1.3;
}

/* プラスモチーフ */
.subpage-visual__plus {
  position: absolute;
  display: block;
  width: 105px;
  height: 105px;
  z-index: 2;
  pointer-events: none;
}

.subpage-visual__plus::before,
.subpage-visual__plus::after {
  content: "";
  position: absolute;
  background: currentColor;
}

.subpage-visual__plus::before {
  top: 37px;
  left: 0;
  width: 105px;
  height: 31px;
}

.subpage-visual__plus::after {
  top: 0;
  left: 37px;
  width: 31px;
  height: 105px;
}

.subpage-visual__plus--yellow {
  top: 55px;
  right: 13%;
  color: rgba(215, 198, 70, .88);
}

.subpage-visual__plus--blue {
  right: 7%;
  bottom: 28px;
  color: rgba(31, 115, 170, .92);
  transform: scale(.72);
}

/* 確認画面 */
.confirm-section,
.complete-section {
  position: relative;
  padding: 90px 0 150px;
  background: #fff;
}

.confirm-section__inner,
.complete-section__inner {
  width: min(960px, 90%);
  margin: 0 auto;
}

.confirm-lead {
  margin-bottom: 45px;
  text-align: center;
}

.confirm-lead__number,
.complete-card__number {
  margin-bottom: 12px;
  color: var(--blue);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .2em;
}

.confirm-lead h3,
.complete-card h3 {
  margin-bottom: 18px;
  font-size: 26px;
  font-weight: 900;
  letter-spacing: .06em;
  line-height: 1.6;
}

.confirm-lead p {
  font-size: 14px;
  line-height: 2;
}

/* 確認内容カード */
.confirm-card {
  padding: 18px 45px;
  border: 3px solid #9cafb7;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 35px rgba(31, 115, 170, .08);
}

.confirm-table {
  width: 100%;
  border-collapse: collapse;
}

.confirm-table th,
.confirm-table td {
  padding: 24px 16px;
  border-bottom: 1px solid #dce4e8;
  font-size: 14px;
  line-height: 1.9;
  vertical-align: top;
}

.confirm-table tr:last-child th,
.confirm-table tr:last-child td {
  border-bottom: 0;
}

.confirm-table th {
  width: 220px;
  color: var(--blue);
  font-weight: 900;
  text-align: left;
  letter-spacing: .04em;
}

.confirm-table td {
  color: #222;
  font-weight: 700;
  overflow-wrap: anywhere;
}

/* ボタン */
.confirm-actions {
  display: flex;
  justify-content: center;
  gap: 24px;
  margin-top: 50px;
}

.confirm-actions__form {
  width: 280px;
  margin: 0;
}

.form-result-btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 66px;
  padding: 15px 42px;
  border: 3px solid var(--blue);
  border-radius: 8px;
  box-sizing: border-box;
  font-family: inherit;
  font-size: 15px;
  font-weight: 900;
  letter-spacing: .08em;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition:
    color .3s ease,
    background .3s ease,
    transform .3s ease,
    box-shadow .3s ease;
}

.form-result-btn::after {
  content: "";
  position: absolute;
  right: 23px;
  width: 8px;
  height: 8px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
}

.form-result-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(31, 115, 170, .2);
  text-decoration: none;
}

.form-result-btn--send,
.form-result-btn--top {
  background: var(--blue);
  color: #fff;
}

.form-result-btn--send:hover,
.form-result-btn--top:hover {
  background: var(--deep-blue);
  color: #fff;
}

.form-result-btn--back {
  background: #fff;
  color: var(--blue);
}

.form-result-btn--back::after {
  right: auto;
  left: 23px;
  transform: rotate(-135deg);
}

.form-result-btn--back:hover {
  background: var(--light);
  color: var(--blue);
}

/* 完了画面 */
.complete-section {
  background:
    linear-gradient(
      135deg,
      rgba(232, 247, 252, .72),
      rgba(255, 255, 255, 1)
    );
}

.complete-card {
  position: relative;
  max-width: 790px;
  margin: 0 auto;
  padding: 70px 70px 65px;
  border: 3px solid #9cafb7;
  border-radius: 20px;
  background: #fff;
  text-align: center;
  box-shadow: 0 18px 45px rgba(31, 115, 170, .1);
  overflow: hidden;
}

.complete-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 8px;
  background: linear-gradient(
    90deg,
    var(--blue) 0 68%,
    var(--yellow) 68% 100%
  );
}

.complete-icon {
  position: relative;
  width: 82px;
  height: 82px;
  margin: 0 auto 28px;
  border-radius: 50%;
  background: var(--blue);
}

.complete-icon span::before {
  content: "";
  position: absolute;
  top: 24px;
  left: 29px;
  width: 20px;
  height: 33px;
  border-right: 6px solid #fff;
  border-bottom: 6px solid #fff;
  transform: rotate(45deg);
}

.complete-card__en {
  margin-bottom: 12px;
  color: var(--yellow);
  font-size: 15px;
  font-weight: 900;
  letter-spacing: .25em;
}

.complete-card__text {
  margin-bottom: 20px;
  font-size: 15px;
  line-height: 2.1;
}

.complete-card__note {
  margin-bottom: 32px;
  padding: 18px 20px;
  border-radius: 8px;
  background: var(--light);
  font-size: 13px;
  line-height: 1.9;
}

.complete-company {
  margin-bottom: 38px;
  padding-top: 30px;
  border-top: 1px solid #dce4e8;
}

.complete-company__name {
  margin-bottom: 12px;
  color: var(--blue);
  font-size: 18px;
  font-weight: 900;
  letter-spacing: .08em;
}

.complete-company p {
  margin-bottom: 4px;
  font-size: 13px;
  line-height: 1.8;
}

.complete-card .form-result-btn {
  max-width: 310px;
  margin: 0 auto;
}

.complete-card--error {
  border-color: #c7c7c7;
}

.complete-card--error .complete-card__en {
  color: #b94343;
}

/* スマートフォン */
@media screen and (max-width: 767px) {

  .subpage-visual {
    min-height: 270px;
    padding: 135px 5% 60px;
  }

  .subpage-visual__inner {
    width: 90%;
  }

  .subpage-visual__en {
    font-size: 12px;
  }

  .subpage-visual h2 {
    font-size: 34px;
  }

  .subpage-visual__plus--yellow {
    top: 42px;
    right: -15px;
    transform: scale(.62);
  }

  .subpage-visual__plus--blue {
    right: -30px;
    bottom: 5px;
    transform: scale(.46);
  }

  .subpage-visual::after {
    right: -80px;
    top: 70px;
    opacity: .55;
  }

  .confirm-section,
  .complete-section {
    padding: 60px 0 90px;
  }

  .confirm-lead {
    text-align: left;
  }

  .confirm-lead h3,
  .complete-card h3 {
    font-size: 21px;
  }

  .confirm-lead p br,
  .complete-card__text br,
  .complete-card__note br {
    display: none;
  }

  .confirm-card {
    padding: 5px 20px;
    border-width: 2px;
    border-radius: 12px;
  }

  .confirm-table tr {
    display: block;
    padding: 18px 0;
    border-bottom: 1px solid #dce4e8;
  }

  .confirm-table tr:last-child {
    border-bottom: 0;
  }

  .confirm-table th,
  .confirm-table td {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
  }

  .confirm-table th {
    margin-bottom: 8px;
    font-size: 13px;
  }

  .confirm-table td {
    font-size: 13px;
  }

  .confirm-actions {
    flex-direction: column-reverse;
    gap: 15px;
    margin-top: 35px;
  }

  .confirm-actions__form {
    width: 100%;
  }

  .form-result-btn {
    min-height: 60px;
    font-size: 14px;
  }

  .complete-card {
    padding: 55px 24px 45px;
    border-width: 2px;
    border-radius: 14px;
  }

  .complete-icon {
    width: 68px;
    height: 68px;
  }

  .complete-icon span::before {
    top: 19px;
    left: 24px;
    width: 17px;
    height: 28px;
  }

  .complete-card__text {
    font-size: 14px;
    text-align: left;
  }

  .complete-card__note {
    text-align: left;
  }
}

/* =====================================
   スマートフォン表示の装飾調整
===================================== */
@media screen and (max-width: 576px) {

  /* -----------------------------
     NEWS
  ----------------------------- */

  /* カードに重なるドット装飾を非表示 */
  .news-dot {
    display: none;
  }

  .news {
    padding-top: 55px;
    padding-bottom: 60px;
  }

  .news-list {
    position: relative;
    z-index: 2;
  }


  /* -----------------------------
     ABOUT
  ----------------------------- */

  /* 左右のドット装飾を非表示 */
  .about-dot-left,
  .about-dot-right {
    display: none;
  }

  /* 青い三角形を小さく、薄くする */
  .about::after {
    top: auto;
    right: 0;
    bottom: 0;
    border-width: 0 0 130px 180px;
    opacity: .28;
  }

  .about .inner {
    position: relative;
    z-index: 2;
  }

  /* 写真の左右に余白をつける */
  .about .photo-cross-wrap {
    width: calc(100% - 24px);
    margin-right: auto;
    margin-left: auto;
  }


  /* -----------------------------
     SERVICE
  ----------------------------- */

  /* ドット装飾を非表示 */
  .service-dot-left {
    display: none;
  }

  /* 黄色い三角形を小さく、薄くする */
  .service::before {
    border-width: 150px 0 0 210px;
    opacity: .3;
  }

  .service .inner {
    position: relative;
    z-index: 2;
  }

  .service .photo-cross-wrap {
    width: calc(100% - 24px);
    margin-right: auto;
    margin-left: auto;
  }


  /* -----------------------------
     CONTACT
  ----------------------------- */

  /* お問い合わせ欄に重なる青い三角形を非表示 */
  .tri-blue-contact {
    display: none;
  }

  /* ドット装飾を非表示 */
  .contact-dot {
    display: none;
  }

  /* 黄色い三角形だけ小さく残す */
  .tri-yellow-contact {
    left: 0;
    bottom: 0;
    border-width: 70px 0 0 135px;
    opacity: .55;
  }

  .contact {
    padding-top: 58px;
    padding-bottom: 125px;
  }

  .contact .inner,
  .contact-boxes {
    position: relative;
    z-index: 2;
  }

  .contact-box {
    position: relative;
    z-index: 3;
  }


  /* -----------------------------
     共通装飾
  ----------------------------- */

  /* スマホでは装飾全体を控えめにする */
  .dot-triangle {
    opacity: .18;
  }

  .plus-yellow {
    right: -20px;
    transform: scale(.5);
    opacity: .7;
  }

  .plus-blue {
    right: -25px;
    transform: scale(.4);
    opacity: .75;
  }
}