/* banner */ #Mycarousel .carousel-caption { min-width: 100%!important; left: 0; right: 0; bottom: 0; background-color: rgba(51, 51, 51, 0.8); } #Mycarousel .carousel-indicators { bottom: -12px; } #Mycarousel .carousel-caption h5 { line-height: 3rem; } /* banner-end */ /* title */ .Title { width: 100%; height: 50px; } .Title .Title-name { float: left; } .Title .Title-name h4 { line-height: 50px; } .Title .Title-link { float: right; line-height: 50px; } .Title .Title-link a { color: #6B0C84; font-weight: bold; font-size: 1.1rem; } /* title-end */ /* mode01 */ .mode01 .Content{ padding-top: 20px; width: 100%; position: relative; height: auto; overflow: hidden; } .mode01 .Title{ border-bottom: 2px solid #6B0C84; } .mode01 .ContentItem { float: left; width: 30%; margin-left: 5%; } .ContentItem .card { width: 100%; border: none; } .mode01 .ContentItem:nth-child(1) { margin: 0; } .mode01 .ContentItem .card-body { padding: 1.25rem 1.25rem 1.25rem 0; } .mode01 .card-body span { font-weight: bold; } .mode01 .card-body span a { color: #333; font-size: 1.1rem; } .mode01 .card-body span a:hover { color: #6B0C84; text-decoration: underline; } .mode01 .card-body p { margin-top: 10px; color: #BBBBBB; display: block; height: 72px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; font-size: 1rem; } .mode01 .card-img-top { border-top-left-radius: 0; border-top-right-radius: 0; } /* mode01-end */ /* mode02 */ .mode02 { background: #F4F4F4; } .mode02 .mode02-bg { background: url(../images/mode02Bg.png); background-size: 100% 100%; } .mode02 .Title{ border-bottom: 2px solid #6B0C84; } .mode02 .Title .Title-name h4 { color: #6B0C84; } .mode02 .Content { width: 100%; background-color: #ffffff; margin: 0; } .mode02 .card { border: none; } .mode02 .card .card-date { float: left; width: 80px; height: 60px; display: block; } .mode02 .card-text a{ color: #333; font-size: 1.1rem; } .mode02 .card-text a:hover { color: #6B0C84; } .mode02 .card-text { float: left; line-height: 80px; padding-left: 40px; height: 80px; display: block; overflow: hidden; text-overflow: ellipsis; width: calc(100% - 100px); white-space: nowrap; position: relative; } .card-date-dd { line-height: 40px; font-size: 22px; color: #ffffff; background-color: #6B0C84; text-align: center; font-weight: bold; } .card-date-yyyy-mm { line-height: 40px; text-align: center; color: #6B0C84; font-weight: bold; border-left: 1px solid #BBBBBB; border-right: 1px solid #BBBBBB; border-bottom: 1px solid #BBBBBB; } .mode02 .card-text::before { width: 1rem; height: 1rem; position: absolute; left: 1rem; top: 2.3rem; display: block; background: url(../images/prefix.png) no-repeat; z-index: 11; content: ''; transition: all 0.3s ease-in-out; } .mode02 .card-body { border-bottom: 1px dashed #BBBBBB; } .mode02 .col-sm-6:nth-child(5) .card-body{ border: none; } .mode02 .col-sm-6:nth-child(6) .card-body{ border: none; } /* mode02-end */ /* mode03 */ .mode03 { width: 100%; height: auto; overflow: hidden; } .mode03 .lf{ float: left; width: 48%; margin-right: 4%; position: relative; } .mode03 .rt{ float: left; width: 48%; position: relative; } .mode03 .list { height: 100%; position: relative; } .mode03 .card-text { float: left; line-height: 40px; font-size: 1.1rem; padding-left: 40px; height: 40px; display: block; overflow: hidden; text-overflow: ellipsis; width: calc(100% - 120px); white-space: nowrap; position: relative; } .mode03 .card-text::before { width: 1rem; height: 1rem; position: absolute; left: 1rem; top: 1.1rem; display: block; background: url(../images/prefix.png) no-repeat; z-index: 11; content: ''; transition: all 0.3s ease-in-out; } .mode03 .card-date { text-align: right; display: block; float: left; width: 100px; color: #BBBBBB; line-height: 40px; } .mode03 .Content { margin-top: 20px; } .mode03 .ContentItem { display: block; width: 100%; color: #333; } .mode03 .ContentItem:hover p{ color: #6B0C84; text-decoration: underline; } .mode03 .Title { border-bottom: 2px solid #6B0C84; } /* mode03-end */ /* mode04 */ .mode04 .Title { border-bottom: 2px solid #6B0C84; } .mode04 .Content{ width: 100%; position: relative; height: auto; overflow: hidden; margin-top: 20px; } .mode04 .ContentItem { float: left; width: 23.5%; margin-left: 2%; } .ContentItem .card { width: 100%; border: none; } .mode04 .ContentItem:nth-child(1) { margin: 0; } .mode04 .ContentItem .card-body { padding: 1.25rem 1.25rem 1.25rem 0; } .mode04 .card-body span { font-weight: bold; } .mode04 .card-body span a { color: #333; font-size: 1.1rem; } .mode04 .card-body span a:hover { color: #6B0C84; text-decoration: underline; } .mode04 .card-body p { margin-top: 10px; color: #BBBBBB; display: block; height: 72px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; font-size: 1rem; } .mode04 .card-img-top { border-top-left-radius: 0; border-top-right-radius: 0; } .mode0304-bg { background: url(../images/mode03Bg.png) no-repeat; } /* mode04-end */ /* */ .mode05 { background-color: #F4F4F4; } .mode05 .Content ul li { display: inline-block; } .mode05 .Content ul li a { font-size: 1.0rem; padding-right: 2.0rem; color: #333; } .mode05 .Content ul li a:hover { text-decoration: underline; color: #6B0C84; font-weight: bold; } /* mode05-end */