body {
	font-family: heisei-maru-gothic-std, sans-serif;
	font-weight: 400;
	color: #565656;
	position: relative;
	-webkit-text-size-adjust: 100%; /* iphone横向き 文字拡大防止 */
	height: 100%;
}
img {
	display: block;
	width: 100%;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
a {
	text-decoration: none;
	color: #000;
}
p {
	line-height: 1.8;
}
ruby rt {
	font-size: 10px;
}

/* デフォルトの装飾を削除 */
input, textarea, select {
	-webkit-appearance: none;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active  {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}
:focus {
    outline: -webkit-focus-ring-color none;
}
input, select {
	width: 100%;
	padding: 15px 20px;
	border: 2px #e0e0e0 solid;
	border-radius: 10px;
	background: #fff;
	font-size: 16px;
}
select {
	background: #fff url("../img/icon_select2.png") center right 10px / 8px no-repeat;
	cursor: pointer;
}
select::-ms-expand {
    display: none;
}


/*==================================================================================
ヘッダー
==================================================================================*/
header {
	width: 100%;
	padding: 0!important;
	background: url("../img/index_bg2.gif") left top / 40px repeat;
}
header .logo img {
	max-width: 980px;
	margin: auto;
}
header .btn {
	margin: 0 10px 20px;
}

/* 下層ページ ---------------------*/
header.second {
	padding: 0 0 50px!important;
	background: url("../img/main_bg.gif") center center / cover no-repeat;
}
header.second .logo img {
	width: 340px;
}
header.second .hakase_voice {
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
	width: calc(100% - 340px - 120px);
	padding-top: 10px;
	padding-right: 120px;
	position: relative;
}
header.second .hakase_voice .hakase_ilst {
	display: block;
	width: 100px;
	height: 100px;
	background: url("../img/hakase02.png") right top / 100px no-repeat;
	position: absolute;
	top: 0;
	right: 0;
}
header.second .hakase_voice p {
	padding: 10px 20px 5px;
	border: 3px #FF893D solid;
	border-radius: 40px;
	background: #fff;
	line-height: 1.6;
	position: relative;
}
header.second .hakase_voice p::after {
	content: "";
	display: block;
	width: 30px;
	height: 14px;
	background: url("../img/fukidasi.png") left top / contain no-repeat;
	position: absolute;
	top: 50%;
	right: -29px;
	transform: translateY(-50%);
	z-index: 10;
}
/* みんなのエコアップ ---------------------*/
header.ecoup {
	padding: 0 0 100px!important;
}
/* みんなのエコアップ ---------------------*/
header.other {
	background: none;
}



/*==================================================================================
共通
==================================================================================*/
/* レイアウト */
section {
	padding: 120px 0!important;
}

.container {
	width: calc(100% - 40px);
	max-width: 1200px;
	padding: 0 20px;
	margin: auto;
}
.max680 {
	max-width: 680px;
	margin: auto;
}
.max980 {
	max-width: 980px;
	margin: auto;
}
.row {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.row.just_center {
	justify-content: center;
}
.row.just_start {
	justify-content: flex-start;
}
.row.just_end {
	justify-content: flex-end;
}
.row.align_center {
	align-items: center;
}
.row.align_start {
	align-items: flex-start;
}
.row.align_end {
	align-items: flex-end;
}
.col2 {
	width: calc(50% - 10px);
}
.col3 {
	width: calc(100% / 3 - 20px);
}

.mb_10 {
	margin-bottom: 10px;
}
.mb_20 {
	margin-bottom: 20px;
}
.mb_30 {
	margin-bottom: 30px;
}
.mb_60 {
	margin-bottom: 60px;
}
.mb_120 {
	margin-bottom: 120px;
}

/* フォント */
.font_12 {
	font-size: 12px;
}
.font_14 {
	font-size: 14px;
}
.font_18 {
	font-size: 18px;
}
.font_24 {
	font-size: 24px;
}
.font_28 {
	font-size: 28px;
}
.txt_center {
	text-align: center;
}
.bold {
	font-weight: 800;
}
.blue {
	color: #096190;
}
.orange {
	color: #FF893D;
}
.green {
	color: #00A271;
}
.red {
	color: #AA395C;
}
.number {
	font-family: acumin-pro, sans-serif;
	font-weight: 700;
}
.gothic {
	font-family: heisei-kaku-gothic-std, sans-serif;
	font-weight: 700;
}
sup {
	font-size: 60%;
	vertical-align: super!important;
}
.indent {
	padding-left: 1em;
	text-indent: -1em;
}
.underline {
	text-decoration: underline;
}

/* ホワイトボード */
.boad {
	padding: 60px;
	border-radius: 20px;
	background: #fff;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.30);
	position: relative;
}
.boad.pd30 {
	padding: 30px;
}

/* ボタン */
.btn {
	display: block;
	width: calc(380px - 46px);
	margin: auto;
	padding: 20px;
	border-radius: 40px;
	color: #fff;
	font-size: 24px;
	font-family: heisei-kaku-gothic-std, sans-serif;
	font-weight: 900;
	text-align: center;
}
.btn.blue {
	border: 3px #1879D1 solid;
	background: #1AA0E2;
	box-shadow: 0 5px 0 #1879D1;
}
.btn.red {
	border: 3px #AA395C solid;
	background: #E5627C;
	box-shadow: 0 5px 0 #AA395C;
}
.btn.short {
	width: calc(240px - 46px);
	font-size: 20px;
}
.btn.thin {
	width: calc(380px - 36px);
	padding: 15px;
	font-size: 20px;
}
.btn.short.thin {
	width: calc(240px - 36px);
	padding: 15px;
	font-size: 20px;
}
.btn.circle {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-content: center;
	width: calc(80px - 6px);
	height: calc(80px - 6px);
	margin: 0;
	padding: 0;
	border-radius: 50%;
	font-size: 14px;
}
.btn.circle img {
	width: 30px;
	margin-bottom: 10px;
}
.btn.circle span {
	display: block;
	width: 100%;
}
.btn.return {
	border: 3px #777777 solid;
	background: #AAAAAA;
	box-shadow: 0 5px 0 #777777;
	position: relative;
}
.btn.prev {
	margin: 0 0 0 10px;
	border: 3px #1879D1 solid;
	background: #1AA0E2;
	box-shadow: 0 5px 0 #1879D1;
	position: relative;
}
.btn.re_blue {
	border: 3px #389bdf solid;
	background: #fff;
	color: #389bdf;
	box-shadow: 0 5px 0 #389bdf;
	position: relative;
}
.btn:hover {
	box-shadow: none;
	position: relative;
	top: 5px;
}
.link {
	display: inline-block;
	text-decoration: underline;
	color: #0090D2;
}
.pdf {
	padding-left: 25px;
	position: relative;
}
.pdf::before {
	content: "";
	display: block;
	width: 20px;
	height: 20px;
	background: url("../img/icon_pdf.png") left center / contain no-repeat;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}

/* 背景ボーダーアニメーション */
@keyframes anm_border {
	0% {
		background-position: left top;
	}
	100% {
		background-position: right top;
	}
}

/* 下層ページ共通 ---------------------------------------------------------*/
section.bg_blue {
	min-height: calc(100vh - 138px - 160px);
	padding: 0 0 160px!important;
	background: #E6FEFF url("../img/bg_border2.png") left top / 166px repeat;
	position: relative;
	animation: anm_border 15s linear infinite;
}
/* 上部 説明文 */
section.bg_blue .memo {
	width: calc(100% - 46px);
	max-width: calc(1200px - 46px);
	padding: 10px 20px;
	border: 3px #00A271 dashed;
	border-radius: 10px;
	background: #fff;
	position: relative;
	top: -34px;
}
section.bg_blue .step_ttl img {
	width: 300px;
}
section.bg_blue .memo.result {
	padding: 5px 10px;
	border: 3px #FF893D solid;
	text-align: center;
}

/* 下部固定 ボタン */
.btm_fix {
	width: calc(100% - 20px);
	padding: 10px;
	background: rgba(255,255,255,0.50);
	position: fixed;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	z-index: 9999;
}
.btm_fix .row {
	width: 100%;
	max-width: 1280px;
	margin: auto;
}
.btm_fix .flow {
	display: flex;
	justify-content: space-between;
	flex-wrap: nowrap;
	align-items: center;
	width: calc(100% - 200px - 20px);
	padding: 10px;
	border: 2px #FFDC83 solid;
	border-radius: 10px;
	background: #FFF8E3;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.30);
}
.btm_fix .flow span {
	display: block;
	width: calc(100% - 24px);
	max-width: calc(180px - 24px);
	margin: 0 10px;
	padding: 10px;
	border: 2px #AFAFAF solid;
	border-radius: 5px;
	background: #fff;
	color: #AFAFAF;
	font-size: 12px;
	text-align: center;
	white-space: nowrap;
	position: relative;
}
.btm_fix .flow span.on {
	border: 2px #FC7B24 solid;
	color: #FC7B24;
}
.btm_fix .flow span.arrow {
	display: block;
	width: auto;
	max-width:0;
	margin: 0 10px 0 0;
	padding: 0;
	border: none;
	border-radius: 0;
	background: none;
	color: #AFAFAF;
	font-size: 10px;
}
.btm_fix .btn_group {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	width: 170px;
}

/* 区切り ドット */
section.bg_blue .dott {
	width: 100%;
	height: 6px;
	background: url("../img/dott.gif") left center / 16px repeat-x;
}


/*==================================================================================
INDEX
==================================================================================*/
.boad.frame_green {
	border: 4px #00a84d solid;
	position: relative;
}
section#about {
	background: url("../img/index_bg2.gif") left top 20px / 40px repeat;
}
h2 {
	padding: 20px 10px 10px!important;
	border-top: 2px #00a84d solid!important;
	border-bottom: 2px #00a84d solid!important;
	background: #feffef;
	color: #00a84d;
	font-size: 34px;
	font-family: heisei-kaku-gothic-std, sans-serif;
	font-weight: 900;
	text-align: center;
}
section#about .boad.frame_green {
	padding: 60px 30px 30px;
}
section#about h2 {
	width: 100%;
	padding: 0!important;
	border: none!important;
	background: none;
	text-align: center;
	position: absolute;
	top: -30px;
	left: 0;
}
section#about h2 span {
	display: inline-block;
	padding: 20px 10px 10px;
	border: 4px #00a84d solid!important;
	background: #fff;
}
section#about .img {
	width: 100px;
}
section#about .txt {
	width: calc(100% - 100px - 30px);
}
/* エコアップブックって？ ------------------*/
section#ecobook .ecoup_guide {
	border-color: #00a84d;
	border-width: 4px;
	background: #fff;
}
section#ecobook .ecoup_guide .ttl {
	display: inline-block;
	padding: 10px 20px;
	border-width: 4px;
	background: #00a84d;
	left: 50%;
	transform: translateX(-50%);
}
section#ecobook .ecoup_guide .number span {
	background: #00a84d;
}
section#ecobook .step span {
	display: inline-block;
	padding: 10px 20px;
	border: 6px #00a84d solid;
	border-radius: 50px;
	background: #fff;
	color: #00a84d;
	font-family: heisei-kaku-gothic-std, sans-serif;
	font-weight: 900;
	line-height: 1;
}
/* ２つの参加方法 ------------------*/
h3 {
	padding-bottom: 10px!important;
	border-bottom: 4px #00a84d dashed!important;
	font-family: heisei-kaku-gothic-std, sans-serif;
	font-weight: 900;
	line-height: 1;
}

