@charset "utf-8";
/* CSS Document */

.headTit {
    display: none;
}

/* フェードアウトエフェクト */
#overlay-image {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    height: auto;
    opacity: 1;
    transition: opacity 2s ease-in-out;
}
#overlay-image.fadeout {
    opacity: 0;
}

#contents > #inner_contents {
    padding: 0;
}

.instagram-media {
    min-width: 96% !important;
    margin: auto !important;
}

/* トップメイン画像設定 */
#contents {
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 590px 204px, 660px 204px;
    padding-top: 200px;
}

@media screen and (min-width: 500px) {
    #contents {
        background-size: 890px 304px, 980px 304px;
        padding-top: 300px;
    }
}

@media screen and (min-width: 768px) {
    #contents {
        background-size: 1000px 380px, 1200px 380px;
        padding-top: 380px;
    }
}

@media screen and (min-width: 1200px) {
    #contents {
        background-size: 1200px 560px, 1800px 560px;
        padding-top: 560px;
        margin: 0;
    }
}

/* 左メニュー非表示 */
 #left_side_col {
    display: none !important;
}


.brand-logo {
    top: 1%;
    position: absolute;
    border: none;
    max-width: 100%;
    width: 100%;
    height: 0;
    margin: auto;
    text-shadow: 0 0 4px rgba(0, 0, 0, .6);
    transform: rotate(0.05deg);
}
.brand-logo p.text2 {
    font-family: "游明朝体", "Yu Mincho", YuMincho, serif, "Noto Serif JP";
    color: #FFFFFF;
    text-align: center;
    font-size: 50px;
    margin: 0 auto 0;
    letter-spacing: -2px;
    font-weight: inherit;
}
section.brand-logo img {
    width: 40%;
    margin: 10px auto;
    display: block;
}
h1.brand-name {
    font-size: 24px;
    color: #ffffff;
}
.selectC {
    font-family: "游明朝体", "Yu Mincho", YuMincho, serif, "Noto Serif JP";
    text-align: center;
    color: #FFFFFF;
    text-shadow: 0 0 4px rgba(0, 0, 0);
    top: -250px;
    position: absolute;
    border: none;
    max-width: 100%;
    width: 100%;
}
.selectC p.text2 {
    font-size: 38px;
    letter-spacing: -2px;
    margin: 70px 0 0;
}

.selectC p.text3 {
    font-size: 20px;
    margin: -6px 0 0px;
    letter-spacing: -2px;
}

h2.cate-head-lead {
    text-align: center;
    margin: 4% 0 2%;
    font-weight: normal;
    font-size: 100%;
    font-family: "游明朝体", "Yu Mincho", YuMincho, serif, "Noto Serif JP";
}

@media screen and (min-width: 500px) {
    .selectC {
        top: -320px;
    }
    .selectC p.text2 {
        font-size: 50px;
    }
    .selectC p.text3 {
        font-size: 26px;
    }
    .selectC {
        top: -320px;
    }
}
@media screen and (min-width: 840px) {
    .selectC {
        top: -400px;
    }
    .selectC p.text2 {
        font-size: 80px;
    }
    .selectC {
        top: -400px;
    }
    .selectC p.text3 {
        font-size: 40px;
    }
}
@media screen and (min-width: 1200px) {
    .selectC {
        top: -500px;
    }
    .selectC p.text2 {
        font-size: 100px;
        margin: 70px auto 0px;
    }
    .selectC {
        top: -500px;
    }
    .selectC p.text3 {
        font-size: 50px;
    }
}


/* 公開日時 */
.style_time {
    text-align: center;
}
time.style_body_time {
    background-color: #b19b07;
    padding: 2px 4px;
    color: white;
    margin-bottom: 2%;
    display: inline-block;
}

/* SNSバナー */
.style_fbs24, .style_fbs{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px; /* ボタン間の間隔を調整 */
    margin: 40px auto;
}
.fb-share-button, .twitter-share-button {
    display: flex;
    align-items: center;
}

.fadein {
    opacity: 0;
    transform: translate(0, 50px);
    transition: all 1500ms;
}

.fadein.scrollin {
    opacity: 1;
    transform: translate(0, 0);
}

