@charset "UTF-8";

*{
	box-sizing:border-box;
}

/* categoryInd */

body.categoryInd h1{
	border-top:8px solid #CC0000;
	border-left:1px solid #c4c4c4;
	border-right:1px solid #c4c4c4;
	border-bottom:1px solid #c4c4c4;
	height:230px;
	color:#CC0000;
	background:url(/img/service/bg_h1_index.jpg) left top;
}
	body.categoryInd h1 span.inner{
		position:relative;
		display:block;
		padding:40px 0 65px 105px;
		font-weight:bold;
	}
		body.categoryInd h1 span.inner:before{
			position:absolute;
			top:34px;
			left:20px;
			display:inline-block;
			content:"";
			background:url(/img/service/ico_h1.png) no-repeat;
			background-size:contain;
			width:65px;
			height:47px;
		}
	body.categoryInd h1 span.read{
		display:block;
		color:#333333;
		font-size:0.7em;
		padding:0 0 0 20px;
	}


body.categoryInd h3{
	background-image:none !important;
	background-color:#f9f9f9;
	text-align:left;
	height:35px;
	padding:8px 0 2px 5px;
	font-size:1.2em;
	margin:0 0 10px;
}



#main-box div.sectionCol.clm1{
	width:1168px;
}
	#main-box div.sectionCol.clm1 ul{

	}
	#main-box div.sectionCol.clm1 ul li{
		display:inline-block; vertical-align: top;
		width:560px;
		margin-right:37px;
	}
	#main-box div.sectionCol.clm1 ul li:nth-of-type(2n){
		margin-right:0;
	}
	#main-box div.sectionCol.clm1:nth-of-type(2n){
		margin-left:0;
	}

ul.serviceTab{
	letter-spacing:-.4em;
}
ul.serviceTab li{
   position:relative;
   display:inline-block;
   vertical-align:top;
   width:288px;
   text-align:center;
   font-weight:bold;
   background:#eeeeee;
   border-radius:5px;
   overflow:hidden;
   cursor:pointer;
   transition:0.5s;
   letter-spacing:normal;
}
	ul.serviceTab li:nth-child(2){
		margin:0 5px;
	}
	ul.serviceTab li:nth-child(3){
		margin-right:5px;
	}
	ul.serviceTab li:nth-last-child(1){
		margin-right:0;
	}
ul.serviceTab li a{
	display:block;
   padding:30px 0;
   color:#333333;
   text-decoration:none;
}
   ul.serviceTab li:before{
	   position:absolute;
	   content:"";
	   left:45%;
	   bottom:-30px;
	   height:50px;
	   width:50px;
	   border-radius:50%;
	   background:#FFF;
   }
   ul.serviceTab li:after{
	   position:absolute;
	   left:147px;
	   bottom:4px;
	   content:url(/img/service/ico_serviceTab.png);
	   transition:0.5s;
   }
   ul.serviceTab li:hover{
	   background:#ffb0b0;
   }
	   ul.serviceTab li:hover:after{
		   transform:rotateZ(180deg);
	   }
   ul.serviceTab li.here{
	   background:#ffb0b0;
   }
	   ul.serviceTab li.here:after{
		   transform:rotateZ(180deg);
	   }



