@charset "UTF-8";

/* 事業案内 /about/：改修・リニューアル・医療設備（#business3）／クリニック新規開業（#business4）の事例ボタン
   PC＝画像と同じ列の画像の下（本文列は2行ぶち抜き）／SP＝画像 → 本文 → ボタン */
.about #content #business3 .inner .inBox .caseLinkBtn,
.about #content #business4 .inner .inBox .caseLinkBtn{width:100%;margin:24px 0 0}

@media screen and (min-width: 769px){
	.about #content #business3 .inner .inBox,
	.about #content #business4 .inner .inBox{display:grid;grid-template-columns:48% 48%;grid-template-rows:auto 1fr;justify-content:space-between}
	.about #content #business3 .inner .inBox > *,
	.about #content #business4 .inner .inBox > *{width:auto}
	.about #content #business3 .inner .inBox .caseLinkBtn,
	.about #content #business4 .inner .inBox .caseLinkBtn{align-self:start}
	/* 改修（.aboutBox4）：本文＝左／画像・ボタン＝右 */
	.about #content #business3 .inner .inBox .txBox{grid-column:1;grid-row:1 / 3}
	.about #content #business3 .inner .inBox .imgBox{grid-column:2;grid-row:1}
	.about #content #business3 .inner .inBox .caseLinkBtn{grid-column:2;grid-row:2}
	/* クリニック（.aboutBox3）：画像・ボタン＝左／本文＝右 */
	.about #content #business4 .inner .inBox .imgBox{grid-column:1;grid-row:1}
	.about #content #business4 .inner .inBox .caseLinkBtn{grid-column:1;grid-row:2}
	.about #content #business4 .inner .inBox .txBox{grid-column:2;grid-row:1 / 3}
}

@media screen and (max-width: 768px){
	.about #content #business3 .inner .inBox .caseLinkBtn,
	.about #content #business4 .inner .inBox .caseLinkBtn{order:3}
}

