
.edit_here
{
	/* TODO:edit here */

}

.top_content
{
	width: 100% !important;
	height: 100vh !important;
	position: relative !important;
	left: 0px !important;
	background: linear-gradient(to bottom, rgba(115, 27, 236, 0.0), rgba(115, 27, 236, 0.05)) !important;
	transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 1740px)
{
	.top_content
	{
		height: 1000px !important;
	}
}

@media screen and (max-width: 1400px)
{
	.top_content
	{
		height: 800px !important;
	}
}

@media screen and (max-width: 1070px)
{
	.top_content
	{
		height: 652px !important;
	}
}

@media screen and (max-width: 890px)
{
	.top_content
	{
		height: 590px !important;
	}
}

@media screen and (max-width: 570px)
{
	.top_content
	{
		height: 460px !important;
	}
}

.font_main
{
	color: #731BEC !important;
	width: 100% !important;
	height: auto !important;
	position: relative !important;
	display: block !important;
	font-size: 54px !important;
	font-weight: bold !important;
	max-width: 580px !important;
	padding-left: 80px !important;
	padding-bottom: 40px !important;
	word-break: keep-all !important;
	white-space: normal !important;
	transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 1740px) {
  .font_main {
    padding-bottom: 28px !important;
  }
}

@media screen and (max-width: 1400px) {
  .font_main {
    padding-bottom: 20px !important;
  }
}

@media screen and (max-width: 1070px) {
  .font_main {
    font-size: 36px !important;
	padding-left: 5vw !important;
	padding-bottom: 20px !important;
	max-width: 315px !important;
  }
}

@media screen and (max-width: 719px) {
  .font_main {
    font-size: 24px !important;
	padding-left: 3vw !important;
	max-width: 215px !important;
  }
}

@media screen and (max-width: 570px) {
  .font_main {
	padding-left: 3vw !important;
	padding-bottom: 10px !important;
	max-width: 215px !important;
  }
}

.font_basic_main
{
	color: #161616 !important;
	width: 100% !important;
	height: auto !important;
	position: relative !important;
	display: block !important;
	font-size: 54px !important;
	font-weight: bold !important;
	padding-left: 80px !important;
	max-width: 450px !important;
	word-break: keep-all !important;
	white-space: normal !important;
	transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 1070px) {
  .font_basic_main {
	padding-left: 5vw !important;
    font-size: 36px !important;
  }
}

@media screen and (max-width: 719px) {
  .font_basic_main {
	padding-left: 3vw !important;
    font-size: 24px !important;
  }
}

.font_sub
{
	width: 100% !important;
	height: auto !important;
	position: relative !important;
	display: block !important;
	font-size: 24px !important;
	font-weight: 500 !important;
	padding-left: 80px !important;
	max-width: 720px !important;
	margin-bottom: 5px !important;
	color: #161616 !important;
	word-break: keep-all !important;
	white-space: normal !important;
	transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 1070px) {
  .font_sub {
	padding-left: 5vw !important;
    font-size: 20px !important;
  }
}

@media screen and (max-width: 719px) {
  .font_sub {
	padding-left: 3vw !important;
    font-size: 16px !important;
	margin-bottom: 8px !important;
  }
}

.content1_bg
{
	width: 100% !important;
	height: 240px !important;
	position: relative !important;
	display: flex !important;
	left: 0px !important;
	align-items: center !important;
	background-color: #C08FFF !important;
}

@media screen and (max-width: 1070px)
{
    .content1_bg
    {
        height: 220px !important;
    }
}

@media screen and (max-width: 719px)
{
    .content1_bg
    {
        height: 154px !important;
    }
}

.content1_font
{
    width: 100% !important;
    height: auto !important;
    position: relative !important;
    display: block !important;
    margin: 0 auto !important;
    text-align: center !important;
    font-size: 24px !important;
    max-width: 1100px !important;
    word-break: keep-all !important;
	white-space: normal !important;
    color: white !important;
    transition: all 100ms ease-in-out !important;
	line-height: 1.3em !important;
}

@media screen and (max-width: 1070px)
{
    .content1_font
    {
        font-size: 20px !important;
    }
}

@media screen and (max-width: 719px)
{
    .content1_font
    {
        font-size: 16px !important;
    }
}

.content2_font
{
    width: 100% !important;
    height: auto !important;
    position: relative !important;
    display: block !important;
    margin: 0 auto !important;
    text-align: center !important;
    font-size: 54px !important;
    font-weight: bold !important;
    word-break: keep-all !important;
	white-space: normal !important;
    max-width: 710px !important;
    padding-bottom: 40px !important;
    transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 1070px)
{
    .content2_font{
        font-size: 36px !important;
        padding-bottom: 20px !important;
        max-width: 415px !important;
    }
}

@media screen and (max-width: 719px)
{
    .content2_font
    {
        font-size: 24px !important;
        max-width: 300px !important;
    }
}

.content2_subfont
{
    width: 100% !important;
    height: auto !important;
    position: relative !important;
    display: block !important;
    margin: 0 auto !important;
    text-align: center !important;
    font-size: 24px !important;
    max-width: 980px !important;
	font-weight: 500 !important;
    word-break: keep-all !important;
	white-space: normal !important;
    color: #666666 !important;
    transition: all 100ms ease-in-out !important;
	line-height: 1.2em !important;
}

@media screen and (max-width: 1070px)
{
    .content2_subfont
    {
        font-size: 20px !important;
    }
}

@media screen and (max-width: 719px)
{
    .content2_subfont
    {
        font-size: 16px !important;
    }
}

.content3_subfont
{
    width: 100% !important;
    height: auto !important;
    position: relative !important;
    display: block !important;
    margin: 0 auto !important;
    text-align: center !important;
    font-size: 24px !important;
    max-width: 1120px !important;
    padding-bottom: 40px !important;
	font-weight: 500 !important;
    word-break: keep-all !important;
	white-space: normal !important;
    color: #666666 !important;
    transition: all 100ms ease-in-out !important;
	line-height: 1.3em !important;
}

@media screen and (max-width: 1070px)
{
    .content3_subfont
    {
        font-size: 20px !important;
        padding-bottom: 20px !important;
    }
}

@media screen and (max-width: 719px)
{
    .content3_subfont
    {
        font-size: 16px !important;
    }
}

.content4_font
{
    width: 100% !important;
    height: auto !important;
    position: relative !important;
    display: block !important;
    margin: 0 auto !important;
    text-align: center !important;
    font-size: 54px !important;
    font-weight: bold !important;
    max-width: 1250px !important;
    word-break: keep-all !important;
	white-space: normal !important;
    padding-bottom: 40px !important;
    transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 1070px)
{
    .content4_font{
        font-size: 36px !important;
        padding-bottom: 20px !important;
        max-width: 415px !important;
    }
}

@media screen and (max-width: 719px)
{
    .content4_font
    {
        font-size: 24px !important;
         max-width: 300px !important;
    }
}

.content4_subfont
{
    width: 100% !important;
    height: auto !important;
    position: relative !important;
    display: block !important;
    margin: 0 auto !important;
    text-align: center !important;
    font-size: 24px !important;
    max-width: 850px !important;
	font-weight: 500 !important;
    padding-bottom: 60px !important;
    word-break: keep-all !important;
	white-space: normal !important;
    color: #666666 !important;
    transition: all 100ms ease-in-out !important;
	line-height: 1.3em !important;
}

