@charset "UTF-8";
/*
*******************************************************************************************************
# 牛乳パックを親子で楽しもう

  -- override
  -- module, common
  -- layout
*******************************************************************************************************
*/

/* ------------------------------------
  * override
* ------------------------------------ */
#contentArea {
	overflow: hidden;
	position: relative;
	color: #000;
	background-color: #f6f2ed;
}

#contentArea .contents-area-inner {
	position: relative;
	width: 940px;
	margin: 0 auto;
	z-index: 1;
}

#contentArea img {
	width: 100%;
}

@media only screen and (min-width: 737px) {
	br.obj-pc {
		display: inline;
	}
}

@media only screen and (max-width: 736px) {
	#contentArea {
		overflow: visible;
	}
	#contentArea .contents-area-inner {
		box-sizing: border-box;
		width: 100%;
		padding: 0 15px;
	}
	#contentHead .ctsTitle {
		line-height: 1;
	}
}

@media only screen and (max-width: 736px) {
	#contentFoot .wrp-share {
		height: 25px;
		padding: 0;
		position: absolute;
		top: auto;
		bottom: -45px;
		left: -15px;
	}
	#contentFoot .wrp-share ul {
		padding-right: 0;
		float: none;
		text-align: center;
	}
	#contentFoot .wrp-share li {
		float: none;
		padding: 0 14px;
		display: inline-block;
	}
	#contentFoot .wrp-share .line {
		display: inline-block;
	}
}

/*----------------------------------------
	btnPagetop
----------------------------------------*/
#stage #btnPagetop {
	display: none;
	position: fixed;
	bottom: 15px;
	right: 15px;
	z-index: 5;
}
#stage #btnPagetop a:hover {
	opacity: 0.7;
	-moz-opacity: 0.7;
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);  /* For IE 5-7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; /* For IE 8 */
}

/* SP */
@media screen and (max-width: 736px) {
	#stage #contentFoot {
		border-bottom: none;
	}
	#stage #btnPagetop {
		display: block;
		position: relative;
		top: 0;
		left: 0;
		float: right;
		padding: 15px 15px 15px 0;
	}
}



/* ------------------------------------
  * module common
* ------------------------------------ */
/* anime parts
----------------------------------- */
/* スライドテキスト */
#contentArea .anime-txt-slide {
	overflow: hidden;
	display: block;
	width: 0;
	-webkit-transition: all 0.5s ease-out 0s;
	-moz-transition: all 0.5s ease-out 0s;
	-ms-transition: all 0.5s ease-out 0s;
	-o-transition: all 0.5s ease-out 0s;
	transition: all 0.5s ease-out 0s;
	text-overflow: clip;
	white-space: nowrap;
}
#contentArea .anime-txt-slide.animate {
	width: 100%;
}

/* スライドナビテキスト */
#contentArea .anime-nav-slide {
	overflow: hidden;
	display: block;
	width: 0;
	-webkit-transition: all 0.5s ease-out 0s;
	-moz-transition: all 0.5s ease-out 0s;
	-ms-transition: all 0.5s ease-out 0s;
	-o-transition: all 0.5s ease-out 0s;
	transition: all 0.5s ease-out 0s;
	text-overflow: clip;
	white-space: nowrap;
}
#contentArea .anime-nav-slide.animate {
	width: 100%;
}

/* 浮遊落下 */
#contentArea .anime-craft-fall,
#pageBanner .anime-craft-fall {
	position: absolute;
	-webkit-transition: all 0.5s ease-out 0s;
	-moz-transition: all 0.5s ease-out 0s;
	-ms-transition: all 0.5s ease-out 0s;
	-o-transition: all 0.5s ease-out 0s;
	transition: all 0.5s ease-out 0s;
	opacity: 0;
}
#contentArea .anime-craft-fall {
	top: 0;
	right: 0;
	margin-top: 67px;
	margin-right: 23px;
}
#pageBanner .anime-craft-fall {
	top: 0;
	right: 0;
	margin-top: 0;
	margin-right: 81px;
}
#contentArea .anime-craft-fall.animate,
#pageBanner .anime-craft-fall.animate {
	-webkit-animation: fall 1.4s ease-out 0.5s 1 normal forwards;
	-moz-animation: fall 1.4s ease-out 0.5s 1 normal forwards;
	-ms-animation: fall 1.4s ease-out 0.5s 1 normal forwards;
	-o-animation: fall 1.4s ease-out 0.5s 1 normal forwards;
	animation: fall 1.4s ease-out 0.5s 1 normal forwards;
	-webkit-transition-delay: 0.5s;
	-moz-transition-delay: 0.5s;
	-ms-transition-delay: 0.5s;
	-o-transition-delay: 0.5s;
	transition-delay: 0.5s;
	opacity: 1;
}
#contentArea .anime-craft-fall.departure,
#pageBanner .anime-craft-fall.departure {
	-webkit-animation: fallOut 0.7s ease-out 0s 1 normal forwards;
	-moz-animation: fallOut 0.7s ease-out 0s 1 normal forwards;
	-ms-animation: fallOut 0.7s ease-out 0s 1 normal forwards;
	-o-animation: fallOut 0.7s ease-out 0s 1 normal forwards;
	animation: fallOut 0.7s ease-out 0s 1 normal forwards;
	-webkit-transition: opacity 0.5s ease-out 0.2s;
	-moz-transition: opacity 0.5s ease-out 0.2s;
	-ms-transition: opacity 0.5s ease-out 0.2s;
	-o-transition: opacity 0.5s ease-out 0.2s;
	transition: opacity 0.5s ease-out 0.2s;
	opacity: 0;
}

@media only screen and (max-width: 736px) {
	/* 着陸時(トップ用) */
	#contentArea .anime-craft-fall {
		top: 2px;
		right: 1px;
		-webkit-transition: all 0.5s ease-out 0s;
		-moz-transition: all 0.5s ease-out 0s;
		-ms-transition: all 0.5s ease-out 0s;
		-o-transition: all 0.5s ease-out 0s;
		transition: all 0.5s ease-out 0s;
		opacity: 0;
	}
	#contentArea .anime-craft-fall.animate {
		-webkit-animation-name: fall-sp;
		-moz-animation-name: fall-sp;
		-ms-animation-name: fall-sp;
		-o-animation-name: fall-sp;
		animation-name: fall-sp;
	}
}
@-webkit-keyframes fall {
	0% { top: -63px; right: -120px; }
	43.3% { top: 6px; right: 10px; }
	76.6% { top: -2px; right: -3px; }
	100% { top: 0; right: 0; }
}
@-moz-keyframes fall {
	0% { top: -63px; right: -120px; }
	43.3% { top: 6px; right: 10px; }
	76.6% { top: -2px; right: -3px; }
	100% { top: 0; right: 0; }
}
@-ms-keyframes fall {
	0% { top: -63px; right: -120px; }
	43.3% { top: 6px; right: 10px; }
	76.6% { top: -2px; right: -3px; }
	100% { top: 0; right: 0; }
}
@-o-keyframes fall {
	0% { top: -63px; right: -120px; }
	43.3% { top: 6px; right: 10px; }
	76.6% { top: -2px; right: -3px; }
	100% { top: 0; right: 0; }
}
@keyframes fall {
	0% { top: -63px; right: -120px; }
	43.3% { top: 6px; right: 10px; }
	76.6% { top: -2px; right: -3px; }
	100% { top: 0; right: 0; }
}
@-webkit-keyframes fall-sp {
	0% { top: -63px; right: -120px; }
	43.3% { top: 6px; right: 10px; }
	76.6% { top: -2px; right: -3px; }
	100% { top: 0; right: 0; }
}
@-moz-keyframes fall-sp {
	0% { top: -63px; right: -120px; }
	43.3% { top: 6px; right: 10px; }
	76.6% { top: -2px; right: -3px; }
	100% { top: 0; right: 0; }
}
@-ms-keyframes fall-sp {
	0% { top: -63px; right: -120px; }
	43.3% { top: 6px; right: 10px; }
	76.6% { top: -2px; right: -3px; }
	100% { top: 0; right: 0; }
}
@-o-keyframes fall-sp {
	0% { top: -63px; right: -120px; }
	43.3% { top: 6px; right: 10px; }
	76.6% { top: -2px; right: -3px; }
	100% { top: 0; right: 0; }
}
@keyframes fall-sp {
	0% { top: -63px; right: -120px; }
	43.3% { top: 6px; right: 10px; }
	76.6% { top: -2px; right: -3px; }
	100% { top: 0; right: 0; }
}

@-webkit-keyframes fallOut {
	0% { top: 0; right: 0; }
	40% { top: -14px; right: -14px; }
	100% { top: 121px; right: 222px; }
}
@-moz-keyframes fallOut {
	0% { top: 0; right: 0; }
	40% { top: -14px; right: -14px; }
	100% { top: 121px; right: 222px; }
}
@-ms-keyframes fallOut {
	0% { top: 0; right: 0; }
	40% { top: -14px; right: -14px; }
	100% { top: 121px; right: 222px; }
}
@-o-keyframes fallOut {
	0% { top: 0; right: 0; }
	40% { top: -14px; right: -14px; }
	100% { top: 121px; right: 222px; }
}
@keyframes fallOut {
	0% { top: 0; right: 0; }
	40% { top: -14px; right: -14px; }
	100% { top: 121px; right: 222px; }
}


/* pjax遷移アニメーション */
#transitionLayer {
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
}
#transitionLayer.move-start {
	z-index: 1000;
}
/* 飛行機 */
#content .crft-cruising-airplane {
	opacity: 0;
}
#content .move-start .crft-cruising-airplane {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 1;
	width: 94px;
	height: 69px;
	-webkit-animation: flight 1.2s linear 0.8s 1 normal forwards;
	animation: flight 1.2s linear 0.8s 1 normal forwards;
	margin-bottom: 60%;
	margin-left: 120%;
	opacity: 1;
}
/* ベース背景 */
#content .cruising-bg {
	position: absolute;
	z-index: 2;
	top: 0;
	left: 100%;
	right: auto;
	width: 300%;
	height: 100%;
	height: 100vh;
	transform-origin: center top;
	transform: skewX(38.6deg);
	opacity: 0;
}
#content .move-start .cruising-bg {
	left: -100%;
	right: -100%;
	transform-origin: center center;
	-webkit-transition: left 0.8s linear 1.1s, right 0.8s linear 1.1s, transform-origin 0.8s linear 1.1s;
	transition: left 0.8s linear 1.1s, right 0.8s linear 1.1s, transform-origin 0.8s linear 1.1s;
	opacity: 1;
}
#content .move-end .cruising-bg {
	left: auto;
	right: 100%;
	transform-origin: center bottom;
	-webkit-transition-delay: 0.5s;
	transition-delay: 0.5s;
}
#content .cruising-bg:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
	height: 100vh;
	background-color: #f6f2ed;
}
/* 色付き背景 */
#content .cruising-bg-color01,
#content .cruising-bg-color02,
#content .cruising-bg-color03 {
	display: block;
	position: absolute;
	top: 0;
	left: 50%;
	width: 20%;
	height: 100%;
	height: 100vh;
	z-index: 2;
}
#content .cruising-bg-color01 { background-color: #f0e886; }
#content .cruising-bg-color02 { background-color: #afd4de; }
#content .cruising-bg-color03 { background-color: #c3dba3; }

#content .move-start .cruising-bg-color01,
#content .move-start .cruising-bg-color02,
#content .move-start .cruising-bg-color03 {
	-webkit-animation-name: overlayColor01;
	animation-name: overlayColor01;
	-webkit-animation-duration: 0.8s;
	animation-duration: 0.8s;
	-webkit-animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
	animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
#content .move-start .cruising-bg-color01 {
	-webkit-animation-delay: 0.9s;
	animation-delay: 0.9s;
}
#content .move-start .cruising-bg-color02 {
	-webkit-animation-delay: 1.1s; transform: translateX(15%);
	animation-delay: 1.1s; transform: translateX(15%);
}
#content .move-start .cruising-bg-color03 {
	-webkit-animation-delay: 1.3s; transform: translateX(30%);
	animation-delay: 1.3s; transform: translateX(30%);
}

/* end付与時に見えるのを回避 */
#content .move-end .cruising-bg-color01,
#content .move-end .cruising-bg-color02,
#content .move-end .cruising-bg-color03 {
	display: none;
}

#content .cruising-bg-color04,
#content .cruising-bg-color05,
#content .cruising-bg-color06 {
	display: block;
	position: absolute;
	top: 0;
	right: -50%;
	width: 20%;
	height: 100%;
	height: 100vh;
	z-index: 2;
}
#content .cruising-bg-color04 { background-color: #f0e886; }
#content .cruising-bg-color05 { background-color: #afd4de; }
#content .cruising-bg-color06 { background-color: #c3dba3; }

#content .move-end .cruising-bg-color04,
#content .move-end .cruising-bg-color05,
#content .move-end .cruising-bg-color06 {
	-webkit-animation-name: overlayColor02;
	animation-name: overlayColor02;
	-webkit-animation-duration: 0.8s;
	animation-duration: 0.8s;
	-webkit-animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
	animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
#content .move-end .cruising-bg-color04 {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
	transform: translateX(-30%);
}
#content .move-end .cruising-bg-color05 {
	-webkit-animation-delay: 0.4s;
	animation-delay: 0.4s;
	transform: translateX(-15%);
}
#content .move-end .cruising-bg-color06 {
	-webkit-animation-delay: 0.6s;
	animation-delay: 0.6s;
}

/* 飛行機が飛ぶアニメーション */
@-webkit-keyframes flight {
	0% { margin-bottom: 60%; margin-left: 120%; }
	100% { margin-bottom: -30%; margin-left: -40%; }
}
@keyframes flight {
	0% { margin-bottom: 60%; margin-left: 120%; }
	100% { margin-bottom: -30%; margin-left: -40%; }
}
/* 3色重ねるアニメーション(前半) */
@-webkit-keyframes overlayColor01 {
	0% { left: 0; }
	100% { left: -20%; }
}
@keyframes overlayColor01 {
	0% { left: 0; }
	100% { left: -20%; }
}
/* 3色重ねるアニメーション(後半) */
@-webkit-keyframes overlayColor02 {
	0% { right: -20%; }
	100% { right: 0%; }
}
@keyframes overlayColor02 {
	0% { right: -20%; }
	100% { right: 0%; }
}

/* 3色重ねるアニメーション(前半) */
@-webkit-keyframes overlayColor01-sp {
	0% { left: 0%; }
	100% { left: -20%; }
}
@keyframes overlayColor01-sp {
	0% { left: 0%; }
	100% { left: -20%; }
}
/* 3色重ねるアニメーション(後半) */
@-webkit-keyframes overlayColor02-sp {
	0% { right: -20%; }
	100% { right: 0%; }
}
@keyframes overlayColor02-sp {
	0% { right: -20%; }
	100% { right: 0%; }
}


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

	#contentArea .anime-craft-fall {
		margin-top: 0;
		margin-right: 0;
	}
	#contentArea .anime-craft-fall.animate {
	}
	#contentArea .anime-craft-fall.departure {
		-webkit-animation: fallOut 0.7s ease-out 0s 1 normal forwards;
		animation: fallOut 0.7s ease-out 0s 1 normal forwards;
		opacity: 0;
		-webkit-transition: opacity 0.5s ease-out 0.2s;
		transition: opacity 0.5s ease-out 0.2s;
	}
}



