/* format.css */



* {
  margin:0;
  padding:0;
}

html {
  height:100%;
  background:#80b0ff;
  background:#80b0ff url(../img/format/body-921.gif) repeat-y center top;
}

body {
  height:100%;
  text-align:center;
  line-height:1.3;
  font-size:13px;
  font-family:Osaka,'MS UI Gothic','MS Gothic',monospace;
  color:#333;
  background:#80b0ff;
  background:#80b0ff url(../img/format/body-921.gif) repeat-y center top;
}

hr {
  display:none;
}

a {
  text-decoration:none;
  color:#333;
}
a:link,
a:visited,
a:active {
  color:#06f;
}
a:hover {
  color:#f30;
}



/* body */
#body {
  display:inline-block;
}
#body {
  position:relative;
  z-index:1;
  display:block;
  width:900px;
  height:100%;
  margin:0 auto -41px auto;
  background:#fff;
}
html>body #body {
  height:auto;
  min-height:100%;
}
#body:after {
  content:'.';
  clear:both;
  visibility:hidden;
  display:block;
  width:100%;
  height:41px;
}
* html>body #body {
  display:inline-block;
}



/* title */
#body h1 {
  width:900px;
  height:70px;
  border-top:solid 10px #039;
}
html>body #body h1 {
  height:60px;
}
#body h1 a {
  position:absolute;
  left:5px;
  top:15px;
  display:block;
  width:330px;
  height:50px;
  text-indent:-999em;
  background:url(../img/format/logo.gif) no-repeat left top;
}
/*\*/
#body h1 a {
  overflow:hidden;
}
/**/



/* top menu */
ul#top-menu {
  position:absolute;
  right:5px;
  top:15px;
  list-style-type:none;
}
ul#top-menu li {
  display:inline;
  margin:0 0 0 10px;
}
ul#top-menu li a {
  padding:0 0 0 8px;
  color:#666;
  background:url(../img/format/icon-arrow.gif) no-repeat left center;
}
ul#top-menu li a.focus {
  color:#36c;
}



/* head menu */
ul#head-menu {
  width:900px;
  height:40px;
  list-style-type:none;
  overflow:hidden;
}
ul#head-menu li {
  position:relative;
  float:left;
  width:180px;
  height:40px;
}
ul#head-menu li a {
  display:block;
  width:100%;
  height:100%;
  text-indent:-999em;
  background:url(../img/format/button-head.png) no-repeat 0 0;
}
/*\*/
ul#head-menu li a {
  overflow:hidden;
}
/**/

ul#head-menu li.facility a {
  background-position:0 0;
}
ul#head-menu li.business a {
  background-position:-180px 0;
}
ul#head-menu li.event a {
  background-position:-360px 0;
}
ul#head-menu li.access a {
  background-position:-540px 0;
}
ul#head-menu li.link a {
  background-position:-720px 0;
}

ul#head-menu li.facility a:hover {
  background-position:0 -40px;
}
ul#head-menu li.business a:hover {
  background-position:-180px -40px;
}
ul#head-menu li.event a:hover {
  background-position:-360px -40px;
}
ul#head-menu li.access a:hover {
  background-position:-540px -40px;
}
ul#head-menu li.link a:hover {
  background-position:-720px -40px;
}

ul#head-menu li.facility a.focus {
  background-position:0 -80px;
}
ul#head-menu li.business a.focus {
  background-position:-180px -80px;
}
ul#head-menu li.event a.focus {
  background-position:-360px -80px;
}
ul#head-menu li.access a.focus {
  background-position:-540px -80px;
}
ul#head-menu li.link a.focus {
  background-position:-720px -80px;
}



/* contents */
#contents {
  display:inline-block;
}
#contents {
  position:relative;
  z-index:2;
  display:block;
  float:right;
  width:650px;
  height:400px;
  padding:15px 15px 55px 0;
  text-align:left;
}
html>body #contents {
  width:635px;
  height:auto;
  min-height:330px;
}
#contents:after {
  content:'.';
  clear:both;
  visibility:hidden;
  display:block;
  width:100%;
  height:0;
}
* html>body #contents {
  display:inline-block;
}

#contents .haslayer {
  display:inline-block;
}
#contents .haslayer {
  display:block;
  width:100%;
}
#contents .haslayer:after {
  content:'.';
  clear:both;
  visibility:hidden;
  display:block;
  width:100%;
  height:0;
}
* html>body #contents .haslayer {
  display:inline-block;
}

#contents h2.head {   /* head title */
  position:relative;
  width:100%;
  height:50px;
  background:url() no-repeat left top;
}
#contents h2.head a {
  display:block;
  width:100%;
  height:100%;
  text-indent:-999em;
}
/*\*/
#contents h2.head a {
  overflow:hidden;
}
/**/

#contents ul.sub-menu {   /* sun menu */
  height:20px;
  margin:0 0 20px 0;
  padding:0 0 0 20px;
  background:#e3eff6;
  list-style-type:none;
}
#contents ul.sub-menu li {
  float:left;
  margin:3px -1px 0 0;
  padding:0 5px;
  line-height:1em;
  border-left:solid 1px #333;
  border-right:solid 1px #333;
}
#contents ul.sub-menu li a {
  white-space:nowrap;
  color:#36c;
}
#contents ul.sub-menu li a.focus {
  color:#333;
}

#contents h3.title {   /* sub title */
  position:relative;
  height:20px;
  margin:20px 0 15px 0;
  padding:0 0 0 15px;
  line-height:20px;
  font-size:15px;
  color:#36c;
  background:url(../img/format/icon-title.gif) no-repeat left center;
  border-bottom:solid 2px #36c;
}

