@charset "UTF-8";

#sub__visual.collaju-test-visual .visual__img {
  background: url('/sub/sub-7/collaju/hero.webp') center 38% / cover no-repeat;
}

.collaju-test-wrap {
  background: #f7f6f3;
  color: #222;
  padding-bottom: 170px;
}

.collaju-test-wrap img { max-width: 100%; }
.collaju-test-wrap .information-section { padding-top: 60px; }
.collaju-test-wrap .information-item-title { font-weight: 400; }
.collaju-test-wrap .information-item-desc { display: block; margin-top: 5px; }

.collaju-product,
.collaju-balance,
.collaju-effect,
.collaju-recommend {
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
}

.collaju-product { margin-top: 145px; margin-bottom: 190px; }
.collaju-product .title-box-description-sub { max-width: 860px; margin-left: auto; margin-right: auto; }
.collaju-product-grid {
  display: grid;
  grid-template-columns: 650px minmax(0, 1fr);
  gap: 70px;
  align-items: center;
  padding-right: 130px;
}
.collaju-product-image { width: 100%; }
.collaju-product-image img { display: block; width: 100%; height: auto; }
.collaju-product-features { display: grid; gap: 24px; }
.collaju-feature { border-top: 1px solid #d5d1cc; padding-top: 17px; }
.collaju-feature:first-child { border-top: 0; padding-top: 0; }
.collaju-feature h3 { font-size: 25px; font-weight: 400; line-height: 1.35; margin-bottom: 9px; letter-spacing: -.04em; }
.collaju-feature p { font-size: 16px; line-height: 1.85; letter-spacing: -.025em; word-break: keep-all; }

.collaju-balance { margin-bottom: 200px; }
.collaju-section-intro { text-align: center; max-width: 820px; margin: 0 auto 75px; }
.collaju-section-intro h2 { font-size: 36px; font-weight: 400; letter-spacing: -.045em; line-height: 1.4; margin-bottom: 23px; }
.collaju-section-intro p { font-size: 16px; line-height: 1.9; word-break: keep-all; }
.collaju-skin-sequence { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.collaju-skin-frame { aspect-ratio: 634 / 285; background-image: url('/sub/sub-7/collaju/skin-sequence.png'); background-size: 100% auto; background-repeat: no-repeat; }
.collaju-skin-frame.stage-one { background-position: center top; }
.collaju-skin-frame.stage-two { background-position: center 47%; }
.collaju-skin-frame.stage-three { background-position: center bottom; }

.collaju-effect {
  display: grid;
  grid-template-columns: 540px minmax(0, 1fr) minmax(0, 1fr);
  gap: 52px;
  align-items: start;
  margin-bottom: 190px;
  padding-right: 130px;
}
.collaju-effect-image { width: 100%; height: 520px; overflow: hidden; border-radius: 30px; }
.collaju-effect-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.collaju-effect-column:last-child { border-left: 1px solid #d5d1cc; padding-left: 42px; }
.collaju-effect-column h2 { font-size: 29px; font-weight: 400; line-height: 1.3; letter-spacing: -.04em; min-height: 90px; margin-bottom: 25px; }
.collaju-effect-item { margin-bottom: 28px; }
.collaju-effect-item b { display: block; font-size: 16px; font-weight: 400; margin-bottom: 8px; }
.collaju-effect-item p { font-size: 15px; line-height: 1.75; letter-spacing: -.025em; word-break: keep-all; }

.collaju-recommend .title-box-description-sub { margin-bottom: 55px; }
.collaju-recommend .recommand-wrapper { padding-right: 130px; }
.collaju-disclaimer { color: #777; font-size: 13px; line-height: 1.6; text-align: center; margin: 85px 0 0; }

@media (min-width: 769px) {
  .collaju-recommend .recommand-wrapper-item { padding-left: 32px; padding-right: 32px; }
  .collaju-recommend .recommand-wrapper-item-desc { word-break: keep-all; }
}

@media (max-width: 1500px) {
  .collaju-product,
  .collaju-balance,
  .collaju-effect,
  .collaju-recommend { max-width: 1400px; }
  .collaju-product-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 45px; }
  .collaju-effect { grid-template-columns: 38% minmax(0, 1fr) minmax(0, 1fr); gap: 35px; }
  .collaju-effect-column:last-child { padding-left: 30px; }
}

@media (max-width: 900px) {
  .collaju-product-grid { grid-template-columns: 1fr; }
  .collaju-product-image { max-width: 650px; }
  .collaju-effect { grid-template-columns: 1fr 1fr; }
  .collaju-effect-image { grid-column: 1 / -1; height: auto; aspect-ratio: 2.3 / 1; }
}

@media (max-width: 768px) {
  #sub__visual.collaju-test-visual .visual__img { background-position: center 30%; }
  .collaju-test-wrap { padding-bottom: 22vw; }
  .collaju-test-wrap .information-section { padding: 3.125vw 0 9.375vw; }
  .collaju-test-wrap .information-item-title { font-size: 3.9vw; }
  .collaju-test-wrap .information-item-desc { font-size: 3.1vw; margin-top: 1vw; }
  .collaju-test-wrap .information-item { padding-right: 2vw; }
  .collaju-product,
  .collaju-balance,
  .collaju-effect,
  .collaju-recommend { margin-left: 4.685vw; margin-right: 4.685vw; }
  .collaju-product { margin-top: 16vw; margin-bottom: 19vw; }
  .collaju-product .title-box-description-sub { margin-bottom: 10vw; }
  .collaju-product-grid { display: block; }
  .collaju-product-grid { padding-right: 0; }
  .collaju-product-image { margin-bottom: 9vw; }
  .collaju-product-features { gap: 5vw; }
  .collaju-feature { padding-top: 4vw; }
  .collaju-feature h3 { font-size: 4.4vw; margin-bottom: 2vw; }
  .collaju-feature p { font-size: 3.2vw; line-height: 1.75; }
  .collaju-balance { margin-bottom: 19vw; }
  .collaju-section-intro { margin-bottom: 8vw; }
  .collaju-section-intro h2 { font-size: 5vw; line-height: 1.45; margin-bottom: 3vw; }
  .collaju-section-intro p { font-size: 3.2vw; line-height: 1.7; }
  .collaju-skin-sequence { grid-template-columns: 1fr; gap: 3vw; }
  .collaju-skin-frame { aspect-ratio: 634 / 285; }
  .collaju-effect { display: block; margin-bottom: 19vw; }
  .collaju-effect { padding-right: 0; }
  .collaju-effect-image { aspect-ratio: 2 / 1; height: auto; border-radius: 5vw; margin-bottom: 9vw; }
  .collaju-effect-column { margin-bottom: 10vw; }
  .collaju-effect-column:last-child { border-left: 0; border-top: 1px solid #d5d1cc; padding-left: 0; padding-top: 8vw; }
  .collaju-effect-column h2 { font-size: 5vw; min-height: 0; margin-bottom: 6vw; }
  .collaju-effect-column h2 br { display: none; }
  .collaju-effect-item { margin-bottom: 5vw; }
  .collaju-effect-item b { font-size: 3.3vw; margin-bottom: 1vw; }
  .collaju-effect-item p { font-size: 3.2vw; line-height: 1.7; }
  .collaju-recommend .title-box-description-sub { margin-bottom: 7vw; }
  .collaju-recommend .recommand-wrapper { display: block; margin-bottom: 0; padding: 0; }
  .collaju-recommend .recommand-wrapper-item,
  .collaju-recommend .recommand-wrapper-item:nth-child(even) {
    box-sizing: border-box;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    column-gap: 12px;
    align-items: start;
    width: 100%;
    border-left: 0;
    border-top: 1px solid #d5d1cc;
    padding: 20px 0;
  }
  .collaju-recommend .recommand-wrapper-item:last-child { border-bottom: 1px solid #d5d1cc; }
  .collaju-recommend .recommand-wrapper-item-number { grid-column: 1; grid-row: 1 / span 2; padding: 0; font-size: 17px; line-height: 1.5; }
  .collaju-recommend .recommand-wrapper-item-title { grid-column: 2; padding: 0 0 6px; font-size: 17px; line-height: 1.5; }
  .collaju-recommend .recommand-wrapper-item-desc { grid-column: 2; font-size: 14px; line-height: 1.55; word-break: keep-all; }
  .collaju-disclaimer { font-size: 2.8vw; margin: 10vw 1vw 0; }
}

/* The site's global desktop reset disables selection on every element. */
body.sub-7.sub-9 #sub__visual *,
body.sub-7.sub-9 .collaju-test-wrap * {
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
  user-select: text !important;
}

/* Keep the shared footer visible on this preview before its scroll animation runs. */
body.sub-7.sub-9 .ft__clinic,
body.sub-7.sub-9 .ft__equipment .equip__title > *,
body.sub-7.sub-9 .ft__equipment .equip__swiper,
body.sub-7.sub-9 .ft__visual video {
  opacity: 1 !important;
  transform: none !important;
}
