/* ################################################################
#
#  MainNav
#
################################################################ */

@media only screen and (max-device-width : 1280px), only screen and (max-width : 1280px) {
    #bannerarea2 {height: 64px;}
    #mainlogo {height: 130px;}
    #mainname {font-size: 38px;}
    #headerarea nav {margin-left: 275px;}
    #mainnavarea2 {height: 32px;}
    #mainnavarea a {font-size: 1.2rem;}
    #contentarea2 {padding-top: 110px;}
}
@media only screen and (max-device-width : 1190px), only screen and (max-width : 1190px) {
    #bannerarea2 {height: 60px;}
    #mainlogo {height: 120px;}
    #mainname {font-size: 34px;}
    #mainname2 {font-size: 12px;}
    #headerarea nav {margin-left: 250px;}
    #mainnavarea a {font-size: 1.1rem;}
    #contentarea2 {padding-top: 100px;}
}
@media only screen and (max-device-width : 1100px), only screen and (max-width : 1100px) {
    #headerarea nav {margin-left: 275px;}
    .contentarea, #bannerarea2 {width: 100%;}
    #mainlogo {margin-left: 0px;}
}

@media only screen and (max-device-width : 1020px), only screen and (max-width : 1020px) {
    #bannerarea2 {height: 56px;}
    #mainlogo {height: 100px;}
    #headerarea nav {margin-left: 225px;}
    #mainname {font-size: 30px;}
    #mainname2 {font-size: 12px;}
    #mainnavarea2 {height: 30px;}
    #mainnavarea a {font-size: 1.0rem; margin: 5px;}
    #contentarea2 {padding-top: 90px;}
}

@media only screen and (max-device-width : 890px), only screen and (max-width : 890px) {
    #bannerarea2 {height: 46px;}
    #mainlogo {height: 83px;}
    #headerarea nav {margin-left: 180px;}
    #mainname {font-size: 20px; right: 120px;}
    #mainname2 {font-size: 12px; top: 30px;}
    #mainnavarea2 {height: 27px;}
    #mainnavarea a {font-size: 1.0rem; margin: 3px;}
    #contentarea2 {padding-top: 75px;}
}

@media only screen and (max-device-width : 810px), only screen and (max-width : 810px) {
    #bannerarea2 {height: 37px;}
    #mainlogo {height: 70px;}
    #headerarea nav {margin-left: 150px;}
    #mainname {font-size: 16px; right: 120px; top: 5px;}
    #mainname2 {font-size: 11px; top: 20px;}
    #mainnavarea2 {height: 24px;}
    #mainnavarea a {font-size: 0.95rem; margin: 2px;}
    #contentarea2 {padding-top: 60px;}
}

@media only screen and (max-device-width : 740px), only screen and (max-width : 740px) {
    #mainname {font-size: 16px; right: 70px;}
    #mainname2 {font-size: 11px; right: 65px; display: none;}
    #mainnavarea2 {height: 20px;}
    #menuopener {display: block;}
    #menucloser {display: block;}
    h1 { font-size: 1.8rem;}
    h2 { font-size: 1.2rem;}
    #contentarea2 {padding-top: 50px;}
    
    
    #mainnav {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 400px;
        background: #000000;
        z-index: 1000;
        display: none;
    }

    #mainnav2 {
        margin: 10px;
    }
    
    #headerarea nav {
        margin-left: 0px;
    }
    
    #mainnavarea a {
        font-size: 1.3rem;
        display: block;
        margin: 10px;
    }
    
    
}