@charset "UTF-8";
/* Scss Document */
/* A Modern CSS Reset */
*, *::before, *::after {
  box-sizing: border-box; }

body, h1, h2, h3, h4, p, figure, blockquote, dl, dd {
  margin: 0; }

ul[role="list"], ol[role="list"] {
  list-style: none; }

html:focus-within {
  scroll-behavior: smooth; }

body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5; }

a:not([class]) {
  text-decoration-skip-ink: auto; }

img, picture {
  max-width: 100%;
  display: block; }

input, button, textarea, select {
  font: inherit; }

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto; }

  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important; } }
img {
  max-width: 100%;
  height: auto;
  backface-visibility: hidden; }

ul, li {
  list-style: none;
  padding: 0;
  margin: 0; }

a {
  outline: none;
  text-decoration: none; }

/*--------------------------
メディアクエリ設定
---------------------------*/
/*マップ型変数で定義*/
/*@mixinでメディアクエリを呼び出す。変数mq、初期値sm*/
/*フォントサイズレスポンシブ*/
/*@mixin fs-vw($font-size, $base-width: 414) {
  font-size: $font-size / $base-width * 100vw;
}*/
/*20pxのテキストを画面幅に合わせて変更する場合*/
/*.sample {
  @include fs-vw(20);
}*/
/*--------------------------------------------------
全体設定
---------------------------------------------------*/
html, body {
  scroll-behavior: smooth;
  scroll-padding-top: 60px;
  overflow-x: hidden; }
  @media screen and (min-width: 768px) {
    html, body {
      scroll-padding-top: 144px; } }

body {
  font-size: 16px;
  /*font-size: min(1vw, 16px);*/
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  color: #000;
  overflow-x: hidden; }

@media screen and (min-width: 768px) {
  a[href^="tel:"] {
    pointer-events: none; } }

/*--------------------------------------------------
ヘルパークラス
---------------------------------------------------*/
@media screen and (max-width: 767px) {
  .hp_sp_br {
    display: block; } }
@media screen and (min-width: 768px) {
  .hp_sp_br {
    display: none; } }

@media screen and (max-width: 767px) {
  .hp_pc_br {
    display: none; } }
@media screen and (min-width: 768px) {
  .hp_pc_br {
    display: block; } }

.hp_ta-c {
  text-align: center !important; }

.hp_ta-r {
  text-align: right !important; }

.hp_txt_small {
  font-size: 0.8em; }

.hp_txt_large {
  font-size: 1.5em; }

.hp_img_tac {
  display: block;
  margin: 0 auto; }

.hp_mt20 {
  margin-top: 20px; }

.hp_txt_caution {
  color: #E00429; }

.hp_txt_exBold {
  font-weight: 900; }

.hp_txt_underLine {
  background: linear-gradient(transparent 75%, #FFE564 75%); }

.hp_txt_slant {
  position: relative;
  /*複数行*/ }
  .hp_txt_slant::before {
    display: block;
    content: "";
    width: 1em;
    height: 2px;
    border-radius: 12px;
    background: #000000;
    position: absolute;
    top: 50%;
    left: -1.2em;
    -webkit-transform: translateY(-50%) rotate(70deg);
    transform: translateY(-50%) rotate(70deg); }
  .hp_txt_slant::after {
    display: block;
    content: "";
    width: 1em;
    height: 2px;
    border-radius: 12px;
    background: #000000;
    position: absolute;
    top: 50%;
    right: -1.2em;
    -webkit-transform: translateY(-50%) rotate(-70deg);
    transform: translateY(-50%) rotate(-70deg); }
  .hp_txt_slant.hp_txt_slant__w::before {
    background: #fff; }
  .hp_txt_slant.hp_txt_slant__w::after {
    background: #fff; }
  .hp_txt_slant.hp_txt_slant__multi {
    position: relative;
    font-weight: bold; }
    .hp_txt_slant.hp_txt_slant__multi::before {
      display: block;
      content: "";
      width: 2em;
      height: 2px;
      border-radius: 12px;
      background: #000000;
      position: absolute;
      top: 50%;
      left: -4.2em;
      -webkit-transform: translateY(-50%) rotate(70deg);
      transform: translateY(-50%) rotate(70deg); }
    .hp_txt_slant.hp_txt_slant__multi::after {
      display: block;
      content: "";
      width: 2em;
      height: 2px;
      border-radius: 12px;
      background: #000000;
      position: absolute;
      top: 50%;
      right: -3.2em;
      -webkit-transform: translateY(-50%) rotate(-70deg);
      transform: translateY(-50%) rotate(-70deg); }

.hp_txt_dot {
  position: relative; }
  .hp_txt_dot::before {
    display: block;
    content: "";
    width: 0.2em;
    height: 0.2em;
    background: #FF520B;
    border-radius: 50%;
    position: absolute;
    top: -0.1em;
    left: 0;
    right: 0;
    margin: auto;
    z-index: -1; }

.hp_pos_rel {
  position: relative; }

/*文字の下アンダーライン*/
.hp_underline_y {
  border-bottom: solid 2px #F6CE25; }

/*--------------------------------------------------
btn
---------------------------------------------------*/
.btn {
  width: 100%;
  display: block;
  background: #FF520B;
  padding: 0.875em;
  border-radius: 88px;
  position: relative;
  text-align: center;
  z-index: auto;
  -webkit-transition: .3s all;
  transition: .3s all;
  /*	&:hover {
  		& .icon {
  				-webkit-transform: translateX(4px);
  			transform: translateX(4px);
  				-webkit-transition: .3s all;
  			transition: .3s all;
  		}
  		& .iconBox {
  				-webkit-transform: translateX(4px);
  			transform: translateX(4px);
  				-webkit-transition: .3s all;
  			transition: .3s all;
  		}
  	}*/ }
  .btn > .inner {
    display: flex;
    justify-content: center;
    align-items: center; }
  .btn .label {
    background: #ffcd14;
    background: linear-gradient(90deg, #ffcd14 0%, #ff5639 100%);
    border-radius: 4px;
    padding: 0.2em 0.3em;
    color: #fff;
    font-weight: bold;
    letter-spacing: 0.1em; }
  .btn .txt {
    color: #fff;
    font-size: 1.125em;
    font-weight: bold; }
  .btn .icon {
    width: 24px; }
  .btn.btn__doc {
    background: #0038CE; }
  .btn.btn__w {
    background: #06C052;
    border: solid 1px #06C052;
    padding: 1em;
    -webkit-transition: .3s all;
    transition: .3s all; }
    @media screen and (min-width: 768px) {
      .btn.btn__w {
        padding: 2.5vw; } }
    .btn.btn__w > .inner {
      display: flex;
      justify-content: flex-start;
      align-items: center;
      gap: 2px; }
      .btn.btn__w > .inner .txt {
        color: #ffffff;
        font-weight: bold;
        font-size: 1.313em;
        width: 100%; }
        @media screen and (min-width: 768px) {
          .btn.btn__w > .inner .txt {
            font-size: 2em; } }
      .btn.btn__w > .inner .icon {
        margin-left: auto;
        width: 7%; }
    .btn.btn__w:hover > .inner .icon {
      -webkit-transform: translateX(8px);
      transform: translateX(8px);
      -webkit-transition: .3s all;
      transition: .3s all; }
  .btn.btn-gradient {
    padding: 1.313em;
    background: linear-gradient(90deg, #ffcd14 0%, #ff5639 100%);
    box-shadow: 0px 5px 20px -1px rgba(0, 0, 0, 0.3); }
    .btn.btn-gradient::after {
      display: none; }
    .btn.btn-gradient > .inner {
      justify-content: center; }
      .btn.btn-gradient > .inner .txt {
        width: 100%;
        font-size: 1.5em; }
      .btn.btn-gradient > .inner .iconBox {
        width: 24px; }
  .btn.btn__submit {
    font-size: 1.313em;
    color: #fff;
    font-weight: bold;
    background: #FF520B;
    border-style: none;
    /*box-shadow: 0px 5px 12px -1px rgba(0,0,0,0.2);*/
    cursor: pointer; }
    .btn.btn__submit::after {
      display: none; }
    .btn.btn__submit.js-disabled {
      background: #fff;
      color: #333;
      pointer-events: none;
      border: solid 1px #333;
      cursor: default;
      box-shadow: none; }
  .btn.btn__back {
    background: #fff;
    color: #333;
    border: solid 1px #333;
    cursor: pointer; }
    .btn.btn__back::after {
      display: none; }

/*--------------------------------------------------
header
---------------------------------------------------*/
.header {
  width: 100vw;
  position: sticky;
  top: 0;
  z-index: 99999;
  background: #fff; }
  @media screen and (min-width: 768px) {
    .header {
      box-shadow: 0px 3px 16px -5px rgba(0, 0, 0, 0.3); } }
  .header.header__static {
    position: static; }
  .header > .inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    row-gap: 24px;
    background: #fff;
    position: relative;
    z-index: 9999; }
    @media screen and (min-width: 768px) {
      .header > .inner {
        padding: 1em 0.8em;
        padding: 12px 24px 20px 24px;
        flex-wrap: nowrap;
        gap: 16px; } }
  .header .logoBox {
    width: 40%;
    padding: 1em 0.8em;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto; }
    @media screen and (min-width: 768px) {
      .header .logoBox {
        width: 240px;
        padding: 0; } }
  .header .navBox {
    display: none;
    width: 100%;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    margin-left: auto;
    padding: 1em 0; }
    @media screen and (min-width: 768px) {
      .header .navBox {
        display: block;
        width: 100%;
        padding: 0;
        max-width: 520px; } }
    .header .navBox.js-active {
      display: block; }
    .header .navBox .navList {
      display: flex;
      justify-content: flex-end;
      align-items: center;
      flex-direction: column;
      gap: 24px; }
      @media screen and (min-width: 768px) {
        .header .navBox .navList {
          flex-direction: row; } }
      .header .navBox .navList > li {
        text-align: center;
        width: 100%; }
        @media screen and (min-width: 768px) {
          .header .navBox .navList > li {
            width: auto; } }
        .header .navBox .navList > li > a {
          display: block;
          width: 100%;
          padding: 0.5em;
          font-size: 0.875em;
          color: #101112; }
          @media screen and (min-width: 768px) {
            .header .navBox .navList > li > a {
              flex-direction: row;
              display: inline;
              width: auto;
              padding: 0; } }
  .header .btnBox {
    width: 100%;
    display: none; }
    @media screen and (min-width: 768px) {
      .header .btnBox {
        display: block;
        max-width: 370px; } }
    .header .btnBox > .inner {
      width: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 16px; }
  .header .navBtn {
    align-self: stretch;
    padding: 1em 0.8em;
    background: #FF520B;
    cursor: pointer;
    z-index: 999; }
    @media screen and (min-width: 768px) {
      .header .navBtn {
        display: none; } }
    .header .navBtn > .inner {
      width: 32px;
      height: 100%;
      position: relative; }
    .header .navBtn.js-active .navBtnLine {
      transition: .3s all;
      top: 50%;
      bottom: auto;
      -webkit-transform: rotate(-45deg) translateY(-50%);
      transform: rotate(-45deg) translateY(-50%); }
      .header .navBtn.js-active .navBtnLine:nth-child(2) {
        display: none; }
      .header .navBtn.js-active .navBtnLine:nth-child(3) {
        top: 50%;
        bottom: auto;
        -webkit-transform: rotate(45deg) translateY(-50%);
        transform: rotate(45deg) translateY(-50%); }
    .header .navBtn .navBtnLine {
      width: 100%;
      height: 2px;
      background: #fff;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      margin: auto; }
      .header .navBtn .navBtnLine:nth-child(2) {
        top: 50%; }
      .header .navBtn .navBtnLine:nth-child(3) {
        top: auto;
        bottom: 0; }

.gnaviBg {
  display: none;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.7);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100; }

/*--------------------------------------------------
footer
---------------------------------------------------*/
.footer {
  background: #242424; }
  .footer > .inner {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 16px;
    padding: 5vw 2vw 1vw;
    text-align: center; }
    @media screen and (min-width: 768px) {
      .footer > .inner {
        padding: 3vw 4vw 1vw; } }
  .footer .logoBox {
    width: 50%;
    margin: 0 auto; }
    @media screen and (min-width: 768px) {
      .footer .logoBox {
        max-width: 240px;
        width: 100%; } }
    .footer .logoBox + .ttl {
      color: #fff;
      font-weight: bold; }
  .footer .copyrightBox {
    text-align: center;
    padding: 1.1vw; }
    .footer .copyrightBox > small {
      color: #fff;
      font-size: 0.875em; }
  .footer .addressBox > .txt {
    color: #fff;
    font-weight: bold;
    font-size: 0.875em; }
  .footer .mapBox {
    text-align: center;
    margin: 1vw auto; }
    .footer .mapBox > a {
      color: #fff;
      font-weight: bold;
      padding-left: 1.2em;
      text-decoration: underline;
      background: url("../images/icon-map-1.svg");
      background-repeat: no-repeat;
      background-size: 14px;
      background-position: left;
      font-size: 0.875em; }
  .footer .telBox > .txt {
    color: #fff;
    font-weight: bold;
    font-size: 0.875em; }
    .footer .telBox > .txt > a {
      color: #fff;
      background: url("../images/icon-tel-1.svg");
      background-repeat: no-repeat;
      background-size: 14px;
      background-position: left;
      padding-left: 1.2em; }

/*--------------------------------------------------
PC右固定
---------------------------------------------------*/
.fixedBox {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 999;
  background: #231815;
  box-shadow: 0px 0px 16px -6px rgba(0, 0, 0, 0.4); }
  @media screen and (min-width: 768px) {
    .fixedBox {
      display: block;
      top: 50%;
      left: auto;
      bottom: auto;
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
      background: transparent;
      border-radius: 12px 0 0 12px;
      overflow: hidden; } }
  .fixedBox .upperBox {
    width: 100%;
    background: #F8DA06;
    align-self: stretch; }
    .fixedBox .upperBox > .inner > a {
      display: block;
      padding: 1em; }
      .fixedBox .upperBox > .inner > a > .imgBox img {
        display: block;
        margin: 0 auto; }
  .fixedBox .lowerBox {
    width: 100%;
    background: #06C755;
    align-self: stretch; }
    .fixedBox .lowerBox > .inner > a {
      display: block;
      padding: 1em; }
      .fixedBox .lowerBox > .inner > a > .imgBox img {
        display: block;
        margin: 0 auto; }

input::placeholder,
textarea::placeholder {
  color: #ccc; }

input {
  width: 100%;
  font-size: 1.125em;
  padding: 0.3em 0.5em; }
  input[type="radio"] {
    width: auto; }
  input[type="checkbox"] {
    width: auto;
    -webkit-transform: scale(1.5);
    transform: scale(1.5); }

textarea {
  width: 100%;
  font-size: 1.125em;
  padding: 0.5em; }

select {
  width: 100%;
  font-size: 1.125em;
  padding: 0.5em; }

.agreeBox {
  margin: 2em auto; }
  .agreeBox > .inner {
    text-align: center; }
  .agreeBox .txtBox > a {
    color: #FF520B;
    text-decoration: underline !important; }

.submitBox {
  margin: 2em auto;
  width: 90%; }
  @media screen and (min-width: 768px) {
    .submitBox {
      max-width: 460px;
      width: 100%; } }

/*--------------------------------------------------
確認画面
---------------------------------------------------*/
#confirm {
  background: #F7F6EE; }
  #confirm .formBox {
    background: #fff;
    padding: 2em;
    border-radius: 12px; }
  #confirm > .inner {
    width: 100%;
    margin: 2em auto; }
    @media screen and (min-width: 768px) {
      #confirm > .inner {
        max-width: 800px; } }
  #confirm .ttlBox {
    padding: 0.2em 0.5em;
    text-align: center; }
    #confirm .ttlBox .ttl {
      font-weight: bold;
      font-size: 1.2em;
      letter-spacing: 0.05em; }
      @media screen and (min-width: 768px) {
        #confirm .ttlBox .ttl {
          font-size: 1.5em; } }
  #confirm .leadBox {
    text-align: center;
    margin: 40px auto 24px; }
    #confirm .leadBox .txt {
      line-height: 1.8; }
  #confirm .submitBox {
    width: 100%; }
    @media screen and (min-width: 768px) {
      #confirm .submitBox {
        max-width: 460px; } }
    #confirm .submitBox > .inner {
      display: flex;
      flex-direction: column-reverse;
      align-items: center;
      justify-content: center;
      gap: 24px; }
    #confirm .submitBox .btnBox {
      width: 100%; }
      #confirm .submitBox .btnBox.btnBox__back {
        width: 60%; }

