﻿A:hover {
COLOR: #cc0000;
TEXT-DECORATION: underline;
}

body{
text-align : center;
}

.main{
color : #14001a;
text-align : center;
margin-top : 10px;
margin-bottom : 60px;
margin-left : 10px;
font-family : メイリオ;
}

.table{
background-color : white;
}

.font{
color : #e6d6c6;
font-weight : 900;
}

ul li{
list-style-type: none;
}

/* -------------------- ★トップ★ -------------------- */
.top-box1-1{
background-color : #006c9a;
background-image : url(picture/piece-guide.gif);
text-align : left;
padding-left : 25px;
border-left-width : 5px;
border-top-style : ridge;
border-left-style : ridge;
border-bottom-style : ridge;
border-top-color : #e6d6c6;
border-left-color : #e6d6c6;
border-bottom-color : #e6d6c6;
border-top-width : 5px;
border-bottom-width : 5px;
width : 120px;
}

.top-box1-2{
background-color : #006c9a;
background-image : url(picture/piece-guide.gif);
font-size : 20px;
text-align : center;
border-top-style : ridge;
border-bottom-style : ridge;
border-top-color : #e6d6c6;
border-bottom-color : #e6d6c6;
color : #e6d6c6;
font-weight : 900;
border-top-width : 5px;
border-bottom-width : 5px;
padding-top : 5px;
height : 70px;
width : 630px;
}

.top-box1-3{
background-color : #006c9a;
background-image : url(picture/piece-guide.gif);
text-align : right;
padding-right : 25px;
border-top-style : ridge;
border-right-style : ridge;
border-bottom-style : ridge;
border-top-color : #e6d6c6;
border-right-color : #e6d6c6;
border-bottom-color : #e6d6c6;
border-top-width : 5px;
border-right-width : 5px;
border-bottom-width : 5px;
width : 120px;
}

/* --- ナビゲーション --- */
div.nav {
width: 100%; /* 幅 */
background: #006c9a; /* 背景 */
}

/* --- エリア --- */
div.nav ul.nl {
width: 120px; /* 幅 */
background: #006c9a url(picture/navi-box.gif) repeat-x top; /* 背景 */
margin: 0px 0px 0px 0px; /* 配置 */
padding: 0;
}

/* --- 項目 --- */
div.nav ul.nl li {
width: 120px; /* 項目の幅 */
float: left;
}

/* --- リンク --- */
div.nav ul.nl li a {
display: block;
position: relative; /* IE6用 */
padding: 0px 0px 0px 0px; /* リンクエリアのパディング（上、右、下、左） */
line-height: 100%; /* 行の高さ */
}

/* 絵部分 */
div.nav ul.nl li a span.en {
display: block;
margin-top: 0px; /* 上マージン */
margin-bottom: 0px; /* 下マージン */
}

/* --- ポイント時の設定 --- */
div.nav ul.nl li a:hover {
background: #e19292 url(picture/navi-box2.gif) repeat-x top; /* ポイント時の背景 */
}

/* --- clearfix --- */
.clearFix-nav:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearFix-nav {
min-height: 1px;
}


/* -------------------- ★センター★ -------------------- */
.center-box1{
text-align : right;

background-repeat : no-repeat;
height : 460px;
vertical-align : top;
padding-top : 25px;
padding-left : 12px;
}

.center-box2{
text-align : left;
background-repeat : no-repeat;
height : 740px;
vertical-align : top;
}


/* -------------------- ★上部★ -------------------- */

/* --- 右サイドメニュー --- */
.menu1{
text-align : left;
font-size : 15px;
height : 50px;
color : #e6d6c6;
}

/* --- 新着情報 --- */
.new1{
text-align : center;
font-size : 13px;
font-weight : 900;
color : #e6d6c6;
padding-left : 16px;
width : 214px;
height : 30px;
}

.new2{
text-align : center;
padding-left : 16px;
width : 214px;
height : 93px;
vertical-align : top;
}

.new3{
text-align : center;
font-size : 12px;
font-weight : 400;
color : #e6d6c6;
padding-left : 16px;
width : 214px;
height : 37px;
vertical-align : top;
}

/* --- 名勝とは？ --- */
.meisyou-toha{
text-align : left;
font-size : 9px;
font-weight : 400;
color : #e6d6c6;
vertical-align : bottom;
line-height : 10px;
height : 260px;
}

/* --- パンくず --- */
.pan{
text-align : left;
font-size : 12px;
height : 160px;
vertical-align : bottom;
font-weight : 400;
padding-left : 47px;
}


