/* Body */
#PanelBody
{
}

/* Menu */
#PanelBusinessMenu
{
	display					:	table;
	width					:	100%;
	margin					:	0px 0px 30px 0px;
	font-size				:	21px;
	font-weight				:	bold;
}
#PanelBusinessMenuTitle
{
	display					:	table-cell;
	width					:	260px;
	padding					:	0px;
	text-align				:	center;
	vertical-align				:	middle;
	color					:	rgb(0,46,110);
	background-color			:	rgb(212,227,245);
}
#PanelBusinessMenuBody
{
	display					:	table-cell;
	padding					:	0px 0px 0px 0px;
	text-align				:	center;
	vertical-align				:	middle;
	color					:	rgb(0,46,110);
}
#PanelBusinessMenuBody ul
{
	margin					:	0px;
	padding					:	0px;
	text-align				:	right;
}
#PanelBusinessMenuBody ul li
{
	display					:	inline-block;
	width					:	230px;
	margin					:	0px 0px 0px 6px;
	padding					:	15px 0px;
	border					:	solid 1px rgb(0,46,110);
	text-align				:	center;
	transition				:	all 0.2s ease-out;
	-webkit-transition			:	all 0.2s ease-out;
	-moz-transition				:	all 0.2s ease-out;
	-o-transition				:	all 0.2s ease-out;
}
#PanelBusinessMenuBody ul li:nth-child(-n+3)
{
	margin-bottom				:	6px;
}
#PanelBusinessMenuBody li.ListBusinessMenuDefault:hover,
#PanelBusinessMenuBody li.ListBusinessMenuActive
{
	background-color			:	rgb(212,227,245);
	transition				:	none;
	-webkit-transition			:	none;
	-moz-transition				:	none;
	-o-transition				:	none;
}


/* Column */
div.PanelLayout
{
	display					:	table;
	width					:	100%;
}
div.PanelLayoutPhoto
{
	display					:	table-cell;
	width					:	460px;
	vertical-align				:	top;
	padding					:	0px 0px 0px 30px;
}
div.PanelLayoutPhoto img
{
	width					:	100%;
}
div.PanelLayoutComment
{
	display					:	table-cell;
	vertical-align				:	top;
}

/* List Text */
ul.ListText
{
	margin					:	0px;
	padding					:	0px;
}
ul.ListText li
{
	position					:	relative;
	list-style-type				:	none;
	width					:	auto;
	margin					:	0px 0px 0px 1.25em;;
	padding					:	0px 0px 0px 0px;
}
ul.ListText li:before
{
	position					:	absolute;
	top					:	0px;
	left					:	-1.25em;
	content					:	"●";
	color					:	rgb(0,46,110);
}
/* List Photo Small */
ul.ListPhotoSmall
{
	margin					:	0px;
	padding					:	0px;
}
ul.ListPhotoSmall li
{
	display					:	inline-block;
	width					:	460px;
	margin					:	0px 0px 15px 0px;
	padding					:	0px 25px 0px 0px;
}
ul.ListPhotoSmall li div.PanelListPhotoSmall
{
	display					:	table;
	margin					:	0px;
	padding					:	0px;
}
ul.ListPhotoSmall li div.PanelListPhotoSmall div
{
	display					:	table-cell;
	vertical-align				:	middle;
}
div.PanelListPhotoSmallBullet
{
	width					:	40px;
	text-align				:	center;
}
div.PanelListPhotoSmallBullet img
{
	width					:	100%;
}
div.PanelListPhotoSmallComment
{
}
div.PanelListPhotoSmallComment b
{
	color					:	rgb(0,46,110);
}
div.PanelListPhotoSmallPhoto
{
	width					:	120px;
	padding					:	0px 15px;
}
div.PanelListPhotoSmallPhoto img
{
	width					:	100%;
	vertical-align				:	middle;
	border					:	solid 1px rgb(0,0,0);
}
/* List Photo Large */
ul.ListPhotoLarge
{
	margin					:	0px;
	padding					:	0px;
}
ul.ListPhotoLarge li
{
	display					:	inline-block;
	width					:	300px;
	margin					:	0px 35px 0px 0px;
	padding					:	0px;
	text-align				:	center;
}
ul.ListPhotoLarge li:nth-child(3n)
{
	margin-right				:	0px;
}
ul.ListPhotoLarge li img
{
	width					:	100%;
	margin					:	0px 0px 10px 0px;
}
/* Button */
dl.PanelAccordion a.LabelAnchorSub
{
	background-color				:	rgb(255,255,255);
	color					:	rgb(0,46,110);
	border					:	solid 1px rgb(0,46,110);
	border-radius				:	30px;
	transition				:	all 0.2s ease-out;
	-webkit-transition				:	all 0.2s ease-out;
	-moz-transition				:	all 0.2s ease-out;
	-o-transition				:	all 0.2s ease-out;
}
dl.PanelAccordion a.LabelAnchorSub:hover
{
	background-color			:	rgb(212,227,245);
}
dl.PanelAccordion a.LabelAnchorSub:after
{
	content					:	"↑";
}


