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

.sec01{
  padding: 0 0;
} 

.bgCurtain{
  background-image: url("../image/product/ttbg_mb.jpg");
}

.bgCurtain:after{
  background-color: #DAECF4;
}

@media screen and (min-width: 768px), print{
  
.bgCurtain{
  background-image: url("../image/product/ttbg_pc.jpg");
}  
  
}

/*-------industrialmuffler-----------*/


#containerwrap{
  background: url("../image/product/bg_prodcuct.png") center 30px no-repeat;
}

#leadWp {
    background-color: rgba(194,223,237,0.60);
    padding: 20px 0;
  position: relative;
  margin-bottom: 20px;
}


#leadWp .readTit{
  color: #4591ba;
  margin-left: 1.4em; 
text-indent: -1.4em; 
}


#leadWp .readTit:before{
  content: '\f5fd';
font-family: "Font Awesome 5 Free";
font-weight: 600;
color: #4591ba;
margin-right: 0.3em;
}



.list{
  list-style-type:none;
  margin-left:1em;
  margin-bottom: 2em;
  margin-top: 1em;
}

.list li{
margin-left: 1.5em; 
text-indent: -1.5em; 
}

.list li:before{
     content: '\f00c';
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    color: #4591ba;
    margin-right: 0.5em; 
}

  #here{
    margin-top: 40px;
/*  background-color: #fff;*/
  border-radius: 6px;
  padding: 0 10px 20px;
}

.fk01{
  background-color: #4591ba;
  text-align: center;
  color: #fff;
  padding: 10px 0;
  position: relative;
  border-radius: 4px;
  width: calc(86% - 20px);
  margin: -20px 12% 0;
  font-weight: normal;
  font-size: 120%;
  display: inline-block;
}

.fk01:after{
  position: absolute;
  border-style: solid;
    content: " ";
    height: 0;
    width: 0;
  right: calc( 50% - 5px );
    top: 100%;
    border-width: 12px 12px 12px 12px;
    border-color: #4591ba transparent transparent transparent;
}



#here dl{
  margin-top: 20px;
  line-height: 1.8;
}

#here dt{
  color: #4591ba;
  font-weight: bold;
  font-size: 110%;
}

#here dl dd{
  margin-top: 10px;
  margin-left: 3em; 
text-indent: -2em; 
  color: #000;
}

#here dl dd img{
  width: 27px;
}

.empP{
  width: 60%;
  margin: 15px auto -20px;
  display: block;
}




@media screen and (min-width: 768px), print{
  
.sec01{
 
}  
  
#leadWp {
    padding: 60px 0;
    margin-bottom: 40px;
}
  
#leadWp:before{
position: absolute;
    background-color: rgba(194,223,237,0.60);
    width: 100%;
    height: 100%;
    top: 0;
    right: 100%;
    content: "";
    z-index: 0;
}
  
  
#leadWp:after{
    position: absolute;
    background-color: rgba(194,223,237,0.60);
    width: 100%;
    height: 100%;
    top: 0;
    right: -100%;
    content: "";
    z-index: 0;
}  
  
  
#industrialmuffler #leadWp .conteSecH{
  background-image: url("../image/product/industrialmuffler/industrialmuffler_bg.jpg");
  background-position: right top;
  background-repeat: no-repeat;
  background-size: 50%;
    min-height: 360px;
} 
  
  #here{
/*    margin-top: 200px;*/
  padding: 0 0 80px;
    width: 100%;
    position: relative;
}
  
  #here dl {
    margin-top: 40px;
}
  
.list {
    margin-top: 2em;
}  

  .list li{
    margin-bottom: 1em;
  }  
  
.fk01{
    font-size: 24px;
    width:60%;
  padding: 20px;
    margin: -40px 20% 0;
  }  
  
#here dt {
    color: #4591ba;
    font-weight: bold;
    font-size: 120%;
}  
  
.empP {
    margin:0;
width: 228px;
  float: right;
  position: absolute;
  bottom: 0;
  right: 0;
}  
  
  
}

/*--anc--*/
.anc{
  text-align: center;
  margin: 25px 0 15px;
}

.anc li{
  display: inline-block;
  margin: 10px 10px;
  
}

