:root {
  --txtBase: #212029;
  --txtGray: #6c6971;
  --gray: #ccc;
  --lightGray: #f2f2f2;
  --purple: #b06bbe;
  --lightPurple: #f8eafa;
  --red: #e28477;
  --lightRed: #fdefed;
  --blue: #4c86c5;
  --lightBlue: #e7f4fa;
  --gold: #9d7900;
  --lightGold: #fcfcdd;
  --green: #5db15b;
  --lightGreen: #edfded;
  --orange: #e5821c;
  --lightOrange: #fcf5e7;
  --productBorderLightPurple: #eccef0;
  --productBgLightPurple: #fefaff;
  --productBlue: #4580C2;
  --productGray: #484848;
  --productLightGray: #fcfcfc;
  --productBorderGray: #d7d7d7;
}

.pageHeader {
  padding-bottom: 60px;
  border-bottom: 1px solid #6c6971;
  margin-bottom: 100px;
}

h2 {
  font-size: 22px;
  line-height: 32px;
  letter-spacing: 1.03px;
  padding-bottom: 24.5px;
  margin-bottom: 70.5px;
  position: relative;
}

h2::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 40px;
  height: 2px;
  background: #b06bbe;
}

/* message */
.message {
  margin-bottom: 160px;
}

.messageWrap {
  display: flex;
  flex-wrap: wrap;
}

.messageRight {
  margin-left: 60px;
  max-width: 286px;
}

.presidentImg {
  margin-bottom: 26px;
}

.presidentSubText {
  font-weight: 300;
  font-size: 14px;
  letter-spacing: 0.7px;
  line-height: 20px;
  margin-bottom: 5px;
}

.presidentName {
  font-size: 22px;
  letter-spacing: 1.03px;
  line-height: 29px;
}

.messageLeft {
  width: calc(100% - 346px);
}

.messageTitle {
  font-size: 22px;
  letter-spacing: 1.03px;
  line-height: 34px;
  margin-bottom: 40px;
}

.messageContent {
  font-size: 15px;
  letter-spacing: 0.45px;
  line-height: 30px;
  font-weight: 300;
}

@media screen and (max-width: 1024px) {
  .messageWrap {
    flex-direction: column-reverse;
  }
  .messageRight {
    margin-left: 0;
    margin-bottom: 30px;
    max-width: 100%;
  }
  .messageLeft {
    width: 100%;
  }
}
/* company */
.company {
  padding-bottom: 160px;
}

.companyRow:not(:last-child) {
  margin-bottom: 39.5px;
}

.companyRow {
  padding-bottom: 39.5px;
  border-bottom: 1px solid #cccccc;
  display: flex;
}

.companyLeft {
  width: 160px;
  margin-right: 61px;
  font-size: 15px;
  letter-spacing: 0.9px;
  line-height: 30px;
  color: #b06bbe;
}

.companyRight {
  width: calc(100% - 221px);
  font-size: 15px;
  font-weight: 300;
  letter-spacing: 0.45px;
  line-height: 30px;
}

.companyContentAddressRow:not(:last-child) {
  margin-bottom: 25px;
}

.companyContentAddressTitle {
  font-weight: 400;
  margin-bottom: 15px;
}

.companyContentAddressContent {
  line-height: 26px;
}

.companyContentItemRow:not(:last-child) {
  margin-bottom: 30px;
}

ol.companyContentItemRow {
  padding-left: 16px;
  list-style-type: decimal;
  list-style-position: outside;
  line-height: 34px;
}

ol.companyContentItemRow > li {
  padding-left: 3px;
}

.table-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.companyContentItemRow table {
  border: double 1px #212029;
  border-collapse: collapse;
  font-size: 12px;
}

.companyContentItemRow table th {
  width: fit-content;
  line-height: 15px;
  text-align: center;
  white-space: nowrap;
  padding: 4px 14px;
  font-weight: 400;
  letter-spacing: 0.8px;
  vertical-align: middle;
}

.companyContentItemRow table td {
  width: fit-content;
  line-height: 15px;
  text-align: center;
  white-space: nowrap;
  padding: 4px 14px;
  letter-spacing: 1.5px;
}

.companyContentItemRow table .wide-1 {
  letter-spacing: 2px;
}

.companyContentItemRow table .wide-2 {
  letter-spacing: 6px;
}

.companyContentItemRow table .wide-3 {
  letter-spacing: 13px;
}

