@charset "utf-8";

/* widely-renewal.css : PC/SP一体型 */
#widelyPage {
  --wd-font: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  --wd-serif: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", serif;
  --wd-brown: #745536;
  --wd-gold: #c5a437;
  --wd-purple: #522886;
  --wd-red: #b91c1c;
  --wd-ink: #2f2725;
  --wd-text: #4b403b;
  --wd-bg: #fffaf2;
  --wd-line: #eadfcf;
  --wd-radius: 18px;
  --wd-shadow: 0 12px 30px rgba(73, 50, 28, .12);
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px 60px;
  color: var(--wd-text);
  font-family: var(--wd-font);
  line-height: 1.8;
  box-sizing: border-box;
}
#widelyPage *, #widelyPage *::before, #widelyPage *::after { box-sizing: border-box; }
#widelyPage a { color: inherit; text-decoration: none; }
#widelyPage img { max-width: 100%; height: auto; vertical-align: middle; }
#widelyPage .wd-breadcrumb { display:flex; flex-wrap:wrap; gap:8px; margin: 12px 0 18px; font-size: 13px; color:#7b706a; }
#widelyPage .wd-breadcrumb a { color: var(--wd-brown); text-decoration: underline; }
#widelyPage .wd-kicker { margin:0 0 10px; color:var(--wd-gold); font-weight:700; letter-spacing:.08em; }
#widelyPage .wd-hero { display:grid; grid-template-columns: minmax(0, 1fr) 360px; gap:28px; align-items:stretch; margin:0 0 26px; padding:42px; border-radius:24px; background:linear-gradient(135deg,#fff7e7 0%,#fff 55%,#f3ecff 100%); border:1px solid var(--wd-line); box-shadow:var(--wd-shadow); }
#widelyPage .wd-hero h1 { margin:0 0 18px; font-family:var(--wd-serif); font-size:40px; line-height:1.35; color:var(--wd-ink); }
#widelyPage .wd-hero p { margin:0; font-size:16px; }
#widelyPage .wd-hero__cta, #widelyPage .wd-contact__btns { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
#widelyPage .wd-hero__side { padding:24px; border-radius:18px; background:#fff; border:1px solid var(--wd-line); }
#widelyPage .wd-hero__side strong { display:block; margin-bottom:12px; color:var(--wd-brown); font-size:18px; }
#widelyPage .wd-hero__side ul { margin:0; padding-left:1.2em; }
#widelyPage .wd-hero__side li { margin-bottom:8px; }
#widelyPage .wd-btn { display:inline-flex; justify-content:center; align-items:center; min-height:46px; padding:10px 24px; border-radius:999px; background:var(--wd-purple); color:#fff !important; font-weight:700; border:2px solid var(--wd-purple); box-shadow:0 8px 18px rgba(82,40,134,.18); }
#widelyPage .wd-btn--sub { background:#fff; color:var(--wd-purple) !important; box-shadow:none; }
#widelyPage .wd-anchor { position:sticky; top:0; z-index:3; display:grid; grid-template-columns:repeat(6,1fr); gap:8px; margin:0 0 44px; padding:10px; border-radius:16px; background:rgba(255,255,255,.94); border:1px solid var(--wd-line); box-shadow:0 8px 20px rgba(0,0,0,.06); }
#widelyPage .wd-anchor a { text-align:center; padding:10px; border-radius:12px; color:var(--wd-brown); font-weight:700; background:#fff8eb; }
#widelyPage .wd-section, #widelyPage .wd-guide, #widelyPage .wd-service, #widelyPage .wd-faq, #widelyPage .wd-linkSection, #widelyPage .wd-contact { margin:0 0 58px; }
#widelyPage .wd-section__head { text-align:center; max-width:880px; margin:0 auto 24px; }
#widelyPage .wd-section__head h2, #widelyPage .wd-linkSection h2, #widelyPage .wd-contact h2 { margin:0 0 12px; font-family:var(--wd-serif); font-size:32px; line-height:1.45; color:var(--wd-ink); }
#widelyPage .wd-section__head p { margin:0; }
#widelyPage .wd-guideGrid, #widelyPage .wd-serviceGrid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
#widelyPage .wd-guideGrid article, #widelyPage .wd-serviceGrid article, #widelyPage .wd-tabPanel, #widelyPage .wd-faq dl, #widelyPage .wd-contact { border:1px solid var(--wd-line); border-radius:var(--wd-radius); background:#fff; box-shadow:var(--wd-shadow); }
#widelyPage .wd-guideGrid article { padding:24px; }
#widelyPage h3 { margin:0 0 10px; color:var(--wd-brown); font-size:20px; line-height:1.5; }
#widelyPage p { margin-top:0; }
#widelyPage .wd-tabBtns { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:0 0 14px; }
#widelyPage .wd-tabBtn { appearance:none; border:2px solid var(--wd-line); border-radius:14px; background:#fff; color:var(--wd-brown); padding:13px 8px; font:700 17px/1.4 var(--wd-font); cursor:pointer; }
#widelyPage .wd-tabBtn.is-active { border-color:var(--wd-purple); background:var(--wd-purple); color:#fff; }
#widelyPage .wd-tabPanel { display:none; padding:28px; }
#widelyPage .wd-tabPanel.is-active { display:block; }
#widelyPage .wd-panel__head { text-align:center; margin:0 0 20px; }
#widelyPage .wd-panel__head h3 { font-size:24px; color:var(--wd-ink); }
#widelyPage .wd-productGrid { display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }
#widelyPage .wd-productCard a { display:block; height:100%; padding:14px; border:1px solid var(--wd-line); border-radius:16px; background:#fffdf8; transition:transform .2s ease, box-shadow .2s ease; }
#widelyPage .wd-productCard a:hover { transform:translateY(-3px); box-shadow:0 10px 22px rgba(73,50,28,.12); }
#widelyPage .wd-productCard__image { display:flex; align-items:center; justify-content:center; aspect-ratio:1/1; margin-bottom:10px; background:#fff; border-radius:12px; overflow:hidden; }
#widelyPage .wd-productCard__image img { width:100%; height:100%; object-fit:contain; }
#widelyPage .wd-productCard__name { display:block; color:var(--wd-ink); font-weight:700; font-size:14px; line-height:1.55; }
#widelyPage .wd-panel__btn, #widelyPage .wd-section__more { text-align:center; margin-top:24px; }
#widelyPage .wd-linkSection { padding:28px; border-radius:var(--wd-radius); background:var(--wd-bg); border:1px solid var(--wd-line); text-align:center; }
#widelyPage .wd-chipLinks { display:grid; grid-template-columns:repeat(5,1fr); gap:12px; }
#widelyPage .wd-chipLinks--budget { grid-template-columns:repeat(4,1fr); }
#widelyPage .wd-chipLinks a { display:flex; align-items:center; justify-content:center; min-height:48px; padding:8px 12px; border-radius:12px; border:1px solid var(--wd-gold); color:var(--wd-brown); background:#fff; font-weight:700; }
#widelyPage .wd-categoryGrid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
#widelyPage .wd-categoryCard { display:grid; grid-template-columns:76px 1fr; align-items:center; gap:12px; padding:12px; border-radius:14px; border:1px solid var(--wd-line); background:#fff; text-align:left; font-weight:700; color:var(--wd-brown); }
#widelyPage .wd-categoryCard img { width:76px; height:52px; object-fit:cover; border-radius:10px; }
#widelyPage .wd-serviceGrid article { overflow:hidden; padding:0 0 22px; }
#widelyPage .wd-serviceGrid img { width:100%; height:190px; object-fit:cover; }
#widelyPage .wd-serviceGrid h3, #widelyPage .wd-serviceGrid p { padding-left:20px; padding-right:20px; }
#widelyPage .wd-serviceGrid h3 { margin-top:16px; }
#widelyPage .wd-faq dl { padding:8px 28px; }
#widelyPage .wd-faq dt { padding:18px 0 8px; color:var(--wd-brown); font-weight:700; font-size:18px; }
#widelyPage .wd-faq dd { margin:0; padding:0 0 18px; border-bottom:1px solid var(--wd-line); }
#widelyPage .wd-faq dd:last-child { border-bottom:0; }
#widelyPage .wd-contact { padding:34px; text-align:center; background:linear-gradient(135deg,#522886,#745536); color:#fff; }
#widelyPage .wd-contact h2 { color:#fff; }
#widelyPage .wd-contact p { max-width:720px; margin:0 auto; }
#widelyPage .wd-contact__btns { justify-content:center; }
#widelyPage .wd-contact .wd-btn { background:#fff; color:var(--wd-purple) !important; border-color:#fff; }
#widelyPage .wd-contact .wd-btn--sub { background:transparent; color:#fff !important; border-color:#fff; }

