@charset "UTF-8";

#doartContainer {
width: 100%;
}
#doartContainer p,#doartContainer ul,#doartContainer dl {
margin: 0;
}

#doartContainer .doartConTtlWrapOuter {
padding: 0 2.5rem;
}
#doartContainer .doartConTtlWrap {
max-width: 1280px;
margin: 0 auto 3rem;
}


#doartContainer .doartIntro {
width: 100%;
}
#doartContainer .doartIntro .doartIntroWrap {
display: flex;
}
#doartContainer .doartIntro .doartIntroWrap .img {
width: 70%;
aspect-ratio: 16 / 9;
overflow: hidden;
}
#doartContainer .doartIntro .doartIntroWrap .img img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: bottom;
}
#doartContainer .doartIntro .doartIntroWrap .ttl {
writing-mode: vertical-rl;
width: 30%;
display: flex;
align-items: center;
padding: 2rem;
}
#doartContainer .doartIntro .doartIntroWrap .ttl h4 {
font-weight: normal;
letter-spacing: 0.5rem;
line-height: 2.0;
}
#doartContainer .doartIntro .doartIntroTxtWrapOuter {
padding: 4.5rem 2.5rem 7.5rem;
}
#doartContainer .doartIntro .doartIntroTxtWrap {
max-width: 1024px;
margin: 0 auto
}
#doartContainer .doartIntro .doartIntroTxtWrap .txtBlock {
width: 75%;
margin: 0 0 6rem 0;
}
#doartContainer .doartIntro .doartIntroTxtWrap .txtBlock p:not(:last-child) {
margin: 0 0 1.5rem 0;
}
#doartContainer .doartIntro .doartIntroTxtWrap .doartTerms {
border: 1px solid #ccc;
padding: 1.5rem;
}
#doartContainer .doartIntro .doartIntroTxtWrap .doartTerms p a {
text-decoration: underline;
}
#doartContainer .doartIntro .doartIntroTxtWrap .doartTerms p a:hover {
text-decoration: none;
transition: .3s ease-out;
}


#doartContainer .doartIntro .doartIntroTxtWrap .doartTerms .linkWrap {
margin: 1rem 0 0;
display: flex;
flex-wrap: wrap;
gap: 1rem 1.5rem;
}

@media screen and (max-width: 768px) {
#doartContainer .doartIntro .doartIntroTxtWrap .txtBlock {
width: 100%;
}
}

@media screen and (max-width: 440px) {
#doartContainer .doartConTtlWrapOuter {
padding: 0 20px;
}
#doartContainer .doartIntro .doartIntroWrap {
flex-direction: column;
}
#doartContainer .doartIntro .doartIntroWrap .img {
width: 100%;
aspect-ratio: 3 / 4;
}
#doartContainer .doartIntro .doartIntroWrap .ttl {
writing-mode: horizontal-tb;
width: 100%;
padding:2.75rem 20px 2rem;
}
#doartContainer .doartIntro .doartIntroWrap .ttl h4 {
letter-spacing: 0.4rem;
}
#doartContainer .doartIntro .doartIntroTxtWrapOuter {
padding: 0 20px 4.5rem;
}
#doartContainer .doartIntro .doartIntroTxtWrap .txtBlock {
margin: 0 0 4.5rem 0;
}
}

/* ----------------------------------------------- */
#infoArea {
width: 100%;
padding: 3rem 2.5rem 7.5rem;
}
#infoArea .infoWrapOuter {
max-width: 768px;
margin: 0 auto;
}
#infoArea .infoWrap {
display: flex;
flex-direction: row-reverse;
}
#infoArea .infoWrap .infoTtlBlock {
width: 100%;
max-width: 128px;
}
#infoArea .infoWrap .infoTtlBlock h2 {
writing-mode: vertical-rl;
font-size: 2rem;
letter-spacing: 0.4rem;
margin: 0 0 0 auto;
width: 1em;
}
#infoArea .infoWrap .infoContBlock {
margin: 6rem 0 0 0;
}
#infoArea .infoWrap .infoContBlock article a {
display: flex;
}
#infoArea .infoWrap .infoContBlock article a:hover {
opacity: 0.6;
transition: .3s ease-out;
}
#infoArea .infoWrap .infoContBlock article .imgBlock {
width: 100%;
max-width: 128px;
padding:1rem;
flex-shrink: 0;
}
#infoArea .infoWrap .infoContBlock article .txtBlock dl {
margin: 1.25rem 0 0 1rem;
color: #472427;
font-family: "Zen Old Mincho",'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
}
#infoArea .infoWrap .infoContBlock article .txtBlock dl dt {
margin: 0 0 0.5rem 0;
line-height: 1;
}
#infoArea .infoWrap .infoContBlock article .txtBlock dl dt .date {
color: #472427;
font-size: 0.75rem;
padding: 0 1rem 0 0;
}
#infoArea .infoWrap .infoContBlock article .txtBlock dl dd {
margin: 0;
line-height: 1.5;
font-weight: 700;
word-break: break-all;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
}
#infoArea .infoWrapOuter .tertiaryBtn {
margin: 3rem 0 0 0;
text-align: right;
}

