
.intro {
  text-align: center;
  padding: 40px 20px;
}
.intro h2 {
  color: #009345;
  font-size: 60px;
}
.intro h1 {
  font-size: 32px;
  color: #d46f00;
  margin-top: 10px;
}

/* ===== Q&Aグリッド ===== */
.qa-grid {
	width:98%;
	max-width:1280px;
  display: flex;
  gap: 30px;
	margin:0 auto;
  padding: 40px 20px;
  flex-wrap: wrap;
}
.qa-text {
  flex: 1;
	min-width: 300px;
	max-width:640px;
}
.qa-text h3 {
	font-size: 24px;
	color: #222;
	margin: 10px 0;
	padding:0 1em 0.5em 1em;
	text-indent:-1em;
	border-bottom:#089457 2px solid;
}
.qa-text p {
  font-size: 16px;
  line-height: 1.9;
  margin-bottom: 30px;
}
.qa-images {
	width:100%;
	max-width:519px;
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}
.qa-images img {
	width: 252px;
	height:240px;
	border: 1px solid #ccc;
}
.qa-images img:nth-child(2){
	margin-top:80px;
}
.qa-images img:nth-child(3){
	margin-top:-80px;
}
.qa-images img:nth-child(5){
	margin-top:-80px;
}


/* ===== 単独Q&Aブロック ===== */
.qa-section {
/*
  padding: 40px 20px;
*/
	width:98%;
	max-width:1280px;
	display: flex;
	gap: 30px;
	margin:0 auto;
	padding: 40px 20px;
	flex-wrap: wrap;
}
.qa-block {
	min-width: 300px;
	max-width:640px;
}
.qa-block h3 {
	font-size: 24px;
	color: #222;
	margin: 10px 0;
	padding:0 1em 0.5em 1em;
	text-indent:-1em;
	border-bottom:#089457 2px solid;
}
.qa-block p {
  margin-top: 10px;
  font-size: 16px;
  line-height: 1.9;
}

/* ===== 画像2列（帽子・制服） ===== */
.double-images {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 30px;
}
.double-images img {
	width: 252px;
	height:240px;
  border: 1px solid #ccc;
}
.double-images img:nth-child(2){
	margin-top:80px;
}

.comment-bubbles {
  display: flex;
  justify-content: center;
  gap: 60px;
  flex-wrap: wrap;
}
.comment-bubbles img{
	width:100%;
	max-width:530px;
	height:auto;
}

/* ===== メディアクエリ（スマホ・タブレット対応） ===== */
@media (max-width: 768px) {
  .intro h1 {
    font-size: 24px;
  }
  .qa-grid {
    flex-direction: column;
    gap: 20px;
  }
  .qa-text, .qa-images {
    width: 100%;
	  justify-content: center;
  }
  .double-images {
    align-items: center;
  }
  .double-images img {
    width: 90%;
    max-width: 300px;
  }
  .comment-bubbles {
    gap: 30px;
  }
  .bubble {
    font-size: 15px;
    max-width: 100%;
  }
	.qa-images img:nth-child(2){
		margin-top:0;
	}
	.qa-images img:nth-child(3){
		margin-top:0;
	}
	.qa-images img:nth-child(5){
		margin-top:0;
	}
	.double-images img:nth-child(2){
		margin-top:0;
	}
}

.hdn {
	visibility: hidden;
	margin:8px;
}