/* 工作カタカタ */
.anime-craft-dance {
	position: relative;
	z-index: 4;
}
.anime-craft-dance img {
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
}
.anime-craft-dance.animate img {
	-webkit-transform: rotate(-20deg);
	-moz-transform: rotate(-20deg);
	-ms-transform: rotate(-20deg);
	-o-transform: rotate(-20deg);
	transform: rotate(-20deg);
}
@media only screen and (max-width: 736px) {
	.anime-craft-dance.animate img {
		-webkit-animation: dance-sp 1s ease-out 0s 3 normal forwards;
		-moz-animation: dance-sp 1s ease-out 0s 3 normal forwards;
		-ms-animation: dance-sp 1s ease-out 0s 3 normal forwards;
		-o-animation: dance-sp 1s ease-out 0s 3 normal forwards;
		animation: dance-sp 1s ease-out 0s 3 normal forwards;
	}
	.box-craft-list .panel-layout .panel-list .slick-active img {
		-webkit-animation: dance-sp 1s ease-out 0s infinite normal forwards;
		-moz-animation: dance-sp 1s ease-out 0s infinite normal forwards;
		-ms-animation: dance-sp 1s ease-out 0s infinite normal forwards;
		-o-animation: dance-sp 1s ease-out 0s infinite normal forwards;
		animation: dance-sp 1s ease-out 0s infinite normal forwards;
	}
}
@-webkit-keyframes dance-sp {
	0% {	-webkit-transform: rotate(0deg);	}
	49.9% {	-webkit-transform: rotate(0deg);	}
	50% {	-webkit-transform: rotate(-20deg);	}
	99.9% {	-webkit-transform: rotate(-20deg);	}
	100% {	-webkit-transform: rotate(0deg);	}
}
@-moz-keyframes dance-sp {
	0% {	-moz-transform: rotate(0deg);	}
	49.9% {	-moz-transform: rotate(0deg);	}
	50% {	-moz-transform: rotate(-20deg);	}
	99.9% {	-moz-transform: rotate(-20deg);	}
	100% {	-moz-transform: rotate(0deg);	}
}
@-ms-keyframes dance-sp {
	0% {	-ms-transform: rotate(0deg);	}
	49.9% {	-ms-transform: rotate(0deg);	}
	50% {	-ms-transform: rotate(-20deg);	}
	99.9% {	-ms-transform: rotate(-20deg);	}
	100% {	-ms-transform: rotate(0deg);	}
}
@-o-keyframes dance-sp {
	0% {	-o-transform: rotate(0deg);	}
	49.9% {	-o-transform: rotate(0deg);	}
	50% {	-o-transform: rotate(-20deg);	}
	99.9% {	-o-transform: rotate(-20deg);	}
	100% {	-o-transform: rotate(0deg);	}
}
@keyframes dance-sp {
	0% {	transform: rotate(0deg);	}
	49.9% {	transform: rotate(0deg);	}
	50% {	transform: rotate(-20deg);	}
	99.9% {	transform: rotate(-20deg);	}
	100% {	transform: rotate(0deg);	}
}

/* 吹き出しゆらゆら */
#contentArea .anime-balloon-swing.animate img {
	-webkit-animation: swing 0.5s ease-out 0.6s 1 normal forwards;
	-moz-animation: swing 0.5s ease-out 0.6s 1 normal forwards;
	-ms-animation: swing 0.5s ease-out 0.6s 1 normal forwards;
	-o-animation: swing 0.5s ease-out 0.6s 1 normal forwards;
	animation: swing 0.5s ease-out 0.6s 1 normal forwards;
}
@media only screen and (min-width: 737px) {
	#contentArea .anime-balloon-swing:hover img {
		-webkit-animation: swing 0.5s ease-out 0s 1 normal forwards;
		-moz-animation: swing 0.5s ease-out 0s 1 normal forwards;
		-ms-animation: swing 0.5s ease-out 0s 1 normal forwards;
		-o-animation: swing 0.5s ease-out 0s 1 normal forwards;
		animation: swing 0.5s ease-out 0s 1 normal forwards;
	}
}
@media only screen and (max-width: 736px) {
	#contentArea .anime-balloon-swing.animate-sp img {
		-webkit-animation: swing 0.5s ease-out 0s 1 normal forwards;
		-moz-animation: swing 0.5s ease-out 0s 1 normal forwards;
		-ms-animation: swing 0.5s ease-out 0s 1 normal forwards;
		-o-animation: swing 0.5s ease-out 0s 1 normal forwards;
		animation: swing 0.5s ease-out 0s 1 normal forwards;
	}
}
@-webkit-keyframes swing {
	0% {	-webkit-transform: rotate(0deg);	}
	17% {	-webkit-transform: rotate(20deg);	}
	34% {	-webkit-transform: rotate(-5deg);	}
	51% {	-webkit-transform: rotate(15deg);	}
	68% {	-webkit-transform: rotate(-2deg);	}
	84% {	-webkit-transform: rotate(10deg);	}
	100% {	-webkit-transform: rotate(0deg);	}
}
@-moz-keyframes swing {
	0% {	-moz-transform: rotate(0deg);	}
	17% {	-moz-transform: rotate(20deg);	}
	34% {	-moz-transform: rotate(-5deg);	}
	51% {	-moz-transform: rotate(15deg);	}
	68% {	-moz-transform: rotate(-2deg);	}
	84% {	-moz-transform: rotate(10deg);	}
	100% {	-moz-transform: rotate(0deg);	}
}
@-ms-keyframes swing {
	0% {	-ms-transform: rotate(0deg);	}
	17% {	-ms-transform: rotate(20deg);	}
	34% {	-ms-transform: rotate(-5deg);	}
	51% {	-ms-transform: rotate(15deg);	}
	68% {	-ms-transform: rotate(-2deg);	}
	84% {	-ms-transform: rotate(10deg);	}
	100% {	-ms-transform: rotate(0deg);	}
}
@-o-keyframes swing {
	0% {	-o-transform: rotate(0deg);	}
	17% {	-o-transform: rotate(20deg);	}
	34% {	-o-transform: rotate(-5deg);	}
	51% {	-o-transform: rotate(15deg);	}
	68% {	-o-transform: rotate(-2deg);	}
	84% {	-o-transform: rotate(10deg);	}
	100% {	-o-transform: rotate(0deg);	}
}
@keyframes swing {
	0% {	transform: rotate(0deg);	}
	17% {	transform: rotate(20deg);	}
	34% {	transform: rotate(-5deg);	}
	51% {	transform: rotate(15deg);	}
	68% {	transform: rotate(-2deg);	}
	84% {	transform: rotate(10deg);	}
	100% {	transform: rotate(0deg);	}
}

/* 吹き出し強調 */

#contentArea .anime-balloon-em img {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-touch-callout: none;
	-moz-user-select: none;
	-ms-touch-callout: none;
	-ms-user-select: none;
	touch-callout: none;
	user-select: none;
}
#contentArea .anime-balloon-em.ready img {
	-webkit-animation: squeeze 0.3s ease-out 0s 1 normal forwards;
	-moz-animation: squeeze 0.3s ease-out 0s 1 normal forwards;
	-ms-animation: squeeze 0.3s ease-out 0s 1 normal forwards;
	-o-animation: squeeze 0.3s ease-out 0s 1 normal forwards;
	animation: squeeze 0.3s ease-out 0s 1 normal forwards;
}
@media only screen and (min-width: 737px) {
	#contentArea .anime-balloon-em:hover img {
		-webkit-animation: squeeze 0.5s ease-out 0s 1 normal forwards;
		-moz-animation: squeeze 0.5s ease-out 0s 1 normal forwards;
		-ms-animation: squeeze 0.5s ease-out 0s 1 normal forwards;
		-o-animation: squeeze 0.5s ease-out 0s 1 normal forwards;
		animation: squeeze 0.5s ease-out 0s 1 normal forwards;
	}
}
@-webkit-keyframes squeeze {
	0% {	-webkit-transform: scale(1, 1) rotate(0deg);	}
	100% {	-webkit-transform: scale(0.4, 0.4) rotate(-10deg);	}
}
@-moz-keyframes squeeze {
	0% {	-moz-transform: scale(1, 1) rotate(0deg);	}
	100% {	-moz-transform: scale(0.4, 0.4) rotate(-10deg);	}
}
@-ms-keyframes squeeze {
	0% {	-ms-transform: scale(1, 1) rotate(0deg);	}
	100% {	-ms-transform: scale(0.4, 0.4) rotate(-10deg);	}
}
@-o-keyframes squeeze {
	0% {	-o-transform: scale(1, 1) rotate(0deg);	}
	100% {	-o-transform: scale(0.4, 0.4) rotate(-10deg);	}
}
@keyframes squeeze {
	0% {	transform: scale(1, 1) rotate(0deg);	}
	100% {	transform: scale(0.4, 0.4) rotate(-10deg);	}
}
#contentArea .anime-balloon-em.animate img {
	-webkit-animation: emphasis 0.5s ease-out 0s 1 normal forwards;
	-moz-animation: emphasis 0.5s ease-out 0s 1 normal forwards;
	-ms-animation: emphasis 0.5s ease-out 0s 1 normal forwards;
	-o-animation: emphasis 0.5s ease-out 0s 1 normal forwards;
	animation: emphasis 0.5s ease-out 0s 1 normal forwards;
}
@-webkit-keyframes emphasis {
	0% {	-webkit-transform: scale(0.4, 0.4) rotate(-10deg);	}
	25% {	-webkit-transform: scale(1.4, 1.4) rotate(25deg);	}
	45% {	-webkit-transform: scale(1.4, 1.4) rotate(0deg);	}
	53% {	-webkit-transform: scale(1.3, 1.3) rotate(15deg);	}
	100% {	-webkit-transform: scale(1, 1) rotate(0deg);	}
}
@-moz-keyframes emphasis {
	0% {	-moz-transform: scale(0.4, 0.4) rotate(-10deg);	}
	25% {	-moz-transform: scale(1.4, 1.4) rotate(25deg);	}
	45% {	-moz-transform: scale(1.4, 1.4) rotate(0deg);	}
	53% {	-moz-transform: scale(1.3, 1.3) rotate(15deg);	}
	100% {	-moz-transform: scale(1, 1) rotate(0deg);	}
}
@-ms-keyframes emphasis {
	0% {	-ms-transform: scale(0.4, 0.4) rotate(-10deg);	}
	25% {	-ms-transform: scale(1.4, 1.4) rotate(25deg);	}
	45% {	-ms-transform: scale(1.4, 1.4) rotate(0deg);	}
	53% {	-ms-transform: scale(1.3, 1.3) rotate(15deg);	}
	100% {	-ms-transform: scale(1, 1) rotate(0deg);	}
}
@-o-keyframes emphasis {
	0% {	-o-transform: scale(0.4, 0.4) rotate(-10deg);	}
	25% {	-o-transform: scale(1.4, 1.4) rotate(25deg);	}
	45% {	-o-transform: scale(1.4, 1.4) rotate(0deg);	}
	53% {	-o-transform: scale(1.3, 1.3) rotate(15deg);	}
	100% {	-o-transform: scale(1, 1) rotate(0deg);	}
}
@keyframes emphasis {
	0% {	transform: scale(0.4, 0.4) rotate(-10deg);	}
	25% {	transform: scale(1.4, 1.4) rotate(25deg);	}
	45% {	transform: scale(1.4, 1.4) rotate(0deg);	}
	53% {	transform: scale(1.3, 1.3) rotate(15deg);	}
	100% {	transform: scale(1, 1) rotate(0deg);	}
}

