/* 大屏幕专属样式 */
@media (min-width: 768px) {
  #contrast .layui-form-select,
  #contrast .layui-unselect {
    margin-right: 32px;
    border: none;
  }
  #contrast .layui-unselect {
    border-bottom: 1px solid#999999;
  }
}
.phonesh{
  display: none;
}
#contrast .layui-input,
#contrast .layui-form-select {
  width: 256px;
}
#contrast .contrast_content li:nth-child(2n-1) div {
  background-color: #f6f7f8;
}
.layui-menu-body-title {
}
.contrast_content a:hover{
color: #fff;
  font-family: PingFangSC-Medium, RedHatDisplay-Medium, Oswald-Medium, "Microsoft YaHei";
    font-weight: 500 !important;
}
.contrast_content_imgbox .w-96{
  width: 110px;
}
.contrast_content_imgbox .bg-black{
  transition: all 0.3s;

}
.contrast_content_imgbox .bg-black:hover{
  background: #ff4610;
}
.pull_down {
  width: 256px;
  height: 37px;
  color: #000;
  display: flex;
  justify-content: space-between;
  font-family: PingFang SC;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  background-color: #fff;
  margin-right: 32px;
  border: none;
  border-bottom: 1px solid#999999;
  text-align: left;
  border-radius: 0 !important;
  font-family: PingFangSC, "Microsoft YaHei", "Helvetica Neue",
    "Hiragino Sans GB", "WenQuanYi Micro Hei", Arial, sans-serif !important;
}
.pull_down:hover {
  color: #000;
}
.layui-dropdown {
  /* width: auto;
  z-index: 50 !important; */
}
#contrast{
  position: relative;
  padding-top: 80px;
}

