@charset "utf-8";
/* CSS Document style02.css*/

*, *::before, *::after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
    /*padding:0    */
}


html {
    font-size: 10px; /* ->  */

}

:root {
    --font-size-co2weight: 3.2rem;
    --font-size-co2weight-large: calc(var(--font-size-co2weight) + 0.2rem);
    
    --font-size-cedar-text: var(--font-size-co2weight);
    
/*        --font-size-cedar-text: calc(var(--font-size-co2weight) + 0.2rem);*/
/*    calc(var( --font-size-co2weight) + 0.2rem)*/
    /*3.8rem*/
}

body {
background-color: #F2FFF8;
max-width: 1040px;
text-align:center;

font-size: 1.8rem; /* -> 18px; */
font-family: 'Noto Sans JP', sans-serif;	


line-height: 2.0;/* 1.9 or 1.5; */
/*letter-spacing: 0.2em;*/
	
color: #5B5A5A;

-webkit-text-size-adjust: none;
text-size-adjust: none;

}

.p-fontsize-def{
font-size: 1.8rem; /* -> 18px; */
font-family: 'Noto Sans JP', sans-serif;}



.noe-base-font{
font-size: 1.8rem; /* -> 18px; */

line-height: 1.8;/* or 1.5; */
	/*letter-spacing: 0.2em;*/
font-family: 'Noto Sans JP', sans-serif;
}


/*デバック用*/
.e-hidden_box{
	display: none;
}

/*fontsize*/
.p-fontsize28{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 2.8rem; /* -> 24px; */
}


.p-fontsize24{
		font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 2.4rem; /* -> 24px; */
}


.p-fontsize22{
		font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 2.2rem; /* -> 22px; */
}

.p-fontsize20{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 2.1rem; /* -> 20px; */

}

.p-fontsize19{
  
	font-size: 1.9rem;


}

.p-fontsize18{
  font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.8rem;

}

.p-quiz-q-font18{
  
	font-size: 1.8rem;
	font-weight: bold;
}

.p-fontsize17{
 
	font-size: 1.7rem; /* -> 12px; */
}


.p-fontsize16{
 
	font-size: 1.6rem; /* -> 12px; */

}

.p-fontsize15{

  font-size: 1.5rem; /* -> 15px; */

}


.p-fontsize14{

  font-size: 1.4rem; /* -> 12px; */

}

.p-fontsize12{

	font-size: 1.2rem; /* -> 12px; */

}

.p-fontlarge1-38{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 3.8rem; /* -> 32px; */
}


.p-fontlarge1-34{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 3.4rem; /* -> 32px; */
}

.p-fontlarge1-27{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 2.7rem; /* -> 28px; */
}

.p-fontlarge1-26{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 2.6rem; /* -> 24px; */
}

.p-fontlarge1{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 2.4rem; /* -> 24px; */
}

.p-fontlarge2{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 2.1rem; /* ->2.0rem; 24px; */

}



.p-fontlarge3{
	font-size: 1.8rem;


}

.p-fontlarge4{
	font-size: 1.8rem;

	/*w376 1.8rem*/

}



.p-fontlarge4-17{
	font-size: 1.7rem;

	/*w376 1.7rem*/

}

.p-fontlarge4-16{
	font-size: 1.6rem;

	/*w376 1.6rem*/

}

.e-lineheigth1{
	line-height: 1;
	/*background-color: aqua;*/
	
}



.e-art01-pra-textcolor{
	color: #00aaee;/*00aaee 3d70ff*/

}

.e-art01-conversion-textcolor{
	color: #0040ee;

}

.e-art01-cedarnum-textcolor{
	color: #03AD96;
    /*#078A00*/

}

/***********************************/
/**杉の木換算数値の文字****************/
.e-cedar-text{
    font-family: 'M PLUS Rounded 1c', sans-serif;
        font-size: clamp(var(--font-size-cedar-text), 8.53vw, 50px);
/*    font-size: clamp(var(--font-size-co2weight), 8.53vw, 50px);*/
/*        font-size: clamp(var(--font-size-cedar-text), 9.06vw, 55px);*/
    
    letter-spacing: 0.15em;
    line-height: 1.8;
    color: #03AD96; 
    /*fff #03AD96 #0E8C32 FFFDF3 E90000 9CE8BC 0DD3B9 9CE8DB*/
          text-shadow: 3px 1px #FFFDF3, 4px 2px #58E8AC, 6px 3px #58E8AC;
}

