@charset "utf-8";

/* 스킵 메뉴 */
#skip {position: relative;}
#skip a {position: absolute; left:0; top: -999px; width: 200px; border:1px solid #fff; color:#fff; text-align: center; background:#333; line-height: 30px; z-index: 9;}
#skip a:active,
#skip a:focus {top:0;}

/*******************************

전체 레이아웃

*******************************/

#header
{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  flex-shrink: 0;
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:2000;
  height: 100px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.10);
  background: rgba(30, 30, 30, 0.03);
  -webkit-transition: background 0.3s ease-out, margin-top 0s ease-out;
  transition: background 0.3s ease-out, margin-top 0s ease-out;
}

#wrap
{
  display:flex;
  flex-direction:column;
}

#main_visual
{
  height: 100vh;
  display:flex;
  flex-direction: column;
  background:#333;
}

#blockchain
{
  background:#f7f7f7;
  border-bottom:1px solid #ccc;
}

#business
{
  background:#fff;
  border-bottom:1px solid #ccc;
}

#about
{
  background:#f7f7f7;
  border-bottom:1px solid #ccc;
}

#notice
{
  background:#fff;
  border-bottom:1px solid #ccc;
}

/*서브페이지 레이아웃*/

#sub_message
{
  background:#f7f7f7;
  border-bottom:1px solid #ccc;
  height: 100%;
}

#sub_history
{
  background:#fff;
  border-bottom:1px solid #ccc;
  height: 100%;
}

#sub_org
{
  background:#f7f7f7;
  border-bottom:1px solid #ccc;
  height: 100%;
}

#sub_ctf
{
  background:#fff;
  border-bottom:1px solid #ccc;
}

#sub_talent
{
  background:#fff;
  height: 100%;
}

#sub_ict_pf
{
  height: 100%;
}

#sub_handygroup
{
  height: 100%;
}

#sub_client
{
  background:#f7f7f7;
  border-bottom:1px solid #ccc;
}

#sub_map
{
  background:#fff;
  border-bottom:1px solid #ccc;
}

#contact_us
{
  background:#666;
  text-align: center;
  padding:100px 0;
  background: url(../img/con_bg.jpg) no-repeat center center;
  background-size: cover;
}

#sitemap
{
  background:#252525;
}

#footer
{
  background:#1e1e1e;
}


/******************************

header 영역

*******************************/

.header
{
  padding:0 50px;
}

.header .logo
{
  flex-basis:115px;
  flex-grow:0;
  flex-shrink:1;
}

.header .logo .logo_img
{
  display:block;
  width: 115px;
  height: 56px;
  background: url(../img/logo_w.png) no-repeat center center;
  background-size: 115px auto;
}

.header .gnb
{
  flex-grow: 1;
  flex-shrink:1;
  margin:0 10px;
}

.header .gnb ul
{
  text-align: center;
  margin:0 auto;
  padding:0;
  list-style:none;
  display:table;
}

.header .gnb ul>li
{
  display:inline;
  padding:0 30px;
  position:relative;
  display:table-cell
}

.header .gnb ul>li a
{
  color:#ffffff;
  font-size:18px;
  font-weight: 400;
  position: relative;
}



.header .gnb ul>li a:after
{
  z-index: -10;
  bottom:3px;
  content:"";
  display:block;
  height:6px;
  left:50%;
  position:absolute;
  background:#a2c47b;
  transition:width .3s ease 0s,left .3s ease 0s;
  width:0
}

.header .gnb ul>li a:hover:after
{
  width:100%;
  left:0
}

/* 2댑스 메뉴 */

.header .gnb .depth_1
{
  display:none;
  padding: 0;
  position: absolute;
  top: 64px;
  left: 0;
  width: 100%;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  background:#fff;
  text-align: center;
}


.header .gnb .depth_2
{
  display:none;
  padding: 0;
  position: absolute;
  top: 64px;
  left: -20px;
  width: 150%;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  background:#fff;
  text-align: center;
}

.header .gnb .depth_3
{
  display:none;
  padding: 0;
  position: absolute;
  top: 64px;
  left: -20px;
  width: 135%;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  background:#fff;
  text-align: center;
}

.header .gnb .depth_4
{
  display:none;
  padding: 0;
  position: absolute;
  top: 64px;
  left: 0;
  width: 110%;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  background:#fff;
  text-align: center;
}

.header .gnb .depth_5
{
  display:none;
  padding: 0;
  position: absolute;
  top: 64px;
  left: 0;
  width: 100%;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  background:#fff;
  text-align: center;
}

.header .gnb .depth_6
{
  display:none;
  padding: 0;
  position: absolute;
  top: 64px;
  left: 0;
  width: 100%;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  background:#fff;
  text-align: center;
}

.header .gnb ul>li>ul>li
{
  display: block;
  text-align: left;
  padding: 10px 15px;
  opacity: 1;
  transition: all ease .6s;
  -webkit-transition: all ease .6s;
  -o-transition: all ease .6s;
  -moz-transition: all ease .6s;
  -ms-transition: all ease .6s;
}

.header .gnb ul>li>ul>li a
{
  color:#666666;
  font-size:15px;
  font-weight: 400;
}

.header.on .gnb ul>li>ul>li a
{
  color:#666666;
}

