@charset "UTF-8";

.catalogueList a {
	display: block;
	width: 100%;
	height: 100%;
}

.catalogueList a:hover{
	text-decoration: none;
}

/*mainvisual*/
.mv__wrapper {
	width: 100%;
	height: 200px;
	background-image: url('../img/bg_welding.jpg');
	background-size: cover;
	background-position: center top;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}

h1 {
	font-size: 40px;
}

h1,
.mv__wrapper span {
	letter-spacing: 4px;
	color: #fff;
	top: 45%;
	text-align: center;
}

.mv__wrapper span {
	font-size: 18px;
	margin-top: 80px;
	/*	position: absolute;
    top: 65%;
    left: 50%;
    transform: translateX(-50%);*/
}

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


h2 {
	font-size: 32px;
	font-weight: bold;
	letter-spacing: 1.6px;
	margin-top: 30px;
	margin-bottom: 60px;
	position: relative;
	text-align: center;
}

#welding h2 {
	color: #640000;
}

#chemical h2 {
	color: #000064;
}

h2 img {
	width: 25px;
	height: 25px;
	margin: 0 10px 8px 0;
}

.container--sub h2:after {
	content: "";
	width: 50px;
	border-bottom: 3px solid;
	position: absolute;
	left: 50%;
	bottom: -10px;
	transform: translateX(-50%);
}

.seachArea__wrapper {
	width: 96%;
	border: 1px solid #fff;
	margin: 0 auto 30px;
	padding: 30px 10px 0;
}

.seachArea__container {
	margin: 0 auto 20px;
	justify-content: center;
}

.seachArea__box {
	width: 25%;
	text-align: center;
}

.seachArea__box.length--longer {
	width: 50%;
}

/*.seachArea__box p { height: 35px; }*/
.seachArea__box p.exp {
	font-size: 14px;
}

.seachArea__box p.exp--smaller {
	font-size: 12px;
}

p.txt--upper {
	text-align: center;
}

.seachArea__container p.txt--upper {
	width: auto;
	display: inline-block;
	margin: 0 auto;
	color: red;
}

.seachArea__box:not(:last-child) {
	margin-right: 40px;
}

.seachArea__box select,
.seachArea__box input {
	width: 100%;
	height: 40px;
	border: solid 1px rgba(220, 221, 221, 1);
	border-radius: 4px;
	font-size: 16px;
}

.seachArea__box input {
	padding-left: 6px;
}

.seachArea__box input:focus {
	color: #212529;
}

.transcriptSearch .seachArea__box input::placeholder {
	color: #ff0000;
}

.transcriptSearch .seachArea__box input:-ms-input-placeholder {
	color: #ff0000;
}

select:disabled::-ms-value,
select:disabled::-ms-expand {
	color: #ddd;
}

#seachArea__box .txt--hidden {
	visibility: hidden;
}

.seachArea__btn__box {
	width: 230px;
	height: 30px;
	line-height: 30px;
	color: #fff;
	background: #666666;
	margin: 0 auto 30px;
	text-align: center;
}

#SearchResult .error {
	color: #ff0000;
}


#welding .seachArea__btn__box:hover {
	background: #640000;
}

#chemical .seachArea__btn__box:hover {
	background: #000064;
}

.seachArea__btn__box button {
	width: 100%;
	height: auto;
	padding: 0;
	border: none;
	background: transparent;
}

.seachArea__btn__box button:hover {
	cursor: pointer;
}

.seachArea__btn__box button:focus{
	outline: none;
}

.seachArea__btn__box #submit {
	color: #fff;
}

.seachArea__btn__box #result_all {
	color: #555;
}

.seachArea__btn__box #result_all:hover {
	color: #fff;
}

/*-------------------*/
/* itemList */
/*-------------------*/

.itemList__wrapper {
	max-width: 882px;
	min-height: 100px;
	background: #fff;
	border-bottom: 1px solid #828282;
	font-size: 14px;
	margin: 0 auto;
	position: relative;
}

.itemList__wrapper a:hover{
	text-decoration: none;
}

.itemList__wrapper dd {
	border-right: 1px solid #828282;
	margin: 0;
	position: relative;
	text-align: center;
}

.itemList__wrapper dd.inner--left img{
	width: 50px;
	margin: 0 10px;
}
.itemList__wrapper dd.inner--left p {
	width: calc(100% - 115px);
	margin: 0 30px 0 15px;
}

