/* CSS Document */


html{
font-size:62.5%;
}

body{
font-size:1.4rem;
line-height:1.6em;
margin: 0;
padding: 0;
text-align:center;
font-family:'Yu Gothic',"Meiryo", "メイリオ", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, verdana, sans-serif;
color:#333;
}


img,a{
vertical-align:top;
border:none;
box-sizing:border-box;
outline:none;
}

*{
margin:0;
padding:0;
box-sizing:border-box;
}


p,li,dt,dd,th,td,pre{
-ms-line-break:strict;
line-break:strict;
-ms-word-break:break-strict;
word-break:break-strict;
}


h1,h2,h3,h4,h5,h6{
font-size:1em;
}



a{
color:#006633;
}
a:hover{
color:#336699;
}

ul{
list-style:none;
}

.cf{
zoom:1;
}

.cf:after{
clear:both;
display:block;
visibility:hidden;
content:"";
height:0;
}


.mb10{
margin-bottom:10px;
}


.mb20{
margin-bottom:20px;
}


.mb30{
margin-bottom:30px;
}


.center{
text-align:center;
}


header {
	text-align:center;
	width:100%;
display:block;
position:fixed;
top:0;
border-top:4px solid #009933;
background:#FFF;
z-index:200;
-webkit-box-shadow:0 6px 6px -4px rgba(000,000,000,0.5);
   -moz-box-shadow:0 6px 6px -4px rgba(000,000,000,0.5);
        box-shadow:0 6px 6px -4px rgba(000,000,000,0.5); 
}

header .cf{
	width:1000px;
	margin:0 auto ;
}

#logo{	
text-align:left;
width:300px;
height:60px;
float:left;
}

#logo a{
	display:block;
	height:60px;
}


header #translate{
	float:right;
	text-align:right;
width:20%;
padding-top:15px;
}


header nav {
display:block;
text-align: center;
}

header nav ul {
list-style-type: none;
width:500px;
float:right;
}

header nav ul li{
	display:table-cell;
	
}
header nav ul li#li_home{
	display:none;
}


header nav ul a {
	display:block;
color: #666666;
text-decoration:none;
height:60px;
width:100px;
padding:1.4em 0 0;
}
header nav ul a:hover {
color: #666666;
background:#EEE;
transition: all 0.4s ease 0s;
}

section, article{
display: block;
float: left;
width: 100%;
}

article {
width: 96%;
padding: 3em 2%;
}


.slider{
	margin-top:60px;
}
.slider .slides{
	background:#000;
}

.slider .slides li{
	height:340px;
	-webkit-box-shadow:0 -6px 6px -4px rgba(000,000,000,0.4) inset;
   -moz-box-shadow:0 -6px 6px -4px rgba(000,000,000,0.4) inset;
        box-shadow:0 -6px 6px -4px rgba(000,000,000,0.4) inset; 
		background-repeat:repeat;
	background-position:center center;
	-moz-background-size:100% auto ;
background-size:100% auto ; 
}



.flex-control-nav{
	visibility:hidden;
	display:none;
}



#container{
margin:0 auto;
}


.contents{
	width:1000px;
margin:0 auto 20px;
display:block;
text-align:left;
padding:20px .3em 0;
}
#title{
	position:relative;
	background-image:url(../images/bg_dot.png),url(../images/orange2.gif);
	background-repeat:repeat, no-repeat;
	background-position:center center;
	-moz-background-size:auto,100% auto; 
background-size:auto,100% auto; 
	color:#FFF;
	text-align:center;
font-size: 2.8rem;
text-align:left;
padding:1.4em 0;
-webkit-box-shadow:0 -6px 6px -4px rgba(000,000,000,0.4) inset;
   -moz-box-shadow:0 -6px 6px -4px rgba(000,000,000,0.4) inset;
        box-shadow:0 -6px 6px -4px rgba(000,000,000,0.4) inset; 

margin:60px 0 1em;
}


#title span{
	display:block;
	margin:0 auto;
	width:1000px;
	letter-spacing:.2em;
	
	
}


.contents h2{
	border-bottom:1px solid #E8E8E8;
letter-spacing:0.1em;
padding:0 .3em 1em;
margin-bottom:1em;
font-size:3rem;
line-height:1.4em;
font-weight:normal;
	}
	
.contents h3,.contents h4{
	border-bottom:1px solid #E8E8E8;
letter-spacing:0.1em;
padding:0 .3em .6em;
margin-bottom:.6em;
font-size:2.4rem;
line-height:1.4em;
font-weight:normal;
	}


.imgR{
	float:right;
}

footer{
display:block;
padding:20px;
background:#E8E8E8;
text-align:center;
font-size:1.2rem;
letter-spacing:.2em;
font-family: Arial,Helvetica,sans-serif;
color:#666;
font-weight:bold;
}
/*top---------------------------------------------------------------*/

#topContents{
	width:1000px;
	margin:0 auto;
text-align:left;
padding-bottom:20px;

}

#topLeft{
float:left;
width:38%;
}

#topRight{
float:right;
width:58%;
}

