@charset "utf-8";

/* ------------------------
 flexbox - all
------------------------- */

.flex-all-flex{
	-js-display: flex; /* flexibility.js */
	display: -webkit-box; /* android用 */
	display: -ms-flexbox; /* IE用 */
	display: -webkit-flex; /* Safari用 */
	display: flex;
}

.flex-all-wrap{
		-webkit-flex-wrap : wrap;
		-ms-flex-wrap : wrap;
		flex-wrap : wrap;
}

.flex-all-nowrap{
		-webkit-flex-wrap : nowrap;
		-ms-flex-wrap : nowrap;
		flex-wrap : nowrap;
}

.flex-all-alignitems-center{
	-webkit-align-items: center;      /* Safari etc. */
	-ms-align-items    : center;      /* IE10        */
	align-items        : center;
}

.flex-all-alignitems-start{
	-webkit-align-items: flex-start;  /* Safari etc. */
	-ms-align-items    : flex-start;  /* IE10        */
	align-items        : flex-start;
}

.flex-all-alignitems-end{
	-webkit-align-items: flex-end;    /* Safari etc. */
	-ms-align-items    : flex-end;    /* IE10        */
	align-items        : flex-end;
}

.flex-all-alignitems-strech{
	-webkit-align-items: stretch;     /* Safari etc. */
	-ms-align-items    : stretch;     /* IE10        */
	align-items        : stretch;
}

.flex-all-alignitems-baseline{
	-webkit-align-items: baseline;    /* Safari etc. */
	-ms-align-items    : baseline;    /* IE10        */
	align-items        : baseline;
}

.flex-all-justfy-center{
	-webkit-box-pack: center; /*Android4.3*/
	-moz-box-pack: center;    /*Firefox21*/
	-ms-flex-pack: center;    /*IE10*/
	-webkit-justify-content: center;       /* Safari etc. */
	-ms-justify-content    : center;       /* IE10        */
	justify-content        : center;
}

.flex-all-justfy-start{
	-webkit-box-pack: start; /*Android4.3*/
	-moz-box-pack: start;    /*Firefox21*/
	-ms-flex-pack: start;    /*IE10*/
	-webkit-justify-content: flex-start;     /* Safari etc. */
	-ms-justify-content    : flex-start;     /* IE10        */
	justify-content        : flex-start;
}

.flex-all-justfy-end{
	-webkit-box-pack: end; /*Android4.3*/
	-moz-box-pack: end;    /*Firefox21*/
	-ms-flex-pack: end;    /*IE10*/
	-webkit-justify-content: flex-end;         /* Safari etc. */
	-ms-justify-content    : flex-end;         /* IE10        */
	justify-content        : flex-end;
}

.flex-all-justfy-between{
	-webkit-box-pack: justify; /*Android4.3*/
	-moz-box-pack: justify;    /*Firefox21*/
	-ms-flex-pack: justify;    /*IE10*/
	-webkit-justify-content: space-between;  /* Safari etc. */
	-ms-justify-content    : space-between;  /* IE10        */
	justify-content        : space-between;
}

.flex-all-justfy-around{
	-webkit-justify-content: space-around;   /* Safari etc. */
	-ms-justify-content    : space-around;   /* IE10        */
	justify-content        : space-around;
}




