@charset "UTF-8";
/*
===== CONTENTS ===========================================

	1: reset
	2: basic elements

	3: global style reset

	4: EJ common
	5: EJ head
	6: EJ body
	7: EJ foot
	
	8: content base layout
	9: parts

==========================================================
===== BREAK POINT (main only) ============================

	body	size: 930px
	page	size: 890px
	smart	size: 601px (min-width)

==========================================================
*/
/* =========================================================
	1: reset
========================================================= */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section,
summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

img {
	vertical-align: bottom;
}

ol, ul {
	list-style: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

input, select {
	vertical-align: middle;
}

fieldset {
	border: none;
}

iframe {
	display: block;
}

/* ------------------------------------------------------ */
body {
	-webkit-font-smoothing: antialiased;
	font: 12px "Arial", "Helvetica", sans-serif;
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-o-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

body #lesson-box {
	font-size: 14px;
	font-style: normal;
	font-family: "Arial", "Helvetica", sans-serif;
	color: #1f1f1f;
	line-height: 1.4;
}

#lesson-box a {
	color: #1f1f1f;
	text-decoration: none;
	overflow: hidden;
	outline: none;
}
#lesson-box a:hover {
	text-decoration: none;
}
#lesson-box a:img {
	border: none;
	outline: none;
}
#lesson-box hr {
	display: block;
	height: 0;
	margin: 0;
	padding: 0;
	border: 0;
}
#lesson-box strong {
	color: #ff6f76;
	font-weight: normal;
}
#lesson-box em {
	font-style: normal;
	font-weight: bold;
}
#lesson-box img {
	border: 0;
	-ms-interpolation-mode: bicubic;
}
#lesson-box select {
	font-family: "Arial", "Helvetica", sans-serif;
	font-size: 14px;
}
#lesson-box select input {
	vertical-align: top;
}

/* =========================================================
	2: basic elements
========================================================= */
/* fonts
--------------------------------------------------------- */
/* Proxima Nova Regular */
@font-face {
	font-family: 'proxima_nova_rgregular';
	src: url("/common/fonts/proximanova_regular_macroman/ProximaNova-Reg-webfont.eot");
	src: url("/common/fonts/proximanova_regular_macroman/ProximaNova-Reg-webfont.eot?#iefix") format("embedded-opentype"), url("/common/fonts/proximanova_regular_macroman/ProximaNova-Reg-webfont.woff") format("woff"), url("/common/fonts/proximanova_regular_macroman/ProximaNova-Reg-webfont.ttf") format("truetype"), url("/common/fonts/proximanova_regular_macroman/ProximaNova-Reg-webfont.svg#proxima_nova_rgregular") format("svg");
	font-weight: normal;
	font-style: normal;
}
/* Proxima Nova Semibold */
@font-face {
	font-family: 'proxima_nova_ltsemibold';
	src: url("/common/fonts/proximanova_semibold_macroman/ProximaNova-Sbold-webfont.eot");
	src: url("/common/fonts/proximanova_semibold_macroman/ProximaNova-Sbold-webfont.eot?#iefix") format("embedded-opentype"), url("/common/fonts/proximanova_semibold_macroman/ProximaNova-Sbold-webfont.woff") format("woff"), url("/common/fonts/proximanova_semibold_macroman/ProximaNova-Sbold-webfont.ttf") format("truetype"), url("/common/fonts/proximanova_semibold_macroman/ProximaNova-Sbold-webfont.svg#proxima_nova_ltsemibold") format("svg");
	font-weight: normal;
	font-style: normal;
}
/* Proxima Nova Bold */
@font-face {
	font-family: 'proxima_nova_rgbold';
	src: url("/common/fonts/proximanova_bold_macroman/ProximaNova-Bold-webfont.eot");
	src: url("/common/fonts/proximanova_bold_macroman/ProximaNova-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("/common/fonts/proximanova_bold_macroman/ProximaNova-Bold-webfont.woff") format("woff"), url("/common/fonts/proximanova_bold_macroman/ProximaNova-Bold-webfont.ttf") format("truetype"), url("/common/fonts/proximanova_bold_macroman/ProximaNova-Bold-webfont.svg#proxima_nova_rgbold") format("svg");
	font-weight: normal;
	font-style: normal;
}
/* Proxima Nova Condensed Regular */
@font-face {
	font-family: 'ProximaNovaCnRgRegular';
	src: url("/common/fonts/proximanovacondensed_regular_macroman/ProximaNovaCond-Reg-webfont.eot");
	src: url("/common/fonts/proximanovacondensed_regular_macroman/ProximaNovaCond-Reg-webfont.eot?#iefix") format("embedded-opentype"), url("/common/fonts/proximanovacondensed_regular_macroman/ProximaNovaCond-Reg-webfont.woff") format("woff"), url("/common/fonts/proximanovacondensed_regular_macroman/ProximaNovaCond-Reg-webfont.ttf") format("truetype"), url("/common/fonts/proximanovacondensed_regular_macroman/ProximaNovaCond-Reg-webfont.svg#ProximaNovaCnRgRegular") format("svg");
	font-weight: normal;
	font-style: normal;
}
/* Proxima Nova Condensed Semibold */
@font-face {
	font-family: 'ProximaNovaCnLtSemibold';
	src: url("/common/fonts/proximanovacondensed_semibold_macroman/ProximaNovaCond-Sbold-webfont.eot");
	src: url("/common/fonts/proximanovacondensed_semibold_macroman/ProximaNovaCond-Sbold-webfont.eot?#iefix") format("embedded-opentype"), url("/common/fonts/proximanovacondensed_semibold_macroman/ProximaNovaCond-Sbold-webfont.woff") format("woff"), url("/common/fonts/proximanovacondensed_semibold_macroman/ProximaNovaCond-Sbold-webfont.ttf") format("truetype"), url("/common/fonts/proximanovacondensed_semibold_macroman/ProximaNovaCond-Sbold-webfont.svg#ProximaNovaCnLtSemibold") format("svg");
	font-weight: normal;
	font-style: normal;
}
/* Proxima Nova Condensed Bold */
@font-face {
	font-family: 'ProximaNovaCnRgBold';
	src: url("/common/fonts/proximanovacondensed_bold_macroman/ProximaNovaCond-Bold-webfont.eot");
	src: url("/common/fonts/proximanovacondensed_bold_macroman/ProximaNovaCond-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("/common/fonts/proximanovacondensed_bold_macroman/ProximaNovaCond-Bold-webfont.woff") format("woff"), url("/common/fonts/proximanovacondensed_bold_macroman/ProximaNovaCond-Bold-webfont.ttf") format("truetype"), url("/common/fonts/proximanovacondensed_bold_macroman/ProximaNovaCond-Bold-webfont.svg#ProximaNovaCnRgBold") format("svg");
	font-weight: normal;
	font-style: normal;
}
.ft_rr {
	font-family: 'proxima_nova_rgregular', Arial, Helvetica, sans-serif;
}

.ft_rb {
	font-family: 'proxima_nova_rgbold', Arial, Helvetica, sans-serif;
}

.ft_crr {
	font-family: 'ProximaNovaCnRgRegular', Arial, Helvetica, sans-serif;
}

.ft_crsb {
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
}

.ft_crb {
	font-family: 'ProximaNovaCnRgBold', Arial, Helvetica, sans-serif;
}

/* fonts Burmese
--------------------------------------------------------- */
/* Padauk */
@font-face {
	font-family: 'Padauk';
	src: url("/common/fonts/Padauk/Padauk.eot");
	src: url("/common/fonts/Padauk/Padauk.eot?#iefix") format("embedded-opentype"), url("/common/fonts/Padauk/Padauk.woff") format("woff"), url("/common/fonts/Padauk/Padauk.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
}
/* Padauk-bold */
@font-face {
	font-family: 'Padauk';
	src: url("/common/fonts/Padauk/Padauk-bold.eot");
	src: url("/common/fonts/Padauk/Padauk-bold.eot?#iefix") format("embedded-opentype"), url("/common/fonts/Padauk/Padauk-bold.woff") format("woff"), url("/common/fonts/Padauk/Padauk-bold.ttf") format("truetype");
	font-weight: bold;
	font-style: normal;
}
/* Padauk-book */
@font-face {
	font-family: 'Padauk-book';
	src: url("/common/fonts/Padauk/Padauk-book.eot");
	src: url("/common/fonts/Padauk/Padauk-book.eot?#iefix") format("embedded-opentype"), url("/common/fonts/Padauk/Padauk-book.woff") format("woff"), url("/common/fonts/Padauk/Padauk-book.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
}
/* Padauk-bookbold */
@font-face {
	font-family: 'Padauk-book';
	src: url("/common/fonts/Padauk/Padauk-bookbold.eot");
	src: url("/common/fonts/Padauk/Padauk-bookbold.eot?#iefix") format("embedded-opentype"), url("/common/fonts/Padauk/Padauk-bookbold.woff") format("woff"), url("/common/fonts/Padauk/Padauk-bookbold.ttf") format("truetype");
	font-weight: bold;
	font-style: normal;
}
/* ------------------------------------------------------ */
/* selection
--------------------------------------------------------- */
/* clearfix
--------------------------------------------------------- */
.clearfix:before,
.clearfix:after {
	content: "\0020";
	display: block;
	height: 0;
	visibility: hidden;
}

.clearfix:after {
	clear: both;
}

.clearfix {
	zoom: 1;
}

/* float */
.colL {
	float: left;
}

.colR {
	float: right;
}

/* table
--------------------------------------------------------- */
table {
	width: 100%;
	border-top: 1px solid #707070;
	border-right: 1px solid #707070;
}
table th,
table td {
	padding: 4px 8px;
	border-bottom: 1px solid #707070;
	border-left: 1px solid #707070;
	font-weight: bold;
	text-align: left;
}
table th {
	font-weight: bold;
}

/* lists
--------------------------------------------------------- */
ul.basic-l,
ul.basic-s,
ul.arrow {
	margin: 9px 0;
}

ul.basic-l li {
	margin-top: 6px;
	line-height: 1.4;
	padding-left: 9px;
	background: url("/nhkworld/english/common/images/li_square_l.gif") no-repeat 0 0.5em;
}

ul.basic-s li {
	margin-top: 6px;
	line-height: 1.4;
	padding-left: 8px;
	background: url("/nhkworld/english/common/images/li_square_s.gif") no-repeat 0 0.5em;
}
@media only screen and (max-width: 320px) {
	ul.basic-s li {
		padding-bottom: 10px;
	}
}

ul.arrow li {
	margin-top: 6px;
	line-height: 1.4;
	padding-left: 9px;
	background: url("/nhkworld/english/common/images/li_arrow_next.gif") no-repeat 0 0.5em;
}

ol.basic,
ol.alpha {
	padding-left: 20px;
}

ol.basic li {
	margin-top: 6px;
	line-height: 1.4;
	list-style: decimal;
}

ol.alpha li {
	margin-top: 6px;
	line-height: 1.4;
	list-style: lower-alpha;
}

ol.upalpha {
	padding-left: 15px;
}

ol.upalpha li {
	margin-top: 6px;
	line-height: 1.4;
	list-style: upper-alpha;
}

/* ------------------------------------------------------ */
/* text */
strong.strong {
	font-weight: bold;
}

/* =========================================================
	3: global style reset
========================================================= */
/* nw_page
--------------------------------------------------------- */
#nw_page {
	max-width: 100%;
	margin: 0;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

@media only screen and (min-width: 601px) {
	#nw_page {
		max-width: inherit;
		width: 100%;
		min-width: 930px;
	}
}
/* headBox
--------------------------------------------------------- */
#headBox {
	margin: 0 auto;
}

/* mainBox
--------------------------------------------------------- */
#mainBox {
	width: 100%;
	clear: both;
}

@media only screen and (min-width: 601px) {
	#mainBox {
		min-width: 930px;
		margin: 0 auto;
	}
}
#headNavUpper #toLesson a {
	background-color: #666;
	text-shadow: #444 2px 2px 1px;
}

