锘? { margin: 0; padding: 0; } body { background: #ffece4; } a { text-decoration: none; } #main * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } #main { width: 100%; font-size: 0.7rem; background-color: #ffece4; box-sizing: border-box; box-sizing: border-box; } #main a { font-size: .6rem; } #main input, #main select, #main textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); outline: none; } #main i, #main em { font-style: normal; } input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px #f1f1f1 inset !important; } input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important; } table { width: 100%; text-align: center; /*鏂囨湰灞呬腑*/ border-collapse: collapse; /*琛ㄦ牸鐨勮竟妗嗗悎骞讹紝濡傛灉鐩搁偦锛屽垯鍏辩敤涓€涓竟妗?/ border-spacing: 0; /*璁剧疆琛屼笌鍗曞厓鏍艰竟妗嗙殑闂磋窛銆傚綋琛ㄦ牸杈规鐙珛锛堝嵆border-collapse:separate;锛夋灞炴€ф墠璧蜂綔鐢?/ } table td { word-break: break-all; /*鍏佽鍦ㄥ瓧鍐呮崲琛?鍗冲崟璇嶅彲鍒?/ word-wrap: break-word; /*鍏佽闀垮崟璇嶆垨url鍦板潃鎹㈣*/ border-right: 1px solid #939598; border-bottom: 1px solid #939598; } /* 婊氬姩妲?*/ ::-webkit-scrollbar { width: 6px; height: 6px; } ::-webkit-scrollbar-track { border-radius: 3px; background: rgba(0, 0, 0, 0.06); -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.08); } /* 婊氬姩鏉℃粦鍧?*/ ::-webkit-scrollbar-thumb { border-radius: 3px; background: rgba(0, 0, 0, 0.12); -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.2); } .dis_f { display: flex; align-items: center; justify-content: flex-start; } .dis_b { display: flex; align-items: center; justify-content: space-between; } .dis_c { display: flex; align-items: center; justify-content: center; } @font-face { font-family: 'avantibold'; src: ; } #main .banner { width: 100%; height: 12rem; background: url(/uploads/image/kiimages/banner.jpg) no-repeat; background-size: 100%; } section .title_h1 { height: 1.28rem; color: #6d0c0c; position: relative; margin: 0 auto; text-align: center; } section .title_h1 h1 { position: absolute; z-index: 2; height: 0.35rem; overflow: hidden; bottom: -0.1rem; line-height: 0.3rem !important; } section .title_h1 h1 b { position: relative; top: -13px; } section .title_h1 h1, section .title_h1 .cover, section .title_h1 .white { font-size: 1.25rem; line-height: 1.5rem; font-weight: 700; display: block; text-align: center; } section .title_h1 .cover { background-image: linear-gradient(0deg, #dd2f2f 5%, #ffe7c8 100%); -webkit-background-clip: text; color: transparent; position: absolute; top: 0; height: 1.05rem; z-index: 3; overflow: hidden; } section .title_h1 .white { color: #ffffff; position: absolute; top: 0px; z-index: 1; text-shadow: 0px 3px 5px rgba(168, 13, 13, 0.35); } article { width: 15rem; margin: 0 auto; } /* section1 */ .section1 { margin-top: .57rem; } .title_box { flex-direction: column; background: url(/uploads/image/kiimages/title_box_bg.png) no-repeat bottom; background-size: 100%; padding-bottom: .68rem; } .title_box .right { width: 13.73rem; } .title_box .left { flex-direction: column; } .title_box .left h1 { width: 12.8rem; } .title_box .send { width: 100%; font-size: 0.75rem; font-weight: 700; font-style: italic; line-height: 0.75rem; letter-spacing: 0.04rem; color: #ffcfc5; text-align: left; padding-left: .68rem; margin-bottom: .4rem; } .title_box .left .btn_box { flex-wrap: wrap; } .title_box .left .btn_box>div { width: 7.5rem; height: 1.9rem; background: url(/uploads/image/kiimages/btn_box_div.png) no-repeat; background-size: 100%; font-size: 0.63rem; line-height: 0.80rem; color: #ffffff; text-align: center; font-weight: 700; margin-top: .65rem; } .title_box .left .btn_box>div:last-child { margin-top: .2rem; } .title_box .left .btn_box>div a { color: #ffffff; width: 100%; height: 100%; } /* part */ .part article { width: 100%; height: 7.45rem; background-color: #dd2f2f; padding: .13rem; } .part article .content { width: 100%; height: 100%; background-color: #dd2f2f; border: solid 1px #ffe7c8; padding-left: .45rem; position: relative; padding-right: .1rem; } .part1 .content>img { height: 6.18rem; /* margin-left: -.8rem; */ flex-shrink: 0; margin-right: .3rem; } .part2 .content>img { height: 6.18rem; margin-left: 0; margin-right: .2rem; } .part3 .content>img { height: 6.18rem; margin-left: 0; margin-right: 0; } .part .content .words { margin-bottom: 0.7rem; } .part .content .words h2 { width: 4.55rem; font-size: .95rem; letter-spacing: 1.4px; color: #ffe7c8; text-align: center; margin-right: .25rem; margin-bottom: .14rem; } .part3 .content .words { position: relative; left: -.3rem; } .part3 .content .words h2 { width: 100%; } .part3 { margin-top: 1.25rem; } .part .content .words h1 { width: 4.93rem; font-size: 1.53rem; letter-spacing: 2.1px; color: #ffe7c8; } .part .content .title p { width: 4.5rem; height: 0.25rem; line-height: .25rem; } .part p.line2 { font-size: 0.5rem; letter-spacing: 0.01rem; color: #ffd1be; font-weight: normal; margin-bottom: .4rem; margin-top: .2rem; } .part p { font-size: 0.45rem; font-weight: 700; line-height: 0.88rem; color: #ffffff; } .part article .content .lead { position: absolute; right: 41px; top: 34px; } .section2 { padding: 1rem .38rem 0; margin-bottom: 1.23rem; } .section2 .totallist { margin-bottom: .9rem; flex-wrap: wrap; padding: 0 .63rem; } .section2 .totallist>div { width: 6.25rem; height: 6.25rem; box-shadow: 0rem 0rem 1rem 0rem rgba(255, 215, 198, 0.5); background: url(/uploads/image/kiimages/total_bg.png) no-repeat; background-size: 100%; border-radius: 6.25rem; overflow: hidden; padding-top: 2.3rem; } .section2 .totallist>div:nth-child(1), .section2 .totallist>div:nth-child(2) { margin-bottom: .8rem; } .section2 .totallist .num { font-family: 'avanti'; font-weight: 700; font-size: 1.5rem; height: 1.18rem; line-height: 1.18rem; color: #b3081a; text-align: center; position: relative; } .section2 .totallist .num em { font-weight: normal; font-size: 0.5rem; width: 0.88rem; height: 0.88rem; background-image: linear-gradient(60deg, #e6d192 0%, #ffffff 100%); border: solid 0.03rem #e3c6a5; opacity: 0.8; border-radius: 0.88rem; display: block; line-height: 0.88rem; position: absolute; top: -.25rem; right: 1.15rem; } .section2 .totallist p { text-align: center; margin-top: .3rem; font-size: 0.55rem; line-height: 0.75rem; color: #6d0c0c; } .section2 article>p { font-size: 0.55rem; line-height: 0.55rem; color: #c18b8b; margin-bottom: 1.4rem; text-align: center; } .section2 .tabbox { height: auto; background-color: #6d0c0c; padding: .5rem .38rem; } .section2 .tabbox>div { width: 4.5rem; height: 1.75rem; background-color: #ffdacb; border-radius: 0.1rem; font-size: 0.65rem; font-weight: 700; color: #6d0c0c; } .section2 .tabbox>div.active { background-color: #dd2f2f; color: #ffffff; } .section2 .tcontent { background-color: #dd2f2f; padding: .83rem .38rem .38rem; } .section2 .tcontent h3 { font-size: 0.88rem; line-height: 0.88rem; color: #ffd07d; } .section2 .tcontent h3 span { width: 5.18rem; height: 0.9rem; background-color: #e44848; border-radius: 0.44rem; font-size: 0.5rem; color: #fff8f2; font-weight: normal; margin-left: .28rem; } .section2 .tcontent>p { font-size: 0.5rem; line-height: 0.5rem; color: #fff8f2; margin: .45rem 0 .65rem; } .section2 .tcontent .table { overflow: scroll; position: relative; height: 10rem; } .section2 .container { width: 100%; height: 10rem; overflow: auto; } .section2 table { table-layout: fixed; border-collapse: separate; border-spacing: 0; } /* 琛ㄦ牸th/td鏍峰紡 */ .section2 td, .section2 th { box-sizing: border-box; border-right: 1px solid #dddddd; border-bottom: 1px solid #dddddd; /*瓒呭嚭闀垮害...*/ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; height: 1.5rem; } /* 琛ㄥご鍥哄畾 */ .section2 thead tr th { position: sticky; top: 0; background: #f4f4f5; height: 1.5rem; } /* 鏈€鍚庝竴鍒楀浐瀹?/ .section2 th:last-child, .section2 td:last-child { position: sticky; left: 0; text-align: center; right: 0px; width: 3rem; /* background: linear-gradient(0deg, #ffffff, transparent); */ } /* 琛ㄥご棣栧垪鍜屾渶鍚庝竴鍒楀己鍒舵渶椤跺眰 */ .section2 th:last-child { z-index: 3; /*宸︿笂瑙掑崟鍏冩牸z-index锛屽垏璁拌璁剧疆锛屼笉鐒惰〃鏍肩旱鍚戞í鍚戞粴鍔ㄦ椂浼氳璇ュ崟鍏冩牸鍙虫柟鎴栬€呬笅鏂圭殑鍗曞厓鏍奸伄鎸?/ background: #f4f4f5; } .section2 .tcontent thead { width: 100%; height: 1.5rem; padding-right: .38rem; font-size: .55rem; color: #990d00; align-items: stretch; } .section2 .tcontent thead th { border-right: 0.03rem solid #e5e5e5; height: 1.5rem; border-bottom: none !important; background-color: #edc695; } .section2 .tcontent thead td:last-child { border-right: none !important; } .section2 .tcontent .w1 { width: 3.6rem !important; flex-shrink: 0; } .section2 .tcontent .w2 { width: 3.1rem !important; flex-shrink: 0; } .section2 .tcontent .w3 { width: 6.5rem !important; flex-shrink: 0; } .section2 .tcontent .w4 { width: 4rem !important; flex-shrink: 0; } .section2 .tcontent .w5 { width: 5rem !important; flex-shrink: 0; } .section2 .tcontent .tbodybox { width: 100%; height: 7rem; overflow: hidden; overflow-y: auto; } /* 婊氬姩妲?*/ .section2 .container::-webkit-scrollbar { width: 0.38rem; } .section2 .container::-webkit-scrollbar-track { border-radius: 0; background: #ab2424; } /* 婊氬姩鏉℃粦鍧?*/ .section2 .container::-webkit-scrollbar-thumb { border-radius: 0; background: #edc695; } .section2 .tcontent tbody tr { height: 1.5rem; background-color: #f2f2f2; align-items: stretch; } .section2 .tcontent tbody td { border-right: 1px solid #e5e5e5; font-size: .45rem; color: #000000; padding: 0 .2rem; } .section2 .tcontent tbody td:last-child { border-right: none; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .section2 .tcontent tbody>tr:nth-child(2n) { background: #ffffff; } .section2 .tcontent tbody td .getleyu { width: 2.3rem; height: 1rem; background-color: #ffffff; border: solid 0.03rem #e5e5e5; font-size: 0.45rem; line-height: 0.75rem; letter-spacing: 0rem; color: #999999; margin: 0 auto; } .section2 .content2 { margin-top: 1rem; align-items: stretch; } .section2 .content2 .btop { width: 31%; height: 4.6rem; text-align: center; background: #ffffff; position: relative; padding-top: 0.8rem; border-radius: .45rem; z-index: 1; } .section2 .content2 .btop::before { content: ""; width: 94%; height: 1.8rem; background: url(/uploads/image/kiimages/tabbg.png) no-repeat; background-size: 100% 100%; position: absolute; border-radius: .45rem; top: .2rem; left: 50%; transform: translatex(-50%); z-index: -1; } .section2 .content2 .btop.active { background: #dd2f2f; color: #ffffff; } .section2 .content2 .btop img { width: 70%; } .section2 .content2 .btop:nth-child(1) { padding-top: .5rem; } .section2 .content2 .btop:nth-child(3) { padding-top: .7rem; } .section2 .content2 .btop:nth-child(1) img { width: 50%; } .section2 .content2 .btop:nth-child(3) img { width: 50%; } .section2 .content2 .btop p { font-size: .5rem; position: absolute; bottom: .3rem; width: 100%; left: 0; line-height: .7rem; height: 1.4rem; padding: 0 .2rem; } /* section3 */ .section3 { margin-top: 0.85rem; } .section3 .title_h1 { margin-bottom: .75rem; } .section3 ul li { width: 100%; height: auto; padding: .55rem 0 .35rem; background-color: #ffffff; padding-left: .6rem; padding-right: .5rem; margin-bottom: .5rem; border-bottom: .1rem solid #ffe7c8; position: relative; } .section3 ul li::after { content: ''; width: 100%; height: .1rem; background: #dd2f2f; position: absolute; bottom: -.2rem; left: 0; } .section3 ul li .left { flex-direction: column; } .section3 ul li .num { color: #ffffff; position: relative; align-items: baseline; } .section3 ul li .num span { width: 2.5rem; height: 1.18rem; line-height: 1.18rem; font-size: 1.5rem; color: #b3081a; font-family: "avanti"; font-weight: 700; letter-spacing: -.08rem; } .section3 ul li .num i { width: 0.8rem; height: 0.8rem; font-size: 0.5rem; background-color: #dd2f2f; border-radius: 32px; position: absolute; top: -.15rem; left: 2.3rem; color: #ffffff; opacity: .8; } .section3 ul li h2 { text-align: center; font-size: 0.65rem; color: #6d0c0c; height: 0.65rem; line-height: .65rem; } .section3 ul li:last-child h2 { font-size: 0.65rem; text-align: left; } .section3 ul li p { width: 6.55rem; font-size: 0.55rem; line-height: 0.75rem; color: #6d0c0c; margin-top: .48rem; } .section3 ul li .btn { width: 6.25rem; height: 1.5rem; background-color: #dd2f2f; font-size: 0.65rem; border-radius: 0.74rem; text-align: center; color: #ffffff; font-weight: 700; line-height: 1.5rem; } /* section4 */ .section4 { margin-top: 1.25rem; } .section4 .content { margin-top: .75rem; } .section4 .left { width: 100%; height: 8.5rem; background-color: #ffffff; padding: 0 .38rem; } .section4 .left h2 { text-align: center; font-size: 0.6rem; padding-top: 0.7rem; margin-bottom: .65rem; } .section4 .left img { width: 100%; } .section4 .right { width: 100%; height: 10rem; background-color: #dd2f2f; padding: .75rem .75rem 0; } .section4 .right .top { border-bottom: 1px solid rgba(255, 236, 228, 0.3); padding-bottom: .25rem; margin-bottom: .48rem; } .section4 .right .top>div { height: 1.15rem; margin-bottom: .25rem; } .section4 .right .top span { width: 1.15rem; height: 1.15rem; background-color: #6d0c0c; font-size: 0.75rem; color: #ffffff; text-align: center; line-height: 1.15rem; margin-right: .28rem; } .section4 .right .top b { font-size: 0.6rem; line-height: 1.15rem; color: #ffffff; } .section4 .right li { font-size: 0.6rem; line-height: .88rem; color: #ffffff; list-style: inside; } .section4 .right .btn_box { margin-top: .85rem; } .section4 .right .btn_box>div { width: 6.25rem; height: 1.5rem; background-color: #ffe7c8; border-radius: .74rem; font-size: 0.65rem; font-weight: 700; line-height: 1.5rem; color: #6d0c0c; text-align: center; cursor: pointer; } .section4 .right .btn_box>div:last-child { background-color: #6d0c0c; color: #ffffff; margin-left: .75rem; } /* section5 */ .section5 { margin-top: 1.23rem; padding-bottom: .75rem; position: relative; z-index: 1; } .section5 article { width: 15.5rem; } .section5 article>p, .section6 article>p, .section7 article>p { font-size: 0.6rem; font-weight: 700; line-height: 26px; color: #6d0c0c; text-align: center; margin: .2rem 0 .4rem; } .section5 .img { text-align: center; padding: 0 .25rem; } .section5 .btn_box { margin-top: .75rem; } .section5 .btn { width: 12rem; height: 1.7rem; background-color: #dd2f2f; border-radius: 24.5px; font-size: .7rem; font-weight: 700; line-height: 1.7rem; color: #ffffff; text-align: center; margin: 0 auto; } .section5 .btn a { width: 100%; height: 100%; color: #ffffff; font-size: .7rem !important; } .section5 .btn:last-child { margin-top: .5rem; } .section5 .cover { width: 100%; height: 9.88rem; background-color: #ffd4ca; position: absolute; bottom: 0; left: 0; z-index: -1; } /* .section6 */ .section6 { margin-top: 1.25rem; } .section6 .content { height: 405px; background-color: #ffffff; padding-left: 50px; } .section6 .content>.title { width: 45px; height: 150px; background-color: #dd2f2f; border-radius: 22px; font-size: 20px; color: #ffffff; writing-mode: vertical-lr; margin-right: 50px; } .section6 .content .intr { width: 302px; height: 362px; background: url(/uploads/image/kiimages/intr1.png) no-repeat; position: relative; } .section6 .content .intr2 { background: url(/uploads/image/kiimages/intr2.png) no-repeat; margin-left: 200px; } .section6 .content .line1 { position: absolute; top: 15px; right: -170px; } .section6 .content .line2 { position: relative; top: 195px; right: -158px; } /* .section7 */ .section7 { margin-top: 1.25rem; } .online_form { height: auto; background: #6d0c0c; padding: .75rem .5rem; } .online_form form { width: 100%; flex-wrap: wrap; height: auto; } .online_form form .item { width: 48%; height: 1.5rem; background-color: #ffffff; position: relative; border-radius: 4px; margin-bottom: .5rem; } .online_form form .item img { position: absolute; top: 50%; right: 15px; transform: translatey(-50%); } .online_form form .item input, .online_form form .item select { width: 100%; height: 1.5rem; line-height: 1.5rem; background: #ffffff; border-radius: 4px; padding-left: .3rem; font-size: 0.55rem; color: #999999; } .online_form form .item input::placeholder { color: #999999; } .online_form form .item.yzm input { width: 60%; } .online_form form .item.yzm span { width: 40%; height: 1.5rem; line-height: 1.5rem; background: #dd2f2f; text-align: center; color: #ffffff; font-size: 0.55rem; cursor: pointer; } .online_form form .btn { width: 5rem; height: 1.5rem; background-color: #dd2f2f; border-radius: 0.74rem; line-height: 1.5rem; text-align: center; color: #ffffff; font-size: 0.65rem; cursor: pointer; font-weight: 700; margin: .25rem auto 0; } .online_form form textarea { width: 100%; height: 80px; padding: 10px 0 0 10px; font-size: 16px; font-family: "microsoft yahei"; color: #8f8e8e; } /* .part2 */ .part1 { margin-top: 1.25rem; } .part2 .content .title { flex-direction: column; align-items: flex-start; margin-bottom: .6rem; } .part2 .content .words { margin-bottom: 0; } .part2 .content .words h3 { text-align: left; font-size: 0.8rem; font-weight: normal; color: #ffe7c8; } .part2 .content .words h2 { font-size: 0.7rem; width: auto; align-items: flex-end; } .part2 .content .words h2 span { margin-left: .23rem; font-size: 0.55rem; font-weight: normal; } .part p { font-size: .55rem; font-weight: normal; } .part2 p { align-items: flex-start; } .part p>span { width: 6px; height: 6px; background-color: #6d0c0c; border-radius: 6px; margin-right: 8px; } .part2 p span { position: relative; top: .4rem; } /* section8 */ .section8 { margin-top: 1.23rem; } .section8 article { width: 100%; } .section8 .content { margin-top: .83rem; } .section8 .content .detail .left { width: 100%; height: 8.25rem; background-color: #ffd4ca; padding-top: .3rem; position: relative; background: url(/uploads/image/kiimages/tv.png) no-repeat; background-size: 100%; } .section8 .content .detail .left .btn { width: 4.5rem; position: absolute; top: 5.4rem; right: 3.2rem; } .section8 .content .detail .right h2 { font-size: 0.75rem; color: #6d0c0c; text-align: center; } .section8 .content .detail .right { background-color: #ffffff; padding-bottom: .8rem; } .section8 .content .detail .right ul { width: 15rem; margin: 0 auto; padding: .45rem 0 .45rem .63rem; flex-wrap: wrap; align-items: flex-start; } .section8 .content .detail .right li b { font-size: .7rem; margin-bottom: .2rem; } .section8 .content .detail .right li span { width: 0.4rem; height: .4rem; background-color: #ef5e52; border-radius: 24px; font-size: 0.45rem; color: #ffffff; margin-right: .28rem; } .section8 .content .detail .right li { font-size: 0.6rem; color: #6d0c0c; width: 50%; } .section8 .content .detail .right li:last-child { width: 100%; } .section8 .content .detail .right li p { color: #666666; font-size: .5rem; padding-left: .6rem; line-height: .75rem; } .section8 .content .detail .right .btn_box { width: 15rem; margin: 0 auto; flex-direction: column; } .section8 .content .detail .right .btn { width: 7.5rem; padding: 0 19px; height: 1.5rem; background-color: #dd2f2f; border-radius: 19.5px; text-align: center; color: #ffffff; font-weight: 700; line-height: 1.5rem; font-size: 0.6rem; margin: .3rem auto 0; } .section8 .content .detail .right .btn a { color: #ffffff; } .section8 .content .detail .right .btn:last-child { margin-top: .3rem; } /* .section9 */ .section9 { margin-top: 1.25rem; } .section9 .content { flex-wrap: wrap; } .section9 ul { width: 100%; margin-top: .8rem; } .section9 li .q span { width: 1.25rem; height: 1.25rem; background: url(/uploads/image/kiimages/q.png) no-repeat; background-size: 100%; font-size: 0.65rem; font-weight: 700; text-align: center; color: #ffffff; margin-right: .38rem; } .section9 li .q { font-size: 0.65rem; font-weight: 700; line-height: 1.25rem; color: #dd2f2f; margin-bottom: .3rem; margin-top: .75rem; } .section9 li:first-child .q { margin-top: 0; } .section9 li .a { width: 100%; background-color: #6d0c0c; padding: .8rem 0 .8rem .7rem; font-size: 0.6rem; line-height: 0.88rem; color: #ffffff; position: relative; } .section9 li .a span { width: 1.25rem; height: 1.25rem; background: url(/uploads/image/kiimages/a.png) no-repeat; background-size: 100%; display: block; position: absolute; font-size: 0.65rem; text-align: center; font-weight: 700; line-height: 1.25rem; color: #6d0c0c; top: 12px; right: 15px; } .section9 li .a>div { width: 12rem; } .section9 .btn_box { width: 100%; margin-top: .75rem; } .section9 .btn_box>div { width: 7.5rem; height: 1.5rem; background-color: #dd2f2f; border-radius: 0.74rem; font-size: 0.6rem; font-weight: 700; line-height: 1.5rem; color: #ffffff; text-align: center; cursor: pointer; position: relative; top: 0; transition: all .3s; } .section9 .btn_box>div:last-child { margin-left: .5rem; } /* .section10 */ .section10 { margin-top: 1.25rem; width: 100%; background: url(/uploads/image/kiimages/section10_bg.png) no-repeat center; background-size: 100%; padding-bottom: 1.5rem; padding-top: .8rem; } .section10 .top { margin-bottom: 12px; position: relative; height: 8.68rem; } .section10 .top>img { width: 8.55rem; position: absolute; left: -1.8rem; } .section10 .top .right { flex-direction: column; align-items: flex-end; position: absolute; right: .38rem; } .section10 .top .right h3 { width: 6rem; height: 1.18rem; background-image: linear-gradient(-44deg, #ffd3a5 0%, #ffddb8 100%), linear-gradient(#ffd3a4, #ffd3a4); background-blend-mode: normal, normal; border-radius: 0.57rem; font-size: 0.7rem; font-weight: normal; line-height: 1.18rem; color: #8e0e0e; text-align: center; } .section10 .top .right .title { width: 7.83rem; margin: .53rem 0 .33rem; } .section10 .top .right h2 { font-size: 1rem; color: #ffd7ac; height: 0.95rem; ; align-items: flex-end; } .section10 .top .right b { height: 0.95rem; line-height: 0.65rem; } .section10 .top .right h2 span { font-size: 0.6rem; margin-left: 5px; } .section10 .top .right li { width: 3rem; height: 1.13rem; border: solid 1px #ffffff; font-size: 0.6rem; line-height: 1.13rem; color: #fff0e1; margin-left: .25rem; } .section10 .top .right ul { width: 6.5rem; margin-top: .55rem; flex-wrap: wrap; justify-content: flex-end; } .section10 .top .right li:nth-child(3) { width: 4rem; margin-top: .25rem; } .section10 .top .right p { font-size: 0.65rem; color: #fff0e1; margin-top: .35rem; } /* section11 */ .section11 { margin-top: 30px; } .section11 .top { background-color: #ffffff; padding: .4rem .5rem .65rem .65rem; border-bottom: .13rem solid #ffe7c8; position: relative; margin-bottom: .5rem; } .section11 .top::after { content: ''; width: 100%; height: .13rem; background: #dd2f2f; position: absolute; bottom: 0rem; left: 0; } .section11 .top_title { flex-shrink: 0; } .section11 .top_title h2 { font-size: 0.75rem; position: relative; z-index: 1; flex-shrink: 0; } .section11 .top_title h2.one::after { content: ''; width: 42px; height: 42px; border-radius: 42px; background-image: linear-gradient(60deg, #ffece4 0%, #ffffff 100%); position: absolute; left: -10px; bottom: -3px; z-index: -1; } .section11 .top_title b { color: #dd2f2f; } .section11 .topleft { width: 10rem; font-size: 0.5rem; color: #fbd966; } .section11 .topleft>div { width: 10rem; height: 2.13rem; background-color: #6d0c0c; flex-direction: column; padding-left: .43rem; align-items: flex-start; position: relative; } .section11 .topleft>div:nth-child(2) { margin-top: .25rem; } .section11 .topleft>div:after, .section11 .topleft>div:before { content: ''; border: 0.2rem solid #ffffff; position: absolute; } .section11 .topleft>div:before { top: 0; left: 0; border-bottom-color: #6d0c0c; border-right-color: #6d0c0c; } .section11 .topleft>div:after { bottom: 0; right: 0; border-top-color: #6d0c0c; border-left-color: #6d0c0c; } .section11 .topleft>div span { width: 100%; font-size: 0.55rem; color: #ffffff; margin-top: 5px; } .section11 #scrollinglist { font-size: .5rem; background: #ffece4; padding: 5px; margin-top: .6rem; height: 241px; overflow: hidden; } .section11 #scrollinglist ul{ position: relative; top: 0; } .section11 #scrollinglist li{ height: 50px; line-height: .8rem; background: #fff7f4; margin-bottom: .2rem; padding: .2rem .4rem; border-radius: 100px; transition: all .3s; } .section11 #scrollinglist li span{ display: contents; } .section11 #scrollinglist li:nth-child(1){ background: #dd2f2f; color: #ffffff; font-size: .55rem; font-weight: bold; border-bottom-left-radius: 0; height: 60px; transition: all .2s; } .section11 #scrollinglist li:nth-child(1) span{ color: #fbd966; font-size: .6rem; transition: all .2s; } .section11 .content { margin-top: 1rem; } .section11 .content h3 { font-size: 0.75rem; text-align: center; color: #333333; } .section11 .content h3 b { color: #dd3131; } .section11 .content p { font-size: .55rem; letter-spacing: -0.8px; color: #333333; text-align: center; margin-top: .4rem; margin-bottom: .4rem; } .section11 .content>div { width: 100%; margin-bottom: .8rem; } .section11 .content>div .con_box { height: 8.4rem; background: #ffe7c8 url(/uploads/image/kiimages/listen.png) no-repeat; background-size: 100%; padding-left: .5rem; padding-top: .5rem; display: block; } .section11 .content>div:nth-child(2) .con_box { background: #ffe7c8 url(/uploads/image/kiimages/read.png) no-repeat; background-size: 100%; } .section11 .content>div:nth-child(3) .con_box { background: #ffe7c8 url(/uploads/image/kiimages/write.png) no-repeat; background-size: 100%; } .section11 .content>div:nth-child(4) .con_box { background: #ffe7c8 url(/uploads/image/kiimages/speak.png) no-repeat; background-size: 100%; } .section11 .content .spans span { width: auto; height: 1rem; background-color: #f7c860; border-radius: 0.49rem; font-size: 0.45rem; color: #000000; line-height: 1rem; text-align: center; padding: 0 10px; } .section11 .content>div:nth-child(1) .spans span:nth-child(2) { margin-left: 5rem; } .section11 .content>div:nth-child(3) .spans span:nth-child(2) { margin-left: 5.8rem; } .section11 .content .btn_box { flex-direction: column; height: 3.5rem; background-color: #dd3131; padding-top: .3rem; } .section11 .content .btn_box span { cursor: pointer; font-weight: 700; width: 7.5rem; height: 1.5rem; background-color: #f7c860; border-radius: 0.74rem; flex-shrink: 0; margin-bottom: .3rem; } .section11 .content .btn_box span a { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; color: #333333; font-size: 0.6rem; } .section11 .content .btn_box i { font-size: .55rem; color: #ffffff; } .section12 { margin-top: 0.85rem; } .section12 .content { margin-top: .8rem; } .section12 .tabbox { padding: .25rem 0.38rem 0; background: #6d0c0c; margin-bottom: .75rem; } .section12 .tabbox>div { width: 5rem; height: 1.5rem; background-color: #ffdacb; border-radius: 0.25rem 0.25rem 0rem 0rem; font-size: 0.7rem; font-family: "avanti"; font-weight: bold; color: #6d0c0c; } .section12 .tabbox>div.active { background-color: #dd2f2f; color: #ffffff; } .section12 .tcontent { padding: 0 .38rem; } .section12 .tcontent>div { display: none; } .section12 .tcontent>div.active { display: block; } .section12 .tcontent>div>div { align-items: stretch; } .section12 .tcontent>div>div>div { width: 50%; background-color: #dd2f2f; color: #ffffff; padding-top: .4rem; padding-bottom: .4rem; } .section12 .tcontent>div .w { background: #ffffff; color: #dd2f2f; } .section12 .tcontent>div .w p { color: #6d0c0c; } .section12 .tcontent .skills1>div { width: 5rem; flex-shrink: 0; } .section12 .tcontent>div h3 { font-size: 0.7rem; font-weight: normal; line-height: 0.88rem; text-align: center; height: 1.76rem; margin-bottom: .3rem; } .section12 .tcontent>div p { font-size: 0.5rem; line-height: 0.65rem; padding: 0 .2rem; } .section12 .tcontent>div>p { font-size: 0.4rem; line-height: 0.7rem; color: #6d0c0c; margin-top: .3rem; } .section12 .btn_box { width: 100%; margin-top: .75rem; } .section12 .btn_box>div { width: 7.5rem; height: 1.5rem; background-color: #dd2f2f; border-radius: 0.74rem; font-size: 0.6rem; font-weight: 700; line-height: 1.5rem; color: #ffffff; text-align: center; cursor: pointer; position: relative; top: 0; transition: all .3s; } .section12 .btn_box>div:last-child { margin-left: .5rem; } .download_form { width: 100%; height: auto; background-color: #ffffff; padding: .63rem .63rem .63rem .75rem; } .download_form .item { width: 100%; height: 1.75rem; background-color: #f0f0f0; position: relative; margin-bottom: .25rem; } .download_form .item img { position: absolute; top: 50%; right: 10px; transform: translatey(-50%); } .download_form .item input, .download_form .item select { width: 100%; height: 1.75rem; background-color: #f0f0f0; line-height: 1.75rem; font-size: 0.6rem; color: #b3b3b3; padding-left: .5rem; } .download_form .item input::placeholder { color: #b3b3b3; } .download_form .item.yzm input { width: 100%; } .download_form .item.yzm span { width: 5rem; height: 1.75rem; background-color: #dd2f2f; font-size: 0.6rem; line-height: 1.75rem; color: #ffffff; text-align: center; cursor: pointer; } .download_form .btn { width: 7.5rem; height: 1.5rem; background-color: #dd2f2f; border-radius: 0.74rem; font-size: 0.65rem; font-weight: 700; line-height: 1.5rem; color: #ffffff; text-align: center; margin: .5rem auto 0; } /* layout */ .layout { width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.3); z-index: 99; display: none; } .layout .layout_form, .layout .layout_link { width: 12.5rem; height: 13rem; background: url(/uploads/image/kiimages/layout.png) no-repeat; background-size: 100%; position: absolute; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); padding: .75rem .6rem 0; display: none; } .layout .layout_form h2, .layout .layout_form h3 { font-size: 1rem; color: #000000; font-weight: 700; text-align: center; } .layout .layout_form h3 { font-size: 0.75rem; margin-top: 4px; margin-bottom: .8rem; } .layout .layout_form form { flex-wrap: wrap; } .layout .layout_form .item { width: 100%; height: 1.5rem; background-color: #ffffff; box-shadow: 0.06rem 0.11rem 0.75rem 0rem rgba(110, 110, 110, 0.35); position: relative; margin-bottom: .25rem; } .layout .layout_form .item img { position: absolute; top: 50%; transform: translatey(-50%); left: 10px; width: .9rem; } .layout .layout_form .item img:nth-child(3) { left: auto; right: 15px; width: .5rem; } .layout .layout_form .item input, .layout .layout_form .item select { background-color: #ffffff; height: 1.5rem; line-height: 1.5rem; width: 100%; font-size: 14px; color: rgba(48, 48, 48, .5); padding-left: 1.7rem; } .layout .layout_form .item input::placeholder { color: rgba(48, 48, 48, .5); } .layout .layout_form .item.yzm input { padding-left: .4rem; width: 100%; } .layout .layout_form .item.yzm span { width: 4.5rem; height: 1.5rem; line-height: 1.5rem; font-size: 14px; color: #000000; text-align: center; background-color: #f1ec24; cursor: pointer; } .layout .layout_form .btn { width: 4.5rem; height: 1.75rem; background: url(/uploads/image/kiimages/form_btn.png) no-repeat; background-size: 100%; font-size: 25px; font-weight: 700; line-height: 1.75rem; text-align: center; margin: 0.3rem auto 0; font-size: 0.7rem; color: #2f0404; } .layout .layout_link { height: auto; background: url(/uploads/image/kiimages/download.png) no-repeat; background-size: 100% 100%; padding: .6rem 1rem .6rem .8rem; } .layout .layout_link a { font-family: arial_mt; text-decoration: underline; font-size: 14px; line-height: 20px; color: #1c92ff; word-break: break-all; display: block; margin-top: .3rem; } .layout .layout_link p { font-size: .6rem; line-height: 20px; color: #000000; margin-top: 10px; } .layout .layout_link p .code { color: #f10000; } .layout .layout_form .close { width: 1.25rem; height: 1.25rem; background: url(/uploads/image/kiimages/close.png) no-repeat; background-size: 100%; position: absolute; top: -1.55rem; right: 0; } .layout .close { width: 50px; height: 50px; position: absolute; top: 0; right: 0; cursor: pointer; }