@charset "UTF-8";

/* Loading */
.loading {position:fixed; top:0; left:0; width:100%; height:100%; background:#fff; z-index:1000; transition:0.5s ease-in-out;}
.loading .img {position:absolute; top:0; bottom:0; left:0; right:0; width:240px; height:160px; margin:auto; text-align:center;}
.loading.loaded{opacity: 0; display: none; visibility: hidden; }

/* Favorite */
.clear-fix{*zoom:1}
.clear-fix:after{clear: both; display: block; content:"";}
.align-layout{width: 1320px; position: relative; margin: 0 auto;}

/* Vol 13 Reset */
body{background-color: #fff; /*overflow-x: hidden; overflow:hidden;*/}
.bg {position:absolute; top:0; left:50%; width:1920px; margin:0 0 0 -960px;}
#layout{position: relative;}


/* header */
#layout-header{background-color: #fff;}
.header-inner{width: 1169px; height: 109px; margin: 0 auto;}
.header-inner #logo{display: inline-block; vertical-align: top; margin-top: 25px;}
.header-inner .tnb-wrap{float: right; display: inline-block; vertical-align: top; margin-top: 35px;}
.header-inner .tnb-wrap .t-row:first-child{margin-bottom: 17.5px;}
.header-inner .tnb-wrap .t-row{}
.header-inner .tnb-wrap .t-row ul{}
.header-inner .tnb-wrap .t-row ul li:first-child{padding-left: 0;}
.header-inner .tnb-wrap .t-row ul li:first-child:after{content:""; position: absolute; width: 1px; height: 8px; background-color: #8e9194; top: 7px; right: 0;}
.header-inner .tnb-wrap .t-row ul li{float: left; position: relative; padding: 0 9px;}
.header-inner .tnb-wrap .t-row ul li a{font-weight: bold; font-family: Nanum Gothic, Malgun Gothic; font-size: 15px;}
.header-inner .tnb-wrap .t-row .version-col{}
.header-inner .tnb-wrap .t-row .version-col span{font-size: 11px; font-family: Nanum Gothic,Malgun Gothic;}
.header-inner .tnb-wrap .t-row .version-col .version{font-weight: bold;}

/* layout */
.section-row{transition:all 0.5s ease-in-out;}
#layout-body > div{position: relative;}

/* section 01 */
#section01{padding-top: 1400px;}
.title_100th {font-family: 'Noto Serif';}
.title_100th .the_cau {display:block; position:absolute; top:210px; right:0; margin:0 0 0 -500px; font-size:200px; letter-spacing:-10px; color:#fff; font-weight:normal; text-shadow: 20px 14px 25px rgba(0, 0, 0, 0.3); z-index:2;}  /* 2018-01-08 */
.title_100th .number {display:none; position:fixed; top:50%; left:50%; width:350px; margin:-136.5px 0 0 -175px; font-size:200px; letter-spacing:-10px; color:#fff; font-weight:normal; text-shadow: 20px 14px 25px rgba(0, 0, 0, 0.3); z-index:2; text-align:Center;}
.title_100th .number * { vertical-align:top;}
.title_100th .number em {margin:0 10px 0 0; line-height:150px;}
.title_100th .number span {font-size:54px;}
.title_100th .txt {position:absolute; top:130px; right:0; margin:0px 0 0 0; font-size:54px; color:#262626; letter-spacing:-2px; line-height:52px; text-align:left; z-index:2; /*opacity:0;*/-moz-transition: all 0.8s ease-in;-webkit-transition: all 0.8s ease-in;transition: all 0.8s ease-in;-ms-transition: all 0.8s ease-in; font-style: italic; text-align: right;} /* 2018-01-08 */
.title_100th .txt .hundred{margin-right: 13px;}
.title_100th .txt .hundred:after{content:"th"; font-size: 24px; position: absolute; top: -10px; right: -7px;}
.title_100th .box {position:absolute; top:0; left:50%; width:0; height:0; margin:0 0 0 -104px; border:1px solid #f3f0ec; z-index:1;}
.title_100th .box .ico_down {display:none; position:absolute; bottom:-15px; left:50%; margin:0 0 0 -15px;}
.tit_type02 {clear:both; padding-top:15px; display:block; margin:15px 0; font-size:20px; font-family:'Nanum Myeongjo'; color:#958778;}
.prologue{text-align:center;}
.prologue .title:before{content:""; display: block; width: 1px; height: 92px; background-color: #000; margin: 0 auto 18px auto;}
.prologue .title{font-size: 54px; text-align: center;}
.prologue p{max-width:850px;font-size: 14px; line-height: 24px; font-family: Nanum Gothic, Malgun Gothic; margin:0 auto; text-align: left; padding-top: 40px;}
.spirit{background:url("../images/13/spirit_bg.png") no-repeat center center; width: 100%; height: 663px; margin-top: 112px; -webkit-background-size: contain; background-size: contain; margin-bottom: 0px;}
.spirit dl{padding-top: 120px;}
.spirit dl dt{float: left; width: 415px; padding-left: 76px; box-sizing:border-box;}
.spirit dl dt .now{display: block; font-size: 22px;}
.spirit dl dt span{color:#c1a983; font-size: 53px;}
.spirit dl dt .black{color:#000;}
.spirit dl dd{float: left; width: 905px; padding-right: 76px; box-sizing:border-box}
.spirit dl dd ul{}
.spirit dl dd ul li{float: left; width: 33.3333%; transition:all 0.5s ease-in-out;}
.spirit dl dd ul li .thumb{display: table; padding-bottom: 12px;}
.spirit dl dd ul li .thumb .thumb-in{display: table-cell; height: 108px; vertical-align: middle;}
.spirit dl dd ul li .desc{}
.spirit dl dd ul li .desc strong{display: block; margin: 12px 0; font-family: Nanum Gothic, Malgun Gothic; font-size: 15px;}
.spirit dl dd ul li .desc span{display: block; font-family: Nanum Gothic, Malgun Gothic; font-size: 13px; line-height: 26px; padding-bottom: 24px;}

/* section 02 */
#section02 {margin-top:0px}
.identity{}
.identity dl{width: 1169px; margin: 0 auto;}
.identity dl dt{}
.identity dl dt .now{display: block; font-size: 22px;}
.identity dl dt span{color:#c1a983; font-size: 53px;}
.identity dl dt .black{color:#000;}
.identity dl dd{}
.identity dl dd ul{margin: 54px 5px 0 5px; background:url("../images/13/deco-line.png") no-repeat 0 26px;}
.identity dl dd ul li{float: left; width: 25%; transition:all 0.5s ease-in-out; margin-top: 6px;}
.identity dl dd ul li .col-name{display: block; text-align: left; font-family: Nanum Gothic, Malgun Gothic; font-size: 14px; padding-left: 4px;}
.identity dl dd ul li .logo-thumb{display: table; padding-top: 10px;}
.identity dl dd ul li .logo-thumb .logo-thumb-in{display: table-cell; height: 321px; vertical-align: middle;}
.identity dl dd ul li .logo-thumb .logo-thumb-in img{width: 100%; padding: 12px; box-sizing:border-box;}

/* section 03 */
.big-cate-title{margin-top: 450px;}
.big-cate-title .big-cate-title-row{width: 1169px; margin: 0 auto;}
.big-cate-title .big-cate-title-row span:first-child{padding-left: 0; margin-bottom: 0;}
.big-cate-title .big-cate-title-row span{display: block; color:#000; font-size: 46px; padding-left: 64px; margin-bottom: 40px;}
.big-cate-title .big-cate-title-row p{font-family: Nanum Gothic, Malgun Gothic; font-size: 13px; line-height: 24px; padding-left: 64px; font-weight: bold;}
.history{margin-top: 370px;}
.history dl{width: 1169px; margin: 0 auto;}
.history dl dt{margin-bottom: 110px;}
.history dl dt span{color:#000; font-size: 36px;}
.history dl dd{}
.history dl dd ul{}
.history dl dd ul li{float: left; position: relative; width: 25%; padding: 8px; box-sizing:border-box; margin-bottom: 82px; transition:all 0.5s ease-in-out;}
.history dl dd ul li:first-child:before,
.history dl dd ul li:nth-child(5):before,
.history dl dd ul li:nth-child(9):before,
.history dl dd ul li:nth-child(13):before{content:""; display: block; width: 1169px; height: 15px; position: absolute; top:-15px; left: 0; background:url("../images/13/deco-line.png") no-repeat 5px 0;}
.history dl dd ul li .thumb{padding-bottom: 10px;}
.history dl dd ul li .thumb .thumb-in{width: 100%; height: 218px; overflow: hidden;}
.history dl dd ul li .thumb .thumb-in a{position: relative; display: block;}
.history dl dd ul li .thumb .thumb-in a:hover{transition:all 0.35s ease-in-out;}
.history dl dd ul li .thumb .thumb-in a:hover:before{content:""; position: absolute; top:0; left: 0; z-index: 2; width: 100%; height: 100%; background: url("../images/13/news_box_more.png") no-repeat center center; transition:all 0.35s ease-in-out;}
.history dl dd ul li .thumb .thumb-in a:hover:after{content:""; position: absolute; top:0; left: 0; z-index: 1; width: 100%; height: 100%; background-color: #000; opacity: 0.3; transition:all 0.35s ease-in-out;}
.history dl dd ul li .thumb .thumb-in img{width: 100%; height: 100%;}
.history dl dd ul li .subject{display: block; font-family: Nanum Gothic, Malgun Gothic; font-size: 13px; line-height: 22px; height: 66px; word-break:break-all;}
.history dl dd ul li .title{position: absolute; top:-40px; left: 0; padding: 0 4px; font-size: 14px; font-family: Nanum Gothic, Malgun Gothic; font-weight: bold;}

.cmapus{margin-top: 130px;}
.cmapus dl{width: 1169px; margin: 0 auto;}
.cmapus dl dt{margin-bottom: 110px;}
.cmapus dl dt span{color:#000; font-size: 36px;}
.cmapus dl dd{}
.cmapus dl dd ul{}
.cmapus dl dd ul li{float: left; position: relative; width: 25%; padding: 8px; box-sizing:border-box; margin-bottom: 82px; transition:all 0.5s ease-in-out;}
.cmapus dl dd ul li:first-child:before,
.cmapus dl dd ul li:nth-child(5):before,
.cmapus dl dd ul li:nth-child(9):before,
.cmapus dl dd ul li:nth-child(13):before{content:""; display: block; width: 1169px; height: 15px; position: absolute; top:-15px; left: 0; background:url("../images/13/deco-line.png") no-repeat 5px 0;}
.cmapus dl dd ul li .thumb{padding-bottom: 10px;}
.cmapus dl dd ul li .thumb .thumb-in{width: 100%; height: 218px; overflow: hidden;}
.cmapus dl dd ul li .thumb .thumb-in img{width: 100%; height: 100%;}
.cmapus dl dd ul li .thumb .thumb-in a{position: relative; display: block;}
.cmapus dl dd ul li .thumb .thumb-in a:hover{transition:all 0.35s ease-in-out;}
.cmapus dl dd ul li .thumb .thumb-in a:hover:before{content:""; position: absolute; top:0; left: 0; z-index: 2; width: 100%; height: 100%; background: url("../images/13/news_box_more.png") no-repeat center center; transition:all 0.35s ease-in-out;}
.cmapus dl dd ul li .thumb .thumb-in a:hover:after{content:""; position: absolute; top:0; left: 0; z-index: 1; width: 100%; height: 100%; background-color: #000; opacity: 0.3; transition:all 0.35s ease-in-out;}
.cmapus dl dd ul li .subject{display: block; font-family: Nanum Gothic, Malgun Gothic; font-size: 12px; line-height: 18px; height: 72px; word-break:break-all;}
.cmapus dl dd ul li .title{position: absolute; top:-40px; left: 0; padding: 0 4px; font-size: 14px; font-family: Nanum Gothic, Malgun Gothic; font-weight: bold;}

/* section 04 */
.output{width: 1169px; margin: 260px auto 130px auto;}
.output .left-dl{float: left; width: 413px; margin-right: 86px;}
.output .left-dl dl dt{}
.output .left-dl dl dt .now{display: block; font-size: 22px;}
.output .left-dl dl dt span{color:#c1a983; font-size: 53px;}
.output .left-dl dl dt .desc{font-family: Nanum Gothic, Malgun Gothic; font-size: 12px; line-height: 24px; font-weight: bold; margin: 36px 0 48px 0;}
.output .left-dl dl dd{position: relative; border-left: 2px solid #1d3554; background:url("../images/13/left_dl_bg.png") no-repeat 100% 100%;}
.output .left-dl dl dd ol{}
.output .left-dl dl dd ol li{padding: 10px 0;}
.output .left-dl dl dd ol li.active{}
.output .left-dl dl dd ol li.active .rect{background-color: #c1a983;}
.output .left-dl dl dd ol li.active .ab-desc span{color:#c1a983;}
.output .left-dl dl dd ol li .rect{display: inline-block; vertical-align: top; height: 14px; background-color: #1d3554; margin: 11px 0;}
.output .left-dl dl dd ol li .ab-desc{display: inline-block; vertical-align: top; margin-left: 6px;}
.output .left-dl dl dd ol li .ab-desc span{display: block;}
.output .left-dl dl dd ol li .ab-desc .name{font-size: 11px; font-family: Nanum Gothic, Malgun Gothic; font-weight: bold; color:#1d3554;}
.output .left-dl dl dd ol li .ab-desc .numb{font-size: 13px; font-family: Nanum Gothic, Malgun Gothic; font-weight: bold; color:#1d3554;}

.output .left-dl dl dd ol li:first-child .rect{width: 353px;}
.output .left-dl dl dd ol li:nth-child(2) .rect{width: 248px;}
.output .left-dl dl dd ol li:nth-child(3) .rect{width: 248px;}
.output .left-dl dl dd ol li:nth-child(4) .rect{width: 140px;}
.output .left-dl dl dd ol li:nth-child(5) .rect{width: 102px;}
.output .left-dl dl dd ol li:nth-child(6) .rect{width: 95px;}
.output .left-dl dl dd ol li:nth-child(7) .rect{width: 84px;}
.output .left-dl dl dd ol li:nth-child(8) .rect{width: 84px;}
.output .left-dl dl dd ol li:nth-child(9) .rect{width: 84px;}
.output .left-dl dl dd ol li:last-child .rect{width: 80px;}

.output .left-dl dl dd .bottom-desc{position: absolute; bottom: 0; right: -10px; z-index: 2; font-family: Nanum Gothic, Malgun Gothic; width: 209px;}
.output .left-dl dl dd .bottom-desc strong{display: block; text-align: right; font-family: Nanum Gothic, Malgun Gothic; font-size: 13px; margin-bottom: 4px;}
.output .left-dl dl dd .bottom-desc span{display: block; text-align: right; font-family: Nanum Gothic, Malgun Gothic; font-size: 12px;}
.output .right-vert-cont{float: right; width: 670px;}
.output .right-vert-cont .article-short-desc{display: block; font-family: Nanum Gothic, Malgun Gothic; font-size: 12px; margin-bottom: 24px;}
.output .right-vert-cont .vert-cont{border-bottom: 1px solid #ebebeb;}
.output .right-vert-cont .vert-cont .vert-row{border-top: 1px solid #ebebeb; position: relative;}
.output .right-vert-cont .vert-cont .vert-row:hover,
.output .right-vert-cont .vert-cont .vert-row .vert-title.show{background-color: #1d3554;}
.output .right-vert-cont .vert-cont .vert-row:hover a,
.output .right-vert-cont .vert-cont .vert-row .vert-title.show a{color:#fff;}
.output .right-vert-cont .vert-cont .vert-row .vert-title{cursor: pointer; padding-left: 62px;}
.output .right-vert-cont .vert-cont .vert-row .vert-title a{position: relative; height: 62px; line-height: 62px; display: block; font-size: 12px; font-family: Nanum Gothic, Malgun Gothic; font-weight: bold;}
.output .right-vert-cont .vert-cont .vert-row .vert-title a:before{content:"+"; font-size: 16px; font-weight: bold; position: absolute; top:50%; left: -36px; margin-top: -30px;}
.output .right-vert-cont .vert-cont .vert-row .vert-title.show a:before{content:"-";}
.output .right-vert-cont .vert-cont .vert-row .vert-cont-box{background-color: #fff; display: none; padding: 24px 24px 24px 62px; line-height: 20px; font-size: 11px; font-family: Nanum Gothic, Malgun Gothic; border-top: 1px solid #ececec; text-align: justify;}

/* section 05 */
.section05{background-color: #2c3848; padding: 110px 0 212px 0;}
.achievement{width: 1169px; margin: 0 auto;}
.achievement .left-tab{float: left; width: 413px; margin-right: 86px; margin-top: 0px;}
.achievement .left-tab ol{border-left: 2px solid #c0bbb1;}
.achievement .left-tab ol li{margin-bottom: 7px;}
.achievement .left-tab ol li a{position: relative; display: inline-block; padding: 0 48px; height: 34px; line-height: 34px; font-family: Nanum Gothic,Malgun Gothic; font-size: 12px; color:#fff;}
.achievement .left-tab ol li.active a{color:#2c3848; background-color: #c0bbb1;}
.achievement .left-tab ol li.active a:after{content:""; width: 19px; height: 34px; position: absolute; background: url("../images/13/left-tab-actv.png") no-repeat center center; top: 0; right: -19px;}
.achievement .graph-box{float: right;  width: 670px;}
.achievement .left-tab .article-title{color:#fff; font-size: 36px; display: block; margin-bottom: 60px;}
.achievement .left-tab .article-title span{color:#c0bbb1; font-size: 36px;}
.achievement .graph-box .graph-wrap{position: relative; width: 670px; height: 502px;}
.achievement .graph-box .graph-wrap span{color:#fff; font-family: Nanum Gothic,Malgun Gothic; font-size: 12px; display: block; margin-bottom: 12px;}
.achievement .graph-box .graph-wrap .graph-col{display: none; width: 100%; height: 100%; overflow: hidden; position: absolute; top:0; left: 0;}
.achievement .graph-box .graph-wrap .graph-col:first-child{z-index: 1;}
.achievement .graph-box .graph-wrap .graph-col:nth-child(2){z-index: 2;}
.achievement .graph-box .graph-wrap .graph-col:nth-child(3){z-index: 3;}
.achievement .graph-box .graph-wrap .graph-col:nth-child(4){z-index: 4;}
.achievement .graph-box .graph-wrap .graph-col:nth-child(5){z-index: 5;}
.achievement .graph-box .graph-wrap .graph-col:nth-child(6){z-index: 6;}
.achievement .graph-box .graph-wrap .graph-col:nth-child(7){z-index: 7;}
.achievement .graph-box .graph-wrap .graph-col:last-child{z-index: 8;}

/* section 06 */
.epillogue{width: 1169px; margin: 0 auto;}
.epillogue .title:before{content:""; display: block; width: 1px; height: 92px; background-color: #000; margin: 0 auto 18px auto;}
.epillogue .title{font-size: 54px; text-align: center; padding-top: 120px;}
.epillogue p{width: 570px; margin: 0 auto; font-size: 14px; line-height: 22px; font-family: Nanum Gothic, Malgun Gothic; text-align: left; padding-top: 40px;}

.bottom-logo{padding: 95px 0; text-align: center;}
.link-box{width: 320px; border: 1px solid #000; margin: 0 auto 24px auto;}
.link-box a{display: block; text-align: center; padding: 24px 0; font-family: Nanum Gothic, Malgun Gothic; font-weight: bold; font-size: 14px;}
#monthBox{position: relative; width: 320px; margin: 0 auto;}
#monthBox .select-display{display: block; border: 1px solid #000; background-color: #fff; }
#monthBox .select-display:after{content:"▼"; position: absolute; top:50%; margin-top: -10px; right: 10px; font-weight: bold;}
#monthBox .select-display a{display: block; text-align: left; padding: 6px 12px; font-family: Nanum Gothic, Malgun Gothic; font-size: 13px;}
#monthBox .select-list{display: none; position: absolute; top: 30px; z-index: 5; background-color: #fff; width: 100%; border: 1px solid #000; box-sizing:borde-box; border-top-width: 0;}
#monthBox .select-list ol{padding: 6px 0;}
#monthBox .select-list ol li{line-height: 20px; height: 20px; padding: 0 12px;}
#monthBox .select-list ol li a{display: block; font-family: Nanum Gothic; font-size: 12px;}
#copyright{font-family: 'Noto Serif'; padding: 34px 0; text-align: center; color:#b6b8c4; font-size: 15px;}