
/* ====================公共样式========================= */
/* 中间+共用部分 */
.Container{width: 100%;}
.contain-1600, .contain-1400, .contain{margin: 0 auto;}
.contain-1600{width: 1600px;}
.contain{width: 95%;}
.PageContain{width: 1400px;margin: 0 auto;}
.bodyBox{height: 100vh;overflow: hidden;}
/* 头部 */
.Header{width: 100%;height: 102px;background-image: url('../image/head.png');background-position: center;}
.Header .middle{width: 50%;}
.Header .flex-center{justify-content: space-between;}
.Header .left,.Header .right{width: 25%;}
.Header .left div{margin-right: 20px;}
.Header .right p{margin-left: 20px;}
.Header .right{justify-content: end;}


/* ------------------弹窗详情样式结束----------------- */

.Footer{position: absolute;left: 0;bottom: 0; width: 100%; }
.Footer .foot-top .flex{justify-content: space-between;}
.Footer .last{width: 49%; background-image: url('../image/group-bg.png');background-repeat: no-repeat; background-size: 100%; padding-top: 20px; padding-bottom: 50px;}
.Footer .info{background-color: rgba(0, 127, 255, .22);line-height: 10vh;}
.Footer .info p{margin: 0 20px;}



/* ---------------js弹窗样式开始---------------- */
/* 遮罩层样式 */
.modal-overlay {
  position: fixed;top: 0;left: 0;right: 0;bottom: 0;
  background: rgba(0, 0, 0, 0.6);display: flex;align-items: center;justify-content: center;
  opacity: 0; visibility: hidden;transition: opacity 0.3s ease;z-index: 1000;}
/* 弹窗样式 */
.modal {backdrop-filter: blur(12px);
  width: 90%;max-width: 1000px;max-height: 85vh;overflow: hidden;
  transform: scale(0.9); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
/* 弹窗头部 */
.modal-header {
  background-image: url('../image/tc-top.png');background-repeat: no-repeat;
  background-size: 100%;padding: 20px;}
.modal-title-bg{
  display: flex;justify-content: space-between;align-items: center;
  background-image: url('../image/tc-title.png');background-repeat: no-repeat;
  background-position: center bottom; background-size: 100%;padding-bottom: 20px;}
/* 弹窗内容区 */
.modal-content {
  padding: 20px;max-height: calc(85vh - 130px); overflow-y: auto;scroll-behavior: smooth;
  background-image: url('../image/tc-mid.png');background-repeat: repeat-y;background-size: 100%;}
/* 美化滚动条 */
.modal-content::-webkit-scrollbar {width: 6px;}
.modal-content::-webkit-scrollbar-track {background: rgba(21, 157, 255, 0.29);border-radius: 10px;margin: 10px 0;}
.modal-content::-webkit-scrollbar-thumb {background: rgba(21, 157, 255, 0.5);border-radius: 10px;transition: background 0.3s ease;}
.modal-content::-webkit-scrollbar-thumb:hover {background: rgba(21, 157, 255, 0.8);}

/* 图文内容样式 */
.modal-content img {max-width: 100%;border-radius: 6px;margin: 15px 0;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);}
.modal-content p {margin-bottom: 15px;}
.modal-content h3 { margin: 20px 0 10px;}
/* 弹窗底部 */
.modal-footer {
  padding: 15px 20px;text-align: right;
  background-image: url('../image/tc-bot.png');
  background-repeat: no-repeat;background-size: 100%;background-position: center bottom;}
.close-btn {
  width: 20px;height: 20px;
  background-image: url('../image/close.svg');
  border: none;cursor: pointer;
  transition: all 0.3s ease;}
.close-btn:hover {transform: rotate(360deg);}
/* 显示状态 */
.modal-overlay.active {opacity: 1;visibility: visible;}
.modal-overlay.active .modal {transform: scale(1);}
/* ---------------js弹窗样式结束---------------- */

/* ------------------弹窗详情样式开始----------------- */
.mfp-iframe-scaler iframe,
.transparent-bg{background-color: transparent;}
.mfp-iframe::-webkit-scrollbar {width: 6px;}
.mfp-iframe::-webkit-scrollbar-track {background: rgba(21, 157, 255, 0.29);border-radius: 10px;margin: 10px 0;}
.mfp-iframe::-webkit-scrollbar-thumb {background: rgba(21, 157, 255, 0.5);border-radius: 10px;transition: background 0.3s ease;}
.mfp-iframe::-webkit-scrollbar-thumb:hover {background: rgba(21, 157, 255, 0.8);}



.proDet-box{backdrop-filter: blur(12px); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);}
.proDet-box .head{
	background-image: url('../image/tc-top.png');background-repeat: no-repeat;
	background-size: 100%;padding: 20px;
}
.proDet-box .head .title{
	display: flex;justify-content: space-between;align-items: center;
	background-image: url('../image/tc-title.png');background-repeat: no-repeat;
	background-position: center bottom; background-size: 100%;padding: 20px 0;
}
.proDet-box .content{
	padding: 40px;max-height: calc(85vh - 130px); overflow-y: auto;scroll-behavior: smooth;
	background-image: url('../image/tc-mid.png');background-repeat: repeat-y;background-size: 100%;
}
.proDet-box .foot{
	padding: 15px 20px;text-align: right;
	background-image: url('../image/tc-bot.png');
	background-repeat: no-repeat;background-size: 100%;background-position: center bottom;
}