@charset "utf-8";
header#site-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 0 33px;
	z-index:3;
	transition: 0.3s background ease;
}
header#site-header.scrolled, 
body.page-child header#site-header,
body.single header#site-header,
body.blog header#site-header{
    background-color: #000000;
}

header#site-header .container-header {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
	height:135px;
}
header#site-header .socials{
	position:relative;
	border-left:1px solid rgba(255,255,255,0.5);
}
header#site-header .socials ul, header#site-header .socials ul li{
	position:relative;
	padding:0;
	margin:0;
	list-style:none;
}
header#site-header .socials ul li{
	position:relative;
	display:inline-block;
	margin-left:24px;
	font-size:24px;
}
header#site-header .socials ul li a, 
header#site-header .socials ul li a:hover, 
header#site-header .socials ul li a:active, 
header#site-header .socials ul li a:focus{
	color:#ffffff;
	text-decoration:none
}
header#site-header .socials-languages {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
}
header#site-header .languages{
	position:relative;
	margin-right:24px;
}
header#site-header .languages .languages-icon img{
	position:relative;
	cursor:pointer;
}
header#site-header .languages .languages-icon img:nth-child(2){
	margin-left:5px;	
	transition:transform .3s ease;
}
header#site-header .languages .languages-icon img.rotated{
	transform:rotate(180deg);	
}
header#site-header .language-switcher {
    /* display: none; */
    position: absolute;
    padding: 20px;
    /*background-color: rgba(0, 0, 0, 0.3);
    border-radius: 5px;
	border:1px solid #ffffff;*/
	top: 0px;
	opacity: 0;  
	pointer-events: none;    
	transition:
		transform 0.3s ease,  
		opacity   0.3s ease;  
	background:url(/wp-content/themes/vkdynamic/assets/img/box.svg) no-repeat top center;
	background-size:auto;
}
header#site-header .language-switcher.open {
  transform: translateY(55px); 
  opacity: 1;            
  pointer-events: auto;     
}
/*header#site-header .language-switcher:before {
    content:"";
	position:absolute;
	width:14px;
	height:14px;
    background-image: linear-gradient(
        230deg,
        rgba(0, 0, 0, 0.3)   0%,
        rgba(0, 0, 0, 0.3)  50%,
        transparent        50%,
        transparent       100%
    );
	border-top:1px solid #ffffff;
	border-right:1px solid #ffffff;
	transform: rotate(-45deg);
    top: -7px;
	left:12px;
}*/

