@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);
@charset "utf-8";*/
/* Noto Sans KR IE */
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 100; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype'); 
} 
@font-face 
{ 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 300; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype'); 
} 

@font-face 
{ 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 400; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype'); 
 } 

@font-face 
{ 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 500; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype'); 
 } 

@font-face
{ 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 700; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype'); 
} 

@font-face 
{ 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 900; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype'); 
} 
 

html, body
{
	font-family: 'Noto Sans KR', sans-serif !important; 

	/*overflow-x: auto;*/
	/*cursor: none;*/
}


body
{
	position: relative;
}

.width_12{width: 100%;}


/*.cursor {
  position: absolute;
  background-color: #fff;
  width: 10px;
  height: 10px;
  border-radius: 100%;
  z-index: 10000;
  user-select: none;
  pointer-events: none;
  transform: scale(1);
  transition: 0.6s ease-in-out transform, 0.2s ease-in-out opacity;
}
.cursor.active {
  opacity: 0.5;
  transform: scale(0);
}
.cursor.hovered {
  opacity: 0.08;
}

.cursor-follower {
  position: absolute;
  background-color: rgba(255, 255, 255, 0.3);
  width: 25px;
  height: 25px;
  border-radius: 100%;
  z-index: 10000;
  transform: translate(5px, 5px);
  user-select: none;
  pointer-events: none;
  transition: 0.6s ease-in-out transform, 0.2s ease-in-out opacity;
}
.cursor-follower.active {
  opacity: 0.7;
  transform: scale(3);
}
.cursor-follower.hovered {
  opacity: 0.08;
}*/



/************************nav 시작**********************/
/*****************************************************/
/*햄버거 버튼*/
input[id^='hamberger']
{
  display:none;
}

input[id^='hamberger'] + label 
{
  display: block;
  z-index: 5;
  position: absolute;
  top: 73px;
  left: 102px;
  width: 58px;
  height: 34px;
  transition: all 500ms;
}

input[id^='hamberger'] + label:before
{
  content: '';
  background:#d40911;
  width:100%;
  height:4px;
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  -webkit-transition: 300ms;
  transition: 300ms;
  border-radius:10px;
  -webkit-transition-delay: 0ms;
  transition-delay: 0ms;
}

input[id^='hamberger'] + label:after
{
  content: '';
  background:#d40911;
  width:100%;
  height:4px;
  position: absolute;
  bottom:0%;
  transform: translateY(-50%);
  -webkit-transition: 300ms;
  transition: 300ms;
  border-radius:10px;
}


input[id^='hamberger'] + label > span 
{
  display:block;
  position:absolute;
  width:100%;
  height:4px;
  border-radius:10px;
  background:#d40911;
  -webkit-transition: 300ms;
  transition: 300ms;
}

input[id^='hamberger'] + label:before,
input[id^='hamberger'] + label:after,
input[id^='hamberger'] + label > span 
{

  -webkit-transition: 500ms;
    transition: 500ms;
    -webkit-transition-timing-function: cubic-bezier(0.68, -0.55, 0.27, 1.55);
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.27, 1.55);
}



input[id^='hamberger']:checked + label 
{
  z-index:2;
  height:44px;
}

input[id^='hamberger']:checked + label:before
{
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition-delay: 0ms;
    transition-delay: 0ms;
   /* width: 0%;*/
}

input[id^='hamberger']:checked + label > span
{
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: left center;
    -ms-transform-origin: left center;
    transform-origin: left center;
}

input[id^='hamberger']:checked + label:after
{
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: left center;
    -ms-transform-origin: left center;
    transform-origin: left center;
}




/*nav 끝*/




/************************main top banner**********************/
/*************************************************************/
.banner_wrapper.main 
{
  
  height: 1076px;
  background:url('../img/main_bnr.jpg') no-repeat;
  position: relative;
}

.logo_area
{
  position: absolute;
  left:50%;
  top:63px;
  transform: translateX(-50%);

}

.logo_area a
{
  height:0;
  max-height:20px;
  padding-top: 47px;
  overflow: hidden;
  width: 227px;
  background: url(../img/mainbnr_logo.png) no-repeat;
  background-size: 100%; 
  display: block;
}

/*.txt-wrapper
{
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
}*/

.txt-wrapper
{
  /*position: relative;*/
  color:#fff;
}

.txt-wrapper p.title
{
  position: absolute;
    top: 225px;
    left: 50%;
    transform: translateX(-50%);
    width: 525px;
}

.txt-wrapper p.title span
{
  font-size: 59px;
  font-weight: 600;
  -ms-animation: letter-glow 2s 0s ease both;
  -webkit-animation: letter-glow 3s 0s ease both;
    animation: letter-glow 2s 0s ease both;
}

.txt-wrapper p.title span:nth-child(6) ~ span
{
  font-size: 25px;
}

.txt-wrapper p span:nth-child(1)
{
  -ms-animation-delay: 0.3s;
  -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s;
}

.txt-wrapper p span:nth-child(2)
{
  -ms-animation-delay: 0.4s;
  -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
    margin-left: 11px;
}

.txt-wrapper p span:nth-child(3)
{
  -ms-animation-delay: 0.5s;
  -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    margin-left: 11px;
}

.txt-wrapper p span:nth-child(4)
{
  -ms-animation-delay: 0.6s;
  -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
    margin-left: 11px;
}

.txt-wrapper p span:nth-child(5)
{
  -ms-animation-delay: 0.7s;
  -webkit-animation-delay: 0.7s;
    animation-delay: 0.7s;
    margin-left: 11px;
}

.txt-wrapper p span:nth-child(6)
{
  -ms-animation-delay: 0.8s;
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
  margin-left: 11px;
}

.txt-wrapper p span:nth-child(7)
{
  -ms-animation-delay: 0.9s;
  -webkit-animation-delay: 0.9s;
  animation-delay: 0.9s;
  margin-left: 6px;
}

.txt-wrapper p span:nth-child(8)
{
  -ms-animation-delay: 1s;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

.txt-wrapper p span:nth-child(9)
{
  -ms-animation-delay: 1.1s;
  -webkit-animation-delay: 1.1s;
  animation-delay: 1.1s;
}

.txt-wrapper p span:nth-child(10)
{
  -ms-animation-delay: 1.2s;
  -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s;
}

.txt-wrapper p span:nth-child(11)
{
  -ms-animation-delay:1.3s;
  -webkit-animation-delay: 1.3s;
    animation-delay:1.3s;
}

.txt-wrapper p span:nth-child(12)
{
  -ms-animation-delay: 1.4s;
  -webkit-animation-delay: 1.4s;
    animation-delay: 1.4s;
    margin-left: 10px;
}

.txt-wrapper p span:nth-child(13)
{
  -ms-animation-delay: 1.5s;
  -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s;
}

.txt-wrapper p span:nth-child(14)
{
  -ms-animation-delay: 1.6s;
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s;
}

.txt-wrapper p span:nth-child(15)
{
  -ms-animation-delay: 1.7s;
  -webkit-animation-delay: 1.7s;
    animation-delay: 1.7s;
}

.txt-wrapper p span:nth-child(16)
{
  -ms-animation-delay: 1.8s;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}


@-ms-keyframes letter-glow {
  0% {
    opacity: 0;
    
  }
  66% {
    opacity:1;
    
  }
  77% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    
  }
}
@-webkit-keyframes letter-glow {
  0% {
    opacity: 0;
    
  }
  66% {
    opacity:1;
    
  }
  77% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    
  }
}


.col_sec1
{
  -ms-animation: fadeIn 1.5s ease both 2s;
  -webkit-animation: fadeIn 1.5s ease both 2s;
  -moz-animation: fadeIn 1.5s ease both 2s; /* Mozilla */
  -o-animation: fadeIn 1.5s ease both 2s; /* Opera */
  animation: fadeIn 1.5s ease both 2s;
}

.col_sec2
{
  -ms-animation: fadeIn 1.5s ease both 3s;
  -webkit-animation: fadeIn 1.5s ease both 3s;
    animation: fadeIn 1.5s ease both 3s;
}

.col_sec3
{
  -ms-animation: fadeIn 1.5s ease both 4s;
  -webkit-animation: fadeIn 1.5s ease both 4s;
    animation: fadeIn 1.5s ease both 4s;
}

.row-sec1
{
  -ms-animation: fadeIn 1.5s ease both 5s;
  -webkit-animation: fadeIn 1.5s ease both 5s;
    animation: fadeIn 1.5s ease both 5s;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}


@-ms-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}
.txt-wrapper p[class*='col_text']
{
  display:block;
}

.txt-wrapper .col_txt1
{
  position:absolute;
  top: 305px;
  left: 36%;
  font-size: 21px;
  font-weight: 200;
  width:900px;
}

.txt-wrapper .col_txt2
{
  position:absolute;
  top: 330px;
  right: 52%;
  font-size: 27px;
  font-weight: 400;
  text-align:right;
}

.txt-wrapper .col_txt3
{
  position:absolute;
  top: 333px;
  left: 50.2%;
  font-size: 21px;
  font-weight: 200;
  width:580px;
}

.txt-wrapper .col_txt4
{
  position: absolute;
    top: 362px;
    left: 52.5%;
    font-size: 21px;
    font-weight: 200;
    width:280px;
}

.txt-wrapper .col_txt5
{
  position: absolute;
    top: 425px;
    right: 52%;
    font-size: 27px;
    font-weight: 400;
    line-height: 27px;
}


.txt-wrapper .col_txt5-1
{
  position: absolute;
    top: 425px;
    right: 52%;
    font-size: 27px;
    font-weight: 400;
    line-height: 27px;
    text-align:right;
}

.txt-wrapper .col_txt5-2
{
  position: absolute;
    top: 455px;
    right: 52.5%;
    font-size: 21px;
  font-weight: 300;
  width:450px;
  text-align: right;
}

.txt-wrapper .col_txt5-3
{
  position: absolute;
    top: 486px;
    right: 52.5%;
    font-size: 21px;
  font-weight: 200;
  width:650px;
  text-align: right;
}

.txt-wrapper .col_txt6
{
  position:absolute;
  top:419px;
  left: 52.5%;
  font-size: 27px;
  font-weight: 400;
}

.txt-wrapper .col_txt6 p.m
{
  font-size: 23px;
  font-weight: 300;
  margin-top: 9px;
}

.txt-wrapper .col_txt6 p.s
{
  font-size: 20px;
  font-weight: 200;
  width:540px;
}

.txt-wrapper .col_txt7
{
  position: absolute;
    top: 550px;
    right: 52%;
    text-align: right;
    font-size: 27px;
    font-weight: 400;
    line-height: 27px;
}


.txt-wrapper .col_txt8
{
  position:absolute;
  top:559px;
  left: 52.5%;
  font-size: 20px;
  font-weight: 400;
}

.txt-wrapper .row_txt1
{
  position: absolute;
    top: 489px;
    right: 50.8%;
    transform: translateX(50%) rotate(90deg);
    font-size: 29px;
    font-weight: 600;
    width:340px;
    letter-spacing: 2px;
}

.txt-wrapper .row_txt2
{
  position: absolute;
    top: 536px;
    left: 51.2%;
    transform: translateX(-50%) rotate(90deg);
    -webkit-transform: translateX(-50%) rotate(90deg); /* WebKit */
  -moz-transform:  translateX(-50%) rotate(90deg); /* Mozilla */
  -o-transform:  translateX(-50%) rotate(90deg); /* Opera */
  -ms-transform:  translateX(-50%) rotate(90deg); /* Internet Explorer */
    font-size: 31px;
    font-weight: 300;
    width:385px;
    letter-spacing: 3px;
}





@media (max-width:1250px) 
{
  .txt-wrapper .col_txt1
  {
        left: 28%;
  }

  .txt-wrapper .col_txt2
  {
    right: 53%;
  }

  .txt-wrapper .col_txt3
  {
    left: 51.2%
  }

  .txt-wrapper .col_txt4
  {
    left: 54.5%
  }

  .txt-wrapper .col_txt5-1
  {
    right: 53%;
  }

  .txt-wrapper .col_txt5-2
  {
    right: 53%;
  }

  .txt-wrapper .col_txt5-3
  {
    right: 53%;
  }

  .txt-wrapper .col_txt6
  {
    left: 54.5%;
  }

  .txt-wrapper .col_txt7
  {
    right: 53%;
  }

  .txt-wrapper .col_txt8
  {
    left: 54.5%;
  }

  .txt-wrapper .row_txt2
  {
    left:52.2%;
  }
}





/************************scroll 따라다니는 box*********************/
/*****************************************************************/

.maincontent .f-scroll
{

	position: absolute;
	top: 366px;
	right: 0;
	background-color: #2b2b2b;
	z-index: 100;
	width: 112px;
  height: 117px;
	font-size: 16px;
	font-weight: 500;
	text-align: center;
	color:#fff;
}

.maincontent .f-scroll > ul > li
{
  padding: 10px 0;
  border-bottom: 1px solid #383737;
  letter-spacing: 1.2px;
}

.maincontent .f-scroll > ul > li:last-child
{
  font-size: 12px;
}


.maincontent .f-scroll > ul > li > a
{
	color:#fff;
	display: block;
	font-size: 12px;
	font-weight:400;
}

.maincontent .f-scroll > ul > li:hover > a
{
	color: #d3203f;
  /*color:#fff;*/
	font-weight:900;
  font-size:12px;
}

.maincontent .f-scroll > ul > li:focus > a
{
  color: #d3203f;
  /*color:#fff;*/
  font-weight:900;
  font-size:12px;
}

/*****************************divider*****************************/
/*****************************************************************/
/*빨간 줄 divider*/
.divider_op1  
{
  width: 100%;
  height: 45px;
  background-color: #d32140;
}

.divider_op1 > div
{
  text-align:center;
  line-height: 45px;
  vertical-align: middle;
  color:#fff;
  font-size: 13.3px;
  letter-spacing: 3px;
  font-weight: 600;
}


.divider_op2  
{
  width: 100%;
  height: 4px;
  background-color: #d32140;
}





/***********************company top banner ***********************/
/********************************************************/

.banner_wrapper.common 
{
  width:100%;
 /* background:url('../img/directions_top_banner.jpg') no-repeat;*/
  position: relative;
  /*background-size: 100% 100%;*/
    background: #eee;
}



.common.company .fade.slider .bg1
{
 background:url('../img/comp_topbanner01.jpg') no-repeat center;
 height: 936px;
 background-size: cover;
 -webkit-transform: scale(1.05) rotate(0.01deg);
 -ms-transform: scale(1.05) rotate(0.01deg);
 transform: scale(1.05) rotate(0.01deg);
 -webkit-transition: -webkit-transform 3s  ease-in ;
 transition: -webkit-transform 3s  ease-in ;
 transition: transform 3s   ease-in ;
 transition: transform 3s   ease-in , -webkit-transform 3s ease-in ;
 min-width: 1250px;
}

.common.company .fade.slider .bg2
{
 background:url('../img/comp_topbanner02.jpg') no-repeat center;
 height: 936px;
 background-size: cover;
 -webkit-transform: scale(1.05) rotate(0.01deg);
 -ms-transform: scale(1.05) rotate(0.01deg);
 transform: scale(1.05) rotate(0.01deg);
 -webkit-transition: -webkit-transform 4s ease-in 2s;
 transition: -webkit-transform 4s ease-in 2s;
 transition: transform 4s  ease-in 2s;
 transition: transform 4s  ease-in 2s, -webkit-transform 4s ease-in 2s;
 min-width: 1250px;
}

.common.company .fade.slider .bg3
{
 background:url('../img/comp_topbanner03.jpg') no-repeat center;
 height: 936px;
 background-size: cover;
 -webkit-transform: scale(1.05) rotate(0.01deg);
 -ms-transform: scale(1.05) rotate(0.01deg);
 transform: scale(1.05) rotate(0.01deg);
 -webkit-transition: -webkit-transform 4s ease-in 2s;
 transition: -webkit-transform 4s ease-in 2s;
 transition: transform 4s  ease-in 2s;
 transition: transform 4s  ease-in 2s, -webkit-transform 4s ease-in 2s;
 min-width:1250px;
}

.common .fade.slider .bg1.on
{
  -webkit-transform: scale(1) rotate(0deg);
  -ms-transform: scale(1) rotate(0deg);
  transform: scale(1) rotate(0deg);
}

