@charset "UTF-8";
/*
Theme Name: OfficePro Blocks
Description: Block styles loaded for OfficePro custom blocks.
*/

:root,
.editor-styles-wrapper {
  --ss-font-heading: "Noto Sans JP", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --ss-font-body: "筑紫明朝N", "Tsukushi Mincho", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Noto Serif JP", serif;
  --ss-font-sans: var(--ss-font-heading);
}

/* Unified editor controls and typography overrides */
.entry-content,
.editor-styles-wrapper,
.entry-content p,
.entry-content li,
.entry-content td,
.editor-styles-wrapper p,
.editor-styles-wrapper li,
.editor-styles-wrapper td {
  font-family: var(--ss-font-body);
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6,
.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3,
.editor-styles-wrapper h4,
.editor-styles-wrapper h5,
.editor-styles-wrapper h6,
.officepro-block-heading,
.officepro-block-heading__title,
.design-heading-01__text,
.design-heading-03__text,
.icon-box1__title,
.icon-box2__title,
.icon-box3__title,
.icon-box4__title,
.icon-box-5__title,
.icon-box6__title,
.icon-box7__title,
.box1__title,
.box2__content h3,
.box3__title,
.box4__title,
.box5__title,
.box6-title,
.box7__title,
.box8__title,
.box9__title,
.box10__content h3,
.box11-content h3,
.box12__content h3,
.blog-card01__title,
.blog-card2__title,
.blog-card3__title,
.blog-card4__title,
.blog-card5__title,
.officepro-blog-card-compact__title,
.compare-table1__plan-name,
.compare-table3-row-label,
.compare-table5__title,
.wp-profile-block01__name,
.tax-profile02__name,
.profile-block3__name,
.speech-1-1__name,
.speech-1-2__name,
.speech2-1-name,
.speech2-2-name,
.speech3-1-avatar__name,
.speech3-2-avatar__name,
.speech-bubble4-1__name,
.speech-bubble4-2__name {
  font-family: var(--ss-font-heading);
}

.officepro-design-picker {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 8px 0 16px;
}

.officepro-design-picker__item {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 8px;
  color: #1e293b;
  background: #ffffff;
  border: 1px solid #dcdcde;
  border-radius: 7px;
  cursor: pointer;
  text-align: left;
}

.officepro-design-picker__item:hover,
.officepro-design-picker__item:focus-visible {
  border-color: #8baef4;
  box-shadow: 0 0 0 1px #8baef4;
}

.officepro-design-picker__item.is-selected {
  background: #f4f8ff;
  border-color: #8baef4;
  box-shadow: 0 0 0 2px rgba(139, 174, 244, 0.75);
}

.officepro-design-picker__preview {
  display: grid;
  gap: 5px;
  min-height: 58px;
  padding: 10px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  border: 1px solid #dbe6f8;
  border-radius: 6px;
}

.officepro-design-picker__bar,
.officepro-design-picker__line,
.officepro-design-picker__dot {
  display: block;
  background: #8baef4;
}

.officepro-design-picker__bar {
  width: 42%;
  height: 6px;
  border-radius: 999px;
}

.officepro-design-picker__line {
  width: 62%;
  height: 5px;
  border-radius: 999px;
  opacity: 0.55;
}

.officepro-design-picker__line--long {
  width: 86%;
}

.officepro-design-picker__dot {
  width: 18px;
  height: 18px;
  margin-top: 2px;
  border-radius: 50%;
}

.officepro-design-picker__preview--table1,
.officepro-design-picker__preview--table2,
.officepro-design-picker__preview--table3,
.officepro-design-picker__preview--table4,
.officepro-design-picker__preview--table5 {
  grid-template-columns: 1fr 1fr;
}

.officepro-design-picker__preview--table1 .officepro-design-picker__bar,
.officepro-design-picker__preview--table2 .officepro-design-picker__bar,
.officepro-design-picker__preview--table3 .officepro-design-picker__bar,
.officepro-design-picker__preview--table4 .officepro-design-picker__bar,
.officepro-design-picker__preview--table5 .officepro-design-picker__bar {
  grid-column: 1 / -1;
  width: 100%;
  border-radius: 3px;
}

.officepro-design-picker__preview--button1,
.officepro-design-picker__preview--button2,
.officepro-design-picker__preview--button3,
.officepro-design-picker__preview--button4 {
  place-items: center;
}

.officepro-design-picker__preview--button1 .officepro-design-picker__bar,
.officepro-design-picker__preview--button2 .officepro-design-picker__bar,
.officepro-design-picker__preview--button3 .officepro-design-picker__bar,
.officepro-design-picker__preview--button4 .officepro-design-picker__bar {
  width: 76%;
  height: 24px;
}

.officepro-design-picker__preview--free,
.officepro-design-picker__preview--chalk,
.officepro-design-picker__preview--advice {
  border-left: 5px solid #8baef4;
}

.officepro-design-picker__label {
  display: block;
  overflow: hidden;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.officepro-heading-level-picker {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin: 8px 0 16px;
}

.officepro-heading-level-picker__item {
  min-width: 0;
  min-height: 34px;
  padding: 6px 4px;
  color: #1e293b;
  background: #ffffff;
  border: 1px solid #dcdcde;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

.officepro-heading-level-picker__item:hover,
.officepro-heading-level-picker__item:focus-visible {
  border-color: #8baef4;
  box-shadow: 0 0 0 1px #8baef4;
}

.officepro-heading-level-picker__item.is-selected {
  color: var(--ss-color-primary);
  background: #f4f8ff;
  border-color: #8baef4;
  box-shadow: 0 0 0 2px rgba(139, 174, 244, 0.75);
}

.officepro-heading-design-picker {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin: 8px 0 16px;
}

.officepro-heading-design-picker__item {
  display: grid;
  gap: 8px;
  width: 100%;
  min-width: 0;
  padding: 8px;
  color: #1e293b;
  background: #ffffff;
  border: 1px solid #dcdcde;
  border-radius: 7px;
  cursor: pointer;
  text-align: left;
}

.officepro-heading-design-picker__item:hover,
.officepro-heading-design-picker__item:focus-visible {
  border-color: #8baef4;
  box-shadow: 0 0 0 1px #8baef4;
}

.officepro-heading-design-picker__item.is-selected {
  background: #f4f8ff;
  border-color: #8baef4;
  box-shadow: 0 0 0 2px rgba(139, 174, 244, 0.75);
}

.officepro-heading-design-picker__label {
  display: block;
  overflow: hidden;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.officepro-heading-design-preview {
  position: relative;
  display: block;
  min-height: 70px;
  padding: 12px;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #dbe6f8;
  border-radius: 6px;
}

.officepro-heading-design-preview__shape {
  position: relative;
  display: grid;
  gap: 6px;
  width: 100%;
  min-height: 40px;
  align-content: center;
}

.officepro-heading-design-preview__line {
  display: block;
  width: 54%;
  height: 5px;
  background: #8baef4;
  border-radius: 999px;
  opacity: 0.75;
}

.officepro-heading-design-preview__line--long {
  width: 78%;
  height: 8px;
  background: var(--ss-color-primary);
  opacity: 1;
}

.officepro-heading-design-preview--h2 .officepro-heading-design-preview__line--long {
  height: 11px;
}

.officepro-heading-design-preview--h5 .officepro-heading-design-preview__line--long {
  height: 6px;
}

.officepro-heading-design-preview--heading1 .officepro-heading-design-preview__shape {
  padding-left: 12px;
  border-bottom: 3px solid var(--ss-color-primary);
}

.officepro-heading-design-preview--heading1 .officepro-heading-design-preview__shape::before {
  content: "";
  position: absolute;
  left: 0;
  top: 5px;
  width: 6px;
  height: 28px;
  background: #8baef4;
}

.officepro-heading-design-preview--heading2 .officepro-heading-design-preview__shape {
  padding: 13px 18px;
  background: var(--ss-color-primary);
  border-bottom: 5px solid #8baef4;
}

.officepro-heading-design-preview--heading2 .officepro-heading-design-preview__line {
  background: rgba(255, 255, 255, 0.72);
}

.officepro-heading-design-preview--heading2 .officepro-heading-design-preview__line--long {
  background: #ffffff;
}

.officepro-heading-design-preview--heading3 .officepro-heading-design-preview__shape {
  padding: 12px 28px 12px 16px;
  background: linear-gradient(90deg, var(--ss-color-primary) 0%, var(--ss-color-primary) 72%, #073c7d 100%);
  clip-path: polygon(0 0, 100% 0, calc(100% - 18px) 100%, 0 100%);
}

.officepro-heading-design-preview--heading3 .officepro-heading-design-preview__shape::after {
  content: "";
  position: absolute;
  right: 2px;
  top: 0;
  width: 10px;
  height: 100%;
  background: #8baef4;
  clip-path: polygon(45% 0, 100% 0, 55% 100%, 0 100%);
}

.officepro-heading-design-preview--heading3 .officepro-heading-design-preview__line {
  background: rgba(255, 255, 255, 0.72);
}

.officepro-heading-design-preview--heading3 .officepro-heading-design-preview__line--long {
  background: #ffffff;
}

.officepro-row-controls,
.officepro-row-icon-controls {
  display: grid;
  gap: 12px;
}

.officepro-row-controls__item,
.officepro-row-icon-controls__item {
  padding: 12px;
  background: #ffffff;
  border: 1px solid #dcdcde;
  border-radius: 7px;
}

.officepro-row-controls__label {
  display: block;
  margin-bottom: 10px;
  overflow: hidden;
  color: #1e293b;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.officepro-row-controls__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.officepro-table-inline-row-controls-row > td {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

.officepro-table-inline-row-controls-wrap {
  width: 100%;
}

.officepro-table-inline-row-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 0;
}

.officepro-table-inline-row-controls__add.components-button {
  min-width: 34px;
  height: 28px;
  padding: 0 10px;
  color: var(--ss-color-primary);
  border-color: #8baef4;
  box-shadow: none;
  font-size: 13px;
  line-height: 1;
}

.officepro-table-inline-row-controls__delete.components-button {
  height: 28px;
  padding: 0 6px;
  font-size: 12px;
  line-height: 1;
}

.design-heading-01__icon .officepro-box-icon,
.design-heading-03__icon .officepro-box-icon,
.compare-table3-row-title .officepro-box-icon,
.tb4-icon .officepro-box-icon,
.tb5-icon .officepro-box-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
}

.compare-table3-row-title .officepro-box-icon {
  width: 28px;
  height: 28px;
  flex-basis: 28px;
}

.officepro-button-align {
  display: flex;
  width: 100%;
  opacity: 0;
  transform: translateY(8px);
  animation: officepro-button-fade-in 0.55s ease forwards;
}

.officepro-button-align--left {
  justify-content: flex-start;
  text-align: left;
}

.officepro-button-align--center {
  justify-content: center;
  text-align: center;
}

.officepro-button-align--right {
  justify-content: flex-end;
  text-align: right;
}

@keyframes officepro-button-fade-in {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .officepro-button-align {
    opacity: 1;
    transform: none;
    animation: none;
  }
}

.officepro-blog-card-compact {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: min(100%, 720px);
  min-height: 56px;
  margin: 20px auto;
  padding: 13px 18px;
  color: var(--ss-color-primary);
  background: #ffffff;
  border: 1px solid #d7e4f7;
  border-left: 5px solid #8baef4;
  border-radius: 8px;
  box-shadow: 0 8px 20px rgba(2, 50, 108, 0.08);
  text-decoration: none;
}

.officepro-blog-card-compact:hover,
.officepro-blog-card-compact:focus-visible {
  color: var(--ss-color-primary);
  border-color: #8baef4;
  box-shadow: 0 10px 24px rgba(2, 50, 108, 0.12);
}

.officepro-blog-card-compact__title {
  display: -webkit-box;
  min-width: 0;
  overflow: hidden;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.55;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.officepro-blog-card-compact__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  color: var(--ss-color-primary);
  background: #edf4ff;
  border-radius: 50%;
  font-family: var(--ss-font-heading);
  font-weight: 700;
}

.blog-card01,
.blog-card2,
.blog-card3,
.blog-card4__link,
.blog-card5 {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: min(100%, 720px);
  min-height: 56px;
  margin: 20px auto;
  padding: 13px 18px !important;
  color: var(--ss-color-primary);
  background: #ffffff !important;
  border: 1px solid #d7e4f7 !important;
  border-left: 5px solid #8baef4 !important;
  border-radius: 8px !important;
  clip-path: none !important;
  box-shadow: 0 8px 20px rgba(2, 50, 108, 0.08) !important;
  text-decoration: none;
}

.blog-card2__inner,
.blog-card4__content {
  display: contents !important;
}

.blog-card01__content,
.blog-card2__body,
.blog-card3__content,
.blog-card4__body,
.blog-card5__body {
  display: block !important;
  min-width: 0;
  padding: 0 !important;
}

.blog-card01__title,
.blog-card2__title,
.blog-card3__title,
.blog-card4__title,
.blog-card5__title {
  display: -webkit-box !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  color: var(--ss-color-primary) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.blog-card01__image,
.blog-card01__category,
.blog-card01__text,
.blog-card01__meta,
.blog-card01__arrow,
.blog-card2__visual,
.blog-card2__category,
.blog-card2__text,
.blog-card2__meta,
.blog-card2__arrow,
.blog-card2__recommend,
.blog-card3__side,
.blog-card3__label,
.blog-card3__text,
.blog-card3__bottom,
.blog-card3__arrow,
.blog-card4__image,
.blog-card4__category,
.blog-card4__text,
.blog-card4__meta,
.blog-card4__arrow,
.blog-card5__thumb,
.blog-card5__category,
.blog-card5__text,
.blog-card5__bottom,
.blog-card5__button {
  display: none !important;
}

@media (max-width: 640px) {
  .officepro-design-picker {
    grid-template-columns: 1fr;
  }

  .officepro-blog-card-compact,
  .blog-card01,
  .blog-card2,
  .blog-card3,
  .blog-card4__link,
  .blog-card5 {
    gap: 12px;
    margin: 16px auto;
    padding: 12px 14px !important;
  }

  .officepro-blog-card-compact__title,
  .blog-card01__title,
  .blog-card2__title,
  .blog-card3__title,
  .blog-card4__title,
  .blog-card5__title {
    font-size: 14px !important;
  }
}

.officepro-block-heading {
  margin: 2.2em 0 1.4em;
}


/* Speech image controls */
.officepro-speech-image-control + .officepro-speech-image-control {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid #dfe6f2;
}

.officepro-speech-image-control__label {
  margin: 0 0 8px;
  color: var(--ss-color-primary);
  font-size: 13px;
  font-weight: 700;
}

.speech-1-1 {
  --main-color: var(--ss-color-primary);
  --border-color: #C9D1DF;
  --text-color: #1F2D45;

  display: flex;
  align-items: center;
  gap: 22px;
  width: 100%;
  max-width: 760px;
  margin: 0 auto 28px;
  font-family: inherit;
  color: var(--text-color);
}

.speech-1-1 *,
.speech-1-1 *::before,
.speech-1-1 *::after {
  box-sizing: border-box;
}

.speech-1-1__person {
  width: 104px;
  flex: 0 0 104px;
  text-align: center;
}

.speech-1-1__avatar {
  width: 86px;
  height: 86px;
  margin: 0 auto 8px;
  border: 2px solid #D8E0EE;
  border-radius: 50%;
  background: #F8FAFD;
  overflow: hidden;
}

.speech-1-1__avatar img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.speech-1-1__name {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.45;
  color: var(--main-color);
}

.speech-1-1__role {
  margin: 2px 0 0;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.45;
  color: #334155;
}

.speech-1-1__bubble {
  position: relative;
  width: min(100%, 560px);
  min-height: 104px;
  padding: 22px 30px;
  border: 2px solid var(--border-color);
  border-left: 5px solid var(--main-color);
  border-radius: 8px;
  background: #fff;
}

.speech-1-1__bubble::before {
  content: "";
  position: absolute;
  top: 50%;
  left: -19px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 13px solid transparent;
  border-bottom: 13px solid transparent;
  border-right: 18px solid var(--main-color);
}

.speech-1-1__bubble p {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.85;
  letter-spacing: 0.04em;
  color: var(--text-color);
}

@media (max-width: 640px) {
  .speech-1-1 {
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 24px;
  }

  .speech-1-1__person {
    width: 72px;
    flex-basis: 72px;
  }

  .speech-1-1__avatar {
    width: 64px;
    height: 64px;
    margin-bottom: 6px;
  }

  .speech-1-1__name {
    font-size: 12px;
  }

  .speech-1-1__role {
    font-size: 10px;
  }

  .speech-1-1__bubble {
    width: calc(100% - 86px);
    min-height: auto;
    padding: 16px 18px;
    border-radius: 7px;
  }

  .speech-1-1__bubble::before {
    left: -15px;
    border-top-width: 10px;
    border-bottom-width: 10px;
    border-right-width: 14px;
  }

  .speech-1-1__bubble p {
    font-size: 14px;
    line-height: 1.75;
    letter-spacing: 0.02em;
  }

  .speech-1-1__bubble p br {
    display: none;
  }
}

.speech-1-2 {
  --main-color: var(--ss-color-primary);
  --accent-color: #3F7CFF;
  --border-color: #C9D1DF;
  --text-color: #1F2D45;

  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 22px;
  width: 100%;
  max-width: 760px;
  margin: 0 auto 28px;
  font-family: inherit;
  color: var(--text-color);
}

.speech-1-2 *,
.speech-1-2 *::before,
.speech-1-2 *::after {
  box-sizing: border-box;
}

.speech-1-2__bubble {
  position: relative;
  width: min(100%, 560px);
  min-height: 104px;
  padding: 22px 30px;
  border: 2px solid var(--border-color);
  border-right-color: var(--accent-color);
  border-radius: 8px;
  background: #fff;
  box-shadow: 4px 0 0 rgba(63, 124, 255, 0.18);
}

.speech-1-2__bubble::before {
  content: "";
  position: absolute;
  top: 50%;
  right: -19px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 13px solid transparent;
  border-bottom: 13px solid transparent;
  border-left: 18px solid var(--accent-color);
}

.speech-1-2__bubble p {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.85;
  letter-spacing: 0.04em;
  color: var(--text-color);
}

.speech-1-2__person {
  width: 104px;
  flex: 0 0 104px;
  text-align: center;
}

.speech-1-2__avatar {
  width: 86px;
  height: 86px;
  margin: 0 auto 8px;
  border: 2px solid #D8E0EE;
  border-radius: 50%;
  background: #F8FAFD;
  overflow: hidden;
}

.speech-1-2__avatar img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.speech-1-2__name {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.45;
  color: var(--main-color);
}

.speech-1-2__role {
  margin: 2px 0 0;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.45;
  color: #334155;
}

@media (max-width: 640px) {
  .speech-1-2 {
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 24px;
  }

  .speech-1-2__bubble {
    width: calc(100% - 86px);
    min-height: auto;
    padding: 16px 18px;
    border-radius: 7px;
  }

  .speech-1-2__bubble::before {
    right: -15px;
    border-top-width: 10px;
    border-bottom-width: 10px;
    border-left-width: 14px;
  }

  .speech-1-2__bubble p {
    font-size: 14px;
    line-height: 1.75;
    letter-spacing: 0.02em;
  }

  .speech-1-2__bubble p br {
    display: none;
  }

  .speech-1-2__person {
    width: 72px;
    flex-basis: 72px;
  }

  .speech-1-2__avatar {
    width: 64px;
    height: 64px;
    margin-bottom: 6px;
  }

  .speech-1-2__name {
    font-size: 12px;
  }

  .speech-1-2__role {
    font-size: 10px;
  }
}

.speech2-1-block {
  --speech2-1-navy: var(--ss-color-primary);
  --speech2-1-text: #1f2a44;
  --speech2-1-border-light: #d8e4ff;

  display: flex;
  align-items: center;
  gap: 24px;
  width: 100%;
  max-width: 960px;
  margin: 0 auto 28px;
  padding: 0 16px;
  box-sizing: border-box;
}

.speech2-1-person {
  width: 118px;
  flex: 0 0 118px;
  text-align: center;
}

.speech2-1-icon {
  width: 86px;
  height: 86px;
  margin: 0 auto 8px;
  border: 2px solid var(--speech2-1-border-light);
  border-radius: 50%;
  background: #fff;
  overflow: hidden;
  box-sizing: border-box;
}

.speech2-1-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.speech2-1-name {
  margin: 0;
  color: var(--speech2-1-navy);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}

.speech2-1-role {
  margin: 2px 0 0;
  color: var(--speech2-1-text);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
}

.speech2-1-bubble {
  position: relative;
  flex: 1;
  min-height: 112px;
  padding: 28px 44px;
  background: #fff;
  border: 3px solid var(--speech2-1-navy);
  border-radius: 6px;
  box-sizing: border-box;
}

.speech2-1-bubble p {
  position: relative;
  z-index: 2;
  margin: 0;
  color: var(--speech2-1-text);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.9;
  letter-spacing: 0.04em;
}

.speech2-1-bubble::before,
.speech2-1-bubble::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 0;
  height: 0;
  transform: translateY(-50%);
}

.speech2-1-bubble::before {
  left: -18px;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  border-right: 18px solid var(--speech2-1-navy);
}

.speech2-1-bubble::after {
  left: -13px;
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  border-right: 14px solid #fff;
}

.speech2-1-corner {
  position: absolute;
  z-index: 1;
  top: -3px;
  right: -3px;
  width: 0;
  height: 0;
  border-top: 42px solid var(--speech2-1-navy);
  border-left: 42px solid transparent;
  border-radius: 0 4px 0 0;
}

@media (max-width: 768px) {
  .speech2-1-block {
    gap: 14px;
    align-items: flex-start;
    padding: 0 12px;
  }

  .speech2-1-person {
    width: 82px;
    flex-basis: 82px;
  }

  .speech2-1-icon {
    width: 64px;
    height: 64px;
  }

  .speech2-1-name {
    font-size: 12px;
  }

  .speech2-1-role {
    font-size: 10px;
  }

  .speech2-1-bubble {
    min-height: auto;
    padding: 18px 20px;
  }

  .speech2-1-bubble p {
    font-size: 14px;
    line-height: 1.8;
  }

  .speech2-1-corner {
    border-top-width: 30px;
    border-left-width: 30px;
  }
}

@media (max-width: 520px) {
  .speech2-1-block {
    gap: 10px;
  }

  .speech2-1-person {
    width: 70px;
    flex-basis: 70px;
  }

  .speech2-1-icon {
    width: 56px;
    height: 56px;
  }

  .speech2-1-bubble {
    padding: 16px 18px;
  }

  .speech2-1-bubble p {
    font-size: 13px;
  }
}

.speech2-2-block {
  --speech2-2-blue: #8BAEF4;
  --speech2-2-accent: #4f8df7;
  --speech2-2-navy: var(--ss-color-primary);
  --speech2-2-text: #1f2a44;
  --speech2-2-border-light: #d8e4ff;

  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 24px;
  width: 100%;
  max-width: 960px;
  margin: 0 auto 28px;
  padding: 0 16px;
  box-sizing: border-box;
}

.speech2-2-person {
  width: 118px;
  flex: 0 0 118px;
  text-align: center;
}

.speech2-2-icon {
  width: 86px;
  height: 86px;
  margin: 0 auto 8px;
  border: 2px solid var(--speech2-2-border-light);
  border-radius: 50%;
  background: #fff;
  overflow: hidden;
  box-sizing: border-box;
}

.speech2-2-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.speech2-2-name {
  margin: 0;
  color: var(--speech2-2-navy);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}

.speech2-2-role {
  margin: 2px 0 0;
  color: var(--speech2-2-text);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
}

.speech2-2-bubble {
  position: relative;
  flex: 1;
  min-height: 112px;
  padding: 28px 44px;
  background: #fff;
  border: 3px solid var(--speech2-2-blue);
  border-radius: 6px;
  box-sizing: border-box;
}

.speech2-2-bubble p {
  position: relative;
  z-index: 2;
  margin: 0;
  color: var(--speech2-2-text);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.9;
  letter-spacing: 0.04em;
}

.speech2-2-bubble::before,
.speech2-2-bubble::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 0;
  height: 0;
  transform: translateY(-50%);
}

.speech2-2-bubble::before {
  right: -18px;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  border-left: 18px solid var(--speech2-2-blue);
}

.speech2-2-bubble::after {
  right: -13px;
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  border-left: 14px solid #fff;
}

.speech2-2-corner {
  position: absolute;
  z-index: 1;
  bottom: -3px;
  left: -3px;
  width: 0;
  height: 0;
  border-bottom: 42px solid var(--speech2-2-accent);
  border-right: 42px solid transparent;
  border-radius: 0 0 0 4px;
}

@media (max-width: 768px) {
  .speech2-2-block {
    gap: 14px;
    align-items: flex-start;
    padding: 0 12px;
  }

  .speech2-2-person {
    width: 82px;
    flex-basis: 82px;
  }

  .speech2-2-icon {
    width: 64px;
    height: 64px;
  }

  .speech2-2-name {
    font-size: 12px;
  }

  .speech2-2-role {
    font-size: 10px;
  }

  .speech2-2-bubble {
    min-height: auto;
    padding: 18px 20px;
  }

  .speech2-2-bubble p {
    font-size: 14px;
    line-height: 1.8;
  }

  .speech2-2-corner {
    border-bottom-width: 30px;
    border-right-width: 30px;
  }
}

@media (max-width: 520px) {
  .speech2-2-block {
    gap: 10px;
  }

  .speech2-2-person {
    width: 70px;
    flex-basis: 70px;
  }

  .speech2-2-icon {
    width: 56px;
    height: 56px;
  }

  .speech2-2-bubble {
    padding: 16px 18px;
  }

  .speech2-2-bubble p {
    font-size: 13px;
  }
}

.speech3-1-block {
  --speech3-1-navy: var(--ss-color-primary);
  --speech3-1-border: #C9D3E3;
  --speech3-1-text: #1F2A3D;
  --speech3-1-muted: #5F6B7A;

  display: flex;
  align-items: flex-start;
  gap: 18px;
  max-width: 920px;
  margin: 0 auto 22px;
  font-family: inherit;
}

.speech3-1-avatar {
  width: 118px;
  flex: 0 0 118px;
  text-align: center;
}

.speech3-1-avatar__circle {
  width: 86px;
  height: 86px;
  margin: 0 auto 8px;
  border: 2px solid #D9E0EA;
  border-radius: 50%;
  background: #fff;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.speech3-1-avatar__circle img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.speech3-1-avatar__name {
  margin: 0 0 3px;
  color: var(--speech3-1-navy);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
}

.speech3-1-avatar__sub {
  margin: 0;
  color: var(--speech3-1-muted);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
}

.speech3-1-card {
  position: relative;
  flex: 1;
  max-width: 710px;
  border: 2px solid var(--speech3-1-border);
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 2px 6px rgba(2, 50, 108, 0.06);
}

.speech3-1-card__head {
  position: relative;
  min-height: 35px;
  padding: 7px 46px 7px 22px;
  border-radius: 4px 4px 0 0;
  background: var(--speech3-1-navy);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.03em;
}

.speech3-1-card__dots {
  position: absolute;
  top: 50%;
  right: 18px;
  transform: translateY(-50%);
  font-size: 18px;
  letter-spacing: 3px;
  line-height: 1;
  opacity: 0.95;
}

.speech3-1-card__body {
  padding: 17px 24px 18px;
}

.speech3-1-card__body p {
  margin: 0;
  color: var(--speech3-1-text);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.85;
  letter-spacing: 0.04em;
}

.speech3-1-card::before,
.speech3-1-card::after {
  content: "";
  position: absolute;
  top: 45px;
  width: 0;
  height: 0;
  border-style: solid;
}

.speech3-1-card::before {
  left: -16px;
  border-width: 10px 16px 10px 0;
  border-color: transparent var(--speech3-1-border) transparent transparent;
}

.speech3-1-card::after {
  left: -13px;
  top: 47px;
  border-width: 8px 13px 8px 0;
  border-color: transparent #fff transparent transparent;
}

@media (max-width: 768px) {
  .speech3-1-block {
    gap: 10px;
    margin-bottom: 20px;
  }

  .speech3-1-avatar {
    width: 78px;
    flex-basis: 78px;
  }

  .speech3-1-avatar__circle {
    width: 64px;
    height: 64px;
    margin-bottom: 6px;
  }

  .speech3-1-avatar__name {
    font-size: 12px;
  }

  .speech3-1-avatar__sub {
    font-size: 10px;
  }

  .speech3-1-card__head {
    min-height: 32px;
    padding: 7px 38px 7px 15px;
    font-size: 13px;
  }

  .speech3-1-card__dots {
    right: 13px;
    font-size: 15px;
    letter-spacing: 2px;
  }

  .speech3-1-card__body {
    padding: 13px 15px 14px;
  }

  .speech3-1-card__body p {
    font-size: 14px;
    line-height: 1.75;
  }

  .speech3-1-pc {
    display: none;
  }

  .speech3-1-card::before {
    left: -12px;
    border-width: 8px 12px 8px 0;
  }

  .speech3-1-card::after {
    left: -9px;
    border-width: 6px 9px 6px 0;
  }
}

@media (max-width: 480px) {
  .speech3-1-avatar {
    width: 64px;
    flex-basis: 64px;
  }

  .speech3-1-avatar__circle {
    width: 54px;
    height: 54px;
  }

  .speech3-1-avatar__name {
    font-size: 11px;
  }

  .speech3-1-avatar__sub {
    display: none;
  }

  .speech3-1-card__body p {
    font-size: 13.5px;
  }
}

.speech3-2-block {
  --speech3-2-navy: var(--ss-color-primary);
  --speech3-2-blue: #3F86F6;
  --speech3-2-border: #C9D3E3;
  --speech3-2-text: #1F2A3D;
  --speech3-2-muted: #5F6B7A;

  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 18px;
  max-width: 920px;
  margin: 0 auto;
  font-family: inherit;
}

.speech3-2-avatar {
  width: 118px;
  flex: 0 0 118px;
  text-align: center;
}

.speech3-2-avatar__circle {
  width: 86px;
  height: 86px;
  margin: 0 auto 8px;
  border: 2px solid #D9E0EA;
  border-radius: 50%;
  background: #fff;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.speech3-2-avatar__circle img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.speech3-2-avatar__name {
  margin: 0 0 3px;
  color: var(--speech3-2-navy);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
}

.speech3-2-avatar__sub {
  margin: 0;
  color: var(--speech3-2-muted);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
}

.speech3-2-card {
  position: relative;
  flex: 1;
  max-width: 710px;
  border: 2px solid var(--speech3-2-border);
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 2px 6px rgba(2, 50, 108, 0.06);
}

.speech3-2-card__head {
  position: relative;
  min-height: 35px;
  padding: 7px 46px 7px 22px;
  border-radius: 4px 4px 0 0;
  background: linear-gradient(90deg, #4A98FF 0%, var(--speech3-2-blue) 100%);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.03em;
}

.speech3-2-card__dots {
  position: absolute;
  top: 50%;
  right: 18px;
  transform: translateY(-50%);
  font-size: 18px;
  letter-spacing: 3px;
  line-height: 1;
  opacity: 0.95;
}

.speech3-2-card__body {
  padding: 17px 24px 18px;
}

.speech3-2-card__body p {
  margin: 0;
  color: var(--speech3-2-text);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.85;
  letter-spacing: 0.04em;
}

.speech3-2-card::before,
.speech3-2-card::after {
  content: "";
  position: absolute;
  top: 62px;
  width: 0;
  height: 0;
  border-style: solid;
}

.speech3-2-card::before {
  right: -16px;
  border-width: 10px 0 10px 16px;
  border-color: transparent transparent transparent var(--speech3-2-border);
}

.speech3-2-card::after {
  right: -13px;
  top: 64px;
  border-width: 8px 0 8px 13px;
  border-color: transparent transparent transparent #fff;
}

@media (max-width: 768px) {
  .speech3-2-block {
    gap: 10px;
  }

  .speech3-2-avatar {
    width: 78px;
    flex-basis: 78px;
  }

  .speech3-2-avatar__circle {
    width: 64px;
    height: 64px;
    margin-bottom: 6px;
  }

  .speech3-2-avatar__name {
    font-size: 12px;
  }

  .speech3-2-avatar__sub {
    font-size: 10px;
  }

  .speech3-2-card__head {
    min-height: 32px;
    padding: 7px 38px 7px 15px;
    font-size: 13px;
  }

  .speech3-2-card__dots {
    right: 13px;
    font-size: 15px;
    letter-spacing: 2px;
  }

  .speech3-2-card__body {
    padding: 13px 15px 14px;
  }

  .speech3-2-card__body p {
    font-size: 14px;
    line-height: 1.75;
  }

  .speech3-2-pc {
    display: none;
  }

  .speech3-2-card::before {
    right: -12px;
    border-width: 8px 0 8px 12px;
  }

  .speech3-2-card::after {
    right: -9px;
    border-width: 6px 0 6px 9px;
  }
}

@media (max-width: 480px) {
  .speech3-2-avatar {
    width: 64px;
    flex-basis: 64px;
  }

  .speech3-2-avatar__circle {
    width: 54px;
    height: 54px;
  }

  .speech3-2-avatar__name {
    font-size: 11px;
  }

  .speech3-2-avatar__sub {
    display: none;
  }

  .speech3-2-card__body p {
    font-size: 13.5px;
  }
}

.speech-bubble4-1 {
  --speech-bubble4-1-navy: var(--ss-color-primary);
  --speech-bubble4-1-blue: #5f94f5;
  --speech-bubble4-1-border: #c7d2e3;
  --speech-bubble4-1-text: #26384d;

  display: flex;
  align-items: flex-start;
  gap: 22px;
  width: 100%;
  max-width: 860px;
  margin: 32px auto;
  box-sizing: border-box;
  font-family: inherit;
}

.speech-bubble4-1__person {
  width: 96px;
  flex: 0 0 96px;
  text-align: center;
}

.speech-bubble4-1__avatar {
  width: 78px;
  height: 78px;
  margin: 0 auto 8px;
  border: 2px solid var(--speech-bubble4-1-border);
  border-radius: 50%;
  background: #fff;
  overflow: hidden;
  box-sizing: border-box;
}

.speech-bubble4-1__avatar img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.speech-bubble4-1__name {
  margin: 0;
  color: var(--speech-bubble4-1-navy);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
}

.speech-bubble4-1__role {
  margin: 2px 0 0;
  color: #5d6c82;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.4;
}

.speech-bubble4-1__bubble {
  position: relative;
  flex: 1;
  max-width: 640px;
  min-height: 86px;
  padding: 20px 26px 22px;
  border: 2px solid var(--speech-bubble4-1-border);
  border-radius: 9px;
  background: #fff;
  box-sizing: border-box;
}

.speech-bubble4-1__bubble::before,
.speech-bubble4-1__bubble::after {
  content: "";
  position: absolute;
  top: 31px;
  width: 0;
  height: 0;
  border-style: solid;
}

.speech-bubble4-1__bubble::before {
  left: -17px;
  border-width: 10px 17px 10px 0;
  border-color: transparent var(--speech-bubble4-1-border) transparent transparent;
}

.speech-bubble4-1__bubble::after {
  left: -14px;
  border-width: 8px 15px 8px 0;
  border-color: transparent #fff transparent transparent;
}

.speech-bubble4-1__heading {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  color: var(--speech-bubble4-1-navy);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}

.speech-bubble4-1__heading::after {
  content: "";
  flex: 1;
  height: 1px;
  margin-left: 4px;
  border-top: 2px dotted #bfd0e8;
}

.speech-bubble4-1__mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  border-radius: 50%;
  background: var(--speech-bubble4-1-blue);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
}

.speech-bubble4-1__label {
  white-space: nowrap;
}

.speech-bubble4-1__text {
  margin: 0;
  color: var(--speech-bubble4-1-text);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.9;
  letter-spacing: 0.02em;
}

@media (max-width: 700px) {
  .speech-bubble4-1 {
    gap: 14px;
    margin: 24px auto;
  }

  .speech-bubble4-1__person {
    width: 72px;
    flex-basis: 72px;
  }

  .speech-bubble4-1__avatar {
    width: 58px;
    height: 58px;
  }

  .speech-bubble4-1__name {
    font-size: 11px;
  }

  .speech-bubble4-1__role {
    font-size: 10px;
  }

  .speech-bubble4-1__bubble {
    padding: 16px 16px 18px;
    min-height: auto;
  }

  .speech-bubble4-1__heading {
    font-size: 13px;
    gap: 8px;
  }

  .speech-bubble4-1__mark {
    width: 25px;
    height: 25px;
    flex-basis: 25px;
    font-size: 13px;
  }

  .speech-bubble4-1__text {
    font-size: 14px;
    line-height: 1.8;
  }
}

@media (max-width: 520px) {
  .speech-bubble4-1 {
    gap: 10px;
  }

  .speech-bubble4-1__person {
    width: 58px;
    flex-basis: 58px;
  }

  .speech-bubble4-1__avatar {
    width: 48px;
    height: 48px;
  }

  .speech-bubble4-1__role {
    display: none;
  }

  .speech-bubble4-1__bubble {
    padding: 14px;
    border-radius: 8px;
  }

  .speech-bubble4-1__heading::after {
    display: none;
  }

  .speech-bubble4-1__text {
    font-size: 13.5px;
  }
}

.speech-bubble4-2 {
  --speech-bubble4-2-navy: var(--ss-color-primary);
  --speech-bubble4-2-blue: #5f94f5;
  --speech-bubble4-2-border: #c7d2e3;
  --speech-bubble4-2-text: #26384d;

  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 22px;
  width: 100%;
  max-width: 860px;
  margin: 32px auto;
  padding-left: 92px;
  box-sizing: border-box;
  font-family: inherit;
}

.speech-bubble4-2__person {
  width: 96px;
  flex: 0 0 96px;
  text-align: center;
}

.speech-bubble4-2__avatar {
  width: 78px;
  height: 78px;
  margin: 0 auto 8px;
  border: 2px solid var(--speech-bubble4-2-border);
  border-radius: 50%;
  background: #fff;
  overflow: hidden;
  box-sizing: border-box;
}

.speech-bubble4-2__avatar img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.speech-bubble4-2__name {
  margin: 0;
  color: var(--speech-bubble4-2-navy);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
}

.speech-bubble4-2__role {
  margin: 2px 0 0;
  color: #5d6c82;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.4;
}

.speech-bubble4-2__bubble {
  position: relative;
  flex: 1;
  max-width: 620px;
  min-height: 104px;
  padding: 20px 26px 22px;
  border: 2px solid var(--speech-bubble4-2-border);
  border-radius: 9px;
  background: #fff;
  box-sizing: border-box;
}

.speech-bubble4-2__bubble::before,
.speech-bubble4-2__bubble::after {
  content: "";
  position: absolute;
  top: 31px;
  width: 0;
  height: 0;
  border-style: solid;
}

.speech-bubble4-2__bubble::before {
  right: -17px;
  border-width: 10px 0 10px 17px;
  border-color: transparent transparent transparent var(--speech-bubble4-2-border);
}

.speech-bubble4-2__bubble::after {
  right: -14px;
  border-width: 8px 0 8px 15px;
  border-color: transparent transparent transparent #fff;
}

.speech-bubble4-2__heading {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  color: var(--speech-bubble4-2-navy);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}

.speech-bubble4-2__heading::after {
  content: "";
  flex: 1;
  height: 1px;
  margin-left: 4px;
  border-top: 2px dotted #bfd0e8;
}

.speech-bubble4-2__mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  border-radius: 50%;
  background: var(--speech-bubble4-2-blue);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
}

.speech-bubble4-2__label {
  white-space: nowrap;
}

.speech-bubble4-2__text {
  margin: 0;
  color: var(--speech-bubble4-2-text);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.9;
  letter-spacing: 0.02em;
}

@media (max-width: 700px) {
  .speech-bubble4-2 {
    gap: 14px;
    margin: 24px auto;
    padding-left: 0;
  }

  .speech-bubble4-2__person {
    width: 72px;
    flex-basis: 72px;
  }

  .speech-bubble4-2__avatar {
    width: 58px;
    height: 58px;
  }

  .speech-bubble4-2__name {
    font-size: 11px;
  }

  .speech-bubble4-2__role {
    font-size: 10px;
  }

  .speech-bubble4-2__bubble {
    padding: 16px 16px 18px;
    min-height: auto;
  }

  .speech-bubble4-2__heading {
    font-size: 13px;
    gap: 8px;
  }

  .speech-bubble4-2__mark {
    width: 25px;
    height: 25px;
    flex-basis: 25px;
    font-size: 13px;
  }

  .speech-bubble4-2__text {
    font-size: 14px;
    line-height: 1.8;
  }
}

@media (max-width: 520px) {
  .speech-bubble4-2 {
    gap: 10px;
  }

  .speech-bubble4-2__person {
    width: 58px;
    flex-basis: 58px;
  }

  .speech-bubble4-2__avatar {
    width: 48px;
    height: 48px;
  }

  .speech-bubble4-2__role {
    display: none;
  }

  .speech-bubble4-2__bubble {
    padding: 14px;
    border-radius: 8px;
  }

  .speech-bubble4-2__heading::after {
    display: none;
  }

  .speech-bubble4-2__text {
    font-size: 13.5px;
  }
}

/* Theme icon library shared by original box blocks. */
.officepro-box-icon {
  --officepro-box-icon-image: none;

  display: block;
  width: 100%;
  height: 100%;
  background-image: var(--officepro-box-icon-image);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 140%;
  filter: brightness(0) saturate(100%) invert(75%) sepia(31%) saturate(766%) hue-rotate(190deg) brightness(98%) contrast(94%);
}

.officepro-box-icon--ai-chip { --officepro-box-icon-image: url("assets/img/box-icons/ai-chip.png"); }
.officepro-box-icon--announcement-megaphone { --officepro-box-icon-image: url("assets/img/box-icons/announcement-megaphone.png"); }
.officepro-box-icon--idea-lightbulb { --officepro-box-icon-image: url("assets/img/box-icons/idea-lightbulb.png"); }
.officepro-box-icon--office-building { --officepro-box-icon-image: url("assets/img/box-icons/office-building.png"); }
.officepro-box-icon--online-consultation { --officepro-box-icon-image: url("assets/img/box-icons/online-consultation.png"); }
.officepro-box-icon--customer-support { --officepro-box-icon-image: url("assets/img/box-icons/customer-support.png"); }
.officepro-box-icon--calendar { --officepro-box-icon-image: url("assets/img/box-icons/calendar.png"); }
.officepro-box-icon--clock { --officepro-box-icon-image: url("assets/img/box-icons/clock.png"); }
.officepro-box-icon--cloud { --officepro-box-icon-image: url("assets/img/box-icons/cloud.png"); }
.officepro-box-icon--credit-card { --officepro-box-icon-image: url("assets/img/box-icons/credit-card.png"); }
.officepro-box-icon--good-recommend { --officepro-box-icon-image: url("assets/img/box-icons/good-recommend.png"); }
.officepro-box-icon--smartphone { --officepro-box-icon-image: url("assets/img/box-icons/smartphone.png"); }
.officepro-box-icon--security-shield { --officepro-box-icon-image: url("assets/img/box-icons/security-shield.png"); }
.officepro-box-icon--download { --officepro-box-icon-image: url("assets/img/box-icons/download.png"); }
.officepro-box-icon--check-mark { --officepro-box-icon-image: url("assets/img/box-icons/check-mark.png"); }
.officepro-box-icon--checklist { --officepro-box-icon-image: url("assets/img/box-icons/checklist.png"); }
.officepro-box-icon--chat-message { --officepro-box-icon-image: url("assets/img/box-icons/chat-message.png"); }
.officepro-box-icon--team { --officepro-box-icon-image: url("assets/img/box-icons/team.png"); }
.officepro-box-icon--team-leader { --officepro-box-icon-image: url("assets/img/box-icons/team-leader.png"); }
.officepro-box-icon--database { --officepro-box-icon-image: url("assets/img/box-icons/database.png"); }
.officepro-box-icon--laptop { --officepro-box-icon-image: url("assets/img/box-icons/laptop.png"); }
.officepro-box-icon--business-person { --officepro-box-icon-image: url("assets/img/box-icons/business-person.png"); }
.officepro-box-icon--business-meeting { --officepro-box-icon-image: url("assets/img/box-icons/business-meeting.png"); }
.officepro-box-icon--folder { --officepro-box-icon-image: url("assets/img/box-icons/folder.png"); }
.officepro-box-icon--mail { --officepro-box-icon-image: url("assets/img/box-icons/mail.png"); }
.officepro-box-icon--user { --officepro-box-icon-image: url("assets/img/box-icons/user.png"); }
.officepro-box-icon--up-arrow { --officepro-box-icon-image: url("assets/img/box-icons/up-arrow.png"); }
.officepro-box-icon--yen-money-bag { --officepro-box-icon-image: url("assets/img/box-icons/yen-money-bag.png"); }
.officepro-box-icon--yen-cycle { --officepro-box-icon-image: url("assets/img/box-icons/yen-cycle.png"); }
.officepro-box-icon--yen-mark { --officepro-box-icon-image: url("assets/img/box-icons/yen-mark.png"); }
.officepro-box-icon--analysis-report { --officepro-box-icon-image: url("assets/img/box-icons/analysis-report.png"); }
.officepro-box-icon--beginner-guide { --officepro-box-icon-image: url("assets/img/box-icons/beginner-guide.png"); }
.officepro-box-icon--seal { --officepro-box-icon-image: url("assets/img/box-icons/seal.png"); }
.officepro-box-icon--contract-signature { --officepro-box-icon-image: url("assets/img/box-icons/contract-signature.png"); }
.officepro-box-icon--store { --officepro-box-icon-image: url("assets/img/box-icons/store.png"); }
.officepro-box-icon--growth-chart { --officepro-box-icon-image: url("assets/img/box-icons/growth-chart.png"); }
.officepro-box-icon--handshake { --officepro-box-icon-image: url("assets/img/box-icons/handshake.png"); }
.officepro-box-icon--document { --officepro-box-icon-image: url("assets/img/box-icons/document.png"); }
.officepro-box-icon--book { --officepro-box-icon-image: url("assets/img/box-icons/book.png"); }
.officepro-box-icon--consultation { --officepro-box-icon-image: url("assets/img/box-icons/consultation.png"); }
.officepro-box-icon--tax-document { --officepro-box-icon-image: url("assets/img/box-icons/tax-document.png"); }
.officepro-box-icon--spreadsheet-document { --officepro-box-icon-image: url("assets/img/box-icons/spreadsheet-document.png"); }
.officepro-box-icon--invoice { --officepro-box-icon-image: url("assets/img/box-icons/invoice.png"); }
.officepro-box-icon--warning { --officepro-box-icon-image: url("assets/img/box-icons/warning.png"); }
.officepro-box-icon--financial-support { --officepro-box-icon-image: url("assets/img/box-icons/financial-support.png"); }
.officepro-box-icon--help-question { --officepro-box-icon-image: url("assets/img/box-icons/help-question.png"); }
.officepro-box-icon--map-pin { --officepro-box-icon-image: url("assets/img/box-icons/map-pin.png"); }
.officepro-box-icon--magnifying-glass { --officepro-box-icon-image: url("assets/img/box-icons/magnifying-glass.png"); }
.officepro-box-icon--bank { --officepro-box-icon-image: url("assets/img/box-icons/bank.png"); }
.officepro-box-icon--calculator { --officepro-box-icon-image: url("assets/img/box-icons/calculator.png"); }
.officepro-box-icon--phone { --officepro-box-icon-image: url("assets/img/box-icons/phone.png"); }
.officepro-box-icon--receipt { --officepro-box-icon-image: url("assets/img/box-icons/receipt.png"); }


.officepro-icon-library__help {
  margin: 0 0 12px;
  color: #50575e;
  font-size: 12px;
  line-height: 1.6;
}

.officepro-icon-library {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  max-height: 430px;
  padding: 2px;
  overflow-y: auto;
}

.officepro-icon-library__item {
  display: grid;
  min-width: 0;
  min-height: 82px;
  padding: 7px 4px;
  color: #1e1e1e;
  background: #fff;
  border: 1px solid #dcdcde;
  border-radius: 6px;
  cursor: pointer;
  place-items: center;
  align-content: center;
  gap: 5px;
}

.officepro-icon-library__item:hover,
.officepro-icon-library__item:focus-visible {
  border-color: #2271b1;
  box-shadow: 0 0 0 1px #2271b1;
}

.officepro-icon-library__item.is-selected {
  color: #0a4b78;
  background: #f0f6fc;
  border-color: #2271b1;
  box-shadow: 0 0 0 2px #2271b1;
}

.officepro-icon-library__item .officepro-box-icon {
  width: 42px;
  height: 42px;
}

.officepro-icon-library__item--default .dashicons {
  width: 34px;
  height: 34px;
  font-size: 34px;
}

.officepro-icon-library__label {
  display: block;
  max-width: 100%;
  overflow: hidden;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.25;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.officepro-block-heading__eyebrow {
  margin: 0 0 8px;
  color: var(--ss-color-accent);
  font-size: 13px;
  font-weight: 800;
}

.officepro-block-heading__title {
  margin: 0;
  color: var(--ss-color-primary);
  font-size: 30px;
  line-height: 1.4;
}

.officepro-block-heading__lead {
  max-width: 720px;
  margin: 10px 0 0;
  color: var(--ss-color-muted);
}

.officepro-service-card {
  height: 100%;
  padding: 26px;
  background: var(--ss-color-surface);
  border: 1px solid var(--ss-color-border);
  border-radius: var(--ss-radius);
  box-shadow: 0 10px 26px rgba(23, 32, 51, 0.04);
}

.officepro-service-card__kicker {
  display: inline-flex;
  margin-bottom: 14px;
  color: var(--ss-color-teal);
  font-size: 13px;
  font-weight: 800;
}

.officepro-service-card__title {
  margin: 0 0 12px;
  color: var(--ss-color-ink);
  font-size: 20px;
  line-height: 1.5;
}

.officepro-service-card__text {
  margin: 0;
  color: var(--ss-color-muted);
}

/* =========================
   ボタンブロック：VIEW MORE
========================= */

.tax-more-button-block {
  margin: 24px 0;
}

.tax-more-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;

  min-width: 160px;
  min-height: 44px;
  padding: 0 17px 0 38px;

  color: #ffffff;
  background: linear-gradient(
    180deg,
    #07377f 0%,
    #03296c 55%,
    #01245f 100%
  );

  border-radius: 999px;
  text-decoration: none;

  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.14em;

  box-shadow:
    0 10px 18px rgba(2, 41, 108, 0.28),
    0 3px 6px rgba(2, 41, 108, 0.18);

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    background 0.25s ease;
}

.tax-more-button__text {
  white-space: nowrap;
}

.tax-more-button__arrow {
  position: relative;
  width: 17px;
  height: 8px;
  flex-shrink: 0;
}

.tax-more-button__arrow::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 17px;
  height: 1px;
  background: #ffffff;
  transform: translateY(-50%);
}

.tax-more-button__arrow::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 6px;
  height: 6px;
  border-top: 1px solid #ffffff;
  border-right: 1px solid #ffffff;
  transform: translateY(-50%) rotate(45deg);
}

