#page {
  background: #FFF url(../images/bg.jpg) no-repeat top center;
  background-size: 100% auto; }
  #page .header {
    padding: 10rem 0 2rem 0;
    color: #FFF;
    background: url(../images/line.png) no-repeat bottom center; }
    #page .header .logo {
      max-width: 6rem;
      display: inline-block;
      vertical-align: top; }
    #page .header .hd_div {
      display: inline-block;
      padding-left: 15px; }
      #page .header .hd_div h3 {
        margin-bottom: 0; }
      #page .header .hd_div p {
        margin-bottom: 0.5rem; }
        #page .header .hd_div p.version {
          opacity: 0.5; }
    #page .header .home-button {
      margin-top: 1.5rem; }
      #page .header .home-button a {
        color: #FFF;
        display: inline-block;
        text-decoration: none;
        border: 1px solid #FFF;
        border-radius: 0.4rem;
        height: 3rem;
        line-height: 3rem;
        width: 100%;
        text-align: center;
        font-size: 0.8rem; }
        #page .header .home-button a.active, #page .header .home-button a:hover {
          background-color: rgba(255, 255, 255, 0.3); }
        #page .header .home-button a:first-child {
          margin-bottom: 1.2rem; }
        #page .header .home-button a i {
          display: inline-block;
          vertical-align: middle;
          width: 1.5rem; }
          #page .header .home-button a i.android {
            background: url(../images/android.png) no-repeat;
            background-size: auto 1.5rem;
            height: 1.5rem; }
          #page .header .home-button a i.apple {
            background: url(../images/ios.png) no-repeat;
            background-size: auto 1.5rem;
            height: 1.5rem; }
    #page .header .download {
      text-align: center;
      margin-top: 1.5rem; }
      #page .header .download img {
        width: 6.9rem;
        display: block; }
      #page .header .download p {
        padding-top: 0.2rem;
        width: 6.9rem;
        font-size: 0.8rem; }
  #page .nav {
    color: #FFF;
    padding: 2rem 0; }
    #page .nav .col-md-3 {
      border-left: 1px solid rgba(255, 255, 255, 0.3); }
      #page .nav .col-md-3:first-child {
        border-left: none; }
      #page .nav .col-md-3 h3 {
        font-size: 1rem; }
      #page .nav .col-md-3 p {
        margin-bottom: 0;
        opacity: 0.5;
        font-size: 0.8rem; }
  #page .content {
    background: #FFF; }
    #page .content img {
      display: block;
      width: 100%; }
    #page .content .ios-content {
      color: #f78d8d;
      text-align: right;
      padding: 12rem 4rem 0 0; }
      #page .content .ios-content h2 {
        font-size: 3rem; }
      #page .content .ios-content h3 {
        font-size: 2rem;
        font-weight: normal; }
      #page .content .ios-content a {
        display: inline-block;
        height: 2.5rem;
        line-height: 2.5rem;
        text-decoration: none;
        color: #FFF;
        background: #f78d8d;
        padding: 0 2.5rem;
        border-radius: 1rem; }
    #page .content .intro {
      background: url(../images/bg-2.jpg) no-repeat top left;
      background-size: 100% 678px;
      min-height: 678px;
      color: #f78d8d;
      padding-top: 4rem; }
      #page .content .intro img {
        width: 80%; }
      #page .content .intro .col-md-4 {
        padding: 10rem 0 9rem 0; }
        #page .content .intro .col-md-4 img {
          width: 50%;
          margin-top: 5rem; }
        #page .content .intro .col-md-4 h2 {
          font-size: 3rem; }
        #page .content .intro .col-md-4 p {
          margin-bottom: 0; }
    #page .content .android-content {
      background: url(../images/bg-3.jpg) no-repeat top left;
      background-size: 100% 1077px;
      min-height: 1077px;
      padding-top: 9rem; }
      #page .content .android-content .col-md-4 {
        color: #FFF;
        text-align: right;
        padding-top: 8rem;
        padding-right: 4rem; }
        #page .content .android-content .col-md-4 h2 {
          font-size: 3rem; }
        #page .content .android-content .col-md-4 h3 {
          font-size: 2rem;
          font-weight: normal; }
        #page .content .android-content .col-md-4 a {
          display: inline-block;
          height: 2.5rem;
          line-height: 2.5rem;
          text-decoration: none;
          color: #f78d8d;
          background: #fff;
          padding: 0 2.5rem;
          border-radius: 1rem; }
      #page .content .android-content .col-md-6 {
        padding: 0; }
        #page .content .android-content .col-md-6 img {
          width: 80%; }
      #page .content .android-content .ft_logo {
        position: absolute;
        bottom: 2rem; }
        #page .content .android-content .ft_logo .logo {
          max-width: 3rem;
          display: inline-block;
          vertical-align: top; }
        #page .content .android-content .ft_logo .ft_div {
          display: inline-block;
          color: #f78d8d; }
          #page .content .android-content .ft_logo .ft_div h3 {
            font-size: 1rem; }
          #page .content .android-content .ft_logo .ft_div p {
            font-size: 0.8rem; }
  #page .footer {
    text-align: center;
    color: rgba(0, 0, 0, 0.5);
    font-size: 0.9rem; }
    #page .footer a {
      color: rgba(0, 0, 0, 0.5); }
  #page .floating_ck {
    position: fixed;
    right: 20px;
    top: 75%;
    font-size: 0.8rem;
    color: #FFF; }
    #page .floating_ck dl dd {
      position: relative;
      width: 60px;
      background-color: #646577;
      border-bottom: solid 1px #555666;
      text-align: center;
      background-repeat: no-repeat;
      background-position: center 20%;
      cursor: pointer;
      background-size: 40% auto; }
      #page .floating_ck dl dd span {
        padding-top: 40px;
        display: inline-block; }
      #page .floating_ck dl dd:hover {
        background-color: rgba(255, 192, 0, 0.8);
        border-bottom: solid 1px rgba(255, 192, 0, 0.8); }
        #page .floating_ck dl dd:hover .floating_left {
          display: block; }
      #page .floating_ck dl dd.work {
        background-image: url(../images/work.png); }
        #page .floating_ck dl dd.work:hover {
          background-image: url(../images/work_hover.png);
          color: #333; }
      #page .floating_ck dl dd.return {
        background-image: url(../images/top.png); }
        #page .floating_ck dl dd.return:hover {
          background-image: url(../images/top_hover.png);
          color: #333; }
    #page .floating_ck .floating_left {
      position: absolute;
      left: -160px;
      bottom: -1px;
      width: 160px;
      background-color: rgba(255, 192, 0, 0.8);
      border-bottom: solid 1px rgba(255, 192, 0, 0.8);
      display: none;
      color: #333;
      padding: 15px 0; }
      #page .floating_ck .floating_left h3 {
        font-size: 1rem; }
      #page .floating_ck .floating_left p {
        font-size: 0.9rem;
        margin: 0.5rem 0;
        font-weight: bolder; }
      #page .floating_ck .floating_left img {
        width: 25px; }
  @media screen and (max-width: 1024px) {
    #page .header {
      padding: 5rem 0 2rem 0; }
    #page .nav .col-md-3 p {
      font-size: 0.6rem; }
    #page .content .ios-content {
      padding: 8rem 4rem 0 0; }
    #page .content .intro .col-md-4 img {
      margin-top: 7rem; } }
  @media screen and (min-width: 1360px) {
    #page .content .ios-content {
      padding: 12rem 12rem 0 0; }
    #page .content .intro img {
      width: 70%; }
    #page .content .intro .col-md-4 {
      padding: 8rem 0 7rem 0; }
    #page .content .android-content {
      padding-top: 2rem; }
      #page .content .android-content .col-md-4 {
        padding-top: 12rem;
        padding-right: 12rem; }
      #page .content .android-content .col-md-6 img {
        width: 70%; } }

/*# sourceMappingURL=home.css.map */
