/* ==========================================================================
   NMC Bootstrap

   This LESS file imports all other LESS files. You should compile
   and minify this file before site launch.
   ========================================================================== */
/* Import NMC bootstrap */
/**
 * html5doctor.com Reset Stylesheet
 * v1.6.1
 * Last Updated: 2010-09-17
 * Author: Richard Clark - http://richclarkdesign.com
 * Twitter: @rich_clark
 */

/* All */
@media (min-width:640px){html{font-size:24px;}}
@media (min-width:631px) and (max-width:639px){html{font-size:23.66px;}}
@media (min-width:622px) and (max-width:630px){html{font-size:23.33px;}}
@media (min-width:613px) and (max-width:621px){html{font-size:23px;}}
@media (min-width:604px) and (max-width:612px){html{font-size:22.66px;}}
@media (min-width:595px) and (max-width:603px){html{font-size:22.33px;}}
@media (min-width:586px) and (max-width:594px){html{font-size:22px;}}
@media (min-width:577px) and (max-width:585px){html{font-size:21.66px;}}
@media (min-width:568px) and (max-width:576px){html{font-size:21.33px;}}
@media (min-width:559px) and (max-width:567px){html{font-size:21px;}}
@media (min-width:550px) and (max-width:558px){html{font-size:20.66px;}}
@media (min-width:541px) and (max-width:549px){html{font-size:20.33px;}}
@media (min-width:533px) and (max-width:540px){html{font-size:20px;}}
@media (min-width:524px) and (max-width:532px){html{font-size:19.66px;}}
@media (min-width:515px) and (max-width:523px){html{font-size:19.33px;}}
@media (min-width:506px) and (max-width:514px){html{font-size:19px;}}
@media (min-width:497px) and (max-width:505px){html{font-size:18.66px;}}
@media (min-width:488px) and (max-width:496px){html{font-size:18.33px;}}
@media (min-width:480px) and (max-width:487px){html{font-size:18px;}}
@media (min-width:471px) and (max-width:479px){html{font-size:17.66px;}}
@media (min-width:462px) and (max-width:470px){html{font-size:17.33px;}}
@media (min-width:453px) and (max-width:461px){html{font-size:17px;}}
@media (min-width:444px) and (max-width:452px){html{font-size:17.12px;}}
@media (min-width:435px) and (max-width:443px){html{font-size:16.33px;}}
@media (min-width:426px) and (max-width:434px){html{font-size:16px;}}
@media (min-width:417px) and (max-width:425px){html{font-size:15.66px;}}
@media (min-width:408px) and (max-width:416px){html{font-size:15.33px;}}
@media (min-width:400px) and (max-width:407px){html{font-size:15px;}}
@media (min-width:391px) and (max-width:399px){html{font-size:14.66px;}}
@media (min-width:382px) and (max-width:390px){html{font-size:14.33px;}}
@media (min-width:374px) and (max-width:381px){html{font-size:14px;}}
@media (min-width:365px) and (max-width:373px){html{font-size:13.66px;}}
@media (min-width:356px) and (max-width:364px){html{font-size:13.33px;}}
@media (min-width:347px) and (max-width:355px){html{font-size:13px;}}
@media (min-width:338px) and (max-width:346px){html{font-size:12.66px;}}
@media (min-width:329px) and (max-width:337px){html{font-size:12.44px;}}
@media (max-width:328px){html{font-size:12px;}}


.nav {
    position: relative;
    left: 11%;}
.navbar{padding:0 ;}
@media(max-width: 1025px){
 .nav {
     position: relative;
     left:0;}
}
@media(max-width: 1280px) {
    .header-right{height: 86px;}
    .nav {
        position: relative;
        left: 0;}
}
.nav ul {
    *zoom: 1;
    list-style: none;
    margin: 0;
    padding: 0;}

.nav ul:before,
.nav ul:after {
    content: "";
    display: table;}

.nav ul:after {
    clear: both;}

