@charset 'utf-8';
.section { background-position: center center; background-repeat: no-repeat; background-size: 120% auto; transition: background 2s 0.3s; } 
.sec1 { background-image: url('../images/bg_main_01_m.jpg'); } 
.sec2 { background-image: url('../images/bg_main_02_m.jpg'); } 
.sec3 { background-image: url('../images/bg_main_03_m.jpg'); } 
.sec4 { background-image: url('../images/bg_main_04_m.jpg'); background-position: right top; } 
.sec1.fp-completely, .sec4.fp-completely { background-size: 105% auto; } 
.sec2, .sec3 { background-size: cover; background-position: center top; } 
.fp-wrap { padding: 0 2rem; padding-right: 0; } 

/* 1. 무엇 */
.sec-hd { } 
.sec-hd h2 { font-size: 2.8rem; } 
.sec-hd .h2-desc {} 
.section-tab-menu { margin: 1rem 0 3rem; font-size: 1.5rem; font-weight: 500; } 
.section-tab-menu li { position: relative; float: left; padding-right: 2.4rem; line-height: 2; } 
.section-tab-menu li:after { position: absolute; right: 0; top: 50%; content: ''; display: block; width: 0.4rem; height: 0.4rem; margin: -0.2rem 1rem 0; border-radius: 100%; background-color: #fff; opacity: 0.3; } 
.section-tab-menu li:last-child:after { display: none; } 
.section-tab-menu li a { display: inline-block; } 
.section-tab-menu li.on a { border-bottom: 2px solid #b1ee69; color: #b1ee69 !important; } 
.sec-contents { } 
.sec1 .tab-box { display: none; } 
.slick-container a { display: block; margin-right: 3rem; background-color: #fff; } 
.book-wrap { } 
.book-slide { width: 20rem; } 
.space-wrap, .intro-wrap { width: calc(100% + 2rem); transform: translateX(-2rem); } 
.space-wrap .slick-list, .intro-wrap .slick-list { padding: 2rem; padding-right: 0; } 
.space-slide, .intro-slide { width: 20rem; box-shadow: 0 0 8px rgba(0,0,0,0.15); } 
.dl-info { padding-bottom: 15%; } 
.dl-info dt { position: absolute; left: -9999em; } 
.dl-info dd { margin: 3% 5%; color: #999; font-weight: 500; } 
.dl-info .dl-img { position: relative; margin: 0; margin-bottom: 7%; background-color: #f0f0f0; overflow: hidden; } 
.dl-info .dl-img img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); box-shadow: 0 0.2rem 0.6rem rgba(0,0,0,0.5); } 
.landscape .dl-img { padding-top: 70%; } 
.landscape img { width: 100%; } 
.portrait .dl-img { padding-top: 90%; } 
.portrait img { height: 80%; } 
.dl-info .dl-subject { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 2rem; font-family: 'Nanum Myeongjo', '바탕', serif; font-weight: 700; color: #333; } 
.dl-info .dl-desc { display: none; } 
.dl-cate { overflow: hidden; } 
.dl-cate span { float: left; display: block; } 
.cate-d1:after { display: inline-block; content: ''; width: 0.8rem; height: 0.8rem; margin-right: 0.3rem; border: 0.2rem solid #ccc; border-color: #ccc #ccc transparent transparent; transform: rotate(45deg); } 
.cate-d2 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 
.full-img .dl-img { height: 15rem; } 
.full-img .dl-img img { position: static; width: 100%; height: 100%; object-fit: cover; transform: none; } 
.sec2 .space-btn { padding: 0 3.6rem; margin: 3rem 0; } 
.sec2 .space-btn:hover { color: #F55521 !important; } 
.sec2 .space-btn:hover:before { background-color: #fff; opacity: 1; } 
.sec3 .rg-introduce { margin: 3rem 0; width: 36rem; line-height: 2; font-weight: 500; } 
.sec3 .rg-introduce li { float: left; width: 50%; } 
.sec3 .rg-introduce li:before { float: left; margin-top: 1.6rem; margin-right: 0.4rem; content: ''; display: block; width: 1.2rem; height: 0.1rem; background-color: #ccc; transform: rotate(60deg); } 
.sec3 .rg-introduce li a:hover { color: #F55521; } 

.sec4 .fp-wrap { padding-right: 2rem; } 
.sec4 .sec-hd { margin-bottom: 2rem; } 
.sec4 .share-wrap { text-align: center; } 
.sec4 .share-wrap a { float: left; display: block; width: calc(50% - 0.1rem); padding: 2rem; margin: 0 0.1rem 0.1rem 0; background-color: #fff; background-position: center bottom; background-repeat: no-repeat; background-origin: content-box; background-size: auto 4rem; } 
.share1 { background-image: url('../images/icon_main_board_01.png'); } 
.share2 { background-image: url('../images/icon_main_board_02.png'); } 
.share3 { background-image: url('../images/icon_main_board_03.png'); } 
.share4 { background-image: url('../images/icon_main_board_04.png'); } 
.sec4 .share-wrap h4 { margin: 0; padding-bottom: 5rem; font-size: 2.4rem; color: #333; } 
.sec4 .share-wrap div { display: none; } 
.sec4 .share-bbs-wrap { margin-top: 2rem; background-color: rgba(255,255,255,0.2); } 
.bbs-container { } 
.bbs-slide { padding: 3rem; } 
.bbs-slide dt { position: absolute; left: -9999em; } 
.bbs-cate { } 
.sec4 .bbs-cate a { background-color: transparent; padding: 0 2rem; line-height: 2.8rem; border-radius: 1.4rem; overflow: hidden; } 
.sec4 .bbs-cate a:hover { color: #333 !important; } 
.bbs-subject { height: 5rem; margin: 1rem 0; font-size: 1.5rem; font-weight: 500; } 
.bbs-date { font-weight: 300; opacity: 0.8; } 
.sec3 .h2-desc {color: #fff;}

/* 풀페이지 커스터마이징 */
.fp-tableCell {padding-top: 7.2rem;}
.fp-auto-height .fp-tableCell {padding-top: 0;}
#fp-nav { display: none; } 
#fp-nav ul li { width: 1.4rem; height: 4.2rem; margin: 0; } 
#fp-nav ul li a { width: 10rem; height: 100%; } 
#fp-nav ul li a:before, #fp-nav ul li a:after { content: ''; position: absolute; left: 0.7rem; width: 0.1rem; height: 1.8rem; background-color: #fff; opacity: 0.3; } 
#fp-nav ul li:first-child a:before, #fp-nav ul li:nth-last-child(2) a:after, #fp-nav ul li:last-child { display: none; } 
#fp-nav ul li a:before { top: 0; } 
#fp-nav ul li a:after { bottom: 0; } 

#fp-nav ul li a span { position: absolute; left: 0.4rem; top: 1.8rem; width: 0.6rem; height: 0.6rem; margin: 0; background-color: #fff; opacity: 0.3; } 
#fp-nav ul li:hover a:before, #fp-nav ul li a.active:before, #fp-nav ul li:hover a.active:before,
#fp-nav ul li:hover a:after, #fp-nav ul li a.active:after, #fp-nav ul li:hover a.active:after { height: 1.4rem; } 
#fp-nav ul li:hover a span,
#fp-nav ul li a.active span,
#fp-nav ul li:hover a.active span { left: 0; top: 1.4rem; width: 1.4rem; height: 1.4rem; margin: 0; opacity: 1; } 

#fp-nav ul li .fp-tooltip { position: absolute; top: 0; left: 2.4rem; width: auto; line-height: 4.2rem; color: #fff; font-family: 'Noto Sans KR', 'Malgun Gothic', sans-serif; font-size: 2rem; opacity: 0.3; } 
#fp-nav ul li a.active ~ .fp-tooltip { opacity: 1; } 
.fp-tooltip {font-family: 'Nanum Myeongjo', '바탕', serif !important;}

/* slick 커스터마이징 */
.slick-dots { padding-left: 2rem; margin-top: 3rem; } 
.sec1 .slick-dots { padding-left: 0; } 
.slick-dots:after { content: ''; display: block; clear: both; } 
.slick-dots li { float: left; width: 1.4rem; height: 1.4rem; padding: 0.2rem; margin-right: 0.8rem; } 
.slick-dots li button { display: block; width: 100%; height: 100%; border: 0.2rem solid transparent; border-radius: 50%; background-color: rgba(255,255,255,0.3); text-indent: -9999em; overflow: hidden; } 
.slick-dots li.slick-active { padding: 0; } 
.slick-dots li.slick-active button { border-color: #fff; background-color: rgba(255,255,255,0); } 
.sec1 .arrow-tab { display: none; } 
.slick-arrow { width: 6rem; height: 6rem; border: 1px solid #fff; background: transparent center center no-repeat; text-indent: -9999em; overflow: hidden; } 
.slick-prev { border-right-width: 0; background-image: url('../images/icon_slide_prev_01.png'); } 
.slick-next { background-image: url('../images/icon_slide_next_01.png'); } 


/* 그레이색상 */


.shadow .slick-arrow { border-color: #fff;} 
.shadow .slick-prev { background-image: url('../images/icon_slide_prev_01.png'); } 
.shadow .slick-next { background-image: url('../images/icon_slide_next_01.png'); } 
.shadow .slick-dots li button { background-color: rgba(0,0,0,0.15); } 
.shadow .slick-dots li.slick-active button { border-color: #999; background-color: transparent; } 

/* 모바일만 ~767px */
@media screen and (max-width: 767px) { }

/* 태블릿부터 768px~ */
@media screen and (min-width: 768px){
    .fp-tableCell {padding-top: 7.8rem;}
 .sec-hd h2 { font-size: 3.6rem; } 
 .sec-hd .h2-desc { font-size: 2rem; } 
 .section-tab-menu { font-size: 2.2rem; } 
 .book-wrap { width: 87rem; } 
 .book-slide { width: 26rem; } 
 .space-slide, .intro-slide { width: 26rem; } 
 .dl-info dd { margin: 5% 8%; } 
 .dl-info .dl-subject { font-size: 2.4rem; } 
 .cate-d1:after { width: 1rem; height: 1rem; } 

 .sec4 .bbs-cate a { line-height: 3.2rem; border-radius: 1.6rem; } 
 .bbs-subject { height: 5.8rem; font-size: 1.8rem; } 
 }

/* 태블릿만 768px~1023px */
@media screen and (min-width: 768px) and (max-width: 1023px) { } 

/* PC부터 1024px~ */
@media screen and (min-width: 1024px){
    .fp-tableCell {padding-top: 9rem;}
 .sec1 { background-image: url('../images/bg_main_01_1.jpg'); } 
 .sec2 { background-image: url('../images/bg_main_02.jpg'); } 
 .sec3 { background-image: url('../images/bg_main_03.jpg'); } 
 .sec4 { background-image: url('../images/bg_main_04.jpg'); } 
 .sec1, .sec4 { background-size: 120% 100%; } 
 .sec1.fp-completely, .sec4.fp-completely { background-size: 100% 100%; } 
 .sec2, .sec3 { background-size: cover; background-position: center center; } 
 .fp-wrap { position: relative; padding-left: 17rem; } 
 .wrap { max-width: inherit; padding: 0 15rem; } 
 #fp-nav { display: block; } 
 .sec-hd { float: left; width: 40rem; } 
 .sec-hd h2 { width: 20rem; margin-bottom: 1.5rem; word-break: keep-all; line-height: 1.4; font-size: 5.4rem; } 
 .sec-hd h2:before { display: block; width: 5rem; height: 5rem; margin-bottom: 5rem; text-align: center; font: 500 1.6rem/5rem 'Noto Sans KR', 'Malgun Gothic', sans-serif; } 
 .sec1 h2:before { content: '01'; background-image: url('../images/bg_main_title_01.png'); color: #333; } 
 .sec2 h2:before { content: '02'; background-image: url('../images/bg_main_title_02.png'); color: #e0831e; } 
 .sec3 h2:before { content: '03'; background-image: url('../images/bg_main_title_03.png'); color: #fff; } 
 .sec4 h2:before { content: '04'; background-image: url('../images/bg_main_title_04.png'); color: #fff; } 
 .sec-hd .h2-desc { font-size: 1.6rem; } 
 .section-tab-menu { margin: 3rem 0; font-size: 1.6rem; } 
 .sec-contents { float: left; width: calc(100% - 66rem); } 
 .sec1 .tab-box { height: 48rem; } 
 .space-wrap, .intro-wrap { width: 195rem; } 
 .space-slide, .intro-slide { width: 36rem; } 
 .full-img .dl-img { height: 36rem; } 
 .dl-info .dl-subject { font-size: 2.2rem; } 
 .dl-info .dl-desc { display: block; height: 8rem; } 
 .slide-controls { position: absolute; left: 17rem; bottom: 2rem; } 
 .sec1 .slide-controls { bottom: 0; } 
 .sec4 .sec-hd { width: 30rem; } 
 .sec4 .sec-contents { width: calc(100% - 30rem); } 
 .sec4 .share-wrap { width: 50rem; text-align: left; } 
 .sec4 .share-wrap a { width: 24rem; height: 24rem; padding: 2.5rem; margin: 0 1rem 1rem 0; background-position: right bottom; background-size: inherit; } 
 .sec4 .share-wrap h4 { padding-bottom: 1.5rem; font-size: 2.2rem; } 
 .sec4 .share-wrap div { display: block; } 
 .sec4 .share-bbs-wrap { position: absolute; left: 17rem; bottom: 1rem; width: 26rem; margin-top: 0; } 
 .bbs-subject { height: 5.2rem; font-size: 1.6rem; overflow: hidden; } 
 .bbs-date { font-size: 1.3rem; } 
 }
/* PC부터 1280px~ */
@media screen and (min-width: 1280px){
 .fp-wrap { padding-left: 25.6rem; } 
 #fp-nav.fp-left { left: 3.6rem; } 
 .book-wrap { width: 84rem; } 
 .space-slide, .intro-slide { width: 35rem; } 
 .dl-info dd { font-size: 1.6rem; } 
 .book-wrap .dl-info .dl-img { padding-top: 100%; } 
 .landscape img { width: 90%; } 
 .portrait img { height: 70%; } 
 .dl-info .dl-subject { font-size: 2.2rem; } 
 .slide-controls { left: 25.6rem; } 
 .sec4 .sec-hd { width: 40rem; } 
 .sec4 .sec-contents { width: calc(100% - 40rem); } 
 .sec4 .share-wrap { width: 60rem; } 
 .sec4 .share-wrap a { width: 28.5rem; height: 26rem; padding: 4rem; margin: 0 1.5rem 1.5rem 0; } 
 .sec4 .share-wrap h4 { padding-bottom: 1.5rem; font-size: 2.4rem; } 
 .sec4 .share-bbs-wrap { width: 34rem; left: 25.6rem; bottom: 1.5rem; } 
 }

/* PC부터 1600px~ */
@media screen and (min-width: 1600px){
 .sec-contents { width: calc(100% - 74rem); padding-left: 8rem; } 
 }