/*
Theme Name: 乙部ワンダーランド
*/
/* この下に通常のcssを書いていく */
@charset "UTF-8";

/*--------------------------------------------*/
html { scroll-behavior:smooth; }
body,input,textarea {
	font-family:"游ゴシック","Yu Gothic","游ゴシック体","YuGothic",
	"メイリオ", meiryo, Osaka,"ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック", sans-serif;
	/*
	font-family: "ヒラギノ明朝 Pro","HiraMinPro","ＭＳ 明朝","ＭＳ Ｐ明朝","HG明朝E","MS PMincho",serif;
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", sans-serif;
	*/
}
* { box-sizing:border-box; }
body {
	margin:0px;
	padding:0px;
	font-size:100%;
	line-height:1em;
	color:#333;
	overflow-x:hidden;
}
header a, footer a{ color:#333; text-decoration:none; display:inline-block; }

h1 { font-size:150%; }
h2 { font-size:140%; }
h3 { font-size:130%; }
h4 { font-size:120%; }
h5 { font-size:100%; }
h6 { font-size:100%; }
h1,h2,h3,h4,h5,h6,div,dl,dt,dd,p,a,table,tr,td,address,img,
header ul, footer ul{
	margin:0px;
	padding:0px;
	line-height:1.5em;
	text-align:left;
	font-style:normal;
	list-style:none outside;
}
ul { margin:1em 0; padding:0 0 0 2em; } li { line-height:1.3em; margin:0 0 .5em; }
header li, footer li { line-height:1em; margin:0; }
i,em { font-style:normal; } u { text-decoration:none; } sup,sub { font-size:60%; }
/*************/
#clear, .clear { clear:both; }
.c { margin-left:auto; margin-right:auto; }
.l { float:left; }
.r { float:right; }
.t_c { text-align:center; }
/*img.l { margin:0 10px 10px 0; }
img.r { margin:0 0 10px 10px; }*/

/* table */
table { width:100%; border-collapse:collapse; border-spacing:0; }
thead th, thead td { background:#9166a9; color:#FFF; font-weight:normal; white-space:normal; }
th,td { border:1px solid #DDD; padding:10px; }
th { width:25%; text-align:center; white-space:nowrap; background-color:#e0ebf8; color:#0062d8; }
table , tr , td , th { border-color:#65B7EC; }
td { text-align:left; }

/* -------------------------------------------- */
a 			{ text-decoration:none; color:unset; }
a:hover     { opacity:.50; text-decoration:none; }
/* nav a:hover { opacity:1; }
/* --------------------------------------------*/

/* 装飾 *
body::before { content:"test"; }

/* inner */
.inner {
	display:block; position:relative; clear:both; width:1000px;
	padding-left:20px; padding-right:20px; margin-left:auto; margin-right:auto;
}

/* flexBox */
header .inner, header ul,
footer .inner div,
.flexBox  { display:flex; justify-content:space-between; }
footer .inner, footer nav ul, footer .at ul,
.flexBox2 { display:flex; justify-content:space-between; flex-wrap:wrap; }

/* common */
header img, header a,
footer img, footer a { display:block; width:100%; }

/* header ********** */
header { padding:30px 0; }
header h1  { width:80px; }
header div { width:calc(100% - 100px); margin-top:auto; }
header li  { flex-grow:1; border-right:1px solid #6a6a6a; font-weight:bold; }
header li:first-child { border-left:1px solid #6a6a6a; }
header li a { padding:10px 1em; text-align:center; }

/* nav txtColor */
header nav li:first-child a  { color:#117fc5; }
header nav li:nth-child(2) a { color:#e95383; }
header nav li:nth-child(3) a { color:#44d100; }
header nav li:nth-child(4) a { color:#e67300; }
header nav li:nth-child(5) a { color:#00cad1; }
header nav li:nth-child(6) a { color:#7f7f7f; }

/* menu bgColor */
header .at li:first-child a  { background:#e50065; }
header .at li:nth-child(2) a { background:#75c214; }
header .at li:nth-child(3) a { background:#9c2bc3; }
header .at li:nth-child(4) a { background:#2965ff; }
header .at li:nth-child(5) a { background:#ffac29; }
header .at li:nth-child(6) a { background:#00cdc6; }
header .at li:nth-child(7) a { background:#008cd6; }

/* menu hover */
header .at { position:relative; }
header .at ul {
	position:absolute; top:100%; left:50%; transform:translate(-50%,0);
	display:none; justify-content:space-between; flex-wrap:wrap;
	width:400px; padding-top:8px; z-index:100;
}
header .at:hover ul { display:flex; }
header .at ul::before {
	content:"";
	position:absolute; top:0; left:50%; transform:translate(-50%,0);
	width:0; height:0;
	border-style:solid; border-width:0 7.5px 8px 7.5px;
	border-color:transparent transparent #5c5c5c transparent;
}
header .at li { max-width:50%; min-width:50%; border:none; background:#FFF; }
header .at li:first-child { border:none; }
header .at li:nth-child(n+1) a { color:#FFF; }
header .at li a { font-weight:normal; }


/* mv ********** */
#mvTop, #mv, #mvDetail .inner div {
	position:relative;
	background:url()no-repeat bottom center / cover;
	width:100%; height:820px;
}
#mvTop .inner,
#mv .inner { width:100%; max-width:1160px; height:calc(100% - 100px); padding:0 0 0 100px; }
#mvTop::before, #mvTop::after,
#mv::before, #mv::after {
	content:"";
	position:absolute; left:0; top:0;
	background:#FFF url(/wp-content/uploads/2023/07/mvText.svg)no-repeat center center / 100% 90%;
	width:80px; height:100%; z-index:5;
}
#mvTop::after,
#mv::after { left:auto; right:0; }
#mv h2 {
	display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap;
	width:auto; max-width:570px;
	position:absolute; top:40%; left:100px; text-align:left;
}
#mv h2 img { display:block; }
#mv span, #mv em { display:flex; justify-content:center; align-items:center; }
#mv span {
	display:flex; justify-content:center; align-items:center;
	height:100px; background:#FFF; border:5px solid #EEE;
}
#mv em           { width:200px; height:40px; background:#EEE; margin:0 40px; }
#mv .mvText      { width:55%; height:55px; border-top:none; }
#mv .mvText + em { width:35%; margin:0 5%; }

.mvWave {
	position:absolute; bottom:-1px; left:50%; transform:translate(-50%,0);
	background:url(/wp-content/uploads/2023/07/mvPattern.png)repeat-x bottom center / 600px 100px;
	width:100%; height:120px;
}
.mvWave img { display:block; position:absolute; bottom:0; left:50%; transform:translate(-50%,5%); }

/* mvTop */
#mvTop .inner { position:absolute; top:0; left:50%; transform:translate(-50%,0); z-index:1; }
#mvTop { height:850px; background-position:top 35% center; }
#mvTop h2 { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:960px; }
#mvTop h2 img { display:block; width:100%; }
.mvTopWave img { position:absolute; top:0; left:50%; transform:translate(-50%,0); }
.mvTopWave img:nth-child(2) { position:absolute; top:auto; bottom:40px; left:50%; transform:translate(-50%,0); }

/* mvDetail */
#mvDetail .inner div {
	background-image:url(/wp-content/uploads/2023/07/mvEnjoy01.jpg);
	background-position:center;
	width:960px; height:540px; border-radius:20px;
}
#mvDetail h2  { margin-bottom:20px; }


/* mvBg */
.Enjoy01 #mv { background-image:url(/wp-content/uploads/2023/07/mvEnjoy01.jpg); }
.Enjoy02 #mv { background-image:url(/wp-content/uploads/2023/07/mvEnjoy02.jpg); }
.Gourmet #mv { background-image:url(/wp-content/uploads/2023/07/mvGourmet.jpg); }
.Shop #mv    { background-image:url(/wp-content/uploads/2023/07/mvShop.jpg); }
.Stay #mv    { background-image:url(/wp-content/uploads/2023/07/mvStay.jpg); }
.Event #mv   { background-image:url(/wp-content/uploads/2023/07/mvEvent.jpg); }
.Nature #mv  { background-image:url(/wp-content/uploads/2023/07/mvNature.jpg); }

/* mvColor */
.Enjoy01 #mv span { border-color:#e50065; }
.Enjoy01 #mv em   { background:#e50065; }
.Enjoy02 #mv span { border-color:#75c214; }
.Enjoy02 #mv em   { background:#75c214; }
.Gourmet #mv span { border-color:#915da3; }
.Gourmet #mv em   { background:#915da3; }
.Shop #mv span    { border-color:#2965ff; }
.Shop #mv em      { background:#2965ff; }
.Stay #mv span    { border-color:#ffac29; }
.Stay #mv em      { background:#ffac29; }
.Event #mv span   { border-color:#00cdc6; }
.Event #mv em     { background:#00cdc6; }
.Nature #mv span  { border-color:#008cd6; }
.Nature #mv em    { background:#008cd6; }


/* main ********** */
main, main > section { position:relative; margin:50px auto 100px; z-index:1; }
main::before, main::after {
	content:""; position:absolute; top:-150px; left:-80px;
	background:url(/wp-content/uploads/2023/07/mainBgLeft.gif)no-repeat top center / 385px 2200px;
	width:385px; height:calc(100% + 250px); z-index:-1;
}
main::after {
	background-image:url(/wp-content/uploads/2023/07/mainBgRight.gif);
	left:auto; right:-80px;
}
.top main::before, .top main::after,
.Detail main::before, .Detail main::after { content:none; }


/* breadCrumb */
.breadCrumb { color:#505050; margin:1rem 0 0 0; }
.breadCrumb strong { font-weight:normal; }

/* topPage */
.top main { z-index:10; margin:0 auto; }
.top main > section { margin:0 auto; }
/* about */
#about { padding:10px 0 100px; margin-top:0; background-color:#fff11b; }
#about::before {
	content:""; position:absolute; top:0; left:50%; transform:translate(-50%,-100%);
	background:url(/wp-content/uploads/2023/07/mvTopPattern.png)repeat-x bottom center / 600px 100px;
	width:100%; height:120px; z-index:1;
}
#about h3 {
	position:relative;
	display:flex; justify-content:center; align-items:center; height:300px; margin-bottom:40px;
}
#about h3::before {
	content:""; position:absolute; top:0; left:50%; transform:translate(-50%,0);
	background:url(/wp-content/uploads/2023/07/aboutBg.png)no-repeat center center / contain;
	width:1200px; height:300px; z-index:-1;
}
#about .flexBox     { align-items:center; }
#about .flexBox p   { width:420px; line-height:2em; font-size:1.15em; }
#about .flexBox .right   { width:450px; }
#about .flexBox img { display:block; width:100%; }
/* map */
#map { min-width:1000px; padding:50px 0 100px; margin:auto; background:#76bb29; overflow:hidden; }
#map::before {
	content:""; position:absolute; top:0; left:0;
	background:#a3e3fb; width:100%; height:1500px; z-index:-1;
}
#map::after {
	content:""; position:absolute; top:0; left:0;
	background:url(/wp-content/uploads/2023/07/mapBg02.png)repeat-x top center / 3840px 1450px;
	width:100%; height:1600px; z-index:-1;
}
#map .inner::after {
	content:""; position:absolute; top:400px; right:-40%; transform:translate(0,0);
	background:url(/wp-content/uploads/2023/07/mapBg04.png)no-repeat top center / contain;
	width:480px; height:960px; z-index:1;
}
#map .mapTitle { position:relative; z-index:20; }
#map .mapTitle h3 {
	position:relative; z-index:10;
	display:flex; justify-content:center; align-items:center; height:290px;
}
#map .mapTitle h3::before {
	content:""; position:absolute; top:0; left:50%; transform:translate(-50%,0);
	background:url(/wp-content/uploads/2023/07/mapBg.png)no-repeat center center / contain;
	width:850px; height:290px; z-index:-1;
}
#map .mapTitle h3::after {
	content:""; position:absolute; top:-500px; right:-25%; transform:translate(70%,0);
	background:url(/wp-content/uploads/2023/07/mapImg02.png)no-repeat top center / cover;
	width:280px; height:390px; z-index:999;
	transform-origin:left bottom;
	animation:
	animeX 10s ease-in-out infinite alternate,/* 横軸 */
	/* animeY2 10s ease-in-out infinite alternate, 縦軸 */
	animeFly 10s ease-in-out infinite;/* 上昇 */
}
#map .mapTitle p     { position:relative; z-index:10; margin-top:-30px; }
#map .mapTitle p::before {
	content:""; position:absolute; top:100%; left:-10%; transform:translate(0,0);
	background:url(/wp-content/uploads/2023/07/mapBg03.png)no-repeat top center / contain;
	width:130px; height:70px; z-index:1;
	transform-origin:top right;
	animation: swayAnime02 5s linear infinite;
}

#map .mapTitle p::after {
	content:""; position:absolute; bottom:-200px; left:0; transform:translate(0,0);
	background:url(/wp-content/uploads/2023/07/mapBg05.png)no-repeat top center / contain;
	width:110px; height:180px; z-index:1;
	animation:
	animeX2 15s ease-in-out infinite,/* 横軸 */
	/* animeY2 10s ease-in-out infinite alternate, 縦軸 */
	animeFly2 15s ease-in-out infinite;/* 上昇 */
}
#map .mapTitle p img { display:block; }
#map .mapTitle p img:nth-child(2) { margin-top:20px; }

/* ↓↓↓ 風船アニメーション ↓↓↓ */
/* 横軸 */
@keyframes animeX {
	0%,100% { right:-30%; }
	25%,75% { right:-35%; }
	50%     { right:-15%; }
}
@keyframes animeX2 {
	0%   { left:0%; }
	10%  { left:0%; }
	40%  { left:-15%; }
	60%  { left:-10%; }
	100% { left:-20%; }
}
/* 縦軸 */
@keyframes animeY { 0% {  } 50% {  } 100% {  } }
/* 上昇 */
@keyframes animeFly {
	0%   { transform:translateY(960px); opacity:0; }
	10%  { opacity:1; }
	40%  { transform:translateY(500px); }
	50%  { transform:translateY(520px); }
	100% { transform:translateY(0); opacity:1; }
}
@keyframes animeFly2 {
	0%   { transform:translateY(0); opacity:0; }
	10%  { opacity:1; }
	100% { transform:translateY(-900px); opacity:1; }
}
/* ↑↑↑ 風船アニメーション ↑↑↑ */

/* ↓↓↓ カモメ アニメーション ↓↓↓ */
@keyframes swayAnime02 {
	0%, 100% { transform:rotate(-10deg); top:105%; }
	50% { transform:rotate(10deg); top:100%; }
}
/* ↑↑↑ カモメ アニメーション ↑↑↑ */

#map .mapList {
	position:relative; height:960px; margin:-300px 0 0 0; z-index:20;
	background:url(/wp-content/uploads/2023/07/mapBg01.png)no-repeat top center / contain;
}
#map .mapList ul { list-style:none; width:100%; height:100%; padding:0; margin:0; }
#map .mapList a  { position:absolute; display:block; width:12%; }
#map .mapList a img { position:absolute; display:block; width:100%; }
#map .mapList a:hover { opacity:1; }

#map .mapList li a {  }
#map .mapList li:nth-child(1) a  { top:-5%; right:9%; }
#map .mapList li:nth-child(2) a  { top:13%; right:31%; }
#map .mapList li:nth-child(3) a  { top:25%; right:8%; }
#map .mapList li:nth-child(4) a  { top:30%; left:43%; }
#map .mapList li:nth-child(5) a  { top:43%; left:11%; }
#map .mapList li:nth-child(6) a  { top:35%; left:29%; }
#map .mapList li:nth-child(7) a  { top:56%; left:0%; }
#map .mapList li:nth-child(8) a  { top:65%; left:24%; }
#map .mapList li:nth-child(9) a  { top:52%; right:19%; }
#map .mapList li:nth-child(10) a { top:55%; right:39%; }

/* アニメーション */
/* 待機 */
#map .mapList a img { animation: standby 1.5s infinite; }
@keyframes standby {
	0% {	transform: translate(0, 0);}
	5% {	transform: translate(-2px, -0);}
	10% {	transform: translate(2px, 0);}
	15% {	transform: translate(-2px, -0);}
	20% {	transform: translate(2px, 0);}
	25% {	transform: translate(-2px, -0);}
	30% {	transform: translate(0, 0);}
	100% {	transform: translate(0, 0);}
}
/* hover */	
#map .mapList a:hover img {	
top:0;	
transform-origin:center bottom;	
animation:bound .5s ease-in alternate 1;	
}
@keyframes bound {	
0% { top:0; transform:scale(1); }	
30% { top:-10px; transform:scale(.9,1.1); }	
60% { top:0px; transform:scale(1); }	
90% { top:0; transform:scale(1.1,.9); }	
100% { top:0; transform:scale(1); }	
}

/* attraction */
#attraction { background:#ee7801; overflow:hidden; }
#attraction > .inner { padding-top:50px; }
#attraction h3 {
	position:relative;
	display:flex; justify-content:center; align-items:center; height:300px; margin-bottom:40px;
}
#attraction h3::before {
	content:""; position:absolute; top:0; left:50%; transform:translate(-50%,0);
	background:url(/wp-content/uploads/2023/07/attractionBg.png)no-repeat center center / contain;
	width:2160px; height:300px; z-index:-1;
}
#attraction p  { margin-bottom:60px; color:#FFF; font-size:1.15em; text-align:center; }
#attraction ul { list-style:none; padding:0; margin:0; }
#attraction li { position:relative; }
#attraction li::before {
	content:""; position:absolute;width:100%; height:100%;
	background:linear-gradient(
		90deg,
		rgba(255,255,255,1) 0%, rgba(255,255,255,0) 20%,
		rgba(255,255,255,0) 80%, rgba(255,255,255,1) 100%
	);
}
#attraction li {
	height:290px; margin:0 auto; border-bottom:5px solid #FFF;
	background:url(/wp-content/uploads/2023/07/mvEnjoy01.jpg)no-repeat center center / cover;
}
#attraction li:first-child { border-top:5px solid #FFF; }
#attraction li:nth-child(2) { background-image:url(/wp-content/uploads/2023/07/mvEnjoy02.jpg); }
#attraction li:nth-child(3) { background-image:url(/wp-content/uploads/2023/07/mvGourmet.jpg); }
#attraction li:nth-child(4) { background-image:url(/wp-content/uploads/2023/07/mvShop.jpg); }
#attraction li:nth-child(5) { background-image:url(/wp-content/uploads/2023/07/mvStay.jpg); }
#attraction li:nth-child(6) { background-image:url(/wp-content/uploads/2023/07/mvEvent.jpg); }
#attraction li:nth-child(7) { background-image:url(/wp-content/uploads/2023/07/mvNature.jpg); }
#attraction .inner { height:100%; }
#attraction h4 {
	position:relative;
	display:flex; justify-content:center; align-items:center;
	height:100%;
}
#attraction h4::after {
	content:""; position:absolute; top:48%; left:73%;
	background:#000 url(/wp-content/uploads/2023/07/attractionArrow.svg)no-repeat center left 55% / 15px 20px;
	border:1px solid #FFF; border-radius:50%;
	width:45px; height:45px;
}
#attraction li:nth-child(1) h4::after {	background-color:#e50065; top:40%; }
#attraction li:nth-child(2) h4::after {	background-color:#75c214; top:40%; }
#attraction li:nth-child(3) h4::after {	background-color:#9c2bc3; left:62%; }
#attraction li:nth-child(4) h4::after {	background-color:#2965ff; left:70%; }
#attraction li:nth-child(5) h4::after {	background-color:#ffac29; left:72%; }
#attraction li:nth-child(6) h4::after {	background-color:#00cdc6; left:64%; }
#attraction li:nth-child(7) h4::after {	background-color:#008cd6; left:66%; }

