@charset "utf-8";
/* CSS Document */
.anime {
	opacity: 0;
}

/*--------------------------------------------------------　光るボタン　--------------------------------------------------------*/
@keyframes shiny {
    0% {
        transform: scale(0) rotate(25deg);
        opacity: 0;
    }

    50% {
        transform: scale(1) rotate(25deg);
        opacity: 1;
    }

    100% {
        transform: scale(50) rotate(25deg);
        opacity: 0;
    }
}

.shiny-btn {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
    text-decoration: none;
    overflow: hidden;
}

.shiny-btn::after {
    content: '';
    position: absolute;
    top: -100px;
    left: -100px;
    width: 50px;
    height: 50px;
    background-image: linear-gradient(100deg,  rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 1) 100%, rgba(255, 255, 255, 0) 0%);
    
    /* アニメーション */
    animation-name: shiny;
    animation-duration: 2s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

/*--------------------------------------------------------　fadeup　--------------------------------------------------------*/
.fadeup {
  opacity: 0;
  will-change: opacity, transform;
}
.fadeup.is-animated {
  animation: fadeup 1s cubic-bezier(0.33, 1, 0.68, 1) 1 forwards;
}
.fadeup.is-animated.delay1 {
  animation-delay: 0.2s;
}
.fadeup.is-animated.delay2 {
  animation-delay: 0.4s;
}
.fadeup.is-animated.delay3 {
  animation-delay: 0.6s;
}
.fadeup.is-animated.delay4 {
  animation-delay: 0.8s;
}
.fadeup.is-animated.delay5 {
  animation-delay: 1s;
}
.fadeup.is-animated.delay6 {
  animation-delay: 1.2s;
}
.fadeup.is-animated.delay7 {
  animation-delay: 1.4s;
}
.fadeup.is-animated.delay8 {
  animation-delay: 1.6s;
}

@keyframes fadeup {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@-webkit-keyframes fadeup {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@-webkit-keyframes pulse {
0% {
 -webkit-transform: scale3d(1, 1, 1);
 transform: scale3d(1, 1, 1);
}
30% {
 -webkit-transform: scale3d(1, 1, 1);
 transform: scale3d(1, 1, 1);
}
 50% {
 -webkit-transform: scale3d(1.03, 1.03, 1.03);
 transform: scale3d(1.03, 1.03, 1.03);
}
 to {
 -webkit-transform: scale3d(1, 1, 1);
 transform: scale3d(1, 1, 1);
}
}
@keyframes pulse {
0% {
 -webkit-transform: scale3d(1, 1, 1);
 transform: scale3d(1, 1, 1);
}
30% {
 -webkit-transform: scale3d(1, 1, 1);
 transform: scale3d(1, 1, 1);
}
 50% {
 -webkit-transform: scale3d(1.03, 1.03, 1.03);
 transform: scale3d(1.03, 1.03, 1.03);
}
 to {
 -webkit-transform: scale3d(1, 1, 1);
 transform: scale3d(1, 1, 1);
}
}
.common_btn01_yl_big.is-animated a {
	-webkit-animation-name: pulse;
	animation-name: pulse;
	-webkit-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-delay: 1.5s;
	animation-duration: 2.0s;
}

.fadeIn {
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
}
@-webkit-keyframes fadeIn{
0% {
 opacity:0;
}
100% {
 opacity:1;
}	
}
@keyframes fadeIn {
0% {
 opacity:0;
}
100% {
 opacity:1;
}
}
.anim01 {
  -webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

.anim02 {
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	/*-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;*/
}
.slideInUp {
	-webkit-animation-name: slideInUp;
	animation-name: slideInUp;	
}
@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
	   opacity:0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
	  opacity:1;
  }
}
@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
	  opacity:0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
	  opacity:1;
  }
}

