@charset "UTF-8";
/* CSS Document */


.p1_base{
	margin-top: 4px;
	width:1000px;
	height:auto;
	height: 681px;
	margin-left: calc(50vw - 500px);
	display: block;
	border: 6px solid #67C2DD;
	background-color: #575757;
	background-color:#ffffff;
	box-sizing: border-box;
	border-radius: 20px;
	padding-bottom:50px;
}

.mainBase{
	position: relative;
	width:651px;
	height: 681px;
	margin-left:175px;
	margin-top:30px;
	/*border: 1px solid #FF0000;*/
}

/*-------------------*/
.svgDiv1,.svgDiv2,.svgDiv3,.svgDiv4,.svgDiv5,.svgDiv6,.svgDiv7,.svgDiv8,.svgDiv9,.svgDiv10,.svgDiv11,.svgDiv12,.svgDiv13,.svgDiv14,.svgDiv15,.svgDiv16,.svgDiv17,.svgDiv18,.svgDiv19,.svgDiv20{
	position:absolute;
	z-index: 150;
	display:none;
	left:0px;
	top:0px;
	visibility: hidden; /*visible*/
}

#svg1_1{
	border: 1px solid #333333;  /* grey*/
}
#svg1_2{
	border: 1px solid #FF9294; /*pink*/
}
#svg1_3{
	border: 1px solid #FF0000;  /*red*/
}
#svg1_4{
	border: 1px solid #FFF300;  /*yellow*/
}
#svg1_5{
	border: 1px solid #00FB29;  /*green*/
}
#svg1_6{
	border: 1px solid #14AFFA; /*blue*/
}
#move_pato{
	position:absolute;
	top:-70px;
	left:230px;
	display: block;
	width:61px;
	height:94px;
	z-index: 200;
	transform: rotate(14deg);
	
	display:none;
}

/*.pato{
	position:absolute;
	top:-70px;
	left:245px;
	display: block;
	width:61px;
	height:94px;
	z-index: 120;
}
.pato img {
	transform: rotate(14deg);
	width:61px;
	height:94px;
}*/

.ms{
	position:absolute;
	display: block;
	width:218px;
	height:178px;
	
	visibility: hidden; /*visible*/
}
.ms img{
	width:218px;
	height:178px;
}
/*    217 * 177   */
.m1{
	top:0px;
	left:0px;
}
.m2{
	top:0px;
	left:217px;
}
.m3{
	top:0px;
	left:434px;
}
.m4{
	top:177px;
	left:0px;
}
.m5{
	top:177px;
	left:217px;
}
.m6{
	top:177px;
	left:434px;
}
.m7{
	top:354px;
	left:0px;
}
.m8{
	top:354px;
	left:217px;
}
.m9{
	top:354px;
	left:434px;
}

.pyoruruDiv{
	position:fixed;
	width:600px;
	height:auto;
	top:80px;
	left:calc(50vw - 300px);
	z-index:150;
	/*display:none;*/
}
.pyoruruDiv img{
	width:600px;
	height:auto:
}
.keibuDiv{
	position:fixed;
	width:700px;
	height:auto;
	top:80px;
	left:calc(50vw - 350px);
	z-index:151;
	display:none;
}
.keibuDiv img{
	width:700px;
	height:auto:
}
.nekopyDiv1{
	position: absolute;
	top:500px;  /*570*/
	left: 670px;
	/*left: 400px;
	left: 530px;
	left: 390px;
	left: 350px;
	left: 410px;
	left: 410px;
	left: 510px;
	left: 570px;
	left: 540px;
	left: 530px;
	left: 410px;
	left: 440px;
	left: 590px;
	left: 720px;
	left: 600px;
	left: 330px;
	left: 330px;
	left: 540px;
	left: 520px;*/
	
	/*left: 340px;*/
	
	height:110px;
	width:auto;
	z-index:151;
	display:none;
}
.nekopyDiv1 img{
	height:110px;
	width:auto;
}
.nekopyDiv2{
	position: absolute;
	top:470px;
	left: 300px;
	height:144px;
	width:auto;
	z-index:152;
	display:none;
}
.nekopyDiv2 img{
	height:144px;
	width:auto;
}
.nekopyDiv3{
	position: absolute;
	top:500px;
	left: 300px;
	height:110px;
	width:auto;
	z-index:153;
	display:none;
}
.nekopyDiv3 img{
	height:110px;
	width:auto;
}
.patostart_str{
	position: absolute;
	top:610px;
	left: -50px;
	width:751px;
	text-align:center;
	font-size:20px;
	display:none;
}



