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

.txtblue {
	color:#0090c2;
}
/* ==|== Story column ============================================= */
.col_story {
	padding: 10px 0;
	margin: 0;
	width: 100%;
	height: auto;
	border-bottom: dotted 3px rgba(255,255,255,0.5);
	overflow: auto;
	clear: both;
}
.bg_rainbow {
	padding: 10px 0;
	margin: 0;
	width: 100%;
	height: auto;
	background: url(../../../projects/icons_story/bg_rainbow_small.png) no-repeat center top;
	background-attachment: fixed;
}
.col_teaching {
	padding: 0;
	margin: 0;
	width: 100%;
	overflow: auto;
	position: relative;
	overflow: hidden;
}
.col_storytxt {
	margin: 30px auto 0 auto;
	padding: 0;
	width: 92%;
	height: auto;
	overflow-x: hidden;
	overflow-y: auto;
	clear: both;
}
@media screen and (min-width: 801px) and (max-width: 979px) and (max-height: 640px) {
	.col_story {
		padding: 10px 0;
		margin: 0;
		height: auto;
		overflow: auto;
		position: relative;
	}
	.bg_rainbow {
		padding: 0;
		margin: 0;
		height: auto;
		background: url(../../../projects/icons_story/bg_rainbow_small.png) no-repeat center top;
		background-attachment: fixed;
	}
	.col_storytxt {
		margin: 0 auto;
		padding-top: 20px;
		width: 82%;
		height: auto;
		overflow: auto;
	}
}

@media screen and (min-width: 801px) and (min-height: 641px) {
	.col_story, .bg_rainbow {
		height: 100vh;
	}
}

@media screen and (min-width: 980px) and (max-height: 640px) {
	.col_story {
		padding-top: 70px;
		margin: -70px 0 0 0;
		overflow: auto;
		position: relative;
	}
	.bg_rainbow {
		padding-top: 70px;
		margin: -70px 0 0 0;
		height: 100vh;
		overflow: auto;
		position: relative;
		background: url(../../../projects/icons_story/bg_rainbow.png) no-repeat center top;
		background-attachment: fixed;
	}
	.col_storytxt {
		margin: 0 auto;
		padding: 10px 250px 0 0;
		width: 700px;
		height: auto;
		overflow: auto;
	}
	.col_storytxt_first {
		margin-top: -20px;
	}
}
@media screen and (min-width: 980px) and (min-height: 641px) {
	.col_story {
		padding-top: 80px;
		margin: -80px 0 0 0;
		overflow: auto;
		position: relative;
		border: none;
	}
	.bg_rainbow {
		padding-top: 80px;
		margin: -80px 0 0 0;
		height: 100vh;
		overflow: auto;
		position: relative;
		background: url(../../../projects/icons_story/bg_rainbow.png) no-repeat center top;
		background-attachment: fixed;
	}
	.col_storytxt {
		margin: 0 auto;
		padding:0 250px 0 0;
		width: 700px;
		height: auto;
		overflow: auto;
	}
	.col_storytxt_first {
		margin-top: -20px;
	}
}


/* ==|== storytxt ================== */
.col_storytxt h2 {
	display: none;
}
.col_storytxt h2.pagetitle {
	display: block;
	margin: 0 0 10px 0;
	padding: 0;
	font-size: 22px;
	color: #FFCC00;
}
.col_storytxt h3 {
	margin: 0 0 10px 0;
	padding: 0;
	font-size: 20px;
	color: #FFCC00;
}
.col_storytxt h3.laureatesname {
	margin-top:10px;
}
.col_storytxt h4 {
	margin: 0px;
	font-size: 18px;
	color: #FFCC00;
	letter-spacing: 0.02em;
}
.col_storytxt p {
	margin: 0;
	padding-bottom: 10px;
	font-size: 17px;
	color: #FFF;
}
.col_storytxt li {
	font-weight: 400;
}
.col_storytxt p.nospace {
	padding-bottom: 5px!important;
}
.box {
	padding: 0 3px;
	color:  #FFCC00;
	text-decoration: underline;
	letter-spacing: 0.1em;
}
.col_storytxt p i {
	padding: 0 3px 0 0;
	color:  #FFCC00;
	font-size: 80%;
}
p.caption {
	margin-top: 5px;
	font-size:13px;
	text-align: center;
}

@media screen and (min-width: 700px) {
	.col_storytxt h3.laureatesname {
			margin-top:0;
	}
}

@media screen and (min-width: 800px) and (max-height: 700px) {
	.col_storytxt h2.pagetitle {
		font-size: 32px;
	}
	.col_storytxt h3 {
		font-size: 26px;
	}
	.col_storytxt h4 {
		font-size: 22px;
	}
	.col_storytxt p {
		padding-bottom: 10px;
	}
	p.caption {
		font-size:14px;
	}
}

