/* ===== ヘッダー下の余白調整・親テーマの横幅リセット ===== */
.home.page:not(.page-template-template-homepage) .site-header,
.home.post-type-archive-product .site-header { margin-bottom: 0 !important; }

.col-full{ max-width: 100%!important; padding: 0!important; }

/* ===== ベース ===== */
.headset-jade { font-family: Arial, sans-serif; color:#333; line-height:1.6; }
section { padding: 0; }
h2 { font-size:24px; margin-bottom:20px; }

/* ===== ヒーロー ===== */
.hero{ width:100%; overflow:hidden; }
.hero-banner{
  width: 100%;
  height: 500px;
  background-image: url('/wp-content/uploads/2025/07/8f67b68d611b07243b69ab33f205cabb.jpg');
  background-size: cover;
  background-position: center;
}

/* ===== 取扱いブランド ===== */
.brands-section{ padding:40px 20px; text-align:center; }
.brands-title{
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 16px;
  max-width: 1200px;
  margin-inline: auto;
  text-align: left;
}
.brands-container{
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    justify-content: center;
    width: 1240px;
    margin: 0 auto;
    text-align: left;
}

.brand-card{
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .1);
    padding: 14px 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 23%;
    height: 140px;
    margin: 10px 0 10px;
}

.brand-card img{ max-width:100%; max-height:100%; object-fit:contain; }

