@charset "UTF-8";

/* =========================================================================
   lp_kyoudo.css — 強度設計入門講座 LP（旧→新変換）
   lp_koso-basic.css（正マスター）を丸ごと複製し、アクセント色を強度設計LPの
   ブランド色（旧 style_kyodo.css 主要色 #007D73 系ティール）へ差し替えたもの。
   構造・寸法はマスターと同一。共通挙動・全LP共通の状態色は lp_editor.css に集約。
   旧本文ラッパー: #kyoudosekkei（固定ページID 5391 / test=monoweb.org 本番=d-monoweb.com）
   ========================================================================= */

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

a {
  transition: all .1s ease-in-out;
}

@media screen and (min-width: 768px) {
  .is-sp {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .is-pc {
    display: none;
  }
}

.lp-body {
  background-color: #FFF;
}

.lp-body h4::after {
  display: none;
}

/* 2026-08-02 CSS監査: .head-img と .head-img img を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

.l-header {
  position: relative;
  width: 100%;
	z-index: 100;
	background:#fff;
}

/* トップページと同じ最上部の細い帯（サイト説明バー） */
.l-header::before {
  content: "機械設計スキルをステップ式で身につける、eラーニング中心のWeb学習塾";
  display: block;
  width: 100%;
  height: 20px;
  line-height: 20px;
  background-color: #007D73;
  color: #fff;
  font-size: 11px;
  text-align: left;
  padding-left: max((100% - 960px) / 2, 10%);
  box-sizing: border-box;
}

.p-header__inner {
	width: 80%;
	max-width: 960px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  background-color: #FFF;
  margin: 0 auto;
  box-sizing: border-box;
  height: 80px;
  /*padding: 0 100px 0 10px;*/
}

/* @media screen and (max-width: 950px) {
  .p-header__inner {
    height: 86px;
    width:100%;
    padding: 0 100px 0 10px;
  }
} */

@media screen and (max-width: 767px) {
  .p-header__inner {
    height: 86px;
    width:100%;
    padding: 0 10px;
  }
}

@media screen and (min-width: 767px) and (max-width: 950px) {
  .p-header__list {
    margin-right: calc(30px - 1%);
  }
}

@media screen and (min-width: 1250px) {
  .p-header__inner {
    padding: 0;
  }
}

.p-header__logo-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-left: -16px;
}

@media screen and (max-width: 950px) {
  .p-header__logo-container {
    flex-direction: column;
    gap: 0;
    align-items: flex-start;
    margin-left: 0;
  }
}

.p-header__logo {
  width: 210px;
  height: fit-content;
}

@media screen and (max-width: 950px) {
  .p-header__logo {
    width: 180px;
  }
}

.p-header__logo img {
  width: 100%;
  height: auto;
}

.p-header__logo-text {
  font-size: 12px;
  text-align: left;
}

@media screen and (max-width: 950px) {
  .p-header__logo-text {
    font-size: 10px;
    margin-top: -7px;
    white-space: nowrap;
  }
}

.p-header__list {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 950px) {
  .p-header__list {
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
  }
}

.p-header__list a {
  font-size: 16px;
  text-decoration: none;
  color: #3A3A3A;
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 0 24px;
}

@media screen and (max-width: 950px) {
  .p-header__list a {
    font-size: 12px;
    padding: 0;
  }
}

@media screen and (max-width: 767px) {
  .p-header__list a {
    font-size: 11px;
  }
}

@media screen and (min-width: 951px) {
  .p-header__list li:first-of-type {
    border-right: 1px solid #3A3A3A;
  }
}

.p-header__item-link:hover {
  background-color: #f0f4f9;
}

.p-header__item-icon {
  width: 24px;
  height: 24px;
}

.p-header__item-icon2 {
  width: 21px;
  height: 21px;
}

.p-header__item-icon img {
  width: 100%;
}

/* ===== ヘッダーナビ: 色のみ（構造は lp_editor.css に集約 2026-07-20）。色はLPごとに変更可 ===== */
.p-header__inner__bottom {
  background-color: #E3F1ED;      /* 260721 メニュー背景を少し濃く（機能編と統一） */
  border-bottom: 1px solid #8AD6CC; /* 260721 メニュー下に1px線 */
}

body.lp-fixed .p-header__inner__bottom {
  background-color: #FFFFFF;
  border-bottom: 1px solid #D6EAE3;
  box-shadow: 0 2px 6px rgba(20, 60, 90, .06);
}
body.lp-fixed .p-header__inner__bottom .nav-current {
  color: #007D73;
}
body.lp-fixed .p-header__inner__bottom .nav-current::after {
  background: #007D73;
}

.p-header__inner__bottom a {
  color: #007D73;
}

@media screen and (max-width: 950px) {
  .p-header__list__bottom {
    background: #F2FBF8;
  }
}

.p-header__list__bottom a {
  color: #3A3A3A;
}

.p-header__list__bottom a:hover {
  color: #ff0000;
}

.p-header__float {
  position: fixed;
  top: 0;
  right: 0;
  background-color: #F26700;
  color: #FFF;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-weight: 700;
  letter-spacing: 1px;
  gap: 0;
  width: 156px;
  height: 48px;
  border-radius: 0 0 0 10px;
  padding: 0;
  white-space: nowrap;
  box-sizing: border-box;
}

.p-header__float::after {
  content: none;
}

.p-header__float:hover {
  background: #CC4E16;
}

.p-header__float-text {
  font-size: 0;
}

.p-header__float-text::after {
  content: "お見積もり依頼";
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 1px;
}

/* タブレット(iPad)・スマホでは お見積り依頼ボタンを非表示 */
@media screen and (max-width: 1024px) {
  .p-header__float {
    /*width: 92px;
    font-size: 12px;
    height: 96px;
	  padding-bottom: 5px;*/
	  display:none;
  }
}

@media screen and (min-width: 1200px) {
  .p-header__float {
    gap: 5px;
    padding: 0;
  }
}

.p-header__float-icon {
  width: 26px;
  display: none;
}

.p-header__float-icon img {
  width: 100%;
}

@media screen and (max-width: 950px) {
  .p-header__float-icon {
    width: 40px;
  }
}

.lp-mv {
	width: 100%;
	text-align:center;
	background:none; /* koso の bg_mv.jpg 背景を削除（強度設計は使わない・映り込み対策） */
	padding:30px 0 0;
}

@media screen and (max-width: 767px) {
  .lp-mv {
		background:none;
		margin-top: 24px;
		padding:0;
  }
}

.lp-mv img {
	width: 80%;
	max-width:1200px;
}

@media screen and (max-width: 767px) {
.lp-mv img {
	width: 100%;
}
}

.lp-mv h2 {
  color: #007D73;
  background-color: #DEF0EC;
  /*font-size: 72px;*/
  font-size: clamp(28px, 4vw, 64px);
  margin-top: -6px;
  text-align: center;
  letter-spacing: 4px;
  line-height: 1.6;
}

@media screen and (max-width: 767px) {
  .lp-mv h2 {
    font-size: 32px;
    padding: .3em 0;
    line-height: 1.4;
  }
}

.lp-mv h2 span {
  /*font-size: 44px;*/
  font-size: clamp(21px, 3vw, 48px);
}

@media screen and (max-width: 767px) {
  .lp-mv h2 span {
    font-size: 24px;
    display: block;
  }
}

.lp-cta-sec {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #F5F5F5;
  padding: 46px 0 40px 0;
}

.cta-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 80%;
  max-width: 680px;
	text-align: center;
	margin:0 auto;
}

@media screen and (max-width: 767px) {
  .cta-box {
    width: calc(100% - 20px);
  }
}

.cta-links {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
}

/* キャンペーン: PCの斜めリボンを廃止し、ヒーロー上部の横帯（.cp_bar）に置き換え */
.cp_flag.hp-pc_only {
  display: none !important;
}

.cp_bar {
  width: 100%;
  background: #1C7E76;
  color: #fff;
  padding: 24px 16px;
  box-sizing: border-box;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .cp_bar.hp-pc_only { display: block; }
}
.cp_bar__inner {
  max-width: 960px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  white-space: nowrap;
}
.cp_bar__label {
  font-size: 17px;
  background: #fff;
  color: #555;
  padding: 6px 16px;
  border-radius: 6px;
  font-weight: 800;
  letter-spacing: 1px;
}
.cp_bar__main { font-size: 24px; }
.cp_bar__main b { font-size: 36px; color: #FFE24D; margin-left: 6px; }
.cp_bar__sep { width: 1px; height: 34px; background: rgba(255, 255, 255, .5); }
.cp_bar__date { font-size: 24px; font-weight: 800; }
.cp_bar__days {
  font-size: 18px;
  background: #FFE24D;
  color: #8A5700;
  padding: 7px 16px;
  border-radius: 999px;
  font-weight: 800;
}

.over-cta {
  font-size: 29px;
  letter-spacing: 2px;
  font-weight: 600;
  color: #E9682C;
  margin-bottom: 23px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .over-cta {
    background: linear-gradient(transparent 50%,#FFF242 50%,#FFF242 100%);
    font-size: clamp(14px, -0.202rem + 5.38vw, 21px);
  }
}

@media screen and (max-width: 400px) {
  .over-cta {
    font-size: clamp(16px, 0.5rem + 2.5vw, 18px);
  }
}

@media screen and (min-width: 768px) {
  .over-cta:before, .over-cta:after {
    color: #3A3A3A;
    position: absolute;
  }

  .over-cta:before {
    content: '＼';
    margin-left: -1.1em;
    transform: rotate(20deg);
  }

  .over-cta:after {
    content: '／';
    margin-left: -.2em;
    transform: rotate(-20deg);
  }
}


.lp-cta {
  background-color: #BB261A;
  color: #FFF !important;
  border-radius: 84px;
  font-size: 32px;
  font-weight: 600;
  padding: 5% 7%;
  text-decoration: none;
  display: block;
  box-sizing: border-box;
  width: 100%;
  letter-spacing: 2px;
  margin-bottom: 27px;
  transition: all 0.3s ease;
}

.lp-cta:hover {
  background: linear-gradient(135deg, #BB261A 0%, #c53030 100%);
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(197, 48, 48, 0.5);
}

@media screen and (max-width: 767px) {
  .lp-cta {
    height: 85px;
    padding: 0 7%;
    line-height: 85px;
    font-size: clamp(14px, -0.125rem + 5vw, 22px);
  }
}

.lp-body #kyoudosekkei .popup-text {
  padding: 0;
  box-sizing: border-box;
  text-align: left;
}

.lp-body #kyoudosekkei #infoPopup h2.faq-popup-title {
  width: auto;
  max-width: none;
  padding: 0;
  background: transparent;
  border: 0;
  letter-spacing: 0.02em;
  margin: 0 42px 24px;
  color: #007d73;
  font-size: 26px;
  font-weight: 800;
  line-height: 1.5;
  text-align: center;
}

.lp-body #kyoudosekkei #infoPopup h2.faq-popup-title::before {
  content: none;
  display: none;
}

.lp-body #kyoudosekkei .faq-popup-list {
  display: grid;
  gap: 12px;
}

.lp-body #kyoudosekkei .faq-popup-item {
  margin: 0;
  padding: 18px 20px;
  border: 1px solid #d7e9e5;
  border-radius: 10px;
  background: #f7fbfa;
}

.lp-body #kyoudosekkei .faq-popup-question,
.lp-body #kyoudosekkei .faq-popup-answer {
  position: relative;
  padding-left: 30px;
  text-align: left;
}

.lp-body #kyoudosekkei .faq-popup-question {
  margin: 0 0 8px;
  color: #17324d;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.6;
}

.lp-body #kyoudosekkei .faq-popup-answer {
  margin: 0;
  color: #405266;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.8;
}

.lp-body #kyoudosekkei .faq-popup-question::before,
.lp-body #kyoudosekkei .faq-popup-answer::before {
  position: absolute;
  top: 0;
  left: 0;
  font-weight: 800;
}

.lp-body #kyoudosekkei .faq-popup-question::before {
  content: "Q";
  color: #007d73;
}

.lp-body #kyoudosekkei .faq-popup-answer::before {
  content: "A";
  color: #ef6c19;
}

@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei #infoPopup h2.faq-popup-title {
    margin: 0 34px 20px;
    font-size: 21px;
  }

  .lp-body #kyoudosekkei .faq-popup-item {
    padding: 15px 14px;
  }

  .lp-body #kyoudosekkei .faq-popup-question {
    font-size: 15px;
  }

  .lp-body #kyoudosekkei .faq-popup-answer {
    font-size: 13px;
  }
}

.off {
  background: #cc0000;
  color: #fff;
  display: inline-block;
  font-size: 12px;
  padding: 0 3px !important;
  margin-bottom: 5px !important;
  letter-spacing: 0.075em;
}

@media screen and (max-width: 800px) {
  .visible-phone .buy {
    display: block;
  }
}

@media screen and (max-width: 767px) {
  .lp-cta {
    font-size: 22px;
  }
}

@media screen and (max-width: 400px) {
  .lp-cta {
    font-size: 17px;
  }
}

.lp-body #kyoudosekkei .info-btn {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto;
  max-width: none;
  height: auto;
  margin: 10px 0 0;
  padding: 8px 4px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #007d73;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.02em;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
}

.lp-body #kyoudosekkei .info-btn::before {
  content: "?";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #007d73;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
}

.lp-body #kyoudosekkei .info-btn::after {
  content: none;
}

.lp-body #kyoudosekkei .info-btn:hover {
  color: #00655d;
  text-decoration: underline;
  opacity: 1;
}

.lp-body #kyoudosekkei .info-btn span {
  display: none;
}

@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .info-btn {
    width: auto;
    height: auto;
    margin-top: 10px;
    padding: 8px 0;
    font-size: 14px;
  }
}

.feature-container {
  background-color: #FFF;
  padding: 80px 0;
}

@media screen and (max-width: 767px) {
  .feature-container {
    padding: 30px 0;
  }
}

.box-list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin: 0 auto;
  width: 80%;
  max-width: 960px;
  row-gap: 32px;
}

@media screen and (max-width: 679px) {
  .box-list {
    flex-direction: row;
    gap: 18px;
  }
}

@media screen and (min-width: 680px) and (max-width: 767px) {
  .box-list {
    flex-direction: row;
    gap: 10px;
  }
}

.box-list li {
  width: 32%;
  background-color: #006E64;
  color: #FFF;
  border-radius: 10px;
  text-align: center;
  height: 222px;
  padding: 21px 0;
  box-sizing: border-box;
}

@media screen and (max-width: 767px) {
  .box-list li {
    width: 70%;
    height: 175px;
    padding: 40px 15px 20px;
    position: relative;
    margin: 0 auto 30px;
    min-width: 250px;
  }
}

@media screen and (min-width: 680px) and (max-width: 767px) {
  .box-list li {
    width: calc(100% / 2 - 10px);
  }
}

.box-list li:last-of-type {
  background-color: #EAF6F2;
  color: #243746;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: left;
  padding: 21px 20px;
  width: 100%;
  height: auto;
}

.box-list li:last-of-type p {
  font-size: 18px;
  font-weight: bold;
}

.box-list li:last-of-type span {
  display: block;
  font-size: 16px;
  font-weight: normal;
}

@media screen and (min-width: 768px) {
  .box-list li:last-of-type p {
    padding-left: 20px;
  }
}

@media screen and (max-width: 767px) {
  .box-list li:last-of-type {
    width: 70%;
    height: auto;
    padding: 30px 20px;
    font-size: 16px;
  }
  .box-list li:last-of-type p {
    font-size: 16px;
  }
  .box-list li:last-of-type span {
    font-size: 14px;
  }
}

@media screen and (max-width: 680px) {
  .box-list li:last-of-type {
    flex-direction: column;
    height: auto;
    padding: 30px 20px;
    font-size: 16px;
  }
}

@media screen and (min-width: 680px) and (max-width: 767px) {
  .box-list li:last-of-type {
    flex-direction: row;
    width: calc(100% / 2 - 10px);
    padding: 40px 15px 20px;
  }
}

.box-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-bottom: 17px;
}

@media screen and (max-width: 767px) {
  .box-title {
    font-size: 24px;
    position: absolute;
    top: -22px;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border-radius: 10px 0;
    color: #007D73;
    border: 3px solid;
    padding: 0 10px;
    white-space: nowrap;
    width: 120px;
  }
}

.box-txt {
  font-size: clamp(14px, 0.163rem + 1.48vw, 21px);
  letter-spacing: 2px;
  line-height: 1.8;
  width: 90%;
  margin: 0 auto;
  text-align: center;
}

.box-txt b {
  font-size: 48px;
}

@media screen and (max-width: 767px) {
  .box-txt b {
    font-size: 40px;
  }
}

@media screen and (max-width: 767px) {
  .box-txt {
    font-size: 16px;
  }
}

.box-txt span {
  font-size: 28px;
  font-weight: 600;
}

@media screen and (max-width: 767px) {
  .box-txt span {
    font-size: 24px;
  }
}

.feature-icon {
  width: 40px;
}

.feature-icon img {
  width: 100%;
  vertical-align: middle;
}

@media screen and (max-width: 767px) {
  .feature-icon {
    width: 32px;
  }
  .feature-bottom-icon {
    position: absolute;
    top: -25px;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border-radius: 10px 0;
    color: #EAEAEA;
    border: 3px solid;
    padding: 0 10px;
    white-space: nowrap;
    width: 120px;
    text-align: center;
  }
  .feature-bottom-icon img {
    width: 70%;
    padding-top: 5px;
  }
}

.box-title p {
  font-size: 19px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .box-title p {
    font-size: 18px;
  }
}

.feature-number {
  background-color: #ECF8F4;
  padding: 60px 0;
}

.feature-number h3 {
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 2px;
  color: #3A3A3A;
  text-align: center;
  margin: 0 auto 38px auto;
}

@media screen and (max-width: 767px) {
  .feature-number h3 {
    font-size: 20px;
  }
}

@media screen and (max-width: 767px) {
  .feature-number ul + h3 {
    font-size: 14px;
  }
}

.number-box {
  display: flex;
  justify-content: space-between;
  width: 80%;
  max-width: 960px;
  margin: 0 auto 63px auto;
  text-align: center;
}

@media screen and (min-width: 768px) {
  .number-box li {
    width: 33%;
  }
}

.number-box p {
  text-align: center;
}

@media screen and (max-width: 767px) {
  .number-box {
    flex-direction: column;
    gap: 70px;
  }
}

.number-box li h4 {
  font-size: clamp(18px, -0.375rem + 3.13vw, 24px);
  color: #607D8B;
  letter-spacing: 2px;
}

@media screen and (max-width: 767px) {
  .number-box li h4 {
    font-size: 18px;
  }
}

.stat-item {
  opacity: 0;
  transform: translateY(50px);
  transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* 遅延アニメーション - 中央から左右へ */
.stat-item:nth-child(2) {
  transition-delay: 0.1s; /* 中央が最初 */
}

.stat-item:nth-child(1) {
  transition-delay: 0.4s; /* 左が後 */
}

.stat-item:nth-child(3) {
  transition-delay: 0.4s; /* 右が後（同時） */
}

.stat-item.float-in {
  opacity: 1;
  transform: translateY(0);
}

.stat-number {
  font-size: clamp(40px, -0.879rem + 7.04vw, 69px);
  font-weight: 700;
  letter-spacing: 1.5px;
  color: #F26700;
  line-height: 1.5;
}

@media screen and (max-width: 767px) {
  .stat-number {
    font-size: 60px;
  }
}

.stat-unit {
  font-size: clamp(20px, -0.265rem + 3.16vw, 33px);
  font-weight: bold;
  color: #000;
}

@media screen and (max-width: 767px) {
  .stat-unit {
    font-size: 20px;
  }
}

.under-num {
  padding: 0 10px;
  font-size: clamp(16px, 0.534rem + 0.97vw, 20px);
  color: #607D8B;
  font-weight: 600;
  letter-spacing: 2px;
  line-height: 1.5;
}

@media screen and (max-width: 767px) {
  .under-num {
    font-size: 16px;
  }
}

.feature-number-img {
  margin: 0 auto 20px auto;
  width: fit-content;
}

.feature-number-img img {
  max-width: 100%;
}

.feature-number-txt {
  font-size: 14px;
  line-height: 2;
  color: #707070;
  letter-spacing: 1.5px;
  margin: 0 auto;
  width: 62%;
  max-width: 960px;
}

@media screen and (max-width: 767px) {
  .feature-number-txt {
    font-size: 12px;
    width: auto;
    margin: 0 20px;
  }
}

/* 企業採用セクション */
.companies-section {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.8s ease-out 0.2s;
  text-align: center;
}

.companies-section.float-in {
  opacity: 1;
  transform: translateY(0);
}

/* 2026-08-02 CSS監査: .feature-about と .lined（本体・::before・対応するSP用@media 2件）を削除。
   空になる@mediaごと除去。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 2026-08-02 CSS監査: 旧aboutセクション（.about-link / .about-container / .about-img /
   .about-num / .about-txt / .about-txt-box など）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 2026-08-02 CSS監査: .feature-class を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 2026-08-02 CSS監査: 旧6大特長カードセクション（.six-class / .six-class-img）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 2026-08-02 CSS監査: 旧お悩みセクション一式（.onayami / .onayami-list / .tate-line /
   .onayami h4 / .onayami-img-box / .onayami-box とその子孫・::before/::after、
   および対応するSP用@media）を一括削除。空になる@mediaごと除去。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 2026-08-02 CSS監査: 旧2大特長セクション一式（.two-power / .power-img と img、
   および旧カード .power-box / .power-box-img / .power-box-txt、対応するSP用@media）を削除。
   空になる@mediaごと除去。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 2026-08-02 CSS監査: 旧「学べること」セクション一式（.learn-about とその h3 /
   .left-box / .right-box とその h4 / .learn-about-bottom / .learn-about-txt と::after /
   .learn-img と img、対応するSP用@media）を一括削除。空になる@mediaごと除去。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 2026-08-02 CSS監査: 旧学習内容リストの外枠（.learning-list / .learning-box）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 2026-08-02 CSS監査: 旧学習内容の本文と＋記号（.learn-txt / .plus-mark）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 2026-08-02 CSS監査: 旧使用ツールのタグリスト（.tool-list）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

#skill {
  padding: 80px 0;
  background-color: #FFF;
}

/* 2026-08-02 CSS監査: 旧習得スキル4カード（.skill-box / .skill-inner / .skill-num / .skill-txt）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 2026-08-02 CSS監査: .lined-under（本体・SP用@media）を削除。空になる@mediaごと除去。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

#program {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #CFEEE7;
}

.section-title {
  width: 100%;
  color: #007D73;
  background-color: #DEF0EC;
  font-size: 36px;
  margin-top: -1px;
  text-align: center;
  letter-spacing: 4px;
  line-height: 1.6;
  padding: 30px 20px 48px;
  margin-bottom: 80px;
}

/* 大きな章の切り替わり見出しに、上へ短い罫線を入れる（2026-07-18） */
.section-title::before {
  content: "";
  display: block;
  width: 52px;
  height: 4px;
  background: #007D73;
  border-radius: 2px;
  margin: 0 auto 20px;
}

/* 本文の可読性: 行間・字間を広げる */
.box-txt,
p.hp_justify {
  line-height: 1.95;
  letter-spacing: .02em;
}
/* 2026-08-02 CSS監査: .onayami-bottom のセレクタと word-break 指定を削除（.box-txt / p.hp_justify は残置）。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

@media screen and (max-width: 767px) {
  .section-title {
    font-size: 24px;
    margin-bottom: 50px;
	}
}

/* 2026-08-02 CSS監査: 旧カリキュラム章見出し・スライド枠（.program-head / .program-num /
   .program-title / .program-h4 / .slide-box / .slide-inner / .slide-txt-box）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

.openVideo {
  display: flex;
  align-items: center;
  justify-content: space-around;
  width: 80%;
  max-width: 670px;
  background-color: #007D73;
  color: #FFF;
  border-radius: 6px;
  font-size: 22px;
  padding: 1%;
  box-sizing: border-box;
  margin: 20px auto 35px auto;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.33);
  margin-bottom: 100px;
  gap: 20px;
}

@media screen and (max-width: 400px) {
  .openVideo {
    font-size: 15px;
    gap: 15px;
  }
}

@media screen and (min-width: 401px) and (max-width: 767px) {
  .openVideo {
    font-size: 16px;
    gap: 10vw;
  }
}

@media screen and (max-width: 767px) {
  .openVideo {
    justify-content: center;
    width: calc(100% - 40px);
    padding: 10px 0;
  }
}

.popup {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.7);
  z-index: 9999;
}

.popup.active {
  display: flex;
  justify-content: center;
  align-items: center;
}

.lp-body #kyoudosekkei .popup-content {
  position: relative;
  width: 680px;
  max-width: calc(100% - 32px);
  max-height: 90vh;
  max-height: 90dvh;
  overflow-y: auto;
  padding: 32px;
  border-radius: 14px;
  background: #fff;
  box-sizing: border-box;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.24);
  -webkit-overflow-scrolling: touch;
}

.lp-body #kyoudosekkei .popup-content > iframe {
  width: 100%;
  margin-bottom: -8px;
  height: 270px;
}


.lp-body #kyoudosekkei .close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #edf6f4;
  color: #007d73;
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
}

.lp-body #kyoudosekkei .close:hover {
  background: #dcefeb;
}

/* 2026-08-02 CSS監査: .v-right（本体・@media 2件）を削除。空になる@mediaごと除去。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 2026-08-02 CSS監査: 旧カリキュラム本文リストと締めボックス（.program-list / .txt-list /
   .program-margin / .program-bottom-box）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

.pace {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #FFF;
}

/* 2026-08-02 CSS監査: 旧学習ペースセクション前半（.pace-top / .pace-txt / .pace-img /
   .pace-style / .pace-box）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

.dailystudies {
  width: 80%;
}

/* 2026-08-02 CSS監査: 旧学習ペースセクション後半（.pace-box li / .pace-icon /
   .pace-under-icon / .pace-txt-bottom）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

#price {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #EFF8F4;
  padding-bottom: 86px;
  box-sizing: border-box;
}

@media screen and (max-width: 767px) {
  #price {
    padding-bottom: 20px;
  }
}

/* 2026-08-02 CSS監査: 旧価格セクションのヘッダ・OFF表示（.price-img / .off-txt-box /
   .off-sub-txt / .off-txt）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。
   ※ .price-txt 系（価格自動計算のJS書き込み先）は使用中のため残置。 */

.price-txt {
  font-weight: 600;
  font-size: 80px;
  letter-spacing: 2px;
  color: #007D73;
  width: 100%;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1.2;
}

.price-txt > img {
  width: 100px;
  height: 40px;
  margin-right: 15px;
}

@media screen and (max-width: 767px) {
  .price-txt {
    font-size: 50px;
    position: relative;
    text-align: left;
    box-sizing: border-box;
    white-space: nowrap;
    letter-spacing: 0;
    margin: 0;
  }
  .price-txt > img {
    width: 80px;
    height: 30px;
  }
}
.price-txt span:last-child {
	font-size: 50px;
	margin-top:20px;
}

@media screen and (max-width: 767px) {
  .price-txt > span {
    font-size: 48px;
  }
  .price-txt span:last-child {
    font-size: 30px;
    margin-top: 10px;
  }
}

.price-txt_intax, .price-txt_intax_bunkatsu, .price-txt_intax_bunkatsu + p{
	font-size:18px;
	line-height:2;
}
@media screen and (max-width: 767px) {
.price-txt_intax, .price-txt_intax_bunkatsu, .price-txt_intax_bunkatsu + p{
	font-size:18px;
	line-height:1.6;
}
}
/* 2026-08-02 CSS監査: 旧分割払いボックスの外枠と見出し（.sub-price / .ttl_sub-price）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。
   ※ .sub-price-txt（JS書き込み先）は使用中のため残置。 */
.sub-price-txt {
  font-weight: 600;
  font-size: 42px;
  letter-spacing: 2px;
  color: #007D73;
  width: 100%;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sub-price-txt i {
  font-style: normal;
}

@media screen and (max-width: 767px) {
  /* 2026-08-02 CSS監査: 同ブロック内の .sub-price 定義のみ削除（.sub-price-txt は使用中のため残置）。 */
  .sub-price-txt {
    position: relative;
    flex-direction: column;
    align-items: center;
    font-size: 32px;
    flex-wrap: wrap;
  }
}

.sub-price-txt span.main {
  font-size: 42px;
}
.sub-price-txt span {
  font-size: 27px;
}

@media screen and (min-width: 768px) {
  .sub-price-txt span.b {
    color: inherit;
  }
}

@media screen and (max-width: 767px) {
  .sub-price-txt span.main {
    font-size: 32px;
  }
  .sub-price-txt span {
    font-size: 20px;
  }
}

/* 2026-08-02 CSS監査: 旧価格カード（.price-box とその子孫セレクタ）を削除。
   .price-box が3ページのHTMLに存在しないため .price-box .price-txt_intax 等の子孫指定も到達不能。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。
   ※ 単独の .price-txt_intax 定義は残置。 */

/* 2026-08-02 CSS監査: 単独の .line-through 定義（本体・SP用@media）も削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 2026-08-02 CSS監査: 旧価格下の注記（.price-under-txt）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

#price h4 {
	font-size: 28px;
	margin-bottom:30px;
	text-align:center;
  /*color: #007D73;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  width: 80%;
  max-width: 704px;
  margin-bottom: 24px;*/
}
#price h4::before{
	content:"";
	display:block;
	background:#359e95;
	width:60px;
	height:5px;
	margin: 0 auto 25px;
}

