:root {
  --table-desktop-column: 12;
  --table-tablet-column: 11;
}

.wrapper_content .row.desc {
	width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.wrapper_content .slide-container {
	padding-left:0;
	padding-right:0;
}
.wrapper_content .section_pdt .slick-slider .slick-arrow {
	position: absolute;
	z-index:1;
	cursor:pointer;
	top:calc(50% - (30px / 2));
	width:30px;
	height:30px;
}
.wrapper_content .section_pdt .slick-slider .prevArrow {
	left:10px;
}
.wrapper_content .section_pdt .slick-slider .nextArrow {
	right:10px;
}

.wrapper_content .section_mhl {
  background: url("../soundbars/img/MHL_mobile_1.jpg") no-repeat center;
  background-size: 100% auto;
  height: calc(928 / 1000 * 100vw);
  position: relative;
}

.wrapper_content .section_mhl .container-fluid {
  position: absolute;
  top: clamp(20px,18vw,300px);
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
}
.wrapper_content .section_mhl .txt1 {
	font-size:clamp(22px,4vw,100px);
	font-weight:800;
	color:#fff;
	filter: drop-shadow(2px 4px 6px black);
}
.wrapper_content .section_mhl .txt2 {
	font-size:clamp(12px,3vw,20px);
	color:#ccc;
	padding:10px;
	background:#333;
	background:rgba(0,0,0,0.6);
}
.wrapper_content .section_mhl .row {
	justify-content: center;
}

.wrapper_content .section_demo strong {
	font-weight:bold;
}

.section_pdt {
	background-color:#f2f2f2;
}
.section_pdt .section_header {
	text-align:center;
}
.section_pdt .section_header h1 {	
	font-weight:bold;
	margin:60px 20px 30px 20px;
}
.section_pdt .section_header a {
	position: relative;
	top:-50px;
	display:block;
}
.section_pdt .img1,
.section_pdt .img2,
.section_pdt .img3 {
	width:100%;
	height:auto;
	max-width:none;
	margin-left:auto;
	margin-right:auto;
	display:block;
}
.section_pdt .img2,
.section_pdt .img3 {
	display:none;
}
.section_pdt .desc {
	margin-top:50px;
}
.section_pdt .desc .txt {
	display: -ms-flexbox;
  display: flex;
  -ms-align-items: center;
  align-items: center;
  margin-bottom:30px;
}
.section_pdt ul {
	margin:0;
	padding:0;
  list-style-type: none;
}
.section_pdt li {
	position: relative;
	font-size:calc(14px + (18 - 14) * ((100vw - 320px) / (1440 - 320)));
	font-weight:400;
	padding-left:24px;
	padding-bottom:10px;
}
.section_pdt li:before {
	content:'';
	background:url('./img/blue-arrow.png') no-repeat;
	width:10px;/*15px*/ /*24px*/
	height:14px; /*20px*/ /*32px*/
	background-size:100% auto;
	display:block;
	position:absolute;
	top:calc(2px + (5 - 2) * ((100vw - 320px) / (1440 - 320)));
	left:0;
}
.section_pdt .price {
	color:#ff2c2c;
	font-size:40px;
	font-weight:bold;
}
.section_pdt .listprice {
	color:#000;
	font-size:16px;
	font-weight:400;
	padding-left:10px;
}
.section_pdt .btn {
	margin-top:10px;
}
.section_pdt .btn a {
	display:inline-block;
	font-size:14px;
	line-height:18px;
	font-weight:400;
	text-decoration:none;
	border-bottom:none;
	text-transform:uppercase;
	cursor:pointer;
}
.section_pdt .btn .learnmore {
	color: #fff;
	background-color: #f73c4f;
	border-radius: 32px;
  padding: 12px 25px;
}

.section_pdt .youtube_video {
	width:86vw;
	height:calc(86vw * 0.5625); /*ratio 0.5625*/
	display:block;
	margin:0 auto 30px auto;
}

@media screen and (min-width:768px) {
	.wrapper_content .row.desc {
		width:96%;
	}
	.wrapper_content .section_pdt .slick-slider .slick-arrow {
		top:calc(50% - (50px / 2));
		width:50px;
		height:50px;
	}
	.section_pdt .desc {
		margin-bottom:50px;
	}	
	.section_pdt .img1 {
		display:none;
	}
	.section_pdt .img2 {
		display:block;
	}	
	.section_pdt .btn a {
		display:inline-block;
		font-size:18px;
		line-height:22px;
	}

}

@media screen and (min-width:992px) {
	.wrapper_content .row.img_left {
		flex-direction: row-reverse;
	}
	.wrapper_content .row.img_right {
		flex-direction: row;
	}
	.section_pdt .youtube_video {
		width:48vw;
		height:calc(48vw * 0.5625); /*ratio 0.5625*/
	}
}

@media screen and (min-width:1200px) {
	.wrapper_content .section_mhl {
    background: url("../soundbars/img/MHL_1.jpg") no-repeat center;
    background-size: auto 100%;
    height: calc(928 / 2560 * 100vw);
    min-height: 350px;
  }

  .wrapper_content .section_mhl .container-fluid {
    top: 90px;
  }
	.wrapper_content .section_pdt .slick-slider .slick-arrow {
		top:calc(50% - (90px / 2));
		width:90px;
		height:90px;
	}
	.wrapper_content .section_pdt .slick-slider .prevArrow {
		left:20px;
	}
	.wrapper_content .section_pdt .slick-slider .nextArrow {
		right:20px;
	}
	.section_pdt li {
		padding-bottom:20px;
	}
	.section_pdt .desc.img_left .txt {
		padding-left:40px;
		padding-right:0;
	}
	.section_pdt .desc.img_right .txt {
		padding-left:0;
		padding-right:40px;
	}	
}

@media screen and (min-width:1440px) {
	.section_pdt .img2 {
		display:none;
	}
	.section_pdt .img3 {
		display:block;
	}
	.section_pdt p {
		font-size:18px;
	}
	.section_pdt li {
		font-size:18px;
	}
	.section_pdt li:before {
		top:6px;
	}
}

@media screen and (min-width:1920px) {
	.wrapper_content .section_mhl .container-fluid {
    top: 140px;
  }
	.wrapper_content .row.desc {
		width:92%;
	}
	.section_pdt .desc {
		margin-top:80px;
		margin-bottom:80px;
	}
	.section_pdt .desc.img_left .txt {
		padding-left:90px;
	}
	.section_pdt .desc.img_right .txt {
		padding-right:120px;
	}	
	.wrapper_content .section_pdt .slick-slider .slick-arrow {
		top:calc(50% - (126px / 2));
		width:126px;
		height:126px;
	}
	.wrapper_content .section_pdt .slick-slider .prevArrow {
		left:40px;
	}
	.wrapper_content .section_pdt .slick-slider .nextArrow {
		right:40px;
	}
}



/*table css*/
.wrapper_content .section_table {
	margin-top:30px;
	margin-bottom:30px;
}
.wrapper_content .section_table .row {
	justify-content: center;
}
.wrapper_content .section_table .table_col {
	overflow:auto;
}
.wrapper_content .table_soundbar {
	min-width:610px;
}
.wrapper_content .table_soundbar .row_header {
  display: flex;
  flex-direction: row;
}
.wrapper_content .table_soundbar .row_header > div {
	background:#3da3ed;
  float:left;  
  padding:2px 2px;
  margin:1px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  color:#fff;
  font-size:clamp(12px,3vw,24px);
  font-weight:bold;
  cursor:pointer;
}
.wrapper_content .table_soundbar .row_header > div.col_blank {
	background:none;
	cursor:initial;
}
.wrapper_content .table_soundbar .row_header > div.col1 {
	width:calc((100% / 9) - 2px);
}
.wrapper_content .table_soundbar .row_header > div.col2 {
	width:calc((100% / 9 * 2) - 2px);
}
.wrapper_content .table_soundbar .row_header > div.col3 {
	width:calc((100% / 9 * 3) - 2px);
}
.wrapper_content .table_soundbar .row_header > div.col4 {
	width:calc((100% / 9 * 4) - 2px);
}
.wrapper_content .table_soundbar .row_title,
.wrapper_content .table_soundbar .row_desc {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width:100%;
  flex-direction: row;
}
.wrapper_content .table_soundbar .row_title > div,
.wrapper_content .table_soundbar .row_desc > div {
  float:left;
  width:calc((100% / var(--table-tablet-column)) - 2px);
  padding:2px 1px;
  margin:1px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.wrapper_content .table_soundbar .title {
  background:#b4c9e4;
  color:#000;
  font-size:calc(10px + (16 - 10) * ((100vw - 320px) / (1440 - 320)));
  font-weight:700;
	text-align: center;
	flex-direction: column;
	justify-content: center;
}

.wrapper_content .table_soundbar .row_title > .sxficarrier {
	padding-bottom:50px;
	background:#b4c9e4 url('https://img.creative.com/images/products/large/pdt_23448.png?width=200&height=200') no-repeat bottom;
	background-size:50px auto;
	cursor:pointer;
}
.wrapper_content .table_soundbar .row_title > .katanav2 {
	padding-bottom:50px;
	background:#b4c9e4 url('https://img.creative.com/images/products/large/pdt_23766.png?width=200&height=200') no-repeat bottom;
	background-size:50px auto;
	cursor:pointer;
}
.wrapper_content .table_soundbar .row_title > .katanav2x {
	padding-bottom:50px;
	background:#b4c9e4 url('https://img.creative.com/images/products/large/pdt_23937.png?width=200&height=200') no-repeat bottom;
	background-size:50px auto;
	cursor:pointer;
}
.wrapper_content .table_soundbar .row_title > .katanase {
	padding-bottom:50px;
	background:#b4c9e4 url('https://img.creative.com/images/products/large/pdt_24151.png?width=200&height=200') no-repeat bottom;
	background-size:50px auto;
	cursor:pointer;
}
.wrapper_content .table_soundbar .row_title > .katana {
	padding-bottom:50px;
	background:#b4c9e4 url('https://img.creative.com/images/products/large/pdt_22919.png?width=200&height=200') no-repeat bottom;
	background-size:50px auto;
	cursor:pointer;
}
.wrapper_content .table_soundbar .row_title > .stage360 {
	padding-bottom:50px;
	background:#b4c9e4 url('https://img.creative.com/images/products/large/pdt_23717.png?width=200&height=200') no-repeat bottom;
	background-size:50px auto;
	cursor:pointer;
}
.wrapper_content .table_soundbar .row_title > .stagev2 {
	padding-bottom:50px;
	background:#b4c9e4 url('https://img.creative.com/images/products/large/pdt_23607.png?width=200&height=200') no-repeat bottom;
	background-size:50px auto;
	cursor:pointer;
}
.wrapper_content .table_soundbar .row_title > .stage {
	padding-bottom:50px;
	background:#b4c9e4 url('https://img.creative.com/images/products/large/pdt_23279.png?width=200&height=200') no-repeat bottom;
	background-size:50px auto;
	cursor:pointer;
}
.wrapper_content .table_soundbar .row_title > .stagese {
	padding-bottom:50px;
	background:#b4c9e4 url('https://img.creative.com/images/products/large/pdt_24120.png?width=200&height=200') no-repeat bottom;
	background-size:50px auto;
	cursor:pointer;
}
.wrapper_content .table_soundbar .row_title > .stageairv2 {
	padding-bottom:50px;
	background:#b4c9e4 url('https://img.creative.com/images/products/large/pdt_23889.png?width=200&height=200') no-repeat bottom;
	background-size:50px auto;
	cursor:pointer;
}
.wrapper_content .table_soundbar .row_title > .stageair {
	padding-bottom:50px;
	background:#b4c9e4 url('https://img.creative.com/images/products/large/pdt_23276.png?width=200&height=200') no-repeat bottom;
	background-size:50px auto;
	cursor:pointer;
}

.wrapper_content .table_soundbar .row_desc .desc_title {
  background:#3da3ed;
  color:#fff;
  font-size:calc(21px + (24 - 21) * ((100vw - 1440px) / (2560 - 1440)));
  font-weight:700;
  width:100%;
  justify-content: center;
}
.wrapper_content .table_soundbar .row_desc.last .desc_title {
	background:none;
}
.wrapper_content .table_soundbar .desc {
  background:#f2f2f2;
  color:#000;
  font-size:calc(8px + (14 - 8) * ((100vw - 320px) / (1440 - 320)));
  justify-content: left;
  align-items: flex-start;
}
.wrapper_content .table_soundbar .row_desc.last .desc {
	background:none;
	justify-content: center;
}
.wrapper_content .table_soundbar .row_desc.last a,
.wrapper_content .table_soundbar .row_desc.last a:hover {
	background-color:#f73c4f;
	color:#fff;
	opacity:1;
	filter: alpha(opacity=100);	
	line-height:1.1;
	height:auto;
	padding:10px;
}

.section_table ul {
	padding-left:0;
	list-style-type: none;
}

.section_table li {
	padding-bottom:6px;
}

@media screen and (min-width:768px) {
	.wrapper_content .table_soundbar .row_title > .sxficarrier,
	.wrapper_content .table_soundbar .row_title > .katanav2,
	.wrapper_content .table_soundbar .row_title > .katanav2x,
	.wrapper_content .table_soundbar .row_title > .katanase,
	.wrapper_content .table_soundbar .row_title > .katana,
	.wrapper_content .table_soundbar .row_title > .stage360,
	.wrapper_content .table_soundbar .row_title > .stagev2,
	.wrapper_content .table_soundbar .row_title > .stage,
	.wrapper_content .table_soundbar .row_title > .stagese,
	.wrapper_content .table_soundbar .row_title > .stageairv2,
	.wrapper_content .table_soundbar .row_title > .stageair {
		padding-bottom:80px;
		background-size:80px auto;		
	}
	.wrapper_content .table_soundbar ul {
		padding-left:18px;
		list-style-type: disc;
	}
}

@media screen and (min-width:992px) {
  .wrapper_content .table_soundbar .row_header > div,
  .wrapper_content .table_soundbar .row_title > div,
  .wrapper_content .table_soundbar .row_desc > div,
  .wrapper_content .table_soundbar .row_desc .desc_title {
    width:calc((100% / var(--table-desktop-column)) - 10px);
    padding:5px 5px;
    margin:4px;
  }
  .wrapper_content .table_soundbar .row_header > div.col1 {
  	width:calc((100% / var(--table-desktop-column)) - 10px);
  }
  .wrapper_content .table_soundbar .row_header > div.col2 {
  	width:calc((100% / var(--table-desktop-column) * 2) - 12px);
  }
  .wrapper_content .table_soundbar .row_header > div.col3 {
  	width:calc((100% / var(--table-desktop-column) * 3) - 14px);
  }
  .wrapper_content .table_soundbar .row_header > div.col4 {
  	width:calc((100% / var(--table-desktop-column) * 4) - 16px);
  }
  .wrapper_content .table_soundbar .row_desc .desc_title {
    justify-content:flex-start;
  }
  .wrapper_content .table_soundbar .row_desc.last a,
	.wrapper_content .table_soundbar .row_desc.last a:hover {
		font-size:18px;
		padding-left:20px;
		padding-right:20px;
	}
}

@media screen and (min-width:1200px) {
	.section_table {
		margin-top:60px;
		margin-bottom:60px;
	}
	.wrapper_content .table_soundbar .row_title > .sxficarrier,
	.wrapper_content .table_soundbar .row_title > .katanav2,
	.wrapper_content .table_soundbar .row_title > .katanav2x,
	.wrapper_content .table_soundbar .row_title > .katanase,
	.wrapper_content .table_soundbar .row_title > .katana,
	.wrapper_content .table_soundbar .row_title > .stage360,
	.wrapper_content .table_soundbar .row_title > .stagev2,
	.wrapper_content .table_soundbar .row_title > .stage,
	.wrapper_content .table_soundbar .row_title > .stagese,
	.wrapper_content .table_soundbar .row_title > .stageairv2,
	.wrapper_content .table_soundbar .row_title > .stageair {
		padding-bottom:100px;		
		background-size:100px auto;		
	}
}

@media screen and (min-width:1440px) {
  .wrapper_content .table_soundbar .title {
    font-size:calc(16px + (21 - 16) * ((100vw - 1440px) / (2560 - 1440)));
  }
  .wrapper_content .table_soundbar .desc {
  	font-size:calc(16px + (21 - 16) * ((100vw - 1440px) / (2560 - 1440)));
  }
}

@media screen and (min-width:1920px) {
	.wrapper_content .table_soundbar .row_title > div,
  .wrapper_content .table_soundbar .row_desc > div,
  .wrapper_content .table_soundbar .row_desc .desc_title {
    padding:15px 20px;
  }  
}

@media screen and (min-width:2560px) {
  .wrapper_content .table_soundbar .title {
    font-size:21px;
  }
  .wrapper_content .table_soundbar .row_desc .desc_title {
    font-size:24px;
  }
  .wrapper_content .table_soundbar .desc {
  	font-size:21px;
  }
}


@media screen and (max-width:991px) {
  /*hide compatibility table column 4 coz no space*/
  /*.wrapper_content .table_soundbar .row_title > div:nth-of-type(4),
  .wrapper_content .table_soundbar .row_desc > div:nth-of-type(4) {
    display:none;
  }*/

  /*hide table empty column on mobile*/
  .wrapper_content .table_soundbar .row_header > div.col_blank,
  .wrapper_content .table_soundbar .row_title > div.col_blank,
  .wrapper_content .table_soundbar .row_desc > div.col_blank {
    display:none;
  }
}