.sp { display: none }

/* pc start */

#mainContents .quizArea p.ttl {
font-size:158%;
}

#mainContents .comment01 p.pndPict {
position:absolute;
left:2%;
bottom:0;
width:45.7083%;/* 410px */
margin:0;
padding:32.992% 0 0;
background:url(/entertainment/kids/3r/img/fig_3r_mainpnd_pc.png) no-repeat left top;
background-size:100%;
}

#mainContents .quizArea .subheadPc {
display:block;
position:absolute;
top:-30px;
right:13px;
width:61.125%;
margin:0;
}

#mainContents .comment01 dl br {
display: block;
}

#mainContents p.answer {
font-size: 158%;
}

#mainContents .speech01pnd.ind03,
#mainContents .speech02pnd.ind01 {
width:69.3541%;
margin:0 0 20px 26.6459%;
}


#mainContents .commentGoal .pndPict {
width:214px;
}
#mainContents .commentGoal .speech {
width:512px;/*512px*/
}

#mainContents .comment01 p.ttlNomal {
float:left;
width:45%;
margin:0 0 0 5.283%;
color:#0A987E;
font-weight:bold;
}

#mainContents .comment01 p.ttlNomal {
font-size:168%;
}

#mainContents .comment01 dl {
width:49.283%;
}
#mainContents .comment01 div.box {
float:right;
clear:right;
margin:0 0 10px;
width:44%;
}

#mainContents .comment01 div.box p {
width: 100%;
margin: 2%;
padding: 0;
font-weight:normal;
color: #000000;
}


#mainContents .quizArea p.ttl{
width:100%;
}


#mainContents p.answer span:nth-child(2) {
padding-top:1px;
line-height:1.7;
}

#mainContents .innerBox.mb p.illustration.pc {
display: block;
margin: 0 0 10px 20px;
}
#mainContents .innerBox.mb p.illustration.sp {
display: none;
}


#mainContents .comment01 dl dt{
width:29%;
}
#mainContents .comment01 dl dd.one{
padding:2.5% 0 0 2.5%;
}
#mainContents .speech01pnd p.reduPnd02.ind01,
#mainContents .speech02pnd p.reduPnd02.ind01 {
right:3.4%;
}
#mainContents .quizArea ul li a span img {
margin:0 30% 0 30% ;
}
#mainContents .comment01 p.ttlNomal br{
display:block;
}
/* ============================================= /entertainment/kids/3r/recycle.html */
#mainContents .layoutBox.noMb{
margin-bottom:0;
}
#mainContents .layoutBox ul.recycle {
margin:0 15px 30px;
}
#mainContents .layoutBox.noMb p {
margin:0 0 30px;
}
#mainContents .layoutBox ul.recycle li {
float:left;
padding:0 20px 0 0;
width:47%;
}
#mainContents .layoutBox ul.recycle li:nth-child(2) {
padding:0;
}
#mainContents .quizArea ul li div {
max-height:125px;
min-height:125px;
}
#mainContents .quizArea ul li a span {
width:50%;
}

/* ============================================= /entertainment/kids/3r/reduce.html */
#mainContents .blackbord {
min-height:400px;
}

#mainContents .btnDls.noTxt,
#mainContents .btnDls {
display:block;
margin:0 5.2083% 50px;
overflow:hidden;
}
#mainContents .btnDls.noTxt p,
#mainContents .btnDls p {
width:48%;
margin:0;
}
#mainContents .btnDls p.editor {
clear:both;
width:100%;
margin:0 0 20px;
}
#mainContents .btnDls p:nth-child(1),
#mainContents .btnDls p:nth-child(2) {
margin:0 0 20px;
}
#mainContents .btnDls p:nth-child(1),
#mainContents .btnDls p:nth-child(4) {
float:left;
padding:0 0 10px;
}
#mainContents .btnDls p:nth-child(2),
#mainContents .btnDls p:nth-child(5) {
float:right;
padding:0 0 10px;
}

#mainContents .btnDls.noTxt p:nth-child(1),
#mainContents .btnDls.noTxt p:nth-child(3) {
float:left;
padding:0 0 10px;
}
#mainContents .btnDls.noTxt p:nth-child(2),
#mainContents .btnDls.noTxt p:nth-child(4) {
float:right;
padding:0 0 10px;
}



/* ==============================================================================  tablet start */

/*
{font-size:56%;}  9px
{ font-size: 62%; }10px
{font-size:81%;}  13px
{font-size: 113%}  18px
{font-size:125;}  20px */

#ttlImage {
margin:0 0 0;
padding:16.6666% 0 0;
background:url(/entertainment/kids/3r/img/fig_ttl_visual_pc.gif) no-repeat center;
background-size:100%;
}
#ttlImage img {
display:none;
}

#mainContents p.continue a span:nth-child(2) {font-size:94%;} /* 15px */
#mainContents .comment01 p {font-size:113%;} /* 18px */
#mainContents .commentGoal .speech,
#mainContents .innerBox h3  {font-size:100%;}/* 16px */

#mainContents .ttlNomal{ font-size:150%;} /* 22px */

