*,
*::after,
*::before {
	box-sizing: border-box;
	word-wrap: break-word;
}

html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
dl,
li,
dt,
dd,
p,
div,
span,
img,
a,
table,
tr,
th,
td,
small,
button,
time,
figure {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	font-size: 100%;
	color: inherit;
	vertical-align: baseline;
}

header,
footer,
nav,
section,
article,
aside,
figure,
figcaption {
	display: block;
}

body {
	line-height: 1;
}

ol,
ul {
	list-style: none;
	list-style-type: none;
}

a {
	text-decoration: none;
	cursor: pointer;
}

img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}

body {
	color: #000;
	font-family: "", sans-serif;
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
	position: relative;
}

.main {
	width: 100vw;
	height: 100vh;
	position: relative;
}

.remake {
	position: absolute;
	top: 50%;
	left: 50%;
	translate: -50% -50%;
	opacity: 0;
	animation: remake 1s ease 0.5s 1 both;
}

.remake__logo {
	width: 60vw;
}

.remake__text {
	font-size: 3vw;
	text-align: center;
	position: absolute;
	top: 110%;
	left: 50%;
	translate: -50%;
}

.divination {
	width: 100vw;
	height: 100vh;
	background: #fff;
	position: absolute;
	top: 50%;
	left: 50%;
	translate: -50% -50%;
	z-index: 10;
	overflow: hidden;
	display: none;
}

.divination.is-active {
	display: block;
}

.divination__bird-wrap {
	position: absolute;
	width: inherit;
	height: inherit;
	background: #fff;
	z-index: 15;
	animation: opacity-all 1s ease 13s 1 both;
	perspective: 10000px;
}

.divination__bird01 {
	width: 18vw;
	position: absolute;
	top: -100%;
	left: 100%;
	translate: 0% -100%;
	z-index: 20;
}

.divination__bird01.is-active {
	animation: bird-in 3s ease 0s 1 forwards, opacity-in 0.1s ease 3s forwards;
}

.divination__bird02 {
	width: 18.1vw;
	position: absolute;
	top: 50%;
	left: 50%;
	translate: -65% -50%;
	opacity: 0;
}

.divination__bird02.is-active {
	animation: opacity-out 0.2s ease 2.8s 1 forwards, opacity-in 0s linear 6.5s 1 forwards;
}

.divination__bird03 {
	width: 18vw;
	position: absolute;
	top: 50%;
	left: 50%;
	translate: -50% -50%;
	z-index: 20;
	opacity: 0;
}

.divination__bird03.is-active {
	animation: opacity-out 0.1s ease-in 6.4s 1 forwards, bird-out 3s ease-in 6.7s 1 forwards;
}

.divination__omikuzi {
	display: block;
	color: #fff;
	font-size: 1vw;
	font-weight: 700;
	letter-spacing: 0.05em;
	position: absolute;
	top: calc(50% + 8.4vw);
	left: 44.2%;
	translate: -50% -50%;
	writing-mode: vertical-lr;
	z-index: 20;
	clip-path: polygon(0 0, 100% 0, 100% 0%, 0 0%);
	white-space: nowrap;
}

.divination__omikuzi.is-active {
	animation: omikuzi 10s linear 3s 1 both;
}

.divination__omikuzi span {
	display: block;
	background: #000;
	padding: 1vw 0.5vw;
	border-radius: 0.5vw;
	animation: omikuzi-rotate 10s linear 3s 1 both;
	position: relative;
	overflow: hidden;
}

.divination__omikuzi span::after {
	content: "";
	width: 100%;
	height: 100%;
	background: #000;
	position: absolute;
	top: 0;
	left: 0;
	pointer-events: none;
	animation: omikuzi-back 10s linear 3s 1 both;
}

.divination__main {
	position: absolute;
	top: 50%;
	left: 50%;
	translate: -50% -50%;
	z-index: 11;
}

