@charset "utf-8"; @media screen and (max-width:1800px){ #content .piclist{ width: 93%; /*margin-top: 50px;*/ } #content .piclist ul li{ width: 25%; height: auto; } #content .piclist ul li div p{ line-height: normal; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 120px; height: 30px; margin: auto; } } @media screen and (max-width: 1600px){ } @media screen and (max-width: 1440px) { #content{ zoom:.8; } /* #content .scenery { width: 1000px; } #content .scenery .right { width: 468px; } #content .scenery .right h2 { width: 300px; height: 62px; } #content .scenery .right p{ font-size: 14px; } #content .scenery .right a{ font-size: 14px; } #content .number{ width: 1000px; } #content .number ul li{ padding: 20px 20px 14px 25px; } #content .number ul li div{ font-size: 45px; } #content .number ul li i{ font-size: 20px; } #content .number ul li p{ font-size: 14px; } #content .scientific{ height: 623px; } #content .scientific .center{ width: 1000px; height: 350px; } #content .scientific .center .round{ width: 350px; height: 350px; margin-left: -175px; } #content .scientific .center .round h4{ width: 100px; height: 220px; } #content .scientific .center > p{ width: 290px; } #content .scientific .center > ul > li{ width: 290px; } #content .scientific .center > ul > li h3{ font-size: 20px; } #content .scientific .center > ul > li p{ font-size: 15px; } #content .news .n-content{ width: 1000px; } #content .news .n-content .left{ width:494px ; } #content .news .n-content .left .img{ height: auto; } #content .news .n-content .right ul{ width: 460px; } #content .news .n-content .right ul li{ margin-bottom: 20px; padding-bottom:20px; } #content .news .n-content .right ul li .r-content{ width: 360px; margin-top: 10px; } #content .news .n-content .right ul li .r-content h4{ font-size: 18px; } #content .news .n-content .right ul li .r-content p{ font-size: 14px; } */ } @media screen and (max-width: 1300px){ #content .scientific{ height: 520px; } } @media screen and (max-width:1000px){ #content .scientific{ height: auto; } #content .scientific .center{ position: relative; width: 100%; height: auto; } #content .scientific .center .round{ position: relative; } #content .scientific .center > ul { position: static; width: 60%; height: auto; margin: auto; } #content .scientific .center > ul:before{ content: ""; display: block; clear: both; } #content .scientific .center > ul > li{ position: relative; display: inline-block; float: initial; width: 100%; padding:10px; } #content .scientific .center > p{ display: none; } #content .scientific .center > ul > li:nth-child(1), #content .scientific .center > ul > li:nth-child(2){ top: 0; } #content .scientific .center > ul > li:nth-child(2){ right: 0; } #content .scientific .center > ul > li:nth-child(3), #content .scientific .center > ul > li:nth-child(4){ bottom: 0; } #content .scientific .center > ul > li:nth-child(4){ right: 0; } } @media screen and (max-width:1200px){ #banner .shuffling .title h2{ font-size: 35px; } #banner .shuffling .title p:nth-of-type(1){ font-size: 27px; } #banner .shuffling .title p:nth-of-type(2){ width: 63%; font-size: 24px; } #banner .shuffling .pager li{ width: 10px; height: 10px; } #content .scenery{ width: 100%; } #content .scenery .left, #content .scenery .right{ float: none; margin: auto; } #content .scenery .map { display: none; } #content .number{ width: 100%; } #content .number ul{ flex-wrap: wrap; width: 60%; } #content .number ul li{ margin-bottom: 20px; } #content .news .n-content{ width: 100%; } #content .news .n-content .left .img{ height: auto; } #content .news .n-content .left h4{ width: 90%; margin: auto; font-size: 16px; } #content .news .n-content .left > p{ width: 90%; margin: auto; font-size: 14px; line-height: 30px; } #content .news .n-content .left > a{ display: none; } #content .news .n-content .left, #content .news .n-content .right{ width: 100%; float: none; } #content .news .n-content .right ul{ width: 90%; margin: auto; } #content .news .n-content .right ul li .r-content h4{ font-size: 16px; } #content .news .n-content .right ul li .r-content p{ font-size: 14px; } #content .news .n-content .right ul li .r-content{ width: 80%; } } @media screen and (max-width: 1100px){ #content .number ul{ width: 45%; } } @media screen and (max-width:800px){ #content .number ul{ width: 60%; } #banner .shuffling .title h2{ margin-bottom:10px ; font-size: 20px; } #banner .shuffling .title p:nth-of-type(1){ margin-bottom:10px ; font-size: 17px; } #banner .shuffling .title p:nth-of-type(2){ font-size: 14px; } #banner .shuffling .left{ display: none; } #content .scientific .center > ul{ width: 80%; } #content .piclist{ width: 100%; margin-top: 50px; } #content .piclist ul li{ width: 50%; height: auto; } #banner .shuffling .title p:nth-of-type(2) span{ margin-left: 10px; } } @media screen and (max-width:600px){ #content .scenery .right{ width: 90%; padding: 0 10px; margin-top: 30px; } #content .news .n-content .right ul li .r-content{ width: 70%; } } @media screen and (max-width:500px){ #banner .shuffling .title h2{ font-size: 15px; } #banner .shuffling .title p:nth-of-type(1){ font-size: 13px; } #banner .shuffling .title p:nth-of-type(2){ font-size: 12px; } #banner .shuffling .title p:nth-of-type(2){ padding: 8px 4px 8px 20px; } #banner .shuffling .pager li{ width: 5px; height: 5px; } #content{ padding-top: 50px; } #content .scenery .left{ width: 100%; overflow: hidden; /*min-width: 340px;*/ } #content .scenery .right h2 { width: 270px; height: 60px; } #content .number ul{ justify-content: space-around; } /*#content .piclist{*/ /*width: 100%;*/ /*margin-top: 50px;*/ /*}*/ /*#content .piclist ul li{*/ /*width: 100%;*/ /*height: auto;*/ /*}*/ } @media screen and (max-width:600px){ #content .news .n-content .left .date{ height: 105px; } } @media screen and (max-width:520px){ #content .scientific{ background: none; } #content .scientific .center .round{ margin-left: 0; left: 0; width: 100%; height: 280px; background-size:65% ; } #content .scientific .center > ul > li h3{ font-size: 18px; } #content .scientific .center > ul > li p{ font-size: 14px; } #content .scientific .center .round h4 a{ width: 50%; margin: 50px auto; } #content .number ul li{ width: 40%; } #content .number ul li div{ font-size:30px ; } #content .news .n-content .right ul li{ padding-bottom: 0; } #content .news .n-content .right ul li .date span{ font-size: 60px; } #content .news .n-content .right ul li .r-content{ margin-top: 0; } #content .news .n-content .right ul li .r-content h4{ font-size: 14px; } #content .news .n-content .right ul li .r-content p{ font-size: 12px; } } @media screen and (max-width: 430px){ #content .number ul li{ width: 29%; } #content .number ul li div{ font-size:19px ; } #content .number ul li i{ font-size: 12px; } #content .number ul li p{ font-size: 12px; } #content .number ul li:nth-child(2), #content .number ul li:nth-child(3){ width: 30%; } } @media screen and (max-width: 414px) { #banner .shuffling{ overflow: hidden; } #banner .shuffling ul li{ overflow: hidden; } #banner .shuffling ul li img{ width: 200%; float: right; } #banner .shuffling .logo{ width: 60%; } #banner .shuffling .title p:nth-of-type(2){ width: 70%; } #content .scenery{ margin-bottom: 370px; } #content .scenery .left{ top: 270px; } #content .scenery .left > div{ display: none; } #content .scenery .left > img{ display: block; width: 80%; height: auto; margin: 50px auto; } #content .scenery .right{ margin-top: -360px; } #content .scenery .right h2 { width: 230px; height: 50px; } #content .scenery .right p { margin-top: 20px; margin-bottom: 10px; font-size: 12px; } #content .scenery .right a{ float: right; padding: 5px 20px; font-size: 12px; } #content .number ul { width: 100%; } #content .piclist{ margin-top: 20px; } #content .piclist h2 { display: block; width: 90px; height: 46px; margin-left: 20px; margin-bottom: 20px; } #content .scientific .center{ padding-bottom: 30px; } #content .scientific .center .round { height: 240px; background-size: 45%; } #content .scientific .center .round ul{ width: 80px; height: 80px; } #content .scientific .center .round ul li{ font-size: 27px; } #content .scientific .center > ul > li h3{ font-size: 14px; } #content .scientific .center > ul > li p { font-size: 12px; line-height: 20px; } #content .scientific .center > ul > li{ padding: 0; } #content .news{ padding-top: 20px; } #content .news .n-content .left h4{ font-size: 14px; } #content .news .n-content .left > p{ font-size:12px ; } #content .news .n-content h3{ width: 90px; height: 46px; margin-left: 20px; margin-bottom: 20px; } #content .news .n-content .right ul li .date p{ font-size: 14px; } #content .news .n-content .right ul li .date span{ font-size:45px ; } } @media screen and (max-width: 340px){ #content .scenery .left div:nth-child(1){ width: 200px; height: 200px; left: 70px; } #content .scenery .left div + div{ width: 76px; height: 76px; } #content .scenery .left div:nth-child(3){ bottom: 239px; } #content .scenery{ margin-bottom: 280px; } }