.itemList__wrapper dd.inner--left span {
	height: 100%;
}

.itemList__wrapper dd.inner--left span a,
.itemList__wrapper dd.inner--middle a{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-direction: row;
	flex-wrap: nowrap;
}

.inner--right ul {
	line-height: 3;
}

.itemList__wrapper dd img,
.itemList__wrapper dd p {
	display: inline-block;
}

.itemList__wrapper dd p {
	margin: 0;
}

.itemList__wrapper dl {
	margin-bottom: 0;
}

.itemList__wrapper dd.inner--left {
	width: 500px;
}

.itemList__wrapper dd.inner--middle {
	width: 140px;
	line-height: 100px;
}

.itemList__wrapper dd.inner--right {
	width: 242px;
	border-right: 2px solid #828282;
}

.itemList__wrapper dd.inner--left p:after,
.itemList__wrapper dd.inner--middle p:after,
.itemList__wrapper dd.inner--right li:after,
.catalogueList dd:after {
	content: "▶︎";
	color: #828282;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 10px;
}

.itemList__wrapper dd span {
	width: 100%;
	display: block;
	margin: 0 auto;
	text-align: left;
}

.inner--middle img,
.inner--right img {
	width: 20px;
}

.inner--middle img,
.inner--right img,
.documents__inner dd img {
	margin: 0 5px;
}

.inner--right ul {
	width: 100%;
	margin: 0 auto;
}

.inner--right li {
	text-align: left;
	position: relative;
	padding: 5px;
}

.inner--right ul li p {
	width: 72%;
	line-height: 1.5;
	word-break: break-all;
	word-wrap : break-word;
	overflow-wrap : break-word;
	vertical-align: middle;
}
@media (max-width: 320px) {
	.inner--right ul li p {
		width: calc(184/320 * 100vw);
	}
}

/*-------------------*/
/* itemList single   */
/*-------------------*/

.itemList__wrapper.isSingle {
	min-height: auto;
}

.itemList__wrapper.isSingle dl {
	border-bottom: 1px solid #828282
}

.itemList__wrapper.isSingle .inner--right ul,
.itemList__wrapper.isSingle dd {
	height: 60px;
	line-height: 60px;
	padding: 0 0 0 20px;
}

.itemList__wrapper.isSingle .itemList--head dd {
	background: rgb(247, 247, 247);
	padding: 0;
}

.itemList__wrapper.isSingle dd.inner--left p:after,
.itemList__wrapper.isSingle dd.inner--middle p:after,
.itemList__wrapper.isSingle dd.inner--right li:after {
	display: none;
}

/*-------------------*/
/* documentList */
/*-------------------*/

#documents__wrapper {
	max-width: 882px;
	margin: 0 auto;
}

#documents__wrapper.support {
	width: 95.5%;
	max-width: 670px;
}

.documents__inner {
	align-items: center;
	justify-content: center;
}

.documents__inner {
	margin-bottom: 5px;
}

.documents__inner dl:not(:last-child) {
	margin-bottom: 3px;
}

.documents__inner dd {
	width: 294px;
	height: 90px;
	line-height: 90px;
	align-items: center;
	background: #fff;
	justify-content: left;
	border-right: 1px solid #828282;
	border-bottom: 1px solid #828282;
	float: left;
	margin: 0;
	padding-left: 20px;
	position: relative;
}
.support .documents__inner dd {
	width: 32.835%;
}

.documents__inner dd img {
	width: 20px;
	height: 30px;
}

.support .documents__inner dd img {
	margin-right: 10px;
}

.documents__inner dd:after {
	content: "▶︎";
	color: #828282;
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
}


.documents__inner--single dd {
	width: 100%;
	height: 90px;
	align-items: center;
	background: #fff;
	justify-content: left;
	border-right: 1px solid #828282;
	border-bottom: 1px solid #828282;
	float: left;
	margin: 0;
	padding-left: 20px;
	position: relative;
}

.documents__inner--single dd img {
	width: 25px;
	position: absolute;
	right: 10px;
}










/*-------------------*/
/* button settings */
/*-------------------*/
.inquery__wrapper {
	font-size: 16px;
	margin: 70px 0;
	text-align: center;
}

.btn__inquery {
	width: 100%;
	max-width: 340px;
	height: 60px;
	line-height: 60px;
	color: #fff;
	margin: 0 auto;
	position: relative;
}

