*{font-family: "微軟正黑體", Arial, Helvetica, sans-serif;}
.topBanner{width: 100%; position: relative;}
.topBanner > .bannerBG{width: 100%;display: block;}
#title{position: absolute; width:60%; top:10%; left: 20%;}
.section1{background-color: #e1f5fe; width: 100%; text-align: center; padding:20px 0px 0px;}
.section1{background-image: url(../img/bgtop.jpg); background-size: 100%; background-position-y: bottom; background-repeat: no-repeat;}
.section2{background-color: #0086ca; width: 100%; text-align: center; padding:20px 0px;}
.section2{background-image: url(../img/bg.jpg); background-size: cover; background-position-y: bottom; background-repeat: no-repeat;}
.max1400{width: 90%; max-width: 1400px; margin:auto;}
.linkMenu{padding: 0px 0px 20px;}
.linkMenu > li{display: inline-block; position: relative;}
.linkMenu > li > a{transition: 1s; display: block; text-decoration: none; font-size: 20px; letter-spacing: 1px; padding:5px 20px; margin:10px; color:#66ccff; background-color: #001f52; border-radius: 50px;}
.linkMenu > li > a:hover{background-color: #0086ca; color:#001f52;}
.prodArea{margin:-20px auto; margin-bottom: 20px; background-color: #f3efea; width: 100%; max-width: 1200px; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);}
.prodArea > h4{background-color: #66ccff; color:#fff; padding: 5px; margin-bottom: 10px;font-size: 24px;}
.group-type-ph{font-size: 0px;}
.ph{position: relative; width: 94%; margin:3%; display:inline-block; overflow: hidden; font-size: 16px; border-bottom: 1px dotted #888;}
.ph:hover{box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.1)}
.ph > a{text-decoration: none;}
.ph-img,.ph-img > img{width: 100%;}
.ph-title,.ph-detail{text-align: justify;}
.ph-title{font-size: 20px; vertical-align:middle; color:#333; font-weight: 600;padding: 5px 10px;}
.ph-detail{font-size:16px; color:#0093d0; font-weight: 300; padding:10px 10px 30px;}
.price{position: absolute; color:#e2147f; bottom:10px; right:10px; font-size: 20px;}
.price > span{font-size: 24px;}

@media only screen and (min-width:767px){
    .ph{width:48%;margin: 1%}
    .prodArea{margin-top:-60px;}
    .linkMenu{padding: 0px 0px 100px;}
    .linkMenu > li:nth-child(odd):before{content: '';background-image: url(../img/plane.png); display: block; width: 75px; height: 36px; position: absolute; bottom: 15px; left: -65px; transform: rotateY(180deg);}
    .linkMenu > li:nth-child(even):before{content: '';background-image: url(../img/plane.png); display: block; width: 75px; height: 36px; position: absolute; bottom: 15px; right: -65px;}
}
@media only screen and (min-width:1000px){
    #title{ max-width: 807px; left: calc(50% - 403px); top:calc(50% - 170px); }
    .ph{width: 31%;}
    .section2{background-image: url(../img/bg.jpg); background-size: cover; background-position-y: top; background-repeat: no-repeat;}
    .linkMenu{padding: 0px 0px 150px;}
}
@media only screen and (min-width:1400px){
    .ph{width: 23%;}
    .prodArea{margin-top:-100px;}
    .linkMenu{padding: 0px 0px 200px;}
}
@media only screen and (min-width:1900px){
    .prodArea{margin-top:-200px;}
}