@charset "UTF-8";

/**
 *	
 *	Apply Style： game
 *	Style Name： /css/game/kentei.css
 *	
 */
/*------------------------------------------
 *	section,共通タイトル
------------------------------------------*/
.section {
	padding:50px 25px 58px 25px;	
}

.section .sec-ttl {
	margin:0 0 24px 0;	
}

.section .contents-ttl {
	margin:0 0 20px 0;	
}

/*------------------------------------------
 *	sec-kentei
------------------------------------------*/
.sec-kentei .kentei {
	width: 764px;
	min-height: 580px;
	padding: 35px 67px 0 67px;
	margin-bottom: 40px;
	background: url(/resonya/imgs/game/kentei/bg_kentei.png) center center repeat-y;
	border-radius: 10px;
	overflow: hidden;
	position: relative;
}

.sec-kentei .kentei > span {
	width: 764px;
	min-height: 435px;
	padding-bottom: 30px;
	margin-bottom: 40px;
	background: #fafafa;
	border-radius: 8px;
	box-shadow: 0 0 0 10px rgba(206, 206, 206, 1);
	position: relative;
	display: block;
}
.sec-kentei .kentei span:before {
	content: '';
	width: 100%;
	height: 100%;
	margin: auto;
	border: solid 1px #aaa;
	border-radius: 12px;
	position: absolute;
	top: -1px;
	left: -1px;
	pointer-events: none;
}
.sec-kentei .kentei h4 {
	margin: 0 auto 100px auto;
	padding-top: 65px;
	font-size: 32px;
	text-align: center;
}
.sec-kentei .kentei .btn_start {
	width: 240px;
	height: 50px;
	margin: 0 auto;
	display: block;
}
.sec-kentei .kentei .btn_start a {
	width: 200px;
	height: 30px;
	padding: 10px 20px;
	text-decoration: none;
	color: #ed6d34;
	font-size: 22px;
	font-weight: bold;
	line-height: 22px;
	border: solid 2px #ed6d34;
	border-radius: 34px;
	display: flex;
	justify-content: center;
	align-items: center;
}
_:-ms-lang(x)::-ms-backdrop, .sec-kentei .kentei .btn_start a {
	padding: 13px 20px 7px 20px;
}
.sec-kentei .kentei .btn_start a:hover {
	color: #fff;
	background: #ed6d34;
}
.sec-kentei .kentei .question {
	padding: 30px 30px 0 30px;
	display: none;
}
.sec-kentei .kentei .question mark {
	margin-bottom: 15px;
	font-size: 26px;
	font-weight: bold;
	display: block;
}
.sec-kentei .kentei .question mark var {
	font-style: normal;
}
.sec-kentei .kentei .question p {
	font-size: 18px;
	line-height: 130%;
}
.sec-kentei .kentei .question .qimg,
.sec-kentei .kentei .question .qimg_priv {
	margin-top: 15px;
	text-align: center;
}
.sec-kentei .kentei .choice {
	margin: 0 30px;
	position: relative;
	z-index: 5;
	display: none;
}
.sec-kentei .kentei .choice ol {
	margin: 25px 120px 30px 120px;
	padding: 0;
	list-style: none;
}
.sec-kentei .kentei .choice ol li {
	margin-bottom: 15px;
	padding: 10px 20px;
	color: #ed6d34;
	font-size: 20px;
	font-weight: bold;
	border: solid 2px #ed6d34;
	border-radius: 24px;
	background: #fff;
	display: flex;
}
_:-ms-lang(x)::-ms-backdrop, .sec-kentei .kentei .choice ol li {
	padding: 14px 20px 6px 20px;
}
.sec-kentei .kentei .choice ol li:hover {
	color: #fff;
	background: #ed6d34;
	cursor: pointer;
}
.sec-kentei .kentei .choice ol li:nth-of-type(1):before {
	content: '1.　';
}
.sec-kentei .kentei .choice ol li:nth-of-type(2):before {
	content: '2.　';
}
.sec-kentei .kentei .choice ol li:nth-of-type(3):before {
	content: '3.　';
}
.sec-kentei .kentei .choice ol li .cimg {
	margin: 5px auto;
	text-align: center;
}
.sec-kentei .kentei .choice ol li .aimg {
	display: none;
}
.sec-kentei .kentei .answer {
	margin: 0 30px;
	display: none;
}
.sec-kentei .kentei .answer strong {
	width: auto;
	padding: 20px 0 30px 40px;
	font-size: 40px;
	font-weight: bold;
	text-align: center;
	display: block;
}
.sec-kentei .kentei .answer strong.correct {
	background: url(/resonya/imgs/game/kentei/ico_correct.png) 220px 0 no-repeat;
	background-size: auto 80px;
}
_:-ms-lang(x)::-ms-backdrop, .sec-kentei .kentei .answer strong.correct {
	background-size: auto 75px;
}
.sec-kentei .kentei .answer strong.incorrect {
	background: url(/resonya/imgs/game/kentei/ico_incorrect.png) 225px 0 no-repeat;
	background-size: auto 60px;
}
_:-ms-lang(x)::-ms-backdrop, .sec-kentei .kentei .answer strong.incorrect {
	background-size: auto 55px;
}
.sec-kentei .kentei .answer dl {
	margin: 0 80px 15px 0;
	display: flex;
	align-items: center;
}
.sec-kentei .kentei .answer dl dt {
	min-width: 54px;
	margin-right: 10px;
	font-size: 18px;
}
.sec-kentei .kentei .answer dl dd {
	font-size: 22px;
	font-weight: bold;
}
.sec-kentei .kentei .answer dl dd .cimg {
	margin: 0 auto 0 10px;
	text-align: left;
	display: inline-block;
	vertical-align: middle;
}
.sec-kentei .kentei .answer dl dd .aimg {
	margin: 10px auto 0 0;
	text-align: left;
}
.sec-kentei .kentei .answer p {
	margin: 0 82px 28px 0;
	padding: 9px 13px 9px 13px;
	color: #009e51;
	font-weight: bold;
	font-size: 17px;
	line-height: 130%;
	background: #fff;
	border: solid 2px #009e51;
	box-shadow: 3px 3px 0px 0px rgba(232,221,207,1);
	border-radius: 12px;
}
_:-ms-lang(x)::-ms-backdrop, .sec-kentei .kentei .answer p {
	padding: 12px 100px 6px 13px;
}
.sec-kentei .kentei .answer ul {
	width: 17.5em;
	margin: 0 auto;
	display: flex;
	justify-content: space-around;
}
.sec-kentei .kentei .answer ul.end_quiz {
	width: 18.5em;
}
.sec-kentei .kentei .answer ul li {
	padding: 8px 12px;
	color: #fff;
	font-size: 17px;
	font-weight: bold;
	background: #ed6d35;
	border: solid 2px #ed6d34;
	border-radius: 21px;
	position: relative;
	z-index: 5;
	display: inline-block;
}
_:-ms-lang(x)::-ms-backdrop, .sec-kentei .kentei .answer ul li {
	padding: 11px 12px 5px 12px;
}
.sec-kentei .kentei .answer ul li:hover {
	color: #ed6d35;
	background: #fff;
	cursor: pointer;
}
.sec-kentei .kentei .answer ul li.disable {
	display: none;
}
.sec-kentei .kentei figure {
	height: auto;
	position: absolute;
	bottom: 13px;
	z-index: 3;
}
.sec-kentei .kentei figure img {
	display: block;
}
/**level1**/
.sec-kentei .kentei figure.level1char0 {
	width: 300px;
	right: 26px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char1 {
	width: 240px;
	right: 2px;
}
.sec-kentei .kentei figure.level1char2 {
	width: 170px;
	right: 50px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char3 {
	width: 235px;
	right: 0;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char4 {
	width: 220px;
	right: 7px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char5 {
	width: 300px;
	right: 10px;
	bottom: 5px;
}
.sec-kentei .kentei figure.level1char6 {
	width: 180px;
	right: 24px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char7 {
	width: 160px;
	right: 10px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char8 {
	width: 166px;
	right: 8px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char9 {
	width: 260px;
	right: 10px;
	bottom: 6px;
}
.sec-kentei .kentei figure.level1char10 {
	width: 180px;
	right: 2px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char11 {
	width: 280px;
	right: 0;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char12 {
	width: 305px;
	right: 2px;
	bottom: 1px;
}
.sec-kentei .kentei figure.level1char13 {
	width: 160px;
	right: 20px;
	bottom: 30px;
}
.sec-kentei .kentei figure.level1char14 {
	width: 170px;
	right: 3px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char15 {
	width: 194px;
	right: 6px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char16 {
	width: 220px;
	right: 5px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char17 {
	width: 170px;
	right: 35px;
	bottom: 30px;
}
.sec-kentei .kentei figure.level1char18 {
	width: 238px;
	right: 4px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char19 {
	width: 200px;
	right: 6px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char20 {
	width: 208px;
	right: 3px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char21 {
	width: 160px;
	right: 10px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char22 {
	width: 160px;
	right: 20px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char23 {
	width: 130px;
	right: 46px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char24 {
	width: 220px;
	right: 3px;
	bottom: 60px;
}
.sec-kentei .kentei figure.level1char25 {
	width: 160px;
	right: 9px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char26 {
	width: 180px;
	right: 38px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char27 {
	width: 230px;
	right: 2px;
}
.sec-kentei .kentei figure.level1char28 {
	width: 160px;
	right: 19px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char29 {
	width: 220px;
	right: 58px;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char30 {
	width: 320px;
	right: 4px;
	bottom: 50px;
}
/**level2**/
.sec-kentei .kentei figure.level2char0 {
	width: 300px;
	right: 26px;
	bottom: 0;
}
.sec-kentei .kentei figure.level2char1 {
	width: 150px;
	right: 2px;
	bottom: 10px;
}
.sec-kentei .kentei figure.level2char2 {
	width: 170px;
	right: 20px;
	bottom: 0;
}
.sec-kentei .kentei figure.level2char3 {
	width: 140px;
	right: 20px;
	bottom: 0;
}
.sec-kentei .kentei figure.level2char4 {
	width: 160px;
	right: 10px;
	bottom: 0;
}
.sec-kentei .kentei figure.level2char5 {
	width: 340px;
	right: 10px;
	bottom: 10px;
}
.sec-kentei .kentei figure.level2char6 {
	width: 200px;
	right: 20px;
	bottom: 0;
}
.sec-kentei .kentei figure.level2char7 {
	width: 240px;
	right: 10px;
	bottom: 6px;
}
.sec-kentei .kentei figure.level2char8 {
	width: 190px;
	right: 10px;
	bottom: 0;
}
.sec-kentei .kentei figure.level2char9 {
	width: 260px;
	right: 3px;
	bottom: 45px;
}
.sec-kentei .kentei figure.level2char10 {
	width: 200px;
	right: 20px;
	bottom: 10px;
}
.sec-kentei .kentei figure.level2char11 {
	width: 150px;
	right: 20px;
	bottom: 0;
}
.sec-kentei .kentei figure.level2char12 {
	width: 160px;
	right: 20px;
	bottom: 10px;
}
.sec-kentei .kentei figure.level2char13 {
	width: 230px;
	right: 20px;
	bottom: 0;
}
.sec-kentei .kentei figure.level2char14 {
	width: 160px;
	right: 20px;
	bottom: 0;
}
.sec-kentei .kentei figure.level2char15 {
	width: 220px;
	right: 5px;
	bottom: 0;
}
.sec-kentei .kentei figure.level2char16 {
	width: 140px;
	right: 10px;
	bottom: 0;
}
.sec-kentei .kentei figure.level2char17 {
	width: 290px;
	right: 20px;
	bottom: 10px;
}
.sec-kentei .kentei figure.level2char18 {
	width: 150px;
	right: 15px;
	bottom: 0;
}

.sec-kentei .kentei figure.level2char19 {
	width: 190px;
	right: 10px;
	bottom: 0;
}

.sec-kentei .kentei .error {
	margin-top: 140px;
	color: #e55532;
	font-size: 16px;
	text-align: center;
	line-height: 150%;
}

/**
 *	
 *	レスポンシブスタイル
 *	
 */

@media all and (max-width: 767px) {
/*------------------------------------------
 *	section,共通タイトル
------------------------------------------*/
.section {
	padding:25px 10px 40px 10px;	
}

.section .sec-ttl {
	margin:0 0 24px 0;	
}

.section .contents-ttl {
	margin:0 0 25px 0;	
}
/*------------------------------------------
 *	sec-kentei
------------------------------------------*/
.sec-kentei .kentei {
	width: auto;
	height: auto;
	min-height: auto;
	padding: 18px;
	background-size: cover;
	border-radius: 10px;
}
.sec-kentei .kentei > span {
	width: calc(100vw - 86px);
	height: auto;
	min-height: auto;
	padding-bottom: 95px;
	margin-bottom: 150px;
	background: #fafafa;
	box-shadow: 0 0 0 7px rgba(206, 206, 206, 1);
	position: relative;
	top: 1px;
	left: 1px;
}
.sec-kentei .kentei h4 {
	margin: 0 auto 30px auto;
	padding-top: 25px;
	font-size: 20px;
	text-align: center;
	line-height: 130%;
}
@media all and (max-width: 320px) {
.sec-kentei .kentei h4 {
	font-size: 18px;
}
}
.sec-kentei .kentei .btn_start {
	width: 180px;
}
.sec-kentei .kentei .btn_start a {
	width: 140px;
	height: 20px;
	padding: 10px 20px;
	border-radius: 40px;
}
.sec-kentei .kentei .question mark {
	margin-bottom: 15px;
	font-size: 20px;
}
.sec-kentei .kentei .question p {
	font-size: 16px;
}
.sec-kentei .kentei .question .qimg img,
.sec-kentei .kentei .question .qimg_priv img {
	height: auto;
}
.sec-kentei .kentei .choice ol {
	margin: 25px 0 0 0;
	padding: 0;
}
.sec-kentei .kentei .choice ol li {
	margin-bottom: 10px;
	padding: 10px 20px;
	font-size: 18px;
	border-radius: 38px;
}
.sec-kentei .kentei .choice ol > li:last-child {
	margin-bottom: 0;
}
.sec-kentei .kentei .answer {
	margin-bottom: 0;
}
.sec-kentei .kentei .answer strong {
	margin: 0 auto 25px auto;
	padding: 5px 0 5px 1.4em;
	font-size: 32px;
	display: block;
}
.sec-kentei .kentei .answer strong.correct {
	width: 3em;
	background: url(/resonya/imgs/game/kentei/ico_correct.png) 0 0 no-repeat;
	background-size: auto 39px;
}
.sec-kentei .kentei .answer strong.incorrect {
	width: 4em;
	background: url(/resonya/imgs/game/kentei/ico_incorrect.png) 0 0 no-repeat;
	background-size: auto 39px;
}
@media screen and (min-width: 393px) and (max-width: 393px) {
.sec-kentei .kentei .answer strong.correct {
	background-size: auto 36px;
}
.sec-kentei .kentei .answer strong.incorrect {
	background-size: auto 36px;
}
}
.sec-kentei .kentei .answer dl {
	margin: 0 0 15px 0;
	align-items: flex-start;
}
.sec-kentei .kentei .answer dl dt {
	min-width: 3em;
	padding-top: 0.15em;
	font-size: 16px;
}
.sec-kentei .kentei .answer dl dd {
	width: auto;
	font-size: 20px;
	line-height: 24px;
}
.sec-kentei .kentei .answer dl dd .cimg {
	margin: 10px auto 0 0;
	display: block;
}
.sec-kentei .kentei .answer dl dd .cimg img,
.sec-kentei .kentei .answer dl dd .aimg img {
	height: auto;
}
.sec-kentei .kentei .answer p {
	margin: 0 0 25px 0;
	padding: 7px 11px;
	font-size: 15px;
}
.sec-kentei .kentei .answer ul {
	width: auto;
	flex-direction: column-reverse;
}
.sec-kentei .kentei .answer ul.end_quiz {
	width: auto;
}
.sec-kentei .kentei .answer ul li {
	padding: 8px 12px;
	color: #fff;
	font-size: 15px;
	border-radius: 19px;
	text-align: center;
}
.sec-kentei .kentei .answer ul > li:last-child {
	margin-bottom: 10px;
}
.sec-kentei .kentei figure {
	margin: auto;
}
.sec-kentei .kentei figure img {
	width: auto;
	height: 100%;
	margin: 0 auto;
}
/**level1**/
.sec-kentei .kentei figure.level1char0 {
	width: auto;
	height: 236px;
	right: 0;
	left: 12vw;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char1,
.sec-kentei .kentei figure.level1char2,
.sec-kentei .kentei figure.level1char4,
.sec-kentei .kentei figure.level1char6,
.sec-kentei .kentei figure.level1char7,
.sec-kentei .kentei figure.level1char8,
.sec-kentei .kentei figure.level1char10,
.sec-kentei .kentei figure.level1char14,
.sec-kentei .kentei figure.level1char15,
.sec-kentei .kentei figure.level1char16,
.sec-kentei .kentei figure.level1char18,
.sec-kentei .kentei figure.level1char19,
.sec-kentei .kentei figure.level1char20,
.sec-kentei .kentei figure.level1char21,
.sec-kentei .kentei figure.level1char23,
.sec-kentei .kentei figure.level1char25,
.sec-kentei .kentei figure.level1char26,
.sec-kentei .kentei figure.level1char27,
.sec-kentei .kentei figure.level1char28,
.sec-kentei .kentei figure.level1char29 {
	width: auto;
	height: 243px;
	right: 0;
	left: 0;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char3,
.sec-kentei .kentei figure.level1char5,
.sec-kentei .kentei figure.level1char12 {
	width: auto;
	height: 217px;
	right: 0;
	left: 0;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char9,
.sec-kentei .kentei figure.level1char22 {
	width: auto;
	height: 224px;
	right: 0;
	left: 0;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char11 {
	width: auto;
	height: 204px;
	right: 0;
	left: 0;
	bottom: 0;
}
.sec-kentei .kentei figure.level1char13,
.sec-kentei .kentei figure.level1char30 {
	width: auto;
	height: 172px;
	right: 0;
	left: 0;
	bottom: 50px;
}
.sec-kentei .kentei figure.level1char17 {
	width: auto;
	height: 179px;
	right: 0;
	left: 0;
	bottom: 40px;
}
.sec-kentei .kentei figure.level1char24 {
	width: auto;
	height: 172px;
	margin-left: 10vw;
	right: 0;
	left: 0;
	bottom: 50px;
}
/**level2**/
.sec-kentei .kentei figure.level2char0 {
	width: auto;
	height: 236px;
	right: 0;
	left: 12vw;
	bottom: 0;
}
.sec-kentei .kentei figure.level2char1,
.sec-kentei .kentei figure.level2char2,
.sec-kentei .kentei figure.level2char3,
.sec-kentei .kentei figure.level2char4,
.sec-kentei .kentei figure.level2char5,
.sec-kentei .kentei figure.level2char6,
.sec-kentei .kentei figure.level2char7,
.sec-kentei .kentei figure.level2char8,
.sec-kentei .kentei figure.level2char10,
.sec-kentei .kentei figure.level2char11,
.sec-kentei .kentei figure.level2char12,
.sec-kentei .kentei figure.level2char13,
.sec-kentei .kentei figure.level2char14,
.sec-kentei .kentei figure.level2char15,
.sec-kentei .kentei figure.level2char16,
.sec-kentei .kentei figure.level2char17,
.sec-kentei .kentei figure.level2char18,
.sec-kentei .kentei figure.level2char19 {
	width: auto;
	height: 243px;
	right: 0;
	left: 0;
	bottom: 0;
}
.sec-kentei .kentei figure.level2char1 {
	height: 200px;
	left: 40px;
	bottom: 20px;
}
.sec-kentei .kentei figure.level2char3 {
	height: 230px;
	bottom: 10px;
	left: 35px;
}
.sec-kentei .kentei figure.level2char4,
.sec-kentei .kentei figure.level2char11,
.sec-kentei .kentei figure.level2char14 {
	left: -20px;
}
.sec-kentei .kentei figure.level2char5 {
	height: 220px;
	bottom: 10px;
}
.sec-kentei .kentei figure.level2char6 {
	height: 220px;
}
.sec-kentei .kentei figure.level2char8 {
	left: 35px;
}
.sec-kentei .kentei figure.level2char9 {
	height: 172px;
	left: 0;
	bottom: 40px;
}
.sec-kentei .kentei figure.level2char10 {
	height: 220px;
	bottom: 10px;
}
.sec-kentei .kentei figure.level2char12 {
	height: 230px;
}
.sec-kentei .kentei figure.level2char15 {
	left: 40px;
}
.sec-kentei .kentei figure.level2char16 {
	height: 250px;
	left: 20px;
}
.sec-kentei .kentei figure.level2char17 {
	height: 230px;
	bottom: 10px;
}
.sec-kentei .kentei figure.level2char18 {
	left: 40px;
}

}