@charset "utf-8";

/* ================== clearfix ================== */
#top-contents .read,
#top-contents .backnumber .backnumberInner dl,
#contents .twoClm,
#contents .twoClm2,
#contents .stepTalk,
#contents .relationLink { overflow: hidden;}
#top-contents .hottopic h2.hottopicH2:after,
#top-contents .read:after,
#top-contents .backnumber .backnumberInner dl:after,
#contents .twoClm:after,
#contents .twoClm2:after,
#contents .stepTalk:after,
#contents .relationLink:after {   
	display: block;   
	height: 0;   
	font-size: 0.1em;   
	line-height: 0;
	clear: both;
}
/* ================= IndexPage ================= */

/*---------- read ----------*/
#top-contents .read {	margin: 38px 10px 30px 10px;}
#top-contents .read .readLeft p { margin-top: 1em;}
#top-contents .read .readLeft p:first-child { margin-top: 0;}
#top-contents .read .readRight { float: right; margin-left: 20px; margin-bottom: 10px; }
#top-contents .read .readRight img { max-width: 220px;}
/*---------- titleheader ----------*/
#titleheader h1{margin: 0; padding: 0;}
/*---------- backnumber ----------*/
#top-contents .backnumber {	min-height: 44px;	margin: 15px 0 0 0;	padding: 0;	border: solid 2px #FFAA33; border-radius: 7px 7px 0 0; background:url(/support/corner/wordlesson/images/back_num_tit.png) no-repeat, url(/support/corner/wordlesson/images/fix_bg.png) repeat-x left top;}
#top-contents .backnumber h3{	background:none;margin: 0;text-indent: -9999px;overflow:hidden;	text-decoration: none;outline:none;	min-height: 44px;}
#top-contents .backnumber .backnumberInner {padding: 18px;}
#top-contents .backnumber .backnumberInner ul {margin: 0px;padding-left: 0;list-style: none;}
#top-contents .backnumber .backnumberInner li {	margin: 0.5em 0;padding: 0.2em 0 0.2em 27px;background: url(/support/corner/wordlesson/images/back_no_icon.png) no-repeat 0 0.3em;}
@media only screen and (max-width: 480px) {
	#top-contents .backnumber .backnumberInner {padding: 0 10px 10px;}
}
#top-contents .hottopic h2.hottopicH2 {padding: 16px 16px 10px 84px; margin: 0 0 30px 0; background: url(/support/corner/wordlesson/images/topic_h2_i.png) no-repeat left top; border-left:solid 6px #0066CC; border-right:solid 6px #0066CC; background-color:#FFF4BC;}

/* ================= DetailPage ================= */
/*---------- subject ----------*/
#contents #subject {margin: 20px 0px 30px 0px;}
#subject .subjectTitle{border-left:solid 6px #0066CC; border-right:solid 6px #0066CC;background-color:#FFF4BC;}
#subject .subjectTitle h2{padding: 16px 0px 0px 82px; margin:0; font-size:1.4em; background: url(images/topic_h2_i.png) no-repeat left top;}
#subject h2 span {margin:0;margin-right:7px;color: #ffffff;padding:2px 0.5em;width:6em;background-color:#0066CC;border:solid 2px #ffffff;}
#subject .subjectTitle dl,dt,dd{margin:0;margin-top:-6px;padding:0;display:inline;float:right;}
#subject .subjectTitle dl{width:100%;display:block;padding:10px 0 2px;border-top:solid 2px #ffffff;background-color:#C6ECFF;}
#subject .subjectTitle dt{margin-top:-5px;margin-right:3px;}
#subject .subjectTitle dd{margin-right:5px;}
#subject .subjectTitle dd{
	display:block;width:auto;
	background-color:#0066CC;
	border:solid 1px #ffffff;
	color: #ffffff;
	font-size:85%;
	line-height:1.5em;
	border-radius:12px;
	padding:1px 10px;
	margin-bottom:3px;
	position: relative;
	text-shadow:
		-1px -1px #0033aa,
		1px -1px #0033aa,
		-1px 1px #0033aa,
		1px 1px #0033aa;
	-ms-filter:"progid:DXImageTransform.Microsoft.DropShadow(color=#0000ff,offx=1,offy=1)";
}
#subject .subjectTitle p {background-color:#C6ECFF;display:block;text-align: right;}
#subject .subjectTitle p span{
	background-color:#0066CC;
	border:solid 1px #ffffff;
	color: #ffffff;
	font-size:85%;
	line-height:1.5em;
	border-radius:12px;
	padding:1px 10px;
	margin-bottom:3px;
	margin-left:3px;
	position: relative;
	text-shadow:
		-1px -1px #0033aa,
		1px -1px #0033aa,
		-1px 1px #0033aa,
		1px 1px #0033aa;
	-ms-filter:"progid:DXImageTransform.Microsoft.DropShadow(color=#0000ff,offx=1,offy=1)";
}

