@charset "utf-8";



#main_box { line-height: 2.0; }



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

#side_box .side_menu .menu_grp_c.grp21 {

}

li.btn211 {

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

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

}

li.btn211 > a {

  pointer-events:none;

  cursor: auto;

}

#side_box .side_menu .menu_grp_c > li.btn211 > a::after {

  display: none;

}





/* contents ---- */



.box02_01 h5 {

    font-weight: 700;

    font-size: 1.6rem;

}



.box02_01 {

  text-align: center;

  font-size: 1.4rem;

  line-height: 1.5;

}



.box02_01 .box_02_01_t1 {

  border-radius: 6px;

  padding: 12px 6px;

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

}

.box02_01 > .box_02_01_t1 {

  width: calc((100% - 96px) / 3);

  margin-right: auto;

  margin-left: auto;

}

.box02_01 .box_02_01_t3,

.box02_01 .box_02_01_t10 {

  display: flex;

  flex-direction: row;

}

.box02_01 .box_02_01_t3.ww2 {

  display: flex;

  flex-direction: row;

  justify-content: center;

}



.box02_01 .box_02_01_t3 > li:nth-child(2n+1) {

  width: calc((100% - 96px) / 3);

}

.box02_01 .box_02_01_t3 > li:nth-child(2n) {

  width: 48px;

}



html[lang="en"] .box02_01 .box_02_01_t3 > li:nth-child(2n+1) {

  width: calc((100% - 192px) / 3);

}

html[lang="en"] .box02_01 .box_02_01_t3 > li:nth-child(2n) {

  width: 96px;

}

.box02_01 .box_02_01_t3 .box_02_01_t1,

.box02_01 .box_02_01_t10 .box_02_01_t1 {

  display: flex;

  flex-direction: row;

  flex-wrap: wrap;

  align-items: center;

  height: 100%;

}

.box02_01 .box_02_01_t3 .box_02_01_t1 > span,

.box02_01 .box_02_01_t3 .box_02_01_t1 > div,

.box02_01 .box_02_01_t10 .box_02_01_t1 > span,

.box02_01 .box_02_01_t10 .box_02_01_t1 > div {

  width: 100%;

}

.box02_01 .box_02_01_t2,

.box02_01 .box_02_01_t4 {

  position: relative;

  height: 48px;

}

.box02_01 .box_02_01_t8 {

  position: relative;

  margin-top: 24px;

  height: 24px;

}

.box02_01 .box_02_01_t2,.box02_01 .box_02_01_t8 {

  display: flex;

  flex-direction: row;

  justify-content: center;

}

.box02_01 .box_02_01_t8::before,

.box02_01 .box_02_01_t8::after {

  display: block;

  position: absolute;

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

  content: '';

}

.box02_01 .box_02_01_t8::before {

  top: -24px;

  left: 50%;

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

  width: 3px;

  height: 24px;

}

.box02_01 .box_02_01_t8::after {

  top: -2px;

  left: 50%;

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

  width: calc((100% - 172px) / 3 * 2 + 172px + 3px);

  height: 3px;  

}

.box02_01 .box_02_01_t2 > li,.box02_01 .box_02_01_t8 > li {

  display: flex;

  justify-content: center;

  align-items: center;

  position: relative;

  width: 64px;

  margin: 0 16px;

}

.box02_01 .box_02_01_t8 li.w136 {

    /* width: 176px; */

    width: calc((100% - 172px) / 3);

    margin: 0 0;

}



html[lang="en"] .box02_01 .box_02_01_t2 > li {

/*  width: 96px;*/

}

html[lang="en"] .box02_01 .box_02_01_t8 > li {

/*  width: 96px;*/

}

.box02_01 .box_02_01_t2 > li::before {

  display: block;

  position: absolute;

  width: 3px;

  height: 40px;

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

  content: '';

}

.box02_01 .box_02_01_t2 > li:first-child::before {

  bottom: 0;

  right: 0;

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

}

.box02_01 .box_02_01_t2 > li:last-child::before {

  top: 0;

  left: 0;

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

}

.box02_01 .box_02_01_t2 > li::after {

  display: block;

  position: absolute;

  width: 0;

  border-right: 5px transparent solid;

  border-left: 5px transparent solid;

  content: '';

}

.box02_01 .box_02_01_t2 > li:first-child::after {

  top: 0;

  right: 0;

  border-bottom: 12px rgb(158,158,158) solid;

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

}

.box02_01 .box_02_01_t2 > li:last-child::after {

  bottom: 0;

  left: 0;

  border-top: 12px rgb(158,158,158) solid;

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

}



