html{
    font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
    font-size: 625%;
    background-color: #e8e8e8;
	overflow: hidden;
}

body{
	font-size: .16rem;
	font-size: 15px;
	max-width: 765px;
	/* height: 100vh; */
	/* min-height: 300px;  スマホ横向きでもフッターまで入るようにするためコメントアウト */ 
	margin: auto;
	background-color: #FFF;
	box-sizing: border-box;
	user-select: none;
	-ms-user-select: none;
	-webkit-user-select: none;
	position: relative;
	overflow: hidden;
}

/*-- 強調 --*/
em{
 /*  color: #f7522b; */
   font-style: normal;
   font-weight: bold;
 /*  background: linear-gradient(transparent 80%, #fec285 80%); */
}
strong{
   font-weight: bold;
   color: #fe2523;
}
input{
	cursor:pointer;
    padding: 3px;
    outline: none;
}

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    font-size: 80%;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
    font-size: 80%;
}
::placeholder{ /* Others */
    font-size: 80%;
}

label{
	cursor:pointer;
}


button{
	cursor:pointer;
}


th{
	cursor:pointer;
}

td{
	cursor:pointer;
}

/* ********** ヘッダー ********** */

.header {
    color: #FFF;
	/* font-size: .20rem; */
	font-size: .14rem;
    /* font-weight: bold; */
    margin: 0;
    padding: 3px 12px;
    background-color: #fe9223;
    overflow: hidden;
}

.title_text {
	/* width: 70%; */
	float: left;
	margin-top: 3px;
}

.header_btn {
	width: 100px;
	height: 30px;
	margin-left: 1%;
	padding: 2px 0 0 0;
	border: none;
	border-radius: 16px;
	background-color: #fe9223;
	color: #FFF;
	font-size: 0.15rem;
  /* font-weight: bold; */
	float: right;
	min-width:45px;
	position:relative;
	border: 2px solid #fff;
}

.header_btn:focus {
  outline: 0;
}

@media screen and (max-width: 480px) {  /*--スマートフォン--*/
.header_btn {
 width: 90px;
 font-size: 0.14rem;
}
}
@media only screen and (max-width:350px) { /* iPhone SE */
.header_btn {	
 width: 72px;
 font-size: 0.13rem;
}
}
/*
.header_btn:hover {
    background-color: #feaf5e;
}
*/
.header_btn:active {
    background-color: #fe850a;
}

#house{
	/* position: absolute;
	width: auto;
	height: 90%;
	left: 30%;
	top: 5%; */
	position:relative;
	width: 28px;
	height: 21px;
	margin:0 auto;
}

/*----- 体験版ロゴ ----*/
.taiken {
	margin: 0!important;
	height: 25px;
	padding: 3px 10px 0px 10px;
}

img.taiken_img{
	margin: 0;
	width: 84px;
	height: 25px;
	float: right;
}
.clear{
	clear:both;
}

/*----------*/
/* ********** シーン ********** */

#direction{
 /* display:none;*/
	display:block; /* 200811修正：画像が表示されない問題に対処 */
    overflow:auto;
	/*max-height:84vh;*/
}
#direction>div{
    margin: 2%;
}

#main {
    display:none;
	overflow:auto;
	/*max-height:84vh;*/
}

#main>div {
    margin: 2% 5.5%;
  /*  overflow:auto; */
  /*  margin: 20px; */
    margin-bottom: 180px;
}

@media screen and (max-width: 480px) {  /*--スマートフォン--*/
#main>div {
    margin: 10px;
	margin-bottom: 150px;
}
}

#correct{
	display:none;
	margin: 2%;
}


#incorrect{
	display:none;
	margin: 2%;
}

#answer{
	display:none;
    overflow: auto;
    /*margin: 2%;*/
}

#answer>div {
    margin: 2% 4%;
	margin-bottom: 40px;
}


#commentary{
	display:none;
	overflow:auto;
	/*max-height:86vh;*/
}

#commentary>div{
    margin: 2% 4%;
    margin-bottom: 60px;
}

@media screen and (max-width: 480px) {  /*--スマートフォン--*/
#answer>div {
    margin: 2%;
	margin-bottom: 40px;
}
}
/* ********** 問題 ********** */
#vmnaudio{
	border: none;
    width: 500px;
	max-width: 100%;
    height: 60px;
/* 	background-size: contain;
    background-position: center;
    background-color: #00AECF; */
/*    border-radius: 5px; */
    text-align: center;
    margin-bottom:10px;
}

#vmnaudio:focus{
  outline: 0;
}

@media screen and (max-width: 480px) {  /*--スマートフォン--*/
#vmnaudio{
   margin-bottom: 15px;
}
}

#sound_button{
	text-align:center;
}

.audio_btn {
    border: none;
    width: 80px;
    height: 30px;
	padding: 2px 6px;
    background: url("../images/sound.png") no-repeat;
    background-position: center;
    background-size: 17px;
    background-color: #fe9223;
    border-radius: 18px;
    text-align: center;
}
.audio_btn:focus {
    outline: 0;
}
/*
.audio_btn:hover {
    background-color: #feaf5e;
}
*/
.audio_btn:active {
    background-color: #fe850a;
}

.text_btn1 {
    border: none;
    width: 93px;
    height: 30px;
    background: url("../images/text1.png") no-repeat;
    background-size: contain;
    background-size: 42px;
    background-position: center;
    background-color: #fe9223;
    border-radius: 18px;
    text-align: center;
	margin: 1%;
}
.text_btn1:focus{
    outline: 0;
}

