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

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

/*==========================================================================*/
/*                           Common-Setting                                 */
/*==========================================================================*/

/* 基本タグのフォントサイズを指定（12px -> 120% or 1.2em ） */
h1,h2,h3,h4,h5,h6,input,button,textarea,p,blockquote,table,pre,address,ul,ol,dl{font-size: 135%}

h3{
background:url(../img/sec_h3bg.jpg) no-repeat 0 0;
font-size:170%;
font-weight:bold;
margin:0 0 20px}

h3.note{margin:0}

h3 span{
background:url(../img/sec_h3bg2.jpg) no-repeat 0 100%;
color:#fff;
display:block;
padding:10px 10px 12px}

h4{
background:url(../img/sec_h4bg.jpg) no-repeat;
color:#F9FFF9;
font-size:150%;
font-weight:bold;
margin:0 0 20px;
padding:8px 10px 8px 15px}

h4.note{
background:none;
border:none;
padding:0}

h5{
background:url(../img/sec_h5bg.jpg) no-repeat;
color:#555;
font-size:140%;
font-weight:bold;
margin:0 0 20px;
padding:2px 0 2px 10px}

a{color:#333;text-decoration:underline}
a:hover,
a:active{text-decoration:none}

ul{margin:0 0 20px}

li{
background:url(../img/icon02.gif) no-repeat 0 2px;
padding:0 0 0 10px}

.left_50{ margin-left: 50px;}

dl{margin:0 0 20px}
dt{font-weight:bold}
dd{}

#content table{
border:2px solid #ccc;
border-top:5px solid #6294CA;
margin:0 0 20px;
width:100%}

#content th{
background:#F4FBFD;
border-bottom:1px solid #ccc;
color:#333;
font-weight:bold;
padding:8px 5px;
white-space:nowrap;
width:1%}

#content .mailform th{
font-weight:bold;
white-space:normal;
width:150px}

#content td{
border-bottom:1px solid #ccc;
border-left:1px solid #ccc;
padding:8px 5px}

table.note td{vertical-align:top}

.mailform td ul li,
.mailform td ol li{
background:none}

td ul{margin:0}

table.col{border:2px solid #ccc}

table.col th.top{
background:#6294CA;
border-left:1px solid #ccc;
color:#fff}

div.fig,
div.banner{
margin:0 0 20px;
text-align:center}

iframe,
div.lead{margin:0 0 20px}

p,
div.adr{margin:0 0 20px}

img{vertical-align:bottom}

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

body {
background:url(../img/com_bodyBg.jpg) repeat-x 50% 0;
color: #666;
text-align: center}

#wrapper{
background:#fff;
margin:0 auto;
padding:0 20px;
width:900px;
_width:940px}

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

#main{
display:inline-block;
margin:0 auto;
text-align:left}

#index #main{background:url(../img/ind_mainBg.jpg) repeat-y 600px 0}

/*\*/
*html #main{height:1%}
#main{display:block}
/**/

.pageTop{
margin:0 0 20px;
clear:both;
text-align:right}

.pageTop a{
background:url(../img/pageTop.jpg) no-repeat 0 5px;
font-size:105%;
padding:0 0 0 15px}

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

#header{
background:url(../img/com_headBg.jpg) no-repeat 0 100%;
height:189px;
margin:0 0 20px;
position:relative}

#index #header{
background:none;
border-bottom:1px solid #e7e7e7;
height:500px}

#header h1{
font-size:90%;
text-align:left;
position:absolute;
top:2px;
left:0}

#header #headLogo{
position:absolute;
top:17px;
left:0}

#header dl#search:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#header dl#search{
display:inline-block;
position:absolute;
top:10px;
right:0}

/*\*/
*html #header dl#search{height:1%}
#header dl#search{display:block}
/**/

#header dl#search dt{float:left}

#header dl#search dt input{
background:#C9C9C2;
border:none;
width:230px}

#header dl#search dd{
float:left;
margin:0 0 0 5px}

#header ul#headLink:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#header ul#headLink{
display:inline-block;
position:absolute;
top:50px;
right:0}

