.solutions-page--summary{
  --bg:#FFFFFF;
  --bg-soft:#F8F8F8;
  --ink:#1f2a37;
  --ink-sub:#4b5563;
  --brand:#123c7a;
  --brand-deep:#0f2d5f;
  --line:#d7e0ea;
  --line-strong:#c4d1df;
  --card:#ffffff;
  --radius:12px;
  --sec-h2-gap:20px;
  --sec-h2-gap-alt:40px;
}

.solutions-page *{
  all:revert;
  box-sizing:border-box;
}
html{scroll-behavior:smooth;}
.solutions-page--summary{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:"BIZ UDPGothic","Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",Meiryo,sans-serif;
  font-size:15px;
  line-height:1.8;
}

.solutions-page--summary h1,
.solutions-page--summary h2,
.solutions-page--summary h3,
.solutions-page--summary h4,
.solutions-page--summary h5,
.solutions-page--summary h6,
.solutions-page--summary .heading-font{
  font-family:"Noto Serif JP",serif;
}

.page{
  width:100%;
  margin:0;
  background:var(--bg);
  overflow:hidden;
  opacity:1;
  transition:opacity 1.4s ease;
}
.wrap{
  max-width:1160px;
  margin:0 auto;
  padding:0 36px;
}
.page > .wrap{
  max-width:1400px;
}
.demo{color:#768294;}

.img{
  background:
    linear-gradient(45deg,transparent 49.3%,#bfd0e2 49.6%,#bfd0e2 50.4%,transparent 50.7%),
    linear-gradient(-45deg,transparent 49.3%,#bfd0e2 49.6%,#bfd0e2 50.4%,transparent 50.7%),
    #eef3f8;
  border:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#7b8798;
  font-size:12px;
  text-align:center;
  border-radius:10px;
}
.img span{background:#eef3f8;padding:2px 8px;border-radius:4px;}
.img-img{padding:0;background:#fff;}
.img-img img{width:100%;height:100%;display:block;object-fit:contain;}

.cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--brand);
  color:#fff;
  font-weight:700;
  font-size:14px;
  padding:12px 24px;
  border-radius:999px;
  text-decoration:none;
  border:none;
  transition:background-color .2s ease;
}
.cta:hover{background:var(--brand-deep);}
.cta.ghost{background:transparent;color:var(--brand);border:1px solid var(--brand);}
.cta.sm{padding:9px 18px;font-size:13px;}

.sec{
  padding:80px 0;
}
.wrap > .sec:first-child{
  border-top:none;
}
.sec-gray{
  position:relative;
  isolation:isolate;
}
.sec-gray::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:0;
  bottom:0;
  left:calc(50% - 50vw);
  right:calc(50% - 50vw);
  background:var(--bg-soft);
}
.sec-trust::before{
  background:var(--bg-soft);
}
.sec-trust::after{
  content:"";
  position:absolute;
  z-index:-1;
  top:0;
  bottom:0;
  left:calc(50% - 50vw);
  right:calc(50% - 50vw);
  background:url("../../img/solutions/summary/img/summary_background.png") center/cover no-repeat;
  opacity:.35;
  pointer-events:none;
}
.eyebrow{
  display:flex;
  align-items:center;
  gap:16px;
  margin:0 0 10px;
  font-family:"Noto Serif JP",serif;
  font-size:18px;
  letter-spacing:.14em;
  color:rgba(0, 72, 150, 1);
  font-weight:700;
}
.eyebrow::after{
  content:"";
  flex:1;
  height:2px;
  background:linear-gradient(to right, rgba(0, 72, 150, 1) 0%, rgba(0, 72, 150, 0) 100%);
}
.sec h2{
  font-size:38px;
  line-height:1.3;
  letter-spacing:.01em;
  margin:0 0 var(--sec-h2-gap);
}
.sec h2.h2-gap{
  margin-bottom:var(--sec-h2-gap-alt);
}
.sec .sub{
  margin:0 0 40px;
  max-width:1000px;
  font-size:18px;
  color:var(--ink-sub);
  letter-spacing:1px;
}
.foot{font-size:13px;color:#9298a1;margin-top:14px;}

/* FV */
.fv{
  position:relative;
  height:90vh;
  max-height:800px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:80px 0 48px;
  overflow:hidden;
  text-align:left;
  /* margin-top: 60px; */
}
.fv-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
  z-index:0;
}
.fv-overlay{
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgb(247 250 255 / 40%) 0%, rgb(243 247 252 / 60%) 100%);
  z-index:1;
}
.fv .wrap{
  position:relative;
  z-index:2;
  width:100%;
  max-width:1400px;
  margin:0 auto;
  padding-top:18px;
}
.p-header{
  transition:opacity .95s cubic-bezier(.22,1,.36,1),transform .95s cubic-bezier(.22,1,.36,1);
  will-change:opacity,transform;
}
body.fv-sequence-active .p-header{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-18px);
}
.fv-copy{
  opacity:1;
  transform:translateY(0);
  transition:opacity .75s ease,transform .75s ease;
}
.solutions-page--summary.fv-sequence-active .fv-copy{
  opacity:0;
  transform:translateY(16px);
}
.solutions-page--summary.fv-sequence-active .fv-copy.is-visible,
.solutions-page--summary.fv-sequence-complete .fv-copy{
  opacity:1;
  transform:translateY(0);
}
.fv-line{
  display:inline-block;
  opacity:0;
  transform:translateX(-20px);
  clip-path:inset(0 100% 0 0);
  transition:opacity .95s ease,transform .95s cubic-bezier(.22,1,.36,1),clip-path 1.15s cubic-bezier(.22,1,.36,1);
}
.fv-copy.is-visible .fv-line{
  opacity:1;
  transform:translateX(0);
  clip-path:inset(0 0 0 0);
}
.fv-copy-main.is-visible .fv-line:nth-of-type(2){
  transition-delay:.4s;
}
.fv-copy-sub.is-visible .fv-line:nth-of-type(2){
  transition-delay:.34s;
}
.lab{
  font-size:11px;
  letter-spacing:.12em;
  color:var(--brand);
  border:1px solid #c8d8eb;
  border-radius:999px;
  padding:3px 11px;
  display:inline-block;
  margin-bottom:12px;
  font-weight:700;
}
.fv h1{
  font-size:60px;
  line-height:1.38;
  margin:0 0 24px;
  letter-spacing:.01em;
}
.fv .lead{
  max-width:1100px;
  margin:0 0 12px;
  font-size:18px;
  color:var(--ink-sub);
  letter-spacing:2px;
  text-shadow: 0 0 4px rgba(128, 128, 128, 0.216);
}
.fv .base{
  width:100%;
  margin:28px 0 0;
  padding:12px 24px;
  font-size:16px;
  font-weight: 600;
  line-height:1.75;
  color:#004887;
  background:rgba(248,251,255,.94);
  backdrop-filter:blur(3px);
  border:1.6px dotted rgba(0, 72, 150, 0.644);
  border-radius:10px;
  letter-spacing:.2px;
  box-shadow:0 2px 10px rgba(0,72,150,.06);
}
.fv-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}

