@font-face {
    font-family: 'Apex New Trial Medium';
    src: url('fonts/ApexNewTrial-Medium-BF66724ea5881a1.eot');
    src: url('fonts/ApexNewTrial-Medium-BF66724ea5881a1.eot?#iefix') format('embedded-opentype'),
         url('fonts/ApexNewTrial-Medium-BF66724ea5881a1.woff2') format('woff2'),
         url('fonts/ApexNewTrial-Medium-BF66724ea5881a1.woff') format('woff'),
         url('fonts/ApexNewTrial-Medium-BF66724ea5881a1.ttf')  format('truetype'),
         url('fonts/ApexNewTrial-Medium-BF66724ea5881a1.svg#Apex New Trial') format('svg');
}

@font-face {
    font-family: 'Apex New Trial Light';
    src: url('fonts/ApexNewTrial-Light-BF66724ea57938a.eot');
    src: url('fonts/ApexNewTrial-Light-BF66724ea57938a.eot?#iefix') format('embedded-opentype'),
         url('fonts/ApexNewTrial-Light-BF66724ea57938a.woff2') format('woff2'),
         url('fonts/ApexNewTrial-Light-BF66724ea57938a.woff') format('woff'),
         url('fonts/ApexNewTrial-Light-BF66724ea57938a.ttf')  format('truetype'),
         url('fonts/ApexNewTrial-Light-BF66724ea57938a.svg#Apex New Trial') format('svg');
}

:root {
    --base-font: 'Apex New Trial Light', sans-serif;
    --base-font-bold: 'Apex New Trial Medium', sans-serif;
    --base-black: #2d2d2d;
    --base-black-alt: #5b5b5b;
    --base-gray: #8d8d8d;
    --base-gray-bg: #F7F7F7;
    --base-gray-line: #E7E7E7;
    --base-white: #FFFFFF;
    --base-animation: all .4s ease;
    --base-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%2847, 51, 63, 100%29'/%3e%3c/svg%3e");
    --base-form-check-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%2855, 144, 24, 100%29'/%3e%3c/svg%3e");
}