/* フッター「お問い合わせはこちら」：白地・緑枠・緑文字・緑矢印（hover で緑地・白文字） */
footer .inner .box1 .rBox .btn.w a{background-color:#fff;color:#007C4F;border-color:#007C4F}
footer .inner .box1 .rBox .btn.w a:before{background:url("../images/common/arrow.svg") no-repeat center}
footer .inner .box1 .rBox .btn.w a:hover{background-color:#007C4F;color:#fff}
footer .inner .box1 .rBox .btn.w a:hover:before{background:url("../images/common/arrow_w.svg") no-repeat center}

/* ヘッダーナビ：項目名の改行防止（トップ階層のみ。white-space は継承されるため .sub-menu は normal に戻す） */
.nav .main_menu > li,
.nav .main_menu > li > a{white-space:nowrap}
.nav .main_menu .sub-menu{white-space:normal}

/* ヘッダーナビ：SP手前〜中間幅でロゴと密着する不具合の調整（グループロゴは残す） */
/* a は > 直下指定（.sub-menu のリンクに効かせない） */
@media screen and (max-width:1360px){
	header .nav .main_menu > li{padding-right:24px}
	header .nav .main_menu > li:last-child{padding-right:0}
	header .inner .rBox .r_logo{padding-left:24px}
}
@media screen and (max-width:1280px){
	header .nav .main_menu > li{font-size:14px;padding-right:16px}
	header .nav .main_menu > li > a{font-size:14px}
	header .inner .rBox .r_logo img{width:170px;height:auto}
}
@media screen and (max-width:1080px){
	header .nav .main_menu > li{font-size:13px;padding-right:10px}
	header .nav .main_menu > li > a{font-size:13px}
	header .inner .rBox .r_logo img{width:140px;height:auto}
	header .inner .rBox .r_logo{padding-left:16px}
}
@media screen and (max-width:1000px){
	header .nav .main_menu > li{font-size:12px;padding-right:7px}
	header .nav .main_menu > li > a{font-size:12px}
	header .inner .rBox .r_logo img{width:120px;height:auto}
}
/* 左ロゴは .nav の外なので 851px 以上に限定（769〜850px のハンバーガー表示は従来の 300px のまま） */
@media screen and (min-width:851px) and (max-width:1000px){
	header .inner .logo img{width:220px;height:auto}
}

/* 小カテゴリ／事例ページ：概要表の行を上下中央寄せ */
.hc-page .hc-spec__row{align-items:center}
.hc-page .hc-spec dd{padding-bottom:0}

/* 小カテゴリ／事例ページ：FAQ・Q&Aの回答を「A.」マークと揃える */
/* 回答は <p> のため #content p（line-height:200% / padding:0.5em）を継承し「A.」より下にずれる。
   #content を含むセレクタで詳細度を上げて上書きし、設問(.hc-faq__qtx)と同じ行間・上余白に合わせる */
#content .hc-faq__a p,
#content .hc-qa__a p,
#content .hc-qa__q p{padding:0.1em 0 0;line-height:1.7}

/* カテゴリツリー：小が0件の中カテゴリでは小リスト(ul)が空になる。
   空の白箱(padding/背景)を畳んで中ラベルのみ表示する（大ページ／事例紹介トップ共通） */
#content.hc-page--large .hc-lg-cases__sub:empty,
#content.hc-page--archive .hc-ar-col__sub:empty{display:none}

/* ===== AUN13/15 工事の流れ：リード(hc-lg-flow__lead)を1行表示に ===== */
/* 大カテゴリ全ページ共通。step02 の長いリードがPCで2行折り返しになるため、
   フォント・字間をわずかに詰めて1行に収める。SPは従来どおり折り返し可。 */
#content.hc-page--large .hc-lg-flow__lead{
	white-space: nowrap;
	font-size: 12px;
	letter-spacing: -0.02em;
}
@media screen and (max-width: 768px){
	#content.hc-page--large .hc-lg-flow__lead{
		white-space: normal;
		font-size: 13px;
		letter-spacing: normal;
	}
}

/* ===== AUN8 /case/導入文 冒頭段落を明朝見出しに ===== */
#content.hc-page--archive .hc-ar-intro__body .hc-ar-lead{
	font-family:"游明朝","Yu Mincho","游明朝体","YuMincho","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","HiraMinProN-W3","ＭＳ Ｐ明朝","MS PMincho",serif;
	font-size:20px;
	font-weight:700;
	color:#333;
	line-height:1.8;
}
@media screen and (max-width:768px){
	#content.hc-page--archive .hc-ar-intro__body .hc-ar-lead{ font-size:16px; }
}

/* ===== フッターPC余白の圧縮（ノートPCで画面内に収める。PC≥769px限定、SPは layout.css のまま） ===== */
@media screen and (min-width:769px){
	footer{ padding:40px 0 30px; }
	footer .inner .box1{ padding:0 0 40px; }
	footer .inner .navBox{ padding:0 0 20px; }
	footer .inner .navBox .inBox .title{ padding:0 0 16px; }
	footer .inner .navBox .inBox .title.type1{ padding:0 0 16px; }
	footer .inner .navBox .inBox ul li{ padding:0 0 12px 1em; }
	footer .inner .box2{ padding:0 0 30px; }
}

