@charset "UTF-8";
/* placeholder color */
/**********************************************************************************************

　works

**********************************************************************************************/
/*---------------------------------------------
tit
---------------------------------------------*/
.work_statement {
  position: absolute;
  top: 120px;
  left: 0; }
  @media (max-width: 980px) {
    .work_statement {
      top: 50px; } }
  @media (max-width: 767px) {
    .work_statement {
      top: 0;
      width: 90vw;
      padding: 0 5vw; } }

.work_titArea {
  margin: 0 0 40px;
  position: relative;
  padding: 0 0 0 60px; }
  @media (max-width: 767px) {
    .work_titArea {
      padding: 0;
      margin: 0 0 20px; } }
  .work_titArea::after {
    content: "";
    display: block;
    background: url("../img/works/work_icon01.svg") no-repeat;
    background-size: contain;
    width: 40px;
    height: 60px;
    position: absolute;
    top: -5px;
    left: 0; }
    @media (max-width: 767px) {
      .work_titArea::after {
        width: 24px;
        height: 36px;
        top: -3px; } }

.work_tit {
  font-size: 3.2rem;
  font-weight: 900;
  color: #d3b78f;
  margin: 0 0 15px; }
  @media (max-width: 767px) {
    .work_tit {
      font-size: 2rem;
      margin: 0 0 15px 35px; } }

