#main { width: 100%; font-size: .7rem; background-color: #ffffff; box-sizing: border-box; box-sizing: border-box; } #main table { border-spacing: 0; border-collapse: collapse; width: 100%; } #main .div_btn { width: 11.4rem; margin: 0 auto; height: 1.5rem; } #main .btn { width: 100%; display: inline-block; line-height: 1.5rem; text-align: center; color: #ffffff; font-weight: 700; background-color: #ff452c; box-shadow: 0rem 0rem 0.6rem 0rem rgba(255, 69, 44, 0.5); border-radius: 1rem; font-size: .65rem; } #main .banner { background: url(/uploads/image/zcyimg/banner.png) no-repeat; width: 100%; height: 13.8rem; background-size: 100%; } #main .section1 { position: relative; } #main .section1 ul { width: 15rem; height: 2rem; background-color: #ff452c; display: flex; justify-content: center; line-height: 2rem; position: absolute; bottom: -1rem; left: 50%; transform: translatex(-50%); color: #ffffff; font-size: .6rem; } #main .section1 ul li:nth-child(2) { margin: 0 1.2rem; } #main .section1 ul img { width: .8rem; margin-right: .3rem; } #main h1 { text-align: center; position: relative; height: 3rem; font-size: .8rem; } #main h1 span, #main h1 i { position: absolute; display: inline-block; } #main h1 span { width: 3rem; height: 3rem; font-size: 2.8rem; color: #fff8c5; left: 0; top: 0; display: flex; justify-content: center; align-items: center; } #main h1 i { width: 1.3rem; height: 1.7rem; right: 2.5rem; top: 50%; transform: translatey(-50%); } #main h1 p { width: 13rem; position: absolute; z-index: 2; letter-spacing: .13rem; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); } #main .section2 { width: 100%; background: #ffffff url(/uploads/image/zcyimg/section2_bg.png) repeat-y; background-size: 100%; padding: 1.5rem .5rem 0; } #main .section2 .container { height: auto; } #main .section2 .container ul { display: flex; justify-content: space-between; flex-wrap: wrap; margin-bottom: .5rem; } #main .section2 .container li { width: 48%; border: solid 1px #8d8d8d; display: flex; flex-direction: column; justify-content: center; align-items: center; height: 4rem; font-weight: 700; position: relative; z-index: 2; } #main .section2 .container li:after { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; border: solid 1px #ffef8f; } #main .section2 .container li img { width: 24%; margin-bottom: .4rem; } #main .section2 .container ul div { width: 100%; background-color: #fce13a; padding: .6rem 1rem; font-size: .6rem; margin-top: .7rem; position: relative; display: none; } #main .section2 .container ul div.active { display: block; } #main .section2 .container ul div::before { content: ''; width: 0; height: 0; display: inline-block; border-top: .4rem solid transparent; border-right: .4rem solid transparent; border-bottom: .4rem solid #fce13a; border-left: .4rem solid transparent; position: absolute; top: -.8rem; left: 22%; } #main .section2 .container ul div.right::before { left: auto; right: 22%; } #main .section3 { width: 100%; background: #ffffff url(/uploads/image/zcyimg/section2_bg.png) repeat-y; background-size: 100%; padding: 0 .5rem 0; margin-top: .4rem; } #main .section3 h1 i { right: 0.4rem; } #main .section3 table { width: 100%; font-size: .65rem; border: 1px solid #ff452c; border-top: 0; } #main .section3 thead tr { background: #ff452c; color: #ffffff; height: 2.2rem; } #main .section3 thead tr th, #main .section3 tbody tr td { border-right: 1px solid #d9d9d9; } #main .section3 thead tr th:nth-child(1) { width: 2rem; } #main .section3 thead tr th:nth-child(2) { width: 2rem; } #main .section3 thead tr th:nth-child(3) { width: 3.8rem; } #main .section3 tbody tr td { border-bottom: 1px solid #d9d9d9; text-align: left; padding: .3rem; font-size: .6rem; } #main .section3 .border_none { border-right: none; } #main .section3 tbody tr:last-child td { border-bottom: none; } #main .section3 tbody .bold { font-weight: 700; } #main .twochoice { display: flex; justify-content: space-between; margin-top: .6rem; } #main .twochoice .btn { width: 44%; } #main .section4 { width: 100%; padding: 0 .5rem 0; margin-top: .4rem; } #main .section4 .num { left: 0rem; } #main .section4 i { right: 3.1rem; height: 2.8rem; } #main .section4 ul { margin-top: .7rem; } #main .section4 li { display: flex; position: relative; justify-content: flex-end; } #main .section4 li span { width: 2rem; height: 3rem; background: url(/uploads/image/zcyimg/q.png) no-repeat; background-size: 100%; color: #ffffff; font-weight: 700; font-size: 0.8rem; box-sizing: border-box; padding-left: 0.4rem; padding-top: 0.2rem; position: absolute; left: 0rem; top: -0.3rem; z-index: 4; } #main .section4 li:nth-child(2) { margin-top: 0.8rem; } #main .section4 li:nth-child(2) span { width: 2rem; background: url(/uploads/image/zcyimg/a.png) no-repeat; background-size: 100%; } #main .section4 li p { border: solid 1px #8c8c8c; position: relative; word-break: break-all; word-wrap: break-word; width: 15rem; font-size: .6rem; padding: 0.4rem 0.6rem; padding-left: 1.8rem; box-sizing: border-box; } #main .section4 li p:after { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; border: solid 1px #ffef8f; } #main .section5 h1 { margin: 0 .5rem 0; } #main .section5 h1 .num { left: 1rem; } #main .section5 h1 i { right: 2.1rem; } #main .section5 .section_bg { background-color: #ffdd20; width: 100%; height: 3rem; } #main .section5 .container { padding: 0 .5rem 0; margin-top: -2.5rem; position: relative; } #main .section5 .section5-container { width: 15rem; } #main .section5 .container h3 { width: 93%; text-align: center; line-height: 1.6rem; padding: .3rem; border-bottom: 1px dashed #000000; margin-bottom: 0.7rem; } #main .section5 img{ position: absolute; top: 0; width: 15rem; z-index: 10; } #main .section5 .section5-wapper { width: 100%; } #main .section5 .slides { display: flex; flex-direction: column; align-items: center; position: relative; height: 19rem; z-index: 4; padding-bottom: .7rem; padding-top: 5rem; } #main .section5 .slides .slides_box{ width: 14rem; border: 1px solid #000000; border-top: none; display: flex; flex-direction: column; align-items: center; height: 14rem; } .swiper-button-next, .swiper-button-prev { top: 60%; } .swiper-button-next, .swiper-container-rtl .swiper-button-prev { background: url(/uploads/image/zcyimg/pre.png) no-repeat; background-size: 100%; transform: rotatey(180deg); right: 0.5rem; left: auto; } .swiper-button-prev, .swiper-container-rtl .swiper-button-prev { background: url(/uploads/image/zcyimg/pre.png) no-repeat; background-size: 100%; left: 0.5rem; right: auto; } /* #main .section5 .slides:after { content: ''; width: 100%; height: 100%; position: absolute; top: 1px; left: 0; border: solid 1px #ffef8f; border-top: none; } */ #main .section5 .slides ul { width: 93%; } #main .section5 .slides ul li { display: flex; font-size: .65rem; margin-bottom: .3rem; } #main .section5 .slides li span { font-weight: 700; width: 4.5rem; } #main .section5 .slides li p { width: 8.2rem; font-size: .6rem; } #main .section5 .slides li i { color: red; text-decoration: underline; } #main .section6 { margin-top: .4rem; } #main .section6 h1 .num { left: 1.6rem; } #main .section6 h1 i { right: 4rem; height: 2.7rem; } #main .section6 .tab { width: 100%; padding: 0 .5rem 0; display: flex; justify-content: space-between; align-items: center; text-align: center; font-size: .65rem; font-weight: 700; color: #ff452c; margin-bottom: .3rem; } #main .section6 .tab li { width: 31%; border: 2px solid #ff452c; padding: .2rem 0; } #main .section6 .tab li.active { background-color: #ff4520; color: #ffffff; } #main .section6 .tab_content { width: 15rem; margin: 0 .5rem 0; border: 1px solid #000000; position: relative; display: none } #main .section6 .tab_content.active { display: block; } #main .section6 .tab_content:after { content: ''; width: 100%; height: 100%; position: absolute; top: 1px; left: 0; border: solid 1px #ffef8f; border-top: none; } #main .section6 .tab_content .top { background: url(/uploads/image/zcyimg/326892198.png) no-repeat; background-size: 100%; color: #ffffff; height: 7rem; padding: 0.3rem 1rem 0.5rem; box-sizing: border-box; font-size: .65rem; } #main .section6 .top h2 { color: #ffdd20; margin-bottom: .3rem; } #main .section6 .top li { margin-bottom: .1rem; } #main .section6 .bottom_container { padding: .3rem 1rem 0.5rem; height: 12rem; } #main .section6 .bottom_box { width: 100%; } #main .section6 .star { color: #ff4520; margin: .5rem 0 0 1rem; } #main .section6 .bottom_item { font-size: .65rem; margin-bottom: .1rem; } #main .section6 .bottom_item p { color: #8c8c8c; } #main .section7 { width: 100%; margin-top: .4rem; background-color: #000000; height: 8.4rem; background: url(/uploads/image/zcyimg/307356397.png) no-repeat; background-size: 100%; padding: 0 .8rem; } #main .section7 h2 { width: 100%; text-align: center; font-size: .8rem; margin-bottom: .2rem; } #main .section7 form, #main .section10 form { width: 15rem; margin: .5rem auto; background-color: #ffffff; padding: .7rem .3rem .5rem; display: flex; flex-wrap: wrap; justify-content: space-between; } #main .section7 form { background: no-repeat; } #main .section10 form h3 { width: 100%; font-size: .7rem; text-align: center; margin-bottom: .3rem; } #main .section7 form .item, #main .section10 form .item { width: 48%; border: 1px solid #cac6c6; margin-top: .3rem; height: 1.5rem; } #main .section7 form .item { border: none; position: relative; } #main .section7 form .item input, #main .section10 form .item input, #main .section7 form .item select { width: 100%; font-size: .6rem; height: 100%; padding-left: .3rem; background-color: #ffffff; color: #b3b3b3; } #main .section7 form .item input::placeholder,#main .section10 form .item input::placeholder{ color: #b3b3b3; } #main .section7 form .item img { width: .5rem; position: absolute; top: 50%; right: .5rem; transform: translatey(-50%); } #main .section7 form .item.yzm, #main .section10 form .item.yzm { display: flex; } #main .section7 form .item.yzm input, #main .section10 form .item.yzm input { width: 55%; } #main .section7 form .item.yzm span, #main .section10 form .item.yzm span { width: 45%; height: 100%; line-height: 1.4rem; text-align: center; background-color: #302900; color: #ffffff; font-size: .6rem; } #main .section7 form .item.submit, #main .section10 form .item.submit { border: none; background-color: #ff452c; box-shadow: 0px 0px 20px 0px rgba(255, 69, 44, 0.5); text-align: center; line-height: 1.4rem; color: #ffffff; font-weight: 700; } #main .section8 { margin-top: .4rem; } #main .section8 h1 .num { left: .8rem; z-index: 2; } #main .section8 h1 i { right: 2.6rem; height: 2.7rem; } #main .section8 .section8_bg { /* background-color: #f4f4f3; */ height: 3rem; margin-top: -1.5rem; position: relative; } #main .section8 .sectinon8_container { margin: 0 .5rem 0; position: relative; margin-top: -1.5rem; } #main .section8 .sectinon8_container:after { content: ''; width: 100%; height: 100%; position: absolute; top: 1px; left: 0; border: solid 1px #ffef8f; border-top: none; } #main .section8 .sectinon8_container h2 { background-color: #fde541; line-height: 1.6rem; font-size: .65rem; padding-left: .7rem; border: 1px solid #fde541; } #main .section8 .sectinon8_container ul { border: solid 1px #000000; border-top: none; padding-left: .7rem; height: 10.4rem; position: relative; padding-top: .5rem; } #main .section8 .sectinon8_container li { display: flex; font-weight: 700; font-size: .65rem; margin-top: .3rem; } #main .section8 .sectinon8_container li:nth-child(1) { margin-top: 0; } #main .section8 .sectinon8_container li span { width: 4rem; } #main .section8 .sectinon8_container li p { font-weight: 400; font-size: .6rem; width: 9.7rem; } #main .section8 .sectinon8_container .zx { color: red; text-align: center; margin: .3rem 0; font-size: .6rem; position: absolute; bottom: .8rem; left: 50%; transform: translatex(-50%); } #main .section8 .section8_bg img { width: 1.7rem; position: absolute; top: 1.2rem; right: 1.2rem; z-index: 2; } #main .onechoice { width: 5rem; margin-top: .4rem; } #main .section9 { margin-top: .4rem; } #main .section9 h1 .num { left: 1.8rem; } #main .section9 h1 i { right: 3.5rem; height: 2.7rem; } #main .section9 .section9_box { width: 100%; display: flex; } #main .section9 .section9_box .left { width: 3.5rem; background-color: #ffdd20; padding-left: .5rem; padding-top: .5rem; } #main .section9 .left li, #main .section9 .right li { width: 100%; background-color: #302900; color: #ffdd20; font-weight: 700; padding: .3rem; text-align: center; height: 2.5rem; margin-bottom: .3rem; display: flex; justify-content: center; align-items: center; } #main .section9 .section9_box .right { width: 12.5rem; background-color: #f4f4f3; padding-right: .5rem; padding-top: .5rem; } #main .section9 .right li { background-color: #ffffff; color: #000000; text-align: left; font-size: .6rem; justify-content: flex-start; padding-left: .7rem; font-weight: 400; } #main .section10 { margin-top: .4rem; background-color: #f4f4f3; margin-bottom: .4rem; padding-bottom: .4rem; } #main .section10 h1 { background-color: #ffffff; } #main .section10 h1 .num { left: 2.4rem; } #main .section10 h1 i { right: 3.9rem; } #main .section10 ul { margin-top: .7rem; padding: 0 .5rem 0; height: 7rem; } #main .section10 .section10_bg { width: 100%; height: 4rem; background-color: #ffdd20; margin-top: -.8rem; } #main .section10 .seciton10_container { margin-top: -3.2rem; } #main .section10 li { display: flex; position: relative; justify-content: flex-end; } #main .section10 li span { width: 2rem; height: 1.6rem; background: url(/uploads/image/zcyimg/q.png) no-repeat; background-size: 100%; color: #ffffff; font-weight: 700; font-size: 0.8rem; box-sizing: border-box; padding-left: 0.4rem; padding-top: 0.2rem; position: absolute; left: 0rem; top: 50%; transform: translatey(-50%); z-index: 4; } #main .section10 li:nth-child(2):after { content: ''; display: block; position: absolute; width: 12.5rem; height: 1px; border-top: 1px dashed #cccccc; top: 0; left: 57%; transform: translatex(-50%); } #main .section10 li:nth-child(2) span { width: 2rem; background: url(/uploads/image/zcyimg/a.png) no-repeat; background-size: 100%; } #main .section10 li p { position: relative; word-break: break-all; word-wrap: break-word; width: 14.7rem; font-size: .6rem; margin-left: 0.9rem; background-color: #ffffff; padding: 0.4rem 1.3rem .4rem; } #main .section10 form textarea { width: 100%; border: 1px solid #cac6c6; color: #b3b3b3; font-size: .6rem; padding: .5rem 0 0 .5rem; } .layout { width: 100%; height: 100%; position: fixed; top: 0; left: 0; background-color: rgba(0, 0, 0, .8); z-index: 10; } .layout1 { display: none; } .layout2 { display: none; } .layout_box { width: 12rem; background: url(/uploads/image/zcyimg/layout1.png) no-repeat; background-size: 100%; height: 18.8rem; position: absolute; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); padding: 5.7rem .5rem 0; } .layout2 .layout_box { background: url(/uploads/image/zcyimg/layout2.png) no-repeat; background-size: 100%; } .layout_box form { width: 100%; } .layout_box form .item { width: 100%; position: relative; margin-bottom: .2rem; } .layout_box form .item input, .layout_box form .item select { border: 1px solid #d9d9d9; width: 100%; height: 1.5rem; font-size: .6rem; color: #b3b3b3; padding-left: .4rem; background-color: #ffffff; } .layout_box form .item input::placeholder { color: #b3b3b3; } .layout_box form .item img { width: .5rem !important; position: absolute; top: 50% !important; right: .5rem; transform: translatey(-50%); } .layout_box form .item.yzm { display: flex; justify-content: space-between; } .layout_box form .item.yzm input { width: 60%; } .layout_box form .item.yzm span { width: 40%; background-color: #fe3841; color: #ffffff; font-size: .6rem; line-height: 1.5rem; text-align: center; } .layout_box form .item.submit { width: 6rem; background-color: #000000; height: 2rem; margin: .8rem auto 0; opacity: 0; } .layout_box .close { width: 1.5rem; height: 1.5rem; background-color: #000000; position: absolute; top: 0; right: 0; opacity: 0; } .swiper-pagination-bullet-active { background: #ff452c; }