@charset "UTF-8";
:root {
  --f-notosans: "Noto Sans JP", sans-serif;
  --f-barlow: "Barlow", serif;
  --f-en: "Poppins", sans-serif;
  --main-color: #0087ce;
  --clr1: #333;
  --clr2: #32c5ef;
  --ttl_size: 28px;
  --wrapper: 100px;
}

/*==========================================================================*/
/*//////////////////////////////////////////////////////////////////////////*/
/*//////                                                              //////*/
/*//////  Copyright (C) 2009 株式会社フリーセル All Rights Reserved.  //////*/
/*//////                                                              //////*/
/*//////////////////////////////////////////////////////////////////////////*/
/*                                                                          */
/*    base.css  --> スタイルの初期設定を行うため、変更しないで下さい。      */
/*    fonts.css --> フォントの初期設定を行うため、変更しないで下さい。      */
/*                                                                          */
/*==========================================================================*/
/*==========================================================================*/
/*                           Common-Setting                                 */
/*==========================================================================*/
body {
  background-color: #ffffff;
  -webkit-text-size-adjust: none;
  letter-spacing: 0.1em;
  color: var(--clr1);
  font-family: var(--f-notosans);
}

h1,
h2,
h3,
h4,
h5,
h6,
input,
button,
textarea,
select,
p,
blockquote,
th,
td,
pre,
address,
li,
dt,
dd {
  font-size: 100%;
  -webkit-text-size-adjust: none;
}

header,
section,
footer,
aside,
nav,
main,
article,
figure,
picture {
  display: block;
  padding: 0;
  margin: 0;
}

img {
  display: table;
  vertical-align: bottom;
  max-width: 100%;
  height: auto;
}

a:not(.tel_click) {
  color: inherit;
  font-family: inherit;
  font-weight: inherit;
  color: #64b5f7;
}
a.tel_click {
  text-decoration: none;
  color: inherit;
}

@media only screen and (min-width: 769px) {
  a:not([target*=_blank]) {
    transition: opacity 0.3s ease;
  }
  a:not([target*=_blank]):hover {
    opacity: 0.7;
  }
  a.tel_click {
    pointer-events: none;
  }
  a:not(.tel_click):hover, a:not(.tel_click):active {
    color: #64b5f7;
  }
}
a.logo:hover,
.logo a:hover,
a.ft_logo:hover,
.ft_logo a:hover,
a.tel_click:hover {
  opacity: 1 !important;
}

table {
  width: 100%;
}

iframe {
  width: 100%;
  height: 100%;
}

.captcha_box iframe {
  height: auto;
}

.flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

p {
  line-height: 2.25;
  letter-spacing: 0.1em;
  word-wrap: break-word;
  word-break: break-word;
  margin-bottom: 15px;
}
p:empty {
  display: none !important;
}
p:last-child {
  margin-bottom: 0;
}

.red {
  color: #ca0a0a !important;
}

.bold {
  font-weight: bold !important;
}

.fl {
  float: left;
}

.fr {
  float: right;
}

*,
::after,
::before {
  box-sizing: border-box;
}

/*==========================================================================*/
/*                            Container                                     */
/*==========================================================================*/
html {
  overflow-x: auto !important;
}

.wrapper {
  overflow: hidden;
}

.inner_max,
.inner_big,
.inner,
.inner_sm {
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}

.inner_max {
  max-width: 1480px;
}

.inner_big {
  max-width: 1320px;
}

.inner {
  max-width: 1210px;
}

.inner_sm {
  max-width: 1020px;
}

.fullWidthBreak {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

#mainContent {
  min-height: 100vh;
}

.txt_ver {
  writing-mode: vertical-rl;
}

@media only screen and (min-width: 769px) {
  .txt_ver_pc {
    writing-mode: vertical-rl;
  }
}
/*==========================================================================*/
/*==========================================================================*/
/*
*
*
*
*
*
*
*
*
*
*
*
*
*
*/
/*==========================================================================*/
/*                           WordPress Core                                 */
/*==========================================================================*/
.alignnone {
  margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
  display: block;
  margin: 5px auto 35px;
}

.alignright {
  float: right;
  margin: 5px 0 20px 20px;
}

.alignleft {
  float: left;
  margin: 5px 20px 20px 0;
}

