@charset "utf-8";

	/* Menu */
	div.PanelMenu
	{
	}
	div.PanelMenu ul
	{
		text-align			:	center;
	}
	div.PanelMenu li
	{
		display			:	inline-block;
		vertical-align			:	top;
		transition			:	all 0.2s ease-out;
	}
	div.PanelMenu ul li div
	{
		display			:	table-cell;
		text-align			:	center;
		vertical-align			:	middle;
		line-height			:	0px;
		background-repeat		:	no-repeat;
		background-position	:	center center;
		background-size		:	cover;
		background-color		:	rgba(0,0,0,0.25);
		transition			:	all 0.2s ease-out;
	}
	div.PanelMenu ul li div img
	{
		max-width			:	90%;
		margin			:	0px auto;
		line-height			:	0px;
		transition			:	all 0.2s ease-out;
	}
	div.PanelMenu ul li h2
	{
		margin			:	0px auto;
		padding			:	0.25em 0px;
		color				:	#000;
		text-decoration		:	none;
		white-space			:	nowrap;
	}
	div.PanelMenu ul li a:hover
	{
		text-decoration		:	none;
	}
	#PanelMenu1DayPottery
	{
		background-image		:	url( './1day/image/Menu/Photo/Pottery.webp' );
	}
	#PanelMenu1DayGlass
	{
		background-image		:	url( './1day/image/Menu/Photo/Glass.webp' );
	}
	#PanelMenu1DayBatik
	{
		background-image		:	url( './1day/image/Menu/Photo/Batik.webp' );
	}
	#PanelMenu1DayBamboo
	{
		background-image		:	url( './1day/image/Menu/Photo/Bamboo.webp' );
	}
	#PanelMenu1DaySummer
	{
		background-image		:	url( './1day/image/Menu/Photo/Summer.webp?Date=20240710' );
	}
	#PanelMenuSchoolPottery
	{
		background-image		:	url( './school/image/Menu/Photo/Pottery.webp' );
	}
	#PanelMenuSchoolGlass
	{
		background-image		:	url( './school/image/Menu/Photo/Glass.webp' );
	}
	#PanelMenuSchoolBatik
	{
		background-image		:	url( './school/image/Menu/Photo/Batik.webp' );
	}
	#PanelMenuSchoolBamboo
	{
		background-image		:	url( './school/image/Menu/Photo/Bamboo.webp' );
	}
	#PanelMenuSchoolEducation
	{
		background-image		:	url( './school/image/Menu/Photo/Education.webp' );
	}
	#PanelMenuEducationSchool
	{
		background-image		:	url( './education/image/Menu/Photo/School.webp' );
	}
	#PanelMenuEducationWorkshop
	{
		background-image		:	url( './education/image/Menu/Photo/Workshop.webp' );
	}

/*
======================================
Pc
======================================
*/
@media print, screen and (min-width:801px)
{
	/* Title */
	#PanelBodyTitle
	{
		display			:	none !important;
	}

	/* Menu */
	div.PanelMenu ul
	{
		display			:	table;
		margin			:	0px auto;
	}
	div.PanelMenu ul li
	{
		display			:	table-cell;
		margin			:	0px 0px 15px 0px;
		padding			:	0px;
	}
	div.PanelMenu ul li:first-child
	{
		border-left			:	none;
	}
	div.PanelMenu ul li:last-child
	{
		border-				:	none;
	}
	div.PanelMenu ul li a
	{
		width				:	inherit;
	}
	div.PanelMenu ul li div
	{
		width				:	inherit;
		border-right			:	solid 1px rgb(255,255,255);
		border-bottom		:	solid 1px rgb(255,255,255);
	}
	div.PanelMenu ul li h2
	{
		font-size			:	16px;
	}

	/* Anchor */
	a.LabelAnchor div,
	a.LabelAnchorSub div
	{
		width				:	270px !important;
	}

	/* Summer */
	#ImageBannerSummer
	{
		width				:	360px;
		margin			:	0px auto;
	}
}


/*
======================================
Wide PC
======================================
*/
@media print, screen and (min-width:1241px)
{
	/* Menu */
	div.PanelMenu ul li
	{
		width				:	180px;
	}
	div.PanelMenu ul li div
	{
		width				:	inherit;
		height				:	180px;
	}
	div.PanelMenu ul li div img
	{
		height				:	18px;
	}
}

/*
======================================
Narrow PC
======================================
*/
@media screen and (min-width:801px) and (max-width:1240px)
{
	/* Menu */
	div.PanelMenu ul li
	{
		width				:	160px;
	}
	div.PanelMenu ul li div
	{
		width				:	inherit;
		height				:	160px;
	}
	div.PanelMenu ul li div img
	{
		max-width			:	95%;
		height				:	15px;
	}
}

/*
======================================
Smart Phone
======================================
*/
@media screen and (max-width:800px)
{
	/* Menu */
	div.PanelMenu h2 img
	{
		height				:	60px;
	}
	div.PanelMenu ul
	{
		margin			:	0px;
	}
	div.PanelMenu ul li
	{
		display			:	inline-block;
		width				:	109px;
		margin			:	0px -3px 10px 0px;
		padding			:	0px;
		border-right			:	solid 1px rgb(255,255,255);
	}
	div.PanelMenu ul li div
	{
		width				:	110px;
		height				:	110px;
	}
	div.PanelMenu ul li div img
	{
		height				:	15px;
	}
	div.PanelMenu ul li h2
	{
		font-size			:	inherit;
	}

	/* Summer */
	#ImageBannerSummer
	{
		width				:	300px;
		margin			:	0px auto;
	}

}