/*  重さ・サイズ
----------------------------------------------- */

	p.size{
		position:relative;
		padding:1rem;
		background:linear-gradient(to right, #ffeaea, #ff2b2b, #aa0000);
		}
		p.size span{
			position:absolute;
			top: 50%;
			transform: translateY(-50%);
			font-weight:bold;
		}
			p.size span.ex{
				left:50%;
				transform: translate(-50%, -50%);
				display:inline-block;
				padding:0.2rem 0.6rem;
				text-align:center;
				background:rgba(255,255,255,1);
				border-radius:5px;
			}
			p.size span.small{
				left:1rem;
				color:#002b55;
			}
			p.size span.big{
				right:1rem;
				color:#eaf4ff;
			}

	#result{
		padding:0;
	}


	#result section{
		display:inline-block;
		vertical-align:top;
		margin:15px;
		width:551px;
		background:rgba(255,255,255,1);
		box-sizing:border-box;
		border:1px solid rgba(204,204,204,1);
	}

	#result section dl{
		display:table;
		width:100%;
		margin:0.2rem 0;
	}
		#result section dt{
			display:table-cell;
			background:rgba(204,204,204,1);
			width:6rem;
			height:4rem;
			padding:0.4rem;
		}
		#result section dd{
			display:table-cell;
			padding:0.4rem;

		}

	#result section strong{
		position:relative;
		display:block;
		background:rgba(255,51,51,1);
	}
		#result section:nth-child(1) strong{
			background:#ffeaea;
		}
			#result section:nth-child(1) strong a{
				color:#550000;
			}
		#result section:nth-child(2) strong{
			background:#ffd5d5;
		}
			#result section:nth-child(2) strong a{
				color:#550000;
			}
		#result section:nth-child(3) strong{
			background:#ffaaaa;
		}
			#result section:nth-child(3) strong a{
				color:#550000;
			}
		#result section:nth-child(4) strong{
			background:#ff8080;
		}
			#result section:nth-child(4) strong a{
				color:#550000;
			}
		#result section:nth-child(5) strong{
			background:#ff5555;
		}
		#result section:nth-child(6) strong{
			background:#ff2b2b;
		}
		#result section:nth-child(7) strong{
			background:#ff0000;
		}
		#result section:nth-child(8) strong{
			background:#d50000;
		}
		#result section:nth-child(9) strong{
			background:#aa0000;
		}
		#result section:nth-child(10) strong{
			background:#800000;
		}

	#result section strong a{
		display:block;
		color:rgba(255,255,255,1);
		padding:0.6rem;
		text-decoration:none;
	}
		#result section strong a:after{
			position:absolute;
			right:10px;
			top:35%;
			display:inline-block;
			font-family:jpsmt;
			content:"\3e";
		}
	#result section div.imgBox{
		height:180px;
		text-align:center;
	}
		#result section div.imgBox img{
			width:180px;
			height:auto;
		}
		#result section span.ex{
			display:block;
			text-align:center;
			font-size:0.85rem;
			color:rgba(102,102,102,1);
			padding-bottom:0.6rem;
		}



	#main-box #select table td{
		font-size:1rem;
	}
	#select table td.heading{
		background:rgba(102,102,102,1);
		color:rgba(255,255,255,1);
		text-align:center;
		font-weight:bold;
	}
	#select{
		display:block;
		margin:1rem 0;
		border:1px solid rgba(102,102,102,1);
	}
	#select table.layout td{
		padding:10px;
	}


		#select input{
			display:none;
		}
		#select label {
			display:inline-block;
			padding:0.4rem 0;
			margin-left: 20px;
			cursor:pointer;
			transition:0.5s;
			border-radius: 3px;
		}
			#select label:nth-of-type(1){
				margin-left: 0px;
			}

		#select input[type=checkbox] + label {
			position:relative;
			padding-left:2rem;
			border:2px solid rgba(255,255,255,1);
		}
			#select input[type=checkbox] + label:before {
				  content: "";
				  display: inline-block;
				  vertical-align:middle;
				  position:absolute;
				  left:0.4rem;
				  top:0.5rem;
				  width: 15px;
				  height: 15px;
				  border:2px solid rgba(255,51,51,1);
				  border-radius: 4px;
				  margin-right:0.4rem;
				  background:rgba(255,255,255,1);
				  z-index:1;
			}
				#select input[type=checkbox]:checked + label{
				}
				#select input[type=checkbox]:checked + label:before {
					background:rgba(255,51,51,1);
				}
			#select input[type=checkbox] + label:after {
				  -webkit-transition: opacity 0.2s linearel
				  transition: opacity 0.2s linear;
				  position: absolute;
				  top: 48%;
				  left: 0.7rem;
				  display: block;
				  margin-top: -7px;
				  width: 5px;
				  height: 9px;
				  border-right: 3px solid rgba(255,255,255,1);
				  border-bottom: 3px solid rgba(255,255,255,1);
				  content: '';
				  opacity:0;
				  -webkit-transform: rotate(45deg);
				  -ms-transform: rotate(45deg);
				  transform: rotate(45deg);
				  z-index:3;
			}
				#select input[type=checkbox]:checked + label:after {
					opacity:1;
				}


		#select input[type=radio] + label{
			text-align:center;
			border:2px solid rgba(102,102,102,1);
			background:rgba(102,102,102,1);
			color:rgba(255,255,255,1);
			width:140px;
		}


	#result [class*="hidden-"] {display: none;}


/*  50音
----------------------------------------------- */

/*50音リスト*/
ul.order{
	margin:20px 0;
	text-align:center;
}
ul.order li{
	display:inline-block;
	vertical-align:top;
	font-size:1.3em;
	font-weight:bold;
	padding:6px 12px;
	border-radius:5px;
	transition:0.5s;
	cursor:pointer;
	box-shadow:0px 0px 3px -1px #999999;
}
	ul.order li a{
		display:block;
		color:#333333;
		text-decoration:none;
	}
	ul.order li:hover{
		background:#ffd8e0;
	}

