@charset "utf-8";
/* CSS Document */


@media only screen and (min-width: 1251px) {   }


@media only screen and (min-width: 1024px) and (max-width: 1250px) {   /* ---- Tablet Landscape ---- */

#page_wrapper {			
	width:		1024px;
}
.header {
	position:		absolute;
	width:		1024px;
}
.title_wrapper {
	width:		1024px;
}
.title_wrapper h1 {
	width:		400px;
}

.title_wrapper h2 {
	width:		400px;
}
.kv_bg {
	width:		1024px;	
	margin-left:-512px;
}
#keyvisual {
	width:		1004px;
	margin-left:-502px;
}
.content_wrapper {
	width:		1024px;
}
.splitter {
	width:		624px;
}
.main_wrapper {
	width:				584px;
}
.footer_wrapper {
	width:				500px;
}

#cm_navigation ul li ul {
	min-width:				inherit;
	max-width:				inherit;
}



}



@media only screen and (min-width: 768px) and (max-width: 1023px) {    /* ---- Tablet Portrait ---- */


#page_wrapper {			
	width:			760px;
}
.header {
	position:		absolute;
	width:			760px;
}
#logo_wrapper {
	left:			10%;
}
.logo_bg_2 {
	left:			10%;
}
.logo_bg_1 {
	left:			10%;
}
.title_wrapper {
	width:			500px;
	top:			60px;
	left:			248px;
	overflow:		hidden;
	height:			60px;
}
.title_wrapper h1 {
	position:		relative;
	padding:		0px 0px 10px 0px;
	display:		block;
	width:			500px;
	text-overflow:	ellipsis;
}
.title_wrapper h2 {
	position:		relative;
	right:			auto;
	padding:		0px 0px 0px 0px;
	display:		block;
	width:			500px;
	text-overflow:	ellipsis;
}
.kv_bg {
	width:			760px;
	margin-left:	-384px;
}
#keyvisual {
	width:			740px;
	margin-left:	-374px;
}
.content_wrapper {
	width:		760px;
}
.splitter {
	width:		557px;
}
.main_wrapper {
	width:		517px;
}
.splitter {
	float:		left;
}
.sidebar.global {
	position:		relative;
	left:			auto;
	top:			auto;
	float:			left;
	border-radius:	0px 20px 20px 0px;
}
.sidebar.local {
	position:		relative;
	right:			auto;
	top:			auto;
	margin:			10px 0px 0px 0px;
	float:			left;
}
#widgetbar_site_1, #widgetbar_site_2, #widgetbar_site_3 {
}
.footer_wrapper {
	width:			432px;
}

#cm_navigation ul li ul {
	left:					-20px;
	top:					28px;
	list-style-type:		none;
	list-style-position:	inside;
	text-align:				left;
	margin:					0px;
	border-bottom:			1px solid;
	border-left:			1px solid;
	border-right:			1px solid;
	border-top:				none;
	min-width:				inherit;
	max-width:				inherit;
	
	-webkit-box-shadow:		0px 4px 4px rgba(0,0,0,0.4);
	box-shadow:				0px 4px 4px rgba(0,0,0,0.4);
	
	opacity:				0;
	filter: 				alpha(opacity=0);
	
	
	transition:				all 0.5s ease;
	-moz-transition:		all 0.5s ease; /* Firefox 4 */
	-webkit-transition:		all 0.5s ease; /* Safari and Chrome */
	-o-transition:			all 0.5s ease; /* Opera */
}
#cm_navigation ul li:hover ul li a {
	width:		160px;
	overflow:	hidden;
	text-overflow:	ellipsis;
	display:	block;
}		


}



