@charset "UTF-8";
html {
  font-family: "Noto Sans TC", "Roboto", "微軟正黑體", "Helvetica", "黑體-繁", "Heiti TC", sans-serif;
  color: #000; }

/* colors */
h1 {
  font-size: 2.588rem;
  font-weight: 900; }
  h1 span {
    display: inline-block; }

h2 {
  font-size: 1.625rem;
  font-weight: 400; }

h3 {
  font-size: 1.375rem;
  font-weight: 700;
  color: #db3116; }

p {
font-size: 1.2rem;	
  line-height: 1.875rem; }

@media (max-width: 991px) {
  h1 {
    font-size: 1.875rem; } }
@media (max-width: 767px) {
  h1 {
    font-size: 1.625rem; }

  h2 {
    font-size: 1.125rem; } }
.cpT {
  width: 150px; }
  @media (max-width: 991px) {
    .cpT {
      width: 120px; } }
  @media (max-width: 767px) {
    .cpT {
      width: 110px; } }
.fbT {
  width: 60px; }
  @media (max-width: 991px) {
    .fbT {
      width: 51px; } }
  @media (max-width: 767px) {
    .fbT {
      width: 45px; } }
/* bootstrap alter */
.navbar {
  background: url("../images/nav-bkg.jpg") no-repeat;
  background-size: cover;
  padding: 1.125rem 1.5rem 0.8rem;
  font-size: 1.063rem; }

.navbar-dark .navbar-nav {
  margin: 0rem 1.1rem; }
  .navbar-dark .navbar-nav .nav-link {
    color: white;
    padding-right: 0.875rem;
    padding-left: 0.875rem; }
.navbar-dark .shop {
  position: absolute;
  right: 1.250rem;
  top: 1.65rem;
  display: block;
  color: #ffeb6e;
  text-decoration: none; }
  .navbar-dark .shop img {
    width: 1.875rem;
    margin-left: 3px; }

.card {
  border-radius: 0;
  border: 0;
  margin-bottom: 10px; }
  .card .card-header {
    border-radius: 0;
    color: #fff06f;
    font-size: 1.250rem;
    font-weight: 700;
    background-color: #8a5725; }
  .card .card-body {
    padding: 30px 35px 20px;
    background-color: #fffadd; }
    .card .card-body h4 {
      font-size: 1.250rem;
      font-weight: 700;
      color: #de7d00; }
    .card .card-body h5 {
      font-size: 0.938rem;
      font-weight: 700;
      color: #006699; }
    .card .card-body p {
      font-size: 0.875rem;
      text-align: left;
      line-height: 1.250rem;
      margin-top: 5px; }

/* */
#header {
  width: 100%;
  position: relative;
  overflow: hidden;
  margin-top: 4.4rem; }
  #header #headerL {
    position: relative; }
    #header #headerL .header-deco {
      width: 100%;
      position: absolute;
      top: 0; }
		.deco-50 {position: absolute;width: 90%; padding: 3% 0 0 37%;}
		.deco-sh{position: absolute;width: 80%; padding: 11% 0 0 15%;}
#headerM{display: none;}		
    @media (max-width: 991px) {
	#header {display: none; } 
	#headerM{display: block;padding-top: 2%;}
}
    @media (max-width: 767px) {
	#header {display: none; } 
	#headerM{display: block;padding-top: 2%;}
}

#title {
  z-index: 100;
  margin-top: -3rem;
  padding-top: 6rem;
  text-align: center; }
#title2 {
  z-index: 100;
  margin-top: -3rem;
  padding-top: 6rem;
  text-align: center; }
#title3 {
  z-index: 100;
  margin-top: -3rem;
  padding-top: 6rem;
  text-align: center; }
#title4 {
  z-index: 100;
  margin-top: -3rem;
  padding-top: 6rem;
  text-align: center; }

.btn-shopL {
  color: #fff;
  border-radius: 1.2rem;
  background: url("../images/btn-bkg.jpg");
  padding: 0.375rem 1rem;
  border: 0; 
cursor: pointer;
}
  .btn-shopL img {
    width: 1.813rem;
    margin-left: 3px; }

.price-fix-L {
  font-size: 1.125rem;
  margin-right: 0.750rem; }

.price-sale-L {
  font-size: 1.375rem;
  margin-right: 1.25rem; }
  .price-sale-L strong {
    color: #c60000;
    font-family: "Roboto";
    font-size: 1.750rem; }