/* ボール転がし */
#contentArea .anime-roll img {
	position: relative;
	-webkit-transition: all 0.3s ease-out 0s;
	-moz-transition: all 0.3s ease-out 0s;
	-ms-transition: all 0.3s ease-out 0s;
	-o-transition: all 0.3s ease-out 0s;
	transition: all 0.3s ease-out 0s;
	opacity: 0;
}
#contentArea .anime-roll.anime-roll-r.animate img {
	-webkit-animation: roll-r 0.8s ease-out 0s 1 normal forwards;
	-moz-animation: roll-r 0.8s ease-out 0s 1 normal forwards;
	-ms-animation: roll-r 0.8s ease-out 0s 1 normal forwards;
	-o-animation: roll-r 0.8s ease-out 0s 1 normal forwards;
	animation: roll-r 0.8s ease-out 0s 1 normal forwards;
	opacity: 1;
}
@-webkit-keyframes roll-r {
	0% {	right: -200px; -webkit-transform: rotate(270deg);	}
	75% {	right: 54px; -webkit-transform: rotate(-50deg);	}
	85% {	right: 54px; -webkit-transform: rotate(-50deg);	}
	100% {	right: 0; -webkit-transform: rotate(0deg);	}
}
@-moz-keyframes roll-r {
	0% {	right: -200px; -moz-transform: rotate(270deg);	}
	75% {	right: 54px; -moz-transform: rotate(-50deg);	}
	85% {	right: 54px; -moz-transform: rotate(-50deg);	}
	100% {	right: 0; -moz-transform: rotate(0deg);	}
}
@-ms-keyframes roll-r {
	0% {	right: -200px; -ms-transform: rotate(270deg);	}
	75% {	right: 54px; -ms-transform: rotate(-50deg);	}
	85% {	right: 54px; -ms-transform: rotate(-50deg);	}
	100% {	right: 0; -ms-transform: rotate(0deg);	}
}
@-o-keyframes roll-r {
	0% {	right: -200px; -o-transform: rotate(270deg);	}
	75% {	right: 54px; -o-transform: rotate(-50deg);	}
	85% {	right: 54px; -o-transform: rotate(-50deg);	}
	100% {	right: 0; -o-transform: rotate(0deg);	}
}
@keyframes roll-r {
	0% {	right: -200px; transform: rotate(270deg);	}
	75% {	right: 54px; transform: rotate(-50deg);	}
	85% {	right: 54px; transform: rotate(-50deg);	}
	100% {	right: 0; transform: rotate(0deg);	}
}
#contentArea .anime-roll.anime-roll-l.animate img {
	-webkit-animation: roll-l 0.8s ease-out 0s 1 normal forwards;
	-moz-animation: roll-l 0.8s ease-out 0s 1 normal forwards;
	-ms-animation: roll-l 0.8s ease-out 0s 1 normal forwards;
	-o-animation: roll-l 0.8s ease-out 0s 1 normal forwards;
	animation: roll-l 0.8s ease-out 0s 1 normal forwards;
	opacity: 1;
}
@-webkit-keyframes roll-l {
	0% {	left: -200px; -webkit-transform: rotate(-270deg);	}
	75% {	left: 54px; -webkit-transform: rotate(50deg);	}
	85% {	left: 54px; -webkit-transform: rotate(50deg);	}
	100% {	left: 0; -webkit-transform: rotate(0deg);	}
}
@-moz-keyframes roll-l {
	0% {	left: -200px; -moz-transform: rotate(-270deg);	}
	75% {	left: 54px; -moz-transform: rotate(50deg);	}
	85% {	left: 54px; -moz-transform: rotate(50deg);	}
	100% {	left: 0; -moz-transform: rotate(0deg);	}
}
@-ms-keyframes roll-l {
	0% {	left: -200px; -ms-transform: rotate(-270deg);	}
	75% {	left: 54px; -ms-transform: rotate(50deg);	}
	85% {	left: 54px; -ms-transform: rotate(50deg);	}
	100% {	left: 0; -ms-transform: rotate(0deg);	}
}
@-o-keyframes roll-l {
	0% {	left: -200px; -o-transform: rotate(-270deg);	}
	75% {	left: 54px; -o-transform: rotate(50deg);	}
	85% {	left: 54px; -o-transform: rotate(50deg);	}
	100% {	left: 0; -o-transform: rotate(0deg);	}
}
@keyframes roll-l {
	0% {	left: -200px; transform: rotate(-270deg);	}
	75% {	left: 54px; transform: rotate(50deg);	}
	85% {	left: 54px; transform: rotate(50deg);	}
	100% {	left: 0; transform: rotate(0deg);	}
}
@media only screen and (max-width: 736px) {
	#contentArea .anime-roll.anime-roll-l.animate img {
		-webkit-animation: roll-l-sp 0.8s ease-out 0s 1 normal forwards;
		-moz-animation: roll-l-sp 0.8s ease-out 0s 1 normal forwards;
		-ms-animation: roll-l-sp 0.8s ease-out 0s 1 normal forwards;
		-o-animation: roll-l-sp 0.8s ease-out 0s 1 normal forwards;
		animation: roll-l-sp 0.8s ease-out 0s 1 normal forwards;
	}
}
@-webkit-keyframes roll-l-sp {
	0% {	left: -100px; -webkit-transform: rotate(-270deg);	}
	75% {	left: 27px; -webkit-transform: rotate(50deg);	}
	85% {	left: 27px; -webkit-transform: rotate(50deg);	}
	100% {	left: 0; -webkit-transform: rotate(0deg);	}
}
@-moz-keyframes roll-l-sp {
	0% {	left: -100px; -moz-transform: rotate(-270deg);	}
	75% {	left: 27px; -moz-transform: rotate(50deg);	}
	85% {	left: 27px; -moz-transform: rotate(50deg);	}
	100% {	left: 0; -moz-transform: rotate(0deg);	}
}
@-ms-keyframes roll-l-sp {
	0% {	left: -100px; -ms-transform: rotate(-270deg);	}
	75% {	left: 27px; -ms-transform: rotate(50deg);	}
	85% {	left: 27px; -ms-transform: rotate(50deg);	}
	100% {	left: 0; -ms-transform: rotate(0deg);	}
}
@-o-keyframes roll-l-sp {
	0% {	left: -100px; -o-transform: rotate(-270deg);	}
	75% {	left: 27px; -o-transform: rotate(50deg);	}
	85% {	left: 27px; -o-transform: rotate(50deg);	}
	100% {	left: 0; -o-transform: rotate(0deg);	}
}
@keyframes roll-l-sp {
	0% {	left: -100px; transform: rotate(-270deg);	}
	75% {	left: 27px; transform: rotate(50deg);	}
	85% {	left: 27px; transform: rotate(50deg);	}
	100% {	left: 0; transform: rotate(0deg);	}
}

/* 写真ゆらゆら */
#contentArea .anime-photoswing {
	opacity: 0;
	transform-origin: 50% 0;
}

#contentArea .anime-photoswing.animate {
	opacity: 1;
}

/* 番号ポップ出現 */
#contentArea .anime-numpop {
	opacity: 0;
	transform: scale(0);
}

#contentArea .anime-numpop.animate {
	opacity: 1;
	transform: scale(1);
}

/* アイコンポップ表示
#contentArea .anime-numpop {
	-webkit-animation: ballpop 0.8s ease-out 0s 1 normal forwards;
	-moz-animation: ballpop 0.8s ease-out 0s 1 normal forwards;
	-ms-animation: ballpop 0.8s ease-out 0s 1 normal forwards;
	-o-animation: ballpop 0.8s ease-out 0s 1 normal forwards;
	animation: ballpop 0.8s ease-out 0s 1 normal forwards;
	opacity: 0;
}
@-webkit-keyframes numpop {
	0% {	transform: scale(0) rotate(0deg);	}
	40% {	transform: scale(0.1) rotate(-20deg);	}
	75% {	transform: scale(1.2) rotate(-8deg); opacity: 1;}
	100% { transform: scale(1) rotate(0deg); opacity: 1;}
}
@-moz-keyframes numpop {
	0% {	transform: scale(0) rotate(0deg);	}
	40% {	transform: scale(0.1) rotate(-20deg);	}
	75% {	transform: scale(1.2) rotate(-8deg); opacity: 1;}
	100% { transform: scale(1) rotate(0deg); opacity: 1;}
}
@-o-keyframes numpop {
	0% {	transform: scale(0) rotate(0deg);	}
	40% {	transform: scale(0.1) rotate(-20deg);	}
	75% {	transform: scale(1.2) rotate(-8deg); opacity: 1;}
	100% { transform: scale(1) rotate(0deg); opacity: 1;}
}
@keyframes numpop {
	0% {	transform: scale(0) rotate(0deg);	}
	40% {	transform: scale(0.1) rotate(-20deg);	}
	75% {	transform: scale(1.2) rotate(-8deg); opacity: 1;}
	100% { transform: scale(1) rotate(0deg); opacity: 1;}
}
*/

/* modal maginific-popup
----------------------------------- */
.mfp-bg {
	background-color: inherit;
}
.mfp-container {
	min-width: 1000px;
	padding: 0;
}
.mfp-content {
	background-color: rgba(255, 255, 255, 0.95);
}
.box-craft-list .mfp-close {
	top: 40px;
	right: 40px;
	width: 40px;
	height: 40px;
	background-image: url(/rwd/fun/make/special/img/btn_close.png);
	background-size: 40px 40px;
	font-size: 0;
	opacity: 1;
}
@media only screen and (max-width: 736px) {
	.mfp-container {
		min-width: 0;
	}
	.box-craft-list .mfp-close {
		top: 20px;
		right: 20px;
		width: 20px;
		height: 20px;
		background-size: 20px 20px;
	}
}

/* modal slick-slider
----------------------------------- */
.box-craft-list .panel-layout .panel-list .slick-arrow {
	position: absolute;
	top: 50%;
	display: block;
	width: 77px;
	height: 77px;
	text-indent: -10000000px;
	margin: -38.5px 0 0 0;
	padding: 0;
	border: 0;
	background-color: rgba(0, 0, 0, 0);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 77px 77px;
	cursor: pointer;
	z-index: 7;
}
.box-craft-list .panel-layout .panel-list .slick-arrow.slick-prev {
	left: 50%;
	margin-left: -306px;
	background-image: url(/rwd/fun/make/special/img/btn_prev_1.gif);
}
.box-craft-list .panel-layout .panel-list .slick-arrow.slick-prev:hover {
	background-image: url(/rwd/fun/make/special/img/btn_prev_2.gif);
}
.box-craft-list .panel-layout .panel-list .slick-arrow.slick-next {
	right: 50%;
	margin-right: -306px;
	background-image: url(/rwd/fun/make/special/img/btn_next_1.gif);
}
.box-craft-list .panel-layout .panel-list .slick-arrow.slick-next:hover {
	background-image: url(/rwd/fun/make/special/img/btn_next_2.gif);
}
.box-craft-list .panel-layout .panel-list .slick-arrow:focus {
	outline: none;
}
.box-craft-list .panel-layout .panel-list .slick-arrow:focus {
	outline: none;
}
@media only screen and (max-width: 736px) {
	.box-craft-list .panel-layout .panel-list .slick-arrow {
		width: 40px;
		height: 40px;
		margin: -20px 0 0 0;
		background-size: 40px 40px;
	}
	.box-craft-list .panel-layout .panel-list .slick-arrow.slick-prev {
		margin-left: -153px;
	}
	.box-craft-list .panel-layout .panel-list .slick-arrow.slick-prev:hover {
		background-image: url(/rwd/fun/make/special/img/btn_prev_1.gif);
	}
	.box-craft-list .panel-layout .panel-list .slick-arrow.slick-next {
		margin-right: -153px;
	}
	.box-craft-list .panel-layout .panel-list .slick-arrow.slick-next:hover {
		background-image: url(/rwd/fun/make/special/img/btn_next_1.gif);
	}
}



/* ------------------------------------
  * layout
* ------------------------------------ */
/* contentHead */
@media only screen and (max-width: 736px) {
	#content {
		overflow: hidden;
	}
	#contentHead .contentHeadInner:before {
		content: "";
		position: absolute;
		right: -20px;
		bottom: -3px;
		display: block;
		width: 130px;
		height: 60px;
		background-image: url("/rwd/fun/make/common/img/sp/btn_special_2.png");
		background-repeat: no-repeat;
		background-position: 0 0;
		background-size: 130px auto;
	}
}

/*contentArea */
/* wrp-share
----------------------------------- */
/* page top share */
#contentArea .wrp-share {
	position: absolute;
	top: 0;
	left: 50%;
	width: 940px;
	padding: 17px 0 0 0;
	-ms-transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: 2;
}
#contentArea .wrp-share ul {
	float: right;
	padding: 7px 18px 7px 0;
	background: #fff;
	border-radius: 20px;
}
#contentArea .wrp-share li {
	float: left;
	padding-left: 18px;
}
#contentArea .wrp-share li img {
	width: 27px;
	height: auto;
}
#contentArea .wrp-share li.facebook img {
	width: 26px;
}
#contentArea .wrp-share .line {
	display: none;
}
@media only screen and (max-width: 736px) {
	#contentArea .wrp-share {
		position: relative;
		width: 74.21%;
		left: 0;
		margin: 0 auto;
		padding: 10px 0 6px;
		-ms-transform: none;
		-webkit-transform: none;
		transform: none;
	}
	#contentArea .wrp-share ul {
		float: none;
		padding: 7px 0;
		text-align: center;
	}
	#contentArea .wrp-share li {
		float: none;
		display: inline-block;
		padding: 0 12px;
	}
	#contentArea .wrp-share .line {
		display: inline-block;
	}
}

/* wrp-pagetop
----------------------------------- */
#contentArea .wrp-pagetop {
	margin-bottom: 15px;
}
@media only screen and (max-width: 736px) {
	#contentArea .wrp-pagetop {
		margin-bottom: 0;
		padding-bottom: 40px;
	}
}

/* mainvisual */
#contentArea .mainvisual {
	position: relative;
	padding: 110px 0 43px;
	text-align: center;
}
#contentArea .mainvisual:before {
	content: '';
	display: block;
	position: absolute;
	top: 67px;
	left: 13px;
	width: 220px;
	height: 182px;
	background-image: url(/rwd/fun/make/special/img/bg_mainvisual.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
}
#contentArea .mainvisual:after {
	content: '';
	position: absolute;
	top: 174px;
	right: 52px;
	display: block;
	width: 96px;
	height: 56px;
	background-image: url(/rwd/fun/make/special/img/txt_mainvisual.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 96px auto;
}
#contentArea .mainvisual .lead-main {
	width: 384px;
	margin: 0 auto;
	padding: 0 12px 0 0;
}
#contentArea .mainvisual .lead-main img {
	width: 384px;
}
#contentArea .mainvisual .ttl-main {
	width: 770px;
	margin: 24px auto 0;
}
#contentArea .mainvisual .craft-airplane {
	width: 180px;
	z-index: 1;
}
@media only screen and (max-width: 736px) {
	#contentArea .mainvisual {
		padding: 12px 0 17px;
	}
	#contentArea .mainvisual:before {
		top: 8.86%;
		left: -0.344%;
		width: 20.625%;
		height: 46.68%;
		background-size: 100% auto;
	}
	#contentArea .mainvisual:after {
		top: 21.19%;
		right: -3.45%;
		width: 13.45%;
		height: 18.64%;
		margin: 12px 0 0;
		background-size: 100% auto;
	}
	#contentArea .mainvisual .lead-main {
		width: 62.41%;
	}
	#contentArea .mainvisual .lead-main img {
		width: auto;
	}
	#contentArea .mainvisual .ttl-main {
		width: 100%;
		margin: 5px auto 0;
	}
	#contentArea .mainvisual .craft-airplane {
		width: 20%;
	}
}

/* page-nav */
#contentArea .page-nav {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin-top: -57px;
}

#contentArea .page-nav > li {
	box-sizing: border-box;
	position: relative;
	overflow: visible;
	width: 440px;
	height: 440px;
	margin: 57px 0 0;
	border-radius: 16px;
	background-repeat: repeat;
	background-position: 0 0;
	background-size: 64px auto;
}

#contentArea .page-nav > li > a {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 16px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 100% auto;
	color: inherit;
	font-weight: bold;
	text-align: center;
}
#contentArea .page-nav > li > a:hover {
	text-decoration: none;
}
#contentArea .page-nav > li > a:before {
	position: absolute;
	content: '';
	display: block;
	background-repeat: no-repeat;
	background-position: 0 0;
}
#contentArea .page-nav > li > a:after {
	position: absolute;
	content: '';
	display: block;
	background-repeat: no-repeat;
	background-position: 0 0;
}

/* NEWマーク */
#contentArea .page-nav > li .deco-new-balloon {
	position: absolute;
	top: -32px;
	left: -32px;
	z-index: 8;
}

@media screen and (max-width: 736px) {
	#contentArea .page-nav > li .deco-new-balloon {
		top: -8px;
		left: -12px;
		width: 26%;
	}
}

/* 風に揺れる */
#contentArea .page-nav > li.sp-wind .deco-new-balloon {
	top: 61px;
	left: 386px;
	width: 80px;
}
#contentArea .page-nav > li.sp-wind > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_wind.png);
	background-position: left bottom;
}
#contentArea .page-nav > li.sp-wind .craft-stationery {
	top: 175px;
	left: 23px;
	width: 417px;
}


/* 錯視 */
#contentArea .page-nav > li.sp-optical-illusion .deco-new-balloon {
	top: 61px;
	left: 386px;
	width: 80px;
}
#contentArea .page-nav > li.sp-optical-illusion .caption-nav {
	width: 266px;
}
#contentArea .page-nav > li.sp-optical-illusion .caption-nav .txt{
	background-image: url(/rwd/fun/make/special/img/bg_nav_caption_white_square.png);
	background-size: 266px auto;
}
#contentArea .page-nav > li.sp-optical-illusion > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_optical-illusion.png);
	background-position: left bottom;
}
#contentArea .page-nav > li.sp-optical-illusion .craft-stationery {
	top: 175px;
  left: 23px;
  width: 417px;
}
#contentArea .page-nav > li.sp-optical-illusion .ttl-nav{
	background-image: url(/rwd/fun/make/special/img/craft_optical-illusion_title_bg.png);
  background-size: 330px auto;
  background-position: center top;
  background-repeat: no-repeat;
  line-height: 98px;
  padding-top: 12px;
}
#contentArea .page-nav > li.sp-optical-illusion .ttl-nav img {
	max-height: 69px;
	width: auto;
	transform: rotate(0deg) !important;
}

