/* common.css - 化工门户全局基础样式
 * 包含：
 *   1. flex/对齐 工具类
 *   2. body/button/input 基础样式
 *   3. 跨页面共用的设计稿原子类（text_N/image_N/thumbnail_N/text-wrapper_N 等）
 *      —— 这些类原本在 13 个页面 index.css 中各定义一次，值完全相同。
 *      合并到此处后，页面 index.css 只保留各自独特的定位/颜色/尺寸覆盖即可。
 */

/* ===== 基础重置 ===== */
body * {
  box-sizing: border-box;
  flex-shrink: 0;
}
body {
  font-family: PingFangSC-Regular, Roboto, Helvetica Neue, Helvetica, Tahoma, Arial, PingFang SC-Light, Microsoft YaHei;
  padding: 0;
  margin: 0;
}
input {
  background-color: transparent;
  border: 0;
}
button {
  margin: 0;
  padding: 0;
  border: 1px solid transparent;
  outline: none;
  background-color: transparent;
}
button:active {
  opacity: 0.6;
}

/* ===== flex 工具类 ===== */
.flex-col {
  display: flex;
  flex-direction: column;
}
.flex-row {
  display: flex;
  flex-direction: row;
}
.justify-start { display: flex; justify-content: flex-start; }
.justify-center { display: flex; justify-content: center; }
.justify-end { display: flex; justify-content: flex-end; }
.justify-evenly { display: flex; justify-content: space-evenly; }
.justify-around { display: flex; justify-content: space-around; }
.justify-between { display: flex; justify-content: space-between; }
.align-start { display: flex; align-items: flex-start; }
.align-center { display: flex; align-items: center; }
.align-end { display: flex; align-items: flex-end; }

/* ===== 设计稿原子类（13 个页面共享）=====
 * 这些类名由蓝湖导出工具按出现顺序自动生成，
 * 同一类名在所有页面里的尺寸/字体/颜色完全一致，仅部分页面的 margin 不同。
 * 公共 base 用并集选择器声明；个别差异留在各页面 index.css 覆盖。
 */

/* 顶部联系条文字：text_1, text_2, text_5 */
.text_1,
.text_2,
.text_5 {
  height: 22px;
  overflow-wrap: break-word;
  color: rgba(102, 102, 102, 1);
  font-size: 16px;
  font-family: PingFangSC-Regular;
  text-align: left;
  white-space: nowrap;
  line-height: 22px;
  font-weight: normal;
}
.text_1,
.text_2 { font-family: PingFang-SC-Bold; }
.text_1 { width: 70px; margin: 11px 0 0 2px; }
.text_2 { width: 48px; margin: 11px 0 0 37px; }
.text_5 { width: 160px; margin: 13px 0 0 14px; }

/* 协会 LOGO 标题 text_3, text_4 */
.text_3,
.text_4 {
  overflow-wrap: break-word;
  color: rgba(41, 79, 152, 1);
  text-align: left;
  white-space: nowrap;
  font-weight: normal;
}
.text_3 {
  width: 444px;
  height: 25px;
  font-size: 18px;
  letter-spacing: 1.9px;
  font-family: PingFangSC-Regular;
  line-height: 25px;
  margin: 31px 0 0 -158px;
}
.text_4 {
  width: 488px;
  height: 57px;
  font-size: 41px;
  font-family: PingFang-SC-Heavy;
  line-height: 57px;
}

/* 导航菜单文字 text_6 ~ text_14：相同 base，margin 各异 */
.text_6,
.text_7,
.text_8,
.text_9,
.text_10,
.text_11,
.text_12,
.text_13,
.text_14 {
  width: 80px;
  height: 28px;
  overflow-wrap: break-word;
  color: rgba(255, 255, 255, 1);
  font-size: 20px;
  font-family: PingFang-SC-Bold;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  line-height: 28px;
}
.text_6  { margin: 8px 0 0 361px; }
.text_7  { margin: 8px 0 0 43px; }
.text_8  { margin: 8px 0 0 57px; }
.text_9  { margin: 8px 0 0 56px; }
.text_10 { margin: 8px 0 0 57px; }
.text_11 { margin: 8px 0 0 57px; }
.text_12 { margin: 8px 0 0 57px; }
.text_13 { margin: 8px 0 0 56px; }
.text_14 { margin: 8px 385px 0 57px; }

/* 标题/正文基础（18px PingFang）text_15 */
.text_15 {
  height: 25px;
  overflow-wrap: break-word;
  color: rgba(51, 51, 51, 1);
  font-size: 18px;
  text-align: left;
  white-space: nowrap;
  line-height: 25px;
  font-weight: normal;
  width: 126px;
  font-family: PingFang-SC-Bold;
}

/* 顶部 logo 区的图片 */
.image_1 { width: 646px; height: 100px; }
.image_2 { width: 189px; height: 88px; margin: 12px 0 0 452px; }
.image_3 { width: 331px; height: 68px; margin: 32px 0 0 16px; }
.image_4 { width: 109px; height: 74px; margin-top: 8px; }

/* 顶部 logo 区的搜索按钮（71x50 棕色）*/
.image-wrapper_1 {
  background-color: rgba(218, 187, 133, 1);
  height: 50px;
  margin-left: 227px;
  width: 71px;
}

/* 顶部联系条的小图标 */
.thumbnail_1 { width: 17px; height: 17px; margin: 14px 0 0 1361px; }
.thumbnail_2 { width: 13px; height: 8px; margin: 18px 366px 0 6px; }
.thumbnail_3 { width: 20px; height: 20px; margin: 15px 0 0 26px; }
.thumbnail_4 { width: 8px; height: 11px; margin: 8px 0 0 11px; }

/* 红色标题块（多数页面的板块标题栏）
 * 注意：首页的 .text-wrapper_3 是蓝色 tab，用 .page-shouye 覆盖
 */
.text-wrapper_3 {
  background-color: rgba(213, 16, 13, 1);
  height: 61px;
  width: 274px;
}