@import "variables.less";

*, ::after, ::before { margin: 0; padding: 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; .transition(all, .2s, linear); }

body {
	overflow-x: hidden; overflow-y: overlay; margin: 0; min-height: 100vh; background: @light;
	&::-webkit-scrollbar { width: 13px; }
	&::-webkit-scrollbar-track { background: none; }
	&::-webkit-scrollbar-thumb { border-radius: 8px; border: 4px solid transparent; background-clip: content-box; background-color: rgb(132 132 132 / 50%); }
	&::-webkit-scrollbar-thumb:hover { background-color: #848484; }
}
header {
	@media (min-width: 1281px) {
		#webmenu nav >ul >li {
			.menu_body {
				.translate(-50%, 30px);
				.subOption li {
					.sub2Option {
						.translate(-30px, 0);
						li {
							.sub3Option { .translate(-30px, 0); }
							&:hover .sub3Option { .translate(0, 0); }
						}
					}
					&:hover .sub2Option { .translate(0, 0); }
				}
			}
			&:hover .menu_body { .translate(-50%, 0); }
			&:last-child {
				.menu_body .subOption li {
					.sub2Option {
						.translate(30px, 0);
						li {
							.sub3Option { .translate(30px, 0); }
							&:hover .sub3Option { .translate(0, 0); }
						}
					}
					&:hover .sub2Option { .translate(0, 0); }
				}
			}
		}
	}
	#menu_btn {
		.size(40px, 40px);
		&[data-type="2"] span:nth-child(1) { .rotate(45deg); }
		&[data-type="2"] span:nth-child(2) { .rotate(-45deg); }
		@media (max-width: 640px) { .size(35px, 35px); }
	}
	.contact_box .community a { .circular(40px); }
}
#hSearch {
    .translate(30px, 0);
    &[data-type="2"] { .translate(0, 0); }
}
#gotop:before {
	.size(20px, 20px); .transform(translateY(12px) rotate(45deg)); .animation(go_top 1s linear infinite);
    @-webkit-keyframes go_top { 0% , 100% { .transform(translateY(12px) rotate(45deg)); } 50% { .transform(translateY(6px) rotate(45deg)); } }
    @keyframes go_top { 0% , 100% { .transform(translateY(12px) rotate(45deg)); } 50% { .transform(translateY(6px) rotate(45deg)); } }
}
#webSeo .seo {
    .animation(marquee 200s linear infinite);
    @-webkit-keyframes marquee { 0% { .translate(0, 0); } 100% { .translate(-100%, 0); } }
    @keyframes marquee { 0% { .translate(0, 0); } 100% { .translate(-100%, 0); } }
}