/* margin-padding---------------------------------------------------------- */
.mt10 {
    margin-top: 1rem;
}

.mt15 {
    margin-top: 1.5rem;
}

.mb10 {
    margin-bottom: 1rem;
}

.pb10 {
    padding-bottom: 1rem;
}

/* display---------------------------------------------------------- */
.block {
    display: block;
}


.star-rating[data-rate="5"]:after {
    width: 100%;
}

.star-rating[data-rate="4.9"]:after {
    width: 98%;
}

.star-rating[data-rate="4.8"]:after {
    width: 96%;
}

.star-rating[data-rate="4.7"]:after {
    width: 94%;
}

.star-rating[data-rate="4.6"]:after {
    width: 92%;
}

.star-rating[data-rate="4.5"]:after {
    width: 90%;
}

.star-rating[data-rate="4.4"]:after {
    width: 88%;
}

.star-rating[data-rate="4.3"]:after {
    width: 86%;
}

.star-rating[data-rate="4.2"]:after {
    width: 84%;
}

.star-rating[data-rate="4.1"]:after {
    width: 82%;
}

.star-rating[data-rate="4"]:after {
    width: 80%;
}

.star-rating[data-rate="3.9"]:after {
    width: 78%;
}

.star-rating[data-rate="3.8"]:after {
    width: 76%;
}

.star-rating[data-rate="3.7"]:after {
    width: 74%;
}

.star-rating[data-rate="3.6"]:after {
    width: 72%;
}

.star-rating[data-rate="3.5"]:after {
    width: 70%;
}

.star-rating[data-rate="3.4"]:after {
    width: 68%;
}

.star-rating[data-rate="3.3"]:after {
    width: 66%;
}

.star-rating[data-rate="3.2"]:after {
    width: 64%;
}

.star-rating[data-rate="3.1"]:after {
    width: 62%;
}

.star-rating[data-rate="3"]:after {
    width: 60%;
}

.star-rating[data-rate="2.9"]:after {
    width: 58%;
}

.star-rating[data-rate="2.8"]:after {
    width: 56%;
}

.star-rating[data-rate="2.7"]:after {
    width: 54%;
}

.star-rating[data-rate="2.6"]:after {
    width: 52%;
}

.star-rating[data-rate="2.5"]:after {
    width: 50%;
}

.star-rating[data-rate="2.4"]:after {
    width: 48%;
}

.star-rating[data-rate="2.3"]:after {
    width: 46%;
}

.star-rating[data-rate="2.2"]:after {
    width: 44%;
}

.star-rating[data-rate="2.1"]:after {
    width: 42%;
}

.star-rating[data-rate="2"]:after {
    width: 40%;
}

.star-rating[data-rate="1.9"]:after {
    width: 38%;
}

.star-rating[data-rate="1.8"]:after {
    width: 36%;
}

.star-rating[data-rate="1.7"]:after {
    width: 34%;
}

.star-rating[data-rate="1.6"]:after {
    width: 32%;
}

.star-rating[data-rate="1.5"]:after {
    width: 30%;
}

.star-rating[data-rate="1.4"]:after {
    width: 28%;
}

.star-rating[data-rate="1.3"]:after {
    width: 26%;
}

.star-rating[data-rate="1.2"]:after {
    width: 24%;
}

.star-rating[data-rate="1.1"]:after {
    width: 22%;
}

.star-rating[data-rate="1"]:after {
    width: 20%;
}

.star-rating[data-rate="0.9"]:after {
    width: 18%;
}

.star-rating[data-rate="0.8"]:after {
    width: 16%;
}

.star-rating[data-rate="0.7"]:after {
    width: 14%;
}

.star-rating[data-rate="0.6"]:after {
    width: 12%;
}

.star-rating[data-rate="0.5"]:after {
    width: 10%;
}

.star-rating[data-rate="0.4"]:after {
    width: 8%;
}

.star-rating[data-rate="0.3"]:after {
    width: 6%;
}

.star-rating[data-rate="0.2"]:after {
    width: 4%;
}

.star-rating[data-rate="0.1"]:after {
    width: 2%;
}

.star-rating[data-rate="0"]:after {
    width: 0%;
}

/* list---------------------------------------------------------- */
.list-light:before {
    font-family: 'Material Icons';
    content: '\ea24';
}

.list-check01:before {
    font-family: 'Material Icons';
    content: '\e834';
}

.list-check02:before {
    font-family: 'Material Icons';
    content: '\e92f';
}


.list-pen:before {
    font-family: 'Material Icons';
    content: '\e3c9';
}

.list-company:before {
    font-family: 'Material Icons';
    content: '\ea40';
}


/* btn---------------------------------------------------------- */

.btn01 {
    display: block;
    position: relative;
    width: 95%;
    padding: 1rem;
    margin: 2rem auto 1rem auto;
    background: #F96C00;
    box-shadow: 0 3px 0 0 rgba(198, 39, 39, 1);
    border-radius: 5px;
    font-weight: bold;
    font-size: 1.2rem;
    color: #fff !important;
    text-align: center;
    text-decoration: none;
    overflow: hidden;
}