/* ------------------------
 flexbox - xss
------------------------- */
@media screen and (max-width: 480px){

	.flex-xss-flex{
		-js-display: flex; /* flexibility.js */
		display: -webkit-box; /* android用 */
		display: -ms-flexbox; /* IE用 */
		display: -webkit-flex; /* Safari用 */
		display: flex;
	}

	.flex-xss-wrap{
			-webkit-flex-wrap : wrap;
			-ms-flex-wrap : wrap;
			flex-wrap : wrap;
	}

	.flex-xss-nowrap{
			-webkit-flex-wrap : nowrap;
			-ms-flex-wrap : nowrap;
			flex-wrap : nowrap;
	}

	.flex-xss-alignitems-center{
		-webkit-align-items: center;      /* Safari etc. */
		-ms-align-items    : center;      /* IE10        */
		align-items        : center;
	}

	.flex-xss-alignitems-start{
		-webkit-align-items: flex-start;  /* Safari etc. */
		-ms-align-items    : flex-start;  /* IE10        */
		align-items        : flex-start;
	}

	.flex-xss-alignitems-end{
		-webkit-align-items: flex-end;    /* Safari etc. */
		-ms-align-items    : flex-end;    /* IE10        */
		align-items        : flex-end;
	}

	.flex-xss-alignitems-strech{
		-webkit-align-items: stretch;     /* Safari etc. */
		-ms-align-items    : stretch;     /* IE10        */
		align-items        : stretch;
	}

	.flex-xss-alignitems-baseline{
		-webkit-align-items: baseline;    /* Safari etc. */
		-ms-align-items    : baseline;    /* IE10        */
		align-items        : baseline;
	}

	.flex-xss-justfy-center{
		-webkit-box-pack: center; /*Android4.3*/
		-moz-box-pack: center;    /*Firefox21*/
		-ms-flex-pack: center;    /*IE10*/
		-webkit-justify-content: center;       /* Safari etc. */
		-ms-justify-content    : center;       /* IE10        */
		justify-content        : center;
	}

	.flex-xss-justfy-start{
		-webkit-box-pack: start; /*Android4.3*/
		-moz-box-pack: start;    /*Firefox21*/
		-ms-flex-pack: start;    /*IE10*/
		-webkit-justify-content: flex-start;     /* Safari etc. */
		-ms-justify-content    : flex-start;     /* IE10        */
		justify-content        : flex-start;
	}

	.flex-xss-justfy-end{
		-webkit-box-pack: end; /*Android4.3*/
		-moz-box-pack: end;    /*Firefox21*/
		-ms-flex-pack: end;    /*IE10*/
		-webkit-justify-content: flex-end;         /* Safari etc. */
		-ms-justify-content    : flex-end;         /* IE10        */
		justify-content        : flex-end;
	}

	.flex-xss-justfy-between{
		-webkit-box-pack: justify; /*Android4.3*/
		-moz-box-pack: justify;    /*Firefox21*/
		-ms-flex-pack: justify;    /*IE10*/
		-webkit-justify-content: space-between;  /* Safari etc. */
		-ms-justify-content    : space-between;  /* IE10        */
		justify-content        : space-between;
	}

	.flex-xss-justfy-around{
		-webkit-justify-content: space-around;   /* Safari etc. */
		-ms-justify-content    : space-around;   /* IE10        */
		justify-content        : space-around;
	}

}




