/* MV */

.pagesMV .heading--primary.imgBg {
    background-image: url(../img/mv_appearance.webp);
    line-height: 1.44;
    height: 800rem;
    display: block;
    text-align: left;
    margin-bottom:0;
    position:relative;
}

.mv__titleBox {
    width: 579rem;
    background:rgba(0,0,0,.3);
    position: absolute;
    top:40rem;
    left: calc(50vw - 512rem);
    padding:30rem 28rem;
    }

.mv__subTitle {
    font-size: 14rem;
    background:var(--color-green);
    width:115rem;
    padding: 2rem 0em;
    text-align: center;
    margin-bottom:15rem;
}
.mv__title{
    font-size: 34rem;
    line-height: 1.4;
    margin-bottom:15rem;
}
.mv__title .mv__title--prefix{
    display: block;
    font-size: 20rem;
    margin-bottom:5rem;
}

.mv__tags{
    display: flex;
    gap: 6rem;
}
.mv__tag{
    font-size: 14rem;
    line-height: 1.4;
    letter-spacing: initial;
    border:1px solid var(--color-white);
    border-radius: 5rem;
    padding:4rem 9rem;
    font-weight: normal;
}

@media screen and (max-width: 767.9px) {

.pagesMV .heading--primary.imgBg{
    background-image: url(../img/mv_appearance_sp.webp);
    line-height: 1.44;
    height: 275rem;
    display: block;
    text-align: left;
    margin-bottom:0;    
}

.mv__titleBox {
    width: 100%;
    height: 100%;
    top:0;
    left:0;
    padding:22rem 0;
    background:none;
    }

.mv__title{
    font-size: 22rem;
    margin-bottom:15rem;
    letter-spacing: 0.08em;
}
.mv__title .mv__title--prefix{
    font-size: 16rem;
}

.mv__tags{
    display: flex;
    flex-wrap: wrap;
    gap: 6rem;
    position: absolute;
    bottom: -80rem;
    width: 300rem;
}
.mv__tag{
    border:1px solid var(--color-gray);
    border-radius: 5rem;
    color:var(--color-gray);
    font-weight: normal;
}
}


/*greenDesign*/
.greenDesign {
    padding: 90rem 0 0;
}
.greenDesign__lists {
    margin-top: 55rem;
}

.greenDesign__list {
    margin-bottom: 60rem;
}
.greenDesign__list:last-child {
    margin-bottom: 0;
}
.greenDesign__list .card__img{
    width:640rem;
}
.greenDesign__list .card__lists{
    gap: 60rem;
}
.greenDesign__list .card__list {
    display: flex;
    justify-content: center;
    width: 324rem;
}
.greenDesign__list .card__list__title{
    font-size: 24rem;
    line-height: 1.5;
    margin-bottom:16rem;
}
/*本文ない場合は非表示*/
.greenDesign__list .card__list .text:empty {
  display: none;
}
.greenDesign__list .reverse{
    flex-direction: row-reverse;
}
.greenDesign__list .reverse .card__img{
    width:522rem;
}
.greenDesign__list .reverse .card__list {
    width: 441rem;
}

.greenDesign__box .card__img{
    width:100%;
    margin-bottom:20rem;
}
.card__list__title .forSP {
    display: revert;
    }

@media screen and (max-width: 767.9px) {
.greenDesign {
    padding: 130rem 0 12rem;
}
.lead {
    padding-bottom: 0;
}

.greenDesign__lists {
    margin-top: 55rem;
}

.greenDesign__list {
    margin-bottom: 37rem;
}
.greenDesign__list:last-child{
    margin-bottom:0;
}
.greenDesign__list .card__img{
    width:100%;
}
.greenDesign__list .card__lists{
    gap: 22rem;
}
.greenDesign__list .card__list {
    width: 100%;
}
.greenDesign__list .card__list__title{
    font-size: 18rem;
    margin-bottom:14rem;
}
.greenDesign__list:last-child .card__list__title{
    margin-bottom:0;
}
.greenDesign__list .reverse{
    flex-direction: column;
}
.greenDesign__list .reverse .card__img{
    width:100%;
}
.greenDesign__list .reverse .card__list {
    width: 100%;
}
.card__list__title .forSP{
    display: none;
}



}

/*similarExamples*/

.similarExamples .heading--secondary {
    margin-bottom: 25rem;
    padding-bottom: 10rem;
}
.similarExamples .card__lists::after {
    display: block;
    content:"";
    width: 320rem;
}
.similarExamples .card__list {
    width: 320rem;
    justify-content:flex-start;
    position: relative;
    padding-bottom: 60rem;
}
.similarExamples .card__title {
    margin: 20rem 0 15rem;
    font-weight: bold;
    font-size:16rem;
    line-height: 1.5;
    letter-spacing: initial;
}
.similarExamples .card__tags{
    display: flex;
    flex-wrap: wrap;
    gap: 6rem;
}
.similarExamples .card__tag{
    font-size: 14rem;
    line-height: 1.4;
    color:var(--color-gray);
    letter-spacing: initial;
    border:1px solid var(--color-gray);
    border-radius: 5rem;
    padding:4rem 10rem;
}
.similarExamples .btn--more--right{
    margin-top:20rem;
    position: absolute;
    right: 0;
    bottom: 0;
}
.btn--prev {
    margin: 130rem auto 0;
}

.card__options {
    display: flex;
    flex-wrap: wrap;
    gap: 6rem;
    width: 98%;
    margin-bottom: 20rem;
}

.card__options .card__option {
    font-size: 14rem;
    color: var(--color-gray);
    border: solid 1px var(--color-gray);
    border-radius: 5rem;
    padding: 5rem 10rem;
    line-height: 1;
}

.card__list .btn--more {
    margin-left: auto;
    margin-top: auto;
}

@media screen and (max-width: 767.9px) {
.card__list + .card__list{
    margin-top:40rem;
    }
}
