@charset "UTF-8";
.banner{ background: url(../images/bg2.png)no-repeat center top; width: 100%; background-size: 100% 100%; height: 380px; overflow: hidden; position: relative;}
.banner .text{ width: 70%; margin: 0 auto; display: flex; align-items: center; justify-content: center; margin-top: 140px; } 
.banner .text h1{ color: #002c23; font-size: 42px; padding-bottom: 50px; white-space: nowrap;}
.banner .text img{ margin-bottom: -20px; margin-right: 200px;}


.problem{ width: 100%; margin: 50px auto 100px;}
.problem ul{ width: 80%; margin: 0 auto; }
.problem ul li{ width: calc(100% - 8%); background: #fff; padding: 35px 4%; margin: 0 auto 25px;}
.problem ul li h4{ font-size: 18px; font-weight: bold; text-align: left; color: #171717; line-height: 32px; display: flex; justify-content: flex-start; width: 100%;}
.problem ul li h4 i{ width:32px; height: 32px; display: block; background: url(../images/QA.png)no-repeat center center; font-size: 0; vertical-align: middle; margin-right: 20px;}
.problem ul li h4 span{ width: calc(100% - 52px);}
.problem ul li:nth-child(2n-1){ background:#edfaf3}
.problem ul li p{ padding: 10px 0 10px 52px;} 


@media(max-width:960px)

{
    .banner{ margin-top: 50px; height: 120px;}
    .banner .text h1{ color: #002c23; font-size: 24px;  position: absolute; top:50px; z-index: 2;}
    .banner .text img{ width: 30%; position: absolute; bottom: 0; z-index: 1;right: 0px; margin-right: 0;}
    .problem ul{ width: calc(100% - 30px);}
.problem ul li h4{ font-size: 14px; line-height: 28px; justify-content: flex-start; }
.problem ul li p{ font-size: 12px;  }
}