@charset "utf-8";
/* CSS Document */
/*!
 * 通用文字样式CSS - 参考淘宝(taobao.com)风格
 * 包含: 基础字体、标题、段落、链接(a标签)、价格、辅助文字等
 */

/* ============================================
   1.全局重置与字体设置
   ============================================ */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    /* 淘宝常用的字体栈: 优先使用系统字体，保证在各平台下的最佳显示 */
    font-family:"Microsoft YaHei",-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 12px; /* 淘宝基础字号通常为12px，方便计算 */
    line-height: 1.5; /* 常规行高 */
    color: #3c3c3c; /* 主文字颜色，深灰色，不刺眼 */
    background-color:white; /* 背景色通常为白 */
    -webkit-font-smoothing: antialiased; /* 字体抗锯齿，更清晰 */
    -moz-osx-font-smoothing: grayscale;
}
/* ============================================
   2.放置顶部日期的
   ============================================ */
.div0{
	width:975px;
	margin:10px auto 10px;/* 让div居中 */}
	

/*============================================
  3.以下为顶部长图的格式
============================================*/
.div1{
	width:975px;
	margin:0 auto;/* 让div居中 */
	
}


/*============================================
  4.以下为顶部导航栏及链接格式
============================================*/
nav{
	display:grid;
	grid-template-columns: 70% 30%;
}
#b{justify-self:end;
   margin-right:20px;
   font-weight: bold;}

nav a{
	display: inline-block;
    transition-property: background,color;/*过渡背景和颜色的变化*/
	transition-property: 1s;/*过渡1秒*/
	font-size: 15px; 
    text-decoration: none; /* 默认无下划线 */
    color: #3c3c3c; /* 链接颜色通常与正文一致 */    
    cursor: pointer;
	height: 40px;
	line-height: 40px;	
	padding-left:10px;
	padding-right:10px;
}

nav a:hover{
	background:rgba(249,6,10,1.00);
	color:white;
	
	}

.icon1{
	height: 15px;/*导航栏最前方小图标格式*/
}

/* ============================================
   5.中间装内容大容器的格式
   ============================================ */
.div2{
	width:975px;
	margin:0 auto 0px;/* 让div居中 */
	border:rgba(207,207,207,1.00) thin solid;
  
}

/* ============================================
   使div2中的li图片居中(内容中的图片)
   ============================================ */
.div2 ul li{
	text-align: center;
}

/* ============================================
   6.装中间主体内容图片的格式
   ============================================ */	
.w750{
	
	width: 750px;	
}
/* ============================================
   7.底部蓝底白字格式
   ============================================ */	
.div4{
	background: rgba(49,136,240,1.00);
	color:white;
	height:38px;
	line-height:38px;
	margin-bottom: 8px;
	font-size: 15px;
	text-align: center
	
}
/* ============================================
  8.底部落款格式
   ============================================ */	
.div5{
   width: 519px;  
   margin:15px auto 40px;
   display: grid;
   grid-template-columns:126px 1fr;
   grid-gap:8px;   
   box-sizing: border-box;/* 宽度从边框算起，也包含Padding*/
   	
}
/*底部左侧格式*/
.b{	
	border-right: rgba(167,167,167,1.00) thin solid;
	justify-items:end;
	align-content: center;
}
/*底部右侧格式*/
.c{
	display: grid;	
	font-size:12px;
	grid-gap:2.5px;
}

/*
  以下代码底部LOGO图片的大小 容器格式
*/

#img2{
	width: 110px;
	height: 110px;
	
}

/* ============================================
  9.标题文字 (参考淘宝各模块标题)
   ============================================ */
h1, h2, h3, h4, h5, h6 {
    font-weight: 400; /* 淘宝标题通常不加粗或使用正常字重 */
    color: #333; /* 标题颜色略深于正文 */
}

h1 {
    font-size: 30px; /* 大模块标题 */
	font-weight: bolder;
	text-align: center;/* 文字居中 */
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: 5px;
	margin-bottom: 5px;
}

h2 {
    font-size: 20px;
}

h3 {
    font-size: 18px;
}

h4 {
    font-size: 16px;
}

h5 {
    font-size: 14px;
}

h6 {
    font-size: 12px;
}

/* ============================================
   10.段落与文本
   ============================================ */
p {
    font-size: 12px;
    line-height: 1.6; /* 段落稍宽行高，便于阅读 */
    margin-bottom: 10px;
    color: #3c3c3c;
}




/* ============================================
 11.内外边距
   ============================================ */
 /* 上下外边距*/
.margin1{
	margin-top:15px;
	margin-bottom: 15px;
}

/* 下外边距*/
.margin2{

	margin-bottom: 20px;
}




/* ============================================
 左边距10px
   ============================================ */

.padding-left{
	padding-left: 10px;
}

/* ============================================
   12.列表样式 (商品列表常用)
   ============================================ */
ul, ol {
    list-style: none; /* 淘宝通常移除默认列表样式 */
}

li {
    font-size: 12px;
    line-height: 1.5;
    color: #3c3c3c;
}


/* ============================================
   12.文字类
   ============================================ */
/* 小号文字 (如时间、浏览量) */
.text-small {
    font-size: 10px;
    color: #9c9c9c;
}

/* 大号文字 */
.text-large {
    font-size: 16px;
}

/* 加粗文字 */
.text-bold {
    font-weight: 700;
}

/* 正常字重 */
.text-normal {
    font-weight: 400;
}

/* 白色文字 (用于深色背景) */
.text-white {
    color: #fff;
}

/* 文字居中 */
.text-center {
    text-align: center;
}

/* 文字左对齐 */
.text-left {
    text-align: left;
}



/* 文字右对齐 */
.text-right {
    text-align: right;
}

/* 文字变红 */
.red{
	color:red;
}

/* 溢出省略号 (单行) */
.text-ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}






/* ============================================
   响应式调整 (可选)
   ============================================ */
@media (max-width: 768px) {
    body {
        font-size: 11px; /* 小屏稍微缩小字号，但保持可读 */
    }
    h1 {
        font-size: 20px;
    }
    h2 {
        font-size: 18px;
    }
    /* 其他按需调整 */
}
