.sg{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:16px;width:100%;max-width:520px;background:#fff;padding:0}.sg__placeholder{padding:40px;text-align:center;background:#f5f5f5;border:2px dashed #ccc;color:#777}.sg__main{width:100%;aspect-ratio:1/1;border:2px solid var(--color-secondary);overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:#fff}.sg__main-img{width:100%;height:100%;-o-object-fit:contain;object-fit:contain;display:block;-webkit-transition:opacity .2s ease;transition:opacity .2s ease}.sg__main-img.sg__main-img--loading{opacity:0}.sg__thumbs{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:10px}.sg__thumb{width:88px;height:88px;padding:0;border:2px solid #d8d8d8;background:#fff;cursor:pointer;overflow:hidden;-ms-flex-negative:0;flex-shrink:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-transition:border-color .2s ease;transition:border-color .2s ease}.sg__thumb img{width:100%;height:100%;-o-object-fit:contain;object-fit:contain;display:block;pointer-events:none}.sg__thumb:hover{border-color:var(--color-secondary)}.sg__thumb:focus-visible{outline:2px solid var(--color-secondary);outline-offset:2px}.sg__thumb.sg__thumb--active{border-color:var(--color-secondary);border-width:2px}