@charset "utf-8";

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

/*隱鑶*/
.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){
 /*.pc_bg {  z-index:-1;pointer-events: none;position: absolute; margin: 0 auto;left: 50%;transform:translateX(-50%);}*/
 .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; }
 .bg_02 { z-index:-8; position:absolute; top:1500px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none; }
 .bg_03 { z-index:-8; position:absolute; top:3000px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none; }
 .bg_04 { z-index:-8; position:absolute; top:4500px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none; }
 .bg_05 { z-index:-8; position:absolute; top:6000px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none; }
 .bg_06 { z-index:-8; position:absolute; top:7500px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none; }
 .bg_07 { z-index:-8; position:absolute; top:9000px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none; }
 .bg_08 { z-index:-8; position:absolute; top:10500px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none; }
 .bg_09 { z-index:-8; position:absolute; top:12000px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none; }
 .bg_10 { z-index:-8; position:absolute; top:13500px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none; }
 .bg_11 { z-index:-8; position:absolute; top:15000px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none; }
  .pc_bg_deco{  position:absolute; top:800px;  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;}
 .Area04 .bg_pd{ z-index:-3; position:absolute; top:50px;  margin: 0 ;left: 50%;transform:translateX(-50%); width:2000px; height:4108px; background-repeat:no-repeat; 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 {margin: 0 auto; }
    @media screen and (max-width:767px){
      .title {position: absolute; top:5vw; 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:792px; }
.Area_top .top { z-index:0; position:absolute; top:0; left: 50%; transform:translateX(-50%);  margin:0; width:2000px; height:1500px; background-repeat:no-repeat; background-position:center top; }
@media screen and (max-width:767px){
.Area_top { position:relative; height:46vw;}
.Area_top  .top { z-index:0; position:absolute; top:0; left: 50%; transform:translateX(-50%);  margin:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center top;}
 }


.sp {position: relative; margin: 0 auto; width:100%; padding-top: 0; }
 @media screen and (max-width:767px){
.sp {position: relative; margin: 0 auto; width:92%; padding-top: 0; }
 }

/*01-攻略*/
.Area_act { position:relative; height:100%; padding-bottom:90px;  }
 @media screen and (max-width:767px){
  .Area_act { position:relative; height:100%; padding-bottom: 10vw; }
 }


/*Area02*/
.Area02 { position:relative; height:100%; padding-bottom: 90px; }
.Area02 .PD_layout { position: absolute; top:129px; left: 205px;}
.Area02 .PD_layout ul {width: 847px; padding:0; margin:0;   }
/*.Area02 .PD_layout ul {background-color: transparent}*/
 @media screen and (max-width:767px){
 .Area02 { position:relative; height:100%;  padding-bottom:9%;}
.Area02 .PD_layout { position: absolute; top:11vw; left: 16vw;}
.Area02 .PD_layout ul {width: 90%; padding:0; margin:0;   } 
 }



/*03-登記*/
.Area03 { position: relative; height:100%; padding-bottom: 90px;}
.Area03 .layout_bg { position: absolute; top:0; left:101px; z-index:-1;  pointer-events: none; }
 @media screen and (min-width:767px){
.Area03 .Area_danji.first { padding-top:107px;  }
.Area03 .Area_danji.second { }	
}
 @media screen and (max-width:767px){
.Area03 { position: relative; width: 100%; height:100%;  padding-bottom:14%; }
.Area03 .layout_bg {width:100%;  position: absolute; top:0; left:0; z-index:-1;  pointer-events: none; }
.Area03 .Area_danji.first { padding-top:10%;  }	 
.Area03 .Area_danji.second { }	
 }


/*04*/
.Area04 { position: relative;height:100%; padding-bottom: 90px; }
@media screen and (max-width: 767px){
.Area04 {position: relative; width:100%; height:100%; padding-bottom:6%; }
}


/*05*/
.Area05 { position: relative;height:100%; padding-bottom: 90px; }
.Area05 .PD_layout ul { width:1015px; border-width: 0.4rem;  border-style: solid;  border-color: transparent;  border-radius: 2rem;  background-image: linear-gradient(white, white), linear-gradient(to bottom right, #deb860, #fff3b0, #deb860);  background-clip: padding-box, border-box;  background-origin: padding-box, border-box;   }
@media screen and (max-width: 767px){
.Area05 {position: relative; width:100%; height:100%; padding-bottom:9%; }
.Area05 .title img { width: 47%}
.Area05 .PD_layout { padding-top: 15vw; }
.Area05 .PD_layout ul { width: 92%; padding:0; margin:0 auto; border-width: 0.3rem;   border-radius: 1.2rem; }
	
}


/*06*/
.Area06 { position: relative;height:100%; padding-bottom: 90px; }
.Area06 .PD_layout ul { width:1015px; border-width: 0.4rem;  border-style: solid;  border-color: transparent;  border-radius: 2rem;  background-image: linear-gradient(white, white), linear-gradient(to bottom right, #deb860, #fff3b0, #deb860);  background-clip: padding-box, border-box;  background-origin: padding-box, border-box;   }
@media screen and (max-width: 767px){
.Area06 {position: relative; width:100%; height:100%; padding-bottom:9%; }
.Area06 .title img { width: 47%}
.Area06 .PD_layout { padding-top: 15vw; }
.Area06 .PD_layout ul { width: 92%; padding:0; margin:0 auto; border-width: 0.3rem;   border-radius: 1.2rem; }
}



/*07*/
.Area07 { position: relative;height:100%; padding-bottom: 90px; }
.Area07 .new { width: 930px; margin: 0 auto; display: flex; justify-content: center; flex-wrap: nowrap; }
.Area07 .new a { padding-right: 30px;}
@media screen and (max-width: 767px){
.Area07 {position: relative; width:100%; height:100%; padding-bottom:9%; }
.Area07 .title {position: relative; padding-bottom:3%; }	
.Area07 .title img { width: 33%}
.Area07 .new { width:90%; margin: 0 auto; display: flex; justify-content: center; flex-wrap: nowrap; }
.Area07 .new a { padding-right:1%;}	
}



/*08*/
.Area08 { position: relative;height:100%; padding-bottom: 90px; }
@media screen and (max-width: 767px){
.Area08 {position: relative; width:100%; height:100%; padding-bottom:9%; }
.Area08 .sp {width:90%; }	
}


/*09-旗艦館*/
.Area09 { position: relative; height:100%; padding-bottom: 90px; }
.Area09 .guan {display: flex; flex-wrap: nowrap; justify-content: center; }
.Area09 .guan a {margin:20px; }
 @media screen and (max-width:767px){
.Area09 { position: relative; width: 100%; height:100%; padding-bottom:9%; }
.Area09 .guan {  width:100%; margin:0; padding-left:0%;}
.Area09 .guan a { float:left;  margin: 0%;  } 	
.Area09 .guan a img {width:90%}	 
 }



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