@charset "utf-8";


.part_select{display: flex;flex-direction: row;align-items: center;gap: 10px;justify-content: flex-end;margin-bottom: 30px;}
.part_ex_wrap{display: flex;flex-wrap: wrap;gap: 30px;}
.part_ex_photo{position: relative;margin-bottom: 8px;}
.part_ex_photo img{width: 100%;aspect-ratio: 4 / 3;display: block;background-color: white;object-fit: contain;}
.part_ex_photo_tag{position: absolute;top: 0;}
.part_ex{width: 100%;}
.part_ex:hover{opacity: 0.8;cursor: pointer;}
.zoom{position: absolute;width: 25px;bottom: 5px;right: 5px;}
.zoom img{background-color: initial;}
@media (min-width: 768px) and (max-width: 1024px){
    .part_ex{width: calc(calc(100% - 30px) / 2);}
}
@media (min-width:1024px) {
    .part_ex{width: calc(calc(100% - 60px) / 3);margin-bottom: 30px;}
}


/* セレクトボックス */
.part_select select {width: 150px;padding: 3px 40px 3px 15px;font-size: 16px;background-color: #fff;border: 1px solid #707070;border-radius: 0px;appearance: none;-webkit-appearance: none;-moz-appearance: none;background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg width='14' height='10' viewBox='0 0 14 10' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l6 7 6-7' stroke='%23333' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat: no-repeat;background-position: right 12px center;background-size: 12px;cursor: pointer;transition: 0.2s ease;}
.part_select select:focus {border-color: #0078d7;box-shadow: 0 0 0 3px rgba(0, 120, 215, 0.2);outline: none;}
.part_select {display: flex;align-items: center;gap: 10px;}



/* ポップアップ */
.popup_overlay {position: fixed;inset: 0;background: rgba(0, 0, 0, 0.7);display: none;justify-content: center;align-items: center;z-index: 1000;}
.popup_overlay.active {display: flex;}
.popup_content {position: relative;max-width: 90%;max-height: 90%;}
.popup_content img {width: 100%;height: auto;}
.popup_content .popupComment { color: #fff;}
.popup_close {position: absolute;top: -10px;right: -10px;background: #fff;border: none;border-radius: 50%;width: 32px;height: 32px;font-size: 20px;cursor: pointer;}
@media (min-width:768px) {
    .popup_content{width: 60%;}
    .popup_content img {aspect-ratio: 4 / 3;display: block;background-color: white;object-fit: contain;}

}