.falling-snow.fallback {
  width: 100%;
  height: 100%;
  background-image: url('bg-snow.png');
  background-size: 100%;
}
/* ローディング画面の背景 */
.loading {
  position: fixed;
  width: 100vw;

  top: 0px;
  left: 0px;
  background: #000;
  z-index: 9999;
   min-height: 100vh; /* Fallback */
  min-height: calc(var(--vh, 1vh) * 100);
}
/* アニメーション */


.animation {
  transform-origin:(50% 50%);
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%)!important; /* Safari用 */
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  color: #fff;
  -webkit-animation: loadinganimation 1500ms ease-out forwards infinite;
  animation: loadinganimation 1500ms ease-out forwards infinite;
}
@keyframes loadinganimation {
  from,to {
		opacity: 0;
  }
  50% {
		opacity: .5;
  }
}

.mask_button{
  color:WHITE; 
  border: solid 1px #fff!important;
  margin:0 10px 0 10px;
  padding:10px 15px 10px 15px;
}



.subbannertext :hover{
color:BLACK; 
  background-color:WHITE; 
}

.white-popup {
        position: relative;
        background: #FFF;
        padding: 0px!important;
        width: auto;
        max-width: 700px!important;
        margin: 20px auto;
    }

.yyc-day{display:none!important;}
.yyc-day-text{display:none!important;}
.yycountdown-box{
  text-align:center;
  margin: 0;
  color:#fff;
}
 
#popuptimer .yycountdown-box .yyc-day{
  font-size:2.0em;
  color:#fff;
}
#popuptimer .yycountdown-box .yyc-hou{
  font-size:2.0em;
  color:#fff;
}
#popuptimer .yycountdown-box .yyc-min{
  font-size:2.0em;
  color:#fff;
}
#popuptimer .yycountdown-box .yyc-sec{
  font-size:2.0em;
  color:#fff;
}
 
#popuptimer .yycountdown-box .yyc-day-text,
#popuptimer .yycountdown-box .yyc-hou-text,
#popuptimer .yycountdown-box .yyc-min-text,
#popuptimer .yycountdown-box .yyc-sec-text{
  font-size:1.0em;
}


.grid-item_image{
position: relative;
}
.grid-item_image img .grid-item_image a img{
  filter: brightness(70%)!important;
  vertical-align: middle!important;
  margin:0!important;
  padding:0!important;
  border-style:none!important;
}


