/*------------------------------------------------------------------------------
    trunc - Theme 'default_blue' CSS
    Date: 2008-08
    Copyright (C) Xtone Ltd. All Rights Reserved.
------------------------------------------------------------------------------*/

@charset "UTF-8";

/* Font Family
----------------------------------------------------- */
body, html,input,textarea { font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', /*'メイリオ', Meiryo,*/ 'ＭＳ Ｐゴシック', 'MS PGothic', osaka, sans-serif; }


/* Default Link Color
----------------------------------------------------- */
a { color: #000099; }
a:hover { color: #004ff0; }


/* Background
----------------------------------------------------- */
/* 全体の背景 */
div#all { background: url('./img/header/mainBG.gif') left top repeat-x #51a5e4; }
/* ヘッダーの高さ */
div#content { padding-top: 40px; }
/** タブ内の背景色 **/
div#main { background-color: #eeeeee; }
/** フッターの背景色 **/
body,div#footer { background-color: #fff; }


/* Parts - Infobar
----------------------------------------------------- */
div#infobar { background-color: #333; }
div#infobar, div#infobar a { color: #fff; }
li#truncinfo a.ad { color: #ccc; }

span#welcome { background: url('./img/infobar/welcome.gif') left top no-repeat transparent; }

/* Parts - setupdesign
----------------------------------------------------- */
div#designsetup a { color: #fff; }
div#designsetup span { 
	display: block;
	background: url('/img/icon/designsetup.png') left no-repeat; 
	_background-image: url('/img/icon/designsetup.gif'); 
}


/* Parts - tab
----------------------------------------------------- */
/* 左右スクロールの背景色 */
div#tabs div.tabscroller { background-color: #335d85; }
/* 左右スクロールの幅 */
div#tabs div.tabscroller div { width: 14px; }
/* 左右スクロールの画像 */
div#tabs div.tabscroller#tabScrollLeft  { background: url('./img/common/arrow_left.gif') center 11px no-repeat #335d85; }
div#tabs div.tabscroller#tabScrollRight { background: url('./img/common/arrow_right.gif') center 11px no-repeat #335d85; }

/* 「タブを追加」アイコン */
li#addTab span{ background: url('./img/tab/addTab.gif') left top no-repeat transparent; }

/* タブのテキスト色（非選択時＆選択時） */
li.tab{ color: #EFF; }
li.tab.select { color: #0000AA; }

/* タブの背景 */
li.tab .tabinner {
    background: url('./img/tab/tab_off_bk.png') repeat !important;
	background: none;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="./img/tab/tab_off_bk.png", sizingMethod="scale");
    border: 1px solid #8dbfe2;
}
li.tab.focus {
	border: 1px solid #FF0000;
}
/* 選択されたタブの背景 */
div#tabbase,li.tab.select .tabinner { background-image: none !important; background-color: #FFFFFF !important; }
/* 移動後のタブの背景 */
li#tabghorst {
    background: url('./img/tab/tab_ghorst_bk.png') repeat !important;
	background: none;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="./img/tab/tab_ghorst_bk.png", sizingMethod="scale");
}
li.tab.select .tabinner {
	border: 1px solid #ffffff;
}

/* Parts - tabcontrol
----------------------------------------------------- */
/* 背景色 */
/*div#tabcontrol { background-color: #f2f2f2; }*/
div#tabcontrol { background-color: #FFFFFF; }

/* Parts - menuBox
----------------------------------------------------- */
/* メイン背景色 */
/*div#toggleGadgetList,
*/
div#menuBox,
div#menubase {
	background-color: #24517C;
}
/* サブ背景色 */
td#parentCategory li.odd a,
td#subCategory li a,
div#gadgetsListInfo {
    background-color: #507496;
}
/* テキスト色 */
/*div#toggleGadgetList,
*/
div#menuBox,
div#menuBox a {
    color: #fff;
    text-decoration: none;
}

div#closeGadgetList { background: url('./img/menuBox/arrow_up.gif') center center no-repeat #00ccff; }

td#gadgetSearch li a:hover,
td#gadgetSearch li a.selected,
td#parentCategory li a:hover,
td#parentCategory li a.selected,
td#subCategory li a:hover,
td#subCategory li a.selected {
    background: url('./img/menuBox/arrow_right.gif') right center no-repeat #0099cc;
}
td#gadgets li.select a,
td#gadgets li a:hover {
    color: #000;
    background-color: #FFF;
}
a.prevGadgets { background: url('/img/arrow/grayArrow_left.gif') left center no-repeat transparent; }
a.nextGadgets { background: url('/img/arrow/grayArrow_right.gif') right center no-repeat transparent; }

/* Parts - Overlay Box
 *  -> オーバーレイボックスの背景
 *  ->オーバーレイボックスの枠線
----------------------------------------------------- */
div#tabrenamebox,
div#tabsettingbox {
    background: url('./img/tab/tab_rename_bk.png') repeat;
    border: 1px solid #000000;
    color: #FFFFFF;
}
#tabsettingbox fieldset {
    border: 1px solid #f0f0f0;
}
#tabsettingbox fieldset img {
    background-color: #ffffff;
}

