@charset "UTF-8";

/* CSS Document */
:root {
	--space-step: 0.5rem; /* 间距递进步长 */
	--space-1: clamp(0.5rem, 2%, 0.75rem);
	--space-2: clamp(1rem, 2vw, 1.5rem);
	--space-3: clamp(1.5rem, 3vw, 2.5rem);
}
body {
	width: 100%;
	background: rgba(0, 0, 0, 1);
	color: rgba(255, 255, 255, 1);
}

@font-face {
	font-family: 'ITC_240';
	src: url(../share-font/ITC_MACHINE_med_240.woff2);
	font-display: swap;
}

@font-face {
	font-family: 'ITC_180';
	src: url(../share-font/ITC_MACHINE_med_180.woff2);
	font-display: swap;
}

/* 清除默认样式 */

.of {
	overflow: hidden;
}

.clear {
	clear: both;
}

ul,
ol,
li {
	list-style-type: none;
}

input,
button {
	border-radius: 0px;
	-webkit-appearance: none;
}

a {
	color: rgba(255, 255, 255, 1);
	text-decoration: none;
}

img {
	padding: 0;
	margin: 0;
	border: 0;
	max-width: 100%;
	height: auto;
}

.swiper {

	--swiper-theme-color: #e6e6e6;
	/* 设置Swiper风格 */
	--swiper-pagination-color: #e6e6e6;
	/* 单独设置分页器样式 */
	--swiper-navigation-size: 30px;
	/* 设置按钮大小 */
}

/***--- 页眉---***/
.header .nav-warp {
	width: 90%;
	/* 与之前版本有修改 */
	margin: 0 auto;
}

.header .logo p {
	color: rgba(255, 255, 255, 0.5);
	letter-spacing: 0.53rem;
	/* 字间距 */
	font-size: 0.875rem;
	margin-top: -4%;
}

.header li a {
	display: block;
	line-height: 2rem;
	color: rgba(255, 255, 255, 0.8);
	font-size: 1rem;
	padding: 0 1rem;
	transition: 0.5s;
	position: relative;
}

.header li:hover a,
.header li.on a {
	color: #fff;
	font-weight: bold;
}


@media (max-width:1600px) {
	.header .nav-warp {
		width: 80%;
	}
}

@media (max-width:1024px) {
	.header .nav-warp {
		width: 90%;
	}
}

@media (max-width: 768px) {
	.header li a::after {
		width: 0;
		height: 0;
	}

	.navbar-toggler-icon {
		width: 1.2em;
		height: 1.2em;
	}
}

@media (max-width:400px) {
	.nav-warp .logo p {
		display: none;
	}

	.nav-warp .logo img {
		width: 80%;
	}
}

/* 首页轮播图 2024-03-18 */

/* slide2覆盖层样式 2025-03-06 */
.swiper .swiper-slide .overlay-content {
  position: absolute;
  top: 40%;
  transform: translateY(-50%);
  padding: 20px;
  border-radius: 5px;
  color: #fff;
  text-align: left;   /* 文字右对齐 */
  max-width: 40%;      /* 根据需求限制宽度 */
}
/* 三排文字样式 */
.overlay-content p {
  margin: 0;    /* 每行文字底部间距 */
  margin-bottom: 12px;
  line-height: 1.5;
  font-size: clamp(1rem, 2vw, 1.5rem);
  /* 如果需要，可以考虑加上 padding-bottom 作为补充 */
    /* padding-bottom: 4px; */
  color: #fff;
  /* 使用更柔和的文字阴影 */
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    letter-spacing: 0.5px;
}
.overlay-content p.line1 {
  font-size: clamp(2rem, 4vw, 3rem); /* 根据需要调整字体大小 */
  color: transparent;               /* 设置文字填充为透明 */
  -webkit-text-stroke: 2px #fff;      /* 添加 1px 白色描边，实现镂空效果 */
 
}
/* 如需微调不同排文字间距，可单独设置 */
.overlay-content p:last-of-type {
  margin-bottom: 2rem; /* 最后一行和按钮之间的额外间距 */
}

/* 按钮样式 */
.overlay-btn {
  display: inline-block;
  /* 自动调整的内边距，调整按钮大小 */
  padding: clamp(4px, 1vw, 8px) clamp(8px, 2vw, 16px);
  border: 0.1em solid #fff; /* 白色边框 */
  background: transparent; /* 无背景颜色 */
  color: #fff;
  text-decoration: none;
  border-radius: 5px;
  font-size: clamp(0.8rem, 1.5vw, 1rem);
  transition: color 0.3s ease, background 0.3s ease;
}
/* 鼠标悬停效果，可选：添加轻微背景色 */
.overlay-btn:hover {
 background: rgba(255, 255, 255, 0.2);
 color: #fff;
 font-weight: bold;
}
/* slide2覆盖层样式结束  2025-03-06*/

/* end 首页轮播图 2024-03-18 */

/* 新品 NewProduct 2024-03-18 */

.MainProducts h3 {
	font-size: 2.5rem;
	line-height: 2;
}
.MainProducts p {
	font-size: 1.5rem;
	color: rgba(255, 255, 255, .8);
}
.MainProducts .card-body>a {
	color: rgba(255, 255, 255, .8);
	font-size: 1.2rem;
}
/* 测试产品推荐 */
.MainProducts .product-title {
	display: grid;
	grid-template-columns: repeat(4,1fr);
	grid-gap: 1em;
	border: green solid 1px;
}
.MainProducts .product-title>div {
	text-align: center;
}
.MainProducts .product-title .img-link {
	position: relative;
	text-decoration: none;
	font-size: 0;
}
.MainProducts .product-title .img-link .img-container {
	position: relative;
	perspective: 750px; /* 与Z平面的距离 */
}
.MainProducts .product-title .img-link .img-container img {
	width: 87.5%;
	max-width: 540px;
	transform-origin: 50% 50% -130px;
	transition: all .333s cubic-bezier(.65,0,.35,1);
}
/* @supports selector(:nth-child(1 of x)) .MainProducts .product-title .img-link .img-container.komodo img {
	transform: translateZ(-105px);
} */ /* 根据W3 CSS检验后作修改  2025-03-06 */
@supports selector(:nth-child(1 of x)) {
    .MainProducts .product-title .img-link .img-container.komodo img {
        transform: translateZ(-105px);
    }
}
}
.MainProducts .product-title .img-link .img-container.komodo img {
	transform-origin: 50% 50% -105px;
}
.MainProducts .product-title .img-link .img-container img.angle-front {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	opacity: 0;
	transform: rotateY(90deg);
}
.MainProducts .product-title h3 {
	font-size: 20px;
	margin: 0.6em 0 0.4em;
	font-family: 'ITC_180', Arial Black, sans-serif;
	font-weight: 400;
}
.MainProducts .product-title a {
	color: #fff;
	font-size: 16px;
	text-transform: uppercase;
	transition: all .25s cubic-bezier(.33,1,.68,1);
	cursor: default;
	margin: 0 10px;
}
.MainProducts a[href] {
	cursor: pointer;
	text-decoration: underline;
}
.MainProducts .above {
	position: relative;
	z-index: 1;
} 
/* @supports selector(:nth-child(1 of x))
.MainProducts .product-title .img-link .img-container.v-raptor img {
	transform: translateZ(-133px);
} */ /* 根据W3 CSS检验后作修改  2025-03-06 */
@supports selector(:nth-child(1 of x)) {
    .MainProducts .product-title .img-link .img-container.v-raptor-xl img {
        transform: translateZ(-133px);
    }
}
.MainProducts .product-title .img-link .img-container.v-raptor img {
	transform-origin: 50% 50% -133px;
}
@supports selector(:nth-child(1 of x)) {
    .MainProducts .product-title .img-link .img-container.v-raptor-xl img {
        transform: translateZ(-150px);
    }
}
.MainProducts .product-title .img-link .img-container.v-raptor-xl img {
	transform-origin: 50% 50% -150px;
}
/* end 测试产品推荐 */
/*  end 产品推荐(主要产品)MainProducts 2024-03-18 */
/* 巨幅样式 */
.banner strong {
	width: 60%;
	top: 40%;
	font-size: 2rem;
}

/* 当宽度介于 600px 和 900px 之间的外观 */
@media screen and (max-width: 1198px) and (min-width: 576px) {
	.banner strong {
		font-size: 1.25rem;
	}
}

@media screen and (max-width:575px) {
	.banner strong {
		display: none;
	}
}

