-----------------------------

<div id="navi"><ul><li class="left"><a href="#">メニュー1</a></li><li><a href="#">メニュー２</a></li><li><a href="#">メニュー３</a></li><li><a href="#">メニュー４
</a></li><li><a href="#">メニュー５ </a></li></ul></div>

------------------------------




@charset "UTF-8";
/* =======================================
# 全カラム対応
======================================= */
/*
-----------------------------------------

【CSS編集・目次】
(1)基本のスタイル
(2)ヘッダーエリアのスタイル
(3)メインエリアのスタイル
(4)サイドエリアのスタイル
(5)ボタン設定
(6)その他、拡張

※CSS編集で広告を修正しないでください
（規約違反に該当する可能性があります）

-----------------------------------------
*/
/*
＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊

　(1)基本のスタイル

＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊
*/
/* (1-1) 基本テキスト全体
--------------------------------------------*/
/* 地色テキスト */
html {
color: #333333;
}

body{
font-family: "メイリオ", Meiryo, -apple-system, BlinkMacSystemFont,
"Helvetica Neue", "Yu Gothic", YuGothic,
"ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial,
sans-serif !important;
}

/* リンク */
a {
color: #3970B5;
}

/* 訪問済みリンク */
a:visited {
color: #a27ea2;
}

/* 淡色テキスト */
.skin-textQuiet {
color: #999999;
}

/* 強調色テキスト */
.skin-textLoud {
color: #ff3399;
}


[amb-component="entryAction"] {
position: relative;
margin-bottom: 14px;
text-align: center;
}

[amb-component="entryShare"] {
margin-bottom: 40px;
text-align: right;
padding-right: 3.5px;
}


