@charset "utf-8";
body { background:; background-color:#c4cdd3;}
html.ie7 body img,
html.ie8 body img { display:none;}
body > svg { display:none;}
.IndexContent { padding-top:0px; padding-bottom:50px;}
.GridWrap { position:relative; z-index:2;}
.GridWrap .ItemWrap { overflow:hidden; margin:0 0 20px;}
.GridWrap .Item { overflow:hidden; position:relative;}
.GridWrap .Item > a > img { width:100%;}
.GridWrap .Item .SVGHoverTitle,
.GridWrap .Item .ItemTitle { display:none;position:absolute; left:10px; top:15px; z-index:4; color:#000; font-size:12px;}
.GridWrap .Item .ItemTitle2 { position:absolute; left:10px; top:15px; z-index:4; color:#fff; font-size:12px;}
.GridWrap .Item .SVGHoverTitle { color:#4DC1B4; z-index:8;}
.GridWrap .Item .Cover { position:absolute; left:0; top:0; z-index:5; width:100%; height:100%; }
.GridWrap .Item .Hover { position:absolute; z-index:5; width:100%; height:100%; opacity:0.85; filter:alpha(opacity=85); background-color:#000;}
.GridWrap .Item .slipbox {position:absolute; top:-100%;  left:-100%; width:100%; height:100%; text-align:center;  background:rgba(0,0,0,0.8); z-index:50;  vertical-align:middle}
.GridWrap .Item .slipbox h1 {color:#fff;text-align:left;padding:20px 20px 10px;}
.GridWrap .Item .slipbox p {color:#fff;text-align:left;padding:0px 20px;font-size:12px;line-height:1.4;word-break: keep-all;}
.GridWrap .Item .BoxLink { width:100%; height:100%;}
.GridWrap .Item .HoverText { position:absolute; left:10px; bottom:10px; z-index:5; color:#fff; font-size:12px; line-height:1.6;}
.GridWrap .Item3 {background:rgba(61,192,185,0.8);;}
.GridWrap .Item4 {background:rgba(255,255,255,0.8);}
.GridWrap .Item5 {background:rgba(241,241,241,0.8);}
.GridWrap .Item5_1 {background:rgba(0,153,154,0.8);}
.GridWrap .Item6 {background:rgba(61,61,61,0.8);}
.GridWrap .Item7 {background:rgba(0,0,0,0.8);}
.GridWrap .Item8 {background:rgba(241,241,241,0.8);}
.GridWrap .Item9 {background:#000;}
.GridWrap .Item10 {background:rgba(255,255,255,0.8);}
.GridWrap .ItemWrap.Divide2 .LeftArea { float:left; width:50%;}
.GridWrap .ItemWrap.Divide2 .LeftArea .Item { margin-right:9px;}
.GridWrap .ItemWrap.Divide2 .RightArea { float:left; width:50%;}
.GridWrap .ItemWrap.Divide2 .RightArea .Item { margin-left:9px;}
.GridWrap .Item > img { width:100%;}
.GridWrap .Item1 .item .Tit { position:absolute; z-index:5;}
.GridWrap .Item1 .item .Tit > span { display:none; padding:0px; color:#fff; font-size:24px;line-height:1.5;}
.GridWrap .Item1 .item .Tit > span .kor {width:100%;font-size:14px;line-height:1.5;margin-top:10px;display:block;}
.GridWrap .item .Tit { left:25px; top:25px; font-size:42px; text-shadow:none;}
.GridWrap .Item2 h2.Tit { position:absolute; left:10px; top:70%; z-index:15; color:#fff; font-size:14px;line-height:1;}
.GridWrap .Item2 h2.Tit .kor{ font-size:14px;margin-top:5px;display:block;}
/* ¸ÞÀν½¶óÀ̵å ù¹ø° */
.indexSlider1 { position:relative; height:0; padding:0 0 90% 0; z-index:1;}
.indexSlider1 .innerFrame { width:100%; height:2500px;}
.indexSlider1 .innerFrame .slider { width:100%; height:100%;}
.indexSlider1 .innerFrame .slider .item { float:left; width:100%;}
.indexSlider1 .innerFrame .slider .item:first-child { visibility:visible;}
.indexSlider1 .innerFrame .slider .item img { width:100%; height:auto;}
.indexSlider1indicator { position:absolute; left:0; bottom:15px; width:100%; height:15px; z-index:10; text-align:center;}
.indexSlider1indicator button { display:inline-block; width:13px; height:13px; background:#fff;border-radius:13px; text-indent:-50px;-webkit-transition: 0.25s;transition: 0.25s;}
.indexSlider1indicator button.active { width:33px; height:13px; background:#21bbb1;border-radius:13px; }
.indexSlider1Prev { display:none; position:absolute; left:10px; top:50%; z-index:10; width:53px; height:53px; margin-top:-27px;opacity:0.5;-webkit-transition: 0.25s;transition: 0.25s;}
.indexSlider1Prev:hover { opacity:1;}
.indexSlider1Next { display:none; position:absolute; right:10px; top:50%; z-index:10; width:53px; height:53px; margin-top:-27px;opacity:0.5;-webkit-transition: 0.25s;transition: 0.25s;}
.indexSlider1Next:hover { opacity:1;}
/* ¸ÞÀν½¶óÀ̵å ù¹ø° */
/* ¸ÞÀν½¶óÀÌµå µÎ¹ø° */
.indexSlider2 { position:relative; height:0; padding:0 0 43% 0; z-index:1;}
.indexSlider2 .innerFrame { width:100%; height:2500px;}
.indexSlider2 .innerFrame .slider { width:100%; height:100%;}
.indexSlider2 .innerFrame .slider .item { float:left; width:100%; height:100%; visibility:hidden;}
.indexSlider2 .innerFrame .slider .item:first-child { visibility:visible;}
.indexSlider2 .innerFrame .slider .item img { width:100%;}
.indexSlider2indicator { position:absolute; right:20px; top:15px; height:15px; z-index:10; text-align:right;}
.indexSlider2indicator button { display:inline-block; width:10px; height:10px; background:#fff;border-radius:10px; text-indent:-50px;-webkit-transition: 0.25s;transition: 0.25s;}
.indexSlider2indicator button.active { width:20px; height:10px; background:#21bbb1;border-radius:10px; }
.indexSlider2Prev { display:none; position:absolute; left:0px; top:50%; z-index:10; width:53px; height:53px; margin-top:-27px;opacity:0.5;-webkit-transition: 0.25s;transition: 0.25s;}
.indexSlider2Prev img {width:40px;}
.indexSlider2Prev:hover { opacity:1;}
.indexSlider2Next { display:none; position:absolute; right:0px; top:50%; z-index:10; width:53px; height:53px; margin-top:-27px;opacity:0.5;-webkit-transition: 0.25s;transition: 0.25s;}
.indexSlider2Next img {width:40px;}
.indexSlider2Next:hover { opacity:1;}
/* ¸ÞÀν½¶óÀÌµå µÎ¹ø° */
@media all and (min-width: 480px) {
.GridWrap .Item .SVGHoverTitle2 {font-size:13px;padding:10px;color:#fff;line-height:16px;}
.GridWrap .Item .SVGHoverTitle,
.GridWrap .Item .ItemTitle { left:20px; top:15px; font-size:19px;}
.GridWrap .Item .ItemTitle2 { left:20px; top:15px; font-size:19px;}
.GridWrap .Item2 h2.Tit { position:absolute; left:20px;  z-index:20; color:#fff; font-size:16px;}
.GridWrap .Item2 h2.Tit .kor{ font-size:16px; }
}
@media all and (min-width: 768px) and (max-width: 959px) {
.GridWrap { width:580px; margin:0 auto;}
.GridWrap .Item2 h2.Tit { top:165px;  }
}
@media all and (min-width: 980px) {
.IndexContent { padding-top:50px; }
.indexSlider1Prev,
.indexSlider1Next,
.indexSlider2Prev,
.indexSlider2Next { display:block;}
.GridWrap { overflow:hidden; width:756px; margin:0 auto;}
.GridWrap > .LeftSect { float:left; width:498px;}
.GridWrap > .RightSect { float:Right; position:relative; width:240px;}
.GridWrap > .RightSect .LeftArea,
.GridWrap > .RightSect .RightArea,
.GridWrap > .RightSect .Item { float:none; width:100%; margin:0 !important;}
.GridWrap .Item1 { width:498px; height:458px;}
.GridWrap .Item2 { height:222px;}
.GridWrap .Item2 .indexSlider2 { height:222px;}
.GridWrap .Item1 .indexSlider1 { height:458px;}
.GridWrap .Item8 { position:absolute; left:0; top:0;}
.GridWrap .Item10 { position:absolute; left:0; top:240px;}
.GridWrap .Item6 { position:absolute; left:0; top:480px;}
.GridWrap .Item9 { position:absolute; left:0; top:720px;}
.GridWrap .Item7 { position:absolute; left:0; top:960px;}
.GridWrap .Item2 h2.Tit {}
.GridWrap .item .Tit { left:25px;top:25px; text-shadow:none;}
.GridWrap .Item {height:220px;}
.GridWrap .Item2 h2.Tit { top:165px;  }
}
@media all and (min-width: 1280px) {
body { background-color:#c4cdd3;}
.GridWrap { width:1272px; height:696px; position:relative;}
.GridWrap > .LeftSect,
.GridWrap > .RightSect { width:auto; position:static; float:none;}
.GridWrap .Item { position:absolute; left:auto; top:auto;}
.GridWrap .Item > img { width:100% !important; height:100% !important;}
.GridWrap .Item1 { left:0; top:0; height:458px !important;}
.GridWrap .Item9 { left:auto; right:258px; top:476px; width:240px !important; height:220px; margin:0 !important;}
.GridWrap .Item10 { left:auto; right:0; top:476px; width:240px !important; height:220px; margin:0 !important;}
.GridWrap .Item6 { left:auto; right:516px; top:0; width:240px !important; height:220px; margin:0 !important;}
.GridWrap .Item7 { left:auto; right:516px; top:238px; width:240px !important; height:220px; margin:0 !important;}
.GridWrap .Item8 { left:auto; right:516px; top:476px; width:240px !important; height:220px; margin:0 !important;}
.GridWrap .Item2 { right:0; top:0; width:498px !important; height:220px; margin:0 !important;}
.GridWrap .Item3 { right:0; top:238px; width:240px !important; height:220px; margin:0 !important;}
.GridWrap .Item4 { right:258px; top:238px; width:240px !important; height:220px; margin:0 !important;}
.GridWrap .Item5 { left:0; bottom:0; width:240px !important; height:220px; margin:0 !important;}
.GridWrap .Item5_1 { left:258px; bottom:0; width:240px !important; height:220px; margin:0 !important;}
}