.text_btn2 {
    border: none;
    width: 93px;
    height: 30px;
    background: url("../images/text2.png") no-repeat;
    background-size: contain;
    background-size: 42px;
    background-position: center;
    background-color: #fe9223;
    border-radius: 18px;
    text-align: center;
	margin: 1%;
}

.text_btn2:focus{
    outline: 0;
}

.text_btn3 {
    border: none;
    width: 93px;
    height: 30px;
    background: url("../images/text3.png") no-repeat;
    background-size: contain;
    background-size: 42px;
    background-position: center;
    background-color: #fe9223;
    border-radius: 18px;
    text-align: center;
	margin: 1%;
}

.text_btn3:focus{
    outline: 0;
}

.on{
    background-color: #703901;
}


#toggle_img {
	display: flex;
}

#t_img {
	display: flex;
}

#tt_img {
	display: flex;
}


#circle_large,
#cross_large {
	width:auto;
	height: 80%;
	position:absolute;
	left:0;
	right:0;
	margin:auto;
	/* top:50px; */
	top: 30px;
}

/* 解説画面に出す選択肢 */
#circle_large_dummy,
#cross_large_dummy {
	width: auto;
	height: 100%;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	top: 0;
}

#true_false_box{
	position:relative;
	margin-top:0 !important;
}

#radio1_dummy:checked + .radio_A {
	background-image: url("../images/A_checked.png");
}

#radio2_dummy:checked + .radio_B {
	background-image: url("../images/B_checked.png");
}

#radio3_dummy:checked + .radio_C {
	background-image: url("../images/C_checked.png");
}

#radio4_dummy:checked + .radio_D {
	background-image: url("../images/D_checked.png");
}

img {
	display: block;
	width: 100%;
    margin: 0 auto;
}

#choice1,#choice2,#choice3,#choice4{
	margin:0;
}

#choice1_before,#choice2_before,#choice3_before,#choice4_before{
	margin:0;
}

#choice1_after,#choice2_after,#choice3_after,#choice4_after{
	margin:0;
}

/* ********** 選択肢 ********** */
#choice_wrapper {
	position: absolute;
	left: 0;
	width: 100%;
	transition: 0.5s;
}

#tab,
#com {
	width: 120px;
/*	height: 40px; */
    height: 30px;
	line-height: 40px;
	margin-right: 15%;
	/* border-bottom: solid 1px #fe9223; */
	border-radius: 10px 10px 0 0;
	background-color: #fe9223;
	color: #FFF;
	font-size: 0.16rem;
/*	font-weight: bold; */
	text-align: center;
	cursor: pointer;
	margin:0 30px 0 auto;
	vertical-align: middle;
}
/*--- タブの上下矢印の右余白 ---*/
.fa-arrows-alt-v {
    padding-right: 8px;
}

#comment{
   font-size: 0.15rem;
}

@media screen and (max-width: 480px) {  /*--スマートフォン--*/
#tab,
#com {
	width: 100px;
	height: 33px;
	font-size: 0.16rem;
	margin:0 15px 0 auto;	
}

#comment{
   font-size: 0.14rem;
}
}

#c_statement {
	display: none;
}

#choice_statement{
    border-top: solid 5px #fe9223;
    background-color: #f2eee5;
    padding: 0 2% 2%;
	/* max-height: 70vh; */
	max-height: 50vh; /*25.4vh;*/
	overflow-y: auto;
}

#commentary_statement {
    border-top: solid 5px #fe9223;
    background-color: #f2eee5;
    padding: 0 4.5% 4%;
	/* max-height: 70vh; */
	max-height: 50.4vh;
	overflow-y: auto;
}

div#commentary_statement div:last-child{
	margin-bottom: 15px;
}

div#commentary_statement table:last-child{
	margin-bottom: 15px;
}

/* div#commentary_statement img:last-child{
	margin-bottom:2%;
} */

#commentary_blank {
	height: 50.4vh;
	height: calc(50.4vh + 60px);
}

/* 解答エリアの画像サイズ調整 */
.img_tr{
	margin-bottom:2%;
	width: 60%;
}

table.tab{
	margin-top: 5px;
    margin-bottom: 20px;
    font-size: 0.15rem;
    border-collapse: collapse;

}

@media screen and (max-width: 480px) {  /*--スマートフォン--*/
table.tab {
    font-size: 0.14rem;
}
/* 解答エリアの画像サイズ調整 */
.img_tr{
	width: 98%;
}
}

.nar + .tab{
	margin-top:2%;
}

.texts + .tab{
	margin-top:2%;
}

.radio_input {
    width: 98%;
	cursor: pointer;
}

.radio_input:hover {
    background-color: rgba(254,232,223,0.70);
    transition: 0.2s;
	cursor: pointer;
}

input[type="radio"] {
	display: none;
}

