@charset "UTF-8";

.intro_window {
    height: 100vh;
    /* min-height: 900px; */
    background-image: url(/images/login_bg01.png) !important;
    /* background-color: #0d0f13; */
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: 100%;
    overflow-y: auto !important;
    /* overflow-x: scroll; */
    position: relative;
    z-index: 2;
}

.intro01 {
    height: 100%; 
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center; 
}
  
.intro_logo { margin-top: 50px;}

  
.intro_feelbot01 {
    width: 100%;
    margin-top: 90px;
    position: relative;
    display: flex;
    animation: bounce 6.0s alternate infinite;
}
.intro_feelbot01_M {display: none;}
.intro_feelbot01::after {
    content: "";
    width: 30px;
    height: 28px;
    background: url(../images/intro_ic04.png) no-repeat 50% 50% / cover;
    position: absolute;
    top: 85px;
    left: 46%;
    display:none;
    animation: scaleBounce 0.6s alternate infinite;
}
.intro_feelbot01 img{
    z-index: 50;
    width: 70%;
    margin: 0 17%;
}  
@keyframes scaleBounce {
    from {
      transform: scale(0.6);
    }
    to {
      transform: scale(1.2);
    }
}

.intro_Box {
    display: flex;
    flex-direction: column;
}
.intro_Box02 {
display: flex;
justify-content: center;
}

.intro_Box02 > ul {
    align-items: center;
    display: flex;
    flex-direction: row;
    margin-top:40px;
}

.intro_Box02 > ul > li {
display: inline-block;
line-height: 35px;
margin-top: 0px;
}

.intro_Box02 > ul > li:nth-child(2) {
margin-left: 10px;
}
.intro_Box02 > ul > li:nth-child(2) > button {
    width: 90px;
    height: 90px;
    margin:0!important; padding:0!important;
    background-color: rgba(255, 255, 255, 0.00)!important;
}
.intro_Box02 > ul > li:nth-child(2) > button > img {
width: 90px;
height: 90px;
margin:0; padding:0;
opacity: .7;
}
.intro_Box02 > ul > li > .intro_Id {margin-top: -10px;}
.intro_Box02 > ul > li > .intro_Id > input {
background: url(../images/login_id.png) no-repeat;
background-size: 25px;
background-position: left center;
width: 160px;
padding:0px 10px;
height: 40px;
padding-left: 30px;
color: #fff;
font-size: 12px;
border: none;
font-family: 'Noto Sans';
border-radius: 0;
border-bottom:2px solid #5f6367;
}

.intro_Box02 > ul > li > .intro_Password > input {
    background: url(../images/login_pw.png) no-repeat;
    background-size: 25px;
    background-position: left center;
    width: 160px;
    height: 40px;
    padding:0px 10px;
    padding-left: 30px;
    color: #fff;
    font-size: 12px;
    border: none;
    font-family: 'Noto Sans';
    border-radius: 0;
    border-bottom:2px solid #5f6367;
}
.intro_joinICON {
    display: flex; justify-content: center; margin-top: 20px;
}
.intro_Foot {
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    margin-top: auto;
    padding-bottom:50px;
    width: 100%;
}
.intro_txtH3 {margin-top:20px;
    background-color: rgba(255, 255, 255, 0.7)!important;
    color: #1b2f74;
    border-radius: 10px;
    padding: 15px 20px;
}

/* 태블릿 모바일 */
@media only screen and (max-width: 1500px) {
    .intro_feelbot01 {margin-top: 50px;}
    .intro_feelbot01::after { top: 70px; left: 46%;
        width: 25px;
        height: 23px;
    }
    .intro_feelbot01_P {display: none;}
    .intro_feelbot01_M {display: block;}
    .intro_joinICON {
        margin-top: 10px;
    }
    .intro_Box02 > ul > li > .intro_Id > input {width: 120px;}
    .intro_Box02 > ul > li > .intro_Password > input { width: 120px;}
}
@media screen and (max-width: 800px) {
    .intro_feelbot01 img {
        width: 90%;
        margin-left: 8%;
    }
}