/*\*/
*html #header ul#headLink{height:1%}
#header ul#headLink{display:block}
/**/

#header ul#headLink li{
background:none;
float:left;
margin:0 0 0 10px;
padding:0}

#header h2 {
color:#fff;
font-size:200%;
font-weight:bold;
left:20px;
position:absolute;
text-align:left;
top:130px}

#index #header h2{
top:89px;
left:0}

#header #line{
position:absolute;
top:399px;
left:0}

#header .link{
position:absolute;
top:328px;
left:5px}

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

#footer{background:url(../img/com_footBg.jpg) repeat-x 50% 0 #f6f6f6}

#footer .footerCont{
background:url(../img/com_footBg.jpg) repeat-x 50% 0 #f6f6f6;
margin:0 auto;
padding:3px 0;
text-align:center;
width:900px}

#footer .footerCont div{margin:0 0 20px}

#footer .footerCont .footLink{
margin:0 0 50px;
text-align:right}

#footer .footerCont address{font-size:110%}

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

#navi{
float:left;
width:200px}

#index #navi{
float:right;
width:280px}

#navi ul{
background:#f3f3f3;
padding:15px 0 1px 5px}

#navi dl{
background:#f3f3f3;
padding:0 0 1px}

#navi ul li,
#navi dl dd{
background:url(../img/icon01.gif) no-repeat 0 4px;
margin:0 0 15px}

#navi dl dt{margin:0 0 15px}

#navi dl dd{
margin:0 0 15px 5px;
padding:0 0 0 10px}

#navi ul li.link{margin:0}

#navi ul li ul{margin:0}

#navi ul li a,
#navi dl dd a{
color:#666;
font-size:95%}

#navi .sideCap{margin:0 0 15px}

#navi dl.pickUp:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#navi dl.pickUp{
background:none;
display:inline-block;
padding:0}

/*\*/
*html #navi dl.pickUp{height:1%}
#navi dl.pickUp{display:block}
/**/

#navi dl.pickUp dt{
background:#ccc;
float:left;
margin:0;
padding:3px;
width:114px;
_width:120px}

#navi dl.pickUp dt a{
background:#fff;
display:block;
padding:2px}

#navi dl.pickUp dd{
background:none;
float:left;
font-size:90%;
margin:0 0 0 10px;
padding:0;
width:150px}

#navi dl.news{
background:none;
height:180px;
overflow-y:scroll;
padding:0}

#navi dl.news dt{
color:#26A8D4;
font-size:90%;
margin:0}

#navi dl.news dd{
background:none;
margin:0 0 20px;
padding:0}

#navi dl.news dd a{
color:#666}

#navi ul.banner{
background:none;
margin:0;
padding:0}

#navi ul.banner li{
background:none;
margin:0 0 10px;
padding:0}

#navi ul.banner li ul:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#navi ul.banner li ul{
background:none;
display:inline-block;
margin:0 0 10px;
padding:0}

/*\*/
*html #navi ul.banner li ul{height:1%}
#navi ul.banner li ul{display:block}
/**/

#navi ul.banner li ul li{
float:left;
margin:0 0 0 10px}

#navi ul.banner li ul li.firstChild{margin:0}

/*==========================================================================*/
/*                             Contents                                     */
/*==========================================================================*/

#content{
float:right;
margin:0 0 0 20px;
width:680px}

#index #content{
float:left;
margin:0 40px 0 0;
width:580px}

#main .topicPath{
margin:0 0 10px}

#main .topicPath li{
background:url(../img/nav.gif) no-repeat 0 4px;
display:inline;
font-size:85%;
margin:0 0 0 4px;
padding:0 0 0 10px}

#main .topicPath li.firstChild{
background:none;
margin:0;
padding:0}

#content .btn{text-align:center}

/* sec
------------------------------------------------------------------------*/

#content .bg01,
#content .bg03{
background:url(../img/sec_pict01.jpg) no-repeat 100% 0;
margin:0 0 20px;
min-height:175px;
_height:175px}

