@charset "UTF-8";
@import "base.css";
@import "fonts.css";

/*==========================================================================*/
/*//////////////////////////////////////////////////////////////////////////*/
/*//////                                                              //////*/
/*//////  Copyright (C) 2009 株式会社フリーセル All Rights Reserved.  //////*/
/*//////                                                              //////*/
/*//////////////////////////////////////////////////////////////////////////*/
/*                                                                          */
/*    base.css   スタイルの初期設定を行うため、変更しないで下さい。      */
/*    fonts.css  フォントの初期設定を行うため、変更しないで下さい。      */
/*                                                                          */
/*==========================================================================*/

/*==========================================================================*/
/*                           Common-Setting                                 */
/* 
/* 汎用要素スタイル
/* ├ a
/* ├ table
/* ├ title
/* ├ p
/* └ div
/*  
/* 汎用classスタイル 
/* ├ image
/* ├ text,font
/* ├ gotop
/* └ banner
/*  
==========================================================================*/
/* 基本タグのフォントサイズを指定（12px -> 120% or 1.2em ） */
h1,h2,h3,h4,h5,h6,input,button,textarea,select,p,blockquote,table,pre,address,ul,ol,dl {
}
* html body {
	font: 62.5% "ＭＳ Ｐゴシック", Meiryo, arial, clean, verdana, Osaka, sans-serif;
}

/* 汎用要素スタイル
-------------------------------------------------------*/

/* ========================= a */
a {
	color: #066688;
}
a:hover,
a:active {
	color: #f96; text-decoration: none;
}

/* ========================= table */
#content table {
	width: 720px;
	background: #fff;
	border-spacing: 1px;
	border-collapse: separate;
}
#content th,
#content td {
	padding: 5px 10px;
	border: 1px #CCCCCC solid;
	color: #666666;
	text-align: left;
	vertical-align: middle;
}
#content th {
	background: #E8E8E8;
	font-weight: bold;
	text-align: center;
}
#content td {
	background: #fff;
}

/* ========================= title */
#content h3 {
	margin: 30px 0 15px;
	padding: 10px;
	background: url(../images/common/bg_ti.gif) no-repeat left top;
	color: #FFFFFF;
	font-weight: bold;
	font-size: 128%;
}
#content h4 {
	margin: 20px 0 10px;
	padding-left: 20px;
	background: url(../images/common/bg_sti.gif) no-repeat left top;
	color: #333333;
	font-size: 128%;
	font-weight: bold;
}
#content h3.firstChild,
#content h4.firstChild {
	margin-top: 0;
}
#content .cap {
	display: block;
	width: 230px;
	margin-top: 5px;
	font-size: 71.5%;
}

/* ========================= p */
#content p {
	margin: 0 0 1em;
}

/* ========================= div */
.section {
	margin: 0 10px;
}

/* 汎用classスタイル
-------------------------------------------------------*/

#content .last {
	margin-bottom: 0;
}

#content .fleft {
	float: left;
}

#content .fright {
	float: right;
}

/* ========================= clearfix */
.cf {
	zoom: 1;
}
.cf:after {
	content: '';
	display: block;
	clear: both;
}

/* ========================= image */
img {
	vertical-align: bottom;
}
#content .imgL {
	float: left;
	margin: 0 15px 0 0;
}
#content .imgLbtm {
	float: left;
	margin: 0 15px 15px 0;
}
#content .imgR {
	float: right;
	margin: 0 0 0 15px;
}
#content .imgRbtm {
	float: right;
	margin: 0 0 15px 15px;
}
#content .summaryImg {
	margin: 0 0 5em;
}


/* ========================= text,font */
.emphasis {
	color: #f00;
	font-weight: bold;
}
.orange {
	color: #FF6600;
}
.blue {
	color: #5060AB;
}

.bold {
	font-weight: bold;
}

#content p.defList,
#content .defList li,
#content .defList dt {
	padding-left: 15px;
	background: url(../images/common/icon.gif) no-repeat 0 8px;
}
#content .defList dd {
	padding-left: 15px;
}

#content p.attention,
#content .attention li,
#content .attention dt {
	padding-left: 15px;
	background: url(../images/common/icon_attention.gif) no-repeat 0 5px;
}
#content .attention dd {
	padding-left: 15px;
}