/*--------------------------------------------------
完了画面
---------------------------------------------------*/
#thanks {
  background: #F7F6EE;
  padding: 2em 1em; }
  #thanks > .inner {
    width: 100%;
    margin: 2em auto; }
    @media screen and (min-width: 768px) {
      #thanks > .inner {
        max-width: 800px; } }
  #thanks .ttlBox {
    padding: 0.2em 0.5em;
    text-align: center; }
    #thanks .ttlBox .ttl {
      font-weight: bold;
      font-size: 1.2em;
      letter-spacing: 0.05em; }
      @media screen and (min-width: 768px) {
        #thanks .ttlBox .ttl {
          font-size: 1.5em; } }
  #thanks .leadBox {
    margin: 2em auto; }
    @media screen and (min-width: 768px) {
      #thanks .leadBox {
        text-align: center; } }
    #thanks .leadBox .txt {
      line-height: 1.8; }
    #thanks .leadBox.leadBox__caution {
      border: solid 1px #E00429;
      border-radius: 12px;
      padding: 1.5em; }
  #thanks .topBtnBox {
    margin: 2em auto;
    width: 80%; }
    @media screen and (min-width: 768px) {
      #thanks .topBtnBox {
        width: 100%;
        max-width: 300px; } }

/*--------------------------------------------------
共通
---------------------------------------------------*/
/* --------------------------------------------------
   fv
---------------------------------------------------*/
#fv {
  position: relative;
  width: 100vw;
  background-image: url("../images/fv-bg@2x.png");
  background-repeat: no-repeat;
  background-size: 100%;
  /* 背景画像を上にずらしてコピーと人物が重なるように */
  background-position: bottom 10px right -50px;
}

#fv > .inner {
  width: 90%;
  /* margin: 0 10vw; */
  padding: 6vw 2vw 1vw;
}

#fv .fv-main {
  max-width: 100%;
}

/* 上部リード */
#fv .fv-kv-lead {
  font-size: 3.4vw;
  font-weight: 700;
  margin: 0 0 1vw;
}

/* メインキャッチコピー */
#fv .fv-kv-ttl {
  font-size: 5.2vw;
  line-height: 1.5;
  font-weight: 700;
  margin-bottom: 3vw;
  background: #ffffff;
  box-shadow: 0 0 15px rgba(0,0,0,.30);
}

#fv .fv-kv-ttl span {
  display: inline-block;
}
/* メダル：SPでは小さめ */
#fv .fv-medals {
  margin-top: 1vw;
}

#fv .fv-medals img {
  display: block;
  width: 100%;       /* ←SPで縮小 */
  max-width: 260px;
  height: auto;
  margin: 30vw 0 0;
}
/* ---------- PCレイアウト ---------- */
@media screen and (min-width: 500px) {
  #fv {
    height: 100%;
    background-image: url("../images/fv-bg@2x.png");
    background-size: 80%;
    background-position: top 80px right 50px;
    margin: 0 5vw;
  }
    #fv .fv-medals img {
    width: 500px;   /* PCでは元サイズに近いまま */
    max-width: 100%;
    margin: 3vw 0 0;
  }
}
@media screen and (min-width: 1000px) {
  #fv {
    height: 100%;
    background-image: url("../images/fv-bg@2x.png");
    background-size: 66%;
    background-position: top 50px right 50px;
    margin: 0 5vw;
  }
    #fv > .inner {
    max-width: 700px;
    width: 100%;
    padding: 5vw 1vw 0;
    display: flex;
    align-items: flex-start;
  }

  #fv .fv-main {
    max-width: 700px;
  }

  #fv .fv-kv-lead {
    font-size: 3rem;
    margin-bottom: 12px;
    margin: 0;
  }

  #fv .fv-kv-ttl {
    font-size: 2.2rem;
    margin-bottom: 12px;
  display: inline-block;           /* 背景色がテキストの幅にフィットするように */
  overflow-y: hidden;
  letter-spacing: -0.11em;
  background: #ffffff;             /* 背景を白に */
  padding: 0.4em 0.8em;            /* 文字の周りに余白 */
  border-radius: 4px;              /* 角を少し丸める（不要なら削除） */
  box-shadow: 0 0 15px rgba(0,0,0,.30); /* うっすら影（不要なら削除） */
  letter-spacing: 0.05em;
  }

  #fv .fv-medals img {
    width: 500px;   /* PCでは元サイズに近いまま */
    max-width: 100%;
    margin: 3vw 0 0;
  }
}  
@media screen and (min-width: 1400px) {
  #fv {
    height: 100%;
    background-image: url("../images/fv-bg@2x.png");
    background-size: 60%;
    background-position: top -50px right 200px;
    margin: 0 10vw;
  }

  #fv > .inner {
    max-width: 700px;
    width: 100%;
    padding: 5vw 1vw 10vw;
    display: flex;
    align-items: flex-start;
  }

  #fv .fv-main {
    max-width: 700px;
  }

  #fv .fv-kv-lead {
    font-size: 3rem;
    margin-bottom: 12px;
  }

  #fv .fv-kv-ttl {
    font-size: 2.2rem;
    margin-bottom: 12px;
  display: inline-block;           /* 背景色がテキストの幅にフィットするように */
  overflow-y: hidden;
  letter-spacing: -0.11em;
  background: #ffffff;             /* 背景を白に */
  padding: 0.4em 0.8em;            /* 文字の周りに余白 */
  border-radius: 4px;              /* 角を少し丸める（不要なら削除） */
  box-shadow: 0 0 15px rgba(0,0,0,.30); /* うっすら影（不要なら削除） */
  letter-spacing: 0.05em;
  }
  #fv .fv-medals img {
    width: 600px;   /* PCでは元サイズに近いまま */
    max-width: 100%;
    margin: 5vw 0 0;
  }
}

/* FV外に出した「お客様の声」 */
.fv-voice{
  width: 100%;
  display: flex;
  justify-content: center;
  padding: 24px 16px; /* 余白 */
}

.fv-voice-inner{
  width: min(920px, 100%); /* PCでもSPでも中央 */
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 0 15px rgba(0,0,0,0.08);
  padding: 20px 18px;
  text-align: center;
}

.fv-voice-ttl{
  font-weight: 700;
  color: #2f7edb;
  text-align: center;
  margin-bottom: 14px;
  font-size: 18px;
}

