カテゴリー
gooブログ CSS編集

CSSの練習

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UFT-8">
    <title>CSS</title>
    <!--スタイルシートを別ファイルで持ちます-->
    <link REL="stylesheet" type="text/css" HREF="./StyleSheet/aSampleStyle.css">
    
  </head>

  <body>
    <div>
      <h1>CSS入門</h1>
      <h2>cssサンプル</h2>
    </div>
    <p>ここで文章を追加します</p>
    <p>もう一行追加します</p>
  </body>
</html>
<!--style-->
    body {
      /*background: #eaeaea;*/
      font-family: Meiryo;
      text-align: center;
    }
    div {
      background: #d2e4b3;
      width: 300px;
      padding: 10px;
      text-align: center;
      border: 5px solid #cccccc;
      margin: 30px auto;
    }
    /* h1 CSS入門 */
    h1 {
      color: rgb(158, 58, 58);
    }
    /* h2 cssサンプル*/
    h2{
      color: rgb(38, 105, 38);
      font-family: 'Courier New', Courier, monospace;
    }

下はスタイルシート、上はそれを呼び出す方。

カテゴリー
gooブログ CSS編集

gooブログアドバンス、cssの編集

@charset “UTF-8”; /*– INDIVIDUAL CSS Document for goo blog modulized templates 080430 –*/ /*– template name:CLアドバンス –*/ /*– ■SECTION 010 全体設定 –*/ /*—————————————————————– ページ全体の背景色・背景画像の設定 ——————————————————————*/ body { background:#d2e4b3; /*– 背景色 –*/ color:#333333; /*– 文字色 –*/ } /*—————————————————————– リンク文字色の基本設定 ——————————————————————*/ /*– 通常 –*/ a { text-decoration:underline; /*– 文字装飾 –*/ color:#378fd4; /*– 文字色– */ } /*– リンク先を訪れたことがある時 –*/ a:visited { text-decoration:underline; /*– 文字装飾 –*/ color:#9932cc; /*– 文字色 –*/ } /*– マウスオーバー時 –*/ a:hover { text-decoration:none; /*– 文字装飾 –*/ color:#999999; /*– 文字色 –*/ } /*– マウスクリック時 –*/ a:active { color:#999999; /*– 文字色 –*/ } /*—————————————————————– 不使用拡張部分 –使用したい部分をコメントアウトまたは削除します。 ——————————————————————*/ /*– #title-banner-top, –*/ /*– #title-banner-bottom, –*/ #main-top, /*– #main-bottom,–*/ /*– .content-top,–*/ /*– .content-bottom,–*/ #footer, .mod-entry-set-top, .mod-entry-set-bottom, .mod-comments-top, .mod-comments-bottom, .comment-list-top, .comment-list-bottom, .comment-form-top, .comment-form-bottom, .mod-trackbacks-top, .mod-trackbacks-bottom, .trackback-list-top, .trackback-list-bottom , .sidebar-top, .sidebar-bottom, .module-top, .module-bottom { display:none; } /*– ■SECTION 020 レイアウト設定 –*/ /*—————————————————————– サイドバー+メイン全体の設定 ——————————————————————*/ #container { width:90%; margin:0 auto; /*– 全体的な枠線の設定 –*/ border-bottom:solid 1px #c8c8c8; border-left:solid 1px #c8c8c8; border-right:solid 1px #c8c8c8; /*– 全体的な枠線の設定ここまで –*/ } #main { /*– コンテンツエリアの背景色: —–サイドバー下の余白orメインエリア下の余白 —–ただしカラム数・レイアウトにより出現領域は異なる –*/ background:#eaeaea; } /*– ■SECTION 030 #title-banner 設定 –*/ /*—————————————————————– タイトルバナーの設定 ——————————————————————*/ /*– タイトルバナー外枠の設定 –*/ #title-banner { border-top:solid 7px #6ca8d6; border-bottom:solid 1px #c8c8c8; background:#6ca8d6; } /*– タイトルバナー上部の設定 –*/ #title-banner-top { width:100%; height:10px; background:#1c75b8; margin:0; } /*– タイトルバナー内部の設定 –*/ #title-banner-body { border-bottom:solid 2px #5ca1d6; width:100%; /*– ↓タイトルバナーに画像を入れる場合は、下記のコメントをはずし、画像URLを指定する –*/ background-image:url(https://blogimg.goo.ne.jp/user_image/3f/44/329c8712ba2e9bab1eeda651362a571d.jpg); background-position: center top; background-repeat:no-repeat; /*– ↓タイトルバナーに画像を入れる場合は、画像に合わせて値を変更する –*/ height:300px; } /*– ブログタイトルの開始位置の設定 –*/ #title-banner-body #title-banner-set { padding-top:10px; padding-left:15px; } /*– タイトルバナー下部の設定 –*/ #title-banner-bottom { width:100%; border-top:solid 2px #4591cb; height:2px; background:#378fd4; border-bottom:solid 2px #eaeaea; } /*– ブログタイトル文字の基本設定 –*/ #title-banner-body #title-banner-set h1 { font-size:139%; color:#9932cc; line-height:1.2; text-align:left; width:50%; margin-bottom:5px; } /*– ブログタイトル文字の設定(文字色、リンク時装飾) –*/ #title-banner-body #title-banner-set h1 a { color:#9932cc; text-decoration:none; } /*– ブログタイトル文字の設定(マウスオーバー/マウスクリック時の文字色、リンク装飾) –*/ #title-banner-body #title-banner-set h1 a:hover, #title-banner-body #title-banner-set h1 a:active { color:#9932cc; text-decoration:underline; } /*– ブログ概要の設定 –*/ #title-banner-body #title-banner-set h2 { color:#00008b; /*– color:#ffffff; 2020-02-20 –*/ font-size:92%; line-height:1; width:15%; font-weight:normal; /*– background:#1c7568; 2020-02-20 –*/ background:#d2e4b3; padding:5px; } /*– ■SECTION 040 #main 設定 –*/ /*—————————————————————– サイドバー+メイン全体の下部の設定 ——————————————————————*/ #main-bottom { background:transparent; border-top:solid 2px #ffffff; border-bottom:solid 10px #378fd4; } /*– ■SECTION 050 #main 内レイアウト設定 –*/ /*—————————————————————– サイドバー全体、メイン全体の設定 ——————————————————————*/ /*– メインの設定(2カラム時のみ) –*/ #center-2c { } /*– メインの設定(3カラム時のみ) –*/ #center-3c { } /*– メインの設定(外側・共通) –*/ #center { } /*– メインの設定(内側・共通)–*/ #in-center { /*– メインコンテンツエリアの背景色 –*/ background:#eaeaea; } /*– サイドバー全体の設定 –*/ #side-a,#side-b { } /*– ■SECTION 060 #center-2c/3c 設定 –*/ /*—————————————————————– メインのレイアウトの設定 ——————————————————————*/ /*– カラム間のマージン設定(2カラムの場合)–*/ .content-2c { margin:0 5px; } /*– カラム間のマージン設定(3カラムの場合)–*/ .content-3c { margin:0 5px; } /*– メイン上部の設定 –*/ .content-top { height:5px; } .content-body { } /*– メイン下部の設定 –*/ .content-bottom { height:10px; } /*– ■SECTION 070 エントリー設定 –*/ /*—————————————————————– 記事の設定 ——————————————————————*/ /*– 記事の設定(外側) –*/ .mod-entry-set { } .mod-entry-set-top { } .mod-entry-set-top div.lt { } .mod-entry-set-top div.rt { } .mod-entry-set-bottom { } .mod-entry-set-bottom div.lb { } .mod-entry-set-bottom div.rb { } /*– 記事の設定(内側)–*/ .entry { } /*– 記事上部の設定 –*/ /*– ↓記事タイトル・投稿日時|カテゴリーの背景を共通で設定する場合はここを使用 –*/ .entry-top { } /*– 記事タイトルの設定 –*/ .entry-top h3 { font-size:135%; color:#ffffff; background:#378fd4; line-height:1.2; padding:5px; border-bottom:solid 3px #86b8df; border-top:solid 1px #2e77b1; } .entry-top h3 a { color:#ffffff; text-decoration:none; } .entry-top h3 a:visited { color:#ffffff; } .entry-top h3 a:hover { color:#000000; text-decoration:underline; } /*– 投稿日時|カテゴリーの設定 –*/ .entry-top-info { text-align:right; background:#ededed; padding:0 2px; color:#0066CC; } .entry-top-info a { color:#0066CC; text-decoration:underline; } .entry-top-info a:visited { color:#666666; } .entry-top-info a:hover { color:#666666; text-decoration:none; } .entry-top-info span.entry-top-info-time { } .entry-top-info span.entry-top-info-category { } /*– 記事上部の設定ここまで –*/ /*– 記事部分の設定 –*/ .entry-body { } /*– 記事貼り付け画像の設定 –*/ /*– 画像の周りの間隔の設定(サムネイルになる部分) –*/ .entry-body-image { margin:20px auto 10px; } /*– 画像にリンクを貼った時の設定(通常時) –*/ .entry-body-image a img,.entry-body-text a img { border-color:#666666; } /*– 画像にリンクを貼った時の設定(リンク先を訪問したことがある時) –*/ .entry-body-image a:visited img,.entry-body-text a:visited img { border-color:#666666; } /*– 画像にリンクを貼った時の設定(カーソルをおいた時) –*/ .entry-body-image a:hover img,.entry-body-text a:hover img { border-color:#666666; } /*– 記事本文の設定 –*/ .entry-body-text { padding:5px 2px; border-bottom:solid 1px #cccccc; } /*– 記事部分の設定ここまで –*/ /*– 記事下部の設定 –*/ .entry-bottom { padding:2px; color:#0066CC; text-align:right; } /*– 記事下部コメント()・トラックバック()の設定 –*/ .entry-bottom-info { } .entry-bottom-info a { color:#0066CC; } .entry-bottom-info a:visited { color:#666666; text-decoration:none; } .entry-bottom-info a:hover { color:#666666; text-decoration:none; } /*– 記事下部の設定ここまで –*/ /*—————————————————————– コメント欄の設定 ——————————————————————*/ /*– コメント欄全体の設定 –*/ #mod-comments { margin-bottom:20px; } /*– コメント欄タイトルの設定 –*/ #mod-comments h3{ font-size:135%; color:#ffffff; background:#378fd4; line-height:1.2; margin:10px 0; padding:5px; border-bottom:solid 3px #86b8df; border-top:solid 1px #2e77b1; } /*– 各コメントの設定 –*/ #mod-comments .comment-list-body{ margin-bottom:20px; } #mod-comments .comment-list-body dl { padding:10px; background:#ffffff; border:solid 1px #6ca8d6; margin-bottom:10px; } /*– 各コメントタイトルの設定 –*/ span.comment-list-title { font-weight:bold; color:#378fd4; } /*– 各コメント日付の設定 –*/ .comment-list-body dl dd.comment-list-date { color:#86b8df; } .comment-input dl { } .comment-submit input { } /*– gooIDを持っている人のみコメント可の場合の設定 –*/ .comment-gooid { margin-bottom:20px; padding:0 10px 10px 10px; border-bottom:dashed 1px #86b8df; } .comment-gooid dl { } .comment-gooid dl dt { font-weight:bold; } .comment-gooid dl dd { } .comment-login-link { margin:10px 0; } /*– gooIDを持っている人のみコメント可の場合の設定ここまで –*/ /*– コメント欄注意文の設定 –*/ .comment-alert { margin:10px 0; text-align:center; } .comment-alert,.comment-gooid{ color:#333333; } .comment-alert .comment-list-none,.comment-alert .comment-precheck{ color:#86b8df; font-weight:bold; } .comment-alert span.comment-login { color:#CC3333; } .comment-alert span.comment-list-error { color:#CC3333; font-weight:bold; padding:5px; border:solid 1px #CC3333; margin:10px 0; } /*– コメント欄注意文の設定ここまで –*/ /*—————————————————————– トラックバック欄の設定 ——————————————————————*/ /*– トラックバック欄全体の設定 –*/ #mod-trackbacks { margin-bottom:20px; } /*– トラックバック欄タイトルの設定 –*/ #mod-trackbacks h3 { font-size:135%; color:#ffffff; background:#378fd4; line-height:1.2; margin:10px 0; padding:5px; border-bottom:solid 3px #86b8df; border-top:solid 1px #2e77b1; } /*– トラックバックURL欄設定 –*/ #mod-trackbacks .trackback-ping-url { margin:20px; color:#999999; font-weight:bold; text-align:center; } /*– トラックバックURL文字設定 –*/ #mod-trackbacks .trackback-ping-url dd input { color:#999999; font-weight:bold; text-align:center; } /*– トラックバックを承認制にしている場合の注意書き設定 –*/ #mod-trackbacks .trackback-filter { } #mod-trackbacks .trackback-filter ul{ margin: 5px 20px 10px; } #mod-trackbacks .trackback-filter ul li { list-style:disc; list-style-position:outside; line-height:1.25; } /*– トラックバックを承認制にしている場合の注意書き設定ここまで –*/ /*– 各トラックバックの設定 –*/ #mod-trackbacks .trackback-list-body dl { padding:10px; background:#ffffff; border:solid 1px #6ca8d6; margin-bottom:10px; } #mod-trackbacks .trackback-list-body dl dt { color:#333333; } #mod-trackbacks .trackback-list-body dl dt.trackback-list-title { color:#378fd4; font-weight:bold; } #mod-trackbacks .trackback-list-body dl dt a { font-weight:bold; color:#378fd4; text-decoration:underline; } #mod-trackbacks .trackback-list-body dl dt a:visited { color:#666666; text-decoration:underline; } #mod-trackbacks .trackback-list-body dl dt a:hover { color:#999999; text-decoration:none; } /*– 各トラックバックの設定ここまで –*/ /*– トラックバック注意文の設定 –*/ #mod-trackbacks .trackback-alert { margin:10px 0; text-align:center; } #mod-trackbacks .trackback-alert .trackback-precheck{ color:#86b8df; font-weight:bold; border-top:dashed 1px #86b8df; padding-top:10px; } /*– トラックバック注意文の設定ここまで –*/ /*—————————————————————– 次へ・前へ 部分の設定 ——————————————————————*/ #mod-prev-next { margin-bottom:20px; padding:5px; background:#fff; font-weight:bold; border:solid 1px #cccccc; } #mod-prev-next a { color:#666666; text-decoration:underline; } #mod-prev-next a:visited { color:#666666; text-decoration:underline; } #mod-prev-next a:hover { color:#666666; text-decoration:none; } /*– ■SECTION 080 スポンサー誘導枠設定 –*/ /*—————————————————————– スポンサー誘導枠全体の設定 ——————————————————————*/ .mod-entry-set-goo-ad { margin-top:20px; margin-bottom:30px; text-align:center; } /*– 広告背景色 –*/ .gooAd { margin:0; background:#f4f8f9; } .gooAd td { } td.gooAd_sponsor_td { } td.gooAd_title_td { } td.gooAd_url_td { } td.gooAd_text_td { } .gooAd_text { } td.gooAd_btm_td { } /*– スポンサーリンク文字 –*/ a.gooAd_sponsor { } /*– タイトルリンク文字 –*/ a.gooAd_title { color:#333333; font-weight:bold; } a:visited.gooAd_title { color:#999999; font-weight:bold; } /*– URLリンク文字 –*/ a.gooAd_url { color:#666666; } a:visited.gooAd_url { color:#666666; } /*– テキストリンク文字 –*/ div.gooAd_text_td { line-height:1.1; } a.gooAd_text { color:#666666; } a:visited.gooAd_text { color:#666666; } /*– リンク範囲拡大 –*/ .gooAd_title_td A, .gooAd_url_td A, .gooAd_text_td A { text-decoration:none; } /*– ■SECTION 090 #sidebar 設定 –*/ /*—————————————————————– サイドバー全体の設定 ——————————————————————*/ .sidebar { border-left:solid 1px #dedede; border-right:solid 1px #dedede; } /*– ■SECTION 100 サイドバーモジュール共通設定 –*/ /*—————————————————————– サイドバーモジュール共通設定 –.module共通設定はモジュールごとにデザインを変える場合でも、 –必ずセットしてください。 ——————————————————————*/ /*– モジュール内の間隔の設定 –*/ .module-body { padding:10px 5px; } /*– モジュール内リスト文の設定 –*/ .module ul li { text-align:left; color:#333333; border-bottom:dashed 1px #999999; padding-bottom:5px; } /*– モジュール内定義リストの設定 –*/ .module dl dt { color:#378fd4; font-weight:bold; } .module dl dd { } /*– モジュール内定義リストの設定ここまで –*/ /*– モジュール内区切り線の設定 –*/ .module-body hr { height:1px; background-color:#d5d5d5; border:0px; } /*– モジュール内リンク文字の設定 –*/ .module a { color:#378fd4; text-decoration:none; } .module a:visited { color:#9932cc; text-decoration:none; } .module a:link:hover { color:#666666; text-decoration:underline; } .module a:link:active { color:#378fd4; text-decoration:none; } /*– モジュール内リンク文字の設定ここまで –*/ /*– 2カラムのサイドバーor3カラムの左サイドバー共通設定 –*/ /*– 全体の設定 –*/ #side-a { background:#eaeaea; } /*– 各モジュールの設定 –*/ #side-a .module { border-top:solid 2px #ffffff; border-bottom:solid 1px #c8c8c8; } /*– 各モジュール上部の設定 –*/ #side-a .module .module-top { border-left:solid 2px #ffffff; } /*– 各モジュール内部の設定 –*/ #side-a .module .module-body { background:#f3f3f3; border-bottom:solid 1px #ffffff; border-left:solid 2px #ffffff; } /*– 各モジュール下部の設定 –*/ #side-a .module .module-bottom { border-left:solid 2px #ffffff; } /*– 各モジュールタイトルの設定 –*/ #side-a .module h4 { padding:5px; border-left:solid 2px #ffffff; background:#86b8df; text-align:center; color:#000000; font-weight:bold; font-size:110%; } /*– 3カラムの右サイドバー共通設定 –*/ /*– 全体の設定 –*/ #side-b{ background:#ededed; } /*– 各モジュールの設定 –*/ #side-b .module { border-top:solid 2px #ffffff; border-bottom:solid 1px #c8c8c8; } /*– 各モジュール上部の設定 –*/ #side-b .module .module-top { border-left:solid 2px #ffffff; } /*– 各モジュール内部の設定 –*/ #side-b .module-body { background:#ededed; border-right:solid 1px #ffffff; border-bottom:solid 1px #ffffff; } /*– 各モジュールタイトルの設定 –*/ #side-b .module h4 { padding:5px; border-right:1px solid #ffffff; background:#86b8df; text-align:center; color:#000000; font-weight:bold; font-size:110%; } /*– ■SECTION 110 サイドバーモジュール個別設定 ■ –*/ /*—————————————————————– サイドバー/モジュールの各個別要素の設定 ——————————————————————*/ /*– お知らせ【PR】 –*/ #mod-advertising {} /*– プロフィール –*/ #mod-profile{} /*– 携帯 –*/ #mod-mobile { text-align:center; } #mod-mobile ul li{ text-align:center; } /*– 最新記事 –*/ #mod-recent-entries{} /*– カテゴリー –*/ #mod-categories {} /*– ログイン –*/ #mod-login {} #mod-login ul li { border:none; padding:0; } /*– 最新コメント –*/ #mod-recent-comments {} /*– 最新トラックバック –*/ #mod-recent-trackbacks {} /*– カレンダー –*/ #mod-cal-table .mod-cal-caption { color:#378fd4; padding:4px; font-weight:bold; } #mod-cal-table .mod-cal-week { color:#378fd4; } #mod-cal-table td.mod-cal-day-lin-td { background:#a8d0ef; } #mod-cal-table th,#mod-cal-table td { padding:2px; border-bottom:1px solid #cccccc; font-size:90%; text-align:center; vertical-align:middle; } #mod-cal-table .mod_cal_day_linked { color:#ffffff; text-decoration:none; } /*– バックナンバー –*/ #mod-back-numbers-scroll {} /*– スクロールあり –*/ #mod-back-numbers-scroll .module-body { padding:10px 5px; background:#ededed; border:solid 1px #fff; } /*– スクロールなし –*/ #mod-back-numbers-noscroll .module-body { padding:15px 15px 20px } /*– ブックマーク –*/ #mod-bookmarks .mod-boo-name {} /*– goo おすすめ –*/ #mod-goo-recommends li { border:none; } /*– RSS/gooブログ –*/ #mod-powered-by { background:#eaeaea; padding:10px; } /*– フォントサイズ変更 –*/ #font-size-changer {} #font-resizer ul li { background:none; padding:0; text-align:center; border:none; } /*—————————————————————– メインエリアにオリジナルモジュールを配置した時の設定 ——————————————————————*/ /*– オリジナルモジュール全体の設定 –*/ #mod-freearea-main { padding:10px; margin:0 0 20px 0; background-color:transparent; border-left:solid 1px #86b8df; border-right:solid 1px #86b8df; border-top:solid 5px #86b8df; border-bottom:solid 5px #86b8df; } #mod-freearea-main .mod-entry-set-top { } #mod-freearea-main .entry { } /*– オリジナルモジュール上部の設定 –*/ #mod-freearea-main .entry .entry-top { } /*– オリジナルモジュールタイトルの設定 –*/ #mod-freearea-main .entry .entry-top h3 { font-size:100%; background-color:transparent; line-height:1.25; text-align:center; color:#666666; border-bottom:solid 1px #cccccc; border-top:none; } #mod-freearea-main .entry .entry-top h3 a { color:#378fd4; text-decoration:none; } #mod-freearea-main .entry .entry-top h3 a:visited { color:#666; } #mod-freearea-main .entry .entry-top h3 a:hover { color:#999; text-decoration:underline; } /*– オリジナルモジュール内部の設定 –*/ #mod-freearea-main .entry .entry-body { word-break:break-all; color:#333333; line-height:1.25; border:none; } /*– オリジナルモジュール記事の設定 –*/ #mod-freearea-main .entry .entry-body-text { padding:10px; margin:0; } /*– オリジナルモジュール下部の設定 –*/ #mod-freearea-main .entry .entry-bottom { border:none; } /*– End//INDIVIDUAL CSS Document for goo blog modulized templates 121010 –*/
カテゴリー
gooブログ CSS編集

gooブログ、アドバンスCSS編集

@charset "UTF-8";
/*-- INDIVIDUAL CSS Document for goo blog modulized templates 080430 --*/
/*-- template name:CLアドバンス --*/

/*-- ■SECTION 010 全体設定 --*/
/*-----------------------------------------------------------------
ページ全体の背景色・背景画像の設定
------------------------------------------------------------------*/

	body {
		background:#d2e4b3; /*-- 背景色 --*/
		color:#333333; /*-- 文字色 --*/
	}


/*-----------------------------------------------------------------
リンク文字色の基本設定
------------------------------------------------------------------*/

	/*-- 通常 --*/
		a {
			text-decoration:underline; /*-- 文字装飾 --*/
			color:#378fd4; /*-- 文字色-- */
		}
	/*-- リンク先を訪れたことがある時 --*/
		a:visited {
			text-decoration:underline; /*-- 文字装飾 --*/
			color:#9932cc; /*-- 文字色 --*/
		}
	/*-- マウスオーバー時 --*/
		a:hover {
			text-decoration:none; /*-- 文字装飾 --*/
			color:#999999; /*-- 文字色 --*/
		}
	/*-- マウスクリック時 --*/
		a:active {
			color:#999999; /*-- 文字色 --*/
		}


/*-----------------------------------------------------------------
不使用拡張部分
 --使用したい部分をコメントアウトまたは削除します。
------------------------------------------------------------------*/

	/*-- #title-banner-top, --*/
	/*-- #title-banner-bottom, --*/
	#main-top,
	/*-- #main-bottom,--*/
	/*-- .content-top,--*/
	/*-- .content-bottom,--*/
	#footer,
	.mod-entry-set-top,
	.mod-entry-set-bottom,
	.mod-comments-top,
	.mod-comments-bottom,
	.comment-list-top,
	.comment-list-bottom,
	.comment-form-top,
	.comment-form-bottom,
	.mod-trackbacks-top,
	.mod-trackbacks-bottom,
	.trackback-list-top,
	.trackback-list-bottom ,
	.sidebar-top,
	.sidebar-bottom,
	.module-top,
	.module-bottom {
		display:none;
	}


/*-- ■SECTION 020 レイアウト設定 --*/
/*-----------------------------------------------------------------
サイドバー+メイン全体の設定
------------------------------------------------------------------*/

	#container {
		width:90%;
		margin:0 auto;
		/*-- 全体的な枠線の設定 --*/
		border-bottom:solid 1px #c8c8c8;
		border-left:solid 1px #c8c8c8;
		border-right:solid 1px #c8c8c8;
		/*-- 全体的な枠線の設定ここまで --*/
	}
	#main {
		/*-- コンテンツエリアの背景色:
		-----サイドバー下の余白orメインエリア下の余白
		-----ただしカラム数・レイアウトにより出現領域は異なる --*/
		background:#eaeaea;
	}