#headNavUpper #toLesson a span.ds {
	filter: dropshadow(color=#555555, offx=1, offy=1, positive=true);
}

/* topic path */
#topic-path {
	display: none;
}

@media only screen and (min-width: 601px) {
	#topic-path {
		display: block;
		width: 890px;
		margin: 0 auto;
		padding: 5px 20px;
		border: none !important;
		font-size: 12px;
		line-height: 1.2;
		color: #949494;
	}
	#topic-path a {
		color: #949494;
		text-decoration: none;
	}
	#topic-path a:hover {
		text-decoration: underline;
	}
	#topic-path a:visited {
		color: #949494;
	}
	#topic-path em {
		font-style: normal;
		font-weight: bold;
		color: #1f1f1f !important;
	}
}
/* lesson box */
@media only screen and (min-width: 601px) {
	#lesson-box {
		width: 100%;
		min-width: 1168px;
	}
}
/* headings */
#lesson-box h1, #lesson-box h2, #lesson-box h3, #lesson-box h4, #lesson-box h5, #lesson-box h6 {
	margin: 0;
	padding: 0;
	font-weight: normal;
}

/* display
--------------------------------------------------------- */
.spNoDisplay {
	display: none;
}

.spDisplay {
	display: block;
}

@media only screen and (min-width: 601px) {
	.spNoDisplay {
		display: block;
	}

	.spDisplay {
		display: none;
	}
}
/* =========================================================
	4: EJ common
========================================================= */
/* lessonBody
--------------------------------------------------------- */
#lesson-box {
	width: 100%;
}
#lesson-box a:hover, #lesson-box a:focus {
	text-decoration: none;
}

.ej-wrapper {
	width: 100%;
}
@media only screen and (min-width: 601px) {
	.ej-wrapper {
		width: 930px;
		margin: 0 auto;
	}
}

/* SNS
--------------------------------------------------------- */
.ej-sns {
	text-align: right;
	color: #000;
	font-size: 12px;
	font-family: "Arial", "Helvetica", sans-serif !important;
}
.ej-sns #nhksocialbtn_en {
	float: right;
	width: 161px !important;
}
.ej-sns span {
	clear: both;
	display: block;
	padding-top: 2px;
}

/* =========================================================
	5: EJ head
========================================================= */
/* clearfix */
#ej-haed {
	zoom: 1;
}
#ej-haed:before, #ej-haed:after {
	display: block;
	height: 0;
	visibility: hidden;
	content: "\0020";
}
#ej-haed:after {
	clear: both;
}

#ej-haed .spNoDisplay {
	display: none;
}

#ej-haed .spDisplay {
	display: block;
}

@media only screen and (min-width: 601px) {
	#ej-haed .spNoDisplay {
		display: block;
	}

	#ej-haed .spDisplay {
		display: none;
	}
}
#ej-haed {
	position: relative;
	width: 100%;
	height: 80px;
	line-height: 1;
}
#ej-haed #ej-logo {
	width: auto;
	margin: 0 4%;
	padding: 12px 0 0;
	color: #27b53a;
}
#ej-haed #ej-logo h1 {
	line-height: 1;
}
#ej-haed #ej-logo h1 img {
	width: 203px;
	height: auto;
}
#ej-haed #ej-logo h2 {
	font-size: 20px;
	font-weight: bold;
}
#ej-haed #ej-logo a {
	color: #27b53a;
}
#ej-haed #ej-haed-nav {
	position: relative;
	z-index: 99999999;
	margin-top: 2px;
}
#ej-haed #ej-haed-nav h1 {
	position: absolute;
	top: -64px;
	right: 0;
}
#ej-haed #ej-haed-nav a:hover {
	color: #1f1f1f;
}