.nav ul>li {
    float: left;
    position: relative;
      color: #000;}

.nav a {
    display: block;
    padding: 10px 20px;
    line-height: 1.2em;}

.nav a:hover {
    text-decoration: none;}

.nav li ul a {
    border: none;
    color: #000;
    font-size: 16px;}

.nav li ul a:hover {
    background: rgba(0, 0, 0, 0.2);}

/* Slide Down
============================== */
.nav3 ul>li:hover ul li {
    height: 36px;}

.nav3 li ul {
    position: absolute;
    left: 0;
    top: 36px;
    z-index: 9999;}

.nav3 li ul li {
    background: #f8f8f8;
     white-space: nowrap;
      width: 100%;
 
    overflow: hidden;
    height: 0;
    -webkit-transition: height 300ms ease-in;
    -moz-transition: height 300ms ease-in;
    -o-transition: height 300ms ease-in;
    transition: height 300ms ease-in;}
/* 圆形校园生活 */


.user_callback #user_pic {
    position: relative;
    overflow: hidden;
    height: 450px;
    width: 1200px;
    z-index: 2;
    margin: 0 auto;}

.user_callback #user_pic ul {
    width: 990px;
    height: 285px;
    position: relative;
    top: 25px;
    left: 105px;}

.user_callback #user_pic ul li {
    position: absolute;}

.user_callback #user_pic ul img {
    position: relative;
    top: 0;
    left: 0;
    border-radius: 150px;}

.user_callback #user_pic ul .user_pic1 {
    top: -285px;
    left: -231px;
    z-index: 0;}

.user_callback #user_pic ul .user_pic2 {
    top: -23px;
    left: -99.5px;
    z-index: 2;}

.user_callback #user_pic ul .user_pic3 {
    top: 66px;
    left: 68px;
    z-index: 3;}

.user_callback #user_pic ul .user_pic4 {
    top: 110px;
    left: 247.5px;
    z-index: 4;}

.user_callback #user_pic ul .user_pic5 {
    top: 110px;
    left: 495px;
    z-index: 3;}

.user_callback #user_pic ul .user_pic6 {
    top: 66px;
    left: 695.5px;
    z-index: 2;}

.user_callback #user_pic ul .user_pic7 {
    top: -23px;
    left: 852px;
    z-index: 1;}

.user_callback #user_pic ul .user_pic8 {
    top: -285px;
    left: 1000px;
    z-index: 0;}

.user_callback #user_pic ul .user_pic1 a {
    width: 216.5px;
    height: 248px;}

.user_callback #user_pic ul .user_pic2 a {
    width: 225.5px;
    height: 259px;}

.user_callback #user_pic ul .user_pic3 a {
    width: 247.5px;
    height: 285px;}

.user_callback #user_pic ul .user_pic4 a {
    width: 247.5px;
    height: 285px;}

.user_callback #user_pic ul .user_pic5 a {
    width: 247.5px;
    height: 285px;}

.user_callback #user_pic ul .user_pic6 a {
    width: 247.5px;
    height: 285px;}

.user_callback #user_pic ul .user_pic7 a {
    width: 225.5px;
    height: 259px;}

.user_callback #user_pic ul .user_pic8 a {
    width: 216.5px;
    height: 248px;}


.user_callback #user_pic ul li:hover {}
.user_callback #user_pic ul li p{text-align: center;font-size: 16px;}
.user_callback #user_pic ul li.user_pic1 {
    opacity: 0;
    filter: alpha(opacity:0);}

.user_callback #user_pic ul li.user_pic2 {
    opacity: 0.6;
    filter: alpha(opacity:60);}

.user_callback #user_pic ul li.user_pic3 {
    opacity: 0.8;
    filter: alpha(opacity:80);}

.user_callback #user_pic ul li.user_pic4 {
    opacity: 1;
    filter: alpha(opacity:100);}

.user_callback #user_pic ul li.user_pic5 {
    opacity: 1;
    filter: alpha(opacity:100);}

.user_callback #user_pic ul li.user_pic6 {
    opacity: 0.8;
    filter: alpha(opacity:80);}

.user_callback #user_pic ul li.user_pic7 {
    opacity: 0.6;
    filter: alpha(opacity:60);}

