@charset "utf-8";
/* 設計師用 RWD版CSS檔 style_rwd.css */
/* 說明：
    可提供設計師在此檔，針對RWD版面進行設計；非RWD版面則不需載此CSS檔。*/

@media (min-width: 1570px) {
    .navbar .container-fluid,
    .main_content > .container-fluid,
    .footer .container-fluid,
    .main_top> .container-fluid {
        width: 1570px;
        position: relative;
    }
}

@media (min-width: 991px) {
  
     .Slide_btn2{
        display:none!important;
    }
    .Slide_main2{
        display:block!important;
    }
}



    @media (max-width: 1570px) {
        .ab_born .bor_mid:after {
            height: 200px;
          
        }
        .order.p02 .succ_ess .detail_mid .detail_one h4 {
            font-size: 16px;
        }
        .order.p02 .succ_ess .detail_mid .detail_one:last-child {
            width: 15%;
   
        }
        order.p02 .succ_ess .detail_mid .detail_one:last-child p {
            display: block;
        }
        .footer .powered {
            bottom: 60px;
        }

        body.home .home_ba .slick-prev {
            left: 0;
        }

        body.home .home_ba .slick-next {
            right: 0;
        }

        .header .fb_lis {
            right: 10px;
        }

        .header .line_s {
            right: 62px;
        }

        .header .cart_na {
            right: 22px;
        }

        .header .stud_toge {
            right: 61px;
        }
        .member .member_sign {
            width: 70%;
        }
		   .header .navbar .navbar-nav {
            text-align: left;
            display: block;
        }
    }

    @media (max-width: 1400px) {
     
        .ab_born .bor_mid .bor_left {
            width: 90%;
            padding: 30px;
           
        }
      
    }
	
	  @media (max-width: 1300px) {
     .header .navbar .navbar-nav > li > a {
  
    padding: 10px 30px;
  
}
      
    }

    @media (max-width: 1199px) {
		.header .navbar .navbar-nav > li > a {
    padding: 10px 15px;
    letter-spacing: 0;
}
        .ab_born .bor_mid {
            flex-wrap: wrap-reverse;
        }
            .ab_born .bor_mid .bor_left {
                width: 100%;
                margin-top: -20px;
            }
        .member .main_content    .member_sign {
            width: auto;
        }

        .member .me_mid .me_right {
            width: 80%;
         
        }
        .order.p02 .succ_ess .detail_mid .detail_one {
            margin: 10px !important;
            width: 20%;
        }
            .order.p02 .succ_ess .detail_mid .detail_one:last-child,
            .order.p02 .succ_ess .detail_mid .detail_one:nth-child(4) {
                width: unset;
            }
        .order.p02 .succ_ess .detail_mid {
            flex-wrap: wrap;
            justify-content: flex-start;
        }
        .order.p01 .specification_w .payment_g,
        .order.p01 .specification_w .tab-pane .kxx_s .pers_onal,
        .order.p01 .specification_w .remarks,
        .order.p01 .specification_w .tab-pane .kxx_s.kxx_3 .editor_w {
            width: 100%;
        }
        .order .djf_weleft,
        .order .djf_wemid,
        .order  .djf_werig {
            width: 100%;
        }
       
        .order.p01 .main_content .dkf_dividend {
            flex-wrap: wrap;
        }
        .order.p01 .specification_w .tab-pane .kxx_s.kxx_2 .editor_w {
            width: 50%;
        }
        body.home .home_ba2 h3 {
            margin-left: 0;
        }

        body.home .home_ba2 .ba_mid {
            flex-wrap: wrap;
        }

            body.home .home_ba2 .ba_mid .ba_tx {
                width: 50%;
                margin-bottom: 30px;
            }

        .header .stud_toge {
            top: 153px;
        }

      
        .header .navbar .navbar-nav {
            margin: -80px 0;
        }

        .banner .wid-banner a.img_big img {
            display: none;
        }

        .banner .wid-banner a.img_small img {
            display: block;
        }

        .header .banner .bxslider li {
            height: auto;
        }

            .header .banner .bxslider li img {
                display: block;
            }



        .header .navbar .navbar-nav > li {
            float: none;
            display: inline-block;
        }

        .header .navbar .navbar-header {
            float: none;
        }

        .header .navbar .navbar-brand {
            float: left;
            margin: 53px auto 15px;
        }

        #floating {
            margin-top: -90px;
        }
    }

