/* head */


.head {
	width: calc(100% - 0rem);
	height: calc(3rem - 0rem);
	display: flex;
	flex-direction: column;
	position: fixed;
	top: 0;
	z-index: 1000000;
	background-color: var(--bg-head);
	border-bottom: 2px solid var(--color-primary-transparent);
}

.head_container {
	width: calc(100% - 6rem);
	max-width: calc(73.5rem - 6rem);
	height: calc(100% - 0rem);
	margin: 0 auto;
	padding: 0 3rem;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	position: relative;
	background-color: var(--bg-head);
}


/* head: left */
.head_left {
	width: fit-content;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

.head_left_1 {
	width: fit-content;
	height: 100%;
	display: flex;
	align-items: center;
}

.head_left_1 a img {
	width: 10rem;
	user-select: none;
}

.head_left_2 {
	width: fit-content;
	height: 100%;
	margin: 0 0 0 2rem;
	display: flex;
}

.head_left_2 ul {
	width: fit-content;
	height: 100%;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
}

.head_left_2 ul li {
	height: calc(100% - 0rem);
	display: flex;
}

.head_left_2 ul li a {
	height: calc(100% - 2rem);
	padding: 1rem;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--link-head);
	font-size: 0.875em;
	line-height: normal;
	transition: all 0s;
}

.head_left_2 ul li a:hover {
	color: var(--link-head-hover);
}


/* head: right */
.head_right {
	width: fit-content;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.head_right_1 {
	width: fit-content;
	height: 100%;
	display: flex;
}

.head_right_1 ul {
	width: fit-content;
	height: 100%;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
}

.head_right_1 ul li {
	height: calc(100% - 0rem);
	display: flex;
}

.head_right_1 ul li span {
	height: calc(100% - 2rem);
	padding: 1rem;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--link-head);
	font-size: 1.25em;
	line-height: normal;
	cursor: pointer;
}

.head_right_1 ul li span:hover {
	color: var(--link-head-hover);
}

.head_right_1 ul li a {
	height: calc(100% - 2rem);
	padding: 1rem;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--link-head);
	font-size: 1em;
	line-height: normal;
	transition: all 0s;
}

.head_right_1 ul li a:hover {
	color: var(--link-head-hover);
}

.head_right_1 ul li a strong {
	height: calc(100% - 0rem);
	padding: 0 0 0 0.25rem;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 0.75em;
	font-weight: 400;
	line-height: normal;
	cursor: pointer;
}

.head_right_2 {
	width: fit-content;
	height: 100%;
	display: flex;
}

.head_right_2 ul {
	width: fit-content;
	height: 100%;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
}

.head_right_2 ul li {
	height: calc(100% - 0rem);
	display: flex;
}

.head_right_2 ul li:nth-child(2) {
	height: calc(100% - 2rem);
	margin: 1rem;
	border-right: 0.1rem solid var(--link-head);
}

.head_right_2 ul li a,
.head_right_2 ul li span {
	height: calc(100% - 2rem);
	padding: 1rem;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--link-head);
	font-size: 0.875em;
	line-height: normal;
	transition: all 0s;
}

.head_right_2 ul li a i {
	font-size: 1em;
}

.head_right_2 ul li:last-child a,
.head_right_2 ul li:last-child span {
	padding: 1rem 0rem 1rem 1rem;
}

.head_right_2 ul li a:hover,
.head_right_2 ul li span:hover {
	color: var(--link-head-hover);
	cursor: pointer;
}

#signup {
	display: none;
}

.head_right_3 {
	width: fit-content;
	height: 100%;
	display: flex;

	display: none;
}

.head_right_3 ul {
	width: fit-content;
	height: calc(100% - 0rem);
	display: flex;
	flex-direction: row;
	align-items: center;
}

.head_right_3 ul li {
	width: calc(1.5rem - 0rem);
	display: flex;
	justify-content: center;
}

.head_right_3 ul li span {
	height: calc(100% - 0rem);
	display: flex;
	color: var(--link-head);
	font-size: 1.5em;
	line-height: normal;
	cursor: pointer;
}

.head_right_3 ul li span:hover {
	color: var(--link-head-hover);
}


/* head: menu */
.head_menu {
	width: calc(17rem - 2rem);
	padding: 1.25rem 1rem;
	position: absolute;
  	top: calc(3rem + 2px);
  	right: 1rem;
  	background-color: var(--bg-menu);
  	border-left: 1px solid var(--grey-dark);
  	border-right: 1px solid var(--grey-dark);
  	border-bottom: 1px solid var(--grey-dark);
	border-bottom-left-radius: var(--radius-default);
  	border-bottom-right-radius: var(--radius-default);

  	display: none;
}

.head_menu ul {
	width: calc(100% - 0rem);
}

.head_menu ul li {
	width: calc(100% - 0rem);
	padding: 1rem 0;
	display: flex;
	align-items: center;
	color: var(--text);
	cursor: pointer;

	-webkit-tap-highlight-color: transparent;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.head_menu ul li:first-child,
.head_menu ul li:last-child {
	padding: 0;
}

.head_menu ul li:nth-child(3) {
	padding: 0 0 1rem;
	border-bottom: 0.1rem solid var(--grey-dark);
}

.head_menu ul li a {
	width: calc(100% - 0rem);
	color: var(--text);
}

.head_menu ul li:hover,
.head_menu ul li:nth-child(4) a:hover {
	color: var(--link-hover);
}


@media only screen and (max-width: 1024px) {


	/* head */
	.head_container {
		width: calc(100% - 4rem);
		max-width: calc(100% - 4rem);
		padding: 0 2rem;
	}


}


@media only screen and (max-width: 768px) {


	/* head */
	.head_container {
		width: calc(100% - 2rem);
		max-width: calc(100% - 2rem);
		padding: 0 1rem;
	}


	/* head: left */
	.head_left_2 {
		display: none;
	}


	/* head: right */
	.head_right_1 {
		display: none;
	}

	.head_right_2 {
		display: none;
	}

	.head_right_3 {
		display: flex;
	}


	/* head: menu */
	#head-menu-open {
		display: flex;
	}

	#head-menu-close {
		display: none;
	}


}


/* head */