@charset "UTF-8";
/* ============================================================

 * cafebar-raku.com
 * layout.css
 *
 * copyright : RAKU
 * author    : creative iD
 
============================================================ */

/*
 * layout
 */
body > #container { height: 100%; }
body { background: #fdfbf5 url(../img/bg_main.gif) top center; }
#container { background: url(../img/bg_bar.gif) repeat-x; }
#container #container-inner { position: relative; width: 850px; margin: 0 auto; padding-top: 30px; }
h1 a { position: absolute; left: 0px; width: 277px; height: 51px; margin: 0; background: url(../img/img_logo.gif) no-repeat; }
#topflash { text-align: center; width: 850px; margin: 10px auto; }
h1 a:hover,
h1 a:active { background: url(../img/img_logo.gif) no-repeat; }
#header { min-height: 80px; }
#gnavi { position: absolute; right: 0px; }
#gnavi ul li { float: left; margin-left: 7px; }
#pagetitle { position: relative; clear: both; margin: 0 0 20px -15px; }
#content { float: left; width: 630px; display: inline; }
#content-inner { width: 610px; padding-bottom: 75px; }
#content-inner-2 { width: 820px; padding-bottom: 75px; }
#side { float: right; width: 220px; padding-bottom: 35px; display: inline; }
#side-inner { }
#side #side-event-top { width: 220px; height: 74px; background: url(../img/img_side_event_top.gif) no-repeat; }
#side #side-event { padding-bottom: 38px; background: url(../img/bg_side_event.gif) no-repeat bottom left; }
#side #side-event #side-event-inner { width: 166px; margin-left: 23px; background-color: #fff; }
#side .event-topic { width: 150px; padding-bottom: 8px; margin: 0 0 8px 8px; border-bottom: solid #999999 1px; }
#side .event-topic .event-thumb { float: left; width: 50px; margin-right: 6px; display: inline; }
#side .event-topic dl { float: right; width: 93px; display: inline; }
#side .event-topic dl dt { font-size: 93%; line-height: 1.4; font-weight: bold; }
#side .event-topic dl dd { font-size: 85%; line-height: 1.4; }
#side .event-topic a { color: #333; display: block; }
#side .event-topic a:hover { color: #ff4d00; }
#side #recom { margin-left: 13px; margin-bottom: 13px; padding-bottom: 13px; background: url(../img/bg_side_recom.gif) no-repeat bottom left; }
#side #recom-inner { width: 155px; margin-left: 17px; }
#side #recom .recom-bnr { margin-bottom: 3px; }
#side #link { margin-left: 13px; margin-bottom: 13px; padding-bottom: 9px; background: url(../img/bg_side_link.gif) no-repeat bottom left; }
#side #link-inner { width: 170px; margin-left: 10px; }
#side #link dl { padding-bottom: 8px; margin-bottom: 8px; border-bottom: solid #999999 1px; }
#side #link dl dt { font-size: 93%; line-height: 1.4; font-weight: bold; margin-bottom: 3px; padding-left: 14px; background: url(../img/icon_arrow02.gif) no-repeat 0 3px; }
#side #link dl dd { font-size: 85%; line-height: 1.4; padding-left: 14px; }
#side #thanks { text-align: center; margin-top: 25px; }
.visual { margin: 15px 0 4px 0; } 
.pagetop { text-align: right; margin: 35px 0 10px 0; }
.pagetop a { font-size: 85%; line-height: 1.4; padding-left: 22px; display: inline-block; background: url(../img/ico_pagetop.gif) no-repeat center left; }
#footer { clear: both; width: 100%; padding-bottom: 25px; background: #000 url(../img/bg_footer.gif) repeat-x top left; }
#footer #footer-inner { width: 850px; min-height: 75px; margin: auto; }
#footer #copyright { color: #999; text-align: right; margin-top: 3px; }




/*
 * element
 */
.bg-line-1 { width: 610px; height: 2px; margin: 15px 0 25px 0; background: url(../img/bg_line01.gif) no-repeat; }
.bg-line-2 { width: 820px; height: 2px; margin: 3px 0 25px 0; background: url(../img/bg_line02.gif) no-repeat; }
.ttl-1  { font-size: 108%; font-weight: bold; line-height: 2.8; color: #fff; height: 38px; margin-bottom: 0; padding: 0 25px; background: url(../img/bg_title01.png) no-repeat top left; }
.ttl-2  { font-size: 100%; font-weight: bold; line-height: 1.8; color: #5f5436; padding: 6px 9px; background-color: #f4f3f1; }
.ico-arr-1 { padding-left: 13px; background: url(../img/icon_arrow01.gif) no-repeat 0 5px; }
.ico-arr-2 { padding-left: 14px; background: url(../img/icon_arrow02.gif) no-repeat 0 3px; }
.box-1 { margin-bottom: 15px; padding: 10px 15px; background-color: #f5f0dc; }
.box-2 { margin-bottom: 15px; padding: 10px 15px; background-color: #e4f4f3; }




/*
 * top
 */
table.list-1 { width: 100%; margin-bottom: 15px; }
table.list-1 th { font-weight: bold; color: #4aa84a; background-color: #eafcea; }
table.list-1 th,
table.list-1 td { font-size: 93%; line-height: 1.4; padding: 4px 9px 3px 9px; border: solid #dddddd 1px; }
table.list-1 th.st { width: 22%; }
table.list-1 th.area { width: 55%; }




/*
 * information
 */
.info-box { margin-bottom: 25px; }
.info-box .info-thumb { float: left; width: 240px; margin-right: 25px; display: inline; }
.info-box .info-detail { float: right; font-size: 93%; line-height: 1.4; width: 555px; }




/*
 * access
 */
#access-info { margin-bottom: 35px; }
#access-info #shopdata { float: left; width: 425px; margin-right: 25px; display: inline; }
#access-info #accessmap { float: right; width: 160px; }




/*
 * cafe
 */
.cafe-box { width: 570px; margin-bottom: 25px; padding: 10px 20px 25px 20px; background: url(../img/bg_box03_bottom.gif) no-repeat bottom left; }
.cafe-box-begin { height: 17px; background: url(../img/bg_box03_top.gif) no-repeat; }
.cafe-food { margin-bottom: 20px; margin-left: 10px; }
.cafe-food .cafe-food-thumb { float: left; width: 220px; margin-right: 20px; display: inline; }
.cafe-food .cafe-food-detail { float: right; width: 310px; display: inline; }
.cafe-food .cafe-food-detail dl dt { font-size: 108%; line-height: 1.4; font-weight: bold; margin-bottom: 5px; padding-left: 23px; background: url(../img/icon_eddy.gif) no-repeat 0 2px; }
h3.cafe-cat { margin-bottom: 25px; }
.cafe-drink { margin-left: 10px; }
.cafe-drink .cafe-drink-item { float: left; width: 170px; }
.cafe-drink .center { margin: 0 21px; }
.cafe-drink .cafe-drink-item dl dt { font-size: 108%; line-height: 1.4; font-weight: bold; margin-bottom: 5px; padding-left: 23px; background: url(../img/icon_eddy.gif) no-repeat 0 2px; }




/*
 * event workshop
 */
.event-box,
.workshop-box { width: 570px; margin-bottom: 30px; padding: 0 20px 15px 20px; }
.event-box-begin,
.workshop-box-begin { height: 17px; }
dl.event-date,
dl.workshop-date { margin-bottom: 15px; padding-bottom: 5px; }
dl.event-date dt,
dl.workshop-date dt { font-size: 123.1%; line-height: 1.4; font-weight: bold; }
dl.event-date dd,
dl.workshop-date dd { font-size: 108%; line-height: 1.4; font-weight: bold; }
.event-thumb-l { }
.event-thumb-l .thumb { float: left; width: 238px; margin-right: 15px; display: inline; }
.event-thumb-l .event-info { float: right; width: 317px; display: inline; }

.event-box { background: url(../img/bg_box01_bottom.gif) no-repeat bottom left; }
.workshop-box { background: url(../img/bg_box02_bottom.gif) no-repeat bottom left; }
.event-box-begin { background: url(../img/bg_box01_top.gif) no-repeat; }
.workshop-box-begin { background: url(../img/bg_box02_top.gif) no-repeat; }
dl.event-date { border-bottom: solid #c9af62 1px; }
dl.workshop-date { border-bottom: solid #92c6c2 1px; }
dl.event-date dd { color: #ba8e15; }
dl.workshop-date dd { color: #4dada6; }




/*
 * clear
 */

#gnavi,
#content-inner,
.cafe-food,
.cafe-drink,
.event-thumb-l,
#side #link,
.event-topic,
.info-box,
#access-info,
#footer { display: inline-block; }

#gnavi:after,
#content-inner:after,
.cafe-food:after,
.cafe-drink:after,
.event-thumb-l:after,
#side #link:after,
.event-topic:after,
.info-box:after,
#access-info:after,
#footer:after { clear: both; display: block; content: ""; }




/*
 * hack
 */
* html #pagetitle { margin: 0 0 20px -9px; }

