﻿#Order_Checkout {
    padding: 0px 0px 20px 0px;
    word-break: break-all;
    text-align: justify;
}

    #Order_Checkout h1 {
        font-size: 24px;
        font-weight: 500;
    }

    #Order_Checkout .CheckContent {
        background: #fff;
        padding: 20px 35px 40px 35px;
        margin: 0px 0px 30px 0px;
    }

    #Order_Checkout aside {
        float: right;
        line-height: 42px;
    }

        #Order_Checkout aside a {
            color: #3278BC;
        }
        #Order_Checkout aside a img{
            width:8px;
            height:13px;
        }

            #Order_Checkout aside a:hover {
                color: #019FE8;
            }

    #Order_Checkout #CartEmpty section {
        font-size: 30px;
        color: #000;
        text-align: center;
        padding: 30px 0px;
    }

    #Order_Checkout #SugestProductList.CheckContent a {
        display: block;
        float: left;
        width: 250px;
        height: auto;
        text-align: center;
        margin: 0px 21px;
    }

        #Order_Checkout #SugestProductList.CheckContent a:hover {
            opacity: 0.7;
        }

    #Order_Checkout #SugestProductList.CheckContent a span {
        font-weight: 500;
    }

        #Order_Checkout #SugestProductList.CheckContent a .Image {
            position: relative;
            width: auto;
            height: 150px;
            margin: 0px;
        }

            #Order_Checkout #SugestProductList.CheckContent a .Image img {
                position: absolute;
                bottom: 0px;
                left: 0px;
                width: 100%;
            }

    #Order_Checkout #CartDetails section {
        padding: 0px;
    }
    /*checkbox樣式*/
    #Order_Checkout input[type=checkbox] {
        width: 20px;
        height: 20px;
        color: #fff;
        -moz-appearance: none;
        -webkit-appearance: none;
        border: 1px solid #D2C4A5;
        border-radius: 3px;
    }

        #Order_Checkout input[type=checkbox]:checked {
            background: url(../../../_Image/check-01.svg) no-repeat scroll right center;
            background-repeat: no-repeat;
            background-position: center;
            background-color: #D2C4A5;
        }
    /*RWD-Table*/
    #Order_Checkout .Rwd-Table {
        width: 100%;
        margin: 40px 0px 20px 0px;
        border-collapse: collapse;
        word-break: break-all;
    }

        #Order_Checkout .Rwd-Table tr {
            border-bottom: 1px solid #eee;
            font-size: 12px;
            font-weight: 200;
        }

        #Order_Checkout .Rwd-Table th, #Order_Checkout .Rwd-Table td {
            padding: 10px 4px;
            text-align: center;
            vertical-align: middle;
        }

        #Order_Checkout .Rwd-Table .Price {
            font-size: 12px;
            font-weight: 400;
            color: #E50014;
        }

        #Order_Checkout .Rwd-Table td:nth-child(1) {
            text-align: left;
        }

        #Order_Checkout .Rwd-Table th {
            color: #3278BC;
            font-size: 14px;
            font-weight: 300;
        }

        #Order_Checkout .Rwd-Table tbody tr input,
        #Order_Checkout .Rwd-Table tbody tr p {
            display: inline-block;
            vertical-align: middle;
        }

        #Order_Checkout .Rwd-Table .CheckImage {
            width: 100px;
            height: 100px;
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center;
        }

        #Order_Checkout .Rwd-Table tr:nth-child(2) .CheckImage {
            background-image: url(/_Image/Order_Checkout-01.png);
        }

        #Order_Checkout .Rwd-Table tr:nth-child(3) .CheckImage {
            background-image: url(/_Image/Order_Checkout-01.png);
        }

        #Order_Checkout .Rwd-Table tbody td[data-th="單價"] {
            font-weight: 400;
        }
        /*下拉選單樣式*/
        #Order_Checkout .Rwd-Table tbody tr select[ name="GlassesType"] {
            border: 1px solid #fff;
            color: #50422D;
            font-family: 'Noto Sans TC', sans-serif;
            -moz-appearance: none;
            -webkit-appearance: none;
            background: url(/_Image/Down_arrow-01.svg) no-repeat scroll right center;
            background-repeat: no-repeat;
            background-position: right;
            padding-right: 20px;
            font-size: 12px;
            font-weight: 300;
        }

            #Order_Checkout .Rwd-Table tbody tr select[ name="GlassesType"]:focus {
                outline: none;
            }

            #Order_Checkout .Rwd-Table tbody tr select[ name="GlassesType"] option {
                font-size: 12px;
                font-weight: 300;
            }

        /*數量增減樣式*/
        #Order_Checkout .Rwd-Table tbody tr .Qty {
            margin: 0 -1px;
            padding: 0px;
            float: left;
            width: 45px;
            height: 25px;
            text-align: center;
            background: #fff;
            border: 1px solid #ccc;
        }

        #Order_Checkout .Rwd-Table tbody tr .Qtyminus,
        #Order_Checkout .Rwd-Table tbody tr .Qtyplus {
            display: block;
            float: left;
            padding: 0px;
            width: 20px;
            height: 25px;
            text-align: center;
            background: #fff;
            border: 1px solid #ccc;
            cursor: pointer;
        }

            #Order_Checkout .Rwd-Table tbody tr .Qtyminus:hover,
            #Order_Checkout .Rwd-Table tbody tr .Qtyplus:hover {
                background: #eee;
                border: 1px solid #ccc;
            }

        /*刪除按鈕*/

        #Order_Checkout .Rwd-Table .CartDeletBtn {
            padding: 3px 8px;
            cursor: pointer;
            border-radius: 5px;
        }

            #Order_Checkout .Rwd-Table .CartDeletBtn:hover {
                color: #fff;
                background: #CB001A;
            }
    /*總金額*/
    #Order_Checkout section .TotalPrice_Box {
        width: 100%;
        overflow: hidden;
    }

    #Order_Checkout .TotalPrice_Box .AllCheck {
        float: left;
    }

        #Order_Checkout .TotalPrice_Box .AllCheck input,
        #Order_Checkout .TotalPrice_Box .AllCheck label {
            display: inline-block;
            vertical-align: middle;
            font-weight: 400;
        }

    #Order_Checkout .TotalPrice {
        float: right;
        text-align: right;
        padding: 0px 20px;
        font-size: 16px;
    }

        #Order_Checkout .TotalPrice .TotalTitle {
            width: 115px;
            margin-right: 80px;
            float: left;
        }

        #Order_Checkout .TotalPrice p:nth-child(4) {
            font-size: 16px;
            font-weight: 400;
            line-height: 16px;
        }

    #Order_Checkout .Price {
        font-size: 22px;
        font-weight: 500;
        color: #E50014;
    }

    #Order_Checkout .Precautions {
        font-size: 14px;
        font-weight: 500;
    }

        #Order_Checkout .Precautions .Privacy:hover {
            color: #29bbff;
            border-bottom: 1px solid #29bbff;
        }

        #Order_Checkout .Precautions .Privacy {
            color: #019fe8;
            border-bottom: 1px solid #019fe8;
        }

    #Order_Checkout #CartDetails .Cart_Button {
        margin: 20px 0px 20px auto;
        font-size: 18px;
    }

    #Order_Checkout #CartDetails .Privacy {
        color: #019fe8;
    }

        #Order_Checkout #CartDetails .Privacy:hover {
            color: #29bbff;
        }

