@charset "UTF-8";

/*----  Primary  ----*/
.primary {
	float: right;
	width: 710px;
}

/*----  secondary  ----*/
.secondary {
	float: left;
	width: 190px;
}

#title {
 background: url(../../images/products/bg-title_w710_top.gif) no-repeat left top;
 padding-top: 7px;
}
h1 {
 background: url(../../images/products/bg-title_w710_bottom.gif) no-repeat left bottom;
 padding: 7px 20px 13px 21px;
 font-weight: bold;
 line-height: 150%;
 margin-bottom: 40px;
 font-size: 2.1em;
}


/*--------------------------------------------------------------
detail-top
--------------------------------------------------------------*/
#detail-top {
 margin-bottom: 30px;
 font-size: 1.2em;
}

/*----  img-area  ----*/
#detail-top #img-area {
 width: 348px;
 float: left;
 margin-right: 20px;
}
#detail-top #img-area .main-img{ margin-bottom: 0px; font-size:1px; }
#detail-top #img-area ul.img-list { padding-bottom: 20px; 
}
#detail-top #img-area ul.img-list li {
 float: left;
 margin-right: 8px;
}
#detail-top #img-area ul.img-list li.right {
 margin-right: 0;
}

#detail-top #img-area .catalog-txt {
 margin-bottom:10px;
}

#detail-top #img-area ul.btn-list { margin-bottom: 20px; 
}
#detail-top #img-area ul.btn-list li {
 float: left;
 margin: 0 6px 10px 0;
}
#detail-top #img-area ul.btn-list li.right {
 margin-right: 0;
}
#detail-top #img-area ul.btn-list li a {
 width: 82px;
 height: 36px;
 display: block;
 text-indent: -9999px;
 outline: 0;
}
#detail-top #img-area ul.btn-list li#btn-catalog a { background: url(../images/detail/btn-catalog.gif) no-repeat left top;}
#detail-top #img-area ul.btn-list li#btn-catalog2 a { background: url(../images/detail/btn-catalog2.gif) no-repeat left top;}
#detail-top #img-area ul.btn-list li#btn-movie a { background: url(../images/detail/btn-movie.gif) no-repeat left top;}
#detail-top #img-area ul.btn-list li#btn-movie2 a { background: url(../images/detail/btn-movie2.gif) no-repeat left top;}
#detail-top #img-area ul.btn-list li#btn-50hz a { background: url(../images/detail/btn-50hz.gif) no-repeat left top;}
#detail-top #img-area ul.btn-list li#btn-60hz a { background: url(../images/detail/btn-60hz.gif) no-repeat left top;}

#detail-top #img-area ul.btn-list li#btn-catalog a:hover,
#detail-top #img-area ul.btn-list li#btn-catalog2 a:hover,
#detail-top #img-area ul.btn-list li#btn-movie a:hover,
#detail-top #img-area ul.btn-list li#btn-movie2 a:hover,
#detail-top #img-area ul.btn-list li#btn-50hz a:hover,
#detail-top #img-area ul.btn-list li#btn-60hz a:hover {
 background-position: left bottom;
}


h3 {
 width: 348px;
 height: 35px;
 text-indent: -9999px;
 margin-bottom: 10px;
}
h3#data-tit { background: url(../images/detail/tit-data.gif) no-repeat;}
h3#info-tit { background: url(../images/detail/tit-other.gif) no-repeat;}
h3#use-tit { background: url(../images/detail/tit-application.gif) no-repeat;}

#detail-top #img-area .use-area {
 margin-bottom: 20px;
}
#detail-top #img-area ul.use-list {
 padding:	0 20px 0 30px;
}
#detail-top #img-area ul.use-list li {
 list-style-type: decimal;
 line-height: 180%;
}

#detail-top #img-area .info-area {
 padding: 0 10px 10px 10px;
 margin-bottom: 20px;
}
#detail-top #img-area .info-area h4.other-sub-tit {
 background-color:#82C7E8;
 padding: 3px 20px;
 display: inline;
 font-size: 0.8em;
 color: #FFF;
}
#detail-top #img-area .info-area img {
 margin-bottom:10px;
}
#detail-top #img-area .info-area ul {
 margin-top: 10px;
}
#detail-top #img-area .info-area ul li {
 margin-bottom: 10px;
}
ul.info-list li a {
 background: url(../../images/common/icon-arrow3.gif) no-repeat 0 50%;
 padding-left: 15px;
}

/*----  txt-area  ----*/
#detail-top #txt-area {
 overflow: auto;
 zoom:1;
 margin-bottom: 30px;
}
#detail-top #txt-area h4 {
 font-size: 1.2em;
 font-weight: bold;
 margin-bottom: 10px;
}

