@charset "utf-8";

blockquote,

body,

dd,

div,

dl,

dt,

fieldset,

form,

h1,

h2,

h3,

h4,

h5,

h6,

html,

input,

li,

ol,

p,

pre,

span,

table,

td,

textarea,

th,

ul {

  margin: 0;

  padding: 0

}



body {

  font-size: 16px;

  font-family: "Microsoft Yahei", Verdana, Arial, Helvetica, sans-serif;

  padding-top: 1px;

  background: #ebebeb;

  max-width: 640px;

min-width: 320px;

margin: 0 auto;

}



li,

ol {

  list-style: none

}



ins {

  text-decoration: none

}



em,

i {

  font-style: normal

}



a {

  text-decoration: none;

  font-family: "Microsoft Yahei"

}



a:hover {

  cursor: pointer;

  text-decoration: none

}



a:active {

  star: expression(this.onFocus=this.blur())

}



:focus {

  outline: 0

}



.clear {

  clear: both;

  line-height: 0;

  overflow: hidden;

  zoom: 1;

  font-size: 0;

  content: '.'

}



.clearfix:after {

  visibility: hidden;

  display: block;

  font-size: 0;

  content: " ";

  clear: both;

  height: 0

}



img {

  padding: 0;

  margin: 0;

}



a img {

  border: none

}



input,

textarea {

  border: none;

  font-family: "Microsoft Yahei";

  font-size: 13px

}



h1,

h2,

h3,

h4,

h5,

h6 {

  font-weight: 400;

  font-size: 1em

}



.f-mm {

  margin-left: auto;

  margin-right: auto

}



.f-fl {

  float: left

}



.f-fr {

  float: right

}



.f-tr {

  text-align: right

}



.f-tl {

  text-align: left

}



.f-tc {

  text-align: center

}



.f-pr {

  position: relative

}



.f-di {

  display: inline

}



.u-co-bt {

  border-radius: 4px;

  width: 80px;

  height: 26px;

  line-height: 26px;

  display: inline-block;

  vertical-align: middle;

  padding-top: 1px

}



.u-co-bt.z-spe {

  width: 100%

}



.u-lico {

  width: 24px;

  height: 24px;

  border-radius: 4px;

  background: #000;

  padding: 10px;

  opacity: .8;

  position: relative;

  left: 50%;

  margin: 10px 0 10px -14px;

  box-shadow: 0 0 3px #2d2d2d

}



.fs15 {

  font-size: 15px

}



.fs12 {

  font-size: 12px

}



.pdr12 {

  padding-right: 12px

}



.pl10 {

  padding-left: 10px

}



.red {

  color: red

}



.emptyData {

  padding-left: 10px;

  line-height: 26px

}



.wrap {

  max-width: 640px;

  min-width: 320px;

  margin: 0 auto;

  overflow: hidden;

  position: relative;

  background: #fff

}



.g-back {

  overflow: hidden;

  position: relative;

  text-align: right;

  margin-top: 1px;

  height: 38px;

  padding: 7px 11px 0 9px

}



.g-back a {

  display: inline-block;

  font-size: .875em;

  height: 32px;

  line-height: 28px;

  width: 32px;

  position: relative

}



.g-back .u-bp {

  background-position: 0 0

}



.g-back .u-bl {

  background-position: 0 -286px

}



.g-back .u-bh {

  margin-right: 10px;

  background-position: 0 -232px

}



.social_nav2 {

  height: 55px;

  width: 306px;

  position: fixed;

  bottom: 0;

  left: 0;

  z-index: 999;

  overflow: hidden

}



.social_nav2 .social2 {

  display: block;

  width: 288px;

  height: 55px;

  margin-right: 18px;

  overflow: hidden;

  position: relative

}



.social_nav2 a {

  height: 55px;

  line-height: 85px;

  font-size: 13px;

  width: 22%;

  display: inline-block;

  font-size: 12px;

  position: relative;

  z-index: 11;

  text-align: center

}



.social_nav2 a.tel {

  width: 22%;

  text-indent: 5px

}



