/*
---------------------------------*/
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}


/* float
---------------------------------*/
.fl { float: left;}
.fr { float: right;}


/*端末設定
---------------------------------*/
.for-sp { display: none; }
.for-pc { display: inherit; }


/*サムネイル
---------------------------------*/
.thum {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.v-top { vertical-align: top !important;}
.middle { vertical-align: middle;}


/*文字間
---------------------------------*/
.line { line-height: 1.6em;}


/*カラー
---------------------------------*/
.white { color: #fff;}
.gray { color: #939393;}


/*ボーダー
---------------------------------*/
.bo_dotted { border-bottom: 1px dotted #fff;}


/*フォントサイズ
---------------------------------*/
.font10 { font-size: 10px !important; }
.font11 { font-size: 11px !important; }
.font12 { font-size: 12px !important; }
.font13 { font-size: 13px !important; }
.font14 { font-size: 14px !important; }
.font15 { font-size: 15px !important; }
.font16 { font-size: 16px !important; }
.font17 { font-size: 17px !important; }
.font18 { font-size: 18px !important; }
.font20 { font-size: 20px !important; }
.font22 { font-size: 22px !important; }
.font24 { font-size: 24px !important; }


/*フォント
---------------------------------*/
.bold { font-weight: bold !important; }
.center { text-align: center !important;}
.left { text-align: left !important;}
.right { text-align: right !important;}
.normal { font-weight: normal;}


/*フォントカラー
---------------------------------*/
.red { color: red !important; }
.blue { color: #007AD2 !important;}

/*テキストデコレーション
---------------------------------*/
.text-underline { text-decoration: underline; }


/*背景色
---------------------------------*/
.bg-blue {
    background: #007AD2;
    color: #fff;
}

/*横幅
---------------------------------*/
.wAuto { width: auto !important; }
.w30 { width: 30px !important; }
.w40 { width: 40px !important; }
.w50 { width: 50px !important; }
.w60 { width: 60px !important; }
.w70 { width: 70px !important; }
.w80 { width: 80px !important; }
.w90 { width: 90px !important; }
.w100 { width: 100px !important; }
.w110 { width: 110px !important; }
.w120 { width: 120px !important; }
.w130 { width: 130px !important; }
.w140 { width: 140px !important; }
.w150 { width: 150px !important; }
.w160 { width: 160px !important; }
.w170 { width: 170px !important; }
.w180 { width: 180px !important; }
.w190 { width: 190px !important; }
.w200 { width: 200px !important; }
.w250 { width: 250px !important; }
.w300 { width: 300px !important; }

.w25p { width: 30% !important; }
.w30p { width: 30% !important; }
.w40p { width: 40% !important; }
.w50p { width: 50% !important; }
.w60p { width: 60% !important; }
.w70p { width: 70% !important; }
.w75p { width: 70% !important; }
.w80p { width: 80% !important; }
.w90p { width: 90% !important; }
.w100p { width: 100% !important; }

/*高さ
---------------------------------*/
.h30 { height: 30px !important; }
.h40 { height: 40px !important; }
.h50 { height: 50px !important; }
.h60 { height: 60px !important; }
.h70 { height: 70px !important; }
.h80 { height: 80px !important; }
.h90 { height: 90px !important; }
.h100 { height: 100px !important; }
.h110 { height: 110px !important; }
.h120 { height: 120px !important; }
.h130 { height: 130px !important; }
.h140 { height: 140px !important; }
.h150 { height: 150px !important; }
.h160 { height: 160px !important; }
.h170 { height: 170px !important; }
.h180 { height: 180px !important; }
.h190 { height: 190px !important; }
.h200 { height: 200px !important; }


/*マージン
---------------------------------*/
.m-auto { margin: 0 auto;}
.mg0 { margin: 0px !important; }
.mg5 { margin: 5px !important;}
.mg10 { margin: 10px !important;}
.mg20 { margin: 20px !important;}

.mt0 { margin-top: 0 !important;}
.mt5 { margin-top: 5px !important;}
.mt10 { margin-top: 10px !important;}
.mt20 { margin-top: 20px !important;}
.mt30 { margin-top: 30px !important;}
.mt50 { margin-top: 50px !important;}
.mt100 { margin-top: 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;}
.mb40 {margin-bottom: 40px !important;}

.ml0 { margin-left: 0 !important;}
.ml10 { margin-left: 10px !important;}
.ml20 { margin-left: 20px !important;}
.ml30 { margin-left: 30px !important;}

.mr0 { margin-right: 0 !important;}
.mr10 { margin-right: 10px !important;}
.mr20 { margin-right: 20px !important;}
.mr30 { margin-right: 30px !important;}



/*パディング
---------------------------------*/
.pa0 { padding: 0 !important;}
.pa5 { padding: 5px 0 !important;}
.pa15 { padding: 15px 0 !important;}
.pa20 { padding: 20px 0 !important;}
.pa25 { padding: 25px 0 !important;}
.pa30 { padding: 30px 0 !important;}
.pa50 { padding: 50px 0 !important;}
.pa80 { padding: 80px 0 !important;}

.pb0 { padding-bottom: 0 !important;}
.pb5 { padding-bottom: 5px !important;}
.pb10 { padding-bottom: 10px !important;}
.pb20 { padding-bottom: 20px !important;}
.pb30 { padding-bottom: 30px !important;}
.pb40 { padding-bottom: 40px !important;}
.pb50 { padding-bottom: 50px !important;}
.pb80 { padding-bottom: 80px !important;}

.pt0 { padding-top: 0 !important;}
.pt5 { padding-top: 5px !important;}
.pt10 { padding-top: 10px !important;}
.pt15 { padding-top: 15px !important;}
.pt20 { padding-top: 20px !important;}
.pt25 { padding-top: 25px !important;}
.pt30 { padding-top: 30px !important;}
.pt40 { padding-top: 40px !important;}
.pt50 { padding-top: 50px !important;}
.pt80 { padding-top: 80px !important;}
.pt100 { padding-top: 100px !important;}

.pl0 { padding-left: 0 !important;}
.pl10 { padding-left: 10px !important;}
.pl30 { padding-left: 30px !important;}
.pl75 { padding-left: 75px !important;}

.pr5 { padding-right: 5px !important;}
.pr10 { padding-right: 10px !important;}
.pr20 { padding-right: 20px !important;}
.pr30 { padding-right: 30px !important;}
.pr70 { padding-right: 70px !important;}



/*テーブル関連
---------------------------------*/
table {
    border-collapse: collapse;
    width: 100%;
}

table tr th {
    font-weight: normal;
    text-align: left;
}

.table-border {
    border: solid 1px #707070;
    border-collapse: collapse;
}

.table-border th,
.table-border td {
    padding: 16px;
    border-left: solid 1px #707070;
    border-right: solid 1px #707070;
    border-top: solid 1px #939393;
    border-bottom: solid 1px #939393;
}


/*--------------------------------------------------------------------------------
　▼ 　
--------------------------------------------------------------------------------*/
button,
input[type="text"],
input[type="password"],
textarea,
select {
    outline: none;
}


/*--------------------------------------------------------------------------------
　▼ 改行　
--------------------------------------------------------------------------------*/
.br::before {
    content: "\A";
    white-space: pre;
}

.br2::before {
    content: "";
    white-space: inherit;
}

@media screen and (max-width:767px) {
    .br::before {
        content: "";
        white-space: inherit;
    }
}



@media screen and (max-width:767px) {

    .for-sp { display: inherit; }
    .for-pc { display: none; }


    .sp-wAuto { width: auto !important; }
    .sp-w30 { width: 30px !important; }
    .sp-w40 { width: 40px !important; }
    .sp-w50 { width: 50px !important; }
    .sp-w60 { width: 60px !important; }
    .sp-w70 { width: 70px !important; }
    .sp-w80 { width: 80px !important; }
    .sp-w90 { width: 90px !important; }
    .sp-w100 { width: 100px !important; }
    .sp-w110 { width: 110px !important; }
    .sp-w120 { width: 120px !important; }
    .sp-w130 { width: 130px !important; }
    .sp-w140 { width: 140px !important; }
    .sp-w150 { width: 150px !important; }
    .sp-w160 { width: 160px !important; }
    .sp-w170 { width: 170px !important; }
    .sp-w180 { width: 180px !important; }
    .sp-w190 { width: 190px !important; }
    .sp-w200 { width: 200px !important; }
    .sp-w250 { width: 250px !important; }
    .sp-w300 { width: 300px !important; }

    .sp-w30p { width: 30% !important; }
    .sp-w40p { width: 40% !important; }
    .sp-w50p { width: 50% !important; }
    .sp-w60p { width: 60% !important; }
    .sp-w70p { width: 70% !important; }
    .sp-w80p { width: 80% !important; }
    .sp-w90p { width: 90% !important; }
    .sp-w100p { width: 100% !important; }

    .sp-table-v  {
        border: none;
    }

    .sp-table-v thead {
        display: none;
    }

    .sp-table-v tr {
        border-top: 1px solid #999;
        display: block;
        margin-bottom: 20px;
    }

    .sp-table-v td {
        border: 1px solid #f0f0f0 !important;
        display: block;
        padding: 10px;
        text-align: right !important;
    }

    .sp-table-v td::before {
        content: attr(data-label);
        float: left;
        font-weight: bold;
    }

    .sp-table01 tr {
        margin-bottom: 0;
    }

    .sp-table01 .sp-t-none {
        display: none;
    }

    .sp-table01 .sp-t-block {
        border: none;
        display: block;
        width: 100%;
    }

}