@charset "UTF-8";
.wpml-ls-menu-item .wpml-ls-flag{display:inline;vertical-align:baseline}.wpml-ls-menu-item .wpml-ls-flag+span{margin-left:.3em}.rtl .wpml-ls-menu-item .wpml-ls-flag+span{margin-left:0;margin-right:.3em}ul .wpml-ls-menu-item a{display:flex;align-items:center}

@import url("https://fonts.googleapis.com/css?family=Satisfy&display=swap");
@import url("https://fonts.googleapis.com/css?family=Kanit&display=swap"); html[lang=en-US] {
font-family: Verdana, Helvetica, Arial, sans-serif;
}
html[lang=en-US] .ming {
font-family: 'Satisfy', cursive;
}
html[lang=th] {
font-family: "SF Pro TH","SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
} .eng {
font-family: "Raleway", sans-serif;
}
html[lang=zh-hant] {
font-family: "SF Pro TC","SF Pro Text","SF Pro Icons","PingFang TC","Helvetica Neue","Helvetica","Arial",sans-serif;
}
html[lang=zh-hant] .ming {
font-family: inherit;
}
* { box-sizing: border-box; }
body,input,select,textarea { font-family: 'Kanit', cursive;
font-style: normal;
font-optical-sizing: auto;
font-variant-numeric: lining-nums;
-moz-font-feature-settings:"lnum" 1; 
-moz-font-feature-settings:"lnum=1"; 
-ms-font-feature-settings:"lnum" 1; 
-o-font-feature-settings:"lnum" 1; 
-webkit-font-feature-settings:"lnum" 1; 
font-feature-settings:"lnum" 1;
}
body {
margin: 0;
line-height: 1.5;
}
h1,h2,h3,h4,h5,h6,p {
margin-top:0;
}
p {
line-height: 1.4;
}
img {
display: block;
}
.img_responsive {
max-width: 100%;
width: 100%;
height: auto;
}
.img_full {
width: 100%;
}
.spc_container {
max-width: 1200px;
width: 100%;
margin:0 auto;
padding-left: 20px;
padding-right: 20px;
} header {
position: relative;
z-index:99;
}
header .header_inside { width: 100%;
padding: 10px 20px;
display: grid;
grid-template-columns: 425px 1fr 100px;
left: 0;
background-color: #fff;
align-items: center;
}
header .header_inside .logo {
align-self: center;
display: flex;
grid-gap: 15px;
}
header .header_inside .logo > a{ 
display:grid; grid-gap:15px;
align-self: center;
text-decoration: none;
color:#000;
}
header .header_inside .logo > a span {
font-size:24px;
color:#000;
}
header .header_inside .lang_switch_pc {
display: block;
}
header .header_inside .logo .lang_switch_sp {
display: none;
}
header .header_inside .logo .toggle-menu {
position: relative;
width: 45px;
height: 42px;
border: 0 !important;
align-self: center;
background: transparent;
display: none;
}
header .header_inside .logo .toggle-menu span,header .header_inside .logo .toggle-menu span:before,header .header_inside .logo .toggle-menu span:after {
position: absolute;
transition: all 0.4s;
height: 3px;
width: 30px;
border-radius: 3px;
background: #000;
display: block;
content: '';
cursor: pointer;
z-index: 50;
}
header .header_inside .logo .toggle-menu span {
top: 8px;
left: 5px;
}
header .header_inside .logo .toggle-menu span:before {
bottom: -10px;
}
header .header_inside .logo .toggle-menu span:after {
bottom: -20px;
}
header .header_inside .logo .toggle-menu.active span{
-webkit-transform: translateY(10px) rotate(-45deg);
transform: translateY(10px) rotate(-45deg);
}
header .header_inside .logo .toggle-menu.active span:before {
-webkit-transform: translateY(-10px) rotate(45deg);
transform: translateY(-10px) rotate(45deg);
opacity: 0;
}
header .header_inside .logo .toggle-menu.active span:after{
-webkit-transform: translateY(-20px) rotate(45deg);
transform: translateY(-20px) rotate(90deg);
}
.head_title , .head_title_normal {
margin-bottom: 48px;
}
.head_title {
display: flex;
justify-content: center;
align-items: center;
grid-gap:36px;
}
.head_title_normal { 
text-align: center;
}
.head_title h2,.head_title_normal h2 {
font-size: 50px;
font-weight: 800;
}
.head_title h2,.head_title p,.head_title_normal p {
margin-bottom: 0;
}
.head_title_normal h2 {
margin-bottom: 24px;
}
.head_title p,.head_title_normal p {
font-size: 20px;
font-weight: 400;
} .wp_menu ul {
display: flex;
list-style: none;
justify-content: end;
}
.wp_menu ul li {
padding-left: 24px;
padding-right: 24px;
}
.wp_menu ul#menu-footer-menu li:last-child {
padding-right: 0;
}
.wp_menu ul li a {
color: #000;
text-decoration: none;
}
.wp_menu ul#menu-header-menu li a{ 
font-size: 16PX;
font-weight:500;
}
.wp_menu ul#menu-footer-menu li a { 
font-size: 14px;
font-weight:400;
}
.wp_menu ul li.red a {
border:1px solid #B00120;
padding:8px 24px 8px 24px;
border-radius:2px;
background: linear-gradient(to right, #B00120 50%, transparent 50%);
background-size: 200% 100%;
background-position: right bottom;
transition: all .3s ease-out;
color:#B00120;
}
.wp_menu ul li.red a:hover {
background-position: left bottom;
color:#fff;
text-decoration: none;
}
.red-btn {
display:inline-block;
border:1px solid #B00120;
border-radius:2px;
padding:8px 24px 8px 24px;
color:#B00120;
text-decoration: none;
display: inline-block;
position: relative;
border: 1px solid #B00120;
color: #B00120;
background: transparent;
border-radius: 2px;
background: linear-gradient(to right, #B00120 50%, transparent 50%);
background-size: 200% 100%;
background-position: right bottom;
transition: all .3s ease-out;
}
.red-btn:hover {
background-position: left bottom;
color: #fff;
}
.wp_menu ul#menu-header-menu li:not(:last-child) a:after,.wp_menu ul#menu-footer-menu li a:after {
content: "";
position: absolute;
width: 100%;
height: 1px;
background-color: #fff;
left: 0;
bottom: 0;
opacity: 0;
visibility: hidden;
transition: 0.3s;
}
.wp_menu ul#menu-header-menu li:not(:last-child) a:hover:after,.wp_menu ul#menu-footer-menu li a:hover:after { 
opacity: 1;
visibility: visible;
}
.wp_menu ul#menu-footer-menu li a {
position:relative;
color: #fff;
}
.wpml-ls-current-language {
position: relative;
}
.wpml-ls-current-language a {
color: #333;
text-decoration: none;
}
.wpml-ls-current-language > a {
display: flex;
align-items: center;
}
.wpml-ls-current-language .sub-menu {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
padding: 12px 16px;
z-index: 1;
}
.wpml-ls-current-language {
position: relative;
display: inline-block;
border-left: 1px solid #000;
}
.wpml-ls-current-language:hover .sub-menu {
display: block;
}
.wpml-ls-current-language>a::after {
font-family: "Font Awesome 5 Free";
font-weight: 600;
font-size: 20px;
content: "\f0d7";
margin-left: 15px;
}
.wpml-ls-current-language>a::before {
content: '';
display: inline-block;
background-image: url(//yuasa.co.th/wp-content/uploads/2025/01/world.png);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
text-indent: 100%;
width: 30px;
height: 30px;
max-width: 30px;
margin-right: 10px;
}
@media screen and (max-width: 1250px) and (min-width: 768px) {
header .header_inside {
grid-template-columns: 70px 1fr 100px;
}
header .header_inside .logo {
grid-gap: 10px;
}
header .header_inside .logo > a.logo_title {
display: none;
}
header .header_inside .logo > a span {
font-size: 16px;
}
.head_title h2,.head_title_normal h2 {
font-size: 44px;
}
.head_title p,.head_title_normal p {
font-size: 18px;
}
.wp_menu ul {
padding-left: 0;
}
.wp_menu ul li {
padding-left: 10px;
padding-right: 10px;
}
}
@media (max-width:768px) {
header {
position:sticky;
top:0;
background: #000000;
}
header .header_inside {
position:relative; grid-template-columns: 1fr;
padding: 5px 20px;
}
header .header_inside .logo {
display: grid; justify-content: space-around;
grid-gap:10px;
grid-template-columns: 70px 1fr 45px;
}
header .header_inside .logo > a img { 
width: 45px;
height: 45px;
} 
header .header_inside .lang_switch_pc {
display: none;
}
header .header_inside .logo .lang_switch_sp {
display: flex;
align-self: center;
justify-content: flex-end;
}
header .header_inside .logo .wpml-ls-statics-shortcode_actions {
width: 110px;
text-align: right;
}
header .header_inside .logo > a.logo_title {
display: none;
}
header .header_inside .logo > a span {
font-size:20px;
}
header .header_inside nav {
display: none;
}
header .header_inside nav.active {
display: block;
}
header .header_inside .logo .toggle-menu {
display: block;
}
header .header_inside nav .wp_menu ul {
flex-direction: column;
padding-left: 0;
}
header .header_inside nav .wp_menu ul li { 
margin-bottom: 10px;
padding-bottom: 10px;
padding-left: 0;
padding-right: 0;
text-align: right;
border-bottom: 1px solid #d2d2d2;
}
header .header_inside nav .wp_menu ul li:last-child {
margin-bottom: 0;
}
.wp_menu ul#menu-header-menu li:last-child a {
display: block;
}
.wp_menu ul li.red a {
border:unset;
padding:0;
background: transparent;
color:#000;
}
.wp_menu ul li.red a:hover {
color:#000;
}
.wpml-ls-current-language {
border-left: none;
border-right: 1px solid #000;
}
.wpml-ls-current-language>a::before {
width: 25px;
height: 25px;
max-width: 25px;
}
} body.home main { }
section#home > img {
width:100%;
}
section#home > .spc_container {
position:relative;
}
section#home .txt { color: #B00120;
bottom: 0;
padding: 50px 0;
}
section#home .txt .title {
font-size:52px; margin-bottom:24px;
}
section#home .txt .des {
font-size:32px;font-weight:400;
}
section#partners .world_01 {
padding:36px 0 36px 0;background:#B00120;
}
section#partners .world_01 .title {
text-align:center; margin-top:0;font-size:36px;font-weight:800;
}
section#partners .world_01 .list {
display:flex; 
justify-content:center;
flex-wrap: wrap;
column-gap:30px;
row-gap:15px;
font-size:20px;
}
section#partners .world_01 .list .item {
display:grid;grid-template-columns:28px 1fr;grid-gap:10px;
}
section#partners .world_01 .list a {
text-decoration-color: #fff;text-underline-offset: 6px;
}
section#partners .world_02 {
padding:36px 0 36px 0;background:#B00120;
}
section#partners .world_02 .list {
display:flex;justify-content:center; color:#fff;gap:148px; text-align:center;position:relative;
}
section#partners .world_02 .list .topic .highlight {
font-size:36px; font-weight:800;margin-bottom:8px;
}
section#partners .world_02 .list .topic .highlight .meaning{
font-size:20px;font-weight:400;
}
section.product,section.service {
background: transparent;
}
.spc_container.service_top {
max-width: 1250px;
}
.product_list {
display: flex;
justify-content: center;
flex-wrap: wrap;
column-gap:150px;
row-gap: 48px;
margin-bottom: 48px;
}
.product_list .product_item {
flex: calc(34% - 24px);
max-width: calc(34% - 24px);
}
.product_list .product_item img { }
.product_list .product_item .product_img {
width: 100%;
height:250px;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.product_list .product_item h3{
color: #B00120;
}
.product_list .product_item p{
color: #000;
}
section#product {
padding:84px 0 84px 0;
background-color: #fff;
}
section#product .head_title h2 {
color: #B00120;
}
section#product .head_title p {
color: #000;
}
section#service,section#news,section#contact {
padding:84px 0 84px 0;
background-color: #B00120;
}
section#service .head_title h2 {
color: #fff;
}
section#service .head_title p {
color: #fff;
}
.latest_news_list {
display:grid;
grid-template-columns:584px 1fr;
margin-bottom: 40px;
}
.latest_news_list .latest_news_item {
color:#fff;
padding:24px;
cursor: pointer;
transition:0.3s;
border-radius:4px;
text-decoration: none;
}
.latest_news_list .latest_news_item:hover  {
background:#ACB9FF40;
}
.latest_news_list .latest_news_item .news_img {
overflow: hidden; position: relative;border-radius:2px;
}
.latest_news_list .latest_news_item.first_item .news_img {
width:536px;height:464px;
}
.latest_news_list .latest_news_item.other_item .news_img {
width:177px;height:165px;
}
.latest_news_list .latest_news_item .news_img  img {
width: 100%;
object-fit: cover;
max-width: 100%;
padding-bottom: 0;
position: absolute;
height: 100%;
}
.latest_news_list .latest_news_item.first_item {
grid-row: 1 / span 3; 
}
.latest_news_list .latest_news_item.other_item {
display:grid;
grid-template-columns:177px 1fr; 
}
.latest_news_list .latest_news_item.other_item img { 
padding-right:12px;
}
.latest_news_list .latest_news_item.first_item .content_txt {
padding-top:24px;    
height: 155px;
}
.latest_news_list .latest_news_item.first_item .content_txt .date_cat {
margin-bottom:10px;
}
.latest_news_list .latest_news_item.other_item .content_txt_box {
padding-left:12px;
border-left:1px solid #fff;
display:flex;
flex-direction:column;
justify-content:space-between;
}
.latest_news_list .latest_news_item.other_item .content_txt .date_cat {
margin-bottom:8px;
}
.latest_news_list .latest_news_item.first_item .content_txt .date_cat .date,.latest_news_list .latest_news_item.other_item .content_txt .date_cat .date {
font-size:14px;    
padding-right: 10px;
}
.latest_news_list .latest_news_item.first_item .content_txt .date_cat .cat,.latest_news_list .latest_news_item.other_item .content_txt .date_cat .cat {
font-size:14px; 
padding:3px 20px 3px 20px; 
background:#fff;color:#000; 
border-radius:2px;
display: inline-block;
}
.latest_news_list .latest_news_item .content_txt .title , .latest_news_list .latest_news_item .content_txt .des {
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.latest_news_list .latest_news_item .content_txt .title {
font-size:20px;
font-weight:800;
margin-bottom:8px;
}
.latest_news_list .latest_news_item .content_txt .des {
font-size:16px;
}
.news_more_detail {
padding-top:8px;
text-align:right;
}
.news_more_detail span{
display: inline-block;
position: relative;
padding-right:30px;
font-size:14px;
transition:0.3s;
color:#000;
}
.news_more_detail span:after {
content: "";
position: absolute;
background-image: url("data:image/svg+xml; utf8, <svg width='19' height='10' viewBox='0 0 19 10' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M14.3462 9.15369L13.277 8.09994L15.627 5.74994H0.5V4.24994H15.627L13.2923 1.89994L14.3615 0.846191L18.5 4.99994L14.3462 9.15369Z' fill='black'/></svg>");
width: 19px;
height: 10px;
top: 50%;
right: 0;
transform: translate(0, -50%);
}
.latest_news_list .latest_news_item:hover .news_more_detail span {
text-decoration: underline;
}
@media screen and (max-width: 1250px) and (min-width: 992px) { 
section#home .txt .title {
font-size:44px;
}
section#home .txt .des {
font-size:24px;
}
section#partners .world_01 .title {
font-size:32px;
}
section#partners .world_01 .list .item .item_title {
font-size:18px;
}
section#partners .world_01 .list {
width: 700px;
margin: 0 auto;
column-gap:48px;
}
section#partners .world_02 .list:before,.world_02 .list:after {
content: "";
display: inline-block;
}
section#partners .world_02 .list .topic .highlight {
font-size:32px;
}
section#partners .world_02 .list .topic .highlight .meaning{
font-size:18px;
}
}
@media screen and (max-width: 1250px) and (min-width: 768px) {
body.home .spc_container { }
body.home #news .spc_container {
padding-left: 20px;
padding-right: 20px;
}
section#product,section#service,section#news,section#contact {
padding:56px 0 56px 0;
}
section#partners .world_02 .list {
justify-content: space-evenly;
gap:20px;
}
.latest_news_list .latest_news_item.first_item .content_txt .date_cat .date,.latest_news_list .latest_news_item.other_item .content_txt .date_cat .date,
.latest_news_list .latest_news_item.first_item .content_txt .date_cat .cat,.latest_news_list .latest_news_item.other_item .content_txt .date_cat .cat,
.news_more_detail span{
font-size:13px;    
}
.product_list {
column-gap: 50px;
}
.product_list .product_item {
flex: calc(45% - 24px);
max-width: calc(45% - 24px);
}
}
@media screen and (max-width: 992px) and (min-width: 768px) {
.latest_news_list {
grid-template-columns: 1fr;
}
.latest_news_list .latest_news_item.first_item {
grid-row: unset;
display: grid;
grid-template-columns: 177px 1fr;
}
.latest_news_list .latest_news_item.first_item .news_img {
width:177px;height:165px;
}
.latest_news_list .latest_news_item.first_item .news_img img {
padding-right: 12px;
}
.latest_news_list .latest_news_item.first_item .content_txt_box {
padding-left: 12px;
border-left: 1px solid #fff;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.latest_news_list .latest_news_item.first_item .content_txt {
padding-top:0;
height: auto;
}
}
@media(max-width: 768px) {
section#product, section#service, section#news, section#contact {
padding: 42px 0 42px 0;
}
section#home .txt {
padding-bottom: 35px;
}
section#home .txt .title {
font-size: 20px;
margin-bottom: 10px;
} 
section#partners .world_01 .title {
font-size:24px;
}
section#home .txt .des {
font-size: 14px;
}
section#partners .world_01 .list {
font-size: 20px;
display: grid;
grid-template-columns: 1fr;
column-gap: 10px;
row-gap: 10px;
}
section#partners .world_01 .list .item {
grid-template-columns: 28px 200px;
justify-content: center;
}
section#partners .world_01 .list .item .item_title {
font-size:15px;
}
.latest_news_list {
grid-template-columns: 1fr;
}
section#partners .world_02 .list {
gap: 20px;
flex-direction: column;
}
section#partners .world_02 .list .topic .highlight {
font-size: 24px;
margin-bottom: 0px;
}
section#partners .world_02 .list .topic .meaning {
font-size: 14px;
}
.head_title {
grid-gap: 10px;
flex-direction: column;
}
.head_title h2, .head_title_normal h2 {
font-size: 30px;
}
.head_title p, .head_title_normal p {
font-size:14px;
text-align: center;
}
.head_title, .head_title_normal {
margin-bottom:24px;
}
.product_list {
row-gap: 24px;
margin-bottom: 24px;
}
.product_list .product_item {
flex: 100%;
max-width: 100%;
}
.latest_news_list .latest_news_item.first_item {
grid-row: unset;
display: grid;
grid-template-columns: 1fr;
}
.latest_news_list .latest_news_item.other_item {
grid-template-columns: 1fr;
}
.latest_news_list .latest_news_item.first_item .news_img {
width:100%;height:auto;
}
.latest_news_list .latest_news_item.first_item .news_img img {
padding-right: 12px;
}
.latest_news_list .latest_news_item.first_item .content_txt {
padding-top:0;
height: auto;
}
} .breadcrumb {
padding-top:16px;
padding-bottom:16px;
}
.breadcrumb > * {
margin-left:8px;
margin-right:8px;
}
.breadcrumb > *:first-child {
margin-left:0;
} .header-content .title_page {
border-bottom:2px solid #B00120;
margin-bottom:40px;
padding-bottom: 40px;
}
.header-content .title_page .title {
font-size:36px; 
font-weight:700;
margin-bottom:8px;
line-height: 1.25;
text-transform: capitalize;
}
body.single-post .header-content .title_page .title {
margin-bottom:0px;
}
.header-content .title_page .des {
font-size:20px;
margin-bottom:0;
}
.entry-content {
margin-bottom:80px;
}
@media (max-width:768px) {
.header-content .title_page {
margin-bottom: 30px;
padding-bottom: 30px;
}
.header-content .title_page .title {
font-size: 20px;
}
.header-content .title_page .des {
font-size:16px;
}
.breadcrumb  {
font-size: 14px;
}
} .banner-header {
position: relative;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.banner-header::before {
content: "";
position: absolute;
background-color: #656565;
opacity: 0.2;
width: 100%;
height: 100%;
top: 0;
}
.banner_page {
height:250px;
padding-top:123px;
position:relative;
}
.banner_page .banner_txt {
color:#fff;  
position: absolute; 
top: 50%; 
left: 50%; 
transform: translate(-50%, -50%); 
font-size:40px; 
font-weight:700;
width: 90%;
text-align: center;
text-transform: capitalize;
}
.filter_post {
margin-bottom:24px;
}
.filter_post .filter_cat,.filter_post .filter_day {
position:relative;
margin-right:16px;border:1px solid #B00120; border-radius:2px; padding:5px 15px 5px 15px;
cursor: pointer;
}
.filter_post .filter_cat:before,.filter_post .filter_day:before {
content:"";
position:absolute;
top:50%;
transform: translate(0, -50%);
width:20px;
height:20px;
}
.filter_post .filter_cat:before {
background-image:url(//yuasa.co.th/wp-content/themes/spc01theme/assets/images/icon/calendar_month.svg);
background-size:20px;
}
.filter_post .filter_day:before {
background-image:url(//yuasa.co.th/wp-content/themes/spc01theme/assets/images/icon/Menu.svg);
background-size:20px;
}
.filter_post .submit_filter {
padding: 5px 15px 5px 15px;
background-color: #B00120;
color:#fff;
border: none;
font-size: 16px;
cursor: pointer;
}
.filter_post .filter_cat,
.filter_post .filter_day {
color: #B00120;
font-size: 16px;
cursor: pointer;
}
.post_news_list {
margin-bottom:70px;
}
.post_news_list .news_item {
display:grid; grid-template-columns:250px 1fr; grid-gap:24px; margin-bottom:24px;
}
.post_news_list .news_item .news_img {
overflow: hidden; position: relative; width:250px;height:250px;border-radius:2px;background:#000;
}
.post_news_list .news_item .news_img img {
width: 100%;
object-fit: cover;
max-width: 100%;
padding-bottom: 0;
position: absolute;
height: 100%;
}
.post_news_list .news_item .news_content {
display:flex;flex-direction:column;justify-content:center;
}
.post_news_list .news_item .news_content .news_detail .date {
font-size:14px; margin-bottom:16px;
}
.post_news_list .news_item .news_content .news_detail h2 {
font-size:20px;
margin-bottom:8px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2; 
-webkit-box-orient: vertical;
}
.post_news_list .news_item .news_content .news_detail p {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 3; line-clamp: 3; 
-webkit-box-orient: vertical;
}
.wp-pagenavi {
text-align: center;
align-items: center;
display: flex;
justify-content: center;
}
.wp-pagenavi > * {
position:relative;
padding-right:24px;
padding-left:24px;
font-size:16px;
color:#B8B8B8;
text-decoration:none;
}
.wp-pagenavi .current {
color:#000;
font-weight:600;
}
.wp-pagenavi > *:after {
position:absolute;
content:"";
width: 0.5px;
height: 100%;
background:#000;
right: 0;
z-index: 10;
font-weight:400;
}
.wp-pagenavi > .previouspostslink:before , .wp-pagenavi > .nextpostslink:before,.wp-pagenavi > .previouspostslink:after , .wp-pagenavi > .nextpostslink:after,.wp-pagenavi > *:last-child:after {
content:none;
}
.wp-pagenavi > a.previouspostslink,.wp-pagenavi > a.nextpostslink {
font-size:0;
}
.wp-pagenavi > a.previouspostslink svg,.wp-pagenavi > a.nextpostslink svg {
position:absolute;
top: 0;
transform: translateY(-50%);
}
.wp-pagenavi > a.previouspostslink svg {
left:0;
}
.wp-pagenavi > a.nextpostslink svg {
right:0;
}
.red-btn {
display:inline-block;
border:1px solid #B00120;
border-radius:2px;
padding:8px 24px 8px 24px;
color:#B00120;
text-decoration: none;
display: inline-block;
position: relative;
border: 1px solid #B00120;
color: #B00120;
background: transparent;
border-radius: 2px;
background: linear-gradient(to right, #B00120 50%, transparent 50%);
background-size: 200% 100%;
background-position: right bottom;
transition: all .3s ease-out;
}
.red-btn:hover {
background-position: left bottom;
color: #fff;
}
@media (max-width:768px) {
.banner_page {
height: 180px;
}
.banner_page .banner_txt {
font-size: 30px;
}
.post_news_list .news_item {
grid-template-columns:1fr;
grid-gap: 12px;
margin-bottom: 40px;
}
.post_news_list .news_item .news_content .news_detail h2 {
font-size:18px;
}
.filter_post {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 5px;
}
.filter_post .filter_cat,.filter_post .filter_day { 
margin: 0;
width: 100%;
}
.filter_post .submit_filter {
width: 100%;
grid-column: 1 / -1;
}
}
.single-post .entry-content article h2 {
font-size:22px;
}
.single-post .entry-content article h3 {
font-size:18px;
}
.single-post .entry-content article img {
margin-bottom:24px;
} #home .banner_container {
display: flex;
justify-content: center;
}
#home img {
max-width: 100%;
height: 300px;
}
.home_description {
margin-top: 30px;
margin-bottom: 30px;
}
.home_description p:first-child {
color: #B00120;
font-size: 20px;
font-weight: 700;
}
@media (max-width: 1250px) {
#home img {
height: unset;
}
}
#home_map {
margin-top: 50px;
margin-bottom: 50px;
}
#home_map .home-company_location {
margin-bottom: 40px;
}
#home_map .home-company_location .google_map {
margin-bottom: 20px;
}
#home_map .home-company_location strong {
color: #B00120;
}
.google_map {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
}
.google_map iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.carousel_service {
position: relative;
width: 100%;
overflow: hidden;
margin-bottom: 40px;
}
.carousel_service .carousel_service_slide {
position: relative;
}
.carousel_service .carousel_service_slide .carousel-slides {
width: 100%;
height: 385px;
position: relative;
transition: opacity 0.5s ease;
display: none;
}
.carousel_service .carousel_service_slide .carousel-slides .carousel-slide_item {
display: none;
position: relative;
overflow: hidden;
height: 100%;
}
.carousel_service .carousel_service_slide .carousel-slides .carousel-slide_item.active {
display: block;
animation: opacity 1s;
}
.carousel_service .carousel_service_slide .carousel-slides .carousel-slide_item.item_01 .image_slide_show {
background-image: url(//yuasa.co.th/wp-content/uploads/2025/04/YUASA-slider-copy.jpg);
background-size: auto;
background-position: center;
}
.carousel_service .carousel_service_slide .carousel-slides .carousel-slide_item.item_02 .image_slide_show {
background-image: url(//yuasa.co.th/wp-content/uploads/2024/06/Slide-Image_2.-Installation.png);
background-size: auto;
background-position: center;
}
.carousel_service .carousel_service_slide .carousel-slides .carousel-slide_item.item_03 .image_slide_show {
background-image: url(//yuasa.co.th/wp-content/uploads/2024/06/Slide-Image_3.-Maintainance.png);
background-size: auto;
background-position: center;
}
.carousel_service .carousel_service_slide .carousel-slides .carousel-slide_item.item_04 .image_slide_show {
background-image: url(//yuasa.co.th/wp-content/uploads/2024/06/Slide-Image_4.-Upgrade.png);
background-size: auto;
background-position: center;
}
.carousel_service .carousel_service_slide .carousel-slides .carousel-slide_item .image_slide_show {
height: 100%;
width: 100%;
position: absolute;
}
.carousel_service .carousel_service_slide .carousel_service_indicators {
position: absolute;
bottom: 10px;
left: 50%;
transform: translateX(-50%);
}
.carousel_service .carousel_service_slide .carousel_service_indicators .carousel-indicators {
position: absolute;
bottom: 10px;
left: 50%;
transform: translateX(-50%);
display: flex;
}
.carousel_service .carousel_service_slide .carousel_service_indicators .carousel-indicators .indicator {
width: 10px;
height: 10px;
border-radius: 50%;
background-color: transparent;
border: 1px solid #fff;
margin: 0 5px;
cursor: pointer;
transition: 0.3s;
}
.carousel_service .carousel_service_slide .carousel_service_indicators .carousel-indicators .indicator.active {
width: 40px;
border-radius: 30px;
background-color: #fff;
}
@keyframes opacity {
from {
opacity: 0.5;
}
to {
opacity: 1;
}
}
.carousel_service .list_carousel {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
color: #fff;
}
.carousel_service .list_carousel .item_carousel {
display: grid;
grid-template-columns: 25px 1fr;
grid-gap: 10px;
padding: 24px 15px;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
cursor: pointer;
transition: 0.3s;
}
.carousel_service .list_carousel .item_carousel .red,
.carousel_service .list_carousel .item_carousel .white { width: 25px;
height: 25px;
}
.carousel_service .list_carousel .item_carousel .red {
display: none;
}
.carousel_service .list_carousel .item_carousel ul {
padding-left: 10px;
}
.carousel_service .list_carousel .item_carousel li {
font-size: 14px;
}
.carousel_service .list_carousel .item_carousel.active .red {
display: block;
}
.carousel_service .list_carousel .item_carousel.active .white {
display: none;
}
.carousel_service .list_carousel .item_carousel:hover {
background: #AC5A68;
}
.carousel_service .list_carousel .item_carousel.active {
background: #fff;
}
.carousel_service .list_carousel .item_carousel.active h3 {
color: #B00120;
}
.carousel_service .list_carousel .item_carousel.active li {
color: #000;
}
.carousel_service .list_carousel .item_carousel .item_carousel_detail h3 {
font-size: 16px;
font-weight: 800;
margin-bottom: 8px;
}
.carousel_service .list_carousel .item_carousel .item_carousel_detail p {
font-size: 16px;
font-weight: 400;
margin: 0;
}
@media screen and (max-width: 1250px) and (min-width: 768px) {
.carousel_service .list_carousel {
grid-template-columns: 1fr 1fr;
}
.carousel_service .list_carousel:nth-child(3),
.carousel_service .list_carousel:nth-child(4) {
border-radius: 4px;
}
}
@media (max-width:768px) {
.carousel_service { }
.carousel_service .carousel_service_slide {
background-color: #fff;
}
.carousel_service .list_carousel {
grid-template-columns: 1fr;
border-radius: 4px;
}
.carousel_service .carousel_service_slide .carousel-slides {
display: block;
padding: 20px;
}
.carousel_service .carousel_service_slide .carousel-slides,
.carousel_service .carousel_service_slide .carousel-slides .carousel-slide_item {
height: 300px;
}
.carousel_service .carousel_service_slide .carousel-slides .carousel-slide_item h3 {
color: #B00120;
}
.carousel_service .carousel_service_slide .carousel-slides .carousel-slide_item .image_slide_show {
background-size: cover !important;
}
.carousel_service .list_carousel .item_carousel { padding: 10px; }
.carousel_service .list_carousel .item_carousel .item_carousel_detail { }
}
@media (max-width:512px) {
.carousel_service .carousel_service_slide .carousel-slides,
.carousel_service .carousel_service_slide .carousel-slides .carousel-slide_item {
height: 100%;
}
}
.latest_news_list2 {
display: grid; margin-left: auto;
margin-right: auto;
max-width: 650px;
width: 100%;
background-color: #fff; transition: 0.3s;
}
.latest_news_list2 .latest_news_item {
color: #000; cursor: pointer;
transition: 0.3s;
border-radius: 4px;
text-decoration: none;
}
.latest_news_list2 .latest_news_item:hover {
background-color: #b2b2b2;
}
.latest_news_list2 .latest_news_item .news_img {
overflow: hidden;
position: relative;
border-radius: 2px;
}
.latest_news_list2 .latest_news_item.first_item .news_img {
width: 100%;
height: 300px;
}
.latest_news_list2 .latest_news_item .news_img img {
width: 100%;
object-fit: cover;
max-width: 100%;
padding-bottom: 0;
position: absolute;
height: 100%;
}
.latest_news_list2 .latest_news_item.first_item .content_txt {
padding-top: 24px;
height: 155px;
}
.latest_news_list2 .latest_news_item.first_item .content_txt .date_cat {
margin-bottom: 10px;
}
.latest_news_list2 .latest_news_item.other_item .content_txt_box {
padding-left: 12px;
border-left: 1px solid #fff;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.latest_news_list2 .latest_news_item.other_item .content_txt .date_cat {
margin-bottom: 8px;
}
.latest_news_list2 .latest_news_item.first_item .content_txt .date_cat .date,
.latest_news_list2 .latest_news_item.other_item .content_txt .date_cat .date {
font-size: 14px;
padding-right: 10px;
}
.latest_news_list2 .latest_news_item.first_item .content_txt .date_cat .cat,
.latest_news_list2 .latest_news_item.other_item .content_txt .date_cat .cat {
font-size: 14px;
padding: 3px 20px 3px 20px;
background: #000;
color: #fff;
border-radius: 15px;
display: inline-block;
}
.latest_news_list2 .latest_news_item .content_txt .title,
.latest_news_list2 .latest_news_item .content_txt .des {
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.latest_news_list2 .latest_news_item .content_txt .title {
font-size: 20px;
font-weight: 800;
margin-bottom: 8px;
color: #B00120;
}
.latest_news_list2 .latest_news_item .content_txt .des {
font-size: 16px;
}
@media (max-width:768px) {
.latest_news_list2 .latest_news_item .content_txt .title {
font-size: 14px;
}
}
.view_more {
text-align: center;
}
section#product .view_more a {
display: inline-block;
position: relative;
border: 1px solid #B00120;
color: #B00120;
background: transparent;
padding: 8px 49px 8px 24px;
width: 160px;
text-decoration: none;
text-align: left;
border-radius: 2px;
background: linear-gradient(to right, #B00120 50%, transparent 50%);
background-size: 200% 100%;
background-position: right bottom;
transition: all .3s ease-out;
}
section#product .view_more a:hover {
background-position: left bottom;
color: #fff;
}
section#product .view_more a:after {
content: "";
position: absolute; background-image: url(//yuasa.co.th/wp-content/uploads/2024/12/trending_flat.png);
width: 19px;
height: 10px;
top: 50%;
right: 15px;
transform: translate(0, -50%);
}
section#product .view_more a:hover:after {
background-image: url("data:image/svg+xml; utf8, <svg width='19' height='10' viewBox='0 0 19 10' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M14.3462 9.15369L13.277 8.09994L15.627 5.74994H0.5V4.24994H15.627L13.2923 1.89994L14.3615 0.846191L18.5 4.99994L14.3462 9.15369Z' fill='white'/></svg>");
width: 19px;
height: 10px;
}
section#service .view_more a {
display: inline-block;
position: relative;
border: 1px solid #fff;
color: #fff;
background: transparent;
padding: 8px 49px 8px 24px;
width: 160px;
text-decoration: none;
text-align: left;
border-radius: 2px;
background: linear-gradient(to right, white 50%, transparent 50%);
background-size: 200% 100%;
background-position: right bottom;
transition: all .3s ease-out;
}
section#service .view_more a:hover {
background-position: left bottom;
color: #000;
}
section#service .view_more a:after {
content: "";
position: absolute;
background-image: url("data:image/svg+xml; utf8, <svg width='19' height='10' viewBox='0 0 19 10' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M14.3462 9.15369L13.277 8.09994L15.627 5.74994H0.5V4.24994H15.627L13.2923 1.89994L14.3615 0.846191L18.5 4.99994L14.3462 9.15369Z' fill='white'/></svg>");
width: 19px;
height: 10px;
top: 50%;
right: 15px;
transform: translate(0, -50%);
}
section#service .view_more a:hover:after {
background-image: url("data:image/svg+xml; utf8, <svg width='19' height='10' viewBox='0 0 19 10' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M14.3462 9.15369L13.277 8.09994L15.627 5.74994H0.5V4.24994H15.627L13.2923 1.89994L14.3615 0.846191L18.5 4.99994L14.3462 9.15369Z' fill='black'/></svg>");
width: 19px;
height: 10px;
}
.contact_form {
background: #fff;
padding: 48px 64px;
}
.contact_form>div {
margin-bottom: 30px;
}
.contact_form>div .title>p {
font-weight: 700;
color: #B00120;
margin-bottom: 15px;
font-size: 20px;
}
.contact_form>div p span input {
font-size: 16px;
}
.contact_form input.wpcf7-text,
.contact_form input.wpcf7-tel,
.contact_form input.wpcf7-email,
.contact_form input.wpcf7-text:active,
.contact_form input.wpcf7-tel:active,
.contact_form input.wpcf7-email:active,
.contact_form input.wpcf7-text:focus,
.contact_form input.wpcf7-tel:focus,
.contact_form input.wpcf7-email:focus,
.contact_form input.wpcf7-text:hover,
.contact_form input.wpcf7-tel:hover,
.contact_form input.wpcf7-email:hover {
background-color: transparent !important;
border-left: none;
border-right: none;
border-top: none;
border-bottom: 0.5px solid #000;
color: #000;
padding-bottom: 3px;
width: 100%;
}
.contact_form .wpcf7-textarea,
.wpcf7-textarea:active,
.wpcf7-textarea:focus,
.wpcf7-textarea:hover {
background-color: transparent !important;
border-bottom: 0.5px solid #000;
color: #000;
padding-bottom: 3px;
width: 100%;
}
.contact_form input:-webkit-autofill {
-webkit-text-fill-color: #ffffff;
transition: background-color 5000s ease-in-out 0s;
}
.contact_form input.wpcf7-text:focus,
.contact_form input.wpcf7-tel:focus,
.contact_form input.wpcf7-email:focus,
.contact_form .wpcf7-textarea:focus {
outline: none;
}
.contact_form input.wpcf7-submit {
border: 1px solid #fff;
color: #fff;
background: #000;
border-radius: 2px;
padding: 8px 24px 8px 24px;
width: 160px;
font-size: 16px;
background: linear-gradient(to right, #B00120 50%, #000 50%);
background-size: 200% 100%;
background-position: right bottom;
transition: all .3s ease-out;
}
.contact_form input.wpcf7-submit:hover {
background-position: left bottom;
}
.contact_form input.wpcf7-submit:disabled {
opacity: 0.5;
}
.contact_form input.wpcf7-submit:disabled:hover {
background-position: right bottom;
}
.wpcf7-textarea::placeholder {
line-height: 150px; }
.contact_form input.wpcf7-text::placeholder,
.contact_form input.wpcf7-tel::placeholder,
.contact_form input.wpcf7-email::placeholder,
.contact_form .wpcf7-textarea::placeholder {
color: #787878;
font-size: 16px;
}
.contact_form select.wpcf7-select,
.contact_form select.wpcf7-select:active,
.contact_form select.wpcf7-select:focus,
.contact_form select.wpcf7-select:hover {
width: 100%;
background: transparent;
border-top: none;
border-left: none;
border-right: none;
border-bottom: 1px solid #D0D3E4;
outline: none;
color: #fff;
font-size: 16px;
padding-bottom: 4px;
}
.contact_form select.wpcf7-select option {
color: #000;
}
.contact_form .wpcf7-acceptance .wpcf7-list-item {
margin: 0;
}
.contact_form .wpcf7-acceptance .wpcf7-list-item label {
display: flex;
}
.contact_form .wpcf7-acceptance .wpcf7-list-item input {
width: 20px;
height: 20px;
margin: 0 10px 0 0;
border: 0.5px solid #D0D3E4;
-webkit-appearance: none;
appearance: none;
display: grid;
place-content: center;
}
.contact_form .wpcf7-acceptance .wpcf7-list-item input:before {
content: "";
width: 12px;
height: 12px;
transform: scale(0);
transition: 120ms transform ease-in-out;
box-shadow: inset 1em 1em #000;
transform-origin: bottom left;
clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}
.contact_form .wpcf7-acceptance .wpcf7-list-item input:checked::before {
transform: scale(1);
}
.contact_form .wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label {
align-content: center;
color: #000;
font-size: 14px;
}
.contact_form .wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label a {
color: #000;
text-decoration: underline;
}
.contact_form .wpcf7-not-valid-tip {
padding-top: 10px;
color: #FF7676;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
color: #ffb900;
}
form[data-status="init"] .wpcf7-not-valid-tip {
display: none;
}
.contact_content {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 48px;
}
.contact_content .contact_introduction {
position: relative;
background-image: url(//yuasa.co.th/wp-content/uploads/2024/12/rss_feed.png);
background-repeat: no-repeat;
background-position: bottom left;
}
@media screen and (max-width: 1250px) and (min-width: 768px) {
.contact_content {
grid-template-columns: 1fr 2fr;
}
.contact_content .head_title {
flex-direction: column;
align-items: start;
}
.view_more a {
padding-top: 10px;
padding-bottom: 10px;
width: 180px;
}
.contact_form input.wpcf7-submit {
padding: 10px 24px 10px 24px;
}
}
@media (max-width:768px) {
.contact_form>div {
margin-bottom: 0;
}
.contact_form>div:last-child p {
text-align: center;
margin: 0;
}
.contact_form>div .title>p {
font-size: 16px;
margin-bottom: 10px;
}
.contact_content {
grid-template-columns: 1fr;
grid-gap: 20px;
}
.contact_content .contact_introduction {
background: none;
}
.contact_form input.wpcf7-submit {
width: 100%;
}
}
@media (max-width:512px) {
.home_description p {
font-size: 12px;
}
.home_description p:first-child {
font-size: 14px;
}
.contact_form {
padding: 30px 25px;
}
} .archive_item {
display:grid; 
grid-template-columns:250px 1fr; 
grid-gap:24px; 
margin-bottom:24px;
}
.archive_thumnail {
overflow: hidden; 
position: relative; 
width:250px;
height:250px;
border-radius:2px;
background:#000;
}
.archive_thumnail img {
width: 100%;
object-fit: cover;
max-width: 100%;
padding-bottom: 0;
position: absolute;
height: 100%;
}
.archive_detail {
display:flex;
flex-direction:column;
justify-content:center;
}
.archive_detail .date {
font-size:14px; 
margin-bottom:16px;
}
.archive_detail h2 {
font-size:20px;
margin-bottom:8px;
} .about_welcome { border-bottom: 2px solid #B00120;
margin-bottom: 40px;
padding-bottom: 40px;
}
.about_welcome h2 {
font-size: 32px;
font-weight: 700;
margin-top: 0;
margin-bottom: 8px;
}
.about_welcome p { }
.about_welcome_content {
padding: 12px 0 20px 0;
}
.about_welcome_content .about_welcome_content_list {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 56px;
}
.about_welcome_content .about_welcome_content_list .about_welcome_content_item .txt h2 {
font-size: 20px;
font-weight: 700;
margin-bottom: 8px;
margin-top: 16px;
}
.about_welcome_content .about_welcome_content_list .about_welcome_content_item .txt p {
margin-bottom: 0;
}
.president_ceo {
padding: 20px 0 40px 0;
}
.president_ceo .president_ceo_content {
display: grid;
grid-template-columns: 1fr 2fr;
grid-gap: 16px;
}
.president_ceo .president_ceo_content .president_ceo_img {
overflow: hidden;
position: relative;
grid-row: 1 / span 2;
}
.president_ceo .president_ceo_content .president_ceo_img img {
object-fit: cover;
max-width: 100%;
padding-bottom: 0;
position: absolute;
height: 100%;
}
.president_ceo .president_ceo_content .president_ceo_txt_1 h2 {
font-size: 20px;
font-weight: 700;
margin-bottom: 8px;
}
.president_ceo .president_ceo_content .president_ceo_txt_2 .president_ceo_name {
text-align: right;
}
.president_ceo .president_ceo_content .president_ceo_txt_2 .president_ceo_name span {
font-weight: 500;
}
@media screen and (max-width: 992px) and (min-width: 768px) {
.president_ceo .president_ceo_content .president_ceo_img {
grid-row: unset;
}
.president_ceo .president_ceo_content .president_ceo_txt_2 {
grid-column: 1 / span 2;
}
}
@media (max-width:768px) {
.about_welcome {
margin-bottom: 30px;
padding-bottom: 30px;
}
.about_welcome_content .about_welcome_content_list {
grid-template-columns: 1fr;
}
.about_welcome h2 {
font-size: 20px;
}
}
.banner-header {
position: relative;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.banner-header::before {
content: "";
position: absolute;
background-color: #656565;
opacity: 0.2;
width: 100%;
height: 100%;
top: 0;
}
.corporete_profile {
padding: 0 0 40px 0; }
.corporete_profile h2 {
font-size: 20px;
font-weight: 700;
margin-bottom: 24px;
}
.corporete_profile_list {
border: 1px solid #000;
}
.corporete_profile_list .corporete_profile_item {
display: grid;
grid-template-columns: 260px 1fr;
}
.corporete_profile_list .corporete_profile_item>div { position: relative;
padding: 24px 16px 24px 16px;
}
.corporete_profile_list .corporete_profile_item>div:after {
content: "";
position: absolute;
width: calc(100% - 32px);
height: 0.5px;
bottom: 0;
background: #000;
left: 50%;
transform: translate(-50%, 0);
z-index: 20;
}
.corporete_profile_list .corporete_profile_item>div:first-child {
background: #EEEEEE;
border-right: 1px solid #000;
font-weight: 500;
}
.corporete_profile_list .corporete_profile_item:last-child>div {
border-bottom: none;
}
.corporete_profile_list .corporete_profile_item:last-child>div:after {
content: none;
}
@media (max-width:768px) {
.president_ceo .president_ceo_content {
grid-template-columns: 1fr;
}
.president_ceo .president_ceo_content .president_ceo_img img {
position: relative;
}
.corporete_profile_list {
border-bottom: 0;
}
.corporete_profile_list .corporete_profile_item {
grid-template-columns: 1fr;
}
.corporete_profile_list .corporete_profile_item>div {
padding: 18px 16px;
}
.corporete_profile_list .corporete_profile_item>div:first-child {
border-right: unset;
font-weight: 700;
}
.corporete_profile_list .corporete_profile_item>div:last-child {
padding-left: 30px;
}
.corporete_profile_list .corporete_profile_item>div:last-child {
font-size: 15px;
}
.corporete_profile_list .corporete_profile_item>div:after {
width: 100%;
}
.corporete_profile_list .corporete_profile_item:last-child>div:after {
content: "";
}
} .banner-header {
position: relative;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.banner-header::before {
content: "";
position: absolute;
background-color: #656565;
opacity: 0.2;
width: 100%;
height: 100%;
top: 0;
}
.contact_content {
display:grid; 
grid-template-columns:2fr 1fr; 
grid-gap:32px;
}
.contact_content .contact_detail {
background:#B00120;
padding:30px 25px 30px 25px;
color:#fff;
border-radius: 2px;
}
.contact_content .contact_detail .list {
margin-bottom:16px;
padding-bottom:16px;
border-bottom:1px solid #fff;
}
.contact_content .contact_detail .list:last-child {
border:none;
padding:0;
margin:0;
}
.contact_content .contact_detail .list .title {
margin-bottom:8px;
font-size:22px;
}
.contact_content .contact_detail .list .tel {
margin-bottom:8px;
}
.contact_content .contact_detail .list .detail {
font-size:14px;
}
.contact_us > div {
padding-top:24px;
padding-bottom:24px;   
border-bottom:1px solid #000;
}
.contact_us > div.item_row {
display:grid;
grid-template-columns:200px 1fr;
}
.contact_us > div.item_row .topic {
font-size:20px;
align-self: center;
}
.contact_us > div.item_row.inquiry .topic {
align-self:baseline;
}
.contact_us > div.inquiry,.contact_us > div.accept {
border-bottom:none;
}
.contact_us > div:first-child,.contact_us > div.accept { 
padding-top:0;
}
.contact_us p {
margin-bottom:0;
}
.contact_us input[type=text],.contact_us input[type=email],.contact_us input[type=tel],.contact_us textarea {
width: 100%;
padding:10px;
font-size: 16px;
}
.contact_us .wpcf7-acceptance .wpcf7-list-item {
margin:0;
}
.contact_us .wpcf7-acceptance .wpcf7-list-item label {
display: flex;
}
.contact_us .wpcf7-acceptance .wpcf7-list-item input {
width: 20px;
height: 20px;
margin: 0 10px 0 0;
border: 0.5px solid #D0D3E4;
-webkit-appearance: none;
appearance: none;
display: grid;
place-content: center;
}
.contact_us .wpcf7-acceptance .wpcf7-list-item input:before {
content: "";
width: 12px;
height: 12px;
transform: scale(0);
transition: 120ms transform ease-in-out;
box-shadow: inset 1em 1em #000;
transform-origin: bottom left;
clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}
.contact_us .wpcf7-acceptance .wpcf7-list-item input:checked::before {
transform: scale(1);
}
.contact_us .wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label {
align-content: center;
color:#000;
font-size:16px;
}
.contact_us input.wpcf7-submit {
display:inline-block;
border:1px solid #B00120;
border-radius:2px;
padding: 8px 24px 8px 24px;
width: 160px;
font-size: 16px;
color:#B00120;
text-decoration: none;
display: inline-block;
position: relative;
border: 1px solid #B00120;
color: #B00120;
background: transparent;
border-radius: 2px;
background: linear-gradient(to right, #B00120 50%, transparent 50%);
background-size: 200% 100%;
background-position: right bottom;
transition: all .3s ease-out;
}
.contact_us input.wpcf7-submit:hover {
background-position: left bottom;
color: #fff;
}
.contact_us input.wpcf7-submit:disabled {
opacity: 0.5;
}
.contact_us input.wpcf7-submit:disabled:hover {
background-position:right bottom;
}   
.contact_us .wpcf7-not-valid-tip {
padding-top:10px;
color:#FF7676;
}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output,  .wpcf7 form.payment-required .wpcf7-response-output {
color:#ffb900;
}
form[data-status="init"] .wpcf7-not-valid-tip{
display: none;
}
@media screen and (max-width: 992px) and (min-width: 768px) {
.contact_content {
grid-template-columns:1fr; 
}
}
@media (max-width:768px) {
.contact_content {
grid-template-columns:1fr; 
}
.contact_us > div.item_row {
grid-template-columns:1fr; 
}
.contact_us > div.item_row .topic,.contact_content .contact_detail .list .title {
font-size: 18px;
}
.contact_us textarea {
height: 150px;
}
} .banner-header {
position: relative;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.banner-header::before {
content: "";
position: absolute;
background-color: #656565;
opacity: 0.2;
width: 100%;
height: 100%;
top: 0;
}
.post_porduct_list {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
column-gap: 24px;
row-gap: 24px;
}
.product-contact_area {
background:#F4F4F4;padding:60px 80px 60px 80px;
}
.product-contact_area .product-contact_area-main {
color:#fff; text-align:center;
}
.product-contact_area .product-contact_area-main h4 {
font-size:32px;margin-bottom:16px; color:#B00120;
}
@media screen and (max-width: 992px) and (min-width: 768px) {
.post_porduct_list {
grid-template-columns: 1fr 1fr;
}
}
@media(max-width:768px) {
.product-contact_area {
padding: 30px 50px;
}
.product-contact_area .product-contact_area-main h4 {
font-size: 20px;
}
.post_porduct_list {
grid-template-columns: 1fr;
}
} .single-post .post_content {
margin-bottom:24px;
}
.single-post .post_content .date {
display:inline-block; 
margin-right:24px;
}
.single-post .post_content .cat_link {
display:inline-block;
border:1px solid #000; 
border-radius:2px; 
padding:8px 24px 8px 24px; 
color:#000; 
text-decoration: none;
margin-right:24px;
}
@media (max-width:768px) {
.single-post .post_content .date { 
margin-right: 15px
}
.single-post .post_content .cat_link {
padding :5px 20px 5px 20px;
}
.single-post .post_content strong {
font-size:18px;
}
} footer {
background:#B00120;
color:#fff;
padding: 36px 48px 36px 48px;
}
footer .footer_main {
display: grid; }
footer .footer_main .logo {
display:grid;
grid-template-columns:50px 1fr;
grid-gap:15px;
align-self: center; 
margin-bottom:24px;
}
footer .footer_main .logo img {
padding: 5px;
background: #fff;
border-radius: 50%;
}
footer .footer_content {
display:grid; grid-template-columns: 1fr 1fr 410px;
grid-gap: 15px;
margin-bottom:36px;
}
footer .footer_content .footer_detail .list {
margin-bottom:24px;
}
footer .footer_content .footer_detail .list + .list { 
margin-bottom:0;
}
footer .footer_content .footer_detail .list .title { 
margin-bottom:8px; 
font-weight:700;
font-size: 14px;
}
footer .footer_content .footer_detail .list .des { 
font-size:12px;
margin-bottom: 0;
}
footer .footer_content .footer_menu {
display: flex ; 
flex-direction: column; 
justify-content: space-between;
}
footer .footer_content .footer_menu .wp_menu ul li a {
position:relative;
color: #fff;
font-size: 14px;
}
footer .footer_content .footer_menu .wp_menu #menu-footer-menu-en {
margin:0;
padding:0;
}
footer .footer_content .footer_menu .wp_menu #menu-footer-menu-en li { padding-left: 10px;
padding-right: 10px;
}
footer .footer_content .footer_menu .wp_menu #menu-footer-menu-en li:first-child {
padding-left:0;
}
footer .footer_content .footer_menu .wp_menu #menu-footer-menu-en li:last-child {
padding-right:0;
}
footer hr {
border-top:none;
border-left:none;
border-right:none;
border-bottom:0.5px solid #D0D3E4;
}
footer .social_media {
display: flex;
gap: 18px;
align-self: end;
justify-content: flex-end;
}
footer .copyright {
margin-top:24px; 
font-size:14px;
}
@media screen and (max-width: 992px) and (min-width: 768px) { 
footer .footer_content .footer_menu {
grid-column: 1 / span 2;
}
}
@media (max-width: 992px) {
footer .footer_content .footer_menu nav {
display: none;
} 
footer .footer_content {
grid-template-columns: 1fr 1fr;
}
}
@media (max-width:768px) {
footer {
padding: 24px 0 15px 0;
}
footer .footer_main {
grid-template-columns: 1fr;
}
footer .footer_main .logo {
display: none; grid-template-columns: 35px;
justify-content: center;
}
footer .footer_content {
grid-template-columns: 1fr;
grid-gap: 20px;
margin-bottom: 25px;
}
footer .footer_content .footer_detail + .footer_detail {
border-top:1px solid #000;
padding-top: 20px;
}
footer .social_media {
justify-content: center;
}
footer .copyright {
margin-top: 15px;
font-size: 12px;
text-align: center;
}
.single-post iframe {
aspect-ratio: 16 / 9;
height: 100%;
width: 100%;
}
}