@media screen and (min-width: 800px) and (min-height: 701px) {
	.col_storytxt h2.pagetitle {
		font-size: 34px;
	}
	.col_storytxt h3 {
		font-size: 28px;
	}
	.col_storytxt h4 {
		font-size: 24px;
	}
	.col_storytxt p {
		font-size: 19px;
		padding-bottom: 20px;
	}
}

@media screen and (min-width: 980px) {
	p.caption {
		font-size:15px;
		text-align: right;
	}
}

.divide_left, .divide_right {
	padding: 0;
}
.divide_left img, .divide_right img {
	display: block;
	margin: 0 auto;
	max-width: 75%;
	height: auto;
	width /***/:auto;
}
.col_storytxt p img {
	display: block;
	margin: 0 auto;
	max-width: 100%;
	height: auto;
	width /***/:auto;

}
@media screen and (min-width: 600px) and (max-width: 859px) {
	.divide_left img, .divide_right img {
		max-width: 50%;
	}
}
@media screen and (min-width: 860px) {
	.divide_left {
		float: left;
	}
	.divide_right {
		float: right;
	}
	.split200 {
		width: 200px;
	}
	.split480 {
		width: 480px;
	}
	.split240 {
		width: 240px;
	}
	.split440 {
		width: 440px;
	}
	.split280 {
		width: 280px;
	}
	.split400 {
		width: 400px;
	}
	.split340 {
		width: 340px;
	}
	.col_storytxt p img, .divide_left img, .divide_right img {
		padding: 0;
		margin: 0;
		width:100%;
		max-width: 100%;
	}
	.col_storytxt p img {
		display: block;
		margin: 0 auto;
		max-width: 75%;
		height: auto;
		width /***/:auto;
	}
}
@media screen and (min-width: 980px) {
	.col_storytxt p img {
		display: block;
		margin: 0 auto;
		max-width: 100%;
		height: auto;
		width /***/:auto;
	}
}
p.flag {
	padding: 0 0 10px 0;
	clear:both;
}
p.flag img {
	width: 80px;
	height: 80px;
}
p.spec {
	padding-bottom: 10px;
	font-size: 17px;
	font-weight: 500;
}
p.storyindex a {
	margin: 5px 0 0 0;
	display: block;
	padding: 12px 12px 12px 2.5em;
	text-indent: -1.25em;
	text-decoration: none;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;
	border: solid 2px #FFF;
	font-size:16px;
	color:#FFF;
}
p.storyindex a:hover, p.storyindex_next a:hover {
	background-color: #FFF;
	color: #007CAE;
}
p.storyindex_next a {
	margin: 10px 0 10px 0;
	display: block;
	padding: 25px 10px 25px 10px;
	text-decoration: none;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;
	border: solid 2px #FFF;
	font-size:16px;
	color:#FFF;
}
#intro1 h3, #intro1 p.spec, #intro1 p.flag {


	text-align: center;
}
@media screen and (min-width: 800px) {
	p.storyindex a {
		width:600px;
		font-size:18px;
	}
	#intro1 h3, #intro1 p.spec, #intro1 p.flag {
		text-align: left;
	}
	p.spec {
		padding-bottom: 15px;
		font-size: 21px;
	}
	p.storyindex_next a {
		padding: 30px 15px 30px 15px;
		font-size:18px;
		background:url(../icons_story/chara_nextstory.png) bottom right no-repeat;
	}
}
.underl {
	text-decoration: underline;
}
.supple {
	border-top: 1px solid #fff;
	padding-top: 10px!important;
	font-size: 14px!important;
	padding-left: 1em!important;
	text-indent: -1em;
}
li.writelist, li.writelist-nonsymbol {
	padding-left: 1.5em;
	text-indent: -1.5em;
	font-size: 16px;
	font-family:'DIN Next W04'; font-weight: 400;  font-style: normal;
	color:#FFF;
}
li.writelist:before {
	font-family: 'FontAwesome' ;
	padding: 2px 5px 0 0;
	content: '\f111';
	font-size: 120%;
	color:#FFF;
}
li.writelist i, li.writelist-nonsymbol i {
	text-indent: 0.5em;
}
@media screen and (min-width: 800px) {
	li.writelist {
		font-size: 17px;
	}
}
/* ==|== Modal Long sentence colorbox ================== */
#modal_colorbox {
	background:#FFF;
	text-align: left;
}
#modal_colorbox div {
	margin:0 auto;
	padding: 10px;
	font-size:16px;
	font-family:'DIN Next W04'; font-weight: 400;  font-style: normal;
	width:auto;
}