@media screen and (max-width: 1070px)
{
    .content4_subfont
    {
        font-size: 20px !important;
        padding-bottom: 40px !important;
    }
}

@media screen and (max-width: 719px)
{
    .content4_subfont
    {
        font-size: 16px !important;
		padding-bottom: 40px !important;
    }
}

@media screen and (max-width: 570px)
{
    .content4_subfont
    {
        font-size: 16px !important;
		padding-bottom: 25px !important;
    }
}

.content3_img
{
	position: relative !important;
	display: flex !important;
	width: 100% !important;
	height: 870px !important;
	justify-content: center !important;
}

@media screen and (max-width: 1400px)
{
	.content3_img
	{
		height: 800px !important;
	}
}

@media screen and (max-width: 1070px)
{
	.content3_img
	{
		height: 649px !important;
	}
}

@media screen and (max-width: 890px)
{
	.content3_img
	{
		height: 600px !important;
	}
}


@media screen and (max-width: 718px)
{
	.content3_img
	{
		height: 500px !important;
	}
}

@media screen and (max-width: 570px)
{
	.content3_img
	{
		height: 480px !important;
	}
}

.content4_img
{
	position: relative !important;
	display: block !important;
	width: 100% !important;
	height: 30vw !important;
}

@media screen and (max-width: 900px)
{
	.content4_img
	{
		height: auto !important;
	}
}

@media screen and (max-width: 570px)
{
	.content4_img
	{
		height: auto !important;
	}
}

.content2_img
{
	position: relative !important;
	width: 100% !important;
	height: 904px !important;
	background: linear-gradient(270deg, rgba(115, 27, 236, 0) 0%, rgba(115, 27, 236, 0.1) 50%, rgba(115, 27, 236, 0) 100%) !important;
	padding: 0 1vw !important;
	display: flex !important;
	max-width: 2200px !important;
	margin: 0 auto !important;
}

@media screen and (max-width: 1740px)
{
	.content2_img
	{
		height: 890px !important;
	}
}

@media screen and (max-width: 1400px)
{
	.content2_img
	{
		height: 760px !important;
	}
} 

@media screen and (max-width: 1070px)
{
	.content2_img
	{
		height: 680px !important;
		padding: 0 4vw !important;
	}
}

@media screen and (max-width: 718px)
{
	.content2_img
	{
		height: 530px !important;
	}
}

@media screen and (max-width: 570px)
{
	.content2_img
	{
		height: 400px !important;
	}
}

.content5_bg
{
	width: 100% !important;
	height: auto !important;
	position: relative !important;
	display: block !important;
	background: linear-gradient(to bottom, rgba(115, 27, 236, 1), rgba(120, 54, 210, 1)) !important;
	padding: 4vh 2vw 0 2vw !important;
	box-sizing: border-box !important;
	border-radius: 50px !important;
}

@media screen and (max-width: 1470px)
{
	.content5_bg
	{
		padding: 3vh 2vw 0 2vw !important;
	}
}

@media screen and (max-width: 1200px)
{
	.content5_bg
	{
		padding: 2.5vh 2vw 0 2vw !important;
		border-radius: 40px !important;
	}
}

@media screen and (max-width: 836px)
{
	.content5_bg
	{
		padding: 2.5vh 3vw 0 3vw !important;
		border-radius: 46px !important;
		margin-top: 3vh !important;
	}
}

@media screen and (max-width: 570px)
{
	.content5_bg
	{
		border-radius: 40px !important;
		padding: 2vh 3vw 0 4vw !important;
		margin-top: 2vh !important;
	}
}

.content5_sub
{
	width: 100% !important;
	height: auto !important;
	position: relative !important;
	display: block !important;
	font-size: 24px !important;
	font-weight: 500 !important;
	max-width: 410px !important;
	color: white !important;
	word-break: keep-all !important;
	white-space: normal !important;
	transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 1200px)
{
	.content5_sub
	{
		font-size: 22px !important;
	}
}

@media screen and (max-width: 1070px)
{
    .content5_sub{
        font-size: 20px !important;
    }
}

@media screen and (max-width: 719px)
{
    .content5_sub
    {
        font-size: 16px !important;
    }
}

@media screen and (max-width: 570px)
{
    .content5_sub
    {
        font-size: 13px !important;
    }
}

.content5_bot
{
	width: 100% !important;
	height: 726px !important;
	border-radius: 50px !important;
	position: relative !important;
	display: block !important;
	padding: 4vh 2.4vw 0 2.4vw !important;
}

@media screen and (max-width: 1740px)
{
	.content5_bot
	{
		height: 702px !important;
		padding: 2.9vh 1.5vw 0 2.4vw !important;
	}
}

@media screen and (max-width: 1470px)
{
	.content5_bot
	{
		border-radius: 40px !important;
		padding: 2.9vh 1.5vw 0 2.4vw !important;
	}
}

@media screen and (max-width: 1200px)
{
	.content5_bot
	{
		margin-top: 0px !important;
	}
}

@media screen and (max-width: 1070px)
{
	.content5_bot
	{
		margin-top: 0px !important;
		height: auto !important;
	}
}

.content5_title
{
	width: 100% !important;
    height: auto !important;
    position: relative !important;
    display: block !important;
    margin: 0 auto !important;
    text-align: left !important;
    font-size: 32px !important;
    font-weight: bold !important;
    padding-bottom: 10px !important;
    transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 1200px)
{
	.content5_title
	{
		font-size: 28px !important;
	}
}

@media screen and (max-width: 1070px)
{
    .content5_title{
        font-size: 24px !important;
    }
}

@media screen and (max-width: 890px)
{
    .content5_title
    {
        font-size: 22px !important;
    }
}

.content5_csub
{
	width: 100% !important;
    height: auto !important;
    position: relative !important;
    display: block !important;
    margin: 0 auto !important;
    text-align: left !important;
    font-size: 24px !important;
    font-weight: 500 !important;
	padding-bottom: 40px !important;
    color: #666666 !important;
    transition: all 100ms ease-in-out !important;
	line-height: 1.2em !important;
}

@media screen and (max-width: 1740px)
{
	.content5_csub
	{
		padding-bottom: 30px !important;
	}
}

@media screen and (max-width: 1200px)
{
	.content5_csub
	{
		font-size: 22px !important;
		padding-bottom: 20px !important;
	}
}

@media screen and (max-width: 1070px)
{
    .content5_csub{
        font-size: 17px !important;
    }
}

.logo_size
{
	width: 80px !important;
	height: 80px !important;
	position: relative !important;
	margin-left: 80px !important;
	margin-bottom: 50px !important;
}

@media screen and (max-width: 1740px)
{
	.logo_size
	{
		margin-bottom: 36px !important;
	}
}

@media screen and (max-width: 1400px)
{
	.logo_size
	{
		margin-bottom: 26px !important;
	}
}

@media screen and (max-width: 1070px)
{
	.logo_size
	{
		width: 60px !important;
		height: 60px !important;
		margin-left: 5vw !important;
		margin-bottom: 17px !important;
	}
}

