@charset "utf-8";

*{
	margin:0px;
	padding:0px;
}

ul,li{
	list-style-type:none;
}

em, strong{
	text-decoration:none;
	font-style:normal;
	font-weight:normal;
}

img{
	border:none;
}

.clearFix:after{
	content:" ";
	display:block;
	height:0;
	clear:both;
}

body{
	padding:20px;
	min-width:320px;
	color:#606060;
	color:#333;
	font-family:"メイリオ", Meiryo, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Std W3",Osaka, "Trebuchet MS",Verdana,Arial,Helvetica, sans-serif;
	font-size:93%;
	line-height:1.66em;
	text-decoration:none;
	background:#f6f6f6;
	-webkit-text-size-adjust:none;
}

a, a:link, a:visited{
	text-decoration:none;
	color:#10a785;
	outline:none;
}

a:link:hover{
	color:#3ad3b5;
}

.dropShadow{
	box-shadow:0px 2px 2px rgba(0,0,0,0.3);
	-webkit-box-shadow:0px 2px 2px rgba(0,0,0,0.3);
	-moz-box-shadow:0px 2px 2px rgba(0,0,0,0.3);
}

#container{
	margin:0 auto;
	width:1000px;
	height:auto;
	border:none;
	background:#fff;
}

#head p{
	font-size:13px;
}

#base{
	margin:0 auto;
	width:100%;
	max-width:1000px;
	height:auto;
	background:#fff;
	border:1px #bfbfbf solid;
	-webkit-border-radius:12px;
	-moz-border-radius:12px;
	border-radius:12px;
}

main{
	position:relative;
	margin:0 auto;
	padding-bottom:16px;
	width:100%;
	background:#fff;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

#top main{
	background:#fff url("../images/jobTopBG.jpg") no-repeat right top;
	background-size:96% auto !important;
	-webkit-background-size:96% auto !important;
	-moz-background-size:96% auto !important;
}

#latestworks main{
	padding:0;
	min-height:600px;
	background:#fff url("./images/worksBG-sp.jpg") no-repeat 100px top fixed;
	background-size:100% auto !important;
	-webkit-background-size:100% auto !important;
	-moz-background-size:100% auto !important;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

#latestworks main #mainin{
	padding:12px 20px 20px;
	height:100%;
	min-height:600px;
	background:rgba(255,255,255,0.4);
	background:rgba(255,255,255,0.99);
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

#mainContents{
	margin:0 auto;
	padding:0 16px;
	width:100%;
	max-width:696px;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

#latestworks main #mainContents{
	margin:0 auto;
	padding:0 16px 0;
	width:100%;
	max-width:960px;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

#shv_logo{
	width:100%;
	height:41px;
	text-indent:-9999px;
	background:url("./images/shv_logo.gif") no-repeat 16px 0 !important;
}

#base>footer{
	position:relative;
	padding:12px 12px;
	font-size:10px;
	line-height:14px;
	color:#b5b2b5;
	text-align:center;
	background:#434642;
	-webkit-border-radius:0 0 12px 12px;
	-moz-border-radius:0 0 12px 12px;
	border-radius:0 0 12px 12px;
}

#floating-banner{
	display: none;
	width:44px;
	opacity:0;
}

#floating-banner.fixed{
	display: block;
	position:fixed;
	bottom:16px;
	right:16px;
	z-index:999999;
	display:table;
	padding-bottom:4px;
	width:44px;
	height:40px;
	color:#fff;
	text-align: center;
	vertical-align:middle;
	cursor:pointer;
	background:rgba(63,169,245,0.8);
	vertical-align:middle;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border-radius:4px;
	opacity:0.8;
}

#floating-banner i{
	display:table-cell;
	vertical-align:middle;
	width:44px;
	height:40px;
}

#nav-collapse,
.ovw768,
.ovw480
{
	display:none !important;
}

#base header.root .wrapper{
	margin:0 auto;
}

#mainLeft{
	position:relative;
	float:left;
	padding:344px 0 0;
	width:100%;
	background:transparent;
	z-index:96;
}

#works #mainLeft{
	width:60%;
}

#head{
	position:absolute;
	top:43px;
	left:0;
	z-index:96;
	width:100%;
}

.lower #mainContents #head h1{
	display:table;
	position:relative;
	margin:0 0 54px;
	width:100%;
	height:92px;
}

#mainRight{
	height:auto;
	position:absolute;
	right:44px;
	top:44px;
	width:360px;
	z-index:112;
}

#labo #mainRight{
	height:auto;
	position:absolute;
	right:44px;
	top:44px;
	width:360px;
	z-index:-1;
}

#works #mainContents #mainRight{
	right:0;
	width:50%;
	width:40%;
	height:569px;
}

#mainContents h1 em{
	display:block;
	position:absolute;
	left:0;
	top:50%;
	margin-top:-24px;
	padding-left:16px;
	width:100%;
	font-weight:bold;
	font-size:20px;
	color:#000;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

#latestworks #mainContents h2{
	color:#333;
}

#mainContents h1 i{
	display:table-cell;
	margin:0;
	height:100%;
	text-indent:-16px;
	font-style:normal;
	font-family:'Julius Sans One';
	font-family:'Poiret One', sans-serif;
	font-size:14vw;
	vertical-align:middle;
	color:#ccc;
	opacity:0.4;
}

#mainContents h2{
	margin-bottom:4px;
	font-size:14px;
	line-height:22px;
	font-weight:bold;
	color:#008bd5;
}

#mainContents p{
	margin:0 0 24px;
	width:100%;
}

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

@media only screen and (max-width:767px){
		
	#head{
		top:4px;
	}

	#mainLeft{
		width: 100%;
	}
	
	

	#labo #mainLeft{
		width:100%;
	}

	#mainContents h1{
		margin:0 0 0px;
	}

}

@media only screen and (max-width:479px){
	
	.lower #mainLeft{
		width:100% !important;
		position:relative;
		z-index:102;
		float:none;
		padding:0;
		width:100%;
		background:transparent;
	}

	#mail{
		overflow:hidden;
	}

	#head{
		position:static;
		margin-bottom: 20px;
	}

	#mainLeft h1{
		margin:0 0 24px;
	}

	#top #mainContents h2{
		margin:0 0 8px;
		padding-top:4px;
		font-size:18px;
		line-height:22px;
		font-weight:bold;
		color:#008bd5;
		color:#000;
	}

	#latestworks main{
		background:#fff url("./images/worksBG-sp.jpg") no-repeat 40px 70px fixed;
		background-size:120% auto !important;
		-webkit-background-size:120% auto !important;
		-moz-background-size:120% auto !important;
	}

	#latestworks main #mainin{
		padding:12px 8px;
	}

	#mainContents{
		padding:0 8px;
	}

	#latestworks main #mainContents{
		padding:0;
	}

}