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

layout CSS File

File Name		layout.css
Note			共通レイアウト用スタイルシート


New Creation
Update


Created By		Yoshiaki Murakami

------------------------------------------------------------------------
----------------------------------------------------------------------*/
/*----------------------------------------------------------------------
------------------------------------------------------------------------
目次

1.	htmlタグ
2.	container
3.	共通部分
4.	header
5.	content
	5-1.	main
	5-2.	sub
6.	footer

------------------------------------------------------------------------
----------------------------------------------------------------------*/
/*----------------------------------------------------------------------
1.	htmlタグ
----------------------------------------------------------------------*/
html {
  height: 100%;
}

body {
  height: 100%;
}

a {
  color: #17258b;
}

a:hover {
  color: #F86F33;
}

/*----------------------------------------------------------------------
2.	container
----------------------------------------------------------------------*/
* html #container {
  height: 100%;
}

#container {
  position: relative;
  min-height: 100%;
  /*	background:url(../img/container_bg.gif) left 214px repeat-x;*/
}

body > #container {
  height: auto;
}

/*----------------------------------------------------------------------
3.	共通部分
----------------------------------------------------------------------*/
.nav {
  padding: 3px 0 0;
  height: 71px;
  text-align: center;
}

.nav ul {
  background: url(../img/nav_bg.gif) left top no-repeat;
}

.nav li {
  display: inline;
  float: left;
}

.nav li a {
  height: 62px;
}

.nav .top a {
  width: 93px;
}

.nav .search a {
  width: 145px;
}

.nav .reason a {
  width: 141px;
}

.nav .opeday a {
  width: 138px;
}

.nav .openextday a {
  width: 138px;
}

.nav .changed a {
  width: 139px;
}

.nav .advice a {
  width: 156px;
}

/*----------------------------------------------------------------------
4.	header
----------------------------------------------------------------------*/
#container #header {
  width: 100%;
  background: url(../img/body_bg.gif) left top repeat-x;
}

* html #container #header {
  text-align: center;
}

#container #header .wrapper {
  position: relative;
  margin: 0 auto;
  width: 950px;
}

* html #container #header .wrapper {
  text-align: left;
}

#container #header h1 {
  background: #1e3d93;
  text-align: right;
  line-height: 24px;
  white-space: nowrap;
  color: #fff;
}

#container #header #logo {
  margin-left: -3px;
  padding: 7px 0 11px;
}

#container #header .info {
  position: absolute;
  top: 44px;
  right: 0;
}

#container #header .info dl dt {
  display: inline;
  float: left;
}

#container #header .info dl dd {
  margin-left: 300px;
  width: 268px;
}

#container #header .info .form li {
  display: inline;
  float: left;
  margin-bottom: 4px;
}

#container #header .info .form .reservation {
  margin-right: 4px;
  background: url(../img/info_form_bg.gif) left top no-repeat;
}

#container #header .info .form .mail {
  background: url(../img/info_form_bg.gif) -132px top no-repeat;
}

#container #header .info .form .coupon {
  margin: 0;
  background: url(../img/header_info_form_coupon_h.gif) 0 0 no-repeat;
}

#container #header .info .form .reservation a,
#container #header .info .form .mail a {
  width: 132px;
  height: 32px;
}

#container #header .info .form .coupon a {
  width: 268px;
  height: 44px;
}

/*----------------------------------------------------------------------
5.	content
----------------------------------------------------------------------*/
#content {
  margin: -4px 0 0;
  padding-bottom: 0;
  background: url(../img/container_bg.gif) left top repeat-x;
}

* html #content {
  text-align: center;
}

#content .contentswrapper {
  margin: 0 auto;
  width: 950px;
}

* html #content .contentswrapper {
  text-align: left;
}

#content #topicpath {
  padding: 9px 0;
}

#content #topicpath ol li,
#content #topicpath ol li a {
  color: #fff;
}

#content #topicpath ol li {
  display: inline;
  float: left;
  padding-left: 20px;
  background: url(../img/topicpath_bg.png) 6px center no-repeat;
  font-size: 1.2em;
}

