/* CSS Document */	
@charset "UTF-8";

/***主頁標準格式***/
#main{width:960px; margin:auto;}
.main-content p{ color:#595757;}
.main-content .norm-box{ font-size:0.8em;}
a{color: #000;}

/***共用***/
.good_list{padding: 2em 10px 1em;}
 a:hover .txt_box{color: #f27900;}

/****banner****/
#main #banner {background: url(/promote/images/travel-show-gift/banner.jpg) no-repeat; width: 100%; height: 500px; position: relative; padding: 0;background-size: 100%;}
#banner .box_b{position: absolute; bottom: 5px; left: 33%;}
#banner h1{width: 100%; height: 0; overflow: hidden;}
#banner a:hover{filter: brightness(1.15);}

/****最新商品****/
#new-goods{background: #e5625e;}
#new-goods h2{width: 100%; background: #e73828;}
.good_list>.box_b{float: left; width: 25%; display: block; padding: 0 10px; position: relative; margin-bottom: 20px;}
.good_list .item{background: #fff; padding:5px;}
#new-goods h3{text-align: center; font-size: 1.2em; padding: 5px 0 2px; border-bottom: 1px solid #c9c9c9;}
#new-goods .img_box{padding: 0 8px; display: flex; position: relative;}
#new-goods .img_box:after,#travel .img_box:after, #exhibition .img_box:after{display: block; content: ""; padding-bottom:100%; float: left;}
#new-goods .txt_box{padding: 0 3px; font-size: .95em; position: relative;}
#new-goods .txt_box *{float: left}
#new-goods .txt_box h4{width: 100%;}
#new-goods p{font-size: .6em; width: 100%; display: block; height: 16px; line-height: 16px;}
#new-goods b{width: 36px; display: block; text-align:justify;text-align: justify;
　　text-justify: inter-ideograph;
　　-ms-text-justify: inter-ideograph; /*IE9*/
　　-webkit-text-align-last: justify; /*Chrome*/
　　-moz-text-align-last: justify; /*Firefox*/}
#new-goods b:after{display: inline-block; content: ''; width: 100%}
#new-goods .txt_box font:before{content: ':'; margin: 0 1px;}
#new-goods .txt_box span{position: absolute; bottom: 0; right: 3px; color: #2da7e0;}
#new-goods .txt_box span:before{content: '<';}
#new-goods .txt_box span:after{content: '>';}
.good_list img{margin: auto; display: block;}
.new:before{position: absolute; top: 3px; left: 3px; width: 46px; height: 46px; display: block; background: url(/promote/images/travel-show-gift/new-icon.png) top left/cover; content: '';}
#new-goods a:hover span{color: #0051d3;}

/****精選旅遊禮贈品****/
#travel{background: #5dbfb7;}
#exhibition{background: #dc3f7e; padding-bottom: 10px;}
#exhibition h2{background: #d70050; width: 100%;}
#travel h2{background: #00a29a; width: 100%;}
#travel h3, #exhibition h3{width: 100%; border-bottom: 1px solid #000; font-size: .9em; padding: 2px 0;}
#travel h4, #exhibition h4{margin: 5px 0 1em; font-size: 1.05em;}
#travel .img_box, #exhibition .img_box{display: flex;}
#travel .txt_box span,#exhibition .txt_box span{width: 100%;}
#travel .txt_box span *, #exhibition .txt_box span *{display: inline-block; width: 49%;}
#travel .txt_box span p, #exhibition .txt_box span p{font-size: .85em;}
#travel .txt_box span em, #exhibition .txt_box span em{color:#e4007e; font-weight: bold; font-size: 1.1em; text-align: right;}

@media  only screen and (max-width: 960px){
    #banner .box_b img{width: 32%; margin: 0;}
    .good_list>.box_b{width:calc(33.3333% - 5px); background: #fff; margin:0 2.5px 12px; }
    .good_list{display: flex; flex-flow: wrap; justify-content: flex-start;}
    #travel .txt_box span p, #exhibition .txt_box span p{width: 100%;}
    #travel .txt_box span em, #exhibition .txt_box span em{width: 100%;}
}
@media  only screen and (max-width: 580px){
    #banner .box_b {width: 100%; left: 0;}
    .good_list>.box_b{width:calc(50% - 5px); background: #fff; margin:0 2.5px 12px; }
}
@media  only screen and (max-width: 500px){
    
}
@media  only screen and (max-width: 350px){
    .good_list>.box_b{width: 100%;}
}