/*-------------------*/

.controll_updn,.controll_lr{
	position: absolute;
	list-style: none;
	width:100px;
	height: 100px;
	bottom:220px;
	right:-144px;
	display:none;
}
.controll_lr{
	bottom:220px;
}
.controll_lr li:first-child{
	float: left;
	width:50px;
    height:100px;
    border-radius:50px 0 0 50px;
	box-sizing: border-box;
    background:#7CEDB8;
	border: 2px solid #39BF8F;
	border-right: 1px solid #39BF8F;
	font-size: 30px;
	text-align: center;
	color: #267821;
	padding-top: 36px;
	cursor: pointer;
}
.controll_lr li:last-child{
	float: left;
	width:50px;
    height:100px;
    border-radius:0 50px 50px 0;
	box-sizing: border-box;
    background:#7CEDB8;
	border: 2px solid #39BF8F;
	border-left: 1px solid #39BF8F;
	font-size: 30px;
	text-align: center;
	color: #267821;
	padding-top: 36px;
	cursor: pointer;
}
.controll_updn li:first-child{
	width:100px;
    height:50px;
    border-radius:50px 50px 0 0;
	box-sizing: border-box;
    background:#7CEDB8;
	border: 2px solid #39BF8F;
	border-bottom: 1px solid #39BF8F;
	font-size: 30px;
	text-align: center;
	color: #267821;
	padding-top: 12px;
	cursor: pointer;
}
.controll_updn li:last-child{
	width:100px;
    height:50px;
    border-radius:0 0 50px 50px;
	box-sizing: border-box;
    background:#7CEDB8;
	border: 2px solid #39BF8F;
	border-top: 1px solid #39BF8F;
	font-size: 30px;
	text-align: center;
	color: #267821;
	padding-top: 12px;
	cursor: pointer;
}
.controll_updn li:first-child:hover,.controll_updn li:last-child:hover,.controll_lr li:first-child:hover,.controll_lr li:last-child:hover{
	background:#FCDB57;
}
.controll_updn2{
	position: absolute;
	list-style: none;
	width:100px;
	height: 100px;
	bottom:220px;
	right:-144px;
	display:none;
}

.controll_updn2{
	width:100px;
    height:100px;
    border-radius:50px;
	box-sizing: border-box;
	
}
.controll_updn2 li{
	width:100px;
    height:100px;
    display:block;
    background:#7CEDB8;
	border: 2px solid #39BF8F;
    border-radius:50px;
	box-sizing: border-box;
	font-size: 30px;
	text-align: center;
	color: #267821;
	padding-top: 36px;
	cursor: pointer;
}
.controll_updn2 li:hover{
	background:#FCDB57;
}




/*-------------------*/

.game_menuUl{
	list-style: none;
	/*width:660px;*/
	width:443px;
	height: auto;
	margin-top: 36px;
	margin-left: calc(50vw - 221px);
	/*margin-left: calc(50vw - 330px);*/
}
.game_menuUl li{
	float: left;
	width: 220px;
	height: 30px;
	font-size: 16px;
	line-height: 16px;
	padding-top: 8px;
	text-align: center;
	margin-right: 3px;
	background-color:#787878;
	color: #FFFFFF;
	box-sizing: border-box;
	cursor: pointer;
}
.game_menuUl li a{
	color: #FFFFFF;
}
.game_menuUl li p{
	font-size: 13px;
}
.game_menuUl li:nth-child(2){
	margin-right: 0px;
	background-color: #FFAD00;
	border-radius: 0 30px 30px 0;
	cursor: auto;
}
.game_menuUl li:nth-child(1){
	cursor: pointer;
	border-radius: 30px 0 0 30px;
}

/*-------------*/

/*-------- bns ---------*/

.bnUl{
	/*position: fixed;
	top:520px;
	left: calc(50vw + 500px + 0px);
	list-style: none;*/
	position: absolute;
	top:420px;
	right: -280px;
	list-style: none;
}

.bn_start,.bn_next{
    width:100px;
	height: 100px;
	margin-left: 16px;
	margin-top: 3px;
	border: 2px solid #A0BA29;
	border-radius: 10px;
	/*background-color: #83AA3F;*/  /* 深緑 */
	/*background-color: #8FFF97;*/   /*明るい緑*/
	color: #FFFFFF;
	text-align: center;
	font-size: 20px;
	line-height: 30px;
	font-weight: bold;
	box-sizing: border-box;
	cursor: auto;
	
	padding-top: 30px;
	background-color:#C9C9C9;
	border: 2px solid #959595;
	
	/*background-color: #FFC000;*/  /*orange*/
    /*border:2px solid #876A06;*/
}
.bn_next{
	padding-top: 16px;
}
/*
.bn_start{
	background-color: #FFC000;
    border:2px solid #876A06;
	cursor: pointer;
}
*/
.bn_tauchIn{
    background-color: #83AA3F;  /* 深緑 */
	cursor: pointer;
	visibility: hidden; /*visible*/
}
.bn_clear{
	padding-top: 32px;
	cursor: pointer;
}

