@charset "UTF-8";

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

/* プラズマクラスター7000の効果 */
.pci-container {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	row-gap: 4rem;
}

.pci-text {
	flex: 1 0;
}

.pci-logo {
	inline-size: 340px;
	max-inline-size: 340px;
	margin-inline: auto;
	position: relative;
}

.pci-logo sup {
	position: absolute;
	top: 60%;
	right: 22%;
}

.sub-section-text-box {
	margin-top: 4rem;
	border: 1px solid #707070;
	padding: 2rem 3rem 3rem;
	font-weight: 400;
}

.sub-section-text-box p {
	margin-top: 1.5rem;
}

/* ====================================
	ホバーが有効な環境のみ
===================================== */
@media (hover:hover) and (pointer: fine) {}

/* ====================================
	スマートフォン専用スタイル
===================================== */
@media screen and (width < 768px) {
	.sub-section-text-box {
		margin-top: 2rem;
		padding: 1.5rem;
	}

	.sub-section-text-box h4{
		font-size: 1.6rem;
	}

	.sub-section-text-box p {
		font-size: 1.4rem;
	}

	/* プラズマクラスター7000の効果 */
	.pci-container {
		display: block;
	}

	.pci-text {
		flex: 0;
		inline-size: 100%;
	}

	.pci-logo {
		inline-size: 100%;
		max-inline-size: 340px;
		margin-block: 2rem;
	}

}

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

/* ====================================
	タブレット専用スタイル（768px～1080px）
===================================== */
@media screen and (768px <=width < 1080px) {}