@charset "UTF-8";


/*
	下記の内容を非表示にしています
	・「キーワードから探す」の「関連する事例」の画像
	・「解決したい課題一覧」の「関連する事例」の画像
	下記の２行を削除すると内容は表示するようになります。
*/
#content-in #match-product-case .box .im{ display: none !important; }
#content-in #match-theme-case .box .im{ display: none !important; }

.hidden {
	display: none !important;
}







/* height_adjust */
.haj{
	display: block;
	min-height: 0;
}
.haj:after{
	content: " ";
	display: block;
	visibility: hidden;
	clear: both;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
}
* html .haj{
	display: inline-block;
}
/* exclude ie mac \*/
* html .haj{
	height: 1%;
}




/************************************************** 共通 */

/* 検索部分の全体 */
#content-in{
	margin: 20px 0;
}

/* 検索フォーム・検索結果 共通 */
/*
#content-in のタグに、選択したカテゴリのclass「on-●」を設定して表示内容を切り替える。
表示した初期状態は「on-a」で「キーワードから探す」が表示されるようになっている。
カテゴリのタブをクリックすると、javascriptによってclassが切り替わるようになっている。
on-a : キーワードから探す
on-b : 製品名から探す
on-c : 解決したい課題一覧
on-d : 虫眼鏡
*/

	/* 一度全てを非表示にし、onにした項目を表示する */
		#content-in #search-form2 div.a,
		#content-in #search-results div.a,
		#content-in #search-form2 div.b,
		#content-in #search-form2 div.c,
		#content-in #search-form2 div.d,
		#content-in #search-results div.b,
		#content-in #search-results div.c,
		#content-in #search-results div.d,
		#content-in .down,
		#content-in #hitcount{
			display: none;
		}
	/* a「キーワードから探す」選択時の状態 */
		#content-in.on-a #search-form2 div.a,
		#content-in.on-a #search-results div.a,
		#content-in.on-a .down,
		#content-in.on-a #hitcount{
			display: block;
		}
	/* b「製品名から探す」選択時の状態 */
		#content-in.on-b #search-form2 div.b,
		#content-in.on-b #search-results div.b{
			display: block;
		}
	/* c「解決したい課題一覧」選択時の状態 */
		#content-in.on-c #search-form2 div.c,
		#content-in.on-c #search-results div.c,
		#content-in.on-c .down,
		#content-in.on-c #hitcount{
			display: block;
		}
	/* d「虫眼鏡」選択時の状態 */
		#content-in.on-d #search-form2 div.d,
		#content-in.on-d #search-results div.d{
			display: block;
		}


/************************************************** 共通 */

/* カテゴリタイトル */
#content-in .category_title{
	width: 960px;
	height: 80px;
	background: url(/common/img/background_category_title.png) no-repeat;
}
#content-in .category_title div{
	padding: 23px 0 0 20px;
	font-size: 30px;
	font-weight: bold;
}


/************************************************** 検索フォーム */

