@charset "utf-8";



#main_box { line-height: 2.0; }



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

li.btn103 {

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

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

}

li.btn103 > a {

  pointer-events:none;

  cursor: auto;

}

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

  display: none;

}





/* contents ---- */



.box01 .linkbox_gray::after {

  transform: translate3d(0, -50%, 0) rotate(90deg);

}



.box02 {

  

}

.box02 > ul > li {

  display: flex;

  flex-wrap: wrap;

  justify-content: space-between;

}

.box02 > ul > li > .title {

  width: 100%;

  font-size: 112.5%;

  font-weight: 700;

}

.box02 > ul > li > .text {

  width: calc(100% - 320px);

  padding-right: 16px;

}

.box02 > ul > li > .image {

  width: 320px;

}

.box02 > ul > li > .image.img02_01 {

  font-size: 87.5%;

  text-align: center;

  line-height: 1.5;

}

.box02 > ul > li > .image.img02_03 {

  font-size: 87.5%;

  line-height: 1.5;

}

.box02 > ul > li > .image.img02_02 {

  display: flex;

}

.box02 > ul > li > .image.img02_02 > div,

.box02 > ul > li > .image.img02_02 > ul {

  width: 160px;

}

.box02 > ul > li > .image.img02_02 > ul > li {

  position: relative;

  background-color: rgb(252,222,152);

  margin-bottom: 8px;

  padding: 4px;

  font-size:12px;

}

.box02 > ul > li > .image.img02_02 > ul > li::before {

  position: absolute;

  top:50%;

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

  left: -8px;

  border-top: 8px transparent solid;

  border-right: 8px solid rgb(252,222,152);

  border-bottom: 8px transparent solid;

  content: '';

}

.box02 > ul > li > .image .img_02_03_02 {

  width: 60%;

  margin-right: auto;

  margin-left: auto;

}





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

.box02 > ul > li > .text {

  width: 100%;

  padding-right: 16px;

}

.box02 > ul > li > .image {

  width: 100%;

  max-width: 320px;

  margin-right: auto;

  margin-left: auto;

}

}





.box03 .img03_01 {

  width: calc(300 / 794 * 100%);

  margin-left: 20px;

  margin-bottom: 20px;

  font-size: 90%;

}





.box04 > ul {

  display: flex;

  justify-content: space-between;

}

.box04 > ul > li {

  width: 49%;

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

}

.box04 > ul > li .title_box {

  display: flex;

  justify-content: space-between;

  align-items: center;

}

.box04 > ul > li .title_box > .tag {

  display: block;

  width: 5em;

  padding: 12px 0;

  text-align: center;

  background-color: rgb(247,175,13);

  font-weight: 700;

  margin-right: 8px;

}

.box04 > ul > li .title_box > .title {

  display: block;

  width: calc(100% - 5em);

  line-height: 1.3;

  font-weight: 700;

}

.box04 > ul > li > .list {

  padding: 16px;

}

.box04 > ul > li > .list > ul > li {

  display: block;

  padding-left: 1em;

  text-indent: -1em;

}



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

  .box04 > ul {

    flex-wrap: wrap;

  }

  .box04 > ul > li {

    width: 100%;

  }

}







.box05 .img05_01 {

  width: calc(320 / 794 * 100%);

  margin-left: 20px;

}

.box05 .img05_02 {

  width: calc(320 / 730 * 100%);

  margin-left: 20px;

}





.oshiete {

  position: relative;

  border: 4px rgb(247,175,13) solid;

  border-radius: 16px;

}

.oshiete > .title {

  position: absolute;

  top: 0;

  left: 16px;

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

  background-color: rgb(247,175,13);

  border-radius: 16px;

  font-weight: 700;

  padding: 8px 12px;

  font-size: 125%;

}

.oshiete > .box_q {

  border-radius: 12px 12px 0 0;

  background-color: rgb(252,222,152);

  padding: 32px 24px 16px 32px;

}

.oshiete > .box_a {

  padding: 16px 24px 16px 32px;

}