@charset "UTF-8";
/*------------------------------------------------------------
	layout
------------------------------------------------------------*/
#wrapper {
	min-width: 960px;
	overflow: hidden;
}
.contents_section {
	min-width: 960px;
}



/*------------------------------------------------------------
	section
------------------------------------------------------------*/
.title_section,
.section1,
.section2,
.section3,
.section4 {
	position: relative;
	min-width: 960px;
	margin: 0 auto;
}
.section1_wrap,
.section2_wrap,
.section3_wrap,
.section4_wrap {
	position: relative;
	width: 100%;
	height: 100%;
	margin: 0 auto;
}
.title_body,
.section1_body,
.section2_body,
.section3_body,
.section4_body {
	position: relative;
	width: 960px;
	height: 100%;
	margin: 0 auto;
}
.title_body > *,
.section1_body > *,
.section2_body > *,
.section3_body > *,
.section4_body > *,
.section_box > *,
.section_obj, .section_obj > p {
	position: absolute;
}
.section_obj {
	left: 0;
	top: 0;
}
.section_obj > p {
	display: block;
}
.section_clip {
	left: 36px;
	top: 36px;
	width: 640px;
	height: 360px;
}
.section_img_frame {
	left: 0px;
	top: 0px;
}



/*------------------------------------------------------------
	title_section
------------------------------------------------------------*/
.title_section {
	z-index: 1;
	height: 319px;
}
.title {
	left: 255px;
	top: -40px;
	transform-origin: 50% 0%;
    -webkit-transform-origin: 50% 0%;
}
.text_morethan150cards {
	left: 10px;
	top: 85px;
}



/*------------------------------------------------------------
	section1
------------------------------------------------------------*/
.section1 {
	z-index: 2;
	height: 680px;
	background: url(../img/card/section1_bg.png) center 0 repeat-x;
}
.section1_wrap {
	background: url(../img/card/section1_bg_elements.png) center 140px no-repeat;
}
.section1_body {
}
.section1_text {
	left: 46px;
	top: 85px;
}
.section1_howto {
	left: 0;
	top: 0;
}
.section1_title_howto {
	left: 260px;
	top: 210px;
}
.section1_detail_howto {
	left: 5px;
	top: 306px;
}
.section1_img_card1 {
	left: -121px;
	top: 77px;
}
.section1_img_card1 .rotor {
	width: 150px;
	height: 193px;
	background-image: url(../img/card/section1_img_card1.png);
}
.section1_img_card2 {
	left: -218px;
	top: 373px;
}
.section1_img_card2 .rotor {
	width: 172px;
	height: 203px;
	background-image: url(../img/card/section1_img_card2.png);
}
.section1_img_card3 {
	left: 1022px;
	top: 192px;
}
.section1_img_card3 .rotor {
	width: 160px;
	height: 197px;
	background-image: url(../img/card/section1_img_card3.png);
}
.section1_img_mario {
	left: 717px;
	top: -93px;
}
.section1_img_mario .rotor {
	width: 397px;
	height: 386px;
	background-image: url(../img/card/section1_img_mario.png);
}