.btn02 {
    display: block;
    position: relative;
    width: 95%;
    padding: 1rem;
    margin: 1rem auto 1rem auto;
    background: #fff;
    border: solid 1px #F96C00;
    box-shadow: 0 3px 0 0 rgba(198, 39, 39, 1);
    border-radius: 5px;
    font-weight: bold;
    font-size: 1.2rem;
    color: #F96C00 !important;
    text-align: center;
    text-decoration: none;
    overflow: hidden;
}

.shiny-btn::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: shiny01 3s ease-in-out infinite;
}

@-webkit-keyframes shiny01 {
    0% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0;
    }

    80% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0.5;
    }

    81% {
        -webkit-transform: scale(4) rotate(45deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(50) rotate(45deg);
        opacity: 0;
    }
}

/* pre---------------------------------------------------------- */

pre {
    margin: 3rem 1rem;
    padding: 1rem;
    background: #424242;
    color: #fff;
    font-size: .8rem;
    white-space: pre-wrap;
}

pre:before {
    font-family: 'Material Icons';
    content: '\e86f';
    background: #eee;
    display: block;
    width: 2rem;
    color: #C02252;
    text-align: center;
    margin-bottom: 1rem;
}

/* box---------------------------------------------------------- */

/* box01----------------------------- */
.box__01 {
    background-color: #fff;
    margin: 4rem 0 2rem 0;
    position: relative;
}

.box__01-label {
    font-size: .7rem;
    padding: .3rem;
    display: block;
    min-width: 20%;
    background: #312927;
    color: #fff;
    border-bottom: solid 1px #312927;
    text-align: center;
    position: absolute;
    top: -.7rem;
    left: -1px;
}

.box__01 .box__01-content {
    padding: 1.5rem 1rem 1rem 1rem;
    margin-bottom: 3rem;
    font-size: .8rem;
    font-weight: 500;
    background: #F1F5F9;
}

.box__01 .box__01-content ul {
    padding: 0;
    margin: 0;
}

.box__01 .box__01-content ul li {
    list-style-type: none;
    position: relative;
    padding-left: 1.5rem;
    font-size: .8rem;
    font-weight: 500;
    margin-bottom: .3rem;
}

.box__01 .box__01-content ul,
.box__01 .box__01-content ol {
    margin: 0;
    padding: 0 .5rem 0 1.5rem;
    margin: .5rem 0 0 0;
}

.box__01 .box__01-content ul li {
    position: relative;
    padding-left: .5rem;
    font-size: .8rem;
    font-weight: 500;
    margin-bottom: .3rem;
    list-style-type: none;
}

.box__01 .box__01-content ul li:before {
    vertical-align: middle;
    position: absolute;
    left: -1rem;
    width: 1.5rem;
    color: #009DF7;
}

.box__01 .box__01-content ul li:nth-last-child(),
.box__01 .box__01-content ol li:nth-last-child() {
    margin-bottom: 0;
}


.box__01 .box__01-content ol li {
    position: relative;
    padding-left: .5rem;
    font-size: .8rem;
    font-weight: 500;
    margin-bottom: .3rem;
    list-style-type: decimal-leading-zero;
}

.box__01 .box__01-content ol li::marker {
    font-weight: bold;
    color: #009DF7;
}




/* box02----------------------------- */
.box__02 {
    background-color: #fff;
    margin: 3rem 0;
    border: solid 3px #312927;
}

.box__02-label {
    color: #312927;
    font-weight: bold;
    font-size: 1rem;
    margin: 2rem 1rem 0 2rem;
    padding-bottom: .5rem;
    display: inline-block;
    border-bottom: solid 5px #FCDC0E;
    font-weight: bold;
}

.box__02 .box__02-content {
    padding: 1rem 2rem 2rem 2rem;
}


.box__02 .box__02-content ul,
.box__02 .box__02-content ol {
    padding: 0;
    margin: 0;
}

.box__02 .box__02-content ul li {
    list-style-type: none;
    position: relative;
    padding-left: 1.5rem;
    font-weight: 500;
}

.box__02 .box__02-content ul li:before {
    vertical-align: middle;
    position: absolute;
    left: 0;
    top: -.1rem;
    color: #009DF7;
    font-size: 1.2rem;
}

.box__02 .box__02-content ol li {
    margin-left: 2em;
    padding-left: 0.5em;
    list-style-type: decimal-leading-zero;

}

.box__02 .box__02-content ol li::marker {
    font-weight: bold;
    color: #009DF7;
}


/* box03----------------------------- */
.box__03 {
    background-color: #fff;
    margin: 4rem 0 2rem 0;
    position: relative;
}

.box__03-label {
    font-size: 1rem;
    padding: .5rem;
    display: block;
    width: 100%;
    background: #4C4745;
    color: #fff;
    border-bottom: solid 1px #4C4745;
    text-align: center;
    position: absolute;
    top: -1rem;
    left: 0;
}

.box__03 .box__03-content {
    padding: 2rem 1rem 1rem 1rem;
    margin-bottom: 3rem;
    border: solid 1px #312927;
}

.box__03-content-title {
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: .5rem;
}

.box__03 .box__03-content .table__scroll {
    margin: 0;
}

.box__03 .box__03-content ul {
    padding: 0;
    margin: 0;
}

.box__03 .box__03-content ol {
    margin: 0;
}

.box__03 .box__03-content ul li {
    list-style-type: none;
    position: relative;
    padding-left: 1.5rem;
    font-size: 1rem;
    font-weight: bold;
    margin-bottom: .5rem;
}

