#header {
  width: 900px;
  height: 200px;
  margin: 0 0 15px;
  padding: 0 0 23px;
  background: url(../img/header.png) 0 33px no-repeat;
}

html:not(.simple).dfwriting > body > #header,
html.simple > body > #header {
  height: 55px;
  margin: 0 0 20px;
  padding: 0;
  background: none;
}

#header > h1 {
  position: absolute;
  height: 23px;
  margin: 19px 0 0 5px;
}

#header > h1 > a {
  display: inline;
  float: left;
  height: 16px;
  color: #404040;
  font-size: 14px;
  font-family: 'montserratregular',arial;
  line-height: 16px;
  letter-spacing: 1px;
  text-decoration: none;
}

#header > h1 > a.zh {
  font-size: 12px;
  font-weight: bold;
  font-family: 'microsoft yahei',stheiti,simhei,tahoma;
  text-decoration: none;
}

#header > h1 > span{
  display: inline;
  float: right;
  height: 20px;
  margin: 3px 0 0 3px;
  user-select: none;
}

#header > h1 > span > sup.heart {
  display: block;
  width: 10px;
  height: 10px;
  background: url(../img/ico.heart.svg) no-repeat;
}

#header > h1 > span.like > sup.heart {
  background: url(../img/ico.heart_ok.svg) no-repeat;
}

#header > h1 > span > a.tip,
#header > h1 > span > span.tip {
  display: block;
  height: 15px;
  margin: -5px 0 0 15px;
  padding: 0 3px 0 7px;
  font-weight: bold;
  font-family: arial;
  line-height: 15px;
  text-decoration: none;
  background: #ebebeb url(../img/link.arrow.svg) no-repeat;
}

#header > h1 > span > a.tip {
  color: #5f5f5f;
}

#header > h1 > span > span.tip {
  color: #9f9f9f;
}

#header > h1 > span > a.tip > small.size10,
#header > h1 > span > span.tip > small.size10 {
  transform-origin: 50% 60%;
}

#header > i.btn {
  position: absolute;
  display: block;
  width: 20px;
  height: 20px;
  margin: 17px 0 0 880px;
  background: url(../img/ico.hide.svg) 5px 5px no-repeat;
  cursor: pointer;
}

html.simple > body > #header > i.btn {
  background-image: url(../img/ico.show.svg);
}