/* index.css */
/*#changeArea img {
	display:none;
}*/
* {
	margin: 0;
	padding: 0;
	font-family:"ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	}
html { 
    filter: expression(document.execCommand("BackgroundImageCache", false, true)); 
}
body {
    background:url(../images/index/back.gif) no-repeat fixed center top #FFFFFF;
	behavior:url(../../common/js/csshover.htc);
    background: none #77C8FF;
    background: none #FFFFFF;
	}
#wrapper {
	background:#EEEEEE /* url(../images/htb/htb-index/head_bg.gif) */ top left repeat-x;
	border-top:#CCCCCC solid 2px;
	margin-top:5px;
}
#contents {
	width:960px;
	margin:0 auto 0 auto;
}
#date {
	text-align:right;
	margin:3px 0 0 0;
	padding:0;
	font-size:12px;
	line-height:14px;
	height:13px;
}
h1 {
	margin:1px 0 0 0;
	background:none;
	border:none;
}
/* スライドショー ここから */
#htb_httl {width:960px;margin:0 auto;}
#htb_httl li{margin:0;padding:0;}
.clearfix:after { content: "."; display: block; clear: both; height: 0; } .clearfix { display: inline-block; } .clearfix { display: block; }
.TPNS_wrapfoot {
	clear:both;
	margin:0 auto;
	width: 960px;
}

.TPNSSwrapper {
	width: 958px;  /*スライドショー全体の幅を定義*/
	height: 300px;
	overflow: hidden;
}
#TPNiceSlideShowMenu div img {
	float: left;
	margin:  8px;
}
/*メニュースクロールバーの右サイド*/
			#TPNiceSlideShowMenu div {
	/* 5つ */ height: 60px;
	/* 4つ height: 75px; */
	width: 278px;
}
/*メニュー項目*/
			.TPNiceSlideShowMenuContent {
	text-align: left;
}
/*スライドショーのコンテンツエリア*/
			#TPNiceSlideShow {
	height: 300px;
	width: 680px;
	float: left;
}
/*右スクロールエリア*/
			#TPNiceSlideShowMenuWrp {
	height: 300px;
	width: 278px;
}
/*スクロールしているバー部分*/
			.tpniceslideshow_scrollbar-vert {
	height: 300px;
	width: 22px;
	float:right;
}
/*スクロールバーのボタン*/
			.tpniceslideshow_handle-vert {
	width: 22px;
}
/*注釈領域*/
			.TPNiceSlideShowGallery .slideInfoZone {
	height: 300px;
	width: 200px;
	background: #333333;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-top: -150px;
	margin-left: -100px;
}
/* patch */
.TPNiceSlideShowMenuContent p {
	margin-top:9px;
}
.TPNiceSlideShowMenuContent a:hover {
	text-decoration:none !important;
}
.tpnssmenu_title {
	color:#FFFFFF;
}
/* スライドショー ここまで （他にtpniceslideshow.cssが必要です）*/
/* ナビゲーション ここから */
ul#nav_htb {
	width:960px;
	margin:0 auto;
	clear:both;
	height:32px;
	padding: 0px;
	background-color:#CCCCCC;
}
			ul#nav_htb li {display:inline;float:left;}
			ul#nav_htb li a{
	display:block;
	height:32px;
	width:137px;
	background:url(../images/htb/htb-index/nav_htb2.png);
	text-indent: -3000px;
	overflow: hidden;
}
ul#nav_htb li a.nav_t_top {background-position:0px bottom;}
ul#nav_htb li a.nav_t_tour {background-position:822px bottom;}
ul#nav_htb li a.nav_t_ticket {background-position:685px bottom;}
ul#nav_htb li a.nav_t_event {background-position:548px bottom;}
ul#nav_htb li a.nav_t_hotel {background-position:411px bottom;}
ul#nav_htb li a.nav_t_what {background-position:274px bottom;}
ul#nav_htb li a.nav_t_access {background-position:137px bottom;}