.box__03 .box__03-content ul li:before {
    vertical-align: middle;
    position: absolute;
    left: 0;
    width: 1.5rem;
    color: #009DF7;
}

.box__03 .box__03-content ul li:nth-last-child() {
    margin-bottom: 0;
}


.box__03 .box__03-content ol li {
    position: relative;
    padding-left: .5rem;
    font-size: 1rem;
    font-weight: bold;
    margin-bottom: .5rem;
    list-style-type: decimal-leading-zero;
}

.box__03 .box__03-content ol li::marker {
    font-weight: bold;
    color: #009DF7;
}


/* box04----------------------------- */
.box__04 {
    background-color: #efefef;
    margin: 3rem 2rem;
}

.box__04-label {
    color: #383838;
    font-weight: bold;
    font-size: .8rem;
    padding: 1rem;
    display: block;
    border-bottom: 1px solid #e4e4e4;
}

.box__04 .box__04-content {
    padding: 1rem;
    margin-bottom: 3rem;
    font-size: .8rem;
    font-weight: 500;
}

.box__04 .box__04-content ul {
    padding: 0;
    margin: 0;
}

.box__04 .box__04-content ul li {
    list-style-type: none;
    position: relative;
    padding-left: 1.5rem;
    font-size: .8rem;
    font-weight: 500;
    margin-bottom: .3rem;
}

.box__04 .box__04-content ul,
.box__04 .box__04-content ol {
    margin: 0;
    padding: 0 .5rem 0 1.5rem;
    margin: .5rem 0 0 0;
}

.box__04 .box__04-content ul li {
    position: relative;
    padding-left: .5rem;
    font-size: .8rem;
    font-weight: 500;
    margin-bottom: .3rem;
    list-style-type: none;
}

.box__04 .box__04-content ul li:before {
    vertical-align: middle;
    position: absolute;
    left: -1rem;
    width: 1.5rem;
}

.box__04 .box__04-content ul li:nth-last-child(),
.box__04 .box__04-content ol li:nth-last-child() {
    margin-bottom: 0;
}


.box__04 .box__04-content ol li {
    position: relative;
    padding-left: .5rem;
    font-size: .8rem;
    font-weight: 500;
    margin-bottom: .3rem;
    list-style-type: decimal-leading-zero;
}

.box__04 .box__04-content ol li::marker {
    font-weight: bold;
    color: #009DF7;
}


/* CTA-------------------------------------------------------------------------*/
.cta01 {
    margin: 80px 0 30px !important;
    position: relative;
}

.cta01__head {
    position: absolute;
    top: -5rem;
    left: 50%;
    display: inline-block;
    margin: 1.5em 0;
    padding: 7px 10px;
    width: 95%;
    color: #cc6600;
    font-size: 1rem;
    font-weight: bold;
    text-align: center;
    background: #FFF;
    border: solid 3px #cc6600;
    box-sizing: border-box;
    transform: translateX(-50%)
}

.cta01__head:before {
    content: "";
    position: absolute;
    bottom: -24px;
    left: 50%;
    margin-left: -15px;
    border: 12px solid transparent;
    border-top: 12px solid #FFF;
    z-index: 2;
}

.cta01__head:after {
    content: "";
    position: absolute;
    bottom: -30px;
    left: 50%;
    margin-left: -17px;
    border: 14px solid transparent;
    border-top: 14px solid #cc6600;
    z-index: 1;
}

.cta01 a {
    background: #E48500;
    border-bottom: solid 4px #cc6600;
    padding: 9px 5% 5px 5%;
    color: #fff !important;
    cursor: pointer;
    border-radius: 5px;
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1.5;
    width: 90%;
    margin: 0 auto;
    display: block;
    text-align: center;
}


/*CTA_ランキング---------------------------------------------------------- */
.box__ranking01 {
    margin-bottom: 2rem;
}

.box__ranking01_inner {
    padding: 1rem;
    background: #312927;
}

.box__ranking01_inner-content {}


.box__ranking01_inner .rating__area {
    margin-bottom: .5rem;
}

.box__ranking01_inner .number-rating {
    font-size: 1.2rem;
    color: #FFD908;
    margin-left: .5rem;
}

.box__ranking01_inner .star-rating {
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: #CCCCCC;
}

.box__ranking01_inner .star-rating:before,
.box__ranking01_inner .star-rating:after {
    content: '★★★★★';
    color: #ccc;
}

.box__ranking01_inner .star-rating:after {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #FFD908;
}


.box__ranking01_inner-title {
    font-size: 1.5rem;
    text-align: center;
    font-weight: bold;
    color: #fff;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    line-height: 1;
    border-bottom: solid 1px #efefef;
}

.box__ranking01_inner .title-caption {
    text-align: center;
    font-size: 1rem;
    font-weight: 700;
    display: block;
    margin: 0 0 .5rem 0;
    color: #fff;
}


.box__ranking01_inner__1st {
    border-left: solid 5px #FFD908;
}

.box__ranking01_inner__2nd {
    border-left: solid 5px #96DEF6;
}

.box__ranking01_inner__3rd {
    border-left: solid 5px #B68000;
}

