/* reset style */
html,
body,
div,
span,
h1,
h2,
h3,
h4,
h5,
h6,
p,
em,
img {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline
}

ol,
ul,
li {
    list-style: none;
    padding: 0;
    margin: 0;
}

input,
textarea {
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
}
a:hover,
a:focus {
    outline: 0;
}

.clear-fix:after {
    visibility: hidden;
    display: block;
    content: " ";
    clear: both;
    height: 0;
}

* html .clear-fix {
    zoom: 1;
}

.text-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.selectable {
    -webkit-touch-callout: default;
    -webkit-user-select: auto;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

.unselectable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

html {
    width: 90%;
    margin: 0 auto;
    font-size: 100px; /* 1rem = 100px */
}

/* main style */
body {
    margin: 0 auto;
    color: #333;
    background-color: #eeeeee;
    font: 0.14rem/1.5 "MicroSoft YaHei", Roboto, "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.main-wrap {
    width: 80%;
    margin: 0 auto;
}
.header {
    margin-bottom: 0.2rem;
}
.header .name a {
    display: block;
    color: #333;
    font-size: 0.45rem;
    font-weight: 700;
    padding: 0.2rem 0 0.2rem 0.1rem;
}
.header .name a:hover {
    color: #000;
}
.header .menu {
    min-height: 0.4rem;
    background-color: #fafafa;
    background-image: -moz-linear-gradient(top,#fff,#f2f2f2);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#fff),to(#f2f2f2));
    background-image: -webkit-linear-gradient(top,#fff,#f2f2f2);
    background-image: -o-linear-gradient(top,#fff,#f2f2f2);
    background-image: linear-gradient(to bottom,#fff,#f2f2f2);
    background-repeat: repeat-x;
    border: 1px solid #d4d4d4;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#fff2f2f2',GradientType=0);
    -webkit-box-shadow: 0 1px 4px rgba(0,0,0,0.065);
    -moz-box-shadow: 0 1px 4px rgba(0,0,0,0.065);
    box-shadow: 0 1px 4px rgba(0,0,0,0.065);
}
.header .menu-list {
background-color: #eeeeee;
    border: none;
    list-style: none;
    text-align: left;
}
.header .menu-list li {
    float: left;
    margin: 0;
    padding: 0;
    min-width: 1rem;
    text-align: center;
}
.header .menu-list li a {
    display: block;
    background-color: #eeeeee;
    float: none;
    padding: 0.1rem 0.15rem 0.1rem;
    color: #777;
    text-decoration: none;
    text-shadow: 0 1px 0 #fff;
}
.header .menu-list li a:hover,
.header .menu-list li a:focus {
    color: #333;
    text-decoration: none;
    background-color: transparent;
}
.header .menu-list li.active a,
.header .menu-list li.active a:hover,
.header .menu-list li.active a:focus {
    color: #555;
    text-decoration: none;
    background-color: #dddddd;
    -webkit-box-shadow: inset 0 0.03rem 0.08rem rgba(0,0,0,0.125);
    -moz-box-shadow: inset 0 0.03rem 0.08rem rgba(0,0,0,0.125);
    box-shadow: inset 0 0.03rem 0.08rem rgba(0,0,0,0.125);
}
.main-wrap .section {
    display: none;
}
.main-wrap .section.active {
    display: block;
}
.home-section {

}
.home-section .info {
    width: 100%;
}
.home-section .info {
    font-size: 0.16rem;
    font-weight: 500;
    color: #555;
}
.home-section .info p.big {
    color: #333;
    font-size: 0.18rem;
    font-weight: 500;
    margin-top: 0.05rem;
}
.home-section .info ul {
    margin-left: 0.2rem;
}
.home-section .info ul li {
    list-style-type: disc;
}
.info .img-wrap {
    width: 30%;
    float: left;
    max-width: 2.5rem;
}
.info .img-wrap img {
    width: 90%;
}
.info .info-text {
    margin-left: 0.2rem;
    width: 65%;
    float: left;
}
.contact {
    margin: 0.2rem 0;
	width: 100%;
    color: #555;
    font-size: 0.16rem;
}
.contact h3 {
    color: #333;
    font-size: 0.24rem;
    font-weight: 700;
}
.contact a {
    color: #08c;
    text-decoration: none;
}
.contact a:hover
.contact a:focus {
    color: #005580;
    text-decoration: underline;
}
.research-section {
}
.research-section .info-wrap {
    width: 30%;
    max-width: 2.5rem;
    float: left;
}
.research-section .info-wrap .img-wrap img {
    width: 100%;
    max-width: 2.5rem;
}
.research-section .work-wrap {
    width: 100%;
    float: left;
    margin-left: 0.2rem;
}
.research-section .work-wrap h3 {
    font-size: 0.35rem;
    font-weight: 700;
    margin-bottom: 0.1rem;
}
.research-section .work-wrap p.title {
    font-size: 0.22rem;
    font-weight: 500;
}
.research-section .work-wrap p.big {
    color: #555;
    font-size: 0.16rem;
    font-weight: 500;
    margin-bottom: 0.2rem;
}
.research-section .work-wrap p.big span {
    
}

/* @media */
@media only screen and (max-width: 768px) {
    html .main-wrap {
        margin-bottom: 0.3rem;
    }
    html .header .menu-list li {
        width: 33.333%;
        text-align: center;
    }
    html .info .img-wrap,
    html .info .info-text {
        float: none;
        width: 100%;
        margin: 0 auto;
    }
	
    html .info .img-wrap {
        text-align: left;
        margin: 0;
    }
    html .research-section .info-wrap,
    html .research-section .work-wrap {
        max-width: none;
        float: none;
        width: 100%;
        margin: 0;
    }
    html .research-section .work-wrap {
        margin-top: 0.5rem;
    }
}