ul#nav_htb li a.nav_t_top_active {background-position:0px middle;}
ul#nav_htb li a.nav_t_tour_active {background-position:822px middle;}
ul#nav_htb li a.nav_t_ticket_active {background-position:685px middle;}
ul#nav_htb li a.nav_t_event_active {background-position:548px middle;}
ul#nav_htb li a.nav_t_hotel_active {background-position:411px middle;}
ul#nav_htb li a.nav_t_what_active {background-position:274px middle;}
ul#nav_htb li a.nav_t_access_active {background-position:137px middle;}

ul#nav_htb li a.nav_t_top:hover {background-position:0px top;}
ul#nav_htb li a.nav_t_tour:hover {background-position:822px top;}
ul#nav_htb li a.nav_t_ticket:hover {background-position:685px top;}
ul#nav_htb li a.nav_t_event:hover {background-position:548px top;}
ul#nav_htb li a.nav_t_hotel:hover {background-position:411px top;}
ul#nav_htb li a.nav_t_what:hover {background-position:274px top;}
ul#nav_htb li a.nav_t_access:hover {background-position:137px top;}

ul#nav_htb li a.nav_t_top_active:hover {background-position:0px top;}
ul#nav_htb li a.nav_t_tour_active:hover {background-position:822px top;}
ul#nav_htb li a.nav_t_ticket_active:hover {background-position:685px top;}
ul#nav_htb li a.nav_t_event_active:hover {background-position:548px top;}
ul#nav_htb li a.nav_t_hotel_active:hover {background-position:411px top;}
ul#nav_htb li a.nav_t_what_active:hover {background-position:274px top;}
ul#nav_htb li a.nav_t_access_active:hover {background-position:137px top;}
/* ナビゲーション ここまで */


h2#head {
	width:770px;
	margin:0 auto 3px auto;
	background:#0066FF;
	height:auto;
}
/*パン屑*/
#breadcrumb{
	width:960px; height:auto;
	font:12px; line-height:1.1em;
	margin:4px auto 0px auto;
	padding:0;
}
	#breadcrumb ul{
	width:960px; height:auto;
	margin:0px auto 0px auto;
	padding:0;
	}
		#breadcrumb li{
			float:left;
			margin-right:8px;
		}
			#breadcrumb li a{
				margin-right:10px;
			}
#main {
	width:770px; height: auto;
	margin:0 auto;
	float:left;
	background:#EEEEEE;
}
#side1 {
	width:160px;
	float:right;
	text-align:center;	
	margin:5px 0 0 0;
	font-size:10px !important;
}
#side1 a {
	font-size:10px !important;
	line-height:11px;
}
#kobeBn {
	text-align:right;
	float:left;
	margin:5px 5px 5px 0;
}
#side_contents {
	text-align:right;
	float:left;
	margin:0 0 5px 0;
}

/* ========== leftbox bezel(head-foot) ========== */
.compartHead, .compartFoot{width:770px;height:12px;clear:both;display:block}
.compartHead{background:url(../images/htb/htb-index/box_l_a.png);font-size:1px;line-height:1px;}
.compartFoot{background:url(../images/htb/htb-index/box_l_c.png);font-size:1px;line-height:1px;}
.compart {
	width:770px;
	margin:0 0 0 0; padding:0 0 0 0;
	text-align:left;
	border:none;
	background:url(../images/htb/htb-index/box_l_b.png) top left repeat-y;
}
.compart p.landpackage{
	width:auto;
	margin-left:20px;
	margin-top:12px;
}

h2.osusume {background:url(../images/htb/htb-index/h2_osusume.png);width:769px;height:31px;font-size:9px;text-indent:-3000px;overflow:hidden;margin:0px;}
h2.opnecpn {background:url(../../namb-kyoto-opencpn/images/htb/h2_namba-kyoto-open-cpn.png);width:769px;height:31px;font-size:9px;text-indent:-3000px;overflow:hidden;margin:0px;}

h2.red_air {
	background:url(../images/htb/htb-index/h2_red_air.jpg);
	margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:35px;}
h2.blue_air {
	background:url(../images/htb/htb-index/h2_blue_air.jpg); 
	margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:35px;}
h2.lightblue_air {
	background:url(../images/htb/htb-index/h2_lightblue_air.jpg);
	margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:35px;}
