@charset "utf-8";

h2 {
	background: none;
	border-bottom: none;
	margin: 0em 1em 1em 1em;
	padding: 0em;
}

.flex{
	display: flex;
	margin-left: 1em;
}

.flexL {
	margin: 0em 1em;
	min-width: 30px;
}

.flexR {
	margin-left: 1em;
}

.ArrowShaft {
	width: 8px;
	min-width: 8px;
	height: auto;
	margin: 0px 10px;
	position: relative;
	background: #fff;
	background: linear-gradient(0deg, #fff 0%, #ff6 25%, #fff 100%);
	border: 1px solid #f90;
	border-bottom: none;
}
.ArrowNo {
	width: 8px;
	min-width: 8px;
	height: auto;
	margin: 0px 10px;
	position: relative;
}


.ArrowHead {
	width: 30px;
	height: 15px;
	position: relative;
	margin-left: 1em;
}

.ArrowHead:before {
	border: 15px solid transparent;
	border-top-color: #f90;
	content: "";
	position: absolute;
	margin-left: -15px;
	left: 15px;
	bottom: -15px;
}

.ArrowHead:after {
	border: 14px solid transparent;
	border-top-color: white;
	content: "";
	position: absolute;
	margin-left: -15px;
	left: 16px;
	bottom: -13px;
}

@media screen and (max-width:428px) {
	.flex, .flexR {
		margin-left: 0em;
	}
	.ArrowShaft, .ArrowNo, .ArrowHead {
		display: none;
	}
}