section.jpn-top {
    overflow: hidden;
}
h1.jpn-top {
    color: #FFFFFF;
    text-shadow: 0 0 4px rgba(0,0,0,.6);
    transform: rotate(0.05deg);
    font-size: 100%;
    text-align: center;
    font-family: "游明朝体", "Yu Mincho", YuMincho, serif, "Noto Serif JP";
}
.jpn-top_sub-in {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
}

.jpn-top-jpn-box {
    line-height: 0;
    width: 100%;
}

.jpn-top-img {
    width: 100%;
    height: auto;
    -o-object-fit: contain;
    object-fit: contain;
    transition: 400ms ease;
}
.point-box {
    margin: auto;
    width: 90%;
}

.jpn-top-box {
    width: 90%;
    text-align: left;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 0;
}

.jpn-top-box_inner {
    opacity: 1;
    -webkit-transition: all 1.8s cubic-bezier(0.77, 0, 0.175, 1);
    transition: all 1.8s cubic-bezier(0.77, 0, 0.175, 1);
    max-width: 100%;
    width: 100%;
}

p.jpn-mid-text {
    width: 90%;
    margin: auto;
    text-align: justify;
    font-family: "游明朝体", "Yu Mincho", YuMincho, serif, "Noto Serif JP";
    font-size: 2.1vw;
}


h1, h2.jpn-top-ttl.font-jp {
    font-family:"游明朝体", "Yu Mincho", YuMincho, serif, "Noto Serif JP";
    font-weight: inherit;
    font-size: 7vw;
    letter-spacing: 0.1em;
    color: #d28815;
    word-wrap: break-word;
    text-align: center;
    margin-top: 30px;
}
h2.jpn-top-ttl.font-jp {
    font-size: 5vw;
    margin: 0 0 10px;
}
h3.jpn-top-midTit.font-jp {
    font-family:"游明朝体", "Yu Mincho", YuMincho, serif, "Noto Serif JP";
    font-weight: inherit;
    font-size: 7vw;
    color: #d28815;
    word-wrap: break-word;
}
.jpn-head {
    text-align: center;
    margin: 0 auto 30px;
}
.jpn-top-lead.font-jp {
    font-family: "Brygada 1918", serif, "Yu Gothic", "こぶりなゴシック W6 JIS2004";
    font-weight: bold;
    font-size: 6.5vw;
    margin: 0 0 20px;
    text-align: center;
    letter-spacing: 0.16em;
}
.jpn-top-mid.font-jp {
    font-family: "Brygada 1918", serif, "Yu Gothic", "こぶりなゴシック W6 JIS2004";
    font-weight: bold;
    font-size: 5vw;
    text-align: center;
    letter-spacing: 0.1em;
}

p.jpn-top-text, .jpn-head-lead {
    font-size: 16px;
    letter-spacing: 0.02em;
    line-height: 1.7;
    text-align: justify;
    width: 96%;
    margin: 30px auto;
}
p.jpn-head-lead {
    font-family: "游明朝体", "Yu Mincho", YuMincho, serif, "Noto Serif JP";
    font-size: 18px;
    text-align: center;
}
.jpn-top-scroll {
    line-height: 1;
    margin: 60px 0 0;
}

polyline.scroll-point {
    fill: none;
    stroke: #4F4F4F;
    stroke-miterlimit: 10;
}
.scroll-box {
    display: inline-block;
    vertical-align: top;
    line-height: 1;
    text-align: left;
    font-family: "Yu Gothic Medium", "游ゴシック Medium", "こぶりなゴシック W3 JIS2004", sans-serif;
    letter-spacing: 0.07em;
    font-size: 3.46vw;
    word-break: normal;
    line-break: strict;
    color: #4f4f4f;
    -webkit-font-smoothing: antialiased;
}

svg {
    width: 10px;
    animation: sdb-h 2.5s infinite;
    vertical-align: bottom;
    line-height: 1;
}

svg:not(:root) {
    overflow: hidden;
}

p.m-color {
    color: #d28815;
    display: inline-block;
    writing-mode: tb-rl;
    writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
    margin: 0 0 0 5px;
    font-size: 15px;
    letter-spacing: 0.12em;
    font-weight: 700;
}

