@charset "utf-8";


/* ****************** default css ****************** */

/* common css */
@import url("../common/common.css");

/* common css */
@import url("category.css");



/* ****************** default css ****************** */
.container { height: 100%; }
.body-container { min-height: calc(100% - 400px); }

.banner-wrap { height: 450px; }
.banner-wrap .banner-text { display: block; table-layout: auto; text-align: center; height: auto; }
.banner-wrap .banner-text .text-area { display: block; width: 100%; margin-top: 210px; }
.banner-wrap .banner-text .text-area h1 { font-size: 45px; line-height: 45px; }
.banner-wrap .banner-text .text-area h3 { font-size: 22px; line-height: 22px; }

.section { position: relative; width: 1200px; margin: 0 auto; height: 100%; padding-bottom: 60px; }
.tab-menu { position: relative; top: -61px; width: 1200px; margin: 0 auto; border-bottom: 1px solid #dee3eb; background: #fff; }
.tab-menu ul { text-align: center; }
.tab-menu ul li { display: inline-block; width: 160px; }
.tab-menu ul li a { position: relative; width: 100%; display: block; line-height: 60px; font-size: 15px; font-weight: 600; }
.tab-menu ul li:hover a,
.tab-menu ul li.select a { color: #0e205b; }
.tab-menu ul li.select a:after { content: ''; position: absolute; bottom: -1px; left: 0; width: 100%; height: 2px; background: #0e205b; }


/* 이미지 영역 */
.svg-area { position: relative; display: table; table-layout: fixed; width: 100%; }
.svg-area .img { position: relative; display: table-cell; width: 100%; height: 550px; vertical-align: middle; text-align: center; background: #fff; overflow: hidden; }
.svg-area .img img { max-width: 100%; max-height: 100%; }
.svg-area .img .text { position: absolute; top: 110px; right: 325px; display: inline-block; padding: 1px 15px; border: 1px solid #008ba9; background: rgba(0,99,116,0.7); font-weight: 600; z-index: 99; font-size: 14px; color: #fff; border-radius: 3px; }

.btn-wrap { text-align: center; margin-top: 20px;}
.btn-wrap a.btn { position: relative; overflow: hidden; display: inline-block; line-height: 50px; padding: 0 30px; background-color: #000; color: #fff; font-weight: 500; font-size: 14px; }
.btn-wrap a.btn img { vertical-align: middle; transition: left .5s ease; position: relative; left: 3px; }
.btn-wrap a.btn:hover img { left: 10px; }
.btn-wrap .nt { margin-top: 10px; font-size: 13px; color: #999; }