@charset "utf-8";

/*------------------------*/
/* background             */
/*------------------------*/
#bg{
	position:fixed;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center;
	top:110px;
	left:0px;
	width:100%;
	height:100%;
}

/*------------------------*/
/* top image              */
/*------------------------*/
#top-wrap{
	margin-top: 30px;
	position:relative;
	background:url("../images/top.jpg");
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center;
	width:100%;
	height:500px;
}
#top-wrap #copy{
	position:absolute;
	font-size:30px;
	font-weight:bold;
	color:#ffffff;
	text-align:center;
	text-shadow:1px 1px 3px #000000;
	top:35%;
	left: 0;
	right: 0;
	margin: auto;
	max-width: 570px;
}

@media screen and (max-width: 780px){
#top-wrap #copy{
	font-size:24px;
	left:2%;
	width:96%;
}
#top-wrap #copy br{
	display:none;
}
}

/*------------------------*/
/* gray                   */
/*------------------------*/
#gray-area{
	position:relative;
	padding-top:25px;
	padding-bottom:25px;
	background:#c7c7c7;
	width:100%;
}
#gray-area #gray-wrap{
	position:relative;
	margin:0px auto 0px auto;
	width:980px;
	font-size:20px;
	font-weight:bold;
	color:#ffffff;
	text-align:center;
}
@media screen and (max-width: 780px){
#gray-area{
	padding-top:20px;
	padding-bottom:20px;
}
#gray-area #gray-wrap{
	font-size:16px;
	width:96%;
}
#gray-wrap br{
	display:none;
}
}

/*------------------------*/
/* product                */
/*------------------------*/
.product{
	position:relative;
	background:#ffffff;
	width:100%;
}
.product .product-wrap{
	position:relative;
	margin:0px auto 0px auto;
	padding-bottom:40px;
	width:980px;
}
.product .product-wrap-line{
	position:relative;
	margin:0px auto 0px auto;
	padding-bottom:40px;
	width:980px;
	/*border-style:solid;*/
	/*border-width:0px 0px 1px 0px;*/
	/*border-color:#ffffff #ffffff #cccccc #ffffff;*/
}
@media screen and (max-width: 780px){
.product .product-wrap,
.product .product-wrap-line{
	padding-bottom:20px;
	width:96%;
}
}

.product ul{
	position:relative;
	float:left;
	margin:40px 0px 0px 0px;
	padding:0px;
	list-style-type:none;
}
.product ul li{
	position:relative;
  	float:left;
	margin:0px;
	padding:0px;
}
.product ul li:nth-child(1){
	margin-right:70px;
}
@media screen and (max-width: 780px){
.product ul li{
	width:100%;
}
.product ul li:nth-child(1){
	margin-right:0px;
}
}

.product .img-wrap{
	position:relative;
	width:425px;
}
@media screen and (max-width: 780px){
.product .img-wrap{
	width:96%;
	text-align:center;
}
}

.product .desc-wrap{
	position:relative;
	width:485px;
}
@media screen and (max-width: 780px){
.product .desc-wrap{
	margin:0px auto 0px auto;
	width:96%;
}
}
.product .desc-wrap .product-title{
	padding:3px 10px 3px 10px;
	font-size:24px;
	font-weight:bold;
	color:#6baf3c;
	letter-spacing:2px;
	width:485px;
	border-style:solid;
	border-width:0px 0px 1px 7px;
	border-color:#ffffff #ffffff #cccccc #cccccc;
}
@media screen and (max-width: 780px){
.product .desc-wrap .product-title{
	margin:0px auto 0px auto;
	font-size:20px;
	letter-spacing:1px;
	width:100%;
}
}
.product .desc-wrap .product-desc{
	margin:0px auto 0px auto;
	padding-top:10px;
	font-size:20px;
	width:100%;
}
@media screen and (max-width: 780px){
.product .desc-wrap .product-desc{
	font-size:16px;
}
}

.product .desc-wrap .product-subttl{
	padding-bottom:10px;
	font-weight:bold;
}

