@mod-bc:#CD3F2B; @text-color:#CD3F2B; @border-color:2px solid #CD3F2B; @font-size: 18px; @font-size-sm: 16px; @font-size-xs: 14px; .bc-div600{ height: 600px; } .bc-div650{ height: 650px; } .bc-div800{ height: 800px; } *{ margin: 0; padding: 0; } .mym{ margin: 20px; } .myhead{ width: 100%; height:400px; background: #393a49; background: url("../images/banner.jpg") no-repeat center center; } .mybody{ width: 100%; height: auto; } .bc-mod:nth-child(odd){ background-color: #fff; h1{ color: @text-color; line-height: 40px; font-size:32px; } } .bc-mod:nth-child(even){ background-color: @mod-bc; h1{ color: #fff; line-height: 40px; font-size:32px; } } .bc{ width: 1000px; height: auto; padding: 15px 0; margin: auto; } .bc-p{ width: 500px; height: 240px; padding:30px 150px 30px 30px; border: @border-color; font-size: @font-size; line-height: 35px; color: @text-color; margin: 20px 50px; } .bc-text-img{ float: right; margin: -370px 120px; } .bc-ul{ width: 1000px; list-style: none; font-size: @font-size; line-height: 35px; color:#fff; height: 70px; margin: 20px 0; li{ width: 40%; margin:0 5%; height: 35px; float: left; } } .bc-div{ width: 400px; height: 300px; line-height: 30px; color: #333; float:left; margin:20px 50px; h2{ line-height: 80px; height: 80px; color: @text-color; img{ float: left; margin: 15px 10px 0 110px; } } ul{ list-style: square; font-size: @font-size-sm; padding:15px 20px; } } .bc-div:nth-of-type(1){ width: 399px; border-right: 1px solid #CD3F2B; } .bc-div:nth-of-type(3){ width: 800px; height: 200px; color: @text-color; float:left; background: #FAEEE9; margin:0 50px; padding: 15px 50px; h2{ line-height: 40px; height: 40px; } ul{ list-style: none; font-size: @font-size-xs; color:#333; } } .bc-div-p{ width: 800px; margin: 20px 50px; color:#fff; padding: 15px 50px; background: #D25142; p:nth-of-type(1){ font-size: @font-size; border-bottom:1px solid #fff; line-height: 35px; padding-bottom: 10px; } p:nth-of-type(2){ margin-top: 10px; font-size: @font-size-xs; line-height: 25px; } } .bc-div-menu{ width: 900px; margin: 0 50px; background: #D25142; border-top:2px solid #fff; border-bottom:2px solid #fff; float: left; p{ width: 300px; background: #EDB9B2; color: @text-color; float:left; font-size: @font-size; text-align: center; line-height: 30px; padding: 15px 0; cursor: pointer; } p:hover{ background: #D25142; color: #fff ; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; -o-transition: all .5s; transition: all .5s; } p:nth-of-type(1){ background: #D25142; color: #fff ; } } .bc-div-body{ float:left; color:#fff; line-height: 35px; margin-top:15px; padding-bottom: 15px; display: none; dl{ dt{ float:left; width:115px; text-align: center; font-size: @font-size-sm; } dd{ float:left; width:785px; ul{ list-style: none; font-size: @font-size-sm; } } } } .bc-div-body:nth-of-type(1){ display: block; } .bc-ul-line{ list-style: none; width: 950px; height: 350px; margin-left: 50px; margin-top: 20px; li{ width: 175px; height: 120px; float: left; border: @border-color; text-align: center; margin: 15px 30px 15px 0; font-size: @font-size-sm; line-height: 30px; color: @text-color; padding: 10px 10px; } } .bc-dl{ width: 900px; height: 200px; color:#fff; margin: 20px 0 0; dt{ width: 160px; float: left; height: 170px; text-align: center; font-size: @font-size; img{ margin: 20px 30px 10px; } } dd{ float: left; font-size: @font-size-sm; line-height: 35px; border-left: 1px solid #fff; padding-left: 50px; ul{ list-style: square; li{ } } } } .bc-dl-p{ margin-left: 40px; font-size: @font-size; color: #fff; line-height: 35px; } .bc-img{ margin: 20px 50px; } .bc-city{ width: 900px; margin-left: 50px; margin-top: 20px; color: #fff; div:nth-of-type(1){ width: 830px; height: 190px; background: url("../images/city.jpg") no-repeat; h4:nth-of-type(1){ text-align: center; font-size: 42px; padding-top: 50px; } h4:nth-of-type(2){ width: 380px; margin-left:220px; text-align: center; font-size: @font-size; border: 1px solid #fff; font-weight: 500; margin-top: 10px; } } p{ font-size: @font-size-sm; line-height: 30px; width: 830px; } p:nth-of-type(1){ line-height: 35px; height: 35px; border-bottom: 1px solid #fff; } p:nth-of-type(2){ height: 130px; } h2{ margin-top: 15px; font-weight: 500; font-size: @font-size; line-height: 40px; } img{ margin-right: 5px; } } .bc-qiao{ background: @mod-bc + #111; color: #fff; font-size: @font-size; padding:10px 150px; margin-left: 230px; text-decoration: none; } .bc-qiao:hover{ background:@mod-bc ; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; -o-transition: all .5s; transition: all .5s; }