.header .gnb ul>li>ul>li:hover { background: #ebebeb; }

.header .gnb ul>li>ul>li:hover a { color:#649d23; }

.header .gnb ul>li>:hover ul
{
  display: block;
  opacity: 1;
  visibility: visible;
}


/* header 영역 _ on 했을경우 */

.header.on
{
  background: #fff !important;
  position: fixed;
  border-bottom: 1px solid #ddd !important;
  box-shadow: 2px 2px 5px rgba(0,0,0,0.05);
  z-index:100;
}

.header.on .logo_img
{
  display: block;
  width: 115px;
  height: 56px;
  background: url(../img/logo.png) no-repeat center center;
  background-size: 115px auto;
}

.header.on .gnb li a
{
  color:#000;
}

.header.on .gnb li.on a
{
  color: #f26009;
  position: relative;
}

.header.on .side .contact_btn
{
  display:inline-block;
}

.header.on .side .contact_btn a
{
  color: #000;
  background:rgba(0,0,0,0.08);
  border-radius: 60px;
  /* padding: 8px 24px; */
  vertical-align: middle;
  -webkit-transition-duration:0.3s;
}

.header.on .side .contact_btn a button
{
  color: #000;
}


.header.on .side .contact_btn a:hover
{
  background:linear-gradient(120deg, #649d23 30%, #239d87 100%);
  border:0;
  color:#fff;
}

.header.on .side .contact_btn a:hover button
{
  color:#fff;
}

.header.on .category .bar
{
  background: #000;
}

.side
{
  flex-shrink:0;
  width: 240px;
}

.side .contact_btn
{
  display:inline-block;
}

.side .contact_btn a
{
  color:#fff;
  padding: 8px 24px;
  background: rgba(255,255,255,0.15);
  border-radius: 60px;
  vertical-align: middle;
}

.side .contact_btn a button
{
  color:#fff;
}

.category
{
  position: absolute;
  top: 38px;
  right: 50px;
  width: 40px;
  height: 24px;
  cursor: pointer;
}

.category .bar
{
  display: inline-block;
  position: absolute;
  left: 0;
  width: 100%;
  width: 100%;
  height: 2px;
  border: 0;
  background: #fff;
  transition: opacity 0.3s, top 0.3s, transform 0.5s;
  transition-delay: 0.3s, 0.3s, 0s;
}

.category .bar:nth-child(2) {top:0; transform:rotate(0)}
.category .bar:nth-child(3) {top:11px; opacity:1}
.category .bar:nth-child(4) {top:22px; transform:rotate(0)}

.category.close .bar {background:#000; transition:background 1s, opacity 0.3s, top 0.3s, transform 0.5s; transition-delay:0s, 0s, 0s, 0.3s; }
.category.close .bar:nth-child(2) {top:11px; background:#000; transform:rotate(-45deg)}
.category.close .bar:nth-child(3) {opacity:0}
.category.close .bar:nth-child(4) {top:11px; background:#000; transform:rotate(45deg)}

.scr {overflow-y: hidden;}


/******************************

main-visual 영역

*******************************/
.main-visual
{
  height: 100vh;
  display: flex;
  flex-direction: column;
  position:relative;
}

.ss1_img
{
  background: url(../img/main_visual_3.jpg) no-repeat 50% 50%;
  background-size: cover;
  z-index:-5;
  width: 100%;
  height: 100%;
}


.slide-text {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  z-index: 2;
}

.slide-text h5
{
  color: #fff;
  font-weight: 400;
}

.slide-text h2
{
  color: #fff;
  font-weight: 600;
}

.ss2_img
{
  background: url(../img/main_visual_2.jpg) no-repeat 50% 50%;
  background-size: cover;
  z-index:-5;
  width: 100%;
  height: 100%;
}

/*배경 애니메이션 주기*/

.swiper-slide-active .ss1_img
{
  animation: slidein_img 5s ease 0s 1 normal both;
  -webkit-animation: slidein_img 5s ease 0s 1 normal both;
  transform-origin:50% 50%;
}

.swiper-slide-active .ss2_img
{
  animation: slidein_img 5s ease 0s 1 normal both;
  -webkit-animation: slidein_img 5s ease 0s 1 normal both;
  transform-origin:50% 50%;
}

@keyframes slidein_img
{
  0% { -ms-transform: scale(1.1,1.1); -webkit-transform: scale(1.1,1.1); transform: scale(1.1,1.1);}
  100% { -ms-transform: scale(1,1); -webkit-transform: scale(1,1); transform: scale(1,1);}
}

.paging
{
  height: 20px;
  z-index: 2;
  margin-bottom:30px;
}

.paging span
{
  margin-left:10px;
  color:#fff;
  font-size:13px;
  font-weight: 600;
  position: absolute;
  text-align: center;
  width: 30px;
}

.paging .num_all
{
  margin-left:40px;
  color:#fff;
  font-size:13px;
  font-weight: 600;
  position: absolute;
  width: 30px;
}

.swiper-pause
{
  background: url(../img/mainslide_play.png) no-repeat 50% 50%;
  background-size: cover;
  width: 11px;
  height: 18px;
  margin-left: 105px;
  opacity: .8;
  display:inline-block;
}


.swiper-pause.active
{
  background: url(../img/mainslide_stop.png) no-repeat 50% 50%;
  background-size: cover;
  width: 11px;
  height: 18px;
  margin-left: 105px;
  opacity: .8;
  display:inline-block;
}

.btn_play:hover
{
  opacity: 1;
}

.row
{
  max-width: 1280px;
  margin: 0 auto;
}

.btn_main_visual_pre
{
  background: url(../img/mainslide_left.png) no-repeat 50% 50%;
  background-size: cover;
  width: 11px;
  height: 18px;
  opacity: .8;
}

.btn_main_visual_pre:hover
{
  opacity: 1;
}

.btn_main_visual_next
{
  background: url(../img/mainslide_right.png) no-repeat 50% 50%;
  background-size: cover;
  width: 11px;
  height: 18px;
  margin-left:30px;
  opacity: .8;
}

.btn_main_visual_next:hover
{
  opacity: 1;
}

.scrolldown
{
  position: absolute;
  bottom: 40px;
  left: 100px;
  background-size: cover;
  width: 13px;
  height: 135px;
  z-index: 2;
}

.scrolldown .scrolldowntext
{
  background: url(../img/scrolldown.png) no-repeat;
  background-size: cover;
  width: 9px;
  height: 91px;
  margin-left: 5px;
  margin-bottom: 10px;
}

.mousey
{
  width: 3px;
  padding: 0px 6px;
  height: 27px;
  border: 2px solid #fff;
  border-radius: 25px;
  opacity: 0.75;
  box-sizing: content-box;
}
.scroller
{
  width: 3px;
  height: 7px;
  border-radius: 40%;
  background-color: #fff;
  animation-name: scroll;
  animation-duration: 2.2s;
  animation-timing-function: cubic-bezier(.15,.41,.69,.94);
  animation-iteration-count: infinite;
}

@keyframes scroll
{
  0% { opacity: 0; }
  10% { transform: translateY(0); opacity: 1; }
  100% { transform: translateY(15px); opacity: 0;}
}

/*구축현황*/

.newsroom
{
 height: 66px;
 width: 100%;
 position:absolute;
 bottom:0;
 left:0;
 z-index: 1;
}

.newsroom .row
{
  overflow: hidden;
  height: 100%;
  position:relative;
}

.newsroom .row h7
{
  color: #fff;
  padding: 22px 50px;
  float: left;
  background: rgba(0,0,0,0.85);
}

.slider_wrap .slider_wrap
{
  float: right;
}

.slider_wrap
{
  overflow:hidden;
  padding: 20px 120px 22px 0;
  background: rgba(0,0,0,0.85);
  height: 100%;
}

.slider_list
{
  height: 100%;
  overflow:hidden;
}

.slider_list .list_1
{
  height: 100%;
}

.slider_list .list_1 span
{
  color:#fff;
  float:left;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  width: 80%;
  letter-spacing: -0.5px;
}

.slider_list .list_1 p
{
  color:#fff;
  float:right;
}

.newsroom:after
{
  content: '';
  width: calc(50% - 640px);
  height: 100%;
  right: 0;
  position: absolute;
  top: 0;
  background:rgba(0,0,0,0.85);
}

.slider_wrap .slide_prev
{
  background: url(../img/arrow_up.png) no-repeat;
  background-size: cover;
  width: 11px;
  height: 6px;
  position: absolute;
  right: 0;
  bottom: 40px;
  opacity: .8;
  z-index: 5;
}

.slider_wrap .slide_prev:hover
{
  opacity: 1;
}

.slider_wrap .slide_next
{
  background: url(../img/arrow_down.png) no-repeat;
  background-size: cover;
  width: 11px;
  height: 6px;
  position: absolute;
  right: 0;
  bottom: 22px;
  opacity: .8;
  z-index: 5;
}

.slider_wrap .slide_next:hover
{
  opacity: 1;
}

.tit
{
  text-align: center;
  margin-top:100px;
  margin-bottom:60px;
}

.tit h3
{
  font-weight: bold;
  color:#000;
}

.tit h6
{
  color:#333;
}

/*2 플랫폼 블록체인*/

.platform
{
  display:flex;
  flex-direction:row;
  justify-content:space-between;
}

.platform>div
{
  width: 49%;
  height: 230px;
  background:#fff;
  box-shadow: 10px 20px 25px rgba(0, 0, 0, 0.03);
  border-top-left-radius: 30px;
  border-bottom-right-radius: 30px;
  position:relative;
  overflow: hidden;
}

.platform>div .platform_1
{
  -webkit-transition-duration: 0.4s;
  width: 100%;
  height: 100%;
  display:flex;
  flex-direction:row;
  align-items:center;
}


.platform>div .platform_1:hover
{
  background:#649d23;
}

.platform>div .platform_1:hover .platform_icon
{
  background: url(../img/pet_active.png) no-repeat;
  background-size: cover;
}

.platform>div .platform_1:hover >div h4
{
  color:#fff;
}

.platform>div .platform_1:hover .platform_arrow
{
  background: url(../img/platform_arrow_active.png) no-repeat;
  background-size: cover;
}

.platform>div .platform_1 .platform_icon
{
  background: url(../img/pet.png) no-repeat;
  background-size: cover;
  width: 140px;
  height: 140px;
}

.platform>div .platform_1>div
{
  margin-left:40px;
}

.platform>div .platform_1>div h4
{
  font-weight: 700;
}

.platform>div .platform_1 .platform_arrow
{
  position:absolute;
  bottom:30px;
  right:30px;
  background: url(../img/platform_arrow.png) no-repeat;
  background-size: cover;
  width: 39px;
  height: 22px;
}

.platform>div .platform_2
{
  -webkit-transition-duration: 0.4s;
  width: 100%;
  height: 100%;
  display:flex;
  flex-direction:row;
  align-items:center;
}

.platform>div .platform_2:hover
{
  background:#649d23;
}

.platform>div .platform_2:hover .platform_icon
{
  background: url(../img/delivery_active.png) no-repeat;
  background-size: cover;
}

.platform>div .platform_2:hover >div h4
{
  color:#fff;
}

.platform>div .platform_2:hover .platform_arrow
{
  background: url(../img/platform_arrow_active.png) no-repeat;
  background-size: cover;
}


.platform>div .platform_2 .platform_icon
{
  background: url(../img/delivery.png) no-repeat;
  background-size: cover;
  width: 140px;
  height: 140px;
}

.platform>div .platform_2>div
{
  margin-left:40px;
}

.platform>div .platform_2>div h4
{
  font-weight: 700;
}

.platform>div .platform_2 .platform_arrow
{
  position:absolute;
  bottom:30px;
  right:30px;
  background: url(../img/platform_arrow.png) no-repeat;
  background-size: cover;
  width: 39px;
  height: 22px;
}

/*3 business*/

.business
{
  display:flex;
  justify-content: space-between;
  flex-direction:row;
  flex-wrap:wrap;
}

.business h4
{
  color:#fff;
  font-weight: 700;
  margin-bottom:15px;
  letter-spacing: 0px;
  display: inline-block;
  margin-right:5px;
  padding-top: 40px;
  padding-left: 30px;
}

.business h7
{
  color:#fff;
  letter-spacing: -0.5px;
  padding-left: 30px;
  display:inline-block;
}

.business span
{
  color:#fff;
  letter-spacing: -0.5px;
  display:inline-block;
}

.business .business_1,
.business .business_2,
.business .business_3,
.business .business_4
{
  width: 49%;
  height: 340px;
  background:#333;
  margin-bottom:30px;
  overflow: hidden;
  position:relative;
}

.business .business_5
{
  width: 49%;
  height: 340px;
  background:#333;
  margin-bottom:0px;
  overflow: hidden;
  position:relative;
}

/*img1*/

.business .business_1 a
{
  z-index:2;
  position:absolute;
  display:flex;
  width:100%;
  height: 100%;
  flex-direction:column;
}

.business .business_1 img
{
  background-size: cover;
  width: 100%;
  height: 100%;
  transition: all .6s;
  -webkit-transition: all .6s;
  -moz-transition: all .6s;
  -o-transition: all .6s;
  -ms-transition: all .6s;
  z-index:0;
}

.business .business_1:hover img,
.business .business_1:focus img{transform: scale(1.1);}

/*img2*/

.business .business_2 a
{
  z-index:2;
  position:absolute;
  width:100%;
  height: 100%;
  display:flex;
  flex-direction:column;
}

.business .business_2 img
{
  background-size: cover;
  width: 100%;
  height: 100%;
  transition: all .6s;
  -webkit-transition: all .6s;
  -moz-transition: all .6s;
  -o-transition: all .6s;
  -ms-transition: all .6s;
  z-index:0;
}

.business .business_2:hover img,
.business .business_2:focus img{transform: scale(1.1);}

/*img3*/

.business .business_3 a
{
  z-index:2;
  position:absolute;
  width:100%;
  height: 100%;
  display:flex;
  flex-direction:column;
}

.business .business_3 img
{
  background-size: cover;
  width: 100%;
  height: 100%;
  transition: all .6s;
  -webkit-transition: all .6s;
  -moz-transition: all .6s;
  -o-transition: all .6s;
  -ms-transition: all .6s;
  z-index:0;
}

.business .business_3:hover img,
.business .business_3:focus img{transform: scale(1.1);}


/*img4*/

.business .business_4 a
{
  z-index:2;
  position:absolute;
  width:100%;
  height: 100%;
  display:flex;
  flex-direction:column;
}

.business .business_4 img
{
  background-size: cover;
  width: 100%;
  height: 100%;
  transition: all .6s;
  -webkit-transition: all .6s;
  -moz-transition: all .6s;
  -o-transition: all .6s;
  -ms-transition: all .6s;
  z-index:0;
}

.business .business_4:hover img,
.business .business_4:focus img{transform: scale(1.1);}


/*img5*/

.business .business_5 a
{
  z-index:2;
  position:absolute;
  width:100%;
  height: 100%;
  display:flex;
  flex-direction:column;
}

.business .business_5 img
{
  background-size: cover;
  width: 100%;
  height: 100%;
  transition: all .6s;
  -webkit-transition: all .6s;
  -moz-transition: all .6s;
  -o-transition: all .6s;
  -ms-transition: all .6s;
  z-index:0;
}

.business .business_5:hover img,
.business .business_5:focus img{transform: scale(1.1);}


/*4 about aintop*/
.core_item
{
  display: flex;
  flex-direction:row;
}

.core_item>div
{
  display: flex;
  flex-direction:column;
  align-items:center;
  flex-basis: 25%;
}

.core_item>div h7
{
  letter-spacing: -0.5px;
  font-weight: 500;
}

.core_item>div>div h1
{
  font-weight: 700;
  color:#000;
  display: inline-block;
}

.core_item>div>div h6
{
  display: inline-block;
  margin-left:5px;
}

.core_item>div .info
{
  color:#999;
  font-weight: 400;
  text-align: center;
}



.core_item .core_item_icon
{
  width: 60px;
  height: 60px;
  margin-bottom:30px;
}

.core_item .core_item_icon img
{
  width: 100%;
}


/*notice*/

.notice
{
  display:flex;
  flex-direction:column;
  border-top:1px solid #ddd;
}

.notice .notice_list
{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  border-bottom:1px solid #ddd;
  padding: 30px 20px;
  justify-content:space-between;
}

.notice .notice_list:hover
{
  background:#f8f8f8;
}

.notice .notice_list .notice_date
{
  color:#666;
  width: 90px;
  text-align: right;
  margin: auto 0px;
}

.notice .notice_list .notice_img
{
  width: 170px;
}

.notice .notice_list .txtarea
{
  width: 70%;
  margin-left:20px;
  margin-right:20px;
}

.notice .notice_list .notice_date2
{
  color:#666;
  width: 190px;
  text-align: left;
}

.notice .notice_list .txtarea2
{
  width: calc(100% - 250px);
  margin-left:20px;
  margin-right:20px;
}

.notice .notice_list .txtarea h5
{
  font-weight: bold;
  letter-spacing: -0.5px;
  margin-bottom:10px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

.notice .notice_list .txtarea h7
{
  width: 100%;
  display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  color:#666;
  letter-spacing: -0.5px;
}

.notice .notice_list .txtarea2 h5
{
  font-weight: bold;
  letter-spacing: -0.5px;
  margin-bottom:10px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

.notice .notice_list .txtarea2 h7
{
  width: 100%;
  display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  color:#666;
  letter-spacing: -0.5px;
}

.notice .notice_list>div
{

}

.notice .notice_list>div img
{
  width: 170px;
  height: 100px;
}

.main_btn a
{
  font-weight: 500;
  border-radius: 60px;
  height: 50px;
  line-height: 50px;
  width: 220px;
  text-align: center;
  -webkit-transition-duration: 0.3s;
  display:block;
  margin: 0 auto;
  border:1px solid #999;
  margin-top:40px;
  letter-spacing: -0.5px;
  box-sizing: border-box;
}

.main_btn a button
{
  font-weight: 400;
}

.main_btn a:hover
{
  background:#649d23;
  color:#fff;
}

.main_btn a:hover button
{
  color:#fff;
}

#contact_us h5 {color:#fff;}

.main_btn2 a
{
  border-radius: 60px;
  width: 220px;
  text-align: center;
  -webkit-transition-duration: 0.3s;
  display:block;
  margin: 0 auto;
  border:1px solid #ebebeb;
  margin-top:40px;
  box-sizing: border-box;
  height: 50px;
  line-height: 50px;
}

.main_btn2 a button
{
  font-weight: 400;
  color:#fff;
  letter-spacing: -0.5px;
}

.main_btn2 a:hover
{
  background:#649d23;
  border:1px solid #649d23;
}

.main_btn2 a:hover button
{
  color:#fff;
}

/*사이트맵*/
.sitemap
{
  display:flex;
  flex-direction:row;
  justify-content:space-between;
  padding:60px 0;
  flex-wrap: wrap;
}

.sitemap>div
{
  display:flex;
  flex-direction:column;
  flex-shrink: 1;
  flex-grow: 1;
  margin-right:15px;
}

.dept01
{
  color:#fff;
  font-weight: bold;
  padding:20px 0;
  position:relative;
}


.dept02
{
  color:#666;
  flex-direction: column;
  width: 100%;
  line-height: 32px;
  font-weight: 400;
  font-size:15px;
  -webkit-transition-duration: 0.4s;
  display:flex;
}

.dept02 a
{
  line-height: 32px;
  font-size:15px;
  -webkit-transition-duration: 0.4s;
  color:#666;
}

/*푸터*/

.footer
{
  display:flex;
  flex-direction:column;
  padding:40px 0;
}

.fot_logo .fot_logo_img
{
  display: block;
  width: 115px;
  height: 56px;
  background: url(../img/logo_w.png) no-repeat center center;
  background-size: 115px auto;
  opacity:0.5;
}

.fot_txtarea
{
  display:flex;
  flex-direction:row;
  justify-content:space-between;
  margin-top:25px;
}

.fot_txtarea>div
{
  color:#999;
}


.fot_txtarea>div span
{
  color:#666666;
}

.con_number
{
  display:flex;
  flex-direction:row;
}

.con_number>div
{
  padding:0 30px;
}

.con_number>div h6
{
  color:#fff;
  font-weight: 300;
}

.con_number>div h4
{
  color:#fff;
  font-weight: 700;
}

.con_number .con01
{
  border-right:1px solid #4b4b4b;
  height: 60px;
}


/* 하단 마진값 */

.mg_bottom
{
  margin-bottom:100px;
}

.mg_top
{
  margin-top:40px;
}

/*전체 사이트맵 */
#full_menu
{
  position:fixed;
  top:100px;
  width: 100%;
  right:-100%;
  height: calc(100% - 100px);
  background:#fff;
  z-index:9000;
  transition: all ease .5s;
  -webkit-transition: all ease .5s;
  -o-transition: all ease .5s;
  -moz-transition: all ease .5s;
  -ms-transition: all ease .5s;
  overflow: hidden;
  overflow-y: auto;
  padding-top:80px;
}

#full_menu.open
{
  right:0;
}

.full_menu
{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  align-content:space-between
}

.full_menu > div
{
  flex-grow:0;
  flex-shrink:0;
  flex-basis:190px;
  padding-right:40px;
  display:flex;
  flex-direction: column;
  padding-bottom: 30px;
}

.full_menu > div:nth-last-child()
{
  padding-right:0px;
}

.full_menu > div .dept01 h4
{
  color:#333;
  font-weight: bold;
  -webkit-transition-duration: 0.3s;
}

.full_menu > div .dept01 h4:hover
{
  color:#649d23;
}

.full_menu > div .dept02 a
{
  color:#666666;
  padding:4px 0;
  font-weight: 400;
  letter-spacing: -0.5px;
  -webkit-transition-duration: 0.3s;
}

.full_menu > div .dept02 a:hover
{
  color:#649d23;
}

#header.sitemap_header
{
  background:#fff;
}

#header.sitemap_header .logo .logo_img
{
  display: block;
  width: 115px;
  height: 56px;
  background: url(../img/logo.png) no-repeat center center;
  background-size: 115px auto;
}

#header.sitemap_header .side .contact_btn a
{
  border-radius: 60px;
  vertical-align: middle;
  background:linear-gradient(120deg, #649d23 30%, #239d87 100%);
  border:0;
  color:#fff;
}

#header.sitemap_header .side .contact_btn a button
{
  color:#fff;
}

.sitemap_header .gnb .menu
{
  display:none;
}


/******************************

quick 메뉴

*******************************/

.quick-menu
{
  position:fixed;
  right:30px;
  bottom:20px;
  width:60px;
  opacity:0;
  transition:all ease .6s;
  z-index:15;
  visibility: hidden;
}
.quick-menu.on
{
  opacity:1;
  visibility: visible;
}
.quick-menu a
{
  cursor:pointer;
  margin:10px 0 0;
  display:block;
}

/******************************

서브페이지 레이아웃

*******************************/

.sub-visual
{
  height: 500px;
  display:flex;
  position:relative;
  overflow: hidden;
}

.sub-visual .sub-visual-bg
{
  position:absolute;
  height: 100%;
  width: 100%;
  background: url(../img/sub_visual_1.jpg) no-repeat center center;
  background-size: cover;
  display:flex;
  align-items:center;
  animation: slidein_img 5s ease 0s 1 normal both;
  -webkit-animation: slidein_img 5s ease 0s 1 normal both;
  transform-origin:50% 50%;
}

.sub-visual .sub-visual-bg-02
{
  position:absolute;
  height: 100%;
  width: 100%;
  background: url(../img/sub_visual_2.jpg) no-repeat center center;
  background-size: cover;
  display:flex;
  align-items:center;
  animation: slidein_img 5s ease 0s 1 normal both;
  -webkit-animation: slidein_img 5s ease 0s 1 normal both;
  transform-origin:50% 50%;
}

.sub-visual .sub-visual-bg-03
{
  position:absolute;
  height: 100%;
  width: 100%;
  background: url(../img/sub_visual_3.jpg) no-repeat center center;
  background-size: cover;
  display:flex;
  align-items:center;
  animation: slidein_img 5s ease 0s 1 normal both;
  -webkit-animation: slidein_img 5s ease 0s 1 normal both;
  transform-origin:50% 50%;
}

.sub-visual .sub-visual-bg-04
{
  position:absolute;
  height: 100%;
  width: 100%;
  background: url(../img/sub_visual_4.jpg) no-repeat center center;
  background-size: cover;
  display:flex;
  align-items:center;
  animation: slidein_img 5s ease 0s 1 normal both;
  -webkit-animation: slidein_img 5s ease 0s 1 normal both;
  transform-origin:50% 50%;
}

.sub-visual .sub-visual-bg-05
{
  position:absolute;
  height: 100%;
  width: 100%;
  background: url(../img/sub_visual_5.jpg) no-repeat center center;
  background-size: cover;
  display:flex;
  align-items:center;
  animation: slidein_img 5s ease 0s 1 normal both;
  -webkit-animation: slidein_img 5s ease 0s 1 normal both;
  transform-origin:50% 50%;
}

.sub-visual .sub-visual-bg-06
{
  position:absolute;
  height: 100%;
  width: 100%;
  background: url(../img/sub_visual_6.jpg) no-repeat center center;
  background-size: cover;
  display:flex;
  align-items:center;
  animation: slidein_img 5s ease 0s 1 normal both;
  -webkit-animation: slidein_img 5s ease 0s 1 normal both;
  transform-origin:50% 50%;
}



@keyframes slidein_img
{
  0% { -ms-transform: scale(1.1,1.1); -webkit-transform: scale(1.1,1.1); transform: scale(1.1,1.1);}
  100% { -ms-transform: scale(1,1); -webkit-transform: scale(1,1); transform: scale(1,1);}
}

.sub-visual .row
{
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.sub-visual .row .sub-tit
{
  text-align: center;
}


.sub-visual .row .sub-tit h2
{
  color:#fff;
  font-weight: 600;
  margin-bottom:5px;

  animation-duration: 1s;
  animation-fill-mode: both;
  animation-iteration-count: 1;
  animation-timing-function: ease;
  -webkit-animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: ease;
  animation-delay: 0.3s;
  -webkit-animation-delay: 0.3s;
  animation-name: visual-tit;
  -webkit-animation-name: visual-tit;
}

.sub-visual .row .sub-tit h6
{
  color:#fff;
  font-weight: 300;

  animation-duration: 1s;
  animation-fill-mode: both;
  animation-iteration-count: 1;
  animation-timing-function: ease;
  -webkit-animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: ease;
  animation-name: visual-tit;
  -webkit-animation-name: visual-tit;
  animation-delay: 0.8s;
  -webkit-animation-delay: 0.8s;
}

@keyframes visual-zoom {
	0% {transform:scale(1.2);}
	100% {transform:scale(1);}
}
@-webkit-keyframes visual-zoom {
	0% {transform:scale(1.2);}
	100% {transform:scale(1);}
}
@keyframes visual-tit {
	0% {opacity:0; -webkit-opacity:0; transform:translateY(15px);}
	100% {opacity:1; -webkit-opacity:1; transform:translateY(0px);}
}
@-webkit-keyframes visual-tit {
	0% {opacity:0; -webkit-opacity:0; transform:translateY(15px);}
	100% {opacity:1; -webkit-opacity:1; transform:translateY(0px);}
}

/*메뉴 탭 형태-pc*/

#sub-dept
{
  height: 70px;
  width: 100%;
  position:absolute;
  bottom:0;
  left:0;
  background:rgba(0,0,0,0.6);
  z-index:3;
  display:block;
}

#sub-dept .row
{
  height: 100%;
}

.sub-dept
{
  display:flex;
  flex-direction: row;
  height: 100%;
}

.sub-dept.row_2>div
{
  flex-basis: 50%;
}

.sub-dept.row_7>div
{
  flex-basis: 14.2%;
}

.sub-dept>div
{
  text-align: center;
  line-height: 70px;
  flex-grow:1;
  flex-shrink:1;
  height: 100%;
}

.sub-dept>div a
{
  color:#ddd;
  letter-spacing: -0.5px;
  font-weight: 400;
  -webkit-transition-duration: 0.3s;
}

.sub-dept>div a:hover
{
  color:#649d23;
}

.sub-dept>div.active
{
  font-weight: 400;
  background:#649d23;
  letter-spacing: -0.5px;
  position:relative;
}

.sub-dept>div.active a
{
  color:#fff;
}

/*메뉴 드롭다운 형태-mo*/

#sub-dept-mo
{
  display:none;
  width: 100%;
  position:absolute;
  bottom:0;
  left:0;
  background:rgba(0,0,0,0.6);
  z-index:3;
}

.sub-dept-mo
{
  display:flex;
  flex-direction: column;
  flex-basis: 100%;
}

.sub-dept-mo .active-mo
{
  display:flex;
  flex-direction: column;
  flex-grow: 1;
  flex-shrink: 1;
  font-weight: 400;
  background: #649d23;
  letter-spacing: -0.5px;
  position: relative;
  text-align: center;
  line-height: 45px;
  color:#fff;
}


.sub-dept-mo .active-mo:after
{
  content: '';
  position: absolute;
  transition: 0.3s;
  right: 15px;
  top: calc( 50% - 2.5px );
  background: url(../img/arrow_down_2.png) no-repeat center center;
  background-size: cover;
  width: 9px;
  height: 6px;
}

.sub-dept-mo .active-mo.close:after
{
  content: '';
  position: absolute;
  transition: 0.3s;
  right: 15px;
  top: calc( 50% - 2.5px );
  background: url(../img/arrow_down_2.png) no-repeat center center;
  background-size: cover;
  width: 9px;
  height: 6px;
  transform: rotate( 180deg );
}

.sub-dept02-mo
{
  display: none;
  flex-direction: column;
  position:absolute;
  top:235px;
  left:0;
  z-index: 6;
  width: 100%;
  text-align: center;

}

.sub-dept02-mo.open
{
  display: flex;
}

.sub-dept02-mo>div
{
  width: 100%;
  line-height: 45px;
  background:#507e1c;
  border-bottom: 1px solid #5a862a;
}

.sub-dept02-mo>div:hover
{
  background:#4b761a;
}

.sub-dept02-mo>div a
{
  color:#fff;
}

/******************************

Company

*******************************/

.message
{
  width: 100%;
  position: relative;
  display:flex;
  flex-direction: column;
}

.message .img-container
{
  display:flex;
  align-items: center;
  max-width: 100%;
  height: 100%;
  background: #333;
  margin-bottom: 100px;
  position: relative;
}

.message .img-container img
{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.message .img-container .message_key
{
  position:absolute;
  left:60px;
  bottom:-40px;
  padding:60px 300px 50px 50px;
  background:#fff;
  border-top-left-radius: 25px;
  border-bottom-right-radius: 25px;
  box-shadow: 10px 20px 25px rgba(0, 0, 0, 0.08);

}

.message .img-container .message_key h4::before
{
  content:'';
  position: absolute;
  top:35px;
  height: 13px;
  width: 20px;
  background: url(../img/point.png) no-repeat center center;
  background-size: cover;
}

.message >div .message_sign
{
  margin-top:80px;
  float:right;
  display:flex;
  flex-direction: column;
  align-items:flex-end;
}

.message >div .message_sign img
{
  width: 125px;
  height: 100%;
  object-fit: cover;
}


/* 연혁 */
.history-wrapper
{
  display:flex;
  flex-direction: row;
  padding:0 30px;
  flex-wrap: wrap;
}

.history-wrapper .year
{
  min-width: 260px;
  flex-grow:0;
  flex-shrink: 0;
}

.history-wrapper .year .year_gra
{
  width: 150px;
}

.history-wrapper .list:after {
  position: absolute;
  left: -29px;
  top: 23px;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  background: url(../img/year.png) no-repeat center center;
  background-size: cover;
  content: "";
  z-index: 1;
}



.history-wrapper .year h1
{
  position:relative;
  font-weight: 700;
  background: linear-gradient(to right, #649d23, #239d87);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


.history-wrapper .list
{
  flex-grow:0;
  flex-shrink:1;
  width: 70%;
  display:flex;
  flex-direction: column;
  padding-left:80px;
  padding-bottom: 20px;
  position: relative;
  flex-wrap:wrap;
}

.history-wrapper .list:before
{
  position: absolute;
  left: -15px;
  top: 35px;
  width: 1px;
  height: 100%;
  background: #ddd;
  content: "";
}

.history-wrapper .list.last:before
{
  display:none;
}


.history-wrapper .list .info
{
  padding:12px 0;
  position: relative;
  display:flex;
  flex-direction: column;
  flex-wrap: wrap;
}

.history-wrapper .list .info h6
{
  letter-spacing: -0.5px;
}

.history-wrapper .list .info span
{
  color:#888;
}

.history-wrapper .list .info:before
{
  position: absolute;
  left: -15px;
  top: 22px;
  width: 5px;
  height: 5px;
  background:#649d23;
  border-radius: 50%;
  content: "";
}

/*현황*/
.company_info
{
  display:block;
  border-top:1px solid #333;
  flex-wrap:nowrap;
}

.company_info .com_info_list
{
  display:flex;
  flex-direction: row;
  align-items:center;
  flex-grow:1;
  flex-shrink:1;
  width: 100%;
  padding-top:15px;
  padding-bottom:15px;
  position:relative;
  border-bottom:1px solid #ddd;
}

.company_info .com_info_list:before
{
  position: absolute;
  content: '';
  background:#f8f8f8;
  top:0;
  left:0;
  width: 250px;
  height: 100%;;
}

.company_info .com_info_list .info_tit
{
  text-align: center;
  font-weight: 500;
  width: 250px;
  z-index:1;
}

.company_info .com_info_list .info_txt
{
  font-weight: 400;
  padding-left:30px;
  color:#333333;
  width: calc( 100% - 250px );
}

.img-container-pc
{
  display:block;
}

.img-container-pc img
{
  width: 100%;
}

.img-container-mo
{
  display:none;
}

.img-container-mo img
{
  width: 100%;
}

/*주요고객*/
.client_container
{
  display:flex;
  flex-direction: column;
}

.client_container .client_wrap
{
  display:flex;
  flex-direction: column;
}

.client_container .client_wrap .client_tit
{
  border-bottom: 1px solid #ddd;
  padding:15px 10px;
  letter-spacing: -0.5px;
  flex-shrink:1;
  flex-grow:1;
}

.client_container .client_wrap .client
{
  display:flex;
  flex-direction: row;
  flex-wrap:wrap;
  margin-top:20px;
  justify-content: space-between;
}

.client_container .client_wrap .client .client_list
{
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: 18%;
  padding-bottom: 10px;
}

.client_container .client_wrap .client .client_list img
{
  border: 1px solid #ddd;
  box-sizing: border-box;
  width: 100%;
}

/*찾아오시는길*/
.map_wrap
{
  display:flex;
  overflow:hidden;
  height: 410px;
  width: 100%;
  background:#ccc;

}

.map_info
{
  display:flex;
  flex-direction: row;
  margin-top:40px;
}

.map_info_1
{
  display:flex;
  flex-direction: row;
  width: 50%;
  align-items: center;
}

.map_info_2
{
  display:flex;
  flex-direction: row;
  width: 25%;
  align-items: center;
}

.map_info_3
{
  display:flex;
  flex-direction: row;
  width: 25%;
  align-items: center;
}

.info_icon
{
  width: 90px;
  height: 90px;
  border-radius: 50%;
  background:#efefef;
  flex-grow: 0;
  flex-shrink: 0;
}

.info_icon img
{
  width:100%;
}

.info_txt
{
  padding-left:20px;
  padding-right:10px;
}

.info_txt h7
{
  letter-spacing: -0.5px;
}

/*인재채용*/
.talent
{
  display:flex;
  flex-direction: column;

}

.talent_ps_pc
{
  display:block;
}

.talent_ps_mo
{
  display:none;
}

.talent img
{
  margin-top:40px;
  margin-bottom: 60px;
  width: 100%;
}


/******************************

ICT 융합

*******************************/

.ict_pf_pc
{
  display:block;
}

.ict_pf_pc img
{
  margin-bottom:15px;
  width: 100%;
}

.ict_pf_pc img:last-child
{
  margin-bottom:0;
}


.ict_pf_mo
{
  display:none;
}

.ict_pf_mo img
{
  width: 100%;
  margin-bottom:15px;
}

.pet_pf_mo img:last-child
{
  margin-bottom:0;
}

/******************************

Solution

*******************************/

.solu-wrapper
{
  display:flex;
  flex-direction: column;
}

.solu-wrapper span
{
  text-align: center;
  margin-bottom: 60px;
}

.solu-wrapper img
{
  width: 100%;
  height: 100%;
}

.solu-wrapper .solu_info
{
  display:flex;
  flex-direction: row;
  justify-content:space-between;
  flex-wrap:wrap;
  margin-top:30px;
}

.solu-wrapper .solu_info2
{
  display:flex;
  flex-direction: row;
  justify-content:space-between;
  flex-wrap:wrap;
  margin-top:0px;
}

.solu_item
{
  flex-shrink:1;
  flex-basis: 32%;
  border:1px solid #ddd;
  height: 140px;
  margin-bottom:20px;
  display:flex;
  flex-direction: row;
  align-items:center;
  padding-top:30px;
  padding-bottom:30px;
}

.solu_item2
{
  flex-shrink:1;
  flex-basis: 32%;
  border:1px solid #ddd;
  margin-bottom:20px;
  display:block;
  padding-top:30px;
  padding-bottom:30px;
  text-align: center;
}

.solu_item p
{
  letter-spacing: -0.5px;
  margin-right:30px;
}

.solu_item .solu_icon
{
  width: 85px;
  height: 85px;
  background:#ebebeb;
  border-radius: 50%;
  flex-grow:0;
  flex-shrink:0;
  margin-right:30px;
  margin-left:30px;
}

.solu_item2 .solu_icon
{
  width: 60px;
  height: 60px;
  margin:0 auto;
  margin-bottom:15px;
}

.solu_item2 h5
{
  font-weight: 600;
  letter-spacing: -0.5px;
  margin-bottom: 5px;
  padding:0 15px;
}

.solu_item2 p
{
  letter-spacing: -0.5px;
  padding:0 15px;
}

.solu_design
{
  display:flex;
  flex-direction: column;
  margin-bottom: 40px;
}

.solu_design:last-child
{
  margin-bottom: 0px;
}

.solu_design>div
{
  display:flex;
  flex-direction: row;
  justify-content:space-between;
  flex-wrap:wrap;
  margin-top:20px;
}

.solu_design>div>div
{
  flex-shrink:1;
  flex-grow:1;
  flex-basis: 48%;
  margin-right:20px;
}

.solu_design>div>div img
{
  border:1px solid #ddd;
  width: 100%;
}

.solu_design>div.img_3row>div
{
  flex-basis: 30%;
}

.solu_design>div>div:last-child
{
  margin-right:0px;
}

.solu_list
{
  background:#f5f5f5;
  display:flex;
  flex-direction: row;
  align-items:center;
  justify-content:space-between;
  margin-bottom: 40px;
}

.solu_list .solu_img
{
  height: 100%;
}

.solu_list .solu_txt
{
  padding-left:50px;
  padding-right: 20px;
  width: 70%;
}

.solu_num h4
{
  color:#649d23;
  font-weight: 600;
}

.solu_tit h4
{
  margin-bottom: 30px;
}

.solu_etc h6
{
  line-height: 1.8;
  position: relative;
  padding-left:40px;
}

.solu_etc h6:before
{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  background: url(../img/solu_check.png) no-repeat center center;
  background-size: cover;
  width: 25px;
  height: 20px;
}

/******************************

partner

*******************************/

.partner_container
{
  display: flex;
  flex-direction: column;
}

.partner_container .partner_wrap
{
  display: flex;
  flex-direction: column;
}

.partner_container .partner_wrap .partner_tit
{
  border-bottom: 1px solid #ddd;
  padding: 15px 10px;
  letter-spacing: -0.5px;
  flex-shrink: 1;
  flex-grow: 1;
}

.partner_container .partner_wrap .partner
{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-top: 20px;
  justify-content: space-between;
}

.partner_container .partner_wrap .partner .partner_list
{
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: 32%;
  padding-bottom: 10px;
}

.partner_container .partner_wrap .partner .partner_list img
{
  border: 1px solid #ddd;
  box-sizing: border-box;
  width: 100%;
}

.partner_container .partner_wrap .partner .partner_list p
{
  text-align: center;
  color:#666;
  margin-top:5px;
}

/******************************

Helpdesk

*******************************/
.helpdesk_container
{
  display: flex;
  flex-direction: column;
  height:100%;
}

.helpdesk_container .helpdesk_wrap
{
  display: flex;
  flex-direction: column;
  margin-bottom: 30px;
  height:100%;

}

.helpdesk_container .helpdesk_wrap h5
{
  font-weight: 600;
  margin-bottom: 10px;
  letter-spacing: -0.5px;
}

.helpdesk_container .helpdesk_wrap .helpdesk_tit
{
  border-bottom: 1px solid #ddd;
  padding: 15px 0px;
  flex-shrink: 1;
  flex-grow: 1;
}

.helpdesk_container .helpdesk_wrap .helpdesk_tit2
{
  padding: 15px 0px;
  flex-shrink: 1;
  flex-grow: 1;
}

.helpdesk_list
{
  margin-bottom: 30px;
}

.helpdesk_container .helpdesk_wrap .helpdesk_tit2 h4
{
  color:#649d23;
  letter-spacing: -0.5px;
}

.helpdesk_container .helpdesk_wrap .helpdesk_tit h4
{
  letter-spacing: -0.5px;
}

.helpdesk_container .helpdesk_wrap .helpdesk_tit2 h4 b
{
  color:#649d23;
}

.helpdesk_container .helpdesk_wrap .helpdesk_tit h4 i
{
  margin-right:10px;
  color:#666;
}

.helpdesk_container .helpdesk_wrap span
{
  margin-top:20px;
  letter-spacing: -0.5px;
}

.process_img_pc
{
  margin-top:20px;
  display:block;
}

.process_img_pc img
{
  width: 100%;
}

.process_img_mo
{
  margin-top:20px;
  display:none;
  height:100%;
}

.process_img_mo img
{
  width: 100%;
}

/******************************

Notice

*******************************/

/*게시물 보기*/
.notice_view
{
  display:flex;
  flex-direction: column;
}

.notice_view .notice_head
{
  display:flex;
  flex-direction: column;
  border-top:1px solid #333;
  border-bottom: 1px solid #ddd;
  padding:30px 20px;
}

.notice_view .notice_head .headtit h4
{
  font-weight: 600;
}

.notice_view .notice_head .notice_info
{
  display:flex;
  flex-direction: row;
  margin-top:10px;
}

.notice_view .notice_head .notice_info .date
{
  padding-right:15px;
  position: relative;
  color:#888;
  font-weight: 400;
}

.notice_view .notice_head .notice_info .date:after
{
  content: '';
  position: absolute;
  right: 0;
  top:20%;
  width: 1px;
  height: 65%;
  background:#ccc;
}

.notice_view .notice_head .notice_info .view
{
  padding-left:15px;
  color:#888;
  font-weight: 400;
}

.notice_view .notice_cont
{
  padding:30px 20px;
  /*display:flex;
  flex-direction: column;*/
}

.notice_view .notice_cont p
{

}


.notice_view .prevnext
{
  display:flex;
  flex-direction: column;
  border-top:1px solid #ddd;
  border-bottom: 1px solid #ddd;
}

.notice_view .notice_content
{
  display: none;
}

.prevnext a
{
  display:flex;
  flex-direction: row;
  flex-grow:0;
  flex-shrink:1;
  padding: 16px 30px;
  overflow: hidden;
}

.prevnext a.prev
{
  border-bottom: 1px solid #ddd;
}


.prevnext a .type
{
  flex-basis: 130px;
  padding-right: 26px;
  box-sizing: border-box;
  font-weight: 400;
}

.prevnext a .type i
{
  padding-left: 15px;
  color:#649d23;
  font-weight: 500;
}

.prevnext a .title
{
  flex-basis: calc(100% - 130px);
  color: #444;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;

}

.prevnext a .title:hover
{
  color:#649d23;
  text-decoration: underline;
  cursor: pointer;
}

.notice_file
{
  display:flex;
  flex-direction: row;
  flex-grow:0;
  flex-shrink:1;
  padding: 16px 30px;
  background:#f8f8f8;
  flex-wrap: wrap;
}

.notice_file .dlfile
{
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
  flex-basis:calc( 100% - 30px );
}

.notice_file .dlfile>div
{
  padding: 0 10px;
  color:#666666;
}

.notice_file .dlfile>div:hover
{
  color:#649d23;
  cursor: pointer;
}

.notice_file i
{
  font-size:20px;
  color:#999;
  flex-basis: 30px;
}




/******************************

tab

*******************************/

.tab-group
{
  display: flex;
  justify-content: center;
}

.tab
{
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  flex-grow: 1;

  position: relative;
  height: 56px;
  padding: 0 20px;
  background-color: #f8f8f8;
  border-top: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
  border-left: 1px solid transparent;
  border-right: 1px solid transparent;
  color:#666;
  box-sizing: border-box;
}

.tab:nth-child(n+2)::before
{
  position: absolute;
  top: 50%;
  left: -2px;
  width: 1px;
  height: 25px;
  background-color: #d8d8d8;
  transform: translateY(-50%);
  content: "";
}


.tab:last-child
{
  border-right:1px solid #ddd;
}

.tab.is-active
{
  border-top: 4px solid #649d23;
  border-bottom-color: transparent;
  border-left: 1px solid #dddddd;
  border-right: 1px solid #dddddd;
  background-color: #fff;
  color: #649d23;
  transition: all 0.2s ease-out;
  box-sizing: border-box;
}

.tab.is-active::before
{
  display:none;
}

.tab:first-child
{
  border-left: 1px solid #dddddd;
}

.panel-group
{
  border-top:none;
}
.panel
{
  display:none;
  margin-top:60px;
}

.panel.is-show
{
  display:block;
  margin-top:60px;
}

.ctf
{
  display:flex;
  flex-direction: row;
  flex-wrap:wrap;
  justify-content: space-between;
}

.ctf .ctf_list
{
  flex-grow:0;
  flex-shrink:1;
  flex-basis:18%;
  padding-bottom: 30px;
}

.ctf .ctf_list img
{
  border:1px solid #ddd;
  box-sizing: border-box;
  width: 100%;
}

.ctf .ctf_list span
{
  font-weight: 600;
  margin-top:5px;
  display:block;
}

.ctf .ctf_list p
{
  margin-top:15px;
  display:block;
  color:#666666;
}

/******************************

page (페이징)

*******************************/
.page
{
  display:flex;
  flex-direction: row;
  justify-content:center;
  margin-top:40px;
}

.page a
{
  position: relative;
  padding: 0 2px;
  margin: 0 8px;
  color: #999;
}

.page a:hover
{
  color: #333;
}

.page a i
{
  color:#777777;
}

.page a:hover i
{
  color: #333;
}


.page .num
{
  margin: 0 30px;
  vertical-align: top;
}

.page .num a.active
{
  color: #111;
  font-weight: bold;
}

.page .num a.active:before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: #111;
}



/******************************

미디어쿼리

*******************************/

@media (max-width:1550px){
  .scrolldown {left: 40px; bottom: 30px;}
  .scrolldown .scrolldowntext {height: 100px; margin-bottom: 15px;}

  .row {max-width: 1200px;}
  .newsroom:after {width: calc(50% - 600px);}
}

@media (max-width:1400px){
  .header .gnb ul>li {padding: 0 20px}
  .header .gnb ul>li a {font-size: 16px;}

  .row {max-width: 1100px;}
  .newsroom:after {width: calc(50% - 550px);}

  .notice .notice_list .txtarea {width: 60%;}

}

/* 태블릿 */

@media (max-width:1280px){
  .header .gnb {display:none;}
  #header {justify-content: space-between;}

  .scrolldown{display:none;}

  .row {padding:0 50px; max-width:none;}
  .newsroom:after {width: 50px;}

  .slider_wrap .slide_prev {right: 50px;}
  .slider_wrap .slide_next {right: 50px;}

  .platform{flex-direction:column;}
  .platform>div{width: 100%; margin-bottom:20px;}
  .platform>div:nth-last-child(){margin-bottom:0px;}

  .notice .notice_list .txtarea {width: 50%;}

  /*서브페이지 Company*/
  .message .img-container .message_key{padding: 60px 200px 50px 50px;}
  .history-wrapper .year {min-width: 200px;}

}

@media (max-width:1024px){
  .notice .notice_list {flex-direction: column;}
  .notice .notice_list .txtarea {width: 100%; margin-left: 0; margin-right: 0;}
  .notice .notice_list .txtarea2 {width: 100%; margin-left: 0; margin-right: 0;}
  .notice .notice_list .txtarea h7 {margin-bottom:25px;}
  .notice .notice_list .notice_date {text-align: left;}

  .fot_txtarea {flex-direction: column;}
  .con_number {margin-top:30px;}

  /*서브페이지 Company*/
  .message .img-container .message_key{left: 30px; padding: 55px 200px 40px 40px;}
  .message .img-container .message_key h4::before {top: 30px;}

  /*서브페이지 Solution*/
  .solu_item {flex-basis: 49%;}

}

@media (max-width:960px){
  .slider_wrap {padding: 20px 90px 22px 0;}

  .business {flex-direction: column;}
  .business .business_1, .business .business_2, .business .business_3, .business .business_4, .business .business_5 {width: 100%;}

  .core_item {flex-wrap: wrap;}
  .core_item>div {flex-basis: 50%; margin-bottom: 30px;}
  .core_item>div:nth-child(n+3) {margin-bottom: 0px;}
  .con_number>div:nth-child(1){padding-left:0;}

  .sitemap>div{flex-basis:25%; margin-bottom:15px;}
  .sitemap>div a{text-align: center;}


  /*서브페이지 Company*/
  .history-wrapper {padding: 0;}
  .history-wrapper .year {min-width: 190px;}
  .history-wrapper .list {padding-left: 60px;}
  .ctf .ctf_list {flex-basis: 23%;}
  .client_container .client_wrap .client .client_list {flex-basis: 23%;}
  .map_info {flex-direction: column;}
  .map_info_1,.map_info_2{margin-bottom:15px;}
  .map_info_1,.map_info_2,.map_info_3{width: 100%;}

  /*서브페이지 Solution*/
  .solu_item {flex-basis: 100%; height: 80px; margin-bottom: 10px;}
  .solu_item .solu_icon {width: 50px; height: 50px; margin-right: 15px;}
  .solu_list .solu_txt {padding: 30px; width: 100%; height: 100%;}
  .solu_list {flex-direction: column;}
  .solu_list .solu_img {width: 100%; height: 100%;}
}

@media (max-width:768px){
  .slider_list .list_1 span {width: 70%;}
  .slider_wrap {padding: 20px 48px 22px 0;}

  /*서브페이지 Company*/
  .message .img-container .message_key{padding: 45px 150px 30px 30px;}
  .ctf .ctf_list {flex-basis: 31%;}
  .client_container .client_wrap .client .client_list {flex-basis: 31%;}
  .history-wrapper .list {width: 60%;}

  /*서브페이지 partner*/
  .partner_container .partner_wrap .partner .partner_list {flex-basis: 100%; margin-bottom: 30px;}


}

/* 모바일 */

@media (max-width:640px){

  html, body, div, span, ul, li, dl, dd, dt, ol, h1, h2, h3, h4, h5, h6, input, fieldset, legend, p, select, table, th, td, tr, textarea, button, form, figure, figcaption
  {
    font-size: 12px !important;;
  }

  h1{font-size:34px !important;}
  h2{font-size:30px !important;}
  h3{font-size:23px !important;}
  h4{font-size:16px !important;}
  h5{font-size:14px !important;}
  h6{font-size:13px !important;}
  h7{font-size:12px !important;}

  #header {height: 50px;}
  .header .logo .logo_img {width: 74px; height: 48px; background-size: 71px auto;}
  #header.sitemap_header .logo .logo_img {width: 74px; height: 48px; background-size: 71px auto;}

  .side .contact_btn{display:none;}
  .header.on .side .contact_btn{display:none;}
  .header {padding: 0 24px;}
  .category {right: 24px;}

  .row {padding:0 24px; max-width:none;}
  .newsroom:after {width: 24px;}

  .slider_list .list_1 span {width: 70%;}
  .newsroom .row h7 {padding: 15px 30px;}
  .slider_wrap {padding: 13px 20px 13px 0;}

  .slider_wrap .slide_prev {bottom: 26px; right: 24px;}
  .slider_wrap .slide_next {bottom: 14px; right: 24px;}

  .category {top: 11px; width: 26px;}
  .category .bar:nth-child(2) {top: 3px;}
  .category .bar:nth-child(3) {top: 11px;}
  .category .bar:nth-child(4) {top: 20px;}



  .newsroom {height: 45px;}

  .business .business_1, .business .business_2, .business .business_3, .business .business_4, .business .business_5 {height: 180px; margin-bottom:15px;}

  .tit {margin-top: 50px; margin-bottom: 30px;}
  .mg_bottom{margin-bottom:50px;}

  .platform>div .platform_1 .platform_icon {width: 75px; height: 75px;}
  .platform>div .platform_2 .platform_icon {width: 75px; height: 75px;}
  .platform>div {height: 120px;}
  .platform>div .platform_1>div {margin-left: 20px;}
  .platform>div .platform_2>div {margin-left: 20px;}

  .business h4{padding-top: 20px; padding-left: 15px; margin-bottom:10px;}
  .business h7{padding-left: 15px;}

  .platform>div {margin-bottom: 15px;}

  .notice .notice_list>div img {width: 85px; height: 50px;}
  .notice .notice_list {padding: 15px 10px;}
  .notice .notice_list .txtarea h7 {margin-bottom: 15px;}
  .notice .notice_list .notice_date {text-align: left;}

  .page a {margin: 0 2px;}

  #sitemap{display:none;}
  .fot_logo .fot_logo_img{width: 74px; height: 48px; background-size: 71px auto;}
  .fot_txtarea {margin-top: 15px;}
  .con_number .con01 {height: auto;}

  .main_btn a {height: 36px; line-height: 36px; width: 154px; margin-top: 20px;}
  .main_btn2 a {height: 36px; line-height: 36px; width: 154px; margin-top: 20px;}
  #contact_us {padding: 40px 0}

  .platform>div .platform_1 .platform_arrow {bottom: 15px; right: 15px; width: 22px; height: 12px;}
  .platform>div .platform_2 .platform_arrow {bottom: 15px; right: 15px; width: 22px; height: 12px;}

  .slider_wrap .slide_prev {width: 10px; height: 5px;}
  .slider_wrap .slide_next {width: 10px; height: 5px;}
  .paging span {margin-left: 20px;margin-top: 2px;}
  .btn_main_visual_play {margin-left: 85px;}
  .core_item .core_item_icon {margin-bottom: 15px; width: 40px; height: 40px;}

  #full_menu {top: 50px; height: calc(100% - 50px); padding-top: 40px;}
  .full_menu {flex-direction: column;}
  .full_menu > div {width: 100%; flex-basis: auto; padding-right: 0; border-bottom: 1px solid #ddd; padding-bottom: 10px; padding-top:10px;}

  #full_menu .dept01{padding-top:10px; padding-bottom:10px; margin-bottom:0;}
  #full_menu .dept01.active:before{content: ''; position: absolute; background-color: #858585; transition: 0.3s; right: 0; top: calc( 50% - 0.5px ); width: 15px; height: 1px;}
  #full_menu .dept01.active:after{transform: rotate(-90deg);}
  #full_menu .dept01:before{content: ''; position: absolute; background-color: #858585; transition: 0.3s; right: 0; top: calc( 50% - 0.5px ); width: 15px; height: 1px;}
  #full_menu .dept01:after{content: ''; position: absolute; background-color: #858585; transition: 0.3s; right: 7px; top: calc( 50% - 7.5px ); width: 1px; height: 15px;}
  #header.sitemap_header .side .contact_btn{display:block;}
  #header.sitemap_header .side{width: 190px;}

  .quick-menu {width: 45px; right: 15px;}
  .quick-menu a {margin: 5px 0 0;}
  .quick-menu a img {width: 100%;}


  /*서브페이지*/
  .sub-visual{height: 235px;}
  #sub-dept {display:none;}
  #sub-dept-mo {display:block;}

  /*서브페이지 Company*/
  .message .img-container .message_key{padding: 40px 130px 30px 30px;}
  .message .img-container .message_key h4::before {top: 18px; height: 11px; width: 14px;}
  .message >div .message_sign {margin-top: 40px;}
  .message >div .message_sign img {width: 80px; height: 100%;}
  .history-wrapper .year {min-width: 130px;}
  .history-wrapper .list {padding-left: 20px; padding-top: 0px;}
  .history-wrapper .list .info:before {left: -10px; top: 21px; width: 4px; height: 4px;}
  .panel.is-show {margin-top: 40px;}
  .panel {margin-top: 40px;}
  .tab {padding: 0 5px; height: 40px;}
  .img-container-mo{display:block;}
  .img-container-pc{display:none;}
  .ctf .ctf_list {flex-basis: 48%;}
  .client_container .client_wrap .client .client_list {flex-basis: 48%;}
  .info_icon {width: 45px; height: 45px;}
  .info_txt {padding-left: 10px;}
  .map_info {margin-top: 20px;}
  .talent_ps_mo{display:block; height: 100%;}
  .talent_ps_pc{display:none;}
  .client_container .client_wrap .client_tit {padding: 10px 10px; padding-top: 0;}
  .history-wrapper .list:after {left: -25px; top: 20px; width: 20px; height: 20px;}
  .history-wrapper .list:before {top: 28px;}
  .history-wrapper .list {width: 70%;}
  .history-wrapper .year .year_gra {width: 90px; margin-top: 4px;}
  .history-wrapper .year .year_gra img {width: 100%;}
  .history-wrapper .year {min-width: 120px;}

  .company_info .com_info_list{padding-top:12px; padding-bottom:12px;}
  .company_info .com_info_list:before{width: 110px;}
  .company_info .com_info_list .info_tit{width: 110px;}
  .company_info .com_info_list .info_txt{width: calc( 100% - 110px ); padding-left:15px;}



  /*서브페이지 ict 융합*/
  .ict_pf_pc{display:none;}
  .ict_pf_mo{display:block;}

  /*서브페이지 solution*/
  .solu_item {height: 70px; padding: 15px;}
  .solu_design>div>div{flex-basis: 100%; margin-right:0; margin-bottom:15px;}
  .solu_design>div>div:last-child{margin-bottom:0px;}
  .solu_design>div.img_3row>div{flex-basis: 100%; margin-right:0; margin-bottom:15px;}
  .solu_design>div.img_3row>div:last-child{margin-bottom:0px;}
  .solu_list .solu_txt {padding: 20px;}
  .solu_tit h4 {margin-bottom: 15px;}
  .solu_etc h6:before {top: 5px; width: 15px; height: 12px;}
  .solu_etc h6 {padding-left: 25px;}
  .solu_item2 {flex-basis: 100%; padding: 20px;}
  .solu_item2 .solu_icon {width: 40px; height: 40px; margin-bottom: 10px;}
  .solu-wrapper span {margin-bottom: 40px;}
  .solu_item .solu_icon{margin-left:0;}
  .solu_item p{margin-right:0;}

  /*서브페이지 helpdesk*/
  .process_img_mo{display:block;}
  .process_img_pc{display:none;}
  .helpdesk_container .helpdesk_wrap .helpdesk_tit {padding: 10px 0px}
  .helpdesk_container .helpdesk_wrap span {margin-top: 15px;}

  .helpdesk_container .helpdesk_wrap{margin-bottom:0;}

  /*서브페이지 notice*/
  .notice_view .notice_cont img{width: 100%;}
  .prevnext a .type {flex-basis: 90px;}
  .prevnext a .title {flex-basis: calc(100% - 90px);}
  .notice_view .notice_head {padding: 15px 15px;}
  .notice_view .notice_cont {padding: 15px 15px}
  .prevnext a {padding: 11px 20px;}
  .notice_view .notice_head .notice_info .date {padding-right: 8px;}
  .notice_view .notice_head .notice_info .view {padding-left: 8px;}
}


@media (max-width:450px){
  .newsroom .row h7 {padding: 15px 20px;}
  .side .contact_btn a {padding: 8px 14px;}
  #header.sitemap_header .side {width: 130px;}

  .notice .notice_list .notice_date {text-align: left;}

  .page a {margin: 0 2px;}

  /*서브페이지 Company*/
  .message .img-container .message_key{left: 15px; bottom: -60px; padding: 30px 60px 20px 20px;}
  .tab {padding: 0 5px;}
  .history-wrapper {padding: 0px;}
  .history-wrapper .list {padding-left: 20px;}
  .history-wrapper .list {width: 55%;}

}

@media (max-width:320px){
  .slider_list .list_1 span {width: 57%;}

  .notice .notice_list .notice_date {text-align: left;}

  .page a {margin: 0 2px;}

  /*서브페이지 Company*/
  .message .img-container .message_key{padding: 20px 50px 15px 15px;}
  .message .img-container .message_key h4::before {top: 11px; height: 8px; width: 13px;}
  .tab-group{display:none;}
  .history-wrapper .year {min-width: 90px;}
  .history-wrapper .list {padding-left: 10px;}
  .history-wrapper .list .info:before {top: 20px;}
  .panel.is-show {margin-top: 20px;}
  .history-wrapper .list {width: 50%;}
  .history-wrapper .year .year_gra {width: 70px; margin-top: 9px;}
  .history-wrapper .list:after { left: -21px; top: 22px; width: 15px; height: 15px;}

}