.anc li a{
  color: #4591ba;
  display: block;
  background-color: #fff;
  padding: 5px 10px;
  text-decoration: none;
}

.anc li a:before{
content: '\f078';
font-family: "Font Awesome 5 Free";
  font-weight: 600;
  color: #4591ba;  
  margin-right: 0.5em;
}


@media screen and (min-width: 768px), print{
  
.anc li{
  display: inline-block;
  margin: 10px 5px;
  
}  
 
.anc li a {
    padding: 5px 15px;
font-size: 115%;
}  
  
}

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

.imgSeries{
  margin: 15px 0;
  border: #ccc solid 1px;
}

.imgSeries .cp{
  font-size: 90%;
  text-align: center;
}

.sth{
  text-align: center;
  background-color: #eee;
  padding: 10px;
  display: block;
  margin: 0 auto 10px;
  width: 60%;
}

.greadname{
  border-left: #4591ba solid 2px;
  padding-left: 0.5em;
  line-height: 1.5;
  margin-top: 30px;
  margin-bottom: 20px;
}

.greadname h3 {
    font-size: 18px;
  padding:10px 0 0;
}

.sth{
  width: 240px;
}

@media screen and (min-width: 768px), print{
  
.imgSeries{
  width: 1000px;
  margin: 15px auto 30px;
}  
  
  .imgSeries img{
    width: auto;
  } 
  
.imgSeries .cp{
  text-align: right;
  padding-right: 1em;
} 
  
.greadname{
  margin-top: 40px;
  padding-left: 1em;
  }
  
  
}

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

.datatable {
/*	border-top-width: 1px;
	border-right-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-top-color: #333;
	border-right-color: #333;*/


}
.datatable th{
	background-color: #4591ba;
	font-size: 12px;
	line-height: 1.4;
	color: #FFF;
	letter-spacing: 1px;
	padding: 5px;
	font-weight: normal;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #333;
/*	border-left-width: 1px;  
	border-left-style: solid;  
	border-left-color: #333;*/
white-space: nowrap;
}
.datatable tr td {
	font-size: 12px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #E0E0E0;
/*	border-left-width: 1px;  
	border-left-style: solid;  
	border-left-color: #333;*/
	line-height: 1.4;
	padding: 5px;
white-space: nowrap;  
  text-align: center;
}

.bgcol1 {
    color: #FFF;
  background-color: #4591ba;
}

.cp{
  padding-top: 10px;
  font-size: 90%;
}

@media screen and (min-width: 768px), print{
  
.datatable {
width: 100%;

}
.datatable th{
	font-size: 14px;
	padding: 10px;

}
.datatable tr td {
	font-size: 16px;
	padding: 10px;
} 
  
.datatable tr td.bgcol1 {
font-size: 13px;
}  
  
}


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

#lightgallery{
  margin: 0 auto 40px;

}

#lightgallery a{
  display: inline-block;
  position: relative;
  width: 48%;
}

#lightgallery a:after {
    content: '\f002';
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    color: #fff;
  position: absolute;
  right: 5px;
  bottom: 5px;
}

@media screen and (min-width: 768px), print{
  
#lightgallery{
  text-align: left;
  
  }
  
 #lightgallery a{
  width:auto;
   margin-right: 15px;
} 
}



/*-------reasonable-----------*/
/*-------お手軽サイレンサー-----------*/

.btnPdf a {
max-width: 1000px;
text-align: center;
background-color: #fff;
display: block;
padding: 15px 10px;
text-decoration: none;
margin: 0 auto;
font-weight: bold;
border-radius: 10px;
border: 1px solid #4591ba;
box-shadow: inset 0 0 10px #d6e7f1;
}
.icon,.icon2{
width: 28px;
height: auto;
vertical-align: middle;
margin-right: 3px;
transform: translateY(-1px);
}
.imgBox{
margin-top: 30px;
/*border: #ccc solid 1px;  */
  margin-bottom: 15px;
}



