﻿@charset "utf-8";
@font-face {
	font-family:have a great day; src:url('http://dplayer.co.kr/fonts/have a great day.eot');}
@font-face {
	font-family: Century Gothic Bold; src:url('http://dplayer.co.kr/fonts/Century Gothic Bold.eot');}

@font-face {
    font-family: 'Century Gothic';
    src: url('./fonts/century gothic.eot');
    src: url('./fonts/century gothic.eot?#iefix') format('embedded-opentype'), url('./fonts/century gothic.woff') format('woff'), url('./fonts/century gothic.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
	a:link {font-family: Century Gothic; color:black;}
	a:visited {font-family: Century Gothic; color:black; }
	a:hover {font-family: Century Gothic; }
	a:acvite {font-family:  Century Gothic; }
	p,br,body,td,form,div,form,center,option,select,textarea,input {font-family: Century Gothic;}



.contents { 
    margin: auto; 
    max-width: 100%; 

}
.cLayer { 
    margin: 0px;
	padding: 0px;   
}

#logo {
    position:absolute; 
    top:20px; 
    left: 30px; 
    z-index:5;
}

#fixed-menu {
    width: 100%;
	background-color: #000;
	position: fixed;
	top: 0px;
	left: 0px;
    z-index:999;
    height: 85px !important;
}

#fixed-menu li {
    display: inline-block;
    text-align: right;
    list-style: none;
    margin-right: 2%;
	color: #fff;	
    vertical-align:middle;   
}

#fixed-menu li a {
    text-decoration: none;
}

#fixed-menu li a:hover {
	color:#f00;
}

#top_img {
   margin-top: 75px;
}

#layer1, #layer2, #layer3, #layer4 {
  /*text-align: center;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
      -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
  background-size: cover;*/
  background-repeat: no-repeat !important;
  overflow: hidden;
  background-color: #000;
}

#layer1 div img {
    margin-top: 85px;
}

.table_cell {
	display:table-cell;
	vertical-align:middle;
	margin: 0;
	padding: 0;
}
.table_row {
	display: table-row;
	vertical-align:middle;
	margin: 0;
	padding: 0;
    align-content: center;
}

.container_table {
	width: 100%;
	height: 100%;
    display:table;
    margin: 0;
    border: 0px;
}

#footer_menu ul li a:hover {
    color:#f00;
}

/******************************************************/
@media screen and (min-width:1025px) {
 
.cLayer {
    width: 100%;
    min-width: 1024px;
   
}



   .menu_style {
    font-size: 2em;
    list-style-type: none;
    vertical-align: middle;
} 


#layer1 div img {
    margin-top: 42px;
}

#layer1, #layer2, #layer3, #layer4 {
    background-position: bottom !important;
    position: relative;
    background-attachment: fixed !important;  
}

#layer1 {
    background-image : url('./img/main/main-1_4.png');
}
#layer2 {
    background-image : url('./img/about/about-1_4.png');
}
#layer3 {
    background-image : url('./img/service/service-1_4.png');
}
#layer4 {
    background-image : url('./img/player/player-1_4.png');
}
   /* design. wet& application......*/
   .footer_font {
	    font-size: 1.5em;
   }

#footer_menu ul li, 
#footer_menu ul li a {
    display: inline;
    list-style-type: none;
    font-size: 1.25em;
    margin-right: 1%;
}

   .footer_logo_margin {
	margin-top: 2%;
	margin-bottom: 2%;
   }

   .fLayer {
	height: 250px;
   }
 
}

/****************************************************************************/
/* Desktop Device : 1023 �̻� */
@media screen and (min-width:768px) and (max-width:1024px) {
 
.cLayer {
    width: 100%;
    min-width: 1024px;
}
/*
#layer1 {
    max-height:500px;
    padding:0px;
    margin:0px;
}

#layer2, #layer3, #layer4 {
    max-height: 466px;
}
    */



.contents div div img {
    margin:auto;
}

.contents div div img {
    padding: 8%;
}
#layer1 div img {
    margin-top:45px;    
}

#layer2 div img {
    margin-top: 12%;
}

