/*
Theme Name: 3s
Theme URI:
Author: 3s
Description:
Version: 1.0
Text Domain: 3s
*/


/*==================================================================================================
* - [0]初期化
===================================================================================================*/
*, *:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}
html {
    scroll-behavior: smooth;
}
html, body {
    margin: 0;
}
figure {
    line-height: 0;
}
img {
    max-width: 100%;
    width: 100%;
    height: auto;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
a {
    color: #057cd8;
    word-break: break-all;
    text-decoration: underline;
}
a:hover {
    color: #04c1e3;
}
strong {
    font-weight: bold;
}
small {
    font-size: 85%;
}
h1,h2,h3,h4,h5,h6 {
    font-weight: bold;
}
h1 {
    font-size: 1.7rem;
}
h2 {
    font-size: 1.5rem;
    line-height: 1.8;
}
h3 {
    font-size: 1.4rem;
    line-height: 1.7;
}
h4 {
    font-size: 1.3rem;
}
h5 {
    font-size: 1.2rem;
}
h6 {
    font-size: 1.1rem;
}
p {    
    font-size: 1rem;
}
table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    text-align: left;
}
tbody th {
    background: #f0f3f7;
}
tbody td {
    background: #fff;
    line-height: 1.5;
}
thead th {
    background: #f1f1f1;
}
th, td {
    padding: 10px;
}
::selection {
    background: #04c1e34d;
}
::-moz-selection {
    background: #04c1e34d;
}



/*==================================================================================================
* - [1]body
===================================================================================================*/
body {
    background: #f9f9f9;
    color: #333;
    font-size: 16px;
    font-weight: 400;
    font-family: "メイリオ",Meiryo,sans-serif;
    font-variant-ligatures: none;
    line-height: 1.9;
}

.btn a {
    display: block;
    width: 85%;
    max-width: 400px;
    background: #04c1e3;
    border: 1px solid #04c1e3;
    box-shadow: 0 3px 0 #0092bd;
    border-radius: 2px;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    margin: 0 auto;
}
.btn.big_b a {
    font-size: 1.2rem;
    font-weight: bold;
    padding: 10px 0;
    margin: 20px auto 10px;
}
.btn.big_b.ylw a {
    background: #fff700;
    border: 1px solid #fff700;
    box-shadow: 0 3px 0 #a7a100;
    color: #333;
}
.btn a:hover {
    -webkit-transform: translate3d(0px, 3px, 1px) !important;
    transform: translate3d(0px, 3px, 1px) !important;
    box-shadow: none !important;
}

.btn_cta {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    padding: 15px 10px;
}
.btn_cta a {
    display: block;
    width: 47%;
    border-radius: 2px;
    color: #fff;
    font-size: 1.2rem;
    font-weight: bold;
    text-align: center;
    line-height: 1.6;
    padding: 10px 0;
    margin: 0 auto;
}
.btn_cta a small {
    display: block;
    font-size: 0.86rem;
}
.tel_cta {
    background: #f57945;
    border: 1px solid #f57945;
    box-shadow: 0 3px 0 #e46631;
}
.line_cta {
    background: #00c300;
    border: 1px solid #00c300;
    box-shadow: 0 3px 0 #009400;
}
.btn_cta a:hover {
    -webkit-transform: translate3d(0px, 3px, 1px);
    transform: translate3d(0px, 3px, 1px);
    box-shadow: none;
}
.sharpBefore:before {
    content: '#';
    color: #04c1e3;
}

._shiny {
    position: relative;
    overflow: hidden;
    transition: 300ms;
}
._shiny::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #b5e7ff;
    transition: 300ms;
    animation: shinyshiny 2.5s ease-in-out infinite;
}
._shiny:hover {
    -webkit-transform: translateY(3px);
}
@-webkit-keyframes shinyshiny {
    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; }
}

.searchbox {
    width: 100%;
    background: #fff;
    border: 1px solid #efefef;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    padding: 15px 20px 25px;
    margin: 0 0 20px;
}
.searchbox p {
    font-size: 0.86rem;
    font-weight: bold;
    margin: 0 0 3px;
}
.searchbox p i {
    color: #04c1e3;
}
.searchbox form {
    display: flex;
    justify-content: space-between;
}
.searchbox form select, .kv_search form select {
    width: 35%;
    font-size: 0.86rem;
    padding: 15px;
    margin: 0;
}
.searchbox form select:hover, .kv_search form select:hover {
    opacity: 0.6;
    transition: 0.2s;
}
.searchbox form input[type="submit"], .kv_search form input[type="submit"] {
    cursor: pointer;
    width: 25%;
    background: #FEDB3A;
    border: 1px solid #FEDB3A;
    border-radius: 10px;
    box-shadow: 0 5px 0 rgba(0,0,0,0.05);
    color: #333;
    font-size: 0.86rem;
    margin: 0;
    padding: 0;
}
.searchbox form input[type="submit"]:hover , .kv_search form input[type="submit"]:hover {
    opacity: 0.6;
    transition: 0.2s;
}


input[type="text"], input[type="email"], input[type="tel"] {
    width: 100%;
    max-width: 500px;
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 5px;
    box-shadow: 0 5px 15px -7px rgb(0 0 0 / 5%);
    font-size: 0.86rem;
    padding: 15px;
}

input[type="text"],::placeholder {
    color: #b7b7b7;
}
textarea {
    width: 100%;
    max-width: 500px;
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 5px;
    box-shadow: 0 5px 15px -7px rgb(0 0 0 / 5%);
    font-size: 0.86rem;
    padding: 15px;
}
input[type="submit"] {
    display: block;
    width: 100%;
    max-width: 300px;
    background: #04c1e3;
    border-radius: 30px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 10%);
    border: 1px solid #04c1e3;
    color: #fff;
    font-size: 0.96rem;
    font-weight: bold;
    text-align: center;
    padding: 15px 0;
    margin: 0 auto;
}
select {
    min-width: 150px;
    background: #fff;
    border: 2px solid #efefef;
    border-radius: 5px;
    box-shadow: 0 5px 15px -7px rgb(0 0 0 / 5%);
    outline: none;
    color: #555;
    font-weight: bold;
    padding: 15px;
    cursor: pointer;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
}
:focus-visible {
    border: 2px solid #04c1e3;
}

form dl {
    margin-bottom: 15px;
}




.review-controls {
    margin-bottom: 20px;
}
.review-sort {
    margin-bottom: 10px;
}
.review-sort select {
    padding: 8px 10px;
}
.review-filter {
    margin: 0 0 15px;
}
.review-filter span {
    cursor: pointer;
    display: block;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 20px;
    font-size: 0.8rem;
    text-align: center;
    padding: 3px 12px;
}
.filter-options input[type="checkbox"]:checked + span {
    background: #eaf3ff;
    border: 1px solid #eaf3ff;
    color: #0b57d0;
}
.filter-options {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 7px;
}
.filter-options label {
    border-radius: 20px;
}
.filter-options label:hover {
    background: #efefef;
}
.filter-options input[type="checkbox"] {
    display: none;
}
.review-item {
    transition: all 0.3s ease;
}
.review-hidden {
    display: none !important;
}
.highlight-option {
    background-color: #fffdb1;
    color: #232323;
    font-weight: bold;
    padding: 0 5px;
}


dl.wpcf7-option span.wpcf7-form-control.wpcf7-checkbox {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
dl.wpcf7-option span.wpcf7-form-control.wpcf7-checkbox span.wpcf7-list-item {
    width: 20%;
}
form dl .wpcf7-list-item input[type="checkbox"] {
    display: none;
}
form dl input[type="checkbox"]:checked + span.wpcf7-list-item-label {
    background: #04c1e3;
    border-radius: 1px;
    border: none;
    color: #fff;
    transition: 0.2s;
}


form dl .wpcf7-form-control.wpcf7-radio {
    display: flex;
    border: 1px solid #e9e9e9;
    border-radius: 5px;
    box-shadow: 0 5px 15px -7px rgb(0 0 0 / 5%);
}
form dl .wpcf7-list-item {
    width: 100%;
    display: block;
    text-align: center;
    margin: 0;
}
form dl .wpcf7-list-item input[type="radio"] {
    display: none;
}
form dl .wpcf7-list-item-label {
    cursor: pointer;
    display: block;
    background: #fdfdfd;
    border-right: 1px solid #e3e3e3;
    font-size: 0.86rem;
    padding: 7px 0;
}
form dl .wpcf7-list-item.last span.wpcf7-list-item-label {
    border: none;
}
form dl input[type="radio"]:checked + span.wpcf7-list-item-label {
    background: #04c1e3;
    border-radius: 1px;
    border: none;
    color: #fff;
    transition: 0.2s;
}

#entry-content form dl dt p {
    font-size: 0.9rem;
    font-weight: bold;
    margin: 0;
}
#entry-content form dl dt span {
    display: inline-block;
    border-radius: 5px;
    font-size: 10px;
    vertical-align: middle;
    padding: 0 5px;
    margin: 0 0 2px 3px;
}
span.form-label_required {
    background: #ff5252;
    color: #fff;
}
form.wpcf7-form.init {
    max-width: 600px;
    background: #fff;
    border: 3px solid #f3f3f3;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    border-radius: 5px;
    padding: 30px 35px;
    margin: 0 auto 50px;
}
#entry-content.page h1 {
    text-align: center;
    margin: 0 0 30px;
}
#entry-content.page h1:after {
    content: "";
    display: block;
    height: 5px;
    width: 50px;
    background: #04c1e3;
    border-radius: 7px;
    margin: 0 auto;
}




@media (max-width: 640px) {
    body {
        font-family: "Helvetica Neue",
        Arial,
        "Hiragino Kaku Gothic ProN",
        "Hiragino Sans",
        Meiryo,
        sans-serif;
    }
    h1 {
        font-size: 1.4rem;
    }
    h2 {
        font-size: 1.3rem;
    }
    h3 {
        font-size: 1.2rem;
    }
    h4 {
        font-size: 1.1rem;
    }
    h5 {
        font-size: 1rem;
    }
    h6 {
        font-size: 0.96rem;
    }
    p {
        font-size: 1rem;
        line-height: 1.9;
    }    
    .btn_cta a {
        width: 100%;
        font-size: 1rem;
        margin: 0 auto 10px;
    }    
    .btn_cta a small {
        font-size: 0.76rem;
    }
    form.wpcf7-form.init {
        padding: 20px;
    }
    form dl .wpcf7-list-item-label {
        font-size: 0.76rem;
    }
    .searchbox {
        width: 100%;
        background: #f9f9f9;
        border: none;
        border-radius: 0;
        box-shadow: none;
        padding: 15px 0 20px;
        margin: 0;
    }
    .searchbox p {
        font-size: 0.8rem;
    }
    .searchbox form {
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .searchbox form select, .kv_search form select {
        width: 37%;
        min-width: inherit;
        font-size: 0.76rem;
        padding: 12px;
        margin: 0;
    }
    .searchbox form input[type="submit"], .kv_search form input[type="submit"] {
        width: 22%;
        font-size: 0.76rem;
        padding: 0;
        margin: 0;
    }

}




/*==================================================================================================
* - [2]header
===================================================================================================*/
#header {
    width: 100%;
    background-color: #fff;
}
.toptxt {
}
.toptxt p {
    max-width: 1000px;
    font-size: 0.6rem;
    text-align: right;
    line-height: 1;
    padding: 3px 0 5px;
    margin: 0 auto;
}
.hero {
    overflow: hidden;
    max-width: 1080px;
    padding: 10px 0;
    margin: 0 auto;
}
.hero .logo {
}
.hero .logo a {
    display: block;
    width: fit-content;
    line-height: 1;
    padding: 0 15px;
}
.hero .logo a img {
    display: block;
    max-width: 320px;
}
.hero .logo p {
    display: inline;
    font-size: 0.76rem;
    line-height: 1.5;
    margin-left: 25px;
    padding: 20px 0 0;
}

.page-template-template .hero .logo a {
    margin: 0 auto;
}
.page-template-template .hero .logo a img {
    margin: 0 auto;
}
.page-template-page-ranking .hero .logo a {
    margin: 0 auto;
}
.page-template-page-ranking .hero .logo a img {
    margin: 0 auto;
}
.hero .rightbox {
    float: right;
    padding: 20px 0 0;
}
.hero .toplinks {
    display: flex;
}
.hero .toplinks li {
    width: 130px;
}
.hero .toplinks li a {
    display: block;
    background-color: #04c1e3;
    border-bottom: 2px solid #ce3112;
    border-radius: 50px;
    color: #fff;
    font-size: 0.8rem;
    text-align: center;
    text-decoration: none;
    padding: 7px 0;
    margin: 0 0 0 10px;
}
body.home .hero {
    max-width: 1000px;
    padding: 0.3% 2%;
}
body.home .hero .logo {
    display: block;
    float: inherit;
    line-height: 1;
}


/*= navigation
============================================================*/
#gmenu {
    background-color: #ffffff;
    border-top: 1px dashed #eaeaea;
    border-bottom: 2px solid #e8e8e8;
}
#gmenu ul {
    display: flex;
    max-width: 1080px;
    margin: 0 auto;
}
#gmenu li {
    width: 100%;
    text-align: center;
}
#gmenu li a {
    display: block;
    color: #444;
    font-size: 1rem;
    font-weight: bold;
    text-decoration: none;
    padding: 12px 0;
}
#gmenu li a:hover {
    color: #04c1e3;
}
#gmenu li a i{
    margin-right: 5px;
}
#gmenu li a .fa-chart-line {
    color: #04c1e3;
}
#gmenu li a .fa-search {
    color: #00c300;
}
#gmenu li a .fa-map-marker-alt {
    color: #df3522;
}
#gmenu li a .fa-twitter {
    color: #00acee;
}
#gmenu li a .fa-youtube {
    color: #ec2136;
}
#gmenu li a .fa-home {
    color: #04c1e3;
}
#gmenu li a .fa-crown {
    color: #ffce1d;
}
#gmenu li a .fa-comments {
    color: #26a0ff;
}
#gmenu li a .fa-clipboard {
    color: #ff1d1d;
}
#gmenu li a .fa-envelope {
    color: #04c1e3;
}






/*= pankuzu
============================================================*/
#pankuzu {
    padding: 0;
}
.search-results #pankuzu {
    padding: 5px 0;
}
#pankuzu.ranking {
    max-width: 760px;
    margin: 0 auto;
}
#pankuzu ol {
    display: flex;
    max-width: 1000px;
    line-height: 1.5;
    padding: 0 20px;
    margin: 0 auto;
}
#pankuzu ol li a {
    display: inline-block;
    color: #999;
    font-size: 0.66rem;
    text-decoration: none;
    padding: 7px 0;
}
#pankuzu ol li a:hover {
    text-decoration: underline;
}
#pankuzu ol li:nth-of-type(n+2):before {
    content: '\f105';
    color: #999;
    font-family: "Font Awesome 5 Free";
    font-size: 0.6rem;
    font-weight: 900;
    text-align: center;
    margin: 0 5px;
}
#pankuzu ol li a i {
    font-size: 0.6rem;
    margin-right: 1px;
}



/*= keyvisual
============================================================*/
.kv-hero {
    display: block;
    width: 100%;
    height: 315px;
    min-width: 1260px;
    max-width: 2400px;
    margin: 0 auto;
    background-image: url(https://liginc.co.jp/wp-content/uploads/2018/09/nolimit-bgj-pc-180914-4800x630.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    font-size: 0;
}
.kv-cate {
    background-image: url(https://plusblog.jp/wp-content/uploads/2014/10/35.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    /* -webkit-filter: blur(30px); */
    -moz-filter: blur(30px);
    -o-filter: blur(30px);
    -ms-filter: blur(30px);
    /* filter: blur(30px); */
}
.kv-title {
    text-align: center;
    line-height: 1.3;
    padding: 40px 0;
    margin: 0;
}
.kv-title span {
    display: block;
    color: #999;
    font-size: 1.2rem;
    font-weight: normal;
}


/*= SP(header)
============================================================*/
@media (max-width: 640px) {
    .kv-hero {
        display: block;
        min-width: 0;
    }
    #header {
        border-top: 2px solid #04c1e3;
        /*
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 999;
        border-bottom: 1px solid #ddd;
        */
    }
    #header .hero {
        padding: 3px 10px;
    }
    #header .hero .logo {
        display: block;
        margin: 0;
    }
    #header .hero .logo a {
        padding: 0 0 3px;
    }
    .page-template-page-ranking #header .hero .logo a {
        display: block;
        margin: 0 auto;
        padding: 0;
    }
    .hero .logo a img {
        max-width: 220px;
    }
    #nav-drawer {
        display: block;
    }
    .topnews a {
        font-size: 0.7rem;
    }
    #pankuzu {        
        overflow-x: scroll;
        white-space: nowrap;
    }
    #pankuzu ol {
        padding: 0 15px 0;
    }
    #pankuzu ol li a {
        font-size: 0.66rem;
    }
    #gmenu {
        display: none;
    }f
    #gmenu {
        padding: 0;
    }
    #gmenu ul li {
        width: 33.333%;
    }
    #gmenu ul li a {
        font-size: 0.76rem;
        padding: 10px;
    }
}




/*==================================================================================================
* - [3] contents
===================================================================================================*/
#container {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
}
#wrap {
    display: flex;
    justify-content: space-between;
    width: 1080px;
    padding: 0 20px;
    margin: 0 auto;
}
#wrap.pt0 {
    padding: 0 20px 40px;
}
#wrap.category {
    padding: 30px 20px 50px;
}
#wrap.max {
    display: block;
    justify-content: normal;
    max-width: 800px;
    padding: 40px 20px;
}
#wrap.max.ranking {
    background: #fff;
    box-shadow: 0 0 10px -5px rgb(0 0 0 / 10%);
    padding: 20px 30px 20px;
}
#author {
}
main.page {
    width: 100%;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    margin: 0 0 30px;
}
main.page-single {
    width: 72%;
    margin: 0 0 30px;
}
main.archive {
    width: 740px;
    height: max-content;
}
main.archive .post {
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
}
main.card {
    background: #fff;
    width: 100%;
}
main.lp {
    width: 100%;
}
#wrap.form main {
    background: none;
    box-shadow: none;
}
aside {
}
#wrap aside#sidebar {
    width: 25%;
}
.cate-head {
    background-image: linear-gradient(135deg, #04c1e3 25%, transparent 60%), linear-gradient(225deg, #04c1e3 25%, transparent 60%), linear-gradient(45deg, #04c1e3 25%, transparent 60%), linear-gradient(315deg, #04c1e3 25%, #3fbaa1 60%);
    background-position: 20px 0, 20px 0, 0 0, 0 0;
    background-size: 40px 40px;
    background-repeat: repeat;
    font-size: 1.5rem;
    line-height: 1.5;
    color: #fff;
    padding: 30px 0;
}
.page-template-page-ranking .cate-head, .cate-head.ranking {
    text-align: center;
}
.cate-head span {
    display: block;
    font-size: 1rem;
}
.cate-title {
    max-width: 1080px;
    padding: 0 15px;
    margin: 0 auto;
}
.cate-title h1 b {
    color: #fff;
}



/*= post
============================================================*/
/* body -------------------------*/
.post {
    width: 100%;
    padding: 25px 0;
}
.post:nth-of-type(n+2) {
    border-top: 1px dotted #ddd;
}
.post-link {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    color: #333;
    text-decoration: none;
}
.post-link .post-desc:hover {
    opacity: 0.6;
    transition: 0.2s;
}
.post-cate {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    font-size: 0.76rem;
    background: #f9ff00;
    color: #333;
    font-weight: bold;
    padding: 15px 10px;
    z-index: 1;
}



/* thumbnail -------------------------*/
.post-thumbnail {
    overflow: hidden;
    position: relative;
    width: 40%;
}
.post-thumbnail-img {
    transition-duration: 0.3s;
}
.post-thumbnail-img:hover {
    transform: scale(1.1);
}
.post-thumbnail-img:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.7));
    transition-duration: 0.3s;
    opacity: 0;
}
.post-thumbnail-img:hover:before {
    opacity: 1;
}
.post-thumbnail img {
    height: 100%;
    height: 190px;
    object-fit: cover;
}



/* author -------------------------*/
.post-author {
    display: flex;
    padding: 0;
    /* position: relative; */
    /* padding: 0 0 0 15px; */
}
.post-author-icon img {
    display: block;
    margin: -25px 0 5px;
    width: 46px;
    height: 46px;
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 2px 6px rgba(0,0,0,.24);
    -webkit-transition: opacity .25s ease;
    transition: opacity .25s ease;
}
.post-desc .post-author-icon img {
    margin: 0;
    width: 30px;
    height: 30px;
}
.post-author-name {
    display: inline-block;
    margin: 0 0 0 4px;
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1;
    /*
    -webkit-transition: color .25s ease;
    transition: color .25s ease;
    */
}
.post-desc .post-author-name {
    line-height: 2.4;
    vertical-align: bottom;
    padding: 0;
}

/* title -------------------------*/
.post-desc {
    width: 60%;
    padding: 15px 20px 0;
}

.post-title {
    width: 100%;
    font-size: 1.2rem;
    line-height: 1.8;
    margin-bottom: 10px;
}
.post-time {
    display: block;
    width: 100%;
    font-size: 0.9rem;
    text-align: right;
}


/*= related post
============================================================*/
.related {
    width: 100%;
}
.related .post {
    width: 33%;
    padding: 0;
}
.related .post-link {
    display: block;
    background: #fff;
}
.related .post-thumbnail {
    width: 100%;
}
.related .post-thumbnail img {
    height: 160px;
}
.related .post-desc {
    min-height: 110px;
    width: 100%;
    padding: 15px 10px;
}
.related .post-title {
    font-size: 0.86rem;
}
.related .post-author {
    display: none;
}
.related .post-time {
    font-size: 0.7rem;
}