.border{
	position: relative;
	-webkit-animation-duration: 1.0s;
	animation-duration: 1.0s;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
}
.border_anim {
	-webkit-animation-name: border_anim;
	animation-name: border_anim;	
}
@keyframes border_anim {
	0%{
		width: 0%;
		opacity: 1;
	}
	100%{
		width: 100%;
		opacity: 1;
	}
}
/*.about_content01_box .about_content01_box_in:nth-child(2),.about_content01_box .about_content01_box_in:nth-child(4){
	-webkit-animation-delay: 1.5s;
	animation-delay: 1.5s;
}
.about_content01_box .about_content01_box_in:nth-child(2) .border,.about_content01_box .about_content01_box_in:nth-child(4) .border{
	-webkit-animation-delay: 2s;
	animation-delay: 2s;
}*/
.top_worries_box02,.top_worries_box03 {
	-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
}
.anim03 {
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	/*-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;*/
}
.bounceIn {  
-webkit-animation-name: bounceIn;
animation-name: bounceIn;
}

@-webkit-keyframes bounceIn {
  	0% {
        -webkit-transform: scale(1.0, 1.0) translate(0%, 0%);
		opacity: 0;
    }
    50% {
        -webkit-transform: scale(1.1, 1.1) translate(0%, 0%);
    }
    100% {
        -webkit-transform: scale(1.0, 1.0) translate(0%, 0%);
		opacity: 1;
    }
}
@keyframes bounceIn {
  	0% {
        -webkit-transform: scale(1.0, 1.0) translate(0%, 0%);
		opacity: 0;
    }
    50% {
        -webkit-transform: scale(1.1, 1.1) translate(0%, 0%);
    }
    100% {
        -webkit-transform: scale(1.0, 1.0) translate(0%, 0%);
		opacity: 1;
    }
}

.anim04 {
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-delay: 1s;
	animation-delay: 1s;
}
@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-30%, 0, 0);
    transform: translate3d(-30%, 0, 0);
    visibility: hidden;
	  opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
	  opacity: 1;
  }
}
@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-30%, 0, 0);
    transform: translate3d(-30%, 0, 0);
    visibility: hidden;
	  opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
	  opacity: 1;
  }
}
.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

.anim05 {
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-delay: 1s;
	animation-delay: 1s;
}
@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(30%, 0, 0);
    transform: translate3d(30%, 0, 0);
    visibility: hidden;
	  opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
	  opacity: 1;
  }
}
@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(30%, 0, 0);
    transform: translate3d(30%, 0, 0);
    visibility: hidden;
	  opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
	  opacity: 1;
  }
}
@media (max-width: 768px){
.anim04,.anim05 {
	-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
}
@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(-30%, 0, 0);
    transform: translate3d(-30%, 0, 0);
    visibility: hidden;
	  opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
	  opacity: 1;
  }
}
@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(-30%, 0, 0);
    transform: translate3d(-30%, 0, 0);
    visibility: hidden;
	  opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
	  opacity: 1;
  }
}
}
.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

.anim06 {
	-webkit-animation-duration: 0.2s;
	animation-duration: 0.2s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-delay: 1s;
	animation-delay: 1s;
}
@-webkit-keyframes lineLeft {
  from {
    width: 0;
	  opacity: 0;
  }

  to {
    width: 105px;
	  opacity: 1;
  }
}
@keyframes lineLeft {
  from {
    width: 0;
	  opacity: 0;
  }

  to {
    width: 105px;
	  opacity: 1;
  }
}
.lineLeft {
  -webkit-animation-name: lineLeft;
  animation-name: lineLeft;
}
@media (min-width: 769px){
.timeline .history_timebox:nth-child(3) .anim03{
	-webkit-animation-delay: 1.5s;
	animation-delay: 1.5s;
}

.timeline .history_timebox:nth-child(3) .anim04,.timeline .history_timebox:nth-child(3) .anim05,.timeline .history_timebox:nth-child(3) .anim06,.timeline .history_timebox:nth-child(3) .anim07{
	-webkit-animation-delay: 2.5s;
	animation-delay: 2.5s;
}
}