.grid-item_text_video {
position: absolute!important;
width:80%!important;
top: 50%!important;
left: 50%!important;
-webkit-transform: translate(-50%, -60%)!important; /* Safari用 */
transform: translate(-50%, -50%)!important;
-moz-transform: translate(-50%,-50%)!important;
-ms-transform: translate(-50%,-50%)!important;
-o-transform: translate(-50%,-50%)!important;
  text-align:center!important;
}
.grid-item_text {
 position: absolute!important;
  top: 50%!important;
  left: 50%!important;
  -webkit-transform: translate(-50%, -50%)!important; /* Safari用 */
  transform: translate(-50%, -50%)!important;
text-align:center!important;
  width:80%!important;
}
.grid-item a:link { color: #ffffff!important; }
.grid-item a:visited { color: #ffffff!important; }
.grid-item a:hover { color: #ffffff!important; }
.grid-item a:active { color: #ffffff!important; }


.grid-item .mask {
	width:			100%;
	height:			100%;
	position:		absolute;	/* 絶対位置指定 */
	top:			0;
	left:			0;
	opacity:		0;	/* マスクを表示しない */
	background-color:	rgba(0,0,0,0.4);	/* マスクは半透明 */
	-webkit-transition:	all 0.2s ease;
	transition:		all 0.2s ease;
}
.grid-item:hover .mask {
	opacity:		1;	/* マスクを表示する */
}



.grid-item .mask_s {
	width:			100%;
	height:			100%;
	position:		absolute;	/* 絶対位置指定 */
	top:			0;
	left:			0;
	opacity:		0;	/* マスクを表示しない */
	background-color:	rgba(0,0,0,0.4);	/* マスクは半透明 */
	-webkit-transition:	all 0.2s ease;
	transition:		all 0.2s ease;
}
.grid-item:hover .mask_s {
opacity:		1;	/* マスクを表示する */
}


.grid {
overflow:hidden;
margin-right: auto;
margin-left: auto;
margin: center;
width: auto;  
margin:0;
padding:0;
}
.grid-item {
position: relative;
margin: 0;
}
.grid-item img {
display:block;
  filter: brightness(90%);
}
.grid-item video {
display:block;
}
.grid-item_20per {
width: 20%;
margin: 0;
padding: 0;
}
.grid-item_40per {
width: 40%;
margin: 0;
padding: 0;
}
.grid-item_33per {
width: 25%;
margin: 0!important;
padding: 0;
  float:left;
}
.grid-item_66per {
width: 50%;
margin: 0!important;
padding: 0;
    float:left;
}
.grid-item_100per {
width: 100%;
margin: 0!important;
padding: 0;
}

.grid-item_20per img,
.grid-item_40per img,
.grid-item_33per img,
.grid-item_66per img,
.grid-item_100per img
{
width: 100%;
height: auto;
filter: brightness(90%);
vertical-align: bottom!important;
margin: 0!important;
}
.grid-item_66per video{
width: 100%;
height: auto;
display:block;
  filter: brightness(90%);
}


.grid-item_sizer {
width: 25%;
}

.grid-item video {
display:block;
  filter: brightness(90%);
}

@media screen and (max-width: 1500px) {
 .white-popup {
        position: relative;
        background: #FFF;
        padding: 0px!important;
        width: auto;
       max-width: 500px!important;
        margin: 20px auto;
    }
}


@media screen and (max-width: 800px) {
 
 .white-popup {
        position: relative;
        background: #FFF;
        padding: 0px!important;
        width: auto;
   max-width: 500px!important;
        margin: 20px auto;
    }
  
.grid-item_image img .grid-item_image a img{
  filter: brightness(70%)!important;
  vertical-align: middle!important;
  margin:0!important;
  padding:0!important;
  border:none!important;}
  
	.grid-item_20per {
		width: 33.333%;
	}
	.grid-item_40per {
		width: 66.666%;
	}
  .grid-item_33per {
		width: 50%;
      float:left;
    margin: 0!important;
	}
	.grid-item_66per {
		width: 100%;
        float:left;
      margin: 0!important;
	}
  
.grid-item_sizer {
		width: 50%;
	}
}
.grid-other {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	color: #ffffff;
	background: #333333;
}
.grid-item_gutter {
	margin-left: 0;
	margin-right: 0;
}
.grid-item_text_video {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%); /* Safari用 */
transform: translate(-50%, -50%);
-moz-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
-o-transform: translate(-50%,-50%);
text-align:center!important;
}

.caption {
position: absolute;
top:85%!important;/* Countdown位置制御用 */
width:100%;
margin-top:-.8em;
text-align:center;
}
.grid-item_text {
 position: absolute!important;
  top: 50%!important;
  left: 50%!important;
  -webkit-transform: translate(-50%, -50%)!important; /* Safari用 */
  transform: translate(-50%, -50%)!important;
text-align:center!important;
}

.caption {
position: absolute;
top:70%;/* Countdown位置制御用 */
width:100%;
margin-top:-.7em;
text-align:center;
}

@media screen and (max-width: 480px) {
 
  
.grid-item_image img .grid-item_image a img{
  filter: brightness(70%)!important;
  vertical-align: middle!important;
  margin:0!important;
  padding:0!important;
  border:none!important;
  }
  
.grid-item:active .mask {
	opacity:		1!important;	/* マスクを表示する */
  }

  .grid-item:active .mask_s {
opacity:		1!important;	/* マスクを表示する */
}
  

 
}