@charset "utf-8";



#main_box { line-height: 2.0; }



/* side_menu ----------------- */

li.btn131 {

  background-color: rgb(218,218,218);

  border-bottom-color: rgb(204,204,204) !important;

}

li.btn131 > a {

  pointer-events: none;

  cursor: auto;

}

#side_box .side_menu li.btn131 > a::after { display: none; }







/* contents ---- */



/* -- box01 ------ */

@media screen and (max-width: 767px) {

  #main_box .box_gray20 {

    padding: 8px;

  }

}



.box01 {

  

}

.box01 > .process_box {

  position: relative;

  margin-top: 60px;

}

.box01 > .process_box01 {

  margin-top: 0;

}

.box01 > .process_box::after {

  position: absolute;

  left: 50%;

  bottom: -49px;

  transform: translate3d(-50%, 0, 0);

  border-top: 39px rgb(241,241,241) solid;

  border-right: 94px transparent solid;

  border-left: 94px transparent solid;

  content: '';

}

.box01 > .process_box07::after {

  display: none;

}



.box01 > .process_box > p {

  letter-spacing: -.33px;

}

.box01 > .process_box h6 {

  font-weight: 700;

}



.box01 > .process_box > .box_gray20 > ul > li {

  padding-left: 1em;

  text-indent: -1em;

}

.box01 > .process_box ul._float {

}

.box01 > .process_box ul._float > li {

  display: inline-block;

  margin-right: 1em;

  padding-left: 0;

  text-indent: 0;

}

.box01 > .process_box .box_gray0 {

  background-color: #f4f4f4;

  padding-bottom: 48px;

}

.box01 > .process_box .box_gray0 > h6 {

  padding-left: 20px;

}



@media screen and (max-width: 767px) {

  .box01 > .process_box {

    margin-top: 30px;

  }

  .box01 > .process_box::after {

    bottom: -25px;

    border-top-width: 20px;

    border-right-width: 47px;

    border-left-width: 47px;

  }

}





#main_box .box01 > .process_box04 .box_gray20 {

  padding: 20px 10px;

}

.box01 > .process_box04 .box_gray20 > h6 {

  padding-left: 10px;

}

.box01 > .process_box04 .image_box {

  position: relative;

  padding-bottom: 20px;

  padding-left: 30px;

}

.box01 > .process_box04 .image_box .image {

  padding-bottom: 20px;

}

.box01 > .process_box04 .image_box .axis_x {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  height: 20px;

}

.box01 > .process_box04 .image_box .axis_x::before {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate3d(-50%, -50%, 0);

  width: calc(100% - 20px);

  height: 2px;

  background-color: rgb(0,0,0);

  content: '';

}

.box01 > .process_box04 .image_box .axis_x::after {

  position: absolute;

  top: 50%;

  right: 0;

  transform: translate3d(0, -50%, 0);

  border-top: 11px transparent solid;

  border-bottom: 11px transparent solid;

  border-left: 18px rgb(0,0,0) solid;

  content: '';

}

.box01 > .process_box04 .image_box .axis_x > span {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate3d(-50%, -50%, 0);

  display: block;

  padding-right: 8px;

  padding-left: 8px;

  background-color: #f4f4f4;

  font-weight: 700;

  text-align: center;

  line-height: 1;

  font-size: 12px;

}

.box01 > .process_box04 .image_box .axis_y {

  position: absolute;

  top: 0;

  left: 0;

  width: 20px;

  height: 100%;

}

.box01 > .process_box04 .image_box .axis_y::before {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate3d(-50%, -50%, 0);

  width: 2px;

  height: calc(100% - 20px);

  background-color: rgb(0,0,0);

  content: '';

}

.box01 > .process_box04 .image_box .axis_y::after {

  position: absolute;

  top: 0;

  left: 50%;

  transform: translate3d(-50%, 0, 0);

  border-right: 11px transparent solid;

  border-left: 11px transparent solid;

  border-bottom: 18px rgb(0,0,0) solid;

  content: '';

}

.box01 > .process_box04 .image_box .axis_y > span {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate3d(-50%, -50%, 0);

  display: block;

  width: 12px;

  height: 220px;

  background-color: #f4f4f4;

  font-weight: 700;

  text-align: center;

  line-height: 1;

  font-size: 12px;

  -ms-writing-mode: tb-rl;

  writing-mode: vertical-rl;

}

.box01 > .process_box04 .usage_guide {

  display: flex;

  justify-content: center;

  align-items: center;

}

