@charset "UTF-8";

/* =========================== 
common
===========================*/
.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin-bottom: 40px;
}
.breadcrumb li {
    color: var(--primary-brown);
    font-size: 1.3rem;
}
.breadcrumb li:not(:last-of-type)::after {
    content: "›";
    margin: 0 .6em;
    color: var(--primary-brown);
}

.column__container {
    padding: 120px 6.4% 120px;
    max-width: 1000px;
    margin: 0 auto;
}

.column__thum {
    width: 90%;
    margin: 0 auto;
    margin-bottom: 40px;
}

.column__title,
.column__h2,
.column__h3,
.column__h4 {
    font-family: "游ゴシック体", "YuGothic", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "Noto Sans", sans-serif;
    text-align: left;
}

.column__title {
    font-size: 2.4rem;
    font-weight: 600;
    margin-bottom: 40px;
}

.column__h2 {
    font-size: 2.2rem;
    font-weight: 600;
    margin:40px 0 10px;
}

.column__h3 {
    color: var(--primary-darkBrown);
    font-size: 2rem;
    font-weight: 600;
    padding-left: 0;
    margin: 40px 0 20px;
}

.column__h4 {
    font-size: 1.8rem;
    font-weight: 600;
    margin-top: 20px;
}

.column__img {
    width: 80%;
    max-width: 600px;
    margin:20px 0 60px;
}

.p__contents {
    margin-bottom: 20px;
}

.column__list {
    list-style: disc;
    padding-left: 6.4%;
    margin-bottom: 40px;
}

.column__cite {
    font-style: italic;
    color: var(--primary-gray);
    border-bottom: 1px solid;
}

.redLine {
    background-color: var(--primary-redLine);
}

.yellowLine {
    background-color: var(--primary-yellowLine);
}

.blueLine {
    background-color: var(--primary-blueLine);
}

.p__contents--orange {
    color: var(--primary-orange);
}

.bold {
    font-weight: 700;
}

.red {
    color: var(--primary-red);
    font-weight: 700;
}

/* ipad-600px */
@media screen and (min-width:600px) {
    .column__list {
        padding-left: 2.4%;
    }

    .column__title {
        font-size: 2.8rem;
        margin-bottom: 60px;
    }

    .column__thum {
        width: 80%;
        margin-bottom: 60px;
        height: 400px;
        object-fit: cover;
    }

    .p__contents {
        margin-bottom: 40px;
    }
}