/*---------score--------*/
.scoreDiv{
	position: absolute;
	top:0px;
	left:4px;
	list-style: none;
}
.scoreDiv li{
	width: 160px;
	height: 160px;
	border-radius: 80px;
	background-color: #67C2DD;
	margin-bottom: 10px;
	text-align: center;
	font-size: 18px;
	color: #ffffff;
	padding-top: 28px;
	box-sizing: border-box;
	font-weight: bold;
}
.scoreDiv li p{
	font-size: 36px;
	margin-top: 18px;
}
.score_ten{
	
}

/*-------level---------*/

.levelUl{
	position: absolute;
	bottom:-20px;
	right:140px;
	list-style: none;
}
.levelUl li{
	float: left;
	width:120px;
	height: auto;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 16px;
	line-height: 16px;
	text-align: center;
	font-weight: bold;
	
	color: #ffffff;
	margin-right: 6px;
	border-radius: 30px;
	cursor: pointer;
}
.bn_level2,.bn_level3{
	background-color: #67C2DD;
}
.bn_level1{
	background-color: #FFC000;
}


/*-----------game1-----------*/
.face{
	position: relative;
	width: 660px;
	height: auto;
	margin-left: 70px;
	margin-top: 40px;
	
}
.face img{
	width: 660px;
	height: auto;
	
}
.point{
	display: none;
}
.point1{
	position: absolute;
	top:190px;
	left: 90px;
}
.point2{
	position: absolute;
	top:220px;
	left: 160px;
}
.point3{
	position: absolute;
	top:200px;
	left: 230px;
}
.point4{
	position: absolute;
	top:240px;
	left: 290px;
}
.point5{
	position: absolute;
	top:200px;
	left: 360px;
}
.point6{
	position: absolute;
	top:270px;
	left: 410px;
}
.point7{
	position: absolute;
	top:190px;
	left: 480px;
}
.point8{
	position: absolute;
	top:250px;
	left: 530px;
}
.point9{
	position: absolute;
	top:300px;
	left: 100px;
}
.point10{
	position: absolute;
	top:340px;
	left: 180px;
}
.point11{
	position: absolute;
	top:330px;
	left: 270px;
}
.point12{
	position: absolute;
	top:340px;
	left: 380px;
}
.point13{
	position: absolute;
	top:330px;
	left: 490px;
}
.kin1,.kin2,.kin3,.kin4,.kin5,.kin6,.kin7,.kin8,.kin9,.kin10,.kin11,.kin12,.kin13{
	position: absolute;
	top:0px;
	left: 0px;
	width: 60px;
	height: 60px;
	display: block;
	/*border: 1px solid #000000;
	cursor: pointer;*/
	/*visibility: visible*/
}
/*.kin1a,.kin1b,.kin2a,.kin2b,.kin3a,.kin3b,.kin4a,.kin4b,.kin5a,.kin5b,.kin6a,.kin6b,.kin7a,.kin7b,.kin8a,.kin8b,.kin9a,.kin9b,.kin10a,.kin10b,.kin11a,.kin11b,.kin12a,.kin12b,.kin13a,.kin13b{*/
	
