html {
   font-family: "Noto Sans JP", sans-serif;
}

@media screen and (min-width: 1000px) {
   .sp-only {
      display: none;
   }
}

/*************************
   ローディング
*************************/
#splash {
   position: fixed;
   width: 100vw;
   height: 100vh;
   z-index: 99999;
   background: #fff;
   text-align: center;
}

#splash_logo {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}

#splash_logo img {
   width: 123px;
}

.fadeUp {
   animation-name: fadeUpAnime;
   animation-duration: 0.5s;
   animation-fill-mode: forwards;
   opacity: 0;
}

@keyframes fadeUpAnime {
   from {
      opacity: 0;
   }

   to {
      opacity: 1;
   }
}

@media screen and (min-width: 680px) {
   #splash_logo img {
      width: 200px;
   }
}

/*************************
   header
*************************/
header {
   border-bottom: 1px solid rgb(35 24 21 / 80%);
}

.header__logo {
   width: 160px;
   margin: 0 auto;
   display: block;
}

.header__logo a {
   width: 100%;
   padding: 10px 0 7px;
}

.header__logo a img {
   width: 100%;
}

.header__toggle {
   display: none;
}

@media screen and (min-width: 680px) {
   header {
      width: 100%;
      height: 60px;
      background: #fff;
      position: fixed;
      z-index: 1000;
      -webkit-backface-visibility: hidden;
   }

   .header__logo {
      width: 280px;
   }

   .header__logo a {
      width: 100%;
      padding: 16px 0 11px;
   }

   .header__logo a img {
      width: 100%;
   }

   .header__toggle {
      display: block;
   }
}

/*************************
   fv
*************************/
.fv {
   position: relative;
}

@media screen and (min-width: 680px) {
   .fv {
      padding-top: 60px;
   }
}

/*==================================================
スライダーのためのcss
===================================*/
.slider {
   position: relative;
   z-index: 1;
}

.slick-initialized .slick-slide {
   height: calc(100vh - 36px);
}

.slider-item {
   position: relative;
}

.slider-item01 img,
.slider-item02 img,
.slider-item03 img,
.slider-item04 img {
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
}

.slider-item01 img {
   top: 25%;
   width: 280px;
}

.slider-item02 img {
   top: 30%;
   width: 200px;
}

.slider-item03 img {
   top: 30%;
   width: 200px;
}

.slider-item04 .slider-item04-img01 {
   top: 15%;
   width: 280px;
}

.slider-item04 .slider-item04-img02 {
   bottom: 25%;
   width: 150px;
}
/*　背景画像設定　*/
.slider-item01::before,
.slider-item02::before,
.slider-item03::before,
.slider-item04::before {
   content: "";
   display: inline-block;
   background-repeat: no-repeat;
   background-size: cover;
   position: absolute;
   top: 5%;
   right: 5px;
   width: 30px;
   height: 60px;
   z-index: 10;
}

.slider-item01::before {
   background-image: url(../images/fv-01-btn.svg);
}

.slider-item02::before {
   background-image: url(../images/fv-02-btn.svg);
}

.slider-item03::before {
   background-image: url(../images/fv-03-btn.svg);
}

.slider-item04::before {
   background-image: url(../images/fv-04-btn.svg);
}


/*　背景画像設定　*/
.slider-item01::after,
.slider-item02::after,
.slider-item03::after,
.slider-item04::after {
   content: "";
   display: inline-block;
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
   position: absolute;
   top: 0;
   right: 0;
   width: 100%;
   height: 100%;
   z-index: -1;
}

.slider-item01::after {
   background-image: url(../images/fv-01.png);
}

.slider-item02::after {
   background-image: url(../images/fv-02.png);
}

.slider-item03::after {
   background-image: url(../images/fv-03.png);
}

.slider-item04::after {
   background-image: url(../images/fv-04.png);
}

.slider-item span::before {
   content: "";
   display: inline-block;
   width: 10px;
   height: 100%;
   background: #EE7300;
   position: absolute;
   top: 0;
   right: 0;
   z-index: 10;
}

.slider-item:last-of-type span::before {
   content: "";
   display: inline-block;
   width: 10px;
   height: 100%;
   background: #004FA2;
   position: absolute;
   top: 0;
   right: 0;
   z-index: 10;
}

/*矢印の設定*/

.slick-next {
   position: absolute;
   z-index: 3;
   top: 6%;
   right: 0;
   cursor: pointer;
   height: 50px;
   width: 30px;
   z-index: 100;
}

.slick-prev {
   display: none;
}

