/* ====================
Page Head
==================== */
.nm_page-head.nm_page-head--conditioning {
  background-image: url(/mens/asset2026/img/conditioning/bg-conditioning_top.jpg);
}

.nm_page-head_inr.nm_page-head_inr--conditioning {
  background: url(/mens/asset2026/img/conditioning/bg-conditioning_txt.png) center bottom / 100% auto no-repeat;
  padding: min(100px, 12%) 0 min(16%, 240px);
}

/* ====================
Total
==================== */
.nm_conditioning-total {
  background: url(/mens/asset2026/img/conditioning/bg-conditioning_total.jpg);
  background-size: 100% 100%;
  padding: 0 6%;
}

.nm_conditioning-total_inr {
  max-width: var(--width-base-inr);
  margin: 0 auto;
  padding: min(100px, 12%) 0;
  justify-content: center;
}

.nm_conditioning-total_intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 2em;
}

.nm_conditioning-total_intro-sub {
  display: flex;
  align-items: center;
  justify-content: center;
}

.nm_conditioning-total_intro-sub_inr {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 1em;
  font-size: 18px;
  letter-spacing: 0;
  font-weight: bold;
  text-align: center;
}

.nm_conditioning-total_intro-sub_inr>br {
  display: none;
}

.nm_conditioning-total_intro-sub_inr::before,
.nm_conditioning-total_intro-sub_inr::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 4px;
  height: 100%;
  border: 1px solid var(--color-bg-blue);
}

.nm_conditioning-total_intro-sub_inr::before {
  left: 0;
  border-right: none;
}

.nm_conditioning-total_intro-sub_inr::after {
  right: 0;
  border-left: none;
}

.nm_conditioning-total_intro-sub img {
  display: inline-block;
  width: 24px;
  height: 24px;
  margin: 0 .5em;
}

.nm_conditioning-total_intro-desc {
  line-height: 2;
}

/* ====================
Step
==================== */
.nm_conditioning-step {
  margin-top: min(100px, 10vw);
}

.nm_conditioning-step_inr {
  max-width: var(--width-base-inr);
  margin: auto;
  display: flex;
  justify-content: center;
}

.nm_conditioning-step_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
}

.nm_conditioning-step_el {
  width: 396px;
}

.nm_conditioning-step_img {

}

.nm_conditioning-step_desc {
  margin-top: 6%;
  position: relative;
  padding-left: 50px;
  padding-right: calc(50px - 22px);
  padding-bottom: 1em;
}

.nm_conditioning-step_label {
  position: absolute;
  top: 0;
  left: 0;
  width: 22px;
}

.nm_conditioning-step_title {
  color: var(--color-text-blue);
  font-family: var(--font-family-serif);
  font-weight: bold;
  font-size: 27px;
}

.nm_conditioning-step_sub {
  font-family: var(--font-family-serif);
  color: var(--color-text-black);
  font-weight: bold;
  font-size: 18px;
  margin-top: 1em;
}

.nm_conditioning-step_sub+p {
  font-size: 14px;
  margin-top: 1em;
}

/* ====================
Promise
==================== */
.nm_conditioning-promise {
  margin-top: 30px;
}

.nm_conditioning-promise_inr {
  background-color: var(--color-bg);
  padding: 40px;
  box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.15);
}

.nm_conditioning-promise_list-wrap {
  margin-top: 2em;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.nm_conditioning-promise_list {
  display: flex;
  flex-wrap: wrap;
  width: 558px;
  justify-content: space-around;
  margin-bottom: 10px;
  box-sizing: border-box;
}

.nm_conditioning-promise_list-el {
  gap: 10px;
  width: calc(50% - 10px);
  padding: 1em;
  background-color: var(--color-bg-light-blue);
}

.nm_conditioning-promise_list-lead {
  font-family: var(--font-family-serif);
  font-size: 18px;
  font-weight: bold;
  min-height: 7em;
  color: var(--color-text-black);
}

.nm_conditioning-promise_list-lead+p {
  font-size: 14px;
}

.nm_conditioning-promise_note {
  font-size: 12px;
  margin-top: 2em;
}

/* ====================
Plan
==================== */
.nm_conditioning-plan {
  background: url(/mens/asset2026/img/conditioning/bg-conditioning_plan.jpg);
  background-size: 100% 100%;
  padding: 0 6%;
}

.nm_conditioning-plan_inr {
  max-width: var(--width-base-inr);
  margin: 0 auto;
  padding: min(100px, 12%) 0;
}

.nm_sec-heading_head--plan > br {
  display: none;
}

.nm_conditioning-plan_heading-desc {
  margin-top: 2em;
}

.nm_conditioning-plan_heading-desc > br {
  display: none;
}

/* ====================
Select
==================== */
.nm_conditioning-select {
  margin-top: 6%;
  box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.15);
}