/* ========================= gotop */
p.gotop {
	clear: both;
	text-align: right;
	font-size: 0;
}


/* ========================= banner */
#content .contentBnr {
	clear: both;
	margin-top: 50px;
	text-align: center;
	zoom: 1;
}
.contentBnr:after {
	content: '';
	display: block;
	clear: both;
}
p.contentBnr {
	margin-bottom: 0;
}



/* ========================= dirBox */
#content dl.dirBox {
	padding-bottom: 15px;
}
#content dl.dirBox dd {
	margin: 20px 180px 0 20px;
}



/* ========================= margin */

.mt10 {
	margin-top: 10px;
}

.mt15 {
	margin-top: 15px;
}

.mt20 {
	margin-top: 20px;
}

.mt25 {
	margin-top: 25px;
}

.mt30 {
	margin-top: 30px;
}

.mb10 {
	margin-bottom: 10px;
}

.mb15 {
	margin-bottom: 15px;
}

.mb20 {
	margin-bottom: 20px;
}

.mb25 {
	margin-bottom: 25px;
}

.mb30 {
	margin-bottom: 30px;
}

/*==========================================================================*/
/*                            Container                                     */
/*==========================================================================*/

html {
	overflow-y: scroll;
	background: none;
}

body {
	color: #666666;
	text-align: center;
}
#wrapper {
	width: 970px;
	margin: 0 auto;
}
#main {
	width: 950px;
	_width: 970px;
	margin: 20px auto 0;
	padding: 0 10px;
	text-align: left;
}
#indexPage #main #contentOuter {
	width: 720px;
	margin: 0;
}


/*==========================================================================*/
/*                               Header                                     */
/*==========================================================================*/

#header {
	position: relative;
	width: 950px;
	height: 108px;
	margin: 0 auto;
	text-align: left;
}

/*  ========================= general */
#header h1,
#header #logo,
#header #guideNav,
#header #globalNav,
#header #headInfo {
	position: absolute;
}

/*  ========================= h1 */
#header h1 {
	top: 8px;
	left: px;
	font-size: 120%;
	line-height: 1.7;
}

/*  ========================= logo */
#header #logo {
	top: 35px;
	left: 0;
}

/*  ========================= guideNavi */
#header ul#guideNav {
	top: 6px;
	right: 0;
}

/*  ========================= globalNavi */
#header ul#globalNav {
	top: 0;
	left: 0;
	width: 900px;
	height: 45px;
}
#header ul#globalNav li {
	float: left;
}

/*  ========================= headInfo */
#header p#headInfo {
	top: 36px;
	right: 0;
}


/*==========================================================================*/
/*                              Footer                                      */
/*==========================================================================*/

#footer {
	width: 100%;
	margin-top: 7px;
	padding-bottom: 10px;
	background: url(../images/common/footer_bg_top.gif) repeat-x left top #FF6600;
	color: #FFFFFF;
}
#footer #footerInner {
	width: 950px;
	margin: 0 auto;
	padding-top: 10px;
	background: url(../images/common/footer_bg_top.gif) repeat-x left top #FF6600;
}
#footer dl {
	text-align: left;
}
#footer dl dt {
	font-size: 140%;
	font-weight: bold;
}
#footer dl dd {
	font-size: 120%;
}
#footer #copyright {	
	font-size: 100%;
	text-align: right;
}


/*==========================================================================*/
/*                            Navigation                                    */
/*==========================================================================*/

