



/* 고정메뉴 오른쪽 */
#fix-nav {position: fixed; width:104px; height:182px; background:rgba(0,0,0,0.65); top:50%; right:70px; margin-top: -91px; display: block; z-index: 998;}
#fix-nav ul {width:100%;padding:30px 0;}
#fix-nav ul li {position:relative; text-align: center;margin:18px 0;}
#fix-nav ul li:before {position: absolute; content:''; display: block; left:50%; top:-11px; width:3px; height:3px; background:#a4a4a4; margin-left: -1px; border-radius: 50%;}
#fix-nav ul li:first-child:before {display:none;}
#fix-nav ul li a {color:#a9a9a9; font-size:14px; }
#fix-nav ul li a:hover, #fix-nav ul li a:focus, #fix-nav ul li.active a {color:#fff; font-weight: bold;}

/* 메인 슬라이드 */
#main-slider-area {background: #fff;}
#slider-box .bx-viewport {height:100% !important; }
#slider-box, #main-slider, #slider-box .bx-wrapper, #slider-box .m-slide, #slider-box .slider-con {height:100%;}
#slider-box .m-slide {width:100% !important; overflow: hidden;}
#slider-box .slider-con {background-position:50% 50px; background-repeat: no-repeat; background-size: cover; display: table; width:100%; text-align: center;}
#slider-box .slider-con {color:#fff;}
#slider-box .slider-con .bar {width:72px; height:4px; background:#fff; display: inline-block; margin-bottom: 16px;}
#slider-box .slider-con p.stt {font-size:38px;line-height: 68px; font-weight: normal; }
#slider-box .slider-con u:after {bottom:16px;}
#slider-box .slider-con h2 {font-size:60px;line-height: 68px; font-weight: bold; position: relative;}
#slider-box .slider-con h2 u:after {bottom:7px;}
#slider-box .slider-con p.txt {font-size:18px; line-height: 30px; font-weight: normal; padding:20px 0 26px;}
#slider-box .slider-con .dis-tb-cell {padding-bottom: 4em;}
#slider-box .bx-controls { position: absolute; top:50%; left:0; right:0; margin-top: 220px;}
#slider-box .bx-controls .bx-pager { text-align: center;}
#slider-box .bx-controls .bx-pager .bx-pager-item {display: inline-block; margin: 0 5px;}
#slider-box .bx-controls .bx-pager .bx-pager-item a {width:16px;height: 16px; display: inline-block; border-radius: 50%; background:none; border:1px solid #fff; overflow: hidden; color:transparent;}
#slider-box .bx-controls .bx-pager .bx-pager-item a.active {background:#fff;}