/*==================================================================================
STEP01
==================================================================================*/
section#input_step01 ul.leaf_expo {
	display: flex;
	flex-wrap: nowrap;
}
section#input_step01 ul.leaf_expo li {
	margin-left: 20px;
	padding-left: 46px;
	position: relative;
}
section#input_step01 ul.leaf_expo li::before {
	content: "";
	display: block;
	width: 36px;
	height: 36px;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -20px;
}
section#input_step01 ul.leaf_expo li:nth-child(1)::before {
	background-image: url("../img/leaf_green.gif");
}
section#input_step01 ul.leaf_expo li:nth-child(2)::before {
	background-image: url("../img/leaf_brown.gif");
}
/* 日にち */
section#input_step01 .day {
	margin-top: -30px;
}
section#input_step01 .day p {
	margin-left: 22px;
}
section#input_step01 .day p:first-child {
	margin-left: 0;
}
/* ステップ① 項目 */
section#input_step01 .item {
	width: calc(380px - 40px);
	padding-left: 40px;
	line-height: 1;
	position: relative;
}
section#input_step01 .item span {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: calc(30px - 5px);
	padding-top: 5px;
	border-radius: 20px;
	background: #FFBD4D;
	color: #fff;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
/* 葉っぱチェック */
section#input_step01 .to_do {
	display: flex;
	justify-content: center;
	align-items: center;
}
section#input_step01 .to_do input {
	display: none;
}
section#input_step01 .to_do label {
	display: block;
	margin-left: 20px;
	cursor: pointer;
	position: relative;
}
section#input_step01 .to_do label:first-child {
	margin-left: 0;
}
section#input_step01 .to_do label .select_box {
	display: none;
	padding: 10px;
	border: 2px rgba(0,0,0,0.10) solid;
	border-radius: 10px;
	background: #fff;
	position: absolute;
	top: -70px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 10;
}
section#input_step01 .to_do label .select_box::before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	border-right: 2px rgba(0,0,0,0.10) solid;
	border-bottom:  2px rgba(0,0,0,0.10) solid;
	background: #fff;
	position: absolute;
	left: 50%;
	bottom: -16px;
	transform: rotate(45deg) translateX(-50%);
}
section#input_step01 .to_do label .select_box span.done,
section#input_step01 .to_do label .select_box span.couldnot {
	display: none;
	width: 30px;
	height: 30px;
	margin: 0 10px;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}
section#input_step01 .to_do label .select_box span.done {
	background-image: url("../img/leaf_green.gif");
}
section#input_step01 .to_do label .select_box span.couldnot {
	background-image: url("../img/leaf_brown.gif");
}
section#input_step01 .to_do label span.leaf {
	display: block;
	width: 40px;
	height: 40px;
	background: url("../img/leaf_gray.gif") center center / contain no-repeat;
}
section#input_step01 .to_do label input.trigger:checked ~ .select_box {
	display: flex;
	flex-wrap: nowrap;
}
section#input_step01 .to_do label input.trigger:checked ~ .select_box span.done,
section#input_step01 .to_do label input.trigger:checked ~ .select_box span.couldnot {
	display: block;
}
/* 1つ目のみボックス表示
section#input_step01 .to_do.first label:nth-child(1) .select_box {
	display: flex;
}
section#input_step01 .to_do.first label:nth-child(1) .select_box span.done,
section#input_step01 .to_do.first label:nth-child(1) .select_box span.couldnot {
	display: block;
}
*/

/*==================================================================================
STEP02
==================================================================================*/
section#input_step02 ul.check_expo {
	display: flex;
	flex-wrap: nowrap;
}
section#input_step02 ul.check_expo li {
	margin-left: 20px;
	padding-left: 50px;
	position: relative;
}
section#input_step02 ul.check_expo li::before {
	content: "";
	display: block;
	width: calc(36px - 4px);
	height: calc(36px - 4px);
	border: 2px #e0e0e0 solid;
	border-radius: 5px;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
section#input_step02 ul.check_expo li::after {
	content: "";
	display: block;
	width: 24px;
	height: 10px;
	border-left: 8px #e0e0e0 solid;
	border-bottom: 8px #e0e0e0 solid;
	transform: rotate(-45deg);
	position: absolute;
	top: -6px;
	left: 5px;
}
section#input_step02 ul.check_expo li:nth-child(1)::before {
	border: 2px #00A271 solid;
}
section#input_step02 ul.check_expo li:nth-child(1)::after {
	border-left: 8px #00A271 solid;
	border-bottom: 8px #00A271 solid;
}

section#input_step02 label,
section#challenge.step2 label {
	display: flex;
	justify-content: center;
	width: calc(100% / 3 - 40px - 10px);
	height: calc(160px - 60px);
	padding: 60px 20px 0;
	border-radius: 10px;
	background: #fff;
	position: relative;
	cursor: pointer;
}
section#input_step02 label input,
section#challenge.step2 label input {
	display: none;
}
section#input_step02 label .bg,
section#challenge.step2 label .bg {
	display: block;
	width: calc(100% - 4px);
	height: calc(100% - 4px);
	border: 2px #e0e0e0 solid;
	border-radius: 10px;
	position: absolute;
	top: 0;
	left: 0;
}
section#input_step02 label .checkbox,
section#challenge.step2 label .checkbox {
	display: block;
	width: calc(36px - 4px);
	height: calc(36px - 4px);
	border: 2px #e0e0e0 solid;
	border-radius: 5px;
	position: absolute;
	top: 10px;
	right: 10px;
}
section#input_step02 label .checkbox::before,
section#challenge.step2 label .checkbox::before {
	content: "";
	display: block;
	width: 24px;
	height: 10px;
	border-left: 8px #e0e0e0 solid;
	border-bottom: 8px #e0e0e0 solid;
	transform: rotate(-45deg);
	position: absolute;
	top: 0;
	left: 3px;
}
section#input_step02 label span,
section#challenge.step2 label span {
	display: block;
	width: 36px;
	height: 36px;
	padding-top: 10px;
	border-radius: 3px;
	background: #FFBD4D;
	color: #fff;
	text-align: center;
	position: absolute;
	top: -10px;
	left: 20px;
}
section#input_step02 label span::after,
section#challenge.step2 label span::after {
	content: "";
	display: block;
	width: 18px;
	height: 18px;
	background: #fff;
	position: absolute;
	left: 9px;
	bottom: -9px;
	transform: rotate(-45deg) skew(18deg, 15deg);
}
section#input_step02 label .ilst,
section#challenge.step2 label .ilst {
	display: flex;
	align-content: center;
	align-items: center;
	min-width: calc(260px - 105px);
	height: 75px;
	padding-left: 105px;
	position: relative;
}
section#input_step02 label .ilst::before,
section#challenge.step2 label .ilst::before {
	content: "";
	display: block;
	width: 90px;
	height: 90px;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
section#input_step02 label:nth-child(1) .ilst::before,
section#challenge.step2 label:nth-child(1) .ilst::before {
	background-image: url("../img/step02_01_2.jpg");
}
section#input_step02 label:nth-child(2) .ilst::before,
section#challenge.step2 label:nth-child(2) .ilst::before {
	background-image: url("../img/step02_02_2.jpg");
}
section#input_step02 label:nth-child(3) .ilst::before,
section#challenge.step2 label:nth-child(3) .ilst::before {
	background-image: url("../img/step02_03_2.jpg");
}
section#input_step02 label:nth-child(4) .ilst::before,
section#challenge.step2 label:nth-child(4) .ilst::before {
	background-image: url("../img/step02_04_2.jpg");
}
section#input_step02 label:nth-child(5) .ilst::before,
section#challenge.step2 label:nth-child(5) .ilst::before {
	background-image: url("../img/step02_05_2.jpg");
}
section#input_step02 label:nth-child(6) .ilst::before,
section#challenge.step2 label:nth-child(6) .ilst::before {
	background-image: url("../img/step02_06_2.jpg");
}
section#input_step02 label:nth-child(7) .ilst::before,
section#challenge.step2 label:nth-child(7) .ilst::before {
	background-image: url("../img/step02_07_2.jpg");
}
section#input_step02 label:nth-child(8) .ilst::before,
section#challenge.step2 label:nth-child(8) .ilst::before {
	background-image: url("../img/step02_08_2.jpg");
}
section#input_step02 label:nth-child(9) .ilst::before,
section#challenge.step2 label:nth-child(9) .ilst::before {
	background-image: url("../img/step02_09_2.jpg");
}
section#input_step02 label .ilst p,
section#challenge.step2 label .ilst p {
	line-height: 1.6;
}
section#input_step02 label input:checked ~ .bg,
section#input_step02 label input:checked ~ .checkbox,
section#challenge.step2 label input:checked ~ .bg,
section#challenge.step2 label input:checked ~ .checkbox {
	border: 2px #00A271 solid;
}
section#input_step02 label input:checked ~ .checkbox::before,
section#challenge.step2 label input:checked ~ .checkbox::before {
	border-left: 8px #00A271 solid;
	border-bottom: 8px #00A271 solid;
}
section#input_step02 label input:checked ~ .ilst p,
section#challenge.step2 label input:checked ~ .ilst p {
	color: #00A271;
}

/*==================================================================================
RESULT
==================================================================================*/
section#result .result_ttl {
	margin-bottom: -20px;
	position: relative;
	z-index: 10;
}
section#result .result_ttl img {
	width: 300px;
	margin: auto;
}
section#result .item {
	padding-left: 35px;
	line-height: 1;
	position: relative;
}
section#result .item span {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: calc(30px - 5px);
	padding-top: 5px;
	border-radius: 20px;
	background: #FFBD4D;
	color: #fff;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
section#result .leaf .done,
section#result .leaf .couldnot {
	display: block;
	width: 34px;
	height: 34px;
	margin-right: 10px;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}
