@charset "UTF-8";

/* ================================================================

制作コンテンツ

info:
- レスポンシブの場合は、ブレイクポイント 768px で記述してください。
- SP用CSSを先に記述する方法を推奨します。下記の記述は例です。
- PCのみの場合は、記述を削除してください。

================================================================ */

/* SP用CSSの記述 */


/* PC、Tablet用CSSの記述 */
@media (min-width:768px){
}

html {
	margin: 0;
	padding: 0;
	width: 100%;
}
body {
	margin: 0;
	padding: 0;
	border: 0 none;
	width: 100%;
}

html, a, form, div, table, ul, ol, li, dl, h1, h2, h3, h4, h5, h6, p {
	margin: 0;
	padding: 0;
	border: 0 none;
}
img {
	margin:0;
	padding:0;
	border: 0 none;
}
ul {
	list-style-type: none;
}
td {
	text-align:left;
}
/* =======================================
メインタイトル
======================================= */
.wrapper h1 {
	position: absolute;
	display: flex;
	-webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
	margin: 10px auto 0;
	width: 100%;
} 
.wrapper h1 img {
    max-width: 960px;
	z-index: 100;
}
/*====================================
slide
====================================*/
/* コンテナー */
.wrapper {
	display: flex;
	-webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
	margin-top: 0px;
}

/* スライダーのwrapper */
.infinite-slider .swiper-wrapper {
  transition-timing-function: linear;
}

/* スライド */
.infinite-slider .swiper-slide {
  height: 625px !important; /* 高さを指定 */
  width: auto !important;
}

/* スライド内の画像 */
.infinite-slider .swiper-slide img {
  width: auto;
  height: 100%;
}
/* =======================================
	マップ＆キャッチエリア
======================================= */
#WRAPPER_01 {
	width: 100%;
	height: 1200px;
	margin-top: -30px;
	padding: 0px;
}
.bg01{
	background: url("../images/bg_01.png") center top -15px no-repeat;
}
.img01 {
	position: absolute;
	top: 55px;
	display: flex;
	-webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
	z-index: 150;
}
.img01 img {
	width: 36px;
}
.img01_02 {
	display: flex;
	-webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
	margin: 10px auto 40px auto;
	width: 100%;
	z-index: 2;
}
.img02 {
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
	margin: 0px auto 50px auto;
}

