﻿@charset "utf-8";

header#tp {
  height: 100vh;
  position: relative;
  z-index: 1;
}
header#tp > div {
  margin: 0 auto 10px;
  padding: 19px 0 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
header#tp > div > h1 {max-width: 200px;}
header#tp nav ul#gl {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
header#tp nav ul#gl > li {
  border-color: #fff;
}
header#tp nav ul#gl a {
  color: #fff;
  text-decoration: none;
}
header#tp nav > ul#gl li:last-child a {
  width: 140px;
  padding: 9px 0;
  background: #ff6600 url(../../img/arw_wht.svg) no-repeat 92% center;
  background-size: auto 36%;;
  display: inline-block;
  line-height: 1;
  text-align: center;
}
header#tp nav > ul#gl li:not(:last-child) a:hover {
  text-decoration: underline;
}
header#tp nav > ul#gl li:last-child a:hover {
  background: #fff url(../../img/arw_orng.svg) no-repeat 92% center;
  background-size: auto 36%;;
  border: 1px solid;
  color: #ff6600;
}

section#mv {
  width: 100%;
  height: 100vh;
  padding: 0;
  background: #000;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  z-index: 0;
}
section#mv > ul {
  position: relative;
  z-index: 0;
}
section#mv > ul#mvbg > li {
  width: 100%;
  height: 100vh;
  background: #000 url(../../img/top/mv1.jpg) no-repeat center center;
  background-size: cover;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  animation: 36s ease 0s infinite normal none running bgGimi;
}
section#mv > ul#mvbg > li:not(nth-child(1)) {
  animation-name: bgGimi2;
}
section#mv > ul#mvbg > li:nth-child(2) {
  background-image: url(../../img/top/mv2.jpg);
  animation-delay: 3s;
}
section#mv > ul#mvbg > li:nth-child(3) {
  background-image: url(../../img/top/mv3.jpg);
  animation-delay: 9s;
}
section#mv > ul#mvbg > li:nth-child(4) {
  background-image: url(../../img/top/mv4.jpg);
  animation-delay: 15s;
}
section#mv > ul#mvbg > li:nth-child(5) {
  background-image: url(../../img/top/mv5.jpg);
  animation-name: bgGimi3;
  animation-delay: 21s;
}
@keyframes bgGimi {
   0% { opacity: 0; transform: scale(1.5, 1.5);z-index: 9;}
   2% { opacity: 0; transform: scale(1.5, 1.5);z-index: 9;}
   8% { opacity: 1; transform: scale(1.3, 1.3);z-index: 10;}
  39% { opacity: .8; transform: scale(1, 1);z-index: 9;}
  50% { opacity: 0; transform: scale(1, 1);z-index: 9;}
 100% { opacity: 0;}
}
@keyframes bgGimi2 {
   0% { opacity: 0; transform: scale(1.5, 1.5);z-index: 9;}
   2% { opacity: 0; transform: scale(1.5, 1.5);z-index: 9;}
   6% { opacity: 1; transform: scale(1.3, 1.3);z-index: 10;}
  39% { opacity: .8; transform: scale(1, 1);z-index: 10;}
  40% { opacity: 0; transform: scale(1, 1);z-index: 9;}
 100% { opacity: 0;}
}
@keyframes bgGimi3 {
   0% { opacity: 0; transform: scale(1.5, 1.5);z-index: 9;}
   2% { opacity: 0; transform: scale(1.5, 1.5);z-index: 9;}
   6% { opacity: 1; transform: scale(1.3, 1.3);z-index: 10;}
  28% { opacity: .8; transform: scale(1, 1);z-index: 9;}
  31% { opacity: 0; transform: scale(1, 1);z-index: 9;}
 100% { opacity: 0;}
}
section#mv > ul#mvbg + ul > li {
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  opacity: 0;
}
section#mv > ul#mvbg + ul > li div {
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
}
section#mv > ul#mvbg + ul > li p {
  color: #fff;
  line-height: 1.8;
