@charset "utf-8";

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

.black-font {color: #000;}
.gray-font {color: #898989;}
.red-font {color: #E60012;}

.font12-14 {font-size: clamp(12px,2vw,14px);}
.font14-16 {font-size: clamp(14px,2vw,16px);}
.font16-18 {font-size: clamp(16px,2vw,18px);}

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

.box500 {max-width: 500px;}
.box600 {max-width: 600px;}
.box700 {max-width: 700px;}
.box800 {max-width: 800px;}
.box1000 {max-width: 1000px;}
.box1200 {max-width: 1200px;}

.flex-box {
	display: flex;
	justify-content: center;
}

.con2 {flex-basis: 48%;}

.con3 {flex-basis: calc(100% / 3);}

.position-r {position: relative;}
.position-a {position: absolute;}

/*---br管理--*/
/*---スマホ時改行--*/
@media screen and (max-width: 768px) {
.pc-br{display:none;}
.sp-br{display:block;}
}
@media screen and (max-width: 560px) {
.sp-br560{display:block;}
}
/*---PC時改行--*/
@media screen and (min-width:561px) {
.sp-br560{display:none;}
} 
@media screen and (min-width:769px) {
.pc-br{display:block;}
.sp-br{display:none;}
}

.mt0{margin-top: 0;}
.mt5{margin-top: 0.5rem;}
.mt10{margin-top: 1rem;}
.mt20{margin-top: 2rem;}
.mt30{margin-top: 3rem;}
.mt40{margin-top: 4rem;}
.mt60{margin-top: 6rem;}
.mt100{margin-top: 10rem;}
.mb0{margin-bottom: 0;}
.mb10{margin-bottom: 1rem;}
.mb20{margin-bottom: 2rem;}
.mb30{margin-bottom: 3rem;}
.mb40{margin-bottom: 4rem;}
.mb60{margin-bottom: 6rem;}

.mrl-auto {
	margin-left: auto;
	margin-right: auto;
}
.mtb0{
	margin-top: 0;
	margin-bottom: 0;
}

.mt50-60 {margin-top: clamp(5rem,7.5vw,6rem);}
.mt60-100 {margin-top: clamp(6rem,10.5vw,10rem);}
.mb10-30 {margin-bottom: clamp(1rem,2vw,3rem);}
.mb20-40 {margin-bottom: clamp(2rem,3vw,4rem);}
.mb30-80 {margin-bottom: clamp(3rem,7vw,8rem);}
.mb40-80 {margin-bottom: clamp(4rem,5.5vw,8rem);}
.mb60-100 {margin-bottom: clamp(6rem,10.5vw,10rem);}
.mb80-100 {margin-bottom: clamp(8rem,15.5vw,10rem);}
.mb100-140 {margin-bottom: clamp(10rem,10.2vw,14rem);}

.prl10 {
	padding-left: 1rem;
	padding-right: 1rem;
}

.pb10 {padding-bottom: 1rem;}
.pb20 {padding-bottom: 2rem;}

.pt20-40 {padding-top: clamp(2rem,3vw,4rem);}
.pt40-80 {padding-top: clamp(4rem,5.5vw,8rem);}
.pt50-150 {padding-top: clamp(5rem,12vw,15rem);}
.pb10-30 {padding-bottom: clamp(1rem,2vw,3rem);}
.pb20-40 {padding-bottom: clamp(2rem,3vw,4rem);}
.pb40-80 {padding-bottom: clamp(4rem,5.5vw,8rem);}
.pb100-140 {padding-bottom: clamp(10rem,10.2vw,14rem);}

/* 画像切り替え */
.pc-view{display: block;}
.sp-view{display: none;}
.pc-view560{display: block;}
.sp-view560{display: none;}
table tr.pc-view {display: table-row;}
table.pc-view {display: table;}
.pc-view1200{display: block;}
.tb-view1200 {display: none;}
@media screen and (max-width: 1200px) {
.pc-view1200{display: none;}
.tb-view1200 {display: block;}
}
@media screen and (max-width: 768px) {
.pc-view,table tr.pc-view,table.pc-view{display: none;}
.sp-view{display: block;}
}
@media screen and (max-width: 560px) {
.pc-view560{display: none;}
.sp-view560{display: block;}
}

.no-wrap{display: inline-block!important;}

#page-top a:hover {
	opacity: 0.6;
}

@media screen and (max-width: 768px) {
	.flex-box.reverse-768 {
		flex-direction: column-reverse;
	}
}

@media screen and (max-width: 560px) {
	.flex-box {
		flex-direction: column;
	}
	
	.flex-box.reverse-560 {
		flex-direction: column-reverse;
	}
}