@charset "UTF-8";


/*================================================================================
製品ガイドライン対応用CSS SMT
=================================================================================*/

/*----------------------------------------------
 タイトル（19夏用修正）
 ----------------------------------------------*/
.dc19-summer .tit-product-lv1 > .txt-product-number{
	margin-left: -0.5em;
}
.dc19-summer .tit-product-lv1 > .txt-product-number.no-border-smt{
	margin-left: 0;
}
.dc19-summer .product-guideline-setting .tit-product-lv1 + .img-icon{
	display: block;
	margin-top: 10px;
}

/*----------------------------------------------
 リンク
 ----------------------------------------------*/
.product-guideline-setting .grid-product-link a {
	text-decoration: none;
}
.product-guideline-setting .grid-product-link a:hover .product-name {
	text-decoration: underline;
}
.product-guideline-setting .product-img-border{
	position: relative;
	display: inline-block;
}
.product-guideline-setting .product-img-border:before{
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border: 1px solid #dcdcdc;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	color: #dcdcdc;
}
.product-guideline-setting a:hover .product-img-border:before{
	border:2px solid #69a1fe
}
.product-guideline-setting .product-img-border img {
	width: 100%;
	height: auto;
}


/*----------------------------------------------
 ボタン .sec-product-spec-renew
 ----------------------------------------------*/
.product-guideline-setting .btn-product-round,
.spec-guideline-setting .btn-product-round{
  margin-top: 10px;
  display: inline-block;
  position: relative;
  width: 100%;
  max-width: 327px;
  padding: 5px;
  line-height: 3.5;
  vertical-align: middle;
  text-align: left;
  background: none;
  color: #000;
  text-decoration: none;
}
.product-guideline-setting .btn-product-round > .inner,
.spec-guideline-setting .btn-product-round > .inner{
  display: inline-block;
  vertical-align: middle;
  width: 100%;
  border: 2px solid #b8b8b8;
  padding: 20px 46px 20px 36px;
  line-height: 1.5;
  font-size: 14px;
  font-weight: bold;
  color: #333;
  text-align: center;
  border-radius: 40px;
  background-color: #ffffff;
}
.product-guideline-setting .product-stripe-area .sec-product-lv2:nth-child(even) .btn-product-round > .inner,
.spec-guideline-setting .product-stripe-area .sec-product-lv2:nth-child(even) .btn-product-round > .inner{
  background-color: #fafafa;
}
.product-guideline-setting .btn-product-round > .inner:hover,
.spec-guideline-setting .btn-product-round > .inner:hover{
  background-color: #eee;
  box-shadow: 0 1px 5px rgba(4,0,0,0.35);
  opacity: inherit;
}
.product-guideline-setting .btn-product-round > .inner:active,
.spec-guideline-setting .btn-product-round > .inner:active{
  background-color: #ddd;
  box-shadow: 0 1px 5px rgba(4,0,0,0.35);
  opacity: inherit;
}
.product-guideline-setting .btn-product-round > .inner:after,
.spec-guideline-setting .btn-product-round > .inner:after {
  content: "＞";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 28px;
  color: #666666;
  font-size: 15px;
  line-height: 1;
  height: 1em;
  margin: auto;
}
.product-guideline-setting .btn-product-round.link-popup > .inner:after,
.spec-guideline-setting .btn-product-round.link-popup > .inner:after{
  display: none;
}
.product-guideline-setting .btn-product-round.link-popup .icon-common--blank-image,
.spec-guideline-setting .btn-product-round.link-popup .icon-common--blank-image {
  right: 25px;
}


/*背景色を変更*/
.bg-color{
	background-color: #fafafa !important;
}

/*----------------------------------------------
 スペック .sec-product-spec-renew
 ----------------------------------------------*/

/* スペック表 */
.grid-product-spec-renew,
.product-spec-renew--wrap {
  width: 100%;
  margin: 0 auto;
  padding: 0 10px;
}
.grid-product-spec-renew b{
  font-weight: normal;
}

.grid-product-spec-renew > div {
  display: inline-block;
  background-color: #eee;
  vertical-align: top;
}


/* スペック表 */

.grid-product-spec-renew > div {
  display: inline-block;
  background-color: #eee;
  vertical-align: top;
  /* padding: 2.7%; */
}

