@charset "utf-8";
.topHeader {
  width: 100%;
}
.topHeader #navigation {
  background: rgba(255, 255, 255, 0.9);
}
.topMv {
  width: 100%;
  position: relative;
  overflow: hidden;
}
.topMv__imgArea {
  width: 100%;
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
/*
  -webkit-transform: scale(1.5);
  transform: scale(1.5);
*/
  z-index: 0;
}
.scale15{
  -webkit-transform: scale(1.5);
  transform: scale(1.5);
}
.blur {
  -ms-filter: blur(15px);
  -webkit-filter: blur(15px);
  filter: blur(15px);
}
.topMv__imgArea img {
  max-width: 100%;
}
.topMv__textArea {
  position: absolute;
  z-index: 10;
}
.topMv__title {
    line-height: 0.85;
    font-size: 85px;
    color: #214788;
    padding-top: 86px;
    height: 200px;
    font-weight: 600;
    font-family: "dinbold", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Arial, Verdana;
}
.topMv__subtitle {
  padding-top: 8px;
  font-weight: bold;
  font-size: 26px;
  color: #214788;
}
.topMv__text {
  padding-top: 45px;
  font-size: 17px;
  color: #214788;
  line-height: 1.6em;
}
.cw {
  color: #fff;
}
@media (min-width: 1599px) {
  .topMv__title {
    font-size: 90px;
    height: 250px;
    padding-top: 50px;
  }
}
@media (max-width: 1024px) {
  .topMv__title1 {
    padding-top: 150px;
  }
  .topMv__text1 {
    padding-bottom: 130px;
  }
  .topMv__left {
    padding-left: 20px;
  }
  .topMv__title {
    font-size: 80px;
  }
}
@media (max-width:768px) {
  .topMv__title {
    padding-top: 40px;
  }
  .topMv__text {
    padding-bottom: 30px;
  }
  .topMv__text {
    padding-bottom: 0px;
  }
}
@media (max-width: 640px) {
  .topMv__title {
    font-size: 70px;
    letter-spacing: -3px;
  }
}
@media (max-width: 480px) {
  .topMv__text {
    font-size: 15px;
  }
}
@media (max-width: 414px) {
  .topMv__text {
    padding-top: 15px;
    font-size: 13px;
  }
  .topMv__title {
    font-size: 60px;
    height: 160px;
  }
  .topMv__subtitle{
    font-size: 24px;
  }
}

/*pc*/

@media screen and (min-width:769px) {
  .topHeader {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
  }
  .topMv {
    width: 100%;
    height: 44.3vw;
  }
  .topMv__textArea {
    width: 40%;
    top: 50%;
  left: 5%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  }
}

/*sp*/

@media screen and (max-width:768px) {
  .topHeader {
    width: 100%;
  }
  .topMv {
    width: 100%;
    height: 161.6vw;
  }
  .topMv__textArea {
    top: 0;
  left: 5%;
  }
}

