@charset "utf-8";
/*------------------------------------------------------------
    便利スタイル
------------------------------------------------------------*/
.bkgray{ background-color: #cccccc;}
.bkazure{ background-color: #f0ffff;}
.bklightyellow{ background-color: #ffffe0;}

.tred{ color:#ff0000;}
.twhite{ color: #ffffff;}

.tbold{ font-weight: bold;}

/* float */
.floatL { float: left;}
.floatR { float: right;}
.clear { clear: both;}

.hidden{ display: none;}

.not_kaigyou{ white-space: nowrap;}

.no_border{
    border-style:none;
}
.line120{ line-height:1.2;}

.center {
    margin:0 auto;
    padding:0;
}
.tcenter { text-align:center;}
.tleft   { text-align:left;}
.tright  { text-align:right;}

/* clearfix */
* html .clearFix,
* html .clearfix {
    zoom: 1;
}

*+html .clearFix,
*+html .clearfix {
    zoom: 1;
}
.clearFix:after,
.clearfix:after {
    height: 0;
    visibility: hidden;
    content: ".";
    display: block;
    clear: both;
}

.display-block{
    display: block;
}
.display-table{
    display: table;
}
.display-cell{
    display: table-cell;
    vertical-align:middle;
}
.display-iblock{ display: inline-block;}

.p5 { padding: 5px !important;}

.pl5 { padding-left: 5px !important;}
.pl10 { padding-left: 10px !important;}
.pl20 { padding-left: 20px !important;}

.pr10 { padding-right: 10px !important;}

.pt10{ padding-top:10px;}

.mr5  { margin-right: 5px !important;}
.mr10 { margin-right: 10px !important;}
.mr20 { margin-right: 20px !important;}
.mr30 { margin-right: 30px !important;}
.mr40 { margin-right: 40px !important;}
.mr50 { margin-right: 50px !important;}
.mr100{ margin-right: 100px !important;}

.ml5  { margin-left: 5px !important;}
.ml10 { margin-left: 10px !important;}
.ml20 { margin-left: 20px !important;}
.ml30 { margin-left: 30px !important;}
.ml40 { margin-left: 40px !important;}
.ml50 { margin-left: 50px !important;}
.ml100{ margin-left: 100px !important;}

.mb0  { margin-bottom: 0 !important;}
.mb5  { margin-bottom: 5px !important;}
.mb10 { margin-bottom: 10px !important;}
.mb20 { margin-bottom: 20px !important;}
.mb30 { margin-bottom: 30px !important;}
.mb100{ margin-bottom: 100px !important;}

.mt0  { margin-top: 0 !important;}
.mt5  { margin-top: 5px !important;}
.mt10 { margin-top: 10px !important;}
.mt15 { margin-top: 15px !important;}
.mt20 { margin-top: 20px !important;}
.mt30 { margin-top: 30px !important;}
.mt40 { margin-top: 40px !important;}
.mt50 { margin-top: 50px !important;}

.w50  { width:50px;}
.w75  { width:75px;}
.w100 { width:100px;}
.w150 { width:150px;}
.w200 { width:200px;}
.w300{ width:300px;}
.w400{ width:400px;}
.w500{ width:500px;}

.w100pct{ width:100%}

.widthFit{ width:fit-content;}

.minw50 { min-width: 50px !important;}
.minw70 { min-width: 70px !important;}
.minw80 { min-width: 80px !important;}
.minw90 { min-width: 90px !important;}
.minw100{ min-width: 100px !important;}
.minw150{ min-width: 150px !important;}
.minw200{ min-width: 200px !important;}

.max500 { max-width: 500px;}

.ime-disabled { ime-mode: disabled;}

.bk_blue{
    background-color: #191970;
    color:white;
    font-weight: bold;
    padding:0 10px;
}
.bk_blue_sub{
    border:1px solid #191970;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    padding:0 10px 10px 10px;
    background-color: #e0f3f6;
}

.pos-stt{ position:static;}

@media screen and (min-width: 520px) {
    .mobile_only{
        display:none;
    }
}

@media screen and (max-width: 520px) {
    .pl20 { padding-left: 10px !important;}
    
    .mr20 { margin-right: 10px !important;}
    .mr30 { margin-right: 10px !important;}
    .mr40 { margin-right: 10px !important;}
    .mr50 { margin-right: 10px !important;}
    .mr100{ margin-right: 10px !important;}
    
    .ml20 { margin-left: 10px !important;}
    .ml30 { margin-left: 10px !important;}
    .ml40 { margin-left: 10px !important;}
    .ml50 { margin-left: 10px !important;}
    .ml100{ margin-left: 10px !important;}
    
    .w400{ width:200px;}
}