@charset "utf-8";

.tech-v2-wrapper {padding-bottom:200px; background:#f4f6fa;}

.tech-v2-heading {position:relative; height:980px; text-align:center; color:#fff; background:url("images/top_img.jpg") 50% 100% no-repeat; background-size:cover;}
.tech-v2-heading .inner {position:relative; display:flex; align-items:center; height:100%; padding-bottom:70px;}
.tech-v2-heading h2 {font-size:100px; font-weight:800; line-height:1.33em; letter-spacing:-.02em;}
.tech-v2-heading p {font-size:18px; line-height:1.6em; letter-spacing:-.04em;}
.tech-v2-heading .txt {font-size:36px; line-height:1.33em; letter-spacing:-.03em; margin-top:109px;}

.tech-v2-content-wrap {display:flex; position:relative; background:#fff; margin:-280px 0 290px; border-radius:48px; box-shadow:0 0 40px rgba(2,28,94,.1);}

.tech-v2-nav {width:250px; padding:60px 50px 70px 60px; border-right:1px solid #ddd;}
.tech-v2-nav ul {position:sticky; align-self:flex-start; top:150px;}
.tech-v2-nav ul li {margin-bottom:32px;}
.tech-v2-nav ul li a {display:inline-block; vertical-align:top; position:relative; font-size:20px; font-weight:700; line-height:1.33em; letter-spacing:-.03em;}
.tech-v2-nav ul li a:before {content:""; position:absolute; bottom:2px; left:-5px; width:0; height:10px; transition:.35s; background-image: linear-gradient(to right, #00cba4 , #4876ef);}
.tech-v2-nav ul li a span {position:relative;}
.tech-v2-nav ul li a:hover::before {width:calc(100% + 10px);}
.tech-v2-nav ul li.active a:before {width:calc(100% + 10px);}

.tech-v2-content {padding:60px 60px 70px 50px; flex:1 1 auto; min-width:0; width:1%;}

.tech-v2-tab {text-align:center; margin-bottom:60px; font-size:17px; line-height:1.2em; letter-spacing:-.03em;}
.tech-v2-tab ul {display:flex; margin:-5px;}
.tech-v2-tab ul li {flex:1; padding:5px;}
.tech-v2-tab ul li a {position:relative; display:flex; width:100%; height:48px; padding:0 12px; border:1px solid #ddd; border-radius:50px; flex-direction:column; justify-content:center; align-items:center; overflow:hidden;}
.tech-v2-tab ul li a:before {content:""; position:absolute; top:0; left:-10%; width:0; height:100%; background:#00cba4; transition:.35s; transform:skew(-45deg,0);}
.tech-v2-tab ul li a span {position:relative;}
.tech-v2-tab ul li a:hover {color:#fff; border-color:#00cba4;}
.tech-v2-tab ul li a:hover::before {width:120%;}
.tech-v2-tab ul li.active a {color:#fff; border-color:#00cba4;}
.tech-v2-tab ul li.active a:before {width:120%;}

.tech-v2-head {text-align:center; margin-bottom:50px;}
.tech-v2-head h3 {color:#242424; font-size:30px; line-height:1.33em; letter-spacing:-.03em;}
.tech-v2-head p {color:#454545; font-size:17px; line-height:1.647em; letter-spacing:-.03em; margin-top:7px;}
.tech-v2-head p strong {display:inline-block; margin-bottom:3px; color:#242424; font-size:1.25em; font-weight:500; line-height:1.5em;}

.tech-v2-sms {display:grid; grid-template-columns:repeat(3, 1fr); gap:20px 20px; margin-bottom:40px;}
.tech-v2-sms dl {padding:37px 40px; background:#eff5ff; border-radius:16px;}
.tech-v2-sms dt {font-size:20px; font-weight:700; line-height:1.33em; color:#4876ef; margin-bottom:12px;;}
.tech-v2-sms dt:before {content:""; display:inline-block; vertical-align:middle; margin:-.1em 10px 0 0; width:20px; height:20px; background:url("images/icon_comment.svg") 50% 50% no-repeat; background-size:contain;}
.tech-v2-sms dd {color:#454545; font-size:17px; line-height:1.647em; letter-spacing:-.03em;}

.tech-v2-cnt-box {position:relative; padding:59px 29px; margin-bottom:30px; text-align:center; border-radius:10px; border:1px solid #ddd; border-radius:16px; color:#454545; line-height:1.563em; letter-spacing:-.03em;}
.tech-v2-cnt-box:last-child {margin-bottom:0 !important;}
.tech-v2-cnt-box h4 {color:#242424; font-size:24px; line-height:1.33em; letter-spacing:-.03em;}
.tech-v2-cnt-box .title {margin-bottom:40px; margin-top:-4px;}
.tech-v2-cnt-box .title h4 {margin-bottom:6px;}
.tech-v2-cnt-box .title.between {display:flex; flex-wrap:wrap; justify-content:space-between;}
.tech-v2-cnt-box .title.between h4 {margin-bottom:0;}
.tech-v2-cnt-box .title.between p {margin-top:4px;}
.tech-v2-cnt-box .content {margin-bottom:23px;}
.tech-v2-cnt-box .content.has-mark {position:relative; padding-right:200px;}
.tech-v2-cnt-box .logo {position:absolute; bottom:3px; right:0;}
.tech-v2-cnt-box .text-blue {color:#4876ef}
.tech-v2-cnt-box .sms-ex {margin:-20px;}
.tech-v2-cnt-box .num-list > li {position:relative; padding-left:34px; margin-bottom:3px;}
.tech-v2-cnt-box .num-list > li:last-child {margin-bottom:0;}
.tech-v2-cnt-box .num-list > li strong {color:#242424; font-weight:600;}
.tech-v2-cnt-box .num-list .num {position:absolute; top:0; left:0; width:24px; height:24px; background:#4876ef; text-align:center; color:#fff; line-height:24px; border-radius:100%;}
.tech-v2-cnt-box .images {display:grid; grid-template-columns:repeat(2, 1fr); gap:20px 20px;}
.tech-v2-cnt-box .images .box {padding:35px; border:1px solid #ddd; border-radius:8px;}
.tech-v2-cnt-box .map-area {margin-bottom:20px;}
.tech-v2-cnt-box .map-area .root_daum_roughmap .wrap_map {height:380px !important;}
.tech-v2-cnt-box .video {border-radius:8px; overflow:hidden;}
.tech-v2-cnt-box .caption {padding:16px; margin-top:15px; text-align:center; line-height:1.5em; background:#f3f3f3; border-radius:8px;}
.tech-v2-cnt-box .caption p {margin:0 auto;}
.tech-v2-cnt-box .caption.type2 {background:#4876ef; color:#fff;}
.tech-v2-cnt-box  .bottom-text {margin-top:30px; text-align:center; color:#242424; font-size:17px; font-weight:500; line-height:1.6em;}
.tech-v2-cnt-box .btn-player {position:absolute; top:29px; right:29px; display:inline-flex; align-items:center; height:50px; color:#242424; font-weight:500; line-height:1.2em; padding:6px 25px; border:1px solid #ddd; border-radius:50px;}
.tech-v2-cnt-box .btn-player svg {transition:.2s; margin-left:20px;}
.tech-v2-cnt-box .btn-player:hover {color:#fff; background:#00cba4; border-color:#00cba4;}
.tech-v2-cnt-box .btn-player:hover svg path {fill:#ffffff;}
.tech-v2-cnt-box .btn-player.static {position:static; margin-top:20px; margin-bottom:10px;}
.tech-v2-cnt-box.bg {border:0; background:url("images/box_bg.jpg") 50% 50% no-repeat; background-size:cover;}
.tech-v2-cnt-box.bg .title * {color:#fff;}
.tech-v2-cnt-box.st2 {text-align:left; padding:29px;}
.tech-v2-cnt-box.st2 .title {margin-bottom:20px;}

.tech-seo {display:grid; grid-template-columns:repeat(3, 1fr); gap:25px; margin-bottom:50px;}
.tech-seo .item {position:relative; padding:30px 18px; border:1px solid #ddd; border-radius:24px; text-align:center;}
.tech-seo .item .ico {width:80px; margin:0 auto;}
.tech-seo .item dt {margin-top:1em; margin-bottom:.3em; font-size:20px; font-weight:700; line-height:1.3em; letter-spacing:-.03em;}
.tech-seo .item dd {color:#454545; line-height:1.63em; letter-spacing:-.03em;}
.tech-seo .item dd strong {font-weight:500;}
.tech-seo .item dd span {display:inline-block;}
.tech-seo .item .c1 {color:#00cba4;}
.tech-seo .item .c2 {color:#4876ef;}


/* 문의폼 */
.event-v2-heading {text-align:center; margin-bottom:60px;}
.event-v2-heading h2 {font-size:36px; line-height:1.333em; letter-spacing:-.03em;}
.event-v2-heading p {color:#454545; font-size:18px; line-height:1.44em; letter-spacing:-.03em; margin-top:10px;}
.event-v2-heading .point {color:#254699}

.event-v2-section-7 {position:relative; background:#aaaaaa; padding:155px 0 170px;}
.event-v2-section-7:before {content:""; position:absolute; top:-120px; bottom:-120px; left:0; right:0; background:#00cba4; clip-path:polygon(0 0, 23% 0, 100% 29%, 100% 100%, 77% 100%, 0 71%);}
.event-v2-section-7 .event-v2-heading {}
.event-v2-section-7 .event-v2-heading * {color:#fff;}
.event-v2-section-7 .form {max-width:1100px; margin:0 auto; background:#fff; border-radius:16px; padding:50px 90px; box-shadow:0 0 16px rgba(0,0,0,.1);}
.event-v2-section-7 .form .txt1 {text-align:center; color:#4876ef; font-size:20px; font-weight:700; line-height:1.44em; letter-spacing:-.03em;}
.event-v2-section-7 .form .txt2 {text-align:center; color:#242424; font-size:24px; font-weight:700; line-height:1.44em; letter-spacing:-.03em; margin-bottom:30px;}
.event-v2-section-7 .form .input-group {display:flex; margin-bottom:15px;}
.event-v2-section-7 .form .input {width:50%; height:50px; margin-right:10px; border:1px solid #ddd; border-radius:6px; background:#fff;}
.event-v2-section-7 .form .submit {flex:0 0 160px; width:160px; height:50px; background:#4876ef; border-radius:6px; border:0; color:#fff; font-size:18px; font-weight:600;}
.event-v2-section-7 .form .agree {color:#686868; font-size:16px; line-height:1.6em;}
.event-v2-section-7 .form .checkbox label:before {width:22px; height:22px; background:#fff url("images/checkbox_off.png") 50% 50% no-repeat; border-radius:100%; border:0;}
.event-v2-section-7 .form .checkbox input:checked + label:before {background-image:url("images/checkbox_on.png"); outline:none;}

@media (max-width: 1600px) {
	.tech-v2-heading {height:750px;}
	.tech-v2-heading h2 {font-size:85px;}
	.tech-v2-heading p {font-size:16px;}
	.tech-v2-heading .txt {font-size:30px; margin-top:60px;}

	.tech-v2-content-wrap {margin-top:-200px;}


}

@media (max-width: 1280px) {
	.tech-v2-heading h2 {font-size:80px;} 

	.tech-v2-content-wrap {border-radius:40px;}

	.tech-v2-nav {width:200px; padding:50px 40px 60px;}
	.tech-v2-nav ul li {margin-bottom:24px;}
	.tech-v2-nav ul li a {font-size:18px;}
	.tech-v2-nav ul li a:before {height:8px;}

	.tech-v2-content {padding:50px 40px 60px;}

	.tech-v2-tab {font-size:15px; margin-bottom:50px;}
	.tech-v2-tab ul li a {height:40px;}

	.tech-v2-head {margin-bottom:40px;}
	.tech-v2-head h3 {font-size:28px;}
	.tech-v2-head p {font-size:16px;}

	.tech-v2-sms dl {padding:30px;}
	.tech-v2-sms dd {font-size:15px;}

	.tech-v2-cnt-box {padding:49px 29px; font-size:15px;}
	.tech-v2-cnt-box h4 {font-size:22px;}
	.tech-v2-cnt-box .num-list > li {padding-left:30px;}
	.tech-v2-cnt-box .num-list .num {width:22px; height:22px; line-height:22px;}
	
}

@media (max-width: 1024px) {
	.tech-v2-wrapper {padding-bottom:140px;}

	.tech-v2-heading {height:580px;}
	.tech-v2-heading h2 {font-size:65px;}
	.tech-v2-heading p {font-size:15px;}
	.tech-v2-heading .txt {font-size:24px; margin-top:50px;}

	.tech-v2-content-wrap {margin:-160px 0 180px;}

	.tech-v2-tab ul {flex-wrap:wrap; justify-content:center;}
	.tech-v2-tab ul li {flex:0 0 auto; width:33.33333333%;}	

	.event-v2-heading {margin-bottom:47px;}
	.event-v2-heading h2 {font-size:30px;}
	.event-v2-heading p {font-size:16px;}

	.tech-seo {grid-template-columns:repeat(2, 1fr); gap:25px;} 
	.tech-seo .item dt {font-size:18px;}

	.event-v2-section-7 {padding:80px 0;}
	.event-v2-section-7:before {top:-80px; bottom:-80px;}
	.event-v2-section-7 .form {width:80%; padding:40px 70px;}
	.event-v2-section-7 .form .txt1 {font-size:18px; margin-bottom:2px;}
	.event-v2-section-7 .form .txt2 {font-size:20px;}
	
}


@media (max-width: 900px) {
	.tech-v2-heading {height:680px;}
	.tech-v2-heading h2 {line-height:1.15em; margin-bottom:15px;}

	.tech-v2-content-wrap {display:block;}

	.tech-v2-nav {width:auto; padding:30px 10px; border-right:0; border-bottom:1px solid #ddd;}
	.tech-v2-nav ul {position:static; display:flex; text-align:center;}
	.tech-v2-nav ul li {flex:1; margin:0;}

	.tech-v2-content {width:auto;}

	.event-v2-section-7 .form {width:90%; padding:40px;}
	.event-v2-section-7 .form .submit {width:120px; flex:0 0 120px;}
}

@media (max-width: 760px) {
	.tech-v2-wrapper {padding-bottom:80px;}

	.tech-v2-heading {height:100vh; min-height:400px;}
	.tech-v2-heading .inner {padding-bottom:20vh;}
	.tech-v2-heading h2 {font-size:50px; line-height:1em; margin-bottom:15px;}	
	.tech-v2-heading p {font-size:13px;}	
	.tech-v2-heading .txt {font-size:24px; margin-top:35px;}

	.tech-v2-content-wrap {margin:-33vh 0 100px; border-radius:20px;}

	.tech-v2-nav {padding:0; line-height:0; border-bottom:0;}
	.tech-v2-nav ul {flex-wrap:wrap;}
	.tech-v2-nav ul li {flex:0 0 auto; width:50%; padding:0; border-bottom:1px solid #ddd; border-right:1px solid #ddd;}
	.tech-v2-nav ul li:nth-child(2n) {border-right:0;}
	.tech-v2-nav ul li a {display:block; font-size:16px; line-height:45px;}
	.tech-v2-nav ul li a:before {height:5px; left:0; bottom:-1px;}
	.tech-v2-nav ul li.active a:before {width:100%;}

	.tech-v2-content {padding:20px 16px 40px;}

	.tech-v2-tab {font-size:12px; line-height:1.1em; margin-bottom:32px;}
	.tech-v2-tab ul {margin:-3px;}
	.tech-v2-tab ul li {padding:3px;}
	.tech-v2-tab ul li a {height:38px; padding:0 4px;}

	.tech-v2-head {margin-bottom:25px;}
	.tech-v2-head h3 {font-size:24px;}
	.tech-v2-head p {font-size:15px}
	.tech-v2-head p strong {font-size:16px;}

	.tech-v2-sms {grid-template-columns:unset; gap:8px 0; margin-bottom:30px;}
	.tech-v2-sms dl {padding:18px 20px; border-radius:10px;}
	.tech-v2-sms dt {font-size:18px; margin-bottom:5px;}
	.tech-v2-sms dd br {display:none;}

	.tech-v2-cnt-box {padding:29px 16px; font-size:14px; border-radius:10px; margin-bottom:20px;}
	.tech-v2-cnt-box.st2 {padding:20px 16px;}
	.tech-v2-cnt-box.bg {overflow:hidden; background-image:url("images/box_bg_m.jpg")}
	.tech-v2-cnt-box .title {margin-bottom:25px;}
	.tech-v2-cnt-box h4 {font-size:19px;}
	.tech-v2-cnt-box .sms-ex {margin:0 -10px 0 -32%;}
	.tech-v2-cnt-box .content.has-mark {padding-right:0;}
	.tech-v2-cnt-box .logo {position:static; margin-top:20px; margin-bottom:-10px;}
	.tech-v2-cnt-box .logo img {height:26px;}
	.tech-v2-cnt-box .num-list > li {padding-left:24px;}
	.tech-v2-cnt-box .num-list .num {width:18px; height:18px; line-height:18px; font-size:12px;}
	.tech-v2-cnt-box .images {grid-template-columns:unset; gap:16px 0;}
	.tech-v2-cnt-box .map-area .root_daum_roughmap .wrap_map {height:200px !important;}
	.tech-v2-cnt-box .images .box {padding:0; overflow:hidden;}
	.tech-v2-cnt-box .caption {margin-top:6px; margin-bottom:10px; padding:10px;}
	.tech-v2-cnt-box .vjs-theme-forest .vjs-big-play-button {width:60px; height:60px; background-size:contain; margin:-30px 0 0 -30px;}
	.tech-v2-cnt-box .btn-player {position:static; margin:0 0 16px; height:40px; padding:5px 18px;}
	.tech-v2-cnt-box .btn-player svg {width:16px; height:auto; margin-left:10px;}
	.tech-v2-cnt-box .bottom-text {font-size:15px;}

	.tech-seo {grid-template-columns:repeat(1, 1fr); gap:16px;} 
	.tech-seo .item {padding:25px; border-radius:16px;}
	.tech-seo .item .ico {width:70px;}
	.tech-seo .item dt {font-size:18px;}
	

	

	.event-v2-heading {margin-bottom:47px;}
	.event-v2-heading h2 {font-size:22px;}
	.event-v2-heading p {font-size:13px;}

	.event-v2-section-7 {padding:80px 0 100px;}
	.event-v2-section-7:before {top:-20px; bottom:-20px; clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 90%);}
	.event-v2-section-7 .event-v2-heading {margin-bottom:15px;}
	.event-v2-section-7 .form {width:100%; padding:30px 16px 25px;}
	.event-v2-section-7 .form .txt1 {font-size:14px;}
	.event-v2-section-7 .form .txt2 {font-size:17px; margin-bottom:20px;}
	.event-v2-section-7 .form .input-group {display:block; margin-bottom:-20px;}
	.event-v2-section-7 .form .input {display:block; width:100%; height:44px; margin-bottom:6px;}
	.event-v2-section-7 .form .submit {width:100%; height:50px; font-size:18px; margin-top:40px;}
	.event-v2-section-7 .form .agree {position:relative; top:-64px; font-size:14px;}
	.event-v2-section-7 .form .checkbox label:before {width:20px; height:20px; background-size:contain;}
	
}