.cttBox {
border: 1px solid #4591ba;
box-sizing: border-box;
width: 100%;
}
.cttBox a{
text-decoration: none;
}
.cttBox div{
padding: 15px;
text-align: center;
}
.cttBox .mbOn,.cttBox .pcOn{
background-color: #4591ba;
}
.cttBox .mbOn a,.cttBox .pcOn span{
color: #fff;
}
.howToBox{
max-width: 1000px;
margin: 20px auto 0;
  clear: both;
}
#reasonable .sec01 h3{
padding:0;
margin:0 0 10px 0;
color: #4591BA;
font-size: 110%;
}
#reasonable .datatable{
background-color: #fff;
}
#reasonable .scrollTable{
margin-top: 15px;
}
#reasonable .sec01:first-of-type .conteSecH a{
text-decoration: none;
color: #000;
}

#kantan .imgBox{
border: none;
}

#kantan .TblBox{
  min-height: inherit;
    
}

.useP{
  margin: 15px 0;
}

@media screen and (min-width: 768px), print{
		.btnPdf a{
		font-size: 18px;
		}
		.imgBox{
		margin-top: 30px;
		}
		#reasonable .scrollTable{
		margin-top: 30px;
		}
		.datatable {
		width: 1000px;
		margin: 0 auto;
		}
		#reasonable .sec01 h3{
		font-size: 30px;
		}
		#reasonable .sec01 .icon{
		width:56px;
		}
		#reasonable .sec01{
		padding-bottom: 0;
		}
		.cttBox {
		display: flex;
		}
		.cttBox div{
		width: 50%;
		padding: 25px
		}
		.howToBox{
		margin: 50px auto 0;
		}
		.cttBox .mbOn a,.cttBox .pcOn span,.cttBox div a{
		font-size: 20px;
		}
		.cttBox{
		margin-top:10px;
		}
		#reasonable .conteSecH {
/*		margin: 0 auto;*/
		}
		.icon{
		margin-right: 10px;
		transform: translateY(-3px);
		}
		#reasonable .sec01:first-of-type .conteSecH{
		background-image: url("../image/product/reasonable/reasonable_bg.jpg");
		background-position: right top;
		background-repeat: no-repeat;
		background-size: 50%;
		padding-bottom: 160px;
		}
  
  .tboxU{
    width: 70%;
    display: inline-block;
  }  
  
.useP{
  margin: 0;
  float: right;
  width: 25%;
  height: auto;
    display: inline-block;  
}  
  
}


/*---------spout---------*/
/*-------大気放出用サイレンサー-----------*/

#spout .readTit{
font-size: 20px;
line-height: 1.5;
  margin-left: 1.4em; 
text-indent: -1.4em;   
}

.readTx{
  margin-top: 1em;
  margin-bottom: 2em;
}

.fcRed{
font-size: 110%;
color: #9b0101;
border-bottom: 1px solid;
}
.conteTit04{
padding: 0 0 10px 0;
margin-top: -55px;
border-bottom: 1px dotted #4591ba;
}
.conteTit04 span{
display: block;
background-color: #4591ba;
color: #f6dc2b;
padding: 5px 0;
border-radius: 4px;
text-align: center;
position: relative;
margin: 0 auto 20px auto;
width: 80%;
min-width: 200px;
font-size: 16px;
}
.conteTit04 span::after{
position: absolute;
border-style: solid;
content: " ";
height: 0;
width: 0;
bottom: -20px;
left: 50%;
transform: translateX(-50%);
border-width: 12px 10px 12px 10px;
border-color: #4591ba transparent transparent transparent;
}
.TblBox {
background-color: #e3eff5;
border-radius: 4px;
padding: 40px 30px 30px;
margin-top: 50px;
}

.TblBox li{
  margin-top: 15px;
}

.TblBox ol{
margin: 0;
  padding-left: 1.5em;
}

.TblBox li:before{
/*      font-family: "Font Awesome 5 Free";
    content: "\f22d";
    font-weight: bold;
    font-size: 12px;  
  margin-right: 0.5em;*/
}

.sideBS .textBox{
margin-top: 30px;
}

#spout .photo{
  width: 70%;
  margin: 0 15% 15px;
}


@media screen and (min-width: 768px), print{
	
		#spout .readTit{
		font-size: 30px;
		}
  
.readTx{
width: 46%;
  margin-top: 2em;
  margin-bottom: 2em;  
}  
  
		#spout #here{