.tax-more-button:hover {
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow:
    0 14px 22px rgba(2, 41, 108, 0.32),
    0 5px 9px rgba(2, 41, 108, 0.2);
  background: linear-gradient(
    180deg,
    #0a3e8c 0%,
    #032f78 55%,
    #01245f 100%
  );
}

.tax-more-button:focus-visible {
  color: #ffffff;
  outline: 3px solid rgba(139, 174, 244, 0.55);
  outline-offset: 4px;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .tax-more-button {
    min-width: 150px;
    min-height: 42px;
    padding: 0 16px 0 32px;
    font-size: 11px;
    gap: 16px;
  }
}

/* ボタンブロック2 */
.tax-button2-block {
  width: 100%;
  text-align: center;
  margin: 24px 0;
}

.tax-button2 {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 168px;
  height: 42px;
  padding: 0 36px;

  border: 1.5px solid var(--ss-color-primary);
  border-radius: 999px;
  background-color: #ffffff;

  color: var(--ss-color-primary);
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.16em;
  text-decoration: none;

  transition:
    background-color 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.tax-button2:hover {
  background-color: var(--ss-color-primary);
  color: #ffffff;
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(2, 50, 108, 0.16);
}

.tax-button2:focus-visible {
  outline: 3px solid rgba(139, 174, 244, 0.45);
  outline-offset: 3px;
}

/* スマホ調整 */
@media (max-width: 599px) {
  .tax-button2 {
    min-width: 156px;
    height: 40px;
    padding: 0 28px;
    font-size: 11px;
    letter-spacing: 0.14em;
  }
}

/* ==============================
   ボタンブロック3
   ============================== */

.tax-btn-block-03 {
  margin: 32px 0;
  text-align: center;
}

.tax-btn-03 {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 190px;
  min-height: 44px;
  padding: 0 54px 0 42px;
  border: 1px solid #d7e4f7;
  border-radius: 9px;
  background: linear-gradient(180deg, #ffffff 0%, #f4f8ff 100%);
  box-shadow:
    0 4px 10px rgba(2, 50, 108, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  color: var(--ss-color-primary);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.16em;
  line-height: 1;
  text-decoration: none;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    border-color 0.25s ease,
    background 0.25s ease;
}

.tax-btn-03__text {
  display: inline-block;
}

/* 右矢印 */
.tax-btn-03__arrow {
  position: absolute;
  top: 50%;
  right: 25px;
  width: 16px;
  height: 1.5px;
  background-color: var(--ss-color-primary);
  transform: translateY(-50%);
  transition: right 0.25s ease;
}

.tax-btn-03__arrow::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 7px;
  height: 7px;
  border-top: 1.5px solid var(--ss-color-primary);
  border-right: 1.5px solid var(--ss-color-primary);
  transform: translateY(-50%) rotate(45deg);
}

/* hover */
.tax-btn-03:hover {
  transform: translateY(-2px);
  border-color: #b9cff3;
  background: linear-gradient(180deg, #ffffff 0%, #edf4ff 100%);
  box-shadow:
    0 7px 14px rgba(2, 50, 108, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.95);
  color: var(--ss-color-primary);
}

.tax-btn-03:hover .tax-btn-03__arrow {
  right: 21px;
}

/* focus */
.tax-btn-03:focus-visible {
  color: var(--ss-color-primary);
  outline: 3px solid rgba(139, 174, 244, 0.45);
  outline-offset: 3px;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .tax-btn-block-03 {
    margin: 28px 0;
  }

  .tax-btn-03 {
    min-width: 170px;
    min-height: 42px;
    padding: 0 48px 0 36px;
    font-size: 11px;
    letter-spacing: 0.14em;
  }

  .tax-btn-03__arrow {
    right: 22px;
    width: 15px;
  }

  .tax-btn-03:hover .tax-btn-03__arrow {
    right: 19px;
  }
}

/* ボタンブロック4 */
.custom-button-block04 {
  margin: 24px 0;
}

.custom-button-block04__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 22px;

  min-width: 181px;
  min-height: 43px;
  padding: 0 18px 0 34px;

  color: #ffffff;
  text-decoration: none;
  border-radius: 5px;
  overflow: hidden;

  background:
    radial-gradient(
      ellipse at 62% 50%,
      rgba(255, 255, 255, 0.32) 0%,
      rgba(255, 255, 255, 0.14) 22%,
      rgba(255, 255, 255, 0) 45%
    ),
    linear-gradient(
      100deg,
      #00246c 0%,
      #00499e 42%,
      #1f7fe2 68%,
      #6eb0ff 100%
    );

  box-shadow: 0 6px 14px rgba(2, 50, 108, 0.18);
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    opacity 0.25s ease;
}

.custom-button-block04__link::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.16) 58%,
    rgba(255, 255, 255, 0) 78%
  );
  pointer-events: none;
}

.custom-button-block04__text {
  position: relative;
  z-index: 1;

  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.16em;
  font-family: Arial, Helvetica, sans-serif;
  white-space: nowrap;
}

.custom-button-block04__arrow {
  position: relative;
  z-index: 1;

  width: 22px;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.85);
}

.custom-button-block04__arrow::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;

  width: 7px;
  height: 7px;
  border-top: 1px solid rgba(255, 255, 255, 0.9);
  border-right: 1px solid rgba(255, 255, 255, 0.9);

  transform: translateY(-50%) rotate(45deg);
}

.custom-button-block04__link:hover {
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(2, 50, 108, 0.24);
  opacity: 0.95;
}

.custom-button-block04__link:focus-visible {
  color: #ffffff;
  outline: 3px solid rgba(139, 174, 244, 0.45);
  outline-offset: 4px;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .custom-button-block04__link {
    min-width: 170px;
    min-height: 42px;
    padding: 0 16px 0 30px;
    gap: 18px;
  }

  .custom-button-block04__text {
    font-size: 11px;
    letter-spacing: 0.14em;
  }
}

/* WordPress標準ボタンブロック：ボタン1 */
.wp-block-button.is-style-tax-button-1 {
  margin: 24px 0;
}

.wp-block-button.is-style-tax-button-1 .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  min-width: 160px;
  min-height: 44px;
  padding: 0 17px 0 38px;
  color: #ffffff;
  background: linear-gradient(
    180deg,
    #07377f 0%,
    #03296c 55%,
    #01245f 100%
  );
  border: 0;
  border-radius: 999px;
  box-shadow:
    0 10px 18px rgba(2, 41, 108, 0.28),
    0 3px 6px rgba(2, 41, 108, 0.18);
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.14em;
  text-decoration: none;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    background 0.25s ease;
}

.wp-block-button.is-style-tax-button-1 .wp-block-button__link::after {
  content: "";
  flex: 0 0 17px;
  width: 17px;
  height: 8px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 8'%3E%3Cpath d='M0 4h15M11.5.7 15 4l-3.5 3.3' fill='none' stroke='%23fff' stroke-width='1'/%3E%3C/svg%3E") center / contain no-repeat;
}

.wp-block-button.is-style-tax-button-1 .wp-block-button__link:hover {
  color: #ffffff;
  background: linear-gradient(
    180deg,
    #0a3e8c 0%,
    #032f78 55%,
    #01245f 100%
  );
  box-shadow:
    0 14px 22px rgba(2, 41, 108, 0.32),
    0 5px 9px rgba(2, 41, 108, 0.2);
  transform: translateY(-2px);
}

.wp-block-button.is-style-tax-button-1 .wp-block-button__link:focus-visible {
  color: #ffffff;
  outline: 3px solid rgba(139, 174, 244, 0.55);
  outline-offset: 4px;
}

/* WordPress標準ボタンブロック：ボタン2 */
.wp-block-button.is-style-tax-button-2 {
  width: 100%;
  margin: 24px 0;
  text-align: center;
}

.wp-block-button.is-style-tax-button-2 .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 168px;
  height: 42px;
  padding: 0 36px;
  color: var(--ss-color-primary);
  background: #ffffff;
  border: 1.5px solid var(--ss-color-primary);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.16em;
  text-decoration: none;
  transition:
    background-color 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.wp-block-button.is-style-tax-button-2 .wp-block-button__link:hover {
  color: #ffffff;
  background: var(--ss-color-primary);
  box-shadow: 0 6px 14px rgba(2, 50, 108, 0.16);
  transform: translateY(-1px);
}

.wp-block-button.is-style-tax-button-2 .wp-block-button__link:focus-visible {
  outline: 3px solid rgba(139, 174, 244, 0.45);
  outline-offset: 3px;
}

/* WordPress標準ボタンブロック：ボタン3 */
.wp-block-button.is-style-tax-button-3 {
  width: 100%;
  margin: 32px 0;
  text-align: center;
}

.wp-block-button.is-style-tax-button-3 .wp-block-button__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 190px;
  min-height: 44px;
  padding: 0 54px 0 42px;
  color: var(--ss-color-primary);
  background: linear-gradient(180deg, #ffffff 0%, #f4f8ff 100%);
  border: 1px solid #d7e4f7;
  border-radius: 9px;
  box-shadow:
    0 4px 10px rgba(2, 50, 108, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.16em;
  text-decoration: none;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    border-color 0.25s ease,
    background 0.25s ease;
}

.wp-block-button.is-style-tax-button-3 .wp-block-button__link::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 25px;
  width: 16px;
  height: 8px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 8'%3E%3Cpath d='M0 4h14M10.5.5 14 4l-3.5 3.5' fill='none' stroke='%2302326C' stroke-width='1.5'/%3E%3C/svg%3E") center / contain no-repeat;
  transform: translateY(-50%);
  transition: right 0.25s ease;
}

.wp-block-button.is-style-tax-button-3 .wp-block-button__link:hover {
  color: var(--ss-color-primary);
  background: linear-gradient(180deg, #ffffff 0%, #edf4ff 100%);
  border-color: #b9cff3;
  box-shadow:
    0 7px 14px rgba(2, 50, 108, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.95);
  transform: translateY(-2px);
}

.wp-block-button.is-style-tax-button-3 .wp-block-button__link:hover::after {
  right: 21px;
}

.wp-block-button.is-style-tax-button-3 .wp-block-button__link:focus-visible {
  color: var(--ss-color-primary);
  outline: 3px solid rgba(139, 174, 244, 0.45);
  outline-offset: 3px;
}

/* WordPress標準ボタンブロック：ボタン4 */
.wp-block-button.is-style-tax-button-4 {
  margin: 24px 0;
}

.wp-block-button.is-style-tax-button-4 .wp-block-button__link {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  min-width: 181px;
  min-height: 43px;
  padding: 0 18px 0 34px;
  overflow: hidden;
  color: #ffffff;
  background:
    radial-gradient(
      ellipse at 62% 50%,
      rgba(255, 255, 255, 0.32) 0%,
      rgba(255, 255, 255, 0.14) 22%,
      rgba(255, 255, 255, 0) 45%
    ),
    linear-gradient(
      100deg,
      #00246c 0%,
      #00499e 42%,
      #1f7fe2 68%,
      #6eb0ff 100%
    );
  border: 0;
  border-radius: 5px;
  box-shadow: 0 6px 14px rgba(2, 50, 108, 0.18);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.16em;
  text-decoration: none;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    opacity 0.25s ease;
}

.wp-block-button.is-style-tax-button-4 .wp-block-button__link::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.16) 58%,
    rgba(255, 255, 255, 0) 78%
  );
  pointer-events: none;
}