section#result .leaf .done {
	background-image: url("../img/leaf_green.gif");
}
section#result .leaf .couldnot {
	background-image: url("../img/leaf_brown.gif");
}
section#result .score {
	display: block;
	padding: 5px 10px 10px;
	background: #fff;
	border: 2px #e0e0e0 solid;
	border-radius: 5px;
}
section#result .score p {
	line-height: 1;
}
section#result .score p span {
	display: inline-block;
	margin-right: 3px;
	font-size: 28px;
}
section#result .score.sum {
	border: 2px #00A271 solid;
	animation: score_zoom .3s ease;
}
section#result .score.sum p {
	font-size: 24px;
}
section#result .score.sum p span {
	font-size: 50px;
}
section#result .score.total {
	padding: 5px 15px 10px;
	border: 3px #00A271 solid;
	animation: score_zoom .3s ease;
	position: relative;
}
section#result .score.total p {
	font-size: 34px;
}
section#result .score.total p span {
	font-size: 70px;
}
section#result .score.total .asagao {
	display: block;
	width: 220px;
	height: 220px;
	background-position: center bottom;
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	top: -240px;
	left: 50%;
	transform: translateX(-50%);
}
section#result .score.total .asagao.ilst01 {
	background-image: url(../img/asagao01.png);
}
section#result .score.total .asagao.ilst02 {
	background-image: url(../img/asagao02.png);
}
section#result .score.total .asagao.ilst03 {
	background-image: url(../img/asagao03.png);
}

section#result .step2_result label {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	width: calc(100% - 44px);
	padding: 60px 20px 20px;
	border: 2px #e0e0e0 solid;
	border-radius: 10px;
	position: relative;
}
section#result .step2_result label span {
	display: block;
	width: 36px;
	height: 36px;
	padding-top: 10px;
	border-radius: 3px;
	background: #FFBD4D;
	color: #fff;
	text-align: center;
	position: absolute;
	top: -10px;
	left: 20px;
}
section#result .step2_result label span::after {
	content: "";
	display: block;
	width: 18px;
	height: 18px;
	background: #fff;
	position: absolute;
	left: 9px;
	bottom: -9px;
	transform: rotate(-45deg) skew(18deg, 15deg);
}
section#result .step2_result label .ilst {
	display: flex;
	align-content: center;
	align-items: center;
	height: 75px;
	padding-left: 105px;
	position: relative;
}
section#result .step2_result label .ilst::before {
	content: "";
	display: block;
	width: 90px;
	height: 90px;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
section#result .step2_result label:nth-child(1) .ilst::before {
	background-image: url("../img/step02_01_2.jpg");
}
section#result .step2_result label:nth-child(2) .ilst::before {
	background-image: url("../img/step02_02_2.jpg");
}
section#result .step2_result label:nth-child(3) .ilst::before {
	background-image: url("../img/step02_03_2.jpg");
}
section#result .step2_result label:nth-child(4) .ilst::before {
	background-image: url("../img/step02_04_2.jpg");
}
section#result .step2_result label:nth-child(5) .ilst::before {
	background-image: url("../img/step02_05_2.jpg");
}
section#result .step2_result label:nth-child(6) .ilst::before {
	background-image: url("../img/step02_06_2.jpg");
}
section#result .step2_result label:nth-child(7) .ilst::before {
	background-image: url("../img/step02_07_2.jpg");
}
section#result .step2_result label:nth-child(8) .ilst::before {
	background-image: url("../img/step02_08_2.jpg");
}
section#result .step2_result label:nth-child(9) .ilst::before {
	background-image: url("../img/step02_09_2.jpg");
}
section#result .step2_result label .ilst p {
	line-height: 1.6;
}
section#result .step2_result label .score {
	position: absolute;
	top: 10px;
	right: 10px;
}
section#result .step2_result label .score p {
	line-height: 1;
}
section#result .step2_result label .score p span {
	display: inline-block;
	width: auto;
	height: auto;
	margin-right: 5px;
	padding: 0;
	border-bottom-left-radius: 0;
	background: none;
	color: #565656;
	text-align: left;
	position: relative;
	top: 0;
	left: 0;
}
section#result .step2_result label .score p span::after {
	display: none;
}
section#result .result_co2  {
	width: calc(100% - 280px);
	line-height: 2.4;
}
section#result .co2  {
	display: inline-block;
	margin: 0 5px;
	font-size: 50px;
	line-height: 1;
}
section#result .tree  {
	display: inline-block;
	width: 40px;
	height: 40px;
	margin-top: 5px;
	background: url("../img/tree.png") center bottom / contain no-repeat;
}

/*==================================================================================
RESULT SCHOOL
==================================================================================*/
section#result ul.expo {
	position: absolute;
	top: 30px;
	right: 30px;
}
section#result ul.expo li {
	margin-bottom: 10px;
	padding-left: 20px;
	position: relative;
}
section#result ul.expo li::before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	position: absolute;
	left: 0;
	bottom: 0;
}
section#result ul.expo li:nth-child(1)::before {
	background: #BDE5B5;
}
section#result ul.expo li:nth-child(2)::before {
	background: #00A271;
}
section#result ul.expo li p {
	font-size: 14px;
	line-height: 1;
}
/* step1 ---------------------------------------------------*/
section#result .step1_graf {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: flex-end;
	padding: 0 60px 0;
	border-left: 2px #AFAFAF solid;
	border-bottom: 2px #AFAFAF solid;
	background: linear-gradient(to top, #F9F9F9 0, #F9F9F9 26px, #fff 26px, #fff 52px, #F9F9F9 52px, #F9F9F9 78px, #fff 78px, #fff 104px, #F9F9F9 104px, #F9F9F9 130px, #fff 130px, #fff 156px, #F9F9F9 156px, #F9F9F9 182px, #fff 182px, #fff 208px);
}
section#result .step1_graf .graf {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: flex-end;
	width: 90px;
	height: 220px;
	overflow: hidden;
}
section#result .step1_graf .graf div {
	width: 40px;
	box-shadow: 2px 0 2px rgba(0,0,0,0.30);
	position: relative;
}
section#result .step1_graf .graf div.our {
	background: #BDE5B5;
}
section#result .step1_graf .graf div.me {
	background: #00A271;
}
section#result .step1_graf .graf div.day1 {
	height: calc(26px * 1);
}
section#result .step1_graf .graf div.day2 {
	height: calc(26px * 2);
}
section#result .step1_graf .graf div.day3 {
	height: calc(26px * 3);
}
section#result .step1_graf .graf div.day4 {
	height: calc(26px * 4);
}
section#result .step1_graf .graf div.day5 {
	height: calc(26px * 5);
}
section#result .step1_graf .graf div.day6 {
	height: calc(26px * 6);
}
section#result .step1_graf .graf div.day7 {
	height: calc(26px * 7);
}
section#result .step1_graf .graf div p {
	width: 100%;
	line-height: 1;
	text-align: center;
	position: absolute;
	top: -45px;
	left: 0;
}
section#result .step1_graf .graf div.our p {
	color: #9ED190;
}
section#result .step1_graf .graf div.me p {
	color: #00A271;
}
section#result .step1_graf .graf div p .number {
	position: relative;
}
section#result .step1_graf .graf div p .number::before {
	display: inline-block;
	font-size: 40px;
	position: relative;
	top: 0;
	left: 0;
}
section#result .step1_graf .graf div.day0 p .number::before {
	content: "0";
}
section#result .step1_graf .graf div.day1 p .number::before {
	content: "1";
}
section#result .step1_graf .graf div.day2 p .number::before {
	content: "2";
}
section#result .step1_graf .graf div.day3 p .number::before {
	content: "3";
}
section#result .step1_graf .graf div.day4 p .number::before {
	content: "4";
}
section#result .step1_graf .graf div.day5 p .number::before {
	content: "5";
}
section#result .step1_graf .graf div.day6 p .number::before {
	content: "6";
}
section#result .step1_graf .graf div.day7 p .number::before {
	content: "7";
}
section#result .step1_graf .graf.animated div {
	animation: graf_stick .8s ease .5s;
}
@keyframes graf_stick {
	0% {bottom: -100%;}
	100% {bottom: 0;}
}

/* 項目 */
section#result ul.step1_item {
	display: flex;
	justify-content: space-between;
	padding: 50px 60px 0;
}
section#result ul.step1_item li {
	width: 90px;
	position: relative;
}
section#result ul.step1_item li::before {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: calc(30px - 5px);
	padding-top: 5px;
	border-radius: 20px;
	background: #FFBD4D;
	color: #fff;
	font-size: 18px;
	position: absolute;
	top: -45px;
	left: 50%;
	transform: translateX(-50%);
}
section#result ul.step1_item li:nth-child(1)::before {
	content: "1";
}
section#result ul.step1_item li:nth-child(2)::before {
	content: "2";
}
section#result ul.step1_item li:nth-child(3)::before {
	content: "3";
}
section#result ul.step1_item li:nth-child(4)::before {
	content: "4";
}
section#result ul.step1_item li:nth-child(5)::before {
	content: "5";
}
section#result ul.step1_item li p {
	display: flex;
	justify-content: center;
	align-items: center;
	width: calc(150px - 4px);
	height: calc(90px - 24px);
	padding: 15px 0 5px;
	border: 2px #AFAFAF solid;
	border-radius: 5px;
	text-align: center;
	position: relative;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}
section#result ul.step1_item li p::before {
	content: "";
	display: block;
	width: 10px;
	height: 10px;
	border: 2px transparent solid;
	border-top: 2px #AFAFAF solid;
	border-right: 2px #AFAFAF solid;
	border-radius: 2px;
	background: #fff;
	position: absolute;
	top: -12px;
	left: 50%;
	transform: rotate(-45deg) translateX(-50%);
}

