/*----------common start----------*/

* {
	margin: 0;
	padding: 0;
}
html,
body {
	width: 100%;
	height: 100%;
}
html {
	font-size: 1vw;
	font-family: 'Roboto', sans-serif;
	color: #3C3C46;
}
.desktop {
	display: none !important;
}
body {
	background-color: #FFFFFF;
}
.standard_main {
	display: block;
	width: 100%;
	height: auto;
}
.standard_section {
	display: block;
	width: 100%;
	height: auto;
	padding: 0 5%;
	box-sizing: border-box;
}
.standard_button {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	font-size: 2rem;
	line-height: 1em;
	cursor: pointer;
	color: #FFFFFF;
	font-weight: 700;
	font-family: 'Montserrat', 'Roboto', sans-serif;
	border: none;
	outline: none;
	border-radius: .5em;
	box-shadow: 0 0 1.5em .25em rgba(3, 178, 255, 0.15);
	background-color: #01B5FF;
	background-image: linear-gradient(89.84deg, #00B6FF 0.11%, #6D39FF 99.84%);
	padding: 1.1em 5em 1em;
	box-sizing: border-box;
	transition: transform .4s ease;
}
.standard_button:hover {
	transform: scale(1.05);
}

/*----------common end----------*/

/*----------header start----------*/

.standard_header {
	display: block;
	width: auto;
	height: auto;
	position: fixed;
	z-index: 999;
	left: 5.3rem;
	top: 14.5rem;
	overflow: hidden;
}
.header_link_container {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	width: auto;
	height: auto;
}
.header_roll_container {
	display: block;
	width: 15rem;
	height: 15rem;
	position: relative;
	z-index: 2;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, .8);
}
.header_roll_container img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	transition: opacity .4s ease, transform .4s ease;
	position: absolute;
	top: 0;
	left: 0;
}
.text_ellipse {
	opacity: 0;
	transform: rotate(180deg);
}
.text_header .clear_ellipse {
	opacity: 0;
}
.text_header .text_ellipse {
	opacity: 1;
	transform: none;
}
.header_dynamic_container {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	width: auto;
	height: auto;
	position: relative;
	z-index: 1;
	margin-left: 3.5rem;
	transition: transform .4s ease, opacity .4s ease;
}
.text_header .header_dynamic_container {
	transform: translateX(-50rem);
	opacity: 0;
}
.header_dynamic_title {
	display: block;
	width: auto;
	height: auto;
	text-align: left;
	font-size: 8.3rem;
	line-height: 1em;
	font-weight: 900;
	color: #01B5FF;
    background: -webkit-linear-gradient(0deg, #01B5FF, #6048FF 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-transform: uppercase;
}
.header_dynamic_title_mini {
    display: block;
    width: auto;
    height: auto;
    text-align: left;
    font-size: 4rem;
    line-height: 1em;
    font-weight: 400;
    text-transform: uppercase;
    margin-top: .2rem;
}
.header_dynamic_link {
	display: block;
	width: auto;
	height: auto;
	font-size: 2rem;
	line-height: 1em;
	color: #3C3C46;
	cursor: pointer;
	font-weight: 400;
	text-transform: uppercase;
}

/*----------header end----------*/

/*----------main start----------*/

.kv_section {
	padding-top: 35rem;
}
.kv_info_container {
	display: block;
	width: 100%;
	height: auto;
}
.kv_title {
	display: block;
	width: 100%;
	height: auto;
	text-align: left;
	font-size: 7.2rem;
	line-height: 1.2em;
	text-transform: uppercase;
	font-weight: 900;
}
.kv_title .grandient_text {
	color: #01B5FF;
	background: -webkit-linear-gradient(0deg, #01B5FF, #6048FF 100%);
  	-webkit-background-clip: text;
  	-webkit-text-fill-color: transparent;
  	font-size: 1.2em;
  	line-height: 1.1em;
    display: block;
}
.kv_title_mini {
	display: block;
	width: 80%;
	height: auto;
	text-align: left;
	font-size: 4.5rem;
	line-height: 1.2em;
	font-weight: 400;
	margin-top: 8rem;
}
.kv_title_mini span {
	text-transform: uppercase;
	font-weight: 700;
}
.kv_button {
	font-size: 4.8em;
	margin: 12.8rem auto 0;
}
.kv_image_container {
	display: block;
	width: 100%;
	height: auto;
	margin-top: 15rem;
	position: relative;
}
.kv_image_item {
	display: block;
	position: absolute;
	z-index: 1;
}
.kv_image_item img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.color_round {
	background-image: linear-gradient(89.84deg, #00B6FF 0.11%, #6D39FF 99.84%);
	border-radius: 50%;
}
.color_round:before {
	content: '';
	display: block;
	width: 55%;
	height: 55%;
	background-color: #FFFFFF;
	border-radius: 50%;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	margin: auto;
}
.round_1 {
	width: 47.2rem;
	height: 47.2rem;
	top: 6rem;
    left: 6rem;
}
.round_2 {
	width: 17.8rem;
    height: 17.8rem;
    top: 97rem;
    left: 70rem;
}
.kv_phone {
	width: 100%;
	position: relative;
	height: 124rem;
	filter: drop-shadow(1px 3px 7px rgba(0, 0, 0, 0.25)) drop-shadow(6px 5px 47px rgba(0, 0, 0, 0.15));
}
.kv_phone img {
	display: block;
	width: 100%;
	height: auto;
	position: absolute;
	top: 0;
	left: 0;
}
.phone_1 {
	animation: kv_phone 4s linear infinite;
}
.phone_2 {
	animation: kv_phone 4s linear infinite;
	animation-delay: 2s;
}
@keyframes kv_phone {
	0% {
		opacity: 0;
	}
	49% {
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		opacity: 1;
	}
}

/*----------main end----------*/

/*----------footer start----------*/

.standard_footer {
	display: flex;
	flex-direction: row;
	justify-content: center;
	flex-wrap: wrap;
	width: 100%;
	height: auto;
	margin-top: 12rem;
	padding: 0 5rem 8rem;
	box-sizing: border-box;
}
.footer_link {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	width: 50%;
	height: auto;
	color: #3C3C46;
	font-size: 4.3rem;
	line-height: 1.1em;
	text-decoration: none;
	cursor: pointer;
	font-weight: 700;
	margin-top: 3.4rem;
}
.phone_link {
	justify-content: center;
	width: 100%;
}
.mail_link {
	justify-content: flex-end;
}
.footer_link img {
	display: block;
	width: 8rem;
	margin-right: 3rem;
}

/*----------footer end----------*/

@media screen and (min-aspect-ratio: 4/3) {

	/*----------common start----------*/

	html {
		font-size: 10px;
	}
	.desktop {
		display: block;
	}
	.mobile {
		display: none;
	}
	.standard_section {
		padding: 0 10%;
	}
.standard_button {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	font-size: 2rem;
	line-height: 1em;
	cursor: pointer;
	color: #FFFFFF;
	font-weight: 700;
	font-family: 'Montserrat', 'Roboto', sans-serif;
	border: none;
	outline: none;
	border-radius: .5em;
	box-shadow: 0 0 1.5em .25em rgba(3, 178, 255, 0.15);
	background-color: #01B5FF;
	background-image: linear-gradient(89.84deg, #00B6FF 0.11%, #6D39FF 99.84%);
	padding: 1.1em 5em 1em;
	box-sizing: border-box;
	transition: transform .4s ease;
}

	/*----------common end----------*/

	/*----------header start----------*/

	.standard_header {
		left: 9.8rem;
		top: 3.6rem;
	}
	.header_roll_container {
		width: 8rem;
		height: 8rem;
	}
	.header_dynamic_container {
		margin-left: 1.8rem;
	}
	.header_dynamic_title {
		font-size: 4.7rem;
	}
	.header_dynamic_title_mini {
	    font-size: 2.2rem;
	    margin-top: .2rem;
	}
	.header_dynamic_link {
		font-size: .9rem;
	}

	/*----------header end----------*/

	/*----------main start----------*/

	.kv_section {
		padding-top: 0;
	}
	.kv_info_container {
		position: relative;
		z-index: 2;
		padding-top: 28.4rem;
	}
	.kv_title {
		font-size: 4.8rem;
	}
	.kv_title_mini {
		width: 35%;
		font-size: 2.4rem;
		line-height: 1.6em;
		font-weight: 400;
		margin-top: 6rem;
	}
	.kv_button {
		font-size: 2.4em;
		margin: 7rem 0 0;
	}
	.kv_image_container {
		position: absolute;
		height: 100vh;
		top: 0;
		left: 0;
		z-index: 1;
		margin-top: 0;
		overflow: hidden;
	}
	.big_square {
		width: 84.6rem;
		height: 84.6rem;
		background: linear-gradient(89.84deg, #00B6FF 0.11%, #6D39FF 99.84%);
		border-radius: 15rem;
		transform: rotate(29.04deg);
		top: -13.5rem;
    	right: -7.5rem;
	}
	.round_1 {
		width: 20.3rem;
		height: 20.3rem;
		top: 1.55rem;
	    left: auto;
	    right: 66.7rem;
	}
	.round_2 {
		width: 8.8rem;
	    height: 8.8rem;
	    top: 60rem;
	    left: auto;
	    right: 78.3rem;
	}
	.kv_phone {
		height: auto;
		width: 49.7rem;
		position: absolute;
		top: 15rem;
		right: 21.5rem;
	}
	.white_round {
		background-image: url(../img/ellipse_white.png);
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
	}
	.round_3 {
		width: 4.7rem;
		height: 4.7rem;
		top: 27.3rem;
		right: 62.2rem;
	}
	.round_4 {
		width: 9.5rem;
		height: 9.5rem;
		top: 4.7rem;
		right: 8.8rem;
	}
	.round_5 {
		width: 2.6rem;
		height: 2.6rem;
		top: 47.1rem;
		right: 10.5rem;
	}
	.round_6 {
		width: 5.4rem;
		height: 5.4rem;
		top: 64.8rem;
		right: 22.1rem;
	}

	/*----------main end----------*/

	/*----------footer start----------*/

	.standard_footer {
		justify-content: flex-start;
		flex-wrap: nowrap;
		margin-top: 8rem;
		padding: 0 10% 1rem;
	    position: relative;
    	z-index: 2;
	}
	.footer_link {
		width: auto;
		font-size: 1.8rem;
		margin-top: 0;
		margin-right: 9.9rem;
	}
	.footer_link.desktop {
		display: flex !important;
	}
	.phone_link {
		justify-content: flex-start;
		width: auto;
	}
	.mail_link {
		justify-content: flex-start;
	}
.footer_link img {
	width: 3rem;
	margin-right: 2rem;
}

/*----------footer end----------*/

}

@media screen and (max-width: 1800px) and (min-width: 1080px) {
	html {
		font-size: .5vw;
	}
}