@charset "UTF-8";

/*-------------------------------------
	Helper
-------------------------------------*/
/*-------------------------------------
# position
-------------------------------------*/
.hp_posr {
	position: relative;
}

.hp_hover_on_txtUnderline:hover {
	text-decoration: underline !important;
}

@media screen and (max-width: 687px) {
	.hp_sp_fz_small {
		font-size: 0.85em !important;
	}
}

/*-------------------------------------
# flexbox
-------------------------------------*/
.hp_flexbox {
	display: flex;
	flex-direction: row;
}

.hp_flexbox__col4 {
}

.hp_flexbox__col4 > .hp_flexbox__in_img {
	flex: 0 0 25%;
	max-width: 175px;
}

.hp_flexbox__col1to2 > .hp_flexbox__in_img {
	flex: 0 0 33%;
	max-width: 250px;
}

.hp_flexbox__gapSmall {
	gap: 0 5%;
}

.hp_flexbox__gapMiddle {
	gap: 0 10%;
}

@media screen and (max-width: 687px) {
	.hp_flexbox__gapMiddle_sp {
		gap: 0 10% !important;
	}
}

.hp_flexbox__gapColSmall {
	gap: 5% 0;
}

.hp_flexbox__gapColMiddle {
	gap: 10% 0;
}

@media screen and (max-width: 687px) {
	.hp_flexbox__col4 > .hp_flexbox__in_img {
		flex: 0 0 21%;
		max-width: 130px;
	}

	.hp_flexbox__gapSmall {
		gap: 0 2.5%;
	}

	.hp_flexbox__gapMiddle {
		gap: 0 5%;
	}

	.hp_flexbox__gapColSmall {
		gap: 2.5% 0;
	}

	.hp_flexbox__gapColMiddle {
		gap: 5% 0;
	}
}

.hp_flexbox_fd_col {
	flex-direction: column !important;
}

.hp_flexbox_jc_center {
	justify-content: center !important;
}

.hp_flexbox_jc_spa {
	justify-content: space-around !important;
}

.hp_flexbox_ai_center {
	align-items: center !important;
}

.hp_as_center {
	align-self: center !important;
}

/*-------------------------------------
# margin
-------------------------------------*/
.hp_mg_tops1 {
	margin-top: 2% !important;
}

.hp_mg_bottoms1 {
	margin-bottom: 2% !important;
}

.hp_mg_bottoms2 {
	margin-bottom: 4% !important;
}

.hp_mg_bottoms3 {
	margin-bottom: 6% !important;
}

.hp_mg_bottoms4 {
	margin-bottom: 8% !important;
}

.hp_mt_2p {
	margin-top: 2% !important;
}

.hp_mt_3p {
	margin-top: 3% !important;
}

.hp_mt_5p {
	margin-top: 5% !important;
}

.hp_mb_2p {
	margin-bottom: 2% !important;
}

.hp_mb_3p {
	margin-bottom: 3% !important;
}
	

.hp_mb_5p {
	margin-bottom: 5% !important;
}



/*-------------------------------------
# padding
-------------------------------------*/
.hp_padding_tb_large {
	padding-top: 2rem !important;
	padding-bottom: 2rem !important;
}

.hp_padding_t_large {
	padding-top: 2rem !important;
}

.hp_padding_lr_large {
	padding-left: 10% !important;
	padding-right: 10% !important;
}

.hp_pr_2-5r {
	padding-right: 2.5rem !important;
}

.hp_pr_10p {
	padding-right: 10% !important;
}

.hp_pb_2p {
	padding-bottom: 2% !important;
}

.hp_pt_3p {
	padding-top: 3% !important;
}

.hp_pb_3p {
	padding-bottom: 3% !important;
}

/*-------------------------------------
# text-align
-------------------------------------*/
.hp_ta_center {
	text-align: center !important;
}

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


@media screen and (max-width: 687px) {
	.hp_sp_ta_center {
		text-align: center !important;
	}
}

/*-------------------------------------
# text-color
-------------------------------------*/
.hp_col_black {
	color: #000000 !important;
}

