@charset "utf-8";

#wrapper{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 10px;
}

a.linkImportant {
    padding-left: 24px;
    background: url(/search-template/common/img/icon_list.png) no-repeat 5px center;
    -moz-background-size: 15px 15px;
    background-size: 15px 15px;
}

a.linkPdf {
    padding-left: 24px;
    background: url(/search-template/common/img/icon_pdf.png) no-repeat 5px center;
    -moz-background-size: 15px 15px;
    background-size: 15px 15px;
    letter-spacing: -0.08em;
}
a.linkSample, a.linkSample02, a.linkSample03 {
    padding-left: 24px;
    background: url(/search-template/common/img/icon_sample01.png) no-repeat 5px center;
    -moz-background-size: 18px 18px;
    background-size: 18px 18px;
    letter-spacing: -0.08em;
}

#contentsBox a:link {
    color: #25a;
    text-decoration: none;
}

#contentsBox a:visited {
    color: #258;
}

#contentsBox a:link,#contentsBox a{
        text-decoration: none;
}

#contentsBox a:hover {
    color: #09c;
    text-decoration: underline;
}

.b30 {
    margin-bottom: 30px!important;
}

table.ver1 {
    border: solid 1px #999;
    margin-bottom: 20px;
}

table.ver1 tr td {
    text-align: center;
}

.inlineTableSP {
    width: 100%;
}
/* CSS Document */
ul.arrowBox.arrowBox02.listSize06 li {
    width: 32.5%;
    margin-right: 1.25%;
    margin-bottom: 10px;
    display: flex;
    padding: 0px 0px;
}

ul.arrowBox.arrowBox02.listSize06 li:nth-child(3n) {
        margin-right: 0;
}

ul li.blue01 {
    background-color: #5283ad;
}

ul.arrowBox li {
    line-height: 1.1;
    display: inline-block;
    background: #aaa url(/search-template/common/img/arrow01.png) no-repeat left center;
}

/*----- arrowBox -------*/
 .blue01 .linkPdf{/*font-size: 12.7px;*/ height: 41px;}
 .blue01 .linkImportant{/*font-size: 12.7px;*/ height: 41px;}
 .white01 .linkSample{/*font-size: 11px;*/ height: 41px;}
 .white01 .linkSample02{/*font-size: 10.7px;*/ height: 41px;}
 /*.white01.samplekit02 {padding: 0px 0px 0px 32px !important;}*/

ul.arrowBox li {
	line-height: 1.1;
	display: inline-block;
	background: #aaa url(/search-template/common/img/arrow01.png) no-repeat left center;
	}
ul.cellBox {
	display: table;
	margin-bottom: 0 !important;
}
ul.blockBox li, ul.blockBox li a {
	width: 100%;
	}
ul.cellBox li, ul.cellBox li a {
	display: table-cell !important;
	vertical-align:middle;
	}
ul.arrowBox li a {
    display: flex;
    align-items: center;
	padding: 10px 8px 10px 15px;
	}

ul.arrowBox li a.linkPdf,
ul.arrowBox li a.linkZip,
ul.arrowBox li a.linkMovie,
ul.arrowBox li a.linkImportant {
	padding-left: 32px;
	background-position: 13px center;
	}
ul.arrowBox li a.linkPdf02 {
	padding-left: 35px;
	background-position: 13px center;
	}
ul.arrowBox li a.linkSample {
	padding:  4px 0;
	padding-left: 32px;
	background-position: 11px center;
	}
/*変更しました20200605　8pxから0px*/
ul.arrowBox li a.linkSample02 {
	padding:  9px 0px  9px 15px;
	padding-left: 32px;
	background-position: 11px center;
	}
ul.arrowBox li a.linkSample03 {
	padding:  9px 0px  9px 15px;
	padding-left: 32px;
	background-position: 11px center;
	}

ul.arrowBox li a span, ul.arrowBox2 li span {
	color: #fff !important;
	line-height: 1.4  !important;
	}
ul.arrowBox li a:hover {
	text-decoration: none !important;
	background-color: rgba(256,256,256,0.125);
	}
ul.arrowBox li:hover {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
	}
ul.test2 li {
	display: inline-block;
	padding: 20px 8px 20px 15px;
	background: #aaa url(/search-template/common/img/arrow01.png) no-repeat left center;
	}
ul.test2 li:hover {
	text-decoration: none !important;
	background-color: rgba(256,256,256,0.125);
	cursor: pointer;
	}

