@charset "utf-8";

#top_btn {display:none;position:fixed;right:40px;bottom:40px;width:56px;height:56px;color:#fff;text-align:center;line-height:56px;background:#111;border:none;border-radius:50%;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
#top_btn i {font-size:20px;}
#top_btn:hover {background:#a9d816;}
#top_btn.top_btn_sticky {display:block !important;}


#container_wrap {position:relative;width:100%;max-width:1490px;margin:0 auto;}
#container_wrap:after {display:block;visibility:hidden;clear:both;content:""}

#header_wrap {display:block;position:relative;float:left;width:250px;padding:0 20px;}
#header_wrap:after {display:block;visibility:hidden;clear:both;content:""}

#header {display:block;position:relative;}
#header:after {display:block;visibility:hidden;clear:both;content:""}

#header a.logo {display:block;line-height:70px;}
#header a.logo img {width:auto;height:30px;}

#gnb {display:block;position:relative;margin:0 0 40px 0;}
#gnb:after {display:block;visibility:hidden;clear:both;content:""}

#gnb_mobile {display:none;position:relative;margin:0 0 40px 0;}
#gnb_mobile:after {display:block;visibility:hidden;clear:both;content:""}

#header ul {}
#header ul li {display:block;color:#666;font-size:12px;line-height:25px;}
#header ul li.gap {margin:0 0 20px 0;}
#header ul li a {display:block;font-size:14px;line-height:35px;}
#header ul li a i {margin:0 12px 0 0;font-size:20px;}


#body_wrap {display:block;position:relative;float:left;width:calc(100% - 250px);padding:0 20px;}
#body_wrap:after {display:block;visibility:hidden;clear:both;content:""}

#body_header {display:block;position:relative;padding:10px;}
#body_header:after {display:block;visibility:hidden;clear:both;content:""}

#body_header ul {float:right;}
#body_header ul:after {display:block;visibility:hidden;clear:both;content:""}
#body_header ul li {display:block;float:left;margin:0 8px 0 0;}
#body_header ul li:last-child {margin:0;}
#body_header ul li a {display:block;min-width:40px;padding:0 12px;line-height:40px;text-align:center;background:#1a191e;border-radius:50px;}
#body_header ul li a i {color:#fff;font-size:24px;}
#body_header ul li a.count {color:#fff;background:#5cb2de}