/*-- ■SECTION 030 #title-banner 設定 --*/
/*-----------------------------------------------------------------
タイトルバナーの設定
------------------------------------------------------------------*/

	/*-- タイトルバナー外枠の設定 --*/
		#title-banner {
			border-top:solid 7px #6ca8d6;
			border-bottom:solid 1px #c8c8c8;
			background:#6ca8d6;
		}
	/*-- タイトルバナー上部の設定 --*/
		#title-banner-top {
			width:100%;
			height:10px;
			background:#1c75b8;
			margin:0;
		}
	/*-- タイトルバナー内部の設定 --*/
		#title-banner-body {
			border-bottom:solid 2px #5ca1d6;
			width:100%;
			/*-- ↓タイトルバナーに画像を入れる場合は、下記のコメントをはずし、画像URLを指定する --*/
			
			background-image:url(https://blogimg.goo.ne.jp/user_image/3f/44/329c8712ba2e9bab1eeda651362a571d.jpg);
			background-position: center top;
			background-repeat:no-repeat; 
			
			/*-- ↓タイトルバナーに画像を入れる場合は、画像に合わせて値を変更する --*/
			height:300px;
		}
	/*-- ブログタイトルの開始位置の設定 --*/
		#title-banner-body #title-banner-set {
			padding-top:10px;
			padding-left:15px;
		}
	/*-- タイトルバナー下部の設定 --*/
		#title-banner-bottom {
			width:100%;
			border-top:solid 2px #4591cb;
			height:2px;
			background:#378fd4;
			border-bottom:solid 2px #eaeaea;
		}
	/*-- ブログタイトル文字の基本設定 --*/
		#title-banner-body #title-banner-set h1 {
			font-size:139%;
			color:#9932cc;
			line-height:1.2;
			text-align:left;
			width:50%;
			margin-bottom:5px;
		}
	/*-- ブログタイトル文字の設定(文字色、リンク時装飾) --*/
		#title-banner-body #title-banner-set h1 a {
			color:#9932cc;
			text-decoration:none;
		}
	/*-- ブログタイトル文字の設定(マウスオーバー/マウスクリック時の文字色、リンク装飾) --*/
		#title-banner-body #title-banner-set h1 a:hover,
		#title-banner-body #title-banner-set h1 a:active {
			color:#9932cc;
			text-decoration:underline;
		}
	/*-- ブログ概要の設定 --*/
		#title-banner-body #title-banner-set h2 {
                        color:#00008b;
			/*-- color:#ffffff; 2020-02-20 --*/
			font-size:92%;
			line-height:1;
			width:15%;
			font-weight:normal;
                        /*-- background:#1c7568; 2020-02-20 --*/
			background:#d2e4b3;
			padding:5px;
		}


