/******************************************************************************/
/* スマートフォン用スタイルシート - last update: 24.12.25 */


@media only screen and (max-width: 900px) {

/******************************************************************************/
/* header - ヘッダの枠組み */

#header h1 {
	float: none;
	background: url(../img/phone/header_bg.png) no-repeat right center;
	background-size: contain;
	width: calc(100% - 75px);
	max-width: 744px;
	height: auto;
	margin: 0px 0px 0px 70px;
	padding: 0px 0px 20.0% 0px;
}

#header a {
	display: none;
}


/******************************************************************************/
/* wrapper - コンテンツ領域の枠組み */

#wrapper {
	width: auto !important;
}


/******************************************************************************/
/* menu - グローバルメニューの枠組み */

#menu {
	float: none;
	position: absolute;
	top: 0px;
	left: 0px;
	background: none;
	width: 100%;
	height: auto;
	margin: 0px;
	padding: 0px;
	z-index: 999;
}

#menu li {
	float: none;
}

#menu span {
	display: inline;
}

#menu .menubar {
	display: block;
	width: 100%;
	height: 60px;
	padding: 0px;
	pointer-events: all;
}

#menu .menubar.closed {
    background: url(../img/phone/menubar_c_bg.png) no-repeat left top;
}

#menu .menubar.open {
    background: url(../img/phone/menubar_s_bg.png) no-repeat left top;
}

#menu .menubar span {
	display: none;
}

#menu .toggle {
	width: 100%;
	height: 0;
	padding: 0px;
	transition: 0.2s;
}

#menu input:checked + .toggle {
	height: auto;
	padding: 0px;
}

#menu .toggle li {
	line-height: 0;
	margin: 0px 0px 1px 0px;
	opacity: 0;
	transition: padding .2s, line-height .2s, visibility .1s, opacity .1s;
	visibility: hidden;
}

#menu input:checked + .toggle li {
	opacity: 1;
	visibility: visible;
}

#menu .toggle li.poster {
	margin: 0px auto 1px 0px;
	text-align: left;
}

#menu .toggle li.ban {
	margin: 0px auto 1px 0px;
	text-align: left;
}

#menu .update {
	display: none;
}


/******************************************************************************/
/* maincontent - メインコンテンツの枠組み */

#maincontent {
	clear: both;
	float: none;
	width: 100%;
}

#maincontent .text {
	background-color: rgba(255, 255, 255, 0.95);
	background-image: none;
	padding: 20px 0px 5px 0px;
}

#maincontent p,
#maincontent ul {
	margin: 0px 3% 15px 3%;
}

#maincontent .whatsnew {
	width: 100%;
	height: auto;
	margin: 0px auto;
	overflow-y: visible;
}


/******************************************************************************/
/* maincontent .hr - コンテンツページ本文の区切り線 */

#maincontent .hr {
	width: 96%;
	margin: 0px auto 25px auto;
}


/******************************************************************************/
/* メインコンテンツ - 見出し背景 */

#maincontent h2 {
	background: #005555 url(../img/phone/h2_bg.png) no-repeat left top;
	width: auto;
	height: auto;
	line-height: 160%;
	padding: 9px 0px 7px 50px;
	font-size: 20px;
	letter-spacing: 0.25em;
}

#maincontent h3 {
	margin: 0px 2% 15px 2%;
}

#maincontent h4 {
	margin: 0px 3% 10px 3%;
}

#maincontent h5 {
	margin: 0px 3% 0px 3%;
}


/******************************************************************************/
/* #mainvisual - メインビジュアル */

#mainvisual {
	background: url(../img/mainvisual_bg.png) no-repeat center top;
	background-size: contain;
	width: 100%;
	max-width: 734px;
	height: auto;
	margin: 0px auto 0px auto;
	padding: 0px 0px 78.75% 0px;
}


/******************************************************************************/
/* .table_normal - テーブル（汎用） */

#maincontent .table_normal {
	margin: 0px 3% 15px 3%;
}

#maincontent .table_normal td {
	padding-right: 5px;
}


/******************************************************************************/
/* メインコンテンツ - テーブル（幅固定、枠線なし） */

#maincontent .table_fix {
	margin: 0px 2% 15px 2%;
	width: 96%;
}


/******************************************************************************/
/* メインコンテンツ - テーブル（幅固定、枠線あり） */

#maincontent .table_border {
	margin: 0px 2% 15px 2%;
	width: 96%;
}


/******************************************************************************/
/* メインコンテンツ - テーブル（参加申込フォーム） */

#maincontent .table_form {
	margin: 0px 2% 15px 2%;
	width: 96%;
}

#maincontent .table_form td.time,
#maincontent .table_form td.h {
	width: 25%;
}

#maincontent .table_form td.event,
#maincontent .table_form td.d {
	width: auto;
	max-width: 510px;
}

#maincontent .table_dsub td {
	line-height: 120%;
	vertical-align: top;
	padding: 5px 2px;
}

#maincontent .table_dsub input {
	width: 80%;
}

#maincontent .w150 {
	width: 15%;
}

#maincontent .w180 {
	width: 20%;
}

#maincontent .w280 {
	width: 65%;
}

#maincontent .w360 {
	width: 90%;
}


/******************************************************************************/
/* メインコンテンツ - テーブル（囲み枠） */

#maincontent .table_box {
	margin: 0px 2% 15px 2%;
	width: 96%;
}


/******************************************************************************/
/* メインコンテンツ - Googleマップ */

#maincontent .gmap {
	margin: 0px 2% 15px 2%;
	width: 96%;
}

#maincontent .gmap iframe {
	width: 100%;
}


/******************************************************************************/
/* .box_frame - 動画埋め込み枠用 */

#maincontent .box_frame {
	width: 100%;
	margin: 0px auto 15px auto;
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}
 
#maincontent .box_frame iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/******************************************************************************/
/* jumptop - PAGE TOPボタンの枠組み */
/* 今回はjquery.scrollUp.jsを使用 */

#scrollUp {
	right: 0px;
}


/******************************************************************************/
/* footer - フッタの枠組み */

#footer {
	clear: both;
	background: #005555;
	width: 100%;
	height: auto;
	line-height: 160%;
	padding: 20px 0px;
	border-top: 3px double #FFFFFF;
	border-bottom: 3px double #FFFFFF;
	color: #FFFFFF;
}


}		/* end of 900px */


@media only screen and (max-width: 540px) {

#maincontent div.ml2e {
	margin-left: 0px;
}


/******************************************************************************/
/* #maincontent .table_form - 登録フォーム等 */

#maincontent .table_form {
	width: 100%;
	margin: 0px 0px 15px 0px;
	border-top: 1px solid #999999;
}

#maincontent .table_form td {
	display: inline-block;
	padding: 10px 2%;
}

#maincontent .table_form td.h2,
#maincontent .table_form td.h22 {
	width: 96%;
	border: 0px none;
}

#maincontent .table_form td.time,
#maincontent .table_form td.time2,
#maincontent .table_form td.h {
	width: 96%;
	border: 0px none;
}

#maincontent .table_form td.event,
#maincontent .table_form td.event2,
#maincontent .table_form td.d {
	width: 96%;
	border-top: 0px none;
	border-right: 0px none;
	border-bottom: 1px solid #999999;
	border-left: 0px none;
}

#maincontent .table_dsub td {
	line-height: 120%;
	padding: 5px 2px;
}


/******************************************************************************/
/* メインコンテンツ - 画像のフローティング */

.greet_photo {
	width: 25%;
	height: auto;
	max-width: 150px;
}


}		/* end of 540px */