margin: 0 auto;
		}
		#spout .conteSecH{
		margin-bottom: 0;

		}
		#spout .sec01:first-of-type .conteSecH{
		background-image: url("../image/product/spout/spout_bg.jpg");
		background-position: right top;
		background-repeat: no-repeat;
		background-size: 50%;
		}
		.sideBS{
		display: flex;
		align-items: flex-start;
		}
		.sideBS .textBox{
		margin-right: 50px;
		}
  
  	#spout .sideBS .textBox{
		margin-left: 70px;
      margin-right: 0;
		}
  
		#spout .imgBox {
		margin-top: 60px;
		max-width: 480px;
		flex-shrink: 0;
		}
		#spout .imgBox img{
		width: 100%;
		height: auto;
		}
		.conteTit04{
		font-size: 20px;
		line-height: 1.5;
		}
		.conteTit04 span{
		margin: 0 auto 30px auto;
		padding: 10px 0;
		font-size: 18px;
		}
  
  .TblBox{
    min-height: 470px;
    margin-top: 30px;
  }
  
#spout .photo{
  float: right;
  width: 25%;
  margin: 0 0 0 40px;
  height: auto;
}
  
  
}


/*---------duct---------*/
/*-------ダクト用サイレンサー-----------*/

#duct #container #content .sec01:last-of-type .conteSecH .sideBS:last-of-type{
margin-top: 50px;
}

#duct .photo{
      width: 70%;
    margin: 0 15% 15px;
}

@media screen and (min-width: 768px), print{

		#duct #here{

		}
		#duct .conteSecH{
		margin-bottom: 0;
		}
		#duct .sec01:first-of-type .conteSecH{
		background-image: url("../image/product/duct/duct_bg.png");
		background-position: right top;
		background-repeat: no-repeat;
		background-size: 49%;
		}
		#duct .readTit{
		font-size:29px;
		}
		#duct .sideBS div:first-of-type {
		margin: 30px 50px 0 0;
		width: 70%;
		}

    #duct .sideBS div.imgBox:last-of-type {
    margin: 30px 40px 0 10px;
    width: 70%;
}  
  
		#duct .sideBS .TblBox {
		width: 470px;
		flex-shrink: 0;
		}

		#duct .imgBox {
		margin-top: 0;
		max-width: 470px;
		flex-shrink: 0;
		}
		#duct .imgBox img{
		width: 100%;
		height: auto;
		}
		#duct #container #content .sec01:last-of-type .conteSecH .sideBS:last-of-type{
		justify-content: space-between;
		}
		#duct #container #content .sec01:last-of-type .conteSecH .sideBS:last-of-type div:first-of-type{
		margin: 0;
		}
  
#duct .sideBS div.photo{
      width: 100%;
    margin: 15px 0 15px;
}
  
  #duct .sideBS div.photo img{
    width: 100%;
    height: auto;
  }  
  
}

/*---------kantan---------*/
/*-------清掃簡単消音器-----------*/
#kantan #lightgallery a{
margin: 0;
text-decoration: none;
}
.patentBox{
margin:0 4% 30px;
}
.patentBox h2 span {
font-size: 16px;
font-weight: normal;
}
#kantan .TblBox {
padding: 20px 15px;
margin: 45px 0 15px;
}
#kantan .conteTit04 {
padding: 0;
margin: -40px 0 0;
font-size: 16px;
font-weight: normal;
border-bottom: none;
line-height: 1.5;
}
#kantan .conteTit04 span {
font-size: 18px;
font-weight: bold;
min-width: 250px;
padding: 10px 0;
margin: 0 auto 15px auto;
background-color: #f6dc2b;
color: #000000;
}
#kantan .conteTit04 span::after{
border-color: #f6dc2b transparent transparent transparent;
}
.sideBS2{
display: flex;
justify-content: space-between;
}
.imgBox2{
margin-top: 30px;
}
#kantan #lightgallery a:after {
color: #4591BA;
}
#kantan #lightgallery img,#kantan .imgBox2 img{
border: 1px solid #ccc;
}

#kantan .imgBox2{
margin: 0 0 15px;
}