/*= SP(main)
============================================================*/
@media (max-width: 640px) {
    main, aside {
        width: 100%;
    }
    main {
        margin-bottom: 20px;
    }    
    main.archive {
        width: 100%;
        padding: 0 15px 0;
    }
    aside {
        padding: 15px;
    }
    #wrap {
        display: block;
        width: 100%;
        padding: 30px 0;
    }
    #wrap.pt0 {
        padding: 0;
    }
    #wrap.category {
        padding: 20px 0;
    }
    #wrap.home {
        padding: 0;
    }
    #wrap.form {
        padding: 0;
    }
    #wrap.max.ranking {
        padding: 20px 15px;
    }
    #container {
        padding: 0;
    }
    main.page-single, #wrap aside#sidebar {
        width: 100%;
    }
    /*
    .post {
        width: 100%;
        border-top: 1px solid #ddd;
        padding: 20px 15px 20px;
    }
    .post:nth-of-type(2n+1) {
        padding-right: 15px;
        padding-left: 15px;
    }
    */
    .cate-head {
        text-align: left;
        padding: 15px 0;
        margin: 0;
    }
    .cate-title h1 {
        font-size: 1.1rem;
    }
    .post-title {
        font-size: 1.1rem;
        line-height: 1.7;
    }
    .post-link {
        display: block;
    }
    .post-thumbnail {
        width: 100%;
    }
    .post-desc {
        width: 100%;
        padding: 15px;
    }
    .related #container {
        padding: 0;
    }
    .related .post {
        width: 50%;
    }
    .related .post-title {
        font-size: 0.8rem;
    }
    .post-cate {
        font-size: 0.6rem;
        padding: 10px 10px;
    }
    .related .post-thumbnail img {
        height: 105px;
    }
}




/*= article
============================================================*/
/* article-header -------------------------*/
.article-title {
    line-height: 1.7;
    margin-bottom: 10px;
}
.article-title a {
    color: #333;
    text-decoration: none;
}
.sub-title {
    font-size: 1.4rem;
    font-weight: bold;
    margin-bottom: 15px;
}
.sub-title.min {
    font-size: 1.1rem;
    margin-bottom: 10px;
}

/* tags -------------------------*/
.article-tags {
    display: flex;
    margin: 0 0 20px;
}
.article-tags ul {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin: 0 0 0 10px;
}
.article-tags ul li:nth-of-type(2n+1) {
    margin-right: 5px;
}
.article-tags ul li a {
    display: block;
    background: #e4e4e4;
    border: 1px solid #e4e4e4;
    border-radius: 2px;
    color: #333;
    font-size: 0.7rem;
    line-height: 1.3;
    padding: 6px 10px;
}
.article-tags ul li a:hover {
    background: #fff;
    color: #333;
}
.article-time, .article-category, .article-category a {
    color: #8e949a;
    font-size: 0.9rem;
}
.article-time i, .article-category i {
    padding-right: 2px;
}
.article-category {
    padding: 0 0 0 10px;
}
.article-category a {
    text-decoration: none;
}
.article-category a:hover {
    text-decoration: underline;
}

/*= SP(page)
============================================================*/
@media (max-width: 640px) {
    .article-time, .article-category, .article-category a {
        font-size: 0.7rem;
    }
}



/* editor -------------------------*/
.article-editor {
    display: flex;
    margin-bottom: 20px;
}
.article-editor img {
    max-width: 50px;
    height: 100%;
    border-radius: 50px;
}
.article-editor p {
    display: block;
    width: 100%;
    line-height: 1.6;
    padding: 3px 0 0 10px;
}
.article-editor p span {
    display: block;
    color: #333;
    font-size: 0.9rem;
    font-weight: bold;
}
.article-editor p small {
    display: block;
    color: #aaa;
    font-size: 0.7rem;
}

/*= SP
============================================================*/
@media (max-width: 640px) {
    .article-editor {
        padding: 0 15px;
        margin-bottom: 15px;
    }
}



/* sns -------------------------*/
.article-sns {
}
.article-sns ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.article-sns ul li {
    width: 16%;
}
.article-sns.side ul li {
    width: 23%;
}
.article-sns.side ul li a {
    font-size: 1rem;
}
.article-sns ul li a {
    display: block;
    border-radius: 3px;
    color: #fff;
    font-size: 0.9rem;
    text-align: center;
    text-decoration: none;
    padding: 10px 0;
}
.article-sns ul li a i, .icon-line, .icon-hatena {
    margin-right: 4px;
}
.icon-line, .icon-hatena {
    vertical-align: text-bottom;
}
.article-sns ul li a:hover {
    -webkit-transform: translate3d(0px, 3px, 1px);
    transform: translate3d(0px, 3px, 1px);
    box-shadow: none;
}
.sns-twt {
    background: #00acee;
    box-shadow: 0 3px 0 #0092ca;
}
.sns-fb {
    background: #1f6aba;
    box-shadow: 0 3px 0 #2c4373;
}
.sns-ig {
    background-image: linear-gradient(-135deg,#1400c8,#b900b4,#f50000);
    box-shadow: 0 3px 0 #471e94;
}
.sns-gp {
    background: #df3522;
    box-shadow: 0 3px 0 #ad3a2d;
}
.sns-pk {
    background: #ec2136;
    box-shadow: 0 3px 0 #c0392b;
}
.sns-hatena {
    background: #2c6ebd;
    box-shadow: 0 3px 0 #1b4a82;
}
.sns-line {
    background: #00c300;
    box-shadow: 0 3px 0 #009400;
}
.sns-note {
    background: #41c9b4;
    box-shadow: 0 3px 0 #2eab98;
}
.profile-link .sns-blog {
    background: #fff;
    border: 1px solid #eee;
    box-shadow: 0 3px 0 #e4e4e4;
    color: #333;
}
.sns-note img {
    display: inline-block;
    max-width: 12px;
    vertical-align: middle;
}


.side-about-desc .article-sns.side ul {
    justify-content: center;
}
.side-about-desc .article-sns.side ul li {
    width: 40px;
    margin: 0 3px;
}
.side-about-desc .article-sns.side ul li a {
    font-size: 0.8rem;
    text-align: center;
    padding: 2px 0 1px 3px;
}

/*= SP
============================================================*/
@media (max-width: 640px) {
    .article-sns {
        margin: 15px 0 20px;
    }
}



/* cta -------------------------*/
.cta {
    width: 100%;
    background: #04c1e3;
    color: #fff;
    padding: 35px 40px;
}
.cta .btn a {
    width: 100%;
    background: #fff700;
    border: 1px solid #fff700;
    box-shadow: 0 3px 0 #a7a100;
    color: #333;
    font-size: 1.2rem;
    font-weight: bold;
    padding: 10px 0;
}
.cta h3 {
    border-bottom: 3px solid #fff;
    font-size: 1.4rem;
    text-align: center;
}
.cta h3 i {
    display: block;
    font-size: 2.2rem;
    margin-bottom: 15px;
}



/* profile -------------------------*/
.profile {
    width: 100%;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 1px 3px #dedede;
    padding: 40px;
    margin: 30px 0;
}
.profile-info {
    display: flex;
/*    border-bottom: 1px solid #eee;
    padding-bottom: 30px;
    margin-bottom: 20px; */
}
.profile-img {
}
.profile-img img {
    width: 100px;
    height: 100px;
    border: 3px solid #ffffff;
    border-radius: 100px;
    box-shadow: 0 2px 6px rgba(0,0,0,.24);
    margin-bottom: 10px;
}
.profile-desc {
    width: 80%;
    padding: 0 20px;
}
.profile-desc h4 {
}
.profile-desc small {
    display: block;
    color: #999;
    font-size: 80%;
    margin-bottom: 5px;
}
.profile-desc p {
    font-size: 0.86rem;
    margin-bottom: 15px;
}
.profile-name {
    font-size: 1.3rem;
    font-weight: bold;
    margin: 0;
}
.profile-name a {
    color: #333;
}
.profile-name a:hover {
    opacity: 0.6;
    transition: 0.2s;
}
.profile-link {
    display: flex;
    flex-wrap: wrap;
}
.profile-link li:nth-child(n+2) {
    margin-left: 7px;
}
.profile-link a {
    display: block;
    border-radius: 3px;
    color: #fff;
    font-size: 0.7rem;
    text-decoration: none;
    letter-spacing: -0.5px;
    padding: 3px 10px;
}
.profile-link a:hover {
    opacity: 0.6;
    transition: 0.2s;
}
.profile-link a i, .profile-link a img {
    margin-right: 5px;
    display: inline-block;
}
.profile .related .post-desc {
    padding: 15px 0;
}


/*= SP(page)
============================================================*/
@media (max-width: 640px) {
    .profile-img img {
        width: 60px;
        height: 60px;
    }
    .profile-link a {
        min-width: 30px;
        border-radius: 5px;
        font-size: 0.6rem;
        text-align: center;
    }
    .profile-link a i, .profile-link a img {
        margin: 0;
    }
    .profile-link li a span {
        display: none;
    }
}



/* content -------------------------*/
#article {
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 1px 3px #dedede;
    padding: 40px;
}
#entry-content.page {
    padding: 30px;
}
#entry-content h2 {
    background-color: #fff8f7;
    border-left: 5px solid #04c1e3;
    padding: 10px 15px;
    margin-bottom: 20px;
}
#entry-content h3, #sidebar h3 {
    position: relative;
    border-bottom: solid 2px #f0f3f7;
    padding: 10px 0;
    margin-bottom: 15px;
}
#entry-content h3:after, #sidebar h3:after {
    content: "";
    position: absolute;
    background: #04c1e3;
    height: 2px;
    left: 0;
    bottom: -2px;
    width: 20%;
}
#entry-content h4 {
    border-left: 3px solid #04c1e3;
    line-height: 1.7;
    padding: 0 0 3px 15px;
    margin-bottom: 15px;
}
#entry-content h5 {
    margin-bottom: 10px;
}
#entry-content h5:before {
    content: '';
    display: inline-block;
    width: 12px;
    height: 12px;
    background: #04c1e3;
    border-radius: 10px;
    margin-right: 5px;
}
#entry-content h6 {
}

#entry-content p,
.secField-wrap.contentbox .secField-main-content p,
.secField-main-content p {
    font-size: 1.06rem;
    font-feature-settings: "palt";
    letter-spacing: 0.8px;
    line-height: 2.1;
    margin: 0 0 26px;
}
#entry-content a:hover,
.secField-main-content a:hover {
    color: #f00000;
}
#entry-content strong, main.top strong,
.secField-wrap.contentbox .secField-main-content strong,
.secField-main-content strong {
    background: linear-gradient(transparent 60%, #fff700 60%);
}
#entry-content em, main.top em,
.secField-wrap.contentbox .secField-main-content em,
.secField-main-content em {
    font-weight: bold;
    border-bottom: 1px dotted #333;
}

#entry-content ol,
.secField-wrap.contentbox .secField-main-content ol,
.secField-main-content ol,
div#home.page section.page ol {
    counter-reset: number;
    line-height: 2;
    background: #fbfbfb;
    border-radius: 5px;
    padding: 15px 25px;
    margin: 0 0 15px;
}
#entry-content ol li, .secField-wrap.contentbox .secField-main-content ol li,
.secField-main-content ol li,
div#home.page section.page ol li {
    display: flex;
    align-items: center;
}
#entry-content ol li:before,
.secField-wrap.contentbox .secField-main-content ol li:before,
.secField-main-content ol li:before,
div#home.page section.page ol li:before {
    counter-increment: number;
    content: counter(number);
    display: inline-block;
    width: 18px;
    height: 18px;
    background: #04c1e3;
    border-radius: 10px;
    color: #fff;
    font-size: 0.76rem;
    font-weight: bold;
    line-height: 1.4;
    text-align: center;
    vertical-align: text-bottom;
    padding: 0 6px;
    margin-right: 7px;
}
#entry-content ul,
.secField-wrap.contentbox .secField-main-content ul,
.secField-main-content ul,
div#home.page section.page ul {
    line-height: 2;
    background: #fbfbfb;
    border-radius: 5px;
    padding: 15px 25px;
    margin: 0 0 15px;
}
#entry-content ul li:before,
.secField-wrap.contentbox .secField-main-content ul li:before,
.secField-main-content ul li:before,
div#home.page section.page ul li:before {
    content: '';
    display: inline-block;
    width: 10px;
    height: 10px;
    background: #04c1e3;
    border-radius: 10px;
    margin-right: 7px;
}

#entry-content blockquote,
.secField-wrap.contentbox .secField-main-content blockquote,
.secField-main-content blockquote {
    background: #f0f0f0;
    border-radius: 2px;
    padding: 10px 20px 20px;
    margin-bottom: 25px;
}
#entry-content blockquote p,
.secField-wrap.contentbox .secField-main-content blockquote p,
.secField-main-content blockquote p {
    color: #555;
    font-size: 95%;
    line-height: 1.7;
    padding: 0;
    margin: 0;
}
#entry-content blockquote:before,
.secField-wrap.contentbox .secField-main-content blockquote:before,
.secField-main-content blockquote:before {
    content: '\f10d';
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    -webkit-font-smoothing: antialiased;
    color: #d7d7d7;
    display: block;
}

/* box -------------------------*/
.post-list {
    position: relative;
    border: 2px solid #333;
    border-radius: 10px;
    font-weight: bold;
    padding: 25px 20px 20px;
}
#entry-content .post-list h3 {
    background: #fff;
    border: none;
    position: absolute;
    top: -10px;
    left: 15px;
    font-size: 1.2rem;
    line-height: 1;
    padding: 0 10px;
}
#entry-content .post-list h3:before {
    font-family: "Font Awesome 5 Free";
    margin-right: 7px;
}
#entry-content .post-list h3:after {
    content: none;
}
#entry-content .post-list ul, .toc_list, #toc_container ul ul {
    border: none !important;
    border: none;
    line-height: initial;
    padding: initial;
}
.toc_list li:before {
    content: none !important;
}


#entry-content .post-list ul li:before {
    font-family: "Font Awesome 5 Free";
    background: none;
    border-radius: 10px;
    font-size: 18px;
    text-align: center;
    vertical-align: text-top;
    padding: 0;
    margin-right: 15px;
}

.post-list.demerit {
    border: 2px solid #d27676;
    color: #d27676;
}
#entry-content .post-list.demerit h3 {
    color: #d27676;
}
#entry-content .post-list.demerit h3:before {
    content: '\f071';
}
#entry-content .post-list.demerit ul li:before {
    content: '\f00d';
    color: #d27676;
}

.post-list.merit {
    border: 2px solid #04c1e3;
    color: #04c1e3;
}
#entry-content .post-list.merit h3 {
    color: #04c1e3;
}
#entry-content .post-list.merit h3:before {
    content: '\f02e';
}
#entry-content .post-list.merit ul li:before {
    content: '\f00c';
    color: #04c1e3;
}

.post-list.point {
    background: #fffdbc;
    border: 2px solid #04c1e3;
    color: #333;
}
#entry-content .post-list.point h3 {
    background: #04c1e3;
    border: 2px solid #04c1e3;
    border-radius: 10px;
    color: #fff;
    font-size: 1rem;
    padding: 5px 10px;
}
#entry-content .post-list.point h3:before {
    content: '\f0eb';
}
.post-list.point ul li {
    margin: 7px 0;
}
#entry-content .post-list.point ul li:before {
    content: '\f35a';
    color: #04c1e3;
}

#entry-content ol li:before, .secField-wrap.contentbox .secField-main-content ol li:before {
    padding: 1px 0;
}


/* fukidashi -------------------------*/
.fukidashi {
    display: flex;
    margin: 20px 0;
}
.fukidashi-icon {
    width: 20%;
    max-width: 90px;
    font-size: 0.7rem;
    text-align: center;
    line-height: 1;
    margin-right: 20px;
}
.fukidashi-icon img {
    border: 3px solid #dedede;
    border-radius: 50%;
}
.fukidashi-say {
    width: 100%;
}
.fukidashi-say div {
    position: relative;
    display: block;
    border: 2px solid #dedede;
    border-radius: 10px;
    font-size: 0.9rem;
    word-break: break-all;
    padding: 20px 15px;
    margin: 0;
}
.fukidashi-say div:before {
    display: inline-block;
    position: absolute;
    top: 10px;
    left: -25px;
    border: 12px solid transparent;
    border-right: 12px solid #dedede;
    content: "";
}
.fukidashi-say div:after {
    display: inline-block;
    position: absolute;
    top: 10px;
    left: -22px;
    border: 12px solid transparent;
    border-right: 12px solid #fff;
    content: "";
}




/* tdc -------------------------*/
#article #toc_container {
    width: 100%;
    background: #fff;
    border: 3px solid #eaeaea;
    padding: 20px;
    margin-bottom: 30px;
}
#toc_container .toc_title {
    color: #333;
    font-size: 1.4rem;
}
#toc_container .toc_list > li > a {
    font-size: 0.96rem;
}
#toc_container .toc_list > li > ul > li > a {
    font-size: 0.9rem;
}
#toc_container .toc_list > li > ul > li > ul > li > a {
    font-size: 0.86rem;
}
#toc_container ul ul {
    margin-bottom: 15px;
}



/* pagination -------------------------*/
.pagination {
    margin-top: 20px;
}
.page-numbers {
    display: flex;
}
.page-numbers li {
    margin-right: 5px;
    background: #ffdee3;
    font-weight: bold;
}
.page-numbers li a {
    display: block;
    padding: 5px 15px;
    background: #e4e4e4;
    color: #555;
    text-decoration: none;
}
.page-numbers li span {
    padding: 5px 15px;
    display: block;
    background: #04c1e3;
    color: #fff;
}



/* copy btn -------------------------*/
.copy_btn {
    display: block;
    border: 1px solid #dadada;
    box-shadow: 0 3px 0 #f0f0f0;
    font-weight: bold;
    text-align: center;
    padding: 20px 0;
    margin: 10px auto 20px;
}
.copy_btn:hover {cursor:pointer; opacity:0.5; transition:0.2s;}
.copy_btn.copied {
    pointer-events: none;
    background: #fff;
    color: #333;
}
.copy_btn.copied:hover {cursor: auto;}

.copy_btn.copied:before, .copy_btn:before {
    content: "\f00c";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    padding-right: 3px;
}
.copy_btn:before {content: "\f0c5";}




/*= SP(main)
============================================================*/
@media (max-width: 640px) {
    #article {
        border: none;
        padding: 20px 0;
    }
    .article-title {
        font-size: 1.3rem;
        padding: 0 15px;
    }
    .article-tags {
        padding: 0 15px;
        margin: 0 0 15px;
    }
    .article-sns {
        padding: 0 15px;
    }
    .article-sns ul li a {
        font-size: 0.8rem;
        line-height: 0;
        padding: 5px 0;
    }
    .article-sns ul li a i, .icon-line, .icon-hatena {
        font-size: 0.9rem;
        margin: 0;
    }
    .article-sns ul li a small {
        display: none;
    }
    #entry-content {
        padding: 0 15px;
    }    
    #entry-content.page {
        padding: 20px 15px;
    }
    .sub-title {
        font-size: 1.2em;
    }
    .profile {
        width: 100%;
        border: none;
        border-top: 3px solid #e2e2e2;
        border-bottom: 3px solid #e2e2e2;
        padding: 20px 15px 30px;
        margin: 0;
    }
    .profile .related {
        padding: 0;
    }
    .profile-desc {
        padding: 0 0 0 15px;
    }
    .profile-desc p {
        font-size: 0.76rem;
    }
    .profile-desc .profile-name {
        font-size: 1.1rem;
    }
    #entry-content h2 {
        font-size: 1.2rem;
    }
    #entry-content h3 {
        font-size: 1.1rem;
    }
    #entry-content h4 {
        font-size: 1rem;
    }
    #entry-content h5 {
        font-size: 0.9rem;
    }
    #entry-content p {
        font-size: 0.86rem;
    }
    #entry-content .internal a {
        padding: 10px;
    }
    #entry-content .internal_desc {
        padding: 0 15px;
    }
    #entry-content .internal_desc time {
        font-size: 0.76rem;
        margin: 0;
    }
    #entry-content .internal_title {
        font-size: 0.8rem;
    }
    .copy_btn {
        font-size: 0.86rem;
        padding: 10px 0;
        margin: 0 15px 20px 15px;
    }
}





/*==================================================================================================
* - [4]page
===================================================================================================*/
#author > main > section {
    padding: 50px 0;
}
.author-profile {
    background-color: #f9f9f9;
}
.author-history {
    background-color: #fff;
}
#author > main > .author-blog > div {
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    padding: 0 10px;
}

#author > main > section > div {
    max-width: 1000px;
    padding: 0 40px;
    margin: 0 auto;
}
#author > main > section > h2 {
    text-align: center;
    line-height: 1.7;
    margin-bottom: 30px;
}
#author > main > section > h2 small {
    display: block;
    color: #ccc;
    font-size: 75%;
}
#author > main > section > h2 small:after {
    content: "";
    display: block;
    width: 30px;
    height: 3px;
    background: #04c1e3;
    margin: 10px auto 0;
}
#author > main > section > div p {
    font-feature-settings: "palt";
    letter-spacing: 0.8px;
    line-height: 2.1;
    margin: 0 0 26px;
}

#author .profile-info {
    max-width: 1000px;
    padding: 30px 40px 40px;
    margin: 0 auto;
}
#author .profile {
    width: 100%;
    background: #fff;
    box-shadow: none;
    padding: 0;
    margin: 0;
}

@media (max-width: 640px) {
    #author .profile-info {
        padding: 20px 15px;
    }
    #author > main > .author-blog > div {
        background-color: #fff;
        padding: 0 20px;
    }
}


