@charset "utf-8";

.content_wrapper h1, .content_wrapper h2, .content_wrapper h3, .content_wrapper h4, .content_wrapper h5, .content_wrapper h6 {
	margin:			0 0 0.7em 0;
}
.content_wrapper p, .content_wrapper code, .content_wrapper pre, .content_wrapper kbd {
	margin:			0 0 1em 0;
}
a {
	outline:		none;
}


html, body {
	margin:		0px;
	padding:	0px;
}
body {
}
.inner_wrapper {
	width:		1040px;
	margin:		0 auto;
	position:	relative;
}
.main_wrapper {
	line-height:	1.5;
	word-wrap:		break-word;
}
	#keyvisual {
		margin:		145px 0 0 0;
	}
	#keyvisual, #keyvisual .cm-slides-addon {
		background-position:	center;
		-webkit-background-size:cover;
		background-size:		cover;
		position:				relative;
		width:					100%;
		height:					325px;
	}
			.title_wrapper {
				position:		absolute;
				bottom:			30px;
				width:			100%;
				text-align: 	center;
			}
					.title_wrapper .bigtitle {
						font-size:		4vw !important;
						margin-bottom:	0.3em;
					}
	.content_wrapper {
		border-bottom:	2px solid transparent;
	}
			.design_content {
				width:		1040px;
				padding:	45px 30px;
				margin:		0 auto;
				position:	relative;
			}
			.design_content a {
				text-decoration: underline;
			}
	.sidebar_wrapper  {
		border-bottom:	2px solid transparent;
	}
			.sidebar_wrapper > .inner_wrapper {
				padding:	40px 0;
			}
			.sidebar {
				display:		inline-block;
				vertical-align:	top;
				width:			-webkit-calc(25% - 18.75px);
				width:			calc(25% - 18.75px);
				margin:			0 25px 0 0;
			}
			.sidebar a {
				text-decoration: underline;
			}
					.sidebar:last-child {
						margin:		0;
					}
	.footer_wrapper > .inner_wrapper {
		padding:		40px 0;
		text-align:		center;
	}

.scroll-up {
	position:	fixed;
	bottom:		-70px;
	right:		40px;
	font-size:	2.5vw;
	-webkit-transform: 	rotate(-100deg);
	transform: 	rotate(-100deg);
    padding: 	8px 4px 8px 13px;
    text-align: center;
    border-radius: 50%;
	cursor:		pointer;
	
	-webkit-transition:	transform 0.6s ease-in-out, bottom 0.6s cubic-bezier(.1,.7,.5,1.9);
	transition:			transform 0.6s ease-in-out, bottom 0.6s cubic-bezier(.1,.7,.5,1.9);
}
		.fixed .scroll-up {
			-webkit-transform:	rotate(0deg);
			transform:			rotate(0deg);
			bottom:				40px;
		}