/* access */
#access        { background:#92c927; color:#FFF; margin-bottom:0; }
#access .inner { padding:40px 20px; }
#access h3 {
	position:relative;
	display:flex; justify-content:center; align-items:center; height:300px; margin-bottom:40px;
}
#access h3::before {
	content:""; position:absolute; top:0; left:50%; transform:translate(-50%,0);
	background:url(/wp-content/uploads/2023/07/accessBg.png)no-repeat center center / contain;
	width:1280px; height:300px; z-index:-1;
}
#access h4     {  }
#access h4 img { display:inline-block; }
#access p      {
	padding:20px 0; width:60%;
	border-top:2px solid #FFF; border-bottom:2px solid #FFF;
}
#access .illustMap {
	width:50%;
	background:url(/wp-content/uploads/2023/07/accessMap.png)no-repeat left center / auto 100%;
}

/* categoryTop */
.categoryTop ul { list-style:none; padding:0; margin:0; }
.categoryTop li { width:450px; margin-bottom:0; }
.categoryTop li:nth-child(n + 3) { margin-top:80px; }
.categoryTop li a { position:relative; display:block; padding-bottom:40px; }
.categoryTop li a::after {
	content:"詳しく見る";
	position:absolute; bottom:0; right:0; padding:0 25px 2px;
	background:url(/wp-content/uploads/2023/07/moreArrow.png)no-repeat bottom center / contain;
	font-size:0.9em;
}
.categoryTop li img { display:block; width:100%; border-radius:40px 40px 0 0; }
.categoryTop h3 { margin-top:15px; }
.categoryTop p  { margin-top:5px; }

