@charset "utf-8";
/* 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;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

html{
	background:url("../images/bg.jpg") top center repeat;
}



/* PC */
.WRAPPER{ position:relative; width:100%; min-width:1200px; margin:0 auto; overflow:hidden;}
 	@media screen and ( max-width: 991px ){
		.WRAPPER{ min-width:100%;}
		
	}
.container { overflow: hidden; }
.topbox { position: relative; width: 1200px; margin: auto;}
.kv_pc {width: 100%;  position: relative; text-align:center; display: flex;justify-content: center;max-width: 1920px; margin: auto;flex-wrap: wrap-reverse;}
.kv_pc img { display: block; text-align: center; }
.kv_m { display: none; }
.kv_m img { display: block; }
.kv_m a {font-size: 0; display: block; }
.for_pc{ display: block; }
.for_m { display: none; }

/* m */
@media screen and ( max-width: 991px ){
	.kv_m { display: block; width: 100%; }
	.kv_m img {  width: 100%; }
	.kv_pc { display: none; }
	.container {width: 100%; min-width: auto; }
	.for_pc{ display: none; }
	.for_m { display: block; }
}



/*主KV*/
.box01{ width:100%;height:410px; background:url(../images/box_01.png) top center no-repeat; display:block; position:relative;}
.box01_content{ width:1200px; height:410px; margin:0 auto;  position:relative;}

