/* ========== COMMON ========== */



.m-scroll { display: none; margin: auto; max-width: 360px; width: 100%; }
[data-scroll="false"] { overflow-y: hidden; }

.clearfix:after { content: ''; display: table; clear: both; }
ul.list:after { content: ''; display: table; clear: both; }
ul.list > li { float: left; }
.fLeft { float: left; }
.fRight { float: right; }
.aRight { text-align: right; }

/* ------- Grid ------- */
.grid { font-size: 0; }
.grid:after { content: ''; display: block; clear: both; }
.grid > div,
.grid > li { display: inline-block; vertical-align: top; padding: 10px; font-size: medium; }
.grid > div > ._g,
.grid > li > ._g { height: 100%; }
/* 1 col */
.grid-24 { width: 100%; }
/* 2 col */
.grid-12 { width: 50%; }
/* 3 col */
.grid-8 { width: 33.333333%; }
/* 4 col */
.grid-6 { width: 25%; }
/* 5 col */
.grid-5 { width: 20%; }
/* 6 col */
.grid-4 { width: 16.66666%; }
/* 9 col */
.grid-9 { width: 11.11111%; }
@media (max-width: 1024px){
    .grid-4 { width: 33.33333%; }
    .grid-9 { width: 16.666666%; }
}
@media (max-width: 768px){
    .grid-6 { width: 50%; }
    .grid-5 { width: 33.33333%; }
    .grid-9 { width: 33.33333%; }
}
@media (max-width: 600px){
    .grid-8 { width: 100%; }
    .grid-5 { width: 100%; }
    .grid-4 { width: 50%; }
}




.img { position: relative; }
.img:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: transparent; }


.imgz { display: none; text-align: center; font-size: 13px; }
.imgz:before { content: ''; display: inline-block; vertical-align: -12px; margin-right: 2px; width: 35px; height: 35px; background: url('./file/zoom.png') no-repeat center / 35px auto; }
.imgz:after { content: '이미지를 클릭하시면 크게 볼 수 있습니다.'; }
@media (max-width:768px) {
    .imgz { display: block; }
}




.slick-prev { overflow: hidden; text-indent: -99999px; position: absolute; top: 0; bottom: 0; left: 0; margin: auto; }
.slick-next { overflow: hidden; text-indent: -99999px; position: absolute; top: 0; bottom: 0; right: 0; margin: auto; }
.slick-slide:focus { outline: none; }
.slick-initialized .slick-slide { overflow: hidden; }
.slick-dots { position: absolute; left: 0; bottom: 50px; width: 100%; text-align: center; font-size: 0; }
.slick-dots li { overflow: hidden; text-indent: -999999px; display: inline-block; vertical-align: top; margin: 0 5px; cursor: pointer; }


.float:after { content: ''; display: block; clear: both; }
.f-left { float: left; }
.f-right { float: right; }


.centre { display: table; width: 100%; height: 100%; }
.centre .inner { display: table-cell; vertical-align: middle; width: 100%; height: 100%; }