h2.orange_air {
	background:url(../images/htb/htb-index/h2_orange_air.jpg); 
	margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:35px;}
h2.darkgreen_air {
	background:url(../images/htb/htb-index/h2_darkgreen_air.jpg); 
	margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:35px;}
h2.pink_air {
	background:url(../images/htb/htb-index/h2_pink_air.jpg); 
	margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:35px;}
h2.pink_bus {
	background:url(../images/htb/htb-index/h2_pink_bus.jpg); 
	margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:60px;}
h2.lightblue_bus {
	background:url(../images/htb/htb-index/h2_lightblue_bus.jpg); 
	margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:60px;}
h2.green_jr {
	background:url(../images/htb/htb-index/h2_green_jr.jpg); 
		margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:35px;}
h2.orange_jr {
	background:url(../images/htb/htb-index/h2_orange_jr.jpg); 
		margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:35px;}
h2.darkgreen_jr {
	background:url(../images/htb/htb-index/h2_darkgreen_jr.jpg); 
		margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:35px;}
h2.pink_camera {
	background:url(../images/htb/htb-index/h2_pink_camera.jpg); 
	margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:40px;}
h2.brown_onsen {
	background:url(../images/htb/htb-index/h2_brown_onsen.jpg); 
	margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:35px;}
h2.purple_hotel {
	background:url(../images/htb/htb-index/h2_purple_hotel.jpg); 
	margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:40px;}
h2.green_landpackage {
	background:url(../images/htb/htb-index/h2_green_landpackage.jpg); 
	margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:85px;}
h2.blue_ferry {
	background:url(../images/htb/htb-index/h2_blue_ferry.jpg); 
	margin:0px;
	width:769px;
	height:31px;
	background-repeat:no-repeat;
	font-size:14px !important;
	color:#FFF;
	font-weight:bold !important;
	line-height:2.3em !important;
	text-indent:45px;}
.compart h3{
	background:url(../images/htb/htb-index/ttl_h3_greenblank.png) no-repeat;
	width:732px;
	height:18px;
	color:#FFF;
	font-size:13px !important;
	font-weight:bold !important;
	display:block;
	clear:both;
	padding:1px 0 0 5px;
	margin:15px 0 5px 15px;
}
/* ツアータイトル（画像・共通タイトル・共通項目・アイコン） */

.compart table.tourHead {
	width:720px;
	margin:10px auto 5px auto;
}
.compart table.tourHead td {
	vertical-align:top;
	margin:15px 0 5px 15px;
}
.compart table.tourHead td.tourHeadInfo {
	width:550px;
	text-align:left;
}
.compart table.tourHead td.tourHeadInfo p span.tourHeadInfoTitle{
	font-size:15px !important;
	color:#2C8513 !important;
	font-weight:bold !important;
}
.compart table.tourHead td.tourHeadInfo p span.tourHeadInfoPoint{
	font-size:14px !important;
}
.compart div.tourbottom {
	display:block;
	clear:both;
	font-size:1px;
	line-height:1px;
	height:1px;
}
.compart div.tourImg {
	width:120px;
	margin-left:25px;
	_margin-left:10px;
	margin-right:5px;
	margin-bottom:15px;
	float:left;
	clear:both;
}
.compart div.tourImg img {
	margin-bottom:5px;
}
/* ↑ここまで↑ ツアータイトル（画像・共通タイトル・共通項目・アイコン） */

