/*====================================

	----------------------------------
		Color
	----------------------------------

		Main     : #04002B
		Accent   : #956D32

	----------------------------------
			Structure
	----------------------------------

		0. General
		1. 見出し(装飾)
			1.1	見出し(装飾)1
			1.2 見出し(装飾)2
			1.3 見出し(装飾)3
			1.4 見出し(装飾)4
			1.5 見出し(装飾)5
			1.6 見出し(装飾)6
			1.7 見出し(装飾)7 吹き出し型
		2. ページ内リンク
			2.1	デフォルト4つ
			2.2 デフォルト3つver
			2.3 デフォルト2つver
			2.4 矢印右向き
		3. 問い合わせ
		4. ステップ
		5. テキスト＋画像
		6. リスト(ul)
		7. テキスト中リンク
		8. テーブル
		9. 飾り囲みテキスト
			9.1	飾り囲みテキスト+画像や見出し
		10. ＋画像や見出し2
		11. 見出しつきテキスト＋画像
			11.1 大画像
			11.2 複数画像
			11.3 4枚(デフォルト)
			11.4 3枚
			11.5 2枚
		12. google map
		13. 余白系

		//2020半ば以降追加
		15. テキストサイズ
		16. テキスト装飾 ハイライト
		17. 配置レイアウト
			17.1	PC：横1列、SP：縦1列1

		18 背景装飾
		19 装飾付きボックス
		20 ▲


====================================*/
/*====================================

	0. General

====================================*/


figure {
	margin: 0;
}

figure img {
	width: 100%;
}

figcaption {
	margin-top: 5px;
	text-align: center;
	font-size: 15px;/*font-size: 16px;*/
}

@media only screen and (max-width:736px){
	figcaption{
		margin-top: 0;
		font-size: 14px;
	}
}


p {
	/*font-size: 16px;*/
}

/*
極力見出しタグにはフォントサイズを設定させない
見た目の調整目的で文脈を無視して見出しタグを使用しないこと
（見た目の調整目的のフォントサイズは装飾用クラスで設定する）
(202008)
 */
h5 {
	font-size: 16px;/*font-size: 20px;*/
}

h4 {
/*  font-size: 22px;*/
}

h3 {
/*	font-size: 26px;*/
}

h2 {
/*  font-size: 29px;*/
}



/*↓template.htmlで項目の見出しに使われているだけ、サイト内でどこにも使ってないので今後も使わない (202008)*/
h4.page_contents_title {
	font-size: 22px;
	margin-bottom: 15px;
	border-bottom: 1px solid #04022B;
	color: #04022B;
}

h5.page_contents_sub_title {
	position: relative;
	padding: 0 0 10px 20px;
	border-bottom: 1px dotted #aaa;
	margin-bottom: 10px;
}

h5.page_contents_sub_title::before {
	content: "";
	position: absolute;
	left: 0;
	top: 42%;
	transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-webkit-transform: translate(0, -50%);
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #000;
}
/*↑template.htmlで項目の見出しに使われているだけ、サイト内でどこにも使ってないので今後も使わない (202008)*/


.notice{
	/* font-size: 14px; */
}



/* サブタイトル */
.sub_title {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	color: #460406;
	margin: 0px 0px 30px 0px;
/*	margin: 0px 0px 20px 0px;*/
	padding: 40px 0;
	text-align: center;
	font-size: 38px;
	line-height: 1.4;
	font-weight: normal;/*太字だと一部のandroidでかすれる*/
	-webkit-text-stroke: .015em currentColor;
	text-stroke: .015em currentColor;
}
@media only screen and (max-width:736px) {
	.sub_title {
		font-size: 28px;
		line-height: 1.3;
		/*margin: 0px 0px 20px 0px;*/
	}
}










/*====================================

	1. 見出し(装飾)

 ===================================*/
/*
	1.1 見出し(装飾)1
====================================*/

/* 新デザイン 202004 */
.contents_title {
	background: #ebe3d6;
	position: relative;
	padding: 38px 0 35px 0px;
	display: block;
	margin: 0 0 20px 0;
	font-size: 1.5rem;
	line-height: 1.8rem;
	text-align: center;
}
.contents_title::before {
	content: "";
	background-color: #956D32;
	position: absolute;
	left: 10px;
	top: 15%;
	width: 8px;
	height: 70%;
}
.contents_title::after {/* add 202609 */
	content: "";
	background-color: #956D32;
	position: absolute;
	right: 10px;
	top: 15%;
	width: 8px;
	height: 70%;
}

@media only screen and (max-width:736px) {
	.contents_title {/* add 202203 */
		padding: 25px 0 22px 0px;
		font-size: 1.25rem;
	}
}



/* 旧デザイン */
.contents_title_old {
	background: none;
	border: 4px double #ccc;
	position: relative;
	line-height: inherit;
	padding: 10px 0 10px 35px;
	display: block;
	margin-bottom: 20px;
	font-size: 22px;
}

