@charset "utf-8";
#contentHeader {
	background : url("/wp/wp-content/themes/pgg_bogo/products/img/bg_main.jpg") 50% 50% no-repeat;
	background-size : cover;
}
#jqPopupContent_window {
	background-color : rgba(255, 255, 255, 0.7);
}
#jqPopupContent_container {
	position : relative;
}
#jqPopupContent_container .post_content {
	position : relative;
	padding : 60px;
	border : 1px solid #dddddd;
	background-color : #ffffff;
}
#jqPopupContent_container .post_content .category {
	position : absolute;
	top : 0;
	left : 0;
	padding : 8px 16px;
	color : #ffffff;
	background-color : #00297b;
}
#jqPopupContent_container .post_content .column {
	display : grid;
	grid-template-columns : 1fr 1fr;
	grid-gap : 60px;
	width : 45vw;
}
#jqPopupContent_container .post_content .img {
	overflow : hidden;
	margin-bottom : 16px;
}
#jqPopupContent_container .post_content .img img {
	width : 100%;
	max-width : 400px;
	padding : 40px;
}
#jqPopupContent_container .post_content .name {
	font-weight : bold;
}
#jqPopupContent_container .post_content .name span {
	margin-right : 0.5em;
}
#jqPopupContent_container .post_content .size span {
	font-weight : bold;
	margin-right : 0.5em;
}
#jqPopupContent_container .post_content .material span {
	font-weight : bold;
	margin-right : 0.5em;
}
#jqPopupContent_container .post_content .weight span {
	font-weight : bold;
	margin-right : 0.5em;
}
#jqPopupContent_container .post_content .detail {
	margin-top : 40px;
	padding-top : 40px;
	border-top : 1px solid #000000;
}
#jqPopupContent_container .__buttons {
	display : flex;
	position : absolute;
	top : 0;
	right : -100px;
	justify-content : center;
	align-items : center;
	width : 100px;
	height : 100px;
	color : #ffffff;
	background-color : #00297b;
}



.prodctList {
	display : grid;
	grid-template-columns : 1fr 1fr 1fr;
	grid-gap : 24px;
}
.prodctList > li a {
	display : grid;
	grid-template-columns : auto 1fr;
	cursor : pointer;
	transition : 0.1s border;
	border : 1px solid #cccccc;
}
.prodctList > li a:hover {
	border : 1px solid #00297b;
}
.prodctList > li a .img {
	width : 120px;
	height : 120px;
}
.prodctList > li a .img img {
	width : 100%;
	height : 100%;
	padding : 16px;
	object-fit : contain;
}
.prodctList > li a .content {
	display : flex;
	position : relative;
	flex-direction : column;
	justify-content : center;
	padding : 16px 36px 16px 16px;
}
.prodctList > li a .content::after {
	position : absolute;
	top : 50%;
	right : 16px;
	width : 7px;
	height : 7px;
	content : "";
	transform : translateY(-50%) rotate(45deg);
	border-width : 1px 1px 0 0;
	border-style : solid solid none none;
	border-color : #aaaaaa #aaaaaa transparent transparent;
	vertical-align : middle;
}

/* --- for 2K or more pc --- */
@media screen and (min-width:1980px) {
}

/* --- for HD pc --- */
@media screen and (min-width:1440px) and (max-width:1979px) {
}

/* --- for normal pc --- */
@media screen and (min-width:1024px) and (max-width:1439px) {
}

/* --- for mobile --- */
@media screen and (max-width:767px) {
	.prodctList {
		grid-template-columns : 1fr;
	}
	#jqPopupContent_container .post_content {
		padding : 32px;
	}
	#jqPopupContent_container .post_content .column {
		grid-template-columns : 1fr;
		grid-gap : 32px;
		width : 60vw;
	}
	#jqPopupContent_container .__buttons {
		top : -80px;
		right : 0;
		width : 80px;
		height : 80px;
	}
}

/* --- for tablet --- */
@media screen and (min-width:768px) and (max-width:1024px) {
}
