#ui-turn {
  min-width: 950px;
  padding-bottom: 75px;
  background-color: #fff;
}
#ui-turn .sp {
  display: none;
}
#ui-turn p {
  font-size: 16px;
  line-height: calc(40 / 16);
}
#ui-turn .bold {
  font-weight: bold;
}
#ui-turn .inner {
  width: 950px;
  margin: 0 auto;
  position: relative;
  display: block;
}
#ui-turn .mv {
  background-image: url(../img/pc/bg_mv.png);
  background-repeat: no-repeat;
  background-position: center top;
}
#ui-turn .mv .inner {
  padding-top: 585px;
  background-image: url(../img/pc/ph.jpg);
  background-repeat: no-repeat;
  background-size: 950px auto;
  background-position: center top;
}
#ui-turn .mv h2 {
  width: calc(800px / 2);
  height: calc(800px / 2);
  display: block;
  background-image: url(../img/pc/h2.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  position: absolute;
  top: 90px;
  left: 20px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
#ui-turn .mv .copy {
  width: calc(516px / 2);
  height: calc(516px / 2);
  display: block;
  background-image: url(../img/pc/copy.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  position: absolute;
  top: 300px;
  left: 295px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
#ui-turn .mv .lead {
  color: #00a960;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.01em;
  width: 700px;
  margin: 0 auto 95px;
  /*background-image: linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%), linear-gradient(180deg, $green 1px, transparent 1px);
  background-size: 3px 100%, 100% calc(16px * 40 / 16);
  padding-bottom: 1px;*/
  border-top: 1px dotted #16d381;
}
#ui-turn .mv .lead .line_pc {
  border-bottom: 1px dotted #16d381;
  width: 100%;
  display: inline-block;
}
#ui-turn .area .inner {
  padding: 0 30px;
  height: 640px;
  background-image: url(../img/pc/illust.png), url(../img/pc/map.png);
  background-repeat: no-repeat;
  background-position: left 85px top 255px, left calc(125px + 25px) bottom;
  background-size: calc(344px / 2) auto, calc(1446px / 2) auto;
}
#ui-turn .area h3 {
  width: calc(760px / 2);
  height: calc(120px / 2);
  font-size: 24px;
  font-weight: bold;
  line-height: 1;
  letter-spacing: 0.1em;
  color: #fff;
  background-color: #16d381;
  border-radius: calc(120px / 2 / 2);
  margin: 0 auto 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
#ui-turn .area h3::before, #ui-turn .area h3::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: block;
  background-color: #c9f177;
}
#ui-turn .area h3::before {
  left: 10px;
}
#ui-turn .area h3::after {
  right: 10px;
}
#ui-turn .area .lead {
  line-height: calc(28 / 16);
  letter-spacing: 0.01em;
  font-weight: bold;
  position: relative;
  padding: 12px 0 0;
}
#ui-turn .area .lead::before {
  content: "";
  position: absolute;
  left: -25px;
  top: calc(-15px / 2);
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: #16d381;
  display: block;
}
#ui-turn .area .lead::after {
  content: "";
  position: absolute;
  left: -25px;
  top: 0;
  width: 530px;
  height: 1px;
  display: block;
  background-color: #16d381;
}
#ui-turn .area .ft_link {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: absolute;
  left: 50px;
  top: 440px;
  font-size: 13px;
  line-height: calc(18 / 13);
  color: #00a960;
  padding-left: 35px;
}
#ui-turn .area .ft_link::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto 0;
  width: 26px;
  height: 26px;
  display: flex;
  border-radius: calc(26px / 2);
  background-color: #16d381;
  background-image: url(../img/pc/arrow_white.svg);
  background-repeat: no-repeat;
  background-size: 7px auto;
  background-position: right 9px center;
}
#ui-turn .area .ft_link:hover {
  text-decoration: underline;
  opacity: 1;
}
#ui-turn .area .button {
  width: 120px;
  height: 40px;
  border-radius: calc(40px / 2);
  background-color: #fff;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.25);
  position: absolute;
  display: flex;
  align-items: center;
  padding-left: 30px;
  font-size: 14px;
  font-weight: bold;
  color: #00a960;
  transition: all 0.2s;
}
#ui-turn .area .button::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  margin: auto 0;
  width: 26px;
  height: 26px;
  display: flex;
  border-radius: calc(26px / 2);
  background-color: #16d381;
  background-image: url(../img/pc/arrow_white.svg);
  background-repeat: no-repeat;
  background-size: 7px auto;
  background-position: right 9px center;
  transition: all 0.2s;
}
#ui-turn .area .button:hover {
  background-color: #16d381;
  color: #fff;
  opacity: 1;
}
#ui-turn .area .button:hover::after {
  background-color: #fff;
  background-image: url(../img/pc/arrow_green.svg);
  opacity: 1;
}
#ui-turn .area .button#hokkaido {
  right: calc(195px - 25px);
  bottom: 428px;
}
#ui-turn .area .button#tohoku {
  right: calc(257px - 25px);
  bottom: 322px;
}
#ui-turn .area .button#kitakanto {
  right: calc(287px - 25px);
  bottom: 218px;
}
#ui-turn .area .button#shutoken {
  right: calc(257px - 25px);
  bottom: 165px;
}
#ui-turn .area .button#koshinetsu {
  right: calc(419px - 25px);
  bottom: 289px;
}
#ui-turn .area .button#hokuriku {
  right: calc(497px - 25px);
  bottom: 235px;
}
#ui-turn .area .button#tokai {
  right: calc(323px - 25px);
  bottom: 112px;
}
#ui-turn .area .button#kansai {
  right: calc(454px - 25px);
  bottom: 98px;
}
#ui-turn .area .button#chugoku {
  right: calc(585px - 25px);
  bottom: 177px;
}
#ui-turn .area .button#shikoku {
  right: calc(498px - 25px);
  bottom: 47px;
}
#ui-turn .area .button#kyushu {
  right: calc(691px - 25px);
  bottom: 61px;
}