/*------------------------*/
/* green                  */
/*------------------------*/
.green-area{
	position:relative;
	padding-top:20px;
	padding-bottom:15px;
	background:#6baf3c;
	width:100%;
}
.green-area .green-cont{
	display: flex;
	justify-content: space-around;
	position:relative;
	margin:30px auto 0px auto;
	padding-bottom:10px;
	width:980px;
	font-size:24px;
	font-weight:bold;
	letter-spacing:2px;
	line-height:30px;
	color:#ffffff;
}
@media screen and (max-width: 780px){
.green-area .green-cont{
	flex-flow: column;
	gap: 15px;
	position:relative;
	margin:20px auto 0px auto;
	width:96%;
	font-size:20px;
	letter-spacing:1px;
	line-height:26px;
}
}

.green-area .green-cont ul{
	position:relative;
	float:left;
	margin:0px;
	padding:0px;
	list-style-type:none;
}
.green-area .green-cont ul li{
	position:relative;
	float:left;
	padding:0px;
}
.green-area .green-cont ul li:nth-child(-n+2){
	margin-right:40px;
}

@media screen and (max-width: 780px){
.green-area .green-cont ul li{
	position:relative;
	float:left;
	padding:0px 0px 20px 0px;
	width:100%;
}
.green-area .green-cont ul li:nth-child(-n+2){
	margin-right:0px;
}
}

.green-area .green-cont ul li .img-wrap{
	position:relative;
	width:300px;
}

@media screen and (max-width: 780px){
.green-area .green-cont ul li .img-wrap{
	width:100%;
	text-align:center;
}
}

/*------------------------*/
/* white                  */
/*------------------------*/
.white-title-wrap{
	position:relative;
	margin:0px auto 0px auto;
	width:980px;
	font-size:26px;
	font-weight:bold;
	letter-spacing:3px;
	line-height:26px;
	color:#ffffff;
}
@media screen and (max-width: 780px){
.white-title-wrap{
	width:96%;
	font-size:22px;
	letter-spacing:2px;
	line-height:22px;
}
}
.access-title{
	position:relative;
	margin:0px auto 0px auto;
	text-align:center;
	font-size:24px;
	font-weight:bold;
	color:#ffffff;
	letter-spacing:2px;
	line-height:40px;
	width:140px;
	height:40px;
	border-style:solid;
	border-width:2px 2px 2px 2px;
	border-color:#ffffff #ffffff #ffffff #ffffff;
}

.contact-title{
	position:relative;
	margin:0px auto 0px auto;
	text-align:center;
	font-size:24px;
	font-weight:bold;
	color:#ffffff;
	letter-spacing:2px;
	line-height:40px;
	width:200px;
	height:40px;
	border-style:solid;
	border-width:2px 2px 2px 2px;
	border-color:#ffffff #ffffff #ffffff #ffffff;
}

/*------------------------*/
/* access                 */
/*------------------------*/
.access-area{
    background: url(../images/bg.jpg) no-repeat center / cover;
	position:relative;
	padding-top:60px;
	padding-bottom:100px;
	width:100%;
}
.access-area .access-wrap{
	position:relative;
	margin:30px auto 0px auto;
	background:#6baf3c;
	color:#ffffff;
	width:980px;
}
@media screen and (max-width: 780px){
.access-area .access-wrap{
	width:96%;
}
}

.access-area .access-wrap .company-wrap{
	float:left;
	padding:30px;
	margin-right:20px;
	width:350px;
}
.access-area .access-wrap .map-wrap{
	float:left;
	padding-top:5px;
	padding-left:5px;
	width:610px;
}

@media screen and (max-width: 780px){
.access-area .access-wrap .company-wrap{
	margin-right:0px;
	width:100%;
}
.access-area .access-wrap .map-wrap{
	padding-top:0px;
	padding-left:2%;
	width:98%;
}
.access-area .access-wrap .map-wrap iframe{
	width:100%;
}
}

.access-area .access-wrap .company-wrap .company-name{
	font-size:24px;
	font-weight:bold;
}
.access-area .access-wrap .company-wrap .company-address{
	margin-top:50px;
	font-size:18px;
	line-height:24px;
}
@media screen and (max-width: 780px){
.access-area .access-wrap .company-wrap .company-address{
	margin-top:20px;
}
}