/* 文房具 */
#contentArea .page-nav > li.sp-stationery .deco-new-balloon {
	top: 61px;
	left: 386px;
	width: 80px;
}
#contentArea .page-nav > li.sp-stationery .caption-nav {
  padding: 41px 0 6px;
}
#contentArea .page-nav > li.sp-stationery .ttl-nav{
	font-feature-settings:"palt" 1;/*文字詰め*/
}
#contentArea .page-nav > li.sp-stationery .ttl-nav span.em{
	line-height: 1.0;
}
#contentArea .page-nav > li.sp-stationery .craft-stationery {
	top: 188px;
	left: 12px;
	width: 418px;
}

#contentArea .page-nav > li.sp-stationery > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_stationery.png);
	background-position: left bottom;
}

/* 夏祭り */
#contentArea .page-nav > li.sp-summer-festival .ttl-nav {
	color: #faed0e;
	text-shadow: 2px 2px 0 #000,
	-2px 2px 0 #000,
	2px -2px 0 #000,
	-2px -2px 0 #000;
}
#contentArea .page-nav > li.sp-summer-festival .caption-nav{
	width: 300px;
}
#contentArea .page-nav > li.sp-summer-festival .caption-nav  {
	color: #fff;
}
#contentArea .page-nav > li.sp-summer-festival .caption-nav .text-yellow {
	color: #faed0e;
}
#contentArea .page-nav > li.sp-summer-festival .caption-nav .txt{
	background-image: url(/rwd/fun/make/special/img/bg_nav_caption_blue.png);
	background-size: 300px auto;
}
#contentArea .page-nav > li.sp-summer-festival .deco-new-balloon {
	top: 26px;
	left: 360px;
	width: 80px;
}
#contentArea .page-nav > li.sp-summer-festival .craft-summer-festival {
	top: 133px;
	left: 49px;
	width: 362px;
}
#contentArea .page-nav > li.sp-summer-festival > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_summer-festival.png);
	background-position: left bottom;
}

/* 貯金箱 */
#contentArea .page-nav > li.sp-chokinbako .ttl-nav span{
	margin: 0 -15px;
}
#contentArea .page-nav > li.sp-chokinbako .caption-nav{
	width: 300px;
}
#contentArea .page-nav > li.sp-chokinbako .caption-nav .txt{
	background-image: url(/rwd/fun/make/special/img/bg_nav_caption_white.png);
	background-size: 300px auto;
}
#contentArea .page-nav > li.sp-chokinbako .deco-new-balloon {
	top: 26px;
	left: 360px;
	width: 80px;
}
#contentArea .page-nav > li.sp-chokinbako .craft-chokinbako {
	top: 157px;
	left: 14px;
	width: 406px;
}
#contentArea .page-nav > li.sp-chokinbako > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_chokinbako.png);
	background-position: left top;
	width: calc(100% + 15px);
	left: -10px;
}

/* 「動物」をつくろう！ */
#contentArea .page-nav > li.sp-large-design .craft-large-design {
	top: 140px;
	left: -31px;
}
#contentArea .page-nav > li.sp-large-design > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_large-design.png);
	background-position: left bottom;
}
#contentArea .page-nav > li .craft-large-design-animal01 {
	top: 137px;
	right: -31px;
	width: 495px;
}
#contentArea .page-nav > li .craft-large-design-animal02 {
	top: 163px;
	right: -31px;
	width: 105px;
}

/* 「デザイン工作」 */
#contentArea .page-nav > li.sp-large-design_02 .craft-large-design_02{
	top: 152px;
	left: -20px;
}
#contentArea .page-nav > li.sp-large-design_02 > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_large-design_02.png);
	background-position: left bottom;
}

#contentArea .page-nav > li .craft-large-design-craft01 {
	top: 161px;
	right: -37px;
	width: 488px;
}
#contentArea .page-nav > li .craft-large-design-craft02 {
	top: 315px;
	right: -24px;
	width: 181px;
}

/* ゴムで動く工作特集 */
#contentArea .page-nav > li.sp-rubber .craft-rubber01 {
	top: 17px;
	left: -20px;
}
#contentArea .page-nav > li.sp-rubber .craft-rubber02 {
	top: 205px;
	left: 40px;
	width: 422px;
}
#contentArea .page-nav > li.sp-rubber > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_rubber.png);
	background-position: left bottom;
}
/* 『ボールコースター』を作ろう */
#contentArea .page-nav > li.sp-ballcoaster .craft-ballcoaster {
	top: 132px;
	left: 49px;
}
#contentArea .page-nav > li.sp-ballcoaster > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_ballcoaster.png);
	background-position: left bottom;
}
#contentArea .page-nav > li.sp-ballcoaster > a:before {
	top: 123px;
	left: -35px;
	width: 103px;
	height: 135px;
	background-image: url(/rwd/fun/make/special/img/bg_nav_ballcoaster_parts.png);
	background-size: 103px auto;
}
#contentArea .page-nav > li.sp-ballcoaster .ttl-nav {
	letter-spacing: -0.1em;
}

/* 『プロジェクター』と『ランタン』を作ろう */
#contentArea .page-nav > li.sp-projector .cfaft-candle {
	top: 172px;
	left: 0;
}
#contentArea .page-nav > li.sp-projector .craft-projector {
	top: 280px;
	left: 153px;;
}
#contentArea .page-nav > li.sp-projector > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_projector.png);
}
#contentArea .page-nav > li.sp-projector .ttl-nav {
	letter-spacing: -0.1em;
}

/* 自宅で『エコ菜園』をはじめよう！ */
#contentArea .page-nav > li.sp-eco .craft-eco {
	top: 187px;
	left: -45px;
}
#contentArea .page-nav > li.sp-eco > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_eco.png);
}
#contentArea .page-nav > li.sp-eco > a:after {
	top: 111px;
	right: -25px;
	width: 276px;
	height: 212px;
	background-image: url(/rwd/fun/make/special/img/bg_nav_eco_parts.png);
	background-size: 276px auto;
}
#contentArea .page-nav > li.sp-eco .ttl-nav {
	position: relative;
	letter-spacing: -0.1em;
	z-index: 6;
}

/* ハンドスピナー */
#contentArea .page-nav > li.sp-handspinner {
	background-image: url(/rwd/fun/make/special/img/bg_pattern_blue.png);
	z-index: 1;
}

#contentArea .page-nav > li.sp-handspinner > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_toy.png);
	background-position: 0 100%;
}

#contentArea .page-nav > li .craft-spinner {
	bottom: -54px;
	right: 50px;
	width: 339px;
}

/* 乗りものの街を作ろう */
#contentArea .page-nav > li.sp-vehicle {
	background-image: url(/rwd/fun/make/special/img/bg_pattern_pink.png);
}

#contentArea .page-nav > li.sp-vehicle > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_car.png);
}

#contentArea .page-nav > li .craft-car {
	top: 175px;
	right: -37px;
	width: 343px;
}

/* 水遊び */
/*#contentArea .page-nav > li.sp-water .deco-new-balloon {
	top: 72px;
	left: 265px;
}
#contentArea .page-nav > li.sp-water {
	width: 100%;
	height: 340px;
	background-image: url(/rwd/fun/make/special/img/bg_pattern_blue.png);
}
#contentArea .page-nav > li.sp-water .caption-nav {
	position: relative;
	z-index: 5;
	padding-top: 126px;
}
#contentArea .page-nav > li.sp-water > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_water.png);
}
#contentArea .page-nav > li .craft-fish01 {
	top: -15px;
	left: 20px;
}
#contentArea .page-nav > li .craft-fish02 {
	top: -35px;
	left: 630px;
	width: 332px;
}
#contentArea .page-nav > li .craft-fish03 {
	top: 20px;
	left: 490px;
}
*/
#contentArea .page-nav > li.sp-water {
	background-image: url(/rwd/fun/make/special/img/bg_nav_water_sp.png);
}

#contentArea .page-nav > li.sp-water > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_water.png);
}

#contentArea .page-nav > li .craft-large-design-water01 {
	top: 108px;
	left: 141px;
	width: 332px;
}
#contentArea .page-nav > li .craft-large-design-water02 {
	top: 351px;
	right: 241px;
	width: 136px;
}

/* モビールを作ろう */
#contentArea .page-nav > li.sp-mobile {
	background-image: url(/rwd/fun/make/special/img/bg_pattern_yellow.png);
}
#contentArea .page-nav > li.sp-mobile > a {
	background-image: url(/rwd/fun/make/special//img/bg_nav_mobile.png);
}
#contentArea .page-nav > li .craft-mobile {
	top: 147px;
	right: -39px;
	width: 288px;
}

/* 牛乳パックの実力 */
#contentArea .page-nav > li.sp-ability {
	background-image: url(/rwd/fun/make/special/img/bg_pattern_green.png);
}
#contentArea .page-nav > li.sp-ability > a {
	background-image: url(/rwd/fun/make/special/img/bg_nav_outdoor.png);
}
#contentArea .page-nav > li.sp-ability .caption-nav {
	width: 320px;
}
#contentArea .page-nav > li.sp-ability .caption-nav .txt{
	background-image: url(/rwd/fun/make/special/img/bg_nav_caption_l.png);
	background-size: 100% auto;
}
#contentArea .page-nav > li .craft-outdoor {
	top: 199px;
	right: 67px;
	width: 283px;
}

/* amazing!!
#contentArea .page-nav > li.sp-ability > a:after {
	top: 76px;
	right: 7px;
	width: 108px;
	height: 53px;
	background-image: url(/rwd/fun/make/special/img/balloon_nav_amazing.png);
	background-size: 108px auto;
}
 */
/* NewItem
#contentArea .page-nav > li.sp-mobile > a:after {
	top: 38px;
	right: 2px;
	width: 107px;
	height: 54px;
	background-image: url(/rwd/fun/make/special/img/balloon_nav_newitem.png);
	background-size: 107px auto;
}
*/
/* great
#contentArea .page-nav > li > a:after {
	width: 78px;
	height: 62px;
	background-image: url(/rwd/fun/make/special/img/balloon_nav_great.png);
	background-size: 78px auto;
	top: 75px;
	right: 51px;
}
*/
/* 動画あり
#contentArea .page-nav > li.sp-handspinner > a:after {
	top: 34px;
	right: 13px;
	width: 86px;
	height: 64px;
	background-image: url(/rwd/fun/make/special/img/balloon_nav_mv.png);
	background-size: 86px auto;
}
 */

#contentArea .page-nav > li .caption-nav {
	position: relative;
	width: 204px;
	height: 30px;
	margin: 0 auto;
	padding: 48px 0 10px;
	z-index: 1;
}
#contentArea .page-nav > li .caption-nav .txt {
	display: block;
	width: 100%;
	height: 30px;
	background-image: url(/rwd/fun/make/special/img/bg_nav_caption.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 204px auto;
	font-size: 18px;
	line-height: 30px;
	text-align: center;
}

#contentArea .page-nav > li.sp-handspinner .caption-nav {
	width: 296px;
	margin: 0 auto;
}
#contentArea .page-nav > li.sp-handspinner .caption-nav .txt {
	padding: 0 3px;
	background-image: url(/rwd/fun/make/special/img/bg_nav_caption_l.png);
	background-size: 296px auto;
}

#contentArea .page-nav > li.sp-eco .caption-nav {
	width: 290px;
	margin: 0 auto;
}
#contentArea .page-nav > li.sp-eco .caption-nav .txt {
	padding: 0 3px;
	background-image: url(/rwd/fun/make/special/img/bg_nav_caption_l.png);
	background-size: 296px auto;
}

/* #contentArea .page-nav > li.sp-handspinner .ttl-nav:first-line {
	letter-spacing: -0.2em;
} */


#contentArea .page-nav > li .ttl-nav {
	position: relative;
	font-size: 28px;
	line-height: 1.2;
	text-shadow: 3px 3px 4px rgba(256, 256, 256, 0.2), -3px 3px 4px rgba(256, 256, 256, 0.2), 3px -3px 4px rgba(256, 256, 256, 0.2), -3px -3px 4px rgba(256, 256, 256, 0.2);
	z-index: 1;
}
#contentArea .page-nav > li .ttl-nav .em {
	font-size: 44px;
}
#contentArea .page-nav > li .ttl-nav .small {
	font-size: 22px;
}
#contentArea .page-nav > li .pic-nav {
	position: absolute;
	z-index: 2;
}