#localNav {
	float: left;
	width: 220px;
	margin-bottom: 20px;
	background: url(../images/common/side_bg.gif) repeat-y left top;
}
#theaternav {
	float: right;
	width: 220px;
	margin-bottom: 20px;
	background: url(../images/common/side_bg.gif) repeat-y left top;
}
#localNav p {
	padding-bottom: 5px;
	background: #FFFFFF;
}
#localNav .caseNav,
#theaternav .caseNav {
	width: 220px;
	padding-top: 5px;
	background: url(../images/common/side_bg_case_nav.gif) no-repeat left top;
}
#localNav .caseNav li,
#theaternav .caseNav li {
	width: 190px;
	_width: 210px;
	height: 100px;
	_height: 120px;
	margin: 0 5px 5px;
	padding: 10px;
	background: url(../images/common/side_bg_case_list.gif) no-repeat left top;
}
#localNav .local,
#theaternav .local {
	margin: 0 5px 5px;
}
#localNav .about,
#theaternav .about {
	width: 220px;
	text-align: center;
}
#localNav .about li,
#theaternav .about li {
	margin-top: 0;
}
#localNav .about li.firstChild,
#localNav .about li.bgChild,
#theaternav .about li.firstChild {
	margin-top: 10px;
	margin-bottom: 5px;
	padding: 10px 0;
	background: url(../images/common/side_bg_case_list.gif) no-repeat center bottom;
}
#localNav .about li.bgChild {
	margin-top: 5px;
}
#localNav .about li.last,
#theaternav .about li.last {
	padding-bottom: 5px;
	background: url(../images/common/side_bg_about_last.gif) no-repeat left bottom;
}
#localNav .about li.firstChild,
#theaternav .about li.firstChild {
	margin-top: 0;
}

/*  ========================= caseNav */
#localNav .caseNav,
#theaternav .caseNav {
}

/*  ========================= local */
#localNav .local,
#theaternav .local {
}

/*  ========================= about */
#localNav .about,
#theaternav .about {
	padding-top: 0;
}
#blogNav {
	padding-top: 20px;
	background-color: #fff;
}

/*==========================================================================*/
/*                             Contents                                     */
/*==========================================================================*/
#content {
	float: right;
	width: 720px;
	margin-bottom: 20px;
	font-size: 140%;
	text-align: left;
	line-height: 1.7;
}


/* 01 index
------------------------------------------------------------------------*/
#indexPage #header {
	height: 610px;
}
#indexPage #photos {
	position: absolute;
	top: 110px;
	left: 0;
}
#indexPage #pointer {
	background: url(../themes/light/pointframe.gif) no-repeat top left;
}
#indexPage #photos .strip_wrapper {
	width: 764px;
}
#indexPage #photos .filmstrip {
	width: 950px;
}
#indexPage #photos .filmstrip li {
	float: left;
	width: 113px;
	height: 120px;
}
#indexPage #theaternav {
	float: right;
}
#indexPage #contentOuter {
	float: left;
	width: 720px;
}
#indexPage #content {
	float: right;
	width: 490px;
}
#indexPage #content h3 {
	background: url(../images/index_bg_ti.gif) no-repeat left top;
}
#indexPage #content #newsBox {
	overflow: auto;
	height: 200px;
	padding: 10px 0 0 0;
}


#indexPage #content #newsBox table{
	padding: 0;
	margin: 0;
	border: none;
}

#indexPage #content #newsBox table th,
#indexPage #content #newsBox table td{
	padding: 0 0 10px 0;
	margin: 0;
	border: none;
	vertical-align: top;
}


#indexPage #content #newsBox table{ width: 460px;}

#indexPage #content #newsBox table td.tn_date{ padding-right: 10px;}



/*
#indexPage #content #newsBox dl.news {
	width: 460px;
	margin: 5px 10px 0;
	background: url(../images/index_bg_news.gif) no-repeat left bottom;
}
#indexPage #content #newsBox dl.news dt {
	float: left;
	width: 6em;
	_width: 7em;
	margin-right: 1em;
	padding-left: 1em;
	background: url(../images/common/icon.gif) no-repeat left 8px;
}
#indexPage #content #newsBox dl.news dd {
	float: left;
}
#indexPage #content #newsBox dl.news dd p.ind {
	text-indent: 70px;
}
*/


#indexPage #content .pickup {
	width: 240px;
	padding-bottom: 10px;
	background: url(../images/index_bg_pick.gif) no-repeat left bottom;
}
#indexPage #content .pickup dd {
	margin: 0 10px 10px;
}
#indexPage #content .pickup dd.last {
	margin-bottom: 0;
}

/* 02 car/
------------------------------------------------------------------------*/


/* 03 car/dealer
------------------------------------------------------------------------*/
#dealerPage .dirBox {
	background: url(../images/dealerbg_dir.gif) no-repeat left bottom;
}

.section ul li.kajou {
	background: url(../images/arrow.gif) no-repeat 0 2px;
	color: green;
	font-weight: bold;
	text-indent: 20px;
}

