@charset "utf-8";



#main_box { line-height: 2.0; }



/* JP ----------------- */





/* side_menu ----------------- */

li.btn005 {

  background-color: rgb(218,218,218);

  border-bottom-color: rgb(204,204,204) !important;

}

li.btn005 > a {

  pointer-events: none;

  cursor: auto;

}

#side_box .side_menu li.btn005 > a::after { display: none; }







/* contents ---- */

.box0_01 {

    margin: 35px auto 0;

    padding: 25px 15px;

    border: 4px #b6b2b2 solid;

    border-radius: 25px;

    text-align: center;

    line-height: 1.2;

    font-size: 26px;

    font-weight: 700;

}



#main_box .box0 .box0_02 .mission_box .ttl_s2 {

  position: relative;

  display: inline-block;

  border-left-style: none;

  background-color: transparent;

  font-size: 20px;

}

.box0 .box0_02 .mission_box .ttl_s2::before,

.box0 .box0_02 .mission_box .ttl_s2::after {

  position: absolute;

  display: block;

  width: 10px;

  height: 18px;

  content: '';

}

.box0 .box0_02 .mission_box .ttl_s2::before {

  top: 0;

  left: 0;

  border-top: 3px #f7af0d solid;

  border-left: 3px #f7af0d solid;

}

.box0 .box0_02 .mission_box .ttl_s2::after {

  bottom: 0;

  right: 0;

  border-bottom: 3px #f7af0d solid;

  border-right: 3px #f7af0d solid;

}



.box0 .box0_02 .mission_txt {

    padding-left: 80px;

    margin-top: 15px;

    background-repeat: no-repeat;

    background-size: 64px 56px;

    background-position: left center;

}

.box0 .box0_02 .box0_02_01 .mission_txt {

    background-image: url(/corporate/group_mission/images/icon01.png?ud=190121);

}

.box0 .box0_02 .box0_02_02 .mission_txt {

    background-image: url(/corporate/group_mission/images/icon02.png?ud=190121);

}

.box0 .box0_02 .box0_02_03 .mission_txt {

    background-image: url(/corporate/group_mission/images/icon03.png?ud=190121);

}

.box0 .box0_02 .box0_02_04 .mission_txt {

    background-image: url(/corporate/group_mission/images/icon04.png?ud=190121);

}

.box0 .box0_02 .sttl {

    font-size: 18px;

    font-weight: bold;

    display: inline;

    border-bottom: 1px solid;

    padding-bottom: 2px;

}

.box0 .box0_02 .text {

    margin-top: 10px;

    font-size: 14px;

}





.box02 .roadmap {

  position: relative;

}

.box02 .roadmap > li {

  display: block;

  position: relative;

}

.box02 .roadmap > li.background {

  display: flex;

  flex-direction: row;

  justify-content: flex-start;

  position: absolute;

  left: 0;

  top: 10px;

  width: 100%;

  height: 60%;

}

.box02 .roadmap > li.background > div {

  width: 27%;

  border-left: 1px rgb(230,230,230) dashed;

}

.box02 .roadmap > li.background > div:last-child {

  width: 19%;

}



.box02 .roadmap > li.year {

  display: flex;

  flex-direction: row;

  justify-content: flex-start;

}

.box02 .roadmap > li.year > div {

  width: 27%;

}

.box02 .roadmap > li.year > div:last-child {

  width: 19%;

}

.box02 .roadmap > li.year > div > span {

  display: inline-block;

  padding: 0 8px;

  border: 1px rgb(247,175,11) solid;

  line-height: 1.5;

}



.box02 .roadmap > li.image_box {

  position: relative;

  width: 100%;

  font-size: 14px;

}

/*

.box02 .roadmap > li.image_box .image {

  position: relative;

  padding-top: calc(109 / 660 * 100%);

  background-image: url(../images/img04.svg);

  background-repeat: no-repeat;

  background-position: center center;

  background-size: contain;

}

*/

.box02 .roadmap > li.image_box .image > div {

  position: absolute;

  left: 84%;

  font-size: 13px;

  line-height: 1.5;

}

.box02 .roadmap > li.image_box .image > .text01 {

  color: rgb(247,175,11);

  top: -10%;

}

.box02 .roadmap > li.image_box .image > .text02 {

  color: rgb(120,120,120);

  top: 72%;

}





.box02 .roadmap > li.image_box .image_text {

  top: 49%;

}



.box02 .roadmap > li.image_box .image_text::after {

  display: block;

  position: absolute;

  bottom: -30px;

  left: 50%;

  width: 1px;

  height: 30px;

  background-color: rgb(66,66,66);

  content: '';

}





.box02 .roadmap > li.title {

  display: flex;

  flex-direction: row;

  justify-content: flex-start;

}

.box02 .roadmap > li.title > div {

  display: flex;

  flex-direction: row;

  flex-wrap: wrap;

  align-items: center;

  justify-content: center;

  width: 27%;

  padding-right: 12px;

  padding-left: 12px;

  background-image: url(../images/bg_arrow.svg);

  background-repeat: no-repeat;

  background-position: center center;

  background-size: contain;

  font-size: 14px;

  line-height: 1.2;

}

.box02 .roadmap > li.title > div > span {

  display: inline-block;

  background-color: rgb(255,255,255);

}

