.w { width: 1170px; margin: 0 auto; } body { background-color: #fff; } #layout_header { border-bottom: 1px solid #ddd; } .w { position: relative; z-index: 1; } .w .content { padding: 27px 27px 0; } .w .content .section .section-t { text-align: center; } .w .content .section .section-t p { font-size: 20px; color: #fff; text-align: center; height: 50px; line-height: 50px; padding: 0 135px; background-color: #009688; border-radius: 5px; box-shadow: -3px 5px 10px 0px rgba(0, 0, 0, 0.22); display: inline-block; vertical-align: top; letter-spacing: 2px; } .w .content .section .section-m { margin-top: 20px; position: relative; padding: 40px 0; } .w .content .section .section-m .middle-line { position: absolute; width: 2px; height: 100%; top: 0; bottom: 0; background-color: #999; left: 50%; margin-left: -1px; } .w .content .section .section-m .middle-line:before, .w .content .section .section-m .middle-line:after { content: ""; position: absolute; width: 14px; height: 14px; border-radius: 50%; background-color: #d85522; left: 50%; margin-left: -7px; top: 0px; } .w .content .section .section-m .middle-line:after { top: auto; bottom: -10px; } .w .content .section .section-m .month-box { position: relative; padding-top: 50px; } .w .content .section .section-m .month-box .month { position: absolute; top: 0; } .w .content .section .section-m .month-box .month .text { font-size: 18px; color: #fff; width: 172px; text-align: center; line-height: 38px; } .w .content .section .section-m .month-box .month.bg1, .w .content .section .section-m .month-box .month.bg3 { left: 50%; margin-left: -10px; width: 241px; height: 45px; background: url("/zkjaeduyuncom/images/memorabilia01.png") no-repeat left top; } .w .content .section .section-m .month-box .month.bg1 .text, .w .content .section .section-m .month-box .month.bg3 .text { float: right; } .w .content .section .section-m .month-box .month.bg2, .w .content .section .section-m .month-box .month.bg4 { width: 247px; height: 45px; background: url("/zkjaeduyuncom/images/memorabilia02.png") no-repeat left top; right: 50%; margin-right: -10px; } .w .content .section .section-m .month-box .month.bg2 .text, .w .content .section .section-m .month-box .month.bg4 .text { float: left; } .w .content .section .section-m .month-box .month.bg3 { background-image: url("/zkjaeduyuncom/images/memorabilia03.png"); } .w .content .section .section-m .month-box .month.bg4 { background-image: url("/zkjaeduyuncom/images/memorabilia04.png"); } .w .content .section .section-m .memorabilia { width: 500px; background-color: #fff; border-radius: 5px; border: solid 1px #eeeeee; } .w .content .section .section-m .memorabilia ul { padding: 20px 27px; box-shadow: -3px 5px 10px 0px rgba(0, 0, 0, 0.22); } .w .content .section .section-m .memorabilia ul li { height: 30px; line-height: 30px; position: relative; padding-right: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .w .content .section .section-m .memorabilia ul li a { font-size: 14px; color: #666; } .w .content .section .section-m .memorabilia ul li a:hover { text-decoration: underline !important; } .w .content .section .section-m .memorabilia ul li span.time { position: absolute; right: 0; font-size: 12px; color: #999; } .w .content .section .section-m .m-r { /* opacity: 0; */ } .w .content .section .section-m .m-r .memorabilia { float: right; } .w .content .section .section-m .m-l { /* opacity: 0; */ } .w .content .section .section-m .m-l .memorabilia { float: left; } .section-b { height: 245px; position: relative; min-width: 1170px; } .section-b .w-bg { height: 100%; background: url("/zkjaeduyuncom/images/memorabilia06.png") no-repeat center 104px; } .section-b .w-bg .i-bg { height: 100%; background: url("/zkjaeduyuncom/images/memorabilia05.png") no-repeat center bottom; } .section-b .w-bg .i-bg img { position: absolute; left: 50%; width: 83px; height: 81px; margin-left: -42px; top: 55px; } .section-b .w-bg .i-bg .p1, .section-b .w-bg .i-bg .p2 { position: absolute; width: 100%; text-align: center; font-size: 17px; color: #fff; top: 173px; } .section-b .w-bg .i-bg .p2 { font-size: 15px; top: 204px; }