@charset "UTF-8";

/* CSS Document */
/*●基本的な共通宣言*/
body {
	text-align: justify;
}

main, section, nav, article, aside, header, footer {
	display: block;
}

*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	padding: 0px;
}

img {
	vertical-align: top;
	max-width: 100%;
	height: auto;
	aspect-ratio: attr(width)/attr(height);
}

::-webkit-input-placeholder {
	/* WebKit, Blink, Edge */
	color: #ccc;
}

:-ms-input-placeholder {
	/* Internet Explorer 10-11 */
	color: #ccc;
}

::-moz-placeholder {
	/* Others */
	color: #ccc;
}

::-ms-input-placeholder {
	/* Others */
	color: #ccc;
}

::placeholder {
	/* Others */
	color: #ccc;
}

.clear {
	clear: both;
}

.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

/*
●強制的にその要素だけに例外適用したい場合などに使用可
（クラスなどで宣言して複数個所に共通利用できる場合は基本的にはそちらで宣言する）
*/
.ta_c {
	text-align: center !important;
}

.ta_j {
	text-align: justify !important;
}

.ta_l {
	text-align: left !important;
}

.ta_r {
	text-align: right !important;
}

.font_b {
	font-weight: bold !important;
}

.font9 {
	font-size: 9px !important;
}

.font10 {
	font-size: 10px !important;
}

.font12 {
	font-size: 12px !important;
}

.font14 {
	font-size: 14px !important;
}

.font16 {
	font-size: 16px !important;
}

.font18 {
	font-size: 18px !important;
}

.font24 {
	font-size: 24px !important;
}

.font36 {
	font-size: 36px !important;
}

.font_s {
	font-size: 90% !important;
}

.font_ss {
	font-size: 80% !important;
}

.font_sss {
	font-size: 70% !important;
}

.font_l {
	font-size: 110% !important;
}

.font_ll {
	font-size: 120% !important;
}

.font_lll {
	font-size: 130% !important;
}

.bg_white {
	background-color: #FFF !important;
}

.no_disp {
	display: none !important;
}

.mt0 {
	margin-top: 0px !important;
}

.mt1 {
	margin-top: 1px !important;
}

.mt2 {
	margin-top: 2px !important;
}

.mt3 {
	margin-top: 3px !important;
}

.mt4 {
	margin-top: 4px !important;
}

.mt5 {
	margin-top: 5px !important;
}

.mt10 {
	margin-top: 10px !important;
}

.mt15 {
	margin-top: 15px !important;
}

.mt20 {
	margin-top: 20px !important;
}

.mt25 {
	margin-top: 25px !important;
}

.mt30 {
	margin-top: 30px !important;
}

.mt40 {
	margin-top: 40px !important;
}

.mt50 {
	margin-top: 50px !important;
}

.mt60 {
	margin-top: 60px !important;
}

.mt70 {
	margin-top: 70px !important;
}

.mt80 {
	margin-top: 80px !important;
}

.mt90 {
	margin-top: 90px !important;
}

.mt100 {
	margin-top: 100px !important;
}

.mb0 {
	margin-bottom: 0px !important;
}

.mb10 {
	margin-bottom: 10px !important;
}

.mb20 {
	margin-bottom: 20px !important;
}

.mb30 {
	margin-bottom: 30px !important;
}

.ml0 {
	margin-left: 0px !important;
}

.ml10 {
	margin-left: 10px !important;
}

.ml20 {
	margin-left: 20px !important;
}

.ml30 {
	margin-left: 30px !important;
}

.pt0 {
	padding-top: 0px !important;
}

.pt10 {
	padding-top: 10px !important;
}

.pt20 {
	padding-top: 20px !important;
}

.pt30 {
	padding-top: 30px !important;
}

.pb0 {
	padding-bottom: 0px !important;
}

.pb10 {
	padding-bottom: 10px !important;
}

.pb20 {
	padding-bottom: 20px !important;
}

.pb30 {
	padding-bottom: 30px !important;
}

.pl0 {
	padding-left: 0px !important;
}

.pl10 {
	padding-left: 10px !important;
}

.pl20 {
	padding-left: 20px !important;
}

.pl30 {
	padding-left: 30px !important;
}

.fl_left {
	float: left !important;
}

.fl_right {
	float: right !important;
}

.w25 {
	width: 25% !important;
}

.w50 {
	width: 50% !important;
}

.w75 {
	width: 75% !important;
}

.w100 {
	width: 100% !important;
}

/*●その他便利クラス*/
.orikaesi {
	word-break: break-all;
}

.t_indent {
	text-indent: -1em;
	padding-left: 1em;
}

.flex {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	list-style: none;
}

.jus_around {
	-ms-flex-pack: distribute;
	    justify-content: space-around;
}

.jus_between {
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
}

.jus_center {
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

.jus_end {
	-webkit-box-pack: end;
	    -ms-flex-pack: end;
	        justify-content: flex-end;
}

.img_box {
	/*サイズを各要素で指定して利用*/
	position: relative;
}

.img_box img {
	max-width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	        transform: translate(-50%, -50%);
}