.box02_01 .box_02_01_t2 > li > span {

  display: block;

}



.box02_01 .box_02_01_t8 > li::before {

  display: block;

  position: absolute;

  width: 3px;

  height: 17px;

  top:0;

  left: 50%;

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

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

  content: '';

}

.box02_01 .box_02_01_t8 > li:first-child {

  margin-right: 86px;

  /* justify-content: flex-end */;

}

.box02_01 .box_02_01_t8 > li:last-child {

  margin-left: 86px;

  /* justify-content: flex-start; */

}



.box02_01 .box_02_01_t8 > li::after {

  display: block;

  position: absolute;

  width: 0;

  border-right: 5px transparent solid;

  border-left: 5px transparent solid;

  content: '';

}

.box02_01 .box_02_01_t8 > li::after {

  bottom: 0;

  right: 50%;

  border-top: 12px rgb(158,158,158) solid;

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

}





.box02_01 .box_02_01_t8 > li > span {

  position: absolute;

  top: -24px;

  left: 50%;

  width: 160px;

  display: block;

  padding: 3px;

}



.box02_01 .box_02_01_t5 {

  border: 1px rgb(128,128,128) solid;

  padding: 0 2px;

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

  font-size: 87.5%;

}

.box02_01 .box_02_01_t4 {

  display: block;

  position: relative;

}

.box02_01 .box_02_01_t4::before {

  display: block;

  position: absolute;

  top: 0;

  left: 50%;

  width: 3px;

  height: 40px;

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

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

  content: '';

}

.box02_01 .box_02_01_t4::after {

  display: block;

  position: absolute;

  bottom: 0;

  left: 50%;

  width: 0;

  border-top: 12px rgb(158,158,158) solid;

  border-right: 5px transparent solid;

  border-left: 5px transparent solid;

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

  content: '';

}

.box02_01 .box_02_01_t4 > span {

  display: block;

  position: absolute;

  left: calc(50% + 16px);

  top: 50%;

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

}

.box02_01 .box_02_01_t6 {

}

.box02_01 .box_02_01_t6 > span {

  display: block;

  position: relative;

  margin-top: 8px;

}

.box02_01 .box_02_01_t6 > span:first-child {

  padding-bottom: 12px;

}

.box02_01 .box_02_01_t6 > span:last-child {

  height: 12px;

}

.box02_01 .box_02_01_t6 > span::before,

.box02_01 .box_02_01_t6 > span::after {

  display: block;

  position: absolute;

  content: '';

}

.box02_01 .box_02_01_t6 > span::before {

  bottom: 0;

  width: 40px;

  height: 3px;

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

}

html[lang="en"] .box02_01 .box_02_01_t6 > span::before {

  width: 88px;

}

.box02_01 .box_02_01_t6 > span:first-child::before {

  left: 0;

}

.box02_01 .box_02_01_t6 > span:last-child::before {

  right: 0;

}

.box02_01 .box_02_01_t6 > span::after {

  bottom: -3px;

  border-top: 5px transparent solid;

  border-bottom: 5px transparent solid;

}

.box02_01 .box_02_01_t6 > span:first-child::after {

  right: 0;

  border-left: 12px rgb(158,158,158) solid;

}

.box02_01 .box_02_01_t6 > span:last-child::after {

  left: 0;

  border-right: 12px rgb(158,158,158) solid;

}



.box02_01 .box_02_01_t10 > li:nth-child(2n+1) {

  width: calc((100% - 172px) / 3);

}

.box02_01 .box_02_01_t10 > li:nth-child(2n) {

  width: 86px;

}

.box02_01 .box_02_01_t7 {

}



.box02_01 .box_02_01_t7 > span {

  display: block;

  position: relative;

  margin-bottom: 20px;

}

.box02_01 .box_02_01_t7 > span:first-child {

  padding-bottom: 12px;

}

.box02_01 .box_02_01_t7 > span:last-child {

  height: 12px;

}

.box02_01 .box_02_01_t7 > span::before,

.box02_01 .box_02_01_t7 > span::after {

  display: block;

  position: absolute;

  content: '';

}

.box02_01 .box_02_01_t7 > span::before {

  bottom: 0;

  width: 78px;

  height: 3px;

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

}

.box02_01 .box_02_01_t7 > span::before {

  left: 0;

}

.box02_01 .box_02_01_t7 > span::after {

  bottom: -3px;

  border-top: 5px transparent solid;

  border-bottom: 5px transparent solid;

}

.box02_01 .box_02_01_t7 > span::after {

  right: 0;

  border-left: 12px rgb(158,158,158) solid;

}



