.btnx--outline-teals{
    color: #2b394d;
    background: #edf4fc;
    border: 2px solid #85acde; 
    opacity: 0.7;
    
}
        
.container{
    max-width: 990px;
    
}
        

/*追加しました*/
.card-auth{
    width:  85vw;
    border: 0;
    border-radius: 1rem;
    box-shadow: 0 0.2rem 0.2rem 0 rgba(0, 0, 0, 0.1);
    
}
        
.card-title{
    margin-bottom: 2rem;
    font-size: 1.5rem;
    
}
        
.card-body{
    padding: 2rem;
    
}
        
.form-auth{
    width: 100%;
    
}
        
.form-label-group{
    margin-bottom: 1rem;
    
}

.form-label-group input{
    border-radius: 2rem;
    
}
        
.form-control:focus{
    box-shadow: none;
    
}
        
.card-title{
    font-size: 90%;
    letter-spacing: 5px;
    color: #999999;
    
}
        
.card-text{
    font-size: 70%;
    letter-spacing: 2px;
    color: #a1a1a1;
    
}
        
.city-ratio{
    letter-spacing: 5px;
    background-color: #f5f5f5;
    font-size: clamp(3vw, 12px, 6vw);
    padding: 10px 0px 10px 0px;
    border-radius: 10px 10px 10px 13px;
    margin-left: 0;
    opacity:0.8;
    
}
        
.form-control{
    font-size: 75%;
    opacity:0.9;
    
}
        
.btnx--outline-teal{
    color: #5a5b5c;
    background:#ffffff;
    border: 2px solid #4c4d4f;
    opacity: 0.8;
    
}

.navbar-brand{
    background-color: #f5f5f5;
    color: #696969;
    /* font-size: clamp(4vw, 25px, 6vw); */
    font-size: clamp(16px, 4vw, 25px);
    font-family: 'ヒラギノ角ゴ StdN','Hiragino Kaku Gothic StdN','Arial Black','Arial Rounded MT Bold',sans-serif;
    float: left;
    padding: 0px 2px 0px 1px;
    /*margin-left: 0px;*/
    opacity:0.8;
    
}
        
.login_user{
    text-decoration: none;
    margin-left: 10px;
    color: #696969;
    opacity: 0.5;
    font-size: 70%;
    
}
        
.main-role{
    color: #696969;
    font-family: 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',YuGothic,'Yu Gothic','ヒラギノ角ゴシック','Hiragino Sans',sans-serif;
    opacity:0.8;
    padding: 20px;
    text-align:center;
    letter-spacing: 0.2em
    
}
        
.main-role h2{
    /* font-size:clamp(4vw, 25px, 6vw); */
    font-size:clamp(18px, 4vw, 25px);
    
}
        
.main-role h6{
    /* font-size:clamp(3vw, 18px, 4vw); */
    font-size: clamp(14px, 3vw, 25px);
    
}
        
.containts {
    font-size: 180%;
    font-family: 'Osaka','ＭＳ ゴシック','ヒラギノ角ゴシック','Hiragino Sans',sans-serif;	
    letter-spacing: 10px;
    padding: 20px 0px 30px 0px;
    width: 100%;
    
}
        
.containts a{
    text-decoration: none;
    transition:all 0.6s;
    background-color: #f5f5f5;
    color: #696969;
    border-radius:3px;
    opacity:0.7;
    padding: 20px 20px 20px 40px;
    
}


        
.containts_item a:hover{
    opacity:2;
    
}
        
.footer{
    background-color: #f5f5f5;
    min-width: 300px;
    width:100%;
    opacity:0.8;
    
}
        
.footer_logo{
    color: #696969;
    font-size: 80%;
    font-family: 'ヒラギノ角ゴ StdN','Hiragino Kaku Gothic StdN','Arial Black','Arial Rounded MT Bold',sans-serif;
    padding: 10px 0px 0px 25px;
    
}
        
.now_year{
    color: #696969;
    font-size: 70;
    font-family:'ヒラギノ角ゴシック','Hiragino Sans','メイリオ', Meiryo,'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
    padding: 3px 0px 0px 0px;
    
}

.titles{
    color: #696969;
    font-size:clamp(1vw, 9px, 2vw);
    padding: 0px 0px 0px 10px;
    
}
        
        
table{
    table-layout: fixed;
    
}
        

table th{
    color: #696969;
    width: 120px;
    font-size: 95%;
    table-layout: fixed;
    word-wrap: break-word;
    border: 1px solid #bbb;
    text-align: center;
    
}


table td{
    color: #6a727d;
    width: 80px;
    height: 20px;
    font-size: 110%;
    border: 0.5px solid #bbb;
    text-align: center;
    
}
        
.table-wrap {
    overflow-x: scroll;
    
}
        
.table {
    width: 100px;
    height: 90%;
    border-collapse: collapse;
    white-space: nowrap;
    
}
        
.salaly_containts {
    font-size: 80%;	
    font-family: 'Osaka','ＭＳ ゴシック','ヒラギノ角ゴシック','Hiragino Sans',sans-serif;
    padding: 20px 0px 30px 0px;
    width: 100%;
    
}
        
.about{
    color: #696969;
    font-size: 80%;
    padding: 10px 0px 0px 25px;
    margin-top: 10px;
    margin-bottom: 10px;
    
}