.box01 > .process_box04 .usage_guide > li {

  position: relative;

  margin-right: 15px;

  padding-left: 48px;

  font-size: 12px;

  line-height: 14px;

  font-weight: 700;

}

.box01 > .process_box04 .usage_guide > li::before {

  position: absolute;

  top: 50%;

  left: 0;

  transform: translate3d(0, -50%, 0);

  display: block;

  width: 38px;

  height: 38px;

  margin-right: 10px;

  border-radius: 19px;

  content: '';

}

.box01 > .process_box04 .usage_guide > .item01::before {

  border: 1px rgb(208,18,27) solid;

}

.box01 > .process_box04 .usage_guide > .item02::before {

  background-color: rgb(208,18,27);

}

.box01 > .process_box04 .usage_guide > .item03::before {

  background-color: rgb(153,153,153);

}

.box01 > .process_box04 .usage_guide > li:last-child {

  margin-right: 0;

}



@media screen and (max-width: 767px) {

  #main_box .box01 > .process_box04 .box_gray20 {

    padding: 8px;

  }

  .box01 > .process_box04 ._scroll_x_box {

    position: relative;

  }

  .box01 > .process_box04 ._scroll_x_box::after {

    position: absolute;

    top: 0;

    right: 0;

    width: 51px;

    height: 51px;

    background-repeat: no-repeat;

    background-position: center center;

    background-image: url(../../images/icon_scroll_x.svg);

    background-size: contain;

    content: '';

  }

  .box01 > .process_box04 ._scroll_x {

    position: relative;

    width: 100%;

    height: 440px;

    overflow-x: scroll;

  }

  .box01 > .process_box04 ._scroll_x_inner {

    position: relative;

    width: 774px;

  }

}



.box01 .materiality_box .hex_panels {

  position: relative;

  width: 100%;

  padding-top: calc(1.732 * 1.5 * 7.14%);

  z-index: 90;

}

.box01 .materiality_box .hex_panels > li {

  position: absolute;

}

.box01 .materiality_box .hex_panels > li:nth-child(2n+1) {

  top: 0;

}

.box01 .materiality_box .hex_panels > li:nth-child(2n) {

  top: calc(100% / 3 + 3px);

}

.box01 .materiality_box .hex_panels .hex01 {

  left: calc((100% / 28) + 20px);

}

.box01 .materiality_box .hex_panels .hex02 {

  left: calc((100% / 28) * 4.2 + 20px);

}

.box01 .materiality_box .hex_panels .hex03 {

  left: calc((100% / 28) * 7.4 + 20px);

}

.box01 .materiality_box .hex_panels .hex04 {

  left: calc((100% / 28) * 10.6 + 20px);

}

.box01 .materiality_box .hex_panels .hex05 {

  left: calc((100% / 28) * 13.8 + 20px);

}

.box01 .materiality_box .hex_panels .hex06 {

  left: calc((100% / 28) * 17 + 20px);

}

.box01 .materiality_box .hex_panels .hex07 {

  left: calc((100% / 28) * 20.2 + 20px);

}

.box01 .materiality_box .hex_panels .hex08 {

  left: calc((100% / 28) * 23.4 + 20px);

}

.box01 .materiality_box .hex_panels > li > span > span {

  cursor: pointer;

}



.box01 .segment_list {

  border-right: 1px rgb(153,153,153) solid;

  border-bottom: 1px rgb(153,153,153) solid;

}

.box01 .segment_list > .segment_list_title {

  display: flex;

}

.box01 .segment_list > .segment_list_title > span,

.box01 .segment_list > .list_items > dt, 

.box01 .segment_list > .list_items > dd > ul > li {

  border-top: 1px rgb(153,153,153) solid;

  border-left: 1px rgb(153,153,153) solid;

}

.box01 .segment_list > .segment_list_title > span {

  display: flex;

  justify-content: center;

  align-items: center;

  height: 39px;

  background-color: rgb(255,255,255);

  font-weight: 700;

}

.box01 .segment_list > .segment_list_title > span:nth-child(1),

.box01 .segment_list > .list_items > dt {

  width: calc(158 / 793 * 100%);

}

.box01 .segment_list > .segment_list_title > span:nth-child(2),

.box01 .segment_list > .list_items > dd {

  width: calc(635 / 793 * 100%);

}

.box01 .segment_list > .list_items {

  display: flex;

  width: 100%;

}