.e-cedar-text .small{
     font-size: 0.55em;
}

/*.e-cedar-text .l-textshadow{
   text-shadow: none; 
}*/


/***********************************/

.p-bold{
	font-weight: bold;
}

.p-bold-fontlarge{
	font-weight: bold;
	font-size: 2.4rem; /* -> 24px; */
}



/* データルビ*/
ruby[data-ruby] { position:relative;white-space: nowrap; }

ruby[data-ruby]::before {
	content: attr(data-ruby);
	position:absolute; left:-1.5em; right:-1.5em; text-align:center;
	transform: scale(0.5);
	top:-1.16em;
	white-space: nowrap;/*ルビを段落ちさせない*/
}

ruby.l-textshadow::before {
text-shadow: none; 
}

ruby.co2-rubycolor::before {
color: #007AFF;
    /*0068D9*/
}
/* 以下追加 */
rt {
     display: none;
}

/*ここまでデータルビ */

.e-art01-carnum-textcolor{
	color: #ff8000;
}


.e-flex_box{
    display:flex;
}

.l-nav{
	background-color: #92E8BB;
	/*width:100%;*/
}


.p-nav-retop-container{
	display: flex;
	justify-content:flex-end;
	
	align-items: flex-end;
	flex-flow: row;
	/*background-color: #92E8BB;*/
	padding: 0%;

}

.e-ftop-item1{
	width:46%;
	max-width: calc(200px*2.2);
}


.e-ftop-item2{
	width:30%;
	padding: 2% 0% 0% 2%;
	max-width: calc(214px*2.2);
}


.p-nav-retop-container div img{
  width:100%;

}


.p-header-sdgstarget-imgbox{
background-color: #FFFFFF;
padding: 3% 2%;
}

.p-header-sdgstarget{
  width: 76%;
	margin-left: auto;
	max-width: 580px;
}



.p-header-sdgstarget img{
	width: 100%;
	height: auto;
	vertical-align: bottom;
}

.nop-header-sdgstarget{
	display: inline-block;
	margin: 0% 1%;
	width: 12%;
}



.nop-header-sdgstarget img{
	width: 100%;
	height: auto;
	vertical-align: bottom;
}


.e-title-container {
background-color:#FFFDF3;
	position: relative;
	width: 100%;
margin: 0 auto;
}


.l-title-text{
	width: 100%;
	/*height: 100%;	*/
}

.e-title-img{
	vertical-align: bottom;
	 width: 100%;
	 height: auto;
	max-width: 850px;
}



/* ブラウザーのWindowサイズのブレイクポイントでleftの％を変更する */
.l-title-qlogo{
	position: absolute;
	bottom:-12%;
	left:4.0%;
	width: 21%;
	/*height: 100%;	*/
}

.l-title-qlogo img{
	width: 100%;
    height: auto;
	vertical-align: bottom;
	max-width:186px;
}


.p-preamble-content-box{
/*padding: 3% 10% 0% 10%;*/
/*  position: relative;*/
}

.p-preamble-content{
	padding: 3% 10% 0% 10%;
}

.p-preamble-content p{
    text-align:left;
}

.p-preamble-content img{
    width: 100%;
	vertical-align: bottom;
}

.p-preamble-content2-box{
	position: relative;
	padding: 3% 10% 0% 10%;

}

.p-preamble-content2{
	position: absolute;
}

.p-preamble-content2 p{
    text-align:left;
   
}
	
.p-preamble-content2 img{
    width: 100%;
}



.p-preamble-blank{
    padding-top: 3%;
}

.p-preamble-blank{
    padding-top: 6%;
}


.e-blank1{
    padding-top: 1.5%;
}

.e-blank2{
    padding-top: 2%;
}

.e-blank3{
    padding-top: 3%;
}
.e-blank6{
    padding-top: 6%;
}

.e-blank8{
    padding-top: 8%;
}

.e-blank12{
    padding-top: 12%;
}

.l-section01-box{padding: 0%;}

.l-section02-box{padding: 0%;}

.l-section03-box{padding: 0%;}

.l-section04-box{padding: 0%;}

.l-article01-box{
	margin-top: 1%;
    padding: 0% 3% 0% 3%;

}

.l-article01-box p{
    padding: 0;
	margin: 0;


}