.hp_col_sky_blue {
	color: #4774b9 !important;
}

.hp_col_orange {
	color: #eb6100 !important;
}

.hp_col_red {
	color: #d8231e !important;
}

.hp_col_tsubame_blue {
	color: #002b62 !important;
}

/*-------------------------------------
# background color
-------------------------------------*/
.hp_bgc_light_orange {
	background-color: #fff5d7 !important;
}

/*-------------------------------------
# block position
-------------------------------------*/
.hp_blk_pos_center {
	margin-left: auto !important;
	margin-right: auto !important;
}

/*-------------------------------------
# font-size
-------------------------------------*/
.hp_fz_large {
	font-size: 2.4rem !important;
}

.hp_fz_small {
	font-size: 0.85em !important;
}

.hp_fz_normal {
	font-size: 1em !important;
}

.hp_fz_1-2rem {
	font-size: 1.2rem !important;
}

.hp_fz_1-4rem {
	font-size: 1.4rem !important;
}

.hp_fz_1-6rem {
	font-size: 1.6rem !important;
}

.hp_fz_2-0r {
	font-size: 2.0rem !important;
}

.hp_fz_2-4r {
	font-size: 2.4rem !important;
}

.hp_fz_3-5r {
	font-size: 3.5rem !important;
}

.hp_fz_4-2r {
	font-size: 4.2rem !important;
}

.hp_fz_5-0r {
	font-size: 5.0rem !important;
}

.hp_fz_5-5r {
	font-size: 5.5rem !important;
}

.hp_fz_6-0r {
	font-size: 6.0rem !important;
}

.hp_fz_6-5r {
	font-size: 6.5rem !important;
}

.hp_fz_8-5r {
	font-size: 8.5rem !important;
}


@media screen and (max-width: 687px) {
	.hp_fz_large {
		font-size: 1.6rem !important;
	}
	.hp_fz_2-0r {
		font-size: 1.6rem !important;
		line-height: 200% !important;
	}
	.hp_fz_3-5r {
		font-size: 1.6rem !important;
		line-height: 200% !important;
	}

	
}

/*-------------------------------------
# font weight
-------------------------------------*/
.hp_fw_800 {
	font-weight: 800 !important;
}

.hp_fw_700 {
	font-weight: 700 !important;
}

.hp_fw_400 {
	font-weight: 400 !important;
}

.hp_fw_100 {
	font-weight: 100 !important;
}


/*-------------------------------------
# width
-------------------------------------*/
@media screen and (max-width: 687px) {
	.hp_sp_w100 {
		width: 100% !important;
	}
}

/*-------------------------------------
# line height
-------------------------------------*/
@media screen and (max-width: 687px) {
	.hp_sp_lh_200 {
		line-height: 2 !important;
	}
	.hp_sp_lh_200 {
		line-height: 2 !important;
	}
}

/*-------------------------------------
# border
-------------------------------------*/
.hp_border_bottom_gray {
	border-bottom: 2px solid #9d9d9d;
}

/*-------------------------------------
# font family
-------------------------------------*/
.hp_font_family_din {
	font-family: din-2014, sans-serif !important;
}

.hp_flame {
	border: 1px solid #000;
	padding: 2%;
}

/*-------------------------------------
# letter spacing
-------------------------------------*/
.hp_ls_-0-2-5r {
	letter-spacing: -0.25rem !important;
}

/*-------------------------------------
# list
-------------------------------------*/
.hp_list_style_none {
	list-style: none !important;
}

.hp_list_style_disc {
	list-style: disc !important;
}

.hp_list_pos_outside {
	list-style: outside !important;
}

.hp_list_pos_inside {
	list-style: inside !important;
}

.hp_list_height_200 {
	line-height: 200% !important;
}

.hp_list_pl_2-0r {
	padding-left: 2.0rem !important;
}

@media screen and (max-width: 687px) {
	.hp_list_pl_2-0r {
		/* padding-left: 0 !important; */
		text-indent: -1.5em;
		padding-left: 1em;
	}
}