.nm_conditioning-select.nm_conditioning-select--treatment {
  margin-top: 30px;
}

.nm_conditioning-select_top {
  display: flex;
  gap: 1em;
  padding: 40px 50px;
  /* align-items: center; */
  align-items: flex-start;
  justify-content: space-between;
  background-color: var(--color-bg-light-blue);
}

.nm_conditioning-select_lead {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 1em;
}

.nm_conditioning-select_no {
  width: 90px;
}

.nm_conditioning-select_title {
  font-size: 27px;
  font-family: var(--font-family-serif);
  font-weight: bold;
  color: var(--color-text-black);
  line-height: 1.6;
}

.nm_conditioning-select_time-wrap {
  display: flex;
  gap: 1em;
  flex-shrink: 0;
}

.nm_conditioning-select_time {
  display: flex;
  flex-direction: column;
  background-color: var(--color-bg);
  padding: 1em 2em;
  border: 1px solid var(--color-border-dark);
  border-radius: 2px;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.nm_conditioning-select_time-total {
  display: flex;
  color: var(--color-text-blue);
  font-family: var(--font-family-serif);
  font-weight: bold;
  font-size: 16px;
  align-items: baseline;
}

.nm_conditioning-select_time-total > span {
  font-size: 34px;
  font-family: var(--font-family-am);
  font-weight: bold;
  margin: 0 2px;
}

.nm_conditioning-select_time-case {
  color: var(--color-text-black);
  font-family: var(--font-family-serif);
  font-weight: bold;
  font-size: 14px;
  margin-bottom: 2px;
  display: flex;
  align-items: baseline;
}

.nm_conditioning-select_time-case > span {
  font-size: 24px;
  font-family: var(--font-family-am);
  font-weight: normal;
}

.nm_conditioning-select_time--dbl .nm_conditioning-select_time-total > span {
  font-size: 32px;
}

.nm_conditioning-select_plan {
  background-color: var(--color-bg);
  padding: 40px 50px calc(40px - 24px);
}

.nm_conditioning-select_plan.nm_conditioning-select_plan--treatment {
  padding: 40px 50px;
}

.nm_conditioning-select_plan-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.nm_conditioning-select_plan-el {
  width: 364px;
  display: grid;
  gap: 2em;
  padding: 0 24px;
  border-left: 1px solid var(--color-border-dark);
  border-right: 1px solid var(--color-border-dark);
  margin-bottom: 24px;
}

.nm_conditioning-select_plan-label {
  width: 92px;
}

.nm_sec-heading_head.nm_sec-heading_head--select_plan {
  letter-spacing: 0;
}

.nm_sec-heading_head.nm_sec-heading_head--select_plan > a{
  color: var(--color-text-blue);
}

.nm_conditioning-select_plan-desc {
  color: var(--color-text-black);
  line-height: 1.8;
  min-height: 6em;
}

.nm_conditioning-select_plan-treatment {
  display: flex;
  gap: 1em;
}

.nm_conditioning-select_plan-treatment_img {
  width: 115px;
}

.nm_conditioning-select_plan-treatment_info-time {
  padding: 3px;
  color: var(--color-text-blue);
  font-family: var(--font-family-am);
  font-size: 20px;
  line-height: 1;
  text-align: center;
  background-color: var(--color-bg-light-blue);
  font-weight: bold;
}

.nm_conditioning-select_plan-treatment_info-time > span {
  font-size: 16px;
  font-family: var(--font-family-serif);
  margin-left: 2px;
  font-weight: bold;
}

.nm_conditioning-select_plan-treatment_info-title {
  color: var(--color-text-blue);
  font-weight: bold;
  font-size: 16px;
  line-height: 1;
  margin-top: .8em;
}

.nm_conditioning-select_plan-treatment_info-title + p {
  font-size: 12px;
  margin-top: .8em;
}

.nm_conditioning-select_plan-treatment.nm_conditioning-select_plan-treatment--inverse {
    background-color: var(--color-bg-light-blue);
    padding: 10px;
}

.nm_conditioning-select_plan-treatment--inverse .nm_conditioning-select_plan-treatment_info-time {
    background-color: var(--color-bg);
}

/* ====================
Treatment
==================== */
.nm_conditioning-select_treatment-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 40px 8px;
    /* align-items: center; */
    align-items: flex-start;
}