/* title */
h2 { font-size:2em; text-align:center; }
h3 { font-size:1.5em; }

/* Nature */
.Nature p { margin-top:30px; }
/* left */
.Nature .left     { width:380px; margin:0; }
.Nature .left img { display:block; width:100%; border-radius:20px; }
/* right */
.Nature .right { width:540px; }
.Nature .right h3      { color:#008cd6; }
.Nature .right h3 span {
	display:inline-block; padding:0 10px; background:#008cd6; margin-bottom:5px;
	color:#FFF; font-size:1.25rem;
}
.Nature .right p     { margin-top:20px; }
.Nature .flexBox + p { margin-top:40px; }

/* Detail */
main.Detail { margin:60px 0 0; }
#DetailHead img { display:block; width:100%; }
#DetailHead h3  {
	display:inline-block; background:#EEE; padding:0 10px; margin:1rem 0;
	border:1px solid #000; color:#FFF; font-size:2.25em;
}
.Enjoy01 #DetailHead h3 { background:#e50065; }
.Enjoy02 #DetailHead h3 { background:#75c214; }
.Gourmet #DetailHead h3 { background:#9c2bc3; }
.Shop #DetailHead h3    { background:#2965ff; }
.Stay #DetailHead h3    { background:#ffac29; }
.Event #DetailHead h3   { background:#00cdc6; }

