/*@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; }

.pc { display: block; }
.mo{ display: none }
.moImg { display:none; }
.pageContainer { width: 100%; overflow: hidden; }

.topBanenr { position: relative; width: 100%; height:100vh; background: url(../images/bg_top.jpg) top center no-repeat; background-size: auto 110%; }


.pageButton { background: #34b9a4; }
.pageButton ul { text-align: center; }
.pageButton ul li { display: inline-block; margin:10px 0; padding: 5px 10px; font: 500 24px/1em "cwTeXYen"; color: #fff; cursor: pointer; transition: .5s;-webkit-transition: .5s; }
.pageButton ul li:hover { color: #ffd100; }

.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 }



.contentBase { padding: 100px 0; text-align: center; }
h2 { display: inline-block; padding: 3px 20px; font: 700 30px/1em "cwTeXYen"; color: #fff; border:1px solid #fff; }
.bg_yellow { background: transparent; }
.bg_black { background: url(../images/bg_black.jpg) top center no-repeat; }
.bg_black p,
.bg_black h2,
.bg_black h3 { color: #fff !important; }
.bg_black h2 { border:1px solid #fff; }


.width1200px { margin:0 auto; width: 90%; max-width: 1200px; }

.box2 { margin-top: 40px; }
.box2 > div { display: inline-block; padding: 1%; width: 50%; letter-spacing: normal; }
.box3 > div { display: inline-block; padding: 0.5%; width: 33.33333%;letter-spacing: normal; } 
.box2 > div img { width: 100%; }

.box2 > div h3 { padding: 0; font: 700 24px/1.4em "cwTeXYen"; color: #fff; text-align: center; }
.box2 p { padding: 0; font: 500 18px/1.4em "cwTeXYen"; color: #fff; text-align: left; letter-spacing: normal; }
.box3 { margin-top:10px; }

@media only screen and (max-width: 1300px) {
.topBanenr { background: none; }	
.man { display: none; }
.main { display: none; }
.moImg { display: block; width: 100% }
.moImg img { width: 100%; }

.contentBase { padding: 5% 0; text-align: center; }
}


@media only screen and (max-width: 768px) {
.topBanenr { height: auto; }

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; }	

.pageButton ul li { margin:1% 0; padding: 1%;}

h2 { margin: 0 auto; padding: 1%; width: 90%; }
.box2 > div { display: block; margin: 0 auto; padding: 1%; width: 100%; }

.buyButtonBase { position: fixed; top: calc(100vh - 80px) ; left: 0; width: 80px; height: 80px} 
.buyButtonBase img { width: 100%; }
.buyButtonBase a,
.buyButtonBase a:link { line-height: 64px; } 
}

@media only screen and (max-width: 600px) {
.pageButton ul li { font-size: 18px; }
}