.box__ranking01_inner__1st-title,
.box__ranking01_inner__2nd-title,
.box__ranking01_inner__3rd-title {
    font-size: 1.2rem;
    font-weight: bold;
    color: #fff;
    margin: 0 .5rem .7rem .5rem;
    padding-bottom: .5rem;
    border-bottom: solid 1px #A6A6A6;
}

.box__ranking01_inner__1st-title .num {
    color: #FFD908;
    font-size: 1.5rem;
    margin-right: .5rem;
}

.box__ranking01_inner__2nd-title .num {
    color: #96DEF6;
    font-size: 1.5rem;
    margin-right: .5rem;
}

.box__ranking01_inner__3rd-title .num {
    color: #B68000;
    font-size: 1.5rem;
    margin-right: .5rem;
}

.box__ranking01_inner__1st__content,
.box__ranking01_inner__2nd__content,
.box__ranking01_inner__3rd__content {
    display: -webkit-flex;
    display: flex;
    margin-bottom: 1rem;
}

.box__ranking01_inner__1st__content-img,
.box__ranking01_inner__2nd__content-img,
.box__ranking01_inner__3rd__content-img {
    max-width: 40%;
    margin: 0 .5rem;
}

.box__ranking01_inner__1st__content-img img,
.box__ranking01_inner__2nd__content-img img,
.box__ranking01_inner__3rd__content-img img {
    margin: 0 !important;
    width: 100%;
}

.box__ranking01_inner__1st__content__right,
.box__ranking01_inner__2nd__content__right,
.box__ranking01_inner__3rd__content__right {
    width: 100%;
}

.box__ranking01_inner__1st__content__right ul,
.box__ranking01_inner__2nd__content__right ul,
.box__ranking01_inner__3rd__content__right ul {
    padding: 0 .5rem 0 1.5rem !important;
    margin: 0 !important;
}

.box__ranking01_inner__1st__content__right ul li,
.box__ranking01_inner__2nd__content__right ul li,
.box__ranking01_inner__3rd__content__right ul li {
    color: #fff;
    padding: 0 !important;
}

.box__ranking01_inner__1st__content-btn,
.box__ranking01_inner__2nd__content-btn,
.box__ranking01_inner__3rd__content-btn {}

.box__ranking01_inner__1st__content-btn01,
.box__ranking01_inner__2nd__content-btn01,
.box__ranking01_inner__3rd__content-btn01 {
    display: block;
    position: relative;
    width: 100%;
    padding: .5rem;
    margin: 0 auto .5rem auto;
    background: #F96C00;
    box-shadow: 0 3px 0 0 rgba(198, 39, 39, 1);
    border-radius: 5px;
    font-weight: bold;
    font-size: .9rem;
    color: #fff !important;
    text-align: center;
    text-decoration: none;
    overflow: hidden;
}

.box__ranking01_inner__1st__content-btn02,
.box__ranking01_inner__2nd__content-btn02,
.box__ranking01_inner__3rd__content-btn02 {
    display: block;
    position: relative;
    width: 100%;
    padding: .5rem;
    margin: 0 auto .5rem auto;
    background: #fff;
    border: solid 1px #F96C00;
    box-shadow: 0 3px 0 0 rgba(198, 39, 39, 1);
    border-radius: 5px;
    font-weight: bold;
    font-size: .9rem;
    color: #F96C00 !important;
    text-align: center;
    text-decoration: none;
    overflow: hidden;
}

/*ランキング詳細---------------------------------------------------------- */

.ranking__detail__area {}

.ranking__detail__area__inner {}

.ranking__detail__area__inner h3 {
    margin: -4rem 0 1rem 2rem !important;
    border: none !important;
}

.ranking__detail__area__inner .rating__area {
    margin-bottom: 1.5rem;
}

.ranking__detail__area__inner .number-rating {
    font-size: 1.2rem;
    color: #FFD908;
    margin-left: .5rem;
}

.ranking__detail__area__inner .star-rating {
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: #CCCCCC;
}

.ranking__detail__area__inner .star-rating:before,
.ranking__detail__area__inner .star-rating:after {
    content: '★★★★★';
    color: #ccc;
}

.ranking__detail__area__inner .star-rating:after {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #FFD908;
}

.ranking__detail__area__inner .thumb_comp {
    width: 100%;
    margin-bottom: 1rem !important;
}

.ranking__detail__area__inner-num {
    position: relative;
    z-index: 0;
    left: -1rem;
    top: -1rem;
    display: flex;
}

.ranking__detail__area__inner-num-1st,
.ranking__detail__area__inner-num-2nd,
.ranking__detail__area__inner-num-3rd,
.ranking__detail__area__inner-num-4th,
.ranking__detail__area__inner-num-5th {
    position: absolute;
    top: .1rem;
    left: .5rem;
    color: #fff;
    font-weight: 700;
    font-size: 1.3rem;
}

#rank1.ranking__detail__area .ranking__detail__area__inner-num:before {
    display: inline-block;
    width: 0;
    height: 0;
    border-width: 3rem 3rem 0 0;
    border-style: solid;
    border-color: #FFD908 transparent transparent;
    content: "";
}

#rank2.ranking__detail__area .ranking__detail__area__inner-num:before {
    display: block;
    width: 0;
    height: 0;
    border-width: 50px 50px 0 0;
    border-style: solid;
    border-color: #96DEF6 transparent transparent;
    content: "";
}

