@charset "UTF-8";

/*768-1000*/
/*
@media screen and (min-width: 768px) and (max-width: 1000px) {
  .text1 {
    color: blue;
  }
}
*/
/*1000-1440*/
@media screen and (min-width: 200px) and (max-width: 1500px) {
  .text1 {
    font-size: 36px !important; }

  .text2 {
    left: 10.5%; }
    .text2 .title {
      font-size: 34px; }
    .text2 .tips {
      font-size: 14px; }
    .text2 .iconList .icon-single img {
      width: 34px; }
    .text2 .iconList .icon-single p {
      font-size: 14px; }

  .text3 .title {
    font-size: 34px; }
  .text3 .tips {
    font-size: 16px; }

  .text4Fixed {
    padding: 0;
    top: 57%;
    width: 30%; }
    .text4Fixed .ppryTitle {
      font-size: 14px; }
      .text4Fixed .ppryTitle :nth-child(2) {
        font-size: 20px !important; }
    .text4Fixed .ppryList .ppryList-single {
      font-size: 13px; }

  .menu-fixed {
    width: 380px !important; }
    .menu-fixed .content .menu .menuList .menuList-single .itemList .item {
      font-size: 14px !important; }
    .menu-fixed .content .menu .menuList .menuList-single .title :nth-child(1) {
      padding-right: 4px !important;
      padding-left: 0 !important;
      font-size: 14px !important; }
    .menu-fixed .content .menu .menuList .menuList-single .title :nth-child(2) {
      padding-right: 4px !important;
      padding-left: 10px !important;
      font-size: 14px !important; }
    .menu-fixed .content .menu .menuList .menuList-single .title .BrandDiscovery, .menu-fixed .content .menu .menuList .menuList-single .title .SkincareSolutions {
      padding-left: 5px !important;
      padding-right: 19px !important; }
    .menu-fixed .content .menu .menuList .menuList-single .title .SkincareSolutions {
      padding-right: 10px !important; }
    .menu-fixed .content .menu .menuList .menuList-single .title .fixedT {
      padding-right: 54px !important; }
    .menu-fixed .content .menu-colorBar {
      width: 363px !important; }

  .logo {
    position: absolute;
    z-index: 200;
    top: 40px;
    width: 158px;
    left: 85px; }

  .container .header .navBar {
    width: 30px; }
  .container .more {
    width: 280px !important; }
    .container .more .text .title {
      font-size: 14px !important; }
    .container .more .text .itemList .item {
      font-size: 14px !important; }
      .container .more .text .itemList .item img {
        width: 24px !important; }
      .container .more .text .itemList .item .jumpToWx {
        /*  width: 150px !important;
          height: 150px !important;*/ }
    .container .more .text-colorBar {
      margin-top: 34px !important; }
  .container .process-1-word {
    left: 56px !important;
    font-size: 25px !important; }
  .container .process-2-word {
    left: 56px !important;
    width: 220px !important; }
  .container .skin-word {
    top: 64%;
    left: 50px !important;
    width: 34% !important; }
    .container .skin-word .title {
      font-size: 34px !important; }
    .container .skin-word .desc {
      font-size: 15px !important; }
  .container .plant-1-word {
    width: 34% !important;
    left: 50px !important;
    top: 64%; }
    .container .plant-1-word .title {
      font-size: 34px !important; }
    .container .plant-1-word .desc {
      font-size: 15px !important; }
  .container .skin-2-word {
    left: 293px !important;
    width: 34% !important; }
    .container .skin-2-word .title {
      font-size: 34px !important; }
    .container .skin-2-word .desc {
      font-size: 15px !important; }
  .container .skin-3-word, .container .skin-4-word {
    left: 293px !important;
    width: 34% !important; }
    .container .skin-3-word .desc, .container .skin-4-word .desc {
      font-size: 15px !important; }
  .container .yj-1-word {
    width: 34% !important;
    left: 50px !important;
    top: 64% !important; }
    .container .yj-1-word .title {
      font-size: 34px !important; }
    .container .yj-1-word .desc {
      font-size: 15px !important; }
  .container .solve-1-word {
    width: 34% !important;
    left: 50px !important; }
    .container .solve-1-word .title {
      font-size: 34px !important; }
    .container .solve-1-word .desc {
      font-size: 15px !important; }
  .container .expert-1-word {
    width: 50% !important;
    left: 50px !important;
    top: 64%; }
    .container .expert-1-word .title {
      font-size: 34px !important; }
    .container .expert-1-word .desc {
      font-size: 15px !important; }
  .container .examine-1-word {
    width: 34% !important;
    left: 50px !important; }
    .container .examine-1-word .title {
      font-size: 34px !important; }
    .container .examine-1-word .desc {
      font-size: 15px !important; }
  .container .examine-1-word-tips {
    left: 50px !important; }
  .container .expert-3-word {
    left: 293px !important; }
    .container .expert-3-word .title {
      font-size: 34px !important; }
    .container .expert-3-word .desc {
      font-size: 15px !important; }
    .container .expert-3-word .xhs-icon {
      width: 60px !important; }
  .container .newsPos {
    padding: 21vh 20vw 5vh 17vw; }
  .container .level3-nav {
    left: 65px !important; }
  .container .arrowImg {
    left: 50px !important; }
  .container .level3-nav-single {
    font-size: 14px !important; }
  .container .icon-menu .icon-menuLine {
    width: 18px !important; }
  .container .plantPos {
    padding-left: 210px !important; }
    .container .plantPos .box {
      height: 61% !important; }
      .container .plantPos .box .p1 {
        font-size: 25px !important; }
  .container .zgPos {
    padding-left: 210px !important; }
  .container .plantNewsPos {
    padding-left: 203px !important; }
  .container .brand-newsList {
    align-items: flex-start; }
    .container .brand-newsList .newsList-single .bg {
      width: 320px !important; }
    .container .brand-newsList .newsList-single .newsText {
      font-size: 13px !important; }
  .container .brandNews {
    padding: 18vh 19vw 5vh 17% !important; }
  .container .p2 {
    font-size: 12px !important; }
  .container .skinTypeList .skinTypeList-box .skinTypeList-title .skinTypeList-title-left {
    font-size: 13px !important; }
  .container .skinTypeList .skinTypeList-box .skinTypeList-title .skinTypeList-title-right {
    width: 16px !important; }
  .container .skinTypeList .skinTypeList-box .skinTypeList-slogan .skinTypeList-slogan-left {
    font-size: 20px !important; }
  .container .skinTypeList .skinTypeList-box .skinTypeList-slogan .circle-arrow {
    width: 11px !important; }
  .container .skinTypeList2 {
    margin-top: -16% !important; }
  .container .level-3-cover {
    width: 230px !important; }

  .itemListFixed {
    width: 121px !important; }

  .itemListFixed2 {
    width: 124px !important; }

  .wordFixed1 {
    font-size: 14px !important; }

  .understand-box {
    width: 100px !important;
    line-height: 32px !important;
    font-size: 14px !important; }

  .understand-box1, .understand-box3, .understand-box4 {
    bottom: 66px !important; }

  .skinExamplePos .box .p2 {
    font-size: 16px !important;
    bottom: 6% !important; }

  .materialsContent {
    width: 29vw !important; }
    .materialsContent .list .list-single .materialsName {
      font-size: 18px !important;
      line-height: 50px !important; }
    .materialsContent .list .list-single .desc {
      font-size: 12px !important;
      padding: 12px 0 !important; }

  .materialsPos {
    padding-left: 4% !important; }
    .materialsPos .materials-zd {
      padding-top: 6.5% !important; }

  .fyPos {
    padding-left: 203px !important; }
    .fyPos .fyPosNext .fyPosDesc .descTitle {
      font-size: 36px !important; }
    .fyPos .fyPosNext .fyPosDesc .descContent {
      font-size: 14px !important; }

  .sub-materials-swiper, .sub2-materials-swiper, .sub3-materials-swiper, .sub4-materials-swiper, .sub5-materials-swiper {
    padding-top: 6.5% !important;
    width: 38vw !important; }

  .jumpToWx {
    left: -18px !important; }

  .fy-word {
    font-size: 16px !important; }

  .yj-swiper .skinTypeList2 {
    margin-top: -5% !important; }

  .schemePos {
    padding-right: 3% !important; }
    .schemePos .tableList .rl .tableList2 .tableList-single .single-body .single-body-left1 {
      font-size: 12px !important;
      width: 100px !important; }
    .schemePos .tableList .rl .tableList2 .tableList-single .single-body .single-body-right .productList .productList-single img {
      width: 17px !important; } }