#content #topicpath ol .first {
  padding: 0;
  background: none;
}

/*
5-1.	main
----------------------------------------------------------------------*/
#container #content #main {
  float: right;
  width: 690px;
}

/*
5-2.	sub
----------------------------------------------------------------------*/
#container #content #sub {
  float: left;
  width: 230px;
}

#container #content #sub div {
  margin-bottom: 10px;
}

#container #content #sub div div {
  margin: 0;
}

#container #content #sub div ul {
  border: 1px solid #17258b;
  border-top: none;
  background: #ebebec;
}

#container #content #sub div ul ul {
  border: none;
  background: none;
}

#container #content #sub div ul li a {
  font-size: 1.2em;
  font-weight: bold;
}

#container #content #sub .profile ul {
  border: 1px solid #17258b;
  border-top: none;
  background: #ebebec;
}

#container #content #sub .profile ul ul {
  border: none;
  background: none;
}

#container #content #sub .profile ul li ul li {
  border-top: 1px solid #fff;
  border-bottom: 1px solid #bdbdbe;
}

* html #container #content #sub .profile ul li {
  height: 1%;
}

#container #content #sub .profile ul .first {
  border-top: none;
}

#container #content #sub .profile ul .last {
  border-bottom: none;
}

#container #content #sub .profile ul .active,
#container #content #sub .profile ul li a {
  display: block;
  padding: 12px 0 12px 40px;
  background: url(../img/sub_link_bg.png) 15px center no-repeat;
}

#container #content #sub .profile ul li a {
  font-size: 1.4em;
}

#container #content #sub .profile ul .active {
  background: url(../img/sub_link_bg_h.png) 15px center no-repeat #6e8ed4;
  font-size: 1.4em;
  font-weight: bold;
  color: #fff;
}

#container #content #sub .profile ul li a:hover {
  background: url(../img/sub_link_bg_h.png) 15px center no-repeat #fff;
  color: #17258b;
}

#container #content #sub .profile ul .active span,
#container #content #sub .profile ul li a span {
  font-size: 0.714285em;
}

#container #content #sub .profile ul li .title {
  margin: 0;
  padding: 2px 0 2px 9px;
  border-bottom: 1px solid #2a4bb9;
  background: url(../img/sub_profile_title_bg.gif) left top repeat-x;
}

#container #content #sub .info {
  margin-bottom: 10px;
}

#container #content #sub .info dl {
  padding: 9px 8px 10px;
  border: 1px solid #17258B;
  border-top: none;
  background: #EBEBEC;
}

#container #content #sub .info dl dt {
  display: block;
  float: none;
  margin-bottom: 8px;
}

#container #content #sub .info dl dd ul {
  margin: 0 2px;
  border: none;
}

#container #content #sub .info dl dd ul .reservation {
  margin-bottom: 4px;
  background: url(../img/info_form_bg.gif) left -162px no-repeat;
}

#container #content #sub .info dl dd ul .mail {
  margin-bottom: 7px;
  background: url(../img/info_form_bg.gif) left -196px no-repeat;
}

#container #content #sub .info dl dd ul .coupon {
  background: url(../img/sub_info_form_coupon_h.gif) 0 0 no-repeat;
}

#container #content #sub .info dl dd ul li a {
  width: 208px;
}

#container #content #sub .info dl dd ul .reservation a {
  height: 34px;
}

#container #content #sub .info dl dd ul .mail a {
  height: 34px;
}

#container #content #sub .info dl dd ul .coupon a {
  height: 112px;
}

#container #content #sub .celebrity {
  margin-bottom: 10px;
}

#container #content #sub .celebrity .pickup .title {
  border: 1px solid #17258B;
  border-top: none;
}

#container #content #sub .celebrity .pickup ul {
  margin-bottom: 12px;
  background: #fff;
}

#container #content #sub .celebrity .pickup ul li {
  position: relative;
  overflow: hidden;
  margin-bottom: 2px;
  cursor: pointer;
}

* html #container #content #sub .celebrity .pickup ul li {
  height: 73px;
}

