/* Reported imported pictures: Bootstrap .hidden otherwise wins on desktop. */
@media screen and (min-width: 768px) {
  :is(.post-slug-skincare, .post-slug-beauty, .post-slug-5times, .post-slug-demerit) .post-content picture.hidden[class~="sm:block"] {
    display: block !important;
  }
}
.post-slug-trial .cnt_main h1 > span {
  display: inline;
  font-size: inherit;
  line-height: inherit;
}
@media screen and (max-width: 767px) {
  .post-slug-trial .cnt_main .text {
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
  }
  .post-slug-trial .cnt_main h1 > span {
    display: block;
  }
}
/* Keep list counters below the existing gradient overlay on desktop and mobile. */
.clinic-template-shibuya .post-content .js-index-liset-block.close .js-button-block {
  z-index: 3;
}
@media screen and (max-width: 767px) {
  .post-slug-zoskin .post-content #anc_11 + div + table {
    table-layout: fixed;
  }
  .post-slug-chemical-peeling .post-content section:has(#anc_31) .flex.flex-col {
    flex-direction: column;
  }
  /* Align list markers with the first text line and indent wrapped lines. */
  .clinic-template-shibuya .post-content :is(ul.disc, ul.disc_s, ul.disc_ss) > li {
    position: relative;
    margin-left: 0;
    padding-left: 1em;
  }
  .clinic-template-shibuya .post-content :is(ul.disc, ul.disc_s, ul.disc_ss) > li::before {
    position: absolute;
    left: 0;
    top: 0;
    width: auto;
    font-size: 1em;
    line-height: inherit;
  }
  :is(.post-slug-beginner, .post-slug-wrinkle, .post-slug-kuma, .post-slug-ruddyface, .post-slug-botox, .post-slug-hyaluronic, .post-slug-cosmetics) .post-content .text_center > picture > img {
    margin-left: auto;
    margin-right: auto;
  }
  .post-slug-isotretinoin .post-content #anc_price ~ .text_center + .text_center {
    margin-top: 20px !important;
  }
  .post-slug-cosmetics .post-content .col2_img_text_s > li > p + .text_center {
    padding-top: 20px;
  }
  :is(.post-slug-skincare, .post-slug-beauty) .post-content picture.hidden[class~="sm:block"] {
    display: none !important;
  }
  :is(.post-slug-laser, .post-slug-photo-sr, .post-slug-toning, .post-slug-babycollagen, .post-slug-botox) .post-content .table_price {
    table-layout: fixed;
    width: 100%;
  }
  :is(.post-slug-laser, .post-slug-photo-sr, .post-slug-toning, .post-slug-babycollagen, .post-slug-botox) .post-content .table_price th {
    white-space: normal;
    overflow-wrap: anywhere;
  }
  :is(.post-slug-pores) .post-content .shibuya-table-scroll {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  :is(.post-slug-pores) .post-content .shibuya-table-scroll > table {
    min-width: 600px;
  }
}
/* No.26: leave space between the achievement text and clinic photo on desktop. */
@media (min-width: 768px) {
  .post-slug-mens-acne .post-content section:has(.js-clinic-overview-slider-mensacne) :is(.sm\:col-span-5, .sm\:col-span-7) {
    grid-column: span 6 / span 6;
  }
}
@media screen and (max-width: 350px) {
  .post-slug-trial .cnt_main .text {
    padding-left: 8px;
    padding-right: 8px;
  }
}

/* Preserve the old site's explicit image-centering intent on Shibuya desktop pages.
 * Tailwind's block images do not follow a parent's text-align:center. */
@media screen and (min-width: 1024px) {
  .clinic-template-shibuya .post-content :is(.text_center, .text-center) > img,
  .clinic-template-shibuya .post-content :is(.text_center, .text-center) > picture > img,
  .clinic-template-shibuya .post-content :is(.text_center, .text-center) > a > img,
  .clinic-template-shibuya .post-content :is(.text_center, .text-center) > a > picture > img,
  .clinic-template-shibuya .post-content :is(.price_box, .price_box_white) > li > picture > img,
  .clinic-template-shibuya .post-content .th_td_center :is(td, th) > picture > img,
  .clinic-template-shibuya .post-content .yt_video > .img > picture > img {
    margin-left: auto;
    margin-right: auto;
  }
}