/* =============================================
/entertainment/kids/3r/reuse_correct.html and  reduce_incorrect.html,
reuse_correct.html and reuse_incorrect.html
recycle_correct.html and recycle_incorrect.html */
#mainContents p.answerPict{
margin:0 5.2083% 50px;
padding:15.625% 0 0 0;/*150px*/
background:url(../img/fig_reduce_correct_pc.png) no-repeat left top;
background-size:100%;
}
#mainContents p.answerPictno{
margin:0 5.2083% 50px;
padding:15.625% 0 0 0;/*150px*/
background:url(../img/fig_reduce_wrong_pc.png) no-repeat left top;
background-size:100%;
}
/* Reuse */
#mainContents p.answerPictReu {
margin:0 5.2083% 50px;
padding:15.625% 0 0 0;/*150px*/
background:url(../img/fig_reduce_correct_pc.png) no-repeat left top;
background-size:100%;
}
#mainContents p.answerPictnoReu{
margin:0 5.2083% 50px;
padding:15.625% 0 0 0;/*150px*/
background:url(../img/fig_reduce_wrong_pc.png) no-repeat left top;
background-size:100%;
}
/* Recycle */
#mainContents p.answerPictRec {
margin:0 5.2083% 50px;
padding:15.625% 0 0 0;/*150px*/
background:url(../img/fig_reduce_correct_pc.png) no-repeat left top;
background-size:100%;
}
#mainContents p.answerPictnoRec{
margin:0 5.2083% 50px;
padding:15.625% 0 0 0;/*150px*/
background:url(../img/fig_reduce_wrong_pc.png) no-repeat left top;
background-size:100%;
}

#mainContents p.answerPict img,
#mainContents p.answerPictno img ,
#mainContents p.answerPictReu img,
#mainContents p.answerPictnoReu img,
#mainContents p.answerPictRec img,
#mainContents p.answerPictnoRec img,
#mainContents .quizArea ul li span.quizPnd {
display:none;
}



#mainContents p.gloss {
margin:0 50px 0;
width:auto;
}
#mainContents .answerArea {
width:auto;
margin:0 0 14px;
}

#mainContents p.answer {
margin:12px 0 10px 5.2083%;
padding-right:0;
overflow:hidden;
}
#mainContents p.answer br {
display:none;
}
#mainContents p.answer span:nth-child(1) {
display:block;
float:left;
width:15.5%;/*134px*/
height:44px;/*41px */
padding:0 10px 0 0;
background:url(../img/fig_reduce_correct_b_pc.gif) no-repeat left top;
background-size:100%;
}

#mainContents p.answer span:nth-child(1) img {
display:none;
}
#mainContents p.answer span:nth-child(2) {
display:block;
float:left;
width:80%;
padding:2px 0 0 5px;
color:#000000;
font-weight:bold;
line-height:2.1;
font-size:94%;/*15px*/
}

#mainContents .speechBorderR {
margin:0 5.2083% 68px;
}
#mainContents .speechBorderR p.pndPict01 img{
display:none;
}
#mainContents .speechBorderR p.pndPict02 {
display:block;
position:absolute;
right:2%;
bottom:0;
margin:0;
}
#mainContents .speechBorderR p.txt {
padding:25px 0;
}
#mainContents .speechBorderR p.txt {
width:76%;
margin:0 4%;
}
#mainContents .speechBorderR p.txt p.pndPict img {
width:auto;
vertical-align:bottom;
}



#mainContents .comment {
overflow:hidden;
margin:0  0 30px 5.2083%;
}
#mainContents .comment .pndPict {
float:left;
width:30.125%;/*214px*/
padding:6.5% 3% 0 0;
margin:0;
}
#mainContents .comment .speech {
float:left;
width:50%;/*512px*/
margin:4% 0 0 0;
padding:20px;
}
#mainContents .comment .speech img.arrow01 {
display:none;
}
#mainContents .comment .speech img.arrow02 {
display:block;
position:absolute;
top:20%;
left:-33px;
}

/* ========================================================================== */
.speechBorderR:before {
display:block;
position:absolute;
right:130px;
bottom:-24px;
width:40px;
height:20px;
border-width:0 0 2px 2px;
border-style:solid;
border-color:#0A987E;
border-bottom-left-radius:60px 37px;
background:none repeat scroll 0 0 transparent;
content:"";
z-index:10;
}
.speechBorderR:after {
display:block;
position:absolute;
right:130px;
bottom:-24px;
width:15px;
height:22px;
border-width:0 0 2px 2px;
border-style:solid;
border-color:#0A987E;
border-bottom-left-radius:40px 50px;
background:none repeat scroll 0 0 transparent;
content:"";
z-index:10;
}
.speechBorderR > *:first-child:before {
position:absolute;
right:128px;
bottom:-24px;
width:2px;
height:2px;
border-radius:9px;
background:none repeat scroll 0 0 #0A987E;
content:"";
}
.speechBorderR > *:first-child:after {
position:absolute;
right:145px;
bottom:-8px;
width:25px;
height:15px;
background:none repeat scroll 0 0 #FFFFFF;
content:"";
}



/* ============================================= /entertainment/kids/3r/reduce.html */

#container h1.ttlBg {
	font-size: 156%;
	color: #FFFFFF;
	margin-bottom: 10px;
	border: 3px solid #E5243B;
	width: 80%;
	margin-right: auto;
	margin-left: auto;
	background-color: #F00;
	padding-top: 15px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
}/* 25px */

#mainContents .blackbord {
width:91.07%;
min-height:480px;
margin:0 auto 30px;
background:url(../img/fig_blackboard_pc.png) no-repeat left top;
background-size:100% 100%;
}
#mainContents .blackbord .aboutReduce {
float:left;
margin:4.37% 0 0 0;
padding:0 1% 0 5.2%;
width:45.45%;
color:#FFFFFF;
font-weight:bold;
}
#mainContents .blackbord .aboutReduce h2 {
margin:0 0 20px;
font-weight:bold;
font-size:138%;/*22px*/
}
#mainContents .blackbord .aboutReduce p.txt{
margin:0;
}
#mainContents .blackbord p.pict {
float:right;
width:43%;
margin:5% 0 0 0;
padding:0 3.5% 0 0;
}


#mainContents .blackbord p.pict.recyPict {
float:left;
background:url(../img/fig_recycle_pc.png) no-repeat left top;
background-size:100%;
min-height:336px;
}
#mainContents .blackbord p.pict.reusePict {
float:left;
background:url(../img/fig_reuse_pc.png) no-repeat left top;
background-size:100%;
min-height:336px;
}
#mainContents .blackbord p.pict.reducePict {
float:left;
background:url(../img/fig_reduce_pc.png) no-repeat left top;
background-size:100%;