@media screen and (max-width: 768px) {
#infoArea .infoWrap {
flex-direction: column;
}
#infoArea .infoWrap .infoTtlBlock {
max-width: 100%;
}
#infoArea .infoWrap .infoTtlBlock h2 {
writing-mode: horizontal-tb;
font-size: 1.5rem;
letter-spacing: 0.2rem;
width: auto;
}
#infoArea .infoWrap .infoContBlock {
margin: 1.5rem 0 0 0;
}
#infoArea .infoWrap .infoContBlock article:not(:last-child) {
margin: 0 0 1.5rem 0;
}
#infoArea .infoWrap .infoContBlock article .imgBlock {
max-width: 72px;
padding: 0;
}
#infoArea .infoWrap .infoContBlock article .txtBlock dl {
margin: 0 0 0 1rem;
}
}
@media screen and (max-width: 440px) {
#infoArea {
padding: 3rem 20px 6rem;
}
}
/* ----------------------------------------------- */
#doartContainer #doartListArea {
margin: 10rem 0 12.5rem;
}
#doartContainer #doartListArea .doartListHeadOuter {
padding: 0 2.5rem;
}
#doartContainer #doartListArea .doartListHead {
max-width: 1280px;
margin: 0 auto;
}
#doartContainer #doartListArea .doartListHead .doartListNav {
margin: 4.5rem 0 7.5rem 0;
}
#doartContainer #doartListArea .doartListHead .doartListNav ul {
display: flex;
flex-wrap: wrap;
gap:1.5rem 2rem;
}
#doartContainer #doartListArea .doartListHead .doartListNav ul li {
width: calc((100% - 6rem) / 4);
}
#doartContainer #doartListArea .doartListHead .doartListNav ul li a {
position: relative;
display: block;
color: #472427;
text-align: center;
font-weight: 700;
font-family: "Zen Old Mincho",'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
padding: 0.5rem 2rem;
}
#doartContainer #doartListArea .doartListHead .doartListNav ul li a svg {
height: 1rem;
width: 1rem;
fill: #D0010E;
position: absolute;
right: 0.5rem;
top: 0.75rem;
transform: rotate(90deg);
}
#doartContainer #doartListArea .doartListHead .doartListNav ul li a::after {
content: "";
position: absolute;
width: 100%;
height: 1px;
background: #472427;
right: 0;
bottom: 0;
}
#doartContainer #doartListArea .doartListHead .doartListNav ul li a:hover {
color: #D0010E;
transition: .3s ease-out;
}
#doartContainer #doartListArea .doartListHead .doartListNav ul li a:hover::after {
width: 0;
transition: .3s ease-out;
}

@media screen and (max-width: 768px) {
#doartContainer #doartListArea {
margin: 6rem 0 7.5rem;
}
#doartContainer #doartListArea .doartListHead .doartListNav {
margin: 3rem 0 6rem 0;
}
#doartContainer #doartListArea .doartListHead .doartListNav ul li {
width: calc((100% - 2rem) / 2);
}
}

@media screen and (max-width: 440px) {
#doartContainer #doartListArea .doartListHeadOuter {
padding: 0 20px;
}
#doartContainer #doartListArea .doartListHead .doartListNav {
margin: 2rem 0 6rem 0;
}
}

/* ----------------------------------------------- */
#doartContainer #doartListArea .doartStore {
width: 100%;
}
#doartContainer #doartListArea .doartStore:not(:last-child) {
margin: 0 0 10rem 0;
}
#doartContainer #doartListArea .doartStore .mainImg {
aspect-ratio: 3 / 1;
overflow: hidden;
margin: 0 0 4.5rem 0;
}
#doartContainer #doartListArea .doartStore .mainImg img {
width: 100%;
height: 100%;
object-fit: cover;
}

#doartContainer #doartListArea .doartStore .doartStoreWrapOuter {
padding: 0 2.5rem;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap {
max-width: 1280px;
display: flex;
justify-content: space-between;
margin: 0 auto;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .imgBlock {
width: 30%;
aspect-ratio: 3 / 4;
overflow: hidden;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .imgBlock img {
width: 100%;
height: 100%;
object-fit: cover;
}
#doartContainer #doartListArea #doart004.doartStore .doartStoreWrap .imgBlock img {
object-position: right;
}

#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock {
width: 60%;
display: flex;
flex-direction: column;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock .name {
font-size: 2rem;
letter-spacing: 0.1rem;
font-weight: normal;
margin: 1.5rem 0 2rem;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock .txt {
font-family: "Zen Old Mincho",'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
margin: 0 0 3rem 0;
}

#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock .store {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 2rem;
margin: auto 0 0 0;
font-family: "Zen Old Mincho",'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
padding: 0 0 0 1rem;
border-left: 1px solid #D0010E;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock .store dt {
margin: 0 0 0.25rem;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock .store dd a {
text-decoration: none;
color: #472427;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock .store .img {
aspect-ratio: 16 / 9;
overflow: hidden;
width: 20%;
flex-shrink: 0;
min-width: 80px;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock .store .img  img {
width: 100%;
height: 100%;
object-fit: cover;
}
@media screen and (max-width: 1280px) {
#doartContainer #doartListArea .doartStore .mainImg {
aspect-ratio: 2 / 1;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock .store .img {
aspect-ratio: 1 / 1;
width: 14%;
}
}

@media screen and (max-width: 768px) {
#doartContainer #doartListArea .doartStore .mainImg {
margin: 0 0 1.5rem 0;
}
#doartContainer #doartListArea .doartStore .doartStoreWrapOuter {
padding: 0 0rem;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap {
flex-direction: column-reverse;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .imgBlock {
aspect-ratio: 3 / 2;
width: 50%;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock {
width: 100%;
padding: 0 2.5rem 3rem;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock .name {
font-size: 1.5rem;
}
}

@media screen and (max-width: 440px) {
#doartContainer #doartListArea .doartStore:not(:last-child) {
margin: 0 0 7.5rem;
}
#doartContainer #doartListArea .doartStore .mainImg {
aspect-ratio: 16 / 9;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .imgBlock {
width: 80%;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock {
width: 100%;
padding: 0 20px 3rem;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock .name {
font-size: 1.25rem;
}
#doartContainer #doartListArea .doartStore .doartStoreWrap .txtBlock .store {
font-size: 0.875rem;
gap: 1.5rem;
}
}
