@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);

@font-face {
	font-family: 'Notos Sans KR';
	font-style: normal;
	font-weight: 100;
	src: url(/fonts/NotoSansKR-DemiLight.woff2) format('woff2'),
	url(/fonts/NotoSansKR-DemiLight.woff) format('woff'),
	url(/fonts/NotoSansKR-DemiLight.otf) format('opentype');
}

@font-face {
	font-family: 'Notos Sans KR';
	font-style: normal;
	font-weight: 200;
	src: url(/fonts/NotoSansKR-Light.woff2) format('woff2'),
	url(/fonts/NotoSansKR-Light.woff) format('woff'),
	url(/fonts/NotoSansKR-Light.otf) format('opentype');
}


@font-face {
	font-family: 'Notos Sans KR';
	font-style: normal;
	font-weight: 300;
	src: url(/fonts/NotoSansKR-Regular.woff2) format('woff2'),
	url(/fonts/NotoSansKR-Regular.woff) format('woff'),
	url(/fonts/NotoSansKR-Regular.otf) format('opentype');
}


@font-face {
	font-family: 'Notos Sans KR';
	font-style: normal;
	font-weight: 400;
	src: url(/fonts/NotoSansKR-Medium.woff2) format('woff2'),
	url(/fonts/NotoSansKR-Medium.woff) format('woff'),
	url(/fonts/NotoSansKR-Medium.otf) format('opentype');
}

@font-face {
	font-family: 'Notos Sans KR';
	font-style: normal;
	font-weight: 500;
	src: url(/fonts/NotoSansKR-Bold.woff2) format('woff2'),
	url(/fonts/NotoSansKR-Bold.woff) format('woff'),
	url(/fonts/NotoSansKR-Bold.otf) format('opentype');
}

@font-face {
	font-family: 'Notos Sans KR';
	font-style: normal;
	font-weight: 600;
	src: url(/fonts/NotoSansKR-Black.woff2) format('woff2'),
	url(/fonts/NotoSansKR-Black.woff) format('woff'),
	url(/fonts/NotoSansKR-Black.otf) format('opentype');
}