.grid-product-spec-renew a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
}

.grid-product-spec-renew .col2 {
  position: relative;
  margin: 0 0 5px;
  padding: 10px;
  width: 100%;
}

.grid-product-spec-renew .col4,
.grid-product-spec-renew .col5 {
  position: relative;
  margin: 0 0 5px;
  padding: 10px 14px;
  width: 100%;
}

.grid-product-spec-renew .col7,
.grid-product-spec-renew .col8 {
  position: relative;
  margin: 0 0 5px 1.4%;
  padding: 10px 14px;
  width: 49.3%;
}

.grid-product-spec-renew .col7:nth-child(2n+1),
.grid-product-spec-renew .col8:nth-child(2n+1) {
  margin-left: 0;
}

/* シェブロン位置調整 */
.grid-product-spec-renew .col4 .icon-common--arrow-image,
.grid-product-spec-renew .col5 .icon-common--arrow-image,
.grid-product-spec-renew .col7 .icon-common--arrow-image,
.grid-product-spec-renew .col8 .icon-common--arrow-image {
  right: 5px;
}

/* 非対応 */
.grid-product-spec-renew > div.is-disable {
  background-color: #fafafa;
}
.grid-product-spec-renew > div.is-disable .product-spec__icon {
  opacity: 0.75;
}
.grid-product-spec-renew > div.is-disable .product-spec__text {
  color: #4a4a4a;
}
.grid-product-spec-renew .col2.is-disable:before,
.grid-product-spec-renew .col4.is-disable:before,
.grid-product-spec-renew .col5.is-disable:before,
.grid-product-spec-renew .col7.is-disable:before,
.grid-product-spec-renew .col8.is-disable:before {
  content:'';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  /* background: #FFF; */
  background-image: linear-gradient(to top left, transparent, transparent 49.5%, rgba(216,216,216,0.7) 49.5%, rgba(216,216,216,0.7) 50.5%, transparent 50.5%, transparent);
  /* opacity: 0.7; */
}
@media all and (-ms-high-contrast:none){
	.grid-product-spec-renew .col2.is-disable:before,
	.grid-product-spec-renew .col4.is-disable:before,
	.grid-product-spec-renew .col5.is-disable:before{
	/* IE11 */
	  background-image: linear-gradient(to top left, transparent, transparent 50%, rgba(216,216,216,0.7) 50%, rgba(216,216,216,0.7) 50.3%, transparent 50%, transparent);
	}
}


.grid-product-spec-renew .col2 .product-spec,
.grid-product-spec-renew .col4 .product-spec,
.grid-product-spec-renew .col5 .product-spec {
  display: table;
  width: 100%;
}

.grid-product-spec-renew .col7 .product-spec,
.grid-product-spec-renew .col8 .product-spec {
}

.grid-product-spec-renew .col2 .product-spec__icon,
.grid-product-spec-renew .col4 .product-spec__icon,
.grid-product-spec-renew .col5 .product-spec__icon {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  width: 30%;
  font-size: 86%;
}

.grid-product-spec-renew .col7 .product-spec__icon,
.grid-product-spec-renew .col8 .product-spec__icon {
  height: 45px;
}

.grid-product-spec-renew .product-spec__icon img {
  display: block;
  margin: 0 auto;
}

.grid-product-spec-renew .col2 .product-spec__text,
.grid-product-spec-renew .col4 .product-spec__text,
.grid-product-spec-renew .col5 .product-spec__text {
  display: table-cell;
  vertical-align: middle;
  padding: 0 0 0 5px;
  word-break: break-all;
}

.grid-product-spec-renew .col7 .product-spec__text,
.grid-product-spec-renew .col8 .product-spec__text {
  text-align: center;
  word-break: break-all;
}

.grid-product-spec-renew .col7 a .product-spec__text,
.grid-product-spec-renew .col8 a .product-spec__text {
  text-align: center;
}

.grid-product-spec-renew .col2 .product-spec__mark {
  display: table-cell;
  vertical-align: middle;
  padding: 0 0 0 5px;
  font-size: 12px;
  width: 25%;
}