/* -------------------- ★下部★ -------------------- */

/* --- 右サイドメニュー --- */
.menu2-box{
vertical-align : top;
}

.menu2{
text-align : left;
font-size : 15px;
height : 50px;
color : #e6d6c6;
}

/* --- 四季探勝 --- */
.check-box1{
text-align : left;
height : 45px;
vertical-align : top;
}

.check-box2{
text-align : left;
padding-bottom : 13px;
width : 174px;
}

.check-card{
text-align : center;
background-repeat : no-repeat;
background-image : url(picture/card-back.gif);
}

.check-card1{
text-align : center;
height : 128px;
vertical-align : top;
padding-top : 10px;
}

.check-card2{
text-align : center;
height : 19px;
}

.check-card3{
text-align : center;
font-size : 13px;
line-height : 18px;
height : 48px;
color : #665358;
font-weight : 900;
}


/* --- 旅のガイド --- */
.guide-box1{
text-align : left;
height : 45px;
vertical-align : top;
}

.guide-box2{
text-align : left;
font-size : 13px;
font-weight : 400;
padding-bottom : 17px;
line-height : 30px;
padding-top : 5px;
}

/* --- 旅行雑誌 --- */
.book-box1{
text-align : left;
height : 45px;
vertical-align : top;
}

.book-box2{
text-align : left;
vertical-align : top;
  font-size : 13px;
  padding-bottom : 5px;
  color : #d9530a;
}

.book-box3{
text-align : center;
vertical-align : top;
width : 120px;
}

.book-box4{
text-align : center;
vertical-align : bottom;
font-size : 13px;
height : 16px;
}


/* --- Google --- */
.google-box{
text-align : left;
vertical-align : middle;
padding-left : 3px;
}


/* -------------------- ★宿泊情報★ -------------------- */
.yado1{
font-weight : 900;
}

.yado2{
font-weight : 900;
border-width : 1px 1px 1px 1px;
border-style : solid solid solid solid;
border-color : #006c9a #006c9a #006c9a #006c9a;
background-image : url(picture/paper12.jpg);
}

.yado-title1{
height : 70px;
text-align : left;
width : 234px;
vertical-align : top;
}

.yado-title2{
font-size : 16px;
text-align : left;
width : 690px;
vertical-align : bottom;
height : 64px;
padding-bottom : 6px;
}

.yado-box1{
text-align : left;
}

.yado-box2{
text-align : center;
width : 180px;
}


/* -------------------- ★ボトム★ -------------------- */

.bottom-box1-1{
background-color : #006c9a;
background-image : url(picture/piece-guide.gif);
text-align : left;
padding-left : 25px;
border-left-width : 5px;
border-top-style : ridge;
border-left-style : ridge;
border-bottom-style : ridge;
border-top-color : #e6d6c6;
border-left-color : #e6d6c6;
border-bottom-color : #e6d6c6;
border-top-width : 5px;
border-bottom-width : 5px;
width : 120px;
}

.bottom-box1-2{
background-color : #006c9a;
background-image : url(picture/piece-guide.gif);
font-size : 20px;
text-align : center;
border-top-style : ridge;
border-bottom-style : ridge;
border-top-color : #e6d6c6;
border-bottom-color : #e6d6c6;
color : #e6d6c6;
font-weight : 900;
border-top-width : 5px;
border-bottom-width : 5px;
padding-top : 5px;
height : 70px;
width : 630px;
}

.bottom-box1-3{
background-color : #006c9a;
background-image : url(picture/piece-guide.gif);
text-align : right;
padding-right : 25px;
border-top-style : ridge;
border-right-style : ridge;
border-bottom-style : ridge;
border-top-color : #e6d6c6;
border-right-color : #e6d6c6;
border-bottom-color : #e6d6c6;
border-top-width : 5px;
border-right-width : 5px;
border-bottom-width : 5px;
width : 120px;
}

.bottom-box2{
text-align : left;
font-size : 11px;
padding-left : 7px;
font-weight : 400;
height : 22px;
vertical-align : bottom;
}

.bottom-box3-1{
text-align : left;
font-size : 11px;
font-weight : 400;
padding-left : 7px;
height : 15px;
}

.bottom-box3-2{
text-align : right;
font-size : 11px;
padding-right : 32px;
font-weight : 400;
height : 15px;
}

.bottom-box4{
text-align : center;
vertical-align : middle;
height : 80px;
background-color : black;
}

.bottom-box4-1{
text-align : left;
vertical-align : middle;
padding-left : 31px;
}