@media (max-width: 991px) {
    .header .check_wrapper1 {
        top: 130px;
    }
    .order.p02 .succ_ess ul li {
        padding: 0 8px;
        font-size: 16px;
    }
    .member.p04 .main_content .succ_ess .detail_mid .detail_one,
    .member.p04 .main_content .succ_ess .detail_mid .detail_one:nth-child(4) {
        width: 47%;
    }
 
    .member .main_content .sider_meb .pdd_a a {
        margin:  0;
        width: 100%;
    
    }
  
   

    .member .main_content .sider_meb .pdd_a {
        display: block;
    }
    .member .member_sign {
        padding: 50px 0;
    
    }
    .member .member_sign {
        width: auto;
    }
    .member .me_mid .me_right {
        width: auto;
    }
    .order .dkf_right {
        padding: 20px 20px;
    }
    .order .process_s ul li {
        padding: 0 40px;
    }

    .product .pr_order {
        margin: 0 auto 0 0;
    }
    .product .pr_gary ul li a {
        padding: 13px 7px;
    }
    .main_content .side1 {
        padding-right: 15px;
    }
    .main_content .sider_meb {
        display: block;
    }
    .side .prdo_si .Slide_btn2,
    .sider_meb.prdo_si .Slide_btn2 {
        font-size: 18px;
        color: #fff;
        font-family: 'Noto Sans TC', sans-serif;
        margin-top: 0;
        padding: 10px;
        /* font-weight: 900; */
        position: relative;
        display: block;
        background-color: #009ee7;
    }
         .prdo_si .Slide_btn2:before {
            content: " ";
            display: block;
            position: absolute;
            background: url(../images/all/arrow_x2.svg)no-repeat;
            width: 13px;
            height: 8px;
            right: 10px;
            top: 16px;
            transition: all 0.5s;
        }
         .prdo_si .Slide_btn2.active:before {
            -moz-transform: rotate(3.14159rad);
            -webkit-transform: rotate(3.14159rad);
            -o-transform: rotate(3.14159rad);
            -ms-transform: rotate(3.14159rad);
            transform: rotate(3.14159rad);
        }
    .header .navbar_solid:before {
        display: none;
    }


    .header .navbar .navbar-brand {
        float: none;
        margin: 13px auto 5px;
    }

    .header .stud_toge {
        top: 42px;
        right: 81px;
    }

    .header .navbar .navbar-nav {
        padding: 0;
        margin: 0px 0 10px;
        text-align: center;
    }

    .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;
            }

    .header .dow_now2 {
        position: static;
    }

        .header .dow_now2 .Slide_main {
            border-top: 1px solid #d7d7d7;
            padding-top: 10px;
            text-align: center;
            margin-bottom: 10px;
        }

        .header .dow_now2 ul li a {
            padding: 3px 6px;
        }

    .header .stud_toge {
        position: static;
        margin-bottom: 20px;
    }

    .header .cart_na {
        top: 110px;
    }

    .header .navbar.navbartop {
        top: 0;
    }

    .side1 .prdo_si h2.ssx_h {
        display: none;
    }


}


