/* --------------------
     Common
--------------------*/

#Page {
background:#000;
color:#FFF;
	font-family:"YuMincho","Yu Mincho","Hiragino Mincho ProN","MS PMincho","Times New Roman",serif;
}

main {
width:100%;
margin:0;
padding:0
}

/* --------------------
     Front Header
--------------------*/



header#FrontHeader {
position:relative;
width:100%;
height:100vh;
height:100dvh;
background:#080808 url(../video/hero-poster.jpg) no-repeat center center;
background-size:cover;
z-index:100
}

/*#FrontHeaderBg {
position:absolute;
top:0;
left:0;
width:100vw;
height:100vh;
background:-webkit-linear-gradient(0,rgba(0,0,0,0.6),rgba(0,0,0,0.6),rgba(255,255,255,0),rgba(255,255,255,0),rgba(0,0,0,0.4),rgba(0,0,0,0.4));
background:-o-linear-gradient(0,rgba(0,0,0,0.6),rgba(0,0,0,0.6),rgba(255,255,255,0),rgba(255,255,255,0),rgba(0,0,0,0.4),rgba(0,0,0,0.4));
background:linear-gradient(0,rgba(0,0,0,0.6),rgba(0,0,0,0.6),rgba(255,255,255,0),rgba(255,255,255,0),rgba(0,0,0,0.4),rgba(0,0,0,0.4))
}*/

#FrontHeaderInner {
width:100%
}

header#FrontHeader .header-brand {
position:absolute;
top:30px;
left:50px;
width:170px;
height:74px
}

header#FrontHeader .header-brand a {
display:block;
width:170px;
height:74px;
background:url(../images/common/logo_white.svg) no-repeat;
text-indent:-10000px
}

header#FrontHeader .header-brand a:hover {
-webkit-transition:all .3s ease;
opacity:.7;
transition:all .3s ease
}

/* --------------------
     Front Menu
--------------------*/

header#FrontHeader nav ul#NavFirstLevel {
display:block;
float:right;
padding:70px 50px 0 250px
}

header#FrontHeader nav ul#NavFirstLevel li {
display:block;
float:left;
font-size:14px;
font-weight:700;
text-align:center;
line-height:100%
}

header#FrontHeader nav ul#NavFirstLevel li a {
color:#fff;
text-decoration:none
}

header#FrontHeader nav ul#NavFirstLevel li a:hover {
-webkit-transition:all .3s ease;
opacity:.7;
transition:all .3s ease
}

header#FrontHeader nav ul#NavFirstLevel li#NavTop {
width:auto;
padding:0 15px;
border-right:1px solid #fff
}

header#FrontHeader nav ul#NavFirstLevel li#NavService {
width:auto;
padding:0 15px;
border-right:1px solid #fff
}

header#FrontHeader nav ul#NavFirstLevel li#NavWorks {
width:auto;
padding:0 15px;
border-right:1px solid #fff
}

header#FrontHeader nav ul#NavFirstLevel li#NavCompany {
width:auto;
padding:0 15px;
border-right:1px solid #fff
}

header#FrontHeader nav ul#NavFirstLevel li#NavTeam {
width:auto;
padding:0 15px
}

header#FrontHeader nav ul#NavFirstLevel li#NavContact {
width:auto;
padding:0 15px;
font-family:"YuMincho","Yu Mincho","Hiragino Mincho ProN","MS PMincho","Times New Roman",serif;
font-size:14px;
font-weight:400
}

header#FrontHeader nav ul#NavFirstLevel li#NavContact a {
padding:15px 27px;
color:#fff;
background:#9F7A46;
-webkit-filter:drop-shadow(1px 3px 5px rgba(0,0,0,0.2));
-moz-filter:drop-shadow(1px 3px 5px rgba(0,0,0,0.2));
-ms-filter:drop-shadow(1px 3px 5px rgba(0,0,0,0.2));
filter:drop-shadow(1px 3px 5px rgba(0,0,0,0.2))
}

header#FrontHeader nav ul#NavFirstLevel li#NavLoginToggle {
display:none
}

header#FrontHeader nav ul#NavFirstLevel li#NavLogin {
width:auto;
padding:0 15px;
border-right:1px solid #fff
}

header#FrontHeader nav ul#NavFirstLevel li#NavLogin a {
padding:1px 0 1px 17px;
background:url(../images/common/icon_lock_white.svg) no-repeat;
background-size:contain;
background-position:left center
}

header#FrontHeader nav ul#NavFirstLevel li#NavLanguage {
width:75px;
padding:0 15px
}

header#FrontHeader nav ul#NavFirstLevel li#NavLanguage a {
padding:10px 0
}

header#FrontHeader nav ul#NavFirstLevel > li#NavLanguage {
position:relative
}

ul#NavSecondLevel {
position:absolute;
top:20px;
right:15px;
display:block;
border:1px solid #fff;
width:60px;
padding:15px 20px;
-webkit-transition:all .4s ease;
transition:all .4s ease;
opacity:0;
line-height:100%
}

ul#NavSecondLevel li {
display:block;
padding:8px 0;
text-align:center;
width:auto
}

ul#NavSecondLevel li a {
text-decoration:none
}

ul#NavSecondLevel li a:hover {
text-decoration:underline
}

li#NavLanguage:hover ul#NavSecondLevel {
top:28px;
visibility:visible;
opacity:1
}