.common .fade.slider .slick-slide.slick-current.slick-active .bg2,
.common .fade.slider .slick-slide.slick-current.slick-active .bg3

{
  -webkit-transform: scale(1) rotate(0deg);
  -ms-transform: scale(1) rotate(0deg);
  transform: scale(1) rotate(0deg);
}


/*top banner slide txt txt*/
.common .fade.slider .for_position
{
  position: relative;
}
.common .fade.slider .txt_wrapper
{
  position: absolute;
  top:50%;
  left: 50%;
  transform: translate(-50%, -50% );
  text-align: center;
  width:585px;
  opacity:1;
}

.common.company .fade.slider .txt_wrapper
{
  position: absolute;
  top:50%;
  left: 50%;
  transform: translate(-50%, -50% );
  text-align: center;
  width:585px;
  opacity:1;
}



/*.common .fade.slider .txt_wrapper.txt02 > div
{
  width: 461px;
  margin:0 auto;
}

.common .fade.slider .txt_wrapper.txt03 > div
{
  width: 508px;
  margin:0 auto;
}*/

.common .fade.slider .txt_wrapper p
{
  opacity: 0;
}

.common .fade.slider .slick-slide.slick-current.slick-active .txt_wrapper p
{
  
  opacity: 0;
  animation:  fadeInUp 2s 1s;
  -ms-animation:  fadeInUp 2s 1s;
  -webkit-animation:  fadeInUp 2s 1s;
  -moz-animation:  fadeInUp 2s 1s; 
  -o-animation:  fadeInUp 2s 1s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}


