@charset "utf-8";
/* CSS Document */
/* -------------------- destyle.css */
button,
input,
optgroup,
select,
textarea {
  font: inherit;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
  cursor: pointer;
}
/* -------------------- font */
@font-face {
  font-family: 'NotoSans JP';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../../font/NotoSansJP-Regular.woff2") format('woff2'), url("../../font/NotoSansJP-Regular.woff") format('woff');
}
@font-face {
  font-family: 'NotoSans JP';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../../font/NotoSansJP-Bold.woff2") format('woff2'), url("../../font/NotoSansJP-Bold.woff") format('woff');
}
/* -------------------- 全体 */
* {
  font-size: 100%;
}
*, *::before, *::after {
  box-sizing: border-box;
}
html {
  font-size: 62.5%;
}
body {
  margin: 0;
  padding: 0;
  color: #222;
  font-family: 'NotoSans JP', sans-serif;
  font-size: 1.6em;
  line-height: 2;
  /*-webkit-print-color-adjust: exact;*/ /*背景画像を必ず印刷する*/
  -webkit-text-size-adjust: 100%; /*スマホ画面の向きを変更した時に文字サイズを自動調整しない*/
  background: #fff;
  word-break: break-word; /*長いテキストをはみ出させない*/
}
/* -------------------- 画像 */
img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom; /*imgタグ下の余白を消す*/
}
/* -------------------- リンク */
a {
  color: #1a73e8;
}
a:hover {
  color: #76abf1;
}
a:hover img {
  opacity: 0.8;
}
/* -------------------- color */
.red {
  color: #FF3300;
}
/* -------------------- position */
.center {
  text-align: center;
}
/* -------------------- wrapper */
#wrapper {}
/* -------------------- header */
header {}
#header {
  margin: 0;
  padding: 0 30px;
  border-top: 2px solid #4FA969;
  background: #F6F6F6;
}
#header .inner {
  height: 120px;
  display: flex;
  align-items: center;
}
#header .inner .logo {
  margin: 0;
}
#header .inner .logo img {}
/* -------------------- main */
main {
  display: block; /*IE用*/
  position: relative;
  width: 100%;
}
/* -------------------- container */
#container {
  width: calc(100% - 60px);
  max-width: 1040px;
  margin: 0 auto;
  padding: 60px 0 40px 0;
}
/* -------------------- 見出し */
#container h1 {
  margin: 0;
  padding: 5px 20px;
  font-size: 2.6rem;
  border-bottom: 4px solid #52AB6B;
  background: #F4F5F7;
}
#container h2 {
  margin: 60px 0 30px 0;
  padding: 5px 20px;
  font-size: 2.2rem;
  background: rgba(157,204,106,0.60);
}
#container h3 {
  margin: 30px 0 20px 0;
  padding: 0 15px;
  font-size: 1.8rem;
  border-left: 6px solid #52AB6B;
}
/*--------------------リスト*/
#container ul, #container ol {
  margin: 20px 0;
  padding: 0 0 0 40px;
}
/* -------------------- 本文 */
/*flow*/
#container .flow {
  margin: 3em 0;
  text-align: center;
}
/*lead*/
#container .lead {}
/*infomation*/
#container .infomation {
  padding: 1em 1.5em;
  margin: 3em 0;
  background: linear-gradient(90deg, rgba(82,171,107,0.30) 0%, rgba(157,204,106,0.30) 100%);
}
#container .infomation p {
  margin: 0;
}
/* -------------------- table */
#container .table {
  width: 100%;
  margin: 20px 0;
  border-collapse: collapse;
  background: #fff;
}
#container .table th, #container .table td {
  padding: 20px;
}
#container .table th {
  width: 20%;
  font-weight: 500;
  border: 1px solid #ccc;
  background: #E4E7EB;
  /*background: #eee;*/
  text-align: center;
}
#container .table td {
  border: 1px solid #ccc;
}
#container .table td .notes {
  font-size: 1.4rem;
  color: #666;
  display: block;
  font-weight: normal;
}
/* ---------- エラー他*/
#container .required, #container .red {
  display: block;
  color: #CC0000;
  font-weight: bold;
}
/* ---------- 入力基本*/
#container table td input[type="text"], #container table td input[type="number"], #container table td .selectbox select, #container table td textarea {
  border-radius: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  border: 2px solid #F2F2F2;
  background: #F2F2F2;
  color: #333;
}
/**/
#container table td input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  box-sizing: border-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
/* ---------- textbox*/
#container table td input {}
#container table td input[type="text"], #container table td textarea {
  width: 100%;
  margin: 5px 0;
  padding: 10px 10px;
  -webkit-text-size-adjust: 150%;
  -moz-text-size-adjust: 150%;
  -ms-text-size-adjust: 150%;
  -o-text-size-adjust: 150%;
  text-size-adjust: 150%;
  transition: .4s;
  border-radius: 5px;
  line-height: 1.2em;
}
#container table td input[type="text"]:focus, #container table td textarea:focus {
  outline: 0;
  border: 2px solid #52AB6B;
  background: #ECF4F9;
}
/*input 幅*/
#container .table td input.w100 {
  width: 100px;
}
#container .table td input.w150 {
  width: 150px;
}
#container .table td input.w200 {
  width: 200px;
}
#container .table td input.w250 {
  width: 250px;
}
/*select*/
#container .table select {
  border: 1px solid #ccc;
  margin: 8px 0;
  padding: 8px;
  appearance: button;
  -webkit-appearance: button;
  -moz-appearance: button;
  border-radius: 3px;
}
/* -------------------- privacy */
.privacy {
  margin: 40px 0px;
  text-align: center;
}
/* -------------------- button */
.button {
  text-align: center;
}
/* -------------------- btn */
/*送信*/
#container .btn {
  display: inline-block;
  min-width: 200px;
  margin: 20px 10px;
  padding: 10px 35px;
  border: none;
  border-radius: 100vh;
  background: #52AB6B;
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, .4);
  color: #fff;
  font-size: 1.5rem;
  line-height: 2;
  text-decoration: none;
  text-align: center;
  transition: .4s;
}
#container .btn:hover {
  opacity: 0.8;
  box-shadow: none;
}
/*戻る*/
#container .btn.back {
  background: #999;
}
#container .btn.back:hover {
  opacity: 0.8;
  box-shadow: none;
}
/* -------------------- footer */
footer {
  margin: 0;
  padding: 0;
}
footer .copy {
  margin: 0;
  padding: 20px 0;
  font-size: 1.2rem;
  text-align: center;
  color: #52AB6B;
}
/* -------------------- error */
div.error {
  padding: 20px;
  margin-bottom: 20px;
  text-align: center;
  background-color: #ffefef;
}
p.error {
  color: #CC0000;
}
td.error {
  background-color: #ffefef;
}
td.error input {
  background-color: #fff !important;
  border: none;
}
.error em {
  color: #CC0000;
  display: block;
  font-style: normal;
  font-size: 1.4rem;
}