.wp-block-button.is-style-tax-button-4 .wp-block-button__link::after {
  content: "";
  flex: 0 0 22px;
  width: 22px;
  height: 8px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 8'%3E%3Cpath d='M0 4h20M16.5.5 20 4l-3.5 3.5' fill='none' stroke='%23fff' stroke-opacity='.9' stroke-width='1'/%3E%3C/svg%3E") center / contain no-repeat;
}

.wp-block-button.is-style-tax-button-4 .wp-block-button__link:hover {
  color: #ffffff;
  box-shadow: 0 10px 22px rgba(2, 50, 108, 0.24);
  opacity: 0.95;
  transform: translateY(-2px);
}

.wp-block-button.is-style-tax-button-4 .wp-block-button__link:focus-visible {
  color: #ffffff;
  outline: 3px solid rgba(139, 174, 244, 0.45);
  outline-offset: 4px;
}

@media (max-width: 600px) {
  .wp-block-button.is-style-tax-button-1 .wp-block-button__link {
    min-width: 150px;
    min-height: 42px;
    padding: 0 16px 0 32px;
    gap: 16px;
    font-size: 11px;
  }

  .wp-block-button.is-style-tax-button-2 .wp-block-button__link {
    min-width: 156px;
    height: 40px;
    padding: 0 28px;
    font-size: 11px;
    letter-spacing: 0.14em;
  }

  .wp-block-button.is-style-tax-button-3 {
    margin: 28px 0;
  }

  .wp-block-button.is-style-tax-button-3 .wp-block-button__link {
    min-width: 170px;
    min-height: 42px;
    padding: 0 48px 0 36px;
    font-size: 11px;
    letter-spacing: 0.14em;
  }

  .wp-block-button.is-style-tax-button-3 .wp-block-button__link::after {
    right: 22px;
    width: 15px;
  }

  .wp-block-button.is-style-tax-button-3 .wp-block-button__link:hover::after {
    right: 19px;
  }

  .wp-block-button.is-style-tax-button-4 .wp-block-button__link {
    min-width: 170px;
    min-height: 42px;
    padding: 0 16px 0 30px;
    gap: 18px;
    font-size: 11px;
    letter-spacing: 0.14em;
  }
}

/* 税理士サイト用 h2 見出し */
.wp-tax-h2 {
  --tax-navy: var(--ss-color-primary);
  --tax-navy-dark: #001f4d;
  --tax-blue: #8BAEF4;
  --tax-cut: 28px;

  position: relative;
  isolation: isolate;
  display: inline-block;
  min-width: min(100%, 380px);
  max-width: 100%;
  box-sizing: border-box;

  margin: 2.2em 0 1.2em;
  padding: 5px 34px 5px 5px;

  color: #fff;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Yu Gothic", serif;
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0.16em;

  background: transparent;
  border: none;
}

/* 本体のネイビー背景 */
.wp-tax-h2::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;

  background: linear-gradient(
    90deg,
    var(--tax-navy-dark) 0%,
    var(--tax-navy) 58%,
    #064784 100%
  );

  clip-path: polygon(
    0 0,
    calc(100% - var(--tax-cut)) 0,
    100% var(--tax-cut),
    100% 100%,
    0 100%
  );

  box-shadow:
    inset 0 0 0 2px rgba(139, 174, 244, 0.75),
    inset 0 0 0 3px rgba(255, 255, 255, 0.35);
}

/* 右下のブルーの影 */
.wp-tax-h2::after {
  content: "";
  position: absolute;
  inset: 10px -8px -8px 8px;
  z-index: -2;

  background: var(--tax-blue);
  opacity: 0.75;

  clip-path: polygon(
    0 0,
    calc(100% - var(--tax-cut)) 0,
    100% var(--tax-cut),
    100% 100%,
    0 100%
  );
}

/* 内側の白線と文字位置 */
.wp-tax-h2 span {
  position: relative;
  display: block;
  box-sizing: border-box;

  padding: 10px 28px 10px 48px;

  border: 1px solid rgba(255, 255, 255, 0.75);

  clip-path: polygon(
    0 0,
    calc(100% - var(--tax-cut)) 0,
    100% var(--tax-cut),
    100% 100%,
    0 100%
  );
}

/* 右上の斜めライン */
.wp-tax-h2 span::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;

  width: var(--tax-cut);
  height: var(--tax-cut);

  background: linear-gradient(
    135deg,
    transparent calc(50% - 0.5px),
    rgba(255, 255, 255, 0.75) 50%,
    transparent calc(50% + 0.5px)
  );

  pointer-events: none;
}

/* テーマ本文・ブロックエディター標準の見出し装飾を解除 */
.entry-content h2.wp-tax-h2,
.editor-styles-wrapper h2.wp-tax-h2 {
  color: #fff;
  border: none;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .wp-tax-h2 {
    --tax-cut: 22px;

    width: 100%;
    min-width: 0;
    padding: 5px 26px 5px 5px;

    font-size: 1.35rem;
    letter-spacing: 0.12em;
  }

  .wp-tax-h2 span {
    padding: 10px 20px 10px 28px;
  }
}

/* h3見出し：左線＋下線デザイン */
h3.tax-h3-heading {
  box-sizing: border-box;
  width: 100%;
  margin: 2.2em 0 1.2em;
  padding: 0.15em 0 0.55em 0.75em;

  border-left: 6px solid var(--ss-color-primary);
  border-bottom: 1px solid var(--ss-color-primary);

  color: var(--ss-color-primary);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "YuMincho", "Noto Serif JP", serif;
  font-size: clamp(1.35rem, 2.6vw, 1.75rem);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0.06em;
}

/* スマホ調整 */
@media (max-width: 600px) {
  h3.tax-h3-heading {
    margin: 1.8em 0 1em;
    padding: 0.12em 0 0.5em 0.65em;
    border-left-width: 5px;
    font-size: 1.35rem;
    letter-spacing: 0.04em;
  }
}

/* h4：淡いブルー背景の中見出し */
h4.nao-h4-soft-blue {
  margin: 2.2em 0 1.2em;
  padding: 12px 22px;
  background: linear-gradient(
    90deg,
    #f7fbff 0%,
    #edf5ff 45%,
    #eaf3ff 100%
  );
  color: var(--ss-color-primary);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "YuMincho", serif;
  font-size: clamp(1.25rem, 2.4vw, 1.55rem);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.08em;
  box-sizing: border-box;
  border: none;
}

/* スマホ調整 */
@media screen and (max-width: 600px) {
  h4.nao-h4-soft-blue {
    padding: 10px 16px;
    font-size: 1.18rem;
    letter-spacing: 0.06em;
  }
}

/* h5 小見出しデザイン */
h5.tax-heading-h5 {
  position: relative;
  margin: 1.8em 0 1em;
  padding: 0.15em 0 0.55em 0.8em;
  border-left: 2px solid #8BAEF4;
  border-bottom: 1px dotted rgba(139, 174, 244, 0.75);

  color: var(--ss-color-primary);
  font-size: clamp(1rem, 0.95rem + 0.25vw, 1.15rem);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.06em;
}

/* スマホ調整 */
@media (max-width: 600px) {
  h5.tax-heading-h5 {
    margin: 1.5em 0 0.9em;
    padding: 0.1em 0 0.5em 0.7em;
    font-size: 1rem;
    letter-spacing: 0.04em;
  }
}

/* 見出し1h2 */
.heading-1-h2,
.entry-content .heading-1-h2,
.editor-styles-wrapper .heading-1-h2 {
  position: relative;
  margin: 2.5em 0 1.5em;
  padding: 0.15em 0 0.45em 1.3em;
  color: var(--ss-color-primary);
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.12em;
  border-bottom: 3px solid var(--ss-color-primary);
}

.heading-1-h2::before,
.entry-content .heading-1-h2::before,
.editor-styles-wrapper .heading-1-h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.05em;
  width: 8px;
  height: 1.45em;
  background: #8BAEF4;
}

.heading-1-h2::after,
.entry-content .heading-1-h2::after,
.editor-styles-wrapper .heading-1-h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -8px;
  width: 100%;
  height: 2px;
  background: var(--ss-color-primary);
}

/* 見出し1h3 */
.heading-1-h3,
.entry-content .heading-1-h3,
.editor-styles-wrapper .heading-1-h3 {
  position: relative;
  width: fit-content;
  min-width: min(100%, 340px);
  margin: 2.5rem auto;
  padding: 1.1em 1.6em 0.75em;
  border-top: 2px solid #8BAEF4;
  border-left: 2px solid #8BAEF4;
  border-right: 2px solid #8BAEF4;
  color: var(--ss-color-primary);
  font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(1.45rem, 3vw, 2rem);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.2em;
  text-align: center;
}

@media (max-width: 600px) {
  .heading-1-h3,
  .entry-content .heading-1-h3,
  .editor-styles-wrapper .heading-1-h3 {
    min-width: 100%;
    padding: 1em 1.2em 0.7em;
    font-size: 1.35rem;
    letter-spacing: 0.14em;
  }
}

/* 見出し1h4 */
.heading1-h4,
.entry-content .heading1-h4,
.editor-styles-wrapper .heading1-h4 {
  position: relative;
  display: inline-block;
  padding: 0 48px 14px 0;
  margin: 0 0 24px;
  color: var(--ss-color-primary);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.12em;
  font-family: "Noto Serif JP", "Yu Mincho", "游明朝", serif;
  border-bottom: 1px solid #8BAEF4;
}

.heading1-h4::after,
.entry-content .heading1-h4::after,
.editor-styles-wrapper .heading1-h4::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 36px;
  height: 8px;
  background-color: var(--ss-color-primary);
}

/* 見出し1h5 */
.heading-1-h5,
.entry-content .heading-1-h5,
.editor-styles-wrapper .heading-1-h5 {
  position: relative;
  margin: 0 0 1.2em;
  padding-bottom: 10px;
  color: var(--ss-color-primary);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.18em;
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
}

.heading-1-h5::after,
.entry-content .heading-1-h5::after,
.editor-styles-wrapper .heading-1-h5::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: rgba(2, 50, 108, 0.18);
}

.heading-1-h5::before,
.entry-content .heading-1-h5::before,
.editor-styles-wrapper .heading-1-h5::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
  z-index: 1;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #8BAEF4;
}

@media (max-width: 600px) {
  .heading-1-h5,
  .entry-content .heading-1-h5,
  .editor-styles-wrapper .heading-1-h5 {
    font-size: 16px;
    letter-spacing: 0.14em;
    padding-bottom: 9px;
  }
}

/* 見出し2h2 */
.heading2-h2,
.entry-content .heading2-h2,
.editor-styles-wrapper .heading2-h2 {
  position: relative;
  background: var(--ss-color-primary);
  border-bottom: 6px solid #8BAEF4;
  padding: 26px 40px 28px;
  overflow: hidden;
}

.heading2-h2 h2,
.entry-content .heading2-h2 h2,
.editor-styles-wrapper .heading2-h2 h2 {
  margin: 0;
  color: #ffffff;
  font-size: clamp(1.6rem, 4vw, 2.6rem);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.16em;
  text-align: center;
}

.heading2-h2::before,
.entry-content .heading2-h2::before,
.editor-styles-wrapper .heading2-h2::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 14px;
  width: 1px;
  height: 74px;
  background: rgba(255, 255, 255, 0.85);
  transform: rotate(45deg);
  transform-origin: top center;
}

.heading2-h2::after,
.entry-content .heading2-h2::after,
.editor-styles-wrapper .heading2-h2::after {
  content: "";
  position: absolute;
  right: 18px;
  bottom: -2px;
  width: 1px;
  height: 74px;
  background: rgba(255, 255, 255, 0.85);
  transform: rotate(45deg);
  transform-origin: bottom center;
}

@media (max-width: 600px) {
  .heading2-h2,
  .entry-content .heading2-h2,
  .editor-styles-wrapper .heading2-h2 {
    padding: 22px 24px 24px;
    border-bottom-width: 5px;
  }

  .heading2-h2 h2,
  .entry-content .heading2-h2 h2,
  .editor-styles-wrapper .heading2-h2 h2 {
    font-size: 1.5rem;
    letter-spacing: 0.1em;
  }

  .heading2-h2::before,
  .heading2-h2::after,
  .entry-content .heading2-h2::before,
  .entry-content .heading2-h2::after,
  .editor-styles-wrapper .heading2-h2::before,
  .editor-styles-wrapper .heading2-h2::after {
    height: 58px;
  }
}

/* 見出し2h3 */
.heading2-h3,
.entry-content .heading2-h3,
.editor-styles-wrapper .heading2-h3 {
  --main-color: var(--ss-color-primary);
  --sub-color: #8BAEF4;
  position: relative;
  width: fit-content;
  margin: 40px auto;
  padding: 18px 48px;
  color: var(--main-color);
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(1.35rem, 2.8vw, 2rem);
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: 0.22em;
  text-align: center;
}

.heading2-h3::before,
.entry-content .heading2-h3::before,
.editor-styles-wrapper .heading2-h3::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 110px;
  height: 40px;
  background:
    linear-gradient(var(--sub-color), var(--sub-color)) left top / 54px 2px no-repeat,
    linear-gradient(var(--sub-color), var(--sub-color)) left top / 2px 40px no-repeat,
    repeating-linear-gradient(
      to right,
      var(--sub-color) 0 3px,
      transparent 3px 7px
    ) 62px 0 / 48px 2px no-repeat;
}

.heading2-h3::after,
.entry-content .heading2-h3::after,
.editor-styles-wrapper .heading2-h3::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 110px;
  height: 40px;
  background:
    linear-gradient(var(--sub-color), var(--sub-color)) right bottom / 54px 2px no-repeat,
    linear-gradient(var(--sub-color), var(--sub-color)) right bottom / 2px 40px no-repeat,
    repeating-linear-gradient(
      to right,
      var(--sub-color) 0 3px,
      transparent 3px 7px
    ) 0 bottom / 48px 2px no-repeat;
}

@media (max-width: 600px) {
  .heading2-h3,
  .entry-content .heading2-h3,
  .editor-styles-wrapper .heading2-h3 {
    padding: 16px 36px;
    letter-spacing: 0.16em;
  }

  .heading2-h3::before,
  .heading2-h3::after,
  .entry-content .heading2-h3::before,
  .entry-content .heading2-h3::after,
  .editor-styles-wrapper .heading2-h3::before,
  .editor-styles-wrapper .heading2-h3::after {
    width: 88px;
    height: 34px;
  }

  .heading2-h3::before,
  .entry-content .heading2-h3::before,
  .editor-styles-wrapper .heading2-h3::before {
    background:
      linear-gradient(var(--sub-color), var(--sub-color)) left top / 42px 2px no-repeat,
      linear-gradient(var(--sub-color), var(--sub-color)) left top / 2px 34px no-repeat,
      repeating-linear-gradient(
        to right,
        var(--sub-color) 0 3px,
        transparent 3px 7px
      ) 50px 0 / 38px 2px no-repeat;
  }

  .heading2-h3::after,
  .entry-content .heading2-h3::after,
  .editor-styles-wrapper .heading2-h3::after {
    background:
      linear-gradient(var(--sub-color), var(--sub-color)) right bottom / 42px 2px no-repeat,
      linear-gradient(var(--sub-color), var(--sub-color)) right bottom / 2px 34px no-repeat,
      repeating-linear-gradient(
        to right,
        var(--sub-color) 0 3px,
        transparent 3px 7px
      ) 0 bottom / 38px 2px no-repeat;
  }
}

/* 見出し2h4 */
.heading-2-h4,
.entry-content .heading-2-h4,
.editor-styles-wrapper .heading-2-h4 {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 1.8em 0 1em;
  padding: 0 0 8px;
  color: var(--ss-color-primary);
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.08em;
  border-bottom: 2px solid #8BAEF4;
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
}

.heading-2-h4::before,
.entry-content .heading-2-h4::before,
.editor-styles-wrapper .heading-2-h4::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 1.8em;
  background: #8BAEF4;
  flex-shrink: 0;
}

@media (max-width: 600px) {
  .heading-2-h4,
  .entry-content .heading-2-h4,
  .editor-styles-wrapper .heading-2-h4 {
    font-size: 1.15rem;
    gap: 10px;
    padding-bottom: 7px;
  }

  .heading-2-h4::before,
  .entry-content .heading-2-h4::before,
  .editor-styles-wrapper .heading-2-h4::before {
    width: 4px;
    height: 1.7em;
  }
}

/* 見出し2h5 */
.heading2-h5,
.entry-content .heading2-h5,
.editor-styles-wrapper .heading2-h5 {
  position: relative;
  margin: 1.8em 0 1em;
  padding: 0 0 10px 0;
  color: var(--ss-color-primary);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.08em;
}

.heading2-h5::after,
.entry-content .heading2-h5::after,
.editor-styles-wrapper .heading2-h5::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: rgba(2, 50, 108, 0.25);
}

.heading2-h5::before,
.entry-content .heading2-h5::before,
.editor-styles-wrapper .heading2-h5::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 6px;
  height: 6px;
  background: #8BAEF4;
  z-index: 1;
}

@media (max-width: 768px) {
  .heading2-h5,
  .entry-content .heading2-h5,
  .editor-styles-wrapper .heading2-h5 {
    font-size: 0.95rem;
    letter-spacing: 0.06em;
  }
}

/* 見出し3h2 */
.heading3-h2-block,
.entry-content .heading3-h2-block,
.editor-styles-wrapper .heading3-h2-block {
  position: relative;
  width: 100%;
  max-width: 880px;
  margin: 32px 0;
  padding-right: 22px;
}

.heading3-h2,
.entry-content .heading3-h2,
.editor-styles-wrapper .heading3-h2 {
  position: relative;
  display: block;
  margin: 0;
  padding: 26px 88px 26px 64px;
  color: #fff;
  font-size: clamp(1.7rem, 3.2vw, 3rem);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.16em;
  background: linear-gradient(90deg, var(--ss-color-primary) 0%, var(--ss-color-primary) 68%, #073c7d 100%);
  clip-path: polygon(0 0, 100% 0, calc(100% - 42px) 100%, 0 100%);
  box-sizing: border-box;
  text-align: left;
}

.heading3-h2-block::after,
.entry-content .heading3-h2-block::after,
.editor-styles-wrapper .heading3-h2-block::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 24px;
  height: 100%;
  background: #8BAEF4;
  clip-path: polygon(55% 0, 100% 0, 45% 100%, 0 100%);
  z-index: -1;
}

.heading3-h2-block::before,
.entry-content .heading3-h2-block::before,
.editor-styles-wrapper .heading3-h2-block::before {
  content: "";
  position: absolute;
  top: 0;
  right: 18px;
  width: 10px;
  height: 100%;
  background: #fff;
  clip-path: polygon(55% 0, 100% 0, 45% 100%, 0 100%);
  z-index: -1;
}

@media (max-width: 600px) {
  .heading3-h2-block,
  .entry-content .heading3-h2-block,
  .editor-styles-wrapper .heading3-h2-block {
    padding-right: 16px;
    margin: 24px 0;
  }

  .heading3-h2,
  .entry-content .heading3-h2,
  .editor-styles-wrapper .heading3-h2 {
    padding: 18px 56px 18px 24px;
    letter-spacing: 0.08em;
    clip-path: polygon(0 0, 100% 0, calc(100% - 28px) 100%, 0 100%);
  }

  .heading3-h2-block::after,
  .entry-content .heading3-h2-block::after,
  .editor-styles-wrapper .heading3-h2-block::after {
    width: 18px;
  }

  .heading3-h2-block::before,
  .entry-content .heading3-h2-block::before,
  .editor-styles-wrapper .heading3-h2-block::before {
    right: 13px;
    width: 8px;
  }
}

/* 見出し3h3 */
.heading-3-h3,
.entry-content .heading-3-h3,
.editor-styles-wrapper .heading-3-h3 {
  --main-color: var(--ss-color-primary);
  --sub-color: #8BAEF4;
  margin: 2.5rem 0;
}

.heading-3-h3 h3,
.entry-content .heading-3-h3 h3,
.editor-styles-wrapper .heading-3-h3 h3 {
  position: relative;
  margin: 0;
  padding: 24px 42px;
  color: var(--main-color);
  font-size: clamp(1.35rem, 2.4vw, 1.9rem);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.12em;
  text-align: center;
}

.heading-3-h3 h3::before,
.entry-content .heading-3-h3 h3::before,
.editor-styles-wrapper .heading-3-h3 h3::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 34px;
  height: 34px;
  border-top: 2px solid var(--sub-color);
  border-left: 2px solid var(--sub-color);
}

.heading-3-h3 h3::after,
.entry-content .heading-3-h3 h3::after,
.editor-styles-wrapper .heading-3-h3 h3::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 34px;
  height: 34px;
  border-right: 2px solid var(--sub-color);
  border-bottom: 2px solid var(--sub-color);
}

.heading-3-h3 h3 span,
.entry-content .heading-3-h3 h3 span,
.editor-styles-wrapper .heading-3-h3 h3 span {
  position: relative;
  display: inline-block;
}

.heading-3-h3 h3 span::before,
.entry-content .heading-3-h3 h3 span::before,
.editor-styles-wrapper .heading-3-h3 h3 span::before {
  content: "";
  position: absolute;
  top: -25px;
  left: -72px;
  width: 72px;
  border-top: 2px dotted var(--sub-color);
}

.heading-3-h3 h3 span::after,
.entry-content .heading-3-h3 h3 span::after,
.editor-styles-wrapper .heading-3-h3 h3 span::after {
  content: "";
  position: absolute;
  right: -72px;
  bottom: -25px;
  width: 72px;
  border-bottom: 2px dotted var(--sub-color);
}

@media (max-width: 600px) {
  .heading-3-h3 h3,
  .entry-content .heading-3-h3 h3,
  .editor-styles-wrapper .heading-3-h3 h3 {
    padding: 20px 28px;
    font-size: 1.25rem;
    letter-spacing: 0.08em;
  }

  .heading-3-h3 h3 span::before,
  .entry-content .heading-3-h3 h3 span::before,
  .editor-styles-wrapper .heading-3-h3 h3 span::before {
    left: -46px;
    width: 46px;
  }

  .heading-3-h3 h3 span::after,
  .entry-content .heading-3-h3 h3 span::after,
  .editor-styles-wrapper .heading-3-h3 h3 span::after {
    right: -46px;
    width: 46px;
  }
}

/* 見出し3h4 */
.heading3-h4,
.entry-content .heading3-h4,
.editor-styles-wrapper .heading3-h4 {
  position: relative;
  display: block;
  margin: 2em 0 1em;
  padding: 0.25em 0 0.45em 1.1em;
  border-bottom: 1px solid #8BAEF4;
  color: var(--ss-color-primary);
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.08em;
}

.heading3-h4::before,
.entry-content .heading3-h4::before,
.editor-styles-wrapper .heading3-h4::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.25em;
  width: 4px;
  height: 1.9em;
  background-color: #8BAEF4;
}

/* 見出し3h5 */
.heading-3-h5,
.entry-content .heading-3-h5,
.editor-styles-wrapper .heading-3-h5 {
  position: relative;
  margin: 2em 0 1.2em;
  padding: 0 0 12px;
  color: var(--ss-color-primary);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.12em;
  text-align: center;
}

.heading-3-h5::after,
.entry-content .heading-3-h5::after,
.editor-styles-wrapper .heading-3-h5::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: rgba(2, 50, 108, 0.25);
}

.heading-3-h5::before,
.entry-content .heading-3-h5::before,
.editor-styles-wrapper .heading-3-h5::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 7px;
  height: 7px;
  background: #8BAEF4;
  z-index: 1;
}

/* デザイン見出し1 */
.design-heading-01 {
  --dh01-main: var(--ss-color-primary);
  --dh01-sub: #8BAEF4;
  --dh01-bg: #EEF4FF;

  position: relative;
  display: flex;
  align-items: center;
  gap: 26px;
  width: 100%;
  max-width: 760px;
  padding: 8px 0 14px;
  margin: 32px 0;
  color: var(--dh01-main);
}

/* 左の丸アイコン */
.design-heading-01__icon {
  flex: 0 0 auto;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: var(--dh01-bg);
  display: grid;
  place-items: center;
}

.design-heading-01__icon svg {
  width: 38px;
  height: 38px;
  fill: none;
  stroke: var(--dh01-main);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.design-heading-01__icon img {
  width: 38px;
  height: 38px;
  object-fit: contain;
  display: block;
}

/* テキストエリア */
.design-heading-01__body {
  position: relative;
  flex: 1;
  min-width: 0;
  padding: 0 0 14px 22px;
}

/* 左の縦線 */
.design-heading-01__body::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  bottom: 0;
  width: 1.5px;
  background: var(--dh01-main);
}

/* 下の横線 */
.design-heading-01__body::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1.5px;
  background: var(--dh01-main);
}

/* 縦線上部の丸 */
.design-heading-01::before {
  content: "";
  position: absolute;
  left: 94px;
  top: 7px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--dh01-main);
  z-index: 1;
}

/* 横線右端の丸 */
.design-heading-01::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 12px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--dh01-main);
  z-index: 1;
}

.design-heading-01__label {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.04em;
  color: var(--dh01-sub);
}

.design-heading-01__title {
  margin: 0;
  font-size: clamp(21px, 2.6vw, 30px);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.06em;
  color: var(--dh01-main);
}

/* テーマ本文・ブロックエディター標準の見出し装飾を解除 */
.entry-content .design-heading-01__title,
.editor-styles-wrapper .design-heading-01__title {
  margin: 0;
  padding: 0;
  color: var(--dh01-main);
  background: transparent;
  border: 0;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .design-heading-01 {
    gap: 16px;
    padding: 6px 0 12px;
  }

  .design-heading-01__icon {
    width: 56px;
    height: 56px;
  }

  .design-heading-01__icon svg,
  .design-heading-01__icon img {
    width: 32px;
    height: 32px;
  }

  .design-heading-01__body {
    padding-left: 18px;
    padding-bottom: 12px;
  }

  .design-heading-01::before {
    left: 72px;
    top: 7px;
  }

  .design-heading-01::after {
    bottom: 10px;
  }

  .design-heading-01__label {
    font-size: 12px;
    margin-bottom: 7px;
  }

  .design-heading-01__title {
    font-size: 20px;
    letter-spacing: 0.04em;
  }
}

.design-heading-02 {
  --dh02-navy: var(--ss-color-primary);
  --dh02-blue: #8BAEF4;

  display: flex;
  align-items: flex-start;
  gap: 30px;
  width: 100%;
  max-width: 760px;
  box-sizing: border-box;
  padding: 8px 0;
}

.design-heading-02__ribbon {
  position: relative;
  flex: 0 0 54px;
  width: 54px;
  height: 124px;
  background: linear-gradient(180deg, var(--ss-color-primary) 0%, #00285c 100%);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 86%, 0 100%);
  display: flex;
  justify-content: center;
  padding-top: 25px;
  box-sizing: border-box;
}

.design-heading-02__icon {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #fff;
  color: var(--dh02-navy);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  font-weight: 800;
  line-height: 1;
  font-family: Georgia, "Times New Roman", serif;
}

.design-heading-02__body {
  flex: 1;
  min-width: 0;
  padding-top: 8px;
}

.design-heading-02__label {
  position: relative;
  display: inline-block;
  margin-bottom: 20px;
  padding-bottom: 9px;
  color: var(--dh02-blue);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.32em;
  font-family: Georgia, "Times New Roman", serif;
}

.design-heading-02__label::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 38px;
  height: 2px;
  background: var(--dh02-navy);
}

.design-heading-02__title {
  margin: 0;
  color: var(--dh02-navy);
  font-size: clamp(30px, 4.5vw, 42px);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.18em;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Noto Serif JP", serif;
}

/* テーマ本文・ブロックエディター標準の見出し装飾を解除 */
.entry-content .design-heading-02__title,
.editor-styles-wrapper .design-heading-02__title {
  margin: 0;
  padding: 0;
  color: var(--dh02-navy);
  background: transparent;
  border: 0;
  font-size: clamp(30px, 4.5vw, 42px);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.18em;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Noto Serif JP", serif;
}

.design-heading-02__line {
  display: flex;
  align-items: center;
  width: 100%;
  margin-top: 18px;
}

.design-heading-02__line::before {
  content: "";
  display: block;
  width: clamp(180px, 50%, 260px);
  height: 3px;
  background: var(--dh02-navy);
}

.design-heading-02__line::after {
  content: "";
  display: block;
  flex: 1;
  border-top: 2px dotted var(--dh02-navy);
}

.design-heading-02__text {
  margin: 18px 0 0;
  color: var(--dh02-navy);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.8;
  letter-spacing: 0.08em;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Noto Serif JP", serif;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .design-heading-02 {
    gap: 18px;
  }

  .design-heading-02__ribbon {
    flex-basis: 44px;
    width: 44px;
    height: 106px;
    padding-top: 21px;
  }

  .design-heading-02__icon {
    width: 32px;
    height: 32px;
    font-size: 23px;
  }

  .design-heading-02__label {
    margin-bottom: 16px;
    font-size: 10px;
    letter-spacing: 0.26em;
  }

  .design-heading-02__title,
  .entry-content .design-heading-02__title,
  .editor-styles-wrapper .design-heading-02__title {
    font-size: 28px;
    letter-spacing: 0.1em;
  }

  .design-heading-02__line {
    margin-top: 14px;
  }

  .design-heading-02__line::before {
    width: 45%;
  }

  .design-heading-02__text {
    margin-top: 14px;
    font-size: 13px;
    letter-spacing: 0.04em;
  }
}

.design-heading-03 {
  --dh03-main: var(--ss-color-primary);
  --dh03-sub: #8BAEF4;
  --dh03-light: #EEF5FF;

  position: relative;
  max-width: 720px;
  margin: 40px auto;
  padding: 0 20px;
  text-align: center;
  color: var(--dh03-main);
}

/* 上部：横線＋丸アイコン */
.design-heading-03__icon-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}

.design-heading-03__icon-wrap::before,
.design-heading-03__icon-wrap::after {
  content: "";
  width: 82px;
  height: 1px;
  background: var(--dh03-main);
}

.design-heading-03__icon-wrap::before {
  margin-right: 18px;
}

.design-heading-03__icon-wrap::after {
  margin-left: 18px;
}

.design-heading-03__icon {
  position: relative;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: var(--dh03-light);
}

/* アイコン上の小さな飾り線 */
.design-heading-03__icon::before,
.design-heading-03__icon::after {
  content: "";
  position: absolute;
  top: -13px;
  left: 50%;
  width: 1px;
  height: 8px;
  background: var(--dh03-sub);
  transform-origin: bottom center;
}

.design-heading-03__icon::before {
  transform: translateX(-9px) rotate(-20deg);
}

.design-heading-03__icon::after {
  transform: translateX(9px) rotate(20deg);
}

.design-heading-03__icon-wrap {
  background:
    linear-gradient(var(--dh03-sub), var(--dh03-sub))
    center 0 / 1px 8px no-repeat;
}

.design-heading-03__icon svg,
.design-heading-03__image {
  width: 34px;
  height: 34px;
}

