/*
    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:9999; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{-moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box; }

/*
    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:#000; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
.cboxIframe{background:#fff;}
#cboxError{padding:50px; border:1px solid #ccc;}
#cboxTitle,#cboxCurrent{opacity: 0; display: none;}
#cboxLoadingGraphic{background:url(../img/loading.gif) no-repeat center center;}

/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {
	border:0;
	padding:0;
	margin:0;
	overflow:visible;
	width:auto; background:none;
}

/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

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



#colorbox {
	margin: 50px 0 0 0;
}
/*ボタン===================================================*/
/*＜ボタン*/
#cboxPrevious{
	position:absolute;
	top:0;
    bottom: 0;
	left:-80px;
	margin:auto;
	background:url(../img/prev.png) no-repeat center center / contain;
	width:60px;
	height:100%;
	text-indent:-9999px;
    padding-top: 45px;
}
#cboxPrevious:hover{background:url(../img/prevHover.png) no-repeat center center / contain; }
/*＞ボタン*/
#cboxNext{
	position:absolute;
	top:0;
    bottom: 0;
	left:auto;
	right:-80px;
	margin:auto;
	background:url(../img/next.png) no-repeat center center / contain;
	width:60px;
	height:100%;
	text-indent:-9999px;}
	#cboxNext:hover{background:url(../img/nextHover.png) no-repeat center center / contain;
    padding-top: 45px;
}

/*とじるボタン*/
#cboxClose{
	position:absolute;
	top:-95px;
	right:5px;
	display:block;
	background:url(../img/close.png) no-repeat  center 12px;
	width:150px;
	height:95px;
	text-indent:-9999px;
	transition: 0.3s;
	border-radius: 0;
}
#cboxClose:hover{
	background:url(../img/close.png) no-repeat center 2px;
}



/*デザイン===================================================*/
#cboxLoadedContent > section {
	display: flex;
	justify-content: center;
	align-items: center;
}
/* popUP */
div.popUP {
	min-height: 500px;
	width: 720px;
	border-radius: 20px;
	padding-top: 0;
	box-sizing: border-box;
}
div.popUP p{
	font-size: 24px;
	text-align: center;
	color: #fff;
	padding: 37px 0;
	line-height: 1;
}
div.popUP p.DonpenImageAreaBig {
	width: 100%;
	background: #fff;
	border-radius: 15px 15px 0 0;
	height: 330px;
	padding: 35px 0;
	position: relative;
}
div.popUP .DonpenImageAreaBig img {
	max-height: 300px;
	height: auto;
	width: auto;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	-webkit-backface-visibility: hidden;
}

/* popUP02 */
div.popUP02 {
	width: 720px;
	height: auto;
	padding: 30px 30px 0;
	border-radius: 20px;
	box-sizing: border-box;
}
div.popUP02 p.DonpenImageAreaBig {
	width: calc(100% - 60px);
	margin:0 30px;
	background: #fff;
	border-radius: 15px;
	height: 300px;
	padding: 35px 0;
	position: relative;
}
div.popUP02 .DonpenImageAreaBig img {
	width: auto;
	max-width: 350px;
	height: auto;
	max-height: 250px;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	-webkit-backface-visibility: hidden;
}
div.popUP02 .donpen20th-inner-list-goods-info h5 {
	color: #fff;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	margin: 0;
	padding: 20px 30px;
}
div.popUP02 .donpen20th-inner-list-goods-info p {
	width: 540px;
	font-size: 16px;
	text-align: center;
	color: #fff;
	margin: auto;
	padding: 12px 30px;
	line-height: 1.6;
	border-top: 1px dotted #51d7ff;
}

.default {
	background: #00b7ee;
}
br.res {
	display: none;
}
/*ムービー===================================================*/
div.popUP.popUPMove {
	height: auto;
	border-radius: 20px;
	padding-top: 30px;
	box-sizing: border-box;
	background:#00b7ee ;
}

/*iframe*/
div.popUP p.MovArea {
	position: relative;
	width: calc(100% - 80px);
	padding-top: 56.25%;
	margin: 0 auto;
}
div.popUP p.MovArea iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}
div.popUP p.cfArea  {
	padding: 0 30px;

}
div.popUP p.cfArea img {
	width: 100%;
	margin: 0 auto;
	border-radius: 10px;
	overflow: hidden;
}


