@charset "UTF-8";
/* SP CSS */
@media only screen and (max-width: 768px) {
/*LAYOUT------------------*/
	section {
		padding: 0 5%;
		width: 100%;
	}
	.pc {
	display: none;
	}
	.sp {
	display: block;
	}
	p br,
	dd br {
		display: none;
	}
	#glamping h2 {
		font-size: 20px;
	}
/*-----------------
HEADER
------------------*/
	header #header-R nav {
		display: none;
	}
	#header-L {
		width: 20vw;
	}
/*-----------------
FOOTER
------------------*/
	#footer-up nav {
		display: none;
	}
	#footer-up img {
    width: 30%;
	}
	#footer-down p {
		font-size: 12px;
		width: 80%;
	}
	#footer-down span {
		font-size: 14px;
	}
	#footer-down .sp{
		display: none;
	}

/*-----------------
TOP
------------------*/
.staynavi{
width:100%;
margin:50px auto 50px;
}

	h2 {
		padding-bottom: 0;
	}
	span {
		font-size: 16px;
	}
	.w640 {
		width: 100%;
		font-size: 16px;
	}
	.hover .text1, .hover .text2, .hover .text3 {
		display: none;
	}
	#video-wrap {
		position: relative;
	}
	#video-wrap video {
		width: 100%;
		margin-top: 0;
		margin-bottom: 0;
	}
	#dot {
		display: none;
	}
	#what content.flex {
		flex-wrap: wrap;
	}
	#what-L {
		max-width: 100%;
		width: 100%;
		padding-left: 0;
		height: 255px;
	}
	#what-L h2 {
		padding-top: 0.5em;
		padding-bottom: 0.5em;
	}
	#what-L p {
		font-size: 16px;
	}
	#what-R {
		max-width: 100%;
		width: 100%;
	}
	#glamping {
		padding-top: 2em;
		padding-bottom: 2em;
		margin-top: 2em;
	}
	#glamping div.slider {
		display: none;
	}
	#glamping ul.flex {
		flex-wrap: wrap;
	}
	#glamping ul.flex a {
		width: 48%;
		margin-bottom: 2%;
	}
	#meal {
		padding-top: 2em;
	}
	#luna dt {
		font-size: 24px;
	}
	#luna dd {
		font-size: 16px;
	}
	#luna .luna-box {
		width: 100%;
		bottom: -1em;
		position: static;
	}
	#meal {
		padding-bottom: 2em;
	}
	#meal .stand {
		margin-top: 1em;
		margin-bottom: 1em;
	}
	#luna .flex {
		flex-wrap: wrap;
	}
	#luna .flex li {
		width: 48%;
	}
	#meal .flex {
		justify-content: space-between;
		flex-wrap: wrap;
	}
	#luna p {
		font-size: 16px;
	}
	#luna button {
		width: 40%;
	}
	#meal-L {
		width: 100%;
	}
	#meal-R {
		width: 100%;
		padding: 0;
		padding-top: 2em;
		height: 240px;
	}
	#meal-R p {
		font-size: 16px;
	}
	#meal button {
		bottom: 0;
	}
	#fac {
		padding-top: 2em;
		padding-bottom: 2em;
	}
	#fac-up .flex {
		flex-wrap: wrap;
	}
	#fac .fac-text h2 {
		font-size: 28px;
	}
	#fac .fac-text h3 {
		font-size: 14px;
	}
	#fac .fac-text p {
		font-size: 16px;
	}
	#fac .fac-text button {
		left: 14%;
		width: 60%;
	}
	#fac .fac-img {
		order: 1;
		width: 100%;
	}
	#fac .fac-text {
		order: 2;
		width: 100%;
		padding: 1.2em;
		height: auto;
	}
	#fac-down ul {
		display: none;
	}
	#spot {
		padding-top: 2em;
		padding-bottom: 2em;
	}
	#spot .flex {
		flex-wrap: wrap;
	}
	#spot-L {
		width: 100%;
	}
	#spot-R {
		width: 100%;
	}
	#spot dt {
		font-size: 16px;
	}
	#spot dd {
		font-size: 16px;
	}
	#spot-list button {
		width: 40%;
	}
	#map {
		padding-bottom: 2em;
	}
	#map .flex {
		flex-wrap: wrap;
		height: auto;
	}
	.map-L {
		width: 100%;
		height: 40px;
	}
	.map-R {
		width: 100%;
	}
	#map dt {
		font-size: 16px;
	}
	#map dd {
		font-size: 16px;
	}
	#love-top, #tuktuk-top {
		padding-top: 2em;
		padding-bottom: 2em;
	}
	#love-top .content-img img, #tuktuk-top .content-img img {
		width: 100%;
	}
	#love-top p, #tuktuk-top p {
		width: 100%;
	}
	#sight {
		padding-top: 2em;
		padding-bottom: 2em;
	}
	#sight content {
		padding-bottom: 0;
		margin-bottom: 0;
	}
	#sight button {
		margin-top: 1em;
		width: 40%;
	}
	#map {
		padding-top: 2em;
	}
	#spot-L dd {
		width: 100%;
	}
	#sight .flex dl {
		width: calc(96% / 2);
	}
	#sight .flex dt {
		font-size: 14px;
	}
	#sight .flex dd {
		font-size: 12px;
	}
	#sub-mov {
		padding-left: 0;
		padding-right: 0;
	}