.user_callback #user_pic ul li.user_pic8 {
    opacity: 0;
    filter: alpha(opacity:0);}

.user_callback #user_pic ul li img {
 box-shadow: 0 0 10px #000;}
.user_callback #user_pic ul li img:hover {

    transform: scale(1.5);
    transition: all .5s;
    -webkit-transition: all .5s;}
.user_callback #user_pic ul li.user_pic1 img {
  width: 260px;
  height: 260px;
  border-radius: 150px;}


.user_callback #user_pic ul li.user_pic2 img {
  width: 260px;
  height: 260px;
  border-radius:0px;}
.user_callback #user_pic ul li.user_pic3 img {
    width:260px;
    height:260px;
    border-radius: 150px;}


.user_callback #user_pic ul li.user_pic4 img {
  width: 260px;
  height: 260px;
  border-radius:0px;}

.user_callback #user_pic ul li.user_pic5 img {
   width: 260px;
   height: 260px;
   border-radius: 150px;}

.user_callback #user_pic ul li.user_pic6 img {
   width: 260px;
   height: 260px;
   border-radius:0px;}

.user_callback #user_pic ul li.user_pic7 img {
     width: 260px;
     height: 260px;
     border-radius:150px;}

.user_callback #user_pic ul li.user_pic8 img {
    width: 260px;
    height: 260px;
    border-radius:0px;}

.user_callback #user_pic span {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    width: 80px;
    height: 80px;
    position: absolute;
    top: 160px;
    z-index: 30;
    cursor: pointer;
    opacity: 0.7;
    filter: alpha(opacity=70);}

.user_callback #user_pic:hover span {
    opacity: 1;
    filter: alpha(opacity=100);}

.user_callback #user_pic span img {
    width: 80px;
    height: 80px;
    display: block;}

.user_callback #user_pic span.prev {
    background: url(../images/5836af12neb8a5654.jpg) no-repeat;
    position: absolute;
    top: 100px;
    left: 5px;
    display: inline-block;
    width: 60px;
    height: 60px;}

.user_callback #user_pic span.next {
    background: url(../images/5836af12n536e472b.jpg) no-repeat;
    position: absolute;
    top: 100px;
    right: 5px;
    display: inline-block;
    width: 60px;
    height: 60px;}

.user_callback #user_pic span.prev:hover {
    background: url(../images/5836af12neb8a56523.jpg) no-repeat;}

.user_callback #user_pic span.next:hover {
    background: url(../images/5836b011n9a4d4531.jpg) no-repeat;}

.user_callback {
    /* background: #ccab6e; */
    overflow: hidden;}


/* 教学团队 */

.sy_title {
    text-align: center;
    padding: 10% 0 13%;}

.sy_title span {
    text-transform: uppercase;
    font-family: arial;
    font-size: .3rem;
    font-weight: bold;}

.sy_title i {
    display: block;
    height: .05rem;
    width: .7rem;
    margin: 2% auto;
    background-color: #e23732;}

.sy_title h2 {
    font-weight: bold;
    font-size: .36rem;
    line-height: 110%;}

.team_pic {
    overflow: hidden;}

.team_pic .swiper-container {
    display: inline-block;
    width: 2.3rem;
    height: 2.02rem;
    margin-bottom: 3%;}

.team_pic .swiper-container.teampic02 {
    float: right;}

.team_pic .swiper-container.teampic03 {
    float: left;}

.team_pic .swiper-container.teampic04 {
    float: right;}

.team_pic .swiper-container.teampic05 {
    position: absolute;
    top: calc(50% - 5px);
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);}

.boxBig {
    width: 2.3rem;
    height: 2.02rem;
    overflow: hidden;}

.boxF,
.boxS,
.boxT {
    border: #444 solid 2px;
    -webkit-box-sizing: border-box;
    /* safari */
    -moz-box-sizing: border-box;
    /* firefox */
    -o-box-sizing: border-box;
    box-sizing: border-box;}

.boxF,
.boxS,
.boxT {
    width: 2.32rem;
    height: 2.02rem;
    overflow: hidden;}

