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

bodh{
	font-family:YuGothic,"游ゴシック","ヒラギノ角ゴ Pro W3","HiraKakuPro-W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;
	font-size:16px;
}

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
 
* html body {     
  background: url(null) fixed;     
}  

header{
	width:100%;
	background:#fff;
 	padding:30px 0;
	border-top:5px solid #000;
}

.contents{
	background:#f0f0f0;
	margin-bottom:10px;
	padding:30px 0 20px;
}

/* title */

h1{
	max-width:50%;
	height:auto;
}


/* nav */

.menu li a{
	display:block;
	color:#000;
	font-size:1.3125em;
	padding:10px 15px;
}

.menu li#about a:hover{
	color:#46b518;
}

.menu li#works a:hover{
	color:#1372b7;
}

.menu li#blog a:hover{
	color:#dd5900;
}

.menu li{
	float:left;
	width:auto;
	font-family: 'Anton', sans-serif;
}

.menu ul:after{
	content:"";
	display:block;
	clear:both;
}

/* contents */

.img{
	text-align:center;
	padding-top:30px;
}

.img img{
	max-width:100%;
	height:auto;
}

.txt h2{
	display:inline-block;
	font-size:2em;
	font-weight:600;
	margin:0 0 20px 0; 
}

.txt a{
	padding-right:35px;
	background-image:url(../../../images/windowtab.gif);
	background-repeat:no-repeat;
	background-position:right center;
	display:inline-block;
}

.txt a:hover{
	opacity:0.7;
	transition: all 1000ms cubic-bezier(0.19, 1, 0.22, 1) 0s;
}

.txt p{
	font-size:1.35em;
	text-align:1.5em;
	margin-bottom:40px;
}

.txt strong{
	font-weight:bold;
	padding-right:0.5em;
}

.txt{
	padding-top:20px;
}

.suv img{
	max-width:100%;
	height:auto;
}

.suv li{
	padding:0 10px 20px;
}

.suv a{
	display:inline-block;
	margin-left:10px;
	padding:0 20px;
	background-image:url(../../../images/back.gif);
	background-repeat:no-repeat;
	background-position:left center;
	background-size:contain;
	font-size:1.2em;
}

.suv a:hover{
	opacity:0.7;
	transition: all 1000ms cubic-bezier(0.19, 1, 0.22, 1) 0s;
}



/* footer */

footer{
	width:100%;
	border-bottom:5px solid #000;
}

footer p{
	padding:0 0 30px;
	text-align:center;
	font-size:1em;
}



/* ###### 599px以下 ###### */
@media (max-width:599px){
	
header{
	padding:15px 0 0 0;
}

header:after{
	content:"";
	display:block;
	clear:both;
}

.title{
	float:none;
	width:100%;
}

.gnav{
	float:none;
	width:100%;
}

h1{
	margin:0 auto;
	text-align:center;
}

h1 img{
	max-width:100%;
}

.menu li{
	width:33.3%;
	text-align:center;
	font-size:1em;
}

.img img{
	width:80%;
	text-align:center;
}

.img{
	padding-top:10px;
}

.txt{
	padding-left:5%;
	padding-right:5%;
}

.txt h2{
	font-size:1.5em;
}

.txt p{
	font-size:1em;
}

.contents{
	margin-bottom:10px;
}

.suv li{
	padding:0 10px 10px;
}


}

/* ###### 600px以上～767px以下 ###### */
@media (min-width:600px) and (max-width:767px){

header{
	padding:15px 0;
}

header:after{
	content:"";
	display:block;
	clear:both;
}

.title{
	float:left;
	width:auto;
}

.gnav{
	float:right;
	width:auto;
}

h1 img{
	padding-left:15px;
}

.img img{
	width:80%;
	text-align:center;
}

.txt{
	padding-left:5%;
	padding-right:5%;
}

.txt h2{
	font-size:1.5em;
}

.txt p{
	font-size:1em;
}


}

/* ###### 768px以上 ###### */
@media (min-width:768px){



header:after{
	content:"";
	display:block;
	clear:both;
}

.title{
	float:left;
	width:auto;
}

.gnav{
	float:right;
	width:auto;
}

h1{
	padding-left:20px;
}

header{
	vertical-align:central;
}

.txt{
	padding-left:5%;
	padding-right:5%;
}

}

/* ###### 960px以上 ###### */
@media (min-width:960px){
	
.header_inner,.suv,.contents_inner,footer p{
	width:960px;
	margin:0 auto;
}



}