ul#Nav2FirstLevel {
display:none
}

/* --------------------
     Front Title
--------------------*/

	


/*#FrontHeaderTitle h2 {
position:relative;
font-family:'Cormorant Garamond',serif;
font-weight:100;
font-size:69px;
line-height:100%;
margin:0 0 30px;
color:#fff;
letter-spacing:-.04em
}

#FrontHeaderTitle h2:after {
position:absolute;
content:" ";
display:block;
border-bottom:solid 1px #28789B;
bottom:-15px;
width:40px
}

#FrontHeaderTitle p {
font-family:"YuMincho","Yu Mincho","Hiragino Mincho ProN","MS PMincho","Times New Roman",serif;
font-weight:400;
font-kerning: inherit;
font-size:36px;
text-align: center;
color:#fff
}*/

#FrontScroll {
position:absolute;
bottom:-30px;
right:60px
}

#FrontScroll p {
border-right:1px solid #fff;
color:#fff;
text-transform:uppercase;
font-family:'Work Sans',sans-serif;
font-size:10px;
font-weight:400;
padding:20px 20px 60px 0
}

/* --------------------
     Global Menu
--------------------*/

#GlobalHeader {
background:#000;
box-shadow:0 6px 6px 0 rgba(0,0,0,.1);
height:80px;
position:fixed;
top:-200px;
width:100vw;
z-index:100
}

#GlobalHeaderInner {
height:200px;
width:100vw;
position:relative;
}

#GlobalHeader .header-brand {
height:49px;
left:55px;
position:absolute;
top:15px;
width:120px
}

#GlobalHeader .header-brand a {
background:url(../images/common/logo_white.svg) no-repeat;
display:block;
height:49px;
text-indent:-10000px;
width:120px
}

#GlobalHeader .header-brand a:hover {
-webkit-transition:all .3s ease;
opacity:.7;
transition:all .3s ease
}

#GlobalHeader nav ul#GlobalNavFirstLevel {
display:block;
float:right;
padding:36px 50px 0 200px
}

#GlobalHeader nav ul#GlobalNavFirstLevel li {
display:block;
float:left;
font-size:14px;
font-weight:700;
line-height:100%;
text-align:center
}

#GlobalHeader nav ul#GlobalNavFirstLevel li a {
color:#FFF;
text-decoration:none
}

#GlobalHeader nav ul#GlobalNavFirstLevel li a:hover {
-webkit-transition:all .2s ease;
opacity:.7;
transition:all .2s ease
}

#GlobalHeader nav ul#GlobalNavFirstLevel li.current a {
border-bottom:1px solid #28789B;
padding:0 0 6px
}

#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavTop {
border-right:1px solid #FFF;
padding:0 17px;
width:auto
}

#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavService {
border-right:1px solid #FFF;
padding:0 17px;
width:auto
}

#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavWorks {
border-right:1px solid #FFF;
padding:0 17px;
width:auto
}

#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavCompany {
border-right:1px solid #FFF;
padding:0 17px;
width:auto
}

#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavTeam {
padding:0 17px;
width:auto
}

#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavContact {
font-family:"YuMincho","Yu Mincho","Hiragino Mincho ProN","MS PMincho","Times New Roman",serif;
font-weight:400;
font-size:14px;
padding:0 12px;
width:auto
}

#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavContact a {
-moz-filter:drop-shadow(1px 2px 4px rgba(0,0,0,0.1));
-ms-filter:drop-shadow(1px 2px 4px rgba(0,0,0,0.1));
-webkit-filter:drop-shadow(1px 2px 4px rgba(0,0,0,0.1));
background:#9F7A46;
color:#fff;
filter:drop-shadow(1px 2px 4px rgba(0,0,0,0.1));
padding:14px 27px
}

#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavLoginToggle {
display:none
}

#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavLogin {
border-right:1px solid #eee;
padding:0 17px;
width:auto
}

#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavLogin a {
background:url(../images/common/icon_lock_black.svg) no-repeat;
background-position:left center;
background-size:contain;
padding:1px 0 1px 17px
}

#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavLanguage {
padding:0 15px;
width:75px
}

#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavLanguage a {
padding:10px 0
}

#GlobalHeader nav ul#GlobalNavFirstLevel > li#GlobalNavLanguage {
position:relative
}

ul#GlobalNavSecondLevel {
-moz-filter:drop-shadow(1px 2px 4px rgba(0,0,0,0.1));
-ms-filter:drop-shadow(1px 2px 4px rgba(0,0,0,0.1));
-webkit-filter:drop-shadow(1px 2px 4px rgba(0,0,0,0.1));
-webkit-transition:all .4s ease;
background:#fff;
border:1px solid #eee;
display:block;
filter:drop-shadow(1px 2px 4px rgba(0,0,0,0.1));
opacity:0;
padding:15px 20px;
position:absolute;
right:15px;
top:20px;
transition:all .4s ease;
width:60px
}

ul#GlobalNavSecondLevel li {
display:block;
padding:8px 0;
text-align:center;
width:auto
}

ul#GlobalNavSecondLevel li a {
text-decoration:none
}

ul#GlobalNavSecondLevel li a:hover {
text-decoration:underline
}

li#GlobalNavLanguage:hover ul#GlobalNavSecondLevel {
opacity:1;
top:28px;
visibility:visible
}

