@charset "utf-8";
/* ===================================================
	カラー
=================================================== */
@colorMain: #46b036; //メインカラー
@colorSub: #2c93e8; //サブカラー 詳細ボタンなど
@colorBorder: #ddd; //ボーダーカラー
@colorLightBG: #f6faf5; //薄い背景色　bodyの背景と同化はNG　 フォームやテーブルの見出し背景,カテゴリー背景
@colorPager:#dcecd8;//ページャー背景
@colorPagerCurrent:#46b036;//ページャー背景current

/* ===========================================================================================
	基準のline-height
=========================================================================================== */
@BaseLineHeight: 1.6;

/* ===========================================================================================
	フォント 設定
=========================================================================================== */
// 游書体がWindowsで細くなってしまう問題の解決
// family名にMyYuGothicM,MyYuMinchoMを指定（Chrome 62にも対応）
@font-face {
	font-family: "MyYuGothicM";
	font-weight: normal;
	src: local("YuGothic-Medium"), /*Postscript name*/
		local("YuGothic-Regular"); /*Mediumがないとき*/
}
@font-face {
	font-family: "MyYuGothicM";
	font-weight: bold;
	src: local("YuGothic-Bold"); /*Postscript name*/
}
@font-face {
	font-family: "MyYuMinchoM";
	font-weight: normal;
	src: local("YuMincho-Medium"), /*Postscript name*/
		local("YuMincho-Regular"); /*Mediumがないとき*/
}
@font-face {
	font-family: "MyYuMinchoM";
	font-weight: bold;
	src: local("YuMincho-Bold"); /*Postscript name*/
}

body {
	font-size: 16px;
	line-height: @BaseLineHeight;
	color: #333;
	font-family: 'Segoe UI', Verdana, Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', sans-serif;
}

a,
a:active,
a:link,
a:visited {
	color: #333;
}
/* ===========================================================================================
	ボタン 設定
=========================================================================================== */
.moreBtn {
	a {
		display: inline-block;
		background: @colorSub;
		font-size: 14px;
		padding: 6px 8px 6px 48px;
		color: #fff;
		min-width: 160px;
		text-align: center;
		position: relative;
		&::before,
		&::after {
			content: '';
			position: absolute;
			top: 0;
			bottom: 0;
			margin: auto;
		}
		&::before {
			left: 0;
			width: 40px;
			height: 100%;
			background: lighten(@colorSub, 10%);
		}
		&::after {
			left: 14px;
			width: 8px;
			height: 8px;
			border-top: 1px solid #fff;
			border-right: 1px solid #fff;
			transform: rotate(45deg);
		}
	}
}
/* ===========================================================================================

	メインイメージ設定
=========================================================================================== */
.mainImgArea {
	width: 100%;
	margin: 0 0 20px;

	.mainImgContent {
		max-width: 100%;
		margin: 0 auto;
		text-align: center;
		background-repeat: no-repeat;
		background-position: center center;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.mainImgContent p {
		width: @contentWidth;
		font-weight: bold;
		font-size: 24px;
	}
}
/* ===========================================================================================

	見出し設定
=========================================================================================== */
/*== h2はビルダー・システムで共通とする =======================*/
.h2LaySets {
	font-size: 28px;
	border-bottom: 2px solid #ddd;
	padding: 0 0 10px !important;
	position: relative;
	&::before {
		content: '';
		position: absolute;
		right: 0;
		left: 0;
		bottom: -2px;
		margin: auto;
		width: 100px;
		height: 2px;
		background: @colorMain;
	}
}

.fl-module-heading h2.fl-heading {
	// ビルダーのH2
	.h2LaySets;
}

h2.pageTitle {
	// アーカイブ・シングルシステムページの見出し
	.h2LaySets;
	margin-bottom: 20px;
}
/*== h3 =======================*/
.h3LaySets {
	font-size: 24px;
	color: @colorMain;
}

.fl-module-heading h3.fl-heading {
	// ビルダーのH3
	.h3LaySets;
}
/*== h4 =======================*/
.h4LaySets {
	font-size: 20px;
	background: url('../images/bg_h04.png') no-repeat 0 50%;
	background-size: calc(60px / 2) calc(60px / 2);
	border-bottom: 1px dotted #333;
	padding: 5px 0 5px 40px !important;
}

.fl-module-heading h4.fl-heading {
	// ビルダーのH4
	.h4LaySets;
}
/*== h5 =======================*/
.h5LaySets {
	font-size: 20px;
	padding: 0 0 7px !important;
	position: relative;
	&::before {
		content: '';
		position: absolute;
		bottom: -2px;
		left: 0;
		height: 2px;
		width: 20px;
		background: @colorMain;
	}
}

.fl-module-heading h5.fl-heading {
	// ビルダーのH5
	.h5LaySets;
}
/*== h6 =======================*/
.h6LaySets {
	font-size: 18px;
	color: @colorSub;
}

.fl-module-heading h6.fl-heading {
	// ビルダーのH6
	.h6LaySets;
}
/* ===========================================================================================

	bb layout
=========================================================================================== */
#mainContent .fl-row:not(.c_banner) .fl-row-content-wrap {
	.fl-rich-text,
	.voiceComment {
		line-height: 1.75;
	}
}
/* ===========================================================================================

	コンタクトバナー
=========================================================================================== */
.c_banner {
	width: 700px;
	.c_tel {
		line-height: 1;
		a {
			color: inherit;
		}
	}
	.c_btn a.fl-button {
		// background: none;
		border: 0;
		position: static !important;
		top:0 !important;
	}
}

.c_tel .fl-icon-text {
	height: auto !important;
	padding-bottom: 6px;
}