/*@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css); cwTeXYen*/
@import url(//fonts.googleapis.com/earlyaccess/cwtexyen.css);

/*以下為共用*/
.setop { display: none }
/*.footer * { vertical-align: baseline; }*/

nav.mainButton { position: sticky; position: -webkit-sticky; top:0; width: 100%; background:#000 ; z-index: 10}
nav.mainButton ul { text-align: center; }
nav.mainButton ul li { display: inline-block; margin: 10px 0; padding: 0px 20px; font: 100 16px/16px "cwTeXYen"; color: #fff ; cursor: pointer; border-right: 1px solid #fff;
transition: .5s; -webkit-transition: .5s; }
nav.mainButton ul li:hover,
nav.mainButton ul li:hover a{ color: #fff200 }
nav.mainButton ul li img { vertical-align: top }
nav.mainButton ul li a,
nav.mainButton ul li a:link { font: 100 16px/16px "cwTeXYen"; color: #fff; }

.pageContainer {margin: 0;padding: 0; width: 100%;height: auto;overflow-y: hidden; overflow-x: hidden;  }
.pageContainer * {vertical-align: top;}
.topBanner h1 {margin:0; padding: 0; text-align: center;}

.width1440px { margin: 0 auto; width: 90%;max-width: 1440px; }
.width900px { margin: 0 auto; width: 90%;max-width: 900px; }
.width1200px { margin: 0 auto; width: 90%;max-width: 1200px; }

h2 img { width: 90%; max-width: 740px  }
.box1 { position: relative; }
.text {position: absolute; background: rgba(0,0,0,0.8); z-index: 2 }
.text.textRight {top:0; right: 0; padding: 20px; width: 50%; height: 100%;  }
.text.textRight.small {width: 40%; } 
.text.textBottom { width: 100%; bottom: 0; left: 0; }
.text img { width: 100%; }
h3 { font: 500 26px/40px "cwTeXYen"; color: #fff  }
h4 { font: 500 24px/30px "cwTeXYen"; color: #fff  }
p { font: 300 18px/24px "cwTeXYen"; color: #fff; text-align: left; letter-spacing: 0px }
h3.black,
p.black { color: #000 ; }
h3.yellow,
h4.yellow,
p.yellow { color: #fff200 }
p.big { font-size: 20px }

.box3 > div {display: inline-block; position: relative; margin: 0.5%; width: 32%; height: auto; letter-spacing: normal; overflow: hidden; }
.box2 > div {display: inline-block; position: relative; width: 50%; height: auto; letter-spacing: normal; }
.box5 > div {display: inline-block; position: relative; padding: 1%; width: 20%; height: auto; letter-spacing: normal; }
.box4 > div {display: inline-block; position: relative; padding: 1%; width: 25%; height: auto; letter-spacing: normal; }

.box1 img,
.box3 img,
.box4 img,
.box5 img { margin:0; padding: 0; width: 100%; }



.hoverHide .thisHide,
.hoverHide.thisHide {-webkit-transition: .5s; transition: .5s; }

.hoverHide:hover .thisHide,
.hoverHide:hover.thisHide { opacity: 0; }


.buyButtonBase { position: fixed; top:40%; right: 0; width: 140px; text-align: center; /*background: #d80056;*/ transition: .5s;-webkit-transition: .5s; z-index: 99; }
.buyButtonBase a,
.buyButtonBase a:link { width: 100%; font: 100 20px/1.4em "cwTeXYen"; color: #fff; text-align: center; letter-spacing: -1px; vertical-align: baseline; }

.contentButtonBase { margin:20px auto; padding: 0 10px; width: 250px; text-align: center; /*background: #d80056;*/transition: .5s;-webkit-transition: .5s; z-index: 99; }
.contentButtonBase a,
.contentButtonBase a:link { width: 100%; font: 100 20px/1.4em "cwTeXYen"; color: #fff; text-align: center; letter-spacing: -1px; vertical-align: baseline; }
.contentButtonBase a img { margin-top: 5px; }

.buyButtonBase:hover,
.contentButtonBase:hover { background:#0000d8 }

.topBanner { position: relative; padding: 0; width: 100%; height: 100vh; 
	/*background: url(../page_fuji/images/bg_header2.jpg) top center no-repeat;background-size: 100%*/ background: transparent;}
.contentBase { padding: 0;text-align: center; overflow: hidden; }
.contentBase.paddingTop { padding: 40px 0; }

/*傾斜*/
.coverRight { display: inline-block;  width: 46%;  z-index: 10;
 background:url(../images/bg_header_man.png) top left no-repeat; background-size: auto 100%  }
.contantLeft { display: inline-block; padding-top: 3%;  width: 54%; text-align: center; z-index: 10; }

.coverLeft { display: inline-block;  width: 46%;  z-index: 10; 
 background:url(../images/bg_header_01.png) top right no-repeat; background-size: auto 100%  }
.contantRight { display: inline-block; padding-top: 3%;  width: 54%;text-align: center; z-index: 10; transform: translateX(-5%); }


.c26buy {display: inline-block; padding:5px 20px;font: 100 20px/1.4em "cwTeXYen"; color: #fff; background: #d80056; transition: .5s; -webkit-transition: .5s;}
.c26buy:hover {color: #000; background: #fff200;  }


/*小動畫設定*/
.mouseBase { display: inline-block; position: relative; margin: 50px 0 0 0; width: 30px; height: 60px; border:3px solid #fff ; box-shadow:0px 0px 10px rgba(0,0,0,0.5); border-radius: 99em; }
.mouseBase .mouseMov { display: inline-block; position: absolute; top: 8%; left:40%; width: 6px; height: 16px; box-shadow:0px 0px 10px rgba(0,0,0,0.5); border-radius: 99em; background: #fff;
-webkit-animation: mouseMov 1s  infinite alternate; }
@-webkit-keyframes mouseMov {
  from { top: 8%; }
  to { top: 30%; }
}

@media only screen and (max-width: 930px) {
.text.textRight,
.text.textRight.small { position: static; top:0; right: 0; padding: 2% 4%; width: 100%; height: auto;  }	

.box1 { margin:0 auto 5% auto; }
.box3 > div { display: inline-block; margin:0 0.5% 5% 0.5%; width: 29%; }
.box5 > div { width: 50%; } 
.box4 > div { width: 50%; } 

h3 { font: 500 20px/1.6em "cwTeXYen"; color: #fff  }
p { font: 100 16px/1.4em "cwTeXYen"; color: #fff; letter-spacing: -1px }

}

@media only screen and (max-width: 768px) {
nav.mainButton { position: sticky; position: -webkit-sticky; top:0; z-index: 10; width: 100%; overflow: hidden;overflow-y: hidden; overflow-x:auto;-webkit-overflow-scrolling: touch;overflow-scrolling: touch; }
nav.mainButton ul {position:relative; z-index: 10; padding: 0 0px; white-space:nowrap; width:auto; }	
.buyButtonBase { position: fixed; top: calc(100vh - 60px) ; right: 0; width: 100%; height: 60px} 

/*傾斜*/
.coverRight,
.coverLeft { display: none;   }
.contantLeft,
.contantRight { display: block; padding-top: 3%;  width: 100%; text-align: center; z-index: 10; transform: translateX(0);}

.box1 { margin:0 auto 5% auto;width: 80%; }
.box3 > div,
.box4 > div,
.box5 > div { display: inline-block; margin:0 auto 5% auto; width: 90%; }
 
.buyButtonBase a,
.buyButtonBase a:link { line-height: 64px; } 
}

@media only screen and (max-width: 500px) {
.mouseBase { transform: translateY(-50%) scale(0.8) ; }
}



/*以下為富士山專屬*/
/*富士山共用*/
#fuji .bgWhite {  background: url(../images/bg_white.jpg) top center repeat-y; }
#fuji .bgBlue { background: url(../images/bg_repeatblue.jpg) top center no-repeat; }
#fuji .bgBlack { background: #000 }
#fuji .bgPhoto2 { padding: 5% 0; height: auto; } 
.height100 { min-height: 100vh }

/*富士山DOM自訂*/
#fuji .toTop { margin-top: 0px ; width: 100%; max-width: 1004px }
@media only screen and (max-width: 930px) {
#fuji .toTop { margin-top: 0; }
}


/*富士山DOM*/


#fuji h1 {transform: translateX(10%); }
#fuji h1 img { width: 80%; max-width: 664px;  }
/*#fuji .contentBase { padding: 20px 0 100px 0; text-align: center; }*/


#fuji .fujiMain { margin-top: 5% ;display: flex; flex-wrap: wrap;justify-content: center;gap: 12px;}
#fuji .fujiMain .button { padding:1%; width: 45%; border-radius: 10px;
	letter-spacing: normal; background: #d80056; cursor: pointer;  }
#fuji .fujiMain strong { display: block; /*margin-top: 20%;*/ font: 700 40px/40px "cwTeXYen"; color: #fff; letter-spacing: -1px;  }
#fuji .fujiMain p { display: block; margin:10px 0 0 0; padding: 0 5%; font: 500 22px/26px "cwTeXYen"; color: #fff; text-align: center; letter-spacing: -1px;  }


/*C26 use*/
/* .group-type-ph{ display: block; text-align: center;}

.ph { display: block; position: relative; margin: 0 auto; width: 300px; height: auto; vertical-align: top;  letter-spacing: normal; }
.ph .ph-img {  margin: 0 0px 0 0 ; overflow: hidden; }
.ph .ph-img img {  height: auto; width:100%; min-width: 300px; height: auto; min-height: 200px; display:block;margin:0 auto; }
.ph .ph-title {padding:10px 10px 0 10px; font: bold 18px/24px "arial","微軟正黑體"; color: #2a2a2a; vertical-align: middle; background: rgba(255,255,255,0.8);}
.ph .ph-detail,
.ph .ph-feature { margin:0;padding:10px;font: 14px/20px "arial","微軟正黑體"; color: #2a2a2a; text-align: left; vertical-align: middle; background: rgba(255,255,255,0.8);}
.ph .price { display: block; width: 100%; margin: 0; padding-bottom: 15px; font: bold 18px/26px "arial","微軟正黑體"; text-align: center; color:#ff9900; background: rgba(255,255,255,0.8);}
.ph .price span {margin: 0; padding: 0; font: bold 26px/6px "arial","微軟正黑體";color:#ff9900; } */



@media only screen and (max-width: 1085px) {
#fuji .fujiMain .button {  padding: 0.5%;width: 45%; height: auto;background-size: 100%;  }


}

@media only screen and (max-width: 930px) {
#fuji .topBanner { }

#fuji .contentBase { }

#fuji .fujiMain strong { font: 700 30px/30px "cwTeXYen"; letter-spacing: normal;   }
#fuji .fujiMain p { font: 500 16px/20px "cwTeXYen";  }
}

@media only screen and (max-width: 768px) {
#fuji h1 {transform: translateX(0); }
#fuji .height100 { min-height: auto; }
#fuji .fujiMain .button {  }
#fuji .fujiMain p { margin:2% 0 0 0;}

.ad { display:block; position: fixed; bottom: 0; left:0; width: 100px; }
.ad img { width: 100%; }

}

@media only screen and (max-width: 580px) {
#fuji .fujiMain { margin:5% 0 0 0; }
#fuji .fujiMain .button { border-radius: 20px; }
#fuji .fujiMain strong { font: 500 24px/24px "cwTeXYen"; letter-spacing: normal; }
#fuji .fujiMain p { display: none; }
}


.ph-menu{display: none;}

.ph .ph-group{max-width: 1400px;margin: 0 auto;text-align: center;display: flex;flex-wrap: wrap;justify-content: center;}
.ph .ph-group-content{margin: 10px 10px;transition: 0.2s;padding: 0px; width: 100%;background:rgba(0,0,0,0.9);box-shadow: 0 0 5px rgba(0,0,0,0.3);display: flex;flex-wrap: nowrap;}
.ph .ph-group-content-photo {display: block;width: 50%;position: relative;}
.ph .ph-group-content-photo img{width: 100%;object-fit: cover;height: 100%;}
.ph .ph-group-content-text{padding: 20px 20px 50px 20px;flex-grow: 1;width: 50%;position: relative;}

.ph .ph-group-content-text-name{color:#fcff58;font:bold 24px/1.4 "cwTeXYen";margin: 10px auto;display: block;border-bottom: 1px solid #fcff58;padding:10px 0;}
.ph .ph-group-content-text-detail{color:#fff;font:16px/2 "cwTeXYen" ;/*padding: 5px 10px 10px 10px;*/;}
.ph .ph-group-content-text-detail a {color:#fff;}
.ph .ph-group-content-text-price {color:#000;position: absolute;padding: 5px 10px;font:600 24px/1.4 "cwTeXYen" ;text-align: center;display: block;right: 0px;bottom: 0px;width: 100%;background:#fcff58;}
.ph .ph-group-content-text-price span{font-size: 80%;line-height: 1.8;}
.ph .ph-group-content-tag {position: absolute;left: 0%; top: 15px; background:#fff ;font:15px/1.4 "cwTeXYen" ;color:#2c87dd;padding: 3px 10px;border-radius: 0 20px 20px 0;}
.ph .ph-group-content-text-sale{font: bold 20px/1.4 "cwTeXYen"; color: #ff5d9e;    /* padding: 0 10px;*/margin: 5px auto; }
.ph .ph-group-content-text-sale a {color: #ff5d9e;}

.ph-group-title {margin: 10px auto 0 auto;display: block;text-align: center;}
.ph-group-title span {font:bold 30px/1.6 "cwTeXYen";color:#fff;text-align: center;position: relative;}

@media only screen and (max-width: 1400px) {
  .ph .ph-group-content{width: 90%;}
  .ph .ph-group-content-photo{width: 60%;}
}

@media only screen and (max-width: 1000px) {

  .ph .ph-group-content-text-name{margin: 0px auto;font:bold 20px/1.4 "cwTeXYen";}
  .ph .ph-group-content{flex-wrap: wrap;}
  .ph .ph-group-content-photo{width: 100%;}
  .ph .ph-group-content-text{width: 100%;padding: 10px;}
  .ph .ph-group-content-text-price{position: static;}  
}


.bnad{
  max-width: 1162px;
  width: 95%;
  margin: 0 auto;

}
.bnad .bnadimg{
  position: relative;
  z-index: 0;
}
.bnad .golink{
  position: absolute;
  width: 300px;
  height: 40px;
  bottom: 36px;
  right: 225px;

}
.bnad .bnadtext{
  position: relative;
  z-index: 1;
  background: #003e81;
  color: #FFF;
  font-size: 16px;
  line-height: 1.6;
  padding: 12px;
  text-align: left;
}
.bnad .bnadtext a{

  color: #fcff4b;

}
.bnad .bnadtext b{
 display: block;
 margin: -26px auto 12px auto;
 font-size: 20px;

}
.bnad .bnadtext b span{
  background: #FFF;
  color:#003e81;
  border-radius: 20px;
  padding: 8px 16px;

 }
.bnad img{
  width: 100%;
}
.bnad img.pcOnly{
  display: block;
}
.bnad img.mobileOnly{
  display: none;
}


@media only screen and (max-width: 1226px) {

  .bnad .golink{

    width: 25vw;
    height: 4.5vw;
    bottom: 2vw;
    right: 17vw;
  
  }


}
@media only screen and (max-width: 800px) {
  .bnad{
    max-width: 1162px;
    width: 90%;
    margin: 0 auto;
  }
  .bnad img.pcOnly{
    display: none;
  }
  .bnad img.mobileOnly{
    display: block;
  }
  .bnad .golink{
    width: 47vw;
    height: 5.5vw;
    bottom: 6vw;
    right: 31vw;
  
  }
  .bnad .bnadtext{

    font-size: 14px;

  }

}


.event-content-table-title{
  color: #FFF;
  font: 700 30px/1.4 "cwTeXYen";
  margin:20px auto;
}
table.event-content-table * {vertical-align: middle !important; }
table.event-content-table {text-align: center;border:1px #3b000f solid;font-size: 16px;margin: 0 auto;text-align: center;background: #ffeec3;max-width: 1000px;margin-bottom: 40px;
width: min(1000px,90%);}
table.event-content-table tr td{padding: 10px 10px; border:1px #78011f solid;text-align: center;}
table.event-content-table tr:nth-of-type(1){background:#78011f;color:#fff; padding: 20px ;text-align: center;}