body {
    color: #121212;
    background: #fefefe;
    font-family: "Noto Sans JP", "YakuHanJP", Lato, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 1.5rem;
    line-height: 1.8;
    -webkit-font-smoothing: antialiased;
    min-height: 100vh;
    font-weight: 400;
    position: relative;
    letter-spacing: .05em
  }
  
  a {
    color: #39a2d3;
    text-decoration: none;
    transition: all .3s ease;
    cursor: pointer
  }
  
  i {
    font-family: "Font Awesome 5 Free"
  }
  
  .bg-blue2 {
    background: #d7f0f3
  }
  
  @media screen and (max-width: 1025px) {
    #wrapper {
      overflow: hidden
    }
  }
  
  @keyframes fadein {
    0% {
      opacity: 0
    }
    100% {
      opacity: 1
    }
  }
  
  em {
    font-style: normal
  }
  
  img {
    max-width: 100%;
    height: auto
  }
  
  .img-cover {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
  }
  
  .img-round {
    border-radius: 0 0 20px 0
  }
  
  .bold {
    font-weight: 600
  }
  
  h2, h3, h4 {
    line-height: 1.4;
    font-weight: 600
  }
  
  .mincho {
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    font-weight: 500 !important
  }
  
  .eng-txt {
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    letter-spacing: 0
  }
  
  .eng-upper {
    text-transform: uppercase
  }
  
  .bigger {
    font-size: 1.8rem
  }
  
  @media screen and (max-width: 639px) {
    .bigger {
      font-size: 1.25rem
    }
  }
  
  .smaller {
    font-size: 13px;
    letter-spacing: 0
  }
  
  .eng {
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal
  }
  
  .btn-inline {
    display: inline-block;
    padding: 10px 15px;
    font-weight: 600;
    background: linear-gradient(to left, #1BB6F2 9.43%, #00C8B4 49.9%, #ADE478 94.82%);
    background-size: 300%;
    background-position: left top;
    color: #fff;
    border-radius: 40px
  }
  
  .btn-inline i {
    display: inline-block;
    padding-right: 3px
  }
  
  .btn-inline:hover {
    background-position: 80% 0
  }
  
  @keyframes view-zoomin {
    0% {
      opacity: 0;
      transform: scale(0.95)
    }
    100% {
      opacity: 1;
      transform: scale(1)
    }
  }
  
  @keyframes view-slideup {
    0% {
      opacity: 0;
      transform: translate(0, 35px)
    }
    100% {
      opacity: 1;
      transform: translate(0, 0)
    }
  }
  
  .animation {
    opacity: 0
  }
  
  .slideup.on {
    opacity: 1;
    animation: view-slideup .65s cubic-bezier(0.2, 1, 0.2, 1)
  }
  
  .zoomin.on {
    opacity: 1;
    animation: view-zoomin .65s cubic-bezier(0.2, 1, 0.2, 1)
  }
  
  .loader {
    align-items: center;
    background: #fdfdfd;
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 9999
  }
  
  .loader::after {
    animation: loader .5s linear infinite;
    border: 1px solid #4eacd8;
    border-radius: 50%;
    border-right: 1px solid rgba(78, 172, 216, .2);
    border-top: 1px solid rgba(78, 172, 216, .2);
    content: "";
    height: 70px;
    width: 70px
  }
  
  .loader.off {
    display: none
  }
  
  @keyframes loader {
    0% {
      transform: rotate(0)
    }
    100% {
      transform: rotate(360deg)
    }
  }
  
  @keyframes hd-scrolled {
    0% {
      opacity: 0;
      transform: translate(0, -100%)
    }
    100% {
      opacity: 1;
      transform: translate(0, 0)
    }
  }
  
  .gradient {
    position: relative
  }
  
  .gradient:before {
    position: absolute;
    left: 0;
    top: 0;
    background-image: linear-gradient(92.76deg, #82a576 2.23%, #58a3a0 30.4%, #45a4e2 66.47%, #1a34b8 96.83%);
    background-size: 600% 600%;
    opacity: .7;
    animation: anim-gradient 8s ease infinite
  }
  
  @keyframes anim-gradient {
    0% {
      background-position: 0% 50%
    }
    50% {
      background-position: 100% 50%
    }
    100% {
      background-position: 0% 50%
    }
  }
  
  #l-header {
    position: absolute;
    z-index: 200;
    top: 0;
    left: 0;
    width: 100%;
    transition: all .2s ease-in
  }
  
  @media screen and (max-width: 1101px) {
    #l-header {
      background: none;
      box-shadow: none
    }
  }
  
  #l-header.is-fixed {
    position: fixed
  }
  
  #l-header .inner {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%;
    min-width: 930px;
    margin: 0 auto;
    background: #fefefe;
    box-shadow: rgba(0, 0, 0, .1) 0px 8px 18px;
    align-items: center;
    justify-content: space-between
  }
  
  @media screen and (max-width: 1025px) {
    #l-header .inner {
      min-width: initial
    }
  }
  
  #l-header .inner #logo {
    padding: 10px
  }
  
  #l-header .head-right {
    margin-left: auto;
    display: flex
  }
  
  @media screen and (max-width: 1025px) {
    #l-header .head-right {
      display: none
    }
  }
  
  #l-header .head-right_contact {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    margin-left: auto
  }
  
  #l-header .head-right_tel a {
    background: rgba(0, 0, 0, 0);
    color: #111;
    font-weight: 600;
    font-size: 2rem;
    line-height: 1.1;
    position: relative
  }
  
  #l-header .head-right_tel a:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px
  }
  
  #l-header .head-right_tel a:hover {
    color: #78c0e1
  }
  
  #header_nav {
    position: relative;
    width: 800px
  }
  
  #header_nav ul {
    display: flex;
    flex-wrap: wrap;
    padding-left: 20px
  }
  
  #header_nav ul li {
    position: relative;
    flex: 1 0 auto;
    justify-content: cneter;
    align-self: center
  }
  
  #header_nav ul li.btn-contact {
    align-self: flex-start;
    height: 72px;
    display: flex;
    justify-content: center;
    align-items: center
  }
  
  #header_nav ul li.btn-contact.type_entry a {
    background: #0e1a43
  }
  
  #header_nav ul li.btn-contact.type_entry a:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900
  }
  
  #header_nav ul li.btn-contact.type_contact a {
    background-image: linear-gradient(to right, #24487a -22.57%, #74c6e8 68.82%);
    -webkit-clip-path: polygon(20% 0%, 100% 0%, 80% 100%, 0% 100%);
    clip-path: polygon(20% 0%, 100% 0%, 80% 100%, 0% 100%)
  }
  
  #header_nav ul li.btn-contact.type_contact a:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900
  }
  
  #header_nav ul li.btn-contact a {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 75%;
    padding: 7px 50px 7px;
    color: #fff;
    position: relative
  }
  
  #header_nav ul li.btn-contact a .eng {
    color: #fff !important;
    font-size: 1.6rem
  }
  
  #header_nav ul li.btn-contact a:before {
    display: inline-block;
    margin-right: 8px;
    font-size: 16px
  }
  
  #header_nav ul li.btn-contact a:after {
    display: none
  }
  
  #header_nav ul li.btn-contact a:hover {
    background: #333
  }
  
  #header_nav ul li a {
    display: block;
    color: #222;
    position: relative;
    padding: 10px 0;
    line-height: 1.5;
    font-size: 1.4rem;
    font-weight: 600;
    text-align: center
  }
  
  #header_nav ul li a .eng {
    display: block;
    position: relative;
    font-size: 1.4rem;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    color: #555
  }
  
  #header_nav ul li a:after {
    position: absolute;
    content: "";
    width: 0;
    height: 3px;
    background: #24487a;
    left: 0;
    bottom: -6px;
    transition: .2s width ease-in
  }
  
  #header_nav ul li a:hover .eng, #header_nav ul li a.active .eng {
    color: #24487a
  }
  
  #header_nav ul li a:hover:after, #header_nav ul li a.active:after {
    width: 20px
  }
  
  #header_nav .dropdown {
    position: absolute;
    left: -30px;
    top: 45x;
    z-index: 999;
    padding-top: 10px;
    opacity: 0;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  #header_nav .dropdown.js-is-open {
    opacity: 1
  }
  
  #header_nav .dropdown.drop-last {
    left: auto;
    right: -80px
  }
  
  #header_nav .dropdown .dropdown-ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px 8px;
    background: rgba(36, 72, 122, .6);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    padding: 15px
  }
  
  #header_nav .dropdown .dropdown-li {
    border-right: 0;
    width: 130px
  }
  
  #header_nav .dropdown .dropdown-li a {
    display: block;
    width: 100%;
    padding: 12px 10px;
    background: #fff;
    border-radius: 0 0 20px 0;
    color: #111;
    font-size: 1.3rem;
    line-height: 1.4;
    letter-spacing: 0;
    text-align: center
  }
  
  #header_nav .dropdown .dropdown-li a .footer-only {
    display: none
  }
  
  #header_nav .dropdown .dropdown-li a:hover {
    color: #492d18;
    background: #f5f3eb
  }
  
  #header_nav .dropdown .dropdown-li a:after {
    display: none
  }
  
  #page-top {
    position: fixed;
    bottom: 10px;
    right: 7px;
    z-index: 250
  }
  
  #page-top a {
    display: block;
    background: #0e1a43;
    box-shadow: rgba(0, 0, 0, .2) 2px 2px 2px;
    color: #fff;
    width: 50px;
    height: 50px;
    line-height: 50px;
    border-radius: 50%;
    font-size: 1.2rem;
    text-align: center
  }
  
  #page-top a:hover {
    opacity: .6
  }
  
  @media screen and (max-width: 639px) {
    #page-top {
      bottom: 40px
    }
  }
  
  @keyframes zoom-in {
    0% {
      transform: scale(1)
    }
    100% {
      transform: scale(1.12)
    }
  }
  
  #slideshow {
    position: relative;
    margin-inline: auto;
    overflow: hidden
  }
  
  #slideshow:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to right, #24487a -22.57%, #74c6e8 68.82%);
    opacity: .3;
    z-index: 2;
    pointer-events: none;
    mix-blend-mode: multiply
  }
  
  #slideshow .swiper-slide {
    position: relative
  }
  
  #slideshow .swiper-slide .slide-img {
    overflow: hidden;
    position: relative;
    width: 100%;
    aspect-ratio: 17/8;
    height: auto;
    min-height: 620px
  }
  
  #slideshow .swiper-slide .slide-img img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
  }
  
  @media screen and (max-width: 1025px) {
    #slideshow .swiper-slide .slide-img {
      aspect-ratio: 9/6;
      min-height: initial
    }
  }
  
  @media screen and (max-width: 639px) {
    #slideshow .swiper-slide .slide-img {
      aspect-ratio: 5/4.5
    }
  }
  
  #slide-wrap {
    position: relative
  }
  
  .txt-type {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 5%;
    color: #fff;
    z-index: 4;
    text-shadow: 4px 4px 4px rgba(0, 0, 0, .2);
    font-size: 4vmin;
    line-height: 1.3;
    letter-spacing: .2em;
    font-weight: 600;
    opacity: 0
  }
  
  .txt-type span {
    position: relative;
    opacity: 0;
    transition: opacity .2s ease-in
  }
  
  .txt-type span:last-of-type:after {
    content: "|";
    animation: typinganime .8s ease infinite;
    margin-left: 10px
  }
  
  @media screen and (max-width: 639px) {
    .txt-type {
      font-size: 2.2rem;
      transform: none;
      top: 22%;
      letter-spacing: .15em
    }
  }
  
  @keyframes typinganime {
    from {
      opacity: 0
    }
    to {
      opacity: 1
    }
  }
  
  @keyframes catch-txt-anim {
    0% {
      -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
      clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%)
    }
    30% {
      -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
      clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%)
    }
    100% {
      -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
      clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)
    }
  }
  
  #catch {
    position: absolute;
    left: 5%;
    bottom: 7%;
    z-index: 30;
    width: 100%;
    opacity: 0;
    text-align: center
  }
  
  #catch .catch-txt {
    color: #fff;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    font-size: 2.2vw;
    text-shadow: 0px -1px 14px rgba(78, 172, 216, .75)
  }
  
  #catch .catch-txt span {
    display: block;
    position: relative;
    width: -moz-fit-content;
    width: fit-content;
    padding: 8px 15px;
    z-index: 2
  }
  
  #catch .catch-txt span:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 0;
    height: 100%;
    background: linear-gradient(to right, #24487a -22.57%, #74c6e8 68.82%);
    mix-blend-mode: soft-light;
    z-index: -1;
    opacity: .9;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  #catch .catch-txt span:last-of-type {
    margin-top: 15px;
    animation-delay: 1s
  }
  
  #catch.on {
    transition: .5s all cubic-bezier(0.55, 0.05, 0.22, 0.99);
    opacity: 1
  }
  
  #catch.on .catch-txt span:before {
    width: 100%
  }
  
  @media screen and (max-width: 820px) {
    #catch .catch-txt {
      font-size: 3vw
    }
  }
  
  @media screen and (max-width: 639px) {
    #catch .catch-txt {
      margin-top: 40px;
      font-size: 4vw;
      transform: none
    }
    #catch .catch-txt span {
      padding: 6px 10px
    }
  }
  
  #catch-sub {
    position: relative;
    z-index: 50;
    width: 40%;
    opacity: 0;
    text-align: center
  }
  
  #catch-sub .small {
    display: block;
    text-align: center;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    color: #fff;
    font-size: 2.4rem;
    margin-bottom: -10px;
    letter-spacing: 1em;
    margin-right: -1em
  }
  
  #catch-sub img {
    filter: drop-shadow(0 0 8px rgba(73, 45, 24, 0.3))
  }
  
  #catch-sub.on {
    transition: .5s all cubic-bezier(0.55, 0.05, 0.22, 0.99);
    opacity: 1
  }
  
  @media screen and (max-width: 1025px) {
    #catch-sub {
      width: 45%
    }
    #catch-sub .small {
      font-size: 1.8rem;
      margin-bottom: -5px
    }
  }
  
  @media screen and (max-width: 639px) {
    #catch-sub {
      width: 80%;
      transform: translateY(20px)
    }
    #catch-sub .small {
      margin-bottom: 5px;
      font-size: 15px
    }
  }
  
  .slide-txt {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 40;
    font-size: 2.2rem;
    color: #fff;
    font-weight: 600;
    text-shadow: 0 0 8px rgba(73, 45, 24, .1)
  }
  
  .slide-txt.slide-txt01 {
    align-items: flex-start;
    justify-content: flex-end;
    padding: 20px 20px 0 0
  }
  
  .slide-txt.slide-txt01 img {
    width: 35%
  }
  
  @media screen and (max-width: 1025px) {
    .slide-txt.slide-txt01 img {
      width: 65%
    }
  }
  
  .slide-txt.slide-txt02 {
    align-items: flex-end;
    justify-content: flex-start;
    padding: 0 0 20px 20px
  }
  
  .slide-txt.slide-txt02 img {
    width: 45%
  }
  
  @media screen and (max-width: 1025px) {
    .slide-txt.slide-txt02 img {
      width: 70%
    }
  }
  
  @media screen and (max-width: 639px) {
    .slide-txt.slide-txt02 img {
      width: 85%
    }
  }
  
  @media screen and (max-width: 639px) {
    .slide-txt.slide-txt02 {
      padding: 0 0 10px 10px
    }
  }
  
  .slide-txt.slide-txt03 {
    align-items: flex-start;
    justify-content: flex-end;
    padding: 20px 20px 0 0
  }
  
  .slide-txt.slide-txt03 img {
    width: 38%
  }
  
  @media screen and (max-width: 1025px) {
    .slide-txt.slide-txt03 img {
      width: 55%
    }
  }
  
  #scrolldown {
    position: absolute;
    right: 15px;
    bottom: 60px;
    color: #fefefe;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-feature-settings: "pkna";
    font-size: 1.4rem;
    z-index: 100;
    height: 210px
  }
  
  #scrolldown:before, #scrolldown:after {
    position: absolute;
    content: "";
    z-index: 2;
    left: 50%
  }
  
  #scrolldown:before {
    width: 1px;
    height: 100px;
    bottom: 0;
    background: #f0f0f0;
    transform: translateX(-50%)
  }
  
  #scrolldown:after {
    width: 8px;
    height: 8px;
    background: rgba(255, 255, 255, .9);
    border-radius: 100%;
    top: 100px;
    margin-left: -4px;
    animation: scroll-point 2.3s ease-out infinite;
    animation-fill-mode: both
  }
  
  @media screen and (max-width: 1025px) {
    #scrolldown {
      display: none
    }
  }
  
  @keyframes scroll-point {
    0% {
      bottom: 0;
      opacity: 0
    }
    20% {
      opacity: 1
    }
    50% {
      top: 180px;
      opacity: 1
    }
    80% {
      opacity: 0
    }
    100% {
      top: 210px;
      opacity: 0
    }
  }
  
  .p-footer_btn-wrap {
    display: flex;
    justify-content: space-between
  }
  
  .p-footer_btn-wrap li {
    width: 47%
  }
  
  #l-footer {
    position: relative;
    margin-bottom: -62px
  }
  
  #l-footer:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../img/contact_bg.jpg) no-repeat center bottom/cover
  }
  
  #l-footer:after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .85;
    z-index: 0;
    background-image: linear-gradient(to right, #24487a 36.43%, #74c6e8 128.82%);
    transition: all 1s ease-in-out
  }
  
  #l-footer .inner {
    margin: 0 auto;
    max-width: 1100px;
    position: relative;
    z-index: 2;
    padding: 80px 20px 100px;
    font-size: 1.4rem
  }
  
  @media screen and (max-width: 1101px) {
    #l-footer .inner {
      width: 100%
    }
  }
  
  @media screen and (max-width: 639px) {
    #l-footer {
      font-size: 1.2rem
    }
    #l-footer .inner {
      padding: 30px 20px 30px
    }
  }
  
  #l-footer .footer-wrap {
    position: relative
  }
  
  #l-footer .footer-wrap .footer-left {
    width: 210px
  }
  
  #l-footer .footer-wrap .footer-left .mtitle6:before {
    background-image: #fefefe;
    color: #fefefe;
    -webkit-text-fill-color: initial;
    font-size: 4.5rem
  }
  
  #l-footer .footer-wrap .footer-left .mtitle6 .ja {
    color: #fefefe;
    font-size: 1.6rem
  }
  
  #l-footer .footer-wrap .footer-right {
    flex: 1;
    margin-left: 4%
  }
  
  #l-footer .footer-wrap .footer-right p {
    color: #fefefe;
    text-align: center;
    margin-bottom: 30px
  }
  
  #l-footer .footer-wrap .footer-contact p {
    color: #fefefe;
    text-align: center;
    margin-bottom: 30px
  }
  
  @media screen and (max-width: 639px) {
    #l-footer .footer-wrap .footer-contact p {
      margin-bottom: 10px
    }
  }
  
  #l-footer .footer-wrap .footer-contact .mtitle6 {
    margin-bottom: 30px
  }
  
  @media screen and (max-width: 639px) {
    #l-footer .footer-wrap .footer-contact .mtitle6 {
      margin-bottom: 20px
    }
  }
  
  #l-footer .footer-wrap .footer-contact .mtitle6:before {
    background-image: #fefefe;
    color: #fefefe;
    -webkit-text-fill-color: initial;
    font-size: 4.5rem
  }
  
  @media screen and (max-width: 480px) {
    #l-footer .footer-wrap .footer-contact .mtitle6:before {
      font-size: 4rem
    }
  }
  
  #l-footer .footer-wrap .footer-contact .mtitle6 .ja {
    color: #fefefe;
    font-size: 1.6rem
  }
  
  #l-footer .footer-wrap .footer-bottom {
    color: #fefefe;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
    border-top: 1px solid rgba(204, 204, 204, .5);
    padding-top: 30px
  }
  
  @media screen and (max-width: 820px) {
    #l-footer .footer-wrap .footer-bottom .flogo {
      width: 30%
    }
  }
  
  @media screen and (max-width: 639px) {
    #l-footer .footer-wrap .footer-bottom .flogo {
      width: 80%
    }
  }
  
  @media screen and (max-width: 639px) {
    #l-footer .footer-wrap .footer-bottom {
      flex-direction: column;
      gap: 10px;
      padding-top: 10px;
      margin-bottom: 60px
    }
  }
  
  @media screen and (max-width: 1101px) {
    #l-footer .footer-wrap {
      flex-direction: column
    }
    #l-footer .footer-wrap .footer-right {
      width: 100%;
      margin: 30px auto 0;
      padding-top: 10px;
      border-top: .9px solid #eee
    }
    #l-footer .footer-wrap .footer-left {
      margin-inline: auto;
      width: -moz-fit-content;
      width: fit-content
    }
  }
  
  @media screen and (max-width: 639px) {
    #l-footer .footer-wrap .footer-left, #l-footer .footer-wrap .footer-right {
      width: 100%
    }
    #l-footer .footer-wrap .footer-left {
      margin-bottom: 20px;
      text-align: center;
      margin: 0 auto 20px
    }
  }
  
  .footer__shop-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px 3%
  }
  
  .footer__shop-list .footer__shop-lead {
    margin-bottom: 8px;
    font-size: 1.7rem;
    font-weight: 600
  }
  
  .footer__shop-list .footer__shop-tel {
    display: block;
    position: relative;
    margin-bottom: 8px;
    color: #356a09;
    font-size: 2rem;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.2;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .footer__shop-list .footer__shop-tel:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px;
    font-size: .8em
  }
  
  .footer__shop-list .footer__shop-tel:hover {
    color: #4eacd8
  }
  
  .footer__shop-list .p-footer__shop-address {
    font-size: 14px;
    margin-bottom: 8px
  }
  
  .footer__shop-list .p-footer__shop-map {
    display: flex;
    align-items: center;
    width: -moz-fit-content;
    width: fit-content;
    padding: 4px 20px;
    background: #24487a;
    border-radius: 30px;
    color: #fff;
    font-weight: 600;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .footer__shop-list .p-footer__shop-map:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px;
    color: #0e1a43
  }
  
  .footer__shop-list .p-footer__shop-map:hover {
    background: #356a09
  }
  
  @media screen and (max-width: 639px) {
    .footer__shop-list {
      grid-template-columns: 1fr;
      text-align: left;
      width: -moz-fit-content;
      width: fit-content;
      margin-inline: auto
    }
    .footer__shop-list li:not(:first-child) {
      padding-top: 8px;
      border-top: 1px solid rgba(204, 204, 204, .5)
    }
    .footer__shop-list .footer__shop-lead {
      font-size: 1.4rem
    }
    .footer__shop-list .footer__shop-tel {
      font-size: 1.7rem
    }
    .footer__shop-list .p-footer__shop-map {
      font-size: 13px
    }
  }
  
  .map-big {
    width: 100%;
    height: 230px;
    overflow: hidden;
    border-radius: 20px;
    margin-top: 30px;
    flex-basis: 100%
  }
  
  .top-footer .footer__cbt {
    display: none
  }
  
  .footer__cbt {
    background-image: linear-gradient(to right, #666, #454545, #333)
  }
  
  .contact_bnr {
    position: relative;
    z-index: 2;
    margin-bottom: 25px;
    max-width: 800px;
    margin: 0 auto 25px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around
  }
  
  .contact_bnr>li {
    width: 47%
  }
  
  @media screen and (max-width: 639px) {
    .contact_bnr>li {
      width: 90%;
      margin: 0 auto
    }
    .contact_bnr>li:not(:last-child) {
      border-right: 0;
      margin-bottom: 5px
    }
  }
  
  .contact_bnr>li .bnr_tel {
    letter-spacing: .15em;
    background: rgba(0, 0, 0, 0);
    color: #fefefe;
    font-size: 3rem;
    line-height: 1.2;
    font-family: "Lato", sans-serif;
    font-family: "Lato", sans-serif;
    font-weight: 700
  }
  
  .contact_bnr>li .bnr_tel:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900
  }
  
  @media screen and (max-width: 1101px) {
    .contact_bnr>li .bnr_tel {
      font-size: 2.4rem
    }
  }
  
  @media screen and (max-width: 639px) {
    .contact_bnr>li .bnr_tel {
      font-size: 2.4rem;
      letter-spacing: 0
    }
  }
  
  @media screen and (max-width: 480px) {
    .contact_bnr>li .bnr_tel {
      font-size: 1.5rem
    }
  }
  

  





  
  .contact_bnr>li .bnr_mobile {
    background: #fefefe;
    color: #f66009
  }
  
  .contact_bnr>li .bnr_mobile:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900
  }
  
  .contact_bnr>li .bnr_fax {
    background: #fdfdfd;
    color: #4eacd8
  }
  
  .contact_bnr>li .bnr_fax:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900
  }
  
  .contact_bnr>li .bnr_mail {
    letter-spacing: .1rem;
    font-size: 2rem;
    color: #fefefe;
    border: 1px solid #fefefe;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif
  }
  
  @media screen and (max-width: 820px) {
    .contact_bnr>li .bnr_mail {
      font-size: 1.6rem
    }
  }
  
  @media screen and (max-width: 639px) {
    .contact_bnr>li .bnr_mail {
      font-size: 1.4rem
    }
  }
  
  @media screen and (max-width: 480px) {
    .contact_bnr>li .bnr_mail {
      font-size: 1.2rem
    }
  }
  
  .contact_bnr>li .bnr_mail:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900
  }
  
  .contact_bnr>li .bnr_mail:hover {
    color: #24487a;
    background: #fefefe
  }
  
  .contact_bnr>li a, .contact_bnr>li span {
    position: relative;
    display: block;
    color: #24487a;
    width: 100%;
    text-align: center;
    font-weight: 600;
    padding: 10px;
    margin: 0 auto
  }
  
  .contact_bnr>li a:hover, .contact_bnr>li span:hover {
    color: #ffd803
  }
  
  .contact_bnr>li a:before, .contact_bnr>li span:before {
    margin-right: 5px
  }
  
  @media screen and (max-width: 820px) {
    .contact_bnr>li a, .contact_bnr>li span {
      font-size: 1.6rem
    }
  }
  
  @media screen and (max-width: 639px) {
    .contact_bnr>li a:before, .contact_bnr>li span:before {
      font-size: 1.4rem
    }
  }
  
  .footer_navi {
    position: relative;
    margin: 30px auto 0;
    padding-top: 20px;
    border-top: 1px solid rgba(204, 204, 204, .5)
  }
  
  @media screen and (max-width: 1025px) {
    .footer_navi {
      margin-inline: auto
    }
  }
  
  @media screen and (max-width: 639px) {
    .footer_navi {
      display: none
    }
  }
  
  .footer_navi .globalNav {
    display: flex;
    justify-content: space-between;
    width: 90%;
    margin: 0 auto
  }
  
  @media screen and (max-width: 639px) {
    .footer_navi .globalNav {
      margin: 0 auto
    }
  }
  
  .footer_navi .globalNav li {
    text-align: left;
    margin-bottom: 4px
  }
  
  .footer_navi .globalNav li.btn-contact {
    display: none
  }
  
  @media screen and (max-width: 639px) {
    .footer_navi .globalNav li {
      text-align: center
    }
  }
  
  .footer_navi .globalNav li a {
    color: #fefefe;
    position: relative;
    font-weight: 600
  }
  
  .footer_navi .globalNav li a .eng {
    display: none
  }
  
  @media screen and (max-width: 639px) {
    .footer_navi .globalNav li a {
      font-size: 12px
    }
  }
  
  .footer_navi .globalNav li a:hover {
    color: #ffd803
  }
  
  .footer_navi .globalNav li .dropdown {
    display: none;
    margin-top: 10px;
    padding: 8px 5px 5px;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .footer_navi .globalNav li .dropdown.js-is-open {
    opacity: 1
  }
  
  @media screen and (max-width: 639px) {
    .footer_navi .globalNav li .dropdown {
      padding: 10px
    }
  }
  
  .footer_navi .globalNav li .dropdown .dropdown-ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px 15px;
    max-width: 320px
  }
  
  .footer_navi .globalNav li .dropdown .dropdown-li {
    width: 100%
  }
  
  .footer_navi .globalNav li .dropdown .dropdown-li:first-of-type {
    display: block
  }
  
  .footer_navi .globalNav li .dropdown .dropdown-li a {
    font-size: 13px;
    color: #ddd;
    line-height: 1.5;
    letter-spacing: 0;
    border: none;
    display: block
  }
  
  .footer_navi .globalNav li .dropdown .dropdown-li a:before {
    background: #fff
  }
  
  s .address {
    margin-top: 5px;
    font-size: 13px
  }
  
  .copy-inner {
    width: 95%;
    margin: 0 auto;
    position: relative;
    z-index: 20;
    background: #fefefe;
    border-radius: 20px 20px 0 0
  }
  
  .copyright {
    padding: 20px 0;
    font-size: 1.2rem;
    position: relative;
    z-index: 2;
    color: #fff;
    border-bottom: 0;
    color: #24487a
  }
  
  @media screen and (max-width: 1025px) {
    .copyright {
      font-size: 12px
    }
  }
  
  .news-box {
    margin: 0 auto 50px;
    max-width: 1200px;
    position: relative;
    z-index: 10;
    display: flex
  }
  
  @media screen and (max-width: 1025px) {
    .news-box {
      margin-top: 0
    }
  }
  
  @media screen and (max-width: 639px) {
    .news-box {
      flex-direction: column;
      padding: 20px 10px
    }
  }
  
  .news-title {
    position: relative
  }
  
  .news-title span {
    display: block
  }
  
  .news-title .eng {
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    color: #24487a;
    position: relative;
    font-size: 3rem
  }
  
  .news-title .ja {
    font-size: 1.5rem;
    position: relative;
    font-weight: 600
  }
  
  @media screen and (max-width: 639px) {
    .news-title {
      margin-bottom: 30px
    }
    .news-title .eng {
      font-size: 2rem
    }
    .news-title .ja {
      font-size: 1.4rem
    }
  }
  
  .news-right {
    flex: 1;
    margin-left: 80px
  }
  
  @media screen and (max-width: 639px) {
    .news-right {
      width: 100%;
      margin: 10px 0 0
    }
  }
  
  .map-link {
    font-weight: 600;
    color: #4eacd8;
    border-bottom: 1px solid #4eacd8
  }
  
  .map-link:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px
  }
  
  .single {
    max-width: 1100px;
    margin: 0 auto;
    padding: 80px 0;
    position: relative;
    z-index: 2
  }
  
  @media screen and (max-width: 1101px) {
    .single {
      padding: 80px 10px
    }
  }
  
  .single02 {
    margin: 0 auto;
    padding: 80px 0;
    position: relative;
    z-index: 2
  }
  
  .single03 {
    max-width: 1300px;
    margin: 0 auto;
    padding: 80px 0;
    position: relative;
    z-index: 2
  }
  
  @media screen and (max-width: 1300px) {
    .single03 {
      padding: 80px 10px
    }
  }
  
  @media screen and (max-width: 1300px) {
    .single, .single02, .single03 {
      max-width: 95%
    }
  }
  
  .margin-top {
    margin-top: -80px
  }
  
  @media screen and (max-width: 639px) {
    .margin-top {
      margin-top: -30px
    }
  }
  
  .lsingle, .rsingle {
    width: 48.44%
  }
  
  .lsingle {
    float: left
  }
  
  .rsingle {
    float: right
  }
  
  .mbox {
    background: rgba(255, 255, 255, .9);
    padding: 35px 40px;
    position: relative;
    max-width: 1200px;
    margin-right: auto;
    margin-left: auto;
    border-radius: 10px
  }
  
  .mbox.type1 {
    background: rgba(14, 26, 67, .4)
  }
  
  .mbox.shadow {
    box-shadow: rgba(0, 0, 0, .1) 0px 18px 50px -10px
  }
  
  .mbox.transparent {
    background: rgba(0, 0, 0, 0)
  }
  
  .mbox.type_negative {
    padding-top: 60px
  }
  
  @media screen and (max-width: 639px) {
    .mbox {
      padding: 15px 10px;
      border-radius: 0 0 20px 0
    }
  }
  
  .mbox2 {
    max-width: 1200px;
    background: rgba(243, 246, 245, .9);
    padding: 35px 30px;
    border-radius: 20px
  }
  
  .mbox2.type_negative {
    padding-top: 60px
  }
  
  @media screen and (max-width: 639px) {
    .mbox2 {
      padding: 15px
    }
  }
  
  .small-box {
    max-width: 850px;
    margin-right: auto;
    margin-left: auto
  }
  
  .small-box.type1 {
    max-width: 600px
  }
  
  .sentence p+p {
    margin-top: 20px
  }
  
  .bg-grid {
    background: rgba(255, 255, 255, .9);
    background-image: linear-gradient(90deg, transparent 95%, rgba(204, 204, 204, 0.2) 50%, rgba(204, 204, 204, 0.2)), linear-gradient(0deg, transparent 95%, rgba(204, 204, 204, 0.2) 50%, rgba(204, 204, 204, 0.2));
    background-size: 20px 20px;
    background-repeat: repeat
  }
  
  .bg-gradient {
    position: relative
  }
  
  .bg-gradient:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, #54d0ff, #9f92ff 20%, #ff7689 90%)
  }
  
  .bg-map {
    position: relative;
    max-width: 1200px;
    margin: 0 auto
  }
  
  .bg-map:before {
    position: absolute;
    content: "";
    width: 80%;
    height: 140%;
    right: 0;
    top: -20%;
    background: url(../img/map.png) no-repeat right 50%/contain
  }
  
  @media screen and (max-width: 639px) {
    .bg-map:before {
      width: 90%
    }
  }
  
  .bg-wall {
    background: url(../img/bg-wall.jpg)
  }
  
  #main {
    float: left;
    width: 76%
  }
  
  #main .mbox {
    min-height: 300px
  }
  
  @media screen and (max-width: 1025px) {
    #main .mbox {
      min-height: initial
    }
  }
  
  @media screen and (max-width: 1025px) {
    #main {
      float: none;
      width: 100%
    }
  }
  
  #side {
    float: right;
    position: sticky;
    right: 0;
    top: 0;
    width: 21%;
    padding-right: 10px
  }
  
  @media screen and (max-width: 1025px) {
    #side {
      float: none;
      width: 100%;
      position: static;
      margin-top: 40px
    }
  }
  
  .mtitle {
    margin: 0 auto 30px;
    text-align: center;
    position: relative;
    z-index: 3
  }
  
  .mtitle.type1 {
    margin-bottom: -30px
  }
  
  .mtitle:before {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    content: attr(data-title);
    font-family: "Lato", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 3.8rem;
    margin-inline: auto;
    color: rgba(0, 0, 0, 0);
    background-image: linear-gradient(to left, #1BB6F2 9.43%, #00C8B4 49.9%, #ADE478 94.82%);
    -webkit-background-clip: text;
    letter-spacing: 0;
    white-space: nowrap
  }
  
  .mtitle .ja {
    font-size: 2rem;
    color: #121212;
    display: block
  }
  
  .mtitle .img {
    display: block;
    width: 140px;
    margin: 8px 0
  }
  
  .mtitle.white {
    color: #fff;
    text-shadow: 0 0 3px rgba(0, 0, 0, .1)
  }
  
  .mtitle.white:before {
    color: #fff
  }
  
  .mtitle.white span {
    color: #fff;
    text-shadow: 0 0 3px rgba(0, 0, 0, .1)
  }
  
  .mtitle.white span:after {
    background-color: #eee
  }
  
  .mtitle.mtitle_left {
    text-align: left;
    margin-left: 0;
    margin-right: 0
  }
  
  .mtitle.mtitle_left:before {
    margin-left: 0
  }
  
  .mtitle.mtitle_right {
    text-align: right;
    margin-left: auto;
    margin-right: 0
  }
  
  @media screen and (max-width: 639px) {
    .mtitle {
      text-align: center
    }
    .mtitle:before {
      font-size: 2.6rem;
      white-space: nowrap
    }
    .mtitle .ja {
      font-size: 1.4rem
    }
  }
  
  .mtitle2 {
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    font-weight: 600;
    position: relative
  }
  
  .mtitle2:before {
    content: "";
    width: 20px;
    height: 1px;
    background: #ccc;
    display: inline-block;
    margin: 0 1em
  }
  
  .mtitle2 span {
    position: relative;
    z-index: 2
  }
  
  .mtitle2 .eng {
    font-size: 2.2rem;
    display: inline-block;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    color: #24487a;
    order: -1;
    letter-spacing: 0
  }
  
  .mtitle2 .ja {
    font-size: 2rem;
    color: #333
  }
  
  @media screen and (max-width: 639px) {
    .mtitle2:before {
      width: 15px
    }
    .mtitle2 .eng {
      font-size: 1.2rem
    }
    .mtitle2 .ja {
      font-size: 1.5rem
    }
  }
  
  .mtitle3 {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-feature-settings: "pkna";
    position: absolute;
    min-height: 100px;
    top: 40px;
    left: 30px
  }
  
  .mtitle3 .ja {
    display: block;
    font-size: 2.6rem;
    border-right: 2px solid #4eacd8;
    letter-spacing: .2em;
    padding-right: 5px;
    font-weight: 400
  }
  
  .mtitle3 .eng {
    display: block;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 1.8rem;
    color: #4eacd8;
    padding-left: 3px
  }
  
  @media screen and (max-width: 639px) {
    .mtitle3 {
      left: 10px;
      top: 15px
    }
    .mtitle3 .ja {
      font-size: 1.6rem
    }
    .mtitle3 .eng {
      font-size: 1.3rem
    }
  }
  
  .mtitle4 {
    font-weight: 600;
    text-align: center;
    color: #4eacd8;
    line-height: 1.5;
    letter-spacing: .1rem;
    font-size: 1.8rem
  }
  
  .mtitle4 span {
    position: relative;
    display: inline-block;
    min-width: 10%
  }
  
  .mtitle4 span:before, .mtitle4 span:after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 1px;
    height: 2rem;
    background-color: #4eacd8
  }
  
  .mtitle4 span:before {
    left: -11px;
    transform: rotate(-20deg)
  }
  
  .mtitle4 span:after {
    right: -11px;
    transform: rotate(20deg)
  }
  
  .mtitle4.white span:before, .mtitle4.white span:after {
    background-color: #ffd803
  }
  
  @media screen and (max-width: 639px) {
    .mtitle4 {
      font-size: 1.5rem
    }
  }
  
  @media screen and (max-width: 320px) {
    .mtitle4 span:before {
      left: -3px
    }
    .mtitle4 span:after {
      right: -3px
    }
  }
  
  .mtitle5 {
    position: relative
  }
  
  .mtitle5 span {
    position: relative;
    z-index: 2;
    padding: 0 15px 8px;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    font-size: 1.35em;
    line-height: 1.4;
    color: #4eacd8;
    display: inline-block
  }
  
  .mtitle5:before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 60%;
    background: #24ddf6;
    opacity: .3
  }
  
  .mtitle6 {
    color: #252322;
    position: relative;
    text-align: center;
    margin-bottom: 40px
  }
  
  .mtitle6:before {
    font-size: 6rem;
    white-space: nowrap;
    font-family: "Lato", sans-serif;
    font-weight: 700;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    content: attr(data-title);
    margin-inline: auto;
    letter-spacing: .1rem;
    line-height: 1;
    color: rgba(0, 0, 0, 0);
    background-image: radial-gradient(circle, #24487a 0, #278dc0 50%, #74c6e8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(0, 0, 0, 0);
    opacity: 1
  }
  
  .mtitle6 .ja {
    display: block;
    font-weight: 500;
    font-size: 2rem;
    position: relative;
    z-index: 2;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif
  }
  
  .mtitle6.mtitle_left {
    text-align: left;
    margin-left: 0;
    margin-right: 0
  }
  
  .mtitle6.mtitle_left:before {
    margin-left: 0
  }
  
  .mtitle6.mtitle_right {
    text-align: right;
    margin-left: auto;
    margin-right: 0
  }
  
  @media screen and (max-width: 639px) {
    .mtitle6 {
      text-align: center;
      margin-bottom: 20px
    }
    .mtitle6:before {
      font-size: 2.6rem;
      white-space: nowrap
    }
    .mtitle6 .ja {
      font-size: 1.4rem
    }
  }
  
  .mtitle7 {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    position: relative;
    padding-bottom: 1rem;
    justify-content: center;
    text-align: center;
    margin-bottom: 30px
  }
  
  .mtitle7:after {
    content: "";
    display: block;
    width: 100px;
    height: 2px;
    left: 50%;
    bottom: 0;
    transform: translatex(-50%) skewX(-50deg);
    position: absolute;
    background-image: linear-gradient(to right, #24487a 50%, #4eacd8 50%)
  }
  
  .mtitle7 .eng {
    display: inline-block;
    order: 1;
    font-size: 3.5rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2;
    color: #4eacd8;
    text-transform: initial;
    letter-spacing: 0;
    padding: 0 .3rem;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal
  }
  
  @media screen and (max-width: 639px) {
    .mtitle7 .eng {
      font-size: 2.4rem
    }
  }
  
  .mtitle7 .ja {
    display: inline-block;
    order: 3;
    font-size: 1.5rem;
    font-weight: 400;
    padding: 0 .8rem
  }
  
  @media screen and (max-width: 639px) {
    .mtitle7 .ja {
      font-size: 1.2rem
    }
  }
  
  .mtitle_line {
    font-size: 1.8rem;
    padding-bottom: 20px;
    position: relative;
    font-weight: 600;
    margin-bottom: 25px;
    color: #0e1a43;
    letter-spacing: .2rem
  }
  
  .mtitle_line span {
    display: block;
    font-size: 1.4rem;
    color: #4eacd8
  }
  
  .mtitle_line:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 10px;
    content: "";
    opacity: .6;
    background-image: repeating-linear-gradient(-45deg, #0E1A43, #aaa 1px, transparent 2px, transparent 5px);
    background-size: 7px 7px;
    backface-visibility: hidden
  }
  
  @media screen and (max-width: 639px) {
    .mtitle_line {
      font-size: 1.4rem
    }
    .mtitle_line span {
      font-size: 1.2rem
    }
  }
  
  .mtitle_sub {
    padding-left: .5em;
    font-weight: 600;
    position: relative;
    border-left: 3px solid #24487a;
    margin: 8px 0 15px;
    font-size: 1.1em;
    line-height: 1.4;
    text-align: left
  }
  
  .mtitle_sub:before {
    position: absolute;
    left: -3px;
    bottom: 0;
    content: "";
    width: 3px;
    height: 50%;
    background-color: #4eacd8
  }
  
  .mtitle_box {
    background: #4eacd8;
    color: #fff;
    font-size: 1.8rem;
    position: relative;
    padding: 10px 15px;
    margin-bottom: 25px;
    font-weight: 600
  }
  
  .mtitle_box a {
    color: #fff
  }
  
  .mtitle_box span {
    font-size: 14px;
    padding-left: 10px
  }
  
  .mtitle_box:before {
    position: absolute;
    content: "";
    width: 50px;
    height: 50px;
    background: url(../img/deco02.png) no-repeat center/contain;
    display: block;
    right: -1px;
    top: 50%;
    transform: translateY(-50%);
    color: #fff
  }
  
  @media screen and (max-width: 639px) {
    .mtitle_box {
      font-size: 1.3rem
    }
  }
  
  .mtitle_box.type1 {
    background: #24487a
  }
  
  .mtitle_box.type2 {
    background: #24ddf6
  }
  
  .mtitle_box2 {
    background: #4eacd8;
    font-size: 2rem;
    color: #fff;
    position: relative;
    font-weight: 600;
    overflow: hidden;
    letter-spacing: .1rem;
    padding: 10px 10px 10px 20px;
    margin-bottom: 25px
  }
  
  .mtitle_box2 .small-cap {
    font-weight: normal;
    font-size: 14px
  }
  
  .mtitle_box2:before {
    background-color: #fff;
    content: "";
    display: block;
    transform: rotate(60deg);
    position: absolute;
    bottom: -10px;
    right: -150px;
    width: 300px;
    height: 280px
  }
  
  @media screen and (max-width: 639px) {
    .mtitle_box2 {
      font-size: 15px;
      line-height: 1.5;
      padding: 10px 10px 10px 15px;
      padding-right: 40px
    }
    .mtitle_box2 span {
      font-size: 12px
    }
    .mtitle_box2:before {
      width: 215px;
      right: -170px
    }
  }
  
  .mtext1 {
    font-size: 2.2rem;
    line-height: 1.6
  }
  
  @media screen and (max-width: 639px) {
    .mtext1 {
      font-size: 1.4rem
    }
  }
  
  .mtext2 {
    font-size: 3rem;
    line-height: 1.6
  }
  
  @media screen and (max-width: 639px) {
    .mtext2 {
      font-size: 1.8rem;
      padding: 4px 8px
    }
  }
  
  .mtext3 {
    font-size: 1.8rem;
    letter-spacing: .15em
  }
  
  @media screen and (max-width: 639px) {
    .mtext3 {
      font-size: 1.4rem
    }
  }
  
  .mtitle_category {
    margin-bottom: 15px;
    font-size: 1.8rem;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal
  }
  
  .mtitle_category:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px;
    color: #4eacd8
  }
  
  .btn01 a {
    background: #4eacd8;
    text-align: center;
    width: 300px;
    margin: 15px auto;
    color: #fff;
    display: block;
    padding: 8px 5px;
    font-weight: 600;
    border-radius: 35px;
    max-width: 90%
  }
  
  .btn01 a:hover {
    background: #0e1a43;
    color: #fefefe
  }
  
  .btn01.type_left a {
    margin-left: 0
  }
  
  .btn01.mail {
    flex-basis: 100%
  }
  
  .btn01.mail a {
    background: #ffd803;
    margin: 15px auto 25px
  }
  
  .btn01.mail a:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px
  }
  
  @media screen and (max-width: 639px) {
    .btn01 a {
      width: 95%
    }
  }
  
  .btn02 {
    width: 300px;
    margin: 20px auto 20px
  }
  
  .btn02 a {
    display: block;
    position: relative;
    padding: 15px 30px 15px 5px;
    line-height: 24px;
    letter-spacing: .1rem;
    font-size: 1.5rem;
    text-align: center;
    color: #fff;
    background-image: linear-gradient(to right, #394578, #232c53);
    font-weight: 600
  }
  
  .btn02 a i {
    display: block;
    position: absolute;
    top: 50%;
    right: -10px;
    width: 40px;
    height: 1px;
    background-color: #ddd;
    transition: all .3s ease
  }
  
  .btn02 a:hover i {
    width: 34px
  }
  
  .btn02.type1 a {
    background: #fff;
    color: #4eacd8
  }
  
  @media screen and (max-width: 639px) {
    .btn02 {
      width: 260px
    }
    .btn02 a {
      font-size: 1.3rem
    }
  }
  
  .btn03 {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0px 20px 15px;
    color: #fff;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 1.8rem;
    line-height: 1;
    transition: .5s all cubic-bezier(0.55, 0.05, 0.22, 0.99)
  }
  
  .btn03.type_contact:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 7px
  }
  
  .btn03.type_entry:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 7px
  }
  
  .btn03 .arrow {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 25px;
    stroke: #ffd803;
    stroke-width: 2px;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .btn03:after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: #fff
  }
  
  .btn03:hover {
    color: #ffd803
  }
  
  .btn03:hover .arrow {
    right: 0
  }
  
  .btn03:hover:after {
    animation: border-anim 1.2s ease-out forwards
  }
  
  @media screen and (max-width: 639px) {
    .btn03 {
      padding-left: 15px;
      font-size: 1.5rem;
      text-align: left
    }
  }
  
  .news .news-inner {
    padding: 15px 0;
    border-top: 1px solid #555;
    font-size: 1.4rem;
    font-weight: 600
  }
  
  .news .news-inner:last-of-type {
    border-bottom: 1px solid #555
  }
  
  @media screen and (max-width: 639px) {
    .news .news-inner {
      font-size: 13px;
      padding: 10px 4px
    }
  }
  
  .news dt {
    color: #4eacd8
  }
  
  .news dt .category {
    font-size: 13px;
    background: #24487a;
    color: #fff;
    padding: 2px 4px;
    margin-left: 8px;
    font-weight: 400
  }
  
  @media screen and (max-width: 639px) {
    .news dt {
      width: 100%
    }
    .news dt .category {
      font-size: 12px
    }
  }
  
  .news dd {
    margin-left: 8px
  }
  
  .news dd a {
    color: #222;
    background-image: linear-gradient(to right, #4eacd8, #ffd803);
    padding-bottom: .25em;
    background-position: 100% 100%;
    background-size: 0% 1px;
    background-repeat: no-repeat;
    transition: background-size .5s cubic-bezier(0.165, 0.84, 0.44, 1);
    font-weight: 600
  }
  
  .news dd a:hover {
    background-position: 0 100%;
    background-size: 100% 1px
  }
  
  @media screen and (max-width: 639px) {
    .news dd {
      width: 100%;
      margin: 5px 0 0
    }
  }
  
  .slick-prev {
    background: #4eacd8 !important;
    width: 30px !important;
    height: 30px !important;
    top: auto !important;
    bottom: -5px !important;
    z-index: 50 !important;
    border-radius: 50% !important;
    transition: all .2s ease-in;
    left: auto !important;
    right: 40px !important
  }
  
  .slick-prev:before {
    color: #fff !important
  }
  
  .slick-prev:hover {
    background: #ffd8d8
  }
  
  @media screen and (max-width: 639px) {
    .slick-prev {
      bottom: -14px !important
    }
  }
  
  .slick-next {
    background: #4eacd8 !important;
    width: 30px !important;
    height: 30px !important;
    top: auto !important;
    bottom: -5px !important;
    z-index: 50 !important;
    border-radius: 50% !important;
    transition: all .2s ease-in;
    right: 5px !important
  }
  
  .slick-next:before {
    color: #fff !important
  }
  
  .slick-next:hover {
    background: #ffd8d8
  }
  
  @media screen and (max-width: 639px) {
    .slick-next {
      bottom: -14px !important
    }
  }
  
  .slick-track {
    display: flex !important
  }
  
  .news-bl {
    overflow: hidden
  }
  
  .top-blog .news-bl {
    display: none
  }
  
  .news-bl.slick-initialized {
    display: block
  }
  
  .news-bl .slick-slide {
    display: flex !important
  }
  
  .news-bl .news-bl-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 10px 40px 10px 15px
  }
  
  @media screen and (max-width: 639px) {
    .news-bl .news-bl-inner {
      padding: 10px 40px 40px 0
    }
  }
  
  .news-bl dt {
    width: 6em;
    font-size: 1.4rem;
    line-height: 1.3;
    letter-spacing: 0;
    text-align: center
  }
  
  .news-bl dt .year {
    color: #555;
    font-size: 12px
  }
  
  .news-bl dt .md {
    display: inline-block;
    color: #4eacd8;
    font-size: 1.5rem;
    font-weight: 600
  }
  
  @media screen and (max-width: 639px) {
    .news-bl dt {
      width: 4.5em;
      font-size: 12px
    }
    .news-bl dt .md {
      font-size: 1.3rem
    }
  }
  
  .news-bl dd {
    flex: 1;
    margin-left: 50px;
    line-height: 1.6;
    font-size: 1.4rem
  }
  
  .news-bl dd a {
    color: #232323;
    background-image: linear-gradient(to right, #4eacd8, #0E1A43);
    padding-bottom: .25em;
    background-position: 100% 100%;
    background-size: 0% 1px;
    background-repeat: no-repeat;
    transition: background-size .5s cubic-bezier(0.165, 0.84, 0.44, 1);
    font-weight: 600
  }
  
  .news-bl dd a:hover {
    background-position: 0 100%;
    background-size: 100% 1px
  }
  
  @media screen and (max-width: 639px) {
    .news-bl dd {
      margin-left: 20px;
      font-size: 13px
    }
  }
  
  .page-title {
    position: relative;
    background: url(../img/top_servise_bg.jpg) no-repeat center top/cover;
    overflow: hidden
  }
  
  .page-title:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to right, #24487a -22.57%, #74c6e8 68.82%);
    mix-blend-mode: screen;
    opacity: .6
  }
  
  .page-title:after {
    position: absolute;
    content: "";
    right: 0px;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .7);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    -webkit-clip-path: polygon(0% 0%, 0% 100%, 30px 100%, 30px 8%, 100% 8%, 100% 92%, 40% 92%, 40% 100%, 100% 100%, 100% 0%);
    clip-path: polygon(0% 0%, 0% 100%, 30px 100%, 30px 8%, 100% 8%, 100% 92%, 40% 92%, 40% 100%, 100% 100%, 100% 0%);
    opacity: 1
  }
  
  @media screen and (max-width: 639px) {
    .page-title:after {
      -webkit-clip-path: polygon(0% 0%, 0% 100%, 15px 100%, 15px 8%, 100% 8%, 100% 92%, 40% 92%, 40% 100%, 100% 100%, 100% 0%);
      clip-path: polygon(0% 0%, 0% 100%, 15px 100%, 15px 8%, 100% 8%, 100% 92%, 40% 92%, 40% 100%, 100% 100%, 100% 0%)
    }
  }
  
  .page-title .inner {
    margin: 0 auto;
    padding-bottom: 30px;
    height: 400px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    max-width: 1100px;
    position: relative;
    z-index: 3
  }
  
  @media screen and (max-width: 1101px) {
    .page-title .inner {
      padding: 0 20px 30px
    }
  }
  
  @media screen and (max-width: 820px) {
    .page-title .inner {
      height: 350px
    }
  }
  
  @media screen and (max-width: 639px) {
    .page-title .inner {
      height: 55vw
    }
  }
  
  .page-title .inner .page-lead {
    font-size: 2.4rem;
    position: relative;
    padding-left: 40px;
    text-shadow: 0 0 8px rgba(73, 45, 24, .1)
  }
  
  .page-title .inner .page-lead.on .eng {
    transform: translateX(0);
    opacity: 1
  }
  
  .page-title .inner .page-lead.on .ja {
    opacity: 1;
    transform: translateY(0);
    color: #fefefe
  }
  
  .page-title .inner .page-lead .eng {
    display: block;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 7rem;
    color: #fff;
    line-height: 1;
    text-shadow: 0 0 8px rgba(73, 45, 24, .1);
    margin-top: 10px;
    opacity: 0;
    transform: translateX(-10%);
    transition: .5s all cubic-bezier(0.55, 0.05, 0.22, 0.99)
  }
  
  @media screen and (max-width: 1300px) {
    .page-title .inner .page-lead .eng {
      font-size: 6rem
    }
  }
  
  @media screen and (max-width: 820px) {
    .page-title .inner .page-lead .eng {
      font-size: 5rem
    }
  }
  
  .page-title .inner .page-lead .ja {
    opacity: 0;
    transform: translateY(20px);
    position: relative;
    z-index: 4;
    transition: .5s all cubic-bezier(0.55, 0.05, 0.22, 0.99);
    transition-delay: .6s;
    display: inline-block;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    letter-spacing: .15em
  }
  
  @media screen and (max-width: 1300px) {
    .page-title .inner .page-lead {
      padding-left: 15px
    }
  }
  
  @media screen and (max-width: 639px) {
    .page-title .inner .page-lead {
      font-size: 1.6rem
    }
    .page-title .inner .page-lead .eng {
      font-size: 3rem
    }
  }
  
  .bg-01 {
    position: relative
  }
  
  .bg-01:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to right, #24487a -22.57%, #74c6e8 68.82%);
    z-index: -1;
    opacity: .7
  }
  
  .bg-01 .bg-01-inner {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../img/1.jpg) no-repeat center/cover;
    mix-blend-mode: overlay;
    opacity: .7
  }
  
  .bg-02 {
    position: relative
  }
  
  .bg-02:after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../img/bg-pattern2.jpg) repeat left center/cover;
    mix-blend-mode: multiply;
    opacity: .5
  }
  
  .bg-03 {
    position: relative
  }
  
  .bg-03:before {
    position: absolute;
    content: "";
    left: 0;
    top: -15%;
    width: 40%;
    height: 80%;
    background: url(../img/bg-03.png) no-repeat left top/contain;
    opacity: .4
  }
  
  @media screen and (max-width: 639px) {
    .bg-03:before {
      width: 80%;
      opacity: .3;
      z-index: -2
    }
  }
  
  .bg-04 {
    position: relative
  }
  
  .bg-04:before {
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 200px);
    background-image: linear-gradient(to right bottom, #444, #232323);
    z-index: -1
  }
  
  .bg-05 {
    position: relative
  }
  
  .bg-05:after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../img/bg_-texture.jpg) repeat left center/contain;
    mix-blend-mode: multiply;
    opacity: .5
  }
  
  .bg-pattern {
    position: relative
  }
  
  .bg-pattern:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../img/bg-pattern.jpg);
    background-size: 900px;
    opacity: .5
  }
  
  .bg-base {
    position: relative
  }
  
  .bg-base:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: linear-gradient(to bottom, #0e1a43 0%, #1d3a6a 50%, #214172 65%, #224576 75.5%, #234678 82.85%, #244779 88%, #24487a 100%);
    opacity: .3
  }
  
  .bg-base.type1 {
    position: relative
  }
  
  .bg-base.type1:before {
    position: absolute;
    content: "";
    left: 50%;
    top: 50%;
    width: calc(100% - 80px);
    height: calc(100% - 20px);
    transform: translate(-50%, -50%);
    background: #f3f6f5;
    opacity: 1;
    z-index: -2
  }
  
  @media screen and (max-width: 1101px) {
    .bg-base.type1:before {
      width: calc(100% - 10px);
      height: calc(100% - 10px)
    }
  }
  
  .bg-base.type2 .inner {
    position: relative;
    z-index: 3
  }
  
  .bg-base.type2:before {
    position: absolute;
    content: "";
    left: 50%;
    top: 50%;
    width: calc(100% - 80px);
    height: calc(100% - 80px);
    transform: translate(-50%, -50%);
    background: #fefefe
  }
  
  @media screen and (max-width: 639px) {
    .bg-base.type2:before {
      width: calc(100% - 40px);
      height: calc(100% - 40px)
    }
  }
  
  .bg-base.type3 {
    position: relative
  }
  
  .bg-base.type3:before {
    position: absolute;
    content: "";
    left: 50%;
    top: 50%;
    width: calc(100% - 80px);
    height: calc(100% - 40px);
    transform: translate(-50%, -50%);
    background: #24ddf6;
    opacity: .2
  }
  
  @media screen and (max-width: 1101px) {
    .bg-base.type3:before {
      width: calc(100% - 20px);
      height: calc(100% - 20px)
    }
  }
  
  .bg-green {
    background: rgba(36, 221, 246, .4)
  }
  
  .bg-gray {
    position: relative
  }
  
  .bg-gray:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(243, 246, 245, .8);
    z-index: -2
  }
  
  .bg-gray.type1 {
    background: #f8f8f8
  }
  
  .bg-gray.bg-half-bottom {
    background: rgba(0, 0, 0, 0);
    background-image: linear-gradient(to bottom, transparent 0%, transparent 50%, #F3F6F5 50.1%, #F3F6F5 100%)
  }
  
  .bg-gray.bg-half-upper {
    background: rgba(0, 0, 0, 0);
    background-image: linear-gradient(to bottom, #F3F6F5 0%, #F3F6F5 50%, transparent 50.1%, transparent 100%)
  }
  
  .bg-gray2 {
    background-image: linear-gradient(to bottom, transparent, #F3F6F5)
  }
  
  .bg-999 {
    background: #888
  }
  
  .bg-blue {
    position: relative;
    background: rgba(0, 0, 0, 0)
  }
  
  .bg-blue:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #e7ebec
  }
  
  .bg-blue.type1:before {
    top: 0;
    width: 100%;
    height: 100%;
    background: #0e1a43;
    opacity: .9
  }
  
  .bg-blue.type2:before {
    top: 0;
    width: 100%;
    height: 100%;
    background: #24ddf6;
    opacity: .3
  }
  
  .bg-blue3 {
    position: relative
  }
  
  .bg-blue3:before {
    position: absolute;
    content: "";
    width: 54%;
    height: 70%;
    top: 30px;
    right: 0;
    background-image: linear-gradient(to right, #99d0e7, #1d6796);
    z-index: -3;
    opacity: .1
  }
  
  .bg-blue3.maxw:before {
    width: 100%;
    height: 100%;
    top: 0
  }
  
  .bg-blue3.left:before {
    right: auto;
    left: 0;
    background-image: linear-gradient(to left, #99d0e7, #1d6796)
  }
  
  .bg-blue4 {
    position: relative
  }
  
  .bg-blue4:before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(180deg, transparent 0, transparent 45%, rgba(78, 172, 216, 0.2) 55%, rgba(78, 172, 216, 0.45));
    opacity: .6
  }
  
  .bg-blue5 {
    position: relative
  }
  
  .bg-blue5:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 60%;
    bottom: 0;
    right: 0;
    background-image: linear-gradient(to right, #99d0e7, #1d6796);
    z-index: -3;
    opacity: .2
  }
  
  .bg-blue5.maxw:before {
    width: 100%;
    height: 100%;
    top: 0
  }
  
  .bg-blue5.left:before {
    right: auto;
    left: 0;
    background-image: linear-gradient(to left, #99d0e7, #1d6796)
  }
  
  @media screen and (max-width: 1025px) {
    .bg-blue5:before {
      height: 100%;
      opacity: .1
    }
  }
  
  .bg-beige {
    background: #f5f3eb
  }
  
  .bg-beige.type1 {
    background: rgba(0, 0, 0, 0);
    position: relative
  }
  
  .bg-beige.type1:before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 50%;
    background: #f5f3eb;
    z-index: -1
  }
  
  .bg-beige2 {
    background: rgba(238, 221, 197, .4)
  }
  
  .bg-base2 {
    background: repeating-linear-gradient(45deg, rgba(78, 172, 216, 0.1) 0, rgba(78, 172, 216, 0.1) 20px, #fefefe 20px, #fefefe 40px)
  }
  
  .tbl-company {
    width: 100%
  }
  
  .tbl-company th, .tbl-company td {
    padding: 18px 15px;
    vertical-align: top;
    border-bottom: 1px rgba(36, 72, 122, .7) solid;
    letter-spacing: 0;
    font-size: 1.5rem
  }
  
  .tbl-company th {
    width: 22%;
    font-weight: 600;
    text-align: left
  }
  
  .tbl-company th.th-2 {
    background: #ddcdef;
    position: relative
  }
  
  .tbl-company th.th-2:before {
    position: absolute;
    content: "";
    right: -20px;
    top: 0;
    width: 25px;
    height: 100%;
    background: #ddcdef;
    border-radius: 0 0 40px 0
  }
  
  .tbl-company td.td-2 {
    background: #f3f0f5;
    font-weight: 600;
    color: #0e1a43
  }
  
  @media screen and (max-width: 639px) {
    .tbl-company th, .tbl-company td {
      padding: 20px 4px;
      font-size: .95em
    }
    .tbl-company th {
      width: 25%
    }
  }
  
  .tbl_normal {
    width: 100%
  }
  
  .tbl_normal.type1 th {
    width: 30%;
    font-size: 2rem;
    line-height: 1
  }
  
  @media screen and (max-width: 639px) {
    .tbl_normal.type1 th {
      font-size: 1.6rem;
      width: 35%
    }
  }
  
  .tbl_normal.type1 td {
    text-align: left;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    font-size: .9em
  }
  
  .tbl_normal th, .tbl_normal td {
    padding: 4px 5px;
    vertical-align: middle;
    border-bottom: .9px solid #ccc
  }
  
  .tbl_normal th {
    width: 70%;
    text-align: left
  }
  
  .tbl_normal td {
    text-align: right
  }
  
  .tbl {
    width: 100%
  }
  
  .tbl th, .tbl td {
    padding: 15px;
    vertical-align: middle;
    border: 1px solid #ddd
  }
  
  .tbl th {
    background: #f3f6f5;
    text-align: left
  }
  
  .tbl th span {
    font-size: 1.4rem
  }
  
  .tbl .cell01 {
    width: 45%
  }
  
  .tbl .cell02 {
    width: 30%
  }
  
  @media screen and (max-width: 639px) {
    .tbl th {
      text-align: left
    }
    .tbl th, .tbl td {
      padding: 10px 8px;
      letter-spacing: 0
    }
  }
  
  .tbl_new {
    width: 100%
  }
  
  .tbl_new tr th, .tbl_new tr td {
    vertical-align: middle;
    padding: 15px 10px;
    font-size: 1.5rem
  }
  
  @media screen and (max-width: 639px) {
    .tbl_new tr th, .tbl_new tr td {
      font-size: 13px
    }
  }
  
  .tbl_new tr:nth-child(odd) th, .tbl_new tr:nth-child(odd) td {
    background: #f3f6f5
  }
  
  .tbl_new tr th {
    font-weight: 600;
    width: 22%;
    color: #555;
    text-align: left;
    padding-left: 30px;
    letter-spacing: 0
  }
  
  @media screen and (max-width: 639px) {
    .tbl_new tr th {
      width: 30%;
      padding-left: 10px
    }
  }
  
  .tbl_new tr th.th-long {
    width: 100%;
    text-align: center;
    background: #24ddf6;
    color: #fff;
    letter-spacing: .15em;
    font-size: 1.1em
  }
  
  .tbl-border, .voice-entry-wrap table {
    width: 100%
  }
  
  .tbl-border.tbl-mini th, .voice-entry-wrap table.tbl-mini th, .tbl-border.tbl-mini td, .voice-entry-wrap table.tbl-mini td {
    padding: 6px 10px;
    border-width: 1px;
    font-size: 14px;
    letter-spacing: .1rem
  }
  
  .tbl-border th, .voice-entry-wrap table th, .tbl-border td, .voice-entry-wrap table td {
    padding: 15px;
    border-bottom: 1px solid #ddd;
    vertical-align: middle;
    line-height: 1.6
  }
  
  @media screen and (max-width: 639px) {
    .tbl-border th, .voice-entry-wrap table th, .tbl-border td, .voice-entry-wrap table td {
      padding: 10px;
      font-size: 1.2rem
    }
  }
  
  .tbl-border .small, .voice-entry-wrap table .small {
    font-size: .9em;
    line-height: 1.4
  }
  
  .tbl-border th, .voice-entry-wrap table th {
    width: 22%;
    text-align: left;
    font-weight: 600;
    border-bottom-color: #4eacd8;
    color: #333
  }
  
  .tbl-border th.th-1, .voice-entry-wrap table th.th-1 {
    width: 45%
  }
  
  @media screen and (max-width: 639px) {
    .tbl-border th, .voice-entry-wrap table th {
      width: 34%
    }
  }
  
  .price {
    font-family: "Lato", sans-serif;
    font-weight: 600;
    font-size: 2rem;
    color: #cf5ea2
  }
  
  @media screen and (max-width: 639px) {
    .price {
      font-size: 1.4rem
    }
  }
  
  .ggmap {
    position: relative;
    padding-bottom: 46.25%;
    height: 0;
    overflow: hidden
  }
  
  .ggmap.type1 {
    padding-bottom: 56.2%
  }
  
  .ggmap.type2 {
    padding-bottom: 60%
  }
  
  .ggmap iframe, .ggmap object, .ggmap embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
  }
  
  @media screen and (max-width: 639px) {
    .ggmap {
      padding-bottom: 65.25%
    }
  }
  
  .list_common li {
    padding-bottom: 5px;
    padding-left: 1rem;
    margin-bottom: 5px;
    border-bottom: 1px solid #ddd
  }
  
  .list_common li:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: none
  }
  
  .list_common.common_big li {
    padding-bottom: 10px;
    margin-bottom: 10px
  }
  
  .list-policy {
    background: rgba(255, 255, 255, .7);
    padding: 25px;
    margin-bottom: 40px
  }
  
  .list-policy li {
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-size: 2rem;
    padding-bottom: 5px;
    margin-bottom: 6px;
    font-weight: 600
  }
  
  .list-policy li:before {
    content: "一、";
    margin-right: 7px;
    color: #4eacd8
  }
  
  @media screen and (max-width: 639px) {
    .list-policy {
      padding: 15px
    }
    .list-policy li {
      font-size: 1.4rem
    }
  }
  
  .list_check {
    max-width: 1000px;
    margin-inline: auto
  }
  
  .list_check.type1 {
    display: flex;
    flex-wrap: wrap
  }
  
  .list_check.type1 li {
    background: #0e1a43;
    padding: 12px 8px;
    width: 31%;
    color: #fff;
    justify-content: space-between
  }
  
  @media screen and (max-width: 639px) {
    .list_check.type1 li {
      width: 95%;
      margin: 0 auto 5px
    }
    .list_check.type1 li:nth-child(2n) {
      margin-left: auto
    }
  }
  
  .list_check li {
    padding: 4px;
    padding-left: 30px;
    font-weight: 600;
    position: relative;
    margin-bottom: 5px
  }
  
  .list_check li a {
    color: #4eacd8;
    border-bottom: 1px dotted #4eacd8
  }
  
  .list_check li:before {
    position: absolute;
    left: 0;
    top: 20px;
    content: "";
    width: 10px;
    height: 2px;
    background: #24487a
  }
  
  @media screen and (max-width: 639px) {
    .list_check li {
      width: 98%;
      margin: 0 auto 10px;
      font-size: 1.3rem
    }
  }
  
  .list_check.type2 li {
    padding: 5px 5px 5px 40px;
    border-bottom: 2px solid #f3f6f5;
    font-size: inherit
  }
  
  .list_check.type2 li .num {
    font-family: "Lato", sans-serif;
    font-weight: 700;
    font-size: 1.6em;
    position: absolute;
    line-height: 1;
    left: 0;
    top: 2px;
    color: #24487a
  }
  
  .list_check.type2 li:before {
    display: none
  }
  
  .list_check2 li {
    padding: 8px;
    font-weight: 600;
    margin-bottom: 4px;
    border-bottom: 1px solid #ccc
  }
  
  .list_check2 li:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 8px;
    color: #4eacd8
  }
  
  .list_check2.type1 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 5px 20px
  }
  
  @media screen and (max-width: 639px) {
    .list_check2.type1 {
      grid-template-columns: 1fr;
      gap: 5px 0
    }
  }
  
  .list-inline2 {
    text-align: center
  }
  
  .list-inline2 li {
    display: inline-block;
    padding: 4px 15px;
    background: #fefefe;
    border: 1px solid #555;
    font-weight: 600;
    border-radius: 30px
  }
  
  .list-inline2 li:not(:last-child) {
    margin-right: 8px
  }
  
  .list-inline li {
    display: inline-block;
    padding: 3px
  }
  
  .list-inline li:not(:last-of-type):after {
    content: "/";
    margin: 0 5px;
    color: #4eacd8;
    font-weight: normal
  }
  
  .num-txt {
    display: inline-block;
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    font-size: 1.6rem;
    color: #fff;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    background: #24487a;
    border-radius: 100%
  }
  
  .ol-list {
    counter-reset: number;
    list-style: none;
    padding: 5px
  }
  
  .ol-list.type1 {
    display: flex;
    flex-wrap: wrap
  }
  
  .ol-list.type1>li {
    width: 48%
  }
  
  .ol-list.type1>li:nth-child(2n) {
    margin-left: 4%
  }
  
  .ol-list li {
    margin-bottom: 10px;
    padding-bottom: 5px;
    font-weight: 600;
    padding-left: 40px;
    position: relative
  }
  
  .ol-list li:before {
    counter-increment: number;
    content: counter(number);
    background: #24487a;
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    font-size: 1.6rem;
    color: #f5f3eb;
    position: absolute;
    left: 0;
    top: 0px;
    border-radius: 100%;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal
  }
  
  @media screen and (max-width: 639px) {
    .ol-list li {
      font-size: 1.3rem
    }
    .ol-list li span {
      font-size: .9em
    }
    .ol-list li:before {
      font-size: 1.4rem
    }
  }
  
  .list_disc li {
    padding: 5px 0
  }
  
  .list_disc li a {
    font-weight: 600;
    letter-spacing: .1rem
  }
  
  .list_disc li:not(:last-of-type) {
    margin-bottom: 5px;
    border-bottom: 1px dashed #ccc
  }
  
  .list_disc li:before {
    content: "●";
    margin-right: 5px;
    color: #4eacd8
  }
  
  .list-btn {
    display: flex;
    flex-wrap: wrap
  }
  
  .list-btn.type1 {
    justify-content: center
  }
  
  .list-btn li {
    width: 32%;
    margin: 0 1.995% 10px 0
  }
  
  .list-btn li a {
    display: block;
    background: #0e1a43;
    font-weight: 600;
    padding: 20px 3px;
    text-align: center;
    width: 100%;
    height: 100%;
    line-height: 1.5;
    font-size: 1.8rem;
    letter-spacing: 0;
    color: #fff
  }
  
  .list-btn li a:after {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-left: 5px
  }
  
  @media screen and (max-width: 1025px) {
    .list-btn li a {
      font-size: 1.5rem
    }
  }
  
  .list-btn li:nth-child(even) a {
    background: #24487a
  }
  
  .list-btn li:nth-child(3n) {
    margin-right: 0
  }
  
  @media screen and (max-width: 639px) {
    .list-btn li {
      width: 90%;
      margin: 0 auto 10px
    }
    .list-btn li a {
      font-size: 1.2rem
    }
    .list-btn li:nth-child(3n) {
      margin-right: auto
    }
  }
  
  @media screen and (max-width: 1025px) {
    .top-list1 {
      padding-bottom: 45px
    }
  }
  
  .top-list1>.child {
    background: #cae3f1;
    padding: 15px;
    border-radius: 15px;
    position: relative;
    padding-bottom: 50px;
    margin-top: 110px !important
  }
  
  @media screen and (max-width: 639px) {
    .top-list1>.child {
      padding-bottom: 60px
    }
  }
  
  .top-list1 .pages {
    display: none
  }
  
  .btn-block {
    position: absolute;
    left: 50%;
    bottom: -40px;
    z-index: 3;
    transform: translateX(-50%)
  }
  
  .morebtn2 {
    position: relative;
    display: inline-block;
    cursor: pointer;
    outline: none;
    border: 0;
    margin: 15px 0;
    vertical-align: middle;
    text-decoration: none;
    background: #fff;
    border-radius: 40px;
    padding: 6px;
    box-shadow: rgba(0, 0, 0, .05) 0px 3px 8px;
    width: 240px;
    font-size: 1.5rem
  }
  
  @media screen and (max-width: 639px) {
    .morebtn2 {
      font-size: 1.2rem
    }
  }
  
  .morebtn2 .circle {
    transition: all .45s cubic-bezier(0.65, 0, 0.076, 1);
    position: relative;
    display: block;
    margin: 0;
    width: 44px;
    height: 44px;
    background: #0e1a43;
    margin-left: -1px;
    border-radius: 22px
  }
  
  .morebtn2 .circle .icon {
    transition: all .45s cubic-bezier(0.65, 0, 0.076, 1);
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    background: #fff
  }
  
  .morebtn2 .circle .icon.arrow {
    transition: all .45s cubic-bezier(0.65, 0, 0.076, 1);
    left: 4px;
    width: 2rem;
    height: .125rem;
    background: none
  }
  
  .morebtn2 .circle .icon.arrow:before {
    position: absolute;
    content: "";
    top: -0.25rem;
    right: .0625rem;
    width: .625rem;
    height: .625rem;
    border-top: .125rem solid #fff;
    border-right: .125rem solid #fff;
    transform: rotate(45deg)
  }
  
  .morebtn2 .button-text {
    transition: all .45s cubic-bezier(0.65, 0, 0.076, 1);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 16px 0;
    margin: 0 0 0 1.85rem;
    color: #0e1a43;
    font-weight: 700;
    line-height: 1.6;
    text-align: center;
    text-transform: uppercase
  }
  
  .morebtn2:hover .circle {
    width: 101%;
    background: #0e1a43
  }
  
  .morebtn2:hover .circle .icon.arrow {
    background: #fff;
    transform: translate(1rem, 0)
  }
  
  .morebtn2:hover .button-text {
    color: #fff
  }
  
  .morebtn2.type1 {
    background: #0e1a43;
    width: 280px
  }
  
  .morebtn2.type1 .circle {
    background: #fff
  }
  
  .morebtn2.type1 .icon {
    background: #0e1a43
  }
  
  .morebtn2.type1 .icon.arrow:before {
    border-color: #0e1a43
  }
  
  .morebtn2.type1 .button-text {
    color: #fff;
    font-size: 1.1em
  }
  
  .morebtn2.type1:hover .button-text {
    color: #0e1a43
  }
  
  #main .blog-wrap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 35px 4%
  }
  
  @media screen and (max-width: 639px) {
    #main .blog-wrap {
      grid-template-columns: 1fr;
      padding: 0 20px
    }
  }
  
  .blog-wrap li {
    position: relative
  }
  
  .blog-wrap a {
    position: relative;
    background: #fff;
    display: block;
    padding-bottom: 10px
  }
  
  .blog-wrap a .blog-detail {
    position: relative;
    padding: 10px 15px 30px
  }
  
  .blog-wrap a .blog-img {
    overflow: hidden
  }
  
  .blog-wrap a .blog-img img {
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .blog-wrap a:hover .blog-img img {
    transform: scale(1.1)
  }
  
  .blog-wrap a:hover .morebtn {
    border-bottom-color: #24487a
  }
  
  .morebtn {
    position: absolute;
    right: 10px;
    bottom: -10px;
    color: #4eacd8;
    border-bottom: 2px solid #4eacd8;
    font-size: 12px;
    font-weight: 700;
    padding: 0 10px;
    transition: .2s ease-in all;
    letter-spacing: 0;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal
  }
  
  @media screen and (max-width: 639px) {
    .morebtn {
      font-size: 11px
    }
  }
  
  .pages {
    overflow: hidden;
    margin-top: 50px
  }
  
  .pages .page_next, .pages .page_prev {
    display: inline-block
  }
  
  .pages .page_next a, .pages .page_prev a {
    display: block;
    padding: 10px 20px;
    background-color: #fff;
    font-size: 13px
  }
  
  .pages .page_next {
    float: left
  }
  
  .pages .page_prev {
    float: right
  }
  
  .blog-page-detail {
    display: flex;
    align-items: center;
    font-size: 12px;
    margin-bottom: 20px
  }
  
  .blog-page-detail .blog-date2 {
    display: inline-block;
    color: #4eacd8;
    margin-right: 10px
  }
  
  .blog-page-detail .blog-date2:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px
  }
  
  .blog-page-detail .blog-category {
    background: url(../img/paper01.jpg);
    margin-right: 5px
  }
  
  .category_nav {
    border: 1px solid #ddd
  }
  
  .category_nav li a {
    display: block;
    padding: 15px;
    border-bottom: 1px dotted #ddd;
    background-color: #fff
  }
  
  .category_nav li a:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px
  }
  
  .category_nav li a:hover {
    background: #f3f6f5
  }
  
  .category_nav li:last-child a {
    border-bottom: none
  }
  
  .blog-title {
    line-height: 1.5;
    font-size: 1.5rem;
    letter-spacing: .1rem;
    font-weight: 600
  }
  
  @media screen and (max-width: 639px) {
    .blog-title {
      font-size: 1.2rem
    }
  }
  
  .blog-date {
    display: inline-block;
    color: #0e1a43;
    font-size: 1.2rem
  }
  
  .blog-date:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px
  }
  
  @media screen and (max-width: 639px) {
    .blog-date {
      font-size: 12px
    }
  }
  
  .top-blog {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -50px;
    z-index: 20;
    max-width: 1000px;
    width: 90%;
    padding: 25px;
    background: #fff;
    box-shadow: rgba(100, 100, 111, .2) 0px 7px 29px 0px
  }
  
  .top-blog .inner {
    position: relative;
    z-index: 2;
    min-height: 60px
  }
  
  .top-blog .pages {
    display: none
  }
  
  @media screen and (max-width: 1101px) {
    .top-blog {
      max-width: 90%;
      width: 90%
    }
  }
  
  @media screen and (max-width: 639px) {
    .top-blog {
      bottom: -90px;
      padding: 10px
    }
  }
  
  .top-blog-common {
    overflow: visible !important;
    display: flex;
    position: relative;
    padding-bottom: 50px !important
  }
  
  .top-blog-common .swiper-slide {
    overflow: hidden;
    width: 30rem;
    border-radius: 15px;
    background: #f6f6f6;
    display: block;
    height: auto
  }
  
  @media screen and (max-width: 639px) {
    .top-blog-common .swiper-slide {
      width: 20rem
    }
  }
  
  .top-blog-common .swiper-controller {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    position: absolute;
    left: 10px;
    bottom: -20px
  }
  
  .top-blog-common .swiper-button-prev, .top-blog-common .swiper-button-next {
    display: grid;
    place-content: center;
    width: 4rem;
    height: 4rem;
    cursor: pointer;
    transition: .8s cubic-bezier(0.2, 1, 0.2, 1)
  }
  
  .top-blog-common .swiper-button-prev {
    margin-right: 40px !important
  }
  
  .top-blog-common .swiper-button-prev::before, .top-blog-common .swiper-button-next::before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    content: "";
    border-radius: 50%;
    background: #fefefe;
    box-shadow: .6rem .6rem 1rem rgba(73, 45, 24, .05), -0.6rem -0.6rem 1rem #24487a
  }
  
  .top-blog-common .swiper-button-prev::after, .top-blog-common .swiper-button-next::after {
    width: 1.2rem;
    height: 1.2rem;
    content: "";
    border: solid #4eacd8;
    border-width: 3px 3px 0 0
  }
  
  .top-blog-common .swiper-button-prev::after {
    margin-left: .4rem;
    transform: rotate(-135deg)
  }
  
  .top-blog-common .swiper-button-next::after {
    margin-right: .4rem;
    transform: rotate(45deg)
  }
  
  .top-blog-common .swiper-button-disabled {
    pointer-events: none;
    opacity: 0
  }
  
  .top-blog-common .swiper-button-prev, .top-blog-common .swiper-button-next {
    position: relative;
    flex-shrink: 0;
    margin: 0
  }
  
  .top-blog-common .swiper-button-disabled {
    pointer-events: none;
    opacity: .5
  }
  
  .top-blog-common .swiper-button-disabled::before {
    box-shadow: inset .6rem .6rem 1rem rgba(73, 45, 24, .05), inset -0.6rem -0.6rem 1rem #24487a
  }
  
  .blog-card {
    height: 100%;
    display: block;
    position: relative
  }
  
  .blog-card:before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 5px;
    height: 3px;
    background: #4eacd8;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .blog-card:hover:before {
    width: 100%
  }
  
  .blog-card figure {
    padding-top: 60%;
    position: relative
  }
  
  .blog-card figure img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover
  }
  
  .blog-card .content {
    padding: .8em 1.2em 1em
  }
  
  .btn-more {
    margin-top: 20px;
    position: relative;
    z-index: 4
  }
  
  .btn-more a {
    display: block;
    width: 16em;
    text-align: center;
    font-weight: 600;
    font-size: 1.4rem;
    color: #fff;
    padding: 8px 10px;
    background: #24487a;
    border-radius: 40px;
    margin-left: auto;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .btn-more a:after {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-left: 4px;
    display: inline-block;
    position: relative;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .btn-more a:hover {
    background: #0e1a43
  }
  
  .btn-more a:hover:after {
    transform: translateX(4px)
  }
  
  @media screen and (max-width: 639px) {
    .btn-more {
      margin-right: 10px
    }
    .btn-more a {
      font-size: 13px
    }
  }
  
  .job-list-wrap>li:not(:last-of-type) {
    margin-bottom: 20px
  }
  
  .job-list-wrap>li a {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background: #fff;
    width: 100%;
    height: 100%;
    padding: 15px 20px;
    z-index: 3
  }
  
  .job-list-wrap>li a:hover .morebtn {
    border-bottom-color: #24ddf6;
    color: #24ddf6
  }
  
  .job-list-wrap>li a:hover .job-img img {
    transform: scale(1.2)
  }
  
  @media screen and (max-width: 639px) {
    .job-list-wrap>li a {
      padding: 12px 15px
    }
  }
  
  .job-list-wrap>li .job-img {
    width: 100px;
    height: 100px;
    overflow: hidden
  }
  
  .job-list-wrap>li .job-img img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: .2s ease-in all
  }
  
  @media screen and (max-width: 639px) {
    .job-list-wrap>li .job-img {
      width: 70px;
      height: 70px
    }
  }
  
  .job-list-wrap>li .job-detail {
    width: 100%
  }
  
  .job-list-wrap>li .job-title {
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 1.5rem;
    color: #4eacd8;
    letter-spacing: .1rem
  }
  
  @media screen and (max-width: 639px) {
    .job-list-wrap>li .job-title {
      font-size: 1.2rem
    }
  }
  
  .job-list-wrap>li .job-txt {
    font-size: 1.4rem;
    margin-top: 8px;
    letter-spacing: 0;
    margin-bottom: 15px;
    font-weight: 600;
    color: #222;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1.8em;
    max-height: 3.6em;
    overflow: hidden
  }
  
  @media screen and (max-width: 639px) {
    .job-list-wrap>li .job-txt {
      font-size: 12px;
      margin-bottom: 25px
    }
  }
  
  .job-list-wrap>li .naiyou {
    background: #24ddf6;
    font-size: 12px;
    padding: 0px 4px;
    display: inline-block;
    margin-right: 5px;
    color: #fff
  }
  
  .job-list-wrap>li .morebtn {
    position: absolute;
    right: 10px;
    bottom: 0;
    color: #4eacd8;
    border-bottom: 3px solid #4eacd8;
    font-size: 12px;
    font-weight: 600;
    padding: 0 10px;
    transition: .2s ease-in all;
    letter-spacing: 0
  }
  
  .job-upper {
    flex-basis: 100%;
    margin-bottom: 10px
  }
  
  .job-upper .job-date {
    display: inline-block;
    color: #24487a;
    border-bottom: 2px solid #0e1a43;
    font-weight: 600;
    font-size: 1.3rem
  }
  
  .job-upper .job-date:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px
  }
  
  @media screen and (max-width: 639px) {
    .job-upper .job-date {
      font-size: 12px
    }
  }
  
  .job-upper .job-category {
    font-size: 12px;
    color: #111;
    display: inline-block;
    margin-left: 3px;
    background: #f3f6f5;
    font-weight: 600
  }
  
  .cut {
    overflow: hidden;
    zoom: 1
  }
  
  .w300 {
    width: 300px
  }
  
  .spbr {
    display: none
  }
  
  @media screen and (min-width: 639px) {
    .sp {
      display: none
    }
  }
  
  @media screen and (max-width: 639px) {
    .pc {
      display: none
    }
  }
  
  .color1 {
    color: #4eacd8
  }
  
  .color2 {
    color: #0e1a43
  }
  
  .color3 {
    color: #cf5ea2
  }
  
  .relative {
    position: relative
  }
  
  .num {
    font-weight: 600
  }
  
  .num a {
    color: #4eacd8;
    font-size: 2.8rem;
    text-align: center;
    margin-left: 5px
  }
  
  @media screen and (max-width: 639px) {
    .num a {
      font-size: 2rem
    }
  }
  
  .num a:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px
  }
  
  .num a:hover {
    color: #cf5ea2
  }
  
  .telbox {
    max-width: 600px;
    margin: 0 auto 20px;
    padding: 20px;
    background: #333;
    text-align: center
  }
  
  .telbox .inner {
    background: #fff;
    padding: 10px
  }
  
  .txt-link {
    font-weight: 600;
    text-decoration: underline;
    font-weight: 600
  }
  
  .txt-link:hover {
    text-decoration: none
  }
  
  .txt-link.map:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 4px
  }
  
  .telbnr {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 30px auto 30px
  }
  
  .telbnr li {
    width: 47%;
    border: 3px solid #24ddf6;
    padding: 10px 10px;
    text-align: center;
    border-radius: 50px
  }
  
  .telbnr li.telbnr-mail a {
    font-size: 2rem;
    padding-top: 5px
  }
  
  .telbnr li.telbnr-mail a:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900
  }
  
  @media screen and (max-width: 639px) {
    .telbnr li.telbnr-mail a {
      font-size: 1.4rem;
      padding: 0
    }
  }
  
  .telbnr li a {
    display: block;
    font-size: 2.4rem;
    font-weight: 600;
    color: #4eacd8
  }
  
  .telbnr li a:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px
  }
  
  .telbnr li a:hover {
    color: #4eacd8
  }
  
  @media screen and (max-width: 639px) {
    .telbnr {
      max-width: 90%
    }
    .telbnr li {
      width: 100%;
      margin: 0 auto 30px
    }
    .telbnr li a {
      font-size: 2rem
    }
  }
  
  .telbnr-ttl {
    font-weight: 600;
    font-size: 1.6rem;
    color: #333;
    margin-top: -30px
  }
  
  .telbnr-ttl span {
    background: #fff;
    padding: 0 20px
  }
  
  @media screen and (max-width: 639px) {
    .telbnr-ttl {
      font-size: 1.3rem
    }
  }
  
  .breadcrumb {
    max-width: 1100px;
    margin: 0 auto;
    font-size: 13px;
    padding: 15px 10px
  }
  
  .breadcrumb li {
    display: inline;
    color: #492d18
  }
  
  .breadcrumb li a {
    color: #0e1a43
  }
  
  .breadcrumb li+li:before {
    margin: 0 10px;
    content: "/"
  }
  
  @media screen and (max-width: 639px) {
    .breadcrumb {
      font-size: 12px
    }
  }
  
  .pass_submit {
    border: 0;
    border-radius: 0;
    color: inherit;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-size: 1em;
    line-height: 1.2;
    padding: .5em var(--padding-x);
    border-width: 2px;
    border-style: solid;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    --padding-x: 1.2em;
    border-color: rgba(0, 0, 0, 0);
    background: #0e1a43;
    color: #fff;
    font-weight: 600
  }
  
  @media screen and (max-width: 639px) {
    .pass_submit {
      margin-top: 20px
    }
  }
  
  .textarea, textarea {
    border: 0;
    padding: 15px;
    width: 100%;
    border-radius: 0;
    -webkit-appearance: none;
    background: #fefefe
  }
  
  .textarea02 {
    width: 48.5%;
    margin-right: 3%
  }
  
  .textarea02:last-child {
    margin-right: 0
  }
  
  .textarea03 {
    width: 20%;
    margin-right: 1%
  }
  
  .textarea04 {
    width: 300px;
    margin-right: 1%
  }
  
  .form {
    margin: 0 auto;
    width: 100%
  }
  
  .form dl dt {
    float: left;
    width: 260px;
    padding-top: 20px;
    font-weight: 600
  }
  
  .form dl dt span {
    color: #fff;
    background: #4eacd8;
    padding: 5px 8px;
    margin-right: 5px;
    font-size: 11px;
    border-radius: 20px;
    position: relative;
    top: -2px
  }
  
  .form dl dt span.nini {
    background: #ffd803;
    color: #492d18
  }
  
  .form dl dd {
    padding-left: 260px;
    padding-bottom: 20px;
    padding-top: 23px;
    line-height: 1.5;
    border-bottom: 1px dotted #ddd
  }
  
  .form dl dd:last-child {
    border-bottom: none
  }
  
  .form button {
    cursor: pointer;
    display: block;
    color: #fff;
    text-align: center;
    transition: all .2s ease-in-out;
    border: 1px solid #4eacd8;
    font-weight: 600;
    padding: 12px 5px;
    margin: 0 auto;
    width: 250px;
    background: #4eacd8;
    border-radius: 25px
  }
  
  .form button:hover {
    background: #fff;
    color: #4eacd8
  }
  
  .form button:before {
    font-weight: normal;
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 10px
  }
  
  .form .select-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center
  }
  
  .form .select-group p {
    margin: 0 5px
  }
  
  @media screen and (max-width: 639px) {
    .form .select-group .select-wrap {
      margin-top: 8px
    }
  }
  
  .form .select-wrap {
    position: relative;
    overflow: hidden;
    display: inline-block;
    min-width: 192px;
    min-width: 12em;
    background-color: #fff;
    border: 1px solid #ddd;
    color: #333
  }
  
  .form .select-wrap select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: relative;
    z-index: 2;
    display: block;
    width: 200%;
    width: -webkit-calc(100% + 5em);
    margin: 0;
    padding: 11px 35px 11px 11px;
    padding: .6875rem 2.1875rem .6875rem .6875rem;
    background: rgba(0, 0, 0, 0);
    border: 0;
    outline: none;
    line-height: 1.5
  }
  
  .form .entypo-down-open-mini:before {
    font-family: "FontAwesome";
    content: "";
    position: absolute;
    z-index: 1;
    top: 50%;
    right: 12px;
    right: .75rem;
    margin-top: -8px;
    margin-top: -0.5rem;
    font-size: 16px;
    font-size: 1rem;
    line-height: 1;
    color: #4eacd8
  }
  
  .form label.radio_text {
    cursor: pointer;
    position: relative;
    margin-right: 20px;
    overflow: hidden;
    padding-left: 20px;
    display: inline-block
  }
  
  .form label.radio_text:before {
    position: absolute;
    width: 15px;
    height: 15px;
    border: 1px solid #ccc;
    border-radius: 50%;
    left: 0px;
    top: 2px;
    content: "";
    z-index: 3
  }
  
  .form label.radio_text:after {
    content: "";
    position: absolute;
    width: 11px;
    height: 11px;
    border-radius: 100%;
    left: 2px;
    top: 4px;
    background-color: #4eacd8;
    z-index: 1
  }
  
  .form label.radio_text input[type=radio] {
    -moz-appearance: none;
    -webkit-appearance: none;
    position: absolute;
    z-index: 2;
    width: 20px;
    height: 20px;
    left: -23px;
    top: 0px;
    margin: 0px;
    box-shadow: 20px -1px #fff
  }
  
  .form label.radio_text input[type=radio]:checked {
    box-shadow: none
  }
  
  .form label.radio_text input[type=radio]:focus {
    opacity: .2;
    box-shadow: 20px -1px #eeebda
  }
  
  .form label.checkbox_text {
    cursor: pointer;
    position: relative;
    padding-left: 25px;
    margin: 0 20px 5px 0;
    overflow: hidden;
    display: inline-block
  }
  
  .form label.checkbox_text:before {
    content: "";
    position: absolute;
    width: 18px;
    height: 18px;
    left: 0px;
    top: 0;
    border: 1px solid #ccc;
    z-index: 3;
    padding: 1px
  }
  
  .form label.checkbox_text:after {
    content: "";
    position: absolute;
    top: 40%;
    left: 5px;
    display: block;
    margin-top: -9px;
    width: 8px;
    height: 12px;
    border-right: 3px solid #4eacd8;
    border-bottom: 3px solid #4eacd8;
    transform: rotate(45deg);
    z-index: 1
  }
  
  .form label.checkbox_text input[type=checkbox] {
    -moz-appearance: none;
    -webkit-appearance: none;
    position: absolute;
    left: -40px;
    width: 20px;
    height: 20px;
    display: block;
    box-shadow: 41px 0px #fff;
    z-index: 2;
    margin: 0px;
    padding: 0px
  }
  
  .form label.checkbox_text input[type=checkbox]:checked {
    box-shadow: none
  }
  
  .form label.checkbox_text input[type=checkbox]:checked:focus {
    box-shadow: 40px 0px #666;
    opacity: .1
  }
  
  .form label.checkbox_text input[type=checkbox]:focus {
    box-shadow: 41px 0px #eee
  }
  
  input[type=text], textarea, .textarea {
    font-size: 16px
  }
  
  @media screen and (max-width: 639px) {
    input[type=text], textarea, .textarea {
      transform: scale(0.9);
      margin-left: -5px
    }
  }
  
  .fm-txt {
    font-size: 1.4rem;
    background: rgba(255, 255, 255, .5);
    padding: 5px
  }
  
  .thanks {
    max-width: 700px;
    margin: 0 auto
  }
  
  @media screen and (max-width: 639px) {
    .thanks {
      max-width: 90%;
      padding: 30px 20px
    }
  }
  
  .shadow {
    box-shadow: 0 0 10px rgba(0, 0, 0, .15)
  }
  
  .shadow2 {
    box-shadow: rgba(0, 0, 0, .2) 0px 18px 50px -10px
  }
  
  .policy {
    padding: 30px;
    background: rgba(255, 255, 255, .5);
    font-size: 1.4rem;
    letter-spacing: 0
  }
  
  .policy .inner {
    padding-right: 40px
  }
  
  @media screen and (max-width: 639px) {
    .policy {
      font-size: 1.15rem
    }
    .policy .inner {
      padding-right: 15px
    }
  }
  
  .mtitle_small {
    position: relative;
    font-size: 1.7rem;
    margin-bottom: 15px;
    color: #4eacd8;
    font-weight: 600;
    padding-bottom: 8px;
    border-bottom: 1px solid #ccc
  }
  
  .mtitle_small:before {
    content: "";
    width: 50px;
    height: 1px;
    background-color: #4eacd8;
    position: absolute;
    left: 0;
    bottom: -1px
  }
  
  @media screen and (max-width: 639px) {
    .mtitle_small {
      font-size: 1.4rem;
      line-height: 1.5
    }
  }
  
  .mtitle_small2 {
    position: relative;
    margin-bottom: 10px;
    padding-left: 20px
  }
  
  .mtitle_small2:before {
    content: "";
    background-color: #4eacd8;
    width: 10px;
    height: 4px;
    position: absolute;
    top: .6em;
    left: 0
  }
  
  .contact-caution-box {
    margin: 40px -30px -35px;
    padding: 25px;
    background: #e5eec5;
    border: 4px solid rgba(53, 106, 9, .5);
    border-radius: 0 0 20px 20px;
    position: relative
  }
  
  .contact-caution-box:before {
    position: absolute;
    left: -4px;
    top: -5px;
    content: "Notice";
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    color: rgba(53, 106, 9, .2);
    font-size: 3em;
    line-height: 1
  }
  
  .contact-caution-box .inner {
    max-width: 600px;
    margin-inline: auto;
    z-index: 2
  }
  
  @media screen and (max-width: 1101px) {
    .contact-caution-box {
      margin-inline: -2em
    }
  }
  
  @media screen and (max-width: 639px) {
    .contact-caution-box {
      margin: 40px -15px -20px
    }
  }
  
  .thanks-box.mbox {
    padding: 60px 0
  }
  
  .gallery_ul {
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
    margin-left: -2%;
    margin-bottom: -4%
  }
  
  @media screen and (max-width: 639px) {
    .gallery_ul {
      margin-left: auto;
      margin-right: auto
    }
  }
  
  .gallery_ul>li {
    width: 31.33%;
    margin-left: 2%;
    margin-bottom: 4%;
    font-weight: 600
  }
  
  .gallery_ul>li .photobox-wrap {
    width: 100%;
    height: 220px;
    text-align: center;
    overflow: hidden;
    background: #aaa;
    margin-bottom: 10px
  }
  
  .gallery_ul>li .photobox-wrap img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    font-family: "object-fit:contain;";
    -o-object-position: 50% 50%;
    object-position: 50% 50%
  }
  
  @media screen and (max-width: 1025px) {
    .gallery_ul>li {
      width: 48%
    }
  }
  
  @media screen and (max-width: 639px) {
    .gallery_ul>li {
      width: 85%;
      margin: 0 auto 30px
    }
    .gallery_ul>li .photobox-wrap {
      height: 180px
    }
  }
  
  .comment {
    font-size: 1.4rem;
    letter-spacing: 0;
    padding: 0 5px
  }
  
  @media screen and (max-width: 639px) {
    .comment {
      font-size: 12px
    }
  }
  
  .gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px 3%
  }
  
  @media screen and (max-width: 639px) {
    .gallery {
      grid-template-columns: repeat(2, 1fr)
    }
  }
  
  .gallery li a {
    background: rgba(245, 243, 235, .2);
    display: block;
    text-align: center;
    padding: 0px;
    height: 240px
  }
  
  .gallery li a img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    font-family: "object-fit: cover;"
  }
  
  .gallery li p {
    font-size: 14px;
    margin: 3px 0 10px
  }
  
  @media screen and (max-width: 1025px) {
    .gallery li a {
      height: 120px
    }
    .gallery li p {
      font-size: 12px
    }
  }
  
  .list2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px 4%
  }
  
  @media screen and (max-width: 639px) {
    .list2 {
      grid-template-columns: 1fr
    }
  }
  
  .list2.type1>li, .list2.type1 .child {
    background: #fefefe;
    padding: 15px
  }
  
  .list2>li, .list2 .child {
    position: relative
  }
  
  .list2>li.child-100, .list2 .child.child-100 {
    grid-column: 2fr
  }
  
  .business-img img {
    box-shadow: 3px 3px rgba(78, 172, 216, .2) !important
  }
  
  .list3 {
    display: grid;
    grid-template-columns: 1fr
  }
  
  @media screen and (min-width: 820px) {
    .list3 {
      grid-template-columns: repeat(3, 1fr);
      gap: 35px 3%
    }
  }
  
  .list3.type1 li, .list3.type1 .child {
    background: #fefefe;
    padding: 15px;
    border-radius: 8px;
    line-height: 1.6;
    font-size: 1.1em
  }
  
  @media screen and (max-width: 639px) {
    .list3.type1 li, .list3.type1 .child {
      padding: 20px 10px 10px
    }
  }
  
  .list3 li {
    position: relative
  }
  
  @media screen and (max-width: 639px) {
    .list3 {
      width: 95%;
      margin-left: auto;
      margin-right: auto;
      gap: 25px 0
    }
  }
  
  .list4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 35px 2%
  }
  
  @media screen and (max-width: 639px) {
    .list4 {
      grid-template-columns: 1fr
    }
  }
  
  @media screen and (max-width: 639px) {
    .list4.sp-column2 {
      grid-template-columns: repeat(2, 1fr)
    }
  }
  
  .type-flow {
    position: relative
  }
  
  .type-flow li {
    position: relative;
    padding: 20px;
    font-size: 1.5rem
  }
  
  .type-flow li:before {
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 30px);
    background: rgba(14, 26, 67, .1);
    border-radius: 0 0 20px 20px;
    z-index: -1
  }
  
  .prv dt {
    color: #4eacd8;
    border-bottom: 1px solid #ccc;
    margin: 10px 0
  }
  
  #works:before {
    content: "";
    height: 80px;
    margin-top: -80px;
    display: block;
    visibility: hidden
  }
  
  .note {
    padding: 15px;
    margin-top: 10px;
    background: #f5f3eb;
    font-size: 1.4rem
  }
  
  @media screen and (max-width: 639px) {
    .note {
      font-size: 1.2rem
    }
  }
  
  .flow-dl .flow-inner {
    padding: 8px
  }
  
  .flow-dl .flow-inner:not(:last-of-type) {
    margin-bottom: 5px;
    border-bottom: solid 1px #aaa
  }
  
  .flow-dl .flow-inner dt {
    font-size: 1.6rem;
    font-weight: 600;
    color: #0e1a43
  }
  
  .flow-dl .flow-inner dt .eng {
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 2.5rem;
    color: #24ddf6;
    margin-right: 8px
  }
  
  .flow-dl .flow-inner dd {
    margin-top: 5px;
    padding-left: 40px
  }
  
  @media screen and (max-width: 639px) {
    .flow-dl .flow-inner {
      padding: 6px
    }
    .flow-dl .flow-inner dt {
      font-size: 1.25rem
    }
    .flow-dl .flow-inner dt .eng {
      font-size: 1.7rem
    }
    .flow-dl .flow-inner dd {
      padding-left: 30px
    }
  }
  
  .txt1 {
    font-size: 1.4rem;
    letter-spacing: 0
  }
  
  @media screen and (max-width: 639px) {
    .txt1 {
      font-size: 1.2rem
    }
  }
  
  .fee-box {
    margin: 10px 0 20px;
    font-weight: 600;
    background: #fffacd;
    padding: 5px
  }
  
  .fee-box span {
    display: block;
    font-weight: normal
  }
  
  .blog-month {
    margin-bottom: 10px
  }
  
  .blog-month ul {
    display: flex;
    flex-wrap: wrap
  }
  
  .blog-month ul li {
    width: 49%;
    padding: 5px 0;
    margin-bottom: 5px;
    text-align: center;
    letter-spacing: 0
  }
  
  .blog-month ul li:nth-child(2n) {
    margin-left: 2%
  }
  
  .blog-month ul li a {
    color: #0e1a43;
    font-weight: 600;
    border-bottom: 1px solid #24487a;
    font-size: 12px
  }
  
  .blog-month ul li a:hover {
    color: #24487a
  }
  
  #a01, #a02, #a03, #a04, #a05, #a06, #a07, #a08, #a09, #a10, #a11, #a12, #contact, .anchor {
    display: block;
    padding-top: 100px;
    margin-top: -100px
  }
  
  @media screen and (max-width: 639px) {
    #a01, #a02, #a03, #a04, #a05, #a06, #a07, #a08, #a09, #a10, #a11, #a12, #contact, .anchor {
      padding-top: 0;
      margin-top: 0
    }
  }
  
  .list-center {
    display: flex;
    flex-wrap: wrap;
    justify-content: center
  }
  
  .list-center.type-3 li {
    width: 30%;
    margin: 1%
  }
  
  @media screen and (max-width: 639px) {
    .list-center.type-3 {
      flex-direction: column
    }
    .list-center.type-3 li {
      width: 100%
    }
  }
  
  .list-center li {
    width: 50%
  }
  
  @media screen and (max-width: 639px) {
    .list-center {
      flex-direction: column
    }
    .list-center li {
      width: 100%
    }
  }
  
  .faq-dl .faq-inner {
    padding: 10px;
    margin-bottom: 20px
  }
  
  .faq-dl .faq-inner:not(:last-of-type) {
    margin-bottom: 35px;
    padding-bottom: 20px;
    border-bottom: 3px solid #eee
  }
  
  .faq-dl .faq-inner dt, .faq-dl .faq-inner dd {
    position: relative;
    padding: 10px 10px 10px 65px
  }
  
  .faq-dl .faq-inner dt:before, .faq-dl .faq-inner dd:before {
    position: absolute;
    content: "";
    width: 45px;
    height: 45px;
    line-height: 45px;
    text-align: center;
    left: 0;
    top: 0;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal
  }
  
  .faq-dl .faq-inner dt {
    font-weight: 600;
    color: #0e1a43
  }
  
  .faq-dl .faq-inner dt:before {
    content: "Q";
    color: #fff;
    font-size: 3rem;
    background: #24487a
  }
  
  .faq-dl .faq-inner dd:before {
    content: "A";
    color: #920202;
    font-size: 3rem;
    background: rgba(255, 216, 3, .2)
  }
  
  .point-title {
    font-weight: 600;
    font-size: 1.8rem
  }
  
  @media screen and (max-width: 639px) {
    .point-title {
      font-size: 1.4rem
    }
  }
  
  .works-list>li {
    padding: 15px 20px;
    border-top: 2px solid #333;
    font-weight: 600
  }
  
  .works-list>li:before {
    content: "●";
    margin-right: 5px;
    color: #0e1a43
  }
  
  .works-list>li:last-child {
    border-bottom: 2px solid #222
  }
  
  .swiper-button-prev, .swiper-container-rtl .swiper-button-next {
    left: 0px !important;
    right: auto;
    border-radius: 50%;
    box-shadow: rgba(78, 172, 216, .1) 0px 7px 12px 0px
  }
  
  .swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    right: 0px !important;
    left: auto;
    box-shadow: rgba(78, 172, 216, .1) 0px 7px 12px 0px;
    border-radius: 50%
  }
  
  @media screen and (max-width: 639px) {
    .swiper-button-next, .swiper-button-prev {
      width: 17px !important;
      height: 28px !important;
      background-size: 17px 28px !important
    }
  }
  
  .point-num {
    position: relative;
    z-index: 2;
    line-height: 1;
    color: #4eacd8;
    font-family: "Lato", sans-serif;
    font-weight: 700;
    font-size: 3.6rem;
    text-align: center;
    margin: 0 auto 10px
  }
  
  @media screen and (max-width: 639px) {
    .point-num {
      font-size: 2.6rem;
      margin: -30px auto 10px
    }
  }
  
  .point-num.type1 {
    margin-top: 0;
    background: #fff;
    padding: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, .15);
    border-radius: 0 0 15px 0
  }
  
  .point-num.type1:first-letter {
    color: #356a09
  }
  
  .point-num.type1 .ja {
    display: block;
    font-size: 2rem;
    font-family: "Noto Sans JP", "YakuHanJP", Lato, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    line-height: 1.6;
    font-weight: 600;
    color: #333
  }
  
  @media screen and (max-width: 639px) {
    .point-num.type1 .ja {
      font-size: 1.5rem
    }
  }
  
  .bnr-list {
    text-align: center
  }
  
  @media screen and (max-width: 1025px) {
    .bnr-list li {
      width: 48%;
      margin-right: 4%
    }
    .bnr-list li:nth-child(2n) {
      margin-right: 0
    }
  }
  
  .bnr-list a {
    display: block;
    text-align: center;
    background: #fefefe;
    padding: 8px 5px;
    font-size: 1.3rem;
    height: 100%
  }
  
  .bnr-list a img {
    width: auto;
    max-width: 100%;
    margin: 0 auto;
    height: 45px
  }
  
  @media screen and (max-width: 639px) {
    .bnr-list a {
      font-size: 12px;
      line-height: 1.5
    }
    .bnr-list a img {
      height: 30px
    }
  }
  
  .bnr-list li.bnr-txt {
    font-size: 2rem;
    font-weight: 600;
    line-height: 60px;
    background: #fefefe
  }
  
  @media screen and (max-width: 639px) {
    .bnr-list li.bnr-txt {
      font-size: 1.5rem
    }
  }
  
  .sns-list {
    display: flex
  }
  
  .sns-list.center {
    justify-content: center;
    margin: 15px 0
  }
  
  @media screen and (max-width: 1025px) {
    .sns-list.center2 {
      justify-content: center
    }
  }
  
  .sns-list.type-white li a {
    width: 40px;
    height: 40px;
    background: rgba(0, 0, 0, 0);
    border: 1px solid rgba(255, 255, 255, .5)
  }
  
  .sns-list li a {
    width: 45px;
    height: 45px;
    line-height: 45px;
    font-size: 18px;
    color: #fefefe;
    display: block;
    background: #4eacd8;
    border-radius: 100%;
    text-align: center;
    transition: all .2s ease-in;
    position: relative;
    font-weight: 600;
    padding-left: 1px
  }
  
  .sns-list li a:hover {
    opacity: .7
  }
  
  .sns-list li a.btn-facebook {
    background: #1877f2
  }
  
  .sns-list li a.btn-twitter {
    background: #1da1f2
  }
  
  .sns-list li a.btn-line {
    background: #06c755;
    line-height: 1;
    padding-top: 8px
  }
  
  .sns-list li a.btn-line img {
    width: 18px
  }
  
  .sns-list li a.btn-youtube {
    background: #c4302b
  }
  
  .sns-list li a.btn-instagram {
    overflow: hidden;
    background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat
  }
  
  .sns-list li a.btn-instagram i {
    position: relative;
    z-index: 2
  }
  
  .sns-list li a.btn-instagram:before {
    content: "";
    position: absolute;
    top: 18px;
    left: -10px;
    width: 50px;
    height: 50px;
    background: radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%)
  }
  
  .sns-list li:not(:last-child) {
    margin-right: 10px
  }
  
  @media screen and (max-width: 1025px) {
    .sns-list li:not(:last-child) {
      margin-right: 5px;
      margin-bottom: 0
    }
  }
  
  .txt-size_big {
    font-size: 4rem
  }
  
  @media screen and (max-width: 639px) {
    .txt-size_big {
      font-size: 2.2rem
    }
  }
  
  .title01 {
    font-weight: 600;
    color: #4eacd8;
    font-size: 3.2rem;
    margin-bottom: 1.5em
  }
  
  @media screen and (max-width: 639px) {
    .title01 {
      font-size: 1.5em
    }
  }
  
  .title02 {
    text-align: center;
    margin-bottom: 20px
  }
  
  .title02 span {
    display: inline-block;
    font-size: 2.2rem;
    border-bottom: 2px solid #333
  }
  
  @media screen and (max-width: 639px) {
    .title02 span {
      font-size: 1.5rem
    }
  }
  
  .title03 span {
    background: #0e1a43;
    padding: 2px 5px;
    font-weight: 600;
    color: #fff
  }
  
  @media screen and (max-width: 639px) {
    .title03 span {
      font-size: 1.1rem
    }
  }
  
  .title03.type1 span {
    background: #cf5ea2
  }
  
  .title03.type2 span {
    background: #356a09
  }
  
  .title04 {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    flex-wrap: wrap;
    font-weight: 600;
    font-size: 1.7rem
  }
  
  .title04.type-center {
    justify-content: center
  }
  
  .title04 .sub {
    color: #4eacd8;
    padding-right: 10px;
    border-right: 1px solid #4eacd8;
    margin-right: 10px
  }
  
  .title04 .main {
    font-size: 1.1em
  }
  
  @media screen and (max-width: 639px) {
    .title04 {
      font-size: 1.3rem
    }
  }
  
  .fb-wrap {
    min-height: 400px;
    text-align: center;
    margin: 0 auto
  }
  
  .box1 {
    position: relative;
    z-index: 4;
    margin-inline: auto;
    background: #fff;
    padding: 25px
  }
  
  @media screen and (max-width: 639px) {
    .box1 {
      padding: 20px 15px
    }
  }
  
  .box1.type1 {
    margin-top: -40px;
    max-width: 700px
  }
  
  @media screen and (max-width: 639px) {
    .box1.type1 {
      max-width: 90%
    }
  }
  
  .box2 {
    font-weight: 600;
    margin-top: 30px;
    background: rgba(14, 26, 67, .6);
    padding: 20px;
    color: #fff
  }
  
  .content-head {
    padding: 120px 20px;
    background: url(../img/content-head01.jpg) no-repeat right center/cover;
    display: flex;
    align-items: center;
    margin-bottom: 50px
  }
  
  @media screen and (max-width: 639px) {
    .content-head {
      padding: 50px 15px
    }
  }
  
  .content-txt {
    position: relative;
    max-width: 500px;
    background: rgba(252, 252, 252, .7);
    padding: 30px;
    text-align: center;
    box-shadow: 0 0 15px rgab(#000, 0.1)
  }
  
  @media screen and (max-width: 639px) {
    .content-txt {
      padding: 20px
    }
  }
  
  .slide_list {
    position: relative;
    display: none
  }
  
  .slide_list li {
    margin-right: 1%
  }
  
  .slide_list li img {
    width: auto;
    height: 240px;
    transition: filter .2s ease-in
  }
  
  .slide_list li:hover img {
    filter: grayscale(0)
  }
  
  @media screen and (max-width: 639px) {
    .slide_list li {
      margin-right: 4%
    }
    .slide_list li img {
      height: 200px
    }
  }
  
  .flow-list {
    display: flex;
    flex-wrap: wrap;
    position: relative
  }
  
  .flow-list.type1 {
    display: block
  }
  
  .flow-list.type1>li {
    width: 90%
  }
  
  .flow-list.type1>li:nth-child(2) {
    margin-left: 2%
  }
  
  .flow-list.type1>li:nth-child(3) {
    margin-left: 4%
  }
  
  .flow-list.type1>li:nth-child(4) {
    margin-left: 6%
  }
  
  .flow-list.type1>li:nth-child(5) {
    margin-left: 8%
  }
  
  .flow-list.type1>li .flow-title {
    margin-bottom: 10px
  }
  
  @media screen and (max-width: 639px) {
    .flow-list.type1>li {
      width: 100%
    }
    .flow-list.type1>li:nth-child(2), .flow-list.type1>li:nth-child(3), .flow-list.type1>li:nth-child(4), .flow-list.type1>li:nth-child(5) {
      margin-left: 0
    }
  }
  
  .flow-list>li {
    width: 48%;
    margin-right: 4%;
    margin-bottom: 30px;
    padding: 25px;
    display: flex;
    flex-wrap: wrap;
    background: #fefefe;
    border-radius: 10px;
    box-shadow: 0 0 15px rgba(73, 45, 24, .05);
    font-weight: 600
  }
  
  .flow-list>li.type100 {
    flex-basis: 100%;
    margin-right: 0
  }
  
  .flow-list>li:nth-child(2n) {
    margin-right: 0
  }
  
  @media screen and (max-width: 639px) {
    .flow-list>li {
      width: 90%;
      margin: 0 auto 30px
    }
    .flow-list>li:nth-child(2n) {
      margin-right: auto
    }
  }
  
  .flow-list>li .flow-num {
    color: #cf5ea2;
    font-size: 3.5rem;
    border-right: 1px solid #4eacd8;
    padding-right: 15px;
    align-self: flex-start;
    line-height: 1.2;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal
  }
  
  .flow-list>li .flow-num span {
    font-size: 1.3rem;
    display: block;
    text-align: center
  }
  
  .flow-list>li .txt {
    flex: 1;
    margin-left: 35px
  }
  
  .flow-list>li .flow-title {
    color: #4eacd8;
    border-bottom: 1px solid #4eacd8;
    padding-bottom: 4px;
    font-weight: 600;
    font-size: 1.8rem;
    letter-spacing: .2rem
  }
  
  @media screen and (max-width: 639px) {
    .flow-list>li {
      flex-direction: column
    }
    .flow-list>li .flow-num {
      font-size: 2.2rem;
      text-align: center;
      border-right: 0;
      padding: 0 0 4px;
      border-bottom: 1px solid #24487a
    }
    .flow-list>li .flow-title {
      font-size: 1.3rem
    }
    .flow-list>li .txt {
      margin: 20px auto 0
    }
  }
  
  .kiritori {
    height: 1px;
    border-top: 1px solid rgba(14, 26, 67, .2);
    margin: 3em auto;
    max-width: 20%;
    display: block
  }
  
  .column2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center
  }
  
  .column2 .child {
    width: 48%
  }
  
  @media screen and (max-width: 639px) {
    .column2 {
      flex-direction: column
    }
    .column2 .child {
      width: 100%
    }
    .column2 .child.column2-img {
      order: -1;
      margin-bottom: 30px
    }
  }
  
  .article-box {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start
  }
  
  .article-box .left {
    width: 27%;
    position: sticky;
    left: 0;
    top: 90px
  }
  
  .article-box .right {
    width: 72%
  }
  
  @media screen and (max-width: 639px) {
    .article-box {
      justify-content: center
    }
    .article-box .left {
      position: relative;
      top: auto;
      width: 90%;
      margin: 0 auto 30px
    }
    .article-box .left .mtitle {
      margin-bottom: 0
    }
    .article-box .right {
      width: 90%
    }
  }
  
  .btn-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    max-width: 600px;
    margin: 0 auto 45px
  }
  
  .btn-box a {
    display: block;
    width: 48%;
    text-align: center;
    font-weight: 600;
    background: #4eacd8;
    padding: 15px 4px;
    color: #111;
    transition: all .2s ease-in
  }
  
  .btn-box a:after {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-left: 5px
  }
  
  .btn-box a:hover {
    background: #555;
    color: #fff
  }
  
  @media screen and (max-width: 639px) {
    .btn-box {
      justify-content: center
    }
    .btn-box a {
      width: 90%;
      margin: 0 auto 15px;
      padding: 10px 0
    }
  }
  
  .page {
    text-align: center
  }
  
  .top-icon-list>li {
    position: relative;
    padding: 20px 15px;
    background-image: linear-gradient(to right bottom, #fff, #fff, rgba(36, 221, 246, 0.2));
    border: 4px solid #24ddf6;
    box-shadow: 5px 5px #f3f6f5;
    font-size: 1.7rem;
    letter-spacing: .1rem
  }
  
  @media screen and (max-width: 1025px) {
    .top-icon-list>li {
      width: 48%;
      margin-right: 4%;
      margin-bottom: 20px
    }
    .top-icon-list>li:nth-child(2n) {
      margin-right: 0
    }
  }
  
  @media screen and (max-width: 639px) {
    .top-icon-list {
      margin-bottom: -20px
    }
    .top-icon-list>li {
      width: 95%;
      margin: 0 auto 20px;
      font-size: 1.3rem
    }
    .top-icon-list>li:nth-child(2n) {
      margin-right: auto
    }
  }
  
  #sp-nav .sp-info-wrap {
    margin: 15px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center
  }
  
  #sp-nav .sp-info-wrap a {
    display: block;
    color: #24487a;
    font-weight: 600;
    font-size: 13px;
    border-bottom: 2px solid #24487a;
    padding: 4px 0
  }
  
  #sp-nav .sp-info-wrap a:not(:last-of-type) {
    margin-right: 10px
  }
  
  .taishou-block {
    padding: 8px;
    background: #fff;
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 10px
  }
  
  .taishou-block.type1 {
    display: block
  }
  
  .taishou-block .lead {
    font-size: 1.3rem;
    padding: 3px 5px;
    font-weight: 600;
    background: #24487a;
    color: #fff;
    margin-right: 10px
  }
  
  .taishou-block .list-inline {
    flex: 1
  }
  
  .policy-txt {
    max-width: 650px;
    margin: 40px auto
  }
  
  .policy-txt .txt-inner {
    line-height: 2;
    font-size: 1.7rem
  }
  
  @media screen and (max-width: 639px) {
    .policy-txt {
      padding: 0 15px
    }
    .policy-txt .txt-inner {
      font-size: 1.3rem
    }
  }
  
  .business-list a {
    display: block;
    position: relative;
    box-shadow: rgba(255, 255, 255, .1) 0px 1px 1px 0px inset, rgba(50, 50, 93, .25) 0px 50px 100px -20px, rgba(0, 0, 0, .3) 0px 30px 60px -30px
  }
  
  .business-list a:hover figure img {
    transform: scale(1.1)
  }
  
  .business-list figure {
    height: 350px;
    overflow: hidden;
    border-radius: 10px
  }
  
  .business-list figure img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: .2s ease-in transform
  }
  
  @media screen and (max-width: 639px) {
    .business-list figure {
      height: 250px
    }
  }
  
  .business-list-title {
    font-size: 2.2rem;
    position: absolute;
    right: 0;
    bottom: -1px;
    background: #4eacd8;
    color: #fff;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    padding: 10px 30px 10px 20px;
    border-radius: 15px 0 10px 0
  }
  
  .business-list-title .eng {
    display: block;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 1.4rem
  }
  
  .business-list-title:after {
    position: absolute;
    content: "";
    right: 5px;
    top: 50%;
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    transform: translateY(-50%);
    color: #4eacd8
  }
  
  .business-list-title:before {
    position: absolute;
    content: "";
    right: 0;
    top: -30px;
    width: 30px;
    height: 30px;
    background: url(../img/hem.svg) no-repeat right bottom/contain
  }
  
  @media screen and (max-width: 639px) {
    .business-list-title {
      font-size: 1.4rem;
      text-shadow: none;
      padding-right: 80px
    }
  }
  
  .area-block {
    position: relative;
    max-width: 700px;
    margin: 0 auto 80px
  }
  
  .area-block .area-txt {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    padding-left: 200px
  }
  
  .area-block .area-txt:before, .area-block .area-txt:after {
    position: absolute;
    content: "";
    top: 50%;
    transform: translateY(-50%)
  }
  
  .area-block .area-txt:before {
    left: -60px;
    width: 40px;
    height: 40px;
    background: rgba(36, 221, 246, .3);
    border-radius: 50%
  }
  
  .area-block .area-txt:after {
    left: -100px;
    width: 40px;
    height: 1px;
    background: #24ddf6
  }
  
  @media screen and (max-width: 639px) {
    .area-block .area-txt {
      font-size: 1.4rem;
      position: relative;
      top: auto;
      left: auto;
      transform: none;
      padding-left: 20px
    }
    .area-block .area-txt:before, .area-block .area-txt:after {
      transform: none
    }
    .area-block .area-txt:before {
      left: 4px;
      top: -20px
    }
  }
  
  @media screen and (max-width: 639px)and (max-width: 639px) {
    .area-block .area-txt:before {
      top: -130px
    }
  }
  
  @media screen and (max-width: 639px) {
    .area-block .area-txt:after {
      left: 24px;
      top: 0;
      width: 1px;
      height: 30px
    }
  }
  
  @media screen and (max-width: 639px)and (max-width: 639px) {
    .area-block .area-txt:after {
      top: -110px
    }
  }
  
  @keyframes border-anim {
    0% {
      -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
      clip-path: polygon(0 0, 0 0, 0 100%, 0 100%)
    }
    20% {
      -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
      clip-path: polygon(0 0, 0 0, 0 100%, 0 100%)
    }
    40% {
      -webkit-clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
      clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%)
    }
    58% {
      -webkit-clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
      clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%)
    }
    75% {
      -webkit-clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
      clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%)
    }
    100% {
      -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
      clip-path: polygon(0 0, 0 0, 0 100%, 0 100%)
    }
  }
  
  .title-big {
    position: relative;
    text-align: center;
    margin-bottom: 40px
  }
  
  @media screen and (max-width: 639px) {
    .title-big {
      margin-bottom: 20px
    }
  }
  
  .title-big:before {
    display: block;
    position: relative;
    margin-bottom: 10px;
    width: -moz-fit-content;
    width: fit-content;
    white-space: nowrap;
    font-family: "Lato", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 6rem;
    margin-inline: auto;
    content: attr(data-title);
    color: rgba(0, 0, 0, 0);
    background-image: linear-gradient(to right, #24487a -22.57%, #74c6e8 68.82%);
    -webkit-background-clip: text;
    letter-spacing: .1rem;
    line-height: 1
  }
  
  .title-big.type-left {
    text-align: left
  }
  
  .title-big.type-left:before {
    margin-left: 0
  }
  
  .title-big.type1 {
    color: #fff
  }
  
  .title-big.type1:before {
    color: rgba(0, 0, 0, 0);
    background-image: none;
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(0, 0, 0, 0);
    -webkit-text-stroke: 1px #fff
  }
  
  .title-big.type2:before {
    color: rgba(0, 0, 0, 0);
    background-image: linear-gradient(to left, #1BB6F2 9.43%, #00C8B4 49.9%, #ADE478 94.82%);
    -webkit-background-clip: text
  }
  
  .title-big.type3:before {
    color: rgba(0, 0, 0, 0);
    background-image: linear-gradient(to right, #fff 40%, #f5f3eb 60%, #24ddf6);
    -webkit-background-clip: text
  }
  
  .title-big.type4 {
    padding-top: 80px;
    color: #ccc
  }
  
  .title-big.type4:before {
    top: -14px
  }
  
  .title-big.type4 .ja {
    color: #999
  }
  
  @media screen and (max-width: 639px) {
    .title-big.type4 {
      margin-bottom: 30px
    }
    .title-big.type4:before {
      top: -8px
    }
  }
  
  .title-big .ja {
    display: block;
    position: relative;
    font-weight: 600;
    font-size: 2.2rem;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    z-index: 2
  }
  
  .title-big .ja.big {
    font-size: 3rem
  }
  
  .title-big .small {
    font-size: .7em
  }
  
  @media screen and (max-width: 639px) {
    .title-big .ja {
      font-size: 1.4rem
    }
    .title-big:before {
      font-size: 3.2rem
    }
  }
  
  .mark-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center
  }
  
  .mark-list li {
    height: 85px;
    margin-right: 10px
  }
  
  .mark-list li img {
    max-width: initial;
    max-height: 100%
  }
  
  .business-head-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px 5%
  }
  
  @media screen and (max-width: 639px) {
    .business-head-list {
      grid-template-columns: 1fr;
      padding: 0 30px
    }
  }
  
  .business-head-list a {
    display: block;
    position: relative
  }
  
  .business-head-list a .eng {
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    position: absolute;
    left: 6px;
    bottom: 60px;
    z-index: 5;
    color: #fff;
    font-size: 3.5rem;
    line-height: 1
  }
  
  @media screen and (max-width: 639px) {
    .business-head-list a .eng {
      font-size: 2rem;
      bottom: 40px
    }
  }
  
  .business-head-list a figure {
    height: 280px;
    overflow: hidden;
    border-radius: 0 0 40px 0;
    background: #111
  }
  
  .business-head-list a figure img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    opacity: .8
  }
  
  @media screen and (max-width: 1101px) {
    .business-head-list a figure {
      height: 230px
    }
  }
  
  @media screen and (max-width: 639px) {
    .business-head-list a figure {
      height: 180px
    }
  }
  
  .business-head-list a figcaption {
    position: relative;
    margin-top: -30px;
    display: block;
    display: flex;
    align-items: center
  }
  
  .business-head-list a figcaption .big {
    font-weight: 600;
    background: #111;
    color: #fff;
    font-size: 1.25em;
    display: inline-block;
    padding: 8px 10px 8px 16px;
    line-height: 1.2;
    letter-spacing: .1em;
    border-radius: 0 40px 40px 0;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .business-head-list a figcaption .big:after {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-left: 12px;
    display: inline-block;
    width: 25px;
    height: 25px;
    font-size: 13px;
    line-height: 25px;
    background: #fff;
    color: #333;
    border-radius: 50%;
    text-align: center
  }
  
  @media screen and (max-width: 639px) {
    .business-head-list a figcaption {
      margin-top: -18px
    }
    .business-head-list a figcaption .big {
      font-size: 1.1rem;
      padding: 8px 8px 8px 10px;
      white-space: nowrap
    }
    .business-head-list a figcaption .big:after {
      width: 15px;
      height: 15px;
      line-height: 15px;
      font-size: 11px;
      margin-left: 5px
    }
  }
  
  .business-head-list a:hover figcaption .big {
    background: #4eacd8
  }
  
  .tel-list {
    max-width: 700px;
    margin-inline: auto
  }
  
  .tel-list li {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 8px
  }
  
  .tel-list li:not(:last-of-type) {
    border-bottom: 2px solid #f3f6f5;
    margin-bottom: 8px
  }
  
  .tel-list li .title03 {
    margin-right: 20px;
    width: 6em
  }
  
  .tel-list li .title03 span {
    padding: 8px 10px
  }
  
  .contact-box {
    justify-content: center;
    display: flex;
    align-items: center
  }
  
  .contact-box .lead {
    font-weight: 600;
    width: 10em;
    line-height: 1.4;
    text-align: center
  }
  
  .contact-box .content {
    border-left: 2px solid #0e1a43;
    padding-left: 20px
  }
  
  .contact-box .content .contact-box-tel {
    color: #0e1a43;
    font-weight: 600;
    font-size: 2.6rem;
    width: 200px;
    display: block;
    line-height: 1;
    font-family: "Lato", sans-serif;
    font-weight: 700
  }
  
  .contact-box .content .contact-box-tel:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px;
    font-size: .6em
  }
  
  .contact-box .content .contact-box-tel:hover {
    color: #4eacd8
  }
  
  @media screen and (max-width: 639px) {
    .contact-box .content .contact-box-tel {
      font-size: 2rem
    }
  }
  
  .pdf-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px 3%
  }
  
  @media screen and (max-width: 639px) {
    .pdf-list {
      grid-template-columns: repeat(2, 1fr)
    }
  }
  
  .pdf-list a {
    display: block;
    text-align: center;
    background: #24ddf6;
    color: #111;
    font-weight: 600;
    padding: 15px 4px;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .pdf-list a:hover {
    background: #0e1a43;
    color: #fff
  }
  
  .pdf-list a:after {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-left: 6px
  }
  
  .title-wrapper {
    padding-left: 25px;
    padding-right: 25px
  }
  
  @media screen and (max-width: 1025px) {
    .title-wrapper {
      padding-left: 10px;
      padding-right: 10px
    }
  }
  
  .logo-wrap {
    margin: 100px auto
  }
  
  @media screen and (max-width: 639px) {
    .logo-wrap {
      margin: 0px auto
    }
  }
  
  .logo-wrap .logo-thoughts {
    width: 60%;
    margin: 0 auto 50px auto
  }
  
  @media screen and (max-width: 639px) {
    .logo-wrap .logo-thoughts {
      width: 85%;
      margin: 0 auto 30px auto
    }
  }
  
  .js-span-text {
    opacity: 0
  }
  
  .js-span-text.on {
    opacity: 1
  }
  
  .js-span-text.on span {
    display: inline-block;
    opacity: 0
  }
  
  .js-span-text.on span:nth-child(1) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.1s forwards
  }
  
  .js-span-text.on span:nth-child(2) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.2s forwards
  }
  
  .js-span-text.on span:nth-child(3) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.3s forwards
  }
  
  .js-span-text.on span:nth-child(4) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.4s forwards
  }
  
  .js-span-text.on span:nth-child(5) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.5s forwards
  }
  
  .js-span-text.on span:nth-child(6) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.6s forwards
  }
  
  .js-span-text.on span:nth-child(7) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.7s forwards
  }
  
  .js-span-text.on span:nth-child(8) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.8s forwards
  }
  
  .js-span-text.on span:nth-child(9) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.9s forwards
  }
  
  .js-span-text.on span:nth-child(10) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1s forwards
  }
  
  .js-span-text.on span:nth-child(11) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.1s forwards
  }
  
  .js-span-text.on span:nth-child(12) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.2s forwards
  }
  
  .js-span-text.on span:nth-child(13) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.3s forwards
  }
  
  .js-span-text.on span:nth-child(14) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.4s forwards
  }
  
  .js-span-text.on span:nth-child(15) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.5s forwards
  }
  
  .js-span-text.on span:nth-child(16) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.6s forwards
  }
  
  .js-span-text.on span:nth-child(17) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.7s forwards
  }
  
  .js-span-text.on span:nth-child(18) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.8s forwards
  }
  
  .js-span-text.on span:nth-child(19) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.9s forwards
  }
  
  .js-span-text.on span:nth-child(20) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2s forwards
  }
  
  .js-span-text.on span:nth-child(21) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.1s forwards
  }
  
  .js-span-text.on span:nth-child(22) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.2s forwards
  }
  
  .js-span-text.on span:nth-child(23) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.3s forwards
  }
  
  .js-span-text.on span:nth-child(24) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.4s forwards
  }
  
  .js-span-text.on span:nth-child(25) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.5s forwards
  }
  
  .js-span-text.on span:nth-child(26) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.6s forwards
  }
  
  .js-span-text.on span:nth-child(27) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.7s forwards
  }
  
  .js-span-text.on span:nth-child(28) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.8s forwards
  }
  
  .js-span-text.on span:nth-child(29) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.9s forwards
  }
  
  .js-span-text.on span:nth-child(30) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3s forwards
  }
  
  .js-span-text.on span:nth-child(31) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.1s forwards
  }
  
  .js-span-text.on span:nth-child(32) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.2s forwards
  }
  
  .js-span-text.on span:nth-child(33) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.3s forwards
  }
  
  .js-span-text.on span:nth-child(34) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.4s forwards
  }
  
  .js-span-text.on span:nth-child(35) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.5s forwards
  }
  
  .js-span-text.on span:nth-child(36) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.6s forwards
  }
  
  .js-span-text.on span:nth-child(37) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.7s forwards
  }
  
  .js-span-text.on span:nth-child(38) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.8s forwards
  }
  
  .js-span-text.on span:nth-child(39) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.9s forwards
  }
  
  .js-span-text.on span:nth-child(40) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4s forwards
  }
  
  .js-span-text.on span:nth-child(41) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.1s forwards
  }
  
  .js-span-text.on span:nth-child(42) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.2s forwards
  }
  
  .js-span-text.on span:nth-child(43) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.3s forwards
  }
  
  .js-span-text.on span:nth-child(44) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.4s forwards
  }
  
  .js-span-text.on span:nth-child(45) {
    animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.5s forwards
  }
  
  @keyframes text {
    0% {
      opacity: 0;
      transform: translateX(-20px) translateY(-10px) scale(1.3)
    }
    100% {
      opacity: 1;
      transform: none
    }
  }
  
  .greet_block {
    position: relative;
    margin: 60px 0 250px
  }
  
  @media screen and (max-width: 639px) {
    .greet_block {
      margin-bottom: 40px;
      margin-top: 0
    }
  }
  
  .greet_block:last-of-type {
    margin-bottom: 2%
  }
  
  .greet_block.type_b .greet_img {
    right: 0
  }
  
  .greet_block.type_b .greet_txt {
    margin-right: 0;
    margin-left: 0
  }
  
  .greet_img {
    overflow: hidden;
    position: absolute;
    top: -30%;
    width: 60%;
    height: 200%
  }
  
  .greet_img img {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    vertical-align: middle
  }
  
  @media screen and (max-width: 1025px) {
    .greet_img {
      width: 100%;
      height: auto;
      position: relative
    }
  }
  
  .greet_txt {
    position: relative;
    z-index: 3;
    width: 57%;
    max-width: 770px;
    margin-right: 3em;
    padding: 45px;
    margin-left: auto;
    background-color: #fff;
    box-shadow: 0 6px 15px rgba(36, 37, 38, .04)
  }
  
  @media screen and (max-width: 1025px) {
    .greet_txt {
      width: 80%;
      margin: -40px auto 0
    }
  }
  
  @media screen and (max-width: 639px) {
    .greet_txt {
      width: 95%;
      padding: 30px 20px
    }
  }
  
  .dl-small {
    display: flex;
    flex-wrap: wrap
  }
  
  .dl-small dt, .dl-small dd {
    padding: 6px 4px;
    font-size: 1.4rem;
    line-height: 1.4
  }
  
  @media screen and (max-width: 639px) {
    .dl-small dt, .dl-small dd {
      font-size: 12px
    }
  }
  
  .dl-small dt:not(:last-of-type), .dl-small dd:not(:last-of-type) {
    border-bottom: 1px solid rgba(85, 85, 85, .5)
  }
  
  .dl-small dt {
    width: 5em
  }
  
  .dl-small dd {
    width: calc(100% - 5em)
  }
  
  .shikaku-dl {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 8px
  }
  
  .shikaku-dl dt:not(:last-of-type), .shikaku-dl dd:not(:last-of-type) {
    padding-bottom: 3px;
    margin-bottom: 3px;
    border-bottom: .9px solid #ddd
  }
  
  .shikaku-dl dt {
    width: 6em;
    position: relative;
    padding-left: 1em
  }
  
  .shikaku-dl dt:before {
    content: "●";
    font-size: .6em;
    color: #4eacd8;
    margin-right: 4px;
    position: absolute;
    left: 0;
    top: .5em
  }
  
  .shikaku-dl dt .list-inline li {
    padding: 0
  }
  
  .shikaku-dl dd {
    width: calc(100% - 6em);
    font-weight: 600
  }
  
  .recruit-lead {
    position: relative;
    z-index: 2;
    text-align: center;
    margin: 0 auto -30px
  }
  
  .fukidashi {
    position: relative;
    z-index: 2;
    text-align: center;
    margin: -60px auto 30px
  }
  
  .fukidashi.type1 {
    margin-top: 0
  }
  
  .fukidashi span {
    display: inline-block;
    font-size: 2.2rem;
    background: #0e1a43;
    color: #fff;
    padding: 5px 15px;
    font-weight: 600;
    position: relative
  }
  
  @media screen and (max-width: 639px) {
    .fukidashi span {
      font-size: 1.4rem
    }
  }
  
  .fukidashi span:before {
    position: absolute;
    content: "";
    left: 50%;
    bottom: -13px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 18px 20px 0 20px;
    border-color: #0e1a43 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
    transform: translateX(-50%)
  }
  
  .fukidashi-sub {
    max-width: 800px;
    margin: -40px auto 40px;
    text-align: center;
    padding: 35px 20px 15px;
    background: #fff;
    border-radius: 50px;
    font-weight: 600;
    font-size: 1.1em
  }
  
  .title-area {
    padding-top: 100px;
    margin-top: 60px
  }
  
  .title-wrapper {
    position: relative
  }
  
  @media screen and (max-width: 1300px) {
    .title-wrapper {
      padding-left: 25px;
      padding-right: 25px
    }
  }
  
  @media screen and (max-width: 1025px) {
    .title-wrapper {
      padding-left: 10px;
      padding-right: 10px
    }
  }
  
  .p-sec1__wrap {
    position: relative;
    z-index: 2;
    padding-top: 150px
  }
  
  @media screen and (max-width: 639px) {
    .p-sec1__wrap {
      padding-top: 80px
    }
  }
  
  .p-sec1__title {
    position: absolute;
    left: 50%;
    top: 50px;
    transform: translateX(-50%);
    text-shadow: 0 0 15px #fff;
    text-align: center;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    font-size: 3.8rem;
    z-index: 4
  }
  
  .p-sec1__title span {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
    padding: 4px 6px;
    border-bottom: 2px solid #24487a;
    letter-spacing: .15em
  }
  
  @media screen and (max-width: 1101px) {
    .p-sec1__title {
      font-size: 2.8rem
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-sec1__title {
      position: relative;
      top: auto;
      font-size: 2rem
    }
  }
  
  .p-sec1__concern-box {
    display: flex;
    flex-wrap: wrap;
    position: relative
  }
  
  .p-sec1__concern-box .concern_child {
    width: 50%;
    position: relative
  }
  
  .p-sec1__concern-box .concern_child .inner {
    max-width: 600px
  }
  
  @media screen and (max-width: 639px) {
    .p-sec1__concern-box .concern_child {
      width: 100%
    }
  }
  
  .p-sec1__concern-box .concern_child:before {
    position: absolute;
    content: "";
    left: 0;
    bottom: -80px;
    width: 100%;
    height: calc(100% + 310px);
    z-index: -1;
    opacity: .6
  }
  
  @media screen and (max-width: 1101px) {
    .p-sec1__concern-box .concern_child:before {
      height: calc(100% + 230px);
      bottom: -40px
    }
  }
  
  @media screen and (max-width: 1101px)and (max-width: 639px) {
    .p-sec1__concern-box .concern_child:before {
      top: -20%;
      bottom: auto;
      width: 110%;
      height: 110%
    }
  }
  
  .p-sec1__concern-box .concern_child.concern_left {
    padding-right: 90px
  }
  
  .p-sec1__concern-box .concern_child.concern_left .inner {
    margin-left: auto
  }
  
  .p-sec1__concern-box .concern_child.concern_left .concern_img-box .concern_img-txt {
    right: 45px;
    text-align: right
  }
  
  .p-sec1__concern-box .concern_child.concern_left:before {
    background: #cff2f2;
    -webkit-clip-path: polygon(0 0, 72% 0, 100% 100%, 0% 100%);
    clip-path: polygon(0 0, 72% 0, 100% 100%, 0% 100%)
  }
  
  @media screen and (max-width: 1101px) {
    .p-sec1__concern-box .concern_child.concern_left {
      padding-left: 15px;
      padding-right: 80px
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-sec1__concern-box .concern_child.concern_left {
      padding-right: 30px
    }
    .p-sec1__concern-box .concern_child.concern_left .concern_img-box .concern_img-txt {
      right: 0px
    }
    .p-sec1__concern-box .concern_child.concern_left:before {
      -webkit-clip-path: polygon(0 0, 80% 0, 100% 100%, 0% 100%);
      clip-path: polygon(0 0, 80% 0, 100% 100%, 0% 100%)
    }
  }
  
  .p-sec1__concern-box .concern_child.concern_right {
    padding-left: 90px
  }
  
  .p-sec1__concern-box .concern_child.concern_right:before {
    background: #e7f9da;
    -webkit-clip-path: polygon(28% 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(28% 0, 100% 0, 100% 100%, 0 100%)
  }
  
  .p-sec1__concern-box .concern_child.concern_right .concern_img-box figure {
    margin-left: auto
  }
  
  .p-sec1__concern-box .concern_child.concern_right .concern_img-box .concern_img-txt {
    left: 45px
  }
  
  @media screen and (max-width: 1101px) {
    .p-sec1__concern-box .concern_child.concern_right {
      padding-right: 15px;
      padding-left: 80px
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-sec1__concern-box .concern_child.concern_right {
      margin-top: 80px;
      padding-left: 30px
    }
    .p-sec1__concern-box .concern_child.concern_right .concern_img-box .concern_img-txt {
      left: 0
    }
    .p-sec1__concern-box .concern_child.concern_right:before {
      -webkit-clip-path: polygon(20% 0, 100% 0, 100% 100%, 0 100%);
      clip-path: polygon(20% 0, 100% 0, 100% 100%, 0 100%);
      top: -5%
    }
  }
  
  .p-sec1__concern-box .concern_child .concern_img-box {
    position: relative
  }
  
  .p-sec1__concern-box .concern_child .concern_img-box figure {
    mix-blend-mode: multiply;
    width: 82%
  }
  
  .p-sec1__concern-box .concern_child .concern_img-box .concern_img-txt {
    position: absolute;
    bottom: 40px;
    z-index: 2;
    width: 50%;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    white-space: nowrap;
    font-size: 3.3rem
  }
  
  @media screen and (max-width: 1101px) {
    .p-sec1__concern-box .concern_child .concern_img-box .concern_img-txt {
      bottom: 20px;
      font-size: 2.4rem;
      white-space: nowrap
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-sec1__concern-box .concern_child .concern_img-box .concern_img-txt {
      bottom: 30px;
      font-size: 2rem;
      white-space: nowrap;
      line-height: 1.4
    }
  }
  
  .p-sec1_concern-list.concern_list1 li {
    -webkit-clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 100%, 20px 100%);
    clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 100%, 20px 100%)
  }
  
  .p-sec1_concern-list.concern_list1 li:nth-child(2) {
    transform: translateX(20px)
  }
  
  .p-sec1_concern-list.concern_list1 li:nth-child(3) {
    transform: translateX(40px)
  }
  
  @media screen and (max-width: 639px) {
    .p-sec1_concern-list.concern_list1 li {
      -webkit-clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 100%, 10px 100%);
      clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 100%, 10px 100%)
    }
  }
  
  .p-sec1_concern-list.concern_list1 li:nth-child(2) {
    transform: translateX(10px)
  }
  
  .p-sec1_concern-list.concern_list1 li:nth-child(3) {
    transform: translateX(20px)
  }
  
  .p-sec1_concern-list.concern_list2 li {
    -webkit-clip-path: polygon(20px 0, 100% 0, calc(100% - 20px) 100%, 0 100%);
    clip-path: polygon(20px 0, 100% 0, calc(100% - 20px) 100%, 0 100%)
  }
  
  .p-sec1_concern-list.concern_list2 li:nth-child(2) {
    transform: translateX(-20px)
  }
  
  .p-sec1_concern-list.concern_list2 li:nth-child(3) {
    transform: translateX(-40px)
  }
  
  @media screen and (max-width: 639px) {
    .p-sec1_concern-list.concern_list2 li {
      -webkit-clip-path: polygon(10px 0, 100% 0, calc(100% - 10px) 100%, 0 100%);
      clip-path: polygon(10px 0, 100% 0, calc(100% - 10px) 100%, 0 100%)
    }
  }
  
  .p-sec1_concern-list.concern_list2 li:nth-child(2) {
    transform: translateX(-10px)
  }
  
  .p-sec1_concern-list.concern_list2 li:nth-child(3) {
    transform: translateX(-20px)
  }
  
  .p-sec1_concern-list li {
    padding: 15px 25px;
    background: #fff
  }
  
  .p-sec1_concern-list li:not(:first-of-type) {
    margin-top: 8px
  }
  
  .p-sec1_concern-list li span {
    display: block;
    margin-inline: auto;
    width: -moz-fit-content;
    width: fit-content;
    font-weight: 600;
    font-size: 1.1em
  }
  
  @media screen and (max-width: 639px) {
    .p-sec1_concern-list li {
      padding: 10px 22px
    }
  }
  
  .p-sec2__lead-box {
    padding: 55px 0
  }
  
  .p-sec2__lead {
    display: flex;
    align-items: flex-end;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 800px;
    margin-inline: auto;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    font-size: 2.8rem
  }
  
  .p-sec2__lead em {
    font-size: 1.2em;
    color: #920202
  }
  
  .p-sec2__lead .img {
    width: 150px;
    margin: 0 5px
  }
  
  @media screen and (max-width: 1101px) {
    .p-sec2__lead {
      font-size: 2.6rem
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-sec2__lead {
      max-width: 400px;
      justify-content: center;
      flex-wrap: wrap;
      font-size: 1.8rem;
      padding: 0 20px
    }
    .p-sec2__lead .img {
      width: 30%
    }
  }
  
  .p-strength__list {
    max-width: 1300px;
    margin-inline: auto;
    padding-top: 50px
  }
  
  .p-strength__list>li {
    position: relative;
    padding: 55px 20px 35px;
    background: rgba(255, 255, 255, .7);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    border-radius: 0 20px 0 20px;
    border: 1px solid #fff
  }
  
  @media screen and (max-width: 1101px) {
    .p-strength__list>li {
      padding: 35px 25px 50px
    }
  }
  
  @media screen and (max-width: 1025px) {
    .p-strength__list>li:not(:last-child) {
      margin-bottom: 80px
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-strength__list>li {
      padding: 45px 25px 50px
    }
    .p-strength__list>li:not(:last-child) {
      margin-bottom: 60px
    }
  }
  
  @media screen and (max-width: 480px) {
    .p-strength__list>li {
      padding: 45px 25px 30px
    }
  }
  
  @media screen and (max-width: 1025px) {
    .p-strength__list {
      padding-top: 40px
    }
  }
  
  .p-strength__lead {
    display: flex;
    align-items: flex-start;
    position: relative
  }
  
  .p-strength__lead:before {
    position: absolute;
    content: "";
    left: 50%;
    top: -115px;
    width: 110px;
    height: 110px;
    transform: translateX(-50%)
  }
  
  @media screen and (max-width: 1025px) {
    .p-strength__lead:before {
      top: -95px
    }
  }
  
  .p-strength__lead.num01:before {
    background: url(../img/point01.png) no-repeat center/contain
  }
  
  .p-strength__lead.num02:before {
    background: url(../img/point02.png) no-repeat center/contain
  }
  
  .p-strength__lead.num03:before {
    background: url(../img/point03.png) no-repeat center/contain
  }
  
  .p-strength__lead.type1 {
    margin-top: 0;
    margin-bottom: 30px
  }
  
  .p-strength__lead .num {
    width: 100px;
    margin-right: 30px
  }
  
  .p-strength__lead .main {
    flex: 1;
    align-self: center;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    color: #24487a;
    font-size: 2.2rem;
    line-height: 1.5;
    text-align: center
  }
  
  .p-strength__lead .main em {
    display: inline-block;
    border-bottom: 1px solid #c40303;
    color: #c40303;
    font-size: 1.05em
  }
  
  .p-strength__lead .main em.type_en {
    border-bottom-color: #4eacd8;
    color: #4eacd8
  }
  
  @media screen and (max-width: 1101px) {
    .p-strength__lead .num {
      width: 50px;
      margin-right: 20px;
      margin-left: -10px
    }
    .p-strength__lead .main {
      padding-top: 15px
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-strength__lead .main {
      font-size: 1.6rem
    }
  }
  
  @media screen and (max-width: 480px) {
    .p-strength__lead .main {
      font-size: 1.5rem
    }
  }
  
  .p-strength__txt {
    position: relative;
    z-index: 2;
    margin-top: 15px
  }
  
  .p-strength__txt p {
    text-align: center;
    margin-bottom: 15px
  }
  
  .p-strength__txt .main {
    flex: 1;
    align-self: center;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    color: #24487a;
    font-size: 2rem;
    line-height: 1.5;
    text-align: center
  }
  
  .p-strength__txt .main em {
    display: inline-block;
    border-bottom: 1px solid #c40303;
    color: #c40303;
    font-size: 1.05em
  }
  
  .p-strength__txt .main em.type_en {
    border-bottom-color: #4eacd8;
    color: #4eacd8
  }
  
  .p-strength__txt figure img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
  }
  
  @media screen and (max-width: 1025px) {
    .p-strength__txt figure {
      height: 250px
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-strength__txt figure {
      height: 200px
    }
  }
  
  .p-sec2__btn-wrap {
    position: relative;
    z-index: 2;
    transform: translateY(100px);
    max-width: 900px;
    margin-inline: auto;
    gap: 20px 4%
  }
  
  @media screen and (max-width: 1101px) {
    .p-sec2__btn-wrap {
      transform: translateY(70px)
    }
  }
  
  .btn-wrap {
    position: relative
  }
  
  .btn-wrap.type_center .btn-cbt {
    margin-inline: auto
  }
  
  .btn-cbt {
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    max-width: 450px;
    width: 100%;
    height: 75px;
    transform: translate(-5px, -5px);
    z-index: 3
  }
  
  .btn-cbt * {
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .btn-cbt:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #111;
    -webkit-clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 100%, 15px 100%);
    clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 100%, 15px 100%);
    opacity: .1;
    transform: translate(15px, 12px);
    z-index: -2;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .btn-cbt .bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 100%, 15px 100%);
    clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 100%, 15px 100%);
    z-index: -2
  }
  
  .btn-cbt .icon {
    position: absolute;
    display: flex;
    align-items: center;
    left: 35px;
    top: 0;
    width: 80px;
    height: 100%;
    overflow: hidden;
    pointer-events: none
  }
  
  .btn-cbt .icon span {
    display: block;
    position: relative;
    z-index: 2;
    width: 55px
  }
  
  .btn-cbt .txt {
    display: block;
    position: relative;
    z-index: 4;
    padding: 0 15px 0 60px;
    line-height: 1.4;
    color: #fff;
    font-size: 1.8rem;
    font-weight: 600;
    text-shadow: 2px 2px 8px rgba(73, 45, 24, .3)
  }
  
  @media screen and (max-width: 639px) {
    .btn-cbt {
      height: 65px;
      max-width: 90%;
      margin-inline: auto
    }
    .btn-cbt:before {
      transform: translate(8px, 6px)
    }
    .btn-cbt .icon span {
      width: 40px
    }
    .btn-cbt .icon span:before {
      top: 12%;
      height: 150%
    }
    .btn-cbt .txt {
      font-size: 1.5rem
    }
  }
  
  .btn-cbt.btn-service .bg {
    background-image: linear-gradient(to right, #152765, #0E1A43)
  }
  
  .btn-cbt.btn-search .bg, .btn-cbt.btn-arrow .bg {
    background-image: linear-gradient(to right, #24487a -22.57%, #74c6e8 68.82%)
  }
  
  .btn-cbt:hover {
    transform: translate(0, 0)
  }
  
  .btn-cbt:hover:before {
    transform: translate(0, 0)
  }
  
  @media screen and (max-width: 1101px) {
    .sec__service-top {
      padding-top: 50px
    }
  }
  
  .p-top-service_wrap {
    position: relative;
    max-width: 1300px;
    margin-inline: auto
  }
  
  @media screen and (max-width: 639px) {
    .p-top-service_wrap {
      flex-direction: column;
      max-width: 85%
    }
  }
  
  .p-top-service_wrap .p-top-service_box {
    position: relative;
    border-radius: 20px;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .p-top-service_wrap .p-top-service_box a {
    display: block;
    position: relative;
    overflow: hidden;
    border-radius: 10px
  }
  
  .p-top-service_wrap .p-top-service_box a:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: #d8dcda;
    border-radius: 10px;
    transition: all .4s cubic-bezier(0.175, 0.4, 0.3, 1.1)
  }
  
  .p-top-service_wrap .p-top-service_box a figure {
    mix-blend-mode: multiply;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    transition: transform .4s cubic-bezier(0.175, 0.885, 0.32, 1.275)
  }
  
  .p-top-service_wrap .p-top-service_box a figure img {
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .p-top-service_wrap .p-top-service_box a .p-top-service_title {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #fff;
    z-index: 5
  }
  
  .p-top-service_wrap .p-top-service_box a .p-top-service_title:before, .p-top-service_wrap .p-top-service_box a .p-top-service_title:after {
    position: absolute;
    content: "";
    background: #fff;
    z-index: -1;
    opacity: 0;
    transition: .5s all cubic-bezier(0.55, 0.05, 0.22, 0.99)
  }
  
  .p-top-service_wrap .p-top-service_box a .p-top-service_title:before {
    width: 35px;
    height: 28px;
    border-radius: 50px;
    left: 5%;
    bottom: -50px
  }
  
  .p-top-service_wrap .p-top-service_box a .p-top-service_title:after {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 150%;
    height: 140%;
    border-radius: 80px
  }
  
  .p-top-service_wrap .p-top-service_box a .p-top-service_title .ja {
    display: block;
    font-size: 2rem;
    margin-top: 10px;
    transition: .5s all cubic-bezier(0.55, 0.05, 0.22, 0.99)
  }
  
  .p-top-service_wrap .p-top-service_box a .p-top-service_title .eng {
    display: inline-block;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1);
    font-family: "Lato", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 4rem;
    line-height: 1;
    white-space: nowrap
  }
  
  @media screen and (max-width: 639px) {
    .p-top-service_wrap .p-top-service_box a .p-top-service_title .ja {
      font-size: 1.4rem
    }
    .p-top-service_wrap .p-top-service_box a .p-top-service_title .eng {
      font-size: 2.4rem
    }
    .p-top-service_wrap .p-top-service_box a .p-top-service_title:before {
      width: 25px;
      height: 20px;
      bottom: -30px
    }
  }
  
  .p-top-service_wrap .p-top-service_box .p-top-service_txt {
    padding: 20px
  }
  
  .p-top-service_wrap .p-top-service_box:hover {
    box-shadow: rgba(50, 50, 93, .15) 0px 13px 27px -5px, rgba(0, 0, 0, .1) 0px 8px 16px -8px
  }
  
  .p-top-service_wrap .p-top-service_box:hover a figure {
    border-radius: 20px
  }
  
  .p-top-service_wrap .p-top-service_box:hover a:before {
    transform: scale(0.96, 0.94);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px)
  }
  
  .p-top-service_wrap .p-top-service_box:hover a .p-top-service_title .eng {
    color: #24487a
  }
  
  .p-top-service_wrap .p-top-service_box:hover a .p-top-service_title .ja {
    color: #111
  }
  
  .p-top-service_wrap .p-top-service_box:hover a .p-top-service_title:before, .p-top-service_wrap .p-top-service_box:hover a .p-top-service_title:after {
    opacity: .8
  }
  
  .top-greet-box, .top-recruit-box, .service-box, .company-box, .motto-box {
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    max-width: 1800px
  }
  
  .top-greet-box .img-box, .top-recruit-box .img-box, .service-box .img-box, .company-box .img-box, .motto-box .img-box {
    width: 44%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
    order: 2
  }
  
  .top-greet-box .img-box .img01, .top-recruit-box .img-box .img01, .service-box .img-box .img01, .company-box .img-box .img01, .motto-box .img-box .img01 {
    width: 92%
  }
  
  .top-greet-box .txt-box, .top-recruit-box .txt-box, .service-box .txt-box, .company-box .txt-box, .motto-box .txt-box {
    width: 56%;
    padding: 40px
  }
  
  .top-greet-box .txt-box .ttl, .top-recruit-box .txt-box .ttl, .service-box .txt-box .ttl, .company-box .txt-box .ttl, .motto-box .txt-box .ttl {
    font-size: 2.3rem;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    margin-bottom: 10px;
    line-height: 1.6;
    width: 86%
  }
  
  .top-greet-box .txt-box .ttl span, .top-recruit-box .txt-box .ttl span, .service-box .txt-box .ttl span, .company-box .txt-box .ttl span, .motto-box .txt-box .ttl span {
    color: #4eacd8;
    font-weight: bold
  }
  
  @media screen and (max-width: 820px) {
    .top-greet-box, .top-recruit-box, .service-box, .company-box, .motto-box {
      flex-direction: column-reverse
    }
    .top-greet-box .img-box, .top-greet-box .txt-box, .top-recruit-box .img-box, .top-recruit-box .txt-box, .service-box .img-box, .service-box .txt-box, .company-box .img-box, .company-box .txt-box, .motto-box .img-box, .motto-box .txt-box {
      width: 100%
    }
    .top-greet-box .img-box .img01, .top-recruit-box .img-box .img01, .service-box .img-box .img01, .company-box .img-box .img01, .motto-box .img-box .img01 {
      width: 100%;
      height: 300px
    }
    .top-greet-box .img-box .img01 img, .top-recruit-box .img-box .img01 img, .service-box .img-box .img01 img, .company-box .img-box .img01 img, .motto-box .img-box .img01 img {
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
      object-fit: cover
    }
    .top-greet-box .img-box .img01.service img, .top-recruit-box .img-box .img01.service img, .service-box .img-box .img01.service img, .company-box .img-box .img01.service img, .motto-box .img-box .img01.service img {
      -o-object-fit: contain;
      object-fit: contain;
      box-shadow: none
    }
    .top-greet-box .txt-box, .top-recruit-box .txt-box, .service-box .txt-box, .company-box .txt-box, .motto-box .txt-box {
      padding: 20px 10px
    }
    .top-greet-box .txt-box .ttl, .top-recruit-box .txt-box .ttl, .service-box .txt-box .ttl, .company-box .txt-box .ttl, .motto-box .txt-box .ttl {
      width: 90%;
      margin: 0 auto
    }
  }
  
  @media screen and (max-width: 1025px) {
    .top-greet-box .img-box .img01, .top-recruit-box .img-box .img01, .service-box .img-box .img01, .company-box .img-box .img01, .motto-box .img-box .img01 {
      height: 250px
    }
  }
  
  @media screen and (max-width: 480px) {
    .top-greet-box .txt-box .ttl, .top-recruit-box .txt-box .ttl, .service-box .txt-box .ttl, .company-box .txt-box .ttl, .motto-box .txt-box .ttl {
      width: 100%
    }
  }
  
  .top-greet-box.type2, .top-recruit-box.type2, .service-box.type2, .company-box.type2, .motto-box.type2 {
    align-items: flex-start
  }
  
  .top-greet-box.type2 .txt-box, .top-recruit-box.type2 .txt-box, .service-box.type2 .txt-box, .company-box.type2 .txt-box, .motto-box.type2 .txt-box {
    padding: 0
  }
  
  .top-greet-box.type2 .txt-box .mtitle7, .top-recruit-box.type2 .txt-box .mtitle7, .service-box.type2 .txt-box .mtitle7, .company-box.type2 .txt-box .mtitle7, .motto-box.type2 .txt-box .mtitle7 {
    margin-bottom: 60px
  }
  
  .top-greet-box.type2 .txt-box .ttl, .top-recruit-box.type2 .txt-box .ttl, .service-box.type2 .txt-box .ttl, .company-box.type2 .txt-box .ttl, .motto-box.type2 .txt-box .ttl {
    margin-bottom: 20px
  }
  
  .top-greet-box {
    justify-content: flex-end;
    padding: 80px 0;
    max-width: 95%
  }
  
  @media screen and (max-width: 1025px) {
    .top-greet-box {
      flex-direction: column;
      width: 95%;
      padding: 40px 0
    }
  }
  
  .top-greet-box .img-box {
    width: 55%
  }
  
  @media screen and (max-width: 1101px) {
    .top-greet-box .img-box {
      width: 50%
    }
  }
  
  @media screen and (max-width: 1025px) {
    .top-greet-box .img-box {
      width: 100%
    }
  }
  
  .top-greet-box .img-box .img01 {
    width: 100%;
    height: 450px
  }
  
  @media screen and (max-width: 1440px) {
    .top-greet-box .img-box .img01 {
      height: 400px
    }
  }
  
  @media screen and (max-width: 1025px) {
    .top-greet-box .img-box .img01 {
      height: 280px
    }
  }
  
  .top-greet-box .img-box .img01 img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
  }
  
  .top-greet-box .txt-box {
    width: 40%;
    padding: 0;
    padding-right: 60px
  }
  
  @media screen and (max-width: 1440px) {
    .top-greet-box .txt-box {
      width: 45%;
      padding-right: 40px
    }
  }
  
  @media screen and (max-width: 1101px) {
    .top-greet-box .txt-box {
      width: 45%
    }
  }
  
  @media screen and (max-width: 1025px) {
    .top-greet-box .txt-box {
      width: 100%;
      padding-right: 0
    }
  }
  
  .top-greet-box .txt-box .ttl {
    width: 80%
  }
  
  @media screen and (max-width: 1440px) {
    .top-greet-box .txt-box .ttl {
      width: 85%
    }
  }
  
  @media screen and (max-width: 1101px) {
    .top-greet-box .txt-box .ttl {
      width: 100%;
      margin: 0 auto
    }
  }
  
  @media screen and (max-width: 1025px) {
    .top-greet-box .txt-box .ttl {
      width: 50%
    }
  }
  
  @media screen and (max-width: 639px) {
    .top-greet-box .txt-box .ttl {
      width: 70%
    }
  }
  
  @media screen and (max-width: 480px) {
    .top-greet-box .txt-box .ttl {
      width: 100%
    }
  }
  
  .top-greet-box .txt-box p.txt {
    font-size: 1.7rem
  }
  
  .top-greet-box .txt-box p.txt:not(:last-child) {
    margin-bottom: 15px
  }
  
  @media screen and (max-width: 1300px) {
    .top-greet-box .txt-box p.txt {
      font-size: 1.4rem
    }
  }
  
  @media screen and (max-width: 1025px) {
    .top-greet-box .txt-box p.txt:last-child {
      margin-bottom: 20px;
      font-size: 1.3rem
    }
  }
  
  .top-recruit-box .txt-box p {
    text-align: center;
    margin-bottom: 30px
  }
  
  .top-recruit-box .txt-box .btn-cbt {
    margin: 0 auto
  }
  
  .service-box {
    flex-direction: row-reverse
  }
  
  .service-box .txt-box {
    text-align: center
  }
  
  .service-mt40 {
    margin-top: 40px
  }
  
  .motto-box {
    flex-direction: row-reverse
  }
  
  .motto-box .txt-box {
    text-align: left
  }
  
  .motto-box .txt-box p:not(:last-child) {
    margin-bottom: 15px
  }
  
  .recruit-box {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px
  }
  
  @media screen and (max-width: 820px) {
    .recruit-box {
      flex-direction: column
    }
  }
  
  .recruit-box .imgArea {
    flex: 0 0 auto;
    width: 40%
  }
  
  .recruit-box .imgArea .img-inner {
    height: 350px;
    position: relative;
    padding-bottom: 2rem;
    padding-left: 2rem;
    overflow: hidden
  }
  
  .recruit-box .imgArea .img-inner:after {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -1;
    display: block;
    width: calc(100% - 2rem);
    height: calc(100% - 2rem);
    content: "";
    background-color: rgba(153, 208, 231, .2)
  }
  
  .recruit-box .imgArea .img-inner .u-ofcover {
    width: 100%;
    height: 100%;
    font-family: "object-fit: cover;";
    -o-object-fit: cover;
    object-fit: cover
  }
  
  .recruit-box .txtArea {
    flex: 0 0 auto;
    width: 50%
  }
  
  .recruit-box .txtArea .r-flow {
    display: flex;
    flex-wrap: wrap;
    line-height: 1.4
  }
  
  .recruit-box .txtArea .r-flow dt {
    width: 8rem;
    padding-top: 1.1rem;
    padding-right: 1.5rem;
    text-align: right;
    letter-spacing: .1rem
  }
  
  .recruit-box .txtArea .r-flow dt>b {
    position: relative;
    display: block;
    font-family: Reem Kufi, Noto Sans JP, Yu Gothic, YuGothic, ヒラギノ角ゴ ProN W3, Hiragino Kaku Gothic ProN, メイリオ, Meiryo, sans-serif;
    font-size: 1.4rem;
    font-weight: 700
  }
  
  .recruit-box .txtArea .r-flow dd {
    width: calc(100% - 8rem);
    padding: 1.1rem 0 4.5rem 10px;
    border-left: solid 2px #4eacd8
  }
  
  .recruit-box .txtArea .r-flow dd>.inner {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    margin-left: 1rem
  }
  
  .recruit-box .txtArea .r-flow dd>.inner:after {
    position: absolute;
    top: 1rem;
    left: -2.82rem;
    display: inline-block;
    width: 15px;
    height: 15px;
    content: "";
    background-color: #4eacd8;
    border-radius: 50%;
    transform: translateY(-50%)
  }
  
  .recruit-box .txtArea .r-flow dd>.inner>.container {
    order: 1;
    width: 100%
  }
  
  .recruit-box .txtArea .r-flow dd>.inner>.container>.title {
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.6;
    border-bottom: solid thin #888;
    padding-bottom: 5px
  }
  
  .recruit-box .txtArea .r-flow dd>.inner>.container>p {
    padding-top: 5px
  }
  
  @media screen and (max-width: 820px) {
    .recruit-box .imgArea, .recruit-box .txtArea {
      width: 100%
    }
  }
  
  .company-box {
    align-items: flex-start;
    justify-content: flex-end
  }
  
  @media screen and (max-width: 820px) {
    .company-box {
      flex-direction: column
    }
  }
  
  .company-box .img-box {
    width: 53%
  }
  
  @media screen and (max-width: 820px) {
    .company-box .img-box {
      width: 100%
    }
  }
  
  .company-box .txt-box {
    width: 44%;
    padding: 0;
    padding-right: 20px
  }
  
  @media screen and (max-width: 820px) {
    .company-box .txt-box {
      width: 100%;
      padding-right: 0
    }
  }
  
  .company-box .txt-box .mtitle7 {
    margin-bottom: 60px
  }
  
  .company-box .txt-box .ttl {
    width: 80%;
    margin: 0 auto 30px
  }
  
  @media screen and (max-width: 1025px) {
    .company-box .txt-box .ttl {
      width: 100%
    }
  }
  
  @media screen and (max-width: 820px) {
    .company-box .txt-box .ttl {
      width: 65%;
      margin: 0 auto 30px
    }
  }
  
  @media screen and (max-width: 639px) {
    .company-box .txt-box .ttl {
      width: 80%
    }
  }
  
  @media screen and (max-width: 480px) {
    .company-box .txt-box .ttl {
      width: 98%
    }
  }
  
  .company-box .txt-box .txt {
    font-size: 1.8rem;
    text-align: center
  }
  
  @media screen and (max-width: 1300px) {
    .company-box .txt-box .txt {
      font-size: 1.5rem
    }
  }
  
  @media screen and (max-width: 1025px) {
    .company-box .txt-box .txt {
      font-size: 1.3rem
    }
  }
  
  @media screen and (max-width: 820px) {
    .company-box .txt-box .txt {
      text-align: center;
      margin-bottom: 30px
    }
  }
  
  .top-area-box {
    max-width: 1600px;
    margin: 0 auto;
    background: url(../img/top-area.jpg) no-repeat bottom/cover;
    height: 400px
  }
  
  @media screen and (max-width: 1025px) {
    .top-area-box {
      height: 300px
    }
  }
  
  @media screen and (max-width: 639px) {
    .top-area-box {
      height: 250px
    }
  }
  
  .top-area-txt {
    max-width: 750px;
    width: calc(100% - 20px);
    position: relative;
    z-index: 2;
    margin: -120px auto 0
  }
  
  .top-area-txt .inner {
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
    background: #fff;
    padding: 40px;
    position: relative;
    z-index: 2
  }
  
  @media screen and (max-width: 1025px) {
    .top-area-txt .inner {
      padding: 30px
    }
  }
  
  @media screen and (max-width: 639px) {
    .top-area-txt .inner {
      padding: 20px
    }
  }
  
  .top-area-txt .inner .mtitle6 {
    margin-bottom: 20px
  }
  
  .top-area-txt .inner p {
    text-align: center
  }
  
  .top-area-txt .inner p.first {
    font-size: 2rem;
    margin-bottom: 10px
  }
  
  @media screen and (max-width: 639px) {
    .top-area-txt .inner p.first {
      padding-bottom: 3px
    }
  }
  
  @media screen and (max-width: 480px) {
    .top-area-txt .inner p.first {
      font-size: 1.5rem
    }
  }
  
  .top-flow-list {
    max-width: 850px
  }
  
  .top-flow-list .flow-list-inner {
    font-size: 1.3rem;
    flex-wrap: wrap;
    text-align: center;
    display: flex;
    justify-content: center;
    margin-bottom: 30px
  }
  
  .top-flow-list .flow-list-inner li {
    position: relative;
    background-color: #fff;
    border: 1px solid #4eacd8;
    border-radius: 50%;
    width: 20%;
    margin-right: 3.95%;
    margin-bottom: 30px
  }
  
  @media screen and (max-width: 1025px) {
    .top-flow-list .flow-list-inner li {
      width: 25%;
      margin-right: 4.95%
    }
  }
  
  @media screen and (max-width: 639px) {
    .top-flow-list .flow-list-inner li {
      width: 38%;
      margin-right: 7.95%
    }
  }
  
  @media screen and (max-width: 480px) {
    .top-flow-list .flow-list-inner li {
      width: 42%
    }
  }
  
  .top-flow-list .flow-list-inner li:before {
    content: "";
    display: block;
    padding-top: 100%
  }
  
  .top-flow-list .flow-list-inner li:not(:last-child):after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: -13.93%;
    margin: auto;
    width: 7.96%;
    height: 7.96%;
    border-top: 1px solid #4eacd8;
    border-right: 1px solid #4eacd8;
    transform: rotate(45deg)
  }
  
  @media screen and (max-width: 1025px) {
    .top-flow-list .flow-list-inner li:not(:last-child):after {
      right: -12.93%
    }
  }
  
  .top-flow-list .flow-list-inner li .txtarea {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
  }
  
  .top-flow-list .flow-list-inner li .txtarea .txt-sub, .top-flow-list .flow-list-inner li .txtarea .txt-sub * {
    color: #4eacd8
  }
  
  .top-flow-list .flow-list-inner li .txtarea .icon {
    height: 40%
  }
  
  .top-flow-list .flow-list-inner li .txtarea .icon img {
    height: 100%
  }
  
  .top-flow-list .flow-list-inner li .txtarea p {
    display: flex;
    align-items: center;
    line-height: 1.4;
    height: 2.4em;
    margin-bottom: -0.5rem
  }
  
  .p-sec3__title {
    position: relative
  }
  
  .p-sec3__title .ja {
    display: inline-block;
    position: relative;
    margin-left: 30px;
    margin-top: 10px;
    font-size: 2.8rem;
    text-indent: -30px
  }
  
  .p-sec3__title:before {
    display: inline-block;
    content: attr(data-title);
    color: rgba(0, 0, 0, 0);
    background-image: linear-gradient(to right, #24487a -22.57%, #74c6e8 68.82%);
    -webkit-background-clip: text;
    letter-spacing: .1rem;
    line-height: 1;
    font-size: 4.5rem;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal
  }
  
  @media screen and (max-width: 1101px) {
    .p-sec3__title .ja {
      margin-left: 0;
      font-size: 2rem;
      text-indent: 0
    }
    .p-sec3__title:before {
      font-size: 3.2rem
    }
  }
  
  .p-sec3__list li {
    position: relative;
    width: 90%
  }
  
  .p-sec3__list li:nth-child(2) {
    margin-top: 40px;
    margin-left: auto
  }
  
  @media screen and (max-width: 639px) {
    .p-sec3__list li {
      width: 95%
    }
  }
  
  .p-sec3__list li a {
    display: flex;
    align-items: center;
    position: relative;
    aspect-ratio: 3/1;
    overflow: hidden
  }
  
  .p-sec3__list li a:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to left, #1BB6F2 9.43%, #00C8B4 49.9%, #ADE478 94.82%);
    opacity: .4
  }
  
  @media screen and (max-width: 639px) {
    .p-sec3__list li a {
      aspect-ratio: 3/1.3
    }
  }
  
  .p-sec3__list li a .arrow {
    position: absolute;
    right: 20px;
    bottom: 10px;
    z-index: 4;
    width: 80px;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .p-sec3__list li a .arrow .cls-1 {
    fill: none;
    stroke: #fff
  }
  
  @media screen and (max-width: 639px) {
    .p-sec3__list li a .arrow {
      width: 40px
    }
  }
  
  .p-sec3__list li a figure {
    position: absolute;
    width: 100%;
    height: 100%;
    mix-blend-mode: multiply;
    -webkit-mask-image: linear-gradient(to left, #000 0%, rgba(0, 0, 0, 0.3) 80%, rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(to left, #000 0%, rgba(0, 0, 0, 0.3) 80%, rgba(0, 0, 0, 0) 100%)
  }
  
  .p-sec3__list li a figure img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: .5s all cubic-bezier(0.55, 0.05, 0.22, 0.99)
  }
  
  .p-sec3__list li a .p-sec3__list-lead {
    position: relative;
    z-index: 3;
    margin-left: 40px;
    color: #111;
    font-size: 2.2rem;
    line-height: 1.4;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600
  }
  
  .p-sec3__list li a .p-sec3__list-lead:before {
    display: block;
    content: attr(data-title);
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 5rem
  }
  
  @media screen and (max-width: 639px) {
    .p-sec3__list li a .p-sec3__list-lead {
      margin-left: 25px;
      font-size: 1.5rem
    }
    .p-sec3__list li a .p-sec3__list-lead:before {
      font-size: 3rem
    }
  }
  
  .p-sec3__list li a:hover figure img {
    opacity: 1;
    transform: scale(1.09)
  }
  
  .p-sec3__list li a:hover .arrow {
    right: 15px
  }
  
  .p-sec4__wrap {
    position: relative;
    width: calc(100% - 150px);
    padding: 80px 0
  }
  
  @media screen and (max-width: 1101px) {
    .p-sec4__wrap {
      width: calc(100% - 50px)
    }
  }
  
  @media screen and (max-width: 1025px) {
    .p-sec4__wrap {
      width: 100%
    }
  }
  
  .p-sec4__photo {
    height: 600px;
    position: relative;
    background: url(../img/top_servise_bg.jpg) no-repeat bottom/cover;
    transition: all .5s ease-in-out
  }
  
  @media screen and (max-width: 639px) {
    .p-sec4__photo {
      height: 500px
    }
  }
  
  .p-sec4__photo:after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
    z-index: 2;
    pointer-events: none;
    mix-blend-mode: multiply;
    background-image: linear-gradient(to left, #278dc0 9.43%, #0096c8 49.9%, #cde478 94.82%);
    transition: all 1s ease-in-out
  }
  
  .p-sec4__photo .p-sec4__btn-area {
    position: absolute;
    right: -15px;
    bottom: 5%;
    z-index: 4
  }
  
  @media screen and (max-width: 639px) {
    .p-sec4__photo .p-sec4__btn-area {
      width: 90%
    }
  }
  
  .p-sec4__photo .p-sec4__btn-area .btn_case {
    display: flex;
    position: relative;
    align-items: center
  }
  
  @media screen and (max-width: 639px) {
    .p-sec4__photo .p-sec4__btn-area .btn_case {
      width: 100%;
      margin-inline: auto
    }
  }
  
  .p-sec4__photo .p-sec4__btn-area .btn_case .case-lead {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 4;
    width: 120px;
    height: 120px
  }
  
  .p-sec4__photo .p-sec4__btn-area .btn_case .case-lead:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 120px;
    height: 120px;
    background-image: linear-gradient(100.02deg, #1bb6f2 9.43%, #00c8b4 49.9%, #ade478 94.82%);
    border: 4px solid #454545;
    transform: rotate(-45deg)
  }
  
  .p-sec4__photo .p-sec4__btn-area .btn_case .case-lead span {
    display: block;
    position: relative;
    z-index: 3;
    color: #333;
    font-size: 2.8rem;
    text-transform: uppercase;
    text-shadow: -2px -2px 1px rgba(255, 255, 255, .3), 2px 2px 1px rgba(73, 45, 24, .1)
  }
  
  @media screen and (max-width: 639px) {
    .p-sec4__photo .p-sec4__btn-area .btn_case .case-lead {
      width: 80px;
      height: 80px
    }
    .p-sec4__photo .p-sec4__btn-area .btn_case .case-lead:before {
      width: 80px;
      height: 80px;
      left: 5px
    }
    .p-sec4__photo .p-sec4__btn-area .btn_case .case-lead span {
      font-size: 1.8rem;
      margin-left: 40%
    }
  }
  
  .p-sec4__photo .p-sec4__btn-area .btn_case .txt {
    display: block;
    position: relative;
    width: 600px;
    transform: translateX(-30px);
    padding: 20px 0 20px 50px;
    margin-bottom: 20px;
    font-size: 2.4rem;
    text-align: left;
    color: #111;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  @media screen and (max-width: 1025px) {
    .p-sec4__photo .p-sec4__btn-area .btn_case .txt {
      width: 400px;
      padding: 10px 0 10px 50px;
      font-size: 2rem
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-sec4__photo .p-sec4__btn-area .btn_case .txt {
      font-size: 1.5rem
    }
  }
  
  .p-sec4__photo .p-sec4__btn-area .btn_case .txt:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .8);
    -webkit-clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 100%, 15px 100%);
    clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 100%, 15px 100%);
    z-index: -1
  }
  
  .p-sec4__photo .p-sec4__btn-area .btn_case .txt .bg {
    position: absolute;
    left: -15px;
    top: -10px;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .6);
    -webkit-clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 100%, 15px 100%);
    clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 100%, 15px 100%);
    z-index: -1;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  @media screen and (max-width: 639px) {
    .p-sec4__photo .p-sec4__btn-area .btn_case .txt .bg {
      left: -8px;
      top: -6px
    }
  }
  
  .p-sec4__photo .p-sec4__btn-area .btn_case .txt span {
    border-right: 1px solid #4eacd8;
    padding-right: 10px
  }
  
  .p-sec4__photo .p-sec4__btn-area .btn_case .arrow {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 4;
    width: 50px;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  @media screen and (max-width: 639px) {
    .p-sec4__photo .p-sec4__btn-area .btn_case .arrow {
      width: 35px
    }
  }
  
  .p-sec4__photo .p-sec4__btn-area .btn_case .arrow .cls-1 {
    fill: none;
    stroke: #492d18
  }
  
  .p-sec4__photo .p-sec4__btn-area .btn_case:hover .txt {
    color: #24487a
  }
  
  .p-sec4__photo .p-sec4__btn-area .btn_case:hover .txt .bg {
    top: 0
  }
  
  .p-sec4__photo .p-sec4__btn-area .btn_case:hover .arrow {
    right: 10px
  }
  
  .p-sec4__photo .p-sec4__txt-area {
    position: absolute;
    right: 30px;
    top: 5%;
    z-index: 4;
    background: rgba(255, 255, 255, .8);
    padding: 20px 40px
  }
  
  @media screen and (max-width: 1025px) {
    .p-sec4__photo .p-sec4__txt-area {
      left: 30px;
      right: auto
    }
  }
  
  .p-sec4__photo .p-sec4__txt-area .mtitle6 {
    margin-bottom: 0
  }
  
  .p-sec4__photo2 {
    background: url(../img/2.jpg) no-repeat center/cover
  }
  
  .p-sec4__photo2:after {
    background-image: linear-gradient(to left, #cde478 9.43%, #0096c8 49.9%, #278dc0 94.82%)
  }
  
  .p-sec4__photo3 {
    background: url(../img/3.jpg) no-repeat center/cover
  }
  
  .p-sec4__photo3:after {
    background-image: linear-gradient(to left, #cde478 9.43%, #0096c8 49.9%, #278dc0 94.82%)
  }
  
  .p-sec4__photo4 {
    background: url(../img/1.jpg) no-repeat center/cover
  }
  
  .p-sec4__photo4:after {
    background-image: linear-gradient(to left, #cde478 9.43%, #0096c8 49.9%, #278dc0 94.82%)
  }
  
  .p-sec4__cbt-area {
    padding: 60px 0
  }
  
  .p-company__shop-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
  }
  
  .p-company__shop-list .child {
    width: 100%;
    margin-top: 24px;
    padding: 20px;
    background: rgba(255, 255, 255, .8);
    border-radius: 10px;
    box-shadow: rgba(73, 45, 24, .1) 8px 10px 10px -10px
  }
  
  .p-company__shop-list .child.type1 {
    width: 100%
  }
  
  .p-company__shop-list .child:not(:first-of-type) {
    margin-top: 40px
  }
  
  @media screen and (min-width: 1101px) {
    .p-company__shop-list .child {
      width: 48%
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-company__shop-list .child {
      text-align: center
    }
  }
  
  .p-company__shop-title {
    position: relative;
    margin-bottom: 1em;
    padding: 4px 8px 4px 16px;
    border-left: 5px solid #24487a;
    color: #333;
    font-size: 1.1em;
    font-weight: 600;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    line-height: 1.4
  }
  
  .p-company__shop-tel {
    display: block;
    position: relative;
    margin-bottom: 8px;
    color: #356a09;
    font-size: 2.4rem;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.2;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .p-company__shop-tel:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px;
    font-size: .8em
  }
  
  .p-company__shop-tel:hover {
    color: #4eacd8
  }
  
  @media screen and (max-width: 639px) {
    .p-company__shop-tel {
      margin-inline: auto;
      font-size: 2rem;
      width: -moz-fit-content;
      width: fit-content
    }
  }
  
  .p-company__shop-map {
    display: flex;
    align-items: center;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: 1em;
    padding: 4px 20px;
    background: #24487a;
    border-radius: 30px;
    color: #fff;
    font-weight: 600;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .p-company__shop-map:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-right: 5px;
    color: #0e1a43
  }
  
  .p-company__shop-map:hover {
    background: #356a09
  }
  
  @media screen and (max-width: 639px) {
    .p-company__shop-map {
      margin-inline: auto
    }
  }
  
  .p-photo__insert {
    position: relative;
    overflow: hidden
  }
  
  .p-photo__insert .inner {
    margin: 0 calc(50% - 50vw);
    aspect-ratio: 4.5/1
  }
  
  @media screen and (max-width: 639px) {
    .p-photo__insert .inner {
      aspect-ratio: 3/1
    }
  }
  
  .staff-list .staff-list_inner {
    position: relative;
    padding: 1.4em 2em;
    border: 2px solid;
    -o-border-image: linear-gradient(to left, #1BB6F2 9.43%, #00C8B4 49.9%, #ADE478 94.82%);
    border-image: linear-gradient(to left, #1BB6F2 9.43%, #00C8B4 49.9%, #ADE478 94.82%);
    border-image-slice: 1;
    box-shadow: rgba(73, 45, 24, .1) 8px 10px 10px -10px;
    background: #fefefe
  }
  
  .staff-list .staff-list_inner:not(:last-of-type) {
    margin-bottom: 40px
  }
  
  .staff-list .staff-info {
    max-width: 350px
  }
  
  .staff-list .staff-comment {
    margin-top: 40px;
    letter-spacing: 0;
    font-size: .95em
  }
  
  .staff-list .staff-comment .staff-comment-lead {
    font-size: 1.2em;
    color: #39a2d3;
    margin-bottom: 1.5em
  }
  
  .p-service__head {
    position: relative
  }
  
  .p-service__head:before {
    position: absolute;
    content: "";
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: calc(100% - 80px);
    height: calc(100% - 120px);
    background: url(../img/bg-01.jpg) no-repeat center/cover;
    border-radius: 80px 0 80px 0;
    z-index: -1;
    opacity: .7
  }
  
  @media screen and (max-width: 1440px) {
    .p-service__head:before {
      width: calc(100% - 20px)
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-service__head:before {
      height: calc(100% - 60px);
      border-radius: 40px 0 40px 0
    }
  }
  
  .p-service__head .inner {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin-inline: auto;
    padding: 40px 20px
  }
  
  @media screen and (max-width: 639px) {
    .p-service__head .inner {
      padding-bottom: 20px
    }
  }
  
  .p-service__head .inner .left {
    position: absolute;
    left: 20px;
    top: 80px;
    line-height: 1
  }
  
  .p-service__head .inner .left .p-service__head-title {
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    font-size: 2.5vw;
    margin-bottom: 30px
  }
  
  .p-service__head .inner .left .p-service__head-lead span {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    padding: 6px 20px;
    background: #fff;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    font-size: 1.6vw
  }
  
  .p-service__head .inner .left .p-service__head-lead span:not(:last-of-type) {
    margin-bottom: 8px
  }
  
  @media screen and (max-width: 1440px) {
    .p-service__head .inner .left {
      left: 40px
    }
    .p-service__head .inner .left .p-service__head-title {
      font-size: 3.5vw
    }
    .p-service__head .inner .left .p-service__head-lead span {
      font-size: 2vw
    }
  }
  
  @media screen and (max-width: 1440px)and (max-width: 639px) {
    .p-service__head .inner .left {
      position: relative;
      top: auto;
      left: 20px
    }
    .p-service__head .inner .left .p-service__head-title {
      font-size: 2.2rem
    }
    .p-service__head .inner .left .p-service__head-lead span {
      font-size: 1.4rem
    }
  }
  
  .p-service__head .inner .right {
    width: 75%;
    margin-right: -5%;
    margin-left: auto
  }
  
  .p-service__head .inner .right img {
    text-align: right;
    width: 100%
  }
  
  @media screen and (max-width: 639px) {
    .p-service__head .inner .right {
      width: 105%;
      margin-top: -20px
    }
  }
  
  .p-service__feature-wrap {
    position: relative;
    margin-inline: calc(50% - 50vw);
    padding: 60px 0 80px
  }
  
  @media screen and (max-width: 639px) {
    .p-service__feature-wrap {
      padding-bottom: 40px
    }
  }
  
  .p-service__feature-wrap.type1:before {
    left: 0;
    right: auto;
    border-radius: 0 20px 20px 0
  }
  
  .p-service__feature-wrap:not(:first-of-type) {
    margin-top: 80px
  }
  
  .p-service__feature-wrap:before {
    position: absolute;
    content: "";
    right: 0;
    top: 0;
    width: calc(100% - 100px);
    height: 100%;
    background-image: linear-gradient(to right, #99d0e7, #1d6796);
    border-radius: 20px 0 0 20px;
    z-index: -1;
    opacity: .1
  }
  
  @media screen and (max-width: 1440px) {
    .p-service__feature-wrap:before {
      width: calc(100% - 20px)
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-service__feature-wrap:before {
      width: 97%
    }
  }
  
  .p-service__feature-wrap:after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../img/bg_-texture.jpg) repeat left center/contain;
    mix-blend-mode: multiply;
    opacity: .5
  }
  
  .p-service__feature-wrap .inner {
    position: relative;
    max-width: 1200px;
    margin-inline: auto
  }
  
  @media screen and (max-width: 1440px) {
    .p-service__feature-wrap .inner {
      padding: 0 40px
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-service__feature-wrap .inner {
      padding: 0 10px
    }
  }
  
  .p-service__feature-wrap .inner .p-service__flex {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 30px
  }
  
  @media screen and (max-width: 639px) {
    .p-service__feature-wrap .inner .p-service__flex {
      flex-direction: column
    }
  }
  
  .p-service__feature-wrap .inner .p-service__flex .img {
    height: 250px;
    width: 38%
  }
  
  @media screen and (max-width: 639px) {
    .p-service__feature-wrap .inner .p-service__flex .img {
      height: 200px
    }
  }
  
  .p-service__feature-wrap .inner .p-service__flex .img img {
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
  }
  
  .p-service__feature-wrap .inner .p-service__flex .txt {
    width: 60%
  }
  
  @media screen and (max-width: 639px) {
    .p-service__feature-wrap .inner .p-service__flex .img, .p-service__feature-wrap .inner .p-service__flex .txt {
      width: 100%
    }
  }
  
  .p-service__feature-wrap .inner .p-service__bottom .list_common {
    margin-bottom: 30px
  }
  
  @media screen and (max-width: 639px) {
    .p-service__feature-wrap .inner .p-service__bottom .list_common {
      margin-bottom: 20px
    }
  }
  
  .p-service__feature-wrap .inner .p-service__bottom .list_common li:last-child {
    border-bottom: 1px solid #ddd
  }
  
  .p-service__feature-wrap .inner .p-service__bottom .txt .point-txt {
    position: relative;
    z-index: 5;
    display: inline-block
  }
  
  .p-service__feature-wrap .inner .p-service__bottom .txt .point-txt .marker-c {
    background: linear-gradient(transparent 50%, #E2F0F7 0%);
    z-index: 0
  }
  
  .p-service__feature-wrap .p-service__feature-title {
    position: absolute;
    left: 0;
    top: -100px
  }
  
  @media screen and (max-width: 1440px) {
    .p-service__feature-wrap .p-service__feature-title {
      left: 50px
    }
  }
  
  .p-service__feature-wrap .p-service__feature-title .small {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    padding: 0 8px;
    border-bottom: 3px solid #4eacd8;
    font-size: 1.4rem;
    margin-bottom: 3px;
    font-family: "Lato", sans-serif
  }
  
  .p-service__feature-wrap .p-service__feature-title .main {
    display: block;
    -webkit-clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 100%, 10px 100%);
    clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 100%, 10px 100%);
    width: -moz-fit-content;
    width: fit-content;
    padding: 2px 50px;
    background-image: linear-gradient(to right, #24487a -22.57%, #74c6e8 68.82%);
    color: #fff;
    font-size: 2.4rem;
    line-height: 1.5;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600
  }
  
  @media screen and (max-width: 639px) {
    .p-service__feature-wrap .p-service__feature-title {
      position: relative;
      left: auto;
      margin-bottom: -80px
    }
    .p-service__feature-wrap .p-service__feature-title .small {
      font-size: 1.1rem
    }
    .p-service__feature-wrap .p-service__feature-title .main {
      font-size: 1.5rem;
      line-height: 1.4;
      padding: 6px 30px
    }
  }
  
  .bg-company {
    position: relative;
    padding: 80px 0
  }
  
  .bg-company:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .3
  }
  
  @media screen and (max-width: 820px) {
    .bg-company {
      padding: 40px 0
    }
  }
  
  @media screen and (max-width: 639px) {
    .bg-company {
      padding-top: 20px
    }
  }
  
  .p-company__head {
    position: relative
  }
  
  .p-company__head:before {
    position: absolute;
    content: "";
    left: 50%;
    top: 0;
    width: 100%;
    transform: translateX(-50%);
    height: 100%;
    background: url(../img/bg-company.jpg) no-repeat center bottom/cover;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 15%, #000 50%, rgba(0, 0, 0, 0.7) 85%, rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 15%, #000 50%, rgba(0, 0, 0, 0.7) 85%, rgba(0, 0, 0, 0) 100%);
    opacity: .3
  }
  
  .p-company__head .inner {
    position: relative;
    max-width: 1600px;
    margin-inline: auto;
    padding: 90px 0 120px;
    z-index: 2
  }
  
  @media screen and (max-width: 639px) {
    .p-company__head .inner {
      padding: 45px 15px
    }
  }
  
  .p-company__title {
    position: relative;
    margin-bottom: 40px;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    line-height: 1.6
  }
  
  .p-company__title span {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto
  }
  
  .p-company__title .small {
    font-size: 1.7rem;
    margin-bottom: 1em
  }
  
  .p-company__title .main {
    font-size: 2.1rem;
    text-align: center
  }
  
  .p-company__title .main em {
    display: block;
    border-bottom: 1px solid #4eacd8;
    color: #4eacd8;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 1.6em;
    text-transform: uppercase;
    line-height: 1.2
  }
  
  @media screen and (max-width: 639px) {
    .p-company__title .small {
      font-size: 1.3rem
    }
    .p-company__title .main {
      font-size: 1.8rem
    }
  }
  
  .p-company__head-txt {
    max-width: 760px;
    width: 90%;
    margin-inline: auto;
    color: #232323;
    background: rgba(0, 0, 0, 0);
    -webkit-backdrop-filter: blur(1.5px);
    backdrop-filter: blur(1.5px);
    font-size: 1.8rem;
    text-align: center
  }
  
  @media screen and (max-width: 639px) {
    .p-company__head-txt {
      font-size: 1.5rem;
      width: 100%
    }
  }
  
  .p-company__head-txt p:not(:last-child) {
    margin-bottom: 10px
  }
  
  .p-auction__list, .merit__list {
    margin-top: 60px;
    gap: 80px 2%
  }
  
  @media screen and (max-width: 639px) {
    .p-auction__list, .merit__list {
      gap: 40px 2%
    }
  }
  
  .p-auction__list>li, .merit__list>li {
    max-width: 500px;
    position: relative;
    margin-inline: auto;
    border-radius: 20px 0 20px 0
  }
  
  .p-auction__list>li figure, .merit__list>li figure {
    width: 100px;
    margin: 10px auto 0
  }
  
  .p-auction__list>li .num, .merit__list>li .num {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-direction: column;
    border-radius: 50%;
    font-weight: 600;
    font-size: 25px;
    font-family: "Lato", sans-serif;
    color: #fff;
    background: #4eacd8;
    width: 90px;
    height: 90px;
    margin: -70px auto 0;
    line-height: 1.4
  }
  
  .p-auction__list>li .num span, .merit__list>li .num span {
    font-size: 1.3rem
  }
  
  @media screen and (max-width: 639px) {
    .p-auction__list>li .num, .merit__list>li .num {
      margin-top: -35px
    }
  }
  
  .p-auction__list>li .lead, .merit__list>li .lead {
    margin-bottom: 1em;
    color: #24487a;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    font-size: 1.15em;
    text-align: center
  }
  
  .p-auction__list>li .lead .small, .merit__list>li .lead .small {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
    border-bottom: 1px solid #492d18;
    font-size: 1.5rem;
    color: #492d18
  }
  
  @media screen and (max-width: 639px) {
    .p-auction__list>li .lead .small, .merit__list>li .lead .small {
      font-size: 13px
    }
  }
  
  .p-auction__list>li .txt, .merit__list>li .txt {
    letter-spacing: 0
  }
  
  .service__cbt-area {
    position: relative;
    margin-top: -50px;
    transform: translateY(50px)
  }
  
  .service__cbt-area .cbt-lead {
    text-align: center;
    margin-bottom: 1em
  }
  
  .service__cbt-area .cbt-lead span {
    display: block;
    margin-inline: auto;
    width: -moz-fit-content;
    width: fit-content;
    font-weight: 600;
    color: #0e1a43
  }
  
  .service__cbt-area .btn-cbt {
    margin-inline: auto
  }
  
  .lead-mini {
    display: inline-block;
    font-weight: 600;
    padding: 0 4px
  }
  
  .lead-mini.type1 {
    color: #4eacd8;
    border-bottom: 1px solid #4eacd8
  }
  
  .lead-mini.type2 {
    color: #060c01;
    border-bottom: 1px solid #356a09
  }
  
  .download-box {
    background: #fff;
    padding: 12px 20px;
    position: relative;
    max-width: 500px;
    margin-top: 20px
  }
  
  .download-box .lead {
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 1.8rem;
    color: rgba(14, 26, 67, .7);
    margin: -25px 0 5px
  }
  
  @media screen and (max-width: 639px) {
    .download-box {
      padding: 15px
    }
  }
  
  .download-list li {
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .download-list li:hover {
    background: #fff
  }
  
  .download-list li .txt {
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 1.5rem
  }
  
  .download-list li .txt .num {
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    color: #24487a;
    font-size: 1.7em;
    margin-right: 8px
  }
  
  .download-list li .txt .small {
    font-size: 12px
  }
  
  .download-list li .linkbtn-area {
    display: flex;
    width: 188px
  }
  
  .download-list li .linkbtn-area .linkbtn {
    display: block
  }
  
  .download-list li .linkbtn-area .linkbtn:first-of-type {
    margin-right: 8px
  }
  
  .download-list li:not(:last-of-type) {
    margin-bottom: 5px;
    border-bottom: 1px solid #ccae8b
  }
  
  @media screen and (max-width: 639px) {
    .download-list li {
      flex-direction: column;
      align-items: flex-start
    }
    .download-list li .txt {
      font-size: 1.2rem
    }
    .download-list li .txt .num {
      font-size: 1.4em
    }
    .download-list li .link-btn-area {
      width: auto
    }
  }
  
  .linkbtn {
    display: block;
    padding: 6px 10px;
    border-radius: 40px;
    line-height: 1.2;
    min-width: 90px;
    font-size: 1.4rem;
    font-weight: 600;
    text-align: center;
    color: #fff
  }
  
  @media screen and (max-width: 639px) {
    .linkbtn {
      font-size: 13px
    }
  }
  
  .linkbtn:before {
    margin-right: 6px;
    font-size: .8em
  }
  
  .linkbtn.btn-pdf {
    background: #ff3500
  }
  
  .linkbtn.btn-pdf:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900
  }
  
  .linkbtn.btn-excel {
    background: #1d6f42
  }
  
  .linkbtn.btn-excel:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900
  }
  
  .linkbtn.btn-word {
    background: #0173c7
  }
  
  .linkbtn.btn-word:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900
  }
  
  .c-pdf {
    display: inline-block;
    padding: 0 4px;
    background: #ff3500;
    color: #fff;
    margin: 0 2px;
    border-radius: 4px
  }
  
  .c-excel {
    display: inline-block;
    padding: 0 4px;
    background: #1d6f42;
    color: #fff;
    margin: 0 2px;
    border-radius: 4px
  }
  
  .video-wrap {
    width: 60%;
    margin-inline: auto
  }
  
  @media screen and (max-width: 639px) {
    .video-wrap {
      width: 100%
    }
  }
  
  .p-recruit_head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px
  }
  
  .p-recruit_head .p-recruit_head-txt {
    width: 35%;
    padding-left: 15px
  }
  
  .p-recruit_head .p-recruit_head-txt .p-recruit_head-lead {
    margin-bottom: 20px
  }
  
  @media screen and (max-width: 1025px) {
    .p-recruit_head {
      flex-direction: column
    }
    .p-recruit_head .p-recruit_head-txt {
      width: 80%;
      margin-top: 30px;
      padding-left: 0;
      order: 2
    }
  }
  
  .p-recruit_head-imgwrap {
    margin: 0 calc(50% - 50vw) -80px;
    display: flex;
    flex-wrap: wrap
  }
  
  .p-recruit_head-imgwrap figure {
    height: 350px
  }
  
  .p-recruit_head-imgwrap figure:first-of-type {
    width: 50%
  }
  
  .p-recruit_head-imgwrap figure:nth-of-type(2) {
    width: 30%
  }
  
  .p-recruit_head-imgwrap figure:nth-of-type(3) {
    width: 20%
  }
  
  @media screen and (max-width: 639px) {
    .p-recruit_head-imgwrap {
      margin-left: auto
    }
    .p-recruit_head-imgwrap figure:first-of-type {
      width: 100%;
      height: 180px
    }
    .p-recruit_head-imgwrap figure:nth-of-type(2) {
      width: 50%;
      height: 180px
    }
    .p-recruit_head-imgwrap figure:nth-of-type(3) {
      width: 50%;
      height: 180px
    }
  }
  
  .bg-recruit {
    position: relative
  }
  
  .bg-recruit:before {
    position: absolute;
    content: "";
    right: 0;
    top: 20%;
    width: 95%;
    height: 100%;
    background-image: linear-gradient(to right, #24487a, #0E1A43);
    opacity: .3
  }
  
  @media screen and (max-width: 639px) {
    .bg-recruit:before {
      width: 97%
    }
  }
  
  .point-list li {
    position: relative;
    padding: 5px 8px 5px 40px;
    border-bottom: 2px solid #f3f6f5
  }
  
  .point-list li .num {
    display: inline-block;
    position: absolute;
    left: 5px;
    top: 5px;
    color: #24487a;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 2.6rem;
    line-height: 1;
    margin-right: 4px
  }
  
  @media screen and (max-width: 639px) {
    .point-list li .num {
      font-size: 2rem
    }
  }
  
  .p-recruit_info-list {
    max-width: 1000px;
    margin-inline: auto
  }
  
  .p-recruit_info-list .child {
    background: #fff;
    padding: 30px 20px 20px;
    border-radius: 0 0 20px 0;
    border-bottom: 6px solid #e7ebec
  }
  
  .p-recruit_info-list .p-recruit_lead02 {
    position: relative;
    max-width: 75%;
    margin: -55px auto 20px
  }
  
  @media screen and (max-width: 639px) {
    .p-recruit_info-list .p-recruit_lead02 {
      max-width: 85%;
      margin-top: -50px
    }
  }
  
  @keyframes flash {
    0% {
      opacity: .4
    }
    100% {
      opacity: 1
    }
  }
  
  @keyframes animation-bar {
    0% {
      left: 0;
      width: 0
    }
    50% {
      left: 0;
      width: 100%
    }
    51% {
      left: 0;
      width: 100%
    }
    100% {
      left: 100.5%;
      width: 0
    }
  }
  
  @keyframes animation-txt {
    0% {
      opacity: 0
    }
    50% {
      opacity: 0
    }
    100% {
      opacity: 1
    }
  }
  
  .animation-content.move .animation-bar:before {
    animation: animation-bar 1s ease 0s 1 normal forwards
  }
  
  .animation-content.move .animation-txt {
    animation: animation-txt 0s ease .8s 1 normal forwards
  }
  
  .animation-content .animation-box {
    display: block;
    text-align: center
  }
  
  .animation-content .animation-bar {
    position: relative;
    display: block;
    transform: translate3d(0, 0, 0)
  }
  
  .animation-content .animation-bar:before {
    content: "";
    display: inline-block;
    width: 0;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    background-image: linear-gradient(to right, #9fc4dc, #81c3dd)
  }
  
  .animation-content .animation-txt {
    opacity: 0;
    transform: translate3d(0, 0, 0)
  }
  
  .effect_fade {
    opacity: 0;
    transform: translate(0, 45px);
    transition: all 2s
  }
  
  .effect_fade.effect_scroll {
    opacity: 1;
    transform: translate(0, 0)
  }
  
  .btn-fixed {
    position: fixed;
    right: 0;
    top: 180px;
    z-index: 60
  }
  
  @media screen and (min-width: 1025px) {
    .btn-fixed {
      width: 63px
    }
  }
  
  @media screen and (max-width: 639px) {
    .btn-fixed {
      display: none
    }
  }
  
  .btn-fixed a {
    position: relative;
    display: block;
    padding: 15px 10px 15px 0;
    z-index: 2
  }
  
  .btn-fixed a:before {
    position: absolute;
    content: "";
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to right, #24487a -22.57%, #74c6e8 68.82%);
    transform: translateX(10px);
    -webkit-clip-path: polygon(0 4%, 100% 0, 100% 100%, 0 92%);
    clip-path: polygon(0 4%, 100% 0, 100% 100%, 0 92%)
  }
  
  .btn-fixed a span {
    display: block;
    position: relative;
    padding: 25px 12px;
    background-image: linear-gradient(to bottom, #152765, #0E1A43);
    -webkit-clip-path: polygon(0 3%, 100% 0, 100% 100%, 0 93%);
    clip-path: polygon(0 3%, 100% 0, 100% 100%, 0 93%);
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-feature-settings: "pkna";
    font-weight: 600;
    font-size: 1.8rem;
    color: #fff;
    box-shadow: 0 0 12px rgba(0, 0, 0, .5);
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .btn-fixed a span:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    font-weight: 900;
    margin-bottom: 8px;
    color: #fff
  }
  
  .btn-fixed a:hover span {
    transform: translateX(5px)
  }
  
  @media screen and (max-width: 1101px) {
    .btn-fixed {
      top: 100px
    }
  }
  
  @media screen and (max-width: 639px) {
    .btn-fixed {
      top: auto;
      right: auto;
      left: 50%;
      transform: translateX(-50%);
      bottom: 5px;
      width: 100%
    }
    .btn-fixed a {
      padding: 0 40px 4px
    }
    .btn-fixed a span {
      width: -moz-fit-content;
      width: fit-content;
      margin-inline: auto;
      padding: 10px 25px;
      background-image: linear-gradient(to right, #152765, #0E1A43);
      writing-mode: inherit;
      font-size: 1.3rem;
      white-space: nowrap;
      -webkit-clip-path: polygon(6% 0, 94% 0, 100% 100%, 0 100%);
      clip-path: polygon(6% 0, 94% 0, 100% 100%, 0 100%)
    }
    .btn-fixed a span:before {
      margin: 0 8px 0 0
    }
    .btn-fixed a:before {
      -webkit-clip-path: none;
      clip-path: none;
      transform: translateY(15px);
      opacity: .6
    }
    .btn-fixed a:hover span {
      transform: none
    }
  }
  
  .voice-wrap {
    padding-top: 30px
  }
  
  @media screen and (max-width: 1101px) {
    .voice-wrap {
      padding: 30px 20px
    }
  }
  
  .voice-wrap>li a {
    position: relative;
    display: block;
    height: 100%
  }
  
  .voice-wrap>li a:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    margin-top: -2.5%;
    margin-left: -2.5%;
    width: 105%;
    height: 105%;
    background: #f3f6f5;
    border-radius: 25px;
    z-index: -1;
    transition: all .4s cubic-bezier(0.175, 0.4, 0.3, 1.1)
  }
  
  .voice-wrap>li a figure {
    position: relative;
    aspect-ratio: 4/2.5;
    overflow: hidden;
    border-radius: 20px 20px 0 20px
  }
  
  .voice-wrap>li a figure img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .voice-wrap>li a figure figcaption {
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 6px 20px;
    border-radius: 0 15px 0 0;
    background: rgba(78, 172, 216, .8);
    color: #fff;
    font-family: "Lato", sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.2;
    z-index: 2
  }
  
  .voice-wrap>li a figure figcaption:before {
    display: block;
    position: absolute;
    content: attr(data-title);
    left: 0;
    top: -70px;
    height: 70px;
    padding: 8px 2px;
    border-radius: 0 15px 0 0;
    font-family: "Lato", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 22px;
    text-align: center;
    line-height: 1.2;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-feature-settings: "pkna";
    background: rgba(0, 0, 0, .6)
  }
  
  .voice-wrap>li a .voice-lead {
    font-weight: 600;
    padding: 15px;
    color: #222
  }
  
  @media screen and (min-width: 1101px) {
    .voice-wrap>li a .voice-lead {
      font-size: 1.5rem
    }
  }
  
  .voice-wrap>li a:hover:before {
    transform: scale(0.96, 0.94)
  }
  
  .voice-wrap>li a:hover figure img {
    transform: scale(1.1)
  }
  
  .p-case__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px 2.5%
  }
  
  @media screen and (max-width: 1101px) {
    .p-case__list {
      grid-template-columns: repeat(2, 1fr)
    }
  }
  
  @media screen and (max-width: 639px) {
    .p-case__list {
      grid-template-columns: 1fr
    }
  }
  
  .p-case__list li {
    position: relative;
    background: #fff
  }
  
  .p-case__list a {
    position: relative;
    display: block;
    aspect-ratio: 5/3.2;
    overflow: hidden
  }
  
  .p-case__list a:before, .p-case__list a:after {
    position: absolute;
    opacity: 0;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .p-case__list a:before {
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 2
  }
  
  .p-case__list a:after {
    display: flex;
    align-items: center;
    justify-content: center;
    content: "+";
    font-weight: 600;
    left: 50%;
    top: 50%;
    width: 60px;
    height: 60px;
    background: rgba(36, 72, 122, .6);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 30px;
    text-align: center;
    z-index: 3
  }
  
  .p-case__list a img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: .3s all cubic-bezier(0.18, 0.06, 0.23, 1)
  }
  
  .p-case__list a:hover:before {
    opacity: .5
  }
  
  .p-case__list a:hover:after {
    opacity: 1
  }
  
  .p-case__list a:hover img {
    transform: scale(1.1)
  }
  
  .p-case__list .p-case__txt-area {
    position: relative;
    min-height: 100px;
    padding: 20px;
    z-index: 4
  }
  
  .p-case__list .p-case__category {
    position: relative;
    max-width: 120px;
    margin: -36px 0 16px -20px;
    border-left: 4px solid #24487a;
    background: #0e1a43;
    color: #fff;
    font-family: "Noto Serif JP", "YakuHanMP", Lato, "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
    font-weight: 600;
    padding: 2px 8px 2px 12px
  }
  
  .p-case__list .p-case__category.category02 {
    background: #231815
  }
  
  .p-case__list .p-case__category.category03 {
    background: #538580
  }
  
  .p-case__list .p-case__category.category04 {
    background: #737b60
  }
  
  .p-case__list .p-case__location {
    display: flex;
    padding-right: 115px;
    font-size: 1.4rem;
    line-height: 1.6;
    letter-spacing: 0
  }
  
  .p-case__list .p-case__location dt {
    width: 4.5em
  }
  
  .p-case__list .p-case__location dd {
    width: calc(100% - 4.5em)
  }
  
  @media screen and (max-width: 639px) {
    .p-case__list .p-case__location {
      font-size: 1.15rem
    }
  }
  
  .p-case__list .p-case__date {
    position: absolute;
    right: 16px;
    top: 16px;
    width: 110px
  }
  
  .p-case__list .date {
    font-family: "Lato", sans-serif;
    font-weight: 700;
    color: #492d18;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.8;
    text-align: center
  }
  
  @media screen and (max-width: 639px) {
    .p-case__list .date {
      font-size: 16px
    }
  }
  
  .contact-top-txt {
    margin-bottom: 30px
  }
  
  .form-contents {
    width: 100% !important;
    padding: 0 !important;
    background: none !important
  }
  
  .form-contents div {
    padding: 15px 8px;
    background: rgba(143, 205, 219, .4);
    max-width: 500px;
    margin: 0 auto 10px
  }
  
  .form-contents div .pattern-exclusion {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    padding-left: 0 !important
  }
  
  .form-contents .textarea, .form-contents textarea {
    border: 0;
    height: auto !important;
    padding: 15px;
    width: 100%;
    border-radius: 0;
    -webkit-appearance: none;
    background: #ebebeb
  }
  
  .form-contents form dl dt {
    font-weight: 600 !important;
    width: 240px !important
  }
  
  .form-contents form dl dt .required:before {
    background: #4eacd8 !important
  }
  
  @media screen and (max-width: 1025px) {
    .form-contents form dl dt {
      float: none !important;
      width: auto !important
    }
  }
  
  .form-contents form dl dd {
    padding-left: 250px !important
  }
  
  @media screen and (max-width: 1025px) {
    .form-contents form dl dd {
      padding-left: 0 !important
    }
  }
  
  .form-contents .submit-btn {
    background: #24487a !important;
    border: 1px solid #24487a !important
  }
  
  .form-contents .submit-btn:hover {
    background: #fefefe !important;
    color: #24487a !important
  }
  
  .form-contents .submit-btn:hover:before {
    background-color: #24487a !important
  }
  
  
  /*# sourceMappingURL=basis.css.map */