/* ===== 慈恵・河北プロデュース事例：画像角丸＋院内写真キャプション（他エントリは画像焼込みのため対象外） ===== */
#content #produce-jikei-seibu .secBox .imgBox img,
#content #produce-jikei-seibu .threeBox .inBox img,
#content #produce-kawakita .secBox .imgBox img,
#content #produce-kawakita .threeBox .inBox img{ border-radius: 12px; }
#content #produce-jikei-seibu .threeBox .inBox .cap,
#content #produce-kawakita .threeBox .inBox .cap,
#content #produce-st-marianna .threeBox .inBox .cap,
#content #produce-sendai-kousei .threeBox .inBox .cap{ margin: 0; padding: 8px 0 0; font-size: 14px; line-height: 1.5; font-weight: 700; color: #007C4F; }
@media screen and (max-width: 768px){
	#content #produce-jikei-seibu .secBox .imgBox img,
	#content #produce-jikei-seibu .threeBox .inBox img,
	#content #produce-kawakita .secBox .imgBox img,
	#content #produce-kawakita .threeBox .inBox img{ border-radius: 15px; }
	#content #produce-jikei-seibu .threeBox .inBox .cap,
	#content #produce-kawakita .threeBox .inBox .cap,
	#content #produce-st-marianna .threeBox .inBox .cap,
	#content #produce-sendai-kousei .threeBox .inBox .cap{ font-size: 13px; }
}

/* ㉟（㉞訂正）produce-healthcare サブ写真キャプション：plastic_surgery（.hc-page .hc-photo__cap＝PC14px/700・SP12px/700）に合わせる。base に 14px/700/padding 8px 0 0、SP で 12px へ（700・padding は base 継承）。色は page.css のまま・.about.healthcare 限定 */
.about.healthcare #content .healthcareBox .inner .threeBox .inBox p{ font-size: 14px; font-weight: 700; padding: 8px 0 0; }
@media screen and (max-width: 768px){
	.about.healthcare #content .healthcareBox .inner .threeBox .inBox p{ font-size: 12px; }
}

/* 依頼㊱ reCAPTCHA v3 バッジ非表示（帰属テキストはCF7フォーム内に表示＝functions.php の wpcf7_form_elements） */
.grecaptcha-badge{ visibility: hidden; }
/* 依頼㊳ #content を足して詳細度を上げ、テーマの #content p（16px/.5em 0）に勝たせる */
#content .recaptcha-attribution{ font-size: 13px; padding: 45px .5em; line-height: 200%; text-align: center; box-sizing: border-box; color: #777; }
#content .recaptcha-attribution a{ color: #777; text-decoration: underline; }
@media screen and (max-width: 768px){
	#content .recaptcha-attribution{ text-align: left; }
}

/* produce-hospital 慈恵／中之島アイセンター ナビボタン */
/* 全幅：慈恵は絶対配置の矢印(right:14px)との重なり回避 */
.about.hospital #content .healthcareBox1 .inner .btnArea.type2 .btn.sec a[href="#produce-jikei-seibu"]{padding-right:32px}
/* 全幅：「センター」は一語保持 */
.about.hospital #content .healthcareBox1 .inner .btnArea.type2 .btn .btn-nl{white-space:nowrap}
/* 中間幅(769-1199px)：長い2ボタンはフォント圧縮で枠内に収める（固定高75px・均一を維持） */
@media screen and (min-width:769px) and (max-width:1199px){
  .about.hospital #content .healthcareBox1 .inner .btnArea.type2 .btn.sec a[href="#produce-jikei-seibu"],
  .about.hospital #content .healthcareBox1 .inner .btnArea.type2 .btn a[href="#produce-nakanoshima-eye"]{font-size:13px;line-height:1.3}
  .about.hospital #content .healthcareBox1 .inner .btnArea.type2 .btn .btn-nl{white-space:normal}
}
/* 広PC(≥1200px)：慈恵は「センター」を独立行に（2行表示） */
@media screen and (min-width:1200px){
  .about.hospital #content .healthcareBox1 .inner .btnArea.type2 .btn .btn-nl{display:block;width:100%}
}

/* history 沿革：タブレット帯(769-1079px)でスローガンが年号に重なる対策 */
@media screen and (min-width:769px) and (max-width:1079px){
  .company.history #content .historyBox2 .inner .inBox p.title{position:relative;top:auto;left:auto;padding:0 0 18px 30px}
}