/* 検索フォーム 上段（タブ部分） */
#content-in #search-form1{
	margin-top: 20px;
	width: 960px;
	height: 68px;
}
	/* 背景画像（切り替えはjsで行っている） */
	#content-in.on-a #search-form1 { background: url(/common/img/background_search_tab_a.png) no-repeat; }
	#content-in.on-b #search-form1 { background: url(/common/img/background_search_tab_b.png) no-repeat; }
	#content-in.on-c #search-form1 { background: url(/common/img/background_search_tab_c.png) no-repeat; }
	#content-in.on-d #search-form1 { background: url(/common/img/background_search_tab_d.png) no-repeat; }
	/* 項目名 */
	#content-in #search-form1 div{
		margin-top: 10px;
		padding-top: 10px;
		height: 38px;
		font-size: 20px;
		text-align: center;
	/*	cursor: pointer;*/
		float: left;
	}
	/* a ページの場合のみカーソルを変える */
	/* jsで遷移するため、カーソルが変わらないから */
	#content-in.on-a #search-form1 div.a{
		cursor: auto;
	}
	#content-in.on-a #search-form1 div.d,
	#content-in.on-d #search-form1 div.a p{
		cursor: pointer;
	}
	#content-in.on-d #search-form1 div.a p:hover {
		color: #3399ff; text-decoration: underline;
		text-decoration: underline;
	}

		/* キーワードから探す */
		#content-in #search-form1 div.a{
			margin-left: 11px;
			width: 235px;
		}
		/* 製品名から探す */
		#content-in #search-form1 div.b{
			margin-left: 13px;
			width: 235px;
		}
		/* 解決したい課題一覧 */
		#content-in #search-form1 div.c{
			margin-left: 153px;
			width: 235px;
		}
		/* 虫眼鏡 */
		#content-in #search-form1 div.d{
			margin-left: 20px;
			width: 48px;
		}
			#content-in #search-form1 div.d a{
				width: 48px;
				height: 38px;
				display: block;
			}
			/* 「虫眼鏡」の文字の透過 */
			#content-in #search-form1 div.d span{
				display: none;
			}


/* 検索フォーム 下段（フォーム部分） */
#content-in #search-form2{
	padding: 15px;
	border-left: 1px #263892 solid;
	border-right: 1px #263892 solid;
	border-bottom: 1px #263892 solid;
}

	/* 検索フォーム */
	#content-in #search-form2 div.d form{
		margin-top: 20px;
		text-align: center;
	}
	/* キーワード入力部分 */
	#content-in #search-form2 div.d #SS_searchQuery1{
		padding: 10px;
		width: 300px;
		height: 20px;
		border-top: 1px #000 solid;
		border-left: 1px #000 solid;
		border-bottom: 1px #000 solid;
		border-right: none;

		border-top-left-radius: 2px;
		-webkit-border-top-left-radius: 2px;
		-moz-border-top-left-radius: 2px;
		-o-border-top-left-radius: 2px;
		-ms-border-top-left-radius: 2px;
		border-bottom-left-radius: 2px;
		-webkit-border-bottom-left-radius: 2px;
		-moz-border-bottom-left-radius: 2px;
		-o-border-bottom-left-radius: 2px;
		-ms-border-bottom-left-radius: 2px;
		font-size: 15px;
	}
	/* 「検索」ボタン */
	#content-in #search-form2 div.d #search-button{
		padding: 5px 0 0 0;
		width: 80px;
		height: 42px;
		background: #263892;
		color: #fff;
		border: 1px #000 solid;
		border-top-right-radius: 2px;
		-webkit-border-top-right-radius: 2px;
		-moz-border-top-right-radius: 2px;
		-o-border-top-right-radius: 2px;
		-ms-border-top-right-radius: 2px;
		border-bottom-right-radius: 2px;
		-webkit-border-bottom-right-radius: 2px;
		-moz-border-bottom-right-radius: 2px;
		-o-border-bottom-right-radius: 2px;
		-ms-border-bottom-right-radius: 2px;
		font-size: 20px;

		outline: none;
		display: inline-block;
		vertical-align: top;
	}
	#content-in #search-form2 div.d #search-button:hover{
		opacity:0.8;
		filter: alpha(opacity=80);
		-ms-filter: "alpha(opacity=80)";
		-moz-opacity:0.8;
		-khtml-opacity: 0.8;
	}

/* 「キーワード」「製品名」「メーカー名」などのタイトル */
#content-in #search-form2 .title{
	margin: 0 0 10px 5px;
	font-size: 17px;
}
	/* 下段のタイトル */
	#content-in #search-form2 .title2{
		margin-top: 30px;
	}