@media screen and (max-width: 736px) {
	#contentArea .page-nav {
		width: 100%;
		margin-top: -10px;
	}
	#contentArea .page-nav > li {
		width: 48.3%;
		height: auto;
		margin-top: 10px;
		border-radius: 8px;
		background-size: 32px auto;
	}
	#contentArea .page-nav > li > a {
		overflow: hidden;
		height: 0;
		padding: 53.5% 0 0;
		border-radius: 8px;
	}
	#contentArea .page-nav > li .caption-nav {
		position: absolute;
		top: 0;
		left: 50%;
		width: 105px;
		height: 16px;
		margin: 0 0 0 -52.5px;
		padding: 13px 0 5px;
	}
	#contentArea .page-nav > li .caption-nav .txt {
		width: 105px;
		height: 16px;
		background-size: 105px auto;
		font-size: 6px;
		line-height: 16px;
	}
	#contentArea .page-nav > li .ttl-nav {
		position: absolute;
		top: 30px;
		left: 0;
		width: 100%;
		font-size: 12px;
		line-height: 1.3;
		text-align: center;
		text-shadow: 3px 3px 4px rgba(256, 256, 256, 0.2), -3px 3px 4px rgba(256, 256, 256, 0.2), 3px -3px 4px rgba(256, 256, 256, 0.2), -3px -3px 4px rgba(256, 256, 256, 0.2);
	}
	#contentArea .page-nav > li .ttl-nav .em {
		font-size: 16px;
	}
	#contentArea .page-nav > li .ttl-nav .small {
		font-size: 10px;
	}
	#contentArea .page-nav > li .pic-nav {
		display: none;
	}

		/* 風に揺れる */
	#contentArea .page-nav > li.sp-wind > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_wind_sp.png);
	}
	#contentArea .page-nav > li.sp-wind .deco-new-balloon {
		top: 4px;
		width: 40px;
		left: initial;
		right: 0px;
	}

	/* 錯視 */
	#contentArea .page-nav > li.sp-optical-illusion > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_optical-illusion_sp.png);
	}
	#contentArea .page-nav > li.sp-optical-illusion .deco-new-balloon {
		top: 4px;
    width: 40px;
    left: initial;
    right: 0px;
	}
	#contentArea .page-nav > li.sp-optical-illusion .caption-nav {
		width: 105px !important;
	}
	#contentArea .page-nav > li.sp-optical-illusion .caption-nav .txt {
		background-size: 105px auto;
	}
	#contentArea .page-nav > li.sp-optical-illusion .ttl-nav img {
		max-height: 23px;
	}
	#contentArea .page-nav > li.sp-optical-illusion .ttl-nav {
		background-size: 120px auto;
		background-position: center center;
		line-height: 36px;
		padding-top: 10px;
	}



	/* 文房具 */
	#contentArea .page-nav > li.sp-stationery > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_stationery_sp.png);
	}
	#contentArea .page-nav > li.sp-stationery .deco-new-balloon {
	top: 4px;
	width: 40px;
	left: 176px;
	}
	#contentArea .page-nav > li.sp-stationery .caption-nav {
		position: absolute;
		top: 0;
		left: 50%;
		width: 125px;
		height: 16px;
		margin: 0 0 0 -62.5px;
		padding: 26px 0 5px;
	}
	#contentArea .page-nav > li.sp-stationery .caption-nav .txt {
		background-size: 125px auto;
	}
	#contentArea .page-nav > li.sp-stationery .ttl-nav {
		position: absolute;
		top: 45px;
		left: 0;
		width: 100%;
		font-size: 10px;
		line-height: 1.3;
		text-align: center;
		text-shadow: 3px 3px 4px rgba(256, 256, 256, 0.2), -3px 3px 4px rgba(256, 256, 256, 0.2), 3px -3px 4px rgba(256, 256, 256, 0.2), -3px -3px 4px rgba(256, 256, 256, 0.2);
	}
	/* 夏祭り */
	#contentArea .page-nav > li.sp-summer-festival > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_summer-festival_sp.png);
	}
	#contentArea .page-nav > li.sp-summer-festival .deco-new-balloon {
	top: 0;
	width: 40px;
	left: 135px;
	}
	#contentArea .page-nav > li.sp-summer-festival .caption-nav {
		position: absolute;
		top: 0;
		left: 50%;
		width: 165px;
		height: 16px;
		margin: 0 0 0 -82.5px;
		padding: 26px 0 5px;
	}
	#contentArea .page-nav > li.sp-summer-festival .caption-nav .txt {
		background-image: url(/rwd/fun/make/special/img/bg_nav_caption_blue.png);
		background-size: 165px auto;
	}
	#contentArea .page-nav > li.sp-summer-festival .ttl-nav {
		position: absolute;
		top: 45px;
		left: 0;
		width: 100%;
		font-size: 12px;
		line-height: 1.3;
		text-align: center;
		text-shadow: 1px 1px 0 #000,
			-1px 1px 0 #000,
			1px -1px 0 #000,
			-1px -1px 0 #000;
	}

	/* 貯金箱 */
	#contentArea .page-nav > li.sp-chokinbako > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_chokinbako_sp.png);
		width: 100%;
		left: 0;
	}
	#contentArea .page-nav > li.sp-chokinbako .deco-new-balloon {
	top: 0;
	width: 40px;
	left: 135px;
	}
	#contentArea .page-nav > li.sp-chokinbako .caption-nav {
		position: absolute;
		top: 0;
		left: 50%;
		width: 165px;
		height: 16px;
		margin: 0 0 0 -82.5px;
		padding: 26px 0 5px;
	}
	#contentArea .page-nav > li.sp-chokinbako .caption-nav .txt {
		background-image: url(/rwd/fun/make/special/img/bg_nav_caption_l.png);
		background-size: 165px auto;
	}
	#contentArea .page-nav > li.sp-chokinbako .ttl-nav {
		position: absolute;
		top: 45px;
		left: 0;
		width: 100%;
		font-size: 12px;
		line-height: 1.3;
		text-align: center;
		text-shadow: 3px 3px 4px rgba(256, 256, 256, 0.2), -3px 3px 4px rgba(256, 256, 256, 0.2), 3px -3px 4px rgba(256, 256, 256, 0.2), -3px -3px 4px rgba(256, 256, 256, 0.2);
	}
	#contentArea .page-nav > li.sp-chokinbako .ttl-nav span {
		margin: 0;
	}

	/* 動物 */
	#contentArea .page-nav > li.sp-large-design > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_large-design_sp.png);
	}
	#contentArea .page-nav > li.sp-large-design .deco-new-balloon {
	top: 7px;
	width: 40px;
	left: 135px;
	}
	#contentArea .page-nav > li.sp-large-design .caption-nav {
		position: absolute;
		top: 0;
		left: 50%;
		width: 125px;
		height: 16px;
		margin: 0 0 0 -62.5px;
		padding: 26px 0 5px;
	}
	#contentArea .page-nav > li.sp-large-design .caption-nav .txt {
		background-size: 125px auto;
	}
	#contentArea .page-nav > li.sp-large-design .ttl-nav {
		position: absolute;
		top: 45px;
		left: 0;
		width: 100%;
		font-size: 12px;
		line-height: 1.3;
		text-align: center;
		text-shadow: 3px 3px 4px rgba(256, 256, 256, 0.2), -3px 3px 4px rgba(256, 256, 256, 0.2), 3px -3px 4px rgba(256, 256, 256, 0.2), -3px -3px 4px rgba(256, 256, 256, 0.2);
	}
	/* デザイン工作 */
	#contentArea .page-nav > li.sp-large-design_02 > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_large-design_sp_02.png);
	}
	#contentArea .page-nav > li.sp-large-design_02 .deco-new-balloon {
	top: 7px;
	width: 40px;
	left: 135px;
	}
	#contentArea .page-nav > li.sp-large-design_02 .caption-nav {
		position: absolute;
		top: 0px;
		left: 50%;
		width: 115px;
		height: 16px;
		margin: 0 0 0 -52.5px;
		padding: 26px 0 5px;
	}
	#contentArea .page-nav > li.sp-large-design_02 .ttl-nav {
		position: absolute;
		top: 45px;
		left: 0;
		width: 100%;
		font-size: 12px;
		line-height: 1.3;
		text-align: center;
		text-shadow: 3px 3px 4px rgba(256, 256, 256, 0.2), -3px 3px 4px rgba(256, 256, 256, 0.2), 3px -3px 4px rgba(256, 256, 256, 0.2), -3px -3px 4px rgba(256, 256, 256, 0.2);
	}
	/* ゴム */
	#contentArea .page-nav > li.sp-rubber > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_rubber_sp.png);
	}
	/* ボールコースター */
	#contentArea .page-nav > li.sp-ballcoaster > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_ballcoaster_sp.png);
	}
	#contentArea .page-nav > li.sp-ballcoaster > a:before {
		display: none;
	}
	#contentArea .page-nav > li.sp-ballcoaster .ttl-nav .em {
		letter-spacing: -0.15em;
	}
	/* プロジェクター */
	#contentArea .page-nav > li.sp-projector > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_projector_sp.png);
	}
	#contentArea .page-nav > li.sp-projector > a:before {
		display: none;
	}
	/* エコ菜園 */
	#contentArea .page-nav > li.sp-eco > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_eco_sp.png);
	}
	#contentArea .page-nav > li.sp-eco > a:before,
	#contentArea .page-nav > li.sp-eco > a:after {
		display: none;
	}
	#contentArea .page-nav > li.sp-eco .ttl-nav {
		position: absolute;
	}
	#contentArea .page-nav > li.sp-eco .caption-nav {
		width: 140px;
		margin: 0 0 0 -70px;
	}
	#contentArea .page-nav > li.sp-eco .caption-nav .txt {
		box-sizing: border-box;
		width: 100% !important;
		max-width: 280px;
		height: auto !important;
		min-height: 16px;
		padding-right: 25px !important;
		background-image: url(/rwd/fun/make/special/img/bg_nav_caption.png) !important;
		background-repeat: no-repeat;
		background-position: 35% 0;
		background-size: 140px auto !important;
	}
	#contentArea .page-nav > li.sp-eco .ttl-nav .em {
		letter-spacing: -0.15em;
	}
	/* モービル */
	#contentArea .page-nav > li.sp-mobile > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_mobile_sp.png);
	}
	#contentArea .page-nav > li.sp-mobile > a:before {
		top: 45.33%;
		left: -13.33%;
		width: 43.57%;
		height: 44%;
		background-size: 100% auto;
	}
	#contentArea .page-nav > li.sp-mobile > a:after {
		top: 17px;
		right: 50%;
		width: 25px;
		height: 20px;
		margin: 0 -58px 0 0;
		background-size: 25px auto;
	}
	#contentArea .page-nav > li.sp-mobile > a:after {/* NewItem */
		top: 17px;
		right: 50%;
		width: 25px;
		height: 20px;
		margin: 0 -58px 0 0;
		background-size: 25px auto;
	}
	/* 水遊び */
	/*#contentArea .page-nav > li.sp-water .deco-new-balloon {
		top: 10px;
		left: 26.13%;
		width: 10%;
	}
	#contentArea .page-nav > li.sp-water .caption-nav {
		position: absolute;
		padding-top: 22px;
	}
	#contentArea .page-nav > li.sp-water .ttl-nav {
		top: 40px;
	}
	#contentArea .page-nav > li.sp-water {
		height: auto;
	}
	#contentArea .page-nav > li.sp-water > a {
		padding-top: 25.862%;
		background-image: url(/rwd/fun/make/special/img/bg_nav_water_sp.png);
	}
	#contentArea .page-nav > li.sp-water > a:before {
		top: 45.33%;
		left: -13.33%;
		width: 43.57%;
		height: 44%;
		background-size: 100% auto;
	}
	#contentArea .page-nav > li.sp-water > a:after {
		top: 17px;
		right: 50%;
		width: 25px;
		height: 20px;
		margin: 0 -58px 0 0;
		background-size: 25px auto;
	}*/
	#contentArea .page-nav > li.sp-water > a {
		/* padding-top: 25.862%; */
		background-image: url(/rwd/fun/make/special/img/bg_nav_water_sp.png);
	}

	/* 乗り物 */
	#contentArea .page-nav > li.sp-vehicle > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_car_sp.png);
	}
	#contentArea .page-nav > li.sp-vehicle > a:before {
		top: -16%;
		right: -13.21%;
		width: 55.71%;
		height: 104%;
		background-size: 100% auto;
	}
	#contentArea .page-nav > li.sp-vehicle > a:after {
		top: 21px;
		right: 50%;
		width: 23px;
		height: 13.5px;
		margin: 0 -68px 0 0;
		background-size: 23px auto;
	}
	#contentArea .page-nav > li > a:after {
		z-index: 1;
	}
	/* ハンドスピナー */
	#contentArea .page-nav > li.sp-handspinner {
		border-width: 2px;
	}
	#contentArea .page-nav > li.sp-handspinner .deco-new-balloon {
		top: -17px !important;
		left: -14px !important;
		width: 50px;
	}
	#contentArea .page-nav > li.sp-handspinner .deco-new-balloon img {width: 100%;}
	#contentArea .page-nav > li.sp-handspinner > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_toy_sp.png);
		background-size: 25% auto;
		background-position: 94% 93%;
	}
	#contentArea .page-nav > li.sp-handspinner > a:before {
		top: -38.67%;
		left: -35.71%;
		width: 71.42%;
		height: 133.33%;
		background-size: 100% auto;
	}
	#contentArea .page-nav > li.sp-handspinner > a:after {
		width: 33px;
		height: 75px;
		margin: 0 0 0;
		background-size: 33px auto;
		top: 16px;
		right: 10px;
	}
	#contentArea .page-nav > li.sp-handspinner .caption-nav .txt {
		box-sizing: border-box;
		width: 100% !important;
		max-width: 280px;
		height: auto !important;
		min-height: 16px;
		padding-right: 25px !important;
		background-image: url(/rwd/fun/make/special/img/bg_nav_caption.png) !important;
		background-repeat: no-repeat;
		background-position: 35% 0;
		background-size: 140px auto !important;
	}
	#contentArea .page-nav > li.sp-handspinner .ttl-nav .em {
		letter-spacing: -0.1em;
	}
	#contentArea .page-nav > li.sp-handspinner .caption-nav {
		left: 5px;
		width: 100%;
		margin: 0;
	}
	/* 牛乳パックの実力 */
	#contentArea .page-nav > li.sp-ability > a {
		background-image: url(/rwd/fun/make/special/img/bg_nav_outdoor_sp.png);
	}
	#contentArea .page-nav > li.sp-ability > a:before {
		top: 0;
		right: -20%;
		width: 97.14%;
		height: 58.67%;
		background-size: 100% auto;
	}
	#contentArea .page-nav > li.sp-ability > a:after {
		top: 30px;
		right: 50%;
		width: 32px;
		height: 16px;
		margin: 0 -68px 0 0;
		background-size: 32px auto;
	}
	#contentArea .page-nav > li.sp-ability .caption-nav {
		width: 170px;
		margin: 0;
		left: 50%;
		transform: translateX(-50%);
	}
	#contentArea .page-nav > li.sp-ability .caption-nav .txt{
		background-image: url(/rwd/fun/make/special/img/bg_nav_caption_l.png);
		background-size: 100% auto;
		letter-spacing: -0.5px;
	}
}

@media screen and (max-width: 380px) {
	#contentArea .page-nav > li.sp-stationery .caption-nav {
		padding-top: 10px;
	}

	#contentArea .page-nav > li.sp-stationery .ttl-nav {
		top: 30px;
	}
}

/* fixed-page-nav */
@media only screen and (max-width: 736px) {
	#contentArea .fixed-page-nav {
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		position: fixed;
		top: 0;
		left: 0;
		display: table;
		width: 100%;
		padding: 0 2px;
		background-color: #fff;
		-webkit-transition: top 0.3s ease-out 0s;
		-moz-transition: top 0.3s ease-out 0s;
		-ms-transition: top 0.3s ease-out 0s;
		-o-transition: top 0.3s ease-out 0s;
		transition: top 0.3s ease-out 0s;
		z-index: 99;
	}
	#contentArea .fixed-page-nav.hdn {
		top: -44px;
	}
	#contentArea .fixed-page-nav > li {
		display: table-cell;
		width: 25%;
	}
	#contentArea .fixed-page-nav > li a {
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		display: table;
		width: 100%;
		padding: 4px 2px;
		color: inherit;
		font-size: 11px;
		font-weight: bold;
		text-align: center;
	}
	#contentArea .fixed-page-nav > li a > span {
		display: table-cell;
		height: 36px;
		border-radius: 4px;
		background-repeat: repeat;
		background-position: 0 0;
		background-size: 32px auto;
		vertical-align: middle;
	}
	#contentArea .fixed-page-nav > li:nth-of-type(1) a > span {
		background-image: url(/rwd/fun/make/special/img/bg_pattern_yellow.png);
	}
	#contentArea .fixed-page-nav > li:nth-of-type(2) a > span {
		background-image: url(/rwd/fun/make/special/img/bg_pattern_blue.png);
	}
	#contentArea .fixed-page-nav > li:nth-of-type(3) a > span {
		background-image: url(/rwd/fun/make/special/img/bg_pattern_pink.png);
	}
	#contentArea .fixed-page-nav > li:nth-of-type(4) a > span {
		background-image: url(/rwd/fun/make/special/img/bg_pattern_green.png);
	}
}

/* contents-special
----------------------------------- */
#contentArea .wrp-specialtop {
	width: 1140px;
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -570px;
	z-index: 3;
}

