﻿@charset "utf-8";
/* 設計師用 RWD版CSS檔 style_rwd.css */
/* 說明：
    可提供設計師在此檔，針對RWD版面進行設計；非RWD版面則不需載此CSS檔。*/

@media (max-width: 1700px) {
    .banner .banner_bg .hand01 {
        left: 3%;
    
    }
    .banner .banner_bg .hand01  img{
        width:80%
    }
    .banner .banner_bg .hand02.aos-animate {
        right: 10%;
    }
    .banner .banner_bg .hand02 {
        bottom: -60px;
      
    }
        .banner .banner_bg .hand02  img{
            width:90%;
        }
        .banner .banner_bg .hand03.aos-animate {
            top: 14%;
        }
    .banner .banner_bg .hand03 {
        right: 16%;
       
    }
    .banner .banner_bg .hand04 {
        top: 38%;
      
    }
}

@media (max-width: 1450px) {
    .banner .banner_bg .hand04 {
        right: 13%;
      
    }
    .banner .banner_bg .hand04 img{
        width:80%;
    }
    .banner .banner_bg .hand03 {
        right: 15%;
    }
    .banner .banner_bg .hand03.aos-animate {
        top: 17%;
    }
    .banner .banner_bg .hand03 .Loudly  img{
        width:80%;
    }
    .banner .banner_bg .hand01 {
        left: 70px;
    }
    .banner .banner_bg .hand01.aos-animate  img{
        width:70%;
    }
}