@media screen and (min-width: 1501px) and (max-width: 1910px) {
  .logo {
    position: absolute;
    z-index: 200;
    top: 81px;
    width: 158px;
    left: 140px; }

  .itemListFixed {
    width: 127px !important; }

  .itemListFixed2 {
    width: 128px !important; } }
@media screen and (min-width: 1911px) and (max-width: 30000px) {
  .logo {
    position: absolute;
    z-index: 200;
    top: 81px;
    width: 158px;
    left: 140px; }

  .logoList {
    width: 75% !important; }

  .aboutThree1 {
    width: 22% !important;
    margin: 0 3% !important; }

  .aboutThree2, .aboutThree3 {
    width: 22% !important;
    margin: 0 4.5% !important; }

  .text1 {
    font-size: 48px !important; }

  .text2 .title {
    font-size: 48px !important; }
  .text2 .tips {
    font-size: 18px !important; }
  .text2 .iconList .icon-single img {
    width: 48px !important; }
  .text2 .iconList .icon-single p {
    font-size: 18px !important; }

  .menu-fixed .content .menu .menuList .menuList-single .itemList .item {
    font-size: 17px !important; }
  .menu-fixed .content .menu .menuList .menuList-single .title :nth-child(2) {
    font-size: 17px !important; }
  .menu-fixed .content .menu .menuList .menuList-single .title .BrandDiscovery, .menu-fixed .content .menu .menuList .menuList-single .title .SkincareSolutions {
    font-size: 17px !important; }
  .menu-fixed .content .search .CnEn {
    font-size: 17px !important; }
  .menu-fixed .content .search .search-input input {
    font-size: 17px !important; }

  .level3-nav {
    top: 428px !important; }

  .text4Fixed .ppryTitle {
    font-size: 18px !important; }
    .text4Fixed .ppryTitle :nth-child(2) {
      font-size: 24px !important; }
  .text4Fixed .ppryList {
    font-size: 16px !important;
    margin-left: 22px !important; }

  .more .leftBar .wb {
    top: 292px !important; }
  .more .text .title {
    font-size: 17px !important;
    margin-top: 58px !important; }
  .more .text .itemList .item {
    font-size: 17px !important; }

  .brand-newsList {
    align-items: flex-start; }
    .brand-newsList .newsList-single .bg {
      width: 440px !important; }

  .newsPos {
    padding: 18vh 19vw 5vh 6.5% !important; }

  .level-3-cover-responsibility {
    width: 13% !important; }

  .brandNews {
    padding: 16vh 19vw 5vh 15.5% !important; }

  .plantPos .box {
    height: 74% !important; }

  .text3 .title {
    font-size: 48px; }
  .text3 .tips {
    font-size: 18px; }

  .skin-word .title, .skin-2-word .title, .skin-3-word .title, .plant-1-word .title, .yj-1-word .title, .solve-1-word .title, .expert-1-word .title, .examine-1-word .title {
    font-size: 48px !important; }
  .skin-word .desc, .skin-2-word .desc, .skin-3-word .desc, .plant-1-word .desc, .yj-1-word .desc, .solve-1-word .desc, .expert-1-word .desc, .examine-1-word .desc {
    font-size: 18px !important; }

  .zgPos {
    padding-left: 330px !important; } }
@media screen and (min-width: 200px) and (max-width: 1500px) and (min-height: 700px) {
  .search {
    margin-top: 13.5vh !important; } }
@media screen and (min-width: 200px) and (max-width: 1500px) and (max-height: 700px) {
  .search {
    margin-top: 5vh !important; } }
/*高度小于700*/
@media screen and (min-width: 1911px) and (max-width: 30000px) and (max-height: 700px) {
  .search {
    margin-top: 7vh !important; } }
/*高度大于700*/
@media screen and (min-width: 1911px) and (max-width: 30000px) and (min-height: 700px) {
  .search {
    margin-top: 15vh !important; } }
/* 适配各种屏幕尺寸 */
/*
@media (min-width: 1024px){
  body,html{font-size: 18px !important;}
}
@media (min-width: 1100px) {
  body,html{font-size: 20px !important;}
}
@media (min-width: 1280px) {
  body,html{font-size: 22px !important;}
}
@media (min-width: 1366px) {
  body,html{font-size: 24px !important;}
}
@media (min-width: 1440px) {
  body,html{font-size: 25px !important;}
}
@media (min-width: 1680px) {
  body,html{font-size: 28px !important;}
}
@media (min-width: 1920px) {
  body,html{font-size: 33px !important;}
}*/