@charset "utf-8";
/* FAQ全体の枠 */
.faq-container {
  max-width: 800px;
  margin: 20px auto;
}

/* 各Q&Aのブロック（余白と枠線の設定） */
.faq-item {
  margin-bottom: 20px; /* ★ここで各QA間の余白を作っています */
  border: 1px solid #f08400; /* オレンジ色の枠線 */
  border-radius: 8px; /* 角を少し丸くする */
  background-color: #ffffff;
  overflow: hidden; /* 角丸からはみ出さないようにする */
}

/* 質問部分（オレンジ背景・白文字） */
.faq-question {
  padding: 15px 50px 15px 20px; /* アイコン用のスペースを右側に確保 */
  font-weight: bold;
  cursor: pointer;
  list-style: none;
  position: relative;
  background-color: #f08400; /* ★オレンジ背景 */
  color: #ffffff; /* ★白文字 */
  transition: opacity 0.3s;
}

.faq-question:hover {
  opacity: 0.9; /* マウスを乗せた時に少し変化させる */
}

/* デフォルトの三角マーカーを消す */
.faq-question::-webkit-details-marker {
  display: none;
}

/* ＋アイコン（白） */
.faq-question::after {
  content: '+';
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  font-weight: bold;
  font-size: 1.5em;
  color: #ffffff; /* アイコンも白 */
}

/* 開いている時の－アイコン */
.faq-item[open] .faq-question::after {
  content: '-';
}

/* 回答部分（白背景） */
.faq-answer {
  padding: 20px;
  background-color: #ffffff; /* ★白背景 */
  line-height: 1.6;
  color: #333;
}
#c295 {
	clear: both;
	margin:    ;
	padding:    ;
}
#c296 {
	clear: both;
	margin:    ;
	padding:    ;
}
#c296 h3,
#c296 div {
	text-align: left;
}
#c326 {
	clear: both;
	display: none;
	margin:    ;
	padding:    ;
}
#c326 h2,
#c326 div {
	text-align: center;
}
#c327 {
	clear: both;
	display: none;
	margin:    ;
	padding:    ;
}
#c475 {
	clear: both;
	margin:    ;
	padding:    ;
}
#c475 h2,
#c475 div {
	text-align: left;
}
#c447 {
	clear: both;
	margin:    ;
	padding:    ;
}
#c447 h2,
#c447 div {
	text-align: left;
}
#c479 {
	clear: both;
	margin:    ;
	padding:    ;
}
#c479 h2,
#c479 div {
	text-align: left;
}
#c478 {
	clear: both;
	margin:    ;
	padding:    ;
}
#c478 h3,
#c478 div {
	text-align: center;
}
#c477 {
	clear: both;
	margin:    ;
	padding:    ;
}
#c477 h2,
#c477 div {
	text-align: left;
}
#c476 {
	clear: both;
	margin:    ;
	padding:    ;
}
#c476 {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}
#c476 > div.box {
	box-sizing: border-box;
	overflow: hidden;
}
#c476 > div:nth-of-type(1) img {
	width: 400px;
}
#c480 {
	clear: both;
	margin:    ;
	padding:    ;
}
#c480 h2,
#c480 div {
	text-align: left;
}
#c486 {
	clear: both;
	margin:    ;
	padding:    ;
}
#c483 {
	clear: both;
	background-image: url(../images/home/wood00.jpg);
	margin:    ;
	padding:    ;
}
#c484 {
	clear: both;
	background-color: var(--bc);
	margin:    ;
	padding:    ;
}
#c485 {
	clear: both;
	margin:    ;
	padding:    ;
}
@media screen and (min-width: 641px) and (max-width: 834px) {
#c295 {
}
#c296 {
}
#c326 {
	display: none;
}
#c327 {
	display: none;
}
#c475 {
}
#c447 {
}
#c479 {
}
#c478 {
}
#c477 {
}
#c476 {
}
#c476 {
}
#c480 {
}
#c486 {
}
#c483 {
}
#c484 {
}
#c485 {
}
}
@media screen and (max-width: 640px) {
#c295 {
}
#c296 {
}
#c326 {
	display: none;
}
#c327 {
	display: none;
}
#c475 {
}
#c447 {
}
#c479 {
}
#c478 {
}
#c477 {
}
#c476 {
}
#c476 {
}
#c480 {
}
#c486 {
}
#c483 {
}
#c484 {
}
#c485 {
}
}