#rank3.ranking__detail__area .ranking__detail__area__inner-num:before {
    display: block;
    width: 0;
    height: 0;
    border-width: 50px 50px 0 0;
    border-style: solid;
    border-color: #B68000 transparent transparent;
    content: "";
}

#rank4.ranking__detail__area .ranking__detail__area__inner-num:before,
#rank5.ranking__detail__area .ranking__detail__area__inner-num:before {
    display: block;
    width: 0;
    height: 0;
    border-width: 50px 50px 0 0;
    border-style: solid;
    border-color: #ccc transparent transparent;
    content: "";
}

#rank1.ranking__detail__area {
    border: solid 3px #FFD908;
    padding: 1rem;
}

#rank2.ranking__detail__area {
    border: solid 3px #96DEF6;
    padding: 1rem;
}

#rank3.ranking__detail__area {
    border: solid 3px #B68000;
    padding: 1rem;
}

#rank4.ranking__detail__area,
#rank5.ranking__detail__area {
    border: solid 3px #ccc;
    padding: 1rem;
}



.ranking__detail__area__inner-num h3 {
    margin: 0 !important;
    border: none !important;
}

.ranking__detail__area__inner .box__03 {
    margin-top: .5rem;
}

.ranking__detail__area__inner .box__03 .box__03-content {
    margin-bottom: 0;
}

#rank2.ranking__detail__area,
#rank3.ranking__detail__area,
#rank4.ranking__detail__area,
#rank5.ranking__detail__area {
    margin-top: 3rem;
}


/*業者一覧---------------------------------------------------------- */
.companylist {}

.companylist__contents {
    border: solid 2px #ccc;
    padding: 1rem;
    margin-bottom: 2rem;
}

.companylist__contents h3 {
    margin: 0 0 .5rem 0 !important;
    border: none !important;
    padding: 0 0 .5rem 0 !important;
}

.companylist__contents h4 {
    margin: .5rem 0 !important;
    border: none !important;
    padding: 0 !important;

}


.companylist__contents .rating__area {
    margin-bottom: 1.5rem;
}

.companylist__contents .number-rating {
    font-size: 1.2rem;
    color: #FFD908;
    margin-left: .5rem;
}

.companylist__contents .star-rating {
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: #CCCCCC;
}

.companylist__contents .star-rating:before,
.companylist__contents .star-rating:after {
    content: '★★★★★';
    color: #ccc;
}

.companylist__contents .star-rating:after {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #FFD908;
}

.companylist__contents img {
    margin-bottom: 1rem !important;
}

.companylist__contents .box__03 {
    margin: 1rem 0 !important;
}

.companylist__contents .box__03 .box__03-content {
    margin: 0 !important;
}



/*業者詳細---------------------------------------------------------- */

.company_detail__rate.rating__area {
    border: solid 1px #000;
    display: inline-flex;
}

.company_detail__rate .rating__area-label {
    background: #000;
    color: #fff;
    padding: .3rem;

}

.company_detail__rate .rating__area-rate {
    padding: .3rem;
}

.company_detail .rating__area {
    margin-bottom: 1.5rem;
}


.company_detail .number-rating {
    font-size: 1.2rem;
    color: #FFD908;
    margin-left: .3rem;
    font-weight: bold;
}

.company_detail .star-rating {
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: #CCCCCC;
}

.company_detail .star-rating:before,
.company_detail .star-rating:after {
    content: '★★★★★';
    color: #ccc;
}

.company_detail .star-rating:after {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #FFD908;
}

/* 会話風 -----------------------------------------------*/
.review_box {
    width: 100%;
    margin: 1.5em 0;
    overflow: hidden;
}

.review_box .review_box__icon {
    float: left;
    margin-right: -90px;
    width: 80px;
}

.review_box .review_box__icon span {
    font-size: 3rem;
}

.review_box .review_box__chat {
    width: 100%;
}

.review_box__chat_inner {
    display: inline-block;
    position: relative;
    margin: 0 0 0 4rem;
    padding: 1rem;
    border-radius: 12px;
    background: #e7f3ff;
    width: 75%;
}

.review_box__chat_inner:after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 1rem;
    left: -1.5rem;
    border: 12px solid transparent;
    border-right: 12px solid #e7f3ff;
}

.review_box__chat_inner.bad {
    background: #ffeceb;
}

.review_box__chat_inner.bad::after {
    border-right: 12px solid #ffeceb;
}

.review_box__chat_inner p {
    font-size: .9rem;
}

.review_box .rating__area {
    margin-bottom: .5rem;
}

.review_box .number-rating {
    font-size: 1.2rem;
    color: #f5bb1a;
    margin-left: .5rem;
}

.review_box .star-rating {
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: #CCCCCC;
}

.review_box .star-rating:before,
.review_box .star-rating:after {
    content: '★★★★★';
    color: #ccc;
}

.review_box .star-rating:after {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #FFD908;
}

.review_box .ref {
    text-align: right;
    font-size: .8rem;
}


/* table ---------------------------------------------------------- */

.content__area__inner .table__normal {
    margin: 3rem auto;
}

.content__area__inner table {
    padding: 0;
    width: 100%;
    table-layout: fixed;
    line-height: 1.5;
}

.content__area__inner table tr {
    border: 1px solid #e4e4e4;
}

.content__area__inner table th {
    padding: .5rem;
    border: 1px solid #84807f;
    font-size: .85rem;
}