ul#GlobalNav2FirstLevel {
display:none
}

/* --------------------
     Philosophy
--------------------*/
.philosophy{
	margin: 60px 0 ;
}
.philosophy h4{
font-family:"YuMincho","Yu Mincho","Hiragino Mincho ProN","MS PMincho","Times New Roman",serif;
font-weight:400;
font-size:36px;
color:#fff;
line-height: 24px;
margin-bottom: 60px;
text-align:center
}
.philosophy span{
	font-size: 12px;
	text-align: center;
}

.philosophy p{
	font-family:"YuMincho","Yu Mincho","Hiragino Mincho ProN","MS PMincho","Times New Roman",serif;
	font-size: 16px;
	margin-bottom: 30px;
}

.philosophy img{
	margin: 0 auto;
}

/* --------------------
     FrontMenu
--------------------*/

#FrontMenu {
width:100%;
padding:100px 0;
background:#0A0A0A
}

#FrontMenu h3 {
position:relative;
font-size:11px;
font-family:"Work sans",serif;
text-transform:uppercase;
width:280px;
margin:0 0 50px;
padding:0 0 0 40px;
color:#fff;
letter-spacing:2px;
line-height:100%
}

#FrontMenu h3:after {
position:absolute;
content:" ";
top:5px;
left:0;
display:block;
border-bottom:solid 1px #5BA4CE;
width:25px
}

#FrontMenuInner {
width:100%
}

#FrontMenuDescription {
position:relative;
width:1180px;
margin:0 auto;
z-index:1
}

#FrontMenuDescription h4 {
font-family:"YuMincho","Yu Mincho","Hiragino Mincho ProN","MS PMincho","Times New Roman",serif;
font-weight:400;
font-size:36px;
color:#fff;
line-height: 24px;
margin-bottom: 60px;
text-align:center
}

#FrontMenuDescription span{
	font-size: 12px;
	text-align: center;
}

#FrontMenuDescription .BtnViewmoreBlack {
float:right;
position:relative;
z-index:2
}

#FrontMenuFeather {
position:absolute;
width:182px;
height:532px;
top:-210px;
left:120px;
z-index:1;
/*background:url(../images/common/feather.png) 0 0 repeat;*/
background-size:contain;
-webkit-transform:rotate(99deg);
-moz-transform:rotate(99deg);
-ms-transform:rotate(99deg);
-o-transform:rotate(99deg);
transform:rotate(99deg);
opacity:.05
}

#FrontMenuArea {
width:1200px;
margin:0 auto;
position:relative;
z-index:2
}

.FrontMenuBlock {
position:relative;
width:380px;
margin:0 10px;
height:550px;
float:left
}

.FrontMenuBlock div {
display:none
}

.FrontMenuBlock p {
position:relative;
width:380px;
height:550px;
line-height:100%;
text-align:center;
font-family:"YuMincho","Yu Mincho","Hiragino Mincho ProN","MS PMincho","Times New Roman",serif;
font-size:24px;
display:-webkit-flex;
display:flex;
-webkit-align-items:center;
align-items:center;
-webkit-justify-content:center;
justify-content:center;
}

.FrontMenuBlock p:after {
position:absolute;
content:" ";
display:block;
border-bottom:solid 1px #28789B;
bottom:240px;
width:50px
}

.FrontMenuBlock p a {
color:#fff
}

#FrontMenuBlock1 p {
background-image:url(../images/front/img02.jpg);
background-position:center right;
background-size:cover
}

#FrontMenuBlock2 p {
background-image:url(../images/front/img03.jpg);
background-position:center right;
background-size:cover
}

#FrontMenuBlock3 p {
background-image:url(../images/front/img04.jpg);
background-position:center right;
background-size:cover
}

/* --------------------
     Location
--------------------*/

#FrontLocation {
width:100vw;
height:670px;
background:url(../images/front/location/map.png) no-repeat;
background-size:contain;
background-color:#eee
}

#FrontLocation h3 {
position:relative;
font-size:11px;
font-family:"Work sans",serif;
text-transform:uppercase;
width:280px;
margin:0 0 50px;
padding:150px 0 0 40px;
color:#333;
letter-spacing:2px;
line-height:100%
}

#FrontLocation h3:after {
position:absolute;
content:" ";
top:155px;
left:0;
display:block;
border-bottom:solid 1px #5BA4CE;
width:25px
}

#FrontLocationInner {
margin:0 0 0 50%
}

#FrontLocationInner h4 {
position:relative;
font-family:"YuMincho","Yu Mincho","Hiragino Mincho ProN","MS PMincho","Times New Roman",serif;
font-weight:100;
font-size:28px;
line-height:160%;
margin:0 0 30px;
color:#222
}

#FrontLocationInner p {
width:550px;
font-size:12px;
margin:0 0 30px
}

/* --------------------
     Contact
--------------------*/

#FrontContact {
position:relative;
width:100vw;
height:570px;
padding:110px 0 0;
background:url(../images/front/footer_img.jpg) no-repeat center center;
background-size:cover;
background-position:center

}

#FrontContactInner {
width:1180px;
height:350px;
margin:0 auto;
padding:100px 100px 0;
background:rgb(10,10,10,0.7);
}

#FrontContactInner h3 {
width:450px;
padding:0 60px 0 0;
position:relative;
font-size:36px;
font-family:'Cormorant Garamond',serif;
line-height:160%;
margin:0 0 30px;
letter-spacing:-.04em;
color:#fff
}

