/* ================


utility


==================*/

.Rad_60 {
	border-top-left-radius: 60px !important;
	border-bottom-left-radius: 60px !important;
	border-top-right-radius: 60px !important;
	border-top-right-radius: 60px !important;
}
@media screen and (min-width: 768px) {
	.Grid_Md_2 {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
	}
	.Gap_Col_Md_5 {
		column-gap: var(--f_space_5);
	}
}
/*
 overflow
 */
.OverX_Hidden {
	overflow-x: hidden;
}
.Over_Initial {
	overflow: initial;
}
/*
 width
  */
.Mw_Auto {
	min-width: auto;
	max-width: auto;
}
/*
 width
  */
.Mx_50 {
	max-width: 50% !important;
}

/*

margin 

*/
.My_3 {
	margin-top: var(--f_space_3) !important;
	margin-bottom: var(--f_space_3) !important;
}

.My_4 {
	margin-top: var(--f_space_4) !important;
	margin-bottom: var(--f_space_4) !important;
}

.My_7 {
	margin-top: var(--f_space_7) !important;
	margin-bottom: var(--f_space_7) !important;
}

.My_8 {
	margin-top: var(--f_space_8) !important;
	margin-bottom: var(--f_space_8) !important;
}

.My_9 {
	margin-top: var(--f_space_9) !important;
	margin-bottom: var(--f_space_9) !important;
}
.My_100 {
	margin-top: 100px !important;
	margin-bottom: 100px !important;
}

@media screen and (min-width: 768px) {
	.My_Md_100 {
		margin-top: 100px !important;
		margin-bottom: 100px !important;
	}
}
.My_120 {
	margin-top: 128px !important;
	margin-bottom: 128px !important;
}

@media screen and (min-width: 768px) {
	.My_Md_120 {
		margin-top: 128px !important;
		margin-bottom: 128px !important;
	}
}
.My_140 {
	margin-top: 138px !important;
	margin-bottom: 138px !important;
}

@media screen and (min-width: 768px) {
	.My_Md_140 {
		margin-top: 138px !important;
		margin-bottom: 138px !important;
	}
}

.Mt_1 {
	margin-top: var(--f_space_1) !important;
}

.Mt_2 {
	margin-top: var(--f_space_2) !important;
}
@media screen and (min-width: 768px) {
	.Mt_Md_2 {
		margin-top: var(--f_space_2) !important;
	}
}
.Mt_3 {
	margin-top: var(--f_space_3) !important;
}

.Mt_4 {
	margin-top: var(--f_space_4) !important;
}

@media screen and (min-width: 768px) {
	.Mt_Md_4 {
		margin-top: var(--f_space_4) !important;
	}
}

.Mt_5 {
	margin-top: var(--f_space_5) !important;
}

.Mt_6 {
	margin-top: var(--f_space_6) !important;
}

.Mt_7 {
	margin-top: var(--f_space_7) !important;
}

.Mt_8 {
	margin-top: var(--f_space_8) !important;
}

@media screen and (min-width: 768px) {
	.Mt_Md_8 {
		margin-top: var(--f_space_8) !important;
	}
}

.Mt_9 {
	margin-top: var(--f_space_9) !important;
}

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

@media screen and (min-width: 768px) {
	.Mt_Md_100 {
		margin-top: 100px !important;
	}
}
.Mt_140 {
	margin-top: 138px !important;
}
@media screen and (min-width: 768px) {
	.Mt_Md_140 {
		margin-top: 138px !important;
	}
}

.Mb_1 {
	margin-bottom: var(--f_space_1) !important;
}

.Mb_2 {
	margin-bottom: var(--f_space_2) !important;
}

.Mb_3 {
	margin-bottom: var(--f_space_3) !important;
}

.Mb_4 {
	margin-bottom: var(--f_space_4) !important;
}

.Mb_5 {
	margin-bottom: var(--f_space_5) !important;
}
@media screen and (min-width: 768px) {
	.Mb_Md_5 {
		margin-bottom: var(--f_space_5) !important;
	}
}
.Mb_6 {
	margin-bottom: var(--f_space_6) !important;
}
@media screen and (min-width: 768px) {
	.Mb_Md_6 {
		margin-bottom: var(--f_space_6) !important;
	}
}