@media screen and (max-width: 719px)
{
	.logo_size
	{
		width: 48px !important;
		height: 48px !important;
		margin-left: 2vw !important;
		margin-bottom: 7px !important;
	}
}

.top_left
{
	height: 60% !important;
}

@media screen and (max-width: 1740px)
{
	.top_left
	{
		height: 70% !important;
	}
}

@media screen and (max-width: 1400px)
{
	.top_left
	{
		height: 74% !important;
	}
}

@media screen and (max-width: 719px)
{
	.top_left
	{
		height: 65% !important;
	}
}

@media screen and (max-width: 570px)
{
	.top_left
	{
		height: 72% !important;
	}
}

@media screen and (max-width: 420px)
{
	.top_left
	{
		height: 64% !important;
	}
}

.top_right
{
	width: 100% !important;
    height: 100% !important;
    position: absolute !important;
    display: block !important;
    top: 0px !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: right !important;
    left: 0px !important;
}

@media screen and (max-width: 890px) 
{
	.top_right
	{
		background-image: url("../../Assets/Moja/700_MOJA.png") !important;
		background-size: auto 100% !important;
	}
}

@media screen and (max-width: 570px)
{
	.top_right
	{
		background-image: url("../../Assets/Moja/500_MOJA.png") !important;
	}
}

@media screen and (max-width: 417px)
{
	.top_right
	{
		background-image: url("../../Assets/Moja/500_MOJA.png") !important;
	}
}

.top_body
{
	width: 40% !important;
	height: 100% !important;
	position: absolute !important;
	display: block !important;
	z-index: 11 !important;
}

@media screen and (max-width: 890px)
{
    .top_body
    {
        width: 50% !important;
    }
}

@media screen and (max-width: 420px)
{
    .top_body
    {
        width: 56% !important;
    }
}

.content5_left
{
	width: 100% !important;
	height: auto !important;
	position: relative !important;
	left: 0px !important;
	background-color: rgba(0, 0, 0, 0) !important;
	display: flex !important;
	transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 1200px) {
  .content5_left {
    display: none !important;
  }
}

.content5_all
{
	width: 100% !important;
	height: auto !important;
	position: relative !important;
	background-color: rgba(0, 0, 0, 0) !important;
	display: block !important;
	margin-right: 20px !important;
	flex: 1 1 0% !important;
	box-sizing: border-box !important;
	left: 0px !important;
	transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 900px) {
  .content5_all {
    display: none !important;
  }
}

.content5_left2
{
	display: block !important;
	margin-left: 30px !important;
	transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 1630px) {
  .content5_left2 {
    margin-left: 10px !important;
  }
}

@media screen and (max-width: 1400px) {
  .content5_left2 {
    display: none !important;
  }
}

.content5_img1
{
	height: 400px !important;
	border-radius: 50px !important;
	transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 1740px)
{
	.content5_img1
	{
		height: 360px !important;
	}
}

@media screen and (max-width: 1400px)
{
	.content5_img1
	{
		height: 220px !important;
		border-radius: 40px !important;
	}
}

.content5_btn
{
	padding: 0.5vw 0.7vw !important;
	font-size: 24px !important;
	border-radius: 100px !important;
}

.gobtn{

}

.gobtn:hover
{
	background-color: #E4E4E4 !important;
}

.mjclicked
{
	background-color: rgb(191,191,191) !important;
}

@media screen and (max-width: 1450px)
{
    .content5_btn{
        font-size: 22px !important;
    }
}

@media screen and (max-width: 1070px)
{
    .content5_btn{
		padding: 0.5vw 0.7vw !important;
        font-size: 18px !important;
    }
}

@media screen and (max-width: 750px)
{
    .content5_btn
    {
		padding: 1.2vw 1.5vw !important;
        font-size: 16px !important;
    }
}

@media screen and (max-width: 570px)
{
	.content5_btn
	{
		padding: 1.5vw 2vw !important;
		font-size: 13px !important;
	}
}

.content5_logo
{
	width: 80px !important;
	height: 80px !important;
}

@media screen and (max-width: 1200px)
{
	.content5_logo
	{
		width: 70px !important;
		height: 70px !important;
	}
}

@media screen and (max-width: 1070px)
{
	.content5_logo
	{
		width: 50px !important;
		height: 50px !important;
	}
}

@media screen and (max-width: 570px)
{
	.content5_logo
	{
		width: 30px !important;
		height: 30px !important;
	}
}

.content5_img2
{
	background-size: contain !important;
	background-position: center center !important;
	height: 90% !important;
}

/* @media screen and (max-width: 1740px)
{
	.content5_img2
	{
		height: 930px !important;
	}
}

@media screen and (max-width: 1400px)
{
	.content5_img2
	{
		height: 800px !important;
	}
}

@media screen and (max-width: 1200px)
{
	.content5_img2
	{
		height: 500px !important;
	}
} */

@media screen and (max-width: 900px)
{
	.content5_img2
	{
		height: 600px !important;
	}
}

@media screen and (max-width: 570px)
{
	.content5_img2
	{
		background-size: 100% auto !important;
		background-position: top center !important;
		height: 340px !important;
		overflow: hidden !important;
	}
}

.content5_left3
{
	display: block !important;
	margin-left: 55px !important;
	transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 1630px) {
  .content5_left3 {
    margin-left: 20px !important;
  }
}

@media screen and (max-width: 1070px) {
  .content5_left3 {
    display: none !important;
  }
}

.content5_left4
{
	width: 222px !important;
	height: auto !important;
}

@media screen and (max-width: 1070px) {
  .content5_left4 {
	background-image: url("../../Assets/Moja/one_phone.png") !important;
	width: 40vw !important;
	height: 460px !important;
	background-size: contain !important;
	background-position: center top !important;
  }
}

@media screen and (max-width: 890px) {
  .content5_left4 {
	background-image: url("../../Assets/Moja/one_phone.png") !important;
	width: 40vw !important;
	height: 390px !important;
	background-size: contain !important;
	background-position: center top !important;
  }
}

.content2_body
{
	font-size: 24px !important;
	background-color: #C08FFF !important;
	color: white !important;
	padding: 0.8vw 1vw !important;
	border-radius: 5vw !important;
	margin-bottom: 1.5vw !important;
}

@media screen and (max-width: 1400px)
{
	.content2_body
	{
		font-size: 20px !important;
	}
}

@media screen and (max-width: 1200px)
{
	.content2_body
	{
		padding: 0.8vw 0.7vw !important;
	}
}

.body_none
{
	display: flex !important;
	padding-right: 0.3vw !important;
}

@media screen and (max-width: 1070px)
{
	.body_none
	{
		display: none !important;
	}
}

.arrow_left
{
	position: relative !important;
	display: block !important;
	width: 100% !important;
	height: 10px !important;
	padding-bottom: 1.5vw !important;
	margin-left: 0.8vw !important;
}

.arrow_left::before {
  content: "" !important;
  position: absolute !important; 
  display: block !important;
  transform: translateY(-50%) !important;
  width: 100% !important;
  height: 2px !important;
  background-image: repeating-linear-gradient(to left, #c084fc 0 6px, transparent 6px 12px) !important;
  -webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 1) 50%, rgba(0,0,0,0)) !important;
          mask-image: linear-gradient(to right, rgba(0, 0, 0, 1) 50%, rgba(0,0,0,0)) !important;
}

