html{
-webkit-text-size-adjust: 100%;
}

body{
	font-family:
    'メイリオ',
    Meiryo,
    'Lucida Grande',
    Verdana,
    'ヒラギノ角ゴ Pro W3',
    'Hiragino Kaku Gothic Pro',
    Osaka,
    'ＭＳ Ｐゴシック',
	sans-serif;
	font-size: 14px;
	line-height: 1.7em;
	letter-spacing: 0.04em;
	}

#wrapper{
	width:100%;
}

main{
	width: 100%;
	overflow: hidden;
	}

#top-main-logo{
	padding-top: 6vw;
	text-align: right;
}

#top-main-logo img{
	width: 30%;
}

#top-main-title{
	text-align: center;
}

#top-main-title img{
	width:100%;
}


/* スライド背景
----------------------------------------------------------------------------------------------- */

@charset "utf-8";

/*==================================================
スライダーのためのcss
===================================*/
#slider {
    width: 100%;
    height: 80vh;/*スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
}

/*========= レイアウトのためのCSS ===============*/

h1{
  position: absolute;
  z-index: 2;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -80%);
  text-align: center;
  text-transform: uppercase;
}

.wrapper{
  position: relative;
}


/* スライド背景end
----------------------------------------------------------------------------------------------- */


#top-main-copy{
	width: 92%;
	line-height: 1.6em;
	margin: auto;
	color: #fff;
	position: absolute;
	z-index: 2;
	top: 78%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: left;
	text-transform: uppercase;
	font-size: 106%;
	text-shadow: #000 1px 0 15px;
}



/* ナビゲーション
----------------------------------------------------------------------------------------------- */

nav{
	width: 94%;
	margin: 26px auto;
	overflow: hidden;
	text-align: center;	
	font-size: 86%;
}

nav ol{
	width: 100%;
	margin: 0px auto;
}

nav li{
	float: left;
	margin: 0px 14px 5px 0px;
	white-space: nowrap;
	background: url(../img/nav_icon.jpg) no-repeat top left;
	padding-left: 32px;
	color: #000;
}

nav li a{
	color: #000;
}

/* 世界遺産
----------------------------------------------------------------------------------------------- */

.contents-title{
	font-size: 170%;
	line-height: 1.3em;
	margin: 22px 0px 18px;
	padding-bottom: 15px;
	font-weight: bold;
	background: url(../img/contents_title_line.jpg) no-repeat bottom left;
}

#heritage{
	overflow: hidden;
	width: 94%;
	margin: auto;
}

.map{
	display:none;
}

.m-map{
	margin: 10px 0px;

}

.m-map img{
	width: 94%;
}

.heritage-left{
	width: 100%;
	margin: auto;
}

.heritage-right{
	width: 100%;
	margin: auto;
}

.heritage-1{
	margin: 10px 0px 0px;
	background: url(../img/heritage1_pict.jpg) no-repeat bottom left;
	background-size: 100%;
	padding: 10px 30px 210px 10px;
}

.heritage-2{
	margin: 20px 0px;
	background: url(../img/heritage2_pict.jpg) no-repeat top left;
	background-size: 100%;
	padding: 240px 30px 10px 10px;
}

.heritage-3{
	margin: 0px 0px 20px;
	background: url(../img/heritage3_pict.jpg) no-repeat bottom left;
	background-size: 100%;
	padding: 0px 30px 240px 10px;
}

.heritage-4{
	margin: 0px 0px 20px;
	background: url(../img/heritage4_pict.jpg) no-repeat bottom left;
	background-size: 100%;
	padding: 0px 30px 230px 10px;
}

.heritage-5{
	width: 94%;
	margin: 0px 0px 20px;
	background: url(../img/heritage5_pict.jpg) no-repeat bottom left;
	background-size: 100%;
	padding: 0px 30px 220px 10px;
}

.heritage-6{
	margin: 20px 0px;
	background: url(../img/heritage6_pict.jpg) no-repeat top left;
	background-size: 100%;
	padding: 230px 10px 10px 30px;
}