/*
.mvAnimDiv{
  display: flex;
}

.mvAnimDiv__left{
  -ms-filter: blur(15px);
  filter: blur(15px);
}

.mvAnimDiv__right div:nth-child(1) {
  opacity: 0;
} 

.mvAnimDiv__right div:nth-child(2) {
  opacity: 0;
} 
.mvAnimDiv__right div:nth-child(3) {
  opacity: 0;
} 

@media screen and (min-width:769px) {
  .mvAnimDiv{
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 39vw;
  }
  .mvAnimDiv__left{
    width: 40%;
    padding-left: 5%;
  }
  .mvAnimDiv__right{
    width: 60%;
    height: 100%;
    position: relative;
    overflow: hidden;
  }
  .mvAnimDiv__right div{
    max-width: 100%;
    position: absolute;
    top: 0;
    right: 0;
  }
  
}

@media screen and (max-width:768px) {
  .mvAnimDiv{
    flex-flow: column;
    width: 100%;
  }
  .mvAnimDiv__left{
    width: 100%;
    padding-left: 20px;
  }
  .mvAnimDiv__right{
    width: 100%;
    height: 90vw;
    position: relative;
    overflow: hidden;
  }
  .mvAnimDiv__right div{
    max-width: 100%;
    position: absolute;
    top: 0;
    right: 0;
  }
  .top_btn{
    bottom: -3em;
  }
}

.anim1{
  animation: anim1 2s linear forwards;
}

.anim2{
  animation: anim2 5s linear forwards;
}

.anim3{
  animation: anim3 5s linear forwards;
}

@keyframes anim1{
  0%{
    -ms-filter: blur(15px);
    filter: blur(15px);
  }
  100%{
    -ms-filter: blur(0);
    filter: blur(0);
  }
}

@keyframes anim2 {
  0%{
    opacity: 0;
    transform: scale(1.2);
    -ms-filter: blur(15px);
    filter: blur(15px);
  }
  30%{
    opacity: 1;
    transform: scale(1.2);
    -ms-filter: blur(0);
    filter: blur(0);
  }
  50%{
    opacity: 1;
    transform: scale(1);
    -ms-filter: blur(0);
    filter: blur(0);
  }
  70%{
    opacity: 1;
    transform: scale(1);
    -ms-filter: blur(0);
    filter: blur(0);
  }
  100%{
    opacity: 0;
    transform: scale(0.8);
    -ms-filter: blur(40px);
    filter: blur(40px);
  }
}

@keyframes anim3{
  0%{
    opacity: 0;
    transform: scale(1.2);
    -ms-filter: blur(15px);
    filter: blur(15px);
  }
  20%{
    opacity: 1;
    transform: scale(1.2);
    -ms-filter: blur(0);
    filter: blur(0);
  }
  40%{
    opacity: 1;
    transform: scale(1);
    -ms-filter: blur(0);
    filter: blur(0);
  }
  60%{
    opacity: 1;
    transform: scale(1);
    -ms-filter: blur(0);
    filter: blur(0);
  }
  80%{
    opacity: 1;
    transform: scale(1);
    -ms-filter: blur(0);
    filter: blur(0);
  }
  100%{
    opacity: 0;
    transform: scale(0.8);
    -ms-filter: blur(40px);
    filter: blur(40px);
  }
}
*/

.anim1 {
  -webkit-animation: anim1 2s linear forwards;
  animation: anim1 2s linear forwards;
}
.anim2 {
  -webkit-animation: anim2 15s linear forwards;
  animation: anim2 15s linear forwards;
}
.anim3 {
  -webkit-animation: anim3 15s linear forwards;
  animation: anim3 15s linear forwards;
}
.blurNext {
  -webkit-animation: blurNext 5s linear forwards;
  animation: blurNext 5s linear forwards;
}
@-webkit-keyframes anim1 {
  0% {
    -ms-filter: blur(15px);
    -webkit-filter: blur(15px);
    filter: blur(15px);
  }
  100% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
  }
}
@keyframes anim1 {
  0% {
    -ms-filter: blur(15px);
    -webkit-filter: blur(15px);
    filter: blur(15px);
  }
  100% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
  }
}
@-webkit-keyframes anim2 {
  0% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
  }
  3% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
  }
  80% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  99% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 0;
    z-index: 0;
  }
}
@keyframes anim2 {
  0% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
  }
  3% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
  }
  80% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  99% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 0;
    z-index: 0;
  }
}
@-webkit-keyframes anim3 {
  0% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    -ms-filter: blur(15px);
    -webkit-filter: blur(15px);
    filter: blur(15px);
    z-index: 0;
  }
  2% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    z-index: 0;
  }
  20% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    z-index: 1;
  }
  80% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
    z-index: 1;
  }
  99% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 0;
    z-index: 1;
  }
  100% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 0;
    z-index: 0;
  }
}
@keyframes anim3 {
  0% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    -ms-filter: blur(15px);
    -webkit-filter: blur(15px);
    filter: blur(15px);
    z-index: 0;
  }
  2% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    z-index: 0;
  }
  20% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    z-index: 1;
  }
  80% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
    z-index: 1;
  }
  99% {
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 0;
    z-index: 1;
  }
  100% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    -ms-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 0;
    z-index: 0;
  }
}
@-webkit-keyframes blurNext {
  0% {
    opacity: 0;
  }
  99% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes blurNext {
  0% {
    opacity: 0;
  }
  99% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