/* 3サービスカード */
.svc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;}
.card{
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:24px;
  display:flex;
  flex-direction:column;
  background:var(--card);
  box-shadow:0 8px 24px rgba(26,51,89,.06);
}
.card .img{height:92px;margin-bottom:16px;}
.card .chip{align-self:flex-start;font-size:10.5px;border:1px solid var(--line-strong);color:#4f5f73;border-radius:20px;padding:1px 9px;margin-bottom:8px;}
.svc .card h3{
  font-size:22px;
  line-height:1.35;
  margin:0 0 16px;
  padding-bottom:10px;
  border-bottom:1px dashed #004896;
  letter-spacing:.01em;
  text-align:center;
  color:#004896;
}
.svc .card .tag{
  align-self:center;
  display:inline-block;
  font-size:14px;
  text-align:center;
  color:#FFFFFF;
  background:#004896;
  border:1px solid #004896;
  border-radius:20px;
  padding:2px 20px;
  margin:0 0 12px;
  letter-spacing: 4px;
}
.card .one{font-size:16px;margin:0 0 14px;line-height:1.75;color:var(--ink-sub);}
.card ul{margin:0 0 16px;padding-left:18px;font-size:14px;line-height:1.75;color:#224577;letter-spacing:1px;}
.card li{margin:4px 0;}
.svc .card .more{
  align-self:center;
  margin-top:auto;
  width: 100%;
  padding:12px 18px 9px;
  color:#FFFFFF;
  background:#004896;
  border:1px solid #004896;
  border-top:1px solid #004896;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease;
  box-shadow: 0 8px 24px rgba(26, 51, 89, 0.221);
}
.svc .card .more:hover{
  background:#FFFFFF;
  color:#004896;
  border-color:#004896;
}
.svc .card .more.is-disabled,
.svc .card .more.is-disabled:hover{
  background:#b8c0cc;
  color:#ffffff;
  border-color:#b8c0cc;
  cursor:default;
  box-shadow:none;
}
.svc .card .more::after{
  content:none;
}
.card .more{
  margin-top:auto;
  font-size:14px;
  font-weight:700;
  color:var(--brand);
  text-decoration:none;
  border-top:1px solid var(--line);
  padding-top:14px;
}
.card .more::after{content:" >";}

/* 比較表 */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}
table.cmp{
  width:100%;
  table-layout:fixed;
  border-collapse:collapse;
  font-size:14px;
  letter-spacing:2px;
  min-width:760px;
  border:1px solid var(--line);
}
table.cmp col.cmp-item{width:160px;}
table.cmp col.cmp-svc{width:auto;}
table.cmp th,table.cmp td{
  border:1px solid var(--line);
  padding:12px 14px;
  text-align:left;
  vertical-align:top;
  line-height:1.7;
}
table.cmp thead th{
  background:#004896;
  color:#ffffff;
  font-size:16px;
  letter-spacing: 1px;
}
table.cmp tbody th{
  background:#f8fbff;
  white-space:nowrap;
  font-weight:700;
  color:#37475c;
}
table.cmp td a:not(.cmp-cta){color:var(--brand);font-weight:700;text-decoration:underline;}
table.cmp td.cmp-cta-cell{
  text-align:center;
  vertical-align:middle;
}
table.cmp .cmp-cta{
  display:inline-flex;
  width:100%;
  max-width:100%;
  padding:10px 12px;
  color:#FFFFFF;
  background:#004896;
  border:1px solid #004896;
  border-radius:999px;
  font-size:13px;
  font-weight:700;
  line-height:1.4;
  letter-spacing:0;
  text-decoration:none;
  text-align:center;
  white-space:normal;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease;
  box-shadow:0 8px 24px rgba(26, 51, 89, 0.099);
}
table.cmp a.cmp-cta:hover{
  background:#FFFFFF;
  color:#004896;
  border-color:#004896;
}
table.cmp .cmp-cta.is-disabled,
table.cmp .cmp-cta.is-disabled:hover{
  background:#b8c0cc;
  color:#ffffff;
  border-color:#b8c0cc;
  cursor:default;
  box-shadow:none;
}

.concept{display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:center;}
.concept .img{height:212px;}
.triplet{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:10px;}
.triplet .t{
  /* border:1px solid var(--line); */
  border-radius:10px;
  padding:14px;
  text-align:center;
  background:#f7fbff;
}
.triplet .t .img{height:80px;width:80px;margin:0 auto 8px;}
.triplet .t .img.img-img{height:80px;width:80px;margin:0 auto 10px;background:transparent;border:none;}
.triplet .t h4{margin:0 0 4px;font-size:20px;color:#25364c;}
.triplet .t p{margin:0;font-size:14px;line-height:1.55;color:#516075;}

.trust{
  border:1px solid var(--line);
  background:rgba(255,255,255,.82);
  border-radius:var(--radius);
  padding:28px;
  position:relative;
  overflow:hidden;
  margin-top:40px;
  margin-bottom:20px;
}
.trust h3{margin:0 0 10px;font-size:26px;line-height:1.3;}
.trust p{margin:0 0 10px;color:#3e4f63;}
.trust .meta{font-size:13px;color:#657488;}
.trust-note{margin-top:10px;font-size:13px;color:#607084;line-height:1.7;}

.concept-hero{height:260px;}
.concept-hero.img-img{
  border:none;
  border-radius:0;
  background:transparent;
}
.concept-hero.img-img img{object-fit:cover;}
.svc .card .img.img-img{
  width:200px;
  height:200px;
  margin:0 auto 16px;
  border:none;
  border-radius:0;
  background:transparent;
}

.band{background:var(--brand-deep);padding:40px 26px;text-align:center;}
.band h3{color:#fff;margin:0 0 10px;font-size:22px;}
.band p{color:#d5e0f0;margin:0 0 18px;font-size:14px;}
.band .cta{background:#fff;color:var(--brand);}

.form{
  max-width:620px;
  margin:0 auto;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:28px;
  background:#fff;
}
.field{margin-bottom:13px;}
.field label{display:block;font-size:13px;margin-bottom:5px;color:#3e4f63;}
.field label .req{color:#b00;}
.field .ipt{height:40px;border:1px solid var(--line);border-radius:10px;background:#f7fbff;}
.field .ipt.area{height:88px;}
.field.sel .ipt{display:flex;align-items:center;padding:0 10px;color:#9a9a9a;font-size:12.5px;}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.check{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#5c6b7c;margin:6px 0 14px;}
.check .bx{width:16px;height:16px;border:1px solid var(--line-strong);border-radius:3px;}
.form .cta{width:100%;}

@media (min-width:768px) and (max-width:1024px){
  .wrap{padding:0 24px;}
  .sec h2{font-size:30px;}
  .fv h1{font-size:38px;}
  .svc{grid-template-columns:1fr 1fr;}
  .concept{grid-template-columns:1fr;}
}

@media (max-width:767px){
  .wrap{padding:0 16px;}
  .sec{padding:56px 0;}
  .sec h2{font-size:27px;}
  .fv{padding:62px 0 40px;}
  .fv h1{font-size:clamp(26px, 6vw, 30px);}
  .fv .lead{font-size:14px;letter-spacing:1px;}
  .svc{grid-template-columns:1fr;gap:18px;}
  .concept{
    display:flex !important;
    flex-direction:column !important;
    gap:16px;
  }
  .concept > div:first-child{width:100%;}
  .concept .triplet{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:10px;
  }
  .concept .triplet .t{padding:12px 8px;}
  .concept .triplet .t .img.img-img{
    width:min(72px,100%);
    height:min(72px,100%);
  }
  .concept .triplet .t h4{font-size:clamp(16px,4vw,18px);}
  .concept .triplet .t p{font-size:clamp(12px,3.2vw,13px);}
  .concept .concept-hero{
    width:100%;
    max-width:none;
    align-self:stretch;
  }
  .concept-hero{height:216px;}
  .eyebrow{font-size:16px;gap:12px;}
  .card{padding:20px;}
  .svc .card .img.img-img{width:160px;height:160px;}
  table.cmp{font-size:13px;}
}


/* Contact Form 7 integration */
.solutions-cf7 .wpcf7 {
  width: 100%;
}
.solutions-cf7 .wpcf7 form {
  margin: 0;
}
.solutions-cf7 .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}
.solutions-cf7 input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.solutions-cf7 select,
.solutions-cf7 textarea {
  width: 100%;
  max-width: 100%;
}
.solutions-cf7 .wpcf7-not-valid-tip {
  display: block;
  margin-top: 6px;
  color: #c62828;
  font-size: 13px;
}
.solutions-cf7 .wpcf7-response-output {
  margin: 24px 0 0 !important;
  padding: 12px 16px !important;
  border-radius: 8px;
}
.solutions-cf7 .wpcf7-spinner {
  display: block;
  margin: 12px auto 0;
}