body {
    font: 18px/26px "Helvetica Neue", Helvetica, "Heiti TC", "Microsoft JhengHei", "Microsoft Sans Serif", Helvetica, Geneva, sans-serif;
    line-height: 1.45857143;
    color: #333;
    background-color: #fff;
}

a {
   /* color: initial;*/
}
.mb100 {
    margin-bottom: 100px;
}
.mb80{margin-bottom: 80px;}

@media (min-width: 1200px){
 .container { width: 1200px;}
}
.carousel-control.left,
.carousel-control.right{
     background-image: none;
}
/************** radio樣式 **************/

.radio {
    padding-left: 20px;
}

.radio label {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    padding-left: 5px;
}

.radio label::before {
    margin-top: 4px;
    content: "";
    display: inline-block;
    position: absolute;
    width: 17px;
    height: 17px;
    left: 0;
    margin-left: -20px;
    border: 1px solid #cccccc;
    border-radius: 50%;
    background-color: #fff;
    -webkit-transition: border 0.15s ease-in-out;
    -o-transition: border 0.15s ease-in-out;
    transition: border 0.15s ease-in-out;
}

.radio label::after {
    margin-top: 4px;
    display: inline-block;
    position: absolute;
    content: " ";
    width: 11px;
    height: 11px;
    left: 3px;
    top: 3px;
    margin-left: -20px;
    border-radius: 50%;
    background-color: #555555;
    -webkit-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
    -o-transform: scale(0, 0);
    transform: scale(0, 0);
    -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
    -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
    -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
    transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
}

.radio input[type="radio"] {
    opacity: 0;
    z-index: 1;
}

