@charset "utf-8";

/*----------------------------------------------------
	ヘッダ・フッタ用 2019/03 
	※スマホ用はこのcss内下部に記載
----------------------------------------------------*/

/*----------------------------------------------------
	共通
----------------------------------------------------*/
.button:hover {
	filter: alpha(opacity=70);
	opacity:0.7;
}

* {
	list-style-type: none;
}

/*----------------------------------------------------
	スマホメニュー
----------------------------------------------------*/
#spNav {
  padding:10px;
  background: #ce7eb3;
  display: inline-block;
  position: fixed;
  top: 0px;
  right: 0px;
  display: none;/* 一旦非表示 */
  z-index: 9000;
  color: #fff;
  	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;

}

#spNav #nav-drawer {
  position: relative;
}

/*チェックボックス等は非表示に*/
#spNav .nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#spNav #nav-open {
    display: inline-block;
    width: 7vw;
    /*height: 22px;*/
    vertical-align: middle;
    	text-align: center;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#spNav #nav-open span, #spNav #nav-open span:before, #spNav #nav-open span:after {
    position: absolute;
    height: 3px;/*線の太さ*/
    width: 7vw;/*長さ*/
    border-radius: 3px;
    background: #fff;
    display: block;
    content: '';
    cursor: pointer;
}
#spNav #nav-open span:before {
    bottom: -8px;
}
#spNav #nav-open span:after {
    bottom: -16px;
}

#spNav #nav-open em {
	display: block;
	text-align: center;
	font-size: 2.3vw;
	margin-top: 30px;
	margin-left: -10px;
	margin-right: -10px;
	line-height: 1.0;
}

/*閉じる用の薄黒カバー*/
#spNav #nav-close {
    display: none;/*はじめは隠しておく*/
    position: fixed;
    z-index: 99;
    top: 0;/*全体に広がるように*/
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    opacity: 0;
    transition: 0.3s ease-in-out;
}

#spNav #nav-close span {
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	color: #fff;
	font-size: 14vw;
	line-height: 1.0;
	padding: 1.2vw;
}

/*中身*/
#spNav #nav-content {
    overflow: auto;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 9999;/*最前面に*/
    width: 85%;/*左側に隙間を作る*/
    /*max-width: 330px;最大幅*/
    height: 100%;
    background: #fff;/*背景色*/
    transition: 0.3s ease-in-out;/*滑らかに表示*/
    -webkit-transform: translateX(105%);
    transform: translateX(105%);/*左に隠しておく*/
}

/*チェックが入ったらもろもろ表示*/
#spNav #nav-input:checked ~ #nav-close {
    display: block;/*カバーを表示*/
    opacity: 1.0;
}

#spNav #nav-input:checked ~ #nav-content {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);/*中身を表示*/
    box-shadow: -6px 0 6px rgba(0,0,0,0.15);
}


/*----------------------------------------------------
	スマホメニュー 中身
----------------------------------------------------*/
#spNav #nav-content {
	box-sizing: border-box;
	padding: 20px;
}

#spNav #nav-content .menuArea {

}

#spNav #nav-content .menuArea ul {
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px dotted #999;
}

#spNav #nav-content .menuArea ul:first-of-type {
	border: none;
	padding-top: 0;
}

#spNav #nav-content .menuArea ul li {
	background: url(/common/images/icon_next_pu.svg) no-repeat left 5px;
	padding-left: 20px;
	margin-top: 5px;
	font-size: 18px;
}

#spNav #nav-content .menuArea ul li a:link,
#spNav #nav-content .menuArea ul li a:visited {
	color:#333333;
	text-decoration: none;
}

#spNav #nav-content .menuArea ul li a:hover,
#spNav #nav-content .menuArea ul li a:active {
	color:#333333;
	text-decoration: none;
}

#spNav #nav-content .menuArea ul li ul {
	margin-top: 5px;
}

#spNav #nav-content .menuArea ul li ul li {
	background: url(/common/images/icon_next_pi_s.svg) no-repeat left 3px;
	padding-left: 15px;
	margin-top: 10px;
	font-size: 15px;
}


/*----------------------------------------------------
	Google検索ボックス
----------------------------------------------------*/
.gsc-input-box-hover, .gsc-input-box-focus {
    border-color: #ebede6 !important;
}

.gsc-input-box {
    background: #ebede6 !important;
}

#gsc-i-id1 {
    background: #ebede6 !important;
}

input.gsc-input, .gsc-input-box, .gsc-input-box-hover, .gsc-input-box-focus {
    background: #ebede6 !important;
    box-shadow: none !important;
}

.cse .gsc-search-button input.gsc-search-button-v2, input.gsc-search-button-v2 {
	padding-left: 10px !important;
	padding-right: 10px !important;
	margin-top: 0 !important;
}

