/* ===== Reset & Base ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth}
body{
  font-family:"Noto Sans JP","Hiragino Sans","Yu Gothic",sans-serif;
  background:#FAFAFA;color:#202124;line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
a{color:#1a73e8;text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
.container{max-width:1200px;margin:0 auto;padding:0 16px}

/* ===== Header ===== */
.site-header{
  background:#fff;border-bottom:1px solid #e0e0e0;position:sticky;top:0;z-index:100;
}
.header-top{
  display:flex;align-items:center;justify-content:space-between;padding:12px 16px;max-width:1200px;margin:0 auto;
}
.logo{font-size:1.4rem;font-weight:700;color:#1a237e;text-decoration:none;line-height:1.3}
.logo small{display:block;font-size:.7rem;font-weight:400;color:#5f6368}
.header-phone{
  display:inline-flex;align-items:center;gap:6px;
  background:#e6f3ff;color:#1a73e8;font-weight:700;font-size:1.1rem;
  padding:8px 16px;border-radius:999px;white-space:nowrap;
}
.header-phone .phone-icon{font-size:1.2rem}
.trust-badges{
  display:flex;gap:12px;justify-content:center;flex-wrap:wrap;
  background:#f0f7ff;border-bottom:1px solid #e0e0e0;padding:8px 16px;font-size:.8rem;color:#1a237e;font-weight:600;
}
.trust-badge{display:inline-flex;align-items:center;gap:4px}

/* ===== Breadcrumb ===== */
.breadcrumb{font-size:.8rem;color:#5f6368;padding:12px 0}
.breadcrumb a{color:#1a73e8}
.breadcrumb span{margin:0 6px;color:#999}

/* ===== Hero ===== */
.hero{
  background:linear-gradient(135deg,#1a237e 0%,#1a73e8 100%);
  color:#fff;padding:48px 16px;text-align:center;
}
.hero h1{font-size:2.2rem;font-weight:700;margin-bottom:12px}
.hero p{font-size:1.1rem;opacity:.92;max-width:640px;margin:0 auto 24px}
.hero-stats{
  display:flex;gap:32px;justify-content:center;flex-wrap:wrap;margin-top:24px;
}
.hero-stat{text-align:center}
.hero-stat .num{font-size:2rem;font-weight:700}
.hero-stat .label{font-size:.8rem;opacity:.85}
.category-nav{
  display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:20px;
}
.category-nav a{
  background:rgba(255,255,255,.18);color:#fff;padding:8px 18px;border-radius:999px;
  font-size:.85rem;font-weight:600;transition:background .2s;
}
.category-nav a:hover{background:rgba(255,255,255,.32);text-decoration:none}

/* ===== Trust Section ===== */
.trust-section{padding:48px 16px;background:#fff}
.trust-section .container{max-width:1100px}
.trust-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;margin-top:24px}
.trust-card{text-align:center;padding:24px}
.trust-card .icon{font-size:2.8rem;margin-bottom:12px}
.trust-card h3{font-size:1.15rem;color:#1a237e;margin-bottom:8px}
.trust-card p{font-size:.9rem;color:#5f6368}

/* ===== Section ===== */
.section{padding:48px 0}
.section-title{
  text-align:center;font-size:1.6rem;font-weight:700;color:#1a237e;margin-bottom:8px;
}
.section-subtitle{text-align:center;color:#5f6368;font-size:.95rem;margin-bottom:32px}

/* ===== Category Section ===== */
.category-section{margin-bottom:40px}
.category-heading{
  font-size:1.3rem;font-weight:700;color:#1a237e;
  border-left:4px solid #1a73e8;padding-left:12px;margin-bottom:16px;
}

/* ===== Product Grid ===== */
.product-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;
}
.product-card{
  background:#fff;border-radius:12px;box-shadow:0 1px 3px rgba(0,0,0,.08);
  overflow:hidden;transition:box-shadow .2s,transform .2s;display:flex;flex-direction:column;
}
.product-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.15);transform:translateY(-2px)}
.product-card .card-img{
  aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.product-card .card-img img{width:100%;height:100%;object-fit:cover}
.product-card .card-body{padding:14px 16px;flex:1;display:flex;flex-direction:column}
.product-card .card-badges{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.badge{
  display:inline-block;font-size:.7rem;font-weight:600;padding:3px 8px;border-radius:6px;
}
.badge-category{background:#e6f3ff;color:#1a73e8}
.badge-maker{background:#f3e8ff;color:#7b1fa2}
.badge-year{background:#e8f5e9;color:#2e7d32}
.product-card h3{font-size:.95rem;font-weight:600;color:#202124;margin-bottom:6px}
.product-card .card-spec{font-size:.78rem;color:#5f6368;margin-bottom:8px}
.product-card .card-price{margin-top:auto}
.price-excl{font-size:1.4rem;font-weight:700;color:#d93025}
.price-excl small{font-size:.75rem;font-weight:400}
.price-incl{font-size:.8rem;color:#5f6368}
.product-card .card-btn{
  display:block;text-align:center;background:#1a73e8;color:#fff;font-weight:600;
  padding:10px;border-radius:8px;margin-top:10px;font-size:.85rem;transition:background .2s;
}
.product-card .card-btn:hover{background:#1557b0;text-decoration:none}

/* ===== Process Section ===== */
.process-section{background:#f0f7ff;padding:48px 16px}
.process-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;max-width:1100px;margin:0 auto}
.process-step{text-align:center}
.process-step .step-num{
  width:48px;height:48px;background:#1a73e8;color:#fff;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:700;margin-bottom:12px;
}
.process-step h4{font-size:1rem;color:#1a237e;margin-bottom:6px}
.process-step p{font-size:.85rem;color:#5f6368}

/* ===== Testimonials ===== */
.testimonials{padding:48px 16px;background:#fff}
.testimonial-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;max-width:1100px;margin:0 auto}
.testimonial-card{
  background:#f8f9fa;border-radius:12px;padding:24px;border-left:4px solid #1a73e8;
}
.testimonial-card .stars{color:#ffb300;font-size:1rem;margin-bottom:8px}
.testimonial-card .text{font-size:.9rem;color:#202124;margin-bottom:12px}
.testimonial-card .author{font-size:.82rem;color:#5f6368;font-weight:600}

/* ===== FAQ ===== */
.faq-section{padding:48px 16px;background:#f8f9fa}
.faq-list{max-width:800px;margin:0 auto}
.faq-item{
  background:#fff;border-radius:8px;margin-bottom:8px;overflow:hidden;
  border:1px solid #e0e0e0;
}
.faq-item summary{
  padding:16px 20px;cursor:pointer;font-weight:600;color:#1a237e;font-size:.95rem;list-style:none;
  display:flex;justify-content:space-between;align-items:center;
}
.faq-item summary::after{content:"＋";font-size:1.2rem;color:#1a73e8}
.faq-item[open] summary::after{content:"－"}
.faq-item summary::-webkit-details-marker{display:none}
.faq-answer{padding:0 20px 16px;font-size:.88rem;color:#5f6368;line-height:1.7}

/* ===== Product Detail Page ===== */
.product-detail{display:grid;grid-template-columns:1fr 1fr;gap:32px;max-width:1100px;margin:0 auto}
.product-image-area{
  background:#fff;border-radius:12px;padding:24px;text-align:center;
  box-shadow:0 1px 3px rgba(0,0,0,.08);
}
.product-image-area img{max-width:100%;border-radius:8px}
.product-info h1{font-size:1.4rem;font-weight:700;color:#202124;margin-bottom:8px}
.product-info .detail-badges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.price-box{
  background:#fff;border-radius:12px;padding:20px;margin-bottom:20px;
  box-shadow:0 1px 3px rgba(0,0,0,.08);
}
.price-box .price-excl{font-size:2.2rem}
.price-box .price-incl{font-size:1rem;margin-top:4px}
.price-box .saving{
  display:inline-block;background:#e8f5e9;color:#2e7d32;font-size:.82rem;font-weight:600;
  padding:4px 10px;border-radius:6px;margin-top:8px;
}
.order-btn{
  display:block;width:100%;background:#d93025;color:#fff;font-size:1.2rem;font-weight:700;
  text-align:center;padding:16px;border-radius:10px;border:none;cursor:pointer;
  transition:background .2s;text-decoration:none;
}
.order-btn:hover{background:#b71c1c;text-decoration:none}
.spec-table{width:100%;border-collapse:collapse;margin-bottom:20px}
.spec-table th,.spec-table td{padding:10px 14px;border-bottom:1px solid #e0e0e0;font-size:.88rem;text-align:left}
.spec-table th{background:#f8f9fa;color:#5f6368;font-weight:600;white-space:nowrap;width:140px}
.warranty-box,.option-box{
  background:#fff;border-radius:12px;padding:20px;margin-bottom:20px;
  box-shadow:0 1px 3px rgba(0,0,0,.08);
}
.warranty-box h3,.option-box h3{font-size:1rem;color:#1a237e;margin-bottom:10px}
.warranty-box ul,.option-box ul{list-style:none;padding:0}
.warranty-box li,.option-box li{font-size:.85rem;color:#5f6368;padding:4px 0;padding-left:20px;position:relative}
.warranty-box li::before,.option-box li::before{content:"✓";position:absolute;left:0;color:#2e7d32;font-weight:700}
.related-products{margin-top:40px}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}

/* ===== Order Form ===== */
.order-form{max-width:700px;margin:0 auto;background:#fff;border-radius:12px;padding:32px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.form-group{margin-bottom:20px}
.form-group label{display:block;font-weight:600;font-size:.88rem;color:#202124;margin-bottom:6px}
.form-group label .required{color:#d93025;font-size:.78rem;margin-left:4px}
.form-group input,.form-group select,.form-group textarea{
  width:100%;padding:10px 12px;border:1px solid #ccc;border-radius:8px;font-size:.92rem;
  font-family:inherit;background:#fff;
}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{
  border-color:#1a73e8;outline:none;box-shadow:0 0 0 3px rgba(26,115,232,.12);
}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-note{
  background:#e6f3ff;border-radius:8px;padding:12px 16px;font-size:.82rem;color:#1a237e;margin-top:16px;
}
.form-submit{
  display:block;width:100%;background:#1a73e8;color:#fff;font-size:1.1rem;font-weight:700;
  padding:16px;border-radius:10px;border:none;cursor:pointer;transition:background .2s;margin-top:8px;
}
.form-submit:hover{background:#1557b0}

/* ===== About Page ===== */
.about-section{max-width:900px;margin:0 auto;padding:24px 0}
.about-section h2{font-size:1.3rem;color:#1a237e;margin-bottom:12px;border-left:4px solid #1a73e8;padding-left:12px}
.about-section p,.about-section li{font-size:.92rem;color:#5f6368;line-height:1.8;margin-bottom:8px}
.company-table{width:100%;border-collapse:collapse;margin:16px 0}
.company-table th,.company-table td{padding:12px 16px;border-bottom:1px solid #e0e0e0;text-align:left;font-size:.9rem}
.company-table th{background:#f8f9fa;font-weight:600;color:#1a237e;width:200px}

/* ===== Guide Page ===== */
.guide-section{max-width:800px;margin:0 auto;padding:24px 0}
.guide-section h2{font-size:1.3rem;color:#1a237e;margin-bottom:12px;margin-top:32px}
.guide-section p{font-size:.92rem;color:#5f6368;line-height:1.8;margin-bottom:12px}
.guide-section ul{padding-left:20px;margin-bottom:12px}
.guide-section li{font-size:.9rem;color:#5f6368;line-height:1.8}

/* ===== Footer ===== */
.site-footer{background:#1a237e;color:rgba(255,255,255,.82);padding:40px 16px 20px}
.footer-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;max-width:1200px;margin:0 auto 24px;
}
.footer-col h4{color:#fff;font-size:.95rem;margin-bottom:12px}
.footer-col ul{list-style:none;padding:0}
.footer-col li{margin-bottom:6px}
.footer-col a{color:rgba(255,255,255,.72);font-size:.85rem}
.footer-col a:hover{color:#fff}
.footer-bottom{
  text-align:center;font-size:.78rem;color:rgba(255,255,255,.5);
  border-top:1px solid rgba(255,255,255,.12);padding-top:16px;max-width:1200px;margin:0 auto;
}

/* ===== Responsive ===== */
@media(max-width:768px){
  .hero h1{font-size:1.6rem}
  .hero p{font-size:.95rem}
  .header-phone{font-size:.9rem;padding:6px 12px}
  .header-phone .phone-icon{font-size:1rem}
  .product-detail{grid-template-columns:1fr;gap:16px}
  .form-row{grid-template-columns:1fr}
  .product-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
  .hero-stats{gap:16px}
  .hero-stat .num{font-size:1.4rem}
  .trust-badges{font-size:.72rem;gap:8px}
  .section{padding:32px 0}
  .trust-section,.process-section,.testimonials,.faq-section{padding:32px 16px}
  .order-form{padding:20px}
}
@media(max-width:480px){
  .product-grid{grid-template-columns:1fr 1fr;gap:12px}
  .product-card .card-body{padding:10px}
  .product-card h3{font-size:.82rem}
  .price-excl{font-size:1.1rem}
  .logo{font-size:1.1rem}
  .header-top{flex-direction:column;gap:8px;align-items:flex-start}
}