.text-muted {
  opacity: 0.7;
}

#price{
    background-color: #20366A;
    color: white;
    padding: 0.5em;
}

#price footer li {
    width: 100%;
}
#price footer li a {
    width: 100%;
}

#price .plan_functions{
    text-align: left;
    margin-top: 1em;
}
#price footer{
    text-align: left;
}

#notice ul {
    text-align: left;
}


#spotlights>div.wrapper{
    background: #f7f7f7;
    color: #666666;
}

/* Spotlights */

.spotlights {
margin-bottom: 2rem;
}

.spotlights .spotlight {
    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-align-items: center;
    -webkit-align-items: center;
    -ms-align-items: center;
    align-items: center;
    background: #ffffff;
}

.spotlights .spotlight .image {
    -moz-align-self: -moz-stretch;
    -webkit-align-self: -webkit-stretch;
    -ms-align-self: -ms-stretch;
    align-self: stretch;
    min-width: 50%;
    margin: 0;
}

.spotlights .spotlight .image.alt {
    -moz-order: 2;
    -webkit-order: 2;
    -ms-order: 2;
    order: 2;
}

.spotlights .spotlight .image img {
    object-fit: cover;
    min-height: 100%;
}
.spotlights .spotlight .content {
    min-width: 50%;
    padding: 5rem;
}

.spotlights .spotlight .content > :last-child {
    margin-bottom: 0;
}

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

    .spotlights .spotlight {
        -moz-flex-direction: column;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .spotlights .spotlight .image {
        min-width: 100%;
    }

    .spotlights .spotlight .image.alt {
        -moz-order: 1;
        -webkit-order: 1;
        -ms-order: 1;
        order: 1;
    }

    .spotlights .spotlight .content {
        -moz-order: 2;
        -webkit-order: 2;
        -ms-order: 2;
        order: 2;
        min-width: 100%;
        /*text-align: center;*/
    }

    .spotlights .spotlight .actions {
        -moz-justify-content: center;
        -webkit-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
    }

}

@media screen and (max-width: 736px) {
    .spotlights .spotlight .content {
        padding: 2rem;
    }

}

/* サンプル動画モーダル */
.modal{
    display: none;
    height: 100vh;
    position: fixed;
    top: 0;
    width: 100%;
}
.modal__bg{
    background: rgba(0,0,0,0.8);
    height: 100vh;
    position: absolute;
    width: 100%;
}
/*.modal__content{*/
/*    background: #fff;*/
/*    left: 50%;*/
/*    padding: 40px;*/
/*    position: absolute;*/
/*    top: 50%;*/
/*    transform: translate(-50%,-50%);*/
/*    width: 60%;*/
/*}*/
.modal__content {
    background: #fff;
    left: 3%;
    padding: 10px;
    position: absolute;
    top: 50px;
    width: 94%;
}
video {
    width: 90%;
}


@media only screen and (max-width: 1024px){
.hide1072 {display:none}
}


.header-catch{
}
.header-catch a{
    font-size: x-large;
    line-height:1.5em;
    min-width: 0;
}


.list_colored-wrap {
    list-style:  none;  /* デフォルトのアイコンを消す */
    margin:  0;         /* デフォルト指定上書き */
    padding: 0;         /* デフォルト指定上書き */
}

.list_colored:before {
    content:  "";     /* 空の要素作成 */
    width: 20px;                /* 幅指定 */
    height: 20px;               /* 高さ指定 */
    display:  inline-block;     /* インラインブロックにする */
    background-color: darkred;  /* 背景色指定 */
    position:  relative;        /* 位置調整 */
    top: 3px;                   /* 位置指定 */
    border-radius:  50%;        /* 要素を丸くする */
    margin-right: 5px;          /* 余白指定 */
}

.list_colored {
    padding:  10px;             /* 余白指定 */
    background-color:  white;   /* 背景色指定 */
    border-radius:  10px;       /* 角丸指定 */
    margin-bottom: 5px;         /* 要素と要素の間指定 */
    color: black;                /* 文字色指定 */
    font-size:  20px;           /* 文字サイズ指定 */
}
