.carousel-control.left, .carousel-control.right { background-image: -o-linear-gradient(left, rgba(0, 0, 0, .5) 0, rgba(0, 0, 0, .0001) 100%); background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .0)), to(rgba(0, 0, 0, .0000))); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1); } .carousel-control { position: absolute; top: 0; bottom: 0; left: 0; /* width: 3%; */ font-size: 20px; color: #fff; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, .6); background-color: rgba(0, 0, 0, 0); filter: alpha(opacity=50); opacity: .5; margin-top: 48%; } .left { left: 81%; } @media screen and (max-width: 1500px) { .left { left: 80%; } } .carousel-indicators { position: absolute; /*鏁翠釜璁℃暟鍖哄煙缁濆瀹氫綅*/ bottom: 150px; /*璺濆鍣╟arousel搴曢儴10px*/ z-index: 15; /*璁剧疆鍏跺湪Z杞寸殑灞傜骇*/ /*璁╂暣涓鏁板尯姘村钩灞呬腑*/ left: 40%; width: 60%; padding-left: 0; margin-left: -30%; text-align: center; list-style: none; } .carousel-indicators li { display: inline-block; width: 10px; height: 10px; margin: 1px; text-indent: -999px; cursor: pointer; background-color: #000 \9; background-color: rgba(0, 0, 0, 0); border: 1px solid #fff; border-radius: 10px; } .carousel-indicators .active { width: 12px; height: 12px; margin: 0; background-color: #fff; } .input_ss { margin-top: 11px; display: none; } .home_nav .input_ss input { /* background: white; */ border: 0px; /* width: 130px; */ } .index_dian { padding-left: 75.4%; height: 600px; } .index_dian li { display: inherit; width: 10px; height: 10px; margin: 1px; text-indent: -999px; cursor: pointer; background-color: #000 \9; background-color: rgba(0, 0, 0, 0); border: 1px solid #fff; border-radius: 10px; margin-top: 20px; } .index_dian .active { width: 12px; height: 12px; margin-top: 20px; background-color: white; } .cen { position: absolute; z-index: 9999; color: white; font-size: 3.8rem; margin-left: 33%; margin-top: 20%; letter-spacing: 5px; } .cq { position: absolute; z-index: 9999; color: white; font-size: 1.8rem; margin-left: 33%; margin-top: 28%; letter-spacing: 5px; } .four { position: absolute; z-index: 9999; color: darkgrey; font-size: 1.6rem; margin-top: 26.5%; right: 44px; letter-spacing: 5px; } .cma { position: absolute; z-index: 9999; color: white; font-size: 2.2rem; margin-left: 14%; padding-top: 48%; letter-spacing: 5px; } .cnas { position: absolute; z-index: 9999; color: white; font-size: 2.2rem; margin-left: 14%; padding-top: 50%; letter-spacing: 5px; } .tit { position: absolute; z-index: 9999; color: whitesmoke; font-size: 1.6rem; margin-left: 33%; margin-top: 53.2%; letter-spacing: 5px; } /* .wd{ width: 1200px; } */ .wd div { display: inline-block; } ul { list-style: none; } .wd_1 ul li { text-align: left; /* margin-left: 31%; */ } .wd_1 ul li:first-child { color: gray; font-size: 1.4rem; } .wd_1 ul { padding-top: 100px; /* margin-left: -28%; */ } .wd_2 ul { /* padding-top: 80px; */ } .wd_1 ul li:nth-child(2) { padding-top: 60px; } .wd_1 ul li:nth-child(2), .wd_1 ul li:nth-child(3), .wd_1 ul li:nth-child(4) { font-size: 20px; font-family: Source Han Sans CN; font-weight: 500; color: rgba(77, 77, 77, 1); line-height: 40px; } .wd_2 ul li { text-align: left; /* margin-left:10%; */ } .wd_2 ul li:first-child { font-weight: bold; font-size: 40px; letter-spacing: 5px; font-family: Source Han Sans CN; font-weight: 500; color: rgba(26, 26, 26, 1); /* line-height: 87px; */ } .wd_2 ul li:nth-child(2), .wd_2 ul li:nth-child(3), .wd_2 ul li:nth-child(4), .wd_2 ul li:nth-child(5) { letter-spacing: 4px; padding-top: 20px; font-size: 1.6rem; color: dimgray; line-height: 2.8rem; } .wd_2 ul li:last-child { margin-top: 40px; } .fwdx_ul li, .fwdx_ul2 li { display: inline-block; padding: 20px 15px; } .fwdx_1 { /* padding-top: 100px; */ } .fwdx_1 ul li { text-align: left; } .fwdx_2 { /* padding-top: 100px; */ text-align: right; } .fwdx_back { background-image: url(../img/back.png); width: 100%; /* margin-top: 100px; */ height: 470px; } /* .fwdx{ width: 1200px; } */ .fwdx_1 ul li:first-child { font-weight: bold; font-size: 40px; letter-spacing: 5px; font-family: Source Han Sans CN; font-weight: 500; color: rgba(26, 26, 26, 1); line-height: 87px; } .fwdx_1 ul li:nth-child(2) { margin-top: 40px; } .fwdx_1 ul li:nth-child(2), .fwdx_1 ul li:nth-child(3) { letter-spacing: 4px; padding-top: 10px; font-size: 1.6rem; color: dimgray; } .ti { /* margin-top: 100px; */ text-align: center; } .sp { font-weight: bold; font-size: 40px; letter-spacing: 5px; font-family: Source Han Sans CN; font-weight: 500; color: rgba(26, 26, 26, 1); /* line-height:87px; */ } .sp1 { font-size: 16px; font-family: Source Han Sans CN; font-weight: 400; color: rgba(76, 76, 76, 1); line-height: 26px; } add { padding-left: 20%; } .ww { position: relative; width: 100%; /* margin-top: 105px; */ } .carousel-inner { position: relative; width: 100%; overflow: hidden; } .five { /* height: 900px; */ } .dian { height: 48px; margin-left: 30%; } .diann li { background: gray; } .right2 { display: none; position: absolute; } .carousel-indicators .active { width: 12px; height: 12px; margin: 10; background-color: lightgrey; } @media (max-width: 1520px) { .index_dian { padding-left: 75.4%; height: 520px; } .carousel-caption { right: -69%; height: 600px; padding-bottom: 30px; font-size: 1.6rem; letter-spacing: 5px; } } @media (max-width: 1320px) { .index_dian { padding-left: 75.4%; height: 440px; } .carousel-caption { right: -69%; height: 500px; padding-bottom: 30px; font-size: 1.6rem; letter-spacing: 5px; } } .arrow_but1, .arrow_but2 { border: none; background: white; } .xie { position: absolute; z-index: 9999; margin-left: 26%; padding-top: 38%; } .jia { position: absolute; z-index: 9999; margin-left: 14.2%; padding-top: 46.5%; } .eight_2 { text-align: right; } .img div { display: inline-block; } .describe ul li { color: grey; letter-spacing: 5px; font-size: 1.6rem; } /* .add{ margin-left: 18%; } */ .car_div { width: 1200px; } .xu_div { margin-left: -65%; color: #ddd; margin-top: -10px; position: absolute; } .xu { height: 520px; font-size: 1.6rem; letter-spacing: 5px; text-align: left; color: white; width: 65.2%; margin-left: 520px; } .le_car { /* position: absolute; */ bottom: -25px; left: 0; /* width: 3%; */ font-size: 20px; color: #fff; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, .6); background-color: rgba(0, 0, 0, 0); filter: alpha(opacity=50); margin-top: 5%; margin-left: 25px; } .ri_car { /* position: absolute; */ bottom: 0px; left: 0; /* width: 3%; */ font-size: 20px; color: #fff; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, .6); background-color: rgba(0, 0, 0, 0); filter: alpha(opacity=50); margin-top: 5%; margin-left: 25px; } @media (max-width: 1160px) { .jia { position: absolute; z-index: 9999; margin-left: 14.2%; padding-top: 43.5%; } .cma { position: absolute; z-index: 9999; color: white; font-size: 2.2rem; margin-left: 14%; padding-top: 46%; letter-spacing: 5px; } .cq { position: absolute; z-index: 9999; color: white; font-size: 1.8rem; margin-left: 33%; margin-top: 30%; letter-spacing: 5px; } } .describe ul li:first-child { font-size: 32px; font-family: Source Han Sans CN; font-weight: 500; color: rgba(26, 26, 26, 1); line-height: 40px; } .describe ul li:nth-child(2) { margin-top: 20px; line-height: 25px; } .describe ul li:last-child { margin-top: 100px; } .six { /* margin-top: 100px; */ } .six .swiper-slide { /* padding: 0 25px; */ } /* .six .swiper-slide img { width: 100%; height: 100%; } */ .six .swiper-slide.swiper-slide-active { /* padding: 0; */ } .six .swiper-slide.swiper-slide-active img { /* width: 50vw; */ /* height: 25vw; */ } .layer-mask { width: 100%; height: 100%; opacity: 0.7; transition: all 0.5s; background-color: #3e3e3e; position: absolute; left: 0; top: 0; right: 0; z-index: 99; } .swiper-slide-active .layer-mask { display: none; } .pc-banner { width: 100%; float: left; } @media screen and (max-width: 668px) { .pc-banner { background-size: auto 100%; } } /* .des_ul{ margin-left: 50px; } */ .des_ul li img { margin-top: 100px; } @media (max-width: 1190px) { .des_ul { margin-left: 40px; } .des_ul li img { margin-top: -20px; } } @media (max-width: 1038px) { .des_ul { margin-left: 40px; } .des_ul li img { margin-top: -20px; } } .img_one { position: absolute; width: 70%; min-height: 120px; background: white; margin-top: -120px; z-index: 98; } .imgone_tit { font-weight: 600; font-size: 1.6rem; color: black; letter-spacing: 4px; text-align: left; padding-left: 30px; padding-top: 10px; } .imgone_content { width: 100%; color: #808080; line-height: 25px; padding-top: 10px; padding-left: 30px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-align: left; } .imgone_foot { color: #12508f; position: absolute; bottom: 5px; padding-left: 30px; font-weight: 600; } .imgone_foot::after { box-shadow: none !important; } .add>img { width: 400px; height: 550px; margin-left: 40px; } .senver_1 ul li { text-align: left; } .senver { /* width: 1200px; */ /* margin-top: 60px; */ /* height: 370px; */ } .senver_1 ul li:first-child { font-weight: bold; font-size: 3rem; letter-spacing: 5px; /* margin-top: 80px; */ } .senver_1 ul li:nth-child(2), .senver_1 ul li:nth-child(4) { margin-top: 20px; color: black; font-size: 1.6rem; font-weight: 600; letter-spacing: 5px; width: 100%; } .senver_1 ul li:nth-child(3), .senver_1 ul li:nth-child(5) { color: gray; margin-top: 5px; } .senver_2 { padding-left: 280px; /* padding-top: 40px; */ } .senver_2 ul li:first-child { letter-spacing: 6px; } .senver_2 ul { /* margin-top: 10%; */ } .senver_2 ul li { font-size: 1.6rem; color: gray; line-height: 40px; text-align: left; margin-left: 20%; } .sen_sp { margin-left: 10%; letter-spacing: 3px; } .senver_2 ul li span { color: black; } @media screen and (max-width: 1380px) { .senver_2 ul { margin-top: 12%; } } .eight_back { background-image: url(../img/back.png); width: 100%; /* margin-top: 100px; */ height: 470px; } /* .eight{ width: 1200px; } */ /* .eight div{ display: inline-block; } */ .eight_1 ul li:first-child { font-weight: bold; font-size: 3rem; letter-spacing: 5px; /* margin-top: 100px; */ } .eight_1 ul li:nth-child(2), .eight_1 ul li:nth-child(3) { margin-top: 20px; color: gray; font-size: 1.6rem; letter-spacing: 5px; width: 300px; } .eight_1 ul li { text-align: left; } /* .eight_2{ width: 100%; } */ .eight_ul1 { margin-left: 45px; } .eight_ul1 li { display: inline-block; /* margin-top: 100px; */ margin-left: 20px; } .eight_ul1 li img { width: 100%; } .eight_ul1 span { padding-top: 10px; display: block; color: gray; font-size: 1.5rem; text-align: center; } @media screen and (max-width: 1457px) { /* .eight_ul1{ margin-left: 2px; } .eight_ul1 li{ display: inline-block; margin-top: 50px; margin-left: 20px; } .eight_ul1 { margin-left: 5%; } .eight_1 ul li { text-align: left; margin-left: 30px; } */ } @media screen and (max-width: 1230px) { .eight_1 ul li { text-align: left; margin-left: 10px; } .eight_ul1 { margin-left: 4%; } .eight_ul1 li { display: inline-block; margin-top: 50px; margin-left: 5px; } } @media screen and (max-width: 1135px) { .eight_ul1 li img { width: 70%; } .eight_ul1 li { display: inline-block; margin-top: 50px; margin-left: 2px; } .eight_ul1 span { padding-top: 10px; display: block; color: gray; font-size: 1.5rem; text-align: left; margin-left: 5px; } .eight_ul1 { margin-left: 10%; margin-top: 5%; } } /* 绉诲姩 */ .yd_head, .yd_sec, .yd_nav { display: none; } @media screen and (max-width: 900px) { .yd_head, .yd_sec, .yd_nav { display: block; } .pc_nav, .pc_sec { display: none; } .navbar { background: rgba(6, 12, 34, 0.9) !important; transition: right .5s ease; transform: translateX(-120%); width: 90%; margin-top: -15px; } .navbar-light .navbar-toggler { border: none; position: fixed; top: -43px; right: -130%; background: white; } .navbar-light .navbar-toggler:focus { outline: none; } .collapse:not(.show) { display: block; height: 100vh; } .navbar-light .navbar-toggler-icon { transition: all .5s ease; background: url('close.svg') no-repeat center; background-size: 100%; } body { position: relative; } ul li { list-style: none; } .head { height: 50px; background: white; position: fixed; z-index: 9999; width: 100%; top: 0; opacity: 1; } .logo { margin-top: 50px; } .logo img { width: 25px; margin-left: 20px; margin-top: -70px; } .backg { background: white; margin-top: -17px; width: 100%; margin-left: 20%; /* margin-left: -1%; */ padding-left: 10%; } .carousel-control.left { background-image: -o-linear-gradient(left, rgba(0, 0, 0, .5) 0, rgba(0, 0, 0, .0001) 100%); background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .0)), to(rgba(0, 0, 0, .0000))); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1); } .carousel-control3 { position: absolute; top: 0; bottom: 0; left: 0; width: 15%; font-size: 20px; color: #fff; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, .6); background-color: rgba(0, 0, 0, 0); filter: alpha(opacity=50); opacity: .5; margin-top: 45%; } .left { left: 74%; } .open-navbar { transition: right .5s ease !important; transform: translateX(0) !important } .open-btn { right: -10% !important; } .open-icon { background: url('open.svg') no-repeat center !important; background-size: 100%; } .shadow::before { position: absolute; display: block; content: ''; left: 0; right: 0; height: 100%; background: rgba(6, 12, 34, 0.7) !important; transition: all .3s ease-in; } .carousel { /* margin-top: 50px; */ } .navbar-nav li { height: 46px; line-height: 46px; } .hid { display: none; } .navbar-brand img { width: 50%; margin-left: 20px; } .carousel-indicators { position: absolute; bottom: 100px; z-index: 15; left: 50%; width: 60%; padding-left: 0; /* margin-left: 40%; */ padding-left: 70%; text-align: center; list-style: none; display: grid; } .carousel-indicators .active { width: 12px; height: 12px; margin: 10; background-color: #fff; } .navbar-collapse ul { margin-top: 40px; margin-left: 20%; } .navbar-collapse .active a { color: #11518e; } .navbar-brand { padding: 0; } .navbar-brand img { max-width: 100%; max-height: 100%; } .navbar-inverse { background-color: 0; z-index: 9999; } .navbar-nav li a { color: gray; } .navbar-nav>li>a { padding-top: 10px; padding-bottom: 10px; line-height: 20px; } .carousel-indicators li { width: 12px; height: 12px; margin: 1px; text-indent: -999px; cursor: pointer; background-color: #000\9; background-color: rgba(0, 0, 0, 0); border: 1px solid #fff; border-radius: 10px; margin-top: 5px; } .index_dian li { display: inherit; width: 10px; height: 10px; margin: 1px; text-indent: -999px; cursor: pointer; background-color: #000 \9; background-color: rgba(0, 0, 0, 0); border: 1px solid #fff; border-radius: 10px; margin-top: 6px; } .index_dian .active { width: 12px; height: 12px; margin-top: 6px; background-color: white; } /* .shu{ color: white; position: absolute; top: 20px; z-index: 9999; left: 50%; width: 60%; padding-left: 0; margin-left: 40%; list-style: none; display: grid; margin-top: 80px; } */ .cen { position: absolute; z-index: 999; color: white; font-size: 1.8rem; margin-top: 15%; /* left: 26%; */ letter-spacing: 2px; line-height: 26px; } .cq { position: absolute; z-index: 9999; color: white; font-size: 1.8rem; margin-left: 1%; margin-top: 30%; letter-spacing: 1px; } .cma { position: absolute; z-index: 9999; color: white; font-size: 1.2rem; margin-left: 14%; padding-top: 46%; letter-spacing: 1px; width: 200px; } .cnas { position: absolute; z-index: 9999; color: white; font-size: 1.2rem; margin-left: 14%; padding-top: 240%; letter-spacing: 1px; width: 200px; } .cen_jia { position: absolute; z-index: 999; color: white; font-size: 1.2rem; margin-top: 36%; left: 2%; letter-spacing: 2px; line-height: 24px; } .cq { font-size: 1.1rem; margin-top: -10%; } /* .mobile_2 { padding: 40px 20px 20px 20px; } */ .mobile_2 div:nth-child(2) { margin-top: 20px; } .mobile_2 div:first-child { font-size: 2rem; font-weight: 600; } .mobile_2 div { margin-top: 17px; } .nei { margin-top: 10px; color: gray; letter-spacing: 5px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 8; -webkit-box-orient: vertical; } .mobile_2 button { background: white; border: 0px; margin-top: 20px; } .mobile_2 button img { width: 100px; } .mo_ul li { text-align: center; } .mobile_3 { background: #F7F9FA; min-height: 650px; /* margin-top: 50px; */ } .mobile_3 .title { /* padding-left: 20px; */ padding-top: 20px; } .mobile_3 .title:first-child { font-size: 2rem; font-weight: 600; padding-top: 0; } .mobile_3 ul li { display: inline-block; margin-top: 20px; } .mobile_4 { width: 100%; /* margin-top: 40px; */ } .mobile_4>div { text-align: center; } .mobile_4>div:first-child { font-size: 2rem; font-weight: 600; } .mobile_4>div { margin-top: 7px; } .mobile_4>div:nth-child(2), .mobile_4>div:nth-child(3), .mobile_4>div:nth-child(4) { font-size: 1.1rem; letter-spacing: 1px; } .index { height: 10px; margin-top: -30px; position: absolute; width: 100%; text-align: center } .index ul { display: inline-block; } .index li { width: 10px; height: 10px; border-radius: 10px; background-color: #9a9a9a; float: left; margin-right: 8px; } .index li.on { background-color: white; } #lunbotu { overflow: hidden; visibility: hidden; position: relative; } .swipe-wrap { /* overflow: hidden; */ position: relative; } .swipe-wrap>div { float: left; width: 100%; position: relative; margin-top: 20px; } /* END required styles */ .swipe-wrap img { width: 100%; } .yuandian { right: 10px; bottom: 10px; position: absolute; /*height: 40px;*/ } .yuandian li { width: 20px; height: 20px; border-radius: 50%; background: blue; float: left; margin-right: 10px; } /* .yuandian .cur{ background:red; } */ .mobile4_div div { /* padding-left: 20px; */ padding-top: 10px; color: black; } .mobile4_div div:first-child { font-size: 2rem; font-weight: 600; margin-top: 10px; } .mobile4_div div { text-align: left; } .mobile4_div div:nth-child(2) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: gray; letter-spacing: 1px; text-align: left; } .mobile4_div button { background: white; border: 0px; margin-top: 20px; position: absolute; left: 5%; } .mobile4_div button img { width: 100px; } .mobile_5 { width: 100%; /* margin-top: 110px; */ } .mobile_5>div { text-align: center; } .mobile_5>div:first-child { font-size: 2rem; font-weight: 800; } .mobile_5>div, .mobile_5_two>div, .mobile_5_three>div { margin-top: 7px; color: black; text-decoration: none; } .mobile_5>div:nth-child(2), .mobile_5>div:nth-child(3), .mobile_5>div:nth-child(4) { font-size: 1.1rem; letter-spacing: 1px; } .mobile_5 img { width: 90%; margin: 5%; } .mobile_5>div:nth-child(6) { font-size: 1.6rem; font-weight: 800; text-align: left; margin-left: 6%; } .mobile_5>div:last-child { width: 90%; margin-left: 6%; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; letter-spacing: 1px; } .mobile_5_two div, .mobile_5_three div { text-align: center; } .mobile_5_two img, .mobile_5_three img { width: 100%; margin: 5% 0; height: 58vw; } .mobile_5_two div:nth-child(2), .mobile_5_three div:nth-child(2) { font-size: 1.6rem; font-weight: 800; text-align: left; /* margin-left: 6%; */ } .mobile_5_two>div:last-child, .mobile_5_three>div:last-child { width: 100%; /* margin-left: 6%; */ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: gray; letter-spacing: 1px; text-align: left; } .mob5_but button { background: white; border: 0px; margin-top: 20px; position: absolute; left: 5%; } .mob5_but button img { width: 100px; } .mobile_6 { /* margin-top: 100px; */ } .mobile_6 div { /* padding-left: 20px; */ } .mobile_6 div:first-child { font-size: 2rem; font-weight: 600; margin-top: 10px; } .mobile_6 div { text-align: left; } .mobile_6 div:nth-child(2) { letter-spacing: 1px; text-align: left; margin-top: 20px; font-weight: 800; font-size: 1.8rem; } .mobile_6 div:nth-child(3), .mobile_6 div:nth-child(5) { color: gray; margin-top: 3px; } .mobile_6 div:nth-child(4) { letter-spacing: 1px; text-align: left; margin-top: 15px; font-weight: 800; font-size: 1.8rem; } .six_2 { /* width: 90%; */ /* margin-left: 5%; */ margin-top: 20px; } .six_2 div { color: gray; margin-top: 6px; } .six_2 div span { color: black; } .back { width: 100%; background: url(../img/back.png); min-height: 800px; } .mobile_7 { /* width: 90%; */ /* padding-left: 5%; */ } .mobile_7 div:first-child { font-size: 2rem; font-weight: 600; /* margin-top: 30px; */ /* padding-top: 40px; */ } .mobile_7 div:nth-child(2) { color: gray; padding-top: 13px; } .mob7_div { width: 100%; } ul { display: block; list-style-type: disc; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; padding-inline-start: 0px; } .mob7_ul { margin: 0; } .mob7_ul li { display: inline-block; text-align: center; width: 49%; margin-top: 30px; } .mob7_ul li .item { /* width: 100%; */ padding-right: 4%; } .mob7_ul li:nth-child(2n+0) .item { padding-right: 0; padding-left: 4%; } .mob7_ul li img { width: 100%; } .mob7_ul li span { color: gray; } .food { width: 90%; margin-left: 4%; } .food ul li { font-size: 1.1rem; color: gray; } .food ul li span { padding-left: 2%; } } .home-banner { width: 100%; height: 55.7vw; /* min-width: 1200px; */ display: block; } .home-banner .swiper-container { width: 100%; height: 100%; } .home-banner .banner { width: 100%; height: 100%; } .home-banner .btn-left, .home-banner .btn-right { position: absolute; width: 30px; height: 30px; /* display: block; */ right: 13.5%; bottom: 14%; z-index: 10; } .home-banner .btn-left { right: calc(13.5% + 40px); } .home-banner .page-total { position: absolute; z-index: 10; right: 13.3%; top: 22%; font-size: 16px; color: #fff; letter-spacing: 2px; } .home-banner .page-total .cur { margin-right: 5px; } .home-banner .page-total .total { margin-left: 5px; } .home-banner .page-slide { position: absolute; z-index: 10; top: 28%; right: 13.3%; } .home-banner .page-slide .item { border: 1px solid rgba(255, 255, 255, 0); height: 15px; width: 15px; border-radius: 50%; display: block; margin-top: 1.3vw; margin-left: 3px; cursor: pointer; } .home-banner .page-slide .item.active { border: 1px solid #fff; } .home-banner .page-slide .item .slide { width: 7px; height: 7px; background: #FFF; opacity: 0.6; border-radius: 50%; display: block; margin: 3px auto; } .home-banner .page-slide .item.active .slide { opacity: 1; } .home-banner .page-slide .line { width: 1px; height: 36px; background: #fff; margin-top: 1.3vw; display: block; margin-left: 10px; } .home-banner .page-slide .cur { margin-top: 1.3vw; display: block; font-size: 16px; color: #fff; letter-spacing: 2px; } .main { padding-bottom: 0; } @media screen and (max-width: 900px) { .home-banner { min-width: auto; } .home-banner .page-total { font-size: 12px; right: 5px; top: auto; bottom: 5px; } }