.works_txtList {
  font-size: 2rem;
  font-weight: 700;
  margin: 0 0 0 60px; }
  @media (max-width: 767px) {
    .works_txtList {
      margin: 0;
      font-size: 1.6rem; } }
  .works_txtList li {
    padding-left: 30px;
    position: relative; }
    @media (max-width: 767px) {
      .works_txtList li {
        padding-left: 25px; } }
    .works_txtList li:nth-child(1) {
      color: #2488aa;
      margin: 0 0 10px; }
      .works_txtList li:nth-child(1)::after {
        background: url("../img/works/work_icon02.svg") no-repeat;
        background-size: contain; }
    .works_txtList li:nth-child(2) {
      color: #e1560f; }
      .works_txtList li:nth-child(2)::after {
        background: url("../img/works/work_icon03.svg") no-repeat;
        background-size: contain; }
    .works_txtList li::after {
      content: "";
      display: block;
      width: 20px;
      height: 30px;
      position: absolute;
      top: 0;
      left: 0; }
      @media (max-width: 767px) {
        .works_txtList li::after {
          width: 17px;
          height: 25px; } }

/*---------------------------------------------
map
---------------------------------------------*/
.work_map {
  position: relative;
  top: -120px;
  margin: 0 0 -120px; }
  @media (max-width: 980px) {
    .work_map {
      top: -50px;
      margin: 0 0 -50px; } }
  @media (max-width: 767px) {
    .work_map {
      top: auto;
      margin: 0 0 0 -5vw;
      padding: 150px 0 0;
      width: 100vw; } }

@media (max-width: 767px) {
  .mapList {
    border-top: 1px solid #2488aa; } }
.mapList li {
  position: absolute; }
  @media (max-width: 767px) {
    .mapList li {
      position: static;
      border-bottom: 1px solid #2488aa;
      border-left: 1px solid #2488aa;
      border-right: 1px solid #2488aa; } }
  @media (min-width: 768px) {
    .mapList li:hover .mapList_content {
      visibility: visible;
      opacity: 1;
      height: 130px; }
    .mapList li:hover .mapList_num {
      -webkit-transform: translate(0, 3px);
      transform: translate(0, 3px);
      box-shadow: none; } }
@media (max-width: 767px) {
  .mapList.-orange {
    border-top: 1px solid #e1560f; } }
@media (max-width: 767px) {
  .mapList.-orange li {
    position: static;
    border-bottom: 1px solid #e1560f;
    border-left: 1px solid #e1560f;
    border-right: 1px solid #e1560f; } }
.mapList.-orange .mapList_num {
  color: #e1560f;
  border-color: #e1560f;
  box-shadow: 0 3px 0 #e1560f; }
.mapList.-orange .mapList_content {
  color: #e1560f; }
.mapList.-orange .mapList_content_position::after {
  background: #e1560f; }
@media (max-width: 767px) {
  .mapList a {
    display: flex;
    padding: 0 15px;
    align-items: center; } }

.mapList_num {
  border: 1px solid #2488aa;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2488aa;
  font-size: 3rem;
  font-weight: 500;
  font-family: 'Rajdhani', sans-serif;
  background: url("../img/works/wood_bg.png") no-repeat;
  background-size: cover;
  border-radius: 50%;
  overflow: hidden;
  box-shadow: 0 3px 0 #2488aa;
  transition: .4s; }
  @media (max-width: 767px) {
    .mapList_num {
      font-size: 2.1rem;
      width: 40px;
      height: 40px;
      margin: 0 10px 0 0;
      padding: 1px 0 0;
      flex-shrink: 0;
      box-shadow: none !important; } }

.mapList_content {
  position: absolute;
  width: 250px;
  height: 0px;
  display: flex;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  flex-direction: column-reverse;
  align-items: center;
  justify-content: center;
  color: #2488aa;
  background: url("../img/works/baloon.svg") no-repeat;
  background-size: 100% 120px;
  border-radius: 10px;
  padding-bottom: 30px;
  z-index: 30;
  visibility: hidden;
  opacity: 0;
  transition: .4s opacity; }
  @media (max-width: 767px) {
    .mapList_content {
      background: none;
      position: relative;
      top: 0;
      left: 0;
      transform: none;
      align-items: flex-start;
      height: 80px;
      opacity: 1;
      visibility: visible;
      flex-direction: column;
      padding: 0;
      width: 100%; } }
  .mapList_content::after {
    content: ">";
    position: absolute;
    font-size: 1.8rem;
    top: 40px;
    right: 15px;
    font-weight: 500;
    font-family: 'Rajdhani', sans-serif; }
    @media (max-width: 767px) {
      .mapList_content::after {
        top: 50%;
        transform: translateY(-50%);
        right: 0; } }

.mapList_content_tit {
  font-size: 1.8rem;
  font-weight: 700;
  min-height: 1px; }
  @media (max-width: 767px) {
    .mapList_content_tit {
      line-height: 1.1; } }

.mapList_content_position {
  font-size: 1.4rem;
  position: relative;
  min-height: 1px;
  margin: 0 0 10px; }
  @media (min-width: 768px) {
    .mapList_content_position::after {
      width: 16px;
      height: 1px;
      content: "";
      display: block;
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      top: calc(100% + 5px);
      background: #2488aa; } }
  @media (max-width: 767px) {
    .mapList_content_position {
      margin: 3px 0 0; } }

.mapItem01 {
  top: 52%;
  left: 39%; }

.mapItem02 {
  top: 62%;
  right: 15%; }

.mapItem03 {
  top: 75%;
  right: 5%; }

.mapItem04 {
  bottom: 5%;
  right: 27%; }

.mapItem05 {
  top: 46%;
  right: 14%; }

.mapItem06 {
  top: 59%;
  left: 31%; }

.mapItem07 {
  top: 53%;
  left: 49%; }

.mapItem08 {
  top: 25%;
  left: 64%; }

.mapItem09 {
  top: 32%;
  left: 57%; }

.mapItem10 {
  top: 40%;
  left: 49%; }

.mapItem11 {
  bottom: 9%;
  left: 39%; }

.mapItem12 {
  top: 53%;
  right: 5%; }

.mapItem13 {
  bottom: 10%;
  right: 14%; }

.mapItem14 {
  bottom: 25%;
  right: 22%; }

.mapItem15 {
  bottom: 2%;
  right: 47%; }

.mapItem16 {
  bottom: 5%;
  right: 38%; }

.mapItem17 {
  bottom: 37%;
  left: 7.5%; }

.mapItem18 {
  bottom: 40%;
  left: 18.5%; }

.mapItem19 {
  top: 27%;
  right: 5%; }

@media (max-width: 767px) {
  .map_box {
    width: 90vw;
    margin: 70px auto 0; }
    .map_box:last-child {
      margin: 50px auto 0; } }

@media (max-width: 767px) {
  .map_tit {
    text-align: center;
    font-size: 1.8rem;
    font-weight: 700;
    position: relative;
    margin: 0 0 30px;
    color: #2488aa; }
    .map_tit::after {
      content: "";
      display: block;
      width: 0;
      height: 0;
      border-style: solid;
      border-width: 10px 15px 0 15px;
      border-color: #2488aa transparent transparent transparent;
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      top: calc(100% + 5px); } }
.map_tit.-orange {
  color: #e1560f; }
  .map_tit.-orange::after {
    border-color: #e1560f transparent transparent transparent; }

@media (max-width: 767px) {
  .work_map_img {
    position: relative;
    z-index: 1000; } }