.Mb_7 {
	margin-bottom: var(--f_space_7);
}
@media screen and (min-width: 768px) {
	.Mb_Md_7 {
		margin-bottom: var(--f_space_7) !important;
	}
}

.Mb_8 {
	margin-bottom: var(--f_space_8) !important;
}
@media screen and (min-width: 768px) {
	.Mb_Md_8 {
		margin-bottom: var(--f_space_8) !important;
	}
}
.Mb_9 {
	margin-bottom: var(--f_space_9) !important;
}

@media screen and (min-width: 768px) {
	.Mb_Md_9 {
		margin-bottom: var(--f_space_9) !important;
	}
}

@media screen and (min-width: 992px) {
	.Mb_Lg_9 {
		margin-bottom: var(--f_space_9) !important;
	}
}

.Mb_100 {
	margin-bottom: 100px;
}
@media screen and (min-width: 768px) {
	.Mb_Md_100 {
		margin-bottom: 100px !important;
	}
}
.Mb_120 {
	margin-bottom: 128px !important;
}

@media screen and (min-width: 768px) {
	.Mb_Md_120 {
		margin-bottom: 128px !important;
	}
}
@media screen and (min-width: 768px) {
	.Mb_Md_0 {
		margin-bottom: 0 !important;
	}
}
@media screen and (min-width: 992px) {
	.Mb_Lg_0 {
		margin-bottom: 0 !important;
	}
}
/*

padding 

*/
.Pb_2 {
	padding-bottom: var(--f_space_2);
}
.Pb_3 {
	padding-bottom: var(--f_space_3);
}
.Pb_4 {
	padding-bottom: var(--f_space_4);
}
.Pb_6 {
	padding-bottom: var(--f_space_6);
}
.Pb_7 {
	padding-bottom: var(--f_space_7);
}
@media screen and (min-width: 768px) {
	.Pb_Md_7 {
		padding-bottom: var(--f_space_7);
	}
}
@media screen and (min-width: 992px) {
	.Pb_Lg_7 {
		padding-bottom: var(--f_space_7);
	}
}
.Pb_8 {
	padding-bottom: var(--f_space_8);
}
.Pb_9 {
	padding-bottom: var(--f_space_9);
}
@media screen and (min-width: 768px) {
	.Pb_Md_9 {
		padding-bottom: var(--f_space_9);
	}
}
@media screen and (min-width: 992px) {
	.Pb_Lg_9 {
		padding-bottom: var(--f_space_9);
	}
}
.Pb_140 {
	padding-bottom: 138px;
}
@media screen and (min-width: 768px) {
	.Pb_Md_140 {
		padding-bottom: 138px;
	}
}
.Pb_200 {
	padding-bottom: 200px;
}

@media screen and (min-width: 768px) {
	.Pb_Md_200 {
		padding-bottom: 200px;
	}
}
.Pt_1 {
	padding-top: var(--f_space_1) !important;
}
.Pt_2 {
	padding-top: var(--f_space_2) !important;
}
.Pt_3 {
	padding-top: var(--f_space_3) !important;
}
.Pt_4 {
	padding-top: var(--f_space_4) !important;
}
.Pt_5 {
	padding-top: var(--f_space_5) !important;
}
.Pt_6 {
	padding-top: var(--f_space_6) !important;
}
.Pt_7 {
	padding-top: var(--f_space_7) !important;
}
@media screen and (min-width: 768px) {
	.Pt_Md_7 {
		padding-top: var(--f_space_7) !important;
	}
}
.Pt_8 {
	padding-top: var(--f_space_8) !important;
}

@media screen and (min-width: 992px) {
	.Pt_Lg_7 {
		padding-top: var(--f_space_7) !important;
	}
}
.Pt_9 {
	padding-top: var(--f_space_9) !important;
}

.Pt_100 {
	padding-top: 100px !important;
}