.box02_01 .box_02_01_t9 {

}



.box02_01 .box_02_01_t9 > span {

  display: block;

  position: relative;

  margin-bottom: 20px;

}

.box02_01 .box_02_01_t9 > span:first-child {

  padding-bottom: 12px;

}

.box02_01 .box_02_01_t9 > span:last-child {

  height: 12px;

}

.box02_01 .box_02_01_t9 > span::before,

.box02_01 .box_02_01_t9 > span::after {

  display: block;

  position: absolute;

  content: '';

}

.box02_01 .box_02_01_t9 > span::before {

  bottom: 0;

  width: 80px;

  height: 3px;

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

}

.box02_01 .box_02_01_t9 > span::before {

  right: 0;

}

.box02_01 .box_02_01_t9 > span::after {

  bottom: -3px;

  border-top: 5px transparent solid;

  border-bottom: 5px transparent solid;

}

.box02_01 .box_02_01_t9 > span::after {

  left: 0;

  border-right: 12px rgb(158,158,158) solid;

}



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

  .box02_01 > .box_02_01_t1 {

    width: 80%;

  }

  .box02_01 .box_02_01_t3 > li:nth-child(2n+1) {

    width: calc((100% - 60px) / 3);

  }

  .box02_01 .box_02_01_t3 > li:nth-child(2n) {

    width: 30px;

  }

  html[lang="en"] .box02_01 .box_02_01_t3 .box_02_01_t1 {

    padding-top: 24px;

  }

  html[lang="en"] .box02_01 .box_02_01_t3 > li:nth-child(2n+1) {

    width: calc((100% - 60px) / 3);

  }

  html[lang="en"] .box02_01 .box_02_01_t3 > li:nth-child(2n) {

    width: 30px;

  }

  .box02_01 .box_02_01_t2,

  .box02_01 .box_02_01_t4,

  .box02_01 .box_02_01_t6,

  .box02_01 .box_02_01_t7,

  .box02_01 .box_02_01_t8,

  .box02_01 .box_02_01_t9{

    font-size: 11px;

  }

  html[lang="en"] .box02_01 .box_02_01_t2,

  html[lang="en"] .box02_01 .box_02_01_t4,

  html[lang="en"] .box02_01 .box_02_01_t6, 

  html[lang="en"] .box02_01 .box_02_01_t7,

  html[lang="en"] .box02_01 .box_02_01_t8,

  html[lang="en"] .box02_01 .box_02_01_t9{

    font-size: 10px;

    line-height: 1.1;

  }

  .box02_01 .box_02_01_t2,

  .box02_01 .box_02_01_t4 {

    height: 24px;

  }

  .box02_01 .box_02_01_t8 {

    /* height: 40px; */

  }

  .box02_01 .box_02_01_t2 > li {

    width: 40px;

  }

  html[lang="en"] .box02_01 .box_02_01_t2 > li {

    width: 56px;

  }

  .box02_01 .box_02_01_t2 > li::before,

  .box02_01 .box_02_01_t4::before {

    height: 20px;

  }

  html[lang="en"] .box02_01 .box_02_01_t5 {

    font-size: 10px;

  }

  .box02_01 .box_02_01_t6 > span::before {

    width: 24px;

  }

  html[lang="en"] .box02_01 .box_02_01_t6 > span::before {

    width: 24px;

  }

  .box02_01 .box_02_01_t8::after {

    width: calc((100% - 112px) / 3 * 2 + 112px + 3px);

  }

  .box02_01 .box_02_01_t8 > li > span {

      width: 120px;

  }

  html[lang="en"] .box02_01 .box_02_01_t8 > li > span {

    display: block;

  position: absolute;

  left: calc(50% + 16px);

  top: 50%;

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

  }

  .box02_01 .box_02_01_t8 li.w136 {

    width: calc((100% - 112px) / 3);

  }

  .box02_01 .box_02_01_t8 > li:first-child {

    margin-right: 56px;

  }

  .box02_01 .box_02_01_t8 > li:last-child {

    margin-left: 56px;

  }

  .box02_01 .box_02_01_t10 > li:nth-child(2n+1) {

    width: calc((100% - 112px) / 3);

  }

  .box02_01 .box_02_01_t10 > li:nth-child(2n) {

    width: 56px;

  }

    .box02_01 .box_02_01_t7 > span::before {

    width: 50px;

  }

    .box02_01 .box_02_01_t9 {

    width: 56px !important;

}

    .box02_01 .box_02_01_t9 > span::before {

    width: 50px;

  }

    

}