.box01 .segment_list > .list_items > dt {

  display: flex;

  justify-content: center;

  align-items: center;

  min-height: 39px;

  font-weight: 700;

  font-size: 12px;

  padding-right: 4px;

  padding-left: 4px;

  text-align: center;

}

.box01 .segment_list > .list_items:nth-child(2n+1) > dt,

.box01 .segment_list > .list_items:nth-child(2n+1) > dd {

  background-color: rgb(255,255,255);

}

.box01 .segment_list > .list_items > dd > ul {

  display: flex;

}

.box01 .segment_list > .list_items > dd > ul > li {

  position: relative;

  display: block;

  width: calc(100% / 4);

  padding: 7px 7px 37px 7px;

  font-size: 12px;

  letter-spacing: -.2px;

  line-height: 14px;

}

.box01 .segment_list > .list_items > dd > ul > li .text {

  width: 100%;

  min-height: 26px;

  padding-bottom: 2px;

}

.box01 .segment_list > .list_items > dd > ul > li .hex_box {

  position: absolute;

  display: flex;

  align-items: center;

  bottom: 7px;

  right: 7px;

}

.box01 .segment_list > .list_items > dd > ul > li .hex_box .arrow {

  display: block;

  width: 22px;

  height: 20px;

  margin-right: 5px;

  background-repeat: no-repeat;

  background-position: center center;

  background-image: url(../images/icon_arrow.svg);

  background-size: contain;

}



@media screen and (max-width: 767px) {

  .box01 .segment_list > .segment_list_title > span:nth-child(1),

  .box01 .segment_list > .list_items > dt {

    width: calc(100 / 342 * 100%);

  }

  .box01 .segment_list > .segment_list_title > span:nth-child(2),

  .box01 .segment_list > .list_items > dd {

    width: calc(242 / 342 * 100%);

  }

  .box01 .segment_list > .list_items > dt {

    line-height: 1.4;

    text-align: center;

  }

  .box01 .segment_list > .list_items > dt ._lss {

    letter-spacing: -.75px;

  }

  .box01 .segment_list > .list_items > dd > ul {

    flex-wrap: wrap;

  }

  .box01 .segment_list > .list_items > dd > ul > li {

    width: calc(100% / 2);

  }

  .box01 .segment_list > .list_items > dd > ul > li.for_pc {

    display: none;

  }

  

}





.box01 .panel .hex {

  position: relative;

  display: block;

  width: 34px;

  height: 30px;

  background-repeat: no-repeat;

  background-position: center center;

  background-size: contain;

  cursor: pointer;

}

.box01 .panel .panel01 .hex {

  background-image: url(../../images/icon8_01.svg);

}

.box01 .panel .panel02 .hex {

  background-image: url(../../images/icon8_02.svg);

}

.box01 .panel .panel03 .hex {

  background-image: url(../../images/icon8_03.svg);

}

.box01 .panel .panel04 .hex {

  background-image: url(../../images/icon8_04.svg);

}

.box01 .panel .panel05 .hex {

  background-image: url(../../images/icon8_05.svg);

}

.box01 .panel .panel06 .hex {

  background-image: url(../../images/icon8_06.svg);

}

.box01 .panel .panel07 .hex {

  background-image: url(../../images/icon8_07.svg);

}

.box01 .panel .panel08 .hex {

  background-image: url(../../images/icon8_08.svg);

}



#select_material.mark01 ._mark01 {

  background: linear-gradient(to right, transparent 10%, rgba(255,102,0,.3));

}

#select_material.mark02 ._mark02 {

  background: linear-gradient(to right, transparent 10%, rgba(255,80,80,.3));

}

#select_material.mark03 ._mark03 {

  background: linear-gradient(to right, transparent 10%, rgba(112,48,160,.3));

}

#select_material.mark04 ._mark04 {

  background: linear-gradient(to right, transparent 10%, rgba(84,130,53,.3));

}

#select_material.mark05 ._mark05 {

  background: linear-gradient(to right, transparent 10%, rgba(255,153,0,.3));

}

#select_material.mark06 ._mark06 {

  background: linear-gradient(to right, transparent 10%, rgba(0,112,192,.3));

}

#select_material.mark07 ._mark07 {

  background: linear-gradient(to right, transparent 10%, rgba(89,89,89,.3));

}

#select_material.mark08 ._mark08 {

  background: linear-gradient(to right, transparent 10%, rgba(255,192,0,.3));

}

#select_material.mark05.mark04 ._mark05._mark04 {

  background: linear-gradient(to right, transparent 10%, rgba(255,153,0,.3) 55%, rgba(84,130,53,.3));

}

