*{margin: 0; padding: 0; border: 0;}
html,body{ width: 100%; height: 100%; overflow-y: hidden; max-width: 1920px; margin: 0 auto; position: relative; font-family: Microsoft YaHei; min-width: 1440px; }
ul,ol,li{list-style: none;}
a{ text-decoration: none; }


.swiper-container { width: 100%; height: 100%; position: relative; z-index: 1; transition: .5s; overflow: hidden;}
.swiper-slide{ width: 100%; height: 100%; position: relative; overflow: hidden; background-position: center center; background-repeat: no-repeat;}

.part_1{ background-image: url(img/bg_01.jpg); }
.part_2{ background-image: url(img/bg_02.jpg); }
.part_3{ background-image: url(img/bg_03.jpg); }
.part_4{ background-image: url(img/bg_04.jpg); }
.part_5{ background-image: url(img/bg_05.jpg); }
.part_6{ background-image: url(img/bg_06.jpg); }
.part_7{ background-image: url(img/bg_07.jpg); }

.part_7 {background-position: center center}

.part_5 .tips{ position: absolute; bottom: 70px; text-align: center; left: 0; font-size: 18px; color: #c00; z-index: 7; width: 100%; display: block; }

.nav{ width: 80px; position: absolute; height: 660px; padding-top: 20px; top: 50%; margin-top: -395px; right: 35px; z-index: 2}
.nav i{ display: block; position: absolute; }
.nav i.nav_line{ width: 1px; border-right: 1px #755d3f dashed; left: 39px; top: 0; height: 680px; z-index: 1}
.nav i.nav_arrow{ width: 24px; height: 13px; background-image: url(img/nav_arrow.png); top: -9px; left: 28px;}
.nav i.nav_mouse{ width: 23px; height: 31px; background-image: url(img/nav_mouse.png); bottom:-30px; left: 29px;}
.nav a{ width: 40px; height: 80px; text-align: center; padding:0 20px 10px 20px; font-size: 16px; color: #fff; text-align: center; display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center; background-image: url(img/nav_bg.png); background-position: bottom; line-height: 20px; position: relative; z-index: 2}
.nav a:hover{ background-position: top }
.nav a.cur{ background-position: top }


.back{ width: 120px; height: 30px; display: block; position: absolute; top: 0; left: 50%; margin-left: -725px; background-color: #97734b; font-size: 14px; color: #fff; text-align: center; line-height: 30px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; }
.logo{ width: 195px; display: block; position: absolute; top: 40px; left: 50%; margin-left: -770px; }
.video_btn{ width: 101px; display: block; position: absolute; top: 50%; margin-top: -350px; left: 50%; margin-left: 330px; transition: .5s}
.video_btn:hover{ transform: scale(1.05,1.05); }

.title{width: 100%;text-align: center;}
.t_box{ width: 100%; font-size: 16px; color: #f9f0e1; text-align: center; position: absolute; line-height: 25px;}
.part_2 .t_box{ top: 50%; margin-top: -280px; }
.t_img{width: 60% }
.p2_box{ width: 1380px; position: absolute; top: 50%; margin-top: -180px; left: 50%; margin-left: -690px; text-align: center; }
.p2_box ul li{ width: 384px; display: inline-block; margin: 0 25px; }
.p2_box ul li .pic_b{ display: block; padding-bottom: 30px;transition: .5s}
.p2_box ul li .pic_s{ display: block; transition: .5s .2s}
.p2_box ul li:hover .pic_b{ transform: translateY(-15px); }
.p2_box ul li:hover .pic_s{ transform: translateY(-15px); }

.child_tab{ width: 87px; height: 592px; background-image: url(img/status_bg.png); position: absolute; top: 50%; margin-top: -250px; left: 50%; margin-left: -600px; }
.child_tab a{ width: 66px; height: 65px; line-height: 65px; text-align: center; margin: 50px 28px; display: block; background-image: url(img/status_tab.png); background-position: bottom; font-size: 20px; color: #fff; }
.child_tab a.cur{ background-position: top; }
.child_tab a:hover{ background-position: top; }
.child_tab a.tab_1{ margin-top: 80px; }

.child_box{ width: 524px; height: 527px; position: absolute; top: 50%; margin-top: -200px; background-image: url(img/box_3.png); left: 50%; margin-left: -320px; }
.child_box .interact{ position: absolute; top: 0; left: 0; z-index: 2}
.child_box .interact ul li{ width: 73px; height: 73px; position: absolute;}
.child_box .interact ul li a{ width: 100%; display: block; line-height: 73px; font-size: 23px; color: #8a4512; text-align: center;  background-image: url(img/box_4.png); background-position: top;}
.child_box .interact ul li a:hover{ background-position: bottom; color: #fff; }
.child_box .interact ul li.interact_1{ top: 0; left: 100px }
.child_box .interact ul li.interact_2{ top: 100px; left: 0px }
.child_box .interact ul li.interact_3{ top: 240px; left: -40px; }
.child_box .interact ul li.interact_4{ top: 380px; left: 10px }
.child_box .interact ul li .info{ width: 260px; padding:15px 25px; border: 10px rgba(0,0,0,.2) solid; border-radius: 10px; background-color: #fff; position: absolute; top: 0; left: 80px; opacity: 0; transition: .5s; transform: translateX(50px); z-index: 2}
.child_box .interact ul li .info p{ font-size: 16px; color: #1d1d1d; line-height: 24px; padding: 10px 0 10px 20px; position:relative;}
.child_box .interact ul li .info p:before{content: ""; width: 8px; height: 8px; display: block; position: absolute; top: 18px; left: 0; transform: rotate(45deg); background-color:#885f2b;}
.child_box .interact ul li a:hover+.info{ opacity: 1; transform: translateX(0); }
.child_box .interact ul li.interact_4 .info{ top: -100px;}

.child_box .child_img{ position: absolute; top: 50%; margin-top: -350px; left: 50%; margin-left: -250px; z-index: 1; }

.child_box .child_info{ width: 313px; position: absolute; top: -20px; left: 50%; margin-left: 300px; }
.child_box .child_info .zz{ width: 100%; }
.child_box .child_info .child_t{ width: 100%; position: relative; height: 30px;}
.child_box .child_info .child_t img{ display: block; float: left; }
.child_box .child_info .child_t .detail_btn{ width: 24px; height: 24px; margin-left: 10px; display: block; float: left; background-color: #a99479; font-size: 18px; color: #fff; text-align: center; line-height: 24px; border-radius: 30px;z-index: 3; position: relative; }
.child_box .child_info .child_t .info{ width: 260px; padding:15px 25px; border: 10px rgba(0,0,0,.2) solid; border-radius: 10px; background-color: #fff; position: absolute; top: 0; left: 180px; opacity: 0; transition: .5s; transform: translateX(50px); z-index: 2}
.child_box .child_info .child_t .info p{ font-size: 16px; color: #1d1d1d; line-height: 24px; padding: 10px 0 10px 20px; position:relative;}
.child_box .child_info .child_t .info p:before{content: ""; width: 8px; height: 8px; display: block; position: absolute; top: 18px; left: 0; transform: rotate(45deg); background-color:#885f2b;}
.child_box .child_info .child_t .detail_btn:hover+.info{ opacity: 1; transform: translateX(0); }
.child_box .child_info .zz_box{ clear: both;  padding: 15px 10px; width: 312px; height: 112px; background-image: url(img/box_1.png); box-sizing: border-box; margin-top: 10px;}
.child_box .child_info .zz_box ul li{ width: 50%; float: left; line-height: 40px; text-align: center; font-size: 16px; color: #333; border-bottom: 1px #ddd solid; }
.child_box .child_info .zz_box ul li b{ color: #ee0f34; padding-left: 10px; }
.child_box .child_info .gx{ width: 100%;margin-top: 30px; }
.child_box .child_info .gx .gx_img{ padding: 10px 0; display: block; }
.child_box .child_info .gx p{ font-size: 16px; color: #333; line-height: 20px; }

.zhuzhen{ width: 1280px; position: absolute; top: 50%; margin-top: -250px; left: 50%; margin-left: -640px;}
.zhuzhen ul li{ width: 290px; height: 567px; float: left; background-image: url(img/02_1.png); margin: 0 52px;}
.zhuzhen ul li h1{ display: block; font-size: 30px; color: #b1473a; padding-top: 38px; text-align: center; }
.zhuzhen ul li .info{ width: 240px; margin: 0 auto; padding-top: 60px; padding-left: 30px; }
.zhuzhen ul li .info p{ font-size: 16px; color: #fff; line-height: 24px; padding: 10px 0 10px 20px; position:relative;}
.zhuzhen ul li .info p:before{content: ""; width: 8px; height: 8px; display: block; position: absolute; top: 18px; left: 0; transform: rotate(45deg); background-color:#fecc79;}

.shejiao{ width: 1290px; position: absolute; top: 50%; margin-top: -220px; left: 50%; margin-left: -645px; display: none}
.shejiao.cur{display: block;}
.shejiao .shejiao_box{ width: 1290px; height: 564px; background-image: url(img/box_2.png); background-size: 100% 100%;}
.shejiao .shejiao_box.make_friends{background-image: url("img/box_5.png")}
.shejiao .shejiao_box .text_box{ width: 400px; float: left; padding: 70px 0 0 65px; }
.shejiao .shejiao_box .text_box h1{ font-size: 36px; color: #885f2b; display: block; }
.shejiao .shejiao_box .info{ width: 360px; padding-top: 20px }
.shejiao .shejiao_box .info p{ font-size: 16px; color: #333; line-height: 24px; padding: 10px 0 10px 20px; position:relative;}
.shejiao .shejiao_box .info p:before{content: ""; width: 8px; height: 8px; display: block; position: absolute; top: 18px; left: 0; transform: rotate(45deg); background-color:#885f2b;}
.shejiao .pic_box{ width: 750px; float: left; padding: 120px 0 0 35px; }
.shejiao .pic_box ul li{ width: 225px; float: left; margin: 10px; background-color: #000; border: 2px #fff solid; box-sizing: border-box; position: relative; box-shadow: 5px 5px 0 #d5b27c;}
.shejiao .make_friends .pic_box ul li{border: none;background-color: #ffffff;}
.shejiao .pic_box ul li img{ display: block; width: 100%; transition: opacity .5s }
.shejiao .pic_box ul li i{ width: 34px; height: 35px; transition: .5s;display: block; background-image: url(img/pic_i.png); position: absolute; top: 50%; margin-top: -17px; left: 50%; margin-left: -17px; opacity: 0 }
.shejiao .pic_box ul li:hover i{ opacity: 1 }
.shejiao .pic_box ul li:hover img{ opacity: .5 }

.part_5 a.p5_nav{position: absolute;width: 183px;height: 58px;background: url("img/soc_tab.png") no-repeat;background-position: 0 -58px;line-height: 58px;text-align: center;color: #FFFFFF;font-size: 24px}
.part_5 a.p5_nav.cur{background-position: 0 0}
.part_5 a.p5_nav:first-child{left: 50%;margin-left: -190px;bottom:80px}
.part_5 a.p5_nav:last-child{right: 50%;margin-right: -190px;bottom:80px}


.soc_box{ width: 100%; height: 381px; background-image: url(img/bg_08.jpg); position: fixed; bottom: 0; left: 0; z-index: 3; transition: .5s;-webkit-transform: translateY(381px); -ms-transform: translateY(381px); -moz-transform: translateY(381px); -o-transform: translateY(381px); transform: translateY(381px);}
.soc_box ul{ width: 1320px; margin: 0 auto; padding-top: 80px;}
.soc_box ul li{ width: 240px; height: 205px; display: inline-block; margin: 0 40px; position: relative;}
.soc_box ul li.soc_1{ background-image: url(img/soc_wx.png); }
.soc_box ul li.soc_2{ background-image: url(img/soc_wb.png); }
.soc_box ul li.soc_3{ background-image: url(img/soc_tb.png); }
.soc_box ul li.soc_4{ background-image: url(img/soc_qq.png); }
.soc_box ul li img{ width: 154px; position: absolute; top: -10px; right: -30px; transition: .5s}
.soc_box ul li:hover img{ transform: translateY(-10px); }
.soc_box ul li span{ display: block; padding-top: 164px; font-size: 16px; color: #333; text-align: center; }
.soc_box ul li span a{ color: #a33f31; }
.soc_box ul li a:hover{ color: #fff }

#j-hwy-gamefoot{ width: 100%; position: fixed; bottom: 0; left: 0; z-index: 2; -webkit-transform: translateY(140px); -ms-transform: translateY(140px); -moz-transform: translateY(140px); transform: translateY(140px); transition: .5s}

.mask{ width: 100%; height: 100%; background-color: #000; position: fixed; top:0; left: 0; z-index: 8; opacity: .7; display: none}
.pop{ width: 691px; position: absolute; top: 50%; margin-top: -250px; left: 50%; margin-left: -345px; z-index: 9; display: none }
.pop .pop_img{ width: 100%; display: block; }
.pop .close{ width: 71px; height: 71px; display: block; position: absolute; bottom: -90px; left: 50%; margin-left: -35px; }
.pop .close img{ width: 100%; display: block; transition: .5s }
.pop .close:hover img{ transform: rotate(180deg); }
.pop .pop_con{ background-image: url(img/pop_bg.png); background-size: 100% auto; padding: 40px;}
.pop .pop_con .pop_h1{ font-size: 36px; color: #885f2b; display: block; text-align: center; padding-bottom: 10px; }
.pop .pop_con .info{ width: 520px; margin: 0 auto; padding-left: 10px; }
.pop .pop_con .info p{ font-size: 16px; color: #1d1d1d; line-height: 24px; padding: 10px 0 10px 20px; position:relative;}
.pop .pop_con .info p:before{content: ""; width: 8px; height: 8px; display: block; position: absolute; top: 18px; left: 0; transform: rotate(45deg); background-color:#885f2b;}

.pop_video{ width:800px; height:450px; position:fixed; top:200px; left:50%; margin-left:-400px; z-index:11; padding:5px; background:#000; display:none;}
.pop_video .close{ width:39px; height:39px; position:absolute; top:0px; right:-39px; background-color: #000; display:block;}
.pop_video .close img{ padding:6px; transition:all ease 0.5s;}
.pop_video .close:hover img{ transform:rotate(360deg);}

#focus_1{    width: 1267px;height: 718px;position: absolute;left: 50%;margin-left: -633.5px;bottom:80px;text-align: center;}
#focus_1 .flex-control-paging {position: absolute;bottom:0;left: 50%;margin-left: -424px;}
#focus_1 .flex-control-paging li{float: left;margin: 0 16px}
#focus_1 .flex-control-paging li a{text-indent: -20000px;text-align:center;line-height:89px;color:#A33F31;display: block;width:89px ;height:89px ;background-repeat: no-repeat;position: relative;}
#focus_1 .flex-control-paging li a:hover{cursor: pointer}
#focus_1 .flex-control-paging li:nth-child(1) a{background-image: url("img/sz_1_s.png")}
#focus_1 .flex-control-paging li:nth-child(2) a{background-image: url("img/sz_2_s.png")}
#focus_1 .flex-control-paging li:nth-child(3) a{background-image: url("img/sz_3_s.png")}
#focus_1 .flex-control-paging li:nth-child(4) a{background-image: url("img/sz_4_s.png")}
#focus_1 .flex-control-paging li:nth-child(5) a{background-image: url("img/sz_5_s.png")}
#focus_1 .flex-control-paging li:nth-child(6) a{background-image: url("img/sz_6_s.png")}
#focus_1 .flex-control-paging li:nth-child(7) a{background-image: url("img/sz_7_s.png")}
#focus_1 .flex-control-paging li a:before{ content:'';position:absolute;width: 101px;height: 102px;background: url("img/sz_nav.png") no-repeat;background-position: 0 0;top:-8px;left: -6px }
#focus_1 .flex-control-paging li a:after{ content:'';position:absolute;color: #F1B06A;text-indent: 0!important;bottom: -65px;left: 12px;width: 64px;text-align: center;}
#focus_1 .flex-control-paging li:nth-child(1) a:after{content: '荣耀九州'}
#focus_1 .flex-control-paging li:nth-child(2) a:after{content: '桃之夭夭'}
#focus_1 .flex-control-paging li:nth-child(3) a:after{content: '山海遗音'}
#focus_1 .flex-control-paging li:nth-child(4) a:after{content: '花间鸟语'}
#focus_1 .flex-control-paging li:nth-child(5) a:after{content: '瓜瓞绵绵'}
#focus_1 .flex-control-paging li:nth-child(6) a:after{content: '采栗忙'}
#focus_1 .flex-control-paging li:nth-child(7) a:after{content: '昊日逐月'}
#focus_1 .flex-control-paging li a.flex-active:before{background-position: 0 -102px}
#focus_1 .flex-control-paging li a.flex-active:after{color: #6E2B1B;}
#focus_1 .flex-direction-nav .flex-prev{position:absolute;text-indent: -20000px;width:50px;height:70px;background-image: url("img/left.png");background-size: 100%;background-repeat: no-repeat;background-position: top center;left: 50%;margin-left: -500px;top: 50%;margin-top: -100px}
#focus_1 .flex-direction-nav .flex-next{position:absolute;text-indent: -20000px;width:50px;height:70px;background-image: url("img/right.png");background-size: 100%;background-repeat: no-repeat;background-position: top center;right: 50%;margin-right: -500px;top: 50%;margin-top: -100px}

#focus_2 .flex-viewport{margin-top: 63.5px;}
#focus_2{    width: 728px;height: 728px;position: absolute;left: 50%;margin-left: -364px;top: 50%;margin-top: -340px;text-align: center;background: url("img/xt_bg.png") no-repeat center center;background-size: 100% 100%;}
#focus_2 .flex-control-paging li a{text-indent: -20000px;position: absolute;width: 67px;height: 67px;background: url("img/xt_tab.png") no-repeat;background-position: 0 -67px;}
#focus_2 .flex-control-paging li a:hover{cursor: pointer}
#focus_2 .flex-control-paging li a:after{text-indent: 0!important;width: 67px;height: 67px;text-align:center;line-height: 67px;position: absolute;top: 0;left: 0 ;color: #7A3715;}
#focus_2 .flex-control-paging li:nth-child(1) a{left: 50%;margin-left: -290px;top:50%;margin-top: -286px;}
#focus_2 .flex-control-paging li:nth-child(2) a{right: 50%;margin-right: -291px;top: 50%;margin-top: -285px; }
#focus_2 .flex-control-paging li:nth-child(3) a{right: 50%;margin-right: -291px;top: 50%;margin-top: 221px; }
#focus_2 .flex-control-paging li:nth-child(4) a{left: 50%;margin-left: -290px;top:50%;margin-top: 221px;}
#focus_2 .flex-control-paging li:nth-child(1) a:after{ content: '上课'; }
#focus_2 .flex-control-paging li:nth-child(2) a:after{ content: '考试'; }
#focus_2 .flex-control-paging li:nth-child(3) a:after{ content: '社团'; }
#focus_2 .flex-control-paging li:nth-child(4) a:after{ content: '书包'; }
#focus_2 .flex-control-paging li a.flex-active{background-position: 0 0;}
#focus_2 .flex-control-paging li a.flex-active:after{color: #E4BB8B!important;}
#focus_2 .flex-direction-nav .flex-prev{position:absolute;text-indent: -20000px;width:140px;height:50px;background-image: url("img/prev.png");background-size: 100%;background-repeat: no-repeat;background-position: top center;left: 50%;margin-left: -580px;top: 50%;margin-top: -30px}
#focus_2 .flex-direction-nav .flex-next{position:absolute;text-indent: -20000px;width:140px;height:50px;background-image: url("img/next.png");background-size: 100%;background-repeat: no-repeat;background-position: top center;right: 50%;margin-right: -580px;top: 50%;margin-top: -30px}

.part_7 .info{ width: 260px; padding:15px 25px; border: 10px rgba(0,0,0,.2) solid; border-radius: 10px; background-color: #fff; position: absolute; opacity: 0; transition: .5s; z-index: 0}
.part_7 .info p{ font-size: 16px; color: #1d1d1d; line-height: 24px; padding: 10px 0 10px 20px; position:relative;}
.part_7 .info p:before{content: ""; width: 8px; height: 8px; display: block; position: absolute; top: 18px; left: 0; transform: rotate(45deg); background-color:#885f2b;}

.part_7 .info.sk{top: 50%;left: 50%;margin-top: -370px;margin-left: -750px;}
.part_7 .info.ks{top: 50%;right: 50%;margin-top: -350px;margin-right: -750px;}
.part_7 .info.st{top: 50%;right: 50%;margin-top: 25px;margin-right: -750px;}
.part_7 .info.bag{top: 50%;left: 50%;margin-top: 250px;margin-left: -750px;}

.part_7 .info.sk.cur{transform: translateX(100px);opacity: 1;z-index: 1}
.part_7 .info.ks.cur{transform: translateX(-100px);opacity: 1;z-index: 1}
.part_7 .info.st.cur{transform: translateX(-100px);opacity: 1;z-index: 1}
.part_7 .info.bag.cur{transform: translateX(100px);opacity: 1;z-index: 1}

.part_7 .tip{position: absolute;width: 210px;font-size: 14px;color: #93897A;top:50%;margin-top: 350px;right: 50%;margin-right: -625px ;opacity: .5}

.zz_box ul{display: none}
.zz_box ul.cur{display: block}

@media screen and (max-width: 1670px){
    .logo{margin-left: -720px;}
    .back{margin-left: -675px;}
}

@media screen and (max-height: 900px){
    .part_7 .info.st{top: 50%;right: 50%;margin-top: -50px;margin-right: -750px;}
    .part_7 .info.bag{top: 50%;left: 50%;margin-top: 230px;margin-left: -750px;}
    .child_box .interact ul li:nth-child(3) .info{top: -150px;}
    .part_7 .tip{margin-top: 300px;}
}

@media screen and (max-width:1600px){
    .part_7 .info.ks{top: 50%;right: 50%;margin-top: -350px;margin-right: -730px;}
    .part_7 .info.st{top: 50%;right: 50%;margin-top: 25px;margin-right: -730px;}
}