@import url(http://fonts.googleapis.com/css?family=Cuprum:400,400italic,700,700italic&subset=latin,latin-ext,cyrillic);
@import url(http://fonts.googleapis.com/css?family=Roboto:300,400,700&subset=latin,cyrillic-ext,greek-ext,greek,latin-ext,cyrillic);
@import url(http://fonts.googleapis.com/css?family=Oswald:300,400,700&subset=latin,latin-ext);
#z170-warp #z170-board .board,
#z170-warp #z170-5xp .lang,
#z170-warp #z170-5xp .lang .estxt,
#z170-warp #z170-5xp .overl .ovmain,
#z170-warp #z170-5xp .esd,
#z170-warp #z170-ultrafast .main_div,
#z170-warp #z170-usb .mainsize,
#z170-warp #z170-bios .content,
#z170-warp #z170-bios .steps,
#z170-warp #z170-bios .modes,
#z170-warp #z170-game .audio,
#z170-warp #z170-diy .diys,
#z170-warp #z170-fan .mainsize,
#z170-warp #z170-control .con_detail {
    max-width: 1000px;
    width: 100%;
    position: relative;
    margin: 0 auto;
    padding: 0px 20px
}
#z170-warp #z170-5xp .main_title,
#z170-warp #z170-ddr4 .main_title,
#z170-warp #z170-ultrafast .main_div .speed .stitle,
#z170-warp #z170-game .main_title,
#z170-warp #z170-diy .main_title,
#z170-warp #z170-fan .main_title,
#z170-warp #z170-control .main_title {
    text-align: center;
    color: #fff;
    font-size: 44px;
    font-family: "Oswald";
    background: #ffc619;
    line-height: 88px;
    font-weight: 500
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .main_title,
    #z170-warp #z170-ddr4 .main_title,
    #z170-warp #z170-ultrafast .main_div .speed .stitle,
    #z170-warp #z170-game .main_title,
    #z170-warp #z170-diy .main_title,
    #z170-warp #z170-fan .main_title,
    #z170-warp #z170-control .main_title {
        font-size: 36px
    }
}
#z170-warp #z170-5xp .lang .estitle,
#z170-warp #z170-5xp .overl .ovmain .ovleft .otitle,
#z170-warp #z170-5xp .esd .estitle,
#z170-warp #z170-ddr4 .dtxt .d4title,
#z170-warp #z170-ultrafast .main_div .speed .item2 .sp_title,
#z170-warp #z170-ultrafast .main_div .speed .item1 .usbtitle,
#z170-warp #z170-usb .mainsize .usbtitle,
#z170-warp #z170-bios .content .main_title,
#z170-warp #z170-game .audio .atitle h3,
#z170-warp #z170-diy .diys .detail .dtile,
#z170-warp #z170-diy .diys .computer .detail .dtile,
#z170-warp #z170-fan .mainsize .fanleft .fantitle,
#z170-warp #z170-control .con_detail .contitle {
    font-family: "Oswald";
    font-size: 44px;
    line-height: 1.2;
    font-weight: 500
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .lang .estitle,
    #z170-warp #z170-5xp .overl .ovmain .ovleft .otitle,
    #z170-warp #z170-5xp .esd .estitle,
    #z170-warp #z170-ddr4 .dtxt .d4title,
    #z170-warp #z170-ultrafast .main_div .speed .item2 .sp_title,
    #z170-warp #z170-ultrafast .main_div .speed .item1 .usbtitle,
    #z170-warp #z170-usb .mainsize .usbtitle,
    #z170-warp #z170-bios .content .main_title,
    #z170-warp #z170-game .audio .atitle h3,
    #z170-warp #z170-diy .diys .detail .dtile,
    #z170-warp #z170-diy .diys .computer .detail .dtile,
    #z170-warp #z170-fan .mainsize .fanleft .fantitle,
    #z170-warp #z170-control .con_detail .contitle {
        font-size: 36px
    }
}
#z170-warp #z170-5xp .mainimg .subtitle,
#z170-warp #z170-5xp .lang .estxt h5,
#z170-warp #z170-5xp .overl .ovmain .ovleft .osubtitle,
#z170-warp #z170-5xp .icons .icon .total .subtitl,
#z170-warp #z170-game .audio .atitle .subtitle,
#z170-warp #z170-diy .diys .detail .stitle,
#z170-warp #z170-diy .diys .computer .detail .stitle,
#z170-warp #z170-fan .mainsize .fanleft .fsubtitle {
    font-size: 24px;
    color: #aaa;
    font-weight: 500;
    line-height: 1.1;
    margin-top: 20px
}
#z170-warp #z170-5xp .mainimg>p,
#z170-warp #z170-5xp .lang .estxt,
#z170-warp #z170-5xp .overl .ovmain .ovleft .oinfo,
#z170-warp #z170-5xp .icons .icon .total .info,
#z170-warp #z170-5xp .esd .esinfo,
#z170-warp #z170-5xp .esd figure .line .detail,
#z170-warp #z170-ddr4 .dtxt .d4info,
#z170-warp #z170-ultrafast .main_div .speed .item1 .content .usbitem .usbtxt,
#z170-warp #z170-ultrafast .main_div .speed .item1 .usb_right .usbtxt,
#z170-warp #z170-usb .mainsize .usbinfo,
#z170-warp #z170-bios .content .main_info,
#z170-warp #z170-bios .steps .step .sin,
#z170-warp #z170-game .audio .atitle,
#z170-warp #z170-diy .diys .detail .dinf,
#z170-warp #z170-diy .diys .computer .detail .dinf,
#z170-warp #z170-fan .mainsize .fanleft .faninfo,
#z170-warp #z170-control .con_detail>p {
    color: #fff;
    font-size: 17px;
    font-weight: 300;
    line-height: 24px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .mainimg>p,
    #z170-warp #z170-5xp .lang .estxt,
    #z170-warp #z170-5xp .overl .ovmain .ovleft .oinfo,
    #z170-warp #z170-5xp .icons .icon .total .info,
    #z170-warp #z170-5xp .esd .esinfo,
    #z170-warp #z170-5xp .esd figure .line .detail,
    #z170-warp #z170-ddr4 .dtxt .d4info,
    #z170-warp #z170-ultrafast .main_div .speed .item1 .content .usbitem .usbtxt,
    #z170-warp #z170-ultrafast .main_div .speed .item1 .usb_right .usbtxt,
    #z170-warp #z170-usb .mainsize .usbinfo,
    #z170-warp #z170-bios .content .main_info,
    #z170-warp #z170-bios .steps .step .sin,
    #z170-warp #z170-game .audio .atitle,
    #z170-warp #z170-diy .diys .detail .dinf,
    #z170-warp #z170-diy .diys .computer .detail .dinf,
    #z170-warp #z170-fan .mainsize .fanleft .faninfo,
    #z170-warp #z170-control .con_detail>p {
        font-size: 21px;
        line-height: 30px
    }
}
@-moz-keyframes op_flicker {
    0% {
        -moz-transform: translateY(35%);
        transform: translateY(35%);
        opacity: 0.5
    }
    100% {
        -moz-transform: translateY(-40%);
        transform: translateY(-40%);
        opacity: 1
    }
}
@-webkit-keyframes op_flicker {
    0% {
        -webkit-transform: translateY(35%);
        transform: translateY(35%);
        opacity: 0.5
    }
    100% {
        -webkit-transform: translateY(-40%);
        transform: translateY(-40%);
        opacity: 1
    }
}
@keyframes op_flicker {
    0% {
        -moz-transform: translateY(35%);
        -ms-transform: translateY(35%);
        -webkit-transform: translateY(35%);
        transform: translateY(35%);
        opacity: 0.5
    }
    100% {
        -moz-transform: translateY(-40%);
        -ms-transform: translateY(-40%);
        -webkit-transform: translateY(-40%);
        transform: translateY(-40%);
        opacity: 1
    }
}
@-moz-keyframes op_flicker2 {
    0% {
        opacity: 0.2
    }
    100% {
        opacity: 1
    }
}
@-webkit-keyframes op_flicker2 {
    0% {
        opacity: 0.2
    }
    100% {
        opacity: 1
    }
}
@keyframes op_flicker2 {
    0% {
        opacity: 0.2
    }
    100% {
        opacity: 1
    }
}
@-moz-keyframes parllax {
    0% {
        -moz-transform: translate(-49%, -1%);
        transform: translate(-49%, -1%)
    }
    13% {
        -moz-transform: translate(-50%, 0%);
        transform: translate(-50%, 0%)
    }
    25% {
        -moz-transform: translate(-51%, 1%);
        transform: translate(-51%, 1%)
    }
    38% {
        -moz-transform: translate(-50%, 0%);
        transform: translate(-50%, 0%)
    }
    50% {
        -moz-transform: translate(-51%, -1%);
        transform: translate(-51%, -1%)
    }
    68% {
        -moz-transform: translate(-50%, 0%);
        transform: translate(-50%, 0%)
    }
    100% {
        -moz-transform: translate(-49%, 1%);
        transform: translate(-49%, 1%)
    }
}
@-webkit-keyframes parllax {
    0% {
        -webkit-transform: translate(-49%, -1%);
        transform: translate(-49%, -1%)
    }
    13% {
        -webkit-transform: translate(-50%, 0%);
        transform: translate(-50%, 0%)
    }
    25% {
        -webkit-transform: translate(-51%, 1%);
        transform: translate(-51%, 1%)
    }
    38% {
        -webkit-transform: translate(-50%, 0%);
        transform: translate(-50%, 0%)
    }
    50% {
        -webkit-transform: translate(-51%, -1%);
        transform: translate(-51%, -1%)
    }
    68% {
        -webkit-transform: translate(-50%, 0%);
        transform: translate(-50%, 0%)
    }
    100% {
        -webkit-transform: translate(-49%, 1%);
        transform: translate(-49%, 1%)
    }
}
@keyframes parllax {
    0% {
        -moz-transform: translate(-49%, -1%);
        -ms-transform: translate(-49%, -1%);
        -webkit-transform: translate(-49%, -1%);
        transform: translate(-49%, -1%)
    }
    13% {
        -moz-transform: translate(-50%, 0%);
        -ms-transform: translate(-50%, 0%);
        -webkit-transform: translate(-50%, 0%);
        transform: translate(-50%, 0%)
    }
    25% {
        -moz-transform: translate(-51%, 1%);
        -ms-transform: translate(-51%, 1%);
        -webkit-transform: translate(-51%, 1%);
        transform: translate(-51%, 1%)
    }
    38% {
        -moz-transform: translate(-50%, 0%);
        -ms-transform: translate(-50%, 0%);
        -webkit-transform: translate(-50%, 0%);
        transform: translate(-50%, 0%)
    }
    50% {
        -moz-transform: translate(-51%, -1%);
        -ms-transform: translate(-51%, -1%);
        -webkit-transform: translate(-51%, -1%);
        transform: translate(-51%, -1%)
    }
    68% {
        -moz-transform: translate(-50%, 0%);
        -ms-transform: translate(-50%, 0%);
        -webkit-transform: translate(-50%, 0%);
        transform: translate(-50%, 0%)
    }
    100% {
        -moz-transform: translate(-49%, 1%);
        -ms-transform: translate(-49%, 1%);
        -webkit-transform: translate(-49%, 1%);
        transform: translate(-49%, 1%)
    }
}
html #overview #special-sectionOverview,
html #overview #sectionOverview {
    width: 100% !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    float: none !important
}
#z170-warp html,
#z170-warp body,
#z170-warp div,
#z170-warp span,
#z170-warp applet,
#z170-warp object,
#z170-warp iframe,
#z170-warp h1,
#z170-warp h2,
#z170-warp h3,
#z170-warp h4,
#z170-warp h5,
#z170-warp h6,
#z170-warp p,
#z170-warp blockquote,
#z170-warp pre,
#z170-warp a,
#z170-warp abbr,
#z170-warp acronym,
#z170-warp address,
#z170-warp big,
#z170-warp cite,
#z170-warp code,
#z170-warp del,
#z170-warp dfn,
#z170-warp em,
#z170-warp img,
#z170-warp ins,
#z170-warp kbd,
#z170-warp q,
#z170-warp s,
#z170-warp samp,
#z170-warp small,
#z170-warp strike,
#z170-warp strong,
#z170-warp sub,
#z170-warp sup,
#z170-warp tt,
#z170-warp var,
#z170-warp b,
#z170-warp u,
#z170-warp i,
#z170-warp center,
#z170-warp dl,
#z170-warp dt,
#z170-warp dd,
#z170-warp ol,
#z170-warp ul,
#z170-warp li,
#z170-warp fieldset,
#z170-warp form,
#z170-warp label,
#z170-warp legend,
#z170-warp table,
#z170-warp caption,
#z170-warp tbody,
#z170-warp tfoot,
#z170-warp thead,
#z170-warp tr,
#z170-warp th,
#z170-warp td,
#z170-warp article,
#z170-warp aside,
#z170-warp canvas,
#z170-warp details,
#z170-warp embed,
#z170-warp figure,
#z170-warp figcaption,
#z170-warp footer,
#z170-warp header,
#z170-warp hgroup,
#z170-warp menu,
#z170-warp nav,
#z170-warp output,
#z170-warp ruby,
#z170-warp section,
#z170-warp summary,
#z170-warp time,
#z170-warp mark,
#z170-warp audio,
#z170-warp video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: baseline
}
#z170-warp ol,
#z170-warp ul {
    list-style: none
}
#z170-warp article,
#z170-warp aside,
#z170-warp details,
#z170-warp figcaption,
#z170-warp figure,
#z170-warp footer,
#z170-warp header,
#z170-warp hgroup,
#z170-warp main,
#z170-warp nav,
#z170-warp section,
#z170-warp summary {
    display: block
}
#z170-warp audio,
#z170-warp canvas,
#z170-warp video {
    display: inline-block
}
#z170-warp audio:not([controls]) {
    display: none;
    height: 0
}
#z170-warp [hidden] {
    display: none
}
#z170-warp a:focus {
    outline: thin dotted
}
#z170-warp a:active,
#z170-warp a:hover {
    outline: 0
}
#z170-warp abbr[title] {
    border-bottom: 1px dotted
}
#z170-warp b,
#z170-warp strong {
    font-weight: bold
}
#z170-warp dfn {
    font-style: italic
}
#z170-warp hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 0
}
#z170-warp mark {
    background: #ff0;
    color: #000
}
#z170-warp code,
#z170-warp kbd,
#z170-warp pre,
#z170-warp samp {
    font-family: monospace, serif;
    font-size: 1em
}
#z170-warp pre {
    white-space: pre-wrap
}
#z170-warp q {
    quotes: "“" "”" "‘" "’"
}
#z170-warp small {
    font-size: 80%
}
#z170-warp sub {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}
#z170-warp sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
    top: -0.5em
}
#z170-warp sub {
    bottom: -0.25em
}
#z170-warp img {
    max-width: 100%;
    height: auto
}
#z170-warp svg:not(:root) {
    overflow: hidden
}
#z170-warp figure {
    margin: 0
}
#z170-warp fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em
}
#z170-warp legend {
    border: 0;
    padding: 0
}
#z170-warp button,
#z170-warp input,
#z170-warp select,
#z170-warp textarea {
    font-family: inherit;
    font-size: 100%;
    margin: 0
}
#z170-warp button,
#z170-warp input {
    line-height: normal
}
#z170-warp button,
#z170-warp select {
    text-transform: none
}
#z170-warp button,
#z170-warp html input[type="button"] {
    -webkit-appearance: button;
    cursor: pointer
}
#z170-warp input[type="reset"],
#z170-warp input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer
}
#z170-warp button[disabled],
#z170-warp html input[disabled] {
    cursor: default
}
#z170-warp input[type="checkbox"],
#z170-warp input[type="radio"] {
    box-sizing: border-box;
    padding: 0
}
#z170-warp input[type="search"] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}
#z170-warp input[type="search"]::-webkit-search-cancel-button,
#z170-warp input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none
}
#z170-warp button::-moz-focus-inner,
#z170-warp input::-moz-focus-inner {
    border: 0;
    padding: 0
}
#z170-warp textarea {
    overflow: auto;
    vertical-align: top
}
#z170-warp table {
    border-collapse: collapse;
    border-spacing: 0
}
#z170-warp .clearfix {
    zoom: 1
}
#z170-warp .clearfix:before {
    content: "";
    display: table
}
#z170-warp .clearfix:after {
    content: "";
    display: table;
    clear: both
}
#z170-warp html {
    font-family: sans-serif;
    line-height: 1;
    font-size: 16px
}
#z170-warp a {
    text-decoration: none;
    color: black
}
#z170-warp {
    background: #000;
    color: #fff;
    font-family: "Roboto", 'STHeiti Light', "STXihei", "STHeiti", 'Apple LiGothic Medium', "微軟正黑體", 'Microsoft JhengHei', Helvetica, Arial, sans-serif
}
#z170-warp * {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-main {
        z-index: 999;
        width: 100%;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out
    }
}
#z170-warp #z170-main .mainnav {
    font-size: 0px
}
#z170-warp #z170-main .mainnav::after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
    width: 0
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-main .mainnav {
        display: none
    }
}
#z170-warp #z170-main .mainnav .w1 {
    width: 37.8%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-main .mainnav .w1 {
        width: 100%
    }
}
#z170-warp #z170-main .mainnav .w2 {
    width: 31.1%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-main .mainnav .w2 {
        width: 100%
    }
}
#z170-warp #z170-main .mainnav .znav {
    display: inline-block;
    position: relative;
    cursor: pointer;
    overflow: hidden;
    vertical-align: top;
    float: left
}
#z170-warp #z170-main .mainnav .znav:hover .pic {
    -moz-transform: scale(1.2, 1.2);
    -ms-transform: scale(1.2, 1.2);
    -webkit-transform: scale(1.2, 1.2);
    transform: scale(1.2, 1.2)
}
#z170-warp #z170-main .mainnav .znav:hover .nav_title {
    background-color: #555
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-main .mainnav .znav {
        border-bottom: 1px solid #fff
    }
}
#z170-warp #z170-main .mainnav .znav .pic {
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    font-size: 0
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-main .mainnav .znav .pic {
        display: none
    }
}
#z170-warp #z170-main .mainnav .znav .pic>img {
    width: 100%;
    display: block
}
#z170-warp #z170-main .mainnav .znav .nav_title {
    text-align: center;
    background: rgba(0, 0, 0, 0.8);
    line-height: 1.5;
    color: #fff;
    position: absolute;
    bottom: 0px;
    font-size: 40px;
    width: 100%;
    font-family: "Cuprum"
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-main .mainnav .znav .nav_title {
        position: relative;
        background: #777;
        text-shadow: 0 1px 0 #333
    }
}
#z170-warp #z170-main .mobile_nav {
    display: none;
    width: 100%;
    background: transition;
    height: 50px;
    z-index: 3
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-main .mobile_nav {
        display: block
    }
}
#z170-warp #z170-main .mobile_nav .m_btn {
    cursor: pointer;
    width: 50px;
    height: 50px;
    background: #555 url('../images/mininav-toggle.png?1436805593') center/100% no-repeat;
    float: right
}
#z170-warp #z170-board {
    background: url('../images/mb/board-bg.png?1437311002') 50% 0;
    position: relative;
    overflow: hidden
}
#z170-warp #z170-board .board {
    text-align: center;
    background: url("../images/mb/board-grid.png?1395982636") center/100% no-repeat
}
#z170-warp #z170-board .board .mbbg {
    width: 708px;
    margin: 0 auto;
    position: relative
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-board .board .mbbg {
        width: 100%;
        text-align: left
    }
}
#z170-warp #z170-board .board .mbbg .hb {
    display: block
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-board .board .mbbg .hb {
        display: none
    }
}
#z170-warp #z170-board .board .mbbg .mb_mobile {
    display: none
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-board .board .mbbg .mb_mobile {
        display: block
    }
}
#z170-warp #z170-board .board .line {
    position: absolute;
    z-index: 2
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-board .board .line {
        position: relative !important;
        left: initial !important;
        right: initial !important;
        top: initial !important;
        bottom: initial !important;
        display: inline-block;
        text-align: left;
        vertical-align: top;
        margin: 10px 5px !important
    }
}
#z170-warp #z170-board .board .line>img {
    vertical-align: middle
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-board .board .line>img {
        display: none
    }
}
#z170-warp #z170-board .board .line div.tx {
    padding: 0 5px;
    font-size: 15px;
    color: #fff;
    vertical-align: middle;
    color: #ffc619;
    text-align: left;
    font-weight: 300
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-board .board .line div.tx {
        position: relative !important;
        left: initial !important;
        right: initial !important;
        top: initial !important;
        bottom: initial !important;
        display: inline-block;
        vertical-align: top;
        margin: 0 !important;
        float: none !important;
        font-size: 20px;
        padding: 0 5px 0 45px
    }
}
#z170-warp #z170-board .board .line div.tx.r {
    float: right
}
#z170-warp #z170-board .board .line div.tx.l {
    float: left
}
#z170-warp #z170-board .board .line div.tx .cl {
    display: none
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-board .board .line div.tx .cl {
        left: 0px;
        top: -5px;
        display: block;
        position: absolute;
        width: 30px;
        height: 30px;
        -moz-border-radius: 100%;
        -webkit-border-radius: 100%;
        border-radius: 100%;
        background: #ffc619;
        color: #fff;
        text-align: center;
        font-size: 21px;
        font-weight: 400;
        line-height: 30px;
        vertical-align: middle;
        font-family: Arial
    }
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-board .board .line div.tx ul {
        position: relative !important;
        left: initial !important;
        right: initial !important;
        top: initial !important;
        bottom: initial !important;
        display: inline-block;
        vertical-align: top;
        float: none !important;
        width: 100%
    }
    #z170-warp #z170-board .board .line div.tx .stitle {
        margin: 0
    }
}
#z170-warp #z170-board .board .line.p1 {
    top: 159px;
    left: -61px
}
#z170-warp #z170-board .board .line.p2 {
    top: 191px;
    left: -69px
}
#z170-warp #z170-board .board .line.p3 {
    top: 277px;
    left: -37px
}
#z170-warp #z170-board .board .line.p4 {
    top: 338px;
    left: -122px
}
#z170-warp #z170-board .board .line.p5 {
    top: 400px;
    left: -84px
}
#z170-warp #z170-board .board .line.p6 {
    top: 460px;
    left: -30px
}
#z170-warp #z170-board .board .line.p7 {
    top: 519px;
    left: -42px
}
#z170-warp #z170-board .board .line.p8 {
    top: 613px;
    left: -135px
}
#z170-warp #z170-board .board .line.p9 {
    top: 684px;
    left: -171px
}
#z170-warp #z170-board .board .line.p9 .tx {
    width: 225px;
    text-align: left;
    margin-right: -82px;
    text-align: left
}
#z170-warp #z170-board .board .line.p9 .tx .stitle {
    font-weight: bold;
    margin: 0;
    font-size: 18px
}
#z170-warp #z170-board .board .line.p9 .tx ul {
    font-size: 13px;
    list-style: url('../images/dot1.png?1437061693');
    margin-left: 13px
}
#z170-warp #z170-board .board .line.p10 {
    top: 143px;
    left: 398px
}
#z170-warp #z170-board .board .line.p10 .tx {
    position: absolute;
    right: -122px;
    top: 0px
}
#z170-warp #z170-board .board .line.p11 {
    top: 243px;
    left: 491px
}
#z170-warp #z170-board .board .line.p11 .tx {
    position: absolute;
    right: -180px;
    top: 1px
}
#z170-warp #z170-board .board .line.p12 {
    top: 322px;
    left: 355px
}
#z170-warp #z170-board .board .line.p12 .tx {
    position: absolute;
    right: -168px;
    top: -10px
}
#z170-warp #z170-board .board .line.p13 {
    top: 511px;
    left: 569px
}
#z170-warp #z170-board .board .line.p13 .tx {
    position: absolute;
    right: -127px;
    top: 1px
}
#z170-warp #z170-board .board .line.p14 {
    top: 547px;
    left: 442px
}
#z170-warp #z170-board .board .line.p14 .tx {
    position: absolute;
    right: -175px;
    top: 1px
}
#z170-warp #z170-board .board .line.p15 {
    top: 663px;
    left: 516px
}
#z170-warp #z170-board .board .line.p15 .tx {
    position: absolute;
    right: -144px;
    top: 1px
}
#z170-warp #z170-board .board .line.p16 {
    top: 795px;
    left: 580px
}
#z170-warp #z170-board .board .line.p16 .tx {
    position: absolute;
    right: -135px;
    top: 1px
}
#z170-warp #z170-board .board .line.p17 {
    top: 870px;
    left: 559px
}
#z170-warp #z170-board .board .line.p17 .tx {
    position: absolute;
    right: -133px;
    top: 1px
}
#z170-warp #z170-5xp {
    position: relative;
    overflow: hidden;
    text-align: center;
    padding-bottom: 0px
}
#z170-warp #z170-5xp .mainimg {
    position: relative;
    width: 100%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .mainimg {
        width: 200%;
        margin-left: -50%
    }
}
#z170-warp #z170-5xp .mainimg .xicon {
    position: absolute;
    width: 30%;
    left: 50%;
    top: 5%;
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}
#z170-warp #z170-5xp .mainimg .xlight {
    left: 0px;
    top: 20%;
    position: absolute
}
#z170-warp #z170-5xp .mainimg .nicons {
    width: 40%;
    text-align: justify;
    margin: -15% auto 40px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .mainimg .nicons {
        width: 50%;
        margin: -50px auto 40px
    }
}
#z170-warp #z170-5xp .mainimg .nicons:after {
    content: '';
    display: inline-block;
    width: 100%
}
#z170-warp #z170-5xp .mainimg .nicons .nicon {
    max-width: 120px;
    width: 19%;
    display: inline-block;
    text-align: center;
    vertical-align: top;
    line-height: 1
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .mainimg .nicons .nicon {
        vertical-align: top
    }
}
#z170-warp #z170-5xp .mainimg .nicons .nicon span {
    line-height: 1;
    margin-top: 5px;
    display: block
}
#z170-warp #z170-5xp .mainimg .subtitle {
    margin-bottom: 20px
}
#z170-warp #z170-5xp .mainimg>p {
    text-align: center;
    width: 45%;
    margin: 0px auto 60px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .mainimg>p {
        width: 48%;
        font-size: 21px;
        margin: 0px auto 60px
    }
}
#z170-warp #z170-5xp .lang {
    text-align: center
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .lang {
        margin-bottom: 0px
    }
}
#z170-warp #z170-5xp .lang .estitle {
    color: #ffc619;
    text-align: center;
    display: inline-block;
    border-bottom: 2px solid #ffc619
}
#z170-warp #z170-5xp .lang .estxt {
    width: 85%
}
#z170-warp #z170-5xp .lang .estxt h5 {
    margin-bottom: 30px;
    width: 100%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .lang .estxt {
        font-size: 21px;
        width: 100%;
        padding: 0px
    }
    #z170-warp #z170-5xp .lang .estxt h5 {
        width: 100%
    }
}
#z170-warp #z170-5xp .lang .imgs {
    margin: 70px auto;
    position: relative;
    text-align: right
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .lang .imgs {
        position: relative;
        top: 0;
        right: 0;
        text-align: center
    }
}
#z170-warp #z170-5xp .lang .imgs .imgleft {
    display: inline-block;
    position: absolute;
    left: 0;
    padding-top: 80px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .lang .imgs .imgleft {
        position: relative;
        padding-top: 20px
    }
}
#z170-warp #z170-5xp .lang .imgs .imgleft small {
    margin-top: 30px;
    display: block
}
#z170-warp #z170-5xp .lang .imgs .imgright {
    display: inline-block;
    position: relative;
    margin-top: -80px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .lang .imgs .imgright {
        margin-top: 0;
        margin-left: -15%
    }
}
#z170-warp #z170-5xp .lang .imgs .imgright .box2 {
    position: absolute;
    -moz-transition: all 0.5s ease-in-out 0.2s;
    -o-transition: all 0.5s ease-in-out 0.2s;
    -webkit-transition: all 0.5s ease-in-out;
    -webkit-transition-delay: 0.2s;
    transition: all 0.5s ease-in-out 0.2s;
    bottom: 16.7%;
    right: 30.5%;
    width: 10.5%
}
#z170-warp #z170-5xp .lang .imgs .imgright .box1 {
    position: absolute;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    bottom: 3%;
    right: 25%;
    width: 45.3%
}
#z170-warp #z170-5xp .lang .imgs .imgright.on .box2 {
    bottom: 36%;
    right: 28%
}
#z170-warp #z170-5xp .lang .imgs .imgright.on .box1 {
    bottom: 46%;
    right: 25%
}
#z170-warp #z170-5xp .lang .imgs .imgright.on p {
    opacity: 1
}
#z170-warp #z170-5xp .lang .imgs .imgright p {
    text-align: left;
    font-family: "Oswald";
    font-size: 24px;
    color: #ffc619;
    font-weight: 500;
    position: absolute;
    opacity: 0;
    -moz-transition: all 0.5s ease-in-out 0.4s;
    -o-transition: all 0.5s ease-in-out 0.4s;
    -webkit-transition: all 0.5s ease-in-out;
    -webkit-transition-delay: 0.4s;
    transition: all 0.5s ease-in-out 0.4s
}
#z170-warp #z170-5xp .lang .imgs .imgright p.t1 {
    right: 15%;
    top: 37%
}
#z170-warp #z170-5xp .lang .imgs .imgright p.t2 {
    right: 5%;
    top: 75%;
    line-height: 1.1
}
#z170-warp #z170-5xp .overl {
    background: #575757;
    width: 100%;
    padding: 80px 0px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .overl {
        padding: 40px 0 80px
    }
}
#z170-warp #z170-5xp .overl .ovmain {
    position: relative
}
#z170-warp #z170-5xp .overl .ovmain .ovleft {
    display: inline-block;
    vertical-align: top;
    width: 45%;
    text-align: left
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .overl .ovmain .ovleft {
        width: 100%;
        padding-left: 0
    }
}
#z170-warp #z170-5xp .overl .ovmain .ovleft .otitle {
    color: #ffc619;
    text-align: center;
    display: inline-block;
    padding: 0 50px 0 0;
    text-align: left
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .overl .ovmain .ovleft .otitle {
        width: 49%
    }
}
#z170-warp #z170-5xp .overl .ovmain .ovleft .otitle span {
    display: inline-block;
    border-bottom: 2px solid #ffc619
}
#z170-warp #z170-5xp .overl .ovmain .ovleft .osubtitle {
    margin-top: 20px;
    margin-bottom: 30px
}
#z170-warp #z170-5xp .overl .ovmain .ovright {
    display: inline-block;
    vertical-align: top;
    width: 54%;
    text-align: right
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .overl .ovmain .ovright {
        text-align: center;
        margin-top: 30px;
        width: 100%
    }
}
#z170-warp #z170-5xp .icons {
    width: 100%;
    font-size: 0
}
#z170-warp #z170-5xp .icons .icon {
    text-align: center;
    display: inline-block;
    width: 33.333%;
    height: 600px;
    position: relative
}
#z170-warp #z170-5xp .icons .icon:before {
    content: "";
    display: inline-block;
    height: 100%;
    vertical-align: middle
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .icons .icon {
        width: 100%;
        height: auto;
        padding: 100px 0
    }
}
#z170-warp #z170-5xp .icons .icon.a {
    background: #454545
}
#z170-warp #z170-5xp .icons .icon.b {
    background: #2a2a2a
}
#z170-warp #z170-5xp .icons .icon .total {
    display: inline-block;
    vertical-align: middle;
    height: 500px;
    position: relative;
    padding: 0 5%;
    width: 100%
}
@media screen and (max-width: 1400px) {
    #z170-warp #z170-5xp .icons .icon .total {
        height: auto
    }
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .icons .icon .total {
        height: auto;
        max-width: 90%
    }
}
#z170-warp #z170-5xp .icons .icon .total .toimg {
    height: 40%
}
#z170-warp #z170-5xp .icons .icon .total .toimg:before {
    content: "";
    display: inline-block;
    height: 100%;
    vertical-align: middle
}
#z170-warp #z170-5xp .icons .icon .total .toimg>img {
    vertical-align: bottom;
    display: inline-block;
    margin: 0 auto
}
#z170-warp #z170-5xp .icons .icon .total h3 {
    color: #ffc619;
    font-weight: 500;
    display: inline-block;
    text-decoration: underline;
    margin: 30px 0 24px;
    font-size: 38px;
    line-height: 1.4
}
#z170-warp #z170-5xp .icons .icon .total .subtitl {
    margin-bottom: 20px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .icons .icon .total .info {
        font-size: 21px
    }
}
#z170-warp #z170-5xp .esd {
    text-align: center
}
#z170-warp #z170-5xp .esd .estitle {
    color: #ffc619;
    border-bottom: 2px solid #ffc619;
    display: inline-block;
    margin: 80px auto 30px
}
#z170-warp #z170-5xp .esd .esinfo {
    width: 65%;
    margin: 0 auto
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .esd .esinfo {
        width: 100%
    }
}
#z170-warp #z170-5xp .esd figure {
    position: relative;
    padding: 80px 0px 200px;
    width: 1208px;
    margin-left: -360px;
    text-align: left
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .esd figure {
        width: 100%;
        margin: 0;
        padding: 20px 0px 50px
    }
    #z170-warp #z170-5xp .esd figure .pc {
        display: none
    }
}
#z170-warp #z170-5xp .esd figure .mobile {
    display: none
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .esd figure .mobile {
        display: block
    }
}
#z170-warp #z170-5xp .esd figure .line {
    position: absolute;
    display: inline-block
}
#z170-warp #z170-5xp .esd figure .line.p1 {
    top: 243px;
    left: 588px
}
#z170-warp #z170-5xp .esd figure .line.p1 .detail {
    width: 150px;
    margin-left: -64px
}
#z170-warp #z170-5xp .esd figure .line.p2 {
    top: 175px;
    left: 731px
}
#z170-warp #z170-5xp .esd figure .line.p2 .detail {
    width: 200px;
    margin-left: -27px
}
#z170-warp #z170-5xp .esd figure .line.p3 {
    top: 206px;
    left: 964px
}
#z170-warp #z170-5xp .esd figure .line.p3 .detail {
    width: 165px;
    margin-left: -30px
}
#z170-warp #z170-5xp .esd figure .line.p4 {
    top: 153px;
    left: 1107px
}
#z170-warp #z170-5xp .esd figure .line.p4 .detail {
    width: 175px;
    margin-left: 22px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .esd figure .line {
        position: relative !important;
        left: initial !important;
        right: initial !important;
        top: initial !important;
        bottom: initial !important;
        display: inline-block;
        text-align: left;
        vertical-align: top;
        margin: 10px 5px !important;
        width: 100%
    }
}
#z170-warp #z170-5xp .esd figure .line>img {
    vertical-align: top
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .esd figure .line>img {
        display: none
    }
}
#z170-warp #z170-5xp .esd figure .line .detail {
    vertical-align: top;
    height: 170px;
    background: rgba(179, 139, 18, 0.7);
    text-align: center;
    padding: 10px 5px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .esd figure .line .detail {
        position: relative !important;
        left: initial !important;
        right: initial !important;
        top: initial !important;
        bottom: initial !important;
        display: inline-block;
        vertical-align: top;
        margin: 0 !important;
        float: none !important;
        font-size: 20px;
        width: 100% !important;
        padding: 5px 45px;
        height: auto;
        text-align: left
    }
}
#z170-warp #z170-5xp .esd figure .line .detail .subtitle {
    font-weight: bold
}
#z170-warp #z170-5xp .esd figure .line .detail .cl {
    display: none
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-5xp .esd figure .line .detail .cl {
        left: 3px;
        top: 6px;
        display: block;
        position: absolute;
        width: 30px;
        height: 30px;
        -moz-border-radius: 100%;
        -webkit-border-radius: 100%;
        border-radius: 100%;
        background: #ffc619;
        color: #fff;
        text-align: center;
        font-size: 21px;
        font-weight: 400;
        line-height: 30px;
        vertical-align: middle;
        font-family: Arial
    }
}
#z170-warp #z170-ddr4 {
    background: #fff
}
#z170-warp #z170-ddr4 .dtxt {
    position: relative;
    left: 0;
    width: 100%;
    text-align: center
}
#z170-warp #z170-ddr4 .dtxt .d4title {
    margin: 70px auto 20px;
    color: #ffc619;
    display: inline-block;
    text-decoration: underline
}
#z170-warp #z170-ddr4 .dtxt .d4info {
    color: #000;
    max-width: 700px;
    margin: 0 auto
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ddr4 .dtxt .d4info {
        width: 95%
    }
}
#z170-warp #z170-ddr4 figure {
    position: relative;
    width: 1177px;
    margin: 50px auto 0px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ddr4 figure {
        margin-top: 20px;
        width: 100%
    }
}
#z170-warp #z170-ddr4 figure .animi {
    position: absolute
}
#z170-warp #z170-ddr4 figure .arr1 {
    opacity: 0;
    top: 23%;
    left: 50.5%;
    width: 7.3%;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out
}
#z170-warp #z170-ddr4 figure.on .arr1 {
    opacity: 1;
    top: 13%
}
#z170-warp #z170-ddr4 figure .arr2 {
    opacity: 0;
    top: 26%;
    left: 55%;
    width: 7.3%;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out
}
#z170-warp #z170-ddr4 figure.on .arr2 {
    opacity: 1;
    top: 16%
}
#z170-warp #z170-ddr4 figure .arr3 {
    opacity: 0;
    top: 35%;
    left: 48%;
    width: 6.3%;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out
}
#z170-warp #z170-ddr4 figure.on .arr3 {
    opacity: 1;
    top: 25%
}
#z170-warp #z170-ddr4 figure .arr4 {
    opacity: 0;
    top: 46%;
    left: 47%;
    width: 21.3%;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out
}
#z170-warp #z170-ddr4 figure.on .arr4 {
    opacity: 1;
    top: 36%
}
#z170-warp #z170-ultrafast {
    background: #fff
}
#z170-warp #z170-ultrafast .main_div .speed {
    font-size: 0px
}
#z170-warp #z170-ultrafast .main_div .speed .stitle {
    margin: 0
}
#z170-warp #z170-ultrafast .main_div .speed .item2 {
    display: inline-block;
    width: 50%;
    vertical-align: top
}
#z170-warp #z170-ultrafast .main_div .speed .item2 figure {
    overflow: hidden;
    position: relative
}
#z170-warp #z170-ultrafast .main_div .speed .item2 figure>.main_img {
    width: 100%
}
#z170-warp #z170-ultrafast .main_div .speed .item2 figure>.light {
    position: absolute
}
#z170-warp #z170-ultrafast .main_div .speed .item2.a1 .light {
    bottom: 32.5%;
    right: 2%;
    width: 45.5%;
    opacity: 1
}
#z170-warp #z170-ultrafast .main_div .speed .item2.a2 .light {
    bottom: 0%;
    width: 85.8%;
    right: 1%;
    opacity: 1
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ultrafast .main_div .speed .item2 {
        display: block;
        width: 95%;
        margin: 50px auto
    }
}
#z170-warp #z170-ultrafast .main_div .speed .item2 .sp_title {
    color: #ffc619;
    margin: 20px 0px;
    display: inline-block;
    text-decoration: underline
}
@media screen and (max-width: 1000px) {
    #z170-warp #z170-ultrafast .main_div .speed .item2 .sp_title {
        padding: 0 20px
    }
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ultrafast .main_div .speed .item2 .sp_title {
        height: auto
    }
}
#z170-warp #z170-ultrafast .main_div .speed .item2 .spinfo {
    font-size: 17px;
    color: #000;
    font-weight: 300;
    line-height: 1.411;
    margin: 0px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ultrafast .main_div .speed .item2 .spinfo {
        font-size: 21px
    }
}
@media screen and (max-width: 1000px) {
    #z170-warp #z170-ultrafast .main_div .speed .item2 .spinfo {
        padding: 0 20px
    }
}
#z170-warp #z170-ultrafast .main_div .speed .item2 .spinfo.i1 {
    padding-right: 30px
}
#z170-warp #z170-ultrafast .main_div .speed .item2 .spinfo.i2 {
    padding-right: 80px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ultrafast .main_div .speed .item2 .spinfo.i2 {
        padding-right: 0
    }
}
#z170-warp #z170-ultrafast .main_div .speed .item2 .spinfo small {
    font-size: 12px
}
#z170-warp #z170-ultrafast .main_div .speed .item1 {
    margin-top: 100px;
    padding: 0px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ultrafast .main_div .speed .item1 {
        margin-top: 20px
    }
}
#z170-warp #z170-ultrafast .main_div .speed .item1.usbl {
    direction: rtl
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ultrafast .main_div .speed .item1.usbl {
        direction: initial
    }
}
#z170-warp #z170-ultrafast .main_div .speed .item1 .usbtitle {
    color: #ffc619;
    margin: 20px 0px;
    display: inline-block;
    text-decoration: underline
}
#z170-warp #z170-ultrafast .main_div .speed .item1 .content {
    font-size: 0;
    color: #000;
    font-weight: 300;
    position: relative
}
#z170-warp #z170-ultrafast .main_div .speed .item1 .content .usbitem {
    display: inline-block;
    width: 50%;
    vertical-align: top
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ultrafast .main_div .speed .item1 .content .usbitem {
        width: 100%
    }
}
#z170-warp #z170-ultrafast .main_div .speed .item1 .content .usbitem .usbtxt {
    color: #000
}
#z170-warp #z170-ultrafast .main_div .speed .item1 .content .usbitem .usbimg2 {
    margin-top: 100px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ultrafast .main_div .speed .item1 .content .usbitem .usbimg2 {
        margin-top: 50px;
        text-align: center
    }
}
#z170-warp #z170-ultrafast .main_div .speed .item1 .content .usbitem .usbimg>img {
    width: 100%
}
#z170-warp #z170-ultrafast .main_div .speed .item1 .content .usbitem .ss {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ultrafast .main_div .speed .item1 .content .usbitem .ss {
        position: relative;
        margin-top: 30px;
        width: initial
    }
}
#z170-warp #z170-ultrafast .main_div .speed .item1 .content .usbitem.r {
    position: absolute;
    height: 100%;
    right: 0
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ultrafast .main_div .speed .item1 .content .usbitem.r {
        position: relative;
        height: auto;
        margin-top: 80px
    }
}
#z170-warp #z170-ultrafast .main_div .speed .item1 .usb_left {
    width: 50%;
    display: inline-block;
    vertical-align: top;
    direction: ltr
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ultrafast .main_div .speed .item1 .usb_left {
        text-align: center;
        width: 100%;
        margin-top: 20px
    }
}
#z170-warp #z170-ultrafast .main_div .speed .item1 .usb_right {
    width: 49%;
    display: inline-block;
    vertical-align: top;
    direction: ltr
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-ultrafast .main_div .speed .item1 .usb_right {
        width: 100%
    }
}
#z170-warp #z170-ultrafast .main_div .speed .item1 .usb_right .usbtxt {
    color: #000
}
#z170-warp #z170-usb {
    background: #fff;
    text-align: center
}
#z170-warp #z170-usb .mainsize {
    padding-bottom: 50px
}
#z170-warp #z170-usb .mainsize .usbtitle {
    margin: 70px auto;
    color: #ffc619;
    display: inline-block;
    text-decoration: underline
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-usb .mainsize .usbtitle {
        margin: 50px auto
    }
}
#z170-warp #z170-usb .mainsize .usbinfo {
    color: #000;
    display: inline-block;
    text-align: left;
    vertical-align: top;
    width: 50%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-usb .mainsize .usbinfo {
        width: 100%;
        margin-bottom: 30px
    }
}
#z170-warp #z170-usb .mainsize .usbinfo ul {
    list-style: url('../images/usb/dot.png?1437199094');
    margin-left: 13px
}
#z170-warp #z170-usb .mainsize .usbinfo ul li>h5 {
    color: #ffc619;
    display: inline-block;
    font-weight: 500
}
#z170-warp #z170-usb .mainsize>img {
    vertical-align: top
}
#z170-warp #z170-bios {
    background: #fff;
    text-align: center;
    overflow: hidden
}
#z170-warp #z170-bios .content .main_title {
    margin: 70px auto 50px;
    color: #ffc619;
    display: inline-block;
    text-decoration: underline
}
#z170-warp #z170-bios .content .main_info {
    color: #000;
    width: 63%;
    margin: 0 auto
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-bios .content .main_info {
        width: 100%
    }
}
#z170-warp #z170-bios .steps {
    font-size: 0
}
#z170-warp #z170-bios .steps .step {
    width: 50%;
    display: inline-block;
    padding: 20px 10px;
    vertical-align: top;
    text-align: left
}
#z170-warp #z170-bios .steps .step>img {
    width: 100%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-bios .steps .step {
        width: 100%
    }
}
#z170-warp #z170-bios .steps .step .stitle {
    font-size: 17px;
    color: #ffc619;
    font-family: "Oswald";
    margin-top: 10px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-bios .steps .step .stitle {
        font-size: 21px
    }
}
#z170-warp #z170-bios .steps .step .sin {
    color: #000
}
#z170-warp #z170-bios .modes {
    margin: 40px auto 100px;
    font-size: 0px;
    text-align: center
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-bios .modes {
        margin: 10px auto 100px
    }
}
#z170-warp #z170-bios .modes .mode {
    position: relative;
    display: inline-block;
    width: 48%;
    vertical-align: top;
    text-align: left
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-bios .modes .mode {
        width: 100%;
        padding: 0 10px 50px
    }
}
#z170-warp #z170-bios .modes .mode .mdtitle {
    position: relative;
    font-size: 24px;
    font-family: "Oswald";
    color: #ffc619;
    display: inline-block;
    padding: 5px 10px;
    border: 2px solid #ffc619
}
#z170-warp #z170-bios .modes .mode ul {
    margin: 20px 0 0 10px;
    position: relative
}
#z170-warp #z170-bios .modes .mode ul li {
    margin-bottom: 10px
}
#z170-warp #z170-bios .modes .mode ul strong {
    font-family: "Oswald";
    color: #ffc619;
    font-size: 17px
}
#z170-warp #z170-bios .modes .mode ul span {
    font-size: 15px;
    color: #000;
    display: block;
    font-weight: 300
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-bios .modes .mode ul span {
        font-size: 21px
    }
}
#z170-warp #z170-bios .modes .mode:nth-child(1) .bg {
    position: absolute;
    bottom: -10%;
    width: 100%;
    left: -10%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-bios .modes .mode:nth-child(1) .bg {
        bottom: 13%;
        left: 30%
    }
}
#z170-warp #z170-bios .modes .mode:nth-child(2) .bg {
    position: absolute;
    bottom: -10%;
    width: 100%;
    right: -50%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-bios .modes .mode:nth-child(2) .bg {
        bottom: 0%;
        right: -50%
    }
}
#z170-warp #z170-game .audio {
    padding-bottom: 150px;
    padding-top: 50px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio {
        padding-bottom: 0px;
        padding-top: 20px
    }
}
#z170-warp #z170-game .audio .atitle {
    display: inline-block;
    width: 48%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio .atitle {
        padding: 0px 0px 20px;
        width: 100%
    }
}
#z170-warp #z170-game .audio .atitle h3 {
    color: #ffc619;
    text-decoration: underline;
    display: inline-block
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio .atitle h3 {
        display: inline
    }
}
#z170-warp #z170-game .audio .atitle .subtitle {
    margin-bottom: 10px
}
#z170-warp #z170-game .audio figure.ab {
    position: relative;
    height: 565px;
    margin-left: 47%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio figure.ab {
        height: auto;
        margin: 0
    }
}
#z170-warp #z170-game .audio figure.ab .mg {
    height: 100%;
    position: relative
}
#z170-warp #z170-game .audio figure.ab .mg>.m {
    max-height: 100%;
    max-width: none !important;
    width: auto
}
#z170-warp #z170-game .audio figure.ab .mg .light {
    max-width: none !important;
    position: absolute;
    top: 22%;
    left: 17%;
    height: 56.81416%;
    -moz-animation: op_flicker2 2s ease-in-out infinite alternate;
    -webkit-animation: op_flicker2 2s ease-in-out infinite alternate;
    animation: op_flicker2 2s ease-in-out infinite alternate
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio figure.ab .mg {
        display: none
    }
}
#z170-warp #z170-game .audio figure.ab .m-mg {
    display: none
}
#z170-warp #z170-game .audio figure.ab .m-mg>img {
    width: 100%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio figure.ab .m-mg {
        display: block
    }
}
#z170-warp #z170-game .audio figure.ab .line {
    position: absolute
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio figure.ab .line {
        position: relative !important;
        left: initial !important;
        right: initial !important;
        top: initial !important;
        bottom: initial !important;
        display: block;
        text-align: left;
        vertical-align: top;
        margin: 20px 0px !important
    }
    #z170-warp #z170-game .audio figure.ab .line>img {
        display: none
    }
}
#z170-warp #z170-game .audio figure.ab .line .tx {
    float: left;
    padding: 0 5px;
    font-size: 17px;
    color: #fff;
    position: absolute
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio figure.ab .line .tx {
        position: relative !important;
        left: initial !important;
        right: initial !important;
        top: initial !important;
        bottom: initial !important;
        display: inline-block;
        text-align: left;
        vertical-align: top;
        margin: 0 !important;
        float: none !important;
        font-size: 21px;
        padding: 0 5px 0 45px;
        width: 100% !important
    }
}
#z170-warp #z170-game .audio figure.ab .line .tx span {
    font-weight: 300;
    display: block
}
#z170-warp #z170-game .audio figure.ab .line .tx .ltitle {
    color: #ffc619
}
#z170-warp #z170-game .audio figure.ab .line .tx .typetitle {
    padding: 3px 7px;
    border: 1px solid #ffc619;
    color: #ffc619;
    display: inline-block;
    margin-bottom: 10px
}
#z170-warp #z170-game .audio figure.ab .line .tx .cl {
    display: none
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio figure.ab .line .tx .cl {
        left: 0px;
        top: -5px;
        display: block;
        position: absolute;
        width: 30px;
        height: 30px;
        -moz-border-radius: 100%;
        -webkit-border-radius: 100%;
        border-radius: 100%;
        background: #ffc619;
        color: #fff;
        text-align: center;
        font-size: 17px;
        font-weight: 400;
        line-height: 30px;
        vertical-align: middle;
        font-family: Arial
    }
}
#z170-warp #z170-game .audio figure.ab .line.p1 {
    top: 50px;
    left: -240px
}
#z170-warp #z170-game .audio figure.ab .line.p1 .tx {
    left: -217px;
    top: -12px;
    width: 320px
}
#z170-warp #z170-game .audio figure.ab .line.p1 .tx>img {
    width: 27%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio figure.ab .line.p1 .tx>img {
        width: 80%;
        margin: 40px auto 0px
    }
}
#z170-warp #z170-game .audio figure.ab .line.p2 {
    top: 210px;
    left: 36px
}
#z170-warp #z170-game .audio figure.ab .line.p2 .tx {
    left: -493px;
    top: -50px;
    width: 490px
}
#z170-warp #z170-game .audio figure.ab .line.p2 .tx>img {
    width: 27%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio figure.ab .line.p2 .tx>img {
        width: 80%;
        margin: 40px auto 0px
    }
}
#z170-warp #z170-game .audio figure.ab .line.p3 {
    top: 284px;
    left: 27px
}
#z170-warp #z170-game .audio figure.ab .line.p3 .tx {
    left: -485px;
    top: 0px;
    width: 475px
}
#z170-warp #z170-game .audio figure.ab .line.p3 .tx>img {
    width: 27%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio figure.ab .line.p3 .tx>img {
        width: 80%;
        margin: 40px auto 0px
    }
}
#z170-warp #z170-game .audio figure.ab .line.p4 {
    top: 380px;
    left: -285px
}
#z170-warp #z170-game .audio figure.ab .line.p4 .tx {
    left: -173px;
    top: -15px;
    width: 475px
}
#z170-warp #z170-game .audio figure.ab .line.p4 .tx>img {
    width: 27%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio figure.ab .line.p4 .tx>img {
        width: 80%;
        margin: 40px auto 0px
    }
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-game .audio figure.ab .line.p5>.tx>.cl,
    #z170-warp #z170-game .audio figure.ab .line.p1>.tx>.cl,
    #z170-warp #z170-game .audio figure.ab .line.p2>.tx>.cl {
        top: 35px
    }
}
#z170-warp #z170-diy {
    position: relative;
    overflow: hidden;
    background: #fff
}
#z170-warp #z170-diy .diys {
    position: relative;
    font-size: 0
}
@media screen and (max-width: 1380px) {
    #z170-warp #z170-diy .diys {
        max-width: 1000px;
        margin: 0 auto
    }
}
#z170-warp #z170-diy .diys .detail {
    display: inline-block;
    text-align: left
}
#z170-warp #z170-diy .diys .detail .dtile {
    color: #ffc619;
    text-decoration: underline
}
#z170-warp #z170-diy .diys .detail .stitle {
    margin-bottom: 30px
}
#z170-warp #z170-diy .diys .detail .dinf {
    color: #000
}
#z170-warp #z170-diy .diys .computer {
    text-align: justify;
    margin-top: 80px
}
#z170-warp #z170-diy .diys .computer:after {
    content: '';
    display: inline-block;
    width: 100%
}
#z170-warp #z170-diy .diys .computer figure {
    width: 518px;
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin-left: -80px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-diy .diys .computer figure {
        margin: 0;
        width: 100%
    }
}
#z170-warp #z170-diy .diys .computer figure .box {
    width: 100%
}
#z170-warp #z170-diy .diys .computer figure .mb,
#z170-warp #z170-diy .diys .computer figure .dot,
#z170-warp #z170-diy .diys .computer figure .zoom {
    position: absolute;
    opacity: 0
}
#z170-warp #z170-diy .diys .computer figure .mb {
    -moz-transition: all 0.3s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    -o-transition: all 0.3s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    -webkit-transition: all 0.3s cubic-bezier(0.175, 0.885, 0.320, 1.275);
    -webkit-transition-delay: 0s;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    -moz-transform-origin: 0% 50% 50%;
    -ms-transform-origin: 0% 50% 50%;
    -webkit-transform-origin: 0% 50% 50%;
    transform-origin: 0% 50% 50%;
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 0;
    left: 41.5%;
    top: 5.4%;
    width: 55.59846%
}
#z170-warp #z170-diy .diys .computer figure .dot {
    -moz-transition: all 0.3s ease-in-out 0.3s;
    -o-transition: all 0.3s ease-in-out 0.3s;
    -webkit-transition: all 0.3s ease-in-out;
    -webkit-transition-delay: 0.3s;
    transition: all 0.3s ease-in-out 0.3s;
    opacity: 0;
    left: 56.9%;
    top: 7.8%;
    width: 37.83784%
}
#z170-warp #z170-diy .diys .computer figure .zoom {
    -moz-transition: all 0.3s cubic-bezier(0, 2.01, 0.6, 0.8) 0.6s;
    -o-transition: all 0.3s cubic-bezier(0, 2.01, 0.6, 0.8) 0.6s;
    -webkit-transition: all 0.3s cubic-bezier(0, 2.01, 0.6, 0.8);
    -webkit-transition-delay: 0.6s;
    transition: all 0.3s cubic-bezier(0, 2.01, 0.6, 0.8) 0.6s;
    -moz-transform-origin: 50% 0% 50%;
    -ms-transform-origin: 50% 0% 50%;
    -webkit-transform-origin: 50% 0% 50%;
    transform-origin: 50% 0% 50%;
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -webkit-transform: scale(0);
    transform: scale(0);
    width: 39.76834%;
    opacity: 0;
    left: 61%;
    top: 50.5%
}
#z170-warp #z170-diy .diys .computer figure.on .mb,
#z170-warp #z170-diy .diys .computer figure.on .dot,
#z170-warp #z170-diy .diys .computer figure.on .zoom {
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1
}
#z170-warp #z170-diy .diys .computer .detail {
    vertical-align: top;
    margin-top: 80px;
    width: 50%;
    margin-left: 30px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-diy .diys .computer .detail {
        width: 100%;
        margin-left: 0px
    }
}
#z170-warp #z170-diy .diys .computer .detail .dtile {
    color: #ffc619;
    text-decoration: underline
}
#z170-warp #z170-diy .diys .computer .detail .stitle {
    width: 80%
}
#z170-warp #z170-diy .diys .computer .detail .dinf {
    color: #000
}
#z170-warp #z170-diy .diys .slot {
    position: relative;
    height: 698px;
    margin-top: 50px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-diy .diys .slot {
        height: auto
    }
}
#z170-warp #z170-diy .diys .slot figure {
    position: absolute;
    width: 1124px;
    margin-left: -124px;
    top: 0px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-diy .diys .slot figure {
        width: 110%;
        margin-top: 20px;
        margin-left: -10%;
        position: relative
    }
}
#z170-warp #z170-diy .diys .slot figure .q1,
#z170-warp #z170-diy .diys .slot figure .q2 {
    position: absolute;
    -moz-transition: all 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    -o-transition: all 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    -webkit-transition: all 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275);
    -webkit-transition-delay: 0s;
    transition: all 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -webkit-transform: scale(0);
    transform: scale(0);
    width: 27.4%
}
#z170-warp #z170-diy .diys .slot figure .q1 {
    top: 4%;
    left: 41.5%
}
#z170-warp #z170-diy .diys .slot figure .q2 {
    top: 48%;
    left: 49.5%
}
#z170-warp #z170-diy .diys .slot figure.on .q1,
#z170-warp #z170-diy .diys .slot figure.on .q2 {
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1)
}
#z170-warp #z170-diy .diys .slot .detail {
    position: relative;
    width: 33%;
    margin: 110px auto 0px 0px;
    z-index: 2
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-diy .diys .slot .detail {
        width: 100%;
        margin: 0
    }
}
#z170-warp #z170-diy .diys .slot .detail .dinf {
    color: #fff
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-diy .diys .slot .detail .dinf {
        color: #000
    }
}
#z170-warp #z170-diy .diys .dimm {
    text-align: justify;
    margin-top: 50px
}
#z170-warp #z170-diy .diys .dimm:after {
    content: '';
    display: inline-block;
    width: 100%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-diy .diys .dimm {
        margin-top: 0
    }
}
#z170-warp #z170-diy .diys .dimm figure {
    display: inline-block;
    vertical-align: top;
    position: relative;
    margin-left: 20px;
    margin-right: -30px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-diy .diys .dimm figure {
        margin-left: 0px;
        margin-right: 0px
    }
}
#z170-warp #z170-diy .diys .dimm figure .q1 {
    bottom: 11%;
    right: 5%;
    position: absolute;
    width: 43.75%;
    -moz-transition: all 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    -o-transition: all 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    -webkit-transition: all 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275);
    -webkit-transition-delay: 0s;
    transition: all 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -webkit-transform: scale(0);
    transform: scale(0)
}
#z170-warp #z170-diy .diys .dimm figure.on .q1 {
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1)
}
#z170-warp #z170-diy .diys .dimm .detail {
    width: 240px;
    display: inline-block;
    padding-top: 30px;
    vertical-align: top
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-diy .diys .dimm .detail {
        width: 100%;
        margin-bottom: 20px
    }
}
#z170-warp #z170-fan {
    background: #fff
}
#z170-warp #z170-fan .mainsize {
    height: 804px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-fan .mainsize {
        height: auto
    }
}
#z170-warp #z170-fan .mainsize .fanleft {
    margin-top: 100px;
    width: 385px;
    display: inline-block
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-fan .mainsize .fanleft {
        width: 100%;
        margin-top: 50px
    }
}
#z170-warp #z170-fan .mainsize .fanleft .fantitle {
    color: #ffc619;
    text-decoration: underline
}
#z170-warp #z170-fan .mainsize .fanleft .fsubtitle {
    margin-bottom: 30px
}
#z170-warp #z170-fan .mainsize .fanleft .faninfo {
    color: #000
}
#z170-warp #z170-fan .mainsize .fanleft .faninfo ul {
    list-style: url('../images/fan/dot.png?1437310776');
    margin-left: 13px;
    width: 88%
}
#z170-warp #z170-fan .mainsize figure {
    position: absolute;
    height: 100%;
    top: 0px;
    right: -65px
}
#z170-warp #z170-fan .mainsize figure>img {
    display: block
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-fan .mainsize figure {
        position: relative !important;
        left: initial !important;
        right: initial !important;
        top: initial !important;
        bottom: initial !important;
        height: auto
    }
}
#z170-warp #z170-fan .mainsize figure .info,
#z170-warp #z170-fan .mainsize figure .gui {
    position: absolute
}
#z170-warp #z170-fan .mainsize figure .info {
    -moz-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    -webkit-transition: all 0.3s ease-in-out;
    -webkit-transition-delay: 0s;
    transition: all 0.3s ease-in-out 0s;
    bottom: 3.8%;
    left: 10.5%;
    width: 77.03804%;
    opacity: 0
}
#z170-warp #z170-fan .mainsize figure .gui {
    width: 66.03261%;
    top: 14.1%;
    left: 23.6%
}
#z170-warp #z170-fan .mainsize figure.on .info {
    opacity: 1
}
#z170-warp #z170-control {
    position: relative
}
#z170-warp #z170-control .control_bar {
    position: absolute;
    text-align: center;
    top: 66%;
    z-index: 2;
    left: 50%;
    height: 150px;
    font-size: 0;
    width: 60%;
    max-width: 602px;
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-control .control_bar:before {
        content: "";
        display: inline-block;
        height: 100%;
        vertical-align: middle
    }
}
#z170-warp #z170-control .control_bar .rightcontrol,
#z170-warp #z170-control .control_bar .leftcontrol {
    overflow: hidden;
    position: absolute;
    display: inline-block;
    width: 400px;
    height: 100%
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-control .control_bar .rightcontrol,
    #z170-warp #z170-control .control_bar .leftcontrol {
        display: none
    }
}
#z170-warp #z170-control .control_bar .pre_btn,
#z170-warp #z170-control .control_bar .next_btn {
    display: none;
    height: 50px;
    width: 50px;
    cursor: pointer;
    vertical-align: middle;
    top: 50%;
    position: absolute
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-control .control_bar .pre_btn,
    #z170-warp #z170-control .control_bar .next_btn {
        display: inline-block
    }
}
#z170-warp #z170-control .control_bar .pre_btn {
    left: -70px
}
#z170-warp #z170-control .control_bar .next_btn {
    right: -70px
}
#z170-warp #z170-control .control_bar .leftcontrol {
    left: -400px
}
#z170-warp #z170-control .control_bar .leftcontrol ul {
    left: 0;
    text-align: left
}
#z170-warp #z170-control .control_bar .rightcontrol {
    right: -400px
}
#z170-warp #z170-control .control_bar .rightcontrol ul {
    right: 0;
    text-align: right
}
#z170-warp #z170-control .control_bar ul {
    position: absolute;
    top: 0;
    width: 1000px;
    font-size: 0
}
#z170-warp #z170-control .control_bar ul li {
    text-align: center;
    display: inline-block;
    width: 200px;
    cursor: pointer
}
#z170-warp #z170-control .control_bar ul li>img {
    margin: 0 auto
}
#z170-warp #z170-control .control_bar ul li p {
    margin-top: 10px;
    font-family: "Oswald";
    font-size: 18px;
    font-weight: 500
}
#z170-warp #z170-control .mainwarp {
    position: relative;
    margin-top: 60px;
    height: 690px
}
#z170-warp #z170-control .mainwarp li {
    position: absolute;
    visibility: hidden;
    opacity: 0;
    left: 50%;
    width: 100%;
    -moz-transform: translateX(-50%) scale(0);
    -ms-transform: translateX(-50%) scale(0);
    -webkit-transform: translateX(-50%) scale(0);
    transform: translateX(-50%) scale(0);
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out
}
#z170-warp #z170-control .mainwarp li.on {
    visibility: visible;
    opacity: 1;
    -moz-transform: translateX(-50%) scale(1);
    -ms-transform: translateX(-50%) scale(1);
    -webkit-transform: translateX(-50%) scale(1);
    transform: translateX(-50%) scale(1)
}
#z170-warp #z170-control .mainwarp li img {
    margin: 0 auto
}
#z170-warp #z170-control .mainwarp li .imgmain {
    margin-bottom: 60px;
    width: 60%;
    margin: 60px auto;
    text-align: center
}
#z170-warp #z170-control .con_detail {
    text-align: center
}
#z170-warp #z170-control .con_detail .contitle {
    color: #ffc619;
    text-decoration: underline
}
#z170-warp #z170-control .con_detail .csubtitle {
    font-size: 18px;
    color: #aaa;
    margin: 10px auto 30px
}
#z170-warp #z170-control .con_detail>p {
    margin-bottom: 30px
}
#z170-warp #z170-cpu {
    text-align: center;
    background: #fff;
    padding: 50px 0
}
#z170-warp #z170-cpu .main_title {
    margin: 0 auto;
    max-width: 1000px;
    width: 90%;
    font-size: 44px;
    font-family: "Oswald";
    color: #18a6d4;
    line-height: 1;
    display: inline-block;
    margin: 40px 0px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-cpu .main_title {
        margin: 0px 0px 40px
    }
}
#z170-warp #z170-cpu .cpuitem {
    margin: 0 auto 50px;
    max-width: 630px;
    width: 90%
}
#z170-warp #z170-cpu .cpuitem>img {
    float: left
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-cpu .cpuitem>img {
        float: none;
        margin: 0 auto
    }
}
#z170-warp #z170-cpu .cpuitem .con {
    text-align: left;
    padding-left: 100px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-cpu .cpuitem .con {
        text-align: center;
        float: none;
        padding: 40px 0px
    }
}
#z170-warp #z170-cpu .cpuitem .con .contitle {
    font-family: "Oswald";
    color: #18a6d4;
    line-height: 1.3;
    font-size: 17px
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-cpu .cpuitem .con .contitle {
        font-size: 21px
    }
}
#z170-warp #z170-cpu .cpuitem .con .cinfo {
    font-size: 17px;
    font-weight: 300;
    color: #000;
    line-height: 1.411
}
@media screen and (max-width: 768px) {
    #z170-warp #z170-cpu .cpuitem .con .cinfo {
        font-size: 21px
    }
}