.main-case {
    padding: 20px 80px 50px 50px;
} 
@media (min-width: 992px) {
    * {
      margin: 0;
      padding: 0;
      list-style: none;
      font-family: "Microsoft JhengHei;", sans-serif;/*Noto Sans TC", sans-serif;*/
    }
    .about-img {
        overflow: hidden;
        max-height: 700px;
        position: relative;
        margin: auto;
        background: #000000;
        width: 100%;
    }
           
    .row {
        padding-bottom: 120px;
    }
    .client-img img{
        /* width: 10%; */
        max-width: 80%;
        position:absolute;
        top:-50px;
        margin-top: 0;
    }
    .main-case > .row > .client-bg > img{        
        position:absolute;
        bottom: -180px;
        left: -50px;
        z-index: -1;       
        max-width: 1918px;

    }
    .row .client-text img{
        max-width: 80%;  
        padding-top: 20px;
        padding-left:100px;    
    }
    .row .client-text p{
        color: rgb(68, 64, 64);
        position: relative;
        transform: translateY(-3px);
        transition: 0.3s;
        font-size: 24px;
        font-weight: 600;
        padding-right: 30px;
        /* padding-left: 100px;       */
        line-height:80px;
    }
    .row .client-text i {
        color: rgb(233, 85, 208);      
        font-size: 22px;
        padding-right: 10px;
        padding-left: 100px;
        line-height:40px;
    }

    .row .client-text span {        
        font-size: 22px;
        line-height:40px;
    }
    
    .decorate .item {
        position:relative;
        padding-top:20px;
        display:inline-block;
      }
      .item > img {
        max-width: 200px;
      }
      .decorate .notify-badge{
        position: absolute;
        right:-5px;
        top:50%;
        text-align: right;
        color:rgb(68, 64, 64);
        /* padding:5px 10px; */
        font-size:30px;
        font-weight: 600;
      }    
      .main-case .title{
        color: rgb(43, 144, 217);
        /* position: relative; */
        transform: translateY(-3px);
        transition: 0.3s;
        font-size: 36px;
        font-weight: 400;
        padding-right: 10px;
        padding-left: 85px;
        line-height:40px;
        /* text-indent: 2em;  第一句空兩格*/ 
        }   
    .main-case p{
        color: rgb(43, 144, 217);
        /* position: relative; */
        transform: translateY(-3px);
        transition: 0.3s;
        font-size: 26px;
        font-weight: 400;
        padding-right: 10px;
        padding-left: 85px;
        line-height:26px;
        /* text-indent: 2em;  第一句空兩格*/ 
    }   
   
    .main-case .map {
        max-width: 1020px;
    }
}

@media (min-width: 556px) and (max-width: 991px) {
    * {
        margin: 0;
        padding: 0;
        list-style: none;
        font-family: "Microsoft JhengHei;", sans-serif;/*Noto Sans TC", sans-serif;*/
    }
    .main-case .title{
        color: rgb(43, 144, 217);
        /* position: relative; */
        transform: translateY(-3px);
        transition: 0.3s;
        font-size: 20px;
        font-weight: 400;
        padding-right: 10px;
        padding-left: 68px;
        line-height:40px;
        /* text-indent: 2em;  第一句空兩格*/ 
        }   
    .main-case p{
        color: rgb(43, 144, 217);
        /* position: relative; */
        transform: translateY(-3px);
        transition: 0.3s;
        font-size: 16px;
        font-weight: 400;
        padding-right: 10px;
        padding-left: 68px;
        line-height:26px;
        /* text-indent: 2em;  第一句空兩格*/ 
    }   
    .decorate .item {
        position:relative;
        padding-top:20px;
        display:inline-block;
      }
      .item > img {
        max-width: 150px;
      }
      .decorate .notify-badge{
        position: absolute;
        right:-5px;
        top:50%;
        text-align: right;
        color:rgb(68, 64, 64);
        /* padding:5px 10px; */
        font-size:22px;
        font-weight: 500;
      }  
      .client-img img{
        /* width: 10%; */
        max-width: 100%;
        /* position:absolute; */
        padding-left: 80px;
        padding-top: 50px;
    }
    .main-case > .row > .client-bg > img{        
        position:absolute;
        bottom: -80px;
        left: -50px;
        z-index: -1;       
        max-width: 991px;

    }
    .row .client-text img{
        max-width: 50%;  
        padding-top: 20px;
        padding-left:100px;    
    }
    .row .client-text p{
        color: rgb(68, 64, 64);
        position: relative;
        transform: translateY(-3px);
        transition: 0.3s;
        font-size: 24px;
        font-weight: 600;
        padding-right: 30px;
        /* padding-left: 100px;       */
        line-height:80px;
    }
    .row .client-text i {
        color: rgb(233, 85, 208);      
        font-size: 22px;
        padding-right: 10px;
        padding-left: 100px;
        line-height:40px;
    }

    .row .client-text span {        
        font-size: 22px;
        line-height:40px;
    }  
}

@media (max-width: 555px) {
    * {
        margin: 0;
        padding: 0;
        list-style: none;
        font-family: "Microsoft JhengHei;", sans-serif;/*Noto Sans TC", sans-serif;*/
    }
    .decorate .item {
        position:relative;
        padding-top:20px;
        display:inline-block;
      }
      .item > img {
        max-width: 100px;
      }
      .decorate .notify-badge{
        position: absolute;
        right:-35px;
        top:50%;
        text-align: right;
        color:black;
        /* padding:5px 10px; */
        font-size:20px;
        font-weight: 400;
      }  
      .main-case .title{
        color: rgb(43, 144, 217);
        /* position: relative; */
        transform: translateY(-3px);
        transition: 0.3s;
        font-size: 16px;
        font-weight: 400;
        padding-right: 10px;
        padding-left: 20px;
        /* line-height:40px; */
        /* text-indent: 2em;  第一句空兩格*/ 
        }   
    .main-case p{
        color: rgb(43, 144, 217);
        /* position: relative; */
        transform: translateY(-3px);
        transition: 0.3s;
        font-size: 12px;
        font-weight: 400;
        padding-right: 10px;
        padding-left: 20px;
        /* line-height:26px; */
        /* text-indent: 2em;  第一句空兩格*/ 
    }   
    
    .client-img img{
        /* width: 10%; */
        max-width: 120%;
        /* position:absolute; */
        /* padding-left: 20px; */
        padding-top: 50px;
    }
    .main-case > .row > .client-bg > img{        
        position:absolute;
        bottom: -60px;
        left: -50px;
        z-index: -1;       
        max-width: 550px;

    }
    .row .client-text img{
        max-width: 80%;  
        padding-top: 30px;
        padding-left:50px;    
    }
    .row .client-text p{
        color: rgb(68, 64, 64);
        position: relative;
        transform: translateY(-3px);
        transition: 0.3s;
        font-size: 20px;
        font-weight: 400;
        padding-right: 30px;
        /* padding-left: 100px;       */
        line-height:80px;
    }
    .row .client-text i {
        color: rgb(233, 85, 208);      
        font-size: 20px;
        padding-right: 10px;
        padding-left: 20px;
        line-height:40px;
    }

    .row .client-text span {        
        font-size: 20px;
        line-height:40px;
    }  
}