@charset "UTF-8";
@import url("reset.css");
@import url("fonts.css");
a { color: #333; -o-transition: all .20s linear; -webkit-transition: all .20s linear; -moz-transition: all .20s linear; transition: all .20s linear; }
a:hover { text-decoration: none; color: #666; }
a:focus { text-decoration: none; color: #666; }

/* 共用 */
nav { padding: 18px 0; overflow: hidden; background: #FFF; }
nav .logo { width: 160px; height: 79px; background: url('../assets_cart/img/logo.png') no-repeat; -webkit-transition: all .20s linear; -moz-transition: all .20s linear; transition: all .20s linear; }
.smallNav nav .logo { width: 183px; height: 27px; background: url('../assets_cart/img/logoS.png') no-repeat; }
.smallNav nav { box-shadow: 1px 1px 1px #eee; }
.mainContent { min-height: 1000px; background: #f5f5f5; }
footer { text-align: center; padding: 40px 0; }
footer a,
footer { font-size: 1rem; line-height: 1.5; color: #898989; }

/* 方案列表 */
.mainContent { padding: 115px 0 0 0; }
.breadBox { width: 100%; overflow: hidden; }
.breadList { padding: 40px 0; float: right; }
.breadList li { float: left; list-style: none; margin: 0 4px; font-size: 14px; }
.breadList li a,
.breadList li { color: #888; }
.breadList li a:hover { color: #555; }
.hbrTabs { width: 100%; white-space: nowrap; overflow-x: auto; overflow-y: hidden; background: #efefef; border: 1px solid #e3e3e3; border-radius: 4px; }
.hbrTabs li { display: table-cell; float: none; width: 1%; text-align: center; }
.hbrTabs li a { padding: 15px 15px; border: 2px solid #EFEFEF; font-size: 18px; color: #888; }
.hbrTabs>li.active>a,
.hbrTabs>li.active>a:hover,
.hbrTabs>li.active>a:focus { border: 2px solid #EFEFEF; border-radius: 0; }
.hbrTabs>li>a:hover { border-color: #EFEFEF; }
.hbrTabs>li.active>a { position: relative; color: #000; }
.hbrTabs>li.active>a:after { position: absolute; z-index: 2; left: 0; bottom: -2px; width: 100%; height: 3px; background: #c82502; display: block; content: ""; }
.hbrTabContent { margin: 45px 0 200px 0; }
.hbrTabContent .tab-pane > h3 { font-size: 22px; text-align: center; margin: 100px 0 0 0; color: #000; }
.hbrTabList { padding: 50px; background: #fff; border: 1px solid #EFEFEF; overflow: hidden; margin: 0 0 45px 0; }
.hbrTabList .leftPic { float: left; width: 300px; }
.hbrTabList .leftPic img { max-width: 300px; width: 100%; height: auto; text-align: center; }
.hbrTabList .rightInfo { float: right; width: calc(100% - 350px); }
.hbrTabList .rightInfo h3 { font-size: 22px; color: #000; line-height: 1.4; font-weight: 400; margin: 0 0 20px 0; }
.hbrTabList .rightInfo p { font-size: 18px; line-height: 1.5; color: #666; margin: 0 0 30px 0; }
.hbrTabList h4 { color: #666; font-size: 15px; margin: 0 0 20px 0; }
.hbrTabList h4 span { font-size: 30px; color: #C82502; padding: 0 2px; }
.hbrTabList button { float: right; background: #C82502; color: #FFF; border: none; font-size: 18px; padding: 10px 25px; }
.hbrTabList button:hover { background: #a01e02; }

/* 加入購物車 */
.carInfo { background: #e5e5e5; padding: 20px 20px; border-radius: 5px; }
.carInfo h6{font-size:18px;color: #666;line-height: 1.5 ;margin:10px 0 0 0; font-weight: 400;}
.carInfo p { font-size: 16px; color: #666; line-height: 1.5; margin: 5px 0 10px 0;  }
.carList { font-size: 18px; overflow: hidden; clear: both; margin: 0 0 20px 0; line-height: 1.5 }
.carList .carLeft,
.carList .carLeft.price { color: #000; float: left; width: 100px; text-align: justify; font-weight: 400; }
.carList .carRight,
.carList .carRight.price { color: #666; float: left; width: calc(100% - 100px); }
.magic-checkbox:checked + label:before,
.magic-checkbox + label:before { background: #FFF; border: 1px solid #c5c8c9; border-radius: 0px; }
.magic-radio + label:before,
.magic-checkbox + label:before { width: 16px; height: 16px; }
.magic-checkbox + label:after { top: -2px; left: 7px; width: 8px; height: 16px; border-color: #666; }
@keyframes hover-color {
	from { border-color: #c5c8c9; }
	to { border-color: #c5c8c9; }
}
.magic-radio + label,
.magic-checkbox + label { padding-left: 24px; line-height: 20px; }
.spBox { background: #eeeeee; overflow: hidden; padding: 5px 10px; font-size: 16px; max-width: 300px; }
.spBox.spAdd{background: none;max-width:none;clear: both;}
.spBox.spAdd span{font-size: 18px!important;}
.carList:last-of-type { margin: 0; }
.carList .carRight span { color: #C82502; font-size: 30px; line-height: 1; padding: 0 5px; }
.carList button { float: left; margin: 25px 0 0 0; min-width: 140px; }
.carList button:first-of-type { margin-right: 40px; }
.carList button.delBtn { background: #888888; }
.carList button.delBtn:hover { background: #666; }
.carItem { overflow: hidden; margin: 0px 0 60px 0; }

/* 購物車_cart & 填寫資料 */
.checkout-tablebottom { font-size: 18px; line-height: 1.3; }
.carBox { background: #FFF; overflow: hidden; margin: 0 0 130px 0; }
.checkout-tablebottom { margin: 0; }
.affix { width: 400px; overflow: hidden; }
.btnBox { text-align: right; margin: 0 0 40px 0; }
.btnBox button:first-of-type { margin: 0 15px; }
.btnBox button { padding: 10px 25px; min-width: 140px; border: none; color: #FFF; font-size: 18px; }
.btnBox button.pay { background: #C82502; }
.btnBox button.pay:hover { background: #a01e02; }
.btnBox button.edit { background: #888888; }
.btnBox button.edit:hover { background: #666; }
.checkout-tablebottom { padding: 40px 40px 100px 40px; }
.checkout-tabletop { padding: 40px 40px 0px 40px; }
.no-more-tables table { width: 100%; line-height: 1.2; }
.no-more-tables thead th { font-size: 18px; color: #000; font-weight: 400; text-align: center; }
.no-more-tables tr { border-bottom: 1px solid #e0e0e0; }
.no-more-tables tbody tr:last-child { border-bottom: none; }
.no-more-tables th,
.no-more-tables td { padding: 20px 10px; }
.no-more-tables thead th:first-child { text-align: left; }
.no-more-tables tbody td { font-size: 16px; color: #333; text-align: center; vertical-align: middle; }
.no-more-tables tbody td:first-child { text-align: left; }
.no-more-tables tbody a i { -o-transition: all .20s linear; -webkit-transition: all .20s linear; -moz-transition: all .20s linear; transition: all .20s linear; font-size: 20px; }
.no-more-tables tbody a i:hover { color: #C82502; }
.sl-section-title:nth-of-type(1) { margin: 0px 0 10px 0; }
.sl-section-title { font-size: 22px; color: #000; font-weight: 400; margin: 60px 0 10px 0; }
.sl-section-title i { color: #000; font-size: 24px; margin: 0 10px 0 0; }
.loginBox { background: #e2f4f7; border: 5px; padding: 20px; border-radius: 5px; border: 1px solid #bce8f1; color: #333; }
.loginBox .col-sm-6 { overflow: hidden; }
.loginBox .col-sm-6:nth-of-type(1) { border-right: 1px solid #bce8f1; }
.loginBox button { background: #C82502; padding: 10px 25px; border: none; color: #fff; font-size: 18px; margin: 20px 0 0 0; min-width: 140px; }
.loginBox button:hover,
.controls button:hover { background: #a01e02; }
.controls input { border-radius: 0; height: 43px; font-size: 16px; }
.controls button { background: #C82502; padding: 10px 10px; border: none; color: #fff; font-size: 18px; }
.checkout-tablebottom .control-label span { color: #C82502; font-size: 24px; }
.checkout-tablebottom .control-label { color: #333; font-weight: 200; }
.checkout-tablebottom .form-group { margin-bottom: 40px; }
.help-block { font-size: 16px; color: #666; }
.magic-radio:checked + label:before { border: 1px solid #c0c0c0; }
.magic-radio + label:after { top: 4px; left: 4px; background: #C82502; }
.radioBox { margin: 15px 10px; }
.textareaBox { margin-bottom: 20px; overflow: hidden; }
textarea { border-radius: 0 !important; font-size: 16px !important; }
.form-control { border-radius: 0px; font-size: 16px; }
select.form-control { height: 43px; }
.form-group label { margin: 0 0 5px 0; }
.no-more-tables input { border: 1px solid #CCC; text-align: center; height: 43px; width: 60px; }
.no-more-tables select { border: 1px solid #CCC; text-align: center; height: 43px; width: 60px; }

/*for不同(50plus)頻道的LOGO*/
nav .logo-50plus { width: auto; height: 79px; background: url('https://50plus.cwgv.com.tw/public/assets/img/logo-sm.png') no-repeat; 
-webkit-transition: all .20s linear; -moz-transition: all .20s linear; transition: all .20s linear; 
background-size:auto 79px;
}
.smallNav nav .logo-50plus { width: 183px; height: 27px; background: url('https://50plus.cwgv.com.tw/public/assets/img/logo-sm.png') no-repeat; 
background-size:auto 27px;}

/*for不同(1號課堂)頻道的LOGO*/
nav .logo-classone { width: auto; height: 79px; background: url('https://shop.cwgv.com.tw/public/assets/img/classone_logo.png') no-repeat; 
-webkit-transition: all .20s linear; -moz-transition: all .20s linear; transition: all .20s linear; 
background-size:auto 79px;
}
.smallNav nav .logo-classone { width: 183px; height: 27px; background: url('https://shop.cwgv.com.tw/public/assets/img/classone_logo.png') no-repeat; 
background-size:auto 27px;}

.mobile-subtotal {display:none;}