@charset"utf-8";

.intro-wrap {position:relative; display:flex; flex-direction:column; justify-content:center; align-items:center; width:100%; min-height:100vh; padding:30px; background:url('../images/intro/bg.jpg') 50% 100% no-repeat; background-size:cover; font-family:'GmarketSans',sans-serif;}

.intro-top {width:100%; text-align:center; margin-bottom:50px;}
.intro-top .intro-logo {margin-bottom:40px;}
.intro-top .intro-logo img {height:90px;}
.intro-top .intro-maintxt {color:#242424; font-size:32px; line-height:1.33em; letter-spacing:-.03em;}
.intro-top .intro-maintxt strong {display:inline-block; background:-webkit-linear-gradient(45deg, #2ca1eb, #2f61e0); -webkit-background-clip:text; -webkit-text-fill-color:transparent;}

.intro-cont {display:grid; grid-template-columns:repeat(4, 1fr); gap:32px 26px; width:88%; max-width:1400px; margin:0 auto;}
.intro-cont .item {position:relative;}
.intro-cont .item:hover .inner-wrap:after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; border-radius:30px; border:3px solid #2e8df9; pointer-events:none;}
.intro-cont .item:hover .ct-depth {display:block;}
.intro-cont .inner-wrap {position:relative; display:block; height:280px; padding:35px 30px; background:#fff; box-shadow:0px 5px 10px 0px rgba(0, 0, 0, 0.15); border-radius:30px; transition:none;}
.intro-cont .ct-box {position:relative;}
.intro-cont .ct-tit {margin-bottom:15px; color:#242424; font-size:24px; line-height:1.33em; letter-spacing:-.03em;}
.intro-cont .ct-txt {color:#898989; font-size:18px; line-height:1.4em;}
.intro-cont .ct-ico {position:absolute; bottom:40px; right:30px; width:60px;}
.intro-cont .ct-depth {display:none; position:absolute; top:0; left:0; width:100%; height:100%;}
.intro-cont .ct-depth ul {display:grid; gap:3px;}
.intro-cont .ct-depth ul li a {display:inline-block; position:relative; padding-left:12px; color:#898989; font-size:18px; line-height:1.3em; vertical-align:middle;}
.intro-cont .ct-depth ul li a:before {content:'•'; position:absolute; top:0; left:0; color:#2e8df9;}
.intro-cont .ct-depth ul li a:hover {color:#2e8df9;}

@media(max-width:1600px){
	.intro-top {margin-bottom:40px;}
	.intro-top .intro-logo {margin-bottom:20px;}
	.intro-top .intro-logo img {height:70px;}
	.intro-top .intro-maintxt {font-size:26px;}

	.intro-cont {gap:32px 24px;}
	.intro-cont .item:hover .inner-wrap:after {border-radius:24px; border-width:2px;}
	.intro-cont .inner-wrap {height:240px; padding:27px 24px; border-radius:24px;}
	.intro-cont .ct-tit {margin-bottom:12px; font-size:20px;}
	.intro-cont .ct-txt {font-size:15px;}
	.intro-cont .ct-ico {bottom:27px; right:24px; width:50px;}
	.intro-cont .ct-depth ul {gap:0;}
	.intro-cont .ct-depth ul li a {font-size:15px;}

}

@media(max-width:1024px){
	.intro-cont {width:94%;}	
}

@media(max-width:900px){
	.intro-top .intro-maintxt {width:80%; margin:0 auto;}
	.intro-cont {grid-template-columns:repeat(3, 1fr);}
}

@media(max-width:640px){
	.intro-wrap  {padding:30px 20px;}

	.intro-top {margin-bottom:20px;}
	.intro-top .intro-logo {margin-bottom:16px;}
	.intro-top .intro-logo img {height:50px;}
	.intro-top .intro-maintxt {width:100%; font-size:19px;}

	.intro-cont {width:100%; grid-template-columns:unset; gap:16px;}
	.intro-cont .item:hover .inner-wrap:after {border-radius:16px;}
	.intro-cont .item:hover .ct-depth {display:none;}
	.intro-cont .inner-wrap {height:auto; padding:23px 25px; border-radius:16px;}
	.intro-cont .ct-tit {margin-bottom:8px; font-size:18px;}
	.intro-cont .ct-txt {font-size:13px;}
	.intro-cont .ct-ico {bottom:50%; right:25px; margin-bottom:-22px; width:44px;}


}