/* キーワード一覧（大） */
#content-in #search-form2 .wordlist1 li{
	margin: 4px;
	padding: 10px 7px 8px 7px;
	border: 1px #605f5a solid;
	background: #fff;
	color: #000;
	line-height: 1em;
	font-size: 17px;
	display: inline-block;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	-o-border-radius: 2px;
	-ms-border-radius: 2px;
	background-image:-moz-linear-gradient(
	top,
	#ffffff 0%,
	#eeeeee);
	background-image:-webkit-gradient(
	linear,left top,left bottom,
	from(#ffffff),
	to(#eeeeee));
}
/* キーワード一覧（小） */
#content-in #search-form2 .wordlist2 li{
	margin: 4px;
	padding: 8px 8px 6px 8px;
	border: 1px #605f5a solid;
	background: #fff;
	color: #000;
	line-height: 1em;
	font-size: 13px;
	display: inline-block;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	-o-border-radius: 2px;
	-ms-border-radius: 2px;
	background-image:-moz-linear-gradient(
	top,
	#ffffff 0%,
	#eeeeee);
	background-image:-webkit-gradient(
	linear,left top,left bottom,
	from(#ffffff),
	to(#eeeeee));
}
/* キーワード一覧（大小兼用） */
#content-in #search-form2 .wordlist1 li:hover,
#content-in #search-form2 .wordlist2 li:hover{
	background: #e9ebf4;
	color: #292824;
	border-color: #263892;
	cursor: pointer;
}
#content-in #search-form2 .wordlist1 li.on,
#content-in #search-form2 .wordlist2 li.on{
	background: #263892;
	color: #fff;
	cursor: pointer;
}
	#content-in #search-form2 .wordlist1 li.on:hover,
	#content-in #search-form2 .wordlist2 li.on:hover{
		opacity:0.8;
		filter: alpha(opacity=80);
		-ms-filter: "alpha(opacity=80)";
		-moz-opacity:0.8;
		-khtml-opacity: 0.8;
	}

/* 製品名・メーカー名 頭文字 */
#content-in #search-form2 .wordlist3 li{
	margin: 4px 2px;
	border: 1px #000 solid;
	background: #fff;
	color: #000;
	line-height: 1em;
	font-size: 15px;
	text-align: center;
	display: inline-block;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	-o-border-radius: 2px;
	-ms-border-radius: 2px;
}
#content-in #search-form2 .wordlist3 li.on,
#content-in #search-form2 .wordlist3 li:hover{
	background: #cccccc;
	color: #999;
}
#content-in #search-form2 .wordlist3 li > *{
	display: block;
	padding: 6px 0 0 0;
	color: #173895;
	padding: 6px 0 0 0;
	width: 25px;
	height: 19px;
}
#content-in #search-form2 .wordlist3 li span{
	background: #ddd;
	color: #999;
}


/************************************************** 検索結果１ */

/* 検索フォーム下の▼ */
#content-in .down{
	margin: 10px;
	padding: 0;
	color: #263892;
	font-size: 30px;
	line-height: 1em;
	text-align: center;
}
/* 該当件数 */
#content-in #hitcount{
	padding: 22px;
	background: #e9ebf4;
	border: 1px #263892 solid;
	font-size: 20px;
	line-height: 1em;
	text-align: center;
}
	/* 数字 */
	#content-in #hitcount span{
		padding-top: 5px; /* 上部調整 */
		font-size: 35px;
		display: inline-block;
	}


/************************************************** 検索結果２ */

/* ページ内リンク */
#content-in .link-subcategory{
	margin-top: 30px;
	padding: 10px 0 0 20px;
	width: 960px;
	height: 41px;
	background: url(/common/img/background_category_sub_title.png) no-repeat;
	font-size: 15px;
}
#content-in .link-subcategory a{
	display: inline-block;
	padding: 0 30px 0 15px;
	background: url(/common/img/icon_down.png) left 6px no-repeat;
	background-size: 8px;
}

/* サブカテゴリタイトル */
#content-in .sub_category_title{
	margin-top: 40px;
	width: 960px;
	height: 42px;
	background: url(/common/img/background_subcategory_title.png) no-repeat;
	clear: both;
}
#content-in .sub_category_title div{
	padding: 8px 0 0 20px;
	font-size: 20px;
}