#FrontContactInner h3:after {
position:absolute;
content:" ";
display:block;
border-bottom:solid 1px #9F7A46;
bottom:-10px;
width:40px
}

#FrontContactInner p {
float:left;
font-family:"YuMincho","Yu Mincho","Hiragino Mincho ProN","MS PMincho","Times New Roman",serif;
font-size:18px;
color:#fff;
letter-spacing:5px
}

#FrontContactInner p span {
font-size:.8em
}

#FrontContactInner .BtnContact {
float:right;
font-size:17px
}

#FrontContactInner .BtnContact a {
padding:20px 40px
}

/* --------------------
     Front Footer
--------------------*/

footer {
width:100%;
margin:0;
padding:15px;
background:#000
}

#FrontFooterInner {
width:1180px;
margin:0 auto 80px
}

#FrontFooterInner dl {
width:236px;
border-right:1px dotted #ccc;
float:left
}

#FrontFooterInner dl:nth-child(5) {
border-right:none
}

#FrontFooterInner dt {
padding:0 0 20px 15px;
font-family:'Work Sans',sans-serif;
font-size:9px;
text-transform:uppercase
}

#FrontFooterInner dd {
margin:0 auto;
width:180px;
text-align:center
}

#FrontFooterInner dd img {
width:100%;
height:auto
}

#FrontFooterLink {
width:1180px;
margin:0 auto 80px
}

#PrivacyPolicy {
float:right;
font-family:'Work Sans',sans-serif;
font-size:9px;
text-align:right;
text-transform:uppercase;
letter-spacing:.1em
}

#PrivacyPolicy a {
color:#fff;
text-decoration:none
}

#PrivacyPolicy a:hover {
text-decoration:none
}

address {
float:left;
font-family:'Work Sans',sans-serif;
font-size:9px;
letter-spacing:.1em
}