html, body { height: 100%; font-weight: 300;}
body { background-color: var(--base-white); color: var(--base-black); font-family: var(--base-font); font-size: 18px;}
body p { margin-bottom: 0; padding-bottom: 15px; line-height: 28px; font-size: 18px; font-weight: 600; letter-spacing: .5px;}
body p:last-child { padding-bottom: 15px;}
.field-validation-error, .client-login-error, .client-reset-pwd-error, .client-reg-error { color: #FF0000; }
.client-reset-pwd-msg { color: green; }

img { max-width: 100%;}
a { color: var(--base-black); text-decoration: none; transition: var(--base-animation); cursor: pointer;}
a.link { border-bottom: 1px solid transparent; }
a.link:hover { border-color: var(--base-black-alt); }

.btn { min-width: 180px; font-size: 22px; text-transform: none; padding: 11px 25px 8px; border-radius: 0; border: 2px solid; font-family: var(--base-font-bold);}
.btn-primary { background-color: transparent; color: var(--base-black);}
.btn-outline-primary { color: var(--base-black); border-color: var(--base-black);}
.btn:hover, .btn:active, .btn:focus { background-color: var(--base-black) !important; color: var(--base-white); border-color: var(--base-black);}
.btn-link { border: 0; min-width: auto; color: var(--base-black); text-decoration: none; opacity: .75;}
.btn-link:hover, .btn-link:active, .btn-link:focus { background: transparent !important;  color: var(--base-black) !important; opacity: 1;}
.btn.sm { font-size: 16px; padding: 9px 15px 6px;}
.btn.fill { background-color: var(--base-black); color: var(--base-white); border-color: var(--base-black);}
.badge { border-radius: 4px; padding: 8px 15px 5px; letter-spacing: .5px; font-size: 14px;}
.badge.text-bg-primary { background-color: var(--base-black) !important;}
.bg-primary { background-color: var(--base-black) !important;}
.bg-secondary { background-color: var(--base-black-alt) !important;}
.bg-gray { background-color: var(--base-gray-bg);}

.table { margin: 0; padding: 0; font-size: 16px; font-weight: 600;}
.table > thead { vertical-align: middle;}
.table > thead th { background: var(--base-gray-bg); border: 0; padding: 12px 10px 10px; color: var(--base-black);}
.table > tbody {}
.table > tbody td, .table > tbody th, .table > tfoot th { vertical-align: middle; padding: 12px 10px 10px; color: var(--base-black);}
.table td.hidden_col { padding: 0; border-bottom: 0; background-color: #fcfcfc;}
.table td.hidden_col .collapse { border-bottom: 1px solid var(--bs-border-color);}
.table tr[aria-expanded] { cursor: pointer;}
.table tr[aria-expanded="true"] td { background-color: #fcfcfc; border-bottom: 0;}
.table tr[aria-expanded] .act_icon {}
.table tr[aria-expanded] .act_icon .bi-chevron-up, .table tr[aria-expanded="true"] .act_icon .bi-chevron-down { display: none;}
.table tr[aria-expanded="true"] .act_icon .bi-chevron-up { display: block;}
.table .exp_table { padding: 0 15px 15px 40px;}
.table .exp_table th { padding: 10px 12px; background: var(--base-gray-bg);}
.table .actions { display: flex; justify-content: space-between; margin: 0 0 0 auto; width: 50px; align-items: center; font-size: 18px;}
.table .w_50 { width: 50px; text-align: center;}

h1, h2, h3, h4, h5, h6 { color: var(--base-black); font-family: var(--base-font-bold); word-spacing: 3px; margin: 0; line-height: 1.1;}
.free_sample h2, .book_appointment h2 { font-size: 24px !important; }
.ttl { font-size: 36px; text-transform: uppercase; padding-bottom: 25px; letter-spacing: .5px;}
.subttl { font-size: 26px; text-transform: uppercase; padding-bottom: 25px; font-family: var(--base-font); letter-spacing: .5px;}
.subttl.lower { text-transform: none;}
.subttl.sm { line-height: 1.4; font-size: 20px;}
.ttl + .subttl { margin-top: -15px;}
.subttl a { text-transform: lowercase; font-weight: 600;}
.ttl_md{ font-size: 30px; line-height: 1.2; font-family: var(--base-font); font-weight: 600;}
.blog_ttl, .ttl_sm { font-family: var(--base-font); font-weight: 600; font-size: 21px; text-transform: uppercase; line-height: 1.3; letter-spacing: .5px; padding-bottom: 5px;}
.ttl_sm { letter-spacing: 2px; }
.blog_link { display: inline-block; font-weight: 600;}
.blog_link:after { content: ''; width: 94px; height: 4px; display: block; background: url(../images/divider.png) center no-repeat; margin: 3px 0 25px;}

.navbar { position: fixed; top: 0; left: 0; width: 100%; z-index: 1000; background: white; box-shadow: 0 0 10px rgba(0, 0, 0, .15); }
.navbar .navbar-collapse { justify-content: flex-end;}
.navbar .navbar-nav .nav-item { font-size: 16px; font-family: var(--base-font-bold); text-transform: uppercase; margin: 0 5px; letter-spacing: 2.5px;}
.navbar .navbar-nav .nav-item .nav-link { padding: 5px 10px; color: var(--base-gray);}
.navbar .navbar-nav .nav-item .nav-link:hover { color: var(--base-black);}
.navbar .navbar-nav .nav-item.active .nav-link { font-weight: 400; color: var(--base-black);}
.navbar .head_icons { display: flex; align-items: center; gap: 10px;}
.navbar .user_menu { color: var(--base-gray); font-size: 30px; transition: var(--base-animation); position: relative; top: 4px;}
.navbar .user_menu:hover { color: var(--base-black);}
.navbar .dropdown-menu { left: -150px; width: 190px; padding: 10px; border: 0; box-shadow: 0 0 10px rgb(0 0 0 / 15%);}
.navbar .dropdown-menu a { background: transparent; color: var(--base-gray); font-size: 16px; font-weight: 600; padding: 8px 13px 5px; line-height: 22px;}
.navbar .dropdown-menu a:hover { color: var(--base-black); background: var(--base-gray-bg);}
.navbar .dropdown-toggle::after { content: none;}
.navbar .offcanvas .offcanvas-header { padding: 19px 30px;}
.navbar .offcanvas .offcanvas-header .btn-close { margin-right: 0;}
.navbar .offcanvas .offcanvas-header .navbar-brand img { max-width: 250px;}
.navbar-toggler { border: 0; padding: 0 5px; font-size: 24px;}
.navbar-toggler:focus { box-shadow: none; }

.carousel .carousel-inner { text-align: center;}
.carousel .carousel-inner:after { position: absolute; width: 100%; height: 100%; background: #4d5c5f; opacity: .35;}
.carousel.no_desc .carousel-inner:after { content: none;}
.carousel .carousel-caption { top: 50%; transform: translateY(-50%); bottom: auto; padding: 0; text-shadow: 0 0 20px rgba(0, 0, 0, .5); z-index: 2; letter-spacing: 1px; }
.carousel .carousel-caption { top: 50%; transform: translateY(-50%); bottom: auto; padding: 0; text-shadow: 0 0 20px rgba(0, 0, 0, .5); z-index: 2; letter-spacing: 1px; }
.carousel .carousel-caption h1 { color: var(--base-white); font-size: 50px; text-transform: uppercase; line-height: 1; letter-spacing: 2px; padding-bottom: 5px;}
.carousel .carousel-caption p { font-size: 19px; padding-bottom: 25px;}
.carousel .carousel-caption a { color: var(--base-white); text-transform: uppercase; border-bottom: 1px solid; font-family: var(--base-font-bold);}
.carousel .carousel-item img { width: 100%;}

.accordion .accordion-item { border: 0;}
.accordion .accordion-header { border-bottom: 1px solid var(--base-gray);}
.accordion .accordion-button { padding: 25px 5px 20px; font-family: var(--base-font); text-transform: uppercase; color: var(--base-black); font-size: 16px; line-height: 24px; letter-spacing: 1px; font-weight: 600; word-spacing: 2px; box-shadow: none; background: transparent;}
.accordion .accordion-body { padding: 30px 5px 10px; color: var(--base-black-alt);}
.accordion .accordion-body .ttl_sm { padding-bottom: 10px;}
.accordion .accordion-body p + .ttl_sm { padding-top: 10px;}
.accordion .accordion-body a { border-bottom: 1px solid;}

.page_head { position: relative;}
.page_head:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: var(--base-black); opacity: .5;}
.page_head.no_desc:after { content: none;}
.page_head img { width: 100%;}
.page_head .caption { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 9;}
.page_head .caption h1 { color: var(--base-white); font-size: 50px; text-transform: uppercase; text-align: center; line-height: 1; letter-spacing: 2px; text-shadow: 0 0 20px rgba(0, 0, 0, .5);}
.page_head .caption h1.sm { font-size: 40px; text-transform: none; font-family: var(--base-font); font-weight: 600;}
.page_head.abt { height: calc(100vh - 100px); position: relative; overflow: hidden;}
.page_head.abt .caption h1 { font-size: 60px; text-transform: none; padding-bottom: 20px;}
.page_head.abt .caption p { color: var(--base-white); font-size: 22px; text-align: center; letter-spacing: 1px; text-shadow: 0 0 20px rgba(0, 0, 0, .5);}
.page_head.abt .about_bg { width: 100%; height: 100%; animation: move 40s ease; -ms-animation: move 40s ease; -webkit-animation: move 40s ease; -0-animation: move 40s ease; -moz-animation: move 40s ease; position: absolute; top: 0; left: 0; background-size: cover;}
@-webkit-keyframes move {
  0% {

    transform: scale(1.0);
    -ms-transform: scale(1.0);
    /* IE 9 */
    
    -webkit-transform: scale(1.0);
    /* Safari and Chrome */
    
    -o-transform: scale(1.0);
    /* Opera */
    
    -moz-transform: scale(1.0);
    /* Firefox */
  }
  100% {
    transform: scale(1.5);
    -ms-transform: scale(1.5);
    /* IE 9 */
    
    -webkit-transform: scale(1.5);
    /* Safari and Chrome */
    
    -o-transform: scale(1.5);
    /* Opera */
    
    -moz-transform: scale(1.5);
    /* Firefox */
  }
}

.product_ttl { font-family: var(--base-font); text-transform: uppercase; font-weight: 600; letter-spacing: 1px; padding: 25px 0 15px;}
.product_desc { color: var(--base-black-alt); letter-spacing: .2px;}
.product_var_ttl { font-size: 16px; text-transform: uppercase; letter-spacing: 2.5px; padding: 35px 0 15px; border-bottom: 1px solid var(--bs-border-color); margin-bottom: 10px;}
.product_acts { padding-top: 30px;}
.product_acts .btn { min-width: auto; font-size: 18px;}
.product_acts .btn-link { padding-left: 15px; padding-right: 0; text-transform: uppercase; letter-spacing: 1px; font-size: 16px;}
.product_acts .btn + .btn { margin-left: 10px;}
.variations { list-style: none; padding: 0; margin: 0 -10px; display: flex; flex-wrap: wrap;}
.variations li { margin: 10px; cursor: pointer;}
.variations.colors li img { border: 2px solid var(--bs-border-color); max-width: 64px;}
.variations.colors li.active img { border-color: var(--base-black); box-shadow: 0 0 10px rgba(0, 0, 0, .25);}
.variations.size { margin: 0 -20px;}
.variations.size li { margin: 10px 20px; width:85px; }
.variations.size p { text-align: center; font-size: 15px; color: var(--base-black-alt); padding-top: 12px; line-height: 22px;}
.sim_product { position: relative; cursor: pointer;}
.sim_product .sim_product_name { font-size: 22px; padding-top: 15px; line-height: 30px;}
.sim_product .sim_product_img { overflow: hidden;}
.sim_product .sim_product_img img { transition: var(--base-animation);}
.sim_product:hover img { transform: scale(1.1);}
.series-gallery .main-image-container { /*width: 100%; height: 690px;  display: flex; align-items: center; justify-content: center; background-color: #ffffff; overflow: hidden;*/}
.series-gallery .main-image { /*max-width: 100%; max-height: 100%; object-fit: contain; display: block;*/ width:100%; height:750px; }
.series-gallery .thumbnail-wrapper { display: flex; align-items: center; margin-top: 15px; justify-content: space-between;}
.series-gallery .thumbnails-container {display: flex; overflow: hidden; max-width: 440px; gap: 10px; scroll-behavior: smooth;}
.series-gallery .thumb { width: 80px; height: 80px; object-fit: cover; border: 2px solid var(--bs-border-color); cursor: pointer; transition: border 0.3s; }
.series-gallery .thumb.active { border-color: var(--base-black); }
.series-gallery .thumb-nav { background: none; border: none; font-size: 46px; width: 30px; cursor: pointer; padding: 0; text-align: center; opacity: .35; transition: var(--base-animation);}
.series-gallery .thumb-nav:hover { opacity: 1;}
.series-gallery .glightbox-container .gslide-image img { max-width: none !important; width: auto; height: auto; max-height: none !important; }

.form-control, .form-select { border-color: var(--base-black); border-radius: 0; font-size: 18px; letter-spacing: .5px; padding: 12px 15px; height: 52px;}
.form-control:focus, .form-select:focus { box-shadow: none; border-color: var(--base-black-alt);}
textarea.form-control { height: 150px; resize: none; }
.form-switch { font-weight: 600;}
.form-switch .form-check-input { margin-top: 2px;}
.form-switch .form-check-input { border-color: var(--base-gray); cursor:pointer; }
.form-switch .form-check-input:checked { background-color: var(--base-black); border-color: var(--base-black);}
.form-switch .form-check-input:focus { border-color: var(--base-gray); box-shadow: none; --bs-form-switch-bg :url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");}
.form-switch .form-check-input:checked:focus { --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");}

.coll_box { position: relative; overflow: hidden; cursor: pointer; margin-bottom: 10px;}
.coll_box .coll_name { position: absolute; font-size: 19px; color: var(--base-black); top: 50%; transform: translateY(-50%); padding: 0 15px; width: 100%; text-align: center; transition: var(--base-animation); z-index: 99; text-transform: lowercase;}
.coll_box .coll_name:after { content: ''; width: 94px; height: 4px; display: block; background: url(../images/divider.png) center no-repeat; margin: 5px auto 0;}
.coll_box img { transition: var(--base-animation);}
.coll_box:hover img { transform: scale(1.1);}
.coll_pagi .pagination { justify-content: center; margin: 15px 0 0;}
.coll_pagi .pagination .page-item { margin: 0 3px;}
.coll_pagi .pagination .page-item .page-link { border: 0; border-radius: 0; background: #ebebeb; color: var(--base-black-alt); width: 36px; text-align: center; padding: 10px 5px 5px; line-height: 21px; font-size: 20px; font-weight: 600; transition: var(--base-animation); box-shadow: none;}
.coll_pagi .pagination .page-item a { border: 0; border-radius: 0; background: #ebebeb; color: var(--base-black-alt); width: 36px; text-align: center; padding: 10px 5px 5px; line-height: 21px; font-size: 20px; font-weight: 600; transition: var(--base-animation); box-shadow: none; display:block;}
.coll_pagi .pagination .page-item .page-link i { font-size: 16px;}
.coll_pagi .pagination .page-item a i { font-size: 16px;}
.coll_pagi .pagination .page-item:not(.active) .page-link:hover { color: var(--base-black);}
.coll_pagi .pagination .page-item:not(.active) a:hover { color: var(--base-white); background: var(--base-black); }
.coll_pagi .pagination .page-item.active .page-link { color: var(--base-white); background: var(--base-black); font-weight: 600;}
.coll_pagi .pagination .page-item.active span { border: 0; border-radius: 0; background: var(--base-black); color: var(--base-white); width:36px; text-align:center; padding: 10px 5px 5px; line-height:21px; font-size:20px; font-weight: 600; transition: var(--base-animation); box-shadow: none; display:block;}

.collections .coll_box { margin-bottom: 20px;}
.collections .coll_box .coll_name { position: static; transform: translateY(0); padding: 20px 0 0; text-align: left; font-size: 24px; text-transform: none;}
.collections .coll_box .coll_name:after { content: none;}
.collections .coll_box .coll_img { max-height: 400px; position: relative; overflow: hidden;}
.collections .coll_box .coll_img .coll_img_cont { position: relative; width: 100%; padding-top: 100%; overflow: hidden;}
.collections .coll_box .coll_img .coll_img_cont .coll_img_wrap { position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%);}
.collections .coll_box .coll_img .coll_img_cont .coll_img_wrap img { object-fit: cover; object-position: center; width: 100%; height: 400px;}
.collections .coll_box .coll_img .coll_btns { position: absolute; width: 100%; text-align: center; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: var(--base-animation); opacity: 0;}
.collections .coll_box .coll_img .coll_btns .btn { min-width: auto; font-size: 17px; padding: 5px 15px 2px; margin: 0 5px;}
.collections .coll_box .coll_img:hover .coll_btns { opacity: 1;}

.collections .coll_box.h-sm .coll_img { max-height: 250px;}
.collections .coll_box.h-sm .coll_img .coll_img_cont .coll_img_wrap img { height: 250px;}
.collections .coll_box.h-md .coll_img { max-height: 350px;}
.collections .coll_box.h-md .coll_img .coll_img_cont .coll_img_wrap img { height: 350px;}
.collections .grid-sizer {width: 33.3333%;}

.coll_filter { margin: 5px 0 50px;  position: relative;}
.coll_filter ul { margin: 0; padding: 0 35px 0 0; list-style: none; display: flex; flex-wrap: wrap; column-gap: 20px; row-gap: 8px; position: relative; }
.coll_filter ul .search { position: absolute; right: 5px; top: 2px;}
.coll_filter ul li a { color: var(--base-black-alt); border-bottom: 1px solid transparent; font-family: var(--base-font-bold); font-size: 17px; text-transform: uppercase; letter-spacing: 3px;}
.coll_filter ul li a:hover, .coll_filter ul li.active a { color: var(--base-black); border-color: var(--base-black);}
.coll_filter .coll_cats_btn { display: none; align-items: center; padding: 0; font-size: 20px; font-weight: 600;}
.coll_filter .coll_cats_btn i { padding-right: 10px; font-size: 32px;}
.coll_filter .search-container { display: flex; align-items: center; position: absolute; right: 0; top: -5px;}
.coll_filter .search-container.active { background: var(--base-white); padding-left: 12px;}
.coll_filter .search-container .search-input { width: 0; opacity: 0; padding: 5px 0; border: 0; border-bottom: 1px solid var(--base-black); transition: var(--base-animation); outline: none; background: transparent;}
.coll_filter .search-container.active .search-input { width: 250px; opacity: 1; margin-left: 15px;}
.coll_filter .search-container .icon-button { background: none; border: none; cursor: pointer; font-size: 20px;}
.coll_filter .search-container .search-icon { padding: 0; line-height: 1;}
.coll_filter .search-container .close-icon { display: none;}
.coll_filter .search-container.active .close-icon { display: block; position: absolute; right: 0; top: 7px; z-index: 9999; font-size: 24px; line-height: 1;}
.coll_filter .search-container .icon-button:focus { outline: none;}

.slider_cats .coll_cats { margin: 0; padding: 0; list-style: none;}
.slider_cats .coll_cats li { font-size: 16px; font-family: var(--base-font-bold); text-transform: uppercase; margin: 10px 5px; letter-spacing: 2.5px;}
.slider_cats .coll_cats li a { color: var(--base-gray); padding: 7px 0 0; display: inline-flex;}
.slider_cats .coll_cats li a:hover { color: var(--base-black);}
.slider_cats .coll_cats li.active a { color: var(--base-black); border-bottom: 1px solid;}

.filter { position: relative; margin-bottom:10px; }
.filter .filter-btn { display: flex; justify-content: space-between; border-bottom: 1px solid var(--base-gray); padding-bottom: 5px; margin-bottom: 5px; font-weight: 700; cursor: pointer;}
.filter .filter-btn i { font-size: 23px;}
.filter .filter-dropdown { display: none; position: absolute; top: 40px; left: 10px; background: #f7f7f7; border: 1px solid #ccc; padding: 15px; z-index: 100; width: calc(100% - 20px); min-height: 10px; max-height: 250px; overflow: auto;}
.filter .filter-item { display: flex; cursor: pointer; margin-bottom: 10px; font-size: 16px; font-weight: 600;}
.filter .filter-item:last-child { margin-bottom: 0;}
.filter .filter-item input[type="checkbox"] { -webkit-appearance: none; appearance: none; margin-right: 10px; width: 18px; height: 18px; border: 1px solid var(--base-black);}
.filter .filter-item input[type="checkbox"]::before { content: ""; display: block; width: 10px; height: 10px; margin: 3px; transform: scale(0); transition: 120ms transform ease-in-out; box-shadow: inset 1em 1em var(--base-black);}
.filter .filter-item input[type="checkbox"]:checked::before { transform: scale(1);}
.filter-active { padding-bottom: 30px; margin-top: -15px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-weight: 600; }
.filter-active .badge { position: relative; transition: var(--base-animation); padding: 8px 35px 5px 13px;}
.filter-active .badge a:hover { opacity: .75;}
.filter-active .badge a i { background: var(--base-gray); width: 24px; height: 27px; line-height: 33px; font-size: 18px; position: absolute; top: 0; right: 0; border-radius: 0 4px 4px 0;}

.box_new { position: relative; overflow: hidden; margin-bottom: 16px; cursor: pointer;}
.box_new:after { content: ''; width: 100%; height: 100%; background: var(--base-black); position: absolute; left: 0; top: 0; opacity: 0; transition: var(--base-animation); pointer-events: none; }
.box_new:hover:after { opacity: .2;}
.box_new .pro_name { position: absolute; font-size: 18px; color: var(--base-white); top: 50%; width: 100%; text-align: center; opacity: 0; transition: var(--base-animation); z-index: 99;}
.box_new:hover .pro_name { opacity: 1;}
.box_new img { transition: var(--base-animation);}
.box_new:hover img { transform: scale(1.1);}

.about { padding-top: 80px; position: relative;}
.about:after { content: ''; width: 100%; height: 35%; background: #f2f2f2; position: absolute; top: 0; left: 0; z-index: -1;}

.blog .ttl { padding-bottom: 30px;}
.blog .col-sm-4 { margin-bottom: 50px;}
.blog .coll_pagi .pagination { margin: 0;}
.blog .blog_detail { color: var(--base-black-alt); }
.blog .blog_detail .ttl { padding-bottom: 5px;}
.blog .blog_detail h3, .blog .blog_detail h4, .blog .blog_detail h5 { font-weight: 400; padding-bottom: 15px;}
.blog .blog_detail p + h3, .blog .blog_detail p + h4, .blog .blog_detail p + h5 { padding-top: 20px;}
.blog .blog_detail img + h3, .blog .blog_detail img + h4, .blog .blog_detail img + h5 { padding-top: 30px;}
.blog .blog_detail h3 { font-size: 22px;}
.blog .blog_detail h4 { font-size: 20px;}
.blog .blog_detail .blog_meta { padding-bottom: 20px; font-weight: 600; letter-spacing: .5px;}
.blog .blog_detail .blog_meta span { margin: 0 5px;}
.blog .blog_detail .blog_meta span:first-child { margin-left: 0;}
.blog .blog_detail .blog_meta a { border-bottom: 1px  solid transparent; color: var(--base-black-alt);}
.blog .blog_detail .blog_meta a:hover { border-color: var(--base-black); color: var(--base-black);}
.blog .blog_detail img { padding: 20px 0;}
.blog .blog_detail .share, .blog .blog_detail .author { display: flex; align-items: center; justify-content: right; border-top: 1px solid var(--base-gray); border-bottom: 1px solid var(--base-gray); padding: 27px 0 25px; margin-top: 25px;}
.blog .blog_detail .share h4, .blog .blog_detail .author h4 { letter-spacing: 2px; text-transform: uppercase; font-size: 16px; padding: 5px 0 0;}
.blog .blog_detail .share .share_media { list-style: none; margin: 0; padding-left: 25px; display: flex; gap: 20px;}
.blog .blog_detail .share .share_media a { font-size: 24px; line-height: 1; display: flex; color: var(--base-black-alt);}
.blog .blog_detail .share .share_media a:hover { color: var(--base-black);}
.blog .blog_detail .author { justify-content: left; padding: 0; gap: 0px;}
.blog .blog_detail .author img { padding: 0;}
.blog .blog_detail .author .author_name p { padding: 0; font-size: 15px; line-height: 1.4;}
.blog-listing .image-container { position: relative; width: 100%; overflow: hidden; cursor:pointer; }
.blog-listing .image-container img { width: 100%; height: auto; display: block; }
.blog-listing .overlay { position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.4);z-index: 1; }
.blog-listing .top-left-text { position: absolute;top: 8px;left: 8px;color: #FFF;font-size: 16px;padding: 3px 6px;border-radius: 3px;z-index: 2; font-weight:600; }
.blog-listing .top-right-text { position: absolute;top: 8px;right: 8px;color: #FFF;font-size: 16px;padding: 3px 6px;border-radius: 3px;z-index: 2; font-weight:600; }
.blog-listing .bottom-overlay { position: absolute;bottom: 0;left: 0;width: 100%;padding: 8px 10px;font-weight: 600;font-size: 23px;background: transparent;color: white;text-align: left;z-index: 2; }
.blog-listing .image-link { text-decoration: none;color: inherit;display: block;position: relative; }

main .cta { padding-top: 120px; padding-bottom: 120px; background: url(/Themes/ClassicCeramicTile/Content/images/cta.jpg) center no-repeat; background-size: cover; position: relative;}
main .cta:after { content: ''; width: 100%; height: 100%; background: var(--base-black); position: absolute; top: 0; z-index: 0; opacity: .65; }
main .cta .ttl_md { text-align: center; color: var(--base-white); max-width: 1150px; line-height: 1.45; letter-spacing: 1px; margin: 0 auto; text-shadow: 0 0 20px rgba(0, 0, 0, .5); z-index: 9; position: relative;}

.offcanvas.slider_form { width: 600px; border: 0;}
.offcanvas.slider_form_large { width: 800px; border: 0;}
.offcanvas .offcanvas-header { padding: 30px;}
.offcanvas .offcanvas-header h3 { font-family: var(--base-font); text-transform: uppercase; font-weight: 600; letter-spacing: 1.5px; font-size: 24px;}
.offcanvas .offcanvas-header .btn-close { font-size: 18px; margin-right: 5px;}
.offcanvas .offcanvas-header .btn-close:focus { box-shadow: none;}
.offcanvas .offcanvas-body { padding: 0 30px 30px;}
.offcanvas .btn { font-size: 18px; min-width: auto;}
.offcanvas .offcanvas-footer { padding: 0 30px 30px;}
.offcanvas .ttl_bg { background: var(--base-gray-bg); padding: 15px 30px 10px; margin: 0px -30px 25px; font-family: var(--base-font); text-transform: uppercase; font-weight: 600; letter-spacing: 1px; font-size: 18px;}

.offcanvas.slider_login { width: 500px; border: 0; font-weight: 600;}
.offcanvas.slider_login .btn { min-width: 175px;}
.offcanvas.slider_login .login:not(.hide) { display: flex;}
.offcanvas.slider_login .login { flex-direction: column; justify-content: space-between; min-height: calc(100vh - 120px); gap: 50px;}
.offcanvas.slider_login .login .why_login .ttl { text-transform: none; font-size: 24px; padding-bottom: 15px;}
.offcanvas.slider_login .login .why_login ul { margin: 0; padding: 0; list-style: none;}
.offcanvas.slider_login .login .why_login ul li { padding: 3px 0; display: flex; align-items: center; gap: 8px;}
.offcanvas.slider_login .login .why_login ul li:before { content: "\f270"; font-family: bootstrap-icons !important; font-size: 20px; line-height: 1; position: relative; top: -2px;}
.offcanvas.slider_login .login .cta_register { background-color: var(--base-black); color: var(--base-white); padding: 40px 30px;}
.offcanvas.slider_login .login .cta_register .ttl { color: #FFF; padding-bottom: 5px; letter-spacing: 1px; font-size: 30px;}
.offcanvas.slider_login .login .cta_register p { padding-bottom: 20px;}
.offcanvas.slider_login .login .cta_register .btn { background-color: var(--base-white); color: var(--base-black); border-color: var(--base-white);}
.offcanvas.slider_login .login .cta_register .btn:hover { background-color: var(--base-black); color: var(--base-white); border-color: var(--base-white);}

.boxes .box { margin-bottom: 25px;}
.box { height: 100%; transition: 200ms; border: 1px solid var(--base-gray-line); background-color: var(--base-gray-bg); padding: 20px; min-height: 150px; position: relative;}
.box .badge { border-radius: 5px 5px 0 0; position: absolute; bottom: -1px; left: 50%; transform: translate(-50%, 0); padding: 8px 10px 5px;}
.box .top-part { border-bottom: 1px solid var(--bs-border-color); padding: 0 0 15px;}
.box .top-part .controls { font-size: 18px;}
.box .top-part .controls .badge { position: relative; left: -10px; top: -3px; transform: translate(0, 0); font-size: 12px; text-transform: uppercase; border-radius: 4px;}
.box .top-part .controls i.bi-key { font-size: 20px;}
.box .other-details { padding: 20px 0 10px; border-top: 1px solid var(--base-white); position: relative; letter-spacing: 0.25px;}
.box .other-details.pb_0 { padding-bottom: 0;}
.box .other-details .table > thead th, .box .other-details .table > tfoot th, .box .other-details .table > tbody td { background: transparent; padding-left: 5px;}
.box .other-details .table > thead th { border-bottom: 1px solid var(--bs-border-color); padding-top: 5px;}
.box .other-details .table > tfoot th { border-bottom: 0;}
.box .other-details .lists { position: relative; padding: 5px 0 5px 30px; overflow: hidden; text-overflow: ellipsis;}
.box .other-details .lists i:not(.act) { position: absolute; left: 0; top: 6px; font-size: 18px; opacity: 0.8;}
.box .other-details .lists.phn_email span { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 10px; padding-bottom: 6px; border-bottom: 1px solid var(--base-gray-line);}
.box .other-details .lists.phn_email span:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0;}

.color_list { row-gap: 20px;}
.color_list .color_name { text-align: center; padding: 10px 0 0; font-family: var(--base-font); font-weight: 600;}
.color_list .form-check { padding: 0; margin: 0; position: relative; cursor: pointer;}
.color_list .form-check .form-check-input { position: absolute; margin: 0; left: 10px; top: 10px; width: 22px; height: 22px; border-radius: 0; border-color: var(--base-black); box-shadow: none;}
.color_list .form-check .form-check-input:checked { background-color: var(--base-black);}
.color_list .form-check i { position: absolute;padding: 2px 5px 0px 5px;background: #fff;color: #000;margin: 8px;border: 1px solid #000;font-size: 13px; }

.social { display: flex; list-style: none; padding: 0; margin: 0; gap: 15px;}
.social li a { font-size: 26px;}
.request_success { display: flex; flex-direction: column; align-items: center; height: 100%; justify-content: center;}
.request_success .ttl { line-height: 1; margin: 0; padding: 0 0 5px; font-size: 16px; }
.request_success i { font-size: 40px; padding-bottom: 20px;}
.embed-container { position: relative; padding-bottom: 40%; height: 0; overflow: hidden; max-width: 100%; }
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.form_line {}
.form_line .form-label { text-transform: uppercase; font-size: 16px; letter-spacing: 3px; font-weight: 600; margin: 0;}
.form_line .form-control, .form_line .form-select { padding: 0; border: 0; border-bottom: 1px solid var(--base-black); height: 36px; font-weight: 600;}
.form_line .form-select { padding: 0 5px;}
.form_line textarea.form-control { height: 150px;}
.input-validation-error {border-bottom: 1px solid #FF0000 !important;}

.reset_box { max-width: 500px; margin: 0 auto;}
.reset_box .icon { font-size: 60px;}
.reset_box .ttl { padding-bottom: 5px;}
.reset_box .ttl + p { padding-bottom: 25px;}
.reset_box .btn { width: 100%;}

.slider_inspiration { position: relative; margin: 0 -10px 0 20px;}
.slider_inspiration .carousel-container { position: relative; overflow: hidden;}
.slider_inspiration .carousel-track { display: flex; transition: transform 0.5s ease-in-out;}
.slider_inspiration .carousel-slide { flex: 0 0 33.3333%; }
.slider_inspiration .carousel-slide img { max-width: 100%; display: block;}
.slider_inspiration .carousel-slide .content { position: relative; margin: 0 10px;}
.slider_inspiration .carousel-slide .content .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; color: #fff; background: rgb(0 0 0 / .2); display: flex; flex-direction: column; justify-content: center; align-items: center; overflow: hidden; cursor: pointer;}
.slider_inspiration .carousel-slide .content .coll_name { position: relative; text-transform: uppercase; color: var(--base-white); font-size: 22px; line-height: 36px; letter-spacing: 1px; text-shadow: 0 5px 10px #000;}
.slider_inspiration .carousel-slide .content .coll_name:after { content: ""; position: absolute; top: 100%; right: 0; height: 1px; background: #fff; width: 300px; opacity: 0; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; -ms-transition: opacity 0.3s; -o-transition: opacity 0.3s; transition: opacity 0.3s;}
.slider_inspiration .carousel-slide .content:hover .coll_name:after { opacity: 1;}
.slider_inspiration .arrow { position: absolute; top: 50%; transform: translateY(-50%); color: #333; background: transparent; border: none; padding: 0; cursor: pointer; font-size: 60px; z-index: 1;}
.slider_inspiration .arrow.prev { left: -40px;}
.slider_inspiration .arrow.next { right: -40px;}
.slider_inspiration .dots { text-align: center; margin-top: 15px;}
.slider_inspiration .dots .dot { height: 12px; width: 12px; margin: 0 5px; background-color: #bbb; border-radius: 50%; display: inline-block; cursor: pointer;}
.slider_inspiration .dots .dot.active { background-color: #333; }

.alert { position: fixed; top: 105px; left: 50%; transform: translate(-50%, 0); z-index: 99; margin: 0; display: flex; align-items: center; font-weight: 600; font-size: 17px; max-width: 350px; padding: 15px 45px 15px 15px;}
.alert i { font-size: 24px; line-height: 24px; margin-right: 8px;}
.alert .btn-close { font-size: 13px; position: absolute; right: 5px; top: 10px; padding: 10px; box-shadow: none;}
.alert-success { border-color: #3fbf62; background-color: #ebf7ee;}
.alert-success i { color: #3fbf62;}
.alert-danger { border-color: #d8254a; background-color: #ffe7ec;}
.alert-danger i { color: #d8254a;}

.modal .modal-dialog { max-width: 600px;}
.modal .modal-dialog.sm { max-width: 450px;}
.modal .modal-content { border-radius: 0; border: 0;}
.modal .modal-content .modal-header { background-color: var(--base-gray-bg); padding: 25px; border: 0;}
.modal .modal-content .modal-header .btn-close { opacity: 0.5; transition: var(--base-animation);}
.modal .modal-content .modal-header .btn-close:hover { opacity: 1;}
.modal .modal-content .modal-header .btn-close:focus { box-shadow: none;}
.modal .modal-content .modal-header .modal-title { font-size: 24px; line-height: 1; top: 3px; text-transform: uppercase; position: relative;}
.modal .modal-content .modal-body { padding: 30px 25px;}
.modal .modal-content .btn { min-width: 125px; font-size: 18px;}
.modal .modal-content .btn-group { display: flex;}
.modal .modal-content .btn-group .btn { font-size: 17px;}

.btn-group { gap: 5px; padding: 5px; background: var(--base-gray-bg); border: 1px solid var(--base-gray-line); border-radius: 0;}
.btn-group .btn { font-size: 17px; border: 0;}
.btn-group .btn:hover { background: var(--base-white) !important; color: var(--base-black);}
.btn-group .btn-check:checked + .btn { background: var(--base-black) !important; color: var(--base-white);}

.account_box { background: var(--base-white); border: 1px solid var(--base-gray-line); box-shadow: 0 0 15px rgb(0 0 0 / 10%); border-radius: 10px; font-weight: 600;}
.account_box .account_menu { flex-direction: row; border-bottom: solid 1px var(--base-gray-line); padding: 20px 25px 0;}
.account_box .account_menu li { margin: 0 5px;}
.account_box .account_menu li a { padding: 8px 10px; color: var(--base-gray); font-size: 17px; font-weight: 600; border-bottom: 3px solid transparent; display: block;}
.account_box .account_menu li a.active, .account_box .account_menu li a:hover { color: var(--base-black);}
.account_box .account_menu li a.active { border-color: var(--base-black);}
.account_box .account_content { padding: 30px; font-size: 16px;}
.account_box .account_content .box .name { font-size: 18px; line-height: 25px; display: flex; gap: 10px;}
.account_box .account_content .box .name .default { width: 9px; height: 9px; display: inline-block; background: green; border-radius: 50%; position: relative; top: -1px;}
.account_box .account_content .ttl { font-size: 18px; text-transform: uppercase; padding-bottom: 20px; letter-spacing: 1px;}
.account_box .account_content .account_ttl { font-size: 22px; border-bottom: 1px solid var(--base-gray-line); margin-bottom: 20px; padding-bottom: 10px;}
.account_box .account_content .coll_box { margin-bottom: 30px;}
.account_box .account_content .coll_box .coll_img { overflow: hidden;}
.account_box .account_content .coll_box .coll_img .remove { position: absolute; right: 10px; top: 10px; font-size: 18px; width: 40px; line-height: 36px; text-align: center; background: var(--base-black); color: var(--base-white); border: 2px solid;}
.account_box .account_content .coll_box .coll_img .remove i { position: relative; top: 4px;}
.account_box .account_content .coll_box .coll_name { position: static; transform: none; text-align: left; padding: 20px 0 0; text-transform: none; font-size: 20px;}
.account_box .account_content .coll_box .coll_name:after { content: none;}
.account_box .account_content .coll_pagi .pagination { margin: 5px 0 15px;}

.footer { color: var(--base-gray); padding: 0 0 80px; font-family: var(--base-font-bold);}
.footer .container > .row { position: relative;}
.footer .container > .row:before { content: ''; width: 100%; height: 1px; background: #d2d2d2; display: block; margin: 0 13px 80px;}
.footer a { color: var(--base-gray);}
.footer a:hover { color: var(--base-black);}
.footer p { font-size: 19px; line-height: 1.4; padding-bottom: 5px; font-weight: normal;}
.footer .foot_ttl { color: var(--base-black); font-size: 16px; text-transform: uppercase; padding-bottom: 20px; letter-spacing: 3px;}
.footer .social { padding-top: 5px;}
.footer .nav {}
.footer .nav .nav-item { padding: 3px 0; font-size: 19px;}
.footer .nav .nav-item a { display: inline-block; padding: 0; line-height: 1.3; font-size: 20px;}
.footer .nav.two-col { flex-direction: row !important; column-gap: 14px;}
.footer .nav.two-col .nav-item { width: calc(50% - 10px);}
.footer .subscribe { padding-top: 10px;}
.footer .subscribe .btn { width: 100%; margin-top: 10px;}
.footer .message { padding-top: 10px; color: green; }
.footer .message i { margin-right: 10px; }

.offcanvas.slider_menu { width: 100%; border: 0;}
.offcanvas.slider_menu .navbar-nav .nav-item { margin: 0;}
.ga-DaEy { max-width:100% !important; }

.g-50 { margin: 0 -25px;}
.g-50>* { padding-left: 25px; padding-right: 25px;}
.g-30 { margin: 0 -15px;}
.g-30>* { padding-left: 15px; padding-right: 15px;}
.g-20 { margin: 0 -10px;}
.g-20>* { padding-left: 10px; padding-right: 10px;}
.g-10 { margin: 0 -5px;}
.g-10>* { padding-left: 5px; padding-right: 5px;}
.g-xs { margin: 0 -8px;}
.g-xs>* { padding-left: 8px; padding-right: 8px;}

.bg { background-color: var(--base-gray-bg); }
.pad { padding-top: 80px; padding-bottom: 80px;}
.profile-pad { padding-top: 40px; padding-bottom: 40px;}
.pt_10 { padding-top: 10px !important;}
.pt_20 { padding-top: 20px;}
.pt_30 { padding-top: 30px;}
.pt_40 { padding-top: 40px;}
.pt_50 { padding-top: 50px;}
.pt_80 { padding-top: 80px;}
.pb_5 { padding-bottom: 5px;}
.pb_0 { padding-bottom: 0px;}
.pb_10 { padding-bottom: 10px;}
.pb_20 { padding-bottom: 20px;}
.pb_25 { padding-bottom: 25px !important;}
.pb_30 { padding-bottom: 30px;}
.pb_35 { padding-bottom: 35px;}
.pb_40 { padding-bottom: 40px;}
.pb_50 { padding-bottom: 50px;}
.pb_80 { padding-bottom: 80px;}
.pb_100 { padding-bottom: 100px;}
.pb_125 { padding-bottom: 125px;}
.pb_150 { padding-bottom: 150px;}
.pl_20 { padding-left: 20px;}
.ml_15 { margin-left: 15px;}
.ml_5 { margin-left: 5px;}
.show_lg { display: none;}
.mb__40 { margin-bottom: -40px;}
.row_gap_20 { row-gap: 20px;}
.ml_25 { margin-left: 25px !important; }
.mt_95 { margin-top:100px !important; }
.mb_30 { margin-bottom: 30px;}
.mb_40 { margin-bottom: 40px;}
.bold { font-weight:600 !important; }
.hide { display:none !important; }
.red { color: #FF0000; }
.green { color: green; }

.text-right { text-align: right;}
.text-center { text-align: center;}
.f_light { color: var(--base-black-alt);}
.f_20 { font-size: 20px; line-height: 30px;}

.container { max-width: 2000px; padding-left: 50px; padding-right: 50px;}
.placeholder { width: 65%; border-radius: 4px; background: var(--base-gray);}
.grid-item {float: left;}

/*Spinner Start*/
#divLoadingSpinner { position: relative; top: 0; width: 100%; background: rgba(0,0,0,0.4); z-index: 9999; text-align: center; left: 0; }
#divLoadingSpinner.off { display: none !important; }
#divLoadingSpinner .wrapper { position: absolute; left: 50%; top: 50%; margin: -100px; background-color: transparent; border: none; }
#divLoadingSpinner .loader { border: 16px solid #2D2D2D; border-top: 16px solid #FFFFFF; border-radius: 50%; width: 120px; height: 120px; animation: spin 2s linear infinite; }
@keyframes spin { 0% { transform: rotate(0deg); }  100% { transform: rotate(360deg); } }
/*Spinner End*/

@media (max-width:1199px){
    .navbar .dropdown-menu { left: -100px;}
    .container { padding-left: 30px; padding-right: 30px;}
    .ttl { font-size: 30px;}
    .ttl_md { font-size: 24px; line-height: 1.4; padding-bottom: 12px;}
    .subttl { font-size: 20px; letter-spacing: 1px;}
    .blog_ttl, .ttl_sm { font-size: 18px;}
    .footer p, .footer .nav .nav-item a { font-size: 18px;}
    .hide_lg { display: none;}
    .show_lg { display: block;}
    .navbar .navbar-nav .nav-item .nav-link { padding: 10px 2px;}
    .carousel .carousel-caption h1, .page_head .caption h1, .page_head.abt .caption h1 { font-size: 42px;}
    .carousel .carousel-caption p { font-size: 18px; padding-bottom: 20px;}
    .g-50 { margin: 0 -15px;}
    .g-50>* { padding-left: 15px; padding-right: 15px;}
    .series-gallery .main-image-container { height: 400px;}
    .series-gallery .main-image-container img { height:400px; }
    .product_ttl { font-size: 26px;}
    .sim_product .sim_product_name { font-size: 20px;}
}

@media (max-width:991px){    
    .arrow { display: none !important; }
    .btn { min-width: auto; padding: 10px 20px 7px; font-size: 18px;}
    .slider_inspiration { margin: 30px -10px 0;}
    .col_rev_ipad { flex-direction: column-reverse;}
    .pb_ip_15 { padding-bottom: 15px;}
    .pb_ip_30 { padding-bottom: 30px;}
    .pb_ip_40 { padding-bottom: 40px;}
    .pb_ip_50 { padding-bottom: 50px;}
    .pb_ip_60 { padding-bottom: 60px;}
    .pl_ip_8 { padding-left: 8px;}
    .page_head.abt .caption h1 { font-size: 36px; padding-bottom: 15px;}
    .page_head.abt .caption p, .collections .coll_box .coll_name { font-size: 20px;}
    .blog .blog_detail .ttl { font-size: 24px; line-height: 30px; padding-bottom: 10px;}
    .blog .blog_detail .blog_meta { font-size: 17px;}
    .series-gallery .main-image-container { height: 500px;}
    .series-gallery .main-image-container img { height: 500px;}
    .sim_product .sim_product_name { font-size: 18px;}
    .coll_filter { margin-bottom: 30px;}
    .coll_filter .coll_cats { display: none;}
    .coll_filter .coll_cats_btn { display: flex;}
}

@media (max-width:767px){
    .modal .modal-dialog { max-width: 90%;}
    .container { padding-left: 20px; padding-right: 20px; max-width: none;}
    .pad { padding-top: 60px; padding-bottom: 60px;}
    .about { padding-top: 60px;}
    .footer { padding-bottom: 60px;}
    .footer .container > .row:before { margin: 0 13px 60px;}
    .slider_inspiration .carousel-slide { flex: 0 0 100%; }
    .g-xxs_ph { margin: 0 -5px;}
    .g-xxs_ph>* { padding-left: 5px; padding-right: 5px;}
    .sim_product:not(.last) { padding-bottom: 25px;}
    .page_head.abt { height: 60vh;}
    .blog .blog_detail .share, .blog .blog_detail .author { justify-content: left;}
    .blog .blog_detail p + h3, .blog .blog_detail p + h4, .blog .blog_detail p + h5 { padding-top: 20px;}
    .subttl.sm { font-size: 18px; letter-spacing: 0.5px;}
    .series-gallery .main-image-container { height: 400px;}
    .series-gallery .main-image-container img { height: 400px;}
    .offcanvas.slider_login .login .cta_register { padding: 35px 25px;}
    .offcanvas.slider_login .login .cta_register .ttl { font-size: 25px; letter-spacing: .5px;}
    .offcanvas.slider_login .btn { min-width: 125px;}
    .account_box .account_menu { flex-direction: column; padding: 20px 15px;}
    .account_box .account_content { padding: 20px;}
    .color_list .color_name { font-size: 14px;}
    .color_list .form-check .form-check-input { width: 18px; height: 18px;}
}

@media (max-width:575px){   
    body p, .footer p, .footer .nav .nav-item a { font-size: 17px; line-height: 26px;}
    .navbar .navbar-brand img { max-width: 220px;}
    .ttl { font-size: 24px;}
    .ttl_md { font-size: 20px; line-height: 32px;}
    .subttl { font-size: 18px;}
    .carousel .carousel-inner:after { content: none;}
    .carousel .carousel-caption { position: static; background: rgba(0, 0, 0, .5); transform: none; padding: 30px 20px 50px; margin: 0 -20px;}
    .carousel .carousel-caption h1 { font-size: 30px;}
    .carousel .carousel-caption p { font-size: 17px; padding-bottom: 10px;}
    .carousel .carousel-control-next, .carousel .carousel-control-prev { padding: 0 0 12px 0; align-items: flex-end;}
    .page_head .caption h1 { font-size: 30px; padding-top: 10px;}
    main .cta { padding-top: 80px; padding-bottom: 80px;}
    main .cta .ttl_md { padding-bottom: 0;}
    .pb_ph_20 { padding-bottom: 20px;}
    .pb_ph_30 { padding-bottom: 30px;}
    .pb_ph_40 { padding-bottom: 40px;}
    .footer .pb_ip_30 { padding-bottom: 35px;}
    .footer .foot_ttl { padding-bottom: 15px;}
    .footer .nav.two-col_ph { flex-direction: row !important; column-gap: 14px;}
    .footer .nav.two-col_ph .nav-item { width: calc(50% - 10px);}
    .page_head.abt { height: 40vh;}
    .page_head.abt .caption h1 { font-size: 30px; letter-spacing: 1.5px; line-height: 38px; padding-bottom: 10px;}
    .page_head.abt .caption p { font-size: 17px;}
    .blog .blog_detail .ttl, .product_ttl { font-size: 22px; line-height: 28px;}
    .blog .blog_detail h3 { font-size: 20px; line-height: 28px;}
    .series-gallery .main-image-container { height: 200px;}
    .series-gallery .main-image-container img { height: 200px;}
    .blog .blog_detail .author { border-bottom: none; }
    .blog .blog_detail .share { margin-top: 10px; }
    .collections .coll_box.h-sm .coll_img, .collections .coll_box .coll_img { max-height: 350px;}
    .collections .coll_box.h-sm .coll_img .coll_img_cont .coll_img_wrap img, .collections .coll_box .coll_img .coll_img_cont .coll_img_wrap img { height: 350px;}
    .mt_95 { margin-top:85px !important; }
    .modal .modal-dialog { max-width: none;}
}

::-webkit-scrollbar { width: 10px; height: 10px;}
::-webkit-scrollbar-track { background: #dddddd;}
::-webkit-scrollbar-thumb { background: #4c4c4c;}
::-webkit-scrollbar-thumb:hover { background: #363636;}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; }