@charset "utf-8";

/*
  共通ページスタイル（料金ページ・トップページ）
  PDF「施術方針及び内容のご案内」に合わせた緑基調のデザイン。
  更新時は読み込み側HTMLの ?v= を必ず変更すること。
*/

.pgPage{ color:#333; line-height:1.8; padding-bottom:25px; }
.pgPage p{ margin:0 0 10px; }
.pgPage strong{ font-weight:bold; }
.pgPage .pgGreen{ color:#2e7d32; }
.pgPage .pgGold{ color:#b07d12; }
.pgPage .pgTitle{ font-size:22px; font-weight:bold; color:#2e7d32; line-height:1.4; margin-bottom:15px; }
.pgPage .pgLead{ background:#e8f5e0; padding:14px 18px; border-radius:4px; margin-bottom:30px; }
.pgPage .pgLead strong{ color:#2e7d32; }
.pgPage .pgLead .pgGold{ color:#b07d12; }
.pgPage .pgHead{ font-size:17px; font-weight:bold; color:#2e7d32; background:#e8f5e0; border-left:5px solid #6aa84f; padding:10px 14px; margin:35px 0 15px; line-height:1.5; }
.pgPage .pgHeadGray{ color:#555; background:#f0f0f0; border-left-color:#999; }
.pgPage .pgSub{ font-weight:bold; color:#2e7d32; margin-bottom:2px; }
.pgPage .pgNote{ font-size:12px; color:#666; }
.pgPage .pgTable{ width:100%; border-collapse:collapse; margin:5px 0 10px; font-size:14px; }
.pgPage .pgTable th,
.pgPage .pgTable td{ border-bottom:1px solid #cfe5c4; padding:10px 12px; text-align:left; vertical-align:middle; font-weight:normal; }
.pgPage .pgTable thead th{ background:#6aa84f; color:#fff; font-weight:bold; text-align:center; }
.pgPage .pgTable tbody th{ font-weight:bold; color:#2e7d32; white-space:nowrap; text-align:center; }
/* 料金表は3列なので幅を抑えて中央に配置 */
.pgPage .pgTable.pgPrice{ max-width:640px; margin-left:auto; margin-right:auto; }
/* 列幅：区分／初回／2回目以降 */
.pgPage .pgTable.pgPrice thead th:nth-child(1){ width:34%; }
.pgPage .pgTable.pgPrice thead th:nth-child(2),
.pgPage .pgTable.pgPrice thead th:nth-child(3){ width:33%; }
.pgPage .pgTable tbody th span{ display:block; font-size:11px; }
/* 列の区切り：薄い緑の縦線、見出し行は白線 */
.pgPage .pgTable th + th,
.pgPage .pgTable th + td,
.pgPage .pgTable td + td{ border-left:1px solid #cfe5c4; }
.pgPage .pgTable thead th + th{ border-left-color:#fff; }
/* 金額列は中央揃え */
.pgPage .pgTable td:nth-child(2),
.pgPage .pgTable td:nth-child(3),
.pgPage .pgTable td.pgSpan{ text-align:center; }
.pgPage .pgTable .pgBoth{ font-size:12px; color:#666; }
.pgPage .pgTable .pgCellNote{ display:block; font-size:12px; color:#666; line-height:1.6; margin-top:2px; }
.pgPage .pgTable tbody tr:nth-child(odd){ background:#f3faef; }
.pgPage .pgTable tbody tr:nth-child(even){ background:#fff; }
.pgPage .pgList{ margin:0 0 10px; }
.pgPage .pgList li{ position:relative; padding-left:20px; margin-bottom:6px; }
.pgPage .pgList li:before{ content:"\2665"; position:absolute; left:2px; color:#b07d12; font-size:12px; }
.pgPage .pgList strong{ color:#2e7d32; margin-right:12px; }
.pgPage .pgJicobe{ position:relative; background:#fbf1d6; border:2px solid #e0b75a; border-radius:8px; padding:30px 22px 16px; margin:45px 0 30px; }
.pgPage .pgJicobe h3{ font-size:19px; font-weight:bold; color:#8a5d00; line-height:1.5; margin-bottom:12px; }
.pgPage .pgNowrap{ white-space:nowrap; }
.pgPage .pgJicobe strong{ color:#8a5d00; }
.pgPage .pgBadge{ position:absolute; top:-14px; left:18px; background:#d9534f; color:#fff; font-weight:bold; font-size:13px; padding:3px 14px; border-radius:14px; margin:0; }
.pgPage .pgFree{ display:inline-block; background:#d9534f; color:#fff; font-size:17px; padding:0 10px; border-radius:4px; margin:0 4px; line-height:1.6; }
.pgPage .pgJicobe .pgFreeTxt{ color:#d9534f; font-size:110%; }
.pgPage .pgImportant{ background:#fbf1d6; border:1px solid #e0c27a; padding:16px 20px 8px; margin-bottom:10px; }
.pgPage .pgImportant h3{ font-size:16px; font-weight:bold; color:#8a5d00; margin-bottom:8px; }
.pgPage .pgImportant .pgSub{ color:#8a5d00; }
.pgPage .pgInfo dt{ font-size:14px; font-weight:bold; line-height:1.6; color:#555; margin:12px 0 0; }
.pgPage .pgInfo dd{ margin:0 0 4px; font-size:14px; }
.pgPage .pgContact{ background:#5fa866; color:#fff; text-align:right; padding:10px 20px; margin-top:35px; border-radius:4px; }
.pgPage .pgContactName{ font-size:14px; margin-right:14px; }
#geoMyStoreWrapper .pgPage a.pgContactTel,
#geoMyStoreWrapper .pgPage a.pgContactTel:visited{ color:#fff; }
.pgPage .pgContactTel{ font-size:18px; font-weight:bold; text-decoration:none; white-space:nowrap; }

@media screen and (max-width:568px){
  .geoMyStoreGoodsCategory.pgPage{ padding:20px 12px 20px; }
  .pgPage .pgTitle{ font-size:19px; }
  .pgPage .pgHead{ font-size:15px; }
  .pgPage .pgList strong{ display:block; margin-right:0; }
  /* スマホでは表を行ごとのカード表示にする */
  .pgPage .pgTable thead{ display:none; }
  .pgPage .pgTable,
  .pgPage .pgTable tbody,
  .pgPage .pgTable tr,
  .pgPage .pgTable th,
  .pgPage .pgTable td{ display:block; width:auto; }
  .pgPage .pgTable tr{ border:1px solid #cfe5c4; border-radius:4px; margin-bottom:8px; overflow:hidden; }
  .pgPage .pgTable tbody th{ background:#6aa84f; color:#fff; white-space:normal; padding:6px 10px; border:none; text-align:left; }
  .pgPage .pgTable td{ position:relative; padding:5px 10px 5px 6.5em; border-bottom:1px dotted #cfe5c4; }
  .pgPage .pgTable td:last-child{ border-bottom:none; }
  .pgPage .pgTable th + td,
  .pgPage .pgTable td + td{ border-left:none; }
  .pgPage .pgTable td:nth-child(2),
  .pgPage .pgTable td:nth-child(3),
  .pgPage .pgTable td.pgSpan{ text-align:left; }
  .pgPage .pgTable .pgBoth{ display:none; }
  .pgPage .pgTable.pgPrice{ max-width:none; }
  .pgPage .pgTable td:before{ content:attr(data-label); position:absolute; left:10px; top:7px; font-size:12px; color:#2e7d32; font-weight:bold; }
  .pgPage .pgJicobe{ padding:28px 14px 12px; }
  .pgPage .pgJicobe h3{ font-size:17px; }
  .pgPage .pgContact{ text-align:center; padding:10px; }
  .pgPage .pgContactName{ display:block; margin:0; font-size:13px; }
  .pgPage .pgContactTel{ font-size:17px; }
  .pgPage .pgContactTel:before{ content:"\260E"; margin-right:6px; }
}

/* ---- 汎用パーツ ---- */
.pgPage .pgSpBr{ display:none; }
.pgPage .pgAccess{ margin:8px 0 0; }
.pgPage .pgAccess li{ margin-bottom:6px; line-height:1.6; }
.pgPage .pgTag{ display:inline-block; font-size:12px; font-weight:bold; color:#2e7d32; background:#e8f5e0; border:1px solid #cfe5c4; border-radius:3px; padding:0 8px; margin-right:8px; line-height:1.7; }
.pgPage a{ color:#2e7d32; }
.pgPage .pgPhoto{ display:block; width:100%; max-width:480px; height:auto; border-radius:6px; margin:15px auto 20px; }
.pgPage .pgLinks{ margin:5px 0 10px; }
.pgPage .pgLinks a{ display:inline-block; margin:0 8px 8px 0; padding:4px 14px; border:1px solid #6aa84f; border-radius:16px; background:#fff; text-decoration:none; font-size:14px; }
.pgPage .pgLinks a:hover{ background:#e8f5e0; }
.pgPage .pgTable.pgHours thead th:nth-child(1){ width:24%; }
.pgPage .pgTable.pgHours thead th:nth-child(2){ width:38%; }

/* ---- トップページ本文の外枠（旧 #geoMyStoreTopIntro 相当） ---- */
.pgWrap{ width:850px; padding:30px; margin:0 auto 30px; }
.pgWrap.pgPage{ padding-bottom:30px; }

@media screen and (max-width:768px){
  .pgWrap{ width:auto; margin:0 20px 30px; }
}

@media screen and (max-width:568px){
  .pgWrap{ margin:0 15px 30px; padding:20px 12px; }
  .pgWrap.pgPage{ padding-bottom:20px; }
  .pgPage .pgLinks a{ font-size:13px; }
  .pgPage .pgSpBr{ display:inline; }
  .pgPage .pgAccess li{ margin-bottom:8px; }
  .pgPage .pgTag{ display:table; margin:0 0 2px; }
  /* スマホで指定の文を1行に収める（画面幅に合わせて文字サイズを調整） */
  .pgPage .pgSpOneLine{ font-size:clamp(11px, 3.7vw, 14px); letter-spacing:0; white-space:nowrap; }
}

/* ---- トップページ：ロゴ（ヒーロー）部分 ---- */
#geoMyStoreTopMv #geoMyStoreTopMvImage.pgHero{ max-height:none; overflow:visible; line-height:1.6; text-align:center; padding:44px 20px 30px; background:linear-gradient(#ffffff, #eef8e8); border-bottom:4px solid #6aa84f; }
#geoMyStoreTopMv .pgHeroLogo{ margin:0 auto; line-height:0; }
#geoMyStoreTopMv .pgHeroLogo img{ width:100%; max-width:520px; height:auto; }
#geoMyStoreTopMv .pgHeroCopy{ margin:20px 0 0; font-size:17px; font-weight:bold; color:#2e7d32; letter-spacing:1px; }
#geoMyStoreTopMv .pgSpBr{ display:none; }
/* ようこそ欄のメッセージ */
#geoMyStoreTopMv .pgTopMsg{ background:#e8f5e0; border-radius:4px; padding:10px 14px; margin:0 0 10px; }
#geoMyStoreTopMv .pgTopMsg a{ color:#2e7d32; font-weight:bold; }
#geoMyStoreTopMv #geoMyStoreTopInfo dt.infoLead{ color:#2e7d32; }

@media screen and (max-width:568px){
  #geoMyStoreTopMv #geoMyStoreTopMvImage.pgHero{ padding:26px 16px 20px; }
  #geoMyStoreTopMv .pgHeroLogo img{ max-width:88%; }
  #geoMyStoreTopMv .pgHeroCopy{ margin-top:14px; font-size:14px; letter-spacing:0; }
  #geoMyStoreTopMv .pgSpBr{ display:inline; }
}

/* PCでは指定の文を1行に収める（文字を少しだけ小さくし折り返さない） */
@media screen and (min-width:769px){
  .pgPage .pgOneLine{ font-size:15px; letter-spacing:0; white-space:nowrap; }
}