/*---------- student ----------*/
#subject .student { display: block;margin-top: 30px;}
#subject .student .studentMsg{margin-right:260px; position:relative; background:#FCFCFC; padding:20px; text-align:left; border:2px solid #359A9A; border-radius:7px; -webkit-border-radius:7px; -moz-border-radius:7px;}
#subject .student .studentMsg::before{content: ''; position: absolute;display: block;width: 0; height: 0; right: -15px;top: 20px;border-left: 15px solid #359A9A;border-top: 15px solid transparent;border-bottom: 15px solid transparent;}
#subject .student .studentMsg::after{content: ''; position: absolute;display: block;width: 0; height: 0; right: -12px;top: 20px;border-left: 15px solid #FCFCFC;border-top: 15px solid transparent;border-bottom: 15px solid transparent;}
#subject .student .studentImg img {float: right; width: 200px; margin-right:2em;}

@media only screen and (max-width: 768px) {
	#subject .student .studentMsg {margin:auto;}
	#subject .student .studentMsg::before{top: -30px;left: 50%;border-bottom: 15px solid #359A9A;border-left: 15px solid transparent;border-right: 15px solid transparent}
	#subject .student .studentMsg::after{top: -27px;left: 50%;border-bottom: 15px solid #FCFCFC;border-left: 15px solid transparent;border-right: 15px solid transparent;}
	#subject .student .studentImg {text-align:center;}
	#subject .student .studentImg img {float:none; margin-bottom:1em;margin-right:0em;}
}
/*---------- headmaster ----------*/
#subject .headmaster { display: block;margin-top: 30px;}
#subject .headmaster .headmasterMsg {margin-left:260px;position:relative; background:#FCFCFC; padding:20px; text-align:left; border:2px solid #FF9999; border-radius:7px; -webkit-border-radius:7px; -moz-border-radius:7px;}
#subject .headmaster .headmasterMsg::before{content: ''; position: absolute;display: block; width: 0; height: 0;left: -15px; top: 20px; border-right: 15px solid #FF9999; border-top: 15px solid transparent; border-bottom: 15px solid transparent;}
#subject .headmaster .headmasterMsg::after{content: ''; position: absolute;display: block; width: 0; height: 0;left: -12px; top: 20px; border-right: 15px solid #FCFCFC; border-top: 15px solid transparent; border-bottom: 15px solid transparent;}
#subject .headmaster .headmasterImg img {float: left; width: 200px;margin-left:2em;}

@media only screen and (max-width: 768px) {
	#subject .headmaster .headmasterMsg {margin:auto;}
	#subject .headmaster .headmasterMsg::before{top: -30px;left: 50%;border-bottom: 15px solid #FF9999;border-left: 15px solid transparent;border-right: 15px solid transparent}
	#subject .headmaster .headmasterMsg::after{top: -27px;left: 50%;border-bottom: 15px solid #FCFCFC;border-left: 15px solid transparent;border-right: 15px solid transparent;}
	#subject .headmaster .headmasterImg {text-align:center;}
	#subject .headmaster .headmasterImg img {float:none; margin-bottom:1em;margin-left:0em;}
}
/*---------- fix ----------*/
#contents .fixed {margin-bottom: 30px;}
#contents .fixed h3{background:none; padding: 5px 0px 0px 60px; font-size:1.4em; font-weight:bold; border:solid 2px #FFAA33; border-radius:7px; margin:0;
background:url(/support/corner/wordlesson/images/fix_i.png) no-repeat,#ffffff url(/support/corner/wordlesson/images/fix_bg.png) repeat-x;min-height: 65px;}
#contents .fixed .workbook {border:solid 2px #FFAA33;margin:0;margin-bottom: 1em;margin-top:-15px;padding:0px 20px 0px;background-color: #FDFBE0;}
#contents .fixed .workbook .boxclor_none{padding:10px 10px;margin-bottom: 1em;margin-left:-20px;text-align:center;}
#contents .fixed .workbook .boxclor_none img{text-align:center;margin:10px auto;border:solid 1px #dddddd;display:block;}
#contents .fixed .workbook .boxclor_none li{display: inline-block; margin-left:20px;text-align:left;}