.cse .gsc-control-cse, .gsc-control-cse {
	padding: 0 !important;
	width: 230px !important;
}

.gsc-search-box-tools .gsc-search-box .gsc-input {
	padding-right: 2px !important;
}

.gsc-search-button-v2, .gsc-search-button-v2:hover {
	cursor: pointer;
}

.cse .gsc-search-button-v2, .gsc-search-button-v2 {
	padding-left: 10px !important;
	padding-right: 10px !important;
}


/*----------------------------------------------------
	ヘッダ
----------------------------------------------------*/
header {
	width: 1024px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	padding: 0 0 10px;
	max-width: initial;
	box-sizing: content-box;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
	letter-spacing: 0;
	line-height: 1.5;
	font-size: 16px;
    flex-wrap: wrap;
}

header h1 {
	padding-top: 22px;
}

header h1 img {
	width: 400px;
}

header .headSubTop {
	display: flex;
	justify-content: flex-end;
	height: 37px;
}

header .headSubTop #headSearch {
	padding-top: 5px;
}

header .headSubTop ul {
	display: flex;
	padding-left: 10px;
}

header .headSubTop ul li {
	margin-left: 2px;
}

header .headSubTop ul li a img.active {
	opacity:0.5;
}

header .headSubMid {
	padding-top: 10px;
}

header .headSubMid ul {
	display: flex;
	justify-content: flex-end;
}

header .headSubMid ul li {
	margin-left: 30px;
}

header .headSubBot {
    width: 100%;
}

header .headSubBot ul {
	display: flex;
	justify-content: flex-end;
}

header .headSubBot ul li {
	margin-left: 20px;
	font-size: 14px;
}

header .headSubBot ul li a {
	display: block;
	background: url(/common/images/icon_next_pi_s.svg) no-repeat left center;
	padding-left: 12px;
}

header .headSubBot ul li a:link,
header .headSubBot ul li a:visited {
	color:#764609;
	text-decoration: none;
}

header .headSubBot ul li a:hover,
header .headSubBot ul li a:active {
	color:#764609;
	text-decoration: underline;
}


/*----------------------------------------------------
	メインメニュー
----------------------------------------------------*/
nav#mainMenu {
	background: #ce7eb3;
	height: 99px;
}

nav#mainMenu ul {
	width: 1024px;
	height: 99px;
	margin: 0 auto;
    display: flex;
}

nav#mainMenu ul li {
    width: 146px;
}

nav#mainMenu ul li:last-of-type {
    width: 148px;
}

nav#mainMenu ul li a {
	background: url(/common/images/headmenu.svg) left top;
	background-size: 1024px 319px;
	display: block;
	height: 99px;
	width: 100%;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
  }



nav#mainMenu ul li a span {
	display: none;
}

nav#mainMenu ul li a.hmBritish {
    background-position: 0px 0px;
}

nav#mainMenu ul li a.hmBritish:hover {
    background-position: 0px -110px;
}

.british nav#mainMenu ul li a.hmBritish  {
    background-position: 0px bottom;
}

nav#mainMenu ul li a.hmItaly {
    background-position: -128px 0px;
}

nav#mainMenu ul li a.hmItaly:hover {
    background-position: -128px -110px;
}

.italy nav#mainMenu ul li a.hmItaly  {
    background-position: -126px bottom;
}

nav#mainMenu ul li a.hmBoathouse {
    background-position: -256px 0px;
}

nav#mainMenu ul li a.hmBoathouse:hover {
    background-position: -256px -110px;
}

.boathouse nav#mainMenu ul li a.hmBoathouse  {
    background-position: -256px bottom;
}

nav#mainMenu ul li a.hmNnm {
    background-position: -384px 0px;
}

nav#mainMenu ul li a.hmNnm:hover {
    background-position: -384px -110px;
}

.nnm nav#mainMenu ul li a.hmNnm  {
    background-position: -384px bottom;
}

nav#mainMenu ul li a.hmGuide {
    background-position: -512px 0px;
}

nav#mainMenu ul li a.hmGuide:hover {
    background-position: -512px -110px;
}

.guide nav#mainMenu ul li a.hmGuide  {
    background-position: -511px bottom;
}

nav#mainMenu ul li a.hmBus {
    background-position: -640px 0px;
}

nav#mainMenu ul li a.hmBus:hover {
    background-position: -640px -110px;
}

.bus nav#mainMenu ul li a.hmBus  {
    background-position: -640px bottom;
}

nav#mainMenu ul li a.hmAccess {
    background-position: -768px 0px;
}

nav#mainMenu ul li a.hmAccess:hover {
    background-position: -768px -110px;
}