/* (1-2) 基本背景
--------------------------------------------*/
/* コンテンツ背景、ヘッダー以下の背景色 */
.skin-blogBody{
background: url(#) center top repeat;     /* step1背景 */
}
.skin-blogBodyInner{
    background: rgba(255,255,255,0.9);
}

/* 淡色背景, 自分のコメントエリアの背景色 */
.skin-bgQuiet {
background-color: #f7f7f7;
}

/* (1-3) 基本境界線
--------------------------------------------*/
/* 境界線（強） */
.skin-borderLoud {
border-color: #cccccc;
}

/* 境界線（弱） */
.skin-borderQuiet {
border-color: #e5e5e5;
}

/*
＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊

　(2)ヘッダーエリアのスタイル

＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊
*/
/* (2-1) ヘッダー背景
--------------------------------------------*/
/* ヘッダー背景 */
.skin-bgHeader {
background-color: #ffffff;
}

/* (2-2) ヘッダータイトル、説明文
--------------------------------------------*/
/* ブログタイトルエリア、ヘッダー画像の下にテキストを隠す */
.skin-blogTitle {
z-index: -1;
}

/* ブログタイトル */
.skin-blogMainTitle {
color: #333333;
margin-bottom: 10px;
font-size: 27px;
}

/* ブログ説明文 */
.skin-blogSubTitle {
color: #999999;
font-size: 16px;
}

/* ヘッダータイトル */
.skin-headerTitle {
padding-top: 80px;
padding-bottom: 80px;
text-align: center;
}

[amb-component="entryTitle"]>a {
    text-decoration: none;
    color: inherit;
    padding: 2px 10px;
    border-left: 5px solid #F24673;　  /* ①タイトル赤 */
}

/*
＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊

　(3)メインエリアのスタイル

＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊
*/
/* (3-1-a) メイン背景
--------------------------------------------*/
/* メインエリア背景 */
.skin-bgMain {
background-color: rgba(255,255,255,0.8);
}

/* (3-1-b) メイン背景 内側
--------------------------------------------*/
/* メインエリア背景 内側 レイアウト */
.skin-blogMainInner {
  padding: 30px 0 10px;
}

/* (3-2) メインタイトル
--------------------------------------------*/
/* 記事タイトル */
.skin-entryTitle {
    color: #B8860B;
    font-family: "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN",  "游明朝", "Yu Mincho", "YuMincho", "HG明朝E", "ＭＳ Ｐ明朝", sans-serif;
    border-bottom: 3px double #B8860B;
    margin-bottom: 20px;
    padding: 28px 5px 5px 55px;
    background: url(https://stat.blogskin.ameba.jp/blogskin_images/20190116/15/f4/Jy/p/o00500036yamazen-ishikawa1547620686636.png) 0 20px no-repeat;
    /*background: url(https://stat.ameba.jp/user_images/20181031/18/jwca003/95/03/p/o0487004314294551641.png) no-repeat bottom left;
        background-size: auto auto;*/
    font-size: 1.2em;
    /*background-size: 100%;*/
}

/* 「画像付き記事」「同じテーマの記事」などの見出し */
.skin-mainWidgetTitle {
color: #333333;
}

/* (3-3) ブログナビ
--------------------------------------------*/
/* (3-3-a) ブログナビ上部
--------------------------------------------*/
/* 背景、境界線 */
.skin-blogHeaderNav {
/*border-color: rgba(0, 0, 0, 0.2);*/
background-image: linear-gradient(180deg, #a79756, #d5c16e, #a79756);
}
.skin-blogHeaderNavMenu li a{
    line-height: 50px!important;
}
[data-uranus-component="blogNav"],
[data-uranus-component="search"]{
    line-height: 50px!important;
}
/* 背景 */
.skin-blogHeaderNavInner {
}

/* テキスト */
.skin-topNavText, .skin-topNavText:hover, .skin-topNavText:visited {
color: #fff;
}

/* アイコン */
.skin-topNavIcon {
color: #fff;
}

/* (3-3-b) ブログナビ下部
--------------------------------------------*/
/* 背景、境界線　*/
.skin-blogFooterNavInner {border-color: #cccccc;background-color: #E5E5E5;}

/* テキスト */
.skin-bottomNavText, .skin-bottomNavText:hover, .skin-bottomNavText:visited {
color: #999999;
}

/* アイコン */
.skin-bottomNavIcon {
color: #999999;
}

/*
＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊

　(4)サイドエリアのスタイル

＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊
*/
/* (4-1) サイドテキスト全体
--------------------------------------------*/
/* サイドモジュールタイトル */　/*
.skin-widgetTitle {border-bottom: 1px solid #e5e5e5;color: #000000;border: 10px solid #FF7C80;background-color: #FF7C80;font-size: 20px;text-align: center;margin-bottom: 6px;
padding:5px;}
*/

[data-uranus-component="widgetTitle"],
.skin-widgetTitle {
    font-family: "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN",  "游明朝", "Yu Mincho", "YuMincho", "HG明朝E", "ＭＳ Ｐ明朝", sans-serif;
    color: #333;
font-size:20px !important;
    padding: 0 0 30px;
    background: url(https://stat.blogskin.ameba.jp/blogskin_images/20190129/09/6f/nv/p/o01990028yamazen-ishikawa1548721283745.png) center bottom no-repeat;
}

.skin-widgetHead {
text-align: center;
}

/* 2カラムサイドバー,3カラム:広いサイドバー */
/* 3カラム:狭いサイドバー */
/* サイド基本テキスト */
.skin-blogSubA, .skin-blogSubB {
}

/* サイド強調色テキスト */
.skin-sideTextLoud {
color: #ff3399;
}

/* サイドリンク色（基本） */
.skin-calendar a, .skin-linkListToggle, .skin-linkList a, .skin-linkChildList a, .skin-rankingList a, .skin-sideLink {
}

/* サイドリンク色（マウスオーバー） */
.skin-calendar a:hover, .skin-linkList a:hover, .skin-linkChildList a:hover, .skin-rankingList a:hover, .skin-sideLink:hover {
}

/* サイドリンク色（マウスオーバー） */
.skin-calendar a:visited, .skin-linkList a:visited, .skin-linkChildList a:visited, .skin-rankingList a:visited, .skin-sideLink:visited {
}

/* (4-2) サイド境界線
--------------------------------------------*/
/* 境界線 */
.skin-sideBorder {
border-color: #e5e5e5;
}

/* (4-3) サイドモジュール
--------------------------------------------*/
/* (4-3-a) カレンダー
--------------------------------------------*/
/* 記事が存在するカレンダー日付背景 */
.skin-calendarDate.is-active {
background-color: #DFF2FF;
}

/* カレンダー */
#calendar .skin-widgetTitle {margin-bottom: 0;}

/* (4-3-b) アーカイブナビ
--------------------------------------------*/
/* アーカイブナビ */
.skin-archiveNavTabs a, .skin-archiveNavTabs a:hover, .skin-archiveNavTabs a:visited {
color: #999999;
}

/* アーカイブナビ 選択時 */
.skin-archiveNavTabs a.is-active, .skin-archiveNavTabs a.is-active:hover, .skin-archiveNavTabs a.is-active:visited {
color: #333333;
}

/* (4-3-c) プロフィール
--------------------------------------------*/
/* プロフィール */
#profile .skin-widgetTitle {margin-bottom: 0;}

[amb-component="profile"] {
    margin-bottom: 15px;
    padding-right: 5px;
    padding-left: 5px;
    border: 3px solid #FF7C80;　　　  /* ②プロフィール枠線色赤 */
}

[amb-component="profileName"] {
    margin-bottom: 10px;
    text-align: center;
    font-size: 19px;
}

/*
＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊

(5)ボタン設定

＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊
*/
/* (5-1) ボタン全体
--------------------------------------------*/
/* 通常ボタン */
.skin-btn {
border-color: #e5e5e5;
background-color: #ffffff;
color: #999999;
}

/* 通常ボタン（マウスオーバー、訪問済み） */
.skin-btn:hover, .skin-btn:visited {
color: #999999;
}

/* 強調ボタン */
.skin-btnPrimary {
border-color: #404040;
background-color: #505050;
color: #ffffff;
}

/* 強調ボタン（マウスオーバー、訪問済み） */
.skin-btnPrimary:hover, .skin-btnPrimary:visited {
color: #ffffff;
}

[amb-layout="columnB"] [amb-layout="mainInner"], [amb-layout="columnB"] [amb-layout="archive"], [amb-layout="columnB"] [amb-layout="users"] {
    padding-left: 50px;
    padding-right: 50px;
    border: 1px solid #FF7C80;  /* ★③記事枠線*/
}

[data-uranus-layout="columnC"] [data-uranus-layout="mainInner"], [data-uranus-layout="columnC"] [data-uranus-layout="archive"], [data-uranus-layout="columnC"] [data-uranus-layout="users"] {
    padding-left: 0px !important;
    padding-right: 0px !important;
}


/* (5-2) ページ送りボタンの  << 次へ 、前へ >> 、「次の記事タイトル」 >> ボタン
--------------------------------------------*/
/* 前後ページ送りボタン */
.skin-btnPaging {
border-color: #cccccc;
background-color: #dedede;
color: #333333;
}

/* 前後ページ送りボタン（マウスオーバー、訪問済み） */
.skin-btnPaging:hover, .skin-btnPaging:visited {
color: #333333;
}

/* ページ送りの矢印アイコン*/
.skin-btnPagingIcon {
color: #a9a9a9;
}

/* 記事中ページ送りの次 */
.skin-entryPagingNext, .skin-entryPagingNext:hover, .skin-entryPagingNext:visited {
color: #3970B5;
}

/* 記事中ページ送りの前 */
.skin-entryPagingPrev, .skin-entryPagingPrev:hover, .skin-entryPagingPrev:visited {
color: #3970B5;
}

/* (5-3) 目次ナビゲーション
--------------------------------------------*/
/* 目次ナビゲーション */
.skin-btnIndex {
border-color: #e5e5e5;
background-color: #ffffff;
color: #999999;
}

/* 目次ナビゲーション（マウスオーバー、訪問済み） */
.skin-btnIndex:hover, .skin-btnIndex:visited {
color: #999999;
}

/* 目次ナビゲーション 選択時 */
.skin-btnIndex.is-active {
border-color: #cccccc;
background-color: #e0edf7;
color: #333333;
}

/* 目次ナビゲーション 無効時 */
.skin-btnIndex.is-disabled {
border-color: #cccccc;
background-color: #f6f7f8;
color: #979696;
}

/* (5-4) サイドボタン
--------------------------------------------*/
/* サイド通常ボタン */
.skin-btnSide {
border-color: #e5e5e5;
background-color: #ffffff;
color: #999999;
}

/* サイド通常ボタン（マウスオーバー、訪問済み） */
.skin-btnSide:hover, .skin-btnSide:visited {
color: #999999;
}

/* サイド強調ボタン */
.skin-btnSidePrimary {
  border-color: #FFFFFF;
  background-color: rgb(255, 255, 255);
  color: #000;
  border: 1px solid #FF7C80;  /* ④読者ボタン */
  }

/* サイド強調ボタン（マウスオーバー、訪問済み） */
.skin-btnSidePrimary:hover, .skin-btnSidePrimary:visited {color: #6F6F6F;}

/* (5-5) 記事一覧 月別
--------------------------------------------*/
/* 記事一覧 月別 ボタンテキスト */
.skin-btnArchive {
border-color: #e5e5e5;
background-color: #ffffff;
color: #999999;
}

/* 記事一覧 月別 ボタンテキスト（マウスオーバー、訪問済み） */
.skin-btnArchive:hover, .skin-btnArchive:visited {
color: #999999;
}

/* 記事一覧 月別 ボタンテキスト 選択時 */
.skin-btnArchive.is-active {
background-color: #e0edf7;
color: #333333;
}

/* 記事一覧 月別 ボタンテキスト 0件 */
.skin-btnArchive.is-disabled {
background-color: #f0eff5;
color: #cccccc;
}

/*
＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊

(6) その他、拡張

＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊:::＊
*/
/* (6-1) 記事一覧
--------------------------------------------*/
/* 記事一覧 背景 レイアウト */
.skin-blogArchiveBody {
/*padding: 30px 30px 0 30px;*/
padding: 30px 0px 0px 0px;
}

/* (6-2) メッセージ
--------------------------------------------*/
/* メッセージ 背景 レイアウト */
.skin-message {
    /*padding: 102px 0 !important;
    background: url(https://stat.ameba.jp/user_images/20181030/11/jwca003/23/29/p/o0665010214293718760.png) no-repeat;
    background-size: 100%;*/
    background: rgba(255,255,255,0.8) url(https://stat.blogskin.ameba.jp/blogskin_images/20190116/14/9f/E4/p/o02020051yamazen-ishikawa1547617556192.png) no-repeat center 20px;
}

.skin-messageInner {
    /*background: url(https://stat.ameba.jp/user_images/20181030/11/jwca003/da/d8/p/o0665056314293718761.png) no-repeat bottom left;
    background-size: 100%;*/
    padding: 20px;
}

--------------------------------------------*/
/* 追記 */

/* ヘッダーの横幅を設定する */
.skin-bgHeader [amb-layout="headerInner"] {
  width: 1160】;
}
/* ヘッダーの高さを設定する */
.skin-bgHeader [amb-layout="headerInner"]>a {
  height: 400;
}
/* ブログタイトルと説明文を非表示にする */
.skin-headerTitle {
  display: none;
}

/* ヘッダー ------------------------- */
.skin-bgHeader {
  /* ヘッダー背景 */
  background:url(https://stat.blogskin.ameba.jp/blogskin_images/20241210/18/f3/g0/p/o11200400ayumimoonlotus1733822482995.png) no-repeat;　　  /* step3 ヘッダー画像 */
  padding:0;
  margin: 0 auto 42px;
  width: 1120px;
  height: 400px;
}

.skin-page {
    background: url(#) left top repeat;    /* step2背景 */
}

.skin-blogMainTitle {
  /* ブログタイトル */
  color: #333333;
  font-size: 1.6em;
  line-height: 1.4em;
  padding: 30px 60px 5px 395px;
  text-align: right;
}

.skin-blogSubTitle {
  /* ブログ説明文 */
  color: #333333;
  font-size: 0.9em;
  line-height: 1.5em;
  padding: 0 60px 0 395px;
  text-align: right;
}


#navi {position: absolute;top: -131px;left: 0!important;width: 1120px;　/* グローバルメニューの長さ */font-size: 14px !important;right: 10px;/* */}
.skin-columnB #navi {left: -720px!important;}
.skin-columnC .skin-blogSubA #navi {left: -760px!important;}
.skin-columnD .skin-blogSubB #navi {left: -860px!important;}
.skin-columnE .skin-blogSubA #navi {left: -760px!important;}
.skin-columnE .skin-blogSubB #navi {left: -500px!important;}
.skin-blogBodyInner {position: relative;padding-top: 36px;　/* グローバルメニューとコンテンツの間 */}

#navi {
    background: #fff;
}

#navi ul{
  width:1120px;
  margin:0;
  padding:0;
  list-style: none;
  }

#navi ul li{
  margin:0;
  display:inline;
  width: 20%;
  line-height: 3.0;
  float: left;
  overflow: hidden;
  white-space:nowrap;
  }
#navi ul li a {
    display: block;
    text-align: center;
    font-weight: bold;
    /* background-color: #D0093C;　   ⑦メニュー枠線赤 */
    background-color: rgb(216,197,216);
    color: #39196e !important;
    text-decoration: none;
    /* border: 1px solid #ffffff; */
    -webkit-transition: 0.6s;
    -o-transition: 0.6s;
    transition: 0.6s;
    border-left: 1px solid #fff;
}
#navi ul li:first-child a{
    border-left: none;
}

#navi ul li a:hover{
    background-color: rgba(216,197,216,0.8);
  }

#navi ul li ul li{
  display:block;
margin: 0;
padding: 0;
position:relative;
border-top:1px solid #ffffff;
float:none;width:223px;
}
#navi ul li ul li.left{
  display:block;
  margin:0;padding:0;
  position:relative;
  border-top:1px solid #ffffff;
  float:none;width:224px;
  }/* OFF */
  #navi ul li ul {display:none;}/* ON */

#navi ul li:hover ul{
  margin: 0;
  padding: 0;
  display:block;
  position:absolute;
  z-index:100;}