/*SP*/
@media screen and (max-width: 599px) {
  /* -------------------- 全体 */
  body {
    font-size: 1.5em;
    line-height: 1.8;
  }
  /* -------------------- header */
  #header {
    padding: 0 20px;
  }
  #header .inner {
    height: 80px;
  }
  #header .inner .logo img {
    width: 120px;
  }
  /* -------------------- container */
  #container {
    width: auto !important;
    padding: 30px 20px;
  }
  /* -------------------- 見出し */
  #container h1 {
    font-size: 2.1rem;
  }
  #container h2 {
    margin: 20px 0 0 0;
    font-size: 1.8rem;
  }
  #container h3 {
    margin: 20px 0;
    font-size: 1.6rem;
  }
  /*--------------------リスト*/
  #container ul, #container ol {
    padding: 0 0 0 20px;
  }
  /* -------------------- table */
  #container .table {
    width: 100% !important;
  }
  #container .table tr {
    border: none;
  }
  #container .table th, #container .table td {
    font-size: 95%;
    line-height: 140%;
    display: block;
    border: none !important;
    padding: 8px 10px;
  }
  #container .table th {
    width: auto;
    padding: 8px 10px !important;
    text-align: left !important;
  }
  #container .table th .required {
    display: inline;
    margin: 0 8px;
  }
  #container .table td {}
  #container .table td .notes {}
  /* ---------- 入力基本*/
  #container table td input[type="text"], #container table td input[type="number"], #container table td .selectbox select, #container table td textarea {}
  #container table td input[type="text"], #container table td textarea {
    font-size: 14px;
    padding: 6px 8px;
  }
  .radio01-input + label {
    display: block;
    margin: 8px 0;
  }
  /*input 幅*/
  #container .table td input.w100 {
    width: 25%;
  }
  #container .table td input.w150 {
    width: 31%;
  }
  #container .table td input.w200 {
    width: 100%;
  }
  #container .table td input.w250 {
    width: 100%;
  }
}