ul.arrowBox.arrowBox01 {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
	/*width: 750px;*/ max-width:750px; width:100%;
	margin: 0 -20px 20px 0;
	}
ul.arrowBox.arrowBox01 li {
    display: flex;
}
ul.arrowBox.arrowBox01.listSize01 li {
	/*-float: left;-*/
	width: 355px;
    /*max-width:355px; width:100%;*/
	margin: 0 20px 0 0; margin-bottom:10px;/*margin-bottom:10px;追加*/
	}
ul.arrowBox.arrowBox01.listSize01 li:nth-child(even) {margin-right:0;}
ul.arrowBox.b01 li {
	margin: 0 0 1px 0;
	}
ul.arrowBox.b10 li {
	margin: 0 0 10px 0;
	}
ul.arrowBox.b20 {
    margin: 10px 0;
	}
ul.arrowBox.arrowBox02 {
	width: 100%;
	margin: 0 -10px 20px 0;
	display:flex;
	flex-wrap:wrap;
	}
ul.arrowBox.arrowBox02.listSize02 li {
	float: left;
	width: 320px;
	margin: 0 10px 10px 0;
	}
ul.arrowBox.arrowBox02.listSize03 li {
	float: left;
	width: 485px;

	margin: 0 10px 10px 0;
	}
ul.arrowBox.arrowBox02.listSize04 li {
	float: left;
	width: 241px;
	margin: 0 5px 10px 0;
	}
ul.arrowBox.arrowBox05 li {
	width: 90px;
	display: block;
	padding: 3px 5px 3px 15px;
	margin-bottom: 0 !important;
	}
ul.arrowBox.arrowBox05 li:hover, ul.arrowBox.arrowBox05 li:hover {
	display: block;
	text-decoration: none !important;
	background-color: rgba(245,160,61,1) !important;
	}
ul.arrowBox.arrowBox05 li span, a ul.arrowBox.arrowBox05 li span {
	color: #fff;
	}

/*20200608padding足しました*/
.tightLetterSpacing {
    letter-spacing: -0.08em !important;
}
ul.arrowBox.arrowBox02.listSize06 li .linkPdf span {
    letter-spacing:0.001em
}
ul.arrowBox.arrowBox02.listSize06 li .linkSample span,
ul.arrowBox.arrowBox02.listSize06 li .linkSample02 span {
	color: #507fa9 !important;
	line-height: 1.4  !important;
	letter-spacing:0.001em
	}
ul.arrowBox.arrowBox02.listSize06 li .linkSample03 span {
	color: #507fa9 !important;
	line-height: 1.4  !important;
	letter-spacing:0.001em
	}
ul.arrowBox.arrowBox02.listSize04 li .linkSample span,
ul.arrowBox.arrowBox02.listSize04 li .linkSample02 span {
	color: #507fa9 !important;
	line-height: 1.1  !important;
	letter-spacing:0.001em
	}
ul.arrowBox.arrowBox02.listSize04 li .linkPdf02 span {
	letter-spacing:-0.03em
	}

