@charset "utf-8";

/* -----------------------------------------
main
-------------------------------------------- */
.brPc {
    display: none;
}

.title {
text-align: center;
font-family: "Karla";
font-size: 2.4rem;
letter-spacing: 3.84px;
background-image: url(../images/paperBg.webp);
background-size: contain;
background-position: center;
width: 100%;
padding: 16px 0px;
flex-direction: column;
align-items: center;
gap: 8px;
}

.title span {
text-align: center;
font-family: "Shippori Mincho";
font-size: 1.4rem;
font-weight: 500;
line-height: 1.5;
letter-spacing: 2.24px;
}


.sub__title {
font-family: "Shippori Mincho";
font-size: 2rem;
font-weight: 500;
line-height: 1.5;
letter-spacing: 1.2px;
margin-top: 120px;
margin-bottom: 64px;
position:relative;
}

.section--info {
    text-align: left;
    padding: 0 16px;
    position: relative;
}

.i__contents {
    margin-top: 16px;
}

.image__container img {
    width: 160px;
    height: 160px;
}

.info__img01 {
    position: absolute;
    top: 8%;
    right: 4%;
    z-index: -1;
}

.info__img02 {
    position: absolute;
    top: 81%;
    right: 6%;
    z-index: -1;
}

.year p,
.i__txt {
    font-family: "Noto Sans JP";
font-size: 1.4rem;
line-height: 1.9;
letter-spacing: 1.12px;
}

.section--info {
    margin-top: 16px;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.new__ex {
font-family: "Noto Sans JP";
font-size: 1.6rem;
font-weight: 500;
line-height: 1.9;
letter-spacing: 1.12px;
margin-top: 24px;
color: var(--primary-brown);
text-decoration: underline;
}

.new__ex:hover {
    color: var(--primary-darkbrown);
    transition: color 0.7s ease;
}

/* 表示されたときに適用 */
.section--info.visible {
    opacity: 1;
    transform: translateY(0);
}

.footer {
    margin-top: 80px;
}

/* info pc */
@media screen and (min-width:769px) {
.brPc {
    display: block;
}

.section--info {
    padding: 80px;
}

.title { 
font-size: 3.2rem;
letter-spacing: 5.12px;
padding: 56px 0px;
}

.title span { 
font-size: 2rem;
font-weight: 600;
line-height: 1.5;
letter-spacing: 3.2px;
}

.i__contents {
    display: flex;
    justify-content: left;
    align-items: start;
    gap: 32px;
    margin-top: 24px;
}

.section--info {
    margin-top: 16px;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
    position: relative;
}

.image__container img {
    width: 400px;
    height: 400px;
}

.info__img01 {
    position: absolute;
    top: 18%;
    right: 14%;
    z-index: -1;
}


.info__img02 {
    position: absolute;
    top: 76%;
    right: 18%;
    z-index: -1;
}

.year p,
.i__txt {
    font-family: "Noto Sans JP";
font-size: 1.6rem;
font-weight: 350;
line-height: 1.7;
letter-spacing: 1.28px;
}

/* 表示されたときに適用 */
.section--info.visible {
    opacity: 1;
    transform: translateY(0);
}
}