@charset "utf-8";
/* =============================================================
フォーム内で入れ子になっているテーブルのcss
============================================================= */
.typefm-container{
    display: flex;
    max-width: 700px;
}
/* 繰り返しが発生した場合余白を追加 */
.ttanto + .ttanto{
    margin-top: 20px;
}
/* table.typeFMの中のtable */
#main table.typefm-table {
    border-collapse: collapse;
	width: 100%;
    max-width: 700px;
    box-sizing: border-box;
}
#main table.typefm-table th {
	padding: 10px 20px;
    width: 18%;
    background-color: #e0ffff;
    border: 1px solid #bbb;
}
#main table.typefm-table td{
    padding: 10px 20px;
    width: 70%;
    border: 1px solid #bbb;
}
.delete{
    border: 1px solid #bbb;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 12%;
}

/* インラインのテキストボックス */
.form-control_inline {
    padding: 0.25em 0.75em;
    box-sizing: border-box;
    margin-bottom: 0.3em;
    max-width: 8em;
}
/* 改行しても構わない位置を指定 */
.keep-all-anywhere{
    word-break: keep-all;
    overflow-wrap: anywhere;
}
 
.radio-group {
 display: flex;
 flex-direction: row;
 gap: 10px;
 align-items: center;
 flex-wrap: wrap;
}

.required-label {
	color: red;
	margin-left: 8px;
}



/* iPadの縦横両方の記述 */
/* @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
	
} */

/* デバイスが横向きの場合のみの記述 */
/* @media only screen and (orientation: landscape) and (min-device-width: 768px) and (max-device-width:1024px){

} */

/* スマホ用の記述 */
@media only screen and (max-width:767px){
    
    .radio-group {
     flex-direction: column;
     align-items: flex-start;
    }



    .typefm-container{
        display: block;
    }
    .row{
        display: block;
    }
    .delete {
        display: block;
        width: 100%;
        border: 1px solid #bbb;
        padding: 10px 20px;
        box-sizing: border-box;
        text-align: center;
    }
    main table.typefm-table {
        border-collapse: collapse;
        border: 1px solid #bbb;
        width: 100%;
        table-layout: fixed;
        box-sizing: border-box;
    }
    /* 削除ボタン順番入れ替えのため親要素の枠を消す */
    main table.typefm-table th {
        background-color: #e0ffff;
    }
    /* 図書館システムの連続するtdにボーダーを付ける */
    .typeFM td + td{
        border-top: 1px solid #bbb;
    }
    /* チェック要素に余白とボーダーを付ける */
    .form-check{
        border: 1px solid #bbbbbb;
        border-radius: 3px
    }
    
}