/*-- ■SECTION 040 #main 設定 --*/
/*-----------------------------------------------------------------
サイドバー+メイン全体の下部の設定
------------------------------------------------------------------*/

	#main-bottom {
		background:transparent;
		border-top:solid 2px #ffffff;
		border-bottom:solid 10px #378fd4;
	}

	
/*-- ■SECTION 050 #main 内レイアウト設定 --*/
/*-----------------------------------------------------------------
サイドバー全体、メイン全体の設定
------------------------------------------------------------------*/

	/*-- メインの設定(2カラム時のみ) --*/
		#center-2c {
		}
	/*-- メインの設定(3カラム時のみ) --*/
		#center-3c {
		}
	/*-- メインの設定(外側・共通) --*/
		#center {
		}
	/*-- メインの設定(内側・共通)--*/
		#in-center {
			/*-- メインコンテンツエリアの背景色 --*/
			background:#eaeaea;
		}
	/*-- サイドバー全体の設定 --*/
		#side-a,#side-b {
		}


/*-- ■SECTION 060 #center-2c/3c 設定 --*/
/*-----------------------------------------------------------------
メインのレイアウトの設定
------------------------------------------------------------------*/

	/*-- カラム間のマージン設定(2カラムの場合)--*/
		.content-2c {
			margin:0 5px;
		}
	/*-- カラム間のマージン設定(3カラムの場合)--*/
		.content-3c {
			margin:0 5px;
		}
	/*-- メイン上部の設定 --*/
		.content-top {
			height:5px;
		}
		.content-body {
		}
	/*-- メイン下部の設定 --*/
		.content-bottom {
			height:10px;
		}