.btn__inquery:after,
.btn__bottom__box:after {
	content: "▶︎";
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
}

.btn__inquery:after {
	color: #fff
}

.btn__bottom__wrapper {
	align-items: center;
	justify-content: center;
	margin-top: 25px;
}

.btn__bottom__box {
	width: 340px;
	cursor: pointer;
	height: 50px;
	line-height: 50px;
	padding-left: 15px;
	position: relative;
	text-align: left;
}

.btn__bottom__box a:hover{
	text-decoration: none;
}

.btn__bottom__box:not(:last-child) {
	margin-right: 15px;
}

/*-------------------*/
/*tab area*/
/*-------------------*/
.tab__container {
	width: 100%;
	justify-content: center;
}

.tab__box {
	width: 490px;
	height: 42px;
	line-height: 42px;
	font-size: 18px;
	text-align: center;
}

.tab__box a:hover{
	text-decoration: none;
}

.tab__box.welding {
	color: #640000;
	background: #e6dcdc;
	border-bottom: 3px solid #000064;
}

.tab__box.chemical {
	color: #000064;
	background: #e5e6ef;
	border-bottom: 3px solid #640000;

}

.tab__box.isSelected {
	background: #000064;
	border-bottom: 3px solid transparent;
	color: #fff;
}

.tab__box.welding.isSelected {
	background: #640000;
}

.tab__box.chemical.isSelected {
	background: #000064;
}

/*-------------------*/
/*pager*/
/*-------------------*/
.pager__wrapper {
	width: 100%;
	margin-top: 30px;
}

.pager__container {
	align-items: center;
	justify-content: center;
}

.pager__container span{
	display: block;
	min-width: 30px;
	padding: 5px;
	text-align: center;
}

.pager__container li.selected {
	background: #c8c8c8;
}

.pager__container li:not(:last-child) {
	margin-right: 20px;
}

.pager__container a {
	min-width: 30px;
	padding: 5px;
	text-align: center;
}

.pager__container a:hover {
	background: #c8c8c8;
	text-decoration: none;
}




/*-------------------*/
/*pc only settings*/
/*-------------------*/

@media (min-width: 1021px) {

	.btn__inquery:hover {
		opacity: .9;
	}

	#welding .itemList__wrapper dd.inner--left a:hover,
	#welding .itemList__wrapper dd.inner--middle:hover,
	#welding .itemList__wrapper dd.inner--right li:hover,
	#welding .documents__inner dd:hover,
	#welding .btn__bottom__box:hover,
	.sds_welding .documents__inner--single dd ul:hover {
		background: #e6dcdc;
	}

	#chemical .itemList__wrapper .inner--middle:not(.spNone):hover,
	#chemical .itemList__wrapper .inner--right:not(.spNone):hover,
	#chemical .btn__bottom__box:hover,
	.sds_chemical .documents__inner--single:hover,
	#chemical .documents__inner--single dd:hover,
	.sds_chemical .documents__inner--single dd ul:hover {
		background: #e5f0f9;
	}

}

/*min-width: 1021px*/

/*-------------------*/
/*tablet settings*/
/*-------------------*/

@media (max-width: 1020px) {

	.itemList__wrapper.isSingle dd.inner--left {
		width: 50%;
	}

	.itemList__wrapper.isSingle dd.inner--middle,
	.itemList__wrapper.isSingle dd.inner--right {
		width: 25%;
	}

}

/*max-width: 1020px*/


/*-------------------*/
/*responsive settings*/
/*-------------------*/

@media (max-width: 980px) {

	.container--sub {
		width: 100%;
	}

	.documents__inner dd {
		width: 100%;
		border-right: 2px solid #828282;
		border-bottom: 2px solid #828282;
		float: none;
		margin: 0 0 5px;
	}
	.support .documents__inner dd {
		width: 100%;
	}

}

/*max-width: 980px*/

@media (max-width: 870px) {

	.seachArea__box:not(:last-child) {
		margin-right: 20px;
	}

	.itemList__wrapper dd.inner--left p,
	.itemList__wrapper dd.inner--middle p {
		left: 47%;
	}

}

/*max-width: 870px*/