/* 巨幅样式 */
/* 更改card背景颜色 */
.card-body {
	background: rgba(0, 0, 0, 1);
	color: rgba(255, 255, 255, 0.7);
}

.card-body>a {
	color: rgba(255, 255, 255, 0.7);
	font-size: 0.75rem;
}

.my-ul>li {
	font-size: 0.875rem;
	color: rgba(255, 255, 255, 0.8);
}

.my-ul>li>a {
	font-size: 0.8rem;
	color: rgba(255, 255, 255, 0.8);
}

/* 3D解决方案下样式 */

/* 标题下logo */
.pr-logo {
	display: block;
}

@media screen and (max-width:575px) {
	.pr-logo {
		display: none;
	}
}

/* 标题下logo */

/*** 页脚样式 ***/
@media only screen and (max-width: 768px) {
	.footer-center ul li {
		padding: 0 2%;
		display: block;
		text-align: left;
	}

	.footer-WX {
		width: 90%;
		line-height: 2rem;
		margin-bottom: 1%;

	}
}

/*** end页脚样式 ***/

/* 首页样式 */
/* 新品 */
.title-conter {
	font-size: 1rem;
}

@media only screen and (max-width: 768px) {
	.new-product {
		max-width: 95%;
		margin: auto;
		display: block;
	}

	.new-product-img {
		width: 100%;
	}

	.new-product-img img {
		max-width: 100%;
	}

	.new-product-title {
		width: 100%;
	}

	.new-product-title h3 {
		font-size: 1.125rem;
		text-align: center;
	}

	.new-product-title .title-conter {
		font-size: 0.75rem;
	}
}

/* end 首页样式 */

/* 3D解决方案下样式  end */

/* 产品介绍下样式 */
.classText {
	color: rgba(255, 255, 255, 0.8);
	font-size: 0.875rem;
}

.classText:hover {
	color: rgba(255, 255, 255, 1);
	font-size: 1rem;
}

@media only screen and (max-width: 768px) {
	.classText {
		height: 100%;
		align-content: center;
	}

	.classText a {
		max-height: 100%;
	}
}

/* end 产品介绍下样式 */

/* RED主页样式 */


/* slide样式 */
.mySwiper {
	position: relative;
}

.mySwiper-wrap {
	max-width: 100%;
	margin-bottom: 0;
	height: 95vh;
	/* 760px */
	width: 100%;
	overflow: hidden;
}

/* slide one */
.power-of-red {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-image: url(../Red/RedHomeImage/hp-slider-bg-power-of-red-desktop.jpg);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	background-position: 50% 50%;
	background-size: cover;
}

.power-of-red .slide-content {
	min-width: 300px;
	width: 25vw;
	max-width: 449px;
	margin: 0 11.875%;
}

.power-of-red .slide-content img {
	margin: 0 auto;
	max-width: 100%;
}

.power-of-red .slide-content .cta {
	margin-top: 2em;
}

.img-btn {
	display: block;
	text-align: center;
	border: 1px solid #fff;
	font-weight: 100;
	font-size: 1.125rem;
	transition: color .3s ease-in-out, background-color .3s ease-in-out;
	color: #fff;
	width: 40%;
	/* 275px */
	margin: auto;
	line-height: 2rem;
	/* 3.25rem */
	border-radius: 5px;
	-moz-border-radius: 5px;
}

.img-btn:hover {
	color: #fff;
	background: rgba(0, 0, 0, .5);
	font-weight: bolder;
}

/* end slide one */

/* slide two */
.v-raptor-production-pack {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-image: url(../Red/RedHomeImage/hp-slider-bg-production-pack-desktop.jpg);
	background-repeat: no-repeat;
	display: flex;
	background-position: 50% 50%;
	background-size: cover;
}

.v-raptor-production-pack .slide-content {
	margin-left: 2%;
	width: 50%;
	margin-top: 20%;
}

.v-raptor-production-pack .overlay {
	text-align: center;
}

.v-raptor-production-pack .slide-content .overlay img {
	width: 105.802px;
	height: 124.061px;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 25px;
}

.v-raptor-production-pack .slide-content .overlay h1,
.v-raptor-production-pack .slide-content .overlay h2 {
	letter-spacing: .025em;
}

.v-raptor-production-pack .slide-content .overlay h1 {
	font-family: 'ITC_240';
	font-size: 80px;
	line-height: .85;
	margin-top: 0.0555em;
}

.v-raptor-production-pack .slide-content .overlay h2 {
	font-family: 'ITC_180';
	font-size: 45px;
	line-height: 1;
	color: #000;
	text-shadow: 0 0 1px white, 1px 0 0 white, 0 1px 0 white,
		-1px 0 0 white, 0 -1px 0 white, 1px 1px 0 white,
		-1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white;
}

.v-raptor-production-pack .img-btn {
	margin-top: 1rem;
	width: 20%;
}

/* end slide two */

/* slide three */
.v-raptor-xl {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-image: radial-gradient(circle at 50% 75%, rgba(0, 0, 0, .5) 0, rgba(0, 0, 0, 0) 40%), url(../Red/RedHomeImage/hp-slider-bg-v-raptor-xl.jpg);
	background-repeat: no-repeat;
	display: flex;
	justify-content: center;
	background-position: 50% 50%;
	background-size: cover;
}

.v-raptor-xl .slide-content {
	height: 100%;
	display: flex;
	align-items: flex-end;
	margin-top: 3%;
}

.v-raptor-xl .overlay {
	text-align: center;
	margin-bottom: 30vh;
}

.v-raptor-xl .overlay h1,
.v-raptor-xl .overlay p {
	font-weight: 400;
	color: #fff;
	white-space: nowrap;
	margin: 0;
	text-shadow: 0 0 32px black;
}

.v-raptor-xl .overlay h1 {
	text-transform: uppercase;
	font-family: 'ITC_240';
	font-size: 3.5625rem;
	line-height: 1;
	left: .025em;
	margin-top: .0555em;
}

.v-raptor-xl .overlay p {
	font-size: 1.375rem;
	line-height: 1.2;
}

.v-raptor-xl .cta {
	margin-top: 2em;
}

.v-raptor-xl .cta .img-btn {
	width: 30%;
}

/* end slide three */

/*** end slide样式 ***/

/* RED新产品 */
.New_product {
	margin-top: 3%;
}

.product_title h1 {
	font-weight: 500;
	font-family: 'ITC_240';
	-webkit-font-smoothing: antialiased;
	/* chrome、safari文字抗锯齿 */
	-moz-osx-font-smoothing: grayscale;
	/*firefox*/
	-webkit-text-stroke: 2px white;
	-webkit-text-fill-color: rgba(0, 0, 0, .5);
	color: #00000080;
	font-size: 3rem;
	line-height: 1;
	margin-top: 3rem;
}

.product_title p {
	font-size: 1.25rem;
	line-height: 1.5;
}

/*end RED新产品 */