/*   opacity: 0; */
  font-family: Noto Serif JP;
  font-size: min(4vw, 3.6rem);
  font-weight: bold;
  white-space: nowrap;
}
section#mv > ul#mvbg + ul > li {
  opacity: 0;
  animation: 36s ease 0s infinite none running fdOt;
}
section#mv > ul#mvbg + ul > li:not(:nth-child(1)) {
  animation-name: fdInOt;
}
section#mv > ul#mvbg + ul > li:nth-child(2) {
  background: transparent url(../../img/top/mv2_img.png) no-repeat 94% 72%;
  background-size: auto 80%;
  animation-delay: 4s;
}
section#mv > ul#mvbg + ul > li:nth-child(2) p {padding: 0 60% 0 0;}
section#mv > ul#mvbg + ul > li:nth-child(3) {
  background: transparent url(../../img/top/mv3_img.png) no-repeat 0 72%;
  background-size: auto 80%;
  animation-delay: 10.3s;
}
section#mv > ul#mvbg + ul > li:nth-child(3) p {padding: 0 0 0 58%;}
section#mv > ul#mvbg + ul > li:nth-child(4) {
  background: transparent url(../../img/top/mv4_img.png) no-repeat 96% 72%;
  background-size: auto 80%;
  animation-delay: 16s;
}
section#mv > ul#mvbg + ul > li:nth-child(4) p {padding: 0 52% 0 0;}
section#mv > ul#mvbg + ul > li:nth-child(5) {
  animation-name: fdInOt5;
  animation-delay: 20s;
}
@keyframes fdOt {
    0% {opacity: 0;}
    5% {opacity: 1;}
   10% {opacity: 1;}
   11% {opacity: 0;}
  100% {opacity: 0;}
}
@keyframes fdInOt {
    0% {opacity: 0;}
    2% {opacity: 0;}
   10% {opacity: 1;}
   14% {opacity: 1;}
   15% {opacity: 0;}
  100% {opacity: 0;}
}
@keyframes fdInOt5 {
    0% {opacity: 0;}
    5% {opacity: 0;}
   15% {opacity: 1;}
   28% {opacity: 1;}
   30% {opacity: 0;}
  100% {opacity: 0;}
}
@keyframes fdIn {
    0% {transform: scale(0);}
   20% {transform: scale(1);}
   50% {transform: scale(1);}
  100% {transform: scale(0);}
}
section#mv > ul > li img.bg {
  opacity: 0;
}
section#mv > ul > li p img {
  width: 100%;
  max-width: 860px;
}
section#mv > ul > li:nth-child(5) p img {
  width: 100%;
  max-width: 480px;
}
section#mv > ul > li p span {
  opacity: 0;
  animation: txtFdOut 36s ease-out 5s infinite;
}
section#mv > ul > li p span:nth-child(2) {animation-delay : 5.1s;}
section#mv > ul > li p span:nth-child(3) {animation-delay : 5.2s;}
section#mv > ul > li p span:nth-child(4) {animation-delay : 5.3s;}
section#mv > ul > li p span:nth-child(6) {animation-delay : 5.4s;}
section#mv > ul > li p span:nth-child(7) {animation-delay : 5.5s;}
section#mv > ul > li p span:nth-child(8) {animation-delay : 5.6s;}
section#mv > ul > li p span:nth-child(9) {animation-delay : 5.7s;}
section#mv > ul > li p span:nth-child(10) {animation-delay : 5.8s;}
section#mv > ul > li p span:nth-child(11) {animation-delay : 5.9s;}
section#mv > ul > li p span:nth-child(13) {animation-delay : 6s;}
section#mv > ul > li p span:nth-child(14) {animation-delay : 6.1s;}
section#mv > ul > li p span:nth-child(15) {animation-delay : 6.2s;}
section#mv > ul > li p span:nth-child(16) {animation-delay : 6.3s;}
section#mv > ul > li p span:nth-child(17) {animation-delay : 6.4s;}
section#mv > ul > li p span:nth-child(18) {animation-delay : 6.5s;}

section#mv > ul > li:nth-child(3) p span {animation-delay : 11s;}
section#mv > ul > li:nth-child(3) p span:nth-child(2) {animation-delay : 11.1s;}
section#mv > ul > li:nth-child(3) p span:nth-child(3) {animation-delay : 11.2s;}
section#mv > ul > li:nth-child(3) p span:nth-child(4) {animation-delay : 11.3s;}
section#mv > ul > li:nth-child(3) p span:nth-child(5) {animation-delay : 11.4s;}
section#mv > ul > li:nth-child(3) p span:nth-child(6) {animation-delay : 11.5s;}
section#mv > ul > li:nth-child(3) p span:nth-child(8) {animation-delay : 11.6s;}
section#mv > ul > li:nth-child(3) p span:nth-child(9) {animation-delay : 11.7s;}
section#mv > ul > li:nth-child(3) p span:nth-child(10) {animation-delay : 11.8s;}
section#mv > ul > li:nth-child(3) p span:nth-child(11) {animation-delay : 11.9s;}
section#mv > ul > li:nth-child(3) p span:nth-child(12) {animation-delay : 12s;}
section#mv > ul > li:nth-child(3) p span:nth-child(13) {animation-delay : 12.1s;}
section#mv > ul > li:nth-child(3) p span:nth-child(14) {animation-delay : 12.2s;}
section#mv > ul > li:nth-child(3) p span:nth-child(15) {animation-delay : 12.3s;}
section#mv > ul > li:nth-child(3) p span:nth-child(17) {animation-delay : 12.4s;}
section#mv > ul > li:nth-child(3) p span:nth-child(18) {animation-delay : 12.5s;}
section#mv > ul > li:nth-child(3) p span:nth-child(19) {animation-delay : 12.6s;}