a img.alignright {
  float: right;
  margin: 5px 0 20px 20px;
}
a img.alignnone {
  margin: 5px 20px 20px 0;
}
a img.alignleft {
  float: left;
  margin: 5px 20px 20px 0;
}
a img.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.wp-caption {
  background: #fff;
  border: 1px solid #f0f0f0;
  max-width: 96%;
  /* Image does not overflow the content area */
  padding: 5px 3px 10px;
  text-align: center;
}
.wp-caption.alignnone {
  margin: 5px 20px 20px 0;
}
.wp-caption.alignleft {
  margin: 5px 20px 20px 0;
}
.wp-caption.alignright {
  margin: 5px 0 20px 20px;
}
.wp-caption img {
  border: 0 none;
  height: auto;
  margin: 0;
  max-width: 98.5%;
  padding: 0;
  width: auto;
}
.wp-caption p.wp-caption-text {
  font-size: 11px;
  line-height: 17px;
  margin: 0;
  padding: 0 4px 5px;
}

/* Text meant only for screen readers. */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
  /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}
.screen-reader-text:focus {
  background-color: #eee;
  clip: auto !important;
  clip-path: none;
  color: #444;
  display: block;
  font-size: 1em;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
  /* Above WP toolbar. */
}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*                              General                                     */
/*==========================================================================*/
@media only screen and (max-width: 768px) {
  .pc_only {
    display: none !important;
  }
}
@media only screen and (min-width: 769px) {
  .sp_only {
    display: none !important;
  }
}
.TabContainer .TabContent {
  position: relative;
  z-index: 2;
  overflow: hidden;
}
.TabContainer .TabContent .content {
  transition: all 0.3s ease-in-out;
}
.TabContainer .TabContent .content > div {
  opacity: 0;
  z-index: -10;
  visibility: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  transition: all 0.5s ease-in-out;
}
.TabContainer .TabContent .content > div.active {
  opacity: 1;
  z-index: 1;
  visibility: visible;
}
.TabContainer .TabPager {
  display: flex;
  justify-content: center;
  width: 90%;
  margin: 0px auto;
  max-width: 1118px;
}
.TabContainer .TabPager > div {
  background-color: #a4c7ce;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  margin: 0;
  padding: 20px 20px;
  width: calc(50% - 0px);
  transition: all 0.3s ease;
  cursor: pointer;
  color: #ffffff;
  border-radius: 10px 10px 0px 0px;
}
.TabContainer .TabPager > div p {
  margin: 0;
  font-size: 1.5em;
  line-height: 2;
  border-bottom: 1px solid transparent;
}
.TabContainer .TabPager > div.active {
  background-color: #fff;
  z-index: 1;
  color: #3d9e81;
}
.TabContainer .TabPager > div.active p {
  border-bottom: 1px solid;
}

.rel {
  position: relative;
}

.ovh {
  overflow: hidden !important;
}

.ovs {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  /* Lets it scroll lazy */
}

.lt0 {
  letter-spacing: 0 !important;
}

figure,
picture {
  text-align: center;
  line-height: 1;
}