ul.info {
	position: relative;
	margin: 0px auto 0px auto;
	width: 100%;
	height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
ul.info li {
	padding: 0px;
}
.map img {
	margin: 30px auto 0px -40px;
	width: 100%;
	z-index: 150;
}
.s_bnr img {
	margin: 180px auto 0 auto;
	width: 200px;
}
li span.img02 img {
	margin: -390px 290px 50px 220px;
	width: 190px;
    z-index: 100;
}
/* =======================================
	スポット 南エリア
======================================= */
#South_area {
	width: 100%;
	height: 980px;
}
#WRAPPER_02 {
    width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    top: -880px;
	height: 850px;
}
#WRAPPER_02::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #ead9dd;
    transform: skewY(-12deg);
    z-index: -1;
}
.bg_02 {
	background: url("../images/bg_02.png") left top no-repeat;
	padding-top: 50px;
}
.box01 {
    position: relative;
	width: 990px;
	margin: 0px auto 0 auto;
	height: 1000px;
	display: block;
}
.img_03_01 {
	margin: 0px auto 10px auto;
	width: 100%;
	height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
.btn_01 {
    position: absolute;
    top: 108px;
    left: 450px;
    z-index: 300;
}
.img_03_02 {
    position: absolute;
    top: 169px;
    left: 452px;
}
.spot_01 {
    position: absolute;
    top: 269px;
    left: 407px;
    pointer-events: none;
}
.spot_01_link {
    position: absolute;
    top: 609px;
    left: 523px;
    z-index: 100;
}
.spot_02 {
    position: absolute;
    top: 519px;
    left: 270px;
}
.spot_02_link {
    position: absolute;
    top: 719px;
    left: 271px;
    z-index: 100;
}
.spot_03 {
    position: absolute;
    top: 396px;
    left: 20px;
}
.spot_03_link {
    position: absolute;
    top: 592px;
    left: 19px;
    z-index: 100;
}
.img_04 {
    position: absolute;
    top: 765px;
    left: 598px;
}
/* =======================================
	スポット 西エリア
======================================= */
#West_area  {
	width: 100%;
	height: 960px;
}
#WRAPPER_03 {
    width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    top: -880px;
	height: 850px;
}
#WRAPPER_03::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #dee2ce;
    transform: skewY(12deg);
    z-index: -1;
}
.bg_03 {
	background: url("../images/bg_03.png") right 10px top 55px no-repeat;
	padding-top: 50px;
}
.box02 {
    position: relative;
	width: 990px;
	margin: 0px auto 0 auto;
	height: 980px;
	display: block;
}
.img_05_01 {
	margin: 0px auto 10px auto;
	width: 100%;
	height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
.btn_02 {
	margin: 10px auto 0px auto;
	width: 100%;
	height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
.img_05_02 {
    position: absolute;
    top: 170px;
    left: 58px;
}
.spot_04 {
    position: absolute;
    top: 284px;
    left: 19px;
    pointer-events: none;
}
.spot_04_link {
    position: absolute;
    top: 620px;
    left: 28px;
    z-index: 100;
}
.spot_05 {
    position: absolute;
    top: 481px;
    left: 479px;
}
.spot_05_link {
    position: absolute;
    top: 685px;
    left: 479px;
    z-index: 100;
}
.spot_06 {
    position: absolute;
    top: 426px;
    left: 735px;
}
.spot_06_link {
    position: absolute;
    top: 622px;
    left: 735px;
    z-index: 100;
}
/* =======================================
	スポット 東エリア
======================================= */
#East_area {
	width: 100%;
	height: 1000px;
}
#WRAPPER_04 {
    width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    top: -870px;
	height: 850px;
}
#WRAPPER_04::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #d9d2cc;
    transform: skewY(-12deg);
    z-index: -1;
}
.bg_04 {
	background: url("../images/bg_04.png") left top 100px no-repeat;
	padding-top: 50px;
}
.box03 {
    position: relative;
	width: 990px;
	margin: 0px auto 0 auto;
	height: 990px;
	display: block;
}
.img_05_01 {
	margin: 0px auto 10px auto;
	width: 100%;
	height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
.btn_01 {
	margin: 10px auto 10px auto;
	width: 100%;
	height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
.img_05_02 {
    position: absolute;
    top: 174px;
    left: 56px;
}
.spot_07 {
    position: absolute;
    top: 270px;
    left: 423px;
    pointer-events: none;
}
.spot_07_link {
    position: absolute;
    top: 617px;
    left: 606px;
    z-index: 100;
}
.spot_08 {
    position: absolute;
    top: 260px;
    left: 79px;
}
.spot_08_link {
    position: absolute;
    top: 458px;
    left: 79px;
    z-index: 100;
}
.spot_09 {
    position: absolute;
    top: 683px;
    left: 16px;
}
.spot_09_link_01 {
    position: absolute;
    top: 644px;
    left: 259px;
    z-index: 100;
}
.spot_09_link_02 {
    position: absolute;
    top: 744px;
    left: 260px;
    z-index: 100;
}
/* =======================================
	スポット 中央エリア
======================================= */
#Central_area {
	width: 100%;
	height: 980px;
}
#WRAPPER_05 {
    width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    top: -870px;
	height: 850px;
}
#WRAPPER_05::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #d6d4e4;
    transform: skewY(12deg);
    z-index: -1;
}
.bg_05 {
	background: url("../images/bg_05.png") right 15px top 55px no-repeat;
	padding-top: 50px;
}
.box04 {
    position: relative;
	width: 990px;
	margin: 0px auto 0 auto;
	height: 980px;
	display: block;
}
.img_07_01 {
	margin: 0px auto 10px auto;
	width: 100%;
	height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
.btn_02 {
	margin: 10px auto 10px auto;
	width: 100%;
	height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
.img_07_02 {
    position: absolute;
    top: 160px;
    left: 58px;
}
.img_07_03 {
    position: absolute;
    top: 10px;
    left: 823px;
}
.spot_10 {
    position: absolute;
    top: 264px;
    left: 12px;
    pointer-events: none;
}
.spot_10_link {
    position: absolute;
    top: 296px;
    left: 591px;
    z-index: 100;
}
.spot_11 {
    position: absolute;
    top: 665px;
    left: 22px;
}
.spot_11_link {
    position: absolute;
    top: 652px;
    left: 266px;
    z-index: 100;
}
.spot_12 {
    position: absolute;
    top: 558px;
    left: 579px;
}
.spot_12_link {
    position: absolute;
    top: 666px;
    left: 795px;
    z-index: 100;
}
.spot_12_link02 {
    position: absolute;
    top: 787px;
    left: 647px;
    z-index: 100;
}
/* =======================================
	スポット 北エリア
======================================= */
#North_area {
	width: 100%;
	height: 1100px;
}
#WRAPPER_06 {
    width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    top: -870px;
	height: 830px;
}
#WRAPPER_06::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #e7d8c7;
    transform: skewY(-12deg);
    z-index: -1;
}
.bg_06 {
	background: url("../images/bg_06.png") left 20px top 150px no-repeat;
	padding-top: 50px;
}
.box05 {
    position: relative;
	width: 990px;
	margin: 0px auto 0 auto;
	height: 990px;
	display: block;
}
.img_08_01 {
	margin: 0px auto 10px auto;
	width: 100%;
	height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
.btn_01 {
    margin: 10px auto 10px auto;
    width: 102px;
    height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
.img_08_02 {
    position: absolute;
    top: 169px;
    left: 452px;
}
.spot_13 {
    position: absolute;
    top: 538px;
    left: 19px;
    pointer-events: none;
}
.spot_13_link {
    position: absolute;
    top: 752px;
    left: 19px;
    z-index: 100;
}
.spot_14 {
    position: absolute;
    top: 471px;
    left: 271px;
}
.spot_14_link {
    position: absolute;
    top: 690px;
    left: 275px;
    z-index: 100;
}
.spot_15 {
    position: absolute;
    top: 306px;
    left: 404px;
}
.spot_15_link {
    position: absolute;
    top: 649px;
    left: 571px;
    z-index: 100;
}
/*====================================
banner
====================================*/
#banner01 {
	width: 100%;
	margin: -120px auto 0 auto;
}
.bnr_03 {
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
	margin: 0px auto 0px auto;
}
.bnr_04 {
	display: block;
	margin: 0 auto;
	width: 990px;
}
.bnr_04 img{
	margin-top: -120px;
	width: 240px;
	float: right;
}
#banner02 {
	width: 100%;
	background: #f4f1eb;
	margin: -60px auto 0 auto;
	padding: 190px 25px 30px;
	height: 853px;
}

.bnr_box {
	background: #FFFFFF;
	border-radius: 10px;
	width: 940px;
	margin: 0px auto 30px auto;
	height: 580px;
}
ul.bnr {
	position: relative;
	margin: 0px auto 0px auto;
	width: 100%;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
ul.bnr li {
	padding: 0px 20px 20px 20px;
}
ul.bnr li img.mb23 {
	margin-bottom: 23px;
}
.bnr_07 {
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
	margin: 10px auto 0px auto;
}
.bnr_08 {
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
	margin: -20px auto 0px auto;
}

/*====================================
ピコピコ動く
====================================*/

.piko-piko {
	margin: 30px 0px 0px 20px;
	width: 210px;
	animation: pikopiko 1s steps(2, start) infinite;
}
.piko-piko02 {
	animation: pikopiko 1s steps(2, start) infinite;
}

@keyframes pikopiko {
  0% {
    transform: rotate(10deg);
  }
  to {
    transform: rotate(-5deg);
  }
}

/*====================================
link
====================================*/
a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
