@charset "utf-8";
/* CSS Document */
/** layout_1220__20170427 **/

/** 基本 **/

.Area.auto{margin:10px auto; overflow:hidden;position:relative;z-index:2;}
.Area.auto .mainArea{ width:1220px; padding:0px 0px 0px 0px; background:;}

/***************1列4品************************************/

.Area.auto .t1p4{width:100%;position:relative;display:block;margin:0px auto 0px auto;padding:30px 0px 30px 0px; overflow:hidden; }
/***.Area.auto .t1p4 .listTitle{display:block;width:640px;height:135px;overflow:hidden;z-index:1;position:relative;margin:0% auto 10px auto;background:url(auto_title.png?t=1762914970668) top center no-repeat; background-size:100%;z-index:3;} ***/

.Area.auto .t1p4 .listTitle{display:block;width:400px;height:86px;overflow:hidden;z-index:1;position:relative;margin:0% auto 10px auto;background-position:top center ; background-repeat:no-repeat;background-size:100%;z-index:3;} 

.Area.auto .t1p4 .listTitle h2{display:block;width:100%;height:auto;margin:21px auto 0vw 0px;text-align:center;font-size:36px;vertical-align:baseline; font-family: "微軟正黑體","Microsoft JhengHei",Arial;letter-spacing:1px;font-weight:bold;color:#b248a4; /**text-shadow:1px 1px 1px #ffce79 , 0px 0px 10px #ffce79;**/ }

/***入稿商品****/
/**.Area.auto .t1p4 .content_Area{width:98.5%;overflow:hidden; margin:-70px auto 0 auto; padding:75px 0px 0px 0px; 
background:url(bgg.jpg?t=1762914970668) center center; background-size:100%;
box-shadow:  0px 0px 0px 5px #d2edff , 0px 0px 0px 7px #1267b5 , inset 10px 0px 0px 5px rgba(18,103,181,0.6) ,  inset -10px 0px 0px 5px rgba(18,103,181,0.6) ; 
border-radius:50px; border:2px solid #1267b5;}**/

.Area.auto .t1p4 .content_Area{width:98.5%;overflow:hidden;border-radius: 30px;
    margin: -50px auto 0 auto;
    padding: 65px 0px 10px 0px;
    background-color: #fffbce;
    background-size: 5%;
    box-shadow: inset 0px 20px 30px 0px rgba(192, 0, 6, 0.9);
    border: 3px solid #fff;
    -webkit-box-shadow: 0px 0px 0px 5px #b248a4;}


.Area.auto .t1p4 .content_Area .ulOut{width:88%;padding:0px 0px 50px 0px; margin:0px auto; overflow:hidden;background-size:100%;}
.Area.auto .t1p4 .content_Area ul {width:100%;display:inline-block;padding:0px;padding-bottom:0vw;position:relative;display:block;padding-top:10px; margin:0px auto 0 auto;overflow:hidden;padding-left:0.5%;}
.Area.auto .t1p4 .content_Area ul li {float:left;display:inline-block; box-sizing:border-box;margin-right:0.5%;width:24.5%;margin-bottom:0.5%;background-color:#fff;overflow:hidden;position:relative; border-radius:0px; z-index:2;border:5px solid #fff;}

.Area.auto .t1p4 .content_Area ul li a {width:100%;display:block;overflow:hidden; margin:0px auto 0 auto;text-decoration:none;position:relative;padding-bottom:8px;  }
.Area.auto .t1p4 .content_Area ul li a img { display:block;width:100%;height:auto; margin:0px auto 5px auto;}
.Area.auto .t1p4 .content_Area ul li a  .text_box{width:95%; margin:0px auto 0 auto;}
.Area.auto .t1p4 .content_Area ul li a h3 {display:block;position:relative;margin:0px auto 0px auto;max-height:35px;width:94%;overflow:hidden;background:rgba(0,0,0,0.9); border-radius:50px;}
.Area.auto .t1p4 .content_Area ul li a h3 p{display:block;width:95%;margin:0 auto;color:#fffddc;font-size:18px;line-height:36px;text-align: center;font-family: "微軟正黑體","Microsoft JhengHei",Helvetica;padding:0px; letter-spacing:0px;font-weight:normal; }

.Area.auto .t1p4 .content_Area ul li a h4 {width:95%;display:block;margin:10px auto 3px auto;height:49px; font:17px "微軟正黑體","Microsoft JhengHei",Helvetica;text-align:center;color:#000;overflow:hidden;padding: 0 5px;line-height:24px; font-weight:600;letter-spacing:0.3px; }
.Area.auto .t1p4 .content_Area ul li a  .priceBox {width:95%;margin:0 auto; padding:0px;color:#d92670;overflow:hidden;height:40px;text-align:center;}
.Area.auto .t1p4 .content_Area ul li a  .priceBox .money { font: bold 20px Century Gothic;text-align:center;margin-right:-5px;}
.Area.auto .t1p4 .content_Area ul li a  .priceBox .Price { font: bold 30px Century Gothic; letter-spacing:-0.5px;text-align:center;}
.Area.auto .t1p4 .content_Area ul li a  .priceBox  del{margin-right:5px;padding:0px;font-size:19px;font-family:Century Gothic,"微軟正黑體"; color:#777;}
.Area.auto .t1p4 .content_Area ul li a  .priceBox  .slogan{font-size:17px;font-weight:bold;font-family:"微軟正黑體"; padding-right:3px;}
.Area.auto .t1p4 .content_Area ul li a  .priceBox  small{font-size:18px; letter-spacing:-1px; margin-left:0px;font-weight:bold;font-family:"微軟正黑體";}


/***看更多****/
.Area.auto .t1p4 .more{width:110px;height:45px;position:absolute;right:70px;top:71px;z-index:3;text-align:center;color:#ffffff;padding:0px 15px 0px 10px; line-height:45px; font-size:22px; border-radius:0px 0px 20px 20px;font-weight:bold;background:#b248a4;}
.Area.auto .t1p4 .more span{display:block;transform:rotate(90deg); -webkit-transform:rotate(90deg); -moz-transform:rotate(90deg); -o-transform:rotate(90deg); float:right; margin-left:-12px; font-size:18px;}


@media screen and (max-width:767px){
	
	.Area.auto{ padding:0px 0px;  margin:0px 0px;}
	.Area.auto .mainArea{ width:100%;padding:0vw 0px 1vw 0px;}
	.Area.auto .t1p4{ width:100%; padding:3vw 0px 5vw 0px;}
	
	/***標題文字****/
	.Area.auto .t1p4  .listTitle{width: 58%;  height: 20vw; margin: 0vw auto 0vw auto;}
	.Area.auto .t1p4  .listTitle h2{width:60%; margin:2vw auto 0vw auto;font-size:6vw;letter-spacing:0.5px;}
	
	/***入稿商品****/
	.Area.auto .t1p4 .content_Area{width:96.5%;margin:-53px auto 0 auto; padding:30px 0px 25px 0px; background-size:12%;border:1px solid #ffce79;	}

	.Area.auto .t1p4 .content_Area .ulOut{width:100%;padding:4vw 0px 0vw 0px; }
	.Area.auto .t1p4 .content_Area ul {width:94%;margin-left:auto;padding-top:0vw;padding-bottom:0vw; padding-right:auto;padding-left:1.5%;}
	.Area.auto .t1p4 .content_Area ul li {margin-right:1.5%;margin-bottom:1.5%;width:48.5%;border-radius:0vw; border:4px solid #fff;}
	.Area.auto .t1p4 .content_Area ul li a {width:100%;margin: 0vw auto 0 auto;padding-bottom:1.5vw; }
	.Area.auto .t1p4 .content_Area ul li a h3 {height:auto;max-height:28px;}
	.Area.auto .t1p4 .content_Area ul li a h3 p{width:92%;font-size:15px;line-height:30px;letter-spacing:0.5px;font-weight:400; }
	.Area.auto .t1p4 .content_Area ul li a h4 {width:96%;margin:1.5vw auto 0px auto;height:8.9vw;font-size:3.7vw;padding: 0 1vw;line-height:4.8vw;text-align:left; margin-bottom:0.5vw;letter-spacing:0px;}
	.Area.auto .t1p4 .content_Area ul li a  .priceBox {height:8vw;text-align:left;letter-spacing:-0.3px;}
	.Area.auto .t1p4 .content_Area ul li a  .priceBox .money { font: bold 4vw Century Gothic;text-align:left;margin-right:-1.5px;}
	.Area.auto .t1p4 .content_Area ul li a  .priceBox .Price { font: bold 6vw Century Gothic; letter-spacing:-0.5px;text-align:left;}
	.Area.auto .t1p4 .content_Area ul li a  .priceBox  del{margin-right:3px;font-size:3.5vw;}
	.Area.auto .t1p4 .content_Area ul li a  .priceBox  .slogan{font-size:3.8vw;margin-left:1.5px;}
	.Area.auto .t1p4 .content_Area ul li a  .priceBox  small{font-size:3.5vw; letter-spacing:-0.2px; margin-left:0px;}
	
	.Area.auto .t1p4 .more{width:20vw;height:9.5vw;right:0vw;top:16.5vw;font-size:4.6vw;padding:0px 2vw 0px 2vw;line-height:9.8vw;border-radius:50px 0px 0px 50px;z-index:4; }
	.Area.auto .t1p4 .more span{display:block;float:right;font-size:12px;margin-left:-5px;margin-top:0vw;}
	

}





/*****************精選分館**********************/

.Area.auto.kind .t1p4 .content_Area ul {width:100%;padding:0px;padding-bottom:0vw;position:relative;display:block;padding-top:10px; margin:0px auto 0 auto;overflow:hidden;padding-left:auto; text-align:center;}
.Area.auto.kind .t1p4 .content_Area ul li {float:none;display:inline-block; box-sizing:border-box;text-align:center; margin:-0.5% -0.5%;width:18%;background:none;border-radius:0px; border:none;}
.Area.auto.kind .t1p4 .content_Area ul li a {width:100%;padding-bottom:0px;background-color:none;}
.Area.auto.kind .t1p4 .content_Area ul li a img { display:block;width:100%;height:auto; margin:0px auto 0px auto;}


@media screen and (max-width:767px){


	.Area.auto.kind .t1p4 .content_Area ul {padding-top:0px; }
	.Area.auto.kind .t1p4 .content_Area ul li {margin:-0.8% -0.8%;width:24.7%;background:none;border-radius:0px; border:none;}
	.Area.auto.kind .t1p4 .content_Area ul li a {width:100%;padding-bottom:0px;background-color:none;}
	.Area.auto.kind .t1p4 .content_Area ul li a img { display:block;width:100%;height:auto; margin:0px auto 0px auto;}


}






/***************************************************************************/


.content_Area li:hover{transform:translateY(-8px);}
/**.t1p4 .content_Area ul li:hover a h3 {background:#d61b30; }**/

.content_Area li {
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.content_Area li  a h3{
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
@media screen and (max-width:767px){
	
	.content_Area li:hover{transform:translateY(0px); }

}