@media screen and (min-width: 768px), print{
		.patentBox{
		margin:0 0 30px;
		}
		#kantan #here{
		margin-top: 200px;
		}
		#kantan .conteSecH{
		margin-bottom: 0;
		}
	#kantan .sec01:first-of-type .conteSecH{
		background-image: url("../image/product/kantan/kantan_bg.png");
		background-position: right top;
		background-repeat: no-repeat;
		background-size: 50%;

	}
  
  .sec01:first-of-type .conteSecH{
    min-height: 380px;
  }
  
		#kantan #lightgallery{
		margin: 0;
		width:480px;
		}
		.patentBox h2 span {
		font-size: 20px;
		margin-left: 10px;
		}
		#kantan .imgBox2,#kantan .sideBS2{
/*		width: 470px;*/
		}
		#kantan .imgBox2{
		margin: 0 0 30px;
		}
		#kantan .imgBox{
		margin-top: 40px;
		}
		#kantan .imgBox2 img{
		width: 100%;
		height: auto;
		}
		#kantan .sideBS2 img{
		width: 235px;
		height: auto;
		}
		#kantan .TblBox {
		padding: 20px;
		margin: 25px 0;
		}
		#kantan .conteTit04 {
		padding: 0;
		margin: -45px 0 0 0;
		font-size: 21px;
		border-bottom: none;
		text-align: center;
		}
		#kantan .conteTit04 span {
		min-width: 280px;
		font-size: 20px;

		}

}

/*---------smallgeneratorsilencer---------*/
/*-------小型発電機用消音器-----------*/
#smallgeneratorsilencer #container #content .sec01:first-of-type .imgBox{
width: 70%;
margin: 15px auto 0;
}
#smallgeneratorsilencer .sec01 .scrollTable table{
width: 100%;
}
#comp .sideBS{
padding: 20px;
}
#comp .sideBS div{
padding: 10px 40px 30px;
background-image: url("../image/product/smallgeneratorsilencer/bg_mov.png");
background-size: 100%;
}
#comp .sideBS div:first-of-type,#spec .sideBS div:first-of-type,#exhaust div:first-of-type,#sdInfo .sideBS div:first-of-type{
margin-bottom: 20px;
}

#sdInfo .sideBSS{
    display: flex;
justify-content: space-between;

}

#sdInfo .sideBSS div{
  width: 48%;
}

#smallgeneratorsilencer .readTit{
padding: 0;
font-size: 20px;
  font-weight: 500;
}
.notScrollTable table{
width: 100%;
border: 1px solid #3f3f3f;
}
.notScrollTable table th{
padding: 10px;
border: 1px solid #3e3e3e;
background-color: #4591ba;
color: #fff;
width:30%;
  font-size: 12px;
  font-weight: normal;
}
.notScrollTable table td{
padding: 10px;
border: 1px solid #333;
  font-size: 12px;  
}
#option .notScrollTable table th{
width: auto;
}
#exhaust h3{
margin: 0 0 15px;
padding: 0 5px 10px;
border-bottom: 4px double #4591ba;
}
#exhaust{
padding: 15px;
border: 1px solid #4591ba;
margin-top: 10px;
}
.checkM {
font-size: 16px;
color: #4591ba;
font-weight: normal;
background-color: #f6dc2b;
padding: 0 15px 2px 15px;
margin-right: 7px;
border-radius: 100vh;
}
.cautionM {
background-color: #4591ba;
padding: 0px 10px;
margin: 0 5px 20px 0;
font-weight: bold;
color: #ffffff;
font-size: 17px;
}
.listNote li:nth-child(-n+2){
margin-bottom: 15px;
}
#qa dt{
margin-bottom: 15px;
}
#qa dl img{
vertical-align: middle;
margin-right: 7px;
}
#sdInfo{
padding: 15px;
background-color: #e3eff5;
margin-top: 20px;
}
#sdInfo .imgBox2{
margin-top: 0;
}
#sdInfo h3 {
padding: 0;
color: #4591ba;
margin: 0;
}
#sdInfo h4 {
padding: 0;
margin-bottom: 15px;
padding-top: 20px;
border-top: 1px dotted #4591ba;
margin-top: 30px;
}
#sdInfo .imgBox{
margin-top: 20px;
}
/*
#sdInfo .sideBS img,
#sdInfo .sideBSS img,
#sdInfo .imgBox img,
#sdInfo .imgBox2 img{
  border: #fff solid 5px;
}*/

