@charset "UTF-8";
/**scss共通***/
img {
  width: 100%;
}

.test {
  -webkit-transition: all .4s ease-out;
  transition: all .4s ease-out;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  animation: Flash1 1s infinite;
  font-family: 'Noto Serif JP', serif;
  background: linear-gradient(90deg, #00486e 0%, #00789b 100%);
}

@keyframes Flash1 {
  50% {
    opacity: 0;
  }
}

.test {
  content: "\f105";
  font-family: FontAwesome;
}

/**scss共通ここまで***/
.fade__up {
  -webkit-transition: all 0.8s cubic-bezier(0.37, 0, 0.63, 1);
  transition: all 0.8s cubic-bezier(0.37, 0, 0.63, 1);
  opacity: 0;
  transform: translate(0%, 30px);
}

.fade__up.active {
  opacity: 1;
  transform: translate(0%, 0px);
}

.fade__in {
  -webkit-transition: all 0.8s cubic-bezier(0.37, 0, 0.63, 1);
  transition: all 0.8s cubic-bezier(0.37, 0, 0.63, 1);
  opacity: 0;
  transform: translate(0%, 0px);
}

.fade__in.active {
  opacity: 1;
  transform: translate(0%, 0px);
}

.delay1 {
  transition-delay: 0s;
}

.delay2 {
  transition-delay: 0.3s;
}

.delay3 {
  transition-delay: 0.6s;
}

.delay4 {
  transition-delay: 0.9s;
}

.delay5 {
  transition-delay: 1.2s;
}

/********************/
header {
  width: 100%;
  background-color: #fff;
  height: 75px;
}

@media (max-width: 800px) {
  header {
    height: 50px;
  }
}

header .header__in {
  width: 94%;
  margin: 0 auto;
  position: relative;
}

header .header__in .headlg {
  width: 154px;
  padding-top: 15px;
}

@media (max-width: 800px) {
  header .header__in .headlg {
    padding-top: 10px;
    width: 105px;
  }
}

header .header__in .icon {
  width: 40%;
  max-width: 230px;
  position: absolute;
  top: 40%;
  right: 0;
  z-index: 50;
}

@media (max-width: 800px) {
  header .header__in .icon {
    top: 10%;
    right: -2%;
  }
}

.fixbana {
  width: 405px;
  position: fixed;
  bottom: 30px;
  /*right:-60px;*/
  z-index: 99;
  border-radius: 5px;
  overflow: hidden;
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
  -webkit-transition: all 0.8s cubic-bezier(0.68, -0.6, 0.32, 1.6);
  transition: all 0.8s cubic-bezier(0.68, -0.6, 0.32, 1.6);
  right: -420px;
}

.fixbana.active {
  right: -60px;
}

@media (max-width: 800px) {
  .fixbana.active {
    right: -15%;
  }
}

@media (max-width: 800px) {
  .fixbana {
    width: 75%;
    bottom: 20px;
  }
}

.fixbana .bana_text {
  position: absolute;
  width: 55%;
  top: 50%;
  left: 6.5%;
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  z-index: 10;
}

@media (max-width: 800px) {
  .fixbana .bana_text {
    left: 4.5%;
  }
}

.fixbana .topbk {
  position: absolute;
  z-index: 10;
  top: 0;
  right: 60px;
  height: 100%;
  width: 70px;
  background-image: url(../images/top_back.jpg);
  background-size: cover;
  background-position: center;
}

@media (max-width: 800px) {
  .fixbana .topbk {
    width: 18%;
    right: 19%;
  }
}

/****************************************************************************/