/* ==|== SP Page index ================== */
.spmenu {
	display: block;
	margin: 5px 0;
	padding: 0;
	text-align: center;
	overflow: auto;
}
.spmenu ul {
	margin: 0 auto;
	display: table;
	border-collapse: separate;
	border-spacing: 10px;
}
.spmenu ul li {
	display: block;
	position: relative;
	display: table-cell;
	margin: 10px;
	padding: 5px;
	color: #fff;
}
.spmenu ul li a {
	display: block;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	border: solid 2px rgba(255,255,255,0.9);
	text-align: center;
	font-family:'DIN Next W04';
	font-style: normal;
	font-size: 16px;
	color: #fff;
	line-height: 1;
	opacity:0.75;
}
.spmenu ul li.spback a {
	padding: 7px 10px 7px 24px;
}
.spmenu ul li.spback:before {
	position: absolute;
	font-family: 'FontAwesome';
	top: 6px;
	left: 11px;
	content: '\f0aa';
	opacity:0.65;
	color: #fff;
	font-size: 17px;
	font-family: fontAwesome;
}
.spmenu ul li.spnext a {
	padding: 7px 24px 7px 10px;
}
.spmenu ul li.spnext:before {
		  position: absolute;
	font-family: 'FontAwesome';
	top: 6px;
	right: 11px;
	content: '\f0ab';
	opacity:0.65;
	color: #fff;
	font-size: 17px;
	font-family: fontAwesome;
}
@media screen and (min-width: 800px) {
	.spmenu {
		display: none;
	}
}

/* ==|== Page index ================== */
.col_pageindex {
	display: none;
}
@media screen and (min-width: 801px) {
	.col_pageindex {
		display: block;
		margin: 0 auto;
		padding: 10px 0 0 0;
		width: 82%;
		clear: both;
		overflow: auto;
	}
	.col_pageindex img {
		padding-left: 20px;
		float: left;
	}
	.col_pageindexin {
		padding: 0 30px 0 0;
		float: left;
		width: auto;
	}
	.sbtn_updown a {
		margin: 0;
		padding: 0;
		font-family: FontAwesome;
		font-size:32px;
		line-height:32px !important;
		color:#FFFFFF;
		filter: alpha(opacity=60);
		-moz-opacity:0.6;
		opacity:0.6;
	}
	.sbtn_updown a:hover {
		filter: alpha(opacity=90);
		-moz-opacity:0.9;
		opacity:0.9;
	}
	ul.pageindex {
		margin: 0;
		display: table;
		vertical-align: middle;
	}
	ul.pageindex li {
		margin: 0;
		text-align: center;
		font-family:'DIN Next W04';
		font-style: normal;
		font-size: 16px;
		line-height: none;
		display: table-cell;
	}
	ul.pageindex li a {
		padding: 4px 0 0 0;
		width: 34px;
		height: 32px;
		color: rgb(255,255,255);
		background:url(../../../projects/icons_story/bg_pageindex.png) no-repeat 0 0;
		display: table-cell;
	}
	ul.pageindex li a:hover {
		background-position: 0 -45px;
		color: rgb(0,124,174);
	}
	ul.pageindex li.currentpage {
		width: 34px;
		height: 36px;
		color: rgb(0,124,174);
		background:url(../../../projects/icons_story/bg_pageindex.png) no-repeat 0 -45px;
		display: table-cell;
	}
	.slim {
		letter-spacing:-0.05em;
	}
	.slim2 {
		font-feature-settings: "palt";
	}
}
@media screen and (min-width: 980px) {
	.col_pageindex {
		padding: 10px 250px 0 0;
		width: 700px;
	}
}
@media screen and (max-height: 580px) {
	.col_pageindex {
		display: none;
	}
}


/* ==|== up down Btn ================== */
.btn_updown {
	display:none;
}

@media screen and (min-width: 980px) and (min-height: 641px) {
	.btn_updown {
		display: block;
		position: absolute;
		top: 590px;
		right: 10px;
		z-index: 9998;
		-webkit-animation-duration: 0.7s;
		animation-duration: 0.7s;
		-webkit-animation-iteration-count: 3;
		animation-iteration-count: 3;
	}
	.btn_up, .btn_down {
		margin-right:5px;
		float:left;
	}
	.btn_up a {
		background: url(../../../projects/icons_story/btn_up.svg) no-repeat 0 0;
		display: block;
		width: 50px;
		height: 50px;
		filter: alpha(opacity=60);
		-moz-opacity:0.6;
		opacity:0.6;
	}
	.btn_down a {
		background: url(../../../projects/icons_story/btn_down.svg) no-repeat 0 0;
		display: block;
		width: 50px;
		height: 50px;
		filter: alpha(opacity=60);
		-moz-opacity:0.6;
		opacity:0.6;
	}
	.btn_down a:hover, .btn_up a:hover {
		filter: alpha(opacity=90);
		-moz-opacity:0.9;
		opacity:0.9;
	}
}

