/****************************************
Layout
*****************************************/
/*col*/
.col2 {
  width: 48%;
}
.col3 {
  width: 30.6666666667%;
}
.col4 {
  width: 22%;
}
.col5 {
  width: 16.8%;
}
.col6 {
  width: 13.3333333333%;
}

/*col pc only*/
@media screen and (min-width: 769px) {
  .col2-pc {
    width: 48%;
  }
  .col3-pc {
    width: 30.6666666667%;
  }
  .col4-pc {
    width: 22%;
  }
  .col5-pc {
    width: 16.8%;
  }
  .col6-pc {
    width: 13.3333333333%;
  }
}
/*col sp only*/
@media screen and (max-width: 768px) {
  .col2-sp {
    width: 48%;
  }
  .col3-sp {
    width: 30.6666666667%;
  }
  .col4-sp {
    width: 22%;
  }
  .col5-sp {
    width: 16.8%;
  }
  .col6-sp {
    width: 13.3333333333%;
  }
}
/*flex*/
.flex {
  display: flex;
  flex-wrap: wrap;
}
@media screen and (min-width: 769px) {
  .flex-pc {
    display: flex;
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 768px) {
  .flex-sp {
    display: flex;
    flex-wrap: wrap;
  }
}
.flex-abottom {
  align-items: flex-end;
}
.flex-acenter {
  align-items: center;
}
.flex-bet {
  justify-content: space-between;
}
@media screen and (min-width: 769px) {
  .flex-bet-pc {
    justify-content: space-between;
  }
}
@media screen and (max-width: 768px) {
  .flex-bet-sp {
    justify-content: space-between;
  }
}
.flex-center {
  justify-content: center;
}
@media screen and (min-width: 769px) {
  .flex-center-pc {
    justify-content: center;
  }
}
@media screen and (max-width: 768px) {
  .flex-center-sp {
    justify-content: center;
  }
}
.flex-end {
  justify-content: flex-end;
}
@media screen and (min-width: 769px) {
	.flex-end-pc {
		justify-content: flex-end;
	}
}
.flex-nowrap {
  flex-wrap: nowrap;
}
.flex-start {
  justify-content: flex-start;
}

.order2 {
  order: 2;
}

/*inner*/
.inner-s {
  margin: 0 auto;
  width: 40%;
}
.inner-m {
	max-width: 960px;
  margin: 0 auto;
  width: 60%;
}
.inner-l {
  margin: 0 auto;
	max-width: 1280px;
  width: 80%;
}
@media screen and (min-width: 769px) {
  .inner-s-pc {
    margin: 0 auto;
    width: 40%;
  }
  .inner-m-pc {
    margin: 0 auto;
    width: 60%;
  }
  .inner-l-pc {
    margin: 0 auto;
    width: 80%;
  }
}
@media screen and (max-width: 768px) {
  .inner-xs, .inner-s, .inner-m, .inner-l {
    width: 90%;
  }
}
