/* 768px以上の表示 */
@media  ( min-width : 768px ) {

.container {
    /* width: 800px; */
    color:#5c5c5c;
}
}

    
    div.outer {  
        display: table;    
        height: 100px;  
        width: 100%;      
        color: #5C5C5C;  
    }  
        * html div.outer {  
            position: relative; 
        }  
        *+html div.outer {  
            position: relative;  
        }  
    div.vertical_middle {  
        display: table-cell;     
        vertical-align: middle;  
        font-size: 16pt;
    }  
        * html div.vertical_middle {  
            position: absolute;  
            top: 50%;            
        }  
        *+html div.vertical_middle {  
            position: absolute;  
            top: 50%;             
        }  
    div.vertical_middle p.inner {  
        margin: 0;  
    }  
        * html div.vertical_middle p.inner {  
            position: relative;   
            top: -50%;           
        }  
        *+html div.vertical_middle p.inner {  
            position: relative; 
            top: -50%;           
        }  
    
        .msg-block{
        margin-bottom: 50px;
    }


.api-row{
    display:flex;
    gap:20px;
    margin-top: 30px;
}

.api-col{
    flex:1;
    text-align:center;
}

.msg-block{
    margin-bottom: 50px;
}

.mb-30{
    margin-bottom:50px;
}

.ml-30{
    margin-left:30px;
}

.mt-50px{
    margin-top:50px;
}

h1{
    font-weight:bold;
    letter-spacing:-2px;
    line-height:0.9em;
}

h3{
    font-size: 18pt;
    font-weight:bold;
    /* border: 1px solid #5C5C5C; */
    /* border-radius: 100vh; */
    display:inline-block;
    padding:10px 15px;
}

.msg-block .title{
    font-size: 18pt;
    font-weight:bold;
    display:inline-block;
    padding:10px 15px;
}

h4{
    font-size:18px;
    font-weight:bold;
}

h5 {
    font-size:16px;
    font-weight:700;
}

.light-blue{
    background-color:#74c0fc;
}

.darker-blue
{
    background-color:#1971c2;   
}

.radius-100vh
{
    border-radius: 100vh;
}

.radius-30px
{
    border-radius: 20px;
}

.catch-row{
    display:flex;
    align-items:center;
}


.catch-msg{
    font-size: 16pt;
    letter-spacing: 3px;
}


.msg-block ul,ol{
    margin-left: 70px;
    list-style: none;
}


table{
    width:96%; 
    border:1px gray solid;
    border-collapse:collapse;
    margin:0 10px;
} 

.table-col-header{
    border:1px gray solid;
    padding:15px;
    text-align:center;
    white-space: nowrap;

    /* background-color:#5AC9FA; */
    color:#495057;
    font-weight:bold;
 
}

.table-col-data{
    border:1px gray solid;
    padding:15px;
    text-align:center;
}


.table-col-note
{
    border:1px gray solid;
    padding:5pt;
    font-size: 12px;
    font-style:italic;
    font-weight: 500;
    border:none;
}


.entry-field:focus{
    background-color:#e7f5ff
}

.submit-btn{
    display:block;
    width:7em;
    height: 2em;
    margin:1em auto;
    background:white;
    border:1px solid #707070; 
    border-radius:100vh;
    color:#1864ab;
    font-size:16pt;
    font-weight:bold;
    text-decoration:none;
    text-align:center;
}

.submit-btn:hover{
    background-color:#1864ab;
    color:white;
    font-weight:bold;
    
}

table a:link, table a:visited{
 color: #1971c2;

}

table a:hover, table a:active{
    text-decoration: underline;
}

.download-note{
    font-size:14px;
}

.download-note a:link{
    display:inline;
    color: #1971c2;
}

.download-note a:visited{
    display:inline;
    color: #1971c2;
}

.download-note a:hover,a:active{
    text-decoration: underline;
}

.myrow{
    display:flex;
    justify-content:space-between;
}

.flex-gap-50px
{
    gap: 50px;
}

.mycol{

    flex:1; 
}

.font-14px
{
    font-size:14px;
}

.padding-15px
{
    padding:0 15px;
}

.list-check-icon{
    list-style-position: outside;
    list-style:square
}

.border{
    border:1px gray solid;
}

.border-blue{
    border:1px  #1971c2 solid;
}

.no-border{
    border:none;
}

.padding-0{
    padding:0;
}

.padding-5
{
    padding:5px;
}

.padding-15
{
    padding:15px;
}

.align-left
{
    text-align:left;
}

.myrow:has( .feature-box){
    position:relative;
}

.feature-box ul{
    margin-top:2em;
}

.feature-system-dongle::before{
    content:"システムドングル";
    position:absolute;
    top: -15px;
    background-color:white;
    font-size:18px;
    font-weight:bold;
    padding: 0 10px;
    border:1px  #1971c2 solid;
    border-radius: 100vh;
    background-color:#d0ebff;
}

.feature-user-dongle::before{
    content:"ユーザドングル";
    position:absolute;
    top: -15px;
    background-color:white;
    font-size:18px;
    font-weight:bold;
    padding: 0 10px;
    border:1px  #1971c2 solid;
    border-radius: 100vh;
    background-color:#d0ebff;
}

.feature-local-dongle::before{
    content:"ローカルドングル";
    position:absolute;
    top: -15px;
    background-color:white;
    font-size:18px;
    font-weight:bold;
    padding: 0 10px;
    border:1px  #1971c2 solid;
    border-radius: 100vh;
    background-color:#d0ebff;
}

.feature-net-dongle::before{
    content:"ネットワークドングル";
    position:absolute;
    top: -15px;
    background-color:white;
    font-size:18px;
    font-weight:bold;
    padding: 0 10px;
    border:1px  #1971c2 solid;
    border-radius: 100vh;
    background-color:#d0ebff;
}

.copyright{
        border-bottom:8px solid   #1971c2;
        position:absolute;
        bottom:0;
        width:100%;
        font-size:10px;
}