/*-- ■SECTION 070 エントリー設定 --*/
/*-----------------------------------------------------------------
記事の設定
------------------------------------------------------------------*/

	/*-- 記事の設定(外側) --*/
		.mod-entry-set {
		}
		.mod-entry-set-top {
		}
		.mod-entry-set-top div.lt {
		}
		.mod-entry-set-top div.rt {
		}
		.mod-entry-set-bottom {
		}
		.mod-entry-set-bottom div.lb {
		}
		.mod-entry-set-bottom div.rb {
		}
	/*-- 記事の設定(内側)--*/
		.entry {
		}
		/*-- 記事上部の設定 --*/
			/*-- ↓記事タイトル・投稿日時|カテゴリーの背景を共通で設定する場合はここを使用 --*/
				.entry-top {
				}
			/*-- 記事タイトルの設定 --*/
				.entry-top h3 {
					font-size:135%;
					color:#ffffff;
					background:#378fd4;
					line-height:1.2;
					padding:5px;
					border-bottom:solid 3px #86b8df;
					border-top:solid 1px #2e77b1;
				}
				.entry-top h3 a {
					color:#ffffff;
					text-decoration:none;
				}
				.entry-top h3 a:visited {
					color:#ffffff;
				}
				.entry-top h3 a:hover {
					color:#000000;
					text-decoration:underline;
				}
			/*-- 投稿日時|カテゴリーの設定 --*/
				.entry-top-info {
					text-align:right;
					background:#ededed;
					padding:0 2px;
					color:#0066CC;
				}
				.entry-top-info a {
					color:#0066CC;
					text-decoration:underline;
				}
				.entry-top-info a:visited {
					color:#666666;
				}
				.entry-top-info a:hover {
					color:#666666;
					text-decoration:none;
				}
				.entry-top-info span.entry-top-info-time {
				}
				.entry-top-info span.entry-top-info-category {
				}
		/*-- 記事上部の設定ここまで --*/
		
		/*-- 記事部分の設定 --*/
			.entry-body {
			}
			/*-- 記事貼り付け画像の設定 --*/
				/*-- 画像の周りの間隔の設定(サムネイルになる部分) --*/
					.entry-body-image {
						margin:20px auto 10px;
					}
				/*-- 画像にリンクを貼った時の設定(通常時) --*/
					.entry-body-image a img,.entry-body-text a img {
						border-color:#666666;
					}
				/*-- 画像にリンクを貼った時の設定(リンク先を訪問したことがある時) --*/
					.entry-body-image a:visited img,.entry-body-text a:visited img {
						border-color:#666666;
					}
				/*-- 画像にリンクを貼った時の設定(カーソルをおいた時) --*/
					.entry-body-image a:hover img,.entry-body-text a:hover img {
						border-color:#666666;
					}
			/*-- 記事本文の設定 --*/
				.entry-body-text {
					padding:5px 2px;
					border-bottom:solid 1px #cccccc;
				}
		/*-- 記事部分の設定ここまで --*/
			
		/*-- 記事下部の設定 --*/
			.entry-bottom {
				padding:2px;
				color:#0066CC;
				text-align:right;
			}
			/*-- 記事下部コメント()・トラックバック()の設定 --*/
				.entry-bottom-info {
				}
				.entry-bottom-info a {
					color:#0066CC;
				}
				.entry-bottom-info a:visited {	
					color:#666666;
					text-decoration:none;
				}
				.entry-bottom-info a:hover {
					color:#666666;
					text-decoration:none;
				}
		/*-- 記事下部の設定ここまで --*/


