@charset "UTF-8";
/*****************************************************
Title: modal.css
Created: 2014‒07‒01
Last Modified:
******************************************************/
body.modalopen{
	overflow: hidden;
}
#modalbg {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: #ececec;
  filter: alpha(opacity=80);
  -moz-opacity: .80;
  opacity: .80;
  z-index: 10000;
  display: none;
}
#modalWrap {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10001;
  overflow: scroll;
  display: none;
}
#modalWrap.disabled #modalDetail {
  top: 50px !important;
  margin-top: 0 !important;
  margin-bottom: 50px;
}
#modalWrap #modalDetail {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 10002;
  height: 450px;
  width: 600px;
  min-height: 250px;
  background: #fff;
  margin: -225px 0 0 -300px;
  transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -webkit-transition: all .3s ease-in-out;
}
#modalWrap #modalDetail.movie {
  height: 473px;
  margin-top: -236px;
}
#modalWrap #modalDetail.movie .reInner {
  overflow: hidden;
}
#modalWrap #modalDetail.movie iframe,
#modalWrap #modalDetail.movie object,
#modalWrap #modalDetail.movie embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#modalWrap #modalDetail iframe {
  vertical-align: bottom;
  width: 100%;
  height: 100%;
}
#modalWrap #modalDetail.detail {
  width: 100% !important;
  height: 100% !important;
  top: 0 !important;
  left: 0 !important;
  margin: 0 !important;
}
#modalWrap #modalDetail .reInner,
#modalWrap #modalDetail iframe {
  width: 100%;
  height: 100%;
  -webkit-overflow-scrolling: touch;
}
#modalWrap #close {
  width: 28px;
  height: 28px;
  background: url(../img/btn_close.png) no-repeat 0 0;
  position: absolute;
  top: -30px;
  right: -30px;
  cursor: pointer;
  z-index: 903;
}
#modalWrap #prev{
	width: 40px;
	height: 80px;
	background: url(/resources/img/common/btn_prev.gif) no-repeat 0 0;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -40px;
	cursor: pointer;
}
#modalWrap #next{
	width: 40px;
	height: 80px;
	background: url(/resources/img/common/btn_next.gif) no-repeat 0 0;
	position: absolute;
	top: 50%;
	right: 0;
	margin-top: -40px;
	cursor: pointer;
}
#modalWrap #modalDetail #loadingbox{
	background: url(/resources/img/common/loading.gif) no-repeat center center #fff;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 904;
}