/*= home
============================================================*/
.sbc01 {
    background: #fff5d8;
    opacity: 0.8;
    background-image: radial-gradient(#ffe9aa 0.5px, #fff5d8 0.5px);
    background-size: 5px 5px;
}
.sbc02 {
    background: #fff;
}
section.sbc03 {
    background: #f9f9f9;
}
.secInner {
    max-width: 800px;
    padding: 3% 3%;
    margin: 0 auto;
}
.secInner.secwide {
    max-width: 1000px;
}
h2.topHeadline {
    text-align: center;
    line-height: 2;
    margin: 0 0 20px;
}
h2.topHeadline:after {
    content: "";
    display: block;
    height: 5px;
    width: 50px;
    background: #04c1e3ff;
    border-radius: 7px;
    margin: 0 auto;
}
h2.topHeadline i {
    display: block;
    color: #fed240;
}
.secInner h3 {
    font-size: 1rem;
    line-height: 1;
    text-align: center;
    padding: 0;
    margin: 0 0 15px;
}
section#kv {
    background: linear-gradient(90deg, #6fb5d5 0, #04c1e3 25%, #04c1e3 -11%, #04c1e3 75%, #6fb5d5);
}
.kv_wrap {
    max-width: 800px;
    padding: 0 3%;
    margin: 0 auto;
}
.kv_wrapBox {
    background-image: url(./img/kv.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position-x: right;
    padding: 30px 0;
}
.kv_brand {
    display: block;
    color: #fff;
    font-size: 2rem;
    font-weight: bold;
    line-height: 1.5;
    margin: 0 0 7px;
}
p.kv_brand span, p.kv_brand strong {
    display: block;
}
.kv_label {
    width: fit-content;
    background: #fedb3a;
    color: #333;
    font-size: 0.96rem;
    line-height: 1.5;
    padding: 0px 7px;
    margin: 0 0 5px;
}
p.kv_track {
    display: block;
    width: fit-content;
    border-radius: 5px;
    color: #fff;
    font-size: 1.1rem;
    font-weight: bold;
    text-align: center;
    line-height: 1.5;
}
p.kv_track strong {
    font-size: 1.3rem;
}
.kv_wrapImg {
    width: 50%;
}

.kv_search {
    background: #fff;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    padding: 15px 25px 20px;
}
.kv_search p {
    color: #4eb6a1;
    font-size: 0.96rem;
    font-weight: bold;
    text-align: center;
    line-height: 1;
    margin: 0 0 7px;
}
.kv_search p i {
    color: #4eb6a1;
}

.kv_search form {
    display: flex;
    justify-content: space-between;
}

ul.kv_search_title {
    display: flex;
}
ul.kv_search_title li {
    width: 38%;
    color: #4e4e4e;
    font-size: 0.8rem;
    font-weight: bold;
}
ul.kv_search_title li i {
    color: #04c1e3;
    margin-right: 3px;
}


.rankingTbl {
    overflow-x: scroll;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    margin: 0 0 20px;
}
.rankingTbl_inner {
    display: flex;
}
.rankingTbl_inner {
    width: 100%;
    border-collapse: collapse;
    white-space: nowrap;
}
.rankingTbl-field {
    display: flex;
    text-align: center;
}
.rankingTbl-field_head {
    width: 80px;
    background: #04c1e3;
    border-bottom: 1px solid #f1f1f1;
    color: #fff;
    font-size: 0.8rem;
    text-align: center;
    padding: 10px 5px;
}
.rankingTbl-field_head:first-child {
    min-height: 145px;
}
.rankingTbl-field_cell {
    width: 160px;
    background: #fff;
    border-bottom: 1px solid #f1f1f1;
    font-size: 0.8rem;
    text-align: center;
    text-wrap: wrap;
    padding: 10px 5px;
    margin-left: 5px;
}
.rankingTbl-field_cell:first-child {
    min-height: 145px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.rankingTbl-field_cell_wrap {
    position: relative;
    counter-increment: ranking-number;
}
.rankingTbl-field_cell_wrap:first-child .rankingTbl-field_cell {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.rankingTbl-field_cell_wrap .rankingTbl-field_cell:first-child:before{
    content: counter(ranking-number);
    position: absolute;
    left: 12px;
    top: 7px;
    width: 20px;
    height: 20px;
    display: block;
    background: #f5f5f5;
    border-radius: 30px;
    font-size: 0.7rem;
    font-weight: bold;
    text-align: center;
    z-index: 1;
}
.rankingTbl-field_cell a {
    display: block;
}
.rankingTbl-field_cell img {
    width: 80%;
    height: 80px;
    object-fit: cover;
    border-radius: 3px;
    box-shadow: 0 5px 5px -5px rgb(0 0 0 / 10%);
}
.rankingTbl-field_cell span {
    display: block;
    font-size: 0.7rem;
}


.rankingTbl-field_cell span.service__TRUE:after {
    content: "\f111";
    font-family: 'Font Awesome 6 Free';
    font-size: 0.8rem;
    color: #04c1e3;
}
.rankingTbl-field_cell span.service__FALSE:after {
    content: "\f068";
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 0.8rem;
    color: #aaa;
}

.planRevlist-box span.service__TRUE:after {
    content: "\f111";
    font-family: 'Font Awesome 6 Free';
    font-size: 0.8rem;
    color: #04c1e3;
}
.planRevlist-box span.service__FALSE:after {
    content: "\f068";
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 0.8rem;
    color: #aaa;
}


table.feeTbl.serviceList {
    max-width: 720px;
    margin: 0 auto 50px;
}
table.feeTbl.serviceList td {
    vertical-align: middle;
    padding: 7px 10px;
}
.serviceList-name {
    display: flex;
    align-items: center;
}
.serviceList-name img {
    display: block;
    max-width: 60px;
    border-radius: 3px;
    text-align: center;
    margin-right: 10px;
}
td.serviceList-review {
    width: 30%;
}


.top_planList {
    display: flex;
    flex-wrap: wrap;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    padding: 15px 30px;
    margin: 0 0 30px;
}
.top_planList li {
    line-height: 1.5;
    margin: 0 7px 0 0;
}
.top_planList li a {
    position: relative;
    color: #707070;
    font-size: 0.7rem;
}
.top_planList li a:after {
    content: "/";
    display: inline-block;
    margin: 0 0 0 7px;
}
.top_planList li:last-child a:after {
    content: none;
}

ul.plan_topList li {
    margin: 0 0 30px;
}
ul.plan_topList li a {
    display: flex;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    background: #fff;
    color: #333;
    text-decoration: none;
    padding: 10px 0;
}
ul.plan_topList li a figure {
    max-width: 200px;
}
ul.plan_topList li a figure img {
    padding: 10px;
}
ul.plan_topList li a h4 {
    width: -webkit-fill-available;
    padding: 15px;
}
ul.plan_topList li a h4 span {
    display: block;
}

ul.top_revList {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
ul.top_revList li {
    width: 49%;
    margin: 0 0 15px;
}
ul.top_revList li a {
    display: block;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    background: #fff;
    color: #333;
    text-decoration: none;
    padding: 20px;
}
.secInner ul.top_revList li a h3 {
    font-size: 0.86rem;
    line-height: 1.4;
    margin: 0 0 5px;
}
ul.top_revList li a p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    color: #aaa;
    font-size: 0.76rem;
    line-height: 1.5;
}




/*= SP(page)
============================================================*/
@media (max-width: 640px) {
    section#kv {
        border-bottom: 2px solid #efefef;
    }
    .kv_wrap {
        padding: 0 15px;
    }
    .kv_search {
        padding: 5px 10px 15px;
    }
    .kv_search p {
        color: #4eb6a1;
        font-size: 0.86rem;
        text-align: center;
        margin: 0 0 5px;
    }
    .kv_brand {
        font-size: 1.2rem;
    }
    p.kv_track {
        font-size: 0.76rem;
    }
    p.kv_track strong {
        font-size: 0.9rem;
    }
    .kv_wrapBox {
        padding: 30px 0 20px;
    }
    table.feeTbl.serviceList td {
        padding: 7px 5px;
    }
    .serviceList-name {
        font-size: 0.66rem;
    }
}






/*==================================================================================================
* - [5]sidebar
===================================================================================================*/
#sidebar h3 {
    font-size: 0.9rem;
    border-bottom: 2px solid #f0f3f7;
    padding: 0 0 5px;
    margin: 0 0 5px;
}

#wrap .side-post ul li {
    margin: 15px 0;
}

/*= post
============================================================*/
.side-post {
    background: #fff;
    border: 1px solid #f3f3f3a6;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    padding: 20px;
    margin: 0 0 20px;
}
.side-post ul li {
    margin-bottom: 10px;
}
.side-post ul li a {
    display: flex;
    align-items: flex-start;
    background: #fff;
    color: #333;
    text-decoration: none;
    padding: 0;
}
.side-post ul li a:hover {
    opacity: 0.6;
    transition: 0.1s;
}
.side-post ul li a figure {
    position: relative;
    margin-right: 10px;
}
.side-post ul li a figure img {
    width: 100px;
    height: 50px;
    object-fit: cover;
    border-radius: 3px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 10%);
}
.side-post ul li h4 {
    width: 73%;
    font-size: 0.8rem;
    font-weight: normal;
    line-height: 1.5;
    padding: 0 10px;
}
ul.plan_sidebarList li h4 span {
    font-size: 90%;
}
.side-post ul li time {
    display: none;
    font-size: 0.7rem;
    text-align: right;
}
.side-post ul li .post-cate {
    font-size: 0.6rem;
    padding: 10px 5px;
}

.side-post.ranking li, ul.plan_topList li {
    position: relative;
    counter-increment: ranking-number;
    margin: 15px 0;
}
.side-post.ranking li:before, ul.plan_topList li:before {
    content: counter(ranking-number);
    position: absolute;
    left: -5px;
    top: -5px;
    width: 18px;
    height: 18px;
    display: block;
    background: #ededed;
    border-radius: 15px;
    color: #5b5b5b;
    font-size: 10px;
    font-weight: bold;
    text-align: center;
    margin-right: 3px;
    z-index: 1;
}
.side-post.ranking li:nth-child(1):before {
    background: #fed240;
    color: #fff;
}
.side-post.ranking li:nth-child(2):before {
    background: #b0b0b0;
    color: #fff;
}
.side-post.ranking li:nth-child(3):before {
    background: #c47d33;
    color: #fff;
}

ul.plan_sidebarList li {
    margin-bottom: 15px;
}
ul.plan_sidebarList li a {
    border-radius: 5px;
    box-shadow: none;
    background: #fff;
}
ul.plan_sidebarList li h4 {
    width: 100%;
    font-size: 0.76rem;
    font-weight: bold;
    padding: 0;
}
ul.plan_sidebarList li h4 span {
    display: block;
}





/*= about
============================================================*/
.side-about {
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    margin: 0 0 30px;
}
img.backlogo {
    object-fit: cover;
    height: 160px;
}
.side-about-icon {
    position: relative;
}
.side-about-icon img.avatar {
    position: absolute;
    bottom: -50px;
    left: 33%;
    display: block;
    width: 100px;
    height: 100px;
    border: 3px solid #fff;
    border-radius: 50px;
    object-fit: cover;
    margin: 0 auto;
}
.side-about-desc {
    padding: 0 20px 15px;
    margin-top: 60px;
}
.side-about-name {
    text-align: center;
    line-height: 1.3;
    margin-bottom: 10px;
}
.side-about-desc .side-about-name p {
    font-size: 1.1rem;
}
.side-about-name small {
    color: #999;
    font-size: 0.76rem;
}
.side-about-desc p {
    font-size: 0.8rem;
}
.side-about-tag li {
    display: inline-block;
}
.side-about-tag li a {
    display: block;
    background-color: #eee;
    color: #333;
    font-size: 0.66rem;
    text-decoration: none;
    padding: 0 10px;
}


/*= category
============================================================*/
.side-cate {
    background: #fff;
    border: 1px solid #f3f3f3a6;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    padding: 20px;
}
.side-cate h4 {
    font-size: 0.8rem;
}
.side-cate ul {
    margin: 0 0 15px;
}
.side-cate ul li:before {
    font-family: "Font Awesome 5 Free";
    content: "\f054";
    display: block;
    color: #04c1e3;
    font-size: 0.66rem;
    font-weight: bold;
}
.side-cate ul li {
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin: 0 0 5px;
}
.side-cate ul li a {
    display: block;
    width: fit-content;
    color: #333;
    font-size: 0.86rem;
    text-decoration: none;
    line-height: 1.5;
    padding: 3px 0 3px 5px;
}
.side-cate ul li a:hover {
    color: #0b57d0;
    text-decoration: underline;
}
.side-cate ul li a.link_off {
    color: #c2c2c2;
}
ul.children {
    background: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0 0 10px 20px;
    margin: 0;
}


/*= Review List
============================================================*/
.side-revList ul li {
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    padding: 20px;
    margin: 0 0 15px;
}
.side-revList ul li a {
    color: #333;
    text-decoration: none;
}
.side-revList ul li a:hover {
    opacity: 0.6;
    transition: 0.2s;
}
.side-revList ul li a h4 {
    display: block;
    font-size: 0.8rem;
    line-height: 1.5;
}
.side-revList ul li a p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    color: #aaa;
    font-size: 0.76rem;
    line-height: 1.5;
}


/*= SP(page)
============================================================*/
@media (max-width: 640px) {
    #sidebar h3 {
        font-size: 1rem;
    }
    .side-about-icon img {
        left: 36%;
    }
}







/*==================================================================================================
* - [6]footer
===================================================================================================*/
footer {
    background: #fff;
    border-top: 3px solid #e0e0e0;
}
.footer-logo {
    max-width: 300px;
    padding: 10px 0;
    margin: 0 auto;
}
.footer-logo a {
    display: block;
}
.foot {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    max-width: 1080px;
    padding: 50px 30px;
    margin: 0 auto;
}
.foot h4 {
    display: inline-block;
    border-bottom: 2px solid #ddd;
    font-size: 1.1rem;
    margin-bottom: 20px;
}
.foot .logo, .foot #fmenu, .foot-sns  {
    width: 30%;
}
.foot .logo a {
    display: block;
    padding: 20px 0;
}
.foot .logo p {
    font-size: 0.8rem;
}
.foot #fmenu ul li {
    font-size: 0.96rem;
    font-weight: bold;
    margin-bottom: 5px;
}
.foot-sns iframe {
    max-height: 300px;
}
footer > p {
    background: #04c1e3;
    color: #fff;
    font-size: 0.8rem;
    text-align: center;
    padding: 10px 0;
    margin: 0;
}
footer > p a {
    color: #fff;
}


/*= SP(footer)
============================================================*/
@media (max-width: 640px) {
    .foot {
        display: block;
    }
    .foot .logo, .foot #fmenu, .foot-sns  {
        width: 100%;
    }
    #fmenu {
        margin: 25px 0;
    }
}