#detail-top #txt-area table {
 width: 100%;
 border-top: 1px solid #EEE;
 border-left: 1px solid #EEE;
 margin-bottom: 20px;
 color: #555;
 line-height: 180%;
}
#detail-top #txt-area table tr {
}
#detail-top #txt-area table tr th {
 background-color: #d4e6f6;
 width: 50%;
 padding:	10px;
 border-right: 1px solid #EEE;
 border-bottom: 1px solid #EEE;
 text-align: left;
}
#detail-top #txt-area table tr td {
 padding:	10px;
 border-right: 1px solid #EEE;
 border-bottom: 1px solid #EEE;
}
#detail-top #txt-area .products-list {
 line-height: 180%;
 margin-bottom:10px;
}
#detail-top #txt-area .products-list li {
 background: url(../../images/common/icon-list.gif) no-repeat left 0.5em;
 padding-left: 15px;
 margin-bottom:	5px;
}
#detail-top #txt-area p {
 line-height: 180%;
}

/*--------------------------------------------------------------
tabArea
--------------------------------------------------------------*/
#tabArea {
 clear: both;
 margin-bottom: 50px;
 font-size: 1.2em;
}
#tabArea ul#tab{
 margin-bottom:	20px;
 background: url(../images/detail/products-data-bg.gif) repeat-x;
}
#tabArea ul#tab li {
 float: left;
}
#tabArea ul#tab li a {
 display: block;
 outline: 0;
 height: 38px;
 text-align:center;
 padding-top:18px;
 color: #FFF;
 font-weight: bold;
 line-height:130%;
}
#tabArea ul#tab li a:hover {
 text-decoration: none;
}
#tabArea ul#tab li.tabA a {
 width: 178px; 
 background: url(../images/detail/products-data-tabbtn-A.gif) no-repeat left top;
}
#tabArea ul#tab li.tabB a {
 width: 177px; 
 background: url(../images/detail/products-data-tabbtn-B.gif) no-repeat left top;
}

#tabArea ul#tab li.tabC a {
 width: 178px; 
 background: url(../images/detail/products-data-tabbtn-C.gif) no-repeat left top;
}
#tabArea ul#tab li.tabD a {
 width: 177px; 
 background: url(../images/detail/products-data-tabbtn-D.gif) no-repeat left top;
}

#tabArea ul#tab li.tabA a:hover,
#tabArea ul#tab li.tabB a:hover,
#tabArea ul#tab li.tabC a:hover,
#tabArea ul#tab li.tabD a:hover,
#tabArea ul#tab li.tabA a.active,
#tabArea ul#tab li.tabB a.active,
#tabArea ul#tab li.tabC a.active,
#tabArea ul#tab li.tabD a.active{
 background-position: left bottom;
}



/*--------------------------------------------------------------
performance_data
--------------------------------------------------------------*/
#tabArea h5{
 width: 680px;
 padding: 10px 15px;
 margin-bottom: 20px;
 background-color: #F9F9F9;
 font-weight: bold;
 color: #333;
 font-size: 1.4em;
}
#tabArea p.performance-txt {
 line-height: 180%;
 margin-bottom: 30px;
 margin-left: 15px;
 font-size:1.0em
}
#tabArea p.performance-txt2 {
 margin-bottom: 5px;
 line-height: 100%;
}

#tabArea ul.cad_data-list {
 padding: 0px 40px;
}
#tabArea ul.cad_data-list li {
 float: left;
 margin: 0 40px 40px 0;
}
#tabArea ul.cad_data-list li.right {
 margin-right: 0;
}

#tabArea h5#spec-tit,
#tabArea h5#spec-tit-50hz,
#tabArea h5#spec-tit-60hz,
#tabArea h5#spec-tit-air {
 margin-bottom: 20px;
}

/*----  table  ----*/
#tabArea table	{
 border-spacing:0;
 border-collapse:collapse;
 /border-collapse:collapse; /* ie6,7 */
 word-break:break-all;
 word-wrap:break-word;
 margin-bottom: 5px;
 width:710px;
}
#tabArea table	tr th,
#tabArea table	tr td{
	border: 1px solid #cccccc;
 padding:	5px 1px;
}
#tabArea table	tr th{
 background-color:#eaf8ff;
}
#tabArea table	tr td{
 text-align:center;
}
#tabArea p.spec-txt	{
 line-height: 150%;
 font-size: 0.9em;
 clear: both;
 margin-bottom:30px;
}
#tabArea p.spec-txt span.check{
 color:#D7EFFC;
}


#tabArea table.tableSecond {
	border-left: 1px solid #eeeeee;
	border-bottom: 1px solid #eeeeee;
 line-height: 180%;
 width: 710px;
 margin-bottom:	20px;
}
#tabArea table.tableSecond tr {
}
#tabArea table.tableSecond tr th {
 padding:	10px	15px;
 border: 1px solid #eeeeee;
 font-weight: bold;
 background-color: #F9F9F9;
 width: 180px;
 text-align: left;
}
#tabArea table.tableSecond tr td {
 padding:	10px	15px;
	border: 1px solid #eeeeee;
 text-align:left;
}
#tabArea table.tableSecond .oddNum{
 background:none;
}