/*レスポンシブ===================================================*/

@media screen and (min-width:1379px){

}
@media screen and (min-width:1068px){

}
@media screen and (max-width:767px){
#colorbox, #cboxOverlay, #cboxWrapper{
	Width: 100%;
}

/*ボタン===================================================*/
/*＜ボタン*/
#cboxPrevious{
	position:absolute;
	top:220px;
	left:5px;
	margin-top:-20px;
	background:url(../img/prevs.png) no-repeat center center / contain;
	width:45px;
	height:45px;
	text-indent:-9999px;
}
#cboxPrevious:hover{background:url(../img/prevHovers.png) no-repeat center center / contain; }
/*＞ボタン*/
#cboxNext{position:absolute;
	top:220px;
	right: 5px;
	margin-top:-20px;
	background:url(../img/nexts.png) no-repeat center center / contain;
	width:45px;
	height:45px;
	text-indent:-9999px;}
	#cboxNext:hover{background:url(../img/nextHovers.png) no-repeat center center / contain;
}

/*とじるボタン*/
#cboxClose{
	position:absolute;
	top:-95px;
	right:5px;
	display:block;
	background:url(../img/close.png) no-repeat  center 12px;
	width:150px;
	height:95px;
	text-indent:-9999px;
	transition: 0.3s;
	border-radius: 0;
}
#cboxClose:hover{
	background:url(../img/close.png) no-repeat center 2px;
}


/*デザイン===================================================*/

/* popUP */
div.popUP {
	width: 440px;
	height: 400px;
	border-radius: 20px;
	padding-top: 20px;
	box-sizing: border-box;
	margin: 0;
}
div.popUP p{
	font-size: 24px;
	text-align: center;
	color: #fff;
	padding: 37px 0;
	line-height: 1;
}
div.popUP p.DonpenImageAreaBig {
	width: calc(100% - 40px);
	margin:0 20px;
	background: #fff;
	border-radius: 15px;
	height: 250px;
	padding: 10px 20px;
	box-sizing: border-box;
}
div.popUP .DonpenImageAreaBig img {
	max-height: 230px;
	height: auto;
	width: auto;
}

/* popUP02 */
div.popUP02 {
	width: 660px;
}
div.popUP02 p.DonpenImageAreaBig {
	width: 100%;
	margin: auto;
}
div.popUP02 .DonpenImageAreaBig img {
}
div.popUP02 .donpen20th-inner-list-goods-info h5 {
	color: #fff;
	font-size: 22px;
	text-align: center;
	margin: 0;
	padding: 20px 20px;
}
div.popUP02 .donpen20th-inner-list-goods-info p {
	width: 540px;
}


/*ボタン===================================================*/
/*＜ボタン*/
#cboxPrevious{
	position:absolute;
	top:220px;
	left:5px;
	margin-top:-20px;
	background:url(../img/prevs.png) no-repeat center center;
	width:45px;
	height:45px;
	text-indent:-9999px;
}
#cboxPrevious:hover{background:url(../img/prevHovers.png) no-repeat center center; }
/*＞ボタン*/
#cboxNext{position:absolute;
	top:220px;
	right: 5px;
	margin-top:-20px;
	background:url(../img/nexts.png) no-repeat center center;
	width:45px;
	height:45px;
	text-indent:-9999px;}
	#cboxNext:hover{background:url(../img/nextHovers.png) no-repeat center center;
}

}



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

/* popUP02 */
div.popUP02 {
	width: 600px;
}
div.popUP02 p.DonpenImageAreaBig {
	width: calc(100% - 20px);
	height: 260px;
}
div.popUP02 .DonpenImageAreaBig img {
}
div.popUP02 .donpen20th-inner-list-goods-info p {
	width: 460px;
}

/*＜ボタン*/
#cboxPrevious{
	top:200px;
}
/*＞ボタン*/
#cboxNext{
	top:200px;
}

}


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

/* popUP02 */
div.popUP02 {
	width: 540px;
}
div.popUP02 p.DonpenImageAreaBig {
	width: calc(100% - 20px);
	height: 200px;
}
div.popUP02 .DonpenImageAreaBig img {
}
div.popUP02 .donpen20th-inner-list-goods-info p {
	width: 400px;
}