/* ----------------------- BanCSS ----------------------- */
/* ??~selector?????property */
div#sub_a,
div#sub_b,
div.mainMenu#advertising,
div.menu_frame,
div#adJavaScript,
div#adJavaScript2,
div#defaultAd,
div#defaultAd img{
visibility:visible !important;
display:block !important;
text-indent:0px !important;
}


/* footer ad */
div#footer_ad,
li#footerInfoText,
li#broadText1,
li#broadText2,
li#broadText3{
visibility:visible !important;
display:block !important;
text-indent:0px !important;
}
/* footer ad inline*/
li#footerInfoText a,
li#broadText1 a,
li#broadText2 a,
li#broadText3 a{
visibility:visible !important;
display:inline!important;
text-indent:0px !important;

}

/* amebaBar Pr */
li#barPr{
visibility:visible !important;
display:block !important;
text-indent:0px !important;
}
li#barPr a{
visibility:visible !important;
display:inline !important;
text-indent:0px !important;
}

/* sideTextAd */
div#sideTextAd{
visibility:visible !important;
display:block !important;
text-indent:0px !important;
}
div#sideTextAd ul li a{
visibility:visible !important;
display:inline !important;
text-indent:0px !important;
}



/*----------ヘッダーにリンクを設定----------*/

#back_top{
position:absolute;
top     :-605px;
left    :-650px;
display :block
width   :980px;
height  :450px;
z-index :500;
/*border:solid 2px red;*/
}

