#container{
 background: #000000 url(../images/menu/bacgroundimage.png) no-repeat;
 background-size: 100% 100%;
 -moz-background-size: 100% 100%;
 -webkit-background-size: 100% 100%;
 -o-background-size: 100% 100%;
 -ms-background-size: 100% 100%;
}

#main-area {
 margin-left: 0 !important; /* ナビメニューの幅調整を強制無効 */
}

#menu_title {
 width: 100% !important;
 margin: 0 !important;
}
#menu_title input{
 position: absolute;
 top: 0px;
 left: 0px;
 margin: 8px 22px;
 width: 80%;
 width: calc(100% - 44px);
 height: 28px;
 background-color: #eeeeee;
 border: 0;
 border-radius: 5px;
 -webkit-border-radius: 5px;
 -ms-border-radius: 5px;
 -moz-border-radius: 5px;
 -o-border-radius: 5px;
            box-sizing: border-box;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
 -webkit-appearance: none;
}
#menu_title div{
 position: absolute;
 top: 0px;
 left: 0px;
 margin: 14px 22px;
 width: 80%;
 width: calc(100% - 44px);
 height: 16px;
 line-height: 16px;
 font-size: 16px;
 color: #797979;
 text-align: center;
}
#menu_title img{
 position: absolute;
 top: 12px;
 right: 36px;
}



#menu_area {
 width: 100%;
 height: 100%;
 height: calc(100% - 44px);
}
#menu_main {
 margin: 0;
 padding: 0;
 list-style-type: none;
}
#menu_main li {
 display: block;
 margin: 0;
 padding: 0;
 width: 100%;
 color: #ffffff;
 font-size: 16px;
 text-align: left;
 vertical-align: middle;
 z-index: 1;
 overflow: hidden;
 cursor: pointer;
}
#menu_main li.menu_mainfirst{
 height: 68px;
}
#menu_main li.menu_mainsecond{
 height: 44px;
}
#menu_main li.menu_mainthird{
 height: 44px;
}

#menu_main li.menu_mainfirst img{
 position: relative;
 float:left;
 margin-top: 10px;
 margin-bottom; 10px;
 margin-left: 14px;
 margin-right: 16px;
 width: 48px;
 height: 48px;
}
#menu_main li.menu_mainfirst .menu_text{
 position: relative;
 float:left;
 padding-top: 24px;
 padding-bottom; 24px;
 height: 20px;
 line-height: 20px;
 font-size: 20px;
}
#menu_main li.menu_mainfirst .menu_text:after {
 content: "";
 clear: both;
 display: block;
}

#menu_main li.menu_mainsecond img{
 position: relative;
 float:left;
 margin-top: 7px;
 margin-bottom; 7px;
 margin-left: 23px;
 margin-right: 25px;
 width: 30px;
 height: 30px;
}
#menu_main li.menu_mainsecond .menu_text{
 position: relative;
 float:left;
 padding-top: 14px;
 padding-bottom; 14px;
 height: 16px;
 line-height: 16px;
 font-size: 16px;
}
#menu_main li.menu_mainsecond .menu_text:after {
 content: "";
 clear: both;
 display: block;
}

#menu_main li.menu_mainthird img{
 position: relative;
 float:left;
 margin-top: 10px;
 margin-bottom; 10px;
 margin-left: 26px;
 margin-right: 28px;
 width: 24px;
 height: 24px;
}
#menu_main li.menu_mainthird .menu_text{
 position: relative;
 float:left;
 padding-top: 14px;
 padding-bottom; 14px;
 height: 16px;
 line-height: 16px;
 font-size: 16px;
}
#menu_main li.menu_mainthird .menu_text:after {
 content: "";
 clear: both;
 display: block;
}

#menu_main li.menu_margin {
 margin: 12px 18px;
 width: calc(100% - 36px);
 height: 0;
 border-bottom: 1px solid #4b4b4b;
 cursor: default;
}

#menu_main li a{
 display: block;
 margin: 0;
 padding: 0;
 width: 100%;
 height: 100%;
 color: #ffffff;
 font-size: 16px;
 text-decoration: none;
 text-align: left;
 vertical-align: middle;
 background: none;
 z-index: 1;
}
#menu_main li a:hover{
 background: rgba(0,0,0,0) url(../images/menu/rol.png) no-repeat;
 background-size: 100% 100%;
 -moz-background-size: 100% 100%;
 -webkit-background-size: 100% 100%;
 -o-background-size: 100% 100%;
 -ms-background-size: 100% 100%;
}
#menu_main li a:active{
 background: rgba(0,0,0,0) url(../images/menu/on.png) no-repeat;
 background-size: 100% 100%;
 -moz-background-size: 100% 100%;
 -webkit-background-size: 100% 100%;
 -o-background-size: 100% 100%;
 -ms-background-size: 100% 100%;
}

#LoginForm {
 display: none;
 margin: 0;
 padding: 60px 20px;
 font-size: 20px;
 color: #ffffff;
 width: calc(100% - 45px);
 height: calc(100% - 120px);
 border: 0;
}
#userarea {
 margin-left: 10px;
 margin-top: 20px;
 font-size: 16px;
}
#userarea input{
 margin-left: 8px;
 padding-left: 4px;
 width: calc(100% - 108px);
 height: 24px;
 line-height: 16px;
 font-size: 16px;
 border: 1px solid #dcdcdc;
            box-sizing: border-box;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
}
#passarea {
 margin-left: 10px;
 margin-top: 10px;
 font-size: 16px;
}
#passarea input{
 margin-left: 8px;
 padding-left: 4px;
 width: calc(100% - 108px);
 height: 24px;
 line-height: 16px;
 font-size: 16px;
 border: 1px solid #dcdcdc;
            box-sizing: border-box;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
}

#autoarea {
 margin-left: 10px;
 margin-top: 20px;
 height: 16px;
 line-height: 16px;
 font-size: 16px;
}
#autoarea input{
 opacity: 0;
 position: absolute;
 margin: 0;
 width: 16px;
 height: 16px;
}
#autoarea input[type="checkbox"] + label{
 display: block;
 padding-left: 24px;
 width: 100%;
 height: 16px;
 background: url(../images/icon/checkbox_off.png) left center no-repeat;
}
#autoarea input[type="checkbox"]:checked + label{
 background: url(../images/icon/checkbox_on.png) left center no-repeat;
}

#loginsubmit {
 margin: 20px 10px;
 width: calc(100% - 20px);
 height: 40px;
 line-height: 16px;
 font-size: 16px;
 color: #101010;
 background-color: #f7f7f7;
 border: 0;
 order-radius: 0;
 webkit-border-radius: 0;
 ms-border-radius: 0;
 moz-border-radius: 0;
 o-border-radius: 0;
 webkit-appearance: none;
 cursor: pointer;
}
#passerr {
 display : none;
 margin-left : 5px;
 margin-top : 2px;
 color: #ff0000;
 font-size: 80%;
}

@media screen and (max-width: 821px){ /* メニューボタンの幅に合わせてInformationエリアの幅を調整 */

}

@media screen and (max-height: 580px) { /* 縦方向が小さい時はInformationエリアを非表示にする */

}