/* CSS Document */


/*======================================================================* 
 *  h1                                                                  *
 *======================================================================*/

h1#logo-index {
  width: 225px;
  height: 150px;
  margin: 0;
  padding: 0;
  float: left;
}

h1#logo-index a {
  /*\*/
    overflow: hidden;
  /**/
  width: 225px;
  height: 150px;
  background: url(../../img/logo.gif) left top no-repeat;
  text-indent: -9999px;
  display: block;
}


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

#header-index {
  width: 900px;
  height: 360px;
  padding: 20px 25px 40px 25px;
  background: url(../img/bg-header.gif) left top no-repeat;
}

#flash-box {
  width: 655px;
  height: 360px;
  float: right;
}

ul#gnavi-index {
  width: 225px;
  margin: 0;
  padding: 0;
  float: left;
}

ul#gnavi-index li {
  width: 225px;
  height: 30px;
  margin: 0;
  padding: 5px 0 0 0;
  list-style-type: none;
}

ul#gnavi-index li a {
  /*\*/
    overflow: hidden;
  /**/
  width: 225px;
  height: 30px;
  margin: 0;
  padding: 0;
  text-indent: -9999px;
  display: block;
}

ul#gnavi-index li.gnavi01 a { background: url(../../img/li-gnavi01.gif) left top no-repeat; }
ul#gnavi-index li.gnavi02 a { background: url(../../img/li-gnavi02.gif) left top no-repeat; }
ul#gnavi-index li.gnavi03 a { background: url(../../img/li-gnavi03.gif) left top no-repeat; }
ul#gnavi-index li.gnavi04 a { background: url(../../img/li-gnavi04.gif) left top no-repeat; }
ul#gnavi-index li.gnavi05 a { background: url(../../img/li-gnavi05.gif) left top no-repeat; }
ul#gnavi-index li.gnavi06 a { background: url(../../img/li-gnavi06.gif) left top no-repeat; }

ul#gnavi-index li a:hover { background-position: left -30px; }


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

#index-box {
  width: 900px;
  padding: 0 25px 45px 25px;
}

#index-box .left-box {
  width: 580px;
  float: left;
}

#index-box .right-box {
  width: 280px;
  padding: 0 0 0 20px;
  border-left: 1px solid #ddd;
  float: right;
}


/*======================================================================* 
 *  Kakegawa Box                                                        *
 *======================================================================*/

.left-img {
  padding: 0 12px 20px 0;
  float: left;
}

h2.kakegawa {
  width: 355px;
  height: 31px;
  margin: 0;
  padding: 15px 0 28px 0;
  background: url(../../img/h2-kakegawa.gif) left 15px no-repeat;
  text-indent: -9999px;
  float: left;
}

dl#kakegawa-box {
  width: 355px;
  margin: 0;
  padding: 0 0 20px 0;
  float: left;
}

dl#kakegawa-box dt {
  margin: 0;
  padding: 0 0 5px 0;
  font-size: 88%;
  font-weight: bold;
}

dl#kakegawa-box dd {
  margin: 0;
  padding: 0;
  font-size: 75%;
  line-height: 140%;
}

.btn-charm {
  width: 122px;
  height: 29px;
  margin: 0;
  padding-top: 20px;
}
.btn-charm a {
  /*\*/
    overflow: hidden;
  /**/
  width: 122px;
  height: 29px;
  background: url(../../img/btn-charm.gif) left top no-repeat;
  text-indent: -9999px;
  display: block;
}


/*======================================================================* 
 *  Member Box                                                          *
 *======================================================================*/

h3.invitation {
  width: 270px;
  height: 18px;
  margin: 0;
  padding: 0;
  background: url(../../img/h3-invitation.gif) left top no-repeat;
  text-indent: -9999px;
  clear: both;
}

#invitation-box {
  margin: 0;
  padding: 15px 0 20px 0;
  font-size: 75%;
  line-height: 140%;
}

#invitation-box p {
  width: 350px;
  height: 57px;
  margin: 0 auto;
  padding: 10px 0 0 0;
}


/*======================================================================* 
 *  Address Box                                                         *
 *======================================================================*/