.content__area__inner table td {
    padding: .5rem;
    border-right: 1px solid #e4e4e4;
    font-size: .85rem;
}

.content__area__inner table tr:nth-child(odd) td {
    background: #f8f8f8;
}

.content__area__inner table th {
    background: #4c4745;
    vertical-align: middle;
    color: #fff;
}

.content__area__inner table thead th {
    text-align: center;
}

.content__area__inner table tbody th {
    padding: .5rem;
}


.content__area__inner table ul {
    width: 100%;
    border: none;
    padding: 0;
    margin: 0;
}

.content__area__inner table ul li {
    font-size: .7rem;
    line-height: 1.2;
}

.content__area__inner .note {
    color: #999;
    font-size: .8rem;
    line-height: 1.3;
    margin: .5rem 0 1rem 0;
}


/* scroll table---------------------------------------------------------- */
.content__area__inner .table__scroll {
    overflow-x: scroll;
    margin: 3rem 0;
}

.content__area__inner .table__scroll table {
    width: 100%;
    border-collapse: collapse;
}

.content__area__inner .table__scroll table tr th,
.content__area__inner .table__scroll table tr td {
    padding: .25rem;
    width: 10rem;
    text-align: center;
    font-size: .7rem;
    vertical-align: middle;
}

.table__scroll-label__service img {
    margin-bottom: 1rem !important;
}

.table__scroll__service-name {
    font-size: .7rem;
    font-weight: bold;
}

.table__scroll-btn {
    background: #E48500;
    border-bottom: solid 4px #cc6600;
    padding: .5rem .5rem .3rem .5rem;
    color: #fff !important;
    cursor: pointer;
    border-radius: 5px;
    font-size: .85rem;
    line-height: 1.5;
    width: 90%;
    margin: 0 auto;
    display: inline-block;
}

.table__scroll-btn2 {
    border: solid 1px #cc6600;
    padding: .5rem;
    color: #cc6600 !important;
    cursor: pointer;
    border-radius: 5px;
    font-size: .85rem;
    line-height: 1.5;
    width: 90%;
    margin: 0 auto;
    display: inline-block;
}

.content__area__inner .table__scroll table tr th .content__area__inner .table__scroll table thead tr th.table__scroll-label {
    position: sticky;
    left: -1px;
    background: #efefef;
}

.content__area__inner .table__scroll .table__scroll-label {
    position: sticky;
    left: -1px;
    width: 8rem;
    min-width: 6rem;
    font-size: .7rem;
    text-align: left;
}


.content__area__inner ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.content__area__inner ::-webkit-scrollbar-thumb {
    background: #333;
    border-radius: 8px;
}

.content__area__inner .table__scroll table tr th.rank1 {
    background: #B49B33;
    color: #fff;
}

.content__area__inner .table__scroll table tr th.rank2 {
    background: #A6A6A6;
    color: #fff;
}

.content__area__inner .table__scroll table tr th.rank3 {
    color: #fff;
    background: #AB7942;
}


/*タブ切替え---------------------------------------------------------- */
.tab-wrap {
    background-color: #fff;
    width: 100%;
    margin: 1rem auto;
}

.tab-wrap ul {
    display: flex;
    margin: 0 !important;
    padding: 0 !important;
}

.tab-wrap ul li {
    list-style: none !important;
}

.tab-btn {
    width: calc(100%/2);
    padding: .5rem !important;
    background-color: #efefef;
    line-height: 1.3;
    font-size: .8rem;
    text-align: center;
    color: #fff;
    display: block;
    float: left;
    text-align: center;
    font-weight: bold;
    transition: all 0.2s ease;
    border-bottom: solid 1px #ccc;
}

.tab-wrap ul li:nth-child(1) {
    border-top: solid 5px #61A5FA;
    border-left: solid 1px #ccc;
    border-right: solid 1px #ccc;
    opacity: 0.5;
    color: #61A5FA;
}

.tab-wrap ul li:nth-child(2) {
    border-top: solid 5px #EE4444;
    border-right: solid 1px #ccc;
    opacity: 0.5;
    color: #EE4444;
}

.tab-btn.show {
    color: #fff;
    opacity: 1.0 !important;
    background: #fff;
    border-bottom: none;

}

.tab-contents {
    display: none;
}

.tab-contents p {
    font-size: .8rem;
}

.tab-contents:nth-child(2) {
    border-left: solid 1px #ccc;
    border-right: solid 1px #ccc;
    border-bottom: solid 1px #ccc;
    padding: 1rem;
    clear: both;
    overflow: hidden;
}

.tab-contents:nth-child(3) {
    border-left: solid 1px #ccc;
    border-right: solid 1px #ccc;
    border-bottom: solid 1px #ccc;
    padding: 1rem;
    clear: both;
    overflow: hidden;
}

.tab-contents.show {
    display: block;
    padding: 20px;
}

.tab-wrap .ref {
    margin: 1rem 0 0 0;
    font-size: .7rem;
}


/*アコーディオン---------------------------------------------------------- */
.accordion {
    border: solid 1px #e4e4e4;
    background-color: #f9f9f9;
    border-radius: 4px;
    color: #009DF7;
    cursor: pointer;
    padding: .5rem;
    width: 100%;
    text-align: center;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
}

