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

@media only screen and (min-width: 980px) and (max-width: 1279px) {    /* ---- Smaller Screens ---- */
	#content_wrapper,
	#header_wrapper {
		width: 940px;
	}
	#keyvisual, #keyvisual .cm-slides-addon {
		height: 420px;
		-webkit-background-size: cover !important;
		background-size: cover !important;
	}
	
	#content_main {
		width: 610px;
	}
	
	#title_wrapper,
	#header_wrapper p#big_title {
		width: 680px;
	}
	
}

@media only screen and (min-width: 10px) and (max-width: 979px) {    /* ---- Mobile ---- */

	#content_main {
		padding: 40px 0;
		width: 100%;
		min-width: 250px;
	}
	
	#head_wrapper_background {
		background: transparent;
	}
	
	#head_wrapper {
		height: auto;
		background: transparent;
	}
	#header_wrapper p#big_title {
		display:	none;
	}
	#logo {
		margin: 0 auto 5px auto;
	}
	
	#navigation_background {
		height: 95px;
		top: -75px;
	}
	
	#navigation_clipper {
		max-height: none;
		overflow: visible;
		position: static;
		width: auto;
	}
	
	#navigation_wrapper {
		margin: auto;
		padding: 0;
		float: none;
		text-align: center;
		max-width: none;
		height: auto;
		width: 100%;
		position: absolute;
		top: 20px;
	}
	
	#navigation_wrapper .marker {
		display: none;
	}
	
	#content_sidebar {
		float: none;
		margin: 0;
		width: auto;
		padding: 0 0 40px 0;
	}
	
	#header_wrapper {
		margin: 0 20px;
		padding-top: 20px;
		position: relative;
		height: 400px;
	}
	
	#keyvisual_wrapper {
		padding-top: 0;
		margin-top: -80px;
		margin-left: 0;
		position: relative;
	}
	
	#keyvisual, #keyvisual .cm-slides-addon  {
		height: 240px;
		border-width: 5px;
		background-position: center !important;
		-webkit-background-size:	cover !important;
		background-size:	cover !important;
	}
	#keyvisual_border {
		width: 70%;
		margin: 0 auto;
	}
	#keyvisual_shadow {
		width: 70%;
		margin: 0 auto;
	}
	#content_wrapper {
		width: auto;
		float: none;
		margin: 0 20px;
	}
	
	#footer_wrapper {
		padding: 20px;
	}
	
	#footer_wrapper a {
		display: inline-block;
		padding: 10px 0;
	}
	
	#container_content {
		margin: 0 15px;
	}
	
	#title_wrapper {
		text-align: center;
		float: none;
		margin: 0;
		padding-top: 20px;
		height: auto;
		position: relative;
		width: auto;
		top: 170px;
		margin:			20px 0 0 0;
	}
	#title, #subtitle {
		display: block;
		margin:	0 0 0.5em 0;
	}
	
	#title_separator {
		display: none;
	}
	
	#head_wrapper #subtitle_wrapper {
		display: block;
		text-align: center;
		width: auto;
		max-width: none;
	}
	
	#nav-dropdown-area {
		position: inherit;
		height: auto;
		width: auto;
		overflow-x: visible;
	}
	
	#head_wrapper h2#subtitle {
		display: block;
		margin-top: 42px;
	}
	
	#navigation_wrapper #cm_navigation {
		display: none;
		height: auto;
		margin: 0 auto;
		max-width: 300px;
		vertical-align: inherit;
		float: none;
	}
	
	#navigation_wrapper:hover #cm_navigation {
		display: inline-block;
	}
	
	#navigation_wrapper #nav-mobile-heading-wrapper {
		display: block;
	}
	
	#navigation_wrapper #nav-mobile-heading {
		display: inline-block;
	}
	
	#cm_navigation > ul {
		position:	relative;
		width:		100%;
		margin: 0;
		background: transparent;
		box-shadow: none;
		z-index: 100;
		padding-top: 3px;
	}
	
	#cm_navigation > ul > li {
		display: block;
	}
	
	#page_wrapper #cm_navigation > ul > li > a {
		text-align: center;
	}
	
	#cm_navigation > ul > li.cm_has_subnavigation > ul {
		position:		relative;
		display:		none;
		text-align:				center;
		top: 0;
		left: 0;
		margin: 0;	
		min-width: inherit;
		max-width: none;
		width: auto;
		padding: 0;
		margin-top: 10px;
	}

	#cm_navigation > ul > li.cm_has_subnavigation > ul > li {
		
	}

	#cm_navigation > ul > li.cm_has_subnavigation > ul > li > a {
		width:		auto;
		display: block;
		text-align: center !important;
	}
	
	#cm_navigation > ul > li.cm_has_subnavigation:hover > ul {
		display: block;
	}
	
	#cm_navigation > ul > li > ul > li > ul {
		padding: 0;
		margin: 10px 0 0;
		left: 0;
		position: relative;
		padding-bottom: 10px;
	}
	
	#cm_navigation > ul > li > ul > li > ul > li {
		
	}
	
	#cm_navigation > ul > li > ul > li > ul > li > a {
		width:		auto;
		display: block;
		text-align: center !important;
	}
	
	#header_wrapper p#big_title {
		float: none;
		width: auto;
		position: relative;
		top: 170px;
	}

}


@media only screen and (min-width: 1px) and (max-width: 590px) {
	
	
	#keyvisual, #keyvisual .cm-slides-addon  {
		height: 200px;
		border-width: 5px;
		background-position: center !important;
		-webkit-background-size:	cover !important;
		background-size:	cover !important;
	}
	#keyvisual_border {
		width: 95%;
		margin: 0 auto;
	}
	#keyvisual_shadow {
		width: 95%;
		margin: 0 auto;
	}
	
}