@charset "utf-8";

:root {
  --OfficeName_Ja_font: 24px;
  --OfficeName_En_font: 19.5px;
  --Basic_font: 15px;
  --Yohaku_Small: 10px;
  --Yohaku_Middle: 30px;
}

body {
  font-family: 'Google Sans Flex', 'Noto Sans Japanese', sans-serif;
  font-size: var(--Basic_font);
  line-height: 1.5;
  color: #2c2c2c;
}

/*事務所名称*/
.OfficeName_Ja {
  font-family: 'Shippori Mincho B1', sans-serif;
  font-size: var(--OfficeName_Ja_font);
  color: #3e3a39;
}

.OfficeName_En {
  font-family: 'Google Sans Flex', sans-serif;
  font-size: var(--OfficeName_En_font);
  color: #898989;
}

.OfficeName {
  line-height: var(--OfficeName_Ja_font);
  height: calc(var(--OfficeName_Ja_font)+var(--OfficeName_En_font));
  width: 100%;
  margin-top: 25vh;
  margin-bottom: 25vh;
  padding-top: var(--Yohaku_Small);
  padding-bottom: var(--Yohaku_Small);
  padding-left: var(--Yohaku_Middle);
  background-color: white;
}

/*数字詰め*/
.number {
  letter-spacing: 0.01em;
}

/*事務所名称固定*/
header {
  position: -webkit-sticky;
  position: sticky;
  top: 0px;
  z-index: 2147483647;
}

/*information*/
.Information {
  padding-left: var(--Yohaku_Middle);
}

.Biography_En {
  color: #898989;
}

.registered_number {
  font-size: calc(var(--Basic_font)*3/4)
}


/*画像*/
.ProjectList img {
  margin-top: 1vh;
  width: 100%;
  max-height: 80vh;
  object-fit: cover;
}

/*プロジェクト名称*/
.ProjectName_Ja {
  font-size: calc(var(--Basic_font)*1.5);
  color: #ffffff;
}

.ProjectSite_Ja {
  font-size: var(--Basic_font);
  color: #ffffff;
}

.ProjectName_En {
  font-size: calc(var(--Basic_font)*1.5);
  color: #bdbdbd;
}

.ProjectSite_En {
  font-size: var(--Basic_font);
  color: #bdbdbd;
}

/*プロジェクト名称と画像を重ねる*/
.ProjectList {
  position: relative;
}

.ProjectName {
  position: absolute;
  width: 100%;
  height: calc(var(--Basic_font)*4.3);
  margin-top: calc(var(--Basic_font) * -4.3);
  line-height: calc(var(--Basic_font)*1.5);
  /*日本語と英語の間隔*/
  padding-top: var(--Yohaku_Small);
  padding-bottom: var(--Yohaku_Small);
  padding-left: var(--Yohaku_Small);
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5));
}

/*フッター*/
footer p {
  margin-top: calc(var(--Basic_font)*12);
  margin-bottom: calc(var(--Basic_font)*3);
  font-size: var(--Basic_font);
  text-align: center;
}

/*レスポンシブ*/
@media screen and (max-width: 640px) {
  :root {
    --OfficeName_Ja_font: 18px;
    --OfficeName_En_font: 14px;
    --Basic_font: 9px;
    --Yohaku_Small: 5px;
    --Yohaku_Middle: 15px;

  }

  .ProjectList img {
    margin-top: 1vh;
    max-width: 100%;
    height: 80vh;
    object-fit: cover;
  }
}

@media screen and (min-width: 640px) and (max-width: 960px) {
  :root {
    --OfficeName_Ja_font: 21px;
    --OfficeName_En_font: 17px;
    --Basic_font: 12px;
    --Yohaku_Small: 7.5px;
    --Yohaku_Middle: 22.5px;
  }

  .ProjectList img {
    margin-top: 1vh;
    max-width: 100%;
    height: 80vh;
    object-fit: cover;
  }
}

@media screen and (min-width: 960px){
  .hidden_br{display:none;}
}