.social_nav2 span {

  display: block;

  width: 35px;

  height: 25px;

  position: absolute;

  top: 0;

  z-index: 10

}



.social2 {

  background-image: -webkit-gradient(linear, left top, left bottom, from(#32323a), to(#23232b));

  background-image: -webkit-linear-gradient(top, #32323a, #23232b);

  background-image: -moz-linear-gradient(top, #32323a, #23232b);

  background-image: -o-linear-gradient(top, #32323a, #23232b);

  background-image: -ms-linear-gradient(top, #32323a, #23232b);

  background-image: linear-gradient(top, #32323a, #23232b)

}



.social2 a {

  color: #fff

}



.social2:before {

  content: '';

  height: 1px;

  width: 100%;

  background: #000;

  border-bottom: 1px solid #4b4c57;

  position: absolute;

  top: 0;

  left: 0

}



.social2:after {

  content: '';

  height: 1px;

  width: 100%;

  background: #000;

  border-top: 1px solid #4b4c57;

  position: absolute;

  bottom: 0;

  left: 0

}



.social2 b {

  width: 1px;

  height: 100%;

  background: #000;

  border-left: 1px solid #4b4c57;

  position: absolute;

  top: 0;

  right: 0

}



.social_nav2 span.tel {

  left: 14px;

  top: 7px;

  height: 30px;

  background-position: 8px -49px;

  animation-name: telshow;

  animation-duration: 1s;

  animation-timing-function: linear;

  animation-iteration-count: infinite;

  -webkit-animation-name: telshow;

  -webkit-animation-duration: 1s;

  -webkit-animation-timing-function: linear;

  -webkit-animation-iteration-count: infinite;

  -o-animation-name: telshow;

  -o-animation-duration: 1s;

  -o-animation-timing-function: linear;

  -o-animation-iteration-count: infinite

}



@keyframes telshow {

  0% {

    transform: rotate(0)

  }

  5% {

    transform: rotate(-13deg)

  }

  10% {

    transform: rotate(0)

  }

  15% {

    transform: rotate(-13deg)

  }

  20% {

    transform: rotate(0)

  }

  25% {

    transform: rotate(-13deg)

  }

  100% {

    transform: roate(0)

  }

}



@-webkit-keyframes telshow {

  0% {

    -webkit-transform: rotate(0)

  }

  5% {

    -webkit-transform: rotate(-13deg)

  }

  10% {

    -webkit-transform: rotate(0)

  }

  15% {

    -webkit-transform: rotate(-13deg)

  }

  20% {

    -webkit-transform: rotate(0)

  }

  25% {

    -webkit-transform: rotate(-13deg)

  }

  100% {

    -webkit-transform: roate(0)

  }

}



.social_nav2 span.weichat {

  left: 85px;

  top: 4px;

  background-position: 0 -100px;

  background-repeat: no-repeat

}



.social_nav2 span.ditu {

  left: 154px;

  top: 4px;

  background-position: 0 2px;

  background-repeat: no-repeat;

  height: 26px

}



.social_nav2 span.weibo {

  left: 218px;

  top: 7px;

  background-position: 1px -150px;

  background-repeat: no-repeat;

  height: 26px

}



@keyframes xshow2 {

  0% {

    opacity: 0

  }

  20% {

    opacity: 1

  }

  40% {

    opacity: 0

  }

  60% {

    opacity: 1

  }

  80% {

    opacity: 0

  }

  100% {

    opacity: 0

  }

}



@-o-keyframes xshow2 {

  0% {

    opacity: 0

  }

  25% {

    opacity: 1

  }

  50% {

    opacity: 0

  }

  75% {

    opacity: 1

  }

  100% {

    opacity: 0

  }

}



@-webkit-keyframes xshow2 {

  0% {

    opacity: 0

  }

  25% {

    opacity: 1

  }

  50% {

    opacity: 0

  }

  75% {

    opacity: 1

  }

  100% {

    opacity: 0

  }

}



.social_nav2 span.talk99 {

  background-position: 1px -200px;

  background-repeat: no-repeat;

  left: 226px;

  height: 24px;

  width: 26px;

  top: 8px

}



.social_nav2 .btn {

  display: block;

  width: 20px;

  height: 55px;

  position: absolute;

  right: 0;

  background-position: 0 -249px

}



.social_nav2 .btn2 {

  display: block;

  width: 20px;

  height: 55px;

  position: absolute;

  right: 0;

  background-position: 0 -786px;

  display: none

}



.brand_advance .yscontent h2,

.header .tel_bt,

.hotline .telbg,

.navbg,

.probox .content ul li,

.probox .content ul li ul li,

.social2 span,

.social_nav2 .btn,

.social_nav2 .btn2,

.sytitbg .icon,

.title .icon {

  background-image: url(../images/skins/SkinsBar2.png);

  background-size: 32px 889px

}



.social_nav3 {

  height: 55px;

  width: 320px;

  position: fixed;

  bottom: 0;

  left: 0;

  z-index: 999;

  overflow: hidden;

  font-size: 12px

}



.social_nav3 .social3 {

  display: block;

  width: 288px;

  height: 55px;

  margin-right: 18px;

  overflow: hidden;

  position: relative

}



.social_nav3 a {

  height: 55px;

  line-height: 85px;

  font-size: 13px;

  width: 65px;

  display: inline-block;

  font-size: 12px;

  position: relative;

  z-index: 11;

  text-align: center;

  color: #fff

}



.social_nav3 a.tel {

  width: 65px;

  text-indent: 15px

}



.social_nav3 span {

  display: block;

  width: 35px;

  height: 25px;

  position: absolute;

  top: 0;

  z-index: 10

}



.social3 {

  background-color: #2869cc;

  background-image: -webkit-gradient(linear, left top, left bottom, from(#2869cc), to(#0344a7));

  background-image: -webkit-linear-gradient(top, #2869cc, #0344a7);

  background-image: -moz-linear-gradient(top, #2869cc, #0344a7);

  background-image: -o-linear-gradient(top, #2869cc, #0344a7);

  background-image: -ms-linear-gradient(top, #2869cc, #0344a7);

  background-image: linear-gradient(top, #2869cc, #0344a7)

}



.social3:before {

  content: '';

  height: 1px;

  width: 100%;

  background: #2869cc;

  border-bottom: 1px solid #2869cc;

  position: absolute;

  top: 0;

  left: 0

}



.social3:after {

  content: '';

  height: 1px;

  width: 100%;

  background: #2869cc;

  border-top: 1px solid #2869cc;

  position: absolute;

  bottom: 0;

  left: 0

}



.social3 b {

  width: 1px;

  height: 100%;

  background: #2869cc;

  border-left: 1px solid #2869cc;

  position: absolute;

  top: 0;

  right: 0

}



.social_nav3 span.tel {

  left: 30px;

  top: 5px;

  height: 30px;

  background-position: 3px -49px;

  animation-name: telshow;

  animation-duration: 1s;

  animation-timing-function: linear;

  animation-iteration-count: infinite;

  -webkit-animation-name: telshow;

  -webkit-animation-duration: 1s;

  -webkit-animation-timing-function: linear;

  -webkit-animation-iteration-count: infinite;

  -o-animation-name: telshow;

  -o-animation-duration: 1s;

  -o-animation-timing-function: linear;

  -o-animation-iteration-count: infinite

}



@keyframes telshow {

  0% {

    transform: rotate(0)

  }

  5% {

    transform: rotate(-13deg)

  }

  10% {

    transform: rotate(0)

  }

  15% {

    transform: rotate(-13deg)

  }

  20% {

    transform: rotate(0)

  }

  25% {

    transform: rotate(-13deg)

  }

  100% {

    transform: roate(0)

  }

}



@-webkit-keyframes telshow {

  0% {

    -webkit-transform: rotate(0)

  }

  5% {

    -webkit-transform: rotate(-13deg)

  }

  10% {

    -webkit-transform: rotate(0)

  }

  15% {

    -webkit-transform: rotate(-13deg)

  }

  20% {

    -webkit-transform: rotate(0)

  }

  25% {

    -webkit-transform: rotate(-13deg)

  }

  100% {

    -webkit-transform: roate(0)

  }

}



.social_nav3 span.weichat {

  background-position: 6px -150px;

  background-repeat: no-repeat;

  left: 86px;

  top: 7px

}



@keyframes xshow {

  0% {

    opacity: 0

  }

  25% {

    opacity: 1

  }

  50% {

    opacity: 0

  }

  75% {

    opacity: 1

  }

  100% {

    opacity: 0

  }

}



@-o-keyframes xshow {

  0% {

    opacity: 0

  }

  25% {

    opacity: 1

  }

  50% {

    opacity: 0

  }

  75% {

    opacity: 1

  }

  100% {

    opacity: 0

  }

}



@-webkit-keyframes xshow {

  0% {

    opacity: 0

  }

  25% {

    opacity: 1

  }

  50% {

    opacity: 0

  }

  75% {

    opacity: 1

  }

  100% {

    opacity: 0

  }

}



.social_nav3 span.weibo {

  background-position: 1px -430px;

  background-repeat: no-repeat;

  height: 26px;

  left: 157px;

  top: 7px

}



@keyframes xshow2 {

  0% {

    opacity: 0

  }

  20% {

    opacity: 1

  }

  40% {

    opacity: 0

  }

  60% {

    opacity: 1

  }

  80% {

    opacity: 0

  }

  100% {

    opacity: 0

  }

}



@-o-keyframes xshow2 {

  0% {

    opacity: 0

  }

  25% {

    opacity: 1

  }

  50% {

    opacity: 0

  }

  75% {

    opacity: 1

  }

  100% {

    opacity: 0

  }

}



@-webkit-keyframes xshow2 {

  0% {

    opacity: 0

  }

  25% {

    opacity: 1

  }

  50% {

    opacity: 0

  }

  75% {

    opacity: 1

  }

  100% {

    opacity: 0

  }

}



.social_nav3 span.talk99 {

  background-position: 1px -200px;

  background-repeat: no-repeat;

  left: 226px;

  height: 24px;

  width: 26px;

  top: 8px

}



.social_nav3 .btn {

  display: block;

  width: 32px;

  height: 55px;

  position: absolute;

  right: 0;

  background-position: 0 -786px

}



.social_nav3 .btn2 {

  display: block;

  width: 32px;

  height: 55px;

  position: absolute;

  right: 0;

  background-position: 0 -249px;

  display: none

}



.brand_advance .yscontent .telbg,

.brand_advance .yscontent h2,

.header .tel_bt,

.navbg,

.probox .content ul li,

.probox .content ul li ul li,

.social3 span,

.social_nav3 .btn,

.social_nav3 .btn2,

.sytitbg .icon,

.title .icon {

  background-image: url(../images/skins/SkinsBar3.png);

  background-size: 32px 889px

}



.m-tit {

  position: relative;

  text-indent: 10px;

  height: 38px;

  font-size: 15px;

  line-height: 38px

}



.m-tit .u-ico {

  position: absolute;

  right: 10px;

  top: 2px;

  width: 30px;

  height: 38px

}



.m-tit .u-ico:before {

  content: "";

  position: absolute;

  width: 12px;

  height: 12px;

  right: 5px;

  top: 12px;

  z-index: 10;

  -moz-transform: rotate(45deg);

  -o-transform: rotate(45deg);

  -webkit-transform: rotate(45deg);

  transform: rotate(45deg)

}



.m-tit .u-ico:after {

  content: "";

  position: absolute;

  width: 12px;

  height: 12px;

  right: 8px;

  top: 12px;

  z-index: 10;

  -moz-transform: rotate(45deg);

  -o-transform: rotate(45deg);

  -webkit-transform: rotate(45deg);

  transform: rotate(45deg)

}



.u-empty {

  height: 18px

}



.g-page {

  margin-bottom: 20px

}



.g-page .u-pne,

.g-page .u-pup,

.g-page .u-sa {

  border-radius: 5px;

  display: inline-block;

  font-size: 1em;

  height: 30px;

  line-height: 30px;

  text-align: center;

  width: 25%

}



.g-page p {

  width: 10%;

  display: inline-block

}



.g-page .pager-select {

  display: inline-block;

  padding: 0 20px;

  margin: 0 10px;

  width: 10%;

  height: 30px;

  line-height: 30px;

  position: relative;

  top: 10px

}



.g-page .page_number {

  position: absolute;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  pointer-events: none;

  border-radius: 5px;

  box-shadow: 0 0 5px #333 inset;

  text-indent: -1em

}



.g-page .page_number:before {

  width: 0;

  height: 0;

  content: "";

  position: absolute;

  border-top: 5px solid #aaa;

  border-left: 5px solid transparent;

  border-right: 5px solid transparent;

  left: 50%;

  margin-left: 15px;

  top: 12px

}



.g-page .pager-select .page_number span {

  padding: 0 2px;

  font-weight: 700

}



.g-page .select_box {

  width: 100%;

  height: 100%;

  opacity: 0;

  position: absolute;

  z-index: 0;

  left: 0;

  top: 0;

  text-align: center

}



.m-share {

  margin-bottom: 23px;

  font-size: 13px

}



.m-share span {

  vertical-align: middle;

  line-height: 25px;

  float: left;

  margin: 0 10px 0 30px

}



.m-share .m-ico {

  position: relative;

  width: 320px;

  margin: 0 auto

}



.m-share a {

  margin-right: 10px

}



.g-sbox .spe2 p a:first-child {

  border-top: 0

}



.g-sbox .m-con .u-lifo {

  display: block;

  padding: 13px 35px 0 10px;

  height: 113px;

  overflow: hidden;

  position: relative

}



.g-sbox .m-con .u-lifo img {

  float: left;

  display: inline;

  margin-right: 11px

}



.g-sbox .m-con .u-lifo h3 {

  padding-right: 10px;

  line-height: 24px;

  height: 24px;

  overflow: hidden;

  white-space: nowrap

}



.g-sbox .m-con .u-lifo p {

  margin: 5px;

  font-size: 12px;

  line-height: 22px;

  height: 65px;

  overflow: hidden

}



.g-bd .m-con-2 dl span,

.g-sbox .m-con .u-lifo span {

  display: block;

  width: 9px;

  height: 16px;

  position: absolute;

  top: 57px;

  right: 3%

}



.g-bd .m-con-2 dl span:before,

.g-bd .m-con.z-spe dl span:before,

.g-sbox .m-con .u-lifo span:before {

  content: "";

  position: absolute;

  background: #aaa;

  width: 11px;

  height: 11px;

  right: 0;

  top: 0;

  z-indx: 10;

  -moz-transform: rotate(45deg);

  -o-transform: rotate(45deg);

  -webkit-transform: rotate(45deg);

  transform: rotate(45deg)

}



.g-bd .m-con-2 dl span:after,

.g-bd .m-con.z-spe dl span:after,

.g-sbox .m-con .u-lifo span:after {

  content: "";

  position: absolute;

  background: #fff;

  width: 11px;

  height: 11px;

  right: 4px;

  top: 0;

  z-indx: 11;

  -moz-transform: rotate(45deg);

  -o-transform: rotate(45deg);

  -webkit-transform: rotate(45deg);

  transform: rotate(45deg)

}



.g-bd .m-con-2 .s-babg:nth-child(2n) span:after,

.g-bd .m-con.z-spe .s-babg:nth-child(2n) span:after,

.g-sbox .m-con .s-babg:nth-child(2n) span:after {

  background: #fafafa

}



.g-sbox .m-con.z-spe {

  padding: 5px;

  width: 310px;

  line-height: 22px

}



.g-sbox .m-con.z-spe a {

  font-size: 14px;

  height: 33px;

  display: block;

  line-height: 33px;

  text-indent: 8px;

  width: 100%;

  overflow: hidden

}



.m-btit {

  line-height: 35px;

  padding-left: 12px;

  overflow: hidden;

  white-space: nowrap;

  text-overflow: ellipsis;

  border-top: 1px solid #d9d9d9;

  box-shadow: 0 1px #fff;

  position: relative;

  background-color: #f6f6f6;

  background-image: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#eaeaea));

  background-image: -webkit-linear-gradient(top, #f6f6f6, #eaeaea);

  background-image: -moz-linear-gradient(top, #f6f6f6, #eaeaea);

  background-image: -o-linear-gradient(top, #f6f6f6, #eaeaea);

  background-image: -ms-linear-gradient(top, #f6f6f6, #eaeaea);

  background-image: linear-gradient(top, #f6f6f6, #eaeaea);

  border-bottom: 1px solid #d9d9d9

}



.m-btit:before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  width: 100%;

  border-top: 1px solid #fff

}



.m-btit span {

  padding: 0 8px;

  position: relative;

  height: 100%;

  top: -12px;

  display: inline-block

}



.m-btit span:before {

  content: "";

  position: absolute;

  background: #7c7c7c;

  width: 8px;

  height: 8px;

  left: 2px;

  top: 3px;

  z-index: 10;

  -moz-transform: rotate(45deg);

  -o-transform: rotate(45deg);

  -webkit-transform: rotate(45deg);

  transform: rotate(45deg)

}



.m-btit span:after {

  content: "";

  position: absolute;

  width: 8px;

  height: 8px;

  left: 1px;

  top: 3px;

  z-index: 11;

  background-color: #f2f2f2;

  background-image: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#eee));

  background-image: -webkit-linear-gradient(top, #f2f2f2, #eee);

  background-image: -moz-linear-gradient(top, #f2f2f2, #eee);

  background-image: -o-linear-gradient(top, #f2f2f2, #eee);

  background-image: -ms-linear-gradient(top, #f2f2f2, #eee);

  background-image: linear-gradient(top, #f2f2f2, #eee);

  -moz-transform: rotate(45deg);

  -o-transform: rotate(45deg);

  -webkit-transform: rotate(45deg);

  transform: rotate(45deg)

}



.max_bg div {

  opacity: .8;

  border-radius: 5px;

  opacity: 1;

  width: 290px;

  border-width: 5px;

  height: 46px;

  font-size: 13px;

  padding: 28px 0;

  margin: 40px auto;

  line-height: 25px

}



.max_bg div a {

  text-decoration: underline;

  margin-right: 12px;

  line-height: 30px

}



.max_bg {

  width: 100%;

  position: absolute;

  left: 0;

  top: 0;

  z-index: 100

}



.max_bg div {

  opacity: .8;

  display: none;

  border-radius: 5px;

  opacity: 1;

  width: 290px;

  border-width: 5px;

  position: fixed;

  top: 50%;

  left: 50%;

  margin: -56px 0 0 -150px;

  height: 46px;

  font-size: 13px;

  padding: 28px 0;

  z-index: 101

}



.max_bg div a {

  text-decoration: underline;

  margin-right: 12px;

  line-height: 30px

}



.max_bg .right {

  line-height: 25px;

  background-position: 17px -1351px;

  text-align: center

}



.max_bg .wrong {

  background-position: 17px -1426px

}



.max_bg .contapic_bg {

  width: 100%;

  height: 100%;

  margin: 0 auto;

  background: #000;

  left: 0;

  top: 0;

  opacity: .7;

  filter: alpha(opacity=70);

  z-index: 1

}



.g-prn .m-con {

  line-height: 40px;

  margin: 5px 12px 10px 12px;

  font-size: 14px

}



.g-prn .m-con p:first-child {

  border-top: 0

}



.g-prn .m-con p:last-child {

  border-bottom: 0

}



.g-prn .m-con p {

  height: 32px;

  line-height: 32px;

  overflow: hidden

}



.g-prn .m-con a {

  padding: 0 8px;

  font-size: 14px;

  white-space: nowrap

}



.erro {

  padding-bottom: 40px

}



.erro .icon_404 {

  padding: 20px 0 10px 0

}



.erro p.en {

  font-size: 24px;

  margin: 10px 0 15px 0;

  text-align: center;

  line-height: 35px

}



.erro p.cn {

  font-size: 13px;

  width: 300px;

  padding-left: 20px;

  line-height: 26px;

  margin: 10px auto

}



.erro p a {

  font-size: 13px

}



@keyframes xshow {

  0% {

    opacity: 0

  }

  25% {

    opacity: 1

  }

  50% {

    opacity: 0

  }

  75% {

    opacity: 1

  }

  100% {

    opacity: 0

  }

}



@-webkit-keyframes xshow {

  0% {

    opacity: 0

  }

  25% {

    opacity: 1

  }

  50% {

    opacity: 0

  }

  75% {

    opacity: 1

  }

  100% {

    opacity: 0

  }

}



@keyframes xshow2 {

  0% {

    opacity: 0

  }

  20% {

    opacity: 1

  }

  40% {

    opacity: 0

  }

  60% {

    opacity: 1

  }

  80% {

    opacity: 0

  }

  100% {

    opacity: 0

  }

}



@-webkit-keyframes xshow2 {

  0% {

    opacity: 0

  }

  25% {

    opacity: 1

  }

  50% {

    opacity: 0

  }

  75% {

    opacity: 1

  }

  100% {

    opacity: 0

  }

}



@-webkit-keyframes buttonHover {

  0% {

    box-shadow: 0 0 5px grey

  }

  50% {

    box-shadow: 0 0 12px grey

  }

  100% {

    box-shadow: 0 0 5px grey

  }

}



@keyframes buttonHover {

  0% {

    box-shadow: 0 0 5px grey

  }

  50% {

    box-shadow: 0 0 12px grey

  }

  100% {

    box-shadow: 0 0 5px grey

  }

}



.nightMode {

  position: fixed;

  top: 0;

  left: 0;

  z-index: 9999;

  width: 100%;

  height: 150%;

  background: #000;

  opacity: 0;

  display: none;

  pointer-events: none

}



.u-mbg {

  height: 100%;

  width: 100%;

  background: #000;

  -moz-opacity: .6;

  -webkit-opacity: .6;

  opacity: .6;

  position: fixed;

  left: 0;

  top: 0;

  z-index: 555;

  display: none

}



.u-dwnav {

  position: fixed;

  bottom: 30px;

  left: 30px;

  z-index: 666;

  padding: 15px

}



.u-dwnav .ico {

  width: 40px;

  height: 40px;

  background: #652C7F;

  border-radius: 25px;

  border: 4px solid #fff;

  -moz-box-shadow: 0 0 0 2px #ececec;

  -webkit-box-shadow: 0 0 0 2px #ececec;

  box-shadow: 0 0 0 2px #ececec

}



.u-dwnav .ico.z-gray {

  background: grey

}



.u-dwnav .ico p {

  padding: 10px;

  width: 30px

}



.u-dwnav .ico i {

  width: 5px;

  height: 5px;

  background: #fff;

  border-bottom: 1px solid #13322f;

  display: block;

  float: left;

  margin-right: 3px;

  margin-bottom: 2px

}



.u-popup {

  width: 155px;

  height: 155px;

  border-radius: 85px;

  position: fixed;

  bottom: 100px;

  left: 80px;

  background: #eaeaea;

  border: 6px solid #f2f2f2;

  box-shadow: inset 0 3px 3px #babcbb;

  z-index: 666;

  display: none

}



.u-popup .midline {

  background: url(../Images/Index/midline.png) no-repeat left center;

  width: 150px;

  height: 155px;

  background-size: 100%;

  padding-left: 5px

}



.u-popup .midline a {

  display: inline-block;

  text-align: center;

  width: 75px;

  float: left;

  height: 40px;

  padding-top: 25px;

  font-size: 10px

}



.g-se {

  padding: 15px 10px;

  position: relative

}



.g-se .m-ipt {

  margin-right: 43px

}



.g-se .u-glass {

  position: absolute;

  right: 10px;

  top: 15px;

  width: 42px;

  height: 30px;

  background: 0 0;

  z-index: 888

}



.g-se .u-bt {

  width: 42px;

  height: 30px;

  float: right;

  border-radius: 0 4px 4px 0;

  -webkit-border-radius: 0 4px 4px 0;

  position: relative

}



.g-se .u-bt:before {

  content: '';

  display: block;

  width: 12px;

  height: 12px;

  border-radius: 17px;

  position: absolute;

  right: 14px;

  top: 5px;

  z-index: 99

}



.g-se .u-bt:after {

  content: '';

  display: block;

  width: 4px;

  height: 10px;

  border-radius: 5px;

  border: 0;

  position: absolute;

  right: 12px;

  top: 16px;

  z-index: 99;

  -webkit-transform: rotate(-52deg);

  -o-transform: rotate(-52deg);

  -ms-transform: rotate(-52deg);

  transform: rotate(-52deg)

}



.g-se .u-in {

  float: right;

  position: absolute;

  z-index: 100;

  right: 10px;

  top: 15px;

  width: 42px;

  height: 30px

}



.g-se .u-key {

  width: 100%;

  height: 14px;

  padding: 7px 0;

  line-height: 14px;

  border-right: 0;

  border-bottom-left-radius: 5px;

  border-top-left-radius: 5px;

  border-bottom-right-radius: 0;

  border-top-right-radius: 0;

  -webkit-border-top-left-radius: 5px;

  -webkit-border-bottom-left-radius: 5px;

  -webkit-border-top-right-radius: 0;

  -webkit-border-bottom-right-radius: 0;

  text-indent: 15px;

  float: left

}



.g-hd {

  background: url(../Images/Common/top_bg.gif) repeat;

  overflow: hidden

}



.g-hd .m-logo {

  float: left;

  width: 21.09375%;

  padding: 2.08em 0 1.25em 8.75%

}

.g-hd .m-logo img {width:100%;}

.g-hd h2 {

  float: right;

  padding: 2.0em 30px 0 0;

  color: #838484;

  font-weight: 700

}



.g-hd h2 b {

  display: block;

  font-size: 90%

}



.g-hd h2 a {

  display: block;

  margin-top: 10px;

  padding-left:48px;

  border: 1px solid #339adc;

  font-weight: 400;

  line-height: 1.58em;

  color: #339adc

}



.g-hd h3 {

  clear: both;

  height: .417em;

  background: url(../Images/Common/top_sd.png) no-repeat center bottom;

  background-size: cover

}



.f_menu {

  position: fixed;

  z-index: 10;

  bottom: 0;

  width: 100%;

  max-width: 640px;

  background: #00913a;

}



.f_menu li {

  position: relative;

  float: left;

  width: 25%

}



.f_menu li:before {

  position: absolute;

  content: '';

  width: 1px;

  height: 1.8em;

  top: .6em;

  right: 0;

  background: #fff;

}



.f_menu li:nth-of-type(1) {

  width: 25%

}



.f_menu li a {

  display: block;

  height: 2.9em;

  line-height: 2.9em;

  text-align: center;

  color: #fff

}



.f_menu li ul {

  position: absolute;

  z-index: 100;

  width: 100%;

  left: 0;

  bottom: 2.9em;

  background: #f6f6f6;

  border: 1px solid #e3e3e3;

  border-bottom: none;

  border-radius: 3px;

  display: none

}



.f_menu li:nth-of-type(2) ul li {

  float: none;

  width: 100%

}



.f_menu li:nth-of-type(2) ul li:before {

  background: #f6f6f6;

  height: .1em

}



.f_menu li:nth-of-type(2) ul li a {

  display: block;

  width: 100%;

  height: 2.3em;

  padding: 0;

  border-bottom: 1px solid #e7e7e7;

  text-align: center;

  line-height: 2.3em;

  color: #000;

  background: 0 0

}



.f_menu li ul li:last-of-type a {

  border-bottom: none

}



.page p a img {

  width: 100%;

  height: 8em;

}



.j-slide-not {

  height: auto

}



#content img {

  width: 60%;

  height: auto;

}



@media screen and (min-width:320px) {

  body { font-size:75%;}

}

@media screen and (min-width:360px) {

  body { font-size:87%;}

}



@media screen and (min-width:400px) {

  body { font-size:100%;}

}

@media screen and (min-width:480px) {

  body { font-size:112%;}



}

@media screen and (min-width:568px) {

  body { font-size:131%;}



}

@media screen and (min-width:639px) {

  body { font-size:150%;}

}