@media screen and (max-width: 767px) {
  #price h4 {
    font-size: 20px;
  }
}
/* 2026-08-02 CSS監査: 旧講座仕様セクション（.spec / .spec_list / .spec_tokuten / .ttl_tokuten）を
   一括削除。LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。
   復元はバックアップから。 */
.group{
	padding: 50px 0;
	background:#eff9f5;
	width:100%;
}
.group h4 + p{
	text-align:center;
	font-size:18px;
	margin-bottom:20px;
}
#price table {
  width: 80%;
	max-width: 700px;
	margin:0 auto;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
  #price table {
    width: calc(100% - 40px);
  }
}

#price table th {
  background-color: #1C7E76;
  color: #FFF;
}

#price table th,
#price table td {
  padding: 2% 5%;
  font-size: 16px;
  letter-spacing: 2px;
}

@media screen and (max-width: 767px) {
  #price table th,
  #price table td {
    font-size: 14px;
	}
}

tbody tr:nth-child(odd) {
  background-color: #fff;
}

tbody tr:nth-child(even) {
  background-color: #fff;
}

.group tbody tr:nth-child(odd) {
  background-color: #F4FBF9;
}

.group tbody tr:nth-child(even) {
  background-color: #DBF0EA;
}

.group tbody td:nth-child(1),
.group tbody td:nth-child(3) {
  color: #243746;
}
td {
  color: #3A3A3A;
  font-size: 16px;
}
/* 2026-08-02 CSS監査: 旧料金表の割引セル・表下注記（.discount / .under-table）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

.lp-body #kyoudosekkei .moushikomi.apply-v2 {
  width: 100%;
  padding: 50px 0 64px;
  background: #fff;
}

.lp-body #kyoudosekkei .apply-v2-panel {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 42px 32px 34px;
  border: 1px solid #d7e9e5;
  border-radius: 18px;
  background: #f1f8f6;
  box-sizing: border-box;
}

.lp-body #kyoudosekkei .moushikomi.apply-v2 h2.apply-v2-title {
  width: auto;
  margin: 0 0 10px;
  padding: 0;
  background: none;
  color: #007d73;
  font-size: 32px;
  font-weight: 800;
  line-height: 1.45;
  text-align: center;
}

.lp-body #kyoudosekkei .moushikomi.apply-v2 h2.apply-v2-title::before {
  content: "";
  display: block;
  width: 52px;
  height: 4px;
  margin: 0 auto 18px;
  border-radius: 999px;
  background: #007d73;
}

.lp-body #kyoudosekkei .apply-v2-lead {
  margin: 0 0 44px;
  color: #405266;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.75;
  text-align: center;
}

.lp-body #kyoudosekkei .apply-v2-steps {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.lp-body #kyoudosekkei .apply-v2-steps::before {
  content: "";
  position: absolute;
  top: 83px;
  right: 12.5%;
  left: 12.5%;
  z-index: 0;
  height: 2px;
  background: #B8DAD5;
}

.lp-body #kyoudosekkei .apply-v2-step {
  position: relative;
  z-index: 1;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: center;
}

.lp-body #kyoudosekkei .apply-v2-step:not(:last-child)::after {
  content: none;
}

.lp-body #kyoudosekkei .apply-v2-number {
  position: relative;
  top: auto;
  left: auto;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  min-width: 38px;
  height: 38px;
  margin: 0 auto 10px;
  padding: 0;
  border-radius: 50%;
  background: #007d73;
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.04em;
  transform: none;
  box-sizing: border-box;
}

.lp-body #kyoudosekkei .apply-v2-icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  width: 72px;
  height: 72px;
  margin: 0 auto 14px;
  border-radius: 50%;
  background: #e7f4f1;
  box-shadow: none;
  overflow: visible;
}

.lp-body #kyoudosekkei .apply-v2-icon::before {
  content: "";
  display: block;
  width: 38px;
  height: 38px;
  background-color: #007d73;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.lp-body #kyoudosekkei .apply-v2-icon--form::before {
  -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_form.svg");
  mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_form.svg");
}

.lp-body #kyoudosekkei .apply-v2-icon--payment::before {
  -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_payment.svg");
  mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_payment.svg");
}

.lp-body #kyoudosekkei .apply-v2-icon--mail::before {
  -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_mail.svg");
  mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_mail.svg");
}

.lp-body #kyoudosekkei .apply-v2-icon--start::before {
  -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_start.svg");
  mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_start.svg");
}

.lp-body #kyoudosekkei .apply-v2-step-title {
  margin: 0 0 6px;
  color: #007d73;
  font-size: 19px;
  font-weight: 800;
  line-height: 1.45;
}

.lp-body #kyoudosekkei .apply-v2-step-text {
  margin: 0;
  color: #607181;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.75;
}

.lp-body #kyoudosekkei .apply-v2-step-text br {
  display: none;
}

.lp-body #kyoudosekkei .apply-v2-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  margin: 32px auto 0;
}

.lp-body #kyoudosekkei .apply-v2-cta .over-cta {
  position: static;
  margin: 0 0 2px;
  padding: 0;
  background: none;
  color: #ef6c19;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.04em;
  text-align: center;
}

.lp-body #kyoudosekkei .apply-v2-cta .over-cta::before,
.lp-body #kyoudosekkei .apply-v2-cta .over-cta::after {
  content: none;
}
.lp-body #kyoudosekkei .apply-v2-primary,
.lp-body #kyoudosekkei .firstview .lp-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: auto;
  margin: 0 auto;
  border: 0;
  width: 100%;
  max-width: 480px;
  min-height: 64px;
  padding: 14px 28px;
  border-radius: 10px;
  background: #df2f2f;
  box-shadow: 0 3px 0 #ad1d1d;
  color: #fff !important;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.035em;
  line-height: 1.45;
  text-decoration: none;
  box-sizing: border-box;
  transition: background-color 0.2s, transform 0.2s;
}

.lp-body #kyoudosekkei .apply-v2-primary:hover,
.lp-body #kyoudosekkei .firstview .lp-cta:hover {
  background: #c92323;
  transform: translateY(1px);
}

@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .moushikomi.apply-v2 {
    padding: 36px 16px 46px;
  }

  .lp-body #kyoudosekkei .apply-v2-panel {
    padding: 34px 18px 28px;
  }

  .lp-body #kyoudosekkei .moushikomi.apply-v2 h2.apply-v2-title {
    font-size: 24px;
  }

  .lp-body #kyoudosekkei .apply-v2-lead {
    margin-bottom: 28px;
    font-size: 14px;
    text-align: left;
  }

  .lp-body #kyoudosekkei .apply-v2-steps {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .lp-body #kyoudosekkei .apply-v2-steps::before {
    top: 19px;
    right: auto;
    bottom: 19px;
    left: 18px;
    width: 2px;
    height: auto;
  }

  .lp-body #kyoudosekkei .apply-v2-step {
    display: grid;
    grid-template-columns: 40px 58px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 12px;
    align-items: start;
    min-height: 0;
    padding: 0 0 28px;
    text-align: left;
  }

  .lp-body #kyoudosekkei .apply-v2-step:last-child {
    padding-bottom: 0;
  }

  .lp-body #kyoudosekkei .apply-v2-number {
    grid-column: 1;
    grid-row: 1 / 3;
    align-self: start;
    width: 38px;
    min-width: 38px;
    height: 38px;
    margin: 0;
  }

  .lp-body #kyoudosekkei .apply-v2-icon {
    grid-column: 2;
    grid-row: 1 / 3;
    width: 56px;
    height: 56px;
    margin: 0;
  }

  .lp-body #kyoudosekkei .apply-v2-icon::before {
    width: 30px;
    height: 30px;
  }

  .lp-body #kyoudosekkei .apply-v2-step-title {
    grid-column: 3;
    grid-row: 1;
    margin: 0 0 4px;
    font-size: 18px;
  }

  .lp-body #kyoudosekkei .apply-v2-step-text {
    grid-column: 3;
    grid-row: 2;
  }

  .lp-body #kyoudosekkei .apply-v2-primary,
.lp-body #kyoudosekkei .firstview .lp-cta {
    min-height: 56px;
    padding: 12px 18px;
    font-size: 16px;
  }
}

#anc_tokuten {
  scroll-margin-top: 80px;
}

.lp-body #kyoudosekkei .benefit-v2,
.lp-body #kyoudosekkei .benefit-v2 * {
  box-sizing: border-box;
}

.lp-body #kyoudosekkei .benefit-v2 {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 80px 20px 74px;
  background: #FFF5E8;
  color: #172B49;
  word-break: normal;
  overflow-wrap: break-word;
  line-break: strict;
}

.lp-body #kyoudosekkei .benefit-v2__inner {
  width: min(1120px, 100%);
  margin: 0 auto;
}

.lp-body #kyoudosekkei .kaiketsu .benefit-v2 .benefit-v2__title {
  position: relative;
  margin: 0;
  width: auto;
  margin-left: 0;
  margin-right: 0;
  padding: 30px 20px 0;
  color: #007D73;
  background: transparent;
  border: 0;
  font-size: 34px;
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: .04em;
  text-align: center;
}

.lp-body #kyoudosekkei .kaiketsu .benefit-v2 .benefit-v2__title::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 52px;
  height: 4px;
  border-radius: 999px;
  background: #007D73;
  transform: translateX(-50%);
}

.lp-body #kyoudosekkei .benefit-v2__lead {
  margin: 14px auto 44px;
  color: #44566C;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: .02em;
  text-align: center;
}

.lp-body #kyoudosekkei .benefit-v2__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
}

.lp-body #kyoudosekkei .benefit-v2-card {
  /* 260802 モーダルを閉じたとき、開いたカードの位置に戻すためのスクロール調整。
     閉じるリンクは全カード共通の #anc_tokuten（セクション先頭）を指していたため
     特典3を閉じても特典1まで戻っていた。→ 各カードに id を付けてそこへ戻す。
     このLPで固定表示されるのは上部32pxのバーのみ（html側に scroll-padding-top:32px あり）
     なので、実効オフセットは 32＋24＝56px。 */
  scroll-margin-top: 24px;
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  background: #FFF;
  border: 1px solid #EED7BC;
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(23, 43, 73, .06);
}

.lp-body #kyoudosekkei .benefit-v2-card__number {
  position: absolute;
  z-index: 2;
  top: 16px;
  left: 16px;
  display: flex;
  width: 66px;
  height: 66px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #EF6C19;
  color: #FFF;
  font-size: 27px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: .02em;
  box-shadow: 0 3px 10px rgba(239, 108, 25, .22);
}

.lp-body #kyoudosekkei .benefit-v2-card__number small {
  margin-bottom: 4px;
  color: inherit;
  font-size: 12px;
  font-weight: 700;
}

.lp-body #kyoudosekkei .benefit-v2-card__image {
  position: relative;
  display: flex;
  height: auto;
  aspect-ratio: 16 / 9;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 0;
  background: #FFFCF7;
  border-bottom: 1px solid #F3E4D3;
  order: 1;
}

.lp-body #kyoudosekkei .benefit-v2-card__image img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 100%;
  margin: 0;
  object-fit: contain;
}

.lp-body #kyoudosekkei .benefit-v2-card__image--handbook img {
  width: 100%;
}

.lp-body #kyoudosekkei .benefit-v2-card__image--summary img {
  width: 100%;
  object-fit: contain;
}

.lp-body #kyoudosekkei .benefit-v2-card__image--course img {
  width: 100%;
  object-fit: contain;
}

.lp-body #kyoudosekkei .benefit-v2-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  order: 3;
  padding: 0 24px 24px;
  text-align: center;
}

.lp-body #kyoudosekkei .benefit-v2-card__heading {
  order: 2;
  padding: 22px 24px 0;
  text-align: center;
}

.lp-body #kyoudosekkei .benefit-v2-card__catch {
  min-height: 1.6em;
  margin: 0 0 8px;
  color: #EF6C19;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.6;
  letter-spacing: .01em;
}

.lp-body #kyoudosekkei .benefit-v2-card h3 {
  margin: 0;
  padding: 0;
  color: #172B49;
  background: transparent;
  border: 0;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: .01em;
}

.lp-body #kyoudosekkei .benefit-v2-card h3::before,
.lp-body #kyoudosekkei .benefit-v2-card h3::after {
  display: none;
  content: none;
}

.lp-body #kyoudosekkei .benefit-v2-card__format {
  margin: 7px 0 13px;
  color: #EF6C19;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.5;
}

.lp-body #kyoudosekkei .benefit-v2-card__description {
  margin: 0 0 20px;
  color: #526275;
  font-size: 15px;
  line-height: 1.85;
  letter-spacing: .01em;
  text-align: left;
}

.lp-body #kyoudosekkei .benefit-v2-card__detail {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 5px;
  margin: auto auto 0;
  padding: 8px 12px;
  appearance: none;
  background: transparent;
  border: 0;
  color: #007D73;
  font-family: inherit;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.5;
  cursor: pointer;
  text-decoration: none;
}

.lp-body #kyoudosekkei .benefit-v2-card__detail:hover,
.lp-body #kyoudosekkei .benefit-v2-card__detail:focus-visible {
  color: #005F58;
  text-decoration: underline;
}

.lp-body #kyoudosekkei .benefit-v2-card__detail:focus-visible,
.lp-body #kyoudosekkei .benefit-v2-modal__close:focus-visible {
  outline: 3px solid rgba(239, 108, 25, .35);
  outline-offset: 3px;
}

.lp-body #kyoudosekkei .benefit-v2__note {
  margin: 24px 0 0;
  color: #6D7887;
  font-size: 13px;
  line-height: 1.7;
  text-align: center;
}

.lp-body #kyoudosekkei .benefit-v2__no-break {
  white-space: nowrap;
}

.benefit-v2-modal {
  position: fixed;
  z-index: 100000;
  inset: 0;
  display: none;
  place-items: center;
  padding: 24px;
}


.benefit-v2-modal:target {
  display: grid;
}
.benefit-v2-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(10, 31, 44, .72);
}

.benefit-v2-modal__dialog {
  position: relative;
  z-index: 1;
  width: min(920px, 100%);
  max-height: calc(100vh - 48px);
  overflow: auto;
  padding: 34px 38px 38px;
  background: #FFF;
  border-radius: 16px;
  box-shadow: 0 20px 70px rgba(0, 0, 0, .28);
  color: #172B49;
  outline: none;
}

.benefit-v2-modal__close {
  position: absolute;
  top: 14px;
  right: 16px;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  padding: 0;
  appearance: none;
  background: #E9F5F2;
  border: 0;
  border-radius: 50%;
  color: #007D73;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  text-decoration: none !important;
}

.benefit-v2-modal__eyebrow {
  margin: 0 0 4px;
  color: #EF6C19;
  font-size: 14px;
  font-weight: 800;
  text-align: center;
}

.benefit-v2-modal__title {
  margin: 0 0 28px;
  color: #007D73;
  font-size: 28px;
  font-weight: 800;
  line-height: 1.5;
  text-align: center;
}


.lp-body #kyoudosekkei .kaiketsu .benefit-v2-modal .benefit-v2-modal__title {
  width: auto;
  margin: 0 0 28px;
  padding: 0;
  background: transparent;
  color: #007D73;
  font-size: 28px;
  line-height: 1.5;
  letter-spacing: .02em;
  text-align: center;
}

.lp-body #kyoudosekkei .kaiketsu .benefit-v2-modal .benefit-v2-modal__title::before,
.lp-body #kyoudosekkei .kaiketsu .benefit-v2-modal .benefit-v2-modal__title::after {
  display: none;
  content: none;
}
.benefit-v2-modal__panel {
  display: grid;
  grid-template-columns: minmax(280px, .9fr) minmax(0, 1.25fr);
  gap: 30px;
  align-items: center;
}

.benefit-v2-modal__visual {
  display: flex;
  height: auto;
  aspect-ratio: 1 / 1;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 0;
  background: #FFF9F0;
  border: 1px solid #F0DECA;
  border-radius: 10px;
}

.benefit-v2-modal__visual img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 100%;
  margin: 0;
  object-fit: contain;
}

.benefit-v2-modal__visual--portrait img {
  width: 100%;
  max-width: 100%;
}

.benefit-v2-modal__number {
  margin: 0 0 6px;
  color: #EF6C19;
  font-size: 14px;
  font-weight: 800;
}

.benefit-v2-modal__content h3 {
  margin: 0 0 14px;
  color: #172B49;
  font-size: 25px;
  font-weight: 800;
  line-height: 1.45;
}

.benefit-v2-modal__content > p:not(.benefit-v2-modal__number) {
  margin: 0 0 20px;
  color: #4A5D72;
  font-size: 15px;
  line-height: 1.9;
}

.benefit-v2-modal__content dl {
  margin: 0;
}

.benefit-v2-modal__content dl > div {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 10px;
  padding: 13px 0;
  border-top: 1px solid #D8E8E5;
}

.benefit-v2-modal__content dt {
  color: #007D73;
  font-size: 14px;
  font-weight: 800;
}

.benefit-v2-modal__content dd {
  margin: 0;
  color: #4A5D72;
  font-size: 14px;
  line-height: 1.75;
}

@media screen and (max-width: 900px) {
  .lp-body #kyoudosekkei .benefit-v2__grid {
    grid-template-columns: 1fr;
    width: min(520px, 100%);
    margin: 0 auto;
  }

  .lp-body #kyoudosekkei .benefit-v2-card__image {
    height: auto;
  }

  .lp-body #kyoudosekkei .benefit-v2-card__image--handbook img {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  #anc_tokuten {
    scroll-margin-top: 64px;
  }

  .lp-body #kyoudosekkei .benefit-v2 {
    padding: 58px 16px 54px;
  }

  .lp-body #kyoudosekkei .kaiketsu .benefit-v2 .benefit-v2__title {
    padding: 25px 0 0;
    font-size: 26px;
    line-height: 1.5;
    letter-spacing: .02em;
  }

  .lp-body #kyoudosekkei .kaiketsu .benefit-v2 .benefit-v2__title::before {
    width: 44px;
    height: 3px;
  }

  .lp-body #kyoudosekkei .benefit-v2__lead {
    margin: 12px 0 28px;
    font-size: 14px;
    line-height: 1.8;
  }

  .lp-body #kyoudosekkei .benefit-v2__grid {
    gap: 18px;
  }

  .lp-body #kyoudosekkei .benefit-v2-card__number {
    top: 14px;
    left: 14px;
    width: 60px;
    height: 60px;
    font-size: 24px;
  }

  .lp-body #kyoudosekkei .benefit-v2-card__image {
    height: auto;
  }

  .lp-body #kyoudosekkei .benefit-v2-card__body {
    padding: 0 20px 22px;
  }

  .lp-body #kyoudosekkei .benefit-v2-card__heading {
    order: 1;
    padding: 78px 20px 16px;
  }

  .lp-body #kyoudosekkei .benefit-v2-card__image {
    order: 2;
  }

  .lp-body #kyoudosekkei .benefit-v2-card__catch {
    min-height: 0;
    font-size: 14px;
  }

  .lp-body #kyoudosekkei .benefit-v2-card h3 {
    font-size: 21px;
  }

  .lp-body #kyoudosekkei .benefit-v2-card__format,
  .lp-body #kyoudosekkei .benefit-v2-card__description,
  .lp-body #kyoudosekkei .benefit-v2-card__detail {
    font-size: 14px;
  }

  .benefit-v2-modal {
    align-items: end;
    padding: 12px;
  }

  .benefit-v2-modal__dialog {
    width: 100%;
    max-height: calc(100vh - 24px);
    padding: 28px 20px 26px;
    border-radius: 14px;
  }

  .benefit-v2-modal__close {
    top: 10px;
    right: 10px;
  }

  .benefit-v2-modal__title {
    margin-bottom: 20px;
    padding: 0 38px;
    font-size: 22px;
  }

  .benefit-v2-modal__panel {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .benefit-v2-modal__visual {
    height: auto;
  }

  .benefit-v2-modal__content h3 {
    font-size: 21px;
  }

  .benefit-v2-modal__content dl > div {
    grid-template-columns: 72px minmax(0, 1fr);
  }
}

/* 2026-08-02 CSS監査: .b-box 一式（本体・li・対応する@media 2件）と .y-bg / .red-txt を削除。
   空になる@mediaごと除去。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

#voice {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #ECF8F4;
}

.voice-txt {
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 2px;
  text-align: center;
  margin-bottom: 48px;
  position: relative;
}

.voice-txt:before, .voice-txt:after {
  content: 'ー';
}

@media screen and (max-width: 767px) {
  .voice-txt.a {
    padding: 0 2em;
  }
  .voice-txt.a:before, .voice-txt.a:after {
    position: absolute;
    top: 1em;
  }
  .voice-txt.a:before {
    left: 0;
  }
  .voice-txt.a:after {
    right: 0;
  }
}

@media screen and (max-width: 767px) {
  .voice-txt {
    padding: 0 20px;
    font-size: 18px;
  }
}

.voice-box {
  background-color: #FFF;
  display: flex;
  align-items: center;
  gap: 50px;
  padding: 5%;
  box-sizing: border-box;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .voice .voice-box {
    width: calc(100% - 24px);
    margin: 0 auto;
    margin-bottom: 20px;
    justify-content: flex-start;
    gap: 12px;
    padding: 16px 14px;
  }
}

@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .voice .voice-txt-box {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
  }
}

.voice-img {
  width: 130px;
  height: 130px;
  overflow: hidden;
  border-radius: 50%;
  aspect-ratio: 1 / 1;
}

@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .voice .voice-img {
    flex: 0 0 66px;
    width: 66px;
    height: 66px;
  }
}

.voice-img img {
  width: 120%;
}

.voice-comment {
  font-size: 21px;
  letter-spacing: 2px;
  line-height: 1.8;
  margin-bottom: 15px;
}

@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .voice .voice-comment {
    font-size: 15px;
    line-height: 1.75;
    letter-spacing: .04em;
  }
}

.attribute {
  font-size: 21px;
  color: #828282;
}

@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .voice .attribute {
    font-size: 13px;
    line-height: 1.6;
    letter-spacing: 0;
  }
}

.voice-detail {
  width: 100%;
  background-color: #FFF;
  margin-top: 70px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 70px;
}

@media screen and (max-width: 767px) {
  .voice-detail {
    margin-top: 30px;
  }
}

/* 2026-08-02 CSS監査: 旧受講者の声の見出し（.voice-detail-txt）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。
   ※ .voice-box / .voice-comment / .voice-img / .voice-txt-box は使用中のため残置。 */

.detail-box {
  width: 80%;
  max-width: 900px;
  background-color: #D9D9D9;
  height: 776px;
  margin-bottom: 70px;
}

@media screen and (max-width: 767px) {
  .detail-box {
    width: calc(100% - 40px);
    height: auto;
    aspect-ratio: 340 / 221;
    margin-bottom: 30px;
  }
}

#faq-sec {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #FFF;
}

.faq {
  width: 80%;
  max-width: 900px;
}

@media screen and (max-width: 767px) {
  .faq {
    width: calc(100% - 40px);
  }
}

.faq-header {
  background-color: #ECF8F4;
  display: flex;
  align-items: center;
  border-radius: 8px;
  gap: 12px;
  padding: 2% 4%;
  margin-bottom: 32px;
}

@media screen and (max-width: 767px) {
  .faq-header {
    margin-bottom: 20px;
  }
}

.faq-icon {
  width: 36px;
  height: 36px;
  display: block;
}

.faq-icon {
  filter: invert(48%) sepia(39%) saturate(784%) hue-rotate(148deg) brightness(87%) contrast(121%);
}

.faq-header h3 {
  font-size: 24px;
  letter-spacing: 2px;
  line-height: 1.5;
  font-weight: 500;
}

@media screen and (max-width: 767px) {
  .faq-header h3 {
    font-size: 16px;
  }
}

.faq-content {
  display: none;
}

.faq-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  padding: 15px 21px;
  border-bottom: 1px solid #ccc;
  position: relative;
}

.faq-header::after {
  content: '';
  display: inline-block;
  width: 10px;
  height: 10px;
  border-right: 2px solid #007D73;
  border-bottom: 2px solid #007D73;
  transform: rotate(45deg);
  margin-left: auto;
}

.faq-header.active::after {
  border: none;
  border-top: 2px solid #007D73;
  border-left: 2px solid #007D73;
}

/* ---- FAQを青ベース→緑ベースに（テーマの青指定を高詳細度で上書き 2026-07-27） ---- */
.lp-body #kyoudosekkei .faq .faq-header { background-color: #EAF5F1; }
.lp-body #kyoudosekkei .faq .faq-icon { filter: invert(0.35) sepia(0.9) saturate(10) hue-rotate(140deg) brightness(0.75) contrast(1.1); }

