
.menu-container {
    width: 80%;
    margin: 0 auto;
}

.menu-mobile {
    display: none;
    padding: 20px;
}

.menu-mobile:after {
    content: "\f394";
    font-family: "Ionicons";
    font-size: 2.5rem;
    padding: 0;
    float: right;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-25%);
    -ms-transform: translateY(-25%);
    transform: translateY(-25%);
}

.menu-dropdown-icon:before {
    content: "\f489";
    font-family: "Ionicons";
    display: none;
    cursor: pointer;
    float: right;
    padding: 1.5em 2em;
    background: #fff;
    color: #333;
}

.menu > ul {
    margin: 0 auto;
    list-style: none;
    padding: 0;
    position: relative;
    /* IF .menu position=relative -> ul = container width, ELSE ul = 100% width */
    box-sizing: border-box;
    margin-left: 49%;
}

.menu > ul:before,
.menu > ul:after {
    content: "";
    display: table;
}

.menu > ul:after {
    clear: both;
}

.menu > ul > li {
    float: left;
    padding: 0;
    margin: 0;
}

.menu > ul > li a {
    text-decoration: none;
    padding: 27px 30px;
    display: block;
    color: #858585;
}

.menu > ul > li:hover {

}

.menu > ul > li > ul {
    display: none;
    background: #f7f7f8;
    border: 1px #ccc solid;
    border-radius: 5px;
    padding: 20px;
    position: absolute;
    z-index: 99;
    left: 0;
    margin: 0;
    list-style: none;
    box-sizing: border-box;
}

.menu > ul > li > ul:before,
.menu > ul > li > ul:after {
    content: "";
    display: table;
}

.menu > ul > li > ul:after {
    clear: both;
}

.menu > ul > li > ul > li {
    margin: 0;
    padding-bottom: 0;
    list-style: none;
    background: none;
    float: left;
}

.menu > ul > li > ul > li a {
    color: #777;
    padding: .2em 0;
    width: 95%;
    display: block;
    border-bottom: 1px solid #ccc;
}
.menu > ul > li > ul > li a:hover{
	color: #0093d0;
}
.menu > ul > li > ul > li > ul {
    display: block;
    padding: 0;
    margin: 10px 0 0;
    list-style: none;
    box-sizing: border-box;
}

.menu > ul > li > ul > li > ul:before,
.menu > ul > li > ul > li > ul:after {
    content: "";
    display: table;
}

.menu > ul > li > ul > li > ul:after {
    clear: both;
}

.menu > ul > li > ul > li > ul > li {
    float: left;
    width: 100%;
    padding: 10px 0;
    margin: 0;
    font-size: .8em;
}

.menu > ul > li > ul > li > ul > li a {
    border: 0;
}

.menu > ul > li > ul.normal-sub {
    left: auto;
    padding: 10px 20px;
}

.menu > ul > li > ul.normal-sub > li {
    width: 100%;
}
.menu > ul > li > ul.cpfl > li {
    width: 33%;
    height: 28px;
}
.menu > ul > li > ul.normal-sub > li a {
    border: 0;
    padding: 10px 0;
}

.clearfix{display:block;clear:both;}
.clearfix{*zoom:1;}
.clearfix:after{display:block; overflow:hidden;clear:both;height:0;visibility:hidden;content:".";}
/* play */
#play{width:640px;text-align:center;position:relative;overflow:hidden;margin:5px auto;}
#play .change_a{width:50%;height:100%;position:absolute;top:0;z-index:1;cursor:pointer;display:block;overflow:hidden;background:url(about:blank);}
#play .prev_a{left:0;}
#play .next_a{right:0}
#play .change_a span{width:24px;height:43px;display:block;position:absolute;top:50%;margin-top:-21px;display:none}
#play .prev_a span{background:url(../images/s_gallery_2012110702.png) no-repeat 0px -50px;left:0;}
#play .next_a span{background:url(../images/s_gallery_2012110702.png) no-repeat -30px -50px;right:0;}
#play .img_ul{position:relative;z-index:1;}
.img_hd {width:640px;border-top:1px solid #ccc;border-bottom:1px solid #ccc;background-color:#eee;overflow:hidden;height:66px;padding:2px 0;margin-top:15px;margin:5px auto;position:relative;}
.img_hd ul{position:absolute;z-index:1}
.img_hd ul li{float:left;width:80px;height:60px;border:3px solid #eee;cursor:pointer;margin:0 3px 0 1px;overflow:hidden;*display:inline;padding:1px;text-align:center}
.img_hd ul li img{height:60px;}
.img_hd ul li.on{border-color:rgb(45, 150, 233);}
.img_hd .bottom_a{background:url(../images/s_gallery_2012110702.png) no-repeat;width:22px;height:22px;position:absolute;display:block;top:50%;margin-top:-11px;cursor:pointer;z-index:10}
.img_hd .prev_a{background-position:0 -24px;left:5px;}
.img_hd .next_a{background-position:-30px -24px;right:5px;}
/* ––––––––––––––––––––––––––––––––––––––––––––––––––
Mobile style's
–––––––––––––––––––––––––––––––––––––––––––––––––– */

@media only screen and (max-width: 959px) {
    .menu-container {
        width: 100%;
    }
    .menu-mobile {
        display: block;
    }
    .menu-dropdown-icon:before {
        display: block;
    }
    .menu > ul {
        display: none;
    }
    .menu > ul > li {
        width: 100%;
        float: none;
        display: block;
    }
    .menu > ul > li a {
        padding: 1.5em;
        width: 100%;
        display: block;
    }
    .menu > ul > li > ul {
        position: relative;
    }
    .menu > ul > li > ul.normal-sub {
        width: 100%;
    }
    .menu > ul > li > ul > li {
        float: none;
        width: 100%;
        margin-top: 20px;
    }
    .menu > ul > li > ul > li:first-child {
        margin: 0;
    }
    .menu > ul > li > ul > li > ul {
        position: relative;
    }
    .menu > ul > li > ul > li > ul > li {
        float: none;
    }
    .menu .show-on-mobile {
        display: block;
    }
}


@media (min-width: 1200px){
	.menu > ul > .one a {
    text-decoration: none;
    margin-top: -7px;
    margin-left: -5px;
    display: block;
    color: #858585;
}
.menu > ul > .one .click{
	color: #0093D0;
}
.menu > ul > .one a:hover{
	margin-top: -7px;
	color: #0093d0;
}
.menu > ul .guanyu li a:hover{
	border-top: none;
	margin-top: -7px;
}
.menu > ul > li {
    float: left;
    padding: 0;
    margin: 0;
    margin-left: -12px;
    margin-top: 26px;
}
}
@media (min-width: 1600px){
.menu > ul {
    margin: 0 auto;
    list-style: none;
    padding: 0;
    position: relative;
    box-sizing: border-box;
    margin-left: 40%;
}

}
@media (min-width: 1800px){
.menu > ul {
    margin: 0 auto;
    list-style: none;
    padding: 0;
    position: relative;
    box-sizing: border-box;
    margin-left: 35%;
}
.menu > ul > li {
    float: left;
    padding: 0;
    margin: 0;
    margin-left: 14px;
    margin-top: 26px;
}
}