/* **************************************************

  		　　　　　　　ヘッダー

************************************************** */
header {
	width:100%;
	height:var(--header-height);
	/* position:fixed; */
    position:absolute;
	top:0;
	left:0;
	z-index:9999;

    background:#000;
    display:flex;
    justify-content:center;
}
#header_inner {
    width:96%;
	height:100%;
	display:flex;
    justify-content:flex-end;
	align-items:center;
	margin:0 auto;
    position:absolute;
}
/* WordPress用 */
body.page-template-page-top #header_inner {
    margin-top:1.5rem;
}

header h1 {
    position:absolute;
    top:0;
    left:0;
    background:#000;
    z-index:100;
    padding:1rem 1.5rem 0.75rem 1rem;
}

/* ロゴ画像だけアニメーション */
header h1 img {
    width:10vw;
    height:auto;

    /* 最初の状態 */
    /* opacity: 0;
    transform: translateY(-25px) scale(1.3);
    transform-origin: center center;
    animation: logoStamp 0.6s ease-out 0.2s forwards; */
}

/* ハンコ「ポンッ」アニメーション */
@keyframes logoStamp {
    0% {
        opacity: 0;
        transform: translateY(-25px) scale(1.3);
    }
    60% {
        opacity: 1;
        transform: translateY(0) scale(0.9); /* 押して一瞬つぶれる */
    }
    80% {
        transform: translateY(-4px) scale(1.05); /* 弾んで戻る */
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}