@media screen and (max-width: 1280px) {

	/* ----------------------------------------
		 under 1280px | Front Header
	----------------------------------------*/

	header#FrontHeader .header-brand {
	position:relative;
	top:30px;
	left:0;
	width:150px;
	height:68px;
	margin:0 auto
	}

	header#FrontHeader .header-brand a {
	display:block;
	width:150px;
	height:68px;
	background:url(../images/common/logo_white.svg) no-repeat;
	text-indent:-10000px
	}

	/* ----------------------------------------
		 under 1280px | Front Menu
	----------------------------------------*/

	header#FrontHeader nav {
	-webkit-overflow-scrolling:touch;
	background:#262626;
	bottom:0;
	display:block;
	opacity:0;
	overflow-x:hidden;
	overflow-y:auto;
	position:fixed;
	right:-200px;
	top:0;
	transition:all .5s;
	width:192px;
	z-index:3
	}

	header#FrontHeader .open nav {
	right:0;
	opacity:1
	}

	header#FrontHeader nav ul#NavFirstLevel {
	display:block;
	float:none;
	margin:0;
	padding:100px 0 25px;
	text-align:right
	}

	header#FrontHeader nav ul#NavFirstLevel li {
	font-size:13px;
	font-weight:700;
	border:none!important;
	display:block;
	float:none;
	margin-bottom:25px;
	padding:0;
	text-align:right;
	width:100%
	}

	header#FrontHeader nav ul#NavFirstLevel li#NavTop {
	padding:0 19px 0 0
	}

	header#FrontHeader nav ul#NavFirstLevel li#NavService {
	padding:0 19px 0 0
	}

	header#FrontHeader nav ul#NavFirstLevel li#NavLWoks {
	padding:0 19px 0 0
	}

	header#FrontHeader nav ul#NavFirstLevel li#NavCompany {
	padding:0 19px 0 0
	}

	header#FrontHeader nav ul#NavFirstLevel li#NavTeam {
	padding:0 19px 0 0
	}

	header#FrontHeader nav ul#NavFirstLevel li#NavLogin {
	display:none
	}

	header#FrontHeader nav ul#NavFirstLevel li#NavLoginToggle {
	display:block;
	margin-bottom:60px;
	padding:0 19px 0 0
	}

	header#FrontHeader nav ul#NavFirstLevel li#NavLoginToggle a {
	background:url(../images/common/icon_lock_white.svg) no-repeat;
	background-position:left center;
	background-size:contain;
	padding:2px 0 0 22px
	}

	header#FrontHeader nav ul#NavFirstLevel li#NavLanguage {
	display:none
	}

	header#FrontHeader nav ul#NavFirstLevel li#NavContact {
	font-size:16px;
	padding:0 19px 0 0
	}

	header#FrontHeader nav ul#NavFirstLevel li#NavContact a {
	padding:14px 24px
	}

	header#FrontHeader nav ul#NavFirstLevel li a {
	color:#fff;
	text-decoration:none
	}

	header#FrontHeader nav ul#NavFirstLevel li a:hover {
	transition-duration:.2s
	}

	#toggle_btn {
	display:block;
	position:fixed;
	top:30px;
	right:15px;
	width:30px;
	height:30px;
	transition:all .5s;
	cursor:pointer;
	z-index:100
	}

	#toggle_btn span {
	display:block;
	position:absolute;
	left:0;
	width:26px;
	height:1px;
	background-color:#fff;
	border-radius:4px;
	transition:all .5s
	}

	#toggle_btn span:nth-child(1) {
	top:4px
	}

	#toggle_btn span:nth-child(2) {
	top:14px
	}

	.open #toggle_btn span {
	background-color:#fff
	}

	.open #toggle_btn span:nth-child(1) {
	top:-1px;
	-webkit-transform:translateY(10px) rotate(-150deg);
	transform:translateY(10px) rotate(-150deg)
	}

	.open #toggle_btn span:nth-child(2) {
	top:19px;
	-webkit-transform:translateY(-10px) rotate(150deg);
	transform:translateY(-10px) rotate(150deg)
	}

	#mask {
	display:none;
	transition:all .5s
	}

	.open #mask {
	display:block;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:#000;
	opacity:.6;
	z-index:2;
	cursor:pointer
	}

	ul#Nav2FirstLevel {
	display:block;
	position:absolute;
	top:25px;
	left:25px;
	height:100px
	}

	ul#Nav2FirstLevel li {
	display:block;
	float:none;
	font-size:10px;
	text-align:left
	}

	ul#Nav2FirstLevel li a {
	color:#fff;
	text-decoration:none
	}

	ul#Nav2SecondLevel {
	position:absolute;
	top:20px;
	left:0;
	display:block;
	border:1px solid #fff;
	width:60px;
	padding:15px 20px;
	-webkit-transition:all .4s ease;
	transition:all .4s ease;
	opacity:0;
	line-height:100%
	}

	ul#Nav2SecondLevel li {
	display:block;
	padding:8px 0;
	text-align:center;
	width:auto
	}

	ul#Nav2SecondLevel li a {
	text-decoration:none
	}

	ul#Nav2SecondLevel li a:hover {
	text-decoration:none
	}

	li#Nav2Language:hover ul#Nav2SecondLevel {
	top:28px;
	visibility:visible;
	opacity:1
	}

	/* ----------------------------------------
		 under 1280px | Global Menu
	----------------------------------------*/

	#GlobalHeader .header-brand {
	height:49px;
	left:0;
	margin:0 auto;
	position:relative;
	top:15px;
	width:120px
	}

	#GlobalHeader .header-brand a {
	background:url(../images/common/logo_white.svg) no-repeat;
	display:block;
	height:49px;
	text-indent:-10000px;
	width:120px
	}

	#GlobalHeader .header-brand a:hover {
	-webkit-transition:all .3s ease;
	opacity:.7;
	transition:all .3s ease
	}

	#GlobalHeader nav {
	-webkit-overflow-scrolling:touch;
	background:#262626;
	bottom:0;
	display:block;
	opacity:0;
	overflow-x:hidden;
	overflow-y:auto;
	position:fixed;
	right:-200px;
	top:0;
	transition:all .5s;
	width:192px;
	z-index:101
	}

	#GlobalHeader .open_globalmenu nav {
	opacity:1;
	right:0
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel {
	display:block;
	float:none;
	margin:0;
	padding:100px 0 25px;
	text-align:right
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel li {
	font-size:13px;
	border:none!important;
	display:block;
	float:none;
	margin-bottom:25px;
	padding:0;
	text-align:right;
	width:100%
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavTop {
	padding:0 19px 0 0
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavService {
	padding:0 19px 0 0
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavLWoks {
	padding:0 19px 0 0
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavCompany {
	padding:0 19px 0 0
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavTeam {
	padding:0 19px 0 0
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavLogin {
	display:none
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavLoginToggle {
	display:block;
	margin-bottom:60px;
	padding:0 19px 0 0
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavLoginToggle a {
	background:url(../images/common/icon_lock_white.svg) no-repeat;
	background-position:left center;
	background-size:contain;
	padding:2px 0 0 22px
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavLanguage {
	display:none
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavContact {
	font-size:16px;
	padding:0 19px 0 0
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel li#GlobalNavContact a {
	padding:14px 24px
	}

	#GlobalHeader nav ul#GlobalNavFirstLevel li a {
	color:#fff;
	text-decoration:none
	}

	#GlobalToggleBtn {
	cursor:pointer;
	display:block;
	height:30px;
	position:fixed;
	right:15px;
	top:30px;
	transition:all .5s;
	width:30px;
	z-index:103;
	visibility:hidden
	}

	#GlobalToggleBtn span {
	background-color:#333;
	border-radius:4px;
	display:block;
	height:1px;
	left:0;
	position:absolute;
	transition:all .5s;
	width:26px
	}

	#GlobalToggleBtn span:nth-child(1) {
	top:4px
	}

	#GlobalToggleBtn span:nth-child(2) {
	top:14px
	}

	.open_globalmenu #GlobalToggleBtn span {
	background-color:#fff
	}

	.open_globalmenu #GlobalToggleBtn span:nth-child(1) {
	-webkit-transform:translateY(10px) rotate(-150deg);
	top:-1px;
	transform:translateY(10px) rotate(-150deg)
	}

	.open_globalmenu #GlobalToggleBtn span:nth-child(2) {
	-webkit-transform:translateY(-10px) rotate(150deg);
	top:19px;
	transform:translateY(-10px) rotate(150deg)
	}

	#GlobalToggleMask {
	display:none;
	transition:all .5s
	}

	.open_globalmenu #GlobalToggleMask {
	background:#000;
	cursor:pointer;
	display:block;
	height:100%;
	left:0;
	opacity:.6;
	position:fixed;
	top:0;
	width:100%;
	z-index:2
	}

	ul#GlobalNav2FirstLevel {
	display:block;
	font-weight:700;
	height:100px;
	left:20px;
	position:absolute;
	top:36px;
	z-index:100
	}

	ul#GlobalNav2FirstLevel li {
	display:block;
	float:none;
	font-size:10px;
	line-height:100%;
	padding:0;
	text-align:center
	}

	ul#GlobalNav2FirstLevel li a {
	color:#333;
	text-decoration:none
	}

	ul#GlobalNav2SecondLevel {
	-moz-filter:drop-shadow(1px 2px 4px rgba(0,0,0,0.1));
	-ms-filter:drop-shadow(1px 2px 4px rgba(0,0,0,0.1));
	-webkit-filter:drop-shadow(1px 2px 4px rgba(0,0,0,0.1));
	-webkit-transition:all .4s ease;
	background:#fff;
	border:1px solid #eee;
	display:block;
	filter:drop-shadow(1px 2px 4px rgba(0,0,0,0.1));
	left:0;
	opacity:0;
	padding:15px 20px;
	position:absolute;
	top:20px;
	transition:all .4s ease;
	width:60px
	}

	ul#GlobalNav2SecondLevel li {
	display:block;
	float:none;
	padding:8px 0;
	text-align:center;
	width:auto
	}

	ul#GlobalNav2SecondLevel li a {
	display:block;
	text-decoration:none
	}

	ul#GlobalNav2SecondLevel li a:hover {
	text-decoration:none
	}

	li#GlobalNav2Language:hover ul#GlobalNav2SecondLevel {
	opacity:1;
	top:24px;
	visibility:visible;
	z-index:1000
	}

	/* ----------------------------------------
		 under 1280px | About
	----------------------------------------*/

	#FrontAboutFeather {
	width:182px;
	height:532px;
	top:-60px;
	left:20px
	}

	#FrontAboutMV {
	width:55%;
	min-width:500px
	}

	#FrontAboutDescription {
	width:300px;
	padding:0 0 0 70px
	}

	/* ----------------------------------------
		 under 1280px | Design
	----------------------------------------*/

	#FrontTeamDescription {
	width:900px;
	margin:0 auto
	}

	#FrontTeamDescription h4 {
	width:240px;
	font-size:76px;
	margin:0 0 50px
	}

	#FrontTeamDescription h5 {
	width:460px;
	font-size:20px;
	margin:50px 0 20px
	}

	#FrontTeamFeather {
	width:182px;
	height:532px;
	top:-100px;
	left:35%;
	z-index:1;
	background:url(../images/common/feather.png) 0 0 repeat;
	background-size:contain;
	-webkit-transform:rotate(19deg);
	-moz-transform:rotate(19deg);
	-ms-transform:rotate(19deg);
	-o-transform:rotate(19deg);
	transform:rotate(19deg)
	}

	#FrontTeamMembers {
	width:930px;
	margin:0 auto;
	padding:70px 0 100px
	}

	.FrontTeamMembersBlock {
	width:465px
	}

	.FrontTeamMembersBlock h6 {
	width:210px;
	padding:0 15px 0 0;
	font-size:28px;
	line-height:120%;
	margin:0 0 30px
	}

	.FrontTeamMembersBlock h6:after {
	bottom:-10px;
	width:40px
	}

	.FrontTeamMembersBlock div {
	width:210px;
	padding:0 0 0 15px
	}

	.FrontTeamMembersBlock dl {
	width:210px;
	padding:0 15px 0 0
	}

	/* ----------------------------------------
		 under 1280px | Life Style
	----------------------------------------*/

	#FrontMenuArea {
	width:920px;
	margin:0 auto
	}

	#FrontMenuDescription {
	width:900px;
	margin:0 auto
	}

	.FrontMenuBlock {
	position:relative;
	width:286px;
	margin:0 10px;
	height:550px;
	float:left
	}

	.FrontMenuBlock p {
	width:100%
	}

	/* ----------------------------------------
		 under 1280px | Location
	----------------------------------------*/

	#FrontLocation {
	width:100vw;
	height:670px
	}

	#FrontLocationInner {
	margin:0 0 0 68%
	}

	#FrontLocationInner h4 {
	font-size:24px;
	margin:0 0 30px
	}

	#FrontLocationInner p {
	width:250px;
	margin:0 0 30px
	}

	/* ----------------------------------------
		 under 1280px | Contact
	----------------------------------------*/

	#FrontContactInner {
	width:900px;
	height:350px;
	padding:100px 70px 0
	}

	/* ----------------------------------------
		 under 1280px | Front Footer
	----------------------------------------*/

	#FrontFooterInner {
	width:900px;
	margin:0 auto 60px
	}

	#FrontFooterInner dl {
	width:179px
	}

	#FrontFooterInner dt {
	padding:0 0 20px 15px
	}

	#FrontFooterInner dd {
	width:150px
	}

	#FrontFooterLink {
	width:900px;
	margin:0 auto 80px
	}

}