#contentArea .btn-specialtop {
	position: absolute;
	top: 23px;
	left: 91px;
	width: 150px;
}
#contentArea .btn-specialtop .craft-airplane {
	width: 94px;
	margin-top: 6px;
	margin-right: 41px;
}
/* 着陸時(下層用) */
#contentArea .btn-specialtop .anime-craft-fall.animate {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
	-webkit-transition-delay:  0.2s;
	transition-delay:  0.2s;
}
/* 離陸時(下層用) */
#contentArea .btn-specialtop .anime-craft-fall.departure {
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}


@media only screen and (max-width: 736px) {
	#contentArea .wrp-specialtop {
		width: 100%;
		height: 22.5%;
		top: 0;
		left: 0;
		z-index: 1;
		margin-left: 0;
	}

	/* 着陸時(下層用) */
	#contentArea .btn-specialtop {
		position: absolute;
		top: -64px;
		left: 75.62%;
		width: 77px;
		max-width: 105px;
	}
	#contentArea .btn-specialtop .craft-airplane {
		width: 65%;
		margin-top: 5px;
		margin-right: 20px;
	}
}

/* contents-special
----------------------------------- */
#contentArea .contents-special {
	position: relative;
	background-repeat: repeat;
	background-position: 0 0;
	background-size: 64px auto;
}
#contentArea .contents-special:before {
	content: '';
	position: absolute;
	display: block;
	background-repeat: no-repeat;
	background-position: 0 0;
}
#contentArea .contents-special:after {
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	display: block;
	width: 100%;
	background-repeat: repeat-x;
	background-position: 50% 0;
	-webkit-transform: translate(-50%, 0);
	-moz-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	-o-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
}
#contentArea .contents-special .contents-area-inner:before {
	content: '';
	position: absolute;
	top: -2px;
	left: 0;
	display: block;
	width: 38px;
	height: 2px;
}
#contentArea .contents-special .contents-area-inner:after {
	content: '';
	position: absolute;
	top: -14px;
	left: 0;
	display: block;
	width: 38px;
	height: 26px;
	background-image: url(/rwd/fun/make/special/img/icn_scissors.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 38px auto;
}

#contentArea .contents-special .contents-area-inner:after {
	display: none;
}

#contentArea .contents-special .contents-area-head {
	position: relative;
	z-index: 1;
}
#contentArea .contents-special .contents-area-craft {
	position: relative;
}
#contentArea .contents-special .contents-area-craft:before {
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	display: block;
	background-repeat: no-repeat;
	background-position: 0 0;
	-webkit-transform: translate(-50%, 0);
	-moz-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	-o-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
}
#contentArea .contents-special .contents-area-original {
	padding: 60px 0 80px;
}

@media only screen and (max-width: 736px) {
	#contentArea .contents-special {
		border-top: 2px dashed #161613;
		background-size: 32px auto;
	}

	#contentArea .contents-special {
		border-top: 0;
	}

	#contentArea .contents-special:after {
		background-repeat: no-repeat;
		background-position: 0 0;
		top: 0;


		left: 0;
		-webkit-transform: translate(0, 0);
		-moz-transform: translate(0, 0);
		-ms-transform: translate(0, 0);
		-o-transform: translate(0, 0);
		transform: translate(0, 0);
	}

	#contentArea .contents-special .contents-area-inner {
		padding: 0;
	}

	#contentArea .contents-special .contents-area-inner:before {
		width: 25px;
		height: 2px;
		left: 16px;
	}

	#contentArea .contents-special .contents-area-inner:after {
		width: 25px;
		height: 17px;
		background-size: 25px auto;
		top: -9px;
		left: 16px;
	}

	#contentArea .contents-special .contents-area-head {
		padding: 0 15px;
	}

	#contentArea .contents-special .contents-area-craft:before {
		background-repeat: no-repeat;
		background-position: 0 0;
		background-size: 100% auto;
		position: absolute;
		top: 0;
		left: 0;
		-webkit-transform: translate(0, 0);
		-moz-transform: translate(0, 0);
		-ms-transform: translate(0, 0);
		-o-transform: translate(0, 0);
		transform: translate(0, 0);
	}

	#contentArea .contents-special .contents-area-original {
		padding: 5px 0 50px;
	}
}

/* ttl-sub */
#contentArea .ttl-sub {
	width: 700px;
	margin: 0 auto;
}
@media only screen and (max-width: 736px) {
	#contentArea .ttl-sub {
		width: 100%;
	}
}

/* caption-sub */
#contentArea .caption-sub {
	width: 445px;
	height: 50px;
	padding: 68px 0 19px;
	margin: 0 auto;
	position: relative;
}
#contentArea .caption-sub .txt {
	display: block;
	width: 445px;
	height: 50px;
	font-size: 26px;
	font-weight: bold;
	text-align: center;
	line-height: 50px;
	background-image: url("/rwd/fun/make/special/img/bg_caption.png");
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: 445px 50px;
}
@media only screen and (max-width: 736px) {
	#contentArea .caption-sub {
		width: 218px;
		height: 22px;
		padding: 14px 0;
		margin: 0 auto;
	}
	#contentArea .caption-sub .txt {
		width: 218px;
		height: 22px;
		font-size: 12px;
		line-height: 22px;
		background-size: 218px 22px;
	}
}

/* balloon-sub */
#contentArea .balloon-sub {
	position: absolute;
	z-index: 4;
}

/* lead-sub */
#contentArea .lead-sub {
	font-size: 19px;
	text-align: center;
	line-height: 1.9;
	padding: 15px 0 10px;
}
@media only screen and (max-width: 736px) {
	#contentArea .lead-sub {
		font-size: 12px;
		line-height: 2;
		padding: 8px 20px 10px;
	}
}

/* note-sub */
#contentArea .note-sub {
	font-size: 14px;
	text-align: center;
	line-height: 2;
}
#contentArea .note-sub > span {
	display: inline-block;
	border-bottom: 1px solid #000;
}
@media only screen and (max-width: 736px) {
	#contentArea .note-sub {
		font-size: 10px;
		line-height: 2;
	}
}

/* deco-original */
#contentArea .contents-special .deco-original {
	width: 100%;
	margin: 0 auto;
	position: relative;
}
#contentArea .contents-special .deco-original .deco-original-balloon {
	display: block;
	width: 160px;
	overflow: visible;
	position: absolute;
	top: -26px;
	right: 127px;
}
@media only screen and (max-width: 736px) {
	#contentArea .contents-special .deco-original .deco-original-balloon {
		width: 80px;
		margin: 0 -170px 0 0;
		top: -13px;
		right: 50%;
	}
}

/* ttl-original */
#contentArea .contents-special .ttl-original {
	font-size: 38px;
	font-weight: bold;
	text-align: center;
	padding: 25px 0 15px;
}
#contentArea .contents-special .ttl-original .small {
	display: inline-block;
	font-size: 20px;
	vertical-align: middle;
	padding: 0 5px 0 0;
}
@media only screen and (max-width: 736px) {
	#contentArea .contents-special .ttl-original {
		font-size: 19px;
		padding: 6px 15px 10px;
	}
	#contentArea .contents-special .ttl-original .small {
		font-size: 12px;
		padding: 0 5px 0 0;
	}
}

/* caption-original */
#contentArea .contents-special .caption-original {
	font-size: 25px;
	font-weight: bold;
	text-align: center;
	padding: 60px 0 20px;
}
#contentArea .contents-special .caption-original .small {
	font-size: 18px;
}
#contentArea .contents-special .caption-original .caption-original-slash {
	display: inline-block;
	padding: 5px 15px;
	position: relative;
}
#contentArea .contents-special .caption-original .caption-original-slash:before {
	display: block;
	content: '';
	width: 32px;
	height: 45px;
	background-image: url(/rwd/fun/make/special/img/caption_slash_l.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 32px auto;
	position: absolute;
	bottom: 0;
	left: -32px;
}
#contentArea .contents-special .caption-original .caption-original-slash:after {
	display: block;
	content: '';
	width: 32px;
	height: 38px;
	background-image: url(/rwd/fun/make/special/img/caption_slash_r.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 32px auto;
	position: absolute;
	bottom: 0;
	right: -32px;
}
@media only screen and (max-width: 736px) {
	#contentArea .contents-special .caption-original {
		font-size: 13px;
		padding: 30px 15px 10px;
	}
	#contentArea .contents-special .caption-original .small {
		font-size: 10px;
	}
	#contentArea .contents-special .caption-original .caption-original-slash {
		padding: 3px 15px;
	}
	#contentArea .contents-special .caption-original .caption-original-slash:before {
		width: 16px;
		height: 22.5px;
		background-size: 16px auto;
		bottom: 0;
		left: -12px;
	}
	#contentArea .contents-special .caption-original .caption-original-slash:after {
		width: 16px;
		height: 19px;
		background-size: 16px auto;
		bottom: 0;
		right: -12px;
	}
}

/* lead-original */
#contentArea .contents-special .lead-original {
	font-size: 17px;
	text-align: center;
	line-height: 1.87;
	padding: 0 0 24px;
}
@media only screen and (max-width: 736px) {
	#contentArea .contents-special .lead-original {
		font-size: 12px;
		text-align: center;
		line-height: 1.8;
		padding: 0 15px 16px;
	}
}

/* pic-craft */
#contentArea .contents-special .pic-craft {
	position: absolute;
	z-index: 4;
}

/* btn-craft */
#contentArea .contents-special .btn-craft a {
	display: block;
}
#contentArea .contents-special .btn-craft a:before {
	display: block;
	content: '';
	width: 36px;
	height: 36px;
	background-image: url(/rwd/fun/make/special/img/btn_play.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 36px auto;
	position: absolute;
	top: 30%;
	left: 70%;
	z-index: 5;
}
@media only screen and (max-width: 736px) {
	#contentArea .contents-special .btn-craft a:before {
		width: 15px;
		height: 15px;
		background-size: 15px auto;
		top: 30%;
		left: 60%;
	}
}

/* note-small */
#contentArea .contents-special .note-small {
	font-size: 12px;
	display:table;
	float: right;
}
#contentArea .contents-special .note-small p {
	display:table-cell;
}
@media only screen and (max-width: 736px) {
	#contentArea .contents-special .note-small {
		font-size: 10px;
	}
}

/* btn-more */
#contentArea .contents-special .btn-more {
	width: 494px;
	margin: 0 auto;
	position: relative;

	z-index: 2;
}
@media only screen and (max-width: 736px) {
	#contentArea .contents-special .btn-more {
		position: absolute;
		bottom: 30px;
		left: 50%;
		width: 90.63%;
		-webkit-transform: translate(-50%, 0);
		-moz-transform: translate(-50%, 0);
		-ms-transform: translate(-50%, 0);
		-o-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
}

/* btn-pdf */
#contentArea .contents-special .btn-pdf {
	position: relative;	font-size: 0;
	margin: 0 -20px;
	text-align: center;
	z-index: 2;
}
#contentArea .contents-special .btn-pdf a {
	display: inline-block;
	width: 450px;
	margin: 15px 20px;
	padding: 25px 18px;
	border: 2px solid #000;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	color: inherit;
	font-size: 19px;
	font-weight: bold;
	text-align: center;
}
#contentArea .contents-special .btn-pdf a:hover {
	background-color: #fff;
}
#contentArea .contents-special .btn-pdf a > span {
	display: inline-block;
	width: 100%;
	height: 100%;
	background-image: url(/rwd/fun/make/special/img/icn_pdf_1.png);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 23px auto;
}
#contentArea .contents-special .btn-pdf a:hover > span {
	background-image: url(/rwd/fun/make/special/img/icn_pdf_2.png);
}
@media only screen and (max-width: 736px) {
	#contentArea .contents-special .btn-pdf {
		margin: 0;
		padding: 0 15px;
	}
	#contentArea .contents-special .btn-pdf a {
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		display: block;
		width: 290px;
		margin: 10px auto;
		padding: 14px 10px;
		border: 2px solid #000;
		font-size: 14px;
	}
	#contentArea .contents-special .btn-pdf a:hover {
		background-color: inherit;
	}
	#contentArea .contents-special .btn-pdf a > span {
		padding: 3px 0;
		background-image: url(/rwd/fun/make/special/img/icn_pdf_sp.png);
		background-size: 20px auto;
	}
	#contentArea .contents-special .btn-pdf a:hover > span {
		background-image: url(/rwd/fun/make/special/img/icn_pdf_sp.png);
	}
}

/* btn-blank */
#contentArea .contents-special .btn-blank {
  position: relative;
  font-size: 0;
  text-align: center;
  z-index: 2;
}

#contentArea .contents-special .btn-blank a {
	display: inline-block;
	width: 450px;
	margin: 15px 20px;
	padding: 25px 18px;
	border: 2px solid #000;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	color: inherit;
	font-size: 19px;
	font-weight: bold;
	text-align: center;
}

#contentArea .contents-special .btn-blank a > span {
  display: inline-block;
  width: 100%;
  height: 100%;
  padding-right: 30px;
  background: url(/rwd/fun/make/special/img/icn_blank_1.png) no-repeat right center;
  background-size: 26px auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  letter-spacing: -1px;
}

#contentArea .contents-special .btn-blank small {
  font-size: 12px;
  font-weight: normal;
  letter-spacing: 0;
}

#contentArea .contents-special .btn-blank a:hover {
	background-color: #fff;
	text-decoration: none;
}

#contentArea .contents-special .btn-blank a:hover > span {
  display: inline-block;
  width: 100%;
  height: 100%;
  background: url(/rwd/fun/make/special/img/icn_blank_2.png) no-repeat right center;
  background-size: 26px auto;
}

@media only screen and (max-width: 736px) {
  #contentArea .contents-special .btn-blank a {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	width: 290px;
	margin: 10px auto;
	padding: 14px 10px;
	border: 2px solid #000;
	font-size: 14px;
  }
  #contentArea .contents-special .btn-blank a > span {
    padding-right: 26px;
    background: url(/rwd/fun/make/special/img/icn_blank_sp.png) no-repeat right center;
    background-size: 21px auto;
  }
  #contentArea .contents-special .btn-blank small {
    font-size: 10px;
  }
  #contentArea .contents-special .btn-blank a:hover {
    background-color: transparent;
  }
  #contentArea .contents-special .btn-blank a:hover > span {
    background: url(/rwd/fun/make/special/img/icn_blank_sp.png) no-repeat right center;
    background-size: 21px auto;
  }
}

/* picture box */
#contentArea .contents-special .pic img {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	border: 10px solid #fff;
	box-shadow: 0px 0px 5.4px 0.6px rgba(4, 0, 0, 0.2);
}
#contentArea .contents-special .pic-1col {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	margin-bottom: 10px;
}
#contentArea .contents-special .pic-2col {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: table;
	width: 100%;
	margin-bottom: 10px;
}
#contentArea .contents-special .pic-2col .pic {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: table-cell;
	width: 50%;
}
#contentArea .contents-special .pic-2col .pic:nth-child(2n-1) {
	padding: 0 5px 0 0;
}
#contentArea .contents-special .pic-2col .pic:nth-child(2n) {
	padding: 0 0 0 5px;
}
@media only screen and (max-width: 736px) {
	#contentArea .contents-special .pic img {
		border: 5px solid #fff;
		box-shadow: 0px 0px 2.7px 0.3px rgba(4, 0, 0, 0.2);
	}
	#contentArea .contents-special .pic-1col {
		margin-bottom: 5px;
		padding: 0 15px;
	}
	#contentArea .contents-special .pic-2col {
		margin-bottom: 5px;
		padding: 0 15px;
	}
	#contentArea .contents-special .pic-2col .pic:nth-child(2n-1) {
		padding: 0 2.5px 0 0;
	}
	#contentArea .contents-special .pic-2col .pic:nth-child(2n) {
		padding: 0 0 0 2.5px;
	}
}


