.inner{ width: 1000px; margin: 0 auto; overflow: hidden }
.block_to_none{ display: block !important }
.none_to_block{ display: none !important }
.block_to_inline{ display: block !important }
.bg_ebebeb{ background: #ebebeb }
h1{ font-size: 40px; line-height: 60px; text-align: center; margin-bottom: 70px }
h1 span{ display: block; font-size: 18px; line-height: 27px }
h2{ font-size: 20px; line-height: 30px; margin-bottom: 10px }
.more a{ display: block; margin: 0 auto; font-size: 24px; color: #fff; font-weight: bold; width: 180px; height: 49px; line-height: 49px; text-align: center; box-sizing: border-box; border: solid 1px #f78bc5; border-radius: 5px; background: #f78bc5 }
.more a:hover{ color: #f78bc5; border: solid 1px #f78bc5; background: rgba(0,0,0,0) }
.up{ float: right }
.up a{ display: block; width: 50px; height: 50px; box-sizing: border-box; border: solid 1px #f78bc5; border-radius: 5px; background: url(../img/up.png) no-repeat #f78bc5; background-size: 21px; background-position: center }
.up a:hover{ border: solid 1px #f78bc5; background: url(../img/up_hover.png) no-repeat #fff; background-size: 21px; background-position: center }
header .block_to_none ul li a:hover, footer li a:hover, #hamburger li a:hover{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )" }
section{ padding: 70px 0 }
#main{ padding: 0 }

/*header*/
header{ overflow: hidden; height: 150px }
header h1{ float: left; margin: 0; padding-top: 40px }
header h1 a{ display: block; width: 275px }
header .block_to_none{ float: right }
header .block_to_none ul{ overflow: hidden; padding-top: 60px }
header .block_to_none ul li{ float: left; height: 30px; line-height: 30px; border-left: solid 1px #ccc; margin-left: 20px; padding-left: 20px }
header .block_to_none ul li:first-child{ border-left: none; margin-left: 0; padding-left: 0 }
.header_inner{ width: 840px; padding: 0 20px }

/*footer*/
footer{ background: #333; padding: 40px 0 }
footer .wrapper{ overflow: hidden; margin-bottom: 100px }
footer h1{ float: right; width: 55px; margin-bottom: 0 }
footer ul{ float: left; overflow: hidden; padding-top: 12px }
footer ul li{ float: left; height: 30px; line-height: 30px; border-left: solid 1px #ccc; margin-left: 20px; padding-left: 20px }
footer li:first-child{ border-left: none; margin-left: 0; padding-left: 0 }
footer li a{ color: #fff }
footer small{ font-size: 11px; color: #fff }

@media(max-width: 1020px){
.inner , .header_inner{ width: 100%; box-sizing: border-box; padding: 0 10px }
}

@media(max-width: 959px){
header .block_to_none ul li{ font-size: 14px; margin-left: 15px; padding-left: 15px }
}

@media(max-width: 768px){
.block_to_none{ display: none !important }
.none_to_block{ display: block !important }
.block_to_inline{ display: inline !important }
h1{ font-size: 26px; line-height: 39px; margin-bottom: 30px }
h1 span{ font-size: 16px; line-height: 24px }
h2{ font-size: 18px; line-height: 27px; margin-bottom: 5px }
.more a{ font-size: 18px; width: 150px; height: 40px; line-height: 40px }
.up a{ width: 40px; height: 40px; background: url(../img/up.png) no-repeat #f78bc5; background-size: 15px; background-position: center }
.up a:hover{ background: url(../img/up_hover.png) no-repeat #fff; background-size: 15px; background-position: center }
section{ padding: 40px 0 }

/*header*/
header{ height: 100px }
header h1{ padding-top: 25px }
header h1 a{ width: 180px }

/*footer*/
footer{ padding: 20px 10px }
footer .wrapper{ margin-bottom: 50px }
footer h1{ float: none; width: 50px; margin: 0 auto }
footer ul{ float: none; text-align: center; width: 70%; margin: 0 auto; padding-top: 20px }
footer ul li{ float: none; height: auto; line-height: auto; border-left: none; margin-left: 0; padding-left: 0; border-bottom: solid 1px #ccc; padding: 20px 0 }
footer li:first-child{ border-left: none }
footer li:last-child{ border-bottom: none }
footer small{ display: block; text-align: center }

.menu-trigger , .menu-trigger span{ display: inline-block; transition: all .4s; box-sizing: border-box; z-index: 101; cursor: pointer }
.menu-trigger{ position: absolute; width: 30px; height: 25px; top: 0; right: 10px; margin-top: 37px }
.menu-trigger span{ position: absolute; width: 100%; height: 2px; background-color: #f78bc5; border-radius: 4px }
.menu-trigger span:nth-of-type(1){ top: 0 }
.menu-trigger span:nth-of-type(2){ top: 11px }
.menu-trigger span:nth-of-type(3){ bottom: 0 }
.menu-trigger.active{ -webkit-transform: rotate(360deg); transform: rotate(360deg) }
.menu-trigger.active span{ background-color: #f78bc5; cursor: pointer }
.menu-trigger.active span:nth-of-type(1){ -webkit-transform: translateY(11px) rotate(-45deg); transform: translateY(11px) rotate(-45deg) }
.menu-trigger.active span:nth-of-type(2){ -webkit-transform: translateY(0) rotate(45deg); transform: translateY(0) rotate(45deg) }
.menu-trigger.active span:nth-of-type(3){ opacity: 0 }
.or_active #overlay{ width: 100%; height:100%; position: fixed; top: 0; z-index: 1; background: rgba(255,255,255,0.9) }
#hamburger{ display: none; width: 100%; margin-top: 0; position: absolute; left: 0; z-index: 100 }
#hamburger ul{ text-align: center; margin-top: 50px }
#hamburger li{ width: 100% }
#hamburger li a{ display: block; width: 50%; color: #333; font-size: 16px; margin: 0 auto; border-bottom: solid 1px #333; padding: 20px }
#hamburger li:first-child{ width: 150px; margin: 0 auto}
#hamburger li:first-child a{ width: 100%; border-bottom: none; padding: 0 0 30px 0 }
#hamburger li:last-child a{ border-bottom: none }
}