.bottom-box4-2{
text-align : center;
vertical-align : middle;
}

.bottom-box4-3{
text-align : right;
vertical-align : middle;
padding-right : 31px;
}

.bottom-box5-1{
background-color : #006c9a;
background-image : url(picture/piece-guide.gif);
text-align : left;
padding-left : 25px;
border-left-width : 5px;
border-top-style : ridge;
border-left-style : ridge;
border-bottom-style : ridge;
border-top-color : #e6d6c6;
border-left-color : #e6d6c6;
border-bottom-color : #e6d6c6;
border-top-width : 5px;
border-bottom-width : 5px;
width : 120px;
}

.bottom-box5-2{
background-color : #006c9a;
background-image : url(picture/piece-guide.gif);
font-size : 18px;
font-weight : 900;
text-align : center;
border-top-style : ridge;
border-bottom-style : ridge;
border-top-color : #e6d6c6;
border-bottom-color : #e6d6c6;
color : #e6d6c6;
font-weight : 900;
border-top-width : 5px;
border-bottom-width : 5px;
height : 90px;
width : 630px;
vertical-align : bottom;
}

.bottom-box5-2-font{
text-align : center;
font-size : 11px;
font-weight : 400;
line-height : 16px;
}

.bottom-box5-3{
background-color : #006c9a;
background-image : url(picture/piece-guide.gif);
text-align : right;
padding-right : 25px;
border-top-style : ridge;
border-right-style : ridge;
border-bottom-style : ridge;
border-top-color : #e6d6c6;
border-right-color : #e6d6c6;
border-bottom-color : #e6d6c6;
border-top-width : 5px;
border-right-width : 5px;
border-bottom-width : 5px;
width : 120px;
}


/* -------------------- ★ボックス★ -------------------- */
/* --- ①角丸ボックス 300 --- */
DIV.section-box1 {
width: 300px; /* ボックスの幅 */
padding-bottom : 1px; /* ボックスの下パディング */
background: #ffffff url(picture/maru-back300.gif) no-repeat bottom; /* ボックスの背景 */
font-size: 80%;
color: #000000;
}

/* --- ①見出し --- */
DIV.section-box1  H3 {
margin: 0; /* 見出しのマージン */
padding : 7px 10px 4px 10px; /* 見出しのパディング（上下、左右） */
background:#006c9a url(picture/maru300.gif) no-repeat top; /* 見出しの背景 */
border-bottom: 1px #c0c0c0 solid; /* 見出しの下境界線 */
font-size: 150%; /* 見出しの文字サイズ */
color : white;
font-family : HG丸ｺﾞｼｯｸM-PRO,TBP丸ｺﾞｼｯｸR;
}

/* --- ①ボックス内の段落 --- */
div.section-box1  p {
margin: 5px 10px; /* 段落のマージン（上下、左右） */
text-align : left;
}

/* --- ③角丸ボックス　615：下枠無し --- */
DIV.section-box3 {
width: 615px; /* ボックスの幅 */
padding-bottom : 1px; /* ボックスの下パディング */
font-size: 80%;
color: #000000;
}

/* --- ③見出し --- */
DIV.section-box3  H3 {
margin: 0; /* 見出しのマージン */
padding : 7px 10px 4px 10px; /* 見出しのパディング（上下、左右） */
background:#006c9a url(picture/maru615.gif) no-repeat top; /* 見出しの背景 */
border-bottom: 1px #c0c0c0 solid; /* 見出しの下境界線 */
font-size: 150%; /* 見出しの文字サイズ */
color : white;
font-family : HG丸ｺﾞｼｯｸM-PRO,TBP丸ｺﾞｼｯｸR;
}

/* --- ③ボックス内の段落 --- */
div.section-box3  p {
margin: 5px 3px 0px 3px; /* 段落のマージン（上、右、下、左） */
text-align : left;
}

/* --- ④角丸ボックス 300：下枠無し --- */
DIV.section-box4 {
width: 300px; /* ボックスの幅 */
padding-bottom : 1px; /* ボックスの下パディング */
font-size: 80%;
color: #000000;
}

/* --- ④見出し --- */
DIV.section-box4  H3 {
margin: 0; /* 見出しのマージン */
padding : 7px 10px 4px 10px; /* 見出しのパディング（上・右・下・左） */
background:#006c9a url(picture/maru300.gif) no-repeat top; /* 見出しの背景 */
border-bottom: 1px #c0c0c0 solid; /* 見出しの下境界線 */
font-size: 150%; /* 見出しの文字サイズ */
color : white;
font-family : HG丸ｺﾞｼｯｸM-PRO,TBP丸ｺﾞｼｯｸR;
}