.head_wrapper {
	position:		fixed;
	top:			0;
	left:			0;
	width:			100%;
	height:			145px;
	border-bottom:	2px solid transparent;
	
	-webkit-transition:	height 0.4s;
	transition:			height 0.4s;
}
.fixed .head_wrapper {
	height:			45px;
}
		#logo {
			display:		inline-block;
			width:			180px;
			height:			145px;
			vertical-align:	top;
			
			-webkit-transition:	height 0.4s, background-size 0.4s, background-position 0.4s;
			transition:			height 0.4s, background-size 0.4s, background-position 0.4s;
		}
		.fixed #logo {
			height:			45px;
			background-size:	contain !important;
			background-position:	center top !important;
		}
		.mobile_navigation {
			display:		none;
			vertical-align:	top;
			text-align:		center;
			padding:		7px 0;
		}
				.mobile_navigation a {
					text-decoration:	none;
				}
		.navigation_wrapper {
			display:		inline-block;
			-webkit-width:	calc(100% - 180px);
			width:			calc(100% - 180px);
			height:			145px;
			text-align:		right;
			vertical-align:	top;
			
			-webkit-transition:	height 0.4s, transform 0.4s;
			transition:			height 0.4s, transform 0.4s;
		}
		.fixed .navigation_wrapper {
			height:			45px;
		}
				.navigation_wrapper > ul {
					list-style: none;
					margin:		0;
					padding:	0;
					height:		100%;
				}
						.navigation_wrapper > ul > li {
							display:	inline-block;
							height:		100%;
							padding:	0 0 5px 0;
							margin:		0;
							position:	relative;
							vertical-align:	top;
						}
						.navigation_wrapper	> ul > li .triangle {
							display:		block;
							position:		absolute;
							top:			145px;
							left:			0;
							width:			0;
							height:			0;
							border-left:	0px solid transparent;
							border-right:	0px solid transparent;
							
							-webkit-transition:	top 0.4s, border-top 0.4s cubic-bezier(.1,.7,.5,1.9);
							transition:			top 0.4s, border-top 0.4s cubic-bezier(.1,.7,.5,1.9);
						}
						.fixed .navigation_wrapper	> ul > li .triangle {
							top:	45px;
						}
						.navigation_wrapper	> ul > li > ul .innerangle {
							top:	auto;
							bottom:	-17px;
						}
						.fixed .navigation_wrapper > ul > li > ul .innerangle {
							top:	auto;
							bottom:	-17px;
						}
								.navigation_wrapper > ul > li > a {
									display:			block;
									box-sizing:			border-box;
									height:				100%;
									padding:			7rem 20px 0 20px;
									text-decoration:	none;
									
									-webkit-transition:	padding 0.3s, color 0.3s, background-color 0.3s, padding 0.3s;
									-moz-transition:	padding 0.3s, color 0.3s, background-color 0.3s, padding 0.3s;
									transition:			padding 0.3s, color 0.3s, background-color 0.3s, padding 0.3s;
								}
								.fixed .navigation_wrapper > ul > li > a {
									padding:			0 20px 0 20px;
									line-height:		45px;
								}
								.navigation_wrapper li.cm_has_subnavigation > a:after {
									content:			"»";
									display:			inline-block;
									position:			absolute;
									vertical-align:		middle;		
									margin-left:		8px;
													
									-webkit-transition:	color 0.3s, background-color 0.3s;
									-moz-transition:	color 0.3s, background-color 0.3s;
									transition:			color 0.3s, background-color 0.3s;			
								}
								.navigation_wrapper > ul > li.cm_has_subnavigation > a {
									padding:			7rem 2em 0 20px;
								}
								.fixed .navigation_wrapper > ul > li.cm_has_subnavigation > a {
									padding:			0 1.4em 0 20px;
								}
								
								.navigation_wrapper > ul > li > ul {		/* SUBNAVIGATION  */
									display:	block;
									list-style:	none;
									position:	absolute;
									top:		145px;
									min-width:	170px;
									left:		0;
									margin:		0;
									padding:	0;	
									visibility:	hidden;
									opacity:	0;
									transform-origin:	top;
									transform:	scale(1,0);
									z-index: 1;
									
									-webkit-transition:	transform 0.3s ease-in-out 0.5s, opacity 0.3s ease-in-out 0.5s, visibility 0.3s ease-in-out 0.5s;
									transition:	transform 0.3s ease-in-out 0.5s, opacity 0.3s ease-in-out 0.5s, visibility 0.3s ease-in-out 0.5s;		
								}
								.navigation_wrapper > ul > li:last-child > ul {
									left:		auto;
									right:		0;
								}
								.fixed .navigation_wrapper > ul > li > ul {
									top:		45px;
								}
								.navigation_wrapper > ul > li:hover > ul {
									transform:	scale(1,1);
									opacity:	1;
									visibility:	visible;
									
									-webkit-transition:	transform 0.3s ease-in-out 0.1s, opacity 0.3s ease-in-out 0.1s, visibility 0.3s ease-in-out 0.1s;
									transition:			transform 0.3s ease-in-out 0.1s, opacity 0.3s ease-in-out 0.1s, visibility 0.3s ease-in-out 0.1s;		
								}		
										.navigation_wrapper > ul > li > ul > li {
											display:	block;
											margin:		0;
											position:	relative;
											text-align:	center;
										}
												.navigation_wrapper > ul > li > ul > li > a {
													display:			block;
													padding:			7px;
													word-wrap:			break-word;
													text-decoration:	none;
													
													-webkit-transition:	color 0.3s, background-color 0.3s;
													-moz-transition:	color 0.3s, background-color 0.3s;
													transition:			color 0.3s, background-color 0.3s;
												}	
												.navigation_wrapper > ul > li > ul > li:first-child > a {
													padding:	25px 7px 7px 7px;
												}
												.navigation_wrapper > ul > li > ul > li.cm_has_subnavigation > a {
													padding:	7px 1.4em 7px 7px;
												}
												.navigation_wrapper > ul > li > ul > li:first-child.cm_has_subnavigation > a {
													padding:	27px 1.4em 7px 7px;
												}
												
														.navigation_wrapper > ul > li > ul > li > ul {		/* SUB SUB NAVIGATION  */
															list-style:			none;
															margin:				0;
															padding:			0;
															position:			relative;
															width:				100%;
														}													
																.navigation_wrapper > ul > li > ul > li > ul > li {
																	margin:		0;
																	padding:	0;
																	position:	relative;
																}
																		.navigation_wrapper > ul > li > ul > li > ul > li > a {
																			display:			block;
																			padding:			8px;
																			word-wrap:			break-word;
																			text-decoration:	none;
																			
																			-webkit-transition:	color 0.3s, background-color 0.3s;
																			-moz-transition:	color 0.3s, background-color 0.3s;
																			transition:			color 0.3s, background-color 0.3s;
																		}