.Detail h4 { margin-bottom:10px; font-size:2em; }
.Detail .flexBox2    { list-style:none; padding:0; }
.Detail .flexBox2 li { width:460px; margin:0; }
.Detail li:nth-child(n+3) { margin-top:80px; }
.Detail .left  { width:100%; margin-bottom:1em; }
.Detail .right { width:100%; }
.Detail li img { display:block; width:100%; border-radius:20px; }
.Detail p { line-height:2em; }
.Detail .left *:not(:first-child),
.Detail .right *:not(:first-child) { margin-top:10px; }
.Detail .btn a {
	position:relative; display:flex; justify-content:center; align-items:center;
	width:300px; height:4em; margin:auto; border:1px solid #000; border-radius:2em; line-height:1em;
}
.Detail .btn a::before {
	content:""; position:absolute; top:-5px; left:-5px;
	width:100%; height:4em; border-radius:2em; background:#fff100; z-index:-1;
}
.Detail .btn a:hover::before { opacity:.5; }
.Detail .btn a::after { content:">"; padding-left:10px; }
.Detail .map        { width:45%; }
.Detail .map iframe { width:100%; height:320px; }
.Detail .map + div  { width:calc(55% - 2em); }
.Detail .other      { background:#f39800; padding:40px 0; margin:0; color:#FFF; }
.Detail .other a    { text-decoration:underline; word-break:break-all; }
.Detail .other p + p { margin-top:1em; }

/* footer ********** */
footer { background:#fff100; font-size:.9em; position:relative; z-index:1; }
footer .inner { padding:60px 20px; }
footer h2  { width:265px; }
footer nav {
	width:640px; height:200px; padding:10px 0 0 40px;
	border-left:1px solid #505050; border-right:1px solid #505050;
}
footer ul  { flex-direction:column; justify-content:center; height:100%; }
footer li  { width:35%; height:20%; }
footer .at { position:relative; order:6; width:65%; height:100%; padding:0 0 0 40px; }
footer .at::before {
	content:""; position:absolute; top:-10px; left:0;
	border-left:1px solid #505050;
	width:1px; height:200px;
}
footer .at ul { justify-content:flex-start; height:80%; }
footer .at li { width:50%; height:25%; }
footer .at > a { height:20%; }

footer address {
	display:flex; justify-content:center; align-items:center;
	width:100%; padding:60px 0; margin:0 auto; font-size:.95rem;
	background:#FFF;
}
footer address a  { display:inline-block; width:auto; }
footer address em { width:75px; margin-right:20px; }
footer .bnr     {
	display:flex; justify-content:space-between; flex-direction:row;
	width:100%; margin-bottom:60px;
}
footer .bnr li  { width:32%; height:auto; }
footer .bnr img { display:block; width:100%; }
.pagetop { position:fixed; right:50px; bottom:50px; z-index:99; }
.pagetop a { display:-moz-flex; display:flex; -moz-justify-content:center; justify-content:center; -moz-align-items:center; align-items:center; width:66px; height:66px; border-radius:50%; background-color:#220064; }
.pagetop a span { position:relative; font-size:12px; font-weight:500; color:#fff; text-transform:uppercase; padding-top:12px; }
.pagetop a span::after { content:''; position:absolute; top:3px; left:21%; width:14px; height:14px; border-top:1px solid #fff; border-left:1px solid #fff; transform:rotate(45deg); }


/* --------------------------------------------*/

/* clearfix */
.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix { display:inline-block; }
/* ¥*/
* html .clearfix { height:1%; }
.clearfix { display:block; }
/* */
.clearfix:after { content:""; }

/* --------------------------------------------*/

/*------------------------------------------------------------
	レスポンシブ
------------------------------------------------------------*/
#hmb_check, #hmb_btn, #hmb_bg,
.sp { display:none; }

@media (max-width: 768px){
	.sp, #hmb_btn, #hmb_bg { display:inline-block; }
	.pc { display:none; }

	/* hmb_menu *********** */
	#hmb_btn, #hmb_bg { cursor:pointer; }
	#hmb_btn {
		display:block; width:45px; height:40px; margin:0; min-width:20px;
		background:url(/wp-content/uploads/2023/07/hmb_btnOn.svg) no-repeat center / contain;
		/* ボタン 色・アイコン(オフ) */
	}
	#hmb_bg { display:none;　}
	#hmb_content {
		display:block; width:0; height:100vh; overflow:auto;
		position:fixed; top:0; right:0; z-index:100;
		background:#FFF;
		transition:.3s;
	}
	#hmb_check:checked + #hmb_btn {
		background-image:url(/wp-content/uploads/2023/07/hmb_btnOff.svg);
		position:fixed; top:15px; right:5%;
		z-index:10000000;
	} /* ボタン 色・アイコン(オン) */
	#hmb_check:checked ~ #hmb_bg      { opacity:.5; display:block; }
	#hmb_check:checked ~ #hmb_content { opacity:1; width:100%; }
	#hmb_check:checked ~ #hmb_content::before {
		content:""; position:absolute; top:15px; left:5%;
		background:url(/wp-content/uploads/2023/07/OTOBEwonderland.svg)no-repeat center center / contain;
		width:60px; height:60px; 
	}

	/* inner */
	.inner { width:100%; padding-left:5%; padding-right:5%; }

	/* flexBox */
	.flexBox { display:block; }

	/* header ********** */
	header { position:relative; padding:15px 0 20px 0; }
	header:before {
		content:""; position:absolute; bottom:0; left:0;
		background:url(/wp-content/uploads/2023/07/headerPattern.svg)repeat-x bottom / cover;
		width:100%; height:4px;
	}
	header div { width:auto; height:40px; margin:0 0 0 auto; }
	header h1  {
		position:absolute; top:0; left:5%;
		width:280px; max-width:calc(100% - 100px); z-index:1;
	}
	header h1 img { display:block; width:100%; }
	header #hmb_content > ul { padding:80px 5% 0; }
	header ul:not(.at ul) { flex-direction:column; }
	header li:nth-child(n+1) { border:none; }
	header li:not(:first-child) { border-top:1px solid #6a6a6a; }
	header li a { padding:10px; }
	header .at ul {
		display:flex; position:static; top:0; left:0; transform:none;
		width:100%; height:; padding:0;
	}
	header .at ul::before { content:none; }
	header .at li { width:50%; height:25%; border:none; }
	header .at li a { padding:10px; font-size:.9em; }
	header #hmb_content p { display:block; width:50%; margin:40px auto 0; }


	/* mv ********** */
	#mv { height:80vh; }
	#mv .inner { width:100%; padding:0 5%; z-index:1; }
	#mvTop::before, #mvTop::after,
	#mv::before, #mv::after { content:none; }
	#mv h2      { left:5%; width:90%; }
	#mv h2 img  { max-width:100%; max-height:90%; }
	#mv h2 span { min-width:50%; height:60px; }
	#mv em      { width:35%; height:25px; margin:0 60% 0 5%; }
	#mv em img  { max-width:100%; max-height:70%; }
	.Enjoy01 #mv h2 span,
	.Enjoy02 #mv h2 span { min-width:75% }
	.Enjoy01 #mv span.mvText,
	.Enjoy02 #mv span.mvText      { min-width:0; max-width:35%; height:35px; }
	.Enjoy01 #mv span.mvText + em,
	.Enjoy02 #mv span.mvText + em { width:30%; margin:0 5%; }

	.mvWave { left:0; transform:none; }
	.mvWave img { width:50%; }

	/* mvBg 調整 */
	.Nature #mv { background-position:60%; }

	/* main */
	main > section { margin:20px auto 50px; }
	main::before, main::after { content:none; }

	/* topPage */
	.top #mvTop { height:70vh; }
	#mvTop h2 { width:90%; }
	.mvTopWave img { width:100%; }
	.mvTopWave img:nth-child(2) { bottom:100px; }
	/* about */
	#about h3, #about h3::before,
	#about .flexBox p,
	#about .flexBox .right { width:100%; }
	#about .flexBox .left  { margin-bottom:40px; }
	#about h3 { height:150px; margin-bottom:0; }
	#about h3::before { width:100%; height:100%; }
	#about h3 img { width:80%; }

	/* map */
	#map { min-width:auto; }
	#map::after { top:auto; bottom:-1px; /*height:60%;*/ height: 151.5vw; background-size:cover; }
	#map .mapTitle { height:auto; }
	#map .mapTitle h3 { height:150px; margin-bottom:40px; }
	#map .mapTitle h3 img { max-width:40%; }
	#map .mapTitle h3::before { width:100%; height:100%; }
	#map .mapTitle h3::after  { content:none; }
	#map .mapTitle p     { margin:0; }
	#map .mapTitle p img { width:100%; }
	#map .mapTitle p img:nth-child(2) { /*width:80%;*/ width:60%; }
	#map .mapTitle p::before { width:30%; height:40px; top:0%; left:0%; }
	#map .mapTitle p::after,
	#map .inner::after  { content:none; }
	#map .mapList { height:auto; padding-bottom:100%; /*margin:40px 0 0;*/ margin:-16vw 0 0; }

	/* ↓↓↓ カモメ アニメーション ↓↓↓ */
	@keyframes swayAnime02 {
		0%, 100% { transform:rotate(-10deg); top:115%; left:0%; }
		50% { transform:rotate(10deg); top:110%; left:0%; }
	}
	/* ↑↑↑ カモメ アニメーション ↑↑↑ */

	/* attraction */
	#attraction h3::before,
	#attraction > .inner::before,
	#attraction > .inner::after { content:none; }
	#attraction h3 { height:auto; }
	#attraction h3 img { width:100%; }
	#attraction { padding-bottom:40px; margin-top: -20vw;}
	#attraction ul { padding:0 5%; }
	#attraction li::before { content:none; }
	#attraction li {
		height:auto; border:2px solid #FFF;
		border-radius:20px; box-shadow:5px 5px 5px rgba(0, 0, 0, .5);
	}
	#attraction li:first-child { border-top:2px solid #FFF; }
	#attraction li:not(:first-child) { margin-top:20px; }
	#attraction h4 img { display:block; width:100%; padding:20px 5%; }
	#attraction li:nth-child(n + 1) h4::after { content:none; }

	/* access */
	#access h3     { width:50%; height:auto;  margin:auto;}
	#access h3 img { width:100%; }
	#access h3::before { content:none; }

	#access h4     { width:80%; margin:0 auto 20px; }
	#access h4 img { width:100%; }
	#access p      { width:100%; text-align:center; }
	#access iframe { width:100%; order:1; }
	#access .illustMap {
		width:100%; padding-top:100%;
		background-image:url(/wp-content/uploads/2023/07/accessMap_sp.png);
		background-size:cover;
	}
	#access .inner + .flexBox { display:flex; flex-wrap:wrap; } 

	/* categoryTop */
	.categoryTop li { width:100%; }
	.categoryTop li:not(:first-child) { margin-top:40px; }
	
	/* Nature */
	.Nature .left, .Nature .right { width:100%; }
	.Nature .left { margin-bottom:20px; }
	.Nature .right h3 { text-align:center; }

	/* Detail */
	#DetailHead { margin-top:20px; }
	#mvDetail .inner div { width:100%; height:250px; }
	.Detail li:nth-child(n+2) { margin-top:80px; }
	.Detail .left,
	.Detail .right { width:100%; }
	.Detail .left  { margin-bottom:20px; }
	.Detail .btn a { width:70%; }

	.Detail .map { width:100%; margin-bottom:1em; }
	.Detail .map + div { width:100%; }

	/* footer ********** */
	footer        { font-size:.5em; }
	footer .inner { padding:30px 5%; }

	footer h2  { width:50%; margin:0 auto 20px; }
	footer nav { width:100%; height:120px; padding-left:2%; font-size:1.5em; letter-spacing:-1px; }
	footer li  { width:40%; }
	footer .at         { padding-left:2%; width:60%; }
	footer .at::before { height:120px; }
	footer .at li                  { width:60%; }
	footer .at li:nth-child(n + 5) { width:40%; }

	footer address        { flex-direction:column; }
	footer address em     { margin:auto; }
	footer address strong { display:inline-block; margin:10px 0 40px; font-size:1.5rem; }
	footer address p      { text-align:center; font-size:.9em; }
	footer small          { display:inline-block; margin-top:20px; }
	footer .bnr    { flex-wrap:wrap; }
	footer .bnr li { width:100%; }
	footer .bnr li:not(:first-child) { margin-top:20px; }

	.pagetop { right:2.667vw; bottom:2.667vw;	}
	.pagetop a { width:16vw; height:16vw;	}
	.pagetop a span::after { width:2.6666666667vw; height:2.6666666667vw;	}
	.pagetop a span { font-size:2.4vw; }

	.swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets {
		bottom: 35% !important;
	}

}