/* メディケア for Men（旧デザイン）：本番の mens-course.css から2ページで使うルールを抜き出したもの。tools/build_mens.py で生成 */
.mainBody { border-top: 10px solid rgb(0, 0, 0); }
.mainBox .leftBox { width: 400px; }
.mainBox .leftBox p { padding: 20px 15px 0px; }
.mainBox .leftBox dl { border-top: 2px solid rgb(0, 0, 0); border-bottom: 1px solid rgb(0, 0, 0); padding-top: 2px; text-align: center; font-size: 1.2em; margin: 30px auto 0px; width: 370px; }
.mainBox .leftBox dt { border-top: 1px solid rgb(0, 0, 0); border-bottom: 1px solid rgb(0, 0, 0); padding: 10px 0px; }
.mainBox .leftBox dd { padding: 15px 0px; }
.mainBox .leftBox dd li { padding: 5px 0px; font-size: 0.9em; }
.mainBox .leftBox dd li span { font-weight: bold; }
.mainBox .rightBox { width: 270px; }
.mainBox .rightBox dl { padding: 20px 0px 30px; margin: 0px auto; text-align: center; }
.mainBox .rightBox dt { border-top: 5px solid rgb(0, 0, 0); border-bottom: 1px solid rgb(0, 0, 0); font-size: 1.2em; padding: 0.2em; letter-spacing: 0.3em; }
.mainBox .rightBox dd { padding: 15px 10px 0px; font-size: 1.5em; }
.mainBox .rightBox dd span, .mainBox .rightBox dd li { font-size: 0.6em; }
.courseBlock { padding: 30px 0px; }
.courseBlock h1 { font-size: 1.2em; text-align: center; letter-spacing: 0.7em; padding: 1em 0px; font-weight: normal; background: url("../img/course/common/bar_mens.png") 50% 50% no-repeat; background-image: image-set(url("../img/course/common/bar_mens.webp") type("image/webp"), url("../img/course/common/bar_mens.png") type("image/png")); }
.courseBlock p.adHeadTxt { font-size: 0.7em; text-align: center; }
.courseBlock h2 { font-size: 1.4em; padding: 0.5em 0.2em; border-bottom: 1px solid rgb(0, 0, 0); border-top: 1px solid rgb(0, 0, 0); line-height: 120%; font-weight: normal; margin-bottom: 0.5em; }
.courseBox { padding: 21px 0px 40px; }
.txtBox { width: 385px; }
.phBox { width: 295px; }
.step01 { background: url("../img/course/common/steptit01_mens.png") 0% 0% no-repeat; background-image: image-set(url("../img/course/common/steptit01_mens.webp") type("image/webp"), url("../img/course/common/steptit01_mens.png") type("image/png")); }
.step02 { background: url("../img/course/common/steptit02_mens.png") 0% 0% no-repeat; background-image: image-set(url("../img/course/common/steptit02_mens.webp") type("image/webp"), url("../img/course/common/steptit02_mens.png") type("image/png")); }
.step03 { background: url("../img/course/common/steptit03_mens.png") 0% 0% no-repeat; background-image: image-set(url("../img/course/common/steptit03_mens.webp") type("image/webp"), url("../img/course/common/steptit03_mens.png") type("image/png")); }
.step04 { background: url("../img/course/common/steptit04_mens.png") 0% 0% no-repeat; background-image: image-set(url("../img/course/common/steptit04_mens.webp") type("image/webp"), url("../img/course/common/steptit04_mens.png") type("image/png")); }
@media screen and (max-width: 770px) {
  .mainBox .leftBox { width: 100%; }
  .mainBox .leftBox dl { padding: 10% 5%; text-align: center; }
  .mainBox .rightBox { width: 100%; }
  .mainBox .rightBox dl { padding: 10px 0px; width: 240px; margin: 0px auto; }
  .mainBox .rightBox ul { padding: 10px 0px; text-align: center; }
  .txtBox { width: 100%; }
  .phBox { width: 100%; text-align: center; }
  .courseBox p { padding: 0px 10px 20px; }
}

/* 横はみ出しの修正（2026-10-16・2026-10-21） */
@media screen and (max-width: 770px) {
  .mainBox .leftBox dl { width: auto; }
  .featureAreaTit { letter-spacing: 0.2em; }
  .featureAreaTit.barDeco { display: flex; align-items: center; justify-content: center; white-space: nowrap; }
  .featureAreaTit.barDeco::before,
  .featureAreaTit.barDeco::after { content: ""; flex: 0 1 73px; min-width: 0; height: 5px; padding: 0; }
  .featureAreaTit.barDeco::before { margin-right: 12px; background-position: 100% 50%; }
  .featureAreaTit.barDeco::after { margin-left: 12px; background-position: 0% 50%; }
}
