@charset "utf-8";
/* service__12 */
.service__12{ position:relative; width:100%;  background-repeat:no-repeat; background-position:center center; background-size: cover; z-index: 0;} 
/* .service__12::before{ content:""; width:100%; height:800px; position:absolute; top:0; left:0; background-image: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%); z-index: 0;}  */
.service__12 .halfWrap {display: flex; justify-content: space-between; align-items: top; flex-wrap: wrap;}

.service__12 .halfWrap .half {width:48%}


.service__12 .oneBox {display:flex; flex-wrap:wrap;min-height:600px; background-color:#fff; border-radius:20px; padding:70px 70px 40px;} 
.service__12 .oneBox:hover {box-shadow: 0 5px 10px #ddd;} 
.service__12 .oneBox .logo {display: block; width:100%;}
.service__12 .oneBox img {height:60px;}
.service__12 .oneBox .twoBtn {display: block; margin-left:auto;}

.service__12 .nbgall.grid2 {grid-template-columns: repeat(2, 1fr); column-gap: 30px; row-gap: 30px;}
.service__12 .nbgall.grid2 li {position:relative; background-color:#fff; padding:30px 35px; border-radius:15px;}
.service__12 .nbgall.grid2 li:hover {box-shadow: 0 5px 10px #ddd; }
.service__12 .nbgall.grid2 li:hover .icon img.moveIcon {animation-play-state: paused;}

.service__12 .nbgall.grid2 li a.dr_btn {position:absolute; bottom:3rem; opacity:0; padding:5px 15px; border-radius:20px; background-color:#f0f6ff; }


.service__12 .half .icon {text-align: right;}
.service__12 .half .icon img.moveIcon {height: 50px; animation: motion 1.2s linear 0s infinite alternate; margin-right: 0; animation-play-state: running;}
.service__12 .half .icon img.ease {animation-timing-function:ease;}
.service__12 .half .icon img.ease_in_out {animation-timing-function:ease-in-out;}


@keyframes motion {
	0% {margin-right: 0px;}
	100% {margin-right: 10px;}
}

@media (hover: hover) and (pointer: fine) {
 .service__12 .nbgall.grid2 li:hover a.dr_btn { opacity:1; }
}



@media screen and (max-width:1024px){ 
.service__12 .halfWrap .half {width:100%;}
.service__12 .halfWrap .half:first-child {margin-bottom:20px;}
.service__12 .nbgall.grid2 {column-gap: 20px; row-gap: 20px;}
}
@media screen and (max-width:768px){ 
.service__12 .oneBox { padding:50px 50px 40px; min-height: 500px;} 
.service__12 .nbgall.grid2 {grid-template-columns: repeat(1, 1fr);}
}
@media screen and (max-width:560px){ 
.service__12 .oneBox { padding:38px 25px 20px; min-height: 500px; box-shadow: 0 5px 10px #ddd;} 
.service__12 .nbgall.grid2 { column-gap: 10px; row-gap: 10px;}
.service__12 .oneBox .twoBtn a.tbbtn.radius {padding: 0px 1.5em;}
.service__12 .nbgall.grid2 li a.dr_btn {opacity:1;}

}

@media screen and (max-width:480px){ 

}