/* ---- 細部調整（2026-07-27 その2） ---- */
/* 「日々の学習イメージ」見出し：帯・上線なし、色は本文見出しと同じ #2d344b
   （.kaiketsu h2 の帯ルールと同詳細度で後勝ちされるため、.kaiketsu を足して詳細度を上げる） */
.lp-body #kyoudosekkei .kaiketsu .dailystudies h2 { background: none; color: #2d344b; }
.lp-body #kyoudosekkei .kaiketsu .dailystudies h2::before { display: none; content: none; }
/* 2026-08-02 CSS監査: 講座仕様アイコンの色指定（.spec .spec_list li img）を削除。
   .spec / .spec_list が3ページのHTMLに存在しないため到達不能。復元はバックアップから。 */
/* 受講期間・業種・対象者（feature-sec）のアイコンは、SVG側の color 属性を
   #006E64 に修正済み（f-icon1〜3.svg）。imgのSVGは外部CSSのcurrentColorで
   塗り替えられないためフィルターは使わない（フィルターがあると色がずれる） */
/* 2026-08-02 CSS監査: .box-txt .ft-emph-nowrap（対象者カードの1行化指定）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 申込み方法 STEP1〜3 のアイコンは本文側でSVGを緑版（青#0989B1→緑#0C6E64、
   黒#000→円と同じ#E4F3EE）に差し替え済みのためフィルター指定は不要 */

/* 2026-08-02 CSS監査: 料金セクションの .line-through 系上書き（.off-txt / .price-box .line-through /
   #kyoudosekkei .line-through）をすべて削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* 学習スタイルセクションの幅を基礎編に合わせる。
   ※ 2026-08-02 CSS監査: 同ルールにあった .pace-top / .pace-box のセレクタのみ削除（両クラスは3ページに不在）。
   .dailystudies は使用中のため残置 */
.lp-body #kyoudosekkei .dailystudies { width: 100%; }

/* このページのTOPへ（追従・右下）は、基礎編と同じく本文の <p id="page-top"> を使い、
   見た目はテーマ style.css、出現・スムーズスクロールは lp.js が処理するため、
   lp_kyoudo.css 側の指定は不要（重複回避のため置かない） */

/* フッター上のお問い合わせCTA（.faq-cta a）を緑に。旧テーマ側にインラインの
   青(#0989B1 !important)指定が残っているため、!important＋高詳細度で上書き */
.lp-body #kyoudosekkei .faq-cta a { background: #0C6E64 !important; }
.lp-body #kyoudosekkei .faq-cta a:hover { background: #0A5C54 !important; }

/* 2026-08-02 CSS監査: 「販売価格」バッジ（.price-txt .hanbai-badge ＋ ::after）を削除。
   親の .price-txt は使用中のため残置。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも .hanbai-badge が存在しないことを実測確認。復元はバックアップから。 */
/* ---- サンプル動画ボタン＋モーダル（構想設計LP同様のポップアップ再生 2026-07-27） ---- */
.lp-body #kyoudosekkei .sample-video-btn { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; background: #0C6E64; color: #fff; padding: 11px 22px; border-radius: 8px; font-weight: 800; font-size: 16px; margin: 14px 0 4px; transition: background .2s; box-shadow: 0 2px 8px rgba(12, 110, 100, .25); }
.lp-body #kyoudosekkei .sample-video-btn:hover { background: #0A5C54; }
.lp-body #kyoudosekkei .sample-video-btn .svb-ico { font-size: 13px; }
.lp-body #kyoudosekkei .sample-video-btn .svb-time { background: rgba(255, 255, 255, .22); padding: 2px 9px; border-radius: 4px; font-size: 13px; font-weight: 700; }
.lp-body .sv-modal { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .82); z-index: 100000; }
.lp-body .sv-modal.is-open { display: flex; align-items: center; justify-content: center; }
.lp-body .sv-modal .sv-modal-box { position: relative; width: 90%; max-width: 900px; }
.lp-body .sv-modal .sv-frame { position: relative; width: 100%; padding-top: 56.25%; background: #000; }
.lp-body .sv-modal .sv-frame iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
.lp-body .sv-modal .sv-close { position: absolute; top: -44px; right: 0; width: 40px; height: 40px; background: none; border: none; color: #fff; font-size: 34px; line-height: 1; cursor: pointer; }

.faq-sub-item .faq-answer {
  display: none;
  /* 初期非表示 */
  padding: 15px 0 8px 0;
  line-height: 1.5;
}

.faq-txt-under {
  font-size: 18px;
  letter-spacing: 2px;
  line-height: 2;
  margin: 45px auto 24px auto;
  max-width: 620px;
}

/* 2階層目のサブアイテム */
.faq-sub-item {
  background: #F0F0F0;
  padding: 20px;
  margin-bottom: 18px;
  font-size: 16px;
  border-radius: 8px;
}

/* 質問部分 */
.faq-question {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  cursor: pointer;
  position: relative;
  font-weight: bold;
	line-height: 2;
	padding-right: 10px;
}

.faq-question span,
.faq-answer span {
  color: #007D73;
  font-weight: bold;
  font-size: 24px;
  line-height: 1;
  margin-right: 10px;
}

/* 矢印 */
.faq-question::after {
  content: '';
  display: inline-block;
  width: 10px;
  height: 10px;
  border-right: 2px solid #007D73;
  border-bottom: 2px solid #007D73;
  transform: rotate(45deg);
	margin-left: auto;
	position: absolute;
  right: 0;
}

.faq-question.active::after {
  border: none;
  border-top: 2px solid #007D73;
  border-left: 2px solid #007D73;
}

/* 回答部分 */
.faq-answer {
  display: none;
  /* 初期非表示 */
  padding: 10px 16px;
  line-height: 1.5;
  border-top: 1px solid #b9b9b9;
  margin-top: 10px;
  padding-top: 15px;
}

@media screen and (max-width: 767px) {
  .faq-txt-under {
    margin: 0 20px 30px;
    font-size: 16px;
    line-height: 1.85;
  }
}

.faq-cta {
  width: 80%;
  max-width: 620px;
  margin-bottom: 50px;
}

.faq-cta a:hover {
  background-color: #005F58;
}

@media screen and (max-width: 767px) {
  .faq-cta {
    width: calc(100% - 40px);
  }
}

.faq-cta a {
  background-color: #12897E;
  color: #FFF;
  font-size: 24px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  width: 100%;
  height: 82px;
  padding: 0 30px;
  box-shadow: 0 3px 8px rgba(0, 0, 0, .12);
  text-decoration: none;
  transition: background-color .2s;
}

@media screen and (max-width: 767px) {
  .faq-cta a {
    font-size: 17px;
    letter-spacing: 0;
    width: auto;
  }
}

.bottom-img {
  width: 90%;
  max-width: 1200px;
}

@media screen and (max-width: 767px) {
  .bottom-img {
    width: calc(100% - 40px);
  }
}

.bottom-img img {
  width: 100%;
}

/* フッター直前の共通イメージを即戦力LPと同程度の幅にそろえる（PCのみ） */
@media screen and (min-width: 768px) {
  .lp-body #kyoudosekkei #faq-sec .bottom-img {
    width: 92% !important;
    max-width: 900px !important;
    margin-left: auto;
    margin-right: auto;
  }
}

.dailystudies {
  display: flex;
  flex-direction: column;
}

.dailystudies h2 {
  font-size: 2.4rem;
  font-weight: bold;
  background: none;
  color: inherit;
  margin: 50px 0 30px;
  padding: 0;
  text-align: center;
}

.arrow img {
  width: 100%;
}

.btn_purchase a {
  text-decoration: none;
}

.c_anchor {
  position: absolute;
  left: 0;
  width: 100%;
  margin-top: -4.5vw;
}

@media screen and (max-width: 767px) {
  .c_anchor {
    margin-top: -76px;
  }
}

/* 2026-08-02 CSS監査: .program-list > p を削除（.program-list が3ページのHTMLに不在で到達不能）。 */

html {
  scroll-behavior: smooth;
}

.l-footer {
  background: #007D73;
}

.l-footer * {
  color: #fff;
}

.l-footer a {
  text-decoration: none;
}

.f-nav {
  background: #005049;
}

/* フッター: 法人トライアルの色を #F26700 に・「まずはお気軽に」で改行（is-spをPCでも表示） */
.f-inner .f-link li:first-child a {
  background: #F26700;
}
.f-inner.a p .is-sp {
  display: inline;
}

.f-inner {
  width: 960px;
  margin: 0 auto;
  max-width: calc(100% - 40px);
}

.f-inner p {
  font-weight: bold;
  font-size: 24px;
}

.f-inner.a p span {
  font-size: 14px;
  display: inline-block;
  line-height: 1.4;
}

@media screen and (max-width: 767px) {
  .f-inner > ul {
    width: 50%;
    margin: 0 auto 0 20px;
  }
}

@media screen and (max-width: 767px) {
  .f-inner {
    font-size: 14px;
  }
  .f-inner > ul {
    width: 50%;
    margin: 0 auto 0 20px;
  }
  .f-inner p {
    font-size: 24px;
  }
}

@media screen and (min-width: 951px) {
  .f-inner p {
    margin-top: 2em;
  }
}

.f-inner.a {
  display: flex;
  justify-content: space-between;
  padding: 45px 0;
}

@media screen and (max-width: 950px) {
  .f-inner.a {
    flex-direction: column;
    padding: 50px 0;
    gap: 20px;
  }
}

@media screen and (min-width: 951px) {
  .f-inner.a p {
    width: calc(100% - 600px);
  }
  .f-inner.a .right {
    width: 560px;
  }
}

.f-link {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  text-align: center;
  margin-bottom: 20px;
}

.f-link li {
  width: calc(50% - 10px);
}

.f-link li:nth-child(3) {
  width: 100%;
}

.f-link a {
  display: block;
  border: solid 3px #fff;
  border-radius: .5em;
  font-size: 20px;
  background: #005049;
  padding: .8em 0;
  position: relative;
  font-weight: bold;
  position: relative;
}

.f-link a:hover {
  opacity: 0.7;
}

@media screen and (max-width: 767px) {
  .f-link a {
    font-size: 18px;
  }
}

.f-link a:before {
  content: '';
  position: absolute;
  width: .5em;
  height: .5em;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  right: 1em;
  top: 1.2em;
  transform: rotate(45deg);
}

.f-tel {
  text-align: left;
}

.f-tel a {
  font-size: 32px;
  font-weight: bold;
}

@media screen and (max-width: 767px) {
  .f-tel a {
    font-size: clamp(1.75rem, 1.124rem + 3.13vw, 2rem);
  }
}

.f-tel img {
  width: 1.13em;
  vertical-align: middle;
  margin-right: .5em;
}

.f-tel small {
  display: block;
  font-size: 20px;
  text-align: left;
  padding-left: 70px;
}

@media screen and (max-width: 767px) {
  .f-tel small {
    font-size: clamp(1rem, 0.821rem + 0.89vw, 1.25rem);
    padding-left: clamp(3.125rem, 2.678rem + 2.24vw, 3.75rem);
  }
}

.f-nav {
  padding: 30px 0;
  font-size: 18px;
}

.f-nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 1em 2em;
}

.f-copy {
  text-align: center;
  background: #072A27;
  padding: 1em;
  font-size: 12px;
  font-weight: bold;
}

/* 2026-08-02 CSS監査: .img1 を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

.lp-low {
  position: relative;
  margin-bottom: 80px;
}

@media screen and (max-width: 767px) {
  .lp-low {
    margin-bottom: 50px;
  }
}

@media screen and (max-width: 950px) {
  .lp-low {
    margin-top: 62px;
  }
}

@media screen and (max-width: 767px) {
  .lp-low {
    margin-top: 142px;
  }
}

.lp-low .ttl {
  text-align: center;
  color: #fff;
  position: absolute;
  width: 100%;
  bottom: 4vw;
  font-size: 36px;
}

@media screen and (max-width: 950px) {
  .lp-low .ttl {
    font-size: 30px;
    bottom: 50%;
    transform: translateY(50%);
  }
}

.lp-low img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

@media screen and (max-width: 950px) {
  .lp-low img {
    height: 150px;
  }
}

.lp-inner {
  width: 840px;
  margin: 0 auto;
  max-width: calc(100% - 40px);
  color: #3A3A3A;
}

.lp-form section {
  border-top: solid 1px #C2C2C2;
  padding: 60px 0 20px;
}

.lp-form section:first-of-type {
  padding-top: 0;
  border: none;
}

.lp-form .ttl {
  font-weight: bold;
  color: #007D73;
  display: flex;
  gap: 1em;
  align-items: center;
  font-size: 24px;
  margin-bottom: 1em;
}

@media screen and (max-width: 767px) {
  .lp-form .ttl {
    font-size: 18px;
  }
}

.lp-form .ttl img {
  width: 1.66em;
}

.lp-form p {
  font-size: 16px;
  line-height: 2;
}

@media screen and (max-width: 767px) {
  .lp-form p {
    font-size: 14px;
  }
}

.lp-form p b {
  font-weight: bold;
  font-size: 1.33em;
}

.lp-form p em {
  display: block;
  font-style: normal;
  font-size: 24px;
  line-height: 1.5;
}

@media screen and (max-width: 767px) {
  .lp-form p em {
    font-size: 20px;
    margin-bottom: .5em;
  }
}

@media screen and (max-width: 767px) {
  .lp-form p small {
    display: block;
  }
}

.lp-form table {
  margin-top: 30px;
  width: 100%;
}

.lp-form th {
  font-weight: bold;
  font-size: 16px;
  position: relative;
  padding-bottom: .5em;
}

@media screen and (min-width: 768px) {
  .lp-form th {
    font-size: 18px;
    width: 300px;
  }
}

.lp-form td {
  padding: 0 0 2em;
}

@media screen and (max-width: 767px) {
  .lp-form th, .lp-form td {
    float: left;
    width: 100%;
  }
}

.lp-form .haveto, .lp-form .any {
  position: absolute;
  right: 5em;
  font-size: 13px;
  color: #fff;
  background: #8C8C8C;
  border-radius: .2em;
  padding: .2em .5em .1em;
  font-weight: normal;
}

@media screen and (max-width: 767px) {
  .lp-form .haveto, .lp-form .any {
    right: 0;
  }
}

.lp-form .wpcf7-form-control-wrap {
  display: inline-block;
  margin-right: 5px;
}

/* お問い合わせフォーム: td内の入力欄をtd幅いっぱいに（wrapのinline-block解除）。強度設計専用。 */
.lp-form td .wpcf7-form-control-wrap {
  display: block;
  margin-right: 0;
}

.lp-form .haveto {
  background: #FF6D00;
}

.lp-form td input, .lp-form td textarea {
  width: 100%;
  background: #F2F2F2;
  border: solid  1px #C7C7C7;
  padding: .8em 1em;
  box-sizing: border-box;
}

.lp-form #formbtn {
  display: block;
  margin: 35px auto;
  background: #0C6E64;
  width: 691px;
  max-width: 100%;
  color: #fff;
  font-weight: bold;
  border: none;
  font-size: 20px;
  padding: .8em 0;
  border-radius: 6px;
  transition: background .2s;
}
.lp-form #formbtn:hover {
  background: #0A5C54;
}

.lp-form .wpcf7 {
  text-align: center;
}

/* 2026-08-02 CSS監査: 受講環境ブロック（.lp-envi 一式・見出し・dl/dt/dd・対応するSP用@media）を
   一括削除。空になる@mediaごと除去。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

.lp-app {
  margin-bottom: 80px;
}

@media screen and (min-width: 768px) {
  .lp-app {
    width: 1118px;
  }
}

.lp-app * {
  box-sizing: border-box;
}

.lp-app .ttl {
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  position: relative;
  letter-spacing: .08em;
  margin-bottom: 1.2em;
}

@media screen and (max-width: 767px) {
  .lp-app .ttl {
    font-size: 20px;
  }
}

.lp-app .ttl:before {
  content: '';
  position: absolute;
  left: 50%;
  translate: -50% 0;
  top: -1em;
  width: 3.33em;
  height: .25em;
  background: #007D73;
}

/* 2026-08-02 CSS監査: .lp-app .msg 一式（本体・SP用@media・em・img）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

.lp-app .list {
  display: flex;
  gap: 60px;
  margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
  .lp-app .list {
    flex-direction: column;
  }
}

.lp-app .list dl {
  border-radius: 10px;
  background: #F5F5F5;
  position: relative;
  text-align: center;
}

@media screen and (min-width: 768px) {
  .lp-app .list dl {
    width: calc(23% - 30px);
  }
}

.lp-app .list dl:first-child:before {
  content: none;
}

@media screen and (min-width: 768px) {
  .lp-app .list dl:last-child {
    width: calc(26% - 30px);
  }
}

.lp-app .list dl:last-child dt {
  background: #FF6D00;
}

.lp-app .list dl:last-child:before {
  background: #FF6D00;
}

.lp-app .list dl:before {
  content: '';
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  width: 20px;
  height: 55px;
  clip-path: polygon(0 0, 0 100%, 100% 50%);
  background: #007D73;
  left: -40px;
}

@media screen and (max-width: 767px) {
  .lp-app .list dl:before {
    left: 50%;
    translate: -50% 0;
    top: -40px;
    clip-path: polygon(0 0, 50% 100%, 100% 0);
    width: 55px;
    height: 20px;
  }
}

.lp-app .list dt {
  font-size: 20px;
  font-weight: bold;
  color: #fff;
  background: #007D73;
  letter-spacing: .08em;
  text-align: center;
  border-radius: 10px 10px 0 0;
  padding-top: .3em;
}

.lp-app .list dt i {
  font-style: normal;
  font-size: 1.4em;
}

.lp-app .list dd {
  padding: 20px 15px;
}

.lp-app .list dd p {
  height: 3em;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 18px;
  margin-bottom: 1em;
}

.lp-app .list dd small {
  font-size: 14px;
  display: block;
  margin-top: 2em;
}

.lp-app .note {
  font-size: 14px;
  line-height: 1.9;
}

.lp-app figure {
  margin: 60px 0 80px;
}

.lp-app figure img {
  width: 100%;
}

.lp-app tbody tr:nth-child(even) {
  background: none;
}

.lp-app table {
  width: 100%;
}

.lp-app .ttl2 {
  background: #007D73;
  color: #fff;
  font-size: 18px;
  display: flex;
  align-items: center;
  border-radius: 5px;
  padding: .5em 1em;
  position: relative;
  gap: 1em;
  padding-right: 55px;
  margin-bottom: 18px;
  cursor: pointer;
}

.lp-app .ttl2:before {
  content: '';
  position: absolute;
  font-size: 18px;
  width: .8em;
  height: .8em;
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
  right: 38px;
  top: 50%;
  transform: rotate(45deg) translateY(-0.8em);
}

.lp-app .ttl2.open + .qa {
  display: block;
}

.lp-app .qa {
  display: none;
}

.lp-app .qa > dl {
  background: #F0F0F0;
  padding: 20px;
  margin-bottom: 18px;
  font-size: 16px;
}

@media screen and (max-width: 767px) {
  .lp-app .qa > dl {
    font-size: 14px;
  }
}

.lp-app .qa > dl > dt, .lp-app .qa > dl > dd {
  position: relative;
}

.lp-app .qa > dl > dt:before, .lp-app .qa > dl > dd:before {
  content: 'Q';
  position: absolute;
  color: #007D73;
  font-weight: bold;
  left: 0;
  font-size: 24px;
  top: 0;
  line-height: 1;
}

.lp-app .qa > dl > dt {
  font-weight: bold;
  padding-left: 32px;
  cursor: pointer;
  padding-right: 38px;
}

.lp-app .qa > dl > dt.open:after {
  border: none;
  border-top: 2px solid #007D73;
  border-left: 2px solid #007D73;
  margin-top: .35em;
}

.lp-app .qa > dl > dt.open + dd {
  display: block;
}

.lp-app .qa > dl > dt:after {
  content: '';
  position: absolute;
  font-size: 18px;
  width: .8em;
  height: .8em;
  border-bottom: 2px solid #007D73;
  border-right: 2px solid #007D73;
  right: 18px;
  top: 50%;
  transform: rotate(45deg) translateY(-0.8em);
}

.lp-app .qa > dl > dd {
  border-top: solid 1px #B9B9B9;
  padding: 15px 0;
  padding-left: 32px;
  margin-top: 15px;
}

.lp-app .qa > dl > dd:before {
  top: 16px;
  content: 'A';
}

.lp-app .qa .toggle {
  border: solid 1px #BEBEBE;
  padding: 1em;
  font-size: 14px;
  margin-top: 1em;
}

@media screen and (max-width: 767px) {
  .lp-app .qa .toggle {
    font-size: 13px;
  }
}

.lp-app .qa .toggle dt {
  color: #007D73;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
}

.lp-app .qa .toggle dt.open + dd {
  display: block;
  margin-top: 1em;
  line-height: 2;
}

.lp-app .qa dd dt:before, .lp-app .qa dd dd:before {
  content: none;
}

.lp-app .qa dd {
  display: none;
}

.lp-app .more {
  text-align: center;
  font-weight: bold;
  font-size: 20px;
  margin-top: 40px;
}

@media screen and (max-width: 767px) {
  .lp-app .more {
    font-size: 18px;
  }
}

.float_cart_sp .buy { margin-top: 0 !important; }

@media screen and (max-width: 767px) {
  body.lp-body {
    padding-bottom: calc(72px + env(safe-area-inset-bottom));
  }

  .lp-body .float_cart_sp {
    box-sizing: content-box;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 55px;
    z-index: 9000;
    overflow: hidden;
    padding-bottom: env(safe-area-inset-bottom);
    background: #ea3c1f;
  }

  .lp-body .float_cart_sp > .fa,
  .lp-body .float_cart_sp .price,
  .lp-body .float_cart_sp .intax,
  .lp-body .float_cart_sp br {
    display: none !important;
  }

  .lp-body .float_cart_sp .buy {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 55px;
    margin: 0 !important;
    line-height: 1.2 !important;
  }

  .lp-body .float_cart_sp .purchase {
    display: block;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: .03em;
    line-height: 1.2;
  }

  body.lp-body #page-top {
    right: 20px;
    bottom: calc(75px + env(safe-area-inset-bottom)) !important;
    z-index: 9001;
    width: 100px;
    height: auto;
    margin: 0;
    font-size: 11px;
    letter-spacing: 1px;
  }

  body.lp-body #page-top a {
    display: block;
    width: 100px;
    height: auto;
    padding: 10px 0;
    color: #fff;
    font-size: 11px;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    background: #8392ab;
    border-radius: 5px;
    box-shadow: none;
  }

  body.lp-body #page-top a:hover,
  body.lp-body #page-top a:focus {
    color: #fff;
    text-decoration: none;
    background: #bec4cf;
  }
}

/* 2026-08-02 「このページのTOPへ▲」がセクションによって隠れる問題の修正。
   #page-top は position:fixed だが z-index の指定が max-width:767px の中にしかなく、
   タブレット〜PC幅では z-index:auto。DOM上あとに来る position 付きセクション
   （.zasetsu-card / .curriculum-accordion など）に上から塗られて見えなくなっていた。
   スマホ側と同じ 9001 を全幅で指定する（追従カート .float_cart_sp の 9000 より上）。 */
body.lp-body #page-top { z-index: 9001; }

.hp_justify {
    text-align: justify;
    word-break: break-all;
}

/* 2026-08-02 CSS監査: .float_cart_title を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

.mobile-copy-break {
  display: none;
}


.f-link a {	
color: #007D73;	
}	
.f-link li:last-child a::before {
border-top: 2px solid #007D73;
border-right: 2px solid #007D73;
}

/* スマホ・タブレット(iPad): ロゴ下の「機械設計に特化した…」テキストを非表示（ロゴのみ表示） */
@media screen and (max-width: 1024px) {
  .p-header__logo-text {
    display: none !important;
  }
}
/* iPad(768〜950px)対策: 講座タイトルとハンバーガーを1行に揃える
   （lp_editor.css は767px以下のみ .bar を flex 化しており、768〜950では縦積みになるため補う） */
@media screen and (max-width: 950px) {
  .p-header__inner__bottom .bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }
}

/* 2026-08-02 CSS監査: 「※本講座は…」注意書きの指定（.program-bottom-box .pbb-note /
   .pbb-lead / .pbb-series）を削除。親の .program-bottom-box が3ページのHTMLに不在で到達不能。
   復元はバックアップから。 */

/* ============================================================
   「考え方＋進め方＋ツールの使い方」セクション刷新（U章）
   ※HTMLは .learning-list を新HTMLブロックに差し替えて使用
   ============================================================ */
.lc-cards {
  display: flex;
  align-items: stretch;
  justify-content: center;
  max-width: 960px;
  margin: 24px auto 22px;
  flex-wrap: nowrap;
}
/* 2026-08-02 CSS監査: .learn-about h3 と .learn-about h3 .lc-lead を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
.lc-card {
  flex: 1 1 0;
  background: transparent;
  border: none;
  border-radius: 16px;
  box-shadow: none;
  padding: 28px 26px 26px;
  position: relative;
  box-sizing: border-box;
}
/* 2026-08-02 CSS監査: U章カードの中身（.lc-num / .lc-icon / .lc-title / .lc-badge / .lc-badge--ghost /
   .lc-desc / .lc-plus / .lc-tools系 / .lc-toollist / .lc-tools-div / .learn-about-txt）と
   SP用@media内の対応指定を一括削除。器の .lc-cards / .lc-card はJS参照の可能性があるため残置。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
/* タブレット(iPad)・スマホ: 考え方/進め方/ツールの使い方カードを縦積み */
@media screen and (max-width: 950px) {
  .lc-cards {
    flex-direction: column;
    max-width: calc(100% - 24px);
    margin: 30px auto 16px;
  }
}

/* 2026-08-02 CSS監査: 「2つの力」01/02カード（.pw-*）一式を削除。
   kyoudo/kousa/seizu/sokusen のいずれのHTMLでも未使用（3ページで実機確認）。
   構想設計LPからの移植時に、使わないまま複製されたブロック。復元はバックアップから。 */

/* ============================================================
   「幅広い業界で採用されています」の業種アイコン（画像→個別アイコン＋ラベル）
   ※HTMLは .feature-number-img の中身（画像2枚）を .ind-list に差し替え
   ※アニメーションは .companies-section（.float-in）側なので自動的に維持される
   アイコン: /wp/wp-content/themes/fantomsemi/images/koso-basic/
   ============================================================ */
/* .ind-list/.ind-item/.ind-icon/.ind-label（業種アイコン）は lp_editor.css に集約（アイコンPC80px 2026-07-20） */

/* ============================================================
   2026-07-18 タイポグラフィ調整（見出し・本文・箇条書き）
   ・h3見出し 24px → 28px
   ・本文 → 18px
   ・箇条書き → 18px
   ・カリキュラム内箇条書き → 17px
   ※ lp_editor.css の var(--font-size-txt)=16px が後勝ちで本文を16pxにするため
     !important で確実に上書きしている。
   ※ ヘッダー/フッター/ナビ/価格/FAQ回答は対象外（意図的に除外）。
   ============================================================ */
