@charset "utf-8";
/*
************************************************************************
 カード
************************************************************************
*/
.card-list
{
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;

    margin:-0.5em;
}
.card-list > .card-list-item
{
    margin:0.5em;
    width:calc(100% - 1.0em);
    flex: 0 0 calc(100% - 1.0em);

    border-radius: 0.5em;
    border:1px solid var(--color-gray-light);

    padding:1em;
}
.card-list > .card-list-item > .status
{
    margin-bottom: 1.0em;
}
.card-list > .card-list-item > .card-title
{
    line-height:1.4em;
    border-bottom: 1px dashed var(--main-color-01);
    padding-bottom: 0.5em;
    margin-bottom: 0.5em;
}
.card-list > .card-list-item > .card-title > .main
{
    display: block;
    font-size:1.5em;
    font-weight: bold;
}
.card-list > .card-list-item > .card-title > .sub
{
    display: block;
    font-size:1.0em;
    color:var(--color-gray-dark);
    margin-top:0.5em;
}
.card-list > .card-list-item > .term
{
}
.card-list > .card-list-item > .ope
{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    align-content: space-between;

    margin:-0.5em;
}
.card-list > .card-list-item > .ope > *
{
    margin:0.5em;
    flex: 0 0 auto;
}

.stage-info
{

}
.stage-info > .status
{
    margin-bottom:0.5em;
}
.stage-info > .stage-title
{
    margin-bottom:0.5em;
}
.stage-info > .stage-title > .main
{
    display: block;
    font-size:1.5em;
    font-weight: bold;
}
.stage-info > .stage-title > .sub
{
    display: block;
    font-size:1.0em;
    color:var(--color-gray-dark);
}

/* ################################################################################################ */
/* ## TAB                        ################################################################## */
/* ################################################################################################ */
@media screen and (max-width:1200px) {
}

/* ################################################################################################ */
/* ## スマホサイト用スタイル ###################################################################### */
/* ################################################################################################ */
@media screen and (max-width:640px) {
}