@charset "utf-8";
<!--ポップアップ-->
#pop_c,#pop_c2{
	width: 100%;
	background: #000;
}
#hidden,#hidden2 {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 40%;
	text-align:center;
}
.pop_shadow {
	display: block;
	width: 100%;
}
.pop_text {
	font-size: 14px;
}
<!--
.clear,.clear2 {
	position: absolute;
	top: 10%;
	right: 20%;
}
.br {
	position: absolute;
	top: 50%;
	right: 10%;
}
.bl {
	position: absolute;
	top: 50%;
	left: 10%;
}
-->
.br,.br2 {
	width:40px;
	height:40px;
	position: absolute;
	top: calc(50% - 40px);
	right: 15%;
}
.bl,.bl2 {
	width:40px;
	height:40px;
	position: absolute;
	top: calc(50% - 40px);
	left: 15%;
}
#gallery_close {
			width:50px;
			height:50px;
			background:#000;
			position:absolute;
			right:15%;
			top:20px;
}
.close_1 {
			width:80%;
			height:2px;
			background:#fff;
			display:block;
			transform:rotate(-45deg);
			position:absolute;
			top:50%;
			left:10%;
}
.close_2 {
			width:80%;
			height:2px;
			background:#fff;
			display:block;
			transform:rotate(45deg);
			position:absolute;
			top:50%;
			left:10%;
}
#gallery_left {
			width:80%;
			height:80%;
			border-top:3px solid #fff;
			border-left:3px solid #fff;
			background:#000;
			position:absolute;
			/*上下の位置は後で中央になるように変更*/
			top:50%;
			left:50%;
			transform:rotate(-45deg);
}
#gallery_right {
			width:80%;
			height:80%;
			border-bottom:3px solid #fff;
			border-right:3px solid #fff;
			background:#000;
			position:absolute;
			/*上下の位置は後で中央になるように変更*/
			top:40%;
			right:50%;
			transform:rotate(-45deg);
}
#gallery_close:hover,
#gallery_left:hover,
#gallery_right:hover {
	cursor: pointer;
}