@media only screen and (min-width: 601px) {
	#ej-haed {
		max-width: 890px;
		height: 107px;
		margin: 0 auto;
	}
	#ej-haed #ej-logo {
		height: 36px;
		margin: 0;
		overflow: hidden;
	}
	#ej-haed #ej-logo h1 {
		display: inline-block;
	}
	#ej-haed #ej-logo h1 img {
		position: relative;
		top: -5px;
		vertical-align: middle;
	}
	#ej-haed #ej-logo h2 {
		display: inline-block;
		height: 36px;
		margin-left: 10px;
		padding-left: 12px;
		border-left: 2px solid #a1e0a9;
		font-size: 30px;
		line-height: 1.2;
	}
	#ej-haed #ej-haed-nav {
		width: 890px;
		margin-top: 19px;
	}
}
/* Flexnav
--------------------------------------------------------- */
.ej-hn {
	-webkit-transition: none;
	-moz-transition: none;
	-ms-transition: none;
	transition: none;
	-webkit-transform-style: preserve-3d;
	overflow: hidden;
	width: 100%;
	max-height: 0;
	margin: 0 auto;
	border-top: 1px solid rgba(66, 194, 83, 0.7);
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	font-size: 18px;
}
.ej-hn.opacity {
	opacity: 0;
}
.ej-hn.flexnav-show {
	max-height: 2000px;
	opacity: 1;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}
.ej-hn li {
	font-size: 100%;
	position: relative;
	overflow: hidden;
}
.ej-hn li a,
.ej-hn li .nolink {
	position: relative;
	display: block;
	padding: 18px .96em;
	z-index: 2;
	overflow: hidden;
	color: #1f1f1f;
	background: #d1f0d6;
	border-bottom: 1px solid rgba(66, 194, 83, 0.7);
}
.ej-hn li a .arw,
.ej-hn li .nolink .arw {
	position: absolute;
	top: 19px;
	right: 4%;
	display: inline-block;
	width: 8px;
	height: 14px;
	background-image: url("/lesson/common/images/ej_icon_x2.png");
	background-size: 70px auto;
	background-position: 100% -212px;
	background-repeat: no-repeat;
}
.ej-hn li .nolink a .arw {
	display: none;
}
.ej-hn li .nolink ul li a .arw {
	display: inline-block;
}
.ej-hn li ul {
	width: 100%;
}
.ej-hn li ul li {
	font-size: 100%;
	position: relative;
	overflow: hidden;
}
.ej-hn li ul.flexnav-show li {
	overflow: visible;
}
.ej-hn li ul li a {
	display: block;
	background: #e7f8ea;
}
.ej-hn ul li ul li a {
	background: #a0e0a9;
}
.ej-hn ul li ul li ul li a {
	background: #b3e7ba;
}
.ej-hn .touch-button {
	position: absolute;
	z-index: 999999999;
	top: 0;
	right: 0;
	width: 100%;
	height: 55px;
	display: inline-block;
}
.ej-hn .touch-button:hover {
	cursor: pointer;
}
.ej-hn .touch-button .navicon {
	position: relative;
	top: 18px;
	left: 92%;
	display: inline-block;
	width: 13px;
	height: 13px;
	background-image: url("/lesson/common/images/ej_icon_x2.png");
	background-size: 70px auto;
	background-position: 0 -240px;
	background-repeat: no-repeat;
	text-indent: -9999em;
	color: #1f1f1f;
}
.ej-hn .touch-button.active .navicon {
	background-position: 100% -240px;
}

.menu-button {
	position: relative;
	display: block;
	width: 64px;
	height: 64px;
	padding: 0;
	background: rgba(66, 194, 83, 0.7);
	text-indent: -9999em;
	color: #ffffff;
	cursor: pointer;
}
.menu-button .touch-button {
	background: transparent;
	position: absolute;
	z-index: 99999;
	top: 19px;
	right: 19px;
	display: inline-block;
	width: 26px;
	height: 26px;
	background: url("/lesson/common/images/menu.png") 0 0 no-repeat;
	background-size: auto 26px;
	text-align: center;
}
.menu-button .touch-button.active {
	background-position: -45px 0;
}
.menu-button .touch-button .navicon {
	position: relative;
	top: 0;
	color: #ffffff;
	text-indent: -9999em;
}

@media only screen and (min-width: 601px) {
	.ej-hn {
		overflow: visible;
		border-top: none;
	}
	.ej-hn.opacity {
		opacity: 1;
	}
	.ej-hn.flexnav-show {
		-webkit-transition: none;
		-moz-transition: none;
		-ms-transition: none;
		transition: none;
	}
	.ej-hn li {
		position: relative;
		float: left;
		display: block;
		margin-left: 10px;
		padding-right: 11px;
		background: url("/lesson/common/images/dot_header.png") 100% 0 no-repeat;
		overflow: visible;
	}
	.ej-hn li#ej-hn01 {
		margin-left: 0;
	}
	.ej-hn li#ej-hn06 {
		padding-right: 0;
	}
	.ej-hn li a,
	.ej-hn li .nolink {
		background: #ffffff;
		border-bottom: none;
		text-align: center;
	}
	.ej-hn li a .arw,
	.ej-hn li .nolink .arw {
		display: none;
	}
	.ej-hn li .nolink {
		cursor: pointer;
	}
	.ej-hn li.item-with-ul .nolink {
		padding: 11px 50px 11px 20px;
	}
	.ej-hn li#ej-hn01 a,
	.ej-hn li#ej-hn06 a {
		padding: 11px 27px;
	}
	.ej-hn li#ej-hn01 a .arw,
	.ej-hn li#ej-hn06 a .arw {
		display: none;
	}
	.ej-hn li > ul {
		position: absolute;
		top: auto;
		left: 0;
		width: 160%;
	}
	.ej-hn li > ul li {
		width: 100%;
		margin-top: -2px;
		margin-left: 0;
		padding-right: 0;
		background-image: none;
	}
	.ej-hn li > ul li:first-child {
		margin-top: 0;
	}
	.ej-hn li ul li > ul {
		margin-left: 100%;
		top: 0;
	}
	.ej-hn li ul li a {
		text-align: left;
		padding: 12px 20px 12px 10px;
		border: 1px solid #63cd71;
		background: #e7f8ea !important;
	}
	.ej-hn li ul li a .arw {
		position: absolute;
		top: 1em;
		display: inline-block;
		width: 6px;
		height: 8px;
		background-image: url("/lesson/common/images/ej_icon.png");
		background-position: 100% -230px;
	}
	.ej-hn li ul li a:hover {
		background: #b3e6ba !important;
	}
	.ej-hn li ul.open {
		display: block;
		opacity: 1;
		visibility: visible;
		z-index: 1;
	}
	.ej-hn li ul.open li {
		overflow: visible;
		max-height: 100px;
	}
	.ej-hn li ul.open ul.open {
		margin-left: 100%;
		top: 0;
	}
	.ej-hn .touch-button {
		background: transparent;
		position: absolute;
		top: 0px;
		right: 11px;
		width: 40px;
		height: 40px;
		background: none;
	}
	.ej-hn .touch-button .navicon {
		display: inline-block;
		position: absolute;
		top: 14px;
		right: 14px;
		left: inherit;
		width: 11px;
		height: 15px;
		background-image: url("/lesson/common/images/ej_icon.png");
		background-position: 0 -280px;
	}
	.ej-hn .touch-button.active .navicon {
		background-position: 0 -280px;
	}

	.menu-button {
		display: none;
	}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	.ej-hn li ul li a .arw,
	.ej-hn .touch-button .navicon {
		background-image: url("/lesson/common/images/ej_icon_x2.png");
		background-size: 70px auto;
	}

	.ej-hn li {
		background-image: url("/lesson/common/images/dot_header_x2.png");
		background-size: 1px auto;
	}
}
/* =========================================================
	6: EJ body
========================================================= */
/* Background pattern from subtlepatterns.com */
/* clearfix */
#ej-body {
	zoom: 1;
}
#ej-body:before, #ej-body:after {
	display: block;
	height: 0;
	visibility: hidden;
	content: "\0020";
}
#ej-body:after {
	clear: both;
}