.fv-voice-txt{
  line-height: 1.8;
  font-size: 14px;
}

.fv-voice-txt + .fv-voice-txt{
  margin-top: 10px;
}

/* PC */
@media screen and (min-width: 768px){
  .fv-voice{
    padding: 32px 24px;
  }
  .fv-voice-inner{
    padding: 28px 28px;
  }
  .fv-voice-ttl{
    font-size: 20px;
  }
  .fv-voice-txt{
    font-size: 16px;
  }
}

/*--------------------------------------------------
バックオフィス業務代行します
---------------------------------------------------*/
#ikkatsu > .inner {
  padding: 4vw; }
  #ikkatsu > .inner > .ttlBox {
    text-align: center; }
    #ikkatsu > .inner > .ttlBox .ttl {
      font-size: 1.7em;
      font-weight: bold; }
      @media screen and (min-width: 768px) {
        #ikkatsu > .inner > .ttlBox .ttl {
          font-size: 2.8em; } }
#ikkatsu .workBox {
  width: 100%;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.16);
  padding: 8vw;
  border-radius: 12px;
  margin: 3vw auto; }
  @media screen and (min-width: 768px) {
    #ikkatsu .workBox {
      padding: 5vw;
      max-width: 960px; } }
  #ikkatsu .workBox > .inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: column;
    gap: 24px; }
    @media screen and (min-width: 768px) {
      #ikkatsu .workBox > .inner {
        flex-direction: row; } }
  #ikkatsu .workBox .txtBox {
    width: 90%; }
    #ikkatsu .workBox .txtBox > .ttl {
      font-size: 1.125em;
      font-weight: bold;
      position: relative;
      margin-bottom: 4vw; }
      @media screen and (min-width: 768px) {
        #ikkatsu .workBox .txtBox > .ttl {
          font-size: 1.8em; } }
      #ikkatsu .workBox .txtBox > .ttl::after {
        display: block;
        content: "";
        width: 100px;
        height: 3px;
        background: #f5187a;
        position: absolute;
        bottom: -10px;
        left: 0; }
        @media screen and (min-width: 768px) {
          #ikkatsu .workBox .txtBox > .ttl::after {
            bottom: -20px; } }
  #ikkatsu .workBox .imgBox {
    width: 100%; }

/*--------------------------------------------------
fv下のcv
---------------------------------------------------*/
.cv {
  width: 100vw;
  height: 100%;
  background: url("../images/bg-cv.webp");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center; }
  .cv > .inner {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 auto;
    overflow: hidden;
    position: relative; }
    @media screen and (min-width: 768px) {
      .cv > .inner {
        max-width: 920px;
        gap: 24px; } }
  .cv .txtBox {
    width: 72%;
    padding: 1em; }
    @media screen and (min-width: 768px) {
      .cv .txtBox {
        width: 100%;
        padding: 0; } }
  .cv .leadBox {
    text-align: center; }
    .cv .leadBox .subTtl {
      font-size: 0.875em;
      font-weight: bold; }
      @media screen and (min-width: 768px) {
        .cv .leadBox .subTtl {
          font-size: 1.125em; } }
    .cv .leadBox .ttl {
      display: flex;
      justify-content: center;
      align-items: center;
      font-weight: bold;
      gap: 4px;
      font-size: 1.5em;
      letter-spacing: 0.05em; }
      @media screen and (min-width: 768px) {
        .cv .leadBox .ttl {
          font-size: 2.5em; } }
      .cv .leadBox .ttl .num {
        width: 14%; }
  .cv .btnBox {
    width: 100%;
    margin: 1.2vw auto; }
    @media screen and (min-width: 768px) {
      .cv .btnBox {
        max-width: 600px;
        padding: 0; } }
  .cv .imgBox {
    width: 34%;
    position: absolute;
    right: -10px;
    bottom: 0; }
    @media screen and (min-width: 768px) {
      .cv .imgBox {
        width: 70%;
        position: static; } }

/*--------------------------------------------------
trouble
---------------------------------------------------*/
#trouble {
  background: #E5E5E5;
}

#trouble > .inner {
  width: 100%;
  max-width: 1040px;          /* PC側を少しワイドに */
  margin: 0 auto;
  padding: 10vw 3vw;          /* SPの左右余白も少しだけ削る */
}

@media screen and (min-width: 768px) {
  #trouble > .inner {
    padding: 5vw 1.5vw 6vw;   /* PCも左右をタイトめに */
  }
}

/* 見出し */
.troubleHead {
  text-align: center;
  margin-bottom: 8vw;
}

@media screen and (min-width: 768px) {
  .troubleHead {
    margin-bottom: 4vw;
  }
}

.troubleHead__ttl {
  font-weight: bold;
  font-size: 1.375em;
  line-height: 1.6;
}

@media screen and (min-width: 768px) {
  .troubleHead__ttl {
    font-size: 2em;
  }
}

.troubleHead__ttl .line2 {
  display: block;
}

/* レイアウト本体 */
/* レイアウト本体 */
.troubleBody {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  margin: 40px 0 80px;    /* ← 上下40px、左右0px（カンマ→スペースに修正） */
}


@media screen and (min-width: 768px) {
  .troubleBody {
    flex-direction: row;
    align-items: center;
    gap: 40px;
    margin: 50px 0 100px;
  }
}

/* 左側：画像 */
.troubleBody__img {
  width: 100%;
  max-width: 480px;
}

@media screen and (min-width: 768px){
  .troubleBody__img{ width: 100%; }
  .troubleBody__content{ width: 100%; }
}

.troubleBody__img img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 4px;
}

/* 右側：テキスト */
.troubleBody__content {
  width: 100%;
  max-width: 640px;            /* SP も十分横に広げる */
  margin: 0 auto;
}

@media screen and (min-width: 768px) {
  .troubleBody__content {
    width: 56%;                /* PC ではテキスト側を太めに確保 */
    max-width: none;
    padding-top: 0;
  }
}

/* チェックリスト */
.troubleCheckList {
  list-style: none;
  margin: 0 0 1.5em;
  padding: 0;
}

.troubleCheckList li {
  position: relative;
  padding-left: 1.8em;         /* インデントを少し削って文字幅UP */
  font-size: 0.95em;
  line-height: 1.8;
}

@media screen and (min-width: 768px) {
  .troubleCheckList li {
    font-size: 1.5em;
  }
}

.troubleCheckList li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.4em;
  width: 1.3em;
  height: 1.3em;
  background: url("../images/icon-check-circle@2x.webp") no-repeat center / contain;
}

/* 注意文 */
.troubleNote {
  font-size: 0.95em;
  font-weight: bold;
  line-height: 1;
}

@media screen and (min-width: 768px) {
  .troubleNote {
    font-size: 1.5em;
  }
}

#trouble .arrowBox {
  width: 100%;
  text-align: center;
  margin: 3vw auto;
}

#trouble .arrowBox .imgBox {
  display: inline-block;
}
.arrowBox .imgBox img{
  width: 50%;     /* or 104px */
  height: auto;
  display: block;
  margin: 0 auto;
}
/* =========================================================
   trouble - answerBox（白いカード＋横並び）
   ========================================================= */
#trouble .answerBox {
  width: 100%;
  padding: 0 16px;
  margin: 40px auto;
}

#trouble .answerBox-inner {
  background: #fff;
  border-radius: 14px;
  border: 1px solid #FF520B;
  padding: 32px 24px;
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;      /* SP：縦並び */
  gap: 28px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.10);
}

/* テキスト側 */
#trouble .answerBox .txtBox {
  width: 100%;
}

#trouble .answerBox .txtBox .ttl {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 1.8em;
  line-height: 1.4;
}

#trouble .answerBox .txtBox .ttl > .txt {
  font-weight: bold;
}

#trouble .answerBox .txtBox .ttl > .txt.hp_txt_large {
  color: #FF520B;
}

#trouble .answerBox .leadBox {
  margin-top: 16px;
  text-align: center;
}

#trouble .answerBox .leadBox > .txt {
  font-size: 1rem;
  line-height: 1.8;
  font-weight: bold;
}

/* タグ3つ */
#trouble .support-tags {
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

#trouble .support-tags .tag {
  color: #fff;
  font-weight: bold;
  font-size: 0.9rem;
  padding: 8px 18px;
  border-radius: 4px;
  text-align: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

#trouble .tag-orange { background: #FF7A00; }
#trouble .tag-blue   { background: #0049BC; }
#trouble .tag-green  { background: #46C842; }

/* 画像側 */
#trouble .answerBox .imgBox {
  width: 60%;
  margin: 0 auto;
}

#trouble .answerBox .imgBox img {
  width: 80%;
  height: auto;
}

/* PC レイアウト */
@media screen and (min-width: 768px) {

  #trouble .answerBox {
    padding: 0;
    margin: 60px auto;
  }

  #trouble .answerBox-inner {
    flex-direction: row;          /* 横並び */
    align-items: center;
    padding: 50px 60px;
    gap: 60px;
  }

  #trouble .answerBox .txtBox {
    flex: 1;
  }

  #trouble .answerBox .txtBox .ttl {
    flex-direction: row;
    justify-content: flex-start;
    gap: 4px;
    font-size: 2em;
    text-align: left;
  }

  #trouble .answerBox .leadBox {
    text-align: left;
  }

  #trouble .answerBox .leadBox > .txt {
    font-size: 1.05rem;
  }

  #trouble .support-tags .tag {
    font-size: 1rem;
    padding: 10px 20px;
  }

  #trouble .answerBox .imgBox {
    width: 40%;
    min-width: 280px;
    margin: 0;
  }
}



/* 3つ並びのタグボックス */
.support-tags {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
  flex-wrap: wrap; /* SP で折り返し可 */
}