@media screen and (min-width: 680px) {

   .slick-initialized .slick-slide {
      height: calc(100vh - 60px);
   }
   .slider-item01::before,
   .slider-item02::before,
   .slider-item03::before,
   .slider-item04::before {
      top: 5%;
      right: 5px;
      width: 50px;
      height: 100px;
   }

   .slider-item01 img {
      top: 25%;
      width: 450px;
   }

   .slider-item02 img {
      top: 20%;
      width: 280px;
   }

   .slider-item03 img {
      top: 25%;
      width: 240px;
   }

   .slider-item04 .slider-item04-img01 {
      top: 7%;
      width: 380px;
   }
   
   .slider-item04 .slider-item04-img02 {
      bottom: 20%;
      width: 210px;
   }
   .slider-item01::after {
      background-image: url(../images/fv-01-pc.jpg);
   }

   .slider-item02::after {
      background-image: url(../images/fv-02-pc.jpg);
   }

   .slider-item03::after {
      background-image: url(../images/fv-03-pc.jpg);
   }

   .slider-item04::after {
      background-image: url(../images/fv-04-pc.jpg);
   }

   .slick-next {
      top: 5%;
      height: 100px;
      width: 50px;
   }
}

/*************************
   news
*************************/
.news {
   padding: 30px 0;
   background: #EFEFEF;
}

.news__title {
   width: 90px;
   margin: 0 auto;
}

.news__list {
   max-width: 440px;
   width: 100%;
   padding: 10px 20px 15px;
   margin: 0 auto;
}

.news__btn {
   text-align: center;
}

.news__btn a {
   background: #fff;
   padding: 12px 50px 12px;
   position: relative;
   font-size: 13px;
}

.news__btn a::before {
   content: "";
   display: inline-block;
   background-image: url(../images/btn.svg);
   background-repeat: no-repeat;
   background-size: cover;
   width: 13px;
   height: 13px;
   position: absolute;
   top: 50%;
   right: 15px;
   transform: translateY(-50%);
}

@media screen and (min-width: 680px) {
   .news {
      padding: 80px 0;
   }

   .news__title {
      width: 130px;
   }

   .news__list {
      max-width: 1000px;
      width: 100%;
      padding: 30px 30px 40px;
      margin: 0 auto;
   }

   .news__btn a {
      padding: 11px 70px 12px;
      font-size: 16px;
   }

   .news__btn a img {
      width: 70px;
   }

   .news__btn a::before {
      width: 18px;
      height: 18px;
   }
}

@media screen and (min-width: 1000px) {

   .news__list {
      max-width: 1340px;
   }
}

/*************************
   link
*************************/
.link__box {
   padding: 20px;
}

.link__item {
   width: 100%;
   position: relative;
   text-align: center;
   margin: 0 auto 20px;
}

.link__item-01--text-02 {
   width: 36%;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   z-index: 100;
}

.link__item:nth-of-type(3) .link__item-01--text-02 {
   width: 46%;
}

.link__item-text {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   color: #fff;
   z-index: 200;
}

.link__item-01--text {
   width: 200px;
}

.link__item a {
   width: 100%;
   height: 100%;
   font-size: 30px;
   position: relative;
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
}

.link__item-02 a::before,
.link__item-03 a::before,
.link__item-04 a::before {
   content: "";
   display: inline-block;
   background-repeat: no-repeat;
   background-size: cover;
   width: 100%;
   height: 100%;
   position: absolute;
   top: 0;
   left: 0;
   z-index: 100;
   mix-blend-mode: multiply;
}

.link__item-02 a::before {
   background: url(../images/works-bg2.svg);
}

.link__item-03 a::before {
   background: url(../images/company-bg2.svg);
}

.link__item-04 a::before {
   background: url(../images/recruit-bg2.svg);
}

.link__item-text {
   font-size: 30px;
}

.link__item-text span {
   font-size: 10px;
   display: block;
}


@media screen and (min-width: 680px) {

   .link__box {
      padding: 50px 20px;
   }

   .link__list {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      justify-content: center;
      gap: 20px;
      margin: 0 auto;
   }

   .link__item {
      width: 100%;
      margin: 0 auto 0;
   }

   .link__item a {
   }
}

@media screen and (min-width: 1280px) {

   .link__list {
      display: flex;
      align-items: center;
      justify-content: center;
      max-width: 1340px;
      padding: 0 30px;
      gap: 10px;
      flex-wrap: wrap;

   .link__item {
      width: calc( 50% - 10px);
      margin: 0 auto 0;
   }

   .link__item a {
      width: 100%;
   }

}
}

/*************************
   about
*************************/
.about {
   background: #004FA2;
   color: #fff;
   padding: 30px 15px;
   line-height: 1.5;
}

