@charset "UTF-8";
/* CSS Document */
.header{
  position:fixed;
  top: 0;
  left: 0;
  padding: 0;
  margin: 0;
  width: 100%;
  height: 12vh;
  background-color: #FFF;
  z-index: 999;
}
.header_innner h1 {
  font-size: calc(20px + 4 *(100vw - 280px)/1640);
  font-weight: 400;
  position: relative;
  text-align: left;
  left: 3.5vw;
  padding-left:4vw;
  top   : 5vh;
}
.navigation{
  position: relative;
}
.about{
  position: absolute;
  top: 13vh;
  margin: 0;
  padding-left:4vw;
  text-align: left;
}
.about p{
  font-size: 16px;
  line-height: 30px;
}

.navigation_innner{
  position: absolute;
  top: 25vh;
  margin: 0;
  padding: 0 4vw 100vh;
}
.navigation__item-pictureA{
 width: calc((100% - 4vw * 1)/2);
}
.navigation__item-pictureB{
 width: calc((100% - 4vw * 1)/3); 
}

.navigation h2{
  font-size: calc(30px + 140 *(100vw - 280px)/1640);
  font-weight: 400;
}
.navigation_blockA{  
 display: flex;
 justify-content:flex-start;
 gap:4vw;
 padding-bottom: 12vh;
}
.navigation_blockB{ 
 display: flex;
 justify-content:flex-end;
 gap:4vw;  
 padding-bottom: 12vh;
}
a,h2{
  text-decoration: none;
}
a :hover{
  opacity: 0.85;
  transition: 0.3s;
}
a,h2:visited{
  color: #41596e;
}
@media (max-width: 768px){
  .header{
  height: 10vh;
}
  .about{
  top: 10vh;
}
  .navigation_blockA{
    padding-bottom: 8vh;
  }
  .navigation_blockB{
    padding-bottom: 8vh;
  }
}
@media (max-width: 425px){
  .navigation_blockA{
    justify-content:center;
    padding-bottom: 8vh;
  }
  .navigation_blockB{
    justify-content: center;
    padding-bottom: 8vh;
  }
}