.section dl dd {
	font-weight: bold;
}

.section dl dt {
	text-indent: 15px;
}


/* 04 case_car/
------------------------------------------------------------------------*/
/* 10 case_theater/
------------------------------------------------------------------------*/
#case_carPage h3 {
	margin-bottom: 0;
}#case_carPage .caseBox {
	margin-top: 10px;
}
#case_carPage .caseBox .img {
	float: left;
	width: 460px;
	height: 300px;
	border-top: 1px #CCCCCC solid;
	border-bottom: 1px #CCCCCC solid;
	background: url(../images/case_bg_photo_zoom.gif) repeat-y left top;
}
#case_carPage .caseBox .img img {
	width: 458px;
	height: 300px;
	margin: 0 1px;
}
#case_carPage .caseBox .detailTable {
	float: right;
	width: 250px;
}
#case_carPage .caseBox .detailTable table {
	width: 250px;
	margin-bottom: 10px;
}


/* 05 case_car/detail
------------------------------------------------------------------------*/
/* 11 case_theater/detail
------------------------------------------------------------------------*/
#case_detailPage #main {
	width: 960px;
	margin-left: 10px;
	padding: 0;
}
*html #case_detailPage #main {
	padding: 0;
}
#case_detailPage #main #content {
	width: 730px;
}
#case_detailPage #photoDetail {
	overflow: hidden;
	width: 730px;
	zoom: 1;
}
#case_detailPage #photoDetail:after {
	content: '';
	display: block;
	clear: both;
}
#case_detailPage #photoDetail li.photoList {
	float: left;
	width: 355px;
	margin-right: 9px;
	margin-top: 10px;
	/*background: url(../images/case_bg_photo_list.gif) repeat-y left top;
	border-top: 1px #CCCCCC solid;
	border-bottom: 1px #CCCCCC solid;*/	
}
#case_detailPage #photoDetail li.photoListoff {
	display: none;
	width: 0;
	height: 0;
}
#case_detailPage #photoDetail li.photoList img {
	display: inline;/*test*/
	width: 353px;
	_width: 355px;
	height: 229px;
	margin: 0 1px;
	margin: 0;/*test*/
	border: 1px #CCCCCC solid;/*test*/
}
#case_detailPage h3 {
	margin-bottom: 0;
}
#case_detailPage table {
	width: 720px;
	margin-top: 10px;
}
#case_detailPage table th {
	width: 20%;
}
/* 06 car/feature
------------------------------------------------------------------------*/



/* 07 car/faq
------------------------------------------------------------------------*/
#faqPage #content dl.faqBox {
	margin: 0 0 20px 10px;
	background: url(../images/car_faq_bg_faq.gif) no-repeat left 3px;
}
#faqPage #content dl.faqBox dt {
	width: 672px;
	_width: 702px;
	padding: 0 0 22px 30px;
	background: url(../images/car_faq_bg_question.gif) no-repeat left bottom;
	color: #333333;
	font-weight: bold;
}
#faqPage #content dl.faqBox dt span.hide {
	display: none;
	width: 0;
	height: 0;
}
#faqPage #content dl.faqBox dd {
	width: 582px;
	_width: 702px;
	padding: 5px 100px 30px 20px;
	background: url(../images/car_faq_bg_answer.gif) no-repeat left bottom;
}
#faqPage #content dl.faqBox dd .cap {
	width: 150px;
}


/* 08 theater/
------------------------------------------------------------------------*/
#theaterPage .cap {
	width: 216px;
}
#theaterPage .flowList {
	margin-bottom: 10px;
	background: url(../images/theater_line.gif) no-repeat bottom right;
	zoom: 1;
}
#theaterPage .flowList:after {
	content: '';
	display: block;
	clear: both;
}
#theaterPage .flowList dt {
	float: left;
}
#theaterPage .flowList dd {
	float: right;
	padding: 10px;
	width: 467px;
}
* html #theaterPage .flowList dd {
	width: 487px;
}

/* 09 theater/contractor
------------------------------------------------------------------------*/
#contractorPage .cap {
	width: 188px;
}