/*==================================================================================================
* - page-plan
===================================================================================================*/
@charset "UTF-8";
.card header {
  background: #04c1e3;
  background-image: radial-gradient(#04c1e3 20%, transparent 0), radial-gradient(#17213c 20%, transparent 0);
  background-position: 0 0, 5px 5px;
  background-size: 5px 5px;
  padding: 30px;
}
.card header h1 {
  display: block;
  max-width: 1080px;
  color: #fff;
  line-height: 1.6;
  margin: 0 auto;
}

.card .sendbtn a {
  display: block;
  width: 100%;
  max-width: 400px;
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffb239), to(#fea820));
  border-bottom: 5px solid #C67D08;
  border-radius: 999px;
  color: #fff;
  font-size: 1.3rem;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 0 #68141B66;
  text-decoration: none;
  line-height: 1.5;
  padding: 15px 20px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
  overflow: hidden;
  transition: 0.25s linear;
  -webkit-transition: 0.25s linear;
  -moz-transition: 0.25s linear;
}
.card .sendbtn a:after {
  display: block;
  position: absolute;
  z-index: -1;
  left: -30%;
  top: -50%;
  content: "";
  width: 30px;
  height: 100px;
  transform: rotate(30deg);
  -webkit-transform: rotate(30deg);
  -moz-transform: rotate(30deg);
  background-image: linear-gradient(left, rgba(255, 255, 255, 0) 0%, #fff 50%, rgba(255, 255, 255, 0) 100%);
  background-image: -webkit-gradient(linear, left bottom, right bottom, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(50%, #fff), color-stop(100%, rgba(255, 255, 255, 0)));
  background-image: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, #fff #fff, rgba(255, 255, 255, 0) 100%);
  animation: shiny 3s infinite linear;
  -webkit-animation: shiny 2.7s infinite linear;
  -moz-animation: shiny 3s infinite linear;
}
.card .doge {
  display: flex;
  padding: 0 20px;
}
.card .doge li {
  width: 50%;
  margin: 0 5px;
}
.card .doge li a {
  display: inline-block;
  color: #fff;
  font-size: 1.2rem;
  font-weight: bold;
  padding: 0 40px;
}
.card .doge li p {
  font-weight: bold;
  padding: 3px 0 0 0;
  margin-right: 5px;
}
.card .doge li span {
  display: block;
  color: #fff;
  font-size: 1.2rem;
  font-weight: bold;
}
.card .doge li.shinsaOK span {
  background: #129dff;
}
.card .doge li.shinsaNG span {
  background: #ff1d1d;
}
.card .cardSec {
  max-width: 1080px;
  padding: 20px;
  margin: 0 auto;
}
.card .cardSec figure {
    display: flex;
    align-items: center;
    width: 15%;
}
.card .cardSec figure img {
    height: fit-content;
}
.card .cardSec figure figcaption {
  text-align: center;
  line-height: 2;
}
.card .cardSec .mainbox {
  display: flex;
  align-items: center;
}
.card .cardSec .mainbox .mainbox--info {
  width: 85%;
  padding: 0;
}
.card .cardSec .mainbox .mainbox--info .mainbox--cardname {
  font-size: 1.6rem;
  font-weight: bold;
  margin: 0 0 -5px;
}
.card .cardSec .mainbox .mainbox--info .mainbox--disclaimer {
  color: #a2a2a2;
  font-size: 0.96rem;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score {
  display: flex;
  margin: -5px 0 0 0;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score p.emp {
    font-size: 1.2rem;
    font-weight: bold;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score p.emp b {
    color: #f2684c;
    font-size: 1.4rem;
    margin: 0 0 0 5px;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score p.emp small {
    color: #aaa;
    font-size: 75%;
    font-weight: normal;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score p.emp small a {
    color: #aaa;
}

.card .cardSec .mainbox .mainbox--info .mainbox--score dl {
  width: 100%;
  font-weight: bold;
  text-align: center;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score dl dt {
  background: #f2f2f2;
  border: 1px solid #ddd;
  font-size: 0.9rem;
  padding: 3px 0;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score dl dd {
  border: 1px solid #ddd;
  line-height: 1.4;
  padding: 10px 0 15px;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score dl dd small {
  font-size: 70%;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score dl dd .emp {
  font-size: 2.2rem;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score dl dd .emp i {
  color: #ffce1d;
  font-size: 1.2rem;
  vertical-align: middle;
  padding: 0 3px 7px 0;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score dl dd .sup {
  color: #a4a4a4;
  font-weight: normal;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score dl dd .sup span:first-child {
  color: #0391ff;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score dl dd .sup .blue {
  color: #0391ff;
}
.card .cardSec .mainbox .mainbox--info .mainbox--score dl dd .sup .red {
  color: #ff1d1d;
}
.card .cardSec .mainbox .mainbox--info .mainbox--label li a {
    display: block;
    width: fit-content;
    background: #ffca28;
    border-radius: 4px;
    color: #333;
    font-size: 0.8rem;
    font-weight: bold;
    text-decoration: none;
    padding: 0 10px;
}
.card .cardSec .mainbox .mainbox--info .mainbox--desc {
  font-size: 0.9rem;
  margin: 0 0 20px;
}
.card .contentSec {
  background: #f9f9f9;
}
.card .contentSec > section {
  display: flex;
  justify-content: space-between;
  max-width: 1080px;
  padding: 30px 20px 200px;
  margin: 0 auto;
}
.card .contentSec section .innerMain {
    width: 71%;
    background: #fff;
    border: 1px solid #f3f3f3a6;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
}
.card .contentSec section .innerMain .innerMain--sec {
  margin: 0 0 40px;
}
.innerMain-top {
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    background-color: #fff;
    padding: 30px 40px 50px;
}

.tabs {
}
.tabs .tab_content {
  display: none;
  clear: both;
  overflow: hidden;
}
.tabs .tab_item h3 {
    padding: 10px 0;
    margin: 0;
}
.tabs .tab_item {
    position: relative;
    display: block;
    width: 33.3%;
    float: left;
    background: #fff;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    color: #333;
    text-align: center;
    transition: all 0.2s ease;
    padding: 5px 0;
    margin-bottom: 25px;
}
.tabs input[name=tab_item] {
  display: none;
}
.tabs input:checked + .tab_item {
    background: #04c1e3;
    border-radius: 5px;
    color: #fff;
}
.tabs input:checked + .tab_item:after {
  content: "";
  position: absolute;
  top: 100%;
  left: 45.5%;
  display: block;
  border-right: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid transparent;
  z-index: 1;
}
.tabs #tab1:checked ~ #tab1_content,
.tabs #tab2:checked ~ #tab2_content,
.tabs #tab3:checked ~ #tab3_content,
.tabs #tab4:checked ~ #tab4_content,
.tabs #tab5:checked ~ #tab5_content,
.tabs #tab6:checked ~ #tab6_content,
.tabs #tab7:checked ~ #tab7_content,
.tabs #tab8:checked ~ #tab8_content,
.tabs #tab9:checked ~ #tab9_content,
.tabs #tab10:checked ~ #tab10_content {
  display: block;
}
.tabs input:checked + .tab_item.tab1:after,
.tabs input:checked + .tab_item.tab2:after,
.tabs input:checked + .tab_item.tab3:after,
.tabs input:checked + .tab_item.tab4:after,
.tabs input:checked + .tab_item.tab5:after,
.tabs input:checked + .tab_item.tab6:after,
.tabs input:checked + .tab_item.tab7:after,
.tabs input:checked + .tab_item.tab8:after,
.tabs input:checked + .tab_item.tab9:after,
.tabs input:checked + .tab_item.tab10:after {
  border-top: 10px solid #04c1e3;
}
.tabs label.tab_item.tab1,
.tabs label.tab_item.tab2,
.tabs label.tab_item.tab3,
.tabs label.tab_item.tab4,
.tabs label.tab_item.tab5,
.tabs label.tab_item.tab6,
.tabs label.tab_item.tab7,
.tabs label.tab_item.tab8,
.tabs label.tab_item.tab9,
.tabs label.tab_item.tab10 {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

#planPage .tab_item {
    width: 19%;
    border: 1px solid #e9e9e9;
    border-radius: 5px;
    font-size: 0.86rem;
    margin: 0.7% 0.5%;
}
#planPage .tab_item:active {
    border: 1px solid #04c1e3;
}
#planPage .tab_item p {
    font-size: 0.9rem;
}
#planPage input:checked + .tab_item:after {
    content: none;
}

#planPage .tab_item.tab10 {
    margin-bottom: 10px;
}

.tablinkList {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    margin: 0;
}
.tablinkList li {
}
.tablinkList li:first-child {
}
.tablinkList li a {
    display: block;
    color: #555;
    font-size: 0.8rem;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    padding: 0;
    margin: 0;
}
.tablinkList li a:hover {
    opacity: 0.6;
    transition: 0.2s;
}
.tablinkList li a.btn_passive {
    color: #bebebe;
    font-weight: normal;
}

.areafeeList {
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    border: 1px solid #eee;
    border-radius: 5px;
    padding: 15px 0;
    margin: 5px 0 30px;
}


i.on {
    color: #ffca28;
}
i.off {
    color: #f1f1f1;
}


.btn_reviewPost {
    min-width: 180px;
    margin: 0;
}
.btn_reviewPost a {
    display: block;
    background: #FEDB3A;
    border-radius: 10px;
    box-shadow: 0 5px 0 rgba(0,0,0,0.05);
    color: #333;
    font-size: 0.9rem;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    padding: 10px 0;
}
.btn_reviewPost a:hover {
    opacity: 0.8;
    transition: 0.2s;
}
.btn_reviewPost a i {
    margin: 0 3px 0 0;
}

.flag_service-field {
    background: #ffe6e6;
    border-radius: 5px;
    padding: 20px 30px;
    margin: 0 0 20px;
}
.flag_service-field p {
    color: #ff5252;
    font-size: 0.9rem;
    font-weight: bold;
    line-height: 1.5;
}


.planHead1 {
    line-height: 1.5;
    margin: 0 0 5px;
}
.planHead2 {
    font-size: 1.4rem;
    padding: 5px 0;
    margin: 30px 0 15px;
}
.planHead2:after {
    content: "";
    display: block;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg,#2bc3b1 0,#04c1e3 24%,#04c1e3 50%,#04c1e3 76%,#2bc3b1);
    margin-top: 5px;
}
.planHead3 {
    position: relative;
    font-size: 1.1rem;
    padding: 0 0 0 15px;
    margin: 0 0 3px 0;
}
.planHead3:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    display: block;
    width: 4px;
    height: calc(100% - 5px);
    background: #04c1e3;
    border-radius: 5px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.planHead4 {
    font-size: 1rem;
}
.planHead4:before {
    content: "";
    display: inline-block;
    height: 22px;
    width: 5px;
    background: #04c1e3ff;
    border-radius: 7px;
    vertical-align: text-top;
    margin: 0 7px 0 0;
}
.planHead5 {
    font-size: 0.96rem;
}

.secField-wrap .summaryHead3 {
    font-size: 1rem;
    padding: 0 0 0 30px;
    margin: 0;
}
.secField-wrap .summaryHead3:before {
    content: counter(ranking-number);
    position: absolute;
    left: 0;
    top: 13px;
    width: 20px;
    height: 20px;
    display: block;
    background: #ededed;
    border-radius: 15px;
    color: #5b5b5b;
    font-size: 0.7rem;
    font-weight: bold;
    text-align: center;
    margin-right: 3px;
    z-index: 1;
}

nav.planPage_nav {
    background: linear-gradient(90deg, #2dd6eb 0, #04c1e3 24%, #04c1e3 50%, #04c1e3 76%, #2dd6eb);
}
nav.planPage_nav ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    max-width: 1080px;
    margin: 0 auto;
}
nav.planPage_nav ul li {
}
nav.planPage_nav ul li a {
    display: block;
    color: #fff;
    font-size: 0.86rem;
    text-decoration: none;
    padding: 10px 25px;
}
nav.planPage_nav ul li a:hover {
    opacity: 0.4;
    transition: 0.2s;
}
nav.planPage_nav ul li a:after {
    content: "\f107";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 0.7rem;
    margin-left: 5px;
}

.planBoards {
    display: flex;
    justify-content: space-between;
    background: #fff;
    border-radius: 5px;
    padding: 30px 30px 20px;
    margin: 0;
}
.scoreBoard {
    width: 100%;
}
.scoreBoard .emp {
    font-weight: 900;
    text-align: center;
    line-height: 1;
    padding: 15px 0 0;
    margin: 0 auto 10px;
}
.scoreBoard .emp span {
    display: block;
    font-size: 2.6rem;
    margin: 0 auto 7px;
}
.scoreBoard .emp i {
    font-size: 0.76rem;
    letter-spacing: 3px;
}
.scoreBoard .emp small {
    display: block;
    color: #bbb;
    font-size: 0.9rem;
    font-weight: normal;
    margin: 12px 0 0;
}
.scoreBoard .emp small a {
    color: #bbb;
}
.scoreBoard--class {
    display: flex;
}
.scoreBoard_wrap {
    padding: 0;
}
.scoreBoard_wrap.left {
    width: 70%;
}
.scoreBoard_wrap.right {
    width: 30%;
}
.scoreBoard h3 {
    font-size: 1rem;
    text-align: center;
    margin: 0 auto 10px;
}
section .innerMain .scoreBoard h3:before {
    content: none;
}
.scoreBoard--class_field {
    display: flex;
    margin: 0 auto 15px;
}
.scoreBoard--class_field p {
    display: flex;
    line-height: 1;
}
.scoreBoard--class_field p i {
    vertical-align: middle;
    display: block;
    font-size: 12px;
    padding: 0;
}
.scoreBoard--class_field p span {
    display: block;
    font-size: 13px;
    font-weight: bold;
    margin: 0 0 0 2px;
}
.scoreBoard--class_field_barProgres {
    position: absolute;
    height: 100%;
    background: #FFCA28;
}
.scoreBoard--class_field_bar {
    position: relative;
    width: 100%;
    height: 12px;
    background: #f1f1f1;
    border-radius: 5px;
    overflow: hidden;
    margin: 0 12px;
}
.scoreBoard--class_field small {
    min-width: 30px;
    font-size: 12px;
    font-weight: bold;
    padding: 3px 0;
}

ul.scoreCatelist {
    padding: 0 0 0 10%;
}
ul.scoreCatelist li {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    line-height: 2;
    margin: 0;
}
ul.scoreCatelist li p span {
    display: inline-block;
    min-width: 22px;
    text-align: right;
}
ul.scoreCatelist li p {
    font-size: 0.8rem;
}
ul.scoreCatelist li p span i.fa-star-half-stroke {
    letter-spacing: -1.5px;
}

ul.scoreBorad_links {
    display: flex;
    justify-content: space-evenly;
}
ul.scoreBorad_links li a {
    display: none;
    color: #04c1e3;
    font-size: 0.8rem;
}


.wp-post-image {
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
}

details.planCard-warp {
    position: relative;
    counter-increment: ranking-number;
    margin: 0 0 15px;
}
details.planCard-warp summary {
    cursor: pointer;
    position: relative;
    display: flex;
    justify-content: space-between;
    color: #333;
    border: 1px solid #efefef;
    border-radius: 3px;
    box-shadow: 0 7px 3px -5px rgb(0 0 0 / 5%);
    align-items: center;
    padding: 15px;
}
details.planCard-warp summary::-webkit-details-marker {
    display: none;
}
details.planCard-warp summary::before,
details.planCard-warp summary::after {
    width: 3px;
    height: .9em;
    border-radius: 5px;
    background-color: #04c1e3b3;
    content: '';
}
details.planCard-warp summary::before {
    position: absolute;
    right: 25px;
    rotate: 90deg;
}
details.planCard-warp summary::after {
    position: absolute;
    right: 25px;
    transition: rotate .3s;

}
details.planCard-warp[open] summary::after {
    rotate: 90deg;
}
details.planCard-warp .planCard-inner {
    transform: translateY(-10px);
    opacity: 0;
    margin: 0;
    padding: 10px 10px 0;
    transition: transform .5s, opacity .5s;
}
details.planCard-warp[open] .planCard-inner {
    transform: none;
    opacity: 1;
}

details.planCard-warp.planInner-table {
    border: 1px solid #eee;
}
details.planCard-warp.planInner-table h4.planHead4:before {
    content: none;
}
/*
.planCard > details:nth-of-type(n+1) {
    display: none;
}
*/

.planCard-title {
    font-weight: bold;
}
.planCard-title strong {
    display: block;
}
.planCard-title span b {
    display: inline-block;
    background: #eee;
    border-radius: 30px;
    color: #444;
    font-size: 0.8rem;
    padding: 0 10px;
    margin: 0 5px;
}
.planCard-title span small {
    font-size: 70%;
    font-weight: normal;
    color: #b2b2b2;
}


.planCard-inner-field {
    margin: 0;
}
.plan-textSup {
    color: #b2b2b2;
    font-size: 0.76rem;
}

.planCard-avgFeelist li {
    display: flex;
    font-size: 0.86rem;
    margin: 0 0 10px 0;
}
.planCard-avgFeelist li b {
    display: block;
    min-width: 80px;
    background: #04c1e3;
    color: #fff;
    font-weight: bold;
    text-align: center;
    padding: 0 10px;
}
.planCard-avgFeelist li span {
    font-size: 0.96rem;
    font-weight: bold;
}
.planCard-avgFeelist li span:before {
    content: "▶";
    color: #04c1e3;
    font-size: 12px;
    vertical-align: middle;
    margin: 0 10px 0 -2px;
}

table.planTbl {
    font-size: 0.8rem;
    margin: 0 0 10px 0;
}
table.planTbl tr {
    border-bottom: 1px solid #dbdbdb;
}
table.planTbl tr:last-child {
    border-bottom: none;
}
table.planTbl th {
    width: 140px;
    padding: 7px 0 7px 10px;
}
table.planTbl tr:first-child th {
    border-top-left-radius: 5px;
}
table.planTbl tr:last-child th {
    border-bottom-left-radius: 5px;
}
table.planTbl tr:last-child td {
    border-bottom-right-radius: 5px;
}
table.planTbl tr:first-child td {
    border-top-right-radius: 5px;
}
table.planTbl td p {
    font-size: 0.8rem;
    margin: 0 0 8px;
}
table.planTbl td p:last-child {
    margin: 0;
}
table.planTbl.intbl {
    border-radius: 5px;
    box-shadow: 7px 7px 7px -7px rgb(0 0 0 / 5%);
}

table.feeTbl {
    font-size: 0.8rem;
    margin: 0 0 20px 0;
    border-radius: 5px;
    box-shadow: 7px 7px 7px -7px rgb(0 0 0 / 5%);
}
table.feeTbl thead th {
    font-weight: bold;
}
table.feeTbl tr {
    border-bottom: 1px solid #ededed;
}
table.feeTbl tr:last-child {
    border-bottom: none;
}
table.feeTbl tbody th {
    width: 140px;
    background: #f0f3f7;
    padding: 7px 0 7px 10px;
}
table.feeTbl tr:first-child th {
    border-top-left-radius: 5px;
}
table.feeTbl thead tr:first-child th:first-child {
    border-top-left-radius: 5px;
}
table.feeTbl thead tr:first-child th:last-child {
    border-top-right-radius: 5px;
}
table.feeTbl tbody tr:last-child th:first-child {
    border-bottom-left-radius: 5px;
}
table.feeTbl tbody tr:last-child td:last-child {
    border-bottom-right-radius: 5px;
}
table.feeTbl td p {
    font-size: 0.8rem;
    margin: 0 0 8px;
}
table.feeTbl td p:last-child {
    margin: 0;
}
table.feeTbl.plantbl tbody th {
    width: 160px;
    padding: 7px 7px 7px 10px;
}
table.feeTbl.hikakutbl tbody td {
    width: 40%;
}


table.feeTbl.compare thead th {
    background: #04c1e3;
    color: #fff;
}
table.feeTbl.compare thead th:last-child {
    border-top-left-radius: 0;
}


.tab-wrap {
    display: flex;
    flex-wrap: wrap;
}
.tab-label {
    color: White;
    background: LightGray;
    margin-right: 5px;
    padding: 3px 12px;
    order: -1;
}
.tab-content {
    width: 100%;
    display: none;
}
/* アクティブなタブ */
.tab-switch:checked+.tab-label {
    background: DeepSkyBlue;
}
.tab-switch:checked+.tab-label+.tab-content {
     display: block;
}
/* ラジオボタン非表示 */
.tab-switch {
    display: none;
}


.planCard-inner.oriconbox h3 {
    position: relative;
    background: #f4f4f4;
    border-radius: 5px;
    font-size: 1.06rem;
    padding: 7px 0 7px 12px;
    margin: 5px 0 10px;
}
.planCard-inner.oriconbox h3:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    display: block;
    width: 3px;
    height: calc(100% - 20px);
    background: #04c1e3;
    border-radius: 5px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.planCard-inner.oriconbox h4 {
    font-size: 1rem;
}
.planCard-inner.oriconbox h4:before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 6px;
    background: #04c1e3;
    margin-right: 4px;
}
.planCard-inner.oriconbox p {
    font-size: 0.926rem;
    margin: 0 0 18px;
}
.planCard-inner.oriconbox p.oriconbox-nom-p {
    margin: 0 0 3px;
}
.planCard-inner.oriconbox strong {
    background: linear-gradient(transparent 60%, #fff700 60%);
}
.planCard-inner.oriconbox em {
    color: #fb5426;
    font-weight: bold;
}
.planCard-inner.oriconbox b {
    font-weight: bold;
}
.planCard-inner.oriconbox p.ob-small {
    line-height: 1.3;
}
.planCard-inner.oriconbox p.ob-small small {
    color: #999;
    font-size: 80%;
}

.planCard-inner.oriconbox blockquote {
    background: #f6f6f6;
    padding: 5px 15px 15px;
    margin: 0 0 18px;
}
.planCard-inner.oriconbox blockquote:before {
    content: '\f10d';
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    -webkit-font-smoothing: antialiased;
    color: #d7d7d7;
    display: block;
}
.planCard-inner.oriconbox blockquote p {
    color: #555;
    font-size: 80%;
    line-height: 1.7;
    padding: 0;
    margin: 0;
}

.planCard-inner.oriconbox ul {
    padding: 0 10px;
}
.planCard-inner.oriconbox ul li {
    margin: 0 0 3px;
}
.planCard-inner.oriconbox ul li:before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border: 1px solid #04c1e3;
    border-radius: 3px;
    vertical-align: middle;
    margin: 0 7px 4px 0;
}
.planCard-inner.oriconbox ol {
    padding: 0 10px;
}
.planCard-inner.oriconbox ol li {
    margin: 0 0 3px;
}
.planCard-inner.oriconbox ol li:before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border: 1px solid #04c1e3;
    border-radius: 3px;
    vertical-align: middle;
    margin: 0 7px 4px 0;
}
.planCard-inner.oriconbox ul.ocb-list_box {
    border: 2px solid #f7f7f7;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 2%);
    border-radius: 5px;
    padding: 15px 20px;
    margin: 0 0 15px;
}


.planCard-inner.oriconbox figure {
    max-width: 520px;
    border: 2px solid #f1f1f1;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    border-radius: 5px;
    line-height: 1.5;
    padding: 15px 20px;
    margin: 20px auto 25px;
}
.planCard-inner.oriconbox figure figcaption {
    color: #555;
    font-size: 0.76rem;
}
.planCard-inner.oriconbox figure figcaption small {
    display: block;
    color: #999;
    margin: 0 0 5px;
}

.planCard-inner.oriconbox table.feeTbl ul {
    padding: 0;
}
.planCard-inner.oriconbox table.feeTbl ul li:before {
    content: none;
}

img.oriconbox-img-maxs {
    display: block;
    max-width: 80%;
    border-radius: 5px;
    margin: 15px auto;
}
.secField-wrap img.alignnone {
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 10%);
    margin: 5px auto 0;
}

.btn-cta {
    margin: 30px auto 40px;
}
.btn-cta a {
    display: block;
    max-width: 360px;
    /*
    background: #FEDB3A;
    */
    background: #ff7e36;
    border-radius: 10px;
    box-shadow: 0 5px 0 rgba(0,0,0,0.05);
    color: #fff;
    font-size: 1.06rem;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    padding: 15px 0;
    margin: 0 auto;
}
.btn-cta a:hover {
    opacity: 0.6;
    transition: 0.2s;
}
.btn-cta a i {
    color: #fedb3a;
}

.btn-cta.sub a {
    background: #fff;
    border: 1px solid #efefef;
    color: #333;
    font-size: 0.86rem;
    padding: 10px 0;
}
.btn-cta.sub i {
    color: #04c1e3;
}

.btn-cta.btn-off a {
    background: #f6f6f6;
    color: #bdbdbd;
}
.btn-cta.btn-off a i {
    color: #bdbdbd;
}



aside#sidebar .cta-main {
    margin: 0 auto 20px;
}
.cta-main {
    max-width: 300px;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    padding: 30px;
    margin: 30px auto 0;
}
.cta-main figure {
    margin: 0 auto 10px;
}
.cta-main figure img {
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 10%);
}
p.cta-main-head {
    display: block;
    font-size: 1.1rem;
    text-align: center;
    line-height: 1.6;
    margin: 0 auto 10px;
}
.cta-main .emp {
    display: block;
    font-size: 0.8rem;
    font-weight: bold;
    text-align: center;
}
.cta-main .btn-cta {
    margin: 0 auto;
}


/*
#morelist {
    position: relative;
    counter-increment: ranking;
}
#morelist:before {
    content: "#" counter(ranking);
    position: absolute;
    right: 10px;
    top: 5px;
    display: block;
    color: #aaa;
    font-size: 0.6rem;
    font-weight: bold;
    text-align: center;
    z-index: 1;
}
*/
.readmore {
  position: relative;
  margin: 50px auto 0;
  padding: 0 0 75px;
}

.readmore label {
  position: absolute;
  display: table;
  left: 50%;
  bottom: 0;
  margin: 0 auto;
  width: 200px;
  padding: 10px 0;
  color: #fff;
  text-align: center;
  border-radius: 5px;
  background-color: #333;
  transform: translateX(-50%);
  cursor: pointer;
  z-index: 1;
}

.readmore label::before{
  content: '続きを見る';
}

.readmore input[type="checkbox"]:checked ~ label::before {
  content: '元に戻す';
}

.readmore input[type="checkbox"]{
  display: none;
}

.readmore-content {
  position: relative;
  height: 200px;
  overflow: hidden;
}

.readmore input[type="checkbox"]:checked ~ .readmore-content {
  height: auto;
}

.planRevlist-box {
    background: #fff;
    border: 2px solid #efefef;
    border-radius: 5px;
    box-shadow: 0 7px 3px -5px rgb(0 0 0 / 5%);
    padding: 20px 25px;
    margin: 0 0 30px 0;
}
.planRevlist-box:first-child {
}
.paneRevlist-label {
    display: block;
    width: fit-content;
    background: #04c1e3;
    border-radius: 3px;
    color: #fff;
    font-size: 0.7rem;
    font-weight: bold;
    padding: 0 15px;
    margin: 0 0 10px;
}
.planRevlist-head {
    display: flex;
    margin: 0 0 10px 0;
}
.planRevlist-head figure {
    width: 60px;
    margin: 0 20px 0 0;
}
.planRevlist-head figure img {
    border-radius: 30px;
    border: 1px solid #f3f3f3;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    padding: 2px;
}
.planRevlist-right {
    width: 90%;
    line-height: 1.5;
}
.planRevlist-title {
    font-weight: bold;
}
.planRevlist-user {
    color: #aaa;
    font-size: 0.86rem;
}
.planRevlist-score {
    color: #fb5426;
    font-size: 1.16rem;
    font-weight: bold;
}
.planRevlist-score b {
    font-size: 1.2rem;
}

.planRevlist-score-class {
    display: flex;
}
.planRevlist-score-class li {
    color: #b0b0b0;
    font-size: 0.76rem;
    padding: 0;
    margin: 0 5px 0 0;
}
.planRevlist-score-class li:first-child {
}

.planRevlist-merit {
    display: block;
    font-size: 0.96rem;
}
.planRevlist-merit:before {
    content: "\f059";
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 90%;
    color: #04c1e3;
    margin: 0 4px 0 0;
}
.planRevlist-demerit {
    display: block;
    font-size: 0.96rem;
}
.planRevlist-demerit:before {
    content: "\f4ad";
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 90%;
    color: #04c1e3;
    margin: 0 4px 0 0;
}
.planRevlist-text {
}


ul.secField-ulbox {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    padding: 20px;
    margin: 0 0 15px;
}
li.curationMerit {
    display: flex;
    align-content: center;
    color: #0097a7;
    font-size: 0.96rem;
}
li.curationMerit:before {
    content: "\f058";
    font-family: "Font Awesome 5 Free";
    color: #0097a7;
    margin-right: 5px;
}
li.curationMerit span {
    display: block;
}
li.curationDmerit {
    display: flex;
    align-content: center;
    color: #ef633e;
    font-size: 0.96rem;
}
li.curationDmerit:before {
    content: "\f057";
    font-family: "Font Awesome 5 Free";
    color: #ef633e;
    margin-right: 5px;
}
li.curationDmerit span {
    display: block;
}

.curationBoard {
    display: flex;
    margin: 0 0 30px;
}
.curationBoard--wrap {
    width: 50%;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    padding: 15px 20px;
    margin: 0;
}
.curationBoard--wrap.curationMerit {
    margin-right: 20px;
}
.curationBoard--wrap.curationMerit h4 {
    color: #04c1e3;
    font-size: 0.96rem;
}
.curationBoard ul li {
    position: relative;
    font-size: 0.9rem;
    line-height: 1.6;
    padding: 0 0 0 15px;
    margin: 7px 0;
}
.curationBoard ul li:last-child {
    margin: 7px 0 0;
}
.curationBoard ul li:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    position: absolute;
    display: inline-block;
    font-size: 0.8rem;
    font-weight: bold;
    top: 1px;
    left: 0;
}
.curationBoard--wrap.curationDemerit h4 {
    color: #ef633e;
    font-size: 0.96rem;
}
section .innerMain .curationBoard--wrap.curationDemerit h4:before {
    width: 5px;
    background: #ef633e;
}
.curationBoard--wrap.curationMerit ul li {
    color: #04c1e3;
}
.curationBoard--wrap.curationDemerit ul li {
    color: #ef633e;
}
.curationBoard--wrap.curationMerit ul li:before {
    content: "\f058";
    color: #04c1e3;
}
.curationBoard--wrap.curationDemerit ul li:before {
    content: "\f057";
    color: #ef633e;
}

.revSuggestlist {
    margin: 0 0 20px;
}
.revSuggestlist p {
    display: block;
    border-bottom: 1px solid #eaeaea;
    font-size: 0.96rem;
    padding: 0 0 5px;
    margin: 0 0 10px;
}
.revSuggestlist p i {
    color: #04c1e3;
}
.revSuggestlist ul li {
    display: inline-block;
    background: #fff;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    border-radius: 30px;
    color: #444;
    font-size: 0.76rem;
    padding: 0 12px;
    margin: 0 5px 0 0;
}

.planHead3 small {
    display: block;
    color: #acacac;
    font-size: 75%;
    font-weight: normal;
}
.reviewsMatome {
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    padding: 15px 20px;
    margin: 0;
}
.reviewsMatome p {
    font-size: 0.926rem;
}


.top_rankingGroup {
    display: flex;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding: 0 0 20px;
}
.top_rankingGroup-card {
    flex: 0 0 40%;
    scroll-snap-align: center;
    background: #fff;
    border: 1px solid #f5f5f5;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 10%);
    color: #04c1e3;
    font-size: 0.96rem;
    padding: 0;
    margin: 0 20px 0 0;
}
.top_rankingGroup-card h3 {
    display: block;
    background: #04c1e3;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #fff;
    font-size: 0.96rem;
    text-align: center;
    line-height: 1;
    padding: 10px 0;
    margin: 0;
}
.top_rankingGroup-card ul {
    padding: 15px 20px;
}
.top_rankingGroup-card ul li {
    position: relative;
    counter-increment: ranking-number;
    font-size: 0.86rem;
    font-weight: bold;
    margin: 0 0 5px;
}
.top_rankingGroup-card ul li:before {
    content: counter(ranking-number);
    width: 18px;
    height: 18px;
    display: inline-block;
    background: #e6e6e6;
    border-radius: 15px;
    color: #5b5b5b;
    font-size: 0.6rem;
    font-weight: bold;
    text-align: center;
    margin-right: 5px;
    z-index: 1;
}
.top_rankingGroup-card ul li:nth-child(1):before {
    background: #fed240;
    color: #fff;
}
.top_rankingGroup-card ul li:nth-child(2):before {
    background: #b0b0b0;
    color: #fff;
}
.top_rankingGroup-card ul li:nth-child(3):before {
    background: #c47d33;
    color: #fff;
}
.top_rankingGroup-card ul li a {
    color: #333;
    text-decoration: none;
    vertical-align: middle;
}



.toggle {
    display: none;
}
.Label {
    display: block;
    background: #fff;
    border-radius: 5px;
    color: #b2b2b2;
    font-size: 0.86rem;
    text-align: center;
    padding: 5px 0;
    margin: 0;
}
.Label::after{
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    vertical-align: middle;
    transform: rotate(135deg);
    padding: 0 0 0;
    margin: -5px 0 0 5px;
}
.toc-aco {
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
}
.Label,
.toc-aco-content {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform: translateZ(0);
    transition: all 0.3s;
}
.toc-aco-content {
    display: flex;
    background: #fff;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    height: 0;
    margin-bottom:10px;
    padding:0 20px;
    overflow: hidden;
}
.toggle:checked + .Label + .toc-aco-content {
    height: auto;
    padding: 0 30px 25px;
    transition: all .3s;
}
.toggle:checked + .Label::after {
    margin: 0 0 0 5px;
    transform: rotate(-45deg) !important;
}

.toc-aco-content .toc-aco-kvwrap {
    width: 40%;
    line-height: 1.6;
    margin-right: 20px;
}
.toc-aco-content .toc-aco-kvwrap figure {
    line-height: 1.6;
}
.toc-aco-content .toc-aco-kvwrap figcaption {
    font-size: 0.9rem;
    font-weight: bold;
}
.toc-aco-content .toc-aco-kvwrap img {
}
.toc-aco-content ol {
    counter-reset: cnt;
    width: 60%;
    background: #f9f9f9;
    border-radius: 5px;
    padding: 20px;
}
.toc-aco-content ol strong {
    font-size: 0.8rem;
}
.toc-aco-content ol li {
    font-size: 0.76rem;
    margin: 0;
}
.toc-aco-content ol > li {
    margin: 0 0 5px;
}
.toc-aco-content ol > li:before {
    counter-increment: cnt;
    content: counter(cnt);
    width: 20px;
    height: 20px;
    display: inline-block;
    background: #ededed;
    border-radius: 15px;
    color: #5b5b5b;
    font-size: 0.66rem;
    font-weight: bold;
    text-align: center;
    margin-right: 3px;
}
.toc-aco-content ol li a {
    color: #333;
}
.toc-aco-content ol > li > a {
    font-weight: bold;
}
.toc-aco-content ol li > ul {
    list-style: outside;
    padding: 0 0 0 35px;
    margin: 0;
}
.toc-aco-content ol li > ul > li > ul {
    list-style: circle;
    padding: 0;
    margin: 0 0 0 20px;
}

.toc-aco-kvauthor {
    padding: 15px 0 0;
}
.toc-aco-kvauthor figure {
    display: flex;
    width: 100%;
    align-items: center;
    margin: 0 auto 10px;
}
.toc-aco-content .toc-aco-kvauthor figure img {
    display: block;
    width: 45px;
    border-radius: 100px;
    border: 1px solid #ffffff;
    border-radius: 100px;
    box-shadow: 0 1px 5px rgb(0 0 0 / 10%);
}
.toc-aco-content .toc-aco-kvauthor figure figcaption {
    font-size: 0.8rem;
    line-height: 1.4;
    padding: 0 0 0 10px;
}
.toc-aco-content .toc-aco-kvwrap figcaption strong {
    display: block;
}
.toc-aco-content .toc-aco-kvwrap figure figcaption small {
    color: #9d9d9d;
    font-weight: normal;
}
.top-aco-profile p {
    font-size: 0.76rem;
}
.top-aco-profile p a {
    color: #999;
}


.morelink{
    display: block;
    max-width: fit-content;
    border: 1px solid #04c1e3;
    background: #fff;
    color: #04c1e3;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    font-size: 0.8rem;
    font-weight: bold;
    text-align: center;
    padding: 10px 50px;
    margin: -10px auto 0;
}
.morelink:hover{
    cursor: pointer;
    background: #04c1e3;
    border: 1px solid #04c1e3;
    color: #fff;
}



.secField-wrap h2 {
    position: relative;
    background: linear-gradient(90deg, #8ec0f0 0, #04c1e3 20%, #04c1e3 30%, #04c1e3 10%, #2dd6eb);
    border-bottom: 3px solid #f2f2f2;
    border-radius: 5px;
    color: #fff;
    font-size: 1.4rem;
    padding: 10px 10px 10px 37px;
}
.secField-wrap h2:before {
    content: "";
    position: absolute;
    display: block;
    left: 15px;
    top: 50%;
    width: 13px;
    height: 13px;
    background: #FEDB3A;
    border-radius: 3px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.secField-wrap h3 {
    position: relative;
    font-size: 1.3rem;
    padding: 0 0 0 13px;
    margin: 10px 0;
}
.secField-wrap h3:before {
    content: "";
    position: absolute;
    display: block;
    left: 0;
    top: 50%;
    width: 5px;
    height: calc(100% - 5px);
    background: #04c1e3;
    border-radius: 5px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
h3#c01-02, h3#c01-03, h3#c01-04, h3#c01-05, h3#c01-06 {
    margin: 10% 0 1.5%;
}
h3#c01-01 {
    margin: 0 0 1.5%;
}
@media (max-width: 640px) {
    h3#c01-02, h3#c01-03, h3#c01-04, h3#c01-05, h3#c01-06 {
    }
}


.secField-wrap.contentbox p {
    font-size: 1rem;
    margin-bottom: 18px;
}
.secField-content p {
    margin: 0 0 10px;
}

.innerSide {
    width: 26%;
}

.secField {
    padding: 0 0 30px;
    margin: 0;
}
.secField-wrap {
    padding: 0 30px;
    margin: 0 0 40px;
}
.secField-content {
    padding: 25px;
}
.secField-wrap-inner {
    padding: 20px 3px;
}

.secFlex {
    padding: 30px;
}
.secField-right {
}
.secField-left {
    margin: 0;
}
.secField-kv {
    margin: 0 0 20px;
}
.secField-kv img {
    display: block;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 10%);
}
.secField-kv_sample {
    border: 1px solid #efefef;
    box-shadow: 0 7px 3px -5px rgb(0 0 0 / 5%);
    border-radius: 5px;
}

.secField-copyPrice {
    text-align: center;
    border-radius: 3px;
    padding: 0;
    margin: 0;
}
.secField-copyPrice p {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    font-weight: bold;
    text-align: center;
    margin: 0 auto;
}
.secField-copyPrice p span {
    position: relative;
    display: block;
    height: fit-content;
    background: #04c1e3;
    border-radius: 2px;
    color: #fff;
    font-size: 0.76rem;
    line-height: 1;
    padding: 6px 10px;
    margin: 5px 10px 0;
}
.secField-copyPrice p span:after {
    content: '';
    width: 0;
    height: 0;
    border-color: transparent transparent transparent #04c1e3;
    border-width: 10px 0 10px 10px;
    border-style: solid;
    position: absolute;
    right: -5px;
    top: 1px;
}
.secField-copyPrice p strong {
    display: block;
    font-size: 2.2rem;
    font-family: "Oswald","Helvetica Neue",Helvetica,Arial,sans-serif;
}
.secField-copyPrice p strong small {
    font-size: 70%;
}

ul.service-iconList {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0;
    margin: 0;
}
ul.service-iconList li {
    position: relative;
    width: 32%;
    background: #fff;
    border: 1px solid #f3f3f3a6;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    border-radius: 3px;
    font-weight: bold;
    text-align: center;
    line-height: 1;
    padding: 20px 0;
    margin: 0 0 7px;
}
ul.service-iconList li.sil_FALSE, ul.service-iconList li.sil_FALSE i {
    color: #aaa;
}
div#wrap ul.service-iconList li.sil_FALSE, article.contentSec ul.service-iconList li.sil_FALSE {
    background: #efefef;
    border: 1px solid #efefef;
}
ul.service-iconList li.sil_FALSE:after {
    content: "";
    display: block;
    width: 102%;
    height: 1px;
    border-top: 1px dotted #aaa;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) rotate(20deg);
}
ul.service-iconList li i {
    display: block;
    color: #04c1e3;
    font-size: 1.1rem;
    margin: 0 0 5px;
}
ul.service-iconList li span {
    display: inline-block;
    font-size: 0.76rem;
}

.checktbl {
    border: 1px solid #efefef;
    border-radius: 3px;
    box-shadow: 0 7px 3px -5px rgb(0 0 0 / 5%);
    margin: 0 0 30px;
}
.checktbl dl {
    display: flex;
    border-bottom: 1px dashed #e9e9e9;
    padding: 7px 0;
    margin: 0;
}
.checktbl dl:last-child {
    border: none;
}
.checktbl dl dt {
    min-width: 200px;
    font-size: 0.8rem;
    font-weight: bold;
    padding: 3px 0 0 10px;
}
.checktbl dl dt i {
    width: 20px;
    height: 20px;
    background: #f7f7f7;
    border-radius: 10px;
    color: #9d9d9d;
    font-size: 11px;
    text-align: center;
    vertical-align: middle;
    padding: 4px 0 0;
    margin: 0 5px 1px 0;
}
.checktbl dl dd {
    display: flex;
}
.checktbl dl dd span {
    display: block;
    width: 30px;
    height: 30px;
    background: #f5f5f5;
    border-radius: 2px;
    text-align: center;
    padding: 0;
}
.checktbl dl dd span.service__TRUE:after {
    content: "\f111";
    font-family: 'Font Awesome 6 Free';
    color: #04c1e3;
}
.checktbl dl dd span.service__FALSE:after {
    content: "\f068";
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    color: #aaa;
}
.checktbl dl dd i.fa-regular.fa-circle {
    color: #04c1e3;
}
.checktbl dl dd span i.fa-solid.fa-minus {
    color: #aaa;
}
.checktbl dl dd p {
    display: block;
    font-size: 0.76rem;
    vertical-align: middle;
    padding: 3px 0 0 15px;
}

ul.secField-list {
    border: 1px solid #efefef;
    border-radius: 3px;
    box-shadow: 0 7px 3px -5px rgb(0 0 0 / 5%);
    padding: 15px 25px;
    margin: 0 0 20px;
}
ul.secField-list li {
    position: relative;
    font-size: 0.9rem;
    line-height: 1.6;
    padding: 0 0 0 15px;
    margin: 7px 0;
}
ul.secField-list li:before {
    font-family: "Font Awesome 5 Free";
    content: "";
    position: absolute;
    display: inline-block;
    font-size: 0.8rem;
    font-weight: bold;
    top: 1px;
    left: 0;
}
ul.secField-list.m_list li:before {
    content: "\f058";
    color: #0097a7;
}
ul.secField-list.d_list li:before {
    content: "\f057";
    color: #f2684c;
}

.secField-lead {
    padding: 5px 0;
}
.secField-leadhead {
    position: relative;
    font-size: 1.06rem;
    padding: 0 0 0 15px;
    margin: 0 0 10px;
}
.secField-leadhead:before {
    content: "";
    position: absolute;
    display: block;
    left: 0;
    top: 50%;
    width: 5px;
    height: calc(100% - 5px);
    background: #04c1e3;
    border-radius: 5px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.serviceContent.ranking .secField-leadhead > a {
    display: inline;
    text-decoration: underline;
    padding: 0;
}

.secField-osusume {
    position: relative;
    border: 2px solid #efefef;
    border-radius: 5px;
    box-shadow: 0 7px 3px -5px rgb(0 0 0 / 5%);
    padding: 20px 20px 15px 20px;
    margin: 30px 0;
}
.secField-osusume p {
    position: absolute;
    display: block;
    top: -13px;
    left: 20px;
    background: #fff;
    color: #04c1e3;
    font-size: 1rem;
    font-weight: bold;
    padding: 0 10px;
    margin: 0;
}
.secField-osusume p i {
    margin-right: 5px;
}
.secField-osusume ul li {
    position: relative;
    font-size: 1rem;
    font-weight: bold;
    padding: 0 0 0 20px;
}
.secField-osusume ul li:before {
    content: "\f058";
    font-family: "Font Awesome 5 Free";
    position: absolute;
    display: inline-block;
    color: #04c1e3;
    font-weight: bold;
    top: 1px;
    left: 0;
}


nav.content-nav {
    display: none;
}
nav.content-nav {
    background: #f0f3f7;
    padding: 20px 20px 40px;
    margin: 0 0 10px;
}
nav.content-nav span {
    color: #04c1e3;
    font-size: 0.9rem;
    font-weight: bold;
}
nav.content-nav span small {
    color: #aaa;
    margin: 0 0 0 5px;
}
nav.content-nav ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 7px 3px -5px rgb(0 0 0 / 5%);
}
nav.content-nav ul li {
    width: 100%;
}
nav.content-nav ul li a {
    display: block;
    color: #333;
    font-size: 0.9rem;
    font-weight: bold;
    text-decoration: none;
    padding: 7px 12px;
}
nav.content-nav ul > li > a {
    border-bottom: 1px solid #efefef;
}
nav.content-nav ul li a i {
    width: 24px;
    height: 24px;
    color: #04c1e3;
    background: #fff;
    border: 1px solid #04c1e3;
    border-radius: 12px;
    font-size: 0.76rem;
    vertical-align: middle;
    text-align: center;
    padding: 5px 3px;
    margin: 0 5px 0 0;
}
nav.content-nav ul li ol {
}
nav.content-nav ul li ol li {
}
nav.content-nav ul li ol li a {
    display: flex;
    align-items: center;
    border-bottom: 1px dashed #efefef;
    color: #555;
    font-size: 0.76rem;
    padding: 5px 12px 5px 20px;
}
nav.content-nav ul li ol li a:before {
    content: "";
    display: block;
    border: 4px solid #04c1e3;
    border-radius: 10px;
    margin: 0 5px 0 0;
}


.txtBox-warning {
    border: 1px solid #efefef;
    box-shadow: 0 7px 3px -5px rgb(0 0 0 / 5%);
    border-radius: 5px;
    padding: 20px;
    margin: 0 30px 50px;
}
.txtBox-warning p {
    color: #777;
    font-size: 0.66rem;
    line-height: 1.3;
    margin: 3px 0 0;
}
.txtBox-warning a {
    color: #bbb;
}

.mainbox--info-label {
    display: flex;
}
span.head-label {
    display: block;
    width: fit-content;
    border: 1px solid #efefef;
    border-radius: 5px;
    color: #333;
    font-size: 0.76rem;
    font-weight: bold;
    text-align: center;
    line-height: 1.2;
    padding: 5px 10px;
    margin: 0 7px 0 0;
}
span.head-label i {
    color: #fedb3a;
    margin-right: 3px;
}
span.head-label b {
    color: #fb5426;
    font-size: 120%;
    padding: 0 2px;
}
span.head-label.label-quality {
    display: flex;
    align-items: center;
}
span.head-label.label-quality img {
    max-width: 18px;
    margin: 0 2px 0 0;
}

@media (max-width: 640px) {
    span.head-label {
        font-size: 0.76rem;
        padding: 4px 7px;
    }
    span.head-label.label-quality img {
        max-width: 16px;
    }
}

span.head-flag {
    display: block;
    width: fit-content;
    background: #f2684c;
    border-radius: 3px;
    color: #fff;
    font-size: 0.76rem;
    font-weight: bold;
    text-align: center;
    padding: 0 7px;
    margin: 0;
}
.serviceContent-label {
    margin: 0 0 5px;
}
.serviceContent-label span.head-flag {
    font-size: 0.66rem;
}

.search-head2 {
    position: relative;
    font-size: 1.1rem;
    padding: 0 15px;
    margin: 0 0 15px;
}
.search-head2:before {
    content: "";
    position: absolute;
    display: block;
    left: 0;
    top: 50%;
    width: 5px;
    height: calc(100% - 15px);
    background: #04c1e3;
    border-radius: 5px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.search-head2 b {
    color: #f2684c;
    font-size: 120%;
    margin: 0 5px;
}


section.serviceContent {
    position: relative;
    counter-increment: list;
    background: #fff;
    border: 1px solid #f3f3f3a6;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    padding: 25px 20px;
    margin: 0 0 40px;
}
section.serviceContent:before {
    content: counter(list);
    position: absolute;
    left: -10px;
    top: -10px;
    width: 25px;
    height: 25px;
    display: block;
    background: #efefef;
    border-radius: 15px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    color: #5b5b5b;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    padding: 1px 0 0;
    margin-right: 3px;
    z-index: 1;
}
section.serviceContent b {
    color: #f2684c;
    font-weight: bold;
}
.serviceContent-body {
    display: flex;
    justify-content: space-around;
    color: #333;
    text-decoration: none;
}
.serviceContent-links {
    display: flex;
    justify-content: center;
    gap: 2%;
    padding: 20px 10px 10px;
}
.serviceContent-links a {
    flex: 1;
    display: block;
    border-radius: 10px;
    box-shadow: 0 5px 0 rgba(0, 0, 0, 0.05);
    color: #333;
    font-size: 1rem;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    padding: 15px 0;
}
.serviceContent-links a:hover {
    opacity: 0.6;
    transition: 0.2s;
}
.serviceContent-links a.serviceContent-links-more {
    border: 2px solid #e7e7e7;
}
.serviceContent-links a.serviceContent-links-more i {
    color: #04c1e3;
}
.serviceContent-links a.serviceContent-links-lp {
    border: 2px solid #ff7e36;
    background: #ff7e36;
    color: #fff;
}
.serviceContent-links a.serviceContent-links-lp i {
    color: #FEDB3A;
}

.serviceContent-img {
    width: 25%;
}
.serviceContent-img img {
    display: block;
    object-fit: cover;
    border: 1px solid #efefef;
    box-shadow: 0 7px 3px -5px rgb(0 0 0 / 5%);
    border-radius: 5px;
}
.serviceContent-inner {
    width: 70%;
}

h3.serviceContent-title {
    font-size: 1.3rem;
    line-height: 1.3;
}
h3.serviceContent-title a {
    color: #333;
    text-decoration: none;
}
p.serviceContent-score {
    margin: 0 0 5px;
}

.serviceContent-info {
}

.serviceContent-table {
    border: 1px solid #efefef;
    border-radius: 3px;
    margin: 0 0 10px;
}
.serviceContent-info dl {
    display: flex;
    justify-content: start;
    align-items: stretch;
    border-bottom: 1px dashed #efefef;
    font-size: 0.86rem;
}
.serviceContent-info dl:last-child {
    border: none;
}
.serviceContent-info dl dt {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 15%;
    min-width: 60px;
    background: #f0f3f7;
    font-size: 0.7rem;
    font-weight: bold;
    text-align: center;
    padding: 0;
}
.serviceContent-info dl dt i {
    color: #24a78c;
    margin-right: 3px;
}
.serviceContent-info dl dd {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    width: 85%;
    font-size: 0.8rem;
    font-weight: bold;
    vertical-align: middle;
    padding: 5px 15px;
}
.serviceContent-info dl dd span {
    display: block;
    width: 100%;
}
.serviceContent-info dl dd span b {
    font-size: 120%;
}



.serviceContent-info ul.service-iconList {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0;
    margin: 0;
}
.serviceContent-info ul.service-iconList li {
    width: auto;
    background: #fbfbfb;
    border: 1px solid #efefef;
    border-radius: 3px;
    box-shadow: none;
    padding: 3px 5px 5px 5px;
    margin: 0 0 4px 0;
}
.serviceContent-info ul.service-iconList li:last-child {
    margin: 0 0 4px 0;
}
.serviceContent-info ul.service-iconList li i {
    display: inline-block;
    font-size: 0.7rem;
    margin: 0 3px 0 0;
}
.serviceContent-info ul.service-iconList li span {
    display: inline-block;
    font-size: 0.7rem;
}
.serviceContent-info ul.service-iconList li.sil_FALSE:after {
    width: 100%;
    transform: translate(-50%,-50%) rotate(13deg);
}





main.ranking .search-head2 {
    font-size: 1.5rem;
    margin: 0 0 10px;
}
main.ranking .search-head2:before {
    height: calc(100% - 5px);
}
main.ranking .serviceContent:before {
    content: none;
}

.serviceContent.ranking {
    background: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
}
.serviceContent.ranking .serviceContent-inner-body {
    padding: 15px 0 30px;
}
.serviceContent.ranking .serviceContent-img {
    width: 100%;
}
.serviceContent.ranking .serviceContent-img img {
    width: 100%;
}
.serviceContent.ranking .serviceContent-inner {
    width: 100%;
}
.serviceContent.ranking .serviceContent-title {
    font-size: 1.2rem;
}
.serviceContent.ranking .serviceContent-score {
    font-size: 1.2rem;
}
.serviceContent.ranking .serviceContent-info dl dt {
    font-size: 0.86rem;
}
.serviceContent.ranking .serviceContent-info dl dd {
    font-size: 0.9rem;
}
.serviceContent.ranking .secField-lead p {
    margin: 0 0 16px;
}
.serviceContent.ranking .secField-lead p strong {
    background: linear-gradient(transparent 60%, #fff700 60%);
}
.serviceContent.ranking .secField-lead p em {
    color: #fb5426;
    font-weight: bold;
}
.serviceContent.ranking .secField-lead p a {
    display: inline;
    justify-content: inherit;
    color: #ff5e93;
    text-decoration: underline;
    padding: 0;
}

.ranking-inner p strong {
    background: linear-gradient(transparent 60%, #fff700 60%);
}
.ranking-inner p em {
    color: #fb5426;
    font-weight: bold;
}
.ranking-inner p a {
    display: inline;
    justify-content: inherit;
    color: #ff5e93;
    text-decoration: underline;
    padding: 0;
}

.serviceContent.ranking .serviceContent-info ul.service-iconList {
    width: 100%;
    padding: 7px 0;
}
.serviceContent.ranking .serviceContent-info ul.service-iconList li {
    width: 16%;
    margin: 0;
}
.serviceContent.ranking .serviceContent-info ul.service-iconList li span {
    width: auto;
}
.serviceContent.ranking .btn-cta {
    margin: 30px auto 30px;
}
.serviceContent.ranking .btn-cta a {
    justify-content: center;
    align-items: center;
    padding: 15px 0;x
}
.serviceContent.ranking .btn-cta a i {
    margin-left: 5px;
}
.serviceContent.ranking .btn-cta a.btn-detail {
    background: #fff;
    border: 1px solid #efefef;
}
.serviceContent.ranking .serviceContent-info dl dd span b {
    font-size: 130%;
}

.serviceContent-note {
    color: #bdbdbd;
    font-size: 0.8rem;
}


.content-links {
    padding: 30px 0;
}
.content-links p {
    margin: 7px 0;
}

.ranking-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 0;
    margin: 0;
}
.ranking-nav li {
    width: 15.5%;
    margin: 0 10px 10px 0;
}
.ranking-nav li:nth-child(6n) {
    margin: 0 0 10px 0;
}
.ranking-nav li:last-child {
    margin: 0;
}
.ranking-nav li a {
    display: block;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    color: #04c1e3;
    font-size: 0.8rem;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    line-height: 1.3;
    padding: 15px 0;
}
.ranking-nav li a:hover {
    background: #04c1e3;
    color: #fff;
    transition: 0.2s;
}


.ranking-description h2 {
    font-size: 1.1rem;
    margin: 0 0 7px;
}
.ranking-description-box {
    display: flex;
    background: #fff;
    border: 1px solid #f3f3f3a6;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    margin: 0 0 20px;
}
.ranking-description-box img {
    width: 200px;
    height: 140px;
    object-fit: cover;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}f
.ranking-description-body {
    padding: 10px 20px;
}
.ranking-description-body h3 {
    font-size: 0.96rem;
}
.ranking-description-body p {
    font-size: 0.86rem;
    line-height: 1.7;
}


#entry-content.ranking {
}
#entry-content.ranking h2 {
    font-size: 1.2rem;
}
#entry-content.ranking h2 small {
    display: block;
    color: #04c1e3;
    font-size: 70%;
}
#entry-content.ranking p {
    font-size: 0.96rem;
    line-height: 1.6;
    margin: 0 0 18px;
}
#entry-content.ranking h3 {
    font-size: 1.16rem;
    padding: 5px 0;
}
#entry-content.ranking h4 {
    font-size: 1rem;
    line-height: 1.5;
    padding: 2px 0 2px 10px;
}
#entry-content.ranking h5 {
    font-size: 0.96rem;
}
#entry-content.ranking ol {
    font-size: 0.86rem;
}