min-height:336px;
}
#mainContents .blackbord p.pict img {
display:none;
}


#mainContents .speech01pnd p.reduBoy02{
display:block;
position:absolute;
top:-110px;
left:-28.66%;
padding:0;
}
#mainContents .speech01pnd p.reduPnd02 {
display:block;
position:absolute;
top:-157px;
right:0;
padding:0;
z-index:300;
}


#mainContents p.gloss {
margin:0 4% 0 4%;
}
#mainContents p.gloss img {
width:auto;
}
.answerArea {
width:100%;
margin:0 0 0.8% 0;
}
#mainContents .answerArea .answer span {
display:inline;
padding:0 1.2% 0 0;
}


#mainContents .speech01pnd,
#mainContents .speech02pnd {
margin-right: 5.2083%;
}
#mainContents .speech01boy,
#mainContents .speech02boy {
margin-left:5.2083%;
}


.speechBorderR:before {
display:block;
position:absolute;
right:130px;
bottom:-24px;
width:40px;
height:20px;
border-width:0 0 2px 2px;
border-style:solid;
border-color:#0A987E;
border-bottom-left-radius:60px 37px;
background:none repeat scroll 0 0 transparent;
content:"";
z-index:10;
}
.speechBorderR:after {
display:block;
position:absolute;
right:130px;
bottom:-24px;
width:15px;
height:22px;
border-width:0 0 2px 2px;
border-style:solid;
border-color:#0A987E;
border-bottom-left-radius:40px 50px;
background:none repeat scroll 0 0 transparent;
content:"";
z-index:10;
}
.speechBorderR > *:first-child:before {
position:absolute;
right:128px;
bottom:-24px;
width:2px;
height:2px;
border-radius:9px;
background:none repeat scroll 0 0 #0A987E;
content:"";
}
.speechBorderR > *:first-child:after {
position:absolute;
right:145px;
bottom:-8px;
width:25px;
height:15px;
background:none repeat scroll 0 0 #FFFFFF;
content:"";
}

#mainContents .speechBorderR,
.speech01pnd,
.speech02pnd,
.speech01boy,
.speech02boy {
border-radius:25px;
-webkit-border-top-left-radius:25px;
-webkit-border-top-right-radius:25px;
-webkit-border-bottom-right-radius:25px;
-webkit-border-bottom-left-radius:25px;
-moz-border-radius:25px;
}

/* ========================================================================== */
.speech01pnd:before {
position:absolute;
right:112px;
top:-15px;
height:18px;
border-left:60px solid #9ED550;
border-top-left-radius:100px 50px;
-webkit-border-top-left-radius:100px 50px;
-moz-border-radius-topleft:100px 50px;
background:none repeat scroll 0 0 #333333;
background:#9ED550; /* for webkit - bug in handling of border-radius */
content:"";
transform:translate(0, -2px);
-webkit-transform:translate(0, -2px);
-moz-transform:translate(0, -2px);
-ms-transform:translate(0, -2px);
-o-transform:translate(0, -2px);
/*z-index:101;*/
}
.speech01pnd:after {
background:none repeat scroll 0 0 #FFFFFF;
border-top-left-radius:100px 50px;
-webkit-border-top-left-radius:100px 50px;
-moz-border-radius-topleft:100px 50px;
content:"";
height:22px;
right:50px;
position:absolute;
top:-20px;
transform:translate(-6px, -2px);
width:99px;
/*z-index:101;*/
border-top-left-radius:100px 50px;
transform:translate(-6px, -2px);
-webkit-transform:translate(-6px, -2px);
-moz-transform:translate(-6px, -2px);
-ms-transform:translate(-6px, -2px);
-o-transform:translate(-6px, -2px);
}
.speech02pnd:before {
position:absolute;
right:110px;
bottom:-17px;
height:15px;
border-left:60px solid #9ED550;
-webkit-border-bottom-left-radius:100px 50px;
-moz-border-radius-bottomleft:100px 50px;
border-bottom-left-radius:100px 50px;
background:none repeat scroll 0 0 #333333;
background:#9ED550; /* for webkit - bug in handling of border-radius */
content:"";
transform:translate(0, -2px);
-webkit-transform:translate(0, -2px);
-moz-transform:translate(0, -2px);
-ms-transform:translate(0, -2px);
-o-transform:translate(0, -2px);
/*z-index:101;*/
}
.speech02pnd:after {
background:none repeat scroll 0 0 #FFFFFF;
content:"";
height:20px;
right:58px;
position:absolute;
bottom:-22px;
transform:translate(-6px, -2px);
width:90px;
/*z-index:101;*/
-webkit-border-bottom-left-radius:100px 50px;
-moz-border-radius-bottomleft:100px 50px;
border-bottom-left-radius:100px 50px;
transform:translate(-6px, -2px);
-webkit-transform:translate(-6px, -2px);
-moz-transform:translate(-6px, -2px);
-ms-transform:translate(-6px, -2px);
-o-transform:translate(-6px, -2px);
}