section#mv > ul > li:nth-child(4) p span {animation-delay : 17.3s;}
section#mv > ul > li:nth-child(4) p span:nth-child(2) {animation-delay : 17.4s;}
section#mv > ul > li:nth-child(4) p span:nth-child(3) {animation-delay : 17.5s;}
section#mv > ul > li:nth-child(4) p span:nth-child(4) {animation-delay : 17.6s;}
section#mv > ul > li:nth-child(4) p span:nth-child(5) {animation-delay : 17.7s;}
section#mv > ul > li:nth-child(4) p span:nth-child(6) {animation-delay : 17.8s;}
section#mv > ul > li:nth-child(4) p span:nth-child(7) {animation-delay : 17.9s;}
section#mv > ul > li:nth-child(4) p span:nth-child(8) {animation-delay : 18s;}
section#mv > ul > li:nth-child(4) p span:nth-child(10) {animation-delay : 18.1s;}
section#mv > ul > li:nth-child(4) p span:nth-child(11) {animation-delay : 18.2s;}
section#mv > ul > li:nth-child(4) p span:nth-child(12) {animation-delay : 18.3s;}
section#mv > ul > li:nth-child(4) p span:nth-child(13) {animation-delay : 18.4s;}
section#mv > ul > li:nth-child(4) p span:nth-child(14) {animation-delay : 18.5s;}
section#mv > ul > li:nth-child(4) p span:nth-child(15) {animation-delay : 18.6s;}
section#mv > ul > li:nth-child(4) p span:nth-child(17) {animation-delay : 18.7s;}
section#mv > ul > li:nth-child(4) p span:nth-child(18) {animation-delay : 18.8s;}
section#mv > ul > li:nth-child(4) p span:nth-child(19) {animation-delay : 18.9s;}
section#mv > ul > li:nth-child(4) p span:nth-child(20) {animation-delay : 19s;}
section#mv > ul > li:nth-child(4) p span:nth-child(21) {animation-delay : 19.1s;}
section#mv > ul > li:nth-child(4) p span:nth-child(22) {animation-delay : 19.2s;}
section#mv > ul > li:nth-child(4) p span:nth-child(23) {animation-delay : 19.3s;}
section#mv > ul > li:nth-child(4) p span:nth-child(24) {animation-delay : 19.4s;}
@keyframes txtFdOut {
    0% {opacity: 0;}
    2% {opacity: 1;}
   40% {opacity: 1;}
   47% {opacity: 0;}
  100% {opacity: 0;}
}


#news {
  max-width: 900px;
  margin: 0 auto;
}
#news p.bx_l_red {
  margin: 0 auto 20px;
  padding: 8px 0 10px;
  border: 1px solid;
  color: #9b2727;
  display: block;
  font-weight: bold;
  line-height: 1;
  text-align: center;
}
#news p.bx_l_red a {
  color: #9b2727;
  text-decoration: none;
}
#news p.bx_l_red:before {
content: '!';
  width: 20px;
  padding: 1px 0 2px;
  background: #9b2727;
  border-radius: 14rem;
  color: #fff;
  display: inline-block;
}
#news div.flx > h2 {
  width: 100px;
  color: #145b99;
  font-size: 2rem;
}
#news div.flx > h2 span {
  color: #000;
  display: block;
  font-size: 1rem;
}
#news div.flx > dl {
  width: calc(98% - 100px);
  border-top: 1px solid #ccc;
  justify-content: flex-start;
}
#news div.flx > dl > * {
  width: 120px;
  padding: 9px 0;
  border-bottom: 1px solid #ccc;
  font-size: .8rem;
}
#news div.flx > dl > dt {
  color: #666;
}
#news div.flx > dl > dd {
  width: calc(100% - 120px);
  color: #000;
  font-weight: bold;
  display: flex;
  align-items: baseline;
}
#news div.flx > dl > dd:before {
  width: 56px;
  margin: 0 auto 0 0;
  padding: 0 3px;
  border: 1px solid;
  content: 'お知らせ';
  color: #dd3300;
  font-weight: normal;
  white-space: nowrap
}
#news div.flx > dl > dd.m2:before {
  content: '報道発表';
  color: #003399;
}
#news div.flx > dl > dd.pdf a:after {
  width: 38px;
  height: 1.2rem;
  margin: 3px 0 -3px;
  background: transparent url(../../img/ico_pdf.png) no-repeat right center;
  background-size: contain;
  content: ' ';
  display: inline-block;
}
#news div.flx > dl > dd p,
#news div.flx > dl > dd a {
  width: calc(100% - 78px);
  color: #000;
  text-decoration: none;
}

