@charset "utf-8";

@media only screen and (min-width: 0px) and (max-width: 640px) {

/* ────────────────────── *
 *                                              *
 * スタジオ一覧                                 *
 *                                              *
 * ────────────────────── */

#studio {
	padding: 6.25% 0;
}
#studio .inner {
	width: 93.75%;
}
#studio p#mainvisual {
    margin-bottom: 20px;
}
#studio #all-free {
  	-webkit-box-orient: vertical;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: column;
  	flex-direction: column;
    width: 100%;
    padding: 5%;
    margin: 0 auto 6.666666666666667%;
}
#studio #all-free .right {
    font-size: 12px;
    width: 100%;
    margin-bottom: 20px;
}
#studio #all-free .right h3 {
    font-size: 26px;
    text-align: center;
    margin-bottom: 20px;
}
#studio #all-free .right p {
    text-shadow: 1px 1px 1px #fff, 1px 1px 1px #fff, 1px 1px 1px #fff;
}
#studio #all-free .left {
    width: 100%;
}
#studio #all-free .left ul li {
    font-size: 10px;
    padding: 0px;
}
#studio #all-free .left ul li:before {
    width: calc(100% - 12px);
    height: calc(100% - 12px);
    left: 5px;
    top: 5px;
}
#studio #all-free .left ul li em {
    font-size: 16px;
}
#studio #all-free .left ul li .new {
    width: 70px;
    height: 70px;
    right: -10px;
    bottom: -5px;
}
#studio #all-free .left ul li .new > span {
    width: 70px;
    height: 70px;
}
#studio #all-free .left ul li a {
    padding: 20px 20px 20px 40px;
    position: relative;
}
#studio #all-free .left ul li a:before {
    content: '▶';
    position: absolute;
    left: 18px;
    top: 24px;
    font-size: 10px;
}

#studio p.text {
	font-size: 14px;
	line-height: 1.5;
	margin-bottom: 15px;
}
#studio ul#list {
	font-size: 16px;
    width: 100%;
}
#studio ul#list li {
	width: 48.333333333333336%;
	margin-left: 3.3333333333333335%;
	margin-bottom: 3.3333333333333335%;
}
#studio ul#list li:nth-child(2n+1) {
	margin-left: 3.3333333333333335%;
}
#studio ul#list li:nth-child(even) {
	margin-left: 0;
}
#studio ul#list li:first-child {
    float: none;
    margin: 0 auto 3.3333333333333335%;
}
#studio ul#list li a {
    height: 55px;
	padding: 10px 5px;
}
#studio ul#list li a > span {
	font-size: 10px;
	display: block;
}
#studio ul#list li a .new {
    font-size: 10px;
    width: 60px;
    height: 60px;
    right: -40px;
    top: -10px;
}
#studio ul#list li a .new > span {
    width: 60px;
    height: 60px;
}
.bx-wrapper .bx-prev {
	left: -15px;
	-webkit-background-size: 10px auto;
	background-size: 10px auto;
}
.bx-wrapper .bx-next {
	right: -15px;
	-webkit-background-size: 10px auto;
	background-size: 10px auto;
}
.bx-wrapper .bx-controls-direction a {
	top: 100px;
	width: 10px;
	height: 15px;
}
#studio .aerial {
	padding: 2.666666666666667%;
	border-radius: 8px;
}
#studio .aerial p.photo {
	float: none;
	margin-bottom: 3.3333333333333335%;
}
#studio .aerial dl {
	-webkit-background-size: 48px 48px;
	background-size: 48px 48px;
	width: 95%;
	min-height: 48px;
	padding-top: 0px;
	margin: 0 auto 10px;
}
#studio .aerial dl dt {
	font-size: 30px;
	margin-bottom: 5px;
}
#studio .aerial dl dd {
	font-size: 11px;
}
#studio .aerial p.btn-aerial-reserve {
	width: 95%;
	margin: 0 auto 3.3333333333333335%;
}

/* ────────────────────── *
 *                                              *
 * ポイント                                     *
 *                                              *
 * ────────────────────── */