/* h3見出し 24px → 28px（FAQのカテゴリ見出し .faq-header h3 は対象外＝元の24pxに戻す） */
/* 見出しサイズ(.feature-number h3 = 28px)は lp_editor.css に集約（!important撤去 2026-07-20）
   ※ .lined は 2026-08-02 CSS監査で削除済みのため記載から除外 */

/* 本文(18px)/お悩み箇条書き(18px)/カリキュラム箇条書き(17px) の!importantは lp_editor.css に集約して撤去（横展開 2026-07-20・func→basic/plan）。six-class li p・pace-under-icon も editor で18px定義済み。
   ※ onayami-box ul li は 2026-08-02 CSS監査で削除済みのため記載から除外 */

/* 2026-08-02 CSS監査: 専門用語アコーディオン（.term-acc* / .term-card）一式を削除。
   kyoudo/kousa/seizu/sokusen のいずれのHTMLでも未使用（3ページで実機確認）。
   構想設計LPからの移植時に、使わないまま複製されたブロック。復元はバックアップから。 */

/* ============================================================
   2026-07-18 個別フォントサイズ調整（箇所ごとの指定）
   ============================================================ */
/* 2026-08-02 CSS監査: .lc-desc / .learn-about-txt のフォントサイズ上書き（および
   lp_editor.css 集約済みの .onayami-bottom に関する注記）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
/* 2026-08-02 CSS監査: .spec .cta-box ul li を削除（.spec が3ページのHTMLに不在で到達不能）。 */
/* 「受講内容やお申し込みについてご不明な点が…」→ 18px */
/* .faq-txt-under はベースを直接 PC18px/スマホ16px に変更（!important撤去 横展開 2026-07-20）。text-wrap/letter-spacing は維持 */
.faq-txt-under { text-wrap: pretty; }
/* スマホでは「スムーズです」の「す」が単独で改行されないよう、少し小さく＋字間を詰める。
   text-wrap:pretty（Safari 17.5+/Chrome）で末尾1文字の孤立も自動回避 */
@media screen and (max-width: 767px) {
  .faq-txt-under { letter-spacing: 1px; }
}

/* 2026-08-02 CSS監査: カリキュラム学習内容の折りたたみ（.pl-toggle* / .pl-collapsible / .pl-open）
   一式を削除。kyoudo/kousa/seizu/sokusen のいずれのHTMLでも未使用（3ページで実機確認）。
   構想設計LPからの移植時に、使わないまま複製されたブロック。復元はバックアップから。 */

/* =========================================================================
   旧本文（全幅ラッパー #kyoudosekkei）の全幅対応（旧→新変換 Step1-4）
   新テンプレでは旧ラッパーのpx幅制約が外れ、本文が左寄せ/全幅化する。
   → 旧本文は1000px中央寄せに復元し、新デザインのバンドだけ100vwブレイクアウト。
   ラッパーidは実機確認済み（強度設計=#kyoudosekkei）。
   ========================================================================= */
.lp-body #kyoudosekkei {
  width: 100%;             /* 旧 style_kyodo の width:960px 固定を上書き。モバイルで960pxはみ出し→全幅ブレイクアウトが右にずれる不具合の是正 */
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
}
/* 2026-08-03 タブレット（iPad）で本文が画面の左右いっぱいに張り付く問題の修正。
   #kyoudosekkei は width:100% / max-width:960px のため、ビューポートが960px以下だと
   コンテナ＝画面幅ちょうどになり、左右に余白が無くなる。
   スマホ(767px以下)は各セクション側にSP用の左右余白があるので対象外、
   961px以上は中央寄せで自然に余白ができるので対象外。その間だけ左右24pxを入れる。
   ※100vwブレイクアウトしている帯（.feature-number / .benefit-v2 / .voice / #price 等）は
     margin-left:calc(50% - 50vw) で算出しており、ここにpaddingを足しても
     画面端に張り付いたまま動かないことを実測確認済み（横スクロールも発生しない）。 */
@media screen and (min-width: 768px) and (max-width: 1009px) {
  .lp-body #kyoudosekkei {
    padding-left: 24px;
    padding-right: 24px;
  }
}
.lp-body main > p {
  max-width: 960px;
  margin: 0 auto;
  text-align: center;
}
.lp-body #kyoudosekkei img {
  max-width: 100%;
  height: auto;
}

/* 旧 style_kyodo.css の「#kyoudosekkei ul,li,p{margin:0}」(id詳細度)が
   新デザイン要素の余白を潰すため、新デザイン要素だけ詳細度で余白を復帰させる。
   （新セクションを追加するたび、余白が潰れる要素はここに #kyoudosekkei スコープで足す） */
/* 講座名帯 .lp-mv h2：旧 #kyoudosekkei h2（濃帯＋白字）を、基礎編の薄帯＋ティール文字へ戻す */
.lp-body #kyoudosekkei .lp-mv h2 {
  color: #007D73;
  background-color: #DEF0EC;
  font-size: clamp(28px, 4vw, 58px);
  margin: -6px auto 0;
  padding: 0;
  border: none;
  text-align: center;
  letter-spacing: 4px;
  line-height: 1.6;
}
.lp-body #kyoudosekkei .lp-mv h2 span { font-size: clamp(21px, 3vw, 48px); }
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .lp-mv h2 { font-size: 32px; padding: .3em 0; line-height: 1.4; }
  .lp-body #kyoudosekkei .lp-mv h2 span { font-size: 24px; display: block; }
}

/* ---- Section2（3カード・社会的証明）：旧 #kyoudosekkei ul,li,p{margin:0;padding:0} で潰れる余白を基礎編値で復帰 ---- */
.lp-body #kyoudosekkei .box-list { margin: 0 auto; }
.lp-body #kyoudosekkei .box-list li { padding: 21px 0; }
.lp-body #kyoudosekkei .box-list li:last-of-type { padding: 21px 20px; }
.lp-body #kyoudosekkei .box-txt { margin: 0 auto; }
.lp-body #kyoudosekkei .number-box { margin: 0 auto 63px; }
.lp-body #kyoudosekkei .under-num { padding: 0 10px; }
.lp-body #kyoudosekkei .feature-number-txt { margin: 0 auto; }
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .box-list li { padding: 40px 15px 20px; margin: 0 auto 30px; }
  .lp-body #kyoudosekkei .box-list li:last-of-type { padding: 30px 20px; margin: 0 auto 30px; }
}

/* ---- 見出し帯 .section-title：旧 #kyoudosekkei h2 を基礎編の薄帯＋ティール文字へ＋全幅バンド化 ---- */
.lp-body #kyoudosekkei .section-title {
  width: 100vw;
  margin: -1px 0 80px;
  padding: 30px 20px 48px;
  color: #007D73; background: #DEF0EC; border: none;
  font-size: 36px; text-align: center; letter-spacing: 4px; line-height: 1.6;
}
/* 受講者の声：基礎編と同じく全幅バンド化＋中央寄せ（見出し帯・声カードが正しい幅・中央に） */
.lp-body #kyoudosekkei .voice {
  display: flex; flex-direction: column; align-items: center;
  width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);
  padding-bottom: 40px;
}
.lp-body #kyoudosekkei .voice .voice-box-list { margin: 0 auto; }
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .section-title { font-size: 24px; margin-bottom: 50px; }
}
/* 2026-08-02 CSS監査: 学習ペース余白復帰の指定（.pace-style / .pace-box）を削除。
   両クラスとも3ページのHTMLに不在で到達不能。復元はバックアップから。 */

/* ---- 料金ブロック #price を全幅バンド化（背景全幅＋内部カードを基礎編サイズに） ---- */
.lp-body #kyoudosekkei #price {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
/* 2026-08-02 CSS監査: 講座仕様3カードの中央寄せ指定（.spec_list 系）を削除。
   .spec_list が3ページのHTMLに不在で到達不能。復元はバックアップから。 */

/* ===== 後半（「あなたのペース〜」以降）PC版の役割別フォント調整 2026-07-27 =====
   共通デザイン由来の18pxが前半（本文16/カード説明14/注記13-15/導入17/見出し19）より大きいため、
   PC限定(min-width:768px)＋後半クラス限定で前半に合わせる。SP(767px以下)は変更しない。
   base定義は lp_editor.css 等（変更不可）にあるため、ここで上書きする。 */
@media screen and (min-width: 768px) {
  /* 2026-08-02 CSS監査: このブロック内の .pace-txt / .pace-under-icon / .price-box 配下 /
     .spec_list 配下の指定を削除（いずれも親クラスが3ページのHTMLに不在で到達不能）。 */
  /* 申込方法 ステップ説明 */
  /* 受講者の声 属性 */
  .lp-body #kyoudosekkei .voice .attribute { font-size: 14px; }
  /* 受講者の声 コメント本文（21px→17px）と、声カード間の余白を詰める */
  .lp-body #kyoudosekkei .voice .voice-comment { font-size: 17px; }
  .lp-body #kyoudosekkei .voice .voice-box { margin-bottom: 14px; }
  /* 問い合わせ前の説明文（20px→16px）＋行間を詰めてボタンとの間隔を縮める */
  .lp-body #kyoudosekkei .faq-txt-under { font-size: 16px; line-height: 1.7; }
  /* 説明文と問い合わせボタンの間に余白を入れる（現状ほぼ0でくっついているため） */
  .lp-body #kyoudosekkei .faq-cta { margin-top: 24px; }
}
/* 問い合わせ前の説明文の左右余白・下余白。style_kyodo.css の
   「#kyoudosekkei p { margin: 0 }」（詳細度 1,0,1）に負けて .faq-txt-under の
   margin が効かず、スマホで文字が画面端に張り付き＋ボタンとの隙間も0になるため、
   #kyoudosekkei を含む高詳細度で指定し直す 2026-07-29 */
.lp-body #kyoudosekkei .faq-txt-under { margin: 45px auto 24px; max-width: 620px; }
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .faq-txt-under { margin: 0 20px 30px; }
}
/* 受講者の声カードの境目を分かりやすく（白セクション×白カードで境界が見えないため薄い枠線＋角丸）。PC・スマホ共通 */
.lp-body #kyoudosekkei .voice .voice-box { border: 1px solid #DCE3E8; border-radius: 8px; }

/* ---- グループ割引表：旧 #kyoudosekkei table tr th/td（trで詳細度高）に負けるため、2ID詳細度で基礎編デザインを復帰 ---- */
.lp-body #kyoudosekkei #price table { border-radius: 4px; overflow: hidden; }
.lp-body #kyoudosekkei #price table th { background-color: #1C7E76; color: #FFF; }
.lp-body #kyoudosekkei #price table th,
.lp-body #kyoudosekkei #price table td { padding: 2% 5%; border: 0; }
.lp-body #kyoudosekkei #price .group tbody tr:nth-child(odd) { background-color: #F4FBF9; }
.lp-body #kyoudosekkei #price .group tbody tr:nth-child(even) { background-color: #DBF0EA; }
/* 2026-08-02 CSS監査: td.discount と .under-table の上書き指定を削除
   （いずれも3ページのHTMLに不在で到達不能）。復元はバックアップから。 */
/* 新デザインのバンドは背景を画面いっぱいに（中身は各セクションのmax-widthで中央） */
.lp-body .lp-mv,
.lp-body .cp_bar,
.lp-body .lp-cta-sec,
.lp-body .feature-container,
.lp-body .feature-number {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

/* ---- LP微調整（2026-07-26）旧→新変換の余白是正 ---- */
/* ①3カード上の余白過大の是正：hero直後の firstview 下余白50px（旧style_kyodo由来）を詰める。
   基礎編は3カードの前にCTA帯があるが、強度設計はhero直後のため50px＋80pt＝130pxの空白になっていた。 */
.lp-body #kyoudosekkei .firstview { margin-bottom: 0; }
/* ②problem セクション上の余白（旧・悩み画像の食い込み対策）は、悩みセクション全面リニューアルに伴い不要のため0に。 */
.lp-body #kyoudosekkei .problem { margin-top: 0; }

/* ---- LP微調整（2026-07-26 その2）旧本文の見出し帯を即戦力LP同様に「全幅＋薄背景＋濃文字」へ ----
   旧 style_kyodo.css の #kyoudosekkei h2（濃ティール帯・白字・#kyoudosekkei max-width960で960px止まり）を、
   基礎編/即戦力と同じ全幅バンド＋薄ティール背景#DEF0EC＋濃ティール文字#007D73に。緑の濃帯セクションが対象。 */
.lp-body #kyoudosekkei .need h2,
.lp-body #kyoudosekkei .kaiketsu h2 {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: #DEF0EC;
  color: #007D73;
}
/* オレンジの「5つの理由」帯はアクセント色を維持し、幅だけ全幅に揃える */
.lp-body #kyoudosekkei .reason h2 {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* ---- 見出し帯：即戦力LP同様に「文字上の横線（アクセントバー）」＋元の改行(\n)を反映 ----
   旧本文の見出しは <br> ではなくソース内の改行文字(\n)で改行していたため、
   white-space:pre-line で元の改行位置を復活。バーは ::before（52×4px・中央）。 */
.lp-body #kyoudosekkei .problem h2,
.lp-body #kyoudosekkei .need h2,
.lp-body #kyoudosekkei .kaiketsu h2,
.lp-body #kyoudosekkei .reason h2 {
  white-space: pre-line;
  padding-top: 30px;
}
.lp-body #kyoudosekkei .need h2::before,
.lp-body #kyoudosekkei .kaiketsu h2::before {
  content: "";
  display: block;
  width: 52px;
  height: 4px;
  background: #007D73;
  margin: 0 auto 20px;
}
/* 「5つの理由」帯も薄ティール背景なので横線は緑（他の帯と統一） */
.lp-body #kyoudosekkei .reason h2::before {
  content: "";
  display: block;
  width: 52px;
  height: 4px;
  background: #007D73;
  margin: 0 auto 20px;
}

/* ---- 強度設計入門講座：全9章カリキュラム・アコーディオン ---- */
.lp-body #kyoudosekkei .curriculum-accordion,
.lp-body #kyoudosekkei .curriculum-accordion * {
  box-sizing: border-box;
}

.lp-body #kyoudosekkei .curriculum-accordion {
  width: 100vw;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  padding: 0 0 84px;
  overflow: clip;
  background: #FFF;
  color: #122D4F;
  word-break: normal;
  overflow-wrap: break-word;
  line-break: strict;
}

.lp-body #kyoudosekkei .curriculum-accordion__header {
  width: 100%;
  padding: 32px 20px 30px;
  background: #E8F5F2;
  border-bottom: 1px solid #D6E5E3;
}

.lp-body #kyoudosekkei .curriculum-accordion__header-inner {
  width: min(1000px, 100%);
  margin: 0 auto;
}

.lp-body #kyoudosekkei .curriculum-accordion__inner {
  width: min(1040px, 100%);
  margin: 24px auto 0;
  padding: 0 20px;
}

.lp-body #kyoudosekkei .kaiketsu .curriculum-accordion .curriculum-accordion__title {
  position: relative;
  width: auto;
  margin: 0;
  padding: 30px 10px 0;
  background: transparent;
  border: 0;
  color: #007F78;
  font-size: 34px;
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: .03em;
  text-align: center;
}

.lp-body #kyoudosekkei .kaiketsu .curriculum-accordion .curriculum-accordion__title::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  width: 52px;
  height: 4px;
  margin: 0;
  border-radius: 999px;
  background: #007F78;
  transform: translateX(-50%);
}

.lp-body #kyoudosekkei .curriculum-accordion__lead {
  margin: 12px auto 0;
  color: #53667E;
  font-size: 15px;
  line-height: 1.8;
  text-align: center;
}

.lp-body #kyoudosekkei .curriculum-accordion__controls {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin: 0 0 12px;
}

.lp-body #kyoudosekkei .curriculum-accordion__control {
  min-height: 38px;
  padding: 7px 15px;
  appearance: none;
  background: #FFF;
  border: 1px solid #BFD8D4;
  border-radius: 6px;
  color: #006B66;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
  cursor: pointer;
}

.lp-body #kyoudosekkei .curriculum-accordion__control:hover {
  background: #E8F5F2;
}

.lp-body #kyoudosekkei .curriculum-accordion__list {
  display: grid;
  gap: 9px;
}

.lp-body #kyoudosekkei .curriculum-accordion__item {
  overflow: hidden;
  background: #FFF;
  border: 1px solid #D6E5E3;
  border-radius: 9px;
  transition: background-color .2s ease, border-color .2s ease;
}

.lp-body #kyoudosekkei .curriculum-accordion__item.is-open {
  background: #F3FAF8;
  border-color: #A9D0CA;
  border-left: 4px solid #007F78;
}

.lp-body #kyoudosekkei .curriculum-accordion__toggle {
  display: grid;
  width: 100%;
  min-height: 68px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 12px 16px 12px 13px;
  appearance: none;
  background: transparent;
  border: 0;
  color: #122D4F;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
}

.lp-body #kyoudosekkei .curriculum-accordion__toggle:hover {
  background: #F3FAF8;
}

.lp-body #kyoudosekkei .curriculum-accordion__number {
  display: inline-flex;
  min-width: 68px;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  padding: 7px 12px;
  border-radius: 6px;
  background: #007F78;
  color: #FFF;
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  grid-column: 1;
  grid-row: 1 / 3;
}

.lp-body #kyoudosekkei .curriculum-accordion__heading {
  display: block;
  min-width: 0;
  grid-column: 2;
  grid-row: 1;
}

.lp-body #kyoudosekkei .curriculum-accordion__chapter-title {
  display: block;
  color: #122D4F;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.45;
}

.lp-body #kyoudosekkei .curriculum-accordion__summary {
  display: block;
  grid-column: 2;
  grid-row: 2;
  margin-top: -4px;
  color: #596B80;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.55;
}

.lp-body #kyoudosekkei .curriculum-accordion__icon {
  position: relative;
  display: block;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #E8F5F2;
  color: #007F78;
  flex: 0 0 auto;
  grid-column: 3;
  grid-row: 1 / 3;
}

.lp-body #kyoudosekkei .curriculum-accordion__icon::before,
.lp-body #kyoudosekkei .curriculum-accordion__icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 15px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  transform: translate(-50%, -50%);
  transition: transform .2s ease;
}

.lp-body #kyoudosekkei .curriculum-accordion__icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.lp-body #kyoudosekkei .curriculum-accordion__toggle[aria-expanded="true"] .curriculum-accordion__icon::after {
  transform: translate(-50%, -50%) rotate(0deg);
}

.lp-body #kyoudosekkei .curriculum-accordion__toggle:focus-visible,
.lp-body #kyoudosekkei .curriculum-accordion__control:focus-visible,
.lp-body #kyoudosekkei .curriculum-accordion__slide:focus-visible,
.lp-body #kyoudosekkei .curriculum-lightbox__close:focus-visible {
  outline: 3px solid rgba(0, 127, 120, .28);
  outline-offset: 3px;
}

.lp-body #kyoudosekkei .curriculum-accordion__panel {
  background: #F3FAF8;
}

.lp-body #kyoudosekkei .curriculum-accordion__panel[hidden] {
  display: none;
}

.lp-body #kyoudosekkei .curriculum-accordion.is-no-js .curriculum-accordion__panel[hidden] {
  display: block !important;
}

.lp-body #kyoudosekkei .curriculum-accordion.is-no-js .curriculum-accordion__controls {
  display: none;
}

.lp-body #kyoudosekkei .curriculum-accordion__content {
  padding: 24px 30px 30px;
  border-top: 1px solid #D6E5E3;
}

.lp-body #kyoudosekkei .curriculum-accordion__detail-title {
  position: relative;
  margin: 0 0 14px;
  padding-left: 14px;
  color: #006B66;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.45;
}

.lp-body #kyoudosekkei .curriculum-accordion__detail-title::before {
  content: "";
  position: absolute;
  top: 3px;
  bottom: 3px;
  left: 0;
  width: 4px;
  border-radius: 3px;
  background: #007F78;
}

.lp-body #kyoudosekkei .curriculum-accordion__note {
  margin-left: 10px;
  color: #6B7B8E;
  font-size: 12px;
  font-weight: 500;
}

.lp-body #kyoudosekkei .curriculum-accordion__learning-list {
  margin-bottom: 24px;
}

.lp-body #kyoudosekkei .curriculum-accordion__learning-list ul {
  margin: 0;
  padding: 0;
  columns: 2;
  column-gap: 46px;
  list-style: none;
}

.lp-body #kyoudosekkei .curriculum-accordion__learning-list li {
  position: relative;
  break-inside: avoid;
  margin: 0 0 9px;
  padding-left: 19px;
  color: #334B65;
  font-size: 15px;
  line-height: 1.75;
}

.lp-body #kyoudosekkei .curriculum-accordion__learning-list li::before {
  content: "";
  position: absolute;
  top: .72em;
  left: 3px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #007F78;
}

.lp-body #kyoudosekkei .curriculum-accordion__slide-strip {
  width: 100%;
  overflow: hidden;
}

.lp-body #kyoudosekkei .curriculum-accordion__slide-fallback {
  display: block;
  width: 100%;
  color: inherit;
  text-decoration: none;
}

.lp-body #kyoudosekkei .curriculum-accordion__slide-fallback img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  border: 1px solid #D6E5E3;
  border-radius: 6px;
}

.lp-body #kyoudosekkei .curriculum-accordion__slide-strip.is-enhanced .curriculum-accordion__slide-fallback {
  display: none;
}

.lp-body #kyoudosekkei .curriculum-accordion__slide-track {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  width: 100%;
}

.lp-body #kyoudosekkei .curriculum-accordion__slide {
  display: block;
  width: 100%;
  aspect-ratio: 225 / 164;
  padding: 0;
  appearance: none;
  background-color: #FFF;
  background-image: var(--slide-image);
  background-repeat: no-repeat;
  background-position: var(--slide-position) center;
  background-size: var(--slide-size);
  border: 1px solid #D6E5E3;
  border-radius: 6px;
  /* クリックでの拡大表示をやめたため、拡大カーソルは出さない 2026-07-29 */
  cursor: default;
}

.lp-body #kyoudosekkei .curriculum-accordion__content .sample-video-btn {
  margin-top: 18px;
}

.curriculum-lightbox[hidden] {
  display: none !important;
}

.curriculum-lightbox {
  position: fixed;
  z-index: 100001;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
}

.curriculum-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(8, 28, 42, .78);
  border: 0;
  cursor: zoom-out;
}

.curriculum-lightbox__dialog {
  position: relative;
  z-index: 1;
  display: flex;
  width: min(1100px, 96vw);
  max-height: 92vh;
  align-items: center;
  justify-content: center;
  padding: 50px 22px 22px;
  background: #FFF;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .3);
}

.curriculum-lightbox__image {
  display: block;
  max-width: 100%;
  max-height: calc(92vh - 72px);
  width: auto;
  height: auto;
  margin: 0;
}

.curriculum-lightbox__close {
  position: absolute;
  top: 10px;
  right: 12px;
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  padding: 0;
  appearance: none;
  background: #E8F5F2;
  border: 0;
  border-radius: 50%;
  color: #007F78;
  font-size: 27px;
  line-height: 1;
  cursor: pointer;
}