#topLeft h2,#topRight h2{

border-bottom:1px solid #E8E8E8;
letter-spacing:0.1em;
padding:.3em;

margin-bottom:14px;
font-size:3rem;
font-weight:normal;
}

#topLeft #news{
margin:.3em;
}

#topLeft #news dt{
color:#9C9;
font-size:1.2rem;
line-height:1.4em;
font-weight:bold;
margin-bottom:.5em;
}
#topLeft #news dd{
	color:#666;
font-size:1.4rem;
line-height:1.6em;
margin-bottom:1em;
padding-bottom:1em;
border-bottom:1px solid #E8E8E8;
}



#topRight #info{
margin:.3em;
}


#topRight #info li img{
	margin:0 auto 1em;
}
#topRight #info li{
	text-align:center;
	padding:1em;
display: table-cell;
width:50%;
border:1em solid #FFFFFF;
background:#EEE;
}

#topRight #info h3{
	text-align:left;
margin-bottom:.4em;
font-size:2rem;
color:#003300;
line-height:1.4em;
letter-spacing:.1em;
font-weight:normal;
}

#topRight #info p{
color:#666;
text-align:left;

font-size:1.4rem;
line-height:1.6em;
}

/*access---------------------------------------------------------------*/


.access ol{
margin:0 0 3em 2em;
}



.boxR #mapimg{
	text-align:right;
	width:98%;
}
/*about---------------------------------------------------------------*/
.about table{
margin-bottom:4em;
border-collapse:collapse;
border-spacing:0;
font-size:1.4rem;
line-height:1.4em;
text-align:left;
}

.about th{
color:#009933;
letter-spacing:.1em;
vertical-align:top;
border-right:2px solid #009933;
padding:10px 20px 10px 0;
white-space:nowrap;
}

.about td{
vertical-align:top;
padding:10px;
}

.about .bg{
background:url(../images/img_maru.gif) no-repeat right top;
min-height:218px;
}

#p_shimizu{
float:right;
margin:0 .4em 1em 1em;
}


.about p{
margin-bottom:4em;
}

/*works---------------------------------------------------------------*/


.works ul{
/*margin:0 auto 20px;*/
}

.works li{
float:left;
height:180px;
width:25%;
text-align:center;

}
.works  li a{
display:block;
text-decoration:none;
text-align:center;
box-sizing:border-box;
}

.works  li img{
width:200px;
border:4px solid #CCCCCC;
margin-bottom:2px;
box-sizing:border-box;
}
.works li p{
/*width:200px;*/
text-align:center;
font-size:1.0rem;
box-sizing:border-box;
}


/*service---------------------------------------------------------------*/


.boxW{

}
.boxR{
float:right;
width:48%;
}

.boxL{
float:left;
width:48%;
}

.boxW p,.boxL p,.boxR p{
padding:0 0 3em; 
}

.boxW .imgR{
	float:right;
padding:0 20px 10px 10px; 
}

.imgSite{
}

.imgSemi{
}



/*privacy---------------------------------------------------------------*/



.privacy ol{
margin-left:4em;
}

.privacy p{
margin-bottom:3em;
}

.privacy p.mb0{
margin-bottom:0;
}

.privacy ol{
margin-bottom:4em;
}

/*---------------------------------------------------------------------------------------------------------------------
min-width:601px max-width:999px( PC可変 )
------------------------------------------------------------------------------------------------------------------------*/


@media screen and (min-width: 601px) and (max-width: 999px) {
* { -webkit-text-size-adjust: none; }

body{
font-size: 1.4rem;
}

#logo{
width:20%;
}

#logo img{
display:none;
}
header{
		background:#FFF url(../images/logo2.gif) no-repeat;
}

#topContents,header,header .cf{
width:100%;
margin:0 auto;
}

#title{
font-size: 2.4rem;
padding:1.4em 0;
}

#title span{
width:100%;
padding:0 .3em;
}

.contents{
	width:100%;
}

.contents h2{
	padding:0 .3em .6em;
margin-bottom:.6em;
font-size:2.6rem;
line-height:1.4em;
	}
	
.contents h3,.contents h4{
padding:0 .2em .6em;
margin-bottom:.6em;
font-size:2.2rem;
line-height:1.4em;

	}

.imgR{
	float:right;
}

/*top---------------------------------------------------------------*/


.slider .slides li{
	height:280px;
}



#topRight #info img{
float:left;
width:80px;
padding-right:4px;
}

#topRight #info li{
	display:block;
	width:100%;
	box-sizing:border-box;
}

#topRight #info h3{
margin-bottom:.3em;
font-size:1.6rem;
}


/*access---------------------------------------------------------------*/
.boxR #mapimg{

}


/*about---------------------------------------------------------------*/
.about table{
margin:0 20px 30px;
border-collapse:collapse;
border-spacing:0;
font-size:1.4rem;
line-height:1.4em;
text-align:left;
}

.about th{
color:#009933;
letter-spacing:.1em;
vertical-align:top;
border-right:2px solid #009933;
padding:10px 20px 10px 0;
white-space:nowrap;
}