.ranking-inner p {
    margin: 0 0 18px;
}
.ranking-head {
    color: #222;
    background-image: repeating-linear-gradient(135deg, #fed240, #fed240 5px, #fed651 5px, #fed651 7px);
    text-align: center;
    line-height: 1.5;
    padding: 30px 0 0;
}
.ranking-head span {
    display: block;
    font-size: 1rem;
}
.ranking-frame-left {
    position: absolute;
    top: 0;
    left: 20px;
    width: 100px;
    height: 250px;
    background-image: url(./img/frame_ranking.png);
    background-size: 150px;
    background-repeat: no-repeat;
    background-position: 30px 125px;
    z-index: 2;
    margin: 0 auto;
    display: block;
}
.ranking-frame-right {
    position: absolute;
    top: 0;
    right: 20px;
    width: 100px;
    height: 250px;
    background-image: url(./img/frame_ranking.png);
    background-size: 150px;
    background-repeat: no-repeat;
    background-position: 30px 125px;
    transform: scale(-1, 1);
    z-index: 2;
    margin: 0 auto;
    display: block;
}
.ranking-title {
    position: relative;
    max-width: 800px;
    background: #fffdf9;
    background-image: radial-gradient(#ffefc2 0.5px, #fff5d8 0.5px);
    background-size: 5px 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    font-weight: 900;
    padding: 20px 0 40px;
    margin: 0 auto;
}
.ranking-title img {
    max-width: 50px;
}
.ranking-title h1 {
    font-size: 1.8rem;
    text-shadow: 1px 1px 0 #fff;
    padding: 0;
    margin: 12px 0 15px;
}
br.ranking-sp {
    display: none;
}
.ranking-title-topsup {
    color: #fb5426;
    text-shadow: 1px 1px 0 #fff;
    margin-bottom: 20px;
}
.ranking-title-month:before {
    content: "";
    display: block;
    width: 70%;
    height: 0px;
    border-bottom: 5px dotted #fed240;
    margin: 0 auto;
}
.ranking-title-month span {
    display: block;
    width: fit-content;
    background: #fff;
    border-radius: 15px;
    box-shadow: 0 5px 5px -5px rgb(0 0 0 / 3%);
    color: #444;
    font-size: 0.96rem;
    padding: 3px 14px;
    margin: -17px auto 0;
}
.ranking-title-label {
    position: relative;
    display: block;
    width: fit-content;
    height: 30px;
    background: #04c1e3;
    border-radius: 3px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    color: #fff;
    text-align: center;
    padding: 3px 15px 0;
    margin: 0 auto;
}
.ranking-title-label:before, .ranking-title-label:after {
    content: '';
    top: 0;
    display: block;
    height: 30px;
    border: 15px solid #04c1e3;
    position: absolute;
}
span.ranking-title-label:before {
    left: -15px;
    border-left-width: 5px;
    border-left-color: transparent;
}
span.ranking-title-label:after {
    right: -15px;
    border-right-width: 5px;
    border-right-color: transparent;
}

.ranking-choice {
    padding: 0 0 15px;
}
.ranking-choice-box {
    counter-increment: choice;
    border: 2px solid #efefef;
    box-shadow: 0 5px 3px -5px rgb(0 0 0 / 5%);
    border-radius: 5px;
    padding: 15px;
    margin: 0 0 20px;
}
.ranking-choice-box h3 {
    display: flex;
    align-items: center;
    font-size: 1rem;
    margin: 0 0 3px;
}
.ranking-choice-box h3:before {
    content: counter(choice);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    background: #04c1e3;
    border-radius: 20px;
    color: #fff;
    font-size: 0.7rem;
    text-align: center;
    margin-right: 5px;
}
.ranking-choice-box p {
    font-size: 0.86rem;
    line-height: 1.7;
    margin: 0;
}

.ranking-head1 {
    background: repeating-linear-gradient(135deg, #04c1e3, #04c1e3 5px, #25ad91 5px, #25ad91 7px);
    padding: 30px 0 20px;
    margin: 10px -30px 30px;
}
.ranking-head1 span {
    position: relative;
    display: block;
    width: fit-content;
    background: #fff;
    border: 1px solid #fff;
    border-radius: 20px;
    color: #333;
    font-size: 0.9rem;
    font-weight: bold;
    text-shadow: 1px 1px 0 rgb(0 0 0 / 5%);
    text-align: center;
    padding: 0 15px;
    margin: 0 auto 15px
}
.ranking-head1 span:after {
    position: absolute;
    bottom: -7px;
    left: 45%;
    content: "";
    background: #ffffff;
    height: calc(tan(60deg) * 10px / 2);
    width: 25px;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.ranking-head1 h2 {
    display: block;
    color: #fff;
    font-size: 1.7rem;
    text-shadow: 1px 1px 0 rgba(0,0,0,.1);
    text-align: center;
    line-height: 1.5;
    margin: 0 auto;
}
.ranking-head1 h2 b {
    color: #fff700;
}
.ranking-head4 p {
    font-size: 1.5rem;
    font-weight: bold;
}
.ranking-head1 small {
    display: block;
    color: #fff;
    font-size: 0.9rem;
    text-align: center;
    text-shadow: 1px 1px 0 rgba(0,0,0,.1);
}
#entry-content.ranking .ranking-head1 h2 {
    background: none;
    border: none;
    font-size: 1.7rem;
    padding: 0;
    margin: 0 0 5px;
}

.ranking-reviewbox {
    background: #fff9e8;
    border-radius: 5px;
    padding: 20px;
    margin: 0 0 20px;
}
.ranking-reviewbox .planBoards {
    background: none;
    border: none;
    box-shadow: none;
    padding: 25px;
    margin: 0 auto;
}
.ranking-reviewbox .planRevlist-box {
    border: none;
    margin: 0 0 15px;
}
.ranking-reviewbox .scoreBoard--class_field_bar {
    background: #fff;
}
.ranking-reviewbox i.off {
    color: #ececec;
}
.rankinglist h4 {
    position: relative;
    font-size: 1.1rem;
    padding: 0 0 0 13px;
    margin: 5px 0;
}
.rankinglist h4:before {
    content: "";
    position: absolute;
    display: block;
    left: 0;
    top: 50%;
    width: 5px;
    height: calc(100% - 10px);
    background: #0097a7;
    border-radius: 5px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.rankinglist h4 a {
    color: #333;
}



@media (max-width: 640px) {
    .card header {
        padding: 20px;
    }
    .card header h1 {
        font-size: 1.3rem;
        line-height: 1.5;
    }
    .card .cardSec .mainbox {
    }
    .card .cardSec .mainbox figure {
        width: 22%;
        padding: 15px 0;
    }

    .card .cardSec .mainbox .mainbox--info {
        padding: 0 0 0 5px;
    }
    .card .cardSec .mainbox figure a img {
        display: block;
        max-width: 170px;
        margin: 0 auto;
    }

    .card .cardSec .mainbox .mainbox--info .mainbox--cardname {
        font-size: 1.2rem;
    }

    .card .cardSec .mainbox .mainbox--info .mainbox--label li a {
        font-size: 0.6rem;
    }

    .card .cardSec {
        padding: 15px;
    }

    .card .doge {
        padding: 0;
    }

    .card .doge li {
        width: 100%;
        margin: 0 0 0 15px;
    }

    .card .cardSec figure figcaption {
        width: 60%;
    }
    .card .cardSec figure img {
        max-width: 60px;
        margin: 0 auto;
    }

    .card .cardSec .mainbox figure > a {
    }

    .userReview p {
        font-size: 0.96rem;
    }

    span.head-flag {
        font-size: 0.66rem;
    }

    .card .cardSec .mainbox .mainbox--info .mainbox--disclaimer {
        margin: 0 0 3px;
    }

    .card .cardSec .mainbox .mainbox--info .mainbox--score p.emp {
        font-size: 1rem;
    }
    .card .cardSec .mainbox .mainbox--info .mainbox--score p.emp b {
        font-size: 1.1rem;
    }

    .card .cardSec .mainbox .mainbox--info .mainbox--score dl dd .emp {
        font-size: 1.5rem;
        line-height: 1;
    }

    .card .cardSec .mainbox .mainbox--info .mainbox--score dl dd {
        padding: 10px 0 7px;
    }

    .card .cardSec .mainbox .mainbox--info .mainbox--score dl dd .sup {
        font-size: 0.7rem;
    }

    .card .cardSec .mainbox .mainbox--info .mainbox--score dl dt {
        font-size: 0.76rem;
        padding: 1px 0;
    }

    .card .cardSec .mainbox .mainbox--info .mainbox--desc {
        font-size: 0.86rem;
    }

    .card .contentSec section .innerMain {
        width: 100%;
        border: none;
        box-shadow: none;
        padding: 0;
        margin: 0 0 30px;
    }
    .innerMain-top {
        border-radius: 0;
        padding: 15px;
    }
    .innerMain-bottom {
        padding: 10px 5px 30px;
    }
    .innerMain-bottom .planHead2 {
        margin: 0 0 10px;
    }
    .innerSide {
        width: 100%;
        padding: 0 15px 0;
    }
    .card .contentSec > section {
        display: block;
        padding: 0 0 20px;
    }

    div#home {
        /*
        margin: 7px 0 0;
        */
    }
    .secInner {
        padding: 5% 3%;
    }
    h2.topHeadline {
        font-size: 1.2rem;
    }
    .secInner h3 {
        margin: 0 0 10px;
    }
    ul.top_revList {
        display: block;
    }
    ul.top_revList li {
        width: 100%;
        margin: 0 0 10px;
    }
    ul.plan_topList li {
        margin: 0 0 15px;
    }
    ul.plan_topList li a figure {
        max-width: 120px;
    }
    ul.plan_topList li a figure img {
        padding: 5px;
    }
    .top_planList {
        padding: 10px 15px;
    }
    .top_planList li {
        line-height: 1.4;
        margin: 0 5px 0 0;
    }
    .top_planList li a {
        font-size: 0.66rem;
    }
    .top_planList li a:after {
        margin: 0 0 0 5px;
    }
    .tab_item h3 {
        font-size: 0.9rem;
        padding: 7px 0;
        margin: 0;
    }
    .tabs .tab_content {
        padding: 0;
    }
    .tabs .tab_item h3 {
        font-size: 0.86rem;
        padding: 5px 0;
    }
    #planPage .tab_item {
        font-size: 0.76rem;
        margin: 1% 0.5%;
    }
    #planPage .tab_item p {
        font-size: 0.76rem;
    }
    .innerSide > aside {
        padding: 0;
    }

    .btn_reviewPost {
        display: none;
    }
    nav.planPage_nav {
        display: none;
    }
    nav.planPage_nav ul {
        flex-wrap: inherit;
        justify-content: inherit;
    }
    nav.planPage_nav ul li {
        width: 25%;
        text-align: center;
    }
    nav.planPage_nav ul li a {
        font-size: 0.76rem;
        padding: 7px 0;
    }
    .areafeeList {
        padding: 7px;
    }
    .tablinkList {
    }
    .tablinkList li:first-child {
        margin: 0 0 5px;
    }
    .tablinkList li {
        min-width: 19%;
    }
    .tablinkList li a {
        font-size: 0.76rem;
    }
    table.planTbl {
        font-size: 0.66rem;
    }
    table.planTbl th, table.planTbl td {
        padding: 3px 10px;
    }
    table.planTbl th {
        width: 100px;
    }
    table.planTbl td p {
        font-size: 0.7rem;
    }
    .scoreBoard--class {
    }
    .scoreBoard .emp {
        font-size: 1.2rem;
        height: 100%;
        padding: 5px 0 0;
        margin: 0;
    }
    .scoreBoard .emp span {
        font-family: 'Noto Sans JP';
        font-size: 2.4rem;
        line-height: 1;
        margin: 0;
    }
    .scoreBoard .emp i {
        font-size: 0.7rem;
    }
    .scoreBoard .emp small {
        display: block;
        color: #bbb;
        font-size: 0.8rem;
        font-weight: normal;
        margin: 8px 0 0;
    }
    ul.scoreBoard-reviewList li {
        line-height: 1.6;
        margin: 0 0 3px;
    }
    ul.scoreBoard-reviewList li figure {
        width: 30px;
    }
    ul.scoreBoard-reviewList li .planRevlist-right {
        display: block;
        color: #555;
        font-size: 0.7rem;
        padding: 5px 0;
    }
    section .innerMain h2 {
        font-size: 1.2rem;
    }
    section .innerMain h3 {
        font-size: 0.9rem;
    }
    section .innerMain h3:before {
        font-size: 12px;
    }
    section .innerMain h4 {
        font-size: 0.9rem;
    }
    section .innerMain h4:before {
        height: 18px;
    }
    .planHead1 {
        font-size: 1.16rem;
    }
    .planHead2 {
        font-size: 1rem;
        margin: 20px 0 10px;
    }
    .planHead2:after {
        height: 3px;
    }
    section .innerMain .planCard-title h3.planHead3 {
        font-size: 0.9rem;
    }
    .planHead4 {
        font-size: 0.9rem;
    }
    .planHead4:before {
        height: 17px;
    }
    .planHead5 {
        font-size: 0.86rem;
    }
    section .innerMain h2.summaryHead3 {
        font-size: 0.86rem;
    }
    section .innerMain h2.summaryHead3:before {
        left: 0;
        top: 13px;
        width: 18px;
        height: 18px;
    }
    ul.scoreCatelist li p {
        font-size: 13px;
    }
    .planBoards {
        display: block;
        padding: 15px 15px 10px;
        margin: 0 auto 20px;
    }
    .scoreBoard {
        width: 100%;
        padding: 0;
        margin: 0;
        font-family: 'Montserrat','Noto Sans JP',-apple-system,BlinkMacSystemFont,"Helvetica Neue","Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3",游ゴシック体,YuGothic,"游ゴシック Medium","Yu Gothic Medium","メイリオ",Meiryo,sans-serif;
    }
    .scoreBoard.bottom {
        display: none;
    }
    ul.scoreBorad_links li a {
        display: block;
    }
    .scoreBoard--class_field {
        margin: 0 auto 8px;
    }
    .scoreBoard--class_field p {
    }
    .scoreBoard--class_field p i {
        font-size: 11px;
        padding: 1px 0 0;
    }
    .scoreBoard--class_field p span {
        font-size: 11px;
    }
    .scoreBoard--class_field small {
        font-size: 11px;
        line-height: 1.4;
        padding: 0;
    }
    .scoreBoard--class_field_bar {
        height: 10px;
    }

    details.planCard-warp {
        margin: 0 0 10px;
    }
    details.planCard-warp summary {
        border: none;
        padding: 7px 0;
    }
    details.planCard-warp summary::before {
    }
    details.planCard-warp .planCard-inner {
        font-size: 0.8rem;
        padding: 10px 0;
    }
    ul.planCard-avgFeelist li {
        font-size: 0.76rem;
    }
    ul.planCard-avgFeelist li span {
        font-size: 0.8rem;
    }
    small.plan-textSup {
        font-size: 0.66rem;
    }
    .planRevlist-box {
        padding: 15px;
    }
    .planRevlist-box table.planTbl {
        margin: 0;
    }
    .paneRevlist-label {
        font-size: 0.6rem;
    }
    .planRevlist-head {
        margin: 0 0 10px 0;
    }
    .planRevlist-head figure {
        margin: 0 10px 0 0;
    }
    .planRevlist-title {
        font-size: 0.8rem;
        line-height: 1.4;
    }
    p.planRevlist-user {
        font-size: 0.7rem;
    }
    ul.planRevlist-score-class {
        margin: 10px 0 0;
    }
    ul.planRevlist-score-class li {
        font-size: 0.66rem;
    }
    ul.planRevlist-score-class li:first-child {
    }
    .planRevlist-merit, .planRevlist-demerit {
        font-size: 0.8rem;
    }
    .planRevlist-merit:before, .planRevlist-demerit:before {
        margin: 0 2px 0 0;
    }
    p.planRevlist-text {
        font-size: 0.76rem;
        line-height: 1.6;
    }
    .curationBoard {
        display: block;
    }
    .curationBoard--wrap {
        width: 100%;
    }
    .curationBoard--wrap.curationMerit {
        margin: 0 0 20px 0;
    }
    .curationBoard ul li {
        font-size: 0.8rem;
    }
    .curationBoard ul li:before {
        top: 0;
    }
    .curationBoard--wrap.curationMerit h4 {
        font-size: 0.86rem;
    }
    .curationBoard--wrap.curationDemerit h4 {
        font-size: 0.86rem;
    }
    table.feeTbl {
        font-size: 0.766rem;
    }
    table.feeTbl thead th, table.feeTbl tbody th, table.feeTbl td {
        padding: 5px 10px 5px 10px;
    }
    table.feeTbl.plantbl tbody th {
        width: 120px;
        padding: 5px 10px 5px 10px;
    }
    table.feeTbl tbody th {
        width: 110px;
    }
    table.feeTbl.hikakutbl tbody td {
        width: 35%;
    }
    .planCard-inner.oriconbox h3 {
        font-size: 0.926rem;
    }
    .planCard-inner.oriconbox h3:before {
        height: 18px;
    }
    .planCard-inner.oriconbox h4 {
        font-size: 0.86rem;
    }
    .planCard-inner.oriconbox p {
        font-size: 0.86rem;
        margin: 0 0 14px;
    }
    .planCard-inner.oriconbox ul li {
        font-size: 0.8rem;
    }
    .planCard-inner.oriconbox ul.ocb-list_box {
        padding: 10px 15px;
    }
    .planCard-inner.oriconbox figure {
        margin: 15px auto 20px;
    }
    .top_rankingGroup {
        padding: 0 0 10px;
    }
    .top_rankingGroup-card {
        flex: 0 0 70%;
    }
    .top_rankingGroup-card h3 {
        font-size: 0.86rem;
        padding: 10px 0;
        margin: 0;
    }
    .top_rankingGroup-card ul li {
        font-size: 0.8rem;
        line-height: 1.7;
        margin: 0 0 7px;
    }
    .top_rankingGroup-card ul li:before {
    }
    .toggle:checked + .Label + .toc-aco-content {
        padding: 5px 20px 20px;
    }
    .Label {
        border-radius: 5px;
        box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
        font-size: 0.76rem;
        padding: 5px 0;
    }   
    .toc-aco-content {
        display: block;
    }
    .toc-aco-content .toc-aco-kvwrap {
        margin: 0 0 15px;
    }
    .toc-aco-content .toc-aco-kvwrap figcaption {
        font-size: 0.8rem;
        font-weight: bold;
    }
    .toc-aco-content ol {
        padding: 15px;
    }
    .toc-aco-content .toc-aco-kvwrap, .toc-aco-content ol {
        width: 100%;
    }
    .toc-aco-content ol li {
        font-size: 0.7rem;
    }
    .btn-cta {
        margin: 0 auto 30px;
    }
    .btn-cta a {
        display: block;
        max-width: 85%;
        font-size: 1.06rem;
    }
    .cta-main {
        padding: 0 0 20px;
    }
    aside#sidebar .cta-main {
        margin: 0 auto 30px;
    }
    .cta-main figure img {
        border-radius: inherit;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        box-shadow: none;
    }
    p.cta-main-head {
        font-size: 1rem;
    }

    section .secField-wrap h2 {
        border-radius: 0;
        padding: 7px 25px;
    }
    .secField-wrap h2:before {
        left: 10px;
        width: 10px;
        height: 10px;
    }
    section .secField-wrap h3 {
        font-size: 1.16rem;
    }
    .secField-wrap .summaryHead3 {
        font-size: 0.86rem;
        padding: 0 0 0 25px;
    }
    .secField-wrap .summaryHead3:before {
        top: 11px;
        width: 18px;
        height: 18px;
    }
    .secField-wrap {
        border-radius: 0;
        padding: 0;
        margin: 0;
    }
    .secField-wrap-inner {
        padding: 15px 20px;
    }
    .secField-wrap.contentbox p {
        font-size: 1rem;
        margin-bottom: 12px;
    }
    .secField {
        padding: 0;
        margin: 0;
    }
    .secFlex {
        display: block;
        padding: 0;
    }
    .secField-right {
        padding: 0 15px 20px;
    }
    .secField-left {
        width: 100%;
        margin: 0 0 15px;
    }
    .secField-right {
        width: 100%;
    }
    .secField-copyPrice {
        margin: 0;
    }
    ul.service-iconList {
    }
    ul.service-iconList li {
        width: 32.5%;
        padding: 10px 0;
    }
    .secField-kv img {
        border-radius: 0;
        box-shadow: none;
    }
    .secField-content {
        padding: 20px;
    }
    .checktbl dl {
        padding: 5px 0;
    }
    .checktbl dl dt {
        min-width: 130px;
        font-size: 0.7rem;
        padding: 5px 0 0 10px;
    }
    ul.service-iconList li i {
        margin: 0 0 3px;
    }
    ul.service-iconList li span {
        font-size: 0.6rem;
    }
    ul.secField-list {
        padding: 5px 15px;
    }
    ul.secField-list li {
        font-size: 0.8rem;
    }
    ul.secField-list li:before {
        font-size: 0.7rem;
    }
    .secField-osusume {
        padding: 15px 15px 10px 15px;
        margin: 20px 0;
    }
    .secField-osusume p {
        font-size: 0.86rem;
    }
    .secField-osusume ul li {
        font-size: 0.96rem;
    }
    nav.content-nav {
        display: block;
        margin: 0;
    }
    .planRevlist-box span.service__TRUE:after {
        font-size: 0.7rem;
    }
    .planRevlist-box span.service__FALSE:after {
        font-size: 0.7rem;
    }
    .txtBox-warning {
        padding: 15px;
        margin: 0;
    }
    .txtBox-warning p {
        font-size: 0.6rem;
    }

    section.serviceContent {
        padding: 20px 15px;
    }
    .serviceContent-body {
        display: block;
        padding: 0;
    }
    .serviceContent-links {
        display: block;
        padding: 0;
    }
    .serviceContent-links a {
        padding: 12px 0;
        margin: 0 0 15px;
    }
    .serviceContent-img {
        width: 100%;
    }
    .serviceContent-img img {
        width: 350px;
        height: 200px;
        border-radius: 0;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        border: none;
        box-shadow: none;
    }
    .serviceContent-inner {
        width: 100%;
        padding: 15px 0;
    }
    h3.serviceContent-title {
        font-size: 1.16rem;
        margin: 0 0 1px;
    }
    .serviceContent-info dl dt {
        font-size: 0.66rem;
    }
    .serviceContent-info dl dd {
        font-size: 0.76rem;
        padding: 5px 10px;
    }
    .serviceContent-info dl dd span {
        line-height: 1.5;
    }
    .serviceContent-info ul.service-iconList li {
        width: 32.5%;
        padding: 1px 5px 5px 5px;
        margin: 0 0 5px;
    }
    .serviceContent-info ul.service-iconList li span {
        font-size: 0.66rem;
    }

    main.ranking .cate-head {
    }
    main.ranking .cate-title h1 b {
    }
    main.ranking .search-head2 {
        font-size: 1.1rem;
    }
    main.ranking .search-head2:before {
    }
    .serviceContent.ranking .serviceContent-inner-body {
        padding: 0;
    }
    .serviceContent.ranking .serviceContent-img img {
        height: 100%;
        border-radius: 5px;
        box-shadow: 0 7px 3px -5px rgb(0 0 0 / 5%);
    }
    .serviceContent.ranking .serviceContent-inner {
        padding: 5px 0 10px;
    }
    .serviceContent.ranking .serviceContent-info ul.service-iconList li {
        width: 49%;
        margin: 3px 0;
    }
    .serviceContent.ranking .serviceContent-info ul.service-iconList li.sil_FALSE:after {
        transform: translate(-50%,-50%) rotate(7deg);
    }
    .serviceContent.ranking .serviceContent-info ul.service-iconList {
        padding: 5px 0;
    }
    .serviceContent.ranking .btn-cta {
        display: block;
        width: 100%;
        padding: 0;
        margin: 0 auto 20px;
    }
    .serviceContent.ranking .btn-cta a {
        width: 100%;
        max-width: 100%;
        font-size: 1rem;
        margin: 0 auto 15px;
    }
    .serviceContent-note {
        font-size: 0.7rem;
        line-height: 1.2;
    }

    .content-links {
        padding: 20px 0;
    }
    .ranking-nav {
    }
    .ranking-nav li {
        width: 23.5%;
        margin: 0 7px 7px 0;
    }
    .ranking-nav li:nth-child(4n) {
        margin: 0 0 7px 0;
    }
    .content-links .ranking-nav li:nth-child(6) {
        margin: 0 7px 7px 0;
    }
    .ranking-nav li:nth-child(6n) {
        margin: 0 7px 7px 0;
    }
    .ranking-nav li:nth-child(12n) {
        margin: 0 0 7px 0;
    }
    .content-links .ranking-nav li:last-child {
        margin: 0;
    }
    .ranking-nav li a {
        font-size: 0.7rem;
        padding: 10px 0;
    }
    .ranking-nav li a span {
        display: block;
        font-size: 0.66rem;
    }

    section.ranking-description {
        padding: 30px 15px;
    }
    .ranking-description h2 {
        font-size: 1rem;
    }
    .ranking-description-box {
        display: block;
    }
    .ranking-description-box img {
        display: block;
        width: 100%;
        height: 100%;
        border-top-right-radius: 5px;
        border-bottom-left-radius: 0;
    }
    .ranking-description-body {
        padding: 10px 15px 15px;
    }
    .ranking-description-body h3 {
        font-size: 0.86rem;
    }
    .ranking-description-body p {
        font-size: 0.76rem;
    }

    #entry-content.ranking {
        padding: 0;
    }
    #entry-content.ranking h2 {
        font-size: 1.1rem;
        line-height: 1.5;
        padding: 10px 10px 10px 15px;
    }
    #entry-content.ranking h2 small {
        font-size: 70%;
    }
    #entry-content.ranking p {
        font-size: 0.96rem;
    }
    #entry-content.ranking h3 {
        font-size: 1.1rem;
        padding: 5px 0;
    }
    #entry-content.ranking h4 {
        font-size: 1rem;
        padding: 2px 0 2px 10px;
    }
    #entry-content.ranking h5 {
        font-size: 0.96rem;
    }
    #entry-content.ranking ol {
        font-size: 0.76rem;
        padding: 10px;
    }

    .ranking-title {
        padding: 20px 0 30px;
    }
    .ranking-head {
        padding: 10px;
    }
    .ranking-head span {
        display: block;
        font-size: 0.86rem;
    }
    .ranking-title h1 {
        font-size: 1.4rem;
        padding: 0 10px;
        margin: 12px 0 10px;
    }
    .ranking-frame-left {
        left: 10px;
        width: 30px;
        height: 250px;
        background-size: 130px;
        background-position: 0 130px;
    }
    .ranking-frame-right {
        right: 10px;
        width: 30px;
        height: 250px;
        background-size: 130px;
        background-position: 0 130px;
    }
    .ranking-title .ranking-title-label {
        height: 25px;
        font-size: 0.76rem;
        padding: 3px 10px;
    }
    .ranking-title-label:before, .ranking-title-label:after {
        height: 20px;
        border: 13px solid #04c1e3;
    }
    .ranking-head1 {
        padding: 20px 0 15px;
        margin: 30px -15px 20px;
    }
    .ranking-head1 span {
        font-size: 0.76rem;
    }
    .ranking-head1 span:after {
        bottom: -7px;
        left: 45%;
        width: 25px;
    }
    .ranking-head1 h2 {
        font-size: 1.3rem;
    }
    .ranking-head1 small {
        font-size: 0.76rem;
    }
    br.ranking-sp {
        display: block;
    }

    .ranking-choice-box h3 {
        font-size: 0.9rem;
    }
    .ranking-choice-box h3:before {
        width: 18px;
        height: 18px;
        font-size: 0.66rem;
    }

    .serviceContent.ranking .serviceContent-title {
        font-size: 1.1rem;
    }
    .serviceContent.ranking .serviceContent-score {
        font-size: 1.1rem;
    }
    .serviceContent.ranking .serviceContent-info dl dt {
        font-size: 0.76rem;
    }

    #entry-content.ranking .ranking-head1 h2 {
        font-size: 1.3rem;
        margin: 0;
    }

    .ranking-reviewbox {
        padding: 10px 15px 15px;
    }
    .ranking-reviewbox .planBoards {
        padding: 15px 10px 20px;
    }
    .ranking-reviewbox .ranking-reviewbox-container {
        display: flex;
        overflow-x: scroll;
        -webkit-overflow-scrolling: touch;
        overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
        scroll-behavior: smooth;
    }
    .ranking-reviewbox .ranking-reviewbox-container .planRevlist-box {
        flex: 0 0 90%;
        height: fit-content;
        scroll-snap-align: center;
        border: none;
        margin: 0 15px 0 0;
    }
    .ranking-reviewbox .ranking-reviewbox-container .planRevlist-box:last-child {
        margin: 0;
    }
    p.rankinglist-note {
        font-size: 0.7rem;
    }
    .rankinglist h4 {
        font-size: 0.96rem;
    }
    .rankinglist h4 a {
        font-size: 0.86rem;
    }
    .ranking-reviewbox .planRevlist-title {
        font-size: 0.86rem;
    }
    .ranking-reviewbox p.planRevlist-text {
        font-size: 0.86rem;
    }
    .ranking-reviewbox .planRevlist-head figure {
        width: 45px;
    }
    .rankinglist-info dl dd ul li {
        font-size: 0.7rem;
    }
    .rankinglist-info dl dd ul li:before {
        top: 5px;
    }
    .ranking-choice-box h3 {
        font-size: 1rem;
    }
    .serviceContent.ranking .secField-lead p, .ranking-inner p {
        font-size: 0.96rem;
        margin: 0 0 20px;
    }
    .secField-leadhead {
        font-size: 1rem;
    }
}

