@charset "utf-8";
div.editor {}
div.editor, div.editor p, div.editor dl, div.editor dd, div.editor ul, div.editor li {font-size: 1rem; font-weight: 400}
div.editor table {width: 100% !important}
div.editor ul li {list-style: disc}
div.editor ol li {list-style: decimal}
div.editor img {padding-top: 1rem; padding-bottom: 1rem}

/*左側選單
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background: #4a9133;
}
.nav-pills .nav-link {
    color: #fff;
    font-size: 1.1rem;
    background: #82bf6d;
    border-bottom: 1px solid #fff;
    border-radius: 0;
    padding: .7rem .5rem;}
.nav-pills .nav-link:nth-of-type(1) {
    background: #d6d6d6;
    border-bottom: 1px solid #b2b2b2;
    color: #000;
}*/

/*aside nav*/
.sideNav {
    width: 100%;
    background: #82bf6d;
    flex-direction: column !important;
}
.sideNav .nav-item {
    border-right: none;
    padding: 0
}
.sideNav .nav-item:nth-of-type(1) {
    background: #b2b2b2;
   }
.sideNav .nav-item:nth-of-type(1)>a {
    color: #000 !important;}

.sideNav .nav-item:hover, .sideNav .nav-item[active] {background: #4a9133}
.sideNav .nav-item .nav-link {padding: .7rem 0 .7rem .5rem;font-size: 1.1rem;}
.sideNav .nav-item .nav-link:hover,
.sideNav .nav-item[active] .nav-link { background: #4a9133; color: #fff !important}

.navbar-light .navbar-toggler {
    padding: .7rem 1rem;
    background: #54a83d;
    color: #fff;
    border-color: #54a83d;}

.navbar-light .navbar-toggler:hover {
    background: #54a83d;
    border-color: #54a83d !important;
}




/*title*/
.title>h2{
    text-align: center}
.title>h2>span{color:#54a83d; font-size: 16px;}
div.news span{
    color: #54a83d;
    font-size: 16px;
}
/*shop list*/
div.pTitle>h2{border-bottom: 1px solid #7DBC40;}
div.pTitle>h2>span{background:#7DBC40;color:#fff;padding:.2rem 1rem .1rem 1rem; font-size: 1.2rem;}
div.step{text-align:center;padding-bottom: 2rem;}
div.step>img{width:50%;}
div.cartList>dl.cartList:nth-of-type(even) {background: #e4e4e4}
dl.cartList {margin-bottom: 0}
dl.cartList>dd {text-align: center; margin-bottom: 0; padding-top: .5rem; padding-bottom: .5rem;}
dl.ITEM>dd {border-right:1px solid #969696;margin-bottom: .5rem;}
dl.ITEM>dd:nth-of-type(6) {border-right:none;}
dl.ITEM2>dd {border-right:1px solid #969696;margin-bottom: .5rem;}
dl.ITEM2>dd:nth-of-type(5) {border-right:none;}



/*最新消息*/
div.news>dl>dd {border-bottom:1px dashed ; 
    border-bottom-color:#919191;}
div.news a{font-size: 19px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;}
div.news>dl>dd {
    /*單行文字限制*/
    overflow:hidden;
    text-overflow : ellipsis;
    white-space : nowrap;
}
.Newstitle h2 {font-size: 25px;}
.Newstitle {border-bottom:1px dashed ; 
    border-bottom-color:#919191;}
.newsDate{color:#54a83d; font-size: 16px;}
.backTo{text-align: center}


/*常見問題 Q&A*/
div.faq {
    border-color: #82bf6d;
    margin-bottom: 1rem;
}
div.card-header {background: #fff !important}
div.card-header>h5>button {
    color: #000 !important;
    text-decoration: none !important;
    text-align: left !important;
    font-size: 20px;
}
div.card-body>div.editor {background: #eee; padding: .7rem}

/*products*/
.table .thead-dark th {
    color: #fff;
    text-align: center;
    background-color: #8c8c8c;
    font-weight:normal;
    border-color: #8c8c8c;
}
.table th, .table td {
    text-align: center;
    padding: 0.75rem;
    vertical-align: top;
    border-top: 1px solid #dee2e6;
}

div.prods {
    border: 1px solid #dbdbdb;
    background-color: #fff;
    border-radius: .2rem;
    padding: .75rem;
    height: 200px;
    display: flex;
    justify-content: center;
    align-items: center;
}
div.prods img {
    width: 100%;
    max-height: 200px;
}
div.prods>figure {position: relative}
div.prods>figure>figcaption {
    position: absolute;
    right: .1rem;
    bottom: .1rem
}
div.prodInfo h6{
    color: #fc2222;
    font-size: 22px;

}

figure.d-flex.align-items-center.justify-content-center {
    margin-bottom: 0;
}

/*瀏覽紀錄*/
div.Historytitle>h2{
    color: #54a83d;

}


/*content title*/
div.pTitle>h1 {
    font-size: 1.35rem;
    font-weight: 400;
    padding-bottom: .5rem;
    padding-left: .75rem
}
div.pTitle>h1>i  {
    background: #956696;
    border-radius: 50%;
    color: #fff;
    margin-right: .5rem;
    padding: .15rem 0rem .05rem .05rem;
}

div.navi>span {color: #ff3a1e}
div.navi>span::after {
    content: "/";
    color: #221e1f;
}
div.navi>span:last-of-type::after {content: none}

div.back {text-align: center}
div.back>a {
    border: 1px solid #221e1f;
    border-radius: .25rem;
    padding: .5rem 1.5rem
}
div.more>a:hover {border-color: #ff3a1e}

/*pagination*/
a.page-link {padding: .5rem .75rem}
li.page-item:first-of-type>a.page-link,
li.page-item:last-of-type>a.page-link {padding: .5rem}

/*aside nav*/
dl.sideNav>dd {border-bottom: 1px dashed #956696; padding: .5rem 2rem}
dl.sideNav>dd.active, dl.sideNav>dd:hover {background: #956696}
dl.sideNav>dd.active>a, dl.sideNav>dd:hover>a {color: #fff !important}




/*links*/
dl.links>dd>p>span {color: #333}
dl.links>dd a {color: #df5088}

/*contact*/
div.contactIntro {text-align: center}


dl.form>dt> sup {color: red;padding-bottom: 5px}
dl.form>dt>label>sup {color: #f00}
dl.form>dd:nth-of-type(1) input {width: 60%}
dl.form>dd {}
dl.form>dd:nth-last-of-type(2) input {width: 50% !important}
dl.form>dd:nth-last-of-type(2) img {width: 10rem}
dl.form>dd:last-of-type {text-align: center}
dl.form>dd:last-of-type button {
    margin: 0 .25rem;
    padding: .5rem 1.5rem;

}

/*product detail*/
div.prodIntro>div.prodName {
    border-bottom: 1px solid #ccc;}
div.prodtitle h2{font-size: 1.5rem ;
    color: #54a83d;
    margin-bottom: 1.5rem;
    padding-right: .5rem;}
div.prodImg {text-align: center}
div.app-figure {position: relative}
div.iconZoom {
    width: 2rem;
    position: absolute;
    bottom: 8rem;
    left: 1rem;
    z-index: 999
}
body article section div div div#zoom-fig a#Zoom-1 > .mz-figure > img {width: auto !important; max-width: inherit !important; max-height: 450px !important}
a[data-zoom-id] img, .mz-thumb img {width: auto !important; max-width: inherit !important; max-height: 75px !important}


div.prodIntro>div.price>p {margin-bottom: 0;}
div.prodIntro>div.price>p:nth-of-type(1) {text-decoration: line-through}
div.prodIntro>div.price>p:nth-of-type(2) {
    font-size: 2rem;
    font-weight: 400;
    color: #cd4747
}

dl.prodNorm>dd>span {
    color:red;
}


/*form*/
dl.contactForm>dt>span {
	font-size: .9rem;
	font-weight: 400;
	color: #f00;
	margin-left: .5rem;
}
dl.contactForm>dd>label>sup {color: #f00}
dl.contactForm>dd>img {width: initial !important; margin-left: .5rem;}
dl.contactForm>dd>button {margin-left: .25rem; margin-right: .25rem;}

/*cart*/
dl.cartStep {}
dl.cartStep>dd {
	border-top: 4px solid #ccc;
	text-align: center;
	padding: .5rem
}
dl.cartStep>dd.active {
	border-top-color: #54a83d;
	font-weight: 600;
	color: #54a83d;
}

.Buynotes>h2{font-size: 1.2rem;color:#54a83d;}
.Buynotes{border:1px solid #b2b2b2;}
.cartList button {
    background: none !important;
    border: none;
    border-radius: none;
    font-weight: 400;
    padding:0;
    color: #8c8c8c;}
/*shop list*/
table.orderDetail {width: 100%;}
table.orderDetail tr:nth-of-type(1) {background: #c5d16f}
table.orderDetail tr th, table.orderDetail tr td {
	border: 1px solid #c5d16f;
	text-align: center;
	padding: .25rem;
}
table.orderDetail tr td>h3 {font-size: 1.15rem;}
table.orderDetail tr td>p {margin-bottom: 0;}

table.orderDetail tr:last-of-type {background: #353535; color: #fff}
table.orderDetail tr:nth-last-of-type(2) td,
table.orderDetail tr:last-of-type td {text-align: right;}
table.orderDetail tr:nth-last-of-type(2) td p span:last-of-type {color: #f00}


dl.paycheck>dd:nth-of-type(1) {background: #eee}
dl.paycheck>dd>input[type="radio"] {margin-left: .5rem; margin-right: .5rem;}

dl.orderForm>dd {margin-bottom: 1.5rem;}
dl.orderForm>dd>label {width: 8rem; margin-left: 1rem;}
dl.orderForm>dd>select {margin-right: .5rem;}

div.checkdone>p {text-align: center;}
div.orderInfo {
	border: 1px solid #ddd;
	padding: 1rem;
}
div.orderInfo>div {padding-left: 1rem; padding-right: 1rem;}

div.checkBtn {margin-top: 1.5rem;}
div.checkBtn>a {
	background: #999;
	border-radius: .25rem;
	color: #fff;
	margin-left: .25rem;
	margin-right: .25rem;
	padding: .25rem 2rem;
}
div.btnCart {text-align: center; }
div.btnCart>button:nth-of-type(1) {background-color:#c6c6c6;border-color: #c6c6c6;color: #000;padding: .5rem 1rem !important;}
div.btnCart>button:nth-of-type(2) {background-color:#ef0d2f;border-color: #ef0d2f;color: #fff;padding: .5rem 1rem !important;}