@charset "utf-8";


*:focus-visible,
*:focus{
	outline: solid 2px #0d6ed0;
}
:focus:not(:focus-visible) {
  outline: 0;
}

.kv_ttl{
	opacity: 0;
	transform: scale(1)
}
.kv_wrap.on_anim .kv_ttl{
	transform: scale(1);
	opacity: 1;
/*	animation: .8s 0s linear BoundIn forwards;
	animation-delay: 1.0s;*/
	transition: opacity .8s 0s ease;
	transition-delay: 1.3s;
}
.kv_period{
	opacity: 0;
	transform: scale(1)
}
.kv_wrap.on_anim .kv_period{
	transform: scale(1);
	opacity: 1;
/*	animation: .8s 0s linear BoundIn forwards;
	animation-delay: 1.1s;*/
	transition: opacity .8s 0s ease;
	transition-delay: 1.3s;
}
.kv_wrap .img_wrap{
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	pointer-events: none;
}
.kv_wrap .img_wrap > [class^='kv_']{
	position: absolute;
	z-index: 0;
}
.kv_kirby{
	opacity: 0;
	transform: scale(1)
}
.kv_wrap.on_anim .kv_kirby {
	transform: scale(1);
	opacity: 0;
	animation: .8s 0s linear BoundIn forwards;
	animation-delay: 0.8s;
}
.kv_img{
	opacity: 0;
}
.kv_wrap.on_anim .kv_img{
	transform: translateY(100%);
  animation: .4s 0s cubic-bezier(.33,1,.68,1) FadeSlideInY forwards;
	animation-delay: .45s;
}
.kv_txt01{
	opacity: 0;
	transform: scale(1)
}
.kv_wrap.on_anim .kv_txt01{
	transform: scale(1);
	opacity: 1;
/*	animation: .8s 0s linear BoundIn forwards;
	animation-delay: 1.8s;*/
	transition: opacity .8s 0s ease;
	transition-delay: 1.3s;
}
.kv_txt02{
	opacity: 0;
	transform: scale(1);
}
.kv_wrap.on_anim .kv_txt02{
	transform: scale(1);
	opacity: 1;
/*	animation: .8s 0s linear BoundIn forwards;
	animation-delay: 2.0s;*/
	transition: opacity .8s 0s ease;
	transition-delay: 1.3s;
}
.item_wrap{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.item_wrap > [class^='kv_i']{
	position: absolute;
	top: 0;
	transform-origin: center;
}
.item_wrap > [class^="kv_i"] .img{
	opacity: 0;
	transform: scale(.9)
}
.kv_wrap.on_anim .item_wrap > [class^="kv_i"] .img {
	opacity: 1;
	transform: scale(1);
	transition: opacity .8s 0s ease,transform .5s 0s ease;
	transition-delay: 1.3s;
}

.cloud-anm1 .img {
	/*animation: movX1 3s ease-in-out infinite alternate*/
}
.cloud-anm1 .ctranim {
	/*animation: movY1 4s ease-in-out infinite alternate*/
}
.cloud-anm2 .img {
	/*animation: movX1 3s ease-in-out infinite alternate*/
}
.cloud-anm2 .ctranim {
	/*animation: movY2 5s ease-in-out infinite alternate*/
}
.cloud-anm3 .img {
	/*animation: movX3 5s ease-in-out infinite alternate*/
}
.cloud-anm3 .ctranim {
	/*animation: movY3 3s ease-in-out infinite alternate*/
}
.cloud-anm4 .img {
	/*animation: movX2 3s ease-in-out infinite alternate*/
}
.cloud-anm4 .ctranim {
	/*animation: movY1 4s ease-in-out infinite alternate*/
}
.item_wrap:hover .ctranim {
  animation-play-state: paused;
}
.item_wrap:active .ctranim {
  animation-play-state: paused;
}
@media screen and (max-width:768px) {
}
@media screen and (min-width:769px) {
}


.sec_wrap #kirby_hankyu{
	overflow: hidden;
}
.ttl_wrap.kh{
	opacity: 1;
}
.ttl_wrap.kh .img_anm{
	right: -100%;
}
.ttl_wrap.kh .img_l.floating .ctranim{
	/*animation: movY2 5s ease-in-out infinite alternate*/
}
.ttl_wrap.kh .img_r.floating .ctranim{
	/*animation: movY1 4s ease-in-out infinite alternate*/
}
.ttl_wrap.kh:hover .floating .ctranim {
  animation-play-state: paused;
}
.ttl_wrap.kh:active .floating .ctranim {
  animation-play-state: paused;
}