body.curriculum-lightbox-open {
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .curriculum-accordion {
    padding: 0 0 60px;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__header {
    padding: 30px 14px 26px;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__inner {
    width: 100%;
    margin-top: 18px;
    padding: 0 14px;
  }

  .lp-body #kyoudosekkei .kaiketsu .curriculum-accordion .curriculum-accordion__title {
    padding: 25px 0 0;
    font-size: 26px;
    line-height: 1.5;
    letter-spacing: .015em;
  }

  .lp-body #kyoudosekkei .kaiketsu .curriculum-accordion .curriculum-accordion__title::before {
    width: 44px;
    height: 3px;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__lead {
    margin: 10px 0 0;
    font-size: 13px;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__controls {
    justify-content: flex-end;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__control {
    flex: 0 1 auto;
    min-height: 40px;
    padding: 8px 13px;
    font-size: 12px;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__toggle {
    min-height: 0;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    padding: 12px;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__number {
    min-width: 58px;
    min-height: 34px;
    padding: 7px 9px;
    font-size: 13px;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__chapter-title {
    font-size: 16px;
    line-height: 1.45;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__summary {
    grid-column: 1 / -1;
    grid-row: 2;
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.55;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__heading {
    grid-column: 2;
    grid-row: 1;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__number,
  .lp-body #kyoudosekkei .curriculum-accordion__icon {
    grid-row: 1;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__icon {
    width: 32px;
    height: 32px;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__content {
    padding: 20px 17px 24px;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__detail-title {
    font-size: 16px;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__note {
    display: block;
    margin: 4px 0 0;
    font-size: 11px;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__learning-list ul {
    columns: 1;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__learning-list li {
    font-size: 14px;
    line-height: 1.72;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__slide-strip {
    width: calc(100% + 34px);
    margin-left: -17px;
    padding: 0 17px 10px;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
    scroll-snap-type: x mandatory;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__slide-track {
    display: flex;
    width: max-content;
    gap: 12px;
  }

  .lp-body #kyoudosekkei .curriculum-accordion__slide {
    width: min(82vw, 330px);
    flex: 0 0 min(82vw, 330px);
    scroll-snap-align: center;
    scroll-snap-stop: always;
  }

  .curriculum-lightbox {
    padding: 12px;
  }

  .curriculum-lightbox__dialog {
    width: 100%;
    padding: 48px 10px 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lp-body #kyoudosekkei .curriculum-accordion__item,
  .lp-body #kyoudosekkei .curriculum-accordion__icon::before,
  .lp-body #kyoudosekkei .curriculum-accordion__icon::after {
    transition: none;
  }
}

/* 2026-08-02 CSS監査: 旧本文の細部調整（.about_curriculum / .flow_circle / .kodawari の white-space、
   .otherkouza と .nyumonkouza の2カラム化@media）を一括削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* ---- LP微調整（2026-07-26 その4）「5つの理由」セクションを即戦力LP風に ----
   理由1〜5の見出し(.number有りのh3)をティール帯＋番号丸バッジに、説明文を16pxに、
   スライド画像を中央寄せに。番号のない h3「理解が深まる設計用語」は帯化しない(:has(.number)で限定)。 */
.lp-body #kyoudosekkei .reason { font-size: 16px; line-height: 1.9; }
.lp-body #kyoudosekkei .reason h3:has(.number) {
  position: relative;
  background: #007D73;
  color: #fff;
  font-size: 22px;
  line-height: 1.5;
  padding: 16px 28px 14px 112px;
  margin: 64px 0 26px;
  border-radius: 6px;
  font-weight: 700;
}
/* 番号は角丸の四角バッジ（「理由N」が横長で収まりが良い） */
.lp-body #kyoudosekkei .reason h3:has(.number) .number {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 88px;
  min-height: 48px;
  border-radius: 8px;
  background: #024E48;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  padding: 8px 6px;
  box-sizing: border-box;
}
.lp-body #kyoudosekkei .reason h3:has(.number) .color { color: #FFDE7A; }
/* 2026-08-02 CSS監査: .reason 配下の .ws / .bold2 / img.alignleft の指定を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .reason h3:has(.number) { padding: 14px 14px 12px 88px; font-size: 18px; }
  .lp-body #kyoudosekkei .reason h3:has(.number) .number { width: 72px; min-height: 42px; font-size: 14px; }
}

/* 理由セクションの画像：PC/SP同一画像の重複を解消し、配置を指定 */
@media screen and (min-width: 768px) {
  /* デスクトップではSP用(visible-phone)を隠す＝重複解消 */
  .lp-body #kyoudosekkei .reason img.visible-phone { display: none !important; }
  /* 各理由の見出しで前の回り込みを解除 */
  .lp-body #kyoudosekkei .reason h3:has(.number) { clear: both; }
  /* 理由2(img_24)・理由4(img_09)は画像を左・説明文を右に回り込ませる（理由3 img_08は説明の下＝既定のまま） */
  .lp-body #kyoudosekkei .reason img.hidden-phone[src*="img_24"],
  .lp-body #kyoudosekkei .reason img.hidden-phone[src*="img_09"] {
    float: left;
    margin: 6px 30px 20px 0;
    max-width: 46%;
    height: auto;
  }
}
@media screen and (max-width: 767px) {
  /* モバイルではPC用(hidden-phone)を隠す＝重複解消（SP用が表示される） */
  .lp-body #kyoudosekkei .reason img.hidden-phone { display: none !important; }
}

/* 2026-08-02 CSS監査: 旧ポイント1〜4セクション（.point 一式・番号見出し・SP用@media）を一括削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* ---- LP微調整（2026-07-26 その6）ヘッダーをテキスト化（即戦力LPの .lp-hero をティール化で複製） ----
   旧ヘッダー画像 <h1><img lp_mv_kyoudo.jpg></h1> を、左コピー＋右画像枠のテキストヒーローに置換。
   背景は材料力学講座の図を使用。 */
.lp-body #kyoudosekkei .lp-hero {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background-color: #fff;
  background-image:
    linear-gradient(rgba(255, 255, 255, .55), rgba(255, 255, 255, .55)),
    url("/wp/wp-content/themes/fantomsemi/images/kyoudo/hero-material-mechanics-bg.png");
  background-repeat: no-repeat, no-repeat;
  background-position: center, calc(50% + 70px) center;
  background-size: cover, auto 100%;
}
.lp-body #kyoudosekkei .lp-hero__inner {
  position: relative;
  max-width: 960px;
  margin: 0 auto;
  min-height: 470px;
  display: block;
  padding: 16px 0 0;
  box-sizing: border-box;
}
/* 人物画像は右下に絶対配置で背面（大きくしてもテキスト幅を圧迫しない／左側が7要素図に隠れる） */
.lp-body #kyoudosekkei .lp-hero__illust { position: absolute; right: 0; bottom: 0; z-index: 1; }
/* 右画像下部の「法人・団体受講にも対応」メッセージ（アイコンなし） */
.lp-body #kyoudosekkei .lp-hero__corp {
  position: absolute; left: 50%; transform: translateX(-50%); bottom: 14px;
  background: rgba(255, 255, 255, .92); border: 1px solid #cfe6e2; border-radius: 12px;
  padding: 12px 22px; box-shadow: 0 2px 10px rgba(20, 60, 90, .14); text-align: left; white-space: nowrap;
}
.lp-body #kyoudosekkei .lp-hero__corp-ttl {
  font-size: 20px; font-weight: 800; color: #007D73; margin: 0 0 6px;
  padding-bottom: 6px; border-bottom: 1px solid #b7ddd7;
}
.lp-body #kyoudosekkei .lp-hero__corp-sub { font-size: 14px; font-weight: 700; color: #33475B; margin: 0; }
.lp-body #kyoudosekkei .lp-hero__illust img { display: block; height: 470px; width: auto; max-width: none; }
.lp-body #kyoudosekkei .lp-hero__text {
  position: relative;
  max-width: 640px;
  padding: 14px 20px 18px 14px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 14px;
  z-index: 2;
}
/* 左コピー下：「設計者に必要な7つの強度の基礎を学べる」＋7要素の図 */
.lp-body #kyoudosekkei .lp-hero__parts-ttl { font-size: 16px; font-weight: 700; color: #0B5F58; margin: 0; }
.lp-body #kyoudosekkei .lp-hero__parts { display: block; width: 500px; max-width: none; height: auto; margin: -7px 0 0; }
/* ヘッド画像と下のタイトル帯(.lp-mv)の間の余白を詰める */
.lp-body #kyoudosekkei .lp-mv { padding-top: 6px; }
.lp-body #kyoudosekkei .lp-hero__lead {
  font-size: 17px; line-height: 1.7; font-weight: 700; color: #0B5F58;
  margin: 0; text-align: left; padding-left: 14px; border-left: 4px solid #007D73;
}
.lp-body #kyoudosekkei .lp-hero__title {
  font-size: 50px; line-height: 1.45; font-weight: 800; color: #007D73;
  margin: 0; text-align: left;
}
.lp-body #kyoudosekkei .lp-hero__note {
  display: inline-block; align-self: flex-start; width: auto;
  background: rgba(255, 255, 255, .9); color: #33475B;
  font-size: 17px; font-weight: 700; line-height: 1.6;
  padding: 12px 20px; border-radius: 12px; margin: 0; text-align: left;
  box-shadow: 0 2px 8px rgba(20, 60, 90, .10);
}
/* 2026-08-02 CSS監査: ヒーローの .lp-hero__badge と画像プレースホルダ .lp-hero__ph（SP指定を含む）を削除。
   右の画像は .lp-hero__illust img に置き換え済み。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .lp-hero__inner { display: block; min-height: auto; padding: 20px 16px 0; }
  .lp-body #kyoudosekkei .lp-hero__text { position: static; width: auto; max-width: none; }
  .lp-body #kyoudosekkei .lp-hero__illust { position: static; text-align: center; }
  .lp-body #kyoudosekkei .lp-hero__parts { width: auto; max-width: 100%; }
  .lp-body #kyoudosekkei .lp-hero__lead { font-size: 14px; margin: 0 0 12px; }
  .lp-body #kyoudosekkei .lp-hero__title { font-size: 24px; line-height: 1.5; margin: 0 0 14px; }
  .lp-body #kyoudosekkei .lp-hero__note { font-size: 13px; padding: 10px 14px; margin: 0 0 12px; }
  .lp-body #kyoudosekkei .lp-hero__illust img {
    height: auto;
    width: auto;
    max-width: 88%;
    margin: -22px auto 0;
  }
  .lp-body #kyoudosekkei .lp-hero__corp { position: static; transform: none; margin: 12px auto 0; white-space: normal; }
  .lp-body #kyoudosekkei .lp-hero__corp-ttl { font-size: 16px; }
  .lp-body #kyoudosekkei .lp-hero__corp-sub { font-size: 12px; }
}

/* ---- LP微調整（2026-07-26 その7）「悩み」セクションを全面リニューアル（見出し＋6カード＋CTA） ---- */
/* 白／薄緑の全幅バンドを交互に（LP共通デザイン）。中身は960px中央寄せ。 */
.lp-body #kyoudosekkei .nayami-sec,
.lp-body #kyoudosekkei .hikaku-sec {
  position: relative;
  padding: 30px 0 56px;
  border-radius: 0;
}
/* 全幅の背景バンドは ::before で（中身は960px中央のまま保つ＝左寄せにならない） */
.lp-body #kyoudosekkei .nayami-sec::before,
.lp-body #kyoudosekkei .hikaku-sec::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  left: calc(50% - 50vw);
  width: 100vw;
  z-index: 0;
}
.lp-body #kyoudosekkei .nayami-sec::before { background: #fff; }     /* 悩み＝白 */
.lp-body #kyoudosekkei .hikaku-sec::before { background: #EAF5F1; }  /* 比較＝薄緑 */
.lp-body #kyoudosekkei .nayami-sec > *,
.lp-body #kyoudosekkei .hikaku-sec > * { position: relative; z-index: 1; }
.lp-body #kyoudosekkei .nayami-h2 { position: relative; background: none; color: #0C6E64; font-size: 34px; font-weight: 800; text-align: center; margin: 0 0 6px; padding: 0; line-height: 1.4; width: auto; }
.lp-body #kyoudosekkei .nayami-h2::before { content: ""; display: block; width: 52px; height: 4px; background: #0C6E64; margin: 0 auto 22px; }
.lp-body #kyoudosekkei .nayami-lead {
  margin: 0 0 44px;
  color: #33475B;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.65;
  text-align: center;
}
.lp-body #kyoudosekkei .nayami-lead-break { display: none; }
.lp-body #kyoudosekkei .nayami-list { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 0 0 24px; padding: 0; }
.lp-body #kyoudosekkei .nayami-list li { display: flex; align-items: center; gap: 18px; background: #fff; border: 1px solid #E3EAEE; border-radius: 12px; padding: 22px 24px; margin: 0; box-shadow: 0 1px 4px rgba(20, 60, 90, .05); }
.lp-body #kyoudosekkei .nayami-list li p { margin: 0; font-size: 17px; font-weight: 700; color: #2D344B; line-height: 1.5; }
.lp-body #kyoudosekkei .nayami-ck { flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%; background: #0E7C72; position: relative; }
.lp-body #kyoudosekkei .nayami-ck::before { content: ""; position: absolute; left: 14px; top: 11px; width: 11px; height: 19px; border-right: 4px solid #fff; border-bottom: 4px solid #fff; transform: rotate(45deg); }
@media screen and (min-width: 768px) {
  .lp-body #kyoudosekkei .nayami-ck::before { left: 15px; }
}
.lp-body #kyoudosekkei .nayami-sec .o { color: #E8552A; }
.lp-body #kyoudosekkei .nayami-cta { background: #E7F1EF; border-radius: 14px; padding: 28px 30px; text-align: center; }
.lp-body #kyoudosekkei .nayami-cta-ttl { display: flex; align-items: center; justify-content: center; gap: 14px; color: #0C6E64; font-size: 26px; font-weight: 800; margin: 0 0 10px; }
.lp-body #kyoudosekkei .nayami-cta-sub { margin: 0; color: #33475B; font-size: 16px; font-weight: 700; }
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .nayami-sec { padding: 32px 16px; }
  .lp-body #kyoudosekkei .nayami-h2 { font-size: 24px; }
  .lp-body #kyoudosekkei .nayami-lead-break { display: initial; }
  .lp-body #kyoudosekkei .nayami-list { grid-template-columns: 1fr; gap: 12px; }
  .lp-body #kyoudosekkei .nayami-list li p { font-size: 15px; }
  .lp-body #kyoudosekkei .nayami-cta-ttl { font-size: 20px; }
}

/* ---- LP微調整（2026-07-26 その8）「従来の学習方法との違い」比較セクション（2カード＋VS＋結論） ----
   背景・全幅・中央寄せは その7 の共通バンド指定（.nayami-sec,.hikaku-sec）を使用。 */
.lp-body #kyoudosekkei .hikaku-h2 { position: relative; background: none; color: #0C6E64; font-size: 32px; font-weight: 800; text-align: center; margin: 0 0 6px; padding: 0; line-height: 1.4; width: auto; }
.lp-body #kyoudosekkei .hikaku-h2::before { content: ""; display: block; width: 52px; height: 4px; background: #0C6E64; margin: 0 auto 22px; }
.lp-body #kyoudosekkei .hikaku-lead { text-align: center; color: #33475B; font-size: 16px; font-weight: 700; margin: 0 0 60px; }
.lp-body #kyoudosekkei .hikaku-cols { display: flex; align-items: stretch; justify-content: center; gap: 30px; position: relative; }
.lp-body #kyoudosekkei .hikaku-card { flex: 1 1 0; background: #fff; border-radius: 14px; padding: 34px 26px 26px; position: relative; display: flex; flex-direction: column; }
.lp-body #kyoudosekkei .hikaku-card--old { border: 2px solid #3A4A63; }
.lp-body #kyoudosekkei .hikaku-card--new { border: 2px solid #0E7C72; }
.lp-body #kyoudosekkei .hikaku-badge { position: absolute; top: -15px; left: 50%; transform: translateX(-50%); font-size: 14px; font-weight: 700; color: #fff; padding: 5px 18px; border-radius: 6px; white-space: nowrap; }
.lp-body #kyoudosekkei .hikaku-badge--gray { background: #3A4A63; }
.lp-body #kyoudosekkei .hikaku-badge--teal { background: #0E7C72; }
.lp-body #kyoudosekkei .hikaku-card-ttl { text-align: center; font-size: 26px; font-weight: 800; color: #2A3B5C; margin: 6px 0 12px; }
.lp-body #kyoudosekkei .hikaku-card-ttl--teal { color: #0C6E64; }
.lp-body #kyoudosekkei .hikaku-card-desc { text-align: center; font-size: 15px; font-weight: 700; color: #4A5568; margin: 0 0 16px; line-height: 1.6; }
.lp-body #kyoudosekkei .hikaku-img { display: block; width: 100%; max-width: 100%; height: auto; margin: 0 auto 18px; }
.lp-body #kyoudosekkei .hikaku-note { margin: auto 0 0; border-radius: 10px; padding: 14px 16px; text-align: center; font-size: 16px; font-weight: 800; }
.lp-body #kyoudosekkei .hikaku-note--gray { background: #EEF0F2; color: #3A4A63; }
.lp-body #kyoudosekkei .hikaku-note--teal { background: #E7F1EF; color: #0C6E64; }
.lp-body #kyoudosekkei .hikaku-vs { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; width: 48px; height: 48px; border-radius: 50%; background: #0E7C72; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 800; }
.lp-body #kyoudosekkei .hikaku-concl { background: #fff; border-radius: 12px; padding: 24px; text-align: center; font-size: 24px; font-weight: 800; color: #0C6E64; margin-top: 22px; }
.lp-body #kyoudosekkei .hikaku-concl .o { color: #E8552A; }
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .hikaku-sec { padding: 30px 14px; }
  .lp-body #kyoudosekkei .hikaku-h2 { font-size: 22px; }
  .lp-body #kyoudosekkei .hikaku-cols { flex-direction: column; gap: 36px; }
  .lp-body #kyoudosekkei .hikaku-vs { position: static; transform: none; margin: -18px auto; }
  .lp-body #kyoudosekkei .hikaku-card-desc,
  .lp-body #kyoudosekkei .hikaku-note,
  .lp-body #kyoudosekkei .hikaku-concl {
    word-break: normal;
    overflow-wrap: break-word;
    line-break: strict;
    text-wrap: balance;
  }
  .lp-body #kyoudosekkei .hikaku-concl { font-size: 18px; }
}

/* ---- LP微調整（2026-07-26 その9）「強度設計ができるエンジニアになるまで」4ステップ（白バンド） ---- */
.lp-body #kyoudosekkei .flow-sec { position: relative; padding: 30px 0 56px; }
.lp-body #kyoudosekkei .flow-sec::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(50% - 50vw); width: 100vw; background: #fff; z-index: 0; }
.lp-body #kyoudosekkei .flow-sec > * { position: relative; z-index: 1; }
.lp-body #kyoudosekkei .flow-h2 { background: none; width: auto; color: #123F6D; font-size: 32px; font-weight: 800; text-align: center; margin: 0 0 6px; padding: 0; line-height: 1.4; }
.lp-body #kyoudosekkei .flow-h2::before { content: ""; display: block; width: 52px; height: 4px; background: #0C6E64; margin: 0 auto 22px; }
.lp-body #kyoudosekkei .flow-lead { text-align: center; color: #33475B; font-size: 16px; font-weight: 700; margin: 0 0 74px; }
.lp-body #kyoudosekkei .flow-steps { display: flex; align-items: stretch; justify-content: center; gap: 0; position: relative; }
.lp-body #kyoudosekkei .flow-step {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  padding: 12px 10px 18px;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  text-align: center;
}
.lp-body #kyoudosekkei .flow-step--hl {
  background: #F3FAF8;
  border: 0;
  border-radius: 12px;
  box-shadow: inset 0 0 0 1px rgba(0, 127, 120, .18);
}
.lp-body #kyoudosekkei .flow-num { color: #0C6E64; font-size: 30px; font-weight: 800; line-height: 1; margin: 0 0 12px; }
.lp-body #kyoudosekkei .flow-num small { display: block; font-size: 12px; letter-spacing: 2px; margin-bottom: 2px; }
.lp-body #kyoudosekkei .flow-step img { display: block; width: 100%; height: auto; border-radius: 6px; margin: 0 0 12px; }
.lp-body #kyoudosekkei .flow-step-ttl {
  width: 100%;
  margin: 1px auto 9px;
  color: #2A3B5C;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.5;
  text-align: center;
}
.lp-body #kyoudosekkei .flow-step-desc {
  width: 86%;
  max-width: 190px;
  margin: 0 auto;
  color: #4A5568;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.8;
  text-align: left;
  word-break: normal;
  overflow-wrap: break-word;
  line-break: strict;
}
.lp-body #kyoudosekkei .flow-step-desc br { display: none; }
.lp-body #kyoudosekkei .flow-arrow { flex: 0 0 40px; align-self: center; position: relative; }
.lp-body #kyoudosekkei .flow-arrow::before { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 26px; height: 26px; border-radius: 50%; background: #0E7C72; }
.lp-body #kyoudosekkei .flow-arrow::after { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-60%, -50%) rotate(45deg); width: 7px; height: 7px; border-right: 2px solid #fff; border-top: 2px solid #fff; }
.lp-body #kyoudosekkei .flow-goal { display: flex; align-items: center; gap: 20px; background: #EAF3F1; border-radius: 14px; padding: 24px 34px; margin-top: 26px; }
.lp-body #kyoudosekkei .flow-goal-ic { flex: 0 0 auto; width: 54px; height: 54px; border-radius: 50%; background: #0E7C72; position: relative; }
.lp-body #kyoudosekkei .flow-goal-ic::before {
  content: "";
  position: absolute;
  top: 47%;
  left: 50%;
  width: 13px;
  height: 22px;
  border-right: 4px solid #fff;
  border-bottom: 4px solid #fff;
  transform: translate(-50%, -50%) rotate(45deg);
  transform-origin: center;
}
.lp-body #kyoudosekkei .flow-goal p { margin: 0; font-size: 24px; font-weight: 800; color: #0C6E64; line-height: 1.5; }
.lp-body #kyoudosekkei .flow-goal-sub { font-size: 16px; font-weight: 700; color: #33475B; }
.lp-body #kyoudosekkei .flow-goal .o { color: #E8552A; }
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .flow-sec {
    box-sizing: border-box;
    padding: 30px 16px 44px;
  }
  .lp-body #kyoudosekkei .flow-h2 { font-size: 22px; }
  .lp-body #kyoudosekkei .flow-steps { flex-direction: column; }
  .lp-body #kyoudosekkei .flow-step {
    flex: 0 0 auto;
    padding: 18px 14px;
  }
  .lp-body #kyoudosekkei .flow-step-desc {
    width: min(88%, 300px);
    max-width: 300px;
  }
  .lp-body #kyoudosekkei .flow-arrow { width: 100%; height: 30px; }
  .lp-body #kyoudosekkei .flow-arrow::after { transform: translate(-50%, -60%) rotate(135deg); }
  .lp-body #kyoudosekkei .flow-goal { flex-direction: column; text-align: center; }
  .lp-body #kyoudosekkei .flow-goal p { font-size: 18px; }
}

/* ---- LP微調整（2026-07-26 その10）「強度設計は、設計判断を支える土台」（旧・でも、なぜ〜／薄緑バンド） ---- */
.lp-body #kyoudosekkei .need-sec { position: relative; padding: 44px 0 56px; }
.lp-body #kyoudosekkei .need-sec::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(50% - 50vw); width: 100vw; background: #EAF5F1; z-index: 0; }
.lp-body #kyoudosekkei .need-sec > * { position: relative; z-index: 1; }
.lp-body #kyoudosekkei .need-top { display: flex; gap: 40px; align-items: flex-start; margin-bottom: 36px; }
.lp-body #kyoudosekkei .need-lead { flex: 1 1 0; }
.lp-body #kyoudosekkei .need-h2 { color: #123F6D; font-size: 28px; font-weight: 800; text-align: left; background: none; width: auto; margin: 0 0 20px; padding: 2px 0 2px 16px; border-left: 5px solid #0C6E64; line-height: 1.4; }
.lp-body #kyoudosekkei .need-p { font-size: 16px; font-weight: 700; color: #33475B; line-height: 1.9; margin: 0 0 16px; }
.lp-body #kyoudosekkei .need-pyramid { flex: 0 0 44%; }
/* 2026-08-02 CSS監査: 画像プレースホルダ .need-ph を削除（現在は .need-pyramid-img を使用）。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
.lp-body #kyoudosekkei .need-cards { display: flex; gap: 22px; margin-bottom: 26px; }
.lp-body #kyoudosekkei .need-card { flex: 1 1 0; background: #fff; border: 1px solid #D7E3DF; border-radius: 12px; padding: 24px 22px; }
.lp-body #kyoudosekkei .need-card-ttl { font-size: 19px; font-weight: 800; color: #0C6E64; margin: 0 0 8px; }
.lp-body #kyoudosekkei .need-card-desc { font-size: 15px; font-weight: 700; color: #4A5568; line-height: 1.6; margin: 0; }
.lp-body #kyoudosekkei .need-concl { background: #FCEEE1; border-radius: 12px; padding: 24px; text-align: center; font-size: 24px; font-weight: 800; color: #E8552A; }
.lp-body #kyoudosekkei .need-sec .o { color: #E8552A; }
/* セクション見出し「でも、なぜ強度設計が必要なの？」（中央＋緑線） */
.lp-body #kyoudosekkei .need-title { background: none; width: auto; color: #0C6E64; font-size: 32px; font-weight: 800; text-align: center; margin: 0 0 64px; padding: 0; line-height: 1.4; }
.lp-body #kyoudosekkei .need-title::before { content: ""; display: block; width: 52px; height: 4px; background: #0C6E64; margin: 0 auto 22px; }
/* ピラミッド画像 */
.lp-body #kyoudosekkei .need-pyramid-img { display: block; width: 100%; height: auto; }
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .need-sec {
    box-sizing: border-box;
    padding: 34px 16px 40px;
  }
  .lp-body #kyoudosekkei .need-title { margin-bottom: 26px; font-size: 22px; }
  .lp-body #kyoudosekkei .need-title::before { margin-bottom: 16px; }
  .lp-body #kyoudosekkei .need-top { flex-direction: column; gap: 18px; margin-bottom: 24px; }
  .lp-body #kyoudosekkei .need-h2 { margin-bottom: 14px; font-size: 21px; }
  .lp-body #kyoudosekkei .need-p { margin-bottom: 12px; font-size: 15px; line-height: 1.75; }
  .lp-body #kyoudosekkei .need-pyramid { flex: none; width: min(100%, 340px); margin: 0 auto; }
  .lp-body #kyoudosekkei .need-cards { flex-direction: column; gap: 12px; margin-bottom: 20px; }
  .lp-body #kyoudosekkei .need-card { padding: 18px 16px; }
  .lp-body #kyoudosekkei .need-card-ttl { font-size: 17px; }
  .lp-body #kyoudosekkei .need-card-desc { font-size: 14px; }
  .lp-body #kyoudosekkei .need-concl { padding: 18px 16px; font-size: 17px; }
}