/*
======================================
PC
======================================
*/
@media (min-width: 401px)
{
	/* Main */
	h1.PanelTitle
	{
		background-image			:	url( './image/Panel/BackgroundPc.jpg' );
	}

}

/*
======================================
Smart Phone
======================================
*/
@media (max-width: 400px)
{
	/* Body */
	#PanelBody
	{
		display					:	block;
		width					:	100%;
	}
	
	/* Menu */
	#PanelBusinessMenu
	{
		display					:	block;
		width					:	100%;
		margin					:	0px 0px 30px 0px;
		padding					:	0px;
		font-weight				:	bold;
	}
	#PanelBusinessMenuTitle
	{
		display					:	block;
		width					:	100%;
		margin					:	0px 0px 6px 0px;
		padding					:	10px 0px;
		font-size				:	16px;
	}
	#PanelBusinessMenuBody
	{
		display					:	block;
		padding					:	0px;
		font-size				:	14px;
	}
	#PanelBusinessMenuBody ul
	{
		margin					:	0px;
		padding					:	0px;
	}
	#PanelBusinessMenuBody ul li
	{
		display					:	inline-block;
		width					:	160px !important;
		margin					:	0px 0px 6px 0px;
		padding					:	10px 0px;
		border					:	solid 1px rgb(0,46,110);
	}
	#PanelBusinessMenu li:nth-child(2n-1)
	{
		margin-right				:	6px;
	}
	#PanelBusinessMenu li:last-child
	{
		width					:	305px;
	}
	#PanelBusinessMenu li:before
	{
		top					:	16px;
		width					:	6px;
		height					:	6px;
		margin					:	0px 5px 0px 0px;
	}

	/* Content */
	#PanelBodyContent
	{
		display					:	block;
		width					:	100%;
		padding					:	0px;
	}
	#PanelBodyContent h2
	{
		padding					:	0px 10px;
		font-size				:	24px;
		line-height				:	2em;
	}
	#PanelBodyContent h3
	{
		font-size				:	18px;
		line-height				:	1.8em;
	}
	#PanelBodyContent h4
	{
		margin					:	0px 0px 10px 0px;
		font-size				:	16px;
		line-height				:	1.8em;
	}


	/* Content */
	div.PanelLayoutPhoto
	{
		display					:	block;
		width					:	100%;
		padding					:	0px;
		text-align				:	center;
	}
	div.PanelLayoutPhoto img
	{
		width					:	100%;
	}
	div.PanelLayoutComment
	{
		display					:	block;
		width					:	100%;
		margin					:	0px 0px 15px 0px;
		padding					:	0px;
	}


	/* List Photo Small */
	ul.ListPhotoSmall
	{
		margin					:	0px;
		padding					:	0px;
	}
	ul.ListPhotoSmall li
	{
		display					:	block;
		width					:	100%;
		margin					:	0px 0px 10px 0px;
		padding					:	0px;
	}
	div.PanelListPhotoSmallBullet
	{
		width					:	20px;
		text-align				:	center;
	}
	div.PanelListPhotoSmallComment
	{
		line-height				:	1.6em;
	}
	div.PanelListPhotoSmallPhoto
	{
		width					:	70px;
		padding					:	0px 10px;
	}
	/* List Photo Large */
	ul.ListPhotoLarge
	{
		margin					:	0px;
		padding					:	0px;
	}
	ul.ListPhotoLarge li
	{
		display					:	block;
		width					:	100%;
		margin					:	0px 0px 15px 0px;
		padding					:	0px;
		text-align				:	center;
	}
	ul.ListPhotoLarge li img
	{
		width					:	80%;
		margin					:	0px 0px 5px 0px;
	}

}