* { font-family: PingFangSC-Regular, sans-serif, Microsoft Yahei; font-size: .14rem; box-sizing: border-box; }
a { color: #939393; text-decoration: none; }
.nav { min-width: 6rem; }
.nav a{ font-size: .14rem; padding: 0 .2rem; border-left: 1px solid #ff5500; }
.nav a:hover{ color: #ff5500; transition: color .8s; }
.nav a:last-of-type{ border-right: 1px solid #ff5500; }
//.main_box{ max-width: 18rem; max-height: 10rem; margin: auto; width: 90%; height: 8.8rem; padding: .4rem 0; }

.home {background-image: url(../img/bk0.jpg);background-repeat: no-repeat;}
.home .home_main{}
.home .home_main{ display: flex; justify-content: center; align-items: center; flex-wrap: wrap; background-color: rgba(0,0,0,0.85); width: 100%; height: 100%;left:50%;top:50%;}
.home .home_main .home_clothes{ width: 7rem; height: 1.72rem; background-size: 100% ; position: relative; 
}
.home .home_main .home_clothes_info{ position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%);  }
.home .home_main .home_clothes_info p{ margin: 0 .15rem; font-weight: bold; font-size: .56rem; color: #FFFFFF; text-align: center; line-height: 1.0rem;}
//.home .home_main .home_clothes_info p:not(:last-of-type){ margin-bottom: .26rem; }
.home .home_main .nav{ position: absolute; left: 50%; top: 65%; transform: translateX(-50%) translateY(-50%);  }
.home .home_main .home_main_logo{ }
.home .home_main .home_main_logo img{ width: 6rem; display: block; margin: auto; }
.home .home_main .home_main_logo .nav{ margin-top: .36rem; }
.home .home_main .home_main_bottom{ width: 100%; font-size: .1rem; text-align: center; line-height: .3rem; margin-top: .4rem; color: #999999;}

.main_box{}
.main_box{ display: flex; justify-content: center; align-items: center; flex-wrap: wrap; background-color: rgba(0,0,0,0.65); width: 100%; height: 100%;left:50%;top:50%;}
.main_box .logo {width: 3.2rem; position: absolute; top: .8rem; left: .8rem;}
.main_box .nav { position: absolute; top: 1.6rem; right: .6rem; margin: 0;}
.main_box .title { position: absolute; top: .5rem; right: 1.8rem; font-size: .65rem; margin: 0; color: #999999;}
.main_box .content{position: absolute; top:2.2rem; width: 100%; text-align: center; align-items: center;}
.main_box .contentbox1,.contentbox2,.contentbox3,.contentbox4,.contentbox5{ display: inline-block; color: #FFFFFF; font-size: .1rem; text-align: right; line-height: 0.25rem; width: 3.6rem; height: 6.5rem; background-color: rgb(0,0,0, 0.7); border: 1px solid #FFFFFF; border;border-radius: 18px; overflow-y: hidden; -webkit-overflow-scrolling:touch; padding:0.15rem; margin:0.2rem; }
//.main_box .content a:hover{box-shadow: 0px 0px 10px #ffff00; background-color: #AAFF7F;}
.main_box .roundpic{ margin: 0.3rem; width: 3rem; height: 3rem; border-radius: 100%; border:2px solid #FFFFFF;}
.main_box .tit{display: inline-block; color: #ffffff; font-size: .2rem; word-wrap: break-word; width: 69%;}
.main_box .cont{width: 65%; display: inline-block; font-size: .15rem; line-height: .2rem;  font-weight: 100; text-align: justify;  word-wrap: break-word; margin-top: .1rem;}
.main_box .imgarray{display: inline-block; text-align: justify; align-items: center; vertical-align: top ; width:4rem; margin: 0.5rem; }
.main_box .imgarray h1{font-size: 0.2rem; color:#ffffff; text-align: center; align-items: center;}
.main_box .imgarray span{font-size: 0.15rem; color:#ece7ff; text-align: center; align-items: center; font-weight: 200;}

.section2{background-image: url(../img/bk1.jpg);background-repeat: no-repeat;}
.section2 .main_box .content .contentbox1 { background-image: url(../img/s2-1.jpg); background-size: 33% 100%; background-repeat: no-repeat;}
.section2 .main_box .content .contentbox1 .tit{color: #ff5500;}
.section2 .main_box .content .contentbox1 .cont{color: #ffe149; }
.section2 .main_box .content .contentbox2 { background-image: url(../img/s2-2.jpg); background-size: 33% 100%; background-repeat: no-repeat;}
.section2 .main_box .content .contentbox2 .tit{color: #ff557f; }
.section2 .main_box .content .contentbox2 .cont{color: #ffaa7f;}
.section2 .main_box .content .contentbox3 { background-image: url(../img/s2-3.jpg); background-size: 33% 100%; background-repeat: no-repeat;}
.section2 .main_box .content .contentbox3 .tit{color: #2b52ff; }
.section2 .main_box .content .contentbox3 .cont{color: #aaaaff;}
.section2 .main_box .content .contentbox4 { background-image: url(../img/s2-4.jpg); background-size: 33% 100%; background-repeat: no-repeat;}
.section2 .main_box .content .contentbox4 .tit{color: #8743cb; }
.section2 .main_box .content .contentbox4 .cont{color: #dc9eff; }
.section2 .main_box .content .contentbox5 { background-image: url(../img/s2-5.jpg); background-size: 33% 100%; background-repeat: no-repeat;}
.section2 .main_box .content .contentbox5 .tit{color: #aaff7f; }
.section2 .main_box .content .contentbox5 .cont{color: #55ff00;} 

.section3{background-image: url(../img/bk2.jpg);background-repeat: no-repeat;}
.section3 .main_box .content{text-align: center;}
.section3 .main_box .content .contentbox1 { background-image: url(../img/s2-1.jpg); background-size: 33% 100%; background-repeat: no-repeat;}
.section3 .main_box .content .contentbox1 .tit{color: #ff5500;}
.section3 .main_box .content .contentbox1 .cont{color: #ffe149; width: 65%; display: inline-block; text-align: justify;}
.section3 .main_box .content .contentbox2 { background-image: url(../img/s2-2.jpg); background-size: 33% 100%; background-repeat: no-repeat;}
.section3 .main_box .content .contentbox2 .tit{color: #ff557f; }
.section3 .main_box .content .contentbox2 .cont{color: #ffaa7f; width: 65%; display: inline-block; text-align: justify;}
.section3 .main_box .content .contentbox3 { background-image: url(../img/s2-3.jpg); background-size: 33% 100%; background-repeat: no-repeat;}
.section3 .main_box .content .contentbox3 .tit{color: #2b52ff; }
.section3 .main_box .content .contentbox3 .cont{color: #aaaaff; width: 65%; display: inline-block; text-align: justify;}
.section3 .main_box .content .contentbox4 { background-image: url(../img/s2-4.jpg); background-size: 33% 100%; background-repeat: no-repeat;}
.section3 .main_box .content .contentbox4 .tit{color: #8743cb; }
.section3 .main_box .content .contentbox4 .cont{color: #dc9eff; width: 65%; display: inline-block; text-align: justify;}

.section4{background-image: url(../img/bk3.jpg);background-repeat: no-repeat;}


.section5{background-image: url(../img/bk4.jpg);background-repeat: no-repeat;}
.section5 .main_box .content {text-align: left; align-items: left; vertical-align: center; width: 90%; height: 60%; top: 2.3rem;}
.section5 .main_box .content .imgarray{width:2rem; height: 100%;  float: left; vertical-align: top; margin: .5rem;}
.section5 .main_box .content .roundpic{ margin: 0rem; margin-bottom: 0.5rem; width: 2rem; height: 2rem; }
.section5 .main_box .content .aboutcon{font-size: 0.15rem; color:#ece7ff; text-align: justify; align-items: left; font-weight: 100; width: 95%; height: 100%;}
.section5 .main_box .content .aboutcon h1{font-size: 0.2rem; color:#ffffff; }
.section5 .main_box .content .aboutcon span{font-size: 0.15rem; color:#ece7ff; font-weight: 100;}



@media screen and (max-width: 750px) {
  .nav { display: none }
.home .home_main{background-size: cover; background-position:center;}
.home .home_main{ display: flex; justify-content: center; align-items: center; flex-wrap: wrap; background-color: rgba(0,0,0,0.85); width: 100%; height: 100%;left:50%;top:50%;}
.home .home_main .home_clothes{ width: 2.8rem; background-size: 100% ; position: relative; }
.home .home_main .home_clothes_info{ width: 95%; }
.home .home_main .home_clothes_info p{ margin: 0 .2rem; font-size: .25rem; color: #FFFFFF; text-align: center; line-height: 0.5rem;}
.home .home_main .home_main_logo img{ width: 3rem; display: block; margin: auto; }

.main_box{}
.main_box{ display: flex; justify-content: center; align-items: center; flex-wrap: wrap; background-color: rgba(0,0,0,0.65); width: 100%; height: 100%;left:50%;top:50%;}
.main_box .logo {width: 2.5rem; position: absolute; top: .15rem; left: .4rem; }
.main_box .title { position: absolute; top: 0.6rem; right: .3rem; font-size: .25rem; margin: 0; color: #999999;}
.main_box .content{position: absolute; top:0.9rem; width: 100%; height:100%; text-align: center; align-items: center; }
.main_box .contentbox1,.contentbox2,.contentbox3,.contentbox4,.contentbox5{ display: flex; float:center; color: #FFFFFF; font-size: .1rem; text-align: right; line-height: 0.25rem; width: 90%; height: 18%; background-color: rgb(0,0,0, 0.7); border: 1px solid #FFFFFF; border-radius: 8px; overflow-y: hidden; -webkit-overflow-scrolling:touch; padding:0.05rem; margin:0.1rem; }
.main_box .tit{display: inline-block; color: #ffffff; font-size: .12rem;line-height: .15rem; word-wrap: break-word; width: .8rem; text-align: left; margin-left:.35rem;}
.main_box .cont{width: 100%; display: inline-block; font-size: .1rem; line-height: .15rem;  font-weight: 100; text-align: justify; vertical-align: center ; word-wrap: break-word; margin-top: 0rem;}
.main_box .roundpic{ margin:0; margin-left:0.1rem; width: 1rem; height: 1rem; border-radius: 100%; border:1px solid #FFFFFF;}
.main_box .imgarray{display: flex; float:left; text-align:left; align-items:left; vertical-align: center ; width:85%; height:25%; margin: 0.1rem;}
.main_box .imgarray h1{display: block; float:left; font-size: 0.15rem; color:#ffffff; text-align: left; align-items: left; margin:.1rem; }
.main_box .imgarray span{display:block; float:left; font-size: 0.11rem; color:#ece7ff; text-align: justify; align-items: left; font-weight: 300;}

 .section2{background-size: cover; background-position:center;}
.section2 .main_box .content .contentbox1 { background-size: 10% 100%; background-repeat: no-repeat;}
.section2 .main_box .content .contentbox2 { background-size: 10% 100%; background-repeat: no-repeat;}
.section2 .main_box .content .contentbox3 { background-size: 10% 100%; background-repeat: no-repeat;}
.section2 .main_box .content .contentbox4 { background-size: 10% 100%; background-repeat: no-repeat;}
.section2 .main_box .content .conte{display:none;}

  .section3{background-size: cover; background-position:center;}

  .section4{background-size: cover; background-position:center;}

  .section5{background-size: cover; background-position:center;}
.section5 .main_box .content {text-align: left; align-items: left; vertical-align: top; width: 100%; height: 100%; top: 1rem;}
.section5 .main_box .content .imgarray{width: 1rem; height:100%; display: block; vertical-align: top; margin: 0.1rem; }
.section5 .main_box .content .roundpic{ margin: 0rem; width: 1rem; height: 1rem; display: block; margin-top:0.4rem;}
.section5 .main_box .content .aboutcon{font-size: 0.1rem; color:#ece7ff; text-align: justify; align-items: left; vertical-align: top; font-weight: 100; width: 90%; height: 100%;}
.section5 .main_box .content .aboutcon h1{font-size: 0.14rem; color:#ffffff; }
.section5 .main_box .content .aboutcon span{display:block; font-size: 0.12rem; color:#ece7ff; text-align: justify; line-height: 0.15rem; align-items: left; font-weight:300;}
  .section5 .main_box .content .aboutcon .sp5{display:none;}