@charset "utf-8";
/* CSS Document */

/* HTML5基本設定 */
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,main{display:block;}
audio,canvas,video{display:inline-block;*display:inline;*zoom:1;}
audio:not([controls]){display:none;}[hidden]{display:none;}

/* reset */
div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { padding: 0; margin: 0;}
address,caption,cite,code,dfn,var { font-weight: normal; font-style: normal;}
ol,ul { list-style: none;}
h1,h2,h3,h4,h5,h6 { font-weight: inherit; font-size: 100%;}
html { background: #fff;}
body {
	font-size: 14px;
	font-family: Helvetica, Arial, 'LiHei Pro', '微軟正黑體', 'Microsoft JhengHei', 'Microsoft YaHei', sans-serif;
	letter-spacing: 0.01em;
	color: #333;
	background: #fff;
	/*background: url(../images/bg_gradient.png) 0 40px repeat-x;*/
}	
img { border: 0; max-width: 100%; height: auto;margin:0 0 -10px 0;}
* { margin: 0px; padding: 0px; transition: all 0.3s ease;}
a { color: inherit; text-decoration: none; transition: all 0.3s ease, background-position 0s;}
a:focus { outline: 0;}

/* 共用 */
.inner, .inner-static{ max-width: 1020px; margin: 0 auto; padding: 0 40px; clear: both; }
.title{ margin: 1em auto 0.5em; font-size: 2.57rem; text-align: center; }
p{ font-size: 15.5px; margin: 10px 14px 0 14px; line-height: 24px; }

@media (min-width: 701px) and (max-width: 1200px){
	.inner{ padding: 0 30px; }
}
@media (max-width: 667px){
	.title{ margin: 3em 0 .8em 0; }
	.title img{ height: 3em; width: auto; }
	p{ font-size: 14px;margin: 15px 10px 0 10px;}
}
@media (max-width: 568px){
	.title{ margin:0; }
}
@media (max-width: 320px){
	.inner, .inner-static{padding: 0 20px;}
}

/* kv */
.kv{position: relative; font-size: 0; text-align: center; 
	background: #ffc7d3 url(../../images/ubear/kv_bg.png) center center; background-size: cover; overflow: hidden; }
.kv h1{color: #000}
.kv_cont{ max-width: 100%; margin: 0 auto; }
.kv_cont img{ display: block; max-width: 100%; height: auto; margin: 0 20px; }
.cardList{ position: absolute; z-index: 5; left:53%; top:26%; font-size: 0; line-height: 0; letter-spacing: 0;}
.cardList li{ max-width: 100%; padding:0 1%; display: inline-block; vertical-align: top; box-sizing: border-box;}

@media (min-width: 701px){
	.kv_cont{ display: flex; justify-content: center; }
	.kv_pic{ display: inline-block; vertical-align: top; width: 42.468%; margin-left: -7.14%; }
}
@media (min-width: 701px) and (max-width: 812px){
	.kv_pic{width: 50%; margin-left: -48%; margin-top: 5%;}
	.cardList{width: 45%;margin-top: 5%;}
}
@media (min-width: 813px){
	.kv_pic{ width: 42.468%; margin-left: -40%; }
}
@media (max-width: 700px){
	.kv{ height: auto; line-height: 0;}
	.kv_pic{ position: relative; float: right; max-width: 80%; margin: 0 70px 0 16px;}
} 
@media (max-width: 667px){
	.kv_pic{width: 70%;right: 20%;}
	.cardList{width: 45%;top: 60%;}
} 
@media (max-width: 568px){
	.kv_pic{width: 80%;right: 12%;}
}
@media (max-width: 320px){
	.kv_pic{width: 100%;right: 0%;}
	.cardList{display: none;}
} 

/* U Bear */
.mall{ position: relative; z-index: 1; padding: 25px 0 35px; }
.mallList li{display: inline-block;vertical-align: top;width: 50%;margin-right: -0.3em;box-sizing: border-box;padding: 40px 20px 20px 20px;}

/*第一區塊 生活市集限定*/
.shopping-1 .inner{border-top: 1px solid #333333;}
.shopping-1 .shopping_btn{display: inline-block;font-size: 28px;letter-spacing: 8px;border: 1px solid #333333;padding: 10px 100px;border-radius: 7px;margin: 50px 30px 0 30px;background-color: #ffffff;}
.shopping-1 .shopping_btn a:hover{color: #00a99d;}
.shopping-1 .left{margin-right: 20px;}
.shopping-1 .title_one{-moz-transform:rotate(-2deg);-webkit-transform:rotate(-3deg);-o-transform:rotate(-3deg);-ms-transform:rotate(-3deg);transform:rotate(-3deg);border-bottom: 7px solid #ffe74c;width: 370px;padding: 0 10px;}
.shopping-1 h2{font-size: 38px;letter-spacing: 4px;color: #00a99d;}
.shopping-1 .activity_one{margin-right: 20px;}
.shopping-1 .activity_one li,.activity_two li{padding: 10px;}
.shopping-1 .activity_two{margin-left: 20px;}
.shopping-1 .activity_title h3{font-size: 34px;letter-spacing: 5px;color: #333333;line-height: 42px;}
.shopping-1 .activity_title span{background-color: #ffe74c;border-radius:30px;}
.shopping-1 .activity_content h4{font-size: 82px;letter-spacing: 5px;color: #ea6564;font-weight: bold;margin-left: -50px;font-style: italic;}
.shopping-1 .activity_content span{font-size: 42px;color: #ea6564;}
.shopping-1 .activity_two h4{margin-left: -30px;}
.shopping-1 p{color: #6b6969;margin: 0 10px 0 10px;letter-spacing: .5px;}
.shopping-1{background-color: #fff;}
.shopping-1:before, .shopping-2:after{ content: ""; z-index: -1; position: absolute; width: 100%; height: 100%; }
.shopping-1:before{ top: 0; right: 0; margin-top: 10px; background: url(../../images/ubear/mall_deco-righttop.png) right 0 no-repeat; }
.shopping-2:after{ bottom: 0; left: 0; background: url(../../images/ubear/mall_deco-leftbtm.png) 0 bottom no-repeat; }

/*第二區塊 生活市集專屬首刷禮*/
.shopping-2 .title_one{-moz-transform:rotate(-2deg);-webkit-transform:rotate(-3deg);-o-transform:rotate(-3deg);-ms-transform:rotate(-3deg);transform:rotate(-3deg);border-bottom: 7px solid #ffe74c;width: 550px;padding: 0 10px;}
.shopping-2 h2{font-size: 38px;letter-spacing: 4px;color: #00a99d;}
.shopping-2 .activity_one{margin-right: 20px;}
.shopping-2 .activity_one,.activity_two{padding: 10px;}
.shopping-2 .activity_two{margin-left: 20px;}
.shopping-2 .activity_title h3{font-size: 34px; letter-spacing: 5px;color: #333333;line-height: 42px;margin-left:10px; }
.shopping-2 .activity_title span{background-color: #ffe74c;border-radius:30px;}
.shopping-2 .activity_content h4{font-size: 82px;letter-spacing: 5px;color: #ea6564;font-weight: bold;margin-left: 10px;font-style: italic;}
.shopping-2 .activity_content span{font-size: 42px;color: #ea6564;}
.shopping-2 p{color: #6b6969;margin: 0 10px 0 10px;letter-spacing: 1px;}
.shopping-2{background-color: #fff;}

@media (max-width: 1024px){
	.mallList li{ width: 50%;padding: 40px 8px 10px 8px;}
	.shopping-1 .activity_one li,.activity_two li{padding: 0 0 0 10px;}
	.shopping-1 .activity_one{margin-right: 0;}
	.shopping-1 .activity_two{margin-left: 0;}
	.shopping-1 .activity_title h3{font-size: 31px;letter-spacing: 1px;}
	.shopping-1 .activity_content h4{font-size: 80px;margin-left: -12px;}
	.shopping-2 .activity_one li,.activity_two li{padding: 0 0 0 10px;}
	.shopping-2 .activity_one{margin-right: 0;}
	.shopping-2 .activity_two{margin-left: 0;}
	.shopping-2 .activity_title h3{font-size: 31px;letter-spacing: 1px;}
	.shopping-2 .activity_content h4{font-size: 70px;/*margin-left: 38px;*/}
	.shopping-2 .activity_content span{font-size: 31px;}
}
@media (max-width: 812px){
	.shopping-2 .activity_one,.activity_two{padding: 1px;}
}
@media (max-width: 768px){
	.shopping-1 .shopping_btn{font-size: 26px;padding: 10px 80px;}
	.shopping-1 .title_one{border-bottom: 6px solid #ffe74c;width: 365px;}
	.shopping-1 h2{font-size: 36px;letter-spacing: 8px;}
	.shopping-1 .activity_title h3{font-size: 28px;}
	.shopping-1 .activity_content h4{font-size: 72px;}
	.shopping-2 .title_one{border-bottom: 6px solid #ffe74c;width: 490px;}
	.shopping-2 h2{font-size: 36px;letter-spacing: 4px;}
	.shopping-2 .activity_title h3{font-size: 28px;letter-spacing: 1px;}
	.shopping-2 .activity_content h4{font-size: 70px;letter-spacing: 3px;}
	.shopping-2 .activity_content span{font-size: 28px;}
}
@media (max-width: 736px){
	.shopping-2 .activity_content h4{letter-spacing: 2px;}
	.shopping-2 .activity_content span{font-size: 26px;}
}
@media (max-width: 667px){
	.mallList{ margin: 0 -5px; text-align: center; }
	.mallList li{ width: 85%;}
	.mallList li:empty{ display: none;}
	.shopping-1 .title_one{width: 430px;margin: 0 auto;}
	.shopping-1 h2{font-size: 40px;}
	.shopping-1 .activity_title h3{font-size: 36px;line-height: 50px;}
	.shopping-1 .activity_content h4{font-size: 70px;}
	.shopping-2 .title_one{width: 480px;margin: 0 auto;}
	.shopping-2 h2{font-size: 40px;}
	.shopping-2 .activity_title h3{font-size: 36px;}
	.shopping-2 .activity_content h4{font-size: 70px;margin-left: 0;}
	.shopping-2 .activity_content span{font-size: 30px;}
}
@media (max-width: 568px){
	.shopping-1 .inner{border-top: none;}
	.shopping-1:before{background: none;}
	.shopping-1 .shopping_btn{margin: 20px 10px;}
	.shopping-1 .left{margin-left: 20px;}
}
@media (max-width: 414px){
	.shopping-1 .title_one{width: 328px;margin: 0 auto;}
	.shopping-1 h2{font-size: 38px;}
	.shopping-1 h2 img{width: 22%;}
	.shopping-1 .activity_title h3{font-size: 36px;line-height: 50px;}
	.shopping-1 .activity_content h4{font-size: 76px;}
	.shopping-2 .title_one{width: 280px;margin: 0 auto;}
	.shopping-2 h2{font-size: 38px;}
	.shopping-2 h2 img{width: 22%;}
	.shopping-2 .activity_title h3{font-size: 36px;}
	.shopping-2 .activity_content h4{font-size: 62px;margin-left: -10px;}
	.shopping-2 .activity_content span{font-size: 26px;}
}
@media (max-width: 375px){
	.shopping-1 .title_one{width: 200px;margin: 0 auto;}
	.shopping-1 .shopping_btn{font-size: 24px;padding: 10px 60px;}
}
@media (max-width: 320px){
	.shopping-1 .shopping_btn{font-size: 22px;padding: 10px 55px;}
	.mallList li{ width: 90%;}
	.shopping-1 .title_one{width: 200px;margin: 0 auto;}
	.shopping-1 h2{font-size: 36px;}
	.shopping-2 .title_one{width: 250px;margin: 0 auto;}
	.shopping-2 h2{font-size: 36px;}
}
@media (min-width: 700px){
	.mall{ padding: 35px 0 55px; }
}
@media (min-width: 813px){
	.mallList{ margin: 0 -15px; }
}


/* 注意事項 */
.notice{font-size: 16px;line-height: 1.6em;color:#666;background-color: #f7f7f7;padding: 30px 0;}
.notice_one li{list-style-type: disc; margin-left: 1.5em;}
.notice_list span{color: #00a99d;}

/* footer */
.footerWarning{color: #555; background: #e6e6e6;}
.footerWarning_cont{max-width: 1000px; margin: 0 auto; padding: 30px; overflow: hidden; box-sizing: border-box; }
.footerWarning_title{font-size: 24px;margin-top: 0.4em;letter-spacing: 0.2em;text-align: center;}
.footerWarning_txt{font-size: 14px;line-height: 22px; text-align: justify; }
/*@media (min-width: 900px){
	.footerWarning_title{ float: left; font-size: 30px; }
	.footerWarning_txt{ margin-left: 350px; }
}*/