.scroll-btn {position: absolute; bottom:116px; left:50%; margin-left: -81px; width:162px; height:80px; display: block; text-align: center; color:#fff; border:3px solid #de233a; color:transparent;}
.scroll-btn:before {position:absolute; top:0;left:-4px; right:0; bottom:0; background-position: -1000px 0; width:100%; height:100%; content: ''; display: block;}

#latest-area .inner {position: relative; z-index: 100; color:#fff;}
#latest-area .labox {position: relative; height:70px;}
#latest-area .labox header {position: absolute; top:0;left:0;}
#latest-area .labox header h3 {line-height: 70px; font-size:17px; font-weight: 600;}
#latest-area .labox ul {list-style: none;}
#latest-area .labox ul li {line-height: 70px; width:370px; font-size:14px; max-width:100%; }
#latest-area .labox ul li a {color:#fff;text-overflow: ellipsis;  white-space: nowrap; overflow: hidden; display: inline-block; width:70%;}
#latest-area .labox ul li span.date {float: right; display: block;}
#latest-area .labox .slider-btn {position: absolute; top:50%; margin-top: -13px; right:0;}
#latest-area #labox-news .slider-btn {right:20px;}
#latest-area #labox-media header {padding-left: 30px;}
#latest-area .slider-btn a {display: block; height:26px; width:26px; color:transparent; background-position: -50px -800px; float: left; opacity: 0.6; position: relative; overflow: visible;}
#latest-area .slider-btn #slider2-prev a, #latest-area .slider-btn #slider3-prev a {width:25px; background-position: 0 -800px;}
#latest-area .slider-btn #slider2-next a, #latest-area .slider-btn #slider3-next a {width:25px; background-position: -25px -800px;}


/* 메인 섹션2 */
#main-gallery {background:#fff url(../img/main/mainBg.jpg) no-repeat 50% 50%;  background-size:cover;text-align: center;}
#main-gallery header {line-height: 50px; padding-top: 30px;}
#main-gallery header p {color:#333; font-size:28px;}
#main-gallery header h2 {color:#d23145; font-size:42px; padding-bottom: 40px;}
#main-gallery .bx-controls .bx-controls-direction a {width:52px;height:54px; display: block; float: left; border:2px solid #9f9f9f; opacity: 0.5; position: relative; overflow: visible;}
#main-gallery .bx-controls .bx-controls-direction a.bx-prev { background-position: -2px -702px; border-right:1px solid #9f9f9f;}
#main-gallery .bx-controls .bx-controls-direction a.bx-next { background-position: -54px -702px; border-left:1px solid #9f9f9f;} 


.figu {position: relative; overflow: hidden;}
.figu img {width:100%; transition: all 0.7s ease-in-out;}
.figu h3 {position:absolute; top:0; left:0; padding:1em; font-size:14px; color:#fff; background: #d23145; z-index: 66} 
.figu figcaption {position: absolute; bottom:0; left:0; right:0; font-size:17px; background:rgba(0,0,0,0.65); color:#fff; text-align: center; padding:1em; z-index:65; display: block;width:100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}



/* 메인 섹션3 */
#main-content {background:#fff url(../img/main/bg.gif) repeat; text-align: center; color:#fff;}
#main-content header {line-height: 50px; padding-top: 100px; background: url(../img/main/leaf.png) no-repeat 50% 94px; padding-bottom: 40px; position: relative;}
#main-content:after {position: absolute; content:''; display: block; width:1px; top:0;height:100%; max-height:154px; z-index: 1; background:#fff; left:50%; opacity: 0.45}
#main-content header p {font-size:28px;}
#main-content header h2 {font-size:42px;}
#main-content #link-area {padding-bottom: 27px;}
#main-content #link-area ul {font-size:0;text-align: center; margin-left: -16px; margin-right:-16px;}
#main-content #link-area ul li {display: inline-block; vertical-align: top; font-size:16px; margin:0 16px;}
#main-content #link-area ul li a {color:#fff; line-height: 26px; display: block;}
#main-content #link-area ul li a i {display: block;width:80px; height:80px; background-color:rgba(256,256,256,0.15); border-radius: 50%; margin-bottom: 10px; border:1px solid #fff; }

#row-link {height:48%;}
#row-link .inner {display: table; width:100%; height:100%; text-align: left;}
#row-link .inner a {position: absolute; top:0; left:0; right:0; bottom:0; z-index: 9; display: block; overflow: hidden; color:transparent;}
#row-link .inner h3 {display: inline-block; padding-right: 20px; border-left:4px solid #fff; padding-left: 20px; font-size:26px; font-weight: normal;}
#row-link .inner p {display: inline; font-size:16px;}
#row-link .link-box {width:100%; height:33.3%; position: relative;}
#row-link .link-box01 {background:#5997d2 url(../img/main/link01.jpg) no-repeat 50% 0; background-size: auto 100%;}
#row-link .link-box02 {background:#a8b63a url(../img/main/link02.jpg) no-repeat 50% 0; background-size: auto 100%;}
#row-link .link-box03 {background:#755848 url(../img/main/link03.jpg) no-repeat 50% 0; background-size: auto 100%;}


/* ovfer effect 960px 이상에서만 */
@media screen and (min-width:960px) {
	#main-gallery .bx-controls .bx-controls-direction a:hover, #main-gallery .bx-controls .bx-controls-direction a:focus {opacity: 1}
	#latest-area .slider-btn span a:hover:after {position: absolute; content: ''; display: block; top:0;bottom:0;right:-1px; width:1px; height:100%; background:#fff; z-index: 60;}
	#latest-area .slider-btn a:hover, #latest-area .slider-btn a:focus {opacity: 1}
	.figu a:before, .figu a:after {position: absolute; display: block; content: ''; opacity: 0; transition: all 0.2s ease-in-out;}
	.figu a:before {top:0;left:0;bottom:0;right:0; z-index: 90;background:rgba(0,0,0,0.8)}
	.figu a:after {width:46px; height:46px; top:50%; left:50%; margin-left: -23px; margin-top:-23px; background:url(../img/common/plus.png) no-repeat 0 0; z-index: 91;}
	.figu a:hover:before, .figu a:hover:after {opacity: 1;}
	.figu a:hover:after {animation:plusani 0.2s ease-in-out;opacity: 1}
	#main-content #link-area ul li a:hover {text-decoration: underline;}
	#main-content #link-area ul li a:hover i {background-color:#fff;animation: navani 0.3s ease-in-out;}
	#row-link .link-box:hover {animation:bgani 1.5s ease-in-out;}
	#row-link .link-box:after {position:absolute;content:''; display: block; background:rgba(0,0,0,0.8); top:0;left:0;right:0;bottom:0; opacity: 0; transition: all 0.2s ease-in-out;}
	#row-link .link-box:hover:after {opacity: 1}
	#row-link .link-box a:after {background: url(../img/common/plus.png) no-repeat 50% 50%; width:46px; height:46px; content:''; display: block; position: absolute; top:50%; left:50%; margin-left: -23px; margin-top: -23px; opacity: 0}
	#row-link .link-box a:hover:after {animation:plusani 0.2s ease-in-out;opacity: 1}	
	#main-content #link-area ul li a:hover i.lnb01, #main-content #link-area ul li a:focus i.lnb01 {background-position:-19px -541px}
	#main-content #link-area ul li a:hover i.lnb02, #main-content #link-area ul li a:focus i.lnb02 {background-position:-141px -542px;}
	#main-content #link-area ul li a:hover i.lnb03, #main-content #link-area ul li a:focus i.lnb03 {background-position:-261px -540px;}
	#main-content #link-area ul li a:hover i.lnb04, #main-content #link-area ul li a:focus i.lnb04 {background-position:-380px -541px;}
	#main-content #link-area ul li a:hover i.lnb05, #main-content #link-area ul li a:focus i.lnb05 {background-position:-500px -541px;}
	#main-content #link-area ul li a:hover i.lnb06, #main-content #link-area ul li a:focus i.lnb06 {background-position:-620px -539px;}
	#main-content #link-area ul li a:hover i.lnb07, #main-content #link-area ul li a:focus i.lnb07 {background-position:-740px -540px;}
	#main-content #link-area ul li a:hover i.lnb08, #main-content #link-area ul li a:focus i.lnb08 {background-position:-861px -540px;}
}


/* PC전용 */
@media screen and (min-width:1260px) {
	#slider-box {position:absolute;top:0px;left:70px;right:70px; bottom:0;}
	#gallery-slider {}
	#gallery-slider .mm-slide {text-align: center; display: block; height:610px;}
	#gallery-slider .mm-slide .inner {position: relative; height:614px; padding-bottom: 20px; display: block;}
	.figu {width:286px; height:296px; position: absolute;}
	.figu2,  .figu4,  .figu7, .figu12,  .figu9,  .figu14 {top:0;}
	.figu3, .figu2, .figu7, .fig8, .figu12, .figu13 {left:0;}
	.figu4, .figu5, .figu9, .figu10, .figu14, .figu15 {right:0;}
	.figu3,  .figu5,  .figu8, .figu10,  .figu13,  .figu15 {bottom:0;}
	.figu1, .figu6, .figu11 {width:590px; height:610px; left:306px;}
	#main-gallery .bx-controls {position: absolute; top:-90px; left:50%; margin-left: 496px}
	#main-gallery .bx-controls .bx-controls-direction {float: right;}
	#latest-area {position: absolute; bottom:0; left:70px; right:70px; z-index:70;}
	#latest-area #latest-bg {height:70px; position: absolute; left:0;right:0;bottom:0; z-index: 90;}
	#latest-area #latest-bg > * {height:100%;}
	#latest-area #latest-bg .red {background:#d31f36; background:rgba(211,31,54,0.8);}
	#latest-area #latest-bg .black {background:#000; background:rgba(0,0,0,0.7);}
	#latest-area .labox .labox-list {padding-left: 86px; padding-right: 130px; overflow: hidden; height:70px;}
	#latest-area #labox-media .labox-list {padding-left: 134px; padding-right: 120px;}
	.figu:hover  img {width:110%; margin-left: -5%; margin-top: -5%;}
}

@media screen and (max-width:1420px) {
	#slider-box {left:0px;right:0px;}
	#latest-area {left:0px; right:0px;}
	#fix-nav {right:0;}
}

/* pad , 모바일 공용 */
@media screen and (max-width:1259px) {
	#slider-box {position: relative;}
	#latest-area #latest-bg .red {background:#d31f36; background:rgba(211,31,54,0.8);}
	#latest-area #latest-bg .black {background:#000; background:rgba(0,0,0,0.7);}
	.fp-section, .fp-tableCell {height:auto !important;}
	#latest-area {position: relative;}
	#latest-area #labox-news {background:#c61c37; }
	#latest-area #labox-media {background:#222; }
	#latest-area #labox-news header {padding-left: 30px;}
	#latest-area #labox-media .slider-btn, #latest-area #labox-news .slider-btn {right:30px;}
	#latest-area .labox-list {float: none; width:100%;overflow: hidden; height:70px; position: relative;}
	#latest-area .labox ul li a { width:80%; }
	#latest-area .labox-list .bx-viewport {height: 70px !important}
	#main-gallery .bx-controls {position: absolute; top:-110px; left:0; right:0;}
	#main-gallery .bx-controls .bx-controls-direction {position: absolute; top:0; left:50%; width:108px; margin-left: -54px;}
	#row-link {height:auto;}
	#main-content:after {height:72px;}
	#row-link .link-box {height:144px; background-position: 60% 0}
	#row-link .inner h3 {margin-left: 30px;}
}

/* pad 전용 */
@media screen and (min-width:768px) and (max-width:1259px){
	#fullPage {padding:0 30px;}
	#slider-box {height:734px;}
	#latest-area #labox-news header, #latest-area #labox-media header {position: absolute; left:0; top:0;}
	#latest-area .labox .labox-list {padding-left: 124px; padding-right: 124px;}
	#latest-area #labox-media .labox-list {padding-left: 144px;}
	#main-gallery header {padding-top: 84px;}
	#main-gallery header h2 {padding-bottom: 140px;}
	#main-content #link-area ul {margin:0 auto;}
	#main-content #link-area ul li {margin-bottom: 30px;}
	#gallery-slider .mm-slide .inner {width:94%; max-width:760px;}
	.figu {float: left; position: relative; width:49%; height:auto; overflow:hidden;}
	.figu3, .figu8, .figu13 {width:100%; height:auto; max-height:360px; margin:2% auto;}
	.figu3 img, .figu8 img, .figu13 img {transform: translateY(-30%);}
	.figu1, .figu6, .figu11, .figu4, .figu9, .figu14 {margin-right: 2%;}
	#gallery-slider .mm-slide .inner {padding-bottom: 90px; overflow:hidden;}
	#slider-box .bx-controls { margin-top: 300px;}
	
}

/* 모바일 전용 */
@media screen and (max-width:600px) {
	#slider-box {height:300px;}
	#slider-box .slider-con {min-height:700px;}
	#slider-box .slider-con .bar {margin-top: 130px;}
	#main-slider .m-slide.add01 .slider-con {background-image: url(../img/sub/mainBanner1.jpg) !important;}
	#main-slider .m-slide.add02 .slider-con {background-image: url(../img/sub/mainBanner2.jpg) !important;}
	/*#main-slider .m-slide.add07 .slider-con {background-image: url(../img/main/mainBanner07.jpg) !important;}
	#main-slider .m-slide.add07 .slider-con {background-image: url(../img/main/mainBanner1.jpg) !important;}*/
	#main-slider .m-slide.add03 .slider-con {background-image: url(../img/sub/mainBanner3.jpg) !important;}
	#slider-box .slider-con p.stt {font-size:28px;line-height: 56px; font-weight: normal; }
	#slider-box .slider-con p.stt {font-size:28px;line-height: 56px; font-weight: normal; }
	#slider-box .slider-con h2 {font-size:48px;line-height: 56px; font-weight: bold; position: relative;}
	#slider-box .slider-con p.txt {font-size:20px; line-height: 30px; font-weight: normal; padding:20px 20px 26px;}
	#slider-box .slider-con a.btn-st01 {margin-bottom:140px; font-size:20px; width:200px; line-height: 70px; height:70px;}
	#main-content #link-area ul {margin:0 auto;}
	#main-content #link-area ul li {margin-bottom: 30px; margin:0 0.5em 1.2em;}
	#main-content #link-area ul li a i {transform: scale(0.9);}
	#slider-box .bx-controls {margin-top: auto; top:auto; bottom:50px;}
	#slider-box .bx-controls .bx-pager .bx-pager-item {margin:0 0.5em;}
	#slider-box .bx-controls .bx-pager .bx-pager-item a {width:24px; height:24px;}
	#latest-area .labox header {position: relative; top:auto;left:auto; padding:24px 0 0;}
	#latest-area .labox header h3 {line-height: 30px; font-size:24px; font-weight: 600;}
	#latest-area .labox {height:110px;}
	#latest-area .labox ul li {line-height: 48px; width:100%; font-size:18px; height:48px; }
	#latest-area .labox ul li a {padding-left: 30px; width:67%;}
	#latest-area .labox ul li span.date {padding-right: 30px;}
	#latest-area .labox .slider-btn {top:34px;}
	#latest-area .labox-list .bx-viewport {height:48px !important;}
	#main-gallery {overflow:hidden; padding-bottom: 80px;}
	#main-gallery header {padding-top: 80px;}
	#main-gallery header h2 {padding-bottom: 130px;}
	.figu a {display: block;width:90%; position: relative; margin:0 auto;}
	#row-link .inner p {display: none;}
	#row-link .link-box {background-position: 60% 0}
	#main-content #link-area ul li {font-size:16px; margin:0 0 16px;}
	#main-content #link-area ul li a {line-height: 22px;}
	#main-content #link-area ul li a i {-webkit-transform: scale(0.8);-ms-transform: scale(0.8);transform: scale(0.8); margin-bottom: 0px;}
}
/* 작은거 */
@media screen and (max-width:800px) {
	#slider-box {height:400px;}
	#slider-box .slider-con {min-height:320px;}
	#main-slider .m-slide:first-child .slider-con {/*height: auto !important;*/}
	#main-slider .m-slide:last-child .slider-con {/*height: auto !important;*/}
	#slider-box .slider-con .dis-tb-cell { display: block; }
	#slider-box .slider-con .bar {width:54px; height:3px; margin-bottom: 12px; margin-top: 120px;}
	#slider-box .slider-con p.stt {font-size:22px;line-height: 28px;}
	#slider-box .slider-con p.stt u:after {bottom:3px;}
	#slider-box .slider-con h2 {font-size:34px;line-height: 42px; letter-spacing: -2px;}
	#slider-box .slider-con p.txt {font-size:16px; line-height: 22px; font-weight: normal; padding:14px 20px 20px;}
	#slider-box .slider-con a.btn-st01 {margin-bottom:0px; font-size:16px; width:180px; line-height: 50px; height:50px;}
	#latest-area .labox {height:90px;}
	#latest-area .labox header {padding:14px 0 0;}
	#latest-area .labox header h3 {font-size:18px;}
	#latest-area .labox ul li {line-height: 38px; width:100%; font-size:16px; height:38px; }
	#latest-area .labox ul li span.date {display: none;}
	#latest-area .labox ul li a {width:90%;}
	#latest-area .labox .slider-btn {top:26px;}
	#main-gallery header {line-height: 40px; padding-top: 30px;}
	#main-gallery header p {font-size:20px;}
	#main-gallery header h2 { font-size:36px; padding-bottom: 100px;}
	#main-gallery .bx-controls {top:-84px;}
	#main-gallery {padding-bottom: 50px;}
	#main-content header p {font-size:18px; line-height: 26px; letter-spacing: -1px;}
	#main-content header h2 {font-size:26px; line-height: 32px;}
	#main-content header {padding-top: 50px; padding-bottom: 30px;}
	#main-content:after {height:40px;}
	#main-content #link-area {padding-bottom: 30px;}
	#row-link .inner h3 {font-size:22px; text-shadow: 0px 0px 1px rgba(0,0,0,0.5)}
	#row-link .link-box {height:100px;background-position:60% 0;}
}


@keyframes bgani{
	0% {background-position:50% 0;}
	10% {background-position:10% 0;}
	30% {background-position:60% 0;}
	40% {background-position:50% 0;}
	100% {background-position:50% 0;}
}

@keyframes plusani{
	0% {transform: rotate(-90deg) scale(6); opacity: 0}
	100% {transform: scale(1); opacity: 1}
}

#mobile_alt {position: fixed; top:50%; left:50%; margin-left:-139px; margin-top: -207px; z-index: 9999; text-align: center;}
#mobile_alt img {max-width:100%;}
#top-btn-area {display: none !important;}