@media screen and (max-width: 767px) {
  #widelyPage { padding:0 4vw 12vw; font-size:3.7vw; line-height:1.75; }
  #widelyPage .wd-breadcrumb { font-size:3vw; margin:2vw 0 4vw; }
  #widelyPage .wd-hero { display:block; padding:7vw 5vw; border-radius:5vw; margin-bottom:5vw; }
  #widelyPage .wd-hero h1 { font-size:7.4vw; }
  #widelyPage .wd-hero p { font-size:3.8vw; }
  #widelyPage .wd-hero__side { margin-top:5vw; padding:5vw; border-radius:4vw; }
  #widelyPage .wd-hero__cta, #widelyPage .wd-contact__btns { display:grid; gap:3vw; }
  #widelyPage .wd-btn { width:100%; min-height:12vw; padding:2.5vw 4vw; font-size:3.8vw; }
  #widelyPage .wd-anchor { position:static; grid-template-columns:repeat(3,1fr); gap:2vw; padding:2vw; margin-bottom:9vw; }
  #widelyPage .wd-anchor a { padding:2.2vw 1vw; font-size:3.4vw; }
  #widelyPage .wd-section, #widelyPage .wd-guide, #widelyPage .wd-service, #widelyPage .wd-faq, #widelyPage .wd-linkSection, #widelyPage .wd-contact { margin-bottom:11vw; }
  #widelyPage .wd-section__head h2, #widelyPage .wd-linkSection h2, #widelyPage .wd-contact h2 { font-size:6.3vw; }
  #widelyPage .wd-kicker { font-size:3.4vw; }
  #widelyPage .wd-guideGrid, #widelyPage .wd-serviceGrid { grid-template-columns:1fr; gap:4vw; }
  #widelyPage .wd-guideGrid article { padding:5vw; }
  #widelyPage h3 { font-size:4.8vw; }
  #widelyPage .wd-tabBtns { grid-template-columns:repeat(2,1fr); gap:2.5vw; }
  #widelyPage .wd-tabBtn { padding:3vw 2vw; font-size:4vw; border-radius:3vw; }
  #widelyPage .wd-tabPanel { padding:5vw; border-radius:4vw; }
  #widelyPage .wd-panel__head h3 { font-size:5.2vw; }
  #widelyPage .wd-productGrid { grid-template-columns:1fr; gap:3vw; }
  #widelyPage .wd-productCard a { display:grid; grid-template-columns:32vw 1fr; gap:3vw; align-items:center; padding:3vw; border-radius:4vw; }
  #widelyPage .wd-productCard__image { margin:0; }
  #widelyPage .wd-productCard__name { font-size:3.6vw; }
  #widelyPage .wd-linkSection { padding:5vw; border-radius:4vw; }
  #widelyPage .wd-chipLinks, #widelyPage .wd-chipLinks--budget { grid-template-columns:repeat(2,1fr); gap:2.5vw; }
  #widelyPage .wd-chipLinks a { min-height:11vw; font-size:3.7vw; }
  #widelyPage .wd-categoryGrid { grid-template-columns:1fr; gap:2.5vw; }
  #widelyPage .wd-categoryCard { grid-template-columns:24vw 1fr; padding:3vw; }
  #widelyPage .wd-categoryCard img { width:24vw; height:16vw; }
  #widelyPage .wd-serviceGrid img { height:auto; }
  #widelyPage .wd-faq dl { padding:2vw 5vw; }
  #widelyPage .wd-faq dt { font-size:4.3vw; }
  #widelyPage .wd-contact { padding:7vw 5vw; border-radius:5vw; }
}