/* step2 ---------------------------------------------------*/
section#result .step2_graf_total,
section#ecoup .step2_graf_total {
	text-align: right;
	color: #AFAFAF;
}
section#result ul.step2_item,
section#ecoup ul.step2_item {
	padding: 30px 0 10px;
}
section#result ul.step2_item li,
section#ecoup ul.step2_item li {
	width: calc(320px - 20px);
	padding-right: 20px;
	position: relative;
}
section#result ul.step2_item li::before,
section#ecoup ul.step2_item li::before {
	display: block;
	width: 36px;
	height: 36px;
	padding-top: 10px;
	border-radius: 3px;
	background: #FFBD4D;
	color: #fff;
	font-size: 18px;
	text-align: center;
	position: absolute;
	top: -5px;
	left: 10px;
	z-index: 10;
}
section#result ul.step2_item li:nth-child(1)::before,
section#ecoup ul.step2_item li:nth-child(1)::before {
	content: "1";
}
section#result ul.step2_item li:nth-child(2)::before,
section#ecoup ul.step2_item li:nth-child(2)::before {
	content: "2";
}
section#result ul.step2_item li:nth-child(3)::before,
section#ecoup ul.step2_item li:nth-child(3)::before {
	content: "3";
}
section#result ul.step2_item li:nth-child(4)::before,
section#ecoup ul.step2_item li:nth-child(4)::before {
	content: "4";
}
section#result ul.step2_item li:nth-child(5)::before,
section#ecoup ul.step2_item li:nth-child(5)::before {
	content: "5";
}
section#result ul.step2_item li:nth-child(6)::before,
section#ecoup ul.step2_item li:nth-child(6)::before {
	content: "6";
}
section#result ul.step2_item li:nth-child(7)::before,
section#ecoup ul.step2_item li:nth-child(7)::before {
	content: "7";
}
section#result ul.step2_item li:nth-child(8)::before,
section#ecoup ul.step2_item li:nth-child(8)::before {
	content: "8";
}
section#result ul.step2_item li:nth-child(9)::before,
section#ecoup ul.step2_item li:nth-child(9)::before {
	content: "9";
}
section#result ul.step2_item li::after,
section#ecoup ul.step2_item li::after {
	content: "";
	display: block;
	width: 20px;
	height: 20px;
	background: #fff;
	position: absolute;
	left: 18px;
	bottom: 19px;
	transform: rotate(-45deg) skew(18deg, 15deg);
	z-index: 10;
}
section#result ul.step2_item li p,
section#ecoup ul.step2_item li p {
	display: flex;
	align-items: center;
	width: calc(100% - 69px);
	height: calc(70px - 19px);
	padding: 10px 10px 5px 55px;
	border: 2px #AFAFAF solid;
	border-radius: 5px;
	position: relative;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}
section#result ul.step2_item li p::before,
section#ecoup ul.step2_item li p::before {
	content: "";
	display: block;
	width: 10px;
	height: 10px;
	border: 2px transparent solid;
	border-top: 2px #AFAFAF solid;
	border-right: 2px #AFAFAF solid;
	border-radius: 2px;
	background: #fff;
	position: absolute;
	top: 50%;
	right: -2px;
	transform: rotate(45deg) translateY(-50%);
}

/* グラフ */
section#result .step2_graf,
section#ecoup .step2_graf {
	width: calc(100% - 320px - 22px);
	margin-right: 20px;
	padding: 30px 0 10px;
	border-top: 2px #AFAFAF solid;
	border-left: 2px #AFAFAF solid;
}
section#result .step2_graf .graf,
section#ecoup .step2_graf .graf {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	height: 70px;
	overflow: hidden;
}
section#result .step2_graf .graf div,
section#ecoup .step2_graf .graf div {
	height: 40px;
	box-shadow: 0 2px 2px rgba(0,0,0,0.30);
	position: relative;
}
section#result .step2_graf .graf.animated div.our,
section#ecoup .step2_graf .graf.animated div.our {
	animation: graf_stick2 1s ease;
}
@keyframes graf_stick2 {
	0% {transform: translateX(-100%);}
	100% {transform: translateX(0);}
}
section#result .step2_graf .graf div.our {
	background: #BDE5B5;
	z-index: 10;
}
section#result .step2_graf .graf div.me {
	width: 20px;
	background: #00A271;
}
section#result .step2_graf .graf.animated div.me {
	animation: graf_stick2_me 2s ease;
}
@keyframes graf_stick2_me {
	0% {transform: translateX(-100%); opacity: 0;}
	50% {transform: translateX(-100%); opacity: 0;}
	100% {transform: translateX(0); opacity: 1;}
}
section#result .step2_graf .graf div.me::before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 40px;
    background: rgba(255,255,255,0.50);
    position: absolute;
    top: -10px;
    left: 0;
    animation: shiny 2s ease-in-out infinite;
}
@keyframes shiny {
    0% {transform: scale(0) rotate(45deg); opacity: 0;}
    50% {transform: scale(0) rotate(45deg); opacity: 0.5;}
    51% {transform: scale(2) rotate(45deg); opacity: 1;}
    70% {transform: scale(20) rotate(45deg); opacity: 0;}
    100% {transform: scale(0) rotate(45deg); opacity: 0;}
}
section#ecoup .step2_graf .graf div.our {
	background: #00A271;
}

/*==================================================================================
みんなのエコ活動
==================================================================================*/
/* 下部固定 ボタン */
.btm_fix.relative {
	background: none;
	position: absolute;
}
.btm_fix.relative .btn_group {
    width: auto;
}
/* 上部 森レイヤー ------------------------------*/
section#mountain {
	padding: 0 0 22%!important;
	position: relative;
	overflow: hidden;
}
section#mountain .ecoup_ttl img {
	max-width: 680px;
	margin: auto;
}
section#mountain .mountain {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
}
section#mountain .mountain .bg01,
section#mountain .mountain .bg02,
section#mountain .mountain .bg03,
section#mountain .mountain .bg04 {
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
}
section#mountain .mountain .bg01,
section#mountain .mountain .bg02 {
	bottom: 20px;
}
/* 合計得点 -------------------------------------*/
section#ecoup {
	padding: 160px 0 20%!important;
	background: #CEEFD4;
	position: relative;
	overflow: hidden;
}
section#ecoup .container {
	position: relative;
	z-index: 1000;
}
section#ecoup .total {
	width: calc(100% - 52px);
	max-width: calc(680px - 52px);
	padding: 50px 20px 20px;
	border: 6px #DD335C solid;
	border-radius: 20px;
	background: #fff;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.30);
	position: relative;
}
section#ecoup .total .ttl {
	display: inline-block;
	width: 360px;
	padding: 20px 0 10px;
	border-radius: 50px;
	background: #DD335C;
	text-align: center;
	line-height: 1.4;
	position: absolute;
	top: -43px;
	left: 50%;
	transform: translateX(-50%);
}
section#ecoup .total .ttl::before {
	content: "";
	display: inline-block;
	width: calc(100% - 10px - 6px);
	height: calc(100% - 10px - 6px);
	border: 3px #fff solid;
	border-radius: 50px;
	position: absolute;
	top: 5px;
	left: 5px;
}
section#ecoup .total .ttl span {
	color: #fff;
	font-size: 34px;
	position: relative;
}
section#ecoup .total .ttl span::before,
section#ecoup .total .ttl span::after {
	content: "";
	display: block;
	width: 20px;
	height: 20px;
	background: url("../img/star.png") center center / contain no-repeat;
	position: absolute;
	top: 5%;
}
section#ecoup .total .ttl span::before {
	left: -40px;
}
section#ecoup .total .ttl span::after {
	right: -40px;
}
section#ecoup .total .score,
section#ecoup .total_step .score {
	background: #FFFCE9;
	padding: 0 10px 15px;
	text-align: center;
}
section#ecoup .total .score p {
	font-size: 40px;
	line-height: 1;
	animation: score_zoom .3s 2.8s ease;
}
@keyframes score_zoom {
	80% {
		transform: scale(1.5);
	}
	100% {
		transform: scale(1);
	}
}
section#ecoup .total .score p span {
	font-size: 100px;
}
/* ステップ1, ステップ2 */
section#ecoup .total_step {
	width: calc(50% - 40px - 40px);
	margin: 0 20px;
	padding: 50px 20px 20px;
	border-radius: 20px;
	background: #fff;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.30);
	position: relative;
}
section#ecoup .total_step .ttl {
	position: absolute;
	top: -30px;
	left: 50%;
	transform: translateX(-50%);
}
section#ecoup .total_step .ttl img {
	width: 340px;
}
section#ecoup .total_step .score p {
	font-size: 34px;
	line-height: 1;
	animation: score_zoom .3s 2.8s ease;
}
section#ecoup .total_step .score p span {
	font-size: 70px;
}
/* co2削減量 */
section#ecoup .co2_cut {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	padding: 20px 30px;
	border-radius: 20px;
	background: url("../img/wood.gif") center center / cover no-repeat;
	position: relative;
}
section#ecoup .co2_cut::before {
	content: "";
	display: block;
	width: calc(100% - 20px - 4px);
	height: calc(100% - 20px - 4px);
	border: 2px #fff solid;
	border-radius: 10px;
	position: absolute;
	top: 10px;
	left: 10px;
}
section#ecoup .co2_cut p {
	color: #fff;
}
section#ecoup .co2_cut p:nth-child(1) {
	margin-right: 20px;
}
section#ecoup .co2_cut p:nth-child(2) {
	font-size: 40px;
	line-height: 1;
}
section#ecoup .co2_cut p:nth-child(2) span {
	font-size: 130px;
}
section#ecoup .hakase_voice {
	padding-left: 150px;
	position: relative;
}
section#ecoup .hakase_voice .ilst {
	display: block;
	width: 140px;
	height: 140px;
	background: url("../img/hakase03.png") right top / 140px no-repeat;
	position: absolute;
	bottom: -30px;
	left: 0;
}
section#ecoup .hakase_voice p {
	padding: 15px 30px 10px;
	border: 3px #FF893D solid;
	border-radius: 50px;
	background: #fff;
	position: relative;
}
section#ecoup .hakase_voice p::after {
	content: "";
	display: block;
	width: 30px;
	height: 14px;
	background: url("../img/fukidasi2.png") left top / contain no-repeat;
	position: absolute;
	top: 50%;
	left: -29px;
	transform: translateY(-50%);
	z-index: 10;
}
/* 削減量は杉の木の吸収量にするとどれくらい？ */
section#ecoup .about_cut {
	width: calc(100% - 72px);
	max-width: calc(840px - 72px);
	padding: 30px;
	border: 6px #00A271 solid;
	border-radius: 20px;
	background: #fff;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.30);
	position: relative;
}
section#ecoup .about_cut ul.expo {
	display: flex;
	flex-wrap: nowrap;
	padding: 10px 15px 10px 10px;
	border-radius: 10px;
	background: #E6F4E8;
	position: absolute;
	top: 30px;
	right: 30px;
}
section#ecoup .about_cut ul.expo li:nth-child(1) {
	margin-right: 10px;
	padding-left: 80px;
	position: relative;
}
section#ecoup .about_cut ul.expo li:nth-child(2) {
	padding-left: 40px;
	position: relative;
}
section#ecoup .about_cut ul.expo li::before {
	content: "";
	display: block;
	background: url("../img/tree.png") center center / contain no-repeat;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