@font-face {
    font-family: 'GongGothicMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.cb {clear:both;}
.por {position:relative}
.poa {position:absolute;}
.dib {display:inline-block;}
.pd10 {padding:10px;}
.c_white {color:#fff;}

input::-webkit-input-placeholder {
  color: #999;
}
input:-ms-input-placeholder {
  color: #999;
}
textarea::-webkit-input-placeholder {
  color: #999;
}
textarea:-ms-input-placeholder {
  color: #999;
}

#robo {width:100%;min-width:1600px;}
.header {height:110px; position:fixed;width:100%;min-width:1600px;z-index:2;}
.header .logo {float:left; width:20%;}
.header .menu {float:left; text-align:center; width:66%;}
.header .nav {float:right; text-align:right;width:20%}

.main {position:relative; width:1500px; margin:0 auto; }
.main_text {position:relative; float:left; width:500px; padding-top:280px;}
.main_text .main_text1 {margin-bottom:30px; transform: translateY(-50px); opacity:0;}
.main_text .main_text2 {margin-bottom:30px; transform: translateY(-50px); opacity:0;}
.main_text .main_text3 {transform: translateX(-50px); opacity:0;}

.main_text.on .main_text1 {margin-bottom:30px; transform: translateY(0); transition: all ease 1s 0s; opacity:1; transition-delay: 0.3s;}
.main_text.on .main_text2 {margin-bottom:30px; transform: translateY(0);transition: all ease 1s 0s; opacity:1;transition-delay: 0.6s;}
.main_text.on .main_text3 {transform: translateX(0);transition: all ease 1s 0s; opacity:1;transition-delay: 0.9s;}

.main_bot_space {text-align:center;background:linear-gradient(90deg, #42c393, #3d7ec6, #373bbb); color:#fff;padding:20px;font-size:2.2em;vertical-align:middle;}

.main_tit_txt { font-family: 'GongGothicMedium';font-size:4.2em;letter-spacing:4px;margin-bottom:30px; }
.main_tit_txt2 { font-size:1.6em;line-height:200%;clear:both; }

#about_me_btn {bottom:0px; left:49%; width:120px; height:30px;}

.business {position:relative; width:1300px; margin:0 auto; padding:180px 0 ;}
.business .business_title {text-align:center; margin-bottom:80px;}
.business .item1_pic {position:relative; width:630px; float:left; margin-bottom:80px; margin-bottom:180px; border-radius:20px 20px 20px 20px; border:1px solid #e2e2e2; padding:60px 0 50px 0;}
.business .item1_pic .item1_title {text-align:center; margin-bottom:60px;}
.business .item1_pic .item1_btn {text-align:center;}
.business .item1_pic .pic1 {text-align:center; margin-bottom:50px;}

.business .item1_pic .pic_inner1 {position:absolute; width:522px; height:522px; left:57px; top:145px;}
.business .item1_pic .pic_inner1 .pic1_icon_1 {position:absolute; left:80px; top:120px;}
.business .item1_pic .pic_inner1 .pic1_icon_2 {position:absolute; left:300px; top:70px;}
.business .item1_pic .pic_inner1 .pic1_icon_3 {position:absolute; left:414px; top:250px;}
.business .item1_pic .pic_inner1 .pic1_icon_4 {position:absolute; left:138px; top:381px;}

.business .item1_pic .pic_inner2 {position:absolute; width:522px; height:522px; left:57px; top:146px;}
.business .item1_pic .pic_inner2 .pic1_icon_5 {position:absolute; left:80px; top:25px;}
.business .item1_pic .pic_inner2 .pic1_icon_6 {position:absolute; left:230px; top:-26px;}
.business .item1_pic .pic_inner2 .pic1_icon_7 {position:absolute; left:454px; top:100px;}
.business .item1_pic .pic_inner2 .pic1_icon_8 {position:absolute; left:490px; top:323px;}
.business .item1_pic .pic_inner2 .pic1_icon_9 {position:absolute; left:400px; top:442px;}
.business .item1_pic .pic_inner2 .pic1_icon_10 {position:absolute; left:30px; top:394px;}

.business .item1_pic.on {position:relative; width:630px; float:left; margin-bottom:80px; margin-bottom:180px; }
.business .item1_pic.on .pic_inner1 {position:absolute; width:522px; height:522px;  left:57px; top:145px; animation: forwardRotate1 40s linear infinite;}

.business .item1_pic.on .pic_inner1 .pic1_icon_1 {position:absolute; left:80px; top:120px; animation: reverseRotate1 40s linear infinite;}
.business .item1_pic.on .pic_inner1 .pic1_icon_2 {position:absolute; left:300px; top:70px; animation: reverseRotate1 40s linear infinite;}
.business .item1_pic.on .pic_inner1 .pic1_icon_3 {position:absolute; left:414px; top:250px; animation: reverseRotate1 40s linear infinite;}
.business .item1_pic.on .pic_inner1 .pic1_icon_4 {position:absolute; left:138px; top:381px; animation: reverseRotate1 40s linear infinite;}


.business .item1_pic.on .pic_inner2 {position:absolute; width:522px; height:522px;  left:57px; top:146px; animation: forwardRotate2 40s linear infinite;}
.business .item1_pic.on .pic_inner2 .pic1_icon_5 {position:absolute; left:80px; top:25px; animation: reverseRotate2 40s linear infinite;}
.business .item1_pic.on .pic_inner2 .pic1_icon_6 {position:absolute; left:230px; top:-26px; animation: reverseRotate2 40s linear infinite;}
.business .item1_pic.on .pic_inner2 .pic1_icon_7 {position:absolute; left:454px; top:100px; animation: reverseRotate2 40s linear infinite;}
.business .item1_pic.on .pic_inner2 .pic1_icon_8 {position:absolute; left:490px; top:323px; animation: reverseRotate2 40s linear infinite;}
.business .item1_pic.on .pic_inner2 .pic1_icon_9 {position:absolute; left:400px; top:442px; animation: reverseRotate2 40s linear infinite;}
.business .item1_pic.on .pic_inner2 .pic1_icon_10 {position:absolute; left:30px; top:394px; animation: reverseRotate2 40s linear infinite;}

@keyframes forwardRotate1 {
  from { transform: rotate(0deg), translate(-50% -50%); }
  to { transform: rotate(360deg); }
}

@keyframes reverseRotate1 {
  from { transform: rotate(-0deg); }
  to { transform: rotate(-360deg); }
}


@keyframes forwardRotate2 {
  from { transform: rotate(0deg), translate(-50% -50%); }
  to { transform: rotate(-360deg); }
}

@keyframes reverseRotate2 {
  from { transform: rotate(-0deg); }
  to { transform: rotate(360deg); }
}

.business .item2_pic .item2_title {text-align:center; margin-bottom:60px;}
.business .item2_pic .item2_btn {text-align:center;}

.business .item2_pic {position:relative; width:630px; float:right; margin-bottom:80px; margin-bottom:180px; border-radius:20px 20px 20px 20px; border:1px solid #e2e2e2; padding:60px 0 50px 0;}
.business .item2_pic .pic_inner2 {height:522px;margin-bottom:50px;}
.business .item2_pic .pic_inner2 .pic2_icon_1 {position:absolute; left:73px; top:165px;}
.business .item2_pic .pic_inner2 .pic2_icon_2 {position:absolute; left:148px; top:233px;}
.business .item2_pic .pic_inner2 .pic2_icon_3 {position:absolute; left:40px; top:120px;}

.business .item2_pic.on .pic_inner2 .pic2_icon_1 {position:absolute; left:73px; top:165px;  animation: forwardRotate2 25s linear infinite;}
.business .item2_pic.on .pic_inner2 .pic2_icon_2 {position:absolute; left:148px; top:233px;  animation: forwardRotate1 25s linear infinite;}
.business .item2_pic.on .pic_inner2 .pic2_icon_3 {position:absolute; left:40px; top:120px;}

.service {position:relative; width:1300px; margin:0 auto; padding:180px 0;}
.service_title {text-align:center;  margin-bottom:60px;}
.service_nav {position:relative; height:310px; cursor:pointer;}
.service_nav .item1 {position:absolute; left:0; top:0;  transition: all ease 0.5s 0s;}
.service_nav .item1.on {top:-20px; transition: all ease 1s 0s; opacity:1;}
.service_nav .item2 {position:absolute; left:329px; top:0; transition: all ease 0.5s 0s;}
.service_nav .item2.on {top:-20px; transition: all ease 1s 0s; opacity:1;}
.service_nav .item3 {position:absolute; left:658px; top:0; transition: all ease 0.5s 0s;}
.service_nav .item3.on {top:-20px; transition: all ease 1s 0s; opacity:1;}
.service_nav .item4 {position:absolute; left:987px; top:0; transition: all ease 0.5s 0s;}
.service_nav .item4.on {top:-20px; transition: all ease 1s 0s; opacity:1;}

.about {clear:both;position:relative; width:1300px; margin:0 auto; }
.about_title {margin-bottom:80px;position:relative;}
.about .number {}
.about .number ul {padding:10px;overflow:hidden;}
.about .number ul li {float:left; margin-right:35px; width:400px; padding:60px 0; list-style: none; text-align:center; border-radius:20px; box-shadow:1px 1px 3px 3px rgba(0,0,0,0.05);}
.about .number ul li:last-child {margin:0;}
.count-num {font-size:80px; font-weight:bold; color:#3a3caf;}
.count-name {font-size:18px; letter-spacing:-1px; }
.count-name span {color:#b2b2b2}
.about .number ul li .small {color:#b2b2b2;padding-top:6px;}

.sol {clear:both;position:relative; width:100%; margin:0 auto; }
.sol_title {margin-bottom:60px; text-align:center;}
.sol_item { background:url('../images/sol_item.jpg') no-repeat center center; height:602px;}

.news {position:relative; width:1300px;  margin:0 auto; padding:180px 0 70px 0 ;}
.news_title {margin-bottom:60px; text-align:center;}
.news_more {border:1px solid #dddddd;padding:10px 50px;border-radius:100px;}
.news_list {position:relative; width:1300px;  margin:0 auto; padding:60px 0;}
.news_list li {width:32%;float:left;margin-right:2%;}
.news_list li:nth-child(3n) {margin-right:0;}
.news_cate {color:#3a3caf;font-size:1vw;padding-bottom:20px;}
.news_txt {font-size:1.1vw;line-height:180%;height:350px;word-break:keep-all;}
.news_date {font-size:0.9vw;color:#b7b7b7;display:inline-block;}
.news_link {font-size:0.9vw;color:#b7b7b7;float:right;}
.news_img {margin-top:20px;}
.news_img img {width:100%;}

.news_mb {display:inline-block;color:#222; font-weight:bold;font-size:1.05em;letter-spacing:-1.5px;}

.recu {position:relative; width:100%;height:944px;  background:url('../images/recu_bg.jpg') no-repeat center center; }
.recu_title {text-align:center;width:100%;padding:65px 0 45px 0;}
.recu_title div {padding:10px;}
.recu_left {width:95%;}
.recu_right {width:95%; float:right;}
.recu_input {max-width:1300px; margin:0 auto; width:100%;}
.recu_input li {width:50%; float:left;}
.recu_input input , #quick_form input {color:#fff;}
.recu_tit {width:114px;}
input.main_recu {width:100%; background:transparent; border:0px;font-size:1.4em;}
input.main_recu2 {width:calc(100% - 20px);float:right; background:transparent; border:0px;font-size:1.4em;}

.recu_line {margin-top:15px;border-top:1px solid #b3b3b3; height:21px;}

.recu_cate {color:#c8c8c8;font-size:1.4em;padding-left:20px;}
.recu_cate div {display:inline-block;margin:10px 20px 0 0;}
.recu_cate div label , #agree_wrap label {cursor:pointer; display:inline-block;}

#agree_wrap {padding:40px 0; color:#fff;font-size:1.5em;text-align:center;}
#agree_wrap span {color:#aaa}
/*
.recu_cate div input[type="checkbox"] ,  #agree_wrap input[type="checkbox"] {
	-webkit-appearance: none;
	position: relative;
	width: 16px;
	height: 16px;
	cursor: pointer;
	outline: none !important;
	border: 1px solid #eeeeee;
	border-radius: 2px;
	background: #transparent;
}

.recu_cate div input[type="checkbox"]::before ,  #agree_wrap input[type="checkbox"]::before {
	content: "\2713";
	position: absolute;
	top: 50%;
	left: 50%;
	overflow: hidden;
	transform: scale(0) translate(-50%, -50%);
	line-height: 1;
}

.recu_cate div input[type="checkbox"]:hover ,  #agree_wrap input[type="checkbox"]:hover  {
	border-color: rgba(170, 170, 170, 0.5);
}

.recu_cate div input[type="checkbox"]:checked ,  #agree_wrap input[type="checkbox"]:checked  {
	background-color: #ff8955;
	border-color: rgba(255, 255, 255, 0.3);
	color: white;
}

.recu_cate div input[type="checkbox"]:checked::before ,  #agree_wrap input[type="checkbox"]:checked::before {
	border-radius: 2px;
	transform: scale(1) translate(-50%, -50%)
}
*/

.recu input::-webkit-input-placeholder {
  color: #c8c8c8;
}
.recu input:-ms-input-placeholder {
  color: #c8c8c8;
}
.recu textarea::-webkit-input-placeholder {
  color: #c8c8c8;
}
.recu textarea:-ms-input-placeholder {
  color: #c8c8c8;
}

#recu_submit input[type="submit"] {
	position:relative; font-size:1.8em; font-weight:normal;width:100%; height:60px; background:linear-gradient(90deg, #42c393, #3d7ec6, #373bbb); color:#fff; border:0px;box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
}


#recu_cont {width:100%;padding:30px;font-size:1.6em;}

.recu_text {text-align:center; padding:100px 0;}

.partner {position:relative; width:100%; border-top:1px solid #ededed;clear:both;}
.partner_in {position:relative; width:1500px; text-align:center; margin:0 auto; padding:36px 0 28px 0;} 

.client {position:relative; width:100%; border-top:1px solid #ededed;}
.client_in {position:relative; width:1500px; text-align:center; margin:0 auto; padding:30px 0;} 

.copy {position:relative; width:1300px; margin:0 auto; padding:90px 0;}

.main_detail {position:relative; float:right; width:1000px;}
.main_detail .detail_circle {position:absolute; left:170px; top:140px; opacity:0;}

.main_detail .detail_1 {position:absolute; left:30px; top:500px; opacity:0; transform: translateY(-50px)}
.main_detail .detail_1 .detail_1_1 {position:absolute; left:20px; top:-30px; z-index:3; filter: grayscale(90%); transition: all ease 0.5s 0s;}
.main_detail .detail_1 .detail_1_2 {position:absolute; left:80px; top:-70px; z-index:2; filter: grayscale(90%); transition: all ease 0.5s 0s;}
.main_detail .detail_1 .detail_1_text {position:absolute; left:-60px; top:50px; z-index:5; filter: grayscale(90%); transition: all ease 0.5s 0s;}
.main_detail .detail_1 .stage {position:absolute; left:0; top:0; z-index:1; filter: grayscale(90%); transition: all ease 0.5s 0s;}

.main_detail .detail_2 {position:absolute; left:300px; top:90px;  opacity:0; transform: translateY(-50px) }
.main_detail .detail_2 .detail_2_1 {position:absolute; left:64px; top:-62px; z-index:2; filter: grayscale(90%); transition: all ease 0.5s 0s;}
.main_detail .detail_2 .detail_2_2 {position:absolute; left:68px; top:-123px; z-index:3; filter: grayscale(90%); transition: all ease 0.5s 0s;}
.main_detail .detail_2 .detail_2_3 {position:absolute; left:211px; top:-35px; z-index:4; filter: grayscale(90%); transition: all ease 0.5s 0s;}
.main_detail .detail_2 .detail_2_text {position:absolute; left:270px; top:45px; z-index:5; filter: grayscale(90%); transition: all ease 0.5s 0s;}
.main_detail .detail_2 .stage {position:absolute; left:0; top:0; z-index:1; filter: grayscale(90%); transition: all ease 0.5s 0s;}

.main_detail .detail_3 {position:absolute; left:620px; top:500px; opacity:0; transform: translateY(-50px)}
.main_detail .detail_3 .detail_3_1 {position:absolute; left:36px; top:37px; z-index:4; filter: grayscale(90%); transition: all ease 0.5s 0s;}
.main_detail .detail_3 .detail_3_2 {position:absolute; left:83px; top:3px; z-index:3; filter: grayscale(90%); transition: all ease 0.5s 0s;}
.main_detail .detail_3 .detail_3_3 {position:absolute; left:106px; top:-71px; z-index:2; filter: grayscale(90%); transition: all ease 0.5s 0s; }
.main_detail .detail_3 .detail_3_4 {position:absolute; left:8px; top:90px; z-index:2; transition: all ease 0.5s 0s; z-index:4; opacity:0;}
.main_detail .detail_3 .detail_3_5 {position:absolute; left:7px; top:63px; z-index:2; transition: all ease 0.5s 0s; z-index:5; opacity:0;}
.main_detail .detail_3 .detail_3_6 {position:absolute; left:22px; top:60px; z-index:2; transition: all ease 0.5s 0s; z-index:6; opacity:0;}
.main_detail .detail_3 .detail_3_7 {position:absolute; left:0; top:100px; z-index:2; transition: all ease 0.5s 0s;z-index:7; opacity:0;}
.main_detail .detail_3 .detail_3_text {position:absolute; left:260px; top:50px; z-index:10; filter: grayscale(90%); transition: all ease 0.5s 0s;}
.main_detail .detail_3 .stage {position:absolute; left:0; top:0; z-index:1; filter: grayscale(90%); transition: all ease 0.5s 0s;}

.main_detail .detail_4 {position:absolute; left:310px; top:320px; opacity:0; transform: scale(0.5);}
.main_detail .detail_4 .detail_4_1 {position:absolute; left:0px; top:0px; z-index:4;}

.main_detail {position:relative; float:right; width:1000px;}
.main_detail .detail_circle {opacity:0; z-index:0; }

@keyframes rotate_image{
    100% {
        transform: rotate(360deg);
    }
}

.main_detail.on .detail_1 {position:absolute; left:30px; top:500px; opacity:1; transition: all ease 0.5s 0s; transition-delay: 2s;  transform: translateY(0); z-index:10;}
.main_detail.on .detail_1 .detail_1_1 {position:absolute; left:20px; top:-30px; z-index:3; }
.main_detail.on .detail_1 .detail_1_2 {position:absolute; left:80px; top:-70px; z-index:2;}
.main_detail.on .detail_1 .detail_1_text {position:absolute; left:-60px; top:50px; z-index:5;}
.main_detail.on .detail_1 .stage {position:absolute; left:0; top:0; z-index:1;}

.main_detail.on .detail_1.on {position:absolute; left:30px; top:500px; opacity:1; transition: all ease 0.5s 0s; transition-delay: 2s;  transform: translateY(0); z-index:10;}
.main_detail.on .detail_1.on .detail_1_1 {position:absolute; animation: pan 1.5s linear infinite; left:20px; top:-30px; z-index:3; filter: grayscale(0); transition: all ease 0.5s 0s;}
.main_detail.on .detail_1.on .detail_1_2 {position:absolute; left:80px; top:-70px; z-index:2; filter: grayscale(0); transition: all ease 0.5s 0s;}
.main_detail.on .detail_1.on .detail_1_text {position:absolute; left:-60px; top:50px; z-index:5; filter: grayscale(0); transition: all ease 0.5s 0s;}
.main_detail.on .detail_1.on .stage {position:absolute; left:0; top:0; z-index:1; filter: grayscale(0); transition: all ease 0.5s 0s;}

@-webkit-keyframes pan {
   0%       { -webkit-transform: translateY(0); }
   50%     { -webkit-transform: translatey(-10px); }
   100% {-webkit-transform: translatey(0);}
}

.main_detail.on .detail_2 {position:absolute; left:300px; top:90px;  opacity:1; transition: all ease 0.5s 0s; transition-delay: 2.3s;  transform: translateY(0); z-index:10;}
.main_detail.on .detail_2 .detail_2_1 {position:absolute;  left:64px; top:-62px; z-index:2;}
.main_detail.on .detail_2 .detail_2_2 {position:absolute; left:68px; top:-123px; z-index:3;}
.main_detail.on .detail_2 .detail_2_3 {position:absolute; left:211px; top:-35px; z-index:4;}
.main_detail.on .detail_2 .detail_2_text {position:absolute; left:270px; top:45px; z-index:5;}
.main_detail.on .detail_2 .stage {position:absolute; left:0; top:0; z-index:1;}

.main_detail.on .detail_2.on {position:absolute; left:300px; top:90px;  opacity:1; transition: all ease 0.5s 0s; transition-delay: 2.3s;  transform: translateY(0); z-index:10;}
.main_detail.on .detail_2.on .detail_2_1 {position:absolute; left:64px; top:-62px; z-index:2; filter: grayscale(0); transition: all ease 0.5s 0s;}
.main_detail.on .detail_2.on .detail_2_2 {position:absolute; animation: pan 1.5s linear infinite; left:68px; top:-123px; z-index:3; filter: grayscale(0); transition: all ease 0.5s 0s;}
.main_detail.on .detail_2.on .detail_2_3 {position:absolute; left:211px; top:-35px; z-index:4; filter: grayscale(0); transition: all ease 0.5s 0s;}
.main_detail.on .detail_2.on .detail_2_text {position:absolute; left:270px; top:45px; z-index:5; filter: grayscale(0); transition: all ease 0.5s 0s;}
.main_detail.on .detail_2.on .stage {position:absolute; left:0; top:0; z-index:1; filter: grayscale(0); transition: all ease 0.5s 0s;}

.main_detail.on .detail_3 {position:absolute; left:620px; top:500px; opacity:1; transition: all ease 0.5s 0s; transition-delay: 2.6s; transform: translateY(0); z-index:10;}
.main_detail.on .detail_3 .detail_3_1 {position:absolute; left:36px; top:37px; z-index:4;}
.main_detail.on .detail_3 .detail_3_2 {position:absolute; left:83px; top:3px; z-index:3;}
.main_detail.on .detail_3 .detail_3_3 {position:absolute; left:106px; top:-71px; z-index:2;}
.main_detail.on .detail_3 .detail_3_text {position:absolute; left:260px; top:50px; z-index:10;}
.main_detail.on .detail_3 .stage {position:absolute; left:0; top:0; z-index:1;}

.main_detail.on .detail_3.on {position:absolute; left:620px; top:500px; opacity:1; transition: all ease 0.5s 0s; transition-delay: 2.6s; transform: translateY(0); z-index:10;}
.main_detail.on .detail_3.on .detail_3_1 {position:absolute; animation: pan 1.5s linear infinite; left:36px; top:37px; z-index:4; filter: grayscale(0); transition: all ease 0.5s 0s;}
.main_detail.on .detail_3.on .detail_3_2 {position:absolute; animation: pan 1.5s linear infinite; left:83px; top:3px; z-index:3; filter: grayscale(0); transition: all ease 0.5s 0s;}
.main_detail.on .detail_3.on .detail_3_3 {position:absolute; left:106px; top:-71px; z-index:2; filter: grayscale(0); transition: all ease 0.5s 0s;}
.main_detail.on .detail_3.on .detail_3_4 {position:absolute; left:8px; top:90px; z-index:2;  z-index:4; opacity:1;}
.main_detail.on .detail_3.on .detail_3_5 {position:absolute; left:7px; top:63px; z-index:2;  z-index:5; opacity:1; animation: file 3s linear infinite;}
.main_detail.on .detail_3.on .detail_3_6 {position:absolute; left:22px; top:60px; z-index:2;  z-index:6; opacity:1; animation: file 3.6s linear infinite;}
.main_detail.on .detail_3.on .detail_3_7 {position:absolute; left:0; top:100px; z-index:2; z-index:7; opacity:1;}
.main_detail.on .detail_3.on .detail_3_text {position:absolute; left:260px; top:50px; z-index:10; filter: grayscale(0); transition: all ease 0.5s 0s;}
.main_detail.on .detail_3.on .stage {position:absolute; left:0; top:0; z-index:1; filter: grayscale(0); transition: all ease 0.5s 0s;}

@-webkit-keyframes file {
   0       { -webkit-transform: translateX(0); }
   40%       { -webkit-transform: translateX(0); }
   80%     { -webkit-transform: translatex(-300px); }
   100% { -webkit-transform: translatex(-300px); opacity:0;}
}

.main_detail.on .detail_4 {position:absolute; left:310px; top:320px; opacity:1; transition: all ease 0.5s 0s; transform: scale(1); transition-delay: 1.5s;}
.main_detail.on .detail_4 .detail_4_1 {position:absolute; left:0px; top:0px; z-index:4;}

.main_detail.on {position:relative; float:right; width:1000px; z-index:0;}
.main_detail.on .detail_circle {animation: rotate_image 9s linear infinite;transform-origin: 50% 50%; opacity:1; transition: all ease 0.5s 0s;   transition-delay: 3s;}


/* tail */
.tail_logo { font-family: 'GongGothicMedium';font-size:2.2em;letter-spacing:-1px;margin-bottom:50px; }
.tail_txt_link { font-size:1.5em;line-height:200%;clear:both; font-weight:normal;}
.tail_txt_link li {display:inline-block;}
.foot_link_guide {padding:0 20px ;font-size:0.8em;color:#ccc;margin-bottom:30px;}
.tail_copy {font-size:1.3em;color:#787878;line-height:200%;display:inline-block;}
.tail_icon_link {float:right}
.tail_icon_link div {display:inline-block;}

/* ¸ÞÀθ޴º */
#gnb {position:relative;background:transparent;margin-top:35px;}
#gnb > h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#gnb .gnb_wrap {margin:0 auto;position:relative;  width:100%;} 
#gnb .gnb_wrap:hover, #gnb .gnb_wrap:focus, #gnb .gnb_wrap:active{z-index:3}
#gnb #gnb_1dul {font-size:1.3rem;padding:0;border-bottom:0px;zoom:1;}
#gnb ul:after {display:block;visibility:hidden;clear:both;content:""}
#gnb .gnb_1dli {float:none;display:inline-block;line-height:45px;padding:0px;position:relative}
#gnb .gnb_1dli:hover > a {color:#3a8afd;
-webkit-transition:background-color 2s ease-out;
-moz-transition:background-color 0.3s ease-out;
-o-transition:background-color 0.3s ease-out;
transition:background-color 0.3s ease-out}

#gnb #gnb_1dul li:last-child .gnb_1da { color:#fff;background:#373dbb; border-radius:100px; padding:0px 30px;}

.gnb_1dli .bg {position:absolute;top:24px;right:8px;display:inline-block;width:10px;height:10px;overflow:hidden;background:url('../img/gnb_bg2.gif') no-repeat 50% 50%;text-indent:-999px}
.gnb_1da {display:block;font-weight:normal;padding:0 15px;color:#fff;text-decoration:none}
.gnb_1dli.gnb_al_li_plus .gnb_1da{padding-right:2.8vw}
.gnb_2dli:first-child {border:0}
.gnb_2dul {display:none;position:absolute;top:44px;min-width:140px;padding-top:2px}
.gnb_2dul .gnb_2dul_box {border:1px solid #e0e2e5;border-top:0;padding:0;
-webkit-box-shadow:0px 1px 5px rgba(97, 97, 97, 0.2);
-moz-box-shadow:0px 1px 5px rgba(97, 97, 97, 0.2);
box-shadow:0px 1px 5px rgba(97, 97, 97, 0.2)}
.gnb_2da {display:block;padding:0 10px;line-height:40px;background:#fff;color:#080808;text-align:left;text-decoration:none; font-size:0.8rem;}
a.gnb_2da:hover {color:#3a8afd;background:#f7f7f8;
-moz-transition:all 0.3s ease-out;
-o-transition:all 0.3s ease-out;
transition:all 0.3s ease-out}

.gnb_1dli_air .gnb_2da {}
.gnb_1dli_on .gnb_2da {}
.gnb_2da:focus, .gnb_2da:hover {color:#fff}
.gnb_1dli_over .gnb_2dul {display:block;left:0}
.gnb_1dli_over2 .gnb_2dul {display:block;right:0}
.gnb_wrap .gnb_empty {padding:10px 0;width:100%;text-align:center;line-height:2.7em;color:#080808}
.gnb_wrap .gnb_empty a {color:#3a8afd;text-decoration:underline}
.gnb_wrap .gnb_al_ul .gnb_empty, .gnb_wrap .gnb_al_ul .gnb_empty a {color:#555}

#gnb .gnb_menu_btn {background:#4158d1;color:#fff;width:50px;height:55px;border:0;vertical-align:top;font-size:18px}
#gnb .gnb_close_btn {background:#fff;color:#b6b9bb;width:50px;height:50px;border:0;vertical-align:top;font-size:18px;position:absolute;top:0;right:0}
#gnb .gnb_mnal {float:none;padding:0}

#gnb_all {display:none;position:absolute;margin-top:100px;border:1px solid #c5d6da;width:100%;background:#fff;z-index:1001;-webkit-box-shadow:0 2px 5px rgba(0,0,0,0.2);
-moz-box-shadow:0 2px 5px rgba(0,0,0,0.2);
box-shadow:0 2px 5px rgba(0,0,0,0.2)}
#gnb_all h2 {font-size:1.3em;padding:15px 20px;border-bottom:1px solid #e7eeef}
#gnb_all .gnb_al_ul:after {display:block;visibility:hidden;clear:both;content:""}
#gnb_all .gnb_al_ul > li:nth-child(7n+1) {border-left:0}
#gnb_all .gnb_al_li {float:left;width:14%;min-height:150px;padding:20px 10px;border-left:1px solid #e7eeef}
#gnb_all .gnb_al_li .gnb_al_a {font-size:1.2em;display:block;position:relative;margin-bottom:10px;font-weight:bold;color:#3a8afd}
#gnb_all .gnb_al_li li {/*line-height:2.4em;*/ line-height:1.5em;padding-bottom:10px; font-size:1.28em;}
#gnb_all .gnb_al_li li a {color:#555; }
#gnb_all_bg {display:none;background:rgba(0,0,0,0.1);width:100%;height:100%;position:fixed;left:0;top:0;z-index:999}



.top_icon_link {position:absolute;top:40px;right:10px;}
.top_icon_link div {display:inline-block;padding:0 3px;}
.gnb_menu_btn {margin-left:20px; cursor:pointer;}

.recu_quick {position:fixed; right:-396px; top:240px; z-index:999; transition: all ease 0.5s 0s; background:#161841; width:466px;}
.recu_quick.on {right:0;transition: all ease 0.5s 0s;}
.recu_quick li {float:left;}
#recu_quick_btn {cursor:pointer;}
.q_open {background:url('../images/quick_btn_on.png');width:70px;height:477px;}
.q_close {background:url('../images/quick_btn_off.png');width:70px;height:477px;}

#recu_quick_form {width:calc(100% - 70px);}
#quick_form {padding:45px 40px;; width:100%;font-size:0.8em;}
.q_recu_cate {color:#c8c8c8;font-size:1.4em;padding-left:4px;}
.q_recu_cate div {display:inline-block;margin:10px 7px 0 0;}
.q_recu_cate div label , #quick_form label {cursor:pointer;display:inline-block;}

.q_recu_cate div input[type="checkbox"] ,  #quick_form input[type="checkbox"] {
	-webkit-appearance: none;
	position: relative;
	width: 12px;
	height: 12px;
	cursor: pointer;
	outline: none !important;
	border: 1px solid #eeeeee;
	border-radius: 2px;
	background: #transparent;
}

.q_recu_cate div input[type="checkbox"]::before ,  #quick_form input[type="checkbox"]::before {
	content: "\2713";
	position: absolute;
	top: 50%;
	left: 50%;
	overflow: hidden;
	transform: scale(0) translate(-50%, -50%);
	line-height: 1;
}

.q_recu_cate div input[type="checkbox"]:hover ,  #quick_form input[type="checkbox"]:hover  {
	border-color: rgba(170, 170, 170, 0.5);
}

.q_recu_cate div input[type="checkbox"]:checked ,  #quick_form input[type="checkbox"]:checked  {
	background-color: #ff8955;
	border-color: rgba(255, 255, 255, 0.3);
	color: white;
}

.q_recu_cate div input[type="checkbox"]:checked::before ,  #quick_form input[type="checkbox"]:checked::before {
	border-radius: 2px;
	transform: scale(1) translate(-50%, -50%)
}
.q_recu_cate label { letter-spacing:-0.5px;}
#q_agree_wrap {padding:10px 0 20px 4px;  color:#fff;font-size:1.2em;text-align:left;}
#q_agree_wrap span {color:#aaa}

#q_recu_submit input[type="submit"] {
	position:relative; font-size:2em; font-weight:normal;width:100%; height:60px; background:linear-gradient(90deg, #42c393, #3d7ec6, #373bbb); color:#fff; border:0px;box-shadow: 0px 0px 5px rgba(0,0,0,0.5);border-radius:100px;
}

.hide {display:none;}
.content { position:relative; }

.main_content {background:url('../images/main_bg.jpg') no-repeat center center; width:100%; height:930px;  padding-top:110px;}
.sub_content { width:100%; height:400px;   }

.sub_title { position:absolute;top:150px;color:#fff; font-size:3vw; text-transform: uppercase; left:50%; transform: translate(-50%, 0%); }
.sub_title_info { position:absolute;top:240px;color:#fff; font-size:1.2vw;text-align:center; text-transform: capitalize ; left:50%; transform: translate(-50%, 0%);}

#submenu {background:#f9f9f9; text-align:center;}
#submenu div {display:inline-block;padding: 20px 70px;font-size:1.6em;}

.sub_cont_title {font-size:50px; font-family: 'Notos Sans KR', sans-serif;padding:120px 0 ;font-weight:500;text-align:center;letter-spacing:-1px;}
.sub_cont {width:1300px; margin:0 auto;word-break:keep-all;position:relative;}
.sub_cont_end {clear:both;height:150px;}

.sub_cont_100 {width:100%;}
.cen {text-align:center;}
.cb {clear:both}
.fl {float:left;}
.fr {float:right;}
.h100 {height:100px;}
.h150 {height:150px;}
.h80 {height:80px;}
.h50 {height:50px;}
.h60 {height:60px;}
.h30 {height:30px;}
.h20 {height:20px;}
.bg_f3f7fd {background:#f3f7fd;}

.abount_tit_1 {font-size:43px;font-weight:500;letter-spacing:-1px;}
.abount_tit_2 {font-size:43px;font-weight:300;letter-spacing:-1px;}
.abount_cont {font-size:20px;padding:50px 0;}

.marketing_tit_1 {font-size:43px;font-weight:500;letter-spacing:-1px;text-align:center;}
.marketing_tit_2 {font-size:26px;font-weight:300;letter-spacing:-1px;text-align:center;padding:20px 0;}

.marketing_tit_p1 {font-size:60px;font-weight:500;letter-spacing:-1px;text-align:center;}
.marketing_tit_p2 {font-size:36px;font-weight:300;letter-spacing:-1px;text-align:center;padding:20px 0;}
.marketing_tit_p1 span {
	font-weight:bold;color:#fff;
	background: linear-gradient(to left, #373bbb 10%, #42c393 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

}

.marketing_1 {margin-top:100px;}
.marketing_1, .marketing_1 ul {width:100%;}
.marketing_1 li {float:left;width:50%}
.marketing_1 li:nth-child(2n) {text-align:right;}
.marketing_1 li:nth-child(2n - 1) {text-align:left;}

.marketing_2 {margin-top:100px;}
.marketing_2_arrow {padding:40px;text-align:center;}

.marketing_3 {margin-top:100px;}
.marketing_3, .marketing_3 ul {width:100%;}


.marketing_3 li {float:left;width:calc(50% - 45px);}
.marketing_3 li:nth-child(3n) {text-align:right;}
.marketing_3 li:nth-child(3n - 1) {text-align:center;width:90px;position:relative;height:100%;}
.marketing_3 li:nth-child(3n - 2) {text-align:left;}

.marketing_3_arrow img {position:absolute;top:230px;left:12px;}

.marketing_4 {margin-top:100px;}

.marketing_4_layer {box-shadow: 2px 1px 10px 1px rgba(0,0,0,0.1);}

.marketing_5 {padding:40px 0 60px 0;}
.marketing_5_bg {background:url('/theme/basic/images/sub_img_marketing_5_bg.jpg');}
.marketing_5_txt {font-size:40px;float:right;}
.marketing_5_txt span {color:#2946ed;font-weight:bold;}

.mm_br {display:none;}
.package_tab li {display:inline-block;vertical-align:top;line-height:30px; width:19.8%;}
.btn_p_step_1 , .btn_p_step_2 {width:90%;border-radius:100px;border:1px solid #eee; background:#fff; color:#333;font-size:16px; font-weight:bold;text-align:center;padding:10px 0;box-shadow: 5px 5px 15px 0px #eee;cursor:pointer;}
.btn_p_step_1 {line-height:40px;}
.btn_p_step_2 {line-height:20px;}


.package_tit_1 {font-size:34px;font-weight:400;letter-spacing:-1px;text-align:center;color:#717171;}
.package_tit_1 span {color:#6779fb;}

.p_step {position:absolute;height:110px;top:-110px;}

.p_blue1 {background:#f4f7fd;padding:100px;position:relative;}
.p_blue2 {background:#dbe5f8;padding:100px;position:relative;}

.package_wrap li {float:left; width:50%;}
.package_num {padding-bottom:20px;}
.p_title {padding:3px 20px 5px;background:#6779fb;color:#fff; font-weight:bold;font-size:2.8em;display:inline-block;}
.p_txt {font-size:1.8em;color:#666666;}
.p_txt_s {color:#ff0d0d;font-size:1.2em;}
.package_img {text-align:right}
.package_t {padding:0 75px 0 10px;position:relative;}


.sub_tit_line {width:2px; background:#6779fb;height:58px;display:block;margin:0 auto;margin-bottom:30px;}

.search_tit_1 {font-size:43px;font-weight:400;letter-spacing:-1px;text-align:center;}
.search_tit_1 span {color:#6779fb;}

.searchad_1 {font-size:27px; color:#989898;font-weight:300;line-height:200%;word-break:keep-all;}
.searchad_1 span {font-size:27px; color:#6779fb;font-weight:400;}

.sub_img_searchad_2 , .sub_img_shoppingad_2 , .sub_img_display ,  .sub_img_media_2  , .sub_img_autodabid  {padding:150px 0;}

.etc_rolling {width:70%;float:right}

.shoppingad_1 {display:inline-block;font-size:27px; color:#989898;font-weight:300;line-height:200%;word-break:keep-all;}
.shoppingad_1 span {color:#6779fb;}

.sub_line {background:#f1f1f1;height:2px;border-bottom:1px solid #f5f5f5;display:block;}

.media_tit_1 {font-size:43px;font-weight:500;letter-spacing:-1px;color:#6779fb}
.media_tit_2 {font-size:30px;font-weight:300;letter-spacing:-1px;padding:20px 0;color:#999}

.media_2 td {text-align:center;}
.media_table_tit {font-size:35px;color:#6779fb;margin-bottom:20px;}
.media_table_txt {font-size:22px;color:#666;}
.media_line {display:inline-block;width:1px; height:50px; background:#ccc;}
.media_table_cont {width:30%;padding:0 25px;}
.media_3_gradient {background: linear-gradient(to left, #373bbb 10%, #42c393 90%);}
.media_3 {padding:50px 0;}

.sub_cont_title .s_info {color:#999;font-size:22px;display:block;font-weight:300;}

.areas_tit_1 {font-size:43px;font-weight:500;letter-spacing:-1px;}

.inter_nav {position:absolute;right:0px;top:0px;}
.inter_nav li {display:inline-block;border:1px solid #ccc; padding:10px 15px;font-size:1.5em;}
.inter_nav li.act {background:#6779fb;color:#fff;}
.inter_icon {background:#6779fb; padding:10px 25px;color:#fff;border-radius:100px;display:inline-block;}
.inter_title {margin-top:30px;font-size:1.5em;}

.interview_wrap { width:100%; padding:50px 100px; border-radius:20px; box-shadow:1px 1px 5px 5px rgba(0,0,0,0.05); background:#fcfcfc}
.inter_no {font-size:30px;color:#c0cfc3;text-align:center;font-weight:bold;}
.inter_left {background:#e9e9eb;color:#363636;display:inline-block;float:left;font-size:24px;padding:30px 50px;border-radius:20px;position:relative;}
.inter_right {background:#6779fb;color:#fff;display:inline-block;float:right;font-size:24px;padding:30px 50px;border-radius:40px;position:relative;}

.inter_icon1 {position:absolute;bottom:15px;left:-25px;}
.inter_icon2 {position:absolute;bottom:15px;right:-35px;}
.inter_sub_img {float:right;margin-right:-100px;}
.inter_allow {float:right;}
.inter_allow li {display:inline-block;border:1px solid #ccc; padding:10px 15px;font-size:1.5em;}
.inter_allow li:hover {background:#6779fb;color:#fff;}


.hidden {
	overflow: hidden;
	display: inline-block;
	position: relative;
	z-index: -1;
	border: 0;
	width: 1px;
	height: 1px;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
}