@charset "utf-8";

/*
	スマートフォン用ドロップダウンメニュー20160608作成（現時点ではこれが一番良い）
*/
#sm_menu {
    height: 40px;
    z-index: 1000;
    position: fixed;
}


#sm_menu .snavi {
    position: absolute;
    top: 100%;
}


#sm_menu {
    background-color: #111;
    color: white;
    width: 100%;
	opacity: 0.85;
	filter: alpha(opacity=85);
}


#sm_menu .menu_button01 { /* ドロップダウンメニュー以外の項目 */
    border-left: solid 1px white;
    float: right;
    width: 70px;
    height: 100%;
    text-align: center;
}


#sm_menu .menu_button01 span {
	line-height: 40px;
}


#sm_menu .menu_button {
    border-left: solid 1px white;
    float: right;
    width: 70px;
    height: 100%;
    text-align: center;
}


#sm_menu .menu_button span {
	line-height: 40px;
}


#sm_menu .snavi {
    background-color: #111;
    color: white;
    width: 100%;
}


#sm_menu .snavi ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}


#sm_menu .snavi ul li:first-child { /* ドロップダウンメニューul li 1番目の指定 */
	border-top: solid 1px white;
	font-weight: bold;
}


#sm_menu .snavi ul li:not(:first-child) { /* ドロップダウンメニューul li 2番目以降の指定（サブメニュー扱い） */
	font-size: 80%;
}


#sm_menu .snavi ul li {
	border-bottom: dotted 1px white;
	text-align: center;
	padding: 1em;
}


#sm_menu .snavi ul li a:link {
	color: #FFF;
	text-decoration: none;
}

#sm_menu .snavi ul li a:visited {
	color: #FFF;
	text-decoration: none;
}

#sm_menu .snavi ul li a:active {
	color: #FFF;
	text-decoration: none;
}



/*
	768pxより狭い場合はドロップダウンメニュー表示時のヘッダーに余白をつける
*/
@media screen and (max-width: 480px) {
	#header {
	padding-top: 30px;
	}
}


/*
	769pxより広い場合はドロップダウンメニューを非表示に
*/
@media screen and (min-width: 481px) {
	#sm_menu, .snavi, .menu_button {
	display:none;
	}
}