#news div.flx > dl > dd a {
  color: #000;
  font-weight: bold;
  text-decoration: none;
}
#news div.flx > dl + p {
  width: 100%;
  padding: 6px 0 0;
  display: block;
  text-align: right;
}
#news div.flx > dl + p a {
  font-size: .8rem;
  text-decoration: none;
}

main {
  background: #000 url(../../img/top/bg_mn.png) no-repeat fixed center 0;
  background-size: cover;
}

section#srvc {padding: 86px 0 9px;}
section#srvc ul li {
  margin: 0 auto 66px;
}
#srvc ul li:nth-child(2) dl.flx {
  flex-direction:row-reverse;
}
#srvc ul dl.flx > * {
  width: 50%;
  overflow: hidden;
  position: relative;
}
#srvc ul dl.flx > dd {
  padding: 36px 6%;
/*   background: rgb(1, 168, 252, .6); */
  background: #14375d url(../../img/top/bg_srvc1.jpg) no-repeat center center;
  background-size: cover;
  color: #fff;
}
#srvc ul li:nth-child(2) dl.flx > dd {
  background-image: url(../../img/top/bg_srvc2.jpg);
}
#srvc ul li:nth-child(3) dl.flx > dd {
  background-image: url(../../img/top/bg_srvc3.jpg);
}
#srvc ul li dl dd > p {
  font-size: .9rem;
}
#srvc ul li dl dd > p:nth-child(1) {
  margin: 0 auto 6px;
  font-size: min(3.6vw, 2rem);
  line-height: 1.4;
}
#srvc ul li dl dd > h2 {
  margin: 0 auto 9px;
  font-size: min(3.0vw, 2.9rem);
/*   font-weight: normal; */
  letter-spacing: .2rem;
  line-height: 1.4;
}
#srvc ul li dl dd > a {
  max-width: 330px;
  margin: 3vh 0 0;
  padding: 15px 0;
  background: #fff;
  color: #015e90;
  display: block;
  line-height: 1;
  position: relative;
  text-align: center;
  text-decoration: none;
}
/* #srvc ul li:nth-child(2) dl dd > a {color: #1a6037;}
#srvc ul li:nth-child(3) dl dd > a {color: #67254b;} */
#srvc ul li dl dd > a:after {
/*   content: "&gt;"; */
  content: "　";
  background: transparent url(../../img/arw_blu.svg) no-repeat 100% 0;
  background-size: auto 80%;
  font-size: 1.3rem;
  position: absolute;
  right: 4%;
  top: .1.8vh;
/*   filter: invert(67%) sepia(22%) saturate(4260%) hue-rotate(163deg)
    brightness(90%) contrast(49%); */
}
/* #srvc ul li:nth-child(2) dl dd > a:after {
  filter: invert(67%) sepia(22%) saturate(4260%) hue-rotate(95deg)
    brightness(90%) contrast(49%);
}
#srvc ul li:nth-child(3) dl dd > a:after {
  filter: invert(67%) sepia(22%) saturate(4260%) hue-rotate(309deg)
    brightness(90%) contrast(49%);
} */

section#rcrt {margin: 0 auto 66px;}

#bnr > div > ul {
  width: 100%;
  margin: 0 auto;
  flex-wrap: inherit;
  justify-content: center;
/*   gap: 0 2%; */
}
#bnr > div > ul a {
  width: calc(98% - 8px);
  margin: 0 auto;
  padding: 4px;
  background: #fff;
}