/*＜ボタン*/
#cboxPrevious{
	top:180px;
}
/*＞ボタン*/
#cboxNext{
	top:180px;
}

}


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

/* popUP02 */
div.popUP02 {
	width: 480px;
}
div.popUP02 p.DonpenImageAreaBig {
	width: calc(100% - 20px);
}
div.popUP02 .DonpenImageAreaBig img {
}
div.popUP02 .donpen20th-inner-list-goods-info p {
	width: 340px;
}

/*＜ボタン*/
#cboxPrevious{
	top:160px;
}
/*＞ボタン*/
#cboxNext{
	top:160px;
}

}



@media screen and (max-width:480px){
/*デザイン===================================================*/

#cboxPrevious{
	position:absolute;
	top:auto;
	bottom: 13px;
	left:10px;
	background:url(../img/prevss.png) no-repeat left  bottom;
	background-size:auto;
	width:120px;
	height:100px;
	text-indent:-9999px;
}
#cboxPrevious:hover{
background:url(../img/prevss.png) no-repeat left  bottom;
background-size:auto; }
/*＞ボタン*/
#cboxNext{position:absolute;
	top:auto;
	bottom: 13px;
	right: 10px;
	background:url(../img/nextss.png) no-repeat right bottom;
	background-size:auto;
	width:120px;
	height:100px;
	text-indent:-9999px;}
#cboxNext:hover{
	background:url(../img/nextss.png) no-repeat right bottom;
	background-size:auto;
}
#cboxClose{
	position:absolute;
	top:-70px;
	right:2px;
	display:block;
	background:url(../img/close.png) no-repeat  right 9px / contain;
	height:70px;

	text-indent:-9999px;
	transition: 0.3s;
	border-radius: 0;
}
#cboxClose:hover{
	background:url(../img/close.png) no-repeat  right 2px / contain;
}
#colorbox {
	margin: 35px 0 0 0;
}
div.popUP {
	width: 300px;
	height: auto;
	border-radius: 10px;
	padding-top: 20px;
	box-sizing: border-box;
	margin: 0;
	overflow: hidden;
}
div.popUP p{
	font-size: 18px;
	text-align: center;
	color: #fff;
	padding: 11px 0;
	line-height: 2;
}
div.popUP p.DonpenImageAreaBig {
	width: calc(100% - 40px);
	margin:0 20px;
	background: #fff;
	border-radius: 15px;
	height: 250px;
	padding: 10px 20px;
	box-sizing: border-box;
}
div.popUP .DonpenImageAreaBig img {
	max-height: 230px;
	max-width: calc(100% - 40px );
	height: auto;
	width: auto;
}
div.popUP p.MovArea {
	position: relative;
	width: calc(100% - 20px);
	padding-top: 56.25%;
	margin: 0 auto;
}


/* popUP02 */
div.popUP02 {
	width: 380px;
	height: auto;
	border-radius: 20px;
	padding-top: 20px;
	box-sizing: border-box;
	margin: 0;
}
div.popUP02 p.DonpenImageAreaBig {
	width: 100%;
	margin:0 auto;
	background: #fff;
	border-radius: 15px;
	height: 250px;
	padding: 10px 20px;
	box-sizing: border-box;
}
div.popUP02 .DonpenImageAreaBig img {
	max-height: 200px;
}
div.popUP02 .donpen20th-inner-list-goods-info h5 {
	color: #fff;
	font-size: 18px;
	text-align: center;
	margin: 0;
	padding: 15px 20px;
}
div.popUP02 .donpen20th-inner-list-goods-info p {
	width: 320px;
	font-size: 12px;
	text-align: center;
	color: #fff;
	padding: 12px 0;
	line-height: 1.4;
}


/*ボタン===================================================*/
/*＜ボタン*/
#cboxPrevious{
	position:absolute;
	top:150px;
	left:5px;
	margin-top:-20px;
	background:url(../img/prevs.png) no-repeat center center;
	width:45px;
	height:45px;
	text-indent:-9999px;
}
#cboxPrevious:hover{background:url(../img/prevHovers.png) no-repeat center center; }
/*＞ボタン*/
#cboxNext{position:absolute;
	top:150px;
	right: 5px;
	margin-top:-20px;
	background:url(../img/nexts.png) no-repeat center center;
	width:45px;
	height:45px;
	text-indent:-9999px;}
	#cboxNext:hover{background:url(../img/nextHovers.png) no-repeat center center;
}


