/* ============================================================
   F-MOM 页面样式 fmom.css(PC + 移动端)
   ============================================================ */

/* ---------- part-1 首屏 ---------- */
.part-1 { height: 520px; width: 100%; background: #fff; position: relative; }
.part-1-content { width: 1300px; display: flex; margin: 0 auto; }
.part-1-title {
  font-size: 36px; font-weight: bold; line-height: 49px; height: 49px; margin-bottom: 3px;
  background: linear-gradient(107deg, #19b6ff 8%, #007aff 99%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.part-1-info { padding: 130px 0 0 110px; z-index: 3; }
.part-1-subtitle { font-size: 26px; font-weight: bold; line-height: 36px; color: #262626; margin-bottom: 24px; }
.part-1-info p { font-size: 16px; line-height: 22px; color: #595959; margin-bottom: 8px; }
.part-1-btn {
  border-radius: 4px; font-size: 16px; font-weight: 500; line-height: 36px; color: #fff;
  background: #007aff; display: flex; justify-content: center; width: 100px; height: 36px; margin-top: 40px;
}
.part-1-bg { width: 680px; height: 425px; display: flex; margin: 71px -30px 0 auto; position: relative; z-index: 2; }

/* ---------- part-2 核心应用场景 ---------- */
.part-2 {
  height: 778px; width: 100%; position: relative; z-index: 2;
  background: #f6faff url(../assets/images/fmom/p-2-bg.png) no-repeat center center;
  background-size: contain;
  box-sizing: border-box; padding-top: 32px;
}
.part-common-title { font-size: 36px; font-weight: bold; line-height: 49px; height: 49px; text-align: center; color: #262626; margin-bottom: 12px; position: relative; z-index: 2; }
.part-common-subtitle { font-size: 20px; font-weight: normal; line-height: 33px; height: 33px; text-align: center; color: #595959; position: relative; z-index: 2; }
.part-2-trigger {
  width: 105px; height: 38px; position: absolute; line-height: 38px; font-size: 14px; color: #3d3d3d;
  cursor: pointer; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); border-radius: 19px;
  box-sizing: border-box; padding-left: 34px;
}
.part-2-trigger-1 { left: 400px; top: 20px; background: #fff url(../assets/images/fmom/icon-jh-1.png) no-repeat 14px 11px; }
.part-2-trigger-2 { left: 260px; top: 80px; background: #fff url(../assets/images/fmom/icon-gy-1.png) no-repeat 14px 11px; }
.part-2-trigger-3 { left: 84px; top: 186px; background: #fff url(../assets/images/fmom/icon-cw-1.png) no-repeat 14px 11px; }
.part-2-trigger-4 { left: 424px; top: 180px; background: #fff url(../assets/images/fmom/icon-sc-1.png) no-repeat 14px 11px; }
.part-2-trigger-5 { left: 246px; top: 330px; background: #fff url(../assets/images/fmom/icon-xs-1.png) no-repeat 14px 11px; }
.part-2-trigger-6 { left: 530px; top: 200px; background: #fff url(../assets/images/fmom/icon-pz-1.png) no-repeat 14px 11px; }
.part-2-trigger-7 { left: 390px; top: 376px; background: #fff url(../assets/images/fmom/icon-cg-1.png) no-repeat 14px 11px; }
.part-2-trigger-8 { left: 830px; top: 236px; background: #fff url(../assets/images/fmom/icon-kc-1.png) no-repeat 14px 11px; }
.part-2-trigger-9 { left: 615px; top: 300px; background: #fff url(../assets/images/fmom/icon-sb-1.png) no-repeat 14px 11px; }
.part-2-pannel { position: absolute; top: 38px; left: 50%; transform: translateX(-50%); color: #000; display: none; box-sizing: border-box; padding-top: 14px; z-index: 8; }
.part-2-pannel-content { width: 272px; height: 107px; border-radius: 8px; box-sizing: border-box; position: relative; z-index: 1; padding: 1px; overflow: hidden; background: linear-gradient(to right, #fff 0%, #fff 30%); }
.part-2-pannel-content-bg { box-sizing: border-box; width: 270px; height: 105px; padding: 12px 16px 0; background-color: rgba(194, 217, 248, 0.3); }
.part-2-pannel-title { height: 22px; line-height: 22px; font-size: 16px; font-weight: bold; letter-spacing: 0.57px; margin-bottom: 4px; color: #007aff; }
.part-2-pannel-text { font-size: 14px; line-height: 19px; letter-spacing: 0.57px; color: #595959; }
.part-2-trigger-cur { color: #fff; }
.part-2-pannel-cur { display: block; }
.part-2-trigger-1.part-2-trigger-cur { background: #007aff url(../assets/images/fmom/icon-jh-2.png) no-repeat 14px 11px; }
.part-2-trigger-2.part-2-trigger-cur { background: #007aff url(../assets/images/fmom/icon-gy-2.png) no-repeat 14px 11px; }
.part-2-trigger-3.part-2-trigger-cur { background: #007aff url(../assets/images/fmom/icon-cw-2.png) no-repeat 14px 11px; }
.part-2-trigger-4.part-2-trigger-cur { background: #007aff url(../assets/images/fmom/icon-sc-2.png) no-repeat 14px 11px; }
.part-2-trigger-5.part-2-trigger-cur { background: #007aff url(../assets/images/fmom/icon-xs-2.png) no-repeat 14px 11px; }
.part-2-trigger-6.part-2-trigger-cur { background: #007aff url(../assets/images/fmom/icon-pz-2.png) no-repeat 14px 11px; }
.part-2-trigger-7.part-2-trigger-cur { background: #007aff url(../assets/images/fmom/icon-cg-2.png) no-repeat 14px 11px; }
.part-2-trigger-8.part-2-trigger-cur { background: #007aff url(../assets/images/fmom/icon-kc-2.png) no-repeat 14px 11px; }
.part-2-trigger-9.part-2-trigger-cur { background: #007aff url(../assets/images/fmom/icon-sb-2.png) no-repeat 14px 11px; }
.part-2-trigger::after { content: ""; position: absolute; left: 50%; bottom: -5px; transform: translateX(-50%); width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid #fff; }
.part-2-trigger-cur::after { border-top-color: #007aff; }
.part-2-content { width: 1030px; height: 570px; margin: 30px auto 0; position: relative; background: url(../assets/images/fmom/p-2-bg2.png) no-repeat; background-size: cover; background-position: 0 -138px; }

/* ---------- part-3 产品框架图 ---------- */
.part-3 { height: 866px; position: relative; z-index: 3; box-sizing: border-box; background: #fff; padding-top: 40px; }
.part-3-img { display: flex; vertical-align: top; width: 1200px; margin: 32px auto 0; }

/* ---------- part-4 生产管理方案 ---------- */
.part-4 { box-sizing: border-box; padding-top: 56px; position: relative; background: #f8f9fb; }
.part-4-trigger { border-radius: 16px; background: #fff; width: 682px; height: 59px; justify-content: space-around; display: flex; margin: 32px auto; box-sizing: border-box; position: relative; padding: 8px 12px; z-index: 2; cursor: pointer; }
.part-4-content { width: 1080px; height: 421px; display: flex; box-sizing: border-box; border-radius: 16px; background: url(../assets/images/fmom/p-4-bg.png) no-repeat; background-size: contain; overflow: hidden; margin: 0 auto; position: relative; z-index: 2; }
.part-4-trigger-item { width: 103px; height: 43px; display: flex; align-items: center; justify-content: center; font-size: 20px; color: #595959; border-radius: 8px; transition: all 0.3s ease-in-out; }
.part-4-trigger-item-cur { background: #007aff; color: #fff; font-size: 20px; font-weight: bold; }
.part-4-btn { border-radius: 4px; background: #007aff; width: 100px; height: 36px; display: flex; justify-content: center; align-items: center; font-size: 16px; font-weight: bold; color: #fff; position: absolute; bottom: 48px; left: 81px; z-index: 3; }
.part-4-info-title { height: 44px; line-height: 44px; font-size: 32px; font-weight: bold; color: #262626; margin-bottom: 33px; }
.part-4-info { box-sizing: border-box; position: absolute; top: 68px; left: 80px; opacity: 0; transition: all 0.3s ease-in-out; z-index: 2; }
.part-4-info-cur { opacity: 1; }
.part-4-info-list { color: #595959; }
.part-4-info-list li { line-height: 27px; word-wrap: break-word; margin-bottom: 12px; padding-left: 16px; position: relative; box-sizing: border-box; font-size: 20px; }
.part-4-info-list li::before { content: " "; width: 8px; height: 8px; border-radius: 50%; background: #007aff; position: absolute; left: 0; top: 10px; }
.part-4-info-list b { color: #007aff; }
.part-4-pic { position: absolute; z-index: 1; opacity: 0; transition: all 0.3s ease-in-out; vertical-align: top; right: 16px; top: 16px; width: 536px; height: 389px; }
.part-4-pic-cur { opacity: 1; }

/* ---------- part-5 ERP 管理 ---------- */
.part-5 { box-sizing: border-box; padding: 80px 0 60px; position: relative; background: #f8f9fb; }
.part-5-box { width: 1072px; margin: 0 auto; box-sizing: border-box; padding-top: 96px; position: relative; z-index: 2; }
.part-5-info { display: flex; align-items: center; position: relative; z-index: 2; justify-content: space-between; }
.part-5-box-a { width: 120px; height: 120px; border-radius: 6.4px; box-sizing: border-box; font-size: 20px; font-weight: bold; line-height: 27px; text-align: center; color: #595959; padding-top: 80px; }
.part-5-box-cart { background: #fff url(../assets/images/fmom/part-5-cart.png) no-repeat 32px 17px; background-size: 52px 52px; }
.part-5-box-user { background: #fff url(../assets/images/fmom/part-5-user.png) no-repeat 24px 8px; background-size: 70px 70px; }
.part-5-box-b { width: 238px; height: 160px; box-sizing: border-box; text-align: center; border-radius: 8px; padding-top: 12px; position: relative; }
.part-5-box-b-1::after { width: 308px; content: " "; height: 12px; background: url(../assets/images/fmom/part-5-arrow-1.png) no-repeat center/cover; bottom: 53px; left: 50%; transform: translateX(-50%); position: absolute; }
.part-5-box-b-2::after { width: 308px; content: " "; height: 12px; background: url(../assets/images/fmom/part-5-arrow-2.png) no-repeat center/cover; bottom: 53px; left: 50%; transform: translateX(-50%); position: absolute; }
.part-5-box-b-title { font-size: 28px; font-weight: bold; line-height: 38px; height: 38px; text-align: center; margin-bottom: 12px; }
.part-5-box-b-info { display: flex; height: 25px; line-height: 25px; justify-content: space-between; box-sizing: border-box; margin-bottom: 28px; padding: 0 32px; }
.part-5-box-b-1 { background: #f9f4eb; box-sizing: border-box; border: 1.5px solid #ffbf32; }
.part-5-box-b-1 .part-5-box-b-title { color: #ffbf32; }
.part-5-box-b-2 { background: #e5effb; box-sizing: border-box; border: 1.5px solid #007aff; }
.part-5-box-b-2 .part-5-box-b-title { color: #007aff; }
.part-5-box-c { background: url(../assets/images/fmom/part-5-f-mom.png) no-repeat center/cover; width: 196px; height: 196px; position: relative; }
.part-5-box-c::after { background: url(../assets/images/fmom/part-5-arrow-3.png) no-repeat center/cover; content: " "; width: 14px; height: 100px; position: absolute; left: 50%; transform: translateX(-50%); bottom: -100px; }
.part-5-list { width: 1072px; height: 79px; border-radius: 8px; background: #fff; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.04); display: flex; box-sizing: border-box; margin-top: 115px; align-items: center; }
.part-5-list-item-1 { font-size: 24px; font-weight: bold; text-align: center; color: #262626; margin: 0 32px 0 77px; }
.part-5-list-item { width: 127px; height: 47px; line-height: 47px; border-radius: 8px; background: rgba(0, 122, 255, 0.07); font-size: 20px; font-weight: bold; text-align: center; margin-right: 12px; color: #007aff; }

/* ---------- part-6 产品优势 ---------- */
.part-6 { position: relative; box-sizing: border-box; background: #fff; padding: 52px 0 92px; z-index: 3; overflow: hidden; }
.part-6-center { position: relative; display: flex; margin: 24px auto 0; width: 402px; height: 425px; }
.part-6-center img { vertical-align: top; width: 402px; height: 425px; }
.part-6-box { position: absolute; width: 369px; top: 85px; }
.part-6-box-1 { left: -381px; }
.part-6-box-2 { left: 414px; }
.part-6-box-item { border-radius: 8px; width: 369px; height: 80px; background: #fff; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.04); position: relative; margin-bottom: 32px; box-sizing: border-box; padding-left: 76px; padding-top: 17px; }
.part-6-box-item-title { font-size: 16px; font-weight: bold; line-height: 22px; color: #262626; margin-bottom: 4px; }
.part-6-box-item-subtitle { font-size: 14px; line-height: 19px; color: #595959; }
.part-6-box-item-1 { background: url(../assets/images/fmom/p-6-icon-1.png) no-repeat 16px 16px/48px 48px; }
.part-6-box-item-2 { background: url(../assets/images/fmom/p-6-icon-2.png) no-repeat 16px 16px/48px 48px; }
.part-6-box-item-3 { background: url(../assets/images/fmom/p-6-icon-3.png) no-repeat 16px 16px/48px 48px; }
.part-6-box-item-4 { background: url(../assets/images/fmom/p-6-icon-4.png) no-repeat 16px 16px/48px 48px; }
.part-6-box-item-5 { background: url(../assets/images/fmom/p-6-icon-5.png) no-repeat 16px 16px/48px 48px; }
.part-6-box-item-6 { background: url(../assets/images/fmom/p-6-icon-6.png) no-repeat 16px 16px/48px 48px; }

/* ============================================================
   移动端(手机 <768px)
   ============================================================ */
@media screen and (max-width: 767px) {
  .part-1 { height: auto; padding: 20px 0 30px; }
  .part-1-content { width: 100%; flex-direction: column; align-items: center; padding: 0 16px; }
  .part-1-info { padding: 80px 0 0; text-align: center; }
  .part-1-title { font-size: 28px; line-height: 38px; height: auto; }
  .part-1-subtitle { font-size: 20px; line-height: 30px; margin-bottom: 16px; }
  .part-1-info p { font-size: 14px; line-height: 22px; }
  .part-1-btn { margin: 24px auto 0; }
  .part-1-bg { width: 100%; height: auto; margin: 24px 0 0; }

  .part-2 { height: auto; padding: 32px 0 40px; background-size: cover; }
  .part-common-title { font-size: 24px; line-height: 34px; height: auto; margin-bottom: 8px; }
  .part-common-subtitle { font-size: 14px; line-height: 22px; height: auto; }
  /* 9 个功能点: 3 列卡片网格,直接展示标题+描述 */
  .part-2-content { width: 100%; height: auto; margin: 24px auto 0; background: none; display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0 12px; }
  .part-2-trigger {
    position: static;
    width: 31%;
    height: auto;
    min-height: 64px;
    margin-bottom: 12px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 4px 12px rgba(0, 122, 255, 0.08);
    padding: 40px 6px 8px;
    text-align: center;
    line-height: 20px;
    font-size: 14px;
    color: #262626;
  }
  .part-2-trigger::after { display: none; }
  .part-2-trigger-1 { background: #fff url(../assets/images/fmom/icon-jh-1.png) no-repeat center 8px/26px; }
  .part-2-trigger-2 { background: #fff url(../assets/images/fmom/icon-gy-1.png) no-repeat center 8px/26px; }
  .part-2-trigger-3 { background: #fff url(../assets/images/fmom/icon-cw-1.png) no-repeat center 8px/26px; }
  .part-2-trigger-4 { background: #fff url(../assets/images/fmom/icon-sc-1.png) no-repeat center 8px/26px; }
  .part-2-trigger-5 { background: #fff url(../assets/images/fmom/icon-xs-1.png) no-repeat center 8px/26px; }
  .part-2-trigger-6 { background: #fff url(../assets/images/fmom/icon-pz-1.png) no-repeat center 8px/26px; }
  .part-2-trigger-7 { background: #fff url(../assets/images/fmom/icon-cg-1.png) no-repeat center 8px/26px; }
  .part-2-trigger-8 { background: #fff url(../assets/images/fmom/icon-kc-1.png) no-repeat center 8px/26px; }
  .part-2-trigger-9 { background: #fff url(../assets/images/fmom/icon-sb-1.png) no-repeat center 8px/26px; }
  /* 移动端点击卡片展开描述(js 控制) */
  .part-2-trigger .part-2-pannel { position: static; transform: none; display: none; padding-top: 8px; }
  .part-2-trigger.open .part-2-pannel { display: block; }
  .part-2-pannel-content { width: 100%; height: auto; }
  .part-2-pannel-content-bg { width: 100%; height: auto; padding: 10px 12px; }

  .part-3 { height: auto; padding: 30px 16px 40px; }
  .part-3-img { width: 100%; height: auto; margin: 20px 0 0; }

  .part-4 { padding-top: 32px; }
  .part-4-trigger { width: 100%; height: auto; flex-wrap: wrap; padding: 8px; margin: 20px auto; }
  .part-4-trigger-item { width: 31%; height: 40px; font-size: 16px; margin: 4px 1%; }
  .part-4-content { width: 100%; height: auto; flex-direction: column; background: none; padding: 16px; }
  .part-4-info { position: static; opacity: 1; display: none; width: 100% !important; margin-bottom: 16px; }
  .part-4-info-cur { display: block; }
  .part-4-info-title { font-size: 24px; line-height: 34px; margin-bottom: 16px; }
  .part-4-info-list li { font-size: 16px; line-height: 24px; }
  .part-4-pic { display: none; }
  .part-4-btn { position: static; margin: 0 auto; }

  .part-5 { padding: 40px 16px; }
  .part-5-box { width: 100%; padding-top: 40px; }
  .part-5-info { flex-wrap: wrap; justify-content: center; }
  .part-5-box-a { width: 44%; height: 90px; padding-top: 60px; font-size: 16px; background-size: 40px !important; background-position: center 10px !important; }
  .part-5-box-b { width: 44%; height: auto; padding: 12px 8px; margin-bottom: 16px; }
  .part-5-box-b::after { display: none; }
  .part-5-box-c { width: 150px; height: 150px; background-size: cover; margin: 0 8px; order: -1; width: 100%; height: 180px; }
  .part-5-box-c::after { display: none; }
  .part-5-box-b-title { font-size: 22px; line-height: 30px; }
  .part-5-box-b-info { padding: 0; margin-bottom: 12px; }
  .part-5-list { width: 100%; height: auto; flex-wrap: wrap; margin-top: 40px; padding: 12px; }
  .part-5-list-item-1 { width: 100%; margin: 0 0 8px; font-size: 20px; }
  .part-5-list-item { width: 45%; height: 40px; line-height: 40px; font-size: 16px; margin: 0 2% 8px; }

  .part-6 { padding: 32px 0 40px; }
  .part-6-center { width: 100%; height: auto; flex-direction: column; align-items: center; padding: 0 16px; }
  .part-6-center img { width: 100%; height: auto; }
  .part-6-box { position: static; width: 100%; margin-top: 8px; }
  .part-6-box-item { width: 100%; height: auto; min-height: 76px; padding: 14px 12px 14px 76px; }
}