/*-----------------------------------------------------------------
コメント欄の設定
------------------------------------------------------------------*/

	/*-- コメント欄全体の設定 --*/
		#mod-comments {
			margin-bottom:20px;
		}
	/*-- コメント欄タイトルの設定 --*/
		#mod-comments h3{
			font-size:135%;
			color:#ffffff;
			background:#378fd4;
			line-height:1.2;
			margin:10px 0;
			padding:5px;
			border-bottom:solid 3px #86b8df;
			border-top:solid 1px #2e77b1;
		}
	/*-- 各コメントの設定 --*/
		#mod-comments .comment-list-body{
			margin-bottom:20px;
		}
		#mod-comments .comment-list-body dl {
			padding:10px;
			background:#ffffff;
			border:solid 1px #6ca8d6;
			margin-bottom:10px;
		}
	/*-- 各コメントタイトルの設定 --*/
		span.comment-list-title {
			font-weight:bold;
			color:#378fd4;
		}
	/*-- 各コメント日付の設定 --*/
		.comment-list-body dl dd.comment-list-date {
			color:#86b8df;
		}
		.comment-input dl {
		}
		.comment-submit input {
		}
	/*-- gooIDを持っている人のみコメント可の場合の設定 --*/
		.comment-gooid {
			margin-bottom:20px;
			padding:0 10px 10px 10px;
			border-bottom:dashed 1px #86b8df; 
		}
		.comment-gooid dl {
		}
		.comment-gooid dl dt {
			font-weight:bold;
		}
		.comment-gooid dl dd {
		}
		.comment-login-link {
			margin:10px 0;
		}
	/*-- gooIDを持っている人のみコメント可の場合の設定ここまで --*/
	/*-- コメント欄注意文の設定 --*/
		.comment-alert {
			margin:10px 0;
			text-align:center;
		}
		.comment-alert,.comment-gooid{
			color:#333333;
		}
		.comment-alert .comment-list-none,.comment-alert .comment-precheck{
			color:#86b8df;
			font-weight:bold;
		}
		.comment-alert span.comment-login {
			color:#CC3333;
		}
		.comment-alert span.comment-list-error {
			color:#CC3333;
			font-weight:bold;
			padding:5px;
			border:solid 1px #CC3333;
			margin:10px 0;
		}
	/*-- コメント欄注意文の設定ここまで --*/