/* start read*/
.e-rebin3set-img-box{
	width: 100%;
	max-width: 640px;
	margin: 0 auto;

}


.e-rebin3set-img-box img{

	width: 100%;
    height:auto;
	vertical-align: bottom;
}


.l-article01{

    border-radius: 24px;
    background:#FFFDF3;
   
    text-align: center;
   
	padding: 0% 1% 20% 1%;
    
    background-image: url("../images_gomiredu/cedar-b01.svg");
    
    background-size:100% auto;
    background-repeat: no-repeat;
    background-position: center bottom;   
}

.e-pragomi-title{
	padding:8% 0% 3% 0%;

}
.e-pragomi-title p{
	margin: 0 auto;
	padding: 0;

}

.e-pragomi-title img{
width:100%
}


.e-pragomitocar-box {
	display: flex;
	justify-content: center;
	text-align: center;
	/*margin: auto 0;*/
	margin-top: 1.2%;
}

.e-pragomitocar-box img{
	width:22%;

}

.e-pragomitocar-box p{
	padding: 0;
	margin: 0;
}

/***********************************/
/**CO₂削減量の文字********************/
.e-co2weight-text{
    font-family: 'M PLUS Rounded 1c', sans-serif;
    /*font-size: var(--font-size-co2weight);*/
    font-size: clamp(var(--font-size-co2weight), 8.53vw, 50px);
    letter-spacing: 0.15em;
    line-height: 1.8;
    
    color: #A6E8F2;
    /*#00AAEE　#A6E8F2 #1CB9DE #6BD3ED #76D9ED #1CB9DE #56CCE8*/

    text-shadow:
      -1px -1px #FFFDF3,
      1px 1px #007AFF,
      1px -1px #007AFF,
      -1px 1px #007AFF,
      -2px -2px #007AFF,
      -2px 0px #007AFF,
      0px -2px #007AFF,	
      0 1px #006EE6,
      0 2px #0068D9,
      0 3px #0062CC,
      0 4px #0062CC,
      0 5px #005CBF;
}

.e-co2weight-text.large{

    font-size: clamp(var( --font-size-co2weight-large), 9.06vw, 55px);
      /*  font-size: calc(3.4rem + 0.4rem);*/  
/*    font-size: clamp(calc(var( --font-size-co2weight) + 0.2rem), 9.06vw, 55px);*/
    
    /*font-size: calc(var( --font-size-co2weight) + 0.2rem);*/
   /* font-size: 1.12em;*/
}
/* p.e-co2weight-text{
        margin-bottom: 0.2em;
}*/

:where( .e-co2weight-text.large, .e-co2weight-text) .small {
 font-size: 0.6em;
    
/*    font-size: clamp(calc(var( --font-size-co2weight) - 1.2rem), 5.0vw, 32px);*/ 
}

/**********************/

.p-praweight-img{
	margin: 0 auto;
	width: 46%;
	max-width: 280px;
	/*text-align: center;*/
	
}


.p-praweight-img img{
	width: 100%;
}


.p-yearweight-img{
	width: 63%;
	max-width: 320px;
	/*text-align: center;*/
	margin: 0 auto;
}

.p-yearweight-img img{
	width: 100%;
}


.l-fukidasi01-box{
    position: relative;

    margin:6% 2.4% 0% 2.4%;
    /*padding: 2% 0% 0%;*/
    background-color: #FFFDF3;
    border-radius: 50px;
    border:solid 6px #5C87FF;

}


.l-fukidasi01-imgbox{
	position:absolute;
    left:50%;
    z-index:1;
}



.l-fukidasi01-box p{
 /*   padding: 1.5% 2% 1% 2%;*/
	padding: 1.5% 1.5% 1.5% 1.5%;
	text-align: left;

}


.l-section-content {

	display:flex;
	
   justify-content: center;


}




.l-section-item1{
    width:28%;
	max-width: 200px;

	padding: 0% 0% 0% 3%;
}

.l-section-item1 img{
    width:100%;

}


.l-section-item2{
	text-align: left;
	padding-left: 1%;

}



.l-inline-block{
    /*display:inline-block;*/

}



.l-qizu {
    position: relative;

	margin:3% 1.5% 2% 1.5%;

}

.l-qizu img{
width:100%;

}

.l-qizu-wrap{
    /*position: absolute;*/

}


