﻿body{

    min-width:320px;
}
.wrapper{
    width:100%;
    height:calc(100% - 150px);
    padding: 4%;
    min-width:320px;
    /*padding-bottom:20%;*/
    box-sizing:border-box;
}

.loginWrap{
    width:100%;

}

.info {
    margin-bottom:14px;
}

.info input[type=text],.info input[type=password]{
    border: 1px solid #c1c1c1;
    padding:7px 10px;
    width:100%;
    height:40px;
    color:#676767;
}


.ipwrap:after{
    content:'';
    display:block;
    clear:both;
}

.ipwrap >input[type=tel] {
    width:65%;
    float:left;
        border: 1px solid #c1c1c1;
    padding:7px 10px;
    height:40px;
    color:#676767;
}
.ipwrap >input[type=button]{
 height:40px;
 border: none;
 width:32%;
 float:right;
}

.newbtn a{
    width:48%;
    display:inline-block;
    border:  1px solid #2693D6;
    height:40px;

}

.newbtn:after{
content:'';
display:block;
clear:both;
}

.newbtn a:nth-of-type(1){
    float:left;
}
.newbtn a:nth-of-type(2){
    float:right;
}

.login_logo{
margin-bottom:10px;
text-align:center;
height:140px;
/*background: #FC5C7D;
background: -webkit-linear-gradient(90deg,#9665f4 , #ef2f9f);
background: linear-gradient(90deg,#9665f4 , #ef2f9f);*/
    background: url(/common/image/masterpage/bg.png) no-repeat;
    background-size:cover;

}

.login_logo img{
   
    position:relative;
    top:50px;
}


.joinWrap{
    margin-top:40px;
}

.joinWrap p{
    margin-bottom:10px;
    text-align:center;
    border-top:1px solid #c9c9c9;
    padding-top:30px;
}

.newbtn a{
    border:none;
    color:#222;
    font-weight:500;
    text-align:center;
    vertical-align:middle;
   line-height:37px;
   border: 1px solid  #2693D6;
   color:#2693D6;

}

.butbtn{
    margin-top:34px;
}

.resultbtn{
width:100%;
height:40px;
background:#888;
display:block;
margin-top:30px;
color:#FFF;
font-weight:500;
text-align:center;
   line-height:37px;

}

.loginTxt{
    font-size:1.5em;
    margin-bottom:20px;
   font-weight:700;
   color:#444; 
}











/* #region 개통가이드 보기 */
.smog{
    display:none;
    width:100%;
    height:100vh;
    position:fixed;
    top:0;
    left:0;
    background:rgba(0,0,0,0.5);
    z-index:1000;
}
.guide_modal{
    width:480px;
    position:fixed;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    z-index:1001;
    background:#fff;
    border-radius:10px;
    display:none;
    visibility:hidden;
}
.guide_modal .swiper-container{
    width:100%;
    height:auto;
    width: 100%;
    height: auto;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;

}
.swiper-slide img{
    width:100%;
    display:block;
}
.mo_modal_btn{
    width:100%;
    height:60px;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    border-top:1px solid #eee;
}
/* 페이지네이션 */
.guide_modal_pagination{
    position: absolute;
    left: 50%;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    width: 100%;
    text-align: center;
}
.guide_modal_pagination .swiper-pagination-bullet{
    width: 7px;
    height: 7px;
    margin: 0 3px;
    background:#dcdcdc;
    opacity:1;
    transition:all .25s;
}
.guide_modal_pagination .swiper-pagination-bullet-active{
    background: var(--main_c);
    /*width:32px;*/
    border-radius:20px;
}

/* 닫기 버튼 */
.guide_modal_close{
    width: 100%;
    height: 50px;
    background: #fff;
    border: none;
    border-top: 1px solid #eee;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    display: block;
    color: #444;
    border-radius: 10px;
}

/*@media(max-width:520px){
    .guide_modal{
        width:100%;
        height:auto;
        left:0;
        bottom:0;
        top:auto;
        transform:none;
        border-radius:20px 20px 0 0;
    }
}*/
 @media(max-width:580px){
    .guide_modal{
        width:92%;
        height:auto;
    }
}
 

/* #endregion */

