@charset "UTF-8";

/* DETAIL */

#detail {
	width: 96%;
	padding: 4% 2%;
	text-align: center;
	overflow: hidden;
}

#detail a {
	color: #FFF;
	text-decoration: underline;

}

#detail .main {
	text-align: center;
	vertical-align: middle;
	width: 63%;
	padding: 8px 5px 5px;
	float: left;
	display: table-cell;
}
#detail .main.luster {
	background:#777;
}

#detail .main img#MainPhoto{
	width: 98%;
	height:auto;
	max-width: 98%;
	max-height: 98%;
	vertical-align: bottom;
display:block;
margin-left:6px;
}

@media screen and (max-width: 800px) {
#detail .main img#MainPhoto{
margin-left:3px;
}
}

#detail .text {
	width: 32%;
	padding: 1% 1% 1% 0;
	color: #FFF;
	line-height: 160%;
	text-align: left;
	float: right;
}

#detail .text h1 {
	font-size: 124%;
}

#detail .text .pdf {

}

#detail .text dl {
 width: 100%;
	clear: both;
	padding: 0px 0px 10px 0px;
}

#detail .text dt,
#detail .text dd {
	float: left;
}
#detail .text dt {
	width: 25%;
}
#detail .text dd {
	width: 73%;
}		  
.thumbnail p{
	text-align:center;
}
.thumbnail ul{
	padding:0 0 0 1%;
	margin:0;
	list-style:none;
	/*border:solid 2px #00f;*/
	}
.thumbnail ul li{
	float:left;
	margin-right:1%;
	width:32.3%;
	list-style:none;
	/*border:solid 1px #0f0;*/
}
/* The Magnificent Clearfix: nicolasgallagher.com/micro-clearfix-hack/ */
.thumbnail ul li:before, .clearfix:after { content: ""; display: table; }
.thumbnail ul li:after { clear: both; }
.thumbnail ul li { zoom: 1; }


.thumbnail ul li img{
	width:100%;
}
.mr00{ margin-right:0px!important}
.f80{ font-size:80%;}

@media screen and (max-width: 1024px) {


#detail {
	width: 96%;
	padding: 4% 2%;
	text-align: center;
	overflow: hidden;
}

#detail .main {
	margin: 0 auto;
	padding: 1%;
	text-align: center;
	float: none;
	}


#detail .text {
	width: 100%;
	margin: 0 auto;	
	padding: 1% 2%;	
	color: #FFF;
	text-align: left;
	float: none;	
}

#detail .text h1 {
	padding: 1em 0;
	font-size: 124%;
}

#detail .text dl {
width: 96%;
clear: both;
}

#detail .text dt,
#detail .text dd {
	float:none;
	width: 100%;
}
.thumbnail p{
	text-align:center;
}


}


#detail #movie {
text-align: center;
width: 98%;
height: auto;
max-width: 98%;
max-height: 98%;
position:relative;
display:none;
}
#detail #movie::before {
display:block;
content:'';
width:100%;height:0;
padding-top:56.25%; /* ※1)ココがアスペクト比（縦横比）*/
}
#detail #movie video {
display:block;
width:100%;
height:100%;
object-fit:cover;
position:absolute;top:0;left:8px;right:0;bottom:0;
box-sizing: border-box;
}
#detail .digi_print a,
#detail .digi_proposal a,
#detail .digi_contact a{
padding: 10px;
color: #333;
width: 10em;
display: block;
text-align: center;
text-decoration: none;
border: solid #333 1px;
border-radius: 2em;
margin: auto;
}
#detail .digi_print a:hover,
#detail .digi_proposal a:hover,
#detail .digi_contact a:hover{
background-color: #eee;
}