/* --- ④ボックス内の段落 --- */
div.section-box4  p {
margin: 5px 3px 0px 3px; /* 段落のマージン（上・右・下・左） */
text-align : left;
}

/* --- ⑤角丸ボックス 930：下枠無し --- */
DIV.section-box5 {
width: 930px; /* ボックスの幅 */
padding-bottom : 1px; /* ボックスの下パディング */
font-size: 80%;
color: #000000;
}

/* --- ⑤見出し --- */
DIV.section-box5  H3 {
margin: 0; /* 見出しのマージン */
padding : 7px 10px 4px 10px; /* 見出しのパディング（上下、左右） */
background:#006c9a url(picture/maru930.gif) no-repeat top; /* 見出しの背景 */
border-bottom: 1px #c0c0c0 solid; /* 見出しの下境界線 */
font-size: 150%; /* 見出しの文字サイズ */
color : white;
font-family : HG丸ｺﾞｼｯｸM-PRO,TBP丸ｺﾞｼｯｸR;
}

/* --- ⑤ボックス内の段落 --- */
div.section-box5  p {
margin: 5px 3px; /* 段落のマージン（上下、左右） */
text-align : left;
}


/* -------------------- ★ランキング★ -------------------- */
/* --- ランキングエリア --- */
div.ranking {
width: 300px; /* ランキングエリアの幅 */
font-size: 80%;
}

/* --- 見出し --- */
div.ranking h3 {
margin: 0px 0px 10px; /* 見出しのマージン（上、左右、下） */
padding: 7px 10px 4px 10px; /* 見出しのパディング（上右下左） */
background:#006c9a url(picture/maru300.gif) no-repeat top;
font-size: 150%;
font-family : HG丸ｺﾞｼｯｸM-PRO,TBP丸ｺﾞｼｯｸR;
color : white;
}

/* --- ランキングリスト --- */
div.ranking ol {
margin: 0;
padding: 0px 0px 0px 0px; /* ランキングリストのパディング（上・右・下・左） */
border-top: 1px #c0c0c0 dotted; /* ランキングリストの上境界線 */
list-style-type: none;
}

/* --- リスト項目 --- */
DIV.ranking LI {
padding : 6px 0px 6px 80px; /* 項目のパディング（上右下左） */
background-repeat: no-repeat;
background-position: 3px 4px; /* 背景画像の表示位置（左からの距離、上からの距離） */
border-bottom: 1px #c0c0c0 dotted; /* 項目の下境界線 */
line-height: 180%;
font-size: 110%;
font-weight: normal; /* 太字 */
letter-spacing : 1px;
}

/* --- マーカー画像 --- */
div.ranking li.rank1 {
background-image: url(picture/rank_1.gif); /* 1位の項目 */
}
div.ranking li.rank2 {
background-image: url(picture/rank_2.gif); /* 2位の項目 */
}
div.ranking li.rank3 {
background-image: url(picture/rank_3.gif); /* 3位の項目 */
}
div.ranking li.rank4 {
background-image: url(picture/rank_4.gif); /* 4位の項目 */
}
div.ranking li.rank5 {
background-image: url(picture/rank_5.gif); /* 5位の項目 */
}
div.ranking li.rank6 {
background-image: url(picture/rank_6.gif); /* 6位の項目 */
}
div.ranking li.rank7 {
background-image: url(picture/rank_7.gif); /* 7位の項目 */
}
div.ranking li.rank8 {
background-image: url(picture/rank_8.gif); /* 8位の項目 */
}
div.ranking li.rank9 {
background-image: url(picture/rank_9.gif); /* 9位の項目 */
}
div.ranking li.rank10 {
background-image: url(picture/rank_10.gif); /* 10位の項目 */
}


/* -------------------- ★左120画像入りリスト（2個以上　線あり）★ -------------------- */
/* --- リストエリア --- */
ul.thumbnail-120 {
width: 300px; /* リストエリアの幅 */
margin: 0;
padding: 0;
border-top: 1px #808080 dotted; /* リストエリアの上境界線 */
list-style-type: none;
}

/* --- リスト項目 --- */
ul.thumbnail-120 li {
padding: 12px 0px 6px 0px; /* リスト項目のパディング（上右下左） */
border-bottom: 1px #808080 dotted; /* リスト項目の下境界線 */
}

