@charset "UTF-8";

/* basic settings */
html, body, h1, h2, h3, h4, h5, h6,
a, p, span, em, small, strong, sub, sup,
mark, del, ins, strike, abbr, dfn,
blockquote, q, cite, code, pre,
ol, ul, li, dl, dt, dd,
div, section, article,
header, main, aside, nav, footer,
img, figure, figcaption,
address, time,
audio, video,
canvas, iframe,
details, summary,
fieldset, form, label, legend,
table, caption,tbody, tfoot, thead,tr, th, td { margin: 0; padding: 0; border: 0; }

html { font-size: 62.5%; width: 100%; min-width: 320px; min-height:100%; -webkit-text-size-adjust:100%; }
body { font-size: 1.6rem; line-height: 1.6em; width: 100%; min-height:100%; min-width: 320px; overflow-x: hidden; color:#333; background:#FFF; font-family:'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, sans-serif;}
* { box-sizing: border-box; font-family: inherit; font-size: inherit; line-height: inherit; }
*:before, *:after { box-sizing: inherit; }
article, aside, footer, header, nav, section, main { display: block;}
a, a:visited { color: inherit; }
table { border-collapse: collapse; border-spacing: 0; }
ol, ul { list-style: none; }
img, video { max-width: 100%; }
img { border-style: none; vertical-align: middle;}
blockquote, q { quotes: none; }
	blockquote:after, blockquote:before, q:after, q:before { content: ""; content: none; }
[hidden] { display: none !important; }
[disabled] { cursor: not-allowed; }
:focus:not(:focus-visible) { outline: none; }

/* local class */
.red { color: #F00;}
.blue { color: #165EA2;}
.green { color:#060;}
.tar { text-align:right;}
.tal { text-align:left;}
.tac { text-align:center;}
.f8 {font-size:.8rem;}
.f9 {font-size:.9rem;}
.f10 {font-size:1.0rem;}
.f11 {font-size:1.1rem;}
.f12 {font-size:1.2rem;}
.f13 {font-size:1.3rem;}
.f14 {font-size:1.4rem;}
.f15 {font-size:1.5rem;}
.f16 {font-size:1.5rem;}
.f18 {font-size:1.8rem;}
.f20 {font-size:2.0rem;}
.f22 {font-size:2.2rem;}
.f24 {font-size:2.4rem;}
.f26 {font-size:2.6rem;}
.f28 {font-size:2.8rem;}
.f32 {font-size:3.2rem;}
.f36 {font-size:3.6rem;}
.f42 {font-size:4.2rem;}
.fg {font-family: Arial, Helvetica, "sans-serif";}

/* layout settings */
header { width: 100%; padding: 2rem; text-align: center;}
	nav { width: 100%; max-width: 1200px; padding: 0 2rem; margin: 0 auto; display: flex; justify-content: space-between;}
		#hlogo {}
			#hlogo strong { display: block; font-weight: normal; font-size: 1.3rem; letter-spacing: .2rem; white-space: nowrap;}
			#hlogo img { width: 100%; max-width: 25rem; height:auto;}
		#hgoback { text-align: right; align-self: center; font-size: 1.4rem;}
			#hgoback a { display: block; margin: 0 0 0 auto; width: 18rem; text-align: center; padding: 1rem 0; color:#333; background:#EEE; text-decoration: none;}
			#hgoback a:hover { color:#FFF; background: #E8A126;}

main { display: block; width: 100%; max-width: 1200px; margin: 0 auto; text-align: center;}
	main h1 { text-align: center; font-size: 24px; letter-spacing: .1em; padding: 2rem; }
	main h1::before { display: block; content:""; width:9em; height:4rem; border-top:.4rem solid #E8A126; margin: 0 auto;}

.art { padding:2rem 0; text-align: left;}
	.art h3 { padding:2rem 0 0 0; font-size:1.8rem; }
	.art p { padding:1rem 0; font-size:1.4rem;}
		.art p img { vertical-align: baseline;}

.inquiry { padding:0 0 2rem 0; text-align: left;}
	.inquiry p { padding:1rem 0;}
		.inquiry p a { color:#888; text-decoration: none;}
			.inquiry p a:hover { color:#E8A126; text-decoration: underline;}
	.flexbox { display: flex;flex-wrap: wrap; justify-content:space-between;}
		.flexbox p { padding:.5rem; background: #EEE;}
		.flexbox form { margin: 0; padding: 0;}
		.flexbox label { display: block; padding:2rem 0 .5rem 0;}
		.flexbox input[type=text], .inquiry textarea, .inquiry select { width: 100%; box-sizing: border-box; padding: 0; background: rgba(0,0,0,0); border: none; }
		#btn { display: flex; flex-wrap: wrap; justify-content:center; width:100%; margin:0; padding:2rem 0 1rem 0; list-style: none;}
			#btn li { padding:1rem 2rem; text-align:center;}
			#btn input { display:block; width:24rem; margin:0 auto; padding:1.5rem 0; overflow:hidden; border:none; text-align:center; color:#FFF; font-size:1.6rem; background:#555; cursor: pointer;}
				#btn input:hover { background:#E8A126;}

footer { width: 100%; text-align: center; padding:2rem; background:#FFF;}
	footer {padding: 1rem ; text-align: center; font-size: 1.4rem; color:#999;}
		footer img { width: 100%; max-width: 25rem; height:auto;}


@media all and (min-width:320px){
	#hlogo { width: 100%; text-align: center;}
		#strong { text-align: center;}
	#hgoback { display: none;}
	main { padding: 2rem;}
	.art p { padding:1rem 0; font-size:1.4rem;}
	.inquiry {font-size: 1.4rem;}
	.w100{ width: 100%;}
	.w50 { width: 100%;}
}

@media all and (min-width:640px){
	#hlogo { width: auto; text-align: left;}
		#strong { text-align: left;}
	#hgoback { display: block;}
	main { padding: 2rem 5rem;}
	.art p { font-size:1.6rem;}
	.w100{ width: 100%;}
	.w50 { width: 48%;}
}

@media all and (min-width:960px) {
	#btn { flex-wrap: nowrap;}
	main { padding: 2rem 12rem;}
	.inquiry {font-size: 1.6rem;}
}

@media all and (min-width:1200px) {
}

/* print only settings */
@media print{
}