.fblock {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.key {
  position: relative;
}

.txt_l {
  float: left;
  width: calc(100% - 385px);
}

.txt_r {
  float: right;
  width: calc(100% - 385px);
}

.link > a {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.tel_click {
  display: table;
  text-decoration: none;
}
.tel_click .icon {
  display: flex;
  align-items: center;
  font-family: var(--f-en);
  font-weight: 700;
  color: var(--main-color);
  letter-spacing: 0.05em;
  font-size: 1.5em;
}
.tel_click .icon::before {
  content: "";
  display: block;
  margin-right: 0.45em;
  margin-top: 0.1786em;
  width: 1em;
  height: 1em;
  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 101' %3E%3Cpath d='M97.829,82.824 C98.198,91.823 96.073,94.826 87.308,97.205 C74.144,100.791 61.788,98.752 50.561,91.066 C33.671,79.497 19.384,65.207 7.912,48.225 C-0.287,36.096 -1.826,22.855 2.769,8.952 C4.752,2.953 8.059,0.771 14.407,0.925 C23.639,1.157 23.633,1.157 26.561,10.079 C27.869,14.063 29.100,18.078 30.561,22.007 C32.367,26.859 31.432,30.918 27.914,34.711 C22.303,40.765 22.378,40.854 26.680,47.891 C33.854,59.628 43.600,68.580 55.717,75.040 C57.758,76.123 59.178,76.250 60.774,74.416 C62.051,72.951 63.620,71.738 65.076,70.429 C68.123,67.696 71.576,66.743 75.537,68.072 C82.013,70.255 88.532,72.319 94.923,74.723 C96.087,75.162 97.048,76.900 97.511,78.240 C97.992,79.641 97.756,81.285 97.829,82.824 Z'/%3E%3C/svg%3E");
  mask-image: var(--mask);
  -webkit-mask-image: var(--mask);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-size: 100% auto;
  -webkit-mask-size: 100% auto;
  mask-position: center;
  -webkit-mask-position: center;
  background-color: var(--main-color);
}

.en {
  font-family: var(--f-en);
}

.btn a {
  position: relative;
  color: var(--main-color);
  text-decoration: none;
  font-family: var(--f-jp);
  cursor: pointer;
}

.btn-group {
  font-size: 0.625em;
}
.btn-group .btn {
  font-size: 1em;
}
.btn-group .btn.style01 {
  width: 100%;
  max-width: 22em;
  overflow: hidden;
}
.btn-group .btn.style01 a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3.3333333333em;
  padding: 0.5em 1em;
  font-size: 1.8em;
  letter-spacing: 0.1em;
  line-height: 1.5;
  color: var(--main-color);
  text-align: center;
  background-color: #fff;
  transition: all 0.3s;
  border-radius: 5px;
}
.btn-group .btn.style01 a:hover {
  opacity: 1;
}
@media only screen and (min-width: 769px) {
  .btn-group .btn.style01 a:hover {
    background-color: rgba(0, 0, 0, 0.16);
    color: #fff;
  }
}
.btn-group .btn.bg01 a {
  background-color: rgba(0, 0, 0, 0.16);
  color: #fff;
}
@media only screen and (min-width: 769px) {
  .btn-group .btn.bg01 a:hover {
    background-color: #fff;
    color: var(--main-color);
  }
}
.btn-group .btn.bg01 a.active {
  background-color: #fff;
  color: var(--main-color);
}
.yt {
  max-width: 960px;
  margin: 0px auto;
}

.video-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}

.video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.slick-arrow {
  display: block;
  border: none;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-color: transparent;
  position: absolute;
  top: 37%;
  width: 2em;
  height: 2em;
  transform: translateY(-50%);
  cursor: pointer;
  color: transparent;
}
.slick-arrow:focus {
  outline: 0;
}

.slick-prev {
  left: -1em;
}

.slick-next {
  right: -1em;
}

/* Tablet
-------------------------------------------*/
@media only screen and (min-width: 769px) and (max-width: 1024px) {
  body {
    font-size: 87.5%;
  }
}
/*==========================================================================*/
/*==========================================================================*/
/*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*/
/*==========================================================================*/
/*                           Header - Footer                                */
/*==========================================================================*/
h1 {
  position: absolute;
  overflow: hidden;
  height: 1px;
  width: 1px;
  padding: 0;
  border: 0;
}

header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: var(--wrapper);
  z-index: 20;
}

.header_top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
  justify-content: space-between;
  margin: 0 auto;
  height: 100%;
  transition: all 0.3s ease-in-out;
}

