﻿
body{font-family:"SourceHanSansCN"; margin: 0 auto; -webkit-text-size-adjust: 100%; text-size-adjust: 100%;}
 * {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	color: #231815;
}

body {
	min-height: 100vh;
	overflow-x: hidden; 
	background-color: #fffff9;
}




.tc1{ background: linear-gradient( 180deg, rgba(255, 255, 255, 0) 40%, #59ffd0 40% ); font-style: normal;}
.jt0{font-style: normal;}

.footer-content h1{text-align: center;}
.solar-term-nav{
	font-family: "\6977\4F53";
}

@media (min-width: 768px) {
	.container {
		display: flex;
		width: 1250px;
		min-height: 100vh;
		margin: 0 auto; 
	}
	.blank50{height: 50px; font-size:1px; clear:both;overflow:hidden;}
	.blank70{height: 70px; font-size:1px; clear:both;overflow:hidden;}
	img{ max-width: 1050px;}
	.s_video{height: 750px;}
	.solar-term-nav {
		position: sticky;
		top: 0;
		width: 100px;
		height: 100vh;
		background-color: #fffff9;
		overflow-y: hidden;
		transition: top 0.3s ease, opacity 0.3s ease;
		opacity: 0;
		visibility: hidden;
		text-align: center;
		margin-right: 50px;
	}

	.term-list-wrapper {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		overflow-y: hidden;
	}

	.term-list {
		list-style: none;
		padding: 0;
		margin: 0;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		transition: top 0.3s ease;
	}

	.term-item {
		text-align: center;
		margin: 25px 0;
		cursor: pointer;
		transition: all 0.3s ease;
		font-size: 18px;
		padding: 0 5px;
		color: #dad8d8;
	}

	
	.content {
		width: 1050px;
		min-height: 100vh;
		font-size: 20px;
		line-height: 2;
		background-color: #fffff9;
	}
	.header-content .t1{ margin: 100px 0;}
	.header-content .t2{}
	.header-content .t3{}
	.header-content .t3 video{ width: 100%;}
	.content-section{ border-bottom: 3px solid #B5B5B3;}
	
	.content-section .t1{ margin: 40px 0;}
	.content-section .t2{}
	
	.ckgd{  text-align: right;}
	.ckgd a{background: linear-gradient( 180deg, rgba(255, 255, 255, 0) 40%, #b3ffe2 40% ); display: inline-block; padding: 0 3px;}
	.z_img,.zuo_img{
	    display: flex;
	    align-items: center;
	}
	.y_img,.you_img{
	    display: flex;
	    align-items: center;
		justify-content: flex-end;
		flex-direction: row-reverse;
	}
	.z_img img,.y_img img{ height: 360px;}
	.z_img img{ margin-right: 30px;}
	.y_img img{ margin-left: 30px;}
	.you_img img,.zuo_img img{}
	.z_sp{ display: flex; align-items: center;}
	.z_sp img{ margin-right: 30px;}
	.y_sp{ display: flex; align-items: center; justify-content: flex-end; flex-direction: row-reverse;}
	.y_sp img{ margin-left: 30px;}
}


@media (max-width: 767px) {
	body {
		overflow-x: hidden;
	}

	.container {
		width: 100%;
		flex-direction: column;
	}

	.blank50{height: 1vh; font-size:1px; clear:both;overflow:hidden;}
	.blank70{height: 2vh; font-size:1px; clear:both;overflow:hidden;}
	.solar-term-nav {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 60px;
		background-color: rgba(248, 249, 250, 0.95);
		border-bottom: 1px solid #e9ecef;
		overflow-x: hidden; 
		overflow-y: hidden;
		display: flex;
		justify-content: center;
		align-items: center;
		z-index: 999; 
		transition: top 0.3s ease, opacity 0.3s ease; 
		visibility: hidden;
	}

	.term-list-wrapper {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
	}

	.term-list {
		list-style: none;
		padding: 0;
		margin: 0;
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		display: flex; 
		align-items: center;
		transition: left 0.3s ease; 
		white-space: nowrap; 
	}

	.term-item {
		padding: 0 12px; 
		height: 60px;
		line-height: 60px; 
		margin: 0 4px;
		cursor: pointer;
		transition: all 0.3s ease;
		border-bottom: 3px solid transparent; 
		border-left: none; 
		border-radius: 0;
		text-align: center;
		font-size: 14px; 
	}

	
	.content {
		margin-top: 60px; 
		width: 100%;
		min-height: calc(100vh - 60px);
		overflow-y: visible;
		padding: 18px 16px;
		font-size: 18px;
		line-height: 1.9;
	}

	
	.content-section {
		margin-bottom: 30px;
		padding-bottom: 24px;
		border-bottom: 2px solid #B5B5B3;
	}

	.q_video{
		display: block;
		width: 100% !important;
		height: auto !important;
		max-height: none;
		aspect-ratio: 16 / 9;
		object-fit: contain;
		background: #000;
	}

	.TRS_Editor p,
	.Custom_UnionStyle p,
	.Custom_UnionStyle div{
		font-size: 18px;
		line-height: 1.9;
		margin-bottom: 0.75em;
	}

	.nr_box{
		margin-bottom: 16px;
	}

	.nr_box > img{
		display: block;
		margin-bottom: 12px;
	}

	.nr_box .nr{
		margin-top: 0;
	}

	.ckgd{
		margin-top: 6px;
		text-align: right;
	}

	.ckgd a{
		display: inline-block;
		padding: 0 4px;
		font-size: 18px;
		line-height: 1.8;
		background: linear-gradient(180deg, rgba(255, 255, 255, 0) 40%, #b3ffe2 40%);
	}

	.z_img,.zuo_img,.y_img,.you_img{
		display: block !important;
	}

	.z_img img,.zuo_img img,.y_img img,.you_img img,.z_sp img,.y_sp img{
		height: auto !important;
		
	}
	.z_sp,.y_sp{ display: flex;align-items: center;}
	.z_sp img,.y_sp img{ width: 30%;}
	.z_sp .s_video,.y_sp .s_video{ width: 70%;aspect-ratio: 9 / 16;}
	img{
		max-width: 100%;
		margin: 0 auto;
	}
}


.term-item.active {
	font-size: 36px;
	background: linear-gradient( 180deg, rgba(255, 255, 255, 0) 40%, #b3ffe2 40% );
	color: #000;
}


.content-section {
   
}


.header-content,
.footer-content {
}






:root {
    --swiper-theme-color: #ffffff;
}













::-webkit-scrollbar {
    width: 6px;
}
 
::-webkit-scrollbar-thumb {
    background-color: #C21109;
    border-radius: 3px;
}
 
::-webkit-scrollbar-track {
    background-color: white;
    border-radius: 3px;
}
 




















@media (max-width: 767px) {
	.term-item.active {
		font-size: 20px;
	}
}



.ending-qr-wrap{
	position: relative;
	width: 100%;
	height: 0;
	opacity: 0;
	transform: translateY(26px);
	transition: opacity .7s ease, transform .7s ease;
}

.ending-qr-wrap.is-visible{
	opacity: 1;
	transform: translateY(0);
}

.ending-qr-card{
	position: absolute;
	left: -168px;
	top: -28px;
	width: 118px;
	padding: 6px;
	background: rgba(255,255,255,.96);
	border: 1px solid #dedede;
	box-shadow: 0 8px 18px rgba(0,0,0,.08);
	text-align: center;
}

.ending-qr-card img{
	display: block;
	width: 100%;
	height: auto;
}

.ending-qr-card p{
	margin-top: 4px;
	font-size: 15px;
	line-height: 1.35;
	color: #666;
}

@media (max-width: 767px){
	.ending-qr-wrap{
		display: block;
		height: auto;
		opacity: 1;
		transform: none;
		margin: 8px 0 20px;
	}

	.ending-qr-card{
		position: relative;
		left: auto;
		top: auto;
		width: 70%;
		max-width: 360px;
		margin: 0 auto;
		padding: 10px;
	}
}