.l-qizu-title{
    position: absolute;
    top: 2.5%;
    left:50%;
    transform:translateX(-50%);

    width:95%;
	padding:0%;


}

.l-qizu-title p{
    position: absolute;
	top:50%;
	left:12%;
	transform: translateY(-50%);
	margin: 0;
	padding: 0;
}


.l-qizu-title img{
    width: 100;
}



.l-qizu-title-grad{
	margin: 0% 0%;
	padding:2% 0%;
background-image: linear-gradient(to right, #ffff8c, #fffea6, #fffdc0, #fffdda, #fffdf3);
}


.p-qmilk-title{
	color:#ff00ff;

}




.p-qizetitle-absolute-top-left{
    position: absolute;
    top:0%;
    left:-5%;

transform:rotate(-40deg);
width:13%;
}

.p-qizetitle-absolute-top-left img{
	/*height:auto;*/
	width:100%;
}


.p-qizetitle-absolute-bottom-rigth{
    position: absolute;
   /* bottom:0%;*/
	top:0%;
    right:-5%;
    /*height: 100%;*/
    /*width:13%;*/
    transform:rotate(40deg);
	width:13%;
}

.p-qizetitle-absolute-bottom-rigth img{
  width:100%;
}


.l-qizu-question{
    position: absolute;
	top:10%;
    /*top:16.5%;*/
    left:0%;
    padding:3% 6% 1% 6%;
	/*background-color: #B3EDD2;*/
}

.l-qizu-question p {
    text-align: left;
}

.p-qmilkchar-container{
	width: 20%;
	margin-left: 0;
}

.p-qmilkchar-container img{
	width: 100%;
}


.l-qize-btn-container{
position: absolute;
	
top:46%;
left:50%;
	
transform:translateX(-50%);

width:90%;

display: flex;

justify-content:space-around;
  
}

.l-qize-btn-container .e-f-item{
	
position:relative;

width: 44%;
}


.e-q-hantei-img-css{
	display: none;

	position: absolute;
	top:50%;
	left:0%;
	transform: translateY(-50%);
	z-index: 1;
	width: 100%;
	border-radius: 50%;
	border: solid 6px #E60012;
	
}
	
.e-q-hantei-img{

	display: none;

	position: absolute;
	top:50%;
	left:0%;
	transform: translateY(-50%);
	z-index: 1;

}



.q-fadeUp{
	display: block;
	
	/* fadeUp */
animation-name: fadeUpAnime;
animation-duration:1s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes nonefadeUpAnime{
  0% {
    opacity: 0;
	/*transform: translateX(0%);*/
	transform: translateY(0%);
  }

  36% {
    opacity: 1;
	transform: translateX(0%);
	transform: translateY(-50%);
  }
	38% {
	opacity: 1;
	ransform: translateX(10%);
	transform: translateY(-50%);
  }
	40% {
	opacity: 1;
	ransform: translateX(-10%);
	transform: translateY(-50%);
  }
	42% {
    opacity: 1;
	ransform: translateX(0%);
	transform: translateY(-50%);
  }
	
	100% {
	opacity: 1;
	ransform: translateX(0%);
	transform: translateY(-50%);
	   /*transform: translateY(-50%);*/
  }
	
}


@keyframes fadeUpAnime{
  0% {
    opacity: 0;
	/*transform: translateX(0%);*/
	transform: translateY(0%);
  }

  36% {
    opacity: 1;
	/*transform: translateX(0%);*/
	transform: translateY(-80%);
  }
	45% {
	opacity: 1;
	/*transform: translateX(-50%);*/
	transform: translateY(-40%);
  }
	50% {
	opacity: 1;
	/*transform: translateX(0%);*/
	transform: translateY(-60%);
  }
	51% {
    opacity: 1;
	/*transform: translateX(0%);*/
	transform: translateY(-50%);
  }
	
	100% {
	opacity: 1;
	/*transform: translateX(0%);*/
	transform: translateY(-50%);
	   /*transform: translateY(-50%);*/
  }
	
}

.e-quiz-btn {

display: inline-block;

width: 100%;
padding: 18% 5%;
margin: 0 auto;
  text-decoration: none;
  background: #FFFF8C;/*ボタン色*/

    border:solid 0.1em #FFD914 ;

  box-shadow:0.3em 0.3em #99581D;
  border-radius: 26px;
  cursor: pointer;
}

.e-quiz-btn:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(3px);
  transform: translateY(3px);/*下に動く*/
  border-bottom: none;/*線を消す*/
}


.btn-square:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(3px);
  transform: translateY(3px);/*下に動く*/
  border-bottom: none;/*線を消す*/
}


