/* ====================
now loading
=================== */
body::before {
content: "";
position: fixed;
inset: 0;
z-index: 9999;
background-color: #FFF;
display: grid;
place-items: center;
opacity: 1;
visibility: visible;
transition: opacity 0.6s ease, visibility 0.6s ease;
}

/* ローディング本体 */
body::after {
content: "";
position: fixed;
inset: 0;
z-index: 10000;
margin: auto;
width: 88px;
height: 88px;
border-radius: 50%;

/* 円＋切り欠き */
border: 5px solid rgba(254, 170, 178,.15);
border-top-color: #FEAAB2;
border-right-color: #FEAAB2;

animation: loader-spin 1.1s linear infinite;
transition: opacity 0.6s ease, visibility 0.6s ease;
}

/* ロード完了で消す */
body.siteReady::before,
body.siteReady::after {
opacity: 0;
visibility: hidden;
}

/* 回転アニメーション */
@keyframes loader-spin {
to {
transform: rotate(360deg);
}
}

/* ルビ */
ruby[data-ruby] rt {
display: none;
}
ruby[data-ruby] {
position: relative;
display: inline-block;
}
ruby[data-ruby]::after {
content: attr(data-ruby);
position: absolute;
transform: translate(-50%, -1em);
display: block;
left: 50%;
top: 0;
white-space: nowrap;
font-size: 44%;
letter-spacing: 0;
}


/* ====================
 .link-button
=================== */
.link-button a{
display: inline-grid;
grid-auto-flow: column;
align-items: center;
gap: 1rem;
text-decoration: none;
padding: 1.4rem 8.5rem 1.4rem 8.5rem;
border-radius: 999px;
background: #FAABB1;
border:2px #FAABB1 solid;
color: #fff;
font-weight:700;
position:relative;
transition:.3s;
filter: drop-shadow(0 2px 2px rgba(0,0,0,.18));
}


/* 右端の丸アイコン */
.link-button a::after{
content: "\e5c8";
font-family: 'Material Icons';
font-weight: 700;
font-style: normal;
display: grid;
place-items: center;
width: 2.6rem;
height: 2.6rem;
border-radius: 999px;
background: #FFF;
color:#FAABB1;
position:absolute;
right:1.5rem;
transition:.3s;
}

/* hover */
.link-button a:hover {
background: #FFF;
color: #FEAAB2;
border:2px #FEAAB2 solid;
}

.link-button a:hover::after{
background: #FAABB1;
color:#FFF;
}


/* ====================
ページ上へ戻るボタン
=================== */
.to-top-btn{
position:fixed;
right:3rem;
bottom:3rem;
width:6rem;
height:6rem;
background:#FDAAB2;
border:0px #FF0000 solid;
border-radius:999px;
cursor:pointer;
opacity:0;
visibility:hidden;
transform:translateY(20px);
z-index:999;
display:flex;
align-items:center;
justify-content:center;
transition:
	opacity .3s ease,
	transform .3s ease,
	visibility .3s;
}

/* 矢印アイコン（擬似要素） */
.to-top-btn::before{
content: "\e5d8";
font-family: 'Material Icons';
font-weight: 700;
font-style: normal;
color:#FFF;
font-size: 3rem;
line-height: 1;
transform: translateY(0);
transition: transform 0.4s cubic-bezier(.19, 1, .22, 1);
}

/* 表示状態 */
.to-top-btn.show{
opacity:1;
visibility:visible;
transform:translateY(0);
}

/* hover時：矢印が少し上へ */
.to-top-btn:hover::before{
transform: translateY(-4px);
}

/* =============== */
@media (max-width: 767px) {
.to-top-btn{
position:fixed;
right:1.5rem;
bottom:1.5rem;
}
}