/* 12 theater/feature
------------------------------------------------------------------------*/
#t_featurePage .cap {
	width: 250px;
}
#t_featurePage .dirBox {
	background: url(../images/t_feature_bg_dir.gif) no-repeat left bottom;
}


/* 13 theater/faq
------------------------------------------------------------------------*/


/* 14 about/
------------------------------------------------------------------------*/


/* 15 about/philosophy
------------------------------------------------------------------------*/
#philosophyPage .bg {
	padding-top: 30px;
	background: url(../images/philosophy_bg_section.jpg) no-repeat right top;
}

/* 16 about/message
------------------------------------------------------------------------*/


/* 17 about/staff
------------------------------------------------------------------------*/
#staffPage .staff {
	margin-bottom: 15px;
}
#staffPage .staff dt {
	color: #333333;
	font-weight: bold;
}


/* 18 about/company
------------------------------------------------------------------------*/
#companyPage #map {
	float: left;
	width: 350px;
}
#companyPage #companyAccess {
	float: right;
	width: 340px;
}
#companyPage #companyAccess p {
	margin-bottom: 0;
	font-size: 85.5%;
}
#companyPage .gmnoprint {
	color: #333333;
	font-size: 90%;
}
#companyPage ul.photoCompany {
	margin: 25px 10px 0;
}
#companyPage .photoCompany li {
	float: left;
	margin-right: 10px;
}
#companyPage .photoCompany li.fright {
	margin-right: 0;
}


/* 19 contact
------------------------------------------------------------------------*/


/* 20 sitemap

------------------------------------------------------------------------*/
#sitemapPage .defList {
	margin-bottom: 15px;
}
#sitemapPage .defList dt {
	font-weight: bold;
}

/* contact
------------------------------------------------------------------------*/

/*  ========================= table style */
#contactPage #content table.mailform {
	width: 700px;
	margin-top: 10px;
	padding: 0;
	border-collapse: collapse;
}
#contactPage #content table.mailform tr th,
#contactPage #content table.mailform tr td {
	padding: 5px 10px;
	border: solid 1px #ccc;
	text-align: left;
	vertical-align: middle;
}
#contactPage #content table.mailform tr th {
	width: 180px;
	background: #E8E8E8;
}

/*  ========================= input style */
#contactPage #content table.mailform input {
	margin-right: 3px;
	vertical-align: middle;
}
#contactPage #content table.mailform select {
	margin-right: 3px;
}
#contactPage #content table.mailform textarea {
	width: 350px;
}

/*  ========================= label style */
#contactPage #content table.mailform label.fmail_label_enabled {
	text-indent: 5px;
	margin: 0;
	padding: 0;
	border: none;
	background-color: none;
	font-weight: bold;
}
#contactPage #content table.mailform label.fmail_label_disabled {
	text-indent: 5px;
	margin: 0;
	padding: 0;
	border: none;
}


/*  ========================= list style */
#contactPage ol.fmail_radio_list li,
#contactPage ol.fmail_checkbox_list li {
	list-style: none;
	float: left;
	padding: 5px 10px 5px 0;
	white-space: nowrap;
}

/*  ========================= button style */
#contactPage #content .button {
	margin-top: 20px;
	text-align: center;
}
#contactPage #content .button input {
	width: 160px;
	padding: 5px;
	border: 1px #CCCCCC solid;
	background: #666666;
	color: #fff;
	font-weight: bold;
}
#contactPage #content .site_top {
	text-align: center;
}
#contactPage #content .site_top a{
	display:block;
	width:160px;
	height: auto;
	margin: 1em auto;
	padding: 10px 0;
	border: 1px #CCCCCC solid;
	background-image: none;
	background: #666666;
	color: #fff;
	font-weight: bold;
	text-indent: 0;
	text-align: center;
	text-decoration: none;
}
#contactPage #content .button input:hover,
#contactPage #content .site_top a:hover{
	background: #FF6600;
}


/*  ========================= text style */
#contactPage #content th em {
	margin-left: 3px;
	color: #c00;
	font-size: 83.5%;
}
#contactPage #content td .info {
	color: #999;
	font-size: 83.5%;
}
#contactPage #content span.fmail_error {
	padding: 2px 0 3px 17px;
	background-position: left center;
}
#contactPage #content th.fmail_error,td.fmail_error,.fmail_error {
	background-color: none;
}