@media screen and (max-width: 960px) {

	.PcView {
	display:none
	}

	.SpView {
	display:block
	}



	/* ----------------------------------------
		 under 960px | Front Header
	----------------------------------------*/

/*	#FrontHeaderBg {
	background:-webkit-linear-gradient(0,rgba(0,0,0,0.8),rgba(0,0,0,0.6),rgba(0,0,0,0.5),rgba(0,0,0,0.3),rgba(0,0,0,0.4),rgba(0,0,0,0.5));
	background:-o-linear-gradient(0,rgba(0,0,0,0.8),rgba(0,0,0,0.6),rgba(0,0,0,0.5),rgba(0,0,0,0.3),rgba(0,0,0,0.4),rgba(0,0,0,0.5));
	background:linear-gradient(0,rgba(0,0,0,0.8),rgba(0,0,0,0.6),rgba(0,0,0,0.5),rgba(0,0,0,0.3),rgba(0,0,0,0.4),rgba(0,0,0,0.5))
	}*/



	

/*	#FrontHeaderTitle h2 {
	font-size:50px;
	margin:0 0 30px
	}

	#FrontHeaderTitle p {
	font-size:18px;
	margin:0 0 25px;
	color:#fff
	}*/

	#FrontScroll {
	bottom:0;
	right:6%
	}

	#FrontScroll p {
	padding:20px 20px 60px 0
	}


	/* ----------------------------------------
		 under 960px | About
	----------------------------------------*/

	#FrontAbout {
	padding:70px 0 0
	}

	#FrontAbout h3 {
	width:100%;
	margin:0 0 30px;
	padding:0 0 0 6%
	}

	#FrontAbout h3:after {
	width:4%
	}

	#FrontAboutFeather {
	width:182px;
	height:532px;
	top:-150px;
	left:48%
	}

	#FrontAboutMV {
	float:none;
	width:100%;
	min-width:inherit;
	margin:0 0 10px
	}

	#FrontAboutDescription {
	float:none;
	width:88%;
	padding:0 6%
	}

	#FrontAboutDescription h4 {
	font-size:67px;
	line-height:100%;
	margin:0 0 30px
	}

	#FrontAboutDescription h4:after {
	bottom:-15px;
	width:50px
	}

	#FrontAboutDescription h5 {
	font-size:24px;
	line-height:160%;
	margin:0 0 20px
	}

	#FrontAboutSlide,#FrontDesignSlide {
	width:100%;
	height:auto;
	background:#f7f8fa;
	padding:0;
	margin:0
	}

	#FrontAboutSlideWrapper,#FrontDesignSlideWrapper {
	width:100%;
	height:auto;
	margin:0;
	padding:0 0 50px
	}

	#FrontAboutSlideArrows,#FrontDesignSlideArrows {
	position:relative;
	width:110px;
	float:right;
	margin:-65px 6% 0 0;
	padding:0 0 10px;
	z-index:1000
	}

	#FrontAboutSlide-prev,#FrontDesignSlide-prev {
	top:0;
	left:0
	}

	#FrontAboutSlide-next,#FrontDesignSlide-next {
	top:0;
	right:0
	}

	#FrontAbout .BtnViewmoreWhite {
	width:88%;
	margin:0 6%
	}

	#FrontAbout .BtnViewmoreWhite a {
	width:100%;
	text-align:right;
	display:block
	}



	/* ----------------------------------------
		 under 960px | philosopjy
	----------------------------------------*/
	.philosophy h4{
	font-size:24px
	}


	/* ----------------------------------------
		 under 960px | FrontMenu
	----------------------------------------*/

	#FrontMenu {
	width:100%;
	padding:70px 0 50px;
	background:#0A0A0A
	}

	#FrontMenu h3 {
	width:100%;
	margin:0 0 30px;
	padding:0 0 0 6%
	}

	#FrontMenu h3:after {
	width:4%
	}

	#FrontMenuInner {
	width:100%
	}

	#FrontMenuDescription {
	width:88%;
	margin:0 6% 50px
	}

	#FrontMenuDescription h4 {
	float:none;
	width:100%;
	font-size:24px;
	line-height:140%;
	margin:0;
	padding:0
	}

	#FrontMenuArea {
	width:88%;
	margin:0 auto
	}

	.FrontMenuBlock {
	position:relative;
	width:100%;
	height:250px;
	margin:0 0 30px;
	float:none
	}

	.FrontMenuBlock p {
	width:100%;
	height:250px;
	line-height:100%;
	font-size:24px
	}

	.FrontMenuBlock p:after {
	bottom:90px;
	width:50px
	}

	.FrontMenuBlock p a {
	color:#fff
	}

	#FrontMenuBlock1 p {
	background-position:center right
	}

	#FrontMenuBlock2 p {
	background-position:center right
	}

	#FrontMenuBlock3 p {
	background-position:center right
	}

	#FrontMenu .BtnViewmoreBlack {
	width:88%;
	margin:0 6%
	}

	#FrontMenu .BtnViewmoreBlack a {
	width:100%;
	text-align:right;
	display:block
	}


	/* ----------------------------------------
		 under 960px | Contact
	----------------------------------------*/

	#FrontContact {
	width:100vw;
	height:auto;
	padding:100px 0;
	background-position:center
	}

	#FrontContactInner {
	width:100%;
	height:auto;
	margin:0 auto;
	padding:50px 0 60px
	}

	#FrontContactInner h3 {
	width:88%;
	margin:0 auto 30px;
	padding:0;
	font-size:36px
	}

	#FrontContactInner p {
	float:none;
	width:88%;
	font-size:14px;
	margin:0 auto 30px
	}

	#FrontContactInner .BtnContact {
	float:none;
	font-size:18px;
	width:85%;
	margin:0 0 0 6%;
	text-align:center
	}

	#FrontContactInner .BtnContact a {
	display:block;
	padding:14px 40px
	}

	/* ----------------------------------------
		 under 960px | Front Footer
	----------------------------------------*/

	footer {
	width:100%;
	margin:0;
	padding:2em 0 1em
	}

	#FrontFooterInner {
	width:90%;
	margin:0 auto 40px
	}

	#FrontFooterInner dl {
	width:50%;
	border-right:1px dotted #ccc;
	float:left;
	margin-bottom:20px
	}

	#FrontFooterInner dl:nth-child(1),#FrontFooterInner dl:nth-child(3),#FrontFooterInner dl:nth-child(5) {
	border-right:1px dotted #ccc
	}

	#FrontFooterInner dl:nth-child(2),#FrontFooterInner dl:nth-child(4) {
	border-right:none
	}

	#FrontFooterInner dt {
	padding:0 0 15px 15px;
	font-family:'Work Sans',sans-serif;
	font-size:9px;
	text-transform:uppercase
	}

	#FrontFooterInner dd {
	margin:0 auto;
	width:75%;
	text-align:center
	}

	#FrontFooterInner dd img {
	width:100%;
	height:auto;
	margin:0 auto
	}

	#FrontFooterLink {
	width:90%;
	margin:0 auto 4em
	}

	#PrivacyPolicy {
	width:100%;
	float:none;
	margin:0 0 2em;
	font-family:'Work Sans',sans-serif;
	font-size:9px;
	text-align:center;
	text-transform:uppercase;
	letter-spacing:.1em
	}

	#PrivacyPolicy a {
	color:#fff
	}

	address {
	width:100%;
	float:none;
	font-family:'Work Sans',sans-serif;
	font-size:9px;
	text-align:center;
	letter-spacing:.1em
	}
}