#main-box div.sectionCol_order{
	margin-top:20px;
	display:inline-block;
	vertical-align:top;
	width:566px;
}

div.sectionCol_order ul li{
	position:relative;
	padding-left:60px;
	height:35px;
}
	div.sectionCol_order ul li a{
		font-weight:bold;
	}
	div.sectionCol_order ul li span{
		display:block;
		font-size:0.9em;
		margin-top:4px;
	}
	div.sectionCol_order ul li:before{
		position:absolute;
		content:url(/img/common/ico_simpleG_arrow.png);
		top:8px;
		left:45px;
	}
	div.sectionCol_order ul li.on:before{
		position: relative;
		background: #8C8C8C;
	}
		div.sectionCol_order ul li.blankList:before{
			content:"";
		}




/*吹き出し*/

ul.topMenuList{
	position:relative;
	margin-top:-22px !important;
}

div.balloon{
	display:inline;
}

	.arrow_box {
		position: relative;
		background: #8C8C8C;
		color:#FFF;
		padding:2px 5px;
	}
	.arrow_box:after {
		left: 95%;
		top: 50%;
		border: solid transparent;
		content: " ";
		height: 0;
		width: 0;
		position: absolute;
		pointer-events: none;
		border-color: rgba(140, 140, 140, 0);
		border-left-color: #8C8C8C;
		border-width: 5px;
		margin-top: -5px;
	}


/*  関連ワード
----------------------------------------------- */

#main-box ul.wordSelect{margin:20px 0 50px;}
#main-box ul.wordSelect li{
	display:inline-block;
	box-shadow:0px 0px 3px -1px #c6c5c4;
	border-radius:3px;
	border:1px solid #d8d8d8;
	letter-spacing: 1px;
	padding:4px 8px;
	margin:5px 7px 5px;
	font-size:18px; color:#333333;
	transition:0.5s;
}
	#main-box ul.wordSelect li:hover{
		cursor:pointer;
		background:#fed8de;
	}
	#main-box ul.wordSelect li.here{
		background:#fed8de;
		box-shadow:none;
		border:1px solid #fed8de;
	}
	#main-box ul.wordSelect li a{
		color:#333333;
		text-decoration:none;
	}

div.selection{
	margin-bottom:20px;
	letter-spacing:-0.4em;
}
div.selection ul li{
	position:relative;
	display:inline-block;
	vertical-align:top;
	width:564px;
	padding-left:30px;
	letter-spacing:normal;
	font-weight:bold;
	transition:.5s;
}
		div.selection ul li:hover{
			background:#ffebeb;
		}
	div.selection ul li span{
		font-weight:normal;
		display:block;
		font-size:0.9em;
		margin-top:4px;
	}
	div.selection ul li a{
		display:block;
		text-decoration:none;
		height:100px;
	}
	div.selection ul li a span{
		font-weight:normal;
		color:#333;
	}
	div.selection ul li a em{
		color:#1e4ea6;
		text-decoration:underline;
	}
	div.selection li:before{
		position:absolute;
		content:url(/img/common/ico_simpleG_arrow.png);
		top:8px;
		left:16px;
	}
	div.selection ul li:nth-of-type(2n){
		margin-left:32px;
	}
	div.selection ul li a.spLink{
		display:none;
	}


/*　商品・サービス一覧　*/

	body.under h1 span.inner:before{
		content:"";
		background:url(/img/service/ico_h1.png) no-repeat;
			background-size:contain;
			width:65px;
			height:47px;
	}
	body.under h1 + p.read{
		font-size:1.15em !important;
		padding:10px 20px;
	}
	body.under p.read + span{
		display:block;
		margin-bottom:20px;
	}

div.sectionCol ul.single ul{
	margin-left:30px !important;
}
div.sectionCol ul.single li{
	position:relative;
	padding-left:0px;
	height:auto;
	margin:10px 0;
}
	div.sectionCol ul.single li a{
		display:inline;
	}
		body.under div.sectionCol ul li:hover{
			background:none;
		}



/* 削除候補 */
span.mkr-nav-r{
	background: url("/img/common/arrow_nav.gif") no-repeat 0 0.2em;
}

@media (max-width: 1024px) {
	#main-box div.sectionCol_order {
		width: 470px;
	}
}
@media (max-width: 768px) {
	#main-box div.sectionCol_order {
		width: 360px;
	}
}