.underLY {
background: linear-gradient(transparent 70%, #f6dc2b 70%);
}
#smallgeneratorsilencer .anc li{
display: block;
}

.textBox2{
background-color: rgba(255, 255, 255, 0.5);
padding: 15px 20px 5px 20px;
box-shadow: 10px 10px 0 0 rgba(69, 145, 186, 0.5);
margin: 10px 0 30px 0;
}

.scP{
  max-width: inherit;
width: 200%;  
}
#option .sideBS div:last-of-type .notScrollTable{
margin: 15px 0;
}

@media screen and (min-width: 768px), print{

		#smallgeneratorsilencer .conteSecH{
		margin-bottom: 0;
		}
		#smallgeneratorsilencer #container #content .sec01:first-of-type .imgBox{
		width: 400px;
		margin: 0;
		flex-shrink: 0;
		}
		#smallgeneratorsilencer #container #content .sec01:first-of-type .imgBox img{
		width: 100%;
		height: auto;
		}
		#comp .sideBS,#spec .sideBS,#option .sideBS,#sdInfo .sideBS{
		justify-content: space-between;
		}
		#comp .sideBS div{
		width: 490px;
		padding: 10px 40px 30px;
		}
	#sdInfo .sideBS div{
		width: 450px;
	}
		#spec .sideBS div:first-of-type,#option .sideBS div:first-of-type{
		width: 60%;
		}
		#spec .sideBS div:last-of-type,#option .sideBS div:last-of-type{
		width:36%;
		}
		#option .sideBS div:last-of-type .notScrollTable{
		display: block;
		width: 100%;
		}
		#spec .sideBS div:last-of-type img,#option .sideBS div:last-of-type img,#sdInfo .sideBS div img{
		width:100%;
		height: auto;
		}
		#comp .sideBS div p{
		text-align: center;
		}
		#comp .sideBS div:first-of-type,#spec .sideBS div:first-of-type,#option .sideBS div:first-of-type,#exhaust div:first-of-type,#sdInfo .sideBS div:first-of-type{
		margin-bottom: 0;
		}
		#comp .sideBS{
		padding: 0px;
		}
		#exhaust div{
		width: 450px !important;
		}
		#exhaust div:last-of-type img{
		width: 100%;
		height: auto;
		}
		#exhaust h3 {
		font-size: 23px;
		}
		#sdInfo {
		padding: 20px 30px 30px;
      margin-bottom: 100px;
		}
		#sdInfo h4 {
		font-size: 20px;
      margin-top: 50px;
      padding-top: 30px;
		}
		#smallgeneratorsilencer .readTit{
		font-size: 30px;
		margin: 20px 0;
		}
		#smallgeneratorsilencer .icon {
		width: 56px;
		}
		#smallgeneratorsilencer .introT{
		font-size: 22px;
		}
		#smallgeneratorsilencer .textBox{
		margin-top: 10px;
		}	
		#smallgeneratorsilencer .anc{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		}
		#smallgeneratorsilencer .anc li{
		display: inline;
		width: 30%;
		}
		.textBox2{
		margin: 10px 0 0 0;
		}
		#smallgeneratorsilencer .anc{
		margin-top: 60px;
		width: 1000px;
		}
		.textBox2{
		padding:20px 25px 10px 25px;
		}
	#smallgeneratorsilencer .sec01:first-of-type .sideBS .textBox{
		margin-right: 60px;
	}
	#exhaust{
		padding: 25px;
    margin-top: 40px;
	}
  
#sdInfo .imgBox {
    margin-top: 40px;
}  
  
.scP {
    max-width: 100%;
}  
  
#sdInfo .sideBSS div img{
  width: 70%;
  margin: 0 15%;

}  
  
.notScrollTable table th,
.notScrollTable table td{
  font-size: 16px;  
}  
  
 #smallgeneratorsilencer .sec01{
    margin-top: 40px;
  }  
   
}


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

.col2Box {
    justify-content: space-between;
}

.col2Box > img {
    width: 100%;
    margin-bottom: 15px;
}


@media screen and (min-width: 768px), print{
  
.col2Box {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
} 
  
.col2Box > img {
    width: 46%;
    margin-bottom: 15px;
    margin-top: 15px;
}  
  
}


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

