/*
Theme Name: Daisho SITE-04 Board & Special Metals
Theme URI: https://www.daisho-kinzoku.com/
Author: Daisho Project
Description: 鹿児島基板・特殊金属買取 専用テーマ
Version: 0.1.5
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: daisho-site04
*/

:root{
  --bg:#f4f5f2;
  --paper:#ffffff;
  --ink:#171917;
  --sub:#6d746f;
  --line:#b9bfba;
  --soft:#e8ebe7;
  --green:#315f4f;
  --green2:#6f8c80;
  --acid:#d9e95d;
  --rail:250px;
  --radius:18px;
  --max:1480px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.s4{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP","Yu Gothic",Meiryo,sans-serif;
  line-height:1.7
}
body.s4 a{color:inherit}
body.s4 img{max-width:100%;height:auto}
.s4-shell{display:grid;grid-template-columns:var(--rail) minmax(0,1fr);min-height:100vh}
.s4-side{
  min-height:100vh;padding:24px 18px 24px;border-right:1px solid #dde0dc;background:#f7f8f6;
  position:sticky;top:0;align-self:start;height:100vh;overflow:auto
}
.admin-bar .s4-side{top:32px;height:calc(100vh - 32px)}
.s4-brand{text-decoration:none;display:flex;gap:12px;align-items:center}
.s4-brand__mark{width:40px;height:40px;border:1px solid #59615c;border-radius:50%;display:grid;place-items:center;font-weight:900}
.s4-brand strong{display:block;font-size:.94rem}
.s4-brand small{display:block;color:var(--sub);font-size:.68rem;margin-top:1px}
.s4-circle{
  width:170px;height:170px;border:1px solid #59615c;border-radius:50%;
  display:grid;place-items:center;text-align:center;margin:36px auto 34px;
  font-family:Arial,sans-serif;font-size:1.25rem;line-height:1.05;letter-spacing:.02em
}
.s4-sidebox{border:1px solid #9ca39e;border-radius:14px;padding:18px 17px;margin-bottom:14px;background:#fbfcfa}
.s4-sidebox small{display:block;font-size:.64rem;font-weight:900;letter-spacing:.08em;margin-bottom:10px;color:#565d58}
.s4-sidebox a{display:block;text-decoration:none;padding:5px 0;font-size:.78rem;font-weight:800}
.s4-sidebox a:hover{color:var(--green)}
.s4-sidefoot{margin-top:28px;padding-top:16px;border-top:1px solid #d9ddda}
.s4-sidefoot a{display:block;text-decoration:none;font-size:.73rem;margin:7px 0}
.s4-main{min-width:0;padding:14px 14px 0}
.s4-topbar{height:54px;display:flex;align-items:center;justify-content:flex-end;gap:16px;padding:0 10px;font-size:.74rem}
.s4-topbar a{text-decoration:none;font-weight:900}
.s4-menu-lines{width:38px;height:24px;position:relative}
.s4-menu-lines::before,.s4-menu-lines::after,.s4-menu-lines span{content:"";position:absolute;left:0;width:38px;height:2px;background:#111}
.s4-menu-lines::before{top:2px}
.s4-menu-lines span{top:11px}
.s4-menu-lines::after{top:20px}
.s4-content{width:min(100%,var(--max));margin-inline:auto}

/* main visual */
.s4-mainvisual{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.78fr);gap:54px;align-items:center;padding:28px 18px 42px}
.s4-mainvisual__image{
  min-height:520px;border:1px solid #87908a;border-radius:22px;position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 20% 20%,rgba(255,255,255,.3),transparent 22%),
    radial-gradient(circle at 68% 56%,rgba(217,233,93,.16),transparent 18%),
    linear-gradient(135deg,#1f3f34 0%,#486a5d 35%,#8da397 68%,#d7ddd7 100%)
}
.s4-mainvisual__image::before{
  content:"";position:absolute;inset:24px;
  background:
    linear-gradient(90deg,transparent 7%,rgba(217,233,93,.62) 7% 7.35%,transparent 7.35% 32%,rgba(217,233,93,.5) 32% 32.3%,transparent 32.3% 75%,rgba(217,233,93,.45) 75% 75.3%,transparent 75.3%),
    linear-gradient(0deg,transparent 13%,rgba(217,233,93,.55) 13% 13.3%,transparent 13.3% 43%,rgba(217,233,93,.45) 43% 43.3%,transparent 43.3% 78%,rgba(217,233,93,.35) 78% 78.3%,transparent 78.3%);
  opacity:.72
}
.s4-mainvisual__image::after{
  content:"";position:absolute;width:190px;height:190px;background:#121613;border:18px solid rgba(255,255,255,.08);left:50%;top:50%;transform:translate(-50%,-50%);
  box-shadow:0 0 0 1px #68756d,0 0 0 42px rgba(22,45,37,.4)
}
.s4-mainvisual__stamp{position:absolute;left:26px;bottom:24px;color:#fff;z-index:2}
.s4-mainvisual__stamp strong{display:block;font-family:Georgia,serif;font-size:2.6rem;line-height:.92}
.s4-mainvisual__stamp span{display:block;font-size:.68rem;letter-spacing:.16em;margin-top:8px}
.s4-mainvisual__text{padding-right:8px}
.s4-mainvisual__date{font-size:.7rem;color:#626a65;font-weight:800;margin-bottom:20px}
.s4-mainvisual h1{
  font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-size:clamp(2.2rem,4vw,4.2rem);line-height:1.18;margin:.15em 0 .45em
}
.s4-mainvisual__text p{color:var(--sub);font-size:.92rem}
.s4-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:18px}
.s4-tags span{border:1px solid #939b95;border-radius:999px;padding:4px 9px;font-size:.66rem}
.s4-mainvisual__buttons{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}
.s4-mainvisual__buttons a{display:inline-flex;min-height:43px;align-items:center;padding:0 15px;border:1px solid #111;border-radius:999px;text-decoration:none;font-size:.78rem;font-weight:900}
.s4-mainvisual__buttons a:first-child{background:#111;color:#fff}

/* summary */
.s4-summary{border:1px solid #d3d8d4;background:#fff;border-radius:14px;padding:20px 24px;margin:0 18px 14px}
.s4-summary ul{margin:0;padding-left:20px}
.s4-summary li{margin:5px 0;font-size:.86rem}
.s4-summary mark{background:var(--acid);padding:0 2px}

/* sections */
.s4-area{background:#fff;border-radius:14px;border:1px solid #d8ddd9;padding:26px 24px;margin:0 18px 14px}
.s4-area__title{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:18px}
.s4-area__title h2{margin:0;font-size:1.05rem}
.s4-area__title p{margin:0;font-size:.72rem;color:var(--sub)}
.s4-list{width:100%;border-collapse:collapse}
.s4-list th,.s4-list td{padding:13px 10px;border-bottom:1px solid #ebeeeb;text-align:left;vertical-align:top;font-size:.82rem}
.s4-list th{font-size:.68rem;color:#7b837e}
.s4-list td:first-child{width:210px;font-weight:900}
.s4-list td:last-child{text-align:right;white-space:nowrap}
.s4-list a{color:#56789e;text-decoration:none}

/* category boxes */
.s4-category{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.s4-category a{border:1px solid #e0e4e0;background:#f8f9f7;border-radius:9px;padding:15px;text-decoration:none;display:flex;gap:11px;min-height:82px}
.s4-category a:hover{background:#f0f2ef}
.s4-category__icon{width:28px;height:28px;border:1px solid #b8beb9;border-radius:6px;display:grid;place-items:center;font-size:.68rem;font-weight:900}
.s4-category strong{display:block;font-size:.84rem;margin-bottom:2px}
.s4-category small{display:block;color:#7a827d;font-size:.68rem;line-height:1.4}

/* price */
.s4-prices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:#e3e7e3;border:1px solid #e3e7e3}
.s4-price{background:#fbfcfa;padding:17px 18px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.s4-price strong{font-size:.84rem}
.s4-price span{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:1.15rem}

/* page */
.s4-page-head{margin:28px 18px 14px;padding:54px 38px;background:#fff;border:1px solid #d8ddd9;border-radius:14px}
.s4-page-head small{font-size:.68rem;letter-spacing:.12em;color:var(--green);font-weight:900}
.s4-page-head h1{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(2.3rem,4vw,4.2rem);margin:.15em 0}
.s4-page-body{background:#fff;border:1px solid #d8ddd9;border-radius:14px;margin:0 18px 14px;padding:32px}
.s4-page-grid{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:48px}
.s4-copy h2{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:1.55rem;margin-top:2.1em}
.s4-copy h3{font-size:1rem;margin-top:1.7em}
.s4-copy table{width:100%;border-collapse:collapse}
.s4-copy th,.s4-copy td{padding:12px;border-bottom:1px solid #e5e9e5;text-align:left;vertical-align:top}
.s4-copy th{width:30%;color:#747c77}
.s4-page-links{position:sticky;top:30px;border:1px solid #dde2dd;border-radius:9px;padding:14px;background:#fafbf9}
.s4-page-links a{display:block;text-decoration:none;padding:8px 0;border-bottom:1px solid #e7eae7;font-size:.78rem;font-weight:800}
.s4-note{padding:16px 18px;background:#f6f8f5;border-left:4px solid var(--green);margin:20px 0}
.s4-mini-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:20px 0}
.s4-mini{border:1px solid #e0e4e0;background:#fafbf9;padding:15px;border-radius:8px}
.s4-mini strong{display:block;margin-bottom:4px}
.s4-map{margin:24px 0;border:1px solid #dde2dd;border-radius:10px;overflow:hidden}
.s4-map__top{padding:14px 15px;background:#fafbf9;border-bottom:1px solid #e0e4e0;display:flex;justify-content:space-between;gap:14px}
.s4-map__top a{text-decoration:none;font-size:.76rem;font-weight:900}
.s4-map iframe{display:block;width:100%;height:360px;border:0}

/* questions */
.s4-questions{margin-top:40px}
.s4-question{border-top:1px solid #e0e4e0}
.s4-question:last-child{border-bottom:1px solid #e0e4e0}
.s4-question summary{cursor:pointer;list-style:none;padding:16px 38px 16px 0;font-weight:900;position:relative}
.s4-question summary::-webkit-details-marker{display:none}
.s4-question summary::after{content:"＋";position:absolute;right:0;color:var(--green)}
.s4-question[open] summary::after{content:"－"}
.s4-question__text{padding:0 0 17px;color:var(--sub)}

/* footer */
.s4-footer{margin-top:20px;padding:34px 18px 80px}
.s4-footer__inner{border-top:1px solid #cdd2ce;padding-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:40px}
.s4-footer h2{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:1.5rem;margin:.2em 0}
.s4-footer ul{list-style:none;padding:0;margin:0}
.s4-footer li{padding:6px 0;border-bottom:1px solid #e0e4e0}
.s4-footer a{color:inherit}
.s4-footer__bottom{margin-top:26px;padding-top:12px;border-top:1px solid #d9ddda;font-size:.68rem;color:#858d88}
.s4-mobile{display:none}

@media(max-width:1100px){
  :root{--rail:210px}
  .s4-circle{width:145px;height:145px}
  .s4-mainvisual{grid-template-columns:1fr;gap:30px}
  .s4-mainvisual__image{min-height:420px}
  .s4-mainvisual__text{padding:0 8px}
  .s4-category{grid-template-columns:repeat(2,minmax(0,1fr))}
  .s4-page-grid{grid-template-columns:1fr}
  .s4-page-links{position:static}
}
@media(max-width:820px){
  .s4-shell{display:block}
  .s4-side{display:none}
  .s4-main{padding:0 7px 70px}
  .s4-topbar{position:sticky;top:0;z-index:70;background:rgba(247,248,246,.94);backdrop-filter:blur(12px);padding:0 8px}
  .admin-bar .s4-topbar{top:46px}
  .s4-mainvisual{padding:16px 7px 26px}
  .s4-mainvisual__image{min-height:340px}
  .s4-mainvisual h1{font-size:clamp(2.2rem,10vw,3.5rem)}
  .s4-summary,.s4-area,.s4-page-head,.s4-page-body{margin-left:0;margin-right:0}
  .s4-category{grid-template-columns:1fr}
  .s4-prices{grid-template-columns:1fr}
  .s4-footer__inner{grid-template-columns:1fr}
  .s4-mobile{display:flex;position:fixed;left:7px;right:7px;bottom:7px;z-index:90;background:#111;padding:6px;gap:6px;border-radius:9px}
  .s4-mobile a{flex:1;display:flex;align-items:center;justify-content:center;min-height:44px;text-decoration:none;font-weight:900;border-radius:6px}
  .s4-mobile__tel{background:#fff;color:#111!important}
  .s4-mobile__line{background:var(--acid);color:#111!important}
}
@media(max-width:560px){
  .s4-mainvisual__image{min-height:280px}
  .s4-summary{padding:17px}
  .s4-area{padding:20px 16px}
  .s4-page-head{padding:38px 20px}
  .s4-page-body{padding:22px 17px}
  .s4-mini-grid{grid-template-columns:1fr}
  .s4-list{display:block;overflow-x:auto}
}


/* K08.3 mobile navigation */
.s4-topbar__mobile-brand{display:none;text-decoration:none;align-items:center;gap:10px;min-width:0;color:inherit}
.s4-topbar__mobile-brand .s4-brand__mark{width:34px;height:34px;font-size:.95rem;flex:0 0 34px}
.s4-topbar__mobile-brand strong{display:block;font-size:.98rem;line-height:1.1;font-weight:900;white-space:nowrap}
.s4-topbar__mobile-brand small{display:block;font-size:.68rem;line-height:1.15;color:var(--sub);white-space:nowrap;margin-top:2px}
.s4-topbar__desktop{display:flex;align-items:center;gap:16px}

@media(max-width:820px){
  .s4-topbar{
    justify-content:space-between;
    height:62px;
    padding:0 12px 0 14px;
    border-bottom:1px solid #e0e4e0;
    gap:12px;
  }
  .s4-topbar__mobile-brand{
    display:flex;
    flex:1 1 auto;
    min-width:0;
  }
  .s4-topbar__desktop{
    display:none;
  }
  .s4-menu-lines{
    width:36px;
    height:24px;
    flex:0 0 auto;
  }
}




/* K08.5 navigation correction */
.s4-topbar__desktop{display:none!important}
.s4-menu-button{
  appearance:none;
  border:0;
  background:transparent;
  width:48px;
  height:48px;
  padding:0;
  margin:0;
  cursor:pointer;
  display:grid;
  place-items:center;
  flex:0 0 48px;
  position:relative;
  z-index:102;
}
.s4-menu-lines{
  width:36px;
  height:24px;
  position:relative;
  display:block;
  flex:0 0 36px;
}
.s4-menu-lines::before,
.s4-menu-lines::after,
.s4-menu-lines span{
  content:"";
  position:absolute;
  left:0;
  width:100%;
  height:2px;
  margin:0;
  padding:0;
  background:#111;
  border-radius:999px;
  transform-origin:center;
  transition:transform .18s ease,top .18s ease,bottom .18s ease,opacity .18s ease;
}
.s4-menu-lines::before{top:1px}
.s4-menu-lines span{top:50%;transform:translateY(-50%)}
.s4-menu-lines::after{bottom:1px}
.s4-menu-button[aria-expanded="true"] .s4-menu-lines::before{
  top:50%;
  transform:translateY(-50%) rotate(45deg);
}
.s4-menu-button[aria-expanded="true"] .s4-menu-lines span{opacity:0}
.s4-menu-button[aria-expanded="true"] .s4-menu-lines::after{
  top:50%;
  bottom:auto;
  transform:translateY(-50%) rotate(-45deg);
}

/* desktop menu */
.s4-mobile-menu{
  display:flex;
  position:fixed;
  top:68px;
  right:14px;
  width:min(360px,calc(100vw - 28px));
  max-height:calc(100vh - 82px);
  overflow:auto;
  flex-direction:column;
  background:#f7f8f6;
  border:1px solid #cfd4cf;
  border-radius:14px;
  padding:10px 18px 16px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-10px);
  transition:opacity .18s ease,visibility .18s ease,transform .18s ease;
  box-shadow:0 18px 42px rgba(0,0,0,.12);
  z-index:98;
}
.admin-bar .s4-mobile-menu{top:100px;max-height:calc(100vh - 114px)}
.s4-mobile-menu.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.s4-mobile-menu a{
  display:block;
  padding:13px 4px;
  border-bottom:1px solid #e0e4e0;
  text-decoration:none;
  font-size:.9rem;
  font-weight:800;
}
.s4-mobile-menu a:last-child{border-bottom:0}

@media(min-width:821px){
  .s4-topbar{justify-content:flex-end;padding-right:4px}
  .s4-topbar__mobile-brand{display:none!important}
}

@media(max-width:820px){
  .s4-topbar{
    justify-content:space-between;
    height:62px;
    padding:0 8px 0 14px;
    border-bottom:1px solid #e0e4e0;
    gap:12px;
  }
  .s4-topbar__mobile-brand{display:flex;flex:1 1 auto;min-width:0}
  .s4-menu-button{width:46px;height:46px;flex-basis:46px}
  .s4-menu-lines{width:34px;height:22px;flex-basis:34px}
  .s4-mobile-menu{
    top:62px;
    left:7px;
    right:7px;
    width:auto;
    max-height:calc(100vh - 70px);
    border-radius:0 0 12px 12px;
    transform:translateY(-10px);
  }
  .admin-bar .s4-mobile-menu{top:108px;max-height:calc(100vh - 116px)}
}
body.s4-menu-open{overflow:hidden}