@charset "utf-8";
/*--京home.css--*/
.home_slider_box{
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 65px;
    border-bottom: 1px solid #ccc;
}

	.home_slider_box > .box_inner{
        width: 100%;
    }


		.home_slider_box > .box_inner .slide_obj{
			width: 100%;
		}

			.home_slider_box > .box_inner .slide_obj a{
				display: block;
                transition: .3s all ease;
			}

			.home_slider_box > .box_inner .slide_obj a:hover{
				filter: brightness(110%);
			}

			.home_slider_box > .box_inner .slide_obj img{
				width: 100%;
				height: auto;
			}

        .slick-dotted.slick-slider{
            margin-bottom: 0 !important;
        }

        .slick-dots{
            bottom: 2.2vw !important;
        }

        .slick-dots li.slick-active button:before{
            color: #03a2dc !important;
        }

.news_box{
	display: flex;
	justify-content: space-between;
	width: 940px;
	margin: 0 auto 66px;
}

	.news_box > .box_header{
		width: 200px;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

		.news_box > .box_header .hdg_bns_wrapper{}

			.news_box > .box_header .hdg_bns_wrapper h2{
				color: #04396d;
				font-weight: bold;
				font-size: 1.4rem;
				background-image: url("../shared/fig_title_br.png");
				background-size: auto 6px;
				background-repeat: no-repeat;
				background-position: left top;
				padding: 1em 0 0 0.8em;
				margin-bottom: 2em;
			}

			.news_box > .box_header .hdg_bns_wrapper .bns_box{
				width: 180px;
				margin: 0 auto;
			}

				.news_box > .box_header .hdg_bns_wrapper .bns_box ul{

				}

					.news_box > .box_header .hdg_bns_wrapper .bns_box ul li{

					}

						.news_box > .box_header .hdg_bns_wrapper .bns_box ul li a{
							display: block;
							transition: .3s all ease;
						}

						.news_box > .box_header .hdg_bns_wrapper .bns_box ul li a:hover{
							opacity: 0.8;
						}

						.news_box > .box_header .hdg_bns_wrapper .bns_box ul li a img{
							max-width: 100%;
							height: auto;
						}

		.news_box > .box_header .more{
			margin-top: 1em;
		}

			.news_box > .box_header .more a{
				display: flex;
				align-items: center;
				justify-content: flex-end;
				background-image: url("../shared/icon_hn_arr2.png");
				background-size: 22px 22px;
				background-repeat: no-repeat;
				background-position: right center;
				height:22px;
				padding-right: 30px;
				color: #111;
				font-size: 0.9rem;
				text-decoration: none;
			}

	.news_box > .box_inner{
		width: 660px;
	}

		.news_box > .box_inner ul{
			
		}

			.news_box > .box_inner ul li{
				border-bottom: 1px solid #ddd;
				padding: 2px 0;
			}

				.news_box > .box_inner ul li a,
				.news_box > .box_inner ul li span.no_detail{
					box-sizing: border-box;
					display: flex;
					padding: 0.9em;
					width: 100%;
					text-decoration: none;
					color: #111;
					transition: .3s all ease;
				}


				.news_box > .box_inner ul li a:hover{
					background: rgba(0,153,217,0.05);
				}

					.news_box > .box_inner ul li .fig{
						width: 85px;
						height: 85px;
						overflow: hidden;
					}

						.news_box > .box_inner ul li .fig img{
							max-width: 100%;
							height: auto;
						}

					.news_box > .box_inner ul li .text{
						box-sizing: border-box;
						width: calc(100% - 85px);
						padding-left: 1em;
						display: flex;
						flex-direction: column;
						justify-content: space-between;
						line-height: 1.4;
					}

						.news_box > .box_inner ul li .text .entry_title{
							width: 100%;
						}

						.news_box > .box_inner ul li .text .entry_meta{
							width: 100%;
							display: flex;
							font-size: 0.84rem;
							line-height: 1.2;
						}

							.news_box > .box_inner ul li .text .entry_meta .entry_media_cat{
								color: #666;
								padding: 0 0.4em 0 0;
								margin: 0 0.4em 0 0;
								border-right: 1px solid #999;
							}

							.news_box > .box_inner ul li .text .entry_meta .entry_date{
								color: #666;
							}

							.news_box > .box_inner ul li .text .entry_meta .entry_info_cat{
								margin-left: 1em;
							}

								.news_box > .box_inner ul li .text .entry_meta .entry_info_cat .lbl_cat{
									background: #ffd13d;
									border-radius: 3px;
									padding: 0 1em 0.1em;
									font-size: 0.9em;
								}

	.news_box > .box_footer{
		display: none;
	}

.project_box{
	background-image: url("../shared/home/bg_home_project.jpg");
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: cover;
	padding: 60px 0 34px;
}

	.project_box > .box_header{
		display: flex;
		justify-content: center;
		margin-bottom: 30px;
	}

		.project_box > .box_header h2{
			width: 580px;
		}

			.project_box > .box_header h2 img{
				max-width: 100%;
				height: auto;
			}

	.project_box > .box_inner{
		margin-bottom: 38px;
	}

		.project_box > .box_inner p{
			font-weight: bold;
			color: #fff;
			text-align: center;
			line-height: 1.8;
			font-size: 0.92rem;
		}

	.project_box > .box_footer{
		display: flex;
		justify-content: center;
	}

		.project_box > .box_footer a{
			box-sizing: border-box;
			display: flex;
			align-items: center;
			height: 40px;
			border-radius: 20px;
			color: #0a3963;
			text-decoration: none;
			font-weight: bold;
			font-size: 1.1rem;
			padding: 0 2.2em 0.1em 1.5em;
			background-color: #fff;
			background-image: url("../shared/icon_hn_arr2.png");
			background-size: 22px 22px;
			background-repeat: no-repeat;
			background-position: right 9px top 9px;
			transition: .3s all ease;
		}

		.project_box > .box_footer a:hover{
			background-color: #fffae6;
			box-shadow: 0 0 3px 3px rgba(0,0,0,0.2);
		}

.content_nav_box{
	background: #fffae6;
	padding: 66px 0 60px;
}

	.content_nav_box > .box_inner{}

		.content_nav_box > .box_inner ul{
			display: flex;
			justify-content: center;
		}

			.content_nav_box > .box_inner ul li{
				margin: 0 30px 0 0;
			}

			.content_nav_box > .box_inner ul li:last-child{
				margin: 0;
			}

				.content_nav_box > .box_inner ul li a{
					display: flex;
					flex-direction: column;
					width: 300px;
					color: #111;
					text-decoration: none;
				}

					.content_nav_box > .box_inner ul li a .fig{
						display: block;
						border-radius: 10px;
						overflow: hidden;
						box-shadow: 0 0 2px 1px rgba(0,0,0,0.1);
						margin-bottom: 1em;
                        max-height: 200px;
					}

						.content_nav_box > .box_inner ul li a .fig img{
							max-width: 100%;
							height: auto;
							transition: .4s all ease;
						}

						.content_nav_box > .box_inner ul li a:hover .fig img{
							transform: scale(1.1,1.1);
							opacity: 0.8;
						}


					.content_nav_box > .box_inner ul li a dl{
						line-height: 1.6;
						padding: 0 0.4em;
						display: flex;
						flex-direction: column;
						align-items: flex-start;
					}

						.content_nav_box > .box_inner ul li a dl dt{
							color: #0a3963;
							font-weight: bold;
							font-size: 1.24rem;
							margin-bottom: 0.3em;
							padding-right: 30px;
							background-image: url("../shared/icon_hn_arr2.png");
							background-size: 22px 22px;
							background-position: right 1px top 0.22em;
							background-repeat: no-repeat;
						}

						.tablet .content_nav_box > .box_inner ul li a dl dt{
							font-size: 1.05rem;
						}

						.content_nav_box > .box_inner ul li.cn_np_special a dl dt{
							display: flex;
						}

							.content_nav_box > .box_inner ul li.cn_np_special a dl dt .lbl1{
								font-size: 0.68em;
								line-height: 1.2;
								text-align: center;
								margin-right: 0.8em;
							}

							.content_nav_box > .box_inner ul li.cn_np_special a dl dt .lbl2{
								
							}

						.content_nav_box > .box_inner ul li a dl dd{
							font-size: 0.92rem;
							max-width: 100%;
						}

	.content_nav_box > .box_footer{
		display: flex;
		justify-content: center;
	}

		.content_nav_box > .box_footer ul{
			width: 820px;
			display: flex;
			flex-wrap: wrap;
		}

			.content_nav_box > .box_footer ul li{
				margin: 0 20px 20px 0;
			}

			.content_nav_box > .box_footer ul li:nth-child(even){
				margin: 0 0 20px 0;
			}

				.content_nav_box > .box_footer ul li a{
					box-sizing: border-box;
					display: flex;
					justify-content: center;
					align-items: center;
					width: 400px;
					height: 60px;
					border-radius: 30px;
					background: #fff;
					box-shadow: 0 0 2px 1px rgba(0,0,0,0.1);
					color: #0a3963;
					font-size: 1.1rem;
					text-decoration: none;
					font-weight: bold;
					transition: .3s all ease;
				}

				.content_nav_box > .box_footer ul li a:hover{
					background: #d8f4ff;
				}

					.content_nav_box > .box_footer ul li a .fig{
						height: 22px;
						margin-right: 10px;
					}

						.content_nav_box > .box_footer ul li a .fig img{
							height: 100%;
							width: auto;
						}

.supporter_box{
	padding: 68px 0 80px;
    position: relative;
}

	.supporter_box > .box_header{
		display: flex;
		justify-content: center;
		margin-bottom: 80px;
	}

		.supporter_box > .box_header h2{
			width: 700px;
		}

			.supporter_box > .box_header h2 a{
				display: block;
				background: #fff;
				transition: .3s all ease;
				border-radius: 10px;
			}

			.supporter_box > .box_header h2 a:hover{
				box-shadow: 0 0 5px 2px rgba(0,0,0,0.2);
			}

				.supporter_box > .box_header h2 a img{
					max-width: 100%;
					height: auto;
					transition: .3s all ease;
				}

				.supporter_box > .box_header h2 a:hover img{
					filter: contrast(1.2);
				}

	.supporter_box > .box_inner{}

		.supporter_box > .box_inner .supporter_group{
            position: relative;
		}

			.supporter_box > .box_inner .supporter_group h3{
				color: #04396d;
				font-weight: bold;
				font-size: 1.3rem;
				background-image: url(../shared/fig_title_br.png);
				background-size: auto 6px;
				background-repeat: no-repeat;
				background-position: center top;
				padding: 1em 0 0 0;
				margin-bottom: 2em;
				text-align: center;
			}

			.supporter_box > .box_inner .supporter_group ul{
				display: flex;
				flex-wrap: wrap;
				margin: 0 auto;
			}

				.supporter_box > .box_inner .supporter_group ul li{
				}

				.supporter_box > .box_inner .supporter_group ul li a{
					text-decoration: none;
					display: block;
					transition: .3s all ease;
				}

				.supporter_box > .box_inner .supporter_group ul li a:hover{
					box-shadow: 0 0 5px 2px rgba(10,57,99,0.1);
				}

					.supporter_box > .box_inner .supporter_group ul li a img{
						max-width: 100%;
						height: auto;
						transition: .3s all ease;
					}

					.supporter_box > .box_inner .supporter_group ul li a:hover img{
						opacity: 0.8;
					}

				/*プレミアム*/
				.supporter_box > .box_inner .supporter_group.grp_premium{
					margin-bottom: 2em;
				}

					.supporter_box > .box_inner .supporter_group.grp_premium ul{
						width: 820px;
					}

				.supporter_box > .box_inner .supporter_group.grp_premium ul li{
					margin: 0 40px 40px 0;
				}

				.supporter_box > .box_inner .supporter_group.grp_premium ul li:nth-child(even){
					margin: 0 0 40px 0;
				}

					.supporter_box > .box_inner .supporter_group.grp_premium ul li a{
						width: 390px;
					}


				/*アドバンス*/
				.supporter_box > .box_inner .supporter_group.grp_advance{
					margin-bottom: 4em;
				}

				.supporter_box > .box_inner .supporter_group.grp_advance ul{
					width: 850px;
				}

				.supporter_box > .box_inner .supporter_group.grp_advance ul li{
					margin: 0 20px 20px 0;
				}

				.supporter_box > .box_inner .supporter_group.grp_advance ul li:nth-child(3n){
					margin: 0 0 20px 0;
				}

					.supporter_box > .box_inner .supporter_group.grp_advance ul li a{
						width: 270px;
					}

				/*スタンダード*/
				.supporter_box > .box_inner .supporter_group.grp_standard{}

					.supporter_box > .box_inner .supporter_group.grp_standard ul{
						width: 854px;
					}

						.supporter_box > .box_inner .supporter_group.grp_standard ul li{
							margin: 0 18px 18px 0;
						}

						.supporter_box > .box_inner .supporter_group.grp_standard ul li:nth-child(4n){
							margin: 0 0 18px 0;
						}

							.supporter_box > .box_inner .supporter_group.grp_standard ul li a{
								width: 200px;
							}

.contact_box{
	background: #fffae6;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 68px 0 0 0;
}

	.contact_box > .box_header{
		margin-bottom: 2em;
	}

		.contact_box > .box_header h2{
			color: #04396d;
			font-weight: bold;
			font-size: 1.4rem;
		}

	.contact_box > .box_inner{
		line-height: 1.8;
		text-align: center;
	}

		.contact_box > .box_inner p{
			font-size: 0.94rem;
			margin-bottom: 1.5em;
		}

		.contact_box > .box_inner a{
			color: #04396d;
			transition: .3s all ease;
		}

		.contact_box > .box_inner a:hover{
			opacity: 0.8;
		}

			.contact_box > .box_inner dl{
				display: flex;
				justify-content: center;
				font-size: 1.1rem;
				font-weight: bold;
				color: #04396d;
			}

				.contact_box > .box_inner dl dt{
					margin-right: 1.5em;
				}

/*202204改修追加*/
.main_contents_box{
    position: relative;
    padding-top: 90px;
}

    .main_contents_box:before{
        content: "";
        display: block;
        background-image: url("../shared/home/bg_mcw.png");
        background-size: 2200px 720px;
        background-position: center top;
        background-repeat: no-repeat;
        width: 100%;
        height: 720px;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
    }

    .main_contents_box:after{
        content: "";
        display: block;
        background-color: #e0f3fc;
        width: 100%;
        height: 420px;
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 0;
    }

    .main_contents_box > .box_inner{
        position: relative;
        z-index: 2;
        background-image: url("../shared/home/bg_mc_illust.png");
        background-size: 2200px 830px;
        background-repeat: no-repeat;
        background-position: center top;
        height: 1050px;
        padding: 0 0 0 0;
    }

        .main_contents_box > .box_inner .style1{}

            .main_contents_box > .box_inner .style1 a{
                display: block;
                color: #111;
                text-decoration: none;
            }

                .main_contents_box > .box_inner .style1 a dl{}

                    .main_contents_box > .box_inner .style1 a dl dt{
                        margin-bottom: 1rem;
                        position: relative;
                        overflow: hidden;
                    }

                        .main_contents_box > .box_inner .style1 a dl dt:before{
                            content: "";
                            display: block;
                            width: 1rem;
                            height: 100%;
                            background: rgba(255,255,255,0);
                            transform: skewX(-45deg);
                            transform-origin: left top;
                            position: absolute;
                            top: 0;
                            left: 0;
                            z-index: 2;
                            transition: .5s all ease;
                        }

                        .main_contents_box > .box_inner .style1 a:hover dl dt:before{
                            animation-name: style1anim;
                            animation-fill-mode:backwards;
                            animation-duration:.3s;
                            animation-timing-function:ease;
                            animation-direction:normal;
                        }

                        @keyframes style1anim{
                          0% {
                            opacity: 0;
                            left:-5rem;
                          }
                            
                          50% {
                            opacity: 1;
                            transform: scaleX(2);
                            left:50%;
                          }

                          100% {
                            opacity: 0;
                            transform: scaleX(1);
                            left:200%;
                          }
                        }

                        .main_contents_box > .box_inner .style1 a dl dt img{
                            max-width: 100%;
                            height: auto;
                            position: relative;
                            z-index: 1;
                            transition: .3s all ease;
                        }

                        .main_contents_box > .box_inner .style1 a:hover dl dt img{
                            filter: contrast(120%);
                        }

                    .main_contents_box > .box_inner .style1 a dl dd{}

                        .main_contents_box > .box_inner .style1 a dl dd p{
                            font-size: 0.94rem;
                            line-height: 1.7;
                            margin-bottom: 1rem;
                        }

                        .main_contents_box > .box_inner .style1 a dl dd .goto_detail{
                            width: 170px;
                            height: 40px;
                            background-color: #fff;
                            background-image: url("../shared/icon_hn_arr2.png");
                            background-size: 22px 22px;
                            background-position: right 9px top 9px;
                            background-repeat: no-repeat;
                            border-radius: 20px;
                            display: flex;
                            justify-content: center;
                            align-items: center;
                            color: #073a67;
                            font-size: 0.92rem;
                            box-shadow: 0 0 3px 0 rgba(0,0,0,0.1);
                            transition: .3s all ease;
                        }

                        .main_contents_box > .box_inner .style1 a:hover dl dd .goto_detail{
                            background-color: #073a67;
                            color: #fff;
                        }


        .main_contents_box > .box_inner .style1.msn_kurashi{
            background-image: url("../shared/home/img_mc_kurashi.png");
            background-size: 195px auto;
            background-repeat: no-repeat;
            background-position: right top;
            width: 510px;
            padding-top: 18px;
            position: absolute;
            top: 0;
            left: calc(50% - 340px);
        }

            .main_contents_box > .box_inner .style1.msn_kurashi a dl dt{
                width: 312px;
            }

            .main_contents_box > .box_inner .style1.msn_kurashi a dl dd{
                width: 312px;
            }

            .main_contents_box > .box_inner .style1.msn_our_sdgs a dl dt{
                width: 388px;
            }

        .main_contents_box > .box_inner .style1.msn_our_sdgs{
            width: 410px;
            position: absolute;
            top: 360px;
            right: calc(50% - 420px);
        }

        .main_contents_box > .box_inner .style2{}

            .main_contents_box > .box_inner .style2 a{
                display: block;
            }

                .main_contents_box > .box_inner .style2 a img{
                    max-width: 100%;
                    height: auto;
                    transition: .3s all ease;
                }

                .main_contents_box > .box_inner .style2 a:hover img{
                    filter: contrast(130%);
                    transform: scale(1.05);
                }

        .main_contents_box > .box_inner .style2.msn_what{
            width: 260px;
            position: absolute;
            top: 630px;
            left: calc(50% - 390px);
        }

        .main_contents_box > .box_inner .style2.msn_lecture{
            width: 276px;
            position: absolute;
            top: 836px;
            left: calc(50% - 460px);
        }

        .main_contents_box > .box_inner .style3{}

            .main_contents_box > .box_inner .style3 a{
                display: block;
                position: relative;
            }

            .main_contents_box > .box_inner .style3 a:before{
                content: "";
                display: block;
                width: 280px;
                height: 280px;
                background: #fff;
                border-radius: 140px;
                position: absolute;
                bottom: -14px;
                left: calc(50% - 140px);
                transition: .3s all ease;
            }

            .main_contents_box > .box_inner .style3 a:hover:before{
                transform: scale(1.1);
            }

            .main_contents_box > .box_inner .style3 a dl{
                display: flex;
                flex-direction: column-reverse;
                position: relative;
                z-index: 2;
            }

                .main_contents_box > .box_inner .style3 a dl img{
                    max-width: 100%;
                    height: auto;
                    transition: .3s all ease;
                }

                .main_contents_box > .box_inner .style3 a:hover dl img{
                    filter: brightness(110%);
                }

                .main_contents_box > .box_inner .style3 a dl dt{
                }

                .main_contents_box > .box_inner .style3 a dl dd{
                    margin-bottom: 0.5rem;
                }

        .main_contents_box > .box_inner .style3.msn_learn{
            width: 200px;
            position: absolute;
            top: 670px;
            right: calc(50% - 90px);
        }

            .main_contents_box > .box_inner .style3.msn_learn a dl dt{
                width: 154px;
            }

            .main_contents_box > .box_inner .style3.msn_learn a dl dd{
                width: 200px;
            }

        .main_contents_box > .box_inner .style3.msn_join{
            width: 240px;
            position: absolute;
            top: 656px;
            right: calc(50% - 450px);
        }

            .main_contents_box > .box_inner .style3.msn_join a dl dt{
                width: 228px;
            }

            .main_contents_box > .box_inner .style3.msn_join a dl dd{
                width: 240px;
            }

.mid_contents_box{}

    .mid_contents_box > .box_inner{
        display: flex;
        justify-content: center;
        background-image:
            url("../shared/home/bg_md1.png"),
            url("../shared/home/bg_md2.png"),
            url("../shared/home/bg_md3.png"),
            url("../shared/home/bg_md4.png");
        background-repeat:
            no-repeat,
            no-repeat,
            no-repeat,
            no-repeat;
        background-size:
            241px auto,
            443px auto,
            136px auto,
            66px auto;
        background-position:
            right calc(50% - 466px) top 1.2rem,
            left calc(50% - 422px) bottom 1rem,
            right calc(50% - 480px) bottom 0.3rem,
            left calc(50% - 60px) bottom 0.2rem;
        padding: 2rem 0 2.6rem;
    }


        .mid_contents_box > .box_inner ul{
            box-sizing: border-box;
            display: flex;
            justify-content: flex-end;
            width: 1100px;
            padding-right: 60px;
        }

            .mid_contents_box > .box_inner ul li{}

                .mid_contents_box > .box_inner ul li a{
                    display: block;
                }

                .mid_contents_box > .box_inner ul li a img{
                    height: 224px;
                    width: auto;
                    transition: .3s all ease;
                }

                .mid_contents_box > .box_inner ul li a:hover img{
                    filter: contrast(130%);
                }

/*supporter_boxのイラスト*/
.supporter_box .cmn_illust{
    position: absolute;
}

    .supporter_box .cmn_illust img{
        max-width: 100%;
        height: auto;
    }

    .supporter_box .cmn_illust.illust01{
        width: 156px;
        top: -110px;
        left: calc(50% - 500px);
    }

    .supporter_box .cmn_illust.illust02{
        width: 137px;
        top: -80px;
        right: calc(50% - 500px);
    }

    .supporter_box .cmn_illust.illust03{
        width: 169px;
        top: -10px;
        left: calc(50% - 460px);
    }

    .supporter_box .cmn_illust.illust04{
        width: 77px;
        top: -20px;
        right: calc(50% - 500px);
    }

    .supporter_box .cmn_illust.illust05{
        width: 104px;
        top: -64px;
        left: calc(50% - 536px);
    }

    .supporter_box .cmn_illust.illust06{
        width: 115px;
        top: -60px;
        right: calc(50% - 530px);
    }

.sns_contact_wrapper{
    background: #fffae6;
    padding: 150px 0 60px 0;
    position: relative;
}

.sns_box{}

    .sns_box > .box_inner{
        display: flex;
        justify-content: center;
    }

        .sns_box > .box_inner .twitter_box{
            margin-right: 50px;
        }

        .sns_box > .box_inner .embed_box{
            width: 400px;
            background: #fff;
            display: flex;
            flex-direction: column;
            align-items: center;
            border-top: 4px solid #009fe8;
        }

            .sns_box > .box_inner .embed_box > dt{
                padding: 1.2rem 0 1rem;
            }

                .sns_box > .box_inner .embed_box > dt img{
                    height: 24px;
                    width: auto;
                }

            .sns_box > .box_inner .embed_box > dd{
                box-sizing: border-box;
                width: 100%;
                padding: 0 10px 10px;
            }

    .sns_contact_wrapper .cmn_illust{
        position: absolute;
    }

        .sns_contact_wrapper .cmn_illust img{
            max-width: 100%;
            height: auto;
        }


        .sns_contact_wrapper .cmn_illust.illust07{
            width: 42px;
            top: 130px;
            left: calc(50% - 520px);
        }

        .sns_contact_wrapper .cmn_illust.illust08{
            width: 194px;
            top: 30px;
            right: calc(50% - 194px);
        }

        .sns_contact_wrapper .cmn_illust.illust09{
            width: 60px;
            top: 330px;
            right: calc(50% - 520px);
        }

        .sns_contact_wrapper .cmn_illust.illust09{
            width: 60px;
            top: 330px;
            right: calc(50% - 520px);
        }

/*あとで
        .sns_contact_wrapper .cmn_illust.illust10{
            width: 60px;
            top: 330px;
            right: calc(50% - 520px);
        }

        .sns_contact_wrapper .cmn_illust.illust11{
            width: 60px;
            top: 330px;
            right: calc(50% - 520px);
        }

        .sns_contact_wrapper .cmn_illust.illust12{
            width: 60px;
            top: 330px;
            right: calc(50% - 520px);
        }

        .sns_contact_wrapper .cmn_illust.illust13{
            width: 60px;
            top: 330px;
            right: calc(50% - 520px);
        }
*/




@media screen and (min-width:1px) and (max-width:1400px) {

}

@media screen and (min-width:1px) and (max-width:1024px) {
}


@media screen and (min-width:1px) and (max-width:768px) {

}

/* ##########SP########## */
@media screen and (min-width:1px) and (max-width:479px) {
	.home_slider_box{
		margin-bottom: 2em;
	}

        .slick-dots {
            bottom: 0.2vw !important;
        }

	.news_box{
		justify-content: flex-start;
		flex-direction: column;
		width: auto;
		margin: 0 auto 2em;
	}

		.news_box > .box_header{
			width: 100%;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
		}

			.news_box > .box_header .hdg_bns_wrapper{}

				.news_box > .box_header .hdg_bns_wrapper h2{
					font-size: 1.2rem;
					background-size: auto 1vw;
					background-position: center top;
					padding: 0.6em 0 0 0;
					margin-bottom: 1em;
					text-align: center;
				}

				.news_box > .box_header .hdg_bns_wrapper .bns_box{
					display: none;
				}

			.news_box > .box_header .more{
				display: none;
			}

		.news_box > .box_inner{
			box-sizing: border-box;
			width: 100%;
			padding: 0 3vw;
		}

			.news_box > .box_inner ul li a{
				padding: 2vw;
			}

				.news_box > .box_inner ul li .fig{
					width: 20vw;
					height: 20vw;
				}

					.news_box > .box_inner ul li .text{
						width: calc(100% - 20vw);
						padding-left: 1em;
					}

						.news_box > .box_inner ul li .text .entry_meta{
							font-size: 0.7rem;
						}
	
		.news_box > .box_footer{
			display: block;
			margin-top: 1em;
		}
	
			.news_box > .box_footer .more{
				display: flex;
				justify-content: center;
			}

				.news_box > .box_footer .more a{
					display: flex;
					align-items: center;
					justify-content: flex-end;
					background-image: url("../shared/icon_hn_arr2.png");
					background-size: 5vw 5vw;
					background-repeat: no-repeat;
					background-position: right center;
					height:5vw;
					padding-right: 7vw;
					color: #111;
					font-size: 0.86rem;
					text-decoration: none;
				}
	
		.news_box > .box_footer .bns_box_for_sp{
			padding: 0 5vw;
			margin-top: 1.5em;
		}
	
			.news_box > .box_footer .bns_box_for_sp ul{
				display: flex;
				justify-content: center;
			}
	
				.news_box > .box_footer .bns_box_for_sp ul li{
					width: calc((100% - 2vw) / 2);
					margin: 0 2vw 2vw 0;
				}
	
				.news_box > .box_footer .bns_box_for_sp ul li:nth-child(even),
				.news_box > .box_footer .bns_box_for_sp ul li:last-child{
					margin: 0 0 2vw 0;
				}
	
					.news_box > .box_footer .bns_box_for_sp ul li a{
						display: block;
					}
	
					.news_box > .box_footer .bns_box_for_sp ul li a img{
						max-width: 100%;
						height: auto;
					}

	.project_box{
		padding: 3em 0 2em;
	}

		.project_box > .box_header{
			margin-bottom: 1em;
		}

			.project_box > .box_header h2{
				width: 80%;
			}

		.project_box > .box_inner{
			margin-bottom: 1.2em;
		}

			.project_box > .box_inner p{
				line-height: 1.6;
				font-size: 0.8rem;
			}

			.project_box > .box_footer a{
				height: 9vw;
				border-radius: 4.5vw;
				font-size: 0.88rem;
				padding: 0 2.4em 0.1em 1em;
				background-size: 5vw 5vw;
				background-position: right 2vw top 2vw;
			}

	.content_nav_box{
		padding: 3em 4vw 2em;
	}

			.content_nav_box > .box_inner ul{
				flex-direction: column;
				justify-content: flex-start;
			}

				.content_nav_box > .box_inner ul li{
					margin: 0 0 1.4em 0;
				}

					.content_nav_box > .box_inner ul li a{
						flex-direction: row;
						align-items: flex-start;
						width: 100%;
					}

						.content_nav_box > .box_inner ul li a .fig{
							width: 40vw;
							border-radius: 1vw;
							margin-bottom: 0;
						}

						.content_nav_box > .box_inner ul li a dl{
							width: calc(100% - 40vw);
							line-height: 1.4;
							padding: 0 0 0 4vw;
						}

							.content_nav_box > .box_inner ul li a dl dt{
								font-size: 1.1rem;
								padding-right: 7vw;
								background-size: 5vw 5vw;
							}
	
							.content_nav_box > .box_inner ul li.cn_np_special a dl dt{
								flex-direction: column;
								align-items: flex-start;
								background-position: right 1px bottom 0.1em;
							}

								.content_nav_box > .box_inner ul li.cn_np_special a dl dt .lbl1{
									font-size: 0.7em;
									text-align: left;
									margin-right: 0;
									margin-bottom: 0.2em;
								}
	
									.content_nav_box > .box_inner ul li.cn_np_special a dl dt .lbl1 br{
										display: none;
									}

						.content_nav_box > .box_inner ul li a dl dd{
							font-size: 0.92rem;
						}

							.content_nav_box > .box_inner ul li a dl dd{
								font-size: 0.86rem;
							}

		.content_nav_box > .box_footer{
			padding: 0 3vw;
		}

			.content_nav_box > .box_footer ul{
				width: 100%;
				flex-direction: column;
			}

				.content_nav_box > .box_footer ul li{
					margin: 0 0 1em 0;
				}

				.content_nav_box > .box_footer ul li:nth-child(even){
					margin: 0 0 1em 0;
				}

					.content_nav_box > .box_footer ul li a{
						width: 100%;
						height: 10vw;
						border-radius: 5vw;
						font-size: 0.96rem;
					}

						.content_nav_box > .box_footer ul li a .fig{
							height: 4.6vw;
							margin-right: 2vw;
						}

	.supporter_box{
		padding: 2em 0 3em;
	}

		.supporter_box > .box_header{
			margin-bottom: 2em;
		}

			.supporter_box > .box_header h2{
				width: 80%;
			}

			.supporter_box > .box_inner .supporter_group.grp_advance{
				margin-bottom: 2.2em;
			}

				.supporter_box > .box_inner .supporter_group h3{
					font-size: 1.1rem;
					background-size: auto 1vw;
					padding: 0.7em 0 0 0;
					margin-bottom: 1em;
				}
	
				.supporter_box > .box_inner .supporter_group ul{
					box-sizing: border-box;
				}
	
				.supporter_box > .box_inner .supporter_group.grp_premium ul,
				.supporter_box > .box_inner .supporter_group.grp_advance ul,
				.supporter_box > .box_inner .supporter_group.grp_standard ul{
					width: 100%;
					padding: 0 5vw;
				}
	
					.supporter_box > .box_inner .supporter_group.grp_premium ul li a,
					.supporter_box > .box_inner .supporter_group.grp_advance ul li a,
					.supporter_box > .box_inner .supporter_group.grp_standard ul li a{
						width: 100%;
					}
	
					.supporter_box > .box_inner .supporter_group.grp_premium ul li{
						width: calc((100% - 4vw) / 2);
						margin: 0 4vw 4vw 0;
					}
	
					.supporter_box > .box_inner .supporter_group.grp_premium ul li:nth-child(even){
						margin: 0 0 4vw 0;
					}
	
					.supporter_box > .box_inner .supporter_group.grp_advance ul li{
						width: calc((100% - 3vw) / 3);
						margin: 0 1.5vw 1.5vw 0;
					}
	
					.supporter_box > .box_inner .supporter_group.grp_advance ul li:nth-child(3n){
						margin: 0 0 1.5vw 0;
					}
	
					.supporter_box > .box_inner .supporter_group.grp_standard ul li{
						width: calc((100% - 3vw) / 4);
						margin: 0 1vw 1vw 0;
					}
	
					.supporter_box > .box_inner .supporter_group.grp_standard ul li:nth-child(4n){
						margin: 0 0 1vw 0;
					}
	



	.contact_box{
		padding: 2em 0 2.2em;
	}

		.contact_box > .box_header{
			margin-bottom: 1em;
		}

			.contact_box > .box_header h2{
				font-size: 1.2rem;
			}

		.contact_box > .box_inner{
			line-height: 1.6;
		}

			.contact_box > .box_inner p{
				font-size: 0.8rem;
			}

				.contact_box > .box_inner dl{
					flex-direction: column;
					align-items: center;
					font-size: 0.9rem;
				}

					.contact_box > .box_inner dl dt{
						margin-right: 0;
						margin-bottom: 0.3em;
					}
    
    /*202204改修追加*/
    .main_contents_box{
        padding-top: 6vw;
    }

        .main_contents_box:before{
            content: "";
            display: block;
            background-image: url("../shared/home/bg_mcw.png");
            background-size: 300vw calc(300vw / 2200 * 720);
            height: calc(300vw / 2200 * 720);
        }

        .main_contents_box:after{
            height: calc(100% - 10vw);
        }

        .main_contents_box > .box_inner{
            background-size: 320vw auto;
            height: 186vw;
        }

            .main_contents_box > .box_inner .style1{}

                .main_contents_box > .box_inner .style1 a dl dt{
                    margin-bottom: 0.5rem;
                }

                .main_contents_box > .box_inner .style1 a dl dd{}

                    .main_contents_box > .box_inner .style1 a dl dd p{
                        font-size: 0.76rem;
                        line-height: 1.3;
                        margin-bottom: 0.5rem;
                    }

                        .main_contents_box > .box_inner .style1 a dl dd p br{
                            display: none;
                        }

                        .main_contents_box > .box_inner .style1 a dl dd .goto_detail{
                            width: 28vw;
                            height: 6vw;
                            background-size: 3vw 3vw;
                            background-position: right 1.5vw top 1.5vw;
                            border-radius: 3vw;
                            font-size: 0.74rem;
                        }

            .main_contents_box > .box_inner .style1.msn_kurashi{
                background-size: 22vw auto;
                width: 62vw;
                padding-top: 1vw;
                left: 6vw;
                top: 1vw;
            }

                .main_contents_box > .box_inner .style1.msn_kurashi a dl dt{
                    width: 42vw;
                }

                .main_contents_box > .box_inner .style1.msn_kurashi a dl dd{
                    width: 42vw;
                }

            .main_contents_box > .box_inner .style1.msn_our_sdgs{
                width: calc(38vw / 312 * 410);
                top: 51vw;
                right: 5vw;
            }
    
                .main_contents_box > .box_inner .style1.msn_our_sdgs a dl dt{
                    width: calc(38vw / 312 * 410);
                }

            .main_contents_box > .box_inner .style2{}

            .main_contents_box > .box_inner .style2.msn_what{
                width: 40vw;
                top: 90vw;
                left: 6vw;
            }

            .main_contents_box > .box_inner .style2.msn_lecture{
                width: calc(40vw / 260 * 276);
                top: 91vw;
                left: auto;
                right: 7vw;
            }

            .main_contents_box > .box_inner .style3{}

                .main_contents_box > .box_inner .style3 a:before{
                    width: 42vw;
                    height: 42vw;
                    border-radius: 21vw;
                    bottom: -2vw;
                    left: calc(50% - 21vw);
                }

            .main_contents_box > .box_inner .style3.msn_learn{
                width: 32vw;
                top: 126vw;
                right: auto;
                left: 10vw;
            }

                .main_contents_box > .box_inner .style3.msn_learn a dl dt{
                    width: calc(32vw / 200 * 154);
                }

                .main_contents_box > .box_inner .style3.msn_learn a dl dd{
                        width: 32vw;
                }

            .main_contents_box > .box_inner .style3.msn_join{
                width: calc(32vw / 200 * 240);
                top: 124vw;
                right: 7vw;
            }

                .main_contents_box > .box_inner .style3.msn_join a dl dt{
                    width: calc(32vw / 200 * 228);
                }

                .main_contents_box > .box_inner .style3.msn_join a dl dd{
                    width: calc(32vw / 200 * 240);
                }

    .mid_contents_box{}

        .mid_contents_box > .box_inner{
            background-size:
                28vw auto,
                40vw auto,
                20vw auto,
                10vw auto;
            background-position:
                right 1vw top 2vw,
                left -12vw bottom 3vw,
                right 0 bottom 0.5vw,
                left 48vw bottom 0.5vw;
            padding: 1.6rem 0 1.4rem;
        }


            .mid_contents_box > .box_inner ul{
                width: 100%;
                padding-right: 1vw;
            }

                .mid_contents_box > .box_inner ul li a img{
                    height: 22vw;
                }


    /*supporter_boxのイラスト*/
    .supporter_box .cmn_illust{}

        .supporter_box .cmn_illust.illust01{
            width: 14vw;
            top: -6vw;
            left: 2vw;
        }

        .supporter_box .cmn_illust.illust02{
            width: calc(14vw / 156 * 137);
            top: -4vw;
            right: 2vw;
        }

        .supporter_box .cmn_illust.illust03{
            width: calc(14vw / 156 * 169);
            top: 0;
            left: 3vw;
        }

        .supporter_box .cmn_illust.illust04{
            width: calc(14vw / 156 * 77);
            top: 0;
            right: 3vw;
        }

        .supporter_box .cmn_illust.illust05{
            width: calc(14vw / 156 * 104);
            top: -2vw;
            left: auto;
            right: 3vw;
        }

        .supporter_box .cmn_illust.illust06{
            width: calc(14vw / 156 * 115);
            top: -2vw;
            left: 3vw;
        }

    .sns_contact_wrapper{
        padding: 12vw 8vw 10vw;
    }

    .sns_box{}

        .sns_box > .box_inner{
            flex-direction: column;
        }

            .sns_box > .box_inner .twitter_box{
                margin-right: 0;
                margin-bottom: 2rem;
            }

            .sns_box > .box_inner .embed_box{
                width: 100%;
                border-top: 3px solid #009fe8;
            }

                .sns_box > .box_inner .embed_box > dt{
                    padding: 0.7rem 0 0.7rem;
                }

                    .sns_box > .box_inner .embed_box > dt img{
                        height: 5vw;
                    }

                .sns_box > .box_inner .embed_box > dd{
                    padding: 0 3vw 3vw;
                    height: 83vw;
                }
    
                    .sns_box > .box_inner .embed_box > dd iframe{
                        height: 80vw !important;
                    }

        .sns_contact_wrapper .cmn_illust{
        }


            .sns_contact_wrapper .cmn_illust.illust07{
                width: calc(14vw / 156 * 42);
                top: 2vw;
                left: 3vw;
            }

            .sns_contact_wrapper .cmn_illust.illust08{
                width: calc(14vw / 156 * 194);
                top: 1vw;
                right: calc(50% - 3vw);
            }

            .sns_contact_wrapper .cmn_illust.illust09{
                width: calc(14vw / 156 * 60);
                top: 106vw;
                right: 2vw;
            }

}