@charset "utf-8";

.about { width:100%; position:relative; }
.about .cont { text-align:center; }
.about .img_wrap {width:100%; padding:250px 0;}
.about .img_wrap img {width:100%; }
.about .img_wrap .pcblk {max-width:500px; margin:0 auto;}
.about .img_wrap .mobblk {max-width:300px; margin:0 auto;}

.about .top_cont,
.about .left_cont,
.about .right_cont {position:absolute; width:500px; border:1px solid #ddd; border-radius:20px; padding:40px 50px; }

.about .top_cont {top:0; left:50%; transform:translateX(-50%);}
.about .left_cont {bottom:0; left:0; }
.about .right_cont {bottom:0; right:0; }

.about .cont .contTit {position:relative; display:inline-block;}
.about .cont .contTit:after {content:""; position:absolute; bottom:25px; left:0; width:100%; height:12px; background-color:#b0dbf8; opacity:.5; transition: all 0.3s; z-index: -1;}

.pcblk {display:block;}
.mobblk {display:none;}

@media screen and (max-width:1100px){
  .about .img_wrap {width:100%; padding:0 0 30px;}
  .about .top_cont,
  .about .left_cont,
  .about .right_cont {position:relative; margin:10px 0;  padding:30px 40px;  }
  .about .left_cont { left:50%; transform:translateX(-50%);}
  .about .right_cont { right:0; left:50%; transform:translateX(-50%);}
}

@media screen and (max-width:768px){
  .pcblk {display:none;}
  .mobblk {display:block;}
  .about .top_cont,
  .about .left_cont,
  .about .right_cont {width:80%; }
  .about h3:after { height:8px; }
  .about .cont .contTit:after {bottom:15px;}
}
@media screen and (max-width:560px){
  .about .top_cont,
  .about .left_cont,
  .about .right_cont { width:100%; }
}