.companyContentItemRow table span + span {
  margin-left: 14px;
}

.companyContentItemRow .table-jigyoshasyo th {
  border: 1px solid #cccccc;
}

.companyContentItemRow .table-jigyoshasyo td {
  border: 1px solid #cccccc;
}

.companyContentItemRow .table-kyokasyo {
  height: fit-content;
}

.companyContentItemRow .table-kyokasyo .left {
  text-align: left;
}

.companyContentItemRow .table-kyokasyo th {
  padding: 6px 14px;
}

.companyContentItemRow .table-kyokasyo td {
  padding: 6px 14px;
}

/* map */
.map {
  padding-bottom: 160px;
}

.mapRow:not(:last-child) {
  margin-bottom: 50px;
}

.mapRow {
  padding-bottom: 50px;
  border-bottom: 1px solid #cccccc;
  display: flex;
  flex-wrap: wrap;
}

.mapLeft {
  max-width: 230px;
  min-width: 230px;
  margin-right: 60px;
  font-size: 20px;
  letter-spacing: 1.2px;
  line-height: 38px;
  color: #b06bbe;
}

.mapCenter {
  max-width: 349px;
  font-size: 16px;
  letter-spacing: 0.48px;
  line-height: 30px;
}

.mapCenterRow:not(:last-child) {
  margin-bottom: 20px;
}

.mapRight {
  max-width: 410px;
  min-width: 410px;
  height: 250px;
  margin-left: auto;
}

.mapRight > iframe {
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 1200px) {
  .mapLeft {
    margin-right: 20px;
  }
  .mapRow {
    gap: 15px;
  }
  .mapLeft {
    max-width: none;
    min-width: unset;
    width: calc(50% - 7.5px);
    margin-right: 0;
  }
  .mapCenter {
    max-width: none;
    min-width: unset;
    width: calc(50% - 7.5px);
    margin-right: 0;
  }
  .mapRight {
    max-width: none;
    min-width: unset;
    width: calc(50% - 7.5px);
    margin-right: 0;
  }
}
@media screen and (max-width: 1024px) {
  .presidentImg img {
    max-width: 200px;
  }
}
@media screen and (max-width: 768px) {
  .message {
    margin-bottom: 70px;
  }
  .company {
    padding-bottom: 70px;
  }
  .companyRow:not(:last-child) {
    margin-bottom: 30px;
  }
  .companyRow {
    padding-bottom: 30px;
    flex-direction: column;
  }
  .companyLeft {
    font-size: 16px;
    margin-right: 0;
    margin-bottom: 10px;
    width: 100%;
  }
  .companyRight {
    font-size: 14px;
    line-height: 26px;
    letter-spacing: 0.29px;
    width: 100%;
  }
  .companyContentAddressRow:not(:last-child) {
    margin-bottom: 25px;
  }
  .map {
    padding-bottom: 120px;
  }
  .mapRow:not(:last-child) {
    margin-bottom: 30px;
  }
  .mapRow {
    padding-bottom: 30px;
  }
  .mapLeft {
    font-size: 16px;
    line-height: 30px;
    max-width: none;
    min-width: auto;
    margin-right: 0;
    width: 100%;
  }
  .mapCenter {
    font-size: 14px;
    max-width: none;
    width: 100%;
  }
  .mapRight {
    max-width: none;
    min-width: auto;
    width: 100%;
  }
  .pageHeader {
    padding-bottom: 47px;
    margin-bottom: 73px;
  }
  h2 {
    font-size: 18px;
    letter-spacing: 0.85px;
    line-height: 34px;
    padding-bottom: 16px;
    margin-bottom: 40px;
  }
  .messageTitle {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: 0.85px;
    margin-bottom: 25px;
  }
  .messageContent {
    font-size: 12px;
    line-height: 26px;
    letter-spacing: 0.29px;
  }
  .companyContentAddressTitle {
    margin-bottom: 5px;
  }
  .mapCenterRow {
    font-size: 14px;
    line-height: 26px;
    letter-spacing: 0.29px;
  }
  .mapCenterRow:not(:last-child) {
    margin-bottom: 5px;
  }
  .companyContentItemRow table {
    font-size: 11px;
  }
  .companyContentItemRow table th {
    padding: 4px 8px;
  }
  .companyContentItemRow table td {
    padding: 4px 10px;
  }
}