.logo{display:flex;flex-direction:column;justify-content:center;width:315px;margin-left:18px;color:#167ab0;letter-spacing:1px}
.logo span{font-family:STKaiti,"Microsoft YaHei",sans-serif;font-size:25px;font-weight:700;white-space:nowrap}
.logo small{margin-top:2px;color:#555;font-size:12px;letter-spacing:2px}
.header-banner{margin-left:80px}
.hero-brand{position:absolute;top:45px;left:50%;transform:translateX(-50%);width:570px;max-width:85%;padding:13px 20px;text-align:center;border-radius:3px;background:rgba(40,194,195,.9);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.12)}
.hero-brand strong,.hero-brand span{display:block}.hero-brand strong{font-size:30px;font-weight:400;letter-spacing:2px}.hero-brand span{margin-top:3px;font:25px Georgia,serif;letter-spacing:4px}
@media(max-width:900px){.logo{width:270px;margin:0}.logo span{font-size:22px}.header-banner{margin-left:auto}.hero-brand{top:25px}.hero-brand strong{font-size:23px}.hero-brand span{font-size:18px}}
@media(max-width:620px){.logo{width:100%}.hero-brand{top:10px;padding:7px}.hero-brand strong{font-size:18px}.hero-brand span{font-size:13px;letter-spacing:2px}}