/* 渋谷院のみ。PC・開いた会話画面には適用しない。 */
@media (max-width: 767px) {
 body.clinic-template-shibuya .wc-webchat-ctn.wc-close.upward.close_type_005 {
   width: calc(100% - 24px) !important;
   max-width: 360px;
   right: 12px !important;
   bottom: 78px !important;
 }
}

/* スマホの予約枠を現渋谷サイトのレイアウトへ合わせる */
@media (max-width: 767px) {
 body.clinic-template-shibuya footer .bottom > .content_wrap {
   padding-left: 0;
   padding-right: 0;
 }
 body.clinic-template-shibuya footer .bottom .wrap .l ul.box li a {
   background-image: url("../../img/shibuya/common/icon_mail01_white.png");
   background-size: 37px 25px;
   background-position: center top 38px;
 }
}

/* Shared repair for Shibuya content only; leave global header/footer alone. */
.clinic-template-shibuya .post-content {
  --shibuya-rem: 16px;
}
@media (max-width: 767px) {
  .clinic-template-shibuya .post-content {
    --shibuya-rem: 3.73333vw;
  }
}
/* The legacy reset sets border-style:none on anchors. Restore visible CTA edges. */
.clinic-template-shibuya .post-content a.rounded-full,
.clinic-template-shibuya .post-content :is(a.btn_white, a.btn_white_s, a.btn_white_l, a.btn_more, a.btn_red, a.btn_pdf, a.btn_100p) {
  border: 1px solid currentColor;
}
/* Pink-filled CTAs need no visible outline; preserve the white inline variant. */
.clinic-template-shibuya .post-content a.btn_100p:not([style*="background"]) {
  border-color: transparent;
}
/* Adjacent legacy CTA blocks must have a gap and a consistent content width. */
.clinic-template-shibuya .post-content :is(.text_center, .btn):has(> :is(a.btn_red, a.btn_white, a.btn_100p)):has(+ .btn > a.btn_100p),
.clinic-template-shibuya .post-content :is(.text_center, .btn):has(> :is(a.btn_red, a.btn_white, a.btn_100p)) + .btn:has(> a.btn_100p) {
  width: 100%;
  max-width: 750px;
  margin-left: auto;
  margin-right: auto;
}
.clinic-template-shibuya .post-content :is(.text_center, .btn):has(> :is(a.btn_red, a.btn_white, a.btn_100p)):has(+ .btn > a.btn_100p) > a {
  width: 100%;
  padding-left: 40px;
  padding-right: 40px;
}
.clinic-template-shibuya .post-content :is(.text_center, .btn):has(> :is(a.btn_red, a.btn_white, a.btn_100p)) + .btn:has(> a.btn_100p):not([class*="mt"]):not([style*="margin-top"]) {
  margin-top: 30px;
}
/* Preserve spacing before detail tables when imported column blocks end in mb00. */
.clinic-template-shibuya .post-content .shibuya-access-media {
  margin-bottom: 40px;
}
.clinic-template-shibuya .post-content :is(ul.col2_img_text_ss, ul.col2_img_text, ul.col2_text_img) + table {
  margin-top: 40px;
}
@media (max-width: 767px) {
  .clinic-template-shibuya .post-content :is(.text_center, .btn):has(> :is(a.btn_red, a.btn_white, a.btn_100p)) + .btn:has(> a.btn_100p):not([class*="mt"]):not([style*="margin-top"]) {
    margin-top: 20px;
  }
  .clinic-template-shibuya .post-content .shibuya-access-media {
    margin-bottom: 30px;
  }
  .clinic-template-shibuya .post-content :is(ul.col2_img_text_ss, ul.col2_img_text, ul.col2_text_img) + table {
    margin-top: 30px;
  }
}

