/* Normal desktop :1200px. */
@media (min-width: 1200px) and (max-width: 1500px) {}
/* Normal desktop :992px. */
@media (min-width: 992px) and (max-width: 1200px) {}
/* Tablet desktop :768px. */
@media (min-width: 768px) and (max-width: 991px) {}
/* small mobile :320px. */
@media (max-width: 767px) {
	.car-table-wrapper.table_item .table-box .cell-gold {
		min-width: inherit;
	}
	.car-table-wrapper.table_item .table-box .text-sm {
	word-wrap: break-word;
}
	.tob {
		height: 55vh !important;
		min-height: 55vh !important;
	}
	.flim-wrapper .benefit-content a {
		font-size: 15px;
	}
	.we-offer-box h3 {
		font-size: 16px;
	}
	.linebreak {
		display: block;
	}
	.car-info-list ul li::before {
		top: 7px;
	}
	.table-container th, .table-container td {
		font-size: 14px;
	}
	.titlebar {
		background-size: contain;
	}
	.water-repellent table {
		width: 857px;
	}
	.titlebar.brown-bg {
		padding-bottom: 20px;
		margin-bottom: 20px;
	}
	.we-offer-content {
		min-height: inherit;
	}
	#coating-sec-seven {
		padding-bottom: 20px;
	}
	.we-offer-box {
		margin-bottom: 20px;
	}
	.water-repellent .title {
		font-size: 20px;
	}
	.titlebar span {
		font-size: 25px;
		padding-bottom: 20px;
	}
	.car-table-area, .car-models {
		padding-left: 0;
		padding-right: 0;
	}
	.titlebar {
		padding-bottom: 50px;
	}
	.car-models-title h3 {
		font-size: 28px;
	}
	.car-models-title h3::after {
		max-width: 10%;
	}
	.car-models-title h3::before {
		max-width: 10%;
	}
	.logo img {
		max-width: 181px;
	}
	.like {
		display: none;
	}
	.banner-area, .banner-area#inner-banner, .banner-area#tob-banner, .banner-area#homes, .banner-area.coating-banner {
		margin-top: 44px;
		height: 55vh;
		min-height: 55vh;
	}
	.banner-area .parallax_cover, .banner-area .parallax_cover img {
		height: 100%;
	}
	.main-menu-area .col-12 {
		padding: 0;
	}
	.banner-content h1 {
		font-size: 35px;
		line-height: 45px;
	}
	.banner-content p {
		font-size: 20px;
		line-height: 26px;
	}
	.coating-area {
		padding-top: 30px;
	}
	.news-area {
		padding-top: 60px;
	}
	.section-description {
		font-size: 16px;
	}
	.section-title img {
		max-width: 40px;
	}
	.hero-tagline {
		max-width: inherit;
	}
	.hero-wrapper {
		display: block !important;
		margin-top: 20px;
	}
	br {
		display: none;
	}
	.hero-feature-card {
		margin-top: 20px;
	}
	.hero-feature-card {
		margin-top: 20px;
		max-width: inherit;
	}
	#inner-banner .banner-sec .row .inner-banner-content.col-sm-12, #inner-banner .banner-sec .row.align-items-center {
		padding-left: 0;
	}
	.inner-banner-title {
		padding-left: 15px;
	}
	.page-template-page-carfilm-php .inner-banner-description {
		left: 0;
	}
	.section-title {
		font-size: 40px;
		line-height: 50px;
	}
	.section-title .arrow {
		padding-left: 10px;
		max-width: 50px;
	}
	.news-items {
		display: block;
	}
	.coating-pricing {
		display: block;
	}
	.pricing-card {
		margin-bottom: 20px;
	}
	.news-card {
		margin-top: 30px;
	}
	.news-grid {
		display: block;
	}
	.gallery-area .owl-nav {
		display: none;
	}
	.coating {
		padding-top: 30px;
	}
	.gallery-area {}
	.feature-grid .feature p br {
		display: block;
	}
	.titlebar, .brown-bg {
		background-position: center bottom;
	}
	.benefit-content p br {
		display: block;
	}
	.feature-grid {
		padding-top: 30px;
	}
	.flow-area {
		padding-top: 50px;
	}
	.flow-steps ul li::after {
		display: none;
	}
	.flow-step-label {
		font-size: 20px;
	}
	.shopinfo-details ul li {
		font-size: 16px;
		line-height: 30px;
	}
	.cta-left .cta-phone {
		font-size: 25px;
	}
	.cta-left p, .cta-right p {
		font-size: 16px;
	}
	.cta-line-buttons {
		text-align: center;
	}
	.footer-menu ul li {
		padding-bottom: 10px;
	}
	.copyright p {
		font-size: 10px;
	}
	.hero-tagline p {
		font-size: 20px;
	}
	.inner-banner-title h1 {
		font-size: 40px;
	}
	.inner-banner-description {
	padding: 0 20px;
	position: relative;
	bottom: 0;
}
	.reasons-text p {
		font-size: 12px;
		line-height: 16px;
	}
	.reasons-text p br {
		display: block;
	}
	.inner-banner-description h2 {
		font-size: 26px;
	}
	.reasons-title-sec.pl-50.pr-50 {
		padding-left: 0;
		padding-right: 0;
	}
	.reasons-title {
		padding: 25px 0 30px;
	}
	.inner-banner-description p {
		font-size: 16px;
	}
	.features-area {}
	.car-models-box {
		min-height: inherit;
	}
	.car-info-area {
		padding-bottom: 0;
	}
	.car-info-list ul li {
		font-size: 14px;
		font-weight: 400;
	}
	.menu-section .menu-item {
		margin-bottom: 30px;
	}
	.feature-grid .feature {
		margin-bottom: 30px;
	}
	.features-area {
		margin-bottom: 30px;
		padding-bottom: 0;
		padding-left: 0;
		padding-right: 0;
	}
	.menu-section {
		padding-left: 0;
		padding-right: 0;
	}
	.page-template-page-carfilm-php .inner-banner-description, .page-template-page-tob .inner-banner-description {
		left: 0;
	}
	#tob-banner .banner-sec .container, #tob-banner .banner-sec .row, #tob-banner .banner-sec .inner-banner-content {
		padding-left: 0;
	}
	.feature p {
		font-size: 14px;
	}
	.promo_item h2 {
		font-size: 20px;
		line-height: 30px;
	}
	.promo_item_top {
		padding: 20px 20px;
	}
	.promo_item h2 {
		font-size: 20px;
	}
	.promo_line_area {
		padding-bottom: 30px;
	}
	.client-logo-img {
		min-height: inherit;
		padding-bottom: 20px;
	}
	.client-logo {
		padding-bottom: 30px;
	}
	.clients-area {
		padding-bottom: 0;
	}
	.benefits-area {
		padding-top: 20px;
		padding-bottom: 20px;
	}
	.flim-img {
		padding-top: 10px;
	}
	.titlebar h2 {
		font-size: 20px;
	}
	.portfolio-grid-one .owl-nav {
		display: none;
	}
	.portfolio-content {
		padding: 10px;
	}
	.portfolio-img {
		height: 160px;
	}
	.portfolio-wrapper-one .owl-nav, .portfolio-wrapper-two .owl-nav, .portfolio-wrapper-three .owl-nav {
		display: none;
	}
	.section-bg-3 {
		height: 660px;
	}
	#portfolio-three {
		min-height: 660px;
	}
	.portfolio-title span {
		max-width: 80%;
		font-size: 25px;
		height: 80px;
		line-height: 80px;
	}
	#coating-sec-eight {
		padding-bottom: 0;
	}
	.arrow-left::after {
		display: none;
	}
	.steps {
		padding: 0;
	}
	.step-content p br {
		display: block;
	}
	.step-title h3 {
		font-size: 25px;
	}
	.step-title p {
		font-size: 13px;
	}
	.step-content p {
		font-size: 18px;
		line-height: 30px;
	}
	.gallery-area {
		padding-bottom: 20px;
		padding-top: 20px;
	}
	.portfolio-btn ul li {
		display: block;
		padding-bottom: 10px;
	}
	.project-wrapper-bottom {
		position: relative;
	}
	.project-wrapper {
		height: auto;
		overflow: hidden;
	}
	.project-boxe-left {
		padding: 15px;
	}
	.project-boxe-right .col-lg-4 {
		padding-bottom: 15px;
	}
	#coating-sec-three {
		position: relative;
		margin-top: 0;
		padding-bottom: 20px;
	}
	#coating-sec-four {
		padding-left: 0;
		padding-right: 0;
		padding-bottom: 0;
	}
	.benefit h3 {
		font-size: 18px;
	}
	p {
		font-size: 14px;
	}
	.reasons-title h2 {
		font-size: 23px;
	}
	.reasons-text {
		padding: 15px;
		margin: 0 auto;
	}
	.case-box h4 {
		font-size: 22px;
	}
	.reasons-banner {
		height: auto;
		display: block;
	}
	.reasons-banner .parallax_cover {
		position: relative;
	}
	.reasons-item-content {
		position: relative;
		left: 0;
		right: 0;
		width: 100%;
		height: auto;
		z-index: 1;
		display: block;
	}
	.reasons-text.margin-right {
		float: none;
	}
	.regarding-contract {
		padding-top: 0;
		padding-bottom: 0;
	}
	.case-study-area .col-md-12.mb-80 {
		margin-bottom: 20px;
	}
	.case-box br {
		display: block;
	}
	.case-box p {
		font-size: 14px;
		font-weight: 400;
	}
	.case-study-area {
		padding-bottom: 20px;
	}
	.volume-area {
		padding-left: 0;
		padding-right: 0;
		padding-bottom: 0;
	}
	.contact-form-wrapper .contact-form-submit {
		width: 100%;
		margin: 0 auto;
		max-width: inherit;
		float: none;
		text-align: center;
		display: block;
	}
	.contact-form-wrapper .wpcf7-submit {
		display: block;
		margin: 0 auto;
	}
	.contact-page-notice h3 {
		font-size: 25px;
	}
	.inner-banner-description {
		left: 0;
	}
	.flim-wrapper .benefit-content p {
		font-size: 15px;
		font-weight: 500;
	}
	.contact-page-desc p {
		font-size: 16px;
		line-height: 26px;
	}
	#coating-sec-six {
		padding-left: 0;
		padding-right: 0;
	}
	.services-wrapper h2 {
		font-size: 20px;
	}
	.project-boxe-left p {
		font-size: 15px;
		line-height: 22px;
	}
	.project-boxe-left h3 {
		font-size: 25px;
	}
	.volume-wrapper .reasons-item.mb-30 {
		margin-bottom: 0;
	}
	.volume-wrapper .reasons-text {}
	.reasons-text {}
	#tob-banner .inner-banner-title h1 {
		font-size: 30px;
		padding-top: 20px;
	}
	.volume-area .reasons-banner {
		height: 150px;
	}
	.volume-wrapper .reasons-text h5 {
		font-size: 18px;
	}
	.volume-title-sec h2 {
		font-size: 21px;
	}
	.regarding-contract .col-md-12.mb-80 {
		margin-bottom: 30px;
	}
	.regarding-box p {
		font-size: 15px;
		line-height: 20px;
	}
	.reasons-text h3 {
		font-size: 18px;
		padding-bottom: 10px;
		background-size: contain;
		margin-bottom: 20px;
	}
	.reasons-text h4 {
		font-size: 14px;
	}
	.reasons-title h2 span {
		font-size: 35px;
	}
	.car-table-wrapper.table_item .table-box .coating-th-title strong {
		font-size: 15px;
	}
	.car-table-wrapper.table_item .table-box .coating-th-title {
		font-size: 15px;
	}
	.contact-page-area {
		padding-bottom: 10px;
	}
	.features-wrapper .feature {
		margin-bottom: 30px;
	}
	.contact-form-wrapper .contact-form-row-label {
		-moz-box-flex: 0;
		flex: 0 0 100%;
		max-width: 100%;
		display: block;
		padding-bottom: 20px;
	}
	.contact-form-wrapper .contact-form-row-field {
		-moz-box-flex: 0;
		flex: 0 0 100%;
		max-width: 100%;
		display: block;
	}
	/* Contact form — compact input height on mobile (excludes textarea) */
	.contact-form-wrapper .wpcf7-form-control:not(.wpcf7-submit):not(.wpcf7-radio):not(.wpcf7-checkbox):not(.wpcf7-acceptance):not(.wpcf7-textarea) {
		height: 44px;
		padding: 8px 12px;
		font-size: 14px;
	}
	/* =================================================================
	   Responsive tables (mobile ≤767px)
	   -----------------------------------------------------------------
	   Table variants in this theme:
	     A. Coating tables — .car-table-wrapper.table_item .table-box
	        Complex multi-column layout with rowspan, per-cell widths
	        (.cell-green 40px, .coating-th-indicator 40px, .cell-gold
	        130px min, .coating-th-logo 110px min, .coating-th-title
	        padding 20px 24px). Designed geometry MUST be preserved.
	     B. Car-film tables — .car-table-wrapper .table-container
	        Wrapped around shortcode, simpler grid.
	     C. Water-repellent table — .water-repellent
	        Wrapped around shortcode, single-header grid.
	     D. Any future shortcode table — .table-scroll-wrapper is the
	        common ancestor (added by the pricing-table shortcode).
	   Strategy:
	     1. Scroll wrappers get overflow-x: auto.
	     2. Table min-width prevents viewport squeeze; coating needs
	        more room (1100px) than generic (700px).
	     3. Cells get white-space: nowrap so CJK text stays on one line
	        instead of breaking between characters; horizontal scroll
	        handles the resulting width.
	     4. Coating title/note cells opt back into wrapping.
	     5. Generic cells in lists/paragraphs opt back into wrapping.
	   ================================================================= */
	.table-scroll-wrapper {
		width: 100%;
	}
	.table-scroll-hint {
		display: block;
		background: #eeeeee;
		color: #333;
		text-align: center;
		padding: 10px 15px;
		font-size: 13px;
		line-height: 1.4;
		margin: 0 0 10px;
		border-radius: 2px;
		letter-spacing: 0.02em;
	}
	/* 1. Scroll on all table wrappers. */
	.table-scroll-wrapper, .table-scroll-wrapper .table-box, .water-repellent .table-box, .car-table-wrapper .table-box, .car-table-wrapper.table_item .table-box {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		max-width: 100%;
	}
	/* 2a. Generic tables — 700px min-width. */
	.table-scroll-wrapper .table-box > table {
		width: auto !important;
		min-width: 700px;
		table-layout: auto;
	}
	/* 2b. Coating tables — higher specificity (3 classes vs 2), wins
	   over rule 2a and over style.css "width: 100%" rule. 1100px
	   keeps all designed columns visible. */
	.car-table-wrapper.table_item .table-box > table {
		width: auto !important;
		min-width: 1100px;
		table-layout: auto;
	}
	/* 3a. Generic cells — nowrap so Japanese text stays on one line. */
	.table-scroll-wrapper .table-box th, .table-scroll-wrapper .table-box td {
		white-space: nowrap;
		word-break: keep-all;
		overflow-wrap: normal;
	}
	/* 3b. Coating cells — same nowrap, plus overflow:hidden as a safety
	   net so if a cell's content is wider than its fixed column
	   (.cell-green 40px), it's clipped instead of spilling into the
	   next column's space. Higher specificity wins over 3a. */
	.car-table-wrapper.table_item .table-box th, .car-table-wrapper.table_item .table-box td {
		white-space: nowrap;
		word-break: keep-all;
		overflow: hidden;
		text-overflow: clip;
	}
	/* 4a. Coating title cell wraps (single long sentence). */
	.car-table-wrapper.table_item .table-box .coating-th-title,	/* 4b. Coating footnote cells wrap inside their max-width. */
	.car-table-wrapper.table_item .table-box .text-sm {
		white-space: normal;
		overflow: visible;
	}
	/* 5. Generic cells containing lists/paragraphs keep their wrapping,
	   plus a manual escape hatch via .allow-wrap. */
	.table-scroll-wrapper .table-box td:has(ul), .table-scroll-wrapper .table-box td:has(p), .table-scroll-wrapper .table-box td.allow-wrap, .table-scroll-wrapper .table-box th.allow-wrap {
		white-space: normal;
	}
	/* 6. Images inside generic-table cells are size-capped. Coating
	   cells have their own designed image sizes (.coating-th-logo
	   .pt-cell-image max-width 100px, etc.) — those have higher
	   specificity and are untouched. */
	.table-scroll-wrapper .table-box img, .table-scroll-wrapper .table-box .pt-cell-image {
		max-width: 100%;
		height: auto;
	}
}
/* Large Mobile :480px. */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	.container {}
}