section.top-style2 {
    width: 90%;
    text-align: left;
    box-sizing: border-box;
    margin: 80px auto 0;
    padding: 0;
}

ul.style-list {
    width: 100%;
    flex-wrap: wrap;
    gap: 5vw 0;
    margin: 0 auto 50px;
    display: flex;
    justify-content: space-between;
}
li.style-list_item {
    width: 47%;
}

.style-list_item a {
    font-family: "Yu Gothic Medium", "游ゴシック Medium", "こぶりなゴシック W3 JIS2004", sans-serif;
    letter-spacing: 0.07em;
}

.item-img {
    line-height: 0;
    margin: 0 0 10px;
    position: relative;
}

.item-img img {
    width: 100%;
    height: auto;
}

p.font-web-bold {
    color: #d28815;
    font-family: "Brygada 1918", serif, "Yu Gothic", "こぶりなゴシック W6 JIS2004";
    font-weight: 700;
    width: 20%;
    font-size: 18px;
    text-align: left;
    line-height: 1;
    letter-spacing: 0.04em;
}
.style-list_box {
    position: relative;
    display: -webkit-flex;
    display: flex;
    line-height: 1;
}

.style-list_box::after {
    border-top: solid 1px #d28815;
    border-right: solid 1px #d28815;
    content: '';
    position: absolute;
    width: 6px;
    height: 6px;
    margin-top: 20px;
    -webkit-transform: rotate(45deg);

    transform: rotate(45deg);
    top: 2px;
    right: 2px;
    transition: all .2s;
}

section.top-style3 {
    margin: 80px 0 0;
    padding: 0;
}

span.namber {
    font-size: 50px;
    position: relative;
    bottom: -5px;
}

h3.jpn-top-ttl {
    font-family: "Brygada 1918", serif, "Yu Gothic", "こぶりなゴシック W6 JIS2004";
    font-weight: 700;
    color: #d28815;
    font-size: 32px;
    line-height: 1;
    letter-spacing: 0.12em;
    margin: 0 0 30px;
    text-align: center;
}

p.top-style-text {
    width: 100%;
    margin: 0 auto 35px;
    text-align: left;
    font-size: 15px;
    line-height: 1.8;
    letter-spacing: 0.04em;
    font-weight: normal;
    text-align: justify;
}

ul.style-list3 {
    display: block;
    margin: 0 auto 50px;
    width: 100%;
}

li.style-list_item3 {
    width: 100%;
    margin: 30% 0 30% 0;
    justify-content: center;
    align-items: center;
    text-align: center;
    webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
}

li.style-list_item-rev {
    margin: 0;
    flex-direction: column;
    width: 100%;
    justify-content: center;
    align-items: center;
    webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-flex;
    display: flex;
}

a.pc-link {
    font-family: "游明朝体", "Yu Mincho", YuMincho, serif, "Noto Serif JP";
    letter-spacing: 0.07em;
    display: block;
    width: 90%;
    z-index: 1;
    color: #4f4f4f;
    outline: none !important;
    -webkit-tap-highlight-color: transparent;
    text-decoration: none;
    background-color: rgba(0, 0, 0, 0);
}

.item-img3 {
    line-height: 0;
    position: relative;
    width: 100%;
    overflow: hidden;
}

.item-img3 img {
    transform: scale(2);
    margin: 0 auto;
    display: block;
    -o-object-fit: contain;
    object-fit: contain;
}

.sp-box {
    display: block;
    margin-top: 40px;
    width: 100%;
    text-align: center;
}

span.item-img_color3 {
    background-color: rgba(112, 188, 218, 0.48);
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1;
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

p.sp-box_text {
    letter-spacing: 0;
    padding: 0 2vw;
    font-size: 3.3vw;
    margin: 10px 0 0;
}

a.border-color3 {
    font-family: "游明朝体", "Yu Mincho", YuMincho, serif, "Noto Serif JP";
    letter-spacing: 0.07em;
    border-color: #d28815;
    color: #d28815;
    position: relative;
    display: inline-block;
    line-height: 1;
    margin: 6% 0 0;
    padding: 6px 40px 6px 38px;
    border-style: solid;
    border-width: 1px;
    font-size: 3vw;
    font-weight: 700;
}

.sp-box_link a:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 14px;
    width: 8px;
    height: 8px;
    border: 0px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -4px;
    border-top: solid 1px #ffffff;
    border-right: solid 1px #ffffff;
}