.speech01boy:before {
position:absolute;
left:112px;
bottom:-16px;
height:15px;
border-right:60px solid #B0E5FF;
border-bottom-right-radius:100px 50px;
-webkit-border-bottom-right-radius:100px 50px;
-moz-border-radius-bottomright:100px 50px;
background:none repeat scroll 0 0 #333333;
background:#B0E5FF; /* for webkit - bug in handling of border-radius */
content:"";
transform:translate(0, -2px);
-webkit-transform:translate(0, -2px);
-moz-transform:translate(0, -2px);
-ms-transform:translate(0, -2px);
-o-transform:translate(0, -2px);
/*z-index:101;*/
}
.speech01boy:after {
background:none repeat scroll 0 0 #FFFFFF;
border-bottom-right-radius:100px 50px;
-webkit-border-top-right-radius:100px 50px;
-moz-border-radius-topright:100px 50px;
content:"";
height:20px;
left:50px;
position:absolute;
bottom:-22px;
transform:translate(-6px, -2px);
width:110px;
/*z-index:101;*/
/* using translate to avoid undesired appearance in CSS2.1-capabable but CSS3-incapable browsers */
-webkit-transform:translate(-6px, -2px);
-moz-transform:translate(-6px, -2px);
-ms-transform:translate(-6px, -2px);
-o-transform:translate(-6px, -2px);
transform:translate(-6px, -2px);
}
.speech02boy:before {
position:absolute;
left:110px;
top:-12px;
height:15px;
border-right:60px solid #B0E5FF;
border-top-right-radius:100px 50px;
-webkit-border-top-right-radius:100px 50px;
-moz-border-radius-topright:100px 50px;
background:none repeat scroll 0 0 #333333;
background:#B0E5FF; /* for webkit - bug in handling of border-radius */
content:"";
transform:translate(0, -2px);
-webkit-transform:translate(0, -2px);
-moz-transform:translate(0, -2px);
-ms-transform:translate(0, -2px);
-o-transform:translate(0, -2px);
transform:translate(0, -2px);
/*z-index:101;*/
}
.speech02boy:after {
background:none repeat scroll 0 0 #FFFFFF;
border-top-right-radius:100px 50px;
-webkit-border-top-right-radius:100px 50px;
-moz-border-radius-topright:100px 50px;
content:"";
height:20px;
left:50px;
position:absolute;
top:-18px;
width:109px;
/*z-index:101;*/
border-top-right-radius:100px 50px;
transform:translate(-6px, -2px);
-webkit-transform:translate(-6px, -2px);
-moz-transform:translate(-6px, -2px);
-ms-transform:translate(-6px, -2px);
-o-transform:translate(-6px, -2px);
}

#mainContents .innerBox {
margin:0 6% 5.2%;
border:4px solid #0A987E;
border-radius:9px;
}
#mainContents .innerBox.mb {
margin:0 5.2% 10%;
}
#mainContents .innerBox.mb p {
margin:0 30px 40px;
}


#mainContents ul.lookRedu li img {
display:none;
}
#mainContents ul.lookRedu {
overflow:hidden;
margin:0 10px 30px;
}
#mainContents ul.lookRedu li:nth-child(1) {
display:inline-block;
width:50%;
padding:21.0354% 0 0;/*151px*/
background:url(../img/fig_redu_look01_pc.gif) no-repeat left top;
background-size:100%;
}
#mainContents ul.lookRedu li:nth-child(2) {
display:inline-block;
width:50%;/*359px*/
padding:21.0354% 0 0;/*151px*/
background:url(../img/fig_redu_look02_pc.gif) no-repeat left top;
background-size:100%;
}

/*
#mainContents .speech01pnd,
#mainContents .speech02pnd,
#mainContents .speech01boy,
#mainContents .speech02boy {
margin-right:5.2%;
margin-left:5.2%;
}

#mainContents .speech01pnd p,
#mainContents .speech02pnd p,
#mainContents .speech01boy p,
#mainContents .speech02boy p {
margin:0;
padding:6% 6.8%;
}*/
#mainContents .speech01pnd.rud {
width:68.66%;
margin:30px 50px 4% 26.32%;
}
#mainContents .speech01boy.rud {
width:75%;
margin-bottom:8%;
}
#mainContents .speech01boy.reu {
width:75%;
margin-bottom:20px;
}
.speech01pnd,.speech02pnd,
.speech01boy,.speech02boy {
overflow:visible;
padding:0;
}

#mainContents .speech01pnd p.reduPnd01,
#mainContents .speech01boy p.reduBoy01,
#mainContents .speech02pnd p.reduPnd01,
#mainContents .speech02boy p.reduBoy01 {
display:none;
float:none;
}

/* ================= for boy ================= */
#mainContents .speech01boy p.reduBoy02,
#mainContents .speech02boy p.reduBoy02 {
	display: block;
	position: absolute;
	left: 0%;
	bottom: 0;
	padding: 0;
	margin-top: 0;
	margin-right: 10;
	margin-bottom: 0;
	margin-left: 0;
}
#mainContents .speech01boy p.txt,
#mainContents .speech02boy p.txt {
float:none;
width:50%;
margin:0 0 0 20%;
padding:4% 6.8% 6% 0;
width:auto;
}

#mainContents .speech01boy.ind01 {
width:80.5%;
margin:0 32.5% 20px 5.2083%;
}
#mainContents .speech02boy.ind03 {
margin:0 16.66% 20px 16.66%;
}
#mainContents .speech01boy.rec{
width:75%;
min-height:128px;
margin-bottom: 20px;
}
#mainContents .speech01boy.rec02{
width:75%;
min-height:50px;
margin-bottom: 20px;
}
/* ================= for pnd ================= */
#mainContents .speech01pnd p.reduPnd02,
#mainContents .speech02pnd p.reduPnd02 {
display:block;
position:absolute;
right:5%;
bottom:0;
margin:0;
padding:0;
}
#mainContents .speech01pnd p.reduPnd02.ind01,
#mainContents .speech02pnd p.reduPnd02.ind01 {
	right: -5%;
}

#mainContents .speech01pnd p.txtReduce,
#mainContents .speech02pnd p.txtReduce {
float:none;
width:50%;
padding:3% 6% 3% 6.8%;
width:auto;
}
#mainContents .speech01pnd p.txt,
#mainContents .speech02pnd p.txt {
float:none;
width:50%;
margin:0 18% 0 0;
padding:3% 6% 3% 6.8%;
width:auto;
}
#mainContents .speech01pnd.ind03,
#mainContents .speech02pnd.ind01 {
width:80.3541%;
margin:0 0 20px 10.6459%;
}