.design-heading-03__icon svg {
  fill: none;
  stroke: var(--dh03-main);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.design-heading-03__image {
  display: block;
  object-fit: contain;
}

/* 英字ラベル */
.design-heading-03__sub {
  margin: 0 0 7px;
  color: var(--dh03-sub);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.18em;
}

/* メインタイトル */
.design-heading-03__title {
  margin: 0;
  color: var(--dh03-main);
  font-family: "Times New Roman", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(24px, 4vw, 32px);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.16em;
}

/* テーマ本文・ブロックエディター標準の段落/見出し装飾を解除 */
.entry-content .design-heading-03__sub,
.editor-styles-wrapper .design-heading-03__sub {
  margin: 0 0 7px;
  color: var(--dh03-sub);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.18em;
}

.entry-content .design-heading-03__title,
.editor-styles-wrapper .design-heading-03__title {
  margin: 0;
  padding: 0;
  color: var(--dh03-main);
  background: transparent;
  border: 0;
  font-family: "Times New Roman", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(24px, 4vw, 32px);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.16em;
}

/* 下部の線・点・中央ダイヤ */
.design-heading-03__bottom {
  position: relative;
  width: min(100%, 560px);
  height: 18px;
  margin: 10px auto 0;
}

.design-heading-03__bottom::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--dh03-main);
  transform: translateY(-50%);
}

.design-heading-03__bottom::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 9px;
  height: 9px;
  background: #fff;
  border: 1.5px solid var(--dh03-sub);
  transform: translate(-50%, -50%) rotate(45deg);
  z-index: 2;
}

.design-heading-03::before,
.design-heading-03::after {
  content: "";
  position: absolute;
  bottom: 8px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--dh03-main);
}

.design-heading-03::before {
  left: calc(50% - 280px);
}

.design-heading-03::after {
  right: calc(50% - 280px);
}

/* スマホ調整 */
@media (max-width: 600px) {
  .design-heading-03 {
    margin: 32px auto;
    padding: 0 16px;
  }

  .design-heading-03__icon-wrap::before,
  .design-heading-03__icon-wrap::after {
    width: 64px;
  }

  .design-heading-03__icon {
    width: 54px;
    height: 54px;
  }

  .design-heading-03__icon svg,
  .design-heading-03__image {
    width: 31px;
    height: 31px;
  }

  .design-heading-03__title,
  .entry-content .design-heading-03__title,
  .editor-styles-wrapper .design-heading-03__title {
    letter-spacing: 0.12em;
  }

  .design-heading-03::before {
    left: 16px;
  }

  .design-heading-03::after {
    right: 16px;
  }
}

/* デザイン見出し4 */
.design-heading-04 {
  --main-color: var(--ss-color-primary);
  --sub-color: #8BAEF4;

  position: relative;
  display: inline-block;
  padding: 10px 0 10px 34px;
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
}

/* 左の濃い縦ライン */
.design-heading-04::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 6px;
  height: calc(100% - 16px);
  background: var(--main-color);
}

/* 左の細いサブライン */
.design-heading-04::after {
  content: "";
  position: absolute;
  left: 10px;
  top: 8px;
  width: 2px;
  height: calc(100% - 16px);
  background: var(--sub-color);
}

/* 英字ラベル */
.design-heading-04__label {
  display: block;
  margin-bottom: 5px;
  color: var(--sub-color);
  font-family: "Montserrat", "Arial", sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.28em;
  line-height: 1;
}

/* 日本語見出し */
.design-heading-04__title {
  position: relative;
  margin: 0;
  padding: 0 4px 11px 0;
  color: var(--main-color);
  font-size: clamp(24px, 4vw, 34px);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.18em;
}

/* テーマ本文・ブロックエディター標準の見出し装飾を解除 */
.entry-content .design-heading-04__title,
.editor-styles-wrapper .design-heading-04__title {
  position: relative;
  margin: 0;
  padding: 0 4px 11px 0;
  color: var(--main-color);
  background: transparent;
  border: 0;
  font-size: clamp(24px, 4vw, 34px);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.18em;
}

/* ドット下線 */
.design-heading-04__title::after {
  content: "";
  position: absolute;
  left: -2px;
  right: -8px;
  bottom: 0;
  height: 2px;
  background-image: radial-gradient(var(--sub-color) 1px, transparent 1.5px);
  background-size: 8px 2px;
  background-repeat: repeat-x;
}

/* デザイン見出し5 */
.design-heading-5 {
  --dh5-main: var(--ss-color-primary);
  --dh5-sub: #8BAEF4;

  width: 100%;
  max-width: 760px;
  margin: 40px auto;
  padding: 0 16px;
  text-align: center;
  box-sizing: border-box;
}

.design-heading-5__label-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  margin-bottom: 18px;
}

.design-heading-5__line {
  width: 52px;
  height: 2px;
  background: var(--dh5-sub);
  border-radius: 999px;
}

.design-heading-5__label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 18px;
  color: var(--dh5-main);
  background: #fff;
  border: 1px solid rgba(139, 174, 244, 0.35);
  border-radius: 999px;
  box-shadow:
    0 4px 14px rgba(139, 174, 244, 0.28),
    inset 0 0 10px rgba(139, 174, 244, 0.16);
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.04em;
}

.design-heading-5__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  color: var(--dh5-main);
  font-size: 18px;
  line-height: 1;
}

.design-heading-5__icon .officepro-box-icon {
  width: 18px;
  height: 18px;
  background-size: contain;
}

.design-heading-5__label-text {
  color: var(--dh5-main);
}

.design-heading-5__title {
  margin: 0;
  color: var(--dh5-main);
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(26px, 4vw, 40px);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.08em;
}

.entry-content .design-heading-5__title,
.editor-styles-wrapper .design-heading-5__title {
  margin: 0;
  padding: 0;
  color: var(--dh5-main);
  background: transparent;
  border: 0;
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(26px, 4vw, 40px);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.08em;
}

.design-heading-5__bottom-line {
  position: relative;
  width: 100%;
  height: 14px;
  margin-top: 16px;
  border-top: 2px solid var(--dh5-main);
  border-bottom: 2px solid var(--dh5-main);
  box-sizing: border-box;
}

.design-heading-5__bottom-line::before {
  content: "";
  position: absolute;
  top: -2px;
  left: 50%;
  width: 18px;
  height: 18px;
  background: #fff;
  border-right: 2px solid var(--dh5-main);
  border-bottom: 2px solid var(--dh5-main);
  transform: translateX(-50%) rotate(45deg);
  transform-origin: center;
}

.design-heading-5__bottom-line::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 50%;
  width: 34px;
  height: 8px;
  background: #fff;
  transform: translateX(-50%);
}

@media (max-width: 600px) {
  .design-heading-5 {
    margin: 32px auto;
    padding: 0 12px;
  }

  .design-heading-5__label-wrap {
    gap: 14px;
    margin-bottom: 14px;
  }

  .design-heading-5__line {
    width: 36px;
  }

  .design-heading-5__label {
    padding: 7px 14px;
    font-size: 13px;
  }

  .design-heading-5__title,
  .entry-content .design-heading-5__title,
  .editor-styles-wrapper .design-heading-5__title {
    font-size: clamp(22px, 7vw, 30px);
    letter-spacing: 0.05em;
  }
}

.table-block-01 {
  width: 100%;
  margin: 2em 0;
  padding: 10px;
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(2, 50, 108, 0.12);
  box-sizing: border-box;
}

.table-block-01__inner {
  width: 100%;
  overflow-x: auto;
  border-radius: 8px;
}

.table-block-01 table {
  width: 100%;
  min-width: 520px;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 14px;
  line-height: 1.6;
  color: #1f2a44;
  background: #ffffff;
}

.table-block-01 thead th {
  padding: 10px 16px;
  background: var(--ss-color-primary);
  color: #ffffff;
  font-weight: 700;
  text-align: left;
  border: 1px solid #16437c;
}

.table-block-01 thead th:first-child {
  width: 28%;
}

.table-block-01 tbody th,
.table-block-01 tbody td {
  padding: 11px 16px;
  border: 1px solid #e4eaf4;
  vertical-align: middle;
}

.table-block-01 tbody th {
  background: #f2f6fc;
  color: var(--ss-color-primary);
  font-weight: 700;
  text-align: left;
}

.table-block-01 tbody td {
  background: #ffffff;
  color: #263247;
}

@media (max-width: 600px) {
  .table-block-01 {
    padding: 8px;
    border-radius: 12px;
  }

  .table-block-01 table {
    min-width: 460px;
    font-size: 13px;
  }

  .table-block-01 thead th,
  .table-block-01 tbody th,
  .table-block-01 tbody td {
    padding: 9px 12px;
  }
}

/* テーブルブロック2 */
.table-block-02 {
  --tb02-main: var(--ss-color-primary);
  --tb02-border: #e3e9f2;
  --tb02-label-bg: #f3f7fc;
  --tb02-text: #333;
  --tb02-muted: #4b5563;

  width: 100%;
  max-width: 720px;
  margin: 32px auto;
  border: 1px solid var(--tb02-border);
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 2px 6px rgba(2, 50, 108, 0.08);
}

.table-block-02__title {
  padding: 13px 16px;
  background: var(--tb02-main);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  letter-spacing: 0.08em;
}

.table-block-02__table {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 14px;
  color: var(--tb02-text);
}

.table-block-02__table th,
.table-block-02__table td {
  padding: 16px 20px;
  border-bottom: 1px solid var(--tb02-border);
  line-height: 1.7;
  vertical-align: middle;
}

.table-block-02__table tr:last-child th,
.table-block-02__table tr:last-child td {
  border-bottom: none;
}

.table-block-02__table th {
  width: 24%;
  background: var(--tb02-label-bg);
  color: var(--tb02-main);
  font-weight: 700;
  text-align: center;
  letter-spacing: 0.04em;
}

.table-block-02__table td {
  background: #fff;
  color: var(--tb02-muted);
  font-weight: 500;
}

/* スマホ対応 */
@media (max-width: 600px) {
  .table-block-02 {
    margin: 24px auto;
  }

  .table-block-02__title {
    padding: 12px 14px;
    font-size: 14px;
  }

  .table-block-02__table {
    font-size: 13px;
  }

  .table-block-02__table th,
  .table-block-02__table td {
    padding: 13px 12px;
  }

  .table-block-02__table th {
    width: 30%;
  }
}

/* テーブルブロック3 */
.tb3-table-wrap {
  width: 100%;
  max-width: 640px;
  margin: 32px auto;
}

.tb3-table {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
  font-size: 15px;
  line-height: 1.7;
  color: #333;
}

.tb3-table th,
.tb3-table td {
  padding: 14px 22px;
  border-bottom: 1px solid #b8c7da;
  vertical-align: middle;
}

.tb3-table tr:first-child th,
.tb3-table tr:first-child td {
  border-top: 1px solid #b8c7da;
}

.tb3-table th {
  width: 28%;
  color: var(--ss-color-primary);
  font-weight: 700;
  text-align: left;
  white-space: nowrap;
  border-right: 1px solid #b8c7da;
}

.tb3-table td {
  width: 72%;
  font-weight: 500;
}

/* スマホ対応 */
@media (max-width: 600px) {
  .tb3-table {
    font-size: 14px;
  }

  .tb3-table th,
  .tb3-table td {
    padding: 12px 14px;
  }

  .tb3-table th {
    width: 32%;
  }

  .tb3-table td {
    width: 68%;
  }
}

/* テーブルブロック4 */
.tb4-card {
  max-width: 760px;
  margin: 32px auto;
  padding: 22px;
  background: #ffffff;
  border-radius: 24px;
  box-shadow: 0 14px 34px rgba(2, 50, 108, 0.14);
}

.tb4-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border: 1px solid #dbe6f5;
  border-radius: 18px;
  font-size: 15px;
  line-height: 1.7;
  color: #263448;
}

.tb4-table tr:last-child th,
.tb4-table tr:last-child td {
  border-bottom: none;
}

.tb4-table th,
.tb4-table td {
  padding: 18px 26px;
  border-bottom: 1px solid #e4ecf7;
  vertical-align: middle;
}

.tb4-table th {
  width: 36%;
  background: linear-gradient(90deg, #eef5ff 0%, #e9f2ff 100%);
  color: var(--ss-color-primary);
  font-weight: 700;
  text-align: left;
  white-space: nowrap;
}

.tb4-table td {
  width: 64%;
  background: #ffffff;
  font-weight: 600;
  letter-spacing: 0.03em;
}

.tb4-table th .tb4-icon {
  margin-right: 16px;
  vertical-align: middle;
}

.tb4-table th span:not(.tb4-icon) {
  vertical-align: middle;
}

.tb4-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  color: var(--ss-color-primary);
}

.tb4-icon svg,
.tb4-icon .officepro-box-icon {
  width: 26px;
  height: 26px;
}

.tb4-icon svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .tb4-card {
    padding: 14px;
    border-radius: 20px;
  }

  .tb4-table {
    font-size: 14px;
    border-radius: 16px;
  }

  .tb4-table th,
  .tb4-table td {
    padding: 14px 16px;
  }

  .tb4-table th {
    width: 42%;
  }

  .tb4-table td {
    width: 58%;
  }

  .tb4-table th .tb4-icon {
    margin-right: 10px;
  }

  .tb4-icon,
  .tb4-icon svg,
  .tb4-icon .officepro-box-icon {
    width: 22px;
    height: 22px;
  }
}

/* テーブルブロック5 */
.tb5-info-table {
  width: 100%;
  max-width: 760px;
  margin: 32px auto;
  padding: 16px 24px;
  background: #fff;
  border: 1px solid #e4e8ef;
  border-radius: 8px;
  box-shadow: 0 3px 12px rgba(2, 50, 108, 0.08);
  box-sizing: border-box;
  font-family: inherit;
}

.tb5-info-row {
  display: grid;
  grid-template-columns: 48px 92px 1px 1fr;
  align-items: center;
  column-gap: 24px;
  min-height: 76px;
  border-bottom: 1px solid #e6eaf0;
}

.tb5-info-row:last-child {
  border-bottom: none;
}

.tb5-icon {
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #eef4ff;
  border-radius: 50%;
  color: var(--ss-color-primary);
  font-size: 22px;
  line-height: 1;
  box-shadow: inset 0 0 0 1px rgba(139, 174, 244, 0.25);
}

.tb5-icon span {
  display: block;
  transform: scale(0.95);
}

.tb5-label {
  color: #2f6fc7;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.08em;
  white-space: nowrap;
}

.tb5-divider {
  width: 2px;
  height: 44px;
  background: #b8cdf8;
  border-radius: 999px;
}

.tb5-content {
  color: #333842;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.8;
  letter-spacing: 0.04em;
}

/* スマホ対応 */
@media (max-width: 600px) {
  .tb5-info-table {
    padding: 10px 16px;
    margin: 24px auto;
  }

  .tb5-info-row {
    grid-template-columns: 42px 72px 1px 1fr;
    column-gap: 14px;
    min-height: 68px;
  }

  .tb5-icon {
    width: 36px;
    height: 36px;
    font-size: 18px;
  }

  .tb5-label {
    font-size: 14px;
    letter-spacing: 0.04em;
  }

  .tb5-divider {
    height: 38px;
  }

  .tb5-content {
    font-size: 14px;
    line-height: 1.7;
    letter-spacing: 0.02em;
  }

  .tb5-pc-only {
    display: none;
  }
}

/* リスト1 */
.list-01 {
  list-style: none;
  margin: 0;
  padding: 0;
}

.list-01 li {
  position: relative;
  padding-left: 24px;
  color: #333333;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.03em;
}

.list-01 li + li {
  margin-top: 14px;
}

.list-01 li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.9em;
  width: 7px;
  height: 7px;
  background-color: #8BAEF4;
  border-radius: 50%;
  transform: translateY(-50%);
}

/* スマホ調整 */
@media (max-width: 600px) {
  .list-01 li {
    font-size: 14px;
    padding-left: 22px;
  }

  .list-01 li + li {
    margin-top: 12px;
  }
}

/* リスト2 */
.c-list-02 {
  --list-main-color: #6ea2ff;
  --list-text-color: #333333;

  list-style: none;
  margin: 0;
  padding: 0;
}

.c-list-02 li {
  position: relative;
  padding-left: 28px;
  margin: 0 0 22px;
  color: var(--list-text-color);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.04em;
}

.c-list-02 li:last-child {
  margin-bottom: 0;
}

.c-list-02 li::before {
  content: "";
  position: absolute;
  top: 0.55em;
  left: 0;
  width: 12px;
  height: 12px;
  border: 2px solid var(--list-main-color);
  border-radius: 50%;
  background-color: #ffffff;
  box-sizing: border-box;
}

/* リスト3 */
.list-block-3 {
  list-style: none;
  margin: 0;
  padding: 0;
}

.list-block-3 li {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 22px;
  color: #333;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.7;
  letter-spacing: 0.04em;
}

.list-block-3 li:last-child {
  margin-bottom: 0;
}

.list-block-3 li::before {
  content: "";
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  background: #75a7f6;
  transform: rotate(45deg);
  border-radius: 1px;
}

/* リスト4 */
.original-list-4 {
  list-style: none;
  margin: 0;
  padding: 0;
}

.original-list-4 li {
  position: relative;
  display: flex;
  align-items: center;
  gap: 13px;
  margin: 0 0 18px;
  color: #333;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.7;
  letter-spacing: 0.03em;
}

.original-list-4 li:last-child {
  margin-bottom: 0;
}

.original-list-4 li::before {
  content: "";
  display: block;
  flex: 0 0 auto;
  width: 8px;
  height: 13px;
  border-radius: 2px;
  background: linear-gradient(180deg, #8BAEF4 0%, #5F8FEA 100%);
}

/* リスト5 */
.list-block-5 {
  --list5-blue: #73a8ff;
  --list5-text: #333333;

  width: 100%;
  max-width: 420px;
}

.list-block-5__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.list-block-5__item {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 22px;
  color: var(--list5-text);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: 0.04em;
}

.list-block-5__item:last-child {
  margin-bottom: 0;
}

.list-block-5__icon {
  position: relative;
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--list5-blue);
}

.list-block-5__icon::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 48%;
  width: 8px;
  height: 5px;
  border-left: 2px solid #ffffff;
  border-bottom: 2px solid #ffffff;
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* スマホ調整 */
@media (max-width: 600px) {
  .list-block-5__item {
    gap: 10px;
    margin-bottom: 18px;
    font-size: 14px;
  }

  .list-block-5__icon {
    width: 20px;
    height: 20px;
  }

  .list-block-5__icon::before {
    width: 7px;
    height: 4px;
  }
}

/* 数字付きリスト1 */
.number-list-01 {
  --main-color: var(--ss-color-primary);
  --line-color: #8baef4;
  --text-color: #333333;

  list-style: none;
  counter-reset: number-list;
  margin: 0;
  padding: 0;
  max-width: 520px;
}

.number-list-01 li {
  counter-increment: number-list;
  position: relative;
  display: flex;
  align-items: center;
  min-height: 52px;
  padding: 0 0 0 56px;
  color: var(--text-color);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.03em;
}

.number-list-01 li::before {
  content: counter(number-list);
  position: absolute;
  left: 0;
  top: 50%;
  width: 32px;
  height: 32px;
  transform: translateY(-50%);
  border-radius: 50%;
  background: var(--main-color);
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  line-height: 32px;
  text-align: center;
}

.number-list-01 li:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 48px;
  right: 0;
  bottom: 0;
  border-bottom: 2px dotted rgba(139, 174, 244, 0.7);
}

@media (max-width: 600px) {
  .number-list-01 li {
    min-height: 50px;
    padding-left: 50px;
    font-size: 14px;
  }

  .number-list-01 li::before {
    width: 30px;
    height: 30px;
    font-size: 15px;
    line-height: 30px;
  }

  .number-list-01 li:not(:last-child)::after {
    left: 44px;
  }
}

/* 数字付きリスト2 */
.number-list-02 {
  counter-reset: number-list-02;
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: 520px;
}

.number-list-02 li {
  counter-increment: number-list-02;
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 0 0 14px;
  margin-bottom: 14px;
  border-bottom: 2px dotted #b8cef4;
  color: #333;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.6;
}

.number-list-02 li:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.number-list-02 li::before {
  content: counter(number-list-02);
  flex: 0 0 auto;
  width: 44px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-left: 11px;
  box-sizing: border-box;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  background: linear-gradient(135deg, #72a6f7 0%, #8bb8ff 100%);
  clip-path: polygon(0 0, 72% 0, 100% 50%, 72% 100%, 0 100%);
}

/* 数字付きリスト3 */
.number-list-03 {
  counter-reset: number-list;
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: 520px;
}

.number-list-03 li {
  counter-increment: number-list;
  position: relative;
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 58px;
  padding: 0 0 0 0;
  color: #333;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.7;
}

.number-list-03 li::before {
  content: counter(number-list);
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  color: #1e6bd6;
  font-size: 18px;
  font-weight: 700;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.14);
}

.number-list-03 li:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 60px;
  right: 0;
  bottom: 0;
  height: 2px;
  background-image: radial-gradient(circle, #b9d4f2 1.4px, transparent 1.4px);
  background-size: 7px 2px;
  background-repeat: repeat-x;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .number-list-03 li {
    gap: 14px;
    min-height: 54px;
    font-size: 15px;
  }

  .number-list-03 li::before {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
    font-size: 16px;
  }

  .number-list-03 li:not(:last-child)::after {
    left: 52px;
  }
}

/* 数字付きリスト4 */
.num-list-04 {
  counter-reset: num-list-04;
  max-width: 420px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.num-list-04 li {
  counter-increment: num-list-04;
  display: grid;
  grid-template-columns: 28px 2px 1fr;
  column-gap: 14px;
  align-items: center;
  position: relative;
  margin: 0 0 14px;
  padding: 0 0 14px;
}

/* 数字 */
.num-list-04 li::before {
  content: counter(num-list-04);
  grid-column: 1;
  grid-row: 1;
  color: var(--ss-color-primary);
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
}

/* 縦ライン */
.num-list-04 li::after {
  content: "";
  grid-column: 2;
  grid-row: 1;
  width: 2px;
  height: 22px;
  background: #8BAEF4;
  align-self: center;
  justify-self: center;
}

/* テキスト */
.num-list-04__text {
  grid-column: 3;
  grid-row: 1;
  display: block;
  position: relative;
  color: #333333;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.7;
  letter-spacing: 0.03em;
}

/* 点線の区切り線 */
.num-list-04 li:not(:last-child) .num-list-04__text::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -14px;
  border-bottom: 2px dotted #B9CBEF;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .num-list-04 {
    max-width: 100%;
  }

  .num-list-04 li {
    grid-template-columns: 24px 2px 1fr;
    column-gap: 10px;
  }

  .num-list-04 li::before {
    font-size: 16px;
  }

  .num-list-04__text {
    font-size: 14px;
  }
}

/* デザインリスト1 */
.design-list1 {
  --dl1-main: var(--ss-color-primary);
  --dl1-sub: #8baef4;
  --dl1-light: #edf3ff;
  --dl1-line: #d7e3f8;
  --dl1-text: #4f5f78;

  width: 100%;
  background: #fff;
  padding: 24px 0;
}

.design-list1 *,
.design-list1 *::before,
.design-list1 *::after {
  box-sizing: border-box;
}

.design-list1__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  list-style: none;
  margin: 0;
  padding: 0;
}

.design-list1__item {
  position: relative;
  min-height: 150px;
}

.design-list1__item + .design-list1__item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 100%;
  background: linear-gradient(
    to bottom,
    transparent 0%,
    var(--dl1-line) 8%,
    var(--dl1-line) 92%,
    transparent 100%
  );
}

.design-list1__link {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  padding: 4px 24px 0;
  color: inherit;
  text-align: center;
  text-decoration: none;
  transition: opacity 0.25s ease;
}

.design-list1__link:hover {
  opacity: 0.78;
}

.design-list1__icon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  margin-bottom: 14px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #f7faff 0%, #dfe8ff 100%);
  box-shadow: inset 0 0 0 1px rgba(139, 174, 244, 0.18);
}

.design-list1__icon svg {
  width: 27px;
  height: 27px;
  fill: none;
  stroke: var(--dl1-main);
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.design-list1__title {
  display: block;
  margin-bottom: 11px;
  color: var(--dl1-main);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.04em;
}

.design-list1__text {
  display: block;
  min-height: 58px;
  color: var(--dl1-text);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.9;
  letter-spacing: 0.03em;
}

.design-list1__arrow {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  margin-top: 13px;
  border: 1px solid var(--dl1-line);
  border-radius: 50%;
  background: #f7faff;
  color: var(--dl1-main);
  font-size: 14px;
  line-height: 1;
  transition: transform 0.25s ease, background-color 0.25s ease;
}

.design-list1__link:hover .design-list1__arrow {
  transform: translateX(3px);
  background: var(--dl1-light);
}

/* タブレット */
@media (max-width: 900px) {
  .design-list1__list {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 32px;
  }

  .design-list1__item:nth-child(odd)::before {
    display: none;
  }

  .design-list1__item:nth-child(even)::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
    background: linear-gradient(
      to bottom,
      transparent 0%,
      var(--dl1-line) 8%,
      var(--dl1-line) 92%,
      transparent 100%
    );
  }
}

/* スマホ */
@media (max-width: 560px) {
  .design-list1 {
    padding: 16px 0;
  }

  .design-list1__list {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .design-list1__item {
    min-height: auto;
  }

  .design-list1__item::before,
  .design-list1__item + .design-list1__item::before {
    display: none;
  }

  .design-list1__item + .design-list1__item {
    border-top: 1px solid var(--dl1-line);
  }

  .design-list1__link {
    padding: 26px 20px;
  }

  .design-list1__text {
    min-height: auto;
  }
}

/* デザインリスト2 */
.design-list2 {
  --design-list2-main: var(--ss-color-primary);
  --design-list2-border: #dce3ef;
  --design-list2-text: #5d6b82;
  --design-list2-bg: #ffffff;

  width: 100%;
  margin: 32px 0;
}

.design-list2__items {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.design-list2__item {
  min-width: 0;
}

.design-list2__card {
  min-height: 148px;
  padding: 16px 10px 12px;
  border: 1px solid var(--design-list2-border);
  border-radius: 7px;
  background: var(--design-list2-bg);
  color: var(--design-list2-main);
  text-decoration: none;
  box-shadow: 0 1px 4px rgba(2, 50, 108, 0.06);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.design-list2__card:hover {
  transform: translateY(-2px);
  border-color: var(--design-list2-main);
  box-shadow: 0 6px 16px rgba(2, 50, 108, 0.12);
}

.design-list2__icon {
  width: 36px;
  height: 36px;
  margin-bottom: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.design-list2__icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.design-list2__title {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.04em;
}

.design-list2__text {
  display: block;
  margin-bottom: 10px;
  color: var(--design-list2-text);
  font-size: 10.5px;
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.03em;
}

.design-list2__arrow {
  position: relative;
  width: 18px;
  height: 18px;
  margin-top: auto;
  border: 1.5px solid var(--design-list2-main);
  border-radius: 50%;
  display: inline-block;
}

.design-list2__arrow::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 47%;
  width: 5px;
  height: 5px;
  border-top: 1.5px solid var(--design-list2-main);
  border-right: 1.5px solid var(--design-list2-main);
  transform: translate(-50%, -50%) rotate(45deg);
}

/* タブレット */
@media (max-width: 900px) {
  .design-list2__items {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* スマホ */
@media (max-width: 600px) {
  .design-list2__items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .design-list2__card {
    min-height: 145px;
    padding: 15px 8px 12px;
  }

  .design-list2__title {
    font-size: 13px;
  }

  .design-list2__text {
    font-size: 10px;
  }
}

/* かなり狭い画面 */
@media (max-width: 380px) {
  .design-list2__items {
    grid-template-columns: 1fr;
  }
}


.design-list3 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  width: 100%;
  margin: 0 auto;
}

.design-list3__item,
.design-list3__item:visited {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 100%;
  text-decoration: none;
  color: var(--ss-color-primary) !important;
  background: #eef5ff;
  border-radius: 8px;
  box-shadow: 0 4px 14px rgba(2, 50, 108, 0.12);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.design-list3__item:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 22px rgba(2, 50, 108, 0.18);
}

.design-list3__image {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #dbe8fb;
}

.design-list3__image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(139, 174, 244, 0.18);
  pointer-events: none;
}

.design-list3__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.95) contrast(0.95) brightness(1.05);
  transition: transform 0.35s ease;
}

.design-list3__item:hover .design-list3__image img {
  transform: scale(1.04);
}

.design-list3__body {
  position: relative;
  flex: 1;
  padding: 13px 14px 30px;
  background: #eef5ff;
}

.design-list3__title {
  margin: 0 0 7px;
  color: var(--ss-color-primary) !important;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0.02em;
}

.design-list3__text {
  margin: 0;
  color: var(--ss-color-primary) !important;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: 0.03em;
}

.design-list3__arrow {
  position: absolute;
  right: 13px;
  bottom: 10px;
  color: var(--ss-color-primary) !important;
  font-size: 17px;
  font-weight: 700;
  line-height: 1;
  transition: transform 0.25s ease;
}

.design-list3__item:hover .design-list3__arrow {
  transform: translateX(3px);
}

@media (max-width: 900px) {
  .design-list3 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 520px) {
  .design-list3 {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .design-list3__body {
    padding: 14px 15px 32px;
  }

  .design-list3__title {
    font-size: 16px;
  }

  .design-list3__text {
    font-size: 13px;
  }
}


.design-list4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  width: 100%;
  margin: 32px 0;
}

.design-list4__item {
  overflow: hidden;
  background: #fff;
  border: 1px solid #d9e0ec;
  border-radius: 7px;
  box-shadow: 0 2px 8px rgba(2, 50, 108, 0.08);
}

.design-list4__image {
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #d0d0d0;
}

.design-list4__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.design-list4__body {
  padding: 15px 10px 14px;
  text-align: center;
}

.design-list4 .design-list4__title {
  margin: 0 0 10px !important;
  color: #1f5f9f !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: 0.03em;
  background: none !important;
  border: none !important;
}

.design-list4 .design-list4__text {
  margin: 0;
  color: #2f3f55;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.9;
  letter-spacing: 0.02em;
}

.design-list4 .design-list4__line {
  display: block;
  width: 32px;
  height: 3px;
  margin: 14px auto 0;
  background-color: #1f5f9f !important;
  border-radius: 999px;
}

@media (max-width: 900px) {
  .design-list4 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 560px) {
  .design-list4 {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .design-list4 .design-list4__title {
    font-size: 16px !important;
  }

  .design-list4 .design-list4__text {
    font-size: 13px;
  }
}

.design-list5 {
  --dl5-main: var(--ss-color-primary);
  --dl5-blue: #8baef4;
  --dl5-border: #dfe7f4;
  --dl5-text: #4a5568;
  --dl5-bg: #ffffff;

  width: 100%;
  margin: 32px 0;
}

.design-list5__list {
  counter-reset: design-list5-counter;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.design-list5__item {
  counter-increment: design-list5-counter;
  position: relative;
  min-height: 154px;
  padding: 20px 18px 18px;
  background: var(--dl5-bg);
  border: 1px solid var(--dl5-border);
  border-radius: 10px;
  box-shadow: 0 3px 10px rgba(2, 50, 108, 0.06);
  text-align: center;
}

.design-list5__item:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -13px;
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--dl5-main);
  border-right: 2px solid var(--dl5-main);
  transform: translateY(-50%) rotate(45deg);
  z-index: 2;
}

.design-list5__head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 12px;
}