.radio_A {
	display: inline-block;
	width:6%;
	height: inherit;
	background-image: url("../images/A.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

#radio1:checked + .radio_A {
	background-image: url("../images/A_checked.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

.radio_B {
	display: inline-block;
	width: 6%;
	height: inherit;
	background-image: url("../images/B.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

#radio2:checked + .radio_B {
	background-image: url("../images/B_checked.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

.radio_C {
	display: inline-block;
	width: 6%;
	height: inherit;
	background-image: url("../images/C.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}


#radio3:checked + .radio_C {
	background-image: url("../images/C_checked.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

.radio_D {
	display: inline-block;
	width: 6%;
	height: inherit;
	background-image: url("../images/D.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

#radio4:checked + .radio_D {
	background-image: url("../images/D_checked.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

.radio_text {
	display: inline-block;
	margin-left: 120%;
	width: 1100%;
	word-wrap: normal;
	font-size: 0.15rem;
	margin-top: 10px;
	margin-bottom: 10px;
}

/* #radio1:checked + label > p,
#radio2:checked + label > p,
#radio3:checked + label > p,
#radio4:checked + label > p {
    color: #F15A24;
} */

/* ********** リザルト（answer） ********** */

.result {
/*	height: 75vh; 
	margin-bottom: 5vh;
	overflow: auto; */
}

.score_wrapper {
/*	width: 40%; */
	width: 380px;
	margin-top: 10px;
	margin-bottom: 15px;
	margin-right: auto;
	margin-left: auto;
}

/* 試験結果の飾り枠*/
figure {
position: relative;
width: 360px;
margin: 0 0 20px 0;
}
/*
.disp_table {
	display: table;
	width: 100%;
	background-color: #efefef;
    border-radius: 8px;
}
*/

figure img {
  width: 100%;
  vertical-align: top;
}

figure figucation{
  position: absolute;
  top: -5px;
  display: flex;
  width: 100%;
/*  height: 100%; */
  margin: 0;
  align-items: center;
  justify-content: center;	
}

.disp_table {
	margin: 0 auto;
	width: 100%;
    display: table;
}
#score {
	text-align: center;
	font-size: 0.16rem;
	margin: 10px 0 0 0;
    /* font-weight: bold; */
    /* background-color: #6b8dcc; */
    /* color: #FFF; */
    background-color: #f2eee5;
    padding: 4px 5px;
    border-radius: 18px;
    text-align: center;
}

#maxquestion_text{
	display: table-cell;
	width: 12%;
/*	padding: 5%; */
	font-size: 1.6em;
	font-weight: bold;
	text-align: left;
	vertical-align: bottom;
	padding-top: 43px;
}

#corrects_text{
	display: table-cell;
	width: 40%;
	vertical-align: top;
	padding-top: 10%;
	font-size: 1.5rem;
}

#corrects {
    display: table-cell;
    width: 30%;
	border-radius: 5px;
    font-size: 1rem;
    font-weight: bold;
	color: #238ffe;
    text-align: right;
    padding-right: 2px;
}

#slash {
	display: table-cell;
	width: 10%;
	text-align: center;
	padding-right: 0;
	font-size: 0.5rem;
	vertical-align: bottom;
	padding-top: 20px;
}

#maxquestion {
	display: table-cell;
	width: 15%;
	font-size: 0.5rem;
	font-weight: bold;
	vertical-align: bottom;
	padding-top: 30px;
}

.q_list_wrapper {
	width: 60%;
	/*min-height: 40vh;*/
	margin: 0 auto;
	/* overflow: auto; */
}

#q_list {
	width: 100%;
	margin: 0 auto;
	font-size: 0.2rem;
}

#q_list th, #q_list td {
	padding-top: 0.05rem;
	vertical-align: middle;
}

#q_list th {
    width: 20%;
	height: 40px;
    background-color: #fe9223;
    color: #FFF;
}

#q_list td {
    background-color: #EFEFEF;
}

#q_list img {
	display: block;
	width: 10%;
	margin: 0 auto;
}

#q_statement {
    font-size: 0.15rem;
	color:#333;
	margin-bottom: 2px;
    /* padding-left: 0.28rem;
    text-indent: -0.28rem; */
} 

#bold_text{
	margin-right: 3px;
}

@media screen and (max-width: 480px) {  /*--スマートフォン--*/
#q_list {
	font-size: 0.18rem;
}

#q_list img {
	width: 14%;
}

#q_statement {
    font-size: 0.15rem;
	color: #333;
}
.q_list_wrapper {
	width: 90%;
}

 /*-- 見出し --*/
#score{ 
   font-size: 0.14rem;
   border-radius: 14px;
}
}
/* ********** 解説 ********** */
#cq_s_area {
    display: none;
}

#cq_s {
	/* margin-bottom: 50px; */
	color:#333;
	font-size: 0.15rem;
}

#commentary_wrapper {
	position: absolute;
	bottom: calc(-100% + 40px);
	left: 0;
	width: 100%;
	transition: 0.5s;
}

#user_ans_c {
	display: inline-block;
	width: 5%;
}

#commentary_statement > div {
	/* width: 60%; */
	font-size: 0.15rem;
	line-height: 0.24rem;
	width: 100%;
    margin-top: 8px;
	overflow: hidden; 
}

#ans {
	width: 3em;
	height: 28px;
	line-height: 30px;
	background-color: #238ffe;
	color: #FFF;
	font-size: 0.15rem;
 /*	font-weight: bold;*/
	text-align: center;
	float: left;
    border-radius: 3px;
}

#user_ans {
    font-size: 0.14rem;
	height: 30px;
	margin: 0 10px 0 20px;
	line-height: 30px;
	float: left;
}

#user_ans_c {
	display: block;
	width: 30px;
	float: left;
}

#ans_c {
    font-size: 0.16rem;
    margin-top: 10px;
	color: #238ffe;
	font-weight: 550;
}

#trans {
	color: #0000FF;
}

.point {
	display: block;
	width: 25%;
	margin-top: 5%;
	border: solid 1px #00AECF;
	border-radius: 20px;
	background-color: #FFF;
	color: #00AECF;
	font-weight: bold;
	text-align: center;
	min-width:140px;
}

#t_vmnaudio{
	border: none;
    width: 500px;
	max-width: 100%;
    height: 60px;
    text-align: center;
    margin-bottom:15px;
}

#t_vmnaudio:focus {
  outline:none;
}

@media screen and (max-width: 480px) {  /*--スマートフォン--*/
#t_vmnaudio{
   margin-bottom:10px;
}
}

#t_sound_button{
	text-align:center;
}


.nar{
	display:flex;
	font-weight:bold;
	margin-bottom: 5px;
}

