@charset "UTF-8";

/* ====================================
	追加CSS：pk-18s01：特長1：大風量&やさしい運転音
 ==================================== */

.text-3em{
	min-height: 3em;
}

.sub-title span.point-color{
	color:#6b4c9d;
}

.column-area{
	background-color:#f7f5f2;
	padding:3rem;
	margin-top:4rem;
}
.column-area-title{
	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-container{
	margin-top:1em;
}
.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 only screen and (max-width: 767px) {
	.column-area{
		padding: 5%;
		padding-top:3rem;
	}
	.column-area-inner{
		padding:8%;
		padding-bottom:50px;
	}
}