.oddNum {
 background-color:#F5F5F5;
}
table.bg-white .oddNum,
table.bg-white .evenNum{
 background-color:#FFF;
}


#tabArea table	table.second {
 width:100%;
 margin:0;
}
#tabArea table	table.second td {
 border-top:none;
 border-left:none;
}
#tabArea table	table.second td.dot {
 border-right:1px dotted #CCC;
}
#tabArea table	table.second td.none {
 border-right:none;
}
#tabArea table	tr td.sub{
 padding:0;
}
#tabArea table	table.second tr.last td {
 border-bottom:none;
}


/*----  contact-area  ----*/
.contact-area {
 background: url(../images/detail/contact-bg.gif) no-repeat;
 width: 710px;
 height: 88px;
 text-indent: -9999px;
 margin-bottom: 20px;
 padding-top:15px;
}
.contact-area ul {
 margin-top: 3px;
}
.contact-area div.contact-btn a {
 background: url(../images/detail/btn-contact.gif) no-repeat left top;
 width: 345px;
 height: 58px;
 display: block;
 float: right;
 margin: 0 15px 0 0;
 /margin: 0 10px 0 0;
 outline: 0;
}
.contact-area div.contact-btn a:hover {
 background-position: left bottom;
}











/*----  tooltop ----*/

.tooltip
{
  position: absolute;
  background: #eaeaea;
  display: inline-block;
  text-decoration: none;
  color: #FFF;
  outline: none;
}
 
.tooltip span
{
  visibility: hidden;
  position: absolute;
  bottom: 30px;
  z-index: 999;
  margin-left: -36px;
  padding: 10px;
  background-color: #000;
  display: inline-block;
}
 
.tooltip:hover
{
  border: 0; /* IE6 fix */
}
 
.tooltip:hover span
{
  visibility: visible;
}
 
.tooltip span:before,
.tooltip span:after
{
  content: "";
  position: absolute;
  z-index: 1000;
  bottom: -7px;
  left: 50%;
  margin-left: -8px;
  border-top: 8px solid #000;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 0;
}
 
.tooltip span:before
{
  border-top-color: #ccc;
  bottom: -8px;
}

/*----  Option ----*/
.Option-Area{
	background-color:#f1f9fa;
	border-radius: 3px; 	
	padding:10px 10px 10px 10px;
	margin-top:20px;}
	.Option-Area ul li.Link{
		margin-bottom: 10px;}
	.Option-Area ul li.Link a{
		background: url(../../images/common/icon-arrow3.gif) no-repeat 0 50%;
		padding-left: 15px;}
	.Option-Area ul li.Download a{
		width: 82px;
		height: 36px;
		display: block;
		text-indent: -9999px;
		outline: 0;
		background: url(../images/detail/btn-catalog.gif) no-repeat left top;}
	.Option-Area ul li.Download a:hover {
		background-position: left bottom;}
		
.Option-Area2{
	margin-top:20px;}
	.Option-Area2 ul li.Link{
		margin-bottom: 10px;}
	.Option-Area2 ul li.Link a{
		background: url(../../images/common/icon-arrow3.gif) no-repeat 0 50%;
		padding-left: 15px;}
	.Option-Area2 ul li.Download a{
		width: 82px;
		height: 36px;
		display: block;
		text-indent: -9999px;
		outline: 0;
		background: url(../images/detail/btn-catalog.gif) no-repeat left top;}
	.Option-Area2 ul li.Download a:hover {
		background-position: left bottom;}


		
.B-series{display: flex;}
.B-series-L{margin-right: 20px;}
.B-series-L img{width:250px; height: auto;}
.B-series-R h4{font-size:1.4em; display: block; line-height: 150%; font-weight: bold; margin-bottom: 10px;}
.B-series-R p{line-height: 180%}


/* ----------------------------------------
.pumpselector-btn
---------------------------------------- */
.pumpselector-btn {
  width: 24rem;
  margin: 0 auto 6rem;
}

.pumpselector-btn a {
  box-sizing: border-box;
  position: relative;
  min-height: 6.4rem;
  display: flex;
  align-items: center;
  background-color: #0068b7;
  border-radius:10rem;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 30%);
  text-align: center;
  padding: 1rem 1rem 1rem 7rem;
  color: #fff;
  font-size: 1.6rem;
  font-weight: bold;
  transition: box-shadow 0.12s, background-color 0.12s;
}

.pumpselector-btn a:hover {
  text-decoration: none;
  box-shadow: none;
  background-color: #137bca;
}

.pumpselector-btn a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 3.5rem;
  width: 0.8rem;
  height: 0.8rem;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: translateY(-50%) rotate(45deg);
}

.pumpselector-btn a img{
  position: absolute;
  top:1.1rem;
  left:2rem;
  width: 4.5rem;
  height: auto;
}