/*** RED主页产品 ***/
.camera {
	background: linear-gradient(black, #222 70%, black);
	padding: 5em 0;
}

.camera-title {
	text-align: center;
	max-width: 35.625rem;
	margin: 0 auto -1em;
	padding: 0 2em;
}

.camera-title h2 {
	color: #fff;
	font-family: 'ITC_180';
	font-size: 1.625rem;
	letter-spacing: 0.625rem;
}

.camera-title p {
	margin: 0;
	color: #fff;
	font-size: 0.875rem;
	line-height: 1.6;
}

.red-product-title a {
	color: #fff;
	font-size: 1rem;
	text-transform: uppercase;
	transition: all .25s cubic-bezier(.33, 1, .68, 1);
	cursor: default;
	margin: 0 10px;
}

.red-product-title .img-link {
	position: relative;
	text-decoration: none;
	font-size: 0;
}

.red-product-title .img-link .img-container {
	position: relative;
	perspective: 750px;
	/* 多少像素的3D元素是从视图的perspective属性定义。这个属性允许你改变3D元素是怎样查看透视图 */
	-webkit-perspective: 750px;
	/* Safari and Chrome */
}

.red-product-title .img-link .img-container img {
	width: 87.5%;
	max-width: 33.75rem;
	transform-origin: 50% 50% -130px;
	/* 旋转元素的基点位置:X轴,Y轴,Z轴 */
	-ms-transform-origin: 50% 50% -130px;
	/* IE 9 */
	-webkit-transform-origin: 50% 50% -130px;
	/* Safari and Chrome */
	transition: all .333s cubic-bezier(.65, 0, .35, 1);
}

.red-product-title .img-link .img-container.komodo img {
	transform-origin: 50% 50% -105px;
	/* 旋转元素的基点位置:X轴,Y轴,Z轴 */
	-ms-transform-origin: 50% 50% -105px;
	/* IE 9 */
	-webkit-transform-origin: 50% 50% -105px;
	/* Safari and Chrome */
}

.red-product-title .angle-front {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	opacity: 0;
	/* 0 */
	transform: rotateY(90deg);
	-ms-transform: rotateY(90deg);
	/* IE 9 */
	-webkit-transform: rotateY(90deg);
	/* Safari and Chrome */
}

.komodo:hover img:last-child {
	opacity: 1;
	/* 0 */
	transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	/* IE 9 */
	-webkit-transform: rotateY(0deg);
	/* Safari and Chrome */
}

.komodo:hover .angle-right {
	transform: rotateY(-90deg);
	-ms-transform: rotateY(-90deg);
	/* IE 9 */
	-webkit-transform: rotateY(-90deg);
	/* Safari and Chrome */
	opacity: 0;
}

.camera h3 {
	font-weight: 400;
	line-height: 1.2;
	color: #fff;
	text-transform: uppercase;
	font-family: 'ITC_180';
	font-size: 1.25rem;
	margin: 0.6em 0.25em 1.2em;
}

.camera h3 b {
	font-family: 'ITC_240';
}

.camera .a-button {
	font-size: 1rem;
}

.red-product-title .img-link .img-container.v-raptor img {
	transform-origin: 50% 50% -133px;
	/* 旋转元素的基点位置:X轴,Y轴,Z轴 */
	-ms-transform-origin: 50% 50% -133px;
	/* IE 9 */
	-webkit-transform-origin: 50% 50% -133px;
	/* Safari and Chrome */
}

.v-raptor:hover img:last-child {
	opacity: 1;
	/* 0 */
	transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	/* IE 9 */
	-webkit-transform: rotateY(0deg);
	/* Safari and Chrome */
}

.v-raptor:hover .angle-right {
	transform: rotateY(-90deg);
	-ms-transform: rotateY(-90deg);
	/* IE 9 */
	-webkit-transform: rotateY(-90deg);
	/* Safari and Chrome */
	opacity: 0;
}

.red-product-title .img-link .img-container.v-raptorXL img {
	transform-origin: 50% 50% -150px;
	/* 旋转元素的基点位置:X轴,Y轴,Z轴 */
	-ms-transform-origin: 50% 50% -150px;
	/* IE 9 */
	-webkit-transform-origin: 50% 50% -150px;
	/* Safari and Chrome */
}

.v-raptorXL:hover img:last-child {
	opacity: 1;
	/* 0 */
	transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	/* IE 9 */
	-webkit-transform: rotateY(0deg);
	/* Safari and Chrome */
}

.v-raptorXL:hover .angle-right {
	transform: rotateY(-90deg);
	-ms-transform: rotateY(-90deg);
	/* IE 9 */
	-webkit-transform: rotateY(-90deg);
	/* Safari and Chrome */
	opacity: 0;
}

/*** RED主页产品 ***/
@media (max-width:768px) {
	.mySwiper-wrap {
		height: 80vh;
	}

	.power-of-red .slide-content img {
		position: absolute;
		top: 6%;
		left: 0;
		right: 0;
		width: 40%;
	}

	.img-btn {
		position: absolute;
		bottom: 15%;
		left: 0;
		right: 0;
		width: 20%;
	}

	.v-raptor-production-pack {
		background-position: 90% 0%;
	}

	.v-raptor-production-pack .slide-content {
		width: 80%;
		margin-top: 2%;
		margin-left: auto;
		margin-right: auto;
	}

	.v-raptor-production-pack .slide-content .overlay img {
		opacity: 0;
	}

	.v-raptor-production-pack .slide-content .overlay h1 {
		font-size: 3.125rem;
		margin-top: -20%;
		white-space: nowrap;

	}

	.v-raptor-production-pack .slide-content .overlay h2 {
		font-size: 1.875rem;
		white-space: nowrap;
	}

	.v-raptor-xl .slide-content {
		align-items: flex-start;
	}

	.v-raptor-xl .overlay h1 {
		font-size: 3rem;
		margin-top: .5em;
	}

	.v-raptor-xl .overlay p {
		font-size: 1.25rem;
	}

	.v-raptor-xl .cta .img-btn {
		width: 18%;
	}

	.product_title h1 {
		font-size: 2.5rem;
		line-height: 2;
	}
}



/* 大屏幕:大于等于1200px */
@media (min-width:1200px) {}

/* 默认 */
@media (min-width:980px) {}

/* 平板电脑和小屏电脑之间的分辨率 */
@media (min-width:768px) and (max-width:979px) {}

/* 横向放置的手机和竖向放置的平板之间的分辨率 */
@media (max-width:767px) {}

/* 横向放置的手机及分辨率更小的设备 */
@media (max-width:480px) {}

/*  end RED主页样式 */

/* RED RANGER样式 */
.img-text {
	padding-left: 10%;
}

.img-text p {
	font-size: 0.75rem;
	line-height: 2;
}

.img-text ul li {
	font-size: 0.875rem;
	line-height: 1.8;
}

.sensor-size ul li {
	font-size: 0.875rem;
	line-height: 1.8;
}

.sensor-size .card {
	border: none;
}

/* 为选项卡设置样式 */
.Technical {
	padding-top: 1.25rem;
	padding-bottom: 1.875rem;
	font-size: 1rem;
	overflow: hidden;
	/* 溢出框内容不可见 */
}

/* 为用于打开选项卡内容的按钮设置样式 */
.Technical button {
	margin: 0;
	padding: 0;
	border: none;
	outline: none;
	cursor: pointer;
	width: 20%;
	background-color: #000;
	color: rgba(255, 255, 255, 0.5);
	border: 1px solid #777;
	transition: 0.3s;
}

/* 更改悬停按钮的背景颜色 */
.Technical button:hover {
	color: rgba(255, 255, 255, 0.8);
	border: 1px solid #fff;
}

/* 创建一个活动的/当前的 tablink 类 */
.Technical button.active {
	color: rgba(255, 255, 255, 1);
	border: 1px solid #fff;
}

.tabcontent {
	display: none;
	animation: fadeEffect 1s;
	/* 褪色效果需要 1 秒 */
}

/* 从零到完全不透明度 */
@keyframes fadeEffect {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.tabcontent th {
	width: 28%;
	text-align: start;
}

.tabcontent td {
	width: 72%;
	text-align: start;
}

.tabcontent tr {
	border-style: none none dotted none;
	border-width: 0.0625rem;
	border-bottom-color: rgba(255, 255, 255, 0.2);
	line-height: 2;
}

@media (min-width:1400px) {
	.img-text p {
		font-size: 1.125rem;
	}

	.img-text h3 {
		font-size: 2rem;
	}

	.img-text ul {
		font-size: 1.25rem;
		line-height: 1.5;
	}

	.sensor {
		font-size: 2rem;
	}
}

/* 横向放置的手机和竖向放置的平板之间的分辨率 */
@media (max-width:767px) {
	.Technical {
		padding-top: 0.75rem;
		padding-bottom: 0.75rem;
		font-size: 0.625rem;
	}

	.Technical button {
		margin: 0.5rem;
		width: 30%;
	}

	.tabcontent img {
		padding-bottom: 1rem;
	}

	.tabcontent th {
		width: 35%;
	}

	.tabcontent td {
		width: 65%;
		padding-left: 1%;
	}
}

/* end .. RED RANGER样式 */

/* RED V-raptor-xl样式 */
.vr-xl {
	background-color: #000;
	background-image: linear-gradient(black, #222 720px, black 1080px);
	width: 100%;
	-moz-osx-font-smoothing: grayscale;
	font-size: 0.9375rem;
	color: #fff;
}

.vr-xl section {
	width: 100%;
	margin: 0;
	font-size: inherit;
	text-align: center;
	padding: 6em 0;
}

.vr-xl .hero,
.vr-xl .xl-pack,
.vr-xl .xl-s35 {
	padding: 2em 7.5%;
	overflow: hidden;
}

.vr-xl .vr-xl-title {
	margin-bottom: 3em;
}

.vr-xl h1,
.vr-xl h2,
.vr-xl h3,
.vr-xl h4,
.vr-xl h5,
.vr-xl p,
.vr-xl ul {
	color: #fff;
	line-height: 1.5;
	padding: 0;
	text-transform: uppercase;
}

.vr-xl h1 {
	font-weight: 400;
	font-family: 'ITC_240';
	-webkit-font-smoothing: antialiased;
	/* 字体更清晰 */
	-moz-osx-font-smoothing: grayscale;
	-webkit-text-stroke: 2px white;
	/* 宽度和颜色属性:<length>文本宽 <color>文本颜色 */
	-webkit-text-fill-color: rgba(0, 0, 0, .5);
	/* 文字填充颜色 */
	color: #00000080;
	font-size: 3em;
	font-size: clamp(30px, 3em, 45px);
	/* 最小值、首选值、最大值 */
	line-height: 1;
	margin: .16667em 0;
}

.vr-xl p,
.vr-xl a {
	font-size: 1em;
	font-size: clamp(12px, 1em, 15px);
	margin-bottom: 1em;
}

.vr-xl .vr-xl-title p {
	max-width: 640px;
	margin-left: auto;
	margin-right: auto;
}

.vr-xl .hero .vr-xl-content {
	position: relative;
}

.vr-xl .hero .vr-xl-content .visual {
	width: 100%;
}

.vr-xl .hero .vr-xl-content .visual .scene {
	position: relative;
	min-width: 550px;
	width: 550px;
	max-width: 100%;
	height: 450px;
	perspective: 1000px;
	/* 其子元素(3D元素)会获得透视效果,而不是元素本身 */
	left: 50%;
	transform: translate(-50%);
}

.vr-xl .hero .vr-xl-content .visual .vr-xl-cube {
	pointer-events: none;
	/* 用于设置元素是否对鼠标事件做出反应auto|none */
	width: 100%;
	height: 100%;
	position: relative;
	transform-style: preserve-3d;
	transform-origin: 50% 50%;
	transform: translateZ(-275px);
	transition: all .333s cubic-bezier(.65, 0, .35, 1);
}

.vr-xl .hero .vr-xl-content .visual .vr-xl-cube.xl-show-right {
	transform: translateZ(-275px) rotateY(-90deg);
}

.vr-xl .hero .vr-xl-content .visual .vr-xl-cube .xl-side {
	position: absolute;
	width: 550px;
	height: 450px;
	-webkit-backface-visibility: hidden;
	transition: inherit;
}

.vr-xl .hero .vr-xl-content .visual .vr-xl-cube .xl-side.xl-front {
	background: url(../Red/v-raptor-xl-img/v-raptor-xl-front.png);
	transform: rotateY(0) translateZ(175px);
}

.vr-xl .hero .vr-xl-content .visual .vr-xl-cube .xl-side.xl-back {
	background: url(../Red/v-raptor-xl-img/v-raptor-xl-back.png);
	transform: rotateY(180deg) translateZ(240px);
}

.vr-xl .hero .vr-xl-content .visual .vr-xl-cube .xl-side.xl-right {
	background: url(../Red/v-raptor-xl-img/v-raptor-xl-right.png);
	transform: rotateY(-90deg) translateZ(170px);
}

.vr-xl .hero .vr-xl-content .visual .vr-xl-cube .xl-side.xl-left {
	background: url(../Red/v-raptor-xl-img/v-raptor-xl-left.png);
	transform: rotateY(90deg) translateZ(140px);
}

.vr-xl .hero .vr-xl-content .xl-bullets {
	pointer-events: none;
	height: 450px;
	width: 100%;
	max-width: 1550px;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 550px;
}

.vr-xl h5,
.vr-xl ul {
	font-size: 1.0667em;
	font-size: clamp(12px, 1.06667em, 16px);
}

.vr-xl ul {
	text-align: left;
	margin: 2em 0;
}

.vr-xl .hero .vr-xl-content .xl-bullets ul:first-child {
	width: calc(100% - 525px);
	/* 动态计算长度值，运算符前后都需要保留一个空格 */
}

.vr-xl .hero .vr-xl-content .xl-bullets ul:last-child {
	width: calc(100% - 525px);
}

.vr-xl li {
	margin-bottom: 1.5em;
}

.vr-xl .hero .vr-xl-content .xl-bullets ul li {
	font-size: inherit;
}

.vr-xl h2,
.vr-xl h3 {
	font-weight: 400;
	font-family: 'ITC_180';
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.vr-xl h3 {
	font-size: 1.73334em;
	font-size: clamp(17px, 1.73334em, 26px);
}

.vr-xl .hero .vr-xl-content .xl-bullets ul li h3 {
	line-height: 1.5;
}

.vr-xl .xl-pack .vr-xl-content {
	display: flex;
	justify-content: center;
	margin-bottom: 1.75em;
	gap: 6em;
}

.vr-xl .xl-pack .vr-xl-content ul,
.vr-xl .xl-pack .vr-xl-content li {
	list-style-type: "- ";
	list-style-position: outside;
}

@media (max-width:768px) {
	.vr-xl {
		font-size: 0.75rem;
	}

	.vr-xl .hero,
	.vr-xl .xl-pack,
	.vr-xl .xl-s35 {
		padding: 2em;
	}

	.vr-xl .hero .vr-xl-content .xl-bullets {
		flex-direction: column;
		margin: 2em auto;
		gap: 0;
	}

	.vr-xl .hero .vr-xl-content .xl-bullets ul {
		max-width: 100%;
		margin: 0;
	}

	.vr-xl .hero .vr-xl-content .xl-bullets ul:first-child,
	.vr-xl .hero .vr-xl-content .xl-bullets ul:last-child {
		width: 35em;
	}

	.vr-xl .xl-pack .vr-xl-content {
		flex-direction: column;
		align-items: center;
		margin: 2em auto;
		gap: 0;
	}

	.vr-xl .xl-pack .vr-xl-content ul {
		width: 25em;
		max-width: 100%;
		margin: 0;
	}
}

@media (max-width:1024px) {
	.vr-xl {
		font-size: 0.8125rem;
	}
}

@media (max-width:1368px) {
	.vr-xl .hero .vr-xl-content .xl-bullets {
		position: relative;
		height: auto;
		gap: 3em;
		justify-content: center;
	}

	/* .vr-xl .hero .vr-xl-content .xl-bullets ul:first-child,
	.vr-xl .hero .vr-xl-content .xl-bullets ul:last-child {
		width: auto;
	} */
	.vr-xl .xl-pack .vr-xl-content {
		gap: 3em;
	}
}

@media (max-width:1440px) {
	.vr-xl {
		font-size: 0.875rem;
	}
}

/* end RED V-raptor-xl样式 */

/* Red Z 卡口开始 2025-03-06 */
.hero-banner {
  --overlay-padding: var(--space-3); /* 使用前面定义的间距变量 */
  position: relative;
}

/* 统一的最大宽度和居中对齐 */
.hero-banner, .container {
  max-width: 1920px;/* 可选：控制最大展示宽度 */
  margin: 0 auto;
}
/* 统一图片区域，保证比例一致 */
.image-wrapper {
	position: relative;
	aspect-ratio: 16/9;/* 控制容器比例 */
	width: 100%;
	overflow: hidden;/* 隐藏图片溢出部分 */
}
/* 适应所有图片 */
.responsive-image, .content-image {
  width: 100%;
  height: 100%;
  object-fit: cover;/* 保持比例填充容器 */
  object-position: center;/* 焦点居中 */
}
/* 文字叠加层 */
.overlay-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* width: min(90%, 1200px); */
  text-align: center;
  color: white;
  padding: var(--overlay-padding);
    /* background: rgba(0, 0, 0, 0.4); */ /* 半透明背景提升可读性 */
    /* border-radius: 8px; */
    max-width: 90%; /* 移动端友好 */
}
.overlay-content h2 {
	margin-top: 5%;
  margin-bottom: 5%; /* 调整此值以增大或减小距离 */
}

.overlay-content p {
  margin-top: 0; /* 如果需要，可以调整 p 的 margin-top */
}

/* 标题与副标题优化 */
.title {
  font-size: clamp(2rem, 5vw, 3rem); /* 响应式字体 */
    margin-bottom: var(--space-1);
  /* text-shadow: 2px 2px 8px rgba(0,0,0,0.6); */
}
.subtitle {
  font-size: clamp(1rem, 2.5vw, 1.5rem);
    line-height: 1.4;
}
/* 第2部分 */

/* ===== 基础布局 ===== */
.content-section {
  color: #fff;
  padding: var(--space-3) 0;
}

.container {
  /* width: 90%; */
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--space-3);
}
/* ===== 网格系统 ===== */
.content-grid {
  display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    align-items: center;
}

/* 桌面端：图片在左 */
.content-grid.left {
  flex-direction: row;
}

/* 桌面端：图片在右 增加选择器权重 */
/* 修改为保持默认顺序 */
section.content-section > .container > .content-grid.right {
  flex-direction: row !important;
}

/* 内容区域通用样式 */
.image-wrapper {
  flex: 1 1 50%; /* 关键：图片占50%宽度 */
  min-width: 300px; /* 防止过度缩小 */
}

.text-content {
  flex: 1 1 45%; /* 文字占45%，留出间距 */
  padding: var(--space-2);
}
/* ===== 移动端响应 ===== */
@media (max-width: 768px) {
  .content-grid {
    flex-direction: column !important; /* 强制垂直排列 */
  }

  .image-wrapper, 
  .text-content {
    flex: 1 1 100%; /* 占满宽度 */
    min-width: auto;
  }
}
/* ===== 视觉细节优化 ===== */
.content-image {
	width: 100%;
	  height: auto;
	  border-radius: 8px;
	  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.content-title {
	font-size: 2rem; /* 回退值 */
  font-size: clamp(1.8rem, 4vw, 2.5rem);
  margin-bottom: var(--space-2);
  color: #fff;
}

.content-description {
  font-size: clamp(1rem, 2vw, 1.2rem);
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.9);
}
/* ===== 列表项特殊处理 ===== */
.text-list {
  margin-top: var(--space-2);
  /* border-left: 3px solid #e53935; */ /* 红色强调线 */
  padding-left: var(--space-2);
}

.list-item {
  padding: var(--space-1) 0;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.8);
}

.content-description {
  font-size: clamp(1rem, 1.5vw, 1.25rem);
  line-height: 1.5;
  opacity: 0.9;
}

/* 响应式适配 */
@media (max-width: 768px) {
  .content-grid {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .image-wrapper {
    order: -1;
  }
.responsive-left-image .content-image {
    /* 保持宽度100%，也可根据需要添加 margin */
    width: 100%;
  }
  .text-content {
    text-align: center;
  }

  .text-list {
    align-items: center;
  }
  .responsive-left-image .content-grid {
      grid-template-columns: 1fr; /* 单列显示，图片在上，文字在下 */
    }
	.overlay-content h2 {
		margin-top: 0;
	  margin-bottom: 0;
	}
	.hero-banner {
	    margin-bottom: 1.5rem; /* 根据需要调整这个数值 */
	  }
	  .content-section {
	    margin-top: 1.5rem; /* 根据需要调整这个数值 */
	  }
}
/* Red Z 卡口结束 2025-03-06 */

/* cooke s8i样式 */

.groupshot-title {
	line-height: 2;
	font-size: 2rem;
}

.groupshot-cont {
	font-size: 1rem;
	line-height: 2;
}

.ProductViewer {
	background-color: #000;
	/* 浏览器不支持的时候显示 */
	background: linear-gradient(356deg, #153F6F, #000 60%);
	/* #0e464d 黑色为60% */
	color: #fff;
	padding: 1rem 0 7rem;
	/* 上,右和左,下 */
	width: 100%;
}

.ProductViewer::before {
	background-image: linear-gradient(180deg, #000, rgba(0, 0, 0, .8) 19%,
			rgba(0, 0, 0, .6) 34%,
			rgba(0, 0, 0, .4) 47%,
			rgba(0, 0, 0, .278) 56.5%,
			rgba(0, 0, 0, .194) 65%,
			rgba(0, 0, 0, .126) 73%,
			rgba(0, 0, 0, .075) 80.2%,
			rgba(0, 0, 0, .042) 86.1%,
			rgba(0, 0, 0, .021) 91%,
			rgba(0, 0, 0, .008) 95.2%,
			rgba(0, 0, 0, .002) 98.2%, transparent);
	border-top: 20px solid #000;

}

.ProductViewer .row {
	height: 450px;
}

.ProductViewer h2 {
	/* margin:.5rem 20rem 0rem; */
	/* 上,右和左,下 */
	margin-top: 5%;
	margin-left: 25%;
	opacity: 1;
	font-weight: 600;
}

.Barrel ul {
	min-height: 340px;
	margin: 0 0 0 20rem;
	/* 上,右,下,左 */
}

.Barrel ul li {
	display: block;
	padding: .5rem 0;
	font-size: 1rem;
}

.Barrel ul li.active {
	font-weight: bold;
	color: #DEBF0F;
}

.tabcontent {
	-webkit-animation: myfirst 3s;
	/* Safari and Chrome */
	animation: myfirst 3s;
	/* 5秒过渡 */
}

/* 从零到完全不透明度 */
@keyframes myfirst {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@-webkit-keyframes myfirst {

	/* Safari and Chrome */
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.Viewer-image {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	align-items: center;
	justify-content: center;
	padding: 5%;
}

.Barrel img {
	max-height: 100%;
	max-width: 100%;
	height: auto;
	width: auto;
}

.brief h3 {
	font-weight: 400;
	font-size: 2rem;
	line-height: 1.2;
	margin: 0 2rem 1.25rem;
}

.brief h4 {
	color: #DEBF0F;
	margin-bottom: .25rem;
	font-size: 1.375rem;
	margin: 1em 2rem 1.5rem;
}

.brief p {
	margin: 0 2rem 1.5rem;
	font-size: 1rem;
	line-height: 1.5;
}

.brief-grap-inner {
	display: block;
	width: 100%;
	padding: 3rem 0rem;
}

.brief-grap-inner img {
	display: block;
	position: relative;
	max-width: 100%;
	width: 100%;
	height: auto;
}

.carousel-indicators {
	bottom: -30%;
}

.TableScroll {
	margin-top: 5rem;
	line-height: 1;
}

.TableScroll-labels {
	padding-left: 3rem;
}

.TableScroll-title {
	font-size: 2rem;
	color: #DEBF0F;
	margin: 6px 0 0;
	line-height: 1;
	padding-bottom: 8px;
}

.TableScroll-rows>div {
	padding: 1rem .75rem .9rem;
	font-size: 0.875rem;
}

.TableScroll-rows>div:nth-of-type(odd) {
	/* 隔行变色odd奇数行;even偶数行 */
	background: #13141c;
}

.TableScroll-values {
	/* width: calc(60% + 2rem); */
	overflow-x: scroll;
	/* 溢出提供滚动 */
	/* transition:opacity .75s ease-out .2s ; */
	/* -moz-transition:opacity .75s ease-out .2s ; */
	/* Firefox 4 */
	/* -webkit-transition:opacity .75s ease-out .2s ; */
	/* Safari and Chrome */
	/* -o-transition:opacity .75s ease-out .2s ; */
	/* Opera */
}

.TableScroll-values table {
	border-collapse: collapse;
	/* 表格设置合并边框 */
	color: #fff;
	line-height: 1;
	/* transition: transform .15s ease-out; */
}

.TableScroll tr>:first-child {
	/* 选择首个<tr>元素设置样式 */
	padding-left: 1.75rem;
	min-width: 12rem;
}

.TableScroll td,
.TableScroll th {
	padding: 1rem .75rem .9rem;
	font-size: 0.875rem;
}

.TableScroll th {
	color: #DEBF0F;
	text-align: left;
	min-width: 11rem;
}

.TableScroll tr:nth-of-type(2n) {
	background: #13141c;
}

@media only screen and (max-width: 768px) {
	.groupshot h3 {
		text-align: center;
	}

	.groupshot-title {
		font-size: 1.125rem;
		line-height: 1.5;
	}

	.groupshot-cont {
		font-size: 0.875rem;
		line-height: 1.5;
		padding: 0 1rem;
	}

	.small {
		padding: 0 1rem;
		line-height: 1.5;
	}

	.ProductViewer {
		padding: 1rem 0 0;
	}

	.ProductViewer h2 {
		margin: auto;
		text-align: center;
	}

	.Barrel ul {
		margin-left: 0;
		min-height: 2rem;
	}

	.Barrel ul li {
		display: inline-block;
		font-size: 0.875rem;
		padding: 3px;
	}

	.Viewer-image {
		padding: 0 1rem;
	}

	.brief h3 {
		font-size: 1.625rem;
	}

	.brief h4 {
		font-size: 1.25rem;
		margin: 1em 2rem 0.875rem;
	}

	.brief p {
		margin: 0 2rem 0.875rem;
		font-size: 0.875rem;
		line-height: 1.5;
	}

	.brief-grap-inner {
		padding: 0;
		margin: 0.875rem;
	}

	.brief-grap-inner img {}

	.carousel-indicators {
		bottom: -35%;
	}

	.TableScroll-labels {
		padding-left: 1rem;
	}

	.TableScroll-title {
		font-size: 1.75rem;
		margin-top: 0.5rem;
	}

	.TableScroll-rows {
		font-size: 0.5rem;
	}
}

@media only screen and (min-width:1400px) {
	.groupshot h3 {
		text-align: center;
		font-size: 1.5rem;
	}

	.groupshot-cont {
		font-size: 1rem;
		line-height: 2;
		padding: 0;
	}

	.small {
		padding: 0;
		line-height: 2;
		font-size: 0.75rem;
	}

	/* 第二部分 */
	.ProductViewer {}

	.ProductViewer .row {
		height: 34.375rem;
	}

	.ProductViewer h2 {
		margin: auto;
		line-height: 3rem;
		padding-left: 25%;
	}

	.Barrel {}

	.Barrel ul {
		min-height: 30rem;
		margin: 0 0 0 30rem;
	}

	.Barrel ul li {
		font-size: 1.375rem;
		line-height: 1.8;
	}

	.Viewer-image {
		padding: 1rem 3rem;
	}

	/* 第三部分 */
	.brief {
		margin-top: 3%;
	}

	.brief h3 {
		margin-top: 3rem;
	}

	.carousel-indicators {
		bottom: -22%;
	}
}

/* cooke s8i样式 */

/* cooke-home样式 */
.product_wrap a {
	color: #DEBF0F;
	font-size: 1rem;
}

.product_wrap a:hover {
	color: #DEBF0F;
}

.product_wrap {
	background: #000;
	background-image: radial-gradient(ellipse at center right, #482b03 0,
			rgba(72, 43, 3, .8) 19%, rgba(72, 43, 3, .6) 34%, rgba(72, 43, 3, .4) 47%,
			rgba(72, 43, 3, .278) 56.5%, rgba(72, 43, 3, .194) 65%, rgba(72, 43, 3, .126) 73%,
			rgba(72, 43, 3, .075) 80.2%, rgba(72, 43, 3, .042) 86.1%, rgba(72, 43, 3, .021) 91%,
			rgba(72, 43, 3, .008) 95.2%, rgba(72, 43, 3, .002) 98.2%, rgba(72, 43, 3, 0) 100%);
}

.product_body {
	background-image: linear-gradient(180deg, #000, rgba(0, 0, 0, .8) 10%, rgba(0, 0, 0, .6) 34%, rgba(0, 0, 0, .4) 47%, rgba(0, 0, 0, .278) 56.5%, rgba(0, 0, 0, .194) 65%, rgba(0, 0, 0, .126) 73%, rgba(0, 0, 0, .075) 80.2%, rgba(0, 0, 0, .042) 86.1%, rgba(0, 0, 0, .021) 91%, rgba(0, 0, 0, .008) 95.2%, rgba(0, 0, 0, .002) 98.2%, transparent);
}

.New_product {
	text-align: center;
}

.New_product .product {
	max-width: 75%;
}

.New_product .Introduction h3 {
	display: block;
	color: transparent;
	font-size: 5em;
	/* 5em */
	line-height: 1.5em;
	-webkit-text-stroke: 2px #fff;
	-webkit-text-fill-color: none;
}

.New_product .Introduction p {
	font-size: 1.125rem;
}

.Spherical_Lenses h3 {
	font-size: 2rem;
	letter-spacing: 1rem;
	/* 字间距 */
}

.Spherical_Lenses_cards {
	padding: 4rem 0 3rem;
	position: relative;
}

.Spherical_card {
	padding: 0 1.25rem 2rem;
	text-align: center;
	width: 50%;
	max-width: 50%;
	transition: opacity .5s ease-out .35s;
}

.Spherical_card_wrap {
	position: relative;
}

.Spherical_card_wrap:before {
	content: "";
	position: absolute;
	left: 5%;
	right: 5%;
	top: 0;
	bottom: 0;
	display: block;
	box-shadow: 0 14px 45px -4px rgba(0, 0, 0, .65), 0 4px 25px -5px rgba(0, 0, 0, .5), 0 3px 5px 0 rgba(0, 0, 0, .25);
}

.Spherical_card_inner {
	padding: 0 1.5rem 1.75rem;
	background-color: #0d223a;
	/* #092528 */
	position: relative;
	transition: background-color .65s ease-out;
	overflow: hidden;
	border-radius: 3px;
	background-image: linear-gradient(180deg, #000, rgba(0, 0, 0, .8) 19%, rgba(0, 0, 0, .6) 34%, rgba(0, 0, 0, .4) 47%, rgba(0, 0, 0, .278) 56.5%, rgba(0, 0, 0, .194) 65%, rgba(0, 0, 0, .126) 73%, rgba(0, 0, 0, .075) 80.2%, rgba(0, 0, 0, .042) 86.1%, rgba(0, 0, 0, .021) 91%, rgba(0, 0, 0, .008) 95.2%, rgba(0, 0, 0, .002) 98.2%, transparent);
	border-top: 3rem solid #000;

}

.Spherical_card_inner:hover {
	background-color: #153F6F;
	/* #0e2f2c */
}

.Spherical_Lenses h4 {
	font-size: 1.625rem;
	line-height: 1.4;
	margin: 0 0 1.225rem;
	/* letter-spacing:0.53rem; */
	/* 字间距 */
}

.Link {
	letter-spacing: .15em;
	/* 字母间距 */
	text-decoration: none;
	/* 文本的修饰 */
	line-height: 5;
}

.Spherical_card_inner img {
	height: 20rem;
}

.noLower {
	transform: translateY(3rem);
}

/* 变形变焦 */
.Anamorphic_Lenses h3 {
	font-size: 2rem;
	letter-spacing: 1rem;
	/* 字间距 */
}

.Anamorphic_Lenses p {
	width: 80%;
	margin: 2rem auto;
	font-size: 1rem;
}

@media only screen and (max-width: 768px) {
	.product_wrap a {
		font-size: 0.875rem;
	}

	.New_product .Introduction h3 {
		font-size: 1.5rem;
		line-height: 1em;
		-webkit-text-stroke: 1px #fff;
		-webkit-text-fill-color: none;
	}

	.New_product .product {
		max-width: 90%;
	}

	.product .Introduction img {}

	.New_product .Introduction p {
		font-size: 0.875rem;
		margin-bottom: 0;
		line-height: 1.125rem;
	}

	.Spherical_Lenses h3 {
		font-size: 1.25rem;
		letter-spacing: 0.875rem;
		/* 字间距 */
	}

	.Spherical_card {
		width: 100%;
		max-width: 100%;
	}

	.Spherical_card_inner {
		padding: 0 1rem 1rem;
	}

	.Spherical_Lenses h4 {
		font-size: 1.25rem;
		line-height: 1;
		margin: 0;
	}

	.Link {
		line-height: 3;
	}

	.Spherical_card_inner img {
		height: 15rem;
	}

	.noLower {
		transform: translateY(3rem);
	}

	/* 变形变焦 */
	.Anamorphic_Lenses h3 {
		font-size: 1.5rem;
		letter-spacing: 0.875rem;
		/* 字间距 */
	}

	.Anamorphic_Lenses p {
		width: 90%;
		margin: 1rem auto 0;
		font-size: 0.875rem;
	}

	.Anamorphic_Lenses h4 {
		font-size: 1.25rem;
	}
}

@media only screen and (min-width:1400px) {}

/* end cooke-home样式 */

/*** cooke-macro/i样式 ***/
.macro_hero {
	max-width: 70%;
}

.macro_hero h1 {
	font-size: 3.5rem;
	font-weight: 400;
	line-height: 1.2;
	margin: 2rem auto;
}

.i_mark {
	bottom: 3rem;
	height: 1em;
	margin: 0 0 0 -1rem;
}

.macro_hero p {
	max-width: 66.66%;
	margin: auto;
	font-size: 1rem;
	line-height: 2;
	margin-bottom: 3rem;

}

/* 查看范围 */
.macro_ProductViewer {
	height: 90vh;
}

.macro_ProductViewer h2 {
	margin: 3rem 0 5rem 5rem;
}

.macro_viewer {
	height: 55vh;
}

.macro_Barrel ul {
	align-items: center;
	max-height: 100%;
	margin: 0 0 0 10rem;
}

.tab_mark {
	opacity: 0;
}

.macro_Barrel ul li {
	display: block;
	font-size: 1.125rem;
	height: 3rem;
}

.macro_Barrel ul li.active {
	font-weight: bold;
	color: #DEBF0F;
}

.macro::after {
	content: "微距";
	font-size: .7rem;
	padding-left: .5rem;
	letter-spacing: .09em;
}

.macro_Viewer-image {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	align-items: center;
	justify-content: center;
	/* margin: 5% 0; */
	max-height: 100%;
	/* height: 100%; */
	/* 55vh */
}

.macro_brief {}

.macro_brief h3 {
	font-weight: 400;
	font-size: 2rem;
	line-height: 1.2;
	margin: 0 2rem 1.25rem;
}

.macro_features h4 {
	color: #DEBF0F;
	font-size: 1.375rem;
	margin: 1em 2rem .25rem;
	height: 3rem;
}

.macro_features p {
	margin: 0 2rem 1.5rem;
	font-size: 1rem;
	line-height: 1.5;
	height: 7.5rem;
}

.macro-TableScroll-values {
	overflow-x: hidden;
	/* 溢出裁剪 */
}

@media only screen and (max-width: 768px) {
	.macro_hero {
		max-width: 90%;
	}

	.macro_hero h1 {
		font-size: 2rem;
		font-weight: 200;
		line-height: 1.5;
		margin: 0rem auto;
	}

	.i_mark {
		bottom: 3rem;
		height: .8em;
		margin: 0 0 0 -.7rem;
	}

	.macro_hero p {
		max-width: 95%;
		font-size: 0.75rem;
		line-height: 1.5;
		margin-bottom: 2rem;
	}

	/* 查看范围 */
	.macro_ProductViewer {
		height: 60vh;
	}

	.macro_ProductViewer h2 {
		margin: 2rem 0 1rem 1rem;
	}

	.macro_Barrel ul {
		text-align: center;
		height: 50 vh;
		/* margin: auto; */
		margin-left: -18%;
		padding: 2%;
	}

	.macro_Barrel ul li {
		display: inline-block;
		font-size: 1rem;
		height: 2rem;
	}

	.macro_Barrel ul li.active {
		margin: 1.5%;
	}

	.macro_Viewer-image {
		margin: 3% 2%;
		height: 38vh;
		overflow: hidden;
	}

	.macro_brief h3 {
		font-weight: 400;
		font-size: 1.5rem;
		line-height: 1;
		margin: -2rem 2rem 1rem;
	}

	.macro_features h4 {
		margin-bottom: 0;
		font-size: 1.125rem;
		margin: 1em 2rem 1rem;
		height: 1.5rem;
	}

	.macro_features p {
		margin: 0 2rem 1.5rem;
		font-size: 0.875rem;
		line-height: 1.5;
		height: 100%;
	}

	.macro-TableScroll-values {
		overflow-x: scroll;
	}
}

/*** end cooke-macro/i样式 ***/

/*** cooke panchro/i样式 ***/
.PAN_hero {
	max-width: 70%;
}

.PAN_hero h1 {
	font-size: 3.5rem;
	font-weight: 400;
	line-height: 1.2;
	margin: 2rem auto;
}

.i_mark {
	bottom: 3rem;
	height: 1em;
	margin: 0 0 .8rem -1rem;
}

.PAN_hero p {
	max-width: 66.66%;
	margin: auto;
	font-size: 1rem;
	line-height: 2;
	margin-bottom: 5rem;
}

/* 查看范围 */
.PAN_Viewer h2 {
	width: 100%;
	text-align: start;
	opacity: 1;
	font-weight: 600;
	padding: 2rem;
}

.PAN_ProductViewer {
	height: 100%;
}

.PAN_Barrel ul {
	margin: -5rem 0 0 15rem;
	/* 上,右,下,左 */
}

.PAN_Barrel ul li {
	display: block;
	padding: .5rem 0;
	font-size: 1rem;
}

.PAN_Barrel ul li.active {
	font-weight: bold;
	color: #DEBF0F;
}

@media only screen and (max-width: 768px) {
	.PAN_hero {
		max-width: 90%;
	}

	.PAN_hero h1 {
		font-size: 1.5rem;
		/* font-weight: 200; */
		line-height: 1.5;
		margin: 0rem auto;
	}

	.i_mark {
		bottom: 3rem;
		height: 1em;
		margin: 0 0 .4rem -.4rem;
	}

	.PAN_hero p {
		max-width: 95%;
		font-size: 0.75rem;
		line-height: 1.5;
		margin-bottom: 2rem;
	}

	/* 查看范围 */
	.PAN_Viewer h2 {
		width: 90%;
		margin: 1rem 1rem 0;
	}

	.PAN_Barrel ul {
		text-align: start;
		width: 100%;
		margin-left: 0;
		margin-top: -1rem;
		padding: 0 1rem;
	}

	.PAN_Barrel ul li {
		display: inline-block;
		font-size: 0.875rem;
		height: 2rem;
		margin: 3px;
	}

	.PAN_Barrel ul li.active {
		margin: 1%;
	}
}

/*** end cooke panchro/i样式 ***/

/*** cooke Vaeotal/i样式 ***/
.VAR_Viewer h2 {
	width: 100%;
	text-align: start;
	opacity: 1;
	font-weight: 600;
	/* padding: 2rem; */
}

@media only screen and (max-width: 768px) {
	.VAR_Viewer h2 {
		width: 90%;
		text-align: center;
		margin: 1rem 1rem 0;
	}

	.VAR_Barrel ul {
		width: 90%;
		margin: auto;
	}

	.VAR_Barrel ul li {
		display: inline-block;
		font-size: 1rem;
		height: 2rem;
	}

	.VAR_Barrel ul li.active {
		margin: 1.5%;
	}

	.macro_Viewer-image {
		margin: 3% 2%;
		height: 38vh;
		overflow: hidden;
	}
}

/***end cooke Vaeotal/i样式 ***/

/***cooke panchro/i样式 ***/

/***end cooke panchro/i样式 ***/

/***cooke S4/i样式 ***/
.S4_Viewer h2 {
	margin: 0 0 5rem 5rem;
}

.S4_Viewer .row {
	height: 100%;
}

.S4_ProductViewer {
	height: 100%;
}

@media only screen and (max-width: 768px) {
	.S4_Viewer h2 {
		margin: auto;
		text-align: center;
	}
}

/***end cooke S4/i样式 ***/

/***cooke S5/i样式 ***/
@media only screen and (max-width: 768px) {
	.S5_Barrel {
		width: 90%;
		margin: 0 auto;
		padding: 0 5%;
	}
}

/***end cooke S5/i样式 ***/
/*** cooke sp3样式 ***/
.sp3HeaderSection {
	margin-left: 5%;
	margin-right: 5%;
}

.u-ciewed .v-text {
	position: absolute;
	display: block;
	padding: 0 2rem;
	max-width: 1380px;
	width: 100%;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	font-size: 3.5rem;
	line-height: normal;
	letter-spacing: 0.2;
}

.RangeSliderFlex {
	padding: 4rem 0;
	position: relative;
}

.u-container {
	display: block;
	margin: 0 auto;
	padding: 0 2rem;
	max-width: 1920px;
}

.u-container header {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 2rem;
	position: relative;
}

.u-container .RangAliderFlex-title {
	font-size: 1.5rem;
	line-height: 20px;
	color: #d1d1d1;
	letter-spacing: 2px;
	padding-right: .5rem;
	text-align: center;
}

.slick-slider {
	box-sizing: border-box;
	/* -webkit-touch-callout: none; */
	/* -webkit-user-select: none; */
	/* user-select: none; */
	/* touch-action: pan-y; */
	/* -webkit-tap-highlight-color: transparent; */
}

/* .slick-list {
	overflow: visible;
} */
.slick-track {
	position: relative;
	left: 0;
	top: 0;
	display: block;
}

.slick-track::before {
	content: "";
	display: table;
}

.CardPost {
	opacity: 1;
	transform: scale(1);
	display: inline-block;
	margin-right: 10px;
	width: 19%;
}

.CardPost-inner {
	position: relative;
}

.CardPost-inner::before {
	content: "";
	position: absolute;
	left: 3%;
	right: 3%;
	top: 0;
	bottom: 0;
	display: block;
	box-shadow: 0 14px 45px -4px rgba(0, 0, 0, .65), 0 4px 25px -5px rgba(0, 0, 0, .5), 0 3px 5px 0px rgba(0, 0, 0, .25);
}

.CardPost-inner::after {
	border-radius: 4px;
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	opacity: 0;
	background: rgba(0, 0, 0, .6);
	/* transition: opacity .5s ease-out; */
}

.CardPost-image {
	position: relative;
	margin-bottom: 20px;
}

.CardPost-image::before {
	content: "";
	display: block;
	padding-top: 120%;
}

.imageHolder {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.CardPost-image img {
	width: 100%;
	height: 100%;
}

.imageHolder {
	max-width: 100%;
}

.OF-cover {
	-o-object-fit: contain;
	object-fit: contain;
}

.CardPost-text {
	text-align: center;
	font-size: 16px;
	line-height: 24px;
	color: #fff;
}

.CardPost-text h5,
.CardPost-text h6 {
	font-size: 16px;
	line-height: 24px;
	margin-bottom: 0;
}

.CardPost-text h5 {
	color: #ffc001;
}

.rangealideBottomText {
	margin-top: 4rem;
	margin-left: 5rem;
	font-size: 1rem;
	line-height: 24px;
}

.rangealideBottomText>div {
	max-width: 50%;
}

.sp3RangeSection {
	background: #000;
	padding: 4rem 0;
}

.sp3RangeSection>div {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-flow: row wrap;
	padding: 0 3rem;
	max-width: 1920px;
	margin: 0 auto;
}

.sp3RangeSection>div .RangeWrap {
	display: flex;
	flex-flow: row wrap;
	width: 100%;
}

.sp3RangeSection>div .RangeWrap .RangeBlock {
	width: 50%;
}

.sp3RangeSection>div .RangeWrap .RangeBlock .RangeBlock-image {
	width: 100%;
	padding-top: 56%;
	position: relative;
	overflow: hidden;
}

.sp3RangeSection>div .RangeWrap .RangeBlock .RangeBlock-image .imageHolder {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.sp3RangeSection>div .RangeWrap .RangeBlock .RangeBlock-image .imageHolder img {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	margin: 0 auto;
}

.sp3RangeSection>div .RangeWrap .RangeBlock .RangeBlock-Text {
	text-align: center;
	font-size: 1rem;
	line-height: 28px;
	padding: 20px;
	max-width: 510px;
	width: 100%;
	margin: 0 auto;
}

.sp3RangeSection>div .RangeWrap .RangeBlock .RangeBlock-Text h4 {
	font-size: 1.5rem;
	line-height: normal;
	letter-spacing: .2px;
	margin-bottom: 2rem;
}

.sp3RangeSection>div .RangeWrap .RangeBlock .RangeBlock-Text .price {
	font-size: 24px;
	line-height: 28px;
	color: #ffb81c;
}

.AlignMedia {
	color: #fff;
	background-size: cover;
	background-position: 50%;
	background-attachment: fixed;
	position: relative;
}

.AlignMedia .title {
	font-size: 22px;
	line-height: 22px;
	color: #d1d1d1;
	letter-spacing: 2px;
	text-align: center;
}

.AlignMedia-row {
	margin: 0 auto;
	display: flex;
	padding: 2rem 0;
}

.AlignMedia-row.u-longText {
	align-items: center;
}

.AlignMedia-row.u-textRight {
	flex-direction: row-reverse;
}

.AlignMedia-content {
	/* opacity: 0; */
	position: inherit;
	/* transform: translate(12px);
	transition: opacity .6s ease-out .2s, transform .5s ease-out .2s;
	z-index: 20; */
}

.AlignMedia-row>div {
	padding: 0;
	flex-basis: 50%;
	max-width: 50%;
}

.u-wysuwyg>:first-child {
	margin-top: 0;
}

.u-wysuwyg p,
.ImagingSection-content p {
	display: block;
	margin-block-start: 1em;
	margin-block-end: 1em;
	margin-inline-start: 0px;
	margin-inline-end: 0px;
	margin: 0 0 1.5rem;
	font-size: 1rem;
	line-height: 1.5;
}

.AlignMedia-graphic {
	/* opacity: 0; */
	/* transform: scale(.96);
	transition: opacity .6s ease-out .5s, transform .5s ease-out .5s; */
}

.AlignMedia-graphicInner::before {
	content: "";
	display: block;
	/* padding-top: 65%; */
}

.AlignMedia-graphicInner img {
	max-width: 100%;
}

.ImagingSection {
	text-align: center;
}

.ImagingSection-content {
	font-size: 1rem;
	line-height: 28px;
	padding-bottom: 2rem;
}

.ImagingSection-content h5 {
	font-size: 1rem;
	line-height: 18px;
	color: #d1d1d1;
	letter-spacing: 2px;
	text-align: center;
}

.ImagingSection-content h3 {
	font-size: 36px;
	line-height: normal;
	letter-spacing: .2px;
	margin-bottom: 2rem;
}

.ImagingSection-content p {
	margin: auto 15%;
}

.ImagingSection-graphic {
	width: 100%;
}

.ImagingSection-graphic video {
	max-width: 100%;
}

@media (max-width:1421px) {
	.u-container {
		padding: 0 3rem;
	}

	.CardPost {
		margin-right: 10px;
		width: 18%;
	}
}

@media(max-width:991px) {
	.RangeSlideerFlex-rail {
		padding: 3rem 0;
	}

	.u-container {
		padding: 0 1.25rem;
	}

	.CardPost {
		margin-right: 10px;
		width: 30%;
	}

	.rangealideBottomText {
		width: 100%;
		margin-top: 2rem;
		margin-left: 3rem;
	}

	.rangealideBottomText>div {
		max-width: 75%;
	}

	.sp3RangeSection>div .RangeWrap .RangeBlock .RangeBlock-Text h4 {
		font-size: 1.2rem;
	}

	.sp3RangeSection>div .RangeWrap .RangeBlock .RangeBlock-Text p {
		font-size: 0.875rem;
	}
}

@media(max-width:768px) {
	.RangeSliderFlex {
		padding: 2rem 0;
	}

	.sp3HeaderSection .u-ciewed .v-text p {
		opacity: 0;
	}

	.u-container {
		padding: 0;
		max-width: 100%;
	}

	.u-container header {
		margin-bottom: 0;
	}

	.RangeSlideerFlex-rail {
		padding: 1rem 0;
	}

	.u-container .RangAliderFlex-title {
		font-size: 1rem;
		line-height: 0.75rem;
	}

	.CardPost {
		width: 100%;
		margin: 0;
	}

	.CardPost-image {
		margin: 0;
		max-width: 100%;
	}

	.CardPost-text {
		font-size: 0.875rem;
		line-height: 1rem;
	}

	.CardPost-text h5,
	.CardPost-text h6 {
		font-size: 0.875rem;
		line-height: 1rem;
	}

	.rangealideBottomText {
		font-size: 0.875rem;
	}

	.sp3RangeSection>div .RangeWrap .RangeBlock {
		width: 100%;
	}

	.sp3RangeSection>div .RangeWrap .RangeBlock .RangeBlock-image {
		padding-top: 40%;
	}

	.sp3RangeSection>div .RangeWrap .RangeBlock .RangeBlock-Text {
		font-size: 0.875rem;
		line-height: 1.5rem;
		padding: 0.5rem;
	}

	.sp3RangeSection>div .RangeWrap .RangeBlock .RangeBlock-Text h4 {
		font-size: 1rem;
		margin-bottom: 1rem;
	}

	.sp3RangeSection>div .RangeWrap .RangeBlock .RangeBlock-Text p {
		font-size: 0.75rem;
	}

	.AlignMedia {
		background-position: 0;

	}

	.AlignMedia .title {
		font-size: 1rem;
		line-height: 1rem;

	}

	.AlignMedia-row>div {
		flex-basis: 100%;
		max-width: 85%;
		padding: 1%;
	}

	.AlignMedia-row.u-textRight {
		flex-direction: column-reverse;
		/* 从下往上 */
	}

	.AlignMedia-row {
		width: 100%;
		padding: 0;
		margin: 0;
	}

	.AlignMedia-content {
		width: 100%;
		margin: 0;
	}

	.AlignMedia-graphic {
		width: 100%;
	}

	.u-wysuwyg p,
	.ImagingSection-content p {
		font-size: 0.875rem;
		margin: 0 1rem;
	}

	.ImagingSection-content {
		font-size: 0.875rem;
		line-height: 1.25rem;
		padding: 1rem;
	}

	.ImagingSection-content h5 {
		font-size: 0.875rem;
	}

	.ImagingSection-content h3 {
		font-size: 1.25rem;
		margin-bottom: 1rem;
	}

	.ImagingSection-graphic video {
		max-width: 90%;
	}

	.TableScroll {
		margin-top: 3rem;
	}

	.sp3-title h2 {
		font-size: 1rem;
		height: 2.5rem;
	}
}

/*** end cooke sp3样式 ***/
/* 2023-09-13 */