/* ------------------------
 flexbox - xs
------------------------- */
@media screen and (min-width: 481px) and (max-width : 767px){

	.flex-xs-flex{
		-js-display: flex; /* flexibility.js */
		display: -webkit-box; /* android用 */
		display: -ms-flexbox; /* IE用 */
		display: -webkit-flex; /* Safari用 */
		display: flex;
	}

	.flex-xs-wrap{
			-webkit-flex-wrap : wrap;
			-ms-flex-wrap : wrap;
			flex-wrap : wrap;
	}

	.flex-xs-nowrap{
			-webkit-flex-wrap : nowrap;
			-ms-flex-wrap : nowrap;
			flex-wrap : nowrap;
	}

	.flex-xs-alignitems-center{
		-webkit-align-items: center;      /* Safari etc. */
		-ms-align-items    : center;      /* IE10        */
		align-items        : center;
	}

	.flex-xs-alignitems-start{
		-webkit-align-items: flex-start;  /* Safari etc. */
		-ms-align-items    : flex-start;  /* IE10        */
		align-items        : flex-start;
	}

	.flex-xs-alignitems-end{
		-webkit-align-items: flex-end;    /* Safari etc. */
		-ms-align-items    : flex-end;    /* IE10        */
		align-items        : flex-end;
	}

	.flex-xs-alignitems-strech{
		-webkit-align-items: stretch;     /* Safari etc. */
		-ms-align-items    : stretch;     /* IE10        */
		align-items        : stretch;
	}

	.flex-xs-alignitems-baseline{
		-webkit-align-items: baseline;    /* Safari etc. */
		-ms-align-items    : baseline;    /* IE10        */
		align-items        : baseline;
	}

	.flex-xs-justfy-center{
		-webkit-box-pack: center; /*Android4.3*/
		-moz-box-pack: center;    /*Firefox21*/
		-ms-flex-pack: center;    /*IE10*/
		-webkit-justify-content: center;       /* Safari etc. */
		-ms-justify-content    : center;       /* IE10        */
		justify-content        : center;
	}

	.flex-xs-justfy-start{
		-webkit-box-pack: start; /*Android4.3*/
		-moz-box-pack: start;    /*Firefox21*/
		-ms-flex-pack: start;    /*IE10*/
		-webkit-justify-content: flex-start;     /* Safari etc. */
		-ms-justify-content    : flex-start;     /* IE10        */
		justify-content        : flex-start;
	}

	.flex-xs-justfy-end{
		-webkit-box-pack: end; /*Android4.3*/
		-moz-box-pack: end;    /*Firefox21*/
		-ms-flex-pack: end;    /*IE10*/
		-webkit-justify-content: flex-end;         /* Safari etc. */
		-ms-justify-content    : flex-end;         /* IE10        */
		justify-content        : flex-end;
	}

	.flex-xs-justfy-between{
		-webkit-box-pack: justify; /*Android4.3*/
		-moz-box-pack: justify;    /*Firefox21*/
		-ms-flex-pack: justify;    /*IE10*/
		-webkit-justify-content: space-between;  /* Safari etc. */
		-ms-justify-content    : space-between;  /* IE10        */
		justify-content        : space-between;
	}

	.flex-xs-justfy-around{
		-webkit-justify-content: space-around;   /* Safari etc. */
		-ms-justify-content    : space-around;   /* IE10        */
		justify-content        : space-around;
	}

}




/* ------------------------
 flexbox - sm
------------------------- */

@media screen and (min-width: 768px) and (max-width : 991px){

	.flex-sm-flex{
		-js-display: flex; /* flexibility.js */
		display: -webkit-box; /* android用 */
		display: -ms-flexbox; /* IE用 */
		display: -webkit-flex; /* Safari用 */
		display: flex;
	}

	.flex-sm-wrap{
			-webkit-flex-wrap : wrap;
			-ms-flex-wrap : wrap;
			flex-wrap : wrap;
	}

	.flex-sm-nowrap{
			-webkit-flex-wrap : nowrap;
			-ms-flex-wrap : nowrap;
			flex-wrap : nowrap;
	}

	.flex-sm-alignitems-center{
		-webkit-align-items: center;      /* Safari etc. */
		-ms-align-items    : center;      /* IE10        */
		align-items        : center;
	}

	.flex-sm-alignitems-start{
		-webkit-align-items: flex-start;  /* Safari etc. */
		-ms-align-items    : flex-start;  /* IE10        */
		align-items        : flex-start;
	}

	.flex-sm-alignitems-end{
		-webkit-align-items: flex-end;    /* Safari etc. */
		-ms-align-items    : flex-end;    /* IE10        */
		align-items        : flex-end;
	}

	.flex-sm-alignitems-strech{
		-webkit-align-items: stretch;     /* Safari etc. */
		-ms-align-items    : stretch;     /* IE10        */
		align-items        : stretch;
	}

	.flex-sm-alignitems-baseline{
		-webkit-align-items: baseline;    /* Safari etc. */
		-ms-align-items    : baseline;    /* IE10        */
		align-items        : baseline;
	}

	.flex-sm-justfy-center{
		-webkit-box-pack: center; /*Android4.3*/
		-moz-box-pack: center;    /*Firefox21*/
		-ms-flex-pack: center;    /*IE10*/
		-webkit-justify-content: center;       /* Safari etc. */
		-ms-justify-content    : center;       /* IE10        */
		justify-content        : center;
	}

	.flex-sm-justfy-start{
		-webkit-box-pack: start; /*Android4.3*/
		-moz-box-pack: start;    /*Firefox21*/
		-ms-flex-pack: start;    /*IE10*/
		-webkit-justify-content: flex-start;     /* Safari etc. */
		-ms-justify-content    : flex-start;     /* IE10        */
		justify-content        : flex-start;
	}

	.flex-sm-justfy-end{
		-webkit-box-pack: end; /*Android4.3*/
		-moz-box-pack: end;    /*Firefox21*/
		-ms-flex-pack: end;    /*IE10*/
		-webkit-justify-content: flex-end;         /* Safari etc. */
		-ms-justify-content    : flex-end;         /* IE10        */
		justify-content        : flex-end;
	}

	.flex-sm-justfy-between{
		-webkit-box-pack: justify; /*Android4.3*/
		-moz-box-pack: justify;    /*Firefox21*/
		-ms-flex-pack: justify;    /*IE10*/
		-webkit-justify-content: space-between;  /* Safari etc. */
		-ms-justify-content    : space-between;  /* IE10        */
		justify-content        : space-between;
	}

	.flex-sm-justfy-around{
		-webkit-justify-content: space-around;   /* Safari etc. */
		-ms-justify-content    : space-around;   /* IE10        */
		justify-content        : space-around;
	}
	
}




