@charset "utf-8"; #wrap{ width: 100%; margin: auto; } header{ width: 100%; height: 90px; } header h1{ width: 293px; margin-left: 195px; padding: 22px 0; } header .h-right > ul{ margin-right: 90px; } header .h-right > ul > li{ height: 62px; line-height: 66px; } header .h-right > ul > li > a{ padding: 24px 20px 20px; color: #fff; font-size: 16px; } header .h-right div{ color: #fff; height: 62px; line-height: 66px; margin-right: 160px; } header .h-right div i{ width: 16px; height: 16px; margin-right: 13px; background:url("../img/1.png") no-repeat center top/100%; vertical-align: middle; } header .h-right div p{ font-size: 16px; vertical-align: middle; } header .h-right div p span:nth-of-type(1){ margin-right: 12px; } header .h-right div p span:nth-of-type(2){ margin-left: 12px; } .zudodfh{ display: none; position: fixed; right: 0px; top: 30%;z-index: 99999999999999999999999999; transform: translate(0%, -50%); -ms-transform:translate(0%, -50%); -moz-transform:translate(0%, -50%); -webkit-transform:translate(0%, -50%); -o-transform:translate(0%, -50%); } .zudodfh_x span{display:block; width:25px;height: 25px; background-size: 100% 100%; margin: 5px auto; } .zudodfh_x{transition: all 0.6s; -webkit-transition: all 0.6s;position: relative; background-color: #fff; padding: 8px 8px; margin: 3px 0px;cursor: pointer;} .zudodfh_x.zudodfh_x1 span{background-image: url(../img/sdhia1s.png);} .zudodfh_x.zudodfh_x2 span{background-image: url(../img/sdhia3s.png);} .zudodfh_x.zudodcolor1{ background-color: #F2765A;} .zudodfh_x.zudodcolor2{ background-color: #F0B35A;} .zudodfh_x.zudodcolor3{ background-color: #599EF1;} .zudodfh_x.zudodcolor4{ background-color: #6D5AF1;} .zudodfh_x.zudodfh_x1 span{background-image: url(../img/sdhia1s2.png);} .zudodfh_x.zudodfh_x2 span{background-image: url(../img/sdhia1s2.png);} .zudodfh_x25 span{background-image: url(../img/sdhia2s.png);} .zudodfh_x25 span{background-image: url(../img/sdhia1s2.png);} .zudodfh_x p, .zudodfh_x a{ color: #000; font-size: 12px;} .zudodfh_x:hover{ border: none;} .zudodfh_x p, .zudodfh_x a{ color: #fff; } .zudodfh_xdh{position:absolute; height: 67px;width: 100%; background-color: #ee6449; color: #fff;z-index: -1; line-height:67px; padding: 0px 25px;top: 0px; right: -50px;overflow: hidden; transition: all 0.6s; -webkit-transition: all 0.6s; } .zudodfh_x.zudodcolor3 .zudodfh_xdh{ background-color: #599EF1;} .zudodfh_x.zudodcolor4 .zudodfh_xdh{ background-color: #6D5AF1;} .zudodfh_x:hover .zudodfh_xdh{right: 100%;width: auto;white-space:nowrap;} @media screen and (max-width:990px) { .zudodfh{right: 0px;} .zudodfh_x { padding: 5px 9px; margin: 3px 0px; cursor: pointer; } .zudodfh_x span { width: 25px; height: 25px; margin: 5px auto; } .zudodfh_x p, .zudodfh_x a { font-size: 12px; } .zudodfh_xdh{line-height: 66px; height: 66px;} } @media screen and (max-width: 768px){ .zudodfh{display: none} } @media screen and (max-width:414px) { .zudodfh { right: 0px; top: 45%; } .zudodfh_x { padding: 5px; cursor: pointer; } .jsdiizbanner{width: 90%;} .jsdiizbanner p { font-size: 14px; line-height: 25px; } } .wxerm{position: absolute; right: 120%; top: -5px;height:100px;width: 100px; display: none;} .wxerm img{ width: 100%;} .zudodfh_x25:hover .wxerm{display: block;}