dl#address-box {
  margin: 0;
  padding: 7px 10px 7px 10px;
  background: #e7f5fa;
  color: #0291cd;
  font-size: 69%;
  clear: both;
}

dl#address-box dt {
  width: 269px;
  margin: 0;
  padding: 0;
  background: url(../../img/dt-address.gif) 24px center no-repeat;
  text-indent: -9999px;
  float: left;
}

dl#address-box dd {
  margin: 0;
  padding: 0 0 0 22px;
  border-left: 1px solid #8bcde8;
  float: left;
}

dl#address-box dd address {
  padding: 5px 0 5px 0;
  font-style: normal;
}


/*======================================================================* 
 *  Newinfo Box                                                         *
 *======================================================================*/

h4.newinfo {
  width: 280px;
  height: 18px;
  margin: 0;
  padding: 0;
  background: url(../../img/h4-newinfo.gif) left top no-repeat;
  text-indent: -9999px;
}

ul#newinfo-box {
  margin: 0;
  padding: 15px 0  0;
  border-bottom: 1px solid #ddd;
  font-size: 75%;
  line-height: 140%;
}

ul#newinfo-box li {
  margin: 0;
  padding: 0 0 13px 22px;
  background: url(../img/index-g_arrow.gif) 3px 5px no-repeat;
  list-style-type: none;
}

ul#newinfo-box li a { color: #ff6666; }

ul#newinfo-box li.list-link {
  background: none;
  text-align: right;
}


/*======================================================================* 
 *  Tourism Box                                                         *
 *======================================================================*/

h4.tourism {
  width: 280px;
  height: 18px;
  margin: 15px 0 0 0;
  padding: 0;
  background: url(../../img/h4-tourism.gif) left top no-repeat;
  text-indent: -9999px;
}

#tourism-box {
  padding: 15px 0 20px 0;
  border-bottom: 1px solid #ddd;
}

#tourism-box img {
  width: 90px;
  height: 90px;
  padding: 0 9px 0 0;
  display: block;
  float: left;
}

#tourism-box p {
  width: 181px;
  margin: 0;
  padding: 0 0 5px 0;
  font-size: 69%;
  line-height: 130%;
  float: right;
}

#tourism-box ul {
  width: 181px;
  margin: 0;
  padding: 0;
  float: right;
}

#tourism-box li {
  height: 13px;
  margin: 0;
  padding: 0;
  list-style-type: none;
  float: left;
}

#tourism-box li.menu a {
  /*\*/
    overflow: hidden;
  /**/
  width: 85px;
  height: 13px;
  background: url(../../img/btn-menu.gif) left top no-repeat;
  text-indent: -9999px;
  display: block;
}

#tourism-box li.monitor a {
  /*\*/
    overflow: hidden;
  /**/
  width: 96px;
  height: 13px;
  background: url(../../img/btn-monitor.gif) left top no-repeat;
  text-indent: -9999px;
  display: block;
}

#tourism-box li.monitor {
  width: 96px;
  height: 13px;
  background: url(../../img/btn-monitor-hide.gif) left top no-repeat;
  text-indent: -9999px;
}


/*======================================================================* 
 *  Qrcode Box                                                          *
 *======================================================================*/

dl#qrcode-box {
  margin: 0;
  padding: 20px 0 20px 0;
  border-bottom: 1px solid #ddd;
  font-size: 69%;
  line-height: 130%;
  clear: both;
}

dl#qrcode-box dt {
  width: 180px;
  margin: 0;
  padding: 0;
  float: right;
}

dl#qrcode-box dt b {
  padding: 10px 0 5px 0;
  display: block;
}

dl#qrcode-box dd {
  width: 90px;
  height: 90px;
  margin: 0;
  padding: 0;
  float: left;
}


/*======================================================================* 
 *  Bnr Box                                                             *
 *======================================================================*/

dl#bnr-box {
  margin: 0;
  padding: 18px 0 20px 0;
  font-size: 69%;
  line-height: 130%;
  clear: both;
}

dl#bnr-box dt {
  margin: 0;
  padding: 0;
  font-weight: bold;
}

dl#bnr-box dd {
  margin: 0;
  padding: 5px 0 0 0;
}

dl#bnr-box dd img {
  margin: 10px 0 0 0;
  display: block;
}