.country{
	width: 5%;
	height: 5%;
	margin-top: 0;
	margin-left: 4px;
	margin-right: 8px;
	margin-bottom: 0;
}

.choice{
	margin-top:0 !important;
}

.choice_first{
/*	margin-top:10px !important; 選択肢グループの前に性別マークが付くことがあるため */
}

.choice_last{
	margin-bottom:10px !important;
}

.text_trans{
	font-size:.14rem;
	color: #ab5600;
}

.translation{
	font-size:.14rem;
	margin-top:0 !important;
    color: #ab5600;
}

.trans_first{
	/* margin-top:10px !important; 選択肢グループの前に性別マークが付くことがあるため */
}

th.tab_th{
	padding: 3px;
	cursor:auto;
	width:6%;
	text-align:left;
}

td.tab_td{
	padding: 3px;
	width:94%;
}

table tr:nth-child(even) {
background: #f1f3f4;
}
 
table tr:nth-child(odd) {
background: #fff3e6;
}

.script, .points {
    display: inline-block;
    margin-top: 20px!important;
    padding: 2px 6px 1px 6px;
    width: 7em!important;
    background-color: grey;
    color: #fff;
    text-align: center;
  /*  font-weight: bold; */
    font-size: 0.15rem!important;
    line-height: 1.7em!important;
    margin-right: 0.5em;
    text-indent: 0;
    border-radius: 3px;
}

.points {
    width: 2em!important;
}

.texts{
     margin-top: 6px!important;
}

.exp{
     margin-top: 0px!important;
}

@media screen and (max-width: 480px) {  /*--スマートフォン--*/
#commentary_statement > div {
   font-size: 0.153rem;
}
#ans {
 font-size: 0.14rem;
}
#ans_c {
   font-size: 0.153rem;
}
.script, .points {
 margin-top: 15px!important;
 font-size: 0.14rem!important;
}

#cq_s {
	/* margin-bottom: 50px; */
	color:#333;
	font-size: 0.14rem;
	margin-top: 5px;
}
}
/* ********** フッター ********** */
footer {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding:10px 0 1px 0;
    background-color: #fe9223;
}

#footer_comment { /* 追加 */
    display: none;
	margin: 0;
    padding:0;
}

#footer_comment>p { /* 追加 */
    text-align: center;
	font-size: 0.13rem;
	margin:0 0 4px 0;
	color: #ffffff;
	line-height: 1em;
}

.copyright {
	margin-top: 1px;
	padding-right: 5px;
    text-align: right;
	font-size: 0.08rem;
	color: #ffd7ae;
	clear: both;
}

@media screen and (max-width: 480px) {  /*--スマートフォン--*/
/* スマートフォンでは文字サイズを小さく */
#footer_comment>p {
   font-size: 0.12rem;
}
.copyright {
   font-size: 0.08rem;
}
}
@media only screen and (max-width:350px) { /* iPhone SE */
#footer_comment>p {
   font-size: 0.10rem;
}
.copyright {
   font-size: 0.08rem;
}
}

#footer_button { /* 追加 */
    position: relative;
}

.next_btn {
	display: block;
	color: #FFF;
	font-size: 0.16rem;
	/* font-weight: bold; */
    border: none;
    width: 160px;
    height: 40px;
	margin: auto;
    background-color: #fe9223;
    border: 2px #fff solid;
    border-radius: 21px;
}

.next_btn:focus {
  outline: 0;
}
/*
.next_btn:hover {
    background-color: #feaf5e;
}
*/
.next_btn:active {
    background-color: #fe850a;
}

#go_list {
	display: none;
}

#go_back {
	display: none;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 2%;
	margin: auto;
	width: 40px;
	cursor: pointer;
}

#go_next {
	display: none;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 2%;
	margin: auto;
	width: 40px;
	cursor: pointer;
}

#post2 {
	display: none;
	background-color: #ff8c00;
    border: 2px solid #fff;
	/*width: 75%;*/
}

#post {
    display: none;
    margin-right: 2%;
    float: right;
}

#post3 {
    display: none;
    margin-left: 2%;
    float: left;
}

#start {
}

#c_statement,#c_s {
	display: none;
	padding-bottom: 15px;
	/* max-height:60vh; */
	height:auto;
	font-size: 0.16rem;
	line-height: 0.25rem;
}
/* ********** モーダル ********** */
#modal {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: rgba(0,0,0,0.6);
	animation: fade_in 0.3s;
	z-index: 1;
}

@keyframes fade_in {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.modal_background {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 84%;
/*	height: 90vh; */
	/*padding: 7% 2% 2% 2%;*/
	background-color: #fff;
	/* background-color: #f2eee5; */
	box-shadow: 0 0 3px 3px rgba(0,0,0,0.3);
	border-radius: 10px;
	z-index: 2;
}

.modal_close {
	position: absolute;
	top: 8px;
	right: 10px;
	display: block;
	width: 26px;
	cursor: pointer;
	z-index: 3;
}

#modal_content {
	width: 100%;
    /* height: 85%; */
    /*  margin: 7% 0 2% 0; */
    /* padding: 0 2px; */
   	margin-top: 38px;
   	/* margin-bottom: 30px; */
	overflow: auto;
    -webkit-overflow-scrolling: touch;
}

#modal_content>div {
	margin: 0 20px 20px 20px;
}

.close_message {
	position: absolute;
	bottom: 2%;
	left: 0;
	right: 0;
	width: 80%;
	margin: 0 auto;
	padding-top: 0.04rem;
	border-radius: 10px;
    background-color: #E2E2E2;
	text-align: center;
	font-size: 0.13rem;
	cursor: default;
	/* cursor: pointer; */
}