.support-tags .tag {
  color: #fff;
  font-weight: 700;
  font-size: 1.5rem;
  padding: 8px 18px;
  border-radius: 4px;
  text-align: center;
  min-width: 120px;      /* ある程度幅確保 */
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

/* 色は添付画像と同系色 */
.tag-orange {
  background: #FF7A00;
}

.tag-blue {
  background: #0049BC;
}

.tag-green {
  background: #46C842;
}

/* SP（〜767px）：中央寄せ＋大きさ少し調整 */
@media screen and (max-width: 767px) {
  .support-tags {
    gap: 10px;
  }

  .support-tags .tag {
    width: 100%;
    max-width: 300px;
    font-size: 1.2rem;
    padding: 10px 14px;
    margin: 0 auto;
  }
}


/*--------------------------------------------------
特徴
---------------------------------------------------*/
#feature {
  position: relative;
  padding: 10vw 2vw; }
  @media screen and (min-width: 768px) {
    #feature {
      padding: 5vw 2vw; } }
  #feature > .inner {
    margin: 0 auto; }
    @media screen and (min-width: 768px) {
      #feature > .inner {
        max-width: 960px;
        width: 100%; } }
    #feature > .inner > .ttlBox {
      text-align: center; }
      #feature > .inner > .ttlBox .ttl {
        font-size: 1.8em; }
        @media screen and (min-width: 768px) {
          #feature > .inner > .ttlBox .ttl {
            font-size: 2em; } }
        #feature > .inner > .ttlBox .ttl > .txt {
          display: block; }
        #feature > .inner > .ttlBox .ttl > .subTxt {
          display: block;
          font-size: 0.5em; }
      #feature > .inner > .ttlBox > .imgBox img {
        width: 10%;
        display: block;
        margin: 0 auto 0.5vw; }
        @media screen and (min-width: 768px) {
          #feature > .inner > .ttlBox > .imgBox img {
            width: auto; } }
  #feature .featureBox {
    margin: 4vw auto 2vw;
    width: 70%; }
    @media screen and (min-width: 768px) {
      #feature .featureBox {
        width: 100%; } }
    #feature .featureBox .featureList {
      display: grid;
      grid-template-columns: repeat(1, 1fr);
      gap: 24px; }
      @media screen and (min-width: 768px) {
        #feature .featureBox .featureList {
          grid-template-columns: repeat(3, minmax(300px, 1fr)); } }
      #feature .featureBox .featureList > li {
        background: #FDEEE8;
        padding: 2.5vw 2.8vw 6vw;
        border-radius: 12px; }
        @media screen and (min-width: 768px) {
          #feature .featureBox .featureList > li {
            padding: 2.5vw 2.8vw; } }
        #feature .featureBox .featureList > li > .imgBox {
          display: block;
          margin: 0 auto 5vw;
          width: 20%;
          position: relative; }
          @media screen and (min-width: 768px) {
            #feature .featureBox .featureList > li > .imgBox {
              width: 80px;
              margin: 0 auto 2vw; } }
          #feature .featureBox .featureList > li > .imgBox::after {
            display: block;
            content: "";
            width: 24px;
            height: 1px;
            background: #707070;
            position: absolute;
            bottom: -3px;
            left: 0;
            right: 0;
            margin: auto;
            z-index: 1; }
            @media screen and (min-width: 768px) {
              #feature .featureBox .featureList > li > .imgBox::after {
                bottom: -10px; } }
        #feature .featureBox .featureList > li .leadBox {
          text-align: center; }
          #feature .featureBox .featureList > li .leadBox .txt {
            font-size: 1.5em;
            font-weight: bold;
            line-height: 1.5; }
            @media screen and (min-width: 768px) {
              #feature .featureBox .featureList > li .leadBox .txt {
                line-height: 1.6;
                font-size: 1.45em; } }
            #feature .featureBox .featureList > li .leadBox .txt > .or {
              color: #FF520B; }
            #feature .featureBox .featureList > li .leadBox .txt .sup__r {
              position: relative; }
            #feature .featureBox .featureList > li .leadBox .txt .sup {
              font-size: 0.7em;
              color: #000;
              position: absolute;
              top: -2px;
              right: -16px; }
  #feature .noticeBox {
    margin: 1em auto; }
    #feature .noticeBox .txt {
      font-size: 0.875em;
      text-indent: -1em;
      padding-left: 1em; }

/*--------------------------------------------------
サービス
---------------------------------------------------*/
#service {
  position: relative;
  background: #F5F5F5;
  padding: 10vw 2vw; }
  @media screen and (min-width: 768px) {
    #service {
      padding: 5vw 2vw; } }
  #service > .inner {
    margin: 0 auto; }
    @media screen and (min-width: 768px) {
      #service > .inner {
        max-width: 960px;
        width: 100%; } }
    #service > .inner > .ttlBox {
      text-align: center; }
      #service > .inner > .ttlBox .ttl {
        font-size: 1.8em; }
        @media screen and (min-width: 768px) {
          #service > .inner > .ttlBox .ttl {
            font-size: 2em; } }
        #service > .inner > .ttlBox .ttl > .txt {
          display: block; }
        #service > .inner > .ttlBox .ttl > .subTxt {
          display: block;
          font-size: 0.5em; }
      #service > .inner > .ttlBox > .imgBox img {
        width: 10%;
        display: block;
        margin: 0 auto 0.5vw; }
        @media screen and (min-width: 768px) {
          #service > .inner > .ttlBox > .imgBox img {
            width: auto; } }
  #service .serviceBox {
    margin: 4vw auto 2vw; }
    #service .serviceBox .serviceList > li {
      background: #fff;
      border: solid 1px #42D027;
      border-radius: 12px;
      padding: 4vw; }
      @media screen and (min-width: 768px) {
        #service .serviceBox .serviceList > li {
          padding: 2vw 3vw; } }
#service .serviceBox .serviceList > li:nth-of-type(n+2) {
  margin-top: 32px;
}

@media screen and (min-width:768px){
  #service .serviceBox .serviceList > li:nth-of-type(n+2) {
    margin-top: 40px;
  }
}
    #service .serviceBox .serviceList .headBox > .inner {
      display: flex;
      justify-content: flex-start;
      align-items: flex-start;
      flex-direction: column;
      gap: 8px; }
      @media screen and (min-width: 768px) {
        #service .serviceBox .serviceList .headBox > .inner {
          align-items: center;
          flex-direction: row;
          gap: 16px; } }
    #service .serviceBox .serviceList .headBox .ttlBox {
      width: auto; }
      #service .serviceBox .serviceList .headBox .ttlBox > .ttl {
        font-size: 1.5em; }
        @media screen and (min-width: 768px) {
          #service .serviceBox .serviceList .headBox .ttlBox > .ttl {
            font-size: 1.6em; } }
    #service .serviceBox .serviceList .headBox .managerBox {
      width: auto;
      font-size: 1.12em;
      font-weight: bold; }
      @media screen and (min-width: 768px) {
        #service .serviceBox .serviceList .headBox .managerBox {
          font-size: 1.2em; } }
    #service .serviceBox .serviceList .headBox .leadBox {
      width: 100%; }
      @media screen and (min-width: 768px) {
        #service .serviceBox .serviceList .headBox .leadBox {
          max-width: 310px;
          margin-left: auto; } }
      #service .serviceBox .serviceList .headBox .leadBox .txt {
        font-size: 0.8em; }
        @media screen and (min-width: 768px) {
          #service .serviceBox .serviceList .headBox .leadBox .txt {
            font-size: 0.8em; } }
    #service .serviceBox .serviceList .businessBox {
      margin-top: 4vw; }
      @media screen and (min-width: 768px) {
        #service .serviceBox .serviceList .businessBox {
          margin-top: 1.8vw; } }
      #service .serviceBox .serviceList .businessBox .businessList {
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;
        gap: 8px; }
        #service .serviceBox .serviceList .businessBox .businessList > li {
          width: auto;
          background: #F0FCEE;
          padding: 0.2em 1em;
          border-radius: 44px;
          text-align: center;
          font-size: 1em; }
          @media screen and (min-width: 768px) {
            #service .serviceBox .serviceList .businessBox .businessList > li {
              padding: 0.5vw 2vw;
              font-size: 0.9em; } }
    #service .serviceBox .serviceList .bottomBox {
      margin-top: 3vw;
      border-top: dashed 1px #42D027;
      padding: 3vw 0 0; }
      @media screen and (min-width: 768px) {
        #service .serviceBox .serviceList .bottomBox {
          margin-top: 1.8vw;
          padding: 1.6vw 0 0; } }
      #service .serviceBox .serviceList .bottomBox > .inner {
        display: flex;
        justify-content: flex-start;
        flex-direction: column;
        gap: 8px; }
        @media screen and (min-width: 768px) {
          #service .serviceBox .serviceList .bottomBox > .inner {
            flex-direction: row; } }
      #service .serviceBox .serviceList .bottomBox .ttlBox {
        width: 20%;
        background: #42D027;
        text-align: center;
        padding: 0.2vw 1vw; }
        @media screen and (min-width: 768px) {
          #service .serviceBox .serviceList .bottomBox .ttlBox {
            width: 10%; } }
        #service .serviceBox .serviceList .bottomBox .ttlBox .ttl {
          color: #fff;
          letter-spacing: 0.05em;
          font-size: 1.125em; }
          @media screen and (min-width: 768px) {
            #service .serviceBox .serviceList .bottomBox .ttlBox .ttl {
              font-size: 1.2em; } }
      #service .serviceBox .serviceList .bottomBox .leadBox {
        width: 100%; }
        #service .serviceBox .serviceList .bottomBox .leadBox .txt {
          font-weight: bold;
          font-size: 1.125em; }
          @media screen and (min-width: 768px) {
            #service .serviceBox .serviceList .bottomBox .leadBox .txt {
              font-size: 1.3em; } }

      /* サービス内「業務内容:◯◯」用ラベル */
      .managerBox .txt.hukushikaikei,
      .managerBox .txt.kyuyo,
      .managerBox .txt.kaikei,
      .managerBox .txt.seikyu {
        display: inline-block;
        color: #fff;
        padding: 0.3em 0.8em;
        border-radius: 4px;
        font-weight: bold;
        line-height: 1;
      }

      /* fvBusinessBox と同じ色に合わせる */
      .managerBox .txt.hukushikaikei { background: #FF520B; } /* 障がい福祉特有の会計 と同色 */
      .managerBox .txt.kyuyo        { background: #F8C410; } /* 給与計算 と同色 */
      .managerBox .txt.kaikei       { background: #31B3F1; } /* 処遇改善加算 国保連請求 と同色 */
      .managerBox .txt.seikyu       { background: #1C34CC; } /* 法人設立 と同色 */

/*--------------------------------------------------
導入の声
---------------------------------------------------*/
#voice {
  position: relative;
  background: #FFFCDD;
  padding: 10vw 2vw; }
  @media screen and (min-width: 768px) {
    #voice {
      padding: 5vw 2vw; } }
  #voice > .inner {
    margin: 0 auto; }
    @media screen and (min-width: 768px) {
      #voice > .inner {
        max-width: 960px;
        width: 100%; } }
    #voice > .inner > .ttlBox {
      text-align: center; }
      #voice > .inner > .ttlBox .ttl {
        font-size: 1.8em; }
        @media screen and (min-width: 768px) {
          #voice > .inner > .ttlBox .ttl {
            font-size: 2em; } }
        #voice > .inner > .ttlBox .ttl > .txt {
          display: block; }
        #voice > .inner > .ttlBox .ttl > .subTxt {
          display: block;
          font-size: 0.5em; }
      #voice > .inner > .ttlBox > .imgBox img {
        width: 10%;
        display: block;
        margin: 0 auto 0.5vw; }
        @media screen and (min-width: 768px) {
          #voice > .inner > .ttlBox > .imgBox img {
            width: auto; } }
      #voice > .inner > .ttlBox + .leadBox {
        text-align: center;
        display: block;
        margin: 3vw auto; }
        #voice > .inner > .ttlBox + .leadBox .txt {
          font-size: 0.875em; }
          @media screen and (min-width: 768px) {
            #voice > .inner > .ttlBox + .leadBox .txt {
              font-size: 1.2em; } }
  #voice .voiceBox {
    margin: 4vw auto 2vw; }
    @media screen and (min-width: 768px) {
      #voice .voiceBox {
        margin-top: 0; } }
    #voice .voiceBox .voiceList > li:nth-of-type(n+2) {
      margin-top: 4vw; }
      @media screen and (min-width: 768px) {
        #voice .voiceBox .voiceList > li:nth-of-type(n+2) {
          margin-top: 2vw; } }
    #voice .voiceBox .voiceList > li > .inner {
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column; }
      @media screen and (min-width: 768px) {
        #voice .voiceBox .voiceList > li > .inner {
          flex-direction: row; } }
    #voice .voiceBox .voiceList > li .thumbBox {
      display: flex;
      align-items: center;
      width: 100%;
      background: #FFF7A1;
      padding: 3vw 1vw;
      border-radius: 12px 12px 0 0; }
      @media screen and (min-width: 768px) {
        #voice .voiceBox .voiceList > li .thumbBox {
          display: block;
          width: 45%;
          border-radius: 12px 0 0 12px; } }
      #voice .voiceBox .voiceList > li .thumbBox > .imgBox {
        width: 30%;
        display: block;
        margin: 0 auto; }
        @media screen and (min-width: 768px) {
          #voice .voiceBox .voiceList > li .thumbBox > .imgBox {
            width: 70%; } }
      #voice .voiceBox .voiceList > li .thumbBox > .ttlBox {
        width: 100%;
        text-align: center;
        margin: 1vw auto; }
        #voice .voiceBox .voiceList > li .thumbBox > .ttlBox .txt {
          font-weight: bold; }
    #voice .voiceBox .voiceList > li .txtBox {
      width: 100%;
      display: flex;
      align-items: center;
      align-self: stretch;
      background: #fff;
      padding: 8vw;
      position: relative; }
      @media screen and (min-width: 768px) {
        #voice .voiceBox .voiceList > li .txtBox {
          padding: 4vw; } }
      #voice .voiceBox .voiceList > li .txtBox::before {
        display: block;
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-right: 12px solid transparent;
        border-left: 12px solid transparent;
        border-bottom: 24px solid #ffffff;
        border-top: 0;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        margin: auto;
        z-index: 1; }
        @media screen and (min-width: 768px) {
          #voice .voiceBox .voiceList > li .txtBox::before {
            border-style: solid;
            border-top: 15px solid transparent;
            border-bottom: 15px solid transparent;
            border-right: 24px solid #fff;
            border-left: 0;
            top: 50%;
            left: -18px;
            right: auto;
            transform: translateY(-50%);
            margin: 0; } }
      #voice .voiceBox .voiceList > li .txtBox .ttlBox {
        margin-bottom: 4vw; }
        @media screen and (min-width: 768px) {
          #voice .voiceBox .voiceList > li .txtBox .ttlBox {
            margin-bottom: 2vw; } }
        #voice .voiceBox .voiceList > li .txtBox .ttlBox .ttl {
          font-size: 1.5em; }
          @media screen and (min-width: 768px) {
            #voice .voiceBox .voiceList > li .txtBox .ttlBox .ttl {
              font-size: 1.45em; } }
      #voice .voiceBox .voiceList > li .txtBox .leadBox > .txt {
        font-size: 0.875em;
        line-height: 1.7; }
        @media screen and (min-width: 768px) {
          #voice .voiceBox .voiceList > li .txtBox .leadBox > .txt {
            font-size: 0.9em; } }

