/*2カラム2カラム*/
.flex1 {
  display: flex;
  flex-wrap: wrap;
}
 
.flex1 div.flex1_in {
  width: calc(50% - 10px);
  margin: 5px;
}


/*３カラム３カラム*/
.flex2 {
  display: flex;
  flex-wrap: wrap;
}
 
.flex2 div.flex2_in {
  width: calc(28%);
  margin: 2%;
}

/*３カラム３カラム*/
.flex02 {
  display: flex;
  flex-wrap: wrap;
}
 
.flex02 div.flex02_in {
  width: calc(33.3% );
  margin: 0px;
}


/*３カラム2カラム*/
.flex3 {
  display: flex;
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
    justify-content: center;}
 
.flex3 div.flex3_in {
  width: calc(29%);
  margin: 2%;
}
.flex3 div.flex3_in img {
  width:100%;
}
@media screen and (max-width:798px) { 
.flex3 div.flex3_in {
  width: calc(46%);
  margin: 2%;
}
}

/*1カラム2カラム3カラム*/
.flex4 {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
 
.flex4 div.flex4_in {
  width: 100%;
  margin-bottom: 5px;
}
@media screen and (max-width:1057px) { 
.flex4 div.flex4_in {
 width: calc(50% - 10px);
  margin: 5px;
}
}
@media screen and (max-width:480px) { 
.flex4 div.flex4_in {
  width: 31.3%;
  margin-left: 1%;
  margin-right: 1%;
}
}

/*1カラム2カラム2カラム*/
.flex5 {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
 
.flex5 div.flex5_in {
  width: 100%;
  margin-bottom: 10px;
}
@media screen and (max-width:1057px) { 
.flex5 div.flex5_in {
 width: calc(50% - 2%);
  margin: 1%;
}
}

/*4カラム2カラム*/
.flex6 {
  display: flex;
  flex-wrap: wrap;
  webkit-justify-content: space-between;
/*    justify-content: space-between;*/
    justify-content:center;
}
 
.flex6 div.flex6_in {
  width: calc(22%);
  margin: 10px 5px;
}
.flex6 div.flex6_in img {
  width:100%;
}
.flex6 p{text-align: center;　font-size:1em; }


@media screen and (max-width:790px) { 
    .flex6 {
  display: flex;
  flex-wrap: wrap;
  webkit-justify-content: space-between;
    justify-content: space-between;
}
.flex6 div.flex6_in {
  width: calc(45%);
  margin: 5px;
}
    .flex6 p{text-align: center;　font-size:1em; }
}

/*4カラム1カラム*/
.flex41 {
  display: flex;
  flex-wrap: wrap;
  webkit-justify-content: space-between;
    justify-content:center;
}
 
.flex41 div.flex41_in {
  width: calc(22%);
  margin: 10px 5px;
}
.flex41 div.flex41_in img {
  width:100%;
}
/*.flex41 p{font-size:1em; }
*/

@media screen and (max-width:790px) { 
    .flex41 {
  display: flex;
  flex-wrap: wrap;
  webkit-justify-content: space-between;
    justify-content: space-between;
}
.flex41 div.flex41_in {
  width: calc(100%);
  margin: 0px;
}
    .flex41 p{　font-size:1em; line-height: 1.6em; }
}


.aaa {    transition: ease 0.3s all;
    cursor: pointer;}
.aaa:hover {
opacity:0.9;
	transform:scale(1.05,1.05);
}
.aaa:hover img {
    -moz-opacity:0.8;
    opacity:1;
    filter: alpha(opacity=80);
}

/*5カラム3カラム*/
.flex53 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
 
.flex53 div.flex53_in {
  width: calc(18%);
  margin: 1%;
}
.flex53 div.flex53_in img{
  width:100%;

}
.flex53 p{text-align: center;}

@media screen and (max-width:829px) { 
    .flex53 div.flex53_in {
  width: calc(31%);
  margin: 1%;
}}





/*2カラム1カラム*/
.flex7 {
  display: flex;
  flex-wrap: wrap;

    justify-content: center; /* 子要素をflexboxにより中央に配置する */
    align-items: center;  /* 子要素をflexboxにより中央に配置する */
    align-items:stretch;
}
 
.flex7 div.flex7_in {
  width: 50%;
  margin: 0%;
}
.flex7 div.flex7_in img{
  width: 100%;
}
@media screen and (max-width:590px) { 
.flex7 div.flex7_in {
  width: 100%;
  margin: 5px 0;
}
}
/*2カラム1カラム*/
/*2カラム1カラム*/
.flex_head {
  display: flex;
  flex-wrap: wrap;

    justify-content: center; /* 子要素をflexboxにより中央に配置する */
    align-items: center;  /* 子要素をflexboxにより中央に配置する */
    align-items:stretch;
}
 
.flex_head div.flex_head_left {
  width: 77%;
  margin: 0%;
}
.flex_head div.flex_head_right {
  width: 23%;
  margin: 0%;
}
@media screen and (max-width:590px) { 
.flex_head div.flex_head_left,.flex_head div.flex_head_right {
  width: 100%;
  margin: 5px 0;
}
}
/*2カラム1カラム*/
.flex21 {
  display: flex;
  flex-wrap: wrap;
    justify-content: center; /* 子要素をflexboxにより中央に配置する */
    align-items: center;  /* 子要素をflexboxにより中央に配置する */
    align-items:stretch;
}
 
.flex21 div.flex21_in {
  width: 48%;
  margin: 1%;
}
.flex21 div.flex21_in img {
  width: 100%;
}
@media screen and (max-width:590px) { 
.flex21 div.flex21_in {
  width: 100%;
  margin: 3% 0;
}
}
/*2カラム1カラム画像2０％*/
.flex21img {
  display: flex;
  flex-wrap: wrap;

    justify-content: center; /* 子要素をflexboxにより中央に配置する */
    align-items: center;  /* 子要素をflexboxにより中央に配置する */
}
 
.flex21img div.flex21img_in_left {
  width: calc(66%);
    margin: 2%;
}
.flex21img div.flex21img_in_right {
  width: calc(26%);
    margin: 2%;
}
.flex21img div.flex21img_in_right img{
  width: 100%;
}
.flex21img div.flex21img_in_left img{
  width: 100%;
}
@media screen and (max-width:480px) { 
.flex21img div.flex21img_in_left {
 width: calc(100% );
  margin: 5px;
}
.flex21img div.flex21img_in_right {
  width: calc(100% );
  margin: 5px;
    text-align: center;
}
    .flex21img div.flex21img_in_right img{
  width: 60%;
       
}
}
/*左右2カラム1カラム画像2０％*/
.flexrlimg {
  display: flex;
  flex-wrap: wrap;

    justify-content: center; /* 子要素をflexboxにより中央に配置する */
    align-items: center;  /* 子要素をflexboxにより中央に配置する */
}
 
.flexrlimg div.flexrlimg_in_lefttxt {
  width: calc(66%);
    margin: 2%;
}
.flexrlimg div.flexrlimg_in_rightimg {
  width: calc(26%);
    margin: 2%;
}
.flexrlimg div.flexrlimg_in_leftimg {
  width: calc(26%);
    margin: 2%;
}
.flexrlimg div.flexrlimg_in_righttxt {
  width: calc(66%);
    margin: 2%;
}
.flexrlimg div.flexrlimg_in_leftimg img,.flexrlimg div.flexrlimg_in_rightimg img  {
  width: 100%;
}

@media screen and (max-width:480px) { 
.flexrlimg div.flexrlimg_in_lefttxt,.flexrlimg div.flexrlimg_in_rightimg,.flexrlimg div.flexrlimg_in_leftimg,.flexrlimg div.flexrlimg_in_righttxt {
 width: calc(100% );
  margin: 5px;
}

.flexrlimg div.flexrlimg_in_rightimg img,.flexrlimg div.flexrlimg_in_leftimg img{
  width: 60%;
       
}
.flexrlimg div.flexrlimg_in_leftimg {
  order: 2; 
}
.flexrlimg div.flexrlimg_in_righttxt  {
  order: 1; 
}
}

/*1カラム2カラム*/
.flex8 {
  display: flex;
  flex-wrap: wrap;
    padding: 0;
    
}
 
.flex8 div.flex8_in {
  width: 100%;
}
.flex8 div.flex8_in img {
  width: 60%;
}
@media screen and (max-width:790px) {
    .flex8 {
    padding: 5px 5px 0;
}
/*.flex8 div.flex8_in {
 width: calc(50% - 10px);
  margin: 5px;
display: flex; /* 子要素をflexboxで揃える 
    flex-direction: column; /* 子要素をflexboxにより縦方向に揃える 
    justify-content: center; /* 子要素をflexboxにより中央に配置する 
    align-items: center;  /* 子要素をflexboxにより中央に配置する 
}*/
.flex8 div.flex8_in img {
  width: 60%;
}
}
/*3番目のボックスを先頭に配置する*/
.flex_uniform {
  display: flex;
  flex-wrap: wrap;
}
 
.flex_uniform div.flex_uniform_in {
  width: calc(33.3% - 10px);
  margin: 5px;
}
@media screen and (max-width:480px) { 
.flex_uniform div.flex_uniform_in {
  width: calc(100% );
  margin: 5px;
}

.flex_uniform {
   display: flex;           /* Flexコンテナ化 */
   flex-direction: column; /* 縦向きに配置 */
}
.flex_uniform div.flex_uniform_in2 {
   order: -1;
}
}
/*３カラム1カラム*/
.flex31 {
  display: flex;
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
    justify-content: center;
}
 
.flex31 div.flex31_in {
  width: 31%;
  margin: 1%;
}

@media screen and (max-width:790px) { 
.flex31 div.flex31_in {
  width: calc(100% );
  margin: 10px 0;
}
}



/*4カラム1カラム*/
.flex41 {
  display: flex;
  flex-wrap: wrap;
  /*-webkit-justify-content: space-between;
    justify-content: space-between;*/
}
 
.flex41 div.flex41_in {
  width: 23%;
  margin: 1%;
}

@media screen and (max-width:790px) { 
.flex41 div.flex41_in {
  width: calc(100% );
  margin: 5px;
}
}
/*9カラム３カラム*/
.flex93 {
  display: flex;
  flex-wrap: wrap;
}
 
.flex93 div.flex93_in {
  width: calc(11.1% - 10px);
  margin: 5px;
}
@media screen and (max-width:480px) { 
.flex93 div.flex93_in {
 width: calc(33.3% - 10px);
  margin: 5px;
}
}