@media(max-width: 849px){
	:root{
        --px-content: 90% !important;
        --px-content-small: 80% !important;
    }

    body{
		font-size: 0.875rem;
	}

	input[type='submit'], input[type="button"], button:not(.icon), .button:not(.icon){
		font-size: 0.75rem;
	}

	.button.primary{
		background: linear-gradient(to right, #fea312, #004199);
		border-radius: 50rem !important;
		border: 0;
	}

	/*Header*/
	.icon-menu,
	.icon-search{
		color: #fff;
	}

	#logo img{
		padding: 0 !important;
	}

	.banner-page .text-box{
		width: 92% !important;
	}

	.main-title h2{
  		background: linear-gradient(to right, #004199, #FEA312);
  		-webkit-background-clip: text;
  		-webkit-text-fill-color: transparent;
  		color: transparent;
	}

	/*===*/
	.icon-advantage-mb{
		.icon-box-img{
			position: relative;
		}

		.icon-box-img:after{
			content: "";
			position: absolute;
			left: 50%;
			top: 50%;
			height: 100%;
			border-left: 2px dashed var(--cl-z);
		}

		.icon-box-text{
			font-size: 0.75rem;
			h3{
				font-size: 0.875rem;
			}
		}
	}
	.icon-advantage-mb.last .icon-box-img:after{
		content: unset;
	}

	/*===*/
	.box-number{
		padding: 1rem 1rem;
		.icon-box-text{
			font-size: 0.75rem;
		}
	}


	.blog-form-study-abroad{
		.col:last-of-type{
			padding-bottom: 0;
		}
		.box-blog-post{
			.box-text{
				width: auto;
				margin: -2rem 10% 0;
				padding: 1rem;
				background-color: #fff;
				border-radius: 0.5rem;
				box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
				.box-text-inner{
					display: flex;
					align-items: center;
					gap: 0.75rem;
					h3.post-title{
						flex: 1;
						margin: 0;
						font-size: 0.875rem;
					}
					.button{
						width: 42px;
						min-height: unset;
						display: flex;
						justify-content: center;
						margin: 0;
						padding: 0.25rem;
						border: 1px solid var(--cl-z);
						border-radius: 0.25rem;
						line-height: normal;
					}
					.button:after{
						content: "\f061";
						font-family: "Font Awesome 6 Pro";
						position: absolute;
						left: 50%;
						top: 50%;
						transform: translate(-50%, -50%);
						color: var(--cl-z);
					}
				}
			}
		}
	}


	.form-register{
		input[type=submit]{
			background-color: #fff;
			color: var(--cl-x);
			border-radius: 50rem;
		}
	}


	/* Giới thiệu */
	.section-achievement{
		padding-top: 0 !important;
	}
	
	.section-achievement .section-bg{
		display: none;
	}

	.wrapper-achievement{
		background: 
			linear-gradient(white, white) padding-box, 
			linear-gradient(to right, #fea312, #004199) border-box;
		border: 2px dashed #fff;
	}


	.icon-achievement{
		flex-direction: column;
		align-items: center;
		gap: 0.5rem;
		color: var(--cl-x);
		.icon-box-img img{
			filter: brightness(0) saturate(100%) invert(14%) sepia(63%) saturate(4235%) hue-rotate(208deg) brightness(95%) contrast(101%);
		}
		.icon-box-text{
			text-align: center;
			font-size: 0.75rem;
			h3{
				font-size: 1.25rem;
			}
		}
	}

	.row-type-study-abroad{
		.box-blog-post{
			border-radius: 0.5rem;
			overflow: hidden;
			.box-image{
				border-radius: 0;
			}
			.box-text{
				background-color: #fff;
				padding: 1rem;
				h3{
					font-size: 1rem;
				}
			}
		}
		.flickity-page-dots{
			bottom: -1rem;
			.dot{
				width: 0.5rem;
				height: 0.5rem;
				margin: 0 3px;
				background-color: #fff;
			}
		}
	}

	.box-process{
		--w: 5rem;
		.box-content{
			padding: 0.5rem;
			font-size: 0.75rem;
		}
		.box-content h3{
			font-size: 1rem;
		}
	}



	/*=== Trang Contact*/
	.form-contact .form-control{
		background-color: #F7F7F7;
	}

	.form-contact input[type=submit]{
		background: linear-gradient(to right, #004199, #FEA312);
		border: 0;
	}

	/*=== Trang Điều Kiện*/
	.section-condition .section-bg{
		display: none;
	}

	.box-necessity-study-abroad-mb{
		display: flex;
		flex-direction: column-reverse;
		.box-image{
			border-radius: 0.5rem;
		}
		.box-text{
			padding: 0 0 1rem;
			font-size: inherit;
			h3{
				margin-bottom: 0.25rem;
				font-size: 1rem;
				color: var(--cl-y);
			}
		}
	}

	.box-icon-choose-us-mb{
		.icon-box-text h3{
			font-size: 1rem;
		}
	}

	.box-condition .box-text{
		margin: -15% auto 0;
		background-color: var(--cl-x);
		color: #fff;
		border-radius: 0.5rem;
		h3{
			margin-bottom: 0.5rem;
			font-size: 1rem;
			color: #fff;
		}
	}
}



@media(max-width: 549px){
	:root{
        --px-content: 110% !important;
        --px-content-small: 80% !important;
    }





	/*===*/

	.list-school table{

		th{

			white-space: nowrap;

		}

		th,td{

			font-size: 0.75rem;

		}

	}





}







@media (min-width: 550px){

	.justify-content-md-between{

		justify-content: space-between;

	}

}



@media (min-width: 850px){

	.row-col-lg-5 .col{
		flex-basis: 20%;
        max-width: 20%;
	}

	.flex-lg-row-reverse{
		flex-direction: row-reverse;
	}

	.justify-content-lg-between{
		justify-content: space-between;
	}

	.col-lg-auto{
		flex-basis: auto;
		max-width: fit-content;
	}

	.button.primary{
		background: linear-gradient(0deg, #154499 0%, #2699d6 100%);
		border: 0;
		padding-left: 0;
		padding-right: 0;
		span{
			display: inline-block;
			clip-path: url('#clip-path-button');
			margin-top: 0.25rem;
			padding: 0.5rem 2rem;
			background-color: var(--cl-z);
		}
	}

	#logo{
		a{
			position: absolute;
			top: 0;
			bottom: -1.25rem;
			z-index: 20;
			width: 120px;
			display: flex;
			justify-content: center;
			align-items: center;
			padding: 0.25rem;
			background: linear-gradient(0deg, #154499 0%, #2699d6 100%);
			clip-path: polygon(0 0, 100% 0, 100% 85%, 50% 100%, 0 85%);
		}

		img{
			width: 100%;
			height: 100%;
			max-height: 100%;
			object-fit: contain;
		}
	}
}