section#ecoup .about_cut ul.expo li:nth-child(1)::before {
	width: 80px;
	height: 80px;
	background-image: url("../img/tree_l.png");
}
section#ecoup .about_cut ul.expo li:nth-child(2)::before {
	width: 45px;
	height: 45px;
}
section#ecoup .about_cut p {
	padding-right: 260px;
	line-height: 1;
}
section#ecoup .about_cut p span {
	display: inline-block;
	margin: 0 5px;
	font-size: 60px;
}
section#ecoup .about_cut .tree span {
	display: inline-block;
	background: url("../img/tree.png") center bottom / contain no-repeat;
	margin: 0 15px 15px 0;
}
section#ecoup .about_cut .tree span.large {
	width: 120px;
	height: 123px;
	background-image: url("../img/tree_l.png");
}
section#ecoup .about_cut .tree span.small {
	width: 50px;
	height: 75px;
}
/* CO2 1トンってどのくらい？ */
section#ecoup .about_1ton {
	width: calc(100% - 12px);
	max-width: calc(840px - 12px);
	border: 6px #FFBD4D solid;
	border-radius: 20px;
	background: #fff;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.30);
	position: relative;
}
section#ecoup .about_1ton .ttl {
	display: inline-block;
	padding: 10px 20px;
	border-radius: 40px;
	background: #FFBD4D;
	color: #fff;
	line-height: 1;
	position: absolute;
	top: -30px;
	left: 50%;
	transform: translateX(-50%);
}
section#ecoup .about_1ton .ttl::after {
	content: "";
	display: block;
	width: 10px;
	height: 10px;
	background: #FFBD4D;
	position: absolute;
	left: 50%;
	bottom: -8px;
	transform: rotate(45deg) translateX(-50%);
}
section#ecoup .about_1ton .ttl + p {
	padding: 10px 20px;
	line-height: 1.4;
	text-align: center;
}
section#ecoup .about_1ton .ttl + p span {
	display: inline-block;
	margin: 0 5px;
	font-size: 50px;
}


/* 背景 森レイヤー -----------------------------------*/
section#ecoup .woods {
	width: 100%;
	height: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
}
section#ecoup .woods .bg01,
section#ecoup .woods .bg02,
section#ecoup .woods .bg03,
section#ecoup .woods .bg04 {
	width: 100%;
	position: absolute;
	left: 0;
	/*top: 10%;*/
	bottom: 0;
}
/*
section#ecoup .woods .bg01 {
	bottom: 20%;
}
section#ecoup .woods .bg02 {
	bottom: 20%;
}
section#ecoup .woods .bg03 {
	bottom: 10%;
}
section#ecoup .woods .bg04 {
	top: 20%;
}
*/
section#ecoup .woods .bg01 img {
	min-width: 980px;
	max-height: 2000px;
	position: relative;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}
section#ecoup .woods .bg02 img,
section#ecoup .woods .bg03 img,
section#ecoup .woods .bg04 img {
	max-width: 1920px;
	min-width: 980px;
	position: relative;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}

/*==================================================================================
みんなのエコ活動 ステップ１
==================================================================================*/
section#ecoup.step1 {
	padding: 60px 0 120px!important;
	background: #CEEFD4;
	position: relative;
}
section#ecoup.step1 .ttl img {
	max-width: 460px;
	margin: auto;
}
section#ecoup.step1 .ecoup_step1 {
	width: calc(100% / 3 - 20px - 20px);
	margin-bottom: 30px;
	padding: 20px 10px;
	border-radius: 20px;
	background: #fff;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.30);
	position: relative;
}
section#ecoup.step1 .ecoup_step1.dummy {
	margin-bottom: 0;
	background: none;
	box-shadow: none;
}
section#ecoup.step1 .ecoup_step1 span.font_18 {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: calc(30px - 5px);
	padding-top: 5px;
	border-radius: 50%;
	background: #FFBD4D;
	color: #fff;
	position: absolute;
	top: 20px;
	left: 20px;
	z-index: 10;
}
section#ecoup.step1 .ecoup_step1 .graf {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 180px;
	height: 180px;
	margin: 0 auto 20px;
	border-radius: 50%;
	background-color: #F2F2F2;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	position: relative;
}
section#ecoup.step1 .ecoup_step1 .graf .circle {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	top: 0;
	left: 0;
}
section#ecoup.step1 .ecoup_step1 .graf.day1 .circle {
	background-image: url("../img/graf01.png");
}
section#ecoup.step1 .ecoup_step1 .graf.day2 .circle {
	background-image: url("../img/graf02.png");
}
section#ecoup.step1 .ecoup_step1 .graf.day3 .circle {
	background-image: url("../img/graf03.png");
}
section#ecoup.step1 .ecoup_step1 .graf.day4 .circle {
	background-image: url("../img/graf04.png");
}
section#ecoup.step1 .ecoup_step1 .graf.day5 .circle {
	background-image: url("../img/graf05.png");
}
section#ecoup.step1 .ecoup_step1 .graf.day6 .circle {
	background-image: url("../img/graf06.png");
}
section#ecoup.step1 .ecoup_step1 .graf.day7 .circle {
	background-image: url("../img/graf07.png");
}

/* 中央 日数 */
section#ecoup.step1 .ecoup_step1 .graf .day {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 80px;
	height: 80px;
	background: #fff;
	border-radius: 50%;
	position: relative;
	z-index: 40;
}
section#ecoup.step1 .ecoup_step1 .graf p {
	line-height: 1;
}
section#ecoup.step1 .ecoup_step1 .graf p span {
	font-size: 40px;
	position: relative;
}
section#ecoup.step1 .ecoup_step1 .graf p span::before {
	display: inline-block;
	position: relative;
}
section#ecoup.step1 .ecoup_step1 .graf.day0 p span::before {
	content: "0";
}
section#ecoup.step1 .ecoup_step1 .graf.day1 p span::before {
	content: "1";
}
section#ecoup.step1 .ecoup_step1 .graf.day2 p span::before {
	content: "2";
}
section#ecoup.step1 .ecoup_step1 .graf.day3 p span::before {
	content: "3";
}
section#ecoup.step1 .ecoup_step1 .graf.day4 p span::before {
	content: "4";
}
section#ecoup.step1 .ecoup_step1 .graf.day5 p span::before {
	content: "5";
}
section#ecoup.step1 .ecoup_step1 .graf.day6 p span::before {
	content: "6";
}
section#ecoup.step1 .ecoup_step1 .graf.day7 p span::before {
	content: "7";
}
/* Let'sチャレンジ --------------------------------------*/
section#challenge {
	padding: 60px 0 120px!important;
	background: #FFF8E3 url("../img/bg_border3.png") left top / 20px repeat;
	animation: anm_border 15s linear infinite;
	position: relative;
}
section#challenge .boad .hakase_ilst {
	display: block;
	width: 140px;
	height: 140px;
	background: url("../img/hakase04.png") center bottom / contain no-repeat;
	position: absolute;
	top: -140px;
	left: 20px;
}
section#challenge .ttl {
	width: 100%;
	position: absolute;
	top: -80px;
	left: 50%;
	transform: translate(-50%);
}
section#challenge .ttl img {
	max-width: 460px;
	margin: auto;
}
section#challenge .col3 .item {
	padding-left: 35px;
	line-height: 1.4;
	position: relative;
}
section#challenge .col3 .item span {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: calc(30px - 5px);
	padding-top: 5px;
	border-radius: 20px;
	background: #FFBD4D;
	color: #fff;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
/* アクション */
section#challenge .challenge {
	max-width: 240px;
	margin: auto;
	padding-bottom: 20px;
	position: relative;
}
section#challenge .challenge input {
	display: none;
}
section#challenge .challenge label.trigger {
	display: block;
	width: calc(120px - 10px);
	height: calc(120px - 10px);
	border: 5px #FF6D50 solid;
	border-radius: 50%;
	background-color: #FFF8E3;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	cursor: pointer;
	position: absolute;
	right: 0;
	bottom: 0;
}
section#challenge .challenge label.trigger::before {
	content: "";
	display: block;
	width: 10px;
	height: calc(100% + 10px - 3px);
	border-top: 5px rgba(255,255,255,0.60) solid;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 0;
	animation: ring 2.5s ease-out infinite;
}
@keyframes ring {
	0% {
		opacity: 0;
	}
	15% {
		opacity: 1;
	}
	30% {
		opacity: 0;
		transform: translate(-50%, -50%) rotate(360deg);
	}
}
section#challenge .challenge label.trigger::after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,0.40) url("../img/challenge_touch.png") center center / contain no-repeat;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 0;
	animation: touch 2.5s ease-out infinite;
}
@keyframes touch {
	0% {opacity: 0;}
	20% {opacity: 1;}
	40% {opacity: 0;}
}
section#challenge .challenge.c01 label.trigger {
	background-image: url("../img/challenge01_switch.png");
}
section#challenge .challenge.c02 label.trigger {
	background-image: url("../img/challenge02_2_switch.png");
}
section#challenge .challenge.c03 label.trigger {
	background-image: url("../img/challenge03_switch.png");
}
section#challenge .challenge.c04 label.trigger {
	background-image: url("../img/challenge04_switch.png");
}
section#challenge .challenge.c05 label.trigger {
	background-image: url("../img/challenge05_switch.png");
}
section#challenge .challenge .target {
	display: block;
	width: 200px;
	height: 200px;
	border-radius: 50%;
	background-color: #ACD9EA;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	overflow: hidden;
}
section#challenge .challenge.c01 .target {
	background-image: url("../img/challenge01.png");
}
section#challenge .challenge.c02 .target {
	background-image: url("../img/challenge02_2.png");
}
section#challenge .challenge.c03 .target {
	background-image: url("../img/challenge03.png");
}
section#challenge .challenge.c04 .target {
	background-image: url("../img/challenge04.png");
}
section#challenge .challenge.c05 .target {
	background-image: url("../img/challenge05.png");
}
/* アクション後イラスト */
section#challenge .challenge.c01 input:checked ~ .target {
	background-image: url("../img/challenge01_off.png");
}
section#challenge .challenge.c02 input:checked ~ .target {
	background-image: url("../img/challenge02_2_off.png");
}
section#challenge .challenge.c03 input:checked ~ .target {
	background-image: url("../img/challenge03_off.png");
}
section#challenge .challenge.c04 input:checked ~ .target {
	background-image: url("../img/challenge04_off.png");
}
section#challenge .challenge.c05 input:checked ~ .target {
	background-image: url("../img/challenge05_off.png");
}
/* アクション後スイッチ */
section#challenge .challenge input:checked ~ label.trigger {
	width: 120px;;
	height: 120px;;
	border: none;
	animation: border_non .4s ease-out;
	pointer-events: none;
}
@keyframes border_non {
	0% {
		width: calc(120px - 10px);
		height: calc(120px - 10px);
		border: 5px #FF6D50 solid;
	}
	50% {
		width: calc(120px - 10px);
		height: calc(120px - 10px);
		border: 5px #FF6D50 solid;
	}
	100% {
		width: 120px;
		height: 120px;
		border: none;
	}
}
section#challenge .challenge.c02 input:checked ~ label.trigger {
	background-image: url("../img/challenge02_2_switch_off.png");
}
section#challenge .challenge.c04 input:checked ~ label.trigger {
	background-image: url("../img/challenge04_switch_off.png");
}
section#challenge .challenge.c05 input:checked ~ label.trigger {
	background-image: url("../img/challenge05_switch_off.png");
}
section#challenge .challenge input:checked ~ label.trigger::before {
	display: none;
}
section#challenge .challenge input:checked ~ label.trigger::after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: rgba(173,58,72,0.70) url("../img/challenge_done.png") center center / contain no-repeat;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 1;
	animation: challenge .4s ease-out;
}
@keyframes challenge {
	0% {
		width: 0%;
		height: 0%;
	}
	50% {
		width: 0%;
		height: 0%;
	}
	80% {
		width: 140%;
		height: 140%;
	}
	100% {
		width: 100%;
		height: 100%;
	}
}