.ttl_wrap.kh #line{
	position: absolute;
	bottom: 0;
	right: -10%;
	left: -10%;
	width: 120%;
	margin: auto;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (min-width:769px) {
}

.accordionblk .acc_wrap .titleBox{
}
.accordionblk .acc_wrap .titleBox .img01{
	opacity: 0;
}
.accordionblk .acc_wrap[open] .titleBox .img01{
	transition: opacity .4s 0s ease;
	opacity: 1;
}
.accordionblk .acc_wrap .titleBox .img02{
	opacity: 0;
}
.accordionblk .acc_wrap[open] .titleBox .img02{
	transition: opacity .4s 0s ease;
	opacity: 1;
}
.accordionblk .acc_wrap .titleBox .img03{
	opacity: 0;
}
.accordionblk .acc_wrap[open] .titleBox .img03{
	transition: opacity .4s 0s ease;
	opacity: 1;
}
.accordionblk .acc_wrap.on-animated .titleBox .img01,
.accordionblk .acc_wrap.on-animated .titleBox .img02,
.accordionblk .acc_wrap.on-animated .titleBox .img03{
	opacity: 1;
}

@media screen and (max-width: 768px) {
  
}
@media screen and (min-width:769px) {
}


.sec_wrap #special_mov{
	overflow: hidden;
}
.ttl_wrap.sm .img01{
	opacity: 0;
	transform-origin: 20% 100%;
}
.ttl_wrap.on_anim .img01{
	opacity: 1;
	transition: opacity 1.4s 0s ease;
/*	animation: inhale 2.8s ease-in-out 1 forwards;*/
}
.ttl_wrap.sm .img02{
	opacity: 0;
	z-index: 2;
}
.ttl_wrap.sm .ttl_word{
	opacity: 0;
}
.ttl_wrap.sm .star_wrap > [class^='st0']{
	opacity: 0;
}

@media screen and (max-width: 768px) {
  
}
@media screen and (min-width:769px) {
}



.animationblk .co_bg{
	opacity: 1;
}
.item_wrap > [class^="co_i"] .img{
	opacity: 1;
	/*transform: scale(.9)*/
}
.animationblk.on_anim .item_wrap > [class^="co_i"] .img {
	opacity: 1;
	transform: scale(1);
	transition: opacity .8s 0s ease,transform .5s 0s ease;
	transition-delay: .8s;
}
.animationblk .co_c01,
.animationblk .co_c02{
	opacity: 1;
	pointer-events: none;
}
.animationblk.on_anim .co_c01,
.animationblk.on_anim .co_c02{
	opacity: 1;
	transition: opacity 1.4s 0s ease;
	transition-delay: 0.8s;
	/*transform: translateY(100%);
  animation: 1.4s 0s cubic-bezier(.33,1,.68,1) FadeSlideInY forwards;
	animation-delay: 1.2s;*/
}
.contact_box{
	z-index: 2;
}
@media screen and (max-width: 768px) {
}
@media screen and (min-width:769px) {
}


