@charset "UTF-8";

/* ====================================
	共通スタイル
 ==================================== */

/* .sub-title::before {
	content: '';
	display: inline-block;
	width: 80px;
	height: 80px;
	background-image: url(images/icon1.png);
	background-size: contain;
	background-repeat: no-repeat;
	vertical-align: middle;
	position: relative;
	top: 5px;
} */

.sub-title {
	padding-left: 3.8em;
	padding-bottom: 1rem;
	padding-top: 1rem;
	background-repeat: no-repeat;
	background-position: left center;
	background-size: auto 100%;
}

.sub-title.talk {
	background-image: url(images/midashi-talk.jpg);
}

.sub-title.write {
	background-image: url(images/midashi-write.jpg);
}

.sub-title.listen {
	background-image: url(images/midashi-listen.jpg);
}

.sub-title.read {
	background-image: url(images/midashi-read.jpg);
}

#sub01 .small-text {
	margin-top: 0.2rem;
}

#sub01 .small-text .bold {
	margin-top: 0.2rem;
	text-align: left;
}

#sub01 .small-text .text {
	margin-top: 0.2rem;
	line-height: 1.4;
	text-align: left;
}


/* ====================================
	スマートフォン専用スタイル
===================================== */
@media only screen and (max-width: 767px) {
	.pc-only {
		display: none;
	}

	.btn-arrow {
		display: block;
		text-align: center;
	}

	.btn-arrow a {
		padding: 0.7em 1em 0.7em 2em;
		display: block;
		font-size: 1.4rem;
	}

	.sub-title::before {
		width: 50px;
		height: 50px;
		position: relative;
		top: 3px;
	}



	.sub-title {
		padding-left: 2.8em;
		padding-bottom: 1rem;
		padding-top: 1rem;
		background-size: auto 1.8em;
	}




	/* #sub02 ul.list-figures.sp-col2,
	#sub04 ul.list-figures.sp-col2 {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	} */

	#sub01 .small-text .bold {
		font-size: 1.4rem;
		text-align: center;
	}

	#sub01 .small-text .text {
		text-align: center;
	}
}

/* ====================================
	PC&タブレット、印刷専用スタイル
===================================== */
@media print,
screen and (min-width: 768px) {

	.btn-arrow {
		margin: 0 auto;
		line-height: 1.4;
	}

	.flex-container.fix-bottom-img .img-container {
		min-height: 0%;
		/* IE対応 */
		margin-top: auto;
	}

	.flex-container.fix-bottom-img .img-container.has-cap {
		padding-bottom: 2.2rem;
	}

	#sub01 .small-text .bold {
		font-size: 1.6rem;
	}

	#sub01 .list-figures.has-frame.img-container {
		margin-top: 6rem;
	}

	#sub03 .flex-container.half>.flex-item {
		width: 46%;
	}

	#sub03 .list-figures.col2 li:first-child {
		margin-left: -1.6%;
	}



}

/* ====================================
	タブレット、印刷専用スタイル
===================================== */
@media only screen and (min-width: 768px) and (max-width: 1079px) {
	.pc-only {
		display: none;
	}

	ul.list-figures.tab-col3.center {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}

}

/* ====================================
	PC大画面専用スタイル
===================================== */
@media only screen and (min-width: 1080px) {
	.tab-only {
		display: none;
	}

	ul.list-figures.center {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
}