@charset "utf-8";



 /* ==============================================
★headbar
 ==============================================*/

#headbar{

	width: 100%;
	min-width: 960px;
	padding:62px 0 44px;
	margin: 0 auto;
	background:url(../../img/bg02.jpg) center repeat;
}
#headbar .con{
	width: 100%;
	height: 154px;
	background:url(../../img/project/headbar.jpg) center no-repeat;
	margin: 0 auto;
	text-align: center;
}
#headbar .con h2{
	padding:120px 0 0;
	font-size: 14px;
	color: #FFF;
}
#headbar .con .bgsp{
	display: none;
}
@media(max-width:480px){
	#headbar{
	width: 100%;
	min-width: auto;
	padding:0;
	margin: 0 auto;
	background:none;
}
#headbar .con{
	width: 100%;
	height: auto;
	background:none;
	margin: 0 auto;
	text-align: center;
	position: relative;
}
#headbar .con h2{
	position: absolute;
	top:70%;
	left: 0;
	width: 100%;
	text-align: center;
	padding:00 0;
	font-size: 14px;
	color: #FFF;
}
	#headbar .con .bgsp{
	display: block;
		width:100%;
}
}
 /* ==============================================
★breadcrumb
 ==============================================*/

#breadcrumb{
	width: 960px;
	margin:0 auto 20px;
	padding:10px 0 0;
	text-align:left;
	font-size:12px;
	line-height:1;
	color:#000;
}
#breadcrumb a{
	color:#000;
}


@media (max-width:480px){

	#breadcrumb{
		width: 95%;
	margin:0 auto 15px;
		font-size:12px;
	}
}
 /* ==============================================
★about
 ==============================================*/
.about{
	width: 100%;
	margin:0 auto;
	text-align:left;
	font-size:14px;
	color:#000;
	background:url(../../img/project/bg01.gif) repeat;
}
.about .con{
	width: 100%;
	min-width: 960px;
	height: 592px;
	padding:0 0 0;
	margin:0 auto;
	background:url(../../img/project/aboutbg.gif)  top center no-repeat;
	position: relative;
}
.about .con h3{
	position: absolute;
	top:108px;
	left:50%;
	width: 900px;
	margin: 0 0 0 -450px;
	font-size: 24px;
	line-height: 1;
	color: #009944;
	text-align: center;
}
.about .con p{
	font-size: 18px;
	color: #FFF;
	line-height: 2;
	width: 512px;
	text-align: center;
	color: #009944;
	position: absolute;
	top:272px;
	left:50%;
	margin: 0 0 0 -256px;
}
.about .con p br.sp{
display: none;
}

@media (max-width:480px){

.about {
width: 100%;
	margin:0 auto;
	text-align:left;
	color:#000;
	background:url(../../img/project/aboutspbg.gif) top center no-repeat;
	background-size: 500px 329px;
}

.about  .con{
	width: 300px;
	min-width: auto;
	height: 270px;
	padding:0 0 0;
	margin:0 auto;
	background:none;
}
.about  .con h3{
	position:static;
width: 100%;
	margin: 20px auto 0;
	font-size: 14px;
	line-height: 1;
	color: #009944;
	text-align: center;
}
.about  .con p{
	font-size: 10px;
	line-height: 1.7;
	width: 240px;
	position: absolute;
	top:80px;
	left:50%;
	margin: 0 0 0 -120px;
}
.about .con p br.pc{
display: none;
}
.about .con p br.sp{
display: block;
}

}
/* ==============================================
★about2
 ==============================================*/
.about2{
	width: 100%;
	margin:0 auto;
	text-align:left;
	font-size:14px;
	color:#000;
	background:url(../../img/bg02.jpg) repeat;
}
.about2 .con{
	width: 100%;
	min-width: 960px;
	height: 615px;
	padding:0 0 0;
	margin:0 auto;
	background:url(../../img/project/about2bg.jpg)  top center no-repeat;
	position: relative;
}
.about2 .aboutline{
	width: 100%;
	min-width: 960px;
	height: 4px;
	padding:0 0 0;
	margin:0 auto;
	background:url(../../img/project/line.jpg)  top center no-repeat;
	position: relative;
}
.about2 .con h3{
	position: absolute;
	top:108px;
	left:50%;
	width: 900px;
	margin: 0 0 0 -450px;
	font-size: 24px;
	line-height: 1;
	color: #fff;
	text-align: center;
}
.about2 .con p.p01{
	font-size: 20px;
	width: 275px;
	color: #009944;
	position: absolute;
	text-align: center;
	top:330px;
	left:50%;
	margin: 0 0 0 -375px;
}
.about2 .con p.p02{
	font-size: 16px;
	color: #FFF;
	width: 450px;
	position: absolute;
	top:220px;
	left:50%;
	margin: 0 0 0 0;
}

