

html {
  font-size: calc((100vw - 320px) / 140 + 16px);
}
body {
  font-size: 1rem;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

* {
  box-sizing: border-box;
}
header {
  width: 100%;
  text-align:center;
}
section#contents {
  width: 960px;
  margin: 30px auto;
}
footer {
  width: 100%;
  text-align: center;
}


p {
  line-height: 1.4;
}

h2 {
  font-weight: bold;
  font-size: 1.4rem;
  padding: 60px 0 0px;
}

.kiyaku {
  padding: 30px 0;
}

.tmp-password {
  letter-spacing: 0.5px;
  color: #143232;
  margin: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
  padding: 30px 15px 10px;
}


.tmp-password .attention {
  letter-spacing: 0.5px;
  line-height: 1.2;
  vertical-align: baseline;
  font-size: 1.4rem;
  text-align: center;
  color: #ff0000;
  margin: 0 auto 30px;
  border: 1px solid #ff0000;
  background-color: #fff;
  padding: 20px;
}

.qes-sp span {
  display: block;
  margin: 0 0 10px;
}

div[data-role=fieldcontain] {
  padding: 0 0 50px;
}

label {
  letter-spacing: 0px;
  display: block;
  margin: 0 0 15px;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
  font-size: 1.0rem;
  font-weight: bold;
  color: #0096fa;
}

label span {
  vertical-align: top;
  display: inline-block;
  font-size: .7rem;
  padding: 5px 5px;
  margin: 0 0 0 5px;
  color: #fff;
  background-color: #ff3c00;
  border-radius: 6px;
}

.error {
  color: #f00;
  font-weight: bold;
  padding: 0 0 30px;
}
.error p {
  margin: 0px 0 0px;
}

input {
  margin: 0;
  width: 100%;
  height: 50px;
  background: #ecf3f4 none repeat scroll 0 0;
  border: medium none;
  color: #0a6678;
  font-size: 1.2rem;
  padding: 10px;
}

textarea {
  margin: 0;
  width: 100%;
  height: 260px;
  background: #ecf3f4 none repeat scroll 0 0;
  border: medium none;
  color: #0a6678;
  font-size: 1.2rem;
  padding: 10px;
}

input[type='submit']{
  list-style-type: none;
  font-weight: bold;
  padding: 0;
  clear: both;
  width: 300px;
  height: 60px;
  margin: 30px auto 10px;
  cursor: pointer;
  border: 1px solid #999;
  letter-spacing: 2.5px;
}

.send {
  text-align: center;
}






/*------------------------------------------
  Responsive Grid Media Queries - 1280, 1024, 768, 480
   1280-1024   - デスクトップ（デフォルトのグリッド）
   1024-768    - タブレット横長
   768-480     - タブレット縦長
   480-less    - スマホ
--------------------------------------------*/
@media all and (min-width: 1024px) and (max-width: 1280px) {

}

@media all and (min-width: 768px) and (max-width: 1024px) {
section#contents {
  width: 100%;
}
img {
  max-width: 100%;
}
}

@media all and (min-width: 480px) and (max-width: 768px) {
section#contents {
  width: 100%;
}
img {
  max-width: 100%;
}
input[type='submit']{
  width: 100%;
  height: 60px;
}
input[type='submit']{
  width: 100%;
  height: 60px;
}
}

@media all and (max-width: 480px) {

section#contents {
  width: 100%;
}
img {
  max-width: 100%;
}
input[type='submit']{
  width: 100%;
  height: 60px;
}
}