/* ------------------------
 flexbox - md
------------------------- */

@media screen and (min-width: 992px) and (max-width : 1199px){

	.flex-md-flex{
		-js-display: flex; /* flexibility.js */
		display: -webkit-box; /* android用 */
		display: -ms-flexbox; /* IE用 */
		display: -webkit-flex; /* Safari用 */
		display: flex;
	}

	.flex-md-wrap{
			-webkit-flex-wrap : wrap;
			-ms-flex-wrap : wrap;
			flex-wrap : wrap;
	}

	.flex-md-nowrap{
			-webkit-flex-wrap : nowrap;
			-ms-flex-wrap : nowrap;
			flex-wrap : nowrap;
	}

	.flex-md-alignitems-center{
		-webkit-align-items: center;      /* Safari etc. */
		-ms-align-items    : center;      /* IE10        */
		align-items        : center;
	}

	.flex-md-alignitems-start{
		-webkit-align-items: flex-start;  /* Safari etc. */
		-ms-align-items    : flex-start;  /* IE10        */
		align-items        : flex-start;
	}

	.flex-md-alignitems-end{
		-webkit-align-items: flex-end;    /* Safari etc. */
		-ms-align-items    : flex-end;    /* IE10        */
		align-items        : flex-end;
	}

	.flex-md-alignitems-strech{
		-webkit-align-items: stretch;     /* Safari etc. */
		-ms-align-items    : stretch;     /* IE10        */
		align-items        : stretch;
	}

	.flex-md-alignitems-baseline{
		-webkit-align-items: baseline;    /* Safari etc. */
		-ms-align-items    : baseline;    /* IE10        */
		align-items        : baseline;
	}

	.flex-md-justfy-center{
		-webkit-box-pack: center; /*Android4.3*/
		-moz-box-pack: center;    /*Firefox21*/
		-ms-flex-pack: center;    /*IE10*/
		-webkit-justify-content: center;       /* Safari etc. */
		-ms-justify-content    : center;       /* IE10        */
		justify-content        : center;
	}

	.flex-md-justfy-start{
		-webkit-box-pack: start; /*Android4.3*/
		-moz-box-pack: start;    /*Firefox21*/
		-ms-flex-pack: start;    /*IE10*/
		-webkit-justify-content: flex-start;     /* Safari etc. */
		-ms-justify-content    : flex-start;     /* IE10        */
		justify-content        : flex-start;
	}

	.flex-md-justfy-end{
		-webkit-box-pack: end; /*Android4.3*/
		-moz-box-pack: end;    /*Firefox21*/
		-ms-flex-pack: end;    /*IE10*/
		-webkit-justify-content: flex-end;         /* Safari etc. */
		-ms-justify-content    : flex-end;         /* IE10        */
		justify-content        : flex-end;
	}

	.flex-md-justfy-between{
		-webkit-box-pack: justify; /*Android4.3*/
		-moz-box-pack: justify;    /*Firefox21*/
		-ms-flex-pack: justify;    /*IE10*/
		-webkit-justify-content: space-between;  /* Safari etc. */
		-ms-justify-content    : space-between;  /* IE10        */
		justify-content        : space-between;
	}

	.flex-md-justfy-around{
		-webkit-justify-content: space-around;   /* Safari etc. */
		-ms-justify-content    : space-around;   /* IE10        */
		justify-content        : space-around;
	}

}