@media (max-width: 767px) {
    .header .sear_btn {
        display: block;
        position: absolute;
        top: 26px;
        right: 60px;
    }
    .header .sear_btn .fa-search {
        color: #000000;
        font-size: 20px;
    }
    .header .stud_toge {
        display: none;
    }
    .member .login_btn .google_btn, .member .login_btn .fb_btn {
        display: block;
    }
    .about_p05 .timeline div[class*=timeline-data]:nth-of-type(odd) .years,
    .about_p05 .timeline .years {
        text-align: center;
        background-color: #009ee7;
        color: #fff;
    }
    .about_p05 .timeline-data .years:after {
        display: none;
    }

    .about_p05 .timeline div[class*=timeline-data]:nth-of-type(odd),
    .about_p05 .timeline div[class*=timeline-data]:nth-of-type(even) {
        width: 100%;
    }

    .about_p05 .timeline .years {
        font-size: 28px;
        padding: 10px 0px 0;
        margin: 5px 0 0;
        border-bottom: none;
        text-align: center;
    }
    .header .checkout {
        
        text-align: center;
    }
    .header .check_wrapper1 {
        top: 46px;
        width: auto;
        left: 0;
    }
    .member.p04 .main_content    .reflow-table.reflow-table-sm td:last-child:before{
        display:none;
    }
    .member.p04 .main_content table tr th a:last-child {
        padding-top: 0;
        margin-left: 12px;
    }
    .member.p04 .main_content table tr th input {
        height: 30px;
        margin-right: 9px;
    }
    .member.p04 .reflow-table.reflow-table-mobile-mode thead {
        display: contents;
        width: 100%;
    }
        .member.p04 .reflow-table.reflow-table-mobile-mode thead th{
            display:none;

        }
            .member.p04 .reflow-table.reflow-table-mobile-mode thead th:last-child {
                display: flex;
                background-color:#009ee7;
            }
            .member .main_content h3 {
                font-size: 24px;
                margin: 0 0 10px;
            }
    .order .djf_werig p {
        font-size: 14px;
    }
    .order.p02 .succ_ess h3 {
        font-size: 20px;
    }
    .order .main_content input.zip-code {
        width: 100%;
        margin: 10px 0;
    }
    .order .main_content input {
        height: 34px;
     
    }
    .member.return2 .main_content table tr td:nth-child(5) {
        display: inline-flex;
    }
    .member.return .cxc_mid .cxc_left p {
        padding: 0 10px;
      
    }
    .member.return .cxc_mid .cxc_left {
        width: 100%;
        margin-bottom: 20px;
    }
    .member.return .cxc_mid {
        display: block;
  
    }
    .order.p02 .succ_ess ul {
        line-height: 32px;
    }
    .member.p04 .main_content .mess_x   table tr td a {
        display: inline-block;
    }
    .member.p04 .main_content .age a.light {
        margin-top: 20px;
    }
        .member.p04 .main_content .consu_ma table tr td {
            width: 100%!important;
        }
        .member.p04 .main_content .succ_ess .detail_mid .detail_one, 
        .member.p04 .main_content .succ_ess .detail_mid .detail_one:nth-child(4) {
            width: 100%;
        }
        .member.p03 .main_content table tr td:first-child a,
        .member.p03 .main_content table tr td:last-child a {
            display: inline-block;
        }
        .member.p02 .member_sign a.situation {
            margin-top: 10px;
        }
        .member.p01 .member_sign .welcome_login p {
            font-size: 15px;
     
        }
        .member.p01 .management .management_mid h4 {
            font-size: 18px;
        }
        .member.p01 .management .management_mid + .management_mid {
            border-bottom: 1px solid #858585;
            border-top: 1px solid #858585;
            margin: 30px 0;
            border-left: none;
            padding: 30px;
        }
        .member.p01 .management .management_mid:last-child{
            border:none;
        }
        .member.p01 .management .management_mid {
            width: 100%;
        }
        .member.p01 .management {
            display: block;
         
        }
    
        .member .member_sign {
            padding: 20px;
       
        }
        .member .member_sign ul li a {
            font-size: 12px;
            padding: 10px 30px;
        }
        .member .me_mid .me_right {
            padding: 40px 20px;
        }
        .member .me_mid ul li a {
            margin: 0 3px;
            padding: 6px 10px;
            font-size: 12px;
            letter-spacing: 0;
        }
        .order.p02 .succ_ess .detail_mid .detail_one,
        .order.p02 .succ_ess .detail_mid .detail_one:last-child,
        .order.p02 .succ_ess .detail_mid .detail_one:nth-child(4) {
            width: 100%;
        }
       .order .djf_werig {
            margin-top: 20px;
        }
        .order.p01 .specification_w .tab-pane .kxx_s .pers_onal p {
            font-size: 12px;
        }
        .order.p01 .main_content .add_x {
            display: block;
            margin-bottom: 10px;
        }
    .order.p01 .recipient_a .p_required {
        text-align: left;
        font-size: 14px;
    }
        .order .dkf_right .djf_we {
            display: block;
          
        }
        .order .dkf_right ul li:nth-child(2), .order .dkf_right ul li.mon_s {
            font-size: 16px;
        }
        .order.p01 .specification_w .remarks {
            margin: 30px auto 10px;
        }
        .order.p01 .specification_w .remarks,
        .order.p01 .specification_w .tab-pane .kxx_s.kxx_3 .editor_w,
        .order.p01 .specification_w .tab-pane .kxx_s .pers_onal,
        .order.p01 .specification_w .tab-pane .kxx_s.kxx_2 .editor_w,
        .order.p01 .specification_w .payment_g {
            padding: 0 0px;
        }
        .order .dkf_right {
            padding: 20px 15px;
        }
        .order.p01 .specification_w .tab-pane .kxx_s.kxx_2 .editor_w {
            width: 100%;
        }
        .order.p01 .specification_w .tab-pane .kxx_s .pers_onal {
            margin-bottom: 0;
        }
        .order .dkf_right ul li {
            width: 100%;
            text-align: left;
       
        }
        .order.p01 .specification_w .nav-tabs {
            display: block;
            margin: 30px auto 30px;
        }
        .order.p01 .specification_w .nav-tabs > li > a {
            font-size: 16px;
            padding: 10px 20px;
       
        }
        .order.p01 .recei_left, .order.p01 .recei_right {
            width: 100%;
        }
        .order.p01 .recei_mid {
            flex-wrap: wrap;
        }
        .order.p01 .recipient_a h3 {
            font-size: 18px;
        }
        .order.p01 .dkf_right .h4 {
              margin-bottom: 20px;
            font-size: 16px;
        }
        .order .process_s {
            margin: 0 auto 20px;
        }
        .order .u_tre ul li a {
            padding: 7px 10px;
            margin: 0 1px;
            font-size: 12px;
        }
        .order .main_content table tr td:nth-child(1),
        .member  .main_content table tr td:nth-child(1) {
            color: #fff;
            background-color: #404040;
            padding: 15px 10px;
        }

        .order .main_content table tr td:nth-child(7) input {
            width: 50px;
            display: inline-block;
        }
        .reflow-table.reflow-table-sm td:before {
            vertical-align: top;
            min-width: 50%!important;
        }
        .order .main_content table tr td span,
        .order .main_content table tr td:last-child a,
        .order .main_content table td ul {
            display: inline-block;
        }
       
        .order .main_content table tr td a .pic {
          padding-top:10px;
        }
        .order .main_content table tr td,
        .member   .main_content table tr td {
            width: 100% !important;
            text-align: left!important;
            padding: 14px 10px;
        }
        .order .process_s ul li + li:before {
            left: -10px;
     
        }

        .order .process_s ul li {
            font-size: 12px;
            padding: 0px 13px;
        }
            .order .process_s ul li span {
                display: table;
                text-align: center;
                margin: 0 auto 10px;
            }
            .product .pr_gary {
                padding: 14px 0;
            }
        .product .pr_gary ul li a {
            padding: 5px 7px;
        }
        body.home .home_ba .slick-prev {
            left: 10px;
            background-size: cover;
            width: 15px;
            height: 35px;
        }

        body.home .home_ba .slick-next {
            right: 10px;
            background-size: cover;
            width: 15px;
            height: 35px;
        }

        body.home .home_ba2 h3 {
            margin-top: 40px;
        }

        .footer .gotop a {
            width: 59px;
            height: 62px;
            background-size: cover;
        }

        .footer .fot_mid .fot_log, .footer .fot_mid .siteinfo {
            float: none;
        }

            .footer .fot_mid .siteinfo ul {
                line-height: 19px;
                margin-bottom: 0;
            }

        .footer .fot_mid {
            justify-content: center;
            align-items: center;
            flex-direction: column;
        }

        .footer_content {
            padding: 30px 0;
        }

        .footer .copyright ul {
            margin-bottom: 0;
        }

        .footer .copyright {
            text-align: center;
            margin-top: 20px;
            font-size: 12px;
            border-top: 1px solid #afafaf;
            padding-top: 20px;
        }

        .footer .powered {
            position: static;
        }

        .footer .fot_mid .siteinfo ul li {
            font-size: 12px;
        }

        body.home .home_ba {
            margin-bottom: 20px;
        }

        .header .line_s.line_s2 p {
            background: url(../images/all/member_icon01s.svg)no-repeat left center;
            font-size: 14px;
        }

        .header .stud_toge ul li.search a {
            right: 4px;
        }

        .header .line_s a:hover {
            color: #98caf1;
        }

        .header .line_s a {
            background: url(../images/all/member_icon01s.svg)no-repeat right center;
            color: #fff;
        }

        .header .line_s {
            right: 10px;
            background-color: #009ee7;
            padding: 7px;
            top: 16px;
        }

        .header .fb_lis ul li, .header .fb_lis ul li a {
            padding: 6px 2px;
        }

            .header .fb_lis ul li a img {
                width: 150%;
            }

        .header .fb_lis {
            position: static;
            text-align: center;
        }

        .header .stud_toge ul li input {
            width: 100%;
        }

        .header .stud_toge ul li select {
            width: 100%;
            margin: 10px 0;
        }

        .header .cart_na {
            top: 26px;
        }

        .header .line_s p {
            margin-bottom: 0;
        }

        .banner .slick-dots {
            bottom: 12px;
        }

        .header .navbar .navbar-brand {
            width: 55px;
            height: 53px;
            background-size: cover;
            margin: 9px auto 5px;
        }

        .header .navbar .stud_toge .navbar-nav {
            padding-top: 0;
        }

        .banner {
            padding-top: 67px;
        }

        .header .navbar-collapse.in {
            opacity: 1;
            z-index: 300;
        }


        .header .navbar-collapse {
            /* height: 100%; */
            top: 0;
            bottom: 0;
            left: 15px;
            width: 100%;
            position: fixed;
            overflow: auto;
            transition: .3s ease all;
            background-color: #fff;
            opacity: 0;
        }

        .navbar-toggle .icon-bar:nth-child(3) {
            transform: rotate(-45deg);
            margin-top: -8px;
        }

        .navbar-toggle .icon-bar:nth-child(2) {
            opacity: 0;
        }

        .navbar-toggle .icon-bar:first-child {
            transform: rotate(45deg);
            margin-top: 10px;
        }

        .navbar-toggle .icon-bar {
            transition: all .3s ease;
        }


        .navbar-toggle .icon-bar {
            background-color: #888;
        }

        .navbar-toggle.collapsed .icon-bar {
            transform: rotate(0deg);
            margin-top: 5px;
        }

            .navbar-toggle.collapsed .icon-bar:nth-child(2) {
                opacity: 1;
            }

        .header .navbar {
            z-index: 20;
            position: fixed;
            width: 100%;
            background: #fff;
            box-shadow: 0 0 0 #e4e4e4;
            z-index: 999;
        }

            .header .navbar .navbar-toggle {
                z-index: 500;
            }


        .header .dow_now2 .Slide_btn {
            position: relative;
        }


        #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 {
            float: none;
            margin: 0 0 15px;
            border: none;
            color: #1EB5BE;
            font-size: 18px;
            letter-spacing: 2px;
            /* padding-left: 14px; */
            position: fixed;
            display: block;
            top: 20px;
            left: 20px;
            padding: 0;
            border-radius: 0;
            /*transform: translateY(-50%);*/
        }

            .header .navbar .navbar-toggle:hover {
                background: none;
                color: #888;
            }

        .header .navbar .navbar-nav {
            padding-top: 20%;
        }

            .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;
                    padding: 15px 0;
                    color: #000;
                    font-size: 20px;
                }

        .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: 0;
        }

            .footer .sitemap {
                margin-top: 15px;
            }
            .footer .sitemap ul li a {
                font-size: 15px;
                padding: 0 4px;
            }

            .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;
                    display: inline-block;
                }

                    .content .btn-box .pager li > a {
                        padding: 2px 6px;
                        font-size: 12px;
                    }
        .product .product-list ul.money_x li:nth-child(2) {
            padding-left: 0;
            display: block;
            padding-top: 5px;
        }
        .product .product-list .tit {
            margin: 30px 0 20px;
        }
        .product.show .prsho_mid {
            display: block;
        }
            .product.show .prsho_mid .prsho_left {
                width: 100%;
                padding-right: 0;
            }
            .product.show .prsho_mid .prsho_right {
                width: 100%;
                margin-top: 30px;
            }
        .product.show .prsho_right .buy-box ul li:nth-child(1) {
            display: block;
        
        }
        .product.show .prsho_right .buy-box ul li input {
            width: 100%;
            margin-bottom: 14px;
        }
        .product.show .introd_u .txt {
            margin-bottom: 40px;
        }
        .product.show .introd_u {
            margin: 40px 0 30px;
        }
    }



@media (max-width: 400px) {
    .member.registered .main_content p,
    .member.inquire .main_content   p {
   
        font-size: 13px;
    }
}