@charset "UTF-8";

/* -----------------------------------------------
FileName: common.css
----------------------------------------------- */
.pc {display:block !important;}
.sp {display:none !important;}

/* ===============================
   ロゴ
=============================== */
#logo span {
	display:block;
	text-align:center;
	color:#6d5231;
	font-family: "Noto Serif JP";
	margin:0 0 .5em 0;
	line-height:1em;
	font-size:.9em;
}

#logo a #logoSvg {
	width:157px;
	height:46px;
}

/* ===============================
   グローバルナビ
=============================== */
nav.gNavi #logo {
	float:left;
	margin:15px 0 0 40px ;
}

nav.gNavi ul {
	float:right;
	padding:0;
}

nav.gNavi li {
	display:inline-block;
	vertical-align:middle;
	margin: 0 1.7em 0 0;
	font-size:13px;
	letter-spacing:.2em;
	font-weight:bold;
	font-family: "Noto Serif JP";
}

nav.gNavi li:last-child {
	margin:0;
}

nav.gNavi li a {
	color:#1e1e1e;
	display:block;
}

nav.gNavi li a:hover {
	text-decoration:none;
	opacity:.6;
}

nav.gNavi li.tel a {
	color:#a48b69;
	font-size:24px;
	font-weight:400;
	letter-spacing:0;
}

nav.gNavi li.contactBtn a {
	color:#fff;
	background:#a58c69;
	font-size:14.5px;
	padding:2em 1.5em;
	line-height:1.4em;
	font-weight:normal;
	text-align:center;
}

/* ===============================
   見出し
=============================== */
h2.title {
	font-size:28px;
	font-family: "Noto Serif JP";
	letter-spacing:.2em;
	text-align:center;
	margin:0 0 2em 0;
	line-height:1.5em;
}

.home h2.title {
	margin:0 0 .5em 0;
}

h3.title {
	font-size:15px;
	font-family: "Noto Serif JP";
	letter-spacing:.2em;
	text-align:center;
	color:#505050;
	margin:0 0 2em 0;
	line-height:1.8em;
}

/* ===============================
   Hero
=============================== */
#heroText {
    text-align: center;
    padding: 80px 20px;   /* ← ここ元通り */
}

#heroText .hero-main {
    font-size: 24px;
    font-weight: bold;
    letter-spacing: 0.1em;
    margin-bottom: 12px;
    font-family: "Hiragino Mincho Pro","Yu Mincho",serif;
}

#heroText .hero-sub {
    font-size: 16px;
    letter-spacing: 0.1em;
    color: #666;
    font-family: "Hiragino Mincho Pro","Yu Mincho",serif;
}

/* ===============================
   ボタン共通
=============================== */
.moreBtn a,
.business-btn {
	font-family: "Noto Serif JP";
	display:block;
	letter-spacing:0.2em;
	padding:1em 3.5em;
	border:1px solid #a48b69;
	color:#fff;
	background:#a48b69;
	text-decoration:none;
	text-align:center;
	width:12em;
	margin:0 auto;
	transition:.3s;
}

.moreBtn a:hover,
.business-btn:hover {
	color:#a48b69;
	background:#fff;
}

/* ===============================
   トップ：事業内容（完成版）
=============================== */
#businessArea {
	display:grid;
	grid-template-columns: repeat(3, 225px);
	gap:40px;
	justify-content:center;
	margin:0 auto;
}

#businessArea dl {
	float:none;
	width:auto;
	margin:0;
	text-align:center;
}

#businessArea dt img {
	width:225px;
	height:225px;
	object-fit:cover;
}

#businessArea dd.title {
	margin:1em 0 .5em;
	font-family:"Noto Serif JP";
	letter-spacing:.2em;
}

#businessArea dd.note {
	font-size:13px;
	line-height:1.8;
}

#businessArea dd.btn {
	margin-top:10px;
}

/* ===============================
   フッター
=============================== */
#footer {
	position:relative;
}

#footer #footLogo #logoSvg {
	width:215px;   /* ← 元サイズ */
	height:auto;
}

#footer #footLogo {
	float:left;
	margin:0 50px 0 0;
}

/* ===============================
   レスポンシブ
=============================== */
@media screen and (max-width: 768px) {

  .pc {display:none !important;}
  .sp {display:block !important;}

  #businessArea {
    grid-template-columns: 1fr;
    gap:30px;
    justify-items: center;   /* ← 追加：中身を中央寄せ */
  }

  #businessArea dl {
    text-align: center;       /* ← テキストも中央に */
  }
}


/* ===============================
   私たちの取り組み（bnArea）
=============================== */
#bnArea ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* PCは横3列 */
  gap: 20px;
  list-style: none;
  padding: 0;
  margin: 30px 0 0 0;
}

#bnArea ul li {
  margin: 0;
}

#bnArea ul li a {
  display: block;
}

#bnArea ul li img {
  width: 100%;
  height: auto;
  display: block;
}

/* スマホは2列 */
@media screen and (max-width: 768px) {
  #bnArea ul {
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
  }
}