@charset "UTF-8";

body {font-family: "M PLUS 1p", sans-serif; font-weight: 400; font-style: normal; --swl-fz--content: 1.5em; color: #00081A;}
@media (max-width: 480px) {body {--swl-fz--content: 1em;}}

.m-plus-1p-extrabold {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 800;
  font-style: normal;
}

.post_content h1 {font-size: 1em;}

.swl-bg-color {padding: 20px 70px;}

.is-style-stitch {background: #d0ca00;}

.post_content li {margin: .25em 0.5em;}


/** マスキングテープ風 **/
.masking-pink {
	position: relative; /* タイトルをボックス内の左上に配置するための基準 */
	margin: 0 auto 2em; /* 外側の余白（上下と中央配置） */
	background-color: #F6BFBC; /*ボックス背景色*/
}

.masking-pink .masking-tl {
	background-image: repeating-linear-gradient(-45deg,#f09199 0, #f09199 3px,#F9AEA5 3px,#F9AEA5 6px);/*ストライプ*/
	transform: rotate(-2deg); /* テープの傾き */
	box-shadow: 0 1px 2px rgb(0 0 0 / .1); /*テープ影*/
	padding: .5em 1em; /* タイトルの余白 */
	line-height: 1; /* タイトルの行の高さ */
	position: absolute; /* 親要素の左上に固定 */
	top: -1em; /* 上端に配置 */
	left: 1em; /* 左端に配置 */
	display: inline-block; /* タイトルの幅を内容に合わせる */
	font-size: 1.5em; /* タイトルのフォントサイズ */
	font-weight: bold;
	color: #fff;
	width: auto; /* タイトル幅を内容に応じて可変にする */
	max-width: calc(100% - 2em); /* 左右の余白を考慮して最大幅を調整 */
	white-space: nowrap; /* タイトルを1行に固定 */
	overflow: hidden; /* はみ出した部分を非表示 */
	text-overflow: ellipsis; /* 省略記号（...）を表示 */
}

.masking-pink .masking-pink-content {
	padding: 3.2em 2em 2em; /* コンテンツ内の余白 */
}

/* pタグのmarginを0にする */
.masking-pink p {
	margin: 0;
}


/** ドットライン見出し **/
.dot-tl {
	padding-bottom: 0.5em;
	padding-left: 0.5em;
	border-bottom: 8px dotted #86B81B;
}
.dot-tl::before {
	color: #86B81B;
/*	content: '✔';*/
}


/** point見出し **/
.point-tl {
	position: relative;
	border-top: solid 2px #d0ca00;
	border-bottom: solid 2px #d0ca00;
	background: #fff;
	line-height: 1.4;
	padding: 0.8em 0.5em;
	margin: 2em 0 0.5em;
}

.point-tl:after {
  /*タブ*/
	position: absolute;
	font-family: "Font Awesome 5 Free",'Quicksand','Avenir','Arial',sans-serif;
	font-weight: 900;
	content: '\f0a7\ POINT';
	background: #d0ca00;
	color: #fff;
	left: 0px;
	bottom: 100%;
	border-radius: 8px 8px 0 0;
	padding: 14px 20px 5px;
	font-size: 1.2em;
	line-height: 1;
	letter-spacing: 0.05em;
}
@media (max-width: 600px) {
	.point-tl:after {
		padding: 9px 20px 5px;
	}
}


.point02-tl {
	position: relative;
	border-top: solid 2px #006D4D;
	border-bottom: solid 2px #006D4D;
	background: #86B81B;
	line-height: 1.4;
	padding: 0.4em 0.5em;
	margin: 2em 0 0.5em;
}

.point02-tl:after {
  /*タブ*/
	position: absolute;
	font-family: "Font Awesome 5 Free",'Quicksand','Avenir','Arial',sans-serif;
	font-weight: 900;
	content: '\f0a7\ POINT';
	background: #006D4D;
	color: #fff;
	left: 0px;
	bottom: 100%;
	border-radius: 8px 8px 0 0;
	padding: 14px 20px 5px;
	font-size: 1.2em;
	line-height: 1;
	letter-spacing: 0.05em;
}
@media (max-width: 600px) {
	.point02-tl:after {
		padding: 9px 20px 5px;
	}
}



/** number見出し **/
.number-tl {
	position: relative;
	padding: 1.2rem 1rem 1.2rem 11rem;
	border-bottom: 3px solid #006D4D;
	color: #006D4D;
}
.number-tl span {
	font-family: 'Roboto', sans-serif;
	font-size: 7rem;
	line-height: 1;
	position: absolute;
	bottom: -1.0rem;
	left: 0;
}
@media (max-width: 600px) {
	.number-tl {
		padding: 0rem 1rem 0.1rem 4.5rem;
	}
	.number-tl span {
		font-size: 2.5rem;
		bottom: -0.4rem;
	}
}