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


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

/******************************************************************************/
/* wrapper - ページ全体の枠組み */

#wrapper {
	width: auto !important;
	margin: 0px auto;
	padding: 0px;
	text-align: left;
}


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

#header {
	float: none;
	width: 100%;
	max-width: 860px;
	height: auto;
	margin: 40px 0px 0px 0px;
	padding: 12px 0px 16.67% 0px;
	background: url(../img/header_bg.png) no-repeat center top;
	background-size: contain;
}

#header a {
	display: none;
}


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

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

#menu li {
	float: none;
}

#menu span {
	display: inline;
}

#menu .menubar {
	display: block;
	pointer-events: all;
	width: 100%;
	height: 40px;
	padding: 0px;
	background: url(../img/phone/menubar_bg.png) no-repeat left top;
}

#menu .menubar span {
	display: none;
}

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

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

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

#menu .toggle a,
#menu .toggle a:visited {
	width: 80%;
}

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

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

#menu .poster a,
#menu .poster a:visited {
	margin: 0px;
}

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

#menu .ban a,
#menu .ban a:visited {
	margin: 0px;
}

#menu .spmenu,
#menu .ban2 {
	display: none;
}


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

#maincontent {
	clear: both;
	float: none;
	width: 100%;
	margin: 0px 0px 20px 0px;
	padding: 0px;
}

#maincontent h2 {
	background: #402B15 url(../img/h2_bg.png) no-repeat -5px top;
	padding: 5px 0px 0px 40px;
	width: auto;
	height: auto;
}

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

#maincontent h4 {
	margin: 0px 15px 0px 15px;
}

#maincontent .box1 {
	background-image: none;
	background: #FFFFFF;
	width: 100%;
	margin: 0px 0px 20px 0px;
	padding: 20px 0px 15px 0px;
	border-bottom: 1px solid #999999;
	filter: alpha(opacity=95);
	-moz-opacity: 0.95;
	opacity: 0.95;
}

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

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

#maincontent .ban3 {
	display: inline;
}


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

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

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


/******************************************************************************/
/* .table_border - テーブル（枠固定） */

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


/******************************************************************************/
/* .table_program - テーブル（プログラム） */

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

#maincontent .table_program td.h {
	width: auto;
}

#maincontent .table_program td.d {
	width: auto;
	max-width: 510px;
}


/******************************************************************************/
/* .table_form - テーブル（参加申込フォーム） */

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

#maincontent .table_form td.h {
	width: auto;
}

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

#maincontent .w150 {
	width: 15%;
}

#maincontent .w180 {
	width: 20%;
}

#maincontent .w280 {
	width: 65%;
}

#maincontent .w360 {
	width: 90%;
}


/******************************************************************************/
/* .gmap - Googleマップ */

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

#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;
	width: 100%;
	height: auto;
	line-height: 160%;
	padding: 20px 0px;
	background: #402B15;
	color: #FFFFFF;
	border-top: 3px double #FFFFFF;
	border-bottom: 3px double #FFFFFF;
}


#maincontent .img-topmap {
	float: none;
	width: 95%;
	margin: 0px auto 15px auto;
	text-align: center;
}


}		/* end of 860px */


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


/******************************************************************************/
/* maincontent - 写真の右寄せ等 */

#maincontent .img-r122 {
	float: none;
	width: 95%;
	margin: 0px auto 15px auto;
	text-align: center;
}

#maincontent .img-r122 img {
	width: 61px;
	height: 86px;
}

#maincontent .img-r122 br {
	display: none;
}


}		/* end of 540px */