/* ganre list */
table.feeTbl.tbl_summary {
    font-size: 0.9rem;
}
table.feeTbl.tbl_summary th {
    width: 100px;
    font-size: 0.8rem;
}
table.feeTbl.tbl_summary.shoplist ul li {
        display: flex;
        align-items: center;
        line-height: 1.7;
}
table.feeTbl.tbl_summary.shoplist ul li:before {
    font-family: "Font Awesome 6 Free";
    content: "\f138";
    display: block;
    color: #04c1e3;
    font-size: 0.7rem;
    font-weight: bold;
    margin-right: 3px;
}

ul.tbl_summary-tbllist {
    display: flex;
}
ul.tbl_summary-tbllist li {
    margin: 0 7px 0 0;
}
ul.tbl_summary-tbllist span i.fa-regular.fa-circle {
    color: #04c1e3;
}
ul.tbl_summary-tbllist span i.fa-solid.fa-minus {
    color: #bbb;
}


.secField-ganrelist {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
.secField-ganrelist li {
    position: relative;
    width: 14.2%;
    text-align: center;
    line-height: 1.5;
    padding: 5px 0;
    margin: 0;
}
li.ganrelist--FALSE {
    opacity: 0.3;
}
/*
li.ganrelist--TRUE:before {
    content: "\f111";
    font-family: "Font Awesome 6 Free";
    font-weight: 400;
    font-size: 40px;
    position: absolute;
    color: #1da3e24d;
    display: block;
    line-height: 1;
    width: 100%;
    height: auto;
    top: -2px;
    margin: 0 auto;
}
li.ganrelist--FALSE:before {
    content: "\f00d";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 45px;
    position: absolute;
    color: #b6b6b680;
    display: block;
    line-height: 1;
    width: 100%;
    height: auto;
    top: -3px;
    margin: 0 auto;
}
*/
.secField-ganrelist li span {
    display: block;
    font-size: 0.66rem;
    font-weight: bold;
}
.secField-ganrelist li img {
    max-width: 20px;
}

/* search */
ul.secField-ganrelist.serviceContent-search li {
    width: 16.6%;
}
@media (max-width: 640px) {
    ul.secField-ganrelist li {
        width: 20%;
    }
    ul.secField-ganrelist.serviceContent-search li {
        width: 25%;
    }
}


/* section image nav */
nav.kvbox-pagenav ul {
    display: flex;
    border: 1px solid #f3f3f3a6;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
}
nav.kvbox-pagenav {
    padding: 20px 0 20px;
}
nav.kvbox-pagenav ul li {
    flex: 1;
    border-right: 1px dashed #efefef;
}
nav.kvbox-pagenav ul li:lst-child {
    border-right: none;
}
nav.kvbox-pagenav ul li a {
    display: block;
    color: #333;
    font-size: 0.9rem;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    line-height: 1.5;
    padding: 10px 0;
}
nav.kvbox-pagenav ul li a:hover {
    opacity: 0.6;
    transition: 0.2s;
}
nav.kvbox-pagenav ul li a small {
    display: block;
    font-size: 70%;
}
nav.kvbox-pagenav ul li a span {
}
nav.kvbox-pagenav ul li a i {
    color: #04c1e3;
    font-size: 82%;
    vertical-align: middle;
    padding: 0 0 0 2px;
    margin: 0 0 1px;
}


/* section image */
.secFiled-kvbox {
    border: 3px solid #e7e7e7a6;
    border-radius: 5px;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    margin: 0 0 20px;
}
.secFiled-kvbox-inner {
    background: #fff;
    padding: 30px 20px;
}
ul.secFiled-kvbox-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
ul.secFiled-kvbox-list li {
    flex: 1;
    position: relative;
    text-align: center;
    padding: 0 10px;
}
ul.secFiled-kvbox-list li b {
    display: block;
    width: 100%;
    max-width: 140px;
    background: #ebf4ff;
    /*
    background: linear-gradient(90deg, #80b3e5 0%, #04c1e3 50%, #04c1e3 75%, #04c1e3 10%, #80b3e5);
    */
    border-radius: 20px;
    color: #177ead;
    font-size: 0.8rem;
    font-weight: bold;
    padding: 0 20px;
    margin: 0 auto;
}
ul.secFiled-kvbox-list li.kvbox-list-demerit b {
    background: #fff2eb;
    color: #fb5426;
}

ul.secFiled-kvbox-list li ul {
    padding: 10px 0 0;
}
ul.secFiled-kvbox-list li ul li {
    font-size: 0.96rem;
    text-align: left;
    padding: 0 0 0 20px;
}
.secFiled-kvbox-list li.kvbox-list-merit ul li {
    color: #04c1e3;
}
ul.secFiled-kvbox-list li ul li:before {
    content: "\f058";
    font-family: "Font Awesome 6 Free";
    position: absolute;
    display: inline-block;
    color: #04c1e3;
    font-size: 0.96rem;
    font-weight: bold;
    top: 0;
    left: 0;
}
ul.secFiled-kvbox-list .kvbox-list-demerit ul li {
    color: #fb5426;
}
ul.secFiled-kvbox-list .kvbox-list-demerit ul li:before {
    color: #fb5426;
}



ul.secFiled-kvbox-list li img {
    display: block;
    width: 120px;
    height: 120px;
    object-fit: contain;
    margin: 0 auto;
    opacity: 0.7;
}
.kvbox-img {
    position: relative;
    display: block;
    height: auto;
    padding: 20px 0;
}
.kvbimg--true:after {
    content: "\f111";
    font-family: "Font Awesome 6 Free";
    font-weight: 400;
    font-size: 100px;
    position: absolute;
    color: #1da3e233;
    display: block;
    line-height: 1;
    width: 100%;
    height: auto;
    top: 18%;
    margin: 0 auto;
}
.kvbimg--false:after {
    content: "\f00d";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 120px;
    position: absolute;
    color: #8b8b8b33;
    display: block;
    line-height: 1;
    width: 100%;
    height: auto;
    top: 15%;
    margin: 0 auto;
}
.kvbox-img.kvbimg--false img {
    filter: grayscale(90%);
}


ul.secFiled-kvbox-list li p.secFiled-kvbox-list-msg {
    font-weight: bold;
    line-height: 1.5;
    margin: 0;
}
ul.secFiled-kvbox-list li p.secFiled-kvbox-list-msg em {
    background: linear-gradient(transparent 60%, #fff700 60%);
    font-size: 1.2rem;
}
p.secFiled-kvbox-list-msg.lm-txt.false em {
    background: none;
    color: #a5a5a5;
}

p.secFiled-kvbox-list-msg small {
    display: block;
    font-weight: normal;
}
.secFiled-kvbox-inner .secFiled-kvbox-comment {
    width: 100%;
    background: #eeee;
    border-radius: 3px;
    padding: 15px 20px;
    margin: 0 auto;
}
.secFiled-kvbox-inner .secFiled-kvbox-comment p {
    font-size: 0.86rem;
    line-height: 1.5;
    margin: 0;
}

/* section image ganrelist */
.secField-ganrelist.kv-content li {
    width: 20%;
    padding: 10px 0;
}
.secField-ganrelist.kv-content li img {
    max-width: 45px;
}
.secField-ganrelist.kv-content li span {
    font-size: 0.8rem;
}


/* section image map */
ul.secFiled-kvbox-map {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
ul.secFiled-kvbox-map li {
    width: 10%;
    background: #f3f3f3;
    border: 1px solid #f5f5f5;
    color: #afafaf;
    font-size: 0.8rem;
    text-align: center;
    line-height: 1.5;
    padding: 10px 0;
}
ul.secFiled-kvbox-map li.kvbox-map--true {
    background: #fff;
    color: #555;
}
/*
ul.secFiled-kvbox-map li:nth-child(10n) {
    border-right: none;
}
ul.secFiled-kvbox-map li:nth-child(n+41) {
    border-bottom: none;
}
*/
ul.secFiled-kvbox-map li small {
    display: block;
    font-size: 80%;
}


/* top copy */
.secField-topcopy {
    padding: 20px 30px 0;
    margin: 0;
}
.secField .secField-topcopy p {
    position: relative;
    display: block;
    background: #f0f3f7;
    border-radius: 5px;
    font-size: 1.16rem;
    font-weight: bold;
    line-height: 1.5;
    padding: 10px 10px 10px 15px;
    margin: 0 0 7px;
}
.secField-topcopy p:before {
    content: "";
    position: absolute;
    display: block;
    left: 0;
    top: 50%;
    width: 5px;
    height: calc(100% - 5px);
    background: #04c1e3;
    border-radius: 5px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}



/* service summary */
.secField-serviceSummary {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 0 10px;
}
.secField-serviceSummary dl {
    flex: 33% 33;
    border: 1px solid #efefef;
    text-align: center;
}
.secField-serviceSummary dl dt {
    background: #f0f3f7;
    font-size: 0.76rem;
    font-weight: bold;
}
.secField-serviceSummary dl dd {
    font-size: 1rem;
    font-weight: bold;
    line-height: 1.5;
    padding: 13px 0 15px;
}
.secField-serviceSummary dl dd small {
    display: block;
    font-size: 75%;
    font-weight: normal;
    line-height: 1.4;
}
.secField-summarysup p {
    line-height: 1.1;
}
.secField-summarysup small {
    color: #aaa;
    font-size: 75%;
}

p.secField-content-summaryhead  {
    position: relative;
    font-size: 1.16rem;
    font-weight: bold;
    line-height: 1.5;
    padding: 0 0 0 13px;
}
p.secField-content-summaryhead:before {
    content: "";
    position: absolute;
    display: block;
    left: 0;
    top: 50%;
    width: 5px;
    height: calc(100% - 5px);
    background: #04c1e3;
    border-radius: 5px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}



/* insurance comapny list */
.secField-insurancelist {
    margin: 0 0 30px;
}
.secField-insurancelist ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: unset;
    gap: 5px 4px;
}
.secField-insurancelist ul li {
    width: 19.5%;
    margin: 0 0 10px;
}
.secField-insurancelist ul li figure {
    line-height: 1.3;
}
.secField-insurancelist ul li figure img {
    display: block;
    width: 130px;
    height: 80px;
    object-fit: contain;
    border: 1px solid #efefef;
    border-radius: 5px;
    padding: 15px;
    margin: 0 auto 7px;
}
.secField-insurancelist ul li figure figcaption {
    font-size: 0.76rem;
    text-align: center;
}


/* reviews */
ul.planRevlist-detailScore {
    display: flex;
}
ul.planRevlist-detailScore li {
    margin: 0 5px 0 0;
}
ul.planRevlist-detailScore li span {
    color: #444;
    font-size: 0.9rem;
}
ul.planRevlist-detailScore li strong {
    color: #fb5426;
    font-size: 0.96rem;
    padding: 0 0 0 3px;
}

.planRevlist-customor {
    padding: 0;
    margin: 0 0 7px;
}
dl.planRevlist-label {
    display: flex;
    margin: 0 0 7px;
}
dl.planRevlist-label dt {
    width: 50px;
    border: 1px solid #efefef;
    border-radius: 5px;
    font-size: 0.9rem;
    text-align: center;
}
dl.planRevlist-label dd {
    font-size: 0.96rem;
    padding: 0 0 0 10px;
}
dl.planRevlist-label dd ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
dl.planRevlist-label dd ul li {
    margin: 0 7px 0 0;
}
dl.planRevlist-label dd ul li:before {
    content: "#";
    color: #fb5426;
}

.planRevlist-title {
    margin: 0 0 5px;
}
ul.planRevlist-title-sub {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
ul.planRevlist-title-sub li {
    color: #555;
    font-size: 0.86rem;
    font-weight: normal;
    margin: 0 7px 0 0;
}
ul.planRevlist-title-sub li:before {
    content: "#";
    color: #fb5426;
}






span.planRevlist-label-solve {
    display: block;
    width: fit-content;
    background: linear-gradient(90deg, #8ec0f0 0, #04c1e3 20%, #04c1e3 30%, #04c1e3 10%, #2dd6eb);
    border-radius: 20px;
    color: #fff;
    font-size: 0.8rem;
    text-align: center;
    padding: 1px 15px;
    margin: 0 0 10px;
}
span.planRevlist-label-solve i {
    margin: 0 3px 0 0;
}

.planRevlist-text .planRevlist-description {
    background: #fffff6;
    border-radius: 5px;
    padding: 15px 20px;
    margin: 0 0 10px;
}
.planRevlist-text .planRevlist-description p {
    font-size: 0.96rem;
    font-feature-settings: "palt";
    letter-spacing: 0.8px;
    line-height: 1.8;
    margin-bottom: 16px;
}
.planRevlist-text .planRevlist-description p:last-child {
    margin-bottom: 0;
}

.planRevlist-useful {
    cursor: pointer;
    display: block;
    width: fit-content;
    border: 1px solid #e5e5e5;
    border-radius: 20px;
    color: #555;
    font-size: 0.76rem;
    padding: 0 10px;
}
input[type=checkbox]:checked ~ .planRevlist-useful {
    opacity: 0.4;
}
.planRevlist-body input {
    display: none;
}
.planRevlist-useful i {
    color: #04c1e3;
    margin: 0 2px 0 0;
}
.planRevlist-useful b {
    font-weight: bold;
    padding: 0 0 0 2px;
}


/* fukidashi */
.kvbox-comment {
    display: flex;
    margin: 0 0 40px;
}
.kvbox-comment figure {
    width: 120px;
    line-height: 1;
    margin: 0 30px 0 0;
}
.kvbox-comment figure img {
    border: 3px solid #f3f3f3;
    border-radius: 50px;
}
.kvbox-comment.comment_right figure {
    width: 120px;
    line-height: 1;
    margin: 0 0 0 30px;
}
.kvbox-comment figure figucaption {
    display: block;
    font-size: 0.8rem;
    text-align: center;
    margin: 7px 0 0;
}
.kvbox-comment-body {
    position: relative;
    background: #f7f7f7;
    border-radius: 5px;
    padding: 20px;
}
.kvbox-comment.comment_left .kvbox-comment-body:before {
    position: absolute;
    left: -15px;
    width: 15px;
    height: 20px;
    background-color: #f7f7f7;
    clip-path: polygon(0 50%, 100% 0, 100% 100%);
    content: '';
}
.kvbox-comment.comment_right .kvbox-comment-body:before {
    position: absolute;
    top: 20px;
    right: -15px;
    width: 15px;
    height: 20px;
    background-color: #f7f7f7;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
    content: '';
}
.kvbox-comment.comment_main .kvbox-comment-body {
    background: #f0f3f7;
}
.kvbox-comment.comment_main .kvbox-comment-body:before {
    background-color: #f0f3f7;
}
.kvbox-comment.comment_sub .kvbox-comment-body {
    background: #ffffee;
}
.kvbox-comment.comment_sub .kvbox-comment-body:before {
    background-color: #ffffee;
}

.secField-wrap.contentbox .kvbox-comment-body p {
    margin: 0 0 12px;
}
.secField-wrap.contentbox .kvbox-comment-body p:last-child {
    margin: 0;
}



@media (max-width: 640px) {
    .secField-topcopy {
        padding: 0 20px;
        margin: 0 0 10px;
    }
    .secField .secField-topcopy p {
        font-size: 1rem;
    }

    .secField-serviceSummary dl dt {
        font-size: 0.76rem;
    }
    .secField-serviceSummary dl dd {
        font-size: 0.9rem;
    }
    .secField-serviceSummary dl dd small {
        font-size: 70%;
    }

    p.secField-content-summaryhead  {
        font-size: 1.1rem;
    }

    .secField-ganrelist ul {
        padding: 0 5px 15px;
        flex-wrap: wrap;
    }
    .secField-ganrelist ul li {
        flex: 20%;
        padding: 7px 0;
    }
    .secField-ganrelist ul li img {
        max-width: 25px;
    }
    .secField-ganrelist li span {
        font-size: 0.6rem;
    }

    .secFiled-kvbox-inner {
        padding: 15px 10px;
    }
    ul.secFiled-kvbox-list li {
        padding: 0 5px;
    }
    ul.secFiled-kvbox-list li.kvbox-list-merit,ul.secFiled-kvbox-list li.kvbox-list-demerit {
        flex: 100%;
    }
    ul.secFiled-kvbox-list li.kvbox-list-merit {
        margin: 0 0 15px;
    }
    ul.secFiled-kvbox-list li ul li {
        font-size: 0.96rem;
        padding: 0 0 0 18px;
    }
    ul.secFiled-kvbox-list li ul li:before {
        font-size: 0.96rem;
    }
    ul.secFiled-kvbox-list li img {
        width: 80px;
        height: 80px;
    }
    ul.secFiled-kvbox-list li b {
        font-size: 0.8rem;
        padding: 0;
    }
    ul.secFiled-kvbox-list li p.secFiled-kvbox-list-msg {
        font-size: 0.9rem;
    }
    ul.secFiled-kvbox-list li p.secFiled-kvbox-list-msg em {
        font-size: 1rem;
    }
    p.secFiled-kvbox-list-msg small {
        font-size: 80%;
    }
    ul.secFiled-kvbox-list {
        margin: 0 0 10px;
    }
    .secFiled-kvbox-inner .secFiled-kvbox-comment {
        padding: 7px 10px;
    }
    .secFiled-kvbox-inner .secFiled-kvbox-comment p {
        font-size: 0.76rem;
    }

    .kvbimg--true:after {
        font-size: 80px;
        top: 22%;
    }

    nav.kvbox-pagenav {
        padding: 0 20px 5px;
    }
    nav.kvbox-pagenav ul {
        counter-reset: toc;
        display: block;
        border: none;
        box-shadow: none;
    }
    nav.kvbox-pagenav ul li {
        display: flex;
        align-items: center;
        border: none;
        line-height: 1.5;
        margin: 0 0 7px;
    }
    nav.kvbox-pagenav ul li:before {
        counter-increment: toc;
        content: counter(toc);
        display: block;
        width: 18px;
        height: 18px;
        background: #04c1e3;
        border-radius: 20px;
        color: #fff;
        font-size: 0.76rem;
        font-weight: bold;
        text-align: center;
        padding: 0;
        margin: 0 5px 0 0;
    }
    nav.kvbox-pagenav ul li a {
        display: inline-block;
        color: #057cd8;
        font-size: 1rem;
        text-decoration: underline;
        padding: 0;
    }
    nav.kvbox-pagenav ul li a small {
        display: inline;
        font-size: 100%;
    }
    nav.kvbox-pagenav ul li a i {
        display: none;
    }


    /* section image ganrelist */
    .secField-ganrelist.kv-content li {
        padding: 7px 0;
    }
    .secField-ganrelist.kv-content li img {
        max-width: 30px;
    }
    .secField-ganrelist.kv-content li span {
        font-size: 0.66rem;
    }

    /* section image map */
    ul.secFiled-kvbox-map li {
        width: 20%;
        font-size: 0.7rem;
        padding: 5px 0;
    }
    ul.secFiled-kvbox-map li:nth-child(10n) {
    }
    ul.secFiled-kvbox-map li:nth-child(n+41) {
    }
    ul.secFiled-kvbox-map li:nth-child(n+43) {
    }

    table.feeTbl.tbl_summary {
        font-size: 0.9rem;
    }
    table.feeTbl.tbl_summary.shoplist ul li {
        font-size: 0.9rem;
    }
    table.feeTbl.tbl_summary th {
        width: 90px;
    }

    .secField-insurancelist ul li {
        width: 32.5%;
    }

    /* review list */
    .planRevlist-score {
        font-size: 1rem;
        line-height: 1.4;
    }
    ul.planRevlist-detailScore {
        flex-wrap: wrap;
        justify-content: flex-start;
        font-size: ;
        line-height: 1.2;
    }
    ul.planRevlist-detailScore li span {
        font-size: 0.7rem;
    }
    dl.planRevlist-label dt {
        min-width: 50px;
        font-size: 0.76rem;
    }
    dl.planRevlist-label dd {
        font-size: 0.76rem;
    }
    dl.planRevlist-label dd ul {
        flex-wrap: wrap;
        justify-content: flex-start;
        line-height: 1.5;
    }
    .planRevlist-text div > p {
        font-size: 0.8rem;
    }
    .planRevlist-text .planRevlist-description {
        padding: 10px 10px;
    }
    .planRevlist-text .planRevlist-description p {
        font-size: 0.86rem;
        margin-bottom: 12px;
    }
    span.planRevlist-label-solve {
        font-size: 0.7rem;
        padding: 1px 10px;
        margin: 0 0 7px;
    }

    /* fukidashi */
    .kvbox-comment figure {
        width: 17%;
        line-height: 1;
        margin: 0 20px 0 0;
    }
    .kvbox-comment figure figucaption {
        font-size: 0.7rem;
    }    
    .kvbox-comment.comment_right figure {
        width: 15%;
        margin: 0 0 0 20px;
    }
    .kvbox-comment-body {
        width: 83%;
        padding: 15px 20px;
    }
    .kvbox-comment.comment_left .kvbox-comment-body:before {
        left: -10px;
    }
    .kvbox-comment.comment_right .kvbox-comment-body:before {
        right: -10px;
    }
    article .secField-wrap.contentbox .kvbox-comment-body p {
        font-size: 0.9rem;
    }
}



/* VK Filter Search */
div#home section#kv .kv_wrap .kv_search .vkfs__call-filter-search form {
    display: block;;
    justify-content: inherit;
    margin: 0 !important;
}
.side-post .vkfs {
    margin: 0 !important;
}
div#home section#kv .kv_wrap .kv_search .vkfs__call-filter-search form .vkfs:where(:not(.vkfs__layout--min)) .vkfs__outer-wrap {
    margin: 0 0 10px;
}
div#home section#kv .kv_wrap .kv_search .vkfs__call-filter-search form .vkfs__taxonomy .vkfs__label-name {
    margin: 5px 0 0;
}
div#home section#kv .kv_wrap .kv_search .vkfs__call-filter-search form .vkfs__input-wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
div#home section#kv .kv_wrap .kv_search .vkfs__call-filter-search form .vkfs__input-wrap li {
    display: block;
    width: fit-content;
    flex-grow: inherit;
    font-size: 0.9rem;
    line-height: 1.5;
    padding: 5px 0 5px 20px;
    margin: 0 15px 0 0;
}

