/* ============== 0. Reset ============================================================================================================== */ body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, p, blockquote, th, td, form, fieldset, legend {margin:0; padding:0; } article, aside, details, figcaption, figure, , header, hgroup, nav, section {display: block; } /* ============== 1. The root element ================================================================================================== */ html {overflow-y: scroll; background: white url(/img/common/bg.jpg) left top repeat-x; } /* for mozilla: always display scrollbar */ /* ============== 2. Sections ========================================================================================================== */ body{ padding-top: 0px; background: url(/img/common/bg_logo.jpg) left top no-repeat; color: #000; font-family: "メイリオ", Meiryo, "MS UI Gothic", "ＭＳ Ｐゴシック", sans-serif;/* for ie8/7/6 */ line-height: 1.5; *font-size: 82%; /* for ie6/7 */ min-width: 100%; min-height: 100%; width:100%; } /*section {} /* 一つのセクションであることを示す*/ /*nav{}/* ナビゲーションであることを示す*/ /*article{}/* 記事であることを示す*/ /*aside{}/* 余談・補足情報のセクションであることを示す*/ h1 {font-size: 32px;} h2 {font-size: 26px;} h3 {font-size: 20px;} h4 {font-size: 18px;} h5 {font-size: 16px;} h6 {font-size: 14px;} h1, h2, h3, h4, h5, h6 {line-height: 1.2;} /*hgroup{}/* セクションの見出しを表す、見出しをまとめる*/ #header,header,header.wrapper {z-index: 1000;} /* 文書のヘッダ情報を表す*/ #footer{background-color:black; bottom: -10px;max-width:100%; margin:7px 0 10px 0; padding:3px 0 3px 0; height:26px; } #footer h2 {color:white; font-size:small; text-align:center; line-height:14px;} #footer p {background-color:black; color:white; font-size:xx-small; text-align:center; padding:0 0 3px 0; } #footer a {background-color:black; href="http://maps.google.co.jp/maps?daddr=%E5%B1%B1%E6%A2%A8%E7%9C%8C%E5%8C%97%E6%9D%9C%E5%B8%82%E5%B0%8F%E6%B7%B5%E6%B2%A2%E7%94%BA2790-2+@35.87395" style="color:white; background-color:black;"} #footer em {color:#FFCCFF; background-color:black;} /* 文書のフッタ情報を表す*/ #footer h2 { font-family:'Clayton Wide', 'Times New Roman',Times; 'メイリオ', Meiryo,sans-serif; } address {font-weight: normal;font-style: normal;} /* 連絡先・問合せ先を表す*/ /* ============== 3. Grouping content ====================================================================================== */ p {font-size: 13px; line-height:18px;} /* ひとつの段落（パラグラフ）であることを表す*/ hr {display: none;} /* テーマや話題の区切りを表す*/ pre {font-family:monospace;} /*フォーマット（整形）済みのテキスト = 半角スペースや改行をそのまま表示する*/ /* blockquote {} /* 引用・転載セクションであることを表す*/ /*ol{}/* 順序のあるリストを表示する*/ /*ul{}/* 順序のないリストを表示する*/ li {list-style: none;} /* リストの項目を記述する*/ /*dl{}/* 定義・説明リストを表す*/ /*dt{}/* 定義・説明される言葉を表す*/ /*dd{}/* 定義用語や言葉の説明をする*/ /*figure{}/*… 図表であることを示す*/ /*figcaption{}/* 図表のキャプションを示す*/ /*div{}/*ひとかたまりの範囲として定義する*/ /* ============== 4. Text-level semantics ============================================================================ */ a:link { /*a{}/* ハイパーリンクを指定する*/ color: blue; text-decoration: none; -moz-transition:all 0.2s ease-in-out;-webkit-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;} a:visited {color: #551a8b;} a:hover, a:active {color: fuchsia; text-decoration: none; } .btnLink {border: solid 3px #909090;-moz-transition: all 0.2s ease-in-out;-webkit-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } a:hover .btnLink {border: solid 3px #ff9900; } em, strong {font-weight: bold;font-style: normal; }/*em{}/* 強勢する（アクセントを付ける）箇所を表す*/ /*strong{}/* 強い重要性を表す*/ /*small{}/* 免責・警告・著作権などの注釈や細目を表す*/ /*s{}/* すでに正確ではなくなった内容を表す*/ cite, dfn, code, caption, var {font-weight: normal;font-style: normal; } /*cite{}/* 作品のタイトルを表す*/ q:before, q:after {content: '';} /* 引用句・引用文であることを表す*/ /*dfn{}/* 用語が使用されていることを示す*/ abbr, acronym {border: none;font-variant: normal; } /*abbr{}/* 略語や頭字語であることを表す*/ /*time{}/*… 日付や時刻を正確に示す*/ code {font-family: monospace; } /* プログラムなどのコードであることを示す*/ /*var{}/* 変数であることを示す*/ /* samp {} */ /* kbd {} */ sub {vertical-align: text-bottom; }/* 下付き文字を表す*/ sup {vertical-align: text-top;} /* 上付き文字を表す*/ /*i{}/* 声や心の中で思ったことなど、他と区別したいテキストを表す*/ /*b{}/* 文書内のキーワードや製品名など、他と区別したいテキストを表す*/ /*mark{}/*文書内の該当テキストを目立たせる*/ /*ruby{}/*ルビをふる*/ /*rt{}/* ルビのテキストを指定する*/ /*rp{}/* ルビを囲む記号を指定する*/ /*bdo{}/* 文字表記の方向を指定する*/ /*span{}/* ひとつの範囲として定義する*/ /*br{}/* 改行する*/ /*wbr{}/* 改行しても良い位置を示す*/ /* ============== 5. Edits ===================================================================================================================================== */ ins{text-decoration: none;} /* 追加された部分であることを示す*/ /*del{}/* 削除された部分であることを示す*/ /* ============== 6. Embedded content ================================================================================================================= */ img {border: none;vertical-align: bottom;width: auto;height:auto;width: auto\9; /* ie8 */;} /* 画像を表示する*/ /*iframe{}/* インラインフレームを作る*/ /*embed{}/* プラグインデータを埋め込む*/ object {vertical-align: middle; outline: none; }/* 文書に外部リソースを埋め込む*/ /*param{}/* プラグインのパラメータを指定する*/ /*video{}/* 動画を再生する*/ /*audio{}/*… 音声を再生する*/ /*source{}/* 動画や音声などのURLや種類を指定する*/ /*canvas{}/* 図形を描く*/ /*map{}/* イメージマップを作成する*/ /*area{}/* イメージマップのハイパーリンク領域を設定する*/ /* ============== 7. Tabular data ============================================================================================================================== */ /*table{}/* テーブル（表）を作成する*/ /*caption{}/* テーブル（表）にキャプションをつける*/ /*colgroup{}/* 表の縦列をグループ化する*/ /*col{}/* 表の縦列の属性やスタイルを指定する*/ /*tbody{}/* テーブル（表）のボディ部分を定義する*/ /*thead{}/* テーブル（表）のヘッダ部分を定義する*/ /*tfoot{}/* テーブル（表）のフッタ部分を定義する*/ /*tr{}/* テーブル（表）の横一行を定義する*/ /*td{}/* テーブル（表）のデータセルを作成する*/ /*th{}/* テーブル（表）の見出しセルを作成する*/ /* ============== 8. Forms =============================================================================================================================== */ /*form{}/* 入力・送信フォームを作る*/ fieldset {border: none;} /* フォームの入力項目をグループ化する*/ /*legend{}/* フォームの入力項目グループにキャプションを付ける*/ label, input, select, textarea {margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0; font-size:100%; font-family:inherit; vertical-align:middle; } label {cursor: pointer; } /*label{}/* フォーム部品と項目名（ラベル）を関連付ける*/ /*input{}/* フォームを構成する様々な入力部品を作成する*/ /*input type="hidden"{}/* 画面上は表示されない隠しデータを指定する*/ /*input type="text"{}/* 一行テキストボックスを作成する*/ /*input type="search"{}/* 検索テキストの入力欄を作成する*/ /*input type="tel"{}/* 電話番号の入力欄を作成する*/ /*input type="url"{}/* URLの入力欄を作成する*/ /*input type="email"{}/* メールアドレスの入力欄を作成する*/ /*input type="password"{}/* パスワード入力欄を作成する*/ /*input type="datetime"{}/* 協定世界時による日時の入力欄を作成する*/ /*input type="date"{}/* 日付の入力欄を作成する*/ /*input type="month"{}/* 月の入力欄を作成する*/ /*input type="week"{}/* 週の入力欄を作成する*/ /*input type="time"{}/* 時間の入力欄を作成する*/ /*input type="datetime-local"{}/* ローカル日時の入力欄を作成する*/ /*input type="number"{}/* 数値の入力欄を作成する*/ /*input type="range"{}/* レンジ入力欄を作成する*/ /*input type="color"{}/* 色の入力欄を作成する*/ /*input type="checkbox"{}/* チェックボックスを作成する*/ /*input type="radio"{}/* ラジオボタンを作成する*/ /*input type="file"{}/* サーバーへファイルを送信する*/ /*input type="submit"{}/* 送信ボタンを作成する*/ /*input type="image"{}/* 画像ボタンを作成する*/ /*input type="reset"{}/* リセットボタンを作成する*/ /*input type="button"{}/* 汎用ボタンを作成する*/ /*input autofocus{}/* 入力欄にカーソルを当てて自動フォーカスする*/ /*input placeholder{}/* 入力欄に初期表示する内容を指定する*/ /*input required{}/* 入力必須であることを示す*/ /*input pattern{}/* 正規表現で入力値のパターンを指定する*/ /*input min max{}/* 入力できる最小値と最大値を指定する*/ /*input step{}/* 入力欄で刻むステップ値を指定する*/ /*input autocomplete{}/* 入力候補を提示して入力内容を自動補完する*/ /*input multiple{}/* 複数の値を入力・選択できるようにする*/ /*button{}/* ボタンを作成する*/ /*select{}/* セレクトボックスを作成する*/ /*datalist{}/* 入力候補となるデータリストを定義する*/ /*optgroup> … 選択肢をグループ化する*/ /*option{}/* セレクトボックスや入力候補リストの選択肢を指定する*/ textarea {overflow:auto; vertical-align:top; resize:vertical; }/* 複数行のテキスト入力欄を作成する*/ /*keygen{}/* フォーム送信時にキーを発行する*/ /*output{}/* 計算結果を示す*/ /*progress> … タスク完了までの進行状況を示す*/ /*meter{}/* 規定範囲内の測定値を表す*/ /* ============== 9. Interactive elements =========================================================================================================================== */ /*details{}/* 備考や操作手段などの詳細情報を示す*/ /*summary{}/* /*details>の内容の要約を示す*/ /*command> … 操作メニューの各コマンドを指定する*/ /*menu{}/*… 操作メニューを作成する*/ /* ============== 10. Other ============================================================================================================================================ */ /* ============== For IE6/7 ========================================================================================================================================= */ /* for ie7: page zoom bug fix */ *:first-child + html body,*:first-child + html br {letter-spacing: 0; } /* ============== chromeframe ===================================================================================================================================== */ .ie6 .chromeframe {margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; z-index: 1000 !important; width: 100%; } /* ================================================================================================================= ================================================ ALL: Theme ==================================================== ================================================================================================================= */ #wrapper {width:800px;} #page_header {max-width:800px; height:40px; background-color: transparent; background-image: url('../images/02anything/heart_2014_40.jpg')} #main-container {max-width:545px; top:42px;} #footer {max-width:800px;} #page_header h1 { color: #333333; text-align:center; text-shadow: -1px -1px 0px #FFFFFF,1px 1px 0px #FFFFFF;} #title-header, #news_flash {border-style: solid; border-width: 1px; border-color: #E8E8E8 #999999 #999999 #E8E8E8; background-color: #F2EDB0; border-radius: 4px; } #news_flash h3 {text-shadow: -2px -2px 2px #FFFFFF,1px 1px 3px gray;} #news_flash h2 {text-shadow: -1px -1px 1px #FFFFFF,1px 1px 2px gray;} #title-header-wrapper {width: 235px; } #main-container {border-style: solid; border-width: 1px; border-color: #E8E8E8 #999999 #999999 #E8E8E8; background-color: #FFFFF5; border-radius: 4px;} #main-container section img {margin-bottom:10px;} #title-header h1 {font-family: 'Clayton Wide', 'Times New Roman',Times; } #main-container h2 {text-shadow: -1px -1px 1px #FFFFFF,1px 1px 2px gray;} .style1 { /*↓↓↓