.btn-shop {
  margin-top: 5px;
  font-size: 0.813rem;
  color: #fff;
  border-radius: 1.2rem;
  background: #d14000;
  padding: 0.27rem 0.8rem;
  border: 0;
cursor: pointer;
}
  .btn-shop img {
    width: 1rem;
    margin-left: 2px; }

.price-fix {
  font-size: 0.875rem;
  margin-right: 0.650rem; }

.price-sale {
  font-size: 0.875rem;
  font-weight: 700;
  margin-right: 1.25rem; }
  .price-sale strong {
    color: #c60000;
    font-family: "Roboto";
    font-size: 1.125rem; }

#page01-A {
  z-index: -1;
  margin-top: -4rem;
  background: url("../images/p1bkg-confetti.png") ,url("../images/p1bkg-p.jpg")  ;
	background-repeat:repeat,no-repeat;
	background-position:bottom left,bottom left;
	background-size: contain,contain;
  padding-top: 11rem; }
  #page01-A .a-text {
    position: relative;
 /*   background: rgba(246, 255, 226, 0.9);*/ }
  #page01-A img {
    position: absolute;
    left: 0;
    bottom: 0; }
  #page01-A p {
    padding: 2.2rem; }
  @media (max-width: 991px) {
    #page01-A {
      padding-top: 18rem; }
      #page01-A img {
        width: 50%;
        left: 50%;
        transform: translate(-50%, 0); } }
  @media (max-width: 767px) {
    #page01-A {
      padding-top: 13rem; }
      #page01-A p {
        padding: 10px; } }

#page01-B {
  position: relative;
/*  background: url("../images/p1bkg-sun.jpg") bottom left no-repeat,url("../images/p1bkg-sun2.jpg") bottom right no-repeat;
  background-size: auto;*/
  padding: 2rem; }
  #page01-B .leaf img {
    position: absolute;
    right: -1px;
    top: 4px;
    width: 50%;
}
  #page01-B .B-text {
    padding: 4rem 2rem 1rem; }
  @media (max-width: 991px) {
    #page01-B .leaf img {
      width: 65%;
      margin-top: -5%; }
    #page01-B .B-text {
      padding: 6rem 1.2rem 1rem; } }
  @media (max-width: 767px) {
    #page01-B {
      padding: 1.2rem 0; } }

#page01-C {
  position: relative;
  background: url("../images/p1bkg-soil.jpg") repeat;
  background-size: contain;
  padding: 60px 0; }
  #page01-C .quote {
    padding-top: 20px;
    color: #fff799;
    width: 60%;
    margin: 0 auto; }
    #page01-C .quote span {
      display: block;
      text-align: right; }

#page02-A {
  position: relative; }
  #page02-A .p2deco {
    position: absolute;
    z-index: -5; }
  #page02-A .deco03 {
    width: 200px;
    bottom: 0%;
    left: 4%; }
  #page02-A .intro {
    padding: 60px 20px 170px 20px; }
  #page02-A .org {
    width: 25%;
    left: 0;
    top: 3rem;
    margin-top: -3rem; }
  #page02-A .melon {
    width: 18%;
    right: 0;
    top: 0;
    margin-top: -6rem;
    text-align: right; }
  @media (min-width: 992px) {
    #page02-A .deco03 {
      left: 6%;
      width: 17%;
      bottom: 15%; }
    #page02-A .intro {
      padding: 60px 20px 60px 50px; } }
  @media (max-width: 767px) {
    #page02-A .org {
      top: 4rem; }
    #page02-A .melon {
      margin-top: -2.5rem; } }

#page02-B .carousel-trial {
  padding: 0 40px 0; }

.owl-theme .owl-nav [class*='owl-']:hover {
  background: rgba(0, 0, 0, 0.7);
  color: #FFF;
  text-decoration: none; }

#page02-C {
  background: url("../images/p3bkg-a.jpg") no-repeat top center;
  background-size: cover;
  padding: 3.125rem 0; }
  #page02-C .card-body {
    min-height: 270px; }
#page02-D {
  background: url("../images/p3bkg-b.jpg") no-repeat top center;
  background-size: cover;
  padding: 3.125rem 0; }
  #page02-C .card-body {
    min-height: 270px; }

