@charset "utf-8";
/* CSS Document */

.floatnone { float: none; vertical-align: middle; margin-bottom:2px;}

.topTit { position:relative; margin:0 auto; width:100;}
.topTit p { position:relative; margin:0; padding:0; width:100; color:#252525; text-align:center; line-height:1.8;}
.topTit p:first-child { font-size:26px; margin-top:20px;}
.topTit p:last-child { font-size:15px; margin-bottom:10px;}


.vodSkin { position:relative; width:100%; margin:0 auto; padding:0; font-size:0; line-height:normal; font-family:"Noto Sans Korean Regular", "Noto Sans Korean Bold" !important; }
.vodSkin .vodPlay { position:relative; width:100%; margin:0 auto; padding:0;}
.vodSkin .vodPlay img { width:100%;}

.moreBtn { position:relative; width:100%; margin:0 auto; border-bottom:1px solid #c2c2c2; font-size:14px; text-align:center;}
.moreBtn span { position:relative; cursor:pointer;}
.moreBtn span.name { font-weight:600; color:#252525;}
.moreBtn span.name:hover { border-bottom:3px solid; }
.moreBtn span.line { margin:22px 32px; font-weight:400; color:#c2c2c2; height:61px; }


.vodCon { position:relative; margin:0 auto; width:100%; font-size:13px; line-height:1.8; color:#666; padding:30px 10px; box-sizing:border-box; border-bottom:1px solid #c2c2c2; margin-bottom: 35px;}
.vodCon p { margin:0; padding:0; width:100%;}
.vodCon p:nth-child(1) { font-size:22px; font-weight:bold; color:#252525;}
.vodCon p:nth-child(2) { font-size:13px; font-weight:400; color:#252525; margin-bottom:30px;}
.vodCon p:nth-child(3) { line-height:1.4;}

.pagging { position:relative; width:100%; margin:30px auto; text-align:center; color:#666; height:30px; clear:both;}
.pagging a { position:relative; padding:5px 10px; margin:0 1px; color:#666; border:1px solid #d2d2d2; height:30px; background-color:#fff; text-decoration:none;}
.pagging a:hover { background-color:#e2e2e2; font-weight:600;}

.openBox { position:absolute; width:100%; text-align:center; bottom:-23px; z-index:99; font-size:13px; }
.openBox span { position:relative; margin:0 auto; padding: 2px 5px; border-top:0; background-color: #666; color: #fff;}	
.openBox a { text-decoration:none; color:#c2c2c2;}
.closeBox { position:absolute; width:100%; text-align:center; bottom:-23px; z-index:99; font-size:13px; }
.closeBox span { position:relative; margin:0 auto; padding: 2px 5px; border-top:0; background-color: #666; color: #fff;}
.closeBox a { text-decoration:none; color:#c2c2c2;}

.cmtBox { position:relative; width:100%; margin:50px auto; border:1px solid #c2c2c2; box-sizing:border-box; padding:25px; }
.cmtTop { position:relative; width:100%; margin:10px auto; font-size:14px; color:#666; border-bottom:1px dashed #c2c2c2;}
.cmtTop p { position:relative; margin:0; padding:0; font-size:14px;}
.cmtTop .btnBox { position:absolute; top:0; right:0;}
.cmtTop .btnBox span { border:1px solid #c2c2c2; margin:0 2px; padding:5px 10px; box-sizing:border-box; color:#c2c2c2; cursor:pointer;}
.cmtTop .btnBox span:hover { color:#666; border:1px solid #666;}
.cmtTop .cmt { position:relative; width:100%; box-sizing:border-box; padding:10px 0;  margin-bottom:10px;}

.cmtTop .reCmt { position:relative; width:100%; box-sizing:border-box;}
.cmtTop .reCmt p:nth-child(1) { position:relative; margin:0; font-size:14px; }
.cmtTop .reCmt p { padding-left:20px;}
.cmtCon { position:relative; width:100%; margin:0; padding:0;}
.cmtCon #cmtName { position:relative; width:150px; padding:5px; border:1px solid #c2c2c2;}
.cmtCon .cmtTxt { position:relative; width:100%; margin-top:5px;}
.cmtCon .cmtTxt textarea { position:relative; width:90%; border:1px solid #c2c2c2; height:100px; box-sizing:border-box; margin:0; padding:5px; line-height:1.6; color:#666; font-size:14px;}
.cmtCon .cmtTxt .cmtBtn { position:relative; width:10%; height:100px; box-sizing:border-box; display:inline-block; color:#fff; margin:0; padding:0; line-height:7.0; font-size:14px; vertical-align:top; text-align:center;}
.cmtCon .cmtTxt input[type=button] { position:relative; width:10%; height:100px; box-sizing:border-box; display:inline-block; color:#fff; margin:0; padding:0; line-height:7.0; font-size:14px; vertical-align:top; text-align:center;}


@media screen and (min-width:600px){
	
.hiddenBox01 { position:absolute; width:250px; top:17px; left:-100%; border:1px solid #c2c2c2; background-color:#fff; z-index:5; box-sizing:border-box; font-size:0; text-align:left; padding:10px; }
.hiddenBox01 > p { font-size:12px; color:#666; text-align:left;  text-indent:0; margin:0; padding-bottom:5px; line-height:1.4; font-weight:400;}
.hiddenBox01 > p:last-child { padding-bottom: 0;}
.hiddenBox01 > p:hover { text-decoration:underline;}
.hiddenBox01 > p a { color:#8c8c8c; text-decoration:none;}
.hiddenBox01 > p a:hover { text-decoration:underline;}

.hiddenBox02 { position:absolute; width:303px; top:17px; right:-100%; border:1px solid #c2c2c2; background-color:#fff; z-index:5; box-sizing:border-box; font-size:0; text-align:left; padding:10px; }
.hiddenBox02 img { margin:0 3px;}

.vodList_m { display:none;}
.vodList { position:relative; margin:0 auto; width:100%;}
.vodList .listTop { font-size:13px; line-height:1.8; color:#666;}
.vodList .listTop p:nth-child(1) { padding-top:15px; font-size:12px; color:#888; text-align: right;}
.vodList .listTop p:nth-child(1) select,input { line-height:1.6; vertical-align: top; padding:0; margin:0; border:1px solid #c2c2c2; font-size:12px; color:#888; box-sizing:border-box;}
.vodList .listTop p:nth-child(1) select { height:32px; width:85px;}
.vodList .listTop p:nth-child(1) input { width:195px; height:32px; padding: 0 5px;}
.vodList .listTop p:nth-child(1) span { padding: 0 30px; height: 32px; box-sizing:border-box; line-height: 32px; color:#fff; font-size:13px; cursor:pointer; vertical-align: top; display: inline-block;}

.cateStyle02 { position:relative; width:100%; font-size:14px; border-top:1px solid #d2d2d2; border-bottom:1px solid #d2d2d2; line-height:1.6; box-sizing:border-box; padding-top:5px; padding-bottom: 5px; margin: 5px 0 0 0;}
.cateStyle02 .cateTit { font-family: Verdana !important; font-size:11px; font-weight:600; margin-right:15px;}
.cateStyle02 a { color:#666; font-weight:400;}
.cateStyle02 a:hover { color:#666; font-weight:600; text-decoration:underline;}
.cateStyle02 .selectClick { color:#666; font-weight:600;}
.cateStyle02 .CateLine { margin:0 10px;}

.listTable { position:relative; width:100%; font-size:0; color:#666; line-height:none; padding:0; margin: 15px 0 0 0;}
.listTable > div { position:relative; width:100%; padding:0; margin:0; display:table;}
.listTable > div:nth-child(1) { color:#fff; height:40px;}
.listTable > div:nth-child(1) .subject { text-align:center;}
.listTable>  div > p { position:relative; height:40px; font-size:14px; text-align:center; vertical-align:middle; display:table-cell; box-sizing:border-box; padding:auto 10px; border-bottom:1px solid #d2d2d2;}
.listTable > div .number { width:8%;}
.listTable > div .notice { width:8%; font-weight:600; color:#333;}
.listTable > div .thumbnail { width:16%;}
.listTable > div .thumbnail>img { float:none; vertical-align: middle; width:100px; height:65px; margin:10px 0;}
.listTable > div .subject { text-align:left; }
.listTable > div .subject a { text-decoration:none; color:#666;}
.listTable > div .subject a:hover { text-decoration:underline; color:#666;}
.listTable > div .contect { width:17%;}
.listTable > div .person { width:15%;}
.listTable > div .date { width:10%;}
.listTable > div .views { width:8%;}

.pagging { font-size:13px;}
.pagging a { font-size:13px;}

}

@media screen and (max-width:600px){
	.topTit p {  line-height:2.0;}
	.topTit p:first-child { font-size:29px; margin-top:30px; line-height:1.2;}
	.topTit p:last-child { font-size:14px; margin-bottom:30px;}
	
	.moreBtn { position:relative; width:100%; margin:0 auto; height:61px; border-bottom:1px solid #c2c2c2; font-size:14px; text-align:center;}
	.moreBtn span { position:relative; cursor:pointer;}
	.moreBtn span:nth-child(odd) { font-weight:600; color:#252525;}
	.moreBtn span:nth-child(odd):hover { border-bottom:3px solid;}
	.moreBtn span:nth-child(even) { margin:22px 15px; font-weight:400; color:#c2c2c2; height:61px; }
	
	.hiddenBox01 { position:absolute; width:250px; top:17px; right:-100%; border:1px solid #c2c2c2; background-color:#fff; z-index:5; box-sizing:border-box; font-size:0; text-align:left; padding:10px; }
	.hiddenBox01 > p { font-size:12px; color:#666; text-align:left;  text-indent:0; margin:0; padding-bottom:5px; line-height:1.4; font-weight:400;}
	.hiddenBox01 > p:last-child { padding-bottom: 0;}
	.hiddenBox01 > p a { color:#8c8c8c; text-decoration:none;}
	.hiddenBox01 > p a:hover { text-decoration:underline;}
	
	.hiddenBox02 { position:absolute; width:303px; top:17px; right:0; border:1px solid #c2c2c2; background-color:#fff; z-index:5; box-sizing:border-box; font-size:0; text-align:left; padding:10px; }
	.hiddenBox02 img { margin:0 3px; z-index:10;}
	
	.vodList { position:relative; margin:50px auto 0 auto; width:100%;}
	
	.listTop { position:relative; height:50px; font-size:13px; line-height:1.8; color:#666;}
	.listTop p:nth-child(1) { display:none;}
	.listTop p:nth-child(1) { float:right;}
	.listTop p:nth-child(1) select,input { line-height:1.6; vertical-align: middle; padding:0; margin:0; border:1px solid #c2c2c2; font-size:12px; color:#888;}
	.listTop p:nth-child(1) select { float: none; margin-bottom:2px; height:32px; width:65px; margin-right:2px;}
	.listTop p:nth-child(1) input { width:100px; height:32px; box-sizing:border-box; padding: 0 5px;}
	.listTop p:nth-child(1) span { padding:10px 15px; color:#fff; height:32px; margin-left:2px; font-size:13px; cursor:pointer;}
	
	.listTable { position:relative; width:100%; font-size:14px; color:#666; line-height:1.6; margin:0; padding:0; border-top:3px solid;}
	.listTable>div { position:relative; padding: 10px 0; border-bottom: 1px solid #d2d2d2; box-sizing:border-box; }
	.listTable>div>p { position:relative; font-size:14px; text-align:left; box-sizing:border-box; margin:0; padding:0 15px; line-height:1.6;}
	.listTable>div:nth-child(1) { display:none;}
	.listTable .nowView { background-color: #f1f4f8;}
	.listTable>div .number { display:none;}
	.listTable>div .notice { display:none;}
	.listTable>div .thumbnail { display:none;}
	.listTable>div>.subject { width:100%; font-size:18px; color:#252525; margin:0; box-sizing:border-box; padding:auto 10px; margin:0; padding:0 15px; clear: both;}
	.listTable>div>.subject a { text-decoration:none; font-size:18px; color:#252525; }
	.listTable>div>.contect { display:inline-table; padding-right:10px; background:url(../images/bar.png) right center no-repeat;}
	.listTable>div>.person { display:inline-table; padding-left:5px;}
	.listTable>div>date {}
	.listTable>div>.views { display:none;}
	
	.pagging { font-size:12px;}
	.pagging a { font-size:12px;}
	
}