.about__title {
   width: 120px;
   margin: 0 auto;
}

.about__wrap {
   width: 340px;
   margin: 15px auto 0;
   font-size: 12px;
}

.about__text-01 {
   padding-left: 20px;
   border-left: solid 0.5px rgb(255 255 255 / 70%);
   margin-bottom: 38px;
}

.about__text-01 a {
   width: 27px;
   margin-left: 10px;
}

.about__text-01 a img {
   padding-bottom: 1px;
}

.about__text-02 {
   padding-left: 20px;
   border-left: solid 0.5px rgb(255 255 255 / 70%);
   margin-bottom: 20px;
}

.about__text-03 {
   padding-left: 20px;
   border-left: solid 0.5px rgb(255 255 255 / 70%);
}

@media screen and (min-width: 680px) {
   .about {
      background: #004FA2;
      color: #fff;
      padding: 80px 0;
      line-height: 1.7;
   }

   .about__title {
      width: 170px;
      margin: 0 auto;
   }

   .about__wrap {
      display: flex;
      justify-content: center;
      gap: 20px;
      width: 100%;
      margin: 20px auto 0;
      font-size: 11px;
   }

   .about__text-01 {
      padding-left: 20px;
      border-left: solid 1px #fff;
      margin-bottom: 20px;
   }

   .about__text-01 a img {
      padding-bottom: 3px;
   }

   .about__text-02 {
      padding-left: 20px;
      border-left: solid 1px #fff;
      margin-bottom: 20px;
   }

   .about__text-03 {
      padding-left: 20px;
      border-left: solid 1px #fff;
   }
}

@media screen and (min-width: 900px) {
   .about__wrap {
      gap: 40px;
      width: 100%;
      margin: 30px auto 0;
      font-size: 16px;
   }

   .about__text-01 a {
      width: 35px;
      margin-left: 13px;
   }

   .about__text-01 a img {
      padding-bottom: 6px;
   }
}

/*************************
   access
*************************/
.access {
   padding: 30px 0 0;
   margin-bottom: 41px;
   background: #EE7300;
}

.access__title {
   width: 115px;
   margin: 0 auto;
}

.access p {
   color: #EFEFEF;
   font-size: 12px;
   text-align: center;
   margin-top: 10px;
}

.map {
   margin-top: 15px;
}

.map iframe {
   width: 100%;
   height: 200px;
}

.copyright {
   padding: 3px 0 11px;
   text-align: center;
}

.copyright img {
   width: 100px;
}

@media screen and (min-width: 680px) {
   .access {
      padding: 60px 0 0;
      margin-bottom: 0;
   }

   .access__title {
      width: 160px;
      margin: 0 auto;
   }

   .access p {
      color: #EFEFEF;
      font-size: 16px;
      text-align: center;
      margin-top: 30px;
   }

   .map {
      margin-top: 20px;
   }

   .map iframe {
      height: 400px;
   }

   .copyright {
      padding: 15px 0;
   }

   .copyright img {
      width: 150px;
   }
}

/*************************
   ボトムナビ
*************************/
.bottom-nav {
   position: fixed;
   z-index: 200;
   bottom: 0px;
   width: 100%;
}

.bottom-nav::before {
   content: "";
   display: inline-block;
   background-image: url(../images/scroll.svg);
   background-repeat: no-repeat;
   background-size: cover;
   width: 35px;
   height: 27px;
   position: absolute;
   top: -27px;
   left: 50%;
   transform: translateX(-50%);
   z-index: 100;
   visibility: visible;
   opacity: 1;
   transition: .3s;
}

.hide-before::before {
   visibility: hidden;
   opacity: 0;
}

.bottom-nav__list {
   display: flex;
   width: 100%;
   text-align: center;
   position: relative;
   z-index: 1000;
}

.bottom-nav__item {
   width: 29%;
   border: solid 0.5px #004FA2;
   border-right: none;
   background: #fff;
}

.bottom-nav__item:nth-of-type(4) {
   width: 13%;
   background-color: #004FA2;
}

.bottom-nav__item a {
   width: 100%;
   padding: 8px 0px;
}

.bottom-nav__item:nth-of-type(1) a img {
   width: 65px;
}

.bottom-nav__item:nth-of-type(2) a img {
   width: 70px;
}

.bottom-nav__item:nth-of-type(3) a img {
   width: 55px;
}

/* ハンバーガーメニュー */
.toggle-menu {
   display: inline-block;
   width: 100%;
   height: 100%;
   position: relative;
   z-index: 100;
}