#content .bg01 p,
#content .bg03 p{padding:0 260px 0 0}

#content .bg03{
background:url(../img/sec_pict03.jpg) no-repeat 100% 20px;
border-top:1px solid #e7e7e7;
_height:195px;
padding:20px 0 0 0}

#content .bg02{
background:url(../img/sec_pict02.jpg) no-repeat 0 20px;
border-top:1px solid #e7e7e7;
margin:0 0 20px;
min-height:175px;
_height:195px;
padding:20px 0 0}

#content .bg02 p{padding:0 0 0 260px}

#content .bg04,
#content .bg05,
#content .bg06,
#content .bg07,
#content .bg08{
background:url(../img/sec_pict04.jpg) no-repeat 100% 0;
margin:0 0 20px;
min-height:190px;
_height:190px;
padding:0 260px 0 0}

#content .bg05{background:url(../img/sec_pict05.jpg) no-repeat 100% 0}
#content .bg06{background:url(../img/sec_pict06.jpg) no-repeat 100% 0}
#content .bg07{background:url(../img/sec_pict07.jpg) no-repeat 100% 0}
#content .bg08{background:url(../img/sec_pict08.jpg) no-repeat 100% 0}

#content .bg02 h4{text-align:right}

#content .bg01 p,
#content .bg02 p,
#content .bg03 p,
#content .bg04 p,
#content .bg05 p,
#content .bg06 p,
#content .bg07 p,
#content .bg08 p{margin:0}

#content ul.banner:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#content ul.banner{display:inline-block;}

/*\*/
*html #content ul.banner{height:1%}
#content ul.banner{display:block}
/**/

#content ul.banner li{
background:none;
float:left;
padding:0}

#content ul.banner li.firstChild{margin:0 20px 0 0}

/* best5
************************/

#content dl.rankAnchor:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#content dl.rankAnchor{display:inline-block;}

/*\*/
*html #content dl.rankAnchor{height:1%}
#content dl.rankAnchor{display:block}
/**/

#content dl.rankAnchor dt{margin:0 0 10px}

#content dl.rankAnchor dd{
float:left;
margin:0 0 0 10px}

#content dl.rankAnchor dd.firstChild{margin:0}

#content .rank{
background:url(../img/sec_rank01bg.jpg) no-repeat 0 100%;
margin:0 0 20px;
padding:0 30px 30px}

#content #rank01{background:url(../img/sec_rank01bg.jpg) no-repeat 0 100%}
#content #rank02{background:url(../img/sec_rank02bg.jpg) no-repeat 0 100%}
#content #rank03{background:url(../img/sec_rank03bg.jpg) no-repeat 0 100%}
#content #rank04{background:url(../img/sec_rank04bg.jpg) no-repeat 0 100%}
#content #rank05{background:url(../img/sec_rank05bg.jpg) no-repeat 0 100%}

#content .rank h4{
background:none;
margin:0 -30px 15px;
padding:0}

#content .rank p.lastChild{margin:0}

/* 各店舗のスタッフが力強くサポート
************************/

#content dl.map:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#content dl.map{
background:url(../img/sec_shopBg.jpg) repeat-y 290px 0;
border:1px dotted #999;
display:inline-block;}

/*\*/
*html #content dl.map{height:1%}
#content dl.map{display:block}
/**/

#content dl.map dt{
float:left;
padding:20px 0;
text-align:center;
width:290px}

#content dl.map dd{
background:url(../img/sec_shopBg2.jpg) repeat;
float:right;
margin:10px;
_margin:10px 5px;
min-height:250px;
_height:270px;
padding:10px;
width:345px;
_width:365px}

/* step
************************/

#content table td dl{margin:0}

#content .step .sectionH4{
background:url(../img/sec_stepBg.jpg) no-repeat 50% 100%;
margin:0 0 20px;
padding:0 0 40px;
_padding:0 0 60px}

#content .step .sectionH4.lastChild{
background:none;
margin:0;
padding:0}

#content .step .sectionH4 h4{
background:none;
border:none;
margin:0;
padding:0}

/* faq
************************/

