@charset "UTF-8";
:root {
  --primary: #075ea8;
  --primary-dark: #073b67;
  --accent: #00a6a6;
  --ink: #172333;
  --muted: #5a6878;
  --line: #dbe5ec;
  --soft: #f3f7fa;
  --white: #ffffff;
  --warm: #fff8e8;
  --max: 1120px;
}

#box-01__inner__spin-off * {
  font-feature-settings: normal !important;
  text-align: unset !important;
  color: unset !important;
  font-size: initial !important;
  font-weight: initial !important;
  letter-spacing: 0 !important;
  line-height: unset !important;
}
#box-01__inner__spin-off p:not(:last-child) {
  margin-bottom: unset;
}
#box-01__inner__spin-off strong {
  font-weight: bolder !important;
}
#box-01__inner__spin-off .box-01__inner__spin-off__body {
  margin: 0;
  color: var(--ink) !important;
  background: var(--white) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  line-height: 1.9 !important;
}
#box-01__inner__spin-off img {
  display: block;
  max-width: 100%;
  height: auto;
}
#box-01__inner__spin-off .container {
  width: min(100% - 40px, var(--max));
  margin-inline: auto;
}
#box-01__inner__spin-off .hero {
  color: var(--white) !important;
  background: linear-gradient(120deg, rgba(7, 59, 103, 0.98), rgba(7, 94, 168, 0.91), rgba(0, 166, 166, 0.76)) !important;
  padding: 72px 0 104px;
}
#box-01__inner__spin-off .eyebrow {
  margin: 0 0 14px;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
}
#box-01__inner__spin-off h1 {
  max-width: 960px;
  margin: 0;
  font-size: clamp(2rem, 5vw, 4rem) !important;
  line-height: 1.25 !important;
  letter-spacing: 0.02em !important;
  font-weight: bold !important;
}
#box-01__inner__spin-off .subtitle {
  max-width: 900px;
  margin: 20px 0 0;
  font-size: clamp(1.05rem, 2.2vw, 1.45rem) !important;
  font-weight: 600 !important;
}
#box-01__inner__spin-off .lead {
  max-width: 820px;
  margin: 24px 0 0;
  color: rgba(255, 255, 255, 0.92) !important;
  font-size: 1.05rem !important;
}
#box-01__inner__spin-off .figure img {
  width: 100%;
  border-radius: 14px;
  border: 1px solid var(--line);
  box-shadow: 0 10px 28px rgba(19, 54, 82, 0.1);
}
#box-01__inner__spin-off .box-01__inner__spin-off__main {
  padding: 0 0 88px;
}
#box-01__inner__spin-off .intro-cards {
  margin-top: -68px;
  position: relative;
}
#box-01__inner__spin-off .summary {
  background: var(--white) !important;
  border-radius: 18px;
  box-shadow: 0 14px 38px rgba(19, 54, 82, 0.14);
  padding: 30px 34px;
}
#box-01__inner__spin-off .summary + .summary {
  margin-top: 28px;
}
#box-01__inner__spin-off .summary h2 {
  margin-top: 0;
}
#box-01__inner__spin-off .summary p:last-of-type {
  margin-bottom: 14px;
}
#box-01__inner__spin-off .check-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 28px;
  padding: 0;
  margin-bottom: 0;
  list-style: none;
}
#box-01__inner__spin-off .check-list li::before {
  content: "✓";
  color: var(--accent) !important;
  font-weight: 800 !important;
  margin-right: 0.65em;
}
#box-01__inner__spin-off article {
  max-width: 840px;
  margin: 64px auto 0;
}
#box-01__inner__spin-off section {
  margin-top: 72px;
  scroll-margin-top: 24px;
}
#box-01__inner__spin-off h2 {
  margin: 0 0 24px;
  font-size: clamp(1.55rem, 3vw, 2.25rem) !important;
  line-height: 1.45 !important;
  color: var(--primary-dark) !important;
  font-weight: bold !important;
}
#box-01__inner__spin-off h3 {
  margin: 36px 0 12px;
  font-size: 1.28rem !important;
  color: var(--primary-dark) !important;
  font-weight: bold !important;
}
#box-01__inner__spin-off p {
  margin: 0 0 20px;
}
#box-01__inner__spin-off ul,
#box-01__inner__spin-off ol {
  padding-left: 1.4em;
}
#box-01__inner__spin-off .figure {
  margin: 36px 0;
}
#box-01__inner__spin-off .figure figcaption {
  margin-top: 10px;
  color: var(--muted) !important;
  font-size: 0.9rem !important;
  text-align: center !important;
}
#box-01__inner__spin-off .image-placeholder {
  width: 100%;
  min-height: 300px;
  border: 2px dashed #aac3d6;
  border-radius: 14px;
  background: #edf5fa !important;
  display: grid;
  place-items: center;
  padding: 28px;
  color: #35566e !important;
  text-align: center;
}
#box-01__inner__spin-off .term,
#box-01__inner__spin-off .point,
#box-01__inner__spin-off .key-message,
#box-01__inner__spin-off .editor-note {
  margin: 30px 0;
  border-radius: 14px;
  padding: 24px 26px;
}
#box-01__inner__spin-off .term {
  background: var(--soft) !important;
  border-left: 5px solid var(--primary);
}
#box-01__inner__spin-off .term strong {
  color: var(--primary-dark) !important;
}
#box-01__inner__spin-off .point {
  background: #effaf9 !important;
  border: 1px solid #bde5e0;
}
#box-01__inner__spin-off .point h3,
#box-01__inner__spin-off .editor-note h3 {
  margin-top: 0;
}
#box-01__inner__spin-off .point ul li {
  list-style-type: disc;
}
#box-01__inner__spin-off .key-message {
  color: var(--white) !important;
  background: linear-gradient(120deg, var(--primary-dark), var(--primary)) !important;
  font-size: 1.18rem !important;
  font-weight: 700 !important;
}
#box-01__inner__spin-off .editor-note {
  background: var(--warm) !important;
  border: 1px solid #f2d58e;
}
#box-01__inner__spin-off .flow {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin: 28px 0;
}
#box-01__inner__spin-off .flow div {
  position: relative;
  padding: 18px 12px;
  border-radius: 12px;
  background: var(--soft) !important;
  text-align: center !important;
  font-weight: 700 !important;
}
#box-01__inner__spin-off .flow div:not(:last-child)::after {
  content: "→";
  position: absolute;
  right: -14px;
  color: var(--primary) !important;
}
#box-01__inner__spin-off .closing {
  margin-top: 42px;
  padding-top: 30px;
  border-top: 1px solid var(--line);
  font-size: 1.18rem !important;
  font-weight: 700 !important;
  color: var(--primary-dark) !important;
}
#box-01__inner__spin-off .box-01__inner__spin-off__footer {
  border-top: 1px solid var(--line);
  background: var(--soft) !important;
  padding: 28px 0;
  color: var(--muted) !important;
}
#box-01__inner__spin-off .box-01__inner__spin-off__footer div {
  font-size: 0.88rem !important;
}
@media (max-width: 700px) {
  #box-01__inner__spin-off .container {
    width: min(100% - 28px, var(--max));
  }
  #box-01__inner__spin-off .hero {
    padding: 48px 0 92px;
  }
  #box-01__inner__spin-off .summary {
    padding: 24px 20px;
  }
  #box-01__inner__spin-off .check-list {
    grid-template-columns: 1fr;
  }
  #box-01__inner__spin-off article {
    margin-top: 48px;
  }
  #box-01__inner__spin-off section {
    margin-top: 56px;
  }
  #box-01__inner__spin-off .flow {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  #box-01__inner__spin-off .flow div:not(:last-child)::after {
    content: "↓";
    right: auto;
    left: 50%;
    bottom: -25px;
  }
}

/*# sourceMappingURL=spin-off.css.map */
