@charset "utf-8";
/* CSS Document */
/*-------------------------
  flex-box
--------------------------- */
.flex-box {
  -webkit-justify-content: space-between; /*左右中央寄せ*/
  justify-content: space-between; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;
  -webkit-align-items: stretch; /*上下中央寄せ*/
  align-items: stretch; /*上下中央寄せ*/
  -webkit-flex-wrap: wrap; /*折り返し(mac safari用)*/
  flex-wrap: wrap; /*折り返し*/
  margin: 0;
}
.flex-box02 {
  -webkit-justify-content: center; /*左右中央寄せ*/
  justify-content: center; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;
  -webkit-align-items: center; /*上下中央寄せ*/
  align-items: center; /*上下中央寄せ*/
  -webkit-flex-wrap: wrap; /*折り返し(mac safari用)*/
  flex-wrap: wrap; /*折り返し*/
  margin: 0;
}
.flex-box03 {
  -webkit-justify-content: space-between; /*左右中央寄せ*/
  justify-content: space-between; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;
  -webkit-align-items: center; /*上下中央寄せ*/
  align-items: center; /*上下中央寄せ*/
  -webkit-flex-wrap: wrap; /*折り返し(mac safari用)*/
  flex-wrap: wrap; /*折り返し*/
  margin: 0;
}
.flex-box04 {
  -webkit-justify-content: flex-start; /*左右中央寄せ*/
  justify-content: flex-start; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;
  -webkit-align-items: stretch; /*上下中央寄せ*/
  align-items: stretch; /*上下中央寄せ*/
  -webkit-flex-wrap: wrap; /*折り返し(mac safari用)*/
  flex-wrap: wrap; /*折り返し*/
  margin: 0;
}
.flex-box05 {
  -webkit-justify-content: space-between; /*左右中央寄せ*/
  justify-content: space-between; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;
  -webkit-align-items: flex-start; /*上下中央寄せ*/
  align-items: flex-start; /*上下中央寄せ*/
  -webkit-flex-wrap: wrap; /*折り返し(mac safari用)*/
  flex-wrap: wrap; /*折り返し*/
  margin: 0;
}
.flex-box06 {
  -webkit-justify-content: center; /*左右中央寄せ*/
  justify-content: center; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;
  -webkit-align-items: flex-start; /*上下中央寄せ*/
  align-items: flex-start; /*上下中央寄せ*/
  -webkit-flex-wrap: wrap; /*折り返し(mac safari用)*/
  flex-wrap: wrap; /*折り返し*/
  margin: 0;
}
.flex-box07 {
  -webkit-justify-content: center; /*左右中央寄せ*/
  justify-content: center; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;
  -webkit-align-items: stretch; /*上下中央寄せ*/
  align-items: stretch; /*上下中央寄せ*/
  -webkit-flex-wrap: wrap; /*折り返し(mac safari用)*/
  flex-wrap: wrap; /*折り返し*/
  margin: 0;
}
.flex-box08 {
  -webkit-justify-content: flex-end; /*左右中央寄せ*/
  justify-content: flex-end; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;
  -webkit-align-items: stretch; /*上下中央寄せ*/
  align-items: stretch; /*上下中央寄せ*/
  -webkit-flex-wrap: wrap; /*折り返し(mac safari用)*/
  flex-wrap: wrap; /*折り返し*/
  margin: 0;
}
.flex-box09 {
  -webkit-justify-content: space-between; /*左右中央寄せ*/
  justify-content: space-between; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;
  -webkit-align-items: flex-end; /*上下中央寄せ*/
  align-items: flex-end; /*上下中央寄せ*/
  -webkit-flex-wrap: wrap; /*折り返し(mac safari用)*/
  flex-wrap: wrap; /*折り返し*/
  margin: 0;
}
.flex-box10 {
  -webkit-justify-content: space-between; /*左右中央寄せ*/
  justify-content: space-between; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;
  -webkit-align-items: stretch; /*上下中央寄せ*/
  align-items: stretch; /*上下中央寄せ*/
  -webkit-flex-wrap: wrap; /*折り返し(mac safari用)*/
  flex-wrap: wrap; /*折り返し*/
  margin: 0;
}
.flex-box10::after {
  content: "";
  display: block;
  width: 50%;
}
.direction-box {
  display: flex;
  flex-direction: row;
}
.flex-box11 {
  -webkit-justify-content: flex-start; /*左右中央寄せ*/
  justify-content: flex-start; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;
  -webkit-align-items: center; /*上下中央寄せ*/
  align-items: center; /*上下中央寄せ*/
  -webkit-flex-wrap: wrap; /*折り返し(mac safari用)*/
  flex-wrap: wrap; /*折り返し*/
  margin: 0;
}
.flex-box12 {
  -webkit-justify-content: flex-start; /*左右中央寄せ*/
  justify-content: flex-start; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;
  -webkit-align-items: center; /*上下中央寄せ*/
  align-items: center; /*上下中央寄せ*/
  -webkit-flex-wrap: wrap; /*折り返し(mac safari用)*/
  flex-wrap: wrap; /*折り返し*/
	flex-direction: column;
  margin: 0;
}
.flex-box202311 {
  -webkit-justify-content: flex-start; /*左右中央寄せ*/
  justify-content: flex-start; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;
  -webkit-align-items: stretch; /*上下中央寄せ*/
  align-items: stretch; /*上下中央寄せ*/
  -webkit-flex-wrap: wrap; /*折り返し(mac safari用)*/
  flex-wrap: wrap; /*折り返し*/
  margin: 0;
}