@media (max-width:480px){

.about2 {
width: 100%;
	margin:0 auto;
	text-align:left;
	color:#000;
	background:url(../../img/project/bgsp.jpg) repeat;
}
.about2 .aboutline{
	width: 95%;
	min-width:auto;
	height: 4px;
	padding:0 0 0;
	margin:0 auto;
	background:url(../../img/project/line.jpg)  top center no-repeat;
	position: relative;
}
.about2  .con{
	width: 100%;
	min-width: auto;
	height: auto;
	padding:0 0 30px;
	margin:0 auto;
	background:url(../../img/project/about2bgsp.jpg) top center no-repeat;
	background-size: 320px 255px;
}
.about2  .con h3{
	position:static;
width: 100%;
	margin: 0 auto 0;
	padding:53px 0 0;
	font-size: 14px;
	line-height: 1;
	text-align: center;
}
.about2 .con p.p01{
	font-size: 11px;
	width: 140px;
	color: #009944;
	position: absolute;
	text-align: center;
	top:153px;
	left:50%;
	margin: 0 0 0 -70px;
}
.about2 .con p.p02{
	font-size: 10px;
	color: #FFF;
	width: 95%;
	position: static;
	margin: 200px 0 0 2.5%;
}



}
/* ==============================================
★about3
 ==============================================*/
.about3{
	width: 100%;
	margin:0 auto;
	text-align:left;
	font-size:14px;
	color:#000;
	background:url(../../img/bg02.jpg) repeat;
}
.about3 .con{
	width: 100%;
	min-width: 960px;
	height: 615px;
	padding:0 0 0;
	margin:0 auto;
	background:url(../../img/project/about2bg.jpg)  top center no-repeat;
	position: relative;
}
.about3 .con h3{
	position: absolute;
	top:108px;
	left:50%;
	width: 900px;
	margin: 0 0 0 -450px;
	font-size: 24px;
	line-height: 1;
	color: #fff;
	text-align: center;
}
.about3 .con p.p01{
	font-size: 20px;
	width: 275px;
	color: #009944;
	position: absolute;
	text-align: center;
	top:330px;
	left:50%;
	margin: 0 0 0 -375px;
}
.about3 .con p.p02{
	font-size: 16px;
	color: #FFF;
	width: 450px;
	position: absolute;
	top:220px;
	left:50%;
	margin: 0 0 0 0;
}

@media (max-width:480px){

.about3 {
width: 100%;
	margin:0 auto;
	text-align:left;
	color:#000;
	background:url(../../img/project/bgsp.jpg) repeat;
}

.about3  .con{
	width: 100%px;
	min-width: auto;
	height: auto;
	padding:0 0 30px;
	margin:0 auto;
	background:url(../../img/project/about2bgsp.jpg) top center no-repeat;
	background-size: 320px 255px;
}
.about3  .con h3{
	position:static;
width: 100%;
	margin: 0 auto 0;
	padding:53px 0 0;
	font-size: 14px;
	line-height: 1;
	text-align: center;
}
.about3 .con p.p01{
	font-size: 11px;
	width: 140px;
	color: #009944;
	position: absolute;
	text-align: center;
	top:153px;
	left:50%;
	margin: 0 0 0 -70px;
}
.about3 .con p.p02{
	font-size: 10px;
	color: #FFF;
	width: 95%;
	position: static;
	margin: 200px 0 0 2.5%;
}



}
 /* ==============================================
★LinkWrap
 ==============================================*/
.prjWrap{
	width: 100%;
	margin:0 auto;
	text-align:left;
	font-size:14px;
	color:#000;
	background:url(../../img/project/bg01.gif) repeat;
}
.prjWrap .con{
	width: 100%;
	min-width: 960px;
	height: 1280px;
	padding:26px 0 0;
	margin:0 auto;
	background:url(../../img/project/bg02.gif)  top center no-repeat;
	position: relative;
}
.prjWrap .con h3{
	position: absolute;
	top:108px;
	left:50%;
	width: 900px;
	margin: 0 0 0 -450px;
	font-size: 24px;
	line-height: 1;
	color: #009944;
	text-align: center;
}
.prjWrap .con p{
	font-size: 16px;
	color: #FFF;
	line-height: 1.7;
	width: 360px;
}
.prjWrap .con p.txt01{
	position: absolute;
	top:294px;
	left:50%;
	margin: 0 0 0 -295px;
}
.prjWrap .con p.txt02{
	position: absolute;
	top:540px;
	left:50%;
	margin: 0 0 0 -59px;
}
.prjWrap .con p.txt03{
	position: absolute;
	top:760px;
	left:50%;
	margin: 0 0 0 -295px;
}
.prjWrap .con p.txt04{
	position: absolute;
	top:1040px;
	left:50%;
	margin: 0 0 0 -59px;
}


