*{ padding:0px; margin:0} body{ color:#fff; } .menu{ height:80px; line-height: 80px; position:fixed; /*background:rgba(0,0,0,0.2);*/ top:0px; left:0; z-index:998; width:100%; } .menu_center{ width: 65%; height: 80px; margin: 0 auto; } .sitename{ width: 40%; font-size: 26px; font-weight: 700; letter-spacing: 5px; color: #000; } .menu li{ height: 80px; line-height: 80px; list-style:none; float:left; display:inline-block; font:16px/42px "Microsoft Yahei"; } .menu li a{ width: 150px; color:#fff; text-decoration:none; text-align:center; display:block; padding:0px 15px; height: 80px; line-height: 80px; font-size: 17px; } /*.menu li.active{ background:#F00; }*/ .section1{ background: url(../full_image/section1.png) no-repeat; background-size: s; -webkit-background-size: contain; -o-background-size: contain; background-position: top right; width: 100%; height: 100%; } .section1_left, .section1_right{ width: 50%; height: 100%; } .section1_left{ margin-top: 250px; } @media screen and (min-width: 1366px) { .section1_left{ margin-top: 260px; } } @media screen and (min-width: 1440px) { .section1_left{ margin-top: 350px; } } @media screen and (min-width: 1920px) { .section1_left{ margin-top: 350px; } } @media screen and (min-width: 1921px) { .section1_left{ margin-top: 380px; } } .logo_img img{ width: 100%; max-width: 516px; } .desc_img{ margin-top: 20px; } .desc_img img{ width: 100%; max-width: 530px; height: auto; } .download{ margin-top: 30px; } @media screen and (min-width: 1366px) { .download { margin-top: 30px; } } @media screen and (min-width: 1440px) { .download { margin-top: 70px; } } @media screen and (min-width: 1920px) { .download { margin-top: 70px; } } @media screen and (min-width: 1921px) { .download { margin-top: 70px; } } .download .ewm_area{ width: 30%; height: auto; } .download .ewm_area .ewm_img{ width: 95%; height: 96%; background: url(../full_image/kuang.png) no-repeat top left; background-size: 100%; padding: 5px; } .download .ewm_area .ewm_img img{ width: 100%; height: 100%; } .download .ewm_download{ width: 100%; height: 65px; margin-top: 20px; color: #e531db; font-size: 24px; } .download .ios{ background: url(../full_image/ios.png) no-repeat top left; background-size: 100%; } .download .android{ background: url(../full_image/android.png) no-repeat top left; background-size: 100%; } .section1_right{ padding-top: 250px; text-align: right; } @media screen and (min-width: 1366px) { .section1_right{ padding-top: 220px; text-align: right; } } @media screen and (min-width: 1440px) { .section1_right{ padding-top: 320px; text-align: right; } } @media screen and (min-width: 1920px) { .section1_right{ padding-top: 320px; text-align: right; } } @media screen and (min-width: 1921px) { .section1_right{ padding-top: 250px; text-align: right; } } .section1_right img{ width: 80%; height: auto; } .section2{ background: url(../full_image/section2.png) no-repeat top left; background-size: contain; -webkit-background-size: contain; -o-background-size: contain; width: 100%; height: 100%; } .section2 .section2_left,.section2 .section2_right{ width: 50%; height: 100%; color: #000; } .section2 .section2_left{ position: relative; } .section2 .section2_left img{ width: 90%; height: auto; position: absolute; left: 30%; top: 15%; } .section2 .section2_right{ position: relative; } .section2 .section2_right .company_name{ margin-top: 55%; width: 70%; height: 60px; font-weight: 500; font-size: 2.2rem; overflow: hidden; } .section2 .section2_right .company_desc{ width: 70%; line-height: 1.5rem; } .section2 .copyright{ width: 100%; height: 30px; position: absolute; bottom: 0; left: 0; font-size: 1rem; text-align: center; color: #000; } .section2 .copyright a{ color: #000; text-decoration: none; } .section_center{ width: 65%; height: 100%; margin: 0 auto; } .fl{ float: left; } .fr{ float: right; } .clearboth{ clear: both; } /*.mr_20{ margin-right: 5%; } @media screen and (min-width: 1400px) { .mr_20{ margin-right: 15%; } }*/ @media screen and (min-width: 1366px) { .mr_20{ margin-right: 2%; } } @media screen and (min-width: 1440px) { .mr_20{ margin-right: 3%; } } @media screen and (min-width: 1920px) { .mr_20{ margin-right: 15%; } } @media screen and (min-width: 1921px) { .mr_20{ margin-right: 8%; } }