@charset "utf-8";

/* ----------------------------- */
/* よりどころ様サイト用メインCSS */
/* ----------------------------- */
/* Modified : 2021/01/26 20:33 */

/* ――――――――――― */
/* ■全環境用のベースCSS  */
/* ――――――――――― */

	/* ================== */
	/* ▼ページ全体・汎用 */
	/* ================== */
	body {
		font-family: "メイリオ",Meiryo,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic","游ゴシック","YuGothic",sans-serif;
		margin: 0px;
		padding: 0px;
		background-color: white;
		-webkit-text-size-adjust: 100%;
	}

		/* ▽リンク配色 */
		a { text-decoration: none; }
		a:link { color: #4c3c94; }
		a:visited { color: #691fcc; }
		a:hover { background-color: #fff099; color: #0044cc; }
		a:hover img { opacity: 0.75; }

		/* ▽消極的な改行制御区間 */
		i {
			font-style: normal;
			display: inline-block;
		}

		/* ▽画面幅に応じて自動縮小する画像 */
		.autoResize {
			max-width: 100%;
			height: auto;
		}

		/* …………………… */
		/* ▼明朝系フォント */
		/* …………………… */
		.titlePhoto,
		.subTitle,
		.concept,
		.reimin {
			font-family: "黎ミン M", "Reimin Medium", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", serif;
			transform: rotate(0.03deg);	/* WindowsでWebフォントにシャギーが出るのを防ぐ */
		}

	/* ============ */
	/* ▼ヘッダ区画 */
	/* ============ */
	.headArea {
	}

		/* 上端帯 */
		.topHead {
			background-color: #49207f;
			color: white;
			display: flex;
			flex-direction: row;
			line-height: 1;
			width: 100%;
			text-align: center;
			padding: 1em 0;
		}

			/* サイト名段 */
			.headBox {
				flex-basis: 80%;
			}
				h1 {
					margin: 0;
					font-weight: normal;
					font-size: calc( 100vw * 0.0533 );	/* 画面幅375pxのとき、20px */
				}

				.headKeys {
					margin: 0;
					padding: 0;
					list-style-type: none;
					font-size: calc( 100vw * 0.0363 );	/* 画面幅375pxのとき、13.6px */
					margin: 0.8em 0 0 0;
				}
					.headKeys li {
						display: inline-block;
					}
					.headKeys li::before {
						content: '｜';
						padding: 0 0.25em;
					}
					.headKeys li:last-child::after {
						content: '｜';
						padding: 0 0.25em;
					}

			/* 電話段 */
			.headTel {
				margin: 0;
				flex-basis: 20%;
			}
				.headTel a {
					color: white;
				}

		/* ▼ヘッダ大画像 */
		.headTagline {
			display: none;	/* HOMEページ以外では非表示 */
		}
		.pageHome .headTagline {
			position: relative;
			z-index: 10;
			display: block;
		}

			.wideImageBox {
				margin: 0;
				box-shadow: 0px 0px 3px #252525;
			}
				.wideImageBox img {
					display: block;
				}

		/* ▼ロゴ＋メインメニュー枠 */
		.headMenu {
			position: relative;
			z-index: 1;
			max-width: 996px;
			margin: 0 auto;
			background-color: white;

			/* 下端の山背景 */
			background-image: url('/imgs/bg_footer.png');
			background-position: bottom;
			background-size: contain;
			background-repeat: no-repeat;
			padding-bottom: calc( 100vw * 0.064 );	/* 画面幅375pxのとき、24px */
		}

			/* ロゴ */
			.headLogo {
				margin: 0;
				padding-top: 25px;
			}
				.headLogo img {
					display: block;
					margin: auto;
					width: 50%;
					max-width: 250px;
					height: auto;
				}

			/* メインメニュー */
			.menuList {
				list-style-type: none;
				margin: 1.25em 0;
				padding: 0;
				text-align: center;
				line-height: 1;
			}
				.menuList li {
					display: inline-block;
					vertical-align: top;
					width: 20%;
				}
					.menuList li a {
						display: block;
					}
						.menuList img {
							display: block;
							margin: auto;
							width: 45px;
							height: auto;
						}
						.menuList .text {
							display: inline-block;
							padding-top: 0.67em;
							font-size: 0.7em;
						}

					.menuList li a:hover img {
						opacity: 1;
					}

	/* ============ */
	/* ▼メイン区画 */
	/* ============ */
	.mainArea {
		max-width: 996px;
		margin: 0 auto;
		padding: 1em 0;
		background-color: white;
	}

		/* ------------ */
		/* ▼共通見出し */
		/* ------------ */
		.subTitle {
			margin: 0;
			font-weight: normal;
			font-size: calc( 100vw * 0.0533 );		/* 横幅375pxに対して20px */
			font-weight: bold;
			line-height: 1;

			background-image: url('/imgs/i_01.png');
			background-repeat: no-repeat;
			background-size: contain;
			background-position: 10px bottom;

			box-sizing: border-box;
			height: 27px;
			border-bottom: #cfeaa5 solid 3px;
			color: #486915;
			padding: 1px 1em 1px 45px;
			margin: 1em 0;
		}

				.concept {
					color: #49207f;
					font-size: 1.5em;
					line-height: 1.25;
					margin: 0;
					text-align: justify;
					letter-spacing: -2px;
				}

		/* ………………… */
		/* ▼お知らせ領域 */
		/* ………………… */
		.newsArea {
		}

			/* ▼てがろぐ埋め込み領域 */
			.tegalogEmbedArea {
				margin: 1em auto 3em;
				padding: 0 1em;
			}

				/* １投稿枠 */
				.oneNewsBox {
					margin: 1.5em 0;
					padding: 0 0 2.5em 0;
					border-bottom: 1px dashed gray;
				}
				.oneNewsBox:first-child {
					margin-top: 0;
				}

					/* 見出し追加 */
					.situation {
						font-size: 0.75em;
					}
					.situation::before {
						content: '－';
						display: inline-block;
						margin: 0 0.3em;
					}
					.situation:empty {
						display: none;
					}

					/* 日付 */
					.postDate {
						text-align: right;
						margin-bottom: 0;
					}
					.postDate + h3 {
						margin: 0.5em 0 1em 0;
					}

					/* 本文 */
					.postMain {
						font-size: 1.05em;
						letter-spacing: 0.05em;
					}

				/* HOMEに表示される１投稿枠 */
				.onePost {
					margin: 0.5em 0;
					font-size: calc( 100vw * 0.04 );	/* 横幅375pxのとき、15px */
				}

				/* ページ移動リンク枠 */
				.pagelinks {
					margin: 2em 0;
					text-align: center;
				}

					/* ページ番号リスト */
					.pagenums {
					}

						/* ▼ページ番号リンクの数字 */
						.pagenums a.pagenumlink {
							margin: 0px 2px 0px 2px;	/* 外側の余白 */
							padding: 0.2em 0.5em;		/* 内側の余白 */
							font-size: 1em;				/* 文字サイズ */
						}
						/* ▽現在のページ番号の装飾 */
						a.pagenumhere {
							text-decoration: none;		/* リンク装飾を消す */
							background-color: #8562b2;	/* 背景色 */
							color: white;				/* 文字色 */
							border-radius: 0.3em;		/* 角丸 */
						}
						/* ▽ページ番号リンクにマウスが載った際の装飾 */
						a.pagenumlink:hover {
							text-decoration: none;		/* リンク装飾を消す */
							background-color: #fff099;
							color: #0044cc; 
							border-radius: 0.3em;		/* 角丸 */
						}

			/* ‥‥‥‥‥‥‥‥‥‥‥‥‥‥ */
			/* ▼続きを読むリンク（ボタン） */		/* ※注：「続きを読む」機能は、JavaScriptが無効な閲覧環境では機能せず、その場合はボタンも表示されません。 */
			/* ‥‥‥‥‥‥‥‥‥‥‥‥‥‥ */
			/* ▽ボタン枠の装飾(共通) */
			.readmorebutton {
				display: inline-block;	/* インラインブロック化 */
				padding: 1px 0.5em;		/* 内側の余白 */
				margin: 0 1px;			/* 外側の余白 */
				border: 1px solid #bbb;	/* 枠線の装飾 */
				border-radius: 0.5em;	/* 枠線の角丸 */
				font-size: 0.85em;
			}
			/* ▽ボタン表面の装飾(共通) */
			.readmorebutton:link,
			.readmorebutton:visited {
				background-color: #eee;	/* 背景色(グラデーション非対応の環境のみ) */
				background-image: linear-gradient( 0deg, #ddd, #eee 55%, white );	/* 背景グラデーション */
				color: darkblue;		/* 文字色 */
				text-decoration: none;	/* リンク装飾を消す */
			}
			/* ▽ボタンにマウスが載った際の装飾(共通) */
			.readmorebutton:hover {
				background-image: none;		/* グラデーションなし */
				background-color: #00cccc;	/* 背景色 */
				color: white;				/* 文字色 */
			}

		/* ………………… */
		/* ▼業務内容領域 */
		/* ………………… */
		.servicesArea {
		}

			/* 全域カバー */
			.serviceBoxes {
				margin: 0;
				padding: 0;
				list-style-type: none;
				text-align: center;
			}

				/* 枠1つ */
				.oneServiceBox {
					margin: 0.45em 0.25em;
					border-radius: 1em;
					background-color: #efefef;
					display: inline-block;
					vertical-align: top;
					min-height: 320px;
				}

					/* タイトル＋写真 */
					.titlePhoto {
						margin: 0;
						padding: 1rem 1rem 0 1rem;
						color: #49207f;
						font-size: 1.3em;
					}
						.titlePhoto img {
							width: 270px;
							height: auto;
							display: block;
							margin: 5px auto 0;
						}

					/* 本文 */
					.service {
						margin: 0.75em 0 0 0;
						font-size: 1.05em;
					}
						.service span {
							display: block;
							color: #000000;
						}

		/* ……………………… */
		/* ▼スタッフ紹介領域 */
		/* ……………………… */
		.staffArea {
		}

			/* 段組ベース */
			.staffCover {
				margin: 1em;
			}

				/* ▽写真段 */
				.photoColmun {
					text-align: center;
				}

					.photo {
						margin: 0;
					}
					.caption {
						margin: 0.5em 0;
						font-size: 0.9em;
					}

				/* ▽本文段 */
				.messageColmun {
					margin-top: 1.5em;
				}

					.messageColmun p {
						font-size: 1.05em;
						line-height: 1.6;
						text-align: justify;
					}

		/* ……………… */
		/* ▼ご挨拶領域 */
		/* ……………… */
		.greetingArea {
		}

			/* 段組構造 */
			.greetingBox {
				margin: 1em;
			}

				/* 写真段 */
				.photoColumn {
					padding: 0 0 1.5em 0;
				}
					.photoColumn img {
						display: block;
						margin: auto;
					}

				/* 本文段 */
				.messageColumn {
				}

					/* 本文枠 */
					.messageBody {
						font-size: 1.05em;
						letter-spacing: 0.05em;
					}
						.messageBody p {
							text-indent: 1em;
							line-height: 1.8;
							text-align: justify;
						}

					/* 署名 */
					.signature {
						text-align: right;
					}


		/* ----------------------------------- */
		/* ▼お問い合わせページ用(Mobile Base) */
		/* ----------------------------------- */
		.contactform {
			margin: 0 5px;
			padding: 0;
		}

			/* ベーステーブル */
			.tableBox {
				margin: 0;
				padding: 0.15em 0;
			}
				.stdTable {
					margin: 1em auto;
					padding: 0;
					border-collapse: collapse;
					border: 1px solid #bdbdae;
					font-size: 0.95em;
				}
					.stdTable th,
					.stdTable td {
						border: 1px solid #bdbdae;
					}
					.stdTable th {
						color: #555;
						background-color: #f3f1e8;
						font-weight: normal;
						text-align: center;
						padding: 0.4em 0.25em;
					}
					.stdTable td {
						color: #333333;
						background-color: white;
						text-align: left;
						line-height: 1.5;
						padding: 0.25em;
					}

			/* 表組 */
			.contacttable {
			}
			.contacttable th {
				line-height: 1;
			}
			.contacttable td {
				padding: 3px;
				vertical-align: middle;
			}

				/* 必須サイン */
				.required-sign {
					font-size: 0.75em;
					display: inline-block;
					color: red;
				}

				/* 入力欄(共通) */
				.freetext,
				.freeinputbox {
					border: 1px solid #bdbdae;
					font-size: 16px;
					padding: 0.3em;
				}

				/* 1行入力欄 */
				.freetext {
					width: max( 180px, calc( 100vw * 0.48 ));	/* 画面幅375pxのとき、横幅180px ＝0.48倍。ただし最低でも180pxは確保する。 */
				}
				.freeinputbox {
					width: max( 180px, calc( 100vw * 0.48 ));	/* 画面幅375pxのとき、横幅180px ＝0.48倍。ただし最低でも180pxは確保する。 */
					height: 7em;
				}

				/* ボタン */
				.contactform p.formbuttons {
					margin: 2em 0 0 0;
					text-align: center;
				}
				.formbuttons input {
					border: 1px solid #adad9e;
					border-radius: 9px;
					font-size: 1em;
					color: #333333;
					padding: 0.7em 0;
					min-width: 6em;
					margin: 0 0.75em 0.5em;
					line-height: 1;
					box-shadow: 1px 1px 3px #aaa;
					cursor: pointer;
					-webkit-appearance: none;	/* iOS独自装飾の拒否 */
				}
					.clearbutton   { background-color: white; }
					.confirmbutton { background-color: #f3f1e8; }
					.backbutton    { background-color: #fdfdfd; color: gray !important; }

				.formbuttons input:hover {
					background-color: #fff099; color: #0044cc;
					border-color: #888;
				}

			/* ポリシー枠 */
			.policyBox {
				margin: 2.5em 0;
				padding: 0 1em;
			}

			/* ----------------------------------- */
			/* ▼PHPが生成する確認テーブル用の装飾 */
			/* ----------------------------------- */
			.checktable { border-collapse: collapse; max-width: 95%; box-sizing: border-box; border: 1px solid #b7b7b7; margin: 2.5em auto; line-height: 1.2; }
			.checktable th, .checktable td { text-align: left; }
			.checktable thead th { background-color: #e4dfcb; padding: 0.5em 1em; text-align: center; font-weight: bold; }
			.checktable td { border: 1px solid #b7b7b7; padding: 0.3em 0.5em; word-break: break-all; }


	/* ============ */
	/* ▼フッタ区画 */
	/* ============ */
	.footArea {
	}

		/* ……………………… */
		/* ▼フッタメニュー枠 */
		/* ……………………… */
		.footMenu {
			max-width: 750px;
			margin: 2em auto;
		}

			/* ※HOMEページでは非表示 */
			.pageHome .footMenu { display: none; }

		/* ……………………… */
		/* ▼上端へ戻るボタン */
		/* ……………………… */
		.backToTopBox {
			text-align: center;
		}
			.backToTopBox a {
				display: inline-block;
			}
				.backToTopBox a img {
					display: block;
					margin: 0.5em auto;
				}

		/* …………… */
		/* ▼バナー群 */
		/* …………… */
		.bannerBox {
			margin: 2em 0;
			text-align: center;
			display: none;		/* 非表示化 */
		}

			.bannerList {
				margin: 0;
				padding: 0;
				list-style-type: none;
			}

				.bannerList li {
					display: inline-block;
				}

					.bannerList a {
						display: block;
					}
						.bannerList img {
							display: block;
						}

			/* バナー群を見せるのはHOMEページだけ */
			.pageHome .bannerBox {
				display: block;
			}

		/* ……………… */
		/* ▼アドレス枠 */
		/* ……………… */
		.addressBox {
			margin-top: 2em;
			text-align: center;

			/* 下端の山背景 */
			background-image: url('/imgs/bg_footer.png');
			background-position: bottom;
			background-size: contain;
			background-repeat: no-repeat;
			padding-bottom: calc( 100vw * 0.064 );	/* 画面幅375pxのとき、24px */
		}

			.companyName {
				margin: 0.5em;
				font-size: 1.35em;
			}
			.address {
				margin: 0.25em;
				font-size: 1.25em;
			}

			.addressBox .tel {
				margin: 0.25em;
				font-size: 1.25em;
			}
				.addressBox .tel span {
					display: inline-block;
					margin: 0 0.5em;
				}
				.addressBox .tel a {
					color: black;
				}

		/* COPYRIGHT */
		.copyright {
			background-color: #92b262;
			color: white;
			text-align: center;
			margin: 0;
			padding: 1em;
		}


/* ========================================================= */
/* ■総合モバイル端末（横幅599px以下）共通の追加・上書きCSS */
/* ========================================================= */
@media all and (max-width:599px) {

	.pc-only,
	.wide-only,
	.tab-only { display: none !important; }

}

/* ===================================================== */
/* ■タブレット画面のみ（横幅600～996）の追加・上書きCSS */
/* ===================================================== */
@media screen and (min-width:600px) and (max-width:996px) {

	.pc-only,
	.sp-only { display: none !important; }

}

/* ==================================================== */
/* ■タブレット画面以上（横幅600以上）の追加・上書きCSS */
/* ==================================================== */
@media screen and (min-width:600px) {

	/* ============ */
	/* ▼ヘッダ区画 */
	/* ============ */
	.headArea {
	}

		/* 上端帯 */
		.topHead {
			padding: 0.75em 0;
			display: block;
		}

			/* サイト名段 */
			.headBox {
				display: inline-block;
			}
				h1 {
					display: inline-block;
					font-size: 1.4em;
				}

				.headKeys {
					display: inline-block;
					font-size: 1.4em;
					margin: 0 1em;
				}

			/* 電話段 */
			.headTel {
				display: inline-block;
				font-size: 1.4em;
				margin-top: 0.5em;
			}

		/* ▼ヘッダ大画像 */
			.wideImageBox {
				box-shadow: 0px 1px 8px #252525;
			}

		/* ▼ロゴ＋メインメニュー枠 */
			/* メインメニュー */
			.menuList {
				margin-top: 2em;
			}

	/* ============ */
	/* ▼メイン区画 */
	/* ============ */

		/* ------------ */
		/* ▼共通見出し */
		/* ------------ */
		.subTitle {
			font-size: 25px;
			background-position: 10px bottom;
			border-bottom-width: 4px;
			height: 40px;
			padding: 5px 1em 1px 70px;
			margin: 1em 0;
		}

				.concept {
					color: #49207f;
					font-size: 1.5em;
					line-height: 1.25;
					margin: 0;
					letter-spacing: 0;
				}

		/* ………………… */
		/* ▼お知らせ領域 */
		/* ………………… */
		.newsArea {
		}

			/* ▼てがろぐ埋め込み領域 */
			.tegalogEmbedArea {
				padding: 0 50px 0 100px;
			}

				.onePost {
					font-size: 1em;
				}


		/* ……………………… */
		/* ▼スタッフ紹介領域 */
		/* ……………………… */
		.staffArea {
		}

			/* 段組ベース */
			.staffCover {
				display: flex;
				margin: 0 1.5em;
			}

				/* ▽写真段 */
				.photoColmun {
					margin-right: 1.5em;
				}

					.photo img {
						min-width: 300px;
						height: auto;
					}

				/* ▽本文段 */
				.messageColmun {
					margin-top: 0;
				}

					.messageColmun p {
						font-size: 1.05em;
						line-height: 1.6;
						text-align: justify;
					}

		/* ……………… */
		/* ▼ご挨拶領域 */
		/* ……………… */
		.greetingArea {
		}

			/* 段組構造 */
			.greetingBox {
				display: flex;
			}

				/* 写真段 */
				.photoColumn {
					min-width: 250px;
					padding: 0;
				}

				/* 本文段 */
				.messageColumn {
					padding-right: 3em;
				}

					/* 見出し */
					.messageColumn .concept {
						font-size: 1.75em;
					}

					/* 本文枠 */
					.messageBody {
						margin: 1.75em 0;
						font-size: 1.1em;
					}
						.messageBody p {
							margin: 1.25em 0;
						}

					/* 署名 */
					.signature {
						font-size: 1.1em;
					}

		/* ---------------------------------------- */
		/* ▼お問い合わせページ用(for Wide Display) */
		/* ---------------------------------------- */
		.contactform {
			margin: 1.8em 0;
		}

			/* 表組 */
			.contacttable td {
				padding: 6px;
				vertical-align: bottom;
			}

				/* 必須サイン */
				.required-sign {
				}

				/* 入力欄(共通) */
				.freetext,
				.freeinputbox {
					padding: 0.4em;
				}

				/* 1行入力欄 */
				.freetext {
					width: 300px;
				}
				.freeinputbox {
					width: 550px;	/* Fail-Safe */
					width: 59vw;
					max-width: 720px;
					height: 12em;
				}

				/* ボタン */
				.formbuttons input {
					padding: 0.7em 0;
					min-width: 12em;
					margin: 0 2em;
				}

			/* ポリシー枠 */
			.policyBox {
				margin: 4.5em auto 3em;
				max-width: 750px;
			}


	/* ============ */
	/* ▼フッタ区画 */
	/* ============ */
	.footArea {
	}

		/* ……………………… */
		/* ▼フッタメニュー枠 */
		/* ……………………… */
		.footMenu {
			margin: 3em auto 2em;
		}

			/* アイコン */
			.footMenu .menuList img {
				width: 70px;
			}
			.footMenu .menuList .text {
				font-size: 1em;
			}

}


/* ==================================================== */
/* ■PCサイズ画面以上（横幅997px以上）の追加・上書きCSS */
/* ==================================================== */
@media screen and (min-width:997px) {

	.sp-only,
	.tab-only,
	.mobile-only { display: none !important; }

	body {
		background-color: #e6e6e6;
	}

	/* ============ */
	/* ▼ヘッダ区画 */
	/* ============ */
	.headArea {
	}

		/* 上端帯 */
			/* 電話段 */
			.headTel {
				margin-top: 0;
			}

		/* ▼ロゴ＋メインメニュー枠 */

			/* ロゴ */
			.headLogo {
			}
				.headLogo img {
					width: 210px;
				}

			/* メインメニュー(ヘッダのみ) */
			
				.headMenu .menuList li {
					position: absolute;
					width: 120px;
				}
				.headMenu .menu1 { top: 100px; left: 70px; }
				.headMenu .menu2 { top: 100px; left: 210px; }
				.headMenu .menu3 { top: 100px; right: 210px; }
				.headMenu .menu4 { top: 100px; right: 70px; }

						.headMenu .menuList img {
							width: 80px;
							height: auto;
						}
						.menuList .text {
							font-size: 0.9em;
						}

			/* メインメニュー */
					.menuList li a {
						padding: 5px 0;
					}

	/* ============ */
	/* ▼メイン区画 */
	/* ============ */

		/* ………………… */
		/* ▼お知らせ領域 */
		/* ………………… */
		.newsArea {
		}

			/* ▼てがろぐ埋め込み領域 */
			.tegalogEmbedArea {
				max-width: 810px;
				padding: 0;
			}


}

/* End of File */