.nm_conditioning-select_treatment-el {
    width: 150px;
    position: relative;
}

.nm_conditioning-select_treatment-img {
  position: relative;

}

.nm_conditioning-select_treatment-btn {
  display: none !important; /* .TODO--Ready */
  position: absolute;
  bottom: 10px;
  right: 10px;
  display: block;
  background-color: transparent;
  align-items: center;
  padding: 20px 40px;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  border-radius: 15px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15);
}

.nm_conditioning-select_treatment-btn > img {
  width: 30px;
}

.nm_conditioning-select_treatment-name {
  margin-top: .2em;
  font-weight: bold;
  color: var(--color-text-blue);
  text-align: center;
}

.nm_conditioning-select_treatment-name > br {
  display: none;
}

.nm_conditioning-select_treatment-name > span {
  display: block;
  font-size: 10px;
  font-weight: normal;
}

.nm_conditioning-select_treatment-desc {
  margin-top: 3em;
  font-family: var(--font-family-serif);
  font-size: 16px;
  font-weight: bold;
  color: var(--color-text-black);
}

.nm_conditioning-select_treatment-note {
  font-size: 12px;
  margin-top: 2em;
}

/* ====================
Btm Contents
==================== */
.nm_conditioning-btm {
  background: url(/mens/asset2026/img/conditioning/bg-conditioning_btm.jpg);
  background-size: 100% 100%;
  padding: 0 6%;
}

.nm_conditioning-btm_inr {
  max-width: var(--width-base-inr);
  margin: 0 auto;
  padding: min(100px, 12%) 0;
}

.nm_conditioning-trial {

}

.nm_conditioning-trial_bnr {
  margin-top: 6%;
  box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.15);
}

/* ====================
About Plan
==================== */
.nm_conditioning-about_plan {
  margin-top: 10%;
}

.nm_conditioning-about_plan-note {
  text-align: center;
  margin-top: 3em;
}

.nm_conditioning-plan_btn-wrap {
  display: flex;
  justify-content: center;
  margin-top: 3em;
}

.nm_conditioning-plan_btn-wrap.nm_conditioning-plan_btn-wrap--focus {
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}

.nm_conditioning-plan_btn-wrap.nm_conditioning-plan_btn-wrap--focus > a {
  width: 380px;
  box-shadow: 4px 4px 10px 0 rgba(0, 0, 0, 0.15);
}

/* ====================
Focus Treatment
==================== */
.nm_link-btn.nm_link-btn-heading-focus {
  max-width: 330px;
}

.nm_focus-wrap {
  padding: 0 4% min(100px, 12%);
  background-image: url(/mens/asset2026/img/conditioning/bg-focus_main.jpg);
  background-size: 100% 100%;
}

.nm_focus-inr {

}

.nnm_focus-intro {
  color: var(--color-text-white);
  font-family: var(--font-family-serif);
}

.nnm_focus-intro_inr {
  padding: min(100px, 12%) 30px 0;
}

.nnm_focus-intro_title {
  text-align: center;
  font-size: 27px;
}

.nnm_focus-intro_list-wrap {
  margin-top: 2em;
}

.nnm_focus-intro_list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 30px;
}

.nnm_focus-intro_list-el {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 370px;
  height: 85px;
  border: 1px solid var(--color-border);
  text-align: center;
}