.divination__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: -moz-max-content;
	min-width: max-content;
	position: absolute;
	top: 50%;
	left: 50%;
	translate: -50% -50%;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease;
}

.divination__item.is-active {
	opacity: 1;
	visibility: visible;
}

.divination__item-title {
	font-size: 12vw;
	font-weight: 700;
	position: relative;
}

.divination__item-title span {
	min-width: -moz-max-content;
	min-width: max-content;
	font-size: 2vw;
	position: absolute;
	top: 120%;
	left: 50%;
	translate: -50%;
}

.divination__item-title.is-red {
	color: red;
}

.divination__item-title.is-gray2 {
	color: rgb(15, 14, 14);
}

.divination__item-title.is-gray {
	color: gray;
}

.divination__item-title.is-blue {
	color: rgb(0, 0, 194);
}

.divination__item-title.is-yellow {
	color: rgb(236, 236, 8);
}

.divination__item-title.is-green {
	color: green;
}

.divination__item-title.is-purple {
	color: purple;
}

.divination__item-text-wrap {
	margin-top: 13vh;
	text-align: center;
	animation: omikuzi-text 1s ease 14s 1 both;
}

.divination__item-text {
	font-size: 2vw;
	line-height: 1.5;
}

@media screen and (min-width: 1000px) {

.is-pc-sp {
	display: block;
}

.is-tab {
	display: none;
}

.is-tab-sp {
	display: none;
}

.is-sp {
	display: none;
}

.is-dsp {
	display: none;
}

}

@media screen and (max-width: calc(1000px - 1px)) {

.is-pc {
	display: none;
}

.is-pc-sp {
	display: none;
}

.is-tab {
	display: block;
}

.is-sp {
	display: none;
}

.is-dsp {
	display: none;
}

}

@media screen and (max-width: 767px) {

.is-pc-tab {
	display: none;
}

.is-pc-sp {
	display: block;
}

.is-tab {
	display: none;
}

.is-sp {
	display: block;
}

.divination__bird01 {
	width: 40vw;
}

.divination__bird02 {
	width: 40vw;
}

.divination__bird03 {
	width: 40vw;
}

.divination__omikuzi {
	font-size: 3vw;
	top: calc(50% + 20vw);
	opacity: 1;
	left: 37.5%;
}

.divination__omikuzi.is-active {
	animation: omikuzi-sp 10s linear 3s 1 both;
}

.divination__omikuzi span {
	padding-inline: 2.5vw;
	padding-block: 1.25vw;
	border-radius: 1.5vw;
	animation: omikuzi-rotate-sp 10s linear 3s 1 both;
}

.divination__item-title {
	font-size: 15vw;
}

.divination__item-title span {
	font-size: 4vw;
}

.divination__item-text-wrap {
	margin-top: 9vw;
}

.divination__item-text {
	font-size: 4vw;
}

}

@media screen and (max-width: calc(375 - 1px)) {

.is-dsp {
	display: block;
}

}

@keyframes remake {

0% {
	opacity: 0;
}

100% {
	opacity: 1;
}

}

@keyframes opacity-all {

0% {
	opacity: 1;
}

100% {
	opacity: 0;
}

}

@keyframes bird-in {

0% {
	top: 0%;
	left: 100%;
	translate: 0% -100%;
}

50% {
	top: 50%;
}

100% {
	top: 50%;
	left: 50%;
	translate: -50% -50%;
}

}

@keyframes opacity-in {

0% {
	opacity: 1;
}

100% {
	opacity: 0;
}

}

@keyframes opacity-out {

0% {
	opacity: 0;
}

100% {
	opacity: 1;
}

}

@keyframes bird-out {

0% {
	top: 50%;
	left: 50%;
	translate: -50% -50%;
}

50% {
	top: 50%;
}

100% {
	top: -100%;
	left: 0%;
	translate: -100% -100%;
}

}

