@charset "UTF-8";
/* CSS Document */

.h5-main{ background: url(/legacy/static/page661/h5bg.jpg) no-repeat; background-position: top center; background-size: 100% auto; margin-top: 4.5vw; padding-bottom: 30px;}
.h5-top{text-align: center;  }
.h5-box{ width: 1000px; margin: 0 auto;}
.h5-top>h1{ color: #ffffff; padding-top: 50px; font-size: 3vw;}
.h5-top>h1>span{ color: #f6eb4f;}
.h5-top>p{ color: #ffffff; letter-spacing: 10px; line-height: 36px; }
.top-nr{  height: 300px; background: #ffffff; border-radius: 5px; margin-top: 1vw; padding: 15px; display: flex; justify-content: space-around;}
.top-nr>p{ font-size: 24px; text-align: left; color: #555555; line-height:48px; width: 60%; padding-top: 30px;}
.middle-nr{height: 300px; background-image: linear-gradient(to right, #1c8e7c, #38a655); border-radius: 5px; margin-top: 1vw; padding: 15px; display: flex; justify-content: space-around;}
.middle-nr>div{ text-align: right;}
.middle-nr>div>h1{ color: #ffffff;  padding-top: 30px;}
.middle-nr>div>h1>span{color: #f6eb4f;}
.middle-nr>div>p{font-size: 24px; text-align: right; color: #555555; line-height:48px; color: #ffffff; padding-top: 20px;}
.case-nr{background: #ffffff; border-radius: 5px; margin-top: 1vw; padding: 15px;  }
.case-nr>h1{ color: #0254fe; line-height: 280%;}
.case-nr>h1>i{ display: inline-block; width: 5px; height: 26px; border-radius: 3px; background: #0254fe; vertical-align: -2px; margin-right: 10px;}
.case-list{ display: flex; justify-content: space-between; height: 530px;padding: 0 15px;}
.case{ width: 240px; height: 482px; position: relative; }
.case .case-bg{ position: absolute;  width: 240px; height: 482px; left: 0; top:0; z-index: 3;}
.case .case-img{position: absolute;  width: 235px; height: 482px; left: 0; top:0; z-index: 1;}
.case .case-img img{ display: block; border-radius: 35px; margin-left: 2px;}
.case-about{position: absolute;  width: 240px; height: 482px; left: 0; top:0; z-index: 2; background: url(/legacy/static/page661/black.png) repeat; border-radius: 35px; text-align: center; display: none;}
.case-about img{ padding-top:100px; width: 150px; height: 150px; display: block; margin: 0 auto;}
.case-about p{ color: #ffffff; padding-top: 20px; }

.case:hover .case-about{ display: block;}
.case-title{ position: absolute; width: 240px; height: 36px; left: 0; bottom: -50px; color: #555555; text-align: center;}