/* 製品名一覧・メーカー名一覧 */
#content-in .product-list{
	margin-top: 30px;
	clear: both;
}
#content-in .product-list .left{
	width: 450px;
	border-top: 2px #dadad1 solid;
	float: left;
}
#content-in .product-list .right{
	width: 450px;
	border-top: 2px #dadad1 solid;
	float: right;
}
#content-in .product-list li{
	height: 40px;
	border-bottom: 1px #dadad1 solid;
}
#content-in .product-list li:nth-child(even){
	background: #f7f7f6;
}
#content-in .product-list li span{
	padding-top: 10px;
	width: 40px;
	height: 30px;
	border-right: 1px #dadad1 dotted;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	display: inline-block;
}
#content-in .product-list li div,
#content-in .product-list li a{
	display: inline-block;
}
#content-in .product-list li div{
	padding-left: 10px;
	font-weight: bold;
}
#content-in .product-list li a{
	padding-left: 30px;
	background: url(/common/img/icn_arrow_r.png) 15px 5px no-repeat;
	background-size: 6px;
}


/* キーワードにマッチする製品・関連する事例、課題コンテンツ */
#content-in #match-product .box,
#content-in #match-product-task .box,
#content-in #match-product-case .box,
#content-in #match-theme-task .box,
#content-in #match-theme-case .box{
	margin: 20px 12px 0 0;
	width: 228px;
	min-height: 250px;
	border: 1px #e8e8da solid;
	float: left;
}
#content-in #match-product .box:nth-child(4n),
#content-in #match-product-task .box:nth-child(4n),
#content-in #match-product-case .box:nth-child(4n),
#content-in #match-theme-task .box:nth-child(4n),
#content-in #match-theme-case .box:nth-child(4n){
	margin: 20px 0 0 0;
}
#content-in .box .im {
    height: 128px;
}
#content-in #match-product .box .im {
   height: 84px;
}
#content-in #match-product .box .im,
#content-in #match-theme-task .box .im{
/*	padding: 8px;
    height: 96px;*/
	overflow: hidden;
	position: relative;
}
#content-in #match-product-task .box .im,
#content-in #match-product-case .box .im,
#content-in #match-theme-case .box .im{
/*	height: 109px;*/
	overflow: hidden;
	position: relative;
}
	#content-in #match-product .box .im .jirei,
	#content-in #match-product-task .box .im .jirei,
	#content-in #match-product-case .box .im .jirei,
	#content-in #match-theme-task .box .im .jirei,
	#content-in #match-theme-case .box .im .jirei,
	#content-in #match-product .box .im .kadai,
	#content-in #match-product-task .box .im .kadai,
	#content-in #match-product-case .box .im .kadai,
	#content-in #match-theme-task .box .im .kadai,
	#content-in #match-theme-case .box .im .kadai{
		padding: 3px 5px 1px 5px;
		background: #53a55c;
		color: #fff;
		font-size: 11px;
		border-radius: 2px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		position: absolute;
		top: 10px;
		left: 10px;
	}
	#content-in #match-product .box .im .kadai,
	#content-in #match-product-task .box .im .kadai,
	#content-in #match-product-case .box .im .kadai,
	#content-in #match-theme-task .box .im .kadai,
	#content-in #match-theme-case .box .im .kadai{
		background: #d86d2e;
	}