/*---------- sample word before after ----------*/
#contents .fixed .workbook span.bf, ul.download li span.bf{width:auto;background-color:#124C96;border:solid 1px #201969;color: #ffffff;font-size:90%;font-weight:bold;border-radius:3px;padding:0 5px;margin-right:5px;position: relative;background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(000,000,000,.4)), color-stop(100%, rgba(000,000,000,0))); -webkit-box-shadow: 1px 1px 1px #969696;}
#contents .fixed .workbook span.af, ul.download li span.af{width:auto;background-color:#A10031;border:solid 1px #60001A;color: #ffffff;font-size:90%;font-weight:bold;border-radius:3px;padding:0 5px;margin-right:5px;position: relative;background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(000,000,000,.4)), color-stop(100%, rgba(000,000,000,0))); -webkit-box-shadow: 1px 1px 1px #969696;}

#contents .fixed .workbook ul.download {margin:1em;padding:0;list-style:none;}
#contents .fixed .workbook ul.download li{list-style:none;margin-bottom: 1em;line-height: 31px;margin-right: 25px;display:inline-block;padding:0px 0px 0px 35px;background: url(/support/corner/wordlesson/images/wordicon.png) no-repeat left top;}

#contents .fixed .workbook ul.listIcon li{margin-bottom: 0;}
#contents .fixed .workbook ul.listIcon, .linespace .listIcon, .dlbacknumber ul.listIcon{margin-bottom:30px; padding: 0px; list-style: none;}
#contents .fixed .workbook ul.listIcon li, .linespace .listIcon li, .dlbacknumber ul.listIcon li{padding: 2px 0px 4px 22px; background: url(/support/corner/wordlesson/images/back_no_icon.png) no-repeat 0px 0.2em;}
.linespace .listIcon li{margin-left:1em;}

/*---------- knack ----------*/
#contents .knack {	margin-bottom: 30px;}
#contents .knack .knack_doc{display:block; padding: 10px 0px 0px 60px; font-size:1.4em; font-weight:bold; border:solid 2px #6DAD66; border-radius:7px; margin:0;
background:url(/support/corner/wordlesson/images/h3_knack_i.png) no-repeat,#ffffff url(/support/corner/wordlesson/images/h3_knack_bg2.png) repeat-x;-pie-background:url(/support/corner/wordlesson/images/h3_knack_i.png) no-repeat,#ffffff url(/support/corner/wordlesson/images/h3_knack_bg2.png) repeat-x; behavior: url(/usage/PIE.htc); min-height: 53px;}
#contents .knack .explain h3.decoH3 {margin-bottom: 15px; margin-right: 10px; margin-top:1.5em; padding: 6px 20px 6px 36px; border-top:solid 2px #5AA15A; background: url(/support/corner/wordlesson/images/explain_h3icon2.png) no-repeat left top;color: #C6295A;font-size:1.2em;}

#contents .knack .mysteriesRead {padding: 0px 10px;}
#contents .knack .explain {margin: 0px 10px;}

