@charset "UTF-8";
body {margin:0;padding:0;font-family:'Century Gothic', "微軟正黑體", Arial;background:#463429;}
.FOR_MAIN{ width:100% !important; padding:0;}
.clear {clear:both;}
ul ,ol ,li {list-style-type:none;}
a ,a:hover {text-decoration:none;}
.wrapper {width:100%;overflow-x:hidden;position:relative;}
.top_icon {width:40px;height:50px;top:0;right:5px;position:absolute;}

.top {width:100%;height:40px;background:#362E2B;}
.logo {width:112px;height:36px;margin:2px 0 0 5px;float:left;}
.logo img {width:100%;}
.top_right {margin:0 10px 0 0;line-height:40px;color:#FFF;float:right;}
.top_right a ,.top_right a:hover {color:#FFF;}
.main {height:auto;margin:0 auto;position:relative;}
.mainjpg {width:100%;height:100%;position:relative;}
.mainjpg img {width:100%;display:block;}
.main_bg {top:0;position:relative;}
.main_bg img {width:100%;display:block;}
#goTop {display:none;}
.main_m img {width:100%;display:block;}
.main_title img {width:100%;}

.bgbg1 {padding:30px 0 60px;}
.bgbg2 {padding:60px 0;background:url(list_bg.png) center 0 repeat-y;}

.title {width:100%;font:bold 50px/50px "微軟正黑體", Arial;color:#FFF;text-align:center;display:block;margin:20px 0 5px;}

.main_list_bg {padding:0;}
.main_list_border {margin:0 auto;border:10px solid #e2d9b7;background:#f6f2e3;box-sizing:border-box;border-radius:20px;}
.main_list {margin:0 auto;padding:10px 0;box-sizing:border-box;display:flex;flex-direction:row;justify-content:space-around;flex-wrap:wrap;position:relative;z-index:10000;}
.main_list>p {margin:20px 0 30px;padding:0;text-align:center;color:#FFF;font:50px/104px "微軟正黑體", Arial;}
.main_list li {text-align:center;color:#000;background:#FFF;box-sizing:border-box;transition: all 0.6s;position:relative;}
.main_list li img {display:block;width:100%;}
.main_list li a , .main_list li a:hover {color:#000;}
.main_list li:hover {transform:scale(1.025);}
.main_list li del::before {content:"市價$";font-size:15px;color:#FF0;}
.main_list li del {display:block;width:100%;padding:5px 0;background:#463429;color:#FF0;}
.price_title1 {width:60px;margin:10px auto 0;padding:5px 10px;font-size:15px;line-height:18px;background:#F90;color:#FFF;border-radius:3px;}
.main_list li p {height:40px;margin:5px 0 0;padding:0 5px;font-size:15px;line-height:20px;overflow:hidden;}
.main_list li p b::before {content:"$";font-size:15px;color:#F90;}
.main_list li p b {font-size:30px;color:#F90;line-height:30px;}

.pro_list_bg {padding:0;}
.pro_list {margin:0 auto;padding:10px 0;box-sizing:border-box;display:flex;flex-direction:row;justify-content:space-around;flex-wrap:wrap;position:relative;z-index:10000;}
.pro_list_border {margin:0 auto;border:10px solid #463429;background:#f6f2e3;box-sizing:border-box;border-radius:20px;}
.pro_list>p {margin:20px 0 30px;padding:0;text-align:center;color:#FFF;font:50px/104px "微軟正黑體", Arial;}
.pro_list li {text-align:center;color:#000;background:#FFF;box-sizing:border-box;transition: all 0.6s;position:relative;}
.pro_list li img {display:block;width:100%;}
.pro_list li a , .pro_list li a:hover {color:#000;}
.pro_list li:hover {transform:scale(1.025);}
.pro_list li del::before {content:"市價$";font-size:15px;color:#FF0;}
.pro_list li del {display:block;width:100%;padding:5px 0;background:#463429;color:#FF0;}
.pro_list li p {height:40px;margin:5px 0 0;padding:0 5px;font-size:15px;line-height:20px;overflow:hidden;}
.pro_list li p b::before {content:"$";font-size:15px;color:#F90;}
.pro_list li p b {font-size:30px;color:#F90;line-height:30px;}
.sub {height:24px;line-height:24px;margin:0;padding:3px 0;background:#FC0;color:#000;}

.fadeIn {
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn; }

@-webkit-keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

@keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }


.fadeInUp {
  -webkit-animation-name: fadeInUp;
          animation-name: fadeInUp; }

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 50px, 0);
            transform: translate3d(0, 50px, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none; } }

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 50px, 0);
            transform: translate3d(0, 50px, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none; } }

.copyright {font-size:13px;padding:450px 0 10px;padding:0 0 10px;text-align:center;color:#FFF;background:#362e2b;}
.copyright p {width:95%;margin:0 auto;padding:10px 0 0;text-align:center;color:#FFF;}

.banner {padding:0;}
.banner li img {width:100%;display:block;}

@media screen and (min-width:1491px) {
.wrapper {width:100%;background:url(bg.jpg) center 40px no-repeat;}
.main {width:1200px;}
.main_m {display:none;}

.main_list_border {width:1200px;}
.main_list {width:100%;height:auto;padding:1%;}
.main_list li {width:19%;height:auto;margin:1% 0.5% 0;}
.pro_list_border {width:1200px;}
.pro_list {width:100%;height:auto;padding:1%;}
.pro_list li {width:19%;height:auto;margin:1% 0.5% 0;}
}

@media screen and (min-width:1301px) and (max-width:1490px) {
.wrapper {width:100%;background:url(bg.jpg) center 40px no-repeat;}
.main {width:1200px;}
.main_m {display:none;}

.main_list_border {width:1200px;}
.main_list {width:100%;height:auto;padding:1%;}
.main_list li {width:19%;height:auto;margin:1% 0.5% 0;}
.pro_list_border {width:1200px;}
.pro_list {width:100%;height:auto;padding:1%;}
.pro_list li {width:19%;height:auto;margin:1% 0.5% 0;}
}

@media screen and (min-width:1081px) and (max-width:1300px) {
.wrapper {width:100%;}
.main {width:100%;}
.main_m {display:none;}

.main_list_border {width:98%;}
.main_list {width:100%;height:auto;padding:1%;}
.main_list li {width:19%;margin:1% 0.5% 0;}
.pro_list_border {width:98%;}
.pro_list {width:100%;height:auto;padding:1%;}
.pro_list li {width:19%;margin:1% 0.5% 0;}
}

@media screen and (min-width:769px) and (max-width:1080px) {
.wrapper {width:100%;}
.main {width:100%;}
.main_m {display:none;}

.title img {width:100%;max-width:890px;}
.main_list_border {width:90%;border-width:10px;border-radius:20px;}
.main_list {width:100%;height:auto;padding:1%;}
.main_list li {width:98%;margin:1%;}
.pro_list_border {width:90%;border-width:10px;border-radius:20px;}
.pro_list {width:100%;height:auto;padding:1%;}
.pro_list li {width:48%;margin:1% 0.5%;}
.main_list>p ,.pro_list>p {font:40px/104px "微軟正黑體", Arial;}

}

@media screen and (min-width:601px) and (max-width:768px) {
.wrapper {width:100%;}
.main {width:100%;}
.main_m {display:none;}

.title img {width:98%;}
.main_list_border {width:90%;border-width:10px;border-radius:20px;}
.main_list {width:100%;height:auto;padding:1%;}
.main_list li {width:98%;margin:1%;}
.pro_list_border {width:90%;border-width:10px;border-radius:20px;}
.pro_list {width:100%;height:auto;padding:1%;}
.pro_list li {width:48%;margin:1% 0.5%;}
.main_list>p ,.pro_list>p {font:40px/104px "微軟正黑體", Arial;}
}

@media screen and (min-width:421px) and (max-width:600px) {
.wrapper {width:100%;}
.main {width:100%;}
.mainjpg {display:none;}
.main_m {width:100%;height:auto;}

.title {font:bold 35px/35px "微軟正黑體", Arial;}
.main_list_border {width:90%;border-width:10px;border-radius:20px;}
.main_list {width:100%;height:auto;padding:1%;}
.main_list li {width:98%;margin:1%;}
.pro_list_border {width:90%;border-width:10px;border-radius:20px;}
.pro_list {width:100%;height:auto;padding:1%;}
.pro_list li {width:48%;margin:1% 0.5%;}
.main_list>p ,.pro_list>p {font:30px/104px "微軟正黑體", Arial;}
}
@media screen and (max-width:420px) {
.wrapper {width:100%;}
.main {width:100%;}
.mainjpg {display:none;}
.main_m {width:100%;height:auto;}

.title {height:auto;margin:20px 0 0;font:bold 30px/30px "微軟正黑體", Arial;}
.main_list_border {width:94%;border-width:10px;border-radius:20px;}
.main_list {width:100%;height:auto;padding:1%;}
.main_list li {width:98%;margin:1%;}
.pro_list_border {width:94%;border-width:10px;border-radius:20px;}
.pro_list {width:100%;height:auto;padding:1%;}
.pro_list li {width:48%;margin:1% 0.5%;}
.main_list>p ,.pro_list>p {font:30px/104px "微軟正黑體", Arial;}
}