/*========================
　smartphone　bottom menu
　========================*/


.mini-text{font-size:10px;}/*文字大きさ*/

ul.bottom-menu {
    position: fixed;
    left:0;
    bottom:0;
    width: 100%;
    height:42px;/*高さ*/
    margin:0;
    padding:0;
    background-color:#fff;/*背景色*/
 /*   border-top:2px solid #FFD700;バーの上の線*/
    border-bottom:2px solid #FFD700;/*バーの下の線*/
    z-index:30;
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

ul.bottom-menu li {
    float:left;
    width:25%;
    background-color:#fff;/*背景色*/
    list-style-type:none;
    text-align:center;
    font-size:24px;/*アイコンのサイズ*/}

.bottom-menu li a {
    display: block;
    color:#505050;/*アイコン＆文字の色*/
    padding-top:0px;
    padding-bottom:5px;
    line-height:10px;
    text-decoration:none; }

.bottom-menu li a:hover {
    color:#a9a9a9;/*マウスオーバー時の色*/}

.bottom-menu li.bopen {
    display: block;
    color:#505050;/*アイコン＆文字の色*/
    padding-top:0px;
    padding-bottom:5px;
    line-height:10px;
    text-decoration:none; }

/*
.bopen {
   cursor: pointer;
}

.bopen.touch {
   background-color: #ccc;   
}


/* === 展開メニュー === */


ul.menu-second-level {
  transition: 1s;
  bottom: -500px;/*高さ*/
  z-index:-1;
}


ul.menu-second-level li a{
    border-bottom:1px solid #bbb;/*展開の枠点線*/
    font-size:15px;/*展開メニューの文字サイズ*/
    line-height:30px;/*文字の縦幅*/}

.menu-second-level li a:hover {
    background: lightgrey;/*マウスオーバーの色*/}

li.menu-width-max ul.menu-second-level {
    position: absolute;
    left: 0;
    box-sizing: border-box;
    width: auto;
    padding:0;}

li.menu-width-max:hover ul.menu-second-level {
    bottom: 44px;/*高さ*/
        z-index:1;
    border-top: 2px solid #bbb;
}

li.menu-width-max ul.menu-second-level li {
    float: left;
    width: 100%;
    border: none;
}

@media ( min-width : 768px )

{
ul.bottom-menu{
display: none;
}
}