/*-------------------------
  flex-box 子要素
--------------------------- */
.box-m {
  width: 40%;
  margin: 0 8px;
}
.box-s {
  width: 25%;
  margin: 0 3px;
}
.box-s02 {
  width: 45%;
  margin: 0 3px;
}
.box-s06 {
  width: 45%;
  margin: 0 3px 5px 3px;
}
.box-3col {
  width: 30%;
  margin: 5px 3px;
}
.box-kode_s,.box-kode_l {
  width: 100%;
  margin: 5px 3px;
}
  li.photo202311 {
    width: 45%;
	 margin: 0 5px 5px 5px;
	  
  }
.kode_main1 {
    width: 50%;
    padding: 0px;
	margin: 0px 0 0 70px;
  }
	.kode_main2 {
    width: 40%;
    padding:0px;
		margin: -80px 0 0 220px;
  }
	.kode_main3 {
    width: 55%;
    padding:0px;
		margin: -50px 0 0 20px;
  }
	.box-mente,.box-mente02 {
    width: 45%;
    margin: 0px 0px 30px 0px;
  }

	  .box-reform {
    width: 100%;
    margin: 10px auto;
  }

/*-------------------------
  flex-box 子要素　順番入れ替え
--------------------------- */
.deformation {
  width: 100%;
  margin: 20px auto;
  display: -webkit-box; /*--- Androidブラウザ用 ---*/
  display: -ms-flexbox; /*--- IE10 ---*/
  display: -webkit-flex; /*--- safari（PC）用 ---*/
  display: flex;
  -webkit-box-direction: row; /*--- Androidブラウザ用 ---*/
  -webkit-flex-direction: row; /*--- safari（PC）用 ---*/
  flex-direction: row;
  -ms-flex-wrap: wrap; /*--- IE10用 ---*/
  -webkit-flex-wrap: wrap; /*--- safari（PC）用 ---*/
  flex-wrap: wrap;
  justify-content: center;
}
.defo-box {
  text-align: center;
}
.defo-box:nth-child(1) {
  width: 35%;
  order: 2;
  margin: 0 15px;
}
.defo-box:nth-child(2) {
  width: 100%;
  order: 1;
}
.defo-box:nth-child(3) {
  width: 35%;
  order: 3;
  margin: 0 15px;
}
@media print, screen and (min-width : 768px) {
  .direction-box {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }
	.flex-box12 {
	flex-direction: row-reverse;
  margin: 0;
	-webkit-justify-content: flex-start; /*左右中央寄せ*/
  justify-content: flex-start; /*左右中央寄せ*/
  display: -webkit-box; /* Android4.3以前ブラウザ用 */
  display: -webkit-flex; /* iOS8以前Safari用 */
  display: flex;

}
.flex-box202311 {
width: 900px;
  margin: 0 auto;
}

  /*-------------------------
  flex-box 子要素
--------------------------- */
  .box-l {
    width: 71%;
  }
  .box-m {
    width: 47%;
    margin: 0 3px;
  }
  .box-m02 {
    width: 62%;
    margin: 0 3px;
  }
  .box-s {
    width: 20%;
    margin: 0 5px;
  }
  .box-s02 {
    width: 28%;
    margin: 0 20px 0 0;
  }
	.box-s06 {
    width: 21%;
    margin: 0 10px 0 0px;
  }
  .box-3col {
    width: 30%;
    margin: 0px 10px 30px 10px;
  }
	.box-kode_s {
    width: 24%;
    margin: 0px 0px 30px 0px;
  }
	.box-kode_img {
    width: 30%;
    margin: 80px 0px 30px 0px;
  }
	.box-kode_l {
    width: 40%;
    margin: 0px 0px 30px 0px;
  }
  .box-s03 {
    width: 45%;
    margin: 0 15px 15px 0;
  }
	.box-s04 {
    width: 25%;
    margin: 0 10px 0px 0;
  }
	.box-s05 {
    width: 41%;
    margin: 0 0px 0px 35px;
  }
	  li.photo202311 {
    width: 31%;
	 margin: 0 5px 5px 5px;
	  
  }
.kode_main1 {
    width: auto;
    padding: 60px 0px 30px 0px;
	margin: 0;
  }
	.kode_main2 {
    width: auto;
    padding: 0px 0px 30px 0px;
		margin: 0;
  }
	.kode_main3 {
    width: auto;
    padding: 100px 0px 30px 0px;
		margin: 0;
  }
	.box-mente {
    width: 22%;
    margin: 0px 0px 30px 0px;
  }
		.box-mente02 {
    width: 27%;
    margin: 0px 0px 30px 0px;
  }

	  .box-reform {
    width: 47%;
    margin: 10px 3px;
  }

  /*-------------------------
  flex-box 子要素　順番入れ替え
--------------------------- */
  .defo-box:nth-child(1) {
    width: 21%;
    order: 1;
    margin: 0;
  }
  .defo-box:nth-child(2) {
    width: 57%;
    order: 2;
  }
  .defo-box:nth-child(3) {
    width: 21%;
    order: 3;
    margin: 0;
  }
}