/* IE6-9に適用するハック */
#h-s-content .sp {
    _display: none;
    *display: none;
    display: none\9;
}
#h-s-content :root .sp {
    display: none\0/;
}

/* スタイル */
#h-s-content {
    margin: 0 auto;
    max-width: 960px;
    font-family: 'Hiragino Kaku Gothic ProN',Meiryo,arial;
    color: #333;
    line-height: 1.8em;
}
#h-s-content #cp__header {
    padding: 15px 0 12px;
}
#h-s-content #cp__header img {
    max-width: 200px;
}
#h-s-content #kv-img {
}
#h-s-content #kv-intro  {
    margin-top: 5px;
}
#h-s-content #kv-intro img {
    width: 50%;
}
#h-s-content #kv_description  {
    padding: 40px 0 0;
    text-align: center;
    font-size: 16px;
    line-height: 1.8em;
    color: #333;
    margin-bottom: -40px;
}
#h-s-content #kv_description br {
    display: none;
}
#h-s-content .function-section__wrapper {
    margin-bottom: 40px;
}
#h-s-content .function-section {
    margin-top: 80px;
}
#h-s-content .sub-title__1, #h-s-content .sub-title__2, #h-s-content .sub-title__3 {
    height: 87px;
    width: 100%;
}
#h-s-content .sub-title__1 {
    background: #FFF8FA;    
}
#h-s-content .sub-title__2 {
    background: #FBFAFF;    
}
#h-s-content .sub-title__3 {
    background: #F0F8FC;    
}
#h-s-content .sub-title__1 h2, #h-s-content .sub-title__2 h2, #h-s-content .sub-title__3 h2 {
    display: inline-block;
}
#h-s-content .sub-title__1 p, #h-s-content .sub-title__2 p, #h-s-content .sub-title__3 p {
    display: inline-block;
    vertical-align: top;
    margin-top: 16px;
    padding-left: 20px;
    margin-left: 20px;
    font-size: 16px;
    line-height: 1.8em;
    color: #333;
    font-weight: bold;
}
#h-s-content .sub-title__1 p {
    border-left: 1px solid #EA7C96;
    color: #EA7C96;
}
#h-s-content .sub-title__2 p {
    border-left: 1px solid #A095BC;
    color: #A095BC;
}
#h-s-content .sub-title__3 p {
    border-left: 1px solid #54A7D3;
    color: #54A7D3;
}
#h-s-content .sub-title__title img {
    height: 87px;
    padding-left: 20px;
}
#h-s-content .sub-title__num {
    float: right;
    margin-right: 20px;
}
#h-s-content .sub-title__num img {
    height: 87px;
    margin-right: 10px;
}
#h-s-content .function-content {
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    justify-content: space-between;
    width: 100%;
}
#h-s-content .left-content, #h-s-content .right-content {
    width: 460px;
    margin-top: 30px;
}
#h-s-content .movie {
}
#h-s-content .comment {
    margin-top: 20px;
}
#h-s-content .comment h3 {
    margin-top: 20px;
    padding: 6px 20px 5px;
    display: inline-block;
    font-size: 16px;
    color: #fff;
    line-height: 1.5em;
}
#h-s-content .comment__1 h3 {
    background-color: #EA7C96;
}
#h-s-content .comment__2 h3 {
    background-color: #A095BC;
}
#h-s-content .comment__3 h3 {
    background-color: #54A7D3;
}
#h-s-content .comment img {
    width: 85px;
    margin-right: 15px;
}
#h-s-content .comment__content__img {
    display: table;
}
#h-s-content .comment__content__description {
    display: inline-block;
    margin-left: 10px;
}
#h-s-content .comment__content h4 {
    width: 350px;
    font-size: 20px;
    margin-top: 10px;
    line-height: 1.5em;
    display: table-cell;
    vertical-align: middle;
}
#h-s-content .comment__content p {
    font-size: 16px;
    vertical-align: top;
    margin-left: 90px;
}
#h-s-content .comment__content {
    border-top: 1px dashed #ccc;
    border-bottom: 1px dashed #ccc;
    padding: 10px 0 20px;
}