/* ---- LP微調整（2026-07-26 その11）「機械設計者に必要な知識を〜」＝説明＋Before/After ---- */
.lp-body #kyoudosekkei .kaiketsu-lead { text-align: center; font-size: 17px; font-weight: 700; color: #33475B; line-height: 1.9; margin: 0 auto 30px; max-width: 900px; }
/* 「機械設計者に必要な知識を〜」見出しは帯なしの白背景（緑線＋ティール文字） */
.lp-body #kyoudosekkei .kaiketsu > h2:first-of-type { background: none; width: auto; margin-left: auto; margin-right: auto; }
.lp-body #kyoudosekkei .ba-wrap { display: flex; align-items: stretch; justify-content: center; gap: 30px; margin: 0 auto 26px; max-width: 960px; }
.lp-body #kyoudosekkei .ba-card { flex: 1 1 0; border-radius: 14px; padding: 34px 24px 26px; position: relative; display: flex; align-items: center; gap: 16px; }
.lp-body #kyoudosekkei .ba-card--before { background: #F1F4F6; }
.lp-body #kyoudosekkei .ba-card--after { background: #EAF3F1; }
.lp-body #kyoudosekkei .ba-badge { position: absolute; top: -15px; left: 50%; transform: translateX(-50%); font-size: 15px; font-weight: 700; color: #fff; padding: 5px 22px; border-radius: 16px; white-space: nowrap; }
.lp-body #kyoudosekkei .ba-badge--gray { background: #8794A5; }
.lp-body #kyoudosekkei .ba-badge--teal { background: #0E8074; }
.lp-body #kyoudosekkei .ba-man { flex: 0 0 38%; width: 38%; height: auto; align-self: flex-end; }
.lp-body #kyoudosekkei .ba-card--after .ba-man { flex: 0 0 33.2%; width: 33.2%; }
.lp-body #kyoudosekkei .ba-list { list-style: none; margin: 0; padding: 0; flex: 1 1 0; }
.lp-body #kyoudosekkei .ba-list li { position: relative; padding: 0 0 0 30px; margin: 0 0 18px; font-size: 15px; font-weight: 700; line-height: 1.5; color: #2D344B; }
.lp-body #kyoudosekkei .ba-list li:last-child { margin-bottom: 0; }
.lp-body #kyoudosekkei .ba-list--x li::before { content: "×"; position: absolute; left: 0; top: -2px; width: 20px; height: 20px; line-height: 20px; text-align: center; color: #8794A5; font-weight: 700; font-size: 18px; }
.lp-body #kyoudosekkei .ba-list--check li::before { content: ""; position: absolute; left: 2px; top: 2px; width: 7px; height: 12px; border-right: 3px solid #0E8074; border-bottom: 3px solid #0E8074; transform: rotate(45deg); }
/* 2026-08-02 CSS監査: 旧Before/After矢印（.ba-arrow ＋ ::before / ::after、SP時の回転指定を含む）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
.lp-body #kyoudosekkei .ba-concl { text-align: center; font-size: 26px; font-weight: 800; color: #0C6E64; margin-bottom: 56px; }
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .kaiketsu-lead {
    box-sizing: border-box;
    padding-right: 16px;
    padding-left: 16px;
  }
  .lp-body #kyoudosekkei .ba-wrap {
    flex-direction: column;
    gap: 30px;
    margin-right: 16px;
    margin-left: 16px;
  }
  .lp-body #kyoudosekkei .ba-concl { font-size: 18px; }
}

/* ---- LP微調整（2026-07-26 その12）「でも、こんな不安はありませんか？」（吹き出し／クリーム背景） ---- */
.lp-body #kyoudosekkei .fuan-sec { position: relative; padding: 38px 0 44px; }
.lp-body #kyoudosekkei .fuan-sec::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(50% - 50vw); width: 100vw; background: #FBF3E8; z-index: 0; }
.lp-body #kyoudosekkei .fuan-sec > * { position: relative; z-index: 1; }
/* .kaiketsu h2 の帯(#DEF0EC・全幅)より詳細度を上げて、cream背景に馴染ませる（帯を出さない） */
.lp-body #kyoudosekkei .fuan-sec .fuan-h2 { background: none; width: auto; margin-left: auto; margin-right: auto; color: #0C6E64; font-size: 30px; font-weight: 800; text-align: center; margin-top: 0; margin-bottom: 56px; padding: 0; line-height: 1.4; }
.lp-body #kyoudosekkei .fuan-sec .fuan-h2::before { content: ""; display: block; width: 52px; height: 4px; background: #0C6E64; margin: 0 auto 20px; }
.lp-body #kyoudosekkei .fuan-bubble { position: relative; display: flex; align-items: center; gap: 24px; background: #fff; border-radius: 20px; padding: 32px 40px; max-width: 900px; margin: 0 auto; box-shadow: 0 4px 16px rgba(20, 60, 90, .08); }
.lp-body #kyoudosekkei .fuan-bubble::after { content: ""; position: absolute; left: 50%; bottom: -16px; transform: translateX(-50%); border-left: 18px solid transparent; border-right: 18px solid transparent; border-top: 18px solid #fff; }
.lp-body #kyoudosekkei .fuan-person { flex: 0 0 auto; }
.lp-body #kyoudosekkei .fuan-person img { display: block; width: 110px; height: auto; }
/* 2026-08-02 CSS監査: 画像プレースホルダ .fuan-ph を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
.lp-body #kyoudosekkei .fuan-body { flex: 1 1 0; }
.lp-body #kyoudosekkei .fuan-badge { display: inline-block; background: #0E8074; color: #fff; font-size: 14px; font-weight: 700; padding: 5px 18px; border-radius: 6px; margin: 0 0 16px; }
.lp-body #kyoudosekkei .fuan-text { font-size: 21px; font-weight: 800; color: #2D344B; line-height: 1.7; margin: 0; }
.lp-body #kyoudosekkei .fuan-sec .o { color: #E8552A; }
.lp-body #kyoudosekkei .fuan-note { text-align: center; font-size: 15px; font-weight: 700; color: #33475B; margin: 32px 0 0; }
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .fuan-sec {
    box-sizing: border-box;
    padding: 32px 16px 38px;
  }
  .lp-body #kyoudosekkei .fuan-h2 { margin-bottom: 20px; font-size: 22px; }
  .lp-body #kyoudosekkei .fuan-h2::before { margin-bottom: 16px; }
  .lp-body #kyoudosekkei .fuan-bubble { flex-direction: column; gap: 14px; padding: 20px 18px 22px; }
  .lp-body #kyoudosekkei .fuan-person { flex: none; width: auto; }
  .lp-body #kyoudosekkei .fuan-person img { width: 86px; }
  .lp-body #kyoudosekkei .fuan-badge { margin-bottom: 10px; }
  .lp-body #kyoudosekkei .fuan-text { font-size: 16px; line-height: 1.7; }
  .lp-body #kyoudosekkei .fuan-note { margin-top: 26px; font-size: 14px; }
}

/* ---- LP微調整（2026-07-26 その13）「専門書で学習が進まないのには、理由があります」3カード（白バンド） ---- */
.lp-body #kyoudosekkei .zasetsu-sec { position: relative; padding: 38px 0 50px; }
.lp-body #kyoudosekkei .zasetsu-sec::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(50% - 50vw); width: 100vw; background: #EAF5F1; z-index: 0; }
.lp-body #kyoudosekkei .zasetsu-sec > * { position: relative; z-index: 1; }
/* .kaiketsu h2 の帯(#DEF0EC・全幅)より詳細度を上げて、緑背景に馴染ませる（見出しの帯を出さない） */
.lp-body #kyoudosekkei .zasetsu-sec .zasetsu-h2 { background: none; width: auto; margin-left: auto; margin-right: auto; color: #0C6E64; font-size: 30px; font-weight: 800; text-align: center; margin-top: 0; margin-bottom: 6px; padding: 0; line-height: 1.4; }
.lp-body #kyoudosekkei .zasetsu-sec .zasetsu-h2::before { content: ""; display: block; width: 52px; height: 4px; background: #0C6E64; margin: 0 auto 20px; }
.lp-body #kyoudosekkei .zasetsu-lead { text-align: center; color: #33475B; font-size: 16px; font-weight: 700; margin: 0 0 64px; }
.lp-body #kyoudosekkei .zasetsu-cards { display: flex; gap: 24px; margin: 0 auto 30px; max-width: 960px; }
.lp-body #kyoudosekkei .zasetsu-card { flex: 1 1 0; background: #fff; border: 1px solid #E3EAEE; border-radius: 14px; padding: 34px 22px 24px; position: relative; text-align: center; box-shadow: 0 2px 10px rgba(20, 60, 90, .06); }
.lp-body #kyoudosekkei .zasetsu-num { position: absolute; top: -20px; left: 50%; transform: translateX(-50%); width: 40px; height: 40px; border-radius: 50%; background: #fff; border: 2px solid #F08300; color: #F08300; font-size: 18px; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.lp-body #kyoudosekkei .zasetsu-ph { width: 100%; height: 150px; display: flex; align-items: center; justify-content: center; color: #9aa7b3; font-size: 13px; background: #fff; border-radius: 8px; margin: 6px 0 16px; overflow: hidden; }
.lp-body #kyoudosekkei .zasetsu-ph img { width: 100%; height: 100%; object-fit: contain; }
.lp-body #kyoudosekkei .zasetsu-card-ttl { font-size: 19px; font-weight: 800; color: #0C6E64; margin: 0 0 10px; }
.lp-body #kyoudosekkei .zasetsu-card-desc { font-size: 14px; font-weight: 700; color: #4A5568; line-height: 1.7; margin: 0; text-align: left; }
/* 2026-08-02 CSS監査: .zs-sp（改行制御用スパン）の指定を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
.lp-body #kyoudosekkei .zasetsu-concl { max-width: 960px; margin: 0 auto; background: #F6FAF9; border-left: 5px solid #0C6E64; border-radius: 8px; padding: 24px 30px; text-align: center; font-size: 19px; font-weight: 800; color: #2D344B; line-height: 1.7; }
.lp-body #kyoudosekkei .zasetsu-sec .o { color: #E8552A; }
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .zasetsu-sec {
    box-sizing: border-box;
    padding: 34px 16px 40px;
  }
  .lp-body #kyoudosekkei .zasetsu-h2 { font-size: 21px; }
  .lp-body #kyoudosekkei .zasetsu-lead { margin-bottom: 28px; text-align: center; line-height: 1.7; }
  .lp-body #kyoudosekkei .zasetsu-cards { flex-direction: column; gap: 26px; margin-bottom: 24px; }
  .lp-body #kyoudosekkei .zasetsu-card { padding: 30px 16px 20px; }
  .lp-body #kyoudosekkei .zasetsu-ph { height: 118px; margin: 2px 0 12px; }
  .lp-body #kyoudosekkei .zasetsu-card-ttl { font-size: 18px; }
  .lp-body #kyoudosekkei .zasetsu-card-desc { font-size: 14px; line-height: 1.65; }
  .lp-body #kyoudosekkei .zasetsu-card-desc br { display: none; }
  .lp-body #kyoudosekkei .zasetsu-concl { font-size: 16px; text-align: left; }
}

/* ---- LP微調整（2026-07-26 その14）「だから本講座は、設計で使う場面から学びます」3STEP（白バンド） ---- */
.lp-body #kyoudosekkei .manabi-sec { position: relative; padding: 38px 0 50px; }
.lp-body #kyoudosekkei .manabi-sec::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(50% - 50vw); width: 100vw; background: #fff; z-index: 0; }
.lp-body #kyoudosekkei .manabi-sec > * { position: relative; z-index: 1; }
.lp-body #kyoudosekkei .manabi-sec .manabi-h2 { background: none; width: auto; margin-left: auto; margin-right: auto; color: #0C6E64; font-size: 30px; font-weight: 800; text-align: center; margin-top: 0; margin-bottom: 6px; padding: 0; line-height: 1.4; }
.lp-body #kyoudosekkei .manabi-sec .manabi-h2::before { content: ""; display: block; width: 52px; height: 4px; background: #0C6E64; margin: 0 auto 20px; }
.lp-body #kyoudosekkei .manabi-lead { text-align: center; color: #33475B; font-size: 16px; font-weight: 700; margin: 0 0 44px; }
.lp-body #kyoudosekkei .manabi-steps { display: flex; align-items: stretch; justify-content: center; gap: 0; max-width: 960px; margin: 0 auto 28px; }
.lp-body #kyoudosekkei .manabi-step { flex: 1 1 0; background: #fff; border: 1px solid #E3EAEE; border-radius: 14px; padding: 18px 18px 22px; text-align: center; box-shadow: 0 2px 10px rgba(20, 60, 90, .06); display: flex; flex-direction: column; }
.lp-body #kyoudosekkei .manabi-badge { display: inline-block; align-self: center; background: #5B6B7D; color: #fff; font-size: 14px; font-weight: 700; padding: 5px 20px; border-radius: 16px; margin: 0 0 12px; }
.lp-body #kyoudosekkei .manabi-step-ttl { font-size: 19px; font-weight: 800; color: #0C6E64; margin: 0 0 12px; }
.lp-body #kyoudosekkei .manabi-ph { width: 100%; height: 150px; display: flex; align-items: center; justify-content: center; color: #9aa7b3; font-size: 13px; background: #fff; border-radius: 6px; margin: 0 0 14px; overflow: hidden; }
.lp-body #kyoudosekkei .manabi-ph img { width: 100%; height: 100%; object-fit: contain; }
.lp-body #kyoudosekkei .manabi-step-desc { font-size: 14px; font-weight: 700; color: #4A5568; line-height: 1.6; margin: 0; }
.lp-body #kyoudosekkei .manabi-arrow { flex: 0 0 44px; align-self: center; position: relative; }
.lp-body #kyoudosekkei .manabi-arrow::after { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-left: 16px solid #F08300; border-top: 11px solid transparent; border-bottom: 11px solid transparent; }
.lp-body #kyoudosekkei .manabi-concl { max-width: 960px; margin: 0 auto; background: #F3F8FB; border-radius: 10px; padding: 22px 26px; text-align: center; font-size: 19px; font-weight: 800; color: #E8552A; line-height: 1.6; }
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .manabi-sec {
    box-sizing: border-box;
    padding-right: 16px;
    padding-left: 16px;
  }
  .lp-body #kyoudosekkei .manabi-sec .manabi-h2 { font-size: 21px; }
  .lp-body #kyoudosekkei .manabi-steps { flex-direction: column; }
  .lp-body #kyoudosekkei .manabi-arrow { flex: none; height: 30px; }
  .lp-body #kyoudosekkei .manabi-arrow::after { transform: translate(-50%, -50%) rotate(90deg); }
  .lp-body #kyoudosekkei .manabi-concl { font-size: 16px; }
}

/* ---- スマホ共通：主要セクション見出しを2行以内で読みやすく統一 ---- */
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei h2 {
    word-break: normal;
    overflow-wrap: break-word;
    line-break: strict;
    text-wrap: balance;
  }

  .lp-body #kyoudosekkei .nayami-sec .nayami-h2,
  .lp-body #kyoudosekkei .hikaku-sec .hikaku-h2,
  .lp-body #kyoudosekkei .flow-sec .flow-h2,
  .lp-body #kyoudosekkei .need-sec .need-title,
  .lp-body #kyoudosekkei .kaiketsu > h2:first-of-type,
  .lp-body #kyoudosekkei .fuan-sec .fuan-h2,
  .lp-body #kyoudosekkei .zasetsu-sec .zasetsu-h2,
  .lp-body #kyoudosekkei .manabi-sec .manabi-h2 {
    width: auto;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
    font-size: clamp(20px, 5.6vw, 22px);
    line-height: 1.45;
    letter-spacing: .01em;
    text-align: center;
  }

  .lp-body #kyoudosekkei .nayami-lead,
  .lp-body #kyoudosekkei .hikaku-lead,
  .lp-body #kyoudosekkei .flow-lead,
  .lp-body #kyoudosekkei .kaiketsu-lead,
  .lp-body #kyoudosekkei .zasetsu-lead,
  .lp-body #kyoudosekkei .manabi-lead {
    font-size: 15px;
    line-height: 1.7;
    text-wrap: balance;
  }

  .lp-body #kyoudosekkei .nayami-lead {
    margin-bottom: 28px;
  }

  .lp-body #kyoudosekkei .hikaku-lead,
  .lp-body #kyoudosekkei .flow-lead {
    margin-bottom: 30px;
  }

  .lp-body #kyoudosekkei .manabi-lead {
    margin-bottom: 32px;
  }
}

/* ============================================================
   study-sec「あなたのペースで、無理なく学習できます」2026-07-27
   セクション固有クラス .study-sec でCSSを限定（他セクション不干渉）
   ============================================================ */
.lp-body #kyoudosekkei .study-sec {
  width: 100vw;
  max-width: none;
  margin: 0 calc(50% - 50vw);
  padding: 60px max(20px, calc((100vw - 960px) / 2));
  box-sizing: border-box;
  background: #f1f8f6;
}
.lp-body #kyoudosekkei .study-sec > * { max-width: 960px; margin-left: auto; margin-right: auto; }
/* 見出し（既存 section-title の緑ライン・中央を流用、サイズと余白のみ調整） */
.lp-body #kyoudosekkei .study-sec .section-title { width: auto; background: none; font-size: 33px; margin: 0 0 12px; padding-top: 0; }
.lp-body #kyoudosekkei .study-sec .ss-lead { text-align: center; font-size: 16px; color: #4A5568; line-height: 1.7; margin: 0 0 44px; }
/* 3つの特徴（カード枠なし・アイコン左／見出しと説明文を右） */
.lp-body #kyoudosekkei .study-sec .ss-cards {
  display: flex;
  gap: 0;
  margin: 0 auto 28px;
  padding: 0;
  list-style: none;
}
.lp-body #kyoudosekkei .study-sec .ss-card {
  flex: 1 1 0;
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 96px;
  padding: 12px 20px;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.lp-body #kyoudosekkei .study-sec .ss-card:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 12px;
  right: 0;
  bottom: 12px;
  width: 1px;
  background: rgba(0, 127, 120, .14);
}
.lp-body #kyoudosekkei .study-sec .ss-ico {
  position: relative;
  display: inline-block;
  flex: 0 0 auto;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #E1F3EF;
}
/* アイコン本体：SVGをマスクにして #008C84 で塗る（薄緑円の中央に配置）。カードごとにマスク画像を指定 */
.lp-body #kyoudosekkei .study-sec .ss-ico::before { content: ""; position: absolute; top: 11px; left: 11px; right: 11px; bottom: 11px; background-color: #008C84; -webkit-mask: center / contain no-repeat; mask: center / contain no-repeat; }
.lp-body #kyoudosekkei .study-sec .ss-card:nth-child(1) .ss-ico::before { -webkit-mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_time.svg); mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_time.svg); }
.lp-body #kyoudosekkei .study-sec .ss-card:nth-child(2) .ss-ico::before { -webkit-mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_player.svg); mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_player.svg); }
.lp-body #kyoudosekkei .study-sec .ss-card:nth-child(3) .ss-ico::before { -webkit-mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_replay.svg); mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_replay.svg); }
.lp-body #kyoudosekkei .study-sec .ss-body { flex: 1 1 auto; min-width: 0; }
.lp-body #kyoudosekkei .study-sec .ss-card-ttl {
  margin: 0 0 5px;
  color: #007F78;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.45;
  white-space: nowrap;
}
.lp-body #kyoudosekkei .study-sec .ss-card-desc {
  margin: 0;
  color: #53667E;
  font-size: 15px;
  line-height: 1.75;
  word-break: normal;
  overflow-wrap: break-word;
  line-break: strict;
}
/* スライダー見出し（小＝オレンジ左右線／メイン＝濃紺） */
.lp-body #kyoudosekkei .study-sec .ss-slider-head { text-align: center; margin: 34px auto 20px; }
.lp-body #kyoudosekkei .study-sec .ss-sub { display: inline-flex; align-items: center; gap: 10px; color: #E96512; font-size: 14px; font-weight: 700; }
.lp-body #kyoudosekkei .study-sec .ss-sub::before,
.lp-body #kyoudosekkei .study-sec .ss-sub::after { content: ""; display: inline-block; width: 24px; height: 2px; background: #E96512; }
.lp-body #kyoudosekkei .study-sec .ss-main { font-size: 25px; font-weight: 800; color: #122D4F; margin: 6px 0 0; }
/* 既存スライダー：内部の見出し・矢印は隠して自前見出しに置換 */
.lp-body #kyoudosekkei .study-sec .dailystudies > h2,
.lp-body #kyoudosekkei .study-sec .dailystudies > p.arrow { display: none; }
.lp-body #kyoudosekkei .study-sec .dailystudies { width: 100%; max-width: 860px; margin: 0 auto; }
/* 背景は #E7ECEF（2026-08-01変更・旧#fff）。
   スライド内の画像枠(.box_ds .img)は白のまま。 */
.lp-body #kyoudosekkei .study-sec .dailystudies .slider { position: relative; background: #E7ECEF; border-radius: 14px; padding: 22px 0; }
/* 旧・黄色背景を打ち消して白地に。1枚表示とし、前後のスライドは見せない */
.lp-body #kyoudosekkei .study-sec .dailystudies .slick-slide,
.lp-body #kyoudosekkei .study-sec .dailystudies .box_ds { background: transparent; }
.lp-body #kyoudosekkei .study-sec .dailystudies .box_ds { position: relative; display: flex; flex-direction: column; align-items: stretch; padding: 0 8px; box-sizing: border-box; }
.lp-body #kyoudosekkei .study-sec .dailystudies .slick-slide { opacity: 0; transition: opacity .3s; }
.lp-body #kyoudosekkei .study-sec .dailystudies .slick-slide.slick-active,
.lp-body #kyoudosekkei .study-sec .dailystudies .slick-center { opacity: 1; }
.lp-body #kyoudosekkei .study-sec .box_ds .num { display: none; }
/* スライド内タイトル：画像に重ねず画像の上へ独立配置（全スライド同一位置・全スライド表示） */
.lp-body #kyoudosekkei .study-sec .box_ds .title { order: 1; align-self: center; position: static; transform: none; z-index: auto; display: inline-block; background: #006B66; color: #fff; font-size: 14px; font-weight: 700; line-height: 1.4; text-align: center; padding: 5px 16px; border-radius: 999px; margin: 0 0 12px; }
.lp-body #kyoudosekkei .study-sec .slick-slide:not(.slick-center) .box_ds .title { opacity: 1; }
/* 画像：ミント地の中で白ボックス＋薄い青緑枠 */
.lp-body #kyoudosekkei .study-sec .box_ds .img { order: 2; align-self: center; width: 68%; margin: 0; border-radius: 10px; overflow: hidden; background: #fff; border: 1px solid #D9EDE8; }
.lp-body #kyoudosekkei .study-sec .slick-center .box_ds .img { box-shadow: 0 6px 18px rgba(0, 0, 0, .12); }
.lp-body #kyoudosekkei .study-sec .box_ds .img img { width: 100%; height: auto; display: block; object-fit: contain; }
/* 画像下の説明文：改行を整え、数字＋助数詞（例「50問」）の分割を防止 */
.lp-body #kyoudosekkei .study-sec .box_ds .txt { order: 3; display: block; width: 100%; max-width: 100%; box-sizing: border-box; margin: 12px 0 0; text-align: center; font-size: 14px; line-height: 1.75; color: #4A5568; word-break: keep-all; }
.lp-body #kyoudosekkei .study-sec .box_ds .txt .emp { font-weight: 700; color: #122D4F; }
.lp-body #kyoudosekkei .study-sec .box_ds .txt .small { display: inline-block; font-size: 12.5px; color: #708090; }
/* 旧2カラム名残の p.txt.txtNN-NN{width:45%・text-align:left等} を打ち消し全幅・中央揃え（style_kyodoは非改変・詳細度で上書き） */
.lp-body #kyoudosekkei .study-sec .dailystudies .slider p.txt { width: 100%; max-width: 100%; float: none; text-align: center; margin: 12px 0 0; }

/* 演習・最終理解度テスト：画像下の箇条書きを中央配置＋左揃え */
.lp-body #kyoudosekkei .study-sec .dailystudies .slider .txt.ss-point-copy {
  width: fit-content;
  max-width: calc(100% - 32px);
  margin: 12px auto 0;
  text-align: left;
}

.lp-body #kyoudosekkei .study-sec .ss-point-list {
  width: fit-content;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

.lp-body #kyoudosekkei .study-sec .ss-point-list li {
  position: relative;
  margin: 0;
  padding-left: 1em;
  color: #4a5568;
  font-size: 14px;
  line-height: 1.75;
  text-align: left;
  word-break: normal;
  overflow-wrap: break-word;
}

.lp-body #kyoudosekkei .study-sec .ss-point-list li::before {
  content: "・";
  position: absolute;
  top: 0;
  left: 0;
  color: #4a5568;
}

.lp-body #kyoudosekkei .study-sec .txt.ss-point-copy .small {
  display: block;
  margin: 3px 0 0;
  padding: 0;
  color: #708090;
  font-size: 12.5px;
  line-height: 1.6;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .study-sec .ss-point-list li {
    font-size: 13px;
  }

  .lp-body #kyoudosekkei .study-sec .txt.ss-point-copy .small {
    font-size: 11.5px;
  }
}
/* 矢印（白丸＋太い青緑リング＋青緑の三角＝再生ボタン風。円の線は太め8px） */
/* サイズ・display・paddingは旧 style_kyodo/lp_editor の .slick-arrow/.slick-prev{width:90px;display:block等} を詳細度で上書き */
.lp-body #kyoudosekkei .study-sec .dailystudies .slider .ss-arrow { width: 60px; height: 60px; display: flex !important; padding: 0; } /* !important: slickがインラインでdisplay:blockを書くため */
.lp-body #kyoudosekkei .study-sec .ss-arrow { position: absolute; top: 42%; transform: translateY(-50%); z-index: 5; display: flex; align-items: center; justify-content: center; box-sizing: border-box; border-radius: 50%; background: #fff; border: 8px solid #008C84; color: transparent; font-size: 0; line-height: 0; cursor: pointer; box-shadow: 0 3px 8px rgba(0, 107, 102, .20); transition: background .2s, border-color .2s; }
.lp-body #kyoudosekkei .study-sec .ss-arrow:hover { background: #EAF7F5; border-color: #006B66; }
.lp-body #kyoudosekkei .study-sec .ss-arrow::before { content: ""; display: block; width: 0; height: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; }
.lp-body #kyoudosekkei .study-sec .ss-arrow:hover::before { border-right-color: #006B66; border-left-color: #006B66; }
.lp-body #kyoudosekkei .study-sec .ss-prev { left: 60px; }
.lp-body #kyoudosekkei .study-sec .ss-prev::before { border-right: 15px solid #008C84; margin-right: 4px; }
.lp-body #kyoudosekkei .study-sec .ss-next { right: 60px; }
.lp-body #kyoudosekkei .study-sec .ss-next::before { border-left: 15px solid #008C84; margin-left: 4px; }
/* ループ無効（infinite:false）：先頭で左矢印・末尾で右矢印を非表示 */
.lp-body #kyoudosekkei .study-sec .ss-arrow.slick-disabled { display: none; }
/* ドット（選択中は横長緑） */
.lp-body #kyoudosekkei .study-sec .dailystudies .slick-dots { position: static; display: flex; justify-content: center; gap: 8px; margin: 16px 0 0; padding: 0; }
.lp-body #kyoudosekkei .study-sec .dailystudies .slick-dots li { width: auto; height: auto; margin: 0; }
.lp-body #kyoudosekkei .study-sec .dailystudies .slick-dots li button { width: 8px; height: 8px; padding: 0; border-radius: 50%; background: #C7D2CE; }
.lp-body #kyoudosekkei .study-sec .dailystudies .slick-dots li button::before { display: none; }
.lp-body #kyoudosekkei .study-sec .dailystudies .slick-dots li.slick-active button { width: 22px; border-radius: 999px; background: #008C84; }
/* スライダー下 説明 */
.lp-body #kyoudosekkei .study-sec .ss-slider-desc { text-align: center; font-size: 14px; color: #4A5568; line-height: 1.7; margin: 18px auto 0; }
.lp-body #kyoudosekkei .study-sec .ss-slider-desc b { color: #008C84; }
/* スマホ（767px以下） */
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei .study-sec { padding: 40px 16px; }
  .lp-body #kyoudosekkei .study-sec .section-title { font-size: 25px; }
  .lp-body #kyoudosekkei .study-sec .ss-lead { margin-bottom: 30px; font-size: 14px; }
  .lp-body #kyoudosekkei .study-sec .ss-cards { flex-direction: column; gap: 0; }
  .lp-body #kyoudosekkei .study-sec .ss-card {
    flex: 0 0 auto;
    min-height: 0;
    gap: 14px;
    padding: 18px 10px;
  }
  .lp-body #kyoudosekkei .study-sec .ss-card:not(:last-child)::after {
    top: auto;
    right: 10px;
    bottom: 0;
    left: 10px;
    width: auto;
    height: 1px;
  }
  .lp-body #kyoudosekkei .study-sec .ss-ico {
    width: 52px;
    height: 52px;
  }
  .lp-body #kyoudosekkei .study-sec .ss-ico::before {
    top: 11px;
    right: 11px;
    bottom: 11px;
    left: 11px;
  }
  .lp-body #kyoudosekkei .study-sec .ss-card-ttl {
    white-space: normal;
  }
  .lp-body #kyoudosekkei .study-sec .ss-main { font-size: 22px; }
  .lp-body #kyoudosekkei .study-sec .dailystudies .slider { padding: 16px 0; }
  .lp-body #kyoudosekkei .study-sec .dailystudies .box_ds { padding: 0 4px; }
  .lp-body #kyoudosekkei .study-sec .box_ds .title { font-size: 12px; padding: 4px 12px; margin-bottom: 9px; }
  .lp-body #kyoudosekkei .study-sec .box_ds .txt { font-size: 13px; }
  .lp-body #kyoudosekkei .study-sec .box_ds .img { width: 100%; }
  .lp-body #kyoudosekkei .study-sec .dailystudies .slider .ss-arrow { width: 50px; height: 50px; }
  .lp-body #kyoudosekkei .study-sec .ss-arrow { border-width: 6px; }
  .lp-body #kyoudosekkei .study-sec .ss-prev { left: 8px; } /* PC向け60pxをスマホでは端寄せにする */
  .lp-body #kyoudosekkei .study-sec .ss-next { right: 8px; }
  .lp-body #kyoudosekkei .study-sec .ss-prev::before,
  .lp-body #kyoudosekkei .study-sec .ss-next::before { border-top-width: 8px; border-bottom-width: 8px; }
  .lp-body #kyoudosekkei .study-sec .ss-prev::before { border-right-width: 12px; }
  .lp-body #kyoudosekkei .study-sec .ss-next::before { border-left-width: 12px; }
}

