@charset "UTF-8";

/*--　2017_01_27　--*/

#content p.windows {
    font-size: 19px;
    line-height: 1;
    
    margin: 0 auto;
    margin-top: 34px;
    margin-bottom: 78px;
    font-family: "游ゴシック体", "Yu Gothic", YuGothic,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
@media screen and (max-width: 480px) {
	#main p.windows {
    font-size: 13px;
	margin: 1.8em auto 3em;
	
	}
	
}


/*default
-----------------------------------*/

h1, h2, h3, h4, h5, h6, p, pre, blockquote, form, input, textarea, fieldset, ul, ol, dl, li, dt, dd, address, caption {
  margin: 0;
  padding: 0;
}
.charttable {
  border-collapse: collapse;
}
p {
  margin-bottom: 0px;
}

/*link
-----------------------------------*/

a {}
a:hover, a:active {}
a:visited {}
.red {
  color: #F00;
}

/*clearfixハック
-----------------------------------*/

.clearfix:after {
  content: "";
  display: block;
  clear: both;
}
.clearfix {
  display: inline-block;
}

/* Hides from IE-mac ¥*/

* html .clearfix {
  height: 1%;
}
.clearfix {
  display: block;
}

/* End hide from IE-mac */

#pro_Head {
  width: 950px;
  margin: 15px auto;
  text-align: left;
  position: relative;
  zoom: 1;
}
#pro_Head h1 {
  font-weight: bold;
  font-size: 125%;
}
#pro_Head h1 span .small {
  font-size: 85%;
  vertical-align: baseline;
}
#pro_Head h1 span.Ns {
  color: #00806b!important;
}
#pro_Head h1 span.Hz {
  color: #096f8e!important;
}
#pro_Head h1 span.Hf {
  color: #0488ad!important;
}
#pro_Head h1 span.Ha {
  color: #072f75!important;
}
#pro_Head h1 span.Da {
  color: #de6c35!important;
}
#pro_Head h1 span.Dt {
  color: #86548f!important;
}

/* 151Q ---------------------------------------------------------------- */


/* 152Q-------------------------------------------------------------------------- */

#pro_Head h1 span.Hs {
  color: #342958!important;
}
#pro_Head h1 span.Tw {
  color: #b31f2b!important;
}

/* 152Q---------------------------------------------------------------- */


/* 152QLTE-------------------------------------------------------------------------- */

#pro_Head h1 span.Te {
  color: #339966!important;
}
#pro_Head #mda {
  position: absolute;
  right: 0;
  z-index: 1000;
}
#pro_Head .fright {
  float: right !important;
  position: relative;
}
#pro_Head .path {
  margin: 0;
  padding: 0 0 15px;
}
#pro_Head .path li {
  font-size: 85%;
}
#pro_Head ul.path li {
  display: inline;
}
#pro_Head ul.path li a:link {
  display: inline;
}
#content {
  padding: 0 20px;
}
h2 {
  margin-bottom: 15px;
  padding: 3px 0 3px 10px;
  font-size: 117%;
  line-height: 1;
  border-left: 3px #000 solid;
}
.charttable {
  width: 95%;
  margin: 0 auto;
  max-width: 951px;
  border-collapse: collapse;
  border: 2px solid #ccc;
  font-size: 12px;
}
#cNote {
  display: block;
  width: 95%;
  margin: 8px auto;
  max-width: 951px;
  font-size: 11px;
  text-align: left !important;
}
.charttable td, .charttable th {
  padding: 15px 0;
  border: 1px solid #ccc;
  line-height: 1rem;
  text-align: center;
  font-weight: normal;
}
.charttable th {
  background: #f4f4f4;
  vertical-align: middle;
}
.charttable td {
  height: 50px;
}
.charttable thead th {}
.charttable .clri {
  display: inline-block;
  vertical-align: middle;
  margin: 0 3px;
}
.charttable .clrp {
  display: inline-block;
  vertical-align: middle;
	font-size: 10px;
    line-height: 1.1;
}
.charttable .cellimg {
  margin: 8px 0px;
}
.charttable .cellimg2 {
  margin: 3px 0px;
}
#ctable1 .cbasic_h, .cbasic {
  display: table-cell;
}
#ctable1 .cpre_h, .cpre {
  display: table-cell;
}
#ctable1 .chigh_h, .chigh {
  display: table-cell;
}
.charttable .cpre_h {
  background: #444;
  color: #fff;
}
.charttable .chigh_h {
  background: #777;
  color: #fff;
}
.charttable .cbasic_h {
  background: #999;
  color: #fff;
}
.charttable .pre_ {
  width: 38%!important;
}
.charttable .high_ {
}
.charttable .basic_ {
}
.charttable img.pcphoto {
  width: 100px;
  height: 76px;
  margin-right:1px;
}
.charttable tbody th {
  /*width: 15%;*/
  font-size: 100%;
}
.nSP {
  display: none;
}
#PathArea {
  border: none;
}

/*base and common css*/

#pro_Head {
  max-width: 950px;
}
#pro_Head #naviAreaCat1 {
  position: relative;
  margin-top: 30px;
  height: 55px;
  background: url(/navigate/products/pc/161q/common/images/bg_resnavi_cat.gif) bottom left repeat-x;
}
#pro_Head #naviAreaCat1 .catBt {
  position: absolute;
  top: 0;
  left: 0;
}
#pro_Head #naviAreaCat1 .cusBt {
  position: absolute;
  top: 0;
  left: 263px;
}
#pro_Head .path {
  margin: 0;
  padding: 0 0 15px;
}
#pro_Head .path li {
  font-size: 85%;
}
#lnkbox {
  margin: 15px auto 10px auto;
  border-top: 1px solid #666666;
  border-bottom: 1px solid #666666;
  max-width: 951px;
}
#lnkbox p {
  padding: 10px 0px;
}
#lnkbox ul {
  padding: 10px 0px;
  border-top: 1px solid #666666;
}
#lnkbox li {
  padding: 1px 0px;
}
#topagetop {
  width: 835px;
  margin: 20px auto;
  text-align: right;
}

