@charset "utf-8";

/*----------------------------------------------
 単独ページ用CSS
------------------------------------------------*/
/*社長賞ページ.sp1Areaのみ適応---*/

.sp1Area .sp1_text_box {
  position: relative;
}
.sp1Area .sp1_text {
  position: absolute;
  top: 10%;
  left: 0;
}

.sp1Area .sp2_box {
  background: #0041C8;
  overflow: hidden;
}
.sp1Area .sp2_box .service_text {
  margin: 0 auto 4%;
}

.sp1Area .sp3_text_box {
  position: relative;
}
.sp1Area .sp3_text {
  position: absolute;
  bottom: 0;
  left: 0;
}

.sp1Area .sp4_text_box {
  position: relative;
}
.sp1Area .sp4_text {
  position: absolute;
  bottom: 3%;
  left: 0;
}

/*リンク
------------------------------------------------*/
.sp1Area .image-map {
  position: relative;
  width: 100%;
  max-width: 750px; /* 任意 */
  margin: 0 auto;
}

.sp1Area .image-map img {
  width: 100%;
  height: auto;
  display: block;
}
.sp1Area .link-area {
  position: absolute;
  display: block;
  /* 透過で見えなくする */
  background-color: rgba(255, 0, 0, 0); /* テスト時に可視化 */
}

/* 座標は画像の比率で%で指定（例：画像上の位置） */

/*画像のサイズw750ｘh540*/
.sp1Area .sp1_box .area1 {
  top: calc(40 / 540 * 100%);
  left: calc(80 / 750 * 100%);
  width: calc(590 / 750 * 100%);
  height: calc(260 / 540 * 100%);
}

.sp1Area .sp4_box .area1 {
  top: calc(440 / 596 * 100%);
  left: calc(80 / 750 * 100%);
  width: calc(590 / 750 * 100%);
  height: calc(80 / 596 * 100%);
}



/*非表示 ------------------------------*/