.grid-product-spec-renew .col2 .icon-mark--red-02,
.grid-product-spec-renew .col7 .icon-mark--red-02,
.grid-product-spec-renew .col8 .icon-mark--red-02,
.grid-product-spec-renew .col2 .icon-mark--gray-02,
.grid-product-spec-renew .col7 .icon-mark--gray-02,
.grid-product-spec-renew .col8 .icon-mark--gray-02 {
  margin-right: 0;
}


/*product-spec-notes*/
.product-spec-renew--notes .compatible,
.product-spec-renew--notes .not-compatible {
  display: inline-block;
  width: 1.5em;
  text-align: center;
  line-height: 1.4;
  border: 1px solid #d8d8d8;
  position: relative;
}
.product-spec-renew--notes .compatible {
  margin-right: 5px;
  background: #eee;
}
.product-spec-renew--notes .not-compatible {
  margin: 0 5px;
  background: #eee;
}

.product-spec-renew--notes .not-compatible:before {
  content:'';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #FFF;
  background-image: linear-gradient(to top left, transparent, transparent 48.5%, #b8b8b8 48.5%, #b8b8b8 51.5%, transparent 51.5%, transparent);
  opacity: 0.7;
}
/*----------------------------------------------
 オプション品 .sec-product-option
 ----------------------------------------------*/

.product-guideline-setting .sec-product-option img{
	width: 100%;
}
.product-guideline-setting .sec-product-option .product-name{
	display: block;
	text-align: left;
	position: relative;
	text-decoration: none;
	margin: 5px 0 0;
	padding-right: 1em;
}
.product-guideline-setting .sec-product-option .product-name .icon-common--blank-image{
	right:0;
}



/*----------------------------------------------
 最近見た製品不可視化 .sec-product-history
 ----------------------------------------------*/

/* セクション */
.sec-product-history {
	display: none !important;
}



/*----------------------------------------------
 spec.html用
 ----------------------------------------------*/
.spec-guideline-setting .contents .contents-main {
  padding: 0 0 30px;
}
.spec-guideline-setting .sec-cmn-w940{
  padding: 0 11px;
}
.spec-guideline-setting .tit-product-lv1 {
  display: block;
  text-align: center;
  margin: 30px auto;
  font-size: 26px;
}
.spec-guideline-setting .tit-cmn-lv2{
  margin-left: 0;
  margin-right: 0;
  padding: 0 0 11px;
  background-color: inherit;
  border-bottom: 1px solid #aaa;
}
.spec-guideline-setting .tit-cmn-lv2:before{
  display: none;
}
.spec-guideline-setting .js-accordion [class*=tit-cmn],
.spec-guideline-setting .js-accordion-tab [class*=tit-cmn]{
  margin-bottom: 0;
  padding-right: 90px;
}
.spec-guideline-setting .js-all-open .toggle{
  top: 8px;
}

.spec-guideline-setting ul.list-accordion.s-product li .tit-cmn-lv3{
  padding: 7px 90px 7px 10px;
  background-image: none;
}
.spec-guideline-setting ul.list-accordion.s-product li .tit-cmn-lv3:before{
  display: none;
}
.spec-guideline-setting ul.list-cmn-inline li a{
  padding-left: 0;
  padding-right: 1em;
  position: relative;
  background: none;
}
.spec-guideline-setting ul.list-cmn-inline li a:after{
  background-image: none;
  content: '\e313';
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  top: 0;
  bottom: 0;
  right: -1.14286em;
  left: 0;
  width: 1em;
  height: 1em;
  margin: auto;
  line-height: 1em;
  vertical-align: top;
  font-size: 1em;
  text-align: center;
  text-decoration: none;
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: normal;
  -webkit-transform: scale(1.3);
  -ms-transform: scale(1.3);
  transform: scale(1.3);
  -webkit-transform-origin: center;
  -ms-transform-origin: center;
  transform-origin: center;
}

.spec-guideline-setting .js-accordion .tit-cmn-lv3+.toggle,
.spec-guideline-setting .js-accordion-tab .tit-cmn-lv3+.toggle{
  top: 11px;
  right: 10px;
}
.spec-guideline-setting .mod-cmn-border{
  padding-top: 30px;
}

.spec-guideline-setting .nav-cmn a:link,
.spec-guideline-setting .nav-cmn a:visited{
  color: #FFF;
}
.spec-guideline-setting .icon-common--arrow-bottom{
  color: #FFF;
}