#content-in #match-product .box .im img,
#content-in #match-product-task .box .im img,
#content-in #match-product-case .box .im img,
#content-in #match-theme-task .box .im img,
#content-in #match-theme-case .box .im img{
	max-width: 100%;
	max-height: 100%;
}
#content-in #match-product .box .na,
#content-in #match-product-task .box .na,
#content-in #match-product-case .box .na,
#content-in #match-theme-task .box .na,
#content-in #match-theme-case .box .na{
	padding: 8px 8px 0 8px;
	font-size: 15px;
	word-break: break-all;
		height: 3.0em;
		overflow: hidden;
}
		/* 範囲を超過する文末に「…」を付ける */
		#content-in #match-product .box .na > span,
		#content-in #match-product-task .box .na > span,
		#content-in #match-product-case .box .na > span,
		#content-in #match-theme-task .box .na > span,
		#content-in #match-theme-case .box .na > span{
			font-size: 14px;
			line-height: 1.7;
			overflow: hidden;
			display: inline-block;
			position: relative;
			text-align: justify;
			text-justify: inter-ideograph;
		}
		#content-in #match-product .box .na > span:after,
		#content-in #match-product .box .na > span:before,
		#content-in #match-product-task .box .na > span:after,
		#content-in #match-product-task .box .na > span:before,
		#content-in #match-product-case .box .na > span:after,
		#content-in #match-product-case .box .na > span:before,
		#content-in #match-theme-task .box .na > span:after,
		#content-in #match-theme-task .box .na > span:before,
		#content-in #match-theme-case .box .na > span:after,
		#content-in #match-theme-case .box .na > span:before{
			background: #fff; /* 背景色 */
			position: absolute;
		}
		#content-in #match-product .box .na > span:before,
		#content-in #match-product-task .box .na > span:before,
		#content-in #match-product-case .box .na > span:before,
		#content-in #match-theme-task .box .na > span:before,
		#content-in #match-theme-case .box .na > span:before{
			content: "…";
			right: 0;
			top: 1.9em;
		}
		#content-in #match-product .box .na > span:after,
		#content-in #match-product-task .box .na > span:after,
		#content-in #match-product-case .box .na > span:after,
		#content-in #match-theme-task .box .na > span:after,
		#content-in #match-theme-case .box .na > span:after{
			content: "";
			height: 100%;
			width: 100%;
		}
		#content-in #match-product-case .box ,
		#content-in #match-theme-case .box {
			min-height: 200px;
		}
		#content-in #match-product-case .box .na,
		#content-in #match-theme-case .box .na{
			/* background: #e8e8da; */
			background: #eee;
			padding-bottom: 12px;
		}
		#content-in #match-product-case .box .na > span:before,
		#content-in #match-theme-case .box .na > span:before,
		#content-in #match-product-case .box .na > span:after,
		#content-in #match-theme-case .box .na > span:after{
			display:none;
		}

#content-in #match-product .box .di,
#content-in #match-product-task .box .di,
#content-in #match-product-case .box .di,
#content-in #match-theme-task .box .di,
#content-in #match-theme-case .box .di{
	padding: 8px 8px 12px 8px;
	word-break: break-all;
		height: 8.5em;
		overflow: hidden;
}
		/* 範囲を超過する文末に「…」を付ける */
		#content-in #match-product .box .di > span,
		#content-in #match-product-task .box .di > span,
		#content-in #match-product-case .box .di > span,
		#content-in #match-theme-task .box .di > span,
		#content-in #match-theme-case .box .di > span{
			font-size: 12px;
			line-height: 1.7;
			overflow: hidden;
			display: inline-block;
			position: relative;
			text-align: justify;
			text-justify: inter-ideograph;
		}
		#content-in #match-product .box .di > span:after,
		#content-in #match-product .box .di > span:before,
		#content-in #match-product-task .box .di > span:after,
		#content-in #match-product-task .box .di > span:before,
		#content-in #match-product-case .box .di > span:after,
		#content-in #match-product-case .box .di > span:before,
		#content-in #match-theme-task .box .di > span:after,
		#content-in #match-theme-task .box .di > span:before,
		#content-in #match-theme-case .box .di > span:after,
		#content-in #match-theme-case .box .di > span:before{
			background: #fff; /* 背景色 */
			position: absolute;
		}
		#content-in #match-product .box .di > span:before,
		#content-in #match-product-task .box .di > span:before,
		#content-in #match-product-case .box .di > span:before,
		#content-in #match-theme-task .box .di > span:before,
		#content-in #match-theme-case .box .di > span:before{
			content: "…";
			right: 0;
			top: 8.5em; /* 1.8 * 4em : line-heightの値 × (表示したい最大行数 - 1) */
		}
		#content-in #match-product .box .di > span:after,
		#content-in #match-product-task .box .di > span:after,
		#content-in #match-product-case .box .di > span:after,
		#content-in #match-theme-task .box .di > span:after,
		#content-in #match-theme-case .box .di > span:after{
			content: "";
			height: 100%;
			width: 100%;
		}
		#content-in #match-product-case .box .di ,
		#content-in #match-theme-case .box .di {
			height: 4em;
		}
		#content-in #match-product-case .box .di > span::before ,
		#content-in #match-theme-case .box .di > span::before {
			top: 3.5em;
		}

