/* Remove dropdown-item hover effect for tablet view */
header .dropdown-item:hover {
	background: none !important;
	color: inherit !important;
}
@media (min-width: 768px) and (max-width: 1199px) {
	/* header */
	header{
		padding: 0 20px;
	}
	header div.wrap2 ul{
		display: none;
	}
	header div.wrap2 span .login-btn:hover{
		opacity: 1;
	}
	/* title */
	#title{
		width: calc(100% - 40px);
	}
	.wnext{
		top: 563px;
		transform: translateX(-50%);
	}
	.t1 .tbox img{width: 36% !important;left: calc(33vw - 40px);top: 285px !important;}
	.t2 .t2box img{width: 36%;right: 32vw;top: 320px;}
	.t3 .tbox img{width: 38% !important;top: 280px !important;left: calc(35vw - 40px);}
	.t4 .tbox img{width: 38% !important;top: 280px !important;left: calc(35.5vw - 40px);}

	/* titleAni */
	.titleAni.slick-initialized .slick-slide > div{
		padding: 48px 20px 0;
		display: flex;
		flex-wrap: wrap;
		flex-direction: column;
		align-items: center;
		width: 100%;
		margin-top: 17px;
	}
	.titleAni div h2.bold{
		font-size: 24px;
		letter-spacing: -.5px;
		padding: 6px 20px 0;
	}
	.titleAni div p{
		text-align: center;
	}
	.titleAni a{
		width: 300px;
		margin-top: 20px;
	}
	.titleAni a:hover{
		background-color: #fff;
	}
	
	/* Product */
	section#product div.wrap{
		width: calc(100% - 40px);
		padding: 36px 0;
	}
	section#product div.wrap ul li:hover{
		transform: translateY(0px);
	}
	section#product div.wrap ul li a {
		padding: 20px 0;
		height: 80px;
	}
	section#product div.wrap ul li a figure {
		flex-direction: column;
	}
	section#product div.wrap ul li a figure figcaption p{
		display: none;
	}
	
	/* Service */
	section#service,section#business{
		padding: 0 20px;
	}
	section#service div a:hover{
		background-color: black;
	}

	/* Business */
	section#business div a:hover{
		background-color: #fff;
	}
	section#business .wrap:hover{
		filter: none;
	}
	/* Altools */
	section#altools{
		width: calc(100% - 20px);
	}
	section#altools div.wrap{
		padding: 50px 0 20px;
	}
	section#altools div.wrap h2{
		font-size: 24px;
		margin-bottom: 50px;
	}
	section#altools div.wrap ul.list {
		display: flex;
		flex-direction: column;
		gap: 20px;
		width: 100%;
		height: 100%;
		padding: 0;
		margin: 0;
	}
	section#altools .slick-initialized .slick-slide > div{
		margin-bottom: 0px;
		margin-top: 0px;
	}
	section#altools div.wrap ul.list li.m {
		margin-right: 10px;
		width: calc(50% - 20px);
		margin-left: 10px;
		margin-bottom: 40px;
	}
	section#altools div.wrap ul.list li.m:hover{
		transform: translateY(0px);
	}
	section#altools div.wrap ul.list li.m a{
		width: 100%;
	}

	/* Promotion */
	section#promotion{
		display: none;
	}

	/* Tip */
	section#tip{
		width: 100%;
		margin: 28px auto 100px;
	}
	section#tip div.wrap{
		padding: 0px;
		gap: 0px;
	}
	section#tip div.wrap h2{
		font-size: 24px;
		padding-bottom: 15px;
	}
	section#tip div.wrap ul{
		display: flex;
		flex-direction: column;
		width: 96vw;
	}
	section#tip div.wrap ul li:hover{
		transform: translateY(0px);
	}
	section#tip div.wrap ul li:nth-child(1){
		height: 360px !important;
	}
	section#tip div.wrap ul li:nth-child(n+2):nth-child(-n+5) {
		height: 220px !important;
	}
	section#tip div.wrap ul li a{
		padding: 20px 25px;
		background-size: 18% !important;
	}
	section#tip div.wrap ul li a h3{
		margin-bottom: 10px;
	}
	section#tip div.wrap ul li:nth-child(1) a{
		background-size: 40% !important;
	}
	section#tip div.wrap ul li a .h4{
		font-size: 20px;
	}
	section#tip div.wrap ul li a p{
		font-size: 15px;
	}

	/* News */
	section#news{
		height: 400px;
		padding: 100px 20px 100px 20px;
		background-position-x: 2220px;
	}
	section#news div ul{
		justify-content: flex-start;
		align-items: flex-start;
		flex-direction: column;
		height: 100%;
	}
	section#news div ul li{
		flex-basis: 100%;
		width: 100%;
	}
	section#news div ul li{
		height: 100px;
		-moz-column-gap: 24px;
		column-gap: 24px;
		/* padding: 0 24px; */
	}
	section#news div ul li:hover{
		box-shadow: none;
	}
	section#news div ul li a{
		grid-template-columns: auto auto auto 1fr;
	}

	/* Footer */
	footer div{
		padding-left: 20px !important;
	}
	footer div ul.fnb{
		display: none;
	}
	footer div ul.fnb2 {
		display: flex;
		flex-wrap: wrap;
		padding-top: 0px;
		margin-bottom: 40px;
		flex-direction: row;
	}
	footer div ul.fnb2 li {
		width: auto;
	}
	footer div ul.fnb2 li:last-child{
		display: none;
	}
	footer div ul.fnb2>li a:hover{
		background-color: initial;
	}
}
