/* about us
----------------------------------------------------------------- */

#about-us .txt-box {
	text-align: center;
	padding: 60px;
}

#about-us .item-wrap {
	margin-top: 60px;
}

#about-us .column-3 .item .ttl {
	margin-top: 20px;
	font-size: 2.2rem;
	line-height: 1.45;
	text-align: center;
}

@media screen and (max-width: 767px) {
	#about-us .txt-box {
		padding: 40px 25px;
	}
}

/* course-price
----------------------------------------------------------------- */
/*comiruなどアプリの紹介セクション非表示時のみ調整*/
#course-price {
	padding-bottom: 0;
}

/* comiru
----------------------------------------------------------------- */

.comiru-box {
	padding: 20px 20px 20px 60px;
	border-radius: 20px;
	row-gap: 40px;
}

.comiru-box .main-ttl {
	margin-top: 40px;
	padding: 0;
}

.comiru-box .main-ttl::before {
	display: none;
}

.comiru-box .img-box {
	align-self: center;
}

.comiru-box img {
	border-radius: 20px;
}

@media screen and (min-width: 768px) {
	.comiru-box.image-text-item {
		grid-template-areas:
			"title img-box "
			"text-box img-box";
	}
}

@media screen and (max-width: 767px) {
	.comiru-box {
		padding: 50px 15px;
		row-gap: 20px;
	}

	.comiru-box .main-ttl {
		margin-top: 0;
	}
}

/* recruit
----------------------------------------------------------------- */
#recruit {
	padding-top: 0;
}

.recruit-box {
	padding: 20px;
	background: #FFF5E5;
	position: relative;
	overflow: hidden;
}

.recruit-box::before {
	content: '';
	display: block;
	width: 140%;
	aspect-ratio: 1/1;
	border-radius: 50%;
	box-shadow: inset 0 0 80px #FFE8C4;
	position: absolute;
	top: 0;
	right: 0;
	transform: translateY(-50%);
}

.recruit-box > * {
	position: relative;
}

.recruit-box .main-ttl {
	padding: 0;
}

.recruit-box .main-ttl::before {
	display: none;
}

.recruit-box .img-box {
	display: grid;
	grid-template-areas:
		"img01 img01"
		"img02 img03";
	grid-template-columns: 43% 1fr;
	gap: 10px;
	align-self: center;
}

.recruit-box .img-box img:nth-child(1) {
	grid-area: img01;
}

.recruit-box .img-box img:nth-child(2) {
	grid-area: img02;
}

.recruit-box .img-box img:nth-child(3) {
	grid-area: img03;
}

@media screen and (min-width: 768px) {
	.recruit-box .main-ttl {
		margin-top: 60px;
		text-align: left;
	}
}

@media screen and (max-width: 767px) {
	.recruit-box {
		padding: 50px 20px;
	}

	.recruit-box::before {
		width: auto;
		height: 140%;
		top: unset;
		bottom: 0;
		right: unset;
		left: 0;
		transform: translateX(-50%);
	}
}