/* v2.0 · Screenshot-inspired editorial direction. Homepage only. */
@import url("refinement.css");
@import url("fonts/fonts.css?v=2.11");

:root {
  --oc-ink: #472b1d;
  --oc-body: #5b4b3e;
  --oc-gold: #967552;
  --oc-line: #d9c8b6;
  --oc-cream: #eee5d9;
  --oc-paper: #f8f2e9;
  --oc-green: #4d6049;
  --oc-serif: "Shippori Mincho", "Yu Mincho", serif;
  --oc-sans: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", sans-serif;
  --oc-display: "Cormorant Garamond", Georgia, serif;
}
html { scroll-padding-top: 16px; }
body { background: var(--oc-paper); font-family: var(--oc-serif); font-weight: 400; }
body::selection { background: #e0c4a5; color: var(--oc-ink); }
#header { position: relative; top: auto; left: auto; background: #f8f2e9; box-shadow: none; border-bottom-color: #d9c8b699; }
body > main { margin-top: 0; }
#header #menu_btn { position: absolute; }
#header #menu_btn.active { position: fixed; }
#header h1 { color: #7f7263; font-family: var(--oc-sans); }
#nav li a { font-size: 12px; font-weight: 500; letter-spacing: .12em; }
#nav li a:hover { color: #aa7850; }
#nav .sub-menu { background: var(--oc-paper); }
.oc-editorial { display: block; }
.un_fv { max-width: 1520px; margin-inline: auto; isolation: isolate; }
.un_fv_content { padding: 52px 40px 50px 60px; background: transparent; }
.oc-editorial-title { margin-bottom: 27px; color: var(--oc-ink); }
.oc-editorial-title .oc-wordmark,
.oc-editorial-title em { display: block; font-family: var(--oc-display); font-size: clamp(65px,6.9vw,108px); font-weight: 500; line-height: .87; letter-spacing: -.065em; white-space: nowrap; }
.oc-editorial-title em { font-style: italic; letter-spacing: -.048em; margin-top: 8px; }
.oc-title-rule { display: block; height: 9px; width: 114px; margin: 24px 0 0 5px; border-top: 1px solid var(--oc-gold); border-radius: 50%; transform: rotate(-5deg); }
.un_fv_headText_en { font-size: 15px; color: #806448; letter-spacing: .1em; }
.un_fv_headText_jp { margin-top: 10px; font-size: 12px; line-height: 1.95; color: #6f6050; letter-spacing: .05em; }
.un_fv_text { margin-top: 24px; font-size: clamp(26px,2.5vw,37px); font-weight: 500; letter-spacing: .04em; line-height: 1.65; }
.un_fv_text span { font-size: 1.12em; font-weight: 500; }
.un_fv_text_02 { margin-top: 13px; font-size: 17px; color: #806448; letter-spacing: .06em; }
.un_fv_pointUnit { border-bottom: 0; padding-block: 15px 0; margin-block: 32px 0; }
.un_fv_point { padding-block: 0; }
.un_fv_point_number { font-family: var(--oc-sans); font-size: 9px; letter-spacing: .15em; }
.un_fv_point_number::after { font: 400 33px/1 var(--oc-display); padding-top: 3px; }
.un_fv_point_text { font-size: 12px; font-weight: 400; line-height: 1.7; margin-top: 7px; }
.un_fv_point_text span { white-space: nowrap; }
.un_fv_imgWrap { align-self: start; margin: 44px 48px 92px 28px; height: 622px; width: auto; min-width: 0; }
.un_fv_imgTrack { border-radius: 220px 220px 4px 4px; overflow: hidden; background: #e3d9c9; }
.un_fv_img { margin: 0; }
.un_fv_img img { object-fit: cover; object-position: 52% center; }
.un_fv_navigation { right: 14px; bottom: 20px; padding-right: 0; row-gap: 15px; }
.un_fv_numbers { row-gap: 16px; }
.un_fv_numbers li button:before { font: 400 19px/1 var(--oc-display); }
.un_fv_progress { height: 75px; }
.un_fv_scroll { display: none; }
.oc-postcard { position: absolute; left: -44px; bottom: -54px; width: 226px; margin: 0; padding: 10px 10px 12px; background: #fffaf3; box-shadow: 0 7px 18px #4e38281b; transform: rotate(-7deg); z-index: 3; }
.oc-postcard img { width: 100%; height: 137px; object-fit: cover; margin: 0; }
.oc-postcard figcaption { font: italic 400 25px/1 var(--oc-display); color: #74543a; text-align: center; padding-top: 10px; }
.oc-postcard figcaption span { display: block; font: 400 8px/1.4 var(--oc-sans); letter-spacing: .21em; margin-top: 4px; }
.oc-photo-seal { position: absolute; top: 13px; right: -18px; width: 112px; height: 112px; background: var(--oc-paper); border: 1px solid #baa183; outline: 5px solid var(--oc-paper); border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; transform: rotate(12deg); z-index: 3; }
.oc-photo-seal span { font: 400 8px/1.8 var(--oc-sans); letter-spacing: .16em; }
.oc-photo-seal em { font: italic 400 30px/1.1 var(--oc-display); }
.hero_title { background: #eae0d2; border: none; }
.hero_title p { font-size: 18px; font-weight: 400; color: #735b3f; letter-spacing: .12em; padding: 28px 20px; }
.un_feature { position: relative; background: var(--oc-paper); padding: 114px 60px 128px; overflow: hidden; }
.un_feature_item { max-width: 1190px; gap: 7%; align-items: center; position: relative; z-index: 1; }
.un_feature_img { width: 44%; height: auto; padding: 10px; background: #fffcf7; transform: rotate(-3deg); box-shadow: 0 6px 16px #4e382812; }
.un_feature_content { width: 49%; }
.un_feature_heading { font-size: 25px; line-height: 1.9; letter-spacing: .035em; }
.un_feature_heading:before { content: "Our philosophy"; font: italic 400 clamp(46px,5vw,72px)/.95 var(--oc-display); color: var(--oc-ink); letter-spacing: -.045em; margin-bottom: 25px; }
.un_feature_text { font-size: 14px; line-height: 2.15; color: #695a4b; }
.un_feature::after { content: "❦"; position: absolute; font: 180px/1 Georgia,serif; color: #b4a282; opacity: .35; right: -10px; bottom: -25px; transform: rotate(-28deg); }
.un_treatment { margin-top: 0; padding-top: 72px; background: #f1e9de; }
.el_heading { color: var(--oc-ink); font-family: var(--oc-serif); font-size: 24px; letter-spacing: .1em; font-weight: 500; row-gap: 14px; }
.el_heading::before { font: italic 400 76px/.9 var(--oc-display); color: var(--oc-ink); letter-spacing: -.04em; }
.un_treatment > .el_heading::before { content: "Treatment"; }
.un_treatment_itemUnit { max-width: 1280px; padding: 0 52px 80px; margin-top: 75px; row-gap: 100px; }
.un_treatment_item { position: relative; align-items: flex-start; gap: 7%; }
.un_treatment_item_content { width: 46.5%; }
.un_treatment_item_head { border-top: 0; border-bottom-color: #c8b297; padding-top: 0; padding-bottom: 24px; position: relative; }
.un_treatment_item_head::before { display: block; content: "0" counter(number); font: 400 94px/.9 var(--oc-display); color: #b49575; letter-spacing: -.045em; margin-bottom: 22px; }
.un_treatment_headingLv3 { color: #6c472f; font-size: 23px; letter-spacing: .025em; }
.un_treatment_headingLv4 { color: var(--oc-ink); font-size: 24px; line-height: 1.85; margin-top: 14px; letter-spacing: .035em; }
.un_treatment_item_text { font-size: 14px; line-height: 2.12; letter-spacing: .035em; margin-top: 24px; }
.un_treatment_img { width: 46.5%; position: sticky; top: 115px; margin-top: 12px; border-radius: 150px 5px 5px 5px; }
.un_treatment_item:nth-of-type(2) .un_treatment_img { border-radius: 5px 150px 5px 5px; }
.el_button { color: #fff9ee; background: #67452e; border: 1px solid #67452e; border-radius: 999px; min-height: 46px; padding: 12px 28px; font-size: 12px; font-family: var(--oc-sans); letter-spacing: .08em; display: flex; gap: 28px; }
.el_button::after { content: "→"; font: 400 18px/1 var(--oc-sans); }
.el_button:hover { background: #8d6745; border-color: #8d6745; }
.un_treatment_button { margin-top: 26px; }
.un_treatment_recommendWrap { margin-top: 36px; border: none; }
.un_treatment_recommend { background: #fbf6ed; padding: 24px 24px 18px; margin-top: 0; border: 1px solid #dfcfba; }
.un_treatment_recommend_title { text-align: left; color: #725536; font-size: 17px; line-height: 1.7; letter-spacing: .04em; }
.un_treatment_recommend_title.accordion_title { color: #fff; font-size: 18px; font-weight: 500; padding: 18px 60px 18px 20px; min-height: 66px; }
.un_treatment_recommend_content { margin-top: 12px; }
.un_treatment_recommend_list { row-gap: 0; }
.un_treatment_recommend_listItem { background: none; border-bottom: 1px solid #e5d8c5; font-size: 13px; padding: 12px 0; grid-template-columns: 28px 1fr; align-items: center; }
.un_treatment_recommend_listItem:last-child { border-bottom: 0; }
.un_treatment_recommend_listItem::before { font: 400 21px/1 var(--oc-display); color: #a18765; }
.un_treatment_listWrap { margin-top: 0; padding: 62px 50px; background: #e6dccd; }
.un_treatment_list { gap: 16px; }
.un_treatment_listItem a { padding: 22px 16px; border: none; background: #f8f2e9; box-shadow: none; }
.un_treatment_listImg { width: 55px; margin-right: 15px; }
.un_treatment_listHeading { color: #694b34; font-size: 17px; font-weight: 500; }
.un_treatment_listText { font-size: 12px; line-height: 1.9; }
.un_docter { max-width: 1270px; padding: 116px 52px; gap: 7%; align-items: center; }
.un_docter_head { border-top: none; padding-top: 0; padding-bottom: 25px; }
.un_docter_head .el_heading { justify-items: start; }
.un_docter_head .el_heading::before { content: "Our dentists"; font-size: 70px; }
.un_docer_heading { color: var(--oc-ink); font: 500 24px/1.8 var(--oc-serif); letter-spacing: .1em; }
.un_docer_heading::before { content: "Our dentists"; display: block; font: italic 400 70px/.95 var(--oc-display); color: var(--oc-ink); letter-spacing: -.04em; margin-bottom: 18px; }
.un_docter_catch { font-size: 23px; line-height: 1.9; }
.un_docter_text { font-size: 14px; line-height: 2.1; }
.un_docter_img { width: 44%; height: auto; padding: 8px; background: #fffbf5; box-shadow: 0 7px 18px #4e382814; transform: rotate(2deg); }
.un_docter_button { margin-top: 26px; }
.un_column { padding: 76px 52px; background: #eee4d7; }
.un_column .el_heading::before { content: "Journal"; }
.un_column_postUnit { gap: 23px; margin-top: 45px; }
.un_column_post { background: transparent; border: 0; padding: 0; }
.un_column_thumb img { border-radius: 4px; }
.un_column_title { margin-top: 17px; color: #523922; font-size: 14px; line-height: 1.9; font-weight: 500; }
.un_column_more { color: #876341; font-size: 11px; letter-spacing: .1em; }
.un_column_button { margin-top: 40px; }
.bl_footer_head { background: #735535; color: #fff5e5; padding: 72px 50px; }
.bl_footer_head .el_heading { color: #fff5e5; }
.bl_footer_head .el_heading::before { content: "Reservation"; color: #f0dac0; }
.bl_footer_head_text { color: #f6e7d4; font-size: 14px; font-weight: 400; }
.bl_footer_headWrap { gap: 34px; grid-template-columns: 1fr 46%; align-items: start; }
.bl_footer_headWrap li a { border-radius: 50px; font-size: 14px; padding: 15px; }
.bl_footer_headWrap li:nth-child(1) a { background: #f2e5d0; color: #5f4027; border-color: #f2e5d0; }
.bl_footer_headWrap li:nth-child(2) a,.bl_footer_headWrap li:nth-child(3) a { background: transparent; color: #fff5e5; border-color: #aa8a65; }
.bl_footer_headWrap li:nth-child(4) a { background: #465640; border-color: #8a927b; }
.bl_footer_body { background: #eee5d8; }
.bl_footer_body_wrap dt { color: #715132; }
.bl_footer_body_wrap dd { font-size: 14px; }
.bl_footer_insta { background: var(--oc-paper); }
.bl_footer > .el_heading::before { content: "Our clinics"; }
.footer_clinic { background: var(--oc-paper); }
.footer_clinic-name { color: #64492f; }
.footer_clinic-link a { color: #705339; }
.bl_footer_copy { background: #e7ddce; color: #71604c; padding-bottom: 86px; }
.footer-area { border-top-color: #c3ad90; box-shadow: 0 -3px 15px #44322008; }
.footer-area .item:nth-child(1) { background: #624229; }
.footer-area .item:nth-child(2) { background: #e6d8c3; }
.footer-area .item:nth-child(3) { background: #f4eadd; }
.footer-area .item:nth-child(4) { background: #4d6049; }
.footer-area a { font-family: var(--oc-sans); letter-spacing: .08em; }
@media (min-width: 1440px) {
  .un_fv_content { padding-left: 80px; }
  .un_fv_imgWrap { height: 666px; margin-right: 70px; }
}
@media (min-width: 769px) and (max-width: 1024px) {
  .un_fv_content { padding: 42px 24px 36px 34px; }
  .oc-editorial-title .oc-wordmark,.oc-editorial-title em { font-size: 64px; }
  .un_fv_imgWrap { margin: 55px 35px 80px 5px; height: 565px; }
  .un_fv_text { font-size: 26px; }
  .un_fv_text_02 { font-size: 14px; }
  .un_fv_point_text { font-size: 10px; }
  .oc-postcard { width: 180px; left: -23px; }
  .oc-postcard img { height: 110px; }
  .oc-photo-seal { width: 87px; height: 87px; right: -15px; }
  .oc-photo-seal em { font-size: 25px; }
  .un_feature { padding: 90px 36px; }
  .un_feature_heading::before { font-size: 49px; }
  .un_feature_heading { font-size: 21px; }
  .un_treatment_itemUnit { padding-inline: 36px; }
  .un_treatment_img { position: static; width: 100%; max-width: 600px; }
  .un_treatment_item_content { width: 100%; }
  .un_docter_head .el_heading::before { font-size: 57px; }
  .un_docer_heading::before { font-size: 57px; }
  .un_docter_content { width: 100%; }
  .un_docter_img { width: 100%; }
}
@media (max-width: 768px) {
  #header { min-height: 76px; }
  #header h1 { font-size: 8px; line-height: 1.5; }
  .un_fv_content { padding: 32px 27px 24px; }
  .oc-editorial-title { margin-bottom: 23px; }
  .oc-editorial-title .oc-wordmark,.oc-editorial-title em { font-size: clamp(52px,17.2vw,67px); line-height: .86; }
  .oc-title-rule { margin-top: 19px; width: 95px; }
  .un_fv_headText_en { font-size: 13px; letter-spacing: .055em; }
  .un_fv_headText_jp { font-size: 11px; line-height: 1.9; margin-top: 8px; }
  .un_fv_text { margin-top: 21px; font-size: 28px; line-height: 1.65; }
  .un_fv_text_02 { font-size: 15px; letter-spacing: .035em; margin-top: 10px; }
  .un_fv_pointUnit { margin-top: 25px; padding-top: 13px; }
  .un_fv_point_number { font-size: 8px; }
  .un_fv_point_number::after { font-size: 28px; }
  .un_fv_point_text { font-size: 11px; line-height: 1.75; }
  .un_fv_imgWrap { margin: 24px 28px 86px 42px; width: auto; height: 420px; }
  .un_fv_imgTrack { border-radius: 170px 170px 3px 3px; }
  .un_fv_img img { height: 100%; object-fit: cover; }
  .oc-postcard { width: 162px; left: -15px; bottom: -50px; padding: 7px 7px 10px; }
  .oc-postcard img { height: 105px; }
  .oc-postcard figcaption { font-size: 22px; }
  .oc-postcard figcaption span { font-size: 7px; }
  .oc-photo-seal { width: 84px; height: 84px; right: -10px; top: 7px; }
  .oc-photo-seal em { font-size: 24px; }
  .oc-photo-seal span { font-size: 7px; }
  .un_fv_navigation { right: 12px; bottom: 14px; }
  .un_fv_progress { height: 58px; }
  .hero_title p { font-size: 13px; padding: 25px 18px; line-height: 2; letter-spacing: .06em; }
  .un_feature { padding: 65px 27px 75px; }
  .un_feature_content { width: 100%; }
  .un_feature_heading { font-size: 22px; }
  .un_feature_heading::before { font-size: 53px; margin-bottom: 24px; }
  .un_feature_text { font-size: 13px; line-height: 2.1; }
  .un_feature_item { display: grid; row-gap: 35px; }
  .un_feature_img { width: 94%; margin-inline: auto; padding: 7px; }
  .un_feature::after { font-size: 140px; }
  .un_treatment { padding-top: 60px; }
  .el_heading { font-size: 21px; row-gap: 15px; }
  .el_heading::before { font-size: 63px; }
  .un_treatment_itemUnit { margin-top: 54px; padding: 0 27px 60px; row-gap: 65px; }
  .un_treatment_item { row-gap: 32px; }
  .un_treatment_item_content { width: 100%; }
  .un_treatment_item_head { padding-bottom: 21px; }
  .un_treatment_item_head::before { font-size: 75px; margin-bottom: 16px; }
  .un_treatment_headingLv3 { font-size: 20px; }
  .un_treatment_headingLv4 { font-size: 21px; line-height: 1.8; margin-top: 10px; }
  .un_treatment_item_text { font-size: 13px; line-height: 2.12; margin-top: 23px; }
  .un_treatment_img { width: 100%; border-radius: 100px 4px 4px 4px; position: static; margin-top: 0; }
  .un_treatment_item:nth-of-type(2) .un_treatment_img { border-radius: 4px 100px 4px 4px; }
  .un_treatment_recommend { padding: 19px 16px 14px; }
  .un_treatment_recommend_title { font-size: 16px; }
  .un_treatment_recommend_listItem { font-size: 12px; }
  .un_treatment_listWrap { padding: 40px 22px; }
  .un_treatment_list { gap: 12px; }
  .un_treatment_listItem a { padding: 20px 14px; }
  .un_docter { padding: 65px 27px; row-gap: 36px; }
  .un_docter_content { width: 100%; }
  .un_docter_head .el_heading::before { font-size: 61px; }
  .un_docer_heading { font-size: 21px; }
  .un_docer_heading::before { font-size: 61px; }
  .un_docter_catch { font-size: 21px; }
  .un_docter_text { font-size: 13px; line-height: 2.12; }
  .un_docter_img { width: 94%; margin-inline: auto; }
  .un_column { padding: 60px 27px; }
  .un_column_postUnit { margin-top: 36px; row-gap: 35px; }
  .un_column_title { font-size: 14px; }
  .bl_footer_head { padding: 60px 27px; }
  .bl_footer_headWrap { grid-template-columns: 1fr; row-gap: 24px; }
  .bl_footer_head_text { font-size: 13px; }
  .bl_footer_headWrap li a { font-size: 13px; }
  .bl_footer_body { padding: 48px 27px; }
  .bl_footer_body_wrap dd { font-size: 12px; letter-spacing: .01em; }
  .footer-area a { font-size: 12px !important; letter-spacing: .04em; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* v2.10 · Brighten only the reception photograph, keeping the lettering intact. */
.un_fv {
  display: block;
  max-width: none;
  min-height: 0;
  background-color: #3d2d24;
  background-image: none;
  background-size: cover;
  background-position: center 38%;
  color: #fff8eb;
}
.un_fv::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: url("https://www.oral-clinique.com/official/wp-content/themes/oralclinique/re_img/top/fv_01.webp");
  background-size: cover;
  background-position: inherit;
  filter: brightness(1.25) contrast(.94);
}
.un_fv_content {
  width: min(58%, 790px);
  padding: 62px 48px 20px 5.6vw;
  background: transparent;
}
.un_fv_imgWrap { display: none; }
.un_fv .oc-editorial-title,
.un_fv .un_fv_headText_en,
.un_fv .un_fv_headText_jp,
.un_fv .un_fv_text,
.un_fv .un_fv_text span,
.un_fv .un_fv_text_02,
.un_fv .un_fv_point_number,
.un_fv .un_fv_point_text {
  color: #fff8eb;
  text-shadow: 0 1px 3px #24170de0, 0 2px 12px #24170d80;
}
.un_fv .oc-editorial-title .oc-wordmark,
.un_fv .oc-editorial-title em {
  -webkit-text-stroke: 1.4px #181512;
  paint-order: stroke fill;
  text-shadow: 0 2px 4px #00000050;
}
.un_fv .oc-title-rule { border-color: #ddc4a3; }
/* v2.11 · Keep the requested Japanese message white with a dark outline. */
.un_fv .un_fv_text {
  color: #fff;
  -webkit-text-stroke: 2.4px #181512;
  paint-order: stroke fill;
  text-shadow: 0 2px 4px #00000040;
}
.un_fv .un_fv_pointUnit,
.un_fv .un_fv_point:not(:last-of-type) { border-color: #fff8eb50; }
.un_fv .un_fv_pointUnit { margin-top: 30px; }
@media (min-width: 769px) and (max-width: 1024px) {
  .un_fv_content { width: 72%; padding: 52px 32px 20px; }
}
@media (max-width: 768px) {
  .un_fv {
    background-position: 53% center;
  }
  .un_fv_content { width: 100%; padding: 44px 27px 20px; }
}

/* v2.8 · Consultation banners share the site's editorial typography and palette. */
.oc-service-wrap { width: 100%; max-width: 1080px; margin: 28px auto 0; }
.oc-service-wrap + br { display: none; }
a.oc-service-card {
  display: block;
  padding: 38px 42px;
  background: #fbf6ee;
  border: 1px solid #cbb79c;
  color: #533a29;
  text-decoration: none;
  text-align: left;
  box-shadow: none;
  transition: background-color .2s, border-color .2s;
}
a.oc-service-card:hover { opacity: 1; background: #fffaf3; border-color: #947556; }
.oc-service-card__inner { display: grid; grid-template-columns: minmax(0, 1fr) 226px; gap: 34px; align-items: center; }
.oc-service-card__copy { min-width: 0; }
.oc-service-card__eyebrow { display: block; margin-bottom: 12px; font: italic 400 46px/1 var(--oc-display); letter-spacing: -.025em; color: #8a694c; }
.oc-service-card__title { margin: 0 0 18px; font: 500 29px/1.55 var(--oc-serif); letter-spacing: .045em; color: #533a29; }
.oc-service-card__title-sub { display: block; margin-top: 2px; font-size: 18px; letter-spacing: .08em; }
.oc-service-card__description { margin: 0; font: 400 14px/2 var(--oc-sans); letter-spacing: .035em; color: #655342; }
.oc-service-card__message { margin: 12px 0 0; font: 500 17px/1.7 var(--oc-serif); letter-spacing: .08em; color: #69452a; }
.oc-service-card__treatments { margin: 19px 0 0; font: 400 12px/1.9 var(--oc-sans); letter-spacing: .075em; color: #867059; }
.oc-service-card__intro { margin: 0 0 12px; font: 400 13px/1.9 var(--oc-sans); letter-spacing: .05em; color: #4e6554; }
.oc-service-card__action { display: flex; flex-direction: column; align-items: center; align-self: stretch; justify-content: center; gap: 25px; border-left: 1px solid #deccb5; padding-left: 30px; }
.oc-service-card__illustration { display: grid; place-items: center; width: 126px; height: 142px; background: #efe4d3; border-radius: 70px 70px 5px 5px; color: #886442; }
.oc-service-card__illustration svg { width: 83px; height: 85px; }
.oc-service-card__cta { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 14px; min-height: 49px; width: 100%; border-radius: 30px; background: #68482f; color: #fff8ec; font: 400 12px/1.7 var(--oc-sans); letter-spacing: .02em; white-space: nowrap; }
.oc-service-card__cta > span { font-size: 19px; line-height: 1; }
a.oc-service-card--online { background: #f2f3ec; border-color: #c3c8b9; }
a.oc-service-card--online:hover { background: #f8f9f2; border-color: #87947e; }
.oc-service-card--online .oc-service-card__eyebrow { color: #64745d; }
.oc-service-card--online .oc-service-card__action { border-color: #d0d6c6; }
.oc-service-card--online .oc-service-card__illustration { color: #5f755e; background: #e3e7d9; }
.oc-service-card--online .oc-service-card__cta { background: #4d6049; }
.bl_footer_head > .oc-service-wrap:first-of-type { margin-top: 40px; }
@media (max-width: 1024px) {
  a.oc-service-card { padding: 30px 28px; }
  .oc-service-card__inner { grid-template-columns: minmax(0, 1fr) 222px; gap: 23px; }
  .oc-service-card__action { padding-left: 22px; }
  .oc-service-card__title { font-size: 25px; }
  .oc-service-card__cta { white-space: normal; }
}
@media (max-width: 600px) {
  .oc-service-wrap { margin-top: 20px; }
  a.oc-service-card { padding: 25px 21px 22px; }
  .oc-service-card__inner { grid-template-columns: minmax(0, 1fr); gap: 21px; }
  .oc-service-card__eyebrow { font-size: 37px; margin-bottom: 13px; }
  .oc-service-card--online .oc-service-card__eyebrow { font-size: 31px; }
  .oc-service-card__title { font-size: 23px; letter-spacing: .015em; margin-bottom: 15px; }
  .oc-service-card__title-sub { font-size: 17px; margin-top: 4px; }
  .oc-service-card__description { font-size: 13px; line-height: 1.95; }
  .oc-service-card__description br { display: none; }
  .oc-service-card__message { font-size: 16px; margin-top: 11px; }
  .oc-service-card__treatments { font-size: 11px; letter-spacing: .02em; margin-top: 16px; }
  .oc-service-card__intro { font-size: 12px; }
  .oc-service-card__action { flex-direction: row; border-left: 0; border-top: 1px solid #deccb5; padding: 18px 0 0; gap: 17px; }
  .oc-service-card__illustration { width: 47px; height: 53px; flex-shrink: 0; background: transparent; border-radius: 0; }
  .oc-service-card__illustration svg { width: 47px; height: 48px; }
  .oc-service-card__cta { flex: 1; width: auto; font-size: 12px; padding: 12px 14px; }
}
@media (max-width: 359px) {
  .oc-service-card__illustration { display: none; }
  .oc-service-card__action { gap: 0; }
}

/* v2.9 · Three treatment promotions with original copy and editorial photos. */
.un_treatment_listItem.oc-promo-item { margin-top: 28px; }
.un_treatment_listItem a.oc-promo-card {
  display: flex;
  align-items: stretch;
  padding: 0;
  overflow: hidden;
  border: 1px solid #d3c2ac;
  background: #fbf6ee;
  color: #553c29;
  text-align: left;
  box-shadow: none;
}
.un_treatment_listItem a.oc-promo-card:hover { opacity: 1; border-color: #937354; }
.oc-promo-card__inner { display: flex; flex-direction: column; width: 100%; min-width: 0; }
.oc-promo-card__photo { margin: 0; position: relative; aspect-ratio: 5 / 4; background: #e9decc; overflow: hidden; }
.oc-promo-card__photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 45%; }
.oc-promo-card--laminate .oc-promo-card__photo img { object-position: center; }
.oc-promo-card__photo figcaption { position: absolute; right: 11px; bottom: 10px; padding: 3px 7px; color: #675747; background: #fffaf0e8; font: 400 9px/1.5 var(--oc-sans); letter-spacing: .07em; }
.oc-promo-card__body { display: flex; flex: 1; flex-direction: column; align-items: stretch; padding: 27px 26px 26px; min-width: 0; }
.oc-promo-card__english { font: italic 400 clamp(34px,3vw,43px)/1.1 var(--oc-display); color: #987554; letter-spacing: -.025em; margin-bottom: 14px; }
.oc-promo-card__title { font: 500 23px/1.6 var(--oc-serif); color: #533923; letter-spacing: .025em; margin: 0 0 15px; }
.oc-promo-card__small { display: block; font-size: 15px; margin-bottom: 3px; letter-spacing: .1em; }
.oc-promo-card__times { display: block; color: #ac9070; font: 400 19px/1.5 var(--oc-display); }
.oc-promo-card__kicker { font: 400 12px/1.8 var(--oc-serif); margin: 0 0 12px; letter-spacing: .035em; color: #7c674f; }
.oc-promo-card__lead { margin: 0 0 16px; font: 500 18px/1.6 var(--oc-serif); color: #705035; }
.oc-promo-card__lead > span { white-space: nowrap; }
.oc-promo-card__lead strong { padding-inline: 3px; font: 500 42px/1 var(--oc-display); }
.oc-promo-card__description { font: 400 13px/1.9 var(--oc-sans); color: #6a5948; margin: 0 0 23px; letter-spacing: .015em; }
.oc-promo-card__emphasis { font: 500 18px/1.8 var(--oc-serif); color: #6a4b30; }
.oc-promo-card__facts { border-top: 1px solid #daccb7; margin: 0 0 24px; }
.oc-promo-card__facts > div { display: grid; grid-template-columns: 30px minmax(0,1fr); gap: 13px; align-items: start; padding: 15px 0; border-bottom: 1px solid #e4d9c8; }
.oc-promo-card__number { font: 400 27px/1.2 var(--oc-display); color: #aa8b67; }
.oc-promo-card__number > span { display: block; font: 400 7px/1.3 var(--oc-sans); letter-spacing: .04em; }
.oc-promo-card__facts p { margin: 0; font: 400 12px/1.85 var(--oc-sans); color: #6d5a45; letter-spacing: .015em; }
.oc-promo-card__facts strong { font: 500 15px/1.8 var(--oc-serif); color: #64452a; }
.oc-promo-card__fact-label { display: block; margin-bottom: 3px; font-size: 11px; }
.oc-promo-card__consultation { margin: 0 0 22px; color: #705137; }
.oc-promo-card__consultation strong { display: block; font: 500 17px/1.8 var(--oc-serif); }
.oc-promo-card__consultation > span { display: block; font: 400 11px/1.8 var(--oc-sans); margin-top: 3px; }
.oc-promo-card__cta { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: auto; padding: 14px 21px; min-height: 50px; border-radius: 30px; font: 400 12px/1.7 var(--oc-sans); background: #6d4f35; color: #fff8ed; letter-spacing: .08em; }
.oc-promo-card__cta > span { font-size: 20px; line-height: 1; }
.oc-promo-card--laminate .oc-promo-card__english { color: #778268; }
.oc-promo-card--laminate .oc-promo-card__cta { background: #53634b; }
@media (max-width: 1024px) {
  .oc-promo-card__body { padding: 24px 22px; }
  .oc-promo-card__title { font-size: 22px; }
}
@media (max-width: 600px) {
  .un_treatment_listItem.oc-promo-item { margin-top: 20px; }
  .oc-promo-card__body { padding: 25px 23px; }
  .oc-promo-card__english { font-size: 41px; }
  .oc-promo-card--laminate .oc-promo-card__english { font-size: 36px; }
  .oc-promo-card__facts strong { font-size: 16px; }
}

/* Compact spacing: homepage only, retain typography and touch target sizes. */
.un_fv_content { padding-top: 38px; padding-bottom: 16px; }
.oc-editorial-title { margin-bottom: 18px; }
.oc-title-rule { margin-top: 16px; }
.un_fv_text { margin-top: 18px; }
.hero_title p { padding-block: 18px; }
.un_feature { padding-block: 64px 68px; }
.un_feature_item { column-gap: 5%; }
.un_feature_heading::before { margin-bottom: 16px; }
.un_feature_text { margin-top: 22px; }
.un_treatment { padding-top: 46px; }
.el_heading { row-gap: 10px; }
.un_treatment_itemUnit { margin-top: 44px; padding-bottom: 48px; row-gap: 60px; }
.un_treatment_item_head { padding-bottom: 16px; }
.un_treatment_item_head::before { margin-bottom: 12px; }
.un_treatment_item_text { margin-top: 18px; }
.un_treatment_button, .un_docter_button { margin-top: 20px; }
.un_treatment_recommendWrap { margin-top: 24px; }
.un_treatment_recommend { padding-block: 18px 14px; }
.un_treatment_listWrap { padding-block: 38px; }
.un_treatment_list { gap: 12px; }
.un_treatment_listItem a:not(.oc-promo-card) { padding-block: 17px; }
.un_treatment_listItem.oc-promo-item { margin-top: 16px; }
.un_docter { padding-block: 64px; }
.un_docter_head { padding-bottom: 18px; }
.un_docter_text { margin-top: 20px; }
.un_column { padding-block: 46px; }
.un_column_postUnit { margin-top: 28px; gap: 20px; }
.un_column_button { margin-top: 26px; }
.bl_footer_head { padding-block: 46px; }
.bl_footer_headWrap { margin-top: 24px; gap: 24px; }
.bl_footer_body { padding-block: 46px; }
.bl_footer_insta { padding-block: 32px; }
.footer_clinic { padding-top: 32px; }
.oc-service-wrap { margin-top: 18px; }
.bl_footer_head > .oc-service-wrap:first-of-type { margin-top: 26px; }
a.oc-service-card { padding-block: 26px; }
.oc-service-card__inner { gap: 24px; }
.oc-service-card__title { margin-bottom: 12px; }
.oc-service-card__treatments { margin-top: 12px; }
.oc-promo-card__body { padding-block: 20px; }
.oc-promo-card__english { margin-bottom: 10px; }
.oc-promo-card__description { margin-bottom: 16px; }
.oc-promo-card__facts { margin-bottom: 18px; }
.oc-promo-card__facts > div { padding-block: 11px; }
.oc-promo-card__consultation { margin-bottom: 16px; }
@media (max-width: 768px) {
  .un_fv_content { padding-top: 28px; padding-bottom: 16px; }
  .hero_title p { padding-block: 16px; }
  .un_feature { padding: 38px 22px 42px; }
  .un_feature_item { row-gap: 24px; }
  .un_treatment { padding-top: 36px; }
  .un_treatment_itemUnit { margin-top: 32px; padding: 0 22px 36px; row-gap: 42px; }
  .un_treatment_item { row-gap: 22px; }
  .un_treatment_recommendWrap { margin-top: 20px; }
  .un_treatment_recommend { padding-block: 15px 12px; }
  .un_treatment_listWrap { padding: 28px 18px; }
  .un_docter { padding: 40px 22px; row-gap: 24px; }
  .un_column { padding: 36px 22px; }
  .un_column_postUnit { margin-top: 24px; row-gap: 24px; }
  .bl_footer_head { padding: 36px 22px; }
  .bl_footer_body { padding: 32px 22px; }
  .bl_footer_insta { padding-block: 28px; }
  .footer_clinic { padding-top: 26px; }
}
@media (max-width: 600px) {
  a.oc-service-card { padding: 20px 18px; }
  .oc-service-card__inner { gap: 16px; }
  .oc-service-card__action { padding-top: 14px; }
  .oc-promo-card__body { padding: 20px; }
}

/* Keep the lettering in this journal thumbnail fully visible. */
.un_column_post[href$="/column/blog_ceramic/3444/"] .un_column_thumb img {
  aspect-ratio: 1376 / 768;
  height: auto;
  object-fit: contain;
}

/* Desktop: place the Japanese copy over the dark reception wall.
   Relative positioning preserves the hero height and photograph crop. */
@media (min-width: 1025px) {
  .un_fv .un_fv_headText,
  .un_fv .un_fv_text {
    position: relative;
    left: 32vw;
    width: 35vw;
  }
  .un_fv .un_fv_text {
    font-size: clamp(24px, 2.5vw, 32px) !important;
  }
}