@charset "utf-8";
/* CSS Document */

#system #layout{/*システム予約*/
/width:998px;
}
#system h2{/*システム予約*/
}

#system h3{
}

#system p{
}
#system #layout img{
display:block;
margin:auto;
/*
margin-bottom:20px;
*/
max-width:100%;
}
#system #layout a img{
max-width:100%;
width:auto;
}

#system #layout dl {
float:left;
width:447px;
/*/width:465px;*/
/*margin:5px;*/
margin-left:10px;
margin-right:10px;
padding:0 10px;
/*
border:1px solid #cccccc;
*/

border:none;
}

#system #layout dl.finaldl {
width:946px;
/*/width:968px;*/
float:left;
border:none;

margin-bottom:20px;
}
#system #layout dl.finaldl:after {
content: ".";
display: block;
visibility: hidden;
height: 0.1px;
font-size: 0.1em;
line-height: 0;
clear: both;
} 
#system #container #layout dl dt{
text-align:left;
font-size:14px;
font-weight:bold;
margin-bottom:0px;
padding-bottom:2px;
border:1px solid #cccccc;
border-bottom:none;
color:#ffffff;

/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#cccccc+0,aaaaaa+100 */
background: #64646e; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
padding:5px 10px;
}
#system #layout dl dd{
overflow:hidden;
border:1px solid #64646e;
}
#system #layout dl.finaldl dd{
}
#system #layout dl p{
font-size:14px;
line-height:1.7;
padding:10px;
text-align:left;
}
#system #layout dl p.first{
}
#system #layout dl p.second{
}
#system #layout dl p.third{
}

#system #layout dl dd table.twocell{
width:100%;
}
#system #layout dl dd table.twocell th{
font-size:14px;
vertical-align:top;
font-weight:normal;
text-align:left;
padding:10px;
width:40%;
color:#ffffff;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#cccccc+0,aaaaaa+100 */
background: #64646e; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	border:1px solid #64646e;
}
#system #layout dl dd table.twocell td{
font-size:14px;
padding:10px;
line-height:1.3;
	border:1px solid #64646e;
	background-color:rgba(255,255,255,.5);
}


#system #layout dl table.fourcell{
width:100%;
}
#system #layout dl table.fourcell th{
font-size:14px;
vertical-align:top;
font-weight:normal;
text-align:left;
padding:10px;
width:25%;
text-align:center;
}
#system #layout dl table.fourcell td{
width:25%;
font-size:14px;
padding:10px;
line-height:1.3;
	border:1px solid #64646e;
	background-color:rgba(255,255,255,.5);
}
/*
#system #layout dl:nth-of-type(8) dd table td{
color:#555555;
	background-color:#ffffff;
	background-image: -moz-linear-gradient(#ffffff, #f1f1f1); 
	background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f1f1f1));	
	background-image: -webkit-linear-gradient(#ffffff, #f1f1f1);	
	background-image: -o-linear-gradient(#ffffff, #f1f1f1);
	background-image: -ms-linear-gradient(#ffffff, #f1f1f1);
}
*/

#system #layout dl table.fourcell tr:first-child {
}

#system #layout dl table.fourcell th:nth-child(3),
#system #layout dl table.fourcell td:nth-child(3){
/*
	color:#ffffff;
background: linear-gradient(135deg,  rgba(204,204,204,1) 0%,rgba(170,170,170,1) 100%);
*/
	background-color:rgba(255,255,255,.5);
	border:1px solid #64646e;
}

#system #layout dl table.fourcell th:first-child {
		text-align:left;
color:#ffffff;
background: #64646e;
	border:1px solid #64646e;
}
@media screen and (max-width: 667px) {
#system #layout dl {
    float: none;
    width: auto;
    padding: 0;
    margin: 0 5px;
}
#system #layout dl.finaldl {
    float: none;
    width: auto;
}
#system #layout dl dd table.twocell th{
width:45%;

}
