@charset "utf-8";
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css");
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url("search.css");

/* CSS Document */

body{ font-family: "Roboto", sans-serif; font-optical-sizing: auto; font-size: 17px; color: #252c2a; line-height: 30px; font-weight: 400; 
background: url("/images/theme-b67/body_bg_bottom.png"),url("/images/theme-b67/body_bg.png");
background-repeat: no-repeat, repeat-y;
background-position: right bottom,center top;}

h1, h2, h3, h4, h5, h6 { font-family: "Roboto", sans-serif;}

a, a:hover{	transition: 0.3s ease-in-out;}
img { max-width:100%; height: auto;}

.imageCenter, .imageCenter a{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; line-height: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;  z-index: 10;}
.imageCenter img { max-height: 100%;}
p, td, li, label { font-weight: 500; font-size: 18px;}

/**top**/

.scrollToTop { display: inline-block; background-color: #d57514; width: 50px; height: 50px; border-radius: 50px; text-align: center; position: fixed; bottom: 20%; right: 30px; transition: background-color .3s, opacity .5s, visibility .5s; opacity: 0; visibility: hidden; z-index: 1000;}
.scrollToTop::after { content: "\F286";	font-family: bootstrap-icons !important; font-weight: 600; font-size: 1.5em; line-height: 48px; color: #fff;}
.scrollToTop:hover { cursor: pointer; text-decoration: none; background-color: #4a1068;}
.scrollToTop:hover::after {color: #fff!important;}
.scrollToTop:active { background-color: #4a1068;}
.scrollToTop.show {	opacity: 1;	visibility: visible;}

/****/
h1 { font-size: 36px; font-weight: 600;	color: #00775d; position: relative; margin: 0px; padding: 0px 0px 5px 0px;}
h2, h3, h4, h5, h6{ color: #00775d; font-weight: 600;}
h2{ font-size: 30px;}
h3{ font-size: 26px;}
h4{ font-size: 24px;}
h5{ font-size: 22px;}
h6{ font-size: 20px;}

/**index_main**/
.index_main_area{ overflow: hidden;}
.index_about_area{ overflow: hidden; background: url("/images/theme-b67/index_about_bg.jpg")no-repeat left top; background-size: cover;}
.index_about_area .about_text{ padding-top: 100px; text-align: center;}
.index_about_area .about_text .title h1 { color: #00775d; font-size: 50px; font-weight: 600;}

.index_about_area .about_text .sec_dec{ color: #8dbc88; font-size: 26px; font-weight: 500; margin-top: 15px;}
.index_slogin_icon{ max-width: 630px; width: 94%; margin: 30px auto;}
.index_slogin_icon .icon_info { text-align: center; width: 96%; margin: auto;  }
.index_slogin_icon .icon_info img{ height: 86px;}
.index_slogin_icon .icon_info span{ display: block; font-size: 22px; font-weight: 600; color: #252c2a; padding-top: 10px;}
.line_style{ border-right: 1px solid #addaa1;}

.text_color_bg{ background: #ececec; padding: 60px 0px 25px 0px;}
.about_text .text_info{ max-width: 1070px; font-size: 20px; width: 90%; margin:auto; text-align: left; }

/**more**/
.about_text .text_info .more { width: 100px; margin: 10px 0px auto auto;}
.about_text .text_info .more a{ color: #fff; font-weight: 500; display: block; text-align: center; line-height: 36px; background-color: #4a1068;}
.about_text .text_info .more a:hover, .about_text_area .more a:focus{ background-color: #00775d; text-decoration: none;}
.about_text .text_info .more .bi-plus-square::before{ padding-top: 14px!important; padding-left: 10px;}

/**more_all**/
.more { width: 100px; margin: auto;}
.more a{ color: #fff; font-weight: 600; display: block; text-align: center; line-height: 36px; background-color: #4a1068;}
.more a:hover, .about_text_area .more a:focus{ background-color: #00775d; text-decoration: none;}
.more .bi-plus-square::before{ padding-top: 14px!important; padding-left: 10px;}

/**pro**/
.index_pro_area { overflow: hidden; margin-top: 7%;}
.index_pro_main{ max-width: 1440px; width: 90%; margin: auto; position: relative;}
.index_pro_title{ font-size: 52px; line-height: 52px; color: #00775d; font-weight: 600; position: relative;}
.index_pro_dec{ font-size: 20px;}

.index_pro_main .slick-carousel{ margin: 2% auto; padding-bottom: 90px;}
.index_pro_main .slick-carousel div.slick-slide:nth-child(3), .index_pro_main .slick-carousel div.slick-slide:nth-child(5), .index_pro_main .slick-carousel div.slick-slide:nth-child(7), .index_pro_main .slick-carousel div.slick-slide:nth-child(9), .index_pro_main .slick-carousel div.slick-slide:nth-child(11), .index_pro_main .slick-carousel div.slick-slide:nth-child(13){ margin-top: 30px;}

.slide-content{ max-width: 390px; width: 100%; margin: auto; }
.index_proitem_photo{ overflow: hidden; position: relative; padding-bottom: 95%; background-color: #fdfbfb; height: 0; line-height: 0; z-index: 1; transition: all 0.5s ease 0s; margin: 10px;}
.index_proitem_photo:hover { box-shadow: 0px 0px 8px #e2e2e2;}
.index_proitem_photo img {transform: scale(1.0, 1.0); transition: all 0.5s ease 0s;}
.index_proitem_photo:hover img {transform: scale(1.1, 1.1);}

.index_proitem_title{ background-color: #4a1068; margin: 0px 10px; position: relative;}
.index_proitem_title a{ min-height: 50px; display: flex; align-items: center; justify-content: center; color: #fcfcfc; font-size: 20px; font-weight: 600;}
.index_proitem_title a:hover{ text-decoration: none; background-color: #00775d;}

.index_proitem_title .bi{position: absolute; right: 10px; top: 10px; margin: auto;}
.index_proitem_title .bi-plus-square::before { content: "\f4fd"; color: #fff; font-size: 150%; line-height:normal!important;}


.index_pro_area .slick-prev, .index_pro_area .slick-next{ width: 50px; height: 50px; top: inherit; bottom: -40px;}
.index_pro_area .slick-prev {left: inherit; right: 55px;}
.index_pro_area .slick-next{ right: 0px;}
.index_pro_area .slick-prev:before, .index_pro_area .slick-next:before{ color: #c47b2e; font-size: 42px; font-family: bootstrap-icons !important;}
.index_pro_area .slick-next:before{ content: "\F133";}
.index_pro_area .slick-prev:before{ content: "\F129";}

/**E-Catalog**/
.index_catalog_area{ overflow: hidden; margin: 5% auto;}
.catalog_main{ position: relative;  width: 100%; overflow: hidden;}
.catalog_main::before, .catalog_main::after{ position: absolute; z-index: 1; content: ""; width: 28vw; min-height: 370px; background-color: #f2f2f2; top: 15vh; }
.catalog_main::before{ left: 0px;border-radius: 0px 8px 8px 0px; }
.catalog_main::after{ right: 0px; border-radius: 8px 0px 0px 8px; }

.catalog_main .slider { position: relative; z-index: 9; padding: 0 0px; margin: 4rem auto;  max-width: 800px; width: 80%;}
.catalog_main .slider .item.slick-slide { width: 354px; height: 500px !important; transition: transform .5s ease;  position: relative; box-shadow: 0px 0px 5px #a1a1a1; margin: 8px;}
.catalog_main .slider .item.slick-slide span{position: absolute; width: 25%; z-index: 99; bottom: 10px; right: 0px; left: 0px; margin-left: auto; margin-right: auto;}
.catalog_main .slider .item.slick-slide span a{ text-align: center; color: #fff; font-size: 15px; display: block; background: #4a1068a8; padding: 0px 5px;}
.catalog_main .slider .item.slick-slide span a:hover, .catalog_main .slider .item.slick-slide span a:focus{ text-decoration: none; background: #00775d;}

.catalog_main .slider .slick-slide:after {  content:'';  position: absolute;  z-index: 2;  top: 0;  left: 0;  right: 0;  bottom: 0;  background: rgba(0,0,0,.5);  transition: transform .4s;}
.catalog_main .slider .item.slick-slide {  transform: scale(0.7)  translate(640px);}
.catalog_main .slider .item.slick-slide.slick-center + .slick-slide {  transform: scale(0.8) translate(-250px);  z-index: 10;}
.catalog_main .slider .item.slick-slide.slick-center + .slick-slide + .item.slick-slide {  transform: scale(0.7)  translate(-640px);  z-index: 5;}
.catalog_main .slider .item.slick-slide.slick-active {  transform: scale(0.8) translate(250px);}
.catalog_main .slider .item.slick-slide.slick-center {  transform: scale(1);  z-index: 30;}
.catalog_main .slider .slick-center:after { opacity: 0; margin:10px;  padding:10px;}


.catalog_main .slick-dots li button:before{ font-size: 15px;}
.catalog_main .slick-dots li.slick-active button:before{ color: #c47b2e;}

/**index_news_area**/
.index_news_area{ overflow: hidden; margin: 5% auto;}
.index_news_main{ max-width: 1280px; width: 90%; margin: 5% auto;}
.index_news_list{ display: flex; align-items: center; justify-content: space-around; border-bottom: 1px solid #777777; padding-bottom: 15px; margin-bottom: 35px;}

.index_news_date{ background: #fff7ee; width: 110px; height: 120px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.index_news_date span{ display: block; font-weight: 600;}
.index_news_date span.year{ font-size: 220%; color:#c47b2e; padding-bottom: 10px;}
.index_news_date span.date{ font-size: 200%; color:#00775d;}
.index_news_photo{ max-width: 120px; width: 100%; overflow: hidden; position: relative; padding-bottom: 9%; background-color: #fff; height: 0; line-height: 0; z-index: 1; border: 1px solid #bebebe;}

.index_news_contact{ width: 70%; min-height: 120px; border-left: 1px solid #bebebe; padding-left: 20px; margin-left: 20px;}
.index_news_contact .title{ font-size: 170%; font-weight: 600; margin-top: 5px;}
.index_news_contact .title a{ color: #252c2a; }
.index_news_contact .title a:hover, .index_news_contact .title a:focus{ text-decoration: none; color: #be7830;}
.index_news_contact .dec{ margin-top: 10px; line-height: 26px;}

.news_more .more{ width: 90px;}
.news_more .more span{ display: block; text-align: center;}
.news_more .more a, .news_more .more a:active{ display: flex; justify-content: center; flex-wrap: nowrap; flex-direction: column; align-items: center; width: 90px; height: 90px; background-color: #4a1068; font-size: 22px; color: #fff;}
.news_more .more a:hover, .news_more .more a:focus{ background-color: #00775d; text-decoration: none;}

/****/

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

}
@media all and (max-width: 1536px) {
	.index_pro_area .slick-prev::before, .index_pro_area .slick-next::before{ font-size: 42px;}
}
@media all and (max-width: 1366px) {
	.scrollToTop{ width: 40px; height: 40px;}
	.scrollToTop::after{line-height: 40px;}
	.index_news_date{ width: 90px; height: 90px;}
	.index_news_date span.year{ font-size: 200%;}
	.index_news_date span.date{font-size: 180%;}
	.index_news_photo{ max-width: 90px; padding-bottom: 8%;}
	.index_news_contact{ min-height: 90px;}
	.index_news_contact .title{ font-size: 140%;}
}
@media all and (max-width: 1280px) {
}

@media all and (max-width: 1024px) {
	.index_pro_title { font-size: 40px; line-height: 40px;}
	.index_news_contact{width: 65%;}
	.index_proitem_title a{ font-size: 18px; min-height: 40px; text-align: left; padding-left: 15px; justify-content: flex-start;}
	.index_proitem_title .bi{ top: 7px;}
	.index_proitem_title .bi-plus-square::before{ font-size: 120%;}
	.catalog_main::before, .catalog_main::after{ width: 10vw;}
	.index_news_date span.year { font-size: 160%;}
	.index_news_date span.date { font-size: 140%;}
}
@media all and (max-width: 991px) {
	.index_pro_main .slick-carousel div.slick-slide:nth-child(3), .index_pro_main .slick-carousel div.slick-slide:nth-child(5), .index_pro_main .slick-carousel div.slick-slide:nth-child(7), .index_pro_main .slick-carousel div.slick-slide:nth-child(9), .index_pro_main .slick-carousel div.slick-slide:nth-child(11), .index_pro_main .slick-carousel div.slick-slide:nth-child(13){ margin-top: 0px;}
	.catalog_main::before, .catalog_main::after { width: 7vw; }
}
@media all and (max-width: 768px) {	

}
@media all and (max-width: 767px) {
	.index_about_area .about_text .title h1{ font-size: 40px;}
	.index_about_area .about_text .sec_dec{ font-size: 20px; margin-top: 5px;}
	.catalog_main .slider .item.slick-slide{ width: 300px;  height: 424px !important;}
	.catalog_main .slider .item.slick-slide span{ width: 40%;}
	.index_news_photo{padding-bottom: 13%;}
	.index_news_contact { width: inherit;}	
	.index_news_contact{ margin: 0px 10px;}
	.index_news_contact .title { font-size: 120%; }
}
@media all and (max-width: 540px) {	
	.scrollToTop{ right: 8px;}
	.banner_area{margin-top: 80px;}
	.index_about_area .about_text .title h1{ font-size: 34px; line-height: 38px; padding: 0px 20px;}
	.index_slogin_icon .icon_info span{ font-size: 90%;}
	.index_about_area .about_text .sec_dec{ width: 80%; margin: auto; text-align: center;}
	.about_text .text_info .more .bi-plus-square::before{padding-top: 8px !important;}
	.index_pro_area .slick-prev::before, .index_pro_area .slick-next::before { font-size: 36px;}
	.index_pro_main .slick-carousel{ padding-bottom: 60px;}
	.index_pro_area .slick-prev, .index_pro_area .slick-next{ bottom: -20px;}
	.index_news_list{ flex-direction: row; justify-content: flex-start; flex-wrap: wrap;}
	.index_news_date{ width: 100%; height: inherit; flex-direction: unset;}
	.index_news_date span.year{ font-size: 140%; padding: 0px 5px;}
	.index_news_photo{ width: 100%; max-width: inherit; margin-top: 10px; padding-bottom: 78%; }
	.index_news_contact{ width: 100%; border-left:none; padding: 0px; margin: 10px 0px;}
	.news_more .more{ margin: auto 0px auto auto; width: 100%;}
	.news_more{ text-align: center; width: 100px; margin: auto 0px auto auto;}
	.news_more .more a, .news_more .more a:active{ font-size: 100%; width: 100px; align-items: center; flex-direction: row; justify-content: center; height: inherit; line-height: 26px;}
	.more .bi-plus-square::before{ padding-top: 7px!important;font-size: 80%;}
	.about_text .text_info .more a{ line-height: 26px;}
	.more a{ line-height: 26px;}
}
@media all and (max-width: 412px) {
	.index_about_area .about_text{ padding-top: 50px;}
	.index_about_area .about_text .title h1{font-size: 30px; padding: 0px 10px;}
	.index_about_area .about_text .sec_dec{ line-height: 26px;}
	.text_color_bg{ padding: 25px 0px 25px 0px;}
	.about_text .text_info, .index_pro_dec, .index_slogin_icon .icon_info span{ font-size: 100%;}
	.index_proitem_title .bi-plus-square::before { font-size: 90%;}
	.index_proitem_title a{ font-size: 17px;}
	.catalog_main .slider .item.slick-slide { width: 212px; height: 300px !important;}
	.slick-dots li.slick-active button:before { opacity: .75; color: black;}
	.catalog_main .slick-dots li button::before { font-size: 12px;}
	.index_catalog_area .slick-dots{ bottom: -18px;}
	.index_pro_title { font-size: 30px; line-height: 30px; margin: 15px auto;}
	.about_text .text_info .more .bi-plus-square::before{ font-size: 80%;}

}

@media all and (max-width: 390px) {
	.index_slogin_icon .icon_info span { font-size: 80%;}
	.index_pro_main .slick-carousel{ padding-bottom: 50px;}
	.index_pro_area .slick-prev::before, .index_pro_area .slick-next::before { font-size: 30px;}
	.index_pro_area .slick-prev{right: 35px;}
	.catalog_main .slider{ margin: 2rem auto;}
	.catalog_main::before, .catalog_main::after{ top: 6vh;}
}
@media all and (max-width: 360px) {
}
@media all and (max-width: 320px) {
	.index_proitem_title a { font-size: 80%;}
	.index_news_contact .title { font-size: 100%;line-height: 24px; }

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

}