/*--------------------------------------------------
料金プラン
---------------------------------------------------*/
#plan {
  position: relative;
  padding: 10vw 2vw; }
  @media screen and (min-width: 768px) {
    #plan {
      padding: 5vw 2vw; } }
  #plan > .inner {
    margin: 0 auto; }
    @media screen and (min-width: 768px) {
      #plan > .inner {
        max-width: 960px;
        width: 100%; } }
    #plan > .inner > .ttlBox {
      text-align: center; }
      #plan > .inner > .ttlBox .ttl {
        font-size: 1.8em; }
        @media screen and (min-width: 768px) {
          #plan > .inner > .ttlBox .ttl {
            font-size: 2em; } }
        #plan > .inner > .ttlBox .ttl > .txt {
          display: block; }
        #plan > .inner > .ttlBox .ttl > .subTxt {
          display: block;
          font-size: 0.5em; }
      #plan > .inner > .ttlBox > .imgBox img {
        width: 10%;
        display: block;
        margin: 0 auto 0.5vw; }
        @media screen and (min-width: 768px) {
          #plan > .inner > .ttlBox > .imgBox img {
            width: auto; } }
      #plan > .inner > .ttlBox + .leadBox {
        text-align: center;
        display: block;
        margin: 4vw auto 6vw; }
        @media screen and (min-width: 768px) {
          #plan > .inner > .ttlBox + .leadBox {
            margin: 3vw auto; } }
        #plan > .inner > .ttlBox + .leadBox .txt {
          font-size: 0.875em; }
          @media screen and (min-width: 768px) {
            #plan > .inner > .ttlBox + .leadBox .txt {
              font-size: 1.2em; } }
  #plan .planBox {
    margin: 4vw auto 2vw;
    width: 90%; }
    @media screen and (min-width: 768px) {
      #plan .planBox {
        width: 100%; } }
    #plan .planBox .planList {
      display: grid;
      grid-template-columns: repeat(1, 1fr);
      gap: 24px; }
      @media screen and (min-width: 768px) {
        #plan .planBox .planList {
          grid-template-columns: repeat(3, minmax(300px, 1fr)); } }
      #plan .planBox .planList > li {
        padding: 8vw 4vw; }
        @media screen and (min-width: 768px) {
          #plan .planBox .planList > li {
            padding: 2vw; } }
        #plan .planBox .planList > li:nth-of-type(1) {
          background: #FFEEE7; }
        #plan .planBox .planList > li:nth-of-type(2) {
          background: #ECFBE9; }
          #plan .planBox .planList > li:nth-of-type(2) .leadBox.leadBox__answer > .txt.hp_txt_large {
            color: #42D027; }
        #plan .planBox .planList > li:nth-of-type(3) {
          background: #E6F6FE; }
          #plan .planBox .planList > li:nth-of-type(3) .leadBox.leadBox__answer > .txt.hp_txt_large {
            color: #0038CE; }
        #plan .planBox .planList > li .imgBox {
          display: block;
          width: 90%;
          margin: 0 auto; }
          @media screen and (min-width: 768px) {
            #plan .planBox .planList > li .imgBox {
              width: 100%; } }
        #plan .planBox .planList > li .leadBox {
          margin: 1em auto;
          text-align: center;
          border-top: solid 1px #fff;
          position: relative;
          padding-top: 1em; }
          @media screen and (min-width: 768px) {
            #plan .planBox .planList > li .leadBox {
              margin: 1vw auto;
              padding-top: 1vw; } }
          #plan .planBox .planList > li .leadBox > .txt {
            font-size: 1.125em; }
            @media screen and (min-width: 768px) {
              #plan .planBox .planList > li .leadBox > .txt {
                font-size: 1.1em; } }
          #plan .planBox .planList > li .leadBox.leadBox__answer {
            border-style: none;
            padding-top: 1.5em; }
            @media screen and (min-width: 768px) {
              #plan .planBox .planList > li .leadBox.leadBox__answer {
                padding-top: 2vw; } }
            #plan .planBox .planList > li .leadBox.leadBox__answer::after {
              display: block;
              content: "";
              width: 0;
              height: 0;
              border-style: solid;
              border-right: 12px solid transparent;
              border-left: 12px solid transparent;
              border-top: 14px solid #fff;
              border-bottom: 0;
              position: absolute;
              top: 0;
              left: 0;
              right: 0;
              margin: auto;
              z-index: 1; }
            #plan .planBox .planList > li .leadBox.leadBox__answer > .txt {
              display: inline-block;
              font-size: 1.125em; }
              @media screen and (min-width: 768px) {
                #plan .planBox .planList > li .leadBox.leadBox__answer > .txt {
                  font-size: 0.9em; } }
              #plan .planBox .planList > li .leadBox.leadBox__answer > .txt.hp_txt_large {
                font-size: 2em;
                color: #FF520B;
                font-weight: bold; }
                #plan .planBox .planList > li .leadBox.leadBox__answer > .txt.hp_txt_large.hp_txt_underline {
                  background: linear-gradient(transparent 75%, #fff 75%); }

/*--------------------------------------------------
お問合わせ
---------------------------------------------------*/
#contact, #confirm {
  position: relative;
  padding: 10vw 2vw; }
  @media screen and (min-width: 768px) {
    #contact, #confirm {
      padding: 5vw 2vw; } }
  #contact > .inner, #confirm > .inner {
    margin: 0 auto; }
    @media screen and (min-width: 768px) {
      #contact > .inner, #confirm > .inner {
        max-width: 760px;
        width: 100%; } }
    #contact > .inner > .ttlBox, #confirm > .inner > .ttlBox {
      text-align: center; }
      #contact > .inner > .ttlBox .ttl, #confirm > .inner > .ttlBox .ttl {
        font-size: 1.8em; }
        @media screen and (min-width: 768px) {
          #contact > .inner > .ttlBox .ttl, #confirm > .inner > .ttlBox .ttl {
            font-size: 2em; } }
        #contact > .inner > .ttlBox .ttl > .txt, #confirm > .inner > .ttlBox .ttl > .txt {
          display: block; }
        #contact > .inner > .ttlBox .ttl > .subTxt, #confirm > .inner > .ttlBox .ttl > .subTxt {
          display: block;
          font-size: 0.5em; }
      #contact > .inner > .ttlBox > .imgBox img, #confirm > .inner > .ttlBox > .imgBox img {
        width: 10%;
        display: block;
        margin: 0 auto 0.5vw; }
        @media screen and (min-width: 768px) {
          #contact > .inner > .ttlBox > .imgBox img, #confirm > .inner > .ttlBox > .imgBox img {
            width: auto; } }
      #contact > .inner > .ttlBox + .leadBox, #confirm > .inner > .ttlBox + .leadBox {
        text-align: center;
        display: block;
        margin: 3vw auto; }
        @media screen and (min-width: 768px) {
          #contact > .inner > .ttlBox + .leadBox, #confirm > .inner > .ttlBox + .leadBox {
            margin: 4vw auto 6vw; } }
        #contact > .inner > .ttlBox + .leadBox .txt, #confirm > .inner > .ttlBox + .leadBox .txt {
          font-size: 0.875em; }
          @media screen and (min-width: 768px) {
            #contact > .inner > .ttlBox + .leadBox .txt, #confirm > .inner > .ttlBox + .leadBox .txt {
              font-size: 1.2em; } }
  #contact .leadBox, #confirm .leadBox {
    margin: 32px auto;
    text-align: center; }
  #contact .formBox, #confirm .formBox {
    margin: 2.5em auto; }
  #contact .contBox, #confirm .contBox {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: column;
    gap: 8px;
    padding: 1.313em 0;
    border-top: solid 1px #BFBFBF; }
    @media screen and (min-width: 768px) {
      #contact .contBox, #confirm .contBox {
        flex-direction: row;
        gap: 24px; } }
    #contact .contBox:last-child, #confirm .contBox:last-child {
      border-bottom: solid 1px #BFBFBF; }
    #contact .contBox > .ttl, #confirm .contBox > .ttl {
      -ms-flex: 0 1 auto;
      flex: 0 1 auto;
      width: 100%; }
      @media screen and (min-width: 768px) {
        #contact .contBox > .ttl, #confirm .contBox > .ttl {
          width: 50%; } }
    #contact .contBox > .cont, #confirm .contBox > .cont {
      -ms-flex: 0 1 auto;
      flex: 0 1 auto;
      width: 100%; }
      #contact .contBox > .cont > .hp_txt_small, #confirm .contBox > .cont > .hp_txt_small {
        color: #aaa; }
    #contact .contBox > .contList, #confirm .contBox > .contList {
      -ms-flex: 0 1 auto;
      flex: 0 1 auto;
      width: 100%; }
    #contact .contBox .contList > .cont:nth-of-type(n+2), #confirm .contBox .contList > .cont:nth-of-type(n+2) {
      margin-top: 0.5em; }
  #contact .label, #confirm .label {
    display: inline-block;
    color: #fff;
    margin-left: 0.5em;
    font-size: 0.8em;
    padding: 0.2em 0.8em;
    border-radius: 4px; }
    #contact .label.label__any, #confirm .label.label__any {
      background: #aaa; }
    #contact .label.label__caution, #confirm .label.label__caution {
      background: #F5010A; }

