@charset "utf-8";
/* CSS Document */
/* 表頭 */
body{
	font-family:Arial, Helvetica,"微軟正黑體",sans-serif;
	font-size:15px;
	color: #515b60;}
.wraper{
	width:100%;
	height:auto;}
.A_Tour_btn{
	display:block;
	width:50px;
	height:50px;
	background-image: url(../images/menu.png); 
	position: fixed;
	top: 50px;
	right: 20px;
	z-index: 300;
	cursor: pointer;
}

ul.tabs{
	display:none;
	width:25%;
	height:100%;
	background-color:#333;
	background-color:rgba(51,51,51,0.9);
	position:fixed;
	z-index:400;
	padding: 50px 0 0 0;
	right:0;
	top:0px;}
ul.tabs li{
	width:100%;
	float:left;
	text-align:center;
	border-bottom:1px solid #999;}
ul.tabs li a{
	display: block;
    width: 100%;
    line-height: 60px;
    font-size: 21px;
    padding: 0px;
    text-decoration: none;
    color: white;}
ul.tabs li a:hover{
	color:#333;
	background-color:#999;}
.gotop{
	display: none;
	width: 50px;
    height: 50px;
    border-radius: 25px;
    background-color:#09bb3b;
    text-align: center;
    line-height: 50px;
    color: white;
    position: fixed;
    right: 30px;
    bottom:50px;
    z-index: 3000;
    font-size: 18px;
	cursor:pointer;}
.gotop:hover{
	background-color:#153a2e;}
/* 內容 */
.topwraper{
    height: 100vh;
    background-image: url(../images/topbg.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
	position: relative;}
.topwraper_inner{
	width:1000px;
	height:auto;
	margin:0 auto;}
h6.airplane{
	display: block;
    width: 24vw;
    height: auto;
    position: absolute;
    top: 5vw;
    left: 0;
    z-index: 15;}
h6.airplane img{
	width:100%;
	height:auto;}
a.godown{
	display: block;
	width: 30px;
	height:25px;
	background-image: url("../images/dn.png");
	margin: 2vw auto;
	cursor: pointer;
	animation: DN 1.5s linear;
	-webkit-animation-iteration-count: infinite;
}

@keyframes DN{
	from{transform: translateY(10px);
	}
	to{transform: translateY(0px);}
}
.toptitle{
	width: 100%;
	margin: 0 auto;
	text-align: center;
	padding-top:13vw;
	padding-bottom: 2vw; 
}
.toptitle h1{
	display: block;
    color: #515b60;
    font-size: 4vw;
    font-weight: 300;
    padding-bottom: 26px;
   }
 .toptitle h6{
 	font-size: 1.2vw;
 	font-weight: 300;
 	letter-spacing: 8px;
 	 color: #515b60;
 }
.topbg{
	width:1920px;
	max-width:100%;
	height:432px;
	background-image:url(../images/toppic.png);
	background-position:bottom;
	background-repeat:no-repeat;
	background-size:contain;
	position:absolute;
	bottom:0;}
.menu{
	width:50vw;
	margin: 0 auto;
	position:relative;
	z-index:5;}
.menu ul{
	text-align: center;}
.menu ul li{
	display:inline-block;
	margin: 6px 2px;}
.menu ul li a{
	width: 9vw;
    display: block;
    text-decoration: none;
    text-align: center;
    line-height: 5vh;
    color: #515b60;
    border: 1px solid #b4ccd8;
    border-radius: 25px;
    font-size: 1.2vw;
    font-weight: bold;
    transition: all 0.5s linear;
    margin: 0 11px;}
.menu ul li a:hover{
	background-color:#FFC;
	border: 1px solid #fff;
	background-color:rgba(232,222,207,1);
	border-color: #fff;}

.box{
	width:100%;
	height:auto;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center top;
	background-attachment:fixed;}
.box1{
	background-image:url(../images/01bg.jpg);}
.box2{
	background-image:url(../images/02bg.jpg);}
.box3{
	background-image:url(../images/03bg.jpg);}
.box4{
	background-image:url(../images/04bg.jpg);}
.box5{
	background-image:url(../images/05bg.jpg);}
.box6{
	background-image:url(../images/06bg.jpg);}
.box7{
	background-image:url(../images/07bg.jpg);}
.box8{
	background-image:url(../images/08bg.jpg);}

.box .headerbox{
	width: 1000px;
    margin: 0 auto;
    text-align: center;
    padding: 6vw 0;}
.box .headerbox h2.title{
	display: block;
    margin: 0 auto;
    font-size: 3vw;
    width: 20vw;
    background: rgba(0,0,0,0.5);
    line-height: 7vw;
    color: #dcebf1;
	padding: 0.5vw;}
span.innerbox{
	display: block;
    border: 1px solid #dcebf1;}
.box .contentbox{
	width:100%;
	background-color:#dcebf1;
	padding:50px 0px;}
.box .contentbox .contentinner{
	width:1000px;
	height:auto;
	margin:0 auto;}
.product{
	padding:10px;
	border-bottom:1px dotted #999999;
	overflow:hidden;
	margin:0 10px;}
.product:hover{
	background-color:rgba(255,255,255,0.9);
	transition:background-color 0.5s linear;}
.product a{
	display:block;
	color:#555f5e;
	text-decoration:none;}
.product a:hover{
	color:#f36400;
}
.product a h3{
	width: 75%;
	font-size:18px;}
.product .date{
	margin-top:10px;}

.ProductDateLabel {
     display: inline-block;
    padding: 5px;
    background-color: #f36400;
    margin-right: 10px;
    font-size: 14px;
    color: #dcebf1;
}
.product .date a{
	display:inline-block;
	margin-right:5px;}
.product span.price{
	display:inline-block;
	font-size:12px;
	float:right;
	margin-top:-25px;}
.product span.price b{
	font-size:36px;
	color:#a0282e;}
a.more{
	display:block;
	font-size:16px;
	font-weight:700;
	float:right;
	color:#6C1318;
	margin:15px 10px 0px 0px;}



@media screen and (max-width :999px){
*{box-sizing: border-box;}
ul.tabs{
	width:35%;}
ul.tabs li{}
ul.tabs li a{}
ul.tabs li a:hover{}

/* 內容 */
wraper{
	padding-top:35px;}
.topwraper{
	height: 0;
    background-image: url(../images/head_sp.jpg);
    padding-bottom: 97%;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;}
h6.airplane{
	display:none;}
.topwraper_inner{
	display:none;}

.box .headerbox{
	width: 100%;
    padding:20vw;
	background-size: cover;}
.box .headerbox h2.title{
    font-size: 8vw;
    width: auto;
    height: 20vw;
    padding: 1vw;
    line-height: 17.5vw;}
span.innerbox{}
.gotop{
	bottom: 15px;
	right: 10px;
} 
.box .contentbox{
	padding:20px 0px;}
.box .contentbox .contentinner{
	width:100%;}
.box{
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center top;
	background-attachment:scroll;}
.box1{
	background-image: url(../images/phonebg01.jpg);}
.box2{
	background-image: url(../images/phonebg02.jpg);}
.box3{
	background-image: url(../images/phonebg03.jpg);}
.box4{
	background-image: url(../images/phonebg04.jpg);}
.box5{
	background-image: url(../images/phonebg05.jpg);}
.box6{
	background-image: url(../images/phonebg06.jpg);}
.box7{
	background-image: url(../images/phonebg07.jpg);}
.box8{
	background-image: url(../images/phonebg08.jpg);}
.product a h3{
	width: 100%;
}
.box .contentbox{
	padding:20px 0px;}
.box .contentbox .contentinner{
	width:100%;}
.product span.price{
	margin-top:0;}
}