/* ==|== Right menu ============================================= */
#col_rightnav {
	display: none;
}
@media screen and (min-width: 980px) and (max-height: 640px) {
	#col_rightnav {
		display: block;
		padding: 0;
		position: fixed;
		top: 80px;
		right: -60px;
		width: 300px;
	}
	li.asideindex, li.asideindex2, li.asideindex_pre, li.asideindex_pre2, li.asideindex_s, li.asideindex_s_pre {
		margin: 0 0 5px 0;
		font-weight: 400;
	}
	li.asideindex a {
		display: block;
		padding: 3px 90px 3px 2em;
		background: #0090c2;
		-moz-border-radius: 15px;
		-webkit-border-radius: 15px;
		border-radius: 15px;
		border: solid 2px #FFF;
		width: 206px;
		font-size: 16px;
		text-indent: -1.25em;
		line-height: 1.2;
		color: #FFF;
		-webkit-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.3);
		-moz-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.3);
		box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.3);
	}
	li.asideindex2 a {
		display: block;
		padding: 2px 90px 4px 2em;
		background: #0090c2;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
		border: solid 2px #FFF;
		width: 206px;
		font-size: 15px;
		text-indent: -1.25em;
		line-height: 1.1;
		color: #FFF;
		-webkit-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.3);
		-moz-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.3);
		box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.3);
	}
	li.asideindex a:hover, li.asideindex2 a:hover {
		background: #FFF;
		color: #0090c2;
	}
	li.asideindex_pre {
		display: block;
		padding: 3px 90px 3px 2em;
		background: #FFF;
		-moz-border-radius: 15px;
		-webkit-border-radius: 15px;
		border-radius: 15px;
		border: solid 2px #FFF;
		width: 206px;
		font-size: 16px;
		text-indent: -1.25em;
		line-height: 1.2;
		color: #0090c2;
		-webkit-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.3);
		-moz-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.3);
		box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.3);
	}
	li.asideindex_pre2 {
		display: block;
		padding: 2px 90px 4px 2em;
		background: #FFF;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
		border: solid 2px #FFF;
		width: 206px;
		font-size: 15px;
		text-indent: -1.25em;
		line-height: 1.1;
		color: #0090c2;
		-webkit-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.3);
		-moz-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.3);
		box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.3);
	}

	li.asideindex_s a {
		display: block;
		margin: 0 0 4px 0;
		padding: 3px 90px 3px 2em;
		background: #0090c2;
		-moz-border-radius: 15px;
		-webkit-border-radius: 15px;
		border-radius: 15px;
		border: solid 1px #FFF;
		width: 206px;
		font-size: 14px;
		text-indent: -1.25em;
		line-height: 1.2;
		color: #FFF;
		-webkit-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.2);
		-moz-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.2);
		box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.2);
	}
	li.asideindex_s a:hover {
		background: #FFF;
		color: #0090c2;
	}
	li.asideindex_s_pre {
		display: block;
		padding: 3px 90px 3px 2em;
		background: #FFF;
		-moz-border-radius: 15px;
		-webkit-border-radius: 15px;
		border-radius: 15px;
		border: solid 1px #FFF;
		width: 206px;
		font-size: 14px;
		text-indent: -1.25em;
		line-height: 1.2;
		color: #0090c2;
		-webkit-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.2);
		-moz-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.2);
		box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.2);
	}

	li.asidemargin {
		height:6px;
	}
	li.asidemargin span {
		display: none;
	}
	.footer a, .footercopy {
		margin: 0;
		padding: 3px 0 0 0;
		color:#FFFFFF;
		line-height:1 !important;
	}
	.footer {
		font-size:12px;
	}
	.footercopy {
		font-size:10px;
	}
	.footer a:hover {
		text-decoration:underline;
	}
}
@media screen and (min-width: 980px) and (min-height: 641px) {
	#col_rightnav {
		display: block;
		padding: 0;
		position: fixed;
		top: 80px;
		right: -60px;
		width: 300px;
	}
	li.asideindex, li.asideindex2, li.asideindex_pre, li.asideindex_pre2, li.asideindex_s, li.asideindex_s_pre {
		margin: 0 0 5px 0;
	}
	li.asideindex a {
		display: block;
		padding: 5px 90px 5px 2em;
		background: #0090c2;
		-moz-border-radius: 20px;
		-webkit-border-radius: 20px;
		border-radius: 20px;
		border: solid 3px #FFF;
		width: 206px;
		font-size: 16px;
		text-indent: -1.25em;
		line-height: 1.1;
		color: #FFF;
		-webkit-box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
		-moz-box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
		box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
	}
	li.asideindex2 a {
		display: block;
		padding: 3px 90px 6px 2em;
		background: #0090c2;
		-moz-border-radius: 15px;
		-webkit-border-radius: 15px;
		border-radius: 15px;
		border: solid 3px #FFF;
		width: 206px;
		font-size: 14px;
		text-indent: -1.25em;
		line-height: 1.2;
		color: #FFF;
		-webkit-box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
		-moz-box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
		box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
	}
	li.asideindex a:hover, li.asideindex2 a:hover {
		background: #FFF;
		color: #0090c2;
	}
	li.asideindex_pre {
		display: block;
		padding: 5px 90px 5px 2em;
		background: #FFF;
		-moz-border-radius: 20px;
		-webkit-border-radius: 20px;
		border-radius: 20px;
		border: solid 3px #FFF;
		width: 206px;
		font-size: 16px;
		text-indent: -1.25em;
		line-height: 1.2;
		color: #0090c2;
		-webkit-box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
		-moz-box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
		box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
	}
	li.asideindex_pre2 {
		display: block;
		padding: 3px 90px 6px 2em;
		background: #FFF;
		-moz-border-radius: 15px;
		-webkit-border-radius: 15px;
		border-radius: 15px;
		border: solid 3px #FFF;
		width: 206px;
		font-size: 15px;
		text-indent: -1.25em;
		line-height: 1.2;
		color: #0090c2;
		-webkit-box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
		-moz-box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
		box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
	}

	li.asideindex_s a {
		display: block;
		margin: 0 0 4px 0;
		padding: 3px 90px 3px 2em;
		background: #0090c2;
		-moz-border-radius: 20px;
		-webkit-border-radius: 20px;
		border-radius: 20px;
		border: solid 1px #FFF;
		width: 206px;
		font-size: 14.5px;
		text-indent: -1.25em;
		line-height: 1.2;
		color: #FFF;
		-webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.2);
		-moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.2);
		box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.2);
	}
	li.asideindex_s a:hover {
		background: #FFF;
		color: #0090c2;
	}
	li.asideindex_s_pre {
		display: block;
		padding: 5px 90px 5px 2em;
		background: #FFF;
		-moz-border-radius: 20px;
		-webkit-border-radius: 20px;
		border-radius: 20px;
		border: solid 1px #FFF;
		width: 206px;
		font-size: 14px;
	  text-indent: -1.25em;
		line-height: 1.2;
		color: #0090c2;
		-webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.2);
		-moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.2);
		box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.2);
	}

	li.asidemargin {
		height:8px;
	}
	li.asidemargin span {
		display: none;
	}
	.footer a, .footercopy {
		margin: 0;
		padding: 3px 0 0 0;
		color:#FFFFFF;
		line-height:1 !important;
	}
	.footer {
		font-size:12px;
	}
	.footercopy {
		font-size:10px;
	}
	.footer a:hover {
		text-decoration:underline;
	}
}
.guidance:before {
	font-family: 'FontAwesome' ;
	padding-right: 8px;
	content: '\f0eb';
}
.leanmore:before {
	font-family: 'FontAwesome' ;
	padding-right: 8px;
	content: '\f19d';
}
.leader:before {
	font-family: 'FontAwesome' ;
	padding-right: 8px;
	content: '\f02d';
}
.movie:before {
	font-family: 'FontAwesome' ;
	padding-right: 8px;
	content: '\f03d';
}
/* ==|== story Last page ================== */
ul.lastmenu {
	margin: 0 auto;
}
ul.lastmenu li {
	margin: 0 auto;
	padding: 0;
	font-size: 17px;
	line-height: 1.1;
	display: block;
}
ul.lastmenu li a {
	margin: 0 auto;
	padding-top:60px;
	width: 233px;
	height: 80px;
	text-align: center;
	color: #0060af;
	font-weight: 500;
	background: url(../../../projects/icons_story/bg_btncloud.png) no-repeat 0 0;
	display: block;
}
ul.lastmenu li a:hover {
	opacity: 0.75;
	filter: alpha(opacity=75);
	-ms-filter: "alpha(opacity=75)";
}
@media screen and (min-width: 800px) {
	ul.lastmenu {
		margin: 50px 0 0 0;
		display: table;
	}
	ul.lastmenu li, ul.lastmenu li a {
		height: 150px;
		display: table-cell;
	}
}