section#challenge input#exchange {
	display: none;
}
section#challenge label.btn.red {
    display: block;
    width: calc(380px - 46px);
	height: auto;
    padding: 20px;
    border-radius: 40px;
	border: 3px #AA395C solid;
    background: #E5627C;
    box-shadow: 0 5px 0 #aa395c;
    color: #fff;
    font-size: 24px;
    font-family: heisei-kaku-gothic-std, sans-serif;
    font-weight: 900;
    text-align: center;
	cursor: pointer;
}
section#challenge label.btn.red.disabled {
	border: 3px #e0e0e0  solid;
	background: #e6e6e6;
	box-shadow: none;
	pointer-events: none;
}
section#challenge .boad.after_challenge {
	display: none;
	position: relative;
}
section#challenge .boad.after_challenge canvas {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
section#challenge .complete {
	padding: 60px 0 0;
	position: relative;
	z-index: 10;
}
section#challenge .complete::before {
	content: "";
	display: block;
	width: 300px;
	height: 300px;
	border-radius: 50%;
	background: rgba(206,239,212,0.30);
	position: absolute;
	left: 50%;
	top: 0;
	margin-left: -150px;
}
section#challenge .complete .ilst_hakase {
	width: 100%;
	position: absolute;
	bottom: 16%;
	left: 10px;
}
section#challenge .complete .ilst_hakase img {
	max-width: 140px;
	margin: auto;
}
section#challenge .complete .nicefight {
	position: relative;
}
section#challenge .complete .nicefight img {
	max-width: 340px;
	margin: auto;
}
section#challenge .complete + p{
	position: relative;
	z-index: 10;
}
section#challenge input#exchange:checked + .boad {
	display: none;
}
section#challenge input#exchange:checked ~ .boad.after_challenge {
	display: block;
}

/*==================================================================================
エコアップ行動の方法
==================================================================================*/
section#info.bg_blue {
	min-height: calc(100vh - 312px - 60px - 160px);
	padding: 60px 0 160px!important;
}
section#info .hakase_voice {
	position: relative;
}
section#info .hakase_voice p {
	width: calc(100% - 66px);
	padding: 15px 30px 10px;
	border: 3px #2871bf solid;
	border-radius: 20px;
	background: #fff;
	color: #2871bf;
	position: relative;
}
section#info .hakase_voice p::after {
	content: "";
	display: block;
	width: 14px;
	height: 14px;
	border-right: 3px #2871bf solid;
	border-bottom: 3px #2871bf solid;
	background: #fff;
	position: absolute;
	left: 50%;
	bottom: -12px;
	transform: translateX(-50%) scaleY(1.5) rotate(45deg);
	z-index: 10;
}
section#info .hakase_voice .ilst {
	width: 120px;
	height: 120px;
	margin: auto;
	background: url("../img/hakase02.png") center top / cover no-repeat;
}
.ecoup_guide {
	padding: 0 60px 60px;
	border: 6px #2871bf solid;
	border-radius: 20px;
	background: #fffdf5;
	position: relative;
}
.ecoup_guide .ttl {
	padding: 10px;
	border-radius: 10px;
	background: #2871bf;
	color: #fff;
	font-family: heisei-kaku-gothic-std, sans-serif;
	font-weight: 900;
	position: relative;
	top: -40px;
}
.ecoup_guide .number {
	padding-left: 35px;
	font-family: heisei-kaku-gothic-std, sans-serif;
	font-weight: 900;
	position: relative;
}
.ecoup_guide .number span {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: calc(30px - 5px);
	padding-top: 5px;
	border-radius: 50%;
	background: #FF893D;
	color: #fff;
	line-height: 1;
	position: absolute;
	top: 6px;
	left: 0;
}
section#info .join {
	padding: 20px 20px 30px;;
	border: 3px #389bdf solid;
	border-radius: 10px;
	background: #fff;
}
section#info .join.group {
	border-color: #2871bf;
}
section#info .join .ttl {
	color: #389bdf;
	font-family: heisei-kaku-gothic-std, sans-serif;
	font-weight: 900;
}
section#info .join.group .ttl {
	color: #2871bf;
}
section#info .join .ttl p {
	line-height: 1;
}


/* 2023.05.17 追記  -----------------------------------------------------------------*/
/* チェックボックス */
.label_check {
	display: inline-block;
}
.label_check input {
    display: none;
}
.label_check span {
	display: inline-block;
    padding-left: 25px;
	font-size: 16px;
	line-height: 1.4;
    position: relative;
	cursor: pointer;
}
.label_check span:hover {
	opacity: 0.8;
}
.label_check span::before {
    content: "";
    display: block;
    width: calc(18px - 2px);
    height: calc(18px - 2px);
    border: 2px #e0e0e0 solid;
	border-radius: 2px;
    position: absolute;
    top: 7px;
    left: 0;
}
.label_check input:checked + span::before {
    border: 1px #FF893D solid;
}
.label_check input:checked + span::after {
    content: "";
    display: block;
    width: 12px;
    height: 6px;
    border-left: 4px #FF893D solid;
	border-bottom: 4px #FF893D solid;
    position: absolute;
    top: 8px;
    left: 2px;
	transform: rotate(-45deg);
}
section#login .join_free_input {
	padding: 20px;
	background: #fffdf5;
}
/* 小学校の結果ページ 参加賞 ----------------------------*/
.award {
	padding: 20px 30px 30px;
	border: 4px #389bdf solid;
	border-radius: 20px;
	background: #fff;
}
.award.family {
	border-color: 4px;
}
.award .row {
	align-items: center;
}
.award .img {
	width: 30%;
}
.award.family .img img {
	width: 70%;
    margin: auto;
}
.award .txt {
	width: calc(70% - 40px);
}
.award .txt img {
	max-width: 680px;
}
.award a {
	display: block;
	width: calc(380px - 46px);
	margin: auto;
	padding: 20px;
	border-radius: 40px;
	border: 3px #1879D1 solid;
	background: #fff;
	box-shadow: 0 5px 0 #1879D1;
	color: #389bdf;
	font-size: 24px;
	font-family: heisei-kaku-gothic-std, sans-serif;
	font-weight: 900;
	text-align: center;
	position: relative;
}
.award a:hover {
	box-shadow: none;
	position: relative;
	top: 5px;
}
.award a .pdf {
	padding-left: 35px;
}
.award a .pdf::before {
	width: 30px;
	height: 30px;
}



.tb {display: none;}
.pc {display: inline;}
.sp {display: none;}

@media screen and (max-width : 940px) {
	
	/*==================================================================================
	ヘッダー
	==================================================================================*/
	header.second {
		background-size: cover;
		background-position: center;
	}

	/*==================================================================================
	共通
	==================================================================================*/
	/* レイアウト */
	.col2 {
		width: 100%;
		max-width: 680px;
		margin: 0 auto 20px;
	}

	/* スクロール */
	.scroll {
		display: block;
	  	overflow-x: scroll;
	  	white-space: nowrap;
	  	-webkit-overflow-scrolling: touch;
		padding: 0 0 10px;
		margin-bottom: 20px;
	}
	.scroll::-webkit-scrollbar {
	  height: 8px;
	}
	.scroll::-webkit-scrollbar-track {
	  margin: 0 2px;
	  background: #ccc;
	  border-radius: 5px;
	}
	.scroll::-webkit-scrollbar-thumb {
	  border-radius: 5px;
	  background: #666;
	}

	/*==================================================================================
	STEP01
	==================================================================================*/
	section#input_step01 .boad {
		max-width: 480px;
		margin: auto;
	}
	/* 日にち */
	section#input_step01 .day {
		justify-content: flex-start;
		margin-top: -20px;
	}
	/* ステップ① 項目 */
	section#input_step01 .item {
		width: calc(100% - 40px);
		margin-bottom: 10px;
	}
	/*==================================================================================
	STEP02
	==================================================================================*/
	section#input_step02 form .row,
	section#challenge .row {
		max-width: 680px;
		margin: auto;
	}
	section#input_step02 label,
	section#challenge.step2 label {
		width: calc(100% / 2 - 40px - 10px);
	}
	/*==================================================================================
	RESULT
	==================================================================================*/
	section#result .row.total  {
		justify-content: flex-end;
		max-width: 680px;
		margin: auto;
	}
	section#result .score.total {
	    margin-bottom: 30px;
	}
	section#result .score.total .asagao {
		width: 160px;
		height: 160px;
		top: -60px;
		left: -200px;
		transform: none;
	}

	section#result .result_co2  {
		order: 2;
		width: 100%;
	}
	/*==================================================================================
	RESULT SCHOOL
	==================================================================================*/
	/* step1 ---------------------------------------------------*/
	section#result .step1_graf {
		min-width: calc(840px - 122px);
	}
	/* 項目 */
	section#result ul.step1_item {
		min-width: calc(840px - 120px);
	}
	section#result ul.step1_item li p.font_12 {
		font-size: 12px;
	}
	/* step2 ---------------------------------------------------*/
	section#result .step2_graf_total,
	section#ecoup .step2_graf_total {
		min-width: 840px;
	}
	section#result .scroll > .row,
	section#ecoup .scroll > .row {
		min-width: 812px;
	}
	section#result ul.step2_item li p.font_12,
	section#ecoup ul.step2_item li p.font_12 {
	    font-size: 12px;
	}
}