#point {
	padding: 6.25% 0;
	overflow: hidden;
}
#point .inner {
	width: 93.75%;
}
#point h3 {
    font-size: 0;
    width: 46.666666666666664%;
    margin: 0 auto 20px;
}
#point ul {
	font-size: 12px;
	line-height: 1.35;
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}
#point ul li {
	width: 48.333333333333336%;
    min-height: 26.80851063829787vw;
    padding: 6.25vw 6.25vw 0;
	margin-left: 3.3333333333333335%;
	margin-bottom: 6.666666666666667%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#point ul li:nth-child(odd) {
	margin-left: 0;
}

/* ────────────────────── *
 *                                              *
 * 設備                                         *
 *                                              *
 * ────────────────────── */

#equipment {
	padding: 6.25% 0;
}

#equipment #drone {
    width: 93.75%;
    margin: 0 auto 10%;
}
#equipment #drone iframe {
    width: 100%;
    height: 52.734375vw;
}
#equipment h3 {
	width: 55.333333333333336%;
    margin: 0 auto 20px;
}

#equipment .inner {
	width: 93.75%;
}
#equipment .inner .block {
	margin-bottom: 20%;
  	-webkit-box-orient: vertical;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: column;
  	flex-direction: column;
}
#equipment .inner .block.rv {
  	-webkit-box-orient: vertical;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: column;
  	flex-direction: column;
}
#equipment .inner .block figure {
    width: 100%;
}
#equipment .inner .block .flexitem {
    width: 100%;
}
#equipment .inner .block h4 {
    font-size: 0;
	padding-bottom: 10px;
}
#equipment .inner .block figure {
	text-align: center;
	margin-bottom: 15px;
}
#equipment .inner .block .flexitem dl dt {
	font-size: 14px;
	margin-bottom: 10px;
}
#equipment .inner .block .flexitem dl dd {
	font-size: 12px;
	line-height: 1.5;
}
#equipment p#free-join {
    width: 93.25%;
    margin: 0 auto 6.666666666666667vw;
}

/* ────────────────────── *
 *                                              *
 * アクセス                                     *
 *                                              *
 * ────────────────────── */

#access {
	padding: 6.25% 0 3.125%;
}
#access .inner {
	width: 93.75%;
}
#access h3 {
	font-size: 0;
    width: 24.583333333333332%;
    margin: 0 auto 20px;
}
#access p#text-access {
	font-size: 12px;
	width: auto;
	padding: 0 15px 5px;
	margin-bottom: 20px;
	border-bottom: 2px solid #86c967;
}
#access #gmap {
	height: 300px;
	margin-bottom: 15px;
}
#access p#text-gmap {
	font-size: 14px;
	margin-bottom: 30px;
}
#access h4 {
	font-size: 16px;
	margin-bottom: 20px;
}
#access h4 span {
	font-size: 12px;
}

/* スライダー */
#access #sliderWrap {
    width: 230px;
    margin: 0 auto;
}
#access .slider {
	float: none;
	margin-bottom: 30px;
}
#access .slider#slider-left {
	float: none;
}
#access .slider#slider-right {
	float: none;
}
#access .slider .slider-js {
	font-size: 12px;
}
#access .slider .slider-js ul li img {
	margin-bottom: 10px;
}

/* 概要 */
#access #outline {
    background: url("../../program/image/bg-outline.png") no-repeat center top / cover;
    float: none;
    width: 100%;
    padding: 8.333333333333332%;
}
#access #outline:after {
    content: "";
    background: url("../../program/image/bg-outline-after.png") no-repeat center bottom / 100% auto;
    width: 93.75vw;
    height: 6.18125vw;
}
#access #outline h5 {
    font-size: 16px;
    margin: 0 auto 10px;
}
#access #outline table {
	font-size: 12px;
}
#access #outline table th {
	width: 65px;
	padding: 10px 0;
}
#access #outline table td {
	padding: 10px 0;
}
#access #outline table td span.txt-20px {
	font-size: 10px!important;
}

/* ────────────────────── *
 *                                              *
 * スケジュールへ                               *
 *                                              *
 * ────────────────────── */

#goto-schedule {
	letter-spacing: -1px;
	width: auto;
	padding: 0 3.125% 3.125%;
}
#goto-schedule div {
	font-size: 14px;
    margin: 0 auto 10px;
}
#goto-schedule p {
	font-size: 14px;
	line-height: 1.3;
	display: block;
}
#goto-schedule p:after {
    width: calc(100% - 6px);
    height: calc(100% - 6px);
    left: 2px;
    top: 2px;
}
#goto-schedule p a {
	padding: 10px;
}
#goto-schedule p a span {
	-webkit-background-size: 17px auto;
	background-size: 17px auto;
	width: 500px;
	height: auto;
	padding-left: 20px;
}

