@charset "utf-8";
/*{ box-sizing:border-box;border:1px  #268A28 solid;}
/* CSS Document */
/* ---reset.css--- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {display: block;}
a {text-decoration:none;}
/* ---reset.css--- */

html, body{	
	font-family:Noto Sans JP,Noto Sans TC,Microsoft JhengHei,'Helvetica','verdana','Georgia','apple LiGothic Medium','arial','Courier','Times','Heiti TC';
	font-size:20px;
	line-height:20px;
	-webkit-text-size-adjust:none;
	box-sizing: border-box;
	scroll-behavior: smooth;}
@media screen and ( max-width: 768px ){
   html, body{ 
	background: url(../images/mbg_1.png) repeat;
    min-width: 320px;
	max-width: 768px;
    	width: 100%;}}


*{-webkit-box-sizing:border-box;box-sizing:border-box;}

:focus { outline: 0; }
h1{ text-indent:-9999px; position:absolute;}
a{text-decoration:none;}
img{ vertical-align:top;}


header{ width:100%; position:relative; z-index:999;display:block; background-color:#ea0000;}	
#tob {font-size: 12px;text-align:right;color:#fff;padding-right:5px;}
#tob a {color: #fff;text-decoration:none;border-bottom:0px;}
#tob a:hover {color:#fff;text-decoration:none;border-bottom:1px solid;}
.header_m{ display:none;}
	@media screen and ( max-width: 768px ){
		.eslite_footer{margin-bottom: 50px;}
		header{display:none;}
		.header_m{ width:100%; height:auto; position:relative; top:0; display:block; padding:5px 0; background-color:#ea0000;}
		.header_m img{ width:120%; height:auto; display:block; }
		#tob{ width:50%; font-size:70%}}
footer{ width:100%; position:relative; z-index:990; background-color:#ff9191;}

/* --通用-- */
.container{ max-width:1920px; overflow:hidden; min-width:1200px; margin:0 auto;}
.box_content{ width:1200px; margin:0 auto; padding:0 20px;}
.item_pc{ display:block;}
.item_m{ display:none;}
ul{ display:inline-block; overflow:hidden;}
li{ list-style:none; float:left; overflow:hidden;}
.title{margin:0 auto; text-align:center; height:4rem; margin-bottom:10px; background:url(../images/bg_theme1.png) no-repeat center;}
.box2 .box_content .title, .box3 .box_content .title{ background:url(../images/bg_theme2.png) no-repeat center; padding-top:30px;}
.title ul{ padding:30px 0;/*background: url(../images/bg_content1.png) top center repeat;*/}
.title ul li{ font-size:2.2rem; font-weight:bold; padding:0 15px;overflow:visible; text-shadow:#000;;text-shadow:-2px -2px 0 #000,2px -2px 0 #000,-2px 2px 0 #000,2px 2px 0 #000; color:#fff; letter-spacing:15px;}
.title p{-webkit-text-stroke: 2px #000;font-size:2.8rem; font-weight:900; padding:0 15px;overflow:visible;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000; color:#fff; letter-spacing:15px; }

.title ul li:last-child{border-right:none;}
h2{text-align:center; color:#053644; font-size:1rem;font-family:'Noto Serif TC','Microsoft JhengHei','Heiti TC';font-weight:500; letter-spacing:0.5px; padding:10px 10px; line-height:1.1rem; height:66px;align-items: center; vertical-align:middle; display:table-cell;}
.proname{font-family:'Noto Serif TC','Microsoft JhengHei','Heiti TC'; font-weight:normal;color:#777; font-size:0.75rem; padding:10px 10px 15px 10px;}	
.number{ color:#ba1f1f; font-size:1.4rem; font-family:'Century Gothic',Arial, Helvetica, sans-serif; font-weight:bold;}	
	@media screen and ( max-width: 768px ){
		.container{ width:100%; max-width:768px; min-width:320px; max-width:100vw;}
		.box_content{ width:96vw; padding:0px; }
		.item_pc{ display:none;}
		.item_m{ display:block;}
		.item_m img{ margin:0 auto; width:100%;}
		h2{font-size:0.8rem;}
		.title{ background:none; padding-top:2vw;}
		.proname{font-size:0.6rem;}	
        .number{font-size:1.2rem;}
		.title{ height:1.5rem; margin-bottom:30px; }
		.title ul li{ font-size:1.6rem;padding:0 10px;}

		.title ul{  padding:20px 0;}
		}
	@media screen and ( max-width: 540px ){	
			.title{ height:1rem; margin-bottom:30px; }
			.title ul li{ font-size:1.4rem;padding:0 8px;}
			.title p{ font-size:1.6rem;padding:0 10px;text-shadow:none; letter-spacing:2px;}
					.title ul{  padding:10px 0;}
.box2 .box_content .title, .box3 .box_content .title{ padding-top:5%; padding-bottom:2%;}
		.conten1{ padding-top:2vw;}
}



/* --誠品獨家-- */	
.ex_text{ position:absolute; top:5px; left:25px; font-size:0.9rem; width:1.8rem; color:#ffe970; font-weight:500;}
.ex_tag{ position:absolute; width:70px; top:-8px; left:15px;}
	@media screen and ( max-width: 768px ){
		.ex_tag{ position:absolute; width:72px; top:-8px; left:15px;}}
	@media screen and ( max-width: 540px ){
				.ex_tag{ position:absolute; width:60px; top:-8px; left:13px;}
				.ex_text{top:5px; left:23px; font-size:0.7rem; width:1.4rem; line-height:0.9rem;}}



/* --主視覺-- */
.kv{width:100%;background: url(../images/kv.jpg) top center no-repeat; height:416px; display:block;}	
.kv_content{ position:relative; max-width:1200px; margin:0 auto; height:416px;}
.kv_m{ display:none;}
.titleitem{position:absolute; z-index:99;}
.title01{top:135px; left:282px;}
.title02{top:158px; left:511px;}
.bulloon01{top:18px; left:883px;}
.bulloon02{top:36px; left:157px;}
.bulloon03{top:82px; left:91px; z-index:100;}
.sale1{top:672px; left:72px;}
.sale2{top:671px; left:646px;}

.ani01{animation-name:ani01; animation-duration: 3s;animation-iteration-count:infinite; animation-timing-function:ease-in-out;}
.ani02{animation-name:ani01; animation-duration: 4s;animation-iteration-count:infinite; animation-timing-function:ease-in-out;}
@keyframes ani01{0%{ transform:translateY(0px);} 20%{transform:translateY(6px);}  55%{transform:translateY(0px);} 75%{transform:translateY(6px);}  100%{transform:translateY(0px);}}

	@media screen and ( max-width: 768px ){
		.kv{ width:100vw;background:none; background-size:100%;height:auto;}
		.kv_content{ height:auto; max-width:100%;}
		.kv_pc{ display:none;}
		.kv_m{ display:block;width: 100%;}
		.kv_m img{ display:block;width: 100%;}
		.sale,.promo01,.promo02,.promo03{ display:none;}
		.sale_m{ width:100vw; display: block;}
		.sale_m img{ width:100%;}
	}


/* --第一區_1x3 -- */	
.box1{ background: url(../images/bg_02.jpg) top center no-repeat;padding-top:80px;}
.box_1x3 li{ width:370px; background-color:#fff; margin:0 25px 20px 0; text-align:center;}
.box_1x3 li:nth-child(3n){ margin-right:0px;}
.box_1x3 li img{max-height:370px; max-width:370px;transition:all 0.5s; vertical-align: middle; margin:0 auto; padding:10px;}	
.box1 h2{ background-color:#ba1f1f; color:#ffffff; border-radius:14px; padding:5px 20px; height:1.5rem; font-size:1rem; position:relative; top:-25px; font-weight:600;}
.box1 h3{ color:#353531; margin-top:-20px; padding:0px 10px; font-weight:400; line-height:1.3rem; font-size:1rem;}
.box_1x3 li img:hover{ transform:scale(0.95);}		
	@media screen and ( max-width: 768px ){
		.box1{ background: url(../images/mbg_1.png) top center repeat; height:auto; padding-top:0px;}
		.conten1 { width:90vw;}

		.box_1x3{ width:90vw;}
		.box_1x3 li{ width:90vw; margin:0 3vw 5% 3vw;}
		.box_1x3 li img{ max-height:90vw; max-width:90vw; vertical-align:top;}
	}	
	@media screen and ( max-width: 490px ){
		.box_1x3{ width:90vw; }
		.box_1x3 li{ width:90vw; margin:0 0 3vw 0; margin-right:0;}
	}	

/* --第四區_1x3 -- */	
.box4{background: url(../images/bg_05.jpg) top center no-repeat; height:1056px; padding-top:40px;}
.box4 .title{ height:50px;}
.box5 .title{ height:50px;}
.box4 h2{ background-color:#ba1f1f; color:#ffffff; border-radius:14px; padding:3px 10px; height:1.5rem; font-size:1rem;  position:relative; top:-25px; font-weight:600;}
.box4 h3{ color:#353531; margin-top:-20px; padding:0px 10px; font-weight:500; line-height:1.3rem; font-size:1rem;}
	@media screen and ( max-width: 768px ){
		.box4{background: url(../images/mbg_1.png) top center repeat; height:auto; padding-top:2%;}

		.conten4 { width:90vw;}
		.box4 .title,.box5 .title{ height:auto; margin-bottom:5%;}
	}	




/* --第二區_1x4 -- */
.box2{background: url(../images/bg_03.jpg) top center no-repeat; height:985px;}
	@media screen and ( max-width: 768px ){
		.box2{background: url(../images/mbg_2.png) top center repeat; height:auto;}
	}

/* --第五區_1x4 -- */
.box5{background: url(../images/bg_06.jpg) top center no-repeat; height:985px; padding-top:40px;}
	@media screen and ( max-width: 768px ){
		.box5{background: url(../images/mbg_1.png) top center repeat; height:auto; padding-top:2%;}
	}

.block2{ padding:0 0 0 0; min-width:1160px;margin:0 auto; display:flex; flex-wrap:wrap; align-items:stretch;}
.block2 li {width:280px; background-color:#fff; text-align:center;padding:8px; overflow:hidden; margin-right:13px; display:inline-block; vertical-align:top; margin-bottom:13px;}
/*.block2 li:hover{box-shadow:0 3px 5px 0 rgba(0, 0, 0, 0.2), 1px 4px 8px rgba(0, 0, 0, 0.2);}*/
.block2 li:nth-child(4n){margin-right:0px;}
.block2 li div{width:264px;height:264px;overflow:hidden; vertical-align:middle;line-height:264px; margin-bottom:8px;}
.block2 li img{ max-width:100%; max-height:100%; margin:0 auto; vertical-align:middle;transition:all 0.5s;}
.block2 li img:hover{ transform:scale(1.1);}
.block2 li h2{ height:auto; font-size:1rem; line-height:1.2rem; color:#ffffff; text-align:center; font-weight:600; position:relative;overflow: hidden;  margin:10px 0px 5px 0px; background-color:#ba1f1f; padding:5px; width:264px;}
.block2 li p{ height:auto; font-size:18px; line-height:22px; color:#353531; text-align:center; font-weight:500; position:relative;overflow: hidden; z-index:10; padding-bottom:8px; padding-top:8px;}
.block2 li h4{ height:auto; font-size:0.75rem; line-height:1.5rem; color:#777; text-align:center; font-weight:500; position:relative;padding-top:0px;}
.block2 li h4 span{  height:auto; font-size:1.4rem; line-height:1.5rem; color:#ba1f1f; text-align:center; font-weight:900; position:relative;font-family:'Century Gothic';}

	@media screen and ( max-width: 768px ){
		.block2{ padding:2% 0 2% 0; min-width:100vw;margin:0 auto;}
		.block2 li {width:47vw; padding:1vw; overflow:hidden; margin-right:1vw; margin-bottom:2vw;}
		.block2 li:hover{box-shadow:none;}
		.block2 li:nth-child(2n){margin-right:0px;}
		.block2 li:nth-child(4n){margin-right:0px;}
		.block2 li div{width:45vw;height:45vw;overflow:hidden;vertical-align:middle; margin:0 auto; line-height:45vw;margin-bottom:2vw;}
		.block2 li img{line-height:0; vertical-align:top; transition:all 0.5s;vertical-align:middle;}
		.block2 li h2{ font-size:0.8rem; line-height:1.2rem; margin:0px 0px 0px 0px; padding:5px 2px;}
		.block2 li p{font-size:0.8rem; line-height:1.1rem; padding-bottom:0;}
		.block2 li h4{font-size:0.5rem; line-height:1.5rem;padding-top:2%;}
		.block2 li h4 span{  font-size:1.2rem; line-height:1.5rem; }
	}






/* --第三區 -- */
.box3{ background: url(../images/bg_03.jpg) top center no-repeat; height:1030px;}
.box3_ul{ width:570px; background:#fff; display:inline-block; margin-right:13px; padding:10px; margin-bottom:25px;transition:all 0.5s; position:relative; overflow: visible;}
.b4display{ display:inline-block;}
.box3_ul a{ display:block;float:left;}
.box3_ul:hover{ transform: translateY(-8px);}
.box3_ul2{ margin-right:0px;}
.box3_ul li{ text-align:center;}
.box3_ul li:nth-child(1){ width:264px; height:264px; vertical-align:middle; display:inline-block; margin-right:7px; border:1px #ccc solid; line-height:258px;}
.box3_ul li:nth-child(1) img{ max-height:264px; max-width:264px;vertical-align:middle;}
.box3_ul li:nth-child(2){width:278px; margin:0 auto; text-align:center;/* border-top:1px #261003 solid; border-right:1px #261003 solid;*/ margin-bottom:4px; padding-top:0px;}
.box3_ul li:nth-child(2) h2{ width:278px; padding:4px 10px; height:36px; background-color: #ba1f1f; color:#ffffff; font-weight:600;}
.box3_ul li:nth-child(2) h3{ width:278px; color: #353531; padding:10px 8px;font-weight:600;}
.box3_ul li:nth-child(2) .proname{ font-size:0.7rem; padding:1px 12px 7px 12px;}
.box3_ul li:nth-child(3){ width:136px; height:136px; overflow:hidden; display:inline-block; margin:0px 6px 0 0; border:1px #ccc solid; line-height:128px;}
.box3_ul li:nth-child(3) img{ max-width:100%; max-height:100%;vertical-align:middle; }
.box3_ul li:nth-child(4){ width:136px; height:136px;overflow:hidden; display:inline-block; border:1px #ccc solid;vertical-align:middle;line-height:128px;}
.box3_ul li:nth-child(4) img{ max-width:100%; max-height:100%;vertical-align:middle; }
	@media screen and ( max-width: 768px ){
		.box3{ height:auto;background: url(../images/mbg_2.png) top center repeat;}
		.box3_ul{ width:96vw;}
		.b4display{ width:96vw;}
		.box3_ul li:nth-child(1){ width:44vw; height:44vw; text-align:center;line-height:44vw; margin-bottom:1vw;}
		.box3_ul li:nth-child(1) img{ max-width:100%; max-height:100%;}
		.box3_ul li:nth-child(4) img{ max-width:100%; max-height:100%;}
		.box3_ul li:nth-child(3) img{ max-width:100%; max-height:100%;}
		.box3_ul li:nth-child(2){ width:47vw; height:20.8vw; margin-bottom:1vw; }
		.box3_ul li:nth-child(2) h2{ width:47vw;padding:2vw 0; margin-top:2vw;font-size:1.1rem;}
		.box3_ul li:nth-child(2) h3{ width:47vw; padding:1vw 0;}
		.box3_ul li:nth-child(3),.box3_ul li:nth-child(4){ width:22vw; height:22vw; line-height: inherit;}
		.box3_ul li:nth-child(2) .proname{ font-size:0.70rem; padding:3px 0px 3px 0px;}
	}
	@media screen and ( max-width: 540px ){
		.box3_ul{ width:96vw; margin:0 auto;}
		.b4display{ width:96vw; margin-bottom:5vw;}
		.box3_ul li:nth-child(1){ width:90vw; height:auto;}
		.box3_ul li:nth-child(2){ width:90vw; height:auto; margin-bottom:1vw; border:none;}
		.box3_ul li:nth-child(2) h2{ width:90vw;}
		.box3_ul li:nth-child(2) h3{width:90vw;padding:2vw 0;}
		.box3_ul li:nth-child(3),.box3_ul li:nth-child(4){ width:43vw; height:auto;line-height: inherit;}
	}






/* -- 第六區 -- */
.box6{ background:url(../images/mbg_4.png) top center repeat; height:850px;}
.intro{ height:385px;margin:0 auto; position:relative; overflow:hidden;}
.intro a{ width:100%;height:385px;}
.intro ul li:nth-child(1){ width:448px; height:1px;color:#fff; text-align:center;  z-index:1; position:absolute; top:350px; left:0px; display:none;}
.intro ul li:nth-child(2),.intro1 ul li:nth-child(2){ width:470px; height:290px; background-color: #fff;z-index:3; position:absolute; left:0px; top:60px; box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.1), 1px 2px 4px rgba(0, 0, 0, 0.1);border-radius:10px;}
.intro ul li:nth-child(3){ width:358px; height:auto; font-size:1.6rem; line-height:2rem; color:#000000; text-align:center; font-weight:600; border-bottom:#000000 solid 1px; position:absolute; z-index:10;letter-spacing:2px; top:80px; left:60px; overflow: hidden;  padding:20px 10px;}
.intro ul li:nth-child(4){ width:358px; height:auto; font-size:0.8rem; line-height:1.2rem; color:#000000; font-weight:400;position:absolute; z-index:10;top:180px; left:60px;overflow:hidden;text-align: justify;text-justify:inter-ideograph; padding: 0px 10px 0 10px; letter-spacing:1px; }
.intro ul li:nth-child(5){ width:750px; height:350px;font-weight:300;  position:absolute; right:0px; top:30px;;z-index:2;}
.intro ul li:nth-child(5) img{width:750px; height:350px;}
.intro1 ul li:nth-child(4){ top:225px;}
	@media screen and ( max-width: 768px ){
		.box6{ height:auto;}
		.intro{ width:96vw; height:auto;margin:0 auto; padding-top:3%;}
		.intro a{width:96vw;height:auto;}
		.intro ul li:nth-child(1){ display:none;}
		.intro ul li:nth-child(2){ display:none;}
		.intro ul li:nth-child(3){ width:96vw; height:auto; font-size:1.5rem; line-height:1.9rem; font-weight:700; position:unset; letter-spacing:0px; padding:10px 10px; background-color:#fff; }
		.intro ul li:nth-child(4){ width:96vw; height:auto; font-size:0.8rem; line-height:1.3rem; color:#000000; font-weight:400; position: relative; z-index:10;top:0px; left:0px;overflow:hidden;text-align: center;text-justify:inter-ideograph; padding: 3% 10% 3% 10%;background-color:#fff; }
		.intro ul li:nth-child(5){ width:96vw; height:45vw;font-weight:300;  position: relative; right:0px; top:0px;;z-index:2;}
		.intro ul li:nth-child(5) img{width:100%; height:auto;}
	}

.block{ padding:20px 00px; min-width:1160px;margin:0 auto; display:flex; flex-wrap:wrap;align-item:stretch;}
.block li {width:280px; background-color:#fff; text-align:center;padding:8px; overflow:hidden; margin-right:13px; display:inline-block; vertical-align:top; margin-bottom:13px;}
.block li:hover{box-shadow:0 3px 5px 0 rgba(0, 0, 0, 0.2), 1px 4px 8px rgba(0, 0, 0, 0.2);}
.block li:nth-child(4n){margin-right:0px;}
.block li div{width:264px;height:264px;overflow:hidden; vertical-align:middle;line-height:264px; margin-bottom:8px;}
.block li img{ max-width:100%; max-height:100%; margin:0 auto; vertical-align:middle;transition:all 0.5s;}
.block li img:hover{ transform:scale(1.1);}
.block li h2{ height:auto; font-size:1rem; line-height:1.2rem; color:#ffffff; text-align:center; font-weight:600; position:relative;overflow: hidden;  margin:10px 0px 5px 0px; background-color:#ba1f1f; padding:5px; width:264px;}
.block li p{ height:auto; font-size:18px; line-height:22px; color:#353531; text-align:center; font-weight:500; position:relative;overflow: hidden; z-index:10; padding-bottom:8px; padding-top:8px;}
.block li h4{ height:auto; font-size:0.75rem; line-height:1.5rem; color:#777; text-align:center; font-weight:500; position:relative;padding-top:0px;}
.block li h4 span{  height:auto; font-size:1.4rem; line-height:1.5rem; color:#ba1f1f; text-align:center; font-weight:900; position:relative;font-family:'Century Gothic';}
	@media screen and ( max-width: 768px ){
		.block{ padding:2% 0 2% 0; min-width:100vw;margin:0 auto;}
		.block li {width:47vw; padding:1vw; overflow:hidden; margin-right:1vw; margin-bottom:2vw;}
		.block li:hover{box-shadow:none;}
		.block li:nth-child(2n){margin-right:0px;}
		.block li:nth-child(4n){margin-right:0px;}
		.block li div{width:45vw;height:45vw;overflow:hidden;vertical-align:middle; margin:0 auto; line-height:45vw;margin-bottom:2vw;}
		.block li img{line-height:0; vertical-align:top; transition:all 0.5s;vertical-align:middle;}
		.block li h2{ font-size:0.8rem; line-height:1.2rem;  margin:0px 0px 0px 0px;  padding:5px;}
		.block li p{font-size:0.8rem; line-height:1.1rem; padding-bottom:0;}
		.block li h4{font-size:0.5rem; line-height:1.5rem;padding-top:2%;}
		.block li h4 span{  font-size:1.2rem; line-height:1.5rem; }}


/* -- 第七區 -- */
.box7{background:url(../images/mbg_5.png) repeat center top; height:auto;}
.box8{background:url(../images/mbg_4.png) repeat center top; height:auto;}
	@media screen and ( max-width: 768px ){
		.box7{ height:auto;}
		
		.box7 .intro ul li:nth-child(2){ display:none;}
	}




/* --AD-- */
.boxAD{ background:url(../images/mbg_1.png) repeat center top; padding:0px 0px 15px 0px;}
.contenAD{ padding:0 20px;}
.boxAD ul{ padding-top:25px;}
.boxAD ul a{ display:block;float:left;}
.boxAD ul li:nth-child(1),.boxAD ul li:nth-child(4){ width:1160px; transition:all 0.5s;}
.boxAD .item_pc{ width:1152px; margin-bottom:22px;}
.boxAD ul li:nth-child(2),.boxAD ul li:nth-child(3),.boxAD ul li:nth-child(5),.boxAD ul li:nth-child(6){ width:565px; margin-right:22px; overflow:hidden;transition:all 0.5s;margin-bottom:22px;}
.boxv ul li:hover{ transform: translateY(-8px);}
.boxAD ul li img{ width:100%;}
.boxAD ul li:nth-child(3n){margin-right:0px;}
	@media screen and ( max-width: 768px ){
		.contenAD{ padding:0;}
		.boxAD .item_m{ width:96vw; margin-bottom:0;}
		.boxAD ul{ padding-top:3vw; display:block;}
		.boxAD ul li{ width:96vw; margin:0 auto 2vw auto;}	
		.boxAD ul li img{ width:96vw;}
		.boxAD .item_pc{ display:none;}
		.boxAD ul li:nth-child(1),.boxAD ul li:nth-child(2),.boxAD ul li:nth-child(3),.boxAD ul li:nth-child(4),.boxAD ul li:nth-child(5),.boxAD ul li:nth-child(6){ width:96vw;margin-right:0; margin-bottom:2vw;}
	}

/*手機 下方選單*/

menu{ display:none;}
	@media screen and ( max-width: 768px ){
		menu{
			display:inherit; -width:100%;
		}
		menu ul{
			position:fixed;
			bottom:0;
			left:0;
			margin:0;
			width:100%;
			display:flex; justify-content:center; text-align:center;
			flex-wrap: nowrap;
			background:#ba1f1f;
			z-index:999;
			padding:4.5px 0;
			/* border-top:4px solid #d6666e;*/
		}
		menu ul li{
			border-right:1px solid #ffffff;
			padding:0.5px 1%;
			min-width:25%;
			box-sizing:border-box;
			font-size:12px;
			font-family:'Noto Sans TC','Microsoft JhengHei','Heiti TC','Heiti TC';
		}
		menu ul li:nth-last-child(1){ border-right:none;}
		menu a{
			color:#ffffff;
			text-decoration: none;
		}
	}
	
/*--goto top--*/
#button {
  display: inline-block;
  background-color: #000;
  opacity:0.3;
  width: 35px;
  height: 35px;
  text-align: center;
  border-radius: 100%;
  position: fixed;
  bottom: 15px;
  right: 15px;
  transition: background-color .3s, 
 opacity .5s, visibility .5s;
  opacity: 0;
  visibility: hidden;
  z-index: 1000;

}
@media screen and ( max-width: 768px ){
#button {
  bottom: 40px;
  right: 10px;}
}

#button::after {
  font-family: FontAwesome;
  content:'　';
  font-weight: normal;
  font-style: normal;
  font-size: 2em;
  line-height: 50px;
  color: #fff;
    opacity:0.5;
	background: url(../images/top.png) center no-repeat; background-size:45%;background-position:40% 22%;
}
#button:hover {
  cursor: pointer;
  background-color: #666;
}
#button:active {
  background-color: #666;
}
#button.show {
  opacity: 0.4;
  visibility: visible;
}