/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 30 2025 | 07:04:47 */
/* ここにCSSコードを追加

例:
.example {
    color: red;
}

CSS の知識に磨きをかけるためにご覧ください。
http://www.w3schools.com/css/css_syntax.asp

コメント終わり */ 


/* ふわっと */
.fade {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 1.5s, transform 1s;
}

.fade.active {
	opacity: 1;
	transform: translateY(0px);
}

/* ページトップへ */
.pagetop {
    height: 50px;
    width: 50px;
    position: fixed;
    right: 30px;
    bottom: 30px;
    background: #fff;
    border: solid 2px #38a1fe;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
}

.pagetop__arrow {
    height: 10px;
    width: 10px;
    border-top: 3px solid #38a1fe;
    border-right: 3px solid #38a1fe;
    transform: translateY(20%) rotate(-45deg);
}

/* page-title */
.wave-text{
	text-align:center;
	/* アニメーションの領域確保 */
	margin-top: 0.8em;
}

.wave-text span{
	display: inline-block;
	animation: wave-text 2s ease-in-out infinite;
	color: #38a1fe;
	font-size: 3rem;
	font-weight: 700;
}

/* アニメーション開始タイミングをずらす */
.wave-text span:nth-of-type(1){ animation-delay: 0.0s; }
.wave-text span:nth-of-type(2){ animation-delay: 0.1s; }
.wave-text span:nth-of-type(3){ animation-delay: 0.2s; }
.wave-text span:nth-of-type(4){ animation-delay: 0.3s; }
.wave-text span:nth-of-type(5){ animation-delay: 0.4s; }
.wave-text span:nth-of-type(6){ animation-delay: 0.5s; }
.wave-text span:nth-of-type(7){ animation-delay: 0.6s; }
.wave-text span:nth-of-type(8){ animation-delay: 0.7s; }
.wave-text span:nth-of-type(9){ animation-delay: 0.8s; }
.wave-text span:nth-of-type(10){ animation-delay: 0.9s; }

@keyframes wave-text{
00%{
	transform: translateY(0em);
}
60%{
	transform: translateY(-0.8em);
}
100%{
	transform: translateY(0em);
}
}