/* modal panel layout
----------------------------------- */
.box-craft-list {
	width: 940px;
	margin: 0 auto;
	padding: 145px 0;
}

.box-craft-list .panel-layout {
	margin: 0 -310px;
}

.craft-clm1 {
	width: 520px;
}

.craft-clm2 {
	width: 1040px;
}

.box-craft-list.craft-clm1 .panel-layout {
	width: 520px;
	margin: 0 auto;
}

.box-craft-list.craft-clm2 .panel-layout {
	margin: 0 auto;
}

.box-craft-list .panel-layout .panel-list {
	margin: 0;
	padding: 0;
}
.box-craft-list .panel-layout .panel-list .item {
	width: 500px;
	height: auto;
	padding: 10px;
}
.box-craft-list .panel-layout .panel-list .item > a {
	display: block;
	width: 500px;
	color: inherit;
	opacity: 0;
}
.box-craft-list .panel-layout .panel-list .item > a:hover {
	text-decoration: none;
}
.box-craft-list .panel-layout .panel-list .item .panel {
	position: relative;
	height: 530px;
}
.box-craft-list .panel-layout .panel-list .item > a:hover .panel.clr-b1 {
	box-shadow: 0 0 0 3px #81cde4;
}
.box-craft-list .panel-layout .panel-list .item > a:hover .panel.clr-b2 {
	box-shadow: 0 0 0 3px #f5b2b2;
}
.box-craft-list .panel-layout .panel-list .item > a:hover .panel.clr-b3 {
	box-shadow: 0 0 0 3px #f9c67c;
}
.box-craft-list .panel-layout .panel-list .item .panel:after {
	content: "";
	position: absolute;
	top: -10px;
	left: -10px;
	display: block;
	width: 87px;
	height: 87px;
	background-size: 87px 87px;
	z-index: 10;
}
.box-craft-list .panel-layout .panel-list .item .panel.clr-b1 {
	background-color: #f3fafa;
}
.box-craft-list .panel-layout .panel-list .item .panel.clr-b1:after {
	background-image: url(/rwd/fun/make/special/img/parts_thumb_boy.png);
}
.box-craft-list .panel-layout .panel-list .item .panel.clr-b2 {
	background-color: #fef5f5;
}
.box-craft-list .panel-layout .panel-list .item .panel.clr-b2:after {
	background-image: url(/rwd/fun/make/special/img/parts_thumb_girl.png);
}
.box-craft-list .panel-layout .panel-list .item .panel.clr-b3 {
	background-color: #fff8eb;
}
.box-craft-list .panel-layout .panel-list .item .panel.clr-b3:after {
	background-image: url(/rwd/fun/make/special/img/parts_thumb_both.png);
}
.box-craft-list .panel-layout .panel-list .item .panel .pic {
	margin: 0;
}
.box-craft-list .panel-layout .panel-list .item .panel .pic img {
	width: 100% !important;
	height: auto !important;
	border: none !important;
	outline: none !important;
}
.box-craft-list .panel-layout .panel-list .item .panel .num {
	width: 100%;
	margin: 0;
	text-align: center;
	position: absolute;
	top: 30px;
	left: 0;
}
.box-craft-list .panel-layout .panel-list .item .panel .num span {
	margin: 0 2px;
	color: #13c5d5;
	font-size: 20px;
}
.box-craft-list .panel-layout .panel-list .item .panel .name {
	position: absolute;
	top: 60px;
	left: 0;
	width: 100%;
	margin: 0;
	font-size: 34px;
	font-weight: normal;
	text-align: center;
}
.box-craft-list .panel-layout .panel-list .item .panel .icn-star {
	position: absolute;
	top: 386px;
	left: 0;
	width: 100%;
	margin: 0;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
}
.box-craft-list .panel-layout .panel-list .item .panel .icn-star > span {
	display: inline-block;
	width: 56px;
	height: 13px;
	background-image: url(/rwd/fun/make/common/img/icn_star.png);
}
.box-craft-list .panel-layout .panel-list .item .panel .icn-star .icn-star-1 {
	background-position: -42px 0;
}
.box-craft-list .panel-layout .panel-list .item .panel .icn-star .icn-star-2 {
	background-position: -29px 0;
}
.box-craft-list .panel-layout .panel-list .item .panel .icn-star .icn-star-3 {
	background-position: -16px 0;
}
.box-craft-list .panel-layout .panel-list .item .panel .info {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	position: absolute;
	top: 422px;
	left: 0;
	width: 100%;
	margin: 0;
	padding: 0 20px;
	font-size: 16px;
	line-height: 1.88;
}
@media only screen and (max-width: 736px) {
	.box-craft-list {
		width: 270px;
		margin: 0 auto;
		padding: 70px 0;
	}
	.box-craft-list .panel-layout {
		margin: 0 -260px;
	}

	.box-craft-list.craft-clm2 .panel-layout {
		margin: 0 -260px;
	}
	.box-craft-list.craft-clm1 .slick-list {
		padding: 0 !important;
	}

	.box-craft-list .panel-layout .panel-list .item {
		width: 250px;
		height: auto;
		padding: 10px;
	}
	.box-craft-list .panel-layout .panel-list .item > a {
		width: 250px;
	}
	.box-craft-list .panel-layout .panel-list .item > a .panel {
		height: 280px;
	}

	.box-craft-list .panel-layout .panel-list .item > a:hover .panel.clr-b1,
	.box-craft-list .panel-layout .panel-list .item > a:hover .panel.clr-b2,
	.box-craft-list .panel-layout .panel-list .item > a:hover .panel.clr-b3 {
		box-shadow: 0 0 0 0;
	}
	.box-craft-list .panel-layout .panel-list .item.slick-active > a .panel.clr-b1 {
		box-shadow: 0 0 0 2px #81cde4;
	}
	.box-craft-list .panel-layout .panel-list .item.slick-active > a .panel.clr-b2 {
		box-shadow: 0 0 0 2px #f5b2b2;
	}
	.box-craft-list .panel-layout .panel-list .item.slick-active > a .panel.clr-b3 {
		box-shadow: 0 0 0 2px #f9c67c;
	}
	.box-craft-list .panel-layout .panel-list .item .panel:after {
		left: -5px;
		top: -5px;
		width: 45px;
		height: 45px;
		background-size: 45px 45px;
	}
	.box-craft-list .panel-layout .panel-list .item .panel .num {
		top: 13px;
	}
	.box-craft-list .panel-layout .panel-list .item .panel .num span {
		font-size: 10px;
	}
	.box-craft-list .panel-layout .panel-list .item .panel .name {
		top: 32px;
		font-size: 17px;
	}
	.box-craft-list .panel-layout .panel-list .item .panel .icn-star {
		top: 194px;
		font-size: 10px;
	}
	.box-craft-list .panel-layout .panel-list .item .panel .icn-star > span {
		width: 56px;
		height: 13px;
		background-image: url(/rwd/fun/make/common/img/icn_star.png);
	}
	.box-craft-list .panel-layout .panel-list .item .panel .icn-star .icn-star-1 {
		background-position: -42px 0;
	}
	.box-craft-list .panel-layout .panel-list .item .panel .icn-star .icn-star-2 {
		background-position: -29px 0;
	}
	.box-craft-list .panel-layout .panel-list .item .panel .icn-star .icn-star-3 {
		background-position: -16px 0;
	}
	.box-craft-list .panel-layout .panel-list .item .panel .info {
		top: 213px;
		padding: 0 10px;
		font-size: 10px;
		line-height: 1.88;
	}
}

/* --------------------------------------------------
		mv_modal
-------------------------------------------------- */
.mv_modal {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	max-width: 900px;
	height: 100%;
	margin-right: auto;
	margin-left: auto;
	padding: 70px 10px;
	text-align: center;
}
.mv_modal .mfp-close {
	top: 15px;
	right: 5px;
	width: 40px;
	height: 40px;
	padding-right: 0;
	background-image: url(/rwd/fun/make/craft/img/btn_close.png);
	background-size: 100% auto;
	font-size: 0;
	opacity: 1;
}
.mv_modal .cts-inner {
	position: relative;
	display: inline-block;
	width: 100%;
	max-width: 900px;
	height: 0;
	margin: 0 auto;
	padding-top: 56.25%;
	text-align: center;
	vertical-align: middle;
}
.mv_modal .cts-inner iframe {
	position: absolute;
	display: block;
	top: 0;
	left: 50%;
	width: 100%;
	height: 100%;
	-webkit-transform: translate(-50%, 0);
	-moz-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	-o-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
}

.modal_fl {
	background-color: rgba(255, 255, 255, 0.95);
}
.modal_fl .mfp-content {
	background-color: transparent;
}

@media only screen and (max-width: 736px) {
	.mv_modal {
		box-sizing: border-box;
		padding-right: 5px;
		padding-left: 5px;
	}
	.mv_modal .mfp-close {
		top: 25px;
		width: 20px;
		height: 20px;
		background-size: 20px 20px;
	}
}


/* --------------------------------------------------
		pjax関連
-------------------------------------------------- */
/* 他要素上書き用 */

/* コンテンツエリア大枠 */
.extend #contentArea {
	-webkit-animation: scrollUpperExtend 1.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0.1s 1 normal forwards;
	animation: scrollUpperExtend 1.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0.1s 1 normal forwards;
}

/* フッター */
/* 下層展開時ここに追加 */
.js-large-design-wrapper .l-mainfooter,
.js-rubber-wrapper .l-mainfooter,
.js-summer-festival-wrapper .l-mainfooter,
.js-chokinbako-wrapper .l-mainfooter,
.js-ball_coaster-wrapper .l-mainfooter,
.js-projector-wrapper .l-mainfooter,
.js-eco-wrapper .l-mainfooter,
.js-handspinner-wrapper .l-mainfooter,
.js-vehicle-wrapper .l-mainfooter,
.js-water-wrapper .l-mainfooter,
.js-mobile-wrapper .l-mainfooter,
.js-stationery-wrapper .l-mainfooter,
.js-optical-illusion-wrapper .l-mainfooter,
.js-wind-wrapper .l-mainfooter {
	display: none;
}

/* コンテンツフッター */
/* 下層展開時ここに追加 */
.js-large-design-wrapper #contentFoot,
.js-rubber-wrapper #contentFoot,
.js-summer-festival-wrapper #contentFoot,
.js-chokinbako-wrapper #contentFoot,
.js-ball_coaster-wrapper #contentFoot,
.js-projector-wrapper #contentFoot,
.js-eco-wrapper #contentFoot,
.js-handspinner-wrapper #contentFoot,
.js-vehicle-wrapper #contentFoot,
.js-water-wrapper #contentFoot,
.js-mobile-wrapper #contentFoot,
.js-stationery-wrapper #contentFoot,
.js-optical-illusion-wrapper #contentFoot,
.js-wind-wrapper #contentFoot {
	display: none;
}

/* 次ページ用バナー */
#pageBanner {
	position: relative;
	z-index: 1;
	text-align: center;
}

/* 切り取り線 */
#pageBanner:before,
#pageBanner:after {
	content: "";
	display: none;
	position: absolute;
}
#pageBanner:before {
	top: -1px;
	left: 0;
	z-index: 2;
	width: 100%;
	height: 2px;
	background-image: url(/rwd/fun/make/special/img/bg_line.png);
	background-repeat: repeat-x;
}
#pageBanner:after {
	top: -13px;
	left: 15.625%;
	z-index: 2;
	width: 40px;
	height: 26px;
	background-image: url(/rwd/fun/make/special/img/icn_scissors.png);
	background-repeat: no-repeat;
	-webkit-background-size: contain;
	background-size: contain;
}

/* 下層展開時ここに追加 */
.js-large-design-wrapper #pageBanner:before,
.js-large-design-wrapper #pageBanner:after,
.js-rubber-wrapper #pageBanner:before,
.js-rubber-wrapper #pageBanner:after,
.js-summer-festival-wrapper #pageBanner:before,
.js-summer-festival-wrapper #pageBanner:after,
.js-chokinbako-wrapper #pageBanner:before,
.js-chokinbako-wrapper #pageBanner:after,
.js-ball_coaster-wrapper #pageBanner:before,
.js-ball_coaster-wrapper #pageBanner:after,
.js-projector-wrapper #pageBanner:before,
.js-projector-wrapper #pageBanner:after,
.js-eco-wrapper #pageBanner:before,
.js-eco-wrapper #pageBanner:after,
.js-handspinner-wrapper #pageBanner:before,
.js-handspinner-wrapper #pageBanner:after,
.js-vehicle-wrapper #pageBanner:before,
.js-vehicle-wrapper #pageBanner:after,
.js-water-wrapper #pageBanner:before,
.js-water-wrapper #pageBanner:after,
.js-mobile-wrapper #pageBanner:before,
.js-mobile-wrapper #pageBanner:after,
.js-potential-wrapper #pageBanner:before,
.js-potential-wrapper #pageBanner:after,
.js-stationery-wrapper #pageBanner:before,
.js-stationery-wrapper #pageBanner:after,
.js-optical-illusion-wrapper #pageBanner:before,
.js-optical-illusion-wrapper #pageBanner:after,
.js-wind-wrapper #pageBanner:before,
.js-wind-wrapper #pageBanner:after {
	display: block;
}
#pageBanner.standby:after {
	-webkit-animation: standby 0.7s cubic-bezier(0.45, 0.05, 0.23, 0.93) 0s 1 normal forwards;
	animation: standby 0.7s cubic-bezier(0.45, 0.05, 0.23, 0.93) 0s 1 normal forwards;
}
#pageBanner.cut:after {
	-webkit-animation: cut 1s cubic-bezier(0.645, 0.045, 0.355, 1) 0s 1 normal forwards;
	animation: cut 1s cubic-bezier(0.645, 0.045, 0.355, 1) 0s 1 normal forwards;
}

/* バナー用吹き出しアイコン */
#pageBanner .banner-projector .banner-balloon {
	position: absolute;
	top: 80px;
	left: 50%;
	margin-left: 286px;
	-webkit-transform: rotate(35deg);
	-ms-transform: rotate(35deg);
	transform: rotate(35deg);
}
#pageBanner .banner-eco .banner-balloon {
	position: absolute;
	top: 70px;
	left: 50%;
	margin-left: 196px;
	-webkit-transform: rotate(35deg);
	-ms-transform: rotate(35deg);
	transform: rotate(35deg);
}