#contents h4 {
  margin:0 0 10px 0;
  color:#36c;
  line-height:14px;
  font-size:13px;
  padding:0 0 0 4px;
  border-left:solid 14px #36c;
}

#contents table {   /* table default format */
  width:100%;
  margin:0 0 15px 0;
  border:0;
  border-collapse:collapse;
}
#contents table tr.head th,
#contents table th.head {
  color:#fff;
  background:#7db4d5;
  border-top:solid 1px #7db4d5;
  border-bottom:solid 1px #7db4d5;
}
#contents table tr.first td {
  border-top:solid 1px #ccc;
}
#contents table th {
  padding:5px 0;
  text-align:center;
  vertical-align:middle;
  line-height:1.3;
  font-size:13px;
  color:#333;
  background:#e3eff6;
  border:solid 1px #fff;
  border-top:solid 1px #e3eff6;
}
#contents table th.end {
  border-right:0;
}
#contents table td {
  padding:5px 10px;
  text-align:left;
  vertical-align:middle;
  line-height:1.3;
  font-size:13px;
  color:#333;
  background:#fff;
  border:0;
  border-right:solid 1px #ccc;
  border-bottom:solid 1px #ccc;
}
#contents table th.last {
  border-bottom:solid 1px #e3eff6;
}
#contents table th.last {
  border-bottom:solid 1px #e3eff6;
}

#contents table th.w15,
#contents table td.w15 {
  width:15%;
}
#contents table th.w20,
#contents table td.w20 {
  width:20%;
}
#contents table th.w25,
#contents table td.w25 {
  width:25%;
}
#contents table th.w30,
#contents table td.w30 {
  width:30%;
}
#contents table th.w35,
#contents table td.w35 {
  width:35%;
}
#contents table th.w40,
#contents table td.w40 {
  width:40%;
}
#contents table th.w50,
#contents table td.w50 {
  width:50%;
}
#contents table th.w70,
#contents table td.w70 {
  width:70%;
}
#contents table th.w75,
#contents table td.w75 {
  width:75%;
}
#contents table td.center {
  text-align:center;
}


/* side */
#side {
  position:relative;
  z-index:1;
  float:left;
  width:235px;
  padding:15px 0 40px 15px;
  text-align:left;
}
html>body #side {
  width:220px;
}

#side-menu {
  margin-bottom:20px;
  list-style-type:none;
}
#side-menu li {
  margin:0 0 -1px 0;
}
#side-menu li a {
  display:block;
  height:55px;
  text-indent:-999em;
  background:url(../img/format/button-side.png) no-repeat 0 0;
  outline:none;
}
/*\*/
#side-menu li a {
  overflow:hidden;
}
/**/

#side-menu li.marina a {
  background-position:0 0;
}
#side-menu li.play a {
  background-position:0 -55px;
}
#side-menu li.guide a {
  background-position:0 -110px;
}
#side-menu li.derby a {
  background-position:0 -165px;
}
#side-menu li.license a {
  background-position:0 -220px;
}
#side-menu li.rental a {
  background-position:0 -275px;
}

#side-menu li.marina a:hover {
  background-position:-220px 0;
}
#side-menu li.play a:hover {
  background-position:-220px -55px;
}
#side-menu li.guide a:hover {
  background-position:-220px -110px;
}
#side-menu li.derby a:hover {
  background-position:-220px -165px;
}
#side-menu li.license a:hover {
  background-position:-220px -220px;
}
#side-menu li.rental a:hover {
  background-position:-220px -275px;
}



/* footer */
address {
  clear:both;
  position:relative;
  z-index:2;
  width:900px;
  height:40px;
  margin:0 auto;
  text-align:center;
  line-height:40px;
  font-style:normal;
  color:#666;
  background:#fff;
  border-top:solid 1px #039;
}



.shadow {
  display:inline-block;
}
.shadow {
  display:block;
  background:#000;
  filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='2',MakeShadow='true',ShadowOpacity='0.50');
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -khtml-border-radius:10px;
  -opera-border-radius:10px;
  border-radius:10px;
}
html>body .shadow {
  width:auto;
}
.shadow .box {
  position:relative;
  -moz-box-shadow:2px 2px 3px #666;
  -webkit-box-shadow:2px 2px 3px #666;
  box-shadow:2px 2px 3px #666;
}



/* image viwer */
#imageViewerMask {
  display:none;
  position:absolute;
  z-index:9998;
  left:0;
  top:0;
  width:100%;
  height:100%;
  background:#000;
  filter:alpha(opacity=50);
  -moz-opacity:0.5;
  opacity:0.5;
}
#imageViewer {
  display:none;
  position:absolute;
  z-index:9999;
}
#imageViewerShadow {
  display:inline-block;
}
#imageViewerShadow {
  display:block;
  width:1%;   /* for IE6 */
  background:#000;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  -khtml-border-radius:5px;
  -opera-border-radius:5px;
  border-radius:5px;
  filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='4',MakeShadow='true',ShadowOpacity='0.60');
}
html>body #imageViewerShadow {
  width:auto;
  margin:0 0 -100% 0;   /* for IE8 */
}
#imageViewerImage {
  position:relative;
  background:#000 url(../img/format/load.gif) no-repeat center center;
  cursor:pointer;
  border:solid 2px #fff;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  -khtml-border-radius:5px;
  -opera-border-radius:5px;
  border-radius:5px;
  -moz-box-shadow:5px 5px 5px #333;
  -webkit-box-shadow:5px 5px 5px #333;
  box-shadow:5px 5px 5px #333;
}
#imageViewerOff {
  display:none;
  position:absolute;
  right:5px;
  bottom:6px;
  width:17px;
  height:17px;
  cursor:pointer;
}
