/******** DEFAULT SETTING ********/
.wrapper {
    width:88%;
}



/******** Header & Nav ********/
.hdwrap, .navwrap {
    width:90%;
    margin:0 auto;
}

.hdcol {
        width:50%;
    }

/**** H&N:834px ****/
@media screen and (max-width:836px) {
    
    .logo h1 {
        font-size:2.1em;
    }
    
    a.hdcon,em.hdcon2 {
        font-size:0.9em;
    }
    
    ul.nav a, a.navbtn2 {
        font-size:0.95em;
    }   
    
    header {
        padding:12px 0;
        border-bottom:2px solid #f0f0f0;
        box-shadow:0 1px 20px 1px rgba(0,0,0,0.1);
    }
    
    .hdwrap{
        width:100%;
    }
        
    .logo {
        float:none;
        width:100%;
    }
    
    .logo h1 {
        text-align:center;
    }
    
    .hdcol {
        float:none;
        width:100%;
        text-align:center;
        margin-top:20px;
    }
    
    a.hdcon {
        font-size:1.1em;
    }
    
       
    i.menubtn {
        display:block;
    }
    
    nav {
        position:relative;
    }
    
    .navwrap {
        width:100%;
        background:#0b0b0b;
        display:none;
        position:absolute;
        top:0;
        left:0;
        z-index:3000;
    }
    
    ul.nav {
        float:none;
        width:100%;
        text-align:center;
    }
    
    ul.nav li {
        display:block;
        margin-right:0;
        border-bottom:1px solid #666666;
    }
    
    ul.nav a {
        padding:10px 0;
    }
    
    
    .ncolR {
        display:none;
    }
        
}

/**** H&N:414px ****/
@media screen and (max-width:416px) {
  
    .logo h1 {
        font-size:1.6em;
    }
    
    a.hdcon {
        font-size:0.95em;
    }
    
    span.hdicon {
        margin-right:3px;
    }
    
    a.fblink {
        font-size:0.7em;
        margin-left:3px;
    }
    
    i.l {
        margin:0 5px;
    }
    
}





/******** Home ********/
.hmban {
    width:100%;
}

.rbtag {
    width:90%;
    position:absolute;
    top:-35px;
    left:5%;
}




/**** Home:834px ****/
@media screen and (max-width:836px) {
        
    .rbtag {
        width:90%;
        position:absolute;
        top:-20px;
        left:5%;
    }
    
    p.rbtag1 {
        font-size:1.5em;
    }

    p.rbtag2 {
        font-size:1.2em;
    }
    
    .hmsec1 h1 {
        font-size:1.2em;
    }

    .hmsec1 h2 {
        font-size:1.6em;
    }

    .hmsec1col {
        width:100%;
        margin:50px 0 0;
    }
    
    .hmsec1girl {
        display:none;
    }
    
    .brncol {
        width:48%;
        margin:40px 4% 0 0;
    }
    
    .brncol2, .brncol4 {
        margin-right:0;
    }
    

}


/**** Home:640px ****/
@media screen and (max-width:642px) {
    
    .rbtag {
        padding:20px 0;
    }
    
    p.rbtag2 {
        display:block;
        margin-top:15px;
        margin-left:0;
    }    

}


/**** Home:480px ****/
@media screen and (max-width:482px) {
    
    p.rbtag2 {
        margin-top:10px;
        font-size:1em;
    }
    
    table.hmrb-tab th {
        font-size:0.9em;
    }
    
    table.hmrb-tab h3,
    table.hmrb-tab p {
        font-size:0.9em;
    }
    
    a.linkbtn1 {
        font-size:0.9em;
    }
    
    .hmsec2 h1 {
        font-size:1.4em;
    }
    
    .hmsec2 h2 {
        font-size:1.5em;
    }
    

}


