body {
    margin: auto
}

#title {
    width: calc(10vw + 16vh);
    height: calc(5vw + 8vh);
    position: absolute;
    top: calc(7vw + 11vh);
    left: 50vw;
    margin: calc(-4vw - 7vh) 0 0 calc(-5vw - 8vh);
    text-align: center
}

#title .image_logo {
    width: calc(10vw + 16vh);
    width: calc(5vw + 8vh);
    margin: 0 0 calc(1vh + 2vh) 0;
}

#title .title_description {
    font-family: "Calibri";
    font-size: calc(0.8vw + 0.8vh);
    font-weight: 900;
    color: #535456;
}

#tel {
    width: calc(10vw + 16vh);
    height: calc(5vw + 8vh);
    position: absolute;
    top: calc(20vw + 30vh);
    left: 50vw;
    margin: calc(-3vw - 5vh) 0 0 calc(-5vw - 8vh);
    text-align: center
}

#tel .tel_description {
    font-family: "Calibri";
    font-size: calc(0.8vw + 0.8vh);
    font-weight: 900;
    color: #535456;
}

#tel .image_tel {
    width: calc(3vw + 5vh);
    height: calc(3vw + 5vh);
    margin: calc(1vw + 1vh) 0 0 0;
    float: left;
}

#tel .tel_number {
    font-family: "Georgia";
    padding: 3px;
    font-size: calc(0.7vw + 0.7vh);
    font-weight: 900;
    line-height: 1.5;
    color: #3b444b;
    height: calc(3vw + 5vh);
    margin: calc(2vw + 3.5vh) 0 0 0;
    letter-spacing: .12rem;
}

#header {
    background-color: #3b444b;
    width: 100%;
    height: 3vh;
}

#content {
    overflow: hidden;
    background-color: #eee;
    width: 100%;
    height: 94vh;
    position: relative;
}

#login {
    width: calc(10vw + 16vh);
    height: calc(5vw + 8vh);
    position: absolute;
    top: calc(13.5vw + 20vh);
    left: 50vw;
    margin: calc(-5vw - 8vh) 0 0 calc(-5vw - 8vh);
    text-align: center
}

#login input {
    font-family: "Calibri";
    background-color: #ddd;
    width: 90%;
    padding: calc(0.5vw + 0.5vh);
    margin: auto;
    font-weight: 600;
    text-align: center;
    outline: #111;
    border-width: 0px;
    transition: 0.2s;
    font-size: calc(0.9vw + 1.3vh);
    color: #111;
}

#submit1 {
    width: 98% !important;
    background-color: #F5DF4D !important;
}

#submit1:hover {
    box-shadow: 0 0 20px #3b444b !important;
}

#submit1:active {
    box-shadow: 0 0 0px transparent !important;
    border: 1px solid #3b444b !important;
}

#login input.active,
#login input:hover {
    /* background-color: #fff; */
}

#login input:hover #login .err {
    /* color: red */
}

#login .err {
    font-size: 1.5em;
    border: 2px solid yellow;
    background: red !important;
    color: black;
}

#footer {
    background-color: #3b444b;
    width: 100%;
    height: 3vh;
}

#buro {
    font-family: "Georgia";
    padding: 3px;
    font-size: calc(0.6vw + 0.6vh);
    color: #fce970;
    letter-spacing: .12rem;
}

#copy_r {
    font-family: "Georgia";
    padding: 3px;
    font-size: 1.2em;
    color: #fce970
}


.parent {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: auto;
}

@media (min-width: 384px) {
    #tel .tel_number {
        font-size: calc(0.6vw + 0.6vh);
    }
}

@media (min-width: 868px) {
    #tel .tel_number {
        font-size: calc(0.7vw + 0.7vh);
    }
}