.arrow_left::after {
  content: "" !important;
  position: absolute !important;
  left: -1px !important;
  transform: translateY(-50%) rotate(180deg) !important;
  width: 0 !important;
  height: 0 !important;
  border-top: 5px solid transparent !important;
  border-bottom: 5px solid transparent !important;
  border-left: 7px solid #C08FFF !important;
}

.body_font
{
	font-size: 28px !important;
	transition: all 100ms ease-in-out !important;
}

@media screen and (max-width: 1070px)
{
	.body_font
	{
		font-size: 24px !important;
	}
}

@media screen and (max-width: 800px)
{
	.body_font
	{
		font-size: 22px !important;
	}
}

@media screen and (max-width: 570px)
{
	.body_font
	{
		font-size: 16px !important;
	}
}

@media screen and (max-width: 415px)
{
	.body_font
	{
		font-size: 14px !important;
	}
}

.body_subfont
{
	width: 25% !important;
	font-size: 24px !important;
	transition: all 100ms ease-in-out !important;
	z-index: 3 !important;
}

@media screen and (max-width: 1200px)
{
	.body_subfont
	{
		font-size: 22px !important;
	}
}

@media screen and (max-width: 1070px)
{
	.body_subfont
	{
		width: 30% !important;
		font-size: 18px !important;
	}
}

@media screen and (max-width: 800px)
{
	.body_subfont
	{
		font-size: 17px !important;
	}
}

@media screen and (max-width: 570px)
{
	.body_subfont
	{
		font-size: 13px !important;
	}
}

@media screen and (max-width: 415px)
{
	.body_subfont
	{
		width: 60% !important;
	}
}

.arrow_right
{
	position: relative !important;
	display: block !important;
	width: 100% !important;
	height: 10px !important;
	padding-bottom: 1.5vw !important;
	margin-right: 0.8vw !important;
}