#acc-map {
margin-top: 4em;
margin-bottom: 2em;
}
#healing {
margin-top: 2em;
margin-bottom: 2em;
}
#model-c {
margin-top: 2em;
margin-bottom: 2em;
}
#acc-map h2,
#healing h2,
#model-c h2 {
font-size: 28px;
}
/*-----------------
GLAMPING
------------------*/
#glamping_body .room_P {
padding-left: 0 ;
}
#glamping_body .room_P video {
width: 100%;
}
#glamping_body content .flex {
flex-wrap: wrap;
}
#glamping_body content .flex-text {
width: 100%;
}
#glamping_body content .flex-img {
width: 100%;
}
	.sub-v {
		padding-top: 2em;
	}
	#glamping_body #moon content,
	#meal_body #dinner content {
    max-width: 95%;
    margin-right: auto;
	}
	#glamping_body .room_P img,
	#meal_body .room_P img {
	width: 100%;
	}
	.room_P .flex {
	flex-wrap: wrap;
	}
	.glamping-L, .glamping-R {
		width: 100%;
	}
	.glamping-L {
		display: none;
	}
	#glamping_body .glamping-R {
		padding: 0;
	}
	#glamping_body .glamping-R p {
	text-align: left;
	width: 100%;
	padding-bottom: 1em;
	font-size: 16px;
	}
	#glamping_body .glamping-R table {
		width: 100%;
	}
	#glamping_body .glamping-R th {
	padding: 1em;
		font-size: 16px;
	}
	#glamping_body .glamping-R td {
		padding: 1em;
		font-size: 16px;
	}
	#glamping_body .flex-text {
		width: 96%;
		margin-bottom: 0.5em;
	}
	#glamping_body .f-box01 {
		order: 2;
	}
	#glamping_body .f-box02 {
		order: 1;
	}
	#glamping_body .plice {
		width: 100%;
		padding-right: 0;
	}
	#glamping_body .plice th {
		font-size: 14px;
		width: calc(100% / 3);
	}
	#glamping_body .plice td {
		padding: 0.95em;
		width: calc(100% / 3);
	}
/*-----------------
FACILITY
------------------*/
	#fac_body {
		width: 95%;
	}
	#fac_body section {
		width: 100%;
		padding: 2em 0;
	}
	#fac_body #shoprental {
		padding-bottom: 4em;
	}
#shoprental h2,
#bar h2 {
font-size: 28px;
}
#bar .flex,
#dogrun .flex {
flex-wrap: wrap;
}
#bar #pancake,
#dogrun #room {
width: 100%;
text-align: center;
}
#bar #pancake img,
#dogrun #room img {
width: 80%;
}
#bar #menu,
#dogrun #menu {
width: 100%;
}
/*-----------------
MEAL
------------------*/
	#meal_body .meal-box h2 {
		font-size: 14px;
	}
	#meal_body .menu {
		flex-wrap: wrap;
	}
	#meal_body .menu-L,
	#meal_body .menu-C,
	#meal_body .menu-R {
		width: 100%;
	}
	#meal_body ul.option {
		flex-wrap: wrap;
	}
	#meal_body ul.option li {
		width: calc(100% / 2);
	}
/*-----------------
TUKTUK
------------------*/
	#tuktuk content h5 {
		font-size: 20px;
	}
	.attention ul {
		font-size: 16px;
		text-align: left;
	}
	.attention ul li {
		padding-top: 1em;
	}
/*-----------------
SIGHTSEEING
------------------*/
	.sight-box {
		flex-wrap: wrap;
	}
	.sight-img,
	.sight-text {
		width: 100%;
	}
/*-----------------
ASK
------------------*/
	#ask .accordion_one {
		width: 100%;
	}
/*-----------------
CONTACT
------------------*/
	#contact content table {
		width: 100%;
		table-layout: fixed;
		word-break: break-all;
		word-wrap: break-all;
	}
	#contact content table tbody {
		width: 100%;
	}
	#contact content table tr {
		width: 100%;
	}
	#contact content table th {
		display: block;
		width: 100%;
	}
	#contact content table td {
		display: block;
		width: 100%;
		padding-left: 0;
		margin-bottom: 1em;
	}
/*-----------------
ORDER
------------------*/
	.order span, .order tel {
		display: none;
	}
	.order content {
		background-position: left 0;
		min-height: auto;
	}
	.order content div {
		width: 50%;
		margin-left: auto;
    	margin-right: 15px;
	}
	.order p {
		font-size: 16px;
	}
#reserve {
top: 78%;
}
#supplies .flex {
flex-wrap: wrap;
flex-direction: column-reverse;
}
#supplies .flex div {
width: 100%;
}
#supplies .flex img {
margin-bottom: 1em;
}
.Ticket button {
	width:80%;
}
.memberblog button {
	width:80%;
    margin-top:1em;
    margin-bottom:2em;
}
#contact content table th {
    padding:0.7em 1em;
    margin-bottom:10px;
}
#contact content table th span{
    line-height:1em;
}
table#calendar {
    width: 1000px;
}
.calendar_button {
    display: block;
    margin-bottom:4em;
}
.calendar_button li {
    width: 80%;
    margin-top:2em;
}
}
/*-----------------
MENU
------------------*/
.menu-nav content.flex {
	flex-wrap: wrap;
	padding-top: 2em;
	justify-content: flex-start;
}
.menu-nav content.flex div dl {
	width: 100%;
}
.menu-nav content.flex div dt {
	font-size: 16px;
	width: 100%;
}
.menu-nav content.flex div dd {
	font-size: 14px;
	width: 100%;
}
.menu50 {
	width: 50%;
	padding-left: 1em;
}
.menu100 {
	width: 100%;
	padding-left: 1em;
}
.menu100 p {
	display: none;
}
#order-F {
	display: none;
}