#contents .knack .h5area{border:solid 1px #298FC6; margin:0 10px; padding-bottom: 30px;}
#contents .knack .explain .h4area dl.case,
#contents .knack .explain .h4area dl.case dt,
#contents .knack .explain .h4area dl.case dd{
	text-align:left;
	margin:0;
	padding:0;
	width:98%;
	font-weight:normal;
}
#contents .knack .explain .h4area dl.case dt{border-left:outset 9px #D9ECA1;padding-left:4px;margin:1.5em 0 0.5em 0;}
#contents .knack .explain .h4area dl.case .twoClm .itemBlockL,
#contents .knack .explain .h4area dl.case .twoClm .itemBlockR{background-color: #FFFFFF;border:none;}
#contents .knack .explain .h4area dl.case .twoClm img{border: solid 1px #999999;}
/* single_word.ver_cap_none */
#contents .knack .explain .h4area .h5area_1{
	border:solid 1px #298FC6;
	margin:0px 10px 10px;
}
#contents .knack .explain .h4area{border:solid 1px #007D5A; margin:20px 10px 0px;}
#contents .knack .explain .h4area_cou{border:solid 1px #e87300 !important;}
#contents .knack .explain .h4area_tip{border:solid 1px #018dab !important;}
#contents .knack .explain .h4area div.p_bottom_1em{padding-bottom:1em;margin-bottom:0;}
#contents .knack .explain .explainInner {margin-top: 30px; padding: 0px 10px;}

/* b_1em */
#contents .knack .explain .linespace,
#contents .knack .explain .linespace p {margin:0px 5px 1em 5px;}
#contents .knack .explain h4.decoH4 {margin-bottom: 15px;padding: 6px 20px 6px 30px;border-top:solid 2px #5AA15A;background: url(/support/corner/wordlesson/images/h4_icon1.png) no-repeat 2px 10px;color: #007D5A;font-size:1.2em;}
#contents .knack .explain .h4area h4.decoH4_2 {margin:0px 0px 15px 10px;padding: 9px 20px 9px 30px;background: url(/support/corner/wordlesson/images/h4_icon2.png) no-repeat 5px 12px;color: #007D5A;border-bottom:double 3px #D9ECA1;font-size:1.2em;}
#contents .knack .explain .h4area h4.decoH4_3 {margin:0px 0px 15px 10px; padding: 7px 20px 7px 30px; background: url(/support/corner/wordlesson/images/h4_icon3.png) no-repeat 5px 12px; color: #e87300; border-bottom:double 3px #fda44c; font-size:1.2em;}
#contents .knack .explain .h4area h4.decoH4_4 {margin:0px 0px 15px 10px; padding: -4px 20px 20px 30px; color: #018dab; line-height:2.3em; border-bottom:double 3px #41f0f2;font-size: 1.2em;}
#contents .knack .explain h5.decoH5 {margin-bottom: 2px;padding: 10px 0px 10px 10px;border-bottom:dotted 1px #298FC6;color:#265291;font-size:1.2em;}
#contents .knack .explain .explainInner .doubleborder1 h6{font-size:1.2em; color:#265291; margin:1px; padding:10px; border-top:dotted 1px #265291;}

/* 2column_word 009*/
#contents .knack .explain .explainInner .doubleborder1 {border:none; border-top:dotted 1px #298FC6; padding:1em 0;}

/* 2column_word 009*/
#contents .knack .explain .h4area .inborder .twoClm p.doubleborder{
	border:none;
	padding:0;
	padding-top:15px;
	border-top:dotted 1px #298FC6;
}
#contents .knack .explain .h4area .inborder{background-color: #ffffff; border:none; border-left:solid 5px #D9ECA1; border-right:solid 5px #D9ECA1; margin:0; padding:0 15px;}
#contents .knack .explain .h4area_cou .inborder{border-left:solid 5px #fbe77a;border-right:solid 5px #fbe77a;}
#contents .knack .explain .h4area_tip .inborder{border-left:solid 5px #41f0f2;border-right:solid 5px #41f0f2;}
/* single_word.ver_cap_none (under p) */
#contents .knack .explain .h4area .inborder .explainInner p.ver_capnone{margin:-10px 15px 0px; padding-bottom:10px;}

#contents .knack .explain .explainInner .linespace p.i_img{background: url(/support/corner/wordlesson/images/imageicon.png) no-repeat left top;padding:0;padding-left:40px;vertical-align:middle;line-height: 27px;margin:0 0 2em 1em;}
/*---------- single, 2column ----------*/
#contents .capImg { margin: 0; padding-bottom: 9px; text-align: center; }
#contents .capImg a img { border: 1px solid #999999; }
#contents .capImg a:hover img { border: 1px solid #828282; }
#contents p.capTxt{ margin-bottom: 0; padding: 0 9px 9px 9px; font-size: 100%!important; line-height: 150%!important; margin-top: 1.6rem!important; }
#contents p.capTxt:last-child{ margin-bottom: 1.6rem; }