.side-post .vkfs__labels {
    display: block;
}
.side-post .vkfs:where(:not(.vkfs__layout--min)) .vkfs__outer-wrap {
    margin: 0 0 7px 0;
}
.side-post .vkfs__label-name {
    font-size: 0.9rem;
    margin: 0 !important;
}
.side-post .vkfs ul.vkfs__input-wrap li {
    padding: 0 0 0 24px;
    margin: 0 0 3px 0 !important
}
.side-post .vkfs ul.vkfs__input-wrap li label {
    line-height: 2;
    display: inline-block;
}
.side-post .vkfs ul.vkfs__input-wrap li label input[type=checkbox] {
    margin: -2px 0 0 0;
}
.side-post .vkfs ul.vkfs__input-wrap li label input[type=checkbox]:after {
    top: 1%;
}
.side-post .vkfs input[type=radio]:after {
    background-color: #04c1e3;
}
.side-post .vkfs input[type=checkbox]:after {
    border-bottom: 3px solid #04c1e3;
    border-right: 3px solid #04c1e3;
}
.side-post .vkfs button[type=submit] {
    display: block;
    max-width: 360px;
    background: #04c1e3;
    border: none;
    border-radius: 10px;
    box-shadow: 0 5px 0 rgba(0, 0, 0, 0.05);
    color: #333;
    font-size: 0.86rem;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    padding: 10px 0;
    margin: 0 auto;
}