/*--------------------------------------------------
注釈
---------------------------------------------------*/
.ly_caution {
  margin-top: 1em; }
  @media screen and (min-width: 768px) {
    .ly_caution {
      width: 100%;
      max-width: 900px;
      margin: 2em auto; } }
  @media screen and (max-width: 767px) {
    .ly_caution {
      width: 96%;
      margin: 2em auto; } }

.bl_caution_ttl {
  font-size: clamp(14px, 1vw, 14px);
  border-top: solid 1px #333;
  border-bottom: solid 1px #333;
  padding: 0.5em 0;
  position: relative; }
  .bl_caution_ttl::after {
    display: block;
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 12px 8px 0 8px;
    border-color: #000333 transparent transparent transparent;
    position: absolute;
    top: 50%;
    right: 1em;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%); }

.bl_caution_cont {
  margin-top: 1em; }

.bl_cautionListItem {
  font-size: clamp(10px, 1vw, 12px); }

/*--------------------------------------------------
footer
---------------------------------------------------*/
.globalFooter .copyrights {
  text-align: center; }

.bl_footer {
  background: #E8E8E8;
  padding: 2em;
  text-align: center; }
  .bl_footer small {
    font-size: clamp(12px, 1vw, 12px); }

/**/

/*# sourceMappingURL=style-lp.css.map */



@media screen and (max-width: 767px) {
  #fv {
    margin-bottom: 0vw;
  }
  #ikkatsu {
    /*margin-top: 20vw;*/
  }
}


#fvLabel {
  position: absolute;



  color: #FFF;
  font-weight: bold;
  background: #FF520B;
  padding: 0.5em 1em;
  letter-spacing: 0.1em;
  border: solid 5px #FF520B;

  text-align: center;
}

@media screen and (max-width: 767px) {
  #fvLabel {
    font-size: 1.5em;
    bottom: 4em;
    left: 7vw;
  }
  .cv_2 {
    .hp_txt_slant {
      display: block;
      width: 80%;
      margin: 0 auto;
      font-size: 0.85em;
    }
    .btn.btn__w > .inner .txt {
      font-size: 1.1em;
    }
  }
}
@media screen and (min-width: 768px) {
  .hp_txt_slant {
    display: block;
    width: 50%;
    margin: 0 auto;
  }
  #fvLabel {
    bottom: 3em;
    right: 1em;
    font-size: 2.5em;
  }
}




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

#voice2
お客様の声