ul li.purple01 {background-color: #a091af;}
ul li.blueGray01 {background-color: #8a99a9;}
ul li.brown01 {background-color: #986;}
ul li.blue01 {background-color: #5283ad;}
ul li.blue02 {background: #dff2fd url(/search-template/common/img/arrow06.png) no-repeat left center!important; font-weight: bold;}
ul li.blue03 {background-color: #5471a8;}
ul li.blue03_noArrow {background-color: #5471a8; background-image: none; padding 3px 40px;}
ul li.blue03_noArrow a {padding-left: 40px; padding-right: 40px;}
ul li.orange01 {background-color: #f18d18;/*- font-weight: bold;-*/}
ul li.red01 {background-color: #e35d5d;}
ul li.green01 {background-color: #5a6;}
ul li.white01 {background: #FFFFFF url(/search-template/common/img/arrow07.png) no-repeat left center; border:#5283ad 1px solid;}

ul.arrowBox.blockBox.arrowBox02.listSize03.clearfix.b00 li.purple01,
ul.arrowBox.blockBox.arrowBox02.listSize03.clearfix.b15 li.purple01{ background-color: #1caa7b;}



/* サブカテゴリ */
ul.type {
    margin-bottom: 20px;
    margin-right: -5px;
    overflow: hidden;
    max-width: 1180px;
    width: 100%;
}

ul.type li {
    width: 291px;
    margin-right: 1px;
    margin-bottom: 1px;
    display: inline-block;
    line-height: 1.2em;
    vertical-align: top;
}

ul.type li a {

    width: 265px;
    word-break: break-all;
    line-height: 1.2em;
    vertical-align: middle !important;
    border: solid 3px #a8c1d6;
    height: 4em;
    display: table-cell;
    padding: 0 10px;
    background: #fff/* url(/template/img/arrow_02.gif) 5px no-repeat*/;
    color: #258;
    box-sizing: content-box;
    word-break: normal;
}

ul.type li a:hover {
    width: 265px;
    line-height: 1.2em;
    vertical-align: middle !important;
    border: solid 3px #cde;
    height: 4em;
    display: table-cell;
    padding: 0 10px;
    background: #effaff;
}



/*メインコンテンツ*/
h5.readTitle01 {
    margin-bottom: 10px;
    padding: 5px 10px;
    background-color: #f1f1f1;
    font-weight: normal;
    font-size: 100%;
}

#headerWrapper h3.readTitle{ margin-left:10px; color:#666; margin-top:10px; display:inline;}
#headerWrapper h1.inlineTitle{ margin-left:10px; margin-bottom:0; display:inline; line-height:2.5em; font-weight: bold !important;}
h3.subTitle01 {
    color: #fff;
    margin-bottom: 10px;
    padding: 6px;
    background-color: #a86;
    font-weight: normal;
}
h2{font-weight: normal;}
ul.arrowBox.blockBox.b30 li.blue02{ background: none #fff !important}
ul.arrowBox.blockBox.b30 li.blue02 a{border-bottom: 1px dotted #81ABD1;display: inline-block;font-weight: bold;padding: 3px 5px 0px 25px; background:url(/search-template/common/img/icon_web_blank.gif) 0 center no-repeat;background-size: 17px 20px;}

table tr th, table tr td {
    border: solid 1px #CCC;
    padding: 5px;
    word-break: normal !important;
    line-height: 1.3em;
}
table.ver1 tr th {
    background: #369 !important;
    /*border: 3px double #C3D3E4;*/
    color: #fff;
    font-weight: bold;
    text-align: center;

    position: -webkit-sticky;
    position: sticky;
    top: -1px;
}

.spOnly {
    display: none;
}

/*table.ver1 tbody tr th { font-size: 85%;}
table.ver1 tbody tr td { font-size: 85%; font-weight: normal;}:*/

h2.text24.b10.btmSolidLine01{
    line-height: 1.5;
    padding-bottom: 0;
    margin-top: 30px;
    display: inline-block;
    font-size: 25px;}

ul.type {font-size: 0;}
ul.type li {font-size: 13px;}
ul.type li a {box-sizing: content-box; word-break: normal;}
.small {font-size:11px; line-height:1.4; display:block;}

ul.grade {width: 100%;display: flex; flex-wrap: wrap;}
ul.grade li{width:32.5%; margin-right:1.25%;border: solid 2px #a8c1d6 !important;background-color: #f6fbfd !important;line-height: 1.1;
    margin-bottom: 10px;
    vertical-align: middle;
    display: inline-block;}
ul.grade li a {
    width: 100%;
    display: block;
    border: none !important;
    height: 100%;
    padding: 5px;
    font-weight: bold;
    vertical-align: middle;
    color: #bfa12f;
}
ul.grade li:nth-child(3n) {margin-right:0;}

ul.grade li a:hover {
    background-color: #fff;
}

ul.marginBtn {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}
ul.marginBtn li{
    margin-right: 1.25%;
    margin-bottom: 10px;
    vertical-align: middle;
    }
ul.marginBtn li a {
    border: solid 2px #a3a3a3 !important;background-color: #faf9eb !important;line-height: 1.5;
    display: inline-block;
    height: 100%;
    padding: 7px 5px;
    font-weight: bold;
    vertical-align: middle;
        text-align: left;
    min-width: 33%;
}
ul.marginBtn li:nth-child(3n) {margin-right:0;}

ul.marginBtn li a:hover {
    background-color: #fff;
}
.link_icon {
    vertical-align: sub !important;
    height: 20px;
    margin-right: 5px;
}
li.rightBox {
    text-align: left;
}

ul.marginBtn li a span.pad20::before{
    content: "";
    display: inline-block;
    background: url(/system/files/general_mega_selectionguide.png) no-repeat;
    background-size: contain;
    height: 20px;
    width: 40px;
    vertical-align: bottom;
    padding-left: 5px;
}

/*
ul.marginBtn li a span.new::after{
    content: "";
    display: inline-block;
    background: url(/ja/system/files/ico_new_s.png) no-repeat;
    background-size: contain;
    height: 18px;
    width: 72px;
    vertical-align: sub;
}

ul.marginBtn li a span.update::after{
    content: "";
    display: inline-block;
    background: url(/ja/system/files/ico_update_s.png) no-repeat;
    background-size: contain;
    height: 18px;
    width: 72px;
    vertical-align: sub;
}
*/
span.icon_new{
    display: inline-block;
    margin-left: 5px;
    padding: 0px 20px;
    font-weight: bold;
    font-family: Arial, Helvetica, "sans-serif";
    font-size: 15px;
    color: #fff;
    background: #ff6633;
}

span.icon_update{
    display: inline-block;
    margin-left: 5px;
    padding: 0px 12px;
    font-weight: bold;
    font-family: Arial, Helvetica, "sans-serif";
    font-size: 15px;
    color: #fff;
    background: #3399ff;
}

.marginBtn .rightBox a.btn01{
    color: #000!important;
}

/* テーブルにセル結合が含まれる方を表示させる */
.noCatalogSP {display: table;}
.catalogSP {display: none;}

@media screen and (max-width: 640px) {
/*table td.spOnly {display:table-cell !important;}*/
ul.arrowBox.arrowBox02,ul.arrowBox.arrowBox02.listSize04 li,
ul.type, ul.type li,ul.type li a,
ul.grade, ul.grade li {width:100%;}

ul.type, ul.type li {margin-right:0;}
ul.type li a {display:block; box-sizing:border-box; height: auto; padding:10px 5px;}
ul.type li a:hover{ width:100%; border: solid 3px #cde; height:auto; display: block; padding:10px 5px; background:#effaff}

/*1カラムの場合*/
ul.grade li{width:100%; margin-right:0 !important;}
ul.grade li a {width:100%; display:block;border:none !important;background-color:none !important; height:100%;}

.table_complex {width: 100%; overflow-x: auto; position: relative;}
table.inlineTableSP tr td a img {margin-right:5px;}

ul.arrowBox.arrowBox02.listSize06 li {width:100%; margin-right: 0;}

ul.arrowBox li a.linkSample02 {padding:10px 1px 10px 35px !important;}

    li.rightBox {
    text-align: right;
}
    ul.marginBtn li{
        width: 100%;
        margin-right: 0;
    }
    ul.marginBtn li a {
width: 100%;
}
}

@media screen and (min-width: 640px) and (max-width: 999px) {
#headerWrapper {padding:0 2%;}
#contentsBox {padding:0;}
table.inlineTableSP{ overflow-x: visible}
ul.arrowBox.arrowBox02 {width:100%;}
ul.arrowBox.arrowBox02.listSize04 li {width:49%; margin-right:2%; padding-top:0; padding-bottom:0;height:auto;}
ul.arrowBox.arrowBox02.listSize04 li:nth-child(even) {margin-right:0;}
ul.arrowBox.arrowBox02.listSize04 li a {width:50%; max-width:50%; padding:0 0 0 32px; display:table-cell !important; vertical-align:middle;height:40px;}
ul.arrowBox.arrowBox02.listSize04 li.white01 a {padding:0 0 0 32px; height:38px;}

ul.type li,ul.type li a,ul.type li a:hover {width: 33.2%;}
ul.type li {margin-right:0.2%;}
ul.type li a {width:1% !important;}
ul.type li:nth-child(3n) {margin-right:0;}

ul.grade {width:100%;display: flex;flex-wrap: wrap;}
ul.grade li{width:49%; margin-right:2%;}
ul.grade li a {width:100%; display:block;border:none !important;background-color:none !important; height:100%;}
ul.grade li:nth-child(3n) {margin-right:2%}
ul.grade li:nth-child(even) {margin-right:0;}

ul.arrowBox.arrowBox02.listSize06 li {width:49%; margin-right: 2%;}
ul.arrowBox.arrowBox02.listSize06 li:nth-child(3n) {margin-right: 2%;}
ul.arrowBox.arrowBox02.listSize06 li:nth-child(even) {margin-right:0;}
}

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

table

---------------------------*/
table.table_result {width:100%; min-width:100%;}
/* td::before { font-family:Arial,sans-serif; color: #000;} */
html[lang="en"] td::before {
    font-family: 'Noto Sans', sans-serif; color: #000;
}
html[lang="ja"] td::before {
    font-family: 'Noto Sans JP', sans-serif; color: #000;
}
html[lang="zh-hans"] td::before {
    font-family: 'Noto Sans SC', sans-serif; color: #000;
}
html[lang="de"] td::before {
    font-family: 'Noto Sans', sans-serif; color: #000;
}
table.inlineTableSP tr td.doc_icon img {width:15px;height:15px;}
.table_complex .arrow { display:none !important;}
table.inlineTableSP tr th, table.inlineTableSP tr td {word-wrap: break-word !important; overflow-wrap: break-word !important;word-break:normal !important;}
table.inlineTableSP tr td span.desc_text {text-align: left; float: left;}
@media screen and (max-width: 640px) {
#result_table {width: 100%;border-collapse: collapse;}
table.inlineTableSP {min-width: 100%;}
table.inlineTableSP thead,.arrow {display:none;}
table.inlineTableSP tr {position:relative;border-bottom:1px solid #ccc; padding:10px 0;display:block; min-height:120px; box-sizing:border-box;}
table.inlineTableSP tr th, table.inlineTableSP tr td {padding:0 !important;}
table.inlineTableSP tr:first-child {border-top:1px solid #ccc; }
table.inlineTableSP tr:hover {background:none !important;}
table.inlineTableSP tr td{width: auto;vertical-align: middle;padding: 0;white-space: nowrap; box-sizing:border-box; text-align:left;display:inline-block;}
table.inlineTableSP tr th, table tr.tr_odd_bg_color {background:none !important;}
table.inlineTableSP tr th, table.inlineTableSP tr td {border:none; background:none !important;}
table.inlineTableSP tr td br {content: " ";}
table.inlineTableSP tr td br::after {content: "  ";}


/*追加*/
table.inlineTableSP { border:none;}
table.inlineTableSP tr td a span { text-decoration:underline; color: #258;}
.table_complex table  {width:100% !important;}

table.inlineTableSP tr td {vertical-align: top; display:block;;white-space: normal;}
table.inlineTableSP tr td.hide {display: none;}

/*for catalog*/
table.inlineTableSP tr td::before {content:attr(data-label)' : ';}
table.inlineTableSP tr td span {border:none !important; background:none !important;color: #000;padding: 0;width: auto !important;margin: auto;text-align: left;min-width: inherit; font-size: 13px;}
table.inlineTableSP tr td span.desc_text {float:none;}
table.inlineTableSP tr td:nth-child(n+2) {margin-left:80px;border-bottom: 1px dotted #ccc; padding: 3px 0 !important;}
table.inlineTableSP tr td div {display:inline;}
table.inlineTableSP tr td a {display:inline-block; padding-right:10px;}
/*Product Image*/
table.inlineTableSP tr td[data-label = "Product Image"]::before,
table.inlineTableSP tr td[data-label = "製品写真"]::before,
table.inlineTableSP tr td[data-label = "产品照片"]::before {content:"";}

table.inlineTableSP tr td[data-label = "Product Image"],
table.inlineTableSP tr td[data-label = "製品写真"],
table.inlineTableSP tr td[data-label = "产品照片"] {margin:0 10px 10px 0; width: 60px;position: absolute; left: 0; top: 20px;}
/*Part No. Lists*/
table.inlineTableSP tr td[data-label = "Part No. Lists"]::after,
table.inlineTableSP tr td[data-label = "品番リスト"]::after,
table.inlineTableSP tr td[data-label = "型号列表"]::after {content:"";}

/* テーブルにセル結合が含まれるため、セル結合がないテーブルを表示させる */
.noCatalogSP {display: none;}
.catalogSP {display: table;}

}


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

catalogtop

---------------------------*/
.portal {display: flex; justify-content: space-between;align-items: center;flex-wrap: wrap;}
.portal li {width:33%; border: 1px solid #ccc; background: #f5f6f8; margin-bottom:5px;}
.portal li:nth-child(even){background: #ecf1f5;}
.portal li:hover {border-color: #2256ac; background: #fff;}
.portal li a {display:block;}
.portal li a img{float: left;margin-right: 5px;display: inline;}
.portal li a span {height: 60px;display: table-cell;vertical-align: middle;line-height: 1.4;}
.portal::after{content:"";display: block;width:33%;}

@media screen and (max-width: 640px) {
.portal li {width:100%;}
h2.text24.b10.btmSolidLine01{ border: none; margin-bottom: 0 !important}
}
.apps img {
    display: none !important;
}
@media screen and (min-width: 640px) and (max-width: 979px) {
.portal li {width:49.5%;}
.portal::after{width:49.5%;}
}