@charset "UTF-8";


/* ---------------------------------------------------------
 * Common
** --------------------------------------------------------- */
.subtitle {
  position: relative;
  display: inline-block;
  color: #1b328e;
  font-size: 14px;
  font-weight: bold;
}
.subtitle::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;
  width: 100%;
  height: 1px;
  background-color: #0033ff;
}
@media (max-width: 1140px) {
}
@media (max-width: 767px) {
  .subtitle {
    font-size: 13px;
  }
}



/* ---------------------------------------------------------
 * #fv_page
** --------------------------------------------------------- */
#fv_page {
  background-image: url(../img/performance/work_cover.png);
}
@media (max-width: 767px) {
  #fv_page h2 span {
    font-size: 42px;
  }
}



/* ---------------------------------------------------------
 * #performance
** --------------------------------------------------------- */
#performance {
  background-image: url(../img/top/bg_map.jpg);
  background-repeat: no-repeat;
  background-position: left center;
  /*background-size: cover;*/
  background-size: 140% auto;
  padding: 40px 0;
}
#performance .wrapper {
  display: flex;
  align-items: center;
}
/* .map */
#performance .map {
  flex-shrink: 0;
  position: relative;
  width: 694px;
  height: 784px;
  background-image: url(../img/top/map.png);
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 100% 100%;
}
#performance .map li {
  position: absolute;
}
#performance #pin01 {
  right: calc(calc(calc(245px / 100) * 142) - 85px);
  top: calc(calc(calc(310px / 100) * 141) - 25px);
}
#performance #pin02 {
  right: calc(calc(calc(356px / 100) * 142) - 85px);
  top: calc(calc(calc(400px / 100) * 141) - 25px);
}
#performance #pin03 {
  right: calc(calc(calc(337px / 100) * 142) - 85px);
  top: calc(calc(calc(422px / 100) * 141) - 25px);
}
#performance #pin04 {
  right: calc(calc(calc(363px / 100) * 142) - 85px);
  top: calc(calc(calc(414px / 100) * 141) - 25px);
}
#performance #pin05 {
  right: calc(calc(calc(364px / 100) * 142) - 85px);
  top: calc(calc(calc(445px / 100) * 141) - 25px);
}
#performance #pin06 {
  right: calc(calc(calc(300px / 100) * 142) - 85px);
  top: calc(calc(calc(405px / 100) * 141) - 25px);
}
#performance #pin07 {
  right: calc(calc(calc(325px / 100) * 142) - 85px);
  top: calc(calc(calc(402px / 100) * 141) - 25px);
}
#performance #pin08 {
  right: calc(calc(calc(318px / 100) * 142) - 85px);
  top: calc(calc(calc(410px / 100) * 141) - 25px);
}
#performance #pin09 {
  right: calc(calc(calc(315px / 100) * 142) - 85px);
  top: calc(calc(calc(396px / 100) * 141) - 25px);
}
#performance #pin10 {
  right: calc(calc(calc(300px / 100) * 142) - 85px);
  top: calc(calc(calc(420px / 100) * 141) - 25px);
}
#performance #pin11 {
  right: calc(calc(calc(388px / 100) * 142) - 85px);
  top: calc(calc(calc(401px / 100) * 141) - 25px);
}
#performance #pin12 {
  right: calc(calc(calc(203px / 100) * 142) - 85px);
  top: calc(calc(calc(121px / 100) * 141) - 25px);
}
#performance #pin13 {
  right: calc(calc(calc(273px / 100) * 142) - 85px);
  top: calc(calc(calc(338px / 100) * 141) - 25px);
}
#performance #pin14 {
  right: calc(calc(calc(240px / 100) * 142) - 85px);
  top: calc(calc(calc(400px / 100) * 141) - 25px);
}
#performance #pin15 {
  right: calc(calc(calc(290px / 100) * 142) - 85px);
  top: calc(calc(calc(400px / 100) * 141) - 25px);
}
#performance #pin16 {
  right: calc(calc(calc(333px / 100) * 142) - 85px);
  top: calc(calc(calc(409px / 100) * 141) - 25px);
}
#performance #pin17 {
  right: calc(calc(calc(309px / 100) * 142) - 85px);
  top: calc(calc(calc(406px / 100) * 141) - 25px);
}
#performance #pin18 {
  right: calc(calc(calc(355px / 100) * 142) - 85px);
  top: calc(calc(calc(427px / 100) * 141) - 25px);
}
#performance #pin19 {
  right: calc(calc(calc(378px / 100) * 142) - 85px);
  top: calc(calc(calc(391px / 100) * 141) - 25px);
}
#performance #pin20 {
  right: calc(calc(calc(364px / 100) * 142) - 85px);
  top: calc(calc(calc(455px / 100) * 141) - 25px);
}
#performance #pin21 {
  right: calc(calc(calc(359px / 100) * 142) - 85px);
  top: calc(calc(calc(460px / 100) * 141) - 25px);
}
#performance #pin22 {
  right: calc(calc(calc(354px / 100) * 142) - 85px);
  top: calc(calc(calc(465px / 100) * 141) - 25px);
}
#performance #pin23 {
  right: calc(calc(calc(428px / 100) * 142) - 85px);
  top: calc(calc(calc(401px / 100) * 141) - 25px);
}
#performance #pin24 {
  right: calc(calc(calc(394px / 100) * 142) - 85px);
  top: calc(calc(calc(442px / 100) * 141) - 25px);
}
#performance #pin25 {
  right: calc(calc(calc(390px / 100) * 142) - 85px);
  top: calc(calc(calc(452px / 100) * 141) - 25px);
}
#performance #pin26 {
  right: calc(calc(calc(377px / 100) * 142) - 85px);
  top: calc(calc(calc(401px / 100) * 141) - 25px);
}
#performance #pin27 {
  right: calc(calc(calc(320px / 100) * 142) - 85px);
  top: calc(calc(calc(330px / 100) * 141) - 25px);
}
#performance #pin28 {
  right: calc(calc(calc(310px / 100) * 142) - 85px);
  top: calc(calc(calc(325px / 100) * 141) - 25px);
}
#performance #pin29 {
  right: calc(calc(calc(215px / 100) * 142) - 85px);
  top: calc(calc(calc(280px / 100) * 141) - 25px);
}
#performance #pin30 {
  right: calc(calc(calc(220px / 100) * 142) - 85px);
  top: calc(calc(calc(265px / 100) * 141) - 25px);
}
#performance .map li img {
  width: 20px;
}
#performance .map li div {
  display: none;
  position: absolute;
  z-index: 5;
  top: -70px;
  left: 50%;
  transform: translateX(-50%);
  height: 56px;
  justify-content: center;
  align-items: center;
  background-color: #fff;
  border-radius: 3px;
  box-shadow: 0 0 15px #ddd;
  color: #1b328e;
  font-size: 12px;
  font-weight: bold;
}
#performance #pin01 div { width: 210px; }
#performance #pin02 div { width: 150px; }
#performance #pin03 div { width: 210px; }
#performance #pin04 div { width: 200px; }
#performance #pin05 div { width: 210px; }
#performance #pin06 div { width: 180px; }
#performance #pin07 div { width: 210px; }
#performance #pin08 div { width: 210px; }
#performance #pin09 div { width: 210px; }
#performance #pin10 div { width: 230px; }
#performance #pin11 div { width: 200px; }
#performance #pin12 div { width: 150px; }
#performance #pin13 div { width: 160px; }
#performance #pin14 div { width: 130px; }
#performance #pin15 div { width: 170px; }
#performance #pin16 div { width: 160px; }
#performance #pin17 div { width: 130px; }
#performance #pin18 div { width: 200px; }
#performance #pin19 div { width: 130px; }
#performance #pin20 div { width: 190px; }
#performance #pin21 div { width: 150px; }
#performance #pin22 div { width: 150px; }
#performance #pin23 div { width: 100px; }
#performance #pin24 div { width: 130px; }
#performance #pin25 div { width: 170px; }
#performance #pin26 div { width: 230px; }
#performance #pin27 div { width: 170px; }
#performance #pin28 div { width: 190px; }
#performance #pin29 div { width: 150px; }
#performance #pin30 div { width: 190px; }
#performance .map li div::before,
#performance .map li div::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 0;
  height: 0;
  border-style: solid;
}
#performance .map li div::before {
  border-width: 10px 8px 0 8px;
  border-color: rgba(200,200,200,0.3) transparent transparent transparent;
}
#performance .map li div::after {
  border-width: 8px 6px 0 6px;
  border-color: #fff transparent transparent transparent;
}
#performance .map li:hover div {
  display: flex;
}
/* .content */
#performance .content {
  width: 550px;
}
#performance .subtitle {
}
#performance h3 {
  margin-top: 15px;
  font-size: 33px;
  font-weight: bold;
}
#performance .content p {
  margin-top: 20px;
  font-size: 14px;
  line-height: 2;
}
@media (max-width: 1140px) {
  #performance .wrapper {
    position: relative;
    width: 100%;
  }
  /* .map */
  #performance .map {
    margin-left: -80px;
  }
  /* .content */
  #performance .content {
    position: absolute;
    right: 0;
    width: 490px;
    padding-right: 20px;
  }
}
@media (max-width: 900px) {
  /* .map */
  #performance .map {
    margin-left: -120px;
  }
  /* .content */
  #performance .content {
    width: 430px;
  }
}
@media (max-width: 767px) {
  #performance {
    padding: 0;
    background-size: cover;
  }
  #performance .wrapper {
    display: block;
    width: 100%;
  }
  /* .map 右上が基準 */
  #performance .map {
    height: 480px;
    width: auto;
    margin-left: 0;
    background-size: 450px auto;
    background-position: right -60px top -30px;
  }
  #performance .map .sp_block {
    width: 85%;
    padding-top: 50px;
    margin: 0 auto;
  }
  #performance h3 {
    font-size: 28px;
  }
  #performance #pin01 {
    right: calc(calc(calc(245px / 100) * 92) - 116px);
    top: calc(calc(calc(310px / 100) * 92) - 56px);
  }
  #performance #pin02 {
    right: calc(calc(calc(356px / 100) * 92) - 116px);
    top: calc(calc(calc(400px / 100) * 92) - 56px);
  }
  #performance #pin03 {
    right: calc(calc(calc(337px / 100) * 92) - 116px);
    top: calc(calc(calc(422px / 100) * 92) - 56px);
  }
  #performance #pin04 {
    right: calc(calc(calc(363px / 100) * 92) - 116px);
    top: calc(calc(calc(414px / 100) * 92) - 56px);
  }
  #performance #pin05 {
    right: calc(calc(calc(364px / 100) * 92) - 116px);
    top: calc(calc(calc(445px / 100) * 92) - 56px);
  }
  #performance #pin06 {
    right: calc(calc(calc(300px / 100) * 92) - 116px);
    top: calc(calc(calc(405px / 100) * 92) - 56px);
  }
  #performance #pin07 {
    right: calc(calc(calc(325px / 100) * 92) - 116px);
    top: calc(calc(calc(402px / 100) * 92) - 56px);
  }
  #performance #pin08 {
    right: calc(calc(calc(318px / 100) * 92) - 116px);
    top: calc(calc(calc(410px / 100) * 92) - 56px);
  }
  #performance #pin09 {
    right: calc(calc(calc(315px / 100) * 92) - 116px);
    top: calc(calc(calc(396px / 100) * 92) - 56px);
  }
  #performance #pin10 {
    right: calc(calc(calc(300px / 100) * 92) - 116px);
    top: calc(calc(calc(420px / 100) * 92) - 56px);
  }
  #performance #pin11 {
    right: calc(calc(calc(388px / 100) * 92) - 116px);
    top: calc(calc(calc(401px / 100) * 92) - 56px);
  }
  #performance #pin12 {
    right: calc(calc(calc(203px / 100) * 92) - 116px);
    top: calc(calc(calc(121px / 100) * 92) - 56px);
  }
  #performance #pin13 {
    right: calc(calc(calc(273px / 100) * 92) - 116px);
    top: calc(calc(calc(338px / 100) * 92) - 56px);
  }
  #performance #pin14 {
    right: calc(calc(calc(240px / 100) * 92) - 116px);
    top: calc(calc(calc(400px / 100) * 92) - 56px);
  }
  #performance #pin15 {
    right: calc(calc(calc(290px / 100) * 92) - 116px);
    top: calc(calc(calc(400px / 100) * 92) - 56px);
  }
  #performance #pin16 {
    right: calc(calc(calc(333px / 100) * 92) - 116px);
    top: calc(calc(calc(409px / 100) * 92) - 56px);
  }
  #performance #pin17 {
    right: calc(calc(calc(309px / 100) * 92) - 116px);
    top: calc(calc(calc(406px / 100) * 92) - 56px);
  }
  #performance #pin18 {
    right: calc(calc(calc(355px / 100) * 92) - 116px);
    top: calc(calc(calc(427px / 100) * 92) - 56px);
  }
  #performance #pin19 {
    right: calc(calc(calc(378px / 100) * 92) - 116px);
    top: calc(calc(calc(391px / 100) * 92) - 56px);
  }
  #performance #pin20 {
    right: calc(calc(calc(364px / 100) * 92) - 116px);
    top: calc(calc(calc(455px / 100) * 92) - 56px);
  }
  #performance #pin21 {
    right: calc(calc(calc(359px / 100) * 92) - 116px);
    top: calc(calc(calc(460px / 100) * 92) - 56px);
  }
  #performance #pin22 {
    right: calc(calc(calc(354px / 100) * 92) - 116px);
    top: calc(calc(calc(465px / 100) * 92) - 56px);
  }
  #performance #pin23 {
    right: calc(calc(calc(428px / 100) * 92) - 116px);
    top: calc(calc(calc(401px / 100) * 92) - 56px);
  }
  #performance #pin24 {
    right: calc(calc(calc(394px / 100) * 92) - 116px);
    top: calc(calc(calc(442px / 100) * 92) - 56px);
  }
  #performance #pin25 {
    right: calc(calc(calc(390px / 100) * 92) - 116px);
    top: calc(calc(calc(452px / 100) * 92) - 56px);
  }
  #performance #pin26 {
    right: calc(calc(calc(377px / 100) * 92) - 116px);
    top: calc(calc(calc(401px / 100) * 92) - 56px);
  }
  #performance #pin27 {
    right: calc(calc(calc(320px / 100) * 92) - 116px);
    top: calc(calc(calc(330px / 100) * 92) - 56px);
  }
  #performance #pin28 {
    right: calc(calc(calc(310px / 100) * 92) - 116px);
    top: calc(calc(calc(325px / 100) * 92) - 56px);
  }
  #performance #pin29 {
    right: calc(calc(calc(215px / 100) * 92) - 116px);
    top: calc(calc(calc(280px / 100) * 92) - 56px);
  }
  #performance #pin30 {
    right: calc(calc(calc(220px / 100) * 92) - 116px);
    top: calc(calc(calc(265px / 100) * 92) - 56px);
  }
  #performance .map li img {
    width: 16px;
  }
  /* .content */
  #performance .content {
    position: static;
    width: 85%;
    padding-right: 0;
    padding-bottom: 60px;
    margin: 0 auto;
  }
  #performance .content p {
    position: relative;
    z-index: 2;
    margin-top: -80px;
    font-size: 13px;
  }
}