.design-list5__number::before {
  content: counter(design-list5-counter, decimal-leading-zero);
  display: inline-block;
  font-size: 36px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 0.03em;
  color: var(--dl5-blue);
}

.design-list5__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  color: var(--dl5-main);
}

.design-list5__icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.design-list5__title {
  margin: 0 0 10px;
  color: var(--dl5-main);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
}

.design-list5__text {
  margin: 0;
  color: var(--dl5-text);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.8;
}

/* タブレット */
@media (max-width: 900px) {
  .design-list5__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
  }

  .design-list5__item:not(:last-child)::after {
    display: none;
  }
}

/* スマホ */
@media (max-width: 600px) {
  .design-list5__list {
    grid-template-columns: 1fr;
  }

  .design-list5__item {
    min-height: auto;
    padding: 22px 18px;
  }

  .design-list5__number::before {
    font-size: 34px;
  }

  .design-list5__text br {
    display: none;
  }
}

/* デザインリスト6 */

.design-list6 {
  counter-reset: design-list6-counter;
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 8px;
  font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "MS PMincho", serif;
}

.design-list6 li {
  counter-increment: design-list6-counter;
  position: relative;
  display: flex;
  align-items: stretch;
  min-height: 54px;
  background: #f8fbff;
  border: 1px solid #c6d9f2;
  border-radius: 5px;
  overflow: hidden;
}

.design-list6 li::before {
  content: counter(design-list6-counter, decimal-leading-zero);
  width: 74px;
  flex: 0 0 74px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--ss-color-primary);
  color: #ffffff;
  font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "MS PMincho", serif;
  font-size: 23px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.05em;
  clip-path: polygon(9px 0, 100% 0, 100% 100%, 0 100%);
}

.design-list6__body {
  display: grid;
  grid-template-columns: 150px 1fr;
  align-items: center;
  width: 100%;
  padding: 0 22px 0 26px;
}

.design-list6__title {
  color: var(--ss-color-primary);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.04em;
  padding-right: 18px;
  white-space: nowrap;
}

.design-list6__text {
  color: #334155;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.7;
  padding-left: 20px;
  border-left: 1px solid #cbd7e6;
}

@media (max-width: 640px) {
  .design-list6 {
    gap: 10px;
  }

  .design-list6 li {
    min-height: auto;
  }

  .design-list6 li::before {
    width: 58px;
    flex-basis: 58px;
    font-size: 20px;
  }

  .design-list6__body {
    grid-template-columns: 1fr;
    gap: 4px;
    padding: 12px 14px;
  }

  .design-list6__title {
    font-size: 15px;
    padding-right: 0;
    white-space: normal;
  }

  .design-list6__text {
    font-size: 13px;
    padding-left: 0;
    border-left: none;
  }
}


.design-list7 {
  position: relative;
  max-width: 780px;
  margin: 32px auto;
  padding: 18px 22px 18px 34px;
  background: #ffffff;
  border: 1px solid #d8e7ff;
  border-radius: 6px;
  box-sizing: border-box;
}

.design-list7::before {
  content: "";
  position: absolute;
  top: 18px;
  bottom: 18px;
  left: 12px;
  width: 4px;
  background: #8baef4;
  border-radius: 999px;
}

.design-list7-item {
  display: grid;
  grid-template-columns: 160px 1px 1fr;
  column-gap: 26px;
  align-items: center;
  padding: 15px 0;
  box-sizing: border-box;
}

.design-list7-item + .design-list7-item {
  border-top: 1px dashed #d4e3fb;
}

.design-list7-label {
  grid-column: 1;
  width: 160px;
  height: 52px;
  padding: 1px;
  background: #8baef4;
  clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 50%, calc(100% - 22px) 100%, 0 100%);
  box-sizing: border-box;
}

.design-list7-label span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding-right: 14px;
  background: #f8fbff;
  color: var(--ss-color-primary);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.08em;
  clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 50%, calc(100% - 22px) 100%, 0 100%);
  box-sizing: border-box;
}

.design-list7-divider {
  grid-column: 2;
  width: 1px;
  height: 52px;
  background-image: linear-gradient(to bottom, #c6daf9 0, #c6daf9 4px, transparent 4px, transparent 8px);
  background-size: 1px 8px;
}

.design-list7-text {
  grid-column: 3;
  color: #222222;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.9;
  letter-spacing: 0.05em;
  text-align: left;
}

@media (max-width: 600px) {
  .design-list7 {
    padding: 18px 18px 18px 28px;
  }

  .design-list7-item {
    grid-template-columns: 1fr;
    row-gap: 12px;
    padding: 18px 0;
  }

  .design-list7-label {
    grid-column: 1;
    width: 150px;
    height: 48px;
  }

  .design-list7-label span {
    font-size: 15px;
  }

  .design-list7-divider {
    display: none;
  }

  .design-list7-text {
    grid-column: 1;
    font-size: 14px;
    line-height: 1.8;
  }
}

.design-list8 {
  --list8-main: var(--ss-color-primary);
  --list8-blue: #4f78d8;
  --list8-light: #d9e4fb;
  --list8-text: #333333;

  max-width: 760px;
  margin: 32px auto;
  padding: 0;
  font-family: inherit;
}

.design-list8__list {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 左側の縦ライン */
.design-list8__list::before {
  content: "";
  position: absolute;
  top: 8px;
  bottom: 22px;
  left: 8px;
  width: 1px;
  background: var(--list8-blue);
}

.design-list8__item {
  position: relative;
  padding-left: 48px;
}

/* 丸アイコン */
.design-list8__item::before {
  content: "";
  position: absolute;
  top: 7px;
  left: 1px;
  width: 12px;
  height: 12px;
  background: #ffffff;
  border: 2px solid var(--list8-blue);
  border-radius: 50%;
  z-index: 1;
}

/* 丸から見出しへ伸びる横ライン */
.design-list8__item::after {
  content: "";
  position: absolute;
  top: 15px;
  left: 19px;
  width: 20px;
  height: 1px;
  background: var(--list8-blue);
}

.design-list8__content {
  padding: 0 0 17px;
  margin-bottom: 18px;
  border-bottom: 1px dashed var(--list8-light);
}

.design-list8__item:last-child .design-list8__content {
  margin-bottom: 0;
  border-bottom: none;
}

.design-list8__title {
  margin: 0 0 6px;
  color: var(--list8-main);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.12em;
}

.design-list8__text {
  margin: 0;
  color: var(--list8-text);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.04em;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .design-list8 {
    margin: 24px auto;
  }

  .design-list8__item {
    padding-left: 40px;
  }

  .design-list8__item::after {
    width: 14px;
  }

  .design-list8__title {
    font-size: 16px;
    letter-spacing: 0.08em;
  }

  .design-list8__text {
    font-size: 13px;
    line-height: 1.7;
  }
}

/* デザインリスト9 */
.design-list9 {
  --list9-main: var(--ss-color-primary);
  --list9-blue: #8baef4;
  --list9-border: #dbe5f4;
  --list9-text: #333b48;
  --list9-bg: #ffffff;

  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 14px;
}

.design-list9__item {
  display: flex;
  align-items: center;
  gap: 24px;
  min-height: 68px;
  padding: 10px 28px 10px 16px;
  background:
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  border: 1px solid var(--list9-border);
  border-radius: 999px;
  box-shadow:
    0 8px 18px rgba(2, 50, 108, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.design-list9__icon {
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 30%, #ffffff 0%, #eaf2ff 72%, #dbe8ff 100%);
  border: 1px solid #b9cdf2;
  box-shadow:
    0 3px 8px rgba(2, 50, 108, 0.12),
    inset 0 0 0 3px rgba(255, 255, 255, 0.65);
}

.design-list9__icon svg {
  width: 27px;
  height: 27px;
  fill: none;
  stroke: var(--list9-main);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.design-list9__text {
  color: var(--list9-text);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.8;
  letter-spacing: 0.04em;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .design-list9 {
    gap: 12px;
  }

  .design-list9__item {
    gap: 14px;
    min-height: 62px;
    padding: 10px 16px 10px 12px;
    border-radius: 28px;
  }

  .design-list9__icon {
    width: 42px;
    height: 42px;
  }

  .design-list9__icon svg {
    width: 24px;
    height: 24px;
  }

  .design-list9__text {
    font-size: 14px;
    line-height: 1.7;
  }
}

/* デザインリスト10 */
.design-list10 {
  position: relative;
  max-width: 760px;
  margin: 32px auto;
  padding: 14px 22px;
  list-style: none;
  background: #fff;
  border: 1.5px solid #8baef4;
  border-radius: 10px;
  box-sizing: border-box;
}

/* 下中央の吹き出し風の三角 */
.design-list10::before,
.design-list10::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
}

.design-list10::before {
  bottom: -13px;
  border-left: 13px solid transparent;
  border-right: 13px solid transparent;
  border-top: 13px solid #8baef4;
}

.design-list10::after {
  bottom: -11px;
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  border-top: 11px solid #fff;
}

.design-list10__item {
  margin: 0;
  padding: 0;
}

.design-list10__item:not(:last-child) {
  border-bottom: 1px dashed #c8d7f7;
}

.design-list10__link {
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 62px;
  padding: 8px 4px;
  color: inherit;
  text-decoration: none;
  box-sizing: border-box;
}

.design-list10__badge {
  position: relative;
  flex: 0 0 52px;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.02em;
  background: linear-gradient(135deg, #5c8ee8 0%, #1f4fa5 100%);
  border-radius: 50%;
  box-shadow: 0 2px 5px rgba(2, 50, 108, 0.18);
}

/* Qアイコンの小さなしっぽ */
.design-list10__badge::after {
  content: "";
  position: absolute;
  left: 5px;
  bottom: 4px;
  width: 13px;
  height: 13px;
  background: #2b5fbd;
  clip-path: polygon(0 100%, 100% 18%, 72% 100%);
}

.design-list10__body {
  flex: 1;
  min-width: 0;
}

.design-list10__title {
  display: block;
  margin-bottom: 7px;
  color: var(--ss-color-primary);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.04em;
}

.design-list10__text {
  display: block;
  color: #4f5f78;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.03em;
}

.design-list10__arrow {
  position: relative;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  margin-left: 8px;
}

.design-list10__arrow::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 4px;
  width: 9px;
  height: 9px;
  border-top: 2px solid #2f61b8;
  border-right: 2px solid #2f61b8;
  transform: translateY(-50%) rotate(45deg);
}

.design-list10__link:hover .design-list10__title {
  color: #1f5fbd;
}

.design-list10__link:hover .design-list10__arrow::before {
  right: 1px;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .design-list10 {
    padding: 10px 14px;
  }

  .design-list10__link {
    gap: 12px;
    min-height: 68px;
    padding: 10px 2px;
  }

  .design-list10__badge {
    flex-basis: 44px;
    width: 44px;
    height: 44px;
    font-size: 15px;
  }

  .design-list10__title {
    font-size: 14px;
  }

  .design-list10__text {
    font-size: 12px;
  }

  .design-list10__arrow {
    flex-basis: 14px;
    width: 14px;
  }
}

/* デザインリスト11：FAQ風アコーディオン */

.design-list11 {
  --dl11-main: var(--ss-color-primary);
  --dl11-sub: #8baef4;
  --dl11-border: #cddcf5;
  --dl11-bg: #ffffff;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 36px;
  max-width: 960px;
  margin: 0 auto;
  align-items: start;
}

.design-list11__item {
  align-self: start;
  background: var(--dl11-bg);
  border: 1px solid var(--dl11-border);
  border-radius: 999px;
  box-shadow: 0 2px 5px rgba(2, 50, 108, 0.04);
  overflow: hidden;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, border-radius 0.2s ease;
}

.design-list11__item[open] {
  border-radius: 22px;
  border-color: var(--dl11-sub);
  box-shadow: 0 6px 16px rgba(2, 50, 108, 0.08);
}

.design-list11__question {
  position: relative;
  display: flex;
  align-items: center;
  gap: 13px;
  min-height: 58px;
  padding: 12px 52px 12px 30px;
  color: var(--dl11-main);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  cursor: pointer;
  list-style: none;
}

.design-list11__question::-webkit-details-marker {
  display: none;
}

.design-list11__q {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: var(--dl11-main);
  font-family: Georgia, "Times New Roman", "Yu Mincho", serif;
  font-size: 25px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  transform: none;
}

.design-list11__text {
  flex: 1;
}

.design-list11__question::after {
  content: "+";
  position: absolute;
  right: 30px;
  top: 50%;
  color: var(--dl11-main);
  font-size: 24px;
  font-weight: 400;
  line-height: 1;
  transform: translateY(-50%);
}

.design-list11__item[open] .design-list11__question::after {
  content: "\2212";
}

.design-list11__answer {
  padding: 0 30px 28px 67px;
  color: #1f2f46;
  font-size: 15px;
  line-height: 2;
}

.design-list11__answer p {
  margin: 0;
  padding: 22px 0 0;
  border-top: 1px solid #dbe7fb;
}

.design-list11__item:hover {
  border-color: var(--dl11-sub);
  box-shadow: 0 5px 14px rgba(2, 50, 108, 0.08);
}

@media (max-width: 767px) {
  .design-list11 {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .design-list11__question {
    min-height: 52px;
    padding: 10px 46px 10px 22px;
    font-size: 14px;
  }

  .design-list11__question::after {
    right: 22px;
  }

  .design-list11__q {
    width: 22px;
    height: 22px;
    font-size: 23px;
  }

  .design-list11__answer {
    padding: 0 22px 22px 57px;
    font-size: 14px;
  }
}

.design-list1__icon .officepro-box-icon,
.design-list2__icon .officepro-box-icon,
.design-list5__icon .officepro-box-icon,
.design-list9__icon .officepro-box-icon {
  width: 100%;
  height: 100%;
  flex: 0 0 100%;
}


.flow-design-1 {
  --fd1-main: var(--ss-color-primary);
  --fd1-line: #4867a8;
  --fd1-bg: #ffffff;
  --fd1-text: #24385f;

  width: 100%;
  margin: 32px 0;
}

.flow-design-1 .fd1-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 34px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.flow-design-1 .fd1-item {
  position: relative;
  min-height: 228px;
  padding: 50px 18px 24px;
  background: var(--fd1-bg);
  border: 1.8px solid var(--fd1-line);
  border-radius: 12px;
  text-align: center;
  color: var(--fd1-main);
  box-sizing: border-box;
}

.flow-design-1 .fd1-item::before {
  content: "";
  position: absolute;
  inset: 7px;
  border-radius: 9px;
  pointer-events: none;
  background:
    linear-gradient(var(--fd1-line), var(--fd1-line)) left top / 20px 1.8px no-repeat,
    linear-gradient(var(--fd1-line), var(--fd1-line)) left top / 1.8px 20px no-repeat,
    linear-gradient(var(--fd1-line), var(--fd1-line)) right top / 20px 1.8px no-repeat,
    linear-gradient(var(--fd1-line), var(--fd1-line)) right top / 1.8px 20px no-repeat,
    linear-gradient(var(--fd1-line), var(--fd1-line)) left bottom / 20px 1.8px no-repeat,
    linear-gradient(var(--fd1-line), var(--fd1-line)) left bottom / 1.8px 20px no-repeat,
    linear-gradient(var(--fd1-line), var(--fd1-line)) right bottom / 20px 1.8px no-repeat,
    linear-gradient(var(--fd1-line), var(--fd1-line)) right bottom / 1.8px 20px no-repeat;
}

.flow-design-1 .fd1-item:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -23px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 9px solid var(--fd1-main);
}

.flow-design-1 .fd1-number {
  position: absolute;
  top: -21px;
  left: 50%;
  z-index: 2;
  transform: translateX(-50%);
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--fd1-main);
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  line-height: 1;
}

.flow-design-1 .fd1-icon {
  width: 48px;
  height: 54px;
  margin: 0 auto 12px;
  color: var(--fd1-main);
}

.flow-design-1 .fd1-icon svg {
  display: block;
  width: 100%;
  height: 100%;
  transform: scaleY(1.08);
  transform-origin: center;
}

.flow-design-1 .fd1-icon svg * {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.flow-design-1 .fd1-title {
  margin: 0 0 8px;
  color: var(--fd1-main);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.35;
}

.flow-design-1 .fd1-text {
  margin: 0;
  color: var(--fd1-text);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.75;
}

@media (max-width: 900px) {
  .flow-design-1 .fd1-list {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 42px;
  }

  .flow-design-1 .fd1-item:nth-child(2)::after {
    display: none;
  }
}

@media (max-width: 600px) {
  .flow-design-1 .fd1-list {
    grid-template-columns: 1fr;
    gap: 44px;
  }

  .flow-design-1 .fd1-item {
    min-height: auto;
    padding: 52px 20px 26px;
  }

  .flow-design-1 .fd1-item:not(:last-child)::after {
    display: block;
    top: auto;
    right: auto;
    bottom: -28px;
    left: 50%;
    transform: translateX(-50%) rotate(90deg);
  }

  .flow-design-1 .fd1-icon {
    width: 50px;
    height: 56px;
  }

  .flow-design-1 .fd1-title {
    font-size: 21px;
  }

  .flow-design-1 .fd1-text {
    font-size: 15px;
  }
}


.flow-design2 {
  --flow2-main: var(--ss-color-primary);
  --flow2-sub: #6fa8ff;
  --flow2-border: #c9d8ef;
  --flow2-line: #d5e0f0;
  --flow2-bg: #ffffff;

  display: grid;
  grid-template-columns: repeat(4, 1fr);
  max-width: 900px;
  margin: 40px auto;
  background: var(--flow2-bg);
  border: 1px solid var(--flow2-border);
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(2, 50, 108, 0.06);
  overflow: hidden;
  font-family: "Noto Sans JP", "Yu Gothic", "YuGothic", sans-serif;
  color: var(--flow2-main);
}

.flow-design2__step {
  position: relative;
  min-width: 0;
}

.flow-design2__step:nth-child(4n + 1) {
  z-index: 4;
}

.flow-design2__step:nth-child(4n + 2) {
  z-index: 3;
}

.flow-design2__step:nth-child(4n + 3) {
  z-index: 2;
}

.flow-design2__step:nth-child(4n) {
  z-index: 1;
}

.flow-design2__num {
  position: relative;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--flow2-main);
  color: #ffffff;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1;
}

.flow-design2__step.is-current .flow-design2__num {
  background: var(--flow2-sub);
}

.flow-design2__step:not(:nth-child(4n)) .flow-design2__num::before {
  content: "";
  position: absolute;
  top: 0;
  right: -24px;
  width: 0;
  height: 0;
  border-top: 19px solid transparent;
  border-bottom: 19px solid transparent;
  border-left: 24px solid #ffffff;
  z-index: 3;
}

.flow-design2__step:not(:nth-child(4n)) .flow-design2__num::after {
  content: "";
  position: absolute;
  top: 0;
  right: -20px;
  width: 0;
  height: 0;
  border-top: 19px solid transparent;
  border-bottom: 19px solid transparent;
  border-left: 20px solid var(--flow2-main);
  z-index: 4;
}

.flow-design2__step.is-current:not(:nth-child(4n)) .flow-design2__num::after {
  border-left-color: var(--flow2-sub);
}

.flow-design2__content {
  position: relative;
  min-height: 165px;
  padding: 26px 18px 24px;
  text-align: center;
  background: #ffffff;
}

.flow-design2__step:not(:nth-child(4n + 1)) .flow-design2__content::before {
  content: "";
  position: absolute;
  top: 22px;
  left: 0;
  width: 1px;
  height: calc(100% - 44px);
  background: var(--flow2-line);
}

.flow-design2__icon {
  width: 52px;
  height: 52px;
  margin: 0 auto 10px;
  color: var(--flow2-main);
}

.flow-design2__icon svg {
  width: 100%;
  height: 100%;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.flow-design2__title {
  margin: 0 0 8px;
  color: var(--flow2-main) !important;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.04em;
}

.flow-design2__text {
  margin: 0;
  color: var(--flow2-main) !important;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.75;
}

.flow-design2 h3,
.flow-design2 p {
  color: var(--flow2-main) !important;
}

@media (max-width: 700px) {
  .flow-design2 {
    grid-template-columns: repeat(2, 1fr);
    margin: 32px auto;
  }

  .flow-design2__step:nth-child(4n + 1),
  .flow-design2__step:nth-child(4n + 2),
  .flow-design2__step:nth-child(4n + 3),
  .flow-design2__step:nth-child(4n) {
    z-index: auto;
  }

  .flow-design2__step:nth-child(2n + 1) {
    z-index: 2;
  }

  .flow-design2__step:nth-child(2n) {
    z-index: 1;
  }

  .flow-design2__num {
    height: 36px;
    font-size: 17px;
  }

  .flow-design2__step:not(:nth-child(4n)) .flow-design2__num::before,
  .flow-design2__step:not(:nth-child(4n)) .flow-design2__num::after {
    display: none;
  }

  .flow-design2__content {
    min-height: 150px;
    padding: 22px 14px;
  }

  .flow-design2__step:not(:nth-child(4n + 1)) .flow-design2__content::before {
    display: none;
  }

  .flow-design2__step:nth-child(2n) .flow-design2__content::before {
    content: "";
    display: block;
    position: absolute;
    top: 20px;
    left: 0;
    width: 1px;
    height: calc(100% - 40px);
    background: var(--flow2-line);
  }

  .flow-design2__icon {
    width: 48px;
    height: 48px;
  }

  .flow-design2__title {
    font-size: 17px;
  }

  .flow-design2__text {
    font-size: 13px;
  }
}


.fd3-flow {
  --fd3-main: var(--ss-color-primary);
  --fd3-sub: #8baef4;
  --fd3-line: #b9c9ea;
  --fd3-text: #20385f;

  width: 100%;
  max-width: 980px;
  margin: 40px auto;
  padding: 0 16px;
  box-sizing: border-box;
}

.fd3-flow__list {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.fd3-flow__list::before {
  content: "";
  position: absolute;
  top: 26px;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--fd3-line);
  z-index: 0;
}

.fd3-flow__item {
  position: relative;
  text-align: center;
  padding: 0 18px;
  box-sizing: border-box;
}

.fd3-flow__item:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 78px;
  right: 0;
  width: 1px;
  height: 74px;
  background: var(--fd3-line);
}

.fd3-flow__check {
  position: relative;
  z-index: 1;
  display: inline-block;
  width: 52px;
  height: 52px;
  margin: 0 auto 20px;
  border: 4px solid var(--fd3-main);
  border-radius: 50%;
  background: #fff;
  box-sizing: border-box;
}

.fd3-flow__check::before {
  content: "";
  position: absolute;
  left: 15px;
  top: 13px;
  width: 16px;
  height: 9px;
  border-left: 4px solid var(--fd3-main);
  border-bottom: 4px solid var(--fd3-main);
  transform: rotate(-45deg);
  border-radius: 1px;
}

.fd3-flow__content {
  padding-top: 0;
}

.fd3-flow .fd3-flow__title {
  margin: 0 0 10px !important;
  padding: 0 !important;
  color: var(--fd3-main) !important;
  background: none !important;
  border: none !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: 0.04em;
  text-align: center;
}

.fd3-flow__text {
  margin: 0;
  color: var(--fd3-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.8;
  letter-spacing: 0.03em;
}

@media (max-width: 900px) {
  .fd3-flow__item {
    padding: 0 12px;
  }

  .fd3-flow .fd3-flow__title {
    font-size: 16px !important;
  }

  .fd3-flow__text {
    font-size: 12px;
  }
}

@media (max-width: 600px) {
  .fd3-flow {
    max-width: 520px;
    margin: 32px auto;
    padding: 0 20px;
  }

  .fd3-flow__list {
    display: block;
  }

  .fd3-flow__list::before {
    top: 0;
    left: 25px;
    right: auto;
    width: 2px;
    height: 100%;
  }

  .fd3-flow__item {
    display: grid;
    grid-template-columns: 52px 1fr;
    column-gap: 16px;
    text-align: left;
    padding: 0 0 28px;
  }

  .fd3-flow__item:not(:last-child)::after {
    display: none;
  }

  .fd3-flow__check {
    margin: 0;
  }

  .fd3-flow .fd3-flow__title {
    margin-bottom: 6px !important;
    font-size: 16px !important;
    text-align: left;
  }

  .fd3-flow__text {
    font-size: 13px;
  }

  .fd3-flow__text br {
    display: none;
  }
}


.flow-design4 {
  --fd4-main: var(--ss-color-primary);
  --fd4-sub: #8baef4;
  --fd4-line: #b9cffb;
  --fd4-text: #1f2f4d;

  width: 100%;
  max-width: 980px;
  margin: 48px auto;
  padding: 0 16px;
  box-sizing: border-box;
  font-family: inherit;
}

.flow-design4__list {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.flow-design4__item {
  position: relative;
  flex: 1;
  text-align: center;
}

.flow-design4__item:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 34px;
  left: calc(50% + 34px);
  width: calc(100% + 24px - 68px);
  height: 1px;
  background: var(--fd4-line);
  z-index: 0;
}

.flow-design4__num {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  margin: 0 auto 38px;
  border: 2px solid var(--fd4-sub);
  border-radius: 50%;
  background: #fff;
  color: var(--fd4-main);
  font-size: 21px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.05em;
  box-sizing: border-box;
}

.flow-design4__icon {
  width: 50px;
  height: 50px;
  margin: 0 auto 18px;
  color: var(--fd4-main);
}

.flow-design4__icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.flow-design4__item h3 {
  margin: 0 0 12px;
  color: var(--fd4-main) !important;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.04em;
}

.flow-design4__item p {
  margin: 0;
  color: var(--fd4-text);
  font-size: 13px;
  line-height: 1.9;
}

@media (max-width: 767px) {
  .flow-design4 {
    margin: 36px auto;
  }

  .flow-design4__list {
    flex-direction: column;
    gap: 30px;
  }

  .flow-design4__item {
    display: grid;
    grid-template-columns: 64px 1fr;
    column-gap: 18px;
    text-align: left;
  }

  .flow-design4__item:not(:last-child)::after {
    top: 64px;
    left: 32px;
    width: 1px;
    height: calc(100% + 30px - 64px);
  }

  .flow-design4__num {
    grid-row: 1 / 4;
    width: 64px;
    height: 64px;
    margin: 0;
    font-size: 20px;
  }

  .flow-design4__icon {
    width: 42px;
    height: 42px;
    margin: 2px 0 10px;
  }

  .flow-design4__item h3 {
    margin-bottom: 6px;
    color: var(--fd4-main) !important;
    font-size: 18px;
  }

  .flow-design4__item p {
    font-size: 13px;
  }

  .flow-design4__item p br {
    display: none;
  }
}

.flow-design5 {
  --fd5-main: var(--ss-color-primary);
  --fd5-sub: #8BAEF4;
  --fd5-line: #c9d7ee;
  --fd5-text: #1f3763;
  --fd5-muted: #6f7f9d;

  width: 100%;
  max-width: 760px;
  margin: 0 auto;
  background: #fff;
}

.flow-design5__list {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0;
}

.flow-design5__list::before {
  content: "";
  position: absolute;
  top: 20px;
  bottom: 20px;
  left: 20px;
  width: 2px;
  background: var(--fd5-main);
}

.flow-design5__item {
  position: relative;
  display: grid;
  grid-template-columns: 42px 22px 54px 1fr;
  align-items: center;
  gap: 16px;
  min-height: 82px;
}

.flow-design5__item:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 150px;
  right: 0;
  bottom: 0;
  border-bottom: 1px dashed var(--fd5-line);
}

.flow-design5__number {
  position: relative;
  z-index: 1;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--fd5-main);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.03em;
}

.flow-design5__dot {
  width: 8px;
  height: 8px;
  border: 2px solid var(--fd5-main);
  border-radius: 50%;
  background: #fff;
  box-sizing: border-box;
}

.flow-design5__icon {
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.flow-design5__icon svg {
  width: 42px;
  height: 42px;
  fill: none;
  stroke: var(--fd5-main);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.flow-design5__body {
  display: flex;
  align-items: baseline;
  gap: 22px;
  min-width: 0;
}

.flow-design5__title {
  flex: 0 0 auto;
  margin: 0;
  color: var(--fd5-main);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.flow-design5__text {
  margin: 0;
  color: var(--fd5-muted);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.8;
}

/* スマホ調整 */
@media (max-width: 600px) {
  .flow-design5__list::before {
    left: 18px;
  }

  .flow-design5__item {
    grid-template-columns: 38px 14px 42px 1fr;
    gap: 10px;
    min-height: 86px;
  }

  .flow-design5__item:not(:last-child)::after {
    left: 112px;
  }

  .flow-design5__number {
    width: 38px;
    height: 38px;
    font-size: 13px;
  }

  .flow-design5__dot {
    width: 7px;
    height: 7px;
  }

  .flow-design5__icon {
    width: 40px;
    height: 40px;
  }

  .flow-design5__icon svg {
    width: 36px;
    height: 36px;
  }

  .flow-design5__body {
    display: block;
  }

  .flow-design5__title {
    font-size: 15px;
    line-height: 1.5;
  }

  .flow-design5__text {
    margin-top: 2px;
    font-size: 12px;
    line-height: 1.6;
  }
}

.flow-design-1 .fd1-icon .officepro-box-icon,
.flow-design2__icon .officepro-box-icon,
.flow-design4__icon .officepro-box-icon,
.flow-design5__icon .officepro-box-icon {
  width: 100%;
  height: 100%;
}


.compare-table1 {
  --ct1-navy: var(--ss-color-primary);
  --ct1-blue: #4f8df7;
  --ct1-light-blue: #f3f8ff;
  --ct1-border: #d9e2ef;
  --ct1-text: var(--ss-color-primary);
  width: 100%;
  margin: 40px 0;
  color: var(--ct1-text);
  font-family: inherit;
}

.compare-table1__inner {
  width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  padding: 0 0 12px;
}

.compare-table1 table {
  width: 100%;
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  background: #fff;
  border: 1px solid var(--ct1-border);
  border-radius: 16px;
  box-shadow: 0 10px 28px rgba(2, 50, 108, 0.10);
  overflow: hidden;
}

.compare-table1 th,
.compare-table1 td {
  padding: 17px 18px;
  text-align: center;
  vertical-align: middle;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ct1-navy);
  border-bottom: 1px solid var(--ct1-border);
  border-right: 1px solid var(--ct1-border);
  background: #fff;
}

.compare-table1 thead th {
  height: 118px;
  padding: 22px 16px;
  background: #fff;
}

.compare-table1 tbody th {
  width: 26%;
  text-align: center;
  background: #fbfcff;
}

.compare-table1 tr:last-child th,
.compare-table1 tr:last-child td {
  border-bottom: none;
}

.compare-table1 th:last-child,
.compare-table1 td:last-child {
  border-right: none;
}

.compare-table1__label-head {
  background: #fbfcff !important;
}

.compare-table1__plan-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 72px;
  padding: 14px 12px;
  background: #fff;
  border: 1px solid var(--ct1-border);
  border-radius: 12px;
  box-shadow: 0 6px 16px rgba(2, 50, 108, 0.12);
}

.compare-table1__plan-name {
  display: block;
  margin-bottom: 6px;
  color: var(--ct1-navy);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.compare-table1__price {
  display: block;
  color: var(--ct1-navy);
  font-size: 12px;
  font-weight: 700;
}

.compare-table1__price strong {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.01em;
}

.compare-table1__recommend {
  position: relative;
  background: linear-gradient(180deg, #f8fbff 0%, var(--ct1-light-blue) 100%) !important;
  border-left: 2px solid var(--ct1-blue) !important;
  border-right: 2px solid var(--ct1-blue) !important;
}

.compare-table1 thead .compare-table1__recommend {
  padding-top: 34px;
  border-top: 2px solid var(--ct1-blue) !important;
}

.compare-table1 thead .compare-table1__recommend::before {
  content: "";
  position: absolute;
  top: 0;
  left: -2px;
  right: -2px;
  height: 2px;
  background: var(--ct1-blue);
}

.compare-table1__recommend--bottom {
  border-bottom: 2px solid var(--ct1-blue) !important;
}

.compare-table1__badge {
  position: absolute;
  top: 8px;
  left: 50%;
  z-index: 3;
  transform: translateX(-50%);
  min-width: 94px;
  padding: 5px 14px;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  text-align: center;
  background: var(--ct1-blue);
  border-radius: 999px;
  box-shadow: 0 4px 12px rgba(79, 141, 247, 0.35);
}

.compare-table1__plan-card--recommend {
  border-color: rgba(79, 141, 247, 0.35);
  box-shadow: 0 8px 22px rgba(79, 141, 247, 0.20);
}

.compare-table1 td.compare-table1__recommend {
  font-weight: 800;
  color: #1557c0;
}

@media (max-width: 767px) {
  .compare-table1 { margin: 32px 0; }
  .compare-table1__inner { overflow-x: auto; overflow-y: visible; padding: 0 0 12px; }
  .compare-table1 table { min-width: 720px; border-radius: 14px; }
  .compare-table1 thead th { height: 112px; padding: 20px 12px; }
  .compare-table1 thead .compare-table1__recommend { padding-top: 32px; }
  .compare-table1 th,
  .compare-table1 td { padding: 14px 12px; font-size: 13px; }
  .compare-table1__plan-card { min-height: 68px; padding: 12px 10px; }
  .compare-table1__price strong { font-size: 18px; }
  .compare-table1__badge { top: 7px; font-size: 11px; padding: 5px 12px; }
}

.compare2-block {
  --compare2-navy: var(--ss-color-primary);
  --compare2-blue: #1f73e8;
  --compare2-light-blue: #eaf3ff;
  --compare2-border: #dce5f2;
  --compare2-text: #1e3765;
  width: 100%;
  margin: 32px 0;
  font-family: inherit;
}

.compare2-scroll {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0 0 10px;
}

.compare2-table {
  width: 100%;
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0;
  color: var(--compare2-text);
  background: #fff;
  border: 1px solid var(--compare2-border);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(2, 50, 108, 0.08);
}

.compare2-table th,
.compare2-table td {
  padding: 18px 18px;
  border-right: 1px solid var(--compare2-border);
  border-bottom: 1px solid var(--compare2-border);
  font-size: 14px;
  line-height: 1.6;
  vertical-align: middle;
}

.compare2-table tr:last-child th,
.compare2-table tr:last-child td { border-bottom: none; }
.compare2-table th:last-child,
.compare2-table td:last-child { border-right: none; }

.compare2-table thead th {
  height: 92px;
  padding: 18px 18px;
  text-align: center !important;
  vertical-align: middle;
}

.compare2-head {
  position: relative;
  font-weight: 700;
  background: #fff;
  color: var(--compare2-navy);
  text-align: center !important;
}

.compare2-label-head {
  width: 24%;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-align: center !important;
}

.compare2-plan,
.compare2-price {
  display: block;
  width: 100%;
  text-align: center !important;
}

.compare2-plan {
  margin-bottom: 4px;
  font-size: 13px;
  font-weight: 700;
  color: var(--compare2-navy);
}

.compare2-price {
  font-size: 16px;
  font-weight: 800;
  color: var(--compare2-navy);
}

.compare2-head.compare2-recommend {
  padding-top: 36px;
  border-top: 1.5px solid #7db2ff;
  box-shadow: inset 0 0 0 1px rgba(31, 115, 232, 0.08);
}

.compare2-badge {
  position: absolute;
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 82px;
  height: 24px;
  padding: 0 14px;
  border-radius: 999px;
  background: var(--compare2-blue);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.04em;
  box-shadow: 0 4px 10px rgba(31, 115, 232, 0.28);
  z-index: 2;
}

.compare2-table tbody th {
  width: 24%;
  text-align: left;
  font-weight: 700;
  color: var(--compare2-navy);
  background: #fff;
  white-space: nowrap;
}

.compare2-table td {
  text-align: center;
  font-weight: 700;
  color: var(--compare2-navy);
  background: #fff;
}

.compare2-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  margin-right: 10px;
  border: 1.5px solid #8baef4;
  border-radius: 5px;
  color: var(--compare2-navy);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  background: #f7fbff;
  vertical-align: middle;
}

.compare2-icon .officepro-box-icon,
.compare2-icon svg {
  width: 100%;
  height: 100%;
}

.compare2-recommend {
  background: var(--compare2-light-blue) !important;
  border-left: 1.5px solid #9bc4ff !important;
  border-right: 1.5px solid #9bc4ff !important;
}

@media (max-width: 768px) {
  .compare2-block { margin: 24px 0; }
  .compare2-table { min-width: 720px; border-radius: 14px; }
  .compare2-table th,
  .compare2-table td { padding: 16px 14px; font-size: 13px; }
  .compare2-table thead th { height: 88px; padding: 16px 14px; }
  .compare2-head.compare2-recommend { padding-top: 34px; }
  .compare2-price { font-size: 15px; }
  .compare2-badge { top: 7px; height: 22px; font-size: 10px; }
}

.compare-table3-wrap {
  --ct3-navy: var(--ss-color-primary);
  --ct3-blue: #2f6fd3;
  --ct3-line: #c9d8ee;
  --ct3-light: #f3f8ff;
  --ct3-text: #26364a;
  width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  padding: 18px 0 14px;
}

.compare-table3-svg { display: none; }

.compare-table3 {
  width: 100%;
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0;
  color: var(--ct3-text);
  font-size: 14px;
  line-height: 1.7;
  text-align: center;
}

.compare-table3 th,
.compare-table3 td {
  padding: 17px 18px;
  border-bottom: 1px solid var(--ct3-line);
  background: #fff;
  vertical-align: middle;
}

.compare-table3 thead th {
  color: var(--ct3-navy);
  font-size: 19px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-align: center !important;
  vertical-align: middle;
  padding-top: 25px;
  padding-bottom: 25px;
}

.compare-table3 thead th:first-child {
  width: 21%;
  border-right: 1px solid var(--ct3-line);
}

.compare-table3 tbody th {
  width: 21%;
  color: var(--ct3-navy);
  font-weight: 700;
  text-align: left;
  border-right: 1px solid var(--ct3-line);
}

.compare-table3 tbody td {
  width: 26.333%;
  font-weight: 600;
  text-align: center;
}

.compare-table3-row-title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
}

.compare-table3-row-title svg,
.compare-table3-row-title .officepro-box-icon {
  width: 21px;
  height: 21px;
  color: var(--ct3-navy);
  flex: 0 0 auto;
  stroke-width: 2.4;
}

.compare-table3-featured {
  color: var(--ct3-navy);
  background: linear-gradient(180deg, #f7fbff 0%, #eef6ff 100%) !important;
  border-left: 1px solid #9bbbe8;
  border-right: 1px solid #9bbbe8;
  font-weight: 700;
}

.compare-table3-featured strong {
  font-size: 16px;
  font-weight: 800;
}

.compare-table3-featured-head {
  position: relative;
  padding-top: 34px !important;
  border-top: 1px solid #9bbbe8;
  border-radius: 8px 8px 0 0;
  font-size: 21px !important;
  text-align: center !important;
}

.compare-table3-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 64px;
  height: 24px;
  padding: 0 12px;
  color: #fff;
  background: var(--ct3-blue);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.04em;
  box-shadow: 0 3px 8px rgba(47, 111, 211, 0.22);
}

.compare-table3-featured-bottom {
  border-bottom: 1px solid #9bbbe8 !important;
  border-radius: 0 0 8px 8px;
}

.compare-table3 tbody tr:last-child th,
.compare-table3 tbody tr:last-child td { border-bottom: none; }

@media (max-width: 767px) {
  .compare-table3-wrap { padding-top: 18px; padding-bottom: 10px; }
  .compare-table3 { min-width: 700px; font-size: 13px; }
  .compare-table3 th,
  .compare-table3 td { padding: 14px 12px; }
  .compare-table3 thead th { font-size: 17px; padding-top: 22px; padding-bottom: 22px; }
  .compare-table3-featured-head { font-size: 19px !important; padding-top: 31px !important; }
  .compare-table3-row-title svg,
  .compare-table3-row-title .officepro-box-icon { width: 20px; height: 20px; }
  .compare-table3-badge { height: 21px; min-width: 58px; font-size: 10px; }
}

.compare-table04 {
  width: 100%;
  margin: 32px 0;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

.compare-table04 table {
  width: 100%;
  min-width: 720px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  border: 1px solid #cfd9e8;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  font-family: inherit;
}

.compare-table04 th,
.compare-table04 td {
  padding: 18px 16px;
  border-right: 1px solid #cfd9e8;
  border-bottom: 1px solid #cfd9e8;
  color: #1f3554;
  font-size: 15px;
  line-height: 1.7;
  text-align: center;
  vertical-align: middle;
}

.compare-table04 thead th {
  background: var(--ss-color-primary);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1.4;
  text-align: center !important;
}

.compare-table04 thead th:first-child { width: 20%; }

.compare-table04__head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  white-space: nowrap;
  text-align: center;
}

.compare-table04__head--recommend { gap: 8px; }

.compare-table04__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 3px 8px;
  background: #f4f8ff;
  color: var(--ss-color-primary);
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.compare-table04 tbody th {
  width: 20%;
  background: #f7faff;
  color: var(--ss-color-primary);
  font-weight: 700;
  text-align: left;
  letter-spacing: 0.04em;
}

.compare-table04 tbody td {
  background: #fff;
  font-weight: 500;
}

.compare-table04 tbody td:nth-child(3) { background: #f1f6ff; }
.compare-table04 tbody td strong { color: var(--ss-color-primary); font-weight: 700; }
.compare-table04 th:last-child,
.compare-table04 td:last-child { border-right: none; }
.compare-table04 tbody tr:last-child th,
.compare-table04 tbody tr:last-child td { border-bottom: none; }

@media (max-width: 767px) {
  .compare-table04 { margin: 24px 0; }
  .compare-table04 table { min-width: 720px; }
  .compare-table04 th,
  .compare-table04 td { padding: 14px 12px; font-size: 14px; }
  .compare-table04 thead th { font-size: 15px; }
  .compare-table04__badge { padding: 2px 6px; font-size: 10px; }
}

.compare-table5 {
  --compare5-main: var(--ss-color-primary);
  --compare5-blue: #1f64e0;
  --compare5-border: #dce4ef;
  --compare5-light: #f8fbff;
  width: 100%;
  margin: 32px auto;
  color: var(--compare5-main);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
}

.compare-table5,
.compare-table5 * { box-sizing: border-box; }

.compare-table5__scroll {
  width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  padding: 12px 4px 8px;
  -webkit-overflow-scrolling: touch;
}

.compare-table5__inner {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 24px;
  min-width: max-content;
}

.compare-table5__card {
  position: relative;
  flex: 0 0 210px;
  width: 210px;
  background: #fff;
  border: 1px solid var(--compare5-border);
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(2, 50, 108, 0.08);
  text-align: center;
  overflow: visible;
}

.compare-table5__card--recommend {
  border: 2px solid var(--compare5-blue);
  box-shadow: 0 8px 22px rgba(31, 100, 224, 0.14);
}

.compare-table5__badge {
  position: absolute;
  top: -15px;
  left: 50%;
  transform: translateX(-50%);
  min-width: 76px;
  padding: 4px 14px 5px;
  border-radius: 999px;
  background: var(--compare5-main);
  color: #fff;
  font-family: sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  white-space: nowrap;
}

.compare-table5__title {
  margin: 0;
  padding: 17px 10px 15px;
  color: var(--compare5-main);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.08em;
  border-bottom: 1px solid var(--compare5-border);
  background: linear-gradient(180deg, #fff 0%, var(--compare5-light) 100%);
  border-radius: 8px 8px 0 0;
}

.compare-table5__price-area {
  padding: 15px 10px 14px;
  border-bottom: 1px solid var(--compare5-border);
}

.compare-table5__label {
  margin: 0 0 5px;
  color: var(--compare5-main);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
}

.compare-table5__price {
  margin: 0;
  color: var(--compare5-main);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.compare-table5__price span {
  font-size: 31px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.compare-table5__list {
  margin: 0;
  padding: 15px 17px 18px 28px;
  text-align: left;
  list-style-type: disc;
  list-style-position: outside;
}

.compare-table5__list li {
  margin: 0 0 8px;
  padding-left: 2px;
  color: var(--compare5-main);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.55;
}

.compare-table5__list li:last-child { margin-bottom: 0; }
.compare-table5__list li::marker { font-size: 0.9em; color: var(--compare5-main); }

@media (min-width: 760px) {
  .compare-table5__scroll { overflow-x: auto; }
}

@media (max-width: 759px) {
  .compare-table5 { margin: 28px auto; }
  .compare-table5__inner { justify-content: flex-start; gap: 18px; }
  .compare-table5__card { flex-basis: 200px; width: 200px; }
  .compare-table5__title { font-size: 17px; }
  .compare-table5__price span { font-size: 29px; }
}

.blog-card01 {
  --bc01-main: var(--ss-color-primary);
  --bc01-sub: #8BAEF4;
  --bc01-border: #B7CCF6;
  --bc01-text: #2f3f5f;
  --bc01-muted: #5f6f8f;

  display: flex;
  gap: 22px;
  align-items: center;
  max-width: 720px;
  padding: 20px 24px;
  border: 1.5px solid var(--bc01-border);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 4px 10px rgba(2, 50, 108, 0.08);
  color: inherit;
  text-decoration: none;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.blog-card01:hover {
  transform: translateY(-2px);
  border-color: var(--bc01-sub);
  box-shadow: 0 8px 18px rgba(2, 50, 108, 0.14);
}

.blog-card01__image {
  flex: 0 0 260px;
  overflow: hidden;
  border-radius: 6px;
  background: #eef3fb;
}

.blog-card01__image img {
  display: block;
  width: 100%;
  aspect-ratio: 260 / 150;
  object-fit: cover;
}

.blog-card01__content {
  flex: 1;
  min-width: 0;
}

.blog-card01__category {
  margin: 0 0 8px;
  color: var(--bc01-sub);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.04em;
}

.blog-card01__title {
  margin: 0;
  color: var(--bc01-main);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.55;
  letter-spacing: 0.03em;
}

.blog-card01__text {
  margin: 10px 0 20px;
  color: var(--bc01-text);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.9;
}

.blog-card01__meta {
  display: flex;
  align-items: center;
  gap: 22px;
  color: var(--bc01-main);
  font-size: 13px;
  font-weight: 600;
}

.blog-card01__meta-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}

.blog-card01__meta-item svg,
.blog-card01__arrow svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.blog-card01__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  color: var(--bc01-main);
}

.blog-card01__arrow svg {
  width: 24px;
  height: 24px;
  stroke-width: 2.4;
}

@media (max-width: 640px) {
  .blog-card01 {
    display: block;
    padding: 16px;
    border-radius: 12px;
  }

  .blog-card01__image {
    width: 100%;
    margin-bottom: 16px;
  }

  .blog-card01__image img {
    aspect-ratio: 16 / 9;
  }

  .blog-card01__title {
    font-size: 18px;
    line-height: 1.6;
  }

  .blog-card01__text {
    margin-bottom: 16px;
    font-size: 13px;
  }

  .blog-card01__meta {
    gap: 14px;
    flex-wrap: wrap;
    font-size: 12px;
  }

  .blog-card01__arrow {
    margin-left: auto;
  }
}

.blog-card2 {
  display: block;
  color: inherit;
  text-decoration: none;
}

.blog-card2__inner {
  position: relative;
  display: grid;
  grid-template-columns: 128px 1fr 42px;
  align-items: center;
  gap: 22px;
  overflow: hidden;
  width: 100%;
  padding: 28px 30px 26px 24px;
  background: #fff;
  border: 2px dashed #b8d3ff;
  border-radius: 8px;
  box-shadow: 0 6px 14px rgba(2, 50, 108, 0.13);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.blog-card2__inner::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 66px;
  height: 66px;
  background: linear-gradient(135deg, transparent 0 50%, #6f9ff1 51% 100%);
  pointer-events: none;
}

.blog-card2:hover .blog-card2__inner {
  transform: translateY(-2px);
  box-shadow: 0 9px 18px rgba(2, 50, 108, 0.18);
}

.blog-card2__visual {
  text-align: center;
}

.blog-card2__icon {
  display: grid;
  place-items: center;
  width: 92px;
  height: 92px;
  margin: 0 auto 14px;
  background: #eef5ff;
  border-radius: 50%;
}

.blog-card2__icon svg {
  width: 48px;
  height: 48px;
  fill: none;
  stroke: var(--ss-color-primary);
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.blog-card2__icon .officepro-box-icon {
  width: 54px;
  height: 54px;
}

.blog-card2__recommend {
  margin: 0;
  color: #4b8fe8;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.blog-card2__body {
  min-width: 0;
}

.blog-card2__category {
  display: inline-block;
  margin: 0 0 10px;
  padding-bottom: 3px;
  color: #4b8fe8;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  border-bottom: 2px solid #8baef4;
}

.blog-card2__title {
  margin: 0 0 12px;
  color: var(--ss-color-primary);
  font-size: 21px;
  font-weight: 700;
  line-height: 1.55;
  letter-spacing: 0.04em;
}

.blog-card2__text {
  margin: 0 0 18px;
  color: #263c63;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.9;
  letter-spacing: 0.04em;
}

.blog-card2__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  color: #263c63;
  font-size: 14px;
  font-weight: 600;
}

.blog-card2__meta-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}

.blog-card2__meta-item svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: var(--ss-color-primary);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.blog-card2__arrow {
  display: flex;
  justify-content: center;
  align-items: center;
}

.blog-card2__arrow span {
  position: relative;
  display: block;
  width: 34px;
  height: 1.8px;
  background: var(--ss-color-primary);
}

.blog-card2__arrow span::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 9px;
  height: 9px;
  border-top: 1.8px solid var(--ss-color-primary);
  border-right: 1.8px solid var(--ss-color-primary);
  transform: translateY(-50%) rotate(45deg);
}

@media (max-width: 640px) {
  .blog-card2__inner {
    grid-template-columns: 78px 1fr;
    gap: 16px;
    padding: 22px 20px 24px;
  }

  .blog-card2__inner::after {
    width: 52px;
    height: 52px;
  }

  .blog-card2__visual {
    align-self: start;
  }

  .blog-card2__icon {
    width: 66px;
    height: 66px;
    margin-bottom: 10px;
  }

  .blog-card2__icon svg {
    width: 36px;
    height: 36px;
  }

  .blog-card2__icon .officepro-box-icon {
    width: 40px;
    height: 40px;
  }

  .blog-card2__recommend {
    font-size: 11px;
  }

  .blog-card2__title {
    font-size: 17px;
    line-height: 1.55;
  }

  .blog-card2__text {
    font-size: 13px;
  }

  .blog-card2__meta {
    gap: 10px 16px;
    font-size: 12px;
  }

  .blog-card2__arrow {
    grid-column: 1 / -1;
    justify-content: flex-end;
    margin-top: -6px;
  }
}

.blog-card3 {
  --bc3-navy: var(--ss-color-primary);
  --bc3-blue: #8baef4;
  --bc3-border: #b9cff8;
  --bc3-text: #112b55;
  --bc3-muted: #425a80;

  display: grid;
  grid-template-columns: 120px 1fr;
  max-width: 760px;
  min-height: 210px;
  background: #fff;
  border: 1.5px solid var(--bc3-border);
  border-radius: 10px;
  overflow: hidden;
  text-decoration: none;
  color: var(--bc3-text);
  box-shadow: 0 8px 20px rgba(2, 50, 108, 0.13);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.blog-card3:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 26px rgba(2, 50, 108, 0.17);
}

.blog-card3__side {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 22px 16px;
  background: linear-gradient(160deg, #002b67 0%, #003f92 100%);
  color: #fff;
}

.blog-card3__icon {
  width: 58px;
  height: 58px;
}

.blog-card3__icon svg {
  width: 100%;
  height: 100%;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.blog-card3__icon .officepro-box-icon {
  width: 100%;
  height: 100%;
  filter: brightness(0) invert(1);
}

.blog-card3__category-side {
  position: relative;
  display: inline-block;
  padding-bottom: 12px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.blog-card3__category-side::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 56px;
  height: 2px;
  background: #fff;
  transform: translateX(-50%);
}

.blog-card3__content {
  padding: 24px 30px 22px;
}

.blog-card3__label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
  padding: 4px 14px;
  border: 1.5px solid var(--bc3-blue);
  border-radius: 999px;
  color: #315da5;
  background: #f7faff;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.blog-card3__title {
  margin: 0;
  color: var(--bc3-navy);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: clamp(20px, 2.6vw, 27px);
  font-weight: 700;
  line-height: 1.38;
  letter-spacing: 0.08em;
}

.blog-card3__text {
  margin: 12px 0 0;
  color: #233b64;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.75;
  letter-spacing: 0.04em;
}

.blog-card3__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 18px;
}

.blog-card3__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
}

.blog-card3__meta-item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--bc3-muted);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}

.blog-card3__meta-item svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.blog-card3__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--bc3-navy);
  font-size: 28px;
  font-weight: 500;
  line-height: 1;
  transition: transform 0.25s ease;
}

