@charset "UTF-8";

/*初期設定*/
html { overflow-y: scroll; }
body {
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  min-width: 320px;
  background: url(../img/bg.png);
  line-height: 1.5;
  color: #fff;
  text-align: left;
}
img { max-width: 100%; height: auto; }
.ie8 img{ width: auto; }
/*clearfix*/
.clearfix { zoom: 1; }
.clearfix:after { content: ""; display: block; clear: both; }

/*layout*/
a { color:#e5e5e5; }
nav {
  border-bottom: 1px solid #131313;
  background: #131313;
  box-shadow: 0 1px 1px #333333;
  text-align: center;
}
nav ul { margin: 0; padding: 0; list-style: none; }
nav ul li {
  float: left; width: 33.33333%;
  letter-spacing: 0.1em; text-align: center;
  text-shadow: 1px 1px 1px #ccc;
}
.ie7 nav ul li{ width: 33.17708%; }
nav ul li a { display: block; padding: 10px 0; color: #fff; }
header { margin-bottom: 1.5em; }
header h1 { line-height: 1.1; color: #000; font-size: 2.5em; font-weight: normal; text-align: center; }
header #mainImage { margin: 30px 0 0 20px; text-align: left; }
article { padding: 0 10px; }
article h2 { padding: 0 0 0 10px; border-left: 3px solid #000; line-height: 1.1; font-size: 2em; font-weight: normal; }
section { margin-bottom: 3em; }
div.subImage { margin: 20px 0 20px 10px; }
div.imagebox { margin: 5px; width: 250px; float: left; }
div.imagebox2{ margin: 5px auto; }
p.image, p.caption { text-align: center; margin: 0; }
p.caption { font-size: 90%; color: #fff; }
footer { padding: 10px 0; background: #131313; color: #fff; text-align: center; }

input[type="image"] { -webkit-appearance: none; border-radius: 0; }

/*media Queries*/
@media only screen and (min-width: 768px) {
  header h1 { margin: 1.1em 0; line-height: 1.5; font-size: 3em; }
}
@media only screen and (min-width: 840px) {
  nav ul, #content{ width: 800px; margin: 0 auto; }
}

/* ---- form ---- */
form.contact-form{ display:block !important; max-width:720px; width:100%; margin:0 auto; padding:0 14px; box-sizing:border-box; }
form.contact-form .btn{ display:flex; justify-content:center; align-items:center; gap:12px; padding-top:14px; }
form.contact-form .btn input[type="image"],
form.contact-form .btn a.back-btn img{ display:block; }

/* いろいろズレたので補正 */
form.contact-form .btn input[type="image"]{ position:static; left:auto; }
#formStatus{ text-align:center; margin-top:10px; position:static; left:auto; }

/* 背景など */
html, body { overflow-x: hidden; }
img, video { max-width: 100%; height: auto; }
html, body { background:#20272c; min-height:100%; }
body { min-height:100vh; }
#content, header { background:#20272c !important; }
nav, footer { background:#131313 !important; }

/* 幅の調整 */
form.contact-form * { box-sizing:border-box; }
form.contact-form input[type="text"],
form.contact-form input[type="email"],
form.contact-form textarea { width:100%; max-width:100%; }

/* ここまでよ*/