@import url("reset.css");

/*******-----------------1024px------------------*******/
@media screen and (max-width: 1024px) {	
.guidescon{
    padding-bottom: 40px;
} 
.cms23{
    width: 90%;
}
.pcimg{
    margin-left: 50px;
    width: 90%;    
}
.parkguides{
    margin:0px auto;
    max-width: 900px;
    width: 100%;
} 
.parkguides h4{
    font-size: 30px;
}
.parkguides h4:before {
    font-size: 26px;
}
/**app介紹**/
.infoo{   
    width: 300px;
    margin:30px auto;
    float: left;
}
.infoo img{
    width:300px; 
}
.infoo-bg,.infoo-bg1,.infoo-bg2{
background-image:none;
}
.infoo-bg h4,.infoo-bg1 h4,.infoo-bg2 h4{    
    margin-left:0px;      
}
.infoo-bg h5,.infoo-bg1 h5,.infoo-bg2 h5{
    width:100%;      
} 
}
/*******-----------------800px------------------*******/
@media screen and (max-width:800px) {
/**app介紹**/
.infoo{   
    width: 390px;
    margin:30px auto;
    float: none;
}
.infoo img{
    max-width:390px; 
    width:100%;
}
.infoo-bg,.infoo-bg1,.infoo-bg2{
    margin:0px auto;
    width: 310px;
    height: 145px;
}
.infoo-bg h4,.infoo-bg1 h4,.infoo-bg2 h4{    
    margin-left:60px;      
}
.infoo-bg{
    background-image: url(../images/info1.png);
}
.infoo-bg1{
    background-image: url(../images/info2.png);
}
.infoo-bg2{
    background-image: url(../images/info3.png);
}
.clear{
    margin-bottom:-30px;
} 
}
/*******-----------------640px------------------*******/
@media screen and (max-width:640px) {
.header {
    width:100%;
    height:610px;
    background: url(../images/m-header.png) no-repeat center top fixed;
    position: relative;
}
.bg_top {
    background:none;
}
.mobileimg{
	display: block;width: 100%;  
}
.pcimg{
	display:none;
}
#menu{
    width:360px;
}
#menu li a.nav01 {
    width: 86px;
    height: 45px;       
    background: url(../images/mm1.png) no-repeat;
}
#menu li a.nav02 {
    width: 108px;
    height: 45px;       
    background: url(../images/mm2.png) no-repeat;
}
#menu li a.nav03 {
    width: 86px;
    height: 45px;       
    background: url(../images/mm3.png) no-repeat;
}
 
}


/*******-----------------480px------------------*******/
@media screen and (max-width:480px) {
 .product h3,.parkguides h3{
    margin:20px auto;
}
.guidescon h6 img{
    width: 194px;
    margin-bottom: 10px;
    margin-right:0px;
}
}

/*******-----------------360px------------------*******/
@media screen and (max-width:360px) {
.header {
    width:100%;
    height:610px;
    background: url(../images/mm.jpg) no-repeat center top fixed;
    position: relative;
}
/*選單*/
#menu{
    width:240px;

}
#menu li a.nav01 {
    width: 55px;
    height:55px;       
    background: url(../images/mmm1.png) no-repeat;
}
#menu li a.nav02 {
    width: 55px;
    height:55px;       
    background: url(../images/mmm2.png) no-repeat;
}
#menu li a.nav03 {
    width:55px;
    height:55px;       
    background: url(../images/mmm3.png) no-repeat;
}
/**app介紹**/
.infoo{   
    width: 280px;
}
.infoo img{
    max-width:280px; 
}
.infoo-bg,.infoo-bg1,.infoo-bg2{
    width: 310px;
}
.infoo-bg h4,.infoo-bg1 h4,.infoo-bg2 h4{    
    margin-left:0px;      
}
.infoo-bg,.infoo-bg1,.infoo-bg2{
    background-image:none;
}
/*標題*/

.cms23{
    border: 6px solid #ff9231;
    border-radius: 40px;
    margin-bottom: 150px; 
}
.product h3,.oceanpark h3,.parkguides h3{
    background:none;
    width:100%;
    height:auto;
    font-size:36px;
    line-height: 55px;
    text-align: center;
    color: #fff;
}
.product h3,.oceanpark h3{
    margin:0px auto 10px;
    background-color: #ff9231;
}
.parkguides h3{
    margin:20px auto 10px;
    background-color: #dfd000; 
}

.parkguides h4{
    font-size: 28px;
    line-height:30px;    
    padding:10px 30px;
    text-align: justify;
}
.parkguides h5,.parkguides h6{
    text-align: justify;
} 
.parkguides h6 a{   
    width: 260px;
    text-align:left;
     font-size: 17px;
}

}