@charset "utf-8";

/* =========================================================
 	Style: Header Style for Static Pages [ STATIC ]
 -----------------------------------------------------------
 1-4.Layout Box
 1-5.Header
 1-7.Hyper Text Module
 1-11.Common class 
 1-12.個別ブラウザ対応
========================================================= */




/* 1-4.Layout Box
--------------------------------------------------------- */
.head-bus,
.head-tour,
.head-hotel,
.head-ferry,
.head-common,
.head-mypage {
/*
header,
footer {
*/
	width: 100%;
	text-align: left!important;
	box-sizing: border-box;
}
	.head-bus > div,
	.head-tour > div,
	.head-hotel > div,
	.head-ferry > div,
	.head-common > div,
	.head-mypage > div {
/*
	header > div,
	footer > div {
*/
		width: 960px;
		margin: 0 auto;
		clear: both;
	}


/* 1-5.Header
--------------------------------------------------------- */
.head-bus .arearel:after,
.head-tour .arearel:after,
.head-hotel .arearel:after,
.head-ferry .arearel:after {
  content: "";
  clear: both;
  display: block;
}

.head-bus,
.head-tour,
.head-hotel,
.head-ferry,
.head-common,
.head-mypage {
/*
header {
*/
	background: url(//cdn.willer.co.jp/st/share/pc/img/bg-header-line.png) repeat-x left top;
	height: 130px;
	box-sizing: border-box;
	padding-bottom: 9px;
}
/* サブメニュー消しで縮小 */
.head-tour,
.head-hotel{
	height: 93px;
}
/*.head-hotel{
	margin-bottom:20px;
}*/

	.head-bus > div,
	.head-tour > div,
	.head-hotel > div,
	.head-ferry > div,
	.head-common > div,
	.head-mypage > div {
/*
	header > div {
*/
		background: no-repeat 170px top;
		padding-top: 9px;
	}
	
	.head-bus > div {
		background-image: url(//cdn.willer.co.jp/st/share/pc/img/bg-header-bus.jpg);
	}
	.head-tour > div {
		background-image: url(//cdn.willer.co.jp/st/share/pc/img/bg-header-tour.jpg);
	}
	.head-hotel > div {
		background-image: url(//cdn.willer.co.jp/st/share/pc/img/bg-header-hotel.jpg);
	}
	.head-ferry > div {
		background-image: url(//cdn.willer.co.jp/st/share/pc/img/bg-header-ferry.jpg);
	}
	.head-mypage > div {
		background-image: url(//cdn.willer.co.jp/st/3/ja/pc/img/bg-header-mypage.png);
	}
	.head-bus ul,
	.head-tour ul,
	.head-hotel ul,
	.head-ferry ul,
	.head-common ul,
	.head-mypage ul,
	.head-bus li,
	.head-tour li,
	.head-hotel li,
	.head-ferry li,
	.head-common li,
	.head-mypage li {
	/*
	header ul,
	header li {
	*/
		float: left;
	}
	/*.lang ul,
	.lang ul li,*/
	.menu div li {
		float: none;
	}
	
	.head-bus nav li,
	.head-tour nav li,
	.head-hotel nav li,
	.head-ferry nav li,
	.head-common nav li,
	.head-mypage nav li {
		/*
		header nav li {
		*/
			text-align: center;
			list-style: none;
		}

	.head-bus nav div,
	.head-tour nav div,
	.head-hotel nav div,
	.head-ferry nav div,
	.head-common nav div,
	.head-mypage nav div {
		/*
		header nav div {
		*/
			text-align: left;
		}

/* ----- WILLER TRAVEL Logo ----- */
/*
header #sitename,
header #sitename span 
*/
.head-bus #sitename,
.head-bus #sitename span,
.head-tour #sitename,
.head-tour #sitename span,
.head-hotel #sitename,
.head-hotel #sitename span,
.head-ferry #sitename,
.head-ferry #sitename span,
.head-common #sitename,
.head-common #sitename span {
	width: 152px;
	height: 37px;
}
/*
header #sitename 
*/
.head-bus #sitename,
.head-tour #sitename,
.head-hotel #sitename,
.head-ferry #sitename,
.head-common #sitename {
	position: relative;
	overflow: hidden;
	display: inline;
	float: left;
	margin-bottom: 9px;
}
/*
	header #sitename span 
*/
	.head-bus #sitename span,
	.head-tour #sitename span,
	.head-hotel #sitename span,
	.head-ferry #sitename span,
	.head-common #sitename span {
		position: absolute;
		left: 0;
		top: 0;
		display: block;
		background: url(//cdn.willer.co.jp/st/share/pc/img/logo-travel.png) no-repeat left top;
	}

/* ----- Utility Nav ----- */
.utility-nav {
	display: inline;
	float: right;
	padding: 6px 0;
	width: auto;
	height: 30px;
}
.utility-nav ul + ul {
	margin-left: 20px;
}

	/* Ferry、Tourのみ言語SELECT無(1/2) */
	.head-ferry .utility-nav,
	.head-tour .utility-nav,
	.head-hotel .utility-nav {
		width: auto;
	}
	
.utility-nav + div {
	clear: both;
}
		/* ◎Utility Nav: Guide */
		.guide {
			padding-top: 5px;
		}
			.guide > li {
				padding-left: 13px;
				background: no-repeat left top;
			}
			.guide > li + li {
				margin-left: 12px;
			}
			/* ご利用ガイド */
			.guide .lnk-1 {
				background-image: url(//cdn.willer.co.jp/st/share/pc/img/ico-beginer.png);
			}
			/* 会員・サービス */
			.guide .lnk-2 {
				background-image: url(//cdn.willer.co.jp/st/share/pc/img/ico-gift.png);
				padding-left: 18px;
			}
			/* よくある質問 */
			.guide .lnk-3 {
				background-image: url(//cdn.willer.co.jp/st/share/pc/img/ico-question.png);
			}
			/* サイトマップ */
			.guide .lnk-4 {
				background-image: url(//cdn.willer.co.jp/st/share/pc/img/ico-sitemap.png);
				padding-left: 20px;
			}
			/* ▼アイコン */
			/*
			.guide .lnk-1:after,
			.guide .lnk-2:after {
				content: url(//cdn.willer.co.jp/st/share/pc/img/ico-arrow-d-gray.png);
				vertical-align: middle;
				margin-left: -3px;
			}
			*/

		/* ◎Utility Nav: Language */
		.language {
			background: #fff;
			color: #999;
			border: 1px solid #d6d6d6;
			-webkit-border-radius: 6px;
			-moz-border-radius: 6px;
			border-radius: 6px;
			text-align: center;
			float: left;
			box-sizing: border-box;
			font-family: "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important;
		}
			.language > li {
				width: 75px;
				height: auto;
				padding: 5px 0;
			}
			.language > li + li {
				width: 60px;
				border-left: 1px solid #d6d6d6;
			}
			.language div ul {
				padding: 5px;
			}
				.language div li {
					padding: 5px;
					width: 80px;
					text-indent: 15px;
					text-align: left;
				}
					.language div li a {
						display: block;
					}
				.language div li {
					background: url(//cdn.willer.co.jp/st/share/pc/img/ico-arrow-r-pink.png) no-repeat 10px 50%;
				}
				.language div li + li {
					border-top: 1px dotted #ccc;
				}
				/* 韓国語表記用 */
				.language i {
					font-style: normal;
				}

/* ----- Dropdown Menu用 Div ----- */
.guide,
.language,
.menu {
	position: relative;
	list-style: none;
}
.language li > div {
	width: 100px;
	background: #fff;
}
.language li > div {
	position: absolute;
	left: 35px;
	top: 28px;
	display: none;
	border: 1px solid #e94f6e;
	z-index: 1000;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-webkit-box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
	-moz-box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
	box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
}

	/* Fukidashi Img */
	.language li > span {
		position: absolute;
		left: 90px;
		top: 18px;
		display: none;
		background: transparent url(//cdn.willer.co.jp/st/share/pc/img/angle.png) no-repeat left top;
		width: 35px;
		height: 11px;
		border: none;
		z-index: 1001;
	}
		.language li:hover > div,
		.language li:hover > span {
			display: block;
		}

.guide li {
	padding-bottom: 2px;
}


/* ----- Global Nav ----- */
/*
header .global-nav 
*/
.head-bus .global-nav,
.head-tour .global-nav,
.head-hotel .global-nav,
.head-ferry .global-nav,
.head-common .global-nav {
	float: left;
	clear: both;
	box-sizing: border-box;
}
/*
.global-nav a,
.global-nav a span 
*/
.head-bus .global-nav a,
.head-bus .global-nav a span,
.head-tour .global-nav a,
.head-tour .global-nav a span,
.head-hotel .global-nav a,
.head-hotel .global-nav a span,
.head-ferry .global-nav a,
.head-ferry .global-nav a span,
.head-common .global-nav a,
.head-common .global-nav a span {
	display: block;
}
/*
header .global-nav a,
header .global-nav a span 
*/
.head-bus .global-nav a,
.head-bus .global-nav a span,
.head-tour .global-nav a,
.head-tour .global-nav a span,
.head-hotel .global-nav a,
.head-hotel .global-nav a span,
.head-ferry .global-nav a,
.head-ferry .global-nav a span,
.head-common .global-nav a,
.head-common .global-nav a span {
	width: 148px;
	height: 38px;
}
.global-nav a {
	position: relative;
}
	.global-nav a span {
		position: absolute;
		left: 0;
		top: 0;
		background: no-repeat 0 0;
	}
	/* Default Img */
	.global-nav a:link span,
	.global-nav a:visited span {
		background: url(//cdn.willer.co.jp/st/3/ja/pc/img/btn-gmenu.png?20140324);
	}
	/* On Img */
	.global-nav a:hover span,
	.global-nav a:active span {
		background: url(//cdn.willer.co.jp/st/3/ja/pc/img/btn-gmenu-on.png?20140324);
	}
	/* Selected Img */
	.head-bus a.lnk-bus span,
	.head-tour a.lnk-tour span,
	.head-hotel a.lnk-hotel span,
	.head-ferry a.lnk-ferry span{
		background: url(//cdn.willer.co.jp/st/3/ja/pc/img/btn-gmenu-on.png?20140324);
	}
		/* バス */
		.global-nav a.lnk-bus span {
			background-position: 0 0;
		}
		/* ツアー */
		.global-nav a.lnk-tour span {
			background-position: 0 -40px;
		}
		/* フェリー */
		.global-nav a.lnk-ferry span {
			background-position: 0 -80px;
		}
		/* ホテル */
		.global-nav a.lnk-hotel span {
			background-position: 0 -120px;
		}	


/* ----- SP Nav ----- */
/*
header .sp,
header .sp2 
*/
.head-bus .sp,
.head-bus .sp2,
.head-tour .sp,
.head-tour .sp2,
.head-hotel .sp,
.head-hotel .sp2,
.head-ferry .sp,
.head-ferry .sp2,
.head-common .sp,
.head-common .sp2 {
}
/*
header .sp 
*/
.head-bus .sp,
.head-tour .sp,
.head-hotel .sp,
.head-ferry .sp,
.head-common .sp {
	float: left;
}
/*
header .sp2 
*/
.head-bus .sp2,
.head-tour .sp2,
.head-hotel .sp2,
.head-ferry .sp2,
.head-common .sp2 {
	float: right;
}
/*
	header .sp li,
	header .sp2 li 
*/
	.head-bus .sp li,
	.head-bus .sp2 li,
	.head-tour .sp li,
	.head-tour .sp2 li,
	.head-hotel .sp li,
	.head-hotel .sp2 li,
	.head-ferry .sp li,
	.head-ferry .sp2 li,
	.head-common .sp li,
	.head-common .sp2 li {
		text-indent: 25px;
		margin-left: 15px;
		background: no-repeat left 9px;
		padding: 10px 0 2px;
}
/*バスのページのみ「カート」ボタンがありますので、.sp liは短い方がいいです*/
	.head-bus .sp li{
		letter-spacing:-0.05em;
		text-indent: 25px;
		margin-left: 6px;
		background: no-repeat left 9px;
		padding-top: 9px;
}
	/*
	header .sp li
	*/
	.head-bus .sp li,
	.head-tour .sp li,
	.head-hotel .sp li,
	.head-ferry .sp li,
	.head-common .sp li {
		background-image: url(//cdn.willer.co.jp/st/share/pc/img/ico-crown.png);
}
	/*
	header .sp2 li 
	*/
	.head-bus .sp2 li,
	.head-tour .sp2 li,
	.head-hotel .sp2 li,
	.head-ferry .sp2 li,
	.head-common .sp2 li {
		background-image: url(//cdn.willer.co.jp/st/share/pc/img/ico-cart.png);
}
	.head-bus .sp li span,
	.head-tour .sp li span,
	.head-hotel .sp li span,
	.head-ferry .sp li span,
	.head-common .sp li span {
		font-size:0.9em;
}


/* ----- Local Nav ----- */
.menu {
	width: 960px;
	height: 35px;
	padding-top: 1px;
}
	.menu > li {
		width: 160px;
		height: 35px;
	}	
	.menu > li a,
	.menu > li a span {
		width: 160px;
		height: 35px;
		display: block;
	}
	.menu > li a {
		position: relative;
	}
		.menu > li a span {
			position: absolute;
			left: 0;
			top: 0;
			background: no-repeat 0 0;
		}
		/* Default Img */
		.menu a:link span,
		.menu a:visited span {
			background: url(//cdn.willer.co.jp/st/3/ja/pc/img/btn-smenu.png);
		}
		/* On Img */
		.menu a:hover span,
		.menu a:active span {
			background: url(//cdn.willer.co.jp/st/3/ja/pc/img/btn-smenu-on.png);
		}
		
		/* ----- Basu ----- */
			/* バス予約TOP */
			.menu .lnk-1 a span {
				background-position: 0 0;
			}
			/* 路線一覧 */
			.menu .lnk-2 a span {
				background-position: 0 -40px;
			}
			/* キャンペーン一覧 */
			.menu .lnk-3 a span {
				background-position: 0 -80px;
			}
			/* シート一覧 */
			.menu .lnk-4 a span {
				background-position: 0 -120px;
			}
			/* 乗下車場所一覧 */
			.menu .lnk-5 a span {
				background-position: 0 -160px;
			}
			/* WEBクーポン */
			.menu .lnk-6 a span {
				background-position: 0 -200px;
			}
			/* WILLER20周年用*/
			/*
			.menu .lnk-7 a span {
				lnk-7のclass名を使わないでください
			}
			*/
			
		/* ----- Tour ----- */
			/* ツアー予約TOP */
			.head-tour .menu .lnk-1 a span {
				background-position: -160px 0;
			}
			/* WillPACK（バス+宿泊セットプラン）とは？ */
			.head-tour .menu .lnk-2 a span {
				background-position: 0 -240px;
			}
			.head-tour .menu .lnk-2,
			.head-tour .menu .lnk-2 > a,
			.head-tour .menu .lnk-2 > a span {
				width: 320px;
			}
			/* キャンペーン一覧 */
			.head-tour .menu .lnk-3 a span {
				background-position: -160px -40px;
			}

		/* ----- Hotel ----- */
			/* ホテル予約TOP */
			.head-hotel .menu .lnk-1 a span {
				background-position: -480px 0;
			}
			/* WillPACK（バス+宿泊セットプラン）とは？ */
			.head-hotel .menu .lnk-2 a span {
				background-position: 0 -240px;
			}
			.head-hotel .menu .lnk-2,
			.head-hotel .menu .lnk-2 > a,
			.head-hotel .menu .lnk-2 > a span {
				width: 320px;
			}
			/* キャンペーン一覧 */
			.head-hotel .menu .lnk-3 a span {
				background-position: -480px -40px;
			}


		/* ----- Ferry ----- */
		/* フェリー予約TOP */
			.head-ferry .menu .lnk-1 a span {
				background-position: -320px 0;
			}
			/* 航路一覧 */
			.head-ferry .menu .lnk-2 a span {
				background-position: -320px -40px;
			}
			/* キャンペーン一覧 */
			.head-ferry .menu .lnk-3 a span {
				background-position: -320px -80px;
			}
			/* 港・ターミナル一覧 */
			.head-ferry .menu .lnk-4 a span {
				background-position: -320px -120px;
			}
			/* 船会社情報 */
			.head-ferry .menu .lnk-5 a span {
				background-position: -320px -160px;
			}
			
.topic-path:after {
	content:'';
	display: block;
	clear: both;
}
.topic-path {
	width: 100%;
	max-width: 960px;
	margin: 10px auto 15px auto;
}


/* 959px以下(Tablet＋SM) */
@media only screen and (max-width: 959px){
	.topic-path {
		margin-bottom: 0;
	}
}













/* ----- Link Button ----- */
.head-bus .lnk-btn,
.head-tour .lnk-btn,
.head-hotel .lnk-btn,
.head-ferry .lnk-btn,
.head-common .lnk-btn {
/*
.lnk-btn {
*/
	float: right;
	clear: none;
	line-height: 1;
}
		
.lnk-btn,
.lnk-btn a,
.lnk-btn a span {
	width: 210px;
	height: 35px;
}
.lnk-btn a {
	position: relative;
}
	.lnk-btn a span {
		position: absolute;
		left: 0;
		top: 0;
		display: block;
		background: no-repeat left top;
	}
	/* Default Img */
	.lnk-btn a span {
		background-image: url(//cdn.willer.co.jp/st/3/ja/pc/img/btn-ddmenu.png);
	}
	/* On Img */
	.lnk-btn a:hover span,
	.lnk-btn a:active span {
		background: url(//cdn.willer.co.jp/st/3/ja/pc/img/btn-ddmenu-on.png);
	}


/* 1-7.Hyper Text Module
--------------------------------------------------------- */
a {
	overflow: hidden;
	outline: none;
}
a:link,
a:visited {
	text-decoration: underline;
}
a:hover,
a:active {
	text-decoration: none;
}
a:link {
	color: #333399;
}
a:visited {
	color: #800080;
}

/* ----- Text隠し ----- */
.guide .lnk-2 > div a,
.head-bus .snav .lnk-2 > div a,
.head-bus .snav .lnk-4 > div a,
.head-bus .snav .lnk-5 > div a,
.head-ferry .snav .lnk-2 > div a,
.head-ferry .snav .lnk-4 > div a,
.lnk-btn a {
	color: #fefefe!important;
}



/* 1-11.Common class
--------------------------------------------------------- */
.clearfix:after {
  content: "";
  clear: both;
  display: block;
}

.head-bus hr.cl-both,
.head-tour hr.cl-both,
.head-hotel hr.cl-both,
.head-ferry hr.cl-both,
.head-common hr.cl-both,
.head-mypage hr.cl-both {
	clear: both;
	height: 0px;
	border: none;
	padding-top: 0;
	font-size: 0;
	overflow: hidden;
}






/* 1-12.IE対応
--------------------------------------------------------- */
/* ----- ハックTest用 ----- */
.example { /background: orange; }/* IE6・IE7 */
.example2 { _background: green; }/* IE6 */

/* ----- IE7+IE6 ----- */
/* ----- Header ----- */
.guide li > div,
.menu li > div {
	/display: none;
	/visibility: hidden;
}
.gnav {
	/margin-top: -15px;
}
.gnav,
.head-bus .sp,
.head-bus .sp2,
.head-tour .sp,
.head-hotel .sp,
.head-ferry .sp,
.head-common .sp {
	/margin-top: -15px;
}
/* ----- Footer ----- */
footer > div {
	/padding-top: 38px;
}

/* ----- Common Class ----- */
hr.cl-both {
	/visibility: hidden;
}


/* ----- IE6用 ----- */
body {
	_text-align: center;
	_zoom: 1;
}
header,
footer,
aside,
article {
	_text-align: left;
}

ol,
ul,
li {
	_zoom: normal;
}
hr.cl-both {
	_display: none;
}

.gnav ul {
	_width: 592px;/* 444px */
	_margin-left: 0;
}
.w-group {
	_display: inline;
	_width: 455px;
	_clear: both;
}

/* ----- IE10用 ----- */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
}

/* ----- iPhone用(200万人キャンペーンHeader) ----- */
@media screen and (max-device-width: 763px) {
	.head-bus .lnk-bnr,
	.head-tour .lnk-bnr,
	.head-hotel .lnk-bnr,
	.head-ferry .lnk-bnr {
		width: 200px;
		height: 38px;
	}
	.head-bus .lnk-bnr span,
	.head-tour .lnk-bnr span,
	.head-hotel .lnk-bnr span,
	.head-ferry .lnk-bnr span {
		width: 200px;
		height: 38px;
		top: 1px;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	.head-bus .lnk-bnr,
	.head-bus .lnk-bnr span,
	.head-tour .lnk-bnr,
	.head-tour .lnk-bnr span 
	.head-hotel .lnk-bnr,
	.head-hotel .lnk-bnr span 
	.head-ferry .lnk-bnr,
	.head-ferry .lnk-bnr span {
		font-size: 20%;
	}
}
@media screen and (max-device-width: 618px) {
	.head-bus .lnk-bnr,
	.head-tour .lnk-bnr, 
	.head-hotel .lnk-bnr, 
	.head-ferry .lnk-bnr {
		width: 128px;
		height: 24px;
	}
	.head-bus .lnk-bnr span,
	.head-tour .lnk-bnr span,
	.head-hotel .lnk-bnr span,
	.head-ferry .lnk-bnr ferry {
		width: 128px;
		height: 24px;
		top: 7px;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	.head-bus .lnk-bnr,
	.head-bus .lnk-bnr span,
	.head-tour .lnk-bnr,
	.head-tour .lnk-bnr span, 
	.head-hotel .lnk-bnr,
	.head-hotel .lnk-bnr span, 
	.head-ferry .lnk-bnr,
	.head-ferry .lnk-bnr span {
		font-size: 0;
	}
}
@media screen and (max-device-width: 511px) {
	.head-bus .lnk-bnr,
	.head-tour .lnk-bnr, 
	.head-hotel .lnk-bnr, 
	.head-ferry .lnk-bnr {
		width: 98px;
		height: 24px;
	}
	.head-bus .lnk-bnr span,
	.head-tour .lnk-bnr span, 
	.head-hotel .lnk-bnr span, 
	.head-ferry .lnk-bnr span{
		width: 98px;
		height: 24px;
		top: 7px;
		-webkit-background-size: 100% 100%;
		background-size: 100% 100%;
	}
	.head-bus .lnk-bnr,
	.head-bus .lnk-bnr span,
	.head-tour .lnk-bnr,
	.head-tour .lnk-bnr span, 
	.head-hotel .lnk-bnr,
	.head-hotel .lnk-bnr span, 
	.head-ferry .lnk-bnr,
	.head-ferry .lnk-bnr span {
		font-size: 0;
	}
}

/* イベントお知らせ 2014-7-7～（ベル）
--------------------------------------------------------- */
.arearel{
	position:relative;
}
.header-event-area{
	left: 307px;
    position: absolute;
    top: 0px;
}

.header-event-area_ferry{
	left: 338px;
    position: absolute;
    top: 0px;
}

.header-event-area_tour{
	left: 350px;
    position: absolute;
    top: 0px;
}

.header-event-area_hotel{
	left: 270px;
    position: absolute;
    top: 0px;
}

.header-event-area_common{
	left: 173px;
    position: absolute;
    top: 0px;
}

/* 20th */
.menu .lnk-7 a span {
	width:134px;
	height:27px;
	overflow:hidden;
	margin-top:4px;
	margin-left:10px;
	background: url(//cdn.willer.co.jp/st/share/pc/img/bnr_20th_top.png);
	background-position: 0 0;
}
/* On Img */
.menu .lnk-7 a:hover span,
.menu .lnk-7 a:active span {
	background: url(//cdn.willer.co.jp/st/share/pc/img/bnr_20th_top.png);
	background-position: 0 -27px;
}