.main-service {
  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;*/
    }   
    .main-service .row{
      padding-left: 45px;
    }
    .main-service .pic img {
      width: 100%;
    }
    .main-service .pic .pic_chang img {
      width: 97.5%;
    }
    
    .main-service .pic .pic_chang {
      position: absolute;
      top: 0;
      opacity: 0;
    }
    .main-service .pic:hover .pic_chang {
      opacity: 1;
      transition: opacity 2s;
    }
    
    .decorate .item {
      position:relative;
      padding-top:20px;
      display:inline-block;
    }
    .item > img {
      max-width: 200px;
    }
    .decorate .notify-badge{
      position: absolute;
      right:-75px;
      top:50%;
      text-align: right;
      color:rgb(68, 64, 64);
      /* padding:5px 10px; */
      font-size:30px;
      font-weight: 600;
    } 
        
    .main-service p {
      /* text-decoration: none; */
      color: rgb(68, 64, 64);
      /* padding: 5px 1em; */
      padding: 1em;
      position: relative;
      transform: translateY(-3px);
      transition: 0.3s;
      font-size: 22px;
      font-weight: 500;
      padding-right: 30px;
      padding-left: 50px;
      /* letter-spacing:8px; */
      line-height:80px;
      /* text-indent: 2em;  第一句空兩格*/ 
    }
  }
  
  @media (min-width: 768px) and (max-width: 991px) {
    * {
      margin: 0;
      padding: 0;
      list-style: none;
      font-family: "Noto Sans TC", sans-serif;
    }
    .main-service .row{
      padding-left: 45px;
    }
    .main-service .pic img {
      width: 100%;
    }
    .main-service .pic .pic_chang img {
      width: 96%;
    }
    
    .main-service .pic .pic_chang {
      position: absolute;
      top: 0;
      opacity: 0;
    }
    .main-service .pic:hover .pic_chang {
      opacity: 1;
      transition: opacity 2s;
    }
    .decorate .item {
      position:relative;
      padding-top:20px;
      display:inline-block;
    }
    .item > img {
      max-width: 150px;
    }
    .decorate .notify-badge{
      position: absolute;
      right:-65px;
      top:50%;
      text-align: right;
      color:rgb(68, 64, 64);
      /* padding:5px 10px; */
      font-size:22px;
      font-weight: 500;
    }   
    .main-service p {
      /* text-decoration: none; */
      color: rgb(68, 64, 64);
      /* padding: 5px 1em; */
      padding: 1em;
      position: relative;
      transform: translateY(-3px);
      transition: 0.3s;
      font-size: 18px;
      font-weight: 400;
      padding-right: 30px;
      padding-left: 50px;
      /* letter-spacing:8px; */
      line-height:50px;
      /* text-indent: 2em;  第一句空兩格*/ 
    } 
  }
  @media (min-width: 556px) and (max-width: 767px) {
    * {
      margin: 0;
      padding: 0;
      list-style: none;
      font-family: "Noto Sans TC", sans-serif;
    }
    .main-service .row{
      padding-left: 45px;
    }
    .main-service .pic img {
      width: 100%;
    }
    .main-service .pic .pic_chang img {
      width: 97.5%;
    }
    
    .main-service .pic .pic_chang {
      position: absolute;
      top: 0;
      opacity: 0;
    }
    .main-service .pic:hover .pic_chang {
      opacity: 1;
      transition: opacity 2s;
    }
    .decorate .item {
      position:relative;
      padding-top:20px;
      display:inline-block;
    }
    .item > img {
      max-width: 150px;
    }
    .row > img {
      display:block; margin:auto;
    }
    .decorate .notify-badge{
      position: absolute;
      right:-65px;
      top:50%;
      text-align: right;
      color:rgb(68, 64, 64);
      /* padding:5px 10px; */
      font-size:22px;
      font-weight: 500;
    }   
    .main-service p {
      /* text-decoration: none; */
      color: rgb(68, 64, 64);
      /* padding: 5px 1em; */
      padding: 1em;
      position: relative;
      transform: translateY(-3px);
      transition: 0.3s;
      font-size: 18px;
      font-weight: 400;
      padding-right: 30px;
      padding-left: 50px;
      /* letter-spacing:8px; */
      line-height:50px;
      /* text-indent: 2em;  第一句空兩格*/ 
    } 
  }
  
  @media (max-width: 555px) {
    * {
      margin: 0;
      padding: 0;
      list-style: none;
      font-family: "Noto Sans TC", sans-serif;
    }
    .main-service .pic img {
      padding-top: 30px;
      width: 100%;
    }
    .main-service .pic .pic_chang img {
      width: 97.5%;
    }
    
    .main-service .pic .pic_chang {
      position: absolute;
      top: 0;
      opacity: 0;
    }
    .main-service .pic:hover .pic_chang {
      opacity: 1;
      transition: opacity 2s;
    }
    .item > img {
      max-width: 100px;
    }
    .decorate .notify-badge{
      position: absolute;
      right:-35px;
      top:50%;
      text-align: right;
      color:rgb(68, 64, 64);
      /* padding:5px 10px; */
      font-size:20px;
      font-weight: 400;
    }   
    .main-service .row img{
      max-width: 80%;
      display:block; margin:auto;
    }
    .main-service p {
      /* text-decoration: none; */
      color: rgb(68, 64, 64);
      /* padding: 5px 1em; */
      padding: 1em;
      position: relative;
      transform: translateY(-3px);
      transition: 0.3s;
      font-size: 18px;
      font-weight: 400;
      padding-right: 30px;
      padding-left: 50px;
      /* letter-spacing:8px; */
      line-height:50px;
      /* text-indent: 2em;  第一句空兩格*/ 
    } 
  }
  