/*-----------------------------------------------------------------
トラックバック欄の設定
------------------------------------------------------------------*/

	/*-- トラックバック欄全体の設定 --*/
		#mod-trackbacks {
			margin-bottom:20px;
		}
	/*-- トラックバック欄タイトルの設定 --*/
		#mod-trackbacks h3 {
			font-size:135%;
			color:#ffffff;
			background:#378fd4;
			line-height:1.2;
			margin:10px 0;
			padding:5px;
			border-bottom:solid 3px #86b8df;
			border-top:solid 1px #2e77b1;
		}
	/*-- トラックバックURL欄設定 --*/
		#mod-trackbacks .trackback-ping-url {
			margin:20px;
			color:#999999;
			font-weight:bold;
			text-align:center;
		}
	/*-- トラックバックURL文字設定 --*/
		#mod-trackbacks .trackback-ping-url dd input {
			color:#999999;
			font-weight:bold;
			text-align:center;
		}
	/*-- トラックバックを承認制にしている場合の注意書き設定 --*/
		#mod-trackbacks .trackback-filter {
		}
		#mod-trackbacks .trackback-filter ul{
			margin: 5px 20px 10px;
		}
		#mod-trackbacks .trackback-filter ul li {
			list-style:disc;
			list-style-position:outside;
			line-height:1.25;
		}
	/*-- トラックバックを承認制にしている場合の注意書き設定ここまで --*/
	/*-- 各トラックバックの設定 --*/
		#mod-trackbacks .trackback-list-body dl {
			padding:10px;
			background:#ffffff;
			border:solid 1px #6ca8d6;
			margin-bottom:10px;
		}
		#mod-trackbacks .trackback-list-body dl dt {
			color:#333333;
		}
		#mod-trackbacks .trackback-list-body dl dt.trackback-list-title {
			color:#378fd4;
			font-weight:bold;
		}
		#mod-trackbacks .trackback-list-body dl dt a {
			font-weight:bold;
			color:#378fd4;
			text-decoration:underline;
		}
		#mod-trackbacks .trackback-list-body dl dt a:visited {
			color:#666666;
			text-decoration:underline;
		}
		#mod-trackbacks .trackback-list-body dl dt a:hover {
			color:#999999;
			text-decoration:none;
		}
	/*-- 各トラックバックの設定ここまで --*/
	/*-- トラックバック注意文の設定 --*/
		#mod-trackbacks .trackback-alert {
			margin:10px 0;
			text-align:center;
		}
		#mod-trackbacks .trackback-alert .trackback-precheck{
			color:#86b8df;
			font-weight:bold;
			border-top:dashed 1px #86b8df;
			padding-top:10px;
		}
	/*-- トラックバック注意文の設定ここまで --*/