.kin_a{
	position: absolute;
	top:0px;
	left: 0px;
	width: 60px;
	height: auto;
}
.kin1b{
	top:0px;
}
/*.kin1a img,.kin1b img,.kin2a img,.kin2b img,.kin3a img,.kin3b img,.kin4a img,.kin4b img,.kin5a img,.kin5b img,.kin6a img,.kin6b img,.kin7a img,.kin7b img,.kin8a img,.kin8b img,.kin9a img,.kin9b img,.kin10a img,.kin10b img,.kin11a img,.kin11b img,.kin12a img,.kin12b img,.kin13a img,.kin13b img{*/
.kin_a img,.kin_b img{
	position: absolute;
	width: 60px;
	height: auto;
}
/*.kin1d,.kin1c,.kin2d,.kin2c,.kin3d,.kin3c,.kin4d,.kin4c,.kin5d,.kin5c,.kin6d,.kin6c,.kin7d,.kin7c,.kin8d,.kin8c,.kin9d,.kin9c,.kin10d,.kin10c,.kin11d,.kin11c,.kin12d,.kin12c,.kin13d,.kin13e{*/
.kin_d,.kin_c{
	position: absolute;
	top:-24px;
	left: -18px;
	width: 60px;
	height: auto;
}
/*.kin1c,.kin2c,.kin3c,.kin4c,.kin5c,.kin6c,.kin7c,.kin8c,.kin9c,.kin10c,.kin11c,.kin12c,.kin13c{*/
.kin_c{
	left: -5px;
	top:-24px;
}
/*.kin1d img,.kin1c img,.kin2d img,.kin2c img,.kin3d img,.kin3c img,.kin4d img,.kin4c img,.kin5d img,.kin5c img,.kin6d img,.kin6c img,.kin7d img,.kin7c img,.kin8d img,.kin8c img,.kin9d img,.kin9c img,.kin10d img,.kin10c img,.kin11d img,.kin11c img,.kin12d img,.kin12c img,.kin13d img,.kin13c img{*/
.kin_d img,.kin_c img{
	position: absolute;
	width: 80px;
	height: auto;
}
.ana{
	position: absolute;
	width:44px;
	height: auto;
	display: none;
}
.ana img{
	width:44px;
	height: auto;
}
.ana1{
	top:230px;
	left: 97px;
}
.ana2{
	top:260px;
	left: 167px;
}
.ana3{
	top:240px;
	left: 237px;
}
.ana4{
	top:280px;
	left: 297px;
}
.ana5{
	top:240px;
	left: 367px;
}
.ana6{
	top:310px;
	left: 417px;
}
.ana7{
	top:230px;
	left: 487px;
}
.ana8{
	top:290px;
	left: 537px;
}
.ana9{
	top:340px;
	left: 107px;
}
.ana10{
	top:380px;
	left: 187px;
}
.ana11{
	top:370px;
	left: 277px;
}
.ana12{
	top:380px;
	left: 387px;
}
.ana13{
	top:370px;
	left: 497px;
}


/*--------timer---------*/
.timerDiv{
	position: absolute;
	right: 10px;
	bottom:10px;
	color: #67C2DD;
	
}
.timerDiv p{
	float: left;
	margin-right: 10px;
	font-size: 24px;
	line-height: 24px;
	font-weight: bold;
}
.timerLine1{
	float: left;
	width:300px;
	height: 24px;
	border: 1px solid #67C2DD;
	
}
.timerLine2{
	width:0%;
	height: 24px;
	background-color: #67C2DD;
}

.maruUl{
	position:absolute;
	top:0px;
	left:-160px;
	list-style:none;
	width:40px;
	height:auto;
}
.maruUl li{
	width:30px;
	height:30px;
	margin-bottom:5px;
	border-radius: 20px;
	border:1px solid #333333;
	background-color:#ffffff;
}
/*------*/
.firstTimrUl{
	position:absolute;
	top:0px;
	left:680px;
	list-style:none;
}
.firstTimrUl li{
	width:120px;
	height:auto;
	margin-top:5px;
	border-radius: 6px;
	color:#FFFFFF;
	text-align:center;
	box-sizing: border-box;
}
.firstTimrUl li:first-child{
	font-size:14px;
	color:#333333;
}
.firstTimr2,.firstTimr3,.firstTimr5,.firstTimr6{
	background-color: #67C2DD;
	font-size:20px;
	padding-top:6px;
	padding-bottom:6px;
	cursor:pointer;
}
.firstTimr4{
	background-color: #FFC000;
	font-size:20px;
	padding-top:6px;
	padding-bottom:6px;
	cursor:auto;;
}
.firstTimr1{
	background-color: none;
	font-size:16px;
}


/* スコアキャラ表示.ここから---- */
.score_chara{
	position: fixed;
	top:140px;
	left:calc(50% - 160px);
	display: none;
	z-index:210;
}
.score_cgaraBg{
	width:360px;
	height: 360px;
	background-color: #000000;
	border-radius: 180px;
	opacity: 0.3;
}
.chara_main{
	position: absolute;
	top:30px;
	left:40px;
	height:auto;
	width: 290px;
}
.chara_main img{
	height:auto;
	width: 290px;
}
.chara_fuki{
	position: absolute;
	top:0px;
	right:-140px;
	height: 160px;
	width:auto;
}
.chara_fuki img{
	height: 160px;
	width:auto;
}
/* スコアキャラ表示.ここまで---- */