.process {display: grid;grid-template-columns: repeat(3, 1fr);gap: 10px;}
.process > li{position: relative;padding: 20px;background: linear-gradient(45deg, #1667d7 0%, #16e3e1 100%);display: flex;align-items: center;justify-content: center;}
.process > li:before {content:'';position:absolute;z-index:1;left:6px;top:6px;display:block;width:calc(100% - 12px);height:calc(100% - 12px);background:#fff;}
.process > li .box-item {position: relative;z-index: 10;}
.process > li .num {position: absolute;width: 50px;height: 50px;border-radius: 5px;background: #FFF;font-family: Pretendard;font-weight: 700;font-size: 18px;line-height: 150%;letter-spacing: 0;display: flex;align-items: center;justify-content: center;left: -20px;top: -20px;color: #009AB3;box-shadow: 0 4px 10px rgba(0, 155, 180, 0.35);z-index: 11;}
.process > li .tit {font-family: Pretendard;font-weight: 700;font-size: 20px;line-height: 120%;letter-spacing: 0;vertical-align: middle;color: #262626;text-align: center;}

.btn-process {position:relative;background-color:#ffffff;border:1px solid #00000033;font-weight:600;font-size:14px;line-height:140%;letter-spacing:0;vertical-align:middle;color:#262626;border-radius:100px;width:100%;text-align:center;height:50px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;transition: all .3s;max-width: 250px;width: 100%;box-sizing: border-box;}
.btn-process:hover {background: #009BB4;color: #fff;border:1px solid #009BB4;}



@media (max-width: 1024px) {
	.process {grid-template-columns: repeat(2, 1fr);}
}

@media (max-width: 768px) {
	.process {grid-template-columns: repeat(1, 1fr);}
	.process > li .num {left: 50%;transform: translatex(-50%);}
	.process > li:before {left: 3px;top: 3px;width: calc(100% - 6px);height: calc(100% - 6px);}
}