.Pt_120 {
	padding-top: 128px !important;
}
@media screen and (min-width: 992px) {
	.Pt_Lg_120 {
		padding-top: 128px !important;
	}
}
.Py_1 {
	padding-top: var(--f_space_1) !important;
	padding-bottom: var(--f_space_1) !important;
}
.Py_2 {
	padding-top: var(--f_space_2) !important;
	padding-bottom: var(--f_space_2) !important;
}
.Py_3 {
	padding-top: var(--f_space_3) !important;
	padding-bottom: var(--f_space_3) !important;
}
.Py_7 {
	padding-top: var(--f_space_7) !important;
	padding-bottom: var(--f_space_7) !important;
}
.Py_8 {
	padding-top: var(--f_space_8) !important;
	padding-bottom: var(--f_space_8) !important;
}
.Py_9 {
	padding-top: var(--f_space_9) !important;
	padding-bottom: var(--f_space_9) !important;
}

@media screen and (min-width: 768px) {
	.Py_Md_9 {
		padding-top: var(--f_space_9) !important;
		padding-bottom: var(--f_space_9) !important;
	}
}
@media screen and (min-width: 768px) {
	.Py_Md_100 {
		padding-top: 100px !important;
		padding-bottom: 100px !important;
	}
}
@media screen and (min-width: 768px) {
	.Py_Md_140 {
		padding-top: 138px !important;
		padding-bottom: 138px !important;
	}
}

.Px_0 {
	padding-left: 0;
	padding-right: 0;
}
.Pe_0 {
	padding-right: 0;
}
@media screen and (max-width: 768px) {
	.Pe_Min_Md_0 {
		padding-right: 0;
	}
}
@media screen and (min-width: 992px) {
	.Pe_Lg_0 {
		padding-right: 0;
	}
}
.Pe_2 {
	padding-right: var(--f_space_2);
}
@media screen and (min-width: 992px) {
	.Pe_Lg_2 {
		padding-right: var(--f_space_2);
	}
}
.Pe_8 {
	padding-right: var(--f_space_8);
}
@media screen and (min-width: 768px) {
	.Pe_Md_8 {
		padding-right: var(--f_space_8);
	}
}
@media screen and (min-width: 768px) {
	.Pe_Md_9 {
		padding-right: var(--f_space_9);
	}
}

.Ps_0 {
	padding-left: 0;
}
.Ps_3 {
	padding-left: var(--f_space_3);
}

.Ps_4 {
	padding-left: var(--f_space_4);
}
.Ps_5 {
	padding-left: var(--f_space_5);
}
.Ps_6 {
	padding-left: var(--f_space_6);
}
.Ps_7 {
	padding-left: var(--f_space_7);
}
@media screen and (min-width: 768px) {
	.Ps_Md_7 {
		padding-left: var(--f_space_7);
	}
}
@media screen and (min-width: 576px) {
	.Ps_Sm_7 {
		padding-left: var(--f_space_7);
	}
}

.Px_1 {
	padding-left: var(--f_space_1) !important;
	padding-right: var(--f_space_1) !important;
}
.Px_2 {
	padding-left: var(--f_space_2) !important;
	padding-right: var(--f_space_2) !important;
}

@media screen and (min-width: 768px) {
	.Px_Md_2 {
		padding-left: var(--f_space_2) !important;
		padding-right: var(--f_space_2) !important;
	}
}

@media screen and (min-width: 992px) {
	.Px_Lg_2 {
		padding-left: var(--f_space_2);
		padding-right: var(--f_space_2);
	}
}

.Px_3 {
	padding-left: var(--f_space_3);
	padding-right: var(--f_space_3);
}

@media screen and (min-width: 768px) {
	.Px_Md_3 {
		padding-left: var(--f_space_3);
		padding-right: var(--f_space_3);
	}
}

@media screen and (min-width: 992px) {
	.Px_Lg_3 {
		padding-left: var(--f_space_3);
		padding-right: var(--f_space_3);
	}
}

.Px_4 {
	padding-left: var(--f_space_4);
	padding-right: var(--f_space_4);
}
@media screen and (min-width: 768px) {
	.Px_Md_0 {
		padding-left: 0;
		padding-right: 0;
	}
}
@media screen and (min-width: 992px) {
	.Px_Lg_0 {
		padding-left: 0;
		padding-right: 0;
	}
}

@media screen and (min-width: 576px) {
	.Ps_Sm_0 {
		padding-left: 0;
	}
}

@media screen and (min-width: 768px) {
	.Ps_Md_0 {
		padding-left: 0;
	}
}

