@charset "utf-8";
/* board */

/* 목록 */
.BoardList { width:100%; border-collapse:collapse; font-family:dotum, '돋움', sans-serif;  font-size:12px; margin-bottom:30px;}
.BoardList caption { font-size:0; height:0; width:0; overflow:hidden; position:absolute; }
.BoardList th { background:url(../images/sub/board_head_bg.png) repeat-x left bottom -3px; height:39px; border-top:#ccc solid 1px !important; border-bottom:#ccc solid 1px; font-weight:bold; border-right:none;}
.BoardList th:first-child {border-left:#ccc solid 1px;}
.BoardList th:last-child {border-right:#ccc solid 1px;}
.BoardList thead { box-shadow:0 3px 0 #f0f0f0;}

.BoardList tbody td { padding:10px 5px; text-align:center; border-bottom:#ddd solid 1px;}
.BoardList tbody td a {  margin-right:4px;}
.BoardList tbody td:nth-child(2) { text-align:left;}
.BoardList tbody td img { vertical-align:text-top;}

.Board_Ready { display:inline-block; width:66px; height:22px; font-size:12px; color:#fff; background:#666; text-align:center; border-radius:10px; line-height:22px;}
.Board_Finish { display:inline-block; width:66px; height:22px; font-size:12px; color:#fff; background:#35a99b url(../images/sub/board_finish.png) no-repeat 4px center; text-align:center; border-radius:10px; line-height:22px; padding-left:8px; text-shadow:#666 1px 1px 0;}

.BtnWrite { height:28px; background-image:url(../images/sub/icon_write.png), linear-gradient(#666, #4e4e4e); background-position:10px center, left top; background-repeat: no-repeat, repeat; border:#4e4e4e solid 1px;font-family:dotum, '돋움', sans-serif;  font-size:12px; line-height:26px; color:#fff; padding:0 10px 0 25px; float:right; }


/* 페이징 */
.Paging { text-align:center; margin-top: 20px;}
.Paging button { height:25px; width:25px; border:#ccc solid 1px; background:#fff no-repeat center center; text-align:left; text-indent:-1000px; overflow:hidden; display:inline-block; vertical-align:middle; margin-left: 5px;}
.Paging button.ArrowFirst { background-image:url(../images/sub/page_arrow_first.png);}
.Paging button.ArrowForward { background-image:url(../images/sub/page_arrow_forward.png);}
.Paging button.ArrowNext { background-image:url(../images/sub/page_arrow_next.png);}
.Paging button.ArrowLast { background-image:url(../images/sub/page_arrow_last.png); margin-left: 5px;}
.Paging button.Off { opacity:0.3; vertical-align:middle;}

.Paging .PageNum {  display:inline-block;margin:0 20px;}
.Paging .PageNum a { display:inline-block; height:25px; min-width:25px; padding:0 3px; line-height:25px; text-align:center; vertical-align:middle;}
.Paging .PageNum a:hover { border:#eee solid 1px; line-height:23px; }
.Paging .PageNum a.M_on { background:#177ca0; font-family:'나눔고딕B'; color:#fff; border:none !important;line-height:25px !important; vertical-align:middle;}


/* 보기페이지 */
.BoardView {font-family:dotum, '돋움', sans-serif;  font-size:14px;}
.BoardView .NewWin { background:url(../images/common/icon_newwin.png) no-repeat left top; width:12px; height:13px; display:inline-block; vertical-align:middle; margin-left:5px; text-indent:-1000px; overflow:hidden;}
.BoardView h3 {background:url(../images/sub/board_head_bg.png) repeat-x left bottom -3px; height:41px; border:#ccc solid 1px; font-weight:bold; font-size:14px; color:#333;box-shadow:0 2px 0 #f0f0f0; line-height:39px; padding-left:15px; position:relative; margin-bottom:-2px;}
.BoardView h3 span { position:absolute; right:8px; top:9px;}
.BoardView .ViewInfo { border-bottom:#ccc solid 1px;}
.BoardView .ViewInfo li { display:inline-block; height:33px; line-height:33px; padding: 0 30px 0 20px;}
.BoardView .ViewInfo li b { font-weight:bold;}
.BoardView .ViewInfo li.file { display:block; background:#f5f5f5; color:#555;}
.BoardView .ViewInfo li.file a {color:#555; text-decoration:underline;}
.BoardView .ViewInfo li.file b { font-weight:normal;}
.BoardView .ViewInfo li.etc {background: #f5f5f5; display: block; height: auto; border: #ddd solid 1px; padding: 8px 20px;}
.BoardView .ViewInfo li.etc input { vertical-align: middle; margin-top: -2px; }
.BoardView .ViewInfo li.etc label { margin-right: 20px; margin-bottom: 10px; display: inline-block; }

.BoardView .ViewCont { padding:25px 20px; border-bottom:#ddd solid 1px;}
.BoardView .ViewCont pre { line-height:20px; word-wrap:break-word;white-space:pre-wrap;word-break:break-all; }
.BoardView .Answer { padding:15px 20px; border-bottom:#ddd solid 1px; background:#f5f5f5; position:relative;}
.BoardView .Answer h4 { font-weight:bold; margin-bottom:15px;}
.BoardView .Answer .AnswerInfo { position:absolute; right:20px; top:15px;}
.BoardView .Answer .AnswerInfo strong { font-weight:bold;}
.BoardView .Answer pre { line-height:20px; word-wrap:break-word;white-space:pre-wrap;word-break:break-all; }

.ViewOther { border-top:#ddd solid 1px; height:38px; position:relative; padding-left:20px;}
.ViewOther a { display:inline-block; max-width:48%; height:37px; line-height:37px; float:left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.ViewOther a.OtherNext { position:absolute;right:20px; top:0;}

.BoardView strong {font-weight:bold; }

.BoardView .BtnGroup {  position:relative; margin-top:15px; height:28px; text-align:right;}

.BtnList { position:absolute; left:0; height:28px; background-image:url(../images/sub/icon_btn_liset.png), linear-gradient(#fff, #f4f5f4); background-position:10px center, left top; background-repeat: no-repeat, repeat; border:#ddd solid 1px;font-family:dotum, '돋움', sans-serif;  font-size:13px; line-height:26px; padding:0 13px 0 28px;  }

/* 쓰기페이지*/
.btn_delete { display:inline-block; background:url(../images/main/myindex_delete.png) no-repeat left top; width:15px; height:15px; text-indent:-1000px; overflow:hidden; vertical-align:middle; border-radius:8px; margin:0 2px;}
.BoardWrite input[type=file] {font-family:dotum, '돋움', sans-serif;  font-size:14px; height:24px;}
.BoardWrite h3 { padding-left:57px; line-height:36px; position:relative;}
/* .BoardWrite h3 label { font-size:12px; font-weight:bold; position:absolute; left:20px; top:11px; } */
.BoardWrite h3 label { font-size:14px; font-weight:bold; position:absolute; left:20px; }
.BoardWrite h3 input[type=text] { font-size:14px; margin-left:25px; width:770px;}

.BoardWrite .ViewCont { padding:0; }
.BoardWrite .ViewCont textarea { font-size:14px; font-family:dotum, '돋움', sans-serif; width:100%; height:300px; max-width:100%; max-height:300px; padding:20px; border:#ccc solid 1px; margin-bottom:0;}

.BoardWrite .ViewInfo li:first-child { position:relative; padding-left:83px;}
/* .BoardWrite .ViewInfo li:first-child label { position:absolute; left:20px; top:5px;} */
.BoardWrite .ViewInfo li:first-child label { position:absolute; left:20px; }


.BoardWrite .BtnGroup {  position:relative; margin-top:15px; height:28px; text-align:right;}

.BtnType1 { height:28px; background:#666 linear-gradient(#666, #4e4e4e); border:#4e4e4e solid 1px;font-family:dotum, '돋움', sans-serif;  font-size:13px; line-height:28px; color:#fff; padding:0 15px; margin-right:5px;}

.BtnType2 { height:30px; background:#fff linear-gradient(#fff, #f4f5f4); border:#ddd solid 1px;font-family:dotum, '돋움', sans-serif;  font-size:13px; line-height:30px; padding:0 15px;  }

.BtnType3 { height:28px; background:#666 linear-gradient(#666, #4e4e4e); border:#4e4e4e solid 1px;font-family:dotum, '돋움', sans-serif;  font-size:13px; line-height:26px; color:#fff; padding:0 15px; float:right;}
 

/* 웹툰 목록 */
.WebtoonList {margin-bottom:30px; overflow:auto;}
.WebtoonList li { width:200px; height:216px; float:left; margin-right:23px; margin-bottom:35px;}
.WebtoonList li:nth-child(4n) { margin-right:0;}
.WebtoonList li a { display:block; height:100%; position:relative;}
.WebtoonList li a span { display:block; font-family:dotum, '돋움', sans-serif; font-size:11px; }
.WebtoonList li a span.Img { height:126px; position:relative; background:no-repeat center center; text-indent:-1000px; overflow:hidden; margin-bottom:9px;}
.WebtoonList li a span.Img:after { content:''; width:100%;height:100%; border:#000 solid 1px; opacity:0.2; position:absolute; left:0; top:0; box-sizing:border-box;}
.WebtoonList li a span.Title { font-size:14px; color:#333; font-weight:bold; line-height:18px; padding-top:3px;letter-spacing: -1.5px;}
.WebtoonList li a:hover span { padding:0 8px;}
.WebtoonList li a span.Date { position:absolute; left:0; bottom:3px;}
.WebtoonList li:hover a:after  { content:''; display:block; width:100%; height:100%; border:#666 solid 3px; position:absolute; left:0; top:0; box-sizing:border-box;}
.WebtoonView .ViewCont { text-align:center;}
.WebtoonInfo { font-size:0; height:0; width:0; position:absolute; overflow:hidden;}
/*.WebtoonView .BtnGroup { position:fixed; bottom:40px; z-index:101;margin-left: 803px;}*/
.WebtoonView .BtnGroup.BtnFinal {position:absolute; bottom:auto; z-index:101;margin-left: 803px; margin-top:-100px;}
/*.WebtoonView .ViewInfo { position:absolute; right:0px; border:none; margin-top:-40px;}*/
.WebtoonView .ViewInfo { position:absolute; right:60px; border:none; margin-top:-40px;}
.WebtoonView .BtnGroup .BtnList { height:28px; background-image:url(../images/sub/icon_btn_liset.png), linear-gradient(#666, #4e4e4e); background-position:10px center, left top; background-repeat: no-repeat, repeat; border:#4e4e4e solid 1px;font-family:dotum, '돋움', sans-serif;  font-size:12px; line-height:26px; color:#fff; padding:0 10px 0 25px; float:right;  }
.WebtoonView .BtnGroupPosition {position:absolute;right:15px;top:91px;}
.WebtoonView .BtnGroup .BtnList1 { height:28px; background-image:url(../images/sub/icon_btn_liset.png), linear-gradient(#666, #4e4e4e); background-position:10px center, left top; background-repeat: no-repeat, repeat; border:#4e4e4e solid 1px;font-family:dotum, '돋움', sans-serif;  font-size:12px; line-height:26px; color:#fff; padding:0 10px 0 25px; float:right;}

/* 카드뉴스 목록 */
.CardNewsList {margin-bottom:30px; overflow:auto;}
.CardNewsList li { width:200px; height:216px; float:left; margin-right:23px; margin-bottom:35px;}
.CardNewsList li:nth-child(4n) { margin-right:0;}
.CardNewsList li a { display:block; height:100%; position:relative;}
.CardNewsList li a span { display:block; font-family:dotum, '돋움', sans-serif; font-size:11px; }
.CardNewsList li a span.Img { height:126px; position:relative; background:no-repeat center center; text-indent:-1000px; overflow:hidden; margin-bottom:9px;}
.CardNewsList li a span.Img:after { content:''; width:100%;height:100%; border:#000 solid 1px; opacity:0.2; position:absolute; left:0; top:0; box-sizing:border-box;}
.CardNewsList li a span.Title { font-size:14px; color:#333; font-weight:bold; line-height:18px; padding-top:3px;letter-spacing:-1px;}
.CardNewsList li a:hover span { padding:0 8px;}
.CardNewsList li a span.Date { position:absolute; left:0; bottom:3px;}
.CardNewsList li:hover a:after  { content:''; display:block; width:100%; height:100%; border:#666 solid 3px; position:absolute; left:0; top:0; box-sizing:border-box;}
.CardNewsView .ViewCont { text-align:center;}
.CardNewsInfo { font-size:0; height:0; width:0; position:absolute; overflow:hidden;}
/*.WebtoonView .BtnGroup { position:fixed; bottom:40px; z-index:101;margin-left: 803px;}*/
.CardNewsView .BtnGroup.BtnFinal {position:absolute; bottom:auto; z-index:101;margin-left: 803px; margin-top:-100px;}
/*.CardNewsView .ViewInfo { position:absolute; right:0px; border:none; margin-top:-40px;}*/
.CardNewsView .ViewInfo { position:absolute; right:60px; border:none; margin-top:-38px;}
.CardNewsView .BtnGroup .BtnList { height:28px; background-image:url(../images/sub/icon_btn_liset.png), linear-gradient(#666, #4e4e4e); background-position:10px center, left top; background-repeat: no-repeat, repeat; border:#4e4e4e solid 1px;font-family:dotum, '돋움', sans-serif;  font-size:12px; line-height:26px; color:#fff; padding:0 10px 0 25px; float:right;  }
.CardNewsView .BtnGroupPosition {position:absolute;right:15px;top:91px;}
.CardNewsView .BtnGroup .BtnList1 { height:28px; background-image:url(../images/sub/icon_btn_liset.png), linear-gradient(#666, #4e4e4e); background-position:10px center, left top; background-repeat: no-repeat, repeat; border:#4e4e4e solid 1px;font-family:dotum, '돋움', sans-serif;  font-size:12px; line-height:26px; color:#fff; padding:0 10px 0 25px; float:right;}

/* 20180307 카드뉴스 뷰화면 */
.view_slides {background:linear-gradient(#f4f4f4 78%, #333 78% ); width:870px;height:930px;margin-left:-20px;position:relative;padding:20px 0;border: #ddd solid 1px;}
.ViewBox {width:610px;height:685px;margin-left:130px;margin-bottom:30px;text-align:left;overflow:hidden;}
.viewBoxList {width:20000px;height:610px;}
.viewBoxList li {float:left;}
.viewBoxList li img {width:610px;height:610px;border:1px solid #ccc;}
.Pre_btn {position:absolute;left:49px;top:300px;}
.Nex_btn {position:absolute;right:49px;top:300px;}

.SlidesBox {width:770px;margin-left:51px;overflow:hidden;}
.SlidesBox p {text-align:right;color:#c8c8c8;width:100%;}
.SlidesBox p .listNum {font-weight:bold;color:#fff;}
.list_slides {float:left;margin-top:5px;width:3000px;height:150px;}
.list_slides li {float:left;margin-left:5px;}
.list_slides li:first-child {float:left;margin-left:0px;}
.list_slides li img {width:150px;}
.list_slides li a {opacity: .5;}
.list_slides li a.M_on {opacity: 1;}
.list_slides li a:hover {opacity: 1;}
.sPre {position:absolute;left:11px;bottom:20px;}
.sNex {position:absolute;right:11px;bottom:20px;}
/* 20180307 카드뉴스 뷰화면 */


.BannerOpen {width:200px; position:absolute; margin-top:-25px;}
.PageInfo.BannerOpen:before { height:0; width:0;}
.PageInfo.BannerOpen { padding-left:20px;}
.PageInfo.BannerOpen img { float:left; height:50px; margin-right:20px;}
.PageInfo.BannerOpen p { float:left; height:100%; padding-top:5px;}


/* UCC List */
.UCC_List { overflow:hidden; padding-left:35px}
.UCC_List a { position:relative; display:block; width:250px; height:260px; font-family:dotum, '돋움', sans-serif; float:left; margin-right:30px}
.UCC_List a span { display:block;}
.UCC_List a.last {margin-right:0;}
/*
.UCC_List .Good a:last-child { margin-right:0;}
.UCC_List .Fine a:last-child { margin-right:0;}
*/
.UCC_List a .Img { background-size:100% 100%; background: no-repeat center center; position:relative; width:250px; height:150px; text-indent:-1000px; overflow:hidden; margin-bottom:15px;}
.UCC_List a .Img:after { content:''; width:100%; height:100%; box-sizing:border-box; border:#000 solid 1px; opacity:0.1; display:block; position:absolute; left:0; top:0;}
.UCC_List a:hover .Img:after { border-width:2px; opacity:0.5;}
.UCC_List a .Level { font-size:11px; font-weight:bold; }
.UCC_List a .Title { font-size:14px; font-weight:bold; color:#333;  margin-bottom:5px;}
.UCC_List a:hover .Title { color:#000;}
.UCC_List a .Make { font-size:11px;}

/*.UCC_List .Best .Level {background:url(../images/sub/ucc_level_best.png) no-repeat left top;width:61px;height:65px;position:absolute;right:-1px;top:-1px;font-family:'나눔고딕B';font-size:14px;color:#E50D4F;text-shadow:1px 1px 1px #333;padding-top:15px;text-align: center;}*/
/*
.UCC_List .Best .Level { color: #E50D4F;}
.UCC_List .Best:before { content:''; display:block; background:url(../images/sub/ucc_level_best.png) no-repeat left top; width:38px; height:45px; position:absolute; right:10px; top:-1px; z-index:10;}
.UCC_List .Good a .Level { color:#06c;}

.UCC_View .ViewCont { text-align:center;}
.UCC_View .MovieText { padding:15px 20px; border-bottom:#ddd solid 1px; background:#f5f5f5; position:relative;}
.UCC_View .MovieText h4 { font-weight:bold; margin-bottom:15px;}
.UCC_View .MovieText h5 {font-family: dotum, '돋움', sans-serif; font-size: 14px; font-weight: bold; color: #005b88; margin-bottom: 15px;}
.UCC_View .MovieText .ConStory { background:#fff; border:#ddd solid 1px; height:200px; overflow:auto; line-height:20px; padding:20px; text-align:left; }

.UCC_View .MovieText .ConStory p { margin-bottom:20px;}
.UCC_View .MovieText .ConStory dl { clear:both;}
.UCC_View .MovieText .ConStory dt { float:left; margin-right:10px; font-weight:bold; color:#333;}
*/
.UCC_View .UccMovie {display: inline-block;}

.ViewCont_ListType .BoardList thead th { background:#f5f5f5; color:#555; height:30px; line-height:30px;}
.ViewCont_ListType .ListInfo { position:absolute; right:4px; margin-top:-35px; width:300px;}
.ViewCont_ListType .BtnGo { color:#fff; background:#666; background:linear-gradient(#7c7c7c, #666); border-color:#666;}
.ListInfo li span { background:url(../images/sub/ns03_info_title.png) no-repeat left top; width:72px; height:20px; padding-top:3px; display:inline-block; float:left; font-size:12px; color:#fff; font-weight:normal; text-align:center; margin-right:10px;}


/* 비밀번호입력 */ 
.Box { position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.7); z-index:100; text-align:center;}
.PassInput { background:#fff; position:absolute; width:400px; left:calc(50% - 200px); top:calc(50% - 75px); padding-bottom:15px;  }

.PassInput p {text-align:center; padding:15px 15px;}
.PassInput label { display:block; background:#f5f5f5; padding:15px; margin-bottom:15px;}
.PassInput label input { height:35px; width:60%; background:#fff; border:#ccc solid 1px;}

.PassInput button { height:30px; width:60px; font-size:12px; font-family:dotum, '돋움', sans-serif; border-radius:15px; line-height:30px;}
.PassInput button.Btn_Submit {background:#006699;  color:#fff; font-weight:bold; text-shadow:1px 1px 0 #333;}
.PassInput button.Btn_Cancel {background:#fff;  color:#666; font-weight:bold;  border:#ddd solid 1px;}


/* QNA, 홈페이지 개선의견 VIEW */
/* .BoardView1 {font-family:dotum, '돋움', sans-serif;  font-size:12px;} */
.BoardView1 {font-size:14px;}
.BoardView1 h3 {float:left;width:100%;height:auto;background:url(../images/sub/board_head_bg.png) repeat-x left bottom -3px; border:#ccc solid 1px; font-weight:bold; font-size:15px; color:#333;box-shadow:0 2px 0 #f0f0f0;  padding:7px 100px 7px 15px; position:relative; margin-bottom:4px;}
.BoardView1 h3 span { position:absolute; right:8px; top:7px;}
.BoardView1 .ViewInfo { border-bottom:#ccc solid 1px;}
.BoardView1 .ViewInfo li { display:inline-block; height:33px; line-height:33px; padding: 0 30px 0 20px;}
.BoardView1 .ViewInfo li b { font-weight:bold;}
.BoardView1 .ViewInfo li.file { display:block; background:#f5f5f5; color:#555;}
.BoardView1 .ViewInfo li.file a {color:#555; text-decoration:underline;}
.BoardView1 .ViewInfo li.file b { font-weight:normal;}
.BoardView1 .ViewInfo li.etc {background: #f5f5f5; display: block; height: auto; border: #ddd solid 1px; padding: 8px 20px;}
.BoardView1 .ViewInfo li.etc input { vertical-align: middle; margin-top: -2px; }
.BoardView1 .ViewInfo li.etc label { margin-right: 20px; margin-bottom: 10px; display: inline-block; }

.BoardView1 .ViewCont { padding:25px 20px; border-bottom:#ddd solid 1px;}
.BoardView1 .ViewCont pre { line-height:20px; word-wrap:break-word;white-space:pre-wrap;word-break:break-all; }
.BoardView1 .Answer { padding:15px 20px; border-bottom:#ddd solid 1px; background:#f5f5f5; position:relative;}
.BoardView1 .Answer h4 { font-weight:bold; margin-bottom:15px;}
.BoardView1 .Answer .AnswerInfo { position:absolute; right:20px; top:15px;}
.BoardView1 .Answer .AnswerInfo strong { font-weight:bold;}
.BoardView1 .Answer pre { line-height:20px; word-wrap:break-word;white-space:pre-wrap;word-break:break-all; }

.BoardView1 strong {font-weight:bold; }
.BoardView1 .BtnGroup {  position:relative; margin-top:15px; height:28px; text-align:right;}

/*.UCC_List .Best .Level {background:url(../images/sub/ucc_level_best.png) no-repeat left top;width:61px;height:65px;position:absolute;right:-1px;top:-1px;font-family:'나눔고딕B';font-size:14px;color:#E50D4F;text-shadow:1px 1px 1px #333;padding-top:15px;text-align: center;}*/
.UCC_List .Best .Level { color: #E50D4F;}
.UCC_List .Best:before { content:''; display:block; background:url(../images/sub/ucc_level_best.png) no-repeat left top; width:38px; height:45px; position:absolute; right:10px; top:-1px; z-index:10;}
.UCC_List .Good a .Level { color:#06c;}

.UCC_View .ViewCont { text-align:center;}
.UCC_View .MovieText { padding:15px 20px; border-bottom:#ddd solid 1px; background:#f5f5f5; position:relative;}
.UCC_View .MovieText h4 { font-weight:bold; margin-bottom:15px;}
.UCC_View .MovieText h5 {font-family: dotum, '돋움', sans-serif; font-size: 14px; font-weight: bold; color: #005b88; margin-bottom: 15px;}
.UCC_View .MovieText .ConStory { background:#fff; border:#ddd solid 1px; height:200px; overflow:auto; line-height:20px; padding:20px; text-align:left; }

.UCC_View .MovieText .ConStory p { margin-bottom:10px; font-weight: bold; color: #333;}
.UCC_View .MovieText .ConStory dl { clear:both;}
.UCC_View .MovieText .ConStory dt { float:left; margin-right:10px; font-weight:bold; color:#333;}

.UCC_View .MovieText .ConStory dd span {clear:both;display:block;}
.UCC_View .MovieText .ConStory li {margin-bottom:10px;}
.UCC_View .MovieText .ConStory li span {clear:both;display:block;}

.GoStatistics {
    font-family: '나눔고딕', dotum , '돋움', sans-serif;
    color: #fff;
    font-size: 15px;
    font-weight: bold;
    width: 160px;
    line-height: 35px;
    display: block;
    border-radius: 5px;
    padding-left: 25px;
    margin: 0 auto;
    margin-bottom: 25px;
    background: #177ca0 url(../images/common/GoStatistics.png) no-repeat 130px center;
    position: relative;
    margin-top: 30px;
}
