/* 
Project : 
Author  : 
Date    :
*/

/* Common */
*{
	-webkit-box-sizing:border-box;
       -moz-box-sizing:border-box;
            box-sizing:border-box;
}
html, body {
	font-family: '돋움', Dotum, sans-serif;font-size:12px;-webkit-font-smoothing: antialiased;background: #fff;line-height:1; color:#030303;
}
img{border:0;margin:0;padding:0;}
a{margin:0;padding:0;}
a[name]{height:0;}

.fleft{float:left;}
.fright{float:right;}
.alternative{z-index: -1;width: 0;height: 0;overflow: hidden;visibility: hidden;}
.txtleft{text-align:left !important;}
.txtcenter{text-align:center !important;}
.txtright{text-align:right !important;}
.txtbold{font-weight:bold !important;}
.prelative{position:relative;}
.pabsolute{position:absolute !important;}
.line_height{ line-height:0px;}
.verttop{ vertical-align:top;}
.vertbottom{ vertical-align:bottom;}
ul, li{ margin:0;}
li img { vertical-align:middle; }
.maright{ margin-right:20px;}
.maleft{ margin-left:20px !important;}
.maleft5{ margin-left:5px;}
.maleft10{ margin-left:10px;}
.maleft14{ margin-left:14px;}
.total{ background-color:#f2f2f2; }
.matop{ margin-top:40px;}
.matop10{ margin-top:10px;}
.matop70{ margin-top:70px;}
.matoplf{ margin-top:14px;}
.matoplf25{ margin-top:25px;}
.fontcolorw{ color:#FFF;}
.fontcolorr{ color:#ec200c;}
.paddtop20{ padding-top:20px;}
img{max-width:100%;}
.fontfno{font-family: 'NotoSans';}


/* Layout */
.container{position:relative;width:1170px;margin:0 auto; text-align:center; }
.container-fluid{position:relative;width:100%;margin:0 auto;  text-align:center;}
.bgtotal{ background: url(../images/bgtotal.png);}

/* Header */
/*.top{ background-color:#e01d19  rgba(224,29,25,.78); height:85px; }*/
.show_m{ display:none;}
/*.top{ position:fixed; height:60px; z-index: 99998; }*/

.Header{ background: url(../images/bg.png)  50%; background-position:center;   background-repeat:no-repeat; height:100%;  padding:100px 0;  }	
	.Header .logo{ position:absolute; left:22px; top: -3px;}
	.Header .tit{  text-align: center; }

.vodcontainer { position:relative; width:897px;  background: #855e38; border-radius: 25px;  margin:0px auto; overflow:hidden; margin-top:50px; margin-bottom:2%;}	     
	    .vodcon{ width:715px; overflow:hidden; float:left;}
		.vendor { padding: 40px 0px 20px 40px; padding-bottom:0; height:588px;  border-radius: 30px;  position:relative; }	
		.mov01_2{ max-height:100%; top:0; left:0; background:#fff;}
		.movtit{ position: absolute; top:0px; background-color:#000; opacity:0.5; z-index:998; padding:10px; width:100%; color:#fff; text-align:left; }
		.fluid-width-video-wrapper{  position:relative; padding:0; height:507px; overflow:hidden; background-color:#fff; vertical-align:middle;  }	    
		.fluid-width-video-wrapper .spritespin{margin:50px auto 0;}
        .fluid-width-video-wrapper .movtit{ position: absolute; top:0px; background-color:#000; opacity:0.5; z-index:998; padding:10px; width:100%; color:#fff; text-align:left; }
        /*.fluid-width-video-wrapper iframe, .fluid-width-video-wrapper object, .fluid-width-video-wrapper embed{ position:absolute; top:0; left:0; width:100%; height:100%; }*/
        iframe, embed, object{ max-width:100%; height:65%;}
         video { max-width: 100%; height: auto;}  
        iframe, embed, object { max-width: 100%; } 
		.top360{ position:absolute; top:55px; right:23px; z-index:99999;}
		.toptext{ position:absolute; bottom:20px; right:200px; z-index:99999;}
  
	.btn{ margin-top:40px; margin-right:1px;  }
	   .btn li{ margin:10px 0;}
	   .btn li a{ display:inline-block; width:114px; height:114px; overflow:hidden; }
	   .btn li a img{ position:relative; top:0; left:0;}
	   .btn li a.active img { position:relative; top:-126px; left:0;}	   
	   
	.content{background-color:#468a35;}

.date{background-color:#5ba649; padding:80px 0; }
	.date .datacon{margin-top:30px;}
	.date .datacon .datarea{}	
	.date .datacon ul li{position:relative;float:left; margin-left:15px; background:#fff; width:281px;}
	.date .datacon ul li .as{margin-top:15px;}
	.date .datacon ul li .play{position:absolute; top:100px; left:120px;}
	.date .datacon ul li h2{margin:27px 0  15px;}
	.date .datacon ul li:first-child{ margin-left:0px; }
	.date .datacon ul li .btnicon{height:55px; background-color:#f0f0f0; text-align:center; margin:0 auto;  margin-top:35px; width:281px; padding-top:8px; }
	.date .datacon ul li .btnicon>ul{ display:inline-block; } 
	.date .datacon ul li .btnicon>ul>li{float:left; width:38px; height:37px; margin-left:5px;  background:none; }
	.date .datacon ul li .btnicon>ul>li:first-child{margin-left:0;}
	.date .datacon ul li .btnicon>ul>li a{width:38px; height:37px; overflow:hidden;  background: url('../images/btnicon.png') no-repeat; text-align:center; display:block; }
	.date .datacon ul li .btnicon>ul>li a.icon01{ background-position:0px 0px;}
	.date .datacon ul li .btnicon>ul>li a.icon02{ background-position:-47px 0px;}
	.date .datacon ul li .btnicon>ul>li a.icon03{ background-position:-94px 0px;}
	.date .datacon ul li .btnicon>ul>li a.icon04{ background-position:-141px 0px;}
	.date .datacon ul li .btnicon>ul>li a.icon05{ background-position:-141px 0px;}
	
	.date .datacon ul li .btnicon>ul>li a.icon01:hover{ background-position:0px -47px;}
	.date .datacon ul li .btnicon>ul>li a.icon02:hover{ background-position:-47px -47px;}
	.date .datacon ul li .btnicon>ul>li a.icon03:hover{ background-position:-94px -47px;}
	.date .datacon ul li .btnicon>ul>li a.icon04:hover{ background-position:-141px -47px;}
	.date .datacon ul li .btnicon>ul>li a.icon05:hover{ background-position:-141px -47px;}

	
.footer{background:#565657; line-height:60px;}