#mainContents .speech01pnd.ind03  p.reduPnd02 {
right:-8%;
top:0;
width:44.1%;
margin:-26% 0 0;
}
#mainContents .speech02pnd p.reduPnd02 img{
width:90%;
}


#mainContents .speech02pnd.reu {
width:69.3541%;
margin:0 0 50px 26.6459%;
}
/*=================================== */
#mainContents .quizArea p.ttl.separate {
overflow:hidden;
}
#mainContents .quizArea p.ttl.separate span {
display:block;
}
#mainContents .quizArea p.ttl.separate span:nth-child(2) {
float:left;
padding:0;
color:#000000;
}
#mainContents .quizArea p.ttl.separate span:nth-child(1) {
float:left;
}

#mainContents .quizArea p.ttl.separate span:nth-child(2) br{
display:block;
line-height:0;
}
#mainContents .quizArea p.ttl span {
display:inline-block;
}

s#mainContents .quizArea .subheadPc {
display:block;
position:absolute;
top:-10%;
right:2.0833%;
margin:0;
width:61.6645%;/*489px*/
text-align:right;
}
#mainContents .quizArea .subheadSp,
#mainContents .quizArea span.pnd {
display:none;
}



#mainContents .quizArea div.wrap {
padding:0;
}
#mainContents .quizArea {
position:relative;
margin: 0 50px 45px;
padding:25px 25%;
}

#mainContents .quizArea p.ttl {
font-size:113%;
}
#mainContents .quizArea ul {
margin:0;
width:100%;
overflow:hidden;
/*flex-derection:row;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:flex;*/
}

#mainContents .quizArea {
margin:0 50px 50px;
padding:7% 30px 38px;
position: relative;
}

#mainContents .quizArea ul li {
float: left;
width:48%;
min-height:106px;
border:2px solid #0A987E;
margin: 0;
}
#mainContents .quizArea ul li:nth-child(1) {
margin:0 2% 0 0;
}
#mainContents .quizArea ul li a {
display:block;
background:#B0E5FF;
color:#000000;
}
#mainContents .quizArea ul li div {
min-height:190px;
max-height:190px;
margin:0;
padding:0;
border:3px solid #ffffff;
}
#mainContents .quizArea ul li:nth-child(1) div {
background: url(/entertainment/kids/3r/img/fig_reduce_girl01_pc.png) no-repeat 98% 100%;
}
#mainContents .quizArea ul li:nth-child(2) div {
background: url(/entertainment/kids/3r/img/fig_reduce_boy03_pc.png) no-repeat 95% 100%;
}
#mainContents .quizArea ul li p {
overflow:hidden;
margin:0 0 0 3.12%;
padding:4% 0;
}
#mainContents .quizArea ul li a p img {
display:inline-block;
vertical-align:top;
}
#mainContents .quizArea ul li a span {
width:65%;
margin:0 0 0 3.12%;
}
#mainContents .quizArea ul li a span img {
margin:0 30% 0 15% ;
}

/* ============================================= /entertainment/kids/3r/index.html */
#mainContents .comment01 {
position:relative;
margin:0 5.2083% 0 0;
overflow:hidden;
}
#mainContents .comment01 p.ttlNomal {
font-size:150%;
}
#mainContents .comment01 p.ttlNomal br{
display:none;
}
#mainContents .comment01 dl {
float:right;
width:46%;
margin:0;
padding:0 0 10px;
overflow:hidden;
}
#mainContents .comment01 dl dt{
float:left;
clear:left;
width:33%;
padding:2%;
margin:0 0 10px;
background:#038C7C;
color:#FFFFFF;
font-weight:bold;
font-size:113%;/*18px*/
line-height:1;
}
#mainContents .comment01 dl dt span {
display:block;
font-size:75%;/*12px*/
}
#mainContents .comment01 dl dd{
float:left;
width:60%;
margin:0 0 0;
padding:0 0 0 2.5%;
font-weight:bold;
font-size:113%;/*18px*/
}
#mainContents .comment01 div.box {
float:right;
clear:right;
margin:0 0 10px;
width:40%;
padding:0 5.2083% 10px 0;
}
#mainContents .comment01 div.box p {
width:100%;
padding:5.8% 4% 7% 4%;
}
#mainContents .comment01 div.box span.arrow {
display:none;
}
#mainContents .comment01 p.pndPict {
position:absolute;
left:2%;
bottom:0;
width:42.7083%;/* 410px */
margin:0;
padding:28.9920% 0 0 0;/* 302px*/
background:url(../img/fig_3r_mainpnd_pc.png) no-repeat left top;
background-size:100%;
}
#mainContents .comment01 p.pndPict img {
display:none;
}
#mainContents .comment01 p {
float:left;
width:45%;
margin:0 0 0 5.283%;
font-size:100%;
}
#mainContents .comment01 p span {
color:#F78C1A;
}
#mainContents .layoutWrap {
position:relative;
}

#mainContents .layoutWrap p.indexMain {
padding:18.5416% 0 0;/* 178px */
margin-bottom: 30px;
background:url(../img/fig_3r_h1pict_pc.png ) no-repeat left top;
background-size:100%;
}
#mainContents p.indexMain img{
display:none;
}
#mainContents .layoutWrap p.two {
display:block;
position:absolute;
top:45%;
left:5%;
width:50.25%;
margin:0;
}


#mainContents .blackbord p.pic0t2 {
float:left;
width:40%;
margin: 4.37% 0 0;
}
#mainContents .blackbord .doubleBox {
float: left;
margin: 4.37% 0 0;
padding: 0 1% 0 5.2%;
width: 45.45%;
}
#mainContents .blackbord p.pict02 {
float: left;
margin:4.37% 0 0;
width: 46%;
}

