@charset "UTF-8";

/* IE10～11 */

_:-ms-input-placeholder, :root .selector {
  property: value;
}


/* Edge12～14 */

@supports (-ms-ime-align: auto) and (not (-webkit-text-stroke: initial)) {
  .selector {
    property: value;
  }
}



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

*, *:before, *:after {
  box-sizing: inherit;
}
body {
  background-color: #ffffff;
  color: #000000;
  font-family: Arial, Helvetica, Verdana, Meiryo , "メイリオ" , YuGothic , "游ゴシック" , "Hiragino Kaku Gothic ProN" , "ヒラギノ角ゴ ProN" , "ＭＳ Ｐゴシック" , "MS PGothic", sans-serif;
}
body, html {
  height: 100%;
  margin: 0;
  font-size: 14px;
}
html {
  box-sizing: border-box;
}
header {
  margin: 0;
}
.wrapper {
  width: 100%;
}

.container {
  margin: 0 auto;
  width: 95%;
}
section {
  margin-bottom: 20px;
}
h1 {
  padding: 12px;
  margin: 0;
}
h1 img {
  width: 12%;
}
@media screen and (max-width: 768px) {
  h1 img {
    width: 40%;
  }
}
h2 {
  background-color: #badefb;
  font-size: 1em;
  margin: 0;
  padding: 8px 16px;
}
p {
  margin: 12px 0;
}
a {
  color: #0a54c7;
  word-break:break-all;
}
input, button, textarea, select {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline-offset: 0;
}
select::-ms-expand { /* for IE */
    display: none;
}
input[type='search'] { /* for IE */
  outline-offset: 0;
}
input[type=search] { /* for IE */
  outline-offset: 0;
}
input[type=file] {
  display: none;
}
input:read-only, input:disabled {
  background-color: #f5f5f5;
  color: #969696;
}
small {
  display: inline-block;
  margin-bottom: 8px;
}
footer {
  width: 95%;
  margin: 0 auto 12px;
}




/* Form
--------------------------------- */
form {
  display: inline-block;
}
form input,
form select,
form textarea {
  background-color: #ffffff;
  padding: 8px 30px 8px 8px;
  border: 1px solid #cccccc;
  border-radius: 3px;
  width: auto;
}
form input,
form textarea {
  width: 100%;
}
form input.after_txt {
  width: 90%;
}
form input[type=radio],
form input[type=checkbox] {
  display: none;
}
form label.radio,
form label.checkbox {
  position: relative;
  padding: 0 0 0 28px;
  vertical-align: middle;
  line-height: 0.95;
}
form label.radio:before,
form label.radio:after,
form label.checkbox:before,
form label.checkbox:after {
  position: absolute;
  content: "";
  display: block;
}
.checkbox:after {
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  border: 1px solid #ccc;
  border-radius: 3px;
}
input[type=checkbox]:checked + .checkbox:before {
  left: 7px;
  width: 7px;
  height: 17px;
  transform: rotate(40deg);
  border-bottom: 3px solid #009a9a;
  border-right: 3px solid #009a9a;
}
label.radio:after {
  left: 0;
  margin-top: -20px;
  width: 20px;
  height: 20px;
  border: 2px solid #ccc;
  border-radius: 50%;
}
label.radio:before {
  left: 4px;
  bottom: 4px;
  width: 12px;
  height: 12px;
  background: #0171bd;
  border-radius: 50%;
  opacity: 0;
}
input[type=radio]:checked + .radio:before {
  opacity: 1;
}
.checkbox:hover:after {
  border-color: #0171bd;
}
form input[type=text]:focus,
form input[type=search]:focus,
form select:focus,
form textarea:focus {
  background-color: #e0f3ff;
  border: 1px solid #3498db;
}
form select,
form.search input[type=button] {
  cursor: pointer;
}
form.upload {
  border: 1px solid #cccccc;
  border-radius: 3px;
  padding: 4px 8px;
}
a.bg_orange + form.upload {
  margin-left: 12px;
}
a.bg_orange + form label + input[type=submit] {
  margin-left: 8px;
}
form .select-box {
  display: inline;
  margin-right: -12px;
}
form .select-box:after {
position: relative;
top: 0.8em;
right: 1.5em;
content: '';
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid #666666;
pointer-events: none;
}

label {
  display: inline-block;
  position: relative;
}
label:hover {
  transition: all 0.3s ease 0s;
  cursor: pointer;
}



/* regist_Area Style
--------------------------------- */
.answer{
  font-size: 1.2em;
  line-height: 1.5em;
}
.answer_Area form {
  width: 100%;
}
.answer_Area ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.answer_Area ul li {
  margin-bottom: 32px;
}
.answer_Area .question {
  display: block;
  background-color: #012a6c;
  color: #ffffff;
  padding: 12px;
  margin-bottom: 12px;
  font-weight: bold;
  white-space: pre-wrap;
}
.answer_Area .radio {
  display: block;
  margin-bottom: 12px;
}
.answer_Area ul li input + span {
  margin-left: 8px;
}
.answer_Area ul li > ul {
  margin-top: 20px;
}
.answer_Area ul li > ul li .question {
  background-color: #cccccc;
  color: #111111;
}
.answer_Area ul li:last-child button {
  margin: 20px auto 0;
}
.answer_Area ul li:last-child button[type=submit] {
  display: block;
}
.answer_Area ul + section form {
  text-align: center;
  margin-bottom: 12px;
}
.answer_Area label.checkbox {
  display: block;
  line-height: 1.6;
}
.answer_Area ul li p {
  width: 100%;
}
.answer_Area ul li img {
  width: 70%;
}
.answer_checkbox span {
  display: block;
}
.answer_checkbox span:before {
  content: "・";
}



/*-------------------------------
  Utility
--------------------------------- */
.txt_ctr { text-align: center; }
.txt_lt { text-align: left; }
.txt_rt { text-align: right; }

.flort_rt { float: right; }

.btn {
  border: none;
  color: #ffffff;
  font-weight: 700;
  display: inline-block;
  background-color: #24B1A3;
  border-radius: 3px;
  padding: 8px 16px !important;
  transition: all 0.3s ease 0s;
}
.btn:hover {
  background-color: #24b171;
}
.txt-smaller { font-size: 0.9em; }
.txt-bigger-3em { font-size: 3em !important; line-height: 1.5; }

.bg_orange {
  background-color: #fc8822;
}
.bg_blue {
  background-color: #0d47a1;
}
.bg_gray {
  background-color: #dddddd;
  color: #333333;
}
.bg_orange:hover {
  background-color: #fc5622;
}
.bg_blue:hover {
  background-color: #0453ce;
}
.bg_gray:hover {
  background-color: #dddddd;
}

.caution {text-align: center; color: #FF0000; font-size: 12px; margin-left: 4px;}
.validation { color: #FF0000; }

.full-w { width: 100% !important; }



/* FontAwesome add style
--------------------------------- */
span.fa,
span.fas,
span.far {
  display: inline-block;
  width: auto;
  line-height: 1.5;
}
.fa:before,
.fas:before,
.far:before {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  padding-right: 4px;
}
.fa-pencil-alt:before,
.fa-power-off:before,
.fa-trash-alt:before {
  padding-right: 0;
}
.fa-exclamation-triangle {
  color: #ff0000;
  font-size: 1.2rem;
}



/* Clearfix
--------------------------------- */
.cf:after {
  content:" ";
  clear:both;
  display:block;
}