@charset "UTF-8";

*{
	box-sizing:border-box;
}

/* categoryInd */

body.categoryInd h1{
	position:relative;
	color:#CC0000;
	background:url(/img/service/bg_h1_index.jpg) no-repeat;
	background-size:cover;
	background-position:80% top;
}
  body.categoryInd h1:before {
    z-index: 0;
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color:rgba(255,255,255,0.8);
  }
	body.categoryInd h1 span.inner{
		position:relative;
		display:block;
		padding:0 0 0 60px;
		font-weight:bold;
	}
		body.categoryInd h1 span.inner:before{
			position:absolute;
			top:-10px;
			left:-10px;
			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{
		position:relative;
		display:block;
		color:#333333;
		font-size:0.7em;
		padding:20px 0 20px 0;
	}


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;
}


ul.serviceTab{
	letter-spacing:-.4em;
	margin:0 -12px ;
}
ul.serviceTab li{
   position:relative;
   display:inline-block;
   vertical-align:top;
   width:50%;
   text-align:center;
   font-weight:bold;
   background:#eeeeee;
   overflow:hidden;
   cursor:pointer;
   transition:0.5s;
   letter-spacing:normal;
   border-right:1px solid rgba(255,255,255,1.00);
}
		ul.serviceTab li:nth-child(2){
			margin:0 0px;
		}
		ul.serviceTab li:nth-child(3){
			margin-right:0px;
		}
ul.serviceTab li a{
	display:block;
   padding:30px 0;
   color:#333333;
   text-decoration:none;
}
   ul.serviceTab li:before{
		position:absolute;
		content:"";
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform:translateX(-50%);
		bottom:-30px;
		height:50px;
		width:50px;
		border-radius:50%;
		background:#FFF;
   }
   ul.serviceTab li:after{
		position:absolute;
		left: 50%;
		transform: translateX(-50%) rotateZ(180deg);
		-webkit-transform:translateX(-50%) rotateZ(180deg);
		bottom:0;
		font-family:"jpsmt";
		content:"\2f";
		transition:0.5s;
   }


   ul.serviceTab li:hover{
	   background:#ffb0b0;
   }
		ul.serviceTab li:hover:after{
			transform: translateX(-50%) rotateZ(0deg) ;
			-webkit-transform:translateX(-50%) rotateZ(0deg);
		}
   ul.serviceTab li.here{
	   background:#ffb0b0;
   }
		ul.serviceTab li.here:after{
			transform: translateX(-50%) rotateZ(0deg) ;
			-webkit-transform:translateX(-50%) rotateZ(0deg);
		}
	ul.serviceTab li a {
		padding:5px 20px 0;
		height:80px;
		box-sizing:border-box;
	}


ul.serviceTab li a span{
	display:block;
}



/*  重さ・サイズ
----------------------------------------------- */

	p.size{
		position:relative;
		padding:1rem;
		background:linear-gradient(to right, #ffeaea, #ff2b2b, #aa0000);
		margin:4px -12px;
		}
		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;
		margin:0 -12px;
	}


	#result section{
		display:block;
		margin:5px 0;
		width:100%;
		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:auto;
			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{
			max-width:45%;
			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: 0px;
			cursor:pointer;
			transition:0.5s;
			border-radius: 3px;
		}

		#select input[type=checkbox] + label {
			position:relative;
			padding-left:2rem;
			border:2px solid rgba(255,255,255,1);
			width:48%;
			font-size:3.0vw;
		}
			#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;
			display:block;
			margin:0 auto;
		}


	#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:0px 6px;
	border-radius:3px;
	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;
	}

div.sectionCol_order ul li{
	position:relative;
	padding-left:40px;
}
	div.sectionCol_order ul li a{
		font-weight:bold;
		padding:4px 0 4px 20px;
		display:block;
	}
	div.sectionCol_order ul li span{
		display:block;
		font-size:0.9em;
		margin-top:4px;
	}
	div.sectionCol_order ul li:before{
		position:absolute;
		font-family:"jpsmt";
		content:url(/img/common/ico_simpleG_arrow.png);
		font-size:0.6em;
		color:#999999;
		top:12px;
		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;
}
div.balloon{
	position:absolute;
	margin-top:4px;
	display:inline;
}
/* div.balloon + ul.topMenuList{
	border-top:1px dotted #CCCCCC;
	padding:10px 0;
} */
	h3 + div.sectionCol_order ul.topMenuList:nth-of-type(1){
		border-top:none;
	}
	h3#ord-Y + div.sectionCol_order ul.topMenuList{
		padding:10px 0 0;
	}
	h3#ord-Y + div.sectionCol_order + div.sectionCol_order ul.topMenuList:nth-of-type(1){
		padding:0 0 10px;
	}


/* div.balloon + ul.topMenuList{
	border-top:1px dotted #CCCCCC;
	padding:10px 0;
} */


	.arrow_box {
		position: relative;
		background: #8C8C8C;
		color:#FFF;
		padding:2px 5px;
    	border-radius: 3px;
    	-webkit-border-radius: 3px;
    	-moz-border-radius: 3px;
	}
	.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 20px;}
#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 1px 5px;
	font-size:0.8em;
	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;
	letter-spacing:normal;
	font-weight:bold;
	margin-bottom:20px;
}
	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;
		padding-left:16px;
	}
	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;
		font-family:"jpsmt";
		content:"\3e";
		font-size:0.6em;
		top:7%;
		left:0px;
		color:#999999;
	}
	div.selection ul li a.pcLink{
		display:none;
	}


/*　商品・サービス一覧　*/

body.under h1{
	color:#cc0000;
}

	body.under h1 span.inner{
		position:relative;
		display:block;
		padding:0 0 0 60px;
		font-weight:bold;
	}
		body.under h1 span.inner:before{
			position:absolute;
			top:-10px;
			left:-10px;
			display:inline-block;
			content:"";
			background:url(/img/service/ico_h1.png) no-repeat;
			background-size:contain;
			width:65px;
			height:47px;
		}

div.sectionCol ul.single li{
	margin:10px 0;
}
	div.sectionCol ul.single li ul{
		margin-left:20px !important;
	}



div.arrange-r.sp-t30{
	text-align:center;
}
span.mkr-nav-r a{
	display:block;
	position:relative;
	background:#FFFFFF;
	padding:16px 2em 16px 10px;
	border:1px solid #ce0000;
	border-radius:5px;
	margin:2px 0;
	text-decoration:none;
	font-weight:bold;
	font-size:14px;
	color:#333333;
}
	span.mkr-nav-r a:after{
	position:absolute;
	font-family: 'jpsmt';
	content: "\3e";
	font-weight:normal;
	right:10px;
	top:50%;
	margin-top:-10px;
	height:100%;
	font-size:16px;
	color:#ce0000;
	}
span.mkr-top{
	display:none;
}