#q_text{
/*	color:#FFF; */
	font-size:0.13rem;
	font-weight:550;
	margin:0;
	padding: 4px 10px 2px 10px;
	background-color:#f2eee5;
	overflow:hidden;
}
/*
#modal_content {
	border-top: 1px solid #ccc;
}
*/
/*攻略法要素css　ここから*/
.walkthrough_main_title{
	font-size:0.16rem;
    background-color: #f2eee5; 
	padding: 5px 5px;
	margin: 0;
	margin-bottom: 16px;
	border-radius: 18px;
	text-align: center;
}
.walkthrough_chapter_title{
    margin-top: 20px;
	font-size:0.15rem;
  /*  font-weight: 550; */
	padding: 0.05em 0.2em;
    background: transparent;
    border-left: solid 8px #fe9223;
  /*  border-bottom: solid 2px #fe9223; */
}

.walkthrough_point_title {
   display: flex;
   margin: 15px auto 10px;
   padding: 0px 8px 0px 3px;
 /*  height: 40px; */
   background: #fe9223;
   align-items: center;
   border-radius: 24px;
}
.walkthrough_point_title p {
   margin: 8px 0;
   padding: 3px 2px;
   font-size:0.15rem;
   font-weight:550;
   color:#fff;
   line-height: 0.20rem;
}
.walkthrough_point_title img {
	display: inline;
/*	padding-bottom: 4px; */
	max-width: 38px;
	margin: 0 2px 0 0;
    float: left;
    clear: both;
}

.walkthrough_image {
    margin: 10px auto;
	width: 70%;
}
/*
.walkthrough_point_title{ 
    display: flex;
	padding: 7px 8px 4px 5px;
	margin: 25px 0px 10px 0px;
	height: 40px;
	background-color: #fe9223; 
	border-radius: 22px; 
	vertical-align: middle;
	align-items: center;
}

.walkthrough_point_title:before {
    content: '';
    display: inline-block;
    width: 40px;
    height: 40px;
    background: url("../images/point_icon.png") no-repeat;  
    background-size: contain;
    vertical-align: middle;
    margin-right:5px;  
}
.walkthrough_point_title span{
	font-size:0.16rem;
	font-weight:550;
	color:#fff;
}
*/

.walkthrough_point_text{
/*	margin:0% 3%; */
    margin-top: 15px;
    margin-bottom: 5px;
    padding: 0px 5px 2px 4px;
    font-size: 0.16rem;
    font-weight:bold;
	border-bottom:3px dotted #feaf5e;
}
.walkthrough_normal_text{
    margin: 5px 0px;
	padding: 0 5px;
	font-size: 0.15rem;
	line-height: 0.24rem;
}
.walkthrough_text_bold_setting{
	font-weight:bold;
	color: #33AAFF;
}
.walkthrough_pic_box{
	padding: 1%;
}
.walkthrough_pic_resource{
	border:1px solid #ccc;
}
/* 矢印 */
img.inline-img2 {
 display:inline;
 width: 17px;
 vertical-align: middle;
}

/* モーダル内テーブル */
table.modal-table  {
  margin: 10px auto;
  border-collapse: collapse;
  font-size: 0.90em;
  width: 90%;
}
table.modal-table th {
  border: none;
  width: 40%;
  padding: 5px;
  font-weight: normal;
  text-align: left;
  background-color: #d3e8ff;
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
}
table.modal-table td {
  border: none;
  padding: 5px;
  background-color: #f2eee5;
  border-bottom: 2px solid #fff;
}

#modal_content>div ul{
padding-left: 10px;
list-style-type: none!important;/*ポチ消す*/
}

#modal_content>div ul li{
 padding: 2px 0;
}
@media screen and (max-width: 480px) {  /*--スマートフォン--*/
#modal_content>div {
	margin: 0 5px 20px 5px;
}

.walkthrough_main_title {
    font-size: 0.15rem;
    border-radius: 14px;
}
.walkthrough_chapter_title{
    margin-top: 8px 0;
    font-size: 0.15rem;
}
.walkthrough_normal_text{ 
    font-size: 0.145rem;
    line-height: 0.23rem;
}
	
.walkthrough_point_title {
	padding: 2px 8px 2px 3px;
	border-radius: 34px;
}

.walkthrough_point_title p{
	margin: 3px 0;
	font-size: 0.14rem;
    line-height: 0.20rem;
}
.walkthrough_image {
width: 98%;
}
/*
	.walkthrough_point_title{
    padding: 5px;
}
.walkthrough_point_title span{
    font-size: 0.15rem;
    line-height: 0.20rem;
}
.walkthrough_point_title:before {
    float: left;
}
*/
.walkthrough_point_text{
   font-size: 0.15rem;
}
#q_text{
   font-size: 0.12rem;
}

	
table.modal-table tr td:last-child {
/*   border:none; */
   width: 100%;
}
table.modal-table {
   width: 80%;
}
table.modal-table th,
table.modal-table td {
   border-right: none;
   display: block;
   padding: 5px;
   width: 100%;
}
 table.modal-table th{
	border-bottom: 2px solid #fff;			
}
 table.modal-table td {
	border-bottom: 2px solid #fff;	
}
}

/* ********** 固有id ********** */

#long_text1,#long_text2,#long_text3{
	background-color:#FFF;
	border: solid 1px #000;
	padding: 1%;
	margin: 1%;
	max-height: 56vh;
	overflow: auto;
}

#t_long_text1,#t_long_text2,#t_long_text3,
#t_long_text4,#t_long_text5,#t_long_text6{
	background-color:#FFF;
	border: solid 1px #000;
	padding: 1%;
	margin: 1%;
	max-height: 56vh;
	overflow: auto!important;
	width:auto !important;
}

