@charset "UTF-8";
/*
Fadein/out
*/

#move{width: 100%;min-width: 1200px;position: relative;overflow: hidden;background: #333;}
#move #loader{background: #333;position: absolute;left: 0;top: 0;width: 100%;height: 100%; z-index: 5;}
#move #loader img{position:absolute;left: 0;top: 0; width: 100%;height: auto;}
#move .fade1{display: block;position: relative;z-index: 1;width: 100%}
#move .fade2,
#move .fade1_1,
#move .fade1_2,
#move .fade1_3,
#move .fade2_1,
#move .fade_copy{display: none; position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index:2}




#move .fade1 img,
#move .fade1_2 img,
#move .fade1_3 img,
#move .fade2 img,
#move .fade_copy img{width: 100%;height: auto;}

#move .fade1_2,
#move .fade1_3{mix-blend-mode: overlay;}



@media screen and (max-width: 767px) {
#move{min-width: 100%; }
#move #loader{min-width: 100%;}
}


.p-hikari {
  position: absolute;
  width: 25%;
  height: 80%;
  left: 9%;
  top: 20%;
  z-index: 10;
  opacity: 0;
  transition: opacity 2s;
}
.p-hikari {  opacity: 1;}
.p-hikari > div {
  mask-image: linear-gradient(to bottom, transparent 20%, #000 70%, #000 70%, transparent 80%);  -webkit-mask-image: linear-gradient(to bottom, transparent 20%, #000 70%, #000 70%, transparent 80%);  opacity: 1;  width: 100%;  height: 100%;}
.p-hikari > div > div {  width: 100%;  height: 100%;  background: url(masktag.png) repeat-y center center;  background-size: 120%;  -webkit-animation-name: hikari;          animation-name: hikari;  -webkit-animation-duration: 3s;          animation-duration: 3s;  -webkit-animation-iteration-count: infinite;          animation-iteration-count: infinite;  -webkit-animation-timing-function: linear;          animation-timing-function: linear;}

.p-hikari2 {
  position: absolute;
  width: 20%;
  height: 72%;
  right: 25%;
  top: 0%;
  z-index: 10;
  opacity: 0;
  transition: opacity 2s;
}

.p-hikari2 {  opacity: 1;}
.p-hikari2 > div {
  mask-image: linear-gradient(to bottom, transparent 20%, #000 70%, #000 70%, transparent 80%);  -webkit-mask-image: linear-gradient(to bottom, transparent 20%, #000 70%, #000 70%, transparent 80%);  opacity: 1;  width: 100%;  height: 100%;}
.p-hikari2 > div > div {  width: 100%;  height: 100%;  background: url(masktag.png) repeat-y center center;  background-size: 140%;  -webkit-animation-name: hikari;          animation-name: hikari;  -webkit-animation-duration: 3s;          animation-duration: 3s;  -webkit-animation-iteration-count: infinite;          animation-iteration-count: infinite;  -webkit-animation-timing-function: linear;          animation-timing-function: linear;}

@media (max-width: 767px) {
  .p-hikari {    width: 35%;    left: 12%;	 height: 65%; }
  .p-hikari2 {    width: 25%;   right: 24%;	 height: 75%; }
}



@-webkit-keyframes hikari {
  0% {
    background-position: 0 100%;
  }
  100% {
    background-position: 0 -100%;
  }
}
@keyframes hikari {
  0% {
    background-position: 0 100%;
  }
  100% {
    background-position: 0 -100%;
  }
}