.lastmenuOne a {
	margin: 20px auto 0 auto;
	padding-top:60px;
	font-size: 16px;
	line-height: none;
	display: block;
	width: 233px;
	height: 80px;
	text-align: center;
	color: #0060af;
	background: url(../../../projects/icons_story/bg_btncloud.png) no-repeat 0 0;
	display: block;
}

ul.lastmenu2 {
	margin: 5px auto;
}
ul.lastmenu2 li {
	margin: 0 0 10px 0;
	font-size: 17px;
	line-height: 1.1;
	font-weight: 500;
}
ul.lastmenu2 li a {
	margin: 20px auto;
	display: block;
	padding: 10px;
	background: #0060af;
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	border-radius: 30px;
	border: solid 3px #0060af;
	width: 280px;
	color: #FFF;
	text-align: center;
	letter-spacing: 0.1em;
	-webkit-box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
	box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
}
ul.lastmenu2 li a:hover {
	background: #FFF;
	border-color: #FFF;
	color: #0090c2;
}

/* ==|== Other than the story page ============================================= */

/* ==|== guidance menu ================== */

ul.inmenu {
	margin: 10px 0 0 0;
}
ul.inmenu li {
	margin: 0 0 5px 0;
	font-size: 16px;
	font-weight: 500;
	color: #FFFFFF;
}
ul.inmenu li a {
	margin: 20px 0 0 0;
	display: block;
	padding: 5px;
	background: #0060af;
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	border-radius: 30px;
	border: solid 3px #0060af;
	width: 250px;
	line-height: 1.1;
	font-weight: 500;
	color: #FFF;
	text-align: center;
	letter-spacing: 0.1em;
	-webkit-box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
	box-shadow: 4px 4px 6px 0px rgba(0,0,0,0.3);
}
ul.inmenu li a:hover {
	background: #FFF;
	border-color: #FFF;
	color: #0090c2;
}