/* 下拉框样式 */
.contrast_nav select {
  width: 444px;
  height: 57px;
  color: #000;
  font-family: PingFang SC;
  font-size: 30px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  border-radius: 0;
  border: none;
  text-align: center;
  background-color: #fff;
  margin-left: 12px;
  margin-right: 12px;
  border-bottom: 1px solid#cdcfd6;
}
.contrast_nav select option {
  text-align: center;
  font-family: PingFang SC;
  font-size: 26px !important;
  padding: 4px;
  font-style: normal;
  font-weight: 500;
}
.layui-btn + .layui-btn {
  margin-left: 0 !important;
}
.contrast_parameter li span {
}
.layui-dropdown {
  /* max-height: 500px; */
  /* overflow-y: auto; */
}
.layui-menu {
  margin-top: 24px;
}
.layui-menu-body-title > .layui-icon {
  font-size: 12px;
}
@media screen and (min-width: 1024px) and (max-width: 1199px) {
  .w-1152 {
    width: 888px;
  }
  .w-256 {
    width: 235px;
  }
  .w-864 {
    width: 788px;
  }
  .layui-btn {
    width: 30%;
  }
  .check_box {
    opacity: 0;
  }
}
/* 大pad */
@media screen and (min-width: 1024px) and (max-width: 1199px) {
  .w-1152 {
    width: 888px;
  }
  .w-256 {
    width: 235px;
  }
  .w-864 {
    width: 788px;
  }
  .layui-btn {
    width: 30%;
  }
  .check_box {
    opacity: 0;
  }
  .contrast_nav{
    font-size: 32px;
  }
  .select-selected span{
    font-size: 32px;
  }
}
/* 移动端 */
@media (max-width: 1023px) {
  /* 设备对比 */
  .md_contrast_content_imgBox {
    padding-bottom: 6.93vw;
  }
  #contrast .contrast_nav h2 {
    font-size: 4.867vw;
    line-height: 5.867vw;
  }
  .contrast_nav select {
    font-size: 4.5vw;
    width: 45vw;
    /* margin: 0 3.2vw; */
  }
  #contrast .contrast_nav {
    margin-bottom: 12.8vw;
    padding-left: 16px;
    padding-right: 16px;
  }
  #contrast .md_contrast_content {
    padding: 0 4.267vw;
    padding-bottom: 4vw;
  }
  #contrast .md_contrast_content .layui-input,
  #contrast .pull_down {
    width: 43vw;
    height: 10vw;
    border-radius: 1.067vw !important;
    border: 1px solid var(--300, #cdcfd6);
    display: flex;
    padding: 13px 8px;
    justify-content: space-between;
    align-items: center;
    margin-right: 0;
  }
  #contrast .pull_down span {
    font-size: 3.2vw;
  }
  .layui-menu-body-title {
    font-size: 3.2vw;
  }
  .layui-dropdown {
    width: 44vw;
  }
  #contrast .md_contrast_content div.df-sb {
  }
  #contrast .md_contrast_content div.df-sb > div {
    width: 44.8vw;
  }
  #contrast .md_contrast_contentBtn {
    height: 10.667vw;
    margin-bottom: 3vw;
  }
  #contrast .md_contrast_content p {
    font-size: 2.733vw;
    margin-top: 5.333vw;
  }
  #contrast .md_contrast_content hr {
    margin-bottom: 4.533vw;
    margin-top: 3vw;
  }
  #contrast .md_contrast_content h3 {
    font-size: 4.8vw;
  }
  #contrast .md_contrast_content_switch {
    height: 21.333vw;
    margin-top: 26px;
  }
  #contrast .md_contrast_content ul li > div {
    width: 44.8vw;
    border-top: 0.267vw solid #e6e7ea;
    padding: 3vw 0;
  }
  #contrast .md_contrast_content ul li:first-child > div {
    border-top: none;
  }
  #contrast .md_contrast_content ul li {
    align-items: flex-start;
  }

  /* 隐藏相同选项 */
  .md_contrast_content_switch form .HideSame {
    height: 80px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid#E6E7EA;
    border-bottom: 1px solid#E6E7EA;
  }
  .md_contrast_content_switch form .HideSame .layui-input-block {
    margin-left: 0;
  }
  .md_contrast_content_switch form .HideSame .layui-unselect {
    /* width: 50px; */
    /* height: 30px; */
  }
  .md_contrast_content_switch form .HideSame .layui-unselect i {
    /* width: 28px;
    height: 28px; */
  }
  .layui-menu li:hover {
    color: #fff;
  }
  .layui-menu li {
    padding-left: 4vw;
    padding-right: 4vw;
  }

  .layui-dropdown {
    box-shadow: 0 0 1vw 0.2vw rgba(0, 0, 0, 0.1) !important;
  }
  .layui-menu-item-parent:hover > .layui-menu-body-panel {
    box-shadow: 0 0 1vw 0.2vw rgba(0, 0, 0, 0.1) !important;
  }
  .md_contrast_content .contrast_nav select {
    width: 45vw;
    font-size: 6vw;
  }
  .layui-menu-item-parent:hover > .layui-menu-body-panel {
    margin-left: 4px !important;
  }
}
#seriesType{
 
}
@media screen and (min-width: 768px) and (max-width: 1023px){
  .contrast_content {
    width: 96%;
  }
  .phonesh{
    display: block;
  }
  .sunthyj{
    display: flex;
    justify-content: center;
  }
  .select-selected svg{
    margin-right: 15%;
  }
  .softwareText p{
    opacity: 0;
  }
  #contrast .contrast_nav{
    margin-bottom:5.8vw ;
  }
  .md_contrast_contentBtn .fs-14 {
    font-size: 3.4vw;
  }
  .sametonswite{
    font-size: 3.4vw;
  }
  .switchBtn{
    display: flex;
    justify-content: end;
  }
  .layui-form-switch{
    min-width: 54px;
    height: 31px;
  }
  .layui-form-switch i{
    top: 10px;
  }
  .md_contrast_content_imgBox{
    margin-bottom: 2.93px;
  }
  .md_contrast_content_dataBox li span{
    font-size: 2.733vw;
  }
  .md_contrast_content_dataBox li p{
    font-size: 12px;
  }
  .md_contrast_contentBtn a:hover {
color: #fff;
  }
}
.custom-select {
  position: relative;
  width: 200px;
  font-family: Arial, sans-serif;
}

/* 选中项显示区域样式 */
.select-selected {
  border-bottom: 1px solid #cdcfd6;
  margin-left: 16px;
  margin-right: 16px;
  
  padding: 8px 12px;
  cursor: pointer;
  user-select: none;
  width: 577px;
  height: 57px;
  color: #000;
  font-family: PingFang SC;
  font-size: 30px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  border-radius: 0;
  border: none;
  text-align: center;
  background-color: #fff;
  margin-left: 12px;
  margin-right: 12px;
  border-bottom: 1px solid#cdcfd6;
}

/* 下拉选项列表样式 */
.select-items {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  z-index: 99;
  background-color: #fff;
  border-radius: 6px;
background: #FFF;

/* 常规投影/常规投影 */
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.04), 0px 4px 32px 0px rgba(0, 0, 0, 0.06);
  display: none;
  padding: 4px 8px;
}

/* 每个选项的样式 */
.select-items div {
  padding: 8px 12px;
  cursor: pointer;
}

/* 鼠标悬停在选项上的样式 */