#ej-body {
	width: 100%;
	padding-bottom: 30px;
	background: url("/lesson/common/images/bg.png");
}

@media only screen and (min-width: 601px) {
	#ej-body {
		min-width: 930px;
	}
}
/* =========================================================
	7: EJ foot
========================================================= */
/* recommended
--------------------------------------------------------- */
#recommended {
	width: auto;
	margin: 20px 6% 22px;
	font-size: 14px;
}
#recommended h2,
#recommended h3 {
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	font-size: 16px;
}
#recommended h2 {
	margin-bottom: 8px;
}
#recommended h3 {
	position: relative;
	margin-bottom: 8px;
	padding-right: 22px;
}
#recommended h3 .arw {
	position: absolute;
	top: 0;
	right: -3px;
	display: inline-block;
	width: 18px;
	height: 18px;
	background-image: url("/lesson/common/images/ej_icon_x2.png");
	background-size: 70px auto;
	background-position: 100% -160px;
}
#recommended ul li {
	display: block;
	margin-top: 14px;
}
#recommended ul li:first-child {
	margin-top: 0;
}
#recommended ul li a {
	display: block;
	padding: 10px 12px 12px;
	border: 1px solid #bcbcbc;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
}
#recommended ul li .rmd-inner {
	position: relative;
	width: 100%;
	min-height: 60px;
}
#recommended ul li .rmd-inner img {
	position: absolute;
	top: 0;
	left: 0;
	width: 60px;
	height: auto;
}
#recommended ul li .rmd-inner p {
	margin-left: 74px;
}

@media only screen and (min-width: 601px) {
	#recommended ul {
		zoom: 1;
	}
	#recommended ul:before, #recommended ul:after {
		display: block;
		height: 0;
		visibility: hidden;
		content: "\0020";
	}
	#recommended ul:after {
		clear: both;
	}

	#recommended {
		width: 890px;
		margin: 20px auto 22px;
	}
	#recommended h3 .arw {
		background-image: url("/lesson/common/images/ej_icon.png");
		background-size: inherit;
	}
	#recommended ul li {
		margin-top: 0;
		float: left;
		width: 282px;
		margin-left: 22px;
	}
	#recommended ul li:first-child {
		margin-left: 0;
	}
	#recommended ul li a:hover {
		background: #fdfbf3;
	}
	#recommended ul li a:hover p {
		color: #1f1f1f;
	}
	#recommended ul li div p {
		width: 181px;
		margin-left: 14px;
	}
}
/* 2017 renewal */
#recommended .rmd-bnr li {
	display: block;
	margin-top: 14px;
}
#recommended .rmd-bnr li:first-child {
	margin-top: 0;
}
#recommended .rmd-bnr li a {
	padding: 0;
	border: none;
	-moz-border-radius: inherit;
	-webkit-border-radius: inherit;
	border-radius: inherit;
}
#recommended .rmd-bnr li a img {
	width: 100%;
	height: auto;
}

@media only screen and (min-width: 601px) {
	#recommended .rmd-bnr li {
		width: 290px;
		margin: 0 10px 10px 0;
	}
	#recommended .rmd-bnr li:nth-child(3n) {
		margin-right: 0;
	}
	#recommended .rmd-bnr li a:hover {
		background: inherit;
	}
}
/* EJ foot
--------------------------------------------------------- */
#ej-foot {
	width: 100%;
	padding: 16px 0 0;
	background: #a0dfa9;
	font-size: 13px;
}
#ej-foot .ej-wrapper {
	width: auto;
	margin: 0 4%;
}
#ej-foot h1 {
	position: relative;
	padding-bottom: 16px;
}
#ej-foot h1 img {
	width: 144px;
	height: auto;
}
#ej-foot h1 .foot-arw {
	position: absolute;
	top: 0;
	right: 0;
	display: inline-block;
	width: 30px;
	height: 30px;
	background: url("/lesson/common/images/ej_icon_x2.png");
	background-size: 70px auto;
	background-position: 100% 0;
	cursor: pointer;
}
#ej-foot h1 .foot-arw.active {
	background-position: 0 0;
}
#ej-foot #ej-foot-nav {
	margin-top: 6px;
	padding-bottom: 20px;
}
#ej-foot #ej-foot-nav h2 {
	margin-bottom: 12px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	font-size: 16px;
}
#ej-foot #ej-foot-nav .ej-fn li {
	margin-top: 16px;
}
#ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner {
	zoom: 1;
}
#ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner:before, #ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner:after {
	display: block;
	height: 0;
	visibility: hidden;
	content: "\0020";
}
#ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner:after {
	clear: both;
}
#ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner li {
	display: block;
	float: left;
	margin-top: 0;
	margin-right: 4px;
	margin-bottom: 4px;
}
#ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner li a {
	display: block;
	padding: 10px;
	border: 1px solid #66806a;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}
#ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner li a:hover {
	color: #1f1f1f;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 601px), only screen and (min-resolution: 2dppx) and (min-width: 601px) {
	#ej-foot #ej-foot-nav .ej-fn li {
		background-image: url("/lesson/common/images/dot_footer_x2.png");
		background-size: 1px auto;
	}
}
@media only screen and (min-width: 601px) {
	.ej-fn {
		zoom: 1;
	}
	.ej-fn:before, .ej-fn:after {
		display: block;
		height: 0;
		visibility: hidden;
		content: "\0020";
	}
	.ej-fn:after {
		clear: both;
	}

	#ej-foot {
		min-width: 930px;
		padding: 20px 0 0;
		font-size: 14px;
	}
	#ej-foot .ej-wrapper {
		width: 890px;
		margin: 0 auto;
	}
	#ej-foot h1 {
		position: relative;
	}
	#ej-foot h1 .foot-arw {
		display: none;
	}
	#ej-foot #ej-foot-nav {
		margin-top: 0;
		padding-bottom: 24px;
	}
	#ej-foot #ej-foot-nav h2 {
		margin-bottom: 14px;
	}
	#ej-foot #ej-foot-nav .ej-fn li {
		display: block;
		float: left;
		margin-top: 0;
		width: 158px;
		padding: 0 9px 0 10px;
		background: url("/lesson/common/images/dot_footer.png") 0 0 repeat-y;
	}
	#ej-foot #ej-foot-nav .ej-fn li:first-child {
		background: none;
	}
	#ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner {
		zoom: 1;
	}
	#ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner:before, #ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner:after {
		display: block;
		height: 0;
		visibility: hidden;
		content: "\0020";
	}
	#ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner:after {
		clear: both;
	}
	#ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner li {
		float: none;
		width: 100%;
		margin: 0;
		padding: 0 0 8px;
		background: none;
	}
	#ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner li a {
		padding: 0;
		border: none;
		-moz-border-radius: inherit;
		-webkit-border-radius: inherit;
		border-radius: inherit;
	}
	#ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner li a:hover {
		text-decoration: underline;
	}
	#ej-foot #ej-foot-nav .ej-fn li .ej-fn-inner li a span {
		white-space: nowrap;
	}
}
#ej-foot .spNoDisplay {
	display: none !important;
}

#ej-foot .spDisplay {
	display: block !important;
}