/* single */
#contents .singleClm {clear: both;width: 80%;margin: 0px auto 1.5em auto;padding: 15px 9px 0 9px;background-color: #FFFAE7;border: 1px solid #CCCC99;}
#contents .bg_none{background-color: #ffffff;	border:none;}

/* 2column */
#contents .twoClm { display: flex; width: 100%; align-items: stretch; margin-bottom: 1.0em;}
#contents .twoClm .itemBlockL {	flex-basis: 100%;	padding: 9px 9px 0 9px;	background-color: #FFFAE7;	border: 1px solid #CCCC99;}
#contents .twoClm .itemBlockR {	flex-basis: 100%;	padding: 9px 9px 0 9px;	background-color: #FFFAE7;	border: 1px solid #CCCC99;}
#contents .twoClm .itemBlock {flex-basis: 46.6%;padding: 9px 9px 0 9px;	background-color: #FFFAE7;	border: 1px solid #CCCC99; margin-bottom: 1.0em;}
#contents .icon1 { flex-basis: 15%; display: flex; align-items: center; justify-content: center; flex-grow: 0; }
#contents .icon2 { flex-basis: 100%; display: flex; align-items: center; justify-content: center;  flex-grow: 0; margin-bottom: 1.0em;}

@media only screen and (max-width: 768px) {
	#contents .twoClm {display:block;}
	#contents .icon1 img, #contents .icon2 img { display: none;}
	#contents .icon1, #contents .icon2 {height: 20px; margin: 1.0em 0; background: url(/support/corner/wordlesson/images/sp-icon_arrow.gif) no-repeat center center;}
	#contents .icon1.notuse, #contents .icon2.notuse {background: none;}
}

#contents .knack .explain .explainInner .linespace div.putting, .h4area .inborder  div.putting{text-align: center; margin: 0.2em auto; width:80%;}
#contents .knack .explain .explainInner .linespace p.center, .h4area .inborder p.center{display: block; text-align: center; margin: 0.2em auto;}
#contents .knack .explain .explainInner .linespace p.note, .h4area .inborder p.note{background-color: #ffffff; border: double 3px #eeeeaa; margin: 0 0 0.5em; padding: 1em; font-size: 1.2em;}
#contents .knack .explain .explainInner .linespace p.note span, .h4area .inborder p.note span{color:#DED2BF;}
@media only screen and (max-width: 768px) {
	#contents .knack .explain .explainInner .linespace div.putting, .h4area .inborder  div.putting{width:100%;}
	#contents .knack .explain .explainInner .linespace p.note, .h4area .inborder p.note{font-size: 0.8em;}
}
/*---------- point ----------*/
#contents .point {border: solid 2px #FF5A7D; position: relative;}
#contents .point h3{padding: 5px 0px 0px 50px; font-size:1.2em; font-weight:bold; border-bottom:none; background:url(/support/corner/wordlesson/images/point_i.png) no-repeat, #ffffff url(/support/corner/wordlesson/images/point_bg.png) repeat-x;-pie-background:url(/support/corner/wordlesson/images/point_i.png) no-repeat, #ffffff url(/support/corner/wordlesson/images/point_bg.png) repeat-x; behavior: url(/usage/PIE.htc); min-height: 46px;}
#contents .point .explain{border-top:none;margin:0;margin-bottom: 1em;margin-top:-10px;padding:15px 15px 0;display:inline-block;}
#contents .point .explain dl,dt,dd {font-weight:bold;}
#contents .point .explain dl{clear:left;}
#contents .point .explain dt {padding: 0px 5px 0px 5px; background:#E00247; border:solid 2px #FF89AC; color:#ffffff; float:left; margin-bottom:1em;}
#contents .point .explain dd {padding: 0px 0px 11px 11px;float:left;}

