/*세훈이의 기본세팅*/

.position {
    position: relative;
    width: 100px;
    height: 0px;
    margin: 0 auto
}

.img_style {
    position: relative;
    left: 50%;
    margin-left: -1000px;
    width: 2000px;
}

.img_style img {
    pointer-events: none;
}

@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

/*세훈이의 기본세팅*/




#idx {

}


#idx .gnb {
    position: fixed;
    top: 0;
    z-index: 20;
    width: 100%;
    color: white;
    transition: all 0.5s;
}




#idx .gnb:hover {
    color: black;
}

#idx .on {
    color: black;
}

#idx .on .gnb_inner .stay .logo_white {
    display: none;
}

#idx .on .gnb_inner .stay .logo_color {
    display: block!important;
}

#idx .gnb .gnb_inner {
    position: relative;
    width: 1400px;
    margin: 0 auto;
}

#idx .gnb .gnb_inner .loginout {
    width: 100%;
    height: 30px;
    position: relative;
    top: 20px;
}

#idx .gnb .gnb_inner .loginout li {
    float: right;
    margin: 0 10px;
    font-size: 14px;
}

#idx .gnb .gnb_inner .stay li {
    float: left;
    font-size: 16px;
    line-height: 80px;
    margin: 0 23px;
}

#idx .gnb .gnb_inner .stay .logo_color {
    display: none;
}

#idx .gnb:hover .gnb_inner .stay .logo_color {
    display: block;
}

#idx .gnb:hover .gnb_inner .stay .logo_white {
    display: none;
}

#idx .gnb .gnb_inner .hide {
    height: 0px;
    background: white;
    color: black;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: -1;
    overflow: hidden;
    transition: all 0.5s;
}

#idx .gnb:hover .gnb_inner .hide {
    height: 400px;
}

#idx .gnb .gnb_inner .hide .center {
    width: 1400px;
    margin: 0 auto;
}

#idx .gnb .gnb_inner .hide .gnb_bg {
    position: absolute;
    top: 109px;
    right: -44px;
    opacity: 0.8;
}

#idx .gnb .gnb_inner .hide .center .line {
    width: 100%;
    border-bottom: 1px black solid;
    position: relative;
    top: 120px;
}

#idx .gnb .gnb_inner .hide .hide_inner {
    float: left;
    font-size: 14px;
    position: relative;
    top: 150px;
    margin: 0 23px;
}
#idx .gnb .gnb_inner .hide .hide_inner ul li{
    line-height: 30px;
    cursor: pointer;
}


#idx .idx_rolling .common {
    position: relative;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}

#idx .idx_rolling .d_1 .position img {
    position: absolute;
    z-index: 30;
    top: 170px;
    left: -302px;

}

#idx .idx_rolling .d_2 {
    background: white;
}




#idx .idx_rolling .d_3 {
    background: white;
}

.btu_box{width:450px; padding:10px 15px;  margin-top:1.5vh; color:white; font-size: 1.5em; border-radius: 5px; transform: translate(0,0px); box-shadow: 0px 5px 10px rgb(0 0 0 /0.0); transition: all 0.5s;}
.btu_box:hover h2 img{transform: rotate(90deg); transition: all 0.3s;}
.btu_box:hover {box-shadow: 3px 3px 10px rgb(0 0 0 / 0%); transform: translate(0,-5px); box-shadow: 0px 10px 10px rgb(0 0 0 /0.3); transition: all 0.5s;}
.btu1 {background:#135bab }
.btu2 {background:#124b8b }
.btu_box h1 {display: block; float: left;}
.btu_box h2 {float:right;}
.btu_box h2 img {transform: rotate(0deg); transition: all 0.3s;}

#idx .gnb .gnb_inner .hide .hide_inner ul li:hover {font-weight: 900; color:#135bab;}





    #aside {position: absolute; top: 0; left: 0;background: white; z-index: 99; width: 100px; height: 1000px; text-align: center}
    #aside .logo {margin-top: 50px;}
    #aside .line {width: 1px; height: 100px; background: black; margin: 50px auto 0;}
    #aside .hover .a_menu .common {margin-top: 50px; cursor: pointer;}
    #aside .hover .a_all {width: 0px; position: absolute; left: 100px; top: 0; z-index: 99; height: 1000px; overflow: hidden; transition: all 0.3s; background: url("/img/main/a_bg.png") center no-repeat;}
    #aside .hover:hover .a_all {width: 300px;}

    #aside .hover .a_all .list {text-align: left; white-space: nowrap; margin: 287px 0 0 50px}
    #aside .hover .a_all .list ul li {font-size: 18px; color: #2d2d2d; margin-top: 20px; cursor: pointer; letter-spacing: -1px;}
    #aside .hover .a_all .list ul li:hover {color: #1559a5}
    #aside .hover .a_all .list ul {margin-top: 40px;}


    #idx {width: 100%; overflow: hidden;}
    #idx .d_1 {height: 1000px; overflow: hidden;}
    #idx .d_1 .video {position: relative; left: 50%; margin-left: -1000px; width: 2000px;background: black}
    #idx .d_1 .video video {opacity: 0.6}
    #idx .d_1 .text {width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; position: absolute; z-index: 99; pointer-events: none;}

    #idx .d_2 {}
    #idx .d_2 .inner {position: relative; width: 1200px; margin: 0 auto; display: flex; top: -100px;}
    #idx .d_2 .inner .con {width: 600px; border: 1px solid #dddddd; height: 1002px;}
    #idx .d_2 .inner .con ul {display: flex;}
    #idx .d_2 .inner .con ul li {width: 299px; height: 200px; border-right: 1px solid #dddddd; border-bottom: 1px solid #dddddd; cursor: pointer; background: #f6f6f6; transition: all 0.3s;}
    #idx .d_2 .inner .con ul li img {margin: 38px 0 0 30px; transition: all 0.3s;}
    #idx .d_2 .inner .con ul li:hover img {transform: scale(1.02)}
    #idx .d_2 .inner .con ul li:hover {background: #e5f1ff}
    #idx .d_2 .inner .con ul li:last-child {border-right: 0px solid #dddddd;}
    #idx .d_2 .inner .con ul:last-child li {border-bottom: 0px solid #dddddd;}
    #idx .d_2 .inner .box .news .db_news {height: 50px;}
    #idx .d_2 .inner .box .box_inner .more {position: absolute; top: 390px; left: 70px; z-index: 999; transition: all 0.5s;}
    #idx .d_2 .inner .box .box_inner {position: relative; cursor: pointer}
    #idx .d_2 .inner .box .box_inner:hover .more {transform: rotate(90deg)}

    #idx .d_3 {position: relative; width: 2000px; margin-left: -1000px; left: 50%;}
    #idx .d_4 {position: relative; width: 2000px; margin-left: -1000px; left: 50%;}
    #idx .d_4 .button-pr {position: absolute; top:510px; left: 250px; z-index: 999999; border: none; background: none; outline: none;}
    #idx .d_4 .button-nx {position: absolute; top:510px; right: 250px; z-index: 99999;  border: none; background: none; outline: none;}