/* Imported symptom pills need space between wrapped rows. */
.clinic-template-shibuya .post-content p:has(> span.rounded-full.inline-block) {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 8px 4px;
}
/* The three Medicacell feature illustrations are icons, not content-width photos. */
.clinic-template-shibuya .post-content div.flex:has(> div > picture > img[src*="page_acne_scars_medicacell__medicacell_ic_"]) {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  align-items: start;
  gap: 20px;
}
.clinic-template-shibuya .post-content picture:has(> img[src*="page_acne_scars_medicacell__medicacell_ic_"]) {
  width: 80px;
  height: 80px;
  margin: 0;
}
.clinic-template-shibuya .post-content img[src*="page_acne_scars_medicacell__medicacell_ic_"] {
  width: 80px;
  height: 80px;
  object-fit: contain;
}
@media (max-width: 767px) {
  .clinic-template-shibuya .post-content div.flex:has(> div > picture > img[src*="page_acne_scars_medicacell__medicacell_ic_"]) {
    gap: 16px;
  }
}

/* Restore the missing spacing between the seven acne-cause cards only. */
.clinic-template-shibuya .post-content section:has(#anc_acne_mechanism) > div > div:last-child > div:has(> h3[id^="acne-cause-"]) {
  margin-top: 48px;
}
@media (max-width: 767px) {
  .clinic-template-shibuya .post-content section:has(#anc_acne_mechanism) > div > div:last-child > div:has(> h3[id^="acne-cause-"]) {
    margin-top: 32px;
  }
}

/* Spacing for the updated Therma CPT content; keep existing columns and assets. */
.clinic-template-shibuya.post-slug-therma-cpt .post-content .content_wrap > h4.h4_red {
  margin-top: 40px;
  margin-bottom: 20px;
}
.clinic-template-shibuya.post-slug-therma-cpt .post-content #anc_1 + ul > li > p + p {
  margin-top: 20px;
}
.clinic-template-shibuya.post-slug-therma-cpt .post-content #anc_5 + p,
.clinic-template-shibuya.post-slug-therma-cpt .post-content .content_wrap > table + p {
  margin-top: 20px;
  margin-bottom: 20px;
}
@media (max-width: 767px) {
  .clinic-template-shibuya.post-slug-therma-cpt .post-content .content_wrap > h4.h4_red {
    margin-top: 30px;
    margin-bottom: 15px;
  }
}

/* Keep the acne overview in normal mobile flow and its table bullets inside cells. */
@media (max-width: 767px) {
  .post-slug-acne .post-content div.font-header:has(> div > .js-clinic-overview-counter) {
    top: auto;
    left: auto;
    transform: none;
    translate: none;
  }
  .post-slug-acne .post-content .acne-part-table td > ul.list-disc {
    padding-left: 1.35em;
    list-style-position: outside;
  }
}

/* Keep the depilation overview in normal flow on mobile Safari. */
@media (max-width: 767px) {
  .post-slug-depilation .post-content div.font-header:has(> div > .js-clinic-overview-counter) {
    top: auto;
    left: auto;
    transform: none;
    translate: none;
  }
}

/* The legacy .hidden !important rule must not suppress the desktop device overview. */
@media (min-width: 768px) {
  .post-slug-depilation .post-content div.hidden[class~="sm:block"] {
    display: block !important;
    /* Allow 30cqw for the 15cqw circles at 75%, plus rounding/breakpoint clearance. */
    min-height: 31cqw;
  }
}

/* No.54: keep arrows and dots on one row below the chromolite cases. */
.post-slug-chromolite #shibuya-chromolite-cases {
  padding-bottom: 64px;
}
.post-slug-chromolite #shibuya-chromolite-cases .splide__arrow {
  top: auto;
  bottom: 0;
  width: 40px;
  height: 40px;
  transform: none;
}
.post-slug-chromolite #shibuya-chromolite-cases .splide__arrow--prev {
  left: 0;
}
.post-slug-chromolite #shibuya-chromolite-cases .splide__arrow--next {
  right: 0;
}
.post-slug-chromolite #shibuya-chromolite-cases .splide__pagination {
  bottom: 0;
  left: 48px;
  right: 48px;
  height: 40px;
  padding: 0;
  margin: 0;
  align-items: center;
}
.post-slug-chromolite #shibuya-chromolite-cases .splide__pagination > li {
  display: flex;
  align-items: center;
}
.post-slug-chromolite #shibuya-chromolite-cases .splide__pagination__page {
  display: block;
  top: auto;
  bottom: auto;
}
.post-slug-chromolite #shibuya-chromolite-cases .splide__track {
  padding-bottom: 0;
}
.post-slug-chromolite #shibuya-chromolite-cases .chromolite-case-layout {
  padding-bottom: 0;
}