/* ==|== Other than the story page common ================== */
hr.punctuation {
	margin: 20px 0 10px 0;
	border: 0;
	height: 20px;
	background:url(../../../common/icons/hr_diagonal.png) repeat-x;
}
div.normalparagraph {
	margin: 10px 0;
	padding: 15px 5%;
	display: block;
	background: #FFF;
	font-family:'DIN Next W04'; font-style: normal;
}
@media screen and (min-width: 800px) {
	div.normalparagraph {
		padding: 15px 30px;
	}
}
div.normalparagraph img {
	object-fit: contain;
	max-width:100%;
}
@media screen and (min-width: 600px) {
div.normalparagraph img.smallimage {
	object-fit: contain;
	width:80%;
}
div.normalparagraph img.smallimage90 {
	object-fit: contain;
	width:90%;
}
}
div.normalparagraph h4 {
	margin: 15px 0 15px 0;
	padding-top: 17px;
	font-size: 17px;
	letter-spacing: 0.02em;
	font-family:'DIN Next W04'; font-style: normal;
	border-top: 1px solid #0090c2;
	color:#0090c2;
}
div.normalparagraph h4 ruby {
	font-weight: 600;
}
div.normalparagraph h4.noline {
	border:none;
}
div.normalparagraph h5 {
	margin: 10px 0 10px 0;
	padding-top: 16px;
	font-size: 15px;
	letter-spacing: 0.02em;
	font-family:'DIN Next W04'; font-style: normal;
	color:#0090c2;
}
div.normalparagraph h5.h5ol {
	padding-left: 1.5em;
	text-indent: -1.5em;
}
div.normalparagraph h6 {
	margin: 10px 0 10px 0;
	padding-top: 15px;
	font-size: 15px;
	letter-spacing: 0.02em;
	font-family:'DIN Next W04'; font-style: normal;
	color:#0090c2;
}
div.normalparagraph p {
	padding: 14px 0;
	font-size: 14px;
	color: #000;
	background:url(../../../projects/icons_story/bg_note.png) repeat;
	line-height:35px;
}
div.normalparagraph p.noline {
	padding: 0 0 15px 0;
	font-size: 14px;
	line-height: 1.4!important;
	color: #000;
	background:none!important
}
div.normalparagraph p rt {
	font-family: sans-serif!important;
}
div.normalparagraph p a, div.normalparagraph li.normalli a {
	color:#0090c2;
}
div.normalparagraph p a:hover, div.normalparagraph li.normalli a:hover {
	text-decoration:underline;
}
div.normalparagraph li.normalli {
	margin: 0 0 0 15px;
	padding: 5px 0;
	font-size: 14px;
	list-style-type: disc;
	list-style-position: outside;
}
.col_list {
	padding: 10px;
	border: 2px solid rgba(81,185,240,0.3);
}
p.asterisk {
	padding: 5px 0 5px 1em !important;
	background:none !important;
	text-indent:-1em;
}
li.peferencehead {
	font-size: 15px;
	margin-top:20px;
	list-style: none;
	font-weight: 500;
	line-height:2.2;
	font-weight: 600;
}
li.list_peference {
	font-size: 14px;
	margin-top:10px;
	padding: 0 0 0 2.5em;
	text-indent: -1em;
	line-height:2.2;
	font-weight: 600;
}
li.list_peference_en {
	font-size: 14px;
	margin-top:10px;
	padding: 0 0 0 2.5em;
	line-height:2.2;
	font-weight: 600;
}
.peferencehead ruby, .list_peference ruby {
	font-weight:600;
}
li.list_peference_d {
	font-size: 14px;
	margin-top:0;
	padding: 0 0 5px 2.5em;
	line-height:2.2;
}
li.list_peference_d_hr {
	font-size: 14px;
	margin:0 0 0 2.5em;
	line-height:2.2;
	border-top: #e0e0e0 solid 1px;
}
li.list_peference hr {
	margin: 0;
	padding:0;
}
li.peferencehead a, li.list_peference a, li.list_peference2 a {
	color: #0090c2;
}
li.peferencehead a:hover, li.list_peference a:hover, li.list_peference2 a:hover {
	text-decoration: underline;
}
li.list_peference:before {
	font-family: 'FontAwesome' ;
	padding: 2px 5px 0 0;
	content: '\f054';
	color: #0090c2;
}
li.list_peference2 {
	font-size: 14px;
	padding: 0 0 5px 4em;
	text-indent: -1em;
}
li.list_peference2:before {
	font-family: 'FontAwesome' ;
	padding: 2px 5px 0 0;
	content: '\f105';
	color: #0090c2;
}

