#main { width: 100%; font-size: 0.7rem; background-color: #76c1d4; box-sizing: border-box; padding: 2rem 0 2rem; box-sizing: border-box; } .title { font-size: 0.75rem; font-weight: 700; } .title i { color: #ff9b4e; } .title span { width: 1.5rem; height: 0.03rem; background-color: #000000; } .btn_box { margin-top: 1rem; } .btn { width: 6rem; height: 1.5rem; background-color: #ff9b4e; border-radius: 0.74rem; font-size: 0.65rem; color: #ffffff; } .intr { justify-content: flex-end; margin-bottom: 1rem; } .intr>div { width: 15.43rem; height: 7.63rem; background: url(/uploads/image/zupimg/intr_bg.png) no-repeat; background-size: 100%; padding-top: .55rem; padding-left: 1.13rem; padding-right: 1.13rem; } .intr h3 { font-size: 0.75rem; color: #000000; font-weight: 400; margin-bottom: .4rem; } .intr p { font-size: 0.6rem; line-height: 0.88rem; color: #333333; word-break: break-all; } .intr p span { color: #ff0000; } .how>div { width: 15rem; background: url(/uploads/image/zupimg/how.png) no-repeat; background-size: 100%; padding: .5rem .8rem .8rem; } .how ul { margin-top: .6rem; } .how li { font-size: 0.55rem; line-height: 1.25rem; letter-spacing: 0rem; color: #333333; border-bottom: 1px solid #e6e6e6; } .plan { width: 15.5rem; background: url(/uploads/image/zupimg/fa.png) no-repeat; background-size: 100%; margin: 1rem auto 1rem; padding: .8rem .63rem .8rem .5rem; } .plan .tab { height: 1.5rem; margin-top: .65rem; margin-bottom: .75rem; } .plan .tab span { width: 3.5rem; height: 1.5rem; border: solid 0.03rem #ff9b4e; font-size: 0.8rem; color: #000000; } .plan .tab span.active { background-color: #ff9b4e; } .plan table { display: none; } .plan table.active { display: block; } .plan thead { width: 14.5rem; height: 1.5rem; background-color: #76c1d4; font-size: 0.6rem; border: solid 0.03rem #76c1d4; } .plan thead th { width: 25%; } .plan tbody { font-size: 0.55rem; line-height: 0.75rem; color: #000000; } .plan td { border: solid 0.03rem #e5e5e5; padding: .3rem; } .plan p { font-size: 0.6rem; margin-top: .4rem; } .plan p span { text-decoration: underline; color: #ff0000; } .plan .btn_box { padding: 0 .6rem; margin-top: .5rem; } .form { width: 15.5rem; background: url(/uploads/image/zupimg/form_bg.png) no-repeat; background-size: 100%; margin: 1rem auto 1rem; padding: .8rem .63rem .8rem .5rem; } form { flex-wrap: wrap; margin-top: .7rem; padding: 0 .2rem; } form .item { width: 6.75rem; height: 1.53rem; margin-bottom: .23rem; } form .item input, .form form .item select { width: 100%; height: 1.53rem; background-color: #f2f2f2; font-size: 0.55rem; line-height: 1.53rem; color: #a1a1a1; padding-left: .43rem; } form .item select { background: #f2f2f2 url(/uploads/image/zupimg/arrow.png) no-repeat; background-size: 7%; background-position: 6rem center; } form .item input::placeholder { color: #a1a1a1; } form .item.yzm { width: 100%; } form .item.yzm span { width: 5.5rem; height: 1.5rem; background-color: #333333; flex-shrink: 0; font-size: 0.55rem; color: #ffffff; } form .btn { margin: 0.7rem auto 0; } .school { width: 15.5rem; background: url(/uploads/image/zupimg/school.png) no-repeat; background-size: 100%; margin: 1rem auto 1rem; padding: .8rem .63rem .8rem .5rem; } .school .title { padding: 0 .8rem; } .school .tab { margin-top: .7rem; margin-bottom: .4rem; } .school .tab span { width: 3.25rem; height: 3.25rem; background-color: #ffffff; border-radius: 3.25rem; font-size: 0.7rem; line-height: 0.88rem; color: #000000; } .school .tab span.active { background-color: #ff9b4e; } .school .detail>div { display: none; } .school .detail>div.active { display: block; } .school .img { width: 3.7rem; flex-shrink: 0; } .school .name { font-size: 0.7rem; margin-right: .3rem; } .school .eng { font-size: 0.55rem; } .school p { font-size: 0.6rem; line-height: 0.88rem; } .school .right>div { padding: .28rem 0; } .school .right>div:nth-child(1), .school .top { border-bottom: 1px solid #e6e6e6; } .school .btm p { padding: .28rem 0; } .school .btn_box { padding: 0 .6rem; margin-top: .5rem; } .dream { width: 15.5rem; background: url(/uploads/image/zupimg/dream.png) no-repeat; background-size: 100%; margin: 1rem auto 1rem; padding: .8rem .63rem .8rem .5rem; } .dream ul { flex-wrap: wrap; margin-top: .7rem; } .dream ul li { width: 4.65rem; height: 3rem; background-color: #ff9b4e; font-size: 0.6rem; line-height: 0.75rem; color: #000000; margin-bottom: .25rem; position: relative; } .dream ul li::after { content: '01'; width: 0.9rem; height: 0.9rem; border-radius: .9rem; background-color: #ffffff; text-align: center; line-height: .9rem; font-size: 0.5rem; position: absolute; top: 50%; transform: translatey(-50%); right: -.45rem; z-index: 2; font-weight: 700; } .dream ul li:nth-child(2)::after { content: '02'; } .dream ul li:nth-child(3)::after { content: '03'; top: auto; right: 50%; bottom: -.45rem; transform: translatex(50%); } .dream ul li:nth-child(4)::after { content: '05'; } .dream ul li:nth-child(5)::after { content: '04'; } .dream ul li:nth-child(6)::after { content: ''; display: none; } .dream ul li:nth-child(2n) { background-color: #76c1d4; } .dream .btn_box { padding: 0 .6rem; margin-top: .5rem; } .download { width: 15.5rem; background: url(/uploads/image/zupimg/download.png) no-repeat; background-size: 100%; margin: 1rem auto 1rem; padding: .8rem .63rem .8rem .5rem; } .download .top { margin-top: .4rem; } .download img { width: 4.5rem; flex-shrink: 0; margin-right: .05rem; } .download h3 { font-size: 0.7rem; margin-bottom: .4rem; } .download p { font-size: 0.6rem; line-height: 0.95rem; color: #333333; } .download form { margin-top: 0.4rem; } .download form .submit { margin-top: 0.3rem; } .recommend .title { color: #ffffff; padding: 0 4rem; } .recommend .title span { background-color: #ffffff; } .recommend ul { margin-top: .7rem; padding: 0 .75rem; } .recommend ul a { width: 7rem; flex-shrink: 0; } .question { width: 100%; background: #ffffff; margin: 1rem auto 1rem; padding: .8rem .63rem .8rem .5rem; } .question .title { padding: 0 1rem; } .question .item { width: 100%; align-items: flex-start; height: auto; } .question label { width: 100%; font-size: 0.6rem; font-weight: 700; } .question textarea { font-family: "microsoft yahei"; width: 11.25rem; height: 5rem; background-color: #f2f2f2; font-size: 0.55rem; line-height: .8rem; color: #a1a1a1; padding: .4rem; flex-shrink: 0; } /* layout */ #main .layout { width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.5); z-index: 20; display: none; } #main .layout .layout_box,#main .layout .ewm,#main .layout .layout_box2 { width: 13.75rem; height: 12.7rem; position: fixed; top: 47%; left: 50%; transform: translate3d(-50%, -50%, 0); background: url(/uploads/image/zupimg/layout.png) no-repeat; background-size: 100%; text-align: center; padding: .5rem .75rem; } #main .layout .title { margin-bottom: .3rem; font-size: 1rem; font-weight: normal; color: #681414; } #main .layout p{ font-size: 0.7rem; font-weight: normal; font-stretch: normal; line-height: 0.97rem; letter-spacing: 0rem; color: #681414; } #main .layout .layout_box form { margin-top: .5rem; } #main .layout .layout_box .item { width: 100%; position: relative; margin-bottom: 0.3rem; background-color: #ffffff; box-shadow: 0.06rem 0.11rem 0.75rem 0rem rgba(110, 110, 110, 0.35); height: 1.5rem; } #main .layout .layout_box .item.cannot { width: 49%; } #main .layout .layout_box .item img { position: absolute; top: 50%; transform: translatey(-50%); right: 0.4rem; width: 0.5rem; } #main .layout .layout_box .item.yzm{ width: 49%; } #main .layout .layout_box .item.yzm input { width: 60%; } #main .layout .item.yzm span { width: 50%; text-align: center; font-size: 0.5rem; background-color: #ffdb22; color: #000000; height: 100%; line-height: 1.5rem; cursor: pointer; } #main .layout .layout_box input, #main .layout .layout_box select { width: 100%; font-size: 0.55rem; padding-left: 0.3rem; background-color: #ffffff; height: 1.5rem; line-height: 1.5rem; color: #b3b3b3; } #main .layout .layout_box select{ background: #ffffff url(/uploads/image/zupimg/arrow.png) no-repeat; background-size: 7%; background-position: 93% center; } #main .layout .layout_box input::placeholder { color: #b3b3b3; } #main .layout .submit { width: 4.5rem; margin: 0.4rem auto 0; height: 1.75rem; background: url(/uploads/image/zupimg/btn.png) no-repeat; background-size: 100%; font-weight: 700; cursor: pointer; font-size: 0.7rem; line-height: 1.75rem; color: #572a0c; } #main .layout .close { width:1rem; height:1rem; position: absolute; top: -1.5rem; right: 0; cursor: pointer; } #main .layout input:-webkit-autofill { color: #b3b3b3; -webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important; } #main input:-webkit-autofill { color: #a1a1a1; -webkit-box-shadow: 0 0 0px 1000px #f2f2f2 inset !important; } #main .layout .ewm{ width: 7.5rem; height: 7.6rem; display: none; background: url(/uploads/image/zupimg/ewm_bg.png) no-repeat; background-size: 100%; } #main .layout .ewm p{ font-size: 0.6rem; margin-bottom: .4rem; } #main .layout img{ width: 4.9rem; } #main .layout .layout_box2{ height: 11.3rem; background: url(/uploads/image/zupimg/layout2.png) no-repeat; background-size: 100%; } #main .layout .layout_box2 .item{ width: 100%; background-color: #ffffff; box-shadow: 0.06rem 0.11rem 0.75rem 0rem rgba(110, 110, 110, 0.35); margin-bottom: .38rem; } #main .layout .layout_box2 input{ background-color: #ffffff; }