.toggle-menu .toggle-line {
   display: block;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   text-indent: -9999px;
   width: 20px;
   height: 2px;
   background-color: #fff;
   border-radius: 5px;
}

.toggle-menu .toggle-line::before,
.toggle-menu .toggle-line::after {
   content: "";
   position: absolute;
   left: 0;
   width: 20px;
   height: 2px;
   background-color: #fff;
   transition: .3s;
   border-radius: 5px;
}

.toggle-menu .toggle-line::before {
   top: -7px;
   -webkit-animation: menu-barTop 0.6s forwards;
   animation: menu-barTop 0.6s forwards;
}

.toggle-menu .toggle-line::after {
   top: 7px;
   -webkit-animation: menu-barBottom 0.6s forwards;
   animation: menu-barBottom 0.6s forwards;
}

.bottom-menu {
   position: fixed;
   top: 0;
   left: 0;
   padding: 0 20px 0;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -webkit-flex-direction: column;
   -ms-flex-direction: column;
   flex-direction: column;
   width: 100vw;
   height: 100vh;
   background-color: #F1BF8E;
   z-index: 110;
   -webkit-transform: translateX(100%);
   -ms-transform: translateX(100%);
   transform: translateX(100%);
   -webkit-transition: 0.3s ease-out;
   transition: 0.3s ease-out;
}


.open .toggle-menu {
   -webkit-transition: all 0.5s linear 1s;
   transition: all 0.5s linear 1s;
}

.open .toggle-menu .toggle-line {
   height: 0;
}

.open .toggle-menu .toggle-line::before {
   -webkit-animation: active-menu-barTop 0.6s forwards;
   animation: active-menu-barTop 0.6s forwards;
   transform: rotate(-45deg);
   top: 0;
}

.open .toggle-menu .toggle-line::after {
   -webkit-animation: active-menu-barBottom 0.6s forwards;
   animation: active-menu-barBottom 0.6s forwards;
   transform: rotate(45deg);
   top: 0;
}

.open .bottom-menu {
   -webkit-transform: translateX(0);
   -ms-transform: translateX(0);
   transform: translateX(0);
   overflow: auto;
}

.bottom-menu {
   padding: 40px 20px;
}

.bottom-menu__title {
   width: 80%;
   padding-left: 20px;
}

.bottom-menu__list {
   padding: 20px 20px;
   margin-top: 15px;
   background: #fff;
}

.bottom-menu__item {
   margin-top: 1.2em;
   color: #9FA0A0;
}

.bottom-menu__item:first-of-type {
   margin-top: 0;
}

.bottom-menu__item a {
   width: 100%;
}

.bottom-menu__item:nth-of-type(1) a img {
   width: 140px;
}

.bottom-menu__item:nth-of-type(2) a img {
   width: 250px;
}

.bottom-menu__item:nth-of-type(3) a img {
   width: 190px;
}

.bottom-menu__item:nth-of-type(4) a img {
   width: 190px;
}

.bottom-menu__recruit,
.bottom-menu__contact {
   background-color: #fff;
   font-size: 20px;
   color: #EE7300;
}

.bottom-menu__recruit {
   margin-top: 15px;
}

.bottom-menu__recruit a img {
   width: 150px;
}

.bottom-menu__contact {
   margin-top: 10px;
}

.bottom-menu__contact a img {
   width: 160px;
}

.bottom-menu__recruit a,
.bottom-menu__contact a {
   width: 100%;
   padding: 5px 20px 12px;
}

.bottom-menu__sns {
   padding: 15px 20px;
   margin-top: 10px;
}

.bottom-menu__sns a {
   width: 100%;
   display: flex;
   align-items: center;
   font-size: 12px;
   color: #004FA2;
}

.bottom-menu__sns a p {
   font-size: 12px;
   padding-left: 15px;
}

.bottom-menu__instagram {
   margin-bottom: 15px;
}

.bottom-menu__instagram img {
   width: 30px;
}

.bottom-menu__tiktok img {
   width: 30px;
}

.bottom-menu p.bottom-menu__copyright {
   font-size: 12px;
   padding: 5px 0 5px 20px;
}

@media screen and (min-width: 680px) {
   .bottom-nav__list {
      display: none;
   }
}