#layer3 div img {
    margin-top: 12%;
}

#layer4 div img {
    margin-top: 12%;
}

#layer1 {
    background-image : url('./img/main/main-1_3.png');
    background-position: center !important;
    margin-top: 75px;
}
#layer2 {
    background-image : url('./img/about/about-1_3.png');
    background-position: center !important;
}

#layer3 {
    background-image : url('./img/service/service-1_3.png');
    background-position: center !important;
}
#layer4 {
    background-image : url('./img/player/player-1_3.png');
    background-position: center !important;
}
   /* design. wet& application......*/
   .footer_font {
	    font-size: 1.5em;
   }

#footer_menu ul li, 
#footer_menu ul li a {
    display: inline;
    list-style-type: none;
    font-size: 1.25em;
    margin-right: 1%;
}

   .footer_logo_margin {
	margin-top: 2%;
	margin-bottom: 2%;
   }

   .fLayer {
	height: 250px;
   }
 
}


/*****************************************************************************/
 
/* Tablet Device : 481 ~ 767 */
@media screen and (min-width:481px) and (max-width: 767px) {

.cLayer {
    width: 100%; 
}
/*
#layer1 {
    max-height:500px;
}

#layer2, #layer3, #layer4 {
    max-height: 420px;
}
    */
#layer1 #layer2 #layer3 #layer4 { 
    position: relative;
}

#layer1 div img {
    margin-top:45px;    
}

#layer2 div img {
    margin-top: 16%;
}

#layer3 div img {
    margin-top: 16%;
}

#layer4 div img {
    margin-top: 16%;
}

#layer1 {
    background-image : url('./img/main/main-1_2.png');
    background-position: center !important;
    margin-top: 85px;
}
#layer2 {
    background-image : url('./img/about/about-1_2.png');
    background-position: center !important;
 }
#layer3 {
    background-image : url('./img/service/service-1_2.png');
    background-position: center !important;
}
#layer4 {
    background-image : url('./img/player/player-1_2.png');
    background-position: center !important;
}

.menu_style {
    font-size: 2em;
    list-style-type: none;
    vertical-align: middle;
} 

   #footer_menu li {
        display: inline-block;
        margin-right: 3;
	    color:black;	
   }

   .footer_font {
	font-size: 1.25em;
   }

#footer_menu ul li, #footer_menu ul li a {
	font-size: 1.25em;
	margin-right: 2%;
   }

   .footer_logo_margin {
	margin-top: 3%;
   }
 
   .fLayer {
	height: 150px;
   }     
}

/*****************************************************************************/
@media screen and (max-width: 480px){

.menu_style {
    font-size: 2em;
    list-style-type: none;
    vertical-align: middle;
} 


/*#layer1 {
    max-height: 300px;
}
#layer2, #layer3, #layer4 {
    max-height: 260px;
}
*/

#fixed-menu {
    height: 65px !important;
}

#layer1 div img {
    margin-top:10%;    
}

#layer2 div img {
    margin-top: 10%;
}

#layer3 div img {
    margin-top:10%;
}

#layer4 div img {
    margin-top: 8%;
}
#layer1 #layer2 #layer3 #layer4 { 
    position: relative;
}

#layer1 {
    background-image : url('/img/main/main-1_1.png');
    background-position: center !important;
    margin-top: 35px;
}
#layer2 {
    background-image : url('/img/about/about-1_1.png');
    background-position: center !important;
}
#layer3 {
    background-image : url('/img/service/service-1_1.png');
    background-position: center !important;
}
#layer4 {
    background-image : url('/img/player/player-1_1.png');
    background-position: center !important;
}

#logo {
    position:absolute; 
    top: 20px;
    left: 15px;
    z-index:5;
    width: 96px;
    height: auto;
}

.footer_logo_margin{
    margin-top: 6%;
    margin-bottom: 4%;
}

#footer_logo a img {
    width: 120px;
}

#top_img {
    top: 65px;
}
/* 푸터 메뉴간 간격*/
div#footer_menu ul li {
    margin-bottom: 6% !important;
}

   .fLayer {
	    height: 185px;
   }
}


