body{font-size: unset ;line-height: unset;}
a{color: #000;}
.relative{position: relative;}
.absolute{position: absolute;}
main.archive-article .o-hdg{border-bottom: none;border-top: none;}
main.archive-article section.article .o-hdg__text{width: unset;display: flex;background-color: unset;margin-left: unset;}
main.archive-article section.article .o-hdg__text span{background-color: #000;height: 100%;display: block;padding: 0 10px;}
main.archive-article section.article .o-hdg__text .noise{position: unset;}
.cassette-content{display: flex;}
.cassette-content .box .box-img {height: 180px;width: 100%;}
.cassette-content .box .box-img img{width: 100%;height: 100%;object-fit: cover;}
.cassette-content .box .article-title{font-weight: bold;font-size: 15px;margin-bottom: 10px;}
.cassette-content .box .excerpt{font-size: 13px;}

.ranking-content .ranking-top .ranking-top-img img{height: 100%;width: 100%;object-fit: cover;}

.ranking-content .ranking-top .ranking-top-textarea div.ranking-top-title .o-hdg__text{font-size: unset;width: 100%;margin-left: unset;background:#fff;line-height: normal;position: unset;}
.ranking-content .ranking-top .ranking-top-textarea div.ranking-top-title .o-hdg__text span{background: #000;}
.ranking-content ul {display: flex;}
.ranking-content .ranking-top,.ranking-content ul li{position: relative;}
.ranking-content ul li .rank-img img{width: 100%;}
.ranking-content .number{position: absolute;color: #fff;background: #000;top: 0;left: 0;padding: 3px 12px;}




main.sigle-article .main-content .mv img{width: 100%;}
main.sigle-article .tag-author{display: flex;margin: 20px 0;}  
main.sigle-article .author-area .author,main.sigle-article .author-area p{font-size: 13px;color: #777;}
main.sigle-article .author-area .author{text-decoration: underline;}
main.sigle-article .title-area,main.sigle-article .excerpt-area,main.sigle-article .article-content{margin-bottom: 40px;}
main.sigle-article .excerpt-area,main.sigle-article .article-content{font-size: 14px;}
main.sigle-article .article-content h2,main.sigle-article .article-content h3,main.sigle-article .article-content h4,main.sigle-article .article-content h5{font-size: 20px;margin: 20px 0;}
main.sigle-article .p-message__head > span >span,main.archive-article .p-message__head > span >span{vertical-align: middle;}
main.sigle-article .p-message__head > span.__1 ,main.archive-article .p-message__head > span.__1{ max-width:unset; padding-right: unset;}
main.sigle-article .p-message__head > span.__2 ,main.archive-article .p-message__head > span.__2{ max-width:unset; padding-right: unset;}
main.sigle-article .p-message__head .noise ,main.archive-article .p-message__head .noise{position: unset;flex-flow: column;}
main.sigle-article .p-message__head .noise-box,main.archive-article .p-message__head .noise-box{display: inline-block;vertical-align: top;background: #fff;}
main.sigle-article .tags a{display: inline-block;}

main.sigle-article .side-bar .social-list img{width: 25px; height: 25px;}
main.sigle-article .side-bar .social-list p{font-family: "Space Mono"; font-size: 13px;}
main.sigle-article .side-bar .social-list li{text-align: center;}
main.sigle-article .side-bar .social-list li a,main.sigle-article .side-bar .social-list li.url-copy img{display: inline-block;}
main.sigle-article .side-bar .social-list li.url-copy{cursor: pointer;}
main.sigle-article .successed-copy{width: max-content;font-size: 9px !important;background-color: #fff;border: 0.5px solid #999;position: absolute;padding: 3px;border-radius: 8px;top: 0;left: 50%;transform: translate(-50%, -100%);color: #3d3d3d;  opacity: 0;transition:  0.4s ;}
main.sigle-article .successed-copy.show {opacity: 1;}
main.sigle-article .successed-copy::after{content: ""; border-left: 0.5px solid #999;border-bottom: 0.5px solid #999;position: absolute;bottom: -5px;left: 50%;background-color: #fff;transform: rotate(-45deg);width: 8px;height: 8px;}

@media screen and (min-width: 768px) {
    .flex-pc{display: flex;}
    .main-content{max-width: 1000px;margin: 0 auto;}
    .container{max-width: 1024px; margin: 0 auto;}
    .cassette-content{justify-content: left;flex-wrap: wrap;padding-bottom: 30px;}
    .cassette-content .box{width: 33.3%;padding: 20px;}
    main.archive-article section.article .o-hdg__text{left: 50%;transform: translate(-50%,0);}
    .o-hdg__text.ranking {width: calc(var(--grid_pc)* 5);}
    .o-hdg__text.ranking .noise {left: calc(var(--grid_pc)* 5);}
    .ranking-content{margin-bottom: 50px;}
    .ranking-content .ranking-top{width: 100%;border-right: none !important;}
    .ranking-content .ranking-top a{display: flex;}
    .ranking-content .ranking-top .ranking-top-img,.ranking-content .ranking-top .ranking-top-textarea{width: 50%;}
    .ranking-content .ranking-top .ranking-top-textarea div.ranking-top-title{font-size: 38px;height: 110px;}
    .ranking-content .ranking-top .ranking-top-textarea .ranking-top-excerpt{font-size: 15px;}
    .ranking-content .tags,.ranking-content .ranking-top .ranking-top-textarea .ranking-top-excerpt, .ranking-content ul li .rank-text{margin: 10px;}
    .ranking-content ul{flex-wrap: wrap;}
    .ranking-content ul li{width: 50%;border-right: #000 solid 1px;}
    .ranking-content ul li a{display: flex;}
    .ranking-content ul li .rank-img{width: 40%;}
    .ranking-content ul li .rank-textarea{width: 60%;}
    .ranking-content ul li .rank-text{font-size: 12px;}
    .ranking-content ul li,.ranking-content .ranking-top{border-bottom: #000 solid 1px;}

    main.sigle-article .container{max-width: 850px;}
    main.sigle-article .side-bar{width: 7%;}
    main.sigle-article .main-content{width: 93%;}
    main.sigle-article .tag-author{justify-content: space-between;}
    main.sigle-article .p-message__head ,main.archive-article .p-message__head{font-size: 34px;}
    main.sigle-article .p-message__head > span ,main.archive-article .p-message__head > span {height: 60px;}
    main.sigle-article .noise div,main.archive-article h3 .noise div{width: 30px;height: 30px;}
    main.archive-article .p-message__head > span{padding-left: 5px;}
    main.sigle-article .side-bar .social-list{position: fixed;top: 35%;}
    main.sigle-article .side-bar .social-list li{margin-bottom: 15px;}
    main.sigle-article .tag-author{align-items: center;}

}

@media screen and (max-width: 767px) {
    .flex-sp{display: flex;}
    section{margin-top: 30px;}
    .cassette-content{flex-flow: column;}
    .container{padding: 0 10px;}
    .container.cate-btn{padding: 0;}
    .cassette-content .box{margin:20px 0;}
    .o-hdg__text.ranking {width: calc(var(--grid_sp)* 5);}
    .o-hdg__text.ranking .noise {left: calc(var(--grid_sp)* 5);}
    .ranking-content ul{flex-flow: column;}
    .ranking-content .ranking-top .ranking-top-textarea div.ranking-top-title{height: 75px;}
    .ranking-content .ranking-top .ranking-top-textarea div.ranking-top-title .o-hdg__text{font-size: 24px;text-align: left;}
    .ranking-content .ranking-top .ranking-top-textarea .ranking-top-excerpt,.ranking-content ul li .rank-text {font-size: 15px;}
    .tags,.ranking-content .ranking-top .ranking-top-textarea .ranking-top-excerpt, .ranking-content ul li .rank-text{margin: 5px 0;}
    .ranking-content ul li,.ranking-content .ranking-top{margin: 15px 0;}
    .ranking-content ul li .rank-text,.ranking-content .ranking-top .ranking-top-textarea .ranking-top-excerpt{height: 43px;}
    main.sigle-article .tag-author{flex-flow: column-reverse;margin: 10px;}
    main.sigle-article .title-area{margin-bottom: 15px;}
    main.sigle-article .side-bar .social-list{justify-content: space-around;display: flex;border-bottom: solid 1px #B3B3B3;border-top: solid 1px #B3B3B3;padding: 13px 0px 10px;margin-bottom: 30px;}
    main.sigle-article .main-content .text-content{display: flex;flex-flow: column-reverse;}
    main.sigle-article .p-message__head ,main.archive-article .p-message__head{font-size: 26px;}
    main.sigle-article .p-message__head > span.__1,main.archive-article .p-message__head > span.__1{max-width: unset;padding-right: unset;}
    main.sigle-article .main-content .mv,main.sigle-article .main-content .text-content{width: 100vw;margin-left: calc(-50vw + 50%);}
}