#select_material.mark05.mark06 ._mark05._mark06 {

  background: linear-gradient(to right, transparent 10%, rgba(255,153,0,.3) 55%, rgba(0,112,192,.3));

}



#select_material.mark01 #mark01,

#select_material.mark02 #mark02,

#select_material.mark03 #mark03,

#select_material.mark04 #mark04,

#select_material.mark05 #mark05,

#select_material.mark06 #mark06,

#select_material.mark07 #mark07,

#select_material.mark08 #mark08 {

  opacity: .7;

}



@media screen and (max-width: 767px) {

  .box01 .materiality_box .hex_panels {

    padding-top: calc(1.732 * 5.5 * 7.14%);

  }

  .box01 .materiality_box .hex_panels > li {

    width: calc(100% / 7);

  }

  .box01 .materiality_box .hex_panels > .hex01,

  .box01 .materiality_box .hex_panels > .hex03 {

    top: 0 !important;

  }

  .box01 .materiality_box .hex_panels > .hex02,

  .box01 .materiality_box .hex_panels > .hex04 {

    top: calc(18.5% + 3px) !important;

  }

  .box01 .materiality_box .hex_panels > .hex05,

  .box01 .materiality_box .hex_panels > .hex07 {

    top: calc(37% + 6px) !important;

  }

  .box01 .materiality_box .hex_panels > .hex06,

  .box01 .materiality_box .hex_panels > .hex08 {

    top: calc(55.5% + 9px) !important;

  }

  .box01 .materiality_box .hex_panels .hex01,

  .box01 .materiality_box .hex_panels .hex05 {

    left: calc((100% / 14) + 5px);

  }

  .box01 .materiality_box .hex_panels .hex02,

  .box01 .materiality_box .hex_panels .hex06 {

    left: calc((100% / 14) * 4.2 + 5px);

  }

  .box01 .materiality_box .hex_panels .hex03,

  .box01 .materiality_box .hex_panels .hex07 {

    left: calc((100% / 14) * 7.4 + 5px);

  }

  .box01 .materiality_box .hex_panels .hex04,

  .box01 .materiality_box .hex_panels .hex08 {

    left: calc((100% / 14) * 10.6 + 5px);

  }

  .box01 .materiality_box .hex_panels > li > span {

    padding-top: calc(1.732 * 100%);

  }

  .box01 .materiality_box .hex_panels > li > span > span {

    width: 166%;

  }

  

  #select_material.mark01 ._mark01 {

    background: linear-gradient(to right, rgb(255,255,255) 5%, rgb(255,224,204) 60%);

  }

  #select_material.mark02 ._mark02 {

    background: linear-gradient(to right, rgb(255,255,255) 5%, rgb(255,220,220) 60%);

  }

  #select_material.mark03 ._mark03 {

    background: linear-gradient(to right, rgb(255,255,255) 5%, rgb(226,214,236) 60%);

  }

  #select_material.mark04 ._mark04 {

    background: linear-gradient(to right, rgb(255,255,255) 5%, rgb(221,230,215) 60%);

  }

  #select_material.mark05 ._mark05 {

    background: linear-gradient(to right, rgb(255,255,255) 5%, rgb(255,235,205) 60%);

  }

  #select_material.mark06 ._mark06 {

    background: linear-gradient(to right, rgb(255,255,255) 5%, rgb(204,226,242) 60%);

  }

  #select_material.mark07 ._mark07 {

    background: linear-gradient(to right, rgb(255,255,255) 5%, rgb(205,205,205) 60%);

  }

  #select_material.mark08 ._mark08 {

    background: linear-gradient(to right, rgb(255,255,255) 5%, rgb(255,242,204) 60%);

  }

  #select_material.mark05.mark04 ._mark05._mark04 {

    background: linear-gradient(to right, rgb(255,255,255) 5%, rgb(255,235,205) 40%, rgb(221,230,215) 80%);

  }

  #select_material.mark05.mark06 ._mark05._mark06 {

    background: linear-gradient(to right, rgb(255,255,255) 5%, rgb(255,235,205) 40%, rgb(204,226,242) 80%);

  }

}





/* -- box03 ------ */



.materiality_box {

  position: relative;

}



.box03 .materiality_box .hex_panels {

  position: relative;

  width: 100%;

  padding-top: calc(1.732 * 1.5 * 7.14%);

  z-index: 90;

}

.box03 .materiality_box .hex_panels > li {

  position: absolute;

}