.accordion.active,
.accordion:hover {
    background-color: #ddd;
}

.accordion:after {
    content: '\002B';
    color: #777;
    font-weight: bold;
    float: right;
    margin-left: 5px;
}

.accordion.active:after {
    content: "\2212";
}

.accordion__content {
    padding: 0;
    background-color: white;
    display: none;
    overflow: hidden;
}



/* 記事内メニュー*/
.menu__postin {
    border: solid 1px #ccc;
    padding: 3%;
}

.menu__postin-title {
    display: block;
    text-align: center;
    font-weight: bold;
}

.menu__postin__inner {
    margin-top: 3%;

    font-size: .85rem;
    line-height: 1.3;
}

.menu__postin-1 {
    border-radius: 5px;
    display: block;
    text-align: center;
    padding: 1rem;
    border: solid 2px #00a022;
    color: #00a022 !important;
    line-height: 1.3;
    margin-bottom: 1rem;
    font-weight: bold;
    position: relative;
}

.menu__postin-1::before {
    content: '';
    width: 6px;
    height: 6px;
    border: 0;
    border-bottom: solid 2px #00a022;
    border-right: solid 2px #00a022;
    position: absolute;
    top: 50%;
    right: 6%;
    margin-top: -6px;
    transform: rotate(45deg);
}

.menu__postin-2 {
    border-radius: 5px;
    display: block;
    text-align: center;
    padding: 1rem;
    border: solid 2px #00a022;
    color: #00a022 !important;
    line-height: 1.3;
    margin-bottom: 1rem;
    font-weight: bold;
}



/* 各話動画リスト---------------------------------------------------------- */

.movie__site__list {
    width: 95%;
    background: #f7f7f7;
    margin: 0 auto;
    padding: 1rem 1rem 1.3rem 1rem;
}

.movie__site__list a {
    font-size: .85rem;
    display: inline-block;
    width: 20%;
    text-align: center;
    border: solid 1px #00AFEC;
    border-radius: 5px;
}

/* 注意書きエリア---------------------------------------------------------- */
.attention {
    border: solid 2px #e72705;
    padding: 1rem;
    color: #e72705;
    font-size: .85rem;
    line-height: 1.3;
}


/* ranking---------------------------------------------------------- */
.ranking__area {
    margin: 30px 0;
}

.ranking__area #toc_container {
    display: none;
}

.ranking__area01 {
    border: 1px solid #dddddd;
    border-radius: 5px;
    padding: 2%;
    margin-bottom: 15px;
}

.ranking__area01 h3 {
    border: none !important;
    margin: 0 !important;
}

.ranking__area__inner-title {
    font-size: 1.3rem;
    font-weight: bold;
    margin-bottom: .5rem;
}

.ranking__area__inner-title-no1 {
    font-size: 1.8rem;
    color: #d3b134;
    font-weight: bold;
    margin-right: 1rem;
}

.ranking__area__inner-title-no2 {
    font-size: 1.8rem;
    color: #adb2b9;
    font-weight: bold;
    margin-right: 1rem;
}

.ranking__area__inner-title-no3 {
    font-size: 1.8rem;
    color: #b78d7a;
    font-weight: bold;
    margin-right: 1rem;
}

.ranking__area__inner__contents {
    display: -webkit-flex;
    display: flex;
}

.ranking__area__inner__contents__feature {
    margin-left: 1rem;
    width: 70%;
}

.ranking__area__inner__contents__feature-rate {
    color: #f69d03;
    font-size: 1.5rem;
}

.ranking__area__inner__contents-img {
    width: 30%;
}

.ranking__area01 ul {
    border: none !important;
    padding: .5rem 0 !important;
    margin: 0 !important;
    width: 100% !important;
}

.ranking__area01 ul li {
    list-style: none !important;
    font-size: .8rem;
    padding: 0 0 .2rem 0 !important;

}

.ranking__area__inner__contents__feature-info table {
    margin: 0 !important;
}

.ranking__area__inner__contents__readmore {
    margin: .2rem 0 .5rem 0;
    font-size: .8rem;
    display: block;
}

.ranking__area__inner__contents__feature-info table th {
    margin: 0 !important;
    padding: .2rem !important;
    text-align: left;
}

.ranking__area__inner__contents__feature-info table td {
    margin: 0 !important;
    padding: .2rem !important;
}

.ranking__area__inner__contents__btn {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}

.ranking__area__inner__contents__btn-tel {
    display: inline-block;
    text-align: center;
    background: #FF931E;
    border-radius: 5px;
    padding: .5rem;
    color: #fff !important;
    font-weight: bold;
    width: 32%;
    font-size: 1rem;
}

.ranking__area__inner__contents__btn-telsub {
    background: #fff;
    text-align: center;
    display: block;
    color: #FF931E;
    margin-top: .3rem;
    padding: .2rem;
    font-size: .8rem;
}

.ranking__area__inner__contents__btn-line {
    display: inline-block;
    text-align: center;
    background: #4CC764;
    border-radius: 5px;
    padding: .5rem;
    color: #fff !important;
    font-weight: bold;
    width: 33%;
    font-size: 1rem;
}

.ranking__area__inner__contents__btn-linesub {
    background: #fff;
    text-align: center;
    display: block;
    color: #4CC764;
    margin-top: .3rem;
    padding: .2rem;
    font-size: .8rem;
}

