/*-- [vega] sbs-ms.com common styling [05.09.28] --*/

/*------------------------------------------------------------
| page base/framing (ページレイアウト)
------------------------------------------------------------*/

html * { border-color: #e5e5e5; }
body { background: #f2f2f2 url(../_cmn/bg_pg.gif) repeat-y center top; }
body.sub { background: #fff; }

#pg_wrap {
	background-color: #fff;
	width: 800px;
	margin: 0px auto;
}

#pg_body { margin: 24px; }
#col_l { width: 416px; border-right-width: 1px; padding-right: 24px; float: left; }
#col_r { width: 288px; float: right; }

/*------------------------------------------------------------
| global base styling (共通基本スタイル)
------------------------------------------------------------*/

/*---------- anchor/link styling ----------*/
a { color: #349; }
a:hover { color: #fff; text-decoration: none; background-color: #5c6fd7; }

a.close { padding-left: 12px !important; background-image: url(../_cmn/icn_close_n.gif); background-position: left center; }
a.arr_l { padding-left: 12px !important; background-image: url(../_cmn/icn_arr-l_n.gif); background-position: left center; }
a.arr_r { padding-right: 12px !important; background-image: url(../_cmn/icn_arr-r_n.gif); background-position: right center; }

a:hover.close { background-image: url(../_cmn/icn_close_o.gif); }
a:hover.arr_l { background-image: url(../_cmn/icn_arr-l_o.gif); }
a:hover.arr_r { background-image: url(../_cmn/icn_arr-r_o.gif); }

.arr_lx, .arr_rx { color: #ccc; line-height: 125%; }
.arr_lx { padding-left: 12px !important; background-image: url(../_cmn/icn_arr-l_x.gif); background-position: left center; }
.arr_rx { padding-right: 12px !important; background-image: url(../_cmn/icn_arr-r_x.gif); background-position: right center; }

/*---------- common text styling ----------*/
p, ol { margin-top: 0px; }
/*-- [ie:win] only doesn't recognize next sibling (+) modifier [begin] --\*/
* html p, ol { margin-top: 6px; }
/*-- [ie:win] only [end] --*/
* + p, * + ol { margin-top: 6px; }

h1, h2, h3, h4, h5, h6 { color: #349; }

.line { border-bottom-width: 1px; }
.bline {
	padding-bottom: 4px;
	border-bottom-width: 1px;
	margin-bottom: 4px;
}

/*---------- font color styling ----------*/
.blk { color: #000; }
.wht { color: #fff; }
.blu { color: #349; }
.red { color: #c00; }
.grn { color: #2c862d; }

.ttl_blu, .ttl_red, .ttl_grn {
	color: #fff;
	padding: 1px 2px;
	margin-bottom: 4px;
}
.ttl_blu { background-color: #5c6fd7; }
.ttl_red { background-color: #f00; }
.ttl_grn { background-color: #4cb34d; }

/*------------------------------------------------------------
| global group/section styling (共通グループ／セクションスタイル)
------------------------------------------------------------*/

.grp { margin-bottom: 24px; }

/* find out if ie just sucks donkey dick or if there is something wrong with "default.css" */
.div_xs, .div_s, .div_m {
	height: 1px;
	overflow: hidden;
	border-bottom-width: 1px;
	display: block;
	clear: both;
}
.div_xs { padding-bottom: 3px; margin-bottom: 4px; }
.div_s { padding-bottom: 7px; margin-bottom: 8px; }
.div_m { padding-bottom: 15px; margin-bottom: 16px; }

.ilgrp { float: left; }

.hyou td, .hyou th {
	line-height: 125%;
	vertical-align: top;
	padding: 2px 0px 2px 8px;
}
.hyou .ttl, .hyou .r {
	padding: 2px 8px 2px 0px;
	text-align: right;
	border-right-width: 1px;
}
.hyou .r { padding: 2px 8px 2px 8px; }
.hyou .div { padding: 0px; border-bottom-width: 1px; }
/*------------------------------------------------------------
| menu (main/foot) styling (メニュースタイル)
------------------------------------------------------------*/

/*---------- menu base ----------*/
.nav {
	border-width: 1px 0px;
	border-color: #ccc;
	background: url(../_cmn/bg_mmenu_n.gif) repeat-x left center;
}
#pg_head .nav { text-align: center; }
#pg_foot .nav, #subwin .nav {
	font-size: 11px;
	background-image: url(../_cmn/bg_fmenu_n.gif);
	padding: 0px 24px;
}
#subwin .nav { padding: 0px 16px; }
/*---------- link container ----------*/
.nav .links,
.nav .left,
.nav .right {
	border-width: 0px 1px;
	border-color: #ccc #fff #ccc #e5e5e5;
}
.nav .links {
	margin: 0px auto;
	display: table; /*-- [ff] only --*/
	display: inline-block;
}
/*-- [ie:win] only fucks up center layout!!! [begin] --\*/
* html #pg_head .nav { padding: 0px 24px; }
* html .nav .links { float: left; display: block; }
/*-- [ie:win] only [end] --*/

/*---------- anchor tags ----------*/
.nav a, .nav .arr_lx, .nav .arr_rx {
	text-decoration: none;
	border-color: #ccc #e5e5e5 #ccc #fff;
	border-width: 0px 1px 0px 1px;
	float: left;
}
#pg_head .nav a, #pg_head .nav .arr_lx, #pg_head .nav .arr_rx { padding: 3px 6px; }
#pg_foot .nav a, #pg_foot .nav .arr_lx, #pg_foot .nav .arr_rx { padding: 2px 4px; }
#subwin .nav a, #subwin .nav .arr_lx, #subwin .nav .arr_rx { padding: 2px 4px; }

/*---------- anchor:hover ----------*/
.nav a:hover { border-color: #ccc #5c6fd7 #ccc #4053bf; }

/*---------- anchor:active (main menu) ----------*/
#id_top #pg_head .nav .link_top,
#id_backnum #pg_head .nav .link_backnum,
#id_order #pg_head .nav .link_order,
#id_ad #pg_head .nav .link_ad,
#id_company #pg_head .nav .link_company,
#id_links #pg_head .nav .link_links {
	color: #000 !important;
	background: #fff url(../_cmn/bg_mmenu_a.gif) repeat-x left top !important;
	padding-bottom: 4px;
	border-color: #ccc #ccc #fff #ccc !important;
	border-bottom-width: 0px;
	margin-bottom: -1px;
}

/*---------- anchor:active (foot menu) ----------*/
#id_top #pg_foot .nav .link_top,
#id_backnum #pg_foot .nav .link_backnum,
#id_order #pg_foot .nav .link_order,
#id_ad #pg_foot .nav .link_ad,
#id_company #pg_foot .nav .link_company,
#id_links #pg_foot .nav .link_links {
	color: #000 !important;
	background: #fff url(../_cmn/bg_fmenu_a.gif) repeat-x left bottom !important;
	padding-top: 3px;
	border-color: #fff #ccc #ccc #ccc !important;
	border-top-width: 0px;
	margin-top: -1px;
}

/*---------- pgtop btn ----------*/
.link_pgtop {
	width: 20px;
	background-image: url(../_cmn/icn_pgtop_n.gif);
	background-position: center center;
}
.link_pgtop:hover {
	background-image: url(../_cmn/icn_pgtop_o.gif) !important;
}

/*------------------------------------------------------------
| page header (ページヘッダー)
------------------------------------------------------------*/

#pg_head .ttl {
	height: 150px;
	background-image: url(../_cmn/logo_head-big.gif);
	background-position: left center;
}

#pg_head .img {
	background-image: url(../edit/img_top.jpg);
	background-position: right top;
}

#id_company #pg_head .img {
	background-image: url(../company/_prt/img_top.gif);
	background-position: right center;
	margin-right: 24px;
}
#id_backnum #pg_head .img { background-image: url(../backnum/_prt/img_top.jpg); }

#id_ad #pg_head .img { background-image: url(../ad/_prt/img_top.jpg); }

/*------------------------------------------------------------
| page footer (ページフッター)
------------------------------------------------------------*/

#copyright {
	font-size: 10px;
	line-height: 150%;
	text-align: right;
	background-image: url(../_cmn/logo_sbs-ms.gif);
	background-position: 24px 0px;
	padding: 8px 24px 16px;
}

/*------------------------------------------------------------
| titles (タイトルスタイル)
------------------------------------------------------------*/

.secttl {
	height: 24px;
	background-position: left top;
	border-bottom-width: 1px;
	margin-bottom: 8px;
}

/*-- "/" entry page --*/
#id_entry #ttl_sbsms { height: 55px; padding-bottom: 16px; background-image: url(../_prt/ttl_sbsms.gif); }
#id_entry #ttl_cp { height: 14px; background-image: url(../_prt/img_cp.gif); }

/*-- "/" top page --*/
#id_top #sec_news .secttl { background-image: url(../top/_prt/ttl_news.gif); }
#id_top #sec_about .secttl { background-image: url(../top/_prt/ttl_about.gif); }
#id_top #sec_shinkan .secttl { background-image: url(../top/_prt/ttl_shinkan.gif); }
#id_top #sec_order .secttl { background-image: url(../top/_prt/ttl_order.gif); }


/*-- "/backnum/" page --*/
#id_backnum #sec_backnum .secttl { background-image: url(../backnum/_prt/ttl_backnum.gif); }

/*-- "/order/" page --*/
#id_order #sec_order .secttl { background-image: url(../order/_prt/ttl_order.gif); }
#id_order #sec_form .secttl { background-image: url(../order/_prt/ttl_form.gif); }

/*-- "/ad/" page --*/
#id_ad #sec_ad .secttl { background-image: url(../ad/_prt/ttl_ad.gif); }

/*-- "/company/" page --*/
#id_company #sec_company .secttl { background-image: url(../company/_prt/ttl_kaisha.gif); }

/*------------------------------------------------------------
| top page styling (トップページスタイル)
------------------------------------------------------------*/

.onsale {
	color: #c00;
	font-size: 12px;
	float: right;
}
.border {
	border: 1px solid #ccc;
	margin: 0px 6px 2px 0px;
	float: left;
}

/*-- big button styling --*/
#btn_order, #btn_ad {
	width: 208px;
	height: 64px;
	display: block;
	float: left;
}
#btn_order { background-image: url(../_cmn/btn_order_n.gif); }
#btn_ad { background-image: url(../_cmn/btn_ad_n.gif); }
#btn_order:hover { background-image: url(../_cmn/btn_order_o.gif); }
#btn_ad:hover { background-image: url(../_cmn/btn_ad_o.gif); }

/*-- banner styling --*/
#banners {
	border-top-width: 1px;
	padding: 8px 0px;
}
#banners a { margin: 0px 4px 8px; float: left; }

/*-- fix (mistakes) styling --*/
.fix {
	font-size: 11px;
	line-height: 150%;
	background-color: #ffc;
	padding: 4px;
	border: 1px dotted #ccc;
	margin: 8px 0px;
}
.fix .ttl {
	padding-bottom: 4px;
	border-bottom: 1px dotted #ccc;
	margin-bottom: 4px;
}

/*-- news styling --*/
.news {
	padding-bottom: 8px;
	border-bottom-width: 1px;
	margin-bottom: 12px;
}
.news .date {
	font-size: 10px;
	line-height: 10px;
	font-weight: bold;
	text-align: right;
	margin: 0px 0px 4px;
}
.news .date img { margin-top: -2px; float: left; }
.news .txt { font-size: 11px; line-height: 150%; margin-top: 4px; }
.news .txt img { border: 1px solid #ccc; margin: 0px 6px 2px 0px; float: left; }

/*------------------------------------------------------------
| entry top page styling (SBSメディアサービストップページスタイル)
------------------------------------------------------------*/

#id_entry #col_l {
	text-align: right;
	width: 304px;
	padding-right: 0px;
	border: none;
	float: left;
}
#id_entry #col_r {
	width: 400px;
	padding: 122px 0px 0px 24px;
	border-left-width: 1px;
	float: right;
}

#id_entry #pg_foot { border-top-width: 1px; }

#id_entry .arr_r, #id_entry .arr_l { text-decoration: none; }

/*-- entry banner styling --*/
#bnr_vega {
	width: 284px;
	height: 64px;
	display: block;
	background-image: url(../_prt/bnr_vega_n.gif);
}
#bnr_vega:hover { background-image: url(../_prt/bnr_vega_o.gif); }

/*------------------------------------------------------------
| backnumber page styling (バックナンバースタイル)
------------------------------------------------------------*/

.covers a, a.cover {
	margin: 8px 18px;
	float: left;
}
.covers a img, a.cover img { border: 1px solid #ccc; }
.covers a:hover img, a:hover.cover img { border-color: #5c6fd7; }
.covers .num, a.cover .num {
	font-size: 15px;
	font-weight: bold;
	line-height: 125%;
	padding: 1px 0px;
	text-align: center;
	width: 152px;
	display: block;
}

/*------------------------------------------------------------
| order page styling (購読申し込みスタイル)
------------------------------------------------------------*/

#sec_form .secttl .note {
	font-size: 11px;
	text-align: right;
}
#ftbl_order {
	margin: 0px auto;
}
#ftbl_order .col_l {
	text-align: left;
	vertical-align: top;
	white-space: nowrap;
	padding-right: 12px;
	border-right-width: 1px;
	width: 200px;
}
#ftbl_order .col_r {
	text-align: left;
	vertical-align: top;
	padding-left: 12px;
	width: 420px;
}

/*------------------------------------------------------------
| misc styling (その他のスタイル)
------------------------------------------------------------*/

address { font-size: 11px; line-height: 130%; margin: 2px 0px; }

/*------------------------------------------------------------
| form styling (フォームスタイル)
------------------------------------------------------------*/

input, select, textarea, .button {
	background-color: #f2f2f2;
	border-color: #999 #ccc #ccc #999;
}
input:focus, select:focus, textarea:focus {
	background-color: #d1d8fa;
}
select, .button {
	border-color: #ccc #999 #999 #ccc;
}
.button {
	background-color: #d1d8fa;
	border-color: #ccc #999 #999 #ccc;
}
label:hover { background-color: #d1d8fa; }

#btn_form_submit { width: 120px; float: right; }
#btn_form_reset { width: 80px; float: left; }

/*---------- form element container styling ----------*/
.inp_tbl .bline { margin: 16px 0px 4px; }

.inp .ttl, .inp .ttl_need {
	text-align: right;
	white-space: nowrap;
	padding-right: 13px;
}
.inp .ttl_need {
	background-image: url(../_cmn/icn_dot.gif);
}
.need {
	padding-left: 13px;
	background-image: url(../_cmn/icn_dot.gif);
}
.need_r {
	padding-right: 13px;
	background-image: url(../_cmn/icn_dot.gif);
	background-position: right center;
}