/* ==|== Quiz ============================================= */
p.question {
	padding-left: 1.5em;
	text-indent: -1.5em;
	font-size: 16px;
	font-weight: 500;
}
p.question ruby {
	font-weight: 500;
}
p.question:before {
	font-family: 'FontAwesome' ;
	padding: 2px 5px 0 0;
	content: '\f059';
	font-size: 120%;
}
div.correctanswer {
	display: block;
	margin: 10px 0 20px 25px !important;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;
	border: solid 1px #FFF;
	color:#FFF;
}
.correctanswer p {
	padding: 10px 10px 10px 5em;
	text-indent: -4em;
}

/* ==|== Quiz iframe ======== */
#quizwin {
	background:#FFF;
	text-align: center;
	font-family:'DIN Next W04';
	overflow:auto;
}
#quizwin div {
	margin:0 auto;
	padding:10px;
	width:auto;	}
#quizwin div p {
	font-weight: 500;
	font-size: 17px;
}
.quiz_correct {
	background: url(../../../projects/icons_story/bg_quiz_correct_s2.png) no-repeat center;
	color:#cc0000;
}
.quiz_incorrect {
	background:url(../../../projects/icons_story/bg_quiz_incorrect_s2.png) no-repeat center;
	color:#0090c2;
}
.quiz_correct, .quiz_incorrect {
	display: block;
	margin: 0 auto;
	padding: 10px 0 0 0;
	width: 200px;
	height: 140px;
	font-size: 20px !important;
	text-aling:center;
}

