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

body{
	background-image:url(../img/works/works_top.png);
	background-repeat:repeat-x;
}
header{
	background-color:#11b600;
}

/*上書き*/
#main_contents img{
	max-width:95%;
}
#left_contents {
 
}
#left_contents .h1_p{
	
}

article{
	padding: 0 0 0 6em;
}
.works{
padding:0 2em;	
}
.works h1{
    border-bottom: 0.3em solid #EEEEEE;
    font-family: 'Comfortaa',cursive;
    font-size: 2em;
    margin-bottom: 1em;
    padding-bottom:0.2em;
}
.works h1 span{
	font-size:0.4em;
    margin-left:1em;
}
.works ul li{
	display: inline-block;
	margin-bottom: 6em;
	margin-right:2em;
}
figure {
    margin: 0;
    padding: 0;
}
figcaption{
	text-align:center;
	font-size:0.7em;
}

/*worksの上段のpとメニューは他のページとは違う構造です。*/
#works_top{
  padding-bottom: 2em;  
}

#works_top .works_top_left p{
	margin-bottom:1em;
}
#works_top .works_nav{
	float:right;
	width:25%;
	padding-right:2em;
}

.works_nav nav ul{
	padding-top:6.8em;
	font-family: 'Comfortaa',cursive;
	font-weight:300;
}
.works_nav nav ul li{
	font-size:1.5em;
	margin-bottom:0.5em;
	text-shadow: 0 0.01em 0.1em #8B4513;
}
.works_nav nav ul li a{
	text-decoration:none;
	display:block;
}

.works ul a{
	-webkit-transition: all 1s ease-out;
    -moz-transition: all 1s ease-out;
    -o-transition: all 1s ease-out;
    transition: all 1s ease-out;
}
.works ul a:hover{
	opacity:0.5;
	/*ふわっとホバー*/
-webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

@media screen and (min-width:1000px) {
#works_top .works_top_left{
	float:left;
	width:65%;
	padding-left:2em;
	text-align:justify;
}
.works_nav nav{
	margin-bottom:2em;
	background-image:url(../img/service/menu.png);
	background-repeat:no-repeat;
	background-size: 101% auto;
	height:435px;
	text-align: center;
	
}
}
@media screen and (max-width:999px) {
	#works_top{
		padding:0 2em;
		padding-bottom:2em;
	}
	.works_nav nav{
		display:none;
	}
}