@media only screen and (min-width: 601px) {
	#ej-foot .spNoDisplay {
		display: block !important;
	}

	#ej-foot .spDisplay {
		display: none !important;
	}
}
/* =========================================================
	8: content base layout
========================================================= */
/* #content
--------------------------------------------------------- */
#content {
	position: relative;
	padding-top: 12px;
}
#content h1#con-title {
	margin: 0 4%;
	padding: 6px 0 18px;
	font-size: 20px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	line-height: 1;
}
#content h1#tab-title {
	width: 90px;
	margin: 0 2%;
	padding: 2px 8px 4px;
	background: url("/lesson/common/images/bg_le_titel.png") 100% 100% no-repeat;
	background-size: auto 36px;
	font-size: 24px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	line-height: 1;
	color: #ffffff;
}
#content h1#tab-title span {
	font-size: 18px;
}
#content .tab-new {
	position: absolute;
	top: 10px;
	right: 4%;
	display: inline-block;
	padding: 2px 10px;
	background: #ff5336;
	font-size: 16px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	color: #ffffff;
}

@media only screen and (min-width: 601px) {
	#content {
		zoom: 1;
	}
	#content:before, #content:after {
		display: block;
		height: 0;
		visibility: hidden;
		content: "\0020";
	}
	#content:after {
		clear: both;
	}

	#content {
		position: relative;
		float: left;
		width: 662px;
		margin: 0 0 0 20px;
		padding-top: 22px;
	}
	#content h1#con-title {
		margin: 0;
		padding: 0 0 16px;
		font-size: 24px;
	}
	#content h1#tab-title {
		width: 100px;
		height: 28px;
		margin: 0;
		padding: 8px 10px 5px;
		font-size: 28px;
	}
	#content h1#tab-title span {
		font-size: 20px;
	}
	#content .tab-new {
		top: 30px;
		right: 6px;
	}
}
/* w-box */
#w-box {
	margin: 0 2%;
	background-color: #ffffff;
	-moz-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-o-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-ms-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
}
#w-box.w-box-inner {
	padding: 4.5454545455% 3.8961038961%;
}

@media only screen and (min-width: 601px) {
	#w-box {
		margin: 0;
	}
	#w-box.w-box-inner {
		padding: 22px;
	}
}
/* w-cell */
.w-cell {
	margin: 0 2% 12px;
	background-color: #ffffff;
	-moz-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-o-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-ms-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
}
.w-cell .c-inner {
	padding: 14px 3.8961038961%;
}
.w-cell .c-inner p {
	margin-bottom: 6px;
}

#content h2.cell-title {
	padding: 10px 4% 0 12px;
	background: url("/lesson/common/images/bg_con_title.png") 0 12px no-repeat;
	font-size: 20px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	line-height: 1.1;
}

@media only screen and (min-width: 601px) {
	.w-cell {
		margin: 0 0 14px;
	}
	.w-cell .c-inner {
		padding: 18px 22px 18px;
	}
	.w-cell .c-inner p {
		margin-bottom: 6px;
	}

	#content h2.cell-title {
		padding: 12px 22px 0 18px;
		background-position: 0 14px;
	}
}
/* tab */
#tab {
	margin: 0 2%;
}
#tab ul {
	float: right;
	width: 302px;
	margin-right: 6px;
}
#tab li {
	display: block;
	float: left;
	width: 145px;
	margin-left: 6px;
	background: #7ad486;
	-moz-border-top-left-radius: 6px;
	-moz-border-top-right-radius: 6px;
	-webkit-border-top-left-radius: 6px;
	-webkit-border-top-right-radius: 6px;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	font-size: 18px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	text-align: center;
}
#tab li a {
	display: block;
	padding: 14px 4px;
	line-height: 1.1;
}
#tab li.active {
	background-color: #ffffff;
}
#tab li.active a {
	cursor: default;
}

@media only screen and (min-width: 601px) {
	#tab {
		margin: -44px auto 0;
	}
}
/* side nav
--------------------------------------------------------- */
#side-nav {
	position: relative;
	margin: 80px 4% 0;
	padding-top: 24px;
	background-image: url("/lesson/common/images/dot_br_bold.png");
	background-position: 0 0;
	background-size: auto 2px;
	background-repeat: repeat-x;
}
#side-nav .ej-sns {
	position: absolute;
	top: -64px;
	right: 0;
}

@media only screen and (min-width: 601px) {
	#side-nav {
		float: left;
		width: 206px;
		margin: 62px 20px 0 22px;
		padding: 0;
		background: none;
	}
	#side-nav .ej-sns {
		position: inherit;
		top: inherit;
		right: inherit;
		margin-top: 22px;
	}
}
/* DL bottun */
#btn-dl {
	position: relative;
}
#btn-dl a {
	display: block;
	height: 74px;
	padding-top: 30px;
	background: #ff8500;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	color: #ffffff !important;
	text-align: center;
	font-size: 22px;
	font-family: 'ProximaNovaCnRgBold', Arial, Helvetica, sans-serif;
	-moz-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-o-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-ms-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
}
#btn-dl a .free {
	position: absolute;
	top: 12px;
	right: 12px;
	display: inline-block;
	padding: 2px;
	background: #ffffff;
	font-size: 15px;
	color: #ff8500 !important;
	line-height: 1;
}
#btn-dl a .subtext {
	display: block;
	font-size: 14px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
}

@media only screen and (min-width: 601px) {
	#btn-dl a:hover {
		background: #ff9e34;
	}
}
/* sub nav */
.sub-nav {
	margin-top: 22px;
}
.sub-nav li {
	margin-bottom: 4px;
}
.sub-nav li a {
	position: relative;
	display: block;
	padding: 12px 18px 12px 8px;
	background: #ffffff url("/lesson/common/images/arw_list_gr_l_x2.png") 100% 50% no-repeat;
	background-size: 640px auto;
	font-size: 18px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	line-height: 1.1;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-moz-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-o-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-ms-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
}
.sub-nav li a span {
	white-space: nowrap;
}
.sub-nav li.sn10 a .icon {
	display: inline-block;
	padding-left: 30px;
	background: url("/lesson/common/images/icon_list_x2.png") -616px 50% no-repeat;
	background-size: 640px auto;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 601px), only screen and (min-resolution: 2dppx) and (min-width: 601px) {
	.sub-nav.second {
		background-image: url("/lesson/common/images/dot_bk_x2.png");
		background-size: auto 1px;
	}
}
@media only screen and (min-width: 601px) {
	.sub-nav li a {
		padding: 10px 18px 10px 8px;
		background-image: url("/lesson/common/images/arw_list_gr_s.png");
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
		border-radius: 4px;
		font-size: 16px;
		font-family: 'ProximaNovaCnRgRegular', Arial, Helvetica, sans-serif;
	}
	.sub-nav li a:hover {
		background-color: #e2f8e5;
	}
	.sub-nav li.sn10 a .icon {
		background-image: url("/lesson/common/images/icon_list.png");
		white-space: normal;
	}
	.sub-nav.second {
		margin-top: 14px;
		padding-top: 14px;
		background: url("/lesson/common/images/dot_bk.png") 0 0 repeat-x;
	}
	.sub-nav.rare {
		margin-top: 4px;
	}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	.sub-nav li a .arw {
		background-image: url("/lesson/common/images/arw_list_gr_s_x2.png");
		background-size: 640px auto;
	}

	.sub-nav li.sn10 a .icon {
		background-image: url("/lesson/common/images/icon_list_x2.png");
		background-size: 640px auto;
	}
}
/*
.sn01 -> List of Lessons
.sn02 -> Japanese Syllabaries
.sn03 -> Teach Us, Teacher
.sn04 -> Sound Words
.sn05 -> Vocabulary List & Quiz
.sn06 -> Learning Tools
.sn07 -> How to use "Easy Japanese"
.sn08 -> FAQ
.sn09 -> How to use podcasting
.sn10 -> Please send your message
.sn11 -> What is "Easy Japanese"
.sn12 -> Benefits of learning at NHK WORLD
*/
/* Select your language */
#select-lang {
	width: 100%;
	margin-top: 22px;
}
#select-lang #select-tgl {
	position: relative;
	-moz-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-o-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-ms-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	background: #ffffff;
}
#select-lang #select-tgl h3 {
	position: relative;
	padding: 14px 18px 14px 38px;
	background: url("/lesson/common/images/icon_list_x2.png") 8px 50% no-repeat;
	background-size: 640px auto;
	cursor: pointer;
	font-size: 18px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	line-height: 1.1;
}
#select-lang #select-tgl h3 .arw {
	position: absolute;
	right: 10px;
	bottom: 16px;
	display: inline-block;
	width: 13px;
	height: 13px;
	background-image: url("/lesson/common/images/ej_icon_x2.png");
	background-size: 70px auto;
	background-position: 0 -240px;
}
#select-lang #select-tgl h3.active .arw {
	background-position: 100% -240px;
}
#select-lang #select-tgl ul {
	display: none;
	margin: 0 2.7027027027%;
	padding-bottom: 1.8691588785%;
	background: #ffffff;
}
#select-lang #select-tgl ul li {
	display: block;
	float: left;
	width: 47.8571428571%;
	margin: 1.0714285714%;
}
#select-lang #select-tgl ul li a {
	display: block;
	padding: 9px 2px;
	border: 1px solid #bcbcbc;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
}
#select-lang #select-tgl ul li.on a {
	background: #42c253;
	border: 1px solid #42c253;
	color: #fff !important;
	cursor: default;
}
#select-lang #select-tgl ul li.sl03 {
	font-family: Arial, 'Padauk', Helvetica, sans-serif;
	font-weight: bold;
	font-family: "Padauk-book" \9;
	/* IE8 below */
}

