スマホ用フローティングヘッターを設置しています。現在メニューの背景がブラックでオレンジ(#FF6600)に変更したいのですが、CSSでどこを変更すればよいかわからないので教えていただけますでしょうか。
@charset "utf-8";
/*-------------------------------------------------------
RESET
-------------------------------------------------------*/
div,
dl, dt, dd,
ul, ol, li,
h1, h2, h3, h4, h5, h6,
pre,
form, fieldset, input, textarea,
p, blockquote,
th, td, legend {
margin: 0;
padding: 0;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
border: 0 none;
margin: 0;
outline: 0 none;
}
/* IEすきまバグ対策 */
ul li img {
vertical-align:bottom;
}
/*-------------------------------------------------------
STYLE_COMMON
-------------------------------------------------------*/
* {
margin: 0;
padding: 0;
list-style: none;
}
html {
font-size: 62.5%; /* 10px */
background: #ffffff;
}
@media screen and (min-width: 320px) and (max-width: 413px){
html {
font-size: 62.5%; /* 10px */
/*background: yellow;*/
}
}
@media screen and (min-width: 414px) and (max-width: 599px){
html {
font-size: 81.5%; /* 12px */
/*background: blue;*/
}
}
@media screen and (min-width: 600px) and (max-width: 960px){
html {
font-size: 106.5%; /* 17px */
/*background: green;*/
}
}
@media screen and (min-width: 961px) {
html {
font-size: 112.5%; /* 18px */
/*background: #ff6666;*/
}
}
body {
/*font-family: "MS Pゴシック", "MS P Gothic", sans-serif;*/
font-family:'Arial','helvetica nures','helvetica','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','MS ゴシック','MS Gothic', sans-serif;
line-height: 1.5;
font-size: 11px; font-size: 1.1rem;
letter-spacing: 0.0em;
color: #333333;
width: auto;
/* applied only IE6 */
_letter-spacing: 0.0em;
/* applied IE6 and IE7 */
>letter-spacing: 0.0em;
/* applied only IE8 */
letter-spacing /*\**/: 0.0em;\9
}
body p {
margin: 0;
padding: 0;
}
#wrapper {
position: relative;
height: auto;
width: 100%;
margin: 0 auto;
display: block;
}
a {
color: #1e8ff2;
text-decoration: none;
}
a:hover {
color: #1e8ff2;
cursor: pointer;
}
img {
border: none;
-ms-interpolation-mode: bicubic;
}
.alpha a:hover {
cursor: pointer;
opacity: 0.8;
filter:alpha(opacity=80);
background: #ffffff;
_zoom:1
}
* html .alpha a:hover {
filter:alpha(opacity=80);
background: #ffffff;
}
.alpha a:hover img {
cursor: pointer;
opacity: 0.8;
filter:alpha(opacity=80);
background: #ffffff;
_zoom:1
}
* html .alpha a:hover img {
filter:alpha(opacity=80);
background: #ffffff;
}
input:hover.alpha {
cursor: pointer;
opacity: 0.8;
filter:alpha(opacity=80);
background: #ffffff;
}
* html input:hover.alpha {
filter:alpha(opacity=80);
background: #ffffff;
}
.red {
color: #ff6666;
}
#content {
position:relative;
}
.pinkbold {
color: #ff6666;
font-weight: bold;
}
/*-----------------------------
iframe位置
-----------------------------*/
#smf-item-header{
position:fixed;
top:0;
left:0;
z-index:999;
margin:0;
padding:0;
display:block;
width:100%;
height:103px
}
/*-----------------------------
トップナビ
-----------------------------*/
#top-nav {
width: 100%;
text-align: center;
font-size: 10px;
}
#top-nav li a img {
width: 20px;
}
#top-nav li a {
float: left;
display: block;
width: 24.6%;
padding: 7px 0;
color: #ffffff;
border-right: 1px solid #ffffff;
background: #000000;
}
#top-nav li.info a {
border-right: 0px solid #ffffff;
}
#top-nav li.001 a,#top-nav li.002 a
,#top-nav li.003 a,#top-nav li.004 a,#top-nav li.005 a {
background-size: 30%;
}
/*-----------------------------
トップ検索窓
-----------------------------*/
#search-sp {
width: 98%;
padding: 5px;
border-top: 5px solid #cccccc;
border-bottom: 5px solid #cccccc;
background: #efefef;
}
#search-sp #txt-area {
float: left;
font-size: 10px;
width: 69%;
padding: 8px;
border: 2px solid #bf0000;
}
#search-sp #search-btn {
display: block;
color: #ffffff;
font-size: 10px;
width: 22%;
padding: 8px;
border: 0px solid #bf0000;
border-bottom: 1px solid #bf0000;
background: #bf0000;
}
input[type="button"],input[type="text"],input[type="submit"] {
-webkit-appearance: none;
border-radius: 0;
}
/*-----------------------------
PCボタン等表示位置
-----------------------------*/
.topbtn{
margin-top:100px;
}
h1{
margin-top:50px;
}
/*-----------------------------
デフォルトナビ削除
-----------------------------*/
/*ナビ*/
.topFuncShop{
visibility:hidden;
}
/*検索窓*/
#rstTopSearch{
visibility:hidden;
}
/*ヘッダーロゴ*/
#ipnsh-header{
visibility:hidden;
}
.logo{
visibility:hidden;
}
.campBnr{
visibility:hidden;
}
/*店名(リンク)位置*/
.shopname-info .itemtitle{
margin:-62px 0 0;
display:block;
}
/*店名(リンク)フォントサイズ*/
.shopname-info .itemtitle h1{
font-size:15px !important;
display:block;
}
/*-----------------------------
デフォルトナビ(カテゴリ)削除
-----------------------------*/
.ctgTtl{
margin:-63px 0 0;
padding:2px 0 0 0;
}
.ctgTtl h1{
font-size:12px !important;
}
.ctgTtl nav{
font-size:11px !important;
}
.ctgBreadcrumbs{
margin:0 0 -12px;
}
/*-------------------------------------------------------
COMMON
-------------------------------------------------------*/
nav,section {
margin-bottom: 5%;
}
/*-------------------------------------------------------
CLEAR_FIX
-------------------------------------------------------*/
.clearfix:after {
content: "."; /* 新しい要素を作る */
display: block; /* ブロックレベル要素に */
clear: both;
height: 0;
visibility: hidden;
}
.clearfix {
min-height: 1px;
}
* html .clearfix {
height: 1px;
/*\*//*/
height: auto;
overflow: hidden;
/**/
}
/*-----------------------------
カテゴリ絞り込み画像用
-----------------------------*/
b b a img{
display:block;
}