header#site-header .language-switcher li{
    position: relative;
	display:block;
	padding:10px 0;
	margin:0;
	list-style:none;
	border-bottom:1px solid #ffffff;
	color:#ffffff;
	font-size:14px;
	font-weight:500;
	text-transform:uppercase;
}
header#site-header .language-switcher li:last-child{
	border-bottom:0;
}
header#site-header .language-switcher li a{
    position: relative;
	text-transform:uppercase;
	color:#ffffff;
	font-size:14px;
	font-weight:500;
}
header#site-header .logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}
header#site-header .icon-menu {
    z-index: 3;
    position: relative;
}
header#site-header .icon-menu img {
    transition: filter 0.3s ease, transform 0.3s ease;
	cursor:pointer;
}
header#site-header .icon-menu.active img {
    filter: brightness(0);
	transform:rotate(90deg)
}
div#mobile-menu {
    position: fixed;
    right: 0;
    top: -100px;
    height: 100vh;
    z-index: 2;
	opacity: 0;  
	pointer-events: none;    
	transition:
		top 0.3s ease,  
		opacity   0.3s ease;  
}
div#mobile-menu.open {
    top: 0px;
  	opacity: 1;            
  	pointer-events: auto;  
	overflow-y:auto;
}
div#mobile-menu .container-mobile-menu, div#mobile-menu .menu{
	min-height: 100vh;
}
div#mobile-menu .menu{
	padding:63px 120px 63px 94px;
	background-size:auto;
	background-repeat:no-repeat;
	background-position: right 30px bottom 65px;
	display: block;
	position:relative;
	z-index:2;
	opacity:0;
	pointer-events: none;   
	background-color: #D9D9D9;
	transition:
		opacity 0.3s ease 0.3s;  
	float:right;
}
div#mobile-menu.open .menu{
	opacity:1;
	pointer-events: auto;    
}
div#mobile-menu .menu nav ul{
	position:relative;
	padding:0;
	margin:0;
}
div#mobile-menu .menu nav ul li{
	position:relative;
	list-style:none;
}
div#mobile-menu .menu nav>ul>li{
	margin-bottom:12px;
}
div#mobile-menu .menu nav>ul>li:before{
	content:"";
	width:89px;
	height:1px;
	background-color:rgba(0,0,0,0.2);
	display: block;
    position: absolute;
    left: -94px;
    top: 17px;
}
div#mobile-menu .menu nav>ul>li>a{
	color:#000000;
	font-size:17px;
	font-weight:500;
	text-transform:uppercase;
}
div#mobile-menu .menu li.has-children ul a{
	color:#000000;
	font-size:12px;
	font-weight:400;
	text-transform:uppercase;
}
div#mobile-menu .menu-image {
    top: 0;
    min-width: 430px;
    position: relative;
	right:-430px;
    background-size: cover;
    min-height: 100vh;
	z-index:1;
	pointer-events: none;  
	opacity:0;
	transition:
		right 0.3s ease 0.6s, opacity 0.3s ease 0.6s;  
	float:left;
}
div#mobile-menu.open .menu-image {
	right:0px;
	opacity:1;
}
#main-visual{
	min-height:100vh;
	position:relative;
	width:100%;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
	display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: flex-end;
    align-items: center;
	z-index:2;
	margin-bottom:170px;
}
#main-visual:before{
	content:"";
	position:absolute;
	z-index:1;
	background-color:rgba(0,0,0,0.4);
	width:100%;
	height:100%;
}
#main-visual .main-visual-content{
	position:relative;
	max-width:1920px;
	padding:0 20px 200px;
	z-index:2;
}
#main-visual h1{
	position:relative;
	font-size:50px;
	font-weight:bold;
	margin:0;
	color:#ffffff;
	text-align:center;
}
#main-visual p{
	position:relative;
	font-size:45px;
	font-weight:300;
	margin:0;
	color:#ffffff;
	text-align:center;
}
.main-visual-decoration{
	position:absolute;
	bottom:170px;
	left:50%;
	transform:translateX(-50%);
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
}
.main-visual-decoration:before{
	content:"";
	width: 330px;
	height:1px;
	background-color:#a5a5a5;
	display:inline-block;
	position:relative;
}
.main-visual-decoration:after{
	content:"";
	height: 330px;
	width:1px;
	top:1px;
	background-color:#a5a5a5;
	display:inline-block;
	position:absolute;
	left:calc(50% - 1px);
}
#main-visual.video .main-visual-video {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media all and (max-width:1024px){
	div#mobile-menu .menu-image {
		display:none;
	}
	div#mobile-menu{
		width:100%;
	}
}
@media all and (max-width: 992px){
	.social-icons{
		display:none;
	}
}
@media all and (max-width: 768px){
	div#mobile-menu .menu {
		padding: 63px 60px 63px 30px;
	}
	#main-visual{
		min-height: auto;
	}
	#main-visual .main-visual-content {
		padding: 200px 20px;
	}
	#main-visual h1 {
		font-size: 25px;
	}
	#main-visual p {
		font-size: 20px;
	}
	header#site-header{
		padding:0px 15px;
	}
	header#site-header .container-header {
		height: 70px;
	}
	header#site-header .logo img{
		position:relative;
		width:200px;
		height:48px;
	}
	header#site-header .icon-menu img {
		width: 32px;
	}
}