/*
* CORPORATE NIHON-U STYLE
*/

/* HEADER */
.corporate-header-logo {
  max-width: 180px;
}

/* サウンドアイコン */
.buttons-sound {
  position: static;
}

/* /サウンドアイコン ここまで */
/* HEADER ここまで */

/* MAIN */
/* ドラッグアイコン */
.icon-drag {
  display: block;
  width: 40px;
  height: 40px;
  left: 5px;
  bottom: 5px;
  z-index: 10;
  filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.6));
}

/* /ドラッグアイコン ここまで */

.corporate-nihon-u {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  /* iOS Safari対策 */
}

.nihon-u-wrapper {
  /* width: 100%; */
  min-width: 100%;
  max-width: none;
  /* min-height: 100%; */
  /* aspect-ratio: 53 / 27; */
  /* 2120px : 1080px */
  /* overflow: hidden; */
  width: 2120px;
  height: 1080px;
}

.nihon-u {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.nihon-u-link {
  position: absolute;
  height: auto;
  z-index: 10;
}

.nihon-u-image {
  position: absolute;
  height: auto;
  max-width: none;
}

.nihon-u-link img {
  width: 100%;
  height: auto;
}

.nihon-u-link-wrapper {
  position: absolute;
  z-index: 10;
}

.nihon-u-link-wrapper .nihon-u-image {
  width: 100%;
  height: auto;
  left: 0;
  top: 0;
}

.nihon-u-link-image {
  width: 100%;
  height: 100%;
  position: relative;
  left: 0;
  top: 0;
  z-index: 20;
}

/* link-text ここから */
.nihon-u-link-text {
  position: absolute;
  min-width: calc(1.05em * 2);
  /* 2文字 */
  max-width: calc(1.05em * 12);
  /* 12文字 */
  word-break: break-word;
  /* 単語の途中でも折り返す */
  width: max-content;
  text-align: center;
  font-weight: bold;
  color: #050505;
  letter-spacing: 0.1px;
  background-color: rgb(255 255 255 / 95%);
  padding: 1.30rem;
  /* 1rem : 14px / 1080px * 100 */
  left: 50%;
  /* ピンの中央に合わせる */
  transform: translateX(-50%);
  /* ピンの中央に合わせる */
  top: calc(100% + 0.05em);
  /* 1.05em 下に配置 */
  box-shadow: 0px 0px 15px -5px #777777;
  border-radius: 5px;
  opacity: 0;
  transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
  z-index: 50;
}

.nihon-u-link-text.--top {
  /* top: calc(-100% + -0.2em); */
  transform: translateX(-50%) translateY(0%);
}

.nihon-u-link-text:not(.is-transparent) {
  opacity: 1;
  pointer-events: auto;
}

.nihon-u-link-text.--top:not(.is-transparent) {
  transform: translateX(-50%) translateY(calc(-100% + -0.2em));
  /* 0.2em 上に配置 */
}

.nihon-u-link-text.--bottom {
  /* top: calc(100% + 0.05em); */
  transform: translateX(-50%) translateY(-50%);
}

.nihon-u-link-text.--bottom:not(.is-transparent) {
  transform: translateX(-50%) translateY(calc(0% + 0.05em));
  /* 0.05em 下に配置 */
}

/* /link-text ここまで */

.nihon-u-link-url {
  width: 100%;
  height: 100%;
}

svg.nihon-u-link-image {
  fill: transparent;
  /* fill: yellow !important; */
  /* z-index: 10 !important; */
  /* position: absolute; */
}

/* リンク用のピン */
.pin {
  display: block;
  position: absolute;
  width: 2.07%;
  /* 43.8421058106996px / 2120px * 100 */
  height: 6.00%;
  /* 64.7686667483677px / 1080px * 100 */
}

.pin::after {
  content: "";
  position: absolute;
  inset: 0;
  /* top, right, bottom, left 全て0と同じ意味 */
  width: 100%;
  height: 100%;
  filter: drop-shadow(1px 1px 3px rgba(0, 0, 0, 0.5));
  background-image: url('../../common/images/pin.svg');
  background-size: cover;
  cursor: pointer;
  z-index: 45;
  animation: float 4s ease-in-out infinite;
  /* 4秒間でアニメーションをループ */
}

@keyframes float {
  0% {
    transform: translateY(0);
    /* 基本位置 */
  }

  50% {
    transform: translateY(-4px);
    /* 下に-4px移動 */
  }

  100% {
    transform: translateY(0);
    /* 基本位置 */
  }
}

.pin:focus {
  outline: 2px solid blue;
}

/* /リンク用のピン ここまで */

/* パーツここから */
/* gate パーツ */
.gate {
  width: 9.14%;
  /* 193.716995239258px / 2120px * 100 */
  height: 27.97%;
  /* 302.10400390625px / 1080px * 100 */
  top: 60.46%;
  /* 652.98480758187px / 1080px * 100 */
  left: 12.75%;
  /* 270.305602380371px / 2120px * 100 */
  z-index: 15;
}

/* /gate パーツ ここまで */

/* main-bldg パーツ */
.pin-main-bldg {
  top: 43.64%;
  /* 471.327585361223px / 1080px * 100 */
  left: 27.94%;
  /* 592.291024364359px / 2120px * 100 */
}

.link-main-bldg-wrapper {
  width: 10.45%;
  /* 221.6279296875px / 2120px * 100 */
  height: 19.70%;
  /* 212.740173339844px / 1080px * 100 */
  top: 44.00%;
  /* 475.221799999998px / 1080px * 100 */
  left: 23.85%;
  /* 505.568097009282px / 2120px * 100 */
}

.text-main-bldg {}

.main-bldg {}

/* /main-bldg パーツ ここまで */

/* bldg1 パーツ */
.pin-bldg1 {
  top: 58.34%;
  /* 630.121793411741px / 1080px * 100 */
  left: 34.66%;
  /* 734.848848109063px / 2120px * 100 */
}

.text-bldg1 {}

.link-bldg1-wrapper {
  width: 6.47%;
  /* 137.163347491831px / 2120px * 100 */
  height: 12.89%;
  /* 139.194458007812px / 1080px * 100 */
  top: 59.59%;
  /* 643.609700000001px / 1080px * 100 */
  left: 32.52%;
  /* 689.320682586294px / 2120px * 100 */
}

.bldg1 {}

/* /bldg1 パーツ ここまで */

/* bldg3 ここから */
.pin-bldg3 {

  top: 46.93%;
  /* 506.842486156825px / 1080px * 100 */
  left: 19.87%;
  /* 421.194588918866px / 2120px * 100 */
}

.text-bldg3 {}

.link-bldg3-wrapper {
  width: 6.39%;
  /* 135.491027832031px / 2120px * 100 */
  height: 9.29%;
  /* 100.328796386719px / 1080px * 100 */
  top: 49.86%;
  /* 538.471799999999px / 1080px * 100 */
  left: 18.32%;
  /* 388.328199999998px / 2120px * 100 */
}

.bldg3 {}

/* /bldg3 パーツ ここまで */

/* bldg8 パーツ */
.pin-bldg8 {
  top: 35.21%;
  /* 380.261958994885px / 1080px * 100 */
  left: 67.52%;
  /* 1431.5103304472px / 2120px * 100 */
}

.text-bldg8 {}

.link-bldg8-wrapper {
  width: 7.61%;
  /* 161.421752929691px / 2120px * 100 */
  height: 12.08%;
  /* 130.461730957031px / 1080px * 100 */
  top: 35.76%;
  /* 386.2382px / 1080px * 100 */
  left: 64.52%;
  /* 1367.7395px / 2120px * 100 */
}

.bldg8 {}

/* /bldg8 パーツ ここまで */

/* shigemaru-forest パーツ */
.pin-shigemaru-forest {
  top: 30.32%;
  /* 327.503244135855px / 1080px * 100 */
  left: 48.63%;
  /* 1030.9018352389px / 2120px * 100 */
}

.text-shigemaru-forest {}

.link-shigemaru-forest-wrapper {
  width: 16.66%;
  /* 353.24355183745px / 2120px * 100 */
  height: 20.56%;
  /* 222.062683105469px / 1080px * 100 */
  top: 25.27%;
  /* 272.9236px / 1080px * 100 */
  left: 40.26%;
  /* 853.61027843599px / 2120px * 100 */
}

.shigemaru-forest {}

/* /shigemaru-forest パーツ ここまで */

/* food-processing-laboratory パーツ */
.pin-food-processing-laboratory {
  top: 19.74%;
  /* 213.20872761808px / 1080px * 100 */
  left: 65.54%;
  /* 1389.47244416956px / 2120px * 100 */
}

.text-food-processing-laboratory {}

.link-food-processing-laboratory-wrapper {
  width: 9.93%;
  /* 210.582702636721px / 2120px * 100 */
  height: 12.85%;
  /* 138.749816894531px / 1080px * 100 */
  top: 20.91%;
  /* 225.869000000001px / 1080px * 100 */
  left: 61.77%;
  /* 1309.5458px / 2120px * 100 */
}

.food-processing-laboratory {}

/* /food-processing-laboratory パーツ ここまで */

/* farm パーツ */
.pin-farm {
  top: 12.96%;
  /* 139.95825213468px / 1080px * 100 */
  left: 75.56%;
  /* 1601.84371639485px / 2120px * 100 */
}

.text-farm {}

.link-farm-wrapper {
  width: 14.61%;
  /* 309.724670410156px / 2120px * 100 */
  height: 17.20%;
  /* 185.721862792969px / 1080px * 100 */
  top: 9.00%;
  /* 97.1571000000004px / 1080px * 100 */
  left: 70.17%;
  /* 1487.6661px / 2120px * 100 */
  z-index: 20;
}

.farm {
  width: 17.77%;
  /* 376.773986816406px / 2120px * 100 */
  height: 34.88%;
  /* 376.756011962891px / 1080px * 100 */
  top: 8.42%;
  /* 90.9061999999994px / 1080px * 100 */
  left: 69.84%;
  /* 1480.6374065918px / 2120px * 100 */
  z-index: 15;
}

/* /farm パーツ ここまで */

/* anmec パーツ */
.pin-anmec {
  top: 47.91%;
  /* 517.46346727339px / 1080px * 100 */
  left: 79.87%;
  /* 1693.16691466009px / 2120px * 100 */
}

.text-anmec {}

.link-anmec-wrapper {
  width: 6.54%;
  /* 138.715637207031px / 2120px * 100 */
  height: 10.12%;
  /* 109.255126953125px / 1080px * 100 */
  top: 51.20%;
  /* 552.981400000001px / 1080px * 100 */
  left: 77.77%;
  /* 1648.6418px / 2120px * 100 */
}

.anmec {}

/* /anmec パーツ ここまで */

/* smart-greenhouse パーツ */
.pin-smart-greenhouse {
  top: 79.85%;
  /* 862.379514472988px / 1080px * 100 */
  left: 55.63%;
  /* 1179.36101334851px / 2120px * 100 */
}

.text-smart-greenhouse {}

.link-smart-greenhouse-wrapper {
  width: 12.92%;
  /* 273.846313476562px / 2120px * 100 */
  height: 14.67%;
  /* 158.462005347525px / 1080px * 100 */
  top: 78.84%;
  /* 851.5095px / 1080px * 100 */
  left: 50.00%;
  /* 1059.9823px / 2120px * 100 */
}

.smart-greenhouse {}

/* /smart-greenhouse パーツ ここまで */

/* bus1 パーツ */
.pin-bus1 {
  top: 70.22%;
  /* 758.39123142795px / 1080px * 100 */
  left: 25.46%;
  /* 539.694174032596px / 2120px * 100 */
}

.text-bus1 {}

.link-bus1-wrapper {
  width: 1.82%;
  /* 38.5008315581672px / 2120px * 100 */
  height: 2.87%;
  /* 31.036431370123px / 1080px * 100 */
  top: 75.21%;
  /* 812.268274464839px / 1080px * 100 */
  left: 25.57%;
  /* 542.184086303278px / 2120px * 100 */
}

.bus1 {}

/* /bus1 パーツ ここまで */

/* bus2 パーツ */
.pin-bus2 {
  top: 74.82%;
  /* 808.079427641032px / 1080px * 100 */
  left: 29.44%;
  /* 624.080530019101px / 2120px * 100 */
}

.text-bus2 {}

.link-bus2-wrapper {
  width: 1.82%;
  /* 38.5008178614453px / 2120px * 100 */
  height: 2.87%;
  /* 31.036431370123px / 1080px * 100 */
  top: 79.58%;
  /* 859.460500000001px / 1080px * 100 */
  left: 29.47%;
  /* 624.848299999999px / 2120px * 100 */
}

.bus2 {}

/* /bus2 パーツ ここまで */

/* bus3 パーツ */
.pin-bus3 {
  top: 79.29%;
  /* 856.309233455166px / 1080px * 100 */
  left: 33.49%;
  /* 709.929584368259px / 2120px * 100 */
}

.text-bus3 {}

.link-bus3-wrapper {
  width: 1.82%;
  /* 38.5008358151708px / 2120px * 100 */
  height: 2.87%;
  /* 31.036431370123px / 1080px * 100 */
  top: 84.05%;
  /* 907.6903px / 1080px * 100 */
  left: 33.52%;
  /* 710.697382046274px / 2120px * 100 */
}

.bus3 {}

/* /bus3 パーツ ここまで */

/* パーツここまで */
/* MAIN ここまで */

@media screen and (min-width: 600px) {}

@media screen and (min-width: 768px) {
  body {
    /* 1rem = 16px; */
  }

  /* link-text */
  .nihon-u-link-text {
    font-size: 1.15rem;
    max-width: calc(1.05em * 12);
    /* 12文字 */
  }
}

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

  /* ドラッグアイコン */
  .icon-drag {
    display: none;
  }

  /* /ドラッグアイコン ここまで */
  /* link-text */
  .nihon-u-link-text {
    font-size: 1.25rem;
    max-width: calc(1.05em * 14);
    /* 14文字 */
  }
}

@media screen and (min-width: 1920px) {

  /* 大きいスクリーンの場合 */
  .nihon-u-link-text.--bottom:not(.is-transparent) {
    transform: translateX(-50%) translateY(calc(0% - 0.05em));
    /* 0.05em 下に配置 */
  }

  .nihon-u-link-text.--bottom.--right {
    transform: translateX(-50%) translateY(calc(0% + 0.05em));
  }
}

@media (orientation: landscape) {
  /* デバイスが横向きの場合の記述 */
}

@media (orientation: portrait) {
  /* デバイスが縦向きの場合の記述 */
}

/* タッチデバイス向けのスタイル */
@media only screen and (hover: none) {
  /* hover: none はタッチデバイスを示す条件 */
}

@media only screen and (hover: none) and (orientation: landscape) and (min-width: 768px) {
  /* デバイスが横向き 且つ 768px以上の場合の記述 */
}

/* スマホ縦向きのスタイル */
@media screen and (max-width: 768px) and (orientation: portrait) {

  /* MAIN */
  .corporate-nihon-u {}

  .nihon-u-wrapper {
    min-width: 1080px;
    /* 横スクロールできるように */
  }

  /* MAIN ここまで */
}