@charset "UTF-8";
/*色設定*/
/*$base-color: #5A5D5A;*/
/*フォント指定*/
/*Light*/
@font-face {
  font-family: 'NotoSans';
  src: url("../fonts/NotoSansCJKjp-Light.otf");
  font-weight: 300;
  font-style: normal; }
/*Normal*/
@font-face {
  font-family: 'NotoSans';
  src: url("../fonts/NotoSansCJKjp-Regular.otf");
  font-weight: 400;
  font-style: normal; }
/*Medium*/
@font-face {
  font-family: 'NotoSans';
  src: url("../fonts/NotoSansCJKjp-Medium.otf");
  font-weight: 500;
  font-style: normal; }
/*bold*/
@font-face {
  font-family: 'NotoSans';
  src: url("../fonts/NotoSansCJKjp-Bold.otf");
  font-weight: bold;
  font-style: normal; }
/*LuxusBrut*/
@font-face {
  font-family: 'LuxusBrut';
  src: url("../fonts/LuxusBrut.ttf");
  font-weight: bold;
  font-style: normal; }
/*游明朝*/
@font-face {
  font-family: 'yumin';
  src: url("../fonts/yuminl.ttf");
  font-weight: 300;
  font-style: normal; }
@font-face {
  font-family: 'yumin';
  src: url("../fonts/yumin.ttf");
  font-weight: 400;
  font-style: normal; }
@font-face {
  font-family: 'yumin';
  src: url("../fonts/yumindb.ttf");
  font-weight: bold;
  font-style: normal; }
/*Times*/
@font-face {
  font-family: 'times';
  src: url("../fonts/times.ttf");
  font-weight: 300;
  font-style: normal; }
div.container {
  background: #EDE9E6;
  font-size: 16px;
  /*============================
  #header
  ============================*/
  /*============================
  #main
  ============================*/
  /*============================
  #footer
  ============================*/ }
  div.container header#header h1.logo {
    margin: 0 auto; }
  div.container main#main {
    padding-top: 150px;
    /* 装飾 */
    /*============================
    #mail_form
    ============================*/ }
    div.container main#main div.wrapper h2 {
      font-size: 30px;
      text-align: center;
      font-family: 'yumin';
      color: #48281A; }
    div.container main#main div.wrapper div.bar {
      max-width: 400px;
      margin: 0 auto; }
    div.container main#main div.mailform_text {
      /*
      				padding: 50px 0 30px 0;
      */ }
      div.container main#main div.mailform_text p {
        text-align: center; }
    div.container main#main .progressbar {
      position: relative;
      margin: 0;
      padding: 0;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between; }
    div.container main#main .progressbar li {
      position: relative;
      list-style-type: none;
      text-align: center;
      text-transform: uppercase;
      width: 33.333%;
      color: #95D9C0;
      font-weight: bold;
      counter-increment: steps; }
    div.container main#main .progressbar li:before {
      display: block;
      width: 26px;
      height: 26px;
      margin: 7px auto 20px auto;
      content: '';
      line-height: 26px;
      font-size: 12px;
      text-align: center;
      border-radius: 50%;
      background-color: #95D9C0;
      content: counter(steps);
      z-index: 1; }
    div.container main#main .progressbar li:after {
      position: absolute;
      z-index: 1;
      top: 15px;
      left: -50%;
      width: 100%;
      height: 2px;
      content: '';
      background-color: #95D9C0; }
    div.container main#main .progressbar li:first-child:after {
      content: none; }
    div.container main#main .progressbar li.active,
    div.container main#main .progressbar li.complete {
      color: #E55D1A; }
    div.container main#main .progressbar li.active:before,
    div.container main#main .progressbar li.complete:before {
      background-color: #E55D1A;
      color: #FFF; }
    div.container main#main .progressbar li.active:after,
    div.container main#main .progressbar li.complete:after {
      background-color: #E55D1A; }
    div.container main#main .bar ul {
      margin: 40px 0 !important; }
    div.container main#main form#mail_form {
      /*============================
      #form_submit
      ============================*/ }
      div.container main#main form#mail_form p#form_submit {
        /*============================
        #form_submit_button
        ============================*/ }
  @media (max-width: 540px) {
    div.container footer#footer div.wrapper div.flexbox {
      display: block; }
      div.container footer#footer div.wrapper div.flexbox div.logo {
        width: 200px;
        margin: 0 auto;
        text-align: center;
        padding-bottom: 20px; }
      div.container footer#footer div.wrapper div.flexbox div.info {
        width: 100%;
        margin: 0 auto;
        text-align: center; } }

#agreement {
  width: 90%;
  max-width: 800px;
  margin: 0 auto !important;
  text-align: center; }

#agreement input[type="checkbox"] {
  margin: 0 10px 0 0; }

/*============================
#thanks
============================*/
div#thanks {
  width: 1000px;
  margin: 50px auto 100px auto;
  background: #ffffff;
  /*border-radius: 20px;*/
  line-height: 1.8;
  padding: 50px 0;
  text-align: center;
  /*box-shadow: rgba(11, 171, 100, 0.2) 0px 10px 50px;*/ }
  div#thanks img {
    max-width: 100px;
    padding-bottom: 20px; }
  div#thanks h3 {
    color: #48281A; }

@media screen and (max-width: 1000px) {
  div#thanks {
    width: 95%;
    font-size: 100%;
    padding: 50px 15px; } }
