
/*PC端样式*/
@media only screen and (min-width: 1200px) {
    .app-intro-1{
         background:url("/images/bg-channel-app-part-01.png");
         background-size: 100%;
         background-repeat: no-repeat;
         background-position: 0,0;
         margin-top:130px;
         margin-bottom:240px;
     }

    .app-intro-1-left{
        float:left;
        width:50%;
        margin-top: 12%;
    }

    .app-intro-1-left h3{
        font-size:3em;
        color:#4a4a4a;
        margin-bottom:20px;
    }

    .app-intro-1-left h3 small{
       color:#4a4a4a;
        display:block;
        font-size:14px;
        color:#a4a4a4;
    }

    .app-intro-1-left h4{
        font-size:2em;
        color:#4a4a4a;
    }

    .app-intro-1-left p{
        margin:10px 0px 50px 0px;
        width:500px;
    }

    .app-intro-1-left .icon-add{
        background-image:url("/images/bg-channel-app-part-03.png");
        height: 40px;
        width:40px;
        display:inline-block;
    }

    .app-intro-1-left  .button-download{
        width:50%;
        display:block;
        float:left;
    }

    .app-intro-1-left  .button-download a:hover{
       box-shadow:0px 2px 10px #47a0ff;
    }

    .app-intro-1-left  .qrcode-download{
        width:50%;
        display:block;
        float:right;
    }

    .app-intro-1-left  .qrcode-download img{
        width:100px;
        height:100px;
    }
    .app-intro-1-left  .qrcode-download p{
        width:100px;
        text-align:center;
    }

    .app-intro-1-left  .button-download a{
        float:left;
        width: 200px;
        text-align: center;
        margin-bottom:30px;
        border-radius:30px;
        background:#fff;
        border:1px solid #55a6ff;
        padding:5px 30px;
        cursor:pointer;
    }

     .app-intro-1-left  .button-download a img{
        height:20px;
        position: relative;
        top: -1px;
     }

    .app-intro-1-left  .button-download  a.ios{
        background-color:#55a6ff;
        background-repeat:no-repeat;
        background-position: 35px 4px;
        color:#fff;
    }


    .app-intro-1-left  .button-download a.android{
        background-repeat:no-repeat;
        background-position: 35px 4px;
        color:#55a6ff;
    }

    .app-intro-1-right{
        float:right;
        width:50%;
    }

     .app-intro-2{
          background:url("/images/bg-channel-app-part-05.jpg");
          background-size: 100%;
          background-repeat: no-repeat;
          background-position: 0,0;
          position:relative;
          margin: 200px 0px;
      }

       .app-intro-2  .app-intro-2-right {
            margin:100px;
            float:right;
       }
       .app-intro-2  .app-intro-2-right h3{
           font-size:2em;
           margin-bottom:30px;
           font-weight: bold;
       }

       .app-intro-2  .app-intro-2-right small{
          display:block;
          font-size:14px;
       }

       .app-intro-2  .app-intro-2-right *{
            color:#fff;
       }
       .app-intro-2 .app-intro-2-right p{
            font-size: 1.5em;
       }

       .app-intro-2 img.app-intro-2-left {
           position:absolute;
           display: block;
           width: 400px;
           bottom: -130px;
        }



     .app-intro-3{
          position:relative;
      }

      .app-intro-3  .text-tip{
         float:left;
         width: 50%;
         margin:100px 0px 400px 0px;
       }


       .app-intro-3  .text-tip h3{
           font-size:2em;
           margin-bottom:30px;
           color:#55a6ff;
           font-weight: bold;
       }

       .app-intro-3  .text-tip p{
          font-size: 1.5em;
       }


       .app-intro-3  .text-tip small{
          display:block;
          font-size:14px;
          color: #505050;
          font-weight: bold;
          position:relative;
          top:-2px;
       }


       .app-intro-3  img.app-intro-3-right{
             float:right;
             width:50%;
        }


    .app-intro-4{
          position:relative;
      }

      .app-intro-4  .text-tip{
            float: right;
            width: 40%;
            padding-left: 10%;
            margin: 200px 0px 200px 0px;
       }


       .app-intro-4  .text-tip h3{
           font-size:2em;
           margin-bottom:30px;
           color:#55a6ff;
           font-weight: bold;
       }

       .app-intro-4  .text-tip p{
          font-size: 1.5em;
       }


       .app-intro-4  .text-tip small{
          display:block;
          font-size:14px;
          color: #505050;
          font-weight: bold;
          position:relative;
          top:-2px;
       }


       .app-intro-4  img.app-intro-4-left{
             float:left;
             width:50%;
        }




        .section.background {
            background-image:url("/images/bg-channel-app-part-08.png");
             background-repeat:no-repeat;
             background-size:100%;
        }


       .bottom-button-download{
            display:block;
            margin:100px auto;
            text-align:center;
       }

       .bottom-button-download a{
           width: 200px;
           display: inline-block;
           text-align: center;
           border-radius:30px;
           background:#fff;
           border:1px solid #55a6ff;
           padding: 5px 30px;
           margin:0px 50px;
           cursor:pointer;
        }

         .bottom-button-download a img{
               height: 20px;
               position: relative;
               top: -1px;
          }

        .bottom-button-download a:hover{
               box-shadow:0px 2px 10px #47a0ff;
       }

       .bottom-button-download  a.ios{
            background-color:#55a6ff;
            color:#fff;
        }


        .bottom-button-download  a.android{
            color:#55a6ff;
        }

 }/*PC端样式*/