/* バナーラッパー */
#pageBanner .banner-wrapper {
	display: none;
	position: relative;
	color: #000;
	overflow: hidden;
	text-decoration: none;
}
/* 下層展開時ここに追加 */
.js-large-design-wrapper #pageBanner .wrapper-large-design,
.js-rubber-wrapper #pageBanner .wrapper-rubber,
.js-summer-festival-wrapper #pageBanner .wrapper-summer-festival,
.js-chokinbako-wrapper #pageBanner .wrapper-chokinbako,
.js-ball_coaster-wrapper #pageBanner .wrapper-ball_coaster,
.js-projector-wrapper #pageBanner .wrapper-projector,
.js-eco-wrapper #pageBanner .wrapper-eco,
.js-handspinner-wrapper #pageBanner .wrapper-handspinner,
.js-vehicle-wrapper #pageBanner .wrapper-vehicle,
.js-water-wrapper #pageBanner .wrapper-water,
.js-mobile-wrapper #pageBanner .wrapper-mobile,
.js-potential-wrapper #pageBanner .wrapper-potential,
.js-stationery-wrapper #pageBanner .wrapper-stationery,
.js-optical-illusion-wrapper #pageBanner .wrapper-optical-illusion,
.js-wind-wrapper #pageBanner .wrapper-wind {
	display: block;
}
/* 最後のコンテンツ下部のトップに戻るバナー用 */
.js-potential-wrapper #pageBanner .wrapper-potential:last-of-type{
	display: inline-block;
	margin-top: 48px;
	overflow: visible;
}


/* バナー */
#pageBanner .banner {
	min-width: 1280px;
	min-height: 344px;
	margin: 0 auto;
	background-repeat: repeat;
	-webkit-background-size: 64px 64px;
	background-size: 64px 64px;
	-webkit-transition: padding 0.6s linear;
	transition: padding 0.6s linear;
}
#pageBanner .banner-ball_coaster { background-image: url(/rwd/fun/make/special/img/bg_pattern_ballcoaster.png); }
#pageBanner .banner-projector { background-image: url(/rwd/fun/make/special/img/bg_pattern_projector.png); }
#pageBanner .banner-eco { background-image: url(/rwd/fun/make/special/img/bg_pattern_eco.png); }
#pageBanner .banner-handspinner { background-image: url(/rwd/fun/make/special/img/bg_pattern_handspinner.png); }
#pageBanner .banner-vehicle { background-image: url(/rwd/fun/make/special/img/bg_pattern_vehicle.png); }
#pageBanner .banner-water { background-image: url(/rwd/fun/make/special/img/bg_pattern_water.png); }
#pageBanner .banner-mobile { background-image: url(/rwd/fun/make/special/img/bg_pattern_mobile.png); }
#pageBanner .banner-potential { background-image: url(/rwd/fun/make/special/img/bg_pattern_potential.png); }
#pageBanner .banner-large-design { background-image: url(/rwd/fun/make/special/img/bg_pattern_large-design.png); }
#pageBanner .banner-chokinbako { background-image: url(/rwd/fun/make/special/img/bg_pattern_chokinbako.png); }
#pageBanner .banner-summer-festival {background-color: #0069CF; }

.extend #pageBanner .banner {
	-webkit-animation: scrollExtend 1.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0.1s 1 normal forwards;
	animation: scrollExtend 1.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0.1s 1 normal forwards;
}

#pageBanner .banner:before {
	content: "";
	display: block;
	position: absolute;
	z-index: 0;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: center bottom;
	background-repeat: no-repeat;
}
#pageBanner .banner-ball_coaster:before {
	background-image: url(/rwd/fun/make/special/img/img_ballcoaster_banner.png);
	-webkit-background-size: 1420px 518px;
	background-size: 1420px 518px;
}
#pageBanner .banner-projector:before {
	background-image: url(/rwd/fun/make/special/img/img_projector_banner.png);
	-webkit-background-size: 1280px 515px;
	background-size: 1280px 515px;
}
#pageBanner .banner-eco:before {
	background-image: url(/rwd/fun/make/special/img/img_eco_banner.png);
	-webkit-background-size: 1550px 474px;
	background-size: 1550px 474px;
}
#pageBanner .banner-handspinner:before {
	background-image: url(/rwd/fun/make/special/img/img_handspinner_banner.png);
	-webkit-background-size: 1800px 524px;
	background-size: 1800px 524px;
}
#pageBanner .banner-vehicle:before {
	background-image: url(/rwd/fun/make/special/img/img_vehicle_banner.png);
	-webkit-background-size: 1380px 474px;
	background-size: 1380px 474px;
}
#pageBanner .banner-water:before {
	background-image: url(/rwd/fun/make/special/img/img_water_banner.png);
	-webkit-background-size: 1780px 478px;
	background-size: 1780px 478px;
}
#pageBanner .banner-mobile:before {
	background-image: url(/rwd/fun/make/special/img/img_mobile_banner.png);
	-webkit-background-size: 1230px 444px;
	background-size: 1230px 444px;
}
#pageBanner .banner-potential:before {
	background-image: url(/rwd/fun/make/special/img/img_potential_banner.png);
	-webkit-background-size: 1380px 394px;
	background-size: 1380px 394px;
}
#pageBanner .banner-large-design:before {
	background-image: url(/rwd/fun/make/special/img/img_large-design_banner.png);
	-webkit-background-size: 1780px 344px;
	background-size: 1780px 344px;
}
#pageBanner .banner-chokinbako:before {
	background-image: url(/rwd/fun/make/special/img/img_chokinbako_banner.png);
	-webkit-background-size: 1780px 344px;
	background-size: 1780px 344px;
}
#pageBanner .banner-summer-festival:before {
	background-image: url(/rwd/fun/make/special/img/img_summer-festival_banner.png);
	-webkit-background-size: 1780px 344px;
	background-size: 1780px 344px;
}


/* バナーインナーラッパー */
#pageBanner .banner-inner {
	position: relative;
	z-index: 1;
}
#pageBanner .banner-inner:after {
	content: "";
	display: block;
	position: absolute;
	bottom: 13px;
	left: 50%;
	width: 54px;
	height: 56px;
	margin-left: -27px;
	background-image: url(/rwd/fun/make/special/img/btn_arrow_bottom.png);
	background-repeat: no-repeat;
	-webkit-background-size: contain;
	background-size: contain;
}
#pageBanner .banner-ball_coaster .banner-inner {
	padding-top: 72px;
	padding-bottom: 123px;
}
#pageBanner .banner-projector .banner-inner {
	padding-top: 75px;
	padding-bottom: 133px;
}
#pageBanner .banner-eco .banner-inner {
	padding-top: 48px;
	padding-bottom: 90px;
}
#pageBanner .banner-handspinner .banner-inner {
	padding-top: 48px;
	padding-bottom: 88px;
}
#pageBanner .banner-vehicle .banner-inner {
	padding-top: 48px;
	padding-bottom: 160px;
}
#pageBanner .banner-water .banner-inner {
	padding-top: 49px;
	padding-bottom: 160px;
}
#pageBanner .banner-mobile .banner-inner {
	padding-top: 49px;
	padding-bottom: 160px;
}
#pageBanner .banner-potential .banner-inner {
	padding-top: 41px;
	padding-bottom: 130px;
}
#pageBanner .banner-large-design .banner-inner {
	padding-top: 78px;
	padding-bottom: 130px;
}
#pageBanner .banner-large-design .banner-inner img {
	position: relative;
	left: -20px;
}
#pageBanner .banner-chokinbako .banner-inner {
	padding-top: 55px;
	padding-bottom: 112px;
}
#pageBanner .banner-summer-festival .banner-inner {
	padding-top: 55px;
	padding-bottom: 112px;
}
#pageBanner .banner-top {
	min-width: 0;
	min-height: 280px;
}
#pageBanner .banner-top .banner-inner {
	display: block;
	margin: 0 auto;
}
#pageBanner .banner-top .banner-inner:after {
	display: none;
}

/* バナー画像 */
#pageBanner .banner img {
	margin-right: auto;
	margin-left: auto;
}


/* 伸びるアニメーション バナー上コンテンツずらす用 */
@-webkit-keyframes scrollUpperExtend {
	0% { margin-top: 0; }
	65% { margin-top: -70px; }
	100% { margin-top: 0; }
}
@keyframes scrollUpperExtend {
	0% { margin-top: 0; }
	65% { margin-top: -70px; }
	100% { margin-top: 0; }
}
/* 伸びるアニメーション */
@-webkit-keyframes scrollExtend {
	0% { padding-top: 0; }
	65% { padding-top: 70px; }
	100% { padding-top: 0; }
}
@keyframes scrollExtend {
	0% { padding-top: 0; }
	65% { padding-top: 70px; }
	100% { padding-top: 0; }
}
@-webkit-keyframes scrollExtend-sp {
	0% { padding-top: 0; }
	65% { padding-top: 30px; }
	100% { padding-top: 0; }
}
@keyframes scrollExtend-sp {
	0% { padding-top: 0; }
	65% { padding-top: 30px; }
	100% { padding-top: 0; }
}

/* 切り取り準備アニメーション */
@-webkit-keyframes standby {
	0% { left: 15.625%; }
	100% { left: 0; }
}
@keyframes standby {
	0% { left: 15.625%; }
	100% { left: 0; }
}
@-webkit-keyframes standby-sp {
	0% { left: 5%; }
	100% { left: 0; }
}
@keyframes standby-sp {
	0% { left: 5%; }
	100% { left: 0; }
}
/* 切り取りアニメーション */
@-webkit-keyframes cut {
	0% { left: 0; }
	100% { left: 105%; }
}
@keyframes cut {
	0% { left: 0; }
	100% { left: 105%; }
}
@-webkit-keyframes cut-sp {
	0% { left: 0; }
	100% { left: 110%; }
}
@keyframes cut-sp {
	0% { left: 0; }
	100% { left: 110%; }
}


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

	#pageBanner .anime-craft-fall {
		width: 17.1875%;/* 110px / 640px * 100% */
		margin-right: 10%;/* 64px / 640px * 100% */
	}

	/* 最後のコンテンツ下部のトップに戻るバナー用 */
	.js-potential-wrapper #pageBanner .wrapper-potential:last-of-type {
		margin-top: 41px;
		margin-bottom: 41px;
	}

	#pageBanner .banner {
		min-width: 0;
		min-height: 0;
		background-position: center bottom 10px;
	}
	#pageBanner .banner img {
		width: 100%;
	}
	#pageBanner .banner-ball_coaster.banner img {
		width: 85.3125%;
	}
	#pageBanner .banner-ball_coaster .banner-inner {
		padding-top: 33px;
		padding-bottom: 100px;
	}
	#pageBanner .banner-projector .banner-inner {
		padding-top: 35px;
		padding-bottom: 108px;
	}
	#pageBanner .banner-eco .banner-inner {
		padding-top: 28px;
		padding-bottom: 91px;
	}
	#pageBanner .banner-handspinner .banner-inner {
		padding-top: 28px;
		padding-bottom: 90px;
	}
	#pageBanner .banner-vehicle .banner-inner {
		padding-top: 23px;
		padding-bottom: 126px;
	}
	#pageBanner .banner-water .banner-inner {
		padding-top: 26px;
		padding-bottom: 130px;
	}
	#pageBanner .banner-mobile .banner-inner {
		padding-top: 26px;
		padding-bottom: 130px;
	}
	#pageBanner .banner-potential .banner-inner {
		padding-top: 20px;
		padding-bottom: 130px;
	}
	#pageBanner .banner-large-design .banner-inner {
		padding-top: 20px;
		padding-bottom: 80px;
	}
	#pageBanner .banner-large-design .banner-inner img{
		width: 85%;
		left: 0;
	}
	#pageBanner .banner-chokinbako .banner-inner {
		padding-top: 20px;
		padding-bottom: 88px;
	}
	#pageBanner .banner-chokinbako .banner-inner img{
		width: 93%;
	}

	/* 切り取り線 */
	#pageBanner:after {
		top: -8.5px;
		left: 5%;
		width: 26px;
		height: 17px;
	}
	#pageBanner.standby:after {
		-webkit-animation-name: standby-sp;
		animation-name: standby-sp;
	}
	#pageBanner.cut:after {
		-webkit-animation-name: cut-sp;
		animation-name: cut-sp;
	}


	#pageBanner .banner:before {
		background-position: center bottom;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	#pageBanner .banner-ball_coaster:before {
		background-image: url(/rwd/fun/make/special/img/sp/img_ballcoaster_banner.png);
	}
	#pageBanner .banner-projector:before {
		background-image: url(/rwd/fun/make/special/img/sp/img_projector_banner.png);
	}
	#pageBanner .banner-eco:before {
		background-image: url(/rwd/fun/make/special/img/sp/img_eco_banner.png);
	}
	#pageBanner .banner-handspinner:before {
		background-image: url(/rwd/fun/make/special/img/sp/img_handspinner_banner.png);
	}
	#pageBanner .banner-vehicle:before {
		background-image: url(/rwd/fun/make/special/img/sp/img_vehicle_banner.png);
	}
	#pageBanner .banner-water:before {
		background-image: url(/rwd/fun/make/special/img/sp/img_water_banner.png);
	}
	#pageBanner .banner-mobile:before {
		background-image: url(/rwd/fun/make/special/img/sp/img_mobile_banner.png);
	}
	#pageBanner .banner-potential:before {
		background-image: url(/rwd/fun/make/special/img/sp/img_potential_banner.png);
	}
	#pageBanner .banner-large-design:before {
		background-image: url(/rwd/fun/make/special/img/sp/img_large-design_banner.png);
	}
	#pageBanner .banner-chokinbako:before {
		background-image: url(/rwd/fun/make/special/img/sp/img_chokinbako_banner.png);
		background-position: center top;
	}

	/* バナー用吹き出しアイコン */
	#pageBanner .banner-projector .banner-balloon {
		top: 80px;
		left: 50%;
		margin-left: 286px;
	}
	#pageBanner .banner-eco .banner-balloon {
		top: 70px;
		left: 50%;
		margin-left: 196px;
	}

	#pageBanner .banner-top {
		min-height: 0;
	}
	#pageBanner .banner-top .banner-inner {
		padding: 0 10px;
	}

	.extend #pageBanner .banner {
		-webkit-animation-name: scrollExtend-sp;
		animation-name: scrollExtend-sp;
	}


	#pageBanner .banner-inner:after {
		bottom: 16.5px;
		left: 50%;
		width: 57px;
		height: 58.5px;
		margin-left: -28.5px;
	}
}


/* --------------------------------------------------
		contentFoot
-------------------------------------------------- */
#content #contentFoot {
	padding-top: 50px;
	background-color: #f6f2ed;
}
.js-potential-wrapper #content #contentFoot {
	background-color: #fff;
}
@media only screen and (max-width: 736px) {
	#content #contentFoot {
		padding-top: 0;
		background-color: inherit;
	}
}

/* --------------------------------------------------
		汎用class
-------------------------------------------------- */
.obj-pc {
	display: block;
}
.obj-sp {
	display: none;
}
.br-pc:after {
	content: '\A';
	white-space: pre;
}
.br-sp:after {
	content: '';
}
@media only screen and (max-width: 736px) {
	.obj-pc {
		display: none;
	}
	.obj-sp {
		display: block;
	}
	.br-pc:after {
		content: '';
	}
	.br-sp:after {
		content: '\A';
		white-space: pre;
	}
}


#contentArea img {
	height: auto;
}