@charset "utf-8";
/* ===================================================
	Base CSS
====================================================== */
body {
	min-width: 1100px; min-height: 100vh; background: #fff; color: #585858;
	font-size: 16px; font-weight: normal; line-height: 1.8;
	font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif;
	-webkit-text-size-adjust: 100%; position: relative;

	font-feature-settings: "palt"; letter-spacing: 0.08em;
	/* font-feature-settings: "palt"; こちらの指定をすると文字が詰まりすぎてしまう場合があるので、letter-spaceingの記述が必要です。デザイン上不要であれば削除してください。
	縦書きテキストだと崩れる可能性があります。縦書きの項目は下記のようにしてください。
	.v_rl{ writing-mode: vertical-rl; font-feature-settings: "palt" 0;}*/
}


div {
	box-sizing: border-box;
}
a {
	color: inherit;
	text-decoration: none;
	transition: opacity 0.5s;
}

@media (hover: hover) {
	a:hover:not(a[tabindex="-1"]) {
		opacity: 0.7;
	}
}
#lineup-font-size-sampler {
	bottom: 0;
	left: 0;
}
.fixed {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	width: 100%;
	min-width: 1200px;
}
iframe[name="google_conversion_frame"] {
	position: absolute;
	bottom: 0;
	left: 0;
}
.ofi {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.view_sp {
	display: none;
}

/* コンテンツ幅 */
.inner_lg {
	width: 1400px;
	max-width: 96%;
	margin: 0 auto;
}
.inner_md {
	width: 1200px;
	max-width: 94%;
	margin: 0 auto;
}
.inner_sm {
	width: 1000px;
	max-width: 92%;
	margin: 0 auto;
}

@media screen and (max-width: 600px) {
	.inner_lg,
	.inner_md,
	.inner_sm {
		max-width: 90%;
	}

}

@media screen and (max-width: 600px) {
	body,
	input,
	select,
	textarea { font-size: 14px;}

	body { min-width: 0;}
	.view_sp { display: block;}
	.view_pc { display: none !important;}
}


/* ---------------------------------------------------
	Header
------------------------------------------------------ */
header ul { position: fixed; z-index: 100; right: 0; display: flex; justify-content: flex-end; font-size: 14px; opacity: 0; transition: opacity .5s;}
header.fixed ul { opacity: 1;}
header ul li { background-color: #161616;}
header ul li a,
header ul li .tel-link { display: block; color: #c6c6c6; text-align: center; padding: 15px 0; width: 170px;}
header ul li img { display: block; margin: 0 auto; padding: 0 0 4px;}
header ul li .h_stxt { display: block; text-align: center; font-size: 12px; color: #c6c6c6; opacity: .5;}
header ul li:nth-of-type(1) a { width: 120px; height: 100%; box-sizing: border-box; background-color: #444;}
header ul li:nth-of-type(2) { border-right: 1px solid #5c5c5c;}

@media screen and (max-width: 600px) {
	
	header ul { bottom: 0; width: 100%;}
	header ul li { width: 37%;}
	header ul li:nth-of-type(1) { width: 26%;}
	header ul li:nth-of-type(1) a,
	header ul li a, header ul li .tel-link { width: 100%; padding: 10px 0;}
	header ul li .h_stxt { font-size: 10px;}
}





/* ---------------------------------------------------
	Footer
------------------------------------------------------ */


#footer_wrap { background: #1f1f1f; padding: 0 0 60px;}
#footer {
	display: flex; flex-wrap: wrap; justify-content: space-between;
	padding: 25px 0; color: #f3f3f3; line-height: 1.6;
}
#footer a { color: #f3f3f3;}

#footer >div { display:flex; flex-direction:column; margin: 150px 0 0; padding: 15px 0 0; width: 50%; box-sizing: border-box; text-align: center; align-items: center;}
#footer >div p { flex-grow: 1; margin: 0 0 20px; min-height: 216px;}
#footer >div:nth-of-type(1) { border-right: 1px solid #404040;}
#footer >div ul { flex-grow: 1; font-size: 14px;}
#footer >div ul li:nth-of-type(1) { margin: 0 0 20px;}
#footer >div ul li:nth-of-type(1) a,
#footer >div ul li:nth-of-type(1) .tel-link { display: block ; width: 400px; padding: 14px 0; background-color: #363636;}
#footer >div ul li:nth-of-type(1) .tel-link span { display: block; /* font-size: 18px;*/}
#footer >div ul li:nth-of-type(2) a,
#footer >div ul li:nth-of-type(2) .tel-link { display: block; width: 400px; padding: 14px 0; border: 1px solid #404040; font-size: 14px;}
#footer >div ul li:nth-of-type(2) span { display: block; font-size: 18px;}

#footer_wrap #copyright { text-align: center; font-size: 11px; padding: 0 0 10px;}

@media screen and (max-width: 600px) {
	#footer { display: block;}
	#footer >div { width: 100%; margin: 50px 0 0;}
	#footer >div ul { width: 100%;}
	#footer >div ul li:nth-of-type(1) a, #footer >div ul li:nth-of-type(1) .tel-link { width: 100%;}
	#footer >div ul li:nth-of-type(2) a,
	#footer >div ul li:nth-of-type(2) .tel-link { width: 100%;}
	#footer >div:nth-of-type(1) { border-right: none;}
	#footer >div p { min-height: auto; width: 40px;}
	#footer >div:nth-of-type(2) p { width: 61px;}
}





/* ---------------------------------------------------
	clear
------------------------------------------------------ */


/* ---------------------------------------------------
	更新履歴
------------------------------------------------------

180228_〇〇_cssを更新したらここに更新履歴を追加していきます。多くなったら上の方は削除。
180205_kamiguchi_更新履歴コメントひな形追加
200828_akimoto_IEで游ゴシック体を使用すると謎の余白ができるバグがあるため、IEでのみfont-familyを変更する記述を追記
201029_maehata_bodyタグにfont-feature-settings: "palt";追加
201223_akimito_下記内容の修正
　・bodyのdisplay:flex;の削除。
　・iPhoneセーフエリアの対応記述。
　・object-fitのIE対応の記述およびjs追加。

------------------------------------------------------ */