/*
 * 強度設計入門講座「料金・申込方法」セクション専用CSS
 * 作成日: 2026-07-27
 *
 * 適用条件:
 *   WordPress本文の料金セクションを
 *   <section id="price" class="price-v2"> ... </section>
 *   とし、内部要素へ pv2-* クラスを付ける。
 *
 * 安全性:
 *   #price.price-v2 以下だけを対象とするため、price-v2 クラスを
 *   付けるまでは現在の料金セクションへ影響しない。
 */

.lp-body #kyoudosekkei #price.price-v2 {
  --pv2-teal: #007d73;
  --pv2-teal-dark: #00655d;
  --pv2-teal-soft: #e9f6f3;
  --pv2-teal-pale: #f3faf8;
  --pv2-navy: #17324d;
  --pv2-text: #405266;
  --pv2-muted: #718096;
  --pv2-line: #d7e9e5;
  --pv2-orange: #ef6c19;
  --pv2-orange-soft: #fff7ed;
  --pv2-red: #df2f2f;
  --pv2-red-dark: #c92323;
  --pv2-white: #fff;
  position: relative;
  width: 100vw;
  max-width: none;
  margin: 0 calc(50% - 50vw);
  padding: 64px max(20px, calc((100vw - 960px) / 2)) 58px;
  box-sizing: border-box;
  background: var(--pv2-white);
  color: var(--pv2-text);
}

.lp-body #kyoudosekkei #price.price-v2,
.lp-body #kyoudosekkei #price.price-v2 *,
.lp-body #kyoudosekkei #price.price-v2 *::before,
.lp-body #kyoudosekkei #price.price-v2 *::after {
  box-sizing: border-box;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-title {
  width: auto;
  margin: 0 auto 8px;
  padding: 0;
  background: none;
  color: var(--pv2-teal);
  font-size: 32px;
  font-weight: 800;
  line-height: 1.4;
  text-align: center;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-title::before {
  content: "";
  display: block;
  width: 52px;
  height: 4px;
  margin: 0 auto 20px;
  border-radius: 999px;
  background: var(--pv2-teal);
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-lead {
  max-width: 760px;
  margin: 0 auto 44px;
  color: var(--pv2-text);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.75;
  text-align: center;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 24px;
  width: 100%;
  max-width: 960px;
  margin: 0 auto 24px;
  align-items: stretch;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--pv2-line);
  border-radius: 14px;
  background: var(--pv2-white);
  box-shadow: 0 4px 16px rgba(18, 75, 70, 0.07);
}

/* 講座内容カード */
.lp-body #kyoudosekkei #price.price-v2 .pv2-course {
  display: flex;
  flex-direction: column;
  padding: 28px 26px 24px;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-card-title {
  margin: 0 0 18px;
  color: var(--pv2-navy);
  font-size: 21px;
  font-weight: 800;
  line-height: 1.45;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-course-list {
  margin: 0;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-course-row {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 12px 0;
  border-bottom: 1px solid #e8efed;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-course-row:first-child {
  padding-top: 0;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-course-row:last-child {
  border-bottom: 0;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-course-row dt,
.lp-body #kyoudosekkei #price.price-v2 .pv2-course-row dd {
  margin: 0;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-course-row dt {
  color: var(--pv2-teal);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.65;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-course-row dd {
  color: var(--pv2-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.65;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-inline-link {
  color: var(--pv2-teal);
  font-weight: 800;
  text-decoration: none;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-inline-link:hover {
  text-decoration: underline;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: auto 0 0;
  padding-top: 20px;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-metric {
  min-width: 0;
  padding: 14px 8px 12px;
  border-radius: 9px;
  background: var(--pv2-teal-soft);
  text-align: center;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-metric strong {
  display: block;
  margin: 0 0 3px;
  color: var(--pv2-teal);
  font-size: 21px;
  font-weight: 800;
  line-height: 1.25;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-metric span {
  display: block;
  color: var(--pv2-muted);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.45;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-metric--time strong {
  font-size: 19px;
  letter-spacing: -0.02em;
  white-space: nowrap;
}

/* 料金・申込みカード */
.lp-body #kyoudosekkei #price.price-v2 .pv2-purchase {
  display: flex;
  flex-direction: column;
  background: #fffaf3;
  border-color: #f1dcc4;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-campaign {
  margin: 0;
  padding: 13px 18px;
  background: var(--pv2-orange);
  color: var(--pv2-white);
  font-size: 15px;
  font-weight: 800;
  line-height: 1.5;
  text-align: center;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-purchase-body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 20px 24px 22px;
  text-align: center;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-campaign-status {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 0 0 14px;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-campaign-period {
  margin: 0;
  color: var(--pv2-teal);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.55;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-campaign-remain {
  margin: 0;
  padding: 4px 12px;
  border-radius: 999px;
  background: #fff0c9;
  color: var(--pv2-orange);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.4;
  white-space: nowrap;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-regular-price {
  margin: 0 0 5px;
  color: #707070;
  font-size: 14px;
  line-height: 1.6;
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-sale-label {
  margin: 0 0 2px;
  color: var(--pv2-navy);
  font-size: 13px;
  font-weight: 800;
}
/* 260802 割引が無いときは「定価（税抜）」、割引中は「販売価格（税抜）」に出し分ける（アース指定）。
   申込ページのラベルと同じ考え方。文言はHTMLから外し、CSSの ::before で出している。
   割引中かどうかは、[check_discount] の中でだけ出力される .pv2-campaign-status
   （終了日・残り日数の表示）の有無で判定する。 */
.lp-body #kyoudosekkei #price.price-v2 .pv2-sale-label::before { content: "定価（税抜）"; }
.lp-body #kyoudosekkei #price.price-v2 .pv2-purchase-body:has(.pv2-campaign-status) .pv2-sale-label::before { content: "販売価格（税抜）"; }

.lp-body #kyoudosekkei #price.price-v2 .pv2-sale-price {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 2px;
  margin: 0 0 3px;
  color: var(--pv2-red);
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-sale-price strong {
  font-size: 48px;
  letter-spacing: -1px;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-sale-price span {
  font-size: 18px;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-tax {
  display: inline-flex;
  align-items: baseline;
  align-self: center;
  gap: 7px;
  margin: 3px auto 16px;
  padding: 5px 12px;
  border-radius: 7px;
  background: #fff0e5;
  color: var(--pv2-text);
  line-height: 1.4;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-tax span {
  font-size: 12px;
  font-weight: 700;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-tax strong {
  color: var(--pv2-red);
  font-size: 18px;
  font-weight: 800;
  white-space: nowrap;
}

/* 260802 金額だけ小さくなる不具合の修正。
   このLPの税込価格は <strong><span class="sale-in">54,780</span>円</strong> という構造で、
   金額はスクリプトが .sale-in に書き込む。上の「.pv2-tax span」（ラベル「税込価格」用の12px指定）が
   入れ子のこの span にも当たるため、金額だけ12pxになり「円」だけ18pxで表示されていた。
   strong の中の span は strong の指定（18px・赤・800）を継承させ、公差LPと同じ見た目に揃える。 */
.lp-body #kyoudosekkei #price.price-v2 .pv2-tax strong span {
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
}

/* 260802 税込価格の表記を他LP（即戦力・公差など）と統一。
   旧: 「税込価格」ラベル(12px/グレー) ＋ 金額(18px/赤) の2要素構成
   新: 「（税込◯◯円）」を1行・18px・赤・800 で表示（.price-txt_intax の中身は
       本文のスクリプトが丸ごと置換する。lp_sokusen.css 4984行と同じ指定） */
.lp-body #kyoudosekkei #price.price-v2 .pv2-tax.price-txt_intax {
  font-size: 18px;
  font-weight: 800;
  line-height: 1.4;
  color: var(--pv2-red);
}
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei #price.price-v2 .pv2-tax.price-txt_intax { font-size: 16px; }
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-primary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 54px;
  margin: 0 0 10px;
  padding: 12px 18px;
  border: 0;
  border-radius: 7px;
  background: var(--pv2-red);
  box-shadow: 0 3px 0 #ad1d1d;
  color: var(--pv2-white);
  font-size: 17px;
  font-weight: 800;
  line-height: 1.45;
  text-decoration: none;
  transition: background-color 0.2s, transform 0.2s;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-primary:hover {
  background: var(--pv2-red-dark);
  transform: translateY(1px);
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-payment-note {
  margin: auto 0 14px;
  padding-top: 14px;
  border-top: 1px solid #eadfce;
  color: var(--pv2-muted);
  font-size: 11px;
  line-height: 1.65;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-payment-note strong {
  color: var(--pv2-orange);
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-installment {
  padding: 15px 16px 14px;
  border-radius: 10px;
  background: var(--pv2-teal-soft);
  color: var(--pv2-teal);
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-installment-label {
  display: inline-block;
  margin: 0 0 3px;
  padding: 3px 12px;
  border-radius: 999px;
  background: var(--pv2-teal);
  color: var(--pv2-white);
  font-size: 11px;
  font-weight: 800;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-installment-price {
  margin: 0 0 2px;
  color: var(--pv2-teal);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.4;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-installment-price strong {
  font-size: 27px;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-installment-note {
  margin: 0;
  color: var(--pv2-muted);
  font-size: 10px;
  line-height: 1.55;
}

/* グループ割引 */
.lp-body #kyoudosekkei #price.price-v2 .pv2-group {
  width: 100%;
  max-width: 960px;
  margin: 0 auto 20px;
  padding: 20px 20px 14px;
  border: 1px solid var(--pv2-line);
  border-radius: 12px;
  background: #F3FAF8;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-subtitle {
  margin: 0 0 3px;
  color: var(--pv2-teal);
  font-size: 24px;
  font-weight: 800;
  line-height: 1.45;
  text-align: center;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-sublead {
  margin: 0 0 8px;
  color: var(--pv2-muted);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.65;
  text-align: center;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-group-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 0 0 14px;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-group-badges span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 4px 14px;
  border: 1px solid var(--pv2-teal);
  border-radius: 999px;
  background: var(--pv2-white);
  color: var(--pv2-teal);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.3;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-table-wrap {
  overflow: hidden;
  border: 1px solid #cfe4df;
  border-radius: 9px;
  background: var(--pv2-white);
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-table {
  width: 100%;
  max-width: none;
  margin: 0;
  border-collapse: collapse;
  table-layout: fixed;
  background: var(--pv2-white);
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-table th,
.lp-body #kyoudosekkei #price.price-v2 .pv2-table td {
  height: auto;
  padding: 9px 14px;
  border: 0;
  border-bottom: 1px solid #e7efed;
  color: var(--pv2-text);
  font-size: 14px;
  line-height: 1.55;
  text-align: center;
  vertical-align: middle;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-table th {
  background: var(--pv2-teal);
  color: var(--pv2-white);
  font-size: 13px;
  font-weight: 800;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-table tbody tr:last-child td {
  border-bottom: 0;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-table tbody tr:nth-child(even) {
  background: var(--pv2-teal-pale);
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-discount {
  color: var(--pv2-orange);
  font-weight: 800;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-quote-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(100%, 390px);
  min-height: 46px;
  padding: 10px 22px;
  border-radius: 8px;
  background: var(--pv2-orange);
  color: var(--pv2-white);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.4;
  text-decoration: none;
  transition: background-color 0.2s;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-quote-button:hover {
  background: #d75a0d;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-table-contact {
  color: var(--pv2-teal-dark);
  font-weight: 800;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-table-contact:hover,
.lp-body #kyoudosekkei #price.price-v2 .pv2-table-contact:focus {
  color: var(--pv2-orange);
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-quote-action {
  margin: 16px 0 0;
  text-align: center;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-quote-action p {
  margin: 7px 0 0;
  color: var(--pv2-muted);
  font-size: 10px;
  line-height: 1.55;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-group-notes {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px 14px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-group-notes li {
  margin: 0;
  color: var(--pv2-muted);
  font-size: 10px;
  line-height: 1.55;
}

/* ご購入前の確認事項 */
.lp-body #kyoudosekkei #price.price-v2 .pv2-notes {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 22px 22px 20px;
  border: 1px solid var(--pv2-line);
  border-radius: 14px;
  background: #f8fbfb;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-notes-title {
  margin: 0 0 16px;
  color: var(--pv2-navy);
  font-size: 20px;
  font-weight: 800;
  line-height: 1.45;
  text-align: center;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-note-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-note-card {
  position: relative;
  min-width: 0;
  min-height: 126px;
  margin: 0;
  padding: 18px 16px 16px 56px;
  border: 1px solid #e4efec;
  border-radius: 10px;
  background: var(--pv2-white);
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-note-card--warning {
  border-color: #f2c99f;
  background: var(--pv2-orange-soft);
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-note-icon {
  position: absolute;
  top: 18px;
  left: 16px;
  width: 28px;
  height: 28px;
  background-color: var(--pv2-teal);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-note-card--invoice .pv2-note-icon {
  -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_invoice.svg");
  mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_invoice.svg");
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-note-card--receipt .pv2-note-icon {
  -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_receipt.svg");
  mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_receipt.svg");
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-note-card--warning .pv2-note-icon {
  background-color: var(--pv2-orange);
  -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_note.svg");
  mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_note.svg");
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-note-heading {
  margin: 0 0 7px;
  color: var(--pv2-teal);
  font-size: 15px;
  font-weight: 800;
  line-height: 1.45;
  text-align: left;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-note-heading::before,
.lp-body #kyoudosekkei #price.price-v2 .pv2-note-heading::after {
  content: none;
  display: none;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-note-card--warning .pv2-note-heading {
  color: var(--pv2-orange);
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-note-text {
  margin: 0;
  color: var(--pv2-text);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.7;
  text-align: left;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-refund-link {
  display: inline-flex;
  align-items: center;
  margin-top: 7px;
  color: var(--pv2-teal);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.5;
  text-decoration: none;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-refund-link::after {
  content: " →";
  margin-left: 3px;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-refund-link:hover {
  text-decoration: underline;
}

/* キーボード操作時の視認性 */
.lp-body #kyoudosekkei #price.price-v2 a:focus-visible {
  outline: 3px solid rgba(0, 125, 115, 0.35);
  outline-offset: 3px;
}

/* 768〜959px: PC/タブレット境界の安全調整 */
@media screen and (max-width: 959px) {
  .lp-body #kyoudosekkei #price.price-v2 {
    padding-right: 24px;
    padding-left: 24px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-top {
    gap: 18px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-course,
  .lp-body #kyoudosekkei #price.price-v2 .pv2-purchase-body {
    padding-right: 20px;
    padding-left: 20px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-course-row {
    grid-template-columns: 92px minmax(0, 1fr);
  }
}

/*
 * スマホ向け暫定安全策。
 * 最終的な文字サイズ・余白は、PC版完成後のスマホ全体確認で再調整する。
 */
@media screen and (max-width: 767px) {
  .lp-body #kyoudosekkei #price.price-v2 {
    padding: 42px 16px 38px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-title {
    font-size: 24px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-lead {
    margin-bottom: 24px;
    font-size: 14px;
    text-align: left;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-top {
    grid-template-columns: minmax(0, 1fr);
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-course {
    padding: 22px 18px 20px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-card-title {
    font-size: 19px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-course-row {
    grid-template-columns: 86px minmax(0, 1fr);
    gap: 9px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-course-row dt,
  .lp-body #kyoudosekkei #price.price-v2 .pv2-course-row dd {
    font-size: 13px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-metrics {
    gap: 7px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-metric {
    padding: 12px 5px 10px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-metric strong {
    font-size: 18px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-metric--time strong {
    font-size: 15px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-purchase-body {
    padding: 18px 16px 20px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-campaign-status {
    gap: 8px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-campaign-period,
  .lp-body #kyoudosekkei #price.price-v2 .pv2-campaign-remain {
    font-size: 12px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-sale-price strong {
    font-size: clamp(38px, 13vw, 48px);
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-primary {
    font-size: 16px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-group {
    padding: 18px 10px 14px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-group-badges {
    margin-bottom: 12px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-subtitle {
    font-size: 21px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-table-wrap {
    overflow: visible;
    border: 0;
    background: transparent;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-table {
    width: 100%;
    min-width: 0;
    border-collapse: separate;
    border-spacing: 0 8px;
    table-layout: auto;
    background: transparent;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-table tbody {
    display: block;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-table tbody tr,
  .lp-body #kyoudosekkei #price.price-v2 .pv2-table tbody tr:nth-child(even) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(96px, auto);
    gap: 3px 12px;
    padding: 11px 13px;
    background: var(--pv2-white);
    border: 1px solid #cfe4df;
    border-radius: 8px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-table td {
    display: block;
    width: auto;
    padding: 0;
    border: 0;
    font-size: 13px;
    line-height: 1.5;
    text-align: left;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-table td:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
    font-weight: 800;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-table td:nth-child(2) {
    grid-column: 1;
    grid-row: 2;
    color: var(--pv2-orange);
    font-size: 12px;
    font-weight: 800;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-table td:nth-child(3) {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    font-weight: 800;
    text-align: right;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-group-notes {
    display: block;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-group-notes li {
    margin-bottom: 4px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-notes {
    padding: 20px 14px 16px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-notes-title {
    font-size: 19px;
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-note-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .lp-body #kyoudosekkei #price.price-v2 .pv2-note-card {
    min-height: 0;
  }
}

.benefit-v2-modal__close:hover,
.benefit-v2-modal__close:focus,
.benefit-v2-modal__close:visited {
  color: #007D73;
  text-decoration: none !important;
}
/* =========================================================
   ヘッド画像下：講座の特徴3項目＋対応端末
   ========================================================= */
.lp-body #kyoudosekkei .feature-sec.feature-overview .feature-container {
  box-sizing: border-box;
  padding: 54px 20px 64px;
  background: #fff;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  width: min(1010px, 100%);
  margin: 0 auto;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__card {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: auto;
  min-height: 224px;
  margin: 0;
  padding: 26px 24px 24px;
  color: #fff;
  text-align: center;
  background: #07877e;
  border: 0;
  border-radius: 12px;
  box-shadow: none;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__label {
  position: static;
  top: auto;
  left: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: auto;
  margin: 0 0 13px;
  padding: 0;
  color: #fff;
  white-space: normal;
  background: transparent;
  border: 0;
  border-radius: 0;
  transform: none;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__label .feature-icon {
  box-sizing: border-box;
  display: grid;
  flex: 0 0 40px;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 8px;
  background: #fff;
  border-radius: 50%;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__label .feature-icon img {
  display: block;
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__label p {
  margin: 0;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__main {
  margin: 0 0 16px;
  color: #fff;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: .02em;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__desc {
  width: 100%;
  margin: auto 0 0;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.75;
  text-align: center;
  word-break: normal;
  overflow-wrap: break-word;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__devices {
  box-sizing: border-box;
  display: flex;
  grid-column: 1 / -1;
  align-items: center;
  justify-content: center;
  gap: 28px;
  width: auto;
  min-height: 126px;
  margin: 8px 0 0;
  padding: 22px 44px;
  color: #122d4f;
  text-align: left;
  background: #eaf6f2;
  border: 0;
  border-radius: 12px;
  box-shadow: none;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__devices .feature-bottom-icon {
  position: static;
  flex: 0 0 174px;
  width: 174px;
  transform: none;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__devices .feature-bottom-icon img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__device-copy,
.lp-body #kyoudosekkei .feature-overview .feature-overview__devices p {
  margin: 0;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__device-title {
  color: #122d4f;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__device-note {
  display: flex;
  align-items: baseline;
  gap: 18px;
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.6;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__device-note strong {
  flex: 0 0 auto;
  color: #007f78;
  font-size: 15px;
}

.lp-body #kyoudosekkei .feature-overview .feature-overview__device-note span {
  display: inline;
  margin: 0;
  color: #5f6c75;
  font-size: 14px;
  font-weight: 400;
}

.feature-overview__mobile-break {
  display: none;
}

@media screen and (max-width: 767px) {
  .mobile-copy-break {
    display: initial;
  }

  .lp-body #kyoudosekkei .nayami-list p,
  .lp-body #kyoudosekkei .nayami-cta-sub,
  .lp-body #kyoudosekkei .hikaku-card-desc,
  .lp-body #kyoudosekkei .hikaku-note,
  .lp-body #kyoudosekkei .hikaku-concl,
  .lp-body #kyoudosekkei .study-sec .ss-lead,
  .lp-body #kyoudosekkei .study-sec .ss-card-desc {
    word-break: normal;
    overflow-wrap: break-word;
    line-break: strict;
    text-wrap: balance;
  }
}

@media screen and (max-width: 900px) and (min-width: 681px) {
  .lp-body #kyoudosekkei .feature-overview .feature-overview__list {
    gap: 16px;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__card {
    padding-right: 16px;
    padding-left: 16px;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__main {
    font-size: 25px;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__desc {
    font-size: 14px;
  }
}

@media screen and (max-width: 680px) {
  .lp-body #kyoudosekkei .feature-sec.feature-overview .feature-container {
    padding: 36px 16px 44px;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__list {
    grid-template-columns: 1fr;
    gap: 12px;
    width: 100%;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__card {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    grid-template-areas:
      "icon label"
      "icon main"
      "icon desc";
    column-gap: 14px;
    row-gap: 2px;
    align-items: center;
    width: 100%;
    min-height: 0;
    margin: 0;
    padding: 18px 20px;
    text-align: left;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__label {
    display: contents;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__label .feature-icon {
    grid-area: icon;
    align-self: center;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__label p {
    grid-area: label;
    justify-self: start;
    font-size: 15px;
    line-height: 1.4;
    text-align: left;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__main {
    grid-area: main;
    margin: 0;
    font-size: 25px;
    line-height: 1.3;
    text-align: left;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__desc {
    grid-area: desc;
    margin: 2px 0 0;
    font-size: 14px;
    line-height: 1.6;
    text-align: left;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__devices {
    flex-direction: column;
    gap: 14px;
    width: 100%;
    min-height: 0;
    margin: 0;
    padding: 24px 18px;
    text-align: center;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__devices .feature-bottom-icon {
    flex-basis: auto;
    width: 138px;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__device-title {
    font-size: 18px;
  }

  .lp-body #kyoudosekkei .feature-overview .feature-overview__device-note {
    flex-direction: column;
    align-items: center;
    gap: 3px;
    margin-top: 7px;
  }

  .feature-overview__mobile-break {
    display: initial;
  }
}

/* ============================================================
   強度設計入門講座：申込みページ専用
   HTMLの #kyoudo-order 内だけに適用
   ============================================================ */
.lp-body:has(#kyoudo-order) header.l-header.p-header .p-header__inner__bottom,
.lp-body:has(#kyoudo-order) header.l-header.p-header .p-header__float {
  display: none !important;
}

.lp-body:has(#kyoudo-order) .order-back-bar {
  position: absolute;
  top: 28px;
  left: max(40px, calc(50% - 520px));
  z-index: 2;
  background: transparent;
  padding: 0;
}

.lp-body:has(#kyoudo-order) .order-back-bar__inner {
  max-width: none;
  margin: 0;
  padding: 0;
}

.lp-body:has(#kyoudo-order) .order-back-bar a {
  display: inline-flex;
  align-items: center;
  color: #007d73;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
}

.lp-body:has(#kyoudo-order) .order-back-bar a:hover,
.lp-body:has(#kyoudo-order) .order-back-bar a:focus {
  text-decoration: none;
}

.lp-body:has(#kyoudo-order) .order-back-bar a::before {
  content: "←";
  margin-right: 6px;
  text-decoration: none;
}

.lp-body:has(#kyoudo-order) .lp-low {
  background: #f2faf8;
  position: relative;
  margin-bottom: 0;
  padding: 34px 20px 26px;
  height: auto;
}

.lp-body:has(#kyoudo-order) .lp-low img {
  display: none;
}

.lp-body:has(#kyoudo-order) .lp-low .ttl {
  position: static;
  color: #17324d;
  transform: none;
  bottom: auto;
  width: auto;
  font-size: 32px;
  font-weight: 800;
  text-align: center;
}

.lp-body:has(#kyoudo-order) .lp-low .ttl::before {
  content: "";
  display: block;
  width: 52px;
  height: 4px;
  background: #007d73;
  margin: 0 auto 16px;
}

.lp-body:has(#kyoudo-order) .lp-low .order-title-row {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  white-space: nowrap;
}

.lp-body:has(#kyoudo-order) .lp-low .order-course-title,
.lp-body:has(#kyoudo-order) .lp-low .order-page-title {
  display: block;
}

.lp-body:has(#kyoudo-order) .lp-low .order-course-title {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
}

.lp-body:has(#kyoudo-order) .lp-low .order-page-title {
  font-size: inherit;
  line-height: 1.4;
}

#kyoudo-order > section:first-child {
  padding-top: 42px;
}

.lp-body:has(#kyoudo-order) .lp-low .op-sub {
  max-width: 600px;
  margin: 10px auto 0;
  color: #718096;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.7;
  text-align: center;
}

#kyoudo-order .opf-heading {
  text-align: center;
  color: #17324d;
  font-size: 24px;
  font-weight: 800;
  margin: 0 0 30px;
}

#kyoudo-order .opf-heading::before {
  content: none !important;
  display: none !important;
}

#kyoudo-order .opf-steps {
  display: flex;
  max-width: 760px;
  margin: 0 auto;
}

#kyoudo-order .opf-step {
  flex: 1 1 0;
  min-width: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding-top: 34px;
}

#kyoudo-order .opf-step::before {
  content: "";
  position: absolute;
  top: 55px;
  left: -50%;
  width: 100%;
  height: 2px;
  background: #d8e5e1;
  z-index: 0;
}

#kyoudo-order .opf-step:first-child::before {
  display: none;
}

#kyoudo-order .opf-circle {
  position: relative;
  z-index: 1;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  border-radius: 50%;
  border: 2px solid #a8cfc6;
  background: #fff;
  color: #12866f;
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

#kyoudo-order .opf-step--current .opf-circle {
  background: #12866f;
  border-color: #12866f;
  color: #fff;
}

#kyoudo-order .opf-badge {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  background: #12866f;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.5;
  padding: 3px 10px;
  border-radius: 6px;
  white-space: nowrap;
}

#kyoudo-order .opf-badge::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: #12866f;
}

#kyoudo-order .opf-name {
  margin-top: 12px;
  font-size: 15px;
  font-weight: 800;
  color: #17324d;
  line-height: 1.4;
}

#kyoudo-order .opf-sub {
  margin-top: 4px;
  font-size: 12px;
  font-weight: 600;
  color: #8a94a6;
  line-height: 1.5;
}

#kyoudo-order .opp-sec {
  background: #eff7f4;
  padding: 44px 20px 48px;
  margin: 0 0 32px;
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

#kyoudo-order .opp-sec__head {
  text-align: center;
  margin: 0 0 30px;
}

#kyoudo-order .opp-sec__head h3.opp-title {
  color: #17324d;
  font-size: 26px;
  font-weight: 800;
  margin: 0;
  text-align: center;
  background: none !important;
  background-image: none !important;
  border: none !important;
  padding: 0 !important;
}

#kyoudo-order .opp-sec__head h3.opp-title::before {
  content: "";
  display: block;
  width: 52px;
  height: 4px;
  background: #007d73;
  margin: 0 auto 16px;
}

#kyoudo-order .opp-sec__head p.opp-lead {
  color: #718096;
  font-size: 14px;
  font-weight: 600;
  margin: 10px 0 0;
  text-align: center;
}

#kyoudo-order .opp-wrap {
  display: flex;
  gap: 20px;
  max-width: 900px;
  margin: 0 auto;
  align-items: stretch;
}

#kyoudo-order .opp-card {
  flex: 1 1 0;
  min-width: 0;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 4px 14px rgba(23, 50, 77, .08);
}

#kyoudo-order .opp-card--c {
  position: relative;
  z-index: 2;
  overflow: visible;
}

#kyoudo-order .opp-card--c .opp-card__head {
  border-radius: 14px 14px 0 0;
}

#kyoudo-order .opp-card--c .opp-card__body {
  border-radius: 0 0 14px 14px;
}

#kyoudo-order .opp-card__head {
  padding: 15px 12px;
  text-align: center;
  color: #fff;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: .02em;
}

#kyoudo-order .opp-card--a .opp-card__head,
#kyoudo-order .opp-card--b .opp-card__head {
  background: #12866f;
}

#kyoudo-order .opp-card--c .opp-card__head {
  background: #f08300;
}

#kyoudo-order .opp-card__body {
  padding: 20px 36px 22px;
  display: flex;
  flex-direction: column;
  flex: 1;
  text-align: center;
}

#kyoudo-order .opp-camp {
  display: none;
}

#kyoudo-order .opp-priceblock {
  display: grid;
  grid-template-columns: max-content max-content;
  grid-template-areas:
    "meta meta"
    "label badge"
    "price price"
    "tax tax";
  justify-content: center;
  align-items: center;
  column-gap: 4px;
}

#kyoudo-order .opp-meta {
  grid-area: meta;
  color: #8a94a6;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.6;
}

#kyoudo-order .opp-card__body .opp-meta {
  margin: 0 0 14px !important;
}

#kyoudo-order .opp-meta .opp-reg {
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}

#kyoudo-order .opp-label {
  grid-area: label;
  display: block;
  justify-self: start;
  text-align: left;
  font-size: 12px;
  font-weight: 600;
  color: #8a94a6;
  line-height: 1.5;
}

#kyoudo-order .opp-card__body .opp-label {
  margin: 0 0 3px !important;
}

/* 260802 割引が無いときのラベルは全講座「定価」に統一（アース指定）。旧: 通常価格 */
#kyoudo-order .opp-label::before {
  content: "定価";
}

#kyoudo-order .opp-wrap:has(.opp-camp) .opp-label::before {
  content: "販売価格";
}

#kyoudo-order .opp-wrap:has(.opp-camp) .opp-card--c .opp-label::before {
  content: "販売価格（1名あたり）";
}

#kyoudo-order .opp-label--b::before {
  content: "月々のお支払い" !important;
}

#kyoudo-order .opp-card--a .opp-priceblock,
#kyoudo-order .opp-card--c .opp-priceblock {
  padding-bottom: 6px;
}

#kyoudo-order .opp-pill {
  grid-area: badge;
  display: inline-flex;
  align-items: center;
  justify-self: start;
  align-self: center;
  padding: 2px 7px;
  border: 1px solid #f1d0ad;
  border-radius: 999px;
  background: #fff8f0;
  color: #b76018;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .03em;
  white-space: nowrap;
}

#kyoudo-order .opp-card__body .opp-pill {
  margin: 0 0 3px !important;
}

#kyoudo-order .opp-card--a .opp-pill {
  transform: translateX(-38px);
}

#kyoudo-order .opp-card--b .opp-pill {
  transform: translateX(-42px);
}

#kyoudo-order .opp-price {
  grid-area: price;
  line-height: 1.25;
}

#kyoudo-order .opp-card__body .opp-price {
  margin: 0 !important;
  line-height: 1.25 !important;
}

#kyoudo-order .opp-price .price01,
#kyoudo-order .opp-price .price03 {
  display: inline !important;
  font-size: 30px !important;
  font-weight: 800 !important;
}

#kyoudo-order .opp-card--a .opp-price .price01 {
  color: #e0261f;
}

#kyoudo-order .opp-card--b .opp-price .price03 {
  color: #12866f;
}

#kyoudo-order .opp-card--c .opp-price .price01 {
  color: #f08300;
}

#kyoudo-order .opp-card--c .opp-price br {
  display: none;
}

#kyoudo-order .opp-card--c .opp-price .price01::after {
  content: "（税別）";
  font-size: 14px;
  font-weight: 700;
  color: #5b6472;
}

#kyoudo-order .opp-price .opp-tax {
  font-size: 14px;
  font-weight: 700;
  color: #5b6472;
  margin-left: 2px;
}

#kyoudo-order .opp-price .price02,
#kyoudo-order .opp-price .price04 {
  display: block !important;
  color: #606469;
  font-size: 15px;
  font-weight: 600;
  margin-top: 2px;
}

#kyoudo-order .opp-monthly {
  font-size: 16px;
  white-space: nowrap;
}

#kyoudo-order .opp-card__body .opp-monthly {
  margin: 0 !important;
}

#kyoudo-order .opp-permonth {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #12866f !important;
}

#kyoudo-order .opp-taxline {
  grid-area: tax;
  color: #606469;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.25 !important;
}

#kyoudo-order .opp-taxline .price02,
#kyoudo-order .opp-taxline .price04 {
  display: inline !important;
}

#kyoudo-order .opp-card__body .opp-taxline {
  margin: 2px 0 0 !important;
}

#kyoudo-order .opp-info {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
  border-radius: 50%;
  border: 1px solid #12866f;
  color: #12866f;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  cursor: help;
}

#kyoudo-order .opp-info::before {
  content: "i";
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
}

/* 2026-08-03 ツールチップ本文に「付属テキストの配送」の案内を追記したため、
   5〜7行の長文でも読めるよう 文字11→12px・太さ600→500・行間1.5→1.7・
   余白6/10→10/12px・最大幅260→300px に拡張。位置と挙動は変更なし。 */
#kyoudo-order .opp-tip {
  position: absolute;
  bottom: calc(100% + 9px);
  right: -4px;
  left: auto;
  background: #17324d;
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.7;
  padding: 10px 12px;
  border-radius: 6px;
  width: max-content;
  max-width: 300px;
  white-space: normal;
  text-align: left;
  opacity: 0;
  visibility: hidden;
  transition: opacity .15s;
  z-index: 5;
}

#kyoudo-order .opp-tip::after {
  content: "";
  position: absolute;
  top: 100%;
  right: 10px;
  border: 5px solid transparent;
  border-top-color: #17324d;
}

#kyoudo-order .opp-info:hover .opp-tip,
#kyoudo-order .opp-info:focus .opp-tip {
  opacity: 1;
  visibility: visible;
}

/* 「団体割引は適用されません」等を <b> で強調したときの色（濃紺背景で読める淡橙） */
#kyoudo-order .opp-tip b {
  font-weight: 700;
  color: #ffd28a;
}

/* 2026-08-02 CSS監査: 旧お申込みカードの団体割リンク（.opp-group）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。
   ※ .group / .opp-permonth は使用中のため残置。 */

#kyoudo-order .opp-list {
  list-style: none !important;
  text-align: left;
  border-top: 1px solid #e3ede9;
}

#kyoudo-order .opp-card__body .opp-list {
  margin: 14px 0 0 !important;
  padding: 14px 0 0 !important;
}

#kyoudo-order .opp-list li {
  list-style: none !important;
  position: relative;
  padding: 0 0 0 20px;
  font-size: 13px;
  font-weight: 600;
  color: #3c4453;
  line-height: 1.6;
}

#kyoudo-order .opp-card__body .opp-list li {
  margin: 0 0 8px !important;
}

#kyoudo-order .opp-list li::marker {
  content: "";
}

#kyoudo-order .opp-list li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: .5em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

#kyoudo-order .opp-card--a .opp-list li::before,
#kyoudo-order .opp-card--b .opp-list li::before {
  background: #12866f;
}

#kyoudo-order .opp-card--c .opp-list li::before {
  background: #f08300;
}

#kyoudo-order .opp-cart {
  margin-top: auto;
  margin-left: -14px;
  margin-right: -14px;
}

#kyoudo-order .opp-card__body .opp-cart {
  padding-top: 10px !important;
}

#kyoudo-order .opp-card__body .opp-cart p.cart {
  margin: 0 !important;
  text-align: center;
}

#kyoudo-order .opp-qty {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  color: #3c4453;
}

#kyoudo-order .opp-card__body .opp-cart p.cart.opp-qty {
  margin: 0 0 20px !important;
}

#kyoudo-order .opp-cart input.product_quantity {
  width: 56px;
  text-align: center;
  padding: 6px;
  border: 1px solid #d5dbe2;
  border-radius: 6px;
  font-size: 14px;
}

#kyoudo-order .opp-cart input.product_cart {
  width: 90%;
  -webkit-appearance: none;
  appearance: none;
  border: none !important;
  border-radius: 8px !important;
  padding: 14px 6px;
  background: #c00 !important;
  background-image: none !important;
  color: #fff !important;
  font-weight: 800;
  font-size: 13px;
  line-height: 1.4;
  cursor: pointer;
  box-shadow: none !important;
  transition: opacity .2s;
}

#kyoudo-order .opp-cart input.product_cart:hover {
  opacity: .75;
  border: none !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  background: #c00 !important;
}

#kyoudo-order .opp-cart input.product_cart:focus,
#kyoudo-order .opp-cart input.product_cart:active {
  opacity: .6;
  border: none !important;
  border-radius: 8px !important;
  outline: none !important;
  box-shadow: none !important;
  background: #c00 !important;
}

#kyoudo-order .opn {
  max-width: 900px;
  margin: 32px auto 0;
  background: #f8fbfb;
  border: 1px solid #ddeae5;
  border-radius: 16px;
  padding: 26px 22px 20px;
  text-align: left;
}

#kyoudo-order .opn p {
  margin: 0 !important;
}

#kyoudo-order .opn p.opn__title {
  margin: 0 0 18px !important;
  font-size: 20px;
  font-weight: 800;
  color: #17324d;
  line-height: 1.45;
  text-align: center;
}

#kyoudo-order .opn__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

#kyoudo-order .opn__card {
  position: relative;
  min-width: 0;
  min-height: 0;
  padding: 18px 16px 16px 56px;
  border: 1px solid #d6e5e3;
  border-radius: 10px;
  background: #fff;
}

#kyoudo-order .opn__card--warning {
  border-color: #d6e5e3;
  background: #fff;
}

#kyoudo-order .opn__card-icon {
  position: absolute;
  top: 18px;
  left: 16px;
  width: 27px;
  height: 27px;
  background-color: #008f86;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

#kyoudo-order .opn__card--invoice .opn__card-icon {
  -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_invoice.svg");
  mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_invoice.svg");
}

#kyoudo-order .opn__card--receipt .opn__card-icon {
  -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_receipt.svg");
  mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_receipt.svg");
}

#kyoudo-order .opn__card--warning .opn__card-icon {
  background-color: #008f86;
  -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_note.svg");
  mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_note.svg");
}

#kyoudo-order .opn__ttl {
  font-size: 15px;
  font-weight: 800;
  color: #12866f;
  margin: 0 0 8px !important;
}

#kyoudo-order .opn__txt {
  font-size: 12px;
  color: #3c4453;
  line-height: 1.7;
}

#kyoudo-order .opn__card--warning .opn__ttl {
  color: #12866f;
}

/* 2026-08-02 CSS監査: 旧お申込みページの注意カード内リンク（.opn__link）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

@media screen and (max-width: 767px) {
  .lp-body:has(#kyoudo-order) .order-back-bar {
    position: static;
    margin: 0 0 18px;
    text-align: left;
  }

  .lp-body:has(#kyoudo-order) .order-back-bar a {
    font-size: 13px;
  }

  .lp-body:has(#kyoudo-order) .lp-low {
    padding: 28px 16px 22px;
    margin-top: 0;
  }

  .lp-body:has(#kyoudo-order) .lp-low .ttl {
    font-size: 24px;
  }

  .lp-body:has(#kyoudo-order) .lp-low .order-course-title {
    margin: 0;
    font-size: 15px;
  }

  .lp-body:has(#kyoudo-order) .lp-low .order-title-row {
    gap: 7px;
  }

  #kyoudo-order > section:first-child {
    padding-top: 30px;
  }

  #kyoudo-order .opf-steps {
    flex-wrap: wrap;
    row-gap: 24px;
  }

  #kyoudo-order .opf-step {
    flex: 0 0 50%;
  }

  #kyoudo-order .opf-step:nth-child(3)::before {
    display: none;
  }

  #kyoudo-order .opn {
    padding: 20px 14px 16px;
  }

  #kyoudo-order .opn__title {
    font-size: 19px;
  }

  #kyoudo-order .opn__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  #kyoudo-order .opn__card {
    min-height: 0;
  }
}

/* 申込ページ：スマートフォン最適化 */
@media screen and (max-width: 767px) {
  #kyoudo-order .opf-heading {
    font-size: 22px;
    letter-spacing: .04em;
  }

  #kyoudo-order figure.entry-content {
    margin-top: 44px;
    margin-bottom: 48px;
  }

  #kyoudo-order .opp-sec {
    width: 100vw;
    padding: 36px 16px 40px;
    margin-bottom: 24px;
  }

  #kyoudo-order .opp-sec__head {
    margin-bottom: 24px;
  }

  #kyoudo-order .opp-sec__head h3.opp-title {
    font-size: 22px;
    line-height: 1.45;
  }

  #kyoudo-order .opp-sec__head h3.opp-title::before {
    width: 46px;
    height: 3px;
    margin-bottom: 14px;
  }

  #kyoudo-order .opp-sec__head p.opp-lead {
    margin-top: 8px;
    font-size: 13px;
    line-height: 1.7;
  }

  #kyoudo-order .opp-wrap {
    flex-direction: column;
    gap: 18px;
    width: 100%;
  }

  #kyoudo-order .opp-card {
    flex: none;
    width: 100%;
    min-height: 0;
  }

  #kyoudo-order .opp-card__head {
    padding: 14px 12px;
    font-size: 17px;
    line-height: 1.45;
  }

  #kyoudo-order .opp-card__body {
    padding: 20px 24px 22px;
  }

  #kyoudo-order .opp-meta {
    font-size: 13px;
  }

  #kyoudo-order .opp-card--a .opp-pill,
  #kyoudo-order .opp-card--b .opp-pill {
    transform: none;
  }

  #kyoudo-order .opp-price .price01,
  #kyoudo-order .opp-price .price03 {
    font-size: 30px !important;
  }

  #kyoudo-order .opp-monthly {
    font-size: 15px;
    white-space: normal;
  }

  #kyoudo-order .opp-list {
    margin-top: 16px !important;
    padding-top: 16px !important;
  }

  #kyoudo-order .opp-list li {
    font-size: 14px;
  }

  #kyoudo-order .opp-cart {
    margin-right: 0;
    margin-left: 0;
  }

  #kyoudo-order .opp-card__body .opp-cart {
    padding-top: 14px !important;
  }

  #kyoudo-order .opp-card__body .opp-cart p.cart.opp-qty {
    margin-bottom: 18px !important;
  }

  #kyoudo-order .opp-qty {
    flex-wrap: wrap;
    gap: 7px;
    font-size: 14px;
  }

  #kyoudo-order .opp-cart input.product_cart {
    width: 100%;
    min-height: 50px;
    padding: 14px 10px;
    font-size: 14px;
  }

  /* 2026-08-03 長文化に合わせて上限を260→300pxへ。画面端の余白は48→40pxに詰める */
  #kyoudo-order .opp-tip {
    right: -8px;
    width: max-content;
    max-width: min(300px, calc(100vw - 40px));
  }

  #kyoudo-order .opn {
    margin-top: 24px;
  }

  #kyoudo-order figure.entry-content > table.visible-phone {
    display: none !important;
  }

  #kyoudo-order p.more a {
    white-space: nowrap;
  }
}

