:target {
    scroll-margin-top: 165px;
}
html {
    scroll-behavior: smooth;
}
.l-main.case {
    padding-top: 65px;
}
.l-main.case section.dongha {
    margin-top: 15px;
    padding: 0 35px;
}
.case-information {
    padding: 0 40px 0px 40px;
    background-color: #f6fbff;
}
.header-text {
    font-size: 21px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 15px;
}
.case-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 45px;
    position: sticky;
    top: 138px;
}
.case-location {
    position: relative;
    width: 14.28%;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-weight: bold;
    border-right: 1px solid white;
}
.case-location span {
    position: absolute;
    top: 8px;
    right: 5px;
    font-weight: normal;
}
.case-header .case-location:nth-child(1) {
    background-color: #175ed4;
}
.case-header .case-location:nth-child(2) {
    background-color: #01b3ed;
}
.case-header .case-location:nth-child(3) {
    background-color: #3a38a1;
}
.case-header .case-location:nth-child(4) {
    background-color: #38bdb5;
}
.case-header .case-location:nth-child(5) {
    background-color: #0593c2;
}
.case-header .case-location:nth-child(6) {
    background-color: #2a5db1;
}
.case-header .case-location:nth-child(7) {
    background-color: #1288eb;
}
.location-header {
    width: 100%;
    height: 55px;
    padding-left: 40px;
    display: flex;
    align-items: center;
    color: white;
    font-size: 19px;
    font-weight: bold;
    margin-bottom: 30px;
    border-radius: 4px;
}
.case-container .case-main:nth-child(1) .location-header {
    background-color: #175ed4;
}
.case-container .case-main:nth-child(2) .location-header {
    background-color: #01b3ed;
}
.case-container .case-main:nth-child(3) .location-header {
    background-color: #3a38a1;
}
.case-container .case-main:nth-child(4) .location-header {
    background-color: #38bdb5;
}
.case-container .case-main:nth-child(5) .location-header {
    background-color: #0593c2;
}
.case-container .case-main:nth-child(6) .location-header {
    background-color: #2a5db1;
}
.case-container .case-main:nth-child(7) .location-header {
    background-color: #1288eb;
}
.location-detail {
    display: flex;
    max-height: 165px;
}
.location-detail .case-eyecache {
    width: 40%;
    max-height: 220px;
}
.case-title {
    font-weight: bold;
    font-size: 24px;
    color: #2d88f5;
    align-items: center;
    margin-top: 15px;
}
.detail-text {
    margin-left: 15px;
    width: 60%;
}
.detail-text div:nth-child(1) img {
    width: 11px;
    height: auto;
    margin-right: 5px;
}
.detail-text div:nth-child(2) {
    font-size: 17px;
}
.detail-text div:nth-child(3) {
    font-size: 19px;
    color: #e10f0f;
    font-weight: bold;
}
.detail-text div:nth-child(3) span {
    font-size: 15px;
}
.case-more-btn {
    width: 225px;
    height: 64px;
    background-color: #183494;
    display: flex;
    justify-content: center;
    font-weight: bold;
    font-size: 20px;
    color: white;
    align-items: center;
    margin: auto;
    margin-top: 30px;
    margin-bottom: 50px;
    border: 3px solid #183494;
    border-radius: 999px;
    transition: all .4s ease;
}
.case-more-btn:hover {
    color: #183494;
    background-color: white;
}
._sp {
    display: none;
}
@media (max-width: 1200px) {
    .l-aside {
        display: none;
    }
    .l-main.case section.dongha {
        margin-top: 15px;
        padding: 0 30px;
    }
}
@media (max-width: 1080px) {
    .case-header {
        top: 128px;
    }
}
@media (max-width: 800px) {
    .pc-br {
        display: none;
    }
    .location-detail {
        padding: 15px;
    }
    .detail-text {
        margin-left: 15px;
    }
}
@media (max-width: 768px) {
    .case-header {
        position: unset;
    }
    .l-main.case section.dongha {
        margin-top: 15px;
        padding: 0 20px;
    }
    .case-header .case-location:nth-child(1) {
        width: 25%;
    }
    .case-header .case-location:nth-child(2) {
        width: 25%;
    }
    .case-header .case-location:nth-child(3) {
        width: 25%;
    }
    .case-header .case-location:nth-child(4) {
        width: 25%;
        border-right: 0;
    }
    .case-header .case-location:nth-child(5) {
        width: 33.333333%;
        border-top: 1px solid white;
    }
    .case-header .case-location:nth-child(6) {
        width: 33.333333%;
        border-top: 1px solid white;
    }
    .case-header .case-location:nth-child(7) {
        width: 33.333333%;
        border-top: 1px solid white;
    }
}
@media (max-width: 640px) {
    .detail-text {
        margin-left: 10px;
    }
    .detail-text div:nth-child(1) {
        font-size: 2.65vw;
    }
    .detail-text div:nth-child(1) img {
        width: 2.3vw;
        margin-right: 1vw;
    }
    .detail-text div:nth-child(2) {
        font-size: 2.4vw;
    }
    .detail-text div:nth-child(2) p {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .detail-text div:nth-child(3) {
        font-size: 2.4vw;
    }
    .detail-text div:nth-child(3) span {
        font-size: 2.4vw;
    }
    .location-detail {
        padding: 0;
    }
    .case-header div:first-child {
        display: flex;
    }
    .case-header div:first-child .case-location {
        width: 25%;
    }
    .case-header div:last-child {
        display: flex;
    }
    .case-header div:last-child .case-location {
        width: 33.3333%;
    }
    /* .location-header {
    height: calc(5500vw / 640);
    padding-left: calc(4000vw / 640);
    margin-bottom: calc(3000vw / 640);
    font-size: calc(1900vw / 640);
  } */
    /* .case-more-btn {
    width: calc(22100vw / 640);
    height: calc(6000vw / 640);
    margin-top: calc(3000vw / 640);
    margin-bottom: calc(5000vw / 640);
    font-size: calc(2000vw / 640);
  } */
    /* .case-location {
    height: calc(4000vw / 640);
    font-size: calc(1900vw / 640);
  } */
    /* .header-text {
    font-size: calc(2200vw / 640);
  } */
    .case-header {
        margin-bottom: 7vw;
    }
    :target {
        scroll-margin-top: 21.4vw;
    }
    ._pc {
        display: none;
    }
    ._sp {
        display: block;
    }
}
@media (max-width: 615px) {
    .case-information {
        padding: 0 15px 0px 15px;
    }
    .l-main.case {
        padding-top: 50px;
    }
}
@media (max-width: 500px) {
    .header-text {
        font-size: 21px;
    }
    .case-header .case-location:nth-child(1) {
        width: 33.333333%;
    }
    .case-header .case-location:nth-child(2) {
        width: 33.333333%;
    }
    .case-header .case-location:nth-child(3) {
        width: 33.333333%;
        border-right: 0;
    }
    .case-header .case-location:nth-child(4) {
        width: 25%;
        border-right: 1px solid white;
        border-top: 1px solid white;
    }
    .case-header .case-location:nth-child(5) {
        width: 25%;
    }
    .case-header .case-location:nth-child(6) {
        width: 25%;
    }
    .case-header .case-location:nth-child(7) {
        width: 25%;
    }
}
@media (max-width: 450px) {
    .header-text {
        font-size: 19px;
    }
}
@media (max-width: 450px) {
    .header-text {
        font-size: 16px;
    }
}
/* CTA style start */

@media (max-width: 600px) {
    .note-tel-main a {
        white-space: nowrap!important;
    }
    .coupon-tel-main01 a {
        white-space: nowrap!important;
    }
    .note-tel-main a span {
        font-size: 31px!important;
    }
    .coupon-tel-main01 a span {
        font-size: 29px!important;
    }
}
@media (max-width: 500px) {
    .coupon-tel-main01 a span {
        font-size: 27px!important;
    }
    .note-tel-main a span {
        font-size: 27px!important;
    }
}
@media (max-width: 400px) {
    .coupon-tel-main01 a span {
        font-size: 25px!important;
    }
    .note-tel-main a span {
        font-size: 26px!important;
    }
}
/* CTA style end */

.price_flex {
display: flex;
margin: 0.5rem .5rem .5rem 0;
}
.pf {
margin: 0 1% 0 0;
text-align: center;
border-radius: 0.5rem;
width: 48%;
margin: auto;
}
.pf.avg_price {
background: #ededed;
padding-bottom: 0.5rem;
font-size: 19px;
font-weight: bold;
}
.pf.avg_price p:nth-of-type(1) {
background: #818181;
padding: 0.4rem 1rem;
margin-bottom: 0.2rem;
border-radius: 0.5rem 0.5rem 0 0;
color: #FFF;
font-weight: bold;
font-size: 16px;
}
.pf.cl_price {
background: #daebff;
padding-bottom: 0.5rem;
color: #2177dd;
font-size: 19px;
font-weight: bold;
}
.pf.cl_price p:nth-of-type(1) {
background: #2d88f5; 
padding: 0.4rem 1rem;
margin-bottom: 0.2rem;
border-radius: 0.5rem 0.5rem 0 0;
color: #FFF;
font-weight: bold;
font-size: 16px;
}

@media (min-width: 769px) {
    .pf-sp {
        display: none;
    }
    .location-detail .case-eyecache img {
        width: 100%;
        border-radius: 1rem 0 0 0;
        height: 99%;
        object-fit: cover;
    }
}

@media (max-width: 769px) {
    .pf-pc {
        display: none;
    }
    .price_flex {
        margin: .5rem;
    }
    .location-detail .case-eyecache img {
        border-radius: 8rem;
        margin: 10px 10px 10px 20px;
        width: 80px;
        height: 80px;
        object-fit: cover;
        -webkit-border-radius: 8rem;
        -moz-border-radius: 8rem;
        -ms-border-radius: 8rem;
        -o-border-radius: 8rem;
    }
    .case_txt,
    .case_content {
        margin: 1rem 1rem!important;
    }
    .pf.avg_price,
    .pf.cl_price {
        font-size: 14px!important;
    }
    .pf.cl_price p:nth-of-type(1),
    .pf.avg_price p:nth-of-type(1) {
        font-size: 12px!important;
    }
}

/*アコーディオン全体*/
.accordion-area{
list-style: none;
width: 100%;
padding: 0;
}

.accordion-area li{
margin: 10px 0;
}

/*アコーディオンタイトル*/
.case-subtitle {
  cursor: pointer;
  font-size: 1rem;
  padding: 0.5rem 2.5rem 0.5rem 2rem;
  margin: 0;
  transition: all .5s ease;
  position: absolute;
  right: 1rem;
  bottom: -1.5rem;
  border: solid;
  border-radius: 3rem;
  font-weight: bold;
  color: #2d88f5;
  background: #FFF;
}

/*アイコンの＋と×*/
.case-subtitle::before,
.case-subtitle::after{
position: absolute;
content:'';
width: 15px;
height: 2px;
background-color: #2d88f5;

}
.case-subtitle::before{
top:48%;
right: 15px;
transform: rotate(0deg);

}
.case-subtitle::after{
top:48%;
right: 15px;
transform: rotate(90deg);

}
/*　closeというクラスがついたら形状変化　*/
.case-subtitle.close::before{
transform: rotate(45deg);
}

.case-subtitle.close::after{
transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
.box {
display: none;
}
.case-box {
  position: relative;
  margin-bottom: 2.5rem;
  padding-bottom: 1rem;
  box-shadow: 0px 0px 6px 6px #e5f1fe;
  border-radius: 1rem;
  background: #FFF;
}
.case-box__1 {
    padding-bottom: 2rem;
    margin-bottom: 2rem;
}
.case_tags a::before {
  content: url(https://cleanlife-center.com/wp-content/uploads/2022/03/tag-black-shape.png);
  position: absolute;
  left: 14px;
  top: 60%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
.case_tags a {
  padding: 4px 8px 4px 24px;
  background: #5aa3fa;
  color: #FFF;
  border-radius: 1rem;
  font-weight: bold;
  position: relative;
  font-size: 13px;
  margin-right: 4px;
  margin-bottom: 6px;
}
.case_tags {
  margin: 1rem;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
}
.case_tags li {
  margin: 4px 0;
}
.case_taglist {
    margin-bottom: 3rem;
}
.case_img {
  margin: 0 1rem;
  text-align: center;
}
.case_txt,
.case_content {
  margin: 1rem 4rem;
}
.pf span {
  font-size: 14px;
}
ul.case_tag_list li {
  margin: 2px 4px;
}
ul.case_tag_list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 4rem;
}
ul.case_tag_list li a {
  padding: 4px 8px 4px 24px;
  background: #5aa3fa;
  color: #FFF;
  border-radius: 1rem;
  font-weight: bold;
  position: relative;
  font-size: 13px;
}

ul.case_tag_list li a::before {
  content: url(/wp-content/uploads/2021/05/tag-black-shape.png);
  position: absolute;
  left: 14px;
  top: 60%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
form#testSearch {
  display: inline-block;
  background: #daebff;
  padding: 1rem 2rem;
  width: 396px;
  max-width: 100%;
}
.search_form {
  text-align: center;
  margin-bottom: 3rem;
}
input#testSearchInput {
  width: 80%;
  border: solid 1px #cacaca;
  padding: 6px;
}
input[type="submit"] {
  background: #25489a;
  border: none;
  color: #FFF;
  width: 18%;
  padding: 4px;
  border-radius: 2px;
}
.search_form p {
  margin-bottom: 1rem;
}
p.search_txt {
    margin: 2rem 0 1rem;
    font-weight: bold;
}
ul.page-numbers li a,
ul.page-numbers span.page-numbers.dots {
    background: #afcef5;
    margin: 4px;
    padding: 0.7rem 1rem;
    border-radius: 4rem;
}
ul.page-numbers li span.page-numbers {
    margin: 4px;
    background: #183494;
    padding: 0.7rem 1rem;
    border-radius: 4rem;
}
ul.page-numbers {
    list-style: none;
    display: flex;
    margin: 0 auto;
    color: #FFF;
}
.case_pagination {
    text-align: center;
    margin: 0 auto 4rem;
    display: flex;
}
a.next.page-numbers, 
a.prev.page-numbers {
    display: none;
}
::placeholder {
    color: #cacaca;
}
.search_form p {
    font-size: 14px;
}