@charset 'utf-8';

/* ナビゲーション：色 */
div.site_nav ul { border:2px solid #cf556c; }
div.site_nav ul li a { background-color:#25b7c0; background-image:linear-gradient(to top, #d70035 0%, #e8383d 100%); border-right:1px solid rgba(255,255,255,0.5); color:#fff; }
div.site_nav ul li:last-child a { border-right:none; }

/* ナビゲーション：構造 */
div.site_nav { position:fixed; bottom:0; left:0; width:100%; z-index:20; }
div.site_nav ul { box-sizing:border-box; display:flex; justify-content:space-between; align-items:flex-start; }
div.site_nav ul li { box-sizing:border-box; font-size:85%; text-align:center; line-height:.65; width:25%; }
div.site_nav ul li a { display:block; padding:.75em 0em; }
div.site_nav ul li a img { margin:auto; height:30px; width:auto; }

@media only screen and (min-width:600px) {
/* タブレット */

}

@media only screen and (min-width:1025px) {
/* PC */

/* ナビゲーション：色 */
div.site_nav { background-image:linear-gradient(to top, #d70035 0%, #e8383d 100%); border-right:1px solid rgba(255,255,255,0.5); }
div.site_nav ul { border:none; border-right:1px solid rgba(255,255,255,0.5); border-left:1px solid rgba(255,255,255,0.5); }
div.site_nav ul li a { background-color:transparent; background-image:linear-gradient( 180deg, transparent, transparent ); border-right:1px solid rgba(255,255,255,0.5); }
div.site_nav ul li a:link, div.site_nav ul li a:visited { background-color:rgba(255,255,255,0); }
div.site_nav ul li a:active, div.site_nav ul li a:hover { background-color:rgba(255,255,255,.25); }

/* ナビゲーション：構造 */
div.site_nav { position:static; }
div.site_nav ul { margin:auto; max-width:1024px; width:85%; }

}