@keyframes omikuzi-back {

0% {
	opacity: 0;
}

53.9% {
	opacity: 0;
}

54% {
	opacity: 1;
}

61.9% {
	opacity: 1;
}

62% {
	opacity: 0;
}

69.9% {
	opacity: 0;
}

70% {
	opacity: 1;
}

77.9% {
	opacity: 1;
}

78% {
	opacity: 0;
}

82% {
	opacity: 0;
}

100% {
	opacity: 0;
}

}

@keyframes omikuzi {

0% {
	clip-path: polygon(0 0, 100% 0, 100% 0%, 0 0%);
	top: calc(50% + 8.4vw);
	rotate: y 0deg;
}

4% {
	clip-path: polygon(0 0, 100% 0, 100% 0%, 0 0%);
	top: calc(50% + 8.4vw);
}

5% {
	clip-path: polygon(0 0, 100% 0, 100% 10%, 0 10%);
	top: calc(50% + 7.9vw);
}

8% {
	clip-path: polygon(0 0, 100% 0, 100% 10%, 0 10%);
	top: calc(50% + 7.9vw);
}

9% {
	clip-path: polygon(0 0, 100% 0, 100% 20%, 0 20%);
	top: calc(50% + 7.4vw);
}

24% {
	clip-path: polygon(0 0, 100% 0, 100% 20%, 0 20%);
	top: calc(50% + 7.4vw);
}

25% {
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

26.9% {
	opacity: 1;
}

27% {
	top: -15%;
	left: 44.2%;
	opacity: 0;
}

49.9% {
	opacity: 0;
}

50% {
	top: -10%;
	left: 50%;
	rotate: y 0deg;
	opacity: 1;
}

82% {
	rotate: y -720deg;
	top: 50%;
}

90% {
	scale: 1;
}

93% {
	opacity: 1;
}

98% {
	opacity: 0;
}

100% {
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	top: 50%;
	left: 50%;
	rotate: y -720deg;
	scale: 7;
	opacity: 0;
}

}

@keyframes omikuzi-sp {

0% {
	clip-path: polygon(0 0, 100% 0, 100% 0%, 0 0%);
	top: calc(50% + 20vw);
}

4% {
	clip-path: polygon(0 0, 100% 0, 100% 0%, 0 0%);
	top: calc(50% + 20vw);
}

5% {
	clip-path: polygon(0 0, 100% 0, 100% 10%, 0 10%);
	top: calc(50% + 19vw);
}

8% {
	clip-path: polygon(0 0, 100% 0, 100% 10%, 0 10%);
	top: calc(50% + 19vw);
}

9% {
	clip-path: polygon(0 0, 100% 0, 100% 20%, 0 20%);
	top: calc(50% + 18vw);
}

24% {
	clip-path: polygon(0 0, 100% 0, 100% 20%, 0 20%);
	top: calc(50% + 18vw);
}

25% {
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

26.9% {
	opacity: 1;
}

27% {
	top: -15%;
	left: 37.5%;
	opacity: 0;
}

49.9% {
	opacity: 0;
}

50% {
	top: -10%;
	left: 50%;
	opacity: 1;
}

82% {
	top: 50%;
}

90% {
	scale: 1;
}

93% {
	opacity: 1;
}

98% {
	opacity: 0;
}

100% {
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	top: 50%;
	left: 50%;
	scale: 4;
	opacity: 0;
}

}

@keyframes omikuzi-rotate {

0% {
	rotate: y 0deg;
}

50% {
	rotate: y 0deg;
}

82% {
	rotate: y -720deg;
}

100% {
	rotate: y -720deg;
}

}

@keyframes omikuzi-rotate-sp {

0% {
	rotate: y 0deg;
}

50% {
	rotate: y 0deg;
}

82% {
	rotate: y -720deg;
}

100% {
	rotate: y -720deg;
}

}

@keyframes omikuzi-text {

0% {
	translate: 0 2vh;
	opacity: 0;
}

100% {
	translate: 0 0%;
	opacity: 1;
}

}

