@charset "utf-8";
.mobile-wrap{
	background:#f2f2f2 url(../img/hdlt-bg.jpg) no-repeat center top;
	overflow: hidden;
}
.module-title{padding:50px 0 30px 0; display: block; display: block; text-align: center; justify-content: center; position: relative;}
.module-title h2{color: #333333; font-size: 42px; display: inline-block; vertical-align: text-bottom;}
.module-title span{font-size: 48px; font-weight: 100; position: relative; top: -9px; display: inline-block; vertical-align: bottom; line-height: 36px;color: #555555; }
.module-title h3{color: #010101; font-size: 24px; text-transform: uppercase; font-weight: lighter; display: inline-block; vertical-align: text-bottom;}
.module-title  .tab-box{ margin-top: 6px; text-align: left;}
.module-title  .tab-box a{display: inline-block; font-size: 18px; padding: 0 20px; height: 38px; line-height: 38px; color: #333;}
.module-title  .tab-box a:hover{color: #1c4cba;}
.module-title  .tab-box a.on{font-size: 28px;}
.module-title  .tab-box h2{font-size: 36px; font-weight: normal; }

.more-box{text-align: right; }
.more-box .more{font-size: 16px; color: #1c4cba;}
.more-box .more .iconfont{font-size: 26px; position: relative; top: 4px;}
.more-box .more:hover .iconfont{left: 5px;}


.module-1{ margin-top: 0px;  padding-bottom: 50px; overflow: hidden; padding-top: 380px;}
.module-1 .left-box{float: left; width: 515px;}
.module-1 .left-box .hot{overflow: hidden; display: block; background-color: #fff; box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1); border-radius: 8px;}
.module-1 .left-box .hot img{width: 515px; height: 310px; display: block; object-fit: cover; border-radius: 8px 8px 0 0;}
.module-1 .left-box .hot .title{padding: 20px;}

.module-1 .left-box .list-box{ margin: 40px -21px;}
.module-1 .left-box .list{float: left; height: 205px; display: block; width: 236px; margin: 0 21px; background-color: #fff; box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1); border-radius: 8px;}
.module-1 .left-box .list .pic img{ width: 100%; height: 135px; display: block; object-fit: cover; border-radius: 8px 8px 0 0;}
.module-1 .left-box .list .title{padding: 12px 20px;}

.module-1 .right-box{width: 636px; float: right;}
.module-1 .right-box a.more{color: #1c4cba; font-weight: bold; display: inline-block; font-size: 22px; margin: 121px 0 30px 0;}
.module-1 .right-box .list{overflow: hidden; display: block; height: 430px; background-color: #fff; box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1); border-radius: 8px;}
.module-1 .right-box .list img{width: 636px; height: 360px; display: block; object-fit: cover; border-radius: 8px 8px 0 0;}
.module-1 .right-box .list .title{padding: 12px 20px;}

.module-2{ margin-top: 50px;}
.module-2 .list-box{margin: 0 0px 50px; width: 100%; position:relative; column-count: 3; column-width: 360px; column-gap: 60px;}



.module-2 .list-box .list{ margin: 0 0px 40px; position: relative; width: 360px; background-color: #ffffff; overflow: hidden; box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1); border-radius: 8px;}



.module-2 .list-box .list .pic{position: relative; border: solid 20px #ffffff;}
.module-2 .list-box .list .pic .tag{position: absolute; top: -8px; right: -8px; padding: 0; line-height: 1em;}
.module-2 .list-box .list .pic .tag span{font-size: 14px; color: #fff; position: relative; z-index: 2;}
.module-2 .list-box .list .pic .tag::before{content: ""; width: 150px; height: 150px; transform:rotate(45deg); background-color: #1c4cba; position: absolute; right: -100px; top: -100px; z-index: 1;}
.module-2 .list-box .list .pic img{display: block; width: 100%; height: 100%;}
.module-2 .list-box .list .title{position: absolute; opacity: 0; width: 100%; height: 100%; top: 0; left: 0;transition: all 0.4s ease-in-out; z-index: 2; background-color: rgba(0,0,0,0.5);}
.module-2 .list-box .list .title h2{ color: #fff; font-size: 16px; position: absolute; bottom: 0; left: 0; padding: 50px;}
.module-2 .list-box .list a:hover .title{opacity: 1;}


@media screen and (max-width: 768px) {
	
	.module-title{padding:.5rem 0 .4rem 0; display: block; display: block; position: relative; text-align: center;}
	.module-title h2{color: #333333; font-size: .32rem; letter-spacing: 1px; display: inline-block; text-align: center; vertical-align: middle; position: relative;}
	.module-title h2::after{content: ""; width: 2px; height: 2px; border-left: .4rem solid #D70021; border-right: 4px solid #000; position: absolute; top: .2rem; left: -.65rem;}
	.module-title h2::before{content: ""; width: 2px; height: 2px; border-right: .4rem solid #D70021; border-left: 4px solid #000; position: absolute; top: .2rem; right: -.65rem;}
	.module-title span{display: none;}
	.module-title h3{color: #888; font-size: .12rem; padding-top: 2px; letter-spacing: 2px; font-family: Conv_DidotLTStd-Roman; text-transform: uppercase; text-align: center; font-weight: lighter; display: block; vertical-align: middle;}
	.module-title .more{ position: absolute; opacity: 0; width: 100%; height: 100%; left: 0; top: 0;}
	
}