#h-s-content .content__scheme {
    background: #F4F5F5;
    position: relative;
}
#h-s-content .scheme img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
    width: 80%;
}
#h-s-content #content-footer {
    padding: 40px 0;
    border-top: 1px solid #eee;
}
#h-s-content #content-footer__inner {
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
}
#h-s-content #content-footer p {
    font-size: 20px;
    color: #333;
    margin-bottom: 16px;
}
#h-s-content #content-footer img {
    height: 200px;
    border: 1px solid #ddd;
}
#h-s-content .footer__banner__btn {
    height: 200px;
}
#h-s-content #content-footer .footer__banner__btn img {
    height: 200px;
}

@media screen and (min-width: 961px) {
   /* 表示領域が600px以上の場合に適用するスタイル */
    #h-s-content .sp {
        display: none;
    }
}
@media screen and (max-width: 960px) {
    body {
        margin: 0;
    }
    #h-s-content .pc {
        display: none;
    }
    #h-s-content #cp__header {
        padding: 20px 20px 16px;
    }
    #h-s-content #kv-intro img {
        width: 100%;
    }
    #h-s-content #kv-intro {
        padding: 10px 14px 0;
    }
    #h-s-content #kv_description  {
        padding: 20px 14px 0;
        text-align: left;
        font-size: 15px;
        color: #333;
        margin-bottom: 0;
    }
    #h-s-content #kv_description br {
        display: initial;
    }
    #h-s-content .sub-title__1, #h-s-content .sub-title__2, #h-s-content .sub-title__3 {
        height: 70px;
    }
    #h-s-content .sub-title__title img {
        height: 54px;
        padding-left: 14px;
    }
    #h-s-content .sub-title__1 p, #h-s-content .sub-title__2 p, #h-s-content .sub-title__3 p {
        display: block;
        vertical-align: initial;
        margin-top: -13px;
        margin-left: 40px;
        font-size: 13px;
        line-height: 1.8em;
        color: #333;
        font-weight: normal;
    }
    #h-s-content .sub-title__1 p br, #h-s-content .sub-title__2 p br,#h-s-content .sub-title__3 p br {
        display: none;
    }
    #h-s-content .sub-title__1 p {
        border-left: none;
    }
    #h-s-content .sub-title__2 p {
        border-left: none;
    }
    #h-s-content .sub-title__3 p {
        border-left: none;
    }
    #h-s-content .left-content, #h-s-content .right-content {
        width: 100%;
        margin-top: 10px;
    }
    #h-s-content .function-content {
        display:initial;
        display:initial;
        display:initial;
        display:initial;
        display:initial;
        display:initial;
        -webkit-box-lines:initial;
        -moz-box-lines:minitial;
        -webkit-flex-wrap:initial;
        -moz-flex-wrap:initial;
        -ms-flex-wrap:initial;
        flex-wrap:initial;
        justify-content: initial;
        width: 100%;
    }
    #h-s-content .function-section {
        margin-top: 40px;
        padding: 0 14px;
    }
    #h-s-content .comment h3 {
        font-size: 15px;
    }
    #h-s-content .comment__content {
    }
    #h-s-content .comment__content__img {
        width: 100%;
        display: table;
    }
    #h-s-content .comment__content__img img {
        width: 90px;
    }
    #h-s-content .comment__content__description {
        display: inline-block;
        margin-left: 5px;
    }
    #h-s-content .comment__content__description p {
        margin-left: 0;
        margin-top: 10px;
    }
    #h-s-content .comment__content h4 {
        font-size: 15px;
        height: 60px;
        display: inline-block;
        width: 70%;
        margin-left: 3%;
        display: table-cell;
        vertical-align: middle;
    }
    #h-s-content .comment__content p {
        font-size: 15px;
    }
    #h-s-content .content__scheme {
        position: initial;
        text-align: center;
        padding: 20px 0;
    }
    #h-s-content .scheme img {
        position: initial;
        top: initial;
        left: initial;
        transform: initial;
        -webkit- transform: initial;
        width: 90%;
    }
    #h-s-content #content-footer {
        padding: 40px 20px;
    }
    #h-s-content .footer__banner__btn {
        text-align: center;
    }
    #h-s-content #content-footer p {
        font-size: 15px;
    }
    #h-s-content #content-footer .footer__banner__banner img {
        height: 122px;
    }
    #h-s-content #content-footer .footer__banner__btn img {
        height: 122px;
    }
}