@media (max-width: 1350px) {
    .banner .banner_bg .hand01.aos-animate img {
        width: 65%;
    }
    .banner .banner_bg .hand01 {
        left: 50px;
    }
}




    @media (max-width: 1199px) {
        .home_three .more2 {
            bottom: 80px;
         
        }
        .home_appli ul li:before {
            border-width: 4px 0 4px 8px;
            top: 11px;
        }

        .home_appli ul li {
            font-size: 16px;
        }

        .home_appli .app_share h4 {
            font-size: 20px;
            line-height: 28px;
        }

        .home_three .more2 {
            font-size: 14px;
        }

        .home_three h3 {
            font-size: 24px;
            display: contents;
            line-height: 44px;
        }

        a.cont_tel {
            font-size: 20px;
        }

        .home_cont .co_time label span,
        .home_cont .co_four label span {
            font-size: 14px;
        }

        .home_cont2 p {
            font-size: 16px;
        }

        .home_cont h4 {
            font-size: 20px;
        }

        .plan_right .we_a ul li {
            font-size: 14px;
        }

        .plan_right .we_a p.pink {
            font-size: 16px;
        }

        .plan_right .we_a h4 {
            font-size: 20px;
        }

        body.home .home_appli .appli_bg2 {
            top: -119px;
        }

        .home_three .d_flex2 .plan_left_icon01 img {
            right: -100px;
        }

        .home_three .people img {
            left: -40px;
            bottom: 0px;
        }

        .home_three .plan_left_icon01 img,
        .home_plan .thre_1 img,
        body.home .home_appli .appli_bg2 img {
            width: 70%;
        }

        body.home .main_content .more {
            font-size: 18px;
        }

        .footer .home_fot ul li span {
            font-size: 16px;
            display: block;
        }

        body.home .h2 {
            font-size: 36px;
        }

        .home_plan .pla_1 h3 {
            font-size: 28px;
        }

        .home_plan .pla_1 span {
            font-size: 70px;
            left: -50px;
            top: -60px;
        }

        .home_plan .pla_1 {
            padding: 20px 10px;
            min-width: 280px;
            margin: 0 10px;
        }

        .banner .banner_bg .hand02.aos-animate,
        .banner .banner_bg .hand04,
        .banner .banner_bg .hand03,
        .banner .banner_bg .hand01 {
            display: none;
        }

        .banner .ban_p {
            display: none;
        }

        .banner .ban_ps {
            display: block;
        }

        .header .banner .bxslider li {
            height: auto;
        }

            .header .banner .bxslider li img {
                display: block;
            }

        .header .navbar .navbar-nav {
            margin-top: 30px;
            clear: both;
            float: none;
            text-align: center;
        }

            .header .navbar .navbar-nav > li {
                float: none;
                display: inline-block;
            }

        .header .navbar .navbar-header {
            float: none;
        }

        .header .navbar .navbar-brand {
            float: none;
            margin: 23px auto 15px;
        }

        #floating {
            margin-top: -90px;
        }
        body.home.index2 .mai_one {
            width: 90%;
        }
    }

    @media (max-width: 991px) {
        body.home.index2 .mai_one {
            padding: 10px 20px 50px;
        }

        body.home.index2 .main_content .mai_one h4 {
            font-size: 16px;
            padding: 16px 30px;
        }

        body.home.index2 .mai_one h3, body.home.index2 .mai_one h2 {
            text-align: left;
            font-size: 24px;
            line-height: 38px;
        }

        body.home.index2 .main_content .home_bg {
            padding: 90px 0 140px;
        }
        .home_three:before {
            top: 15%;
        }
        body.home .main_content {
            padding-bottom: 0;
        }
        .home_cont:before {
            background: url(../images/all/cont_bgs.jpg)no-repeat center bottom;
            background-size: cover;
            height: auto;
            bottom: 0;
            top: -60%;
        }
        .footer .home_fot ul li span {
            display: inline-block;
        }



        .home_cont2:before {
            width: 100%;
            height: 50%;
            top: 14px;
        }

        .home_cont .cont_left,
        .home_cont .cont_right {
            width: 100%;
            padding: 0;
        }

        .yellow {
            color: #f71c5a;
        }

     

        .home_three .d_flex2 .people img {
            right: 10%;
        }

        .home_three .d_flex2 .plan_left_icon01 img {
            right: 50px;
        }

        .home_three .people img {
            left: 26%;
        }

        .home_three .plan_left_icon01 img {
            width: 30%;
            left: 60px;
        }

        .home_three .plan_right,
        .home_three .plan_left {
            width: 100%;
        }

        .home_appli ul li:before {
            top: 5px;
        }

        .home_appli ul li {
            line-height: 22px;
            padding-bottom: 15px;
        }

        .home_appli .app_share {
            width: 200px;
            height: 200px;
        }

        .home_plan .h3_t {
            font-size: 24px;
        }

        .home_plan .pla_1 h3 {
            font-size: 24px;
        }

        .home_plan .pla_1 {
            min-width: 200px;
        }

        .header .navbar .navbar-nav {
            padding: 0;
            margin: 30px -20px 0;
        }

        .content .btn-more {
            top: 12px;
        }

        .side {
            padding-bottom: 20px;
        }

            .side .nav {
                max-width: none;
                margin: 0;
                display: none;
            }

            .side.menu-open .nav {
                display: block;
            }

            .side .nav > li {
                float: none;
                display: inline-block;
                border: 0;
                margin: 0 5px;
                vertical-align: top;
            }

                .side .nav > li + li {
                    border: 0;
                }

        .banner .ban_ps {
            display: block;
        }

        .banner .ban_p {
            display: none;
        }
        .home_three .more2 {
            bottom: 122px;
        }
    }

    @media (max-width: 767px) {
        .home_three .more2 {
            bottom: 62px;
        }
        body.home.index2 .main_content .home_bg {
            background: url(../images/_banners/banner2s.jpg) no-repeat center;
        
        }
        .footer .home_fot ul li a {
         
            padding-bottom: 0;
        }
        .terms_w p{
            font-size:14px;
        }
        .terms_w h4 {
            padding: 10px 10px;
        }
        .terms_w {
            padding: 0 10px;
        }
        .home_plan .pla_1 h3 {
            font-size: 20px;
        }
        .home_three h4.rtf_x span.yellow {
            color: #fff105;
        }
        .home_three h4.rtf_x {
            font-size: 18px;
         
        }
        .home_three .plan_left .pic img{
            width:70%;

        }
        body.home .home_plan .h2 {
            margin-top: 0;
            line-height: 32px;
        }
            body.home .home_plan .h2 span{
             
            }
            .home_plan .h3_t span {
                display: block;
                font-size: 34px;
                padding: 10px 0
            }
        .home_plan h4 span {
            display: block;
        }
        .home_appli ul {
            width: auto;
            display: table;
        }
        .home_three:before {
            background: url(../images/all/home_three_bgs.jpg) no-repeat center;
            height: 2000px;
            top: 40%;
       
       
        }
        .home_cont:before {
            top: -4%;
        }
        body.home .home_cont h2.h2 {
            padding-top: 0;
        
        }
        .footer .home_fot ul li a img{
            width:50%;

        }
        .footer .home_fot ul li span {
            font-size: 12px;
           
        }
        .home_cont .co_share .co_tree input.form-control, .home_cont .co_share .co_two input {
            height: 35px;
        }
        .home_cont2 p {
            font-size: 14px;
        }
        .home_cont   .co_agree {
            margin-top: 20px;
        }
        .home_cont .cont_right .co_share .co_two img {
            margin-left: 10px;
        }
        .home_cont textarea {
            height: 110px;
        }
        .home_cont2:before {
            height: 62%;
         
        }
        .co_share .radio-inline.se_ecx {
            padding-top: 0;
            margin-top: -15px;
        }
        .home_cont .cont_right{
            margin-top:25px;
        }
        .home_cont .co_share {
            margin-bottom: 0;
        }

        .home_plan .h3_t {
            font-size: 20px;
            line-height: 32px;
            text-align: left;
        }

        .home_plan .pla_1 span {
            font-size: 54px;
            left: -33px;
            top: -38px;
        }

        a.cont_tel {
            font-size: 16px;
            padding: 16px 20px;
            margin: 40px auto 60px;
        }

        .home_cont2 {
            padding: 20px;
        }

        .home_cont .cont_right .co_share .co_two {
            width: 50%;
            margin-bottom: 0;
        }

        .co_time .radio-inline {
          
            margin-left: 0;
        }

        .home_cont .co_tree,
        .home_cont .co_two {
            width: 100%;
            margin-bottom: 10px;
            padding-right: 0;
        }

        .home_three .people img {
            left: 20%;
        }

        .home_three .plan_left_icon01 img {
            left: 0;
            top: -30px;
        }

        body.home .main_content .home_plan .more:before {
            width: 56px;
            height: 73px;
            right: -20px;
            background-size: cover;
        }

        body.home .main_content .more {
            padding: 8px 40px;
            margin-top: 20px;
            margin-bottom: 40px;
            font-size: 16px;
            box-shadow: -6px 9px #a28479
        }

        body.home .home_appli .a_cloud {
            bottom: 110px;
        }

            body.home .home_appli .a_cloud img {
                width: 60%;
                padding: 90px 0px 60px;
            }

        .home_appli {
            background: url(../images/all/appli_bgs.jpg)no-repeat center top;
            padding: 50px 0px 10px;
        }

            .home_appli .appli_1 {
                width: 100%;
                margin-bottom: 50px;
                display: flex;
                flex-wrap: wrap;
            }
                .home_appli .appli_1 .app_share {
                    width: 40%;
                    height: unset;
                    border-radius: 10px;
                
             
                }
                .home_appli .appli_1 ul {
                    width: 60%;
                    padding-left: 18px;
            

                }
            .home_appli ul li {
                font-size: 14px;
            }
        body.home .main_content .home_appli .more {
            margin-top: 0px;
        }
        body.home .home_appli .a_cloud {
            bottom: 60px;
        }
            .home_appli .app_share:before {
                background: url(../images/all/app_icon01.svg)no-repeat;
                width: 111px;
                height: 89px;
                background-size: cover;
            }
            .home_appli .app_share.app_mid:before {
                background: url(../images/all/app_icon02.svg)no-repeat;
                width: 111px;
                height: 89px;
                background-size: cover;
            }
            .home_appli .app_share.app_right:before {
                background: url(../images/all/app_icon03.svg)no-repeat;
                width: 111px;
                height: 89px;
                background-size: cover;
            }
            .home_appli .app_share h4 {
                transform: unset;
                padding-top: 60px;
            }
            body.home .home_appli .appli_bg2 img {
                width: 70%;
            }

        .home_plan .thre_1 img {
            display: none;
        }

        .home_plan .h3_t {
            font-size: 20px;
            text-align: center;
            margin-bottom: 40px;
      
        }

        .home_plan h4 {
            font-size: 16px;
            text-align: center;
            line-height: 26px;
        }

        .home_plan .d_flex {
            margin: 30px 0 20px;
        }

        body.home .h2 {
            font-size: 24px;
            line-height: 45px;
        }

        .home_plan .pla_1 {
            min-width: 80%;
            margin-bottom: 20px;
        }

        #floating,
        #floating.fixed {
            top: 40px;
            margin-top: 0;
        }

            #floating .btn-floating {
                display: block;
            }

            #floating ul {
                width: 0;
                overflow: hidden;
                -webkit-transition: all 0.3s ease;
                -moz-transition: all 0.3s ease;
                -o-transition: all 0.3s ease;
                transition: all 0.3s ease;
            }

            #floating.open ul {
                width: 60px;
            }

        .header .navbar .navbar-header {
            text-align: center;
        }

        .header .navbar .navbar-toggle {
            font-size: 18px;
            color: #1EB5BE;
            letter-spacing: 2px;
            border: none;
            float: none;
            margin: 0 0 20px;
            padding-left: 14px;
        }

            .header .navbar .navbar-toggle:hover {
                background: none;
                color: #888;
            }

        .header .navbar .navbar-nav {
            background: none;
            border-top: 2px solid #52CED5;
            margin: 0 -15px;
        }

            .header .navbar .navbar-nav > li {
                display: block;
            }

                .header .navbar .navbar-nav > li + li:before {
                    display: none;
                }

                .header .navbar .navbar-nav > li > a {
                    width: auto;
                    text-align: center;
                    border-bottom: 1px solid #52CED5;
                    padding: 10px;
                }

        .header .navbar .sub-nav {
            text-align: center;
            margin: 10px 0 20px;
            position: static;
        }

        .header .navbar .btn-default {
            color: #333;
        }

        .header .navbar .lang {
            text-align: center;
            display: block;
            margin-top: 10px;
            position: static;
        }

            .header .navbar .lang .btn {
                width: 100%;
                background: none;
                font-size: 14px;
                border: none;
                float: none;
                display: block;
                padding: 8px;
            }

                .header .navbar .lang .btn,
                .header .navbar .lang .btn:active .header .navbar .lang .btn:focus {
                    -moz-box-shadow: none;
                    -webkit-box-shadow: none;
                    box-shadow: none;
                }

            .header .navbar .lang .dropdown-menu {
                text-align: center;
                box-shadow: none;
                float: none;
                position: static;
            }

        .footer {
            padding: 10px 0 20px;
        }

            .footer .sitemap {
                display: none;
            }

            .footer .copyright,
            .footer .siteinfo,
            .footer .siteinfo ul {
                display: block;
            }

                .footer .siteinfo ul > li {
                    display: block;
                }

                    .footer .siteinfo ul > li + li:before {
                        display: none;
                    }

        .main {
            z-index: auto;
        }

        .side .nav {
            margin-bottom: 20px;
        }

            .side .nav > li {
                float: none;
                display: block;
                margin: 0;
            }

                .side .nav > li + li {
                    border-top: 1px solid #ABCFDB;
                }

        .content .list-box .txt-list li.list-header {
            display: none;
        }

        .content .list-box .txt-list li span {
            float: none;
            display: block;
            padding: 0;
        }

        .content .btn-box {
            text-align: center;
        }

            .content .btn-box .page-info select {
                width: 100px;
                display: inline-block;
            }

            .content .btn-box .pager,
            .content .btn-box .page-info {
                float: none;
            }

            .content .btn-box .pager {
                display: block;
            }

                .content .btn-box .pager li {
                    margin: 0;
                }

                    .content .btn-box .pager li > a {
                        width: 100%;
                        text-align: center;
                        margin: 5px 0 0;
                        padding-left: 0;
                        padding-right: 0;
                    }

        .plan_right .we_a {
            width: 100%;
            margin-bottom: 50px;
            min-height: auto;
            padding-bottom: 50px;
        }

        .home_three .d_flex2 {
            padding: 30px 0;
        }

        .home_three h3 {
            font-size: 20px;
            line-height: 40px;
        }
    }



    @media (max-width: 450px) {
      

        .home_three .d_flex2 .people img {
            right: -10%;
        }

        .home_three .d_flex3 .people img {
            left: 0;
            bottom: -20px;
            width: 50%;
        }


        .home_three .people img {
            left: 0;
        }
    }