.arrow_right::before {
  content: "" !important;
  position: absolute !important; 
  display: block !important;
  transform: translateY(-50%) !important;
  width: 100% !important;
  height: 2px !important;
  background-image: repeating-linear-gradient(to right, #c084fc 0 6px, transparent 6px 12px) !important;
  -webkit-mask-image: linear-gradient(to left, rgba(0, 0, 0, 1) 50%, rgba(0,0,0,0)) !important;
          mask-image: linear-gradient(to left, rgba(0, 0, 0, 1) 50%, rgba(0,0,0,0)) !important;
}

.arrow_right::after {
  content: "" !important;
  position: absolute !important;
  right: -1px !important;
  transform: translateY(-50%) rotate(180deg) !important;
  width: 0 !important;
  height: 0 !important;
  border-top: 5px solid transparent !important;
  border-bottom: 5px solid transparent !important;
  border-right: 7px solid #C08FFF !important;
}

.body_colorfont
{
	font-size: 20px !important;
}

@media screen and (max-width: 1320px)
{
	.body_colorfont
	{
		left: -5px !important;
	}
}

@media screen and (max-width: 1070px)
{
	.body_colorfont
	{
		font-size: 18px !important;
	}
}

@media screen and (max-width: 820px)
{
	.body_colorfont
	{
		top: 30px !important;
		font-size: 16px !important;
	}
}

@media screen and (max-width: 570px)
{
	.body_colorfont
	{
		top: 53px !important;
		font-size: 13px !important;
	}
}

@media screen and (max-width: 500px)
{
	.body_colorfont
	{
		left: -8px !important;
	}
}

.body_full
{
	width: 60% !important;
}

@media screen and (max-width: 1070px)
{
	.body_full
	{
		width: 100% !important;
	}
}

.body_side
{
	width: 35% !important;
}

@media screen and (max-width: 1070px)
{
	.body_side
	{
		width: 30% !important;
	}
}

.body_center
{
	width: 30% !important;
}

@media screen and (max-width: 1070px)
{
	.body_center
	{
		width: 40% !important;
	}
}

.moja_bg
{
	width: 100% !important;
	height: auto !important;
	padding: 3vh 5vw 0px 5vw !important;
}

@media screen and (max-width: 1200px)
{
	.moja_bg
	{
		height: auto !important;
	}
}

@media screen and (max-width: 835px)
{
	.moja_bg
	{
		height: auto !important;
		padding: 0 5vw !important;
	}
}

.moja_bg2
{
	width: 100% !important;
	height: auto !important;
	padding: 0px 5vw 3vh 5vw !important;
}

@media screen and (max-width: 1200px)
{
	.moja_bg2
	{
		height: auto !important;
	}
}

@media screen and (max-width: 835px)
{
	.moja_bg2
	{
		height: auto !important;
		padding: 0 5vw 30px 5vw !important;
	}
}

.moja_overView
{
    width: auto !important;
    height: auto !important;
    position: relative !important;
    display: block !important;
    margin: 0 auto !important;
    text-align: center !important;
    padding: 0px 0px 40px 0px !important;
    font-size: 24px !important;
    font-weight: bold !important;
    color: #7c44fe !important;
}

@media screen and (max-width: 1024px)
{
    .moja_overView
    {
        font-size: 20px
    }
}

@media screen and (max-width: 750px)
{
    .moja_overView{
        padding: 0px 0px 20px 0px !important;
    }
}

@media screen and (max-width: 500px)
{
    .moja_overView{
		font-size: 16px !important;
    }
}

.plr1vw
{
	padding-right: 1vw !important;
	padding-left: 1vw !important;
}

.arrow {
	position: relative !important;
	width: 90px !important;
	height: 40px !important;
	background: linear-gradient(to right, #a34fff, #EFE8F9) !important; /* 몸통 + 머리까지 이어지는 그라데이션 */
	border-radius: 3vh !important;
	clip-path: polygon(
		0% 50%,     /* 머리 꼭짓점 */
		40% 10%,     /* 머리 윗쪽 */
		40% 30%,    /* 머리와 몸통 연결 위 */
		100% 30%,   /* 몸통 상단 */
		100% 70%,   /* 몸통 하단 */
		40% 70%,    /* 머리와 몸통 연결 아래 */
		40% 90%    /* 머리 아랫쪽 */
	) !important;
}

@media screen and (max-width: 1220px)
{
	.arrow
	{
		clip-path: polygon(
			0% 50%,     /* 머리 꼭짓점 */
			40% 20%,     /* 머리 윗쪽 */
			40% 35%,    /* 머리와 몸통 연결 위 */
			100% 35%,   /* 몸통 상단 */
			100% 65%,   /* 몸통 하단 */
			40% 65%,    /* 머리와 몸통 연결 아래 */
			40% 80%    /* 머리 아랫쪽 */
		) !important;
	}
}

@media screen and (max-width: 740px)
{
	.arrow
	{
		clip-path: polygon(
			0% 50%,     /* 머리 꼭짓점 */
			30% 30%,     /* 머리 윗쪽 */
			30% 40%,    /* 머리와 몸통 연결 위 */
			100% 40%,   /* 몸통 상단 */
			100% 60%,   /* 몸통 하단 */
			30% 60%,    /* 머리와 몸통 연결 아래 */
			30% 70%    /* 머리 아랫쪽 */
		) !important;
	}
}

@media screen and (max-width: 540px)
{
	.arrow
	{
		clip-path: polygon(
			0% 50%,     /* 머리 꼭짓점 */
			30% 40%,     /* 머리 윗쪽 */
			30% 45%,    /* 머리와 몸통 연결 위 */
			100% 45%,   /* 몸통 상단 */
			100% 55%,   /* 몸통 하단 */
			30% 55%,    /* 머리와 몸통 연결 아래 */
			30% 60%    /* 머리 아랫쪽 */
		) !important;
	}
}

.lb_margin
{
	padding: 0 1vw !important;
	bottom: 200px !important;
	max-width: 2200px !important;
	margin: 0 auto !important;
}

@media screen and (max-width: 1830px)
{
	.lb_margin
	{
		bottom: 250px !important;
	}
}

@media screen and (max-width: 1400px)
{
	.lb_margin
	{
		bottom: 200px !important;
	}
}

@media screen and (max-width: 1200px)
{
	.lb_margin
	{
		bottom: 240px !important;
	}
}

@media screen and (max-width: 1070px)
{
	.lb_margin
	{
		padding: 0 4vw !important;
		bottom: 170px !important;
	}
}

@media screen and (max-width: 890px)
{
	.lb_margin
	{
		bottom: 200px !important;
	}
}


@media screen and (max-width: 718px)
{
	.lb_margin
	{
		bottom: 150px !important;
	}
}

@media screen and (max-width: 570px)
{
	.lb_margin
	{
		bottom: 113px !important;
	}
}

.content4_info
{
	width: 100% !important;
	height: 60% !important;
	display: flex !important;
	align-items: flex-end !important;
	justify-content: center !important;
}

@media screen and (max-width: 900px)
{
	.content4_info
	{
		align-items: center !important;
		height: initial !important;
	}
}

.content4_foot
{
	width: 100% !important;
	height: 30% !important;
	max-width: 1300px !important;
	margin: 0 auto !important;
}

@media screen and (max-width: 900px)
{
	.content4_foot
	{
		height: 200px !important;
	}
}

@media screen and (max-width: 570px)
{
	.content4_foot
	{
		height: 160px !important;
	}
}

.info_lbl
{
	background: linear-gradient(90deg, #A76BF9, #7B4DB9) !important;
	color: white !important;
	border-radius: 30px !important;
	padding: 1vw 1vw !important;
	font-size: 24px !important;
}

@media screen and (max-width: 1070px)
{
	.info_lbl
	{
		padding: 1vw 1vw !important;
		font-size: 20px !important;
	}
}

@media screen and (max-width: 719px)
{
	.info_lbl
	{
		font-size: 16px !important;
	}
}

@media screen and (max-width: 900px)
{
	.info_lbl
	{
		max-width: 70% !important;
		border-radius: 20px !important;
		padding: 15px 10px !important;
	}
}

.moja_bg4
{
	width: 100% !important;
	height: auto !important;
	padding: 0px 5vw 3vh 5vw !important;
}

@media screen and (max-width: 900px)
{
	.moja_bg4
	{
		padding: 0px 5vw 0px 5vw !important;
		height: auto !important;
	}
}

.content4_head
{
	width: 100% !important;
	height: 70% !important;
	max-width: 1300px !important;
	margin: 0 auto !important;
}

@media screen and (max-width: 900px)
{
	.content4_head
	{
		height: 770px !important;
	}
}

@media screen and (max-width: 650px)
{
	.content4_head
	{
		height: 700px !important;
	}
}

@media screen and (max-width: 570px)
{
	.content4_head
	{
		height: 600px !important;
	}
}

.content4_arrow
{
	position: relative !important;
	width: 85px !important;
	height: 100% !important;
	background: linear-gradient(to right, #a34fff, white) !important; /* 몸통 + 머리까지 이어지는 그라데이션 */
	border-radius: 3vh !important;
	clip-path: polygon(
		0% 50%,     /* 머리 꼭짓점 */
		40% 10%,     /* 머리 윗쪽 */
		40% 30%,    /* 머리와 몸통 연결 위 */
		100% 30%,   /* 몸통 상단 */
		100% 70%,   /* 몸통 하단 */
		40% 70%,    /* 머리와 몸통 연결 아래 */
		40% 90%    /* 머리 아랫쪽 */
	) !important;
}

@media screen and (max-width: 2000px)
{
	.content4_arrow
	{
		width: 65px !important;
	}
}

@media screen and (max-width: 1400px)
{
	.content4_arrow
	{
		width: 45px !important;
	}
}

@media screen and (max-width: 900px)
{
	.content4_arrow
	{
		width: 50px !important;
		clip-path: polygon(
			0% 50%,     /* 머리 꼭짓점 */
			45% 15%,     /* 머리 윗쪽 */
			45% 34%,    /* 머리와 몸통 연결 위 */
			100% 34%,   /* 몸통 상단 */
			100% 66%,   /* 몸통 하단 */
			45% 66%,    /* 머리와 몸통 연결 아래 */
			45% 85%    /* 머리 아랫쪽 */
		) !important;
	}
}

.content4_circles
{
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	flex-wrap: nowrap !important;
	gap: 0 !important;
	width: 100% !important;
	height: 20vw !important;
	max-height: 370px !important;
}

@media screen and (max-width: 900px)
{
	.content4_circles
	{
		flex-direction: column !important;
		width: auto !important;
		height: 100% !important;
		max-height: none !important;
	}
}

.content4_circle
{
	aspect-ratio: 1 / 1 !important;  /* 자동으로 높이 계산됨 */
	box-shadow: 0 0 0 2px #c98fff !important;
	border-radius: 50% !important;
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	position: relative !important;
	margin-left: -3% !important;  /* 겹치게 만들기, 퍼센트로! */
	background: white !important;
	box-sizing: border-box !important;
}

.content4_circle:first-child {
  	margin-left: 0 !important;
}

@media screen and (max-width: 1400px)
{
	.content4_circle
	{
		max-width: 273px !important;
	}
}

@media screen and (max-width: 900px)
{
	.content4_circle
	{
		max-width: 210px !important;
		margin-top: -23px !important;
		margin-left: 0 !important;
	}

	.content4_circle:first-child {
		margin-top: 0 !important;
	}
}

@media screen and (max-width: 650px)
{
	.content4_circle
	{
		max-width: 192px !important;
	}
}


@media screen and (max-width: 700px)
{
	.content4_circle
	{
		margin-top: -21px !important;
	}
}

@media screen and (max-width: 570px)
{
	.content4_circle
	{
		max-width: 157px  !important;
		margin-top: -16px !important;
	}
}

@media screen and (max-width: 500px)
{
	.content4_circle
	{
		margin-top: -10px !important;
	}
}

.circle_none
{
	width: 50px !important;
	height: 46% !important;
}

@media screen and (max-width: 1700px)
{
	.circle_none
	{
		height: 48% !important;
	}
}

@media screen and (max-width: 1550px)
{
	.circle_none
	{
		height: 50% !important;
	}
}

@media screen and (max-width: 900px)
{
	.circle_none
	{
		height: 50px !important;
		width: 46% !important;
		bottom: 0 !important;
		right: auto !important;
	}
}

@media screen and (max-width: 650px)
{
	.circle_none
	{
		width: 46% !important;
	}
}

@media screen and (max-width: 500px)
{
	.circle_none
	{
		width: 37% !important;
	}
}

.content_title
{
	font-size: 32px !important;
	margin-bottom: 1vw !important;
}

@media screen and (max-width: 1500px)
{
	.content_title
	{
		font-size: 28px !important;
	}
}

@media screen and (max-width: 1200px)
{
	.content_title
	{
		font-size: 22px !important;
		max-width: 84% !important;
	}
}

@media screen and (max-width: 650px)
{
	.content_title
	{
		font-size: 20px !important;
	}
}

@media screen and (max-width: 570px)
{
	.content_title
	{
		font-size: 16px !important;
	}
}

.content_sub
{
	font-size: 24px !important;
	max-width: 300px !important;
}

@media screen and (max-width: 1500px)
{
	.content_sub
	{
		font-size: 20px !important;
		max-width: 230px !important;
	}
}

@media screen and (max-width: 1200px)
{
	.content_sub
	{
		font-size: 17px !important;
		max-width: 87% !important;
	}
}

@media screen and (max-width: 650px)
{
	.content_sub
	{
		font-size: 15px !important;
	}
}

@media screen and (max-width: 570px)
{
	.content_sub
	{
		font-size: 13px !important;
	}
}

.content3_body
{
	max-width: 1280px !important;
	border-radius: 60px !important;
}

@media screen and (max-width: 890px)
{
    .content3_body
    {
        border-radius: 30px !important;
    }
}

.content3_head
{
	height: 85% !important;
}

.content3_foot
{
	height: 15% !important;
	border-bottom-left-radius: 60px !important;
	border-bottom-right-radius: 60px !important;
}

@media screen and (max-width: 890px)
{
    .content3_foot
    {
        border-bottom-left-radius: 30px !important;
		border-bottom-right-radius: 30px !important;
    }
}

.foot_lbl2
{
	font-size: 24px !important;
}

@media screen and (max-width: 1070px)
{
    .foot_lbl2
    {
        font-size: 18px !important;
    }
}

@media screen and (max-width: 720px)
{
    .foot_lbl2
    {
        font-size: 16px !important;
    }
}

@media screen and (max-width: 620px)
{
    .foot_lbl2
    {
        font-size: 14px !important;
		max-width: 90% !important;
		text-align: center !important;
    }
}

.foot_lbl
{
	font-size: 16px !important;
}

@media screen and (max-width: 1070px)
{
    .foot_lbl
    {
        font-size: 13px !important;
    }
}

@media screen and (max-width: 620px)
{
    .foot_lbl
    {
        font-size: 11px !important;
    }
}

.circle_img
{
	background: 
		url('../../Assets/Moja/page_nm2.png') center/68% 13% no-repeat, 
		linear-gradient(135deg, rgb(164, 98, 255) 0%, rgb(117, 58, 199) 100%) !important;
}

.content3_lblBox
{
	font-size: 24px !important;
	color: #161616 !important;
	background-color: white !important;
	padding: 16px 48px !important;
	border-radius: 100px !important;
	box-shadow: 0 0 12px rgba(92, 92, 92, 0.2) !important;
}

@media screen and (max-width: 1070px)
{
    .content3_lblBox
    {
        font-size: 18px !important;
		padding: 14px 38px !important;
    }
}

@media screen and (max-width: 720px)
{
    .content3_lblBox
    {
        font-size: 16px !important;
		padding: 10px 30px !important;
    }
}

@media screen and (max-width: 620px)
{
    .content3_lblBox
    {
        font-size: 14px !important;
		padding: 10px 30px !important;
    }
}

@media screen and (max-width: 520px)
{
    .content3_lblBox
    {
		padding: 7px 13px !important;
    }
}

.content3_lbl
{
	font-size: 22px !important;
}

@media screen and (max-width: 1070px)
{
    .content3_lbl
    {
        font-size: 16px !important;
    }
}

@media screen and (max-width: 720px)
{
    .content3_lbl
    {
        font-size: 14px !important;
    }
}

@media screen and (max-width: 620px)
{
    .content3_lbl
    {
        font-size: 12px !important;
    }
}

.content3_arrow
{
	width: 80% !important;
	height: 2px !important;
	margin: 0 auto !important;
}

.content3_arrow::before {
  content: "" !important;
  position: absolute !important; 
  display: block !important;
  transform: translateY(-50%) !important;
  width: 100% !important;
  height: 2px !important;
  background-image: repeating-linear-gradient(to left, #c084fc 0 6px, transparent 6px 12px) !important;
  -webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 1) 50%, rgba(0,0,0,0)) !important;
          mask-image: linear-gradient(to right, rgba(0, 0, 0, 1) 50%, rgba(0,0,0,0)) !important;
}

.content3_arrow::after {
  content: "" !important;
  position: absolute !important;
  left: -1px !important;
  transform: translateY(-50%) rotate(180deg) !important;
  width: 0 !important;
  height: 0 !important;
  border-top: 5px solid transparent !important;
  border-bottom: 5px solid transparent !important;
  border-left: 7px solid #C08FFF !important;
}

@media screen and (max-width: 520px)
{
    .content3_arrow::after {
		content: "" !important;
		position: absolute !important;
		left: -1px !important;
		transform: translateY(-50%) rotate(180deg) !important;
		width: 0 !important;
		height: 0 !important;
		border-top: 4px solid transparent !important;
		border-bottom: 4px solid transparent !important;
		border-left: 5px solid #C08FFF !important;
	}
}

.content3_arrow2
{
	width: 80% !important;
	height: 2px !important;
	margin: 0 auto !important;
	transform: rotate(180deg) !important;
}

.content3_arrow2::before {
  content: "" !important;
  position: absolute !important; 
  display: block !important;
  transform: translateY(-50%) !important;
  width: 100% !important;
  height: 2px !important;
  background-image: repeating-linear-gradient(to left, #5B5A63 0 6px, transparent 6px 12px) !important;
  -webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 1) 50%, rgba(0,0,0,0)) !important;
          mask-image: linear-gradient(to right, rgba(0, 0, 0, 1) 50%, rgba(0,0,0,0)) !important;
}

.content3_arrow2::after {
  content: "" !important;
  position: absolute !important;
  left: -1px !important;
  transform: translateY(-50%) rotate(180deg) !important;
  width: 0 !important;
  height: 0 !important;
  border-top: 5px solid transparent !important;
  border-bottom: 5px solid transparent !important;
  border-left: 7px solid #5B5A63 !important;
}

@media screen and (max-width: 520px)
{
    .content3_arrow2::after {
		content: "" !important;
		position: absolute !important;
		left: -1px !important;
		transform: translateY(-50%) rotate(180deg) !important;
		width: 0 !important;
		height: 0 !important;
		border-top: 4px solid transparent !important;
		border-bottom: 4px solid transparent !important;
		border-left: 5px solid #5B5A63 !important;
	}
}

.content3_all
{
	width: 832px !important;
}

@media screen and (max-width: 1070px)
{
    .content3_all
    {
        width: 600px !important;
    }
}

@media screen and (max-width: 720px)
{
    .content3_all
    {
        width: 500px !important;
    }
}

@media screen and (max-width: 620px)
{
    .content3_all
    {
        width: 455px !important;
    }
}

@media screen and (max-width: 520px)
{
    .content3_all
    {
        width: 310px !important;
    }
}

.mini_box
{
	width: 80% !important;
	height: 75% !important;
	border-radius: 20px !important;
}

@media screen and (max-width: 720px)
{
    .mini_box
    {
        height: 80% !important;
		border-radius: 15px !important;
    }
}

@media screen and (max-width: 520px)
{
    .mini_box
    {
        width: 100% !important;
		height: 90% !important;
    }
}

.mini_head
{
	height: 25% !important;
	border-top-left-radius: 20px !important;
	border-top-right-radius: 20px !important;
}

@media screen and (max-width: 720px)
{
    .mini_head
    {
		border-top-left-radius: 15px !important;
		border-top-right-radius: 15px !important;
    }
}

.content3_all2
{
	width: 742px !important;
}

@media screen and (max-width: 1070px)
{
    .content3_all2
    {
        width: 565px !important;
    }
}

@media screen and (max-width: 720px)
{
    .content3_all2
    {
        width: 469px !important;
    }
}

@media screen and (max-width: 620px)
{
    .content3_all2
    {
        width: 440px !important;
    }
}

@media screen and (max-width: 520px)
{
    .content3_all2
    {
        width: 310px !important;
    }
}

.content3_bot
{
	content: "" !important;
	position: absolute !important; 
	display: block !important;
	left: 57% !important;
	transform: translate(-50%, 13%) !important;
	width: 2px !important;
	height: 125px !important;
	background-image: repeating-linear-gradient(to bottom, #B5B5B5 0 6px, transparent 6px 12px) !important;
}

.content3_bot:last-of-type::before
{
	content: "" !important;
	position: absolute !important;
	transform: translate(-50%, -50%) rotate(270deg) !important;
	left: 50% !important;
	top: 0 !important;
	width: 0 !important;
	height: 0 !important;
	border-top: 5px solid transparent !important;
	border-bottom: 5px solid transparent !important;
	border-left: 7px solid #B5B5B5 !important;
}

.content3_bot:last-of-type::after
{
	content: "" !important;
	position: absolute !important;
	left: 50% !important;
	transform: translate(-50%, 90%) rotate(90deg) !important;
	bottom: 0 !important;
	width: 0 !important;
	height: 0 !important;
	border-top: 5px solid transparent !important;
	border-bottom: 5px solid transparent !important;
	border-left: 7px solid #B5B5B5 !important;
}

@media screen and (max-width: 1400px)
{
    .content3_bot
    {
		height: 112px !important;
    }
}

@media screen and (max-width: 1070px)
{
    .content3_bot
    {
		height: 90px !important;
    }
}

@media screen and (max-width: 890px)
{
    .content3_bot
    {
		height: 80px !important;
    }
}

@media screen and (max-width: 718px)
{
    .content3_bot
    {
		height: 60px !important;
    }
}

@media screen and (max-width: 570px)
{
    .content3_bot
    {
		transform: translate(-50%, 15%) !important;
		height: 57px !important;
    }
}

@media screen and (max-width: 520px)
{
    .content3_bot
    {
		height: 61px !important;
    }

	.content3_bot:last-of-type::before
	{
		content: "" !important;
		position: absolute !important;
		transform: translate(-50%, -50%) rotate(270deg) !important;
		left: 50% !important;
		top: 0 !important;
		width: 0 !important;
		height: 0 !important;
		border-top: 4px solid transparent !important;
		border-bottom: 4px solid transparent !important;
		border-left: 5px solid #B5B5B5 !important;
	}

	.content3_bot:last-of-type::after
	{
		content: "" !important;
		position: absolute !important;
		left: 50% !important;
		transform: translate(-50%, 90%) rotate(90deg) !important;
		bottom: 0 !important;
		width: 0 !important;
		height: 0 !important;
		border-top: 4px solid transparent !important;
		border-bottom: 4px solid transparent !important;
		border-left: 5px solid #B5B5B5 !important;
	}
}

.content3_arrow3
{
	content: "" !important;
	position: relative !important; 
	display: block !important;
	transform: translateY(-50%) !important;
	top: -60% !important;
	left: -1% !important;
	width: 18% !important;
	height: 2px !important;
	background-image: repeating-linear-gradient(to left, #5B5A63 0 6px, transparent 6px 12px) !important;
}

.content3_arrow3::before
{
	content: "" !important;
	position: absolute !important;
	transform: translateY(-43%) rotate(180deg) !important;
	top: 0 !important;
	width: 0 !important;
	height: 0 !important;
	border-top: 5px solid transparent !important;
	border-bottom: 5px solid transparent !important;
	border-left: 7px solid #5B5A63 !important;
}

.content3_arrow3::after
{
	content: "" !important;
	position: absolute !important;
	transform: translateY(-43%) rotate(360deg) !important;
	right: 0 !important;
	width: 0 !important;
	height: 0 !important;
	border-top: 5px solid transparent !important;
	border-bottom: 5px solid transparent !important;
	border-left: 7px solid #5B5A63 !important;
}

@media screen and (max-width: 520px)
{
    .content3_arrow3
    {
        display: none !important;
    }
}

.mid_box
{
	width: 100% !important;
	height: 75% !important;
	border-radius: 20px !important;
}

@media screen and (max-width: 720px)
{
    .mid_box
    {
        height: 80% !important;
		border-radius: 15px !important;
    }
}

@media screen and (max-width: 520px)
{
    .mid_box
    {
        width: 100% !important;
		height: 90% !important;
    }
}

.diagonal_arrow
{
	width: 230px !important;
	left: 52% !important;
	top: 2% !important;
	transform: rotate(-40deg) !important;
}

@media screen and (max-width: 1400px)
{
    .diagonal_arrow
    {
		left: 52% !important;
		top: 2% !important;
    }
}

@media screen and (max-width: 1070px)
{
    .diagonal_arrow
    {	
		width: 170px !important;
		left: 52% !important;
		top: 2% !important;
    }
}

@media screen and (max-width: 890px)
{
    .diagonal_arrow
    {
		width: 170px !important;
		left: 52% !important;
		top: 1% !important;
    }
}

@media screen and (max-width: 720px)
{
    .diagonal_arrow
    {
		left: 52% !important;
		top: 0% !important;
		width: 144px !important;
		height: 14px !important;
		transform: rotate(-41deg) !important;
    }
}

@media screen and (max-width: 570px)
{
    .diagonal_arrow
    {
		left: 53% !important;
		top: 0% !important;
		width: 128px !important;
    }
}

@media screen and (max-width: 520px)
{
    .diagonal_arrow
    {
		width: 110px !important;
		transform: rotate(-49deg) !important;
		height: 12px !important;
        left: 49% !important;
		top: -3% !important;
    }
}

.arrow_lbl
{
	top: 35px !important;
	right: 11px !important;
}

@media screen and (max-width: 1070px)
{
    .arrow_lbl
    {	
		top: 24px !important;
		right: 4px !important;
    }
}

@media screen and (max-width: 719px)
{
    .arrow_lbl
    {
		top: 23px !important;
		right: -2px !important;
		transform: rotate(221deg) !important;
    }
}

@media screen and (max-width: 520px)
{
    .arrow_lbl
    {
		top: 23px !important;
		right: -12px !important;
		transform: rotate(229deg) !important;
    }
}

.arrow_lbl2
{
	top: 31px !important;
	right: 7px !important;
}

@media screen and (max-width: 1070px)
{
    .arrow_lbl2
    {	
		top: 23px !important;
		right: 4px !important;
    }
}

@media screen and (max-width: 719px)
{
    .arrow_lbl2
    {
		top: 21px !important;
		right: 4px !important;
    }
}

@media screen and (max-width: 620px)
{
    .arrow_lbl2
    {
		top: 19px !important;
		right: 9px !important;
		transform: rotate(41deg) !important;
    }
}

@media screen and (max-width: 570px)
{
    .arrow_lbl2
    {
		top: 18px !important;
		right: -6px !important;
    }
}

@media screen and (max-width: 520px)
{
    .arrow_lbl2
    {
		top: 18px !important;
		right: 5px !important;
		max-width: 50px !important;
		transform: rotate(49deg) !important;
    }
}

.mini_right
{
	width: 42% !important;
}

@media screen and (max-width: 520px)
{
    .mini_right
    {	
		width: 39% !important;
    }
}

.mini_left
{
	width: 50% !important;
}

@media screen and (max-width: 520px)
{
    .mini_left
    {	
		width: 50% !important;
		margin-right: 10px !important;
    }
}

.height_size
{
	height: 75% !important;
}

@media screen and (max-width: 520px)
{
    .height_size
    {	
		height: 50% !important;
    }
}

.left_14px
{
	left: 0 !important;
}

@media screen and (max-width: 520px)
{
    .left_14px
    {
		left: -14px !important;
    }
}

.font_24px
{
	font-size: 24px !important;
}

@media screen and (max-width: 1070px)
{
    .font_24px
    {
        font-size: 18px !important;
    }
}

@media screen and (max-width: 720px)
{
    .font_24px
    {
        font-size: 16px !important;
    }
}

@media screen and (max-width: 620px)
{
    .font_24px
    {
        font-size: 14px !important;
    }
}

.radius_100px
{
	border-radius: 100px !important;
}

@media screen and (max-width: 1070px)
{
    .radius_100px
    {
        border-radius: 60px !important;
    }
}

@media screen and (max-width: 520px)
{
    .radius_100px
    {	
		border-radius: 25px !important;
    }
}

.h3_resize
{
	width: 60px !important;
}

@media screen and (max-width: 620px)
{
    .h3_resize
    {
       width: 40px !important;
    }
}

/* @media screen and (max-width: 520px)
{
    .h3_resize
    {
       width: 30px !important;
    }
} */

.arrow_resize
{
	width: 80% !important;
	height: 2px !important;
	margin: 0 auto !important;
}

.arrow_resize::before {
  content: "" !important;
  position: absolute !important; 
  display: block !important;
  transform: translateY(-50%) !important;
  width: 100% !important;
  height: 2px !important;
  background-image: repeating-linear-gradient(to left, #c084fc 0 6px, transparent 6px 12px) !important;
  -webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 1) 50%, rgba(0,0,0,0)) !important;
          mask-image: linear-gradient(to right, rgba(0, 0, 0, 1) 50%, rgba(0,0,0,0)) !important;
}

.arrow_resize::after {
  content: "" !important;
  position: absolute !important;
  left: -1px !important;
  transform: translateY(-50%) rotate(180deg) !important;
  width: 0 !important;
  height: 0 !important;
  border-top: 5px solid transparent !important;
  border-bottom: 5px solid transparent !important;
  border-left: 7px solid #C08FFF !important;
}

@media screen and (max-width: 520px)
{
    .arrow_resize
    {
        width: 30px !important;
    }

	.arrow_resize::after {
		content: "" !important;
		position: absolute !important;
		left: -1px !important;
		transform: translateY(-50%) rotate(180deg) !important;
		width: 0 !important;
		height: 0 !important;
		border-top: 4px solid transparent !important;
		border-bottom: 4px solid transparent !important;
		border-left: 5px solid #C08FFF !important;
	}
}

.arrow_resize2
{
	width: 80% !important;
	height: 2px !important;
	margin: 0 auto !important;
	transform: rotate(180deg) !important;
}

.arrow_resize2::before {
  content: "" !important;
  position: absolute !important; 
  display: block !important;
  transform: translateY(-50%) !important;
  width: 100% !important;
  height: 2px !important;
  background-image: repeating-linear-gradient(to left, #5B5A63 0 6px, transparent 6px 12px) !important;
  -webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 1) 50%, rgba(0,0,0,0)) !important;
          mask-image: linear-gradient(to right, rgba(0, 0, 0, 1) 50%, rgba(0,0,0,0)) !important;
}

.arrow_resize2::after {
  content: "" !important;
  position: absolute !important;
  left: -1px !important;
  transform: translateY(-50%) rotate(180deg) !important;
  width: 0 !important;
  height: 0 !important;
  border-top: 5px solid transparent !important;
  border-bottom: 5px solid transparent !important;
  border-left: 7px solid #5B5A63 !important;
}

@media screen and (max-width: 520px)
{
    .arrow_resize2
    {
        width: 30px !important;
    }

	.arrow_resize2::after {
		content: "" !important;
		position: absolute !important;
		left: -1px !important;
		transform: translateY(-50%) rotate(180deg) !important;
		width: 0 !important;
		height: 0 !important;
		border-top: 4px solid transparent !important;
		border-bottom: 4px solid transparent !important;
		border-left: 5px solid #5B5A63 !important;
	}
}

.top_blur
{
	width: 0 !important;
}

@media screen and (max-width: 420px)
{
    .top_blur
    {
        width: 100% !important;
    }
}

.num_size
{
	width: 14% !important;
	position: absolute !important;
	top: -18px !important;
	height: 30px !important;
	background-color: rgb(255, 255, 255) !important;
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	z-index: 1 !important;
}

@media screen and (max-width: 900px)
{
    .num_size
    {
        top: 43% !important;
		left: -7% !important;
		height: 14% !important;
    }
}

.circle_border
{
	width: 100% !important;
	position: relative !important;
	left: 0px !important;
	aspect-ratio: 1 / 1 !important;
	background: rgb(255, 255, 255) !important;
	border: 3px solid rgb(192, 143, 255) !important;
	border-radius: 100% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

@media screen and (max-width: 670px)
{
    .circle_border
    {
        border: 2px solid rgb(192, 143, 255) !important;
    }
}

.h3_refoot
{
}

@media screen and (max-width: 520px)
{
    .h3_refoot
    {
        padding-top: 5% !important;
    }
}

.content1_size
{
	width: 100% !important;
	padding: 3vh 5vw !important;
}

@media screen and (max-width: 835px)
{
	.content1_size
	{
		padding: 3vw 5vw !important;
	}
}