/*----------枠線色----------*/

.skin-entry{
border:solid 1px #e6e6fa !important;　/*枠線　薄グレー*/

}
.skin-entryBody{
padding:20px;
}

.skin-entryHead{
margin-left:20px;
margin-right:20px;
margin-top:20px;
}


/* フリースペース */
#freespace .nobr br{display:none}

/* メイン枠線 */
.skin-blogMainInner {
    /*background: url(https://stat.ameba.jp/user_images/20181030/14/jwca003/e8/90/p/o0650003314293806163.png) no-repeat;*/
    background-size: 100%;
}

article.skin-entry {
    border: none !important;
    /*background: url(https://stat.ameba.jp/user_images/20181030/14/jwca003/f5/d0/p/o0650058114293806165.png) repeat-y;*/
    background-size: 100%;
}

.skin-blogMainInner {
    padding: 17px 0 0 !important;
}

.skin-entryFooter {
   /* background: url(https://stat.ameba.jp/user_images/20181030/11/jwca003/da/d8/p/o0665056314293718761.png) bottom no-repeat;*/
    background-size: 100%;
    padding: 0 20px 10px;
}

.skin-borderQuiet {
    border: none;
}

.skin-columnC .skin-message,
.skin-columnE .skin-message,
.skin-columnD .skin-message {
    padding: 28px 0 30px !important;
}