#ctable1 th.setw {
	width: 12%;
	box-sizing: border-box;
}
#ctable1 td.setw {
	width: 20%;
	box-sizing: border-box;
}
#ctable1 .clb td.setw {
	width: 10%;
}


@media only screen and (max-width:700px) {
	
  .nSP {
    display: block;
    font-size: 90%;
  }
  #lnkbox {
    padding: 0 7px;
  }
  #content {
    padding: 0 7px;
  }
  .charttable {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #ccc;
    font-size: 85%;
    margin: 30px 0;
  }
  #cNote {
    width: 100%;
    margin: 8px auto;
    max-width: 951px;
    text-align: left;
  }
  .charttable img.pcphoto {
    min-width: 80px;
    width: 90%;
    max-width: 100px;
    height: auto;
  }
  #ctable1 .cbasic_h, #ctable1 .cbasic {
    display: none;
  }
  #ctable1 .chigh_h, #ctable1 .chigh {
    display: none;
  }
  #ctable1 .cpre_h, #ctable1 .cpre {
    display: table-cell;
   /* width: 40%;*/
  }
  #ctable2 .cbasic_h, #ctable2 .cbasic {
    display: none;
  }
  #ctable2 .cpre_h, #ctable2 .cpre {
    display: none;
  }
  #ctable2 .chigh_h, #ctable2 .chigh {
    display: table-cell;
    /*width: 40%;*/
  }
  #ctable3 .cpre_h, #ctable3 .cpre {
    display: none;
  }
  #ctable3 .chigh_h, #ctable3 .chigh {
    display: none;
  }
  #ctable3 .cbasic_h, #ctable3 .cbasic {
    display: table-cell;
    width: 26%;
  }
  .charttable tbody th, .charttable thead th.line_h {
    /*width: 20%;*/
    font-size: 90%;
  }
  /*base and common css*/
  #pro_Head {
    width: auto;
    margin: 15px auto;
    text-align: left;
    position: relative;
    zoom: 1;
    padding: 0 7px;
  }
  #pro_Head #mda {
    position: static;
    text-align: right;
    z-index: 1000;
  }
  #pro_Head h1 {
    z-index: 100;
    zoom: 1;
  }
  #pro_Head h1 img {
    display: block;
    float: none;
    margin-top: 10px!important;
  }
  #pro_Head #mda {
    position: static;
    text-align: right;
    z-index: 1000;
  }
  #PathArea {
    border: none:
  }
  #mda img {
    max-width: 100%;
    height: auto;
    width/****/
    : auto;
    /*IE8のみ適用*/
  }
	
	
	
	
	
	#ctable1 th.setw,
	#ctable2 th.setw,
	#ctable3 th.setw {
		width: 20%;
	}
	#ctable1 td.setw,
	#ctable2 td.setw {
		width: 80%;
	}
	#ctable3 td.setw {
		width: 40%;
	}
	#ctable1 .clb td.setw,
	#ctable2 .clb td.setw {
		width: 40%;
	}
	#ctable3 .clb td.setw {
		width: 20%;
	}
	
}

/*20170127*/

.color_table{
	margin-left: auto;
	margin-right: auto;
	/*width:200px;*/
}

.color_table td{
	padding:0;
	border: none;
	height: 24px;
	overflow: hidden;
	text-align: left;
}

.color_table td:first-child{
	/*padding-right: 0.5em;*/
	padding-bottom: 0.3em;
}

.color_table td img.clri{
	margin-bottom: -20px;
	margin-top: -20px;
}

.color_table.high{
	/*width: 280px;*/
}

#ctable1 thead .vat .cbasic .clrp{
	font-size: 10px;
	line-height: 1.1
}

#ctable1 td.cbasic img.clri{
	/*margin-bottom: -5px;
	margin-top: -5px;*/
}

tr.vat{
	vertical-align: top;
}

#ctable1 .clb td.cbasic div{
	margin-left: auto;
	margin-right: auto;
}

@media  only screen and (min-width:800px) {
	.color_table.high{
		/*width: 320px;*/
	}
	.charttable td.chigh{
		/*padding-left:10px;
		padding-right: 10px;*/
	}
}


.color_table.high td:first-child{
	padding-right: 0em;
}

#ctable1 .clb td div{
}

#ctable1 .clb td.chigh,
#ctable1 .clb td.cbasic,
#ctable1 .clb td.cbasic div{
	/*width:70px;*/
}

#ctable1 .clb td.cpre.first{
	text-align: center;
}


@media  only screen and (max-width:480px) {
	.color_table.high,
	.color_table{
		width: auto;
	}
	.charttable td.chigh{
		padding-left:0px;
		padding-right: 0px;
	}
	
	#ctable1 .clb td.chigh,
	#ctable1 .clb td.cbasic,
	#ctable1 .clb td.cbasic div{
		width:auto;
	}
	
	
	
}

.charttable tbody th .kome,
.charttable tbody td .kome {
	font-size: 0.5em;
    line-height: 1;
    vertical-align: 0.75em;
}

.charttable .vat td {
	padding-left: 0.1%;
	padding-right: 0.1%;
}
br.under480 {
	display: none;
}
br.over700 {
	display: inline;
}

@media only screen and (max-width:700px) {
	br.over700 {
		display: none;
	}
}
@media  only screen and (max-width:480px) {
	br.under480 {
		display: inline;
	}
}