.compart .titleText ul.point {
	list-style:inside;
}
.compart .titleText ul.point li{
	font-size:14px;
	font-weight:bold;
	margin-bottom:3px;
	color:#FF3333;
}
/*----九州ハウステンボス学生グループ割引キャンペーン----*/
div.osusumeBnBox {
	width:744px;
	margin:15px 0 0 4px;
}
div.osusumeBnBox img {
	margin-bottom:10px;
	margin-left:18px;
}
.bnBox {
	width:732px;
	margin:15px auto 0 auto;
}
.bnBox img {
	margin-bottom:10px;
}
.bnBox img.bnCenter {
	margin:0 15px 10px 15px;
}
/*-----ここから------------------------------------------------------------------------
　　　　　　　　　　商品リスト　クラス名の統一 /宇田/09/09/19作成
	■商品リストのテーブルのクラス	：	.tour-box	（以下、tdの設定）
	-----------------------------------------------------------------------
		　用途		：	クラス名	：	4列100%(613px)	：	5列〜7列程度
					：				：	の時の標準値	：	の時の参考値
	コースコード	：	.co-cord	：		15%			：		11%
	商品名			：	.co-title	：		56%			：		45%
	日付（有効期限）：	.co-date	：		13%			：		11%
	価格			：	.co-price	：		16%			：		11%
	-----------------------------------------------------------------------
	■上記各クラスは幅のみareatop_900.css以外の個別のcssで設定。
----------------------------------------------------------------------------------------*/
.compart table th{
	font-weight:normal;
	color:#666666;
	border-bottom:#CCCCCC solid 2px;
	background-color:#eeeeee;
	line-height: normal;
	padding:2px 0 1px 0;
	}	

/*----商品リストのテーブルに適用----*/
.tour-box{
	width: 595px;
	margin-top:0;
	/* clear:left;
	margin:auto; */
	margin-bottom:10px;
}

.tour-box tr:hover{	background-color: #EEEEEE;}

.tour-box td {
	border-bottom:#C2D3fc 1px dashed;
	padding-top:6px;
	padding-bottom:5px;	
	line-height:1.0em !important;
	vertical-align:middle;
	}
.tour-box td a {
	line-height:1.0em !important;
	}
/*----商品リストのテーブルの各tdに適用（説明は上に記載）----*/
.co-cord{
	text-align: center;
	width:11%;
}
.co-title {
	text-align:left;
	padding-left:5px;
	width:54%;
	}
.co-date{
	text-align:left;
	width:12%;
}
.co-price {
	color:#FF0000;
	font-weight:bold !important;
	text-align:right;
	width:23%;
	}
.tour-box-ferry {}
.tour-box-ferry .co-title {
	text-align:left;
	padding-left:5px;
	width:44%;
	}
.tour-box-ferry .co-date{
	text-align:left;
	width:22%;
}

	/*-------------------------------------------------------------------------------------
	　　　　　　　　　　商品リスト　クラス名の統一 /宇田/09/09/19作成
	■areatop_900.css「商品リスト　クラス名の統一」で定義されたの同様のセレクタを使用
	■4列合計100%
	----------------------------------------------------------------------------------------*/
	#contents .tour-box tr:hover {
	background: none;
	}
	.tour-box td.co-head {
	width:auto;
	padding-left:10px;
	padding-top:0;
	font-size:13px !important;
	font-weight:bold !important;
	color:#111111;
	border-bottom:none;
	}
	.tour-box td.co-head .headline {
	font-size:15px !important;
	font-weight:bold !important;
	line-height:1.1em !important;
	color: #666666;
	}
	.tour-box td.co-head .kome {
	font-size:12px !important;
	font-weight:normal !important;
	line-height:1.1em !important;
	color: #111111;
	}
/*------------------------------
リンク
------------------------------*/
body #wrapper #contents #main a {
	color:#0000FF;
	text-decoration:underline;
}
body #wrapper #contents #main a:visit {
	color:#0000FF;
	text-decoration:underline;
}
body #wrapper #contents #main a:hover {
	color:#66CCFF;
	text-decoration:underline;
}
/* 商品リンク */
body #wrapper #contents #main .tour-box a {
	font-weight:bold;
	font-size:13px;
}
/*------------------------------
ページのいちばん上へ移動
------------------------------*/
body #wrapper #contents #main .toPageTop {
margin-bottom:5px;
text-align:right;
clear:both;
}
body #wrapper #contents #main .toPageTop A {
font-size:10px;
}

