@charset "UTF-8";
.wrapper {width:100%;overflow-x:hidden;background:#1e0048;position:relative;}

.top {width:100%;height:40px;background:#000;}
.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 {width:100%;height:auto;margin:0 auto;/*overflow:hidden;*/position:relative;}

.tablet {width:100%;height:100%;top:0;position:absolute;}
.tablet img {display:block;width:100%;}
.desktop {width:100%;height:100%;top:0;position:absolute;}
.desktop img {display:block;width:100%;}
.light {width:100%;height:100%;position:relative;z-index:10001;-webkit-animation:btn 3.5s ease both infinite;
  animation:btn 3.5s ease both infinite;}

@keyframes btn {
  0% { 
  filter:brightness(100%);
  }
  5% { 
  filter:brightness(100%);
  }
  10% { 
  filter:brightness(150%);
  }
  11% { 
  filter:brightness(100%);
  }
  18% { 
  filter:brightness(130%);
  }
  20% { 
  filter:brightness(100%);
  }
  70%{ 
  filter:brightness(100%);
  }
  100% { 
  filter:brightness(100%);
  }
}
.light img {display:block;width:100%;}

.main_bg {top:0;position:relative;}
.main_bg img {display:block;width:100%;}
#gotop {display:none;padding:20px;right:10px;bottom:10px;color:#000;background:rgba(255 ,255 ,255 ,.6);border-radius:20px;cursor:pointer;z-index:10002;position:fixed;}
#gotop::before {display:block;content:'^';font-size:30px;top:17px;left:10px;position:absolute;}

.main_title {top:50px;transition: all 0.6s;z-index:10002;position:absolute;}


/*大標文字*/

.mobile {display:none;width:100%;-webkit-animation:mobile_light 3.5s ease both infinite;
  animation:mobile_light 3.5s ease both infinite;}

@keyframes mobile_light {
  0% { 
  filter:brightness(100%);
  }
  5% { 
  filter:brightness(100%);
  }
  10% { 
  filter:brightness(150%);
  }
  11% { 
  filter:brightness(100%);
  }
  18% { 
  filter:brightness(130%);
  }
  20% { 
  filter:brightness(100%);
  }
  70%{ 
  filter:brightness(100%);
  }
  100% { 
  filter:brightness(100%);
  }
}
.mobile img {width:100%;}

.main_list_bg {padding:80px 0;position:relative;}
.main_list {margin:0 auto;padding:40px 0;box-sizing:border-box;display:flex;flex-direction:row;justify-content:space-around;flex-wrap:wrap;position:relative;}
.main_list>p {margin:0 0 15px;padding:0;text-align:center;color:#FFF;font:50px/104px "微軟正黑體", Arial;}
.main_list li {text-align:center;border:3px solid #ffb7fb;border-radius:20px;box-shadow:0px 0px 6px 2px rgba(255,25,241,.7),inset 0px 0px 6px 2px rgba(255,25,241,.7);box-sizing:border-box;overflow:hidden;transition: all 0.3s ease-out;position:relative;z-index:10000;position:relative;}
.main_list li img {width:100%;}
.main_list li a , .main_list li a:hover {color:#000;}
.main_list li:hover {transform:scale(0.985) !important;}
.main_list_bg >.title_pc {width:100%;}
.main_list li p {height:48px;margin:5px 0 0;padding:0 5px;font-size:18px;color:#FFF;line-height:24px;display:block;box-sizing:border-box;overflow:hidden;}
.main_list li p b::before {content:'$';font-size:15px;color:#FF0;}
.main_list li p b {font-size:30px;color:#FF0;line-height:30px;}
.main_list li p:last-child {height:60px;font-size:36px;line-height:36px;}
.main_list li p:last-child::before {content:'活動價';margin:0 5px 0 0;padding:5px;border-radius:6px;font-size:15px;color:#000;background:#FF0;top:-5px;position:relative;}
.main_list li del::before {content:'市價$';font-size:12px;}
.main_list li del {display:block;width:100%;padding:5px 0;background:#333;color:#FF0;}
.main_list li span {font-size:15px;color:#F03;font-weight:bold;}
.main_list li:nth-child(even) {top:50px;}

.title_pc {font:40px/70px "微軟正黑體", Arial;color:#000;text-align:center;display:block;margin:0 auto 10px;}
.title_m {font:bold 50px/50px "微軟正黑體", Arial;color:#FFF;text-align:center;display:block;margin:0 0 10px;top:-100px;position:absolute;z-index:10001;}

.pro_list_bg {padding:60px 0 0;position:relative;}
.pro_list {margin:40px auto 80px;padding:0 0.5%;border:5px solid #F00;box-shadow:0px 0px 0px 2px rgba(170,0,0,.7),inset 0px 0px 0px 2px rgba(170,0,0,.7);box-sizing:border-box;display:flex;flex-direction:row;justify-content:space-around;flex-wrap:wrap;z-index:2;position:relative;
position:relative;}
.pro_list_bg > .title_pc > p {width:100%;height:auto;margin:0 auto;font:40px/70px "微軟正黑體", Arial;text-align:center;}
.pro_list_bg > .title_pc {width:100%;}
.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;overflow:hidden;transition: all 0.3s ease-out;z-index:10001;position:relative;}
.pro_list li img {display:block;width:100%;overflow:hidden;box-sizing:border-box;background:#FFF;}
.pro_list li a ,.pro_list li a:hover {color:#000;}
.pro_list > li:hover {transform:scale(0.985) !important;transition: all 0.3s ease-out !important;}
.pro_promo {display:table;width:auto;height:30px;margin:0 auto;padding:0 15px;color:#2b2f52;background:#F47;text-align:center;font-size:18px;line-height:30px;border-radius:30px;}
.pro_list li p {height:48px;margin:5px 0 0;padding:0 5px;font-size:18px;color:#000;line-height:24px;display:inline-block;box-sizing:border-box;overflow:hidden;}
.pro_list li p:last-child {color:#A00;}
.pro_list li p b::before {content:'活動價$';font-size:15px;color:#A00;}
.pro_list li p b {font-size:26px;color:#A00;line-height:30px;}
.pro_list li del::before {content:'市價$';font-size:12px;}
.pro_list li del {display:block;width:100%;padding:5px 0;background:#333;color:#FF0;}
.pro_list li span {font-size:15px;color:#F03;font-weight:bold;}

/*宮格底色*/
.s1 {background:none;}
.s2 {background:none;;}

.info_bg {margin:30px auto 0;padding:30px 0;box-sizing:border-box;}
.info_bg > .title_bg >.title {color:#FFF;}
.title_bg {text-align:center;position:relative;}
ul.info_ul {margin:0 0 35px 15px;padding:0;box-sizing: border-box;}
ul.info_ul li {list-style-type:none;margin:10px 0;font-size:20px;line-height:30px;color:#FFF;}
ul.info_ul li i {display:inline-block;width:5px;height:25px;margin:0 3px 0 0;background:#FFF;top:4px;position:relative;}
ul.info_ul li a {color:#FF0;}
ul.info_ul li a:hover {color:#c7ff5e;}
ul.info_ul li span {margin:0;font-size:20px;line-height:30px;color:#FF0;}

ol.info_ul {margin:0 auto 35px;padding:0 0 0 20px;box-sizing:border-box;text-align: justify;text-justify:inter-ideograph;}
ol.info_ul li {list-style-type:decimal;margin:10px 0;font-size:20px;line-height:30px;color:#46473f;}
ol.info_ul li a {color:#ff8282;}
ol.info_ul li a:hover {color:#ff3232;}
ol.info_ul li span {margin:0;font-size:20px;line-height:30px;color:#ff8282;}
ol.info_ul li p {margin:0;font-size:20px;line-height:30px;color:#ff3232;}
.info_bg ol.info_ul .title {margin:10px 0 0;color:#46473f;left:-20px;position:relative;}
.sub_title {width:100%;margin:20px 0 0;padding:5px 0;font-size:26px;line-height:32px;color:#46473f;background:#ff9527;border-radius:50px;text-align:center;position:relative;}

.bgbg {padding:0 0 100px;background:url(list_bg.png) center 0 no-repeat;background-attachment:fixed;background-size: cover;}

.copyright {font-size:13px;margin:0;padding:0 0 10px;text-align:center;color:#FFF;background:#000;}
.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;}

/*RWD-menu*/
.menu {width:100%;height:auto;padding:0;display:flex;border-bottom: 1px solid #F00;background:#000;top:0;right:0;z-index:10003;}
.menu ul {width:100%;max-width:1200px;margin:0 auto;box-sizing:border-box;}
.bor {/*border:3px solid #fade8b;background:#000;border-radius:40px;*/}
.menu li {width:calc(100% / 5);margin:0;text-align:center;list-style:none;font-size:20px;line-height:20px;border-left:1px solid #FFF;box-sizing:border-box;display:flex;flex-direction:row;justify-content:space-around;flex-wrap:wrap;position:relative;}
.menu li:first-child {border-left:0;}
.menu li a {width:100%;display:flex;text-decoration: none;color:#FFF;transition:color linear 0.15s;cursor: pointer;}
.menu .menu-logo {width:0px;margin: auto;}
.menu .menu-logo a {color: #000;}
.menu a:hover {text-decoration:none;color:#F00;}
.menu a:hover .menu_line  {background:#FFF;}
.toggle-nav {display: none;}

.icon-bar {display:block;width:22px;height:2px;margin:5px 0 0;border-radius:1px;background:#FFF !important;}

.menu ul li a {flex-direction:row;justify-content:space-around;flex-wrap:wrap;position:relative;}
.menu ul div {display:flex;flex-direction:row;justify-content:space-around;flex-wrap:wrap;}
.menu ul li {height:auto;margin:15px 0;}
.menu_inner {width:100%;/*height:30px;*/line-height:30px;margin:0;font-size:20px;text-align:center !important;/*font-family: 'Anton', sans-serif;*//*transform:rotate(-90deg);*/box-sizing:border-box;}
.menu_line {width:90%;height:1px;margin:0 auto;background:#FFF;box-sizing:border-box;}
.menu_num {width:100%;height:30px;line-height:38px;margin:0;box-sizing:border-box;}
.current-active .menu_line {width:90%;background:#000;}
.current-active a:hover .menu_line {background:#000;}
.current-active .menu_num ,.current-active .menu_inner {color:#F00;}
/*.current-active {background:#F00;}*/
@keyframes move {
  0% {
    transform:scaleY(0);
  }
  100% {
    transform:scaleY(1);
  }
}

@media screen and (max-width: 767px) {
    .menu {width:100%;height:45px;display:grid;/*position:fixed;*/}
    .menu::before {content:"";width:100%;height:45px;}
    .menu ul.active {display: none;}
    .menu ul {width:calc(100vw + 45px);height:auto;top:46px;border:none;z-index:10001;/*position:fixed;*/position:inherit;}
    .menu li {display: block;width:100%;height:auto !important;margin:0 !important;padding:20px 0 15px;;color:#FFF;border-bottom:1px solid #888;border-left:0;background:none;}
    .menu li a {height:auto;color:#FFF;}
    .menu li a:hover {color:#FFF;}
    .menu ul li a div {display:block;}
    .menu a {display: block;}
    .toggle-nav {width:26px;height:26px;padding:10px;line-height:46px;right:0;position:absolute;}
    .icon-bar {display:block;width:22px;height:2px;margin:5px 0 0;border-radius:1px;background:#F00 !important;}

    .menu .menu-logo {position: relative;}

    .menu_bg {width:100%;height:auto;background:rgba(21 ,20 ,16 ,.9);}
    .menu_inner {width:100%;height:60px;line-height:40px;margin:0;padding:10px;font-size:30px;text-align:left !important;/*transform:rotate(0)*/;-webkit-writing-mode:inherit;writing-mode:inherit;left:20px;position:inherit;}
    .menu_inner::before {content:"";width:15px;height:2px;background:#FFF;top:25px;left:-25px;position:absolute;}
    a:hover .menu_inner {left:25px;transition: all 0.3s ease-out;}
    a:hover .menu_inner::before {width:20px;background:#FFF;transition: all 0.3s ease-out;}
    .menu_line {display:none !important;}
    .menu_num {display:none !important;}

    .current-active {background:#F00 !important;}
    .current-active .menu_inner::before {background:#FFF;}
    .current-active a:hover .menu_inner::before {background:#FFF;}
    .current-active .menu_num ,.current-active .menu_inner {color:#FFF;}

}
.navFixed {position:fixed;margin-top:0;border-bottom:1px solid #F00;background:#000;transition:opacity .5s ease-out;}


@media screen and (min-width:1491px) {
.wrapper {width:100%;background:url(bg0.jpg) center 40px no-repeat;}
.tablet ,.mobile {display:none;}
.main_title {width:881px;height:521px;left:-440px;margin: 0 0 0 50%;}
.main {width:1200px;height:700px;}

.title_pc {width:1200px;margin:0 auto;}
.title_m {display:none;}
.main_list {width:1100px;height:auto;padding:20px auto 0;}
.main_list li {width:24%;height:auto;margin:5px 0.5%;}

.pro_list {width:1100px;height:auto;margin:20px auto 60px;padding:30px 20px;}
.pro_list li {width:24%;height:auto;margin:5px 0.5% 0;}

.even li:nth-child(even) {margin-top:50px;}
.odd li:nth-child(odd) {margin-top:50px;}

/*info*/
.info_ul {width:1120px;}
}

@media screen and (min-width:1201px) and (max-width:1490px) {
.wrapper {width:100%;background:url(bg0.jpg) center 40px no-repeat;}
.tablet ,.mobile {display:none;}
.main_title {width:778px;height:475px;left:-430px;margin: 0 0 0 50%;}
.main {width:1200px;height:700px;}

.title_pc {width:1100px;margin:0 auto;}
.title_m {display:none;}
.main_list {width:1100px;height:auto;}
.main_list li {width:24%;margin:5px 0.5%;}
.pro_list {width:1100px;height:auto;margin:20px auto 60px;padding:30px 20px;}
.pro_list li {width:24%;height:auto;margin:5px 0.5% 0;}

.even li:nth-child(even) {margin-top:50px;}
.odd li:nth-child(odd) {margin-top:50px;}

/*info*/
.info_ul {width:1120px;}
}

@media screen and (min-width:1081px) and (max-width:1200px) {
.wrapper {width:100%;background:url(bg0.jpg) center 40px no-repeat;}
.tablet ,.mobile {display:none;}
.main {width:100%;height:auto;}

.title_pc {width:98%;margin:0 auto;}
.title_m {display:none;}
.main_list {width:94%;height:auto;margin:0 auto;padding:10px 5px;}
.main_list li {width:48%;margin:5px 1%;}
.pro_list {width:94%;height:auto;margin:20px auto 60px;padding:10px 10px 20px;}
.pro_list li {width:23%;margin:10px 1% 0;}

.even li:nth-child(even) {margin-top:50px;}
.odd li:nth-child(odd) {margin-top:50px;}

/*info*/
.info_ul {width:90%;}
}

@media screen and (min-width:768px) and (max-width:1080px) {
.wrapper {width:100%;}
.tablet {display:block;}
.desktop ,.mobile {display:none;}
.main_title {width:249px;height:370px;top:30px;left:100px;}
.t_sub1 ,.t_sub2 ,.t_btn {display:none;}
.main_title img {display:none;}
.menu_inner {font-size:15px;}

.title_pc {width:89%;margin:0 auto;}
.title_m {display:none;}
.main_list {width:98%;height:auto;padding:10px 5px;}
.main_list li {width:48%;margin:5px 1%;}
.pro_list_bg {padding:60px 0 0;}
.pro_list {width:98%;height:auto;margin:20px auto 0;padding:5px 10px 15px;}
.pro_list li {width:23%;margin:10px 1% 0;}
.pro_list li p b {font-size:23px;}
.main_list>p ,.pro_list>p {font:40px/104px "微軟正黑體", Arial;}

/*info*/
.info_ul {width:90%;}

}

@media screen and (min-width:601px) and (max-width:767px) {
.wrapper {width:100%;}
.tablet ,.light ,.desktop {display:none;}
.mobile {display:block;}
.t_sub1 ,.t_sub2 ,.t_btn {display:none;}
.main_title ,.slide ,.shading {display:none;}
.t_sub7 {display:none;}

.menu_inner {font-size:18px;}
.title_pc {width:90% !important;margin:10px auto 0;}
.title_pc img {width:100%;}
.main_list {width:98%;height:auto;padding:10px 5px 0;}
.main_list li {width:48%;margin:5px 1%;}
.pro_list_bg {padding:60px 0 0;}
.pro_list {width:96%;height:auto;margin:20px auto 0;padding:15px 20px 30px;}
.pro_list li {width:48%;margin:10px 1% 0;}
.main_list>p ,.pro_list>p {font:40px/104px "微軟正黑體", Arial;}

/*info*/
.info_ul {width:90%;margin:0 1% 60px;}

}

@media screen and (min-width:421px) and (max-width:600px) {
.wrapper {width:100%;}
.tablet ,.light ,.desktop {display:none;}
.mobile {display:block;}
.t_sub1 ,.t_sub2 ,.t_btn {display:none;}
.main_title ,.slide ,.shading {display:none;}
.t_sub7 {display:none;}

.menu_inner {font-size:18px;}
.title_pc {width:90% !important;margin:0 auto;}
.title_pc img {width:100%;}
.main_list_bg {padding:60px 0 0;}
.main_list {width:98%;height:auto;padding:10px 5px 0;}
.main_list li {width:48%;margin:10px 1%;}
.main_list li:nth-child(even) {top:auto;}
.pro_list_bg {padding:60px 0 0;}
.pro_list_bg > .title_pc {width:100%;}
.pro_list_bg > .title_pc > p {width:90%;height:60px;font:30px/60px "微軟正黑體", Arial;}
.pro_list {width:94%;height:auto;margin:10px auto 2%;padding:10px 20px 20px;}
.pro_list > .title_pc {top:-30px;}
.s1 {background:#90e6b5;}
.s2 {background:#fbd024;}
.pro_list li {width:48%;margin:10px 1% 0;}
.pro_promo {font-size:15px;}
.pro_list li p {font-size:15px;}
.pro_list li p b {font-size:20px;}
.main_list>p ,.pro_list>p {font:30px/104px "微軟正黑體", Arial;}

/*info*/
.info_bg {margin:0 auto;}
.info_ul {width:90%;margin:20px 5%;}
.title_bg {width:60%;margin:0 auto;}
.title_bg img {width:100%;}

}

@media screen and (max-width:420px) {
.wrapper {width:100%;}
.tablet ,.light ,.desktop {display:none;}
.mobile {display:block;}
.t_sub1 ,.t_sub2 ,.t_btn {display:none;}
.main_title ,.slide ,.shading {display:none;}
.t_sub7 {display:none;}

.menu_inner {font-size:18px;}
.title_pc {width:90% !important;}
.title_pc img {width:100%;}
.main_list_bg {padding:60px 0 0;}
.main_list {width:100%;height:auto;padding:10px 0 0;}
.main_list li {width:48%;margin:10px 1%;}
.main_list li:nth-child(even) {top:auto;}
.main_list li p:last-child::before {margin:0 5px 0 0;padding:3px 5px 1px;border-radius:3px;font-size:11px;line-height:11px;}
.main_list li p b {font-size:25px;line-height:25px;}

.pro_list_bg {padding:60px 0 0;}
.pro_list_bg > .title_pc {width:100%;}
.pro_list_bg > .title_pc > p {width:90%;height:60px;font:30px/60px "微軟正黑體", Arial;}
.pro_list {width:94%;height:auto;margin:10px auto 2%;padding:0 5px 10px;border: 3px solid #F00;}
.s1 {background:#90e6b5;}
.s2 {background:#fbd024;}
.pro_list li {width:48%;margin:10px 1% 0;}
.pro_promo {font-size:15px;}
.pro_list li p {font-size:15px;}
.pro_list li p b {font-size:20px;}
.main_list>p ,.pro_list>p {font:30px/104px "微軟正黑體", Arial;}

/*info*/
.info_bg {margin:0 auto;}
.info_ul {width:90%;margin:20px 5%;}
.title_bg {width:60%;margin:0 auto;}
.title_bg img {width:100%;}


}