#mainContents .blackbord p.pict02 img {
margin: 0 auto;
width:100%;
}

#mainContents .blackbord.ind02 {
position:relative;
background:url(../img/fig_index_bb01_pc.png) no-repeat left top;
background-size:100% 100% ;
margin: 0 auto 0;
min-height: 300px;
width: 90.283%;
}

#mainContents .blackbord div.about3r {
margin:25px 0 0 ;
}

#mainContents .blackbord .about3r div h2 {
width:100%;
margin-bottom:0;
text-align:center;
overflow:hidden;
font-size:138%;/*22px*/
}
#mainContents .blackbord .about3r div h2 span {
font-size:100%;/*16px*/
}

#mainContents .blackbord .about3r div p {
font-size:100%;/*16px*/
text-align:center;
}

#mainContents .blackbord div.about3r div {
width:100%;
}
#mainContents .blackbord .about3r .pict  {
display:none;
}
#mainContents .blackbord ul.about3r {
overflow:hidden;
width:100%;
margin:0 2.875% 10px;
}
#mainContents .blackbord  ul.about3r li img {
display:none;
}
#mainContents .blackbord  ul.about3r li:nth-child(1) {
float:left;
width:33%;
padding:29.125% 0 0 0;
background:url(../img/fig_3r_bbpict02_list01_pc.png) no-repeat left top;
background-size:100%;
}
#mainContents .blackbord  ul.about3r li:nth-child(2) {
float:left;
width:30.75%;
padding:29.125% 0 0 0;
background:url(../img/fig_3r_bbpict02_list02_pc.png) no-repeat left top;
background-size:100%;
}
#mainContents .blackbord  ul.about3r li:nth-child(3) {
float:left;
width:30.5%;
padding:29.125% 0 0 0;
background:url(../img/fig_3r_bbpict02_list03_pc.png) no-repeat left top;
background-size:100%;
}


#mainContents .layoutWrap p.icon3r01 {
display:block;
position:absolute;
bottom:-40%;
left:-2%;
width:15.5208%;
padding:0 0 0;
}

#mainContents .layoutWrap p.icon3r02 {
display:block;
position:absolute;
bottom:-20%;
right:2%;
/*width:25.2083%;*/
margin:0;
padding:0 0 0;
}

#mainContents .speech02boy.ind.mgt {
margin:4% 0 30px 15%;
width:35%;
}

#mainContents .layoutWrap02 {
display:block;
position:relative;
margin:-20% 0 0;
}
#mainContents .layoutWrap02 p.boy {
display:block;
position:absolute;
left:0;
top:0;
width:18.125%;
margin:-10% 0 0 4%;
}
#mainContents .speech02boy.ind03 {
margin-top:6%;
margin-left:26.7%;
width:40%;
}
#mainContents .layoutWrap02 div.speech01pnd.ind03 {
display:block;
margin-top:25%;
}

#mainContents .commentGoal {
overflow:hidden;
margin:0  0 30px 5.2083%;
}
#mainContents .commentGoal .pndPict {
float:left;
width:30.125%;/*214px*/
padding:6.5% 3% 0 0;
}
#mainContents .commentGoal .speech {
float:left;
width:50%;/*512px*/
margin:4% 0 0 0;
padding:20px;
}
#mainContents .commentGoal .speech img.arrow01 {
display:none;
}
#mainContents .commentGoal .speech img.arrow02 {
display:block;
position:absolute;
top:20%;
left:-33px;
}
#mainContents .search {
margin:0 20px 30px;
}

/* ============================================= /entertainment/kids/3r/reuse.html */
#mainContents .layoutBox {
overflow:hidden;
margin:0 30px 100px;
padding:0;
}
#mainContents .layoutBox .layoutBoxin{
overflow:hidden;

padding:0;
}
#mainContents .layoutBoxRcy,
#mainContents .layoutBoxReu {
display:block;
position:relative;
padding:0 0 10%;
}

#mainContents .layoutBoxRcy p.reuBoy {
display:block;
position:absolute;
left:3%;
bottom:2%;
margin:0;
}
#mainContents .layoutBoxRcy p.reuPnd {
display:block;
position:absolute;
right:-5%;
bottom:25%;
}
#mainContents .layoutBoxRcy .speech01pnd {
width:50%;
margin:0 0 0 46.1%;
}

#mainContents .layoutBoxRcy .speech01pnd p.txt {
float: none;
margin: 0;
padding: 3% 6% 3%;
width: auto;
}


#mainContents .layoutBoxReu p.recyBoy01 {
display:block;
position:absolute;
left:3%;
bottom:5%;
margin:0;
}
#mainContents .layoutBoxReu p.recyPnd {
display:block;
position:absolute;
right:-4%;
bottom:25%;
}
#mainContents .layoutBoxReu .speech02boy {
width:50%;
margin:0 0 0 25%;
}
#mainContents .layoutBoxReu .speech02boy p.txt {
float:none;
margin:0;
padding: 4% 6.8% 6% 6.8%;
width: auto;
}

#mainContents .layoutBoxReu p.reuBoy {
display:block;
position:absolute;
left:-2%;
bottom:5%;
margin:0;
}

#mainContents .layoutBoxReu p.reuPnd {
display:block;
position:absolute;
right:-4%;
bottom:18%;
}
/* ============================================= /entertainment/kids/3r/recycle.html */
#mainContents .layoutBox.noMb{
margin-bottom:0;
}
#mainContents .layoutBox ul.recycle {
width:100%;
margin:0 auto 30px;
}
#mainContents .layoutBox.noMb p {
margin:0 0 30px;
}
#mainContents .layoutBox ul.recycle li {
float:left;
width:47.6%;
padding:0 20px 0 0;
}
#mainContents .layoutBox ul.recycle li:nth-child(2) {
padding:0;
}


