.part { margin-top: .7rem; padding: 0 .53rem; padding-bottom: .5rem; } .part>.title { font-size: 1.07rem; font-stretch: normal; line-height: 2.75rem; letter-spacing: 0rem; color: #ffffff; } .part>.title b { font-weight: normal; text-shadow: 0.05rem 0.09rem 0.23rem rgb(1 3 42); position: relative; } .part>.title b span { color: #ffc05d; } .part>.title b::before { content: ""; width: 2.4rem; height: 2.7rem; background: url(/uploads/image/hkttimg/tittle_1icon.png) no-repeat; background-size: 100%; position: absolute; left: -2rem; top: 0.2rem; } .part>.title b::after { content: ""; width: 2.1rem; height: 2.7rem; background: url(/uploads/image/hkttimg/tittle_2icon.png) no-repeat; background-size: 100%; position: absolute; right: -1.7rem; bottom: -0.55rem; } .part .tab_box { margin-top: .43rem; margin-bottom: .43rem; } .part .tab { width: 22%; height: 1.3rem; border: 1px solid #ffffff; font-size: .55rem; color: #ffffff; font-weight: 700; line-height: .5rem; text-align: center; } .part .tab.active { background-color: #ffffff; color: #2435b5; } .part>.sec_t { font-size: 0.6rem; line-height: 1rem; letter-spacing: 0rem; color: #dce0ff; margin-bottom: .6rem; } .part1 .top_gift>div { width: 7.28rem; height: 3.43rem; background: url(/uploads/image/hkttipart1/test.png) no-repeat; background-size: 100%; padding-left: .57rem; padding-top: .5rem; } .part1 .top_gift>div:nth-child(2) { width: 7.28rem; height: 3.43rem; background: url(/uploads/image/hkttipart1/free.png) no-repeat; background-size: 100%; } .part1 .top_gift b { font-size: 0.8rem; font-style: italic; color: #1658d6; } .part1 .top_gift>div:nth-child(2) b { color: #e27000; } .part1 .top_gift .btn { width: 3.23rem; height: 1rem; background-image: linear-gradient(0deg, #ffd200 0%, #f9e14c 100%, #84ad65 100%, #0f797e 100%); border-radius: 0.48rem; display: block; margin-top: .3rem; } .part1 .top_gift .btn a { font-size: 0.51rem; font-weight: 700; color: #e27000; width: 100%; height: 100%; } .part1 .item_box { margin-top: .43rem; } .part1 .item { display: none; } .part1 .item.active { display: block; } .part1 .item .top { width: 14.95rem; height: auto; background-color: #ffffff; padding: .8rem .3rem .65rem .5rem; align-items: flex-start; } .part1 .item .top img { width: 4.58rem; box-shadow: 0.05rem 0.09rem 0.43rem 0rem rgba(12, 4, 7, 0.1); flex-shrink: 0; margin-right: .5rem; } .part1 .item.tf .top { padding-left: .95rem; } .part1 .item.tf .top img { width: 3.73rem; margin-right: .8rem; } .part1 .item.sat .top { padding-left: .78rem; } .part1 .item.sat .top img { width: 3.9rem; margin-right: .8rem; } .part1 .item .top h4 { font-size: 0.6rem; color: #000000; margin-bottom: .2rem; } .part1 .item .top p { font-size: 0.5rem; color: #000000; } .part1 .item .top li { font-size: 0.5rem; line-height: 0.98rem; letter-spacing: -0.02rem; color: #333333; } .part1 .item .item_tab { margin-top: .6rem; } .part1 .item .i_tab { width: 2.8rem; height: 3rem; background-color: #ffffff; } .part1 .item .i_tab img { width: 60%; } .part1 .item .i_tab.active { background-color: #f3d9b1; position: relative; } .part1 .item .i_tab.active::after { content: ""; border: .3rem solid #f3d9b1; border-top-color: transparent; border-left-color: transparent; border-right-color: transparent; position: absolute; top: -0.5rem; left: 50%; transform: translatex(-50%); } .part1 .item .btn { width: 5.15rem; height: 1.38rem; background-color: #ff3f0b; border-radius: 0.67rem; font-size: 0.64rem; font-weight: 700; color: #ffffff; margin-top: .3rem; } .part1 .item.gre .top { margin-bottom: .18rem; } .part1 .item.gre .tags { margin-bottom: .3rem; } .part1 .item.gre span { width: 2.93rem; height: 1.1rem; background-color: #f9704d; border-radius: 0.52rem; border: solid 0.04rem #f9704d; font-size: 0.55rem; color: #ffffff; } .part1 .item.gre span:nth-child(2) { margin: 0 .15rem; } .part1 .item.gre .top:nth-child(1) .btn { margin: .3rem auto 0; } .part2 { padding: 0; } .part2 .tab_box, .part2 .item_box, .part2 .btn_box { padding: 0 .53rem; } .part2 .tit { width: 5.4rem; background-color: #fecc4f; color: #000000; font-size: 0.64rem; padding: 0 .3rem; text-align: center; padding-left: .3rem; } .part2 .tit span { font-size: .45rem; display: block; margin-top: .3rem; } .part2 td { padding: .4rem 0; font-size: 0.55rem; color: #ffffff; text-align: left; padding-left: .8rem; } .part2 .red { color: #ff3f0b; } .part2 .yellow { color: #fecc4f; } .part2 .item_box .item { display: none; margin-top: .8rem; } .part2 .item_box .item.active { display: block; } .part3 .item_box { margin-top: 1rem; } .part2 .btn_box { margin-top: .83rem; padding: 0 .63rem; } .part2 .btn { width: 6.43rem; height: 1.4rem; background-image: linear-gradient(0deg, #ffd200 0%, #f9e14c 100%, #84ad65 100%, #0f797e 100%); border-radius: 0.67rem; font-size: 0.64rem; font-weight: 700; color: #e27000; } .part3 .item { display: none; } .part3 .item.active { display: block; } .part3 .teac_detail { position: relative; } .part3 .gre .teac_detail:nth-child(2) { height: 10rem; } .part3 .teac_detail img { width: 10rem; position: relative; left: -.53rem; } .part3 .teac_detail .desc { position: absolute; top: 1.1rem; right: 0; width: 8.55rem; } .part3 .gre .teac_detail:nth-child(2) .desc { width: 11rem; right: auto; left: 0; position: relative; } .part3 .gre .teac_detail:nth-child(2) img { position: absolute; right: 0; left: auto; } .part3 .teac_detail .desc .name { font-size: 0.75rem; color: #fecc4f; font-weight: normal; align-items: flex-end; } .part3 .teac_detail .desc .name span { font-size: 0.55rem; color: #ffffff; margin-left: .7rem; } .part3 .gre .teac_detail .name span { margin-left: 0.3rem; font-size: 0.5rem; } .part3 .teac_detail .desc .post { font-size: 0.51rem; line-height: 0.8rem; color: #ffffff; margin: .5rem 0; } .part3 .teac_detail .point { width: 8.55rem; background-color: #ffffff; font-size: 0.51rem; line-height: 0.75rem; color: #333333; padding: 1.4rem .45rem .5rem; position: relative; } .part3 .teac_detail .point .icon { width: 3.23rem; height: 1.1rem; background: url(/uploads/image/hkttimg/point.png) no-repeat; background-size: 100%; position: absolute; top: .23rem; left: -0.25rem; font-size: 0.51rem; line-height: .85rem; color: #ffffff; padding-left: .7rem; } .part3 .item .teac_list { flex-wrap: wrap; } .part3 .item .teac_list li { width: 4.28rem; position: relative; } .part3 .item .teac_list2 li:nth-child(1) { margin-right: .85rem; } .part3 .item .teac_list li .name { width: 2.38rem; height: 1.08rem; background-color: #fecc4f; border-radius: 0.83rem 0rem 0.83rem 0rem; font-size: 0.51rem; font-weight: 700; color: #333333; position: absolute; right: -.38rem; bottom: .53rem; } .part3 .btn { width: 9.6rem; height: 1.38rem; background-image: linear-gradient(0deg, #ffd200 0%, #f9e14c 100%, #84ad65 100%, #0f797e 100%); border-radius: 0.67rem; font-size: 0.64rem; font-weight: 700; color: #e27000; margin: 0.85rem auto 0; } .part4 .item_box { margin-top: 1rem; } .part4 .item { display: none; } .part4 .item.active { display: block; } .part4 .ys { width: 12.55rem; } .part4 .tf { width: 13.93rem; } .part4 .sat, .part4 .gre { width: 100%; } .part4 .jc_text { width: 100%; height: 4.3rem; background: url(/uploads/image/hkttijc/jc_bg.png) no-repeat; background-size: 100%; margin-top: .88rem; font-size: 0.51rem; padding-left: 1.15rem; padding-top: .6rem; } .part4 .jc_text h4 { margin-bottom: .25rem; color: #000000; } .part4 .jc_text p { line-height: .8rem; color: #333333; } .part4 .jc_text p em { color: #ff3f0b; } /* 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 { width: 14.5rem; height: auto; position: fixed; top: 47%; left: 50%; transform: translate3d(-50%, -50%, 0); background-color: #6d7dff; border-radius: 0.3rem; text-align: center; padding-top: .65rem; padding: .65rem .38rem .33rem; display: block; } #main .layout .title { margin-bottom: .5rem; font-size: 1.05rem; color: #ffffff; } #main .layout .layout_box form { background-color: #ffffff; border-radius: 0.3rem; width: 100%; background-color: #ffffff; border-radius: 0.3rem; padding: 1rem 1rem .93rem; } #main .layout .layout_box .item { width: 100%; position: relative; margin-bottom: 0.5rem; box-shadow: 0rem 0rem 0.63rem 0rem rgba(109, 125, 255, 0.4); border-radius: 0.13rem; padding-left: .35rem; } #main .layout .layout_box .item img { position: absolute; top: 50%; transform: translatey(-50%); left: 0.55rem; height: 0.83rem; } #main .layout .layout_box input, #main .layout .layout_box select { width: 100%; padding-left: 0.3rem; background-color: #ffffff; font-size: 0.6rem; height: 1.85rem; line-height: 1.85rem; color: #b3b3b3; padding-left: .55rem; } #main .layout .layout_box .item.yzm span { width: 4rem; background-color: #2a51ef; flex-shrink: 0; height: 1.85rem; line-height: 1.85rem; color: #ffffff; font-size: 0.6rem; } #main .layout .layout_box input::placeholder { color: #b3b3b3; } #main .layout .layout_box .submit { width: 8.75rem; height: 2rem; margin: 0.8rem auto 0; background: #ff3f0b; background-size: 100%; box-shadow: 0px 5px 9px 1px rgba(195, 195, 195, 0.36); box-shadow: 0rem 0rem 0.63rem 0rem rgba(210, 210, 210, 0.5); border-radius: 1rem; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.08rem; color: #ffffff; border-radius: 0.99rem; } #main .layout .close { width: 1.35rem; height: 1.35rem; position: absolute; top: -1.8rem; right: 0; cursor: pointer; } #main input:-webkit-autofill { color: #b2b2b2; -webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important; } #main .link_box { width: 14.5rem; height: auto; position: fixed; top: 47%; left: 50%; transform: translate3d(-50%, -50%, 0); border: .2rem solid #6d7dff; background: #ffffff; border-radius: 0.3rem; padding: .3rem .6rem .5rem; display: none; } #main .layout .link_box .title { color: #000000; text-align: center; font-size: .9rem; } #main .link_box a { font-size: .6rem; color: #ff3f0b; text-decoration: underline; display: block; margin-top: .3rem; margin-bottom: .4rem; } #main .link_box p { font-size: .6rem; } #main .layout .link_box .close { right: -0.3rem; top: -2rem; } .mid_form { height: auto; background: #122292; padding: 0.6rem 0.5rem 0.2rem; margin-top: 1rem; } .mid_form h4 { color: #ffffff; font-size: 0.8rem; margin-bottom: 0.8rem; } .mid_form form { width: 100%; flex-wrap: wrap; height: auto; } .mid_form form .item { width: 48%; height: 1.5rem; background-color: #ffffff; position: relative; border-radius: 4px; margin-bottom: 0.5rem; } .mid_form form .item img { position: absolute; top: 50%; right: 15px; transform: translatey(-50%); } .mid_form form .item input, .mid_form form .item select { width: 100%; height: 1.5rem; line-height: 1.5rem; background: #ffffff; border-radius: 4px; padding-left: 0.3rem; font-size: 0.55rem; color: #999999; } .mid_form form .item input::placeholder { color: #999999; } .mid_form form .item select { background: #ffffff url(/uploads/image/hkttimg/form_arrow.png) no-repeat; background-size: 5%; background-position: 95% center; } .mid_form form .item.yzm input { width: 50%; } .mid_form form .item.yzm span { width: 50%; height: 1.5rem; line-height: 1.5rem; background: #fcda29; text-align: center; color: #000000; font-size: 0.55rem; cursor: pointer; } .mid_form form .btn { width: 45%; height: 1.5rem; background: #ff3f0b; border-radius: 0.74rem; line-height: 1.5rem; text-align: center; color: #ffffff; font-size: 0.65rem; cursor: pointer; font-weight: 700; margin-bottom: 0.5rem; }