/* common */
.disp-flex {display: flex;}
.disp-inline {display: inline;}
.disp-iblock {display: inline-block;}
.align-center {align-items: center;}
.just-center {justify-content: center;}
.just-space {justify-content: space-around;}
.just-end {justify-content: flex-end;}
.just-space-between {justify-content: space-between}
.text-center {text-align: center;}
.dir-row {flex-direction: row;}
.dir-column {flex-direction: column;}
.tc {text-align: center;}
.tl {text-align: left;}
.tr {text-align: right;}
.br {border-right: black 1px solid;}
.fl {float: left;}
.fr {float: right;}
.w100 {width: 100%;}
.w50 {width: 50%;}
.p5 {padding: 5px;}
.p10 {padding: 10px;}
.pb10 {padding-bottom: 10px;}
.mb5 {margin-bottom: 5px;}
.mb10 {margin-bottom: 10px;}
.mb20 {margin-bottom: 20px;}
.mb30 {margin-bottom: 30px;}
.mt10 {margin-top: 10px;}
.bold {font-weight: bold;}
.fs-small {font-size: 14px;}
.fs-medium {font-size: 16px;}
.fs-large {font-size: 18px;}
.note-p {font-size: 12px; color:gray;}
.over-ellipsis {overflow:hidden;white-space: nowrap;text-overflow: ellipsis;}
@media screen and (max-width: 768px) {
    .disp-m-block { display: block; }
    .dir-m-column { flex-direction: column; }
    .fs-m-small { font-size: 12px !important; }
    .fs-m-large { font-size: 16px !important;; }
}