.tooltip {
    background: #FFFFFF;
    border: 1px solid #303030;
    color: #000000;
}
/* Parts - footer
 *  -> ガジェットエリアとフッターの境界線
 *  -> フッターの文字色
----------------------------------------------------- */
div#footer { border-top: 1px solid #D1E1EA; }
div#footer, div#footer a {
    color: #aaa;
    text-decoration: none;
}

/* Parts - column
 *  -> リサイズ用のつまみ
----------------------------------------------------- */
.columnResize {	background: url(./img/column/columnResize_off.gif) center top no-repeat;}
.columnResize:hover { background: url(./img/column/columnResize_on.gif) center top no-repeat;}

/* Parts - gadget
 *  -> ガジェットの影
 *  -> ガジェットのボーダー色
 *  -> ガジェットの背景
----------------------------------------------------- */
div.gadget {
/* カラムが落ちるのでコメントアウト   
	box-shadow: 2px 2px 7px #BBB;
    -moz-box-shadow: 2px 2px 7px #BBB;
    -webkit-box-shadow: 2px 2px 7px #BBB;
*/
}
div.gadgetheader,
div.gadgetconfig,
div.gadgetbody,
div.gadgetfooter {
    border: 1px solid #bbb;
}
div.gadgetconfig,div.gadgetbody,div.gadgetfooter { border-top: none; }

div.gadgetheader { background: url('./img/gadget/titleBG.gif') left top repeat-x #dedede; }
div.gadgetconfig { background-color: #E7E7E7; }
div.gadgetbody { background-color: #fff; }
div.gadgetfooter { background-color: #eaeaea; }

#gadgetghorst {
    background: url('./img/tab/tab_ghorst_bk.png') repeat;
}

/* Design - overlay
----------------------------------------------------- */
.overlay { background-color: #000000; }
/*ライトボックスの色換え
.overlayForm { background-color: #FFFFFF;}*/


/* Design - alertBox
----------------------------------------------------- */
/*  -> ライトボックスの周りにある透明な画像　*/
div.alertBoxWrapper {
	background: url('./img/alertBox/alertBoxWrapperBG.png') left top repeat transparent;
	_background-image: none;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="./img/alertBox/alertBoxWrapperBG.png", sizingMethod="scale");
}
/*  -> ライトボックスの箱　*/
div.alertBox {
	background: #eff5fa;
	background: url('./img/alertBox/alertBoxBG.gif') left top repeat-y #ffffff;
}
/*  -> ライトボックスの背景　*/
div.alertBoxBody {
	background: url('./img/alertBox/alertBoxBGHeader.gif') left top no-repeat transparent;
}
div.alertBoxFooter {
	background: url('./img/alertBox/alertBoxBGFooter.gif') left top no-repeat transparent;
}
/*  -> ライトボックスの一番上のタイトル　*/
div.alertBox h1 {
	background: url('./img/alertBox/alertBoxTitleBG.gif') left top repeat-y;
}
/*  -> ライトボックスのタイトル・本文などの装飾部分　*/
div.alertBox h2 {
	background: url('./img/arrow/blueArrow_right.gif') left top no-repeat transparent;
}
div.alertBox div.alertFormBox{
    background: url('./img/alertBox/alertBoxFormBoxBG.gif') left top repeat-y transparent;
}

/*  -> ライトボックスのフォーム部分の背景　*/
div.alertBox div.alertForms {
    background: url('./img/alertBox/alertBoxFormBoxBGHeader.gif') left top no-repeat transparent;
}
div.alertBox div.alertFormBoxFooter {
    background: url('./img/alertBox/alertBoxFormBoxBGFooter.gif') left top no-repeat transparent;
} 

/*  -> デザイン設定の箱　*/
div.alertBox #designBox {
	background-color: white;
}
div.alertBox .designThumbList h3 {
	color: #666;
}


/* Design - subPage
----------------------------------------------------- */
body#subPage {
	background: url(./img/subPage/subPageMainBG.png) repeat-x left top #C8E2F4;
}

*:first-child+html body#subPage {
    background-color: #c1def3;
}

div#subPageBoxWrapper {
    background: url('./img/subPage/subPageBoxWrapperBG.gif') left top repeat-x #d3e8f6;
}
div#subPageBox {
    background: #eff5fa;
    background: url('./img/subPage/subPageBG.gif') left top repeat-y #ffffff;
}
div#subPageBoxBody {
    background: url('./img/subPage/subPageBGHeader.gif') left top no-repeat transparent;
}
div#subPageBoxFooter {
    background: url('./img/subPage/subPageBGFooter.gif') left top no-repeat transparent;
}

div#subPageBox h1 {
    background: url('./img/subPage/subPageTitleBG.gif') left top repeat-y;
}
div#subPageBox h2 {
    background: url('./img/arrow/blueArrow_right.gif') left top no-repeat transparent;
}
div#subPageBox h3 {
    background: url('./img/arrow/grayArrow_right.gif') left center no-repeat transparent;
}
div#subPageBox div#subPageFormBox{
    background: url('./img/subPage/subPageFormBoxBG.gif') left top repeat-y transparent;
}
div#subPageBox div#subPageForms {
    background: url('./img/subPage/subPageFormBoxBGHeader.gif') left top no-repeat transparent;
}

div#subPageBox div#subPageFormBoxFooter {
    background: url('./img/subPage/subPageFormBoxBGFooter.gif') left top no-repeat transparent;
}