yundewu-website/page_financial/less/style.less

@subject-maxwidth:1460px;
@subject-minwidth:1220px;
@font-face {
  font-family: 'iconfont';
  src: url('../../iconfont/iconfont.eot');
  src: url('../../iconfont/iconfont.eot?#iefix') format('embedded-opentype'),
  url('../../iconfont/iconfont.woff') format('woff'),
  url('../../iconfont/iconfont.ttf') format('truetype'),
  url('../../iconfont/iconfont.svg#iconfont') format('svg');
}
*{
  margin:0;
  padding:0;
  list-style: none;
  border:none;
  font-style: normal;
}
html{
  width:100%;
  min-width: @subject-minwidth;
  font-family:"Source Han Sans SC","HanHei SC","PingFang SC","Helvetica Neue",Helvetica,"Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
}
img{
  display:block;
}
a{
  text-decoration: none;
  color: #333;
}

.iconfont{
  font-family:"iconfont" !important;
  font-size:14px;font-style:normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}
.banner-box{
  img{
    width: 100%;
  }
}
.bgc{
  width: 1220px;
  margin: 0 auto;
  padding: 20px 0;
}
.presentation-box{
  padding: 30px 0 0;
  .presentation-module{
    width: 100%;
    background: #fff;
    .presentation-title{
      font-size: 40px;
      font-weight: 400;
      margin-bottom: 50px;
    }
    .presentation-content:after{
      content:'';
      display: block;
      clear: both;
    }
    .presentation-content{
      margin-bottom: 30px;
      .img,.text{
        float: left;
      }
      .img{
        width: 600px;
        img{
          width:100%;
        }
      }
      .text{
        width: 600px;
        padding-left: 30px;
        box-sizing: border-box;
        p{
          font-size: 20px;
          line-height: 33px;
          letter-spacing:2px;
        }
      }
    }
  }
  .guarantee-type{
    width: 100%;
    background: #ebf0f5;
    .guarantee-title{
      font-size: 40px;
      font-weight: 400;
      margin: 25px 0;
    }
    .guarantee-content{
      ul:after{
        content: '';
        display: block;
        clear: both;
      }
      ul{
        li{
          width: 370px;
          float: left;
          margin: 15px;
          background: #fff;
          box-shadow: 0 0 10px #999;
          .img{
            width: 100%;
          }
          .text{
            width: 100%;
            height: 300px;
            h3{
              padding: 15px;
              font-weight: 400;
              font-size: 30px;
            }
            p{
              padding: 15px;
              color: #666;
            }
          }
        }
      }
    }
  }
  .trait{
    width: 100%;
    background: #555f69;
    .trait-title{
      font-size: 40px;
      font-weight: 400;
      margin: 25px 0;
      color: #fff;
    }
    .trait-content{
      ul:after{
        content: '';
        display: block;
        clear: both;
      }
      ul{
        li{
          width: 370px;
          float: left;
          margin: 15px;
          background: #fff;
          box-shadow: 0 0 3px #000;
          .img{
            width: 100%;
          }
          .text{
            width: 100%;
            height: 100px;
            h3{
              padding: 15px;
              font-weight: 400;
              font-size: 20px;
            }
          }
        }
      }
    }
  }
  .flow:after{
    content: '';
    display: block;
    clear: both;
  }
  .flow{
    background: #ebf0f5;
    padding: 20px;
    .detailed-title,.detailed-title{
      font-size: 30px;
      font-weight: 400;
      margin: 25px 0;
    }
    .detailed,.flow-box{
      float: left;
      width: 50%;
    }
    .detailed{

      li{
        position: relative;
        height: 120px;
        border-left: 2px solid #999;
        p{
          font-size: 20px;
          color: #333;
          padding-left: 30px;
          padding-top: 5px;
        }
        .dot{
          position: absolute;
          background: #fff;
          width: 20px;
          height: 20px;
          left: -12px;
          top: 0px;
          border-radius: 50%;
          border: 1px solid #999;
        }
      }

    }
  }
}

@media screen and (min-width: 1460px){

}