#content-in #match-product .box .ur,
#content-in #match-product-task .box .ur,
#content-in #match-product-case .box .ur,
#content-in #match-theme-task .box .ur,
#content-in #match-theme-case .box .ur{
	padding: 8px 8px 12px 8px;
	border-top: 1px #e8e8da dotted;
	font-size: 11px;
	word-break: break-all;
		height: 3.0em;
		overflow: hidden;
}
		/* 範囲を超過する文末に「…」を付ける */
		#content-in #match-product .box .ur > span,
		#content-in #match-product-task .box .ur > span,
		#content-in #match-product-case .box .ur > span,
		#content-in #match-theme-task .box .ur > span,
		#content-in #match-theme-case .box .ur > span{
			font-size: 12px;
			line-height: 1.7;
			overflow: hidden;
			display: inline-block;
			position: relative;
/* text-align: justify;
text-justify: inter-ideograph; */
		}
		#content-in #match-product .box .ur > span:after,
		#content-in #match-product .box .ur > span:before,
		#content-in #match-product-task .box .ur > span:after,
		#content-in #match-product-task .box .ur > span:before,
		#content-in #match-product-case .box .ur > span:after,
		#content-in #match-product-case .box .ur > span:before,
		#content-in #match-theme-task .box .ur > span:after,
		#content-in #match-theme-task .box .ur > span:before,
		#content-in #match-theme-case .box .ur > span:after,
		#content-in #match-theme-case .box .ur > span:before{
			background: #fff; /* 背景色 */
			position: absolute;
		}
		#content-in #match-product .box .ur > span:before,
		#content-in #match-product-task .box .ur > span:before,
		#content-in #match-product-case .box .ur > span:before,
		#content-in #match-theme-task .box .ur > span:before,
		#content-in #match-theme-case .box .ur > span:before{
			content: "…";
			right: 0;
			top: 7.2em; /* 1.8 * 4em : line-heightの値 × (表示したい最大行数 - 1) */
		}
		#content-in #match-product .box .ur > span:after,
		#content-in #match-product-task .box .ur > span:after,
		#content-in #match-product-case .box .ur > span:after,
		#content-in #match-theme-task .box .ur > span:after,
		#content-in #match-theme-case .box .ur > span:after{
			content: "";
			height: 100%;
			width: 100%;
		}

#content-in #match-product .box .ur a,
#content-in #match-product-task .box .ur a,
#content-in #match-product-case .box .ur a,
#content-in #match-theme-task .box .ur a,
#content-in #match-theme-case .box .ur a{
	margin-right: 10px;
}
/* 該当無しの場合 */
#content-in .nomatch{
	padding: 20px;
}





/* 製品名から探す */
#content-in .section_index{
	margin: 20px 0;
	padding: 0;
}
#content-in .section_index .item{
	margin: 0;
	width: 465px;
}
#content-in .section_index .item:nth-of-type(2){
	margin-left: 30px;
}

/* トップページに戻る */
#btn_returntop { position: fixed; right: 50%; bottom: 0; width: 914px; height: auto; margin-right: -457px; }
#btn_returntop img { display: block; max-width: 100%; }