@media only screen and (min-width: 601px) {
	#select-lang #select-tgl h3 {
		padding: 14px 18px 14px 38px;
		background-image: url("/lesson/common/images/icon_list.png");
		font-size: 16px;
		font-family: 'ProximaNovaCnRgRegular', Arial, Helvetica, sans-serif;
	}
	#select-lang #select-tgl h3 .arw {
		right: 10px;
		bottom: 35%;
		width: 11px;
		height: 11px;
		background-image: url("/lesson/common/images/ej_icon.png");
		background-position: 0 -280px;
	}
	#select-lang #select-tgl h3.active .arw {
		background-position: 100% -280px;
	}
	#select-lang #select-tgl ul {
		margin: 0 8px;
		padding-bottom: 8px;
	}
	#select-lang #select-tgl ul li {
		float: none;
		width: 190px;
		margin: 1px 0 0 0;
	}
	#select-lang #select-tgl ul li a {
		height: 18px;
		padding: 3px 2px;
	}
	#select-lang #select-tgl ul li a:hover {
		background: #e2f8e5;
	}
	#select-lang #select-tgl ul li.on a {
		background: #42c253;
		border: 1px solid #42c253;
		color: #fff !important;
		cursor: default;
	}
	#select-lang #select-tgl ul li.sl03 a {
		padding: 0 2px 5px;
	}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	#select-lang #select-tgl h3 {
		background-image: url("/lesson/common/images/icon_list_x2.png");
		background-size: 640px auto;
	}

	#select-lang #select-tgl h3 .icon {
		background-image: url("/lesson/common/images/ej_icon_x2.png");
		background-size: 70px auto;
	}
}
/* =========================================================
	9: parts
	- lead-box
	- update box
	- link-l-g, link-l-more
	- dl-mp3, dl-pdf
	- btn-m
	- btn-o-back
	- btn-start-lesson
	- add box
	- green cell
	- tabel-script
	- select-box
	- le-list-box
	- tgl-list
	- small parts
	
	- banner  [Review: Make Your Choice!] 2016
========================================================= */
/* lead-box
--------------------------------------------------------- */
#lead-box {
	margin: 0 2% 12px;
	padding: 10px;
	background: url("/lesson/common/images/bg_lead.png") 0 0 repeat;
}
#lead-box .lead-inner h2 {
	font-size: 16px;
	font-weight: bold;
}
#lead-box .lead-inner img {
	float: left;
	width: 100px;
	height: auto;
	margin: 0 10px 4px 0;
}

@media only screen and (min-width: 601px) {
	#lead-box {
		margin: 0 0 14px;
		padding: 14px;
	}
	#lead-box .lead-inner h2 {
		font-size: 18px;
	}
	#lead-box .lead-inner img {
		width: 200px;
		margin: 0 18px 0px 0;
	}
	#lead-box .lead-inner p {
		font-size: 16px;
	}
}
/* lead (in w-box or w-cell)  */
.lead {
	margin: 0 4%;
	padding-top: 20px;
}

@media only screen and (min-width: 601px) {
	.lead {
		margin: 0 22px;
	}
}
/* update box
--------------------------------------------------------- */
#ud-box {
	margin: 0 4%;
	padding-top: 12px;
}
#ud-box a {
	display: block;
	padding: 10px;
	box-sizing: border-box;
	border: 1px solid #ff6f76;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
}
#ud-box a dl {
	position: relative;
	font-size: 16px;
	line-height: 1.2;
}
#ud-box a dl dt {
	margin-bottom: 6px;
	font-family: 'ProximaNovaCnRgRegular', Arial, Helvetica, sans-serif;
	color: #ff6f76;
}
#ud-box a dl dt .arw {
	position: absolute;
	top: 0;
	right: 0;
	display: inline-block;
	width: 18px;
	height: 18px;
	background-image: url("/lesson/common/images/ej_icon_x2.png");
	background-size: 70px auto;
	background-position: 100% -140px;
}
#ud-box a dl dd {
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
}
#ud-box a dl dd span {
	font-family: 'ProximaNovaCnRgRegular', Arial, Helvetica, sans-serif;
	font-weight: normal;
}

@media only screen and (min-width: 601px) {
	#ud-box dl {
		zoom: 1;
	}
	#ud-box dl:before, #ud-box dl:after {
		display: block;
		height: 0;
		visibility: hidden;
		content: "\0020";
	}
	#ud-box dl:after {
		clear: both;
	}

	#ud-box {
		margin: 0 22px;
		padding-top: 12px;
	}
	#ud-box a {
		padding: 10px 30px 10px 10px;
	}
	#ud-box a dl dt {
		display: inline-block;
		float: left;
		margin-right: 10px;
		margin-bottom: 0;
	}
	#ud-box a dl dt .arw {
		right: -20px;
		background-image: url("/lesson/common/images/ej_icon.png");
	}
	#ud-box a dl dd {
		display: inline;
	}
	#ud-box a:hover {
		background: #fff7f7;
	}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	#ud-box a dl dt .arw {
		background-image: url("/lesson/common/images/ej_icon_x2.png");
		background-size: 70px auto;
	}
}
/* link-l-g, link-l-more
--------------------------------------------------------- */
.link-l-g,
.link-l-more {
	position: relative;
	padding-right: 24px;
	font-size: 16px;
	text-align: right;
}
.link-l-g a .arw,
.link-l-more a .arw {
	position: absolute;
	right: 0;
	bottom: 2px;
	display: inline-block;
	width: 18px;
	height: 18px;
	background-image: url("/lesson/common/images/ej_icon_x2.png");
	background-size: 70px auto;
	background-position: 100% -100px;
}

.link-l-g {
	font-family: 'ProximaNovaCnRgRegular', Arial, Helvetica, sans-serif;
}

.link-l-more {
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
}