/*------------------------------------------------------------
	section2
------------------------------------------------------------*/
.section2 {
	z-index: 3;
	height: 1159px;
	margin-top: -41px;
	background: url(../img/card/section2_bg.png) center 0 repeat-x;
}
.section2_wrap {
	background: url(../img/card/section2_bg_elements.png) center 0 no-repeat;
}
.section2_body {
}
.section2_title {
	left: -2px;
	top: -49px;
	z-index: 5;
}
.section2_video {
	left: 119px;
	top: 57px;
	z-index: 4;
}
.section2_video .section_clip:after {
	content: '';
	display: block;
	position: absolute;
	top: -36px;
	left: -36px;
	width: 735px;
	height: 462px;
	background: url(../img/card/section_img_frame.png) top left no-repeat;
}
.tablet-mode .section2_video .section_clip:after {
	display: none;
}
.tablet-mode .section2_video .section_clip:before {
	content: '';
	display: block;
	position: absolute;
	top: -36px;
	left: -36px;
	width: 735px;
	height: 462px;
	background: url(../img/card/section_img_frame.png) top left no-repeat;
}
.tablet-mode .section2_video .section_clip video {
	position: absolute;
}
.section2_gamepad {
	left: -58px;
  top: 522px;
	width: 1021px;
	height: 594px;
	background: url(../img/card/section2_bg_gamepad.png) 0 0 no-repeat;
	display: block;
}
.section2_title_gamepad {
	left: 438px;
	top: 50px;
}
.section2_detail_gamepad {
	left: 81px;
  top: 207px;
}
.section2_text_gamepad_point {
	left: 79px;
  top: 482px;
}
.section2_img_mario {
	left: -94px;
  	top: 199px;
	z-index: 5;
	opacity: 0;
}
.tablet-mode .section2_img_mario {
	opacity: 1;
}
.section2_img_mario .rotor {
	width: 258px;
	height: 338px;
	background-image: url(../img/card/section2_img_mario.png);
}
.section2_img_kuribo {
	left: 863px;
	top: -22px;
	opacity: 0;
}
.tablet-mode .section2_img_kuribo {
	opacity: 1;
}
.section2_img_kuribo .rotor {
	width: 180px;
	height: 222px;
	background-image: url(../img/card/section2_img_kuribo.png);
}
.section2_img_heiho {
	left: 856px;
	top: 238px;
	opacity: 0;
}
.tablet-mode .section2_img_heiho {
	opacity: 1;
}
.section2_img_heiho .rotor {
	width: 144px;
	height: 176px;
	background-image: url(../img/card/section2_img_heiho.png);
}
.section2_img_nokonoko {
	left: 917px;
	top: 393px;
	opacity: 0;
}
.tablet-mode .section2_img_nokonoko {
	opacity: 1;
}
.section2_img_nokonoko .rotor {
	width: 243px;
	height: 347px;
	background-image: url(../img/card/section2_img_nokonoko.png);
}