* + html #container #content #sub .celebrity .pickup ul li {
  height: 73px;
}

#container #content #sub .celebrity .pickup ul .last {
  margin: 0;
}

#container #content #sub .celebrity .pickup ul li dl {
  position: relative;
  z-index: 100;
}

* html #container #content #sub .celebrity .pickup ul li dl {
  height: 73px;
}

* + html #container #content #sub .celebrity .pickup ul li dl {
  height: 73px;
}

#container #content #sub .celebrity .pickup ul .male dl {
  background: url(../img/sub_celebrity_section_bg_m.png) left top no-repeat;
}

#container #content #sub .celebrity .pickup ul .female dl {
  background: url(../img/sub_celebrity_section_bg_f.png) left top no-repeat;
}

#container #content #sub .celebrity .pickup ul li dl dt {
  padding-top: 8px;
  padding-left: 9px;
  color: #515151;
}

#container #content #sub .celebrity .pickup ul li dl dt span {
  display: block;
  float: left;
  margin-bottom: 6px;
  margin-left: -9px;
  padding-right: 9px;
}

* html #container #content #sub .celebrity .pickup ul li dl dt span {
  margin-left: -5px;
}

* + html #container #content #sub .celebrity .pickup ul li dl dt span {
  margin-top: 2px;
}

#container #content #sub .celebrity .pickup ul .male dl dt span {
  background: url(../img/sub_celebrity_section_name_bg_footer_m.png) right bottom no-repeat;
}

#container #content #sub .celebrity .pickup ul .female dl dt span {
  background: url(../img/sub_celebrity_section_name_bg_footer_f.png) right bottom no-repeat;
}

#container #content #sub .celebrity .pickup ul li dl dt span span {
  float: none;
  margin: 2px 0 0;
  padding-right: 20px;
  padding-left: 8px;
  line-height: 22px;
  font-weight: bold;
  color: #fff;
}

* + html #container #content #sub .celebrity .pickup ul li dl dt span span {
  margin: 0;
}

#container #content #sub .celebrity .pickup ul .male dl dt span span {
  background: url(../img/celebrity_name_bg_m.png) left top;
}

#container #content #sub .celebrity .pickup ul .female dl dt span span {
  background: url(../img/celebrity_name_bg_f.png) left top;
}

#container #content #sub .celebrity .pickup ul li dl dt span span em {
  margin-right: 2px;
  font-size: 1.2em;
  font-weight: bold;
}

#container #content #sub .celebrity .pickup ul li dl dt span span em {
  margin-right: 2px;
  font-size: 1.2em;
  font-weight: bold;
}

#container #content #sub .celebrity .pickup ul li dl dd {
  clear: both;
  float: left;
  margin: 0 0 6px 6px;
  padding-right: 5px;
  background: url(../img/sub_celebrity_section_change_bg_footer.png) right top no-repeat;
}

#container #content #sub .celebrity .pickup ul li dl dd ul {
  margin: 0;
  padding-left: 5px;
  background: url(../img/sub_celebrity_section_change_bg_header.png) left top no-repeat;
}

* html #container #content #sub .celebrity .pickup ul li dl dd ul {
  float: left;
}

#container #content #sub .celebrity .pickup ul li dl dd ul li {
  float: left;
  margin: 0;
  padding-left: 14px;
  height: 18px;
  background: #ebebec;
  line-height: 18px;
  color: #515151;
}

* html #container #content #sub .celebrity .pickup ul li dl dd ul li {
  overflow: visible;
  height: auto;
}

* + html #container #content #sub .celebrity .pickup ul li dl dd ul li {
  overflow: visible;
  height: auto;
}

#container #content #sub .celebrity .pickup ul li dl dd ul .right {
  padding-right: 3px;
  background: url(../img/sub_celebrity_section_change_right.gif) left center no-repeat #ebebec;
}

#container #content #sub .celebrity .pickup ul li dl dd ul .left {
  background: url(../img/sub_celebrity_section_change_left.gif) left center no-repeat #ebebec;
}

