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

/** 基本 **/

.Area.auto{margin:40px auto;overflow:hidden; padding:0px 0px 70px 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:6vw auto 6vw 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 20px 0px; position:relative; z-index:2;}
.Area.auto .t1p4 .t1p4_bg .bgbg{width:100%;  position:absolute; top:0px; left:0px; z-index:2; pointer-events:none; opacity:1 !important;}

/***標題背****/
.Area.auto .t1p4 .t1p4_bg .t1p4_Title{display:block;overflow:hidden;position:relative;z-index:3;}

/***標題文字****/
.Area.auto .t1p4 .t1p4_bg .listTitle{ position:relative;z-index:5;width:440px;height:92px; margin:0 auto -55px auto; background:url(auto_title1.png?t=1750819379346); 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; text-shadow:0px 2px 1px #a9001c;color:#fff;letter-spacing:1px;margin-top:20px;}

/***入稿商品****/
.Area.auto .t1p4 .content_Area{width:100%;position:relative;z-index:2; display:block;margin:0px auto 0px auto; padding:86px 0px  105px 0px;border-radius:0px;
 background:url(bgg2.png?t=1750819379346) no-repeat top center ; background-size:100%;/*border:1px solid #026d4d; box-shadow:0px 0px 0px 10px #c8ffc3 , 0px -5px 0px 7px #f4ffbf , 0px 0px 0px 12px #026d4d , 0px -5px 0px 12px #026d4d  , inset 0px 0px 15px 5px #218366 , inset 0px -10px 0px 10px rgba(0,72,50,0.6);*/}

.Area.auto .t1p4 .content_Area .ulOut{width:95%;margin:0px auto 0px auto; overflow:hidden;}
.Area.auto .t1p4 .content_Area ul {width:96%;margin:0px auto;padding:0px;padding-bottom:0vw;position:relative;display:block;padding:25px 0px 0px 0px;overflow:hidden; padding-right:0%; }
.Area.auto .t1p4 .content_Area ul li {float:left;display:inline-block; box-sizing:border-box;padding:0px;width:24%;overflow:hidden;position:relative;border-radius:10px;background:#fff;box-shadow:0px 0px 5px 0px #f89f9f;margin: 5px 5px;}
.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:100%;height:auto; margin:0px 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:110px;height:44px;position:absolute;right:165px;top:50px;z-index:3;text-align:center;color:#f4ffbf;padding:0px 15px 0px 10px; line-height:40px;font-size:22px; border-radius:0px 0px 15px 15px;/*border:1px solid #70001d;*/font-weight:bold;background:#f9615a;z-index: 4;}
.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){

	/***************1列4品**************************/
	.Area.auto .t1p4{ width:100%;margin-top:0vw; padding-top:0vw; padding-bottom:5vw;}
	.Area.auto .t1p4 .t1p4_bg {width:100%;padding:0vw 0px 0vw 0px;}
	.Area.auto .t1p4 .t1p4_bg .bgbg{display:none;}

	/***標題背****/
	.Area.auto .t1p4 .t1p4_bg .t1p4_Title{display:block;overflow:hidden;position:relative;z-index:3;}

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

	/***入稿商品****/
	.Area.auto .t1p4 .content_Area{width: 97%;margin: 0vw auto 0px auto;padding: 8vw 0px 3vw 0px;background: none;background-color:#fcd2c2;border: 1.6vw solid #d14538;box-shadow: inset 0px 0vw 3vw 1vw #fe6f86;border-radius: 4vw;}

	.Area.auto .t1p4 .content_Area .ulOut{width:97%;margin:5.5vw auto 3vw auto; padding:0vw 0px 0vw 0px; }
	.Area.auto .t1p4 .content_Area ul {width:97%;margin:0px auto;padding-bottom:2vw;padding-top:1vw; padding-right:0.5vw; }
	.Area.auto .t1p4 .content_Area ul li {float:left;display:inline-block; box-sizing:border-box;width:47%;padding:0vw;padding-bottom:2vw;margin-bottom:1vw;margin-left:1vw; border-radius:7px;}
	.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; width:100%;height:auto; margin:0px 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:26%;height:40px;line-height:42px;font-size:19px; position:absolute;z-index:9; text-align:center; right:-2%; top:18vw; padding:0px 10px 0px 0px; border-radius:50px 0px 0px 50px;/*border:1px solid #f89f9f;*/}
	
}



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


/***標題背****/
.Area.hot .t1p4 .t1p4_bg .t1p4_Title{margin:0px auto -105px auto; height:140px;}

/***背景****/
.Area.hot .t1p4 .t1p4_bg{width:100%;margin:0px auto 0px auto; padding:0px 0px 0px 0px; position:relative;}
.Area.hot .t1p4 .t1p4_bg .bgbg{ }

/***標題文字****/
.Area.hot .t1p4 .t1p4_bg .listTitle{display:none;}

/***入稿商品****/
.Area.hot .t1p4 .content_Area{padding:110px 0px  110px 0px;margin:0px auto 0px auto; background:url(bgg1.png?t=1750819379346) top center no-repeat;   background-size:100%;border-radius: 0;/*border:1px solid #317dcb; box-shadow:0px 0px 0px 10px #a9cff6 , 0px -5px 0px 7px #f4ffbf , 0px 0px 0px 12px #317dcb , 0px -5px 0px 12px #317dcb  , inset 0px 0px 15px 5px #0d528d , inset 0px -10px 0px 10px rgba(13,82,141,0.6);*/}
.Area.hot .t1p4 .content_Area ul li {box-shadow:0px 0px 5px 0px #f89f9f ;margin: 5px 5px; }

/***看更多****/
.Area.hot .t1p4 .more{top:48px;background:#c88836; color:#ffeccb;/*border:0px solid #e3fbff;*/ }


@media screen and (max-width:767px){
	
	.Area.hot:nth-of-type(1){ margin-top:30px;}
	
	/***************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 0vw 0px;}
	.Area.hot .t1p4 .t1p4_bg .bgbg{width:102%;height:22vw; top:5.5vw;}

	/***標題背****/
	.Area.hot .t1p4 .t1p4_bg .t1p4_Title{width:76%; height:auto;margin:0vw auto -15vw auto;background-size:100%;}

	/***入稿商品****/
	.Area.hot .t1p4 .content_Area{width:97%;margin:0vw auto 0px auto;padding:10vw 0px 3vw 0px;background: none;background-color:#fae1bc; border:1.6vw solid #cc8e18; box-shadow:inset 0px 0vw 3vw 1vw #fcab69;border-radius: 4vw;}
    
    .Area.hot .t1p4 .content_Area ul li {box-shadow:0px 0px 5px 0px #f89f9f;padding: 0vw;padding-bottom: 2vw;margin-bottom:0vw 0vw 1vw 1vw;border-radius: 7px;}

	.Area.hot .t1p4 .content_Area .ulOut{margin:7vw auto 3vw auto;}
	
	.Area.hot .t1p4 .more{top:17vw;width: 26%;}

	
}

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


	
.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); }
	
}