.contents_title_old::before {
	content: "";
	background: rgb(104, 74, 20);
	background: -moz-linear-gradient(top, rgba(104, 74, 20, 1) 0%, rgba(166, 117, 0, 1) 50%, rgba(104, 74, 20, 1) 100%);
	background: -webkit-linear-gradient(top, rgba(104, 74, 20, 1) 0%, rgba(166, 117, 0, 1) 50%, rgba(104, 74, 20, 1) 100%);
	background: linear-gradient(to bottom, rgba(104, 74, 20, 1) 0%, rgba(166, 117, 0, 1) 50%, rgba(104, 74, 20, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#684a14', endColorstr='#684a14', GradientType=0);
	position: absolute;
	left: 10px;
	top: 10%;
	width: 10px;
	height: 80%;
}

.contents_title_old::after {
	content: "";
	background: -moz-linear-gradient(left, rgba(104, 74, 20, 1) 0%, rgba(166, 117, 0, 0.5) 50%, rgba(104, 74, 20, 0) 100%);
	background: -webkit-linear-gradient(left, rgba(104, 74, 20, 1) 0%, rgba(166, 117, 0, 0.5) 50%, rgba(104, 74, 20, 0) 100%);
	background: linear-gradient(to right, rgba(104, 74, 20, 1) 0%, rgba(166, 117, 0, 0.5) 50%, rgba(104, 74, 20, 0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#684a14', endColorstr='#00684a14', GradientType=1);
	position: absolute;
	left: 10px;
	bottom: 0;
	width: 98%;
	height: 1px;
}

/*
	1.2 見出し(装飾)2	→実質decoration_box用、これ以外で使わないように書き換え進行
主に事例の中のCASE見出しで使用
====================================*/
.decoration_box_title span.inline {
	color: #956D32;
	border: 1px solid #956D32;
	font-size: 18px;
	padding: 5px 40px;
	background: #fff;
	position: relative;
/*	margin-bottom: 15px;*/
	display: inline-block;
}
.decoration_box_title span.inline::after {
	content: "";
	background: #956D32;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 3px;
	top: 3px;
	z-index: -1;
}
.decoration_box_title_old span.inline {
	color: #956D32;
	border: 1px solid #956D32;
	/*font-size: 20px;*/
	padding: 0 40px;
	background: #fff;
	position: relative;
	margin-bottom: 15px;
	display: inline-block;
}
.decoration_box_title_old span.inline::after {
	content: "";
	background: #956D32;
	width: 100%;
	height: 100%;
	position: absolute;
	left: -3px;
	top: 3px;
	z-index: -1;
}
.decoration_box_title span.big {
	font-size: 120%;
}

/*
	1.3 見出し(装飾)3		→実質decoration_box用、これ以外で使わないように書き換え進行
主に事例の中の小見出しで使用
====================================*/
.decoration_box_title2 {
	display: flex;
	justify-content: center;
	align-items: center;
	max-width: 150px;
	background-color: #fff;
	/*background-color: #f5f1ea;*/
	border-left: 4px solid #956D32;
	border-bottom: 1px solid #956D32;
	margin-top: 30px;
	font-size: 1rem;
}
.decoration_box_title2 span {
	display: block;
	padding-top: 5px;
	padding-bottom: 5px;
	color: #956D32;
}

/* 旧デザイン */
.decoration_box_title2_old {
	background: url(/assets/images/top/icon/bg1_sec1_title_border.png) left bottom no-repeat;
	margin-bottom: 15px;
	font-size: 20px;
}
.decoration_box_title2_old span {
	padding: 0 0 0px 31px;
	background: url(/assets/images/top/icon/bg1_sec1_title_icon.png) 0 40% no-repeat;
	color: #956D32;
}


/* 見出し(装飾)3～改～
	下線を画像ではなく描画に変更 
	decoration_boxという名称がが乱用されていたので区別
*/
.heading_type1 {
	display: block;
	margin-bottom: 10px;
	border-bottom: 2px solid #cdbda5;
	background: url(/assets/images/common/icon/icon_heading1.png) 0 40% no-repeat;
	padding: 5px 0 5px 26px;
}
.heading_type1-2 {/*文字色ブラウン*/
	display: block;
	margin-bottom: 10px;
	border-bottom: 2px solid #cdbda5;
	background: url(/assets/images/common/icon/icon_heading1.png) 0 40% no-repeat;
	padding: 5px 0 5px 26px;
	color: #956D32;
}

.heading_type1_icon2 {/*アイコン違い*/
	display: block;
	margin-bottom: 10px;
	border-bottom: 2px solid #cdbda5;
	background: url(/assets/images/common/icon/icon_heading2.png) 0 40% no-repeat;
	padding: 5px 0 5px 26px;
}



/*
	1.4 見出し(装飾)4
	虫眼鏡アイコン
	2024：ファイル名・パス変更、色違い追加
====================================*/
.has_icon_title,
.has_icon_title2,
.has_icon_title3,
.has_icon_title_qa {
	padding: 6px 0 6px 36px;
	margin-bottom: 10px;
	margin-top: 18px;
}
.has_icon_title {
	background: url(/assets/images/common/icon/icon_loupe1.png) 0 30%/26px no-repeat;
	color: #956D32;
	border-bottom: 1px solid #956D32;
}
.has_icon_title2 {
	background: url(/assets/images/common/icon/icon_loupe2.png) 0 30%/26px no-repeat;/*色違い*/
	color: #d30c23;
	border-bottom: 1px solid #d30c23;
}
.has_icon_title3 {
	background: url(/assets/images/common/icon/icon_loupe3.png) 0 30%/26px no-repeat;/*色違い*/
	color: #100964;
	border-bottom: 1px solid #100964;
}
.has_icon_title_qa {
	background: url(/assets/images/common/icon/icon_qa.png) 0 30%/26px no-repeat;
	color: #956D32;
	border-bottom: 1px solid #956D32;
	font-size: 18px;
}

@media only screen and (max-width:736px) {
	.has_icon_title_qa{
		line-height: 1.4;
	}
}


/*
	1.5 見出し(装飾)5
====================================*/
/*法人ページのみ使用していた、見出しクラスの名称とは分かりづらいので今後使用しない、同種の装飾はheading_type3*/
.bg_c_title {
	background: #dfe5f0;
	padding: 10px;
	border-radius: 5px;
	font-weight: bold;
	margin-bottom: 20px;
	font-size: 18px;
}
/*法人ページのみ使用 追加202311*/
.heading_type3 {
	background: #dfe5f0;
	padding: 15px 10px;
	font-weight: bold;
	margin-bottom: 20px;
	font-size: 18px;
}

/*見出しとしての用途ではなく、同装飾のボックスとして追加202008*/
.bg_c_box {
	background: #dfe5f0;
	padding: 10px;
	border-radius: 5px;
	margin-bottom: 20px;
}

/*
	1.6 見出し(装飾)6
====================================*/
/*has_heading_inner_title～改～下線を画像ではなく描画に変更*/
.heading_type2 {
	display: block;
	margin-bottom: 15px;
	/*padding-bottom: 5px;*/
	border-bottom: 2px solid #cdbda5;
}


.heading_type4 {
	display: block;
	margin-bottom: 15px;
	border-bottom: 2px solid #cdbda5;
	position: relative;
	padding: 5px 0 5px 15px;
}
.heading_type4::before {
	content: "";
	background-color: #cdbda5;
	position: absolute;
	left: 0px;
	top: 0%;
	width: 6px;
	height: 100%;
}




/*↓今後使用しない*/
/*すでに使用しているページから削除する機会があるまでは見た目変更で凌ぐ*/
.has_heading_inner_title {
	display: block;
	margin-bottom: 15px;
	/*padding-bottom: 5px;*/
	border-bottom: 2px solid #cdbda5;
	font-size: 20px;
}

.has_heading_inner_title_old {
	background: url(/assets/images/top/icon/bg1_sec1_title_border.png) no-repeat left bottom;
	margin-bottom: 15px;
	font-size: 20px;
}



/*
	1.7 見出し(装飾)7 吹き出し型 202404追加
====================================*/
.heading_arrowtype1 {
	display: block;
	position: relative;
	background: #bea680;
	text-align: center;
	color: #fff;
	font-weight: bold;
	padding: 30px;
}
.heading_arrowtype1::after {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	left: 0;
	right: 0;
	bottom: -15px;
	margin: auto;
	border-style: solid;
	border-width: 20px 20px 0 20px;
	border-color: #bea680 transparent transparent transparent;
	z-index: 99;
}


/*
	見出しの上に乗るラベル 202409追加
====================================*/
.heading_label { /*単体でラベルとして成立する*/
	color: #956D32;
	background: rgba(156, 114, 52, 0.1);
	font-weight: bold;
	padding: 2px 5px;
	display: inline-block;
	margin-bottom: 3px;
}

/*
	「ご注意」用 見出し 202410追加
====================================*/
.heading_caution {
	background: #dfe5f0;
	padding: 10px;
	border-radius: 5px;
	font-weight: bold;
	font-size: 18px;
	margin-bottom: 20px;
}




/*====================================

	2. ページ内リンク

====================================*/
/*
	2.1 デフォルト4つ
====================================*/
.linkInPage {
	/*margin-bottom: 20px;*//*202305コメントアウト*/
}

.linkInPage ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.linkInPage ul li {
	/*width: 24.5%;*//*勝手に4つ並びを前提にされている*/
	margin-bottom: 20px;
	position: relative;
}

.linkInPage ul li a {
	display: block;
	border: 1px solid #ddd;
	text-align: center;
	padding: 10px 5px 30px 5px;
	position: relative;
	color: #000;
	box-shadow: 0 3px 0 #ccc;
	border-radius: 3px;
	height: 100%;
}


.linkInPage ul a span {
	width: 100%;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-webkit-transform: translate(0, -50%);
	padding: 0 10px 40px 10px;
	transition: all 0.2s ease-in-out;
}

.linkInPage ul li a.hover_action {
	opacity: 1;
	background: #f9f9f9;
}

.linkInPage ul li a::after {
	content: "";
	position: absolute;
	bottom: 15px;
	left: 0;
	right: 0;
	margin: auto;
	text-align: center;
	transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
	display: inline-block;
	width: 10px;
	height: 10px;
	border-top: 1px solid rgba(38, 38, 38, 0.8);
	border-right: 1px solid rgba(38, 38, 38, 0.8);
	display: inline-block;
}

/*
	2.2 3つver
====================================*/
.linkInPage.col-3 ul li {
	width: 32.5%;
}

/*
	2.3 2つver
====================================*/
.linkInPage.col-2 ul li {
	width: 49%;
}


/*
	1つver(横幅一杯)
====================================*/
.linkInPage.col-1 ul li {
	width: 100%;
}

/*
	4つver(202305追加)
====================================*/
.linkInPage.col-4 ul li {
	width: 24.5%;
}

.linkInPage.col-pc4_sp2 ul li {
	width: 24.5%;
}


/*
	2.4 矢印右向き
====================================*/
.linkInPage ul li.arrow_right a {
	padding: 10px 40px 10px 10px;
	display: block;
	position: relative;
	text-align: left;
	background: rgb(255, 255, 255);
/*202412 デフォルトが「グレーのグラデーション」やめる*/
}
.linkInPage ul li.old_gradient a {/*古いグラデーションデザイン*/
	padding: 10px 40px 10px 10px;
	display: block;
	position: relative;
	text-align: left;
	background: rgb(255, 255, 255);
	background: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 1) 0%, rgba(238, 238, 238, 1) 100%);
	background: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 1) 0%, rgba(238, 238, 238, 1) 100%);
	background: linear-gradient(135deg, rgba(255, 255, 255, 1) 0%, rgba(238, 238, 238, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=1);

}
.linkInPage ul a span {
	width: 100%;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-webkit-transform: translate(0, -50%);
	padding: 0 10px 10px 10px;
	transition: all 0.2s ease-in-out;
}

.linkInPage ul li.arrow_right a span {
	width: 100%;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-webkit-transform: translate(0, -50%);
	padding: 0 40px 0 10px;
	transition: all 0.2s ease-in-out;
}

.linkInPage ul li.arrow_right a.hover_action {
/*	background: #fff;*/
	opacity: 1;
	background: #f9f9f9;
}
.linkInPage ul li.old_gradient a.hover_action {
	background: #fff;
}


.linkInPage ul li.arrow_right a::before {
	content: "";
	width: 25px;
	height: 25px;
	line-height: 25px;
	border-radius: 50%;
	background: #04002B;
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translate(0, -50%);
	display: block;
}

.linkInPage ul li.arrow_right a::after {
	top: 50%;
	bottom: inherit;
	left: inherit;
	right: 20px;
	transform: translate(0, -50%)rotate(45deg);
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	width: 8px;
	height: 8px;
}


.linkInPage ul li.color_type1 a { /*add 202205*/
	background: #f9f9f9;
	transition: all 0.2s ease-in-out;
}


.linkInPage ul li.color_type2 a {
	background: #202644;/* color_type2の04002B を 202644 に変更*/
/*	background: #04002B;*/
	box-shadow: 0 3px 0 #000;
	border: none;
	color: #fff;
	transition: all 0.2s ease-in-out;
}
.linkInPage ul li.color_type3 a{
	background: #A30100;
	box-shadow: 0 3px 0 #790302;
	border: none;
	color: #fff;
}

.linkInPage ul li.color_type2 a::before {
	content: "";
	width: 25px;
	height: 25px;
	line-height: 25px;
	border-radius: 50%;
	background: #fff;
	position: absolute;
	right: 0;
	left: 0;
	margin: auto;
	bottom: 5px;
	display: block;
}
.linkInPage ul li.color_type3 a::before{
	background: #fff;
}

.linkInPage ul li.arrow_right.color_type2 a::before {
	content: "";
	width: 25px;
	height: 25px;
	line-height: 25px;
	border-radius: 50%;
	background: #fff;
	position: absolute;
	right: 10px;
	left: inherit;
	top: 50%;
	bottom: inherit;
	transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-webkit-transform: translate(0, -50%);
	display: block;
}

.linkInPage ul li.color_type2 a::after {
	border-top: 2px solid #202644;
	border-right: 2px solid #202644;
}
.linkInPage ul li.color_type3 a::after{
	border-top: 2px solid #A30100;
	border-right: 2px solid #A30100;
}

.linkInPage ul li.color_type1 a.hover_action {/*add 202205*/
	background: #fff;
}

.linkInPage ul li.color_type2 a.hover_action {
	background: #edeff7;/*e8e7f3から変更*/
	color: #202644;
}
.linkInPage ul li.color_type3 a.hover_action {
	background: #f3e6e6;
	color: #A30100;
}

.linkInPage ul li.color_type2 a.hover_action::before {
	background: #202644;
}
.linkInPage ul li.color_type3 a.hover_action::before {
	background: #A30100;
}

.linkInPage ul li.color_type2 a.hover_action::after {
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
}
.linkInPage ul li.color_type3 a.hover_action::after {
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
}

.linkInPage.arrow_right ul.two_line a span {
	padding: 10px 40px 10px 5px;
	width: 100%;
}

@media only screen and (max-width:736px) {
	.linkInPage ul li {
		width: 100%;
		margin-bottom: 20px;
	}

	/*
		2.2 3つver
	====================================*/
	.linkInPage.col-3 ul li {
		width: 100%;
	}

	/*
		2.3 2つver
	====================================*/
	.linkInPage.col-2 ul li {
		width: 100%;
	}

	/*
		4つver(202305追加)
	====================================*/
	.linkInPage.col-4 ul li {
		width: 100%;
	}
	.linkInPage.col-pc4_sp2 ul li {
		width: 48.5%;
	}


	.linkInPage ul a span{
		position: relative;
		left: inherit;
		top: inherit;
		transform: inherit;
		-moz-transform: inherit;
		-webkit-transform: inherit;
	}
	.linkInPage ul li.arrow_right a span{
		position: relative;
		left: inherit;
		top: inherit;
		transform: inherit;
		-moz-transform: inherit;
		-webkit-transform: inherit;
	}
}


/*====================================

	3. 問い合わせ

====================================*/
.contact-title {
	width: 100%;
	font-size: 22px;
	/*margin-bottom: 20px;*/
	position: relative;
	font-weight: bold;
	align-items: center;
	text-align: center;
}

.contact-title::before {
	content: "";
	position: absolute;
	background: #ddd;
	width: 100%;
	height: 2px;
	left: 0;
	top: 50%;
	transform: translate(0, -50%);
	z-index: -1;
}

.contact-title span {
	position: relative;
	padding: 0 20px;
}

.contact-title span::before {
	position: absolute;
	content: "";
	background: #fff;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: -1;
}

.contact_fadein {
	opacity: 0;
	animation-name: fadeIn;
	animation-delay: 2s;
	animation-duration: 0.5s;
	animation-fill-mode: forwards;
	animation-timing-function: ease-in;
}
@keyframes fadeIn {
	100% { opacity: 1; }
}



/*====================================

	4. ステップ

====================================*/
/* class名リネーム+<h5>指定削除 202008*/
.step_box_wrapper {
	padding-left: 10px;
	padding-right: 10px;
}
.step_box {
	border-radius: 7px;
	position: relative;
	margin-bottom: 80px;
	padding: 30px 30px 40px 30px;
	box-sizing: border-box;
	background-color: #f9f7f5;
}
.step_box .text {
	margin-top: 20px;
}
.step_box .title {
	color: #684a14;
	border-bottom: 1px dotted #684a14;
	padding-bottom: 5px;
	margin-bottom: 10px;
	font-size: 1.25rem;
	text-align: center;
}
.step_box::after {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	left: 0;
	right: 0;
	bottom: -60px;
	margin: auto;
	border-style: solid;
	border-width: 35px 70px 0 70px;
	border-color: #335 transparent transparent transparent;
	z-index: -1;
}
/* 最後の枠 */
.step_box.end {
	margin-bottom: 0px;
}
.step_box.end::after {
	display: none;
}

@media only screen and (max-width:736px){
	.step_box_wrapper {
		padding-left: 0px;
		padding-right: 0px;
	}
	.step_box {
		border-radius: 0px;
		padding: 20px 15px 30px;
	}
}



/*====================================

	5. テキスト＋画像

====================================*/
.text_img_wrap {
	clear: both;
	overflow: hidden;
}

.text_img_wrap .text_area {
	/* width: 65%; */
}

.text_img_wrap .text_area p {
	/*font-size: 17px;*/
	margin-bottom: 10px;
}

.text_img_wrap .img_area {
	width: 33%;
	margin-left: 2%;
	float: right;
}

.text_img_wrap .img_area.reverse {
	float: left;
	margin-right: 2%;
	margin-left: 0;
}

 @media only screen and (max-width:736px){
	.text_img_wrap .img_area{
		width: 40%;
	}
}
/*↑リニューアル時に作成されたクラス。SP時も回り込んだままなので画像が小さすぎる*/

/* SP時は画像の回り込み解除し、テキストの下に移動する 202408 */
.text_around_img_wrapper {
	clear: both;
	overflow: hidden;
}

.text_around_img_wrapper::after {
	content: "";
	display: block;
	clear: both;
}

.text_around_img_wrapper .img_area.right {/*画像が右側*/
	width: 40%;
	margin-left: 2%;
	float: right;
}
.text_around_img_wrapper .img_area.left {/*画像が左側*/
	width: 40%;
	margin-right: 2%;
	float: left;
}

@media only screen and (max-width:736px){
	.text_around_img_wrapper {
		display: flex;
		flex-wrap: wrap;
	}
	.text_around_img_wrapper .text_area{
		order: 0;
	}

	.text_around_img_wrapper .img_area.right,
	.text_around_img_wrapper .img_area.left	{
		float: none;
		width: 80%;
		margin: 20px auto 0;
		order: 1;
	}
}


/*====================================

	6. リスト(ul)

====================================*/
.page_list_wrap ul{
	padding-left: 20px;
	list-style-type: initial;
}
.page_list_wrap ol{
	padding-left: 20px;
	list-style-type: decimal;
}
.page_list_wrap ul li,
.page_list_wrap ol li {
	margin-bottom: 8px;
}
/*↑ポルス版のリスト*/




/*↓帝国版のリスト*/
ul.disclist {/*デフォルトのマーク*/
	list-style-type: disc;
	padding-left: 20px;
}

ul.list_nomark li,
ul.disclist li,
ul.checklist li {
	margin-bottom: 8px;
}

/* チェックリストタイプ */
ul.checklist li {
	background: url(/assets/images/common/icon/icon_check.png) no-repeat 0 0;
	background-size: 1.35rem;
	/*background-size: 22px;*/
	background-position-y: center;
	padding-left: 28px;
}

ul.dottedline li {
	border-bottom: 1px dashed #cdbda5;
	margin-bottom: 10px;
}





/*====================================

	7. テキスト中リンク

====================================*/
.textInLink {
	font-size: inherit;
	text-decoration: underline;
	color: #00c;/*color: #03c;*/
}

a.outside {
	background: url(/assets/images/common/icon/icon_link_outside_normal.png) 100% 50%/18px no-repeat;
	padding: 0 25px 0 0;
}
.outside_footer {
	background: url(/assets/images/common/icon/icon_link_outside_white.png) 100% 50%/18px no-repeat;
	padding: 0 25px 0 0;
}

/*====================================

	8. テーブル

====================================*/
/* 共通 */

.table_wrap table {
	width: 100%;
	border: 1px solid #ddd;
}

.table_wrap table th,
.table_wrap table td {
	padding: 15px 10px;
	text-align: left;
	/*font-size: 17px;*/
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
}

.table_wrap table th {
	background: #f7f7f7;
	white-space: nowrap;
}

.table_wrap table.horizontal th {
	text-align: center;
}

/* テキスト+テーブル */
.table_text_area h4,
.table_text_area h5,
.table_text_area p {
	margin-bottom: 10px;
}

.table_text_area p {
	margin-bottom: 5px;
}

/* 茶色系 */
table.table_color1 {
	border: 1px solid #ebe3d6;
}
table.table_color1 th,
table.table_color1 td {
	border-bottom: 1px solid #ebe3d6;
	border-right: 1px solid #ebe3d6;
}
table.table_color1 th {
	background: #f9f7f5;
}

@media only screen and (max-width:736px) {
	.table_wrap table th,
	.table_wrap table td {
		display: block;
	}

	.table_wrap table.horizontal th,
	.table_wrap table.horizontal td {
		display: table-cell;
		white-space: nowrap;
	}

	.table_wrap /*.table_inner*/ {
		overflow-x: scroll;
	}
}

/*====================================

	9. 飾り囲みテキスト

====================================*/
.decoration_box_wrap {
	border: 1px solid #ddd;
	padding: 10px;
}

.decoration_box_inner {
	background: #f7f7f7;
	padding: 10px;
	position: relative;
	z-index: 0;
}
.decoration_box_inner .text_area p {
	margin-top: 10px;
}


/*
	9.1 飾り囲みテキスト+画像や見出し
====================================*/
/* 画像ありver */
.decoration_box_inner.add_img {
	clear: both;
	overflow: hidden;
}

.decoration_box_inner.add_img .text_area {
	/* width: 48%; */
}

.decoration_box_inner.add_img .img_area {
	width: 48%;
	float: right;
	margin-left: 2%;
}

@media only screen and (max-width:736px) {
	.decoration_box_inner.add_img {
		display: flex;
		flex-wrap: wrap;
	}

	.decoration_box_inner.add_img .text_area {
		width: 100%;
	}

	.decoration_box_inner.add_img .img_area {
		width: 100%;
		margin: 20px auto;
		float: none;
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 1;
		order: 1;
	}
}




/*====================================

	10. ＋画像や見出し2

====================================*/
.decoration_box_wrap2 {
	border: 1px solid #ddd;
}

.decoration_box_inner_wrap {
	padding: 10px;
}

.decoration_box_inner_wrap p {
	margin-bottom: 10px;
}




/*====================================

	11. 見出しつきテキスト＋画像

====================================*/
.has_heading_inner {
	margin-bottom: 20px;
	clear: both;
	overflow: hidden;
}

.has_heading_inner .text_area {
	/* width: 70%; */
}

.has_heading_inner .img_area {
	width: 28%;
	float: right;
	margin-left: 2%;
}

.has_heading_inner_label {
	color: #956D32;
	background: rgba(156, 114, 52, 0.1);
	font-weight: bold;
	padding: 2px 5px;
	display: inline-block;
	margin-bottom: 3px;
}

.has_heading_inner p {
	margin-bottom: 10px;
}

@media only screen and (max-width:736px) {
	.has_heading_inner .text_area {
		width: 100%;
	}

	.has_heading_inner .img_area {
		width: 100%;
		margin-bottom: 10px;/*margin-top: 10px;*/
	}
}

.has_heading_wrap p {
	margin-bottom: 10px;
}

/*
	11.1 大画像
====================================*/
.has_heading_wrap .img_full_w {
	width: 100%;
	margin: 20px auto;
	text-align: center;
	display: block;
}

/*
	11.2 複数画像
====================================*/
.has_heading_wrap .some_img {
	display: flex;
	flex-wrap: wrap;
	text-align: start;
	justify-content: flex-start;
	margin: 20px auto;
}

.has_heading_wrap .some_img.more_t_four {
	display: block;
}

/*
	11.3 4枚(デフォルト)
====================================*/
.has_heading_wrap .some_img .some_img_c {
	width: 24%;
	margin-right: 1.3%;
	margin-bottom: 1.3%;
}

.has_heading_wrap .some_img .some_img_c:nth-child(4n) {
	margin-right: 0;
}

.has_heading_wrap .some_img.more_t_four .some_img_c {
	margin: 0 10px;
}

/*
	11.4 ３枚
====================================*/
.has_heading_wrap .some_img.col_3 .some_img_c {
	width: 32.4%;
}

.has_heading_wrap .some_img.col_3 .some_img_c:nth-child(3n) {
	margin-right: 0;
}

.has_heading_wrap .some_img.col_3 .some_img_c:nth-child(4n) {
	margin-right: 1.3%;
}

/*
	11.4 2枚
====================================*/
.has_heading_wrap .some_img.col_2 .some_img_c {
	width: 49%;
}

.has_heading_wrap .some_img.col_2 .some_img_c:nth-child(2n) {
	margin-right: 0;
}

@media only screen and (max-width:736px) {
	.has_heading_wrap .some_img .some_img_c {
		width: 49%;
		margin-right: 1.5%;
	}

	.has_heading_wrap .some_img .some_img_c:nth-child(2n) {
		margin-right: 0;
	}

	.has_heading_wrap .some_img.col_3 .some_img_c{
		width: 49%;
		margin-right: 1.5%;
	}
	.has_heading_wrap .some_img.col_3 .some_img_c:nth-child(3n){
		margin-right: 1.5%;
	}
	.has_heading_wrap .some_img.col_3 .some_img_c:nth-child(2n){
		margin-right: 0;
	}
}

/*====================================

	12. google map

====================================*/
.g_map_wrap {
	margin-top: 50px;
}

.g_map_wrap iframe {
	width: 100%;
	height: 300px;
}

/* スライダーdots */
.slider_wrap .slick-dots {
	bottom: -35px !important;
}

.slider_wrap .slick-dots li button:before {
	/* font-size: 15px !important; */
	color: rgba(170, 170, 170, 0.3) !important;
	opacity: 1 !important;
	font-size: 35px !important;
	font-family: inherit !important;
}

.slider_wrap .slick-dots li.slick-active button:before {
	color: #aaa !important;
}



/*====================================

	13. 余白系

====================================*/

/*
	マージン
====================================*/

/*
.m10 { margin: 10px !important; }
と略すとレフト
.ml0 { margin-left: 0 !important; }
と見間違いやすいので、略さない
*/
.margin0 { margin: 0 !important; }
.margin5 { margin: 5px !important; }
.margin10 { margin: 10px !important; }
.margin15 { margin: 15px !important; }
.margin20 { margin: 20px !important; }
.margin25 { margin: 25px !important; }
.margin30 { margin: 30px !important; }
.margin35 { margin: 35px !important; }
.margin40 { margin: 40px !important; }
.margin45 { margin: 45px !important; }
.margin50 { margin: 50px !important; }

.mt0 { margin-top: 0 !important; }
.mt5 { margin-top: 5px !important; }
.mt10 { margin-top: 10px !important; }
.mt15 { margin-top: 15px !important; }
.mt20 { margin-top: 20px !important; }
.mt25 { margin-top: 25px !important; }
.mt30 { margin-top: 30px !important; }
.mt35 { margin-top: 35px !important; }
.mt40 { margin-top: 40px !important; }
.mt45 { margin-top: 45px !important; }
.mt50 { margin-top: 50px !important; }
.mt60 { margin-top: 60px !important; }
.mt70 { margin-top: 70px !important; }
.mt80 { margin-top: 80px !important; }
.mt90 { margin-top: 90px !important; }
.mt100 { margin-top: 100px !important; }
.mt120 { margin-top: 120px !important; }
.mt140 { margin-top: 140px !important; }
.mt160 { margin-top: 160px !important; }
.mt180 { margin-top: 180px !important; }
.mt200 { margin-top: 200px !important; }

.mb0 { margin-bottom: 0 !important; }
.mb5 { margin-bottom: 5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb15 { margin-bottom: 15px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb25 { margin-bottom: 25px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb35 { margin-bottom: 35px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb45 { margin-bottom: 45px !important; }
.mb50 { margin-bottom: 50px !important; }
.mb60 { margin-bottom: 60px !important; }
.mb70 { margin-bottom: 70px !important; }
.mb80 { margin-bottom: 80px !important; }
.mb90 { margin-bottom: 90px !important; }
.mb100 { margin-bottom: 100px !important; }
.mb120 { margin-bottom: 120px !important; }
.mb140 { margin-bottom: 140px !important; }
.mb160 { margin-bottom: 160px !important; }
.mb180 { margin-bottom: 180px !important; }
.mb200 { margin-bottom: 200px !important; }

.ml0 { margin-left: 0 !important; }
.ml5 { margin-left: 5px !important; }
.ml10 { margin-left: 10px !important; }
.ml15 { margin-left: 15px !important; }
.ml20 { margin-left: 20px !important; }
.ml25 { margin-left: 25px !important; }
.ml30 { margin-left: 30px !important; }
.ml35 { margin-left: 35px !important; }
.ml40 { margin-left: 40px !important; }
.ml45 { margin-left: 45px !important; }
.ml50 { margin-left: 50px !important; }
.ml50 { margin-left: 50px !important; }
.ml60 { margin-left: 60px !important; }
.ml70 { margin-left: 70px !important; }
.ml80 { margin-left: 80px !important; }
.ml90 { margin-left: 90px !important; }
.ml100 { margin-left: 100px !important; }

.mr0 { margin-right: 0 !important; }
.mr5 { margin-right: 5px !important; }
.mr10 { margin-right: 10px !important; }
.mr15 { margin-right: 15px !important; }
.mr20 { margin-right: 20px !important; }
.mr25 { margin-right: 25px !important; }
.mr30 { margin-right: 30px !important; }
.mr35 { margin-right: 35px !important; }
.mr40 { margin-right: 40px !important; }
.mr45 { margin-right: 45px !important; }
.mr50 { margin-right: 50px !important; }
.mr60 { margin-right: 60px !important; }
.mr70 { margin-right: 70px !important; }
.mr80 { margin-right: 80px !important; }
.mr90 { margin-right: 90px !important; }
.mr100 { margin-right: 100px !important; }


/*
	パディング
====================================*/

/*
.p10 { padding: 10px !important; }
と略すとレフト
.pl0 { padding-left: 0 !important; }
と見間違いやすいので、略さない
*/
.padding0 { padding: 0 !important; }
.padding5 { padding: 5px !important; }
.padding10 { padding: 10px !important; }
.padding15 { padding: 15px !important; }
.padding20 { padding: 20px !important; }
.padding25 { padding: 25px !important; }
.padding30 { padding: 30px !important; }
.padding35 { padding: 35px !important; }
.padding40 { padding: 40px !important; }
.padding45 { padding: 45px !important; }
.padding50 { padding: 50px !important; }

.pt0 { padding-top: 0 !important; }
.pt5 { padding-top: 5px !important; }
.pt10 { padding-top: 10px !important; }
.pt15 { padding-top: 15px !important; }
.pt20 { padding-top: 20px !important; }
.pt25 { padding-top: 25px !important; }
.pt30 { padding-top: 30px !important; }
.pt35 { padding-top: 35px !important; }
.pt40 { padding-top: 40px !important; }
.pt45 { padding-top: 45px !important; }
.pt50 { padding-top: 50px !important; }
.pt60 { padding-top: 60px !important; }
.pt70 { padding-top: 70px !important; }
.pt80 { padding-top: 80px !important; }
.pt90 { padding-top: 90px !important; }
.pt100 { padding-top: 100px !important; }
.pt120 { padding-top: 120px !important; }
.pt140 { padding-top: 140px !important; }
.pt160 { padding-top: 160px !important; }
.pt180 { padding-top: 180px !important; }
.pt200 { padding-top: 200px !important; }

.pb0 { padding-bottom: 0 !important; }
.pb5 { padding-bottom: 5px !important; }
.pb10 { padding-bottom: 10px !important; }
.pb15 { padding-bottom: 15px !important; }
.pb20 { padding-bottom: 20px !important; }
.pb25 { padding-bottom: 25px !important; }
.pb30 { padding-bottom: 30px !important; }
.pb35 { padding-bottom: 35px !important; }
.pb40 { padding-bottom: 40px !important; }
.pb45 { padding-bottom: 45px !important; }
.pb50 { padding-bottom: 50px !important; }
.pb60 { padding-bottom: 60px !important; }
.pb70 { padding-bottom: 70px !important; }
.pb80 { padding-bottom: 80px !important; }
.pb90 { padding-bottom: 90px !important; }
.pb100 { padding-bottom: 100px !important; }
.pb120 { padding-bottom: 120px !important; }
.pb140 { padding-bottom: 140px !important; }
.pb160 { padding-bottom: 160px !important; }
.pb180 { padding-bottom: 180px !important; }
.pb200 { padding-bottom: 200px !important; }

.pl0 { padding-left: 0 !important; }
.pl5 { padding-left: 5px !important; }
.pl10 { padding-left: 10px !important; }
.pl15 { padding-left: 15px !important; }
.pl20 { padding-left: 20px !important; }
.pl25 { padding-left: 25px !important; }
.pl30 { padding-left: 30px !important; }
.pl35 { padding-left: 35px !important; }
.pl40 { padding-left: 40px !important; }
.pl45 { padding-left: 45px !important; }
.pl50 { padding-left: 50px !important; }
.pl60 { padding-left: 60px !important; }
.pl70 { padding-left: 70px !important; }
.pl80 { padding-left: 80px !important; }
.pl90 { padding-left: 90px !important; }
.pl100 { padding-left: 100px !important; }

.pr0 { padding-right: 0 !important; }
.pr5 { padding-right: 5px !important; }
.pr10 { padding-right: 10px !important; }
.pr15 { padding-right: 15px !important; }
.pr20 { padding-right: 20px !important; }
.pr25 { padding-right: 25px !important; }
.pr30 { padding-right: 30px !important; }
.pr35 { padding-right: 35px !important; }
.pr40 { padding-right: 40px !important; }
.pr45 { padding-right: 45px !important; }
.pr50 { padding-right: 50px !important; }
.pr60 { padding-right: 60px !important; }
.pr70 { padding-right: 70px !important; }
.pr80 { padding-right: 80px !important; }
.pr90 { padding-right: 90px !important; }
.pr100 { padding-right: 100px !important; }




/*
	14.1 notice
====================================*/
.notice {text-indent: -1.1em;padding-left: 1em;}

/*
	14.1 information
====================================*/

.information dl {
padding: 20px 0;
border-bottom: 1px solid #ccc;
}
.information dt {
font-weight: bold;
padding-bottom: 5px;
}
.information dd {
	line-height: 1.5;
}

@media screen and (min-width: 768px) {

.information dt {
clear: left;
float: left;
width: 120px;
/*font-weight: normal;*/
padding-left: 10px;
}
.information dd {
margin-left: 120px;
}
}


/*
	15 テキストサイズ
====================================*/

.fontsize_xs {
	font-size: 12px;
	line-height: 1.2;
}
.fontsize_s {
	font-size: 14px;
	line-height: 1.3;
}
.fontsize_ms {
	font-size: 15px;
	line-height: 1.3;
}
.fontsize_m {
	font-size: 16px;
	line-height: 1.3;
}
.fontsize_l {
	font-size: 18px;
	line-height: 1.4;
}
.fontsize_xl {
	font-size: 20px;
	line-height: 1.4;
}
.fontsize_xxl {
	font-size: 22px;
	line-height: 1.4;
}
.fontsize_xxxl {
	font-size: 24px;
	line-height: 1.4;
}
.fontsize_xxxxl {
	font-size: 28px;
	line-height: 1.4;
}

/*
.fontsize_xs {
	font-size: 0.75rem;
	line-height: 1.2;
}
.fontsize_s {
	font-size: 0.875rem;
	line-height: 1.2;
}
.fontsize_m {
	font-size: 1rem;
	line-height: 1.3;
}
.fontsize_l {
	font-size: 1.2rem;
	line-height: 1.4;
}
.fontsize_xl {
	font-size: 1.4rem;
	line-height: 1.4;
}
.fontsize_xxl {
	font-size: 1.6rem;
	line-height: 1.4;
}
.fontsize_xxxl {
	font-size: 1.8rem;
	line-height: 1.4;
}
*/

/* 倍数 (m基準)*/
.fontsize_2x {
	font-size: 2rem;
	line-height: 1.4;
}
.fontsize_2-5x {
	font-size: 2.5rem;
	line-height: 1.4;
}
.fontsize_3x {
	font-size: 3rem;
	line-height: 1.4;
}





/*
	16 テキスト装飾
====================================*/
/* ハイライト */
.text_highlight1 {
	background: linear-gradient(transparent 50%, #fff8d4 50%);
	line-height: 1.6;
}
.text_highlight2 {
	background: linear-gradient(transparent 50%, #ffe1e1 50%);
	line-height: 1.6;
}
.text_highlight3 {
	background: linear-gradient(transparent 50%, #dae7ff 50%);
	line-height: 1.6;
}

.text_underline1 {
	background: linear-gradient(transparent 90%, #fff8d4 0%);
}
.text_underline2 {
	background: linear-gradient(transparent 90%, #ffe1e1 0%);
}
.text_underline3 {
	background: linear-gradient(transparent 90%, #dae7ff 0%);
}



/* 文字色 */
.text_defaultcolor {
	color: #000;
}
.text_white {
	color: #fff;
}
.text_red {
	color: #AC1B1A;
}
.text_darkred {
	color: #460406;
}
.text_brown {
	color: #946724;
}
.text_darkbrown {
	color: #472b00;
}
.text_blue {
	color: #10c;
}

/* 太字 */
.text_bold {
	font-weight: bold;
}


/* 見出し明朝 */
.heading_mincho {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	text-align: center;
	font-weight: normal;/*太字だと一部のandroidでかすれる*/
	-webkit-text-stroke: .015em currentColor;
	text-stroke: .015em currentColor;
}
/* 部分明朝 */
.text_mincho {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.text_mincho_bold {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-weight: normal;/*太字だと一部のandroidでかすれる*/
	-webkit-text-stroke: .015em currentColor;
	text-stroke: .015em currentColor;
}




/*
	17 配置レイアウト
		17.1	PC：横1列、SP：縦1列
====================================*/
.flexbox_wrapper {
	display: flex;
	justify-content: space-between;
}
.flexbox_wrapper_center {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.flexbox_wrapper_TBcenter {/*上下中央揃え*/
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}

.flexbox_item_center {
	display: flex;
	justify-content: center;
	align-items: center;
}
.flexbox_item_left {
	display: flex;
	justify-content: flex-start;
}
.flexbox_item_right {
	display: flex;
	justify-content: flex-end;
}

.flexbox_item_col2 {
	width: 48%;
}
.flexbox_item_col3 {
	width: 32%;
}
.flexbox_item_col4 {
	width: 23%;
}
.flexbox_item_variable {
	flex: 1;
}

@media only screen and (max-width:736px) {
	.flexbox_wrapper {
		justify-content: center;
		flex-wrap: wrap;
	}
	.flexbox_item_col2 {
		width: 100%;
	}
	.flexbox_item_col3 {
		width: 100%;
	}
	.flexbox_item_col4 {
		width: 100%;
	}
}

/* flex不使用 */
.wrapper_hcenter {/*コンテンツ幅を保ち、水平中央揃え*/
	width: fit-content;
	margin: 0 auto;
}

.wrapper_w100per {
	width: 100%;
}
.wrapper_h100per {
	height: 100%;
}



/* 位置 水平方向*/
.text_hcenter{
	text-align: center!important;
}

.item_hcenter {
	text-align: center!important;
	margin-left: auto;
	margin-right: auto;
}

.text_hright {
	text-align: right!important;
}
.text_hleft {
	text-align: left!important;
}

/* SP時のみ水平中央 */
@media only screen and (max-width:736px) {
	.sp_text_hcenter {
		text-align: center;
	}
	.sp_txt_center {/*こちらはそのうち捨てる*/
		text-align: center;
	}
}



/* PC時のみサイズ変更 */
.pc_w50per {
	width: 50%;
}
.pc_w60per {
	width: 60%;
}
.pc_w70per {
	width: 70%;
}
.pc_w80per {
	width: 80%;
}
.pc_w90per {
	width: 90%;
}
@media only screen and (max-width:736px) {
	.pc_w50per,
	.pc_w60per,
	.pc_w70per,
	.pc_w80per,
	.pc_w90per {
		width: 100%;
	}
}

/* SP時のみサイズ変更 */
@media only screen and (max-width:736px) {
	.sp_w50per {
		width: 50%;
	}
	.sp_w60per {
		width: 60%;
	}
	.sp_w70per {
		width: 70%;
	}
	.sp_w80per {
		width: 80%;
	}
	.sp_w90per {
		width: 90%;
	}
}






/*
	18 背景装飾
====================================*/
/*
1:黄系
2:赤系
3:青系
*/

/* パターン画像 */
.bg_pattern0 {
	background-image:url(/assets/images/common/bg_pattern0.jpg);
	background-repeat:repeat;
}

.bg_pattern1 {
	background-image:url(/assets/images/common/bg_pattern1.jpg);
	background-repeat:repeat;
}
.bg_pattern1-2 {
	background-image:url(/assets/images/common/bg_pattern1-2.jpg);
	background-repeat:repeat;
}
.bg_pattern2 {
	background-image:url(/assets/images/common/bg_pattern2.jpg);
	background-repeat:repeat;
}
.bg_pattern2-2 {
	background-image:url(/assets/images/common/bg_pattern2-2.jpg);
	background-repeat:repeat;
}
.bg_pattern3 {
	background-image:url(/assets/images/common/bg_pattern3.jpg);
	background-repeat:repeat;
}
.bg_pattern3-2 {
	background-image:url(/assets/images/common/bg_pattern3-2.jpg);
	background-repeat:repeat;
}


/* 色付き無地 */
.bg_white {
	background-color: #fff;
}
.bg_gray {
	background-color: #f5f5f5;
/*	background-color: #f7f7f7;*/
}
.bg_plain1 {
	background: #f9f7f5;
}
.bg_plain1-2 {
	background: #bea680;
}
.bg_plain2 {
	background: #faf1f2;
}
.bg_plain2-2 {
	background: #89232f;/*仮*/
}
.bg_plain3 {
	background: #edf1f8;
/*	background: #e7ebf4;*/
}
.bg_plain3-2 {
	background: #333355;
}




/*
	19 装飾付きボックス
====================================*/
/* 角丸 */
.box_roundcorner {
	border-radius: 7px;
	box-sizing: border-box;
}
/* シャドウ */
.box_shadow {
	box-shadow: 0 0 5px #ccc;
}



/*
	20 ▲
====================================*/
/*PC、	SP：下向き*/
.item_arrow1,
.item_arrow2,
.item_arrow3 {
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 25px 50px 0 50px;
}
.item_arrow1 {
	border-color: #c8b48f transparent transparent transparent;
}
.item_arrow2 {
	border-color: #ffe1e1 transparent transparent transparent;
}
.item_arrow3 {
	border-color: #335 transparent transparent transparent;
}

/*PC：右向き
	SP：下向き*/
.item_arrow1_rd,
.item_arrow2_rd,
.item_arrow3_rd {
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 40px 0px 40px 25px;
}
.item_arrow1_rd {
	border-color: transparent transparent transparent #c8b48f;
}
.item_arrow2_rd {
	border-color: transparent transparent transparent #ffe1e1;
}
.item_arrow3_rd {
	border-color: transparent transparent transparent #335;
}
@media only screen and (max-width:736px) {
	.item_arrow1_rd,
	.item_arrow2_rd,
	.item_arrow3_rd {
		border-width: 25px 50px 0 50px;
	}
	.item_arrow1_rd {
		border-color: #c8b48f transparent transparent transparent;
	}
	.item_arrow2_rd {
		border-color: #ffe1e1 transparent transparent transparent;
	}
	.item_arrow3_rd {
		border-color: #335 transparent transparent transparent;
	}
}

/*
.icon_alert_brown {
	width: 0;
	height: 0;
	border-left: 1.25rem solid transparent;
	border-right: 1.25rem solid transparent;
	border-bottom: 2.2rem solid #946724;
	position: relative;
}

.icon_alert_brown::after {
	content: "!";
	position: absolute;
	top: 0.6rem;
	left: 50%;
	transform: translateX(-50%);
	font-weight: bold;
	font-size: 1rem;
	color: #fff;
}
*/
.icon_alert_brown {
	display: inline-block;
	width: 1.2em;
	height: 1.2em;
	margin-right: .3em;
	position: relative;
	vertical-align: -.2em;
}

.icon_alert_brown::before {
	content: "";
	position: absolute;
	inset: 0;
	background: #946724;
	clip-path: polygon(50% 0, 0 100%, 100% 100%);
}

.icon_alert_brown::after {
	content: "!";
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	font-size: .9em;
	font-weight: bold;
	color: #fff;
}



/*表示切替用*/
.cta-area {
	display: none;
}
.cta-area.is-active {
	display: block;
}