*,*::before,*::after{
    margin:0;padding:0;box-sizing:border-box
}:where([hidden]:not([hidden='until-found'])){
    display:none!important
}:where(html){
    -webkit-text-size-adjust:none;tab-size:2
}
@media (prefers-reduced-motion:no-preference){
    :where(html:focus-within){scroll-behavior:smooth}
}:where(body){
    line-height:1.5;font-family:system-ui,sans-serif;-webkit-font-smoothing:antialiased
}:where(button){
    all:unset
}:where(input,button,textarea,select){
    font:inherit;color:inherit
}:where(textarea){
    resize:vertical;resize:block
}:where(button,label,select,summary,[role='button'],[role='option']){
    cursor:pointer
}:where(:disabled){
    cursor:not-allowed
}:where(label:has(>input:disabled),label:has(+input:disabled)){
    cursor:not-allowed}:where(a){color:inherit;text-underline-offset:.2ex
}:where(ul,ol){
    list-style:none
}:where(img,svg,video,canvas,audio,iframe,embed,object){
    display:block
}:where(img,picture,svg,video){
    max-inline-size:100%;block-size:auto
}:where(p,h1,h2,h3,h4,h5,h6){
    overflow-wrap:break-word
}:where(h1,h2,h3){
    line-height:calc(1em + 0.5rem);text-wrap:balance
}:where(hr){
    border:none;border-block-start:1px solid;color:inherit;block-size:0;overflow:visible
}:where(:focus-visible){
    outline:3px solid CanvasText;box-shadow:0 0 0 5px Canvas;outline-offset:1px
}:where(:focus-visible,:target){
    scroll-margin-block:8vh
}:where(.visually-hidden:not(:focus-within,:active)){
    clip-path:inset(50%)!important;height:1px!important;width:1px!important;overflow:hidden!important;position:absolute!important;white-space:nowrap!important;border:0!important
}

@font-face {
    font-family: 'Corporate-Mincho';
    src: url('./font/Corporate-Mincho-ver3.woff') format('woff');
}

@font-face {
    font-family: 'Marchen';
    src: url('./font/kurobara-cinderella.ttf') format('ttf');
    src: url('./font/Ronde-B_square.otf') format('ttf');
}

body {
    margin: 0;
    font-family: Arial, sans-serif;
    text-align: center;
    background-color: #964b87;
    overflow: hidden;
    touch-action: manipulation; /* iOSのスクロール制御 */
}

/* Loading背景画面設定　*/
#splash {
    /*fixedで全面に固定*/
	position: fixed;
    width: 100%;
	height: 100%;
	z-index: 998;
	text-align:center;
	color:#fff;
}


/*割れる画面のアニメーション*/
.loader_cover {
    /* width: 100%;
    height: 50%; */
    width: 100%;
    height: 100%;
    background-color: #2b2b2b;
    transition: all .2s cubic-bezier(.04, .435, .315, .9);
    /* transform: scaleY(1); */
    transform: scaleX(1);
}

/*上の画面*/
.loader_cover-up {
    /* transform-origin: center top; */
    transform-origin: center left;
}

/*下の画面*/
.loader_cover-down {
    position: absolute;
    bottom: 0;
    /* transform-origin: center bottom; */
    transform-origin: center right;
}

/*クラス名がついたらY軸方向に0*/
.coveranime {
    /* transform: scaleY(0); */
    transform: scaleX(0);
}


/* Loading画像中央配置　*/
#splash_logo {
    position: absolute;
    top: 45%;
    left: 50%;
    z-index: 999;
    transform: translate(-50%, -50%);
}
  
#splash_logo img {
    width:400px;
    z-index: 999;
}

/* Loading画像中央配置　*/
#splash_text {
	position: absolute;
	top: 70%;
	left: 50%;
    z-index: 999;
	transform: translate(-50%, -50%);
	color: #fff;
    width: 1438px;
}

.container {
    width: 1438px;
    height: 100vh;
    margin: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transition: background 0.5s ease-in-out;
    position: relative;
}

#title {
    color: white;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: Marchen;
    font-size: 2em;
    font-weight: bold;
}

.image {
    position: absolute;
    bottom: 10%;
    width: 300px;
    height: auto;
}

.end {
    position: absolute;
    bottom: 10%;
    width: 300px;
    height: auto;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes typing {
    from { width: 0; }
    to { width: 100%; }
}

.storyText {
    position: absolute;
    width: 80%;
    color: white;
    font-family: Corporate-Mincho;
    font-size: 20px;
    text-align: center;
    padding: 10px;
    margin-inline: auto;
    line-height: 2;
    font-feature-settings: "palt";
    letter-spacing: 5px;
}

.end-text {
    position: absolute;
    width: 80%;
    color: black;
    font-family: Corporate-Mincho;
    font-size: 20px;
    text-align: center;
    padding: 10px;
    margin-inline: auto;
    line-height: 1.6;
    font-feature-settings: "palt";
    letter-spacing: 5px;
}

.fade-in-text {
    opacity: 0;
    transition: opacity 1s ease-in-out;
}

.fade-in-text.visible {
    opacity: 1;
}

.ad-box {
    bottom: 0;
}