.l-qizu-answer{
    position: absolute;
    top:17%;
    left:50%;
    transform:translateX(-50%);
   width:90%;

}




.e-q-a-radiusbox{

margin:0 auto;
width:100%;
padding: 0% 0% 0% 0%;
background-color: #FFFF8C;
border-radius: 50px;

}

.e-q-a-radiusbox p{
margin: 0% 0%;
padding: 1.8% 0% 0% 0%;

}

.parent-e-qize-comment-adjustbox{
	position: relative;
	width:100%;
	height: auto;


}

.p-adjustbox::before{
	content:"";
	display: block;
	padding-top: 72%;

}


.e-qize-comment-box{

position: absolute;
	top:0;
	left:50%;
	transform: translateX(-50%);
	width: 94%;
	height:100%;

margin:0 auto;
padding: 2% 2% 3% 2%;
background-color: #FFFDF3;
border:solid 2px #FFD914 ;
border-top: none;

border-bottom-left-radius: 20px;
border-bottom-right-radius:20px;


}


.e-qize-comment-box p{
	margin: 1% 1%;
	text-align: left;
}



/* start reuse BIn*/
.e-reusebin-frtimg{
	width: 18%;
	max-width: 100px;
	margin: 0 auto;
}


.e-reusebin-frtimg img{

	width: 100%;
    height:auto;
	vertical-align: bottom;
}

.e-reuse-read-container{
margin:0% 3% 5% 3%;
    padding: 1% 3% 3% 3%;
    border-radius: 24px;
    background:#FFFDF3;
   
}

.e-reuse-read-container p{
	text-align: left;
}

.l-reusebin-recycle{
	margin:4% 0%;
	background-color: #70A0FF;
	/*2B72FF*/
	background-image: url("../images_gomiredu/binreBgPn02_125.svg");
	 /*binreBgPn reusebinbackptn02*/
	background-repeat: repeat;

}


.l-reusebin-title-container{
	margin:5% auto;
	width:90%;
    padding: 4% 0% 2%;
    background-color: #1958FF;
	/*0040EE*/
    border-radius: 30px;

	color: #FFFF3B ;
align-items: center;

}

.e-f-reusebin-item1{
width:11%;

	padding: 0% 1% 0% 0%;
}



.e-f-reusebin-item1 img{
	width:100%;

}

.e-f-reusebin-item2{
	/*background-color: blueviolet;*/

}

.e-f-reusebin-item2 p{
	margin: 0%;
	padding: 0%;

}



.l-binmilkwash-textbox{
	width:80%;
	
	margin: 0 auto;	color:#0044FF;
}



.l-binmilkwash-text{
	padding: 0;
	text-align: left;

}





.e-reusebin-zu-box{
	padding: 2% 2% 0% 2%;
	align-items: left;
	/*background-color: aqua;*/
}

.e-reusebin-zu-box img{
	width:100%;
}

.l-reusebin-recycle-milk{
	margin:0% 3% 0% 3%;

	/*background-color: aqua;*/

}



.e-reuse-recyclebin-milktext{
	margin: 0% auto;
	/*padding: 3% 2% 3% 2%;*/
    border-radius: 30px;
    background:#FFFDF3;
	color:#0040EE;

	padding: 5.5% 4% 3%;
	text-align: left;

}


.l-reusebin-recycle-milkimgbox{
/*	margin-top: 0%;
	margin-bottom: 0;*/
	margin-left: auto;
	padding-right: 2%;
	width:15%;
	text-align: right;

	/*background-color: aqua;*/
}


.l-reusebin-recycle-milkimgbox img{
	width:100%;
	vertical-align: bottom;
}


.l-fukidasi02-box{
margin:6% 2.4% 0%;
	
position:relative;
background-color: #FFFDF3;
border-radius: 60px;
border:solid 6px #54E685;
padding: 1.5% 3% 0%;
	/*padding: 3%;*/
}

.l-fukidasi02-box span{
text-align: left;
margin: 0%;
padding: 0%;
}


