@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; }
@media not all and (min-width: 768px) {
  .item {
    width: 100%; }

  .item:not(:nth-child(3n+3)) {
    margin-right: 0; }

  .item:nth-child(n+2) {
    margin-top: 30px; } }
/*
@media screen and (max-width: 540px) {
  .logo {
    width: 80px;
    margin: 8px 0;
  }
  .section-title {
    margin-bottom: 34px;
  }
  .section-title .ja {
    margin-bottom: 24px;
  }
	
}
*/
@media (max-width: 641px) {
  body {
    font-size: 16px; }

  a {
    font-size: 16px; }

  .container {
    /*.section_h2::before {
        content: attr(data-en);
        position: absolute;
        bottom: 10px;
        left: 50%;
        transform: translateX(-50%);
        color: rgba(11, 171, 100, 0.15);
        font-size: 80px;
        z-index: -1;
        font-family: 'Bahnschrift',sans-serif;
        letter-spacing: 3px;
    }*/
    /*============================
    #header
    ============================*/
    /*============================
    #footer
    ============================*/ }
    .container section {
      padding: 80px 0 100px 0; }
    .container header#header h1.logo a {
      width: 100px; }
    .container header#header div.inner nav {
      /*============================
      #g-navi
      ============================*/ }
    .container main {
      /*============================
      #mainvisual
      ============================*/
      /*============================
      #section01
      ============================*/
      /*============================
      #section02
      ============================*/
      /*============================
      #section03
      ============================*/
      /*============================
      #section04
      ============================*/
      /*============================
      #section05
      ============================*/
      /*============================
      #section06
      ============================*/
      /*============================
      #section07
      ============================*/ }
      .container main div.mainvisual_sp {
        height: 620px;
        background: linear-gradient(to top, transparent 0%, transparent 30%, #fff 100%), url(../img/main_bg_sp.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-attachment: fixed;
        background-position: center;
        text-align: center;
        padding: 90px 30px 0 30px;
        overflow: hidden;
        position: relative; }
        .container main div.mainvisual_sp div.mainvisual_textbox p {
          color: #48281A;
          letter-spacing: 0.1em;
          text-align: center;
          margin: 0 0 10px 0;
          font-size: 14px;
          font-weight: 500; }
        .container main div.mainvisual_sp div.mainvisual_textbox h2 {
          font-family: 'yumin';
          color: #48281A;
          padding-bottom: 15px; }
        .container main div.mainvisual_sp div.mainvisual_textbox img {
          max-width: 170px;
          padding-bottom: 35px;
          display: block;
          margin: 0 auto; }
        .container main div.mainvisual_sp div.mainvisual_textbox a div.btn_brown {
          max-width: 250px; }
        .container main div.mainvisual_sp div.mainvisual_img {
          max-width: 250px;
          padding-top: 20px;
          margin: 0 auto; }
      .container main section#section01 {
        background-size: 60vw, 50vw; }
        .container main section#section01 div.wrapper h2 {
          padding-bottom: 20px; }
        .container main section#section01 div.wrapper p {
          padding-bottom: 0; }
      .container main section#section02 div.wrapper div.flexbox img {
        width: 90%;
        margin: 0 auto;
        margin-bottom: 30px; }
      .container main section#section02 div.wrapper div.flexbox div.box {
        width: 100%; }
        .container main section#section02 div.wrapper div.flexbox div.box .box_text01 {
          letter-spacing: 0; }
        .container main section#section02 div.wrapper div.flexbox div.box h3 {
          padding-bottom: 0px;
          font-size: 24px; }
      .container main section#section03 div.wrapper div.flexbox div.item {
        width: 100%;
        display: flex;
        align-items: center;
        text-align: left;
        padding-left: 22px; }
        .container main section#section03 div.wrapper div.flexbox div.item:not(:nth-child(3n+3)) {
          margin-right: 0%; }
        .container main section#section03 div.wrapper div.flexbox div.item img {
          max-width: 87px;
          padding-right: 10px; }
        .container main section#section03 div.wrapper div.flexbox div.item h3 {
          padding-bottom: 10px; }
      .container main .accordion {
        margin: 0 auto;
        max-width: 968px;
        width: 100%;
        text-align: left; }
      .container main .toggle {
        display: none; }
      .container main .option {
        position: relative;
        margin-bottom: 30px; }
      .container main .title,
      .container main .content {
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        transform: translateZ(0);
        transition: all 0.3s; }
      .container main .title {
        background: #7A4B4B;
        /*border: solid 1px #ccc;*/
        padding: 1em 2.5em 1em 1em;
        display: block;
        color: #ffffff;
        font-weight: 500; }
      .container main .title::after,
      .container main .title::before {
        content: "";
        position: absolute;
        right: 1.25em;
        top: 40%;
        width: 2px;
        height: 0.75em;
        background-color: #ffffff;
        transition: all 0.3s; }
      .container main .title::after {
        transform: rotate(90deg); }
      .container main .content {
        max-height: 0;
        overflow: hidden; }
      .container main .content p {
        margin: 0;
        padding: 20px 15px 20px;
        font-size: 14px;
        background: #fff;
        line-height: 1.5; }
      .container main .toggle:checked + .title + .content {
        max-height: 500px;
        transition: all 1.5s; }
      .container main .toggle:checked + .title::before {
        transform: rotate(90deg) !important; }
      .container main .brown_Q {
        font-size: 32px;
        color: #33B588;
        font-family: 'Bahnschrift',sans-serif; }
      .container main section#section04 div.wrapper h2.section_h2 {
        margin-bottom: 0px; }
      .container main section#section06 div.wrapper div.application_flow {
        margin-top: 0; }
        .container main section#section06 div.wrapper div.application_flow ol {
          padding: 60px 20px; }
          .container main section#section06 div.wrapper div.application_flow ol li div.step_box {
            display: block; }
            .container main section#section06 div.wrapper div.application_flow ol li div.step_box img {
              width: 100%;
              margin: 0 auto;
              padding-bottom: 20px; }
            .container main section#section06 div.wrapper div.application_flow ol li div.step_box div.step_text {
              width: 100%;
              margin: 0 auto;
              text-align: center; }
              .container main section#section06 div.wrapper div.application_flow ol li div.step_box div.step_text h3 {
                padding-bottom: 0px; }
      .container main section#section06 div.wrapper div.help_desk {
        display: block;
        padding: 50px 20px; }
        .container main section#section06 div.wrapper div.help_desk img {
          width: 100%;
          padding-bottom: 25px; }
        .container main section#section06 div.wrapper div.help_desk div.text_box {
          width: 100%; }
          .container main section#section06 div.wrapper div.help_desk div.text_box h3 {
            padding-bottom: 10px; }
      .container main section#section07 div.wrapper ul {
        display: block;
        text-align: left;
        max-width: 150px;
        margin: 0 auto; }
        .container main section#section07 div.wrapper ul li {
          padding-bottom: 10px; }
    .container footer#footer div.wrapper div.flexbox {
      display: block; }
      .container footer#footer div.wrapper div.flexbox div.logo {
        width: 160px;
        margin: 0 auto;
        text-align: center;
        padding-bottom: 20px; }
      .container footer#footer div.wrapper div.flexbox div.info {
        width: 100%;
        margin: 0 auto;
        text-align: center; } }