.radio input[type="radio"]:focus+label::before {
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

.radio input[type="radio"]:checked+label::after {
    -webkit-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    -o-transform: scale(1, 1);
    transform: scale(1, 1);
}

.radio input[type="radio"]:disabled+label {
    opacity: 0.65;
}

.radio input[type="radio"]:disabled+label::before {
    cursor: not-allowed;
}

.radio.radio-inline {
    margin-top: 0;
}

.radio-info input[type="radio"]+label::after {
    background-color: #5bc0de;
}

.radio-info input[type="radio"]:checked+label::before {
    border-color: #5bc0de;
}

.radio-info input[type="radio"]:checked+label::after {
    background-color: #5bc0de;
}

.order-info .radio {
    display: block;
    margin-left: 40px;
    margin-top: 10px;
    margin-bottom: 10px;
}







/************ tab ***********************/


/*外框*/

.orderlist-tab-box .nav-pills>li>a {
    border-radius: 4px 4px 0 0;
}

.orderlist-tab-box .tab-content {
    padding: 45px 0;
    background-color: transparent;
    color: #000;
}

.orderlist-tab-box {
    margin-bottom: 50px;
}

.orderlist-tab {
    border-bottom: 1px solid #252525;
}

.orderlist-tab>li>a {
    padding: 13px 0;
    color: initial;
    width: 190px;
    font-weight: bold;
    text-align: center;
}


.orderlist-tab>li.tab-gentel.active>a {
    background: #ff7926;
    text-decoration: none;
}

.orderlist-tab>li.tab-gentel.active>a:hover {
    background: #ff8031;
    text-decoration: none;
}

.orderlist-tab>li.tab-gentel>a:hover {
    text-decoration: none;
}

.orderlist-tab>li.tab-cycle.active>a {
    background: #fa1616;
    text-decoration: none;
}

.orderlist-tab>li.tab-cycle.active>a:hover {
    background: #f82626;
    text-decoration: none;
}

.orderlist-tab>li.tab-cycle>a:hover {
    text-decoration: none;
}





.panel-box {
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
}

.panel-heading h3 {
    display: inline-block;
}

.panel-heading h3.panel-title1 {
    width: 57%;
    text-align: center;
}

.panel-heading h3.panel-title2 {
    width: 10%;
    text-align: right;
}

.panel-heading h3.panel-title3 {
    width: 10%;
    text-align: right;
}

.panel-heading h3.panel-title4 {
    width: 14%;
    text-align: right;
}




.panel-box>.list-group:last-child .list-group-item:last-child,
.panel-box>.panel-collapse>.list-group:last-child .list-group-item:last-child {
    border-bottom: 1px solid #ddd;
}






/* 購物清單 tab內容*/

.tab-box {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
}

.tab-con-box .list-group-item {
    padding: 0;
}

.tab-con-box .tab-con-item {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tab-con-box .tab-product {
    display: -webkit-flex;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    width: 55%;
}

.tab-con-box .tab-img {
    float: left;
    margin-right: 10px;
    display: inline-block;
    vertical-align: top;
    width: 125px;
    height: 125px;
    border: 1px solid #ededed;
    -webkit-flex: none;
    flex: none;
}

.tab-con-box .tab-img img {
    max-width: 100%;
    width: auto;
}

.tab-product-in {
    float: left;
    vertical-align: middle;
/*     -webkit-flex: 1;
    flex: 1;
    display: -webkit-flex;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center; */
}

.tab-title b {
    color: #ff7926;
    font-size: 0.8em;
    display: block;
}

.tab-con-box .tab-title {
    display: block;
    vertical-align: top;
    font-size: 1em;
    text-align: left;
}

.tab-right-box {
    display: inline-block;
    width: 45%;
}

.tab-con-box .tab-o-price {
    font-size: 0.8em;
    color: #dddddd;
}
.tab-con-box .tab-sj-cycle span,
.tab-con-box .tab-sj-cycle b{
    display: inline-block;
        color: #ff7926;
    font-size: 0.9em;
}

.tab-con-box .tab-discount {
    display: inline-block;
    width: 50%;
    text-align: right;
    margin-left: 1%;
}

.tab-right-t1 {
    display: inline-block;
    width: 53%;
    text-align: right;
    margin-left: 1%;
}

.tab-con-box .tab-discount i {
    font-size: 0.8em;
}

.tab-con-box .tab-discount b {
    font-size: 1.3em;
}

.tab-con-box .tab-account {
    display: inline-block;
    padding: 6px;
    width: 40%;
    min-width: 90px;
    text-align: right;
    margin-left: 5%;
}

.tab-con-box .tab-total {
    display: inline-block;
    width: 30%;
    text-align: right;
    padding-left: 1%;
}

.tab-con-box .tab-total i {
    font-size: 0.8em;
}

.tab-con-box .tab-total b {
    font-size: 1.3em;
}


.tab-con-box .tab-det {
    display: inline-block;
    width: 11%;
    vertical-align: middle;
    text-align: right;
    color: #999;
    margin-left: 1%;
    z-index: 9;
}

.tab-con-box .tab-det i {
    display: block;
}

.tab-con-box .tab-det i:before {
    font-size: 1.2em;
}

.tab-con-box .tab-det span {
    display: block;
    font-size: 0.8em;
}

.tab-con-box .tab-discount-item {
    margin-left: 135px;
    padding-top: 0;
}
.tab-con-box .tab-discount-item ul:before {
    content: "已滿足條件之優惠：";
    font-size: 15px;
    color: #ff7926;
}
.tab-con-box .tab-discount-item.not ul:before {
    content: "未滿足條件之優惠：";
    font-size: 15px;
    color: #999999;
}
.tab-con-box .tab-discount-item ul li {
    margin: 0 2px 5px 0;
    display: inline-block;
    font-size: 15px;
    font-weight: bold;
    padding: 2px 5px;
}
.tab-con-box .tab-discount-item ul li.disY {
    border: 1px solid #ff7926;
    color: #ff7926;
    font-weight: bold;
    padding: 2px 7px 2px 5px;
    border-radius: 5px;
}
.tab-con-box .tab-discount-item ul li.disN {
    color: #999999;
}
.tab-con-box .tab-discount-item ul li:nth-last-child(1){
        margin-bottom: 0;
}


.giftbar-box {}

.giftbar-box .giftbar p,
.giftbar-box .giftbar p i,
.giftbar-box .giftbar span {
    display: inline-block;
    ;
}

.giftbar {
    padding: 10px 10px 10px 20px;
    background: #fffcb8;
    margin-left: 135px;
    margin-bottom: 20px;
}

.giftbar>p {
    text-align: left;
    width: 80%;
}

.giftbar>p>i {
    float: left;
    color: #fff;
    background: #ff7926;
    padding: 5px;
    border-radius: 30px;
    margin-right: 10px;
}

.giftbar span {
    float: right;
    margin-top: 6px;
    text-align: right;
    display: inline-block;
    margin-right: 9%;
}

.giftbar p>i,
.giftbar p>b {
    vertical-align: sub;
}


/*首頁 大BN*/
/*.iTopBn{
    margin-bottom: 50px;
}
*/


/***** tab 下方運費區**************************/

.tab-B-total {
    margin-top: 30px;
    padding: 0;
    overflow: hidden;
    float: none;
}

.tab-B-total-l,
.tab-B-total-r {
    padding: 0;
}

.tab-B-total .transport p {
    color: #ff6200;
}

.tab-B-total .transport .coupon span {
    width: 110px;
    height: 30px;
    font-size: 0.9em;
    vertical-align: bottom;
    display: inline-block;
}

.tab-B-total .transport .coupon i.coupon-con {
    display: block;
    font-size: 0.9em;
    color: #ff793a;
}

.tab-B-total .transport .coupon b {
    height: 30px;
    font-size: 0.9em;
    vertical-align: bottom;
    display: inline-block;
}

.tab-B-total .transport .coupon-box {
    margin-top: 40px;
}

.tab-B-total .transport .coupon {
    height: 44px;
    vertical-align: middle;
    margin-bottom: 15px;
}

.tab-B-total .transport .coupon select,
.tab-B-total .transport .coupon input {
    display: inline-block;
    width: 290px;
}
.tab-B-total .coupon-notice {
    font-weight: bold;
    text-align: left;
    font-size: 10pt;
    color: red;
    margin: 0 0 5px 115px;
}


.tab-B-total .transport .coupon.trans-method .trans-meth-cycle {
    width: 160px;
}

.tab-B-total .transport .coupon.trans-method .trans-meth-date {
    width: 140px;
}

.total-price {
    background: #f0f0f0;
    padding: 20px;
}

.total-price>div {
    line-height: 50px;
}

.total-price .price-title {
    width: 40%;
    text-align: right;
    display: inline-block;
}


.total-price .subtotal-price .t-price,
.total-price .dis-price .t-price,
.total-price .transport-price .t-price,
.total-price .settlement .t-price {
    display: inline-block;
    width: 50%;
    text-align: right;
}


.total-price .subtotal-price i,
.total-price .dis-price i,
.total-price .transport-price i,
.total-price .settlement i {
    font-size: 0.8em;
}


.total-price .settlement {
    font-size: 1.2em;
    font-weight: bold;
}

.total-price .settlement .t-price {
    color: #ff6200;
    font-size: 1.3em;
}

.tab-btn {
    margin-top: 50px;
}

.tab-btn button {
    width: 25%;
}

button.btn.btn-back,
button.btn.btn-back>a {
    color: #000;
}

button.btn.btn-next,
button.btn.btn-next>a {
    color: #fff;
}

button.btn.btn-back:hover {
    background: #ddd;
}

button.btn.btn-next:hover {
    background-color: #ff6d29;
    border-color: #ff6d29;
    color: #fff;
}



.tab-table {
    margin-top: 100px;
}

.tab-table table {
    font-size: 0.9em;
}

.tab-table table tr td {
    padding: 20px 20px;
}

.tab-table table tr td:nth-child(1) {
    width: 20%;
    background: #fcfcfc;
    vertical-align: middle;
}

.panel>.list-group>li:hover {
    background: #faffff;
}

.tab-table table tr:hover {
    background: #fcfcfc;
}



/** 首頁自定義部分 */
.big-bn{ width: 100%; }



/******* 改架構 邊框色 *************/

a.thumbnail.active,
a.thumbnail:focus,
a.thumbnail:hover {
    border-color: #1bc7b7;
}










/*************** nav ***************************************/
.fixed-top {
    background: #fff;
}
.fixed-top-box {
    padding: 10px 0 0;
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.nav-right>ul>li>a {
    padding: 5px 0 0 1px;
    color: #333;
    display: inline-block;
}
.nav-right .nav-shopbag>ul>li>a {
    padding: 5px 0 0 0;

    margin-left: -10px;
}


.nav>li>a:focus,
.nav>li>a:hover,
.nav .open>a,
.nav .open>a:hover,
.nav-r-bottom .nav-r-bottom-item a:hover {
    background-color: transparent;
    text-decoration: underline;
}

.nav-r-sideBox .navbar-nav.nav-main>li>a:hover {
    text-decoration: none;
    background: #f0fffc;
    color: #000;
}

.nav-r-sideBox .navbar-nav.nav-main>li>ul>li>a:hover {
    color: #000;
    background: #efefef;
}


.navbar-nav.nav-main {
    margin: 0 auto;
    float: none;
    display: inline-block;
}

.web-main-box .wmain-list a {
    letter-spacing: 0.2rem;
    font-size: 1.1em;
    color: #019576;
}

.web-main-box .wmain-list a:hover {

    color: #54d2b8;
}
.wmain-dlist-list {
    text-align: left;
    display:none;
}
.wmain-list:hover > .wmain-droplist{
display: block;
}



.wmain-droplist {
    display: none;
    width: 100%;
    position: absolute;
    left: 0;
    top: 50px;
    background: #f5fffd;
    z-index: 9;
    padding: 30px 30px 50px 30px;
}

.web-main-box .wmain-droplist a {
    display: block;
    letter-spacing: 0.2em;
    font-size: 0.9em;
    text-align: left;
}

.wmain-dlist-list>li+li:before {
    padding: 0 5px;
    color: #ccc;
    content: "|\00a0";
    display: inline-block;
}

.web-main-box .wmain-droplist .wmain-dlist-list li a {
    display: inline-block;
    color: #000000;
}

.wmain-droplist .wmain-dlist-list ul li a {
    display: inline-block;
}

.wmain-list .wmain-droplist>div>a {
    font-size: 0.9em;
    margin: 30px 0 0 0;
}

.wmain-dlist-list li {
    display: inline-block;
    text-align: left;
}


.nav-bag p {
    background: url(../img/bag.png) top center;
    background-size: cover;
}

.nav-logo {
    display: inline-block;
    margin-top: 10px;
    vertical-align: top;
    z-index: 3;
    position: absolute;
}

.web-main-box .wmain-droplist .wmain-dlist-list.pic li a img {
    width: 80px;
    max-height: 80px;
    vertical-align: bottom;
    margin-right: 9px;
}

.wmain-dlist-list.pic li {
    margin: 10px 20px 10px 0;
}

.wmain-dlist-list.pic>li+li:before {
    display: none;
}





/*************** nav 右邊 **************************/

.nav-r-top {
    font-size: 16px;
    float: right;
}

.nav-r-top li {

    float: none;
    display: inline-block;
    vertical-align: text-bottom;
}

li.nav-member span {
    margin-left: 5px;
}

.fixed-top .shopbag-badge {
    display: inline-block;
    min-width: 10px;
    padding: 1px 7px;
    font-size: 0.7em;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    background-color: #f22;
    border-radius: 3px;
    position: absolute;
    bottom: 3px;
    right: 0;
}

.nav-right {
    max-width: 240px;
    margin-right: 15px;
    z-index: 20;
    position: relative;
}

.nav-shopbag a i {
    font-size: 30px;
    color: #cccccc;
}

.navbar-right form button {
    border-left: none;
}

li.nav-r-bottom-item {
    display: inline-block;
}

.nav-r-bottom {
    font-size: 0.9em;
    margin-bottom: 15px;
    list-style: none;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: left;

}

.navbar-nav>li.nav-r-bottom-item {

    display: inline-block;
}

.nav-r-bottom .nav-r-bottom-item a {
    font-size: 17px;
}

.nav-r-bottom-item+.nav-r-bottom-item::before {
    display: inline-block;
    padding-right: .3rem;
    padding-left: .3rem;
    color: #868e96;
    content: "/";
}





/***選單下滑區塊***/

.dropdown-menu li:hover .dropdown-menu {
    visibility: visible;
}

.dropdown:hover .dropdown-menu {
    display: block;
}


li.dropmenu-item {
    height: 60px;
}

li.dropmenu-item {
    height: 60px;
}

.dropmenu-logobox>li>a {
    height: 60px;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    align-items: center;
}

li.dropmenu-item img {
    width: 60px;
    padding: 5px;
}

li.dropmenu-item span {}

.glyphicon-chevron-left:before {
    display: none;
}

.glyphicon-chevron-right:before {
    display: none;
}






/************ 下滑更正 *************************/

.web-main-box {
    position: absolute;
    width: 100%;
    left: 0;
    margin-top: 15px;
	display: block;
}

.web-main {
    margin-right: 7%;
}

.main-droplist {
    width: 100%;
    background: #999;
}

.wmain-list {
    display: inline-block;
    padding: 15px;
    min-width: 90px;
}



/***** nav右滑 ********/

.nav-r-sideBox {
    background-color: #fff;
    position: fixed;
    width: 50%;
    max-width: 300px;
    min-width: 280px;
    height: 100%;
    right: 0;
    top: 0;
    overflow: auto;
    box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.4);
    z-index: 151;
    display: none;
}

.nav-r-sideBox.show {
    animation-name: fadeInRight;
    -moz-animation-name: fadeInRight;
    -webkit-animation-name: fadeInRight;
    animation-duration: 0.2s;
    -moz-animation-duration: 0.2s;
    -webkit-animation-duration: 0.2s;
    animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}

.bg-dark {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .4);
    z-index: 100;
}

.nav-r-sideBox .nav-right {
    max-width: initial;
}

.nav-r-sideBox form {
    width: 80%;
    margin: 0 auto;
}

.nav-r-sideBox .nav-r-top {
    margin: 0;
    padding: 0;
    width: 85%;
    text-align: right;
}

.nav-r-sideBox .nav-shopbag a i {
    font-size: 30px;
    color: #ffffff;
}

.nav-r-sideBox .nav-right {
    max-width: initial;
    background: #47dabc;
    margin-right: 0;
    padding: 40px 0 15px 0;
}

.nav-r-sideBox .navbar-nav.nav-main>li>a {
    padding: 20px 10px;
    letter-spacing: .1em;
    font-size: 20px;
    border-bottom: 1px solid #dddddd;
    color: initial;
}

.nav-main-list li a {
    padding: 20px 10px;
    letter-spacing: .1em;
    font-size: 20px;
    border-bottom: 1px solid #cfcfcf;
    display: block;
    background: #dddddd;
    text-indent: 25px;
}

.nav-r-sideBox .close {
    display: block;
    width: 32px;
    height: 27px;
    position: absolute;
    top: 15px;
    right: 3%;
    cursor: pointer;
    z-index: 101;
}

.nav-r-sideBox .close span {
    width: 100%;
    height: 4px;
    background: #fff;
    border: none;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    cursor: pointer;
}

.nav-r-sideBox .close .ham-right {
    -webkit-transform: translateY(9px) translateX(0) rotate(45deg);
    transform: translateY(9px) translateX(0) rotate(45deg);
}

.nav-r-sideBox .close .ham-left {
    -webkit-transform: translateY(9px) translateX(0) rotate(-45deg);
    transform: translateY(9px) translateX(0) rotate(-45deg);
}




.nav-r-side .nav-main-list li a {
    padding: 20px 10px;
    letter-spacing: .1em;
    font-size: 20px;
    border-bottom: 1px solid #cfcfcf;
    color: initial;
    display: block;
    background: #dddddd;
    text-indent: 25px;
}
.nav-r-side .panel-body {
    padding: 0;
}

.nav-r-side .panel-body .navbar-nav {
    margin: 0;
}

.nav-r-side .panel-body .navbar-nav li.panel {
    margin-bottom: 0;
    border: none;
}
.nav-r-side .panel-body ul li a{
    background: #e4e4e4;
}
.nav-r-side .panel-body ul li a:hover ,
.nav-r-side .panel-body ul li a:focus {
    background: #e4e4e4;
    color: #000;
    text-decoration: none;
}

.nav-r-side .panel-body .navbar-nav li.panel .lv3 .panel-body ul li a{
    background: #d0d0d0;
}
.nav-r-side .panel-body .navbar-nav li.panel .lv3 .panel-body ul li a:hover,
.nav-r-side .panel-body .navbar-nav li.panel .lv3 .panel-body ul li a:focus{
    background: #d0d0d0;
}
.nav-r-side .nav-main-list li a span {
    text-indent: 0;
}


/* nav 0209 更新樣式 */
nav.navbar-findcond { background: #fff; border-color: #ccc; box-shadow: 0 0 2px 0 #ccc; }
nav.navbar-findcond li.divider { background: #ccc; }
nav.navbar-findcond button.navbar-toggle { background: #fff; border-radius: 2px; }
nav.navbar-findcond button.navbar-toggle > span.icon-bar { background: #ccc; }
nav.navbar-findcond ul.dropdown-menu { border: 0; background: #fff; border-radius: 0; margin:0; box-shadow: 0 0 4px 0 #ccc; }
nav.navbar-findcond ul.dropdown-menu > li > a { color: #019576; }
nav.navbar-findcond ul.dropdown-menu > li > a:hover { background: #009577; color: #fff; }
nav.navbar-findcond ul.dropdown-menu > li > a:hover span { background: #fff; border-radius: 15px; width: 25px; height: 25px; display: inline-block; line-height: 26px; text-align: center;}
.wmain-list .nav>li>a:focus,.wmain-list .nav>li>a:hover,.wmain-list .nav .open>a,.wmain-list .nav .open>a:hover,.wmain-list .nav-r-bottom.wmain-list .nav-r-bottom-item a:hover { text-decoration: none;}
.wmain-list .navbar-nav{float: none;}
.wmain-list .navbar-nav>li { float: none; display: inline-block;}
.web-main-box .wmain-list a { letter-spacing: 1.2px; font-size: 19px; color: #019576;}
.web-main-box .navbar-nav .dropdown-menu .caret {transform: rotate(-90deg); }

.dropdown-submenu{position:relative;}
.dropdown-submenu>.dropdown-menu{top:0;left:100%;margin-top:-6px;margin-left:-1px;-webkit-border-radius:0 6px 6px 6px;-moz-border-radius:0 6px 6px 6px;border-radius:0 6px 6px 6px;}
.dropdown-submenu:hover>.dropdown-menu{display:block;}
.dropdown-submenu>a:after{display:block;content:" ";float:right;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px 0 5px 5px;border-left-color:#cccccc;margin-top:5px;margin-right:-10px;}
.dropdown-submenu:hover>a:after{border-left-color:#ffffff;}
.dropdown-submenu.pull-left{float:none;}.dropdown-submenu.pull-left>.dropdown-menu{left:-100%;margin-left:10px;-webkit-border-radius:6px 0 6px 6px;-moz-border-radius:6px 0 6px 6px;border-radius:6px 0 6px 6px;}
.dropdown-submenu{position:relative;}
.dropdown-submenu>.dropdown-menu{top:0;left:100%;margin-top:-6px;margin-left:-1px;-webkit-border-radius:0 6px 6px 6px;-moz-border-radius:0 6px 6px 6px;border-radius:0 6px 6px 6px;}
.dropdown-submenu:hover>.dropdown-menu{display:block;}
.dropdown-submenu-b:hover>.dropdown-menu{display:block;}
.dropdown-submenu>a:after{display:block;content:" ";float:right;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px 0 5px 5px;border-left-color:#cccccc;margin-top:5px;margin-right:-10px;}
.dropdown-submenu:hover>a:after{border-left-color:#ffffff;}
.dropdown-submenu.pull-left{float:none;}.dropdown-submenu.pull-left>.dropdown-menu{left:-100%;margin-left:10px;-webkit-border-radius:6px 0 6px 6px;-moz-border-radius:6px 0 6px 6px;border-radius:6px 0 6px 6px;}
.web-main .nav span{margin-right: 5px;background: #fff; border-radius: 15px; width: 25px; height: 25px; display: inline-block; line-height: 26px; text-align: center;}


/****** 0312 更新 ************/
#dropdown-lvl2 ul li{
    text-indent: 20px;
}


/***** 購物車右滑出 ****************/

.slide-shop-box {
    background: #252525;
    color: #fff;
    position: fixed;
    width: 50%;
    max-width: 300px;
    min-width: 280px;
    height: 100%;
    right: 0;
    top: 0;
    overflow: auto;
    box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.4);
    z-index: 151;
}

.slide-shop-box.show {
    animation-name: fadeInRight;
    -moz-animation-name: fadeInRight;
    -webkit-animation-name: fadeInRight;
    animation-duration: 0.2s;
    -moz-animation-duration: 0.2s;
    -webkit-animation-duration: 0.2s;
    animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}

.slide-shop-box .nav-right {
    max-width: initial;
}

.slide-shop-box form {
    width: 80%;
    margin: 0 auto;
}

.slide-shop-box .nav-r-top {

    margin: 0;
    padding: 0;
}

.slide-shop-box .nav-shopbag a i {
    font-size: 30px;
    color: #ffffff;
}

.slide-shop-box .nav-right {
    max-width: initial;
    background: #47dabc;
    padding: 40px 0 15px 0;
}

.slide-shop-box .navbar-nav.nav-main>li>a {
    padding: 20px 10px;
    letter-spacing: .1em;
    font-size: 20px;
    border-bottom: 1px solid #dddddd;
}

.nav-main-list li a {
    padding: 20px 10px;
    letter-spacing: .1em;
    font-size: 20px;
    border-bottom: 1px solid #cfcfcf;
    display: block;
    background: #dddddd;
    text-indent: 25px;
}
.nav-main-list li a {
    padding: 20px 10px;
    letter-spacing: .1em;
    font-size: 20px;
    border-bottom: 1px solid #cfcfcf;
    display: block;
    background: #dddddd;
    text-indent: 25px;
}

.slide-shop-box .close {
    display: block;
    width: 32px;
    height: 27px;
    position: absolute;
    top: 15px;
    right: 3%;
    cursor: pointer;
    z-index: 101;
}

.slide-shop-box .close span {
    width: 100%;
    height: 4px;
    background: #fff;
    border: none;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    cursor: pointer;
}

.slide-shop-box .close .shop-right {
    -webkit-transform: translateY(9px) translateX(0) rotate(45deg);
    transform: translateY(9px) translateX(0) rotate(45deg);
}

.slide-shop-box .close .shop-left {
    -webkit-transform: translateY(9px) translateX(0) rotate(-45deg);
    transform: translateY(9px) translateX(0) rotate(-45deg);
}

.slide-shop-box .shop-con-box a {
    margin: 0 auto;
    color: initial;
}

.slide-shop-box .btn {
    width: 45%;
    margin: 0 auto;
    background: #ffca00;
}
.slide-shop-box .btn-gentel{
    background: #ffbd31;
}
.slide-shop-box .btn-cycle{
    background: #ff4848;
}

.slide-shop-box i.s-pg {
    font-size: 13px;
    font-weight: bold;
    background: #ffbd31;
    border-radius: 3px;
    padding: 2px 5px;
    color: #000;
    margin-right: 5px;
}
.slide-shop-box i.s-pc {
    font-size: 13px;
    font-weight: bold;
    background: #ff4848;
    border-radius: 3px;
    padding: 2px 5px;
    color: #000;
    margin-right: 5px;
}

.slide-shop-box .shop-con-box {
    margin-top: 65px;
    text-align: center;
}

.slide-shop-box .shop-con-list {
    padding: 20px 10px;
    border-bottom: 1px solid #555;
    position: relative;
}

.slide-shop-box .pro-info {}

.slide-shop-box img {
    width: 30%;
    float: left;
    margin-right: 5px;
}

.slide-shop-box p,
.slide-shop-box p a {
    color: #fff;
    text-align: left;
    font-size: 14px;
    text-align: justify;
}

.slide-price s {
    font-size: 14px;
}

.slide-price b {
    margin-left: 5px;
    color: #33fde9;
    font-size: 15px;
    font-weight: bold;
}

.slide-price {
    text-align: left;
}

.slide-det {
    position: absolute;
    right: 0;
    bottom: 6px;
    opacity: 0.5;
}

.slide-det i {
    padding: 10px;
}



/******* 大輪播 *************/

.slide-box .carousel-inner>.item>a>img {
    width: 100%;
}



/*************** 有list-group的部分 ****/

.section-part2 {
    margin-top: 20px;
}




/*************** 麵包屑 ***/

.breadcrumb-list-row {
    background-color: #f5f5f5;
    margin-bottom: 20px;
    width: 100%;
    float: left;
}

.breadcrumb {
    margin-bottom: 0;
/*    padding: 8px 15px 8px 0 ;*/
}

.breadcrumb li a,
.breadcrumb li.active {
    color: #777777;
    font-size: 0.9em;
}

a.breadcrumb-home {
    color: #009577;
}

.breadcrumb li a i:before {
    opacity: 0.5;
}






/*************** aside ***/

.aside-select {
    display: none !important;
    width: 100% !important;
    padding: 10px 15px !important;
}

.aside-select>.btn:first-child {
    padding: 10px 15px !important;
    font-size: 1.1em;
}

.dropdown-menu,
.dropdown-header {
    font-size: 1em;
}

.badge-list-group {
    margin: 5px 0;
    background: #0dc1b2;
    font-size: 15px;
}

.badge-list-group2 {
    vertical-align: top;
    background: #0dc1b2;
    border-radius: 3px;
    float: none !important;
    margin: 3px;
    vertical-align: text-bottom;
}

.pentel-list-group {
    background: #0dc1b2;
    border-color: #0dc1b2;
}

.pentel-list-group>.panel-heading {
    background: #0dc1b2;
    color: #fff;
}

.pentel-list-group .panel-title {
    font-size: 1.4em;
    font-weight: bold;
}

.pentel-list-group .list-group-item-box {
    display: none;
    background-color: #fff;
    border: 1px solid #ddd;
    text-indent: 10px;
}
.pentel-list-group .list-group-item-box-in {
    border-top: 1px solid #0dc1b2;
}
.pentel-list-group .list-group-item {
    border: 1px solid #0dc1b2;
}

.pentel-list-group .list-group-item-box li.list-group-item {
    background-color: #f7fffe;
}

.pentel-list-group .list-group-item-box li.list-group-item-in {
    background-color: #f7fffe;
}
.list-group-item:active > .list-group-item-box,
.list-group-item:focus > .list-group-item-box,
.list-group-item:visited > .list-group-item-box{
    display: block;
}




li.list-group-item a {
    display: block;
    color: initial;
}

.pentel-list-group .list-group-item-box .list-group-item {
    background-color: #fff;
}

.pro-transport li {
    margin-top: 30px;
    display: inline-block;
}








/*************** 搜尋bar+排序bar ***/

.top-information {
    font-size: 0.9em;
    margin: 0 15px;
}

.b-b {
    border-bottom: 1px solid rgba(0, 0, 0, 0.3) !important;
}

.top-information .serch-w span {
    color: #c8005e;
    font-size: 1.2em;
    font-weight: bold;
}

.Sort p,
.Sort ul,
.Sort li {
    display: inline;
    *display: inline;
    text-align: center;
}

.Sort li>a {
    color:initial
}

.Sort li {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.serch-w {
    padding: 5px 0;
}

.Sort {
    margin-bottom: 40px;
    padding: 5px 0;
}

.Sort li.active {
    color: #c8005e;
}

.Sort li a.active {
    color: #c8005e;
}

.Sort>ul>li+li:before {
    padding: 0 5px;
    color: #ccc;
    content: "|\00a0";
}

.Sort .dropdown .btn {
    font-size: 18px;
    border: none;
}
.Sort.Sort-mob{display: none;}





/*************** 大輪播 ***/

.carousel-img-box img.mob-on {
    width: 100%;
}

/*.iTopBnC{
    margin-bottom: 50px;
}
*/




/*************** logo box 一般設定***/

.logo-box .logo-box-title {
    display: none;
}



.logo-box-bar h3 {
    font-size: 16px;
    text-align: center;
    font-weight: normal;
    display: none;
}

.logo-box-bar li:hover>a>h3 {
    text-decoration: none;
}

.logo-box-bar>ul {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
}

.logo-box-bar>ul>li {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 15px 12px;
    width: 8%\9;
    display: inline-block\9;
    text-align: center\9;
}

.logo-box-bar li:hover {
    /*background: #c6eee6;*/
    background: rgba(0,0,0,0.3);
}

.logo-box-bar>ul>li>a {
    color: initial;
}

.logo-box-bar ul li a img {
    width: 100%;
    display: block;
}

.logo-box {
    background: #3aa8f3;
    overflow: hidden;
}

.logo-box .logo-box-bar ul li a{
    color: #fff;
}

/*************** logo box 有標題***/

.logo-box.logo-title .logo-box-title {
    display: block;
    text-align: justify;
}

.logo-box.logo-title .logo-box-bar {
    background: transparent;
    overflow: visible;
}

.logo-box.logo-title .logo-box-bar ul {
    border-radius: 60px;
    height: 120px;
    border: 5px solid #27c1a2;
    background: #fff;
    overflow: hidden;
    margin: 0 auto;
    background: #f4fffd;
}

.logo-box.logo-title {
    padding-top: 70px;
    padding-bottom: 70px;
    background: #69c8b5;
    color: #fff;
    text-shadow: 1px 1px 0 #3d8a7a;
}

.logo-box .logo-box-title {
    padding-bottom: 0;
}

.logo-box.logo-title p {
    padding-bottom: 10px;
    text-indent: 30px;
    font-weight: bold;
}

.logo-box.logo-title p:nth-last-child(1) {
    padding-bottom: 30px;
}





/*************** 橫幅大BN ***/

.con12-bn {
    margin-bottom: 50px;
}

.con12-bn .big-bn>img {
    display: block;
    width: 100%;
}





/***聖誕節熱銷 4格 ***/

.hotsale {
    /*margin-bottom: 40px;*/
    padding: 50px 15px 20px 15px;
}

.salebox_probox {
    display: -webkit-flex;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
}

.like {
    position: absolute;
    z-index: 1;
    top: 10px;
    right: 20px;
    color: #999;
}

.like.on {
    color: #ff0000;
}



/*.pro-col4 a {
    padding: 10px;
}*/

.pro-col4 img {
    padding: 20px;
}

.salebox-buy.buy-gentel {
    display: block;
    overflow: hidden;
    border-bottom: 1px solid #e7eaec;
    margin-bottom: 10px;
    padding-bottom: 10px;
}

.salebox-buy.buy-cycle {
    display: block;
    overflow: hidden;
}

.salebox-buy.buy-cycle {
    display: block;
    overflow: hidden;
}


.salebox .caption .salebox-title {
    margin-bottom: 10px;
}

.pro-col4 {
    margin-bottom: 10px;
    padding: 0 8px;
}

.salebox-title h3 {
    font-size: 1em;
    line-height: 1.5em;
    margin-bottom: 5px;
    color: #0ca083;
    font-weight: bold;
}




.salebox .sale-price {
    color: #fe7f02;
    font-weight: bold;
    height: 27px;
}

.salebox .buy-cycle .sale-price {
    color: #fe2602;
}



.salebox .caption>div:nth-last-child(1) {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

button.btn-buy i {
    font-size: 1em;
    margin: 0 4px 0 0;
}

.salebox button.btn-buy {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    display: inline-block;
    padding: 3px 10px;
    margin-bottom: 0;
    font-size: 0.9em;
    font-weight: bold;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
}

.salebox button.btn-soldout {
    margin-top: 5px;
    color: #fff;
    background: #dddddd;
}

.salebox button.btn-gentel {
    margin-top: 5px;
    color: #fff;
    background: #fe7f02;
}

.salebox button.btn-gentel:hover {
    background: #ff9900;
}

.salebox button.btn-cycle {
    margin-top: 5px;
    color: #fff;
    background: #fe2602;
}

.salebox button.btn-cycle:hover {

    background: #ff370a;
}


.salebox .original-price {
    font-size: 0.8em;
    text-decoration: line-through;
    color: #dddddd;
}

.sale-price em {
    font-size: 0.9em;
}

.sale-price i {
    font-size: 0.8em;
    vertical-align: baseline;
}

.sale-price b {
    font-size: 1.4em;
    line-height: 1em;
    vertical-align: baseline;
}

.salebox .salebox-title p.p-xs {
    font-size: 0.8em;
}






/** 聖誕節熱銷 標題 **/

.salebox .hotsale-h1 {
    display: block;
    text-align: center;
    margin-bottom: 40px;
}

.salebox .hotsale-h1 img {
    max-width: 230px;
    width: 100%;
}

.salebox .hotsale-h1 h1 {
    font-size: 2em;
    line-height: 1em;
}


.salebox .hotsale-h1 h1:before {
    content: url('../img/index2.png');
    margin-right: 5px;
}

.salebox .hotsale-h1 h1:after {
    content: url('../img/index2.png');
    display: inline-block;
    margin-left: 5px;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}





/***首頁商品 2格***/

.pro-col2 {
    margin-bottom: 10px;
    padding: 0 8px;
}

.thumbnail {
    overflow: hidden;
}

.pro-col2 img {
    float: left;
    max-width: 250px;
    padding: 10px;
}

.caption.pro-col2-caption {
    width: 60%;
}

.salebox .pro-col2 .caption .salebox-title h3 {
    width: 94%;
}

.pro-col2 a {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 320px;
   /* border: 5px solid #88ffe7;*/
}

.col2sale {
    /*background: #69c8b5;*/
    padding: 50px 0 20px 0;
}

.col2sale img.col2_bn{
    max-width: 100%;
    padding:0 15px;
    margin-bottom: 15px;
}


/*** 首頁商品 3檔 ***/

.col3sale {
    /*margin-bottom: 30px;*/
    padding: 30px 15px;
}

.salebox-titlen{
    display: none;
}

/* .pro-col3 {
    padding: 0;
} */

.pro-col3 a {
    border-radius: 0;
    padding: 0 0 10px 0;
}

.pro-col3 .embed-responsive{
    width: 300px;
    height: 242px;
    padding: 0;
    margin: 0 auto;
}
.pro-col3 iframe{
    width: 300px;
    height: 242px;
}
.pro-col3 img {
    width: 100%;
    max-width: 300px;
    display: block;
    margin: 0 auto 10px auto;
}

.col3sale .salebox_probox {
    padding: 0 15px;
}

.pro-col3 .thumbnail {
    border: none;
}

.pro-col3 .salebox-buy {
    margin: 0 auto;
    text-align: center;
    margin: 10px auto 0 auto;
}

.pro-col3 .salebox-buy button {
    width: 80%;
    margin: 0 auto;
}




/*** 首頁商品 1檔 ***/

/*.col1sale {
    margin-bottom: 50px;
}*/

.pro-col1 img {
    float: left;
    /* width: 35%; */
    padding: 20px;
}

.col1sale a {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    align-items: center;
}

.caption.pro-col1-caption {
    width: 65%;
    padding-right: 20px;
    font-size: 1.3em;
}

.pro-col1-caption h3 {
    font-size: 1em;
    line-height: 1.6em;
    margin-bottom: 10px;
    width: 96%;
}

.pro-col1-caption .sale-price {
    height: 29px;
}

.pro-col1-caption .salebox-buy.buy-gentel,
.pro-col1-caption .salebox-buy.buy-cycle {
    padding: 10px 0;
}


/*0205*/
.sale1Bn .caption.pro-col1-caption { float: left;}






/***** 首頁商品 1檔 修改大小後  *********/

.col1sale a {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    align-items: center;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 320px;
}

.pro-col1 img {
    padding: 20px;
    float: left;
    /* width: 40%; */
    max-width: 500px;
    padding: 20px;
}

.pro-col1 .like {
    position: absolute;
    z-index: 1;
    top: 20px;
    right: 30px;
    color: #999;
}

.caption.pro-col1-caption {
    width: 60%;
    padding-right: 30px;
    font-size: 1em;
}

.pro-col1-caption h3 {
    width: 96%;
    font-size: 1.4em;
    line-height: 1.5em;
    margin-bottom: 5px;
    color: #0ca083;
    font-weight: bold;
}
.salebox .pro-col1-caption .salebox-title p.p-xs{
    font-size: 1em;
}

.pro-col3{
    padding: 0;
}
.pro-col3-caption {
    text-align: center;

}









/*** 首頁商品 1檔+大圖 ***/

.col1salePic {
    margin-bottom: 0;
    padding: 40px 15px;
}

.col1salePic .pic {
    width: 100%;
}

.col1salePic .pic img {
    width: 100%;
    display: block;
}

.col1salePic .salebox_probox {
    background: #e7d3aa;
    padding: 0 15px;
}

/****** 商品列表 自訂頁 ****/
.defTitle { font-size: 50px; line-height: initial; margin-top: 50px; text-align: center; }
.selfEdit-box {
    margin: 20px -15px 80px -15px;
}
.side-menu .navbar-nav li a .ptoLisG{
    font-size: 13px;
    float: right;
    margin: 5px 0 0 0;
    padding: 0 !important;
    color: #0dc1b2;
}

/*** 商品頁 3/1格產品圖 ***/

.pro-slide .item {
    width: 110px;
}

.pro-slide .item.active,
.pro-slide .item,
.pro-slide .item.active img,
.pro-slide .item img {
    width: 100%;
}
.pro-slide .item.active{
        border: 1px solid #f5f5f5;
}

.pro-col-1-3-img {
    margin: 0 0 0 -15px;
}

.pro-slide-btn li {
    width: 20% !important;
    padding-top: 10px;
}

.pro-slide-btn li img {
    width: 100% !important;
}

.pro-slide-btn li a {
    padding: 0;
    margin: 0;
}

.pro-slide-btn {
    width: 90%;
    margin: 0 auto;
}

.pro-slide-btn li ul {
    display: inline-flex;
    justify-content: center;
}

.pro-slide-box a.carousel-control.left {
    height: 20px;
    top: 84%;
    background: transparent;
    width: 5%;
    left: 0;
    display: none;
}

.pro-slide-box a.right.carousel-control {
    height: 20px;
    top: 84%;
    background: transparent;
    width: 5%;
    right: 0;
    display: none;
}

.icon-left-open:before,
.icon-right-open:before {
    font-size: 1vw;
    color: #555;
    text-shadow: none;
}

.pro-slide-btn .nav>li>a:focus,
.pro-col-1-3-img .nav>li>a:hover,
.pro-col-1-3-img .nav-pills>li.active>a,
.pro-col-1-3-img .nav-pills>li.active>a,
.pro-col-1-3-img .nav-pills>li.active>a:focus,
.pro-col-1-3-img .nav-pills>li.active>a:hover {
    border: none;
    background: transparent;
}

/*** 首頁 自定義區塊 ***/

.seDefineBox { width: 100%;}
.seDefineBox img{ max-width: 100%;display: block;margin: 0 auto; }


.re_img img {
    width: 100% !important;
    height: auto !important;
    display: block;
    margin: 0 auto;
}
/*** 商品頁 3/1格產品說明 ***/

.pro-col-1-3-data {
    margin-top: 50px;
}

.pro-col-1-3-data h1 {
    font-size: 1.4em;
    line-height: 1.3em;
    font-weight: bold;
    color: #019576;
}

.pro-col-1-3-data .pro-size {
    font-size: 17px;
}

.pro-col-1-3-data .pro-describe {
    margin-top: 30px;
    font-size: 1em;
    line-height: 1.5em;
    padding-bottom: 30px;
}

.pro-col-1-3-data .pro-discount-w {
    font-size: 1em;
    line-height: 1.5em;
    border-left: 10px solid #ff6c00;
    padding-left: 10px;
}

.pro-similar {
    margin-top: 30px;
    font-size: 1em;
    line-height: 1.5em;
    padding-bottom: 30px;
}

.pro-similar label {
    background: #0dc1b2;
    padding: 3px 20px;
    margin-bottom: 3px;
    color: #fff;
}

.pro-similar-item-box>ul>li+li:before {
    padding: 0 5px;
    color: #ccc;
    content: "/\00a0";
}

.pro-similar-item-box>ul>li {
    display: inline-block;
    font-size: 1em;
}

.pro-transport b,
.pro-transport-item-box {
    display: inline-block;
    font-size: 1em;
}



.pro-discount-price {
    margin-top: 5px;
    font-size: 17px;
}

.pro-discount-price li,
.pro-discount-price label,
.pro-discount-price p {
    display: inline-block;
}

.pro-discount-price>li {
    margin-right: 10px;
}

.pro-discount-price .orignal {
    opacity: 0.8;
}

.discount-price label {
    margin-right: 5px;
    color: #ff6c00;
}

.pro-amount {
    margin-top: 30px;
    font-size: 1em;
}

/*.pro-amount li {
    color: #666;
}*/

.pro-cycl-order {
    margin-top: 30px;
    font-size: 1em;
}

.pro-amount li select,
.pro-cycl-order li select {
    padding: 0 25px;
    height: 40px;
    min-width: 45px;
}

.main-content button.btn-gentel,
.main-content button.btn-cycle {
    margin-top: 0;
    height: 40px;
}

.salebox_probox button.btn-buy,
.salebox_probox .btn-gentel {
    font-size: 1em;
}

.pro-buttom-dsecript img {
    max-width: 100%;
}

.pro-buttom-dsecript {
    margin-top: 80px;
/*    padding: 50px 0;*/
    border-top: 1px solid #dddddd;
}

.pro-buttom-dsecript .h2 {
    margin-top: 30px;
    font-size: 1.2em;
    line-height: 1em;
    border-left: 10px solid #ccc;
    padding-left: 10px;
}



/********** 浮動購物車 ***************/

.float-r {
    position: fixed;
    right: 40px;
    bottom: 40px;
    text-align: center;
    cursor: pointer;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    z-index: 150;
}

.float-r.shop_bn {
    right: 0;
    border: 0;
    bottom: 0;
    width: 150px;
}

.float-r .media {
    position: relative;
}

.float-r .media .close {
    display: block;
    width: 32px;
    height: 27px;
    position: absolute;
    top: 12%;
    right: 3%;
    cursor: pointer;
    z-index: 80;
    opacity: 0.8;
}

.float-r .media .close span {
    width: 100%;
    height: 4px;
    background: #fff;
    border: none;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    cursor: pointer;
}

.float-r .media .close .media-right {
    -webkit-transform: translateY(9px) translateX(0) rotate(45deg);
    transform: translateY(9px) translateX(0) rotate(45deg);
}

.float-r .media .close .media-left {
    -webkit-transform: translateY(9px) translateX(0) rotate(-45deg);
    transform: translateY(9px) translateX(0) rotate(-45deg);
}

.float-r .media a,
.media img {
    display: block;
    width: 100%;
}


.floatshop {
    right: 0;
    bottom: 40px;
    padding: 8px;
    background-color: #FFF;
    border: 1px solid #DDD;
    text-align: center;
    cursor: pointer;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    z-index: 10;
    margin-left: 80px;
    margin-right: 10px;
}

.floatshop .f-car {
    border-bottom: 1px solid #DDD;
    padding-bottom: 6px;
    margin-bottom: 6px;
}

.floatshop .f-car a {
    font-size: 15px;
    color:initial
}
.floatshop .f-car i:before {
    width: 35px;
    height: 35px;
    line-height: 35px;
    color: #FFF;
    text-align: center;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    background: #1bc7b7;
}

/*.floatshop .f-car i {
    width: 35px;
    height: 35px;
    line-height: 35px;
    color: #FFF;
    text-align: center;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    background: #1bc7b7;
    display: block;
    margin: 0 auto;
}

.floatshop .f-car i:before {
    line-height: 35px;
    text-align: center;
    color: #FFF;
}*/

.floatshop .f-car div span {
    display: block;
    color: #e70000;
}

.gotop i {
    color: #69c8b5;
}




/****** 浮動置底BN *************************/
.float-b {
    position: fixed;
    right: 0;
    bottom: 0;
    text-align: center;
    cursor: pointer;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    z-index: 50;
}

.float-b .media {
/*     width: 30%;
    min-width: 320px;
    position: fixed;
    bottom: 0;
    left: 50%;
    margin-left: -150px; */
    width: 750px;
    margin-left: -370px;
    position: fixed;
    bottom: 0;
    left: 50%;
}

.float-b .media .close {
    display: block;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 12%;
    right: 3%;
    cursor: pointer;
    z-index: 80;
    opacity: 0.8;
}

.float-b .media .close span {
    width: 100%;
    height: 2px;
    background: #fff;
    border: none;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    cursor: pointer;
}

.float-b .media .close .media-right {
    -webkit-transform: translateY(9px) translateX(0) rotate(45deg);
    transform: translateY(9px) translateX(0) rotate(45deg);
}

.float-b .media .close .media-left {
    -webkit-transform: translateY(9px) translateX(0) rotate(-45deg);
    transform: translateY(9px) translateX(0) rotate(-45deg);
}








/***** 填寫資料 ****************************/

.step-form .form-group {
    margin: 15px 0;
}

.panel-item {
    float: left;
}

.step-form .panel-heading {
    padding: 20px 50px;
}

.step-form .panel-body {
    padding: 5px 50px 10px 50px;
}

.panel-title {
    font-size: 1em;
}

.step-form .form-horizontal .checkbox,
.step-form .form-horizontal .checkbox-inline,
.step-form .form-horizontal .radio,
.step-form .form-horizontal .radio-inline {
    padding-bottom: 5px;
    padding-top: 0;
}

.step-form .checkbox-inline+.checkbox-inline,
.step-form .radio-inline+.radio-inline {
    margin-left: 0;
}

.step-form .step-order .radio.radio-info.radio-inline {
    display: block;
}

.step-form .form-inline .checkbox input[type=checkbox],
.step-form .form-inline .radio input[type=radio] {
    position: relative !important;
    margin-left: 0 !important;
}

.step-bl {
    margin-bottom: 10px;
    font-size: 1em;
    font-weight: bold;
    line-height: 1.5em;
    border-left: 10px solid #0dc1b2;
    padding-left: 10px;
}

.stepbystep {
    font-size: 0.9em;
    margin: 30px auto 50px auto;
    overflow: hidden;
    float: none;
    max-width: 1200px;
    width: 100%;
}

.step-from {
    margin: 40px 0;
}

.step-form-box {
    margin-bottom: 30px;
}

.step-form-box-s {
    margin-bottom: 20px;
}

.step-form .s-inc{
    color: #ff793a;
    font-weight: bold;
    font-size: 16px;
}

.stepbystep>div {
    display: inline-block;
    width: 49%;
    padding: 8px 0;
    text-align: center;
}

.stepbystep .stepbystep-1:after {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 50px 0 50px 86.6px;
    border-color: transparent transparent transparent #ff793a;
    color: #fff;
}



.arrow_box {
    position: relative;
    color: #fff;
}

.arrow_box:after,
.arrow_box:before {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.arrow_box:after {
    border-color: rgba(136, 183, 213, 0);
    border-left-color: #ff793a;
    border-width: 22px;
    margin-top: -22px;
    z-index: 10;
}

.arrow_box:before {
    border-color: rgba(194, 225, 245, 0);
    border-left-color: #fff;
    border-width: 34px;
    margin-top: -34px;
    z-index: 9;
}


.arrow_box.arrow_default {
    position: relative;
    background: #f3f3f3;
    color: #000;
}

.arrow_box.arrow_default:after {
    border-color: rgba(136, 183, 213, 0);
    border-left-color: #f3f3f3;
    border-width: 22px;
    margin-top: -22px;
    z-index: 10;
}

.arrow_box.arrow_default:before {
    border-color: rgba(194, 225, 245, 0);
    border-left-color: #fff;
    border-width: 34px;
    margin-top: -34px;
}

.stepbystep1 .arrow_box.step1 {
    background: #ff793a;
    color: #fff;
}

.stepbystep1 .arrow_box.step1:after {
    border-color: rgba(136, 183, 213, 0);
    border-left-color: #ff793a;
    border-width: 22px;
    margin-top: -22px;
    z-index: 10;
}

.stepbystep2 .arrow_box.step1,
.stepbystep2 .arrow_box.step2 {
    background: #ff793a;
    color: #fff;
}

.stepbystep2 .arrow_box.step1:after,
.stepbystep2 .arrow_box.step2:after {
    border-color: rgba(136, 183, 213, 0);
    border-left-color: #ff793a;
    border-width: 22px;
    margin-top: -22px;
    z-index: 10;
}

.stepbystep3 .arrow_box.step1,
.stepbystep3 .arrow_box.step2,
.stepbystep3 .arrow_box.step3 {
    background: #ff793a;
    color: #fff;
}

.stepbystep3 .arrow_box.step1:after,
.stepbystep3 .arrow_box.step2:after,
.stepbystep3 .arrow_box.step3:after {
    border-color: rgba(136, 183, 213, 0);
    border-left-color: #ff793a;
    border-width: 22px;
    margin-top: -22px;
    z-index: 10;
}






.r-add select {
    width: auto;
    display: inline-block;
    margin-bottom: 5px;
}


.step-form textarea {
    min-height: 150px;
}


.btn-back {
    color: #000;
    background-color: #f0f0f0;
    border-color: #f0f0f0;
    padding: 15px 25px;
    font-size: 0.9em;
    letter-spacing: 0.1em;
    margin-right: 10px;
}

.btn-next {
    color: #fff;
    background-color: #ff793a;
    border-color: #ff793a;
    padding: 15px 25px;
    font-size: 0.9em;
    letter-spacing: 0.1em;
}

.h1mob-on {
    display: none;

    width: 96%;
    font-size: 1em;
    line-height: 1.5em;
    font-weight: bold;
    width: 95%;
    color: #019576;
}




/**** 完成訂單 步驟三 *****************/

.tab-complete {
    border: 3px solid #555;
}

.tab-complete {
    border: 5px solid #0dc1b2;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    background: #ecfffd;
    padding: 40px 40px 30px 40px;
    font-size: 0.9em;
    line-height: 1.7em;
}

.tab-complete-box .panel-default {
    border: none;
}

.complete-notice {
    font-weight: bold;
}

.tab-complete p {
    margin-bottom: 20px;
}


.tab-complete .setp {
    margin-top: 70px;
}




/***** 最新消息 *************/

.news {
    margin-bottom: 100px;
}

.news ul li {
    padding: 30px 5px;
    border-bottom: 1px solid #ddd;
    overflow: hidden;
}

.news ul li:hover {
    background: #faffff;
}

.newsb .breadcrumb {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
}

.news .news-l {
    float: left;
}

.news .news-img {
    width: 20%;
    margin-right: 2%;
}
.news-c{
    float: left;
    width: 76%;
}
.news .news-img img {
    width: 100%;
}

.news .date {
    font-size: 0.9em;
    margin-bottom: 5px;
    color: #999;
}

.news .title {
    font-size: 1.1em;
    line-height: 1.7em;
    color: #05b38f;
    margin-bottom: 5px;
}

.news .content {
    margin-bottom: 5px;
    line-height: 1.7em;
    font-size: 1em;
    color: #999;
}

.news .news-r {
    float: right;
    margin-right: 5px;
}

.newsb .breadcrumb {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
}

.news button.btn-news {
    background: #bdbdbd;
    color: #fff;
    padding: 6px 20px;
    border-radius: 0;
}

/******* 最新消息 內 **********************/
.new-box{
    padding: 50px 0 100px 0;
}

.new-in p {
    margin-bottom: 20px;
}

.new-in img{
    max-width: 100%;
	height: auto !important;
}

.new-in .new-title{
    font-size: 1.7em;
    line-height: 1.3em;
    font-weight: bold;
}

/***** 會員中心 *************/

.member-box {
    max-width: 550px;
    width: 100%;
    margin: 50px auto;
}

.member-box .form-group.row {
    margin-bottom: 40px;
}

.member-box label {
    text-align: right;
}

.m-birth select {
    display: inline-block;
    width: auto;
}

.m-birth select+select {
    margin-left: 15px;
}



/**** 訂單管理 ******************************/

.orders {
    padding: 40px 0 100px 0;
}

.orders-list {
    margin-bottom: 50px;
}


/***** 訂單管理 table-rwd *************/

.open-table-box {
    width: 90%;
    margin-left: 10%;
    border: 1px solid #555;
    overflow: hidden;
}

.open-table tr {
    border-bottom: 1px solid #555;
}

.open-table td.open-tatol {
    text-align: right;
}

.table-box a {
    color: #069e90;
}

.table-box a:hover {
    text-decoration: underline;
}

.table-box span b {
    color: #ff7600;
    font-weight: bold;
}
.table-box span i {
    font-style: normal;
}

.table-box {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    text-align: center;
}

.table-box td+td {
    border-left: 1px solid #e5faf6;
    vertical-align: middle;
}
.table-box td {
    vertical-align: middle;
}

.table-box span {
    display: block;
}
.table-box .ord-tran {
    font-size: 13px;
    margin-top: 10px;
}
.table-box .ord-tran i{
    display: block;
}




span.order-id {
    font-weight: bold;
}

.rwd-table {
    background: #fff;
    overflow: hidden;
}

.rwd-table tr:nth-of-type(2n) {
    background: #fafffe;
}

.open-table tr:nth-of-type(2n) {
    background: #fbfbfb;
}

.open-table td+td {
    border-left: 1px solid #555;
}

.rwd-table th,
.rwd-table td {
    margin: 0.5em 1em;
}

.rwd-table {
    min-width: 100%;
}

.rwd-table th {
    display: none;
}

.rwd-table td {
    display: block;
}

.rwd-table td:before {
    content: attr(data-th) " : ";
    font-weight: bold;
    width: 6.5em;
    display: inline-block;
}

.rwd-table th,
.rwd-table td {
    text-align: left;
}

.rwd-table th,
.rwd-table td:before {
    background: transparent;
    color: #000;
}

.table-box div {
    display: inline-block;
}

.rwd-table th,
.rwd-table td:before {
    background: transparent;
}

.open-table {
    font-size: 0.9em;
}

.open-table i {
    display: block;
}

button.btn.open-list {
    float: right;
    margin-right: 15px;
    margin: 5px 10px 30px 0;
}

@media (min-width: 768px) {
    .rwd-table td:before {
        display: none;
    }

    .rwd-table th,
    .rwd-table td:before {
        background: #e5faf6;
        color: #000000;
        font-weight: bold;
    }
    .rwd-table th,
    .rwd-table td {
        display: table-cell;
        padding: 0.25em 0.5em;
    }

    .rwd-table th:first-child,
    .rwd-table td:first-child {
        padding-left: 0;
    }

    .rwd-table th:last-child,
    .rwd-table td:last-child {
        padding-right: 0;
    }

    .rwd-table th,
    .rwd-table td {
        padding: 1em !important;
    }
}
@media screen and (min-width: 768px) {
.orders-gentel table.oListTable th,.orders-gentel table.oListTable td{ width: 20%;}
.orders-cycle table.oListTable th,.orders-cycle table.oListTable td{ width: 12%;}

}

@media (max-width: 767px) {
    .open-table-box {
        margin: 0 auto;
    }

    .open-table-box {
        border: 11px solid #11bcac;
    }
    .open-table-box tr:nth-last-child(1) td {
        border-bottom: none;
    }
    .open-table tr {
        border-bottom: none;
    }
    .open-table td:before {
        display: none;
    }
    .open-table i {
        display: inherit;
    }
    .rwd-table tr:nth-of-type(2n) {
        background: transparent;
    }
    .rwd-table td:before {
        vertical-align: unset;
        width: 30%;
        text-align: right;
        margin-right: 30px;
    }
    .rwd-table th,
    .rwd-table td {
        border-bottom: 1px solid #defbf5;
        padding: 20px 0;
    }
    .table-box td+td {
        border-left: none;
    }
    .table-box div {
        vertical-align: middle;
    }
    .rwd-table th {
        vertical-align: sub;
        width: 60%;
    }
}


/***footer***/

.footer {
    /*background: #f0f0f0;*/
    height: auto;
    padding: 50px 0 10px 0;
    width: 100%;
  /*  margin-top: 30px;*/
}

.footer h4 {
    color: #333;
    font-weight: bold;
    font-size: 1em;
    border-right: 5px solid #6dcdba;
    border-left: 5px solid #6dcdba;
    padding: 0 15px;
    display: inline-block;
    vertical-align: top;
}

footer .list-inline>li {
    padding-right: 2px;
    padding-left: 1px;
}


.footer ul {
    font-size: 20px;
    list-style-type: none;
    vertical-align: top;
    margin: 10px 0 40px 20px;
}

.footer-item:not(:last-child)>a::after {
    display: inline-block;
    padding-left: .5rem;
    color: #868e96;
    content: "/";
}

.footer-item+.footer-item>a:nth-last-child(1) :after {
    display: none;
}

.footer ul li a {
    padding: 0 0 5px 0;
    display: block;
    font-size: 0.8em;
    line-height: 1.4em;
    color: #333;
}

.footer ul li a:hover {
    text-decoration: underline;
}

.footer ul.footer-item-box:nth-last-child(1) {
    margin-bottom: none;
}

.footerLogoBox {
    text-align: center;
}

.footer-bottom {
    background: #6dcdba;
    text-align: center;
    padding: 10px 0;
    font-size: 0.7em;
}

.footer .footerLogoBox a{
    display: block;
}

.footer /*.footerLogoBox*/ .footer-logo img {
    width: 100%;
    max-width: 165px;
}
#header_logo {
    width: 100%;
    max-width:165px;
}
.footEmail em{
    font-style: normal;
    display: block;
}
.footEmail{
    font-size: 15px;
    line-height: 18px;
    text-align: left;
    margin-top: 7px;
    color: #333;
}

.step-form.step-form-btn {
    margin-bottom: 80px;
}

/****** QNA ***********************/
.qna-box {
    margin-bottom: 100px;
    margin-top: 8px;
}
.qna-box li {
    list-style: decimal;
    margin-left: 40px;
   /** border-bottom: 1px solid #ddd;**/
        color: #009286;
}
.qna-box h2 {
    font-size: 1.1em;
    line-height: 1em;
    margin-bottom: 8px;
    text-indent: 19px;
    color: #555;
    border-left: 9px solid #0dc1b2;
}
.qna-box ul{
    margin-bottom: 50px;
}
.qna-box h4 a{
    display: block;
        color: #009286;
}
.qna-box .panel-default>.panel-heading+.panel-collapse>.panel-body {
    border-top: none;
    padding: 5px 20px 20px;
    color: #848484;
}
.qna-list .panel-group{
    margin-bottom: 0;
}
.qna-list .panel-group .panel {
    box-shadow:none;
    border: none;
}
.qna-list .panel-group .panel .panel-heading{
    padding-left: 0;
    background: transparent;
    border: none;
    padding: 10px 5px;
}

/********* 0311 會員中心 *************/
.mem-box {
    margin-bottom: 100px;
    margin-top: 8px;
}
.mem-box h2 {
    font-size: 1.1em;
    line-height: 1em;
    margin-bottom: 20px;
    text-indent: 19px;
    color: #555;
    border-left: 9px solid #0dc1b2;
}
.memData{
    margin-bottom: 60px;
}
.memData .btn{
    margin-top: 10px;
}
.mem-box tr th ,.mem-box tr td{
    text-align: center;
}
.mem-box .member-box .form-group.row {
    margin-bottom: 25px;
}

.memData .form-group label {
    vertical-align:middle;
    text-align: right;
}
.memData .form-group .form-control-static{
    vertical-align:middle;
    text-indent: 50px;
}

.memData .form-group .control-label {
    padding-top: 7px;
    margin-bottom: 0;
    text-align: right;
}

.memData .form-groupBtn{
    text-align: center;
    text-indent: -12%;
}

.memCen .list-group-item{
    width: 100%;
    padding: 0;
}
.memCen .nav-pills>li+li {
    margin-left: 0;
}
.memCen .member-box {
    max-width: 550px;
    width: 100%;
    margin: 0 auto;
}


.memCen .orderlist-tab>li.tab-gentel.active>a {
    background: #0ec2b2;
    text-decoration: none;
}
.memCen .orderlist-tab>li.tab-gentel.active>a:hover {
    background: #0ec2b2;
}


/*
.memCen .orderlist-tab>li.tab-cycle.active>a:hover {
    background: #0ec2b2;
}
.orderlist-tab>li.tab-cycle.active>a {
    background: #0ec2b2;

}*/

.memCen .orderlist-tab {
    border-bottom: 1px solid #0ec2b2;
}

/********* 關於我們 *************/

.about-box{
    padding: 50px 0 100px 0;
}

.about-in p {
    margin-bottom: 20px;
}

.about-in img{
    max-width: 100%;
}

.about-in .ab-title{
    font-size: 1.7em;
    line-height: 1.3em;
    font-weight: bold;
}

/***** 登入 *****************/

body.login {
    background: #f0fdff;
}
.nav-single .navbar-header{
    float: none;
}
.nav-single .navbar-brand{
    margin: 0;
    float: none;
    position: relative;
    height: auto;
}
.login-box {
    padding: 100px 0 100px 0;
}


.panel-login {
    border-color: #ccc;
    -webkit-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
}
.panel-login>.panel-heading {
    color: #00415d;
    background-color: #fff;
    border-color: #fff;
    text-align:center;
}
.panel-login>.panel-heading a{
    text-decoration: none;
    color: #666;
    font-weight: bold;
    font-size: 15px;
    -webkit-transition: all 0.1s linear;
    -moz-transition: all 0.1s linear;
    transition: all 0.1s linear;
}
.panel-login>.panel-heading a.active{
    color: #029f5b;
    font-size: 18px;
}
.panel-login>.panel-heading hr{
    margin-top: 10px;
    margin-bottom: 0px;
    clear: both;
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left,rgba(0, 0, 0, 0),rgba(0, 0, 0, 0.15),rgba(0, 0, 0, 0));
    background-image: -moz-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
    background-image: -ms-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
    background-image: -o-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
}
.panel-login input[type="text"],.panel-login input[type="email"],.panel-login input[type="password"] {
    height: 45px;
    border: 1px solid #ddd;
    font-size: 16px;
    -webkit-transition: all 0.1s linear;
    -moz-transition: all 0.1s linear;
    transition: all 0.1s linear;
}
.panel-login input:hover,
.panel-login input:focus {
    outline:none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    border-color: #ccc;
}
.btn-login {
    background-color: #59B2E0;
    outline: none;
    color: #fff;
    font-size: 18px;
    height: auto;
    font-weight: normal;
    padding: 10px 0;
    text-transform: uppercase;
    border-color: #59B2E6;
}
.btn-login:hover,
.btn-login:focus {
    color: #fff;
    background-color: #53A3CD;
    border-color: #53A3CD;
}
.form-group.text-center {
    margin-bottom: 5px;
}
.forgot-password {
    text-decoration: underline;
    color: #888;
}
.forgot-password:hover,
.forgot-password:focus {
    text-decoration: underline;
    color: #666;
}

.btn-register {
    background-color: #1CB94E;
    outline: none;
    color: #fff;
    font-size: 14px;
    height: auto;
    font-weight: normal;
    padding: 14px 0;
    text-transform: uppercase;
    border-color: #1CB94A;
}
.btn-register:hover,
.btn-register:focus {
    color: #fff;
    background-color: #1CA347;
    border-color: #1CA347;
}
.social-btn {
    margin-bottom: 20px;
}

.fb-btn-text {
    padding-left: 8px;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1.6px;
    color: #fff;
    font-weight: 700;
}

.google-btn-text {
    padding-left: 8px;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1.6px;
    color: #fff;
    font-weight: 700;
}
.social-btn{
    margin-bottom: 20px;
}




.inlineb>div {
    display: inline-block;
}
.inlineb {
    text-align: center;
}
.inlineb a {
    font-size: 15px;
    text-decoration: none;
}
.inlineb>div:nth-child(1) a {
   margin-right: 10px;
}
.bd .form-inline {
    display: inline-block;
        width: 25%;
}
.login-notice{
    margin-bottom: 5px!important;
}
.login-notice>div{
    font-weight: bold; text-align: left; font-size: 10pt; color: red;
}

.verification>div input ,
.verification>div div {
    display: inline-block;
    vertical-align: top;
}

.topInfo{
    text-align: center;
    margin: 0 15px 15px;
    background: #fff3de;
    border-radius: 20px;
}
.topInfo p{
    padding: 5px;
}
.topInfo a{
    display: inline-block;
    font-size: 15px;
    line-height: 23px;
    color: #f00;
}
.topInfo span{
    background: #f00;
    border-radius: 20px;
    color: #fff;
    margin-right: 10px;
    width: 20px;
    height: 20px;
    line-height: 14px;
}
.topInfo span:before{
    font-size: 11px;
    height: 11px;
}
.topInfo:hover{
    background: #ffe9c3;
}
.topInfo:hover p > a{
    text-decoration: underline;
}

.login .panel-body {
    padding: 10px 15px 15px;
}
.login label {
    font-size: 15px;
}

.receive.form-group {
    margin: 20px 0 0 0;
}
.check.form-group {
    margin: 5px 0 20px 0;
}

/****** 登入完成頁面 ********************/
.login-cbox {
    text-align: center;
}
.login-cbox .login-ctitle{
        font-size: 1.8em;
}
.login-cbox p{
    margin-bottom: 20px;
}


/**開關**/

.web-on { display: block !important; width: 100%;}
.mob-on { display: none !important; width: 100%;}

.webbn-on { display: block !important; width: 100%;}
.mobbn-on { display: none !important; width: 100%;}

.TopBnCWeb-on { display: block !important; width: 100%;}
.TopBnCMob-on { display: none !important; width: 100%;}

.TopBnWeb-on { display: block !important; width: 100%;}
.TopBnMob-on { display: none !important; width: 100%;}

.pTopBnCWeb-on { display: block !important; }
.pTopBnCMob-on { display: none !important; }


/***** 更新訂單查詢頁 ***********/

.orderlist-tab-box .orders {
    padding: 40px 0 0 0;
}
.orderlist-tab-box .pagination {
    margin-top:50px;
}
.orderlist-tab-box .orders-list {
    margin-bottom: 0;
}
.orderlist-tab-box .search>label{
    margin-top: 5px;
}

.orders-list tr:nth-of-type(2n) {
    background: transparent;
}
.orders-list .oListTable tr {
    background: #fafffe;
}
.oListTable tr th,
.oListTable tr td{
    text-align: center;
    word-break: break-all;
}
.table-box td,.table-box td span{
    vertical-align: middle;
}

.oListTable .oListTable-tra span,
.oListTable .oListTable-tra button,
.oListTable .oListTable-his span,
.oListTable .oListTable-his button{
    display: inline-block;
}
.orders-list .title span{ vertical-align: sub;}
.orders-list button{
    padding: 5px 10px;
    letter-spacing: 0;
    font-size: 15px;
}
.orders-list button.undline{
    background: transparent;
    border: none;
    text-decoration: underline;
    font-size: 15px;
    color: #009174;
}
.orders-list button.undline:hover{
    color: #000;
}

.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    background-color: #009577;
    border-color: #009577;
}
.pagination>li>a:focus, .pagination>li>a:hover, .pagination>li>span:focus, .pagination>li>span:hover {
    color: #009577;
}
/*in*/
.oListTable{
    border-radius: 0;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.orders-list .orders-in , .oListTable{
    font-size: 17px;
}

.orin-box1,.orin-box2,.orin-box3,.orin-box4{
    border-radius: 0;
}

/* in-box1**/
.orders-list .orders-in {
    padding: 25px 15px;
    background: #e5faf6;
}
.orders-list .orders-in th, .orders-list .orders-in td:before {
    background: #f8f8f8;
    color: #000000;
    font-weight: bold;
}
.orders-list .o-price {
    font-size: 15px;
    color: #dddddd;
}

.orders-in .o-price span,
.orders-in .o-price s{
    display: inline-block;
}
.orders-in .orin-box1 tr:not(:last-child) td  {
    border-bottom: 1px solid #e5faf6;
}
.orders-list .oProTotal span{
    display: inline-block;
}
.orders-in .orin-box1 .oProTotal{
        text-align: right;
}

.orders-in .orin-box1 .oProTotal span.notice{
    color: #ff6d29;
    font-weight: bold;
}


/* in-box2**/
.orin-box2 .orin-box2in {
    padding: 15px 0;
}
.orin-box2 .title {
    height: 58px;
    padding: 1em;
    background: #f8f8f8;
    color: #000;
    font-weight: bold;
}

.orin-box2 .form-group {
    height: auto;
    padding: 8px 0;
    margin-bottom: 0;

}
.orin-box2 .form-group:not(:last-child){
border-bottom: 1px solid #e5faf6;
}

.orin-box2 button.undline{
    float: right;
}


/**in-box3 *****/
.orders-in .orin-box3 tr td {
    border-bottom: 1px solid #e5faf6;
}
.orders-in .orin-box3 tr td:last-child{
    border:none;
}
.orders-in .orin-box3 td+td {
    border-left: none;
}
.orders-in .orin-box3 .tooltip-inner {
    padding: 5px 16px;
}



/*** in-box4 ********/
.orin-box4 {
    margin-top: 1px;
    background: #fff;
    overflow: hidden;
    padding: 50px;
}
.orin-box4 .stepList {
    text-indent: 20px;
        margin-top: 20px;
}
.orin-box4 .stepList li {
    padding: 7px 0;
}
.orin-box4 .stepList li .notice{
    color: #ff793a;
}
.orin-box4 .stepList li .none{
    color: #999;
}








/***** 訂單查詢-進度條 *******************/
.step {
  counter-reset: flag;
}
.step li {
  position: relative;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
.step li a {
  cursor: pointer;
  padding: 10px 15px;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
.step li a:before {
  content: counter(flag);
  counter-increment: flag;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
.step li a:after {
  content: "";
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}
.step-arrow {
  margin: 20px 0;
}
.step-arrow.unhover li a:hover,
.step-arrow.unhover li a:focus {
  background-color: #f6f6f6;
  color: #444444;
}
.step-arrow.unhover li a:hover:before,
.step-arrow.unhover li a:focus:before {
  background-color: #d2d2d2;
  color: #ffffff;
}
.step-arrow.unhover li:not(:last-child) a:hover:after,
.step-arrow.unhover li:not(:last-child) a:focus:after {
  background-color: #f6f6f6;
}
.step-arrow li {
  padding-right: 20px;
}
.step-arrow li:last-child {
  padding-right: 0;
}
.step-arrow li:nth-child(n+2) a {
  margin-left: -20px;
  border-radius: 0;
}
.step-arrow li:not(:last-child) a:after {
  position: absolute;
  top: -1px;
  right: -20px;
  width: 40px;
  height: 40px;
  transform: scale(0.707) rotate(45deg);
  z-index: 1;
  background-color: #f6f6f6;
  border-radius: 0 5px 0 50px;
  border-top: 1px solid #ffffff;
  border-right: 1px solid #ffffff;
  box-sizing: content-box;
}
.step-arrow li:not(:last-child) a:hover:after {
  background-color: #00b8f5;
}
.step-arrow li a {
  border-radius: 0;
  color: #444444;
  background-color: #f6f6f6;
}
.step-arrow li a:hover {
  background-color: #00b8f5;
  color: #ffffff;
}
.step-arrow li a:hover:before {
  background: #ffffff;
  color: #00b8f5;
}
.step-arrow li a:before {
  position: absolute;
  z-index: 2;
  width: 20px;
  height: 20px;
  line-height: 20px;
  border-radius: 20px;
  left: 3rem;
  font-weight: bold;
  font-size: 1rem;
  overflow: hidden;
  top: 10px;
  background: #d2d2d2;
  color: #ffffff;
}
.step-arrow li.active a:before {
  background: #ffffff;
  color: #00b8f5;
}
.step-arrow li.active a:after {
  background-color: #00b8f5;
}
.step-arrow li.active a,
.step-arrow li.active a:hover {
  background-color: #00b8f5;
  color: #ffffff;
}
.step-arrow li.active a:before,
.step-arrow li.active a:hover:before {
  background-color: #ffffff;
  color: #00b8f5;
}
.step-arrow li.active a:after,
.step-arrow li.active a:hover:after {
  background-color: #00b8f5 !important;
}
.step-square {
  margin-top: 40px;
}
.step-square > li:hover a:before,
.step-square > li:active a:before,
.step-square > li.active a:before {
  background-color: #00b8f5;
  color: #ffffff;
  border-color: #00b8f5;
}
.step-square > li:hover a:after,
.step-square > li:active a:after,
.step-square > li.active a:after {
  background-color: #00b8f5;
}
.step-square > li:first-child a:after {
  left: 50%;
  border-right: 1px solid #ffffff;
}
.step-square > li:last-child a:after {
  right: 50%;
  border-left: 1px solid #ffffff;
}
.step-square > li > a {
  color: #ebebeb;
}
.step-square > li > a:hover {
  background-color: #ffffff;
  color: #00b8f5;
}
.step-square > li > a:before {
  position: absolute;
  z-index: 2;
  top: -2rem;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 2rem;
  height: 2rem;
  background-color: #ffffff;
  line-height: 20px;
  border: 1px solid #ebebeb;
}
.step-square > li > a:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: -35%;
  background-color: #ebebeb;
  z-index: 1;
  height: 2px;
  border: solid #ffffff;
  border-width: 0 1px;
}
.step-square > li.active > a,
.step-square > li.active > a:focus,
.step-square > li.active > a:hover {
  color: #00b8f5;
  background: transparent;
}
.step-round {
  margin-top: 40px;
}
.step-round > li:first-child > a:after {
  left: 30%;
  border-radius: 5px 0 0 5px;
}
.step-round > li:last-child > a:after {
  right: 30%;
  border-radius: 0 5px 5px 0;
}
.step-round > li.active > a,
.step-round > li.active > a:hover,
.step-round > li.active > a:focus {
  background: transparent;
  color: #00b8f5;
}
.step-round > li.active > a:before,
.step-round > li.active > a:hover:before,
.step-round > li.active > a:focus:before {
  background-color: #00b8f5;
  color: #ffffff;
}
.step-round > li.active > a:after,
.step-round > li.active > a:hover:after,
.step-round > li.active > a:focus:after {
  background-color: #00b8f5;
}
.step-round > li > a {
  color: #ebebeb;
}
.step-round > li > a:before {
  position: absolute;
  z-index: 2;
  top: -1.5rem;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background-color: #ffffff;
  line-height: 1.5rem;
  box-shadow: 0 0 0 5px #ebebeb;
}
.step-round > li > a:after {
  position: absolute;
  left: 0;
  right: 0;
  top: -38%;
  background-color: #ebebeb;
  z-index: 1;
  height: 8px;
}
.step-round > li > a:after:after {
  background-color: #00b8f5;
}
.step-round > li > a:hover {
  background: transparent;
  color: #00b8f5;
}
.step-round > li > a:hover:before {
  background-color: #00b8f5;
  color: #ffffff;
}
.step-round > li > a:hover:after {
  background-color: #00b8f5;
}
.step-progress {
  margin-top: 60px;
}
.step-progress > li > a {
  color: #ebebeb;
  padding-top: 1.8rem;
}
.step-progress > li > a:before {
  position: absolute;
  z-index: 2;
  top: -35px;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  line-height: 2rem;
  box-shadow: 0 0 0 5px #ebebeb;
}
.step-progress > li > a:after {
  content: "";
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
  -webkit-background-size: 40px 40px;
  background-size: 40px 40px;
  background-color: #ebebeb;
  float: left;
  width: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 10px;
  transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;z
}
.step-progress > li > a span.caret {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  transform: rotate(180deg);
  top: -4px;
}
.step-progress > li > a:hover {
  background: transparent;
  color: #00b8f5;
}
.step-progress > li > a:hover:before {
  color: #ffffff;
  background-color: #00b8f5;
}
.step-progress > li > a:hover:after {
  background-color: #00b8f5;
}
.step-progress > li.active > a,
.step-progress > li.active > a:hover,
.step-progress > li.active > a:focus {
  color: #00b8f5;
  background: transparent;
}
.step-progress > li.active > a:before,
.step-progress > li.active > a:hover:before,
.step-progress > li.active > a:focus:before {
  background-color: #00b8f5;
  color: #ffffff;
}
.step-progress > li.active > a:after,
.step-progress > li.active > a:hover:after,
.step-progress > li.active > a:focus:after {
  background-color: #00b8f5;
}
.step-progress > li.active > a:after {
  -webkit-animation: progress-bar-stripes 2s linear infinite;
  -o-animation: progress-bar-stripes 2s linear infinite;
  animation: progress-bar-stripes 2s linear infinite;
}
.step-progress > li:first-child a:after {
  border-radius: 5px 0 0 5px;
}
.step-progress > li:last-child a:after {
  border-radius: 0 5px 5px 0;
}


/*** 進度條自己修改 ****************************************/
.step-round > li.active.stepgift01 > a,
.step-round > li.active.stepgift01 > a:hover,
.step-round > li.active.stepgift01 > a:focus,
.step-round > li.active.stepgift02 > a,
.step-round > li.active.stepgift02 > a:hover,
.step-round > li.active.stepgift02 > a:focus,
.step-round > li.active.stepgift03 > a,
.step-round > li.active.stepgift03 > a:hover,
.step-round > li.active.stepgift03 > a:focus {
    background: transparent;
    color: #ff6d29;
}
.step-round > li.active.stepgift01 > a:before,
.step-round > li.active.stepgift01 > a:hover:before,
.step-round > li.active.stepgift01 > a:focus:before ,
.step-round > li.active.stepgift02 > a:before,
.step-round > li.active.stepgift02 > a:hover:before,
.step-round > li.active.stepgift02 > a:focus:before ,
.step-round > li.active.stepgift03 > a:before,
.step-round > li.active.stepgift03 > a:hover:before,
.step-round > li.active.stepgift03 > a:focus:before {
    background-color: #ff6d29;
}
.step-round > li.active.stepgift01 > a:after,
.step-round > li.active.stepgift01 > a:hover:after,
.step-round > li.active.stepgift01 > a:focus:after ,
.step-round > li.active.stepgift02 > a:after,
.step-round > li.active.stepgift02 > a:hover:after,
.step-round > li.active.stepgift02 > a:focus:after ,
.step-round > li.active.stepgift03 > a:after,
.step-round > li.active.stepgift03 > a:hover:after,
.step-round > li.active.stepgift03 > a:focus:after {
    background-color: #ff6d29;
}

.step-round > li.stepgift01 > a:hover ,
.step-round > li.stepgift02 > a:hover ,
.step-round > li.stepgift03 > a:hover {
    background: transparent;
    color: #ff6d29;
}
.step-round > li.stepgift01 > a:hover:before ,
.step-round > li.stepgift02 > a:hover:before ,
.step-round > li.stepgift03 > a:hover:before {
    background-color: #ff6d29;
}
.step-round > li.stepgift01 > a:hover:after ,
.step-round > li.stepgift02 > a:hover:after ,
.step-round > li.stepgift03 > a:hover:after {
    background-color: #ff6d29;
}


.nav-justified>li ,.orderlist-tab-box .orin-box4 .nav>li{
    float: none;
    display: inline-block;
    width: 1%;
}

.orin-box4 .nav-justified>li>a{
    cursor: default;
    text-decoration: none;
    margin-bottom: 0;
}

.nav-justified>li.stepgift01 a:before, .orderlist-tab-box .orin-box4 .nav>li.stepgift01 a:before {
    width: 2.5rem;
    height: 2.5rem;
    top: -2.5rem;
    line-height: 2.5rem;
}
.nav-justified>li.stepgift02 a:before, .orderlist-tab-box .orin-box4 .nav>li.stepgift02 a:before {
    width: 3.2rem;
    height: 3.2rem;
    top: -3.2rem;
    line-height: 3.2rem;
}
.nav-justified>li.stepgift03 a:before, .orderlist-tab-box .orin-box4 .nav>li.stepgift03 a:before {
    width: 4rem;
    height: 4rem;
    top: -4rem;
    line-height: 4rem;
}














@media screen and (max-width: 1000px) {

.form-group.search {
    overflow: hidden;
}
.orderlist-tab-box .orders {
    padding: 20px 0 0 0;
}
.orders .rwd-table th, .orders .rwd-table td {
    padding: 6px 1em !important;
}
.orders-list button {
    padding: 3px 10px;
    margin-bottom: 7px;
}

.orin-box2 .form-group {
    padding: 3px 0;
}
.orin-box4 {
    padding: 20px 0;
}
.orin-box4 .stepList {
    margin-top: 10px;
}
.orin-box4 .stepList li {
    padding: 3px 0;
}
.step-round {
    margin-top: 70px;
}

/***** 變少 ******/
.orin-box4 .nav-justified>li.dot>a {
    color: #ebebeb;
    margin-top: -63%;
    font-size: 3vw;
    padding: 0;
}
.nav-justified>li.dot, .orderlist-tab-box .orin-box4 .nav>li.dot {
    width: 0.2%;
}
.step-round > li.dot > a:hover {
    background: transparent;
    color: #ff6d29;
}
.step-round > li.dot > a:before {
    text-indent: 9999px;
    display: none;
}
.step-round > li.dot > a:after {
    background-color: #ebebeb;
     display: none;
}




.step-round > li.dotn > a:hover {
    background: transparent;
    color: #ff6d29;
}
.step-round > li.dotn > a:before {
    text-indent: 9999px;
    background-color: transparent;
    box-shadow: none;
}
.step-round > li.dotn > a:after {
    background-color: transparent;
    top: -125%;
}
.orin-box4 .nav-justified>li.dotn>a {
    color: #000; text-indent: -9999px;
}
.nav-justified>li.dotn, .orderlist-tab-box .orin-box4 .nav>li.dotn {
    width: 0.0001%;
}
.step li.dotn a{
    padding: 0;
}


.step-round > li > a:before {
   top: -1.1rem;
    width: 1.3rem;
    height: 1.3rem;
    line-height: 1.3rem;
    box-shadow: 0 0 0 1px #ebebeb;
}
.nav-justified>li.activeing a:before, .orderlist-tab-box .orin-box4 .nav>li.activeing a:before {
    top: -2rem;
    width: 2rem;
    height: 2rem;
    line-height: 2rem;
    box-shadow: 0 0 0 1px #ebebeb;
}

.orin-box4 .nav-justified>li>a {
    font-size: 14px;
}

.step li a {
    padding: 2px;
}

}



@media screen and (max-width: 767px) {
.oListTable ,.orin-box1, .orin-box2, .orin-box3, .orin-box4 {
    font-size: 15px;
}
.oListTable tr th, .oListTable tr td {
    text-align: left;
}
.orders .rwd-table th, .orders .rwd-table td {
    padding: 1px 1em !important;
}
.oListTable .oListTable-tra span,
.oListTable .oListTable-his button {
    vertical-align: super;
    padding: 0;
}
.oListTable .oListTable-tra button {
    vertical-align: super;
    padding: 1px 10px;
}

.table-box td:last-child {
    border-left: none;
}
.orders-list .orders-in th, .orders-list .orders-in td:before {
    background: transparent;
    width: auto;
    min-width: 95px;
    text-align: left;
    margin-right: 20px;
}
.orders-in .orin-box1 td:before {
    width: auto;
    min-width: 95px;
    text-align: left;
    margin-right: 20px;
}
.orders-in .orin-box1 .oProTotal:before{
    display: none;
}

.orders-in .orin-box2 .form-group {
    padding: 5px 35px !important;
}
.control-label{
    font-weight: bold;
}

.orders-in .orin-box2 .form-control-static {
    min-height: initial;
    padding: 0;
    margin-bottom: 0;
}

.orders-list .oListTable tr {
    background: #e6faf6;
}
.orin-box3 tr.orin-box3-2,
.orin-box3 tr.orin-box3-4 {
    background: #fbffd7;
}
.orin-box3 tr.orin-box3-3 {
    background: #fff1f1;
}
.tab-btn.orlb button {
    width: 30%;
}

}

@media screen and (max-width: 760px){
.orin-box4 .nav-justified>li.dot>a {  margin-top: -79%; padding: 0;}

.nav-justified>li.stepgift01 a:before,
.orderlist-tab-box .orin-box4 .nav>li.stepgift01 a:before ,
.nav-justified>li.stepgift02 a:before,
.orderlist-tab-box .orin-box4 .nav>li.stepgift02 a:before ,
.nav-justified>li.stepgift03 a:before,
.orderlist-tab-box .orin-box4 .nav>li.stepgift03 a:before {
    width: 2.5rem;
    height: 2.5rem;
    top: -2.5rem;
    line-height: 2.5rem;
}

}


@media screen and (max-width: 666px){
.orin-box4 .nav-justified>li.dot>a { margin-top: -84%;}
}

@media screen and (max-width: 587px){
    .orin-box4 .nav-justified>li.dot>a { margin-top: -108%; font-size: 30px;}
}
@media screen and (max-width: 504px){
    .orin-box4 .nav-justified>li.dot>a { margin-top: -100%;}
}
@media screen and (max-width: 480px){
    .orin-box4 .nav-justified>li.dot>a { margin-top: -80%;}
}

@media screen and (max-width: 390px){
    .orin-box4 .nav-justified>li.dot>a { margin-top: -75%;}
}
@media screen and (max-width: 327px){
    .orin-box4 .nav-justified>li.dot>a { margin-top: -80%;}
}


@media screen and (max-width: 655px){

.orin-box4 .stepList li span { display: block; text-indent: 29px;}

.orders-list .orders-in th, .orders-list .orders-in td:before {
        margin-right: 10px;
    min-width: 85px;
}
.orders-in .orin-box1 td:before {
    min-width: 75px;
    margin-right: 10px;
}
.rwd-table td:before {
    margin-right: 10px;
}
.orders-in .orin-box1 .oProTotal span.notice {
    display: block;
}
.orders-in .orin-box2 .form-group {
    padding: 5px 15px !important;
}
.orders .rwd-table th, .orders .rwd-table td {
    padding: 1px 0 !important;
    font-size: 15px;
}
}

@media screen and (max-width:425px){
.tab-btn.orlb button {
    width: 45%;
}
.rwd-table td:before { width: 40%;}

}

/****** 商品列表側邊三折選單 ****/
.side-menu {
    /*width: 200px;
    position: absolute;
    margin-left: -210px;
    margin-top: 50px;*/
}
.side-menu .navbar { border-color: #0dc1b2; overflow: hidden;}
.side-menu .navbar-header { width: 100%; border-bottom: 1px solid #e7e7e7;}

.side-menu .navbar-nav .active a ,.side-menu .navbar-nav .active a:hover{ background-color: transparent; margin-right: -1px; border-right: 5px solid #0dc1b2; background-color: transparent;}
.side-menu .navbar-nav li { display: block; width: 100%;     border-bottom: 1px solid #0dc1b2;   background-color: #fff;}
.side-menu .navbar-nav li:nth-last-child(1){ border-bottom: none;}
.side-menu .navbar-nav li a { padding: 15px 20px 15px 15px;}
.side-menu .navbar-nav li a .glyphicon { padding-right: 10px;}
.side-menu #dropdown { border: 0; margin-bottom: 0; border-radius: 0; box-shadow: none;}
.side-menu #dropdown .caret { float: right; margin: 9px 5px 0;}
.side-menu #dropdown .indicator { float: right;}
.side-menu #dropdown > a { border-bottom: 1px solid #0dc1b2;}
.side-menu #dropdown .panel-body { padding: 0; background-color: #f3f3f3;}
.side-menu #dropdown .panel-body .navbar-nav { width: 100%;}
.side-menu #dropdown .panel-body .navbar-nav li { padding-left: 15px; border-bottom: 1px solid #0dc1b2;     background: #f5fffe;}
/* .side-menu #dropdown .panel-body .navbar-nav li:last-child { border-bottom: none;} */
.side-menu #dropdown .panel-body .panel > a { margin-left: -20px; padding-left: 35px;}
.side-menu #dropdown .panel-body .panel-body { margin-left: -15px;}
.side-menu #dropdown .panel-body .panel-body li { padding-left: 30px; background: #ccf7f3;}
.side-menu #dropdown .panel-body .panel-body li:last-child { border-bottom:1px solid #0dc1b2;}
.side-menu #search-trigger { background-color: #f3f3f3; border: 0; border-radius: 0; position: absolute; top: 0; right: 0; padding: 15px 18px;}
.side-menu .brand-name-wrapper { min-height: 50px;     background: #0dc1b2;}
.side-menu .brand-name-wrapper a,
.side-menu .brand-name-wrapper a:hover{   color: #fff;}
.side-menu .brand-name-wrapper .navbar-brand { display: block;}
.side-menu #search { position: relative; z-index: 1000;}
.side-menu #search .panel-body { padding: 0;}
.side-menu #search .panel-body .navbar-form { padding: 0; padding-right: 50px; width: 100%; margin: 0; position: relative; border-top: 1px solid #e7e7e7;}
.side-menu #search .panel-body .navbar-form .form-group { width: 100%; position: relative;}
.side-menu #search .panel-body .navbar-form input { border: 0; border-radius: 0; box-shadow: none; width: 100%; height: 50px;}
.side-menu #search .panel-body .navbar-form .btn { position: absolute; right: 0; top: 0; border: 0; border-radius: 0; background-color: #f3f3f3; padding: 15px 18px;}
/* Main body section */
.side-body { margin-left: 310px;}
/* small screen */

/* 0314 更新下滑選單的icon*/
.web-main .dropdown-menu  a > span ,
.web-main .dropdown-menu  a > span img{
 display: none;
}

nav.navbar-findcond ul.dropdown-menu > li > a:hover span { display: none;}
nav.navbar-findcond ul.dropdown-menu.dropicon > li > a:hover span { background: #fff; border-radius: 15px; width: 25px; height: 25px; display: inline-block; line-height: 26px; text-align: center;}

.dropdown-menu.dropicon a > span{ display: inline-block; vertical-align: text-top;}
.dropdown-menu.dropicon a > span img { display: initial; max-width: 25px; max-height: 25px;}

@media (max-width: 768px) {
    .side-menu {   position: relative;   width: 100%;   height: 0;   border-right: 0;   border-bottom: 1px solid #e7e7e7; }
    .side-menu .brand-name-wrapper .navbar-brand {   display: inline-block; } /* Slide in animation */
    @-moz-keyframes slidein {   0% {     left: -300px;   }   100% {     left: 10px;   } } @-webkit-keyframes slidein {   0% {     left: -300px;   }   100% {     left: 10px;   } } @keyframes slidein {   0% {     left: -300px;   }   100% {     left: 10px;   } } @-moz-keyframes slideout {   0% {     left: 0;   }   100% {     left: -300px;   } } @-webkit-keyframes slideout {   0% {     left: 0;   }   100% {     left: -300px;   } } @keyframes slideout {   0% {     left: 0;   }   100% {     left: -300px;   } } /* Slide side menu*/ /* Add .absolute-wrapper.slide-in for scrollable menu -> see top comment */
    .side-menu-container > .navbar-nav.slide-in {   -moz-animation: slidein 300ms forwards;   -o-animation: slidein 300ms forwards;   -webkit-animation: slidein 300ms forwards;   animation: slidein 300ms forwards;   -webkit-transform-style: preserve-3d;   transform-style: preserve-3d; }
    .side-menu-container > .navbar-nav {   /* Add position:absolute for scrollable menu -> see top comment */   position: fixed;   left: -300px;   width: 300px;   top: 43px;   height: 100%;   border-right: 1px solid #e7e7e7;   background-color: #f8f8f8;   -moz-animation: slideout 300ms forwards;   -o-animation: slideout 300ms forwards;   -webkit-animation: slideout 300ms forwards;   animation: slideout 300ms forwards;   -webkit-transform-style: preserve-3d;   transform-style: preserve-3d; } /* Uncomment for scrollable menu -> see top comment */ /*.absolute-wrapper{       width:285px;       -moz-animation: slideout 300ms forwards;       -o-animation: slideout 300ms forwards;       -webkit-animation: slideout 300ms forwards;       animation: slideout 300ms forwards;       -webkit-transform-style: preserve-3d;       transform-style: preserve-3d;   }*/
    @-moz-keyframes bodyslidein {   0% {     left: 0;   }   100% {     left: 300px;   } } @-webkit-keyframes bodyslidein {   0% {     left: 0;   }   100% {     left: 300px;   } } @keyframes bodyslidein {   0% {     left: 0;   }   100% {     left: 300px;   } } @-moz-keyframes bodyslideout {   0% {     left: 300px;   }   100% {     left: 0;   } } @-webkit-keyframes bodyslideout {   0% {     left: 300px;   }   100% {     left: 0;   } } @keyframes bodyslideout {   0% {     left: 300px;   }   100% {     left: 0;   } } /* Slide side body*/
    .side-body {   margin-left: 5px;   margin-top: 70px;   position: relative;   -moz-animation: bodyslideout 300ms forwards;   -o-animation: bodyslideout 300ms forwards;   -webkit-animation: bodyslideout 300ms forwards;   animation: bodyslideout 300ms forwards;   -webkit-transform-style: preserve-3d;   transform-style: preserve-3d; }
    .body-slide-in {   -moz-animation: bodyslidein 300ms forwards;   -o-animation: bodyslidein 300ms forwards;   -webkit-animation: bodyslidein 300ms forwards;   animation: bodyslidein 300ms forwards;   -webkit-transform-style: preserve-3d;   transform-style: preserve-3d; } /* Hamburger */
    #search .panel-body .navbar-form {   border-bottom: 0; }
    #search .panel-body .navbar-form .form-group {   margin: 0; }
}
/*選單下拉箭頭*/
/*.ptoLisG{
    float: right;
    margin: 0;
    padding: 0;
    font-size: 10px;
    margin-top: 5px;
}*/
.ptoLisG{
    font-size: 13px;
    float: right;
    margin: 5px 0 0 0;
    padding: 0 !important;
    color: #0dc1b2;
    position: absolute;
    right: 6px;
    top: 15px;
}

/* 登入頁0311修改新增 */

.login .navbar-brand { padding: 0;}
.login .fixed-top-box { max-width: initial; padding: 20px 0;}
.login nav.nav-single{padding: 0;

}
/* 加購商品0412修改新增 */
.add-purchase { margin-top: 30px; }
.add-purchase dt { background-color: rgba(0,0,0,.1); padding: 3px 5px; font-size: 13px; font-weight: bold; }
.add-purchase dd { border: 1px solid rgba(0,0,0,.1); }
.add-purchase dd .add-purchase-li { padding: 3px 10px; border-bottom: 1px solid rgba(0,0,0,.1); padding-bottom: 10px; }
.add-purchase dd .add-purchase-li:last-child { border-bottom: 0px; }
.add-purchase dd .add-purchase-li .form-control { width: initial; margin-left: 20px; }
.add-purchase dd .add-purchase-li span { color: red; }
.slide-price b {
    margin-left: 5px;
    color: #33fde9;
    font-size: 15px;
    font-weight: bold;
}
.slide-price span {
    font-size: 14px;
    color: #999;
}
.slide-price.add {
    width: 270px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.slide-price.add-price b {
    font-weight: normal;
    color: #999;
}
.slide-shop-box i.s-pap {
    font-size: 13px;
    font-weight: bold;
    background: #999;
    border-radius: 3px;
    padding: 2px 5px;
    color: #000;
    margin-right: 5px;
}
/* 評價與留言 */
.rating-overview .score { text-align: center; }
.rating-overview .score h5 { font-size: 5.5em; color: #fe7f02; }
.rating-overview .score span { font-size: .8em; }
.rating-overview .briefing .list { margin: 5px 0; line-height: 1; }
.rating-overview .briefing .list>div { display: inline-block; float: left; margin-right: 1%; margin-left: 1%; }
.briefing .star { width: 35%; text-align: right; }
.rating-msg-list .star { width: 20%; text-align: left; }
.star>div { display: inline-block; width: 16%; }
.st0 { fill: #f00; }
.rating-overview .briefing .progress { width: 50%; height: 10px; margin-top: 7px; margin-bottom: 0; }
.rating-overview .briefing .quan { width: 8%; font-size: .6em; color: #999; line-height: 2; }
.rating-msg-list .rating-msg { font-size: .8em; padding-left: 20px; padding-bottom: 10px; margin-bottom: 10px; }
.rating-msg-list .rating-msg>div { margin-bottom: 5px; }
.rating-msg-list .rating-msg .can-msg span { display: inline-block; border-radius: 50px; padding: 5px 10px; background-color: #eee; color: #666; }
.rating-msg-list .rating-msg .msg-time { color: #ccc; }
.rating-msg-list .morerating { text-align: right; }
.rating-modal .modal-content { height:95vh; overflow-y:scroll; }
.rating-modal .modal-header { position: fixed; width: 99%; background-color: #fff; border-radius: 6px 6px 0 0; z-index: 888; }
.rating-modal .modal-body { padding-top: 220px; }
.rating-filter { margin-top: 10px; text-align: center; }
.rating-filter>div { float: left; position: relative; min-height: 1px; padding-left: 5px; padding-right: 5px; }
.rating-filter.row-first>div { width: 33.333%; }
.rating-filter.row-star>div { width: 20%; }
.rating-filter.row-star .star>div { width: 17%; margin: 0 0px; }
.rating-filter a { display: block; width: 100%; background-color: #eee; color: #000; padding: 5px; border-radius: 10px; }
.rating-filter a span { font-size: .8em; color: #999; }
@media (max-width: 990px) {
    .rating-overview { padding-bottom: 30px; }
    .briefing .star { width: 41%; }
    .rating-msg-list .star { width: 25%; }
    .rating-overview .score h5 { font-size: 4em; }
    .rating-overview .briefing .list .quan { display: none; }
    .rating-overview .briefing .progress { width: 55%; margin-top: 5px; }
    .rating-msg-list .rating-msg { padding-left: 0; }
    .rating-filter.row-star .star>div { width: 20%; }
    .rating-filter a { padding: 5px; }
}
.edit-rating-modal .star { width: 90%; margin: 20px auto; text-align: center; }
.rating-tag { margin-top: 10px; font-size: .8em; }
.rating-tag a { display: inline-block; border-radius: 50px; padding: 5px 10px; margin: 5px 0; background-color: #eee; color: #666; }
.rating-tag label {display: inline-block; border-radius: 50px; padding: 5px 10px; margin: 5px 0;}
@media (min-width: 768px) {
    .edit-rating-modal { width: 450px; }
}
.score-star { max-width: 50px; }

.last_quantity {
    text-align: center;
    margin-bottom: 15px;
}