.l-fukidasi02-box p{
text-align: left;
margin: 0%;
padding: 0% 1.5% 1.5% 2%;
}




.l-fukidasi02-imgbox{
	position:absolute;
	left:70%;
    z-index:1;
}



.l-wrap-recycle{
	background-image: url("../images_gomiredu/harainter-b08r.svg");
	
	background-size: contain;

}


.l-recycle-discription-container{
	/*margin: 5% 0% 0% 0%;*/
/*display:flex;
flex-flow: row wrap;*/
}



.e-recycle-f-item-e{
	/*text-align: center;*/
	/*background-color: #ECDEBD;	*/
}


.p-haimg-scale{
	margin: 0 auto;
	/*width:40%;*/
	width:42%;
	max-width: 400px;
	/*background-color: #C1E2ED;*/
}

.p-haimg-scale img{
	width:100%;
	height: auto;
}

.e-recycle-f-item-t{

	margin-left: 10%;
	text-align: left;

}



.e-recycle-f-item-t  > div{
/*text-align: left;*/
	margin-left: 0%;
}

.e-recycle-e-discription-container{
	display:flex;
	flex-direction: row;

	/*padding: 0% 15% 0 15%;*/
	/*align-items: */
	margin:0 auto;
	width:94%;
color:#6C3200;/*99581D*/
	/*background-color: #F7DFDF;*/
}

.e-recycle-bag-discription-container {
	margin:0 auto;
	width:80%;
	color:#6C3200;/*99581D*/
	/*padding-left: 20%;*/
	/*background-color:#EDB3B4;*/
}

.e-recycle-bag-discription-container p{
text-align: left;
}

.e-recycle-e-discription-container p{
	text-align: left;
	/*flex-basis: 60%;*/
	padding-right: 1%;
	width:70%;
}



.e-recycle-e-discription-imgbox img{
	width:100%;
}


.e-recycle-after-container{
	/*margin:0 auto;*/
/*	text-align:center;*/
	margin:0 auto;
	width:80%;
/*
	background-color: #FF00FD;
*/
	
}


.p-recycle-after-title{

	margin:0 auto;
	width:100%;
/*width:50%;*/
    padding:4.6% 0% 0.4% ;
    background-color: #e37336; /*99581D 4F2D0F a8e332  7C400D*/
    border-radius: 50px;
/*   border:solid 6px #5C87FF;*/
	text-align: center;
	color:#FFFFFF;
	font-weight: bold;
	/*width: 100%;*/
}


.p-recycle-after-answer{
	background-color: #FFFDF3;
	border: #99581D solid 2px;
	border-top: none;
margin:0 auto;
	padding: 5% 8% 8% 8%;
	width:90%;
	text-align: left;
	color:#6C3200;/*99581D*/
	/*background-color: aqua;*/
}

.p-recycle-after-answer p{
	;
	margin: 0;
/*	padding: 0;*/
	
}


.l-row{
width:100%;
}

.l-row p{
  display: inline-block;
  vertical-align: bottom;
	margin-bottom:0.9%;
}

.p-img-scale{
	width:28%;
}
.l-row p img{
    width:100%;
    height:auto;
	vertical-align: bottom;
}


#endsection{
	background-color: #92E8BB;
	margin-top:20%;
	/*margin: 10% 0%;*/
}


.e-gogchp{
	
/*text-align: center;	*/
    margin: 0 auto;
    /*margin: 0% 5% 0% 5%;*/
	padding-right: 7%;
	width: 86%;
	max-width: 700px;
}


.e-gogchp:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(3px);
  transform: translateY(3px);/*下に動く*/
}


.e-gogchp img{
	/*display: inline-block;*/
	width: 100%;
    height:auto;
	vertical-align: bottom;
}


.e-goprevpage{
	text-align: left;
	/*padding: 10% 5% 0% 0%;*/
	margin-left: 2%;
	padding: 6% 0% 4% 0%;
	width: 34%;
	max-width: 200px;

	/*background-color: aqua;*/
}

.e-goprevpage:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(3px);
  transform: translateY(3px);/*下に動く*/
}

.e-goprevpage img{
    width: 100%;
	height:auto;
	vertical-align: bottom;
}

.e-gogchp-milk-box{
	background-color: #a6e8f2;
	padding: 5% 0% 6%;
}