.sub_vi {background: url('/htm/tiger/img/img2.jpg') no-repeat   center; width:100%; display:inline-block;   color:#fff; text-align:center;box-sizing:border-box;}
.sub_vi div {width:100%; padding:200px 0 100px 0; height:100%; display:inline-block; background:rgba(0,0,0,.3);}
.sub_vi b {font-size:3rem; font-weight:700; }
.sub_vi p {font-size:1.3rem; font-weight:500; }
 ul.sub_menu {width:100%; margin-bottom:50px; display:inline-block}
 ul.sub_menu li {float:left; background-color:#f9f9f9; text-align:center; width:20%; line-height:50px; font-size:1.1rem; color:#333; box-sizing:border-box; border:1px solid #fff}

 .sub_in {width:100%; display:inline-block; margin-top:80px; text-align:center;}
.sub_in h2 {font-size:2rem; color:#333;   width:100%; display:inline-block; padding-bottom:30px}
.content {width:80%; max-width:1300px; margin:0 auto}

.navigatonBox {
  width:100%; float:left; position:relative; border-bottom:1px solid #ddd;
}


.buttonGroup {
  overflow-x: auto;
  white-space: nowrap;

  -webkit-overflow-scrolling: touch;
}
.navButton, .option {
  display: inline-block;
  margin-right:12px;
  cursor:default;
}

.navButton {}
.navButton a {font-size:0.95em; line-height:45px; font-weight:400; color:#777; }
a.button_ov {font-weight:600; color:#333 !important; border-bottom:1.5px solid #333;}

.navButton:last-child {
  margin-right:20px;
}
.navButton:first-child {
  margin-left:20px;
}
.optionGroup {
  width:100%;
  height:100px;
  position:absolute;
  top:50px;
  left:0;
}

.option {
  position:absolute;
  top:0;
  left:0;
  padding: 5px 10px;
  border:1px solid #DDD;
  border-radius:3px;
}

.option p {
  margin:0 0 5px;
  white-space: nowrap;
}

.option p:hover {
  background-color:#EEE;
}

.arrow {
  width:20px;
  height:15px;
  position:absolute;
  top:15px;
  background-color:white;
}

.arrow::before {
  content:'';
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  background-size:100% 100%;
  background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjY0cHgiIGhlaWdodD0iNjRweCIgdmlld0JveD0iMCAwIDMwNiAzMDYiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDMwNiAzMDY7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGc+Cgk8ZyBpZD0iY2hldnJvbi1yaWdodCI+CgkJPHBvbHlnb24gcG9pbnRzPSI5NC4zNSwwIDU4LjY1LDM1LjcgMTc1Ljk1LDE1MyA1OC42NSwyNzAuMyA5NC4zNSwzMDYgMjQ3LjM1LDE1MyAgICIgZmlsbD0iIzAwMDAwMCIvPgoJPC9nPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+Cjwvc3ZnPgo=)
}

.arrow.left {
  left:0;
  transform:rotate(180deg);
}
.arrow.right {
  right:0;
}


.text_box {font-size:1rem; line-height:1.6em; color:#555; letter-spacing:0;}
.text_box b {font-weight:600; color:#333; font-size:1.2rem}


 footer {background:rgba(0,0,0,.6); text-align:center; position:absolute; bottom:0; left:0; width:100% ; z-index:9999; color:rgba(255,255,255,.7); font-size:0.84rem; letter-spacing:0.5px; padding:30px 3%; box-sizing:border-box; line-height:1.6em}
 footer.sub_footer {  position:static; margin-top:150px; background-color:#333; }

 @media (max-width:1200px) {

.sub_vi div {padding:120px 0 70px  0; }
.sub_vi ul {display:none}
.sub_vi b  {font-size:2rem}
.sub_vi p {font-size:1rem}

.sub_in {margin-top:50px}
.sub_in h2 {font-size:1.5rem; color:#333;   width:100%; display:inline-block; padding-bottom:20px}
.content {width:90%; margin:0 auto}

.text_box {font-size:0.95rem; line-height:1.5em; color:#555; letter-spacing:0;}
.text_box b {width:100%; display:block; padding-bottom:10px; line-height:1.4em}

footer {font-size:0.75rem;  }
footer.sub_footer {margin-top:70px}
  }



/* 상단 메뉴 */
 .topmn_ul  {
  position:relative;
  width:100%;
  box-sizing:border-box;
  padding-top:55px;
  padding-right:310px;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  list-style: none;
  z-index:9999999999;
}

.topmn_ul>li {
  margin-right: 20px ;
  line-height:30px;
}

/* Underline styles */
.topmn_ul a {
  display: block;
  position: relative;
  text-decoration: none;
  color:#BCB9D4 !important;
  font-weight:300  !important;
  font-family: 'Noto Sans', sans-serif;
}

/* Fade in */
.topmn_ul a::after {
  content: '';
  position: absolute;
  bottom: 0px;
  left: 0;
  width: 100%;
  height: 1px;
  opacity: 0;
  transition: opacity 300ms, transform 300ms;
}

.topmn_ul a:hover::after,
.topmn_ul a:focus::after {
  opacity: 1;
  background: #000;
  transform: translate3d(0, 0.2em, 0);
  color:#29235C  !important;
}

/* Slide in */
.topmn_ul li a {
  overflow: hidden;
  font-size:20px;
  font-family:"Noto Sans"
}

.topmn_ul li a:hover { color:#29235C  !important;}

.topmn_ul li a::after {
  opacity: 1;
  transform: translate3d(-100%, 0, 0);
}

.topmn_ul li a:hover::after,
.topmn_ul li a:focus::after{
  transform: translate3d(0, 0, 0);
}

.topmn_ul li a.ov {
 border-bottom:1px solid #000;
 color:#29235C  !important;
 font-weight:500;
}



/* 상단메뉴 ov */
.topmn_ul a.topmn_01 {background:url('/img/topmn_01.png') no-repeat; width:60px; }
.topmn_ul a.topmn_01_ov {background:url('/img/topmn_01_ov.png') no-repeat; width:60px;  border-bottom:1px solid #000;}
.topmn_ul a.topmn_01:hover {background:url('/img/topmn_01_ov.png') no-repeat;}

.topmn_ul a.topmn_02 {background:url('/img/topmn_02.png') no-repeat; width:60px;}
.topmn_ul a.topmn_02_ov {background:url('/img/topmn_02_ov.png') no-repeat; width:60px;  border-bottom:1px solid #000;}
.topmn_ul a.topmn_02:hover {background:url('/img/topmn_02_ov.png') no-repeat;  }

.topmn_ul a.topmn_03 {background:url('/img/topmn_03.png') no-repeat; width:65px;}
.topmn_ul a.topmn_03_ov {background:url('/img/topmn_03_ov.png') no-repeat; width:65px;  border-bottom:1px solid #000;}
.topmn_ul a.topmn_03:hover {background:url('/img/topmn_03_ov.png') no-repeat;  }

.topmn_ul a.topmn_04 {background:url('/img/topmn_04.png') no-repeat; width:85px; display:inline-block}
.topmn_ul a.topmn_04_ov {background:url('/img/topmn_04_ov.png') no-repeat; width:85px;  border-bottom:1px solid #000;}
.topmn_ul a.topmn_04:hover {background:url('/img/topmn_04_ov.png') no-repeat;  }





  .submn_ul  {
  position:relative;
  box-sizing:border-box;
  list-style: none;
  z-index:9999999999;
}

.submn_ul li {
   line-height:45px; width:100%;
}

/* Underline styles */
.submn_ul a {
width:100%; height:50px;
  display: block;
  position: relative;
  text-decoration: none;
  color:#29235C;
  font-weight:400;
  font-family: 'Noto Sans', sans-serif;
}

/* Fade in */
.submn_ul a::after {
  content: '';
  position: absolute;
  bottom: 0px;
  left: 0;
  width: 100%;
  height: 2px;
  opacity: 0;
  color:#29235C  !important;
  transition: opacity 300ms, transform 300ms;
}

.submn_ul a:hover::after,
.submn_ul a:focus::after {
  opacity: 1;
  background: #000;
  color:#29235C  !important;
  transform: translate3d(0, 0.2em, 0);
}

/* Slide in */

.submn_ul li {margin-bottom:32px;}

.submn_ul li a {
  overflow: hidden;
  font-size:20px;
}

.submn_ul li a::after {
  opacity: 1;
  transform: translate3d(-100%, 0, 0);
}

.submn_ul li a:hover::after,
.submn_ul li a:focus::after{
  transform: translate3d(0, 0, 0);
}

.submn_ul li a.ov {
 border-bottom:1px solid #000;
}
.submn_ul li a {transition: all 0.3s ease-out;}

/* 프로젝트 탭메뉴 */
a.mn1 {background:url('/img/project_mn01.png') no-repeat; width:80px; }
a.mn1_ov {background:url('/img/project_mn01_ov.png') no-repeat; width:80px;  border-bottom:2px solid #000;}
a.mn1:hover {background:url('/img/project_mn01_ov.png') no-repeat;}

a.mn2 {background:url('/img/project_mn02.png') no-repeat; width:465px; }
a.mn2_ov {background:url('/img/project_mn02_ov.png') no-repeat; width:465px;  border-bottom:2px solid #000;}
a.mn2:hover {background:url('/img/project_mn02_ov.png') no-repeat;  }

a.mn3 {background:url('/img/project_mn03.png') no-repeat; width:75px;}
a.mn3_ov {background:url('/img/project_mn03_ov.png') no-repeat; width:75px;  border-bottom:2px solid #000;}
a.mn3:hover {background:url('/img/project_mn03_ov.png') no-repeat;  }





/* 프로젝트 탭메뉴 */
.project_ul_wrap  {
  position:relative;
  box-sizing:border-box;
  list-style: none;
  z-index:9999999999;
  width:100%;
  margin:0 auto;
  border:0px solid #c00; rotate(.001deg);
}

.project_ul_wrap li {float:left; width:25%;height:70px;  text-align:center;}
.project_ul_wrap li:nth-child(2) {width:50%;}

.project_ul_wrap li a {font-family: 'Madreu'; font-size:58px; color: #29235C;}
.project_ul_wrap li a:hover {font-size:62px; transition: all 0.4s ease-in-out; text-shadow: -5px 5px 3px rgba(0,0,0,0.25);}



/*.project_ul_wrap li a.ux {  background:url('/img/s4_ux.png') no-repeat center; width:100%; height:100%; display:inline-block; text-align:center; }*/
/*.project_ul_wrap li a.ux:hover {background:url('/img/s4_ux_ov.png') no-repeat center; }*/
/**/
/*.project_ul_wrap li a.df {  background:url('/img/s4_df.png') no-repeat center; width:100%; height:100%; display:inline-block; text-align:center; }*/
/*.project_ul_wrap li a.df:hover {background:url('/img/s4_df_ov.png') no-repeat center;}*/
/**/
/*.project_ul_wrap li a.bx {  background:url('/img/s4_bx.png') no-repeat center; width:100%; height:100%; display:inline-block; text-align:center; }*/
/*.project_ul_wrap li a.bx:hover {background:url('/img/s4_bx_ov.png') no-repeat center;}*/
/**/

/*  .project_ul_wrap li a.ux:hover {position:absolute; left:-10px; top:0;background:url('/img/s4_ux_ov.png') no-repeat  center center;  width:104px; height:50px;display:block; text-align:center; }

 .project_ul_wrap li a.df {position:absolute; left:35%; top:0;background:url('/img/s4_df.png') no-repeat center center; width:462px; height:50px; display:block; text-align:center; margin-left:-70px; }
 .project_ul_wrap li a.df:hover {position:absolute; left:33%; top:0; background:url('/img/s4_df_ov.png') no-repeat  center center;  width:521px; height:60px; display:block; text-align:center; }

 .project_ul_wrap li a.bx {position:absolute; right:0px; top:0;background:url('/img/s4_bx.png') no-repeat; width:75px; height:40px; display:block; float:right;  text-align:center;}
 .project_ul_wrap li a.bx:hover {position:absolute; right:-10px; top:0;background:url('/img/s4_bx_ov.png') no-repeat center center; width:93px; height:50px; display:block;  float:right; text-align:center;} */