/*------------------------------------------------------------
	section3
------------------------------------------------------------*/
.section3 {
	z-index: 2;
	height: 2224px;
	margin-top: -40px;
	background: url(../img/card/section3_bg.png) center 0 repeat;
}
.section3_wrap {
}
.section3_body {
	z-index: 4;
}
.section3_bg_bottom {
	position: relative;
	width: 100%;
	height: 67px;
	margin: -32px auto 0;
	background: url(../img/card/section3_bg_bottom.png) center 0 repeat-x;
}
.section3_title {
	left: -62px;
  top: 53px;
}
.section3_text {
	left: 222px;
	top: 108px;
}
.section3_flow {
	left: -4px;
	top: 303px;
	width: 967px;
	height: 1216px;
	background: url(../img/card/section3_bg_paper.png) 0 0 no-repeat;
}
.section3_detail_flow {
	left: 0px;
	top: -20px;
	z-index: 6;
}
.section3_objectcard {
	left: 0px;
	top: 0px;
	z-index: 6;
}
.section3_title_objectcard {
	left: 264px;
	top: 751px;
}
.section3_text_objectcard {
	left: 187px;
	top: 866px;
}
.section3_img_objcard_s {
	left: 0px;
	top: 0px;
}
.section3_img_objcard_s > p {
	position: absolute;
}
.section3_img_objcard_s1 {
	left: 65px;
	top: 991px;
}
.section3_img_objcard_s2 {
	left: 193px;
	top: 988px;
}
.section3_img_objcard_s3 {
	left: 327px;
	top: 988px;
}
.section3_img_objcard_s4 {
	left: 478px;
	top: 991px;
}
.section3_img_objcard_s5 {
	left: 601px;
	top: 988px;
}
.section3_img_objcard_s6 {
	left: 736px;
	top: 984px;
}
.section3_flow .section_obj {
	z-index: 5;
}
.section3_img_obj5 {
	left: 568px;
	top: -55px;
	width: 262px;
	height: 395px;
	background: url(../img/card/section3_img_obj5.png) 0 0 no-repeat;
}
.section3_img_obj4 {
	left: -92px;
	top: 686px;
	width: 210px;
	height: 233px;
	background: url(../img/card/section3_img_obj4.png) 0 0 no-repeat;
}
.section3_img_mario_penky {
	left: 791px;
	top: 616px;
}
.section3_img_mario_penky .rotor {
	width: 248px;
	height: 390px;
	background-image: url(../img/card/section3_img_mario_penky.png);
}
.section3_video {
	left: 119px;
	top: 1670px;
}
.section3_video .section_clip:after {
	content: '';
	display: block;
	position: absolute;
	top: -36px;
	left: -36px;
	width: 735px;
	height: 462px;
	background: url(../img/card/section_img_frame.png) top left no-repeat;
}
.tablet-mode .section3_video .section_clip:after {
	display: none;
}
.tablet-mode .section3_video .section_clip:before {
	content: '';
	display: block;
	position: absolute;
	top: -36px;
	left: -36px;
	width: 735px;
	height: 462px;
	background: url(../img/card/section_img_frame.png) top left no-repeat;
}
.tablet-mode .section3_video .section_clip video {
	position: absolute;
}
.section3_text_video {
	left: 303px;
	top: -142px;
}
.section3_obj_bg {
	position: absolute;
	left: 50%;
	top: 0;
	width: 960px;
	margin-left: -480px;
	z-index: 3;
}
.section3_obj_bg > p {
	position: absolute;
}
.section3_img_obj1 {
	left: 756px;
	top: -5px;
	width: 381px;
	height: 558px;
	background: url(../img/card/section3_img_obj1.png) 0 0 no-repeat;
}
.section3_img_obj2 {
	left: -194px;
  top: 352px;
	width: 218px;
	height: 197px;
	background: url(../img/card/section3_img_obj2.png) 0 0 no-repeat;
}
.section3_img_obj3 {
	left: 868px;
  top: 1772px;
	width: 299px;
	height: 339px;
	background: url(../img/card/section3_img_obj3.png) 0 0 no-repeat;
}
.section3_img_objcard1 {
	left: -241px;
	top: 594px;
	width: 299px;
	height: 370px;
	background: url(../img/card/section3_img_objcard1.png) 0 0 no-repeat;
}
.section3_img_objcard2 {
	left: 887px;
	top: 634px;
	width: 335px;
	height: 391px;
	background: url(../img/card/section3_img_objcard2.png) 0 0 no-repeat;
}
.section3_img_objcard3 {
	left: -229px;
  top: 1233px;
	width: 280px;
	height: 358px;
	background: url(../img/card/section3_img_objcard3.png) 0 0 no-repeat;
}
.section3_img_objcard4 {
	left: 975px;
	top: 1244px;
	width: 295px;
	height: 369px;
	background: url(../img/card/section3_img_objcard4.png) 0 0 no-repeat;
}
.section3_img_objcard5 {
	left: -202px;
  top: 1632px;
	width: 297px;
	height: 368px;
	background: url(../img/card/section3_img_objcard5.png) 0 0 no-repeat;
}