/* ==|== Point ============================================= */
p.point {
	padding: 15px 15px 15px 1.5em;
	text-indent: -1.5em;
	font-size: 16px;
	font-weight: 500;
}
p.point:before {
	font-family: 'FontAwesome' ;
	padding: 2px 5px 0 0;
	content: '\f0a4';
	font-size: 120%;
	color: #FFCC00;
}
@media screen and (min-width: 800px) {
	p.point {
		font-size: 18px;
	}
}
/* ==|== More detail table ============================================= */
.col_tableformobile {
	width:100%;
	overflow-x:scroll;
	-webkit-overflow-scrolling: touch;
}
table.normaltable {
	border-collapse:collapse;
	border-left: 2px solid #51b9f0;
	border-bottom: 2px solid #51b9f0;
	font-size: 15px;
	table-layout: fixed;
	font-family:'DIN Next W04';
	font-style: normal;
	clear:both;
}
.table_w_adj {
	width:200%;
}
.table_w_adj150 {
	width:150%;
}
.tablenotice {
	padding-left:15px;
	font-size: 13px !important;
	color:#0090c2 !important;
	background:none !important;
	line-height: 1.2 !important;
	text-align:right;
}
.tablenotice:before {
	font-family: 'FontAwesome' ;
	padding: 2px 5px 0 0;
	content: '\f061';
	color: #0090c2;
}
table.normaltable th {
	word-wrap: break-word;
	padding: 7px 5px 5px 5px;
	border-top: 2px solid #51b9f0;
	border-right: 2px solid #51b9f0;
	text-align:left;
	font-weight: 600;
	vertical-align:middle;
}
table.normaltable th ruby {
	font-weight: 600;
}
table.normaltable th.thheder {
	background:#99dcff;
	text-align:center;
	font-weight: 400;
}
table.normaltable th.thheder2 {
	background:#cceeff;
	font-weight: 400;
}
table.normaltable td {
	display: table-cell;
	word-wrap: break-word;
	padding: 5px;
	border-top: 2px solid #51b9f0;
	border-right: 2px solid #51b9f0;
	font-weight: 400;
	vertical-align:middle;
}
td.fig_sdgs {
	text-align:center;
	vertical-align: middle;
}
td.fig_sdgs img {
	padding:3px;
}
@media screen and (min-width: 800px) {
	.col_tableformobile {
		overflow:auto;
	}
	table.normaltable {
		font-size: 18px;
	}
	.table_w_adj, .table_w_adj150 {
		width:100%;
	}
	.tablenotice {
		display:none;
	}
}
table.ecocertification {
	border-collapse:collapse;
	font-size: 14px;
	table-layout: fixed;
	font-family:'AXIS Font Japanese W55'; font-style: normal;
	clear:both;
	text-align:left;
}
table.ecocertification th {
	padding: 10px 0px;
	color:#0090c2;
	font-size: 16px;
	font-weight:600;
	border-top: 1px solid #99dcff;
}
table.ecocertification td {
	text-align:left;
}
table.ecocertification td.mark {
	width:120px;
}
table.ecocertification td.mark img {
	width:110px;
}
table.redlisttable {
	border-collapse:collapse;
	font-size: 15px;
	table-layout: fixed;
	clear:both;
}
table.redlisttable th {
	border-right: 2px solid #fff;
}
table.redlisttable th.threatenedcategories {
	border-left:3px solid #000;
	border-top:3px solid #000;
	border-bottom:3px solid #000;
}
table.redlisttable th, table.redlisttable td {
                                padding:3px;
                                font-weight:600;
}
table.redlisttable ul {
                                margin:5px 0 0 1em;
}
table.redlisttable li {
                                padding-left:1em;
                                text-indent:-1em;
                                list-style: square;
                                list-style-position: inside;
}
table.redlisttable li.wexample  {
                                padding-left:0.6em;
                                list-style: none!important;
                                font-weight:600;
}
table.redlisttable li.wexample:before {
	font-family: 'FontAwesome' ;
	padding: 2px 5px 0 0;
	content: '\f063';
	font-size: 110%;
}
/* ==|== Teaching Methods ============================================= */
p.tm_detail {
	padding: 5px 0 5px 2em !important;
	background:none !important;
	line-height: 1.4 !important;
}
p.tm_detailasterisk {
	padding: 5px 0 5px 3em !important;
	background:none !important;
	text-indent:-1em;
}
ul.tm_detaillist {
	margin-left:2em;
	font-size:14px;
}
ul.tm_detaillist li.disc {
	padding: 5px 0;
	list-style:disc;
}
ul.tm_detaillist li.number {
	padding: 5px 0;
	list-style:none;
	padding-left:1em;
	text-indent:-1em;
}
/* ==|== special column ============================================= */

div.col_special {
	margin: 10px 0 30px 0;
	padding: 15px!important;
	display: block;
	background: #FFF;
	border: 3px solid #f19500;
}
div.col_special h4 {
	font-size: 22px;
	letter-spacing: 0.02em;
	font-weight: 600; font-style: normal;
	color:#0090c2;
}
@media screen and (min-width: 800px) {
	div.col_special {
		background: #FFF url(../../../projects/character/chara_jp57b.png) no-repeat right center;
		background-size:30% auto;
	}
}


/* ==|== Other than the story page common FOR PC ================== */
@media screen and (min-width: 800px) {
	hr.punctuation {
		margin: 15px 0;
		border: 0;
		height: 133px;
		background:url(../../../common/icons/hr_cloud.png) no-repeat;
	}
	p.question {
	font-size: 20px;
	}
	ul.inmenu li {
		font-size: 18px;
	}
	div.normalparagraph h4 {
		font-size: 24px;
	}
	div.normalparagraph h5 {
		font-size: 20px;
	}
	div.normalparagraph h5.peferenceh5 {
		font-size: 21px;
	}
	div.normalparagraph h6 {
		font-size: 16px;
	}
	div.normalparagraph p, div.normalparagraph p.noline, div.normalparagraph li.normalli {
		font-size: 18px;
	}
	li.peferencehead {
		font-size: 18px;
	}
	li.list_peference, li.list_peference_en, li.list_peference_d, li.list_peference_d_hr, li.list_peference2 {
		font-size: 16px;
	}
	ul.tm_detaillist {
		font-size:18px;
	}
}

/* ==|== Individual image adjustment ================== */
@media screen and (min-width: 800px) {
	.fig_w80 {
		width:80%!important;
	}
	.fig_w90 {
		width:90%!important;
	}
}
