/*** BE-MONTHLY.COM ***/
/* -----------------------------------------------
CSS file For AT-FACTORY Inc.
FileName:	styles-site.css
Build:		2007.3.27
----------------------------------------------- */


/* BASE
------------------------------------------------------------ */
body{
margin: 0;
padding: 0;
background-image:url(images/base_bg.jpg);
background-color:#444;
color:#444;
/*font-family: 'Lucida Grande','Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3',sans-serif;*/
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
line-height:170%;
font-size:small;
}

div#container{
width: 900px;
margin: 10px auto;
background-color:#FFF;
}

a, a:link{
color:#444;
text-decoration:underline;
}

a:visited{
color:#666;
text-decoration:underline;
}

a:hover{
color:#444;
text-decoration:none;
}

a:active{
color:#444;
text-decoration:underline;
}

img{
border:0;
}

p{
margin:5px 0 5px 0;
}

hr{
border:solid 1px #C1C1C1;
}

.icon{
vertical-align:middle;
margin:0 5px 0 0;
}

.red12{
color:#FF0000;
font-size:12px;
}

.red14{
color:#FF0000;
font-size:14px;
}

/* HEADER
------------------------------------------------------------ */
div#header{
*width: 900px;
background-image:url(images/header_bg.jpg);
background-repeat:repeat-x;
height:50px;
}

div#header h1{
margin:0;
padding-left:16px;
}

/* FOOTER
------------------------------------------------------------ */
div#footer{
*width: 900px;
height:140px;
clear: both;
background-image:url(images/footer_bg.jpg);
background-position:top;
background-repeat:repeat-x;
margin-top:10px;
}

div#footer-nav{
float:left;
position:relative;
top:30px;
left:15px;
width:551px;
}

div#copyright{
float:left;
position:relative;
top:55px;
left:15px;
width:551px;
}

div#contact-btn{
float:right;
position:relative;
top:0px;
right:10px;
width:240px;
height:103px;
}

/* PICKUP MOVIE
------------------------------------------------------------ */
div#left-box-movie{
background-image:url(images/pickup_movie_bg.jpg);
background-repeat:no-repeat;
margin-left:10px;
_margin-left:5px;
margin-bottom:10px;
width:550px;
height:560px;
float:left;
}

div#pickup-movie{
position:relative;
top:25px;
left:35px;
width:480px;
height:360px;
text-align:center;
}


div#left-box-movie h2 a{
position:relative;
top:80px;
width:530px;
margin:0 10px 0 10px;
font-size:14px;
color:#FFF;
}

div#left-box-movie h4{
position:relative;
top:75px;
*top:55px;
width:530px;
font-weight:100;
margin:0 10px 0 10px;
font-size:12px;
color:#FFF;
}

/* Google Map
------------------------------------------------------------ */
div#map{
margin-left:10px;
_margin-left:5px;
margin-top:8px;
margin-bottom:5px;
float:left;
}

div#map2{
margin-left:10px;
_margin-left:5px;
margin-bottom:5px;
float:left;
}

/* LEFT BOX DETAIL
------------------------------------------------------------ */
div#left-box-detail{
margin-left:10px;
_margin-left:5px;
margin-bottom:10px;
width:550px;
float:left;
}

#left-box-detail table{
background:#999;
}

#left-box-detail th{
padding:5px;
text-align:center;
background:#EDEDED;
font-weight:bold;
width:100px;
}

#left-box-detail td{
background:#FFF;
padding:5px;
}

/* LEFT BOX PRICE
------------------------------------------------------------ */
div#price{
clear: both;
width:880px;
margin:10px;
*margin:5px 10px 10px 10px;
}

div#price table{
background-color:#999;
width:880px;
}

#price th{
padding:5px;
text-align:center;
background:#EDEDED;
font-weight:bold;
}

#price tr.color1{
background-color:#FFF5F5;
padding:5px;
}

#price tr.color2{
background-color:#FFEBEB;
padding:5px;
}

#price tr.color3{
background-color:#FFE0E0;
padding:5px;
}

#price tr.color4{
background-color:#FFD6D6;
padding:5px;
}

#price tr.color5{
background-color:#FFCCCC;
padding:5px;
}

#price td{
padding:5px;
text-align:center;
}

/* RIGHT BOX 
------------------------------------------------------------ */
div#right-box{
margin-left:10px;
margin-top:8px;
width:320px;
height:560px;
float:left;
}