/*------------------------------------------------------------
	section4
------------------------------------------------------------*/
.section4 {
	z-index: 1;
	height: 1453px;
	background: rgba(255,255,255,0.4);
}
.section4_wrap {
}
.section4_body {
}
.section4_title {
	left: 185px;
	top: 63px;
}
.section4_detail1 {
	left: -20px;
	top: 206px;
}
.section4_detail2 {
	left: 252px;
	top: 571px;
}
.section4_detail3 {
	left: -20px;
	top: 993px;
}
.section4_cardset1 {
}
.section4_cardset2 {
}
.section4_cardset3 {
}
.section4_img_card1 {
	left: 297px;
	top: 254px;
	width: 148px;
	height: 188px;
	background: url(../img/card/section4_img_card1.png) 0 0 no-repeat;
}
.section4_img_card2 {
	left: 475px;
	top: 254px;
	width: 150px;
	height: 190px;
	background: url(../img/card/section4_img_card2.png) 0 0 no-repeat;
}
.section4_img_card3 {
	left: 380px;
	top: 379px;
	width: 148px;
	height: 188px;
	background: url(../img/card/section4_img_card3.png) 0 0 no-repeat;
}
.section4_img_card4 {
	left: 533px;
	top: 377px;
	width: 152px;
	height: 190px;
	background: url(../img/card/section4_img_card4.png) 0 0 no-repeat;
}
.section4_img_card5 {
	left: 324px;
	top: 627px;
	width: 152px;
	height: 191px;
	background: url(../img/card/section4_img_card5.png) 0 0 no-repeat;
}
.section4_img_card6 {
	left: 477px;
	top: 630px;
	width: 146px;
	height: 187px;
	background: url(../img/card/section4_img_card6.png) 0 0 no-repeat;
}
.section4_img_card7 {
	left: 296px;
	top: 764px;
	width: 150px;
	height: 189px;
	background: url(../img/card/section4_img_card7.png) 0 0 no-repeat;
}
.section4_img_card8 {
	left: 446px;
	top: 762px;
	width: 150px;
	height: 189px;
	background: url(../img/card/section4_img_card8.png) 0 0 no-repeat;
}
.section4_img_card9 {
	left: 326px;
	top: 1030px;
	width: 155px;
	height: 190px;
	background: url(../img/card/section4_img_card9.png) 0 0 no-repeat;
}
.section4_img_card10 {
	left: 483px;
	top: 1031px;
	width: 151px;
	height: 188px;
	background: url(../img/card/section4_img_card10.png) 0 0 no-repeat;
}
.section4_img_card11 {
	left: 387px;
	top: 1177px;
	width: 151px;
	height: 188px;
	background: url(../img/card/section4_img_card11.png) 0 0 no-repeat;
}
.section4_img_card12 {
	left: 540px;
	top: 1176px;
	width: 151px;
	height: 188px;
	background-image: url(../img/card/section4_img_card12.png);
}
.section4_img_mario {
	left: 748px;
	top: 205px;
	opacity: 0;
}
.tablet-mode .section4_img_mario {
	opacity: 1;
}
.section4_img_mario .rotor {
	width: 248px;
	height: 320px;
	background-image: url(../img/card/section4_img_mario.png);
}
.section4_img_penky {
	left: 969px;
	top: 139px;
	opacity: 0;
}
.tablet-mode .section4_img_penky {
	opacity: 1;
}
.section4_img_penky .rotor {
	width: 195px;
	height: 249px;
	background-image: url(../img/card/section4_img_penky.png);
}
.section4_img_nokonoko {
	left: -121px;
	top: 629px;
	opacity: 0;
}
.tablet-mode .section4_img_nokonoko {
	opacity: 1;
}
.section4_img_nokonoko .rotor {
	width: 260px;
	height: 337px;
	background-image: url(../img/card/section4_img_nokonoko.png);
}
.section4_img_obj1 {
	left: 723px;
	top: 1142px;
	width: 381px;
	height: 558px;
	background: url(../img/card/section3_img_obj1.png) 0 0 no-repeat;
}


/*------------------------------------------------------------
	card_parts
------------------------------------------------------------*/
.card_parts {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: #3264e6;
}
.tablet-mode .card_parts {
	background: #3264e6 url(../img/card/card_bg.jpg) 0 0;
}
.card_parts > div {
	float: left;
	position: relative;
	width: 6192px; /* 36枚分の幅 x2 */
	height: 118px;
	overflow: hidden;
}
.card_parts > div > .card {
	float: left;
	display: block;
	width: 86px;
	height: 118px;
	background-image: url(../img/card/card_sprite.png);
	background-repeat: no-repeat;
}
.card_parts > div:nth-child(even) {
	float: right;
}
.card_parts > div:nth-child(even) > .card {
	float: right;
}


