@charset "UTF-8";
/* CSS Document */


img{
	max-width: 100%;
	height: auto;
	width /***/:auto;　
}
#cont{
	width:100%;
	padding-top:80px;
	z-index:-10;
}

.cont_ttl{
	height:auto;
	padding-left:10px;
	margin:0 0 0 25px;
	border-left:solid #000 1px;
	letter-spacing:0.4em;
	text-decoration:none;
	color:#333333;
}

.content {
	padding: 0px;
	position:relative;
}

.content_txt {
	width:100%;
	text-align:center;
	color:#FFFFFF;
	font-size:0.75em;
	letter-spacing:0.3em;
	position:absolute;
	margin:35% 0;
}

.move_thumb a:hover{
     filter:alpha(opacity=90);
     -moz-opacity:0.90;
     -khtml-opacity: 0.90;
     opacity:0.90;
}



/********   Profile   ********/

.prof_cont{
	width:90%;
	margin: 0 auto;
}

.prof_cont_inner{
	margin:20% 0 0 0;
}

.txt1{
	text-align:center;
	font-size:0.75em;
	letter-spacing:0.3em;
	margin:50px 0 5px 0;
}

.txt2{
	text-align:center;
	font-size:1.4em;
	letter-spacing:0.4em;
	margin:10px 0 25px 0;
}

.txt3{
	text-align:center;
	font-size:0.9em;
	letter-spacing:0.2em;
	margin:10px 0 25px 0;
}

.txt4{
	text-align:center;
	font-size:0.8em;
	letter-spacing:0.3em;
	line-height:2em;
	margin:50px 0 25px 0;
}







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

#head_logo{
	width:500px;
	height: 26px;
	margin:25px;
	font-size:1.2em;
	font-weight:400;
	letter-spacing:0.4em;
}
#head_logo a{
	text-decoration:none;
}

#head_logo a:hover{
	text-decoration:none;
     filter:alpha(opacity=80);
     -moz-opacity:0.80;
     -khtml-opacity: 0.80;
     opacity:0.80;
}

.txt_small{
	font-size:0.6em;
	font-weight:normal;
	letter-spacing:0.3em;
}
	
.cont_ttl{
	font-size:0.8em;
}
	
	

/********   Works Renewal2020   ********/
	

.works_inner{
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding-top: 75px;
	padding-left: 25px; 
	padding-right: 25px;
}
	
.my_slider .sp-selected-thumbnail {
	/* border: 4px solid #000; */
	opacity: 1.0;
}	

.works_para .sp-selected-thumbnail {
	/* border: 4px solid #000; */
	opacity: 1.0;
}


/********   Movie   ********/

.grid3 {
	width: 100%;
	max-width: 1470px;
	min-width: 950px; 
	margin: 0 auto;
	overflow: hidden;
}

.grid-pad3 {
	padding-top: 50px;
	padding-left: 100px; 
	padding-right: 0; 
}

[class*='col-3'] {
	float: left;
  	min-height: 1px;
	padding-right: 100px; /* column-space */
	margin: 0 0 100px 0;
}

.col-3 {
	width: 33%;
}

#movie_txt{
	height:40px;
	margin:15px 0 5px 0;
}

.movie_ttl{
	text-align:left;
	font-size:0.75em;
	letter-spacing:0.1em;
}

.movie_ttl_sub{
	text-align:left;
	font-size:50%;
	letter-spacing:0.05em;
	margin:2px 0 0 0;
}

.txt_small2{
	font-size:70%;
	font-weight:normal;
	letter-spacing:0.20em;
}



/********   Contact   ********/

.contact_cont{
	max-width: 500px;
	margin: 0 auto;
}

.contact_cont_inner{
	margin:20% 0 0 0;
}

.txt5{
	text-align:left;
	font-size:0.7em;
	letter-spacing:0.3em;
	margin:50px 0 5px 0;
}

