@charset "UTF-8";

.works { padding: 40vw 0 20vw; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; align-items: center; }
.works-content { width: 70vw; margin: 0 auto;}
.works-content li { margin-bottom: 20vw; }
.works-content dt { margin-bottom: 5vw; }
.works-content dt img { margin-bottom: 5vw; }
.works-content dt p.en { width: fit-content; margin-bottom: 0; padding: 0 5vw 5vw 0; border-bottom: 1px solid #a4a4a4; font-size: 4vw; font-family: var(--gothic); font-weight: bold; }
.works-content dd .en { margin-bottom: 0; color: #a4a4a4; font-size: 4vw; font-family: var(--gothic); font-weight: bold; }

/* ============================================= 
    pc
================================================*/
@media screen and (min-width: 736px) {

.works { padding: 120px 0; }
.works-content { width: clamp(700px, 90%, 1200px); }
.works-content ul { display:-webkit-box; display:-webkit-flex; display:flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items:flex-start; align-items:flex-start; -webkit-flex-wrap:wrap; flex-wrap:wrap; }
.works-content li { width: 42%; margin-bottom: 60px; }
.works-content dt { margin-bottom: 20px; }
.works-content dt img { margin-bottom: 10px; }
.works-content dt p.en { padding: 0 10px 10px 0; font-size: 18px; }
.works-content dd .en { font-size: 18px; }

}

  /* retina用 ----------------------------------------------- */
@media screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 736px) and (min-resolution: 2dppx) { }