/* 共用 */
.title { color:#366607; font-size:1.5rem; text-align: left; }
.more { color:#ababab; }
.more:hover { color: #fcce52;text-decoration: none; }
.mh3 { height:30px; }
.mh6 { height:60px; }

.loading { background-color:#fff; position: fixed; top:0; left:0; width:100%; height:100%; z-index:10000; }
.loading img { width:auto; position: absolute;top: 50%;left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%); }
/* 圖片淡入淡出 */
@keyframes showin {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes showout {
    0% { opacity: 1; }
    100% { opacity: 0; }
}

.top { position: relative; }
.top .topbnr .bnr { width:100%; height:100vh; }

.topinfo { display: flex; justify-content: space-between; align-items: center; padding-bottom:50px; border-bottom:1px solid #f6f6f6; }
/* .logo { position: absolute; left:40px; top:48px; z-index:2; } */
/* .logo img { width:auto; } */

.product { padding:80px 0px; }
.product .items { margin:40px 0px; }
.product .pd { margin-top:60px; }
.product .pd .des { padding:20px; }
.product .pd .des a { text-decoration: none; }
.product .pd .des a:hover > .pdname { color:#4B9007; }
.product .pd .des .pdname { color:#5e5e5e; font-size:1.25rem; padding-bottom:10px; }
.product .pd .des .price { white-space: nowrap; font-family:"Helvetica"; }
.product .pd .des .price1 { color:#366607; font-size:0.875rem; }
.product .pd .des .offer { font-size:1rem; font-weight: bold; }
.product .pd .des .price2 { color:#ababab; font-size:0.875rem; }

.about { background-color: #fef5cd; }
.about > div { flex:1; }
.about .cont { padding:120px; text-align:justify; }
.about .cont .tit { color:#000; font-size:2rem; }
.about .cont .content { color:#5e5e5e; padding-top:40px; }
.about .cont .link { display:inline-block; text-decoration: none; color:#000; padding-top:30px; }
.about .cont .link:hover { color:#366607 }
.about .cont .link .arrow { margin-left:15px; display: inline-block; width:60px; height:8px; background:url("./images/ico-arrow.png") no-repeat center center; background-size:contain  }

.news { padding:80px 0px; }
.news .row { text-align:left; }
.news .date { padding-top:80px; color:#ababab; font-size:0.875rem; }
.news .content { padding-top:25px; }
.news .content a { color:#5e5e5e; text-decoration: none; }
.news .content a:hover { color:#4B9007; }

.option { background-color:#f6f6f6; }
.option > div { flex:1; }
.option .cont { padding:80px; }
.option .cont .row { text-align:left; }
.option .cont .row > div { margin:12px 0px; }
.option .cont a { color:#303030; text-decoration: none; }
.option .cont a:hover { color:#366607; }
.option .cont .nline { display: inline-block; width:4rem;  height: 1px; background-color: #303030; margin-top: 11px; }

/* amination area init */
/* .cont, .prod,.btmbnr, .newcont { transform:translateY(100px); opacity: 0; } */
.upslideAni { animation:upslide 2s; transform:translateY(0px); opacity: 1; }
/* animation */
@keyframes upslide {
    0% { transform:translateY(100px); opacity: 0; }
    100% { transform: translateY(0px); opacity: 1; }
}

@media (max-width:1199.98px){
    .about .cont { padding:80px; }
}

@media (max-width:991.98px){
    .news .date { padding-top:40px; }
    .news .content { padding-top:20px; }
}

@media (max-width:767.98px){
    .topinfo { padding-bottom:25px; }

    .product { padding:60px 0px; }
    .product .pd { margin-top:30px; }
    .product .pd .des { text-align:left; padding:10px; }
    .product .pd .des .pdname { font-size:1.2rem; }
    .product .pd .des .price1 { font-size:1rem; }
    .product .pd .des .offer { font-size:1.2rem; }
    .product .pd .des .price2 { font-size:0.9rem; }
    
    .about .cont { padding:60px 40px; }
    .about .cont .tit { font-size:1.5rem; }
    .about .cont .content { padding-top:20px; }
    
    .news { padding:60px 0px; }
    .news .date { padding-top:30px; }
    .news .content { padding-top:5px; }

    .option .cont { padding:60px 40px; }
}

@media (min-width:768px){

}

@media (min-width:992px){
    .about { display: flex; }
    .about .img { background:url("./images/img-meshang-1.jpg")no-repeat center center; background-size:cover; }
    .option { display: flex; }
    .option .img { background:url("./images/img-meshang-2.jpg")no-repeat center center; background-size:cover; }
}

@media (min-width:1200px){

}

@media (min-width:1500px){
    .product .container { max-width:1520px; }
    .news .container { max-width:1520px; }
}