#mainContents .layoutBox.noMb {
padding:0;
}
#mainContents .layoutBox p:nth-child(1) {
float:left;
width:47%;
margin:0;
}
#mainContents .innerBox.mb p.illustration{
float:right;
margin:0;
width:50%;
}
#mainContents .innerBox.mb .illustration img {
margin:0;
float:right;
}
#mainContents .innerBox.mb p.illustration.pc {
display: none;
}


#mainContents p.answer span:nth-child(1).alx {
float:left;
margin:0;
display:block;
background:url(../img/fig_reduce_correct_a_pc.png) no-repeat left top;
background-size:100%;
width:15%;
}


/* ===============================================================================
								for TABLET size  (brakepoint 640px)
  =============================================================================== */

#Container { font-size: 16px; }
{font-size:56%;} /* 9px */
{ font-size: 62%; }/* 10px */
 {font-size:81%;} /* 13px */
#mainContents p.continue a span:nth-child(2) {font-size:94%;} /* 15px */
#mainContents .comment01 p {font-size:113%;} /* 18px */
#mainContents .commentGoal .speech,
#mainContents .innerBox h2,
#mainContents .innerBox h3,
#mainContents p.continue a span:nth-child(1),
#mainContents .ttlBg {font-size:100%;}/* 16px */
{font-size: 113%} /* 18px */
{font-size:125;} /* 20px */
#mainContents .bgGy h1.ttl{ font-size:150%;} /* 22px */


#mainContents .mgRl {
margin-right:5.2083%; margin-left:5.2083%
}

#mainContents p,
#mainContents ul,
#mainContents ol,
#mainContents dl {
margin-right:5.2083%; margin-left:5.2083%;
}
#mainVisual p.openNav { display:none; }

#Cont {width:100%;
}
#wrapper {
margin:0;
padding:0 0 304px;
background-image:url(../img/bg_sun.gif),url(../img/bg_top.png),url(../img/bg_bottom.png);
background-repeat:no-repeat,no-repeat,no-repeat;
background-position:100% -1.3%,top center,bottom center;
background-color:#b0E5FF;
}
#Container {
max-width: 960px;
margin:0 auto;
background:transparent;
}
#mainVisual img.sp {
display:none;
}
#mainVisual img.pc {
display:block;
position:absolute;
top:0;
left:6.5625%;
width:20.625%;
margin:0;
}
#mainVisual {
position:relative;
padding:12.0833% 0 0;
background:#B0E5FF;
background:url(../../img/fig_main_visual_pc.png) no-repeat center;
background-size:100%;
}

#mainContents .ttl br,
#mainContents .ttlBg br,
#mainContents .makeUniform ol li br {
display:none;
}
.ttlBg {
margin-bottom:3.12%;
}

a.newWin {
padding:0 0 0 24px;
background:url(/entertainment/kids/img/ico_arrows_window.gif) no-repeat left top;
line-height:1.2;
}


#mainContents {
	border: 5px solid #FFF;
	border-radius: 9px;
	background: #FFFFFF;
	margin-top: 6px;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
	padding: 5px;
	width: 80%;
}
#mainContents .ttlBg {
text-align:center;
}

/* ================================= articlesNav */
nav table.sp {
display:none;
}
.fixedBox {
/*margin:0 0 3.5358%;*/
margin: 0 0 1.5358%;
}
.fixedBox nav  {
margin:-4.4% 0 0;
padding:0 0 0 136px;
position:relative;
}
nav.contents ul.pc {
display:block;
overflow:hidden;
}
nav.contents ul.pc li {
float:left;
width:24%;
padding:0 1px 0 0 ;
}
nav.contents ul.pc li:nth-child(4) {
margin-right:0;
}
nav.contents ul.pc li a {
display:block;
padding:0;
width:100%;
background:none;
border:none;
font-size:0;
}
nav.contents ul.pc li a:hover {
background:none;
border:none;
}



/* ================================= innerBox style  */
#mainContents .innerBox {
margin:0 5.2083% 30px 5.2083%;
border:3px solid #0A987E;
border-radius:9px;
}
#mainContents .innerBox h2 span,
#mainContents .innerBox h3 span {
padding:0 0 0 130px;
margin:0;
}
#mainContents .innerBox.mb {
margin:0 5.2083% 10%;
}
#mainContents .innerBox hs span br,
#mainContents .innerBox h3 span br {
display:none;
}
/* =================================
#gNav and #footerNav
================================= */
#gNav_sp,
#footerNav_sp {
display:none;
}
#gNav_pc li,
#footerNav_pc li {
float:left;
width:25%;
}
#gNav_pc li a,
#footerNav_pc li a{
display:block;
}
#gNav_pc > li > a,
#footerNav_pc > li > a{
text-decoration: none;
}
#gNav_pc li ul li,
#footerNav_pc li ul li {
display:block;
float:none;
width:85.5%;
}
#gNav_pc li ul li a,
#footerNav_pc li ul li a {
color:#333333;
padding-right:10px;
}
/* ======== gNav ======== */
#utilities {
position:relative;
margin:-10px 0 0 0;
z-index:1;
}
#gNav_pc {
display:block;
overflow:hidden;
position:absolute;
width:100%;
z-index:50;
}
#gNav_pc li:hover ul {
display:block;
background:#FFFFFF;
}
#gNav_pc li a span {
display:block;
padding:10px 30px 10px 35px;
color:#FFFFFF;
font-weight:bold;
font-size:63%;/*10px/16px*/
white-space:pre-wrap;
}
#gNav_pc li.play a span {
background:url(../img/ico_play_sp.gif) no-repeat left center, url(../img/ico_play_open.gif) no-repeat right center #FF647B;
background-size:40px 40px;
}
#gNav_pc li.know a span {
background:url(../img/ico_know_sp.gif) no-repeat left center, url(../img/ico_know_open.gif) no-repeat right center #2D9AD2;
background-size:40px 40px;
}
#gNav_pc li.study a span {
background:url(../img/ico_study_sp.gif) no-repeat left center, url(../img/ico_study_open.gif) no-repeat right center #1Ab297;
background-size:40px 40px;
}
#gNav_pc li.pickup a span {
background:url(../img/ico_pickup_sp.gif) no-repeat left center, url(../img/ico_pickup_open.gif) no-repeat right center #F78B1A;
background-size:40px 40px;
}
#gNav_pc li.play ul li {
background:url(../img/ico_arw_rd.gif) no-repeat 5% 50%;
}
#gNav_pc li.know ul li {
background:url(../img/ico_arw_bl.gif) no-repeat 5% 50%;
}
#gNav_pc li.study ul li {
background:url(../img/ico_arw_gl.gif) no-repeat 5% 50%;
}
#gNav_pc li.pickup ul li {
background:url(../img/ico_arw_or.gif) no-repeat 5% 50%;
}