@media (max-width: 1100px) {
  #srvc ul dl.flx > dt {
    width: 50%;
    overflow: hidden;
    position: relative;
    background: url(../../img/top/srvc1.jpg) no-repeat center 0;
    background-size: cover;
  }
  #srvc ul li:nth-child(2) dl.flx > dt {
    background-image: url(../../img/top/srvc2.jpg);
  }
  #srvc ul li:nth-child(3) dl.flx > dt {
    background-image: url(../../img/top/srvc3.jpg);
  }
  #srvc ul dl.flx > dt > img {
    position: fixed;
    z-index: -5;
  }
}


@media (max-width: 820px) {
  header#tp nav > ul#gl {
    width: 100%;
    padding: 3%;
    display: block;
    overflow: hidden;
  }
  header#tp nav > ul#gl > li {
    margin: 0 auto 10px;
    padding: 0;
    border: none;
    text-align: left;
  }
  header#tp > div > ul#tch li img {
    filter: invert(0%);
  }
  header#tp nav > ul#gl a,
  header#tp nav > ul#gl li:last-child a {
    width: auto;
    padding: 9px 3%;
    display: block;
  }

  section#mv > ul#mvbg + ul > li:nth-child(2) {background-size: auto 55%;}
  section#mv > ul#mvbg + ul > li:nth-child(3) {background-size: auto 47%;}
  section#mv > ul#mvbg + ul > li:nth-child(4) {background-size: auto 46%;}

  section#mv > ul#mvbg + ul > li:nth-child(2) div,
  section#mv > ul#mvbg + ul > li:nth-child(3) div,
  section#mv > ul#mvbg + ul > li:nth-child(4) div {
    align-items: self-start;
  }
  section#mv > ul#mvbg + ul > li p {font-size: min(6vw, 3.6rem);}
  section#mv > ul#mvbg + ul > li:nth-child(2) p {
    margin: 23vh 0 0;
    padding: 0 56% 0 0;
  }
  section#mv > ul#mvbg + ul > li:nth-child(3) p {
    margin: 23vh 0 0;
    padding: 0 0 0 42%;
  }
  section#mv > ul#mvbg + ul > li:nth-child(4) p {
    margin: 21vh 0 0;
    padding: 0 42% 0 0;
  }

  #bnr > div > ul {
    margin: 0 auto 19px;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 9px 2%;
  }
  #bnr > div > ul > li {width: 49%;}
  #bnr > div > ul a {
    text-align: center;
  }
}



@media (max-width: 640px) {
  header#tp,
  section#mv > ul#mvbg + ul > li,
  section#mv > ul#mvbg + ul > li div,
  section#mv {max-height: 800px;}

  section#mv > ul#mvbg + ul > li:nth-child(2) {background-size: auto 40%;}
  section#mv > ul#mvbg + ul > li p {
    font-size: min(8vw, 3.6rem);
  }
  section#mv > ul#mvbg + ul > li:nth-child(2) {
    background-size: auto 48%;
    background-position: 94% 81%;
  }
  section#mv > ul#mvbg + ul > li:nth-child(3) {
    background-size: auto 46%;
    background-position: 0 79%;
  }
  section#mv > ul#mvbg + ul > li:nth-child(4) {
    background-size: auto 46%;
    background-position: 96% 80%;
  }
  section#mv > ul#mvbg + ul > li:nth-child(2) p {
    margin: 16vh 0 0;
    padding: 0 4% 0 0;
  }
  section#mv > ul#mvbg + ul > li:nth-child(3) p {
    margin: 16vh 0 0;
    padding: 0 0 0 6%;
  }
  section#mv > ul#mvbg + ul > li:nth-child(4) p {
    margin: 16vh 0 0;
    padding: 0 2% 0 0;
  }

  section#mv > ul > li:nth-child(5) p {text-align: center;}
  section#mv > ul > li:nth-child(5) p img {width: 80%;}

  #news > div > div.flx {
    display: block;
  }
  #news div.flx > h2 {margin: 0 0 19px;}
  #news div.flx > dl,
  #news div.flx > dl > dt,
  #news div.flx > dl > dd,
  #srvc ul dl.flx > dt,
  #srvc ul dl.flx > dd {
    width: 100%;
  }
  #news div.flx > dl > dt {
    padding: 9px 0 0;
    border: none;
  }

  #srvc > div > ul > li > dl {
    display: block;
  }
  #srvc ul dl.flx > dt > img {
    position: relative;
/*     z-index: 1; */
  }
  #srvc ul li dl dd > h2 {font-size: min(7vw, 2.9rem);}
  section#srvc ul li:last-child {margin: 0 auto 33px;}

}