@media screen and (max-width: 768px) {

	.pc {display: none;}
	.tb {display: inline;}
	
	p {
		font-size: 14px;
	}
	/*==================================================================================
	ヘッダー
	==================================================================================*/
	header {
		background-size: 20px;
	}
	/* 下層ページ ---------------------*/
	header.second .logo {
		width: 100%;
		margin-bottom: 20px;
	}
	header.second .logo img {
		width: 240px;
		margin: 0 auto;
	}
	header.second .hakase_voice {
		width: calc(100% - 80px);
		padding-top: 0;
		padding-right: 80px;
	}
	header.second .hakase_voice .hakase_ilst {
			width: 70px;
			height: 70px;
			background-size: 70px;
			top: -10px;
	}
	header.second .hakase_voice p::after {
		width: 20px;
		height: 10px;
		right: -19px;
	}
	/* みんなのエコアップ ---------------------*/
	header.ecoup {
		padding: 0 0 10px!important;
	}

	/*==================================================================================
	共通
	==================================================================================*/
	/* レイアウト */
	.col3 {
		width: calc(50% - 10px);
	}
	/* フォント */
	.font_12 {
		font-size: 10px;
	}
	.font_14 {
		font-size: 12px;
	}
	.font_18 {
		font-size: 16px;
	}
	.font_24 {
		font-size: 20px;
	}
	.font_28 {
		font-size: 24px;
	}
	/* ホワイトボード */
	.boad {
		padding: 40px;
	}
	.boad.pd30 {
		padding: 20px;
	}
	/* ボタン */
	.btn {
		width: calc(100% - 26px);
		max-width: calc(320px - 26px);
		padding: 15px 10px;
		font-size: 20px;
	}
	.btn.short {
		width: calc(180px - 6px);
		font-size: 18px;
	}
	.btn.thin {
		width: calc(100% - 26px);
		max-width: calc(320px - 26px);
		padding: 10px;
		font-size: 18px;
	}
	.btn.short.thin {
		width: calc(180px - 26px);
		padding: 10px;
		font-size: 18px;
	}
	.btn.circle {
		width: calc(70px - 6px);
		height: calc(70px - 6px);
		font-size: 12px;
	}
	.btn.circle img {
		width: 20px;
		margin-bottom: 8px;
	}

	/* 下層ページ共通 ---------------------------------------------------------*/
	section.bg_blue {
		min-height: calc(100vh - 184px - 120px);
		padding: 0 0 120px!important;
	}
	/* 上部 説明文 */
	section.bg_blue .memo {
		width: calc(100% - 26px);
		max-width: calc(1200px - 26px);
		padding: 10px;
	}
	section.bg_blue .step_ttl img {
		width: 240px;
	}
	/* 下部固定 ボタン */
	.btm_fix {
	    background: none;
	}
	.btm_fix .row {
		justify-content: flex-end;
	}
	.btm_fix .flow {
		display: none;
	}
	.btm_fix .btn_group {
		justify-content: flex-end;
		width: 150px;
	}
	/* 区切り ドット */
	section.bg_blue .dott {
		height: 4px;
		background: url("../img/dott.gif") left center / 12px repeat-x;
	}

	/*==================================================================================
	INDEX
	==================================================================================*/
	section#about {
		padding: 60px 0!important;
		background-size: 20px;
	}
	h2 {
		padding: 15px 10px 8px!important;
		font-size: 24px;
	}
	section#about .boad.frame_green {
		padding: 40px 20px 20px;
	}
	section#about h2 {
		font-size: 18px;
		position: relative;
		top: 0;
		margin-top: -60px;
	}
	section#about h2 span {
		display: block;
		padding: 15px 10px 8px;
		border-radius: 10px;
	}
	section#about .img {
		width: 80px;
		margin: auto;
		order: 2;
	}
	section#about .txt {
		width: 100%;
		margin-bottom: 15px;
	}
	/* エコアップブックって？ ------------------*/
	section#ecobook {
		padding: 60px 0!important;
	}
	section#ecobook .ecoup_guide .ttl {
		padding: 15px 10px 8px;
	}
	section#ecobook .step span {
		padding: 15px 20px 8px;
		border: 4px #00a84d solid;
	}
	/* ２つの参加方法 ------------------*/
	section#howto {
		padding: 60px 0!important;
	}
	h3 {
		border-bottom: 2px #00a84d dashed!important;
	}
	/*==================================================================================
	STEP01
	==================================================================================*/
	section#input_step01 ul.leaf_expo li {
		margin-left: 20px;
		padding-left: 30px;
	}
	section#input_step01 ul.leaf_expo li::before {
		width: 26px;
		height: 26px;
		margin-top: -14px;
	}
	/* 日にち */
	section#input_step01 .day {
	    margin-top: -20px;
		margin-bottom: 10px;
	}
	section#input_step01 .day p {
		margin-left: 17px;
	}
	/* ステップ① 項目 */
	section#input_step01 .item {
		width: calc(100% - 30px);
		padding-left: 30px;
	}
	section#input_step01 .item span {
		width: 24px;
		height: calc(24px - 4px);
		padding-top: 4px;
	}
	/* 葉っぱチェック */
	section#input_step01 .to_do label {
		margin-left: 15px;
	}
	section#input_step01 .to_do label .select_box span.done,
	section#input_step01 .to_do label .select_box span.couldnot {
		width: 26px;
		height: 26px;
		margin: 0 5px;
	}
	section#input_step01 .to_do label span.leaf {
		width: 34px;
		height: 34px;
	}
	/*==================================================================================
	STEP02
	==================================================================================*/
	section#input_step02 ul.check_expo li {
		margin-left: 10px;
		padding-left: 30px;
	}
	section#input_step02 ul.check_expo li::before {
		width: calc(26px - 4px);
		height: calc(26px - 4px);
	}
	section#input_step02 ul.check_expo li::after {
		width: 14px;
		height: 6px;
		border-left: 6px #e0e0e0 solid;
		border-bottom: 6px #e0e0e0 solid;
		left: 5px;
		top: -2px;
	}
	section#input_step02 ul.check_expo li:nth-child(1)::after {
		border-left: 6px #00A271 solid;
		border-bottom: 6px #00A271 solid;
	}

	section#input_step02 label,
	section#challenge.step2 label {
	    height: calc(140px - 50px);
	    padding: 50px 20px 0;
	}
	section#input_step02 label .checkbox,
	section#challenge.step2 label .checkbox {
		width: calc(30px - 4px);
		height: calc(30px - 4px);
	}
	section#input_step02 label .checkbox::before,
	section#challenge.step2 label .checkbox::before {
		width: 18px;
		height: 8px;
		border-left: 6px #e0e0e0 solid;
		border-bottom: 6px #e0e0e0 solid;
		top: 1px;
		left: 3px;
	}
	section#input_step02 label span,
	section#challenge.step2 label span {
		width: 30px;
		height: 30px;
		padding-top: 8px;
	}
	section#input_step02 label span::after,
	section#challenge.step2 label span::after {
		width: 16px;
		height: 16px;
		left: 7px;
		bottom: -7px;
	}
	section#input_step02 label .ilst,
	section#challenge.step2 label .ilst {
	    min-width: calc(260px - 95px);
		padding-left: 95px;
	}
	section#input_step02 label .ilst::before,
	section#challenge.step2 label .ilst::before {
		width: 80px;
		height: 80px;
	}
	/*==================================================================================
	RESULT
	==================================================================================*/
	section#result .result_ttl {
		margin-bottom: -10px;
	}
	section#result .result_ttl img {
		width: 240px;
	}
	section#result .item {
		padding-left: 30px;
	}
	section#result .item span {
		width: 24px;
		height: calc(24px - 5px);
	    padding-top: 4px;
	}
	section#result .score p span {
		font-size: 24px;
	}
	section#result .score.sum p {
		font-size: 20px;
	}
	section#result .score.sum p span {
		font-size: 40px;
	}
	section#result .score.total p {
		font-size: 24px;
	}
	section#result .score.total p span {
		font-size: 60px;
	}
	section#result .score.total .asagao {
		width: 120px;
		height: 120px;
		top: -40px;
		left: -130px;
		transform: none;
	}

	section#result .step2_result label {
		padding: 60px 20px 30px;
	}
	section#result .step2_result label span {
		width: 30px;
		height: 30px;
		padding-top: 8px;
	}
	section#result .step2_result label span::after {
	    width: 16px;
	    height: 16px;
	    left: 7px;
	    bottom: -7px;
	}
	section#result .step2_result label .ilst {
		height: auto;
		padding-left: 95px;
	}
	section#result .step2_result label .ilst::before {
		width: 80px;
		height: 80px;
	}
	section#result .co2  {
		font-size: 40px;
	}
	/*==================================================================================
	RESULT
	==================================================================================*/
	section#result ul.expo {
		position: relative;
		top: 0;
		left: 0;
		width: 120px;
		margin: -10px 0 20px auto;
	}
	/*==================================================================================
	みんなのエコ活動
	==================================================================================*/
	/* 上部 森レイヤー ------------------------------*/
	section#mountain {
		padding: 0 0 18%!important;
	}
	section#mountain .ecoup_ttl img {
		max-width: 460px;
	}
	section#mountain .mountain .bg01,
	section#mountain .mountain .bg02 {
		bottom: 10px;
	}
	/* 合計得点 -------------------------------------*/
	section#ecoup {
		padding: 120px 0 40%!important;
	}
	section#ecoup .total {
		width: calc(100% - 48px);
		max-width: calc(540px - 48px);
		border: 4px #DD335C solid;
	}
	section#ecoup .total .ttl {
		width: 280px;
		top: -40px;
	}
	section#ecoup .total .ttl::before {
		width: calc(100% - 10px - 4px);
		height: calc(100% - 10px - 4px);
		border: 2px #fff solid;
	}
	section#ecoup .total .ttl span {
		font-size: 28px;
	}
	section#ecoup .total .ttl span::before,
	section#ecoup .total .ttl span::after {
		width: 16px;
		height: 16px;
	}
	section#ecoup .total .ttl span::before {
		left: -30px;
	}
	section#ecoup .total .ttl span::after {
		right: -30px;
	}
	section#ecoup .total .score p {
		font-size: 30px;
	}
	section#ecoup .total .score p span {
		font-size: 80px;
	}
	/* ステップ1, ステップ2 */
	section#ecoup .total_step {
		width: calc(100% - 40px);
		max-width: calc(460px - 40px);
		margin: 0 0 40px;
		padding: 50px 20px 20px;
	}
	section#ecoup .total_step .ttl img {
		width: 280px;
	}
	section#ecoup .total_step .score p {
		font-size: 24px;
	}
	section#ecoup .total_step .score p span {
		font-size: 60px;
	}
	/* co2削減量 */
	section#ecoup .co2_cut {
		justify-content: center;
	}
	section#ecoup .co2_cut p:nth-child(2) {
		font-size: 24px;
	}
	section#ecoup .co2_cut p:nth-child(2) span {
		font-size: 80px;
	}
	section#ecoup .hakase_voice {
		padding-left: 0;
		padding-bottom: 70px;
	}
	section#ecoup .hakase_voice .ilst {
		width: 100px;
		height: 100px;
		background-size: 100px;
		left: 20px;
		bottom: -40px;
	}
	section#ecoup .hakase_voice p {
	    padding: 15px 20px 10px;
	    border-radius: 20px;
	}
	section#ecoup .hakase_voice p::after {
		top: auto;
		left: 100px;
		bottom: -22px;
		transform: rotate(-90deg);
	}
	/* 削減量は杉の木の吸収量にするとどれくらい？ */
	section#ecoup .about_cut {
		width: calc(100% - 48px);
		max-width: calc(840px - 48px);
		padding: 20px;
		border: 4px #00A271 solid;
	}
	section#ecoup .about_cut ul.expo {
		width: calc(210px - 25px);
		margin: 30px 0 20px auto;
		padding: 10px 15px 10px 10px;
		border-radius: 5px;
		position: relative;
		top: 0;
		right: 0;
	}
	section#ecoup .about_cut ul.expo li:nth-child(1) {
		padding-left: 60px;
	}
	section#ecoup .about_cut ul.expo li:nth-child(2) {
		padding-left: 30px;
	}
	section#ecoup .about_cut ul.expo li:nth-child(1)::before {
		width: 60px;
		height: 60px;
	}
	section#ecoup .about_cut ul.expo li:nth-child(2)::before {
		width: 35px;
		height: 35px;
	}
	section#ecoup .about_cut p {
		margin-top: -5px;
		padding-right: 0;
	}
	section#ecoup .about_cut p span {
		font-size: 50px;
	}
	section#ecoup .about_cut .tree span {
		margin: 0 10px 10px 0;
	}
	section#ecoup .about_cut .tree span.large {
		width: 100px;
		height: 107px;
	}
	section#ecoup .about_cut .tree span.small {
		width: 40px;
		height: 60px;
	}
	/* CO2 1トンってどのくらい？ */
	section#ecoup .about_1ton {
		width: calc(100% - 8px);
		max-width: calc(840px - 8px);
		border: 4px #FFBD4D solid;
	}
	section#ecoup .about_1ton .ttl {
		white-space: nowrap;
	}
	section#ecoup .about_1ton .ttl + p span {
		font-size: 40px;
	}
	/* 背景 森レイヤー -----------------------------------*/
	section#ecoup .woods .bg01 img {
		min-width: 460px;
	}
	section#ecoup .woods .bg02 img,
	section#ecoup .woods .bg03 img,
	section#ecoup .woods .bg04 img {
		min-width: 460px;
	}
	/*==================================================================================
	みんなのエコ活動 ステップ１
	==================================================================================*/
	section#ecoup.step1 .ttl img {
		max-width: 340px;
	}
	section#ecoup.step1 .ecoup_step1 {
		width: calc(100% / 2 - 10px - 20px);
		margin-bottom: 20px;
		padding: 20px 10px;
	}
	section#ecoup.step1 .ecoup_step1 span.font_18 {
		width: 24px;
		height: calc(24px - 5px);
	}
	section#ecoup.step1 .ecoup_step1 .graf {
		width: 140px;
		height: 140px;
		margin: 0 auto 15px;
	}
	/* 中央 日数 */
	section#ecoup.step1 .ecoup_step1 .graf .day {
		width: 70px;
		height: 70px;
	}
	section#ecoup.step1 .ecoup_step1 .graf p span {
		font-size: 30px;
	}
	/* Let'sチャレンジ --------------------------------------*/
	section#challenge {
		padding: 100px 0 120px!important;
		background-size: 10px;
	}
	section#challenge .boad .hakase_ilst {
		width: 100px;
		height: 100px;
		top: -100px;
	}
	section#challenge .ttl img {
		max-width: 340px;
	}
	section#challenge .col3 .item {
		padding-left: 30px;
	}
	section#challenge .col3 .item span {
		width: 24px;
		height: calc(24px - 5px);
	}
	/* アクション */
	section#challenge .challenge {
		max-width: 200px;
	}
	section#challenge .challenge label.trigger {
		width: calc(80px - 8px);
		height: calc(80px - 8px);
		border: 4px #FF6D50 solid;
	}
	section#challenge .challenge .target {
		width: 140px;
		height: 140px;
	}
	/* アクション後スイッチ */
	section#challenge .challenge input:checked ~ label.trigger {
		width: 80px;
		height: 80px;
		border: none;
		animation: border_non .4s ease-out;
		pointer-events: none;
	}
	@keyframes border_non {
		0% {
			width: calc(80px - 8px);
			height: calc(80px - 8px);
			border: 4px #FF6D50 solid;
		}
		50% {
			width: calc(80px - 8px);
			height: calc(80px - 8px);
			border: 4px #FF6D50 solid;
		}
		100% {
			width: 80px;
			height: 80px;
			border: none;
		}
	}
	section#challenge input#exchange:checked ~ .boad.after_challenge {
		margin-top: -60px;
	}

	/*==================================================================================
	エコアップ行動の方法
	==================================================================================*/
	section#info.bg_blue {
		min-height: calc(100vh - 183px - 20px - 120px);
		padding: 20px 0 120px!important;
	}
	section#info .hakase_voice p {
		width: calc(100% - 46px);
		padding: 15px 20px 10px;
		border-radius: 10px;
		font-size: 16px;
	}
	section#info .hakase_voice p::after {
		width: 10px;
		height: 10px;
		bottom: -8px;
	}
	section#info .hakase_voice .ilst {
		width: 100px;
		height: 100px;
	}
	.ecoup_guide {
		padding: 0 20px 20px;
	}
	.ecoup_guide .ttl {
		padding: 15px 10px 8px;
		top: -30px;
	}
	.ecoup_guide .number {
		padding-left: 32px;
	}
	.ecoup_guide .number span {
		width: 26px;
		height: calc(26px - 2px);
		padding-top: 2px;
	}
	/* 2023.05.17 追記  -----------------------------------------------------------------*/
	section#login .join_free_input {
		padding: 10px;
	}
	/* 小学校の結果ページ 参加賞 ----------------------------*/
	.award {
		padding: 10px 15px 20px;
	}
	.award .img {
		width: 30%;
	}
	.award .txt {
		width: calc(70% - 20px);
	}
	.award a {
		width: calc(100% - 26px);
		max-width: calc(320px - 26px);
		padding: 15px 10px;
		font-size: 20px;
	}

}

