@charset "utf-8";
    /* Layout */
    .content{background:url(../img/image/header/header_bg.png) center 0 repeat-y; width:auto; height:auto;}
    .wrap{background:url(../img/image/layout/wrap_bg.gif) center 0 repeat-y; margin: 0 auto; padding:0; width:1024px; z-index:1;} 
    .footer{background-color:#1a1d23;width:auto; height:80px; overflow:hidden;  }

    /* Header  상단 네비영역 */
    .header{    
                position: fixed;
                top:0;left:0;
                z-index:100;
                background-color:#1a1d23; 
                opacity:1;
                height:70px; 
                width:100%;
            }
        /* navi 전체 바 위치 */    
        .header ul{
            position:relative;
            width:620px;
            height:70px;
            margin:0 auto;
        }
            /* navi 각각의 요소 li 위치 */
            .header .gnb li{
                float:left;
                margin-right:50px;
                width:auto;
                height:auto;
                margin-top:25px;
                padding-top:0;
                padding-bottom:0;
            }
            /* logo 위치 */
            .header .logo-title{
                position: absolute; 
                top:-2px;
                left:38px;
                padding-top:25px;
                padding-bottom:25px;
                margin-right:5px;
                margin-left: 0px;
            }
            .logo-title a.logo-top>img{
                width:20px;
                height:20px;
                margin-right:5px;
            }
            .logo-title a.logo-top{
                color: #8ab7a5;
            }
            .header .logo-title:hover{
                color:#af9fb9;
            }

    /* 상단 1번째 영역: bird 애니메이션 */
    .content .bird_top .h1bird {display:none;}

    .content #bird {
            width:auto; 
            height:3115px;
            margin:auto; 
            background:url(../img/image/header/header_img.png) center 0 no-repeat;
        }


    /* cloud 구름 애니메이션 영역*/
    #cloud li{ 
            height:auto; 
            width:auto; 
            margin:0; 
            padding:0;
        }

        #cloud li .cloud1 {background:url(../img/image/header/cloud.png) no-repeat; opacity:0.9; width:700px; margin:450px 0 0 300px; padding:0; height:500px; text-indent:-9999px;}
        #cloud li .cloud2 {background:url(../img/image/header/cloud.png) no-repeat; opacity:0.9; width: 700px; margin:900px 0 0 50px; padding:0; height:500px; text-indent:-9999px;}
        #cloud li .cloud3 {background:url(../img/image/header/cloud.png) no-repeat; opacity:0.9; width: 700px; margin:1600px 0 0 50px; padding:0; height:500px; text-indent:-9999px;}
        
        #cloud li .cloud4 {background:url(../img/image/header/cloudwithperson.png) no-repeat; opacity:0.98; width:710px; margin:2574px 0 0 0px; padding:0; height: 426px; text-indent:-9999px;}  



    /* Work */
    .work_bgcolor{
            margin:0;padding:0; 
            position:relative;
            height:800px;
            }
        .work h1{
            margin:0 0 50px 0;  display:block; 
            background-color:black;
            padding:0px;
        }
        .work .apps{
            margin:5px 0 0 13px; 
            height:251px;
            width:856px;
        }
        .work .apps li{display:inline}

    /* Work Naming */
    
    .work p.work_naming span.list01 { position:absolute; top:0px; left:30px; z-index:5;}
    .work .apps li a{
            display:inline; 
            float:left; 
            height:707px; 
            margin:0; 
            text-indent:-9999px; 
            width:1000px;
        }
    #main_bn2 {
        margin:0;
        padding:0;
        width:450px;
        height:300px;
        position:relative;
    }
    #main_bn2 img {
        width:100%;
        height:auto;
    }
    #main_bn2 .desc2 {
        margin:90px 0 20px 80px;
        padding: 30px;
        width:800px;
        height:200px;
        background-color:#332A32;
        opacity:0.8;
        }
    #main_bn_btn2 {
        list-style-type:none;
        position:absolute;
        bottom:180px; 
        left:446px;
        background-color:black;
        border-radius:15px; 
        opacity:0.3;
    }
    #main_bn_btn2 li {
        float: left; 
        padding:10px 10px; 
        margin-bottom:3px; 
    }

    #main_bn_btn2 a:hover {background:url(../img/blt2.png) no-repeat;}
    
    .fb-share-button { position:absolute; top:30px;}


    /* Info */
    .info {margin:0; padding:0; background-color:#7d6e7a;  position:relative;  height:640px; }    
    .info h1 {margin:0; padding:0; text-indent:-9999px;  } 
    .info .player{
            margin:5px 0 10px 180px; 
            padding:0px; 
            width: 600px; 
            height:480px;
            opacity:0.8;
        }
    .info .logo a{height:70px; 
                  position:absolute; top:30px; right:60px; text-indent:-9999px; width:102px; z-index:20;}

    #main_bn {
        margin:0 auto;
        width:450px;
        height:500px;
    }
    #main_bn img {
        width:100%;
        height:auto;
    }  
    #main_bn_btn {
        list-style-type:none;
        position:absolute;
        bottom:50px; 
        left:346px;
        background-color:black;
        border-radius:15px; 
        opacity:0.3;
    }
    #main_bn_btn li {
        float: left; 
        padding:10px 10px; 
        margin-bottom:3px;
    }

    /* History */
    .GUI{
            background:url(../img/image/history/history_bg_lines-01-01-01.png) no-repeat; 
        }

    .GUI{
            position:relative;
            width:100%;
            background-color:#332A32;
            padding:0 0 70px 0;
        }

    .history .nav2{
            position:relative; 
            margin:0; padding:0;
        }

    .history .pagination {
            display: block; position:relative; 
            top:500px; left: 323px; 
            height:40px;   
            background-color:white; 
            width:150px; 
            border-radius:30px; 
            opacity: 0.7;
        }

    .history .pagination a{
            background:url(../img/image/recent_news/recent_news_list_pagination2.png) right 0 no-repeat; 
            float:left;
            height:10px; 
            margin:0 0 0 20px;
            display:block; 
            width:10px;
            text-indent:-9999px; 
            position:relative; 
            top:15px; 
            left:25px;
        }
    .history .pagination a:hover, .recent_news .pagination a.on{
            background-position:left 0;
            }

    .history .history_inner .history_size1{
            display:block; 
            height:105px; 
            position:absolute; 
            top:45px; 
            left:-100px; 
            width:163px; z-index:10;
            background:url(../img/image/location/location_cloud_left.png)no-repeat; 
        }
    .history .history_inner .history_size2{
            display:block; 
            height:105px; 
            position:absolute; 
            top:445px; 
            right:-50px; 
            width:163px; 
            z-index:10;
            background:url(../img/image/location/location_cloud_left.png)no-repeat; 
        }

    /* Member */
    .member {position:relative; width:1024px; background-color:#332A32; }              
    .member h1 {margin:0 0 50px 0; padding:0;background-color:black; } 
    .member .name .name01 { display:inline; position:absolute; top:190px; left:220px;}
    .member .name .name02 { display:inline; position:absolute; top:190px; left:352px;}
    .member .name .name03 { display:inline; position:absolute; top:190px; left:454px;}
    .member .name .name04 { display:inline; position:absolute; top:190px; left:578px;}
    .member .name .name05 { display:inline; position:absolute; top:190px; left:698px;}    
    .member .member2 { position:relative; margin:0px 0 0 130px;   width:746px; height:260px; }
    .member .member2 .list01 {display:block; position:absolute; top:55px;  left:88px;  width:100px;  text-align:center; text-indent:-9999px;}
    .member .member2 .list02 {display:block; position:absolute; top:55px;  left:214px; width:100px;  text-align:center; text-indent:-9999px;}
    .member .member2 .list03 {display:block; position:absolute; top:55px;  left:328px; width:100px;  text-align:center; text-indent:-9999px;}
    .member .member2 .list04 {display:block; position:absolute; top:55px;  left:448px; width:100px;  text-align:center; text-indent:-9999px;}
    .member .member2 .list05 {display:block; position:absolute; top:55px;  left:568px; width:100px;  text-align:center; text-indent:-9999px;}
    .member .member2 a { float:right; }
    .member .member2 .list01 a { background:url(../img/image/member/member_list_01.png) no-repeat; height:110px;  width:111px;}
    .member .member2 .list02 a { background:url(../img/image/member/member_list_02.png) no-repeat; height:110px;  width:111px;}
    .member .member2 .list03 a { background:url(../img/image/member/member_list_03.png) no-repeat; height:110px;  width:111px;}
    .member .member2 .list04 a { background:url(../img/image/member/member_list_04.png) no-repeat; height:110px;  width:111px;}
    .member .member2 .list05 a { background:url(../img/image/member/member_list_05.png) no-repeat; height:110px;  width:111px;}

    /* ETC  소셜 부분 */
    .etc {background-color:#332A32;}
    .etc h1 {margin:0 0 50px 0px;}
    .etc .etc_background{ 
        height:466px; 
        margin:0 0 0 30px;
        position:relative;
        width:956px; 
        position:relative;
    }
    .etc .etc_inner {
        height:300px; 
        margin:5px 0 0 0px;
        padding: 0 0 0 0;
        position:relative;
        width:956px;  
        background-color:#1b111a;
        opacity:0.7; 
        border-radius:1px;
        width:100% 
    }
    .fb-follow {position:absolute;top:110px;left:890px;}

    .fb-send {position:absolute;top:110px;left:770px;}
    
    @media only screen and (min-device-width : 320px) and (max-device-width:480px) 
        {
            .widget{ 
                display:none;
            }
        }

    @media only screen and ( min-device-width : 720px) and (max-device-width:1280px) 
        {
            .widget{
                display:none;
                }
        }

