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

Primary style

-------------------------------- */
.cd-products-comparison-table {
	margin: 0 auto;
	height: 100%;
	overflow: hidden;
}
.cd-products-comparison-table::after {
	/* never visible - this is used in jQuery to check the current MQ */
	/*display: none;*/
	/*content: 'desktop';*/
}
.cd-products-comparison-table::after {
	/* never visible - this is used in jQuery to check the current MQ */
	display: none;
	content: 'mobile';
}
.cd-products-comparison-table .action-wrapper {
	display: flex;
	width: 100%;
	font-weight: 500;
}
.cd-products-comparison-table .actions {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	max-width: calc(1200px + 6%);
  padding-right: 3%;
  padding-left: 3%;
  margin: 0 auto;
}
.cd-products-comparison-table .actions .item:not(:first-child) {
	margin-left: 2rem;
}
.cd-products-comparison-table .actions .item a {
	font-weight: 500;
	padding: 2rem 2.5rem;
	display: block;
	background: #f1f1f1;
	line-height: 1;
	min-width: 160px;
	text-align: center;
}
.cd-products-comparison-table .actions .item a.active {
	cursor: pointer;
	color: #ffffff;
}
.cd-products-comparison-table .actions .item a.filter.active {
	background-color: #9dc997;
}
.no-touch .cd-products-comparison-table .filter.active {
	background-color: #a7cea1;
	border: none;
	color: #ffffff;
}
.cd-products-comparison-table .actions .item a.reset.active {
	background-color: #FA514B;
}
.cd-products-comparison-table .actions .reset:hover {
	background-color: #FA514B;
	border: none;
	color: #ffffff;
}