img#vmn01,img#vmn02,img#vmn03,img#vmn04,img#vmn05,img#vmn06,img#vmn07{
	margin: 1% auto;
	/* width: 60%; */
	width: 395px;
}

img#t_vmn01,img#t_vmn02,img#t_vmn03,img#t_vmn04,img#t_vmn05,img#t_vmn06,img#t_vmn07{
	margin: 1% auto;
	width: 430px;
}

.part1{
	width:74% !important;
	margin:0 auto !important;
}

/* IE11 */
_:-ms-lang(x)::-ms-backdrop, .part1{
	width:75% !important;
	margin:0 auto !important;
}

/* 特殊演出 */

.not_choice{
	background-color:#cccccc!important;
	pointer-events:none;
}

.next_q_btn{
 /* ページ遷移のボタンを点滅 */
 animation: flash 0.8s infinite;
pointer-events:auto;
}

@keyframes flash {
  0%, 100%{
    background-color: #feaf5e;
	color:#fff;
  }

  50%{
    background-color: #f97f01;
	color:#fff;
  }
}

/* iPad縦想定 */
@media screen and (min-width: 1024px) and (orientation: landscape){
	
	.img_wrapper{
    /*
    	max-height:none;
		overflow:auto;
    */
    }
	
}

/* iPad縦想定 */
@media screen and (max-width: 1024px) and (orientation: portrait){
	
	#main{
		overflow:auto;
		/*max-height:84vh;*/
		/* max-height:60vh; */
	}
	
	.result {
	/*	max-height: 75vh;
		margin-bottom: 5vh;
        overflow: auto;
        */
	}
	/*
    .img_wrapper{
    	max-height:none;
		overflow:auto;
	}
    */
    
	.score_wrapper {
	/*	width: 55%; */
		width: 380px;
		margin: 3vh auto 3vh;
	}
	
}

/* スマートフォン横持想定 */
@media screen and (max-width: 896px) and (orientation: landscape) {
	
	#main{
		overflow:auto;
		/*max-height:84vh;*/
		/* max-height:60vh; */
	}
	
	.result {
	/*	max-height: 60vh;
		margin-bottom: 5vh;
        overflow: auto;
        */
	}
	
    /*
    .img_wrapper{
		max-height:none;
		overflow:auto;
	}
    */
    
	.score_wrapper {
	/*	width: 55%; */
		width: 380px;
		margin: 3vh auto 3vh;
	}

	#commentary{
		display:none;
		overflow:auto;
    }
	
}

@media screen and (max-width: 480px) { /* スマートフォン */
	
	#main {
		overflow:auto;
		/*max-height:84vh;*/
	}

	#commentary{
		display:none;
		overflow:auto;
	}
	
	.result {
	/*	height: 75vh;
		margin-bottom: 5vh;
		overflow: auto;
    */
    }
	
    /*
    .img_wrapper{
		max-height:60vh;
		overflow:auto;
	}
    */

	#vmnaudio,#t_vmnaudio{
		border: none;
		width: 250px;
		max-width: 100%;
		height: 30px;
		text-align: center;
	}

	.radio_A {
		display: inline-block;
		/* width: 13%; */
		width: 41px;
		height: inherit;
		background-image: url("../images/A.png");
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
	}

	.radio_B {
		display: inline-block;
		/* width: 13%; */
		width: 41px;
		height: inherit;
		background-image: url("../images/B.png");
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
	}

	.radio_C {
		display: inline-block;
		/* width: 13%; */
		width: 41px;
		height: inherit;
		background-image: url("../images/C.png");
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
	}

	.radio_D {
		display: inline-block;
		/* width: 13%; */
		width: 41px;
		height: inherit;
		background-image: url("../images/D.png");
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
	}

	.radio_text {
		display: inline-block;
		font-size: 0.14rem;
		margin-left: 120%;
		width: 570%;
		word-wrap: normal;
	}

	#choice_statement{
		border-top: solid 5px #fe9223;
		background-color: #f2eee5;
		padding: 0 2% 2%;
		/* max-height: 70vh; */
		max-height: 50vh; /*40vh;*/
		overflow-y: auto;
	}
	
	.next_btn {
	    font-size: 0.16rem;
		width: 130px;
		height: 40px;
		margin: auto;
	}
	
	.not_choice{
		background-color:#e0e0e0;
		pointer-events:none;
	}
	
	.modal_background {
		position: absolute;
        /* top: 0; */
        top: 30px;
		bottom: 0;
		left: 0;
		right: 0;
		/* margin: auto; */
        margin: 0 auto;
		width: 94%;
		/* height: 85%; */
		background-color: #FFF;
		box-shadow: 0 0 3px 3px rgba(0,0,0,0.3);
		border-radius: 5px;
		z-index: 2;
	}
	
	.modal_close {
		position: absolute;
		top: 5px;
		right: 5px;
		display: block;
		/* width: 10%; */
		cursor: pointer;
		z-index: 3;
	}
	
	.script, .points {
	    font-size: 0.14rem;
/*
		color: #fff;
		background-color: rgba(0,139,139,0.6);
		padding: 10px 10px 10px 10px;
		border-radius: 10px;
		width: 95% !important;
*/
	}

	#c_statement,#c_s {
		display: none;
		padding-bottom: 20px;
		/* max-height:60vh; */
		height:auto;
		font-size: 0.154rem;
	}
	
	.score_wrapper {
		width: 300px;
		margin: 10px auto;
	}
	
	figure {
	   width: 300px;	
	}
	
	figure img {
	   width: 100%;
	}
	.country{
		width: 7%;
		height: 7%;
		margin-top: 0;
		margin-left: 4px;
		margin-right: 8px;
		margin-bottom: 0;
	}
	
	.nar{
		display:flex;
		font-weight:bold;
	    align-items:center;
	}
	
	.part1{
	/*	width:74% !important; */
		width:90% !important;
		margin:0 auto !important;
	}
	
	img#vmn01,img#vmn02,img#vmn03,img#vmn04,img#vmn05,img#vmn06,img#vmn07{
		margin: 1%;
		width: 98%;
	}

	img#t_vmn01,img#t_vmn02,img#t_vmn03,img#t_vmn04,img#t_vmn05,img#t_vmn06,img#t_vmn07{
		margin: 1%;
		width: 98%;
	}
}