.blog-card3:hover .blog-card3__arrow {
  transform: translateX(5px);
}

@media (max-width: 640px) {
  .blog-card3 {
    grid-template-columns: 88px 1fr;
    min-height: auto;
  }

  .blog-card3__side {
    padding: 20px 10px;
    gap: 14px;
  }

  .blog-card3__icon {
    width: 46px;
    height: 46px;
  }

  .blog-card3__category-side {
    font-size: 12px;
    writing-mode: vertical-rl;
    padding-bottom: 0;
    padding-left: 10px;
  }

  .blog-card3__category-side::after {
    left: auto;
    right: 0;
    bottom: 50%;
    width: 2px;
    height: 48px;
    transform: translateY(50%);
  }

  .blog-card3__content {
    padding: 20px 18px;
  }

  .blog-card3__label {
    margin-bottom: 8px;
    font-size: 12px;
  }

  .blog-card3__title {
    font-size: 19px;
    line-height: 1.4;
    letter-spacing: 0.04em;
  }

  .blog-card3__title br,
  .blog-card3__text br {
    display: none;
  }

  .blog-card3__text {
    margin-top: 10px;
    font-size: 13px;
    line-height: 1.65;
  }

  .blog-card3__bottom {
    align-items: flex-end;
    margin-top: 16px;
  }

  .blog-card3__meta {
    gap: 12px;
  }

  .blog-card3__meta-item {
    font-size: 12px;
  }

  .blog-card3__meta-item svg {
    width: 16px;
    height: 16px;
  }

  .blog-card3__arrow {
    font-size: 24px;
  }
}

.blog-card4 {
  --blog-card4-navy: var(--ss-color-primary);
  --blog-card4-blue: #8baef4;
  --blog-card4-text: #183767;
  --blog-card4-cut: 18px;

  max-width: 760px;
  margin: 24px auto;
  font-family: "Noto Sans JP", "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif;
}

.blog-card4__link {
  position: relative;
  display: block;
  background: var(--blog-card4-navy);
  clip-path: polygon(
    var(--blog-card4-cut) 0,
    calc(100% - var(--blog-card4-cut)) 0,
    100% var(--blog-card4-cut),
    100% calc(100% - var(--blog-card4-cut)),
    calc(100% - var(--blog-card4-cut)) 100%,
    var(--blog-card4-cut) 100%,
    0 calc(100% - var(--blog-card4-cut)),
    0 var(--blog-card4-cut)
  );
  text-decoration: none;
  color: inherit;
  transition: transform 0.25s ease, opacity 0.25s ease;
}

.blog-card4__link::before,
.blog-card4__link::after {
  content: "";
  position: absolute;
  clip-path: inherit;
  pointer-events: none;
}

.blog-card4__link::before {
  inset: 4px;
  background: #fff;
}

.blog-card4__link::after {
  inset: 8px;
  background: var(--blog-card4-navy);
}

.blog-card4__link:hover {
  transform: translateY(-2px);
  opacity: 0.96;
}

.blog-card4__content {
  position: relative;
  z-index: 1;
  margin: 11px;
  padding: 16px 28px 16px 20px;
  background: #fff;
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 30px;
  align-items: center;
  clip-path: polygon(
    12px 0,
    calc(100% - 12px) 0,
    100% 12px,
    100% calc(100% - 12px),
    calc(100% - 12px) 100%,
    12px 100%,
    0 calc(100% - 12px),
    0 12px
  );
}

.blog-card4__image {
  width: 100%;
}

.blog-card4__image img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 5px;
}

.blog-card4__body {
  min-width: 0;
}