.style-btn {
    font-family: "游明朝体", "Yu Mincho", YuMincho, serif, "Noto Serif JP";
    font-weight: 700;
    width: 100%;
    margin: 0 auto;
    font-size: 3.73vw;
}

.style-btn a {
    font-family: "游明朝体", "Yu Mincho", YuMincho, serif, "Noto Serif JP";
    font-weight: 700;
    border: solid 1px #d28815;
    color: #d28815;
    letter-spacing: 0.07em;
    display: block;
    position: relative;
    line-height: 1;
    padding: 17px 0;
    font-size: 15px;
    text-align: center;
}

.style-btn a:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 15px;
    width: 10px;
    height: 10px;
    border: 0px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -5px;
}

.style-btn a::after {
    border-top: solid 1px #d28815;
    border-right: solid 1px #d28815;
}

p.jpn-top-text.endT {
    margin: 50px auto;
}
.more_item {
    border-top: none;
	padding: 30px 5px 0px 5px;
}

@media screen and (min-width: 500px) {
    .brand-logo {

    }
    .brand-logo p.text2 {
        font-size: 58px;
    }
    h1.brand-name {
        font-size: 28px;
    }
    li.style-list_item {
        width: 32%;
    }
    p.jpn-head-lead {
        font-size: 20px;
    }
    .jpn-top-mid.font-jp {
        font-size: 180%;
    }
    h3.jpn-top-midTit.font-jp {
        font-size: 6.5vw;
    }
    .sp-box {
        margin-top: 30px;
    }
    a.border-color3 {
}
}

@media screen and (min-width: 840px) {
    .brand-logo {
        top: 2.5%;
    }
    .brand-logo p.text2 {
        font-size: 82px;
    }
    h1.brand-name {
        font-size: 38px;
    }
    p.jpn-mid-text {
        font-size: 1.8vw;
    }
    p.jpn-head-lead {
        font-size: 22px;
    }
    .jpn-top-jpn-box {
        width: 100%;
    }
    .jpn-head {
        margin: 0 auto 100px;
        width: 80%;
    }
    .jpn-top-box {
        text-align: left;
        box-sizing: border-box;
        margin: 0 auto;
    }
    .jpn-top-box_inner {
        max-width: 100%;
        width: 90%;
        margin: auto;
    }
    h1.jpn-top {
        font-size: 170%;
    }
    h1, h2.jpn-top-ttl.font-jp {
        font-size: 40px;
        letter-spacing: 0.1em;
    }
    h2.cate-head-lead {
        font-size: 110%;
}
    .jpn-top-lead.font-jp {
        font-size: 48px;
    }
    p.jpn-top-text {
        line-height: 2;
        font-size: 17px;
        letter-spacing: 0.04em;
        width: 100%;
    }
    .jpn-top-mid.font-jp {
        font-size: 180%;
    }
    h3.jpn-top-midTit.font-jp {
        font-size: 3vw;
    }
    .style-list_box::after {
        width: 10px;
        height: 10px;
        margin-top: 30px;
    }
    li.style-list_item {
        width: 19.5%;
    }
    li.style-list_item3 {
        flex-direction: row;
        align-items: flex-start;
        text-align: left;
        margin: 12% 0;
    }
    p.font-web-bold {
        font-size: 23px;
    }
    p.top-style-text {
        font-size: 18px;
        width: 750px;
        line-height: 1.8;
        margin: 0 auto 50px;
    }
    p.sp-box_text {
        font-size: 20px;
    }
    a.border-color3 {
        font-size: 1.8vw;
    }
    p.font-web-bold {
        width: 40%;
    }
    .style-list_box {
        width: 80%;
        margin: auto;
    }
    .style-list_box::after {
        top: -2px;
    }
    .item-img3 img {
        transform: scale(1.5);
    }
    .sp-box {
        margin-top: 0px;
        width: 110%;
        align-self: flex-start;
    }
    li.style-list_item-rev {
        margin: 25% 0;
        flex-direction: row-reverse;
    }
    p.jpn-top-text, .jpn-head-lead {
        margin: 20px auto;
}
	.more_item {
        padding: 50px 5px 40px 5px;
}
}

