@charset "UTF-8";

/* ====================================
	共通スタイル：pk-18s02：特長1：風量 & 運転音
 ==================================== */

/* 02 やさしい運転音 */
.font-s {
	font-size: 0.8em;
	font-weight: normal;
}
#sub02 h5{
	font-size: inherit;
	margin-top:3rem;
}

/* 03 ネイチャーウイング */
#sub03 .section-title span.point-color{
	color:#6b4c9d;
	font-size: 0.8em;
}

/* コラム：フクロウの羽ばたき */
.column-area{
	background-color:#f5f5f5;
	padding:3rem;
	margin-top:8rem;
}
.column-area-title{
	font-size: 2.2rem;
	font-weight: 700;
	color:#6b4c9d;
	text-align: center;
	padding-bottom: 1em;
	padding-top: 6px;
	letter-spacing: 0.1em;
	position: relative;
}
.column-area-title::before{
	position: absolute;
	content: '';
	background-image: url("images/icon-column.svg");
  display: block;
  background-size: contain;
	background-repeat: no-repeat;
	width: 150px;/*画像の幅*/
  height: 65px;/*画像の高さ*/
	top:-65px;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}
.column-area-inner{
	background-color:#fff;
	padding:3rem;
	position: relative;
}
.column-area-inner::after{
	border-left:32px solid #ededed;
	border-bottom:32px solid #f7f5f2;
	content: '';
	display: block;
	position: absolute;
	bottom: 0px;
	right: 0px;
}
.column-area-inner .text.note {
  background-image: linear-gradient(180deg, #d9d9d9 1px, transparent 1px);
  background-size: 100% 2.5em; /* 行の高さ */
  line-height: 2.5em;
  padding-bottom: 1px; /* 最終行の下にも罫線を引く */
	position: relative;
}
.column-area-inner .text.note::before{
	/* 一番上の罫線を削除 */
	content: "";
	position: absolute;
	border-top: 2px solid #fff; /* 1pxだとスマホ時に見えていたので修正 */
	width: 100%;
}
.column-area-inner .text.note strong{
	font-weight: 600;
	color:#6b4c9d;
}


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

/* ====================================
	スマートフォン専用スタイル
===================================== */
@media screen and (width < 768px) {
	#sub02 .flex-container div.sub-item:nth-of-type(1) {
		margin-top:0;
	}
	.column-area{
		padding: 5%;
		padding-top:3rem;
	}
	.column-area-inner{
		padding:8%;
		padding-bottom:50px;
	}
	.column-area-title{
		font-size: 1.8rem;
	}
	.column-area-inner .flex-container {
		row-gap: 0;
	}
}

/* ====================================
	PC&タブレット、印刷専用スタイル
===================================== */
@media print,
screen and (width >=768px) {
	#sub02 div.sub-item {
		margin-top:0;
	}
	#sub02 div.sub-item .img-container{
		margin-top:2rem;
	}
	.column-area-inner .text-container{
		margin-top:0.5em;
	}
}

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