/* ────────────────────── *
 *                                              *
 * オープン                                     *
 *                                              *
 * ────────────────────── */

#open {
    padding: 0 0 6.25%;
}
#open p#open-photo {
    margin: 0 auto 6.25%;
}
#open p#open-photo img {
    width: 100%;
    max-width: none;
}
#open .inner {
    background: none;
    width: 100%;
}
.yabacho#open .inner {
    background: none;
    width: 100%;
}
#open .inner p {
    text-align: center;
    width: 86.25%;
    margin: 0 auto;
}
#open-campaign {
    padding: 6.25% 0;
}
#open-campaign .inner {
    width: 93.75%;
}

/* ────────────────────── *
 *                                              *
 * 入会時必要                                   *
 *                                              *
 * ────────────────────── */

#need {
	padding: 6.25% 0;
}
#need #about {
	font-size: 14px;
	width: 93.75%;
	margin: 0 auto 6.25%;
	padding: 4.6875%;
	box-shadow: none;
}
#need #about h3 {
	font-size: 20px;
	line-height: 1.5;
	margin-bottom: 15px;
}
#need #about table {
	font-size: 12px;
	line-height: 1.5;
	width: 100%;
	margin: 0 auto;
	border-top: 1px solid #613416;
	border-left: 1px solid #613416;
}
#need #about table th {
	font-size: 12px;
	line-height: 1.3;
	width: 8em;
	padding: 8px;
	border-bottom: 1px solid #613416;
	border-right: 1px solid #613416;
}
#need #about table td {
	padding: 8px;
	border-bottom: 1px solid #613416;
	border-right: 1px solid #613416;
}

#need .inner {
	width: 93.75%;
	padding: 15px;
	border: 3px solid #86c967;
}
#need .inner h4 {
	font-size: 16px;
}
#need .inner ul li {
	font-size: 14px;
	line-height: 1.5;
	padding-left: 20px;
	margin-bottom: 10px;
}
#need .inner ul li:before {
	font-size: 10px;
	top: 3px;
}
#need .inner ul li .txt-12px {
	font-size: 10px!important;
}
#need .inner ul li .txt-16px {
	font-size: 12px!important;
}
#need .inner ul li .txt-18px {
	font-size: 14px!important;
}
#need .inner ul li strong {
	font-size: 18px;
}
#need .inner ul li a {
	font-size: 12px;
}

#yabacho-notice {
    font-size: 11px;
    line-height: 1.5;
    width: 90%;
    padding: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/* ────────────────────── *
 *                                              *
 * ロウリュ                                     *
 *                                              *
 * ────────────────────── */

#loyly {
    height: 62.5vw;
    min-height: 200px;
}

.schedule {
    width: 93.75%;
    margin: 0 auto 40px;
}
.schedule p {
	width: 700px;
}
.schedule h4 {
    font-size: 16px;
    margin:0 auto 15px;
}
.schedule table {
    font-size: 10px;
	width: 700px;
}
.schedule table th {
    padding: 2px;
}
.schedule table td {
	width: 80px;
    padding: 2px;
    white-space: normal;
}
.schedule table tr.cell2 td { padding-top: 0; }
.schedule table td.noon { width: 50px; }
.schedule .scroll{
overflow: auto; /*tableをスクロールさせる*/
white-space: nowrap; /*tableのセル内にある文字の折り返しを禁止*/
}
.schedule .scroll::-webkit-scrollbar{ /*tableにスクロールバーを追加*/
 height: 5px;
}
.schedule .scroll::-webkit-scrollbar-track{ /*tableにスクロールバーを追加*/
 background: #F1F1F1;
}
.schedule .scroll::-webkit-scrollbar-thumb { /*tableにスクロールバーを追加*/
 background: #BCBCBC;
}

#temporary-close {
    font-size: 12px;
    line-height: 1.5;
		width: 93.75%;
    padding: 5%;
    margin-bottom: 10%;
    border: 1px solid #ccc;
}
#temporary-close h4 {
    font-size: 14px;
}
#temporary-close .scroll {
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
}
#temporary-close .scroll table {
    width: 640px;
    margin-bottom: 10px;
}

}