.logo {
  width: 25%;
  max-width: 262px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1;
}
.logo a {
  display: block;
  width: 100%;
  text-align: center;
  background-color: #fff;
  padding: 51px 44px 50px 45px;
  border-radius: 0 0 40px 0;
}
.logo img {
  width: auto;
}
@media only screen and (min-width: 769px) and (max-width: 1600px) {
  .logo {
    width: 15%;
  }
  .logo a {
    padding: 20px;
    border-bottom-right-radius: 20px;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1366px) {
  .logo {
    width: 16%;
  }
}

header.active .logo img,
.ovh header .logo img {
  content: url(../images/shared_ft_logo.svg);
}

@media only screen and (min-width: 769px) {
  header.active .logo,
  .ovh header .logo {
    position: fixed;
    min-width: 100px;
    width: 40%;
    max-width: 26.1875em;
    font-size: 0.75em;
  }
  header.active .logo a,
  .ovh header .logo a {
    padding: 20px;
    border-bottom-right-radius: 20px;
    height: 8em;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  header.active .logo a img,
  .ovh header .logo a img {
    width: 90%;
    max-width: 19.4375em;
    margin: 0px auto;
  }
}
.right_head {
  max-width: 100%;
  width: 100%;
}

.pc_navi {
  width: 100%;
  padding-top: 62px;
  position: relative;
  overflow: hidden;
}
@media only screen and (min-width: 2000px) {
  .pc_navi .inner_big {
    max-width: 100%;
    width: calc(100% - 300px);
    margin-left: auto;
    margin-right: 0;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1840px) {
  .pc_navi .inner_big {
    max-width: 100%;
    width: 80%;
    margin-left: auto;
    margin-right: 0;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1600px) {
  .pc_navi {
    padding-top: 20px;
  }
  .pc_navi .inner_big {
    width: 82%;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1366px) {
  .pc_navi .inner_big {
    width: 82%;
  }
}

.totop {
  transition: all 0.3s ease;
  opacity: 0;
  visibility: hidden;
  cursor: pointer;
  position: fixed;
  z-index: 19;
  bottom: 25px;
  right: 25px;
}
.totop.active {
  opacity: 1;
  visibility: visible;
}
.totop .icon {
  background-image: url(../images/totop.png);
  background-repeat: no-repeat;
  background-size: 100% auto;
  border: 0px;
  width: 70px;
  height: 70px;
  margin: 0;
  box-shadow: 0px 20px 26.7px 3.3px rgba(54, 112, 152, 0.1);
  border-radius: 50%;
}

@media only screen and (min-width: 769px) {
  .totop:hover .icon {
    opacity: 0.9;
    animation-name: bounces;
  }
}
.bounce {
  animation-name: bounces;
}

.animateds {
  animation-duration: 0.5s;
  animation-fill-mode: both;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

@keyframes bounces {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}
@keyframes fixed_banner {
  0% {
    left: 0;
    opacity: 1;
  }
  100% {
    left: -3px;
    opacity: 0.7;
  }
}
.fixed_banner {
  position: fixed;
  right: 0px;
  z-index: 20;
  transition: right 0.3s ease-in-out;
  top: 40%;
}
@media only screen and (min-width: 1919px) {
  .fixed_banner {
    top: 50.3em;
  }
}
.fixed_banner > div {
  position: relative;
  transition: all 0.3s ease;
}
.fixed_banner a {
  content: "";
  display: block;
  position: absolute;
  transition: all 0.3s;
  z-index: 2;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
.fixed_banner p {
  display: block;
  width: 100%;
  height: 100%;
  margin-bottom: 0;
  color: #fff;
  letter-spacing: 0.1em;
  text-align: center;
  text-decoration: none;
}
.fixed_banner p:hover {
  color: #fff;
}
.fixed_banner p .tt {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  height: 100%;
  font-weight: 500;
  font-family: var(--f-en);
  line-height: 1.33333;
  flex-direction: column;
}
.fixed_banner p .tt::before {
  content: "";
  display: block;
  mask-image: var(--mask);
  -webkit-mask-image: var(--mask);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-size: auto 100%;
  -webkit-mask-size: auto 100%;
  mask-position: center;
  -webkit-mask-position: center;
  background-color: #fff;
}
.fixed_banner .tel p {
  background-color: #0087ce;
}
.fixed_banner .tel p .tt::before {
  margin-bottom: 0.5em;
  width: 1.75em;
  height: 1.75em;
  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 210 210' %3E%3Cpath d='M209.897,156.496 L209.897,197.732 C209.899,203.879 205.161,208.944 199.051,209.367 C193.955,209.737 189.793,209.912 186.574,209.912 C83.524,209.912 -0.003,126.370 -0.003,23.316 C-0.003,20.104 0.172,15.944 0.533,10.847 C0.962,4.732 6.046,-0.005 12.172,-0.005 L53.405,-0.005 C56.402,-0.005 58.912,2.260 59.212,5.246 C59.480,7.934 59.725,10.055 59.959,11.681 C62.276,27.857 67.024,43.568 74.045,58.343 C75.152,60.681 74.430,63.471 72.331,64.953 L47.165,82.941 C62.551,118.792 91.122,147.374 126.974,162.746 L144.932,137.623 C146.447,135.502 149.259,134.782 151.613,135.894 C166.366,142.916 182.091,147.641 198.258,149.948 C199.880,150.185 202.013,150.432 204.673,150.679 C207.649,151.008 209.912,153.500 209.908,156.496 L209.897,156.496 Z'/%3E%3C/svg%3E");
}
.fixed_banner .web {
  cursor: pointer;
}
.fixed_banner .web p {
  background-color: #fff;
}
.fixed_banner .web p .tt::before {
  margin-bottom: 0.5em;
  width: 1.9167em;
  height: 2.0083em;
  mask-image: unset;
  background: url(../images/ai_chat.png) no-repeat center/contain;
}
.fixed_banner .web2 p {
  background-color: #5ac6d2;
  border-color: #5ac6d2 !important;
}
.fixed_banner .web2 p .tt {
  color: #fff !important;
}
.fixed_banner .web2 p .tt::after {
  display: none !important;
}
.fixed_banner .web2 p .tt::before {
  margin-bottom: 0.5em;
  width: 1.8em !important;
  height: 1.9em !important;
  mask-image: unset;
  background: #fff;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 230 241 ' %3E%3Cpath d='M229.828,228.858 C229.828,235.571 224.112,241.007 217.060,241.007 L12.769,241.007 C5.716,241.007 -0.000,235.571 -0.000,228.858 L-0.000,70.998 C-0.000,64.295 12.949,50.992 20.001,50.992 L51.070,50.992 L51.070,12.1000 C51.070,6.307 56.788,0.871 63.839,0.871 C70.890,0.871 76.608,6.307 76.608,12.1000 L76.608,50.992 L153.218,50.992 L153.218,12.1000 C153.218,6.307 158.934,0.871 165.985,0.871 C173.036,0.871 178.753,6.307 178.753,12.1000 L178.753,50.992 L200.000,50.992 L210.000,50.992 C225.697,50.992 229.1000,64.295 229.1000,70.998 L229.828,228.858 ZM105.336,153.583 L82.443,131.817 C77.457,127.081 69.375,127.081 64.388,131.817 C59.400,136.563 59.400,144.234 64.388,148.981 L96.309,179.303 C98.703,181.588 101.952,182.875 105.336,182.875 C108.721,182.875 111.971,181.588 114.364,179.303 L165.437,130.777 C170.425,126.051 170.425,118.360 165.437,113.624 C160.449,108.877 152.369,108.877 147.381,113.624 L105.336,153.583 Z'/%3E%3C/svg%3E");
}
.fixed_banner .mail p {
  background-color: #5ac6d2;
}
.fixed_banner .mail p .tt::before {
  margin-bottom: 0.5em;
  width: 1.925em;
  height: 1.5833em;
  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 231 190' %3E%3Cpath d='M12.467,0.098 L219.401,0.098 C225.751,0.098 230.898,4.875 230.898,10.806 L230.898,179.312 C230.898,185.212 225.751,189.999 219.401,189.999 L12.467,189.999 C6.116,189.999 0.970,185.212 0.970,179.312 L0.970,10.806 C0.970,4.875 6.116,0.098 12.467,0.098 ZM116.624,93.061 L42.909,34.765 L31.864,45.380 L116.773,114.107 L200.085,45.318 L188.890,34.827 L116.635,93.061 L116.624,93.061 Z'/%3E%3C/svg%3E");
}

@media only screen and (min-width: 769px) {
  .fixed_banner {
    font-size: 10px;
    --size: 7em;
  }
  .fixed_banner.active {
    top: 45%;
    transform: translateY(-50%);
  }
  .fixed_banner > div {
    width: var(--size);
    height: var(--size);
    margin-bottom: 0.7em;
  }
  .fixed_banner p {
    width: var(--size);
    height: var(--size);
    border-radius: 10px 0 0 10px;
  }
  .fixed_banner p .tt {
    font-size: 1.4em;
    letter-spacing: 0.1em;
  }
  .fixed_banner .tel {
    --w_tel: 20em;
    transform: translateX(calc(-var(--size) - var(--w_tel)));
    transition: all 0.3s ease;
  }
  .fixed_banner .tel p {
    box-shadow: -15px 0px 40px 0px rgba(42, 68, 97, 0.2);
  }
  .fixed_banner .tel p .tt::before {
    margin-bottom: 0.3571428571em;
    margin-top: 0.3em;
    width: 1.5714em;
    height: 1.5714em;
  }
  .fixed_banner .tel:hover {
    transform: translateX(calc(0em - var(--w_tel)));
  }
  .fixed_banner .tel:hover a {
    width: calc(var(--size) + var(--w_tel));
  }
  .fixed_banner .tel .ov {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: var(--size);
    height: 100%;
    top: 0;
    width: var(--w_tel);
    background-color: #0087ce;
  }
  .fixed_banner .tel .ov::before {
    content: "";
    display: block;
    position: absolute;
    transition: all 0.3s;
    left: 0;
    top: 10%;
    width: 1px;
    height: 80%;
    background-color: #fff;
    opacity: 0.5;
  }
  .fixed_banner .tel .ov .text {
    font-size: 2em;
    letter-spacing: 0.1em;
  }
  .fixed_banner .web {
    height: unset;
  }
  .fixed_banner .web:hover {
    opacity: 0.8;
  }
  .fixed_banner .web p {
    height: unset;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--main-color);
    border-right: 0;
    padding-top: 1.5em;
    box-shadow: -15px 0px 40px 0px rgba(42, 68, 97, 0.2);
  }
  .fixed_banner .web p .tt {
    height: unset;
    color: var(--main-color);
    writing-mode: vertical-rl;
    font-size: 1.6em;
    letter-spacing: 0.1em;
    white-space: nowrap;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-top: 2.875em;
    position: relative;
    font-weight: 500;
    letter-spacing: 0.1em;
    padding-bottom: 2.875em;
    text-transform: uppercase;
  }
  .fixed_banner .web p .tt::before {
    width: 1.6875em;
    height: 1.9375em;
    top: 0;
    left: calc(50% - 0.875em);
    position: absolute;
  }
  .fixed_banner .web p .tt::after {
    content: "";
    display: block;
    position: absolute;
    transition: all 0.3s;
    background: url(../images/ai_arr.png) no-repeat center/contain;
    width: 1.25em;
    height: 1.25em;
    left: calc(50% - 0.625em);
    bottom: 0.875em;
  }
  .fixed_banner .web2:hover {
    opacity: 1;
  }
  .fixed_banner .web2 p .tt {
    padding-bottom: 1.2em;
    padding-top: 2.8em;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1440px) {
  .totop {
    bottom: 20px;
    right: 20px;
  }
  .totop .icon {
    width: 60px;
    height: 60px;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1366px) and (max-height: 690px) {
  .fixed_banner {
    font-size: 8px;
  }
  .totop {
    bottom: 20px;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1024px) {
  .totop {
    right: 20px;
  }
  .fixed_banner {
    font-size: 8px;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1366px) and (max-height: 600px) {
  .totop {
    bottom: 20px;
    right: 80px;
  }
  .totop .icon {
    width: 50px;
    height: 50px;
  }
}
footer {
  padding: 39px 0;
  position: relative;
}
footer p {
  margin-bottom: 0;
}
footer .ft_logo {
  font-size: min(1em, 3vw);
  max-width: 17.375em;
}
footer .menu a {
  margin-top: 0.15em;
  color: var(--clr1);
  text-decoration: none;
  letter-spacing: 0;
  display: flex;
  align-items: center;
}
footer .menu a::before {
  content: "";
  display: block;
  width: 1.25em;
  height: 19px;
  margin-right: 0.75em;
  background-size: 100% auto;
  background-repeat: no-repeat;
  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='201px' height='190px'%3E%3Cpath fill-rule='evenodd' fill='rgb(51, 51, 51)' d='M198.516,88.399 C204.427,99.630 191.489,111.053 181.445,103.431 L104.697,25.036 C101.525,22.539 98.448,22.559 95.302,25.036 L18.334,103.623 C10.910,108.667 2.756,104.846 -0.001,96.647 L-0.001,91.472 C1.144,89.490 1.842,87.337 3.505,85.669 L79.481,8.083 C91.269,-2.693 108.353,-2.653 120.317,7.881 C128.298,14.907 135.272,24.187 143.358,31.232 L143.358,17.868 C143.358,13.764 148.316,8.467 152.240,7.800 C160.167,6.405 165.807,11.510 166.419,19.445 C167.299,30.858 165.667,43.363 166.486,54.887 C176.905,66.311 188.513,76.632 198.516,88.399 ZM29.286,115.592 L96.473,46.992 C98.024,45.638 100.181,45.163 102.066,46.082 C125.433,68.615 147.732,92.533 170.713,115.592 L172.081,117.795 L172.283,169.877 C172.889,178.186 162.959,190.004 154.882,190.004 L118.749,190.004 L118.749,138.347 C118.749,138.296 118.204,137.750 118.163,137.750 L81.835,137.750 C81.794,137.750 81.249,138.296 81.249,138.347 L81.249,190.004 L45.116,190.004 C37.288,190.004 27.535,178.692 27.719,170.675 L27.917,117.795 L29.286,115.592 Z'/%3E%3C/svg%3E");
  -webkit-mask-image: var(--mask);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-size: 100% auto;
  -webkit-mask-size: 100% auto;
  mask-position: center;
  -webkit-mask-position: center;
  background-color: var(--clr1);
  transition: all 0.3s;
}
footer .menu a:hover {
  color: var(--main-color);
}
footer .menu a:hover::before {
  background-color: var(--main-color);
}
footer .ft_info .des {
  margin-bottom: 26px;
  font-size: 14px;
  letter-spacing: 0.1em;
}
footer .ft_link {
  width: 50%;
}
@media only screen and (min-width: 769px) and (max-width: 1560px) {
  footer .inner_big {
    width: 80%;
  }
}

.ft_link a {
  text-decoration: none;
}
@media only screen and (min-width: 769px) {
  .ft_link .link_list > div > ul {
    display: flex;
    flex-flow: column wrap;
    align-content: space-between;
  }
  .ft_link .link_list > div > ul li {
    width: 50%;
  }
  .ft_link .menu01 {
    width: 100%;
  }
  .ft_link .menu01 > ul {
    max-height: 13em;
  }
  .ft_link .menu02 {
    margin-top: 2em;
    width: 100%;
  }
  .ft_link .menu02 > ul {
    max-height: 10em;
  }
  .ft_link .menu02 > ul > li:nth-child(n+3) {
    max-width: 20em;
  }
}
.ft_link .title {
  margin-bottom: 28px;
  padding-left: 0;
  font-size: calc(var(--ttl_size) + 4px);
  font-weight: 400;
  letter-spacing: 0.2em;
  line-height: 1;
  pointer-events: none;
  font-family: var(--f-en);
}
.ft_link .title::before {
  display: none;
}
.ft_link ul:last-child {
  margin-bottom: 0;
}
.ft_link li {
  margin-bottom: 1.15em;
  letter-spacing: 0.1em;
  line-height: 1.6;
}
.ft_link a {
  display: table;
  position: relative;
  padding-left: 0em;
  color: inherit;
  font-size: 0.9375em;
  letter-spacing: 0.05em;
  color: var(--clr1);
  line-height: 1.6;
}
.ft_link a::before {
  content: "・";
  margin-left: -0.35em;
  border-radius: 100%;
  width: auto;
  height: auto;
}
.ft_link a:hover {
  opacity: 1;
}

.copyright {
  margin: 0 auto 0;
  color: #fff;
  padding: 17px 0px 23px;
  position: relative;
  z-index: 1;
}
.copyright .flex {
  align-items: center;
  justify-content: flex-start;
  min-height: 40px;
}
.copyright .inner_big {
  max-width: 1135px;
}
.copyright::before {
  position: absolute;
  content: "";
  display: block;
  z-index: -1;
  left: calc(50% - 50vw);
  top: 0;
  height: 100%;
  width: 100vw;
  background-color: var(--main-color);
}
.copyright .textwidget {
  display: block;
  margin-top: 2px;
  line-height: 20px;
  padding-left: 19px;
  padding-bottom: 3px;
  margin-left: 19px;
  border-left: 1px solid #cecece;
  font-weight: 400;
  letter-spacing: 0.1em;
}
.copyright .textwidget p {
  margin-bottom: 0;
  font-size: 13px;
  line-height: inherit;
  letter-spacing: 0.1em;
}
.copyright .grits {
  margin-bottom: 0;
  line-height: 2.501;
}
.copyright .grits a {
  display: block;
}
.copyright .grits img {
  max-width: 159px;
}

/*==========================================================================*/
/*==========================================================================*/
/*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*/
/*==========================================================================*/
/*                                INDEX                                     */
/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*/
/*==========================================================================*/
/*                                Under                                     */
/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
*
*
*
*
*
*
*
*
*
*
*
*
*
*/
.topic_path {
  line-height: 1.45;
  letter-spacing: 0.05em;
  position: relative;
  z-index: 1;
  padding: 0.625em 0 0.7em;
}
.topic_path::after, .topic_path::before {
  content: "";
  display: block;
  position: absolute;
  transition: all 0.3s;
  background-color: #dedede;
  width: 100vw;
  height: 1px;
  left: 0;
  top: 0;
}
.topic_path::after {
  top: unset;
  bottom: 0;
}
.topic_path ul {
  display: block;
  padding: 4px 10px 4px 2px;
}
.topic_path ul::after {
  content: "";
  display: block;
  clear: both;
}
.topic_path ul li {
  float: left;
}
.topic_path ul li:first-child span {
  top: -0.25em;
}
.topic_path a {
  text-decoration: none;
  color: var(--clr1);
  transition: 0.3s all;
}
.topic_path a:hover {
  opacity: 1;
}
@media only screen and (min-width: 769px) {
  .topic_path a:hover {
    text-decoration: underline;
    color: var(--main-color);
  }
}
.topic_path span {
  display: inline-block;
  padding: 0 1.11em;
  line-height: 1;
  position: relative;
  top: -0.0625em;
}
.topic_path .home a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.topic_path .home a::before {
  content: "";
  mask-image: url(../images/icon_home.svg);
  mask-repeat: no-repeat;
  mask-size: contain;
  width: 1.25em;
  height: 1.1875em;
  background-color: var(--clr1);
  margin: 0em 0.75em 0 0.3125em;
  transition: 0.3s all;
}
@media only screen and (min-width: 769px) {
  .topic_path .home a:hover::before {
    background-color: var(--main-color);
  }
}
@media only screen and (min-width: 769px) and (max-width: 1840px) {
  .topic_path span {
    padding: 0 5px;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1366px) {
  .topic_path li {
    letter-spacing: 0;
    font-size: 14px;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1024px) {
  .topic_path li {
    letter-spacing: 0;
    font-size: 13px;
  }
}

.TabPager {
  display: flex;
  flex-wrap: wrap;
  margin-top: 24px;
  margin-left: 7px;
}
.TabPager li {
  cursor: pointer;
  min-width: 220px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: var(--main-color);
  border-radius: 5px;
  border: 1px solid var(--main-color);
  background-color: #fff;
  font-weight: 500;
  transition: 0.3s all;
}
.TabPager li a {
  line-height: 1.5;
  font-size: 1.125em;
  text-decoration: none;
  color: var(--main-color);
  transition: 0.3s all;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 100%;
  height: 100%;
  padding: 0.9375em 0 1em;
}
.TabPager li a:hover {
  opacity: 1;
}
.TabPager li:not(:first-child) {
  margin-left: 12px;
}
.TabPager li.active {
  background-color: var(--main-color);
  color: #fff;
}
.TabPager li.active a {
  color: #fff;
}
@media only screen and (min-width: 769px) {
  .TabPager li:hover {
    background-color: var(--main-color);
    color: #fff;
  }
  .TabPager li:hover a {
    color: #fff;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1024px) {
  .TabPager {
    padding-top: 20px;
    margin: 0 auto;
    justify-content: space-between;
  }
  .TabPager li {
    min-width: unset;
    width: calc(33.3333333333% - 10px);
  }
  .TabPager li:not(:first-child) {
    margin-left: 0;
  }
  .TabPager li p {
    font-size: 14px;
  }
}

@media only screen and (min-width: 769px) and (max-width: 1024px) {
  .hide_769 {
    display: none !important;
  }
}
.br640,
.br769,
.hide345,
.br430,
.br480,
.br360 {
  display: none;
}

@media only screen and (min-width: 769px) and (max-width: 850px) {
  .br769 {
    display: block !important;
  }
}
@media only screen and (max-width: 360px) {
  .br360 {
    display: block !important;
  }
}
@media only screen and (max-width: 430px) {
  .br430 {
    display: block !important;
  }
}
@media only screen and (max-width: 480px) {
  .br480 {
    display: block !important;
  }
}
@media only screen and (max-width: 345px) {
  .hide345 {
    display: none !important;
  }
}
@media only screen and (max-width: 640px) and (min-width: 431px) {
  .br640 {
    display: block !important;
  }
}