@keyframes BoundIn {
	0% { transform: scale(1); opacity: 0 }
	10% { transform: scale(1.05); opacity: 1 }
	24% { transform: scale(1.18); opacity: 1 }
	32% { transform: scale(1); opacity: 1 }
	50% { transform: scale(1.07); opacity: 1 }
	66% { transform: scale(1); opacity: 1 }
	82% { transform: scale(1.03); opacity: 1 }
	to {  transform: scale(1); opacity: 1 }
}
@keyframes inhale {
	0% { transform: scale(1); }
	20% { transform: scale(1.08); }
	30% { transform: scale(1.06); }
	40% { transform: scale(1.08); }
	50% { transform: scale(1.06); }
	60% { transform: scale(1.08); }
	70% { transform: scale(1.06); }
	80% { transform: scale(1.08); }
	to {  transform: scale(1); }
}
@keyframes movX1 {
	0% { transform: translate(0) }
	50% { transform: translate(-8px) }
	to { transform: translate(0) }
}
@keyframes movX2 {
	0% { transform: translate(0) }
	50% { transform: translate(-12px) }
	to { transform: translate(0) }
}
@keyframes movX3 {
	0% { transform: translate(0) }
	50% { transform: translate(-16px) }
	to { transform: translate(0) }
}
@keyframes movY1 {
	0% { transform: translateY(0) }
	50% { transform: translateY(8px) }
	to { transform: translateY(0) }
}
@keyframes movY2 {
	0% { transform: translateY(0) }
	50% { transform: translateY(12px) }
	to { transform: translateY(0) }
}
@keyframes movY3 {
	0% { transform: translateY(0) }
	50% { transform: translateY(16px) }
	to { transform: translateY(0) }
}

@keyframes movX1_sp {
	0% { transform: translate(0) }
	50% { transform: translate(-4px) }
	to { transform: translate(0) }
}
@keyframes movX2_sp {
	0% { transform: translate(0) }
	50% { transform: translate(-6px) }
	to { transform: translate(0) }
}

@keyframes movX3_sp {
	0% { transform: translate(0) }
	50% { transform: translate(-8px) }
	to { transform: translate(0) }
}

@keyframes movY1_sp {
	0% { transform: translateY(0) }
	50% { transform: translateY(4px) }
	to { transform: translateY(0) }
}

@keyframes movY2_sp {
	0% { transform: translateY(0) }
	50% { transform: translateY(6px) }
	to { transform: translateY(0) }
}

@keyframes movY3_sp {
	0% { transform: translateY(0) }
	50% { transform: translateY(8px) }
	to { transform: translateY(0) }
}
@keyframes FadeSlideInY {
	0% {
			opacity: 0;
			transform: translateY(100%) }
	50% {
			opacity: 1 }
	to {
			opacity: 1;
			transform: translate(0) }
}
@keyframes FadeSlideInXl {
	0% {
			opacity: 0;
			transform: translateX(-50%) }
	50% {
			opacity: 1 }
	to {
			opacity: 1;
			transform: translate(0) }
}
@keyframes FadeSlideInXr {
	0% {
			opacity: 0;
			transform: translateX(50%) }
	50% {
			opacity: 1 }
	to {
			opacity: 1;
			transform: translate(0) }
}


/* splide css上書き */
.splide__arrow:focus-visible {
  outline:2px solid #0d6ed0;
  outline-offset:0px
}
.splide.is-focus-in .splide__arrow:focus {
  outline:2px solid #0d6ed0;
  outline-offset:0px
}
.splide__pagination__page:focus-visible {
  outline:2px solid #0d6ed0;
  outline-offset:0px
}
.splide.is-focus-in .splide__pagination__page:focus {
  outline:2px solid #0d6ed0;
  outline-offset:0px
}
@supports(outline-offset:-3px) {
  .splide__slide:focus-visible {
    outline:2px solid #0d6ed0;
    outline-offset:-3px
  }
}
@media screen and (-ms-high-contrast:none) {
  .splide__slide:focus-visible {
    border:2px solid #0d6ed0
  }
}
@supports(outline-offset:-3px) {
  .splide.is-focus-in .splide__slide:focus {
    outline:2px solid #0d6ed0;
    outline-offset:-3px
  }
}
@media screen and (-ms-high-contrast:none) {
  .splide.is-focus-in .splide__slide:focus {
    border:2px solid #0d6ed0
  }
  .splide.is-focus-in .splide__track>.splide__list>.splide__slide:focus {
    border-color:#0d6ed0
  }
}
.splide__toggle:focus-visible {
  outline:2px solid #0d6ed0;
  outline-offset:0px
}
.splide.is-focus-in .splide__toggle:focus {
  outline:2px solid #0d6ed0;
  outline-offset:0px
}