/*=========================================================================

BASIC
  
==========================================================================*/
@keyframes loop {
	0% {background-position: 0 0;  }
100% {background-position: 0 -1600px;}
}

/*-----------------------------------------------------------------------------------*/
#blocBasic {width: 92%; max-width: 1200px; margin: 0 auto;}

#pageTitle {line-height: 140%; font-size: 600; color: #000; text-align: center;}




/*=========================================================================

TOP PAGE
  
==========================================================================*/
#Wrapper.toppage {position: relative; }

img#bg {width:100%; height:100vh; display:block; z-index: -1; position: relative;}

/*-----------------------------------------------------------------------------------*/
body#Top #Header {background-image: none;}


/*-----------------------------------------------------------------------------------*/
#topEntrance, #worksLogo {
	-moz-transition: .2s;
	-webkit-transition: .2s;
	-o-transition: .2s;
	-ms-transition: .2s;
	transition: .2s;
}

#topEntrance {height: 100vh;width: 100% ;background: rgba(0,0,0,1) !Important;}
#topEntrance.go {background: rgba(0,0,0,.0)!Important;}

/*-----------------------------------------------------------------------------------*/
#worksLogo {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
background-image: url("../img/bg.jpg");
background-repeat:  repeat;
background-position: center top;
background-size: 60%;
z-index: -1;

}

#topEntrance.go #worksLogo {-moz-animation: loop 130s linear infinite;
animation: loop 130s linear infinite;}




/*-----------------------------------------------------------------------------------*/
#enterMovie img {
width:100%;
height:auto;
max-width: 1200px;
display:block;
margin: 0 auto;
background-position: center;
background-repeat: no-repeat;
background-size: cover;

}
#enterMovie{
	background: #000;
	overflow: hidden;
	position: absolute;
	left: 0px;
	top: 50%;
	width: 100%;
		z-index: 1;
	-moz-transform: translate(0%, -50%);
	-webkit-transform: translate(0%,-50%);
	-o-transform: translate(0%, -50%);
	-ms-transform: translate(0%, -50%);
	transform: translate(0%, -50%);
}

#enterMovie video {height: 75vh;}

img#Movie {background-image: url("../img/top.gif");}

img#topVisual {background-image: url("../img/topvisual.jpg");}


/*=========================================================================

ABOUT
  
==========================================================================*/
#about_dataBox, #aboutPic {height: auto;}

/*-----------------------------------------------------------------------------------*/
#aboutPic img {width: 100%; height: auto; display: block; object-fit: cover;}


/*-----------------------------------------------------------------------------------*/
dl#about_dataList {height: auto; width: 100%; height: auto;}

dl#about_dataList dt, dl#about_dataList dd {line-height: 160%;height: auto; font-weight: 600;}




/*=========================================================================

WORKS
  
==========================================================================*/
body#Works #Wrapper:before {
content: "";
position: fixed;
z-index: -1;
width: 100%;
height: 100%;
background-image: url("../img/bg_works.jpg");
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}

/*-----------------------------------------------------------------------------------*/
body#Works #pageTitle {color: #fff;}

/*-----------------------------------------------------------------------------------*/
#works_listBox {color: #fff;  margin: 0 auto; height: auto;}

/*-----------------------------------------------------------------------------------*/
dl#worksList {letter-spacing: -.4em;}
dl#worksList dt, dl#worksList dd,dl#worksList dd span {display: inline-block; vertical-align: top; line-height: 140%; height: auto:}


/*=========================================================================

PHOTO
  
==========================================================================*/
#Section01.photo #blocBasic {padding: 0 !important; width: 100%; height: 100vh; max-width: inherit;}


/*-----------------------------------------------------------------------------------*/
ul#photoList {list-style-type: none; letter-spacing: -.4em;}
ul#photoList li {float: left; height: auto; letter-spacing: 0; display: inline-block; vertical-align: top;}

ul#photoList li a, ul#photoList li img {width: 100%; height: auto;  display: block;}
ul#photoList li a:hover {filter: alpha(opacity=75); -moz-opacity:.75; opacity:.75;}