#gNav_pc li ul li {
padding:6px 10px 6px 20px;
font-size:81%;
line-height:2;
border-bottom:1px solid #999;
}
#gNav_pc li ul li  a{
display:inline;
}

#gNav_pc > li > a + ul {
display:none;
}
#gNav_pc li:hover > a + ul {
display:block;
}

/* ======== footerNav ======== */
nav.fields {
padding:0;
border-bottom:none;
background:#FFFFFF;
}
#footerNav_pc {
display:block;
}
#footerNav_pc {
overflow:hidden;
padding:0 0 4%;
background:#FFFFFF;
}
#footerNav_pc li a span {
display:block;
height:29px;
padding:0 0 0 40px;
color:#FFFFFF;
font-weight:bold;
font-size:63%;/*10px/16px*/
width:100%;
line-height:3;
}
#footerNav_pc li.play a span {
background:url(../img/ico_play_pc.gif) no-repeat left center #F16161;
background-size:30px 30px;
}
#footerNav_pc li.know a span {
background:url(../img/ico_know_pc.gif) no-repeat left center #45C5F2;
background-size:30px 30px;
}
#footerNav_pc li.study a span {
background:url(../img/ico_study_pc.gif) no-repeat left center #61C5BD;
background-size:30px 30px;
}
#footerNav_pc li.pickup a span {
background:url(../img/ico_pickup_pc.gif) no-repeat left center #FEBB15;
background-size:30px 30px;
}

#footerNav_pc li ul li {
padding:6px 0 6px 40px;
font-size:81%;
}
#footerNav_pc li.play ul li {
background:url(../img/ico_arw_rd.gif) no-repeat 10% 50%;
}
#footerNav_pc li.know ul li {
background:url(../img/ico_arw_bl.gif) no-repeat 12% 50%;
}
#footerNav_pc li.study ul li {
background:url(../img/ico_arw_gl.gif) no-repeat 12% 50%;
}
#footerNav_pc li.pickup ul li {
background:url(../img/ico_arw_or.gif) no-repeat 12% 50%;
}

#mainContents .btnDls.noTxt,
#mainContents .btnDls {
display:block;
margin:0 5.2083% 50px;
overflow:hidden;
}
#mainContents .btnDls.noTxt p,
#mainContents .btnDls p {
width:48%;
margin:0;
}
#mainContents .btnDls p.editor {
clear:both;
width:100%;
margin:0 0 20px;
}
#mainContents .btnDls p:nth-child(1),
#mainContents .btnDls p:nth-child(2) {
margin:0 0 20px;
}
#mainContents .btnDls p:nth-child(1),
#mainContents .btnDls p:nth-child(4) {
float:left;
padding:0 0 10px;
}
#mainContents .btnDls p:nth-child(2),
#mainContents .btnDls p:nth-child(5) {
float:right;
padding:0 0 10px;
}

#mainContents .btnDls.noTxt p:nth-child(1),
#mainContents .btnDls.noTxt p:nth-child(3) {
float:left;
padding:0 0 10px;
}
#mainContents .btnDls.noTxt p:nth-child(2),
#mainContents .btnDls.noTxt p:nth-child(4) {
float:right;
padding:0 0 10px;
}

/*#mainContents p.continue a span:nth-child(1) {
display:block;
padding:6px 0 0 22px;
}
#mainContents p.continue a span:nth-child(2) {
display:block;
float:left;
width:58%;
padding:0 0 0 43px;
background:url(/entertainment/kids/img/ico_arrows_sp.gif) no-repeat 6.2879% 50%;
background-size:22px 22px;
}*/

#mainContents .getAdobeReader {
margin: 0 0 20px 50px;
}
#mainContents .getAdobeReader img {
float:left;
}


/* ===============================================================================
								for PC size (brakepoint 768px)
  =============================================================================== */
#mainContents p,
#mainContents ul,
#mainContents ol,
#mainContents dl {
margin-right:5.2083%;
margin-left:5.2083%;
}
#container .ttlBg {font-size:156%;}/* 25px */
#mainContents .bgGy h1.ttl{ font-size:212%;} /* 34px */


#Cont {width:100%;
}
#wrapper {
margin:0;
padding:0 0 304px;
background-image:url(../../img/bg_sun.gif),url(../../img/bg_top.png),url(../../img/bg_bottom.png);
background-repeat:no-repeat,no-repeat,no-repeat;
background-position:100% -1.3%,top center,bottom center;
background-color:#b0E5FF;
}

/* ================================= BTN continue style  */
#mainContents p.continue {
margin:0 auto 30px;
}


#mainContents p.provid {
margin:0 0 20px 50px;
}


/* =================================
#gNav and #footerNav
================================= */
#footerNav_pc li a span {
line-height: 2;
}
#gNav_pc li a span {
font-size:75%;/*12px/16px*/
}
#footerNav_pc li a span {
line-height:3;
}