@charset "utf-8";

/*基本*/
body {margin: 0; padding:0; background:#fcf8ec }

/*隱鑶*/
.for_pc {}
.for_phone, .for_m { display:none !important;}
    @media screen and (max-width:767px){
      .for_pc { display:none !important;}
      .for_phone, .for_m { display: inherit !important;}
    }

/*全BOX版面*/
.WRAPPER { position: relative;margin: 0 auto; padding: 0;	width:100%; min-width:1220px; overflow: hidden;font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;}
.WRAPPER img { border:0; vertical-align:top;}
.WRAPPER a { text-decoration:none;  display:inline-block;}
.WRAPPER .mainArea { position:relative; display:block; margin:0 auto; padding: 0; width:1220px;}
    @media screen and (max-width:767px){
      .WRAPPER { width: 100%; padding-bottom:0px; margin:0 auto; display: block; min-width:100%; background-repeat:repeat-y; background-size:100% ;}
      .WRAPPER .mainArea { position:relative; display:block; margin:0 auto; padding: 0; width:100%;}
    }
ul {margin: 0; padding: 0}
li { list-style: none;}


/*PC背景*/
@media screen and (min-width:767px){
 .bg_01 { z-index:-8; position:absolute; top:0px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none; }

  .pc_bg_deco{  position:absolute; top:890px;  margin: 0 ;left: 50%;transform:translateX(-50%);width:2000px; height:14742px; background-repeat:repeat-y; background-position:center top; }
  .pc_bgtopre { z-index:-3; position:absolute; top:1300px;  margin: 0 ;left: 50%;transform:translateX(-50%);width:2000px; height:20000px; background-repeat:repeat-y; background-position:center top;}
  .pc_bottom{z-index:-3;  position:absolute; bottom:0px;  margin: 0 ;left: 50%;transform:translateX(-50%);width:2000px; height:725px; background-repeat:repeat-y; background-position:center top; }
	
} 


/*MB背景*/
.m_Area_bgtop{ z-index: -40;  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  pointer-events: none;}
.m_Area_bgtop .m_bgtop_ {position: absolute;  top: 0; left: 0 ;  width: 100%;  height: 100%;  padding-bottom: 100%;}


.title {position:relative; margin: 0 auto; }
    @media screen and (max-width:767px){
      .title {position:relative; top:0; left: 0vw; width: 100% }
      .title img { width:80% }
    }


/*我是CSS_momologo*/
.momologo { position:absolute; top:15px; left:20px; z-index:999; }
    @media screen and (max-width:767px){
      .momologo {position:absolute; width: 25%; top: 2.5vw; left:4vw; }
    }

/*版頭*/
.Area_top { position:relative; height:926px; }
.Area_top .logo { position:absolute; top:10px; left:0px; width: 1300px;}
.Area_top .contral a{margin:30px 25px 0;}
.Area_top .contral img{width:110px;}

.Area_top .flower { position:absolute; bottom:116px;right:-255px; }
.Area_top .pink { position:absolute; bottom:436px;right:462px; }
.Area_top .main { position:absolute; top:282px; left: -206px;  }
  @media screen and (max-width:767px){
  .Area_top { position:relative; height:97vw; }
  .Area_top  .main {position: absolute; top:13vw; left:0; width:100%; z-index: 1}
  .Area_top  .logo {position: absolute; top:2vw; left:0; width:100%; z-index: 1}
  .Area_top .contral {position: absolute; z-index: 1;padding:2vw 0;}
  .Area_top .contral a{margin: 0vw 2vw 0;}
  .Area_top .contral img{width: 10vw;}
  .Area_top .flower { position:absolute; bottom:2vw;right:-12vw;  }
  .Area_top .flower img{  width: 40%;  }
  .Area_top .pink { position:absolute; bottom:38vw;right:66vw;  }	  
  .Area_top .pink img{  width: 40%;  }
 }


/*01-攻略*/
.Area_act { position:relative; height:570px; }
.Area_act .layout_bg { position: absolute; top:0; left: 0; z-index:0;  pointer-events: noneone; }
.Area_act .act {position: relative; margin:0 auto; }
.Area_act .sw { margin: 0px 0 ;}
.Area_act .sw img { width: 100%;}
 @media screen and (max-width:767px){
  .Area_act { position:relative; height:100%;padding-bottom:10%; }
  .Area_act .Area_danji { width:96%; height: 61vw; }
  .Area_act .Area_danji.first {  position: relative; top:0vw; left:0;}	 
  .Area_act .act { position: absolute; top: 0; bottom:0; margin:52vw 0 0 0; padding: 0;  }	 
  .Area_act .act a { padding:0 ; margin: 0; width: 96%; } 	  
  .Area_act .sw{margin: 0 0.2vw; width: 100vw; overflow: hidden;}
  .Area_act .sw img {width: 96%;}
 
 }


/*03-主打品*/
.Area03 { position: relative; height:100%; padding-bottom:80px ;}
.Area03 .title { padding-top: 80px; }
.Area03 .layout_bg { position: absolute; top:0; left:-390px; z-index:-1;  pointer-events: none; }
.Area03 .pd { z-index: 5; margin: 0 auto; padding-top: 50px;}
.Area03 .pd a {margin-bottom:0px }
 @media screen and (max-width:767px){
.Area03 { position: relative; width: 100%; height:100%;  padding-bottom:5%; }
.Area03 .title { padding-top:0; margin: 0; }	 
.Area03 .pd { position: relative; padding-top:5vw; }
.Area03 .pd a { margin-bottom:6vw; width: 94%; }
 }



/*04*/
.Area04 { position: relative;  height:870px; }
.Area04_swiper{position: relative ;height: 740px;width: 1220px;    margin-bottom: 60px;}
.Area04_swiper .box{width: 1220px; overflow: hidden;}
.Area04_swiper .box li{ margin: 0 10px; min-width: 300px;}
.Area04 .layout_bg { position: absolute; top:178px; left:-125px; z-index:0;  pointer-events: none; }
.Area04 .PD_layout {margin-top: 115px; width: 1290px; margin-left: -62px; overflow: hidden; }
.Area04 .PD_layout ul{background-color: rgba(0, 0, 0, 0); }
.Area04 .PD_layout li{background-color: #fff;border-top: solid 1px #d1d1d1; border-right: solid 1px #d1d1d1; }
.Area04 .PD_layout { position: relative; top:0vw; left:0vw;  margin-top:155px; width: 100%;margin-left:0 }
.Area04 .PD_layout ul.PD_wrapper{position: relative; display: flex ; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; box-sizing: content-box; background-color: rgba(0, 0, 0, 0); grid-gap: 0 !important; }
 @media screen and (max-width:767px){
.Area04 { position: relative; width: 100%; height:80vw; padding-bottom:19vw;}
.Area04_swiper { position: relative; width: 100%; height:80vw; padding-bottom:19vw;}
.Area04 .PD_layout { position: relative; top:0vw; left:0vw;  margin-top: 0; width: 100%;margin-left:0 }
.Area04 .PD_layout ul.PD_wrapper{position: relative; display: flex ; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; box-sizing: content-box; background-color: rgba(0, 0, 0, 0); grid-gap: 0 !important; }
.Area04_swiper .box{width: 100vw; overflow: hidden;}
.Area04_swiper .box li{ margin: 0 10px; min-width: 300px;}
 }

.swiper-pagination-bullet-active {
    opacity: 1;
   background: #ab8e8e;
}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
    color: #d7b166;
}
.swiper-button-next, .swiper-button-prev{
  color: #d7b166;
}
/*Area06 錨點公版*/
.Area06 { position:relative; height:4502px; }
.Area06 .layout_bg { position: absolute; top:0px; left:0px; z-index: 0;  pointer-events: none; }
.Area06 .link {padding: 0 0 50px 0 }
.Area06 .link a:hover {filter: brightness(1.2);}
.Area06 .link a { width:187px;  padding:0.5% }
.Area06 .layout {  position:relative; width:1246px; height:600px; margin-bottom: 80px; }
.Area06 .PD_layout {padding:138px 0 0 0 ; width: 93%; }
.Area06 .Area_swiper_box .PD_layout ul {background-color: #FFF}
 @media screen and (max-width:767px){
 .Area06 { position:relative; height:100%; margin-bottom: -8vw; }
 .Area06 .link { position: relative; width:92%; padding: 0 0 5vw 4vw }	 
 .Area06 .link a { width: 30%; padding:0.5% }
 .Area06 .link a img {}
 .Area06 .layout_bg { position: absolute; top:0; left:0; z-index: -1;  pointer-events: none; }
 .Area06 .layout {  position:relative; width:100%; height:auto; margin-bottom:3vw; }
 .Area06 .PD_layout { padding:0vw 0 4vw 0; }	
.Area06 .Area_swiper_box .PD_layout ul {background-color: #FFF}	 
  }


/*輪播物件*/
.Area_topbn {}
.Area_topbn .box { width:100%; position: relative; overflow: hidden; margin: 0 0 0 8px;}
.Area_topbn .Area_swiper_box ul.PD_wrapper { position: relative; display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; box-sizing: content-box; background-color: rgba(0,0,0,0); grid-gap: 0!important; }
.Area_topbn .Area_swiper_box ul.PD_wrapper li { flex-shrink: 0; margin: 0; padding: 0; min-width: auto; background-color: #fff; border: none; border-radius: 10px;}
.Area_topbn .PD_layout .PD p .Price { font-size: 25px; }
@media screen and (min-width: 768px) {
.Area_topbn .Area_swiper_box ul.PD_wrapper { padding:0 106px 10px}	
	}
@media screen and (max-width: 767px) {
.Area_topbn  {}
.Area_topbn .box {width:100%;margin: 0 0 0 1vw;}
.Area_topbn .Area_swiper_box { width: 100%; }
.Area_topbn .Area_swiper_box ul.PD_wrapper {padding: 0 0 1vw;}
.Area_topbn .PD_layout .PD .Price { font-size:24px; }
.Area_topbn .PD_layout .PD p b, .Area_01 .PD_layout .PD p del, .Area_01 .PD_layout .PD p .money{ font-size:14px; }
.Area_topbn .PD_layout .PD p b{display: inline}
}



.swiper-pagination-bullet { margin: 0 3px;}
 @media screen and (max-width:767px){
.Area06 .sw1 .swiper-pagination  {width: 100vw;left: 50%; transform: translateX(-50%); top:60vw;}
.Area06 .sw2 .swiper-pagination  {width: 100vw;left: 50%; transform: translateX(-50%); top:60vw;}
.Area06 .sw3 .swiper-pagination  {width: 100vw;left: 50%; transform: translateX(-50%); top:60vw;}
.Area06 .sw4 .swiper-pagination  {width: 100vw;left: 50%; transform: translateX(-50%); top:60vw;}
.Area06 .sw5 .swiper-pagination  {width: 100vw;left: 50%; transform: translateX(-50%); top:60vw;}
.Area06 .sw6 .swiper-pagination  {width: 100vw;left: 50%; transform: translateX(-50%); top:60vw;}

 
 }


/*Area07 brand*/
.Area07 { position:relative; height:724px; }
.Area07  .layout_bg { position: absolute; width: 100vw;top:200px;  left: 50%; transform: translateX(-50%); z-index: -1;  pointer-events: none; }
.Area07 .PD_layout ul { background-color: transparent; }
.Area07 .PD_layout ul li {border: none; padding-bottom: 30px; }
 @media screen and (max-width:767px){
 .Area07 { position:relative; height:135vw;}
 .Area07 .PD_layout {position: absolute;  width: 100%;  }
 .Area07 .PD_layout ul { display: flex; flex-wrap: wrap;justify-content: center;}	 
 .Area07 .PD_layout ul li { padding-bottom: 1vw;  width:48%; }	
 .Area07 .PD_layout ul li img { }
 }


/**延遲載圖用**/
.mainArea .articleList * img.lazy {display:none;} 

