@charset "UTF-8";


/*============================
	case-archive 
============================*/
.case-archive {
    padding-bottom: 0;
}

.cac__main {
    padding-bottom: 60px;
}

.cac__items {
    width: 102%;
    margin-left: -1%;
}

.case__ttl {
    .font-en {
        margin-top: .5em;
    }
}

.case-archive .case__atc {
    width: 31.33%;
    margin: 0 1% 30px;

    & a {
        display: block;
        width: 100%;
        height: 100%;
        background: #f8f6f1;

    }

    &:hover {
        .case__img img {
            transform: scale(1.05);
        }
    }
}

.case__img img {
    width: 100%;
}

.case__txtwrap {
    padding: 1em;
}

.case__company {
    margin-top: 1em;
    position: relative;
}

.case__txt {
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
}

.case__arw {
    position: absolute;
    right: 1em;
    bottom: 1em;
    width: 40px;
}

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

    .cac__main {
        padding-bottom: 40px;
    }

    .cac__items {
        width: 102%;
        margin-left: -1%;
    }


    .case-archive .case__atc {
        width: 31.33%;
        margin: 0 1% 30px;

    }

    .case__txtwrap {
        padding: 1em;
    }

    .case__company {
        margin-top: 1em;
    }

    .case__arw {
        right: 1em;
        bottom: 1em;
        width: 30px;
    }


}

@media screen and (max-width:767px) {
    .cac__main {
        padding-bottom: 30px;
    }

    .cac__items {
        width: 100%;
        margin-left: 0;
        display: flex;
        justify-content: space-between;
    }


    .case-archive .case__atc {
        width: 49%;
        margin: 0 0 20px;

    }

    .case__txt {
        font-size: 1.2rem;
    }

    .case__txtwrap {
        padding: 1em;
    }

    .case__company {
        margin-top: 1em;
        font-size: 1rem;
    }

    .case__arw {
        right: .5em;
        bottom: 1em;
        width: 25px;
    }
}

/*============================
	case-detail 
============================*/
.case-detail-contents h1,
.case-detail-contents h2 {
    line-height: 1.6;
}

.case__box {
    padding: 20px 3%;
    background: #f9f6ef;
}

.case__logo {
    max-width: 240px;
    min-width: 200px;
}

.case__info {
    padding: 1em 0 1em 5%;
    border-left: solid 1px #957935;
    flex: 1 1 auto;
    margin-left: 5%;
}

.case__ul {
    padding: 1em 0 0;

    & li {
        margin-bottom: 1em;
        display: flex;

    }

    .case__th {
        min-width: 7em;
    }

    .case__td {
        max-width: calc(100% - 7em);
    }
}

.cdt__item {
    margin-bottom: 80px;

    &:last-child {
        margin-bottom: 0;
    }
}

.cdt__img {
    max-width: 800px;
    margin: 0 auto 40px;
}

@media screen and (max-width:1024px) {
    .case__box {
        padding: 20px 3%;
    }

    .case__logo {
        width: 30%;
        min-width: auto;
    }

    .case__info {
        width: 70%;
        padding: 1em 0 1em 5%;
        margin-left: 5%;
    }

    .case__ul {
        padding: 1em 0 0;

        & li {
            margin-bottom: 1em;

        }

        .case__th {
            min-width: 7em;
        }

        .case__td {
            max-width: calc(100% - 7em);
        }
    }

    .cdt__item {
        margin-bottom: 60px;

    }

    .cdt__img {
        width: 80%;
        margin: 0 auto 30px;
    }
}

@media screen and (max-width:767px) {
    .case__box {
        padding: 20px 5%;
    }

    .case__logo {
        width: fit-content;
        margin: 0 auto 20px;

    }

    .case__info {
        width: 100%;
        padding: 1em 0 0;
        margin: 0;
        border: none;
        border-top: solid 1px #957935;

    }

    .case__ul {
        padding: 1em 0 0;

        & li {
            margin-bottom: 1em;

        }

        .case__th {
            min-width: 7em;
        }

        .case__td {
            max-width: calc(100% - 7em);
        }
    }

    .cdt__item {
        margin-bottom: 60px;

    }

    .cdt__img {
        width: fit-content;
        margin: 0 auto 20px;
    }
}

/*============================
	cdt-relations
============================*/
.cdt-relations {
    padding: 100px 0;
    background: #f9f6ef;

    .case__atc {
        width: 32%;
    }

    .case__txtwrap {
        padding: 1em;
        background: #fff;
    }

    .case__arw {
        bottom: 0;
        right: 0;
    }
}


@media screen and (max-width:1024px) {
    .cdt-relations {
        padding: 80px 0;

        .case__atc {
            width: 32%;
        }
    }

}

@media screen and (max-width:767px) {
    .cdt-relations {
        padding: 60px 0;

        .cdt__items {
            display: flex;
            flex-wrap: wrap;
        }

        .case__atc {
            width: 48%;
            margin-bottom: 20px;
        }
    }
}