.heritage-7{
	margin: 20px 0px;
	background: url(../img/heritage7_pict.jpg) no-repeat top left;
	background-size: 100%;
	padding: 230px 10px 10px 30px;
}

.heritage-8{
	margin: 20px 0px;
	background: url(../img/heritage8_pict.jpg) no-repeat top left;
	background-size: 100%;
	padding: 230px 10px 10px 30px;
}

.heritage-9{
	margin: 20px 0px;
	background: url(../img/heritage9_pict.jpg) no-repeat top left;
	background-size: 100%;
	padding: 230px 10px 10px 30px;
}

.heritage-10{
	margin: 20px 0px;
	background: url(../img/heritage10_pict.jpg) no-repeat bottom left;
	background-size: 100%;
	padding: 0px 10px 230px 30px;
}

.heritage-box{
	background-color: #fff;
	padding: 15px;
	border: 3px solid #eee;
}

.heritage-name{
	font-size: 18px;
	font-weight: bold;
	margin: 0px 0px 15px;
}

.heritage-name span{
	font-size: 12px;
	font-weight: normal;
}



/* ツアー
----------------------------------------------------------------------------------------------- */

#tour-heritage{	
	overflow: hidden;
	width: 94%;
	margin: 10px auto 30px;
}

#tour-heritage ol{
	margin-top: 30px;
}
	
#tour-heritage li{
	margin-bottom: 20px;
	border: 3px solid #ffd302;
	padding: 24px 10px 18px;
	text-decoration: underline;
	background: url(../img/flag.jpg) no-repeat top left;
	background-size: 46px;
}

#tour-heritage a{
	color: #000;
}



/* 美しい海の大自然
----------------------------------------------------------------------------------------------- */


.bg1{
	width: 100%;
	background: url(../img/bg_color.jpg) repeat-x top left;
	padding: 30px 0px 40px;
}

.bg2{
	width: 100%;
	background: url(../img/area_bg.jpg) repeat-x top left;
	padding: 20px 0px 30px;
}

.bg3{
	width: 100%;
	background: url(../img/bawa_bg.jpg) repeat top left;
	padding: 30px 0px 40px;
}


#sea{
	overflow: hidden;
	width: 92%;
	margin: auto;
}

#sea img{
	width: 100%;
}

#bawa{
	overflow: hidden;
	width: 92%;
	margin: auto;
}

#bawa img{
	width: 100%;
	margin-bottom: 10px;
}

.w-box{
	margin: auto;
	background-color: #fff;
	padding: 30px;
}

.bawa-htl-name{
	font-size: 120%;
	font-weight: bold;
	margin: 25px 0px 8px;
	background: url(../img/gray_line.jpg) no-repeat top left;
	padding-top: 28px;
}

.bawa-htl-txt{
	margin-bottom: 15px;
}

#ayurveda{
	overflow: hidden;
	width: 90%;
	margin: 20px auto;
}

#ayurveda img{
	width: 100%;
	margin-bottom: 10px;
}

#tea{
	overflow: hidden;
	width: 90%;
	margin: 20px auto;
}

#relations{
	overflow: hidden;
	width: 92%;
	margin: 0px auto 40px;
}

#basic{
	width: 92%;
	margin: 0px auto;
}

#basic-info{
	background-color: #fff;
	width: 100%;
	border-collapse: collapse;
	font-size: 96%;
	margin-bottom: 20px;
}

#basic-info th{
	width: 17%;
	border: 1px solid #ccc;
	padding: 7px;
	background-color: #eee;
}

#basic-info td{
	border: 1px solid #ccc;
	padding: 7px;
}


#basic-info2{
	width: 100%;
	background-color: #fff;
	border-collapse: collapse;
	font-size: 96%;
	margin-bottom: 20px;
}

#basic-info2 th{
	border: 1px solid #ccc;
	padding: 7px 12px;
	background-color: #eee;
}

#basic-info2 td{
	border: 1px solid #ccc;
	padding: 10px 12px;
	word-break: break-all;
}