.about td{
vertical-align:top;
padding:10px;
}

.about .bg{
	margin-right:10px;
	background-size:30% auto;
-webkit-background-size:30% auto;
-moz-background-size:30% auto;
}




#p_shimizu{
width:30%;
}


.about p{
padding:0 20px 10px;
}

/*works---------------------------------------------------------------*/


.works ul{
margin:0 auto 20px;
}

.works li{
height:auto;
margin-bottom:10px;
width:25%;
text-align:center;
}

.works li img{
width:90%;
margin:0 auto 2px;
}

.works li p{
width:auto;
text-align:center;
font-size:1.0rem;
}

/*service---------------------------------------------------------------*/


.boxW p,.boxL p,.boxR p{
padding:0 14px 10px; 
}



.boxW .imgR{
	float:right;
padding:0 14px 10px 10px; 
}

.boxW .imgSite{
	width:42.7%;
}

.boxW .imgSemi{
	width:29%;
}



/*privacy---------------------------------------------------------------*/

.privacy ol{
margin-left:2em;
}

.privacy p{
margin-bottom:3em;
}

.privacy p.mb0{
margin-bottom:0;
}

.privacy ol{
margin-bottom:3em;
}






}

@media screen and (min-width: 601px) and (max-width: 700px) {
header{
		background:#FFF url(../images/logo3.gif) no-repeat;
}

#logo{
width:80px;
}


header nav ul {
width:auto;
float:right;
}

header nav ul li{
	display:table-cell;
	
}
header nav ul li#li_home{
	display:none;
}


header nav ul a {
	display:block;
color: #666666;
text-decoration:none;
height:60px;
width:auto;
padding:1.4em 6px 0;
}



}



/*---------------------------------------------------------------------------------------------------------------------
0px 〜  480px（メニュー切り替わり）
------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 0px) and (max-width: 600px) {
* { -webkit-text-size-adjust: none; }
#logo{
	display:none;
}

body{
font-size: 1.4rem;
}

#container{
width:100%;
padding-top:1px;
}

#title{
font-size: 2.0rem;
padding:1.2em 0;
margin-top:50px;
}

#title span{
width:100%;
padding:0 .3em;
}

.contents{
	width:100%;
}
.contents h2{
	padding:0 .3em .6em;
margin-bottom:.6em;
font-size:2.3rem;
line-height:1.4em;
	}
	
.contents h3,.contents h4{
padding:0 .3em .4em;
margin-bottom:.4em;
font-size:2.0rem;
line-height:1.4em;

	}


.imgR{
	float:none;
}


/*top---------------------------------------------------------------*/

#topContents{
	width:100%;
}
.slider{
	margin-top:42px;
}

.slider .slides li{
	height:140px;
}

#topContents{
padding-bottom:14px;

}

#topLeft{
float:none;
margin-bottom:10px;
width:100%;
}

#topRight{
float:none;
margin-bottom:10px;
width:100%;
}

#topLeft h2,#topRight h2{
padding:.2em;
color:#006633;
margin-bottom:10px;

}



#topRight #info img{
float:left;
width:50px;
padding-right:4px;
}
#topRight #info li{
	display:block;
	width:100%;
	box-sizing:border-box;
	border-left:.3em solid #FFFFFF;
	border-right:.3em solid #FFFFFF;
}



#topRight #info h3{
margin-bottom:.3em;
font-size:1.4rem;
}



/*access---------------------------------------------------------------*/
.boxR #mapimg{
float:none;
width:100%;
margin-top:2em;
}

/*about---------------------------------------------------------------*/
.about table{
margin:0 10px 10px;
font-size:1.2rem;
}

.about th{
color:#009933;
letter-spacing:0;
vertical-align:top;
border-right:2px solid #009933;
padding:4px 10px 4px 0;
}

.about td{
vertical-align:top;
padding:4px 10px;
}

.about .bg{
background:none;
min-height:none;
}

#shimizuBox{
	text-align:center;
}


#p_shimizu{
float:none;
margin:0 auto;
}


.about p{
padding:0 10px 10px;
text-align:left;
}

/*works---------------------------------------------------------------*/


.works ul{
margin:0 auto 10px;
}

.works li{
	text-align:center;
float:none;
height:auto;
width:100%;

}


.works  li img{
	margin:0 auto 2px;
	width:80%;

}
.works li p{
width:100%;
text-align:center;
font-size:1.0rem;
height:3em;
}


/*service---------------------------------------------------------------*/



.boxR,.boxL{
float:none;
width:100%;
}

.boxW p,.boxL p,.boxR p{
padding:0 10px 10px; 
}


.boxW .imgR{
	float:none;
padding:0 10px 10px; 
}

.boxW .imgSite{
	width:94%;
}

.boxW .imgSemi{
	width:94%;
}





/*privacy---------------------------------------------------------------*/

.privacy ol{
margin-left:2em;
}

.privacy p{
margin-bottom:3em;
}

.privacy p.mb0{
margin-bottom:0;
}

.privacy ol{
margin-bottom:3em;
}



}