/**** Home:414px ****/
@media screen and (max-width:416px) {
    
    .rbtag {
        width:90%;
        position:absolute;
        top:-5px;
        left:5%;
    }
    
    p.rbtag1 {
        font-size:1.2em;
    }

    p.rbtag2 {
        font-size:0.9em;
        margin-top:3px;
    }
    
    .hmsec1 h1 {
        font-size:1em;
    }

    .hmsec1 h2 {
        font-size:1.2em;
    }
    
    table.hmrb-tab p {
        font-size:0.9em;
    }
    
    .brncol {
        width:100%;
        margin:0;
        float:none;
    }
    
}


/**** Home:370px ****/
@media screen and (max-width:372px) {
    
    .rbtag {
        width:94%;
        position:absolute;
        top:-5px;
        left:3%;
    }
    
    table.hmrb-tab p {
        padding:0 10px;
        line-height: 150%;
    }
    
}




/******** Pg Banner ********/
.pgbanlogo {
    width:25%;
    float:left;
    margin:50px 0 40px;
}

.pgbanrow {
    padding:25px 0;
}

/**** Pg banner:834px ****/
@media screen and (max-width:836px) {
    
    .pgbanlogo {
        width:30%;
    }
    
    .pgbanlogo h3 {
        font-size:1.1em;
    }
    
    a.pgbanlink {
        font-size:0.85em;
    }
    
}


/**** Pg banner:640px ****/
@media screen and (max-width:646px) {
    
    .pgbanlogo {
        width:100%;
        float:none;
        margin:50px 0 0;
        text-align:center;
    }
    
    .pgbanlogo img {
        display:inline-block;
        width:140px;
    }
    
    .pgbanlogo h3 {
        margin-top:10px;
        font-size:1em;
    }
    
    .pgbancar,
    .pgbancar-axia,
    .pgbancar-alza {
        width:70%;
        float:none;
        margin:0 auto;
    }
    
    .pgbancar-axia {
        width:50%;
        float:none;
        margin:20px auto 0;
    }
    
    .pgbanrow {
        text-align:center;
        
    }
    
}


/**** Pg banner:480px ****/
@media screen and (max-width:482px) {
    
    .pgbanlogo {
        margin:30px 0 0;
    }
    
    a.pgbanlink {
        font-size:0.8em;
    }
    
    
}


/**** Pg banner:414px ****/
@media screen and (max-width:416px) {
    
    .pgbanlogo img {
        width:120px;
    }
    
    .pgbanlogo h3 {
        font-size:0.9em;
    }
    
    a.pgbanlink {
        font-size:0.7em;
        padding:8px 20px;
    }
    
    a.pgbanlink2 {
        margin-left:8px;
    }
    
}



/******** Car Section ********/
.carwrapper {
    width:98%;
}

h1.sectag {
    font-size:1.4em;
}

p.txt1 {
    font-size:1.2em;
}

p.txt2 {
    font-size:1.3em;
}

.formpanel {
    width:90%;
}


/**** Car section:834px ****/
@media screen and (max-width:836px) {
    
    p.txt1 {
        padding:0 40px;
        margin-top:30px;
    }
    
    
    table.pricetab {
        margin-top:40px;
    }
    
    table.pricetab th {
        font-size:0.9em;
        padding: 10px;
    }
    
    table.pricetab h2,
    table.pricetab p {
        font-size:0.8em;
        padding:0 8px;
    }
    
        
    .ytvideo,
    .gupcol1,
    .gupcol2 {
        width:80%;
    }
    
    .galcol1, .galcol2 {
        float:none;
        width:100%;
    }
    
    
}


/**** Car section:480px ****/
@media screen and (max-width:482px) {
    
    section.prices,
    section.vdsec1,
    section.clsec,
    section.galsec,
    section.gearup,,
    section.piconly,
    section.testdrive {
        padding:0px 0;
    }
    
    
    h1.sectag {
        font-size:1.1em;
    }
    
    i.bdL, i.bdR {
        width:40px;
        bottom:5px;
    }
    
    i.bdL {
        margin-right:15px;
    }
    
    i.bdR {
        margin-left:15px;
    }
    
    p.txt1 {
        font-size:1em;
    }

    p.txt2 {
        font-size:1.1em;
    }
    
    table.pricetab th {
        font-size:0.8em;
    }
    
    ul.remark {
        margin:20px 0 0 30px;
    }
    
    .pic {
        width:100%;
        margin:30px auto 0;
    }
    
    .ytvideo iframe,
    .gupcol2 iframe {
        height:250px;
    }

    
    .formpanel {
        width:100%;
    }
    
    label.info {
        display:inline-block;
        float:none;
        width:auto;
        font-size:0.85em;
    }

    .fmrow i {
        display:inline-block;
        float:none;
        width:auto;
        margin-left:10px;
    }

    .fill {
        float:none;
        width:100%;
        margin-top:8px;
    }
    
    ul.tdlist, label.tickitem {
        font-size:0.8em;
    }
    
    
}