@media screen and (max-width: 640px) {
	/* 下層ページ共通 ---------------------------------------------------------*/
	section.bg_blue .step_ttl {
		width: 100%;
		margin-bottom: 10px;
	}
	section.bg_blue .step_ttl img {
		margin: auto;
	}
	/*==================================================================================
	STEP01
	==================================================================================*/
	section#input_step01 ul.leaf_expo {
		width: 100%;
		justify-content: center;
	}
	/*==================================================================================
	STEP02
	==================================================================================*/
	section#input_step02 ul.check_expo {
		width: 100%;
		justify-content: center;
	}
	section#input_step02 label,
	section#challenge.step2 label {
	    width: calc(100% - 40px);
		max-width: 340px;
		height: calc(120px - 30px);
    	padding: 30px 20px 0;
		margin: 0 auto 20px;
	}
	/*==================================================================================
	RESULT
	==================================================================================*/
	section#result .step_ttl {
	    margin-bottom: 20px;
	}
	section#result .step_ttl img {
	    margin: 0;
	}
}

@media screen and (max-width: 460px) {
	.sp {display: inline;}

	/*==================================================================================
	共通
	==================================================================================*/
	/* レイアウト */
	.col3 {
		width: 100%;
	}
	.mb_10 {
		margin-bottom: 8px;
	}
	.mb_20 {
		margin-bottom: 15px;
	}
	.mb_30 {
		margin-bottom: 20px;
	}
	.mb_60 {
		margin-bottom: 40px;
	}
	.mb_120 {
		margin-bottom: 80px;
	}
	/* ホワイトボード */
	.boad {
		padding: 20px;
	}
	.boad.pd30 {
		padding: 20px;
	}
	/*==================================================================================
	INDEX
	==================================================================================*/
	section#index {
		height: calc(100vh - 400px);
		min-height: 480px;
	}
	/*==================================================================================
	STEP01
	==================================================================================*/
	/* 日にち */
	section#input_step01 .day {
	    display: none;
	}
	section#input_step01 .to_do label span.leaf {
		width: 26px;
		height: 26px;
	}
	/*==================================================================================
	RESULT
	==================================================================================*/
	section#result .leaf {
		width: 100%;
		justify-content: flex-start;
		margin-bottom: 10px;
	}
	section#result .leaf .done,
	section#result .leaf .couldnot {
		width: 26px;
		height: 26px;
	}
	section#result .score {
		margin: 0 0 0 auto;
	}

	/*==================================================================================
	RESULT SCHOOL
	==================================================================================*/
	/* step1 ---------------------------------------------------*/
	section#result ul.step1_item li p ruby rt {
		display: none;
	}
	/* step2 ---------------------------------------------------*/
	section#result ul.step2_item li p ruby rt,
	section#ecoup ul.step2_item li p ruby rt {
		display: none;
	}

	/*==================================================================================
	みんなのエコ活動 ステップ１
	==================================================================================*/
	section#ecoup.step1 {
		padding: 40px 0 80px!important;
	}
	section#ecoup.step1 .ttl img {
		max-width: 340px;
	}
	section#ecoup.step1 .ecoup_step1 {
		width: calc(100% - 20px);
		max-width: calc(280px - 20px);
		margin: 0 auto 20px;
	}
	section#ecoup.step1 .ecoup_step1 span.font_18 {
		top: 20px;
		left: 20px;
	}
	section#ecoup.step1 .ecoup_step1 .graf {
		width: 160px;
		height: 160px;
		margin: 0 auto 15px;
	}
	/* 中央 日数 */
	section#ecoup.step1 .ecoup_step1 .graf .day {
		width: 80px;
		height: 80px;
	}
	section#ecoup.step1 .ecoup_step1 .graf p span {
		font-size: 40px;
	}
	/* Let'sチャレンジ --------------------------------------*/
	/* アクション */
	section#challenge .challenge {
		max-width: 240px;
	}
	section#challenge .challenge label.trigger {
		width: calc(120px - 8px);
		height: calc(120px - 8px);
	}
	section#challenge .challenge .target {
		width: 200px;
		height: 200px;
	}
	/* アクション後スイッチ */
	section#challenge .challenge input:checked ~ label.trigger {
		width: 120px;
		height: 120px;
		border: none;
	}
	@keyframes border_non {
		0% {
			width: calc(120px - 8px);
			height: calc(120px - 8px);
			border: 4px #FF6D50 solid;
		}
		50% {
			width: calc(120px - 8px);
			height: calc(120px - 8px);
			border: 4px #FF6D50 solid;
		}
		100% {
			width: 120px;
			height: 120px;
			border: none;
		}
	}
	section#challenge label.btn.red {
	    width: calc(100% - 46px);
	}
	/*==================================================================================
	エコアップ行動の方法
	==================================================================================*/
	.ecoup_guide .ttl {
		font-size: 20px;
	}
	/* 2023.05.17 追記  -----------------------------------------------------------------*/
	/* 小学校の結果ページ 参加賞 ----------------------------*/
	.award .img {
		display: none;
	}
	.award .txt {
		width: 100%;
		margin-bottom: 10px;
	}


}