.e-gogchp-milk{
/*	margin-left: 60%;width: 35%;*/
	margin: 0 auto;
  /*margin: 0% 5% 0% 5%;10% 400px*/
	padding-left: 8%;
	
	/*background-color: antiquewhite;*/
	width: 52%;/*58% 68% 340px*//*640 chang*/
	max-width: 268px;
}

.e-gogchp-milk:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(3px);
  transform: translateY(3px);/*下に動く*/
}

.e-gogchp-milk img{
	/*display: inline-block;*/
	width: 100%;
    height:auto;
	vertical-align: bottom;
}

.dummy-dennki{
	margin: 0 auto;
	width: 90%;
}

.dummy-dennki img{
	/*display: inline-block;*/
	width: 100%;
    height:auto;
	vertical-align: bottom;
}


#p-page-top{
position: fixed;
	/*position: absolute;*/
	right:10px;
	/*left:0px;*/
	bottom:22px;
	z-index: 10;
	width: 11.0%;
	max-width: 60px;
	max-height: 60px;
}

#p-page-top:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(3px);
  transform: translateY(3px);/*下に動く*/
}

#p-page-top img{
	width: 100%;

}


/**/
.l-wrapper{
    background-color:#D1FBE5;
    /*width: auto;*/

  /*  max-width:1040px;*/
      margin:0 auto;
/*	 margin:auto;*/
}



/*以下　ルビと漢字の行わかれを止める*/
/*最新のsafari向けのcssハック*/

_::-webkit-full-page-media, _:future, :root .e-noneindention0,.e-noneindention,.e-noneindention_1,.e-noneindention_2,.e-noneindention_3,.e-noneindention_4,.noneindention_5,.noneindention_6,.noneindention_7 {
    display: inline-block;
}


_::-webkit-full-page-media, _:future, :root .p-preamble-content span,.e-recycle-e-discription-container span,.e-recycle-bag-discription-container span,.e-qize-comment-box span,.l-qizu-question span,.l-binmilkwash-textbox span{
	display: inline-block;
}


@media screen and (-webkit-min-device-pixel-ratio:0) {
  ::i-block-chrome,.e-noneindention0,.e-noneindention,.e-noneindention_1,.e-noneindention_2,.e-noneindention_3,.e-noneindention_4,.noneindention_5,.noneindention_6,.noneindention_7, .p-preamble-content span,.e-recycle-e-discription-container span,.e-recycle-bag-discription-container sapn,.e-qize-comment-box span,.l-qizu-question span,.l-binmilkwash-textbox span  {
   display: inline-block;
  }
}


@media (max-width:360px) {
    /*　for SP 　layout  bpoint w350px　*/
	html {font-size: 8.888888888888889px;} /* -> for body 1.8rem 16px; */
  .e-quiz-btn {
    padding: 15.5% 5% 13%;
    box-shadow:0.2em 0.2em #99581D;
    border-radius: 20px;
    }
  }