/*-----------------------------------------------------------------
次へ・前へ 部分の設定
------------------------------------------------------------------*/

	#mod-prev-next {
		margin-bottom:20px;
		padding:5px;
		background:#fff;
		font-weight:bold;
		border:solid 1px #cccccc;
	}
	#mod-prev-next a {
		color:#666666;
		text-decoration:underline;
	}
	#mod-prev-next a:visited {
		color:#666666;
		text-decoration:underline;
	}
	#mod-prev-next a:hover {
		color:#666666;
		text-decoration:none;
	}

/*-- ■SECTION 080 スポンサー誘導枠設定 --*/
/*-----------------------------------------------------------------
スポンサー誘導枠全体の設定
------------------------------------------------------------------*/

	.mod-entry-set-goo-ad {
		margin-top:20px;
		margin-bottom:30px;
		text-align:center;
	}
	/*-- 広告背景色 --*/
		.gooAd {
			margin:0;
			background:#f4f8f9;
		}
		.gooAd td {
		}
		td.gooAd_sponsor_td {
		}
		td.gooAd_title_td {
		}
		td.gooAd_url_td {
		}
		td.gooAd_text_td {
		}
		.gooAd_text {
		}
		td.gooAd_btm_td {
		}
	/*-- スポンサーリンク文字 --*/
		a.gooAd_sponsor {
		}
	/*-- タイトルリンク文字 --*/
		a.gooAd_title {
			color:#333333;
			font-weight:bold;
		}
		a:visited.gooAd_title {
			color:#999999;
			font-weight:bold;
		}
	/*-- URLリンク文字 --*/
		a.gooAd_url {
			color:#666666;
		}
		a:visited.gooAd_url {
			color:#666666;
		}
	/*-- テキストリンク文字 --*/
		div.gooAd_text_td {
			line-height:1.1;
		}
		a.gooAd_text {
			color:#666666;
		}
		a:visited.gooAd_text {
			color:#666666;
		}
	/*-- リンク範囲拡大 --*/
		.gooAd_title_td A,
		.gooAd_url_td A,
		.gooAd_text_td A {
			text-decoration:none;
		}


/*-- ■SECTION 090 #sidebar 設定 --*/
/*-----------------------------------------------------------------
サイドバー全体の設定
------------------------------------------------------------------*/

	.sidebar {	
		border-left:solid 1px #dedede;
		border-right:solid 1px #dedede;
	}


/*-- ■SECTION 100 サイドバーモジュール共通設定 --*/
/*-----------------------------------------------------------------
サイドバーモジュール共通設定
 --.module共通設定はモジュールごとにデザインを変える場合でも、
 --必ずセットしてください。
------------------------------------------------------------------*/

	/*-- モジュール内の間隔の設定 --*/
		.module-body	{
			padding:10px 5px;
		}
	/*-- モジュール内リスト文の設定 --*/
		.module ul li {
			text-align:left;
			color:#333333;
			border-bottom:dashed 1px #999999;
			padding-bottom:5px;
		}
	/*-- モジュール内定義リストの設定 --*/
		.module dl dt {
			color:#378fd4;
			font-weight:bold;
		}
		.module dl dd {
		}
	/*-- モジュール内定義リストの設定ここまで --*/
	/*-- モジュール内区切り線の設定 --*/
		.module-body hr {
			height:1px;
			background-color:#d5d5d5;
			border:0px;
		}
	/*-- モジュール内リンク文字の設定 --*/
		.module a {
			color:#378fd4;
			text-decoration:none;
		}
		.module a:visited {
			color:#9932cc;
			text-decoration:none;
		}
		.module a:link:hover {
			color:#666666;
			text-decoration:underline;
		}
		.module a:link:active {
			color:#378fd4;
			text-decoration:none;
		}
	/*-- モジュール内リンク文字の設定ここまで --*/
		
	/*-- 2カラムのサイドバーor3カラムの左サイドバー共通設定 --*/
		/*-- 全体の設定 --*/
			#side-a	{
				background:#eaeaea;
			}
		/*-- 各モジュールの設定 --*/
			#side-a .module {
				border-top:solid 2px #ffffff;
				border-bottom:solid 1px #c8c8c8;
			}
		/*-- 各モジュール上部の設定 --*/
			#side-a .module .module-top {
				border-left:solid 2px #ffffff;
			}
		/*-- 各モジュール内部の設定 --*/
			#side-a .module .module-body {
				background:#f3f3f3;
				border-bottom:solid 1px #ffffff;
				border-left:solid 2px #ffffff;
			}
		/*-- 各モジュール下部の設定 --*/
			#side-a .module .module-bottom {
				border-left:solid 2px #ffffff;
			}
		/*-- 各モジュールタイトルの設定 --*/
			#side-a .module h4 {
				padding:5px;
				border-left:solid 2px #ffffff;
				background:#86b8df;
				text-align:center;
				color:#000000;
				font-weight:bold;
				font-size:110%;
			}
	
	/*-- 3カラムの右サイドバー共通設定 --*/
		/*-- 全体の設定 --*/
			#side-b{
				background:#ededed;
			}
		/*-- 各モジュールの設定 --*/
			#side-b .module {
				border-top:solid 2px #ffffff;
				border-bottom:solid 1px #c8c8c8;
			}
		/*-- 各モジュール上部の設定 --*/
			#side-b .module .module-top {
				border-left:solid 2px #ffffff;
			}
		/*-- 各モジュール内部の設定 --*/
			#side-b .module-body {
				background:#ededed;
				border-right:solid 1px #ffffff;
				border-bottom:solid 1px #ffffff;
			}
		/*-- 各モジュールタイトルの設定 --*/
			#side-b .module h4 {
				padding:5px;
				border-right:1px solid #ffffff;
				background:#86b8df;
				text-align:center;
				color:#000000;
				font-weight:bold;
				font-size:110%;
			}

	