#content dl.faq dt{
background:url(../img/sec_faq01.jpg) no-repeat 0 0;
margin:0 0 20px;
padding:22px 10px 12px 70px}

#content dl.faq dd{
background:url(../img/sec_faq02.jpg) no-repeat 0 0;
margin:0 0 20px;
padding:0 0 0 70px}

#content dl.faq dd p,
#content dl.faq dd ul{margin:0 0 10px}

#content dl.faq dd p.lastChild{margin:0}

/* 会社概要
************************/

#content table.company ul li{
background:url(../img/icon03.gif) no-repeat 0 5px;
padding:0 0 0 15px}

#content table.company ul.note{margin:0 0 20px}

#content table.company p{margin:0}

/* infoAll
************************/

#content ul.infoAll:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#content ul.infoAll{
background:url(../img/sec_infoAllBg.jpg) no-repeat 0 100%;
border-bottom:1px solid #ccc;
display:inline-block;
padding:0 0 1px}

#content ul.infoAll.v3{background:url(../img/sec_infoAllBg2.jpg) no-repeat 0 100%}

/*\*/
*html #content ul.infoAll{height:1%}
#content ul.infoAll{display:block}
/**/

#content ul.infoAll li{
background:none;
float:left;
margin:0 0 0 40px;
padding:0;
width:193px}

#content ul.infoAll li.firstChild{margin:0}

#content ul.infoAll li h4{font-size:110%}

#content ul.infoAll li div{
margin:0 0 5px;
text-align:center}

#content ul.infoAll li div a{
border:2px solid #fff;
display:block}

#content ul.infoAll li div a:hover{border:2px solid #7EA8D8}

#content ul.infoAll li ul{margin:0}

#content ul.infoAll li ul li{
margin:0 0 0 5px;
width:33px}

#content ul.infoAll li ul li.firstChild{margin:0 0 10px}

#content ul.infoAll li dl:after,
#content .infoDetail ul.infoDetailText li dl:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#content ul.infoAll li dl,
#content .infoDetail ul.infoDetailText li dl{
clear:both;
display:inline-block;
margin:0 0 10px}

/*\*/
*html #content ul.infoAll li dl,
*html #content .infoDetail ul.infoDetailText li dl{height:1%}
#content ul.infoAll li dl,
#content .infoDetail ul.infoDetailText li dll{display:block}
/**/

#content ul.infoAll li dl dt,
#content .infoDetail ul.infoDetailText li dl dt{
float:left;
margin:0 5px 0 0;
width:66px}

#content ul.infoAll li dl dd,
#content .infoDetail ul.infoDetailText li dl dd{
float:left;
width:120px}

#content .infoDetail ul.infoDetailText li dl dd{width:239px}

#content dl.star:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#content dl.star{
border-bottom:1px solid #ccc;
display:inline-block;
padding:0 0 10px}

/*\*/
*html #content dl.star{height:1%}
#content dl.star{display:block}
/**/

#content dl.star dt,
#content ul.infoAll li dl.star dt{
float:left;
margin:0;
width:54px}

#content dl.star dd,
#content ul.infoAll li dl.star dd{
float:left;
margin:0 0 0 7px;
_margin:0 0 0 4px;
width:20px}


/* infoDetail
************************/

#content ul.infoIcon.detail:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#content ul.infoIcon.detail{
border-bottom:1px solid #ccc;
display:inline-block;
padding:0 0 10px}

/*\*/
*html #content ul.infoIcon.detail{height:1%}
#content ul.infoIcon.detail{display:block}
/**/

#content ul.infoIcon.detail li{
background:none;
float:left;
margin:0 0 0 5px;
padding:0}

#content ul.infoIcon.detail li.firstChild{margin:0}

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

#content .infoDetail{display:inline-block;}

/*\*/
*html #content .infoDetail{height:1%}
#content .infoDetail{display:block}
/**/

#content .infoDetail ul.infoDetailPict{
float:left;
margin:0 20px 0 0;
width:350px}

#content .infoDetail ul.infoDetailPict li{
background:none;
margin:0 0 20px;
padding:0}

