/*==================================
  classへ追加するcss
==================================*/
/*--------------------------------------------------------------
  display
--------------------------------------------------------------*/
.display_pc {
	display: block;
}

.display_ip {
	display: none;
}

.display_sp {
	display: none;
}

@media screen and (min-width: 768px) and ( max-width: 1023px) {
	.display_pc {
		display: none;
	}

	.display_ip {
		display: block;
	}

	.display_sp {
		display: none;
	}
}

@media screen and (max-width : 767px) {
	.display_pc {
		display: none;
	}

	.display_ip {
		display: none;
	}

	.display_sp {
		display: block;
	}
}

/*--------------------------------------------------------------
  margin
--------------------------------------------------------------*/
.mb-0 {
  margin-bottom: 0;
}

.mb-10 {
  margin-bottom: 10px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mb-30 {
  margin-bottom: 30px;
}

.mb-40 {
  margin-bottom: 40px;
}

.mb-50 {
  margin-bottom: 50px;
}

.mb-60 {
  margin-bottom: 60px;
}

.mb-70 {
  margin-bottom: 70px;
}

.mb-80 {
  margin-bottom: 80px;
}

.mb-90 {
  margin-bottom: 90px;
}

.mb-100 {
  margin-bottom: 100px;
}

/*--------------------------------------------------------------
  padding
--------------------------------------------------------------*/
.pt-10 {
  padding-top: 10px;
}

.pt-20 {
  padding-top: 20px;
}

.pt-30 {
  padding-top: 30px;
}

.pt-40 {
  padding-top: 40px;
}

.pt-50 {
  padding-top: 50px;
}

.pt-60 {
  padding-top: 60px;
}

.pt-70 {
  padding-top: 70px;
}

.pt-80 {
  padding-top: 80px;
}

.pt-90 {
  padding-top: 90px;
}

.pt-100 {
  padding-top: 100px;
}

/*--------------------------------------------------------------
  width
--------------------------------------------------------------*/
.w5 {
	width: 5%;
}

.w10 {
	width: 10%;
}

.w15 {
	width: 15%;
}

.w20 {
	width: 20%;
}

.w25 {
	width: 25%;
}

.w30 {
	width: 30%;
}

.w35 {
	width: 35%;
}

.w40 {
	width: 40%;
}

.w45 {
	width: 45%;
}

.w50 {
	width: 50%;
}

.w55 {
	width: 55%;
}

.w60 {
	width: 60%;
}

.w65 {
	width: 65%;
}

.w70 {
	width: 70%;
}

.w75 {
	width: 75%;
}

.w80 {
	width: 80%;
}

.w85 {
	width: 85%;
}

.w90 {
	width: 90%;
}

.w95 {
	width: 95%;
}

.w100 {
	width: 100%;
}

/*--------------------------------------------------------------
  text
--------------------------------------------------------------*/

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

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

/*--------------------------------------------------------------
  float
--------------------------------------------------------------*/

.right {
  float: right;
}

.left {
  float: left;
}

.clear {
  clear: both;
}

/*--------------------------------------------------------------
  flex
--------------------------------------------------------------*/
.flex {
	display: flex;
	justify-content: space-between;
}


/*--------------------------------------------------------------
  color
--------------------------------------------------------------*/
.pink_font {
	color: #f8908f;
}