@media screen and (min-width: 1200px) {
    section.brand-logo img {
        width: 42%;
    }
    .brand-logo {
        top: 3%;
    }
    .brand-logo p.text2 {
        font-size: 100px;
    }
    h1.brand-name {
        font-size: 50px;
    }
    h1, h2.jpn-top-ttl.font-jp {
        font-size: 42px;
    }
    p.jpn-mid-text {
        font-size: 1.5vw;
    }
    p.sp-box_text {
        font-size: 26px;
    }
    a.border-color3 {
        font-size: 20px
    }
    span.namber {
        font-size: 70px;
        bottom: -10px;
    }
    .jpn-top-mid.font-jp {
        font-size: 220%;
    }
    h3.jpn-top-midTit.font-jp {
        font-size: 190%;
    }
    .sp-box {
        margin-top: 0px;
    }
    li.style-list_item-rev {
        margin: 20% 0;
    }
	p.jpn-top-text, .jpn-head-lead {
    margin: 30px auto;
}
}

@media screen and (min-width: 1800px) {
    section.brand-logo img {
    }
    h1.brand-name {
        font-size: 52px;
    }
    .brand-logo p.text2 {
        font-size: 5vw;
    }
    p.jpn-mid-text {
        font-size: 1vw;
    }
}

/* ===== アニメーション初期状態（共通） ===== */
.fadeInLeft, .fadeInRight, .fadeInUp, .fadeInZoomUp, .fadeinScrollin, .fadeInLogo {
  opacity: 0;
}

/* 発火後の動き（is-animated） */
.fadeInLeft.is-animated   { animation: fadeInLeft 1s ease forwards; }
.fadeInRight.is-animated  { animation: fadeInRight 1s ease forwards; }
.fadeInUp.is-animated     { animation: fadeInUp 1s ease forwards; }
.fadeInZoomUp.is-animated { animation: fadeInZoomUp 0.8s ease-out forwards; }
.fadeInLogo.is-animated   { animation: fadeInLogo 1.2s ease-out forwards; } /* ← 追加ここ */
.fadeinScrollin.is-animated { opacity: 1;  transform: translateY(0);  transition: all 1.5s ease; }

/* 初期位置 */
.fadeinScrollin {
  transform: translateY(50px);
}