.txt6{
	text-align:left;
	font-size:1.4em;
	letter-spacing:0.4em;
	margin:10px 0 40px 0;
}

.txt7{
	text-align:left;
	font-size:0.65em;
	letter-spacing:0.2em;
	margin:30px 0 0 0;
}

.txt8{
	text-align:left;
	font-size:0.8em;
	letter-spacing:0.3em;
	line-height:2em;
	margin:20px 0 20px 0;
}
	.txt8 a {
		text-decoration: none;
		border-bottom: 1px dotted #999;
	}
	.txt8 a:hover{
		border-bottom: none;
		opacity: 0.6;
	}

.line{
	width:100%;
	height:5px;
	border-bottom:1px solid #333;
}

.line_dot{
	width:100%;
	height:1px;
	border-bottom:1px dotted #333;
}

.btn_google{
	text-align:right;
	margin:15px 0 0 0;
}
.btn_google a {
	text-decoration: none;
	display: block;
}
.btn_google a:hover {
	text-decoration: none;
     filter:alpha(opacity=80);
     -moz-opacity:0.80;
     -khtml-opacity: 0.80;
     opacity:0.80;
}


}





@media screen and (max-width: 949px){
	
#head_logo{
	width:400px;
	height: 26px;
	margin:25px;
	font-size:1.1em;
	font-weight:400;
	letter-spacing:0.4em;
}
#head_logo a{
	text-decoration:none;
}

#head_logo a:hover{
	text-decoration:none;
     filter:alpha(opacity=80);
     -moz-opacity:0.80;
     -khtml-opacity: 0.80;
     opacity:0.80;
}

.txt_small{
	font-size:0.5em;
	font-weight:normal;
	letter-spacing:0.3em;
}

.txt_small2{
	font-size:0.6em;
	font-weight:normal;
	letter-spacing:0.25em;
}
	
	
/********   Works Renewal2020   ********/

.works_inner{
	width: 90%;
	margin: 0 auto;
	padding-top: 75px;
	padding-left: 5%; 
	padding-right: 5%;
}

.my_slider .sp-selected-thumbnail {
	/* border: 4px solid #000; */
	opacity: 1.0;
}	

.works_para .sp-selected-thumbnail {
	/* border: 4px solid #000; */
	opacity: 1.0;
}

	



/********   Movie   ********/


.grid3 {
	width: 100%;
	max-width: 949px;
	min-width: 641px; /* when using padded grid on ipad in portrait mode, width should be viewport-width - padding = (768 - 20) = 748. actually, it should be even smaller to allow for padding of grid containing element */
	margin: 0 auto;
	overflow: hidden;
}

.grid-pad3 {
	padding-top: 50px;
	padding-left: 50px; 
	padding-right: 0; 
}

[class*='col-3'] {
	float: left;
  	min-height: 1px;
	padding-right: 50px; /* column-space */
	margin: 0 0 100px 0;
}

.col-3 {
	width: 50%;
}

#movie_txt{
	height:50px;
	margin:10px 0 5px 0;
}

.movie_ttl{
	text-align:left;
	font-size:0.8em;
	letter-spacing:0.1em;
	margin:15px 0 0 0;
}

.movie_ttl_sub{
	text-align:left;
	font-size:60%;
	letter-spacing:0.03em;
	margin:2px 0 0 0;
}



/********   Contact   ********/

.contact_cont{
	width: 70%;
	margin: 0 auto;
}

.contact_cont_inner{
	margin:20% 0 0 0;
}

.txt5{
	text-align:left;
	font-size:0.7em;
	letter-spacing:0.3em;
	margin:50px 0 5px 0;
}

.txt6{
	text-align:left;
	font-size:1.4em;
	letter-spacing:0.4em;
	margin:10px 0 40px 0;
}

.txt7{
	text-align:left;
	font-size:0.65em;
	letter-spacing:0.2em;
	margin:30px 0 0 0;
}

.txt8{
	text-align:left;
	font-size:0.8em;
	letter-spacing:0.3em;
	line-height:2em;
	margin:20px 0 20px 0;
}