#page03-A {
 	
  padding-top: 2rem; }
  #page03-A .p3-intro {
    padding: 1rem; }

#page03-B {
  position: relative;
  background: url("../images/p3bkg-green.jpg") repeat;
  background-size: contain;
  padding: 60px 0; }



.p4-p {
  margin: 1.5rem 11.250rem 0; }
  @media (max-width: 767px) {
    .p4-p {
      margin: 1.5rem 1.2rem 0; } }

#page04-A .bagset {
  padding: 0 25px 30px;
  background: url("../images/p4bkg-purple.jpg") no-repeat 0px 115px; }
  #page04-A .bagset .setinfo {
    margin: 1.5rem 3.5rem 0; }
    #page04-A .bagset .setinfo h2 {
      font-size: 1.563rem;
      color: #ffd800;
      font-weight: 700; }
    @media (max-width: 767px) {
      #page04-A .bagset .setinfo {
        margin: 1.5rem 0 0; } }
#page04-A .setItems {
  padding: 115px 0 0 35px; }
#page04-A .setT {
  margin: 0;
  color: #de7d00;
  font-weight: 700;
  line-height: 1.25rem; }
#page04-A .setP {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.5rem; }
@media (max-width: 767px) {
  #page04-A .setItems {
    padding: 35px 20px 0; } }

#page04-B {
  background: url("../images/p4bkg-yellow.jpg");
  padding: 3.125rem 0;
  margin-top: 2rem; }

#page05-A {
  margin-top: 1rem;
  position: relative; }
  #page05-A .setinfo {
    margin: 4rem 0 10rem; }
    #page05-A .setinfo h2 {
      font-size: 1.563rem;
      color: #de4900;
      font-weight: 700; }
    #page05-A .setinfo .p-green {
      line-height: 1.563rem;
      font-weight: 700;
      color: #359601; }
    #page05-A .setinfo .p-s {
      font-size: 0.875rem;
      line-height: 1.250rem; }
    @media (max-width: 767px) {
      #page05-A .setinfo {
        margin: 1.5rem 1.3rem 10rem; } }
  #page05-A span img {
    width: 80%;
    position: absolute;
    right: 0;
    bottom: 0; }

#page05-B {
  background: url("../images/p5bkg-blue.jpg");
	background-size: auto;
  padding: 3.125rem 0; }

#page03-B .card, #page04-B .card, #page05-B .card,#page01-C .card{
  border-top: 11px solid #006699;
  text-align: center; }
  #page03-B .card .card-body, #page04-B .card .card-body, #page05-B .card .card-body,#page01-C .card .card-body{
    min-height: 160px;
    padding: 25px 18px 20px; }
  #page03-B .card .price-fix, #page03-B .card .pric-sale, #page04-B .card .price-fix, #page04-B .card .pric-sale, #page05-B .card .price-fix, #page05-B  .card .pric-sale,#page01-C .card .price-fix{
   font-size: 0.875rem; }
  #page03-B .card button, #page04-B .card button, #page05-B .card button,#page01-C .card button {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translate(-50%, 0); }


/* footer */
.bottom a:link{font-size:13px;font-weight:bold;color:#FFF;text-decoration:none}
.bottom a:hover{font-size:13px;font-weight:bold;color:#FFF;background-color:#666666;text-decoration:underline}
.bottom a:visited{font-size:13px;font-weight:bold;color:#FFF;background-color:#666666;text-decoration:none}
.footer01{font-size:13px;font-weight:bold;color:#bd4d03;background-color:#fff;text-align:center;padding:20px 0 10px 0}
.footer02{font-size:13px;text-align:center;color:#000;line-height:24px;background-color:#fff}
.footer02 a:link{font-size:13px;text-align:center;color:#000;text-decoration:none}
.footer02 a:hover{font-size:13px;text-align:center;color:#000;text-decoration:underline}
.footer02 a:visited{font-size:13px;text-align:center;color:#000;text-decoration:none}
.bottom1{font-size:13px;font-weight:bold;color:#FFF;background-color:#3e3d43;height:35px;padding:20px 0 10px 0;text-align:center}
.footer011{font-size:13px;font-weight:bold;color:#fff;background-color:#3e3d43;text-align:center;padding:20px 0 10px 0}
.footer021{font-size:13px;text-align:center;color:#aaaaaa;line-height:24px;background-color:#222127}