#Base_Visitor .ToTop_Bg {
    background: #F7F7F7;
}

/* 小於1170 */
@media screen and (max-width:1169px) {
    #Order_Checkout #Recommend .Item {
        margin: 0px 13px;
    }

        #Order_Checkout #Recommend .Item .Image {
            width: 190px;
            height: 130px;
        }

    #Order_Checkout aside {
        float: none;
    }

    #Order_Checkout #CartEmpty section {
        font-size: 23px;
    }
    /*RWD-Table*/
    #Order_Checkout .Rwd-Table tr {
        border: 1px solid #ccc;
    }

    #Order_Checkout .Rwd-Table th {
        display: none;
    }

    #Order_Checkout .Rwd-Table td {
        display: block;
        border: none;
        padding: 4px 15px;
        text-align: left;
    }

        #Order_Checkout .Rwd-Table td[data-th]:before {
            content: attr(data-th) "";
            margin-right: 20px;
            color: #3278BC;
            font-size: 16px;
            font-weight: 200;
            width: 100%;
            text-align: left;
        }

        #Order_Checkout .Rwd-Table td[data-th]:nth-child(1):before,
        #Order_Checkout .Rwd-Table td[data-th]:nth-child(2):before,
        #Order_Checkout .Rwd-Table td[data-th]:nth-child(6):before {
            display: none;
        }

    #Order_Checkout .Rwd-Table .CheckImage {
        margin: 0px;
    }

    #Order_Checkout .Rwd-Table tbody tr p {
        display: block;
        margin: 3px 0;
    }

    #Order_Checkout .Rwd-Table tbody tr input[type="text"] {
    }

    #Order_Checkout .Rwd-Table tbody tr input[type=checkbox] {
        float: right;
    }

    /*數量增減樣式*/
    /*#Order_Checkout .Rwd-Table tbody tr .Qty {
        margin: 0 -1px;
        padding: 0px;
        float: right;
        width: 45px;
        height: 25px;
        text-align: center;
        background: #fff;
        border: 1px solid #ccc;
    }

    #Order_Checkout .Rwd-Table tbody tr .Qtyminus,
    #Order_Checkout .Rwd-Table tbody tr .Qtyplus {
        display: block;
        float: right;
    }

    #Order_Checkout .Rwd-Table tbody tr .Qtyminus
    {
        float: right;
        margin-right:10vw;
    }*/


    #Order_Checkout .Rwd-Table .CartDeletBtn {
        display: block;
        width: 50%;
        margin: 10px auto;
        padding: 10px 0px;
        text-align: center;
        background: #f7f7f7;
    }

    #Order_Checkout .TotalPrice {
        float: right;
        text-align: right;
        padding: 0px 10px;
    }

    #Order_Checkout .TotalPrice_Box .AllCheck {
        float: none;
        text-align: right;
        padding: 0px 10px;
    }

    #Order_Checkout #CartDetails .Cart_Button {
        margin: 20px auto;
    }
}

/* 小於768 */
@media screen and (max-width:767px) {
    #Order_Checkout #Recommend .Item {
        margin: 0px auto;
        width: 100%;
    }

        #Order_Checkout #Recommend .Item .Image {
            width: 200px;
            height: 150px;
            margin: 0 auto;
        }

    #Order_Checkout .TotalPrice {
        float: left;
        text-align: left;
        padding: 0px 10px;
    }


    #Order_Checkout .TotalPrice_Box .AllCheck {
        float: none;
        text-align: left;
        padding: 0px 0px;
    }

    #Order_Checkout .TotalPrice .Cart_Button {
        margin: 30px auto 20px 0px;
    }
}