@media (max-width:480px){

.prjWrap{
width: 100%;
	margin:0 auto;
	text-align:left;
	color:#000;
	background:url(../../img/project/bg_sp1.gif) top center no-repeat;
	background-size: 500px 685px;
}

.prjWrap .con{
	width: 290px;
	min-width: auto;
	height: 670px;
	padding:15px 0 0;
	margin:0 auto;
	background:none;
}
.prjWrap .con h3{
	position:static;
width: 100%;
	margin: 43px auto 0;
	font-size: 14px;
	line-height: 1;
	color: #009944;
	text-align: center;
}
.prjWrap .con p{
	font-size: 10px;
	color: #FFF;
	line-height: 1.7;
	width: 180px;
}
.prjWrap .con p.txt01{
	position: absolute;
	top:130px;
	left:50%;
	margin: 0 0 0 -58px;
}
.prjWrap .con p.txt02{
	position: absolute;
	top:275px;
	left:50%;
	margin: 0 0 0 -125px;
}
.prjWrap .con p.txt03{
	position: absolute;
	top:397px;
	left:50%;
	margin: 0 0 0 -55px;
}
.prjWrap .con p.txt04{
	position: absolute;
	top:550px;
	left:50%;
	margin: 0 0 0 -125px;
}
}

/* ==============================================
★overview
 ==============================================*/
.overview{
	width: 100%;
	margin:0 auto;
	padding: 0 0 69px;
	text-align:left;
	font-size:14px;
	color:#000;
	background:url(../../img/bg02.jpg) repeat;
}
.overview .con{
	width: 100%;
	min-width:auto;
	height: 822px;
	padding:0 0 0;
	margin:0 auto;
	background:url(../../img/project/overviewbg.jpg)  top center no-repeat;
	position: relative;
}
.overview .con h3{
	width: 300px;
	margin:0px auto 0;
	padding:110px 0 0;
	font-size: 24px;
	line-height: 1;
	color: #FFF;
	text-align: center;
}
.overview .con .txt{
width:840px;
	margin:171px auto 0;
	font-size: 16px;
	line-height: 73px;
	color: #FFF;
}

.overview .con .txt p.p01{
float:left;
width: 304px;
	margin:0 0 0 104px;
}
.overview .con .txt p.p02{
float:right;
width: 320px;
	margin:0 0 0 ;
}

@media (max-width:480px){
	.overview{
	width: 100%;
	margin:0 auto;
	padding: 0;
	text-align:left;
	font-size:14px;
	color:#000;
	background:url(../../img/bg02.jpg) repeat;
}
.overview .con{
		width: 100%;
	min-width: auto;
	height: 535px;
	padding:0 0 0;
	margin:0 auto;
	background:url(../../img/project/overviewbgsp.jpg)  top center no-repeat;
	background-size: 500px 535px;
	position: relative;
}
.overview .con h3{
	width: 100%;
	margin:0px auto 0;
	padding:53px 0 0;
	font-size: 14px;
	line-height: 1;
	color: #FFF;
	text-align: center;
}

.overview .con .txt{
	width: 190px;
	margin: 73px auto 0;
	padding: 0 0 0 40px;
	color: #FFF;
}
.overview .con .txt p{
font-size: 10px;
line-height: 31px;
}

.overview .con .txt p.p01{
width: auto;
float: none;
	margin:0;
}
.overview .con .txt p.p02{
width: auto;
	float: none;
	margin:0;
}

	
}

/* ==============================================
★soshikizu
 ==============================================*/
.soshikizu{
	width: 100%;
	margin:0 auto;
	text-align:left;
	font-size:14px;
	color:#000;
	background:url(../../img/project/bg01.gif) repeat;
}
.soshikizu .con{
	width: 100%;
	min-width: 960px;
	padding:0 0 30px;
	margin:0 auto;
	background:url(../../img/project/h3bg.png)  top center no-repeat;
	position: relative;
}
.soshikizu .con h3{

	width: 900px;
	margin: 0 auto;
	padding: 108px 0 0;
	font-size: 24px;
	line-height: 1;
	color: #009944;
	text-align: center;
}
.soshikizu .con p{
	font-size: 14px;
	color: #009944;
	margin: 40px auto 0;
	text-align: center;
}
.soshikizu .con .imgpc{
width: 886px;
	margin: 43px auto 0;
}
.soshikizu .con .imgsp{
display: none;
}

@media (max-width:480px){

.soshikizu{
width: 100%;
	margin:0 auto;
	text-align:left;
	color:#000;

}

.soshikizu .con{
	width: 95%;
	min-width: auto;
	padding:0 0 15px;
	margin:0 auto;
		background:url(../../img/project/soshikizubgsp.png) top center no-repeat;
	background-size: 222px 80px;
}
.soshikizu .con h3{
width: 100%;
	margin: 0 auto 0;
	padding: 52px 0 0;
	font-size: 12px;
	line-height: 1;
	color: #009944;
	text-align: center;
}
.soshikizu .con p{
	font-size: 10px;
	line-height: 1.7;
	margin: 30px auto 0;
}
.soshikizu .con .imgpc{
display: none;
}
.soshikizu .con .imgsp{
display: block;
width: 100%;
	margin: 20px auto 0;
}
}