/*PC端样式*/
@media only screen and (min-width: 700px) and (max-width: 1200px) {
    .app-intro-1{
         background:url("/images/bg-channel-app-part-01.png");
         background-size: 100%;
         background-repeat: no-repeat;
         background-position: 0,0;
         height: 600px;
         margin-top:130px;
     }


    .app-intro-1-left{
        float:left;
        width: 60%;
        margin-top: 12%;
    }

    .app-intro-1-left h3{
        font-size:3em;
        color:#4a4a4a;
        margin-bottom:20px;
    }

    .app-intro-1-left h3 small{
       color:#4a4a4a;
        display:block;
        font-size:14px;
        color:#a4a4a4;
    }

    .app-intro-1-left h4{
        font-size:2em;
        color:#4a4a4a;
    }

    .app-intro-1-left p{
        margin:10px 0px 50px 0px;
    }

    .app-intro-1-left .icon-add{
        background-image:url("/images/bg-channel-app-part-03.png");
        height: 40px;
        width:40px;
        display:inline-block;
    }

    .app-intro-1-left  .button-download{
        width:60%;
        display:block;
        float:left;
    }

    .app-intro-1-left  .button-download a:hover{
       box-shadow:0px 2px 10px #47a0ff;
    }

    .app-intro-1-left  .qrcode-download{
        width:40%;
        display:block;
        float:right;
    }

    .app-intro-1-left  .qrcode-download img{
        width:100px;
        height:100px;
    }
    .app-intro-1-left  .qrcode-download p{
        width:100px;
        text-align:center;
    }

    .app-intro-1-left  .button-download a{
        float:left;
        text-align: center;
        margin-bottom:30px;
        border-radius:30px;
        background:#fff;
        border:1px solid #55a6ff;
        padding:5px 30px;
        cursor:pointer;
    }


     .app-intro-1-left  .button-download a img{
          height:20px;
          position: relative;
          top: -1px;
      }


    .app-intro-1-left  .button-download  a.ios{
        background-color:#55a6ff;
        background-repeat:no-repeat;
        background-position: 35px 4px;
        color:#fff;
    }


    .app-intro-1-left  .button-download a.android{
        background-repeat:no-repeat;
        background-position: 35px 4px;
        color:#55a6ff;
    }

    .app-intro-1-right{
        float:right;
        width:40%;
    }


     .app-intro-2{
          background:url("/images/bg-channel-app-part-05.jpg");
          background-size: 100%;
          background-repeat: no-repeat;
          background-position: 0,0;
          position:relative;
          margin: 60px 0px;
      }

       .app-intro-2  .app-intro-2-right {
            margin: 50px 0px 50px 200px;
            float: left;
       }
       .app-intro-2  .app-intro-2-right h3{
           font-size:2em;
           margin-bottom:30px;
           font-weight: bold;
       }

       .app-intro-2  .app-intro-2-right small{
          display:block;
          font-size:14px;
       }

       .app-intro-2  .app-intro-2-right *{
            color:#fff;
       }
       .app-intro-2 .app-intro-2-right p{
            font-size: 1em;
       }

       .app-intro-2 img.app-intro-2-left {
           position:absolute;
           display: block;
           width: 200px;
           bottom: -60px;
        }


    .app-intro-3{
           position:relative;
       }

       .app-intro-3  .text-tip{
          float:left;
          width: 50%;
          margin:100px 0px 200px 0px;
        }

        .app-intro-3  .text-tip h3{
            font-size:2em;
            margin-bottom:30px;
            color:#55a6ff;
            font-weight: bold;
        }

        .app-intro-3  .text-tip p{
           font-size: 1.5em;
        }


        .app-intro-3  .text-tip small{
           display:block;
           font-size:14px;
           color: #505050;
           font-weight: bold;
           position:relative;
           top:-2px;
        }


        .app-intro-3  img.app-intro-3-right{
              float:right;
              width:50%;
         }



    .app-intro-4{
          position:relative;
      }

      .app-intro-4  .text-tip{
            float: right;
            width: 40%;
            padding-left: 10%;
            margin: 150px 0px 150px 0px;
       }


       .app-intro-4  .text-tip h3{
           font-size:2em;
           margin-bottom:30px;
           color:#55a6ff;
           font-weight: bold;
       }

       .app-intro-4  .text-tip p{
          font-size: 1.5em;
       }


       .app-intro-4  .text-tip small{
          display:block;
          font-size:14px;
          color: #505050;
          font-weight: bold;
          position:relative;
          top:-2px;
       }


       .app-intro-4  img.app-intro-4-left{
             float:left;
             width:50%;
        }


        .section.background {
            background-image:url("/images/bg-channel-app-part-08.png");
             background-repeat:no-repeat;
             background-size:100%;
        }


       .bottom-button-download{
            display:block;
            margin:100px auto;
            text-align:center;
       }

       .bottom-button-download a{
           width: 200px;
           display: inline-block;
           text-align: center;
           border-radius:30px;
           background:#fff;
           border:1px solid #55a6ff;
           padding: 5px 30px;
           margin:0px 50px;
           cursor:pointer;
           margin-bottom:20px;
        }

       .bottom-button-download a img{
          height:20px;
          position: relative;
          top: -1px;
      }

        .download-tip{text-align:center;}

        .bottom-button-download a:hover{
               box-shadow:0px 2px 10px #47a0ff;
       }

       .bottom-button-download  a.ios{
            background-color:#55a6ff;
            color:#fff;
        }


        .bottom-button-download  a.android{
            color:#55a6ff;
        }

 }/*PC端样式*/


