/*
Theme Name: Lightning Child
Theme URI: 
Template: lightning
Description: 
Author: 
Tags: 
Version: 0.6.0
*/


/*水平垂直中央寄せ*/
.vkp_catch_typing{
  display: flex;
  justify-content: center;
  align-items: center;
}
/* テキスト */
.vkp_catch_typing p{
  display: inline-block;
  font-size:min(32px,6.6vw);
  line-height:1.4;
  width: 10ch;
  border-right: 3px solid currentColor;
  overflow: hidden;
  white-space: nowrap;
  /*アニメーション*/
  animation: typing 3s steps(10), blinkcursor .4s step-end infinite alternate;
}

@keyframes typing {
	0% {
		width: 0;
	}
}
/*点滅カーソル*/
@keyframes blinkcursor {
  50% {
    border-color: transparent
  }
}

hr.vkp_hr_short{
width: 3rem;
height: 2px;
}


.wp-block-group.vkp_fadein{
 animation-name: fadein;
 animation-duration: 1s; /* アニメーションの時間 */
 animation-delay:3s; /* 3秒後に開始 */
 animation-fill-mode:backwards;/*最初のキーフレームの状態*/
}
@keyframes fadein{
  0%{
    opacity: 0;
    transform: translatey(20px);/* 動かす距離 */
   }
  100%{
    opacity: 1;
    transform: translatey(0);
  }
}







.vkp_button-through-arrow.vk_button .vk_button_link.is-style-outline {
 position: relative;
 z-index: 0; 
 border-radius: 0;
 padding: 12px 35px;
 letter-spacing: 0.1em;
 width: 240px;
}
   
.vkp_button-through-arrow.vk_button .vk_button_link.is-style-outline::before {
 content: '';
 display: block;
 position: absolute;
 top: 0;
 left: 0;
 width: 0;
 height: 100%;
 background-color: currentColor;
 z-index: -1;
 transition: .3s;
}

.vkp_button-through-arrow.vk_button .vk_button_link.is-style-outline:hover::before {
 width: 100%;
}

.vkp_button-through-arrow.vk_button .vk_button_link.is-style-outline .vk_button_link_caption::before {
 content: '';
 position: absolute;
 display: block;
 width: 80px;
 height: 1px;
 bottom: 50%;
 right: -45px;
 border-bottom: solid 2px currentColor;
}

.vkp_button-through-arrow.vk_button .vk_button_link.is-style-outline .vk_button_link_caption:after {
 content: '';
 position: absolute;
 display: block;
 width: 14px;
 height: 2px;
 background: currentColor;
 bottom: calc(50% + 5px);
 right: -45px;
 transform: rotate(45deg);
}

.vkp_button-through-arrow.vk_button .vk_button_link.is-style-outline:hover {
 opacity: unset;
 box-shadow: unset;
 background-color:  transparent !important;
 border: solid 1px;
}