#content .infoDetail .infoDetailText{
float:right;
margin:0;
width:310px}

#content .infoDetail ul.infoDetailText li,
#content .infoDetail .infoDetailText p{
background:none;
border-bottom:1px solid #ccc;
margin:0 0 20px;
padding:0 0 20px}

#content .infoDetail ul.infoDetailText li.note{padding:0 0 5px}

/* サイトマップ
************************/

#content ul.sitemap li{
background:url(../img/icon02.gif) no-repeat 0 4px;
margin:0 0 5px;
padding:0 0 0 15px}

#content ul.sitemap li.note{
background:none}

#content ul.sitemap li.nolink{
color:#000}

#content ul.sitemap li ul{
height:1%;
margin:0}

#content ul.sitemap li ul li{
background:url(../img/icon03.gif) no-repeat 0 5px}


/* index
------------------------------------------------------------------------*/

#index #content h3,
#index #content h3 span,
#index #content h4,
#index #content h4 span,
#index #content p.top01,
#index .h303 h3,
#index .h303 h3 span{

background:none;
border:none;
padding:0}

#index #content ul.mainBanner:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#index #content ul.mainBanner{display:inline-block;}

/*\*/
*html #index #content ul.mainBanner{height:1%}
#index #content ul.mainBanner{display:block}
/**/

#index #content ul.mainBanner li{
float:left;
margin:0 0 0 20px;
padding:0}

#index #content ul.mainBanner li.firstChild{margin:0}

#index #content .h301:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#index #content .h301{display:inline-block;}

/*\*/
*html #index #content .h301{height:1%}
#index #content .h301{display:block}
/**/

#index #content .h301 ul{
float:left;
margin:0;
width:210px}

#index #content .h301 ul li{
background:none;
margin:0 0 20px;
padding:0}

#index #content .h301 .sectionH4{
border:1px dotted #999;
float:left;
margin:0 0 15px 18px;
padding:10px;
width:330px;
_width:350px}

#index #content .h301 .sectionH4 p.top02{margin:0 0 10px}

#index #content .h301 .sectionH4 dl{margin:0}

#index #content .h301 .sectionH4 dl dt{margin:0 0 4px}

#index #content .h301 .sectionH4 dl dd{
font-size:90%;
margin:0 0 9px}

#index #content .h301 .sectionH4 div{text-align:right}

#index .h303{
background:#fff;
clear:both;
margin:0;
padding:20px 0}

#index .h303 ul:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}

#index .h303 ul{
background:url(../img/ind_shopBg.jpg) no-repeat 0 100%;
display:inline-block;
margin:0}

/*\*/
*html #index .h303 ul{height:1%}
#index .h303 ul{display:block}
/**/

#index .h303 ul li{
background:none;
border-top:1px dotted #999;
float:left;
margin:0 0 0 10px;
padding:0;
width:172px}

#index .h303 ul li.firstChild{margin:0}

#index .h303 ul li dl{
margin:0;
padding:10px;}

#index .h303 ul li dl dt{margin:0 0 10px}

#index .h303 ul li dl dd{font-size:80%}

#content .content h4{
background:url(../img/sec_h4bg.jpg) no-repeat!important;
color:#F9FFF9!important;
font-size:150%!important;
font-weight:bold!important;
margin:0 0 20px!important;
padding:8px 10px 8px 15px!important}

#content .content .date-footer{
margin:0 0 20px;
text-align:right}

#content dl.mapLink{
height:333px;
position:relative;
text-align:center}

#content dl.mapLink dd.dd01{
position:absolute;
top:190px;
left:365px}

#content dl.mapLink dd.dd02{
position:absolute;
top:145px;
left:365px}

#content dl.mapLink dd.dd02{
position:absolute;
top:80px;
left:150px}

#content dl.mapLink dd.dd03{
position:absolute;
top:215px;
left:140px}

#content dl.mapLink dd.dd04{
position:absolute;
top:10px;
left:365px}

#content dl.mapLink dd.dd05{
position:absolute;
top:100px;
left:365px}