/* CATEGORY MENU 
------------------------------------------------------------ */
div#categories-box{
margin-left:10px;
width:310px;
height:560px;
float:left;
}

div#categories{
border:solid 1px #C1C1C1;
width:318px;
}

div#categories ul{
list-style-type:none;
padding:0;
margin: 0;
color:#333333;
font-weight:100;
}

div#categories li{
clear:both;
background-image:url(images/main_menu_bg.jpg);
background-repeat: no-repeat;
padding-left:20px;
padding-bottom:0;
margin:0px;
color:#FC6800;
font-weight:bold;
}

div#categories ul ul{
margin-left: 0;
padding-left:0;
margin-right:10px;
}

div#categories li li{
display:inline;
background-image: url(images/main_menu_bg2.jpg);
background-position: 0;
margin-left: 0;
padding-left:0;
color:#CCC;
font-weight:100;
line-height:200%;
}

div#categories li li a{
display:inline;
background-image: url(images/main_menu_bg2.jpg);
background-position: 0;
margin-left: 0;
padding-left:0;
color:#333333;
font-weight:100;
line-height:200%;
}

/* ENTRY MOVIE 
------------------------------------------------------------ */
div#movie{
background-image:url(images/no_movie.jpg);
background-repeat:no-repeat;
width:320px;
height:240px;
border:solid 1px #000000;
}

/* ENTRY PHOTO
------------------------------------------------------------ */
div#sumb{
margin-top:5px;
width:320px;
}

div#entry-thumb-n{
float:left;
background-image:url(images/no_photo_s.jpg);
background-repeat:no-repeat;
width:60px;
height:46px;
}

div#entry-thumb-s{
float:left;
background-image:url(images/no_photo_s.jpg);
background-repeat:no-repeat;
margin-left:5px;
width:60px;
height:46px;
}

/* ENTRY CAMPAIGN INFO 
------------------------------------------------------------ */
div#campaign{
background-color:#FFF;
float:left;
overflow:auto;
margin-top:5px;
_margin-top:8px;
padding:5px;
width:308px;
height:252px;
_height:246px;
border:solid 1px #999999;
}

/* ENTRY LAYOUT
-------------------------------------------------*/
div#right-box-layout{
float:left;
border:solid 1px #999;
background-color:#FFF;
margin-left:10px;
width:320px;
text-align:center;
}

div#right-box-layout img{
padding-top:30px;
}

/* ENTRY FLASH
-------------------------------------------------*/
div#flash{
clear: both;
width:900px;
padding:5px 0 10px 0;
}

/* ABOUT
-------------------------------------------------*/
div#about {
background-image:url(images/about_bg.jpg);
background-repeat:no-repeat;
width:880px;
margin:10px;
padding:1px 0 1px 0;
}

div#about h4{
*margin-top:20px;
margin-left:190px;
font-size:14px;
color:#666;
width:675px;
}

div#news{
clear:both;
width:858px;
border:solid 1px #C1C1C1;
margin:0 10px 10px 10px;
padding:10px;
}

div#news-date{
padding:8px;
background-color:#FDEDE5;
border-left:solid 4px #FE6400;
font-weight:bold;
color:#FE6400;
}

div#news-text{
padding:8px;
background-color:#FCFCFC;
}

div#static-box{
clear:both;
width:878px;
border:solid 1px #C1C1C1;
margin:10px;
}

/* FLOW
-------------------------------------------------*/
div#flow-body{
background-color:#FFF;
padding:10px;
font-size:12px;
}

/* ITEM
-------------------------------------------------*/
div#item-title{
background-image:url(images/sub_title_bg.jpg);
background-repeat:no-repeat;
height:36px;
font-size:14px;
font-weight:bold;
padding-left:30px;
padding-top:5px;
}

div#item-body{
background-color:#FFF;
padding:5px 30px 5px 30px;
}

div#item-body img{
margin:5px;
}

/* FAQ
-------------------------------------------------*/
div#faq-category{
background-image:url(images/icon_check.jpg);
background-repeat:no-repeat;
background-position:0;
font-size:14px;
font-weight:bold;
padding:5px 20px 5px 20px;
margin-left:10px;
}

div#faq-question{
background-image:url(images/arrow.gif);
background-repeat:no-repeat;
background-position:0;
font-size:12px;
padding:5px 30px 5px 10px;
margin-left:30px;
}