@media screen and (max-width: 560px) {

	.PcView {
	display:none
	}

	.SpView {
	display:block
	}

	/* ----------------------------------------
		 under 560px | Front Header
	----------------------------------------*/

	/* The hero keeps its full viewport height on small screens as well. */
	/* ----------------------------------------
		 under 560px | Design
	----------------------------------------*/

	#FrontTeamArchitect h6 {
	-webkit-transform:translateY(12px) rotate(90deg);
	transform:translateY(12px) rotate(90deg)
	}

	#FrontTeamInterior h6 {
	-webkit-transform:translateY(12px) rotate(90deg);
	transform:translateY(12px) rotate(90deg)
	}

	/* ----------------------------------------
		 under 560px | Front Menu
	----------------------------------------*/

	.FrontMenuBlock {
	position:relative;
	width:100%;
	height:170px;
	margin:0 0 15px;
	float:none
	}

	.FrontMenuBlock p {
	width:100%;
	height:170px;
	line-height:100%;
	font-size:16px
	}

	.FrontMenuBlock p:after {
	bottom:65px;
	width:30px
	}

	/* ----------------------------------------
		 under 560px | Location
	----------------------------------------*/

	#FrontLocationInner p {
	width:80%;
	font-size:12px;
	margin:0 0 30px
	}

	#FrontLocation {
	background-position:-220px 110px;
	background-size:cover
	}

	/* ----------------------------------------
		 under 560px | Contact
	----------------------------------------*/

	#FrontContact {
	background-position:-150px 0
	}

}
/* Hero statement: native Mincho type, two lines anchored to the lower left. */
#FrontHeader .hero-copy {
    position: absolute;
    left: clamp(32px, 6vw, 112px);
    bottom: clamp(48px, 9vh, 112px);
    max-width: calc(100% - 64px);
    color: #fff;
    text-align: left;
}
#FrontHeader .hero-copy h1 {
    margin: 0;
    font-family: "YuMincho", "Yu Mincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "MS PMincho", serif;
    font-size: var(--type-hero);
    font-weight: 400;
    line-height: 1.65;
    letter-spacing: .08em;
    text-shadow: 0 2px 18px rgba(0, 0, 0, .28);
}
#FrontHeader .hero-copy .hero-line {
    display: block;
    white-space: nowrap;
}
#FrontHeader .hero-copy .hero-phrase {
    display: inline-block;
}
#FrontHeader .hero-copy .hero-kana {
    font-size: 66.6667%;
}
@media screen and (max-width: 768px) {
    #FrontHeader .hero-copy {
        left: 24px;
        bottom: max(48px, calc(env(safe-area-inset-bottom) + 32px));
        max-width: calc(100% - 48px);
    }
    #FrontHeader .hero-copy h1 {
        font-size: var(--type-hero);
        line-height: 1.85;
        letter-spacing: .04em;
    }
}

/* Full-bleed silent video; the poster remains available while video loads. */
#FrontHeader .hero-video {
    position: absolute;
    inset: 0;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    pointer-events: none;
}
#FrontHeader::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(0, 0, 0, .24), rgba(0, 0, 0, .08) 40%, rgba(0, 0, 0, .5));
    pointer-events: none;
}
#FrontHeader > #FrontHeaderBg {
    position: relative;
    z-index: 2;
    height: 100%;
}