#container #content #sub .celebrity .pickup ul li dl dd ul li ol li {
  padding: 0;
  background: none;
}

#container #content #sub .celebrity .pickup ul li dl dd ul li ol .before {
  padding-right: 8px;
  background: url(../img/sub_celebrity_section_change_bg.gif) right center no-repeat;
}

#container #content #sub .celebrity .pickup ul li dl dd ul li ol .after {
  margin-left: -2px;
}

#container #content #sub .celebrity .pickup ul li dl dd ul li ol li em {
  font-size: 1.2em;
  font-weight: bold;
  color: #DA0C13;
}

#container #content #sub .celebrity .pickup ul li .pic {
  position: absolute;
  top: -11px;
  right: 0;
  z-index: 90;
  border: none;
}

* html #container #content #sub .celebrity .pickup ul li .pic {
  position: relative;
  top: -84px;
  right: -133px;
}

* + html #container #content #sub .celebrity .pickup ul li .pic {
  position: relative;
  top: -84px;
  right: -133px;
}

#container #content #sub .celebrity .link {
  float: right;
  background: url(../img/button_link_h.png) left top no-repeat;
}

#container #content #sub .celebrity .link a {
  width: 104px;
  height: 20px;
}

#container #content #sub .clinic ul {
  padding: 4px 0 0;
  background: #ebebec;
}

#container #content #sub .clinic ul li {
  padding: 0 4px 4px;
}

* html #container #content #sub .clinic ul li {
  height: 1%;
}

* + html #container #content #sub .clinic ul li {
  height: 1%;
}

#container #content #sub .clinic ul li dl {
  border: 1px solid #bdbdbe;
  background: #fff;
}

* + html #container #content #sub .clinic ul li dl {
  padding-top: 1px;
}

#container #content #sub .clinic ul li dl dt,
#container #content #sub .clinic ul li dl dd {
  display: table-cell;
  vertical-align: middle;
}

* html #container #content #sub .clinic ul li dl dt,
* html #container #content #sub .clinic ul li dl dd {
  display: inline;
  zoom: 1;
}

* + html #container #content #sub .clinic ul li dl dt,
* + html #container #content #sub .clinic ul li dl dd {
  display: inline;
  zoom: 1;
  margin-top: -1px;
}

* html #container #content #sub .clinic ul li dl dd {
  width: 165px;
}

* + html #container #content #sub .clinic ul li dl dd {
  width: 165px;
}

#container #content #sub .clinic ul li dl dt {
  float: none;
  padding-right: 4px;
}

#container #content #sub .clinic ul li dl dd a {
  text-decoration: underline;
  line-height: 1.2;
}

* + html #container #content #sub .clinic ul li dl dd a {
  line-height: 1.3;
}

#container #content #sub .section .pic {
  border: 1px solid #17258b;
  border-top: none;
}

/*----------------------------------------------------------------------
6.	footer
----------------------------------------------------------------------*/
#footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  background: url(../img/footer_bg.gif) left 10px repeat-x;
}

* html #footer {
  text-align: center;
}

#footer #fnavi {
  margin: 0 auto;
  padding: 0 0 5px;
  width: 950px;
}

#footer #fnavi ul {
  background-position: left 13px;
}

#footer #fnavi li {
  padding: 13px 0 0;
}

#footer #fnavi .active {
  padding: 0;
}

#footer .wrapper {
  padding: 8px 0;
  background: url(../img/footer_bg.gif) left -70px repeat-x #3389e9;
}

#footer .wrapper * {
  margin: 0 auto 1em;
  width: 950px;
  text-align: center;
  color: #fff;
}

#footer .wrapper * * {
  margin: 0;
  width: auto;
}

#footer .wrapper p {
  margin-top: -0.3em;
  margin-bottom: -0.3em;
  line-height: 1.6;
  color: #fff;
}

#footer .wrapper .link {
  margin-top: 1em;
  margin-bottom: 1em;
}

#footer #copyright {
  background: #1e3d93;
  text-align: center;
  line-height: 24px;
  color: #fff;
}
