@charset "utf-8";

#wrap { width:100%; overflow:hidden; }

/* 모바일 메뉴 바 앱바 눌렀을때 좌측-100%에서 숨어있다가 우측으로 나옴 */
#wrap .mobile-menu-wrap { z-index:4; position:fixed; left:100%; top:0; width:100%; height:100%; background:#222121; }
#wrap .mobile-menu-wrap>div { padding:0 20px;  }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-title { width:100%; height:67px; }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-title .mlogo { float:left; display:block; width:24px; height:24px; }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-title .mlogo>a { display:block; padding:21.5px 0; }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-title .mlogo>a>img { width:100%; }

/* 모바일 닫기 앱바버튼 */
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-title .close-appBar-wrap { margin-top:22.5px; float:right; width:22px; height:22px; }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-title .close-appBar-wrap>a { position:relative; display:block; width:100%; height:100%; }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-title .close-appBar-wrap>a>i { position:absolute; left:0; top:50%; margin-top:-1px; display:block; width:100%; height:2px; background:#fff; }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-title .close-appBar-wrap>a> .close-appbar1 { transform:rotate(45deg); }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-title .close-appBar-wrap>a> .close-appbar2 { transform:rotate(-45deg); }

/* 모바일 메뉴 목록 */
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-list {  }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-list>ul {  }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-list>ul>li { padding:5px 0; border-bottom:1px solid rgba(255,255,255,0.1); }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-list>ul>li:first-child {border-top:1px solid rgba(255,255,255,0.1); }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-list>ul>li>a { display:block; line-height:33.6px; color:#cfcfcf; font-size:15px; font-weight:500; font-family:'DINWebPro-CondBold'; letter-spacing:2px; }

#wrap .mobile-menu-wrap>div .mobile-menu-wrap-list>h3 { font-size:16px; color:#cfcfcf; margin:15px 0; font-family: Plantin,Arial,serif; }

#wrap .mobile-menu-wrap>div .mobile-menu-wrap-list .mbutton-wrap {  padding-bottom:20px; }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-list .mbutton-wrap>button { cursor:pointer; border:0; padding:3px 30px 0 30px; height:50px; color:#fff; background:#000; display:inline-block; font-family:'DINWebPro-CondBold'; font-size:15px; font-weight:600; letter-spacing:2px; }


#wrap .mobile-menu-wrap>div .mobile-menu-wrap-list .msns-wrap {  }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-list .msns-wrap>span { display:inline-block; margin:0 6px; }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-list .msns-wrap>span>a { position:relative; border-radius:50%; display:block; text-align:center; font-size:19px; width:35px; height:19px; padding:8px 0; background:#888; color:#222; }
#wrap .mobile-menu-wrap>div .mobile-menu-wrap-list .msns-wrap>span>a>i {  }



#wrap #header { z-index:3; position:absolute; top:0; left:0; width:100%;   }

#wrap #header>div { width:100%; max-width:1090px; margin:0 auto;  height:80px; }

/* 모바일 앱바 영역(앱바,로고,검색) */
#wrap #header>div .mobile-nav { position:relative; left:0; display:none; text-align:center; width:100%; height:67px; background:#fff; box-shadow:0 2px 3px rgba(0,0,0,0.25); }

/* 로고(가운데) */
#wrap #header>div .mobile-nav>h2 { display:inline-block; padding:21px 0; }
#wrap #header>div .mobile-nav>h2>a { color:#000; font-size:25px; font-family:'oe-icons'; color:#000;  }

/* 앱바 버튼(왼쪽) */
#wrap #header>div .mobile-nav .appBar-wrap { position:absolute; left:20px; top:26.5px;  width:20px; height:14px;  }
#wrap #header>div .mobile-nav .appBar-wrap a { display:block; width:100%; height:100%;  }
#wrap #header>div .mobile-nav .appBar-wrap a i { display:block; width:100%; height:3px; background:#000;  }
#wrap #header>div .mobile-nav .appBar-wrap a i:nth-child(2) { margin:4px 0; }

/* 검색 버튼(오른쪽) */
#wrap #header>div .mobile-nav .search-wrap { position:absolute; right:20px; top:24.9px; width:24px; height:18px; }
#wrap #header>div .mobile-nav .search-wrap>a { color:#666;  }
#wrap #header>div .mobile-nav .search-wrap>a>i { font-size:18px; }


/* 탑 메뉴 */
#wrap #header>div .aside { text-align:right; }
#wrap #header>div .aside>div { padding:10px 0; }
#wrap #header>div .aside>div>span { display:inline-block;  }
#wrap #header>div .aside>div>span>a { color:rgba(255,255,255, .6); font-size:13px; }
#wrap #header>div .aside>div>span>i { margin:4px 5px 0 5px; display:block; width:2px; height:11px; background:rgba(255,255,255, .6); }
#wrap #header>div .aside>div>span:last-child { margin-left:10px; }


/* 탑 메뉴 */
#wrap #header>div .nav {  }

/* 로고  */
#wrap #header>div .nav>h1 { float:left; width:248px;  }
#wrap #header>div .nav>h1>a>img { width:100%; }

/* 메인메뉴 */
#wrap #header>div .nav>ul { float:right; padding-top:10px; }
#wrap #header>div .nav>ul>li { display:inline-block; margin-left:15px; }
#wrap #header>div .nav>ul>li>a { letter-spacing:-1px; color:#fff; transform:scale(0.3,1); font-size:16px; font-weight:600;  }
#wrap #header>div .nav>ul>li>a:hover { border-bottom:1px solid rgba(255,255,255,0.6);    }
#wrap #header>div .nav>ul>li>a>i { font-size:19px; }



#wrap #main { z-index:2; position:relative; width:100%; }
#wrap #main #section1 { width:100%; }
#wrap #main #section1>div { width:100%; height:969px; position:relative; overflow:hidden; }

/* 메인비디오 */
#wrap #main #section1>div .section1-video { z-index:1; position:relative; width:100%; }
#wrap #main #section1>div .section1-video>video { width:100%; margin-top:-100px; }

/* 센터 아이콘 */
#wrap #main #section1>div .section1-center-Icon { z-index:2; position:absolute; top:50%; left:50%; width:160px; margin-left:-80px; height:160px; margin-top:-110px; background:transparent; border:1px solid #fff; border-radius:50%;  }
#wrap #main #section1>div .section1-center-Icon>div { text-align:center; padding:42px 0; }
#wrap #main #section1>div .section1-center-Icon>div>h3 { font-size:13.5px; font-weight:500; letter-spacing:0.5px; }
#wrap #main #section1>div .section1-center-Icon>div>h3>a { color:#fff; }
#wrap #main #section1>div .section1-center-Icon>div>p { padding:20px 0 0 0; }
#wrap #main #section1>div .section1-center-Icon>div>p>i { display:inline-block; width:50%; height:1px; background:#fff; }

/* exploreBt */
#wrap #main #section1>div .section1-exploreBt-wrap { z-index:2; text-align:center; position:absolute; bottom:80px; left:0; width:100%; }
#wrap #main #section1>div .section1-exploreBt-wrap>a { display:inline-block; font-size:13px; color:#fff; font-weight:600; letter-spacing:2px; }

/* 바닥 비디오 컨트롤러 아이콘 */
#wrap #main #section1>div .section1-footer { z-index:2; position:absolute; bottom:0; left:0; width:100%; height:60px; background:rgba(61,65,66,  .7); }
#wrap #main #section1>div .section1-footer .section1-footer-left  { position:absolute; left:60px; top:0; width:120px; height:60px; }
#wrap #main #section1>div .section1-footer .section1-footer-left>span  { float:left; display:block;  width:60px; height:60px; text-align:center; }
#wrap #main #section1>div .section1-footer .section1-footer-left>span>a  { display:block; color:rgba(255,255,255, .8); background:rgba(61,65,66,  .2); }
#wrap #main #section1>div .section1-footer .section1-footer-left>span>a.addSec1Foot  { background:rgba(110,116,117, .7); }
#wrap #main #section1>div .section1-footer .section1-footer-left>span>a>i { display:inline-block; font-size:21px; padding:19.5px 0; }

#wrap #main #section1>div .section1-footer .section1-footer-center { position:absolute; left:50%;  top:0; width:60px; margin-left:-30px; height:60px; }
#wrap #main #section1>div .section1-footer .section1-footer-center>span { display:block; width:60px; height:60px; text-align:center; } 
#wrap #main #section1>div .section1-footer .section1-footer-center>span>a {  display:block; width:100%; height:100%; overflow:hidden; text-align:center; } 
#wrap #main #section1>div .section1-footer .section1-footer-center>span>a>i {  margin-top:12px; transition:all 0.2s; transform:rotate(45deg); display:inline-block; width:20px; height:23px; border-bottom:2px solid rgba(255,255,255, .8); border-right:2px solid rgba(255,255,255, .8);  } 
#wrap #main #section1>div .section1-footer .section1-footer-center>span>a:hover>i { margin-top:25px; transition:all 0.6s;  } 

#wrap #main #section1>div .section1-footer .section1-footer-right { position:absolute; right:60px; top:0; width:120px; height:60px;  }
#wrap #main #section1>div .section1-footer .section1-footer-right>span { float:left; width:50%; height:60px; text-align:center; } 
#wrap #main #section1>div .section1-footer .section1-footer-right>span>a { display:block; color:rgba(255,255,255, .8); } 
#wrap #main #section1>div .section1-footer .section1-footer-right>span>a>img { width:14px; padding:23px 0;  } 
#wrap #main #section1>div .section1-footer .section1-footer-right>span>a>i { font-size:17px; padding:21.5px 0;  } 



/* 섹션2 */
#wrap #main #section2 { width:100%; background-image:linear-gradient(to right, #384144, #384144 50%, #727b77 50%); }
/* 박스 */
#wrap #main #section2>div { float:left; width:50%; }
#wrap #main #section2>div>div { padding:80px; }
/* 제목 */
#wrap #main #section2>div>div .section2-title { padding-bottom:10px;  }
#wrap #main #section2>div>div .section2-title>h2 { display:inline-block; font-size:20px; color:#fff; padding-bottom:10px; border-bottom:1px solid #fff; letter-spacing:2px; }
/* 내용 */
#wrap #main #section2>div>div .section2-content {  }
#wrap #main #section2>div>div .section2-content>p { font-size:12px; letter-spacing:1px; line-height:250%; color:rgba(255,255,255,0.6); }


#wrap #main #section3 { width:100%; background:#000; }

/* 비디오 갤러리 메뉴박스 두가지 방법 */
/* #wrap #main #section3 .section3-menu-wrap { width:100%; height:52px; background:#2C3437; overflow:hidden; } */
/* #wrap #main #section3 .section3-menu-wrap>ul { width:100%; text-align:center; } */
/* #wrap #main #section3 .section3-menu-wrap>ul>li { display:inline-block; } */
/* #wrap #main #section3 .section3-menu-wrap>ul>li>a { display:block; font-size:14px; font-weight:600; color:rgba(255,255,255,0.6); text-transform:uppercase; padding:17px 10px 21px 10px; letter-spacing:2px;  } */
/* #wrap #main #section3 .section3-menu-wrap>ul>li>a:hover { color:rgba(255,255,255,1); background:#223034;   } */


#wrap #main #section3 .section3-menu-wrap { width:100%; height:52px; background:#2C3437; overflow:hidden; text-align:center; }
#wrap #main #section3 .section3-menu-wrap>ul { display:inline-block; }
#wrap #main #section3 .section3-menu-wrap>ul>li { float:left; }
#wrap #main #section3 .section3-menu-wrap>ul>li>a { display:block; font-size:14px; font-weight:600; color:rgba(255,255,255,0.6); text-transform:uppercase; padding:17px 10px 21px 10px; letter-spacing:2px;  }
#wrap #main #section3 .section3-menu-wrap>ul>li>a:hover { color:rgba(255,255,255,1); background:#223034; }

/* 비디오 갤러리 */
#wrap #main #section3 .section3-video-gallery { width:100%; }
#wrap #main #section3 .section3-video-gallery>li { float:left; width:33.333%; }
#wrap #main #section3 .section3-video-gallery>li>div { position:relative; width:100%; overflow:hidden; }
#wrap #main #section3 .section3-video-gallery>li>div>video { z-index:1; position:relative; width:100%; }
#wrap #main #section3 .section3-video-gallery>li>div>img   { z-index:1; position:relative; width:100%; }
#wrap #main #section3 .section3-video-gallery>li>div>a   { z-index:2; position:absolute; text-indent:-2000px; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0, 0); transition:all 0.3s; }
#wrap #main #section3 .section3-video-gallery>li:hover>div>a  { background:rgba(0,0,0,0.7); }

/* 비디오 타이틀 */
#wrap #main #section3 .section3-video-gallery>li>div .gallery-title 	 { opacity:0; transition:all 0.4s; z-index:3; position:absolute; top:30%; left:10%; width:100%; cursor:pointer; }
#wrap #main #section3 .section3-video-gallery>li:hover>div .gallery-title { opacity:1; }
#wrap #main #section3 .section3-video-gallery>li>div .gallery-title>h3 	 		{ margin-top:15px; transition:all 0.5s ease-in-out; }
#wrap #main #section3 .section3-video-gallery>li:hover>div .gallery-title>h3 	 { margin-top:0; }
#wrap #main #section3 .section3-video-gallery>li>div .gallery-title>h3>a { font-family:'Nanum Myeongjo'; font-size:24px; font-weight:600; color:#fff; }
#wrap #main #section3 .section3-video-gallery>li>div .gallery-title>h4 	 { padding:20px 0 50px 0; margin-top:15px; transition:all 0.8s ease-in-out; }
#wrap #main #section3 .section3-video-gallery>li:hover>div .gallery-title>h4 	 { margin-top:0; }
#wrap #main #section3 .section3-video-gallery>li>div .gallery-title>h4>a { display:inline-block; padding-bottom:7px; border-bottom:1px solid rgba(255,255,255,0.4); font-size:14px; color:#fff;  font-weight:600; text-transform:uppercase; }
#wrap #main #section3 .section3-video-gallery>li>div .gallery-title>h5 	 { margin-top:10px; transition:all 1s ease-in-out; } 
#wrap #main #section3 .section3-video-gallery>li:hover>div .gallery-title>h5 	 { margin-top:0; } 
#wrap #main #section3 .section3-video-gallery>li>div .gallery-title>h5>a { display:block; width:100px; height:100px; border:1px solid rgba(255,255,255,0.6); border-radius:50%; background:rgba(255,255,255,0); font-size:14px; font-weight:600; color:#fff; text-align:center; line-height:100px; text-transform:uppercase; transition:all 0.3s;}
#wrap #main #section3 .section3-video-gallery>li>div .gallery-title>h5>a:hover {  background:rgba(255,255,255,1); font-size:14px; font-weight:600; color:#222; }

/* 비디오 더보기 */
#wrap #main #section3 .section3-more { text-align:center; width:100%; height:170px; background:#384244; } 
#wrap #main #section3 .section3-more>div { padding:60px 0; } 
#wrap #main #section3 .section3-more>div>button { cursor:pointer; display:inline-block; width:200px; height:50px; background:#384244; border:1px solid rgba(255,255,255,0.3); color:rgba(255,255,255,0.9); font-size:16xp; font-weight:600;  } 

/* footer */
#wrap #footer { z-index:1; position:relative; width:100%; padding:50px 0;  background:#222; }
#wrap #footer>div { width:100%; max-width:1090px; margin:0 auto; }
/* 위 박스 */
#wrap #footer>div .footer-sitemap {  }
#wrap #footer>div .footer-sitemap>ul { width:100%;  }
#wrap #footer>div .footer-sitemap>ul>li { float:left; width:16.666%; }
#wrap #footer>div .footer-sitemap>ul>li>div { margin:0 5px; }
#wrap #footer>div .footer-sitemap>ul>li>div>dl { letter-spacing:-1.5px; }
#wrap #footer>div .footer-sitemap>ul>li>div>dl>dt {   }
#wrap #footer>div .footer-sitemap>ul>li>div>dl>dt>i { display:block; width:15px; height:1px; background:rgba(255,255,255,0.2); }
#wrap #footer>div .footer-sitemap>ul>li>div>dl>dt>a { position:relative; display:block; padding:10px 0; font-size:16px; font-weight:600; color:#fff; }
#wrap #footer>div .footer-sitemap>ul>li>div>dl>dt>a>i {  }
#wrap #footer>div .footer-sitemap>ul>li>div>dl>dd { padding:4px 0; }
#wrap #footer>div .footer-sitemap>ul>li>div>dl>dd>a { font-size:12px; color:#888; cursor:pointer; }

/* 모바일 아래 방향 화살표 */
.mobileAngle { opacity:0; position:absolute; right:0; top:8.5px; color:rgba(255,255,255,0.6); font-size:18px; }

/* 아래 박스 */
#wrap #footer>div .footer-sns { padding-top:60px;  }
#wrap #footer>div .footer-sns>ul {  }
#wrap #footer>div .footer-sns>ul>li:nth-child(1) { float:left;  }
#wrap #footer>div .footer-sns>ul>li:nth-child(2) { float:right; }
#wrap #footer>div .footer-sns>ul>li:nth-child(1)>div { padding:12px 0;  }
#wrap #footer>div .footer-sns>ul>li:nth-child(2)>div { padding-right:48px;  }

#wrap #footer>div .footer-sns>ul>li>div>address {  }
#wrap #footer>div .footer-sns>ul>li>div>address>span { display:inline-block; margin:0 5px; font-size:13px; color:#888; }
#wrap #footer>div .footer-sns>ul>li>div>address>span>a {display:inline-block; padding-left:10px; color:#888; }

/* 로고 */
#wrap #footer>div .footer-sns>ul>li>div>span { display:inline-block; margin:0 3px; }
#wrap #footer>div .footer-sns>ul>li>div>span>a { position:relative; border-radius:50%; display:block; text-align:center; font-size:19px; width:35px; height:19px; padding:8px 0; background:#888; color:#222; }
#wrap #footer>div .footer-sns>ul>li>div>span>a>i {  }