.blog-card4__category {
  display: inline-block;
  margin-bottom: 8px;
  color: #4c7fd8;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}

.blog-card4__title {
  margin: 0 0 10px;
  color: var(--blog-card4-navy);
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: 23px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.08em;
}

.blog-card4__text {
  margin: 0 0 14px;
  color: var(--blog-card4-text);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.04em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.blog-card4__meta {
  display: flex;
  align-items: center;
  gap: 18px;
  color: var(--blog-card4-text);
  font-size: 13px;
  font-weight: 700;
}

.blog-card4__meta-item {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
}

.blog-card4__meta-item::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background-color: currentColor;
  flex: 0 0 auto;
}

.blog-card4__date::before {
  mask:
    linear-gradient(#000 0 0) center 5px / 11px 2px no-repeat,
    linear-gradient(#000 0 0) center 11px / 9px 2px no-repeat,
    linear-gradient(#000 0 0) center 13px / 9px 2px no-repeat,
    linear-gradient(#000 0 0) center / 15px 13px no-repeat;
  -webkit-mask:
    linear-gradient(#000 0 0) center 5px / 11px 2px no-repeat,
    linear-gradient(#000 0 0) center 11px / 9px 2px no-repeat,
    linear-gradient(#000 0 0) center 13px / 9px 2px no-repeat,
    linear-gradient(#000 0 0) center / 15px 13px no-repeat;
}

.blog-card4__time::before {
  border-radius: 50%;
  mask:
    linear-gradient(#000 0 0) 50% 50% / 2px 7px no-repeat,
    linear-gradient(#000 0 0) 62% 58% / 6px 2px no-repeat,
    radial-gradient(circle, transparent 7px, #000 7.5px, #000 8.5px, transparent 9px);
  -webkit-mask:
    linear-gradient(#000 0 0) 50% 50% / 2px 7px no-repeat,
    linear-gradient(#000 0 0) 62% 58% / 6px 2px no-repeat,
    radial-gradient(circle, transparent 7px, #000 7.5px, #000 8.5px, transparent 9px);
}

.blog-card4__arrow {
  margin-left: auto;
  color: var(--blog-card4-navy);
  font-size: 30px;
  font-weight: 400;
  line-height: 1;
}

@media (max-width: 700px) {
  .blog-card4 {
    --blog-card4-cut: 14px;
    margin: 20px auto;
  }

  .blog-card4__content {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 18px;
  }

  .blog-card4__image img {
    aspect-ratio: 16 / 9;
  }

  .blog-card4__title {
    font-size: 20px;
    line-height: 1.55;
  }

  .blog-card4__text {
    font-size: 13px;
    line-height: 1.7;
    margin-bottom: 12px;
  }

  .blog-card4__meta {
    flex-wrap: wrap;
    gap: 10px 16px;
    font-size: 13px;
  }

  .blog-card4__arrow {
    margin-left: auto;
    font-size: 28px;
  }
}

.blog-card5 {
  --bc5-navy: var(--ss-color-primary);
  --bc5-blue: #8baef4;
  --bc5-border: #b8c7dd;
  --bc5-text: #1d3557;
  --bc5-muted: #4f5f73;
  --bc5-bg: #ffffff;

  display: flex;
  width: 100%;
  max-width: 860px;
  min-height: 156px;
  margin: 24px 0;
  overflow: hidden;
  color: var(--bc5-text);
  text-decoration: none;
  background: var(--bc5-bg);
  border: 1px solid var(--bc5-border);
  border-radius: 8px;
  transition: border-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.blog-card5:hover {
  border-color: var(--bc5-navy);
  box-shadow: 0 8px 20px rgba(2, 50, 108, 0.08);
  transform: translateY(-2px);
}

.blog-card5__thumb {
  position: relative;
  flex: 0 0 250px;
  min-height: 156px;
  background: #eef3f8;
}

.blog-card5__img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 156px;
  object-fit: cover;
}

.blog-card5__ribbon {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 34px;
  padding: 0 26px 0 14px;
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  background: var(--bc5-navy);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 100%, 0 100%);
}

.blog-card5__ribbon-icon {
  position: relative;
  display: inline-block;
  width: 10px;
  height: 14px;
  border: 1.8px solid #ffffff;
  border-bottom: none;
  border-radius: 1px 1px 0 0;
}

.blog-card5__ribbon-icon::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -5px;
  width: 7px;
  height: 7px;
  border-left: 1.8px solid #ffffff;
  border-bottom: 1.8px solid #ffffff;
  transform: translateX(-50%) rotate(-45deg);
  background: var(--bc5-navy);
}

.blog-card5__ribbon-icon--custom {
  width: 16px;
  height: 16px;
  border: 0;
  border-radius: 0;
}

.blog-card5__ribbon-icon--custom::after {
  display: none;
}

.blog-card5__ribbon-icon .officepro-box-icon {
  width: 100%;
  height: 100%;
  filter: brightness(0) invert(1);
}

.blog-card5__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 18px 22px 16px;
}

.blog-card5__category {
  align-self: flex-start;
  margin-bottom: 9px;
  padding: 4px 13px;
  color: var(--bc5-navy);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
  background: #f6f9ff;
  border: 1px solid #c8d7f2;
  border-radius: 2px;
}

.blog-card5__title {
  margin: 0 0 8px;
  color: var(--bc5-navy);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.02em;
}

.blog-card5__text {
  margin: 0;
  color: var(--bc5-muted);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.7;
}

.blog-card5__bottom {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-top: auto;
  padding-top: 12px;
}

.blog-card5__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  color: #26384f;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
}

.blog-card5__date,
.blog-card5__time {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.blog-card5__date::before {
  content: "";
  width: 13px;
  height: 13px;
  background:
    linear-gradient(var(--bc5-navy), var(--bc5-navy)) 50% 3px / 8px 1.5px no-repeat,
    linear-gradient(var(--bc5-navy), var(--bc5-navy)) 50% 7px / 8px 1.5px no-repeat;
  border: 1.5px solid var(--bc5-navy);
  border-radius: 1px;
  box-sizing: border-box;
}

.blog-card5__time::before {
  content: "";
  width: 14px;
  height: 14px;
  border: 1.5px solid var(--bc5-navy);
  border-radius: 50%;
  box-sizing: border-box;
}

.blog-card5__time::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 2px;
  width: 4px;
  height: 5px;
  border-right: 1.5px solid var(--bc5-navy);
  border-bottom: 1.5px solid var(--bc5-navy);
}

.blog-card5__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 185px;
  padding: 12px 16px;
  color: var(--bc5-navy);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  background: #ffffff;
  border: 1px solid var(--bc5-navy);
  transition: color 0.25s ease, background 0.25s ease;
}

.blog-card5:hover .blog-card5__button {
  color: #ffffff;
  background: var(--bc5-navy);
}

.blog-card5__arrow {
  font-size: 16px;
  line-height: 1;
}

@media (max-width: 640px) {
  .blog-card5 {
    flex-direction: column;
    max-width: 100%;
  }

  .blog-card5__thumb {
    flex: none;
    width: 100%;
    min-height: auto;
    aspect-ratio: 16 / 9;
  }

  .blog-card5__img {
    min-height: auto;
  }

  .blog-card5__body {
    padding: 16px;
  }

  .blog-card5__title {
    font-size: 16px;
  }

  .blog-card5__bottom {
    align-items: stretch;
    flex-direction: column;
    gap: 14px;
  }

  .blog-card5__button {
    width: 100%;
    min-width: 0;
  }
}

.wp-profile-block01 {
  --profile01-main: var(--ss-color-primary);
  --profile01-sub: #8BAEF4;
  --profile01-border: rgba(2, 50, 108, 0.35);
  --profile01-text: #26344d;
  --profile01-muted: #60708c;
  --profile01-bg: #ffffff;

  position: relative;
  max-width: 760px;
  margin: 2.5rem auto;
  padding: 0;
  background: var(--profile01-bg);
  border: 1px solid var(--profile01-border);
  border-radius: 6px;
  box-shadow: 0 8px 22px rgba(2, 50, 108, 0.08);
  overflow: hidden;
}

.wp-profile-block01::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 10px;
  background: linear-gradient(
    180deg,
    var(--profile01-main) 0%,
    #0b3f82 100%
  );
}

.wp-profile-block01__inner {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 32px;
  align-items: center;
  padding: 36px 38px 30px 44px;
}

.wp-profile-block01__photo-area {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 150px;
  border-right: 1px solid rgba(2, 50, 108, 0.18);
  padding-right: 32px;
}

.wp-profile-block01__photo {
  width: 132px;
  height: 132px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  background: #eef3f8;
}

.wp-profile-block01__content {
  min-width: 0;
}

.wp-profile-block01__heading {
  display: flex;
  align-items: baseline;
  gap: 20px;
  margin-bottom: 14px;
}

.wp-profile-block01 h3.wp-profile-block01__name {
  margin: 0;
  padding: 0;
  color: var(--profile01-main);
  background: transparent;
  border: 0;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: clamp(1.55rem, 2.4vw, 2rem);
  font-weight: 700;
  letter-spacing: 0.12em;
  line-height: 1.35;
}

.wp-profile-block01 p.wp-profile-block01__role {
  margin: 0;
  color: var(--profile01-sub);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.wp-profile-block01 p.wp-profile-block01__text {
  margin: 0 0 17px;
  color: var(--profile01-text);
  font-size: 0.9rem;
  line-height: 1.9;
  letter-spacing: 0.04em;
}

.wp-profile-block01__specialty {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--profile01-main);
  font-size: 0.82rem;
  line-height: 1.7;
  letter-spacing: 0.03em;
}

.wp-profile-block01__specialty-text {
  margin-left: 0.25em;
}

.wp-profile-block01__specialty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 21px;
  height: 21px;
  flex: 0 0 21px;
  color: var(--profile01-sub);
  border: 1px solid var(--profile01-sub);
  border-radius: 50%;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
}

.wp-profile-block01__links {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 22px;
  padding-top: 17px;
  border-top: 1px solid rgba(2, 50, 108, 0.22);
}

.wp-profile-block01__link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--profile01-main);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-decoration: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.wp-profile-block01__link:hover {
  color: var(--profile01-main);
  opacity: 0.75;
  transform: translateY(-1px);
}

.wp-profile-block01__mail-icon {
  position: relative;
  width: 18px;
  height: 13px;
  border: 1.6px solid var(--profile01-main);
  border-radius: 2px;
}

.wp-profile-block01__mail-icon::before,
.wp-profile-block01__mail-icon::after {
  content: "";
  position: absolute;
  top: 1px;
  width: 10px;
  height: 1.5px;
  background: var(--profile01-main);
  transform-origin: top left;
}

.wp-profile-block01__mail-icon::before {
  left: 1px;
  transform: rotate(36deg);
}

.wp-profile-block01__mail-icon::after {
  right: -1px;
  transform: rotate(144deg);
}

.wp-profile-block01__sns-group {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.wp-profile-block01__sns {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  color: #ffffff;
  background: var(--profile01-main);
  border-radius: 50%;
  text-decoration: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.wp-profile-block01__sns:hover {
  color: #ffffff;
  opacity: 0.8;
  transform: translateY(-1px);
}

.wp-profile-block01__sns-label {
  display: inline-block;
  font-size: 0.66rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.02em;
}

.wp-profile-block01__sns-label--note {
  font-size: 0.82rem;
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
  font-weight: 700;
  transform: translateY(-0.5px);
}

@media (max-width: 640px) {
  .wp-profile-block01 {
    margin: 2rem auto;
  }

  .wp-profile-block01::before {
    width: 7px;
  }

  .wp-profile-block01__inner {
    grid-template-columns: 1fr;
    gap: 22px;
    padding: 30px 24px 26px 30px;
    text-align: center;
  }

  .wp-profile-block01__photo-area {
    min-height: auto;
    border-right: none;
    border-bottom: 1px solid rgba(2, 50, 108, 0.16);
    padding-right: 0;
    padding-bottom: 24px;
  }

  .wp-profile-block01__photo {
    width: 118px;
    height: 118px;
  }

  .wp-profile-block01__heading {
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px 14px;
    margin-bottom: 12px;
  }

  .wp-profile-block01__role {
    width: 100%;
    white-space: normal;
  }

  .wp-profile-block01__text {
    text-align: left;
    font-size: 0.88rem;
    line-height: 1.85;
  }

  .wp-profile-block01__specialty {
    align-items: flex-start;
    text-align: left;
    font-size: 0.8rem;
  }

  .wp-profile-block01__links {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
  }

  .wp-profile-block01__sns-group {
    justify-content: center;
  }
}

.tax-profile02 {
  --tp-main: var(--ss-color-primary);
  --tp-sub: #8BAEF4;
  --tp-line: #c9d8ef;
  --tp-bg: #f8fbff;
  --tp-text: #26364c;

  position: relative;
  max-width: 760px;
  margin: 32px auto;
  padding: 28px 30px 56px;
  overflow: hidden;
  border: 1px solid var(--tp-line);
  border-radius: 8px;
  background:
    repeating-linear-gradient(
      135deg,
      rgba(139, 174, 244, 0.08) 0,
      rgba(139, 174, 244, 0.08) 1px,
      transparent 1px,
      transparent 12px
    ),
    linear-gradient(180deg, #ffffff 0%, var(--tp-bg) 100%);
  box-shadow: 0 6px 18px rgba(2, 50, 108, 0.08);
  color: var(--tp-text);
  box-sizing: border-box;
}

.tax-profile02 *,
.tax-profile02 *::before,
.tax-profile02 *::after {
  box-sizing: border-box;
}

.tax-profile02__inner {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 26px;
  align-items: start;
  position: relative;
  z-index: 2;
}

.tax-profile02__photo-wrap {
  width: 136px;
  height: 136px;
  padding: 5px;
  border-radius: 50%;
  background: #ffffff;
  border: 1px solid #d7e3f5;
  box-shadow: 0 4px 14px rgba(2, 50, 108, 0.10);
}

.tax-profile02__photo {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.tax-profile02__content {
  min-width: 0;
}

.tax-profile02__head {
  display: flex;
  align-items: baseline;
  gap: 16px;
  margin-bottom: 10px;
}

.tax-profile02 p.tax-profile02__name {
  margin: 0;
  color: var(--tp-main);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 32px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.12em;
}

.tax-profile02 p.tax-profile02__position {
  margin: 4px 0 0;
  color: var(--tp-main);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
}

.tax-profile02__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 2px 0 14px;
  padding: 7px 18px;
  background: var(--tp-main);
  color: #ffffff;
  border-radius: 2px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1.4;
  box-shadow: 4px 4px 0 rgba(139, 174, 244, 0.35);
}

.tax-profile02 p.tax-profile02__text {
  margin: 0;
  max-width: 520px;
  color: #33445c;
  font-size: 14px;
  line-height: 1.9;
  letter-spacing: 0.04em;
}

.tax-profile02__specialty {
  margin-top: 20px;
}

.tax-profile02 p.tax-profile02__specialty-title {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 12px;
  color: var(--tp-main);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.tax-profile02__specialty-title::before {
  content: "";
  width: 15px;
  height: 15px;
  border-left: 1px solid var(--tp-sub);
  border-bottom: 1px solid var(--tp-sub);
  transform: rotate(45deg);
  opacity: 0.9;
}

.tax-profile02__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.tax-profile02__tags li {
  min-width: 112px;
  padding: 8px 16px;
  border: 1px solid #cfdcf1;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  color: var(--tp-main);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
  letter-spacing: 0.04em;
}

.tax-profile02__footer {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  width: calc(100% - 112px);
  min-height: 45px;
  padding-left: 28px;
  border-top: 1px solid #d9e4f4;
  background: rgba(255, 255, 255, 0.78);
  backdrop-filter: blur(2px);
}

.tax-profile02__contact,
.tax-profile02__sns {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  color: var(--tp-main);
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.tax-profile02__contact {
  gap: 8px;
  padding: 0 20px 0 0;
  margin-right: 20px;
  border-right: 1px solid #d9e4f4;
}

.tax-profile02__contact:hover,
.tax-profile02__sns:hover {
  color: var(--tp-main);
  opacity: 0.72;
}

.tax-profile02__icon {
  width: 17px;
  height: 17px;
  color: var(--tp-main);
}

.tax-profile02__icon svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.tax-profile02__sns-list {
  display: flex;
  align-items: center;
  gap: 10px;
}

.tax-profile02__sns {
  width: 26px;
  height: 26px;
  min-height: 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
}

.tax-profile02__sns svg {
  display: block;
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.tax-profile02__sns--x {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 15px;
  font-weight: 700;
}

.tax-profile02__sns--note {
  width: auto;
  padding-top: 1px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.tax-profile02__corner {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 2;
  width: 118px;
  height: 82px;
  background: var(--tp-main);
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
}

.tax-profile02__corner::before,
.tax-profile02__corner::after,
.tax-profile02__corner span {
  display: none;
}

/* スマホ対応 */
@media (max-width: 640px) {
  .tax-profile02 {
    padding: 24px 20px 82px;
    border-radius: 8px;
  }

  .tax-profile02__inner {
    grid-template-columns: 1fr;
    gap: 18px;
    text-align: center;
  }

  .tax-profile02__photo-wrap {
    width: 122px;
    height: 122px;
    margin: 0 auto;
  }

  .tax-profile02__head {
    justify-content: center;
  }

  .tax-profile02 p.tax-profile02__name {
    font-size: 26px;
  }

  .tax-profile02 p.tax-profile02__position {
    font-size: 12px;
  }

  .tax-profile02__badge {
    font-size: 12px;
    padding: 7px 14px;
  }

  .tax-profile02 p.tax-profile02__text {
    max-width: none;
    text-align: left;
    font-size: 13px;
    line-height: 1.85;
  }

  .tax-profile02 p.tax-profile02__specialty-title {
    justify-content: center;
  }

  .tax-profile02__tags {
    justify-content: center;
  }

  .tax-profile02__tags li {
    min-width: auto;
    width: calc(50% - 6px);
    padding: 8px 10px;
    font-size: 12px;
  }

  .tax-profile02__footer {
    width: 100%;
    min-height: auto;
    padding: 8px 78px 8px 14px;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px 8px;
  }

  .tax-profile02__contact {
    min-height: 30px;
    margin-right: 0;
    padding-right: 8px;
    border-right: none;
    font-size: 12px;
  }

  .tax-profile02__sns {
    width: 24px;
    height: 24px;
  }

  .tax-profile02__sns-list {
    gap: 8px;
  }

  .tax-profile02__sns svg {
    width: 18px;
    height: 18px;
  }

  .tax-profile02__sns--note {
    width: auto;
    font-size: 11px;
  }

  .tax-profile02__corner {
    width: 86px;
    height: 64px;
  }
}

/* =========================
   プロフィールブロック3
========================= */

.profile-block3 {
  --pb3-main: var(--ss-color-primary);
  --pb3-sub: #8BAEF4;
  --pb3-text: #34445A;
  --pb3-muted: #6B7890;
  --pb3-border: #DDE7F5;
  --pb3-bg: #FFFFFF;
  --pb3-soft: #F4F8FE;

  max-width: 760px;
  margin: 32px auto;
  padding: 28px 34px;
  background: var(--pb3-bg);
  border: 1px solid var(--pb3-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(2, 50, 108, 0.10);
}

.profile-block3__inner {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 30px;
  align-items: center;
}

.profile-block3__image-wrap {
  width: 126px;
  height: 126px;
  margin: 0 auto;
  border-radius: 50%;
  background: linear-gradient(135deg, #F5F8FD, #EAF1FB);
  overflow: hidden;
  flex-shrink: 0;
}

.profile-block3__image {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.profile-block3__content {
  min-width: 0;
}

.profile-block3__header {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.profile-block3 h3.profile-block3__name {
  margin: 0;
  padding: 0;
  color: var(--pb3-main);
  background: transparent;
  border: 0;
  font-size: 1.65rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.04em;
}

.profile-block3__badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  color: #FFFFFF;
  background: var(--pb3-sub);
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.03em;
}

.profile-block3 p.profile-block3__lead {
  margin: 0 0 14px;
  color: var(--pb3-main);
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.7;
}

.profile-block3 p.profile-block3__text {
  margin: 0;
  color: var(--pb3-text);
  font-size: 0.92rem;
  line-height: 1.9;
  letter-spacing: 0.03em;
}

.profile-block3__info {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
  margin-top: 22px;
  padding-top: 17px;
  border-top: 1px dashed var(--pb3-border);
  color: var(--pb3-text);
  font-size: 0.86rem;
  line-height: 1.6;
}

.profile-block3__info-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-right: 16px;
  color: var(--pb3-main);
  font-weight: 700;
}

.profile-block3__info-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--pb3-main);
  font-size: 0.95rem;
}

.profile-block3__info-item {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 0 13px;
  color: var(--pb3-text);
  font-weight: 500;
}

.profile-block3__info-item::before {
  content: "";
  position: absolute;
  left: 0;
  width: 1px;
  height: 14px;
  background: var(--pb3-border);
}

.profile-block3__links {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px dashed var(--pb3-border);
}

.profile-block3__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 15px;
  color: var(--pb3-main);
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1.5;
  text-decoration: none;
  transition: color 0.2s ease, opacity 0.2s ease;
}

.profile-block3__link:first-child {
  padding-left: 0;
}

.profile-block3__link:not(:first-child)::before {
  content: "";
  position: absolute;
  left: 0;
  width: 1px;
  height: 14px;
  background: var(--pb3-border);
}

.profile-block3__link:hover {
  color: var(--pb3-sub);
  opacity: 0.9;
}

.profile-block3__link-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: currentColor;
  font-size: 0.95rem;
  font-weight: 700;
}

.profile-block3__sns-link {
  min-width: 42px;
  justify-content: center;
}

.profile-block3__sns-mark {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 17px;
  height: 17px;
  color: var(--pb3-main);
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1;
}

.profile-block3__sns-mark--x {
  font-family: Arial, sans-serif;
  letter-spacing: 0;
}

.profile-block3__sns-mark--instagram {
  border: 1.8px solid currentColor;
  border-radius: 5px;
}

.profile-block3__sns-mark--instagram::before {
  content: "";
  width: 6px;
  height: 6px;
  border: 1.7px solid currentColor;
  border-radius: 50%;
}

.profile-block3__sns-mark--instagram::after {
  content: "";
  position: absolute;
  top: 3px;
  right: 3px;
  width: 2.5px;
  height: 2.5px;
  background: currentColor;
  border-radius: 50%;
}

.profile-block3__sns-mark--youtube {
  width: 20px;
  height: 14px;
  background: currentColor;
  border-radius: 4px;
}

.profile-block3__sns-mark--youtube::before {
  content: "";
  width: 0;
  height: 0;
  margin-left: 1px;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 7px solid #FFFFFF;
}

.profile-block3__sns-mark--note {
  font-family: Arial, sans-serif;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0;
}

/* スマホ対応 */
@media (max-width: 640px) {
  .profile-block3 {
    padding: 28px 22px;
    margin: 24px auto;
  }

  .profile-block3__inner {
    grid-template-columns: 1fr;
    gap: 20px;
    text-align: center;
  }

  .profile-block3__image-wrap {
    width: 118px;
    height: 118px;
  }

  .profile-block3__header {
    justify-content: center;
  }

  .profile-block3 h3.profile-block3__name {
    font-size: 1.45rem;
  }

  .profile-block3 p.profile-block3__text {
    text-align: left;
  }

  .profile-block3__info {
    justify-content: center;
  }

  .profile-block3__info-label {
    width: 100%;
    justify-content: center;
    margin: 0 0 8px;
  }

  .profile-block3__links {
    justify-content: center;
    row-gap: 12px;
  }

  .profile-block3__link {
    padding: 0 12px;
  }

  .profile-block3__sns-link {
    min-width: 36px;
  }
}

/* アイコンボックス1 */
.icon-box1 {
  --icon-box1-navy: var(--ss-color-primary);
  --icon-box1-blue: #8baef4;
  --icon-box1-border: #cfe0ff;
  --icon-box1-bg: #f8fbff;

  display: flex;
  align-items: stretch;
  width: 100%;
  max-width: 760px;
  margin: 24px auto;
  background: var(--icon-box1-bg);
  border: 1px solid var(--icon-box1-border);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 22px rgba(2, 50, 108, 0.06);
}

.icon-box1__icon-area {
  position: relative;
  flex: 0 0 148px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #eef6ff 0%, #f8fbff 100%);
}

.icon-box1__icon-area::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 1px;
  height: 100%;
  background-image: linear-gradient(
    to bottom,
    rgba(139, 174, 244, 0.95) 50%,
    transparent 50%
  );
  background-size: 1px 6px;
}

.icon-box1__icon {
  width: 58px;
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  border: 1px solid #b9d0ff;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(2, 50, 108, 0.06);
}

.icon-box1__icon svg {
  width: 34px;
  height: 34px;
  fill: none;
  stroke: var(--icon-box1-navy);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.icon-box1__content {
  flex: 1;
  padding: 30px 34px 28px;
}

.icon-box1__label {
  margin: 0 0 8px;
  color: var(--icon-box1-blue);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.08em;
}

.icon-box1__title {
  margin: 0 0 12px;
  color: var(--icon-box1-navy);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Times New Roman", serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.08em;
}

.icon-box1__text {
  margin: 0;
  color: #1f3150;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.9;
  letter-spacing: 0.04em;
}

@media (max-width: 600px) {
  .icon-box1 {
    flex-direction: column;
    max-width: 100%;
  }

  .icon-box1__icon-area {
    flex: none;
    height: 110px;
  }

  .icon-box1__icon-area::after {
    top: auto;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background-image: linear-gradient(
      to right,
      rgba(139, 174, 244, 0.95) 50%,
      transparent 50%
    );
    background-size: 6px 1px;
  }

  .icon-box1__content {
    padding: 24px 22px 26px;
  }

  .icon-box1__title {
    font-size: 21px;
  }

  .icon-box1__text {
    font-size: 13px;
  }
}

/* アイコンボックス2 */
.icon-box2 {
  position: relative;
  background: #fff;
  border: 1px solid #edf0f5;
  border-radius: 10px;
  box-shadow: 0 8px 22px rgba(2, 50, 108, 0.08);
  overflow: hidden;
  max-width: 760px;
  margin: 32px auto;
}

.icon-box2::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 8px;
  height: 100%;
  background: var(--ss-color-primary);
}

.icon-box2__inner {
  display: flex;
  align-items: center;
  gap: 38px;
  padding: 42px 46px 42px 56px;
}

.icon-box2__icon {
  flex: 0 0 auto;
  width: 86px;
  height: 86px;
  border: 2px solid var(--ss-color-primary);
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--ss-color-primary);
}

.icon-box2__svg {
  width: 46px;
  height: 46px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.icon-box2__content {
  flex: 1;
  min-width: 0;
}

.icon-box2__label {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  font-size: 14px;
  font-weight: 600;
  color: #2f65c8;
  letter-spacing: 0.08em;
}

.icon-box2__label::after {
  content: "";
  flex: 1;
  border-top: 2px dotted #b9c7dc;
  transform: translateY(1px);
}

.icon-box2__title {
  margin: 0 0 20px;
  color: var(--ss-color-primary);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Times New Roman", serif;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.06em;
}

.icon-box2__text {
  margin: 0;
  color: #333;
  font-size: 15px;
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0.06em;
}

@media (max-width: 640px) {
  .icon-box2 {
    margin: 24px 0;
  }

  .icon-box2__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 22px;
    padding: 32px 24px 32px 34px;
  }

  .icon-box2__icon {
    width: 72px;
    height: 72px;
  }

  .icon-box2__svg {
    width: 38px;
    height: 38px;
  }

  .icon-box2__label {
    font-size: 13px;
  }

  .icon-box2__title {
    font-size: 23px;
    margin-bottom: 16px;
  }

  .icon-box2__text {
    font-size: 14px;
    line-height: 1.9;
  }
}

/* アイコンボックス3 */
.icon-box3 {
  position: relative;
  max-width: 720px;
  margin: 32px auto;
  padding: 44px 46px 34px;
  background: #fff;
  border: 1.5px solid #5d8df2;
  border-radius: 5px;
  box-sizing: border-box;
  color: #333;
}

.icon-box3__label {
  position: absolute;
  top: -10px;
  left: 28px;
  width: 120px;
  height: 20px;
  background: #4f7fe8;
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 12px;
  line-height: 20px;
  letter-spacing: 0.18em;
  text-align: center;
  clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, 8px 100%, 0 50%);
}

.icon-box3__inner {
  display: flex;
  align-items: center;
  gap: 34px;
}

.icon-box3__icon {
  flex: 0 0 auto;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #eef4ff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.icon-box3__svg {
  width: 34px;
  height: 34px;
}

.icon-box3__svg rect,
.icon-box3__svg path {
  fill: none;
  stroke: var(--ss-color-primary);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.icon-box3__content {
  flex: 1;
}

.icon-box3__title {
  margin: 0 0 15px;
  padding-bottom: 13px;
  border-bottom: 1.5px dotted #b8d0ff;
  color: var(--ss-color-primary);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.08em;
}

.icon-box3__text {
  margin: 0;
  color: #333;
  font-size: 14px;
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0.06em;
}

@media (max-width: 600px) {
  .icon-box3 {
    padding: 38px 22px 28px;
  }

  .icon-box3__label {
    left: 20px;
  }

  .icon-box3__inner {
    align-items: flex-start;
    gap: 18px;
  }

  .icon-box3__icon {
    width: 52px;
    height: 52px;
  }

  .icon-box3__svg {
    width: 30px;
    height: 30px;
  }

  .icon-box3__title {
    font-size: 17px;
  }

  .icon-box3__text {
    font-size: 13px;
    line-height: 1.9;
  }
}

/* アイコンボックス4 */
.icon-box4 {
  --box4-main: #8baef4;
  --box4-navy: var(--ss-color-primary);
  --box4-bg: #f8fbff;
  --box4-border: #dbe7ff;
  --box4-text: #2f3d52;

  position: relative;
  max-width: 760px;
  margin: 32px auto;
  padding: 34px 32px;
  background: var(--box4-bg);
  border: 1px solid var(--box4-border);
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(2, 50, 108, 0.08);
  box-sizing: border-box;
}

.icon-box4::before,
.icon-box4::after {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  height: 4px;
  border: 1px solid var(--box4-main);
  border-radius: 999px;
  background: #eef5ff;
  box-sizing: border-box;
}

.icon-box4::before {
  top: 10px;
}

.icon-box4::after {
  bottom: 10px;
}

.icon-box4__inner {
  display: flex;
  align-items: center;
  gap: 28px;
}

.icon-box4__icon {
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, #eef5ff 0%, #e6f0ff 100%);
  border: 1px solid #c8d8fb;
  border-radius: 50%;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.icon-box4__svg {
  width: 42px;
  height: 42px;
  fill: none;
  stroke: var(--box4-navy);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.icon-box4__content {
  flex: 1;
  min-width: 0;
}

.icon-box4__label {
  margin: 0 0 12px;
  color: var(--box4-main);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.16em;
  line-height: 1.4;
}

.icon-box4__title {
  margin: 0 0 18px;
  color: var(--box4-navy);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 21px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.05em;
}

.icon-box4__text {
  margin: 0;
  color: var(--box4-text);
  font-size: 14px;
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0.08em;
}

@media (max-width: 600px) {
  .icon-box4 {
    padding: 36px 22px 32px;
  }

  .icon-box4__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
  }

  .icon-box4__icon {
    width: 64px;
    height: 64px;
    flex-basis: 64px;
  }

  .icon-box4__svg {
    width: 38px;
    height: 38px;
  }

  .icon-box4__title {
    font-size: 18px;
  }

  .icon-box4__text {
    font-size: 13.5px;
  }
}

/* アイコンボックス5 */
.icon-box-5 {
  --ib5-navy: var(--ss-color-primary);
  --ib5-blue: #8baef4;
  --ib5-light-blue: #f1f6ff;
  --ib5-border: #0b3b7a;
  --ib5-text: #27384f;

  max-width: 720px;
  margin: 32px auto;
  border: 1px solid var(--ib5-border);
  background: #fff;
  box-sizing: border-box;
  font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

.icon-box-5__head {
  background: linear-gradient(90deg, var(--ss-color-primary) 0%, #003b86 100%);
  color: #fff;
  padding: 13px 24px;
  box-sizing: border-box;
}

.icon-box-5__label {
  display: inline-block;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.4;
}

.icon-box-5__body {
  display: flex;
  align-items: center;
  gap: 30px;
  padding: 34px 42px 36px;
  box-sizing: border-box;
}

.icon-box-5__icon {
  flex: 0 0 92px;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #ffffff 0%, #f5f9ff 45%, #eaf2ff 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}

.icon-box-5__icon svg {
  width: 50px;
  height: 50px;
  fill: none;
  stroke: var(--ib5-navy);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.icon-box-5__content {
  flex: 1;
  min-width: 0;
}

.icon-box-5__title {
  margin: 0 0 16px;
  padding-bottom: 9px;
  color: var(--ib5-navy);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Times New Roman", serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.08em;
  border-bottom: 1px solid #d6e2f3;
}

.icon-box-5__content p {
  margin: 0;
  color: var(--ib5-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 2;
  letter-spacing: 0.04em;
}

@media (max-width: 640px) {
  .icon-box-5__head {
    padding: 12px 18px;
  }

  .icon-box-5__body {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    padding: 28px 22px 30px;
  }

  .icon-box-5__icon {
    width: 82px;
    height: 82px;
    flex-basis: 82px;
  }

  .icon-box-5__icon svg {
    width: 44px;
    height: 44px;
  }

  .icon-box-5__title {
    font-size: 18px;
  }

  .icon-box-5__content p {
    font-size: 13.5px;
    line-height: 1.9;
  }
}

/* アイコンボックス6 */
.icon-box6 {
  --ib6-main: var(--ss-color-primary);
  --ib6-sub: #8baef4;
  --ib6-light: #dbe7ff;
  --ib6-text: #333;

  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 28px;
  max-width: 760px;
  margin: 24px auto;
  padding: 24px 30px 24px 24px;
  background: #fff;
  border: 1px solid var(--ib6-main);
  border-radius: 4px;
  box-sizing: border-box;
  color: var(--ib6-text);
}

.icon-box6__side {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-right: 24px;
  border-right: 1px dashed var(--ib6-light);
}

.icon-box6__main-icon {
  position: relative;
  width: 32px;
  height: 32px;
  margin-bottom: 14px;
  border: 1.5px solid var(--ib6-main);
  border-radius: 4px;
  box-sizing: border-box;
}

.icon-box6__main-icon::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 7px;
  width: 13px;
  height: 7px;
  border-left: 1.8px solid var(--ib6-main);
  border-bottom: 1.8px solid var(--ib6-main);
  transform: rotate(-45deg);
}

.icon-box6__label {
  position: relative;
  padding-bottom: 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: var(--ib6-sub);
  line-height: 1;
}

.icon-box6__label::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 38px;
  height: 1px;
  background: var(--ib6-main);
  transform: translateX(-50%);
}

.icon-box6__content {
  min-width: 0;
}

.icon-box6__title {
  display: inline-block;
  margin: 0 0 16px;
  padding-bottom: 10px;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Times New Roman", serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.06em;
  color: var(--ib6-main);
  border-bottom: 2px solid var(--ib6-light);
}

.icon-box6__list {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.icon-box6__list li {
  position: relative;
  padding-left: 24px;
  font-size: 13px;
  line-height: 1.7;
  letter-spacing: 0.02em;
}

.icon-box6__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.35em;
  width: 14px;
  height: 14px;
  border: 1.3px solid var(--ib6-sub);
  border-radius: 50%;
  box-sizing: border-box;
}

.icon-box6__list li::after {
  content: "";
  position: absolute;
  left: 4px;
  top: calc(0.35em + 4px);
  width: 6px;
  height: 3px;
  border-left: 1.3px solid var(--ib6-sub);
  border-bottom: 1.3px solid var(--ib6-sub);
  transform: rotate(-45deg);
}

@media (max-width: 600px) {
  .icon-box6 {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 22px 20px;
  }

  .icon-box6__side {
    flex-direction: row;
    justify-content: flex-start;
    gap: 14px;
    padding-right: 0;
    padding-bottom: 16px;
    border-right: none;
    border-bottom: 1px dashed var(--ib6-light);
  }

  .icon-box6__main-icon {
    margin-bottom: 0;
  }

  .icon-box6__label::after {
    width: 34px;
  }

  .icon-box6__title {
    font-size: 16px;
  }

  .icon-box6__list li {
    font-size: 13px;
  }
}

/* アイコンボックス7・8 */
.icon-box7 {
  position: relative;
  max-width: 760px;
  margin: 24px auto;
  padding: 24px 92px 26px 34px;
  background: #ffffff;
  border: 1.5px solid var(--ss-color-primary);
  border-radius: 4px;
  box-sizing: border-box;
  overflow: hidden;
  color: var(--ss-color-primary);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Times New Roman", serif;
}

.icon-box7__corner {
  position: absolute;
  top: 0;
  right: 0;
  width: 78px;
  height: 78px;
  background: var(--ss-color-primary);
  clip-path: polygon(100% 0, 100% 100%, 0 0);
}

.icon-box7__icon {
  position: absolute;
  top: 13px;
  right: 11px;
  width: 28px;
  height: 28px;
  fill: none;
  stroke: #ffffff;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.icon-box7__label {
  margin: 0 0 14px;
  color: #2c6fce;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
}

.icon-box7__title {
  margin: 0 0 20px;
  color: var(--ss-color-primary);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.03em;
}

.icon-box7__text {
  color: var(--ss-color-primary);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.9;
  letter-spacing: 0.03em;
}

.icon-box7__text p {
  margin: 0;
}

@media (max-width: 600px) {
  .icon-box7 {
    padding: 22px 72px 24px 22px;
  }

  .icon-box7__corner {
    width: 64px;
    height: 64px;
  }

  .icon-box7__icon {
    top: 10px;
    right: 9px;
    width: 24px;
    height: 24px;
  }

  .icon-box7__title {
    font-size: 19px;
  }

  .icon-box7__text {
    font-size: 13px;
  }
}

.icon-box1__icon .officepro-box-icon,
.icon-box2__icon .officepro-box-icon,
.icon-box3__icon .officepro-box-icon,
.icon-box4__icon .officepro-box-icon,
.icon-box-5__icon .officepro-box-icon,
.icon-box6__main-icon .officepro-box-icon,
.icon-box7__icon .officepro-box-icon {
  width: 62%;
  height: 62%;
  background-size: contain;
  filter: brightness(0) saturate(100%) invert(14%) sepia(58%) saturate(2650%) hue-rotate(197deg) brightness(90%) contrast(102%);
}

.icon-box7__icon .officepro-box-icon {
  width: 100%;
  height: 100%;
  filter: brightness(0) invert(1);
}

.icon-box6__main-icon .officepro-box-icon {
  position: absolute;
  inset: 6px;
  width: auto;
  height: auto;
}

.icon-box6__main-icon::before {
  display: none;
}

.icon-box1__icon .dashicons,
.icon-box2__icon .dashicons,
.icon-box3__icon .dashicons,
.icon-box4__icon .dashicons,
.icon-box-5__icon .dashicons,
.icon-box6__main-icon .dashicons,
.icon-box7__icon .dashicons {
  width: auto;
  height: auto;
  color: var(--ss-color-primary);
  font-size: 34px;
  line-height: 1;
}

.icon-box7__icon .dashicons {
  color: #ffffff;
  font-size: 28px;
}

.icon-box6__main-icon .dashicons {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 22px;
}


/* ボックス1 */
.box1 {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: 760px;
  margin: 32px auto;
  padding: 56px 72px 54px;
  background: #fff;
  border: 2px solid var(--ss-color-primary);
  color: #333;
}

.box1__label {
  position: absolute;
  top: -2px;
  left: 20px;
  min-width: 110px;
  height: 28px;
  padding: 0 24px 0 20px;
  background: var(--ss-color-primary);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: 0.18em;
  text-align: center;
  box-sizing: border-box;
  clip-path: polygon(0 0, 100% 0, calc(100% - 14px) 100%, 0 100%);
}

.box1__inner {
  max-width: 560px;
}

.box1__title {
  margin: 0 0 18px;
  color: var(--ss-color-primary);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Times New Roman", serif;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: 0.04em;
}

.box1__text {
  margin: 0;
  color: #666;
  font-size: 13px;
  line-height: 2;
  letter-spacing: 0.04em;
}

@media (max-width: 640px) {
  .box1 {
    padding: 48px 24px 36px;
    margin: 24px auto;
  }

  .box1__label {
    left: 14px;
    min-width: 96px;
    height: 26px;
    font-size: 11px;
    line-height: 26px;
  }

  .box1__title {
    font-size: 17px;
  }

  .box1__text {
    font-size: 13px;
  }

  .box1__text br {
    display: none;
  }
}

/* ボックス2 */
.box2 {
  width: 100%;
  max-width: 760px;
  margin: 32px auto;
  padding: 12px;
  border: 1px solid var(--ss-color-primary);
  background: #fff;
  box-sizing: border-box;
}

.box2__inner {
  border: 1px solid #8BAEF4;
  background: #fff;
  padding: 72px 64px;
  box-sizing: border-box;
}

.box2__content {
  max-width: 540px;
  margin: 0 auto;
  text-align: left;
}

.box2__content h3 {
  margin: 0 0 24px;
  color: var(--ss-color-primary);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Times New Roman", serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: 0.06em;
}

.box2__content p {
  margin: 0;
  color: #555;
  font-size: 14px;
  line-height: 2.1;
  letter-spacing: 0.06em;
}

.box2__content ul,
.box2__content ol {
  margin: 20px 0 0;
  padding-left: 1.4em;
  color: #555;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

.box2__content .wp-block-button,
.box2__content .button {
  margin-top: 28px;
}

@media (max-width: 600px) {
  .box2 {
    padding: 9px;
    margin: 24px auto;
  }

  .box2__inner {
    padding: 48px 24px;
  }

  .box2__content h3 {
    font-size: 18px;
    margin-bottom: 18px;
  }

  .box2__content p {
    font-size: 13px;
    line-height: 2;
  }

  .box2__content p br {
    display: none;
  }
}

/* ボックス3 */
.box3 {
  width: 100%;
  box-sizing: border-box;
  padding: 0;
  margin: 32px 0;
}

.box3__inner {
  box-sizing: border-box;
  width: 100%;
  padding: 44px 42px;
  border: 1px solid #8BAEF4;
  border-radius: 6px;
  background:
    radial-gradient(circle at 18% 18%, rgba(139, 174, 244, 0.16), transparent 34%),
    radial-gradient(circle at 82% 78%, rgba(139, 174, 244, 0.12), transparent 36%),
    linear-gradient(135deg, #ffffff 0%, #f8fbff 48%, #f1f6ff 100%);
}

.box3__title {
  margin: 0 0 18px;
  color: var(--ss-color-primary);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Times New Roman", serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.04em;
}

.box3__content {
  color: #555;
  font-size: 13px;
  line-height: 2;
  letter-spacing: 0.05em;
}

.box3__content p {
  margin: 0;
}

@media (max-width: 600px) {
  .box3__inner {
    padding: 32px 24px;
  }

  .box3__title {
    font-size: 16px;
    margin-bottom: 14px;
  }

  .box3__content {
    font-size: 12px;
    line-height: 1.9;
  }

  .box3__content br {
    display: none;
  }
}

/* ボックス4 */
.box4 {
  width: 100%;
  max-width: 760px;
  margin: 32px auto;
  padding: 0;
  background: #ffffff;
  border: 1px solid #b8c8e6;
  border-bottom: 7px solid var(--ss-color-primary);
  box-sizing: border-box;
}

.box4__inner {
  padding: 46px 36px 42px;
  text-align: center;
}

.box4__title {
  margin: 0 0 20px;
  color: var(--ss-color-primary);
  font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.04em;
}

.box4__text {
  margin: 0;
  color: #666666;
  font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 2.1;
  letter-spacing: 0.04em;
}

@media screen and (max-width: 600px) {
  .box4 {
    margin: 24px auto;
  }

  .box4__inner {
    padding: 34px 22px 32px;
  }

  .box4__title {
    font-size: 18px;
    margin-bottom: 16px;
  }

  .box4__text {
    font-size: 12.5px;
    line-height: 2;
  }

  .box4__text br {
    display: none;
  }
}

/* ボックス5 */
.box5 {
  position: relative;
  width: 100%;
  box-sizing: border-box;
  padding: 48px 56px 48px 78px;
  border: 1px solid var(--ss-color-primary);
  background: #fff;
  color: #333;
}

.box5::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 9px;
  height: 100%;
  background: var(--ss-color-primary);
}

.box5__inner {
  max-width: 720px;
}

.box5__title {
  margin: 0 0 18px;
  color: var(--ss-color-primary);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Times New Roman", serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.06em;
}

.box5__text {
  margin: 0;
  color: #555;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

@media (max-width: 600px) {
  .box5 {
    padding: 36px 24px 36px 38px;
  }

  .box5::before {
    width: 7px;
  }

  .box5__title {
    font-size: 18px;
  }

  .box5__text {
    font-size: 13px;
    line-height: 1.9;
  }

  .box5__text br {
    display: none;
  }
}

/* ボックス6 */
.box6 {
  width: 100%;
  max-width: 760px;
  margin: 32px auto;
  background: #fff;
  border: 1px solid rgba(139, 174, 244, 0.45);
  border-top: 7px solid var(--ss-color-primary);
  box-shadow:
    0 0 0 1px rgba(2, 50, 108, 0.03),
    inset 0 0 34px rgba(139, 174, 244, 0.14);
  box-sizing: border-box;
}

.box6-inner {
  padding: 48px 72px 46px;
}

.box6-title {
  margin: 0 0 18px;
  color: var(--ss-color-primary);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.04em;
}

.box6-content {
  color: #4f5f73;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

.box6-content p {
  margin: 0;
}

.box6-content ul,
.box6-content ol {
  margin: 12px 0 0;
  padding-left: 1.4em;
}

.box6-content img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 20px 0 0;
}

@media (max-width: 600px) {
  .box6 {
    margin: 24px auto;
    border-top-width: 6px;
  }

  .box6-inner {
    padding: 34px 24px 32px;
  }

  .box6-title {
    font-size: 18px;
  }

  .box6-content {
    font-size: 13px;
    line-height: 1.9;
  }

  .box6-content p br {
    display: none;
  }
}

/* ボックス7 */
.box7 {
  position: relative;
  background: #ffffff;
  border: 1px solid #d8e4f2;
  padding: 52px 64px;
  margin: 32px 0;
  box-sizing: border-box;
  color: #333333;
}

.box7::before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  width: 54px;
  height: 42px;
  border-top: 3px solid var(--ss-color-primary);
  border-left: 3px solid var(--ss-color-primary);
  box-sizing: border-box;
}

.box7::after {
  content: "";
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 54px;
  height: 42px;
  border-right: 3px solid var(--ss-color-primary);
  border-bottom: 3px solid var(--ss-color-primary);
  box-sizing: border-box;
}

.box7__inner {
  max-width: 720px;
}

.box7__title {
  margin: 0 0 16px;
  color: var(--ss-color-primary);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: 0.04em;
  font-family: "Times New Roman", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "HGS明朝E", serif;
}

.box7__text {
  margin: 0;
  color: #6f7680;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

@media (max-width: 600px) {
  .box7 {
    padding: 40px 28px;
  }

  .box7::before,
  .box7::after {
    width: 42px;
    height: 34px;
  }

  .box7__title {
    font-size: 18px;
  }

  .box7__text {
    font-size: 13px;
  }
}

/* ボックス8 */
.box8 {
  width: 100%;
  max-width: 760px;
  margin: 32px auto;
  border: 1px solid var(--ss-color-primary);
  background: #fff;
  box-sizing: border-box;
  overflow: hidden;
}

.box8__mini-heading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  height: 34px;
  background: linear-gradient(90deg, #f3f8fc 0%, #ffffff 50%, #f3f8fc 100%);
  color: var(--ss-color-primary);
  font-family: "Times New Roman", "Yu Mincho", "YuMincho", serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  line-height: 1;
}

.box8__mini-heading::before,
.box8__mini-heading::after {
  content: "";
  display: block;
  width: 42px;
  height: 1px;
  background: #8BAEF4;
  opacity: 1;
}

.box8__content {
  padding: 38px 96px 48px;
}

.box8__title {
  margin: 0 0 16px;
  color: var(--ss-color-primary);
  font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.04em;
}

.box8__text {
  margin: 0;
  color: #555;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

@media (max-width: 640px) {
  .box8 {
    margin: 24px auto;
  }

  .box8__mini-heading {
    gap: 12px;
    font-size: 10px;
  }

  .box8__mini-heading::before,
  .box8__mini-heading::after {
    width: 28px;
  }

  .box8__content {
    padding: 30px 24px 36px;
  }

  .box8__title {
    font-size: 18px;
  }

  .box8__text {
    font-size: 13px;
  }
}

/* ボックス9 */
.box9 {
  --box9-navy: var(--ss-color-primary);
  --box9-blue: #8BAEF4;
  --box9-light-blue: #EAF2FF;
  --box9-border: #9DB8F4;
  --box9-gray: #BFC5CE;

  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: 760px;
  margin: 40px auto;
  padding: 46px 56px 64px;
  background: #fff;
  border: 1.5px solid var(--box9-border);
  border-radius: 4px 4px 2px 2px;
  box-shadow: 0 12px 24px rgba(2, 50, 108, 0.08);
  overflow: visible;
}

.box9::before {
  content: "";
  position: absolute;
  top: -1.5px;
  right: -1.5px;
  width: 34px;
  height: 34px;
  background: linear-gradient(135deg, #F8FBFF 0%, #DDE9FF 45%, #8BAEF4 100%);
  clip-path: polygon(100% 0, 100% 100%, 0 0);
  border-top-right-radius: 4px;
  box-shadow: -2px 2px 4px rgba(2, 50, 108, 0.12);
}

.box9::after {
  content: "";
  position: absolute;
  left: -4px;
  right: -4px;
  bottom: -9px;
  height: 9px;
  background: linear-gradient(to bottom, #D9E7FF, #BFD3FB);
  border: 1px solid #AFC7F6;
  border-radius: 0 0 6px 6px;
  box-shadow: 0 3px 6px rgba(2, 50, 108, 0.18);
  z-index: 0;
}

.box9__inner {
  position: relative;
  z-index: 2;
}

.box9__title {
  position: relative;
  margin: 0 0 22px;
  padding-bottom: 13px;
  color: var(--box9-navy);
  font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.04em;
}

.box9__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 56px;
  height: 2px;
  background: var(--box9-blue);
  border-radius: 999px;
}

.box9__content {
  color: #243247;
  font-size: 0.95rem;
  line-height: 2;
  letter-spacing: 0.03em;
}

.box9__content p {
  margin: 0;
}

.box9__tabs {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  height: 22px;
  z-index: 3;
  pointer-events: none;
}

.box9__tab {
  position: absolute;
  bottom: 0;
  display: block;
  height: 9px;
  border-radius: 2px 2px 0 0;
}

.box9__tab--navy {
  left: 19%;
  width: 58px;
  background: var(--box9-navy);
}

.box9__tab--blue {
  left: 30%;
  width: 58px;
  background: var(--box9-blue);
}

.box9__tab--gray {
  left: 42%;
  width: 62px;
  background: var(--box9-gray);
}

.box9__tab--right {
  right: 16%;
  width: 76px;
  height: 18px;
  background: #AFC7F6;
  border-radius: 4px 4px 0 0;
}

@media (max-width: 600px) {
  .box9 {
    margin: 32px auto;
    padding: 36px 24px 58px;
  }

  .box9::before {
    width: 28px;
    height: 28px;
  }

  .box9__title {
    font-size: 1.08rem;
  }

  .box9__content {
    font-size: 0.9rem;
  }

  .box9__tab--navy {
    left: 14%;
    width: 42px;
  }

  .box9__tab--blue {
    left: 29%;
    width: 42px;
  }

  .box9__tab--gray {
    left: 44%;
    width: 46px;
  }

  .box9__tab--right {
    right: 10%;
    width: 58px;
  }
}

/* ボックス10：黒板風ボックス */
.box10 {
  max-width: 760px;
  margin: 32px auto;
  padding: 12px;
  border-radius: 3px;
  background:
    linear-gradient(90deg, rgba(255,255,255,.14), rgba(0,0,0,.08), rgba(255,255,255,.08)),
    repeating-linear-gradient(
      90deg,
      #8a603d 0,
      #9b6d46 18px,
      #7b5233 36px
    );
  box-shadow:
    0 4px 10px rgba(0, 0, 0, .28),
    inset 0 0 0 1px rgba(255, 255, 255, .22);
}

.box10__board {
  position: relative;
  overflow: hidden;
  min-height: 260px;
  padding: 58px 82px 56px;
  border-radius: 2px;
  color: #fff;
  background:
    radial-gradient(circle at 25% 20%, rgba(255,255,255,.05), transparent 28%),
    radial-gradient(circle at 80% 75%, rgba(255,255,255,.04), transparent 30%),
    linear-gradient(135deg, rgba(255,255,255,.035), transparent 35%),
    #092638;
  box-shadow:
    inset 0 0 26px rgba(0, 0, 0, .65),
    inset 0 0 0 1px rgba(255, 255, 255, .16);
}

.box10__board::before {
  content: "";
  position: absolute;
  inset: 16px;
  border: 1px solid rgba(230, 222, 204, .72);
  border-radius: 3px;
  pointer-events: none;
}

.box10__board::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(255,255,255,.025) 0,
      rgba(255,255,255,.025) 1px,
      transparent 1px,
      transparent 5px
    );
  opacity: .45;
  pointer-events: none;
}

.box10__content {
  position: relative;
  z-index: 2;
}

.box10__content h3 {
  margin: 0 0 24px;
  color: #fff;
  font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", "Times New Roman", serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: .08em;
}

.box10__content h3::after {
  content: "";
  display: block;
  width: 62px;
  height: 1px;
  margin-top: 10px;
  background: rgba(255, 255, 255, .85);
}

.box10__content p {
  margin: 0;
  color: rgba(255, 255, 255, .92);
  font-size: 14px;
  line-height: 2;
  letter-spacing: .06em;
}

.box10__corner {
  position: absolute;
  z-index: 2;
  width: 34px;
  height: 34px;
  pointer-events: none;
}

.box10__corner::before,
.box10__corner::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border-color: rgba(230, 222, 204, .72);
  border-style: solid;
}

.box10__corner--tl {
  top: 18px;
  left: 18px;
  border-top: 1px solid rgba(230, 222, 204, .72);
  border-left: 1px solid rgba(230, 222, 204, .72);
}

.box10__corner--tl::before {
  top: 4px;
  left: 4px;
  border-width: 1px 0 0 1px;
  border-radius: 8px 0 0 0;
}

.box10__corner--tl::after {
  top: -3px;
  left: -3px;
  border-width: 0 1px 1px 0;
  border-radius: 0 0 8px 0;
}

.box10__corner--tr {
  top: 18px;
  right: 18px;
  border-top: 1px solid rgba(230, 222, 204, .72);
  border-right: 1px solid rgba(230, 222, 204, .72);
}

.box10__corner--tr::before {
  top: 4px;
  right: 4px;
  border-width: 1px 1px 0 0;
  border-radius: 0 8px 0 0;
}

.box10__corner--tr::after {
  top: -3px;
  right: -3px;
  border-width: 0 0 1px 1px;
  border-radius: 0 0 0 8px;
}

.box10__corner--bl {
  bottom: 18px;
  left: 18px;
  border-bottom: 1px solid rgba(230, 222, 204, .72);
  border-left: 1px solid rgba(230, 222, 204, .72);
}

.box10__corner--bl::before {
  bottom: 4px;
  left: 4px;
  border-width: 0 0 1px 1px;
  border-radius: 0 0 0 8px;
}

.box10__corner--bl::after {
  bottom: -3px;
  left: -3px;
  border-width: 1px 1px 0 0;
  border-radius: 0 8px 0 0;
}

.box10__corner--br {
  right: 18px;
  bottom: 18px;
  border-right: 1px solid rgba(230, 222, 204, .72);
  border-bottom: 1px solid rgba(230, 222, 204, .72);
}

.box10__corner--br::before {
  right: 4px;
  bottom: 4px;
  border-width: 0 1px 1px 0;
  border-radius: 0 0 8px 0;
}

.box10__corner--br::after {
  right: -3px;
  bottom: -3px;
  border-width: 1px 0 0 1px;
  border-radius: 8px 0 0 0;
}

.box10__chalks {
  position: absolute;
  right: 70px;
  bottom: 3px;
  z-index: 3;
  display: flex;
  align-items: flex-end;
  gap: 10px;
}

.box10__chalk {
  display: block;
  height: 8px;
  border-radius: 3px 3px 1px 1px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}

.box10__chalk--white {
  width: 48px;
  background: #f3eee6;
}

.box10__chalk--blue {
  width: 58px;
  height: 14px;
  background: #5d8bd7;
}

@media (max-width: 600px) {
  .box10 {
    padding: 8px;
  }

  .box10__board {
    min-height: auto;
    padding: 44px 28px 48px;
  }

  .box10__board::before {
    inset: 12px;
  }

  .box10__content h3 {
    font-size: 18px;
  }

  .box10__content p {
    font-size: 13px;
    line-height: 1.9;
  }

  .box10__chalks {
    right: 36px;
  }

  .box10__chalk--white {
    width: 34px;
  }

  .box10__chalk--blue {
    width: 42px;
  }
}

/* ボックス11：ノート用紙風デザイン */
.box11 {
  position: relative;
  max-width: 760px;
  margin: 32px auto;
  padding: 42px 36px 38px 76px;
  border: 1px solid #d7dde5;
  border-radius: 8px;
  color: #333;
  background-color: #fbfbfa;
  background-image:
    repeating-linear-gradient(
      to bottom,
      transparent 0,
      transparent 18px,
      #dfe5ec 19px
    );
  box-shadow: 0 4px 12px rgba(2, 50, 108, 0.12);
  overflow: hidden;
  box-sizing: border-box;
}

.box11::before {
  content: "";
  position: absolute;
  top: 0;
  left: 44px;
  width: 1px;
  height: 100%;
  background: #ef9aa8;
}

.box11::after {
  content: "";
  position: absolute;
  top: 30px;
  left: 0;
  width: 100%;
  height: 1px;
  background: #cfd8e3;
}

.box11-meta {
  position: absolute;
  top: 12px;
  right: 72px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 9px;
  line-height: 1.2;
  color: #a8adb5;
  letter-spacing: 0.02em;
}

.box11-content {
  position: relative;
  z-index: 1;
}

.box11 h3 {
  display: inline-block;
  margin: 0 0 18px;
  padding-bottom: 5px;
  border-bottom: 2px solid #8baef4;
  color: var(--ss-color-primary);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.04em;
}

.box11 p {
  margin: 0;
  color: #333;
  font-size: 14px;
  font-weight: 500;
  line-height: 2.05;
  letter-spacing: 0.04em;
}

.box11 ul,
.box11 ol {
  margin: 0;
  padding-left: 1.4em;
  font-size: 14px;
  line-height: 2;
}

@media (max-width: 600px) {
  .box11 {
    padding: 40px 22px 32px 58px;
  }

  .box11::before {
    left: 32px;
  }

  .box11-meta {
    right: 36px;
  }

  .box11 h3 {
    font-size: 19px;
  }

  .box11 p {
    font-size: 13px;
    line-height: 2;
  }
}

/* ボックス12 */
.box12 {
  --box12-navy: var(--ss-color-primary);
  --box12-blue: #8baef4;
  --box12-grid: rgba(139, 174, 244, 0.18);

  position: relative;
  margin: 32px 0;
  padding: 44px 52px;
  border: 1px solid rgba(139, 174, 244, 0.9);
  border-radius: 2px;
  background-color: #fff;
  background-image:
    linear-gradient(var(--box12-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--box12-grid) 1px, transparent 1px);
  background-size: 12px 12px;
  box-shadow:
    0 0 0 4px rgba(139, 174, 244, 0.18),
    0 6px 16px rgba(2, 50, 108, 0.08);
  box-sizing: border-box;
}

.box12::before {
  content: "";
  position: absolute;
  inset: 9px;
  border: 1px solid rgba(139, 174, 244, 0.45);
  pointer-events: none;
}

.box12__corner {
  position: absolute;
  z-index: 2;
  width: 16px;
  height: 16px;
  border-color: var(--box12-blue);
  pointer-events: none;
}

.box12__corner--tl {
  top: 14px;
  left: 14px;
  border-top: 2px solid;
  border-left: 2px solid;
}

.box12__corner--tr {
  top: 14px;
  right: 14px;
  border-top: 2px solid;
  border-right: 2px solid;
}

.box12__corner--bl {
  bottom: 14px;
  left: 14px;
  border-bottom: 2px solid;
  border-left: 2px solid;
}

.box12__corner--br {
  right: 14px;
  bottom: 14px;
  border-right: 2px solid;
  border-bottom: 2px solid;
}

.box12__content {
  position: relative;
  z-index: 1;
  color: #1f2937;
}

.box12__content h3 {
  margin: 0 0 22px;
  padding-bottom: 12px;
  color: var(--box12-navy);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Times New Roman", serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.06em;
  position: relative;
}

.box12__content h3::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 34px;
  height: 2px;
  background-color: var(--box12-navy);
}

.box12__content p {
  margin: 0;
  color: #333;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

.box12__content ul,
.box12__content ol {
  margin: 16px 0 0;
  padding-left: 1.4em;
  color: #333;
  font-size: 14px;
  line-height: 1.9;
}

.box12__content li + li {
  margin-top: 6px;
}

@media (max-width: 600px) {
  .box12 {
    padding: 36px 24px;
    background-size: 10px 10px;
  }

  .box12__content h3 {
    font-size: 18px;
  }

  .box12__content p,
  .box12__content ul,
  .box12__content ol {
    font-size: 13.5px;
  }
}

:where(
  .box1__text,
  .box3__content,
  .box4__text,
  .box5__text,
  .box6-content,
  .box7__text,
  .box8__text,
  .box9__content,
  .box10__content,
  .box11-content,
  .box12__content
) > *:first-child,
:where(
  .box1__text,
  .box3__content,
  .box4__text,
  .box5__text,
  .box6-content,
  .box7__text,
  .box8__text,
  .box9__content,
  .box10__content,
  .box11-content,
  .box12__content
) .block-editor-block-list__layout > *:first-child {
  margin-top: 0;
}

:where(
  .box1__text,
  .box3__content,
  .box4__text,
  .box5__text,
  .box6-content,
  .box7__text,
  .box8__text,
  .box9__content,
  .box10__content,
  .box11-content,
  .box12__content
) > *:last-child,
:where(
  .box1__text,
  .box3__content,
  .box4__text,
  .box5__text,
  .box6-content,
  .box7__text,
  .box8__text,
  .box9__content,
  .box10__content,
  .box11-content,
  .box12__content
) .block-editor-block-list__layout > *:last-child {
  margin-bottom: 0;
}

:where(
  .box1__text,
  .box3__content,
  .box4__text,
  .box5__text,
  .box6-content,
  .box7__text,
  .box8__text,
  .box9__content,
  .box10__content,
  .box11-content,
  .box12__content
) .block-editor-inner-blocks {
  color: inherit;
  font: inherit;
  line-height: inherit;
  letter-spacing: inherit;
}


.wp-chat-block {.wp-chat-block {
  --chat-main-color: #0b3f98;
  --chat-border-color: #b9c9df;
  --chat-text-color: #333;
  --chat-bg-color: #fff;
  --chat-name-color: #2f5fa8;
  --chat-icon-bg: #f8fafc;
  --chat-icon-border: #d6dce5;

  display: flex;
  flex-direction: column;
  gap: 22px;
  margin: 32px 0;
}

.wp-chat-block .wp-chat-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.wp-chat-block .wp-chat-profile {
  flex-shrink: 0;
  width: 76px;
  text-align: center;
}

.wp-chat-block .wp-chat-icon {
  width: 62px;
  height: 62px;
  margin: 0 auto 6px;
  background: var(--chat-icon-bg);
  background-position: center;
  background-size: cover;
  border: 3px solid var(--chat-icon-border);
  border-radius: 50%;
}

.wp-chat-block .wp-chat-name {
  color: var(--chat-name-color);
  font-size: 13px;
  font-weight: 700;
}

.wp-chat-block .wp-chat-bubble {
  position: relative;
  width: min(100%, 620px);
  color: var(--chat-text-color);
  background: var(--chat-bg-color);
  border: 1px solid var(--chat-border-color);
  border-radius: 4px;
}

.wp-chat-block .wp-chat-label {
  position: relative;
  margin: -1px -1px 0;
  padding: 8px 18px;
  color: #fff;
  background: var(--chat-main-color);
  border-radius: 4px 4px 0 0;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.wp-chat-block .wp-chat-label::after {
  content: "•••";
  position: absolute;
  top: 50%;
  right: 14px;
  font-size: 14px;
  letter-spacing: 3px;
  transform: translateY(-50%);
}

.wp-chat-block .wp-chat-text {
  min-height: 56px;
  padding: 18px 22px;
  font-size: 15px;
  line-height: 1.9;
}

.wp-chat-block .wp-chat-text > *:first-child {
  margin-top: 0;
}

.wp-chat-block .wp-chat-text > *:last-child {
  margin-bottom: 0;
}

.wp-chat-block .wp-chat-left .wp-chat-bubble::before {
  content: "";
  position: absolute;
  top: 42px;
  left: -11px;
  border-top: 9px solid transparent;
  border-right: 11px solid var(--chat-border-color);
  border-bottom: 9px solid transparent;
}

.wp-chat-block .wp-chat-left .wp-chat-bubble::after {
  content: "";
  position: absolute;
  top: 43px;
  left: -9px;
  border-top: 8px solid transparent;
  border-right: 10px solid var(--chat-bg-color);
  border-bottom: 8px solid transparent;
}

@media (max-width: 640px) {
  .wp-chat-block .wp-chat-item {
    gap: 10px;
  }

  .wp-chat-block .wp-chat-profile {
    width: 58px;
  }

  .wp-chat-block .wp-chat-icon {
    width: 50px;
    height: 50px;
  }

  .wp-chat-block .wp-chat-name {
    font-size: 12px;
  }

  .wp-chat-block .wp-chat-bubble {
    width: calc(100% - 68px);
  }

  .wp-chat-block .wp-chat-label {
    padding: 7px 14px;
    font-size: 13px;
  }

  .wp-chat-block .wp-chat-text {
    padding: 14px 16px;
    font-size: 14px;
    line-height: 1.8;
  }
}

/* Final typography layer */
.entry-content,
.editor-styles-wrapper,
.entry-content p,
.entry-content li,
.entry-content td,
.editor-styles-wrapper p,
.editor-styles-wrapper li,
.editor-styles-wrapper td {
  font-family: var(--ss-font-body) !important;
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6,
.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3,
.editor-styles-wrapper h4,
.editor-styles-wrapper h5,
.editor-styles-wrapper h6,
.officepro-block-heading,
.officepro-block-heading__title,
.design-heading-01__text,
.design-heading-03__text,
.icon-box1__title,
.icon-box2__title,
.icon-box3__title,
.icon-box4__title,
.icon-box-5__title,
.icon-box6__title,
.icon-box7__title,
.box1__title,
.box2__content h3,
.box3__title,
.box4__title,
.box5__title,
.box6-title,
.box7__title,
.box8__title,
.box9__title,
.box10__content h3,
.box11-content h3,
.box12__content h3,
.blog-card01__title,
.blog-card2__title,
.blog-card3__title,
.blog-card4__title,
.blog-card5__title,
.officepro-blog-card-compact__title,
.compare-table1__plan-name,
.compare-table3-row-label,
.compare-table5__title,
.wp-profile-block01__name,
.tax-profile02__name,
.profile-block3__name,
.speech-1-1__name,
.speech-1-2__name,
.speech2-1-name,
.speech2-2-name,
.speech3-1-avatar__name,
.speech3-2-avatar__name,
.speech-bubble4-1__name,
.speech-bubble4-2__name {
  font-family: var(--ss-font-heading) !important;
}