.select-option{
  font-size: 26px;
  line-height: 34px;
  display: flex;
 padding: 7px 12px;
 
 margin: 0 auto;
 font-size: 16px;
 border-radius: 6px;

}
.select-option:hover {
  background: var(--Color-Fill-4, #F2F4F7);
}
.select-selected svg{
  position: absolute;
  top: 40%;
  /* transform:translateY(-50%) ; */
  right: 5%;
  transition: all 0.5s;
  fill: #000;
  transform: rotate(180deg);
  transform-origin: center;
}
.sunburl{
  border-bottom: 1px solid  #FF4610;
background: var(--Color-Background-1, #FFF);

}

.sunburl svg{

  transform: rotate(0deg);
  fill: #ff4610;
}

@media  (max-width: 767px) {
  #contrast{
    padding-top: 2.667vw;
  }
  .select-selected svg{
    right: 20%;
    top: 34%;
    /* transform:translateY(0%) ; */
  }
  .sunburl{
    border: 1px solid var(--Color-Brand-Normal, #FF4610) !important;
  background: var(--Color-Background-1, #FFF);
  color: #ff4610;
  }
  .sunburl span{
    transition: all 0.3s;
    color: #ff4610;
  }
  .sunburl svg{
  
    transform: rotate(0deg);
    fill: #ff4610;
  }
  .md_contrast_contentBtn a:hover{
    color: #fff;
  }
  .select-selected{
    width: 100%;
    border-radius: 1.600vw;
    border: 0.267vw solid var(--Color-Fill-4, #F2F4F7);
    background: var(--Color-Fill-5, #FAFAFB);
    font-size: 3.733vw;
    line-height: 5.867vw; /* 157.143% */
    margin: 0;
    padding: 0;
    height: auto;
    padding: 3.200vw;
    color: var(--Color-Text-T2, #61687C);
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #contrast .contrast_nav{
    margin-bottom: 4.267vw;
  }
  #contrast .md_contrast_content .layui-input, #contrast .pull_down{
    border: none;
    border-bottom: 1px solid var(--Color-Fill-3, #E5E6EB);
    background: #FFF;
    color: var(--Color-Text-Title, #171B25);
    border-radius: 0 !important;
  }
  .md_contrast_content_imgBox{
    padding-bottom: 3.200vw;
  }
  .sametonswite{
    color: var(--Color-Text-T1, #414960);
/* 14_T2/🔹CN-400 */
font-size: 3.733vw;

font-weight: 400;
line-height: 5.867vw; /* 157.143% */
padding: 3.200vw 0;
  }
  .switchBtn{
    width: 10.133vw !important;
  }
  .layui-form-switch{
    width: 10.133vw;
    height: 5.333vw;
  }
  .layui-form-switch i{
    top: 0.297vw;
    left: 0.533vw;
  }
  .layui-form-onswitch{
    background: #000;
    border-color:#000;
  }
  .layui-form-onswitch i{
    margin-left: 4.267vw;
  }
  #contrast .md_contrast_content div.df-sb > div {
    width: calc(44.8vw - 2.133vw);
  }


  /* 修改下方的 */
  .md_contrast_content_dataBox li>.tc span{
    color: var(--Color-Text-Title, #171B25);
    font-size: 4.267vw;
    line-height: 6.400vw; /* 150% */
  }
  .md_contrast_content_dataBox li>.tc p {
    margin-top:3.2vw !important;
    color: var(--Color-Text-Title, #171B25);
  }
  #contrast .md_contrast_content ul li > div{
    border-top: none;
  }
  #contrast .md_contrast_content ul li > div{
    padding: 4.267vw 0;
  }
  .select-option{
    padding:1.600vw 2.133vw ;
    color: var(----300, #34363D);
  }
  .phonesh{
    display: block;
  }
  .fengexian{
    height: 4.267vw;
    width: 100vw;
    background: #f6f7f8;
    position:absolute ;
    top: 115.133vw;
    z-index: 99;
  }
  .layui-menu li:hover{
    background: #000;
  }
  .layui-menu{
    margin-top: 2.667vw;
  }
  .layui-dropdown{
    box-shadow: 0.000vw 0.000vw 2.667vw 0.000vw rgba(0, 0, 0, 0.04), 0.000vw 1.067vw 8.533vw 0.000vw rgba(0, 0, 0, 0.06) !important;
    border-radius: 1.600vw;
  }
  .contrast_nav h2{
    margin-top: 4.267vw;
  }
  .sun-siwtch{
    border-top: 1px solid #E5E6EB;
  }
  .phonesh h3{
  color: #000;
  }
  .layui-form-switch i{
    width: 4.267vw;
    height: 4.267vw;
  }
}