#yamatomuffler {
    margin-bottom: 40px;
    padding: 0 0;
  margin-top: 60px;
background-color: rgba(194,223,237,0.60);  
  position: relative;
}




@media screen and (min-width: 768px), print{
  
  #yamatomuffler {
    margin-bottom: 0;
    margin-top: 120px;  
  }  

#yamatomuffler:before {
    position: absolute;
 background-color: rgba(194,223,237,0.60);  
    width: 100%;
    height: 100%;
    top: 0;
    right: 100%;
    content: "";
    z-index: 0;
}

#yamatomuffler:after {
    position: absolute;
 background-color: rgba(194,223,237,0.60);  
    width: 100%;
    height: 100%;
    top: 0;
    right: -100%;
    content: "";
    z-index: 0;
}
  
#yamatomuffler .conteSecH {
    margin: 0 auto;
}  
  
  #container #content {
    padding-bottom: 0;
  }
  
}

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

#treeroll #containerwrap {

background-image: none;

}  

#treeroll #leadWp{
background-image: url("../image/product/threeroll/bg_threeroll.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position:80% top;
} 

#leadWp:before,
#leadWp:after {

}

#treeroll #leadWp .conteSecH{
  margin-bottom: 0;
}

#treeroll #threerollMain{
  width:60%;
}

#treeroll #threerollMain img{
  margin-top: -20px;
}

#treeroll .tTcp{
  font-weight: 400;
  margin: 0 0 0;
  padding: 20px 0 0;
  font-size: 20px;
float: right;

}

#treeroll .drawingWrap{
border: 1px dotted #4591ba;
background-color: #daecf4;
padding: 15px;
}
#treeroll .drawing div:last-of-type img {
margin: 10px auto 0;
display: block;
}
#treeroll .drawing div:first-of-type img{
display: block;
margin: 0 auto;
}
#treeroll .inqbox{
margin:5px 0 0 ;
padding:0;
border: none;
background-color: #daecf4;
color: #4591ba;
}

.voiceList{

    line-height: 1.8;
}

.voiceList dt{
      color: #4591ba;
    font-weight: bold;
    font-size: 120%;
  margin-top: 25px;  
}

.voiceList dd{
      margin-top: 10px;
  margin-left: 15%;
  position: relative;
  background-color: #e3eff5;
  padding: 15px;
  border-radius: 6px;
}

.voiceList dd:before {
    content: '\f007';
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
  font-size: 200%;
    color: #4591ba;
  position: absolute;
  top:0;
  left: -16.5%;
}

.voiceList dd:after {
    right: 100%;
    top: 15px;
    border-width: 8px 16px 8px 16px;
    border-color: transparent #e3eff5 transparent transparent;
    border-style: solid;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.mvWp{
  margin-top:40px;
}

.mvWp p img{
  vertical-align: middle;
}


.thxBox{
  display: inline-block;
  position: relative;
/*  height: 60px;
  line-height: 60px;*/
  text-align: center;
  padding: 10px 0;
  font-size: 20px;
  background: #294165;
  color: #FFF;
  box-sizing: border-box;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.25);
	width: 90%;
	margin: 20px 5%;
}

.thxBox p{
  margin: 0 2rem;
  padding: 0 30px 10px;
  border-bottom: dashed 1px rgba(255, 255, 255, 0.5);
  line-height: 1.3;
}

.thxBox p span{
	font-size: 130%;
}

.thxBox:before,
.thxBox:after{
  position: absolute;
  content: '';
  width: 0px;
  height: 0px;
  z-index: 1;
	
}

.thxBox:before{
  top: -2px;
  left: -2px;
  border-width: 50px 0px 50px 18px;
  border-color: transparent transparent transparent #fff;
  border-style: solid;
}
.thxBox:after{
  top: -2px;
  right: -2px;
  border-width: 50px 18px 50px 0;
  border-color: transparent #fff transparent transparent;
  border-style: solid;	
}


@media screen and (min-width: 768px), print{
  
#treeroll #leadWp{
background-image: url("../image/product/threeroll/bg_threeroll.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position:100% top;
}   
  
 #treeroll #threerollMain{
  width:56%;
}