/**** Car section:414px ****/
@media screen and (max-width:416px) {
    
    h1.sectag {
        font-size:0.95em;
    }
    
    i.bdL {
        margin-right:10px;
        width:25px;
    }
    
    i.bdR {
        margin-left:10px;
        width:25px;
    }
    
    .galcol1, .galcol2 {
        margin-bottom:20px;
    }
    
    .galbox {
        float:none;
        width:100%;
        margin-bottom:20px;
    }
    
    
    .ytvideo iframe,
    .gupcol2 iframe {
        height:200px;
    }
    
}



/******** Price & Promotion ********/

@media screen and (max-width:642px) {
    .pricemd {
        margin-top:40px;
    }

    img.pricemd-logo {
        width:160px;
    }
    
    i.bdL2, i.bdR2 {
        display:none;
    }
    
}


/******** Free Gift ********/
.giftpanel {
    width:100%;
}

@media screen and (max-width:836px) {
    
    body#freegift {
       background-position:center right;
    }
    
    .giftpanel {
        padding-left:30px;
    }
    
    .fgleft {
        float:none;
        width:100%;
    }

    .fgright {
        float:none;
        width:100%;
        margin-top:6px;
    }
    
    ol.fglist {
        font-weight:400;
        color:#555555;
    }
    
    
}

@media screen and (max-width:480px) {
    
    body#freegift {
       background-position:bottom center;
    }
    
    ol.fglist {
        font-size:1em;
    }
    
    
}


    


/******** Need Support & Footer ********/

.ftwrapper {
    width:70%;
    margin:0 auto;
}

.ftcol {
    width:50%;
    border-right:none;
    text-align:left;
    padding-left:40px;
}
    
.ftcol3 {
    clear:both;
}



/**** Footer:1024px ****/
a.fblink2 {
    margin:5px 0 0 25px;
}




/**** Footer:640px ****/
@media screen and (max-width:642px) {
    
    
    section.support p {
      font-size:1.2em;
    }

    section.support h4 {
      font-size:1.5em;
    }

    section.support h5 {
      font-size:1.8em;
    }
    
    .ftwrapper {
        width:80%;
    }
    
    .ftcol {
        text-align:center;
        padding-left:0;
    }
    
    span.fticon {
        margin-right:0;
    }
    
    a.ftcon1, em.ftcon2 {
        display:block;
        margin-top:20px;
    }
    
    .ftrow2 {
        padding:30px 0;
    }
    

}



/**** Footer:480px ****/
@media screen and (max-width:480px) {
    .ftwrapper {
        width:100%;
    }
    
    .ftcol {
        float:none;
        width:100%;
        padding:10px 0 10px 0;
    }
    
    span.fticon {
        margin-right:6px;
        font-size:1em;
    }
    
    a.ftcon1, em.ftcon2 {
        display:inline-block;
        margin-top:0;
        font-size:0.9em;
    }
    
    a.fblink2 {
        margin:5px 0 0 35px;
    }
    

}


/**** Footer:414px ****/
@media screen and (max-width:416px) {
    
    section.support p {
        font-size:1em;
    }

    section.support h4 {
        font-size:1.2em;
    }

    section.support h5 {
        font-size:1.4em;
    }
    
    h1.ftlogo {
        font-size:1.3em;
    }
    
    p.cpright {
        font-size:0.7em;
    }
    
}