html,
		body {
			font-family: Misans;
		}
        
        .maglmt_index_ui_Swiper-Container {
            position: relative;
            top: 50%;
            transform: translateY(-50%);
        }
        
		.maglmt_pass_index_mainBox {
			overflow: hidden;
			position: absolute;
			left: 50%;
			top: 45%;
			transform: translate(-50%, -50%);
			width: 100%;
			padding: 30px;
			box-sizing: border-box;
			border-radius: 15px;
		}

		.maglmt_pass_index_mainBox .logoBox {
			background-color: var(--themeColor);
			display: inline-block;
			padding: 11px;
			border-radius: 15px;
			margin: 0px 0px 10px 0px;
		}

		.maglmt_pass_index_mainBox .logoBox svg {
			height: 37px;
		}

		.maglmt_pass_index_mainBox .titleBox {
			margin: 3px 0px 0px 0px;
		}

		.maglmt_pass_index_mainBox .titleBox .mainTitle {
			white-space: nowrap;
			font-family: Misans;
			font-weight: 800;
			font-size: 37px;
			padding: 0px 0px 0px 0px;
		}

		.maglmt_pass_index_mainBox .titleBox .mainsSubTitle {
			white-space: nowrap;
			font-family: Misans;
			font-weight: 300;
			font-size: 20px;
			padding: 0px 0px 0px 0px;
		}

		.maglmt_pass_index_mainBox .formBox {
			margin: 10px 0px 0px 0px;
		}

		.maglmt_pass_index_mainBox .formBox input {
			font-family: Misans;
			outline: none;
			border: 1px solid rgba(0, 0, 0, 0.1);
			box-sizing: border-box;
			width: 100%;
			padding: 12px 12px;
			border-radius: 10px;
			margin: 3px 0px 5px 0px;
		}

		.maglmt_pass_index_mainBox .formBox input:focus {
			border: 1px solid var(--themeColor);
			padding: 12px 16px;
		}

		.maglmt_pass_index_mainBox .formBox button {
			font-family: Misans;
			border: none;
			box-sizing: border-box;
			width: 100%;
			padding: 12px 12px;
			border-radius: 10px;
			margin: 30px 0px 0px 0px;
			background-color: var(--themeColor);
			color: white;
			letter-spacing: 5px;
		}

		.maglmt_pass_index_mainBox .formBox .tips {
			color: grey;
			padding: 7px 0px 2px 0px;
			font-size: 10px;
			font-weight: 300;
		}

		.maglmt_pass_index_mainBox .tabBox {
			width: 100%;
			margin: 20px 0px;
			display: flex;
			gap: 10px;
			margin-bottom: 20px;
		}

		.maglmt_pass_index_mainBox .tabBox .tab {
			color: grey;
			padding: 10px 25px;
			border-radius: 5px;
			background-color: #f0f0f0;
			cursor: pointer;
			transition: background-color 0.3s ease;
			text-align: center;
			font-family: Misans;
			font-size: 14px;
		}
		
		.maglmt_pass_index_mainBox .tabBox .tabStyle {
			color: grey;
			padding: 10px 15px;
			border-radius: 5px;
			background-color: #f0f0f0;
			cursor: pointer;
			transition: background-color 0.3s ease;
			text-align: center;
			font-family: Misans;
			font-size: 14px;
			display: flex;
			align-items: center;
		}

		.maglmt_pass_index_mainBox .tabBox .tab:hover {
			background-color: #e0e0e0;
		}

		.maglmt_pass_index_mainBox .tabBox .tab.active {
			background-color: var(--themeColor);
			color: white;
		}

		.maglmt_pass_index_mainBox .contentBox .content {
			display: none;
			opacity: 0;
			visibility: hidden;
			transition: opacity 0.5s ease;
			position: relative;
		}

		.maglmt_pass_index_mainBox .contentBox .content.active {
			display: block;
			opacity: 1;
			visibility: visible;
		}

		@media (prefers-color-scheme: dark) {
			.maglmt_pass_index_mainBox .formBox input {
				background-color: rgba(0, 0, 0, 0.1);
				color: white;
				border: 1px solid rgba(255, 255, 255, 0.1);
			}

			.maglmt_pass_index_mainBox .formBox input:focus {
				border: 1px solid var(--themeColor);
			}

			.maglmt_pass_index_mainBox .tabBox .tab {
				background-color: rgba(255, 255, 255, 0.1);
				color: white;
			}

			.maglmt_pass_index_mainBox .tabBox .tab:hover {
				background-color: rgba(255, 255, 255, 0.2);
			}

			.maglmt_pass_index_mainBox .tabBox .tab.active {
				background-color: var(--themeColor);
			}
		}

		@media (max-width: 1224px) {
			.maglmt_pass_index_mainBox .maglmt_pass_index_introBox {
				display: none;
			}
		}

		@media (min-width: 1225px) {
			.maglmt_pass_index_passBox .mainContain {
				position: relative;
				top: 50%;
				transform: translateY(-50%);
			}

			.maglmt_index_ui_Swiper-Container {
				border-radius: 50px;
			}

			.maglmt_index_ui_Swiper-Img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				object-position: center;
			}

			.maglmt_pass_index_mainBox {
				overflow: hidden;
				position: absolute;
				left: 50%;
				top: 50%;
				transform: translate(-50%, -50%);
				width: 80%;
				padding: 30px;
				box-sizing: border-box;
				display: flex;
				gap: 90px;
			}

			.maglmt_pass_index_mainBox .maglmt_pass_index_introBox {
				flex: 5;
				overflow: hidden;
			}

			.maglmt_pass_index_mainBox .maglmt_pass_index_passBox {
				flex: 4;
			}

			.maglmt_pass_index_mainBox .logoBox {
				padding: 17px;
			}

			.maglmt_pass_index_mainBox .logoBox svg {
				height: 45px;
			}

			.maglmt_pass_index_mainBox .titleBox .mainTitle {
				white-space: nowrap;
				font-size: 45px;
			}

			.maglmt_pass_index_mainBox .titleBox .mainsSubTitle {
				white-space: nowrap;
				font-size: 27px;
			}

			.maglmt_pass_index_mainBox .formBox {
				margin: 30px 0px 0px 0px;
			}

			.maglmt_pass_index_mainBox .formBox button {
				margin:30px 0px 0px 0px;
			}

			.maglmt_pass_index_mainBox .formBox input {
				padding: 16px 12px;
			}

			.maglmt_pass_index_mainBox .formBox input:focus {
				padding: 16px 16px;
			}
		}

		@media (min-width: 750px) and (max-width: 1224px) {
			.maglmt_pass_index_mainBox {
				width: 50%;
			}
		}