@media screen and (max-width: 340px) {
  .lp-body:has(#kyoudo-order) header.l-header.p-header .p-header__logo {
    width: 160px;
    flex: 0 0 160px;
  }

  .lp-body:has(#kyoudo-order) header.l-header.p-header .p-header__logo img {
    width: 160px;
    height: auto;
  }
}

/* 強度設計トップページ：申込みCTAの赤を固定追従ボタンと統一 */
.lp-body #kyoudosekkei .lp-cta,
.lp-body #kyoudosekkei .apply-v2-primary {
  background: #cc0000 !important;
  background-image: none !important;
  box-shadow: 0 3px 0 #990000;
}

.lp-body #kyoudosekkei .lp-cta:hover,
.lp-body #kyoudosekkei .lp-cta:focus,
.lp-body #kyoudosekkei .apply-v2-primary:hover,
.lp-body #kyoudosekkei .apply-v2-primary:focus {
  background: #b30000 !important;
  background-image: none !important;
}

/* 料金・申込方法：価格カード内の申込みボタンも赤を統一 */
.lp-body #kyoudosekkei #price.price-v2 .pv2-primary {
  background: #cc0000 !important;
  background-image: none !important;
  box-shadow: 0 3px 0 #990000;
}

.lp-body #kyoudosekkei #price.price-v2 .pv2-primary:hover,
.lp-body #kyoudosekkei #price.price-v2 .pv2-primary:focus {
  background: #b30000 !important;
  background-image: none !important;
}

/* 2026-08-02 タブレット（iPad）で追従CTAカードが出ない件の修正。
   旧: 768〜1334px は .float_cart を display:none にしていた
       （1265px前後で本文に重なるため。即戦力LPにはこの指定が無く表示される）
   新: アース指示により「タブレットでも表示する」方針へ変更。

   2026-08-03 経緯：
   ・重なり対策として幅150px・bottom 90px に縮めたが、
     「このページのTOPへ▲」(#page-top) と重なった。#page-top は common.js が
     inline で bottom:75px を付けており、ボタン高さと合わせて画面下から
     128px までを占める（実測）。
   ・さらに幅150pxではカート内の「講座に申し込む」が「講座に申し込／む」と
     2行に折り返してしまった。
   → 最終的に、既に問題なく表示できている即戦力LPと同じ見た目に揃える方針とし、
     サイズ・位置の上書きはすべて撤去して display:block のみとする。
     幅180px・bottom 150px（style.css のベース値）が適用され、
     TOPボタンの上端(128px)との間に 22px の余白が残る。
   ※実機（iPad 縦 834px / 横 1024px）での確認は要お願い。 */
@media screen and (min-width: 768px) and (max-width: 1334px) {
  .lp-body:has(#kyoudosekkei) .float_cart.hidden-phone {
    display: block !important;
  }
}

/* =============================================================
   スマホ固定バー(.float_cart_sp)に価格を表示する  2026-08-01
   -------------------------------------------------------------
   従来は .price / .intax を display:none で隠しており、
   バーには「講座に申し込む」しか出ていなかった。
   PC側の追従カートと同じく価格を出す方針に統一する
   （価格の値はページ内のJSが既に書き込んでいるためHTML変更は不要）。
   バー高55pxは変えず、行送りを詰めて2行を収める。
   製図LP・即戦力LPにも同じ指定を入れ、3講座で見た目を揃えている。
   実測：320px / 390px とも全要素がバー内に収まり、重なりなし。
   ============================================================= */
@media screen and (max-width: 767px) {
  .lp-body .float_cart_sp { display: block !important; text-align: center; }
  .lp-body .float_cart_sp .fa-shopping-cart { display: none !important; }
  .lp-body .float_cart_sp .buy {
    display: block !important; line-height: 1.3 !important;
    margin: 0 !important; padding: 7px 10px !important;
    text-align: center; box-sizing: border-box;
  }
  .lp-body .float_cart_sp .buy br { display: none !important; }
  .lp-body .float_cart_sp .purchase { display: block !important; font-size: 16px !important; line-height: 1.3 !important; }
  .lp-body .float_cart_sp .price { display: inline !important; font-size: 13px !important; font-weight: 700; line-height: 1.3 !important; }
  .lp-body .float_cart_sp .intax { display: inline !important; font-size: 11px !important; line-height: 1.3 !important; }
}

/* ============================================================================
   260802 お客様の声セクション（#sec-survey）用の上書き ─ kyoudo（強度設計入門講座）

   貼る場所：themes/fantomsemi/css/lp_kyoudo.css の【末尾】
   このブロックだけを、まるごと1回貼ってください。

   ■ なぜ講座別CSSが要るのか（3つ）
     1. 講座色  … lp_voice.css の既定値は seizu の紺。kyoudo のティールに合わせる
     2. スマホの左右余白 … 本文ラッパー #kyoudosekkei に padding が無く、
                          375px幅で声セクションだけが画面端に接する
     3. ★旧 style_kyodo.css の打ち消し … 下記

   ■ ★3が kyoudo 固有の落とし穴
     style_kyodo.css（読み込み順が最後）に、id詳細度のタグ指定が残っている。

        #kyoudosekkei ul, #kyoudosekkei li, #kyoudosekkei p { margin:0; }   … 348行
        #kyoudosekkei h2 { background:#1c7e76; color:#fff; font-size:34px;
                           padding:24px 30px 20px; ... }                    … 369行

     これは詳細度 (1,0,1)。lp_voice.css のクラス指定 (0,1,0) に勝ってしまうため、
       ・カードの見出しと属性の余白が消えて文字が詰まる
       ・帯見出しが「濃いティール地＋白字」になり、ページの他の見出しと揃わない
     という2つの崩れが出る。実測で確認済み。

     打ち消しは .lp-body #kyoudosekkei #sec-survey ... と書く（詳細度 (2,2,0)）。
     これで詳細度で勝てるので !important は不要。

   ■ 幅について
     sokusen と違い、幅の指定は要らない。
     #kyoudosekkei が lp_kyoudo.css 3925行で max-width:960px 中央寄せになっており、
     #sec-survey は何もしなくても960pxに収まる（1280px幅で実測：left 153 / 幅960）。
   ============================================================================ */

/* ---- 1. 講座色 ------------------------------------------------------------
   lp_voice.css は後に読まれるため #sec-survey だけでは負ける。.lp-body を付ける。 */
.lp-body #sec-survey { --voice-accent: #0C6E64; --voice-accent-bg: #E8F5F2; }


/* ---- 2. スマホの左右余白 --------------------------------------------------
   16px は真上の特典セクション（.benefit-v2__inner）と同じ値。
   左右対称なので .sec-title の全幅ブレイクアウト（width:100vw / margin:0 -50vw）は
   位置がずれない。 */
@media screen and (max-width: 767px) {
  .lp-body #sec-survey { padding-left: 16px; padding-right: 16px; }
}


/* ---- 3. #kyoudosekkei p{margin:0} で消える余白を戻す ----------------------
   値はすべて lp_voice.css の定義そのまま。増やしても減らしてもいない。
   （div の .survey-lead / .vqa は影響を受けないので触らない。
     セクション内に ul / li は0個。） */
.lp-body #kyoudosekkei #sec-survey .voice-card-title      { margin: 0 0 8px; }
.lp-body #kyoudosekkei #sec-survey .voice-card-attr       { margin: 0 0 16px; }
.lp-body #kyoudosekkei #sec-survey .voice-detail-remain   { margin: 0 0 10px; }
.lp-body #kyoudosekkei #sec-survey .voice-detail-done-msg { margin: 36px 0 0; }
.lp-body #kyoudosekkei #sec-survey .raw-intro > p         { margin: 8px 0 0; }
.lp-body #kyoudosekkei #sec-survey .voice-sheet .va       { margin: 1px 0 0; }
.lp-body #kyoudosekkei #sec-survey .vsec-comment          { margin: 0 0 10px; }


/* ---- 3-2. 旧CSSがアバターを四角にするのを戻す ------------------------------
   style_kyodo.css の @media screen and (max-width:800px) に
     #kyoudosekkei img { border-radius:0; }
   があり、詳細度 (1,0,1) で lp_voice.css の .avatar (0,1,0) に勝つ。
   放っておくと800px以下で「代表的な声」の丸アイコンが四角くなる（実測で確認）。
   ここはメディアクエリの外に書く。詳細度 (2,2,0) なので全幅で勝ち、
   旧CSSの 800px と lp_voice.css の 767px の食い違いを気にしなくて済む。 */
.lp-body #kyoudosekkei #sec-survey .avatar { border-radius: 50%; height: 64px; }

/* 同じ理由（旧 #kyoudosekkei p{line-height:160%}）で行間を戻す */
.lp-body #kyoudosekkei #sec-survey .vsec-comment     { line-height: 1.7; }
.lp-body #kyoudosekkei #sec-survey .voice-card-title { line-height: 1.5; }


/* ---- 4. 帯見出しを lp_voice.css の .sec-title に戻す ----------------------
   旧 #kyoudosekkei h2 が上書きしている6項目を戻す。
   背景と文字色は変数から取るので、1の講座色を変えればここも一緒に変わる。

   ★margin を書いている理由（これが無いと帯が右にずれて画面からはみ出す）
     声セクションは <div class="kaiketsu"> の中に入る。lp_kyoudo.css に
       .lp-body #kyoudosekkei .need h2, .lp-body #kyoudosekkei .kaiketsu h2
         { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
     があり、詳細度 (1,2,1) で lp_voice.css の .sec-title (0,1,0) に勝つ。
     この2つは「全幅に広げる手法」が違う（calc方式 と left:50%+-50vw方式）。
     両方が混ざると二重にずれる。実測：375px幅で帯が left 172 / right 547 に飛び、
     画面外へ172pxはみ出した。lp_voice.css 側の値を書き戻して揃える。 */
.lp-body #kyoudosekkei #sec-survey .sec-title {
  background: var(--voice-accent-bg, #E8F5F2);
  color: var(--voice-accent, #0C6E64);
  font-size: 36px;
  letter-spacing: normal;
  line-height: 1.4;
  margin: 0 -50vw 40px;
  padding: 30px 20px 48px;
  text-align: center;
  white-space: normal;   /* .kaiketsu h2 の white-space:pre-line を打ち消す */
}

/* 上のブロックはメディアクエリの外に置いてある。詳細度 (2,2,0) なので、
   旧CSSが @media max-device-width:800px で指定する font-size:18px / text-align:left
   にも全幅で勝つ。旧CSSの800pxと lp_voice.css の767pxの食い違いを気にせずに済む。 */

@media screen and (max-width: 767px) {
  /* lp_voice.css がスマホで指定している値に揃える */
  .lp-body #kyoudosekkei #sec-survey .sec-title {
    font-size: 24px;
    padding: 30px 20px 48px;
    text-align: center;
  }
}