br.res {
	display: block;
}


}




/*ドンペンの活動===================================================*/

div.popUP.event {
	height: auto;
	padding-top: 0;
}
div.popUP p.popTitle,div.popUP div.popText,div.popUP p.ImgBig,div.popUP p.ImgBig img ,div.popUP ul.slider_picture ,div.popUP ul.slider_picture img {
	width: 470px;
	margin: 0 auto;
}

/*iframe*/
div.popUP  div.MovAria_Box  {
	width: 470px;
	margin: 0 auto;
	background: #fff;
	box-shadow: 3px 3px 8px 0 rgba(0,0,0,0.3);
	box-sizing: border-box;
	padding: 10px;
}
div.popUP  div.MovAria_Box p.MovArea.eventMov  {
	width: 100%;
}
div.popUP p.ImgBig , div.popUP p.ImgBig img , div.popUP ul.slider_picture , div.popUP ul.slider_picture img {
	height: 470px;
}
div.popUP p.popTitle {
	font-size: 32px;
	padding: 20px;
	text-align: left;
}
div.popUP div.popText {
	overflow: hidden;
	padding:20px 0 20px 0;
}
div.popUP div.popText p{
	float: left;
	margin-right: 1em;
	font-size: 17px;
	text-align: left;
	line-height: 1.6;
	padding: 0;
}
div.popUP ul.slider_picture {
    margin-bottom: 15px;
}
div.popUP p.ImgBig,
div.popUP ul.slider_picture {
	background: #fff;
	box-shadow: 3px 3px 8px 0 rgba(0,0,0,0.3);
	padding: 0;
}
div.popUP ul.slider_picture iframe {
	width: 470px;
	height: 470px;
}
div.popUP p.ImgBig img,div.popUP ul.slider_picture img {
	border: 10px #fff solid;
	background: #f1f1f1;
	box-sizing: border-box;
}

div.popUP p.ImgBig img,div.popUP ul.slider_picture .youTube_click {
    cursor: pointer;
}
div.popUP ul.slider_picture .youTube_click iframe {
    display: none;
}
@media screen and (min-width:1379px){

}
@media screen and (min-width:1068px){

}
@media screen and (max-width:767px){
div.popUP p.popTitle,div.popUP div.popText,div.popUP p.ImgBig,div.popUP p.ImgBig img, div.popUP ul.slider_picture , div.popUP ul.slider_picture img {
	width: 310px;
	margin: 0 auto;
}
div.popUP ul.slider_picture {
    margin-bottom: 20px;
}
div.popUP ul.slider_picture iframe {
	width: 310px;
	height: 310px;
}
/*iframe*/
div.popUP div.MovAria_Box {
	width: 310px;
}
div.popUP p.ImgBig,div.popUP p.ImgBig img, div.popUP ul.slider_picture , div.popUP ul.slider_picture img  {
	height: 310px;
}
div.popUP p.popTitle {
	font-size: 24px;
	padding:18px 0;
}
div.popUP div.popText {
	padding:12px 0 45px 0;
}
div.popUP div.popText p{
	font-size: 16px;
}
}
@media screen and (max-width:480px){
div.popUP p.popTitle,div.popUP div.popText,div.popUP p.ImgBig,div.popUP p.ImgBig img, div.popUP ul.slider_picture , div.popUP ul.slider_picture img  {
	width: 260px;
	margin: 0 auto;
}
div.popUP ul.slider_picture {
    margin-bottom: 15px;
}

div.popUP ul.slider_picture iframe {
	width: 260px;
	height: 260px;
}
/*iframe*/
div.popUP div.MovAria_Box  {
	width: 260px;
}
div.popUP p.MovArea.eventMov  {
	position: relative;
	width: 260px;
}
div.popUP p.ImgBig,div.popUP p.ImgBig img, div.popUP ul.slider_picture , div.popUP ul.slider_picture img  {
	height: 260px;
}
div.popUP p.ImgBig img, div.popUP ul.slider_picture img {
	border: 5px #fff solid;
}
div.popUP p.popTitle {
	font-size: 18px;
	padding:5px 0;
}
div.popUP div.popText {
	padding:20px 0 20px 0;
}
div.popUP div.popText p{
	font-size: 13px;
	line-height: 1.5;
}
#cboxPrevious,#cboxNext{
	bottom: 10px;
}

}