---------------------------------------------------------- */
#voice2 {
  background: #F5F5F5;
}
@media screen and (max-width: 768px) {
  #voice2 {
    padding-top: 80px;
    padding-top: calc(80 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2 {
    padding-top: calc(120 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2 {
    padding-bottom: 60px;
    padding-bottom: calc(60 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2 {
    padding-bottom: calc(120 / 1366 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  #voice2-head {
    margin-bottom: 30px;
    margin-bottom: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-head {
    margin-bottom: calc(50 / 1366 * 100vw);
  }
}


#voice2-card {
  box-sizing: border-box;
  background: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  position: relative;
}
@media screen and (max-width: 768px) {
  #voice2-card {
    padding-top: 36px;
    padding-top: calc(36 / 375 * 100vw);
    display: flex;
    flex-direction: column;
  }
}
@media screen and (min-width: 769px) {
  #voice2-card {
    padding-top: calc(50 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-card {
    padding-bottom: 25px;
    padding-bottom: calc(25 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-card {
    padding-bottom: calc(40 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-card {
    padding-left: 25px;
    padding-left: calc(25 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-card {
    padding-left: calc(50 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-card {
    padding-right: 25px;
    padding-right: calc(25 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-card {
    padding-right: calc(50 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-card {
    width: 335px;
    width: calc(335 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-card {
    width: calc(966 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-card {
    margin-bottom: 50px;
    margin-bottom: calc(50 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-card {
    margin-bottom: calc(77 / 1366 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  #voice2-profile {
    order: 2;
  }
}
@media screen and (min-width: 769px) {
  #voice2-profile {
    margin-bottom: calc(40 / 1366 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-profile {
    display: flex;
  }
}
@media screen and (max-width: 768px) {
  #voice2-profile .fig {
    width: 170px;
    width: calc(170 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-profile .fig {
    width: calc(400 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-profile .fig {
    margin-bottom: 20px;
    margin-bottom: calc(20 / 375 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-profile .fig {
    margin-left: auto;
    margin-right: auto;
  }
}
#voice2-profile .content {
  box-sizing: border-box;
}
@media screen and (min-width: 769px) {
  #voice2-profile .content {
    width: calc(465 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-profile .content {
    padding-left: 0px;
    padding-left: calc(0 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-profile .content {
    padding-left: calc(30 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-profile .content {
    margin-bottom: 30px;
    margin-bottom: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-profile .content {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
}
@media screen and (max-width: 768px) {
  #voice2-profile .name {
    margin-bottom: 8px;
    margin-bottom: calc(8 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-profile .name {
    margin-bottom: calc(14 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-profile .name {
    display: flex;
    flex-direction: column;
  }
}
#voice2-profile .name .ja {
  display: inline-block;
  font-weight: 700; /* bold */
}
@media screen and (max-width: 768px) {
  #voice2-profile .name .ja {
    font-size: 18px;
    font-size: calc(18 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-profile .name .ja {
    font-size: calc(25 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-profile .name .ja {
    margin-right: 5px;
    margin-right: calc(5 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-profile .name .ja {
    margin-right: calc(10 / 1366 * 100vw);
  }
}
#voice2-profile .name .en {
  font-family: "Oswald", sans-serif;
  color: #E3E3E3;
}
@media screen and (max-width: 768px) {
  #voice2-profile .name .en {
    font-size: 14px;
    font-size: calc(14 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-profile .name .en {
    font-size: calc(20 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-profile .voice-logo {
    width: 100px;
    width: calc(100 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-profile .voice-logo {
    width: calc(181 / 1366 * 100vw);
  }
}

.voice-career {
  border-top: solid 1px #E3E3E3;
}
@media screen and (max-width: 768px) {
  .voice-career {
    margin-bottom: 15px;
    margin-bottom: calc(15 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .voice-career {
    margin-bottom: calc(20 / 1366 * 100vw);
  }
}
.voice-career .item {
  color: #868686;
  letter-spacing: 0.04em;
  border-bottom: solid 1px #E3E3E3;
  font-weight: 500; /* medium */
  padding: 0.35em 0;
  position: relative;
  padding-left: 1em;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .voice-career .item {
    font-size: 11px;
    font-size: calc(11 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .voice-career .item {
    font-size: calc(14 / 1366 * 100vw);
  }
}
.voice-career .item:before {
  content: "・";
  position: absolute;
  left: 0;
  top: 0.35em;
}

#voice2-lead {
  font-weight: 700; /* bold */
  letter-spacing: 0.04em;
  color: #FF520B;
}
@media screen and (max-width: 768px) {
  #voice2-lead {
    font-size: 17px;
    font-size: calc(17 / 375 * 100vw);
    order: 1;
  }
}
@media screen and (min-width: 769px) {
  #voice2-lead {
    font-size: calc(30 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-lead {
    line-height: 30px;
    line-height: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-lead {
    line-height: calc(48 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-lead {
    margin-bottom: 14px;
    margin-bottom: calc(14 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-lead {
    margin-bottom: calc(30 / 1366 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #voice2-lead {
    text-align: center;
  }
}

#voice2-body {
  letter-spacing: 0.04em;
}
@media screen and (max-width: 768px) {
  #voice2-body {
    font-size: 13px;
    font-size: calc(13 / 375 * 100vw);
    order: 3;
  }
}
@media screen and (min-width: 769px) {
  #voice2-body {
    font-size: calc(16 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #voice2-body {
    line-height: 1.75;
  }
}
@media screen and (min-width: 769px) {
  #voice2-body {
    line-height: 2;
  }
}

#clients-head {
  font-weight: 700; /* bold */
  letter-spacing: 0.04em;
  color: #FF520B;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #clients-head {
    font-size: 24px;
    font-size: calc(24 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-head {
    font-size: calc(42 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-head {
    margin-bottom: 20px;
    margin-bottom: calc(20 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-head {
    margin-bottom: calc(20 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-head {
    width: 100%;
    position: relative;
  }
}
#clients-head:before, #clients-head:after {
  content: "";
  display: inline-block;
  background: #FF520B;
  position: relative;
}
@media screen and (max-width: 768px) {
  #clients-head:before, #clients-head:after {
    width: 3px;
    width: calc(3 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-head:before, #clients-head:after {
    width: calc(3 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-head:before, #clients-head:after {
    height: 70px;
    height: calc(70 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-head:before, #clients-head:after {
    height: calc(61 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-head:before, #clients-head:after {
    top: 6px;
    top: calc(6 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-head:before, #clients-head:after {
    top: calc(24 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-head:before, #clients-head:after {
    position: absolute;
  }
}
#clients-head:before {
  left: 0;
  transform-origin: top left;
  transform: rotate(-32deg);
}
@media screen and (max-width: 768px) {
  #clients-head:before {
    margin-right: 5px;
    margin-right: calc(5 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-head:before {
    margin-right: calc(50 / 1366 * 100vw);
  }
}
#clients-head:after {
  right: 0;
  transform-origin: top right;
  transform: rotate(32deg);
}
@media screen and (max-width: 768px) {
  #clients-head:after {
    margin-left: 5px;
    margin-left: calc(5 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-head:after {
    margin-left: calc(50 / 1366 * 100vw);
  }
}

#clients-list {
  background: #fff;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  #clients-list {
    padding-top: 30px;
    padding-top: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list {
    padding-top: calc(30 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list {
    padding-bottom: 38px;
    padding-bottom: calc(38 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list {
    padding-bottom: calc(26 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list {
    padding-left: 25px;
    padding-left: calc(25 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list {
    padding-left: calc(23 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list {
    padding-right: 13px;
    padding-right: calc(13 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list {
    padding-right: calc(15 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item {
    padding: 10px;
    padding: calc(10 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list .item {
    padding: calc(10 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item {
    box-sizing: border-box;
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item:nth-of-type(1) {
    width: 140px;
    width: calc(140 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list .item:nth-of-type(1) {
    width: calc(227 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item:nth-of-type(2) {
    width: 140px;
    width: calc(140 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list .item:nth-of-type(2) {
    width: calc(139 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item:nth-of-type(2) {
    padding: 20px;
    padding: calc(20 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list .item:nth-of-type(2) {
    padding: calc(10 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item:nth-of-type(3) {
    width: 140px;
    width: calc(140 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list .item:nth-of-type(3) {
    width: calc(111 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item:nth-of-type(3) {
    padding: 20px;
    padding: calc(20 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list .item:nth-of-type(3) {
    padding: calc(10 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item:nth-of-type(4) {
    width: 140px;
    width: calc(140 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list .item:nth-of-type(4) {
    width: calc(283 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item:nth-of-type(5) {
    width: 140px;
    width: calc(140 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list .item:nth-of-type(5) {
    width: calc(139 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item:nth-of-type(6) {
    width: 140px;
    width: calc(140 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list .item:nth-of-type(6) {
    width: calc(123 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item:nth-of-type(7) {
    width: 140px;
    width: calc(140 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list .item:nth-of-type(7) {
    width: calc(103 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item:nth-of-type(7) {
    padding: 30px;
    padding: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list .item:nth-of-type(7) {
    padding: calc(10 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item:nth-of-type(8) {
    width: 140px;
    width: calc(140 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list .item:nth-of-type(8) {
    width: calc(327 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #clients-list .item:nth-of-type(8) {
    padding: 0px;
    padding: calc(0 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #clients-list .item:nth-of-type(8) {
    padding: calc(10 / 1366 * 100vw);
  }
}

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

#company

---------------------------------------------------------- */
#company {
  background: #FFF;
}
@media screen and (max-width: 768px) {
  #company {
    padding-top: 60px;
    padding-top: calc(60 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #company {
    padding-top: calc(120 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #company {
    padding-bottom: 30px;
    padding-bottom: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #company {
    padding-bottom: calc(150 / 1366 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  #company-head {
    margin-bottom: 30px;
    margin-bottom: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #company-head {
    margin-bottom: calc(40 / 1366 * 100vw);
  }
}

.company-content {
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  background: #FFFFFF;
}
@media screen and (max-width: 768px) {
  .company-content {
    width: 335px;
    width: calc(335 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-content {
    width: calc(966 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-content {
    padding-bottom: 0px;
    padding-bottom: calc(0 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-content {
    padding-bottom: calc(90 / 1366 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .company-head {
    margin-bottom: 45px;
    margin-bottom: calc(45 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-head {
    margin-bottom: calc(50 / 1366 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .company-img-1 {
    margin-bottom: 30px;
    margin-bottom: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-img-1 {
    margin-bottom: calc(40 / 1366 * 100vw);
  }
}

.compnay-intro {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 768px) {
  .compnay-intro {
    width: 295px;
    width: calc(295 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .compnay-intro {
    width: calc(910 / 1366 * 100vw);
  }
}
.compnay-intro .copy {
  font-weight: 700; /* bold */
  letter-spacing: 0.04em;
  color: #FF520B;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .compnay-intro .copy {
    font-size: 24px;
    font-size: calc(24 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .compnay-intro .copy {
    font-size: calc(42 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .compnay-intro .copy {
    margin-bottom: 15px;
    margin-bottom: calc(15 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .compnay-intro .copy {
    margin-bottom: calc(20 / 1366 * 100vw);
  }
}
.compnay-intro .lead {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 769px) {
  .compnay-intro .lead {
    width: calc(736 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .compnay-intro .lead {
    margin-bottom: 30px;
    margin-bottom: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .compnay-intro .lead {
    margin-bottom: calc(30 / 1366 * 100vw);
  }
}
.compnay-intro .body {
  margin-left: auto;
  margin-right: auto;
  line-height: 2;
  letter-spacing: 0.04em;
}
@media screen and (max-width: 768px) {
  .compnay-intro .body {
    width: 295px;
    width: calc(295 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .compnay-intro .body {
    width: calc(735 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .compnay-intro .body {
    font-size: 14px;
    font-size: calc(14 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .compnay-intro .body {
    font-size: calc(16 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .compnay-intro .body {
    margin-bottom: 60px;
    margin-bottom: calc(60 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .compnay-intro .body {
    margin-bottom: calc(90 / 1366 * 100vw);
  }
}

#litalico {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 768px) {
  #litalico {
    width: 295px;
    width: calc(295 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #litalico {
    width: calc(735 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #litalico {
    padding-bottom: 60px;
    padding-bottom: calc(60 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #litalico {
    padding-bottom: calc(100 / 1366 * 100vw);
  }
}

#litalico-head {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 768px) {
  #litalico-head {
    width: 140px;
    width: calc(140 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #litalico-head {
    width: calc(216 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #litalico-head {
    margin-bottom: 10px;
    margin-bottom: calc(10 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #litalico-head {
    margin-bottom: calc(20 / 1366 * 100vw);
  }
}

#litalico-body {
  line-height: 2;
  letter-spacing: 0.04em;
}
@media screen and (max-width: 768px) {
  #litalico-body {
    font-size: 14px;
    font-size: calc(14 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #litalico-body {
    font-size: calc(16 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  #litalico-body {
    margin-bottom: 20px;
    margin-bottom: calc(20 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #litalico-body {
    margin-bottom: calc(30 / 1366 * 100vw);
  }
}

#litalico-list {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 768px) {
  #litalico-list .item {
    width: 140px;
    width: calc(140 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  #litalico-list .item {
    width: calc(343 / 1366 * 100vw);
  }
}

.company-img-2 {
  display: block;
}
@media screen and (max-width: 768px) {
  .company-img-2 {
    margin-bottom: 30px;
    margin-bottom: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-img-2 {
    margin-bottom: calc(60 / 1366 * 100vw);
  }
}

.company-company {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 768px) {
  .company-company {
    width: 295px;
    width: calc(295 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-company {
    width: calc(735 / 1366 * 100vw);
  }
}

.company-txt-1 {
  font-weight: 700; /* bold */
  letter-spacing: 0.04em;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .company-txt-1 {
    font-size: 14px;
    font-size: calc(14 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-txt-1 {
    font-size: calc(25 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-txt-1 {
    margin-bottom: 15px;
    margin-bottom: calc(15 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-txt-1 {
    margin-bottom: calc(20 / 1366 * 100vw);
  }
}

.company-txt-2 {
  font-weight: 700; /* bold */
  letter-spacing: 0.04em;
  color: #FF520B;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .company-txt-2 {
    font-size: 24px;
    font-size: calc(24 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-txt-2 {
    font-size: calc(48 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-txt-2 {
    margin-bottom: 15px;
    margin-bottom: calc(15 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-txt-2 {
    margin-bottom: calc(30 / 1366 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-txt-2 {
    white-space: nowrap;
  }
}

.company-txt-3 {
  line-height: 2;
  letter-spacing: 0.04em;
}
@media screen and (max-width: 768px) {
  .company-txt-3 {
    font-size: 14px;
    font-size: calc(14 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-txt-3 {
    font-size: calc(16 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-txt-3 {
    margin-bottom: 30px;
    margin-bottom: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-txt-3 {
    margin-bottom: calc(45 / 1366 * 100vw);
  }
}

.company-pic {
  display: flex;
  flex-wrap: wrap;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 768px) {
  .company-pic {
    width: 295px;
    width: calc(295 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-pic {
    width: calc(735 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-pic {
    margin-bottom: 80px;
    margin-bottom: calc(80 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-pic {
    margin-bottom: calc(100 / 1366 * 100vw);
  }
}

.company-pic__item {
  overflow: hidden;
  position: relative;
}
@media screen and (max-width: 768px) {
  .company-pic__item {
    width: 295px;
    width: calc(295 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-pic__item {
    width: calc(368 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-pic__item {
    height: 140px;
    height: calc(140 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-pic__item {
    height: calc(174 / 1366 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-pic__item.large {
    width: 50%;
  }
}
.company-pic__item img {
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
}

.company-pic__caption {
  position: absolute;
  left: 0;
  bottom: 0;
  padding: 5px 10px 5px 10px;
  background: #FF520B;
  color: #fff;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
  .company-pic__caption {
    font-size: 11px;
    font-size: calc(11 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-pic__caption {
    font-size: calc(10 / 1366 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .company-blk:not(:last-of-type) {
    margin-bottom: 50px;
    margin-bottom: calc(50 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-blk:not(:last-of-type) {
    margin-bottom: calc(80 / 1366 * 100vw);
  }
}
.company-blk .item-1 {
  display: block;
}
@media screen and (max-width: 768px) {
  .company-blk .item-1 {
    width: auto;
  }
}
@media screen and (min-width: 769px) {
  .company-blk .item-1 {
    width: calc(965 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-blk .item-2 {
    width: auto;
  }
}
@media screen and (min-width: 769px) {
  .company-blk .item-2 {
    width: calc(965 / 1366 * 100vw);
  }
}

.company-head-2 {
  letter-spacing: 0.05em;
  font-weight: 900; /* black */
  text-align: center;
  color: #FF520B;
}
@media screen and (max-width: 768px) {
  .company-head-2 {
    font-size: 20px;
    font-size: calc(20 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-head-2 {
    font-size: calc(30 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-head-2 {
    margin-bottom: 30px;
    margin-bottom: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-head-2 {
    margin-bottom: calc(40 / 1366 * 100vw);
  }
}

.company-info {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 768px) {
  .company-info {
    width: 295px;
    width: calc(295 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info {
    width: calc(735 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info {
    margin-bottom: 30px;
    margin-bottom: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info {
    margin-bottom: calc(20 / 1366 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info {
    display: flex;
    flex-wrap: wrap;
  }
}
.company-info dt, .company-info dd {
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .company-info dt:first-of-type, .company-info dd:first-of-type {
    padding-top: 20px;
    padding-top: calc(20 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info dt:first-of-type, .company-info dd:first-of-type {
    padding-top: calc(0 / 1366 * 100vw);
  }
}
.company-info dt {
  font-weight: 700; /* bold */
  letter-spacing: 0.04em;
}
@media screen and (max-width: 768px) {
  .company-info dt {
    width: auto;
  }
}
@media screen and (min-width: 769px) {
  .company-info dt {
    width: calc(188 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info dt {
    padding-top: 20px;
    padding-top: calc(20 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info dt {
    padding-top: calc(34 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info dt {
    padding-bottom: 10px;
    padding-bottom: calc(10 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info dt {
    padding-bottom: calc(34 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info dt {
    font-size: 14px;
    font-size: calc(14 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info dt {
    font-size: calc(16 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info dt {
    border-bottom: none;
  }
}
@media screen and (min-width: 769px) {
  .company-info dt:not(:last-of-type) {
    border-bottom: solid 1px #9ECEE5;
  }
}
.company-info dd {
  letter-spacing: 0.04em;
}
@media screen and (max-width: 768px) {
  .company-info dd {
    width: auto;
  }
}
@media screen and (min-width: 769px) {
  .company-info dd {
    width: calc(547 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info dd {
    padding-top: 20px;
    padding-top: calc(20 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info dd {
    padding-top: calc(34 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info dd {
    padding-bottom: 20px;
    padding-bottom: calc(20 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info dd {
    padding-bottom: calc(34 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info dd {
    font-size: 14px;
    font-size: calc(14 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info dd {
    font-size: calc(16 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info dd {
    line-height: 20px;
    line-height: calc(20 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info dd {
    line-height: calc(24 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info dd {
    padding-left: 0px;
    padding-left: calc(0 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info dd {
    padding-left: calc(50 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info dd {
    margin-bottom: 20px;
    margin-bottom: calc(20 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info dd {
    margin-bottom: calc(0 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info dd {
    border-bottom: solid 1px #9ECEE5;
  }
}
.company-info dd:not(:last-of-type) {
  border-bottom: solid 1px #9ECEE5;
}
.company-info a {
  color: #FF520B;
  text-decoration: underline;
}
@media screen and (min-width: 769px) {
  .company-info a {
    transition: all 0.3s ease;
  }
  .company-info a:hover {
    opacity: 0.6;
  }
}
.company-info .map {
  color: #FF520B;
  letter-spacing: 0.04em;
  display: inline-block;
  text-decoration: underline;
}
@media screen and (max-width: 768px) {
  .company-info .map {
    font-size: 14px;
    font-size: calc(14 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info .map {
    font-size: calc(14 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info .map {
    margin-top: 8px;
    margin-top: calc(8 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info .map {
    margin-top: calc(10 / 1366 * 100vw);
  }
}
.company-info .map:before {
  content: "";
  background-image: url(../images/icon-map-3.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  display: inline-block;
}
@media screen and (max-width: 768px) {
  .company-info .map:before {
    width: 11px;
    width: calc(11 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info .map:before {
    width: calc(11 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info .map:before {
    height: 16px;
    height: calc(16 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info .map:before {
    height: calc(16 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info .map:before {
    top: 4px;
    top: calc(4 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info .map:before {
    top: calc(4 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .company-info .map:before {
    margin-right: 5px;
    margin-right: calc(5 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info .map:before {
    margin-right: calc(5 / 1366 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .company-info .map {
    transition: all 0.3s ease;
  }
  .company-info .map:hover {
    opacity: 0.6;
  }
}

.office-list {
  display: flex;
  flex-wrap: wrap;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 768px) {
  .office-list {
    width: 295px;
    width: calc(295 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list {
    width: calc(815 / 1366 * 100vw);
  }
}
.office-list li {
  overflow: hidden;
  position: relative;
}
@media screen and (max-width: 768px) {
  .office-list li {
    width: 140px;
    width: calc(140 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li {
    width: calc(230 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li {
    height: 280px;
    height: calc(280 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li {
    height: calc(368 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li {
    margin-right: 15px;
    margin-right: calc(15 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li {
    margin-right: calc(27 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li {
    margin-bottom: 20px;
    margin-bottom: calc(20 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li {
    margin-bottom: calc(20 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li:nth-of-type(2n) {
    margin-right: 0;
  }
}
@media screen and (min-width: 769px) {
  .office-list li:nth-of-type(3n) {
    margin-right: 0;
  }
}
.office-list li .box {
  background: #FF520B;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 2;
  box-sizing: border-box;
  color: #fff;
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 768px) {
  .office-list li .box {
    width: 140px;
    width: calc(140 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .box {
    width: calc(230 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li .box {
    height: 130px;
    height: calc(130 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .box {
    height: calc(146 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li .box {
    padding-top: 22px;
    padding-top: calc(22 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .box {
    padding-top: calc(20 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li .box {
    padding-left: 15px;
    padding-left: calc(15 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .box {
    padding-left: calc(18 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li .box {
    padding-right: 15px;
    padding-right: calc(15 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .box {
    padding-right: calc(18 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li .box {
    padding-bottom: 12px;
    padding-bottom: calc(12 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .box {
    padding-bottom: calc(16 / 1366 * 100vw);
  }
}
.office-list li .label {
  background: #fff;
  box-sizing: border-box;
  border: solid 1px #FF520B;
  position: absolute;
  left: 50%;
  top: 0;
  translate: -50% -50%;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  letter-spacing: 0.06em;
  font-weight: 700; /* bold */
  color: #FF520B;
}
@media screen and (max-width: 768px) {
  .office-list li .label {
    width: 122px;
    width: calc(122 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .label {
    width: calc(122 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li .label {
    height: 24px;
    height: calc(24 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .label {
    height: calc(24 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li .label {
    border-radius: 12px;
    border-radius: calc(12 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .label {
    border-radius: calc(12 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li .label {
    font-size: 13px;
    font-size: calc(13 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .label {
    font-size: calc(14 / 1366 * 100vw);
  }
}
.office-list li .address {
  font-weight: 500; /* medium */
  line-height: 1.75;
}
@media screen and (max-width: 768px) {
  .office-list li .address {
    font-size: 12px;
    font-size: calc(12 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .address {
    font-size: calc(16 / 1366 * 100vw);
  }
}
.office-list li .map {
  color: #fff;
  text-decoration: underline;
  letter-spacing: 0.04em;
  margin-top: auto;
}
@media screen and (max-width: 768px) {
  .office-list li .map {
    font-size: 12px;
    font-size: calc(12 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .map {
    font-size: calc(15 / 1366 * 100vw);
  }
}
.office-list li .map:before {
  content: "";
  background-image: url(../images/icon-map-1.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  display: inline-block;
}
@media screen and (max-width: 768px) {
  .office-list li .map:before {
    width: 11px;
    width: calc(11 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .map:before {
    width: calc(11 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li .map:before {
    height: 16px;
    height: calc(16 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .map:before {
    height: calc(16 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li .map:before {
    top: 4px;
    top: calc(4 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .map:before {
    top: calc(4 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .office-list li .map:before {
    margin-right: 5px;
    margin-right: calc(5 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .map:before {
    margin-right: calc(5 / 1366 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .office-list li .map {
    transition: all 0.3s ease;
  }
  .office-list li .map:hover {
    opacity: 0.6;
  }
}



.l-container {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 768px) {
  .l-container {
    width: 335px;
    width: calc(335 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .l-container {
    width: calc(966 / 1366 * 100vw);
  }
}




.c-head-1 {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .c-head-1 {
    margin-bottom: 30px;
    margin-bottom: calc(30 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .c-head-1 {
    margin-bottom: calc(30 / 1366 * 100vw);
  }
}
.c-head-1 .ja {
  font-weight: 500; /* medium */
  color: #333333;
  letter-spacing: 0.04em;
  line-height: 1;
}
@media screen and (max-width: 768px) {
  .c-head-1 .ja {
    font-size: 14px;
    font-size: calc(14 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .c-head-1 .ja {
    font-size: calc(16 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .c-head-1 .ja {
    margin-bottom: 0px;
    margin-bottom: calc(0 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .c-head-1 .ja {
    margin-bottom: calc(-5 / 1366 * 100vw);
  }
}
.c-head-1 .en {
  font-weight: 500; /* medium */
  color: #FF520B;
  letter-spacing: 0em;
  position: relative;
  font-family: "Oswald", sans-serif;
}
@media screen and (max-width: 768px) {
  .c-head-1 .en {
    font-size: 24px;
    font-size: calc(24 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .c-head-1 .en {
    font-size: calc(45 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .c-head-1 .en {
    padding-bottom: 5px;
    padding-bottom: calc(5 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .c-head-1 .en {
    padding-bottom: calc(5 / 1366 * 100vw);
  }
}
.c-head-1 .en:after {
  content: "";
  background: #FF520B;
  position: absolute;
  left: 50%;
  bottom: 0;
  translate: -50% 0;
}
@media screen and (max-width: 768px) {
  .c-head-1 .en:after {
    width: 16px;
    width: calc(16 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .c-head-1 .en:after {
    width: calc(20 / 1366 * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .c-head-1 .en:after {
    height: 3px;
    height: calc(3 / 375 * 100vw);
  }
}
@media screen and (min-width: 769px) {
  .c-head-1 .en:after {
    height: calc(4 / 1366 * 100vw);
  }
}



















/* =========================================================
   倒産させないセクション
   ========================================================= */
.bsec {
  font-family: 'Noto Sans JP', sans-serif;
  line-height: 1.6;
  color: #333;
  margin: 60px 0;
}

/* コンテナ調整 */
.bsec .l-container {
  width: 90%;
  max-width: 960px;
  margin: 0 auto;
}

/* 見出し */
.bsec .b-points-head {
  font-weight: 700;
  font-size: clamp(20px, 4.8vw, 30px);
  text-align: center;
  margin-bottom: 40px;
  line-height: 1.4;
}
.bsec .b-points-head .bg {
  background: linear-gradient(transparent 60%, #fff200 60%);
}

/* リスト：PC/スマホともに縦一列 */
.bsec .b-points-list {
  display: flex;
  flex-direction: column;
  gap: 30px;
  list-style: none;
  padding: 0;
  margin: 0;
}

/* アイテム（カード） */
.bsec .b-points-item {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  padding: 20px;
  display: grid;
  grid-template-columns: 1fr;                 /* SP: 1カラム */
  grid-template-areas:
    "fig"
    "ttl"
    "body";                                   /* SP: 画像→見出し→文章 */
  row-gap: 12px;
  text-align: left;
}

/* 各要素の割り当て（HTML順に依存せず配置できます） */
.bsec .b-points-item .fig { grid-area: fig; margin: 0; }
.bsec .b-points-item .ttl { grid-area: ttl; margin: 0; font-size: 1.2rem; font-weight: 700; color: #111; }
.bsec .b-points-item .body { grid-area: body; font-size: 0.95rem; line-height: 1.7; }

.bsec .b-points-item .fig img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
}

.bsec .b-points-item .body .emphasize {
  background: linear-gradient(transparent 70%, #fffa8b 70%);
  font-weight: 700;
}

/* PCレイアウト（768px以上）：画像 左／右カラムに 見出し→文章 */
@media (min-width: 768px) {
  .bsec .b-points-item {
    grid-template-columns: minmax(200px, 280px) 1fr; /* 左画像は適度な幅で固定、右は可変 */
    column-gap: 24px;
    grid-template-areas:
      "fig ttl"
      "fig body";                                   /* 右で見出し→文章の順 */
    align-items: start;
  }
}
/* お問い合わせ：特典ボックス */
.contactPresent {
  margin: 3em auto 2.5em;
  max-width: 720px;
  width: 90%;
  position: relative;
  text-align: center;
  margin-bottom: 100px;
}

.contactPresent__badge {
  display: inline-block;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%, -50%);
  background: #E60012;
  color: #fff;
  font-weight: 700;
  font-size: clamp(12px, 3.2vw, 14px);
  padding: 0.4em 1.6em;
  border-radius: 999px;
  letter-spacing: 0.1em;
}

.contactPresent__body {
  background: #fff;
  border-radius: 24px;
  padding: clamp(24px, 6vw, 40px) clamp(20px, 5vw, 48px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.05);
}

.contactPresent__lead {
  font-size: clamp(12px, 3.2vw, 14px);
  margin-bottom: clamp(12px, 3vw, 18px);
}

.contactPresent__title {
  font-weight: 700;
  font-size: clamp(20px, 5.4vw, 28px);
  line-height: 1.6;
  margin-bottom: clamp(16px, 4vw, 24px);
}

.contactPresent__note {
  font-weight: 700;
  font-size: clamp(14px, 3.6vw, 18px);
}

.contactPresent__title .under {
  background: linear-gradient(transparent 70%, #ff8f3b 70%);
}

/* お問い合わせリード文の微調整 */
#contact > .inner > .ttlBox + .leadBox {
  margin: 3vw auto 4vw;
}

#contact > .inner > .ttlBox + .leadBox .txt {
  font-size: clamp(14px, 3.6vw, 18px);
}

/* スマホ時のみ改行制御用 */
.is-sp {
  display: inline;
}
@media screen and (max-width: 767px) {
  .is-sp {
    display: block;
  }
}
#contact {
  background: #FFF7F0 !important;
}


/* ========================================
   contact CTA ボタン調整
======================================== */

/* 各ボタンの間隔 */
#contact .btnBox + .btnBox {
  margin-top: 20px;
}

/* メール：オレンジ */
#contact .btn--mail {
  background: #FF520B;
  border: solid 1px #FF520B;
}

/* 電話：水色 */
#contact .btn--tel {
  background: #31B3F1;
  border: solid 1px #31B3F1;
}

/* LINE：緑 */
#contact .btn--line {
  background: #06C052;
  border: solid 1px #06C052;
}

/* ボタン内レイアウト */
#contact .btn > .inner {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  text-align: center;
}

/* サブテキスト */
#contact .btn .sub {
  color: #ffffff;
  font-size: 0.8em;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.4;
}

/* メインテキスト */
#contact .btn .main {
  color: #ffffff;
  font-size: 1.3em;
  font-weight: bold;
  line-height: 1.4;
}

@media screen and (min-width: 768px) {
  #contact .btnBox + .btnBox {
    margin-top: 25px;
  }

  #contact .btn .sub {
    font-size: 1.2em;
  }

  #contact .btn .main {
    font-size: 2em;
  }
}
/* アイコン */
#contact .btn .main{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:30px;
}

#contact .btn .main i{
  font-size:1.2em;
}