@font-face {
font-family: 'Font Awesome 5 Regular';
src: url(//www.pcn.co.th/wp-content/themes/pcncoth/assets/font/font_awesome_5_free-regular-400.woff2) format('woff2'),
url(//www.pcn.co.th/wp-content/themes/pcncoth/assets/font/font_awesome_5_free-regular-400.woff) format('woff');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Font Awesome 5 Free';
src: url(//www.pcn.co.th/wp-content/themes/pcncoth/assets/font/font_awesome_5_free-solid-900.woff2) format('woff2'),
url(//www.pcn.co.th/wp-content/themes/pcncoth/assets/font/font_awesome_5_free-solid-900.woff) format('woff');
font-weight: 900;
font-style: normal;
}
body {
font-family: 'prompt'; }
* {
outline: none !important;
text-decoration: none !important;
}
.btn.focus, .btn:focus {
box-shadow: unset;
}
.site-main {
margin-bottom: 0;
}
.col-full {
max-width: 100%;
margin: 0;
padding: 0;
}
@media (min-width: 768px) {
.right-sidebar .content-area {
width: 100%;
margin: 0;
}
}
@media (min-width: 1200px) {
.container {
max-width: 1360px;
}
}
img {
border-radius: 0px;
}
.text-ellipsis-2-wd {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical; }
.text-ellipsis-2 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
} .awesome-bold {
font-family: 'Font Awesome 5 Free';
font-weight: bold;
}
.font-12 {
font-size: 12px;
}
.font-14 {
font-size: 14px;
}
.font-18 {
font-size: 18px !important;
}
.font-20 {
font-size: 20px !important;
}
.font-gray {
color: #999999;
}
.font-black {
color: #000000 !important;
}
.font-orange  {
color: #f05b28;
}
.font-italic {
font-style: italic;
}
.font-light {
font-weight: 300;
}
.font-medium {
font-weight: 500;
}
.black-lightitalic-14 {
color: #000000;
font-size: 14px;
font-weight: 300;
font-style: italic;
}
.black-lightitalic-16 {
color: #000000;
font-size: 16px;
font-weight: 300;
font-style: italic;
}
.black-18 {
color: #000000;
font-size: 18px;
font-weight: 400;
}
.black-light-19 {
color: #000000;
font-size: 19px;
font-weight: 300;
}
.black-20 {
color: #000000;
font-size: 20px;
font-weight: 400;
}
.black-lightitalic-20 {
color: #000000;
font-size: 20px;
font-weight: 300;
font-style: italic;
}
.black-medium-16 {
color: #000000;
font-size: 16px;
font-weight: 500;
}
.black-medium-18 {
color: #000000;
font-size: 18px;
font-weight: 500;
}
.black-medium-20 {
color: #000000;
font-size: 20px;
font-weight: 500;
}
.black-italic-25 {
color: #000000;
font-size: 25px;
font-style: italic;
}
.black-medium-25 {
color: #000000;
font-size: 25px;
font-weight: 500;
}
.black-light-25 {
color: #000000;
font-size: 25px;
font-weight: 300;
}
.black-light-26 {
color: #000000;
font-size: 26px;
font-weight: 300;
}
.black-medium-30 {
color: #000000;
font-size: 30px;
font-weight: 500;
}
.black-35 {
color: #000000;
font-size: 35px;
font-weight: 400;
}
.black-medium-35 {
color: #000000;
font-size: 35px;
font-weight: 500;
}
.black-medium-50 {
color: #000000;
font-size: 50px;
font-weight: 500;
}
.black-medium-40 {
color: #000000;
font-size: 40px;
font-weight: 500;
}
.blue-18 {
color: #164bac;
font-size: 18px;
font-weight: 400;
}
.gray-light-14 {
color: #999999;
font-size: 14px;
font-weight: 300;
}
.gray-16 {
color: #999999;
font-size: 16px;
font-weight: 400;
}
.gray-light-16 {
color: #999999;
font-size: 16px;
font-weight: 300;
}
.gray-lightitalic-16 {
color: #999999;
font-size: 16px;
font-weight: 300;
font-style: italic;
}
.gray-light-18 {
color: #999999;
font-size: 18px;
font-weight: 300;
}
.gray-medium-18 {
color: #999999;
font-size: 18px;
font-weight: 500;
}
.gray-18 {
color: #999999;
font-size: 18px;
font-weight: 400;
}
.gray-20 {
color: #999999;
font-size: 20px;
font-weight: 400;
}
.gray-25 {
color: #999999;
font-size: 25px;
font-weight: 400;
}
.gray-light-25 {
color: #999999;
font-size: 25px;
font-weight: 300;
}
.gray-light-30 {
color: #999999;
font-size: 30px;
font-weight: 300;
}
.green-italic-16 {
color: #1f9985;
font-size: 16px;
font-weight: 400;
font-style: italic;
}
.orange-medium {
color: #f05b28;
font-weight: 500;
}
.orange-medium-16 {
font-size: 16px;
color: #f05b28;
font-weight: 500;
}
.orange-medium-18 {
font-size: 18px;
color: #f05b28;
font-weight: 500;
}
.orange-medium-20 {
font-size: 20px;
color: #f05b28;
font-weight: 500;
}
.orange-medium-25 {
font-size: 25px;
color: #f05b28;
font-weight: 500;
}
.orange-medium-30 {
font-size: 30px;
color: #f05b28;
font-weight: 500;
}
.orange-medium-35 {
font-size: 35px;
color: #f05b28;
font-weight: 500;
}
.orange-medium-40 {
font-size: 40px;
color: #f05b28;
font-weight: 500;
}
.orange-medium-50 {
font-size: 50px;
color: #f05b28;
font-weight: 500;
}
.red-20 {
font-size: 20px;
color: #ff0000;
font-weight: 400;
}
.red-16 {
font-size: 16px;
color: #ff0000;
font-weight: 400;
}
.yellow-medium-35 {
font-size: 35px;
font-weight: 500;
color: #ffff00;
}
.while-medium-40 {
font-size: 40px;
font-weight: 500;
color: #fff;
}
.text-line-through {
text-decoration: line-through !important;
}
@media (max-width: 1199px) {
.profile-detail .orange-medium-35 {
font-size: 22px;
}
}
@media (max-width: 991px) {
.gray-light-14 {
font-size: 12px;
}
body,
.black-lightitalic-16,
.gray-16,
.gray-light-16,
.green-italic-16 {
font-size: 14px;
}
.black-18,
.blue-18,
.gray-18,
.gray-light-18 {
font-size: 16px;
}
.black-lightitalic-20,
.black-medium-20,
.gray-20,
.orange-medium-20 {
font-size: 18px;
}
.black-light-25,
.orange-medium-25,
.black-medium-25 {
font-size: 20px;
}
.orange-medium-30 {
font-size: 25px;
}
.black-35,
.orange-medium-35,
.orange-medium-35,
.yellow-medium-35 {
font-size: 30px;
}
.orange-medium-40,
.black-medium-40,
.while-medium-40 {
font-size: 35px;
}
.orange-medium-50,
.black-medium-50 {
font-size: 40px;
}
}
@media (max-width: 575px) {
.black-lightitalic-16,
.gray-light-16,
.gray-16 {
font-size: 10px;
}
.gray-light-18 {
font-size: 12px;
} .gray-20,
.orange-medium-20,
.black-medium-20,
.black-lightitalic-20 {
font-size: 15px;
}
.black-italic-25,
.black-light-25,
.orange-medium-25,
.black-medium-25 {
font-size: 16px;
}
.black-35,
.orange-medium-35,
.black-medium-35,
.yellow-medium-35,
.profile-detail .orange-medium-35 {
font-size: 22px;
}
.orange-medium-40,
.black-medium-40,
.while-medium-40 {
font-size: 25px;
}
.orange-medium-50,
.black-medium-50 {
font-size: 30px;
}
}
@media screen and (min-width: 768px) {
.profile-detail {
max-width: calc(100% - 90px);
}
} .btn-dis-connect {
color: #ffffff !important;
background-color: #d01c24;
font-size: 14px;
font-weight: 500;
padding: 4px 10px;
border-radius: 18px;
}
.btn-orange,
#submit_2c2p_payment_form {
background-color: #f05b28;
color: #ffffff;
font-size: 18px;
display: inline-block;
min-width: 170px;
border-radius: 30px;
font-weight: normal;
border: 1px solid #f05b28;
padding: 10px 10px;
text-align: center;
}
.btn-orange:hover,
#submit_2c2p_payment_form:hover {
color: #ffffff;
background-color: #dd5425;
border-color: #dd5425;
}
.btn-outline-orange,
#\32 c2p_payment_form .cancel {
background-color: transparent;
color: #f05b28;
font-size: 18px;
display: inline-block;
min-width: 170px;
border-radius: 30px;
font-weight: normal;
border: 1px solid #f05b28;
padding: 10px;
}
.btn-outline-orange:hover,
#\32 c2p_payment_form .cancel:hover {
color: #ffffff;
background-color: #f05b28;
}
.btn-product-card {
background-color: #f05b28;
color: #fff;
font-size: 16px;
font-weight: 400;
border-radius: 30px;
transition: ease-in-out 0.3s;
padding: 5px 10px;
box-shadow: unset;
min-width: 150px;
}
.btn-product-card:hover {
background-color: #f36535;
color: #fff;
}
.btn-out-stock {
background-color: #bbbbbb;
color: #fff;
font-size: 16px;
font-weight: 400;
border-radius: 30px;
transition: ease-in-out 0.3s;
padding: 5px 10px;
box-shadow: unset;
min-width: 150px;
}
.btn-subm-orange {
background-color: #f05b28;
color: #ffffff;
font-size: 18px;
display: block;
min-width: 100%;
border-radius: 50px;
font-weight: normal;
padding: 10px;
}
.btn-subm-orange:hover {
color: #ffffff;
background-color: #dd5425;
}
.btn-add-to-card,
button.alt.btn-add-to-card {
background-color: #e15b28;
color: #fff !important;
font-size: 18px;
border-radius: 30px;
font-weight: 400;
}
.btn-add-to-card:hover,
button.alt.btn-add-to-card:hover {
background-color: #d75726;
}
.btn-outline-ref,
.checkout-login .woocommerce-form-login__submit {
background-color: #fff;
color: #bbbbbb;
border: 1px solid #dddddd;
border-radius: 10px;
font-size: 20px;
min-width: 170px;
height: 50px;
padding: 9px;
font-weight: 400;
border-radius: 25px;
font-size: 18px;
}
.btn-outline-ref:hover,
.checkout-login .woocommerce-form-login__submit:hover {
border: 1px solid #f05b28;
background-color: transparent;
color: #f05b28;
}
.btn-ref {
background-color: #dddddd;
color: #fff;
border: 1px solid #dddddd;
border-radius: 10px;
font-size: 20px;
min-width: 170px;
height: 50px;
padding: 9px;
font-weight: 400;
}
.btn-ref:hover {
background-color: #f05b28;
border-color: #f05b28;
color: #fff;
}
.btn-ref-orange {
background-color: #f15b28;
color: #fff;
border: 1px solid #f15b28;
border-radius: 10px;
font-size: 30px;
min-width: 376px;
height: 90px;
padding: 20px;
font-weight: 400;
cursor: pointer;
}
.btn-ref-orange:hover {
background-color: #dd5425;
border-color: #dd5425;
color: #fff;
}
.btn-pcn-link {
color: #003159;
font-size: 18px;
background-color: transparent !important;
border-color: transparent;
padding: 10px;
font-weight: 400;
}
.btn-outline-infulencer {
background-color: transparent;
color: #1f9985;
font-size: 18px;
display: inline-block;
min-width: 170px;
border-radius: 30px;
font-weight: normal;
border: 1px solid #1f9985;
padding: 10px;
}
.btn-outline-infulencer:hover {
background-color: #1f9985;
color: #ffffff;
}
.btn-lg {
padding: 15px 110px;
}
@media (min-width: 768px) {
#order_review_heading, #order_review {
width: 100%;
float: unset;
}
}
@media (max-width: 991px) {
.btn-orange,
.btn-add-to-card, 
button.alt.btn-add-to-card,
.btn-product-card,
.btn-outline-orange,
.btn-pcn-link,
.btn-outline-ref,
.btn-outline-infulencer,
.checkout-login .woocommerce-form-login__submit,
#submit_2c2p_payment_form,
#\32 c2p_payment_form .cancel,
.btn-out-stock {
font-size: 16px;
}
.btn-outline-ref,
.checkout-login .woocommerce-form-login__submit {
height: auto;
}
}
@media (max-width: 575px) {
.btn-orange, 
.btn-add-to-card, 
button.alt.btn-add-to-card, 
.btn-product-card, 
.btn-outline-orange,
.btn-outline-ref,
.btn-outline-infulencer,
.btn-subm-orange,
.btn-out-stock {
font-size: 10px;
min-width: 110px !important;
padding: 6px 10px;
}
.tb-orders .btn-outline-orange, 
.tb-orders .btn-orange, 
.tb-orders .btn-outline-ref {
min-width: 105px !important;
}
.btn-orange img,
.btn-add-to-card img, 
button.alt.btn-add-to-card img {
height: 15px;
}
.ref-other .post-ref-item .btn-outline-ref, .ref-other .post-ref-item .btn-ref,
.ref-other .post-ref-item .btn-outline-ref {
height: auto !important;
padding: 10px !important;
font-size: 16px;
min-width: calc(50% - 9px)!important;
}
.btn-lg {
padding: 10px 45px;
}
} .box-items-center {
display: flex;
align-items: center;
} .site-header {
display: none;
}
.header-top-sc {
transition: .3s;
opacity: 0;
display: none;
visibility: hidden;
}
.header-menu-abs {
padding: 15px 0;
}
.image-center {
display: flex;
align-items: center;
height: 100%;
}
.search-menu-inp {
font-size: 12px;
}
.search-menu-inp input {
border: 1px solid #f05b28;
background: transparent;
width: 100%;
border-radius: 40px;
padding: 10px 20% 10px 15px;
}
.search-menu-inp .btn-search {
position: absolute;
border: 1px solid #f05b28;
background-color: #f05b28;
color: #ffffff;
padding: 10px 20px;
border-radius: 40px;
right: 0;
font-weight: 400;
}
.search-menu-inp .btn-search span {
display: none;
}
.menu-pcn-toggle span,
.menu-pcn-search-toggle span {
height: 1px;
width: 21px;
border-radius: 10px;
border: 2px solid #f05b28;
background-color: #f05b28;
display: block;
margin: 3px auto;
transition: .25s ease-in-out;
position: relative;
}
.menu-pcn-toggle.active span:nth-child(1),
.menu-pcn-search-toggle.active span:nth-child(1) {
transform: rotate(45deg);
top: 6px;
}
.menu-pcn-toggle.active span:nth-child(2),
.menu-pcn-search-toggle.active span:nth-child(2) {
width: 0%;
opacity: 0;
}
.menu-pcn-toggle.active span:nth-child(3),
.menu-pcn-search-toggle.active span:nth-child(3) {
transform: rotate(-45deg);
top: -5px;
}
.image-center .custom-logo-link {
margin-bottom: 0;
}
.header-list-menu {
display: none;
}
.header-menu-abs .image-center:nth-child(2) {
display: none;
}
.menu-img-profile {
width: 45px;
height: 45px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
background-size: cover;
border-radius: 45px;
margin-right: 15px;
border: 1px solid #cacaca;
text-align: center;
font-size: 18px;
color: #999999;
line-height: 2.5em;
}
.header-menu-account {
display: none;
}
.menu-header-inful.copylink {
position: relative !important;
background-color: #f05b28 !important;
text-align: center;
font-size: 14px !important;
padding: 5px 0;
font-weight: 300;
color: #fff !important;
border-radius: 0px !important;
}
.menu-header-inful:hover {
background-color: #cc491c !important;
}
.menu-header-inful .copylink {
position: relative !important;
display: inline-block;
font-size: 10px !important;
padding: 2px 10px !important;
border-radius: 20px !important;
margin-left: 7px;
background-color: #fff !important;
}
.mobile-cart-fixed {
display: none;
}
@media screen and (min-width: 1200px) {
.search-menu-inp input,
.search-menu-inp .btn-search {
height: 46px;
}
}
@media screen and (max-width: 1199px) {
.search-menu-inp input,
.search-menu-inp .btn-search {
height: 38px;
}
}
@media (max-width: 991px) {
.header-list-menu.active {
display: block;
}
.header-abs,
.header-relative {
position: fixed;
top: 0;
z-index: 99999;
background: #fff;
width: 100%;
box-shadow: 0 2px 20px rgba(0,0,0,0.19), 0 7px 6px rgba(0,0,0,0.0);
}
.header-abs.active,
.header-relative.active {
background: #161616;
}
.header-abs.active .menu-header-inful.copylink,
.header-relative.active .menu-header-inful.copylink {
display: none;
}
.header-list-menu.active {
position: fixed; height: calc(100% - 61px);
width: 100%;
left: 0;
background: #161616;
bottom: 0;
z-index: 99999;
overflow: auto; }
.header-menu-mb-account {
padding: 15px;
}
.header-list-menu.active li {
display: block;
}
.header-list-menu.active .main-navigation ul.menu {
margin: 0;
}
.header-list-menu.active .main-navigation ul.menu li a {
color: #6b6b6b; font-size: 14px;
padding: 10px 15px;
}
.header-list-menu.active ul.menu li.current_page_item:not(.menu-item-has-children) a::after {
display: none;
}
.header-list-menu.active ul.menu li.current_page_item:not(.menu-item-has-children) a {
color: #fff;
font-size: 16px;
background-color: #f05b28;
}
.header-list-menu.active .main-navigation ul.sub-menu {
margin: 0;
display: block;
position: relative;
left: 0;
width: 100%;
background: #161616;
float: unset;
}
.header-list-menu.active .main-navigation ul.sub-menu li a {
padding: 10px 15px 10px 30px;
width: 100%;
}
.header-list-menu.active .main-navigation ul.sub-menu li a::before {
content: '-';
padding-right: 15px;
}
.header-abs.active .image-center:nth-child(1),
.header-relative.active .image-center:nth-child(1) {
display: none;
}
.header-abs.active .image-center:nth-child(2),
.header-relative.active .image-center:nth-child(2) {
display: flex;
}
.header-abs.active .search-menu-inp input::placeholder,
.header-relative.active .search-menu-inp input::placeholder {
color: #999999;
}
.content-area {
padding-top: 70px;
}
.content-area-inful, .page-blog-post.content-area-inful { padding-top: 108px;
}
.single-reference .content-area-inful,
.single-post .content-area-inful {
padding-top: 150px;
}
.menu-pcn-toggle,
.menu-pcn-search-toggle {
padding: 8px 10px;
position: relative;
}
.menu-pcn-toggle::before {
content: '';
border-left: 1px solid #cacaca;
position: absolute;
top: calc(50% - 9px);
height: 18px;
width: 1px;
left: 5px;
}
.header-menu-mb-btn .btn-wistlist img {
filter: brightness(0) invert(1);
height: 20px;
width: auto;
}
.btn-wistlist {
min-width: 246px;
border: 2px solid #f05b28;
background-color: #f05b28;
font-size: 13px;
text-align: center;
border-radius: 30px;
min-height: 45px;
color: #fff !important;
padding: 10px;
}
.btn-outline-wistlist {
min-width: 246px;
border: 2px solid #f05b28;
background-color: transparent;
font-size: 13px;
text-align: center;
border-radius: 30px;
min-height: 45px;
color: #fff !important;
padding: 10px;
}
.cart-count {
position: absolute;
top: -7px;
right: -5px;
min-width: 24px;
padding: 2px;
border: 1px solid #ffffff;
background: #d01c24;
text-align: center;
color: #fff;
font-size: 12px;
border-radius: 20px;
}
.mobile-cart-fixed {
display: block;
position: fixed;
top: calc(100% - 90px);
left: calc(100% - 80px);
border: 3px solid #ffffff;
z-index: 2;
background-color: #f05b28;
width: 60px;
height: 60px;
padding: 8px;
border-radius: 30px;
box-shadow: 0px 1px 9px 0px rgb(0 0 0 / 18%);
}
.woocommerce-checkout .mobile-cart-fixed,
.woocommerce-cart .mobile-cart-fixed {
display: none;
}
.header-menu-mb-sc {
text-align: center;
padding: 20px 0;
}
.header-menu-mb-sc img {
width: 40px;
}
.header-menu-mb-sc span {
display: none;
}
.header-menu-abs {
padding: 10px 0;
}
.search-menu-inp input {
padding: 6px 20% 6px 14px !important;
height: 32px !important;
}
.search-menu-inp .btn-search {
height: 32px !important;
}
}
@media (max-width: 549px) {
.menu-pcn-toggle { padding: 5px 0 8px 0px;
}
.header-menu-search div[class*="col"]:first-child {
padding-left: 0;
}
.menu-pcn-toggle::before {
left: -8px;
top: calc(50% - 11px);
}
.menu-header-inful.copylink {
font-size: 12px !important;
}
.content-area { padding-top: 60px;
}
.content-area-inful, 
.page-blog-post.content-area-inful,
.single-reference .content-area-inful { padding-top: 115px;
}
.search-menu-inp input {
padding: 6px 20% 6px 14px !important;
}
.header-menu-search {
margin-top: 5px !important;
}
}
@media (max-width: 1499px) and (min-width: 992px) {
.header-list-menu ul.menu li a {
padding: 14px 1em;
font-size: 14px;
}
}
@media (min-width: 992px) and (max-width: 1200px) {
.header-menu-account .menu-img-profile {
display: none;
}
}
@media (min-width: 992px) {
.header-list-menu {
display: flex;
}
.header-relative {
position: relative;
top: 0;
z-index: 35;
width: 100%;
box-shadow: 0 10px 20px rgba(0,0,0,0.1), 0 6px 6px rgba(0,0,0,0.0);
}
.header-abs {
position: absolute;
box-shadow: none;
top: 0;
z-index: 35;
width: 100%;
transition: ease-in-out .2s;
}
.single-product .header-abs,
.search-results .header-abs {
position: relative;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 6px 6px rgba(0, 0, 0, 0);
}
.single-product .header-abs .header-menu-abs,
.search-results .header-abs .header-menu-abs  {
box-shadow: none;
}
.header-abs.show {
position: fixed;
background-color: #fff;
transition: ease-in-out .3s;
box-shadow: 0 5px 20px rgb(0 0 0 / 19%), 0 6px 6px rgb(0 0 0 / 0%);
}
.header-abs.show .header-top-sc {
display: none;
}
.header-abs.show .header-menu-abs {
box-shadow: unset;
}
.header-menu-abs {
padding: 0 20px 20px 20px; background: #ffffff;
}
.header-abs .header-menu-abs {
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.0);
}
.header-top-sc {
display: block;
opacity: 1;
visibility: visible;
}
.header-top-sc .d-inline-block {
vertical-align: middle !important;
}
.header-top-sc {
color: #f05b28;
}
.header-top-sc p {
margin: 0;
}
.header-list-menu {
display: flex;
border-bottom: 1px solid #cacaca;
}
.header-list-menu ul.menu {
display: flex;
margin-left: 0;
}
.header-list-menu ul.menu li {
position: relative;
transition: ease-in-out 0.3s;
flex: 1 1 auto!important;
text-align: center;
}
.header-list-menu ul.menu > li::before {
content: '';
border-right: 1px solid #f05b28;
position: absolute;
width: 3px;
height: 3px;
background: #f05b28;
border-radius: 5px;
top: calc(50% - 2px);
left: -3px;
}
.header-list-menu ul.menu li:first-child::before,
.header-list-menu ul.menu li:hover::before,
.header-list-menu ul.menu li.current_page_item::before {
display: none;
}
.header-list-menu ul.menu li:hover,
.header-list-menu ul.menu li.current_page_item,
.header-list-menu ul.menu li:hover > a,
.header-list-menu ul.menu li.current_page_item > a {
background: #f05b28;
color: #ffffff !important;
}
.header-list-menu ul.sub-menu li.current_page_item > a {
background: #ef7951;
}
.header-list-menu .main-navigation ul.sub-menu {
border-radius: 5px;
box-shadow: 0 3px 6px rgb(0 0 0 / 16%), 0 3px 6px rgb(0 0 0 / 23%);
}
.header-list-menu .main-navigation  ul.sub-menu {
background-color: #fff;
}
.header-list-menu .main-navigation ul.sub-menu li:hover,
.header-list-menu ul.sub-menu li:hover > a {
background-color: #ffffff;
color: #f05b28 !important;
}
.header-list-menu ul.sub-menu li a {
text-align: left;
}
.header-list-menu ul.menu li a:hover,
.header-list-menu ul.menu li.current_page_item,
.header-list-menu ul.menu li:hover {
color: #ffffff;
text-decoration: none;
}
.header-menu-account {
display: block;
vertical-align: middle;
margin: auto;
margin-left: 5px;
padding-left: 10px;
position: relative;
} .header-menu-account .menu-user-profile .orange-medium {
max-width: 100px;
}
.menu-user-profile {
line-height: 1.25em;
margin: auto;
min-width: 100px;
padding-right: 10px;
}
.menu-user-profile .orange-medium {
position: relative;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.menu-user-profile .orange-medium::after {
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: '\f107';
position: absolute;
right: -10px;
}
.search-menu-inp {
font-size: 16px;
}
.search-menu-inp input {
padding: 10px 20% 10px 35px;
}
.search-menu-inp .btn-search span {
display: inline-block;
padding-left: 1rem!important;
}
.search-menu-inp .btn-search {
padding: 10px 30px;
}
.header-menu-search {
margin-top: 20px;
}
.header-menu-search div[class*="col"]::after {
content: '';
position: absolute;
height: 37px;
width: 1px;
background: #cacaca;
top: calc(50% - 18px);
left: 0;
}
.header-menu-search div[class*="col"]:first-child::after {
display: none;
}
.search-menu-inp {
position: relative;
}
.image-center .custom-logo-link {
padding-top: 20px;
}
.card-box-count {
position: relative;
display: inline-block;
}
.cart-count {
position: absolute; top: -6px;
right: -6px;
min-width: 20px;
border: 1px solid #d01c24;
background: #d01c24;
text-align: center;
color: #fff;
font-size: 12px;
border-radius: 20px;
}
.minicart {
display: none;
position: absolute;
right: 0;
width: 400px;
background: #fff;
top: 50px; box-shadow: 0px 0px 10px rgb(0 0 0 / 30%); } .minicart-header {
padding: 20px 15px;
background-color: #f05b28;
color: #ffffff;
}
.minicart-body {
padding: 15px;
max-height: 340px;
overflow-y: auto;
background-color: #ffffff;
}
.minicart-footer {
padding: 15px;
background-color: #e0e0e0;
}
.minicart-item {
padding-bottom: 15px;
}
.minicart-img {
width: 30%;
display: inline-block;
padding: 0 10px 0 5px;
}
.minicart-detail {
width: calc(70% - 10px);
display: inline-block;
vertical-align: top;
}
.minicart-sub-1, .minicart-sub-2 {
display: inline-block;
width: calc(50% - 5px);
font-size: 14px;
}
} .pcn-nav-item {
display: none;
position: absolute;
top: calc(100% + 9px);
right: 0;
background: #ffffff;
border-radius: 5px;
width: calc(100% + 95px);
box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
padding: 10px 15px;
z-index: 2;
}
.pcn-nav-item.active {
display: block;
}
.pcn-nav-item .menu-user-profile {
margin: unset;
min-width: calc(100% - 65px);
}
.pcn-nav-item .menu-user-profile .orange-medium::after {
display: none;
}
.pcn-nav-item hr {
border-color: #cecece;
margin: 10px 0;
}
.pcn-copy-url {
position: relative;
}
input#urlcopying {
box-shadow: none;
border-radius: 5px;
width: 100%;
}
.btn {
cursor: pointer;
}
.single-reference .inful-code-copy,
.single-post .inful-code-copy {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.copylink:not(.btn-secondary) {
position: absolute;
top: calc(50% - 22px);
right: 0;
color: #164bac;
font-size: 18px;
cursor: pointer;
padding: 8px 15px;
background-color: #f2f2f2;
border-radius: 0 5px 5px 0;
} .ls-home .ls-v6 .ls-nav-prev, 
.ls-home .ls-v6 .ls-nav-next {
z-index: 30;
}
.ls-home .ls-v6 .ls-bottom-slidebuttons a,
.ls-home .ls-v6 .ls-bottom-slidebuttons a.ls-nav-active  {
background: #f05b28;
border: 1px solid #f05b28 !important;
margin: 0 10px;
}
.ls-home .ls-v6 .ls-bottom-slidebuttons a.ls-nav-active {
position: relative;
margin: 0 20px;
}
.ls-home .ls-v6 .ls-bottom-slidebuttons a.ls-nav-active::before {
content: '';
width: 23px;
height: 23px;
border-top: 1px solid #f05b28;
border-left: 1px solid #f05b28;
border-radius: 20px;
position: absolute;
top: -8px;
left: -8px;
transform: rotate(45deg);
}
.ls-home .ls-v6 .ls-nav-prev:after, 
.ls-home .ls-v6 .ls-nav-next:after {
width: 50px;
height: 50px;
border: 0px solid transparent;
border-radius: 30px;
}
.ls-home .ls-v6 .ls-nav-prev::after {
border-top: 2px solid #f05b28;
border-left: 2px solid #f05b28;
}
.ls-home .ls-v6 .ls-nav-next::after {
border-top: 2px solid #f05b28;
border-right: 2px solid #f05b28;
}
.ls-home .ls-v6 .ls-nav-next:before,
.ls-home .ls-v6 .ls-nav-prev:before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: 24px;
color: #f05b28;
position: absolute;
top: 20px;
}
.ls-home .ls-v6 .ls-nav-next::before {
content: '\f105';
}
.ls-home .ls-v6 .ls-nav-prev:before {
content: '\f104';
left: 38px;
}
.ls-home .ls-v6 .ls-nav-prev:hover, .ls-home .ls-v6 .ls-nav-next:hover {
-o-transform: unset;
-ms-transform: unset;
-moz-transform: unset;
-webkit-transform: unset;
transform: unset;
}
.ls-home .ls-v6 .ls-nav-prev:hover:after {
border-top-color:#f05b28 !important;
border-left-color: #f05b28 !important;
}
.ls-home .ls-v6 .ls-nav-next:hover:after {
border-top-color:#f05b28 !important;
border-right-color: #f05b28 !important;
}
.ls-home .ls-v6 .ls-bottom-nav-wrapper {
z-index: 30;
}
@media (max-width: 549px) {
.ls-home .ls-v6 .ls-nav-prev:after, .ls-home .ls-v6 .ls-nav-next::after {
width: 40px;
height: 40px;
}
.ls-home .ls-v6 .ls-nav-next:before, .ls-home .ls-v6 .ls-nav-prev::before {
font-size: 17px;
}
.ls-home .ls-v6 .ls-nav-prev::before {
left: 34px;
}
.ls-home .ls-v6 .ls-nav-next::before {
right: 34px;
}
.ls-home .ls-v6 .ls-bottom-slidebuttons a, .ls-home .ls-v6 .ls-nav-sides {
width: 5px !important;
height: 5px;
}
.ls-home .ls-v6 .ls-bottom-slidebuttons a.ls-nav-active::before {
width: 20px;
height: 20px;
}
} .sec-2 {
padding: 60px 0 0;
}
.home-product-highlight {
position: relative;
}
.pd-highlight-list {
padding-bottom: 50px;
}
.product-list-highlight {
border: 1px solid #cacaca;
padding: 10px 10px 20px 10px;
text-align: center;
position: relative;
transition: ease-in-out 0.3s;
margin-bottom: 15px;
max-height: 380px;
}
.product-list-highlight .black-medium-20,
.product-list-item .black-medium-20 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.product-wishlist {
position: absolute;
right: 10px;
z-index: 1;
}
.product-wishlist .yith-wcwl-add-to-wishlist {
margin: 0;
}
.product-wishlist .yith-wcwl-add-button .yith-wcwl-icon {
margin-right: 4px;
min-width: 37px;
}
.product-wishlist .yith-wcwl-add-button span {
display: none;
}
.product-highlight-hover { transition: cubic-bezier(0.72, 0, 0.32, 0.99) 0.3s;
position: absolute;
width: calc(100% + 2px);
background-color: #ffffff;
left: -1px;
bottom: 0;
border-width: 0 1px 1px;
border-color: transparent;
border-style: solid;
visibility: hidden;
opacity: 0;
}
.product-highlight-btn {
display: inline-block;
padding: 10px 30px;
background-color: transparent;
color: transparent;
font-size: 18px;
border-radius: 30px;
}
.product-list-highlight:hover {
background-color: #f05b28;
border-width: 1px 1px 0 1px;
}
.product-list-highlight:hover .product-wishlist { 
filter: brightness(0) invert(1);
}
.product-list-highlight .product-highlight-img {
display: flex;
}
.product-list-highlight .product-highlight-img img {
justify-items: center;
max-height: 260px;
padding: 15px 0;
}
.product-list-highlight:hover .product-highlight-img img {
filter: drop-shadow(-8px 9px 4px rgba(0,0,0,0.35));
}
.product-list-highlight:hover .black-medium-20 {
color: #ffff00;
}
.product-list-highlight:hover .black-lightitalic-16 {
color: #ffffff;
}
.product-list-highlight:hover .product-highlight-hover { bottom: -63px;
visibility: visible;
background-color: #f05b28;
border-color: #cacaca;
opacity: 1; }
.product-list-highlight:hover .product-highlight-btn { background-color: #ffffff;
color: #f05b28; }
.sec-3 {
padding: 60px 0;
background: #fbfbfb;
border: 1px solid #e2e2e2;
}
.blog-category {
font-size: 16px;
font-weight: 300;
color: #333333;
background-color: #cacaca;
padding: 0 5px;
min-width: 66px;
text-align: center;
margin-right: 10px;
}
.blogs-list .blog-list-box { transition: ease-in-out 0.3s;
padding: 0;
border: 1pt solid transparent;
height: 100%;
}
.blogs-list .blog-list-box .gray-light-16{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.blogs-list .blog-list-box:hover { border-color: #f05b28; }
.blogs-list .blog-list-box:hover .blog-list-content { }
.blogs-list .blog-list-box:hover .blog-category {
background-color: #f05b28;
color: #ffffff;
}
.blogs-list .blog-list-box:hover .black-medium-20 {
color: #f05b28;
}
.blog-list-box-img {  padding: 0; transition: ease-in-out 0.3s;
position: relative;
overflow: hidden; }
.blog-list-img img {
width: 100%;
transition: ease-in-out .3s;
}
.blogs-list .blog-list-box:hover .blog-list-img img {
transform: scale(1.1);
}
.blogs-list .blog-list-box:hover .blog-list-box-img {
margin: 0;  }
.blog-list-box-img-bg {
position: absolute;
opacity: 0.5;
-webkit-filter: blur(2px);
transform: scale(1.1);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
margin: 10px 20px; height: calc(100% - 20px);
width: calc(100% - 40px);
top: 0;
left: 0;
transition: ease-in-out .3s;
}
.blogs-list .blog-list-box:hover .blog-list-box-img-bg {
margin: 0; transform: scale(1.2);
top: 10px;
left: 20px; }
.blog-list-img {
position: relative; width: 100%;
opacity: 1;
background-repeat: no-repeat;
background-size: contain;
transition: ease-in-out 0.3s;
background-position: center; } .blog-list-content {
padding: 0 15px 15px;
transition: ease-in-out 0.3s;
}
.sec-4 {
padding: 60px 0;
}
strong {
font-weight: 500;
}
.wp-block-image {
margin-bottom: 5px;
}
p {
margin-bottom: 5px;
}
.contact-box {
padding-top: 45px;
}
.contact-box .wp-block-column {
position: relative;
padding-top: 15px;
text-align: center;
}
.contact-box .wp-block-column::after {
content: '';
position: absolute;
height: 100%;
width: 1px;
border-right: 1px solid #cacaca;
top: 0;
right: -15px;
}
.contact-box .wp-block-column:last-child:after {
display: none;
}
.home .d-home-none,
.sec-contact .d-home-none {
display: none;
}
@media (max-width: 992px) {
.pd-highlight-list {
max-width: calc(100% - 100px);
}
.pd-highlight-button-prev, .pd-highlight-button-next {
cursor: pointer;
}
.pd-highlight-button-next::before, .pd-highlight-button-prev::before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: 18px;
color: #f05b28;
position: absolute;
top: calc(50% - 54px);
}
.pd-highlight-button-next::before {
content: '\f105';
left: calc(100% - 24px);
}
.pd-highlight-button-prev:before {
content: '\f104';
right: calc(100% - 24px);
}
.pd-highlight-button-prev:after, .pd-highlight-button-next:after {
content: '';
position: absolute;
width: 40px;
height: 40px;
border: 0px solid transparent;
top: calc(50% - 60px);
border-radius: 40px;
transform: rotate(-50deg);
}
.pd-highlight-button-next::after {
border-top: 2px solid #f05b28;
border-right: 2px solid #f05b28;
transform: rotate(40deg); left: calc(100% - 41px);
}
.pd-highlight-button-prev::after {
border-top: 2px solid #f05b28;
border-left: 2px solid #f05b28;
right: calc(100% - 41px);
}
.blog-category {
font-size: 14px;
}
.sec-4 {
padding: 45px 0 35px;
}
.contact-box {
padding-top: 30px;
}
.contact-box .wp-block-image .aligncenter img {
height: 22px;
width: auto;
}
.contact-box strong {
font-size: 22px;
}
.contact-box p.has-text-align-center {
font-size: 14px !important;
}
}
@media (max-width: 780px) {
.contact-box .wp-block-column:nth-child(2n)::after {
display: none;
}
}  .page-about-us {
padding: 50px 0;
} .page-blogs {
padding-bottom: 60px;
}
.page_banner {
background-image: url(//www.pcn.co.th/wp-content/themes/pcncoth/assets/images/banner.jpg);
padding: 65px;
background-repeat: no-repeat;
max-width: 1920px;
margin: auto;
}
.menu-taxonomy {
text-align: center;
padding: 50px 0 25px;
}
.menu-taxonomy-list {
display: inline-block;
min-width: 170px;
padding: 10px;
text-align: center;
color: #ffffff;
border-radius: 30px;
color: #ffffff;
font-size: 18px;
margin: 0 20px 25px;
border: 2px solid #bbbbbb;
color: #bbbbbb;
overflow: hidden;
}
.menu-taxonomy-list.current {
background: #f05b28;
border-color: #f05b28;
color: #ffffff;
}
.menu-img-tax {
background-position: center;
background-repeat: no-repeat;
background-size: contain;
transform: scale3d(1.63, 1.5, 1.5);
}
.menu-img-tax img {
opacity: 0;
max-height: 65px;
}
.manu-tax-txt {
height: 65px;
transform: scale(0.7);
display: inline-flex;
align-items: center;
}
@media (max-width: 576px) {
.menu-taxonomy-list {
font-size: 16px;
margin: 0 6px 14px;
min-width: calc(50% - 20px);
}
.brand-slide {
position: relative;
}
}
.ref-menu-first {
max-height: 200px;
height: 100%;
padding: 1.9rem 0;
}
@media screen and (min-width: 1200px) {
.ref-menu-brands {
display: flex;
}
.ref-menu-brands .menu-taxonomy-list {
margin: 0 20px 15px;
}
.ref-menu-first {
padding: 5rem 0;
}
} .pages-pagination a,
.pages-pagination span {
min-width: 46px;
padding: 8px;
border: 1px solid #bbbbbb;
color: #f05b28;
font-weight: 500;
border-radius: 30px !important;
margin-right: 8px;
font-size: 18px;
}
.pages-pagination span:hover {
color: #f05b28;
}
.pages-pagination a.current,
.pages-pagination a:hover {
background: #f05b28;
color: #ffffff;
border-color: #f05b28;
}
.pagi-select-container {
padding-bottom: 40px;
}
.pagi-select {
min-width: 60px;
border: 1px solid #bbbbbb; font-weight: 500;
color: #f05b28;
padding: 8px 0 8px 8px;
text-align: center;
border-radius: 10px !important;
} .brand-detail h1 {
margin: 0px 0 20px 0;
}
.brand-detail h2 {
margin: 30px 0 15px 0 !important;
} .menu-brands {
max-width: 1100px;
margin: auto;
}
.post-ref-list  div[class*="col"] {
margin-bottom: 20px;
}
.post-ref-item {
height: 100%;
transition: ease-in-out .3s;
border: 2px solid #d1d1d1;
}
.post-ref-item:hover {
border-color: #f05b28;
}
.post-ref-list-img {
height: 275px;
width: 100%;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.post-ref-item .orange-medium-25,
.post-ref-item .black-lightitalic-20 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.post-ref-item .btn-outline-ref,
.post-ref-item .btn-ref {
min-width: calc(50% - 7px) !important;
height: 50px;
padding: 9px;
font-size: 20px;
padding: 9px;
border-radius: 25px;
}
.ref-sec-2 .wp-block-image {
padding-bottom: 15px;
}
@media(min-width: 992px) and (max-width:1199px) {
.post-ref-list-img {
height: 180px;
}
.post-ref-item .btn-outline-ref, .post-ref-item .btn-ref {
min-width: 100% !important;
margin: 4px 0 !important;
}
}
@media (max-width: 991px) {
.post-ref-item .btn-outline-ref, .post-ref-item .btn-ref {
height: 46px;
font-size: 18px;
}
.post-ref-list-img {
height: 200px;
}
} .page-contact {
padding: 40px;
}
.gform_wrapper li.gfield.gfield_error, 
.gform_wrapper li.gfield.gfield_error.gfield_contains_required.gfield_creditcard_warning {
border-top: 0px solid #c89797 !important;
border-bottom: 0px solid #c89797 !important;
background-color: transparent !important;
padding: 0 !important;
margin: 0 !important;
}
.gform_wrapper .validation_message {
display: none;
}
@media only screen and (min-width: 641px) {
.frm-contact .gfield_label {
width: 30%;
}
.frm-contact .ginput_container {
display: inline-block;
width: 70%;
}
}
@media only screen and (max-width: 991px) {
.page-contact {
padding: 40px 0px;
}
}
.frm-contact .gform_wrapper .top_label input.medium, 
.frm-contact .gform_wrapper .top_label select.medium {
width: 100%;
}
.frm-contact .gform_wrapper label.gfield_label, 
.frm-contact .gform_wrapper legend.gfield_label {
font-weight: 300;
font-size: 20px;
margin: 5px 0;
}
.frm-contact input[type='text'], 
.frm-contact input[type='number'], 
.frm-contact input[type='email'], 
.frm-contact input[type='tel'], 
.frm-contact input[type='url'], 
.frm-contact input[type='password'], 
.frm-contact input[type='search'], 
.frm-contact textarea, 
.frm-contact .input-text {
box-shadow: unset;
border: 1px solid #888888;
border-radius: 30px;
padding: 12px 25px !important;
background-color: #fff;
font-weight: 300;
font-size: 20px;
}
.frm-contact input[type='text']:focus, 
.frm-contact input[type='number']:focus, 
.frm-contact input[type='email']:focus, 
.frm-contact input[type='tel']:focus, 
.frm-contact input[type='url']:focus, 
.frm-contact input[type='password']:focus, 
.frm-contact input[type='search']:focus, 
.frm-contact textarea:focus, 
.frm-contact .input-text:focus {
border-color: #f05b28;
}
.frm-contact input::placeholder,
.frm-contact textarea, 
.frm-contact .input-text {
color: #bcbcbc;
font-weight: 300;
}
body .frm-contact .gform_wrapper ul li.gfield {
margin-top: 5px;
}
.frm-contact .gform_wrapper .gform_footer {
margin: 0;
text-align: right;
}
.frm-contact input[type='submit'] {
width: 69% !important;
background: #f15b28;
color: #fff;
font-size: 20px !important;
font-weight: 300;
border-radius: 30px;
}
.frm-contact .gform_wrapper.gform_validation_error .top_label input.medium, .frm-contact .gform_wrapper.gform_validation_error .top_label select.medium {
width: 100%;
}
.gform_wrapper div.validation_error {
color: #d01c24 !important;
border-color: #d01c24 !important;
}
.gform_wrapper li.gfield_error input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), .gform_wrapper li.gfield_error textarea {
border-color: #d01c24 !important;
}
.gform_wrapper .gfield_error .gfield_label,
.gform_wrapper .gfield_required {
color: #d01c24 !important;
}
.acf-map {
width: 100%;
height: 420px; margin: 20px 0;
}
.acf-map img {
max-width: inherit !important;
}
.gmnoprint,
.gm-control-active {
display: none;
} #secondary {
display: none;
}
.page-blog-post {
position: relative;
background-repeat: no-repeat;
background-position: top right;
}
.storefront-breadcrumb {
padding: 10px 0;
margin: 0 0 20px;
}
.storefront-breadcrumb .woocommerce-breadcrumb a {
color: #999999 !important;
}
.woocommerce-breadcrumb a:first-of-type::before {
display: none;
}
.woocommerce-breadcrumb .breadcrumb-separator::after {
content: '/';
font-size: inherit;
}
.post-blog-thumnail {
max-width: calc(100% - 100px);
margin: 30px auto;
}
.post-blog-thumnail img {
width: 100%;
}
@media (max-width: 991px) {
.page-blog-post {
padding-top: 90px;
}
} html {
scroll-behavior: smooth;
}
.img-bg-water-1,
.img-bg-water-2,
.img-bg-water-3 {
position: absolute;
animation: movedown 5s infinite;
animation-direction: alternate;
animation-play-state: paused;
will-change: transform;
animation-delay: calc(var(--scroll) * -1s);
animation-iteration-count: 1;
animation-fill-mode: both;
z-index: -1;   }
.img-bg-water-1 {
top: 200px;
left: 100px;
transition: transform 4s ease;
transform: translateY(300px);
}
.img-bg-water-2 {
top: 300px;
right: 100px;
transition: transform 6s ease;
transform: translateY(200px);
}
.img-bg-water-3 {
top: 300px;
right: 300px;
transition: transform 8s ease;
transform: translateY(100px);
}
@keyframes movedown {
0% {
top: 0%;  }
100% {
top: 90%;  }
} .shop-banner {
position: relative;
background-image: url(//www.pcn.co.th/wp-content/themes/pcncoth/assets/images/shop_banner1.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
box-shadow: 0 4px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.0); }
.shop-detail {
height: 550px;
padding: 0 15px;
}
.shop-banner-slider {
padding: 200px 0 0;
height: 100%;
}
.shop-detail-item {
display: inline-block;
width: 40%;
vertical-align: middle;
}
.shop-detail .shop-detail-item:first-child {
width: 30%;
}
.shop-detail .shop-detail-item:last-child {
width: 28%;
}
.shop-detail-image {
height: 250px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}
.shop-detail-item-pdname,
.shop-detail-item-title .black-light-25  {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.swiper-container-horizontal>.swiper-pagination-bullets, 
.swiper-pagination-custom, .swiper-pagination-fraction {
bottom: calc(0% + 315px);
}
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 15px;
}
.swiper-pagination-bullet {
background: #f05b28;
opacity: 1;
}
.swiper-pagination-bullet-active {
position: relative;
}
.swiper-pagination-bullet-active::before {
content: '';
width: 23px;
height: 23px;
border-top: 1px solid #f05b28;
border-left: 1px solid #f05b28;
border-radius: 20px;
position: absolute;
top: -8px;
left: -8px;
transform: rotate(45deg);
} .shop-button-prev,
.shop-button-next {
cursor: pointer;
position: absolute;
top: calc(50% - 134px);
z-index: 1;
}
.shop-button-prev {
right: calc(100% - 90px);
}
.shop-button-next {
left: calc(100% - 90px);
}
.shop-button-prev:after, 
.shop-button-next:after {
content: '';
position: absolute;
width: 63px;
height: 63px;
border: 0px solid transparent;
top: calc(50% - 30px);
border-radius: 40px;
transform: rotate(-50deg);
}
.shop-button-prev::after {
border-top: 2px solid #f05b28;
border-left: 2px solid #f05b28; right: calc(80% + 9%);
}
.shop-button-next::after {
border-top: 2px solid #f05b28;
border-right: 2px solid #f05b28;
transform: rotate(40deg); left: calc(80% + 9%);
}
.shop-button-next::before {
content: '\f105'; left: calc(89% + 28px);
}
.shop-button-next::before,
.shop-button-prev::before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: 24px;
color: #f05b28;
position: absolute;
top: calc(50% - 17px);
}
.shop-button-prev:before {
content: '\f104'; right: calc(89% + 28px); }
.shop-ref {
margin-top: -5px;
}
.shop-banner-slider div[class*="col"] {
padding: 5px;
}
.shop-ref-bg { height: 100%;
width: 100%;
top: 0;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
box-shadow: 0px 4px 9px 6px rgba(0, 0, 0,0.18)
}
.shop-brands {
padding: 30px 0;
} .shop-brands-slide .swiper-slide {
height: auto;
position: relative;
}
.shop-brands-slide .swiper-slide::after {
content: '';
position: absolute;
height: 100%;
border-right: 1px solid #a4a4a4;
top: 0;
}
.shop-brand-item {
display: flex;
align-items: center;
height: 100%;
}
.shop-brands-slide .shop-brand-item img {
margin: auto;
}
.shop-pd-banner-content div[class*="col"] {
padding: 5px;
}
.shop-pd-banner-img {
text-align: center;
}
.shop-pd-banner-img a {
display: inline-block;
}
.shop-pd-banner-col {
position: relative;
}
.swiper-pd-banner-pagination {
position: absolute;
bottom: calc(0% + 20px);
z-index: 10;
width: 100%;
text-align: center;
}
.swiper-pd-banner-pagination .swiper-pagination-bullet {
margin: 0 15px;
}
.shop-pd-recom {
position: relative;
}
.text-formula {
color: #2e2d2c;
font-size: 14px;
font-weight: 300;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
text-shadow: 3px 3px 5px rgb(0 0 0 / 35%);
}
.shop-pd-recom-bg {
height: 700px;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.shop-pd-recom-bg-1 {
align-items: center;
padding-left: 80px;
}
.shop-pd-recom-button {
height: 140px;
width: 238px;
background-color: #f2f2f2;
box-shadow: 0px 4px 9px 6px rgba(0, 0, 0,0.18);
position: absolute;
z-index: 10;
top: calc(50% - 70px);
cursor: pointer;
transition: ease-in-out .3s;
}
.shop-pd-recom-button-prev {
left: 0;
left: -100px;
border-radius: 0 70px 70px 0;
}
.shop-pd-recom-button-next { right: -100px;
border-radius: 70px 0 0 70px;
}
.shop-pd-recom-button-prev:hover {
left: 0;
}
.shop-pd-recom-button-next:hover {
right: 0;
}
.shop-pd-recom-img {
height: 113px;
width: 94px;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
filter: drop-shadow(4px 4px 4px rgba(0,0,0,0.35));
}
.shop-pd-recom-detail {
max-width: calc(50% + 110px);
}
.shop-pd-recom-button .shop-pd-recom-detail {
position: absolute;
top: calc(50% - 57px);
}
.shop-pd-recom-button-prev .shop-pd-recom-detail {
left: 7px;
}
.shop-pd-recom-button-next .shop-pd-recom-detail {
right: 7px;
}
.shop-pd-recom-text {
position: absolute; top: calc(50% - 48px);
width: 100px;
height: calc(100% - 20px);
}
.shop-pd-recom-button-prev .shop-pd-recom-text { left: 105px;
}
.shop-pd-recom-button-next .shop-pd-recom-text {
left: -105px;
}
.shop-pd-recom-text .orange-medium-16 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
text-shadow: 3px 3px 5px rgb(0 0 0 / 35%);
}
.recom-button-prev, 
.recom-button-next {
cursor: pointer;
position: absolute;
bottom: 40px;
}
.recom-button-prev::before, 
.recom-button-next::before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: 14px;
color: #f05b28;
position: absolute;
top: calc(50% + 10px);
}
.recom-button-prev::before {
content: '\f104';
left: 65px;
}
.recom-button-next::before {
content: '\f105';
right: -26px;
}
.recom-button-prev::after, 
.recom-button-next::after {
content: '';
position: absolute;
width: 40px;
height: 40px;
border: 0px solid transparent; border-radius: 40px;
transform: rotate(45deg);
}
.recom-button-prev::after {
border-left: 2px solid #f05b28;
border-bottom: 2px solid #f05b28;
left: 50px;
}
.recom-button-next::after {
border-top: 2px solid #f05b28;
border-right: 2px solid #f05b28;
}
section.shop-product-new {
padding: 54px 0 0;
}
.shop-product-new-slider {
padding: 0 10px;
}
.shop-product-new-slider,
.shop-product-new-slider-mb {
padding-bottom: 62px;
}
.shop-product-new-slider-mb {
width: calc(100% - 50px);
}
.shop-product-new-slider .swiper-slide {
padding: 0 10px;
}
.shop-pd-recom-new-item {
padding: 0 0 20px;
}
.shop-pd-recom-new {
position: relative;
height: 100%;
background-image: url(//www.pcn.co.th/wp-content/themes/pcncoth/assets/images/shop_banner1.jpg);
transition: ease-in-out .3s;
margin: 0 10px 10px; padding: 30px 10px 30px 5px; }
.shop-pd-recom-new-item .btn-outline-orange,
.shop-pd-recom-new-item .btn-orange {
min-width: calc(50% - 15px);
}
.shop-pd-recom-new-item div[class*="col"] {
margin: auto;
}
.image-show {
display: inline-block;
}
.image-hover {
display: none;
}
.shop-pd-recom-new .product-highlight-hover { background-color: transparent;
border-color: transparent;
opacity: 0;
bottom: -78px; transition: ease-out .25s;
transition: background-color .3s ease-in-out;
z-index: 2;
}
.shop-pd-recom-new:hover {
background-image: unset;
background-color: #f05b28; border-color: #cacaca;   transition: ease-in 0.24s;
}
.shop-pd-recom-new:hover div[class*="col"] { }
.shop-pd-recom-new:hover .product-highlight-hover {
opacity: 1;
display: block; visibility: visible;
background-color: #f05b28;
left: 0;
width: 100%;
bottom: -70px;
padding-bottom: 15px;
z-index: 2; }
.shop-pd-recom-new:hover .orange-medium-20,
.shop-pd-recom-new:hover .orange-medium-35,
.shop-pd-recom-new:hover .black-medium-20,
.shop-pd-recom-new:hover .orange-medium-18,
.shop-pd-recom-new:hover .orange-medium-16,
.shop-pd-recom-new:hover .orange-medium-30,
.shop-pd-recom-new:hover .black-medium-18,
.shop-pd-recom-new:hover .black-medium-16  {
color: #ffff00;
}
.shop-pd-recom-new:hover .black-lightitalic-16,
.shop-pd-recom-new:hover .gray-16 {
color: #fff;
}
.shop-pd-recom-new:hover .btn-outline-orange,
.shop-pd-recom-new .btn-outline-orange {
border-color: #ffffff;
color: #fff;
}
.shop-pd-recom-new:hover .btn-orange,
.shop-pd-recom-new .btn-orange {
border-color: #ffffff;
background-color: #ffffff;
color: #f05b28;
font-size: 16px;
}
.shop-pd-recom-new .btn-outline-orange {
font-size: 16px;
}
.shop-pd-recom-new:hover .image-show {
display: none;
}
.shop-pd-recom-new:hover .image-hover {
display: inline-block;
height: 22px;
}
.recom-new-image { height: 155px;
width: 150px;
margin: 15px 0;
background-position: center;
background-repeat: no-repeat; background-size: contain;
filter: drop-shadow(-1px 10px 6px rgba(0,0,0,0.35));
transition: ease-in-out .3s;
}
.shop-pd-recom-new:hover .recom-new-image {
transform: scale3d(1.1, 1.1, 1.1);
}
.shop-pd-recom-new div[class*="col"] {
padding: 0 5px;
display: flex;
}
.recom-new-detail {
margin: auto;
}
.slide-button-prev,
.slide-button-next {
cursor: pointer;
position: absolute;
top: calc(50% - 56px);
z-index: 1;
}
.slide-button-prev {
left: -95px; }
.slide-button-next {
right: -32px; }
.slide-button-prev:after, .slide-button-next:after {
content: '';
position: absolute;
width: 63px;
height: 63px;
border: 0px solid transparent; border-radius: 55px;
transform: rotate(45deg);
top: 50%;
}
.slide-button-prev::after {
border-left: 2px solid #f05b28;
border-bottom: 2px solid #f05b28; }
.slide-button-next::after {
border-top: 2px solid #f05b28;
border-right: 2px solid #f05b28;
}
.slide-button-prev::before, .slide-button-next::before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: 24px;
color: #f05b28;
position: absolute;
top: calc(50% + 14px);
}
.slide-button-prev::before {
content: '\f104';
left: calc(89% + 25px);
}
.slide-button-next::before {
content: '\f105';
left: calc(89% + 28px);
}
.slide-pagination {
bottom: 18px;
position: absolute;
width: 100%;
text-align: center;
z-index: 1;
}
.slide-pagination .swiper-pagination-bullet {
margin: 0 10px;
}
.shop-bg-cover {
height: 370px;
background-position: center;
background-size: cover;
}
.shop-product-new-slider-pag { }
.ref-thum-vdo {
position: absolute;
width: 100%;
height: 100%;
transition: ease-in-out .3s;
z-index: 1;
} .ref-thum-vdo-item:hover .ref-thum-vdo,
.post-ref-item:hover .ref-thum-vdo {
background: rgb(0, 0, 0, 0.4);
}
.ref-thum-vdo .ref-thum-vdo-img,
.ref-thum-vdo .ref-thum-vdo-hover {
position: absolute;
top: calc(50% - 47px);
left: calc(50% - 45px);
transition: ease-in-out .3s;
opacity: 1;
}
.ref-thum-vdo .ref-thum-vdo-hover,
.ref-thum-vdo-item:hover .ref-thum-vdo-img,
.post-ref-item:hover .ref-thum-vdo-img {
opacity: 0;
}
.ref-thum-vdo-item:hover .ref-thum-vdo-hover,
.post-ref-item:hover .ref-thum-vdo-hover {
opacity: 1;
}
@media (max-width: 1600px) {
.shop-product-new-slider {
width: calc(100% - 50px);
}
.slide-button-prev {
left: -40px;
left: -11px;
}
.slide-button-next {
right: 19px;
right: 52px;
}
.recom-new-image { height: 130px;
width: 130px;
}
}
@media (max-width: 1200px) {
.slide-button-prev {
left: -37px;
}
.slide-button-next {
right: 25px;
}
.shop-product-new-slider-prev,
.shop-product-new-slider-next {
display: none;
}
.shop-detail-item .orange-medium-50,
.shop-detail-item .black-medium-50 {
font-size: 30px;
}
.shop-pd-recom-new:hover .product-highlight-hover {
bottom: -69px;
}
}
@media (max-width: 991px) {
.shop-banner-slider {
padding: 50px 0 0;
padding: 35px 0 0;
}
.shop-detail {
padding: 0;
}
.shop-detail .shop-detail-item {
display: block;
width: 100% !important;
}
.shop-detail-image {
width: 250px;
margin: 15px auto;
}
.swiper-slide-active .row {
margin: 0;
}
.shop-detail-item-title {
text-align: center;
}
.shop-detail-item .black-light-25 {
font-size: 16px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.shop-detail-item .row {
max-width: 390px;
margin: auto;
}
.shop-detail-item .btn-outline-orange,
.shop-detail-item .btn-orange {
min-width: 150px;
}
.shop-banner .swiper-container-horizontal>.swiper-pagination-bullets, 
.shop-banner .swiper-pagination-custom, .swiper-pagination-fraction {
display: none;
}
.shop-button-prev, .shop-button-next {
top: calc(50% + 50px);
}
.shop-button-prev:after, .shop-button-next:after {
width: 45px;
height: 45px;
top: calc(50% - 186px);
}
.shop-button-next {
left: calc(100% - 100px);
}
.shop-button-prev {
right: calc(100% - 100px);
}
.shop-button-next::before, .shop-button-prev::before {
top: calc(50% - 178px);
font-size: 20px;
}
.shop-button-next::before {
left: calc(89% + 20px);
}
.shop-button-prev:before {
right: calc(89% + 20px);
}
.show-detail-ref-list div[class*="col"]:nth-child(3),
.show-detail-ref-list div[class*="col"]:nth-child(4) {
display: none;
}
.shop-pd-recom-bg {
height: 500px;
}
.shop-bg-cover {
height: 150px;
}
.slide-button-prev { left: -10px !important;
}
.slide-button-next {
right: 31px !important;
}
.slide-button-prev:after, .slide-button-next:after {
width: 45px;
height: 45px; }
.slide-button-prev::before, .slide-button-next::before {
top: calc(50% + 8px);
font-size: 20px;
}
.slide-button-prev::before {
left: calc(80% + 16px);
}
.slide-button-next::before {
left: calc(89% + 21px);
}
.shop-pd-recom-new .btn-outline-orange, .shop-pd-recom-new:hover .btn-orange {
font-size: 14px;
}
.shop-pd-recom-new:hover .product-highlight-hover {
bottom: -67px;
}
.shop-pd-recom-new:hover .image-hover,
.shop-pd-recom-new .image-show {
height: 18px;
}
}
@media (min-width: 992px) and (max-width: 1499px) {
.shop-pd-recom-bg-1 {
padding-left: 40px;
}
.shop-detail {
max-width: calc(100% - 150px);
margin: auto;
height: 621px;
}
.shop-button-prev, .shop-button-next {
top: calc(50% - 45px);
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.shop-detail-item-title {
text-align: center;
}
.shop-detail-item .black-light-25 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.shop-detail .shop-detail-item {
display: block;
width: 100% !important;
}
.shop-detail-image {
width: 250px;
margin: 15px auto;
}
.shop-detail-item .row {
max-width: 390px;
margin: auto;
}
.shop-banner .swiper-container-horizontal>.swiper-pagination-bullets, 
.shop-banner .swiper-pagination-custom, .swiper-pagination-fraction {
bottom: calc(0% + 210px);
}
.shop-pd-recom-new {
padding: 30px 10px;
margin: 0 2px;
}
.shop-pd-recom-new .col-6 {
display: block;
}
}
@media (max-width: 991px) {
.slide-button-next.pd-highlight-button-next::after {
left: 100%;
}
}
@media (max-width: 549px) {
.shop-pd-recom-bg {
height: 280px;
}
.shop-pd-recom-button {
width: auto;
background-color: transparent;
box-shadow: unset;
}
.shop-pd-recom-text .orange-medium-16,
.text-formula {
display: none;
}
.shop-pd-recom-button-prev .shop-pd-recom-text {
left: 60px;
}
.shop-pd-recom-button-next .shop-pd-recom-text {
left: -55px;
}
.shop-pd-recom-button-prev:hover {
left: -100px;
}
.shop-pd-recom-button-next:hover {
right: -100px;
}
.shop-button-prev, .shop-button-next {
top: calc(50% - 176px);
}
.shop-button-prev:after, .shop-button-next:after {
top: calc(50% + 29px);
}
.shop-button-next::before, .shop-button-prev::before {
top: calc(50% + 38px);
}
.shop-button-next::after {
left: calc(100% + 40px);
}
.shop-button-next::before {
left: calc(100% + 60px);
}
.shop-button-prev::after {
right: calc(100% + 40px);
}
.shop-button-prev::before {
right: calc(100% + 60px);
}
.recom-new-image {
height: 150px;
width: 130px;
}
.shop-pd-recom-new:hover .product-highlight-hover {
bottom: -59px;
}
.shop-detail-image {
width: 200px;
}
}
@media (min-width: 1200px) {
.shop-banner { }
.shop-detail-image {
height: 500px;
}
.shop-banner-slider {
padding: 260px 0 0;
}
.shop-ref {
margin-top: -10px;
}
.shop-banner-slider div[class*="col"] {
padding: 10px;
} }  .post-product {
padding-bottom: 45px;
}
.pd-gallery-item-img {
height: 250px;
width: 100%;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}
.pd-gallery-list {
margin: 50px;
}
.pd-gallery-list-item {
width: 60px;
height: 55px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
background-color: #eeeef0;
border-radius: 10px;
border: 1px solid #eeeef0;
}
.pd-gallery-list-item.active {
border-color: #f05b28;
background-color: #fff;
}
.pd-attr-list {
max-width: 470px;
}
.pd-attr-list-item {
display: inline-block;   margin: 0 15px 15px 0;
text-align: center; font-size: 18px; position: relative;
}
.pd-attr-list-item.active {
background: #e15b28;
color: #fff;
}
.pd-inp-num {
position: relative;
display: inline-block;
}
.pd-inp-num input[type=number]::-webkit-inner-spin-button,
.pd-inp-num input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
}
.pd-inp-num input[type=number] {
height: 50px;
width: 120px;
background-color: #fff;
box-shadow: 0px 3px 10px -3px rgba(0, 0, 0, 0.3);
border-radius: 25px;
text-align: center;
padding: 0 22px;
font-size: 22px;
}
.pd-inp-num-button {
position: absolute;
top: 0;
font-size: 18px;
height: 100%;
padding: 10px 15px;
cursor: pointer;
color: #999999;
}
.pd-inp-num-up {
right: 0;
}
.pd-inp-num-down {
left: 0;
}
.pd-tax-list-radio { cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.pd-tax-list-radio input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.checkradio {
position: relative; border-radius: 4px;
min-width: 104px;
height: 50px;
display: block;
padding: 12px 20px;
box-shadow: 0px 1px 10px -3px rgba(0, 0, 0, 0.3);
border-radius: 10px;
}
.checkradio:after {
content: "";
position: absolute;
display: none;
}
.pd-tax-list-radio [type=radio]:disabled + .checkradio {
background-color: #e6e6e6;
color: #919090;
cursor: auto;
}
.pd-tax-list-radio input:checked ~ .checkradio {
color: #fff;
background-color: #e15b28;
} .pd-attr-price,
.added_to_cart {
display: none;
}
.pd-attr-price.active {
display: block;
}
.pd-shr-multi-post {
cursor: pointer;
}
.pd-sharing .yith-wcwl-add-button {
min-width: 150px;
}
.pd-sharing .yith-wcwl-icon {
min-width: 40px;
display: inline-block;
}
.pd-sharing .yith-wcwl-add-button a {
color: #999999;
font-size: 18px;
}
.pd-detail-review {
background-color: #f7f7f7;
}
.pb-tab-header {
text-align: center;
border-bottom: 1px solid #bbbbbb;
}
.pb-tab-header-item {
position: relative;
display: inline-block;
padding: 25px 25px;
cursor: pointer;
color: #333333;
font-size: 22px;
margin: 0 40px;
}
.pb-tab-header-item.active {
color: #e15b28;
font-weight: 500;
border-bottom: 4px solid #e15b28;
}
.pd-tab-detail {
display: none;
padding: 30px 0;
transition: ease-in-out 0.3s;
opacity: 0;
}
.pd-tab-detail.active {
display: block;
opacity: 1;
}
.pd-tab-body h2 {
font-size: 20px;
font-weight: 600;
}
.pd-tab-body h3 {
font-size: 18px;
font-weight: 600;
}
.pd-other-button-next,
.pd-other-button-prev {
position: absolute;
font-size: 20px;
top: 41px;
width: 52px;
height: 52px;
border: 1px solid #bbbbbb;
text-align: center;
padding: 11px;
border-radius: 30px;
color: #bbbbbb;
cursor: pointer;
}
.pd-other-button-next {
right: 0;
}
.pd-other-button-prev {
right: 65px;
}
.pd-sharing .yith-wcwl-wishlistaddedbrowse.hide,
.pd-sharing .yith-wcwl-wishlistexistsbrowse.show {
margin-bottom: -9px;
}
@media (min-width: 768px) {
.pb-tab-header-item {
padding: 20px 50px;
font-size: 25px;
min-width: 230px;
}
.pb-tab-header-item:first-child::after {
content: '';
position: absolute;
width: 1px;
top: calc(50% - 18px);
height: calc(100% - 40px);
right: -42px;
border-right: 1px solid #bbbbbb;
}
}
@media (min-width: 1200px) {
.pd-gallery-item-img {
height: 500px;
}
.pd-gallery-list-item {
width: 120px;
height: 110px;
}
.pd-tab-detail {
padding: 30px 0
}
.pd-content-all {
padding: 0 0 0 30px;
}
.post-product .col-br-center div[class*="col"]:first-child {
border-right: 1px solid #bbbbbb;
}
}
@media (max-width: 991px) {
.pd-sharing .yith-wcwl-add-button a,
.pd-attr-list-item {
font-size: 16px;
}
.pb-tab-header-item {
font-size: 20px;
}
.pd-attr-list-item {
margin: 0 10px 5px 0;
}
.checkradio {
min-width: 92px;
}
.pd-tab-detail div[class*="col"] {
margin: 10px 0;
}
} 
@media (max-width: 767px) {
.pb-tab-header-item {
margin: 0 15px;
padding: 15px 25px;
}
} .post-ref {
font-size: 20px;
}
.vdo-ref {
height: 200px !important;
}
.ref-tag-item {
font-size: 18px;
background-color: #d0d8da;
display: inline-block;
border-radius: 10px;
padding: 0px 10px;
color: #fff;
margin: 0 10px 0 0;
font-weight: 300;
}
.ref-share a {
font-size: 19px;
color: #000000;
margin-right: 10px;
}
.ref-share .copylink {
position: relative;
top: 0;
right: 0;
color: #000000;
font-size: 18px;
cursor: pointer;
padding: 0;
}
.ref-other {
padding: 30px 0;
}
.ref-other .post-ref-item {
height: auto;
border-color: #dddddd;
margin-bottom: 20px; }
.ref-other .post-ref-item .btn-outline-ref,
.ref-other .post-ref-item .btn-ref {
min-width: calc(50% - 9px) !important;
padding: 14px;
height: 60px;
}
.ref-other .post-ref-list-img { background-position: right center;
}
.ref-hide-1, .ref-hide-2 {
display: none;
}
@media (min-width: 768px) {
.ref-other {
margin-top: 250px;
}
.ref-other div[class*="col"]:nth-child(2n-1) {
margin-top: -250px;
}
.vdo-ref {
height: 380px !important;
}
}
@media (min-width: 992px) {
.vdo-ref {
height: 520px !important;
}
}
@media (min-width: 1200px) {
.ref-other .post-ref-list-img {
height: 433px; }
.ref-other .post-ref-item {
min-height: 600px;
}
.vdo-ref {
height: 740px !important;
}
}
@media (max-width: 1200px) {
.btn-ref-orange {
min-width: 250px;
font-size: 20px;
height: auto;
padding: 15px;
}
} .mx--5-mb {
margin-left: -5px;
margin-right: -5px;
}
.pd-search-dt {
display: none;
}
.pd-fiter-menu {
display: block;
} .product-list {
padding: 0 10px;
}
.product-list div[class*="col"] {
padding: 5px;
}
.product-list-item {
border: 2px solid #bbbbbb;
position: relative;
padding: 10px;
transition: ease-in-out 0.3s;
}
.pd-other-list .product-list-item { }  .product-img-item {
height: 265px;
height: 200px;
width: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
margin: 15px 0 20px;
}
.product-list-item .gray-light-16 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.product-list-item .orange-medium-35 {
line-height: 1em;
}
.pd-triangle { width: 183px;
height: 103px;
position: relative;
overflow: hidden;
box-shadow: 0 16px 10px -17px rgba(0, 0, 0, 0.5);
position: absolute;
transform: rotate(315deg);
top: -26px;
left: -66px;
}
.pd-triangle::before {
z-index: 1;
content: 'สินค้าแนะนำ';
font-size: 20px;
position: absolute;
top: 41px;
right: 58px;
width: 67px;
color: #fff;
text-align: center;
line-height: 1.2em;
}
.pd-triangle::after {
content: "";
position: absolute;
width: 127px;
height: 127px;
background: #f05b28;
transform: rotate(45deg);
top: 39px;
left: 28px;
box-shadow: -1px -1px 10px -2px rgba(0, 0, 0, 0.5);
}
.pd-triangle.pd-new::before {
content: 'สินค้าใหม่';
}
.pd-triangle.pd-new::after {
background: #ce1005;
}
.shop-pd-recom-new .pd-triangle {
width: 148px;
height: 85px;
top: -27px;
left: -56px;
z-index: 1;
}
.shop-pd-recom-new .pd-triangle::before {
top: 41px;
right: 47px;
width: 60px;
font-size: 16px;
}
.shop-pd-recom-new .pd-triangle::after {
width: 90px;
height: 90px;
top: 39px;
left: 28px;
}
.pd-tax-list {
padding: 11px 0 0;
}
.pd-tax-list-head {
background: #f05b28;
padding: 15px 40px 15px 20px;
color: #fff;
font-size: 20px;
position: relative;
cursor: pointer;
}
.pd-tax-list-head::after {
font-family: "Font Awesome 5 Free";
content: '\f107';
font-weight: 900;
position: absolute;
right: 20px;
transition: ease-in-out 0.3s;
}
.pd-tax-list-head.active::after{
transform: rotate(180deg);
}
.pd-tax-list-body {
padding: 10px 0;
display: none;
}
.pd-tax-list-body.active {
display: block;
}
.pd-tax-list-item {
padding: 3px 20px;
}
.pd-tax-list-chk {
display: block;
position: relative;
padding-left: 35px;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.pd-tax-list-chk input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.checkmark {
position: absolute;
top: calc(50% - 9px);
left: 0;
height: 18px;
width: 20px;
border: 1px solid #999999;
box-shadow: none;
border-radius: 4px;
}
.checkmark:after {
content: "";
position: absolute;
display: none;
}
.pd-tax-list-chk input:checked ~ .checkmark:after {
display: block;
}
.pd-tax-list-chk .checkmark:after {
left: 2px;
top: -2px;
width: 5px;
height: 10px;
content: '\f00c';
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: 15px;
color: #f05b28;
}
.pd-order-select {
position: relative;
}
.pd-order-select select {
position: relative;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
display: inline-block;
min-width: 175px;
height: 50px;
padding: 0 15px;
border: 1px solid #ffffff;
box-shadow: 0px 3px 9px -2px rgba(0, 0, 0, 0.2);
color: #000000;
margin: 8px 0 8px 0;
font-size: 20px;
border-radius: 30px;
color: #f05b28;
font-weight: 500;
}
.pd-order-select:after {
font-family: "Font Awesome 5 Free";
content: '\f078';
position: absolute;
font-size: 14px;
top: calc(50% - 11px);
left: calc(100% - 29px);
font-weight: 900;
color: #f05b28;
}
.pd-view-list {
cursor: pointer;
}
.pd-view-list.active {
color: #f05b28;
}
.view-list-item .product-img-item {
width: 120px;
}
.view-list-item .product-content-item { width: calc(100% - 135px);
}
.view-list-item {
display: flex;
height: auto !important;
}
.pages-pagination .btn-group {
padding-bottom: 40px;
}
.d-desktop {
display: none;
}
.d-mobile {
display: block;
}
@media (min-width: 575px) {
.pd-fiter-menu {
display: inline-block;
}
.view-list-item .product-img-item {
width: 250px;
}
}
@media (min-width: 991px) {
.d-desktop {
display: block;
}
.d-mobile {
display: none;
}
.pd-search-dt {
display: inline-block;
}
.pd-fiter-menu {
display: none;
}
.pd-search-results {
text-align: right;
}
}
@media (min-width: 992px) and (max-width: 1200px) {
.product-img-item { height: 180px;
}
.d-desktop .search-menu-inp input {
padding: 10px 20% 10px 10px;
}
.d-desktop .search-menu-inp .btn-search {
padding: 10px;
}
}
@media (min-width: 576px) and (max-width: 1399px) {
.product-list .product-content-item div[class*="col"],
.product-list .product-content-item .d-flex {
display: block !important;
max-width: 100%;
}
.product-list .product-content-item div[class*="col"]:last-child {
margin: auto;
}
}
@media (max-width: 1200px) {
.product-list-item > .d-flex div[class*="col"] {
padding: 0;
}
.product-list-item .btn-product-card,
.btn-out-stock {
font-size: 14px;
padding: 5px;
min-width: 120px;
}
.product-list-item .btn-product-card img {
height: 20px;
}
.product-list-item .orange-medium-35 {
font-size: 30px;
}
.pd-triangle,
.shop-pd-recom-new .pd-triangle {
width: 150px;
height: 89px;
top: -25px;
left: -59px;
}
.pd-triangle::after,
.shop-pd-recom-new .pd-triangle::after {
top: 39px;
left: 28px;
width: 100px;
height: 100px;
}
.pd-triangle::before,
.shop-pd-recom-new .pd-triangle::before {
top: 40px;
right: 45px;
width: 60px;
font-size: 16px;
}
}
@media (max-width: 991px) {
.pd-triangle::before,
.shop-pd-recom-new .pd-triangle::before {
font-size: 16px;
}
.menu-mb-search {
display: none;
position: fixed;
top: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 99999;
padding: 0;
height: 100%;    
width: 100%;
left: 0;
}
.menu-mb-search-list {
width: 0;
background: #fff;
top: 0;
margin-left: auto;
height: 100%;
transition: ease-in-out .3s; }
.menu-mb-search.active .menu-mb-search-list {
width: calc(80% - 40px);
}
.menu-mb-search.active {
display: block;
}
.menu-mb-search-btn {
position: fixed;
background: #fff;
margin: 0;
bottom: 0;
width: calc(80% - 40px);
padding: 15px 0;
box-shadow: 0 10px 20px rgb(0 0 0 / 30%), 0 6px 6px rgb(0 0 0 / 0%);
}
.menu-mb-search-btn .btn-outline-orange,
.menu-mb-search-btn .btn-subm-orange {
min-width: calc(50% - 20px);
display: inline-block;
border-radius: 30px;
font-size: 14px;
}
.pd-tax-list-body.active {
overflow: auto;
max-height: 245px;
}
.pd-tax {
overflow: auto;
}
.pd-tax-list {
padding: 11px 20px 0;
}
.menu-pcn-search-toggle {
display: inline-block;
right: 0;
margin: 15px 20px;
position: absolute;
}
.menu-pcn-search-toggle span {
border-color: #000;
background-color: #000;
}
.pd-order-select select {
font-size: 18px;
height: 45px;
min-width: 140px;
}
.pd-tax-list-head {
font-size: 16px;
color: #f05b28;
background-color: #fff;
padding: 0 0 10px;
border-bottom: 1px solid #f3f3f3;
}
.pd-tax-list-head::after {
right: 4px;
}
.pd-tax-list-chk {
margin: 0;
}
.pd-tax-list-item {
padding: 0;
}
.frm-check {
padding: 10px 0;
border-bottom: 1px solid #f3f3f3;
}
.pd-tax-list-body {
padding-top: 0;
}
}
@media (max-width: 575px) { .pd-order-select select {
font-size: 15px;
height: 40px;
}
.menu-mb-search.active .menu-mb-search-list {
width: calc(100% - 40px);
}
.product-img-item {
height: 120px;
}
.product-list-item .btn-product-card, .btn-out-stock {
font-size: 10px;
min-width: 85px;
}
.product-list-item .btn-product-card img {
height: 12px;
}
.product-list-item .orange-medium-35 {
font-size: 19px;
}
.pd-triangle,
.shop-pd-recom-new .pd-triangle {
width: 120px;
height: 69px;
top: -18px;
left: -57px;
}
.pd-triangle::before,
.shop-pd-recom-new .pd-triangle::before {
font-size: 10px;
top: 40px;
right: 32px;
width: 38px;
}
.pd-triangle::after,
.shop-pd-recom-new .pd-triangle::after {
top: 40px;
left: 20px;
width: 100px;
height: 100px;
}
.product-wishlist {
right: 5px;
top: 5px;
}
.product-wishlist .yith-wcwl-add-button .yith-wcwl-icon,
.product-wishlist .yith-wcwl-wishlistexistsbrowse img,
.product-wishlist .yith-wcwl-wishlistaddedbrowse img {
margin-right: 0px;
max-width: 25px;
min-width: auto;
}
.menu-mb-search-btn {
width: calc(100% - 40px);
}
.product-list-item {
padding: 10px 5px 5px;
}
} .sigle-brands-page-content .wp-block-image {
margin-bottom: 15px;
}
.sigle-brands-page-content p {
margin-bottom: 15px;
} .entry-header,
.edit-link {
display: none;
}
.heading-article {
text-align: center;
padding: 50px 0;
}
.product-remove a.remove::before {
content: "\f2ed";
font-family: 'Font Awesome 5 Free';
color: #333333;
}
form table.shop_table.tb-card {
border-collapse: separate;
border-spacing: 0 5px;
}
form table.shop_table th,
form table.shop_table td {
background-color: #fff; }
form table.shop_table tbody tr:nth-child(2n) td {
background-color: #fff;
}
form table.shop_table.tb-card th {
color: #999999;
font-weight: 300;
}
form table.shop_table th i,
.product-remove a {
font-weight: 900;
color: #333333;
font-size: 25px;
}
form table.shop_table td {
vertical-align: middle;
}
.product-name a {
color: #333333;
font-weight: 400;
}
.tb-card .product-price,
.tb-card .product-subtotal {
color: #f05b28;
font-weight: 500;
}
table.cart td.product-quantity .qty {
width: 120px;
}
table.cart td.actions input {
border: 1px solid #bdbdbd;
background-color: #fff;
box-shadow: unset;
}
.cart-collaterals h2 {
font-size: 18px;
color: #fff;
background-color: #e15b28;
margin: 5px 0 0;
padding: 26px 20px;
font-weight: 300;
}
.cart-collaterals table th {
color: #999999;
}
.cart-collaterals table td {
color: #333333;
}
.tb-card .order-total th,
.tb-card .order-total td {
border-top: 1px solid #bdbdbd;
}
table.tb-card .order-total td {
font-size: 25px;
color: #f05b28;
font-weight: 500;
}
.cart-empty {
margin: 0;
}
#calc_shipping_country_field {
display: none;
}
.frm-address .select2-container--default .select2-selection--single .select2-selection__arrow b {
border: 0px solid transparent;
left: 0;
top: calc(50% - 3px);
}
.frm-address .select2-container--default .select2-selection--single .select2-selection__arrow b::after {
font-family: 'Font Awesome 5 Free';
content: '\f107';
color: #888;
}
@media screen and (max-width: 549px) {
table.cart .product-thumbnail img {
max-width: 120px;
}
} .modal-checkout {
border-color: #b0b0b0;
border-radius: 0px;
padding: 30px 20px;
margin: 70px 0 0;
}
.storefront-handheld-footer-bar {
display: none;
}
#mailchimp_woocommerce_newsletter {
margin: auto 0 auto 6px;
}
.frm-address .form-row,
.checkout-login .form-row {
display: block;
margin-bottom: 15px;
margin-right: 0;
margin-left: 0;
}
.frm-address .form-row label,
.frm-address #billing_company_field,
.frm-address #billing_country_field {
display: none;
}
.frm-address .form-row.woocommerce-invalid label {
display: block;
}
.frm-address input[type='text'], 
.frm-address input[type='number'], 
.frm-address input[type='email'], 
.frm-address input[type='tel'], 
.frm-address input[type='url'], 
.frm-address input[type='password'], 
.frm-address input[type='search'], 
.frm-address textarea, 
.frm-address .input-text,
.checkout-login input[type='text'],
.checkout-login .input-text {
font-weight: 300;
border-color: #d3d3d3;
border-width: 1px;
background-color: #fff;
border-style: solid;
box-shadow: none;
}
.frm-address select,
.frm-address .select2-container--default .select2-selection--single {
border-color: #d3d3d3;
background-color: #f7f7f7;
padding: 8px 7px;
font-weight: 300;
border-radius: 0px;
height: auto;
}
.modal-checkout button {
font-weight: 300;
}
table.tb-checkout {
border-width: 1px;
border-color: #bdbdbd;
border-style: solid;
}
table.tb-checkout th, table.tb-checkout tbody td {
background-color: #fff !important;
border-width: 1px 0;
border-color: #bdbdbd;
border-style: solid;
}
table.tb-checkout th,
#ship-to-different-address label {
font-weight: 500;
color: #999;
}
table.tb-checkout tfoot td {
border-width: 0px;
background-color: #fffde9;
}
.text-max-width-rv {
max-width: 140px;
margin-left: auto;
}
@media (max-width: 575px) {
table.shop_table td,
table.shop_table th {
padding: 1em 1em;
}
} .wc_payment_methods_list {
margin: 0;
}
.wc_payment_method label {
display: inline-block;
border-width: 1px;
border-style: solid;
border-color: #bdbdbd;
border-radius: 30px;
width: 250px;
text-align: center;
padding: 10px;
color: #999999;
font-weight: 300;
transition: ease-in-out .3s;
cursor: pointer;
}
#payment .payment_methods li.wc_payment_method > input[type=radio]:first-child:checked + label,
.wc_payment_method label:hover {
background-color: #e15b28;
color: #fff;
}
#payment .payment_methods li.wc_payment_method > input[type=radio]:first-child:checked + label::before {
display: none;
}
#payment .place-order {
background-color: #fff;
padding: 0;
}
#payment .place-order .button {
max-width: 379px;
}
.wc_payment_methods {
border: 1px solid #bcbcbc;
}
.payment-account-bank {
margin: 20px 0 0;
}
.payment-account-bank li {
border: 1px solid #bcbcbc !important;
max-width: 300px;  padding: 15px 20px !important; border-radius: 15px;
color: #000000;
margin: 5px 15px 5px 0;
}
#payment .payment_methods li.account-bank-list img {
float: unset;   max-height: 50px;
}
.account-bank-head-image,
.account-bank-head-detail {
display: inline-block;
}
.account-bank-head-detail { margin: 5px 0 5px 20px;
vertical-align: top;
} ul.order_details {
margin: 30px 0;
}
.order_details {
border: 1px solid #e3e3e3;
background-color: #fff;
}
.order_details > li {
border-bottom: 1px solid #e3e3e3;
}
ul.order_details li {
font-size: 16px;
}
.order_details .row {
margin: 0;
}
ul.order_details li strong {
text-align: right;
font-size: 18px;
}
ul.order_details::before, ul.order_details::after {
display: none;
}
ul.order_details li:last-child {
border: 0; }
.woocommerce_thankyou_bank_acc {
text-align: center;
display: inline-block;
}
.woocommerce_thankyou_bank_acc_img {
width: 120px;
display: inline-block;
vertical-align: middle;
}
.woocommerce_thankyou_bank_acc img {
margin: auto;
}
.wc-bacs-bank-details.order_details div[class*="col"] {
display: flex;
align-items: center;
}
.woocommerce_thankyou_bank_acc_detail {
margin: auto;
text-align: center;
} #\32 c2p_payment_form {
text-align: center;
margin-top: 30px;
}
@media (min-width: 767px) {
.cart-collaterals .cart_totals, .cart-collaterals .shipping_calculator {
width: 100%;
float: unset;
}
form table.shop_table.tb-card th,
form table.shop_table.tb-card td {
background-color: #fff;
border-width: 1px 0 1px 0;
border-color: #bdbdbd;
border-style: solid;
border-collapse: separate;
border-spacing: 18px 10px; 
padding: 1.618em 1.618em 0.5em;
}
form table.shop_table.tb-card td:first-child,
form table.shop_table.tb-card th:first-child {
border-width: 1px 0 1px 1px;
}
form table.shop_table.tb-card td:last-child,
form table.shop_table.tb-card th:last-child {
border-width: 1px 1px 1px 0;
}
form table.shop_table.tb-card tr:last-child td {
border-width: 1px;
padding: 15px 15px 0;
}
.cart-collaterals table th {
background-color: #fff;
vertical-align: middle;
font-weight: 300;
}
.cart-collaterals table td {
background-color: #fff; font-size: 16px;
color: #333333;
}
.modal-checkout {
padding: 30px 40px;
margin: 0;
}
}
@media(max-width: 991px) {
form table.shop_table.tb-card td:last-child {
border-bottom: 1px solid #bdbdbd;
}
form table.shop_table th i,
.product-remove a {
font-size: 18px;
}
.single-product .site-content > .col-full > .woocommerce > .woocommerce-message:first-child, 
.site-content > .col-full > .woocommerce > .woocommerce-info:first-child, 
.single-product .site-content > .col-full > .woocommerce > .woocommerce-error:first-child,
.site-content > .col-full > .woocommerce > .woocommerce-message:first-child {
margin-top: 70px;
margin-bottom: -60px;
}
.wc_payment_methods_detail .payment_box {
display: none !important;
}
.wc_payment_method label {
margin: 0 0 10px !important;
}
#payment .payment_methods li .payment_box {
padding: 10px 15px 20px;
} .wc_payment_methods_name .gray-light-18 {
padding-bottom: 10px;
}
ul.order_details li {
padding: 1em 0;
}
.wc_payment_methods {
border-color: transparent;
}
#payment .payment_methods li {
border: 1px solid #bcbcbc !important;
margin-bottom: 10px;
}
.wc_payment_method label {
width: 100%;
border-radius: 0px;
text-align: left;
position: relative;
padding-left: 35px;
margin: 0 !important;
border-color: transparent;
}
.wc_payment_method input[type="radio"]:checked + label {
border-color: #bdbdbd;
}
.wc_payment_method label[for*="payment_method"]::after {
content: '\f058';
font-family: "Font Awesome 5 Free";
position: absolute;
left: 15px;
}
#payment .payment_methods li.account-bank-list {
border: 1px solid transparent !important;
max-width: 100%;
padding: 0 !important;
}
}
@media (max-width: 575px) {
.modal-checkout button {
min-width: calc(50% - 3px);
}
#submit_2c2p_payment_form, #\32 c2p_payment_form .cancel {
display: block;
max-width: 230px;
margin: auto;
}
}
@media (min-width: 992px) {
.payment-mb {
display: none !important;
}
.wc_payment_methods_name {
padding: 20px;
border-bottom: 1px solid #bcbcbc;
}
.wc_payment_methods_name div[class*="gray"] {
display: inline-block;
padding-right: 30px;
}
#payment .payment_methods li,
.wc_payment_methods_list {
display: inline-block;
}
.payment_box {
padding: 20px;
}
} .frm-login-content {
max-width: 600px;
margin: 50px auto 20px;
}
.frm-radius .form-row {
display: block;
margin-bottom: 15px;
margin-right: 0;
margin-left: 0;
}
.frm-radius input[type='text'], 
.frm-radius input[type='number'], 
.frm-radius input[type='email'], 
.frm-radius input[type='tel'], 
.frm-radius input[type='url'], 
.frm-radius input[type='password'], 
.frm-radius input[type='search'], 
.frm-radius textarea, 
.frm-radius .input-text {
box-shadow: unset;
border: 1px solid #d3d3d3;
border-radius: 30px;
padding: 12px 25px !important;
background-color: #fff;
font-weight: 300;
}
.frm-radius .show-password-input {
top: calc(50% - 20px);
padding: 10px 20px;
}
.frm-radius .form-row label {
padding-left: 20px;
}
.frm-radius .lost_password {
text-align: center;
margin: 20px 0;
} .woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews, p.no-comments {
background-color: #fcb430;   color: #333333;
bottom: 0;
}
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before, .woocommerce-noreviews::before, p.no-comments::before {
color: #333333;
}
.woocommerce-info {
border-color: #f87b04;
border-color: rgba(0, 0, 0, 0.15);
}
.woocommerce-message {
background-color: #9fd084;
border-color: #75b651;
}
.woocommerce-error {
background-color: #ff3f3f;
border-color: rgba(0, 0, 0, 0.15);
} .site-info {
display: none;
}
.site-footer {
padding: 0;
}
.footer-pcn {
padding: 50px 0;
background: #1a1a1a;
color: #ffffff;
line-height: 1.9;
}
.site-footer .footer-pcn a:not(.button):not(.components-button) {
color: #ffffff;
}
.footer-menu-list .menu {
list-style: none;
text-transform: capitalize;
}
.site-footer .footer-menu-list .menu .current_page_item a,
.site-footer .footer-menu-list .menu-item a:hover {
color: #f05b28;
}
.main_footer_index {
font-size: 12px;
font-weight: normal;
font-style: normal;
color: #999999;
background-color: #000000;
padding: 10px 0px;
padding-bottom: 5px; }
.text_company_limited_left {
float: left;
}
.text_company_limited_right {
float: right;
}
.main_footer_index .text_company_limited_right a:not(.button) {
color: #ffffff78;
text-decoration: none; }
.text_company_limited_right img {
filter: brightness(0) invert(0.7);
display: inline-block; }
.text_company_limited_right a:hover img {
filter: unset;
}
.footer-pcn .footer-menu-list .sub-menu {
display: none;
}
@media (max-width: 767px) {
.footer-menu-list .menu {
margin-left: 0;
margin-top: 10px;
}
} .content-404 {
background-image: url(//www.pcn.co.th/wp-content/themes/pcncoth/assets/images/page_404.png);
height: 625px;
background-position: calc(50% + 200px);
background-repeat: no-repeat;
} .myaccount-page {
position: relative;
padding: 30px 0 0;
}
.profile-img {
height: 70px;
width: 70px;
background-position: center;
background-size: cover;
background-repeat: no-repeat; border-radius: 70px;
margin-right: 10px;
box-shadow: 0px 0px 9px 1px rgb(0 0 0 / 10%);
}
.profile-img, .profile-detail {
display: inline-block;
line-height: 30px;
vertical-align: middle;
}
.profile-detail .orange-medium-35 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.hentry .entry-content .woocommerce-MyAccount-navigation ul {
border-width: 0px;
}
.hentry .entry-content .woocommerce-MyAccount-navigation ul li {
border-width: 0px;
border-color: #cacaca;
border-style: solid;
}
.hentry .entry-content .woocommerce-MyAccount-navigation ul li:first-child {
border-width: 0 0 1px; }
.hentry .entry-content .woocommerce-MyAccount-navigation ul.menu-MyAccount li:last-child {
border-width: 1px 0 0;
}
.hentry .entry-content .woocommerce-MyAccount-navigation ul.sub-menu-MyAccount li {
border-width: 0 !important;
}
.hentry .entry-content .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link a {
color: #333333;
font-size: 18px;
padding: 8px 0;
}
.hentry .entry-content .woocommerce-MyAccount-navigation ul.sub-menu-MyAccount li.woocommerce-MyAccount-navigation-link a {
font-size: 16px;
}
.hentry .entry-content .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link.is-active a {
color: #e15b28;
}
.woocommerce-MyAccount-navigation ul li a::before {
display: none;
}
.woocommerce-MyAccount-navigation-link--customer-logout a {
display: inline-block !important;
border: 1px solid #e15b28;
background-color: #e15b28;
border-radius: 30px;
color: #fff !important;
min-width: 170px;
text-align: center;
margin-top: 15px;
}
.nav-menu-Myaccount-staff .orange-medium-35,
.hentry .entry-content .woocommerce-MyAccount-navigation.nav-menu-Myaccount-staff  ul li.woocommerce-MyAccount-navigation-link.is-active a {
color: #1f9985;
}
.nav-menu-Myaccount-staff .woocommerce-MyAccount-navigation-link--customer-logout a {
border: 1px solid #1f9985;
background-color: #1f9985;
}
.myaccount-profile-img {
max-width: 90px;
height: 90px;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
margin: auto;
box-shadow: 0px 0px 15px 7px rgb(0 0 0 / 10%);
border-radius: 99px;
}
.custom-file-input {
opacity: 1;
height: auto;
max-width: 130px;
}
.custom-file-input::-webkit-file-upload-button {
visibility: hidden;
}
.custom-file-input::before {
content: 'เลือกรูป';
display: inline-block;
background: transparent;
border: 1px solid #f05b28 !important;
border-radius: 3px;
padding: 10px 8px;
outline: none;
white-space: nowrap;
-webkit-user-select: none;
cursor: pointer;
color: #f05b28;
min-width: 130px;
text-align: center;
border-radius: 30px;
}
.custom-file-input:hover::before {
border-color: black;
}
.custom-file-input:active::before {
background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
}
.frm-account .form-row {
display: block;
margin-bottom: 15px;
margin-right: 0;
margin-left: 0;
}
.woocommerce-MyAccount-content .frm-account .form-row-first,
.woocommerce-MyAccount-content .frm-account .form-row-last {
width: 100%;
float: unset;
}
.frm-account .form-row label {
display: inline-block;
width: 25%;
color: #999999;
font-weight: 300;
}
.frm-account .woocommerce-form-row input ~ span:not(.show-password-input) {
font-weight: 300;
color: #999999;
width: 73%;
margin-left: auto;
display: block;
font-size: 14px;
}
.frm-account .password-input {
width: 73%;
display: inline-block;
vertical-align: top;
}
.frm-account input[type='text'], 
.frm-account input[type='number'], 
.frm-account input[type='email'], 
.frm-account input[type='tel'], 
.frm-account input[type='url'], 
.frm-account input[type='password'], 
.frm-account input[type='search'], 
.frm-account textarea, 
.frm-account .input-text {
font-weight: 300;
border-color: #d3d3d3;
border-width: 1px;
background-color: #fff;
border-style: solid;
box-shadow: none;
width: 73%;
}
.frm-account #billing_address_2_field span::before,
.frm-account #shipping_address_2_field span::before {
content: '';
display: inline-block;
width: 25%;
}
.frm-account #billing_country_field,
.frm-account #shipping_country_field { }
.frm-account select {
border-color: #d3d3d3;
background-color: #fff;
padding: 8px 7px;
font-weight: 300;
border-radius: 0px;
height: auto;
width: 73%;
}
.password-input input[type='password'],
.password-input input[type='text'] {
width: 100% !important;
}
.frm-account fieldset {
background-color: #fff;
}
@media (min-width: 991px) {
.hentry .entry-content .woocommerce-MyAccount-navigation ul li {
margin-left: 30px;
}
.myaccount-profile-img {
max-width: 190px;
height: 190px;
}
}
@media (min-width: 768px) {
.woocommerce-MyAccount-navigation,
.woocommerce-MyAccount-content {
width: 100%;
float: unset;
}
.woocommerce-MyAccount-navigation {
padding-right: 10%;
}
}
@media (max-width: 992px) {
.profile-img {
height: 45px;
width: 45px;
}
.hentry .entry-content .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link a,
.hentry .entry-content .woocommerce-MyAccount-navigation ul.sub-menu-MyAccount li.woocommerce-MyAccount-navigation-link a {
font-size: 14px;
}
ul.sub-menu-MyAccount {
padding-left: 15px;
}
} .lost_reset_password .form-row label,
.required {
color: #999999;
}
@media (min-width: 768px) {
.form-row-first,
.form-row-last {
width: 100%;
float: unset;
}
.lost_reset_password .form-row label {
display: inline-block;
width: 30%;
padding: 0 10px 0 0;
text-align: right;
}
.lost_reset_password .password-input {
display: inline-block;
width: 69%;
}
}
@media (max-width: 767px) {
.lost_reset_password .btn-orange, #submit_2c2p_payment_form, #\32 c2p_payment_form .cancel { font-size: 14px;
}
} .woocommerce-Address {
box-shadow: 0 0px 15px rgb(0 0 0 / 10%), 0 6px 6px rgb(0 0 0 / 0%); margin-bottom: 25px;
}
.woocommerce-Address header.woocommerce-Address-title {
padding: 20px;
border-bottom: 1px solid #c9c9c9;
}
.woocommerce-Address address {
padding: 20px;
}
.woocommerce-Address .woocommerce-Address-title .edit {
color: #f05b28;
}
@media (min-width: 768px) {
.col2-set#customer_login .col-1, .col2-set.addresses .col-1 {
width: 100%;
float: unset;
margin-right: 0;
display: block;
}
} .orders-item-img {
max-height: 80px;
}
.tb-orders {
box-shadow: 0 0px 20px rgb(0 0 0 / 5%), 0 6px 6px rgb(0 0 0 / 0%);
border-radius: 10px;
}
.tb-orders td {
border-color: #d5d5d5;
border-width: 1px 0;
border-style: solid;
vertical-align: middle;
background-color: #ffffff !important;
}
.tb-orders tr:first-child td {
border-width: 0 0 1px;
}
.tb-orders tr:last-child td {
border-width: 1px 0 0;
}
table.tb-orders td.tb-bg-yellow {
background-color: #fffde9 !important;
text-align: right;
}
.order-detail-cus .woocommerce-column--billing-address,
.order-detail-cus .woocommerce-column--shipping-address {
display: flex;
}
.order-detail-cus .woocommerce-column__title {
width: 35%;
}
.tb-orders .tb-bg-yellow .black-16:last-child .woocommerce-Price-amount {
font-size: 15px;
font-weight: 500;
color: #f05b28;
}
.tb-bg-pd-bottom:not(:last-child) {
padding-bottom: 15px;
}
.checkout-file {
position: relative;
display: inline-block;
width: 100%;
min-height: 35px;
margin-bottom: 0;
font-size: 14px;
}
.checkout-file input[type="file"] {
position: relative;
z-index: 2;
width: 100%;
height: 100%;
margin: 0;
opacity: 0;
}
.file-custom {
position: absolute;
top: 0;
right: 0;
left: 0;
z-index: 1;
height: 100%;
padding: 6px .75rem 6px 105px;
font-weight: 300;
line-height: 22px;
color: #999999;
background-color: #fff;
border: 1px solid #ced4da;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.file-custom::after {
position: absolute;
top: 2px;
left: 2px;
bottom: 0;
z-index: 3;
display: block;
padding: 5px 20px;
color: #fff;
content: "เลือกไฟล์";
background-color: #999999;
border-left: inherit;
height: calc(100% - 4px);
}
small.shipped_via {
display: none;
}
@media (min-width: 992px) {
.order-detail-cus .woocommerce-column__title {
width: 20%;
} 
.tb-orders .tb-bg-yellow .black-16:last-child .woocommerce-Price-amount {
font-size: 25px;
}
.woocommerce-checkout-upload-slip .checkout-file {
width: calc(70% - 35px);
vertical-align: middle;
}
.checkout-file {
font-size: 18px;
min-height: 50px;
}
.file-custom {
padding: 10px .75rem 10px 180px;
line-height: 30px;
}
.file-custom::after {
padding: 9px 40px;
}
}
@media (max-width: 991px) {
.woocommerce-checkout-upload-slip {
text-align: right;
}
.woocommerce-checkout-upload-slip .gray-light-18 {
text-align: left;
display: block;
}
.checkout-file {
text-align: left;
}
.woocommerce-checkout-upload-slip button {
margin-top: 10px;
}
} .tb-wishlist {
border-collapse: separate;
border-spacing: 0 15px;
}
.tb-wishlist tr {
box-shadow: 0 0px 20px rgb(0 0 0 / 5%), 0 6px 6px rgb(0 0 0 / 0%);
}
.wishlist_table .product-add-to-cart a {
display: inline-block !important;
}
.wishlist-product-price {
text-align: left;
}
.wishlist-product-price ins bdi,
.wishlist-product-price span > bdi {
font-size: 25px;
font-weight: 500;
color: #f05b28;
}
.wishlist-product-price del bdi {
font-size: 16px;
text-decoration: line-through !important;
display: block;
color: #999;
font-weight: 400;
}
.wishlist_table tr td.product-thumbnail a img {
max-width: 140px;
}
span.woocommerce-Price-currencySymbol {
display: none;
}
.woocommerce #content table.wishlist_table.cart a.remove:hover {
background-color: transparent;
}
.yith_wcwl_wishlist_footer {
display: none;
}
.wishlist_view.responsive.mobile .product-add-to-cart a {
background-color: #f05b28;
border-color: #f05b28;
border-radius: 30px;
font-weight: 400;
}
.wishlist_view.responsive.mobile .product-remove {
border-bottom: 1px solid #ccc;
}  .coupon-list-box {
border-width: 1px;
border-style: solid;
border-color: #bbbbbb;
padding: 20px 15px;
margin: 10px 0;
text-align: center;
transition: ease-in-out .3s;
height: 100%;
}
.coupon-list-box:hover {
border-color: #1f9985;
box-shadow: 0px 0px 20px 7px rgb(0 0 0 / 10%);
}
.coupon-list-image {
height: 155px;
width: 100%;
filter: drop-shadow(2px 1px 4px rgba(0,0,0,0.1));
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}
.coupon-list-detail {
margin-top: 15px;
}
.page-coupon {
padding: 80px 0;
}
.coupon-col {
position: relative;
}
.coupon-post-image {
height: 100%;
width: 100%;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
margin: auto;
display: flex;
}
.coupon-post-image img {
margin: auto;
align-items: center;
}
.coupon-post-detail {
max-width: 500px;
margin: 20px auto 0;
}
.coupon-code {
position: relative;
padding: 40px 0;
}
.coupon-code .copylink {
left: 0;
background-color: #164bac;
color: #ffffff;
min-width: 137px;
border-radius: 30px;
font-weight: 400;
font-size: 16px;
padding: 10px;
}
.coupon-code #coupon_post {
min-width: 362px;
width: 100%;
border-radius: 30px;
background-color: #f1efef;
padding: 10px 20px 10px 155px;
box-shadow: none;
border: 1px solid #f1efef;
}
.wishlist_table.mobile li {
margin-bottom: 15px;
}
@media (min-width: 991px) {
.page-coupon {
padding: 15px 0 35px;
}
.coupon-col div[class*="col"]:first-child {
border-right: 1px solid #bbbbbb;
}
}
@media (max-width: 992px) {
.myaccount-page {
padding: 20px 0 0;
}
.myaccount-page.content-area-inful {
padding: 60px 0 0;
}
.myaccount-page-new {
padding: 90px 0 0;
}
} .menu-recent-list,
.menu-recent-inp {
display: inline-block;
position: relative;
}
.menu-recent-list,
.menu-recent-inp:not(.menu-recent-inp:last-child) {
margin-right: 8px;
}
.menu-recent-list select {
position: relative;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
display: inline-block;
min-width: 200px; padding: 10px 15px;
border: 1px solid #1f9985; color: #1f9985;
margin: 8px 0 8px 0;
font-size: 18px;
border-radius: 30px;
color: #1f9985;
font-weight: 300;
}
.menu-recent-list::after {
font-family: "Font Awesome 5 Free";
content: '\f078';
position: absolute;
font-size: 14px;
top: calc(50% - 10px);
left: calc(100% - 29px);
font-weight: 900;
color: #1f9985;
}
.frm-recent input {
border: 1px solid #1f9985;
border-radius: 30px;
background-color: #ffffff !important;
box-shadow: none;
padding: 10px 15px;
font-size: 18px;
font-weight: 300;
margin: 8px 0;
}
.frm-recent button {
font-weight: 300;
color: #ffffff;
border: 1px solid #1f9985;
border-radius: 30px;
background-color: #1f9985;
min-width: 150px;
}
@media (min-width: 576px) {
.recent-tb-img {
display: inline-block;
vertical-align: middle;
width: 20%;
text-align: center;
}
.recent-tb-img img {
margin: auto;
}
.recent-tb-name {
display: inline-block;
width: calc(80% - 30px);
vertical-align: middle;
margin-left: 20px;
}
}
@media (max-width: 1200px) {
.menu-recent-list {
width: calc(50% - 8px);
}
.menu-recent-list:not(:first-child) {
margin-right: 0;
}
.menu-recent-list select {
min-width: 100%;
}
.menu-recent-inp:nth-child(2n-1) {
width: calc(100% - 166px);
}
.menu-recent-inp input {
width: 100%;
}
}
@media (max-width: 991px) {
.frm-recent input,
.menu-recent-list select { font-size: 14px;
} .menu-recent-inp:first-child {
width: calc(100% - 166px);
}
}
@media (max-width: 575px) {
.frm-recent input {
width: 100%;
}
.menu-recent-inp {
width: 100% !important;
}
.menu-recent-inp:last-child {
text-align: right;
margin: 8px 0;
}
} .card-shadows {
border-color: transparent;
border-radius: 0px;
box-shadow: 0 0px 20px rgb(0 0 0 / 5%), 0 6px 6px rgb(0 0 0 / 0%);
padding: 20px 25px;
margin: 10px 0;
}
@media (min-width: 768px) {
.chart-sales {
height: 250px !important;
}
}
@media (min-width: 992px) {
.chart-sales {
height: 350px !important;
}
.card-shadows {
padding: 40px 25px;
}
}
@media (min-width: 1200px) {
.chart-sales {
height: 450px !important;
}
} .swiper-button-disabled::before, 
.swiper-button-disabled::before {
color: #c9c9c9;
}
.swiper-button-disabled::after, 
.swiper-button-disabled::after {
border-color: #c9c9c9;
} .d_none_n {
display: none !important;
}
.btn-buy-product {
display: flex;
align-items: center;
justify-content: flex-start;
padding: 5px;
font-size: 18px; 
font-weight: 500;
border-radius: 40px; 
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); 
transition: all 0.3s ease;
text-decoration: none; 
color: #fff; 
width: 100%; 
margin-bottom: 15px;
}
.btn-buy-product:hover {
transform: translateY(-2px); 
box-shadow: 0 8px 15px rgba(0, 0, 0, 0.15); 
text-decoration: none; 
color: #fff; 
}
.btn-line {
background-color: #25D366; 
border-color: #25D366;
}
.btn-line:hover {
background-color: #1DA851;
border-color: #1DA851;
}
.btn-shopee {
background-color: #EE4D2D; 
border-color: #EE4D2D;
}
.btn-shopee:hover {
background-color: #D13A20;
border-color: #D13A20;
}
.btn-tiktok {
background-color: #000000; 
border-color: #000000;
}
.btn-tiktok:hover {
background-color: #333333;
border-color: #333333;
}
.btn-lazada {
background-color: #1A1E4C; 
border-color: #1A1E4C;
}
.btn-lazada:hover {
background-color: #0d102e;
border-color: #0d102e;
}
.btn-buy-product .logo-icon {
width: 40px;
height: 40px;
margin-right: 0.75rem;
border-radius: 50%;
}
.post-blog-content h1, .post-blog-content h2, .post-blog-content h3, .post-blog-content h4 {
margin: 15px 0;
}
.post-blog-content h2 {
font-size: 24px;
}
.post-blog-content h3 {
font-size: 20px;
}
.post-blog-content h4 {
font-size: 18px;
}
.post-blog-content p, .post-blog-content span {
margin: 0 0 15px 0;
display: block;
}
.post-blog-content img {
max-width: calc(100% - 100px);
margin: 15px auto;
}
dl, ol, ul {
margin-top: 1rem;
margin-bottom: 1rem;
}