
*{
    box-sizing: border-box;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

*::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}
main{
    min-height: calc(100% - 120px);
}

.title{
    text-align: center;
    padding-top: 15vh;
}
.lgin{
    font-size: 2.5rem;
    color: #500E10;
    margin-bottom: 4vh;
}
.icon{
    display:none;
}

.square {
    margin: 0 auto;
    text-align: center;
    width: 20vw;
}

.btn {
	-webkit-transition: all 200ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
	-moz-transition: all 200ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
	-ms-transition: all 200ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
	-o-transition: all 200ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
	transition: all 200ms cubic-bezier(0.390, 0.500, 0.150, 1.360);
	display: flex;
	margin: 20px auto;
	border-radius: 10px;
    padding: 20px 30px;
    
}

.pNaver, .pTwitter, .pGoogle{
    font-size: 1.2rem;
    color:black;
    margin-bottom: 0; 
}

a.button {
    border: 1px solid #7E7B7B;
}


a.button2 {
    border: 1px solid #7E7B7B;
}

a.button3 {
    border: 1px solid #7E7B7B;
}


img.naver, img.twitter, img.google{
    width: 30px;
    height: 30px;
    margin-right: 4vw;
}

.btn.focus, .btn:focus {
    box-shadow: none;
}

/*반응형 시작*/
/*모바일 폰*/
@media screen and (max-width: 768px){
    .title{
        padding-top: 15vh;
    }
    .lgin{
        font-size: 1.5rem;
        color: #500E10;
        margin-bottom: 3vh;
    }
    .pNaver, .pTwitter, .pGoogle{
        font-size: 1.2rem;
        color:black;
        margin-bottom: 0; 
        width: 35vw;
    }
    .square{
        width: 60vw;
    }
    img.naver, img.twitter, img.google{
        width: 20px;
        height: 20px;
        margin-right: 4vw;
        margin-left: 3vw;
        margin-top: 0.7vh;
    }
    .btn{
        padding: 12px 18px;
    }
}

/*패드*/
@media (min-width: 768px) and (max-width: 1024px){
    .title{
        padding-top: 10vh;
    }
    .lgin{
        font-size: 2.5rem;
        color: #500E10;
        margin-bottom: 3vh;
    }
    .square{
        width: 35vw;
    }
    .btn{
        padding: 16px 24px;
    }
    .pNaver, .pTwitter, .pGoogle{
        font-size: 1.2rem;
        color:black;
        margin-bottom: 0; 
    }
    img.naver, img.twitter, img.google{
        width: 25px;
        height: 25px;
        margin-right: 1vw;
        margin-left: 3vw;
        margin-top: 2px;
    }
}

/*글씨 밀리는 것 방지*/
@media (min-width: 1024px) and (max-width: 1244px){
    .title{
        padding-top: 10vh;
    }
    .lgin{
        font-size: 2.5rem;
        color: #500E10;
        margin-bottom: 3vh;
    }
    .square{
        width: 30vw;
    }
    .btn{
        padding: 20px 30px;
    }
    .pNaver, .pTwitter, .pGoogle{
        font-size: 1.2rem;
        color: black;
        margin-bottom: 0;
    }
    img.naver, img.twitter, img.google{
        width: 30px;
        height: 30px;
        margin-right: 4vw;
        margin-left: 3vw;
    }

}
/*반응형 끝*/