/*cd-products-table*/
.cd-products-table {
	position: relative;
	/*max-width: calc(1200px + 6%);*/
	width: 100%!important;
  /*padding-right: 3%;
  padding-left: 3%;*/
  margin: 3rem auto;
  display: flex;
	border-top: 1px solid #e6e6e6;
}
/*.cd-products-table:before {
	content: '';
	height: 100%;
	width: 3%;
	position: absolute;
	top: 0;
	left: 0;
	background: #fff;
	z-index: 40;
}*/
.cd-products-table .features {
	z-index: 2;
	width: 22%;
}
.cd-products-table .features::after {
	content: '';
	position: absolute;
	top: 0;
	left: 100%;
	width: 4px;
	height: 100%;
	background-color: transparent;
	background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), transparent);
	background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), transparent);
	opacity: 0;
}
.cd-products-table.scrolling .features::after {
	opacity: 1;
}
.cd-products-table .cd-menu {
	background-color: #242B2F;
	color: white;
}
/*top-info*/
.cd-products-table .top-info {
	position: relative;
	height: 24.9em;
	width: 100%;
	text-align: center;
	padding: 1.25em;
	border-right: 1px solid #ccc;
	-webkit-transition: height 0.3s;
	-moz-transition: height 0.3s;
	transition: height 0.3s;
	cursor: pointer;
	
    display: grid;
}
.cd-products-table .top-info::after {
	content: '';
	position: absolute;
	left: 0;
	top: 100%;
	height: 4px;
	width: 100%;
	background-color: transparent;
	background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent);
	background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), transparent);
	opacity: 0;
}
.cd-products-table .features .top-info {
	z-index: 999;
}
.cd-products-table .product .top-info {
	background: #fff;
}
@media screen and (max-width : 1399px ) {
  .cd-products-table .product .top-info,
  .cd-products-table .features .top-info {
  	height: 25em;
  }
}
@media screen and (max-width : 1199px ) {
  .cd-products-table .product .top-info,
  .cd-products-table .features .top-info {
  	height: 33vw;
  }
}
@media screen and (max-width : 991px ) {
  .cd-products-table .product .top-info,
  .cd-products-table .features .top-info {
  	height: 45vw;
  }
}
@media screen and (max-width : 768px ) {
  .cd-products-table .product .top-info,
  .cd-products-table .features .top-info {
  	height: 54vw;
  }
.cd-products-table .product .top-info .img_box img {
  width: 50%!important;
}
}
@media screen and (max-width : 575px ) {
  .cd-products-table .product .top-info,
  .cd-products-table .features .top-info {
  	height: 68vw;
  }
}
.cd-products-table .product .top-info .product_ttl {
	font-weight: 500;
	font-size: 2rem;
	line-height: 1;
	margin-top: 0.5em;
}
.cd-products-table .product .top-info .btn {
	margin-top: 1em;
}
.cd-products-table .product .top-info .btn .btn_01 {
	width: 220px;
	max-width: 100%;
}
.cd-products-table .product .top-info .check {
	position: relative;
	display: inline-block;
	height: 16px;
	width: 16px;
	margin: 0 auto;
}
.cd-products-table .product .top-info .check::after,
.cd-products-table .product .top-info .check::before {
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	height: 100%;
	width: 100%;
	transition: all 0.3s;
}
.cd-products-table .product .top-info .check::before {
	border-radius: 50%;
	border: 1px solid #e6e6e6;
	background: #c7c7c7;

}
.cd-products-table .product .top-info .check::after {
	background: url(../../../common/images/cd-check.svg) no-repeat center center;
	background-size: 24px 24px;
	opacity: 0;
}
.cd-products-table .product .top-info .img_box {
	margin-top: 1em;
}
.cd-products-table .product .top-info .img_box img {
	display: inline-block;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	width: 65%;
	margin-bottom: 0.5em;
}
.cd-products-table .product .top-info .product_ttl, 
.cd-products-table .product .top-info img {
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
}
.cd-features-list li {
	padding: 1em;
	font-size: 1em;
	line-height: 1.5em;
	border-top: 1px solid #ccc;
	border-right: 1px solid #ccc;
	overflow: hidden;
	display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.cd-features-list li sup {
	position: relative;
	top: -0.5em;
}
.cd-features-list li .txt_left {
	/*display: inline-block;
	text-align-last: left;*/
}
.features .cd-features-list li, 
.cd-products-table .features .top-info {
	font-weight: 500;
	/*padding: 25px 10px;*/
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.features .cd-features-list li {
	text-align: center;
}
.cd-products-table .product li .icon_wrap img {
	height: 3.625em;
}
/*list*/
.cd-features-list .size {
	height: 3.5em;
}
.cd-features-list .image_icon {
	height: 5.625em;
}
.cd-features-list .image_icon_02 {
	height: 8em;
}
.cd-features-list .image_icon_02 .txt {
	margin-top: 0.7rem;
}
/*.cd-features-list .panel_curved {
	height: 81px;
}*/
/*.cd-features-list .panel_type {
	height: 88px;
}*/
.cd-features-list .single_line {
	height: 3.5em;
}
/*.cd-features-list .refresh {
	height: 81px;
}*/
/*.cd-features-list .mprt {
	height: 89px;
}*/
/*.cd-features-list .highres {
	height: 58px;
}*/
/*.cd-features-list .hdr {
	height: 72px;
}*/
/*.cd-features-list .freesync {
	height: 58px;
}*/
/*.cd-features-list .black {
	height: 58px;
}*/
.cd-features-list .game {
	height: 5em;
}
.cd-features-list .preset {
	height: 6.5em;
}
/*.cd-features-list .flicker {
	height: 58px;
}
.cd-features-list .bluelight {
	height: 58px;
}
.cd-features-list .joystick {
	height: 58px;
}
.cd-features-list .bezel {
	height: 58px;
}
.cd-features-list .stand {
	height: 58px;
}
.cd-features-list .vertical {
	height: 58px;
}
.cd-features-list .backlight {
	height: 58px;
}*/
.cd-features-list .osd {
	height: 5em;
}
.cd-features-list .input {
	height: 8em;
}
/*.cd-features-list .output {
	height: 58px;
}*/

.cd-products-wrapper {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border-style: solid;
	border-color: #e6e6e6;
	border-bottom-width: 1px;
/* 	overflow: hidden; */
	width: 100%;
}
.cd-products-columns {
	/*width: 4000px;*/
	/*margin-left: 21.2%;*/
	overflow: hidden;
	display: flex;
	width: 100%;
}
.cd-products-columns::after {
	clear: both;
	content: "";
	display: table;
}

.cd-products-columns .product {
	position: relative;
	float: left;

	text-align: center;
	-webkit-transition: opacity 0.3s, visibility 0.3s, -webkit-transform 0.3s;
	-moz-transition: opacity 0.3s, visibility 0.3s, -moz-transform 0.3s;
	transition: opacity 0.3s, visibility 0.3s, transform 0.3s;
	/*border-top: 1px solid #e6e6e6;*/
}
.filtering .cd-products-columns .product:not(.selected) {
	opacity: 0;
	visibility: hidden;
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-ms-transform: scale(0);
	-o-transform: scale(0);
	transform: scale(0);
}
.no-product-transition .cd-products-columns .product.selected {
	-webkit-transition: opacity 0.3s, visibility 0.3s;
	-moz-transition: opacity 0.3s, visibility 0.3s;
	transition: opacity 0.3s, visibility 0.3s;
	/*width: 100%;*/
}
.filtered .cd-products-columns .product:not(.selected) {
	position: absolute;
}


.cd-products-table .selected .top-info .check::before {
	/* green circle dot */
	background: #9dc997;
	border-color: #9dc997;
	-webkit-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-ms-transform: scale(1.5);
	-o-transform: scale(1.5);
	transform: scale(1.5);
	-webkit-animation: cd-bounce 0.3s;
	-moz-animation: cd-bounce 0.3s;
	animation: cd-bounce 0.3s;
}
/* @-webkit-keyframes cd-bounce {
 0% {
 -webkit-transform: scale(1);
}
 60% {
 -webkit-transform: scale(1.6);
}
 100% {
 -webkit-transform: scale(1.5);
}
}
@-moz-keyframes cd-bounce {
 0% {
 -moz-transform: scale(1);
}
 60% {
 -moz-transform: scale(1.6);
}
 100% {
 -moz-transform: scale(1.5);
}
}
@keyframes cd-bounce {
 0% {
 -webkit-transform: scale(1);
 -moz-transform: scale(1);
 -ms-transform: scale(1);
 -o-transform: scale(1);
 transform: scale(1);
}
 60% {
 -webkit-transform: scale(1.6);
 -moz-transform: scale(1.6);
 -ms-transform: scale(1.6);
 -o-transform: scale(1.6);
 transform: scale(1.6);
}
 100% {
 -webkit-transform: scale(1.5);
 -moz-transform: scale(1.5);
 -ms-transform: scale(1.5);
 -o-transform: scale(1.5);
 transform: scale(1.5);
}
}*/
.cd-products-table .selected .top-info .check::after {
	/* check icon */
	opacity: 1;
}

/*top固定時*/
@media screen and (min-width : 1199px ) {

.cd-products-comparison-table::after {
	/* never visible - this is used in jQuery to check the current MQ */
	content: 'desktop';
}

.cd-products-table.top-fixed .cd-products-columns > li,
.cd-products-table.top-scrolling .cd-products-columns > li,
.cd-products-table.top-fixed .features,
.cd-products-table.top-scrolling .features {
	padding-top: 104px;
}
.cd-products-table.top-fixed .cd-features-list,
.cd-products-table.top-scrolling .cd-features-list {
	padding-top: 290px;
}
.cd-products-table.top-fixed .top-info,
.cd-products-table.top-scrolling .top-info {
	height: 17.37em;
	position: fixed;
	top: 85px;
	z-index: 1;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
-o-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform:translate3d(0,0,0);	
-moz-transform:translate3d(0,0,0);	
-ms-transform:translate3d(0,0,0);	
-o-transform:translate3d(0,0,0);	
transform:translate3d(0,0,0);	
}
.cd-products-table.top-fixed .features .top-info,
.cd-products-table.top-scrolling .features .top-info {
	z-index: 999;
}
.cd-products-table.top-scrolling .features .top-info,
.cd-products-table.top-scrolling .top-info {
	position: absolute;
}
.cd-products-table.top-scrolling .top-info {

}
.no-cssgradients .cd-products-table.top-fixed .top-info,
.no-cssgradients .cd-products-table.top-scrolling .top-info {
	border-bottom: 1px solid #e6e6e6;
}
.cd-products-table.top-fixed .top-info::after,
.cd-products-table.top-scrolling .top-info::after {
	opacity: 1;
}
.cd-products-table.top-fixed .top-info .product_ttl,
.cd-products-table.top-scrolling .top-info .product_ttl {
	-webkit-transform: translateY(-100px);
	-moz-transform: translateY(-100px);
	-ms-transform: translateY(-100px);
	-o-transform: translateY(-100px);
	transform: translateY(-100px);
}

.cd-products-table.top-fixed .top-info .img_box,
.cd-products-table.top-scrolling .top-info .img_box {
	margin-top: 2rem;
}
.cd-products-table.top-fixed .top-info img,
.cd-products-table.top-scrolling .top-info img {
	-webkit-transform: translateY(-50px) scale(0.5);
	-moz-transform: translateY(-50px) scale(0.5);
	-ms-transform: translateY(-50px) scale(0.5);
	-o-transform: translateY(-50px) scale(0.5);
	transform: translateY(-50px) scale(0.5);
}
.cd-products-table.top-fixed .top-info .btn,
.cd-products-table.top-scrolling .top-info .btn {
	-webkit-transform: translateY(-100px);
	-moz-transform: translateY(-100px);
	-ms-transform: translateY(-100px);
	-o-transform: translateY(-100px);
	transform: translateY(-100px);
}
.cd-products-table.top-fixed .top-info .btn .btn_01,
.cd-products-table.top-scrolling .top-info .btn .btn_01 {
	padding: 1.2rem 0;
}
}
.cd-table-navigation a {
	position: absolute;
	z-index: 2;
	/*top: 0;*/
	right: 15px;
	-webkit-transform: translateY(100px);
	-moz-transform: translateY(100px);
	-ms-transform: translateY(100px);
	-o-transform: translateY(100px);
	transform: translateY(100px);
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	color: transparent;
	height: 60px;
	width: 40px;
	background: rgba(211, 47, 47, 0.9) url("../../../common/images/cd-arrow.svg") no-repeat center center;
	border-radius: 3px;
	-webkit-transition: background-color 0.3s, opacity 0.3s, visibility 0.3s, -webkit-transform 0.3s;
	-moz-transition: background-color 0.3s, opacity 0.3s, visibility 0.3s, -moz-transform 0.3s;
	transition: background-color 0.3s, opacity 0.3s, visibility 0.3s, transform 0.3s;
}
.cd-table-navigation a.prev {
	left: 210px;
	-webkit-transform: translateY(100px) translateX(15px) rotate(180deg);
	-moz-transform: translateY(100px) translateX(15px) rotate(180deg);
	-ms-transform: translateY(100px) translateX(15px) rotate(180deg);
	-o-transform: translateY(100px) translateX(15px) rotate(180deg);
	transform: translateY(100px) translateX(15px) rotate(180deg);
}
.cd-table-navigation a.prev {
	/*left: 80px;
	right: auto;
	-webkit-transform: translateY(55px) translateX(15px) rotate(180deg);
	-moz-transform: translateY(55px) translateX(15px) rotate(180deg);
	-ms-transform: translateY(55px) translateX(15px) rotate(180deg);
	-o-transform: translateY(55px) translateX(15px) rotate(180deg);
	transform: translateY(55px) translateX(15px) rotate(180deg);*/
}
.no-touch .cd-table-navigation a:hover {
	/*	background-color: #404042;*/
	background-color: #b32727;
}
.top-fixed .cd-table-navigation a {
	position: fixed;
}
.top-fixed .cd-table-navigation a, .top-scrolling .cd-table-navigation a {
	-webkit-transform: translateY(45px);
	-moz-transform: translateY(45px);
	-ms-transform: translateY(45px);
	-o-transform: translateY(45px);
	transform: translateY(45px);
}
.top-fixed .cd-table-navigation a.prev, .top-scrolling .cd-table-navigation a.prev {
	-webkit-transform: translateY(45px) translateX(15px) rotate(180deg);
	-moz-transform: translateY(45px) translateX(15px) rotate(180deg);
	-ms-transform: translateY(45px) translateX(15px) rotate(180deg);
	-o-transform: translateY(45px) translateX(15px) rotate(180deg);
	transform: translateY(45px) translateX(15px) rotate(180deg);
}
.cd-table-navigation a.inactive {
	opacity: 0;
	visibility: hidden;
}


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

No JS

-------------------------------- */
.no-js .actions {
	display: none;
}
.no-js .cd-products-table .top-info {
	height: 145px;
}

@media only screen and (min-width: 769px) {
.no-js .cd-products-table .top-info {
	height: 248px;
}
.cd-products-columns{
width: 100% !important;
	}
}



.no-js .cd-products-columns .check {
	display: none;
}

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

SP用レイアウト調整

---------------------------------------*/
@media screen and (min-width : 1399px ) {
  .cd-table-navigation{
  	display: none;
  }
}
@media screen and (max-width : 1398px ) {
  .cd-products-columns{
width: 125% !important;
	}
}
@media screen and (max-width : 991px ) {
	.cd-products-table .features {
		width: 230px;
	}
	.cd-products-columns .product {

	}
.cd-products-columns {
		        width: 720px !important;
        display: flex;
	}

	.cd-products-table .product .top-info .btn .btn_01 {
		width: 100%;
	}
	.cd-features-list .black {
		height: 5em;
	}
	.cd-features-list .input {
		height: 14em;
	}
	.cd-features-list .preset {
		height: 9.5em;
	}
	.cd-features-list .output {
		height: 4.5em;
	}
}
@media screen and (min-width : 768px ) and (max-width : 1199px )  {
	.cd-products-table.top-fixed .top-info, .cd-products-table.top-scrolling .top-info {
		/*height: 300px;*/
	}
}
@media screen and (max-width : 925px ) {
	.cd-features-list .preset{
		height: 8.5em;
	}
}
@media screen and (max-width : 915px ) {
	.cd-features-list .input {
		height: 13em;
	}
}
@media screen and (min-width : 768px ) and (max-width : 824px ) {
	.cd-features-list .output {
		height: 3.5em;
	}
}


@media screen and (max-width : 767px ) {
	.cd-products-table {
		margin-top: 3rem;
	}
	.cd-products-table .features{
		width: 180px;
	}
	.cd-table-navigation a.prev {
		left: 80px;
	}
}
@media screen and (min-width : 576px ) and (max-width : 767px ) {
  
}
@media screen and (max-width : 575px ) {
	.cd-products-comparison-table {
		font-size: 1.2rem;
	}
	.cd-products-table .product .top-info .product_ttl {
		font-size: 1.6rem;
	}
  .cd-products-table .features{
		width: 125px;
	}
	.cd-products-columns {
		width: 100%;
	}
	/*.cd-products-columns .product {
		width: 50%;
	}*/
	.cd-features-list .single_line {
		height: 4em;
		
	}

	.cd-products-table .btn .btn_01:before {
		right: 1.5rem;
	}
}
/*-----------SP用CSSここまで------------*/