.boxF {
    border-left: 0;
    border-right: 0;
    transform: rotate(120deg);
    float: left;
    -ms-transform: rotate(120deg);
    -moz-transform: rotate(120deg);
    -webkit-transform: rotate(120deg);}

.boxS {
    border-left: 0;
    border-right: 0;
    transform: rotate(-60deg);
    -ms-transform: rotate(-60deg);
    -moz-transform: rotate(-60deg);
    -webkit-transform: rotate(-60deg);}

.boxT {
    border-left: 0;
    border-right: 0;
    transform: rotate(-60deg);
    background: no-repeat 50% center;
    background-size: 125% auto;
    -ms-transform: rotate(-60deg);
    -moz-transform: rotate(-60deg);
    -webkit-transform: rotate(-60deg);
    visibility: visible;}

.teampic01 .swiper-slide {
    display: block;
    margin-bottom: 4%;}

#hexagon{width:100px;
    height:55px;
    background:#f66;
    position:relative;
    margin:50px 0px 50px 20px;}
    #hexagon:before聽{
    content:"";
    position:absolute;
    top:-25px;left:0;
    width:0;
    height:0;
    border-left:50px聽solid聽transparent;
    border-right:50px聽solid聽transparent;
    border-bottom:25px聽solid聽#f66;}
    #hexagon:after聽{
    content:"";
    position:absolute;
    bottom:-25px;left:0;
    width:0;
    height:0;
    border-left:50px聽solid聽transparent;
    border-right:50px聽solid聽transparent;
    border-top:25px聽solid聽#f66;}

    /* 鍏竟褰㈠浘鐗� */
        .hexagon_ul {
            width: 100%;
            height: 580px;}

        .hexagon {
            float: left;}
    .hexagon {
        width: 150px;
        height: 260px;
        position: relative;
        box-shadow: 0 0 20px #000;}

    .hexagon__item {
        width: 100%;
        height: 100%;
        background: blue;
        position: absolute;
        top: 0;
        left: 0;
        visibility: hidden;
        overflow: hidden;}

    .hexagon__item_left {
        transform: rotate(-60deg);}

    .hexagon__item_right {
        transform: rotate(60deg);}

    .hexagon__item:before {
        position: absolute;
        top: 0;
        left: 0;
        content: "";
        height: 100%;
        width: 300px;
        visibility: visible;
        background: url(../images/5.jpg) no-repeat;
        background-size: cover;
        transform-origin: 0 0;
        transition: all 0.4s ease;}

    .hexagon__item_left:before {
        transform: rotate(60deg) translateY(-50%);}

    .hexagon__item_right:before {
        transform: rotate(-60deg) translateX(-75%);}

    .hexagon__item_center:before {
        transform: translateX(-25%);}
    .hexagon .yy{
        display: none;
        width:150px;
        height:260px;
        background-color: #f8f8f890;
        position: relative;}
    .hexagon .yy::before {
        display: none;
        content: "";
        width: 0;
        height: 0;
        position: absolute;
        left: -75px;
        top: 0;
        border-right: 75px solid #f8f8f890;
        border-top: 130px solid transparent;
        border-bottom:130px solid transparent;}
        .hexagon .yy::after {
            display: none;
            content: "";
            width: 0;
            height: 0;
            position: absolute;
            right: -75px;
            top: 0;
            border-left: 75px solid #f8f8f890;
            border-top: 130px solid transparent;
            border-bottom: 130px solid transparent;}
    .hexagon h1{
        z-index: 9999;
        display: none;
        width: 300px;
        height: 20%;
        left: -75px;
        position: absolute;
        font-size: 24px;
        text-align: center;
        padding: 20px;
        overflow: hidden;}
    .hexagon p{
        z-index: 9999;
        display: none;
        width: 100%;
        height:80%;
        position: absolute;
        font-size: 16px;
        text-align: center;
        top: 20%;
        width: 300px;
    left: -75px;
    padding: 30px;
    overflow: hidden;}
    .hexagon:hover h1,.hexagon:hover .yy::after,.hexagon:hover .yy::before,.hexagon:hover .yy{display: block;}
    .hexagon:hover p{display: block;}