#treeroll #threerollMain img{
  margin-top:0;
  max-width: 100%;
} 
  
#treeroll .tTcp{
  font-weight: 400;
  padding: 200px 0 0;
  font-size: 40px;
} 
		#treeroll .drawingWrap {
		padding: 15px 0 20px;
		}
		#treeroll .drawing {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 160px;
		}	
		#treeroll .drawing div:first-of-type,#treeroll .drawing div:first-of-type img{
		width: 450px;
		height: auto;
		}
		#treeroll .drawing div:last-of-type,#treeroll .drawing div:last-of-type img{
		width: 180px;
		height: auto;
		margin: 0;
		}
		#treeroll .inqbox{
		width: 100%;
		}
  
.voiceList dt{
 margin-top: 35px;
}

.voiceList dd{
  margin-left:70px;
  padding: 20px;
}

.voiceList dd:before {
  font-size: 270%;
  left:-70px;
}

.voiceList dd:after {
    border-width: 12px 24px 12px 24px;
}  
  
.mvWp{
  width: 80%;
  margin:60px 10% 0;
}
  
.thxBox{
	width: 70%;
	margin: 20px 15%;
font-size: 24px;	
	
}

.thxBox:before{
  border-width: 38px 0px 38px 18px;
}
.thxBox:after{
  border-width: 38px 18px 38px 0;
}
	

}   

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


.tpWrap:after {
	content: ""; 
	display: block; 
	clear: both;
}

.stTr{
  font-weight: 400;
  margin-bottom: 15px;
  margin-top: 30px;

}

.stTr span{
  display: inline-block;
  background-color: rgba(162,200,220,0.7);
  padding: 0.3em 0.9em;
  margin-right: 0.3em;
  font-size: 80%;
 position: relative;
}

.stTr span:after{
content: "";  
  width: 0;
height: 0;
border-style: solid;
border-width: 20px 20px 0 0;
border-color: #4591ba transparent transparent transparent;
  position: absolute;
  top:0;
  left: 0;
}

#d1{
  width: 100%;
  margin: 15px 0;
}

#d2{
  width: 50%;
  margin: 15px 25% 30px;
}


  
@media screen and (min-width: 768px), print{  
  
.stTr {
font-size: 24px;
    margin-bottom: 15px;
    margin-top: 30px;
}  
  
  .ttBox1{
    width: 54%;
    display: inline-block;
vertical-align:top;
  }
  
  .ppBox1{
    width: 42%;
    display: inline-block;

    margin-left: 3%;

  } 
  
  .ppBox1 img,
  .ppBox2 img{
    max-width: 100%;
  } 
  
  .ttBox2{
    width: 54%;
    display: inline-block;
    vertical-align: top;
    margin-left: 3%;
    padding-top: 40px;
  }
  
  .ppBox2{
    width: 42%;
    display: inline-block;
    float: left;

  }  
  
#d1 img,
  #d2 img{
    max-width: 100%;
  }  
  
#d1{
  width: 68.4%;
  margin: 60px 0;
  display: inline-block;
  float: left;
}

#d2{
  width: 25%;
  margin: 60px 0;
  display: inline-block;
  float: right;
}  

.inqbox {
    margin: 30px auto 100px;
}  
  
}

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

.datatable2{
  border-top: #E0E0E0 solid 1px;
  border-right: #E0E0E0 solid 1px;
}

.datatable2 th{
	background-color: #4591ba;
	font-size: 12px;
	line-height: 1.4;
	color: #FFF;
	letter-spacing: 1px;
	padding: 5px 10px;
	font-weight: normal;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #E0E0E0;

white-space: nowrap;
}
.datatable2 tr td {
	font-size: 12px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #E0E0E0;

	line-height: 1.4;
	padding: 5px 10px;
white-space: nowrap;  
  text-align: left;
}

.txt3{
  text-align: center;
  font-weight: bold;
  font-size: 115%;
}

.txt3 .fBnd{    
  background: linear-gradient(transparent 60%, #FBED6F 60%);
}

@media screen and (min-width:768px), print{  
  
.datatable2 th,
.datatable2 tr td{
    font-size: 16px;
    padding: 10px;
  }  
  
  #treeroll .datatable2{
    width: 50%;
  }
}