.materiality_box .hex_panels > li {

  width: calc(100% / 14);

  background-color: rgb(89,89,89);

}

.materiality_box .hex_panels > li::before,

.materiality_box .hex_panels > li::after {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: rgb(89,89,89);

  z-index: 0;

  content: '';

}

.materiality_box .hex_panels > li::before {

  transform: rotate(60deg);

}

.materiality_box .hex_panels > li::after {

  transform: rotate(-60deg);

}



.box03 .materiality_box .hex_panels > .hex01 {

  top: 0;

  left: -6px;

}

.materiality_box .hex_panels > .hex01,

.materiality_box .hex_panels > .hex01 p > span,

.materiality_box .hex_panels > .hex01::before,

.materiality_box .hex_panels > .hex01::after {

  background-color: rgb(255,102,0);

}

.box03 .materiality_box .hex_panels > .hex02 {

  top: calc(100% / 3 + 3px);

  left: calc(7.14% * 1.5 - 3px);

}

.materiality_box .hex_panels > .hex02,

.materiality_box .hex_panels > .hex02 p > span,

.materiality_box .hex_panels > .hex02::before,

.materiality_box .hex_panels > .hex02::after {

  background-color: rgb(255,80,80);

}



.box03 .materiality_box .hex_panels > .hex03 {

  top: 0;

  left: calc(7.14% * 3);

}

.materiality_box .hex_panels > .hex03,

.materiality_box .hex_panels > .hex03 p > span,

.materiality_box .hex_panels > .hex03::before,

.materiality_box .hex_panels > .hex03::after {

  background-color: rgb(112,48,160);

}

.box03 .materiality_box .hex_panels > .hex04 {

  top: calc(100% / 3 + 3px);

  left: calc(7.14% * 4.75);

}

.materiality_box .hex_panels > .hex04,

.materiality_box .hex_panels > .hex04 p > span,

.materiality_box .hex_panels > .hex04::before,

.materiality_box .hex_panels > .hex04::after {

  background-color: rgb(84,130,53);

}

.box03 .materiality_box .hex_panels > .hex05 {

  top: 0;

  left: calc(7.14% * 6.5);

}

.materiality_box .hex_panels > .hex05,

.materiality_box .hex_panels > .hex05 p > span,

.materiality_box .hex_panels > .hex05::before,

.materiality_box .hex_panels > .hex05::after {

  background-color: rgb(255,153,0);

}

.box03 .materiality_box .hex_panels > .hex06 {

  top: calc(100% / 3 + 3px);

  left: calc(7.14% * 8.25);

  background-color: rgb(0,112,192);

}

.materiality_box .hex_panels > .hex06,

.materiality_box .hex_panels > .hex06 p > span,

.materiality_box .hex_panels > .hex06::before,

.materiality_box .hex_panels > .hex06::after {

  background-color: rgb(0,112,192);

}

.box03 .materiality_box .hex_panels > .hex07 {

  top: 0;

  left: calc(7.14% * 11 - 3px);

}

.box03 .materiality_box .hex_panels > .hex08 {

  top: calc(100% / 3 + 3px);

  left: calc(7.14% * 12.5);

}

.materiality_box .hex_panels > .hex08,

.materiality_box .hex_panels > .hex08 p > span,

.materiality_box .hex_panels > .hex08::before,

.materiality_box .hex_panels > .hex08::after {

  background-color: rgb(255,192,0);

}



.materiality_box .hex_panels > li > span {

  display: block;

  position: relative;

  padding-top: calc(1.732 * 100%);

  z-index: 100;

}

.materiality_box .hex_panels > li > span > span {

  display: flex;

  justify-content: center;

  align-items: center;

  position: absolute;

  top: 0;

  left: 50%;

  width: 166%;

  height: 100%;

  font-size: 11px;

  /* font-weight: 700; */

  line-height: 1.3;

  color: rgb(255,255,255);

  transform: translate3d(-50%, 0, 0);

  text-align: center;

}



.box03 .missions {

  position: relative;

  display: flex;

  justify-content: space-between;

  z-index: 80;

}

.box03 .missions > li {

  position: relative;

  width: calc((100% - 15px) / 4);

  margin-top: calc(-1.732 * 1.5 * 7.14%);

  padding-top: calc(1.732 * 1.5 * 7.14% + 20px);

}

.box03 .missions > li::before {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  height: 50%;

  background-color: rgb(242,242,242);

  content: '';

}

