@charset "utf-8";


.mir_main{
	width: 100%;
	height: 56.25vw;
	max-height: 100vh;
}
.ui_video_full{
	display: none;
	overflow: hidden;
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 9;
	left: 0;
	top: 0;
	background: #fff;
}
.mir_main .mir_main_over div:nth-child(1) img{
	margin-bottom: 38px;
}
.mir_logo {
	top: 25.7%;
}


.btn_scroll{
	position: fixed;
	z-index: 10;
	right: 50px;
	bottom: 50px;
	width: 32px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	cursor: pointer;
	opacity: 1;
	transition: 0.5s;
}
.btn_scroll:hover{
	opacity: 0.5;
	transition: 0.3s;
}
.btn_scroll_text{
	margin-bottom: 38px;
	font-family: YuGothic, "Yu Gothic Medium", "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif;
	font-size: 12px;
	transform: rotate(90deg);
	letter-spacing: 1px;
}
.btn_scroll_cir{
	position: relative;
	width: 32px;
	height: 32px;
	border: 1px solid #000;
	border-radius: 50%;
}
.btn_scroll_cir span{
	position: absolute;
	left: calc(50% - 3px);
	
	bottom: 13px;
	width: 9px;
	height: 31px;
	background: url(../img/scroll_a.png) no-repeat center bottom;
	animation: sdb 2.3s infinite; 
}
@keyframes sdb {
  0% {
    height: 31px;
		top: auto;
		background-position: center bottom;
  }
	4% {
	  height: 31px;
		top: auto;
		background-position: center bottom;
	}
  50% {
    height: 0px;
		top: auto;
		background-position: center bottom;
  }
	53% {
	  height: 0px;
		top: -14px;
		background-position: center top;
	}
  100% {
    height: 56px;
    top: -14px;
    background-position: center top;
  }
}
.btn_scroll_none{
	opacity: 0;
	transition: 0.5s;
	z-index: -1;
}
.btn_scroll_b .btn_scroll_text{
	margin-bottom: 5px;
	transform: rotate(0deg);
}
.btn_scroll_ico{
	position: relative;
	top: -5px;
	margin-left: 2px;
	animation: sdb_ico 2.5s infinite;
}

@keyframes sdb_ico {
  0% {
		top: -5px;
  }
	15% {
	  top: 5px;
	}
  30% {
   top: -5px;
  }
	45% {
	  top: 5px;
	}
  60% {
   top: -5px;
  }
	100% {
	 top: -5px;
	}
}

@media only screen and (min-width: 0) and (max-width: 950px) {
	
	.ui_video_full_sp{
		display: none;
		overflow: hidden;
		position: absolute;
		width: 100%;
		height: 100vw;
		z-index: 3;
		left: 0;
		top: 0;
		background: #fff;
	}
	.mir_main{
		overflow: hidden;
		display: block;
		margin-bottom: 80px;
		height: 100vw;
	}
	.mir_main .mir_main_over>div:nth-child(1) img{
		margin-bottom: 0;
		max-height: 100%;
		object-fit: cover;
	}
	.btn_scroll{
		display: none;
	}
}