@keyframes fadeInUp
{
  from 
  {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to 
  {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInUp {
  from 
  {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to 
  {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-ms-keyframes fadeIn {
  from 
  {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to 
  {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}









.banner_wrapper.common .slick-prev, 
.banner_wrapper.common .slick-next
{

  display: none !important;
}

.autoplay.slider .slick-dots
{
  bottom:200px;
}

.banner_wrapper.common .txt_wrapper .title
{
  font-family: Noto Sans KR;
  font-weight: 400;
  font-size: 56px;
  color:#2c2c2c;
  letter-spacing: -1px;
  margin-bottom: 15px;
  line-height: 56px;
}

.banner_wrapper.common .txt_wrapper .title  span
{
  font-weight: 800;
  color:#2c2c2c;
  margin-left: 18px;
}

.banner_wrapper.common .txt_wrapper .des_txt
{
  font-size: 18.67px;
  font-weight: 300;
  color:#444;
}




.banner_wrapper.company .txt_wrapper.txt01 .title
{
  font-family: Noto Sans KR;
  font-weight: 400;
  font-size: 56px;
  color:#fff;
  letter-spacing: -1px;
  
}

.banner_wrapper.company .txt_wrapper.txt01 .title  span
{
  font-weight: 800;
  color:#fff;
  margin-left: 18px;
}

.banner_wrapper.company .txt_wrapper.txt01 .des_txt
{
  font-size: 18.67px;
  font-weight: 300;
  color:#fff;
}


/*scroll animation part*/

.banner_wrapper.common .scroll-wrapper
{
  position: absolute;
  bottom: 4%;
  left: 50.1%;
  transform: translateX(-50%);
  animation: scrollani 1s ease-in-out infinite;
  -ms-animation: scrollani 1s ease-in-out infinite;
  -webkit-animation: scrollani 1s ease-in-out infinite;
  -moz-animation: scrollani 1s ease-in-out infinite; /* Mozilla */
  -o-animation: scrollani 1s ease-in-out infinite; 

}

@keyframes scrollani 
{
    0% {bottom: 4%;}
    25%{bottom: 4.2%;}
    50%{bottom: 4.5%; }
    100% {bottom:4%;}
}


.banner_wrapper.common .scroll-wrapper p
{
  color:#d32140;
  font-size: 10px;
  letter-spacing: 2px;
  font-weight: bold;
}



.banner:before
{
  content: '';
  width: 1px;
  height: 27px;
  position: absolute;
  bottom:57px;
  left: 50%;
  transform: translateX(-50%);
  background-color: #d32140;
  z-index: 10;
}
.fp-enabled .banner:before{width: 0;height: 0;}
.banner_01:before{
    content: '';
  width: 1px;
  height: 27px;
  position: absolute;
  bottom:45px;
  left: 50%;
  transform: translateX(-50%);
  background-color: #d32140;
  z-index: 10;
}

/*content*/
.content
{
  position: relative;
  width: 100%;
  padding-top: 56px;
}


.content.introduction
{
  background: url(../img/directions_content_bg01.jpg) no-repeat;
  width: 100%;
  background-size: 100% 100%;
  background-position-y: -5px;
}

.content.organization
{
  background: url(../img/directions_content_bg03.jpg) no-repeat center;
  width: 100%;
  height: auto;
  background-size: cover;
  background-position-y: -11px;
  overflow: hidden;
}


.content.directions
{
  background: url(../img/directions_content_bg03.jpg) no-repeat center;
  width: 100%;
  height: auto;
  background-size: cover;
  background-position-y: -7px;
}

/*tab menu*/

.content .tab_menu
{
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  border-bottom: 1px solid #e5e5e5;
  z-index: 2;
  background-color: #fff;
}

.content .tab_menu.fixed
{
  position: fixed;
  top:0;
  left: 0;
  width: 100%;
  z-index: 100;
}


.content .tab_menu ul
{
  max-width: 1208px;
  margin:0 auto;
width: 80%;
}

.content .tab_menu ul li
{
  display: inline-block;
  width:25%;
  height: 50px;
  vertical-align: middle;
  line-height: 50px;
  position: relative;
  box-sizing: border-box;
  transition: all 1s ease; 
}

.content .tab_menu ul li:hover
{
  background-color: #d32140;
}


.content .tab_menu ul li.clicked
{
  background-color: #d32140;
}

.content .tab_menu ul li.clicked a
{
  color:#fff;
  font-weight:600;
}

.content .tab_menu ul li:hover a
{
  color:#fff;
  font-weight: 600;
}

.content .tab_menu ul > li:before
{
  content:'';
  position: absolute;
  width: 1px;
  height: 50px;
  background-color: #e5e5e5;
  top:0px;
  left: 0px;
}

.content .tab_menu ul li.clicked:before
{
  background-color:#d32140;
}

.content .tab_menu ul li:hover:before
{
  background-color:#d32140;
}

.content .tab_menu ul > li:last-child:after
{
  content:'';
  position: absolute;
  width: 1px;
  height: 50px;
  background-color: #e5e5e5;
  top:0px;
  right: 0px;
}

.content .tab_menu ul li a
{
  font-size: 16px;
  color: #444;
  font-weight: 400;
  display: block;
  padding-left: 31px;
}

/**/
.content_wrapper
{
  width: 80%;
  margin:0 auto;
  padding-top: 137px;
  padding-bottom: 150px;
    max-width: 1208px;
}

.content_wrapper h1
{
  font-size: 39px;
  padding-left: 26px;
  font-family: 'Noto Sans KR';
  position: relative;
  margin-bottom: 24px;
  line-height: 30px;
}

.content_wrapper h1:before
{
  content:'';
  position: absolute;
  top:55%;
  transform: translateY(-50%);
  left: 0;
  width: 7px;
  height: 35px;
  background-color: #d32140;
}

.content_wrapper h1:after
{
  content:'';
  position: absolute;
  bottom:-26px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #444;
  z-index: 1;
}

.info_wrapper
{
  border-bottom: 1px solid #444444;
}

.info_wrapper dl 
{
  padding:31px 0 31px;
  width: 984px;
  margin: 0 auto;
}

.info_wrapper dl dt
{
  display: inline-block;
  color: #d32140;
  font-size: 21.33px;
  font-weight: 900;
  vertical-align: middle;
  padding-right: 30px;
}

.info_wrapper dl dd
{
  display: inline-block;
  font-weight: 500;
  font-size: 18.67px;
  color:#323232;
  vertical-align: middle;
  padding-right: 149px;
}

.info_wrapper dl dd:last-child
{
  padding-right: 0;
}

/***********map 오버레이*******************/
#map .wrap 
{
  position: absolute;
  left: -7px;
  bottom: 40px;
  width: 309px;
  height: 121px;
  margin-left: -144px;
  text-align: left; 
  font-size: 12px;
}

#map .wrap * 
{
  padding: 0;
  margin: 0;
}

#map .wrap .info 
{
  width: 286px;
  height: 120px; 
  border-bottom: 2px solid #ccc; 
  border-right: 1px solid #ccc; 
  overflow: hidden; background: #fff;
  padding:15px;
}

#map .wrap .info:nth-child(1) 
{
  width: 309px;
  height: 110px; 
  border: 0;
  box-shadow: 0px 1px 2px #888;
}

#map .info .title 
{
  padding: 5px 0 0 10px;
  height: 30px;
  background: #eee;
  border-bottom: 1px solid #ddd;
  font-size: 18px;
  font-weight: bold;
}

#map .info .close 
{
  position: absolute;
  top: 10px;
  right: 10px;
  color: #888;
  width: 17px;
  height: 17px;
  background: url('http://t1.daumcdn.net/localimg/localimages/07/mapapidoc/overlay_close.png');
}

#map .info .close:hover 
{
  cursor: pointer;
}

#map .info .body 
{
  position: relative;
  overflow: hidden;
  height: 100%;
}

#map .info .desc 
{
  position: relative; 
  height: 75px;
}

#map .info .desc a
{
  margin-top: 2px;
  display: block;
}

#map .desc .ellipsis 
{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; 
  font-size:18px; 
  font-weight:500;
  font-family: 'Noto Sans KR', sans-serif !important;
}

#map .desc .ellipsis.add
{
  margin-bottom: 5px;
} 

#map .jibun.ellipsis p
{
  display: inline-block;
}

#map .desc .jibun 
{
  font-size: 11px;
  color: #423f3f;
  margin-top: -2px;
  font-weight: 100;
  padding-bottom: 11px;
  border-bottom:1px solid #f7f7f7;
}

#map .desc a
{
  color:#d32140 !important;
}

#map .desc .jibun .deco_box
{
  border:1px solid #ccc;
  padding:0 3px;
} 

#map .info:after 
{
  content: '';
  position: absolute;
  margin-left: -12px;
  left: 50%;
  bottom: 0;
  width: 22px;
  height: 12px;
  background: url('http://t1.daumcdn.net/localimg/localimages/07/mapapidoc/vertex_white.png')
}

#map .info .link {color: #5085BB;}

/**/
/*#map .wrap
{
  width:309px;
  height:91px;
  background-color: #fff;
  border:2px solid #444;
  padding:15px;
  position: relative;
  display: block;
}

#map .wrap:after
{
  content:'';
  position: absolute;
  bottom:0;
  left: 50%;
  transform: translateX(-50%);

}

#map .wrap.closed
{
  display: none;
}

#map .wrap .close
{
  position: absolute;
  top: 10px;
  right: 10px;
  color: #888;
  width: 17px;
  height: 17px;
  background: url(http://t1.daumcdn.net/localimg/localimages/07/mapapidoc/overlay_close.png);
}

#map .wrap .add_info
{
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 5px;
}

#map .deco_box
{

}

#map .wrap dt
{
  display: inline-block;
  color: #ccc;
  font-weight:100;
  border:1px solid #ccc;
  padding: 0 3px; 
}

#map .wrap dd
{
  display: inline-block;
}*/

/***********************introduction***********************/
/********************************************************/
.content.company .tab_menu ul li
{
  width: 16.566666%;
  letter-spacing: 1px;
    float: left;
}



.content_wrapper.introduction h1
{
  margin-bottom: 22px;
}

.content_wrapper.introduction h1:after
{
  height: 0;
  width:0;
  background-color: transparent;
}


.content_wrapper.introduction .img_wrapper
{
  width:407px;
  height: 518px;
  margin-right: 10px;
  display: inline-block;
}

.content_wrapper.introduction .img_wrapper img
{
  width: 100%;
  height: 100%;
}

.content_wrapper.introduction .comp_motto
{
  width:calc(100% - 417px);
  width:-webkit-calc(100% - 417px);
  width:-moz-calc(100% - 417px);
  width:-ms-calc(100% - 417px);
  display: inline-block;
  vertical-align: top;
}

.content_wrapper.introduction .comp_motto ul
{
  font-size: 0;
}

.content_wrapper.introduction .comp_motto li
{
  width:calc(50% - 5.5px);
  width:-webkit-calc(50% - 5.5px);
  width:-moz-calc(50% - 5.5px);
  width:-ms-calc(50% - 5.5px);
  font-size: 12px;
  display: inline-block;
  text-align: center;
  margin-bottom: 10px;
  padding:44px 0 37px;
  box-sizing: border-box;
  height:254px;
  border:1px solid #d32140;
  vertical-align: top;
  position: relative;
  background-color:#fff;
}

.content_wrapper.introduction .comp_motto li:first-child:hover
{
  background:url(../img/introduction_when_hover.jpg) no-repeat;
  background-size: 100% 100%;
}

.content_wrapper.introduction .comp_motto li:nth-child(2):hover
{
  background:url(../img/introduction_when_hover02.jpg) no-repeat;
  background-size: 100% 100%;
}

.content_wrapper.introduction .comp_motto li:nth-child(3):hover
{
  background:url(../img/introduction_when_hover03.jpg) no-repeat;
  background-size: 100% 100%;
}
.content_wrapper.introduction .comp_motto li:last-child:hover
{
  background:url(../img/introduction_when_hover04.jpg) no-repeat;
  background-size: 100% 100%;
}

.content_wrapper.introduction .comp_motto li:before
{
  content:'';
  position:absolute;
  left: 0;
  top:0;
  width: 6px;
  height: 33px;
  background-color: #d32140;
}


.content_wrapper.introduction .comp_motto li:nth-child(1),
.content_wrapper.introduction .comp_motto li:nth-child(3)
{
  margin-right: 10px;
}



.content_wrapper.introduction .comp_motto li:nth-child(3),
.content_wrapper.introduction .comp_motto li:nth-child(4)
{
  margin-bottom: 0;
}


.content_wrapper.introduction .comp_motto .icon_img_area
{
  margin-bottom: 15px;
  height: 62px;
}

.content_wrapper.introduction .comp_motto .icon_img_area img
{
  height: 100%;
}

.content_wrapper.introduction .comp_motto .icon_img_area.bk
{
  display: block;
}

.content_wrapper.introduction .comp_motto .icon_img_area.wh
{
  display: none;
}

.content_wrapper.introduction .comp_motto .icon_img_area.bk.hover
{
  display: none;
}

.content_wrapper.introduction .comp_motto .icon_img_area.wh.hover
{
  display: block;
}

.content_wrapper.introduction .comp_motto .title h2
{
  font-size: 21.3px;
  font-weight: 900;
}

.content_wrapper.introduction .comp_motto li:hover .title h2
{
  color:#fff;
}

.content_wrapper.introduction .comp_motto li:hover .title p
{
  color:#fff;
}


.content_wrapper.introduction .comp_motto .title p
{
    font-size: 13.3px;
    font-weight: 400;
}

.content_wrapper.introduction .comp_motto .des_txt
{
  margin-top: 9px;
}

.content_wrapper.introduction .comp_motto .des_txt p
{
  font-size: 13.3px;
  font-weight: 300;
  line-height: 17px;

}

.content_wrapper.introduction .comp_motto li:hover .des_txt p
{
  color:#fff;
}


/*************************inquiry*************************/
/********************************************************/
.content.inquiry
{
  padding-top: 0px;
}
.banner_wrapper.inquiry
{
  background: #eee;
}

.content.inquiry .title_wrapper
{
  position: relative;
}

.content.inquiry .title_wrapper div
{
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  left: 314px;
}

.content.inquiry .title_wrapper p
{
  font-size: 16px;
  color: #d3203f;
  position: relative;
  font-weight: 500;
}

.content.inquiry .title_wrapper p:before
{
  content: '';
  position: absolute;
  top: 45%;
  transform: translateY(-50%) rotate(45deg);
  left: -16px;
  width: 7px;
  height: 1.2px;
  background-color: #d3203f;
}

.content.inquiry .title_wrapper p:after
{
  content: '';
  position: absolute;
  top: 63%;
  transform: translateY(-50%) rotate(-45deg);
  left: -16px;
  width: 7px;
  height: 1.2px;
  background-color: #d3203f;
}


/*************************comp_history*************************/
/********************************************************/

.content_wrapper.history
{
  width:1208px;
  margin:0 auto;
  padding-bottom: 253px;
}

.content.history
{
  position: relative;
  height: auto;
  background:none;
}
.content_wrapper.history h1
{
  margin-bottom: 140px;
}

.content_wrapper.history h1:after
{
  display: none;
}

.content_wrapper.history .logo_wrapper
{
  text-align: center;
}

.content_wrapper.history .logo_wrapper p
{
  font-size:21.3px;
  margin-top:25px;
  line-height: 21.3px;
}

/*history_content*/

.history_content
{
  position: relative;
  margin-top: 145px;
}

.history_content:before
{
  content:'';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  background: #dcdcdc;
  z-index: 3;
  width: 7px;
  height: 7px;
}


.history_content:after
{
  content: '';
  position: absolute;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 100%;
  background: #eeeeee;
  z-index: 2;
}

/*years box*/

.history_content .years
{
  position: absolute;
  top:0;
  left: -208px;
}

.history_content .years ul li
{
  margin-bottom: 7px;
}

.history_content .years ul li a
{
  font-size: 19px;
  font-weight: 500;
  color: #c5c5c5;
  cursor: pointer;
}

.history_content .years ul li a.clicked
{
  color: #d32140;
  font-weight: 800;
}


.history_content .dot_wrapper
{
  display: inline-block;
    position: absolute;
    top: -5px;
    left: 50%;
    transform: translateX(-50%);
    width: 15px;
    height: 15px;
    text-align: center;
    background: rgba(237, 27, 35, 0.2);
    font-size: 0;
    z-index: 4;
    vertical-align: middle;
    line-height: 15px;
    transition: all 1s;
}

.history_content .dot_wrapper .dot
{
  display: inline-block;
  vertical-align: middle;
  width: 7px;
  height: 7px;
  background: #ed1b23;
  line-height: 15px;
}

.history_content .year_box
{
  position: relative;
  overflow: hidden;
}

/*grey dot*/

.history_content .year_box .grey_dot
{
  position: absolute;
  top:50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #dcdcdc;
  z-index: 3;
  width: 7px;
  height: 7px;
}
/**/

.history_content .year_box div
{
  display: inline-block;
  width: 50%;
  position: relative;
}

.history_content .year_box .left
{
  vertical-align: top;
  padding-left: 36px;
}

.history_content .year_box .right
{
  padding-left: 83px;
}


/*left number area*/
/*left*/

.history_content .year_box .num_area
{
  width: 100%;
  height: 77px;
  position: relative;
  margin-bottom: 40px;
}


.history_content .year_box .left .num_area > span
{
  font-size: 87px;
  font-weight: 900;
  color: #aba8a8;
  position: absolute;
  top:0;
  left: -248px;
  line-height: 77px;
  transition: all 1s;
}

.history_content .year_box .left .num_area .img1
{
  font-size: 87px;
  font-weight: 900;
  color: #e5e5e5;
  position: absolute;
  bottom:0;
  left: -80px;
  transition: all 1s;
}

.history_content .year_box .left .num_area .img2
{
  font-size: 87px;
  font-weight: 900;
  color: #e5e5e5;
  position: absolute;
  bottom:0;
  left: -80px;
  transition: all 1s;
}

.history_content .year_box .left .num_area .img3
{
  font-size: 87px;
  font-weight: 900;
  color: #e5e5e5;
  position: absolute;
  bottom:0;
  left: -80px;
  transition: all 1s;
}

/*right*/
.history_content .year_box .right .num_area
{
  width: 100%;
  height: 77px;
  position: relative;
  margin-bottom: 40px;
}

.history_content .year_box .right .num_area > span
{
  font-size: 87px;
  font-weight: 900;
  color: #aba8a8;
  position: absolute;
  top:0;
  left: 550px;
  line-height: 77px;
  transition: all 1s;
}

.history_content .year_box .right .num_area .img1
{
  font-size: 87px;
  font-weight: 900;
  color: #e5e5e5;
  position: absolute;
  bottom:0;
  left: 550px;
  transition: all 1s;
}

.history_content .year_box .right .num_area .img2
{
  font-size: 87px;
  font-weight: 900;
  color: #e5e5e5;
  position: absolute;
  bottom:0;
  left: 550px;
  transition: all 1s;
}

.history_content .year_box .right .num_area .img3
{
  font-size: 87px;
  font-weight: 900;
  color: #e5e5e5;
  position: absolute;
  bottom:0;
  left: 550px;
  transition: all 1s;
}





/*left txt area*/

.history_content .year_box .txt_area
{
  width: 100%;
  box-sizing: border-box;
  position: absolute;
  left: 0;
  opacity: 0.2;
  transition: all 1s;
}

.history_content .year_box .txt_area li
{
  width: 100%;
  margin-bottom:11px;
}

.history_content .year_box .txt_area .bld_txt
{
  font-size: 16px;
  font-weight: 400;
  width:35px;
  display:inline-block;
  vertical-align: top;
  line-height: 16px;
  margin-top:3px;
}


.history_content .year_box .txt_area p
{
  display: inline-block;
  margin-left: 15px;
  color:#bbb;
  font-size:16px;
  font-weight: 400;
  width:470px;
  line-height: 20px;
}

.history_content .year_box .txt_area p.small
{
  margin-left: 50px;
  font-size: 12px;
  font-weight: 300;
  line-height: 12px;
}



.history_content .year_box .txt_area .red_txt
{
  color: #d32140;
  font-size:16px;
  font-weight: 500;
}


/*year_2022*/
.history_content .years ul li .yr2022.clicked
{
  color: #d32140;
}


.history_content .year_box.yr2022 .grey_dot
{
  /*top:67%;*/
    top: 44%;
}

.history_content .year_box.yr2022
{
  height: 436px;
  padding-top: 104px;
}
.history_content .year_box.yr2022 .left
{
  padding-top:40px;
}

.history_content .year_box.yr2022 .left .num_area span.on
{
  left: 0px;
}

.history_content .year_box.yr2022 .right img
{
  opacity:0.2;
}

.history_content .year_box.yr2022 .right img.on
{
  opacity:1;
}

.history_content .year_box.yr2022 .left .num_area img.on
{
  left: 258px;
}
.history_content .year_box.yr2022 .left .num_area .img2.on
{
  
  left: 321px;
  
}
.history_content .year_box.yr2022 .left .num_area .img3.on
{
  
  left: 384px;
  
}

.history_content .year_box.yr2022 .txt_area
{
  bottom:-68px;
}

.history_content .year_box.yr2022 .txt_area.on
{
  bottom:-160px;
  opacity: 1;
}

.history_content .dot_wrapper.yr2022
{
 
    /*top: 286px*/
    top: 184px;
}



/*year_2021*/

.history_content .years ul li .yr2021.clicked
{
  color: #d32140;
}

.history_content .year_box.yr2021
{
  height: 430px;
  padding-top: 155px;
}

.history_content .year_box.yr2021 .grey_dot
{
  top:47%;
}

.history_content .year_box.yr2021 .left img
{
  opacity:0.2;
}

.history_content .year_box.yr2021 .left img.on
{
  opacity:1;
}


.history_content .year_box.yr2021 .right .num_area > span.on
{
  left: 0px;
}

.history_content .year_box.yr2021 .right .num_area .img1.on
{
  left: 251px;
}

.history_content .year_box.yr2021 .right .num_area .img2.on
{
  
  left: 321px;
  
}
.history_content .year_box.yr2021 .right .num_area .img3.on
{
  
  left: 391px;
  
}

.history_content .year_box.yr2021 .txt_area
{
  bottom:-68px;
}


.history_content .year_box.yr2021 .txt_area.on
{
  opacity: 1;
  bottom:-170px;
}


.history_content .dot_wrapper.yr2021
{
  top:630px;
}


.history_content .year_box.yr2021 .left{padding-left: 135px}




/*year_2020*/
.history_content .years ul li .yr2020.clicked
{
  color: #d32140;
}


.history_content .year_box.yr2020 .grey_dot
{
  /*top:67%;*/
    top: 60%;
}

.history_content .year_box.yr2020
{
  height: 436px;
  padding-top: 104px;
}
.history_content .year_box.yr2020 .left
{
  padding-top:107px;
}

.history_content .year_box.yr2020 .left .num_area span.on
{
  left: 0px;
}

.history_content .year_box.yr2020 .right img
{
  opacity:0.2;
}

.history_content .year_box.yr2020 .right img.on
{
  opacity:1;
}

.history_content .year_box.yr2020 .left .num_area img.on
{
  left: 258px;
}
.history_content .year_box.yr2020 .left .num_area .img2.on
{
  
  left: 321px;
  
}

.history_content .year_box.yr2020 .txt_area
{
  bottom:-68px;
}

.history_content .year_box.yr2020 .txt_area.on
{
  bottom:-120px;
  opacity: 1;
}

.history_content .dot_wrapper.yr2020
{
 
    /*top: 286px*/
    top: 1123px;
}



/*year_2019*/

.history_content .years ul li .yr2019.clicked
{
  color: #d32140;
}




.history_content .year_box.yr2019
{
  height: 400px;
  padding-top: 104px;
}

.history_content .year_box.yr2019 .grey_dot
{
  top:37%;
}

.history_content .year_box.yr2019 .left img
{
  opacity:0.2;
}

.history_content .year_box.yr2019 .left img.on
{
  opacity:1;
}


.history_content .year_box.yr2019 .right .num_area > span.on
{
  left: 0px;
}

.history_content .year_box.yr2019 .right .num_area .img1.on
{
  left: 251px;
}

.history_content .year_box.yr2019 .right .num_area .img2.on
{
  
  left: 321px;
  
}

.history_content .year_box.yr2019 .txt_area
{
  bottom:-68px;
}


.history_content .year_box.yr2019 .txt_area.on
{
  opacity: 1;
  bottom:-120px;
}


.history_content .dot_wrapper.yr2019
{
  /*top:579px;*/
    top: 1443px;
}


.history_content .year_box.yr2019 .left{padding-left: 135px}

/*year_2018*/
.history_content .years ul li .yr2018.clicked
{
  color: #d32140;
}


.history_content .year_box.yr2018 .grey_dot
{
  top:67%;
}

.history_content .year_box.yr2018
{
  height: 376px;
  padding-top: 104px;
}
.history_content .year_box.yr2018 .left
{
  padding-top:107px;
}

.history_content .year_box.yr2018 .left .num_area span.on
{
  left: 0px;
}

.history_content .year_box.yr2018 .right img
{
  opacity:0.2;
}

.history_content .year_box.yr2018 .right img.on
{
  opacity:1;
}

.history_content .year_box.yr2018 .left .num_area img.on
{
  left: 258px;
}

.history_content .year_box.yr2018 .txt_area
{
  bottom:-100px;
}

.history_content .year_box.yr2018 .txt_area.on
{
  bottom:-68px;
  opacity: 1;
}

.history_content .dot_wrapper.yr2018
{
 /* top:245px;*/
    /*top: 1081px*/
    top: 1945px;
}


/*year_2017*/
.history_content .year_box.yr2017
{
  height: 375px;
  padding-top: 186px;
}

.history_content .year_box.yr2017 .grey_dot
{
  top:60%;
}

.history_content .year_box.yr2017 .left img
{
  opacity:0.2;
}

.history_content .year_box.yr2017 .left img.on
{
  opacity:1;
}


.history_content .year_box.yr2017 .right .num_area > span.on
{
  left: 0px;
}

.history_content .year_box.yr2017 .right .num_area .img1.on
{
  left: 251px;
}

.history_content .year_box.yr2017 .right .num_area .img2.on
{
  
  left: 321px;
  
}

.history_content .year_box.yr2017 .txt_area
{
  bottom:-68px;
}


.history_content .year_box.yr2017 .txt_area.on
{
  opacity: 1;
  bottom:-120px;
}


.history_content .dot_wrapper.yr2017
{
 /* top:593px;*/
    /*top: 1432px;*/
    top: 2297px;
}


/*year_2016*/
.history_content .year_box.yr2016
{
  height: 401px;
  padding-top: 87px;
}

.history_content .year_box.yr2016 .grey_dot
{
  top:62%
}

.history_content .year_box.yr2016 .left
{
  padding-top:125px;
}

.history_content .year_box.yr2016 .left .num_area span.on
{
  left: 0px;
}

.history_content .year_box.yr2016 .right
{
  padding-left: 150px;
}

.history_content .year_box.yr2016 .right img
{
  opacity:0.2;
}

.history_content .year_box.yr2016 .right img.on
{
  opacity:1;
}

.history_content .year_box.yr2016 .left .num_area .img1.on
{
  left: 258px;
}

.history_content .year_box.yr2016 .left .num_area .img2.on
{
  left: 321px;
}

.history_content .year_box.yr2016 .txt_area
{
  bottom:-119px;
}

.history_content .year_box.yr2016 .txt_area.on
{
  bottom:-99px;
  opacity: 1;
}

.history_content .dot_wrapper.yr2016
{
  /*top:994px;*/
    /*top: 1828px;*/
    top: 2695px;
}




/*year_2015*/
.history_content .year_box.yr2015
{
  height: 403px;
  padding-top: 116px;
}

.history_content .year_box.yr2015 .grey_dot
{
  top: 63%;
}

.history_content .year_box.yr2015 .left
{
  padding-left: 115px;
}

.history_content .year_box.yr2015 .left img
{
  opacity:0.2;
}

.history_content .year_box.yr2015 .left img.on
{
  opacity:1;
}

.history_content .year_box.yr2015 .right
{
  padding-top: 98px;
}


.history_content .year_box.yr2015 .right .num_area > span.on
{
  left: 0px;
}

.history_content .year_box.yr2015 .right .num_area .img1.on
{
  left: 251px;
}

.history_content .year_box.yr2015 .right .num_area .img2.on
{
  
  left: 321px;
  
}

.history_content .year_box.yr2015 .txt_area
{
  bottom:-29px;
}


.history_content .year_box.yr2015 .txt_area.on
{
  opacity: 1;
  bottom:-68px;
}


.history_content .dot_wrapper.yr2015
{
 /* top:1397px;*/
    /*top: 2234px;*/
    top: 3100px;
}



/*year_2014*/
.history_content .year_box.yr2014
{
  height: 313px;
  padding-top: 15px;
}

.history_content .year_box.yr2014 .grey_dot
{
  top:63%;
}

.history_content .year_box.yr2014 .left
{
  padding-top:142px;
}

.history_content .year_box.yr2014 .right
{
  padding-left: 181px;
}

.history_content .year_box.yr2014 .left .num_area span.on
{
  left: 0px;
}

.history_content .year_box.yr2014 .right img
{
  opacity:0.2;
}

.history_content .year_box.yr2014 .right img.on
{
  opacity:1;
}

.history_content .year_box.yr2014 .left .num_area .img1.on
{
  left: 258px;
}

.history_content .year_box.yr2014 .left .num_area .img2.on
{
  left: 321px;
}

.history_content .year_box.yr2014 .txt_area
{
  bottom:-86px;
}

.history_content .year_box.yr2014 .txt_area.on
{
  bottom:-67px;
  opacity: 1;
}

.history_content .dot_wrapper.yr2014
{
  /*top:1744px;*/
    /*top: 2581px*/
    top: 3446px;
}


/*year_2013*/
.history_content .year_box.yr2013
{
  height: 353px;
  padding-top: 139px;
}

.history_content .year_box.yr2013 .grey_dot
{
  top: 70%;
}

.history_content .year_box.yr2013 .left img
{
  opacity:0.2;
}

.history_content .year_box.yr2013 .left img.on
{
  opacity:1;
}

.history_content .year_box.yr2013 .right
{
  padding-top: 70px;
}


.history_content .year_box.yr2013 .right .num_area > span.on
{
  left: 0px;
}

.history_content .year_box.yr2013 .right .num_area .img1.on
{
  left: 251px;
}

.history_content .year_box.yr2013 .right .num_area .img2.on
{
  
  left: 321px;
  
}

.history_content .year_box.yr2013 .txt_area
{
  bottom:-35px;
}


.history_content .year_box.yr2013 .txt_area.on
{
  opacity: 1;
  bottom:-68px;
}


.history_content .dot_wrapper.yr2013
{
  /*top:2108px;*/
 /*   top: 2945px*/
    top: 3810px;
}


/*year_2012*/
.history_content .year_box.yr2012
{
  height: 402px;
  padding-top: 144px;
}

.history_content .year_box.yr2012 .grey_dot
{
  top:63%;
}

.history_content .year_box.yr2012 .left
{
  padding-top:71px;
}

.history_content .year_box.yr2012 .right
{
  padding-left: 163px;
}

.history_content .year_box.yr2012 .left .num_area span.on
{
  left: 0px;
}

.history_content .year_box.yr2012 .right img
{
  opacity:0.2;
}

.history_content .year_box.yr2012 .right img.on
{
  opacity:1;
}

.history_content .year_box.yr2012 .left .num_area .img1.on
{
  left: 258px;
}

.history_content .year_box.yr2012 .left .num_area .img2.on
{
  left: 321px;
}

.history_content .year_box.yr2012 .txt_area
{
  bottom:-55px;
}

.history_content .year_box.yr2012 .txt_area.on
{
  bottom:-99px;
  opacity: 1;
}

.history_content .dot_wrapper.yr2012
{
 /* top:2467px;*/ 
    /*top: 3303px*/
    top: 4170px;
}




/*year_2011*/
.history_content .year_box.yr2011
{
  height: 360px;
  padding-top: 89px;
}

.history_content .year_box.yr2011 .grey_dot
{
  top:70%;
}

.history_content .year_box.yr2011 .left img
{
  opacity:0.2;
}

.history_content .year_box.yr2011 .left img.on
{
  opacity:1;
}

.history_content .year_box.yr2011 .right
{
  padding-top: 121px;
}


.history_content .year_box.yr2011 .right .num_area > span.on
{
  left: 0px;
}

.history_content .year_box.yr2011 .right .num_area .img1.on
{
  left: 251px;
}

.history_content .year_box.yr2011 .right .num_area .img2.on
{
  
  left: 321px;
  
}

.history_content .year_box.yr2011 .txt_area
{
  bottom:-35px;
}


.history_content .year_box.yr2011 .txt_area.on
{
  opacity: 1;
  bottom:-68px;
}


.history_content .dot_wrapper.yr2011
{
  /*top:2866px;*/
    /*top: 3705px*/
    top: 4570px;
}



/*year_2010*/
.history_content .year_box.yr2010
{
  height: 418px;
  padding-top: 138px;
}

.history_content .year_box.yr2010 .grey_dot
{
  top:61%;
}

.history_content .year_box.yr2010 .left
{
  padding-top:73px;
}

.history_content .year_box.yr2010 .right
{
  padding-left: 163px;
}

.history_content .year_box.yr2010 .left .num_area span.on
{
  left: 0px;
}

.history_content .year_box.yr2010 .right img
{
  opacity:0.2;
}

.history_content .year_box.yr2010 .right img.on
{
  opacity:1;
}

.history_content .year_box.yr2010 .left .num_area .img1.on
{
  left: 258px;
}

.history_content .year_box.yr2010 .left .num_area .img2.on
{
  left: 321px;
}

.history_content .year_box.yr2010 .txt_area
{
  bottom:-137px;
}

.history_content .year_box.yr2010 .txt_area.on
{
  bottom:-99px;
  opacity: 1;
}

.history_content .dot_wrapper.yr-2010
{
  /*top:3231px;*/ 
    /*top: 4068px*/
    top: 4933px;
}



/*year_2009*/
.history_content .year_box.yr2009
{
  height: 526px;
  padding-top: 203px;
}

.history_content .year_box.yr2009 .grey_dot
{
  top: 49%;
}

.history_content .year_box.yr2009 .left img
{
  opacity:0.2;
}

.history_content .year_box.yr2009 .left img.on
{
  opacity:1;
}

.history_content .year_box.yr2009 .right
{
  padding-top: 17px;
}


.history_content .year_box.yr2009 .right .num_area > span.on
{
  left: 0px;
}

.history_content .year_box.yr2009 .right .num_area .img1.on
{
  left: 251px;
}

.history_content .year_box.yr2009 .right .num_area .img2.on
{
  
  left: 321px;
  
}

.history_content .year_box.yr2009 .txt_area
{
  bottom:-162px;
}


.history_content .year_box.yr2009 .txt_area.on
{
  opacity: 1;
  bottom:-221px;
}


.history_content .dot_wrapper.yr2009
{
  /*top:3652px;*/ 
    /*top: 4486px*/
    top: 5355px;
}



/*year_2008*/
.history_content .year_box.yr2008
{
  height: 445px;
  padding-top: 157px;
}
.history_content .year_box.yr2008 .grey_dot
{
  top: 57%;
}


.history_content .year_box.yr2008 .left
{
  padding-top:59px;
}

.history_content .year_box.yr2008 .right
{
  padding-left: 182px;
}

.history_content .year_box.yr2008 .left .num_area span.on
{
  left: 0px;
}

.history_content .year_box.yr2008 .right img
{
  opacity:0.2;
}

.history_content .year_box.yr2008 .right img.on
{
  opacity:1;
}

.history_content .year_box.yr2008 .left .num_area .img1.on
{
  left: 258px;
}

.history_content .year_box.yr2008 .left .num_area .img2.on
{
  left: 321px;
}

.history_content .year_box.yr2008 .txt_area
{
  bottom:-130px;
}

.history_content .year_box.yr2008 .txt_area.on
{
  bottom:-68px;
  opacity: 1;
}

.history_content .dot_wrapper.yr2008
{
 /* top:4175px;*/ 
    /*top: 5010px;*/
    top: 5877px;
}




/*year_2007*/
.history_content .year_box.yr2007
{
  height: 336px;
  padding-top: 71px;
}

.history_content .year_box.yr2007 .grey_dot
{
  /*top:52%;*/ top: 61%
}

.history_content .year_box.yr2007 .right
{
  padding-top:88px;
}

.history_content .year_box.yr2007 .left img
{
  opacity:0.2;
}

.history_content .year_box.yr2007 .left img.on
{
  opacity:1;
}


.history_content .year_box.yr2007 .right .num_area > span.on
{
  left: 0px;
}

.history_content .year_box.yr2007 .right .num_area .img1.on
{
  left: 251px;
}

.history_content .year_box.yr2007 .right .num_area .img2.on
{
  
  left: 321px;
  
}

.history_content .year_box.yr2007 .txt_area
{
  bottom:-68px;
}


.history_content .year_box.yr2007 .txt_area.on
{
  opacity: 1;
  bottom:-104px;
}


.history_content .dot_wrapper.yr2007
{
 /* top:4541px;*/ 
    /*top: 5406px;*/
    top: 6272px;
}



/*year_2006*/
.history_content .year_box.yr2006
{
  height: 376px;
  padding-top: 52px;
}

.history_content .year_box.yr2006 .grey_dot
{
  top: 63%;
}

.history_content .year_box.yr2006 .left
{
  padding-top:144px;
}

.history_content .year_box.yr2006 .right
{
  padding-left: 163px;
}

.history_content .year_box.yr2006 .left .num_area span.on
{
  left: 0px;
}

.history_content .year_box.yr2006 .right img
{
  opacity:0.2;
}

.history_content .year_box.yr2006 .right img.on
{
  opacity:1;
}

.history_content .year_box.yr2006 .left .num_area .img1.on
{
  left: 258px;
}

.history_content .year_box.yr2006 .left .num_area .img2.on
{
  left: 321px;
}

.history_content .year_box.yr2006 .txt_area
{
  bottom:-80px;
}

.history_content .year_box.yr2006 .txt_area.on
{
  bottom:-86px;
  opacity: 1;
}

.history_content .dot_wrapper.yr2006
{
 /* top:4938px;*/ /*top: 5773px;*/
    top: 6638px
}


/*year_2004*/
.history_content .year_box.yr2004
{
  /*height: 492px;
  height:595px;*/
    height: 615px;
  padding-top: 204px;
}

.history_content .year_box.yr2004 .right
{
  padding-top:107px;
}

.history_content .year_box.yr2004 .left img
{
  opacity:0.2;
}

.history_content .year_box.yr2004 .left img.on
{
  opacity:1;
}


.history_content .year_box.yr2004 .right .num_area > span.on
{
  left: 0px;
}

.history_content .year_box.yr2004 .right .num_area .img1.on
{
  left: 251px;
}

.history_content .year_box.yr2004 .right .num_area .img2.on
{
  
  left: 321px;
  
}

.history_content .year_box.yr2004 .txt_area
{
  bottom:-68px;
}


.history_content .year_box.yr2004 .txt_area.on
{
  opacity: 1;
  bottom:-86px;
}


.history_content .dot_wrapper.yr2004
{
  /*top:5322px;*/
    /*top: 6271px*/
    top: 7136px;
}

.history_content .dot_wrapper.end
{
  /*top:5668px;*/
  /*  top: 6525px;*/
    top: 7390px;
}

.history_content .year_box.yr2004:after
{
  content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background: #dcdcdc;
    z-index: 3;
    width: 7px;
    height: 7px;
}

.history_content .year_box.yr2004 .grey_dot
{
  /*top:41%;*/ top: 58%
}

/*************************조직도 comp_organization*************************/
/********************************************************/
.organization_wrapper
{
  margin-top:68px;
  height:584px;
  position: relative;
}

.organization_wrapper div img
{
  position: absolute;
  top:-66px;
  left: -29.5%;
}

.organization_wrapper > ul
{
  overflow: hidden;
  position: absolute;
  width: 0;
  height: 0;
  line-height: 0;
}

.organization_wrapper .first_line
{
  text-align: center;
}

.organization_wrapper li p
{
  background-color: #fff;
  -webkit-box-shadow: 2px 2px 13px 1px rgba(225,225,225,1);
  box-shadow: 2px 2px 13px 1px rgba(225,225,225,1);
  width:205px;
  height: 68px;
  line-height: 68px;
  vertical-align: middle;
  text-align: center;
  font-size: 21px;
  color:#292929;
  font-weight: 700;
  position: relative;
  margin:0 auto;
}

.organization_wrapper li p:before
{
  content:'';
  position: absolute;
  top:0;
  left: 0;
  width: 7px;
  height: 26px;
  background-color: #d32140;
}

.organization_wrapper .first_line
{
  margin-bottom: 135px;
  position: relative;
}

.organization_wrapper .first_line:after
{
  content:'';
  position: absolute;
  bottom: -82px;
  left: 50%;
  transform: translateX(-50%);
  width: 1002px;
  height: 1px;
  background-color: #434343;
}

.organization_wrapper .first_line p:after
{
  content:'';
  position: absolute;
  bottom:-136px;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 135px;
  background-color: #434343;
}


.organization_wrapper .second_line li
{
  display: inline-block;
  vertical-align: top;
  position: relative;
}

.organization_wrapper .second_line li p:after
{
  content:'';
  position: absolute;
  top:-54px;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 54px;
  background-color: #434343;
}

.organization_wrapper .second_line li:nth-child(3) p:after
{
  display: none;
}

.organization_wrapper .second_line li
{
  margin-right: 43px;
}

.organization_wrapper .second_line li:last-child
{
  margin-right: 0;
}

.organization_wrapper .second_line li p:before
{
  background-color: #f2717d;
}

.organization_wrapper .second_line li .sub_line
{
  position: absolute;
}

.organization_wrapper .second_line li .sub_line li
{
  display: inline-block;
}

.organization_wrapper .second_line li .sub_line.type01
{
  bottom:-120px;
  left:50%;
  transform: translateX(-50%);
}

.organization_wrapper .second_line li .sub_line .type01
{
  width: 150px;
  height: 40px;
  background-color: #535353;
  color:#fff;
  font-size: 19px;
  text-align: center;
  line-height: 40px;
  vertical-align: middle;
}

.organization_wrapper .second_line > ul > li:nth-child(2)
{
  margin-bottom: 274px;
}

.organization_wrapper .second_line li .sub_line.type02
{
  bottom:-274px;
  left:50%;
  transform: translateX(-50%);
  width: 291px;
}

.organization_wrapper .second_line li .sub_line .type02
{
  width: 83px;
  height: 40px;
  background-color: #535353;
  color:#fff;
  font-size: 19px;
  text-align: center;
  line-height: 40px;
  vertical-align: middle;
  margin-right:20px;
}

.organization_wrapper .second_line li .sub_line .type02:last-child
{
  margin-right: 0px;
}

.organization_wrapper .second_line li .sub_line.type03
{
  bottom:-120px;
  left:50%;
  transform: translateX(-50%);
  width: 321px;
}

.organization_wrapper .second_line li .sub_line.type03 .type01
{
  margin-right: 21px;
}
.organization_wrapper .second_line li .sub_line.type03 .type01:last-child
{
  margin-right: 0px;
}

.organization_wrapper .second_line > ul > li:nth-child(4)
{
  margin-bottom: 274px;
}

.organization_wrapper .second_line li .sub_line.type04
{
  bottom:-274px;
  left:50%;
  transform: translateX(-50%);
  width: 466px;
}

.organization_wrapper .second_line li .sub_line .type04
{
  width: 140px;
  height: 40px;
  background-color: #535353;
  color: #fff;
  font-size: 19px;
  text-align: center;
  line-height: 40px;
  vertical-align: middle;
}


.organization_wrapper .second_line li .sub_line.type04 .type04
{
  margin-right: 21px;
}
.organization_wrapper .second_line li .sub_line.type04 .type04:last-child
{
  margin-right: 0px;
}


/*************************recruit*************************/
/********************************************************/
.content.recruit
{
  padding-top: 57px;
}
.banner_wrapper.recruit
{
  background: #eee;
}

.content.recruit .title_wrapper div
{
  left: 456px;
}


/*************************news 게시판*************************/
/********************************************************/
.banner_wrapper.news
{
  background: #eee;
}


.content_wrapper #bo_sch
{
    position: absolute;
    top: -7px;
    right: 0;
    border-bottom: 1px solid #9d9d9d;
}

.content_wrapper #bo_sch .sch_input::placeholder
{
  color:#9d9d9d;
}

.content_wrapper #bo_sch .fa
{
  color:#9d9d9d;
}

.content.inquiry .content_wrapper h1
{
  margin-bottom: 24px;
}

.content.inquiry .content_wrapper h1:after
{
  bottom: -25px;
}

.content.news .tbl_wrap table
{
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom:1px solid #222;
    border-top:1px solid #222;
}
.content.news .tbl_head01 tr:nth-child(1) td{border-top: 0;}
.content.news .tbl_head01 td
{
  border-top: 2px solid #ecf0f1;
}

.tbl_head01
{
  margin-bottom: 20px;
}


.content.news .content_wrapper
{
  padding-bottom: 150px;
}


.content.news .pg_wrap
{
  float: right;
  margin: 0;
}

.content.news .pg_current
{
  border-bottom: 3px solid #323232;
  border-top: initial;
  border-right: initial;
  border-left: initial;
  background: transparent;
  color: #323232;
  box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  border-radius: 0;
  height: 23px;
  line-height: 17px;
  width: 23px;
  min-width: 23px;
  padding: 0;
  font-size: 16px;
  font-weight: 600;
  /*padding-right: 2px;*/
}

.content.news .pg_page
{
  border:none;
  background-color: transparent;
  overflow: hidden;
    background: url(../img/paging_dot.png) no-repeat 50% 99% #fff;
  text-indent: -99999px;
  min-width: 28px;
}

.pg_page:hover
{
  background-color: transparent;
}

.content.news .pg_page.pg_prev{ margin-top: 9px;   background: url(../img/board_left_arrow.png) no-repeat 50% 50% #fff;}
.content.news .pg_end
{
  background: url(../img/board_last_arrow.png) no-repeat 50% 50% #fff;
  
  margin-top: 9px;
}
.content.news .pg_page.pg_next{background: url(../img/board_right_arrow.png) no-repeat 50% 50% #fff;margin-top: 9px;}
.content.news .pg_start
{
  background: url(../img/board_first_arrow.png) no-repeat 50% 50% #fff;
  margin-top: 9px;
}

.content.news .pg_wrap:after
{
  content:'';
  float: none;
  clear:both;
  display: block;
}

.banner_wrapper.vancancy
{
 background: #eee;
}

/***********************portfolio psd***********************/
/********************************************************/
.portfolio .fade.slider .txt_wrapper
{
  position: absolute;
  top:583px;
  right: 0;
  text-align: right;
  width: 100%;
  opacity: 1;
}

.portfolio .fade.slider .txt_wrapper ul
{
  height: 112px;
  padding: 15px 0;
  box-sizing: border-box;
  border-bottom: 1px solid #e5e5e5;
}

.portfolio .fade.slider .txt_wrapper ul li
{
  display: inline-block;
    width: 160px;
    height: 100%;
    float: right;
    text-align: left;
    padding: 15px 24px;
    box-sizing: border-box;
    border-left: 1px solid #e5e5e5;
}

.portfolio .fade.slider .txt_wrapper ul li p.red
{
  font-size: 13.3px;
  color: #d32140;
  font-weight: 500;
}

.portfolio .fade.slider .txt_wrapper ul li p
{
  font-size: 21.3px;
  color: #444444;
  font-weight: 300;
}


.content.portfolio .tab_menu ul li
{
  width:20%;
}

.banner_wrapper.psd
{
 background: #eee;
}

.content.portfolio
{
  background: url(../img/portfolio_bg.png) no-repeat;
  height: auto;
  background-size: 100% 100%;
}

.content.portfolio.psd
{
  background: url(../img/portfolio_psd_bgimg.png) no-repeat center;
  background-position-y: -5px;
  background-size: cover;
}

.content_wrapper.portfolio
{
  padding-top: 135px;
  padding-bottom: 140px;
}

.content_wrapper.portfolio h1:after
{
  display: none;
}

.content_wrapper.portfolio .title_wrapper
{
  position: relative;
}

.content_wrapper.portfolio .ptag_wrapper
{
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  left:305px;
}

.content_wrapper.portfolio .ptag_wrapper p
{
  font-size: 16px;
  font-weight: 600;
  color:#444;
}

.content_wrapper.portfolio .ptag_wrapper .small
{
  font-size: 13.3px;
  font-weight: 300;
  color:#888;
}



/*slide*/
.content_wrapper.portfolio .slick-prev
{
  bottom: 48.5px;
  transform:none;
  -webkit-transform:none;
  width:36px;
  height: 15px;
  top:auto;
  left: 52px;
  z-index: 10;
}

.content_wrapper.portfolio .slick-next
{
  bottom: 48.5px;
  transform:none;
  -webkit-transform:none;
  width:36px;
  height: 15px;
  top:auto;
  left: 134px;
  z-index: 10;
}

.content_wrapper.portfolio .slick-prev:hover:before
{
  content:'';
  background: url(../img/red_slidearrow_left.png) no-repeat;
  width:36px;
  height: 15px;
  background-size: 100% 100%;
  display: block;
}


.content_wrapper.portfolio .slick-prev:before
{
  content:'';
  background: url(../img/slidearrow_left.png) no-repeat;
  width:36px;
  height: 15px;
  background-size: 100% 100%;
  display: block;
}

.content_wrapper.portfolio .slick-next:before
{
  content:'';
  background: url(../img/slidearrow_right.png) no-repeat;
  width:36px;
  height: 15px;
  background-size: 100% 100%;
  display: block;
}

.content_wrapper.portfolio .slick-next:hover:before
{
  content:'';
  background: url(../img/red_slidearrow_right.png) no-repeat;
  width:36px;
  height: 15px;
  background-size: 100% 100%;
  display: block;
}


.content_wrapper.portfolio .fade.slider
{
  height: 695px;
  margin-bottom: 115px;
}

.fade.slider .txt_wrapper ul
{
  height: 112px;
  padding:15px 0;
  box-sizing: border-box;
  border-bottom: 1px solid #e5e5e5;
}
.fade.slider .txt_wrapper ul li
{
  display: inline-block;
  width: 160px;
  height: 100%;
  float: right;
  text-align: left;
  padding: 15px 24px;
  box-sizing: border-box;
  border-left: 1px solid #e5e5e5;
}

.fade.slider .txt_wrapper ul li p
{
  font-size: 21.3px;
  color: #444444;
  font-weight: 300;
}

.fade.slider .txt_wrapper ul li p.red
{
  font-size: 13.3px;
  color: #d32140;
  font-weight: 500;
}

.fade.slider .txt_wrapper ul:after
{
  content:'';
  float: none;
  clear: both;
  display: block;
}



.content_wrapper.portfolio .slide_area .more_txt
{
  font-size: 21.33px;
  color:#444;
  font-weight: 800;
  text-align: center;
  margin-bottom: 32px;
  line-height: 21px;
}

/*list_area*/
.content_wrapper.portfolio .list_wrapper {overflow: hidden}
.content_wrapper.portfolio .list_wrapper a.inner_wrapper
{
  display: inline-block;
  /*margin-right: 15.1px;
  margin-bottom:20px;*/
    margin-right: 1.32%; margin-bottom: 1.6%; width: 24.01%;
  border:1px solid #f4f4f4;
  float: left;
}
.content_wrapper.portfolio .list_wrapper a.inner_wrapper img{width: 100%}
.content_wrapper.portfolio .list_wrapper a.inner_wrapper:nth-child(4n)
{
  margin-right:0;
}


.content_wrapper.portfolio .list_wrapper a.inner_wrapper div:first-child
{
  position: relative;
}

.content_wrapper.portfolio .list_wrapper a.inner_wrapper:hover div:first-child:before
{
  content:'';
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 215px;
  background-color: rgba(211, 33, 64, 0.5);
}


.content_wrapper.portfolio .list_wrapper .txt_area
{
  height: 144px;
  padding:23px 0 23px 15px;
  position: relative;
}

.content_wrapper.portfolio .list_wrapper a.inner_wrapper:hover .txt_area:before
{
  content: '';
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 144px;
  background-color: #d32140;
}

.content_wrapper.portfolio .list_wrapper .txt_area p
{
  font-size: 16px;
  margin-bottom: 70px;
  position: relative;
  line-height: 16px;
}

.content_wrapper.portfolio .list_wrapper a.inner_wrapper:hover .txt_area p
{
  color:#fff;
}

.content_wrapper.portfolio .list_wrapper .txt_area p:last-child
{
  margin-bottom: 0;
  font-size: 13.3px;
  color:#444;
  line-height: 13.3px;
}

.content_wrapper.portfolio .list_wrapper .txt_area p:last-child:before
{
  content:'';
  position: absolute;
  height: 1px;
  width: 31px;
  background-color: #d32140;
  top:-15px;
  left: 0;
}

.content_wrapper.portfolio .list_wrapper a.inner_wrapper:hover .txt_area p:last-child:before
{
  content:'';
  position: absolute;
  height: 13px;
  width: 37px;
  background:url(../img/listarrow.png) no-repeat;
  top:-21px;
  left: 0;
  display: block;
}


/**************************portfolio frame**************************/
/*******************************************************************/
.content.portfolio.frame
{
  background: url(../img/portfolio_frame_bgimg.png) no-repeat center;
  background-position-y: -5px;
  background-size: cover;
}

.portfolio.frame .fade.slider .txt_wrapper ul li.second_adap_width
{
  width: 189px;
}

.portfolio.frame .fade.slider .txt_wrapper ul li.third_adap_width
{
  width:205px;
}


/**************************portfolio lighting_adv**************************/
/*******************************************************************/
.content.portfolio.lighting_adv
{
  background: url(../img/portfolio_lighting_adv_bgimg.png) no-repeat center;
  background-position-y: -5px;
  background-size: cover;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.first_adap_width01
{
  width: 167px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.first_adap_width02
{
  width: 187px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.second_adap_width01
{
  width: 167px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.second_adap_width02
{
  width: 187px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.second_adap_width03
{
  width: 211px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.second_adap_width02
{
  width: 187px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.second_adap_width03
{
  width: 211px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.third_adap_width01
{
  width: 167px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.third_adap_width02
{
  width: 187px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.fourth_adap_width01
{
  width: 212px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.fourth_adap_width02
{
  width: 187px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.fifth_adap_width01
{
  width: 212px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.fifth_adap_width02
{
  width: 187px;
}


.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.sixth_adap_width01
{
  width: 239px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.sixth_adap_width02
{
  width: 187px;
}


.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.seventh_adap_width01
{
  width: 244px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.eighth_adap_width01
{
  width: 244px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.nine_adap_width01
{
  width: 244px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.tenth_adap_width01
{
  width: 244px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.eleventh_adap_width01
{
  width: 167px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.eleventh_adap_width02
{
  width: 187px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.eleventh_adap_width03
{
  width: 185px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.twelfth_adap_width02
{
  width: 187px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.twelfth_adap_width03
{
  width: 187px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.thirteenth_adap_width02
{
  width: 187px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.thirteenth_adap_width01
{
  width: 268px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.fourteenth_adap_width03
{
  width: 172px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.fourteenth_adap_width02
{
  width: 187px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.fourteenth_adap_width01
{
  width: 268px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.fifteenth_adap_width02
{
  width: 187px;
}

.portfolio.lighting_adv .fade.slider .txt_wrapper ul li.fifteenth_adap_width01
{
  width: 167px;
}










/**************************portfolio poster**************************/
/*******************************************************************/
.content.portfolio.poster
{
  background: url(../img/portfolio_psd_bgimg.png) no-repeat center;
  background-size: cover;
  background-position-y: -5px;
}
.fade.slider.poster .txt_wrapper ul li:first-child
{
  width: 170px;
}

.fade.slider.poster .txt_wrapper ul li:nth-child(2)
{
  width: 147px;
}

.fade.slider.poster .txt_wrapper ul li:last-child
{
  width: 240px;
}

/*poster slide의 디자인 arrow */

.content.portfolio .slider_wrapper
{
  position: relative;
}

.content.portfolio .design_prearrow
{
  position: absolute;
  top:50.9%;
  left: 54px;
  background: url(../img/slidearrow_left.png) no-repeat;
  width: 37px;
  height: 11px;
  background-size: 100% 100%;
  display: block;
  cursor: pointer;
  z-index: 20;
}

.content.portfolio .design_prearrow:hover
{
  
  background: url(../img/red_slidearrow_left.png) no-repeat;background-size:100% ;top: 50.7%;height: 13px;
}



.content.portfolio .design_nxtarrow
{
  position: absolute;
  top:50.9%;
  left: 134px;
  background: url(../img/slidearrow_right.png) no-repeat;
  width: 35px;
  height: 11px;
  background-size: 100% 100%;
  display: block;
  cursor: pointer;
  z-index: 20;
}

.content.portfolio .design_nxtarrow:hover
{
  background: url(../img/red_slidearrow_right.png) no-repeat;
  
}


/**************************portfolio promotion**************************/
/**********************************************************************/
.content.portfolio.promotion
{
  background: url(../img/portfolio_psd_bgimg.png) no-repeat center;
  background-size: cover;
  background-position-y: -5px;
}
.fade.slider.promotion .txt_wrapper ul li:first-child
{
  width: 254px;
}

.fade.slider.promotion .txt_wrapper ul li:nth-child(2)
{
  width: 147px;
}

.fade.slider.promotion .txt_wrapper ul li:last-child
{
  width: 240px;
}




/**************************digital signage01**************************/
/**********************************************************************/
.content.signage
{
  background:url(../img/digital_signage_bg181205_.jpg) no-repeat center;
  background-size: cover;
}
.content_wrapper.signage
{
  padding-bottom: 150px;
}
.banner_wrapper.signage
{
      background: #eee;
}

.content_wrapper.signage h1
{
  margin-bottom: 24px;
}

.content_wrapper.signage h1:after
{
  display: none;
}

.content.signage .tab_menu ul li
{
  width:25%;
}

.content.signage .slick-slide
{
  height: 583px;
}

.content_wrapper.signage .txt_wrapper
{
  padding:35px 0 35px;
  border-bottom: 1px solid #ccc;
}

.content_wrapper.signage .txt_wrapper div
{
  display: inline-block;
  vertical-align: top;
}

/*제안서 버튼 부분*/

.content_wrapper.signage .txt_wrapper .btn_area
{
  width: 242px;
  height: 70px;
  padding:15px 30px;
  box-sizing: border-box;
  text-align: center;
  position: relative;
}

.content_wrapper.signage .txt_wrapper .btn_area:after
{
  content:'';
  position: absolute;
  top:50%;
  right:0;
  transform: translateY(-50%);
  width: 1px;
  height: 67px;
  background-color: #ccc;

}

.content_wrapper.signage .txt_wrapper .btn_area a
{
  display: inline-block;
  font-size: 19px;
  color: #d32140;
  width: 179px;
  height: 45px;
  border: 1px solid #d32140;
  line-height: 45px;
  font-weight: 600;
  padding-right: 35px;
  position: relative;
}

.content_wrapper.signage .txt_wrapper .btn_area a:after
{
  content:'';
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  right:26px;
  background:url(../img/send_arrow01.png) no-repeat;
  background-size: 19px 8px;
  width:19px;
  height: 8px;
}


.content_wrapper.signage .txt_wrapper .btn_area a:hover
{
  
  color: #fff;
  background-color: #d32140;
 
}



.content_wrapper.signage .txt_wrapper .btn_area a:hover:after
{
  
  content:'';
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  right:26px;
  background:url(../img/send_arrow.png) no-repeat;
  background-size: 19px 8px;
  width:19px;
  height: 8px;
}

/*설명부분*/
.content_wrapper.signage.page01 .txt_wrapper .des_area
{
  height: 80px;
}

.content_wrapper.signage.page01 .txt_wrapper .des_area h6
{
  font-size:21px;
  font-weight: 800;
  color:#d32140;
  font-family: 'Noto Sans KR', sans-serif !important;
  margin-bottom: 12px;
  padding-left: 20px;
  position: relative;
  line-height: 21px;
}

.content_wrapper.signage.page01 .txt_wrapper .des_area h6:before
{
  content:'';
  position: absolute;
  width: 5px;
  height: 20px;
  background-color: #d32140;
  top:0px;
  left: 0px;
}

.content_wrapper.signage .txt_wrapper .des_area p
{
  font-size: 17.67px;
  font-weight: 300;
  color:#444;
  line-height: 24px;
}

/*slide*/
/*slide 화살표*/

.content_wrapper.signage .slide_area 
{
  position: relative;
  height: 583px;
}


.content_wrapper.signage .slick-prev
{
  /*right: 140px;*/
    right: 105px;
  top:-40px;
  transform: none;
  -webkit-transform:none;
  width:15px;
  z-index: 10;
}

.content_wrapper.signage .slick-next
{
   transform: none;
  -webkit-transform:none;
  top:-40px;
  right:28px;
  width:15px;
  z-index: 10;
}

.content_wrapper.signage .slick-prev:before
{
  content:'';
  opacity: 1;
  background:url(../img/ds_arrow_left.png) no-repeat;
  width: 7px;
  height: 14px;
  background-size: 100% 100%;
  display: block;
}

.content_wrapper.signage .slick-next:before
{
  content:'';
  opacity: 1;
  background:url(../img/ds_arrow_right.png) no-repeat;
  width: 7px;
  height: 14px;
  background-size: 100% 100%;
  display: block;
  margin-left: 8px;
}

/*slide 화살표 맨앞, 맨끝*/
.content_wrapper.signage .slide_area .slick_left_end
{
  position: absolute;
  top:-40px;
 /*right: 160px;*/
    right: 125px;
  z-index: 10;
  width:20px;
  height: 20px;
  font-size: 0;
  line-height: 0;
  color: transparent;
  border: none;
  outline: none;
  background: transparent;
}

.content_wrapper.signage .slide_area .slick_right_end
{
  position: absolute;
  top:-40px;
  right: 0px;
  z-index: 10;
  width:20px;
  height: 20px;
  font-size: 0;
  line-height: 0;
  color: transparent;
  border: none;
  outline: none;
  background: transparent;
}

.content_wrapper.signage .slide_area .slick_left_end:before
{
  content:'';
  opacity: 1;
  background:url(../img/ds_arrow_end_left.png) no-repeat;
  width: 12px;
  height: 14px;
  background-size: 100% 100%;
  display: block;

}

.content_wrapper.signage .slide_area .slick_right_end:before
{
  content:'';
  opacity: 1;
  background:url(../img/ds_arrow_end_right.png) no-repeat;
  width: 12px;
  height: 14px;
  background-size: 100% 100%;
  display: block;

}

/*slide dot*/

.content_wrapper.signage  .slick-dotted.slick-slider
{
  margin-bottom:0;
}

.content_wrapper.signage .slick-dots
{
  top:-47px;
  text-align: right;
  bottom: auto;
  padding-right: 49px;
}
.content_wrapper.signage .slick-dots li
{
  vertical-align: middle;
  margin: 0 3px;
}
.content_wrapper.signage .slick-dots li.slick-active button
{
  font-size: 16px;
  line-height: 17px;
  color: #323232;
  font-weight: 600;
  padding:0;
  width:23px;
  height: 23px;
  border-bottom: 3px solid #323232;
  font-family: 'Noto Sans KR', sans-serif !important;
}

.content_wrapper.signage .slick-dots li button:before
{
  content:'';
  background: url(../img/slide_dot02.png) no-repeat;
  width: 21px;
  height: 21px;
  background-size: 100% 100%;
  opacity: 1
}

.content_wrapper.signage .slick-dots li.slick-active button:before
{
  content:'';
  background:none;
}



/*modal 부분*/
.modal_bg 
{
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.6); /* Black w/ opacity */
  z-index: 20;
}

/* Modal Content */
.modal-content 
{
  position: absolute;
  top:5%;
  left: 50%;
  transform: translateX(-50%);
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
  z-index: 20;
}

.modal-content .function_wrapper
{
  position: relative;
}

.modal-content .function_wrapper a
{
  position: absolute;
  top:8px;
  left: 0;
  display: inline-block;
  font-size: 19px;
  color: #d32140;
  width: 179px;
  height: 45px;
  border: 1px solid #d32140;
  line-height: 45px;
  font-weight: 600;
  padding-right: 23px;
  text-align: center;
}

.modal-content .function_wrapper a:after
{
  content: '';
  position: absolute;
  top: 2px;
  left: 13px;
  background: url(../img/download_icon.png) no-repeat;
  background-size: 90% 90%;
  width: 179px;
  height: 45px;
}

.modal-content .function_wrapper a:hover:after
{
  content: '';
  position: absolute;
  top: 2px;
  left: 13px;;
  background: url(../img/download_icon_wh.png) no-repeat;
  background-size: 90% 90%;
  width: 179px;
  height: 45px;
}

.modal-content .function_wrapper a:hover
{
    color: #fff;
    background-color: #d32140;
}

.modal-content iframe
{
  margin-top: 27px;
}

/* The Close Button */
.modal_bg  .close 
{
  color: #aaaaaa;
  float: right;
  font-size: 53px;
  line-height: 53px;
  font-weight: lighter;
}

.modal_bg  .close:hover,
.modal_bg  .close:focus
{
  cursor:pointer;
}

/***********************signage page02***********************/
/********************************************************/
.content_wrapper.page02
{

}
.content.signage.page02,
.content.signage.page03,
.content.signage.page04
{
  background:url(../img/signagep02_bg181205.jpg) no-repeat center;
  background-size: cover;
}

.content_wrapper.signage.page02 .subway_area
{
  display: inline-block;
  width: 37%;
  vertical-align: top;
  margin-right: 1.7%;
}

.content_wrapper.signage.page02 .slide_wrapper
{
  display: inline-block;
  width: 61%;
}


/*slide 화살표*/
.content_wrapper.signage.page02 .slick-prev
{
right: 200px;
}

.content_wrapper.signage.page02 .slide_area .slick_left_end
{
 right: 220px;
}

/*slide 하단 */
.content_wrapper.signage.page02 .txt_wrapper .des_area h6
{
  margin-bottom: 5px;
  font-size: 13px;
  font-weight: 700;
  color:#d32140;
  font-family: 'Noto Sans KR', sans-serif !important;
  line-height: 13px;
}

.content_wrapper.signage.page02 .txt_wrapper .btn_area
{
  height: 97px;
  padding: 26px 30px;
}
.content_wrapper.signage.page02 .txt_wrapper .des_area
{
  height: 97px;
  padding-left: 32px;
    width: 75%;
}

.content_wrapper.signage .txt_wrapper .des_area p.bold
{
  font-weight: 600;
  margin-bottom: 10px;
}

.content_wrapper.signage.page02 .txt_wrapper .btn_area:after
{
  height: 100%;
}


/***********************signage page03***********************/
/********************************************************/

/*slide 화살표*/
.content_wrapper.signage.page03 .slick-prev
{

}

.content_wrapper.signage.page03 .slide_area .slick_left_end
{

}


/***********************signage page04***********************/
/********************************************************/

/*slide 화살표*/
.content_wrapper.signage.page04 .slick-prev
{

}

.content_wrapper.signage.page04 .slide_area .slick_left_end
{

}

.content_wrapper.signage.page04 .txt_wrapper .des_area
{
  padding-left: 37px;
}


/*====================================================
                         subway00
=====================================================*/
.content_wrapper.signage.page02.subway00 .slick-prev
{

}


/***********************subway01***********************/
/********************************************************/
.content.subway
{
  background: url(../img/subway_bg_img.jpg) no-repeat center;
  background-size: cover;
}

.banner_wrapper.subway
{
  background: #eee;
}

.content.subway .tab_menu ul li
{
  width:14.28%;
  letter-spacing: 1px;
}

.content.subway .slick-slide
{
  height: 583px;
}


/*====================================================
                         subway02
=====================================================*/
.content_wrapper.signage.subway02 .txt_wrapper .des_area
{
  height: 97px;
  padding-left: 40px;
    width: 75%;
}
.content_wrapper.signage.subway02 .txt_wrapper .des_area h6
{
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 700;
  color: #d32140;
  font-family: 'Noto Sans KR', sans-serif !important;
}

.content.subway02
{
  background: url(../img/subway02_bg_img.jpg) no-repeat;
}
.content_wrapper.subway02 .slick-prev
{

}


.content_wrapper.subway02 .subway_area
{
  display: inline-block;
  width: 37%;
  vertical-align: top;
  margin-right: 1.7%;
}

.content_wrapper.subway02 .slide_wrapper
{
  display: inline-block;
  width: 61%;
}


.content_wrapper.subway02 .txt_wrapper .des_area h6
{
  margin-bottom: 0;
}

.content_wrapper.subway02 .txt_wrapper .btn_area
{
  height: 129px;
  padding: 42px 30px;
}

.content_wrapper.subway02 .txt_wrapper .btn_area:after
{
  height: 100%;
}

.content_wrapper.subway02 .txt_wrapper .des_area
{
  height: 129px;
}


/*====================================================
                       subway06
=====================================================*/
.content_wrapper.subway06 .slide_area .slick_left_end
{

}

.content_wrapper.subway06 .slick-prev
{

}


.content_wrapper.subway06 .subway_area
{
  display: inline-block;
  width: 37%;
  vertical-align: top;
  margin-right: 1.7%;
}

.content_wrapper.subway06 .slide_wrapper
{
  display: inline-block;
  width: 61%;
}

.content_wrapper.subway06 .txt_wrapper .des_area h6
{
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 700;
  color: #d32140;
  font-family: 'Noto Sans KR', sans-serif !important;
}

.content_wrapper.subway06 .txt_wrapper .btn_area
{
  padding: 15px 30px;
  height: 82px;
}

.content_wrapper.subway06 .txt_wrapper .btn_area:after
{
  height: 100%;
}

.content_wrapper.subway06 .txt_wrapper .des_area
{
  height: 82px;
  padding-left: 36px;
}



/*====================================================
                         contribution
=====================================================*/
.content.contribution
{
  background:url(../img/digital_signage_bg181205_.jpg) no-repeat center;
  background-size: cover;
}
.content.signage.contribution .tab_menu ul li
{
  width:16.566666%;
}

.content.contribution .content_wrapper.signage .slick-prev
{

}

.content.contribution .content_wrapper.signage .slide_area .slick_left_end
{

}


/*====================================================
                         store_manage
=====================================================*/


.common.store .fade.slider .bg1
{
  background:#eee
}


.common.store .fade.slider .txt_wrapper
{
  text-align: left;
  right:auto;
  left:358px;
  width: 604px;
  top:350px;
}

.common.store .fade.slider .txt_wrapper .title,
.common.store .fade.slider .txt_wrapper .title span,
.common.store .fade.slider .txt_wrapper .des_txt
{
  color:#fff;
}

.common.store .fade.slider .txt_wrapper .des_txt p
{
  font-size: 19px;
  line-height: 31px;
}


.common.store .fade.slider .txt_wrapper .des_txt .bld
{
  font-size: 24px;
  line-height: 24px;
  font-weight: 500;
  margin-bottom: 15px;
}



.common.store .fade.slider .slick-slide.slick-current.slick-active .txt_wrapper .des_txt
{
  
  opacity: 0;
  animation:  fadeInUp 2s 1s;
  -ms-animation:  fadeInUp 2s 1s;
  -webkit-animation:  fadeInUp 2s 1s;
  -moz-animation:  fadeInUp 2s 1s; 
  -o-animation:  fadeInUp 2s 1s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}


@keyframes fadeInUp
{
  from 
  {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to 
  {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInUp {
  from 
  {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to 
  {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

/*@-ms-keyframes fadeInUp {
  from 
  {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to 
  {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}*/

.content.manage .img_wrapper
{
  position: absolute;
  bottom: 0;
  left: -670px;
  width:37.9vw;
}

.content.manage .img_wrapper.fadeInLeft
{
  animation:  fadeInLefttype 2s ;
  -ms-animation:  fadeInLefttype 2s ;
  -webkit-animation:  fadeInLefttype 2s ;
  -moz-animation:  fadeInLefttype 2s ; 
  -o-animation:  fadeInLefttype 2s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  /*width:727px;
  height: 781px;*/
  width:37.9vw;
  /*height: 40.7vw;*/

}

.content.manage .img_wrapper img
{
  width:100%;
}

@-webkit-keyframes fadeInLefttype {
  from {
    opacity: 0;
    /*-webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);*/
    left: -670px;
  }

  to {
    opacity: 1;
    /*-webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);*/
    left:266px;
    /*left: 13.9vw;
*/  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    /*-webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);*/
    left: -670px
  }

  to {
    opacity: 1;
    /*-webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);*/
    left: 266px;
    /*left: 13.9vw;*/
  }

}

.content.store .textbox_wrapper
{
  width:28vw;
  height: 17vw;
  background-color: rgba(25,25, 24, 0.9 );
  position: absolute;
  top:311px;
  left: 54vw;
  color:#fff;
  /*padding:45px 49px;*/
  padding:2.3vw 2.6vw ;

}

.content.store .textbox_wrapper .inner_wrapper
{
  opacity: 0;
}

.content.store .textbox_wrapper .inner_wrapper.fadeInUP
{
  animation:  fadeInUp 2s ;
  -ms-animation:  fadeInUp 2s;
  -webkit-animation:  fadeInUp 2s;
  -moz-animation:  fadeInUp 2s ; 
  -o-animation:  fadeInUp 2s ; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
    animation-delay: 0.6s;
}

.content.store .textbox_wrapper h3
{
  position: relative;
  /*padding-left: 32px;*/
  padding-left: 1.7vw;
  font-size: 2.1vw;
  margin-bottom: 0.99vw;
  /*font-size: 40px;*/
  font-weight: 900;
  /*margin-bottom: 19px;*/
}

.content.store .textbox_wrapper h3:before
{
  content:'';
  position: absolute;
  top:28%;
  left: 0;
  /*width: 9px;*/
  width: 0.47vw;
  /*height: 38px;*/
  height: 1.98vw;
  background-color: #d32140;
}

.content.store .textbox_wrapper .bld
{
  /*margin-bottom: 10px;
  font-size: 23px;
  font-weight: 500;*/
  margin-bottom: 0.5vw;
  font-size: 1.2vw;
  font-weight: 500;
}

.content.store .textbox_wrapper p
{
  /*font-size: 19px;*/
  font-size: 0.99vw;
  font-weight: 100;
}

/*====================================================
                         store_convenience
=====================================================*/
.content.convenience .img_wrapper
{
  width: 30.3vw;
  position: absolute;
  bottom:40px;
  left: 17vw;
opacity: 0;


}
.content.convenience .img_wrapper.act_animation{animation: botom1 1.5s ease;bottom: 383px;opacity: 1;}
.content.convenience .img_wrapper ul li
{
  display: inline-block;
  vertical-align: top;
}

.content.convenience .img_wrapper ul li:nth-child(4),
.content.convenience .img_wrapper ul li:nth-child(5),
.content.convenience .img_wrapper ul li:nth-child(6)
{
  margin:40px 0;
}

.content.convenience .img_wrapper ul li:nth-child(2),
.content.convenience .img_wrapper ul li:nth-child(5),
.content.convenience .img_wrapper ul li:nth-child(8)
{
  /*margin-left: 24.5px;
  margin-right: 24.5px;*/
  margin-left: 1.3vw;
  margin-right: 1.3vw;
}


.content.convenience .img_wrapper ul li:nth-child(1),
.content.convenience .img_wrapper ul li:nth-child(4),
.content.convenience .img_wrapper ul li:nth-child(7)
{
  width:9.7vw;
}

.content.convenience .img_wrapper ul li:nth-child(2),
.content.convenience .img_wrapper ul li:nth-child(5),
.content.convenience .img_wrapper ul li:nth-child(8)
{
  width:10vw;
}

.content.convenience .img_wrapper ul li:nth-child(3),
.content.convenience .img_wrapper ul li:nth-child(6),
.content.convenience .img_wrapper ul li:nth-child(9)
{
  width:7.8vw;
}



.content.convenience .img_wrapper li
{

}

.content.convenience .img_wrapper li img
{
  width: 100%;
}

/*
.content.convenience .img_wrapper li.img01.act_animation
{
  animation:  fadeInLeft 1s ;
  -ms-animation:  fadeInLeft 1s ;
  -webkit-animation:  fadeInLeft 1s ;
  -moz-animation:  fadeInLeft 1s ; 
  -o-animation:  fadeInLeft 1s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.content.convenience .img_wrapper li.img02.act_animation
{
  animation:  fadeInLeft 1s 1s;
  -ms-animation:  fadeInLeft 1s 1s;
  -webkit-animation:  fadeInLeft 1s 1s;
  -moz-animation:  fadeInLeft 1s 1s; 
  -o-animation:  fadeInLeft 1s 1s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.content.convenience .img_wrapper li.img03.act_animation
{
  animation:  fadeInLeft 1s 2s;
  -ms-animation:  fadeInLeft 1s 2s;
  -webkit-animation:  fadeInLeft 1s 2s;
  -moz-animation:  fadeInLeft 1s 2s; 
  -o-animation:  fadeInLeft 1s 2s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.content.convenience .img_wrapper li.img04.act_animation
{
  animation:  fadeInLeft 1s 3s;
  -ms-animation:  fadeInLeft 1s 3s;
  -webkit-animation:  fadeInLeft 1s 3s;
  -moz-animation:  fadeInLeft 1s 3s; 
  -o-animation:  fadeInLeft 1s 3s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.content.convenience .img_wrapper li.img05.act_animation
{
  animation:  fadeInLeft 1s 4s;
  -ms-animation:  fadeInLeft 1s 4s;
  -webkit-animation:  fadeInLeft 1s 4s;
  -moz-animation:  fadeInLeft 1s 4s; 
  -o-animation:  fadeInLeft 1s 4s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.content.convenience .img_wrapper li.img06.act_animation
{
  animation:  fadeInLeft 1s 5s;
  -ms-animation:  fadeInLeft 1s 5s;
  -webkit-animation:  fadeInLeft 1s 5s;
  -moz-animation:  fadeInLeft 1s 5s; 
  -o-animation:  fadeInLeft 1s 5s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.content.convenience .img_wrapper li.img07.act_animation
{
  animation:  fadeInLeft 1s 6s;
  -ms-animation:  fadeInLeft 1s 6s;
  -webkit-animation:  fadeInLeft 1s 6s;
  -moz-animation:  fadeInLeft 1s 6s; 
  -o-animation:  fadeInLeft 1s 6s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.content.convenience .img_wrapper li.img08.act_animation
{
  animation:  fadeInLeft 1s 7s;
  -ms-animation:  fadeInLeft 1s 7s;
  -webkit-animation:  fadeInLeft 1s 7s;
  -moz-animation:  fadeInLeft 1s 7s; 
  -o-animation:  fadeInLeft 1s 7s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.content.convenience .img_wrapper li.img09.act_animation
{
  animation:  fadeInLeft 1s 8s;
  -ms-animation:  fadeInLeft 1s 8s;
  -webkit-animation:  fadeInLeft 1s 8s;
  -moz-animation:  fadeInLeft 1s 8s; 
  -o-animation:  fadeInLeft 1s 8s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
*/


@keyframes botom1 {
  from {
    opacity: 0;
    /*-webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);*/
    bottom: 40px;
  }

  to {
    opacity: 1;
    /*-webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);*/
    bottom: 383px;
  }

}




/*====================================================
                   store_vendingmachine
=====================================================*/

@-webkit-keyframes fadeInLefttype {
  from {
    opacity: 0;
    /*-webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);*/
    left: -670px;
  }

  to {
    opacity: 1;
    /*-webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);*/
    left:276px;
    /*left: 13.9vw;
*/  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    /*-webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);*/
    left: -670px
  }

  to {
    opacity: 1;
    /*-webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);*/
    left: 276px;
    /*left: 13.9vw;*/
  }

}
.content.vendingmachine .img_wrapper.fadeInLeft
{
  animation:  fadeInLefttype 2s ;
  -ms-animation:  fadeInLefttype 2s ;
  -webkit-animation:  fadeInLefttype 2s ;
  -moz-animation:  fadeInLefttype 2s ; 
  -o-animation:  fadeInLefttype 2s; 
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  /*width:727px;
  height: 781px;*/
  width:29.3vw;
  /*height: 40.7vw;*/

}



.content.vendingmachine .img_wrapper
{
  width:29.3vw;
  position: absolute;
  bottom: 0;
  left: -670px;
}

.content.vendingmachine .img_wrapper img
{
  width:100%;
}

/*====================================================
                         advertisement01
=====================================================*/
/*top banner*/
.common.advertisement .fade.slider .bg1
{
 background: #eee;
 min-width: 1250px;
}

.common.advertisement .fade.slider .bg1.on
{
 filter:blur(2px);
 transition: -webkit-filter 4s  ease-in 2s ;
 transition: filter 4s   ease-in 2s;
 transition: filter 4s   ease-in 2s, -webkit-filter 4s ease-in 2s ;
}


.common.advertisement .fade.slider .bg2
{
 background: #eee;
 min-width: 1250px;
}

.common.advertisement .fade.slider .bg3
{
 background: #eee;
 min-width:1250px;
}

.common.advertisement .fade.slider .slick-active .bg1
.common.advertisement .fade.slider .slick-active .bg2,
.common.advertisement .fade.slider .slick-active .bg3
{
 filter:blur(2px);
 transition: -webkit-filter 4s  ease-in 2s ;
 transition: filter 4s   ease-in 2s;
 transition: filter 4s   ease-in 2s, -webkit-filter 4s ease-in 2s ;
}


.banner_wrapper.advertisement .txt_wrapper .title,
.banner_wrapper.advertisement .txt_wrapper .title span,
.banner_wrapper.advertisement .txt_wrapper .des_txt
{
  color:#fff;
}




/*menu*/
.content.advertisement .tab_menu ul li
{
  width: 16.666666%;
  position: relative;
}


/*submenu*/

.content.advertisement .tab_menu ul li ol
{
  width: 100%;
  background-color: #fff;
  border:1px solid #e5e5e5;
  position: absolute;
  left: 0;
  opacity: 0;
  height:0px;
  transition: all 0.5s;display: none;
}

.content.advertisement .tab_menu ul li:first-child:hover ol
{
  opacity: 1;
    display: block;
  height: 352px;
}

.content.advertisement .tab_menu ul li ol li
{
  width: 100%;
  display: block;
  border-bottom: 1px solid #e5e5e5;
}

.content.advertisement .tab_menu ul li ol li:last-child
{
  border-bottom: none;
}

.content.advertisement .tab_menu ul li ol li a
{
  color:#444;
  font-weight: 500;
}

.content.advertisement .tab_menu ul li ol li:hover a
{
  color:#fff;
}



/*하단slide01*/
.content.advertisement .content_wrapper.advertisement01 .slick-prev
{
  right: 130px;
}

.content.advertisement .content_wrapper.advertisement01 .slide_area .slick_left_end
{
    right: 150px;
}

/*하단slide02*/
.content.advertisement .content_wrapper.advertisement02 .slick-prev
{
  right: 130px;
}

.content.advertisement .content_wrapper.advertisement02 .slide_area .slick_left_end
{
  right: 150px;
}

/*하단slide03*/

.content.advertisement .content_wrapper .txt_wrapper .des_area
{
  height: 54PX;
}

.content.advertisement .content_wrapper .slick-prev
{
  right: 210px;
}

.content.advertisement .content_wrapper .slide_area .slick_left_end
{
  right: 230px;
}

/*하단slide04*/

.content.advertisement .content_wrapper .txt_wrapper .des_area
{
  height: 54PX;
}

.content.advertisement .content_wrapper.advertisement04 .slick-prev
{
  right: 130px;
}

.content.advertisement .content_wrapper.advertisement04 .slide_area .slick_left_end
{
  right: 150px;
}

/*하단slide06*/

.content.advertisement .content_wrapper.advertisement06 .txt_wrapper .des_area
{
  height:79px;
}

.content.advertisement .content_wrapper.advertisement06 .slick-prev
{
  right: 100px;
}

.content.advertisement .content_wrapper.advertisement06  .slide_area .slick_left_end
{
  right: 120px;
}


/*sub01*/
.content.advertisement .content_wrapper.signage.page02.subway00 .slick-prev
{
  right: 210px;
}

.content.advertisement .content_wrapper.signage.page02.subway00 .slide_area .slick_left_end
{
  right: 230px;
}

/*sub02*/
.content.advertisement .content_wrapper.signage.page02 .slick-prev
{
  right: 190px;
}

.content.advertisement .content_wrapper.signage.page02 .slide_area .slick_left_end
{
  right: 210px;
}

/*sub03*/
.content.advertisement .content_wrapper.subway02 .slick-prev
{
  right: 210px;
}

.content.advertisement .content_wrapper.subway02 .slide_area .slick_left_end
{
  right: 230px;
}

/*sub07*/
.content.advertisement .content_wrapper.subway06 .slick-prev
{
  right: 130px;
}
.content.advertisement .content_wrapper.subway06 .slick_left_end
{
 right: 150px;  
}

/*sub06*/
.content.advertisement .content_wrapper.signage.page03 .slick-prev
{
  right: 200px;
}

.content.advertisement .content_wrapper.signage.page03 .slide_area .slick_left_end
{
  right: 220px;
}


/***********************footer***********************/
/********************************************************/

footer
{
  background-color: #191919;
  color: #b8b8b8;
}

footer > div
{
  border-bottom: 1px solid #333;
}

footer > div > ul
{
  width: 80%;
  margin:0 auto;
}

footer > div > ul > li
{
  display: inline-block;
}

footer > div > ul > li:first-child > a
{
  padding-left:0;
}

footer > div > ul > li:first-child > a:before
{
  display: none;
}

footer > div > ul > li > a
{
  color: #b8b8b8;
  height: 49px;
  display: block;
  vertical-align: middle;
  line-height: 49px;
  padding:0 22px;
  position: relative;
  font-size: 13.3px;
}

footer > div > ul > li > a:before
{
  content: '';
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  left: 0;
  width: 1px;
  height: 15px;
  background-color: #b7b7b7;
}

footer address
{
  width: 80%;
  margin:0 auto;
  padding:37px 0;
  font-style: normal;
}

footer address dl dt
{
  display: inline-block;
  font-size: 13.33px;

}

footer address dl dt.space
{
  margin-left: 12px;
}

footer address p
{
  font-size: 13.33px;
}

footer address dl dd
{
  display: inline-block;
  font-size: 13.33px;
}

footer address dl:first-child
{
  margin-bottom: 27px;
}

footer address dl:first-child dd
{
  font-size: 18.67px;
  color:#ffffff;
}

footer address dl:first-child ~ dl
{
  padding-bottom: 5px;
} 



/**************************footer**************************/
/********************************************************/

@media screen and  (max-width: 1400px) 
{
  .autoplay.slider .txt_wrapper
  {
    right: 24%;

  }

  .autoplay.slider .slick-slide.slick-current.slick-active .txt_wrapper
  {
    left: 24%;
  }


  /*comp_history*/
  .content_wrapper.history
  {
    width:1200px;
  }
  .history_content .years
  {
    left: -51px;
  }

  .history_content .year_box .txt_area p
  {
    width: 467px;
  }


}

@media screen and  (max-height: 770px)  
{
  .modal-content
  {
    height:93%;
  }

  .modal-content iframe
  {
    height: 88%;
  }
}

.advertisement_btn{position: relative;}
.clicked_arrow{position: absolute;right: 20px;bottom: 20px;display: none;}
.clicked .clicked_arrow{display: block;}
.clicked_arrow2{position: absolute;right: 20px;bottom: 20px;display: block;}
.clicked .clicked_arrow2{display: none;}
.advertisement_btn:hover .clicked_arrow{display: block;transform: rotate(180deg);}
.advertisement_btn:hover .clicked_arrow2{display: none;}

.greetings_box{overflow: hidden;}
.greetings{position: relative;overflow: hidden;}
.greetings:before{content: '';position: absolute;left: 0;bottom: 149px;width: 100%;height: 1px;background: #444;}
.greetings .greetings_h1{margin-bottom: 70px;}
.greetings_img{float: left;width: 43%;}
.greetings_txt{
    float: left;width: 57%;
    font-size: 16px;color: #444;font-family: 'Noto Sans KR', sans-serif;font-weight: 400;
}
.greetings_txt span{display: block;padding-top: 60px;padding-bottom: 26px;}
.greetings_txt p{line-height: 30px;}
.greetings_span {font-size: 21.3px;padding-left: 390px;letter-spacing: 2px;}

.content.advertisement .content_wrapper.signage.page02.page03 .slick-prev{right: 210px;}
.content.advertisement .content_wrapper.signage.page02.page03 .slide_area .slick_left_end{right: 230px;}

.sub_ul{overflow: hidden;position: absolute;left:212px;top: 8px;}
.sub_li{float: left;padding: 0 10px;position: relative;z-index: 1;}
.sub_li a{display: block;font-size: 16px;font-weight: 400;color: #444;}
.sub_li:before{content: '';position: absolute;right: 0;top: 7px;width: 1px;height: 18px;background: #a0a0a0;}
.sub_li:last-child:before{width: 0;height: 0;}
.sub_li a:hover{font-weight: bold;color: #d32140;}
.sub_ul2{left: 330px;}
.sub_ul3{left: 152px;}
.sub_ul6{left: 313px;}
.sub_ul7{left: 313px;}
.sub_ul8{left: 268px;}
.sub_ul9{left: 152px;}

/*store_manage*/
.banner_wrapper.common.store{position: relative;
z-index:1;
overflow:hidden;
    background:url(/img/store_manage.jpg);background-size: cover;
}
.banner_wrapper.common.store{position: relative;z-index:1;}
.banner_wrapper.common.store:before {
  content: '';
  position: absolute;
  top: 0; left:0; 
  background: inherit;
  z-index:-1;
  filter: blur(2.5px); 
  -webkit-filter: blur(2.5px); 
  -moz-filter: blur(2.5px);
  -o-filter: blur(2.5px);width: 100%;height: 100%;
opacity: 1;transition: all 0.7s 0.5s ease-in-out;transform: translateX(0%);animation: bgani 2s ease-in-out;
}




.store_manage{
    position: absolute;left: 50%;top: 49%;transform:translate(-50%,-50%);color: #fff;font-family: 'Noto Sans KR', sans-serif;text-align: center;
    animation: textani01 2.8s ease-in-out;
}
.store_manage_p{font-size: 56px;font-weight: 300;padding-bottom: 6px;}
.store_manage_p strong{font-weight: 900;}
.store_manage_s{font-size: 18.6px;font-weight: 300;line-height: 27px;}
@keyframes textani01 {
    0%{ opacity: 0;top: 55%;}
    55%{ opacity: 0;top: 55%;}
    100%{opacity: 1;top: 49%;}
}

/* --------------------*/
.txt_wrapper1{
position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50% );
    text-align: center;
    opacity: 1;color: #fff;font-family: 'Noto Sans KR', sans-serif;z-index: 2;
}

.common .fade.slider .slick-slide.slick-current.slick-active .txt_wrapper.txt_wrapper1 {color: #fff;text-transform: uppercase;}
.common .fade.slider .slick-slide.slick-current.slick-active .txt_wrapper.txt_wrapper1 p{color: #fff;}

.for_position .bg01{background:url(/img/news01.jpg) no-repeat;height: 912px;position: relative;z-index:1;overflow: hidden;background-size: cover;}
.for_position .bg02{background:url(/img/news02.jpg) no-repeat;height: 912px;position: relative;z-index:1;overflow: hidden;background-size: cover;}
.for_position .bg03{background:url(/img/news03.jpg) no-repeat;height: 912px;position: relative;z-index:1;overflow: hidden;background-size: cover;}



.news_manage_p.title{font-size: 56px;font-weight: 300;text-transform: uppercase; }
.news_manage_p.title strong{font-weight: 700;padding-bottom: 6px;}
.news_manage_s{font-size: 16.6px;font-weight: 300;line-height: 27px;}
.banner_wrapper.common 
{
  width:100%;
 /* background:url('../img/directions_top_banner.jpg') no-repeat;*/
  position: relative;
  /*background-size: 100% 100%;*/
    background: #eee;

}



.common.news .fade.slider .bg1
{
 background:url('../img/news01.jpg') no-repeat center;
 height: 912px;
 background-size: cover;
 -webkit-transform: scale(1.05) rotate(0.01deg);
 -ms-transform: scale(1.05) rotate(0.01deg);
 transform: scale(1.05) rotate(0.01deg);
 -webkit-transition: -webkit-transform 3s  ease-in ;
 transition: -webkit-transform 3s  ease-in ;
 transition: transform 3s   ease-in ;
 transition: transform 3s   ease-in , -webkit-transform 3s ease-in ;
 min-width: 1250px;
}

.common.news .fade.slider .bg2
{
 background:url('../img/news02.jpg') no-repeat center;
 height: 912px;
 background-size: cover;
 -webkit-transform: scale(1.05) rotate(0.01deg);
 -ms-transform: scale(1.05) rotate(0.01deg);
 transform: scale(1.05) rotate(0.01deg);
 -webkit-transition: -webkit-transform 4s ease-in 2s;
 transition: -webkit-transform 4s ease-in 2s;
 transition: transform 4s  ease-in 2s;
 transition: transform 4s  ease-in 2s, -webkit-transform 4s ease-in 2s;
 min-width: 1250px;
}

.common.news .fade.slider .bg3
{
 background:url('../img/news03.jpg') no-repeat center;
 height: 912px;
 background-size: cover;
 -webkit-transform: scale(1.05) rotate(0.01deg);
 -ms-transform: scale(1.05) rotate(0.01deg);
 transform: scale(1.05) rotate(0.01deg);
 -webkit-transition: -webkit-transform 4s ease-in 2s;
 transition: -webkit-transform 4s ease-in 2s;
 transition: transform 4s  ease-in 2s;
 transition: transform 4s  ease-in 2s, -webkit-transform 4s ease-in 2s;
 min-width:1250px;
}

.common .fade.slider .bg1.on
{
  -webkit-transform: scale(1) rotate(0deg);
  -ms-transform: scale(1) rotate(0deg);
  transform: scale(1) rotate(0deg);
}

.common .fade.slider .slick-slide.slick-current.slick-active .bg2,
.common .fade.slider .slick-slide.slick-current.slick-active .bg3

{
  -webkit-transform: scale(1) rotate(0deg);
  -ms-transform: scale(1) rotate(0deg);
  transform: scale(1) rotate(0deg);
}


/*top banner slide txt txt*/
.common .fade.slider .for_position
{
  position: relative;
}
.common .fade.slider .txt_wrapper.txt_wrapper1
{
    width: 690px;
  position: absolute;
  top:50%;
  left: 50%;
  transform: translate(-50%, -50% );
  text-align: center;

  opacity:1;
}

.common.company .fade.slider .txt_wrapper
{
  position: absolute;
  top:50%;
  left: 50%;
  transform: translate(-50%, -50% );
  text-align: center;
    width: 95%;
  opacity:1;
}






/*---------*/
.banner_wrapper.common.psd{position: relative;
z-index:1;
overflow:hidden;
    background:url(/img/port01.jpg);
    background-size: cover;
}
.banner_wrapper.common.psd{position: relative;z-index:1;}
.banner_wrapper.common.psd:before {
  content: '';
  position: absolute;
  top: 0; left:0; 
  background: inherit;
  z-index:-1;
  filter: blur(2.5px) brightness(70%); 
  -webkit-filter: blur(2.5px) brightness(70%); 
  -moz-filter: blur(2.5px) brightness(70%);
  -o-filter: blur(2.5px) brightness(70%);width: 100%;height: 100%;
opacity: 1;transition: all 0.7s 0.5s ease-in-out;transform: translateX(0%);animation: bgani 2s ease-in-out;
}




.store_manage{
    position: absolute;left: 50%;top: 49%;transform:translate(-50%,-50%);color: #fff;font-family: 'Noto Sans KR', sans-serif;text-align: center;
    animation: textani01 2.8s ease-in-out;
}
.store_manage_p{font-size: 56px;font-weight: 300;padding-bottom: 6px;}
.store_manage_p strong{font-weight: 900;}
.store_manage_s{font-size: 18.6px;font-weight: 300;line-height: 27px;}
@keyframes textani01 {
    0%{ opacity: 0;top: 55%;}
    55%{ opacity: 0;top: 55%;}
    100%{opacity: 1;top: 49%;}
}


.content_wrapper.signage02 .slick-prev{
   /* right: 180px;*/
    right: 210px
}
.content_wrapper.signage02 .slide_area .slick_left_end{/*right: 200px;*/ right: 230px}


/*--------------*/


.banner_wrapper.common.advertisement{position: relative;
z-index:1;
overflow:hidden;
    background:url(/img/board01.jpg);
    background-size: cover;
}
.banner_wrapper.common.advertisement{position: relative;z-index:1;}
.banner_wrapper.common.advertisement:before {
  content: '';
  position: absolute;
  top: 0; left:0; 
  background: inherit;
  z-index:-1;
  filter: blur(2.5px) brightness(75%); 
  -webkit-filter: blur(2.5px) brightness(75%); 
  -moz-filter: blur(2.5px) brightness(75%);
  -o-filter: blur(2.5px) brightness(75%);

    width: 100%;height: 100%;
opacity: 1;transition: all 0.7s 0.5s ease-in-out;transform: translateX(0%);animation: bgani 2s ease-in-out;
}




.store_manage{
    position: absolute;left: 50%;top: 49%;transform:translate(-50%,-50%);color: #fff;font-family: 'Noto Sans KR', sans-serif;text-align: center;
    animation: textani01 2.8s ease-in-out;width: 95%;
}
.store_manage_p{font-size: 56px;font-weight: 300;padding-bottom: 6px;}
.store_manage_p strong{font-weight: 900;}
.store_manage_s{font-size: 18.6px;font-weight: 300;line-height: 27px;}
@keyframes textani01 {
    0%{ opacity: 0;top: 55%;}
    55%{ opacity: 0;top: 55%;}
    100%{opacity: 1;top: 49%;}
}

/*------------*/
.banner_wrapper.common.inquiry{position: relative;
z-index:1;
overflow:hidden;
    background:url(/img/inquiry.jpg);
    background-size: cover;
}
.banner_wrapper.common.inquiry{position: relative;z-index:1;}
.banner_wrapper.common.inquiry:before {
  content: '';
  position: absolute;
  top: 0; left:0; 
  background: inherit;
  z-index:-1;
  filter: blur(2.5px); 
  -webkit-filter: blur(2.5px); 
  -moz-filter: blur(2.5px);
  -o-filter: blur(2.5px);width: 100%;height: 100%;
opacity: 1;transition: all 0.7s 0.5s ease-in-out;transform: translateX(0%);animation: bgani 2s ease-in-out;
}



.inquiry .store_manage{
    position: absolute;left: 50%;top: 49%;transform:translate(-50%,-50%);font-family: 'Noto Sans KR', sans-serif;text-align: center;
    animation: textani01 2.8s ease-in-out;
}
.inquiry .store_manage_p{font-size: 56px;font-weight: 400;padding-bottom: 6px;color: #2c2c2c;}
.inquiry .store_manage_p strong{font-weight: 900;}
.inquiry .store_manage_s{font-size: 18.6px;font-weight: 400;line-height: 27px;color: #444;}
@keyframes textani01 {
    0%{ opacity: 0;top: 55%;}
    55%{ opacity: 0;top: 55%;}
    100%{opacity: 1;top: 49%;}
}

/*-----------------*/

.banner_wrapper.common.signage{position: relative;
z-index:1;
overflow:hidden;
    background:url(/img/digital01.jpg) 0;
    background-size: cover;
}
.banner_wrapper.common.signage{position: relative;z-index:1;}
.banner_wrapper.common.signage:before {
  content: '';
  position: absolute;
  top: 0; left:0; 
  background: inherit;
  z-index:-1;
  filter: blur(2.5px) brightness(60%); 
  -webkit-filter: blur(2.5px) brightness(60%); 
  -moz-filter: blur(2.5px) brightness(60%);
  -o-filter: blur(2.5px) brightness(60%);width: 100%;height: 100%;
opacity: 1;transition: all 0.7s 0.5s ease-in-out;transform: translateX(0%);animation: bgani 2s ease-in-out;
}

@keyframes bgani {
    0%{ opacity: 0;}
    50%{ opacity: 0;}
    100%{opacity: 1;}
}


.signage .store_manage{
    position: absolute;left: 50%;top: 49%;transform:translate(-50%,-50%);font-family: 'Noto Sans KR', sans-serif;text-align: center;
    animation: textani01 2.8s ease-in-out;text-transform: uppercase;color: #fff;width: 95%;
}
.signage .store_manage_p{font-size: 56px;font-weight: 300;padding-bottom: 6px;color: #fff;}
.signage .store_manage_p strong{font-weight: 900;}
.signage .store_manage_s{font-size: 18.6px;font-weight: 300;line-height: 27px;color: #fff;}
@keyframes textani01 {
    0%{ opacity: 0;top: 55%;}
    55%{ opacity: 0;top: 55%;}
    100%{opacity: 1;top: 49%;}
}


.content_wrapper.portfolio .ptag_wrapper.ptag_wrapper1{left: 203px;}
.content_wrapper.portfolio .ptag_wrapper.ptag_wrapper2{left: 165px;}

.banner_wrapper.common .txt_wrapper.txt_wrapper001 .title{font-weight: 300;}



.content_wrapper.portfolio .list_wrapper .txt_area2
{
  height: 67px;
  padding:23px 0 23px 15px;
  position: relative;
}

.content_wrapper.portfolio .list_wrapper a.inner_wrapper:hover .txt_area2:before
{
  content: '';
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 67px;
  background-color: #d32140;
}



.content_wrapper.portfolio .list_wrapper .txt_area2 p
{
  font-size: 16px;
  margin-bottom: 70px;
  position: relative;
  line-height: 16px;display: inline-block;
}

.content_wrapper.portfolio .list_wrapper a.inner_wrapper:hover .txt_area2 p
{
  color:#fff;
}



.content_wrapper.portfolio .list_wrapper .txt_area2 p:last-child:before
{
  content:'';
  position: absolute;
  height: 0px;
  width: 31px;
  background-color: #d32140;
  top:-15px;

}

.content_wrapper.portfolio .list_wrapper a.inner_wrapper:hover .txt_area2 p:last-child:before
{
  content:'';
  position: absolute;
  height: 13px;
  width: 37px;
  background:url(../img/store_arrow.png) no-repeat;
  top:4px;
  right:-45px;
  display: block;
}
.content.store .slider_wrapper{position: relative;}
.content.store .design_prearrow{position: absolute;
    top: 54%;
    left: 54px;
    background: url(../img/slidearrow_left.png) no-repeat;
    width: 37px;
    height: 12px;

    display: block;
    cursor: pointer;
    z-index: 20;}
.content.store .design_nxtarrow{    position: absolute;
    top: 54%;
    left: 134px;
    background: url(../img/slidearrow_right.png) no-repeat;
    width: 35px;
    height: 11px;
    background-size: 100% 100%;
    display: block;
    cursor: pointer;
    z-index: 20;}
.content.store .design_nxtarrow:hover{background: url(../img/red_slidearrow_right.png) no-repeat;}
.content.store .design_prearrow:hover{background: url(../img/red_slidearrow_left.png) no-repeat;}

/* IE9, IE10 */
@media screen and (min-width:0\0) {
.company.common .slider.fade .txt_wrapper{
    transform: translateX(-50%) translateY(-50%);

    }
    .common .slider.fade .txt_wrapper1.txt_wrapper{ transform: translateX(-50%) translateY(-50%);

    }
    .inquiry .store_manage{
    position: absolute;left: 50%;top: 48%;transform:translate(-50%,-50%);font-family: 'Noto Sans KR', sans-serif;text-align: center;
    animation: textani02 1.7s ease-in-out;
}
    .store_manage{
    position: absolute;left: 50%;top: 48%;transform:translate(-50%,-50%);font-family: 'Noto Sans KR', sans-serif;text-align: center;
    animation: textani02 1.7s ease-in-out;
}
    .signage .store_manage{ position: absolute;left: 50%;top: 48%;transform:translate(-50%,-50%);font-family: 'Noto Sans KR', sans-serif;text-align: center;
    animation: textani02 1.7s ease-in-out;}
@keyframes textani02 {
    0%{ opacity: 0;top: 55%;transform:translate(-50%,-50%);}
    10%{ opacity: 0;top: 55%;transform:translate(-50%,-50%);}
    90%{opacity: 1;top: 48%;transform:translate(-50%,-50%);}
    100%{opacity: 1;top: 58%;transform:translate(-50%,-50%);}
}

}
@media (max-width: 1680px) {
    .history_content .years{left: -5%;}

}
@media (max-width: 1540px) {
    .signage .store_manage_s{font-size: 18px;}
    
}
@media (max-width: 1460px) {
    .greetings_txt{font-size: 15px;}

}
@media (max-width: 1440px) {
    .greetings_txt{font-size: 14.5px;}
    .greetings_span{padding-left: 300px;}
    
    .content_wrapper h1{padding-left: 53px}
    .content_wrapper h1:before{left: 27px}
    .content_wrapper.portfolio .title_wrapper h1{padding-left: 23px}
    .content_wrapper.portfolio .title_wrapper h1:before{left: 0px}
    
}
@media (max-width: 1400px) {
    .signage .store_manage_s{font-size: 16.4px;}
    .content_wrapper.signage .txt_wrapper .des_area p{font-size: 17px;}
    .sub_li{padding: 0 6px;}
    nav .nav-block .first-depth, nav .thrid-block{font-size: 0.95rem;}
     .mu_fi{font-size: 0.9rem;}
    .history_content .years{display: none}
}

@media (max-width: 1366px) {
    .content_wrapper h1{padding-left: 88px}
    .content_wrapper h1:before{left: 56px}
}
    
@media (max-width: 1360px) {
    .greetings_txt{font-size: 14px;}
    .greetings_span{padding-left: 280px;}
    .content_wrapper.signage .txt_wrapper .des_area p{font-size: 17.5px;}
    
    
}
@media (max-width: 1280px) {
    .greetings_txt{font-size: 13px;padding-left: 10px;}
    .greetings_span{padding-left: 250px;}
    .content .tab_menu ul{width: 80%;}
    .content_wrapper.signage .txt_wrapper .des_area p{font-size: 16.5px;}
    .sub_li a{font-size: 15px;}
    .history_content .years{display: none}
    
    .content_wrapper h1{padding-left: 118px}
    .content_wrapper h1:before{left: 88px}
    
   
    
    
}
@media (max-width: 1152px) {
    .greetings_txt{padding-left: 73px;}
    .greetings_span{padding-left: 267px;}
    .greetings_txt span img {padding-left: 0!important;}
    .content_wrapper.introduction .comp_motto .des_txt p{font-size: 12.5px;}
    .content_wrapper.signage .txt_wrapper .des_area p{font-size: 20px;}
    .sub_li a{font-size: 13px;}
    .content_wrapper.portfolio .list_wrapper a.inner_wrapper{width: 32.45333333333333%}
     .content_wrapper.portfolio .list_wrapper a.inner_wrapper:nth-child(3n){margin-right: 0 !important}
    .content_wrapper.portfolio .list_wrapper a.inner_wrapper:nth-child(4n){margin-right: 1.32%}
}

@media (max-width: 1024px) {
    .greetings_txt{padding-left: 123px;}
    .greetings_txt p{line-height: 25px;}
    .greetings_span{padding-left: 150px;}
    .content_wrapper.introduction .comp_motto .des_txt p{font-size: 14px;}
    .content_wrapper.signage .txt_wrapper .des_area p{font-size: 19.5px;}
    .sub_li a{font-size: 12px;}
    .sub_li {padding: 0 5px;}
    
    
    .content_wrapper.history{width: 990px}
    .history_content .year_box .right .num_area > span{font-size: 67px}
    .history_content .year_box .left .num_area > span{font-size: 67px}
    
    .history_content .year_box.yr2022 .right img{width: 365px; margin-top: 30px}
    .history_content .year_box.yr2021 .left img{width: 277px}
    .history_content .year_box.yr2020 .right img{width: 367px; margin-top: 70px}
    .history_content .year_box.yr2019 .left img{width: 367px}
    .history_content .year_box .left{padding-left: 56px;}
    .history_content .year_box .right{padding-left: 63px;}
    .history_content .year_box .txt_area p{width: 382px; font-size: 14px;}
    .history_content .year_box .txt_area .bld_txt{font-size: 15px}
    .history_content .year_box.yr2019 .right .num_area .img1.on{left: 201px}
    .history_content .year_box.yr2019 .right .num_area .img2.on{left: 271px}
    .history_content .year_box.yr2018 .left .num_area img.on{left: 208px}
    .history_content .year_box.yr2018 .right img{width: 410px; margin-top: 30px}
    .history_content .year_box.yr2017 .left img{width: 410px}
    .history_content .year_box.yr2017 .right .num_area .img1.on{left: 201px}
    .history_content .year_box.yr2017 .right .num_area .img2.on{left: 271px}
    .history_content .year_box.yr2016 .right{padding-left: 70px}
    .history_content .year_box.yr2016 .right img{width: 350px}
    .history_content .year_box.yr2016 .left .num_area .img1.on{left: 208px}
    .history_content .year_box.yr2016 .left .num_area .img2.on{left: 271px}
    .history_content .year_box.yr2015 .right .num_area .img1.on{left: 201px}
    .history_content .year_box.yr2014 .right{padding-left: 71px;}
    .history_content .year_box.yr2014 .left .num_area .img1.on{left: 208px}
    .history_content .year_box.yr2013 .left img{width: 420px; margin-top: 20px}
    .history_content .year_box.yr2013 .right .num_area .img1.on{left: 201px;}
    .history_content .year_box.yr2012 .right{padding-left: 83px}
    .history_content .year_box.yr2012 .left .num_area .img1.on{left: 208px}
    .history_content .year_box.yr2012 .left .num_area .img2.on{left: 271px}
    .history_content .year_box.yr2011 .left img{width: 410px}
    .history_content .year_box.yr2011 .right .num_area .img1.on{left: 201px}
    .history_content .year_box.yr2010 .right{padding-left: 103px}
    .history_content .year_box.yr2010 .left .num_area .img1.on{left: 208px}
    .history_content .year_box.yr2010 .left .num_area .img2.on{left: 271px}
    .history_content .year_box.yr2009 .left img{width: 420px; margin-top: 20px}
    .history_content .year_box.yr2009 .right .num_area .img1.on{left: 201px}
    .history_content .year_box.yr2009 .right .num_area .img2.on{left: 271px}
    .history_content .year_box.yr2008 .left .num_area .img1.on{left: 208px}
    .history_content .year_box.yr2008 .right{padding-left: 92px}
    .history_content .year_box.yr2007 .left img{width: 430px; margin-top: 20px}
    .history_content .year_box.yr2007 .right .num_area .img1.on{left: 201px}
    .history_content .year_box.yr2006 .right{padding-left: 103px}
    .history_content .year_box.yr2006 .left .num_area .img1.on{left: 208px}
    .history_content .year_box.yr2006 .left .num_area .img2.on{left: 271px}
    .history_content .year_box.yr2004 .left img{width: 410px; margin-top: 30px}
    .history_content .year_box.yr2004 .right .num_area .img1.on{left: 201px}
    
    .content_wrapper h1:before{left: 86px}
    .content_wrapper h1{padding-left: 108px}
    .history_content .year_box.yr2019 .left{padding-left: 85px}
}



.content_wrapper.portfolio .fade.slider .slick-slide img{position: absolute; top: 0; left: 50%; transform:translateX(-50%)}