@media only screen and (min-width: 1px) and (max-width: 767px) {    /* ---- Handy Landscape ---- */


#page_wrapper {			
	width:				96%;
}
.header {
	position:			relative;
	width:				100%;
	height:				auto;
	top:				auto;
}
#logo_wrapper {
	position:			relative;
	top:				0px;
	left:				auto;
	margin:				10px auto;
}
.logo_bg_2 {
	display:			none;
}
.logo_bg_1 {
	display:			none;
}
.title_wrapper {
	position:		relative;
	width:			100%;
	margin:			10px auto;
	top:			auto;
}
.title_wrapper h1 {
	position:		relative;
	left:			auto;
	width:			auto;
	padding:		0px 0px 10px 0px;
}
.title_wrapper h2 {
	position:		relative;
	right:			auto;
	width:			auto;
	border-radius:	50px;
	padding:		0px 0px 10px 0px;
}
#cm_navigation {
	position:		relative;
	width:			100%;
	margin:			10px auto;
	border:			none;
}
.kv_bg {
	display:		none;
}
#keyvisual {
	display:		none;
}
.content_wrapper {
	width:		100%;
	margin:		10px auto;
	padding:	10px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.splitter {
	width:		100%;
}
.main_wrapper {
	width:		87%;
}
.sidebar.global {
	display:		inline-block;
	position:		relative;
	left:			auto;
	top:			auto;
	margin:			5px 10px;
	vertical-align:	top;
	width:			46%;
	min-width:		200px;
	border-radius:	20px;
	-webkit-box-sizing:	border-box;
	-moz-box-sizing:	border-box;
	box-sizing:			border-box;
	
}
.sidebar.local {
	display:		inline-block;
	position:		relative;
	left:			auto;
	top:			auto;
	margin:			5px 10px;
	vertical-align:	top;
	width:			46%;
	min-width:		200px;
	border-radius:	20px;
	-webkit-box-sizing:	border-box;
	-moz-box-sizing:	border-box;
	box-sizing:			border-box;
}
#widgetbar_page_1, #widgetbar_page_2, #widgetbar_page_3 {
	margin-left:	0px;
}
.footer_wrapper {
	position:			relative;
	width:				100%;
	margin:				10px auto;
	border-radius:		20px;
	padding:	10px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}

#cm_navigation ul li {
	display:				inline-block;
	padding:				0px;
	width:					48%;
	vertical-align:			top;
	border-bottom:			3px double ${color.header.background-color};
}

#cm_navigation ul li a {
	margin:			2px 0px;
	overflow:				hidden;
	white-space:	nowrap;
	text-overflow:	ellipsis;
	vertical-align:			middle;
	display:	block;
}

#cm_navigation ul li a:hover, 
#cm_navigation ul li.cm_current a { 
	opacity: 				1;
	filter: 				alpha(opacity=100);
}




#cm_navigation > ul > li > ul {
	display:				block;
	position:				absolute;
	top:					auto;
	left:					0px;
	min-width:				100%;
	max-width:				100%;
	text-align:				left;
	margin:					0px;
	margin-top:				0px;
	border-bottom:			1px solid;
	border-left:			1px solid;
	border-right:			1px solid;
	border-top:				none;
	
	box-shadow:				0px 4px 4px rgba(0,0,0,0.4);
	
	opacity:				0;
	filter: 				alpha(opacity=0);
	
	
	transition:				all 0.5s ease;
	-moz-transition:		all 0.5s ease; /* Firefox 4 */
	-webkit-transition:		all 0.5s ease; /* Safari and Chrome */
	-o-transition:			all 0.5s ease; /* Opera */
	
	behavior: 			url('/.cm4all/handler.php/1,iepngfix,8,1'); 
}
#cm_navigation > ul > li > ul > li {
	position:				relative;
	float:					none;
	padding:				2px 0px 2px 5px;
	margin:					0px;
}
#cm_navigation > ul > li > ul > li > a {
	text-decoration:		none;
	padding:				3px;  
	text-shadow: 			none;
	letter-spacing: 		0px;
}



#cm_navigation ul li:hover ul li a {
	display:	block;
	width:		160px;
	overflow:	hidden;
	text-overflow:	ellipsis;
}		






}



@media only screen and (max-width: 479px) {  /* ---- HAndy Portrait ---- */

.sidebar.global {
	display:		block;
	position:		relative;
	left:			auto;
	top:			auto;
	margin:			5px auto;
	vertical-align:	top;
	width:			90%;
	min-width:		200px;
	
}
.sidebar.local {
	display:		block;
	position:		relative;
	left:			auto;
	top:			auto;
	margin:			5px auto;
	vertical-align:	top;
	width:			90%;
	min-width:		200px;
}

}