/*

ColorBox Core Style:

The following CSS is consistent between example themes and should not be altered.

*/

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:25000; overflow:hidden; padding-top:0px;outline:none;}

#cboxOverlay{position:fixed; width:100%; height:100%;}

#cboxMiddleLeft, #cboxBottomLeft{clear:left;}

#cboxContent{position:relative; overflow: hidden;}/*スクロール対策*/

#cboxLoadedContent{overflow:auto;}

#cboxTitle{margin:0;}

#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}

#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

.cboxPhoto{float:left; margin:auto; border:0; display:block;}

.cboxIframe{width:100%; height:100%; display:block; border:1px solid #ffa614;}



/* 

User Style:

Change the following styles to modify the appearance of ColorBox.  They are

ordered & tabbed in a way that represents the nesting of the generated HTML.

*/

#cboxOverlay{background:#fff;}

#colorbox{ margin:0 auto;}

#cboxContent{ padding:0;}

#cboxError{padding:50px; border:1px solid #ccc;}

#cboxLoadedContent{/*	border: 1px solid #231815;*/}

#cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;}

#cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc;}

#cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}

#cboxPrevious{position:absolute; top:50%; left:5px; margin-top:-32px; /*background:url(../images/controls.png) no-repeat top left;*/ width:28px; height:65px; text-indent:-9999px;}

#cboxPrevious.hover{background-position:bottom left;}

#cboxNext{position:absolute; top:50%; right:5px; margin-top:-32px;/* background:url(../images/controls.png) no-repeat top right;*/ width:28px; height:65px; text-indent:-9999px;}

#cboxNext.hover{background-position:bottom right;}

#cboxLoadingOverlay{/*background:#FFF;*/}

#cboxLoadingGraphic{/*background:url(../images/loading.gif) no-repeat center center;*/}

/*#cboxClose{

	position: fixed;

	top: 30px;

	right: 30px;

	display: block;

	width: 54px;

	height: 54px;

	text-indent: -9999px;

	border: none;

	background: transparent url(../img/common/btn_close.png) no-repeat 0 0;

	transition: all 0.5s cubic-bezier(0.53, 0.22, 0.29, 1.46);

}*/

/*#cboxClose.hover{background-position:bottom center}*/

/*#cboxClose:hover {

	transform: rotate(180deg) scale(1.2);

}*/





#cboxClose {

position: fixed;

background: #ffa614;

display: block;

top: 0px;

right: 0;

height: 120px;

text-indent: -9999px;

/*position: absolute;*/

width: 120px;

}

#cboxClose:before {

background: url(../img/common/close.png) no-repeat center center / contain;

bottom:0;

content: '';

left: 0;

right:0;

position: absolute;

top: 0;

transition: transform 0.3s ease;

}

@media screen and (max-width: 768px) {

	#cboxClose{

		position: absolute!important;

		width:12.8vw;

		height:12.8vw;

	}



}