.access nav#mainMenu ul li a.hmAccess  {
    background-position: -768px bottom;
}



nav#mainMenu ul li a.hmGuidetour {
    background-position: -768px 0px;
}

nav#mainMenu ul li a.hmGuidetour:hover {
    background-position: -768px -110px;
}


.tour nav#mainMenu ul li a.hmGuidetour ,
.tourlist nav#mainMenu ul li a.hmGuidetour {
    background-position: -768px bottom;
}
nav#mainMenu ul li a.hmEbike {
    background-position: -896px 0px;
}

nav#mainMenu ul li a.hmEbike:hover {
    background-position: -896px -110px;
}

.Ebike nav#mainMenu ul li a.hmEbike {
    background-position: -896px bottom;
}


/*----------------------------------------------------
	フッタ
----------------------------------------------------*/
footer {
	margin-top: 100px;
	max-width: initial;
	box-sizing: content-box;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
	letter-spacing: 0;
	line-height: 1.5;
	font-size: 16px;
}

footer .footSitemap {
	background: url(/common/images/foot_image.jpg) no-repeat center top;
	background-size:100% auto;
	background-color: #f9f8ed;
}

footer .footSitemap .footSitemapIn {
	width: 1024px;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	padding: 25px 0;
}

footer .footSitemap .footSitemapIn ul {
	padding: 0 30px;
}

footer .footSitemap .footSitemapIn ul li {
	font-size: 14px;
	margin-top: 10px;
}

footer .footSitemap .footSitemapIn ul li:first-of-type {
	margin-top: 0px;
}

footer .footSitemap .footSitemapIn ul li a {
	display: block;
	background: url(/common/images/icon_next_pu.svg) no-repeat left center;
	padding-left: 18px;
}


footer .footSitemap .footSitemapIn ul li a:link,
footer .footSitemap .footSitemapIn ul li a:visited {
	color:#2e7fb1;
	text-decoration: underline;
}

footer .footSitemap .footSitemapIn ul li a:hover,
footer .footSitemap .footSitemapIn ul li a:active {
	color:#2e7fb1;
	text-decoration: none;
}


footer .footAdd {
	width: 1024px;
	margin: 0 auto;
	text-align: center;
	padding: 20px 0 0px;
	font-size: 15px;
}

footer .footAdd p.title img {
	width: 250px;
}

footer .footAdd address {
	margin-top: 10px;
}

footer #pageTop {
	width: 1024px;
	margin: -40px auto 0;
	text-align: right;
}

footer p.copy {
	background: #1a7ecc;
	color: #fff;
	font-size: 12px;
	line-height: 1.1;
	padding: 8px 0;
	margin-top: 10px;
}

footer p.copy small {
	width: 1024px;
	margin: 0 auto;
	display: block;
	text-align: center;
	letter-spacing: 1px;
	font-size: 100%;
}


/*----------------------------------------------------
＋＋＋＋＋＋＋＋＋＋＋　以下スマホ用　＋＋＋＋＋＋＋＋＋＋＋
----------------------------------------------------*/



@media screen and (max-width:740px) { 

.contents-header {
	margin-top: 20px;
}

/*----------------------------------------------------
	スマホ用メニュー表示
----------------------------------------------------*/

#spNav {
	display: block;
}


/*----------------------------------------------------
	ヘッダ
----------------------------------------------------*/
header {
	width: 100%;
	display: block;
	padding: 25px 10px;
	box-sizing: border-box;
}

header h1 {
	width: 85%;
	padding-top: 0;
}

header h1 img {
	width: 100%;
}

header .headSub,header .headSubBot {
	display: none;
}


/*----------------------------------------------------
	メインメニュー
----------------------------------------------------*/
nav#mainMenu {
	display: none;
}


/*----------------------------------------------------
	フッタ
----------------------------------------------------*/
footer {
	border-top: 10px solid #f9f8ed;
	margin-top: 30px;
}

footer #pageTop {
	display: none;
}

footer .footSitemap {
	display: none;
}

footer .footAdd {
	width: 100%;
	display: block;
	padding: 15px 0;
}

footer .footAdd p.title {
	width: 100%;
	padding: 0 60px;
	box-sizing: border-box;
}

footer .footAdd p.title img {
	width: 100%;
}

footer .footAdd address {
	border-left: none;
	padding-left: 0;
	width: 100%;
	font-size: 3.5vw;
	text-align: center;
	margin-top: 10px;
}

footer p.copy {
	margin-top: 0px;
}

footer p.copy small {
	width: 100%;
	text-align: center;
	font-size: 2vw;
}






}
/*----------------------------------------------------
＋＋＋＋＋＋＋＋＋＋＋　ここまでスマホ用　＋＋＋＋＋＋＋＋＋＋＋
----------------------------------------------------*/