/* ------------------------
 flexbox - lg
------------------------- */

@media screen and (min-width: 1200px){

	.flex-lg-flex{
		-js-display: flex; /* flexibility.js */
		display: -webkit-box; /* android用 */
		display: -ms-flexbox; /* IE用 */
		display: -webkit-flex; /* Safari用 */
		display: flex;
	}

	.flex-lg-wrap{
			-webkit-flex-wrap : wrap;
			-ms-flex-wrap : wrap;
			flex-wrap : wrap;
	}

	.flex-lg-nowrap{
			-webkit-flex-wrap : nowrap;
			-ms-flex-wrap : nowrap;
			flex-wrap : nowrap;
	}

	.flex-lg-alignitems-center{
		-webkit-align-items: center;      /* Safari etc. */
		-ms-align-items    : center;      /* IE10        */
		align-items        : center;
	}

	.flex-lg-alignitems-start{
		-webkit-align-items: flex-start;  /* Safari etc. */
		-ms-align-items    : flex-start;  /* IE10        */
		align-items        : flex-start;
	}

	.flex-lg-alignitems-end{
		-webkit-align-items: flex-end;    /* Safari etc. */
		-ms-align-items    : flex-end;    /* IE10        */
		align-items        : flex-end;
	}

	.flex-lg-alignitems-strech{
		-webkit-align-items: stretch;     /* Safari etc. */
		-ms-align-items    : stretch;     /* IE10        */
		align-items        : stretch;
	}

	.flex-lg-alignitems-baseline{
		-webkit-align-items: baseline;    /* Safari etc. */
		-ms-align-items    : baseline;    /* IE10        */
		align-items        : baseline;
	}

	.flex-lg-justfy-center{
		-webkit-box-pack: center; /*Android4.3*/
		-moz-box-pack: center;    /*Firefox21*/
		-ms-flex-pack: center;    /*IE10*/
		-webkit-justify-content: center;       /* Safari etc. */
		-ms-justify-content    : center;       /* IE10        */
		justify-content        : center;
	}

	.flex-lg-justfy-start{
		-webkit-box-pack: start; /*Android4.3*/
		-moz-box-pack: start;    /*Firefox21*/
		-ms-flex-pack: start;    /*IE10*/
		-webkit-justify-content: flex-start;     /* Safari etc. */
		-ms-justify-content    : flex-start;     /* IE10        */
		justify-content        : flex-start;
	}

	.flex-md-justfy-end{
		-webkit-box-pack: end; /*Android4.3*/
		-moz-box-pack: end;    /*Firefox21*/
		-ms-flex-pack: end;    /*IE10*/
		-webkit-justify-content: flex-end;         /* Safari etc. */
		-ms-justify-content    : flex-end;         /* IE10        */
		justify-content        : flex-end;
	}

	.flex-lg-justfy-between{
		-webkit-box-pack: justify; /*Android4.3*/
		-moz-box-pack: justify;    /*Firefox21*/
		-ms-flex-pack: justify;    /*IE10*/
		-webkit-justify-content: space-between;  /* Safari etc. */
		-ms-justify-content    : space-between;  /* IE10        */
		justify-content        : space-between;
	}

	.flex-lg-justfy-around{
		-webkit-justify-content: space-around;   /* Safari etc. */
		-ms-justify-content    : space-around;   /* IE10        */
		justify-content        : space-around;
	}
}