@media only screen and (min-width: 601px) {
	.link-l-g a .arw,
	.link-l-more a .arw {
		background-image: url("/lesson/common/images/ej_icon.png");
	}
	.link-l-g a:hover,
	.link-l-more a:hover {
		color: #27b53a !important;
	}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	.link-l-g a .arw,
	.link-l-more a .arw {
		background-image: url("/lesson/common/images/ej_icon_x2.png");
		background-size: 70px auto;
	}
}
/* dl-mp3, dl-pdf
--------------------------------------------------------- */
.dl-mp3,
.dl-pdf {
	position: relative;
	font-size: 20px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	line-height: 1.1;
	text-align: right;
}
.dl-mp3 a,
.dl-pdf a {
	display: block;
	padding: 8px 10px 10px 32px;
	background: #ff8500;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	color: #ffffff !important;
}
.dl-mp3 a .icon,
.dl-pdf a .icon {
	position: absolute;
	left: 6px;
	bottom: 4px;
	display: inline-block;
	width: 24px;
	height: 32px;
	background-image: url("/lesson/common/images/ej_icon_x2.png");
	background-size: 70px auto;
}

.dl-mp3 a .icon {
	background-position: 0 -180px;
}

.dl-pdf a .icon {
	background-position: 100% -180px;
}

@media only screen and (min-width: 601px) {
	.dl-mp3 a .icon,
	.dl-pdf a .icon {
		background-image: url("/lesson/common/images/ej_icon.png");
	}
	.dl-mp3 a:hover,
	.dl-pdf a:hover {
		background: #ff9e34;
	}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	.dl-mp3 a .icon,
	.dl-pdf a .icon {
		background-image: url("/lesson/common/images/ej_icon_x2.png");
		background-size: 70px auto;
	}
}
/* btn-m
--------------------------------------------------------- */
.btn-m {
	padding-top: 12px;
}
.btn-m a {
	position: relative;
	display: block;
	width: auto;
	padding: 14px 50px 14px 10px;
	background: #42c253 url("/lesson/common/images/arw_le_p_link_x2.png") 100% 50% no-repeat;
	background-size: 640px auto;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	font-size: 20px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	line-height: 1.1;
	color: #ffffff !important;
}

@media only screen and (min-width: 601px) {
	.btn-m {
		width: 300px;
		margin: 0 auto;
	}
	.btn-m a {
		background-image: url("/lesson/common/images/arw_le_p_link.png");
	}
	.btn-m a:hover {
		background-color: #4cd05d;
	}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	.btn-m a {
		background-image: url("/lesson/common/images/arw_le_p_link_x2.png");
		background-size: 640px auto;
	}
}
/* btn-o-back
--------------------------------------------------------- */
.btn-o-back {
	margin: 14px 3% 0;
	padding-top: 13px;
	background: url("/lesson/common/images/dot_bk_x2.png") 1px 0 repeat-x;
	background-size: auto 1px;
}
.btn-o-back a {
	position: relative;
	padding: 0 0 0 24px;
	font-size: 18px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	line-height: 1.1;
}
.btn-o-back a .arw {
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	width: 18px;
	height: 18px;
	background: url("/lesson/common/images/ej_icon_x2.png") 0 -120px no-repeat;
	background-size: 70px auto;
}

@media only screen and (min-width: 601px) {
	.btn-o-back {
		margin: 22px 0 10px;
		padding-top: 16px;
		background: url("/lesson/common/images/dot_gy_bold.png") 0 0 repeat-x;
		background-size: auto;
	}
	.btn-o-back a .arw {
		background-image: url("/lesson/common/images/ej_icon.png");
	}
	.btn-o-back a:hover {
		color: #27b53a !important;
	}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	.btn-o-back {
		background-image: url("/lesson/common/images/dot_bk_x2.png");
		background-size: auto 1px;
	}

	.btn-o-back a .arw {
		background-image: url("/lesson/common/images/ej_icon_x2.png");
		background-size: 70px auto;
	}
}
/* btn-start-lesson
--------------------------------------------------------- */
.btn-start-lesson {
	margin: 12px 3% 0;
	padding-top: 13px;
	background: url("/lesson/common/images/dot_bk_x2.png") 1px 0 repeat-x;
	background-size: auto 1px;
}
.btn-start-lesson a {
	position: relative;
	display: block;
	padding: 14px 60px 14px 10px;
	background: #42c253 url("/lesson/common/images/arw_le_p_link_l_x2.png") 100% 50% no-repeat;
	background-size: 640px auto;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	font-size: 20px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	line-height: 1.1;
	color: #ffffff !important;
}
.btn-start-lesson a span {
	white-space: nowrap;
}

@media only screen and (min-width: 601px) {
	.btn-start-lesson {
		margin: 22px auto 10px;
		padding-top: 24px;
		background: url("/lesson/common/images/dot_gy_bold.png") 0 0 repeat-x;
		background-size: auto;
	}
	.btn-start-lesson a {
		width: 330px;
		margin: 0 auto;
		padding: 24px 50px 24px 20px;
		font-size: 22px;
		background-image: url("/lesson/common/images/arw_le_p_link_l.png");
	}
	.btn-start-lesson a:hover {
		background-color: #4cd05d;
	}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	.btn-start-lesson {
		background-image: url("/lesson/common/images/dot_gy_bold_x2.png");
		background-size: auto 2px;
	}

	.btn-start-lesson a {
		background-image: url("/lesson/common/images/arw_le_p_link_l_x2.png");
		background-size: 640px auto;
	}
}
/* add box
--------------------------------------------------------- */
#addition {
	margin: 0 4%;
}
#addition h4 {
	margin-bottom: 10px;
	padding-bottom: 8px;
	border-bottom: 1px solid #1f1f1f;
	font-size: 20px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	line-height: 1;
}
#addition .add-box {
	margin-top: 12px;
	padding: 4.0540540541%;
	background: #ffffff;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-o-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-ms-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
}
#addition .add-box.spDisplay {
	margin-top: 22px;
}
#addition .link-l-more {
	margin-top: 6px;
}
#addition .btn-start-lesson {
	margin: 12px 0 0;
	padding-top: 0;
	background: none;
}

@media screen and (min-width: 601px) {
	#addition {
		margin: 0;
	}
	#addition .add-box {
		margin-top: 22px;
		padding: 14px;
	}
	#addition .btn-start-lesson {
		margin: 22px auto 10px;
		padding-top: 0;
		background: none;
	}
}
/* green cell
--------------------------------------------------------- */
.gr-cell {
	margin-top: 12px;
	padding: 14px 14px 10px;
	background: #ecf9ed;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}
.gr-cell ol {
	margin-bottom: 6px;
}

#content .gr-cell h3 {
	margin-bottom: 12px;
	font-size: 20px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	line-height: 1.1;
}

@media only screen and (min-width: 601px) {
	.gr-cell {
		margin-top: 22px;
	}
}
/* tabel-script
--------------------------------------------------------- */
table.tabel-script {
	position: relative;
	margin-top: 12px;
	border-right: none;
}
table.tabel-script th,
table.tabel-script td {
	padding: 8px 0;
	border-color: #707070;
	font-weight: bold;
}
table.tabel-script th {
	width: 21.1267605634%;
	padding-right: 2.8169014085%;
}
table.tabel-script td {
	width: 73.2394366197%;
	padding-left: 2.8169014085%;
}
table.tabel-script td img {
	width: 44px;
	height: auto;
}
table.tabel-script .line-ja th,
table.tabel-script .line-ja td {
	border-right: 1px solid #707070;
	border-bottom: none;
	border-left: none;
	font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
	line-height: 1.5;
}
table.tabel-script .line-ja td {
	border-style: none;
}
table.tabel-script .line-yomi th {
	border-right: 1px solid #707070;
	border-bottom: 1px solid #707070;
	border-left: none;
}
table.tabel-script .line-yomi td {
	border-right: none;
	border-bottom: 1px solid #707070;
	border-left: none;
}
table.tabel-script .line-yomi td .sp-view {
	position: relative;
	padding-top: 12px;
	padding-bottom: 48px;
}
table.tabel-script .line-yomi td .sp-view .btn-listen {
	position: absolute;
	right: 0;
	bottom: 0;
}

