.fbig { width: 100%; height: 520px; overflow: hidden; background: #fff; margin-top: 90px; position: relative; } .fp { width: 56%; height: 100%; float: left; overflow: hidden; position: relative; } .fpp { width: 100%; height: 100%; overflow: hidden; position: absolute; left: 100%; top: 0; } .fpp img, .fcc { cursor: pointer; } .fc { width: 44%; height: 100%; overflow: hidden; float: right; position: relative; } .fcc { width: calc(100% - 180px); height: auto; margin: 90px; overflow: hidden; position: absolute; left: 100%; top: 0; } .fcc a { display: block; height: auto; font-size: 1.5rem; font-weight: bold; line-height: 180%; } .fcc span { display: block; height: auto; font-size: 0.875rem; line-height: 200%; overflow: hidden; margin-top: 10px; color: #666; } .fcc span:nth-child(2) { margin-top: 30px; } .fsmall { display: none; } .fb { width: 200px; height: auto; overflow: hidden; position: absolute; left: calc(56% + 90px); bottom: 60px; z-index: 100; } .fb p { display: block; width: 40px; height: 40px; margin-right: 10px; float: left; border-radius: 5px; cursor: pointer; } .fb p .svg { display: block; width: 70%; height: 70%; margin: 15%; object-fit: contain; } .fb p .svg path { fill: #032759; } .fb p:hover { background: #efefef; } .news { width: 100%; height: auto; overflow: hidden; margin: 100px 0; } .news a { display: block; width: 32%; height: 740px; overflow: hidden; float: left; margin-left: 2%; margin-bottom: 50px; background: #fff; } .news a:nth-child(3n+1) { margin-left: 0; } .news img { display: block; width: 100%; height: 480px; object-fit: cover; } .news span { display: block; margin: 0 50px; } .news span:nth-child(2) { font-size: 1.4rem; font-weight: bold; line-height: 2.2rem; max-height: 4.5rem; margin-top: 40px; padding-bottom: 10px; border-bottom: 1px solid #666; } .news span:nth-child(3) { font-size: 0.75rem; max-height: 50px; overflow: hidden; line-height: 24px; margin-top: 15px; } .news span:nth-child(4) { margin-top: 30px; font-size: 0.75rem; overflow: hidden; } .news span i { font-style: normal; color: #999; } .news a:hover { -moz-box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1); box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1); } /* 璇︽儏 */ .bkbox.newsbox { margin-top: 80px; } .readleft { width: calc(30% - 30px); height: auto; overflow: hidden; float: left; background: #fff; padding-bottom: 100px; } .readleft.fixed { position: fixed; z-index: 0; bottom: 0; } .readright { width: 70%; height: auto; overflow: hidden; float: right; padding: 50px 80px; background: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .readpos { height: 45px; line-height: 45px; color: #999; float: right; padding-right: 15px; } .readpos a { color: #999; margin-right: 0; } .readpos a:hover { text-decoration: underline; } .readbkt { display: inline-block; line-height: 36px; border-radius: 3px; background: #002354; color: #fff; padding: 0 25px; margin: 30px 0 0 30px; font-size: 1rem; font-weight: bold; } .readbku, .proico { padding: 10px 30px 0 30px; height: auto; overflow: hidden; } .readbku li { height: auto; overflow: hidden; padding: 10px 0; font-size: 1rem; line-height: 160%; border-bottom: 1px dotted #ccc; } .readbku li.lip { position: relative; border-bottom: 0; padding: 0; margin: 5px 0; } .readbku li.lip img { display: block; width: 100%; height: auto; } .readbku li.lip a { display: block; width: 100%; height: 100%; position: absolute; font-weight: bold; left: 0; top: 0; z-index: 10; background-image: linear-gradient(rgba(0,0,0,.5), rgba(0,0,0,0)); color: #fff; padding: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .proico a { display: block; width: 30%; height: auto; float: left; margin: 10px 0; margin-left: 4%; line-height: 30px; font-size: 0.875rem; text-align: center; } .proico a:nth-child(3n+1) { margin-left: 0; } .proico p { display: block; width: 60px; height: 60px; background: #ccc; border-radius: 50%; margin: 10px auto; overflow: hidden; } .proico p img { display: block; width: 80%; height: 80%; margin: 10%; } .proico a:hover { font-weight: bold; } .proico a:hover p { background: #032759; } .dalislide.dalipro { height: 400px; padding: 10px 30px 40px 30px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .dalislide.dalipro .slideb { text-align: center; padding-right: 0; } .readt { height: auto; overflow: hidden; font-size: 2rem; line-height: 2.5rem; font-weight: bold; text-align: center; } .readt2 { height: auto; overflow: hidden; font-size: 20px; font-weight: bold; line-height: 30px; margin-top: 15px; text-align: center; } .readi { height: auto; overflow: hidden; padding: 30px 0 10px 0; color: #666; text-align: center; } .readii { display: inline-block; line-height: 30px; vertical-align: middle; } .readdes { height: auto; padding: 40px; color: #666; border: 1px solid #e5e5e5; line-height: 200%; font-size: 1rem; margin-top: 30px; border-radius: 3px; position: relative; } .readdes strong { display: block; width: 70px; height: 30px; line-height: 30px; font-size: 1rem; color: #fff; background: #002354; position: absolute; left: -1px; top: -10px; text-align: center; border-radius: 3px; } .readdes strong::after { content: ''; width: 0; height: 0; border-top: 8px solid #002354; border-left: 8px solid transparent; position: absolute; left: 30px; top: 100%; } .readv { width: 100%; height: 500px; overflow: hidden; background: #000; margin-top: 40px; } .readcont { height: auto; overflow: hidden; font-size: 1rem; line-height: 200%; padding: 30px 0; } .readcont img { max-width: 100%; margin-top: 10px; margin-bottom: 10px; } .readnext { height: auto; overflow: hidden; padding: 30px 0; margin: 40px 0; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; } .readnext li { height: auto; line-height: 45px; font-size: 16px; } .readnext li i { display: block; float: right; color: #999; font-style: normal; } .readnext li a { font-weight: bold; } @media screen and (max-width: 1680px) { .fbig { height: 420px; margin-top: 80px; } .fb { bottom: 50px; } .news { margin: 90px 0; } .news a { height: 600px; margin-bottom: 40px; } .news img { height: 385px; } .news span { margin: 0 40px; } .news span:nth-child(2) { font-size: 1.2rem; margin-top: 20px; } .news span:nth-child(3) { line-height: 22px; } .news span:nth-child(4) { margin-top: 20px; } .bkbox.newsbox { margin-top: 70px; } } @media screen and (max-width: 1440px) { .fbig { height: 380px; margin-top: 70px; } .fb { bottom: 40px; } .fb p { width: 30px; height: 30px; } .fcc { width: calc(100% - 160px); margin: 80px; } .news { margin: 80px 0; } .news a { height: 540px; margin-bottom: 40px; } .news img { height: 330px; } .bkbox.newsbox { margin-top: 60px; } .readright { padding: 50px 60px; } .readbkt { line-height: 32px; margin: 30px 0 0 20px; font-size: 0.875rem; } .readbku, .proico { padding: 10px 20px 0 20px; } .readbku li { font-size: 0.875rem; } .proico p { width: 50px; height: 50px; } .dalislide.dalipro { height: 300px; padding: 10px 20px 40px 20px; } .readdes { padding: 30px; font-size: 0.875rem; } .readdes strong { width: 60px; height: 28px; line-height: 28px; font-size: 0.875rem; } } @media screen and (max-width: 1280px) { .fbig { height: 340px; margin-top: 60px; } .fb { bottom: 30px; } .fb p { width: 25px; height: 25px; } .fcc { width: calc(100% - 140px); margin: 60px 70px; } .news { margin: 70px 0; } .news a { height: 480px; margin-bottom: 30px; } .news img { height: 280px; } .bkbox.newsbox { margin-top: 50px; } .readright { padding: 50px; } .readbkt { line-height: 28px; margin: 20px 0 0 20px; font-size: 0.75rem; } .proico p { width: 40px; height: 40px; } .dalislide.dalipro { height: 300px; padding: 10px 20px 40px 20px; } .readdes { padding: 30px; font-size: 0.875rem; } .readdes strong { width: 60px; height: 26px; line-height: 26px; font-size: 0.75rem; } }