/*ドンペンの活動===================================================*/
body.DonpenEvent #cboxPrevious{
	position:absolute;
	bottom: 0;
	top: 0;
	margin-top: 0;
	left:-45px;
	background:url(../img/prevss.png) no-repeat 10px  center;
	background-size:auto;
	width:60px;
	height:100%;
	text-indent:-9999px;
}
body.DonpenEvent #cboxPrevious:hover{
	background:url(../img/prevss.png) no-repeat 10px  center;
	background-size:auto;
}
/*＞ボタン*/
body.DonpenEvent #cboxNext{position:absolute;

	bottom: 0;
	top: 0;
	margin-top: 0;
	right: -45px;
	background:url(../img/nextss.png) no-repeat right 10px center;
	background-size:auto;
	width:60px;
	height:100%;
	text-indent:-9999px;}
body.DonpenEvent #cboxNext:hover{
	background:url(../img/nextss.png) no-repeat right 10px center;
	background-size:auto;
}
body.DonpenEvent #cboxClose{
	position:absolute;
	top:-70px;
	right:2px;
	display:block;
	background:url(../img/close.png) no-repeat  right 9px / contain;
	height:70px;

	text-indent:-9999px;
	transition: 0.3s;
	border-radius: 0;
}
body.DonpenEvent #cboxClose:hover{
	background:url(../img/close.png) no-repeat  right 2px / contain;
}



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

div.donpen20th-wrapper {
	width: calc(100% - 40px);
	width: -webkit-calc(100% - 40px);
}
/* popUP02 */
div.popUP02 {
	width: 380px;
	padding: 20px 15px 0;
}
div.popUP02 p.DonpenImageAreaBig {
	width: 100%;
}
div.popUP02 .DonpenImageAreaBig img {
	max-width: 160px;
}
div.popUP02 .donpen20th-inner-list-goods-info p {
	width: 346px;
}

/*＜ボタン*/
#cboxPrevious{
	top:150px;
}
/*＞ボタン*/
#cboxNext{
	top:150px;
}

}




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

/* popUP02 */
div.popUP02 {
	width: 300px;
	padding: 20px 10px 0;
}
div.popUP02 p.DonpenImageAreaBig {
	width: 100%;
	height: 240px;
	padding: 10px;
}
div.popUP02 .DonpenImageAreaBig img {
}
div.popUP02 .donpen20th-inner-list-goods-info p {
	width: 276px;
}

/*＜ボタン*/
#cboxPrevious{
	top:140px;
}
/*＞ボタン*/
#cboxNext{
	top:140px;
}

}





@media screen and (max-width:374px){
div.popUP {
    width: 240px;
    height: auto;
    border-radius: 10px;
    padding-top: 20px;
    box-sizing: border-box;
    margin: 0;
    overflow: hidden;
}
body.DonpenEvent div.popUP p.popTitle,body.DonpenEvent div.popUP div.popText,body.DonpenEvent div.popUP p.ImgBig,body.DonpenEvent div.popUP p.ImgBig img {
	width: 200px;
	margin: 0 auto;
}
body.DonpenEvent #cboxClose {
    top: -60px;
    height: 60px;
}
/*iframe*/
body.DonpenEvent div.popUP div.MovAria_Box  {
	width: 200px;
}
body.DonpenEvent div.popUP p.MovArea.eventMov  {
	position: relative;
	width: 200px;
}
body.DonpenEvent div.popUP p.ImgBig,body.DonpenEvent div.popUP p.ImgBig img {
	height: 200px;
}
body.DonpenEvent div.popUP p.popTitle {
	font-size: 16px;
	padding:5px 0;
}
body.DonpenEvent div.popUP div.popText p{
	font-size: 12px;
	display: inline;
}
#colorbox {
    margin: 10px 0 0 0;
}
div.popUP div.popText {
    overflow: hidden;
}
}