.breadcrumb{padding: 13px 0 12px;}
.breadcrumb ul{float: left; list-style: none;}
.breadcrumb ul li{float: left;}
.breadcrumb ul li+li:before{content: "/"; display: inline-block; margin: 0 11px;}
.breadcrumb ul li a{display: inline-block; color: #333;}

@media (min-width:320px){
    .breadcrumb ul li.breadcrumb-mobile{display: none;}
}
@media (min-width:767px){
    .breadcrumb ul li.breadcrumb-mobile{display: block;}
}
.LienHeInfo li{line-height: 22px; position: relative; margin-bottom: 15px; list-style: none;}
.LienHeInfo li:after{width: 100%; border-bottom: 1px dashed #dedede; display: block; content: ''; position: absolute; z-index: 1; top: 13px;}
.LienHeInfo li label{Display: inline-block; background: #fff; padding-right: 5px; position: relative; z-index: 2; font-family: RobotoBold; font-size: 15px; color: #339933;}
.LienHeInfo li label i{width: 20px; font-size: 15px;}
.LienHeInfo li span{padding-left: 20px; display: block;}
.LienHeInfo li a{color: black;}

.formLeft{float: left; width: 100%}
.formLeftitem{margin-bottom: 15px; position: relative; width: 100%;}
.formLeft input{border-left: 0; width: calc(100% - 40px);}
.formLeft i{float: left; width: 40px; color: #339933; line-height: 31px; font-size: 20px; text-align: center; border: 1px solid #dedede; box-sizing: border-box;}

.formRight{float: right; position: relative; width: 100%; margin-bottom: 15px;}

@media (min-width: 320px){
    .LienHeRight{margin: 0 0 20px;}
}
@media (min-width: 767px){
    .LienHeLeft{float: left; width: 30%;}
    .LienHeRight{float: right; margin: 0 0 20px 3%; width: calc(64% - 1px); padding-left: 3%; border-left: 1px solid #dedede;}
}.email{width: 265px; margin-bottom: 30px;}
.email-item{position: relative; float: left; height: 29px;}
.email-item input[type='text']{height: 100%;}
.email-item input[type='submit']{width: 100%; height: 100%;}
.email-item label.error,
#email-registered{line-height: 29px; color: #ff0000;}
#email-result{font-size: 15px; text-transform: uppercase; text-align: center; line-height: 29px; color: #fff; background:#ff0000; margin-bottom: 30px;}

@media (min-width:320px){
    .email-item:nth-child(1){width: calc(100% - 83px); margin-right: 3px;}
    .email-item:nth-child(2){width: 80px;}
}.cart{line-height: 32px; padding: 10px; background: #fff; border: 1px solid #d7d7d7;}
.carttitle{text-transform: uppercase; font-size: 20px;}
.carttitle h1{font-size: 100%;}
.cartrow{border-bottom: 1px solid #d5d4d5; padding: 15px 0;}
.cartrowTT{padding: 0;}
.carthead{font-weight: bold;border-bottom: 1px solid #d5d4d5; padding: 0;}

.cartleft, .cartrightTT, .cartformwrap-left{float: left;}
.cartleft, .cartrightTT{margin-bottom: 30px;}
.cartright, .cartleftTT, .cartformwrap-right{float: right;}

.cartformwrap-right textarea{margin-bottom: 15px;}

.cartrightTitle{font-family: RobotoBold; font-size: 15px; border-bottom: 1px solid #d5d4d5; margin-bottom: 15px;}

.cartcol{float: left;}
.cartcol label{font-family: RobotoBold; color: #ff0000;}
.cartcol input{width: 50%; text-align: center; text-indent: 0;}
.cartcol2, .cartcol3, .cartcol4, .cartcol6, .cartcol7{text-align: center;}
.cartcol5 span{text-align: right; font-family: RobotoBold; display: block;}

.cartimg, .cartimgTT{float: left; margin: 0 15px 0 0; position: relative;}
.cartimgTT span{position: absolute; top: -5px; right: -5px; background: #ef313b; color: #fff; display: block; width: 20px; height: 20px; line-height: 20px; text-align: center;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -khtml-border-radius: 50%;}
.cartinfo{line-height: 22px;}
.cartinfo ul{margin: 5px 0 9px; list-style: none;}
.cartname{color: #339933; font-family: RobotoBold; text-transform: uppercase;}

.cartbutton{line-height: normal;}
.cartbutton a, .cartback{display: inline-block; margin: 0 6px 0 0; background: #339933; padding: 5px 11px 3px; color: #fff; transition: all 0.25s ease 0s;}
.cartback{padding: 0 11px; margin: 15px 0 0 10px; float: right; text-transform: uppercase;}
.cartbutton a:hover, .cartback:hover{background: #2a7027;}

.cartbill{background: #339933; color: #fff; font-family: RobotoBold; text-align: center; margin-bottom: 15px; text-transform: uppercase;}
.cartright ul{border: 1px solid #d7d7d7; padding: 10px; margin-bottom: 15px; list-style: none;}
.cartright ul li b{color: #ff0000; float: right;}
.cartright a{display: block; float: left; background: #339933; width: calc(50% - 7.5px); text-align: center; color: #fff; text-transform: uppercase; transition: all 0.25s ease 0s;}
.cartright a#noproduct{float: right;}
.cartright a#nopayment{width: 100%; margin: 15px 0 0;}
.cartright a:hover{background: #2a7027;}

.cartformwrap{position: relative; padding: 10px 10px 0; border: 1px solid #d7d7d7; margin-bottom: 15px;}
.cartformwrap-left{position: relative;}
.cartformwrap input[type="radio"], .cartformwrap input[type="checkbox"]{vertical-align: top;}
.cartitem{margin-bottom: 15px; position: relative;}
.cartitems{line-height: normal;}
.cartabove{position: absolute; top: 11px; right: 10px; line-height: normal;}


.list-content li {list-style: none outside none; margin-bottom: 15px;}
.list-content li > .list-content-t{cursor: pointer;display: inline-block;width: 100%;background: #ef313b;color: white;}
.list-content li.active > .list-content-t{background: #ff0000;}
.list-content li > .list-content-t input{display: none;}
.list-content li > .list-content-t i{margin: 0 10px 0;font-size: 15px;}

.list-content li .boxContent{display: none; border:1px solid #d5d4d5; border-top: 0; padding: 3px 10px; line-height: 20px;}
.list-content li .boxContent-textarea{border: 0; padding: 0; line-height: normal;}
.list-content li .boxContent textarea{height: 47px;}
.list-content li.active .boxContent {display: block;}

@media (min-width: 320px){
    .cartright, .cartleft, .cartleftTT, .cartrightTT{width: 100%;}
    .cartright{margin: 15px 0 30px; font-size: 15px;}
    .cartrightTT{margin: 15px 0 30px;}
    .cartimg{display: none;}
    .cartcol1{width: 52%;}
    .cartcol3, .cartcol6{width: 21%;}
    .cartcol4, .cartcol7{width: 27%;}
    .cartcol5{width: 70%;}
    .cartcol7{width: 30%;}
    .cartcol2{display: none;}
    .cartimgTT{width: 50px;}
    .cartformwrap-left,
    .cartformwrap-right{width: 100%;}
    .cartformwrap-right textarea{height: 100px;}
    .carthead{font-size: 13px;}
    .cartname{font-size: 13px;}
}
@media (min-width: 480px){
    .cartimg{width: 75px; display: block;}
    .cartformwrap-left , .cartformwrap-right{width: 49%;}
    .cartformwrap-right textarea{height: 225px;}
    .carthead{font-size: 15px;}.cartname{font-size: 15px;}
}
@media (min-width: 580px){
    .cartimg{width: 100px;}
    .cartcol1{width: 49%;}
    .cartcol2{width: 17%;}
    .cartcol3{width: 17%;}
    .cartcol4{width: 17%;}
    .cartcol2{display: block;}
}
@media (min-width: 767px){
    .cartimg{width: 150px;}
    .cartcol1{width: 55%;}
    .cartcol2{width: 15%;}
    .cartcol3{width: 15%;}
    .cartcol4{width: 15%;}
}
@media (min-width: 970px){
    .cartright{width: 285px; margin: -63px 0 0;}
    .cartleft{width: calc(100% - 300px);}
    .cartleftTT{width: 360px;}
    .cartrightTT{width: calc(100% - 375px); margin: -33px 0 0;}
}
@media (min-width: 1170px){
    .cartright{width: 315px;}
    .cartleft{width: calc(100% - 330px);}
}.advisory{margin-bottom: 30px;}

.advisory-left{height: 30px; background: #ff0000;}
.advisory-left a{display: block; font-family: RobotoBold; font-size: 14px; text-align: center; line-height: 30px; color: #fff;}

.advisory-right{position: relative; height: 28px; overflow: hidden;}

.ticker-title{display: none;}
.ticker-content {position: absolute; background: #fff; overflow: hidden; white-space: nowrap;}
.ticker-content a{display: block; line-height: 28px; color: #339933;}
.ticker-swipe {display: block; width: 100%; height: 28px; background: #fff; position: absolute; top: 0;}

@media (min-width: 320px){
    .advisory-right{border: 1px solid #d7d7d7; border-top: 0;}
}
@media (min-width: 480px){
    .advisory-left{float: left; width: 275px;}
    .advisory-right{float: right; width: calc(100% - 276px); border: 1px solid #d7d7d7; border-left: 0;}
}.intro{margin: 0 0 30px; padding: 15px 15px 5px; box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.125);}
.intro-title{font-size: 20px; line-height: 25px; margin-bottom: 15px;}
.intro-text{margin-bottom: 15px;}
.intro-more{font-style: italic; line-height: 22px;}
.intro-more a{display: block; color: #ff0000;}
.intro-more a i{font-style: italic;}
.product-group{margin-bottom: 20px;}
.product-group:nth-child(3){margin-bottom: 0;}
.product-group:nth-child(3) .product-item{margin-bottom: 0!important;}

.product-title{position: relative; font-size: 18px; text-transform: uppercase; text-align: center; line-height: 25px; margin-bottom: 20px;}
.product-title a{display: inline-block; padding: 0 15px; background: #fff; color: #339933;}
.product-title:after{content: ''; width: 100%; height: 1px; background: #339933; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; z-index: -1;}

.product-item{float: left; margin-bottom: 30px; box-shadow: 0px 0px 3px 3px rgba(0,0,0,0.125); transition: all 0.25s ease 0s;}
.product-item:hover{box-shadow: 0px 0px 3px 3px rgba(0,0,0,0.5);}

.product-info{line-height: 20px; height: 60px;  background: #fff;}

.product-name{height: 40px; overflow: hidden;}
.product-name a{display: block; color: #339933;}

.product-price{}
.product-price span{color: #ff0000;}

@media (min-width:320px){
    .product-item{width: calc((100% - 20px) / 2); margin-right: 10px;}
    .product-item:nth-child(4n){margin-right: 0;}
    .product-info{padding: 15px 5px; font-size: 14px;}
}
@media (min-width:360px){
    .product-info{padding: 15px 10px; font-size: 15px;}
}
@media (min-width:414px){
    .product-item{width: calc((100% - 20px) / 2); margin-right: 20px;}
    .product-item:nth-child(2n){margin-right: 0;}
    .product-info{font-size: 16px;}
}
@media (min-width:480px){
    
}
@media (min-width:580px){

}
@media (min-width:767px){
    .product-item{width: calc((100% - 60px) / 4); margin-right: 20px;}
    .product-item:nth-child(2n){margin-right: 20px;}
    .product-item:nth-child(4n){margin-right: 0;}
}
@media (min-width:970px){
    .product-item{width: calc((100% - 30px) / 4); margin-right: 10px;}
    .product-item:nth-child(2n){margin-right: 10px;}
    .product-item:nth-child(4n){margin-right: 0;}
    .product-info{font-size: 15px;}
}
@media (min-width:1170px){
    .product-item{width: calc((100% - 90px) / 4); margin-right: 30px;}
    .product-item:nth-child(2n){margin-right: 30px;}
    .product-item:nth-child(4n){margin-right: 0;}
    .product-info{font-size: 16px;}
}.slide{margin-bottom: 33px;}
.slide .owl-nav{opacity: 0; transition: all 0.25s ease 0s;}
.slide .owl-nav div{position: absolute; top: 0; bottom: 0; margin: auto; width: 50px; height: 50px; opacity: 0.5; transition: all 0.25s ease 0s;}
.slide .owl-nav div:hover{opacity: 1;}
.slide .owl-nav div.owl-prev{left: 25px; background: url(/components/home.slide/l.png) no-repeat;}
.slide .owl-nav div.owl-next{right: 25px; background: url(/components/home.slide/r.png) no-repeat;}

.slide-item{position: relative;}
.slide-item span{position: absolute; right: 0; bottom: 0; left: 0; margin: auto; padding: 10px 20px; font-size: 17px; line-height: 25px; color: #fff; background: rgba(0,0,0,0.5); transition: all 0.25s ease 0s;}

.slide:hover .owl-nav{opacity: 1;}
.slide:hover .slide-item span{background: rgba(0,0,0,0.75);}

@media (min-width:320px){.slide-item span{display: none;}}
@media (min-width:580px){.slide-item span{display: block;}}.menu{position: relative; height: 50px; background: #339933; z-index: 100;}

.menu-desk{float: left;}
.menu-desk ul#navigation{list-style: none;}
.menu-desk ul#navigation li{list-style: none; float: left; position: relative; background: transparent; transition: all 0.25s ease 0s;}
.menu-desk ul#navigation li.active, .menu-desk ul#navigation li:hover{background: #2a7027;}
.menu-desk ul#navigation li a{display: block; text-transform: uppercase; line-height: 50px; color: #fff;}

.menu-desk ul#navigation li > ul{opacity: 0;}
.menu-desk ul#navigation li:hover > ul{visibility: visible; opacity: 1;}
.menu-desk ul#navigation li:hover > ul li{visibility: visible;}
.menu-desk ul#navigation ul,
.menu-desk ul#navigation ul li ul{top: 100%; left: 0; float: left; visibility: hidden; position: absolute; z-index: 999; width: 225px; display: none;}
.menu-desk ul#navigation ul li{width: 100%; background: #2a7027!important; border-bottom: 1px solid #fff;}
.menu-desk ul#navigation ul li:hover{background: #339933!important;}
.menu-desk ul#navigation ul li:last-child{border-bottom: 0;}
.menu-desk ul#navigation ul li a{text-transform: none; line-height: normal; padding: 10px 5px 10px 10px;}

.menu-mobile{position: relative; float: left; height: 50px; width: 50px; text-align: center;}
.menu-mobile span{display: block; width: 33px; height: 3px; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;  background: #fff;}
.menu-mobile span:after, .menu-mobile span:before{display: block; width: 33px; height: 3px; background: #fff; position: absolute; content: '';}
.menu-mobile span:after{bottom: -9px;}
.menu-mobile span:before{top: -9px;}

.menu-search{position: absolute; top: 0; right: 51px; background: #339933; transition: all 0.5s ease 0s;}
.searchbutton{position: relative; float: left; width: 50px; height: 50px; cursor: pointer; transition: all 0.5s ease 0s;}
.searchbutton:after{font-family: FontAwesome; content: "\f002"; font-size: 20px; text-align: center; line-height: 50px; color: #fff; position: absolute; top: 0; right: 0; bottom: 0; left: 0; transition: all 0.5s ease 0s;}
.searchform{position: relative; float: right; width: 0px; height: 50px; opacity: 0; overflow: hidden; transition: all 0.5s ease 0s;}
.searchform:after{font-family: FontAwesome; content: "\f002"; font-size: 20px; text-align: center; line-height: 50px; color: #fff; position: absolute; top: 0; right: 0; width: 50px; z-index: 1;}
.searchform input[type='text']{float: left; width: calc(100% - 50px); height: 50px; border: 0; text-indent: 0; color: #fff;}
.searchform input[type='submit']{position: relative; float: left; width: 50px; height: 50px; background: transparent; z-index: 2;}

.searchform input::-webkit-input-placeholder{color:#fff;}
.searchform input:-moz-placeholder{color:#fff;}
.searchform input::-moz-placeholder{color:#fff;}
.searchform input:-ms-input-placeholder{color:#fff;}

.menu-search-show{border-left: 1px solid #4a5b48;}
.menu-search-show .searchbutton{border-radius: 20px 0 0 20px;}
.menu-search-show .searchbutton:after{content: "\f105";}
.menu-search-show .searchform{opacity: 1;} 

.menu-cart{float: right; border-left: 1px solid #4a5b48;}
.menu-cart a{display: block; position: relative;}
.menu-cart a i{width: 50px; height: 50px; font-size: 20px; text-align: center; line-height: 50px; color: #fff;}
.menu-cart a span{display: block; background: #ff0000; position: absolute; top: 5px; right: 5px; width: 20px; height: 20px; font-size: 11px; text-align: center; line-height: 20px; color: #fff; border-radius: 10px;}

@media (min-width: 320px){
    .menu-desk{display: none;}
    .menu-mobile{display: block;}
    
    .menu-search-show .searchform{width: 198px;}
}
@media (min-width: 970px){
    .menu-desk{display: block;}
    .menu-mobile{display: none;}
    .menu-display{display: none;}
    
    .menu-desk ul#navigation li a{font-size: 14px; padding: 0 10px;}
    
    .menu-search-show .searchform{width: 188px;}
}
@media (min-width: 1170px){
    .menu-desk ul#navigation li a{padding: 0 15px;}
    
    .menu-search-show .searchform{width: 282px;}
}.news-item{margin: 0 0 30px; line-height: 20px;}

.news-info .clear{width: 100%; margin: 10px 0 15px; border-bottom: 1px dashed rgba(51,51,51,0.5);}

.news-name{font-family: RobotoBold; font-size: 15px; text-transform: uppercase; color: #339933; max-height: 40px; overflow: hidden; margin-bottom: 10px;}
.news-name a, .news-name h1{color: #339933; transition: all 0.25s ease 0s;}
.news-name h1{font-size: calc(100% + 2px);}
.news-name:hover a{color: #ff0000;}

.news-prev{color:  rgba(51,51,51,0.75); max-height: 40px; overflow: hidden;}

.news-more{float: left; font-size: 12px; text-transform: uppercase; margin: 0 10px 0 0;}
.news-more a{display: block; padding: 3px 10px 2px; background: #2a7027; color: #fff; transition: all 0.25s ease 0s;}
.news-more:hover a{background: #ff0000;}

.news-time{float: left; font-size: 12px; text-transform: uppercase;}
.news-time-inner{margin-bottom: 10px;}
.news-time a{display: inline-block; background: rgba(51,51,51,0.75); color: #fff; margin: 0 6px 0 0; padding: 3px 10px 2px; transition: all 0.25s ease 0s;}
.news-time a:hover{background: #339933;}
.news-time span{display: inline-block; padding: 3px 0 2px; color: rgba(51,51,51,0.75);}

@media (min-width:320px){
    .news-img{margin: 0 0 11px;}
}
@media (min-width:480px){
    .news-img{float: left; width: 220px; margin: 0;}
    .news-info{float: right; width: calc(100% - 250px);}
}.SPDetailLeft{position: relative; float: left; margin: 0 0 30px;}
.SPDetailLeft .product-click{position: absolute; top: 10px; left: 10px; font-size: 11px; background: rgba(255,255,255,0.75); padding: 3px; opacity: 0.5; transition: all 0.25s ease 0s;}
.SPDetailLeft:hover .product-click{opacity: 1;}

.SPDetailRight{float: right; margin: 0 0 30px;}

.SPDetailName{font-family: RobotoBold; font-size: 25px; font-weight: normal; text-transform: uppercase; color: #ff0000;}

.SPDetailInfo{list-style: none; line-height: 22px; border-bottom: 1px solid #d7d7d7; padding: 10px 0 15px; margin-bottom: 15px;}

.SPDetailPrice{line-height: 30px; margin-bottom: 25px;}
.SPDetailPrice span{font-family: RobotoBold; font-size: 21px; color: #ff0000;}
.SPDetailPrice label{font-family: RobotoBold; font-size: 19px; color: #b7b7b7; text-decoration: line-through;}

.SPDetailBook{margin-bottom: 30px;}

.SPDetailQuantity{float: left; width: 140px;}
.SPDetailQuantity div{float: left; width: 40px; height: 40px; background: #339933; transition: all 0.25s ease 0s;} 
.SPDetailQuantity div:hover{background: #2a7027;}
.SPDetailQuantity div a{display: block; font-size: 15px; font-family: bold; text-align: center;  line-height: 38px; color: #fff;}
.SPDetailQuantity input{float: left; width: 60px; height: 40px; font-size: 20px; text-align: center; border: 1px solid #339933; border-right: 0; border-left: 0; text-indent: 0;}

.SPDetailCart{float: right; width: calc(100% - 160px); height: 40px; background: #339933;}
.SPDetailCart a{display: block; font-family: RobotoBold; font-size: 15px; text-transform: uppercase; text-align: center; line-height: 40px; color: #fff; transition: all 0.25s ease 0s;}
.SPDetailCart a:hover{background: #2a7027;}

@media (min-width: 320px){
    .SPDetailLeft, .SPDetailRight{width: 100%;}
    .BookLeft,
    .BookRight,
    .BookInfo,
    .BookRoute{width: 100%;}
}
@media (min-width: 480px){

}
@media (min-width: 767px){
    .SPDetailLeft{width: 390px;}
    .SPDetailRight{width: calc(100% - 420px);}
    .BookInfo{float: right; width: calc(50% - 5px);}
    .BookRoute{float: left; width: calc(50% - 5px);}
}
.login{}

.login-form{box-sizing: border-box; width: 404px; margin: auto; padding: 0 5px;}

.login-item{position: relative; width: 100%; height: 33px; line-height: 33px; margin-bottom: 15px;}

.login-item-password label{position: relative; display: inline-block; padding-left: 38px; cursor: pointer;}
.login-item-password label:after,
.login-item-password a:after{width: 31px; height: 31px; font-family: FontAwesome; content: "\f00c"; font-size: 20px; text-align: center; line-height: 31px; color: #c3c3c3; border: 1px solid #c3c3c3; position: absolute; top: 0; left: 0; transition: all 0.25s ease 0s;}
.login-item-password label:hover:after,
.login-item-password a:hover:after{color: #333; border: 1px solid #333;}
.login-item-password input[type='checkbox']{display: none;}
.login-item-password input[type='checkbox']:checked + label.checkbox:after{color: #333; border: 1px solid #333;}
.login-item-password a{position: absolute; display: inline-block; top: 0; right: 0; color: #333; padding-right: 38px;}
.login-item-password a:after{content: "\f128"; right: 0; left: inherit;}

.login-item-register{margin-bottom: 0; text-align: center;}
.login-item-register a{color: #333; transition: all 0.25s ease 0s;}
.login-item-register a:hover{color: #ff0000;}

.login-error, .login-update{text-transform: uppercase; line-height: 21px; color: #fff; margin: 0 0 15px; padding: 7px 0 5px 15px;}
.login-error{background: rgba(255,0,0,0.5); border-left: 5px solid #ff0000;}
.login-update{background: rgba(0,128,0,0.5); border-left: 5px solid #008000;}