div.faq-title{
background-image:url(images/sub_title_bg.jpg);
background-repeat:no-repeat;
height:36px;
font-size:14px;
font-weight:bold;
padding-left:30px;
padding-top:5px;
}

div#faq-body{
background-color:#FFF;
padding:5px 30px 5px 30px;
}

div#faq-body img{
margin:5px;
}

/* SYSTEM
-------------------------------------------------*/
div#system-category{
background-image:url(images/icon_check.jpg);
background-repeat:no-repeat;
background-position:0;
font-size:14px;
font-weight:bold;
padding:5px 20px 5px 20px;
margin-left:10px;
}

div#system-question{
background-image:url(images/arrow.gif);
background-repeat:no-repeat;
background-position:0;
font-size:12px;
padding:5px 30px 5px 10px;
margin-left:30px;
}

div.system-title{
background-image:url(images/sub_title_bg.jpg);
background-repeat:no-repeat;
height:36px;
font-size:14px;
font-weight:bold;
padding-left:30px;
padding-top:5px;
}

div#system-body{
background-color:#FFF;
padding:5px 30px 5px 30px;
}

div#system-body img{
margin:5px;
}

/* RECOMMEND
-------------------------------------------------*/
div#recommend{
clear:both;
width:880px;
display: block;
}

div#recommend-info h3{
background-image:url(images/icon_title.jpg);
background-repeat:no-repeat;
background-position:0;
padding-left:17px;
font-size:14px;
margin:0;

}

#recommend-info:after {
 content:".";
 height:0;
 clear:both;
 display: block;
 visibility:hidden;
}

div#recommend-info{
width:870px;
margin:0 10px 5px 10px;
border:solid 5px #EDEDED;
}

div#list-photo{
float:left;
margin:5px;
_margin:5px 5px 5px 3px;
width:120px;
}

div#list-body{
float:right;
width:730px;
_width:720px;
margin:5px 5px 5px 0;
}

div#list-campaign{
float:left;
margin:5px;
}

div#goto-top{
clear:both;
text-align:right;
margin-bottom:5px;
padding:0;
}

div#goto-top2{
clear:both;
text-align:right;
margin:0 10px 0 10px;
padding:0;
}


/* MAIN TITLE
-------------------------------------------------*/
div#title{
clear:both;
width:860px;
margin:10px 10px 0 10px;
}

div#title h3{
background-image:url(images/main_title_bg.jpg);
background-repeat:no-repeat;
padding-left:10px;
padding-top:7px;
*padding-top:8px;
width:870px;
height:43px;
color:#FFF;
margin:0;
}

div#title h4{
font-size:12px;
font-weight:100;
margin:0;
padding:0;
}


/* TUB MENU
-------------------------------------------------*/
ul#tabnav {
background-image:url(images/tub_bg.png);
background-repeat:repeat-x;
font: bold 12px verdana, arial, sans-serif;
list-style-type: none;
padding-bottom: 24px;
*padding-bottom: 25px;
border-bottom: 1px solid #CCC;
margin: 0;
padding-left:12px;
*padding-left:8px;
}

ul#tabnav li {
float: left;
background-color: #FDEDE5;
margin: 2px 2px 0 2px;
border: 1px solid #CCC;
width:120px;
text-align:center;
}

body#home li.home, body#article li.article, body#flow li.flow, body#system li.system, body#item li.item, body#faq li.faq, body#contact li.contact {
border-bottom: 1px solid #fff;
background-color: #fff;
width:112px;
*width:120px;
}

body#home li.home a, body#article li.article a, body#flow li.flow a, body#system li.system a, body#item li.item a, body#faq li.faq a, body#contact li.contact a{
color: #000;
text-align:center;
width:104px;
*width:120px;
}

#tabnav a {
float: left;
display: block;
color: #666;
text-decoration: none;
padding:3px 4px 3px 4px;
*padding:2px 0 0 0;
text-align:center;
width:112px;
*width:120px;
}

#tabnav a:hover {
background: #fff;
*padding:2px 0 0 0;
width:112px;
*width:120px;

}

/* CONTROL BAR
-------------------------------------------------*/
div#control-bar{
background-image:url(images/control_bar_bg.jpg);
background-repeat:no-repeat;
width:880px;
height:56px;

margin:10px;
padding:0;
}

.control-bar-img{
float:left;
margin:15px 10px 0 10px;
}

.control-bar-border{
float:left;
margin:15px 0 0 0;
}