@media screen and (min-width: 680px) {

   .header__toggle {
      width: 60px;
      height: 60px;
      background: #004FA2;
      position: absolute;
      top: 0;
      right: 0;
   }


   .header__toggle .toggle-menu .toggle-line {
      width: 40px;
      height: 2px;
      background-color: #fff;
      border-radius: 5px;
   }

   .header__toggle .toggle-menu .toggle-line::before,
   .header__toggle .toggle-menu .toggle-line::after {
      content: "";
      position: absolute;
      left: 0;
      width: 40px;
      height: 2px;
      background-color: #fff;
      transition: .3s;
      border-radius: 5px;
   }

   .header__toggle .toggle-menu .toggle-line::before {
      top: -11px;
      -webkit-animation: menu-barTop 0.6s forwards;
      animation: menu-barTop 0.6s forwards;
   }

   .header__toggle .toggle-menu .toggle-line::after {
      top: 11px;
      -webkit-animation: menu-barBottom 0.6s forwards;
      animation: menu-barBottom 0.6s forwards;
   }

   .bottom-menu {
      position: fixed;
      top: 60px;
      right: 0;
      left: unset;
      padding: 40px 20px;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column;
      width: 400px;
      height: 100vh;
      background-color: #F1BF8E;
      z-index: 90;
      -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
      transform: translateX(100%);
      -webkit-transition: 0.3s ease-out;
      transition: 0.3s ease-out;
   }


   .header__toggle .open.toggle-menu {
      -webkit-transition: all 0.5s linear 1s;
      transition: all 0.5s linear 1s;
   }

   .header__toggle .open.toggle-menu .toggle-line {
      height: 0;
   }

   .header__toggle .open.toggle-menu .toggle-line::before {
      -webkit-animation: active-menu-barTop 0.6s forwards;
      animation: active-menu-barTop 0.6s forwards;
      transform: rotate(-45deg);
      top: 0;
   }

   .header__toggle .open.toggle-menu .toggle-line::after {
      -webkit-animation: active-menu-barBottom 0.6s forwards;
      animation: active-menu-barBottom 0.6s forwards;
      transform: rotate(45deg);
      top: 0;
   }

   .open .bottom-menu {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0);
      overflow: auto;
   }

   .bottom-menu__title {
      width: 80%;
      padding-left: 20px;
   }


   .bottom-menu__list {
      padding: 20px 20px;
      margin-top: 15px;
      background: #fff;
   }

   .bottom-menu__item:first-of-type {
      margin-top: 0;
      color: #004FA2;
   }

   .bottom-menu__item a span {
      font-size: 14px;
      padding-left: 20px;
   }

   .bottom-menu__recruit {
      margin-top: 15px;
   }

   .bottom-menu__contact {
      margin-top: 10px;
   }

   .bottom-menu__sns {
      padding: 15px 20px;
      margin-top: 10px;
   }

   .bottom-menu__sns a {
      width: 100%;
      display: flex;
      align-items: center;
      font-size: 12px;
   }

   .bottom-menu__instagram {
      margin-bottom: 15px;
   }

   .bottom-menu p.bottom-menu__copyright {
      font-size: 12px;
      padding: 5px 0 5px 20px;
   }

   .bottom-nav::before {
      width: 61px;
      height: 45px;
      top: -45px;
   }
}

@media screen and (min-width: 1000px) {

   .bottom-menu {
      width: 450px;
   }

   .bottom-menu__title {
      width: 80%;
      padding-left: 20px;
   }


   .bottom-menu__list {
      padding: 20px 20px;
      margin-top: 15px;
      background: #fff;
   }

   .bottom-menu__item {
      margin-top: 1.5em;
   }

   .bottom-menu__item:first-of-type {
      margin-top: 0.2em;
      color: #004FA2;
   }

   .bottom-menu__item a span {
      font-size: 14px;
      padding-left: 20px;
   }

   .bottom-menu__item:nth-of-type(1) a img {
      width: 152px;
   }

   .bottom-menu__item:nth-of-type(2) a img {
      width: 275px;
   }

   .bottom-menu__item:nth-of-type(3) a img {
      width: 218px;
   }

   .bottom-menu__item:nth-of-type(4) a img {
      width: 210px;
   }

   .bottom-menu__recruit {
      margin-top: 15px;
   }

   .bottom-menu__recruit a img {
      width: 178px;
   }

   .bottom-menu__contact {
      margin-top: 10px;
   }

   .bottom-menu__contact a img {
      width: 200px;
   }

   .bottom-menu__sns {
      padding: 15px 20px;
      margin-top: 10px;
   }

   .bottom-menu__sns a {
      width: 100%;
      display: flex;
      align-items: center;
   }

   .bottom-menu__sns a p {
      font-size: 14px;
   }

   .bottom-menu__instagram {
      margin-bottom: 15px;
   }

   .bottom-menu p.bottom-menu__copyright {
      font-size: 13px;
      padding: 5px 0 5px 20px;
   }
}