@charset "UTF-8"; /*ギャラリーシングルレイアウトパターン2 .dlt_lay_gallery_single .dlt_inner, .dlt_lay_gallery_single .dlt_td1, .dlt_lay_gallery_single .dlt_td2{ display: block !important; float:none !important; clear: both !important; width: 100% !important; margin-bottom: 0; } .dlt_lay_gallery_single{ width: 100%; overflow: hidden; margin-bottom: 40px; } .dlt_lay_gallery_single .dlt_mainimg{ width: 100% !important; //任意 height: 340px !important; //任意 } .dlt_lay_gallery_single .dlt_mainimg a img{ max-height: 320px !important; //任意 pxで指定 } .dlt_lay_gallery_single .dlt_thumimg{ margin: 0 auto 15px !important; } */ /* #archive ============================================*/ .dlt_archive_gallery { &.dlt_lay_gallery7 { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; } } .gallery-item { flex-basis: 220px; margin: 0 20px 20px 0; &:nth-of-type(3n) { margin: 0 0 20px; } } .gallery-item__link { display: block; width: 100%; height: 100%; text-decoration: underline; &:hover { text-decoration: none; opacity: .7; } } .gallery-item__img { width: 220px; height: 220px; background-repeat: no-repeat; background-position: center center; background-size: cover; & > img { display: none; width: auto; height: auto; max-width: 100%; max-height: 100%; } } .gallery-item__title { text-align: center; } /* #single ============================================*/ .ba-list { display: -webkit-flex; display: flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; } .ba-list__item { width: 325px; margin: 0 0 25px; &:nth-of-type(odd) { margin: 0 50px 25px 0; } &:nth-of-type(even) { position: relative; &::after { content: "\f061"; font-family: FontAwesome; font-size: 3em; display: block; position: absolute; top: 33%; left: -42px; } } } .ba-list__img { width: 100%; height: 268px; a { display: block; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover; img { display: none; width: auto; height: auto; max-width: 100%; } } } .ba-list__text { text-align: center; } //baなし .gallery-list { display: -webkit-flex; display: flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; align-items: center; } .gallery-list__item { width: 160px; margin: 0 20px 20px 0; &:nth-of-type(4n) { margin: 0 0 20px; } a { img { display: block; margin: 0 auto; width: auto; height: auto; max-width: 100%; max-height: 160px; } } }