/*-- ■SECTION 110 サイドバーモジュール個別設定 ■ --*/
/*-----------------------------------------------------------------
サイドバー/モジュールの各個別要素の設定
------------------------------------------------------------------*/

	/*-- お知らせ【PR】 --*/
		#mod-advertising {}
	/*-- プロフィール --*/
		#mod-profile{}
	/*-- 携帯 --*/
		#mod-mobile {
			text-align:center;
		}
		#mod-mobile ul li{
			text-align:center;
		}
	/*-- 最新記事 --*/
		#mod-recent-entries{}
	/*-- カテゴリー --*/
		#mod-categories {}
	/*-- ログイン --*/
		#mod-login {}
		#mod-login ul li {
			border:none;
			padding:0;
		}
	/*-- 最新コメント --*/
		#mod-recent-comments {}
	/*-- 最新トラックバック --*/
		#mod-recent-trackbacks {}
	/*-- カレンダー --*/
		#mod-cal-table .mod-cal-caption {
			color:#378fd4;
			padding:4px;
			font-weight:bold;
		}
		#mod-cal-table .mod-cal-week {
			color:#378fd4;
		}
		#mod-cal-table  td.mod-cal-day-lin-td {
			background:#a8d0ef;
		}
		#mod-cal-table th,#mod-cal-table td {
			padding:2px;
			border-bottom:1px solid #cccccc;
			font-size:90%;
			text-align:center;
			vertical-align:middle;
		}
		#mod-cal-table .mod_cal_day_linked {
			color:#ffffff;
			text-decoration:none;
			}
	/*-- バックナンバー --*/
		#mod-back-numbers-scroll {}
		/*-- スクロールあり --*/
			#mod-back-numbers-scroll .module-body {
				padding:10px 5px;
				background:#ededed;
				border:solid 1px #fff;
			}
		/*-- スクロールなし --*/
			#mod-back-numbers-noscroll .module-body {
				padding:15px 15px 20px
			}
	/*-- ブックマーク --*/
		#mod-bookmarks .mod-boo-name {}
	/*-- goo おすすめ --*/
		#mod-goo-recommends li {
		border:none;
		}
	/*-- RSS/gooブログ --*/
		#mod-powered-by {
			background:#eaeaea;
			padding:10px;
		}
	/*-- フォントサイズ変更 --*/
		#font-size-changer {}
		#font-resizer ul li {
			background:none;
			padding:0;
			text-align:center;
			border:none;
		}

/*-----------------------------------------------------------------
メインエリアにオリジナルモジュールを配置した時の設定
------------------------------------------------------------------*/

	/*-- オリジナルモジュール全体の設定 --*/
		#mod-freearea-main {
			padding:10px;
			margin:0 0 20px 0;
			background-color:transparent;
			border-left:solid 1px #86b8df;
			border-right:solid 1px #86b8df;
			border-top:solid 5px #86b8df;
			border-bottom:solid 5px #86b8df;
		}
		#mod-freearea-main .mod-entry-set-top {
		}
		#mod-freearea-main .entry {
		}
	/*-- オリジナルモジュール上部の設定 --*/
		#mod-freearea-main .entry .entry-top {
		}
	/*-- オリジナルモジュールタイトルの設定 --*/
		#mod-freearea-main .entry .entry-top h3 {
			font-size:100%;
			background-color:transparent;
			line-height:1.25;
			text-align:center;
			color:#666666;
			border-bottom:solid 1px #cccccc;
			border-top:none;
		}
 		#mod-freearea-main .entry .entry-top h3 a {
			color:#378fd4;
			text-decoration:none;
		}
 		#mod-freearea-main .entry .entry-top h3 a:visited {
			color:#666;
		}
 		#mod-freearea-main .entry .entry-top h3 a:hover {
			color:#999;
			text-decoration:underline;
		}
	/*-- オリジナルモジュール内部の設定 --*/
		#mod-freearea-main .entry .entry-body {
			word-break:break-all;
			color:#333333;
			line-height:1.25;
			border:none;
		}
	/*-- オリジナルモジュール記事の設定 --*/
		#mod-freearea-main .entry .entry-body-text {
			padding:10px;
			margin:0;
		}
	/*-- オリジナルモジュール下部の設定 --*/
		#mod-freearea-main .entry .entry-bottom {
			border:none;
		}

/*-- End//INDIVIDUAL CSS Document for goo blog modulized templates 121010 --*/
inserted by FC2 system