@media (max-width: 767px) {

	h1 {
		width: 100%;
		font-size: 24px;
	}

	h2 {
		font-size: 20px;
	}

	.seachArea__container {
		align-items: center;
		flex-direction: column;
	}

	h3 {
		font-size: 18px;
	}

	.seachArea__box {
		width: 100%;
		margin-bottom: 2em;
		text-align: left;
	}

	.seachArea__box:not(:last-child) {
		margin-right: 0;
	}

	.seachArea__box h3,
	.seachArea__box p:not(:last-child) {
		display: inline-block;
	}

	.seachArea__box h3 {
		margin-right: 20px;
	}

	.seachArea__box p:not(:last-child) {
		font-size: 12px;
		margin-right: 20px;
	}

	.seachArea__box select,
	.seachArea__box input {
		height: 40px;
	}

	.seachArea__box h3,
	.seachArea__box p {
		margin-bottom: 0;
	}

	.seachArea__box p {
		height: 25px;
	}

	.itemList__wrapper:not(:last-child) {
		margin-bottom: 50px;
	}

	.itemList__wrapper .flex {
		display: block;
	}

	.itemList__wrapper dd {
		min-height: 80px;
		line-height: 1.4;
		border-bottom: 1px solid #828282;
		padding: 0;
		text-align: left;
	}

	.itemList__wrapper dd.inner--left,
	.itemList__wrapper dd.inner--middle,
	.itemList__wrapper dd.inner--right,
	.itemList__wrapper.isSingle dd.inner--left,
	.itemList__wrapper.isSingle dd.inner--middle,
	.itemList__wrapper.isSingle dd.inner--right,
	.inner--right ul {
		width: 100%;
	}

	.itemList__wrapper dd.inner--left,
	.itemList__wrapper dd.inner--middle {
		display: flex;
		align-items: center;
	}

	.itemList__wrapper dd.inner--left span {
		min-height: 80px;
	}

	.itemList__wrapper dd.inner--left {
		line-height: 1.4;
		display: -ms-grid;
		display: grid;
		-ms-flex-align: center;
		align-items: center;
	}

	.itemList__wrapper dd p {
		margin-bottom: 0;
	}

	.itemList__wrapper dd.inner--left p {
		margin-left: 10px;
	}

	.itemList__wrapper dd.inner--left p,
	.itemList__wrapper dd.inner--middle p {
		width: 70%;
		left: 0;
		transform: none;
	}

	.itemList__wrapper dd.inner--left img {
		margin-right: 0;
		margin-left: 10px;
	}

	.itemList__wrapper dd img,
	.itemList__wrapper dd p {
		vertical-align: middle;
	}

	.itemList__wrapper .img__pdf {
		margin: 0 25px 0 23.5px;
	}

	.inner--right li {
		height: 80px;
		min-height: 80px;
		line-height: 80px;
		border-bottom: 1px solid #828282;
		padding: 2px 5px 8px;
	}

	.itemList__wrapper dd.inner--right {
		border-right: 1px solid #828282;
	}

	.btn__bottom__wrapper {
		flex-direction: column;
	}

	.btn__bottom__box {
		width: 90%;
		font-size: 14px;
	}

	.btn__bottom__box:not(:last-child) {
		margin: 0 0 20px 0;
	}


	/*itemList single*/

	.itemList__wrapper.isSingle dl.itemList--head {
		display: none;
	}

	.itemList__wrapper.isSingle dd {
		padding: 0 0 0 1em;
	}

	#welding.sds .itemList__wrapper.isSingle .sds__box--pdf dd {
		padding: 0;
	}

	.itemList__wrapper.isSingle .inner--right ul {
		padding: 0;
	}

	.itemList__wrapper.isSingle .img__pdf {
		margin: 0;
	}

	#welding.sds .itemList__wrapper.isSingle .img__pdf {
		margin: 0;
	}

	#chemical.sds .itemList__wrapper.isSingle .img__pdf {
		margin: 0 20px 0 0;
	}


	.itemList__wrapper.isSingle .inner--right li {
		border-bottom: none;
	}


	.itemList__wrapper dd.inner--middle {
		height: 80px;
		line-height: 80px;
		padding-top: 0;
	}

	.pager__container li:not(:last-child) {
		margin-right: 10px;
	}

	.pager__container li:first-child,
	.pager__container li:last-child {
		width: auto;
		min-width: 42px;
	}

	.itemList__wrapper .inner--middle .img__pdf {
		margin: 0 25px 0 28px;
	}


}

/*max-width: 767px*/
