@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/* --- Google Fontsの読み込み --- */
/* これらはテーマのヘッダー（header.phpなど）で読み込むか、CSSの先頭に記述します */
@import url(https://fonts.googleapis.com/css?family=Arvo:400,700);
@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,700);
@import url(https://fonts.googleapis.com/css?family=Oswald:400,700);


/* --- 全体の基本フォントと文字色 --- */
/*
 * bodyセレクタは、新しいテーマで既に多くの指定がされている場合があります。
 * そのため、必要なプロパティ（font-familyやcolorなど）だけを
 * 新しいテーマのbody指定に追記・上書きするのがおすすめです。
*/
body {
    /* フォントはヒラギノなどを優先し、なければ游ゴシック、メイリオなどを指定 */
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", "Roboto", sans-serif;

    /* 基本となる文字のサイズ、行間、色 */
    font-size: 15px;
    line-height: 1.7;
    color: #504f4f;
}

/* 共通ユーティリティ */
.mgReset {
	margin: 0px !important;
}

/* ボタン */
.button {
	position: relative;
	display: inline-block;
	padding: 1em 4em;
	border: 2px solid;
	text-align: center;
	text-decoration: none;
	transition: all .3s;
	font-weight: bold;
	letter-spacing: 2px;
}
.button::after {
	content: '';
	width: 12px;
	height: 12px;
	border: 0px;
	-ms-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	position: absolute;
	top: 45%;
	right: 15px;
	margin-top: -4px;
	transition: all .3s;
}
.int-btn {
	padding: 1em 4em !important;
	background-color: #2ea9df;
	color: #FFFFFF;
	font-size: 14px;
	min-width: 230px;
	border-color: #2ea9df;
}
.int-btn-green {
	padding: 1.1em 4em !important;
	background-color: #01D757;
	color: #FFFFFF;
	font-size: 14px;
	min-width: 230px;
	border-color: #01D757;
}
.int-btn::after, .int-btn-green::after {
	border-top: solid 2px #ffffff;
	border-right: solid 2px #ffffff;
}
.int-btn:hover {
	background: none;
	color: #2ea9df;
}
.int-btn-green:hover {
	background-color: #ffffff;
	color: #01D757;
}
.main-catch-box .int-btn-rvs {
	background: rgba(255,255,255,0.5);
}
.int-btn-rvs {
	padding: 1em 4em !important;
	background: rgba(255,255,255,1.0);
	color: #2ea9df;
	font-size: 14px;
	min-width: 230px;
	border-color: #2ea9df;
}
.int-btn-rvs::after {
	border-top: solid 2px #2ea9df;
	border-right: solid 2px #2ea9df;
}
.int-btn-rvs:hover {
	background-color: #2ea9df;
	color: #ffffff;
	border-color:#ffffff;
}
.int-btn-rvs:hover::after {
	border-top: solid 2px #ffffff;
	border-right: solid 2px #ffffff;
}
.int-btn-gray:hover {
	background-color: #2c2c2c !important;
}
.int-btn:hover::after {
	border-top: solid 2px #2ea9df;
	border-right: solid 2px #2ea9df;
}
.int-btn-green:hover::after {
	border-top: solid 2px #01D757;
	border-right: solid 2px #01D757;
}
.btn-box {
	display: flex;
	justify-content: center;
	margin: 40px 0 10px;
	text-align: center;
}
.btn-box p {
	margin: 0 15px;
}

/* CLUB
------------------------------------------------------------*/
.box-club-text .name {
	font-weight: bold;
	text-align: center;
	color:#fff;
	background-color: #2ea9df;
	border-radius: 12px;
	margin:4px auto 10px;
}

/* ACCESS
------------------------------------------------------------*/
.shopinfo-box li.name {
	font-family: 'Oswald';
	font-size: 13px;
	font-weight: bold;
	color:#2ea9df;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
/* --- Google Fontsの読み込み --- */
/* これらはテーマのヘッダー（header.phpなど）で読み込むか、CSSの先頭に記述します */
@import url(https://fonts.googleapis.com/css?family=Arvo:400,700);
@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,700);
@import url(https://fonts.googleapis.com/css?family=Oswald:400,700);


/* --- 全体の基本フォントと文字色 --- */
/*
 * bodyセレクタは、新しいテーマで既に多くの指定がされている場合があります。
 * そのため、必要なプロパティ（font-familyやcolorなど）だけを
 * 新しいテーマのbody指定に追記・上書きするのがおすすめです。
*/
body {
    /* フォントはヒラギノなどを優先し、なければ游ゴシック、メイリオなどを指定 */
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", "Roboto", sans-serif;

    /* 基本となる文字のサイズ、行間、色 */
    font-size: 15px;
    line-height: 1.7;
    color: #504f4f;
}

}

/* CLUB
------------------------------------------------------------*/
.box-club-text .name {
	font-weight: bold;
	text-align: center;
	color:#fff;
	background-color: #2ea9df;
	border-radius: 12px;
	margin:4px auto 10px;
}

/* ACCESS
------------------------------------------------------------*/
.shopinfo-box li.name {
	font-family: 'Oswald';
	font-size: 13px;
	font-weight: bold;
	color:#2ea9df;
}

/*834px以下*/
@media screen and (max-width: 834px){
/* --- Google Fontsの読み込み --- */
/* これらはテーマのヘッダー（header.phpなど）で読み込むか、CSSの先頭に記述します */
@import url(https://fonts.googleapis.com/css?family=Arvo:400,700);
@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,700);
@import url(https://fonts.googleapis.com/css?family=Oswald:400,700);


/* --- 全体の基本フォントと文字色 --- */
/*
 * bodyセレクタは、新しいテーマで既に多くの指定がされている場合があります。
 * そのため、必要なプロパティ（font-familyやcolorなど）だけを
 * 新しいテーマのbody指定に追記・上書きするのがおすすめです。
*/
body {
    /* フォントはヒラギノなどを優先し、なければ游ゴシック、メイリオなどを指定 */
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", "Roboto", sans-serif;

    /* 基本となる文字のサイズ、行間、色 */
    font-size: 15px;
    line-height: 1.7;
    color: #504f4f;
}

}

/* CLUB
------------------------------------------------------------*/
.box-club-text .name {
	font-weight: bold;
	text-align: center;
	color:#fff;
	background-color: #2ea9df;
	border-radius: 12px;
	margin:4px auto 10px;
}

/* ACCESS
------------------------------------------------------------*/
.shopinfo-box li.name {
	font-family: 'Oswald';
	font-size: 13px;
	font-weight: bold;
	color:#2ea9df;
}

/*480px以下*/
@media screen and (max-width: 480px){
/* --- Google Fontsの読み込み --- */
/* これらはテーマのヘッダー（header.phpなど）で読み込むか、CSSの先頭に記述します */
@import url(https://fonts.googleapis.com/css?family=Arvo:400,700);
@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,700);
@import url(https://fonts.googleapis.com/css?family=Oswald:400,700);


/* --- 全体の基本フォントと文字色 --- */
/*
 * bodyセレクタは、新しいテーマで既に多くの指定がされている場合があります。
 * そのため、必要なプロパティ（font-familyやcolorなど）だけを
 * 新しいテーマのbody指定に追記・上書きするのがおすすめです。
*/
body {
    /* フォントはヒラギノなどを優先し、なければ游ゴシック、メイリオなどを指定 */
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", "Roboto", sans-serif;

    /* 基本となる文字のサイズ、行間、色 */
    font-size: 15px;
    line-height: 1.7;
    color: #504f4f;
}

}
/* CLUB
------------------------------------------------------------*/
.box-club-text .name {
	font-weight: bold;
	text-align: center;
	color:#fff;
	background-color: #2ea9df;
	border-radius: 12px;
	margin:4px auto 10px;
}

/* ACCESS
------------------------------------------------------------*/
.shopinfo-box li.name {
	font-family: 'Oswald';
	font-size: 13px;
	font-weight: bold;
	color:#2ea9df;
}

/* CONTACT FORM 7
------------------------------------------------------------*/
.contact-table th .require {
	padding: 1px 7px;
	background-color: #2ea9df;
	color: #FFFFFF;
	font-size: .78em;
	border-radius:12px;
	letter-spacing: 1px;
	float: right;
}
.contact-table th {
	width: 33% !important;
	font-weight: 700;
}
.contact-table td {
	line-height: 1.6em !important;
}
.contact-table td .add {
	margin-top:6px;
	font-size:.85em;
	line-height:1.4em;}
.contact-table td .add em {
	font-size:1.1em;
	font-weight:bold;
	display:block;
	color:#fd8185;}

/* FORM INPUT STYLES */
input[type="text"], textarea, input[type="number"], input[type="email"], input[type="tel"], select {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	box-sizing: border-box;
	vertical-align: middle;
	height: 42px;
	padding: 1px 5px;
	border: 1px solid #d4d4d7;
	border-radius: 6px;
	font-size: 100%;
	color: #555555;
	background: #fcfcfc;
	-moz-box-shadow: inset 1px 3px 9px -6px rgba(0,0,0,0.5);
	-webkit-box-shadow: inset 1px 3px 9px -6px rgba(0, 0, 0, 0.5);
	box-shadow: inset 1px 2px 9px -6px rgba(0,0,0,0.5);}
input[type="text"]:focus, textarea:focus, input[type="number"]:focus, input[type="email"]:focus {
	box-shadow: 0 0 0px #1abc9c;
	background:#F3FBCE;
	border:1px solid #75a948;}

/* TEXT SIZE CLASSES */
.text-ssmall {
	font-size: .7em !important;
}
.text-small {
	font-size: .85em !important;
}
.text-medium {
	font-size: 1.3em !important;
}
.text-large {
	font-size: 1.65em !important;
}
.text-xlarge {
	font-size: 2em !important;
}
.text-xxlarge {
	font-size: 3em !important;
}

/* BUTTON FONT SIZES */
.int-btn, .int-btn-rvs, .int-btn-green {
	font-size: 14px;
}
.int-btn-sp-telephone {
	font-size: 1.3em;
	font-family: 'Roboto Slab';
}
.access-btn-box a {
	font-size: 1.2em;
}
.form-send-btn {
	font-size: 14px;
}

/* CONTENT FONT SIZES */
.contents-midashi {
	font-size: 1.7em;
	margin-bottom: 40px;
}
.contents-text {
	font-size:.95em;
	width:74%;
}
.contents-text strong {
	font-size: 1.4em;
	font-weight: bold;
	display: block;
	margin: 13px 0;
}
.main-catch-box h2 p {
	font-size: 1.4em;
	font-weight: bold;
}
.main-catch-box p.txt {
	font-size: .8em;
	font-weight: normal;
	margin-bottom: 25px;
}

/* FLEX LAYOUT FONT SIZES */
.flex-2-col {
	font-size: 14px;
}
.flex-2-col li p.sub-title {
	font-weight:bold;
	font-size:1.2em;
	margin-bottom:6px;
}
.flex-3-col {
	font-size: 15px;
}
.flex-3-col li.arrow {
	font-size: 2em;
}
.flex-4-col {
	font-size: 13.5px;
}
.flex-4-col li b {
	display: block;
	font-size: 1.2em;
	margin-bottom: 15px;
}
.flex-list {
	font-size: 14px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
.flex-list li {
	flex-basis: 16.5%;
	padding: 0 10px;
	line-height: 1.4em;
	margin-bottom: 25px;
}
.flex-list li b {
	font-size: 1.4em;
	font-family: 'Arvo';
}
.flex-4-col-footer {
	font-size: 13.5px;
}

/* OTHER FONT SIZES */
.list_link {
	font-size:.9em;
	font-weight:bold;
	text-align:right !important;
}
dl.index-news dt time {
	font-size: .95em;
	color: #7c7c7c;
	font-weight: bold;
	font-family: 'Roboto Slab';
	margin-right: 7px;
}
.index-news .news-icon {
	font-size:.8em;
	margin-left:10px;
	font-weight:bold;
	color:#0a0a0a;
	text-align:center;
	width:80px;
	height:20px;
	line-height:20px;
	vertical-align:text-top;
	display:inline-block;
	border-radius:10px;
}
.index-news .recruit {
	background-color:#C2E8FB;
	color:#374C8F;
}
.index-news .update {
	background-color:#FBE6D6;
	color:#BC5315;
}
.index-news .news {
	background-color:#DBF4D9;
	color:#2F7339;
}

/* RESPONSIVE FONT SIZES - MOBILE/PC */
/* 1023px以下 (Tablet) */
@media screen and (max-width: 1023px){
	.contents-text {
		font-size:.95em;
	}
	.flex-3-col {
		font-size:14px !important;
	}
	.flex-list li {
		font-size:13px !important;
	}
}

/* 834px以下 (Small Tablet) */
@media screen and (max-width: 834px){
	.contents-text {
		font-size:.95em;
	}
	.flex-3-col {
		font-size:14px !important;
	}
	.flex-list li {
		font-size:13px !important;
	}
}

/* 800px以下 (Mobile) */
@media (max-width: 50em) {
	.int-btn, .int-btn-rvs {
		padding: .9em 3em !important;
		font-size: .85em !important;
	}
	.rightbtn .description .text {
		font-size: .9em;
		line-height: 1.75em;
	}
	.leftbtn .description .text {
		font-size: .9em;
		line-height: 1.75em;
	}
	.flex-4-col li {
		font-size: 1.2em;
		margin-bottom: 40px !important;
	}
	.flex-3-col {
		font-size: 14px !important;
	}
	.flex-list li {
		font-size: 13px !important;
		margin-bottom: 15px !important;
	}
	.flex-4-col-footer li {
		margin-bottom: 40px !important;
	}
	.price-list li.credit-img {
		width:100% !important;
		max-width:284px !important;
	}
	.howto-bottom {
		margin-top: 15px !important;
	}
	dl.index-news {
		width: 100% !important;
	}
	.rightbtn figure {
		width: 280px !important;
		margin: 0 30px 0 0 !important;
	}
	.rightbtn figure img {
		max-width: 280px;
	}
	.rightbtn .description {
		margin-top: 20px !important;
	}
	.rightbtn .description .text {
		font-size: .85em;
		line-height: 1.55em;
		margin-bottom: 10px !important;
	}
	.rightbtn .description .text img {
		width: 100%;
	}
	.rightbtn .description h5 {
		margin-bottom: 10px !important;
	}
	.leftbtn figure {
		width: 280px !important;
		margin: 0 0 0 30px !important;
	}
	.leftbtn figure img {
		max-width: 280px;
	}
	.leftbtn .description {
		margin-top: 20px !important;
	}
	.leftbtn .description .text {
		font-size: .8em;
		line-height: 1.5em;
		margin-bottom: 10px !important;
	}
	.leftbtn .description .text img {
		width: 100%;
	}
	.leftbtn .description h5 {
		margin-bottom: 10px !important;
	}
	.top-access-map {
		width: 60% !important;
		margin: 0 2% 0 0;
	}
	.top-access-map img {
		width: 100%;
	}
	.top-access-text {
		width: 38% !important;
		margin-top: 20px !important;
	}
	.top-access-text b {
		font-size: 1em !important;
		padding-bottom: 4px !important;
	}
	.int-btn {
		min-width:100% !important;
	}
	.int-btn-sp-telephone {
		display: inline-block;
		margin: 4px 0 10px;
		padding: .1em 2em !important;
		font-size: 1.5em;
		border-radius: 50px;
	}
	.int-btn-sp-telephone::after {
		content: '';
		width: 10px;
		height: 10px;
		border: 0px;
		-ms-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		position: absolute;
		top: 50%;
		right: 15px;
		margin-top: -4px;
		transition: all .3s;
		border-top: solid 2px #ffffff;
		border-right: solid 2px #ffffff;
	}
	.int-btn-sp-telephone:hover {
		background-color: #ffffff;
		color: #01D757;
		border: 2px solid #01D757;
	}
	.int-btn-sp-telephone:hover::after {
		border-top: solid 2px #01D757;
		border-right: solid 2px #01D757;
	}
	.access-btn-box {
		margin: 10px 0 20px 0;
		line-height: 3em;
	}
	.flex-list-sns li {
		line-height: 1.5em !important;
		flex-basis: 20% !important;
	}
	.shopinfo-left {
		width:100% !important;
		padding:20px !important;
	}
	.shopinfo-right img {
		max-width:500px !important;
		min-width:300px;
	}
	.about-box .title {
		margin:20px auto !important;
		font-size:1.4em !important;
		line-height:1.1em;
	}
	.payment-credit-box input,
	.payment-credit-box select {
		width:100% !important;
	}
	.virtual-image {
		width:100% !important;
	}
	.news {
		width:96%;
	}
	.event-box .bg-box {
		margin: 0 0 10px 0;
		padding: 0px !important;
		background: none !important;
		border:none !important;
	}
	.event-contents-table {
		width: 100%;
		border-collapse: collapse;
		border: #ccc 1px solid;
		overflow: hidden;
		word-break: break-all;
		word-wrap: break-word;
		font-size:13.5px;
		line-height:1.7em;
	}
	.event-contents-table th {
		padding: 7px 10px;
		border-top: dotted 1px #d8d8d8;
		width: 17%;
		font-size:.9em !important;
	}
	.event-contents-table td {
		padding: 7px 10px;
		line-height:1.35em;
	}
	.event-contact {
		font-size:13px !important;
		line-height:1.35em !important;
		padding:15px !important;
		margin-bottom:50px;
		display: block !important;
		overflow:hidden;
	}
	.event-contact li {
		flex-basis:100% !important;
		width:100% !important;
	}
	.event-contact li strong {
		font-size:1.5em;
	}
	.event-contact .int-btn-sp-telephone {
		padding:.5em 2em !important;
		margin:12px 0 0 0;
		font-size:1.1em !important;
	}
	.link-box li {
		flex-basis:48%;
	}
	.wpcf7-text, .wpcf7-textarea  {
		width:100% !important;
	}
	.wpcf7-textarea {
		height:100px !important;
	}
	.box-table {
		border: none !important;
	}
	.box-table th {
		padding: 7px !important;
		width:100% !important;
		display:block;
		color: #0a0a0a;
		text-align: center !important;
		border-radius:4px !important;
		border-top:none !important;
		background-color:#efefef;
	}
	.box-table td {
		box-sizing:border-box;
		padding:10px 10px 20px;
		display: list-item;
		width: 100%;
		border-top: none !important;
		line-height:1.68em !important;
	}
	.mailmagazine-box {
		width:100% !important;
		display:block !important;
	}
	.mailmagazine-box .float-left {
		margin:0px auto 30px !important;
		text-align:center !important;
	}
	.mailmagazine-box .float-left img {
		max-width:320px;
	}
}

/* 640px以下 (Small Mobile) */
@media (max-width: 40em) {
	.mgReset {
		margin:0px !important;
	}
	.contents-title {
		margin-bottom: 30px !important;
	}
	.container-footer {
		padding-right: 0em !important;
	}
	.int-btn {
		min-width: 180px !important;
	}
	.btn-box {
		display: block !important;
		text-align: center;
	}
	.not404 .int-btn {
		width:90% !important;
	}
	.not404 p {
		margin-bottom:16px !important;
	}
	.flex-3-col {
		display: block !important;
	}
	.flex-3-col li {
		margin-bottom: 20px !important;
	}
	.club-single li {
		flex-basis:45%;
		max-width:45%;
	}
	.sm-3 li {
		width: 100% !important;
	}
	.sm-3 li img {
		max-width: 302px;
		width: 100%;
	}
	.footerNav .flex-3-col li {
		margin-bottom: 0px !important;
	}
	.footerNav .flex-3-col li p {
		padding: .55em 0;
		border-bottom: 1px dotted rgba(255,255,255,0.5);
	}
	.flex-list li {
		flex-basis: 30% !important;
		margin-bottom: 15px !important;
	}
	.main-catch-photo {
		min-height: 240px !important;
		height: 100% !important;
		padding: 0px !important;
	}
	.main-catch-box {
		width: 100% !important;
		height: 100% !important;
		background: rgba(255,255,255,0.8);
		padding: 20px !important;
	}
	.main-catch-box h2 {
		margin-bottom: 10px;
		font-size: .8em !important;
	}
	.main-catch-box h2 p {
		font-size: 1.2em !important;
	}
	.main-catch-box p.txt {
		font-size: .8em;
		margin-bottom: 12px;
	}
	.main-catch-box img {
		width: 210px;
		margin-top: 10px;
		-webkit-box-shadow: 0 10px 6px -6px #777;
		-moz-box-shadow: 0 10px 6px -6px #777;
		box-shadow: 0 10px 6px -6px #777;
	}
	.top-midashi-title {
		margin: 0 auto 30px !important;
	}
	dl.index-news dd {
		font-size: .9em;
		line-height: 1.2em;
	}
	.rightbtn, .leftbtn {
		display: block;
		justify-content: flex-start;
	}
	.rightbtn figure, .leftbtn figure {
		width: 100% !important;
		margin: 0 !important;
	}
	.rightbtn figure img, .leftbtn figure img {
		width: 100% !important;
		max-width: 385px !important;
	}
	.rightbtn .description, .leftbtn .description {
		margin-top: 20px !important;
		width: 100% !important;
	}
	.rightbtn .description .text, .leftbtn .description .text {
		font-size: .95em;
		line-height: 1.75em;
		margin-bottom: 10px !important;
	}
	.rightbtn .description .text img, .leftbtn .description .text img {
		width: 100%;
		max-width: 390px !important;
	}
	.rightbtn .description .btn, .leftbtn .description .btn {
		margin: 10px auto 30px !important;
	}
	.flex-3-col li .circle {
		width: 222px !important;
		height: 222px !important;
	}
	.flex-2-col {
		display: block !important;
	}
	.flex-2-col li {
		flex-basis: 100% !important;
		margin-bottom: 20px !important;
		max-width:100% !important;
	}
	.price-list li {
		display:block !important;
	}
	.top-access-box {
		display: block;
	}
	.top-access-map {
		width: 100% !important;
		margin: 0 !important;
	}
	.top-access-map img {
		width: 100% !important;
		max-width: 480px !important;
	}
	.top-access-text {
		padding: 0 1em !important;
		width: 100% !important;
		margin-top: 20px !important;
	}
	.top-access-text p.text {
		font-size: 1em;
	}
	.top-access-text b {
		font-size: 1em !important;
		padding-bottom: 4px !important;
	}
	.flex-list-sns li {
		flex-basis: 25% !important;
	}
	#menu-footer li {
		line-height:2.4em;
	}
	#page-top {
		bottom: 0px !important;
		right: 10px;
	}
	.table-rsp {
		border: none !important;
	}
	.table-rsp th {
		padding: 7px 0px !important;
		width: 100% !important;
		display: block;
		color: #ffffff;
		text-align: center !important;
		border-radius: 0px !important;
		border-top: none !important;
		background-color: #2ea9df;
	}
	.table-rsp td {
		box-sizing: border-box;
		padding: 10px 10px 20px;
		display: list-item;
		width: 100%;
		border-top: none !important;
		line-height: 1.68em !important;
	}
	.contents-text {
		width:100%;
	}
	.about-box p {
		line-height:25px;
	}
	.about-box-english p {
		line-height:21px;
	}
	.about-box .title {
		margin:13px auto !important;
		padding:0 0 30px 0;
		letter-spacing:0em !important;
	}
	.about-text-box .text:nth-of-type(1) {
		width: 100% !important;
		padding: 20px 0 0 0 !important;
		border-top: 2px dotted #ffffff;
		border-right:none !important;
		margin-bottom:20px !important;
	}
	.about-text-box .text:nth-of-type(2) {
		width: 100% !important;
		padding:0 0 15px 0 !important;
		float: left !important;
		margin-bottom:30px !important;
	}
	.price-box .price-table-rsp {
		border: none;
	}
	.price-box .price-table-rsp thead {
		display: none;
	}
	.price-box .price-table-rsp tr {
		border-top: 1px solid #999;
		display: block;
		margin-bottom: 20px;
	}
	.price-box .price-table-rsp td {
		border-right: 1px solid #999;
		border-bottom: 1px solid #999;
		display: block;
		padding: 10px;
		text-align: right;
	}
	.price-box .price-table-rsp td::before {
		content: attr(data-label);
		float: left;
		font-weight: bold;
	}
	.virtual-letter th,
	.virtual-letter td {
		font-size:.8em !important;
		line-height:1.3em;
	}
	.flow li {
		margin-bottom:15px !important;
	}
	.flow li p {
		margin-top:5px !important;
	}
	.flow li::after {
		margin: 15px auto 0 !important;
		font-size:1.8em !important;
	}
	#shopinfo-flexbox-box {
		display:block;
	}
	.shopinfo-right {
		width:100%;
	}
	.access-inside {
		width:90%;
		margin:15px auto;
		height:360px;
	}
	.top-midashi-title img,
	.contents-title img {
		width:100% !important;
		max-width:400px !important;
	}
	.column-wrap {
		width:100% !important;
		margin: 0 auto;
	}
	.column-box {
		display:block;
	}
	.column-box .main {
		width:100%;
		flex-basis: 100%;
		margin: 0px !important;
	}
	.column-box .side {
		flex-basis: 100%;
		width:100% !important;
	}
	table.event-contents-table {
		border: none !important;
	}
	table.event-contents-table th {
		width:100% !important;
		display:block;
		margin: 0 auto;
		border:none;
		color: #504f4f;
		font-weight:normal !important;
		font-size:1.1em !important;
		text-align: center !important;
		border-radius: 4px;
		background-color: #ebeef0;
	}
	table.event-contents-table td {
		display: list-item;
		width: 100%;
		border-top: none !important;
	}
	ul.sitemap {
		width:100% !important;
		padding:0 16px !important;
	}
	ul.page_navi {
		margin-bottom:30px !important;
	}
	.event-list-box li .title {
		font-size:1.2em;
		margin:3px 0 !important;
	}
	.web-catch-photo {
		min-height: 240px !important;
		height: 100% !important;
		padding: 0px !important;
	}
	.web-catch {
		min-height: 240px !important;
		width: 100% !important;
		height: 100% !important;
	}
	.web-catch .img {
		max-width:460px;
		width:100%;
		bottom:20px;
	}
	.web-flow-photo {
		min-height: 360px !important;
		height: 100% !important;
		padding: 0px !important;
	}
	.web-flow-catch {
		width: 100% !important;
		height: 100% !important;
		margin: 0 auto;
		padding: 50px 0;
		position: relative !important;
	}
	.web-planlist {
		font-size:.9em;
	}
	.planlist-table {
		font-size:.9em;
	}
	.photo__club li {
		margin-bottom: 5px !important;
	}
	.mailmagazine-box {
		width:100% !important;
		display:block !important;
	}
	.mailmagazine-box .float-left {
		margin:0px auto 30px !important;
		text-align:center !important;
	}
	.mailmagazine-box .float-left img {
		max-width:320px;
	}
}

/* 400px以下 (Extra Small Mobile) */
@media (max-width: 25em) {
	.flex-4-col li {
		flex-basis: 100% !important;
		margin-bottom: 40px !important;
		padding: 0 10px;
	}
	.flex-4-col-footer li {
		flex-basis: 100% !important;
		margin-bottom: 40px !important;
		padding: 0 10px;
	}
	.top-midashi-title img, .contents-title img {
		width: 90% !important;
	}
	.link-box li {
		flex-basis:100%;
	}
	.event-list-box li {
		flex-basis:100%;
		margin:0 0 20px;
	}
	.page-heading {
		display: table;
		width: 100%;
		height: 60px;
		line-height: 23px;
		font-size: 1.2em;
	}
	.planlist-table {min-width:300px !important;}
	.club-single {
		display: block !important;
	}
	.club-single li {
		max-width:100% !important;
		flex-basis: 100% !important;
	}
}

/* デジラボ トップページ専用CSS */
:root {
  --dilabo-blue: #129fd2;
  --dilabo-blue-dark: #087da7;
  --dilabo-green: #16b6a4;
  --dilabo-ink: #24333b;
  --dilabo-muted: #64737b;
  --dilabo-soft: #f2f7f9;
  --dilabo-border: #dce7eb;
  --dilabo-white: #fff;
  --dilabo-line: #06c755;
  --dilabo-shadow: 0 18px 50px rgba(27, 64, 78, .10);
}

.dilabo-top,
.dilabo-top * { box-sizing: border-box; }
.dilabo-top { color: var(--dilabo-ink); font-size: 17px; line-height: 1.85; }
.dilabo-top h1,
.dilabo-top h2,
.dilabo-top h3,
.dilabo-top p { margin-top: 0; }
.dilabo-top h2 { font-size: clamp(28px, 4vw, 46px); line-height: 1.35; letter-spacing: .02em; }
.dilabo-top h3 { font-size: clamp(20px, 2.2vw, 25px); line-height: 1.5; }
.dilabo-top a { transition: opacity .2s ease, transform .2s ease, background-color .2s ease; }
.dilabo-top a:hover { opacity: .88; }
.dilabo-container { width: min(1120px, calc(100% - 40px)); margin-inline: auto; }
.dilabo-container--narrow { width: min(860px, calc(100% - 40px)); }

.dilabo-hero {
  overflow: hidden;
  padding: clamp(70px, 10vw, 130px) 0;
  color: var(--dilabo-white);
  text-align: center;
  background:
    radial-gradient(circle at 15% 20%, rgba(255,255,255,.18), transparent 28%),
    radial-gradient(circle at 85% 75%, rgba(255,255,255,.13), transparent 30%),
    linear-gradient(135deg, var(--dilabo-blue-dark), var(--dilabo-blue) 48%, var(--dilabo-green));
}
.dilabo-hero__eyebrow { margin-bottom: 14px; font-weight: 700; letter-spacing: .12em; }
.dilabo-hero h1 { margin: 0 auto 24px; max-width: 980px; color: inherit; font-size: clamp(32px, 5.3vw, 64px); line-height: 1.32; }
.dilabo-hero__lead { max-width: 800px; margin: 0 auto 34px; font-size: clamp(16px, 2vw, 20px); }
.dilabo-actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.dilabo-actions--center { justify-content: center; }
.dilabo-actions--left { justify-content: flex-start; }
.dilabo-hero .dilabo-actions { justify-content: center; }
.dilabo-button { display: inline-flex; min-height: 52px; padding: 11px 24px; align-items: center; justify-content: center; border: 2px solid transparent; border-radius: 999px; font-weight: 700; line-height: 1.35; text-align: center; text-decoration: none !important; }
.dilabo-button--primary { background: var(--dilabo-white); color: var(--dilabo-blue-dark) !important; }
.dilabo-button--ghost { border-color: rgba(255,255,255,.8); color: var(--dilabo-white) !important; }
.dilabo-button--line { background: var(--dilabo-line); color: var(--dilabo-white) !important; }
.dilabo-button--dark { background: var(--dilabo-ink); color: var(--dilabo-white) !important; }
.dilabo-button--outline { border-color: var(--dilabo-blue); color: var(--dilabo-blue-dark) !important; }

.dilabo-facts { position: relative; z-index: 2; margin-top: -26px; }
.dilabo-facts__grid { display: grid; grid-template-columns: repeat(4, 1fr); overflow: hidden; border-radius: 18px; background: var(--dilabo-white); box-shadow: var(--dilabo-shadow); }
.dilabo-fact { min-width: 0; padding: 25px 18px; text-align: center; }
.dilabo-fact + .dilabo-fact { border-left: 1px solid var(--dilabo-border); }
.dilabo-fact strong,
.dilabo-fact span { display: block; }
.dilabo-fact strong { color: var(--dilabo-blue-dark); font-size: 20px; }
.dilabo-fact span { margin-top: 5px; color: var(--dilabo-muted); font-size: 14px; }

.dilabo-section { padding: clamp(72px, 9vw, 118px) 0; }
.dilabo-section--soft { background: var(--dilabo-soft); }
.dilabo-section--dark { color: var(--dilabo-white); background: var(--dilabo-ink); }
.dilabo-section--dark h2,
.dilabo-section--dark h3 { color: inherit; }
.dilabo-section__heading { max-width: 820px; margin: 0 auto 46px; text-align: center; }
.dilabo-section__heading > :last-child { margin-bottom: 0; }
.dilabo-kicker { margin-bottom: 8px; color: var(--dilabo-blue); font-size: 13px; font-weight: 800; letter-spacing: .16em; }

.dilabo-card-grid { display: grid; gap: 24px; }
.dilabo-card-grid--three { grid-template-columns: repeat(3, 1fr); }
.dilabo-card { position: relative; padding: 34px 30px; border: 1px solid var(--dilabo-border); border-radius: 20px; background: var(--dilabo-white); box-shadow: 0 10px 32px rgba(27,64,78,.06); }
.dilabo-card__number { display: block; margin-bottom: 12px; color: var(--dilabo-blue); font-weight: 800; letter-spacing: .12em; }
.dilabo-card__note { display: inline-block; padding: 3px 12px; border-radius: 99px; background: #e9f8fb; color: var(--dilabo-blue-dark); font-size: 14px; font-weight: 700; }
.dilabo-text-link { display: inline-flex; gap: 8px; color: var(--dilabo-blue-dark) !important; font-weight: 700; text-decoration: none !important; }

.dilabo-price-wrap { padding: clamp(24px, 4vw, 46px); border-radius: 24px; background: var(--dilabo-white); box-shadow: var(--dilabo-shadow); }
.dilabo-price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.dilabo-price { padding: 20px 16px; border: 1px solid var(--dilabo-border); border-radius: 15px; text-align: center; }
.dilabo-price span,
.dilabo-price strong { display: block; }
.dilabo-price span { color: var(--dilabo-muted); font-size: 14px; font-weight: 700; }
.dilabo-price strong { margin-top: 5px; color: var(--dilabo-blue-dark); font-size: 30px; line-height: 1.3; }
.dilabo-price small { margin-left: 3px; font-size: 14px; }
.dilabo-price--accent { border-color: var(--dilabo-blue); background: #edfaff; }
.dilabo-caption { margin: 24px 0; color: var(--dilabo-muted); font-size: 14px; text-align: center; }

.dilabo-flow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 0; padding: 0; list-style: none; }
.dilabo-flow__item { padding: 30px; border-top: 4px solid var(--dilabo-blue); background: var(--dilabo-soft); }
.dilabo-flow__item > span { color: var(--dilabo-blue); font-size: 13px; font-weight: 800; letter-spacing: .12em; }
.dilabo-notice { margin: 28px 0 0; padding: 17px 20px; border-left: 4px solid var(--dilabo-green); background: #f0faf8; }

.dilabo-feature-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; overflow: hidden; border: 1px solid rgba(255,255,255,.18); border-radius: 20px; background: rgba(255,255,255,.18); }
.dilabo-feature { padding: clamp(28px, 4vw, 44px); background: var(--dilabo-ink); }
.dilabo-feature p { margin-bottom: 0; color: rgba(255,255,255,.75); }

.dilabo-equipment { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 0 0 36px; padding: 0; list-style: none; }
.dilabo-equipment li { min-height: 130px; padding: 22px 18px; border: 1px solid var(--dilabo-border); border-radius: 15px; background: var(--dilabo-white); }
.dilabo-equipment strong,
.dilabo-equipment span { display: block; }
.dilabo-equipment strong { color: var(--dilabo-blue-dark); }
.dilabo-equipment span { margin-top: 6px; color: var(--dilabo-muted); font-size: 14px; }

.dilabo-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.dilabo-gallery figure { margin: 0; }
.dilabo-gallery img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 18px; }
.dilabo-gallery figcaption { padding-top: 10px; color: var(--dilabo-muted); font-size: 14px; }

.dilabo-virtual { padding-block: 55px; background: linear-gradient(135deg, #eaf8fc, #ecfaf7); }
.dilabo-virtual__inner { display: grid; grid-template-columns: 1.5fr 1fr; gap: 26px 48px; align-items: center; }
.dilabo-check-list { margin: 0; padding: 0; list-style: none; }
.dilabo-check-list li { position: relative; padding: 7px 0 7px 30px; font-weight: 700; }
.dilabo-check-list li::before { position: absolute; left: 0; content: "✓"; color: var(--dilabo-green); font-weight: 900; }
.dilabo-virtual__inner > .dilabo-button { justify-self: start; }

.dilabo-faq details { border-bottom: 1px solid var(--dilabo-border); }
.dilabo-faq summary { position: relative; padding: 20px 50px 20px 8px; cursor: pointer; font-weight: 700; list-style: none; }
.dilabo-faq summary::-webkit-details-marker { display: none; }
.dilabo-faq summary::after { position: absolute; top: 18px; right: 12px; content: "+"; color: var(--dilabo-blue); font-size: 24px; line-height: 1; }
.dilabo-faq details[open] summary::after { content: "−"; }
.dilabo-faq details p { padding: 0 8px 20px; color: var(--dilabo-muted); }
.dilabo-faq + .dilabo-actions { margin-top: 34px; }

.dilabo-access { background: var(--dilabo-soft); }
.dilabo-access__grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 30px 70px; align-items: start; }
.dilabo-access address { font-style: normal; }
.dilabo-hours { padding: 26px; border-radius: 18px; background: var(--dilabo-white); }
.dilabo-hours dl { margin: 0; }
.dilabo-hours dl div { display: flex; justify-content: space-between; gap: 20px; padding: 8px 0; border-bottom: 1px solid var(--dilabo-border); }
.dilabo-hours dd { margin: 0; font-weight: 700; }
.dilabo-hours p { margin: 14px 0 0; color: var(--dilabo-muted); font-size: 13px; }
.dilabo-access__grid > .dilabo-actions { grid-column: 1 / -1; }

.dilabo-final-cta { padding: clamp(70px, 9vw, 110px) 0; color: var(--dilabo-white); text-align: center; background: linear-gradient(135deg, var(--dilabo-blue-dark), var(--dilabo-blue)); }
.dilabo-final-cta h2 { color: inherit; }
.dilabo-final-cta p { margin-bottom: 30px; }

/* JavaScriptが無効でも本文は表示される設計 */
.dilabo-reveal { opacity: 1; transform: none; }
.dilabo-reveal.is-waiting { opacity: 0; transform: translateY(22px); }
.dilabo-reveal.is-visible { opacity: 1; transform: translateY(0); transition: opacity .65s ease, transform .65s cubic-bezier(.2,.7,.2,1); }

@media (max-width: 900px) {
  .dilabo-facts__grid,
  .dilabo-card-grid--three,
  .dilabo-flow { grid-template-columns: repeat(2, 1fr); }
  .dilabo-fact:nth-child(3) { border-left: 0; border-top: 1px solid var(--dilabo-border); }
  .dilabo-fact:nth-child(4) { border-top: 1px solid var(--dilabo-border); }
  .dilabo-price-grid { grid-template-columns: repeat(2, 1fr); }
  .dilabo-equipment { grid-template-columns: repeat(2, 1fr); }
  .dilabo-gallery { grid-template-columns: 1fr; }
  .dilabo-virtual__inner,
  .dilabo-access__grid { grid-template-columns: 1fr; }
  .dilabo-access__grid > .dilabo-actions { grid-column: auto; }
}

@media (max-width: 600px) {
  .dilabo-top { font-size: 16px; }
  .dilabo-container,
  .dilabo-container--narrow { width: min(100% - 28px, 1120px); }
  .dilabo-hero { padding-top: 62px; }
  .dilabo-hero__lead br { display: none; }
  .dilabo-actions,
  .dilabo-actions--left { align-items: stretch; flex-direction: column; }
  .dilabo-button { width: 100%; }
  .dilabo-facts { margin-top: -18px; }
  .dilabo-fact { padding: 19px 10px; }
  .dilabo-fact strong { font-size: 17px; }
  .dilabo-fact span { font-size: 12px; }
  .dilabo-card-grid--three,
  .dilabo-flow,
  .dilabo-feature-grid,
  .dilabo-price-grid { grid-template-columns: 1fr; }
  .dilabo-card,
  .dilabo-flow__item { padding: 26px 22px; }
}

@media (prefers-reduced-motion: reduce) {
  .dilabo-top *,
  .dilabo-top *::before,
  .dilabo-top *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  .dilabo-reveal,
  .dilabo-reveal.is-waiting,
  .dilabo-reveal.is-visible { opacity: 1; transform: none; }
}