@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; }
/*色設定*/
/*$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 screen and (min-width: 642px) and (max-width: 1190px) {
  .section_h2::before {
    /*
        left:calc(clamp(6.563rem, -7.716rem + 35.584vw, 18.75rem));
    */ }

  div.tablet {
    /*============================
    #g-nav
    ============================*/ }
    div.tablet nav#g-nav {
      /*============================
      #g-nav-list
      ============================*/ }

  /*============================
  #main
  ============================*/
  main {
    /*============================
    #mainvisual
    ============================*/
    /*============================
    #section01
    ============================*/
    /*============================
    #section02
    ============================*/
    /*============================
    #section03
    ============================*/
    /*============================
    #section05
    ============================*/
    /*============================
    #section06
    ============================*/
    /*============================
    #section07
    ============================*/ }
    main div.mainvisual_tablet {
      height: 700px;
      /*	background-image: url("../img/main_bg_3.jpg");*/
      background: linear-gradient(to left, transparent 0%, transparent 30%, #fff 100%), url(../img/main_bg_tablet.jpg);
      background-repeat: no-repeat;
      background-size: cover;
      background-attachment: fixed;
      background-position: center;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-wrap: wrap;
      padding: 0 25px; }
      main div.mainvisual_tablet div.mainvisual_textbox {
        width: 50%;
        text-align: center; }
        main div.mainvisual_tablet div.mainvisual_textbox p {
          color: #48281A;
          letter-spacing: 0.05em;
          text-align: center;
          margin: 0 20px 10px 20px;
          font-size: calc(clamp(0.813rem, 0.666rem + 0.365vw, 0.938rem));
          font-weight: 500; }
        main div.mainvisual_tablet div.mainvisual_textbox h2 {
          padding-bottom: 30px;
          font-family: 'yumin';
          color: #48281A;
          font-size: calc(clamp(1.5rem, 1.061rem + 1.095vw, 1.875rem)); }
        main div.mainvisual_tablet div.mainvisual_textbox img {
          max-width: 190px;
          width: 100%;
          padding-bottom: 40px;
          display: block;
          margin: 0 auto; }
        main div.mainvisual_tablet div.mainvisual_textbox a div.btn_brown {
          max-width: 350px; }
      main div.mainvisual_tablet div.mainvisual_img {
        display: block;
        width: 50%;
        height: auto;
        max-width: 320px;
        padding-left: 30px; }
    main section#section01 {
      background-size: 55vw,50vw; }
    main section#section02 h3 {
      font-size: calc(clamp(1.5rem, 1.061rem + 1.095vw, 1.875rem)); }
    main section#section02 div.wrapper div.flexbox.box_01 div.box h3 {
      padding-bottom: 0px; }
    main section#section02 div.wrapper div.flexbox.box_02 div.box h3 {
      padding-bottom: 0px; }
    main section#section02 div.wrapper div.flexbox.box_03 div.box h3 {
      padding-bottom: 0px; }
    main section#section02 div.wrapper div.flexbox.box_04 div.box h3 {
      padding-bottom: 0px; }
    main section#section06 div.wrapper div.application_flow {
      padding: 0 40px; }
      main section#section06 div.wrapper div.application_flow ol {
        /*
        						padding: 60px 30px;
        */ }
        main section#section06 div.wrapper div.application_flow ol li div.step_box img {
          width: 20%; }
        main section#section06 div.wrapper div.application_flow ol li div.step_box div.step_text {
          width: 80%;
          padding-left: 20px; }
          main section#section06 div.wrapper div.application_flow ol li div.step_box div.step_text h3 {
            padding-bottom: 0px; }
    main section#section06 div.wrapper div.help_desk {
      padding: 50px 30px; }
      main section#section06 div.wrapper div.help_desk div.text_box {
        padding-left: 30px; }
        main section#section06 div.wrapper div.help_desk div.text_box h3 {
          padding-bottom: 0; }

  /*============================
  #footer
  ============================*/ }
@media screen and (min-width: 540px) and (max-width: 770px) {
  section#section02 div.wrapper div.flexbox div.box h3 {
    font-size: 24px; }
  section#section02 div.wrapper div.flexbox div.box p {
    font-size: 90%;
    line-height: 1.8; }

  .box_01 {
    /*			background-position: right bottom;
    			background-size: auto 150px;*/ }

  .box_02 {
    background-position: right bottom;
    background-size: auto 100px; }

  .box_03 {
    background-position: right bottom;
    background-size: auto 100px; }

  .box_04 {
    background-position: right bottom;
    background-size: auto 100px; }

  section#section03 div.wrapper div.flexbox div.item {
    width: 100%;
    display: flex;
    align-items: center;
    text-align: left;
    margin-top: 30px;
    padding-left: 22px; }
    section#section03 div.wrapper div.flexbox div.item:not(:nth-child(3n+3)) {
      margin-right: 0%; }
    section#section03 div.wrapper div.flexbox div.item img {
      max-width: 87px;
      padding-right: 10px; }
    section#section03 div.wrapper div.flexbox div.item h3 {
      padding-bottom: 10px; }

  section#section06 div.wrapper div.help_desk {
    display: block;
    padding: 50px 20px; }
    section#section06 div.wrapper div.help_desk img {
      width: 100%;
      padding-bottom: 25px; }
    section#section06 div.wrapper div.help_desk div.text_box {
      width: 100%; }
      section#section06 div.wrapper div.help_desk div.text_box h3 {
        padding-bottom: 10px; }
      section#section06 div.wrapper div.help_desk div.text_box p {
        line-height: 1.8;
        font-size: 90%; } }