.line{
	width:100%;
	height:5px;
	border-bottom:1px solid #333;
}

.line_dot{
	width:100%;
	height:1px;
	border-bottom:1px dotted #333;
}

.btn_google{
	text-align:right;
	margin:15px 0 0 0;
}
.btn_google a {
	text-decoration: none;
	display: block;
}
.btn_google a:hover {
	text-decoration: none;
     filter:alpha(opacity=80);
     -moz-opacity:0.80;
     -khtml-opacity: 0.80;
     opacity:0.80;
}

	
}




@media screen and (max-width:640px){
	
#head_logo{
	width:80%;
	height: 26px;
	margin:25px;
	font-size:0.9em;
	letter-spacing:0.2em;
}
#head_logo a{
	text-decoration:none;
}

#head_logo a:hover{
	text-decoration:none;
     filter:alpha(opacity=80);
     -moz-opacity:0.80;
     -khtml-opacity: 0.80;
     opacity:0.80;
}

.txt_small{
	font-size:0.5em;
	font-weight:normal;
	letter-spacing:0.3em;
}



/********   Works Renewal2020   ********/

.works_inner{
	width: 86%;
	padding-top: 50px;
	padding-left: 7%; 
	padding-right: 7%;
}

.my_slider .sp-selected-thumbnail {
	/* border: 4px solid #000; */
	opacity: 1.0;
}	

.works_para .sp-selected-thumbnail {
	/* border: 4px solid #000; */
	opacity: 1.0;
}



/********   Movie   ********/


.grid3 {
	width: 100%;
	min-width: 0;
	margin-left: 0;
	margin-right: 0;
	padding-left: 15px; /* grid-space to left */
	padding-right: 15px; /* grid-space to right: (grid-space-left - column-space) e.g. 20px-10px=10px */
}


[class*='col-3'] {
	float: left;
  	min-height: 1px;
	margin: 0 0 50px 0;
}
.col-3 {
	width: 50%;
}

#movie_txt{
	height:40px;
	margin:10px 0 2px 0;
}


#movie_txt{
	height:60px;
	margin:15px 0 5px 0;
}

.movie_ttl{
	text-align:left;
	font-size:0.7em;
	letter-spacing:0.1em;
	margin:15px 0 0 0;
}

.movie_ttl_sub{
	text-align:left;
	font-size:50%;
	letter-spacing:0.03em;
	margin:2px 0 0 0;
}

.txt_small{
	font-size:0.6em;
	font-weight:normal;
	letter-spacing:0.3em;
}



/********   Contact   ********/

.contact_cont{
	width: 100%;
	margin: 0 auto;
}

.contact_cont_inner{
	margin:20% 0 0 0;
	padding-left: 25px; 
	padding-right: 25px; 
}

.txt5{
	text-align:left;
	font-size:0.7em;
	letter-spacing:0.2em;
	margin:50px 0 5px 0;
}

.txt6{
	text-align:left;
	font-size:1.2em;
	letter-spacing:0.3em;
	margin:10px 0 40px 0;
}

.txt7{
	text-align:left;
	font-size:0.65em;
	letter-spacing:0.15em;
	margin:30px 0 0 0;
}

.txt8{
	text-align:left;
	font-size:0.8em;
	letter-spacing:0.1em;
	line-height:1.2em;
	margin:20px 0 20px 0;
}

.line{
	width:100%;
	height:5px;
	border-bottom:1px solid #333;
}

.line_dot{
	width:100%;
	height:1px;
	border-bottom:1px dotted #333;
}

.btn_google{
	text-align:right;
	margin:15px 0 0 0;
}
.btn_google a {
	text-decoration: none;
	display: block;
}
.btn_google a:hover {
	text-decoration: none;
     filter:alpha(opacity=80);
     -moz-opacity:0.80;
     -khtml-opacity: 0.80;
     opacity:0.80;
}


}