/* =============== とびら =============== */

.cover {
  padding: 15px 30px;
}
	
img.cover-pc {
/*  width: auto; */
  display: block !important;
  max-width: 100%;
  margin-top: 50px;
  margin-bottom: 30px;
  margin-right:auto; 
  margin-left:auto;
}
@media screen and (max-height: 480px){
img.cover-pc {
   margin-top: 10px;
   margin-bottom: 3px;
}
}	

img.cover-sp{
  display: none !important;	
}
.cover-title {
	text-align: center;
	font-size: 0.16rem;
	margin: 5px 0px;
   /* font-weight: bold; */
    background-color: #f2eee5;
    padding: 4px 5px;
    border-radius: 18px;
    text-align: center;
}

.cover p.cover-p{
  margin: 10px 0 20px 0;
  font-size: 15px;
  line-height: 24px;
  color: #494949;
}

/* 練習問題　注釈 */
.notes {
 margin: 3px auto;
 display: block;
}
.notes p {
	font-size: 0.85em;
    line-height: 1.5em;
}

@media screen and (max-width: 480px) {  /*--スマートフォン--*/
.cover {
  margin-top: 20px;
  padding: 15px 10px;
}
img.cover-pc {
  display: none !important;	
	}
img.cover-sp {
  display: block !important;
  max-width: 80%;
  margin-top: 15px;
  margin-bottom: 20px;
}
.cover-title { 
   font-size: 0.14rem;
   border-radius: 14px;
}

.cover p.cover-p{
  font-size: 14.5px!important;
  line-height: 22px;
}

/* 練習問題　注釈 */
.notes {
 margin: 0px auto;
}
.notes p {
}
}

/* =========================================
              ローディング
 ========================================= */
.loader-wrap {
	position: relative;
	display: flex;
    /*align-items: center;
    justify-content: center; */
    width: 100%;
 /*   max-width: 760px; */
    /* margin: 0px auto; */
    height: 100vh;
    background: #fff;
    top: 0;
    left: 0;
    z-index: 9999;
}
.loader {
  position: absolute;
  top: 50%;
  left: 50%;
/*  margin: 100px auto; */
  font-size: 10px;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%);
  text-indent: -9999em;
  -webkit-animation: load5 1.1s infinite ease;
  animation: load5 1.1s infinite ease;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
