/* ========================= ========================= ========================= ========================= ========================= =========================
***
* please make sure all media_query css inside @layer media_query 
***
* please make sure all media_query css inside @layer media_query 
* please make sure all media_query css inside @layer media_query 
* Use CSS @layer
* Use CSS @layer
* Use CSS @layer
***
 ========================= ========================= ========================= ========================= ========================= =========================*/

@layer media_query {




	@media (max-width: 1920px) {

		.container:not(.container2),
		.subMenuFlex .container:not(.container2),
		.breadcrumb_bigwrap .container {
			/*max-width: 80%;*/
			max-width: 1194px;
		}
		
	}

	@media (max-width: 1330px) {


		.subMenuVersion .content_area {
			width: 100%;
		}

		.body_area {
			padding-top: 2rem;
		}

		.container {
			padding-left: 1.2rem;
			padding-right: 1.2rem;
		}


		.mobile {
			display: inherit;
		}


		.subMenuVersion .content_area {
			padding-left: 0;
			width: 100%;
		}

	}

	@media all and (max-width: 992px) {

		.container,
		.subMenuVersion .subMenuFlex .container,
		.breadcrumb_bigwrap .container {
			max-width: 100%;
		}
	}


	@media (max-width: 1330px) {
		.breadcrumb {}

		.breadcrumb_bigwrap {
			padding-top: 1.7rem;
			padding-bottom: 1rem;
		}
	}



	@media (max-width: 1330px) {
		.scroll_table {
			position: relative;

		}

		
		.scroll_table table {
			min-width: 33rem;
		}

		.scroll_table_inside_wrapper {
			overflow-x: auto;
		}

		.need_to_scroll .scroll_table_inside_wrapper:before {
			content: "";
			position: absolute;
			z-index: 25;
			top: 5rem;
			right: 0.9375rem;
			width: 3rem;
			height: 2rem;
			transition: width 0.3s ease-in-out, height 0.3s ease-in-out,
				opacity 0.3s ease-in-out;
			-webkit-animation: passing 1.3s linear infinite;
			animation: passing 1.3s linear infinite;
			background: url(../../images/icon/icon_arrow_right.svg) no-repeat center center;
			background-size: contain;
		}

		.need_to_scroll .scroll_table_inside_wrapper:after {
			content: "";
			position: absolute;
			z-index: 22;
			top: 0;
			right: 0;
			display: block;
			width: 3.75rem;
			height: 100%;
			transition: width 0.3s ease-in-out, height 0.3s ease-in-out,
				opacity 0.3s ease-in-out;
			pointer-events: none;
			background-image: -webkit-gradient(linear,
					left top,
					right top,
					from(rgba(255, 255, 255, 0)),
					color-stop(30%, rgba(255, 255, 255, 0.5)),
					to(#fff));
			background-image: -o-linear-gradient(left,
					rgba(255, 255, 255, 0) 0,
					rgba(255, 255, 255, 0.5) 30%,
					#fff 100%);
			background-image: linear-gradient(to right,
					rgba(255, 255, 255, 0) 0,
					rgba(255, 255, 255, 0.5) 30%,
					#fff 100%);
		}

		.need_to_scroll.reachend .scroll_table_inside_wrapper:before {
			width: 0;
			height: 0;
			opacity: 0;
			overflow: hidden;
		}

		.need_to_scroll.reachend .scroll_table_inside_wrapper:after {
			width: 0;
			height: 0;
			opacity: 0;
			overflow: hidden;
		}
		.fake_table2>*{
			min-width: 43rem;
		}
	}

	@media(max-width: 767px) {
        .fake_table1>* {
            grid-template-columns: 100%;
        }

        .fake_table1>*>* {
            grid-column: unset;
        }

        .fake_table1>*>*>*:nth-child(1),
        .fake_table1>*>*>*:nth-child(2) {

            border-bottom: 0;
        }

        .fake_table1>*>*>*:nth-child(3) {
            padding-top: 0;
        }

        .fake_table1 .colspan_2 {
            grid-column: unset;
        }
    }


	@media (max-width: 1330px) {
		.mobile_left_menu {
			display: block;
		}

		.mobile_left_menu_nav {
			display: block;
		}

		body:has(.mobile_left_menu.active) .js_scroll_blanket {
			display: block;
		}

		.body_area .left_menu {
			display: none;
		}
	}

	@media (max-width: 1330px) {
		.top_btn .textTop {}

		.top_btn {
			background-image: none;
			margin: 0;
		}

		.footer_area .footer_right {
			display: block;
		}

		.footer_area .footer_right * {
			text-align: right;
		}

		.footer_area .fTool {
			margin-right: 0;
		}

		.footer_area .fTool>li:last-child::after {
			width: 0;
			height: 0;
		}

		.footer_area .fTool>li:last-child a {
			padding-right: 0;
		}

		.footer_area .footer_right .updateDate {
			display: block;
			margin-bottom: 0;
		}

		.footer_row1>.info,
		.footer_row1>.updateDate {
			display: none;
		}

		.footer_menu {
			max-width: none;
		}

		.footer_menu {
			padding: 0.5rem 0;
			float: left;
			margin: 0;
		}

		.footerMenuArea {
			flex-wrap: wrap;
		}
	}

	@media all and (max-width: 1330px) {
		.menu_btn {
			display: flex;
			align-items: center;
			justify-content: flex-end;
			grid-area: menu_btn;
			padding-top: 1.5rem;

		}

		.have_not_login .header_inner {
			grid-template-areas:
				"logo menu_btn"
				"logo client";
			align-items: center;
		}

		.have_not_login .header_inner .big_clientTool{
			padding-top: 0;
		}

		.logined .header_inner {
			grid-template-areas:
				"logo menu_btn"
				"logo client";
			align-items: center;
		
		}

		.logined .header_inner .clientTool {
			padding-top: 0;
		}

		.logined:has(.btn-top-save) .header_inner {
			grid-template-areas:
				"logo menu_btn"
				"client client";
		}
		.logined .big_clientTool:has(.btn-top-save){
			padding-top: 0;
			padding-bottom: 0.5rem;
		}

		.logined:has(.btn-top-save) .menu_btn{
			padding-top: 0;
		}

		.mobile_menu .shortcut>* {
			margin-bottom: 0.5rem;
			/*width: 100%;
			margin-bottom: 0.5rem;
			margin-right: 0;*/
		}

		.header_right {
			display: flex;
			align-items: center;
			padding-right: 1rem;
		}

		.menu_btn {}



		.shareList {
			display: block;
			position: static;
			border: 0;
			box-shadow: none;
		}

		.mobile_menu_active,
		.search_menu_active,
		.lang_menu_active {
			overflow: hidden;
		}

		.headerMenu {}

		.headerTool .header_inner:not() {
			/*display: flex;
			padding: 0;
			-webkit-justify-content: space-between;
			-ms-flex-pack: justify;
			justify-content: space-between;*/
		}

		.header_area .langTool {}

		.lang_menu ul {
			font-size: 1.3rem;
		}

		.lang_menu ul>li a {
			font-size: initial;
		}

		.lang_menu li {
			display: block;
			margin-bottom: 0.625rem;
		}



		.moblang a,
		.mobSearch a {
			min-width: 2.7rem;
			min-height: 2.7rem;
			max-width: 2.7rem;
			max-height: 2.7rem;
			border-radius: 50%;
			border: 1px solid #bedeee;
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.mobSearch {}

		.mobSearch img {
			width: 70%;
		}

		.search_menu .mobSearch {
			display: none;
		}

		.lang_menu .moblang {
			display: none;
		}

		.header_area .shareTool {
			display: none;
		}





		.header_area .headerTop {
			display: none;
		}

		.header_area {}



		.mobile_menu .moblang {
			display: none;
		}

		.mobile_menu .langTool {
			display: block;
			position: static;
		}

		.mobile_menu .menu_lv0 {
			border-top: 0;
		}


		.headerTool .search_btn {
			display: inline-block;
		}

		.myLogo {


			padding-bottom: 1rem;
		}

		.headerTool .myLogo img {
			width: auto;
		}


		.print.tool_item {
			display: none;
		}

		.tool_item img {}

		.clientTool>.tool_item {
			padding-right: 1rem;
			padding-left: 0;
		}

		.tool_item::after {
			width: 0;
			height: 0;
		}

		.clientTool .AStyleArea {
			display: none;
		}

		.tool_item .moblang {
			display: block;
		}

		.tool_item .langTool {
			display: none;
		}

		.searchTool {}

		.searchTool input {}

		.search_btn {
			display: inline-block;
			background-image: url("../../images/icon/icon_search.svg");
			background-repeat: no-repeat;
			background-position: center;
			background-size: contain;
			width: 1.25rem;
			height: 1.25rem;
			font-size: 0;
			vertical-align: middle;
		}

		.headerTool .search_btn img {
			float: none;
			margin-left: 0;
		}

		.searchTool form {
			display: block;
		}
	}

	@media(max-width: 992px) {
		.headerTool .header_inner {
			flex-wrap: wrap;
		}

		.headerTool .myLogo {
			height: auto;

		}

		.big_clientTool {
			padding-bottom: 0.5rem;
			width: 100%;
			justify-content: flex-end;
		}
	}

	@media(max-width: 767px) {
		.headerTool .myLogo {
			padding-top: 1rem;
			padding-bottom: 1rem;
			padding-right: 1rem;

		}

		.have_not_login .header_inner {
			grid-template-areas:
				"logo menu_btn"
				"client client";
		}

		.have_not_login .menu_btn{
			padding-top: 0;
		}

		.have_not_login .header_inner .langTool{
			display: none;
		}

		.have_not_login .header_inner .shortcut{
			margin-right: 0;
		}

		.logined .big_clientTool{
			padding-top: 0;
		}

		.logined .header_inner {
			grid-template-areas:
				"logo menu_btn"
				"client client";
			
		
		}

		/*.big_clientTool:not(:has(.btn-top-save)) {
			display: none;
		}

		.header_inner,
		.header_inner {
			display: flex;
			align-items: center;
		}*/
	}



	@media all and (max-width: 992px) {




		.top_btn .textTop {
			font-size: 0;
		}

		.footer_area .info {
			padding-top: 0;
			padding-left: 0;
			/* margin-top: 1.25rem;
			  */
		}

		.footer_area .footer_row1 {
			display: block;
		}

		.footer_area .w3c {
			text-align: center;
		}

		.footer_area .footer_right * {
			text-align: center;
		}

		.footer_area .footer_right .updateDate {
			text-align: center;
		}

		.footer_left {
			justify-content: center;
			flex-wrap: wrap;
		}

		.footer_right {
			margin-top: 0.625rem;
		}

		.footer_area1 {
			padding-top: 0;
		}

		.footer_area1>.container:not(.bottom_nav) {
			display: none;
		}

		.contactus {
			flex-wrap: wrap;
			justify-content: flex-start;
		}

		.contactus .title {
			width: 100%;
			margin-right: 0;
		}

		.contactus>div:not(:first-child):not(.more) {
			width: 50%;
			margin-right: 0;
			padding-right: 1.4rem;
		}

		.contactus>div.more {
			width: 100%;
			text-align: center;
			padding-left: 0;
		}
	}

	@media all and (min-width: 1331px) {
		.header_area .headerTool .active_section>a {
			color: var(--menu0_active_text_color);
		}

		.header_area .headerTool .my_menu.open>a {
			color: var(--menu0_active_text_color);
		}
	}

	@media(max-width: 992px) {

		.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
		.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
			/*margin-bottom: 1rem;*/
		}
	}


	/* ========================= ========================= ========================= ========================= ========================= =========================
***
* SECTION FOR section banner 
***
***
 ========================= ========================= ========================= ========================= ========================= =========================*/
	@media(max-width:992px) {
		.section_header_banner {
			height: auto;
		}

		.section_header_banner h1 {
			padding-top: min(2rem, 8vw);
			padding-bottom: 3rem;
			padding-left: 1rem;
			padding-right: 1rem;
		}
	}

	@media(max-width:767px) {
		.section_header_banner:not(:has(.process_nav))>.container {
			padding-left: 0;
			padding-right: 0;
			display: flex;
			flex-wrap: wrap;
		}

		.section_header_banner>.container>div:first-child {
			width: 100%;
			padding-left: 1.2rem;
			padding-right: 0;
			order: 2;
		}

		.section_header_banner .bg {
			position: static;
			order: 1;
			width: 100%;
		}

		.section_header_banner img {
			max-width: 100%;
			height: auto;
			object-fit: unset;
		}
	}


	@media(max-width: 767px) {

		.equal_height_column1,
		.equal_height_column2,
		.equal_height_column3,
		.equal_height_column4,
		.equal_height_column5,
		.equal_height_column6,
		.equal_height_column7,
		.equal_height_column8,
		.equal_height_column9,
		.equal_height_column10,
		.equal_height_column11,
		.equal_height_column12,
		.equal_height_column13,
		.equal_height_column14,
		.equal_height_column15,
		.equal_height_column16,
		.equal_height_column17,
		.equal_height_column18,
		.equal_height_column19,
		.equal_height_column20 {
			height: auto;
		}
	}

	@media all and (max-width: 767px) {
		.footerMenuArea {
			flex-wrap: wrap;
		}

		.footerMenu>div {
			flex: 0 0 100%;
			max-width: 100%;
			padding-right: 0;
		}

		.footer_area .w3c>.updateDate {
			text-align: center;
			padding-right: 0;
			display: block;
		}

		.footer_area2 .container {}

		.footer_row2 {
			grid-auto-flow: unset;
			grid-template-columns: 1fr;
			row-gap: 2rem;
		}

		.footerContact {
			width: 100%;
			min-width: inherit;
			padding-right: 0;
		}

		.footer_area .copyright {
			text-align: center;
		}

		.footerMenuArea {
			display: none;
		}

		.footer_area1.in_view .top_btn {
			right: 1rem;
			bottom: 0.5rem;
		}

		.footer_area .swiper {
			max-width: 80%;
		}
	}

	@media(max-width:767px) {
		.custom_select {
			min-width: unset;
		}
	}

	@media all and (min-width: 868px) {
		.footer_slider_area2 .swiper {
			max-width: 100%;
		}

		.footer_slider_area2 .swiper-wrapper {
			flex-wrap: wrap;
			justify-content: center;
			transform: none;
		}

		.footer_slider_area2 .swiper-slide {
			width: auto;
			padding-top: 1rem;
			padding-bottom: 1rem;
			padding-right: 2rem;
		}

		.footer_slider_area2 .swiper-slide img {
			height: 8rem;
			aspect-ratio: 1.7/1;
		}

		.footer_slider_area2 .swiper-button-next {
			display: none;
		}

		.footer_slider_area2 .swiper-button-prev {
			display: none;
		}

		.footer_slider_area2 .swiper_nav {
			display: none;
		}
	}

	@media all and (min-width: 1600px) {
		.footer_slider_area2 .swiper {
			max-width: 90%;
		}
	}

	@media all and (min-width: 1500px) {
		.footerslider2 .swiper-slide {}
	}

	@media only screen and (max-width:992px) {
		.table_wrapper1.responsive_card_table:before {
			width: 0;
			height: 0;
		}

		.responsive_card_table {
			margin-top: 1rem;
			border-radius: 0;
			border: 0;
		}

		.responsive_card_table table {
			box-shadow: none;
			border-radius: 0;
			border: 0;
		}

		.responsive_card_table t {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
			row-gap: 1rem;
			column-gap: 1rem;
		}

		.responsive_card_table .mobiletd {
			display: block;
			font-weight: bold;
			color: #000;
			margin-bottom: 5px;
		}

		.responsive_card_table tbody>tr:nth-child(odd):not(.th_row) {
			background-color: #eaf4f4;
		}

		.responsive_card_table tbody>tr:nth-child(even):not(.th_row) {
			background-color: var(--light_blue_200);
		}

		.responsive_card_table tr:not(.th_row) {
			display: block;

			padding-top: 1.3636rem;
			padding-bottom: 1.3636rem;
			/*margin-bottom: 1rem;*/
		}

		.responsive_card_table .th_row {
			display: block;
			width: 100%;

		}

		.responsive_card_table .th_row th {
			width: 100%;
			display: block;
		}

		.responsive_card_table td>div {
			text-align: left;
			display: block;
		}

		.responsive_card_table td>* {
			text-align: left;
		}

		.responsive_card_table td {
			display: block;
			width: 100%;
			padding-top: 0;
			border-bottom: 0;
			text-align: left;
			background-color: transparent;
			padding-bottom: 1rem;
			border: 0;
		}

		.responsive_card_table tr>td:last-child {
			padding-bottom: 0;
		}

		.responsive_card_table thead {
			display: none;
		}
	}

	@media(min-width:993px) {
		.responsive_card_table .mobiletd {
			display: none;
		}
	}

	@media(min-width:1331px) {

		.social_media_btn__btn:hover,
		.social_media_btn__btn:focus {
			background-color: var(--green_400);

		}
	}

	@media(max-width:992px) {
		.main_card_section2 {
			width: 100%;
			row-gap: 1.5rem;
			grid-template-columns: repeat(auto-fit, minmax(min(380px, 100%), 1fr));
		}

		.main_card_section3 {
			width: 100%;
		}

		.main_card_section4 {
			width: 100%;
			grid-template-columns: repeat(auto-fit, minmax(min(330px, 100%), 1fr));
		}
	}


	/*progress bar*/
	@media(max-width:767px) {
		.progressBar_inner {
			grid-template-columns: max-content 1fr 1fr;
			grid-auto-flow: row;
		}

		.progressBar_item {
			--item_distance: 7vw;
			grid-template-rows: none;
			grid-template-columns: subgrid;
			grid-row: unset;
			grid-column: span 3;
			column-gap: 1rem;
			padding-bottom: var(--item_distance);
			margin-bottom: 0;
		}

		.progressBar_num {
			order: 1;
			align-items: flex-start;
		}

		.progressBar_item .sub_title {
			order: 2;
			text-align: left;
			align-content: flex-start;
		}

		.progressBar_desc {
			order: 3;
			text-align: right;
		}

		.progressBar_num:before {
			width: 0;
			height: 0;
		}

		.progressBar_num:after {
			top: var(--num_height);
			transform: translateX(-50%);
			width: 0.33rem;
			height: calc(100% + var(--item_distance));
		}

		.progressBar_item.processing2 :where(.sub_title, .progressBar_desc) {
			display: none;
		}

		.progressBar_item.processing2 .progressBar_num {
			grid-column: 1 / -1;
		}

		.progressBar_item.processing2 .num_inner {
			width: 100%;
			margin-left: 0;
		}

		.progressBar_item.processing2 .progressBar_num:after {
			left: calc(var(--num_width) / 2);
		}

		.progressBar_item .progressBar_num .progress_text {
			display: none;
		}

		.progressBar_item .sub_title .progress_text {
			position: static;
			display: block;
		}
	}



	@media(max-width: 767px) {
		.btn_grid {
			grid-template-columns: repeat(2, 1fr);
			justify-content: center;
			padding-right: 0 !important;
		}

		.btn_grid * {
			width: 100%;
		}
	}

	@media(max-width: 500px) {
		.btn_grid {
			grid-template-columns: 1fr;
		}
	}
}

@layer media_query {
	@media(max-width: 767px) {
		.tooltip_arrow {
			border: 0;
			box-shadow: none;
		}

		body:has(.tooltip_active) {
			overflow: hidden;
		}

		body:has(.tooltip_active) .js_scroll_blanket {
			display: block;
		}

		.tooltip_close {
			display: block;
		}

		.tooltip_wrapper {
			width: 95%;

		}

		.tooltip_content_wrapper {
			max-height: 50dvh;
			overflow-y: auto;
		}
	}
}

@layer media_query {
	@media(max-width: 992px) {
		.process_nav>li {
			margin-bottom: 0.5rem;
		}
	}
}

@layer media_query {
	@media(max-width: 992px) {
		.btn_row4 .inner {
			order: 2;
			width: 100%;
		}

		.btn_row4>*:last-child{
			margin-left: auto;
		}
	}
}