body #wrapper #contents #main .toPageTop A:link {color:#666666; text-decoration:none;}
body #wrapper #contents #main .toPageTop A:visited {color:#666666; text-decoration:none;} 
body #wrapper #contents #main .toPageTop A:hover {color:#999999; text-decoration:none;} 
body #wrapper #contents #main .toPageTop A:active {color:#999999; text-decoration:none;}
/*------------------------------
各エリアＴＯＰへ移動（リンクボタン）
------------------------------*/
body #wrapper #contents #main .to_areaTop {
	margin:5px auto 0 auto;
	width:740px;
	height:auto;
	text-align:left;
}
body #wrapper #contents #main .to_areaTop img {
}
body #wrapper #contents #main .to_areaTop a{
	width:auto;
	margin-right:10px;
}
body #wrapper #contents #main .to_areaTop a img {
	filter: alpha(opacity=91);
	-moz-opacity:0.91;
	opacity:0.91;
	width:auto;
}
body #wrapper #contents #main .to_areaTop a img:hover , 
body #wrapper #contents #main .to_areaTop a img:active {
	filter: alpha(opacity=100);
	-moz-opacity:1.0;
	opacity:1.0;
	width:auto;
}


/*------------------------------
フッター
------------------------------*/
#footer{
	padding:0px 0px 10px;
	background:#242424;
	text-align:center;
	color:#fff;
}
/* フッター */
#imgTourNavTitle{
	background-position:0px -117px;
}
#imgPrivacyMark{
	background-position:-339px -50px;
}
#imgCopyRight{
	background-position:-58px -117px;
}
#footer{
	padding:0px 0px 10px;
	background:#242424;
	text-align:center;
	color:#fff;
}
#footer .body{
	width:960px;
	margin:0 auto;
	text-align:left;
}
#footer *{
	color:#666;
	font-size:10px;
	line-height:1.4;
	font-weight:normal;
	text-decoration:none;
}
#footer a:hover{
	color:#65cdff;
	text-decoration:underline;
}
#footer div.solidFooter{
	border-bottom:1px solid #444;
	height:1px;
	margin:1em 0;
}
#footer .baner{
	padding-top:25px;
}
#bookmarkNav{
	padding-top:10px;
}
#bookmarkNav ul{
	float:right;
}
#bookmarkNav li{
	float:left;
	white-space:nowrap;
	margin-left:5px;
}
#bookmarkNav li a{
	text-decoration:none;
	color:#fff;
	margin-left:5px;
}
#tourNav{
	width:880px;
}
#tourNav dl{
	margin-top:2px;
	clear:both;
}
#tourNav dt{
	float:left;
	white-space:nowrap;
	margin-top:5px;
	margin-right:5px;
}
#tourNav dt a{
	text-decoration:none;
	color:#fff;
	margin-right:5px;
}
#tourNav dd{
	float:left;
	white-space:nowrap;
	margin-top:5px;
	margin-right:3px;
}
#tourNav dd a{
	text-decoration:none;
	color:#fff;
	margin-right:5px;
}
#footNav li{
	float:left;
	white-space:nowrap;
	margin-right:5px;
	font-size:12px;
}
#footNav li a{
	text-decoration:none;
	color:#fff;
	margin-right:5px;
	font-size:12px;
}
#areaNav li{
	float:left;
	white-space:nowrap;
	margin-left:5px;
}
#areaNav li a{
	text-decoration:none;
	color:#fff;
	margin-left:5px;
}
#contents{
	text-align:left;
	z-index:1000;
}
div.hf div.clmnTC{
	background-position:left top;
	background-repeat:repeat-x;
}
.clearfix{
	display:block;position:relative;
}
.l{
float:left;
}
.r{
float:right;
}
.note {
	font-size:10px !important;	
}

table.menu {
	background: url(../images/htb/htb-index/menu_bg.jpg) repeat-x;
	margin-top:5px;
	margin-bottom:5px;
	padding: 0;
	width: 769px;
}

table.menu li {float: left}

table.menu a {
	display: block;
	text-align:center;
	white-space:nowrap;
	background: url(../images/htb/htb-index/seperator.gif) no-repeat bottom right;
	color: #FFF !important;
	padding-left:10px; padding-right:10px; padding-top:8px; padding-bottom:8px
}

table.menu a:hover {background: url(../images/htb/htb-index/menu_bg_hover.jpg) repeat-x; }