.box02 .roadmap > li.title > div > span:first-child {

  padding-left: 4px;

}

.box02 .roadmap > li.title > div > span:last-child {

  padding-right: 4px;

}



.box02 .roadmap > li.text_box {

  display: flex;

  flex-direction: row;

}



.box02 .roadmap > li.text_box .text_body {

  display: flex;

  flex-direction: column;

  width: 27%;

  position: relative;

  padding: 16px 24px 16px 8px; 

  background-color: rgb(249,237,215);

  font-size: 81.25%;

}

.box02 .roadmap > li.text_box .text_body::before,

.box02 .roadmap > li.text_box .text_body::after {

  display: block;

  position: absolute;

  right: 0;

  top: 0;

  width: 16px;

  height: 100%;

  content: '';

}

.box02 .roadmap > li.text_box .text_body::before {

  background-color: rgb(255,255,255);

}

.box02 .roadmap > li.text_box .text_body::after {

  background:

    linear-gradient(to bottom left, rgba(255,255,255,0) 50%, rgb(249,237,215) 50.5%) no-repeat top left/100% 50%,

    linear-gradient(to top left, rgba(255,255,255,0) 50%, rgb(249,237,215) 50.5%) no-repeat bottom right/100% 50%;

}



.box02 .roadmap > li.text_box .text_body > li {

  line-height: 1.5;

  margin-bottom: 1em;

}



.box02 .roadmap > li.text_box .slogan {

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  width: 19%;

  height: auto;

  line-height: 1.5;

  font-weight: 700;

}



@media screen and (max-width:767px) {

  .box02 .roadmap > li.image_box .image_text {

    font-size: 10px;

      bottom:40%;

  }

  .box02 .roadmap > li.image_box .image_text::after {

    bottom: -20px;

    height: 20px;

  }

  .box02 .roadmap > li.text_box .text_body {

    padding: 8px 16px 8px 2px;

  }

  html[lang="en"] .box02 .roadmap > li.image_box {

    font-size: 11px;

  }

  html[lang="en"] .box02 .roadmap > li.title > div {

    font-size: 11px;

  }

  html[lang="en"] .box02 .roadmap > li.text_box .slogan {

    font-size: 11px;

  }

  html[lang="en"] .box02 .roadmap > li.text_box .text_body {

    padding-left: 0;

    font-size: 10px;

  }

}









.box04 .jinzai {

  

}

.box04 .jinzai > li {

  display: block;

  position: relative;

}

.box04 .jinzai > li > .title {

  position: relative;

  z-index: 120;

  width: 190px;

  margin-left: 32px;

  border: 2px rgb(247,175,11) solid;

  background-color: rgb(249,237,215);

  text-align: center;

  font-weight: 700;

}

html[lang="en"] .box04 .jinzai > li > .title {

  width: 290px;

  line-height: 1.3;

  padding-top: 6px;

  padding-bottom: 6px;

}



.box04 .jinzai > li > .text {

  position: relative;

  z-index: 100;

  border: 2px rgb(247,175,11) solid;

  padding-left: 64px;

  padding-top: 24px;

  padding-right: 120px;

  margin-top: -16px;

  min-height: 124px;

  background-repeat: no-repeat;

  background-position: right center;

}

.box04 .jinzai > li.item01 > .text {

  background-image: url(../images/icon11.png);

}

.box04 .jinzai > li.item02 > .text {

  background-image: url(../images/icon12.png);

}

.box04 .jinzai > li.item03 > .text {

  background-image: url(../images/icon13.png);

}

.box04 .jinzai > li > .text > li {

  line-height: 1.5;

}



@media screen and (max-width:767px) {

  .box04 .jinzai > li > .title {

    margin-left: 20px;

  }

  .box04 .jinzai > li > .text {

    padding-top: 20px;

    padding-left: 20px;

    padding-bottom: 10px;

  }

  html[lang="en"] .box04 .jinzai > li > .title {

    width: 80%;

    max-width: 280px;

    text-align: left;

    padding-left: 6px;

  }



}



.box06 .ttl_ss2 > .tit {

    width: 162px;

}



.strategy_items > ul > li > .item > ._tit {

    max-width: 100%;

}





.strategy_items > ul > ._h2_2 > ._tit {

    width: 250%;

}

.strategy_items > ul > li > .item {

        word-break: break-all;

}

.box01 .strategy_box > .j1 > .j1_2 {

    word-break: break-all;

    width: 150px;

    left: -180%;

    transform: rotate(90deg);

}

.box01 .strategy_box > .j2::after {

    right: 42px;

}

.strategy_items > ul > ._h2_2 > .item::before {

    bottom: -26px;

    height: calc(100% + 112px);

}



.strategy_items > ._h3 > li > .note ._arrow {

    top: 0;

    bottom: inherit;

}



@media screen and (max-width:767px) {

    .strategy_items > ul > ._h2_2 > ._tit {

        width: 250%;}



    .strategy_items > ._h3 > li {

    padding-bottom: 78px;

}

    .strategy_items > ul > li > .item > ._tit {

    text-align: center;

}

    strategy_items > ul > ._h2_2 > .item::before {

    bottom: -26px;

    height: calc(100% + 112px);

}

    .box01 .strategy_box > .j1 > .j1_2 {

    left: -420%;

}

}



.box06 ._m {

  font-weight: 700;

}