.skin-columnA .skin-message,
.skin-columnB .skin-message {
    padding: 32px 0 30px !important;
}

.skin-columnA .skin-messageInner,
.skin-columnB .skin-messageInner,
.skin-columnC .skin-messageInner,
.skin-columnE .skin-messageInner,
.skin-columnD .skin-messageInner {
    /*background: url(https://stat.ameba.jp/user_images/20181030/14/jwca003/f5/d0/p/o0650058114293806165.png) repeat-y top left;*/
    background-size: 100%;
}

.skin-columnA .skin-messageInner > div,
.skin-columnB .skin-messageInner > div,
.skin-columnC .skin-messageInner > div,
.skin-columnE .skin-messageInner > div,
.skin-columnD .skin-messageInner > div {
    padding-top: 40px;
}

.skin-columnA .skin-message.skin-bgMain::after,
.skin-columnB .skin-message.skin-bgMain::after,
.skin-columnC .skin-message.skin-bgMain::after,
.skin-columnE .skin-message.skin-bgMain::after,
.skin-columnD .skin-message.skin-bgMain::after {
    /*background: url(https://stat.ameba.jp/user_images/20181030/11/jwca003/da/d8/p/o0665056314293718761.png) no-repeat bottom left;*/
        background-size: auto auto;
    content: '';
    display: block;
    height: 10px;
    background-size: cover;
}

.skin-columnC .skin-blogMainInner,
.skin-columnE .skin-blogMainInner,
.skin-columnD .skin-blogMainInner {
    padding: 5px 0 0 !important;
}

#navi {
  position: absolute;
  margin: 0;
  padding: 0;
}
.skin-blogSubA, .skin-blogSubB {
position: relative;
}
.skin-columnB .skin-blogSubA #navi,
.skin-columnC .skin-blogSubA #navi,
.skin-columnE .skin-blogSubA #navi,
.skin-columnD .skin-blogSubB #navi {
  left: auto;
  right: 0;
}
.skin-columnA .skin-blogSubA #navi,
.skin-columnD .skin-blogSubA #navi,
.skin-columnC .skin-blogSubB #navi {
  left: 80px;
  right: auto;
}
.skin-columnE .skin-blogSubB #navi {
  left: auto;
  right: -360px;
}

.skin-columnA .skin-entryTitle,
.skin-columnB .skin-entryTitle {
    padding: 28px 5px 12px 55px;
}

f