@media only screen and (min-width: 601px) {
	table.tabel-script th,
	table.tabel-script td {
		padding: 8px 0;
	}
	table.tabel-script th {
		width: 68px;
		padding-right: 8px;
	}
	table.tabel-script td {
		width: 263px;
		padding: 8px;
	}
	table.tabel-script .line-ja td {
		border-right: 1px solid #707070;
		border-bottom: none;
		border-left: none;
	}
	table.tabel-script .line-ja td.pc-view {
		position: relative;
		display: table-cell;
		padding-right: 0 !important;
		padding-bottom: 54px;
		border-bottom: 1px solid #707070;
		border-right: none !important;
		font-family: "Arial", sans-serif;
	}
	table.tabel-script .line-ja td.pc-view .btn-listen {
		position: absolute;
		right: 0;
		bottom: 8px;
	}
	table.tabel-script .line-yomi td {
		border-right: 1px solid #707070;
	}
}
/* select-box
--------------------------------------------------------- */
.select-box {
	position: relative;
	margin: 0 2% 12px;
}
.select-box .custom-select {
	width: 282px;
	padding: 12px;
	background: #ffffff url("/lesson/common/images/arw_select_x2.png") 97% 8px no-repeat;
	background-size: 34px auto;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	font-size: 18px !important;
	cursor: pointer;
}
.select-box .select-head {
	position: absolute;
	top: 13px;
	left: 13px;
	font-size: 18px;
}
.select-box .customSelectInner {
	visibility: hidden;
}

@media only screen and (min-width: 601px) {
	.select-box {
		margin: 0 0 14px;
	}
	.select-box .custom-select {
		background-image: url("/lesson/common/images/arw_select.png");
	}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	.select-box .custom-select {
		background-image: url("/lesson/common/images/arw_select_x2.png");
		background-size: 34px auto;
	}
}
/* le-list-box
--------------------------------------------------------- */
.le-list-box {
	margin: 0 4%;
	padding: 8px 0 22px;
}

@media only screen and (min-width: 601px) {
	.le-list-box {
		margin: 0 22px;
	}
}
.le-list {
	margin-top: 14px;
	border: 2px solid #42c253;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
}
.le-list .le-list-inner li {
	border-top: 1px dotted #42c253;
}
.le-list .le-list-inner li:first-child {
	border: none;
}
.le-list .le-list-inner li a {
	display: block;
	padding: 6px 20px 6px 6px;
	background: url("/lesson/common/images/arw_list_gr_m_x2.png") 100% 50% no-repeat;
	background-size: 640px auto;
	font-weight: bold;
	line-height: 1.2;
}
.le-list .le-list-inner li a span {
	display: block;
	font-weight: normal;
}
.le-list .le-list-inner li a .new {
	display: inline-block;
	margin-left: 4px;
	padding: 1px 3px;
	font-size: 12px;
}

#content h2.ttl-list {
	padding: 10px;
	background: #42c253;
	font-size: 18px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	color: #ffffff;
	line-height: 1.1;
}

@media only screen and (min-width: 601px) {
	.le-list .le-list-inner li:first-child a {
		-moz-border-top-left-radius: 6px;
		-moz-border-top-right-radius: 6px;
		-webkit-border-top-left-radius: 6px;
		-webkit-border-top-right-radius: 6px;
		border-top-left-radius: 6px;
		border-top-right-radius: 6px;
	}
	.le-list .le-list-inner li:last-child a {
		-moz-border-bottom-left-radius: 6px;
		-moz-border-bottom-right-radius: 6px;
		-webkit-border-bottom-left-radius: 6px;
		-webkit-border-bottom-right-radius: 6px;
		border-bottom-left-radius: 6px;
		border-bottom-right-radius: 6px;
	}
	.le-list .le-list-inner li a {
		display: block;
		padding: 8px 20px 8px 8px;
		background-image: url("/lesson/common/images/arw_list_gr_m.png");
	}
	.le-list .le-list-inner li a span {
		display: inline-block;
	}
	.le-list .le-list-inner li a:hover {
		background-color: #e2f8e5;
	}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	.le-list .le-list-inner li a {
		background-image: url("/lesson/common/images/arw_list_gr_m_x2.png");
		background-size: 640px auto;
	}
}
/* tgl-list
--------------------------------------------------------- */
.tgl-list {
	margin: 0 2% 12px;
	background: #ffffff;
	-moz-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-o-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
	-ms-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.04);
}
.tgl-list .tgl-inner {
	padding: 3.8961038961%;
}
.tgl-list .tgl-inner .close-trigger {
	margin-top: 20px;
	font-size: 16px;
	font-family: 'ProximaNovaCnRgRegular', Arial, Helvetica, sans-serif;
	text-align: right;
	color: #27b53a !important;
	cursor: pointer;
}

#content h2.tgl-title {
	position: relative;
	padding: 14px 40px 14px 12px;
	font-size: 18px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	line-height: 1.1;
	cursor: pointer;
}
#content h2.tgl-title .arw {
	position: absolute;
	top: 12px;
	right: 12px;
	display: inline-block;
	width: 22px;
	height: 22px;
	background: url("/lesson/common/images/ej_icon_x2.png") 0 -40px no-repeat;
	background-size: 70px auto;
}
#content h2.tgl-title.active {
	background: #42c253;
	color: #ffffff;
}
#content h2.tgl-title.active .arw {
	background-position: 100% -70px;
}
#content .tgl-list h3 {
	padding: 0 12px 14px;
	font-size: 18px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	line-height: 1.1;
	background: #42c253;
	color: #ffffff;
}

@media only screen and (min-width: 601px) {
	.tgl-list {
		margin: 0 0 14px;
	}
	.tgl-list .tgl-inner {
		padding: 22px;
	}

	#content h2.tgl-title .arw {
		background-image: url("/lesson/common/images/ej_icon.png");
	}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
	#content h2.tgl-title .arw {
		background-image: url("/lesson/common/images/ej_icon_x2.png");
		background-size: 70px auto;
	}
}
/* small parts
--------------------------------------------------------- */
/* rss */
.rss img {
	width: 36px;
	height: auto;
}

/* new */
.new {
	padding: 2px 10px;
	background: #ff5336;
	font-size: 16px;
	font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	color: #ffffff;
	line-height: 1;
	text-align: center;
}

/* blank-box */
.blank-box {
	display: inline-block !important;
	padding: 2px 8px;
	background: #ffffff;
	border: 1px solid #dadada;
	color: #1f1f1f;
	text-align: center;
	line-height: 1;
}

/* workarounds */
.nowrap {
	white-space: nowrap;
}

.d-inline {
	display: inline;
}

.d-block {
	display: block;
}

.d-i-block {
	display: inline-block;
}

/* banner  [Review: Make Your Choice!] 2016
--------------------------------------------------------- */
@media only screen and (min-width: 601px) {
	.sp-bnr.challenge a {
		position: relative;
		display: block;
		padding: 14px 2px 12px 60px;
		background-color: #55c863;
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
		border-radius: 4px;
		font-size: 17px;
		line-height: 1.2;
		color: #ffffff !important;
		font-family: 'ProximaNovaCnLtSemibold', Arial, Helvetica, sans-serif;
	}
	.sp-bnr.challenge a span {
		display: block;
	}
	.sp-bnr.challenge a:after {
		content: '';
		position: absolute;
		bottom: -2px;
		left: 0;
		width: 56px;
		height: 70px;
		background-image: url(/lesson/common/images/special/challenge/img_review_bnr.png);
		background-position: 0 0;
		background-repeat: no-repeat;
		background-size: 56px auto;
	}
	.sp-bnr.challenge a:hover {
		background-color: #42c253;
	}
}