.box03 .missions > li::after {

  position: absolute;

  top: 0;

  right: -3px;

  width: 1px;

  height: 100%;

  background-color: rgb(202,202,202);

  content: '';

}

.box03 .missions > li:last-child::after {

  display: none;

}

.box03 .missions > li > .title {

  position: relative;

  padding-top: 8px;

  padding-bottom: 8px;

  background-color: rgb(230,230,230);

  text-align: center;

  font-weight: 700;

  line-height: 1.5;

}

.box03 .missions > li > .sub_tit {

  display: flex;

  justify-content: center;

  align-items: center;

  position: relative;

  min-height: 90px;

  text-decoration: underline;

  padding: 8px;

  background-color: rgb(242,242,242);

  line-height: 1.5;

  font-weight: 700;

}

.box03 .missions > li > .text {

  position: relative;

  padding: 8px;

  background-color: rgb(242,242,242);

  font-size: 87.5%;

}



.box03 .slogan {

  position: relative;

  margin-top: 64px;

  font-weight: 700;

  font-size: 125%;

  line-height: 1.2;

  text-align: center;

}

.box03 .slogan::before {

  position: absolute;

  top: -30px;

  left: 50%;

  width: 140px;

  height: 30px;

  transform: translate3d(-50%, -50%, 0);

  background: linear-gradient(to top right, rgba(255,255,255,0) 50%, rgb(202,202,202) 50%) no-repeat top left/50% 100%,linear-gradient(to top left, rgba(255,255,255,0) 50%, rgb(202,202,202) 50%) no-repeat bottom right/50% 100%;

  content: '';

}





@media screen and (max-width: 980px) {

  .materiality_box .hex_panels > li > span > span {

    font-size: calc(1.6949vw - 5.6102px);

  }

}

@media screen and (max-width: 920px) {

  .materiality_box .hex_panels > li > span > span {

    font-size: 10px;

  }

}

@media screen and (max-width: 767px) {

  .box03 .materiality_box {

    display: flex;

    justify-content: space-between;

    flex-wrap: wrap;

  }

  .box03 .materiality_box .hex_panels {

    width: 120px;

    padding-top: 0;

  }

  

  .materiality_box .hex_panels > li {

    width: calc(100% / 1.5);

  }

  .materiality_box .hex_panels > li > span {

    padding-top: calc((1 / 1.732) * 100%);

  }

  

  .box03 .materiality_box .hex_panels > li {

    position: relative;

    margin-top: 25px;

  }

  .box03 .materiality_box .hex_panels > li:nth-child(2n) {

    margin-left: 41px;

  }

  .box03 .materiality_box .hex_panels > .hex01 {

    top: 0;

    left: 0;

    margin-top: 34px;

  }

  .box03 .materiality_box .hex_panels > .hex02 {

    top: 0;

    left: 0;  }

  .box03 .materiality_box .hex_panels > .hex03 {

    top: 0;

    left: 0;

  }

  .box03 .materiality_box .hex_panels > .hex04 {

    top: 0;

    left: 0;

    margin-top: 54px;

  }

  .box03 .materiality_box .hex_panels > .hex05 {

    top: 0;

    left: 0;

    margin-top: 54px;

  }

  .box03 .materiality_box .hex_panels > .hex06 {

    top: 0;

    left: 0;

    margin-top: 72px;

  }

  .box03 .materiality_box .hex_panels > .hex07 {

    top: 0;

    left: 0;

    margin-top: 106px;

  }

  .box03 .materiality_box .hex_panels > .hex08 {

    top: 0;

    left: 0;

  }

  .materiality_box .hex_panels > li > span > span {

    width: 100%;

  }



  

  .box03 .materiality_box .missions {

    width: calc(100% - 128px);

    flex-direction: column;

  }

  .box03 .missions > li {

    width: 100%;

    margin-top: 5px;

    padding-top: 0;

  }

  .box03 .missions > li::before {

    display: none;

  }

  .box03 .missions > li::after {

    right: 0;

    top: -3px;

    width: calc(100% + 128px);

    height: 1px;

    background-color: rgb(202,202,202);

    content: '';

  }

  .box03 .missions > li:first-child::after {

    display: none;

  }

  .box03 .missions > li:last-child::after {

    display: block;

  }

  .box03 .missions > li > .sub_tit {

    min-height: 30px;

  }

  .box03 .materiality_box .materiality_box .slogan {

    width: 100%;

  }

  .box03 .missions > li > .text {

    min-height: 120px;

  }

}