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

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

#header-in {	
	width: 100%;
}

#logo {
	float:none;
	margin: 20px auto;
}


#main {
	width: 100%;
}

/*ワーク*/

#content {
	max-width: 100%;
	margin: 0 auto;
	overflow: hidden;
}



#profile {
	width: 100%;
	height:auto;
}

#profile img{
	clear:both;
}


.p-box {
	clear:both;
	margin: 5px 10px 15px 10px;

}


#p-type {
	width: 100%;
}

#footer-in {
	width: 100%;
}
	
	
#main-nav nav {
		width: 100%;
}

#main-nav nav ul {
		float: none;
		width: 100%;
		border-left: none;
		border-right: none;
		position:static;
}

#main-nav nav ul li {
		float: left;
		width: 50%;
		*width: 49.9%;
}

#main-nav nav ul li a {
		display: block;
		padding: 10px 0 10px;
		text-align: center;
		border-left: dotted 1px #999;
		border-bottom: dotted 1px #999;
}


#content {
	max-width: 600px;
	border: dotted 1px #999;
	margin: 0 auto;
	overflow: hidden;
}


#work {
	width:100%;
	margin: 0 auto;
	overflow:hidden;
	float:left;
}



.caption {
	display:block;
	width: 280px;
	float: left;
	margin: 0px 14px 10px;
	background:url(../img/bg2.png) repeat;
	border:solid 1px #000;
	padding: 0 0 4px 0;
}

.caption p{
	letter-spacing:0.5px; /*文字の間隔*/
	line-height: 1;
	margin: 9px 4px 3px 4px;
}


.hover_shine {
    width: 280px;
	height: 160px;
	overflow:hidden;
	background:url(../img/link.png) no-repeat;
    position: absolute;
    background-position: 130px 40px; 
    left:0px; top:0px;
	opacity:0;
    -webkit-transition: background-position .2s ease;
    -moz-transition: background-position .2s ease;
    -o-transition: background-position .2s ease;
    transition: background-position .2s ease;	
}

.hover_shine:hover{
	opacity:1;
    /*Final position*/
    background-position: 130px 75px;
	background-color:rgba(0,0,0,0.4);
}


/*コンタクト*/

#contact {
	width: 100%;
	clear: both;
	margin: 0 auto;
	overflow: hidden;
	*zoom: 1;
}


input {
	width: 100%;
	max-width: 260px;
	box-sizing: border-box; /*飛び出し回避*/
}

textarea {
	font-size:medium;
	width: 100%;
	max-width: 260px;
	height: 200px;
	max-height: 300px;
	box-sizing: border-box; /*飛び出し回避*/
}


input, textarea {
	border: dotted 2px #aaaaaa;
	border-radius: 0;
	background-color:#999;
	-webkit-appearance: none;
}

input[type="submit"] {
	border: gloob 2px #036;
	max-width: 120px;
	color: #FFF;
	background: #09C;
	padding: 10px 0 30px 0;
}

input[type="submit"]:hover{
	background-color:#3CF;
	color:#FFF;
}


.mailform {
	clear:both;
	width:100%;
	float:left;
	margin: 13px 0;
	padding: 5px 5px 20px 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	background:url(../img/bg2.png) repeat;
	color:#FFF;
}


.mailform p{
	display:block;
	margin: 7px 0 0 0;
}



/*コンタクトend*/


}