.nnm_focus-intro_list-el>p {
  font-size: 22px;
}

.nm_focus-lead {
  margin-top: min(150px, 8%);
}

.nm_focus-lead_inr {
  display: flex;
  justify-content: space-between;
  max-width: 820px;
  margin: auto;
  font-family: var(--font-family-serif);
  color: var(--color-text-white);
}

.nm_focus-lead_title {
  
}

.nm_focus-lead_title>span {
  font-size: 32px;
  font-weight: bold;
}

.nm_focus-lead_desc {
  
}

.nm_focus-lead_desc-inr {
  
}

.nm_focus-lead_desc p {
  font-size: 16px;
  line-height: 1.8;
}

.nm_focus-lead_desc p+p {
  margin-top: min(80px, 30%);
}

/* ====================
Faq
==================== */
.nm_flex-center.nm_flex-center--faq_conditioning {
  margin-top: min(80px, 10%);
}

/* PC */
@media screen and (min-width: 769px) {
  .nm_sec-heading_head.nm_sec-heading_head--select_plan > a:hover {
    text-decoration: underline;
  }
}

/* SP */
@media screen and (max-width: 768px) {
  /* ====================
  Total
  ==================== */
  .nm_conditioning-total_intro-sub {
    justify-content: center;
  }

  .nm_conditioning-total_intro-sub_inr {
    font-size: 13px;
    /* padding: 0 1em; */
  }

  .nm_conditioning-total_intro-sub_inr>br {
    display: block;
  }

  .nm_conditioning-total_intro-sub img {
    width: 14px;
    height: 14px;
  }

  .nm_conditioning-total_intro-desc {
    text-align: left;
  }

  .nm_conditioning-total_intro-desc>br {
    display: none;
  }

  /* ====================
  Step
  ==================== */
  .nm_conditioning-step_list {
    flex-direction: column;
    gap: 30px;
  }

  .nm_conditioning-step_el {
    width: 100%;
  }

  .nm_conditioning-step_title {
    font-size: 22px;
  }

  .nm_conditioning-step_sub {
    font-size: 16px;
    margin-top: .5em;
  }

  .nm_conditioning-step_desc {
    margin-top: 4%;
    padding-left: 40px;
    padding-right: calc(30px - 22px);
  }

  /* ====================
  Promise
  ==================== */
  /* .nm_conditioning-promise_list-wrap {} */

  .nm_conditioning-promise_inr {
    padding: min(30px, 6vw);
  }

  .nm_conditioning-promise_list {
    justify-content: center;
    width: 100%;
    flex-direction: column;
  }

  .nm_conditioning-promise_list-el {
    width: 100%;
    background-color: unset;
    padding: 0;
  }

  .nm_conditioning-promise_list+.nm_conditioning-promise_list,
  .nm_conditioning-promise_list-el:nth-child(n+2) {
    margin-top: 20px;
    padding: 20px 0 0 0;
    border-top: 1px solid var(--color-border-dark2);
  }

  .nm_conditioning-promise_list-lead {
    font-size: 14px;
    min-height: unset;
  }

  .nm_conditioning-promise_list-lead+p {
    font-size: 13px;
    margin-top: 1em;
  }

  /* ====================
  Plan
  ==================== */
  .nm_sec-heading_head--plan > br,
  .nm_conditioning-plan_heading-desc > br {
    display: block;
  }

  /* ====================
  Select
  ==================== */
  .nm_conditioning-select_top {
    position: relative;
    padding: 6%;
  }

  .nm_conditioning-select_lead {
    flex-direction: column;
    align-items: flex-start;
    /* position: relative; */
  }

  .nm_conditioning-select_lead.nm_conditioning-select_lead--dbl {
    gap: 65px
  }

  .nm_conditioning-select_time-wrap {
    position: absolute;
    top: 1em;
    right: 1em;
  }
  
  .nm_conditioning-select_time-wrap.nm_conditioning-select_time-wrap--dbl {
    flex-direction: column;
    gap: .5em;
  }

  .nm_conditioning-select_time.nm_conditioning-select_time--dbl {
    flex-direction: row;
    align-items: baseline;
    gap: 1em;
  }

  .nm_conditioning-select_no {
    width: 56px;
  }

  .nm_conditioning-select_title {
    font-size: 18px;
  }

  .nm_conditioning-select_title > br {
    display: none;
  }

  .nm_conditioning-select_time {
    padding: 8px;
  }

  .nm_conditioning-select_time-total {
    font-size: 14px;
  }

  .nm_conditioning-select_time-total > span {
    font-size: 24px;
  }

  .nm_conditioning-select_time--dbl .nm_conditioning-select_time-total > span {
    font-size: 24px;
  }

  .nm_conditioning-select_time-case > span {
    font-size: 20px;
    margin-bottom: 0;
  }

  .nm_conditioning-select_plan {
    padding: 6%;
  }

  .nm_sec-heading_head.nm_sec-heading_head--select_plan {
    font-size: 24px;
  }

  .nm_conditioning-select_plan-list {
    flex-direction: column;
    align-items: center;
  }

  .nm_conditioning-select_plan-el {
    width: 100%;
    border-left: unset;
    border-right: unset;
    max-width: 500px;
    margin-bottom: 0;
    padding: 24px 0 0;
    gap: 1em;
  }

  .nm_conditioning-select_plan-el:first-child {
    padding-top: 0;
  }

  .nm_conditioning-select_plan-el:nth-child(n+2) {
    margin-top: 24px;
    border-top: 1px solid var(--color-border-dark);
  }

  .nm_conditioning-select_plan-desc {
    min-height: unset;
    font-size: 14px;
  }

  /* ====================
  Treatment
  ==================== */
  .nm_conditioning-select_plan-treatment {
    max-width: 330px;
    width: 100%;
    margin: auto;
  }

  .nm_conditioning-select_plan.nm_conditioning-select_plan--treatment {
    padding: 6% 4%;
  }

  .nm_conditioning-select_treatment-list {
    gap: 2em 8px;
  }

  .nm_conditioning-select_treatment-el {
    /* width: 104px; */
    width: 31%;
  }

  .nm_conditioning-select_treatment-btn {
    border-radius: 12px;
  }

  .nm_conditioning-select_treatment-btn > img {
    width: 24px;
  }

  .nm_conditioning-select_treatment-name > br {
    display: block;
  }

  .nm_conditioning-select_treatment-desc {
    margin-top: 2em;
  }

  .nm_conditioning-select_treatment-desc > br {
    display: none;
  }

  .nm_conditioning-select_treatment-note {
    margin-top: 2em;
  }

  /* ====================
  Trial
  ==================== */
  .nm_conditioning-trial_bnr {
    max-width: 500px;
    margin: 6% auto 0;
  }

  /* ====================
  About Plan
  ==================== */
  .nm_conditioning-about_plan-note > br {
    display: none;
  }

  .nm_conditioning-about_plan-note,
  .nm_conditioning-plan_btn-wrap {
    margin-top: 3em;
  }

  .nm_conditioning-plan_btn-wrap.nm_conditioning-plan_btn-wrap--focus > a {
    max-width: 380px;
    width: 100%;
  }

  /* ====================
  Focus Treatment
  ==================== */
  .nm_focus-wrap {
    padding: 0 6% min(100px, 12%);
  }

  .nnm_focus-intro_inr {
    padding: min(50px, 9%) 0 0;
  }

  .nnm_focus-intro_title {
    font-size: 20px;
  }

  .nnm_focus-intro_list {
    gap: 1em;
  }

  .nnm_focus-intro_list-el {
    width: min(400px, 100%);
    height: 70px;
  }

  .nnm_focus-intro_list-el>p {
    font-size: 16px;
  }

  .nm_focus-lead_title>span {
    font-size: 22px;
  }

  .nm_focus-lead {
    margin-top: min(60px, 16%);
  }

  .nm_focus-lead_inr {
    flex-direction: column;
    grid-template-columns: 1fr;
    max-width: 500px;
    gap: 3em;
  }

  .nm_focus-lead_desc {
    display: flex;
    justify-content: flex-end;
  }

  .nm_focus-lead_desc p+p {
    margin-top: 2em;
  }
}