@charset "utf-8";

.underKeyimage {
	width: 100%;
	height: 200px;
	background: #D9D9D9 url(../images/products/keyimages.jpg) no-repeat center center;
	text-align: center;
}

section {margin-bottom: 50px;position: relative;}

/*-------------------------------------------------------------------------*/

/*tab*/
.tab{width: 740px; position: absolute;top:655px;left: 0;}
.tab p { margin-bottom: 0; font-weight: bold; color: #fff; padding-left: 10px; background-color: #156E98;}
#tabMenu{letter-spacing:-0.4em;}
#tabMenu li{background-color:#E1E1E1; border-radius: 0 0 10px 10px;padding:5px 0 5px 10px; width:160px;text-align:center; display:inline-block;letter-spacing:normal; cursor:pointer;font-size:1.6rem;font-weight:bold;position: relative;}
#tabMenu li:before {	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 10px;
	width: 0;
	height: 0;
	margin-top: -10px;
	border: 10px solid transparent;
	border-left: 10px solid #333;
}
.borderT { border-top: 25px solid #156E98;}

#tabMenu li:hover{background:#f8b500;color:#fff;}

#tabMenu li:hover:before {	content: "";
	position: absolute;
	top: 50%;
	left: 10px;
	width: 0;
	height: 0;
	margin-top: -10px;
	border: 10px solid transparent;
	border-left: 10px solid #fff;
}


#tabMenu li+li{margin-left:2px;font-size:1.6rem;}
#tabMenu li.on{background:#156E98;color:#fff;padding:5px 0 5px 0;}

#tabMenu li.on:before {display: none;}

#tabBox > div {display: none;}
#tabBox > div.on{display: block;}
#tabBox h3{background:#191f61;border-radius:30px;color:#fff;padding:5px 25px;font-size:20px;font-weight:bold;margin-bottom:20px;}
#tabBox li{margin-bottom:20px;position:relative;}
#tabBox li > span{display:block;position:absolute;left:0;top:15px;background:url(../images/products/products-icon1.jpg) no-repeat;width:82px;height:62px;text-align:right;color:#fff;font-size:30px;font-weight:bold;padding-right:5px;line-height:45px;}
#tabBox li:nth-child(2n) > span{display:block;position:absolute;left:0;top:15px;background:url(../images/products/products-icon2.jpg) no-repeat;width:82px;height:62px;text-align:right;color:#fff;font-size:30px;font-weight:bold;padding-right:5px;line-height:45px;}
#tabBox li > div{margin-left:108px;background:#e1e1e1;padding:20px 10px 15px;border-radius:10px;}
#tabBox li:nth-child(2n) > div{background:#efefef;}
#tabBox li > div dl{display:table;width:100%;margin-bottom:10px;}
#tabBox li > div dl dt{display:table-cell; vertical-align:top;width:190px;}
#tabBox li > div dl dt > span{background:#fff;border-radius:5px;display:inline-block;font-weight:bold;color:#2cafb0;padding:0 5px;width:160px;}
#tabBox li > div dl dd{display:table-cell; vertical-align:top;}
#tabBox .allview{text-align:center;}
#tabBox .allview span{display:inline-block;padding:10px 30px;border-radius:10px;color:#fff; background:#333;font-weight:bold;cursor:pointer;}

