@charset "utf-8";
/* CSS Document */


/*PC*/
@media print, screen and (min-width: 600px) {




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

 header

----------------------------------------------------*/
.hedImg { width: 100%; height: 240px; background: url(../images/original_product/oem/hedImg.jpg) center center no-repeat; background-size: cover; margin: 0 auto 0; text-align: center; color: #FFF; padding: 60px 0 0; box-sizing: border-box;}
.hedImg h2 { width: 100%; font-size: 66px; font-family:Arial, Helvetica, sans-serif;}
.hedImg p { width: 100%; font-size: 20px;}

.navBg ul li:nth-of-type(3) a { color: #eb6100;}


.bg01 {
}
	
.bg02 {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f6f9fa+0,dde8e9+100 */
background: rgb(246,249,250); /* Old browsers */
background: -moz-linear-gradient(top, rgb(246,249,250) 0%, rgb(221,232,233) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgb(246,249,250) 0%,rgb(221,232,233) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgb(246,249,250) 0%,rgb(221,232,233) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f9fa', endColorstr='#dde8e9',GradientType=0 ); /* IE6-9 */
}





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

 nav

----------------------------------------------------*/
.nav { width: 660px; margin: -40px auto auto;}
.nav ul { width: 100%; margin: 0; padding: 0; list-style: none; overflow: hidden; font-size: 12px;}
.nav ul li { width: 165px; float: left;}
.nav ul li a { display: block; width: 165px; height: 40px; border-radius: 10px 10px 0 0; background: #c9c9ca; color: #000; text-align: center; text-decoration: none; line-height: 40px;}
.nav ul li a.select,
.nav ul li a:hover { background: #FFF; color: #eb6100;}



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

 sec01

----------------------------------------------------*/
.sec01 { padding: 50px 0; margin: 0;}
.sec01 h3 { font-size: 36px; color: #6a3906; text-align: center; margin: 0 0 50px;}
.sec01 .box01 { margin: 0 0 50px; padding: 0; overflow: hidden;}
.sec01 .box01 .box01L { float: left;}
.sec01 .box01 .box01L p { margin: 0 0 15px; padding: 0; font-size: 24px; color: #eb6100;}
.sec01 .box01 .box01L ul { margin: 0; padding: 0; list-style: none;}
.sec01 .box01 .box01L ul li {}
.sec01 .box01 .box01L ul li::before { content: "●"; color: #eb6100;}
.sec01 .box01 .box01R { float: right;}

.sec01 .box02 { margin: 0 0 50px; padding: 0; text-align: center;}
.sec01 .box02 ul { margin: 0 auto 0; padding: 0; text-align: center; list-style: none; overflow: hidden; width: 964px;}
.sec01 .box02 ul li { float: left; margin: 0 122px 40px 0; padding: 0; width: 240px; background: #FFF;}
.sec01 .box02 ul li:nth-child(3n+3) { margin: 0 0 0 0;}
.sec01 .box02 ul li img { width: 100%; height: auto;}
.sec01 .box02 ul li h5 { color: #eb6100; margin: 10px 0 10px; font-size: 18px;}
.sec01 .box02 ul li p:nth-of-type(1) { margin: 0 0 30px; padding: 5px; font-size: 14px;}
.sec01 .box02 ul li p:nth-of-type(2) { text-align: left; padding: 5px; font-size: 14px;}

.sec01 .subttl { text-align: center; margin: 0 auto 30px; max-width: 500px;}
.sec01 .subttl h4 { margin: 0 auto 10px; padding: 0 0 5px; font-size: 24px; width: 100%; border-bottom: solid 1px #000;}






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

 sec02

----------------------------------------------------*/
.sec02 { padding: 50px 0; margin: 0;}
.sec02 h3 { font-size: 36px; color: #6a3906; text-align: center; margin: 0 0 50px;}
.sec02 .box01 { margin: 0 0 50px; padding: 0; overflow: hidden;}
.sec02 .box01 .box01L { float: left;}
.sec02 .box01 .box01L p:nth-of-type(1) { margin: 0 0 15px; padding: 0; font-size: 24px; color: #eb6100;}
.sec02 .box01 .box01L p:nth-of-type(2) { margin: 0 0 15px; padding: 0; font-size: 13px; color: #000;}
.sec02 .box01 .box01R { float: right;}

.sec02 .box02 { margin: 0 0 50px; padding: 0; text-align: center;}
.sec02 .box02 ul { margin: 0 auto 0; padding: 0; text-align: center; list-style: none; overflow: hidden; width: 964px;}
.sec02 .box02 ul li { float: left; margin: 0 122px 40px 0; padding: 0; width: 240px; background: #FFF;}
.sec02 .box02 ul li:nth-child(3n+3) { margin: 0 0 40px 0;}
.sec02 .box02 ul li img { width: 100%; height: auto;}
.sec02 .box02 ul li h5 { color: #eb6100; margin: 10px 0 10px; font-size: 18px;}
.sec02 .box02 ul li p:nth-of-type(1) { margin: 0 0 0; padding: 5px; font-size: 14px;}

.sec02 .subttl { text-align: center; margin: 0 auto 30px; max-width: 500px;}
.sec02 .subttl h4 { margin: 0 auto 10px; padding: 0 0 5px; font-size: 24px; width: 100%; border-bottom: solid 1px #000;}






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

 sec03

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





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

 sec04

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





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

 sec05

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







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

追加 2022

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


/*
-----------------------------------------------
flex
----------------------------------------------- */

.w_normal{
width:1080px !important;
margin-left:auto;
margin-right:auto;
}

.container01{
display:flex;
flex-wrap:wrap;
}

.container02{
display:flex;
flex-wrap:nowrap;
}

.container03{
display:flex;
flex-wrap:wrap-reverse;
}

.al-item01{
align-items:flex-end
}

.c-type01{
justify-content:space-between;
}

.c-type02{
justify-content:space-around;
}

.c-type03{
justify-content:flex-start;
}

.c-type04{
justify-content:center;
}

.mx-img{
width:auto !important;
height:auto !important;
max-width:100% !important;
}

.img100{
width:100%;
height:auto;
}

.tac-all{
text-align:center;
}

.pt10{padding-top:10px;}
.pt80{padding-top:80px;}
.mb80{margin-bottom:80px;}
.mb20{margin-bottom:20px;}
.mb30{margin-bottom:30px;}
.mb10{margin-bottom:10px;}

.con01{
padding-top:70px;
padding-left:6%;
padding-right:6%;
padding-bottom:70px;
}

.con02{
padding-left:2%;
padding-right:2%;
padding-bottom:30px;
padding-top:30px;
}

.con03{
padding-top:80px;
}

.con04{
padding-left:7%;
padding-right:7%;
padding-bottom:70px;
padding-top:50px;
}

.con05{
padding-top:80px;
padding-bottom:30px;
}

.con06{
padding-top:30px;
padding-bottom:60px;
}

.con07{
padding-top:60px;
padding-bottom:30px;
}

.tool01{
width:46%;
}

.tool01 p{
font-size:17px;
line-height:1.9;
}

.tool01 h4{
font-size:20px;
border-bottom:solid 1px;
margin-bottom:26px;
display:inline-block;
}

.tool02{
width:35%;
}

.tool02 p{
font-size:26px;
margin-top:40px;
line-height:1.9;
}

.tool03{
width:64%;
}



.bg-color01{
background:#eeefef;
}

.bg-color02{
background:#262c34;
}


.bb{
box-sizing:border-box;
margin:0;
padding:0;
border:0;
outline:0;
font-style:normal;
word-break:normal;
word-wrap:break-word;
}

.tool_step dl{
width:23%;
margin-right:2%;
margin-bottom:30px;
}

.tool_step dl{
width:23%;
margin-right:2%;
}

.tool_step dl dd{
text-align:center;
}

.tool_step dl:nth-of-type(4){
margin-right:0;
}

.tool_maru{
display:inline-block;
border-radius:50px;
border:solid 1px #666;
height:50px;
line-height:50px;
padding-left:30px;
padding-right:30px;
font-size:18px;
}

.video {
  width: 100%;
  position: relative;
  padding-top: 56.25%;
}

.video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.con06 dl{
margin-top:0 !important;
margin-bottom:0 !important;
}

.con06 dl dt{
background:#000;
color:#fff;
padding:8px;
font-size:18px;
}

.con06 dl dd{
border:solid 1px;
padding:10px;
}

.con06 dl dd span{
color:#878788 !important;
font-size:21px !important;
font-weight:bold !important;
}



.tool_parts dl{
width:30%;
margin-right:5%;
margin-bottom:30px;
}

.tool_parts dl dd{
text-align:center;
}

.tool_parts dl:nth-of-type(3){
margin-right:0;
}

.tool_parts dl{
font-size:18px;
}

.tool_parts dl span{
display:block;
color:#878788;
font-weight:bold;
}

.con03 h3 {
  font-size:26px;
  color:#717071;
  position: relative;
  display: inline-block;
  margin-bottom: 50px;
}
.con03 h3:before {
  content: '';
  position: absolute;
  bottom: -15px;
  display: inline-block;
  width: 160px;
  height: 3px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #717071;
  border-radius: 2px;
}




.con04 h3 {
  font-size:26px;
  color:#fff;
  position: relative;
  display: inline-block;
  margin-bottom: 50px;
}
.con04 h3:before {
  content: '';
  position: absolute;
  bottom: -15px;
  display: inline-block;
  width: 60px;
  height: 3px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #fff;
  border-radius: 2px;
}

.sponly{
display:none;
}




}



/*sp*/
@media only screen and (max-width: 599px) {


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

 header

----------------------------------------------------*/
.hedImg { width: 100%; height: 180px; background: url(../images/original_product/oem/hedImg.jpg) center center no-repeat; background-size: cover; margin: 0 auto 0; text-align: center; color: #FFF; padding: 30px 0 0; box-sizing: border-box;}
.hedImg h2 { width: 100%; font-size: 30px; font-family:Arial, Helvetica, sans-serif;}
.hedImg p { width: 100%; font-size: 18px;}

.navBg ul li:nth-of-type(3) a { color: #eb6100;}


.bg01 {
}
	
.bg02 {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f6f9fa+0,dde8e9+100 */
background: rgb(246,249,250); /* Old browsers */
background: -moz-linear-gradient(top, rgb(246,249,250) 0%, rgb(221,232,233) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgb(246,249,250) 0%,rgb(221,232,233) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgb(246,249,250) 0%,rgb(221,232,233) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f9fa', endColorstr='#dde8e9',GradientType=0 ); /* IE6-9 */
}





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

 nav

----------------------------------------------------*/
.nav { width: 100%; margin: 0px auto auto;}
.nav ul { width: 104%; margin: 0 auto 0 -2%; padding: 10px 0 0; list-style: none; overflow: hidden; font-size: 11px;}
.nav ul li { width: auto; float: left; box-sizing: border-box; border: solid 1px #999; -webkit-transform: skew(-20deg); -moz-transform: skew(-20deg); -o-transform: skew(-20deg);}
.nav ul li a { display: block; width: 100%; height: 40px; border-radius: 0 0 0 0; color: #000; text-align: center; text-decoration: none; line-height: 40px; -webkit-transform: skew(20deg); -moz-transform: skew(20deg); -o-transform: skew(20deg);}
.nav ul li a.select,
.nav ul li a:hover { color: #eb6100;}

/* .nav ul li:nth-of-type(1) { width: 39%; margin-right: 1%;}
.nav ul li:nth-of-type(2) { width: 29%; margin-right: 1%;}
.nav ul li:nth-of-type(3) { width: 30%;} */


.nav ul li:nth-of-type(1) { width: 32%; margin-right: 1%;font-size:9px !important}
.nav ul li:nth-of-type(2) { width: 23%; margin-right: 1%;font-size:9px !important}
.nav ul li:nth-of-type(3) { width: 23%; margin-right: 1%;font-size:9px !important}
.nav ul li:nth-of-type(4) { width: 19%;font-size:9px !important}



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

 sec01

----------------------------------------------------*/
.sec01 { padding: 30px 0 0; margin: 0;}
.sec01 h3 { font-size: 26px; color: #6a3906; text-align: center; margin: 0 0 20px;}
.sec01 .box01 { margin: 0 0 50px; padding: 0; overflow: hidden;}
.sec01 .box01 .box01L { width:94%; margin:0 auto;}
.sec01 .box01 .box01L p { margin: 0 0 15px; padding: 0; font-size: 18px; color: #eb6100;}
.sec01 .box01 .box01L ul { margin: 0 0 20px; padding: 0; list-style: none;}
.sec01 .box01 .box01L ul li {}
.sec01 .box01 .box01L ul li::before { content: "●"; color: #eb6100;}
.sec01 .box01 .box01R { width:94%; margin:0 auto;}
.sec01 .box01 .box01R img { width:100%; height:auto;} 

.sec01 .box02 { width:94%; margin: 0 auto 30px; padding: 0; text-align: center;}
.sec01 .box02 ul { margin: 0 auto 0; padding: 0; text-align: center; list-style: none; overflow: hidden; width: 94%;}
.sec01 .box02 ul li { margin:0 auto 30px; padding: 0; width: 100%; background: #FFF;}
.sec01 .box02 ul li:nth-child(3n+3) { margin: 0 0 0 0;}
.sec01 .box02 ul li img { width: 100%; height: auto;}
.sec01 .box02 ul li h5 { color: #eb6100; margin: 0; font-size: 16px;}
.sec01 .box02 ul li p { margin: 0 0 10px; padding: 5px; font-size: 12px;}

.sec01 .subttl { text-align: center; margin: 0 auto 30px; max-width: 500px;}
.sec01 .subttl h4 { margin: 0 auto 10px; padding: 0 0 5px; font-size: 18px; width: 100%; border-bottom: solid 1px #000;}






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

 sec02

----------------------------------------------------*/
.sec02 { padding: 30px 0; margin: 0;}
.sec02 h3 { font-size: 26px; color: #6a3906; text-align: center; margin: 0 0 20px;}
.sec02 .box01 { width:94%; margin: 0 auto 50px; padding: 0; overflow: hidden;}
.sec02 .box01 .box01L { float: left;}
.sec02 .box01 .box01L p:nth-of-type(1) { margin: 0 0 15px; padding: 0; font-size: 18px; color: #eb6100;}
.sec02 .box01 .box01L p:nth-of-type(2) { margin: 0 0 15px; padding: 0; font-size: 12px; color: #000;}
.sec02 .box01 .box01R { width:94%; margin:0 auto;}
.sec02 .box01 .box01R img { width:100%; height:auto;} 

.sec02 .box02 { width:94%; margin: 0 auto 50px; padding: 0; text-align: center;}
.sec02 .box02 ul { margin: 0 auto 40px; padding: 0; text-align: center; list-style: none; overflow: hidden; width: 94%;}
.sec02 .box02 ul li { margin:0 auto 30px; padding: 0; width: 100%; background: #FFF;}
.sec02 .box02 ul li:nth-child(3n+3) { margin: 0 0 0 0;}
.sec02 .box02 ul li img { width: 100%; height: auto;}
.sec02 .box02 ul li h5 { color: #eb6100; margin: 0; font-size: 16px;}
.sec02 .box02 ul li p { margin: 0 0 10px; padding: 5px; font-size: 12px;}

.sec02 .subttl { text-align: center; margin: 0 auto 30px; max-width: 500px;}
.sec02 .subttl h4 { margin: 0 auto 10px; padding: 0 0 5px; font-size: 18px; width: 100%; border-bottom: solid 1px #000;}







.container01{
display:flex;
flex-wrap:wrap;
}

.container02{
display:flex;
flex-wrap:nowrap;
}

.container03{
display:flex;
flex-wrap:wrap-reverse;
}

.al-item01{
align-items:flex-end
}

.c-type01{
justify-content:space-between;
}

.c-type02{
justify-content:space-around;
}

.c-type03{
justify-content:flex-start;
}

.c-type04{
justify-content:center;
}

.mx-img{
width:auto !important;
height:auto !important;
max-width:100% !important;
}

.img100{
width:100%;
height:auto;
}

.tac-all{
text-align:center;
}

.pt10{padding-top:10px;}
.pt80{padding-top:40px;}
.mb80{margin-bottom:30px !important;}
.mb20{margin-bottom:20px;}
.mb30{margin-bottom:30px;}
.mb10{margin-bottom:10px;}


.con01{
padding-top:30px;
padding-left:25px;
padding-right:25px;
padding-bottom:30px;
}

.con02,
.con04,
.con05,
.con06,
.con07{
padding-left:20px;
padding-right:20px;
padding-bottom:25px;
padding-top:25px;
}

.con03{
padding-left:20px;
padding-right:20px;
padding-top:25px;
}

.tool01{
width:100% !important;
}

.w_normal{
width:100% !important;
}

.con01 img{
width:80% !important;
height:auto;
margin-left:10% !important;
}


.tool01 p{
font-size:16px;
line-height:1.9;
}

.tool01 h4{
margin-top:25px;
font-size:18px;
border-bottom:solid 1px;
margin-bottom:15px;
display:inline-block;
}

.bg-color01{
background:#eeefef !important;
}


.bg-color02{
background:#262c34;
}


.tool02{
width:100% !important;
}

.tool02 p{
text-align:center;
font-size:19px;
margin-top:0px;
line-height:1.7;
}

.tool03{
width:100% !important;
}


.con03 h3 {
  font-size:20px;
  color:#717071;
  position: relative;
  display: inline-block;
  margin-bottom: 20px;
}
.con03 h3:before {
  content: '';
  position: absolute;
  bottom: -15px;
  display: inline-block;
  width: 160px;
  height: 3px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #717071;
  border-radius: 2px;
}


.tool_step dl{
width:48%;
margin-right:4%;
margin-bottom:20px;
}

.tool_step dl dd{
text-align:center;
font-size:14px;
}

.tool_step dl:nth-of-type(2n){
margin-right:0;
}


.tool_maru{
display:inline-block;
border-radius:50px;
border:solid 1px #666;
padding:10px 20px;
font-size:15px;
}


.con04 h3 {
  font-size:20px;
  color:#fff;
  position: relative;
  display: inline-block;
  margin-bottom: 30px;
}
.con04 h3:before {
  content: '';
  position: absolute;
  bottom: -15px;
  display: inline-block;
  width: 60px;
  height: 3px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #fff;
  border-radius: 2px;
}



.video {
  width: 100%;
  position: relative;
  padding-top: 56.25%;
}

.video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.con06 dl{
margin-top:0 !important;
margin-bottom:0 !important;
}

.con06 dl dt{
background:#000;
color:#fff;
padding:8px;
font-size:15px;
}

.con06 dl dd{
font-size:13px;
border:solid 1px;
padding:7px;
}

.con06 dl dd span{
color:#878788 !important;
font-size:18px !important;
font-weight:bold !important;
}



.tool_parts dl{
width:48%;
margin-right:4%;
margin-bottom:20px;
}

.tool_parts dl dd{
text-align:center;
}

.tool_parts dl:nth-of-type(2n){
margin-right:0;
}

.tool_parts dl{
font-size:14px;
}

.tool_parts dl span{
display:block;
color:#878788;
font-weight:bold;
}

.pconly{
display:none;
}

}