.ranking__area__inner__contents__btn-site {
    display: inline-block;
    text-align: center;
    background: #008db7;
    border-radius: 5px;
    padding-top: 1.5rem;
    color: #fff !important;
    font-weight: bold;
    width: 32%;
    font-size: 1rem;
    display: table-cell;
    vertical-align: middle;
}



.ranking__area__attention {
    background: #efefef;
    padding: 2%;
    font-size: .8rem;
}

.ranking__area__attention-title {
    font-weight: bold;
    margin-bottom: .5rem;
    display: block;
}


/* POINT */
.point01 {
    position: relative;
    margin: 60px 0;
    padding: 2%;
    border: 3px solid #000;
}

.point01:before {
    background: #000;
    position: absolute;
    content: 'POINT';
    color: #ffdb00;
    font-weight: 900;
    left: -3px;
    bottom: 100%;
    border-radius: 5px 5px 0 0;
    padding: 5px 20px;
    font-size: 1rem;
}

.point01 ul {
    border: none !important;
    margin: 0 0 0 25px !important;
    padding: 0 !important;
}


.point01__area {}


/* RAYOUT---------------------------------------------------------- */
.row4 {}

.row4__contents {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    /* Safari etc. */
    -ms-flex-wrap: wrap;
    /* IE10        */
    flex-wrap: wrap;
}

.row4__contents a {
    font-size: .8rem;
    width: 24%;
    text-align: center;
    border: solid 1px #efefef;
    margin-bottom: .5rem;
}

.row4__contents a>* {
    padding: .5rem;
}

.row4__contents__box {}

.row4__contents__box img {
    margin-bottom: .5rem !important;
}


/* Popular post ---------------------------------------------------------- */
.popular-posts img {
    width: 75px;
    height: auto;
}

/* postlist---------------------------------------------------------- */
.postlist01 {
    width: 1080px;
    margin: 0 auto 2rem auto;
}

.postlist01__contents {
    display: flex;
}

.postlist01__contents img {
    height: auto;
}

.postlist01__contents a:first-child {
    width: 97%;
    margin-right: 1rem;
}



.top_genre_right_post {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.top_genre_right_post a:first-child {
    width: 46%;
    margin-right: 1rem;
    margin-bottom: 1rem;
}

.top_genre_right_post a {
    width: 46%;
}

.top_genre_right_post a:nth-child(2) {
    width: 46%;
    margin: 0;
    padding: 0;
}

.top_genre_right_post a:nth-child(3) {
    width: 46%;
    margin-right: 1rem;
}







/* toc -----------------------------------------------*/
#toc_container {
    width: 100% !important;
    margin: 3rem auto;
    background: #f5f4f4;
}

.toc_title {
    text-align: center;
    font-weight: bold;
    padding: .5rem 0;
}



#toc_container ul.toc_list {
    padding: 1rem 1rem 1rem 3rem;
    border-top: solid 1px #e4e4e4;
}

#toc_container ul {
    border: none;
    width: 100%;
    padding: 0;
    margin: 0;
}

#toc_container ul li {
    font-weight: bold;
    list-style: none;
    padding: 0;
    font-size: .9rem;
    list-style-type: decimal;
}

#toc_container ul li a {
    color: #312927;
}


#toc_container ul li ul li {
    font-weight: normal;
    font-size: .8rem;
    list-style: none;
}

#toc_container ul li ul li a {
    display: block;
    margin: .5rem 0;
    color: #312927;
}

#toc_container ul li ul li:last-child {
    border-bottom: solid 1px #e4e4e4;
    margin-bottom: 1rem;
}


#toc_container ul li ul li ul li a {
    border-bottom: none;
    display: block;
}

#toc_container a {}



/* populrar post -----------------------------------------------*/

.widget.popular-posts ul {
    border-right: solid 1px #e7e7e7;
    border-left: solid 1px #e7e7e7;
    border-bottom: solid 1px #e7e7e7;
    padding: 1rem;
}


.widget.popular-posts ul li {
    padding-bottom: 1rem;
    border-bottom: dotted 1px #e7e7e7;
}

.widget.popular-posts ul li:last-child {
    border: none;
    padding-bottom: 0;
}

.widget.popular-posts ul li a {
    position: relative;
    margin-left: 1rem;
    display: block;
    color: #312927 !important;
}

.widget.popular-posts ul li a:before {
    font-family: 'Material Icons';
    content: '\e1c4';
    vertical-align: middle;
    position: absolute;
    left: -1rem;
}


/* recent post -----------------------------------------------*/
.rpwwt-widget ul {
    border-right: solid 1px #e7e7e7;
    border-left: solid 1px #e7e7e7;
    border-bottom: solid 1px #e7e7e7;
    padding: 1rem !important;
}

.rpwwt-widget ul li {
    padding-bottom: 1rem;
    border-bottom: dotted 1px #e7e7e7;
}

.rpwwt-widget ul li:last-child {
    border: none;
    padding-bottom: 0;
}

.rpwwt-widget ul li a {
    position: relative;
    margin-left: 1rem;
    display: block;
    color: #312927 !important;
}

.rpwwt-widget ul li a:before {
    font-family: 'Material Icons';
    content: '\e1c4';
    vertical-align: middle;
    position: absolute;
    left: -1rem;
}