@charset "UTF-8";
.header_user_info {
  float: right;
  border-left: 1px solid #515151;
  border-right: 1px solid #515151; }
  .header_user_info a {
    color: white;
    font-weight: bold;
    display: block;
    padding: 8px 9px 11px 8px;
    cursor: pointer; }
    @media (max-width: 479px) {
      .header_user_info a {
        font-size: 11px; } }
    .header_user_info a:hover, .header_user_info a.active {
      background: #2b2b2b; }
  .header_user_info + .header_user_info {
    border-right: none; }

.user_info {
  float: right;
  margin: 0;
  clear: right;
  padding: 50px 15px 10px 0; }
  .user_info li {
    display: block;
    float: left;
    padding: 0 0 0 9px; }
    .user_info li.account_li {
      display: none; }
    .user_info li a {
      display: block;
      height: 56px;
      width: 56px;
      background: #fff;
      color: #00456e;
      text-align: center;
      -moz-transform: translateZ(0px);
      -ms-transform: translateZ(0px);
      -o-transform: translateZ(0px);
      -webkit-transform: translateZ(0px);
      transform: translateZ(0px);
      -moz-transform: scale(1);
      -ms-transform: scale(1);
      -o-transform: scale(1);
      -webkit-transform: scale(1);
      transform: scale(1); }
      .user_info li a:before {
        content: "\f007";
        font-family: "FontAwesome";
        font-size: 30px;
        line-height: 56px; }
      .user_info li a.logout:before {
        content: ""; }
      .user_info li a.account {
        background: #ffd400; }
        .user_info li a.account:hover {
          background: #c1a102; }
        .user_info li a.account:before {
          content: ""; }
      .user_info li a span {
        display: none; }
      @media (min-width: 1200px) {
        .user_info li a:hover {
          -moz-animation-duration: 0.3s;
          -webkit-animation-duration: 0.3s;
          animation-duration: 0.3s;
          -moz-animation-iteration-count: 1;
          -webkit-animation-iteration-count: 1;
          animation-iteration-count: 1;
          -moz-animation-name: usInfo;
          -webkit-animation-name: usInfo;
          animation-name: usInfo;
          -moz-animation-timing-function: linear;
          -webkit-animation-timing-function: linear;
          animation-timing-function: linear; } }
  @media (max-width: 479px) {
    .user_info {
      position: absolute;
      left: 0;
           padding: 0 15px; }
      .user_info li {
        padding: 0; }
        .user_info li a {
          height: 34px;
          width: 34px; }
          .user_info li a:before {
            font-size: 20px;
            line-height: 34px; } }

@-webkit-keyframes usInfo {
  50% {
    -moz-transform: scale(1.15);
    -ms-transform: scale(1.15);
    -o-transform: scale(1.15);
    -webkit-transform: scale(1.15);
    transform: scale(1.15); } }
@keyframes usInfo {
  50% {
    -moz-transform: scale(1.15);
    -ms-transform: scale(1.15);
    -o-transform: scale(1.15);
    -webkit-transform: scale(1.15);
    transform: scale(1.15); } }