/* --- 項目内容 --- */
ul.thumbnail-120 dl {
width: 100%;
margin: 0;
font-size: 80%;
}

/* --- 写真エリア --- */
ul.thumbnail-120 dt.photo-120 {
width: 125px; /* 写真エリアの幅 */
float: left;
}

ul.thumbnail-120 dt.photo-120 img {
border: 1px #808080 solid;
}

/* --- キャプションエリア --- */
ul.thumbnail-120 dt.title-120,
ul.thumbnail-120 dd {
margin: 0px 0px 0px 127px; /* キャプションエリアのマージン（上右下左） */
}

/* --- タイトルエリア --- */
ul.thumbnail-120 dt.title-120 {
margin-bottom: 5px; /* タイトルエリアの下マージン */
line-height: 120%;
}

/* --- コメントエリア --- */
ul.thumbnail-120 dd {
line-height: 150%;
font-size: 90%;
}

/* --- clearfix --- */
.clearFix-ul.thumbnail-120:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearFix-ul.thumbnail-120 {
min-height: 1px;
}

/* -------------------- ★タブ★ -------------------- */

/* --- ボックス --- */
div.section-tab {
width: 400px; /* ボックスの幅 */
font-size: 70%; /* ボックスの文字サイズ */
color: #000000; /* ボックスの文字色 */
}

/* --- タブエリア --- */
div.section-tab ul.tabs {
width: 400px; /* タブエリアの幅（ボックスの幅から2px引いた値） */
margin: 0;
padding: 0;
background: #f9f9f9 url(picture/tab_gen.bmp) repeat-x top; /* タブエリアの背景 */
border: 1px #c0c0c0; /* タブエリアの境界線（太さ、色） */
border-style: solid solid none; /* タブエリアの境界線スタイル（上、左右、下） */
list-style-type: none;
}

div.section-tab ul.tabs li {
position: relative;
z-index: 1;
width: 122px; /* タブの幅 */
margin-bottom: -1px; /* タブの下マージン */
text-align: center;
float: left;
}

/* --- タブ内見出し --- */
div.section-tab h3 {
margin: 0 0 5px; /* 見出しのマージン（上、左右、下） */
padding: 0px 0px 0px 4px; /* 見出しのパディング（上右下左） */
background:#ffffff url(picture/maru.gif) no-repeat top; 
font-size: 100%;
color : 000000;
}


/* --- リンクエリア --- */
div.section-tab ul.tabs li a {
display: block;
position: relative; /* IE6用 */
padding: 3px 0px; /* リンクエリアのパディング（上下、左右） */
border-left: 1px #ffffff solid; /* リンクエリアの左境界線 */
border-right: 1px #c0c0c0 solid; /* リンクエリアの右境界線 */
outline: none; /* アウトライン（なし） */
text-decoration: none; /* テキストの下線（なし） */
}

/* --- ポイント時の設定 --- */
div.section-tab ul.tabs li a:hover {
text-decoration: underline; /* テキストの下線（あり） */
}

/* --- アクティブなタブ --- */
div.section-tab ul.tabs li.active {
z-index: 3;
background: #ffffff url(picture/tab_act.bmp) repeat-x top; /* アクティブタブの背景 */
font-weight: bold; /* 太字 */
}

div.section-tab ul.tabs li.active  a {
color: #000000; /* アクティブタブの文字色 */
}

/* --- ポイント時の設定 --- */
div.section-tab ul.tabs li.active a:hover {
text-decoration: none; /* テキストの下線（なし） */
}

/* --- 本文領域 --- */
DIV.section-tab DIV.topicArea-tab {
position : relative;
z-index : 2;
height: 290px; /* 本文領域の高さ */
/* 削除　overflow: auto;  はみ出た場合はスクロールで表示 */
padding: 0px 0px 0px 0px; /* 本文領域のパディング */
background-color: #ffffff; /* 本文領域の背景色 */
border: 1px #c0c0c0 solid; /* 本文領域の境界線 */
right : auto;
font-size: 110%;
}

/* --- 段落 --- */
div.section-tab div.topicArea-tab p {
margin: 0 0 6px; /* 段落のマージン（上、左右、下） */
}

/* --- 本文領域内の各ボックス --- */
div.section-tab div.topicArea-tab div.topic-tab {
padding-top: 1em; /* JavaScriptがオフの場合の設定 */
border-bottom: 0px #c0c0c0 solid; /* JavaScriptがオフの場合の設定 */
}

/* --- clearfix --- */
.clearFix-tab:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearFix-tab {
min-height: 1px;
}