/* ===== カテゴリから探す ===== */
.category-section a{ color:#000; }
.category-group a{ font-size:14px;}

.category-section{
  position:relative; background:#f9f9fb; padding:60px 20px;
  max-width:1200px; margin:0 auto;
}
.ribbon-category{
  position:absolute; top:-10px; left:-10px; width:150px; height:auto;
  z-index:2; pointer-events:none;
}
.category-title{ text-align:center; font-size:24px; font-weight:700; margin-bottom:40px; }
.category-border{ border:0; border-top:1px solid #999; margin-bottom:16px; }

.category-group{ position:relative; margin-bottom:60px; }
.category-header{ display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.category-icon-img{ width:80px; height:auto; }
.category-heading{ font-size:20px; font-weight:700; margin:0; }

.category-columns{
  display:flex; flex-wrap:wrap; gap:32px 40px; margin-top:24px;
}
.column{ width:calc(33.333% - 26.66px); min-width:200px; }
.column h4{ font-size:18px; font-weight:700; margin-bottom:15px; }
.column ul{ list-style:none; padding:0; margin:0; }
.column ul li{ font-size:14px; margin-bottom:4px; }

/* ===== リコメンド（比較・提案） ===== */
.recommend-box{
  position:relative; background:#fff; border-radius:12px; padding:40px 20px;
  max-width:680px; margin:40px auto; text-align:center;
  box-shadow:0 4px 10px rgba(0,0,0,.1);
}
.ribbon{
  position:absolute; top:-10px; left:-10px; width:150px; height:auto;
  z-index:2; pointer-events:none;
}
.recommend-content{ margin-top:20px; }
.recommend-title{ font-size:16px; font-weight:700; margin-bottom:8px; }
.recommend-text{ font-size:14px; margin-bottom:24px; }
.recommend-button{
  display:inline-block; padding:14px 28px; border-radius:12px;
  background:#1f1f6b; color:#fff; text-decoration:none; font-size:14px;
  box-shadow:0 4px 6px rgba(0,0,0,.2); transition:background-color .3s;
}
.recommend-button:hover{ background:#3535a5; }

/* ===== 相談カード ===== */

/* カードの共通体裁（背景画像は .card1~3 で指定） */
.inquiry-cards{
  display:flex; gap:24px; justify-content:center; flex-wrap:wrap;
  max-width:1200px; margin:0 auto;
}
.inquiries-section{ background:#e8e6f0; padding:60px 20px; }

.inquiry-card{
 	position:relative;
	width:32%; 
	height:420px; 
	overflow:hidden;
  	background-size:cover; 
	background-position:center;
  	box-shadow:0 4px 12px rgba(0,0,0,.15);
}

/* 背景画像 */
.card1{ background-image:url('/wp-content/uploads/2025/07/03436c4bf7a9eeb1e8636263ded1449a.jpg'); }
.card2{ background-image:url('/wp-content/uploads/2025/07/fd45f22924a7072f8c9650f9ef23f5f3.jpg'); }
.card3{ background-image:url('/wp-content/uploads/2025/07/39a68e177ea1d34451b1716a446b5ecf.jpg'); }

/* リボン */
.ribbon-label{
  position:absolute; top:-10px; left:-10px; width:150px; height:auto;
  z-index:2; pointer-events:none;
}

/* --- 相談カード：テキスト＆ボタン位置揃え --- */
.inquiry-content{
  position:absolute;
  top:90px;
  left:20px;
  right:20px;
  bottom:24px;
  transform:none;
  width:auto;
  padding:0;
  display:flex;
  flex-direction:column;
  text-align:center;
  color:#fff;
  z-index:1;
}

.inquiry-content h3{
  margin:0 0 16px;
  font-size:24px;
  font-weight:700;
  color:#fff;
  line-height:1.3;
  min-height:2.6em;  /* 見出し2行分想定 */
}

.inquiry-content p{
  font-size:16px;
  line-height:1.7;
  margin:20px 0 0px;
  min-height:3.4em;  /* 説明2行分想定 */
}

.inquiry-button{
  display:inline-block;
  padding:10px 20px;
  border-radius:999px;
  background:#1f1f6b;
  color:#fff;
  text-decoration:none;
  font-size:22px;
  transition:background-color .3s;
  border:#fff 1px solid;
  width:100%;
  margin-top:auto;
  margin-bottom: 40px;/* 下寄せ */
}
.inquiry-button:hover{ background:#3c3c91; }

/* ===== ブログ ===== */
.blog-section{
  background:#3c4370; padding:60px 20px; color:#fff; text-align:center;
}
.section-title{ font-size:24px; font-weight:700; margin-bottom:40px; color:#fff; }
.blog-container{
  display:flex; justify-content:center; gap:24px; flex-wrap:wrap;
  background:#fff; color:#000; padding:40px 20px; max-width:1200px; margin:0 auto;
}
.blog-card{
	width: 320px;
    margin: 0 10px;
    text-align: left;
}
.blog-link{ color:inherit; text-decoration:none; }
.blog-thumb img{ width:100%; height: 200px; }
.blog-date{
	font-size: 12px;
    color: #555;
    margin: 8px 5px;
}
.blog-title{
	font-size: 16px;
    font-weight: 600;
    margin: 20px 5px 0 5px;
    line-height: 1.4;
}
.blog-button-wrap{ 
	margin-top:0px; 
}

.blog-button{
    display: inline-block;
    padding: 14px 32px;
    border-radius: 999px;
    background: #1f1f6b;
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    width: 250px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, .2);
    transition: background-color .3s;
}
.blog-button:hover{ background:#3535a5; }

/* ===== 運営サイト ===== */
.operation-sites{ padding:60px 20px; background:#fff; text-align:center; }
.operation-sites-title{ 
	font-size:24px; 
	font-weight:700; 
	margin-bottom:40px; 
}

.operation-card-list{
	display:flex; flex-wrap:wrap;
	justify-content:center;
	gap:24px;
	max-width:1200px;
	margin:0 auto;
}
.operation-card{
 	width:32%;
	background:#fff; 
	padding: 20px 16px 50px;
  	box-shadow:0 4px 12px rgba(0,0,0,.1); 
	text-decoration:none;
	color:#000;
  	overflow:hidden; 
	transition:transform .3s ease;
	border-radius: 20px;
}
.operation-card:hover{ transform:translateY(-4px); }
.operation-img{
	width: 80%;
    height: auto;
    margin: 0 auto;
	padding: 30px 0;
	}

.operation-logo{ 
	width: 80%;
    font-size: 18px;
    font-weight: 700;
    margin: 0 auto;
}

.operation-desc{
	font-size: 22px;
    font-weight: 500;
    margin-top: 30px;
    color: #333;
}

/* ===== レスポンシブ ===== */
@media (max-width: 1024px){
  .column{ width:calc(50% - 20px); }
}
@media (max-width: 680px){
  .column{ width:100%; }
  .inquiry-card{ width:100%; max-width:420px; }
}
