:root{ --color: #3daf71; --color2:#056537; --fcolor: #2c2d2d; --fcolor2:#717171; --fcolor3:#212020; --bordercolor: #cbcbcb; --bcolor: #dff0e6; }

*::-moz-selection{ background: var(--color); color: #fff; text-shadow: none }

::-moz-selection{ background: var(--color); color: #fff; text-shadow: none }

::selection{ background: var(--color); color: #fff; text-shadow: none }

html, body{ font-family: 'Lato', sans-serif; font-size: 15px; margin: 0px; line-height: 1.5; position: relative; min-height: 100vh; display: flex; flex-wrap: wrap; max-width: 100%; }

a{ -webkit-transition: all .3s ease-out 0s; -moz-transition: all .3s ease-out 0s; -ms-transition: all .3s ease-out 0s; -o-transition: all .3s ease-out 0s; transition: all .3s ease-out 0s; text-decoration: none !important; }

a:focus{ text-decoration: none !important }

a:focus, a:hover{ color: var(--color2); }

a, button{ outline: medium !important; color: var(--color); }

.h1, .h2, .h3{ font-family: 'Lato', sans-serif; font-style: normal; font-weight: 400; margin: 0 }

.h4, .h5, .h6{ font-family: 'Lato', sans-serif; font-style: normal; font-weight: 400; margin: 0 }

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{ line-height: 1.5 }

label{ font-weight: 400 }

.ul{ margin: 0; padding: 0; list-style-type: none }

hr{ margin: 0; padding: 0; border-bottom: 1px solid #fff; display: inline-block; width: 100%; border-top: 0 }

img{ max-width: 100%; height: auto; }

summary{ outline: none; list-style: none; }

article, details{ line-height: 1.75em; }

.form-group{ margin-bottom: 1em }

.clear::after{ display: block; clear: both; content: ""; }

.pad0{ padding: 0 }

.mar0{ margin: 0 }

.hidden{ display: none }

.color{ color: var(--color) }

.color2{ color: var(--color2) }

.color3{ color: #e64514 }

.color4{ color: #e00000 }

.font15{ font-size: 1.5em }
.only_pc {display: block; }
.only_sp {display: none; }


/**/

body #main{ order: 2; margin: auto; }

body #header{ order: 1; background: white; }

body #footer{ order: 3; width: 100%; max-width: 100% }

body #main table{ max-width: 100% !important }

@media (max-width:900px){

	body #main table{ width: 100% !important }

	body #main{ max-width: 1024px; }

}

input, textarea{ border: 1px solid #eee; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; outline: 0; padding: 10px }

input[type='http://www.w3.org/2000/svg']{ -webkit-appearance: button; cursor: pointer }

input::-webkit-inner-spin-button, input::-webkit-outer-spin-button{ -webkit-appearance: none }

input[type='5']{ -moz-appearance: textfield; -webkit-appearance: none }



/**/

header{ width: 100% }

header .headline{background: #3daf71;font-weight: 700;color: #35374e;padding: 0.5em 0;position: relative}

header .headline a{ color: #35374e }

header .headline .hotline a{ font-weight: 700; color: #35374e }

header .headline strong{

    font-weight: 900;

}

header .logosite img{ margin: 0; max-width: 122px; }

header .menuright{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center }

header .blockcart{ position: relative }

header .blockcart svg{ width: 30px; height: 30px; color: #000; stroke: #000; fill: currentColor }

header .blockcart span{ position: absolute; top: -.5em; right: -.5em; width: 20px; height: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background: red; color: #fff; border-radius: 50% }

.menutop{ position: relative }

.menutop:after{ content: ''; position: absolute; top: 100%; width: 100%; height: 1px; background: #f1f1f1 }

.menutop.menufixed{ position: fixed; top: 0; left: 0; width: 100%; z-index: 999; background: #fff; max-width: 100% }

.menutop.menufixedxxx:after{ content: ''; position: absolute; top: 100%; width: 100%; height: 3px; background: #26ace2; background: -webkit-gradient(linear, left top, right top, from(#26ace2), color-stop(33.333%, #e30a8d), color-stop(66.6666%, #f8ef22), to(#58585a)); background: -o-linear-gradient(left, #26ace2 0, #e30a8d 33.333%, #f8ef22 66.6666%, #58585a 100%); background: linear-gradient(90deg, #26ace2 0, #e30a8d 33.333%, #f8ef22 66.6666%, #58585a 100%) }

.menutop.menufixed .logo{}

.menutop.menufixed .logo img{max-height: 40px;}

.menutop.menufixed .listmenu>li>a:not(.logo){padding: 1em 0; }

.social {

	display: flex;

    justify-content: end;

}

.social a {

	display: inline-block;

	margin: 0 3px;

}

.listmenu{list-style: none;margin: 0;padding: 0;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;position: relative;width: 100%;justify-content: center;}

.listmenu li a:hover{}

.listmenu li a.mico{ font-size: 1.25em; text-align: center; padding: 1.25em 0.5em; position: relative; color: #666; }

.listmenu li a.mico span{ position: absolute; transform: translate(-0px, -10px); color: #fff; width: 20px; height: 20px; background: var(--color); border-radius: 50%; font-size: 0.75em; display: inline-flex; align-items: center; justify-content: center; font-weight: 400; z-index: 9; }

.listmenu a.pointer{ position: relative }

.listmenu a.pointer:after{ content: '' }

.listmenu>li{-webkit-box-flex: 1;-ms-flex: 1 auto;flex: 1 auto;text-align: center;position: relative;}

.listmenu>lixxx:before{ content: ''; position: absolute; top: 0; left: 0; width: 1px; height: 100%; background: #f2f2f2; }

.listmenu>li.mactive{ background: #35374e }

.listmenu>li:hover:not(.logosite){}

.listmenu>li.mactive>a{ color: #fff; }

.listmenu>li>a{font-weight: 700;color: #35374e;padding: 3em 1em;display: inline-block;width: 100%;text-transform: capitalize;position: relative;}

.listmenu>li.imenu>a:after{content:'';position: absolute;top: 65%;left: 50%;width: 0;height: 2px;background: var(--color);transform: translateX(-50%);transition: 0.5s;}

.listmenu>li.imenu:hover>a:after{

    width: 50%;

}

.listmenu>li>a:hover{}

.listmenu>li>ul{ display: none }

.listmenu>li ul{ display: none }

.listmenu>li>ul>li a{ padding: .75em 1em; display: inline-block; color: #fff; }

.listmenu>li>ul>li>a{ font-weight: 500; font-size: 1.15em; width: 100%; }

.listmenu>li>ul>li>a span{ margin-left: 0.25em; }

.listmenu>li:hover a.pointer:after{ content: ''; position: absolute; bottom: 0; left: 50%; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #108a55; -webkit-transform: translateX(-90%); -ms-transform: translateX(-90%); transform: translateX(-90%); }

.listmenu>li:hover>ul{ display: block; position: absolute; top: 100%; left: 0; background: #108a55; z-index: 99; list-style: none; padding: 0; width: 175%; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; text-align: left; }

.listmenu>li>ul>li{ width: 100%; }

.listmenu>li>ul>li>ul{ display: unset; list-style: none; padding: 0 }

.listmenu>li>ul>li>ul li{ margin-left: 1em; padding-left: 0; border-left: 1px dashed #000; position: relative }

.listmenu>li>ul>li>ul li:before{ content: ''; position: absolute; top: 50%; left: 0; height: 1px; width: 5px; background: #000 }

.listmenu>li>ul>li>ul a{ padding: .25em 1em }

.menusite{ position: relative }

.searchbar{ position: absolute; top: 100%; left: calc(var(--bs-gutter-x) * .5); width: calc(100% - var(--bs-gutter-x) * .5 - var(--bs-gutter-x) * .5); background: #fff; display: flex; padding: 1px; }

.searchbar form{ flex: 1 calc(100% - 50px); display: flex; }

.searchbar input{ flex: 1 80%; background: rgb(1 110 63 / 50%); font-size: 1.1em; border: none; }

.searchbar button{ flex: 1 20%; border: none; color: #fff; background: var(--color); font-weight: bold; }

.searchbar .close_search{ flex: 1 50px; font-size: 2em; color: white; text-align: center; background: #e00; cursor: pointer; }



/**/

.btconnact{ background-color: transparent; background-image: linear-gradient(160deg, #23ab70 10%, #006d3e 60%); padding: 2.5em 0; color: #fff; }

.btconnact .h2{ font-weight: bold; margin-bottom: 0.5em; }

.btconnact .descx{ text-align: justify; }

.btconnact a{ font-size: 1.2em; font-weight: 700; fill: #006d3e; color: #006d3e; background-color: #fff; border-radius: 8px; padding: .85em 2em; display: inline-block; }

.btconnact a:hover{ transform: scale(1.1); }

.loadding{ position: absolute; top: -1em; left: 0; width: 100%; height: calc(100% + 2em); background: rgba(255, 255, 255, 0.5); display: flex; align-items: center; justify-content: center; }



/**/

.title-style { 

	position: relative;

    font-size: 3rem;

    font-weight: bold;

    color: var(--color2);

    text-align: center;

    margin-bottom: 2rem;

}

.title-style:after { 

	content:'';

	width: 78px;

	height:2px;

	background: #b65d57;

	position: absolute;

	bottom: 0;

	left: 0;

	right: 0;

	margin: auto;

}

.subtitle2 {

	text-align: center;

    font-size: 1.28rem;

	display: block;

	margin-bottom: 2rem;

}

@media(max-width:768px) {

	.title-style { 

		font-size: 2rem;

	}

	.subtitle2 {

		font-size: 1rem;

	}
	.only_pc {display: none; }
	.only_sp {display: block; }

}

/**/

#menu_mobile{ opacity: 0; height: 0; z-index: 99999 }

.blockmmenu{ color: #fff; height: 45px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; background: var(--color) }

.blockmmenu .btnmenu svg{ width: 35px; height: 35px; fill: #fff }

.blockmmenu .btnmenu{ width: 45px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 100%; -webkit-box-flex: 1; -ms-flex: 1 45px; flex: 1 45px }

.blockmmenu .btnmenu a{ color: #fff; font-size: 1.5em }

.blockmmenu .searchbar{ -webkit-box-flex: 1; -ms-flex: 1 calc(100% - 90px); flex: 1 calc(100% - 90px); margin-left: 2em }

.blockmmenu .blockcart{ -webkit-box-flex: 1; -ms-flex: 1 45px; flex: 1 45px }

.blockmmenu .searchbar input{ -webkit-box-flex: 1; -ms-flex: 1 calc(100% - 4em); flex: 1 calc(100% - 4em) }

footer{ -webkit-box-sizing: border-box; box-sizing: border-box; padding: 1em 0 3em; padding-bottom: 0; background: #fff; color: var(--color) }

footer .fcontents{ padding: 2em 0; background: var(--color) }; color: #fff }

footer .fhome h3{ font-weight: 800; margin: 0.5em 0; }

footer .fhome svg{ margin-right: .5em }

footer .polies{ list-style: none; padding: 0 }

footer .polies li{ margin-bottom: .5em; padding-left: .75em; position: relative }

footer .polies li:before{ content: ''; position: absolute; top: 8px; left: 0; width: 5px; height: 5px; background: #fff }

footer .polies a{ color: #fff }

footer .polies a:hover{ color: var(--color2) }

footer .mapd img{ width: 100%; height: auto }

footer .fhome h3{ color: #fff; font-weight: 700; font-size: 3rem; }

footer .fhome p{ color: #fff; }

footer .fhome .hotline a{ color: #fff; font-weight: 700 }

footer .fhome .descx{ text-align: justify; }

footer .fhome p{ margin-bottom: 0.5em; }

footer .ftitle {

    font-size: 1.15em;

    font-weight: 700;

    text-transform: uppercase;

    color: #fff;

    margin-bottom: 1rem;

    display: inline-block;

    border-bottom: 1px solid var(--color2);

}

.fblogs {

    position: relative;

    display: flex;

    transition: all 0.3s;

	margin-bottom: 7px;

	background: #ffffff38;

	align-items: center;

}

.fblogs .img {

    flex: 1 20%;

}

.fblogs .nameit {

    flex: 1 80%;

    padding: 0 1.2em;

}

.fblogs .nameit h3 {

	font-size: 1rem;

}

.fblogs .nameit h3 a {

	color: #fff;

}

footer .copyright{ background: var(--color2); color: #fff; padding: .5em 0; max-width: 100% }

footer .copyright .namesite{ margin: 0; font-weight: 700 }

footer .copyright .subs{ margin: 0 }

footer .copyright a:hover{ color: var(--color) }

footer .copyright a:focus{ color: var(--color) }

footer .socialbox{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -2px }

footer .socialbox a{ padding: 0 3px }

footer .socialbox img{ max-width: 35px; height: auto; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s }

footer .socialbox a:hover img{ -webkit-transform: scale(1.25); -ms-transform: scale(1.25); transform: scale(1.25) }

footer .mbfix{ margin-bottom: 3em }

footer .bottomfixed{ position: fixed; bottom: 0; left: 0; width: 100%; background: #383838; color: #fff; z-index: 999 }

footer .bottomfixed ul{ list-style: none; padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 0 }

footer .bottomfixed ul li{ -webkit-box-flex: 1; -ms-flex: 1 33.3333%; flex: 1 33.3333%; padding: .5em; border-right: 1px solid #fff; text-align: center }

footer .bottomfixed ul li:last-child{ border: none }

footer .bottomfixed span{ font-weight: 700; color: #fff; margin-left: .25em }

.titlebar{ margin: 0; font-size: 1.5em; font-weight: 700; margin-bottom: .15em; color: var(--color); position: relative; z-index: 99 }

.titlebar.tline{ padding-left: 1.5em; position: relative }

.titlebar.tline:after{ content: '' }

.titlebar.tline:before{ content: ''; position: absolute; top: -1.1em; left: 0; width: 45px; height: 45px; background: url(../images/ilogo.svg) }

.titlebar2{ font-size: 1em }

.titlebar2 h2{ font-size: 1.5em; margin-bottom: 1em; font-weight: 700; color: var(--color2) }

.subtitle{ position: relative; z-index: 99; margin: 1em 0; margin-top: 0; text-align: justify; }

.boxframe-popup{ padding: 0 }

.boxframe-popup .thiscontent{ background: url(../images/frame.jpg); background-size: 100% 100%; position: relative }

.boxframe-popup img{ opacity: 0; height: auto }

.boxframe-popup .oranic-photo{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size: 55% 55%; background-position: center }

.boxframe-popup .incode{ position: absolute; bottom: 0; right: 1em; font-size: 2.5em; margin: 0; color: #fff; font-weight: 700; letter-spacing: .05em }

@media(max-width:500px){

	.boxframe-popup img{ max-width: 100% }

}

.breadcrumb li:last-child a{ font-weight: 700 }

.imgz{ -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s }

.imgz:hover{ -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05) }

.imgx{ -webkit-transition: all .25s; -o-transition: all .25s; transition: all .25s }

.imgx:hover{ -webkit-transform: translateY(-7px); -ms-transform: translateY(-7px); transform: translateY(-7px) }

.logosite .logo{padding: 0.5em 0;}

.btncart{ position: relative }

@keyframes colorchange{

	0%{ background: red }

	50%{ background: var(--color) }

	100%{ background: red }

}

@-webkit-keyframes colorchange{

	0%{ background: red }

	50%{ background: var(--color) }

	100%{ background: red }

}

.colorwhite{ color: #fff }

.zimg{ -webkit-transition: all .75s; -o-transition: all .75s; transition: all .75s }

.zimg:hover{ -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); -webkit-transition: all .75s; -o-transition: all .75s; transition: all .75s }

.p-relative{ position: relative !important }

.fullscreen{ width: 100% !important }

.no-reponsive{ min-width: 1200px }

.no-reponsive .container{ width: 1200px !important; max-width: 1200px !important; position: relative }

.shade{ background: rgba(255, 255, 255, .85); padding-top: 1em; padding-bottom: 1em; border-radius: 5px }

.pageinside{ background-color: #fff }

.pageinside h1{ font-size: 1.75em; color: #000; font-weight: 700; margin: .25em 0; }

.pageinside h2.titles{ font-size: 2em; color: var(--color) }

.pageinside .boxbreadscrumbs{ margin-bottom: 2em }

.pageinside .breadcrumb{ background: 0 0; margin: 0; padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex }

.boxpaging{ padding: 1em 0; width: 100%; }

.boxpaging .pagination{ display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; color: #fff; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; list-style-type: none }

.boxpaging .pagination a{ width: 30px; height: 30px; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border: 1px solid var(--color); border-radius: 50%; color: #fff; margin: .25em }

.boxpaging .pagination li a{ color: var(--color) }

.boxpaging .pagination li.dot{ color: var(--color2); font-weight: 700 }

.boxpaging .pagination li a.current{ background: var(--color2); color: #fff }

.boxpaging .pagination li.page_info{ margin-right: .5em; color: var(--color) }

.boxpaging .pagination li a:hover{ background: var(--color); color: #fff }

.pageinside .boxbreadscrumbs.white a{ color: #fff }

.opacity0{ opacity: 0 }

.pwachive{ display: inline-block; max-width: 100%; background: #f1f1f1; margin-bottom: 1em; padding: 1em; line-height: 1em }

.pwachive .pwtitle{ font-weight: 700; font-size: 1.15em }

.pwachive .pwcontents{ font-size: 1.5em; font-weight: 700; color: red }

.pwachive .pwsecond{ display: inline-block; width: 1.5em; text-align: center; font-size: 1.2em }

.pwachive .pwnote{ font-style: italic }

.fixchat{ position: fixed; z-index: 9999; bottom: 1em; right: 1em; display: inline-block; background: rgb(255 255 255 / 50%); padding: 0.15em 0.5em; border-radius: 53px; }

.fixchat span{ color: var(--color); font-weight: bold; }

.riplink{ background: rgba(0, 90, 38, 0.05); padding: 0.5em 1em; border-left: 5px solid var(--color); margin: 0.5em 0; }

.riplink a{ font-weight: bold; color: var(--color) }

.riplink a:hover{ color: red }

figure{ margin: 1.5em; }

figure figcaption{ text-align: center; font-style: italic; padding: 0.25em; font-size: 0.85em }

.details .boximg img{ border-radius: 7px; box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 50%); }

.details table{ border-style: solid; border-width: 1px; border-color: #eee; }

.contentdetails table{ border-style: solid; border-width: 1px; border-color: #eee; box-shadow: inset 0 4px 3px -2px rgb(0 0 0 / 6%), inset 4px 0px 3px -2px rgb(0 0 0 / 6%), inset -4px 0px 3px -2px rgb(0 0 0 / 6%), inset 0px -4px 3px -2px rgb(0 0 0 / 6%); }

.details table td{ border-style: solid; border-width: 1px; border-color: #eee; padding: 0.85em }

.details table td p{ margin-bottom: 0 }

.contentdetails table td{ border-style: solid; border-width: 1px; border-color: #eee; padding: 0.85em }

.contentdetails table td p{ margin-bottom: 0 }

.flexible{display: flex; align-items: center; flex-wrap: wrap; margin: 0 -0.5em; }

.flexible .flexcol{ flex: 1 50%; padding: 0.5em; }

.flexible .flexcol.flex-30{ flex: 1 30%;}

.flexible .flexcol.flex-70{ flex: 1 70%;}

.flexible .flexcol.flex-80{ flex: 1 80%;}

.flexible .flexcol.flex-20{ flex: 1 20%;}

.flexible .flexcol.flex-60{ flex: 1 60%;}

.flexible .flexcol.flex-40{ flex: 1 40%;}

.flexible figure{margin: 0}

.details, .contentdetails{text-align: justify}



@media(max-width:992px){
	footer .fhome h3{ font-size: 2rem; }
}
@media(max-width:576px){
	footer .fhome h3{ font-size: 1.5rem; }
}