.hd_sch_wr {display:block;float:left;position:relative;width:300px;}
.hd_sch_wr label {display:block;position:absolute;left:0;top:0;width:60px;color:#999;text-align:center;background:none;border:none;}
.hd_sch_wr label i {font-size:24px;line-height:50px;}
.hd_sch_wr #sch_stx {display:block;width:100%;height:50px;text-indent:60px;line-height:50px;border:none;border-radius:40px;}

#content_wrap {display:block;position:relative;}
#content_wrap:after {display:block;visibility:hidden;clear:both;content:""}

.mov_type {margin:0 0 80px 0;}
.mov_type h2 {display:block;position:relative;margin:0 0 20px 0;line-height:30px;}
.mov_type h2 strong {color:#fff;font-size:20px;font-weight:300;}
.mov_type h2 a.align {display:inline-block;margin:0 0 0 24px;color:#666;font-size:14px;}
.mov_type h2 a.more {display:block;position:absolute;right:0;top:0;color:#a9d816;font-size:16px;}
.mov_type ul {}
.mov_type ul:after {display:block;visibility:hidden;clear:both;content:""}
.mov_type ul li {display:block;float:left;width:15%;margin:0 2% 40px 0;cursor:pointer;}
.mov_type ul li:nth-child(6n) {margin:0 0 40px 0;}
.mov_type ul li .img {display:block;position:relative; overflow:hidden; margin:0 0 8px 0;}
.mov_type ul li .img img {width:100%;height:269px; width:100%; overflow:hidden; border-radius:10px;}
.mov_type ul li .img .season {display:block;position:absolute;left:5px;top:5px;padding:0 6px;color:#a9d816;font-size:12px;line-height:28px;background:#000;border-radius:3px;opacity:0.4;}
.mov_type ul li .img .overlay {display:block;position:absolute;left:0;right:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.8);opacity:0;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.mov_type ul li .img .overlay .play {display:block;position:absolute;left:50%;top:50%;width:50px;height:50px;margin:-25px 0 0 -25px;color:#fff;text-align:center;line-height:50px;}
.mov_type ul li .img .overlay .play i {font-size:64px;line-height:50px;}
.mov_type ul li .img .overlay .circlecover {display:block;position:absolute;right:15px;top:15px;width:40px;height:40px;color:#fff;font-family:'arial';font-size:12px;text-align:center;line-height:30px;border:4px solid #a9d816;border-top-color:transparent;border-radius:50%;transform: rotate(-45deg);}
.mov_type ul li .img .overlay .circlecover:after, 
.mov_type ul li .img .overlay .circlecover:before {display:block;position:absolute;border-radius:50%;width:4px;height:4px;background-color:#a9d816;content:'';}
.mov_type ul li .img .overlay .circlecover:after {right:2px;top:1px;}
.mov_type ul li .img .overlay .circlecover:before {left:1px;top:2px;}

.mov_type ul li .img .overlay .circle {display:block;color:#fff;font-family:'arial';font-size:12px;text-align:center;line-height:30px;transform: rotate(45deg);}
.mov_type ul li:hover .img .overlay {opacity:1;}
.mov_type ul li .category {margin:0 0 4px 0;color:#666; height:30px; line-height:30px; overflow:hidden; font-size:12px;}
.mov_type ul li .category .year {display:inline-block;margin:0 0 0 24px;}
.mov_type ul li .title {	    font-size: 15px;
    line-height: 1.5em; /* 각 행의 높이를 지정 */
    height: 3em; /* 2줄의 높이를 고정 */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bookmark {margin:0 0 80px 0;}
.bookmark:after {display:block;visibility:hidden;clear:both;content:""}
.bookmark .title {display:block;float:left;width:250px;color:#fff;font-size:20px;}
.bookmark .title p {margin:18px 0 0 0;color:#999;font-size:14px;}
.bookmark .linker {margin:0 0 0 300px;color:#666;font-size:12px;}
.bookmark .linker:after {display:block;visibility:hidden;clear:both;content:""}

.bookmark .linker .book {position:relative;float:left;width:70px;z-index:3;}
.bookmark .linker .book2 {position:relative;float:left;width:50px;z-index:2;margin:10px 0 0 -30px}
.bookmark .linker .book3 {position:relative;float:left;width:40px;z-index:1;margin:20px 40px 0 -25px}
.bookmark .linker .book img,
.bookmark .linker .book2 img,
.bookmark .linker .book3 img {width:100%;height:auto;border-radius:5px;}
.bookmark .linker .info {padding:20px 0 0 0;}
.bookmark .linker .info strong {display:block;margin:0 0 8px 0;color:#fff;font-size:14px;font-weight:normal}
.bookmark .linker .info a {display:inline-block;margin:0 24px 0 0;color:#666;}


.popular_content {margin:0 0 80px 0;}
.popular_content h2 {display:block;position:relative;margin:0 0 20px 0;color:#fff;font-size:18px;}
.popular_content ul {}
.popular_content ul:after {display:block;visibility:hidden;clear:both;content:""}
.popular_content ul li {display:block;float:left;width:25%;margin:0 0 20px 0;font-size:15px;line-height:30px;}
.popular_content ul li:after {display:block;visibility:hidden;clear:both;content:""}
.popular_content ul li .num {display:block;float:left;width:40px;text-align:center;}
.popular_content ul li .var {display:block;float:left;width:6px;height:30px;background:#a9d816;border-radius:40px;}
.popular_content ul li p {display:block;padding:0 20px;color:#fff;font-size:15px;
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis; 
-o-text-overflow:ellipsis;
-moz-binding: url('ellipsis.xml#ellipsis');
}



#footer_wrap {clear:both;display:block;position:relative;width:100%;margin:0 auto;padding:20px 0 50px 0;}
#footer_wrap:after {display:block;visibility:hidden;clear:both;content:""}

#footer {display:block;position:relative;margin:0 20px;}
#footer:after {display:block;visibility:hidden;clear:both;content:""}

#footer .left {float:left;width:470px;padding:0 30px 0 0;}
#footer .left a.logo {display:block;margin:0 0 20px 0;}
#footer .left a.logo img {width:auto;height:30px;}
#footer .left p {font-size:15px;line-height:160%;}

#footer .right {float:right;width:calc(100% - 500px);padding:0 20px;}
#footer .right:after {display:block;visibility:hidden;clear:both;content:""}
#footer .right dl {display:block;float:left;width:75%;}
#footer .right dl:last-child {width:25%;}
#footer .right dl dt {display:block;margin:0 0 10px 0;color:#666;font-size:12px;}
#footer .right dl dd {display:block;}
#footer .right dl dd a {display:block;line-height:30px;}

#footer .right dl:after {display:block;visibility:hidden;clear:both;content:""}

#footer .right dl:first-child dd {display:block;float:left;width:33.33%}

.btn_nav {display:none;position:absolute;left:0px;top:10px;width:50px;height:50px;color:#fff;text-align:center;line-height:50px;background:none;border:none;z-index:999;}
.btn_nav i {font-size:24px;}






@media screen and (max-width:1280px) {
#container_wrap {width:auto;max-width:940px;}

#header_wrap {float:none;width:100%;margin:0 0 25px 0;}
#header_wrap a.logo {text-align:center;}

#gnb {display:none;}
/*#gnb_mobile {display:block;}*/

ul.popular {display:none;}

#body_wrap {float:none;width:100%;}

#body_header {display:none;}

#gnb_mobile #body_header {display:block;padding:0;}
#gnb_mobile #body_header ul {float:none;}

#gnb_mobile .hd_sch_wr {float:none;width:100%;margin:0 0 20px 0;}

.mov_type ul li {width:24%;margin:0 1.33% 40px 0;}
.mov_type ul li:nth-child(6n) {margin:0 1.33% 40px 0;}
.mov_type ul li:nth-child(4n) {margin:0 0 40px 0;}

.bookmark .title {float:none;width:auto;margin:0 0 18px 0;}
.bookmark .linker {margin:0;}

.popular_content ul li {float:none;width:100%;}
.popular_content ul li:last-child {margin:0;}

#footer .left {float:none;width:auto;padding:0;margin:0 0 40px 0;}
#footer .right {float:none;width:auto;padding:0;}

.btn_nav {display:block;}
}





@media screen and (max-width:986px) {
#container_wrap {width:auto;max-width:696px;}

.mov_type ul li {width:32%;margin:0 2% 40px 0;}
.mov_type ul li:nth-child(6n) {margin:0 2% 40px 0;}
.mov_type ul li:nth-child(4n) {margin:0 2% 40px 0;}
.mov_type ul li:nth-child(3n) {margin:0 0 40px 0;}
.mov_type h2 a.align {display:none;}
}





@media screen and (max-width:780px) {
#container_wrap {width:auto;max-width:520px;}

.mov_type ul li .img img {
    max-height:160px;
	height:160px;
}
}