.ttlWrap {position: relative;}
.productsImgDesc{font-weight:bold;line-height:20px;text-align: right;position: absolute;bottom: 5px; right: 0;}
.productsImgDesc span{display:inline-block; vertical-align:middle;}
.productsImgDesc span:first-child{display:inline-block;width:20px;height:20px;background:#24a514;line-height:20px;margin-right:6px;}

/*tab1*/
#products1to5 .bg{background:url(../images/products/imgHospital1to5.jpg) no-repeat;width:740px;height:598px;margin-bottom:90px;position:relative;}
#products1to5 .bg > span{display:inline-block;width:60px;height:60px;background:#24a514;color:#fff; line-height:60px;font-size:24px;text-align:center;font-weight:bold;border-radius:10px;position:absolute;cursor:pointer;}
#products1to5 .bg > span:hover{background:#333;}
#products1to5 .bg > span.no1{top:31px;left:460px;}
#products1to5 .bg > span.no2{top:31px;left:560px;}
#products1to5 .bg > span.no3{top:320px;left:110px;}
#products1to5 .bg > span.no4{top:450px;left:40px;}
#products1to5 .bg > span.no5{top:490px;left:570px;}

/*tab2*/
#products6to9 .bg{background:url(../images/products/imgHospital6to9.jpg) no-repeat;width:740px;height:598px;margin-bottom:90px;position:relative;}
#products6to9 .bg > span{display:inline-block;width:60px;height:60px;background:#24a514;color:#fff; line-height:60px;font-size:24px;text-align:center;font-weight:bold;border-radius:10px;position:absolute;cursor:pointer;}
#products6to9 .bg > span:hover{background:#333;}
#products6to9 .bg > span.no6{top:500px;left:70px;}
#products6to9 .bg > span.no7{top:91px;left:636px;}
#products6to9 .bg > span.no8{top:520px;left:360px;}
#products6to9 .bg > span.no9{top:400px;left:60px;}

/*tab3*/
#products10 .bg{background:url(../images/products/imgHospital10.jpg) no-repeat;width:740px;height:598px;margin-bottom:90px;position:relative;}
#products10 .bg > span{display:inline-block;width:60px;height:60px;background:#24a514;color:#fff; line-height:60px;font-size:24px;text-align:center;font-weight:bold;border-radius:10px;position:absolute;cursor:pointer;}
#products10 .bg > span:hover{background:#333;}
#products10 .bg > span.no10{top:35px;left:450px;}


/*ホテル・旅館・レジャー施設*/
/*tab1*/
#productsHotel1to4 .bg{background:url(../images/products/imgHotel1to4.jpg) no-repeat;width:740px;height:598px;margin-bottom:90px;position:relative;}
#productsHotel1to4 .bg > span{display:inline-block;width:60px;height:60px;background:#24a514;color:#fff; line-height:60px;font-size:24px;text-align:center;font-weight:bold;border-radius:10px;position:absolute;cursor:pointer;}
#productsHotel1to4 .bg > span:hover{background:#333;}
#productsHotel1to4 .bg > span.no1{top:88px;left:495px;}
#productsHotel1to4 .bg > span.no2{top:150px;left:650px;}
#productsHotel1to4 .bg > span.no3{top:30px;left:340px;}
#productsHotel1to4 .bg > span.no4{top:475px;left:62px;}

/*tab2*/
#productsHotel5to9 .bg{background:url(../images/products/imgHotel5to9.jpg) no-repeat;width:740px;height:598px;margin-bottom:90px;position:relative;}
#productsHotel5to9 .bg > span{display:inline-block;width:60px;height:60px;background:#24a514;color:#fff; line-height:60px;font-size:24px;text-align:center;font-weight:bold;border-radius:10px;position:absolute;cursor:pointer;}
#productsHotel5to9 .bg > span:hover{background:#333;}
#productsHotel5to9 .bg > span.no5{top:28px;left:340px;}
#productsHotel5to9 .bg > span.no6{top:75px;left:500px;}
#productsHotel5to9 .bg > span.no7{top:505px;left:285px;}
#productsHotel5to9 .bg > span.no8{top:145px;left:658px;}
#productsHotel5to9 .bg > span.no9{top:445px;left:52px;}

/*tab3*/
#productsHotel10to15 .bg{background:url(../images/products/imgHotel10to15.jpg) no-repeat;width:740px;height:598px;margin-bottom:90px;position:relative;}
#productsHotel10to15 .bg > span{display:inline-block;width:60px;height:60px;background:#24a514;color:#fff; line-height:60px;font-size:24px;text-align:center;font-weight:bold;border-radius:10px;position:absolute;cursor:pointer;}
#productsHotel10to15 .bg > span:hover{background:#333;}
#productsHotel10to15 .bg > span.no10{top:20px;left:458px;}
#productsHotel10to15 .bg > span.no11{top:80px;left:560px;}
#productsHotel10to15 .bg > span.no12{top:526px;left:285px;}
#productsHotel10to15 .bg > span.no13{top:460px;left:156px;}
#productsHotel10to15 .bg > span.no14{top:385px;left:30px;}
#productsHotel10to15 .bg > span.no15{top:135px;left:665px;}

/*tab4*/
#productsHotel16 .bg{background:url(../images/products/imgHotel16.jpg) no-repeat;width:740px;height:598px;margin-bottom:90px;position:relative;}
#productsHotel16 .bg > span{display:inline-block;width:60px;height:60px;background:#24a514;color:#fff; line-height:60px;font-size:24px;text-align:center;font-weight:bold;border-radius:10px;position:absolute;cursor:pointer;}
#productsHotel16 .bg > span:hover{background:#333;}
#productsHotel16 .bg > span.no16{top:155px;left:568px;}


/*飲食施設*/
/*tab1*/
#productsFood1 .bg{background:url(../images/products/imgFood1.jpg) no-repeat;width:740px;height:598px;margin-bottom:90px;position:relative;}
#productsFood1 .bg > span{display:inline-block;width:60px;height:60px;background:#24a514;color:#fff; line-height:60px;font-size:24px;text-align:center;font-weight:bold;border-radius:10px;position:absolute;cursor:pointer;}
#productsFood1 .bg > span:hover{background:#333;}
#productsFood1 .bg > span.no1{top:155px;left:568px;}

/*tab2*/
#productsFood2to7 .bg{background:url(../images/products/imgFood2to7.jpg) no-repeat;width:740px;height:598px;margin-bottom:90px;position:relative;}
#productsFood2to7 .bg > span{display:inline-block;width:60px;height:60px;background:#24a514;color:#fff; line-height:60px;font-size:24px;text-align:center;font-weight:bold;border-radius:10px;position:absolute;cursor:pointer;}
#productsFood2to7 .bg > span:hover{background:#333;}
#productsFood2to7 .bg > span.no2{top:20px;left:458px;}
#productsFood2to7 .bg > span.no3{top:80px;left:560px;}
#productsFood2to7 .bg > span.no4{top:526px;left:285px;}
#productsFood2to7 .bg > span.no5{top:460px;left:156px;}
#productsFood2to7 .bg > span.no6{top:385px;left:30px;}
#productsFood2to7 .bg > span.no7{top:135px;left:660px;}


/*食品・給食工場施設*/
/*tab1*/
#productsFactory1to6 .bg{background:url(../images/products/imgFactory1to6.jpg) no-repeat;width:740px;height:598px;margin-bottom:90px;position:relative;}
#productsFactory1to6 .bg > span{display:inline-block;width:60px;height:60px;background:#24a514;color:#fff; line-height:60px;font-size:24px;text-align:center;font-weight:bold;border-radius:10px;position:absolute;cursor:pointer;}
#productsFactory1to6 .bg > span:hover{background:#333;}
#productsFactory1to6 .bg > span.no1{top:20px;left:458px;}
#productsFactory1to6 .bg > span.no2{top:80px;left:560px;}
#productsFactory1to6 .bg > span.no3{top:526px;left:285px;}
#productsFactory1to6 .bg > span.no4{top:460px;left:156px;}
#productsFactory1to6 .bg > span.no5{top:385px;left:30px;}
#productsFactory1to6 .bg > span.no6{top:135px;left:660px;}


/*ビルメンテナンス業*/
/*tab1*/
#productsMaintenance1 .bg{background:url(../images/products/imgMaintenance1.jpg) no-repeat;width:740px;height:598px;margin-bottom:90px;position:relative;}
#productsMaintenance1 .bg > span{display:inline-block;width:60px;height:60px;background:#24a514;color:#fff; line-height:60px;font-size:24px;text-align:center;font-weight:bold;border-radius:10px;position:absolute;cursor:pointer;}
#productsMaintenance1 .bg > span:hover{background:#333;}
#productsMaintenance1 .bg > span.no1{top:20px;left:20px;}
#productsMaintenance1 .bg > span.no2{top:80px;left:560px;}
#productsMaintenance1 .bg > span.no3{top:530px;left:285px;}
#productsMaintenance1 .bg > span.no4{top:460px;left:156px;}
#productsMaintenance1 .bg > span.no5{top:385px;left:30px;}
#productsMaintenance1 .bg > span.no6{top:135px;left:660px;}