@-webkit-keyframes load5 {
  0%,
  100% {
    box-shadow: 0em -2.6em 0em 0em #c9c9c9, 1.8em -1.8em 0 0em rgba(201,201,201, 0.2), 2.5em 0em 0 0em rgba(201,201,201, 0.2), 1.75em 1.75em 0 0em rgba(201,201,201, 0.2), 0em 2.5em 0 0em rgba(201,201,201, 0.2), -1.8em 1.8em 0 0em rgba(201,201,201, 0.2), -2.6em 0em 0 0em rgba(201,201,201, 0.5), -1.8em -1.8em 0 0em rgba(201,201,201, 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.7), 1.8em -1.8em 0 0em #c9c9c9, 2.5em 0em 0 0em rgba(201,201,201, 0.2), 1.75em 1.75em 0 0em rgba(201,201,201, 0.2), 0em 2.5em 0 0em rgba(201,201,201, 0.2), -1.8em 1.8em 0 0em rgba(201,201,201, 0.2), -2.6em 0em 0 0em rgba(201,201,201, 0.2), -1.8em -1.8em 0 0em rgba(201,201,201, 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.5), 1.8em -1.8em 0 0em rgba(201,201,201, 0.7), 2.5em 0em 0 0em #c9c9c9, 1.75em 1.75em 0 0em rgba(201,201,201, 0.2), 0em 2.5em 0 0em rgba(201,201,201, 0.2), -1.8em 1.8em 0 0em rgba(201,201,201, 0.2), -2.6em 0em 0 0em rgba(201,201,201, 0.2), -1.8em -1.8em 0 0em rgba(201,201,201, 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.2), 1.8em -1.8em 0 0em rgba(201,201,201, 0.5), 2.5em 0em 0 0em rgba(201,201,201, 0.7), 1.75em 1.75em 0 0em #c9c9c9, 0em 2.5em 0 0em rgba(201,201,201, 0.2), -1.8em 1.8em 0 0em rgba(201,201,201, 0.2), -2.6em 0em 0 0em rgba(201,201,201, 0.2), -1.8em -1.8em 0 0em rgba(201,201,201, 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.2), 1.8em -1.8em 0 0em rgba(201,201,201, 0.2), 2.5em 0em 0 0em rgba(201,201,201, 0.5), 1.75em 1.75em 0 0em rgba(201,201,201, 0.7), 0em 2.5em 0 0em #c9c9c9, -1.8em 1.8em 0 0em rgba(201,201,201, 0.2), -2.6em 0em 0 0em rgba(201,201,201, 0.2), -1.8em -1.8em 0 0em rgba(201,201,201, 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.2), 1.8em -1.8em 0 0em rgba(201,201,201, 0.2), 2.5em 0em 0 0em rgba(201,201,201, 0.2), 1.75em 1.75em 0 0em rgba(201,201,201, 0.5), 0em 2.5em 0 0em rgba(201,201,201, 0.7), -1.8em 1.8em 0 0em #c9c9c9, -2.6em 0em 0 0em rgba(201,201,201, 0.2), -1.8em -1.8em 0 0em rgba(201,201,201, 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.2), 1.8em -1.8em 0 0em rgba(201,201,201, 0.2), 2.5em 0em 0 0em rgba(201,201,201, 0.2), 1.75em 1.75em 0 0em rgba(201,201,201, 0.2), 0em 2.5em 0 0em rgba(201,201,201, 0.5), -1.8em 1.8em 0 0em rgba(201,201,201, 0.7), -2.6em 0em 0 0em #c9c9c9, -1.8em -1.8em 0 0em rgba(201,201,201, 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.2), 1.8em -1.8em 0 0em rgba(201,201,201, 0.2), 2.5em 0em 0 0em rgba(201,201,201, 0.2), 1.75em 1.75em 0 0em rgba(201,201,201, 0.2), 0em 2.5em 0 0em rgba(201,201,201, 0.2), -1.8em 1.8em 0 0em rgba(201,201,201, 0.5), -2.6em 0em 0 0em rgba(201,201,201, 0.7), -1.8em -1.8em 0 0em #c9c9c9;
  }
}
@keyframes load5 {
  0%,
  100% {
    box-shadow: 0em -2.6em 0em 0em #c9c9c9, 1.8em -1.8em 0 0em rgba(201,201,201, 0.2), 2.5em 0em 0 0em rgba(201,201,201, 0.2), 1.75em 1.75em 0 0em rgba(201,201,201, 0.2), 0em 2.5em 0 0em rgba(201,201,201, 0.2), -1.8em 1.8em 0 0em rgba(201,201,201, 0.2), -2.6em 0em 0 0em rgba(201,201,201, 0.5), -1.8em -1.8em 0 0em rgba(201,201,201, 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.7), 1.8em -1.8em 0 0em #c9c9c9, 2.5em 0em 0 0em rgba(201,201,201, 0.2), 1.75em 1.75em 0 0em rgba(201,201,201, 0.2), 0em 2.5em 0 0em rgba(201,201,201, 0.2), -1.8em 1.8em 0 0em rgba(201,201,201, 0.2), -2.6em 0em 0 0em rgba(201,201,201, 0.2), -1.8em -1.8em 0 0em rgba(201,201,201, 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.5), 1.8em -1.8em 0 0em rgba(201,201,201, 0.7), 2.5em 0em 0 0em #c9c9c9, 1.75em 1.75em 0 0em rgba(201,201,201, 0.2), 0em 2.5em 0 0em rgba(201,201,201, 0.2), -1.8em 1.8em 0 0em rgba(201,201,201, 0.2), -2.6em 0em 0 0em rgba(201,201,201, 0.2), -1.8em -1.8em 0 0em rgba(201,201,201, 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.2), 1.8em -1.8em 0 0em rgba(201,201,201, 0.5), 2.5em 0em 0 0em rgba(201,201,201, 0.7), 1.75em 1.75em 0 0em #c9c9c9, 0em 2.5em 0 0em rgba(201,201,201, 0.2), -1.8em 1.8em 0 0em rgba(201,201,201, 0.2), -2.6em 0em 0 0em rgba(201,201,201, 0.2), -1.8em -1.8em 0 0em rgba(201,201,201, 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.2), 1.8em -1.8em 0 0em rgba(201,201,201, 0.2), 2.5em 0em 0 0em rgba(201,201,201, 0.5), 1.75em 1.75em 0 0em rgba(201,201,201, 0.7), 0em 2.5em 0 0em #c9c9c9, -1.8em 1.8em 0 0em rgba(201,201,201, 0.2), -2.6em 0em 0 0em rgba(201,201,201, 0.2), -1.8em -1.8em 0 0em rgba(201,201,201, 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.2), 1.8em -1.8em 0 0em rgba(201,201,201, 0.2), 2.5em 0em 0 0em rgba(201,201,201, 0.2), 1.75em 1.75em 0 0em rgba(201,201,201, 0.5), 0em 2.5em 0 0em rgba(201,201,201, 0.7), -1.8em 1.8em 0 0em #c9c9c9, -2.6em 0em 0 0em rgba(201,201,201, 0.2), -1.8em -1.8em 0 0em rgba(201,201,201, 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.2), 1.8em -1.8em 0 0em rgba(201,201,201, 0.2), 2.5em 0em 0 0em rgba(201,201,201, 0.2), 1.75em 1.75em 0 0em rgba(201,201,201, 0.2), 0em 2.5em 0 0em rgba(201,201,201, 0.5), -1.8em 1.8em 0 0em rgba(201,201,201, 0.7), -2.6em 0em 0 0em #c9c9c9, -1.8em -1.8em 0 0em rgba(201,201,201, 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(201,201,201, 0.2), 1.8em -1.8em 0 0em rgba(201,201,201, 0.2), 2.5em 0em 0 0em rgba(201,201,201, 0.2), 1.75em 1.75em 0 0em rgba(201,201,201, 0.2), 0em 2.5em 0 0em rgba(201,201,201, 0.2), -1.8em 1.8em 0 0em rgba(201,201,201, 0.5), -2.6em 0em 0 0em rgba(201,201,201, 0.7), -1.8em -1.8em 0 0em #c9c9c9;
  }
}