a{color: #666666; text-decoration: none;}

.kv{position: absolute; right: 0px; top: 0px;}

.brandtitle{background-color: #342e3a; width: 370px; height: 410px;}
.shaw{position: absolute; top:0px; left: 0px;}

.brandtitle ul{width: 290px; margin:auto; color: #ffffff; z-index: 999; position:relative; padding-top:20px; display: none;}
.brandtitle ul li:nth-child(1){ text-align: center; margin-bottom: 30px;}

.brandtitle ul li:nth-child(2){text-align: left; font-size: 1.2em; height: 40px;}
.brandtitle ul li:nth-child(2) .d1{float: left;}
.brandtitle ul li:nth-child(2) .d2{float: right;}
.brandtitle ul li:nth-child(2) hr{position: absolute; left: 100px; width: 70px;  border: none; height: 1px; color: #eeeeee; background-color: #eeeeee;}

.brandtitle ul li:nth-child(3){text-align: center; font-size: 2.1em; height:40px;}
.brandtitle ul li:nth-child(3) span{}

.brandtitle ul li:nth-child(4){font-size: 2em; color: #ffff99; text-align: center;}
.brandtitle ul li:nth-child(4) span{font-weight:900; font-size: 1.8em; }
.brandtitle ul li:nth-child(5) {font-size: 1.1em; text-align: center; }
.brandtitle ul li:nth-child(6) {font-size: 1.86em; text-align: center;}
.brandtitle ul li:nth-child(5) span{font-weight: bold; font-size: 1.4em; color: #ebbe86}
.brandtitle ul li:nth-child(6) span{font-weight: bold; font-size: 1.4em; color: #ffea96;}



/*介紹*/
.box02{ width:100%; display:block; position:relative; }
.box02_content{ width:1200px;  margin:0 auto;  position:relative;vertical-align: top;background-color:#ffffff; box-shadow: 0px 5px 10px #bbbbbb; padding-top: 25px; padding-bottom: 20px;}
.box02_content .logo{position: absolute; background: url(../images/logo.jpg) center no-repeat; width: 135px; height: 135px; border-radius: 135px; box-shadow: 0px 0px 5px #666666; margin-top: -80px; margin-left: 50px;

background-size: contain;
/*display: none;*/

}       
.box02_content .story{position: relative; line-height: 1.5em; right:-213px; width: 950px; text-align: left;}
.box02_content .box02_title{margin-top: 40px;}
.box02_title{color: #333333; font-size: 2em; font-weight: bold; width:1156px; margin:0px auto 10px auto;padding:0 0 0;}
.box02_title hr{margin-bottom: -20px;  border: none; height: 1px; color: #eeeeee; background-color: #eeeeee;}
.box02_title div{width: 590px; z-index: 999; background-color: #ffffff; margin: auto;text-align: center;}


/****************************************************************
	MOBILE
****************************************************************/
@media screen and ( max-width: 768px ){

    /* ========== 共用區塊 =========== */
    html, body{ 
    	min-width: 320px;
    	overflow: auto;
    	overflow-x: hidden;
    	width: 100%;
		font-size: 85%;
/*		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-family: Microsoft JhengHei;*/
    }
	

    
/*kkv*/   
    
.box01{ width:100%;height:auto; background:none; display:block; position:relative;}
.box01_content{ width:100%; height:auto; margin:0 auto;  position:relative;}

.kv{position: relative; right: 0px; top: 0px; width: 100%;}

.brandtitle{background-color:#446972; width: 100%; height: auto;}
.shaw{position: absolute; top:0px; left: 0px; display: none;}
.brandtitle ul{width:80%; margin:auto; color: #ffffff; z-index: 999; position:relative; padding-top:3%; display: block;}
.brandtitle ul li:nth-child(1){text-align: center; margin-bottom:1vw; width: 100%;}
.brandtitle ul li:nth-child(1) img{padding:0; width: 40%;}

.brandtitle ul li:nth-child(2){text-align: center;font-size: 23px;font-weight: bold;height: 9vw;padding: 2vw;color: #ffffff;}

.brandtitle ul li:nth-child(3){text-align: center;font-size: 47px;font-weight: bold;height: 12vw;padding: 2vw;color:#ebbe87}

.brandtitle ul li:nth-child(4){border-bottom: 1px solid #ffffff;font-weight: bold;font-size: 38px;color: #ffffff; padding: 2vw 0 4vw;}
.brandtitle ul li:nth-child(4) span{ color:#ebbe86;font-family: Century Gothic;font-size: 53px; }
	
.brandtitle ul li:nth-child(5){border-bottom: 1px solid #ffffff;font-weight: bold;font-size: 38px;color: #ffffff; padding: 2vw 0 4vw;}
.brandtitle ul li:nth-child(5) span{color:#ebbe86;font-family: Century Gothic; }
		

/*介紹*/
.box02{ width:100%; display:block; position:relative; }
.box02_content{ width: 100%;margin: 0 auto;padding-top: 0;padding-bottom: 0;}
.box02_content .logo{display: none}       
.box02_content .story{    position: relative;line-height: 23px;right: 0;width: 100%;text-align: center;font-size: 15px;padding: 2vw;}



}

.rectangle_3p li { background: #efefef;}
.rectangle_3p .font p {line-height: 26px;}
.area_pp02 { background:#d13945;padding: 1px;margin: 20px 0;}
.area_pp02 .crosswise li { background: #efefef;}
.area_pp02 .titleC h2{color: #fff;}
.area_pp02  .crosswise .font h4, .area_pp02 .crosswise .font p, .crosswise .font .price{color: #333;}
.area_pp02 .crosswise .font .price big {color: var(--PV-eslite);}

/* 影片公版 */
.brand-viedo_01{margin:0 30px; display:inline-block;}
.brand-viedo_01 iframe {width: 1148px;height: 626px;margin: 0 auto 35px;}
 @media screen and ( max-width: 991px ){
.brand-viedo_01 { width:90vw;padding:0; margin: 2vw auto;}
		.brand-viedo_01 { display: block;padding: 0;}
		.brand-viedo_01 iframe { width:100%; height:50vw;margin: 0}

	}

.shaw{position: relative; top:0px; left: 0px; display: block; width: 100%;}
	}
/*看更多 */
.area_more{text-align: center}
.viewmore{background: #000;width: 240px;margin: 0 auto;padding: 20px 67px;font-size: 20px; color: #fff;text-align: center;}