/* ===== @keyframes定義（内容が異なるため必要最小限） ===== */
@keyframes fadeInLeft {
  0% { opacity: 0; transform: translateX(-100px); }
  100% { opacity: 1; transform: translateX(0); }
}
@keyframes fadeInRight {
  0% { opacity: 0; transform: translateX(100px); }
  100% { opacity: 1; transform: translateX(0); }
}
@keyframes fadeInUp {
  0% { opacity: 0; transform: translateY(100px); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInZoomUp {
  0% { opacity: 0; transform: translateY(50px) scale(0.8); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes fadeInLogo {
  0% { opacity: 0; transform: translateY(50px); } /* ← アニメーション本体の定義を追加 */
  100% { opacity: 1; transform: translateY(0); }
}

/* ===== figレイアウト簡略化：共通 + 個別指定 ===== */
.fig {
  position: relative;
  margin: 0;
  padding: 0;
}
.fig-1 { width: 95%; margin: 0 auto 5%; }
.fig-2 { width: 42%; margin: 0 0 0 auto; z-index: 8; }
.fig-3 { width: 27%; margin: -47% 0 5% 18%; }
.fig-4 { width: 64%; margin: 5% auto 5% 0%; z-index: 1; }
.fig-5 { width: 30%; margin: -45% 0 0 50%; z-index: 10; }

.fig-5.fadeInZoomUp.is-animated {
    width: 40%;
}
@media screen and (min-width: 840px) {
.fig-5.fadeInZoomUp.is-animated {
    width: 34%;
  }
}


/* 動画レスポンシブ表示設定 */
#video {
  width: 100%;
  display: block;
  margin: 0 auto 12%;
}

@media screen and (min-width: 840px) {
  #video {
    width: 80%;
  }
}


section.animated {
    margin: 0 0 26% 0;
}


.fig-1, .fig-2, .fig-3, .fig-4, .fig-5 {
    position: relative;
}

.item-img3.sabu-img {
    width: 70%;
    margin: auto;
}



/* キャプション */
.img-link .caption{
  position:absolute; left:0; right:0; bottom:0; z-index:1;
  padding:8px 12px; font-size:12px; letter-spacing:.02em;
  color:#fff; text-align:center;
  background:linear-gradient(to top, rgba(0,0,2,.55), rgba(0,0,0,0));
}

/* 枠は疑似要素で“画像の上”に常時表示 */
#alice-container .img-link {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 6px; /* 角丸は任意 */
  margin: 0 1px;
}

/* 常時1pxの枠（見え方を安定させるため pointer-events: none） */
#alice-container .img-link::after {
  content: "";
  position: absolute;
  inset: 0;                             /* 上下左右0で全面 */
  border: 1px solid rgba(0,0,0,.14);    /* 枠線色（薄め） */
  border-radius: 6px;                   /* 親と合わせる */
  pointer-events: none;
  box-sizing: border-box;               /* 重要：角でズレないように */
}


/* 念のため：画像・リンクはブロック化 */
#alice-container .img-link img { display:block; width:100%; height:auto; }


/* 常時：ブランド色のうっすら1px枠（#b19812 を少し透過） */
#alice-container .img-link::after{
  border: 1px solid rgba(177, 152, 18, .40) !important; /* #b19812, 40% */
}

/* PCのみ：ホバー/フォーカスで濃く（“押せる感”を強調） */
@media (hover:hover) and (pointer:fine){
  #alice-container .img-link:hover::after,
  #alice-container .img-link:focus-visible::after{
    border-color: #b19812 !important;
    box-shadow: 0 6px 18px rgba(177,152,18,.12); /* 任意の軽い反応 */
  }
}

/* キーボード操作のフォーカスリングもブランド色に（任意） */
#alice-container .img-link:focus-visible{
  outline: 2px solid #b19812;
  outline-offset: 3px;
}




/* 画像リンクの外枠（レイアウト不変・にじみにくい） */
.img-link{
  position: relative;
  display: block;
  overflow: hidden;          /* 角丸を活かす場合に推奨 */
  border-radius: 6px;        /* 角丸は必要なら変更/削除OK */
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.12);  /* ← 外枠1px */
}

/* 既存のキャプション（案B）を使っているならそのままでOK */
.img-link .caption{
  position:absolute; left:0; right:0; bottom:0; z-index:1;
  padding:8px 12px; font-size:10px; letter-spacing:.02em;
  color:#fff; text-align:center;
  background:linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0));
}
@media (hover:hover) and (pointer:fine){
  .img-link:hover,
  .img-link:focus-visible{
    box-shadow: inset 0 0 0 1px #b19b07, 0 6px 18px rgba(0,0,0,.10);
  }
}

/* フォーカスリング（キーボード操作向け） */
.img-link:focus-visible{
  outline: 2px solid #b19b07;
  outline-offset: 3px;
}



/* 横3枚を常時キープ（SPでも3列のまま） */
#item-container .item-img { display:block; line-height:0; }  /* 余白防止 */
#item-container .img-row3{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  width: 80%;
  margin: auto;
}

/* もっとシンプルに“そのまま縮む”だけでOKな場合 */
#item-container .img-row3 img{
  display:block;
  width:100%;
  height:auto;                       /* トリミングしない */
}

/* もし見た目の高さを揃えたいなら下2行に置き換え（任意）
#item-container .img-row3 img{
  width:100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  display:block;
}
*/

@media screen and (min-width: 840px) {
#item-container .img-row3 {
    display: grid
;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    width: 70%;
    margin: auto;
}
.img-link .caption{
  font-size:12px;
}}