body{ padding:0px; margin:0px; background: no-repeat; background-position: center 400px; background-size:cover; min-width: 1750px; } body.overflowhidden{ overflow:hidden; } .ww{ width:1750px; margin:0 auto; position:relative; } .w1200{ width:1200px; margin:0 auto; } .banner{ width:100%; min-width:1200px; height:650px; background: no-repeat center; background-size:cover } .page-title{ font-family: 'pingfang sc'; font-weight: 600; font-size: 42px; text-align: center; color: #b3110f; } .content{ margin-bottom:64px; } .flex{ display:flex; flex-direction: row; align-items: center; flex-wrap: wrap; } .flex-start{ display:flex; flex-direction: row; align-items: center; flex-wrap: wrap; justify-content: flex-start; } .row{ margin-top:36px; width:100%; } .img-wrapper{ padding:20px; } .img-box{ margin-top:10px; } .img-item{ height:185px; } .img-item img{ width:100%; height:185px; object-fit: cover; cursor: pointer; } .img-item:not(:first-child){ margin-top:15px; } .box{ height:457px; width:383px; padding:24px; padding-top:10px; margin-right:24px; margin-bottom:24px; background: linear-gradient(180deg, #ffffff 0%, #fff3e7 100%); box-shadow: 0px 12px 24px rgba(241, 216, 211, 0.5); } .img-item{ position:relative; } .img-box .desc{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width:100%; background:rgba(0,0,0,.8); position:absolute; bottom:0px; left:0px; color:#fff; font-weight:500; font-size:12px; padding:2px 10px; } .box:nth-child(3n){ margin-right:0; } .box .title{ font-weight: 400; font-size: 20px; height:40px; color: #333333; border-bottom:4px solid #ededed; display:flex; align-items: center; justify-content: space-between; } .box .title .more{ font-size:14px; color:#333333; position:relative; display:flex; align-items: center; user-select: none; cursor: pointer; } .box .title .more:after{ width:6px; height:6px; content:''; border: 2px solid #333333; transform: rotate(-45deg); border-top:none; border-left:none; margin-left:12px; } .img-wrapper .title{ border:none; } .box .title .h{ position:relative; } .box .title .h:before{ content:''; display:inline-block; border-bottom:4px solid #b1010c; position:absolute; bottom:-8px; left:0px; width:100%; } .box ul{ margin-top:24px; } .box ul li{ margin-top:16px; width:100%; line-height:20px; font-size:14px; cursor: pointer; display:flex; flex-direction: row; align-items: center; } .box ul li a{ color:#666666; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transform: scale(1); width:98%; transition: all 0.1s linear; } .box ul li a:hover{ color:#bf3226; transform: scale(1.01); } .footer{ display:flex; flex-direction: row; align-items: center; justify-content: center; height:180px; background:#bf3226; color:#ffffff; text-align: center; } .flex-row-center{ display:flex; flex-direction: row; align-items: center; justify-content: center; } .theme{ position: absolute; right: 6%; top: -80px; } .title{ display:flex; } .theme .txt{ width:120px; height:44px; } .theme .main{ padding:4px; width:144px; height:346px; border:2px solid #fff; background: linear-gradient(180deg, #fff0d8 0%, #ffbc94 100%); } .theme .main .item{ text-align: center; height:50px; line-height: 50px; color:#cc0003; font-family: 'fzyasongs-eb-gb'; font-size:16px; font-weight: bold; cursor: pointer; } .theme .main .item:not(:last-child){ border-bottom:1px solid #fff; } .theme .img{ height:120px; width:165px; position:absolute; bottom:-18px; left:-12px; } .dialog-wrapper{ position: fixed; top: 0; display: none; right: 0; bottom: 0; left: 0; overflow: auto; margin: 0; z-index: 2001; background-color: rgba(0,0,0,0.7); transition: all 1s linear; } .dialog-wrapper.show{ display:block; } .dialog{ position: relative; margin: 15vh auto 50px; border-radius: 2px; box-shadow: 0 1px 3px rgba(0,0,0,0.3); box-sizing: border-box; width:750px; margin-bottom:50px; } .dialog img{ width:100%; min-height:100px;; display: none; } .dialog img.show{ display:block; } .dialog img.hide{ display: none; } .dialog .close{ position:absolute; right:-165px; top:0px; color:#fff; cursor: pointer; width:50px; height:50px; background: no-repeat; background-size:100% 100%; }