/*手机端样式*/
@media only screen and (max-width:700px) {
  .app-intro-1{
         background:url("/images/bg-channel-app-part-01.png");
         background-size: 100%;
         background-repeat: no-repeat;
         background-position: 0,0;
         margin-top:80px;
     }


    .app-intro-1-left h3{
        font-size:1.5em;
        color:#4a4a4a;
    }

    .app-intro-1-left h3 small{
       color:#4a4a4a;
        display:block;
        font-size:14px;
        color:#a4a4a4;
    }

    .app-intro-1-left h4{
        font-size:1.3em;
        color:#4a4a4a;
    }

    .app-intro-1-left p{
        margin-bottom:50px;
    }

    .app-intro-1-left .icon-add{
        background-image:url("/images/bg-channel-app-part-03.png");
        background-size:30px;
        background-repeat:no-repeat;
        height: 30px;
        width:30px;
        display:inline-block;
    }

    .app-intro-1-left  .button-download{
        width:60%;
        display:block;
        float:left;
    }

    .app-intro-1-left  .qrcode-download{
        width:40%;
        display:block;
        float:right;
    }

    .app-intro-1-left  .qrcode-download img{
        width: 70%;
        margin: 0px auto;
        display: block;
    }
    .app-intro-1-left  .qrcode-download p{
        width:90%;
        padding:0px 5%;
        text-align:center;
    }

    .app-intro-1-left  .button-download a{
        display:block;
        width: 75%;
        text-align: center;
        float:left;
        margin-bottom:20px;
        border-radius:30px;
        background:#fff;
        border:1px solid #55a6ff;
        padding:5px 20px;
    }

    .app-intro-1-left  .button-download a img{
        height:20px;
        position: relative;
        top: -1px;
     }

    .app-intro-1-left  .button-download  a.ios{
        background-color:#55a6ff;
        background-repeat:no-repeat;
        background-position: 20px 4px;
        color:#fff;
    }


    .app-intro-1-left  .button-download  a.android{
        background-repeat:no-repeat;
        background-position: 20px 4px;
        color:#55a6ff;
    }

    .app-intro-1-right{
        display:block;
        width:90%;
        margin:0px auto;
    }



     .app-intro-2{
          background:url("/images/bg-channel-app-part-05.jpg");
          background-size: 100%;
          background-repeat: no-repeat;
          background-position: 0,0;
          position:relative;
          margin: 40px 0px;
      }

       .app-intro-2  .app-intro-2-right {
            margin: 50px 0px 50px 120px;
            float: left;
       }
       .app-intro-2  .app-intro-2-right h3{
           font-size: 1.2em;
           margin-bottom: 10px;
           font-weight: bold;
       }

       .app-intro-2  .app-intro-2-right small{
          display:block;
          font-size:10px;
       }

       .app-intro-2  .app-intro-2-right *{
            color:#fff;
       }
       .app-intro-2 .app-intro-2-right p{
            font-size: 1em;
       }

       .app-intro-2 img.app-intro-2-left {
            position: absolute;
            display: block;
            width: 120px;
            bottom: -10px;
        }




    .app-intro-3{
           position:relative;
       }

   .app-intro-3  .text-tip{
      float:left;
      width: 50%;
      margin:50px 0px 50px 0px;
    }

    .app-intro-3  .text-tip h3{
        font-size: 1.2em;
        margin-bottom: 20px;
        color: #55a6ff;
        font-weight: bold;
    }

    .app-intro-3  .text-tip p{
       font-size: 1em;
    }


    .app-intro-3  .text-tip small{
       display:block;
       font-size:10px;
       color: #505050;
       font-weight: bold;
       position:relative;
       top:-2px;
    }


    .app-intro-3  img.app-intro-3-right{
          float:right;
          width:50%;
     }



     .app-intro-4{
        position:relative;
    }

    .app-intro-4  .text-tip{
       float:right;
       width: 45%;
       padding-left: 10%;
       margin:50px 0px 50px 0px;
     }

     .app-intro-4  .text-tip h3{
         font-size: 1.2em;
         margin-bottom: 20px;
         color: #55a6ff;
         font-weight: bold;
     }

     .app-intro-4  .text-tip p{
        font-size: 1em;
     }


     .app-intro-4  .text-tip small{
        display:block;
        font-size:10px;
        color: #505050;
        font-weight: bold;
        position:relative;
        top:-2px;
     }


     .app-intro-4  img.app-intro-4-left{
           float:left;
           width:45%;
      }




   .section.background {
        background-image:url("/images/bg-channel-app-part-08.png");
         background-repeat:no-repeat;
         background-size:100%;
         background-color: #fff;
    }

   .bottom-button-download{
        display:block;
        margin:10px auto;
        text-align:center;
   }

   .bottom-button-download a{

        border-radius:30px;
        background:#fff;
        border:1px solid #55a6ff;
        padding: 5px 30px;
         width:40%;
        display:block;
        margin:20px auto;
    }


   .bottom-button-download a img{
      height:20px;
      position: relative;
      top: -1px;
  }


   .bottom-button-download  a.ios{
        background-color:#55a6ff;
        color:#fff;
    }


    .bottom-button-download  a.android{
        color:#55a6ff;
    }

}
