@charset "UTF-8";
/* カラー設定 */
:root {
  --primary-color: #718CC7;
  --secondary-color: #222629;
  --back-color: #F1F3F9;
  --white-color: #FDFDFD; }

/*----------------------------------------------------------*/
/* 全体共通 */
/*----------------------------------------------------------*/
html {
  width: 100%;
  box-sizing: border-box;
  font-size: 62.5%;
  font-weight: 400;
  scroll-behavior: smooth; }

body {
  background-color: var(--white-color);
  color: var(--secondary-color);
  font-family: "Hina Mincho", serif;
  font-weight: 400;
  position: relative;
  line-height: 1.5; }

img {
  max-width: 100%; }

h3 {
  font-size: 3.2rem; }
  @media screen and (max-width: 768px) {
    h3 {
      font-size: 2.0rem; } }

h4 {
  font-size: 2.4rem; }
  @media screen and (max-width: 768px) {
    h4 {
      font-size: 2.0rem; } }

h5 {
  font-size: 2.0rem; }
  @media screen and (max-width: 768px) {
    h5 {
      font-size: 1.3rem; } }

p {
  font-size: 1.5rem;
  line-height: 1.6; }
  @media screen and (max-width: 768px) {
    p {
      font-size: 1.1rem; } }

.body-large {
  font-size: 1.8rem;
  line-height: 1.8; }

.body-small {
  font-size: 1.4rem;
  line-height: 1.5; }

.bg-white {
  background-color: var(--white-color); }

.bg-secondary-color {
  background-color: var(--secondary-color); }

.bg-back-color {
  background-color: var(--back-color); }

a {
  transition: all 0.15s ease-in-out; }

a:hover {
  opacity: 0.8; }

.mt-m {
  margin-top: 60px; }
  @media screen and (max-width: 768px) {
    .mt-m {
      margin-top: 32px; } }

.mt-s {
  margin-top: 40px; }
  @media screen and (max-width: 768px) {
    .mt-s {
      margin-top: 20px; } }

.section {
  padding: 100px 0; }
  @media screen and (max-width: 768px) {
    .section {
      padding: 40px 0; } }

.inner {
  padding: 0 5.5%;
  max-width: 1440px;
  margin: auto;
  display: grid; }
  @media screen and (max-width: 768px) {
    .inner {
      padding: 0 20px; } }

.sec-title {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 0;
  align-items: center;
  margin-bottom: 32px; }
  @media screen and (max-width: 768px) {
    .sec-title {
      margin-bottom: 20px; } }
  .sec-title__en {
    font-size: 4.0rem;
    font-weight: 400;
    font-family: "Sorts Mill Goudy", serif;
    line-height: 1; }
    @media screen and (max-width: 768px) {
      .sec-title__en {
        font-size: 2.0rem; } }
    .sec-title__en::after {
      content: "";
      display: inline-block;
      width: 1px;
      height: 40px;
      background-color: var(--secondary-color);
      vertical-align: middle;
      margin-left: 16px;
      margin-right: 16px; }
      @media screen and (max-width: 768px) {
        .sec-title__en::after {
          height: 25px;
          margin-left: 12px;
          margin-right: 12px; } }
  .sec-title__jp {
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.1em; }
    @media screen and (max-width: 768px) {
      .sec-title__jp {
        font-size: 1.2rem; } }

.title-frame {
  border: solid 1px var(--primary-color);
  padding: 12px 16px;
  border-radius: 20px;
  color: var(--primary-color);
  text-align: center; }
  @media screen and (max-width: 768px) {
    .title-frame {
      padding: 10px 16px;
      border-radius: 15px; } }

.page-head {
  padding-top: 140px; }
  @media screen and (max-width: 768px) {
    .page-head {
      padding-top: 80px; } }
  .page-head hr {
    color: var(--gray-color); }

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

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

/*----------------------------------------------------------*/
/* リンクボタン_共通 */
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/* リンクボタン_サブ（Google Map/Website　へのリンクに使用） */
/*----------------------------------------------------------*/
.link-btn_sub {
  border-radius: 100px;
  display: block;
  width: fit-content;
  display: block;
  position: relative; }
  .link-btn_sub p {
    padding-right: 16px;
    line-height: 1;
    font-family: "Sorts Mill Goudy", serif; }
    .link-btn_sub p::after {
      content: "";
      width: 6px;
      height: 6px;
      position: absolute;
      top: 50%;
      right: 10%;
      transform: translateY(-50%) rotate(45deg); }
  .link-btn_sub--google-map {
    background-color: var(--white-color);
    margin: 0 0 0 auto;
    margin-top: 16px;
    padding: 15px 14px 12px 24px; }
    @media screen and (max-width: 768px) {
      .link-btn_sub--google-map {
        padding: 12px 14px 10px 24px; } }
    .link-btn_sub--google-map p {
      color: var(--primary-color);
      font-size: 1.3rem; }
      @media screen and (max-width: 768px) {
        .link-btn_sub--google-map p {
          font-size: 1.0rem; } }
      .link-btn_sub--google-map p::after {
        border-top: solid 1px var(--primary-color);
        border-right: solid 1px var(--primary-color); }
  .link-btn_sub--website {
    border: solid 1px #CE93BF;
    padding: 9px 14px 6px 24px; }
    @media screen and (max-width: 768px) {
      .link-btn_sub--website {
        padding: 5px 14px 4px 24px; } }
    .link-btn_sub--website p {
      color: #CE93BF;
      font-size: 1.5rem; }
      @media screen and (max-width: 768px) {
        .link-btn_sub--website p {
          font-size: 1.3rem; } }
      .link-btn_sub--website p::after {
        border-top: solid 1px #CE93BF;
        border-right: solid 1px #CE93BF; }

/*----------------------------------------------------------*/
/* ヘッダー */
/*----------------------------------------------------------*/
.header {
  position: sticky;
  top: 0;
  background-color: var(--white-color);
  height: 100px;
  padding: 24px 6.2% 24px 4.6%;
  z-index: 9999;
  position: fixed;
  width: 100%;
  border-radius: 0 0 40px 40px;
  transition: all 0.5s ease;
  /*OPEN時の動き*/ }
  @media screen and (max-width: 1000px) {
    .header {
      height: 50px;
      padding: 0;
      border-radius: 0 0 20px 20px; } }
  .header.open {
    background-color: var(--back-color); }
  .header nav {
    display: flex;
    flex-direction: row;
    position: relative;
    max-width: 1920px;
    top: 0;
    left: 50%;
    transform: translateX(-50%); }
    @media screen and (max-width: 1000px) {
      .header nav {
        display: block;
        transition: all 0.5s ease; } }
    @media screen and (max-width: 1000px) {
      .header nav.open {
        display: block;
        background-color: var(--back-color);
        height: 100dvh; } }
  .header .drawer {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    position: relative; }
    @media screen and (max-width: 1000px) {
      .header .drawer {
        padding: 0 16px;
        height: 50px; } }
  .header .navbar_logo {
    width: 400px; }
    @media screen and (max-width: 1000px) {
      .header .navbar_logo {
        width: 205px;
        max-width: 73%; } }
    .header .navbar_logo a {
      width: 100%;
      display: block; }
      .header .navbar_logo a img {
        width: 100%; }
  .header__flex {
    display: flex;
    gap: 16px; }
  .header__link-btn {
    padding: 10px 16px;
    width: 160px;
    border-radius: 100px;
    text-align: center;
    font-weight: 500; }
    .header__link-btn--01 {
      background-color: var(--secondary-color);
      color: var(--white-color); }
    .header__link-btn--02 {
      background-color: var(--primary-color);
      color: var(--white-color); }
    .header__link-btn__wrapper {
      display: flex;
      gap: 12px; }
  .header .navbar_toggle_wrapper {
    cursor: pointer; }
    @media screen and (max-width: 1000px) {
      .header .navbar_toggle_wrapper {
        position: relative;
        width: 40px; } }
  .header .navbar_toggle {
    display: none; }
    @media screen and (max-width: 1000px) {
      .header .navbar_toggle {
        display: block;
        z-index: 9999;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%); } }
  .header .navbar_toggle_icon {
    position: relative;
    display: block;
    height: 1px;
    width: 40px;
    border-radius: 10px;
    background-color: var(--primary-color);
    -webkit-transition: ease .5s;
    transition: ease .5s; }
  .header .navbar_toggle_icon:nth-child(1) {
    top: 0; }
  .header .navbar_toggle_icon:nth-child(2) {
    margin: 8px 0; }
  .header .navbar_toggle_icon:nth-child(3) {
    top: 0;
    width: 20px;
    margin: 0 0 0 auto; }
  .header .navbar_toggle.open .navbar_toggle_icon:nth-child(1) {
    top: 9px;
    -webkit-transform: rotate(32deg);
    transform: rotate(32deg); }
  .header .navbar_toggle.open .navbar_toggle_icon:nth-child(2) {
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    opacity: 0; }
  .header .navbar_toggle.open .navbar_toggle_icon:nth-child(3) {
    top: -9px;
    -webkit-transform: rotate(-32deg);
    transform: rotate(-32deg);
    width: 40px; }
  .header .menu {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 32px;
    /*OPEN時の動き*/ }
    @media screen and (max-width: 1000px) {
      .header .menu {
        display: none;
        z-index: 1000;
        position: relative;
        width: 100%;
        flex-direction: column;
        justify-content: space-between;
        padding-top: 40px;
        padding-bottom: 40px;
        gap: 32px; } }
    .header .menu__list {
      display: flex; }
      @media screen and (max-width: 1000px) {
        .header .menu__list {
          display: block; } }
    .header .menu__item {
      position: relative;
      padding: 0 1.6vw;
      display: flex;
      justify-content: center; }
      @media screen and (max-width: 1000px) {
        .header .menu__item {
          padding: 16px 20px;
          justify-content: left; } }
      .header .menu__item p {
        font-size: 1.6rem;
        line-height: 1;
        font-family: "Sorts Mill Goudy", serif;
        color: var(--primary-color);
        transition: all 0.5s ease 0s; }
        @media screen and (max-width: 1000px) {
          .header .menu__item p {
            font-size: 3.2rem; } }
      .header .menu__item__jp {
        display: none; }
        @media screen and (max-width: 1000px) {
          .header .menu__item__jp {
            display: inline-block;
            font-size: 1.0rem;
            margin-left: 12px; } }
    @media screen and (max-width: 1000px) {
      .header .menu.open {
        display: block;
        position: relative;
        height: 100%; } }
    .header .menu .illustration {
      display: none; }
      @media screen and (max-width: 1000px) {
        .header .menu .illustration {
          display: block;
          z-index: 1; } }

.no-scroll {
  overflow: hidden; }

[id] {
  scroll-margin-top: 40px;
  /* アンカー遷移時に20px下げる */ }

/*----------------------------------------------------------*/
/* フッター */
/*----------------------------------------------------------*/
.footer {
  margin-top: -100px;
  padding: 80px 6.4vw 14px;
  position: relative;
  overflow: hidden; }
  @media screen and (max-width: 768px) {
    .footer {
      padding: 32px 6.4vw 14px;
      margin-top: -40px;
      border-radius: 40px 40px 0 0; } }
  .footer::before {
    content: "";
    background-image: url("../images/footer_bg.svg");
    background-size: contain;
    background-repeat: repeat-x;
    width: 100%;
    height: 200px;
    max-height: 16vw;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    opacity: 0.12;
    z-index: 0; }
    @media screen and (max-width: 768px) {
      .footer::before {
        width: 140%;
        height: 80px;
        max-height: 80px; } }
  .footer__copy {
    display: block;
    margin: auto; }
    @media screen and (max-width: 768px) {
      .footer__copy {
        width: 74%; } }
  .footer__logo {
    display: block;
    margin: auto;
    margin-top: 28px; }
    @media screen and (max-width: 768px) {
      .footer__logo {
        width: 33%;
        margin-top: 15px; } }
  .footer__bottom {
    margin-top: 24px;
    display: grid;
    grid-template-columns: 100px 1fr 100px; }
    @media screen and (max-width: 960px) {
      .footer__bottom {
        grid-template-columns: 1fr; } }
    .footer__bottom .copyright p {
      font-size: 1.2rem;
      text-align: center;
      line-height: 1.1; }
    .footer__bottom .privacy {
      text-align: right;
      text-decoration: underline;
      z-index: 1; }
      @media screen and (max-width: 960px) {
        .footer__bottom .privacy {
          text-align: center;
          margin-top: 12px; } }

/*----------------------------------------------------------*/
/* CTAセクション（お問い合わせ・採用エントリー） */
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/* 下層ページ共通 */
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/* フォーム共通 */
/*----------------------------------------------------------*/
.wpcf7-form-control-wrap .wpcf7-not-valid-tip {
  font-size: 0; }

.wpcf7-form-control-wrap .wpcf7-not-valid-tip::after {
  display: inline-block;
  padding-top: 8px;
  font-size: 1.6rem;
  color: #dc3232; }
  @media screen and (max-width: 768px) {
    .wpcf7-form-control-wrap .wpcf7-not-valid-tip::after {
      padding-top: 4px;
      font-size: 1.3rem; } }

.wpcf7-form-control-wrap[data-name=contact-type] .wpcf7-not-valid-tip::after {
  content: "ご相談内容を選択してください。"; }

.wpcf7-form-control-wrap[data-name=your-company] .wpcf7-not-valid-tip::after {
  content: "会社名を入力してください。"; }

.wpcf7-form-control-wrap[data-name=your-name] .wpcf7-not-valid-tip::after {
  content: "お名前を入力してください。"; }

.wpcf7-form-control-wrap[data-name=your-email] .wpcf7-not-valid-tip::after {
  content: "メールアドレスを入力してください。"; }

.wpcf7-form-control-wrap[data-name=your-tel] .wpcf7-not-valid-tip::after {
  content: "電話番号を入力してください。"; }

.form__privacy .wpcf7-form-control-wrap[data-name=your-privacy] .wpcf7-not-valid-tip::after {
  content: "同意にチェックを入れてください。";
  position: absolute;
  width: 280px;
  padding-top: 12px;
  left: -270px;
  letter-spacing: 0; }
  @media screen and (max-width: 768px) {
    .form__privacy .wpcf7-form-control-wrap[data-name=your-privacy] .wpcf7-not-valid-tip::after {
      padding-top: 8px;
      left: -160px; } }

/*入力した時のエラーメッセージ非表示*/
.wpcf7-form.hide_error_message .wpcf7-not-valid-tip {
  display: none; }

.wpcf7 form .wpcf7-response-output {
  display: none; }