/*---------- ps hedmaster ----------*/
#contents .ps { display: block;margin-top: 30px;}
#contents .ps p.master_comment {margin-left:260px; color:#C6295A; font-weight:bold; position:relative; background:#FCFCFC; padding:25px; text-align:left; border:2px solid #FF9999; border-radius:7px; -webkit-border-radius:7px; -moz-border-radius:7px;}
#contents .ps p.master_comment::before{content: ''; position: absolute;display: block; width: 0; height: 0;left: -15px; top: 20px; border-right: 15px solid #FF9999; border-top: 15px solid transparent; border-bottom: 15px solid transparent;}
#contents .ps p.master_comment::after{content: ''; position: absolute;display: block; width: 0; height: 0;left: -12px; top: 20px; border-right: 15px solid #FCFCFC; border-top: 15px solid transparent; border-bottom: 15px solid transparent;}
#contents .ps .headmasterImg img{float:left; margin-left:2em;}

@media only screen and (max-width: 768px) {
	#contents .ps p.master_comment {margin-left:0;}
	#contents .ps p.master_comment::before{top: -32px;left: 20%;border-bottom: 15px solid #FF9999;border-left: 15px solid transparent;border-right: 15px solid transparent}
	#contents .ps p.master_comment::after{top: -29px;left: 20%;border-bottom: 15px solid #FCFCFC;border-left: 15px solid transparent;border-right: 15px solid transparent;}
	#contents .ps .headmasterImg img{float:none;}
}
/*---------- link ----------*/
#contents #link{margin: 30px 0px 30px 0px;border: 1px solid #C90;}
#contents #link h3{padding: 5px 0px 0px 50px;font-size:1.2em;font-weight:bold;border-bottom:none;background:url(/support/corner/wordlesson/images/link_tit2.png) no-repeat, #ffffff url(/support/corner/wordlesson/images/link_bg2.png) repeat-x;-pie-background:url(/support/corner/wordlesson/images/point_i.png) no-repeat, #ffffff url(/support/corner/wordlesson/images/point_bg.png) repeat-x;behavior: url(/usage/PIE.htc);}
#link .linkInner {margin: 15px;}
#link .linkInner ul {margin-bottom: 0px; padding: 0px; list-style: none;}
#link .linkInner ul li {padding: 2px 0px 8px 22px; background: url(/support/corner/wordlesson/images/back_no_icon.png) no-repeat 0px 0.3em;}

/* ================== twitter ================== */
/*.fmvsupportTW{display: flex; margin: 1.5em 0; padding: 0; overflow: hidden;} 2025/1/23 */
.fmvsupportTW{display: none; margin: 1.5em 0; padding: 0; overflow: hidden;}
.fmvsupportTW .text{ margin: 0.2em 0 0; padding: 0 15px 0 0; font-weight: bold; line-height: 1.5; vertical-align: middle; }
.fmvsupportTW .text img {vertical-align: middle;}
.fmvsupportTW .btn{margin: 0; vertical-align: middle;}
@media only screen and (max-width: 768px) {
/*	.fmvsupportTW{display: block; margin: 1em 10px;} 2025/1/23 */
	.fmvsupportTW{display: none; margin: 1em 10px;}
	.fmvsupportTW .btn { text-align: center; margin-top: 1em;}
}

/* ==== サンプルデータのダウンロードについて =============*/
#about_sampledl h2{background:none; padding: 5px 0px 0px 60px; font-size:1.4em; font-weight:bold; border:solid 2px #FFAA33; border-radius:7px; margin-top:20px;
background:url(/support/corner/wordlesson/images/fix_i.png) no-repeat,#ffffff url(/support/corner/wordlesson/images/fix_bg.png) repeat-x;min-height: 65px;}
.dlbacknumber {border:solid 2px #FFAA33;margin:0;margin-bottom: 1em;margin-top:-15px;padding:30px 20px 30px 20px;background-color: #FCFCFC;}
.dlbacknumber h3{margin-bottom: 15px; margin-right: 10px; margin-top:1.5em; padding: 6px 20px 6px 36px; border-top:solid 2px #5AA15A; background: url(/support/corner/wordlesson/images/explain_h3icon2.png) no-repeat left top;color: #C6295A;font-size:1.2em;}
@media only screen and (max-width: 480px) {
	#about_sampledl h2{font-size:1.0em; padding-top: 10px;}
}