body main .vkfs .btn[type=submit] {
    cursor: pointer;
    width: 25%;
    background: #FEDB3A;
    border: 1px solid #FEDB3A;
    border-radius: 10px;
    box-shadow: 0 5px 0 rgba(0, 0, 0, 0.05);
    color: #333;
    font-size: 0.86rem;
    font-weight: bold;
    margin: 0;
}

@media (max-width: 640px) {
    div#home section#kv .kv_wrap .kv_search .vkfs__call-filter-search form .vkfs__input-wrap li {
        font-size: 0.86rem;
        padding: 5px 0 5px 25px;
    }
    .side-post .vkfs {
        margin: 0 !important;
    }
    .side-post .vkfs__labels {
        display: block;
    }
    .side-post .vkfs ul.vkfs__input-wrap li label input[type=checkbox] {
        top: 7px;
    }
    .side-post .vkfs ul.vkfs__input-wrap li label input[type=checkbox]:after {
        top: 12%;
    }
}


.secField-main-content {
    margin: 0 0 20px;
}
.secField-summarysup {
    margin: 0 0 20px;
}

/* entry-content & main-content */
@media (max-width: 640px) {
    #entry-content p, .secField-wrap.contentbox .secField-main-content p {
        font-size: 1rem;
        margin-bottom: 12px;
    }
    #entry-content blockquote p, .secField-wrap.contentbox .secField-main-content blockquote p {
        font-size: 85%;
    }
    #entry-content ul, .secField-wrap.contentbox .secField-main-content ul {
        padding: 10px 20px;
    }
    #entry-content ul li, .secField-wrap.contentbox .secField-main-content ul li {
        font-size: 1rem;
    }
    #entry-content ol, .secField-wrap.contentbox .secField-main-content ol {
        padding: 10px 20px;
    }
    #entry-content ol li, .secField-wrap.contentbox .secField-main-content ol li {
        font-size: 1rem;
    }
}



/* home -----------------------------------------*/
div#home {
    display: flex;
    justify-content: space-between;
    max-width: 1000px;
    padding: 30px 0;
    margin: 0 auto;
}
div#home.page {
    padding: 10px 0 30px;
}
div#home.page p {
    font-size: 14px;
}
main.home-main {
    width: 70%;
    background: #fff;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    border-radius: 3px;
    padding: 30px;
}
main.home-main.page {
    padding: 0;
}
aside {
    width: 27%;
}


.home-hero {
    background: url(./img/home/home_hero.jpg) no-repeat;
    background-position: center bottom;
    background-size: 100%;
    align-items: center;
}
.home-hero-content {
    max-width: 1000px;
    color: #fff;
    font-size: 1.7rem;
    line-height: 1.6;
    text-shadow: 0 0 20px rgba(0, 0, 0, 0.6);
    padding: 60px 20px;
    margin: 0 auto;
}
.home-hero-content p {
    font-size: 1.7rem;
    font-weight: bold;
    line-height: 1.6;
}

h2.home-hero-catchphrase {
    font-size: 1.7rem;
    line-height: 1.6;
}

.home-container  {
    margin: 0 0 50px;
}
div#home.page article {
    background: #fff;
    padding: 40px;
}
div#home.page section.page h2, .home-container h2 {
    background: #e0faff;
    border-left: 3px solid #04c1e3;
    font-size: 18px;
    padding: 5px 15px;
    margin: 0 0 25px;
}
div#home.page section.page h3, .home-container h3 {
    font-size: 18px;
    margin: 10px 0 3px;
}
.home-container h3:before {
    content: "";
    display: inline-block;
    background: #04c1e3;
    width: 10px;
    height: 10px;
    border-radius: 10px;
    margin: 0 5px 0 0;
}
.home-container h4 {
    font-size: 16px;
    margin: 0 0 3px;
}

div#home.page section.page p, .home-container p {
    font-size: 14px;
    margin: 0 0 18px;
}
div#home.page section.page li {
    font-size: 14px;
}

.initiative-work {
    display: flex;
    gap: 15px;
}
.initiative-work img {
    width: 25%;
}
.initiative-work p {
    width: 75%;
}

.home-notice {
    background: #fff9e5;
    border-radius: 5px;
    padding: 20px;
    margin: 0 0 30px;
}

ul.news-list li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background: #fff;
    border: 1px solid #ededed;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    border-radius: 5px;
    font-size: 14px;
    padding: 15px 15px;
    margin: 0 0 15px;
}

ul.news-list li time {
    min-width: 65px;
}
ul.news-list li .news-category {
    display: block;
    min-width: 80px;
    background: #04c1e3;
    border-radius: 30px;
    color: #fff;
    font-size: 12px;
    text-align: center;
    padding: 0px 10px;
    margin: 0 10px;
}
ul.news-list li a {
    color: #333;
    text-decoration: none;
}
ul.news-list li a:hover {
    opacity: 0.6;
    transition: 0.2s;
    text-decoration: underline;
}

.home-section table {
    background: #fff;
    box-shadow: 0 7px 15px -5px rgb(0 0 0 / 5%);
    border-radius: 5px;
    font-size: 13px;
    margin: 0 0 30px;
}
.home-section table tbody  {
}
.home-section table tbody tr {
    border-bottom: 1px solid #efefef;
}
.home-section table tbody tr th {
    width: 100px;
    background: #04c1e3;
    color: #fff;
    padding: 10px 0 10px 15px;
}
.home-section table tbody tr td {
    padding: 0 0 0 15px;
}
.home-section table tbody tr:first-child th {
    border-top-left-radius: 5px;
}
.home-section table tbody tr:last-child th {
    border-bottom-left-radius: 5px;
}
.home-section table tbody tr:first-child td {
    border-top-right-radius: 5px;
}
.home-section table tbody tr:last-child td {
    border-bottom-right-radius: 5px;
}



aside.home-aside h3 {
    font-size: 16px;
}
aside.home-aside h3:before {
    content: "";
    display: inline-block;
    background: #04c1e3;
    width: 10px;
    height: 10px;
    border-radius: 10px;
    margin: 0 5px 0 0;
}
ul.side-navi {
    background: #fff;
    margin: 0 0 30px;
}
ul.side-navi li {
    border-bottom: 1px solid #efefef;
}
ul.side-navi li a {
    display: block;
    color: #333;
    font-size: 14px;
    text-decoration: none;
    padding: 7px 15px;
}
ul.side-navi li a:hover {
    opacity: 0.6;
    transition: 0.2s;
}
ul.side-navi li a:before {
    content: "・";
    color: #04c1e3;
}

nav.footer-list {
    background: #d5f9ff;
    padding: 10px 5px;
}
nav.footer-list ul {
    display: flex;
    justify-content: center;
    gap: 15px;
}
nav.footer-list ul li a {
    font-size: 13px;
    text-decoration: none;
}

@media (max-width: 640px) {
    div#home {
        display: block;
        padding: 0;
    }
    main.home-main, aside.home-aside {
        width: 100%;
    }
    div#home.page article {
        padding: 20px;
    }
    main.home-main, aside.home-aside {
        padding: 30px 20px;
    }
    .home-hero-content {
        font-size: 1.1rem;
        line-height: 1.6;
        padding: 30px 20px;
    }
    .home-hero-content p {
        font-size: 1.3rem;
        font-weight: bold;
        line-height: 1.6;
    }
    div#home.page section.page h2, .home-container h2 {
        font-size: 16px;
    }
    div#home.page section.page h3, .home-container h3 {
        font-size: 14px;
    }
    .home-container h4 {
        font-size: 13px;
    }
    div#home.page section.page p, .home-container p , .home-container a {
        font-size: 14px;
    }

    .initiative-work {
        display: block;
    }
    .initiative-work img, .initiative-work p {
        width: 100%;
    }
    .home-section table tbody tr th {
        width: 90px;
        background: #04c1e3;
    }
    .home-section table tbody tr td {
        padding: 15px;
    }
}

/* end home -----------------------------------------*/