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

/** 基本 **/

.Area.auto{margin:40px auto;overflow:hidden; padding:10px 0px 10px 0px; background-position: bottom center; background-size:100%;}
.Area.auto .mainArea{width:100%;}
.Area.auto .content_Area  a{display:block;}

@media screen and (max-width:767px){
	.Area.auto{background:none;margin:1vw auto 1vw auto;padding:0vw 0px 0vw 0px;}
	.Area.auto .mainArea{width:100%; }
	
}

/***************1列4品************************************/
.Area.auto .t1p4{width:1220px;position:relative; margin:0 auto;padding-top:0px; }

/***背景****/
.Area.auto .t1p4 .t1p4_bg{width:100%;margin:0px auto 0px auto; padding:0px 0px 15px 0px; position:relative; z-index:2;}


/***標題背*標題文字***/
.Area.auto .t1p4 .t1p4_bg .listTitle{ position:relative;z-index:7;width:560px;height:140px; margin:0px auto -30px auto; background:url(auto_title1.png?t=1751536917501); background-size:100%; overflow:hidden;}
.Area.auto .t1p4 .t1p4_bg .listTitle h2{width:100%;display:block;font-size:35px;vertical-align:baseline;font-family:"微軟正黑體","Microsoft JhengHei",Arial;font-weight:bold;text-align:center; color:#003550;letter-spacing:1px;margin-top:55px;}

/***入稿商品****/
.Area.auto .t1p4 .content_Area{width:1219px;position:relative;z-index:2; display:block;margin:0px auto 0px auto; padding:10px 0px  50px 0px;border-radius:0px;
background:#5cccd5 url(bggggg.jpg?t=1751536917501); background-size:5%;}

.Area.auto .t1p4 .content_Area::after{ content:"";width:1223px; height:95px; background:url(auto_bg1.png?t=1751536917501) top center no-repeat; background-size:100%; top:-55px; left:-2px; position:absolute;z-index:2; display:block;}
.Area.auto .t1p4 .content_Area::before{ content:"";width:1223px; height:28px; background:url(auto_bg2.png?t=1751536917501) top center no-repeat; background-size:100%; bottom:-26px; left:-2px; position:absolute;z-index:2; display:block;}

.Area.auto .t1p4 .content_Area .ulOut{width:97%;margin:0px auto 0px auto; padding:30px 0px; overflow:hidden;}
.Area.auto .t1p4 .content_Area ul {width:93%;margin:0px auto;padding:0px;padding-bottom:0vw;position:relative;display:block;padding-top:15px;overflow:hidden; padding-right:0.5%;}
.Area.auto .t1p4 .content_Area ul li {float:left;display:inline-block; box-sizing:border-box;margin-left:0.5%;margin-bottom:0.5%;padding:0px;width:24.5%;overflow:hidden;position:relative;border-radius:0px;border:1px solid #fff; background:#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;background:#fff;padding-bottom:8px;}
.Area.auto .t1p4 .content_Area ul li a img { display:block;width:93%;height:auto; margin:9px auto 5px auto; border-radius:0px;}
.Area.auto .t1p4 .content_Area ul li a .text_box{width:90%;overflow:hidden;margin:0px auto 0px auto;}
.Area.auto .t1p4 .content_Area ul li a .text_box h3 { margin:5px auto 0px auto;max-height:32px;width:100%;overflow:hidden; background:#fff; }
.Area.auto .t1p4 .content_Area ul li a .text_box h3 p{display:block;width:96%;margin:0 auto;color:#ff005a;font-size:17px;line-height:25px;text-align:left;font-family: "微軟正黑體","Microsoft JhengHei",Helvetica;padding:0px; letter-spacing:0.5px; font-weight:bold;}
.Area.auto .t1p4 .content_Area ul li a .text_box h4 {display:block;margin:5px auto 3px auto;height:49px; font:18px "微軟正黑體","Microsoft JhengHei",Helvetica;text-align:left;color:#000;overflow:hidden;padding: 0 5px;line-height:24px; font-weight:bold;letter-spacing:0.5px;}

.Area.auto .t1p4 .content_Area ul li a .priceBox { margin:0; padding:0 8px 0 2px;color:#ff005a;overflow:hidden;height:45px;text-align:left;}
.Area.auto .t1p4 .content_Area ul li a .priceBox .money { font: normal 22px Century Gothic;text-align:center;margin-right:0px;}
.Area.auto .t1p4 .content_Area ul li a .priceBox .Price { font: normal 34px 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:20px;font-family:Century Gothic,"微軟正黑體"; color:#818181;}
.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:150px;height:40px;position:absolute; left:50%;margin-left:-75px;bottom:37px;z-index:3;text-align:center;color:#fff;padding:0px 15px 0px 5px; line-height:40px; font-size:21px; border-radius:50px 50px 50px 50px; font-weight:bold;background:#015460; }
.Area.auto .t1p4 .more span{display:inline-block;transform:rotate(90deg); -webkit-transform:rotate(90deg); -moz-transform:rotate(90deg); -o-transform:rotate(90deg); float:right; margin-left:-25px; font-size:18px;}


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

	/***************1列4品**************************/
	.Area.auto .t1p4{ width:100%;margin-top:0vw; padding-top:0vw; padding-bottom:0vw;}
	.Area.auto .t1p4 .t1p4_bg {width:100%;padding:0vw 0px 2.5vw 0px;}
	/****邊框***********/

	/***標題文字****/
	.Area.auto .t1p4 .t1p4_bg .listTitle{width:100%;height:20vw; margin:0 auto -0vw auto;}
	.Area.auto .t1p4 .t1p4_bg .listTitle h2{font-size:6.3vw;font-weight:bold;text-indent:0vw;margin-top:10vw;}

	/***入稿商品****/
	.Area.auto .t1p4 .content_Area{width:95%;position:relative;z-index:2; display:block;margin:0px auto 0px auto; padding:5px 0px 0px 0px;background-size:5%;}
	.Area.auto .t1p4 .content_Area::after{ content:"";width:100%; height:30px; background:url(auto_bg1.png?t=1751536917501) 50% 100% no-repeat; background-size:175%; top:-2vw; left:0px;}
	.Area.auto .t1p4 .content_Area::before{ content:"";width:100%; height:30px; background:url(auto_bg2.png?t=1751536917501) top center no-repeat; background-size:175%; bottom:-4vw; left:0px;}
	
	
	.Area.auto .t1p4 .content_Area .ulOut{width:96%;margin:1vw auto 3vw auto; padding:2vw 0px 18vw 0px;}
	

	.Area.auto .t1p4 .content_Area ul {width:97%;margin:0px auto;padding-bottom:0vw;padding-top:1vw; padding-right:0vw;}
	.Area.auto .t1p4 .content_Area ul li {float:left;display:inline-block; box-sizing:border-box;width:48.5%;padding:0vw;padding-bottom:1.5vw;margin-bottom:1vw;margin-left:1vw; border-radius:0px;border:0vw solid #8174e4; }
	.Area.auto .t1p4 .content_Area ul li a {margin: 0vw auto 0 auto; padding-bottom:0px;}
	.Area.auto .t1p4 .content_Area ul li a img { display:block; height:auto; margin:6px auto 6px auto; border-radius:0px;}
	.Area.auto .t1p4 .content_Area ul li a .text_box{width:94%;overflow:hidden;margin:0px auto 0px auto;}
	.Area.auto .t1p4 .content_Area ul li a .text_box h3 {margin:0px auto 0px auto;max-height:20px;}
	.Area.auto .t1p4 .content_Area ul li a .text_box h3 p{width:96%;font-size:14px;line-height:20px;letter-spacing:0.5px;font-weight:600; }
	.Area.auto .t1p4 .content_Area ul li a .text_box h4{margin:1vw auto 0.5vw auto;height:9.5vw;font-size:3.6vw;padding:0 0.5vw;line-height:4.7vw;font-weight:600;text-align:left;}
	.Area.auto .t1p4 .content_Area ul li a .priceBox { margin:0; padding:0px 2px ;height:8vw;text-align:left;letter-spacing:-0.3px;}
	.Area.auto .t1p4 .content_Area ul li a .priceBox .money { font: normal 4vw Century Gothic;text-align:left;margin-right:0px;}
	.Area.auto .t1p4 .content_Area ul li a .priceBox .Price { font: normal 6.1vw Century Gothic; letter-spacing:-0.5px;text-align:left;}
	.Area.auto .t1p4 .content_Area ul li a .priceBox  del{margin-right:2px;font-size:3.6vw; margin-left:-0.5px;}
	.Area.auto .t1p4 .content_Area ul li a .priceBox .slogan{font-size:3.5vw;padding-right:1px;}
	.Area.auto .t1p4 .content_Area ul li a .priceBox  small{font-size:3vw; letter-spacing:-0.2px; margin-left:0px;}
	
	.Area.auto .t1p4 .more{width:40%;height:40px;line-height:42px;font-size:20px; position:absolute;z-index:9; text-align:center;margin-left:-20%;top:auto;bottom:11.5vw; padding:0px 5px 0px 5px;border-radius:50px;  }
	.Area.auto .t1p4 .more span{margin-left:-40px; font-size:16px; margin-right:35px;}
	
}


/*************強檔熱銷 入稿專區!!!!!!**************************************************************/

/***標題背****/
.Area.hot .t1p4 .t1p4_bg{width:100%;padding:0vw 0px 2.5vw 0px;}
/****邊框***********/

/***標題文字****/
.Area.hot .t1p4 .t1p4_bg .listTitle{display:none;}
.Area.hot .t1p4 .t1p4_bg .listTitle h2{display:none;}
.Area.hot .t1p4 .t1p4_bg .t1p4_Title{margin:0px auto -31px auto; width:560px;height:140px; position:relative; z-index:7; }

/***入稿商品****/
.Area.hot .t1p4 .content_Area{}

.Area.hot .t1p4 .content_Area .ulOut{  }
.Area.hot .t1p4 .content_Area ul li { }

/***看更多****/
.Area.hot .t1p4 .more{bottom:70px;}

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

	/***************1列4品**************************/
	.Area.hot .t1p4{ width:100%;margin-top:0vw; padding-top:0vw; padding-bottom:5vw;}
	.Area.hot .t1p4 .t1p4_bg {width:100%;padding:0vw 0px 2.5vw 0px;}
	
	/***標題背****/
	.Area.hot .t1p4 .t1p4_bg .t1p4_Title{margin:0vw 0px -6% -3.8%;width:106%; height:auto;}

	/***入稿商品****/
	.Area.hot .t1p4 .content_Area{}
	.Area.hot .t1p4 .more{ padding:0px 5px 0px 5px;bottom:16.5vw;}

	
}

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


	
.Area.auto li:hover{transform:translateY(-8px); /*box-shadow:0px 0px 15px rgba(0,0,0,0.5);*/}
.Area.auto 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;
}
@media screen and (max-width:767px){
	
	.Area.auto li:hover{transform:translateY(0px); }
	
}

.Area.hot li:hover{transform:translateY(-8px);}
.Area.hot 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;
}
@media screen and (max-width:767px){
	
	.Area.auto li:hover{transform:translateY(0px); }
	.Area.hot li:hover{transform:translateY(0px); }
	
}