.card_parts > div > .backface {
	background-position: -172px -1180px !important;
	transform: perspective(500px) rotateY(180deg);
	-webkit-transform: perspective(500px) rotateY(180deg);
}

.card_00 {
  background-position: -86px 0px;
}
.card_01 {
  background-position: -602px -708px;
}
.card_02 {
  background-position: -172px 0px;
}
.card_03 {
  background-position: 0px -118px;
}
.card_04 {
  background-position: -86px -118px;
}
.card_05 {
  background-position: -172px -118px;
}
.card_06 {
  background-position: -258px 0px;
}
.card_07 {
  background-position: -258px -118px;
}
.card_08 {
  background-position: -344px 0px;
}
.card_09 {
  background-position: -344px -118px;
}
.card_10 {
  background-position: 0px -236px;
}
.card_100 {
  background-position: -86px -236px;
}
.card_101 {
  background-position: -172px -236px;
}
.card_102 {
  background-position: -258px -236px;
}
.card_103 {
  background-position: -344px -236px;
}
.card_104 {
  background-position: -430px 0px;
}
.card_105 {
  background-position: -430px -118px;
}
.card_106 {
  background-position: -430px -236px;
}
.card_107 {
  background-position: 0px -354px;
}
.card_108 {
  background-position: -86px -354px;
}
.card_109 {
  background-position: -172px -354px;
}
.card_11 {
  background-position: -258px -354px;
}
.card_110 {
  background-position: -344px -354px;
}
.card_111 {
  background-position: -430px -354px;
}
.card_112 {
  background-position: -516px 0px;
}
.card_113 {
  background-position: -516px -118px;
}
.card_114 {
  background-position: -516px -236px;
}
.card_115 {
  background-position: -516px -354px;
}
.card_116 {
  background-position: 0px -472px;
}
.card_117 {
  background-position: -86px -472px;
}
.card_118 {
  background-position: -172px -472px;
}
.card_119 {
  background-position: -258px -472px;
}
.card_12 {
  background-position: -344px -472px;
}
.card_120 {
  background-position: -430px -472px;
}
.card_121 {
  background-position: -516px -472px;
}
.card_122 {
  background-position: -602px 0px;
}
.card_123 {
  background-position: -602px -118px;
}
.card_124 {
  background-position: -602px -236px;
}
.card_125 {
  background-position: -602px -354px;
}
.card_126 {
  background-position: -602px -472px;
}
.card_127 {
  background-position: -688px 0px;
}
.card_128 {
  background-position: -688px -118px;
}
.card_129 {
  background-position: -688px -236px;
}
.card_13 {
  background-position: -688px -354px;
}
.card_130 {
  background-position: -688px -472px;
}
.card_131 {
  background-position: 0px -590px;
}
.card_132 {
  background-position: -86px -590px;
}
.card_14 {
  background-position: -172px -590px;
}
.card_15 {
  background-position: -258px -590px;
}
.card_16 {
  background-position: -344px -590px;
}
.card_17 {
  background-position: -430px -590px;
}
.card_18 {
  background-position: -516px -590px;
}
.card_19 {
  background-position: -602px -590px;
}
.card_20 {
  background-position: -688px -590px;
}
.card_21 {
  background-position: -774px 0px;
}
.card_22 {
  background-position: -774px -118px;
}
.card_23 {
  background-position: -774px -236px;
}
.card_24 {
  background-position: -774px -354px;
}
.card_25 {
  background-position: -774px -472px;
}
.card_26 {
  background-position: -774px -590px;
}
.card_27 {
  background-position: 0px -708px;
}
.card_28 {
  background-position: -86px -708px;
}
.card_29 {
  background-position: -172px -708px;
}
.card_30 {
  background-position: -258px -708px;
}
.card_31 {
  background-position: -344px -708px;
}
.card_32 {
  background-position: -430px -708px;
}
.card_33 {
  background-position: -516px -708px;
}
.card_34 {
  background-position: 0px 0px;
}
.card_35 {
  background-position: -688px -708px;
}
.card_36 {
  background-position: -774px -708px;
}
.card_37 {
  background-position: -860px 0px;
}
.card_38 {
  background-position: -860px -118px;
}
.card_39 {
  background-position: -860px -236px;
}
.card_40 {
  background-position: -860px -354px;
}
.card_41 {
  background-position: -860px -472px;
}
.card_42 {
  background-position: -860px -590px;
}
.card_43 {
  background-position: -860px -708px;
}
.card_44 {
  background-position: 0px -826px;
}
.card_45 {
  background-position: -86px -826px;
}
.card_46 {
  background-position: -172px -826px;
}
.card_47 {
  background-position: -258px -826px;
}
.card_48 {
  background-position: -344px -826px;
}
.card_49 {
  background-position: -430px -826px;
}
.card_50 {
  background-position: -516px -826px;
}
.card_51 {
  background-position: -602px -826px;
}
.card_52 {
  background-position: -688px -826px;
}
.card_53 {
  background-position: -774px -826px;
}
.card_54 {
  background-position: -860px -826px;
}
.card_55 {
  background-position: -946px 0px;
}
.card_56 {
  background-position: -946px -118px;
}
.card_57 {
  background-position: -946px -236px;
}
.card_58 {
  background-position: -946px -354px;
}
.card_59 {
  background-position: -946px -472px;
}
.card_60 {
  background-position: -946px -590px;
}
.card_61 {
  background-position: -946px -708px;
}
.card_62 {
  background-position: -946px -826px;
}
.card_63 {
  background-position: -1032px 0px;
}
.card_64 {
  background-position: -1032px -118px;
}
.card_65 {
  background-position: -1032px -236px;
}
.card_66 {
  background-position: -1032px -354px;
}
.card_67 {
  background-position: -1032px -472px;
}
.card_68 {
  background-position: -1032px -590px;
}
.card_69 {
  background-position: -1032px -708px;
}
.card_70 {
  background-position: -1032px -826px;
}
.card_71 {
  background-position: 0px -944px;
}
.card_72 {
  background-position: -86px -944px;
}
.card_73 {
  background-position: -172px -944px;
}
.card_74 {
  background-position: -258px -944px;
}
.card_75 {
  background-position: -344px -944px;
}
.card_76 {
  background-position: -430px -944px;
}
.card_77 {
  background-position: -516px -944px;
}
.card_78 {
  background-position: -602px -944px;
}
.card_79 {
  background-position: -688px -944px;
}
.card_80 {
  background-position: -774px -944px;
}
.card_81 {
  background-position: -860px -944px;
}
.card_82 {
  background-position: -946px -944px;
}
.card_83 {
  background-position: -1032px -944px;
}
.card_84 {
  background-position: -1118px 0px;
}
.card_85 {
  background-position: -1118px -118px;
}
.card_86 {
  background-position: -1118px -236px;
}
.card_87 {
  background-position: -1118px -354px;
}
.card_88 {
  background-position: -1118px -472px;
}
.card_89 {
  background-position: -1118px -590px;
}
.card_90 {
  background-position: -1118px -708px;
}
.card_91 {
  background-position: -1118px -826px;
}
.card_92 {
  background-position: -1118px -944px;
}
.card_93 {
  background-position: 0px -1062px;
}
.card_94 {
  background-position: -86px -1062px;
}
.card_95 {
  background-position: -172px -1062px;
}
.card_96 {
  background-position: -258px -1062px;
}
.card_97 {
  background-position: -344px -1062px;
}
.card_98 {
  background-position: -430px -1062px;
}
.card_99 {
  background-position: -516px -1062px;
}
.card_back {
  background-position: -602px -1062px;
}