.apply-record { width: 100%; float: left; } .apply-record_tab { float: left; width: 1200px; margin-left: calc((100% - 1200px)/2); border-bottom: 1px solid #e5e5e5; } .apply-record .tab { float: right; } .apply-record .tab .tab-item { float: left; margin-left: 70px; padding-top: 44px; padding-bottom: 22px; border-bottom: 4px solid #fff; font-size: 18px; color: #303030; text-align: center; } .apply-record .tab .tab-item.active { font-weight: bold; border-bottom: 4px solid #d10000; } .products .mainCont { display: none; width: 1200px; margin-left: calc((100% - 1200px)/2); padding: 40px 0; float: left; } .products .mainCont.selected { display: block; } #tabnav { width: 290px; float: left; } #tabnav li { height: 70px; line-height: 70px; list-style: none; background-color: #e8e8e8; margin-bottom: 15px; text-align: center; font-size: 16px; float: left; color: #272727; width: 290px; } #tabnav li a { display: inline-block; width: 290px; height: 70px; float: left; } #tabnav li.active { background: #8f8f8f; color: #fff; } #tab_content { float: right; width: calc(100% - 310px); } #tab_content .content { width: 100%; float: left; display: none; } #tab_content .content:nth-child(1) { display: block; } .post_list { width: 100%; float: left; margin-top: 20px; padding: 14px 30px; background-color: #f9f9f8; } .post_list:nth-child(1) { margin-top: 0; } .post_list_top { width: 100%; float: left; } .post_list_top_left { width: calc(100% - 140px); float: left; font-size: 16px; height: 30px; line-height: 30px; color: #000000; } .post_list_top_left span { float: left; } .post_list_top_left img { width: 22px; margin-top: calc((30px - 22px)/2); margin-left: 15px; height: 22px; float: left; } .post_list_top_right { width: 120px; text-align: right; color: red; float: right; } .post_list_bottom { width: 100%; float: left; color: #aeaeae; margin-top: 22px; font-size: 16px; } .post_list_bottom span { display: inline-block; float: left; width: 48%; } .post_list_bottom span:nth-child(2) { float: right; text-align: right; } .v_out { width: 1080px; overflow: hidden; height: 505px; float: left; margin-left: calc((100% - 1080px)/2); } .jinji_right { width: 744px; height: 434px; margin-top: calc((505px - 434px)/2); float: right; } .v_show { width: 744px; height: 434px; overflow: hidden; position: relative; float: left } .v_cont { width: 6650px; position: absolute; left: 0px; top: 0px; } .v_cont ul { float: left; } .v_cont ul li { width: 744px; height: 434px; float: left; } .v_cont ul li img { width: 744px; height: 434px; float: left; } /*---圆圈---*/ .v_out_p { position: relative; overflow: visible } .jinji_left { width: 266px; float: left; height: 434px; } .circle { width: 100%; float: left; height: 400px; overflow: hidden; } .scrollbox { width: 100%; height: 400px; overflow: hidden; } #scrollDiv { height: 400px; overflow: hidden; width: 100%; } #scrollDiv li { height: 127px; width: 100%; overflow: hidden; vertical-align: bottom; margin-bottom: 10px; zoom: 1; } #scrollDiv li img { width: 100%; height: 100%; } .scroltit { height: 26px; line-height: 26px; padding-bottom: 4px; position: absolute; margin-bottom: 4px; z-index: 99; } #but_down { position: absolute; margin-top: -450px; } /*---切换---*/ .prev, .next { float: left; margin-left: calc((266px - 44px)/2); } .prev { margin-bottom: 26px; } .next { margin-top: 26px; } .prev .ico_1 { background: url(input_a.gif) no-repeat 0 -3757px; } .next .ico_2 { background: url(input_a.gif) no-repeat right -3757px; } .prev, .prev a, .next, .next a { width: 44px; height: 25px; display: block } @media screen and (min-width: 0px) and (max-width: 1459px) { .apply-record { width: 100%; float: left; } .apply-record_tab { float: left; width: 860px; margin-left: calc((100% - 860px)/2); border-bottom: 1px solid #e5e5e5; } .apply-record .tab { float: right; } .apply-record .tab .tab-item { float: left; margin-left: 70px; padding-top: 44px; padding-bottom: 22px; border-bottom: 4px solid #fff; font-size: 18px; color: #303030; text-align: center; } .apply-record .tab .tab-item.active { font-weight: bold; border-bottom: 4px solid #d10000; } .products .mainCont { display: none; width: 860px; margin-left: calc((100% - 860px)/2); padding: 40px 0; float: left; } .products .mainCont.selected { display: block; } .v_out { width: 860px; overflow: hidden; height: 505px; float: left; margin-left: calc((100% - 860px)/2); } .jinji_right { width: 585px; height: 341px; margin-top: calc((505px - 341px)/2); float: right; } .v_show { width: 585px; height: 341px; overflow: hidden; position: relative; float: left } .v_cont { width: 6650px; position: absolute; left: 0px; top: 0px; } .v_cont ul { float: left; } .v_cont ul li { width: 585px; height: 341px; float: left; } .v_cont ul li img { width: 585px; height: 341px; float: left; } /*---圆圈---*/ .v_out_p { position: relative; overflow: visible } .jinji_left { width: 266px; float: left; height: 434px; } .circle { width: 100%; float: left; height: 400px; overflow: hidden; } .scrollbox { width: 100%; height: 400px; overflow: hidden; } #scrollDiv { height: 400px; overflow: hidden; width: 100%; } #scrollDiv li { height: 127px; width: 100%; overflow: hidden; vertical-align: bottom; margin-bottom: 10px; zoom: 1; } #scrollDiv li img { width: 100%; height: 100%; } .scroltit { height: 26px; line-height: 26px; padding-bottom: 4px; position: absolute; margin-bottom: 4px; z-index: 99; } #but_down { position: absolute; margin-top: -450px; } /*---切换---*/ .prev, .next { float: left; margin-left: calc((266px - 44px)/2); } .prev { margin-bottom: 26px; } .next { margin-top: 26px; } .prev .ico_1 { background: url(input_a.gif) no-repeat 0 -3757px; } .next .ico_2 { background: url(input_a.gif) no-repeat right -3757px; } .prev, .prev a, .next, .next a { width: 44px; height: 25px; display: block } }