@charset "Shift_JIS"; /* ------------------------------------------------------------ nk gacha machine file name: main.css Author: Riqua last updated: 2008.01.30 ======================= contents =========================== 1: サイト全体の要素セレクタ指定 2: 特定文字色カラー 3: カラムのレイアウトと背景 ; ============================================================ */ /* サイト全体の要素セレクタ指定 ------------------------------------------------------------ */ html{ margin: 0; padding: 0 0 50px 0; } body,th,td{ font-family: "Verdana","MS Pゴシック","Osaka"; font-size: 12px; margin: 0; padding: 0; color: #607100; line-height: 1.4em; } body{ background: #5e6e01 url(http://image.mgame.jp/gacha/nkonline/gacha1/bg.jpg) no-repeat left top; text-align: left; } form{ margin: 0; padding: 0; } a,label{ cursor: pointer; } img{ border:none; } a:link{ color:#06f;text-decoration: none; } a:visited{ color:#606;text-decoration: none; } a:hover{ color:#06f;text-decoration: underline; } /* 特定文字色カラー ------------------------------------------------------------ */ .caution{ color: #f93; font-weight: bold; } .r_color{ color: #fff; } .b_color{ color: #000; } /* カラムのレイアウトと背景 ------------------------------------------------------------ */ div#all{ position:relative; width: 740px; margin: 0 60px; } div#all div#header_top{ width:740px; height: 64px; } div#all div#main{ position:relative; background: url(http://image.mgame.jp/gacha/nkonline/gacha1/bg_main_mid.gif) repeat-y; height:100%; overflow:auto; } div#all div#main div#header{ margin: 0 6px; } /* 共通部レイアウト ------------------------------------------------------------ */ /* 熱血ロゴ部 */ div#all div#header_top img#logo02{ float:left; margin-top:16px; } div#all div#header_top img#nk_logo{ float:right; } /* ヘッダー */ div#all div#main div#header{ background: url(http://image.mgame.jp/gacha/nkonline/gacha1/catch.gif) no-repeat 180px 30px; } div#all div#main div#header img#logo01{ position: relative; top: -10px; } div#all div#main div#header div#right_item{ float: right; text-align: right; padding-right:4px; } div#all div#main div#header img.btn_close{ margin-bottom: 36px; } div#all div#main div#header img#price{ } div#all div#main div#header div.text{ padding: 0 20px; } /* メニュー */ div#all div#main div#menu{ width: 720px; height: 92px; margin-left: 10px; background: url(http://image.mgame.jp/gacha/nkonline/gacha1/bg_top_top.jpg) no-repeat 0 36px; } div#all div#main div#menu div#title{ float: left; } div#all div#main div#menu table#tab{ width: 360px; float: right; } div#all div#main div#menu table#tab td{ width: 120px; } /* コンテンツ(上部ボックス) */ div#all div#main div#top_contents{ width: 720px; margin-left: 10px; background: url(http://image.mgame.jp/gacha/nkonline/gacha1/bg_top_mid.gif) repeat-y; } div#all div#main div#top_contents div#contents{ /* add:080130/ T.Hori -IE7表示崩れ修正- */ width: 720px; background: url(http://image.mgame.jp/gacha/nkonline/gacha1/bg_top_pic.jpg) no-repeat top; } div#all div#main img#top_contents_bottom{ margin-left:10px; } div#all div#main img.subbar{ margin: 10px; } div#all div#main div#top_contents div.text{ margin: 5px 10px; color:#000; } /* 下部ボックス(注意事項など) */ div#all div#main div.bottombox_top, div#all div#main img.bottombox_top, div#all div#main img.bottombox_bottom{ margin-left: 10px; } div#all div#main img.bottombox_top{ margin-top: 10px; } div#all div#main div.bottombox_top{ width: 720px; padding-bottom: 5px; background: url(http://image.mgame.jp/gacha/nkonline/gacha1/bg_bottom_top.gif) no-repeat center bottom; } div#all div#main div.bottombox_top img.title{ position: relative; top: 26px; left: 1px; } div#all div#main div.bottombox{ width: 720px; margin: 0 10px; background: url(http://image.mgame.jp/gacha/nkonline/gacha1/bg_bottom_mid.gif) repeat-y; } div#all div#main div.cautionbox{ padding: 30px 0 5px 0; } div#all div#main div.bottombox ul{ margin: 0; padding: 0 10px 0 30px; } div#all div#main div.bottombox ul li{ margin-bottom: 7px; } div#all div#main div.bottombox div.box_contents, div#all div#main div#top_contents div.box_contents{ margin: 0 10px 10px 10px; } div#all div#main div.bottombox div.box_contents img, div#all div#main div#top_contents div.box_contents img{ margin-top: 10px; } /* ページトップへボタン */ div#all div#main img.totop{ display: block; float:right; clear:both; margin: 8px 10px 0 0; } /* フッター */ div#all div#footer{ color: #86aa2a; text-align: center; } /* 個別部品レイアウト ------------------------------------------------------------ */ /* トップ */ div#all div#main div#top_top_contents{ width: 720px; height: 353px; margin-left: 10px; background: url(http://image.mgame.jp/gacha/nkonline/gacha1/image_top01_200711.jpg) no-repeat; } div#all div#main div#top_top_contents div#top_item{ margin: 15px 0 0 5px; background: url(http://image.mgame.jp/gacha/nkonline/gacha1/top_conductor.gif) no-repeat; } div#all div#main div#top_top_contents div#top_item img#play_btn{ margin: 65px 0 30px 145px; } div#all div#main div#top_top_contents div#top_item img.top_btn{ margin: 0 3px; } /* 獲得景品一覧 */ div#all div#main div#top_contents div#contents table.item_view{ width: 680px; margin-left:20px; border-collapse: collapse; } div#all div#main div#top_contents div#contents table.item_view td, div#all div#main div#top_contents div#contents table.item_view th{ border: 1px solid #360; padding: 3px; } div#contents table.item_view td{ background-color: #EAF3D0; } div#contents table.item_view th{ background-color: #d5e6a0; } div#contents table.item_view .date1, div#contents table.item_view .date2{ width: 180px; text-align: center; } div#contents table.item_view td.name{ } div#contents table.page_control{ background: url(); margin: 10px auto; } div#contents table.page_control td{ width: 20px; } div#contents table.page_control td.jump{ width: 100px; text-align: center; } /* 景品一覧 */ /* (共通カラー設定) */ div#contents table td.itemlist_recommend table td.image img, div#all div#main div.second_contents table td.image img{ border: 2px solid white; } div#all div#main div#top_contents div#contents table td.itemlist_recommend, div#all div#main div.second_contents table{ border: 2px solid #607100; background-color: #d5e6a0; } div#contents table td.itemlist_recommend table td.name, div#all div#main div.second_contents table td.name{ padding: 4px; line-height: 1.1em; background: #607100; color: white; } /* (個別サイズ&配置設定)おすすめアイテム */ div#all div#main div#top_contents div#contents table#itemlist_rec{ margin-left: 20px; } div#all div#main div#top_contents div#contents table td.itemlist_recommend{ width: 160px; height: 200px; float: left; margin-left: 5px; } div#contents table td.itemlist_recommend table{ width: 160px; } div#contents table td.itemlist_recommend table td{ } div#contents table td.itemlist_recommend table td.image{ width:36px; } div#contents table td.itemlist_recommend table td.name{ width: 124px; } div#contents table td.itemlist_recommend table td.caption{ width: 160px; padding: 5px; } /* (個別サイズ&配置設定)その他アイテム */ div#all div#main div.second_contents{ position:relative; width: 720px; margin: 0 10px; clear:left; } div#all div#main div.second_contents table{ float: left; width: 230px; height: 100px; margin: 4px; } div#all div#main div.second_contents table td.image{ vertical-align: top; width: 36px; } div#all div#main div.second_contents table td.name{ width: 194px; height: 28px; } div#all div#main div.second_contents table td.caption{ height: 180px; vertical-align: top; }