@media screen and (min-width: 992px) {
	.Ps_Lg_0 {
		padding-left: 0;
	}
}

/* 

テキストリンク

*/

/* リンク */
.TextLink {
	font-weight: 700;
	color: var(--f_blue);
	text-decoration: underline;
}
.TxtLink_Blue {
	text-decoration: underline;
	color: var(--f_blue);
	font-weight: 700;
}

a.TxtLink_Blue[href$=".pdf"]::after {	/* .pdfファイルのリンクにアイコン表示 */
  content: '';
  display: inline-block;
  width: 3.2em;
  height: 3.2em;
  margin-left: -0.2em;
  background-image: url('../img/icon/pdf-icon.svg');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
}
/* 

フォントサイズ

*/

.Fs_12 {
	font-size: 1.2rem !important;
}
.Fs_14 {
	font-size: 1.4rem !important;
}
@media (min-width: 992px) {
	.Fs_Lg_12 {
		font-size: 1.2rem !important;
	}
}
@media (min-width: 768px) {
	.Fs_Md_14 {
		font-size: 1.4rem !important;
	}
}
.Fs_18 {
	font-size: 1.8rem !important;
}
.Fs_16 {
	font-size: 1.6rem !important;
}
.Fs_20 {
	font-size: 2rem !important;
}
.Fs_24 {
	font-size: 2.4rem !important;
}
@media (min-width: 768px) {
	.Fs_Md_24 {
		font-size: 2.4rem !important;
	}
}
@media (min-width: 992px) {
	.Fs_Lg_24 {
		font-size: 2.4rem !important;
	}
}
/* 

フォントカラー

*/
.Txt_Gray {
	color: var(--f_gray);
}
.Txt_DarkGray {
	color: var(--f_darkgray);
}

.Txt_Main {
	color: var(--f_main);
}
.Txt_Main_Deep {
	color: var(--f_main-deep);
}
.Txt_Blue {
	color: var(--f_blue);
}
.Txt_Red {
	color: var(--f_red);
}

/* 

フォントウェイト

*/
.Fw_R {
	font-weight: 400;
}
.Fw_M {
	font-weight: 500;
}

.Fw_B {
	font-weight: 700;
}


line-through

/* 

線

*/
.DashBorder_B {
	border-bottom: 2px dashed var(--f_blue);
}

/*

フッター直前の背景色が白ではないときに、
フッターの上の画像レイアウトが覆い被るようにする合わせる

*/
.Footer_Adjacent {
	margin-bottom: -30px;
}
@media (min-width: 992px) {
	.Footer_Adjacent {
		margin-bottom: -100px;
	}
}
/* 

背景色

*/

.Bg_Light {
	background-color: var(--f_light);
}
.Bg_LightBlue {
	background-color: var(--f_lightblue);
}
.Bg_LightBlue_2 {
	background-position: 0%;
	background-size: cover;
	background-repeat: repeat;
	background-image: url("../img/bg_sp.png");
}

@media (min-width: 992px) {
	.Bg_LightBlue_2 {
		background-image: url("../img/bg_pc.png");
	}
}
.Bg_LightBlue_Grid {
	background-color: var(--f_lightblue);
	background-image: linear-gradient(0deg, transparent calc(100% - 1px), #ffffff calc(100% - 1px)), linear-gradient(90deg, #ffffff00 calc(100% - 1px), #ffffff calc(100% - 1px));
	background-size: 16px 16px;
	background-repeat: repeat;
	background-position: center center;
}
.Bg_Light_Grid {
	background-color: var(--f_light);
	background-image: linear-gradient(0deg, transparent calc(100% - 1px), var(--f_lightgray) calc(100% - 1px)), linear-gradient(90deg, #ffffff00 calc(100% - 1px), var(--f_lightgray) calc(100% - 1px));
	background-size: 14px 14px;
	background-repeat: repeat;
	background-position: center center;
}

.Bg_Main {
	background-color: var(--f_main);
}
.Bg_Main_Deep {
	background-color: var(--f_main-deep);
}
.Bg_LightGray {
	background-color: var(--f_lightgray);
}

.Bg_MainBright {
	background-color: var(--f_main-bright);
}