@media (min-width:640px) {
	
	body {

margin: 0 auto;
font-size: calc(1.6rem*1.5); /* -> px; */
font-family: 'M PLUS Rounded 1c', sans-serif;
	/*transform:rotateZ(0.03deg);*/
	}

.p-fontsize-def{
font-size: calc(1.6rem*1.5); /* -> px; */
font-family: 'M PLUS Rounded 1c', sans-serif;
	}
	

.l-fukidasi02-box{
  margin:6% 6% 0%;

}
	
.p-preamble-content{
    padding: 3% 12% 0% 12%;

}

.p-preamble-content2{
    padding: 3% 12% 0% 12%;

}

.p-preamble-content2 p{
    text-align:left;
   
}
	
.p-preamble-content2 img{
    width: 100%;
}

	
.l-article01-box{
    padding: 0% 6%;
}

.l-section01-box{
	padding: 0% 4%;

}

.l-section01quiz-box{
		padding: 0% 3.2%;
	}

.l-section02-box{
	padding: 0% 3%;

}


.l-section04-box{
	padding: 0% 8%;

}

.e-recycle-bag-discription-container {
	width:84%;
	
}

	/*init 4.6%*/
.l-title-qlogo{
	left:5.0%;
}

	
.p-fontsize24{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(2.4rem*1.5);

		/*font-size: 4.8rem;*/
}

.p-fontsize28{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(2.8rem*1.2); /* -> 24px; */
	letter-spacing: 0.2em;
	}
	

.p-fontsize22{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(2.2rem*1.5);
	/*font-size: 4.4rem;*/
}

.p-fontsize20{
	font-size: 2.4rem;
}

.p-fontsize19{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(1.9rem*1.5);

}

.p-fontsize18{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(1.8rem*1.2);
	/*font-size: 3.2rem;*/
}

.p-quiz-q-font18{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(1.8rem*1.2);
	/*font-weight: bold;*/
}

	
.p-fontsize17{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	/*font-size:  calc(1.7rem*1.5);*/
	font-size:  2.1rem;
}

.p-fontsize16{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(1.6rem*1.5);
	/*font-size: 3.2rem;*/
}


.p-fontsize15{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(1.5rem*1.5);
	/*font-size: 2.8rem;*/

}

.p-fontsize14{
	font-size: calc(1.4rem*1.5);
	/*font-size: 2.8rem;*/
}

.p-fontsize12{
	font-size: calc(1.2rem*1.5);
	/*font-size: 2.4rem;*/
}

.p-fontlarge1-38{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(3.8rem*1.5); /* -> 32px; */
}
    
.p-fontlarge1-34{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(3.4rem*1.5); /* -> 32px; */
}

    
.p-fontlarge1-27{
	font-size: calc(2.7rem*1.5);
}

.p-fontlarge1-26{
	font-size: calc(2.6rem*1.5);
}

.p-fontlarge1{
	font-size: calc(2.4rem*1.2);
	/*font-size: 4.8rem;*/
	}

.p-fontlarge2{
	font-size: calc(2.0rem*1.2);

}

.p-fontlarge3{
	font-size: calc(2.4rem*1.5);

	/*w376 1.8rem*/
	}

.p-fontlarge4{
	font-size: calc(2.2rem*2);

	/*w376 2.2rem*/
	}

.p-fontlarge4-16{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(1.6rem*1.5);

	/*w376 1.6rem*/

}
	
.p-fontlarge4-17{
	/*quiz A commnt*/
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(1.7rem*1.5);
	/*w376 1.7rem*/

}
	
		/*768 chang→640*//*58% 340px*/
  .e-gogchp-milk{
    width: 37%;
	max-width: 328px;
  }
}



@media (min-width:768px) {
    /*　for PC and for iPad 画面幅が768px以上の場合のスタイルを記述*/
body {

margin: 0 auto;

font-family: 'M PLUS Rounded 1c', sans-serif;
font-size: calc(1.6rem*1.5); /* -> px; */
	}
	

.p-fontsize-def{
font-family: 'M PLUS Rounded 1c', sans-serif;
font-size: calc(1.6rem*1.5);
	}
	
	
.p-preamble-content2{
    padding: 3% 12% 0% 12%;
}

.p-preamble-content2 p{
    text-align:left;
   
}
	
.p-preamble-content2 img{
    width: 100%;
}

	
.p-fontsize28{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(2.8rem*1.5); /* -> 24px; */
	letter-spacing: 0.3em;
	}
	
	
.p-fontsize20{
	font-size: 2.6rem;
}
	

.p-quiz-q-font18{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(1.8rem*1.4);
	/*font-weight: bold;*/
}
	
.p-fontlarge4-17{
	/*quiz A commnt*/
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: calc(1.7rem*1.5);

}
	
.l-fukidasi02-box{
  margin:6% 8% 0%;

}
	
.l-article01-box{
    padding: 0% 9%;
}

.l-section01-box{
	padding: 0% 6%;

}

.l-section01quiz-box{
		padding: 0% 5%;
	}

.l-section02-box{
	padding: 0% 4%;

}


.l-section04-box{
	padding: 0% 10%;

}
}


  /*　for PC and for iPad 画面幅が1041px以上の場合のスタイルを記述*/
@media (min-width:1024px) {
.l-title-qlogo{
	left:7.0%;
}
.p-preamble-content{
  
  padding: 3% 10% 0% 10%;
}
	
.p-preamble-content2{
  
  padding: 3% 10% 0% 10%;
}

.e-qize-comment-box{
	width: 90%;

  padding: 2% 2% 3% 2%;
}
	

.e-qize-comment-box p{
	padding: 1% 1.4%;
}
	.l-fukidasi02-box{
  margin:6% 6% 0%;

}
	
}

/**********************************************/
@media(min-width: 470px){
	.br-470{
	display: none;
}
}