/* ---------------------------------------------------------
 * #jisseki
** --------------------------------------------------------- */
#jisseki {
  padding: 90px 0;
  background: -moz-linear-gradient(60deg, #1b328e 0%, #1b328e 35%, #fff 35%, #fff 80%, #f4f4f4 80%, #f4f4f4 100%);
  background: -webkit-linear-gradient(60deg, #1b328e 0%, #1b328e 35%, #fff 35%, #fff 80%, #f4f4f4 80%, #f4f4f4 100%);
  background: linear-gradient(60deg, #1b328e 0%, #1b328e 35%, #fff 35%, #fff 80%, #f4f4f4 80%, #f4f4f4 100%);
}
#jisseki .box {
  padding: 50px 70px;
}
#jisseki h3 {
  font-size: 28px;
  font-weight: bold;
  text-align: center;
}
#jisseki .list {
  margin-top: 40px;
}
@media (max-width: 1140px) {
}
@media (max-width: 767px) {
  #jisseki {
    padding: 60px 0;
    /*background: -moz-linear-gradient(60deg, #1b328e 0%, #1b328e 35%, #fff 35%, #fff 80%, #f4f4f4 80%, #f4f4f4 100%);*/
    /*background: -webkit-linear-gradient(60deg, #1b328e 0%, #1b328e 35%, #fff 35%, #fff 80%, #f4f4f4 80%, #f4f4f4 100%);*/
    /*background: linear-gradient(60deg, #1b328e 0%, #1b328e 35%, #fff 35%, #fff 80%, #f4f4f4 80%, #f4f4f4 100%);*/
  }
  #jisseki .box {
    padding: 20px;
  }
  #jisseki h3 {
    /*font-size: 28px;*/
  }
  #jisseki .list {
    margin-top: 20px;
  }
}