@charset "UTF-8";

/********************************************************

■ 사이트 초기 설정

********************************************************/

.txt-bc1, i.txt-bc1, a.txt-bc1, a.txt-bc1:link, a.txt-bc1:visited, a.txt-hover-bc1:hover, a.txt-hover-bc1.on { color: #c22121 !important; }

.bg-bc1, a.bg-bc1, .bg-hover-bc1:hover, .bg-before-bc1:before, .bg-after-bc1:after, .bg-hover-div-bc1:hover > div { background-color: #c22121 !important; color: white !important; }

.border-bc1, a.border-bc1, .border-hover-bc1:hover { border-color: #c22121 !important; }

.txt-bc2, i.txt-bc2, a.txt-bc2, a.txt-bc2:link, a.txt-bc2:visited, a.txt-hover-bc2:hover, a.txt-hover-bc2.on { color: #872929 !important; }

.bg-bc2, a.bg-bc2, .bg-hover-bc2:hover, .bg-before-bc2:before, .bg-after-bc2:after, .bg-hover-div-bc2:hover > div { background-color: #872929 !important; color: white !important; }

.border-bc2, a.border-bc2, .border-hover-bc2:hover { border-color: #872929 !important; }

.txt-bc3, i.txt-bc3, a.txt-bc3, a.txt-bc3:link, a.txt-bc3:visited, a.txt-hover-bc3:hover, a.txt-hover-bc3.on { color: #b75858 !important; }

.bg-bc3, a.bg-bc3, .bg-hover-bc3:hover, .bg-before-bc2:before, .bg-after-bc2:after, .bg-hover-div-bc3:hover > div { background-color: #b75858 !important; color: white !important; }

.border-bc3, a.border-bc3, .border-hover-bc3:hover { border-color: #b75858 !important; }



/* 버튼 색상 정의 */

.bt.bt-lrline { border-color: #c22121; color: #c22121; }

.bt.bt-lrline::before, .bt.bt-lrline::after { background: #c22121; }

.bt.bt-rightarrow { border-color: #aaa; }

.bt.bt-rightarrow:hover { border-color: #c22121; color: #c22121; }

.bt.bt-default.bt-default2 { background-color: #c22121; border: 0; color: white; }

.bt.bt-default.bt-default2:hover { background-color: #b75858; }



/* 전역(Global) 설정 */

.hover-a-border7 .a:hover::after { border-color: #c22121; /* 게시판이나 기타 타일 요소에서 재정의할 수 있음. */ }



/* 내용 드래그했을때 선택 블록 */

::selection { background: #c22121 !important; color: white; }

::-moz-selection { background: #c22121 !important; color: white; }



/********************************************************

■ HTML 요소 초기화

********************************************************/

/* 기반 글자크기 재정의 -- 상대단위(rem) 사용에 중요함. */

html, body { font-size: 16px; font-family:  "NotoSans", "NanumBarunGothic", "NBG", sans-serif; }

body { position: relative; left: 0; overflow-x: hidden; color: #333; transition: all 200ms; height:100%; }



.h0, .h1, .h2, .h3, .h4, .h5, .h6, .h0n, .h1n, .h2n, .h3n, .h4n, .h5n, .h6n, h1, h2, h3, h4, h5, h6 { margin-top: 0; }



.head { font-family:"Godo"; }



/********************************************************

■ Layout : 레이아웃

********************************************************/

#thema_wrapper { margin-top:120px; }

#thema_wrapper.is-subpage { margin-top:170px; }

@media (max-width: 767px) { 

	#thema_wrapper { margin-top:90px; }

	#thema_wrapper.is-subpage { margin-top:90px; }

}



/*

.pg-sub > .at-content { padding: 80px 0; }

.pg-sub > .at-content.no-padding-top { padding-top: 0; }

.pg-sub > .at-content.no-padding { padding-top: 0; padding-bottom: 0; }

*/



/* 우측 점박이 스크롤 (fullPage 플러그인 제공 기능) */

#fp-nav.right { right: 50px; }

#fp-nav ul li { margin: 7px 0; }

#fp-nav ul li a span, #fp-nav ul li a:hover span, #fp-nav ul li a.active span, #fp-nav ul li a.active:hover span { width: 12px; height: 12px; margin: 0; }

#fp-nav ul li a span { background: #c22121; border: 3px solid #c22121; }

#fp-nav ul li a:hover span, #fp-nav ul li a.active span { background-color: transparent; }



/*

@media (max-width: 767px) {

	.pg-main, .pg-sub { padding-top: 90px; } 

}

*/



/********************************************************

■ Page Title : 페이지 타이틀 및 설명글

********************************************************/

.at-title { height: 45px; margin: 40px 0; position: relative; border-bottom: 1px solid #ddd; }

.at-title .page-title { position: absolute; left: 5px; top: 0; }

.at-title .page-desc { position: absolute; right: 5px; top: 7px; color: #888; }



/********************************************************

■ Sub Title : 서브 타이틀 및 설명글

********************************************************/

.at-content header.header { margin-bottom:50px; text-align:center; }



.at-content header.header .head {  }

.at-content header.header .icon { display:none; } /* 아이콘 */

.at-content header.header .desc { display:block; } /* 설명글 */



@media all and (max-width:768px) {

	.at-content header.header { margin-bottom:30px; }

	.at-content header.header .head { margin-bottom:5px; }

}



/********************************************************

■ Main Page : 메인 인덱스 페이지

********************************************************/

.pg-main section.sec { padding-top: 40px; padding-bottom: 40px; }

.pg-main section.sec.no-padding { padding-top: 0; padding-bottom: 0; }

.pg-main section.sec .header { text-align: center; font-weight: 400; }

.pg-main section.sec .header .head { margin: 0; margin-bottom: 15px; padding: 0; }

.pg-main section.sec .header .line { display: inline-block; background-color: #f17f42; width: 80px; height: 3px; margin: 20px 0 30px; }

.pg-main section.sec .header .desc { font-size: 18px; }

.pg-main section.sec .header .desc2 { margin-top: 20px; }



.section .section-wrap { padding-top: 75px; padding-bottom: 75px; }

.section .header { text-align: center; }

.section .header .head { margin: 0; padding: 0; }

.section .header .line { display: inline-block; background-color: #f17f42; width: 100px; height: 5px; margin: 30px 0; }

.section .header .desc2 { margin-top: 20px; }



/********************************************************

■ Page Content : 서브페이지 본문

********************************************************/

.at-content-wrap { display:flex; width:100%; }

.at-content-wrap #sub-menu { width:250px; border-left:1px solid #ddd; border-right:1px solid #ddd; }

.at-content-wrap .sub-content-wrap { width:calc(100% - 250px); padding:50px; padding-right:0; min-height:500px; }



@media (max-width: 1400px) {

	.at-content-wrap .sub-content-wrap { width:100%; padding:50px 0; }

}



.page-content { word-break: keep-all; word-wrap: break-word; }



.page-content .header { margin-top: 20px; }

.page-content .header .line { display: inline-block; background-color: #f17f42; width: 100px; height: 3px; margin: 10px 0; }



.page-content .h0, .page-content h1, .page-content h2, .page-content h3 { margin-top: 0; line-height: 125%; }

.page-content p { margin: 0 0 15px; padding: 0; line-height: 160%; }

.page-content .head { margin-bottom: 10px; }

.page-content .desc { line-height: 150%; }



@media (max-width: 767px) {

	.page-content .pull-left, .page-content .pull-right { width: 100% !important; }

}

/********************************************************

■ Footer : 하단 푸터

********************************************************/

#bottom { position: relative; border-top:1px solid #ddd; }

#bottom .footer { background-color: #333; color: #888; }

#bottom .footer .content { position:relative; padding-top:30px; padding-bottom:30px; }

#bottom .footer .content ul { width:60%; font-size:0; }

#bottom .footer .content ul li { position:relative; display:inline-block; margin-bottom:5px; font-size: 0.938rem; }

#bottom .footer .content ul li.line { margin:0 20px; width:1px; height:10px; background:#888; }

#bottom .footer .content ul li.address { width:100%; }

#bottom .footer .content .link a { color:#ddd; }

#bottom .footer .content .link a:hover { border-bottom:1px solid #ddd; }

#bottom .footer .content .desc { margin-top: 20px; }

#bottom .footer .content .desc span { animation:twinkle 1.5s infinite; }



@keyframes twinkle {

	0%   { font-weight:300; }

	100% { font-weight:700; }

}



/* 푸터 sns */

#bottom .footer .content .sns { position:absolute; right:15px; bottom:30px; display:flex; align-items:center; }

#bottom .footer .content .sns a { margin:0 5px; width:25px; height:25px; background:none no-repeat center/100%; border-radius:5px; overflow:hidden; }

#bottom .footer .content .sns a.kakao { background-image:url('../../img/sns_icon_kakao.png'); }

#bottom .footer .content .sns a.facebook { background-image:url('../../img/sns_icon_facebook.png'); }

#bottom .footer .content .sns a.twitter { background-image:url('../../img/sns_icon_twitter.png'); }

#bottom .footer .content .sns a.instagram { background-image:url('../../img/sns_icon_instagram.png'); }

#bottom .footer .content .sns a.youtube { background-image:url('../../img/sns_icon_youtube.png'); }



/* 배경있는 sns 아이콘

#bottom .footer .content .sns a.kakao { background-image:url('../../img/sns_icon_kakao_bg.jpg'); }

#bottom .footer .content .sns a.facebook { background-image:url('../../img/sns_icon_facebook_bg.jpg'); }

#bottom .footer .content .sns a.twitter { background-image:url('../../img/sns_icon_twitter_bg.jpg'); }

#bottom .footer .content .sns a.instagram { background-image:url('../../img/sns_icon_instagram_bg.jpg'); }

#bottom .footer .content .sns a.youtube { background-image:url('../../img/sns_icon_youtube_bg.jpg'); }

*/



#bottom .footer .copyright { margin-top: 10px; font-size: 0.75rem; background:#222; padding:15px; text-align:center; }



@media (max-width: 1024px) { 

	#bottom .footer .content ul { width:100%; }

	#bottom .footer .content .sns { position:relative; bottom:auto; right:auto; margin-top:20px; }

}



@media (max-width: 768px) { 

	#bottom .footer .content { text-align:center; }

	#bottom .footer .content ul li { font-size: 0.875rem; }

	#bottom .footer .content ul li.line { margin:0 10px; }

	#bottom .footer .content ul.desc li { display:block; }

	#bottom .footer .content ul.desc li.line { display:none; }

	#bottom .footer .content .desc { margin-top: 20px; }

	#bottom .footer .content .sns { justify-content:center; }

}



.m-bottom { display: flex; justify-content: center; background-color: #333; color: white; }

.m-bottom > a { width: 80px; padding: 20px 0; color: white; border: 0 solid #eee; text-align: center; }

.m-bottom > a > div { margin-top: 6px; }



/********************************************************

■ Go Top & Bottom : 상단/하단 이동버튼

********************************************************/

.at-go .go-btn { display: none; position: fixed; width: 40px; bottom: 20px; right: 25px; z-index: 2; }

.at-go .go-btn span { display: block; color: #fff; background: rgba(0, 0, 0, 0.5); margin: 5px 0px; text-align: center; border-radius: 50%; width: 42px; height: 42px; line-height: 42px !important; font-size: 19px; }

.at-go .go-btn .go-bottom { display: none; }



@media (max-width: 768px) { 

	.at-go .go-btn { bottom: 0px; right: 5px; } 

}

/********************************************************

■ Bootstrap3 : 부트스트랩 기본속성

********************************************************/

/* Button */

.btn { font-family: "Noto Sans Korean", "NanumGothic", sans-serif; }

.btn-lg { padding: 10px 16px; border-radius: 3px; line-height: 1.33; font-size: 18px; }

.btn-lg i { top: 3px; font-size: 24px; position: relative; }

.btn-xs { padding: 4px 10px; }

.btn-sm { font-size: 14px; line-height: 16px; }



.is-pc .ko .btn-xs, .is-pc .ko .btn-sm { font-family: "Noto Sans Korean", "NanumGothic", sans-serif; }



/* Panel : Accordions */

.panel { box-shadow: none; -webkit-box-shadow: none; border-radius: 0px; }

.panel-group .panel { border-radius: 0px; }

.panel .panel-heading { border-radius: 0px; }



/* List Group */

.list-group-item { word-break: break-all; border-radius: 0 !important; }



/* Pagination */

.pagination { font-family: "Noto Sans Korean", "NanumGothic", sans-serif; }

.pagination li a { border-radius: 0 !important; color: #333 !important; line-height: 22px !important; }

.pagination li a i { line-height: 22px; }

.pagination li.active a { color: #fff !important; background: #444 !important; border-color: #444 !important; }



/* Progress */

.progress { position: relative; border-radius: 0px; height: 28px; overflow: hidden; margin-bottom: 15px; box-shadow: inset 0px 1px 2px rgba(0, 0, 0, 0.1); background-color: whitesmoke; -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); }

.progress .sr-only { font-family: "Roboto", sans-serif; margin: 0px 15px; left: 0px; width: auto; height: 28px; line-height: 28px; font-size: 12px; clip: auto; }

.sr-score { font-family: "Roboto", sans-serif; height: 28px; line-height: 28px; font-size: 12px; padding-right: 8px; }



/* Misc */

.form-control, .well, .btn, .alert, .input-group-addon, .label { border-radius: 0; }



/********************************************************

■ 그누보드 기타

********************************************************/

.content_move { margin-top: 30px; font-size: 0.8em; text-align: right; color: #aaa; }



.sns-share-icon img { width: 20%; max-width: 34px; border-radius: 50%; }



#captcha #captcha_key { width: 100px; }



/* 목록 - 카테고리 */

.list-category { margin: 40px auto; }

.list-category ul.category { display: inline-block; }

.list-category ul.category li { float: left; border: 1px solid #ccc; border-right-width: 0; font-size: 15px; line-height: 15px; }

.list-category ul.category li a { display: block; padding: 10px 30px; }

.list-category ul.category li a:hover { background: #ccc; color: #333; }

.list-category ul.category li.active a { background: #777; color: white; }

.list-category ul.category li:last-child { border-right-width: 1px; }

.list-category select.m-category { width: 100%; height: 40px; }

.list-category.cgs-center-mlr4 { text-align: center; }

.list-category.cgs-center-mlr4 ul.category li { margin: 0 4px; border-right-width: 1px; }



/* 페이지 네비 부분 */

.list-wrap #infscr-loading { position: fixed; z-index: 100; width: 200px; left: 50%; transform: translateX(-50%); bottom: 50px; margin: 0; padding: 10px; background: rgba(0, 0, 0, 0.8); border-radius: 10px; color: white; text-align: center; }

.list-wrap .list-more { margin: 15px 0 30px; text-align: center; }

.list-wrap .list-more a { color: #aaa; }

.list-wrap .list-more a i { font-size: 3rem; }

.list-wrap .list-more a:hover { color: #333; }

.list-wrap .pagination { padding-top: 20px; }

.list-wrap .pagination a { color: #333 !important; }

.list-wrap .pagination .active a { background: #444 !important; border-color: #444 !important; color: #fff !important; }



.view-wrap .content p { margin-bottom: 0; }

.view-wrap .pagination a { color: #333 !important; }

.view-wrap .pagination .active a { background: #444 !important; border-color: #444 !important; color: #fff !important; }



/* SNS / 좋아요 버튼 */

.view-wrap .view-sns { display: block; text-align: center; margin-top: 70px; }

.view-wrap .view-sns > div { display: inline-block; }

.view-wrap .view-sns a { float: left; margin: 0 4px; border-radius: 10px; overflow: hidden; }

.view-wrap .view-sns a:nth-child(2), .view-wrap .view-sns a:nth-child(3), .view-wrap .view-sns a:nth-child(4), .view-wrap .view-sns a:nth-child(5), .view-wrap .view-sns a:nth-child(7), .view-wrap .view-sns a:nth-child(8) { display: none; }

.view-wrap .a-good { position: relative; float: right; width: 50px; height: 50px; line-height: 50px; text-align: center; display: block !important; overflow: visible !important; }

.view-wrap .a-good:hover i { color: #333; }

.view-wrap .a-good i { line-height: 50px; font-size: 1.7rem; color: #f5f5f5; }

.view-wrap .a-good div { position: absolute; top: -12px; padding: 0 7px; right: 0; transform: translateX(50%); -ms-transform: translateX(50%); height: 25px; line-height: 25px; border-radius: 12px; border: 1px solid #eee; background: white; color: #333; box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.4); }

.view-comment { margin: 20px 0; text-transform: capitalize; overflow: hidden; border-bottom: 1px solid #333333; display: inline-block; position: relative; }



/* Comment */

.comment-media { margin: 10px 0px; }

.comment-media .photo i { background: whitesmoke; padding: 15px; border-radius: 50%; width: 64px; height: 64px; text-align: center; color: #8f8f8f; font-size: 30px; display: inline-block; }

.comment-media .photo img { border-radius: 50%; width: 64px !important; height: 64px !important; display: inline-block; }



.view-mobile .comment-media .photo i { padding: 10px; width: 54px; height: 54px; }

.view-mobile .comment-media .photo img { width: 54px !important; height: 54px !important; }



.comment-media .media { border-top: 1px solid #eee; margin: 7px 0px; padding: 7px 0px 0px; }

.comment-media :first-child.media { border-top: 0px; margin-top: 0px; padding-top: 0px; }

.comment-media h5 { margin: 2px 0px; line-height: 22px; }

.comment-media .media .media-body { padding-left: 0px; }

.comment-media .media .media-info { margin-left: 10px; }

.comment-media .media .media-content { margin-top: 8px; }

.comment-media .media .media-btn { margin-left: 4px; }



.comment-media .cmt-good-btn { text-align: right; padding-right: 1px; }

.comment-media .cmt-good, .comment-media .cmt-nogood { display: inline-block; width: 74px; height: 20px; margin-top: 10px; padding-right: 10px; margin-right: -1px; font: bold 11px verdana; text-align: right; letter-spacing: -1px; line-height: 19px; cursor: pointer; }

.comment-media .cmt-good { background: url("./img/cmt_good.gif") no-repeat left center; color: #f4695b; }

.comment-media .cmt-nogood { background: url("./img/cmt_nogood.gif") no-repeat left center; color: #888; }



.comment-form { padding-top: 10px; }

.comment-box { border: 1px solid #ddd; padding: 12px 12px 0px; margin-bottom: 15px; background: #fbfbfb; }

.comment-content { display: table; width: 100%; table-layout: fixed; }

.comment-content .comment-cell { display: table-cell; padding: 0px; text-align: center; vertical-align: middle; }

.comment-content .comment-cell.comment-submit { width: 80px; height: 100%; background: #fafafa; border: 1px solid #ccc; border-left: 0px; cursor: pointer; }

.comment-btn .cursor { margin-left: 12px; color: #787878; }



/*# sourceMappingURL=colorset.css.map */

