/* ------------------------------------------------------------------------ */
/* common
/* ------------------------------------------------------------------------ */
.lead_wrap{
	margin: 0 auto;
	text-align: center;
	display: block;
}
.lead_wrap p{
	text-align: left;
	display: inline-block;
}

a.btn{
	min-width: 250px;
	padding-left: 22px;
}


section{
	padding-top: 80px;
	padding-bottom: 80px;
}
section h2{
	position: relative;
	font-size: 40px;
    height: fit-content;
	margin-bottom: 64px;
}
section h2 span.ttl_highlight{
	font-size: 48px;
	color: #009985 !important;
}
section h2 .en{
    position: absolute;
	color: #009985 !important;
    font-size: 24px;
    font-family: "Playwrite AU VIC", cursive;
    font-optical-sizing: auto;
    font-weight: 200;
    font-style: normal;
    bottom: -30px;
    text-align: left;
    transform: rotate(-5deg);
}
#News .inner h2 .en{
    margin: 0 auto;
    left: 65%;
}
#System .inner h2 .en{
    margin: 0 auto;
    left: 50%;
}
#Activities .inner h2 .en{
    left: 15.5%;
}
#Magazine .inner h2 .en{
    margin: 0 auto;
    left: 63%;
}

@media screen and (max-width: 1240px) {
	section h2{
		font-size: 34px;
	}
	section h2 span.ttl_highlight{
		font-size: 40px;
	}
}
@media screen and (max-width: 1130px) {
	#About .inner h2 .en{
		margin: 0 auto;
		left: 230px;
	}
}
@media screen and (max-width: 768px) {
	section{
		padding-top: 40px;
		padding-bottom: 40px;
	}
	section h2{
		font-size: 26px;
		margin-bottom: 56px;
	}
	section h2 span.ttl_highlight{
		font-size: 32px;
	}
	section h2 .en{
		font-size: 20px;
	}
	#About .inner h2 .en{
		left: 200px;
	}
}
@media screen and (max-width: 480px) {
	section h2{
		font-size: 20px;
		margin-bottom: 40px;
	}
	section h2 span.ttl_highlight{
		font-size: 28px;
	}
	section h2 .en{
		font-size: 16px;
		bottom: -24px;
	}
	#News .inner h2 .en{
		margin: 0 auto;
		left: 65%;
	}
	#About .inner h2 .en{
		left: 165px;
	}
	#System .inner h2 .en{
		margin: 0 auto;
		left: 50%;
	}
	#Activities .inner h2 .en{
		left: 15.5%;
	}
	#Magazine .inner h2 .en{
        margin: 0 auto;
        right: 0;
        left: auto;
	}
}
@media screen and (max-width: 375px) {
	#System .inner h2 .en{
		left: auto;
		right: 0;
	}
}


/* ------------------------------------------------------------------------ */
/* .mainVisual
/* ------------------------------------------------------------------------ */

.mainVisual {
	position: relative;
	width: 100%;
	max-height: 720px;
    padding-bottom: 40px;
	overflow: hidden;
	background-image: url(../../img/01a_mv.png);
}
.mainVisual .fadeText{
    position: absolute;
    bottom: 180px;
    font-size: 54px;
	font-weight: 500;
    color: #009985;
    text-align: left;
    left: 144px;
	bottom: 92px;
	z-index: 1;
}
.mainVisual .fadeText .ttl_wrap{
	display: block;
	background-color: #fff;
	max-width: fit-content;
	overflow: hidden;
	white-space: nowrap;
	width: 0;
	animation: maskReveal 1.0s ease forwards;
}
.mainVisual .fadeText .ttl_flex{
	display: flex;
	margin-top: 10px;
}
.mainVisual p > span:nth-child(2){
	animation-delay: 0.7s;
}

@keyframes maskReveal {
	to {
		width: 100%;
	}
}
.mainVisual .fadeText span span{
	color: #f27516;
}
.mainVisual .video_wrap {
	position: relative;
	width: calc(100% - 28.75%);
	max-height: 680px;
	margin: 0 0 0 auto;
	border-radius: 0 0 0 10px;
	overflow: hidden;
	aspect-ratio: 16 / 9;
}
.mainVisual video {
	width: 100%;
    object-fit: cover;
	aspect-ratio: 16 / 9;
}

@media screen and (max-width: 1700px) {
	.mainVisual .fadeText{
		left: 8.47vw;
	}
	.mainVisual span{
		font-size: 3.18vw;
	}
}
@media screen and (max-width: 768px) {
	.mainVisual{
		padding-bottom: 40vw;
	}
	.mainVisual .fadeText{
		left: 5vw;
		bottom: 12vw;
	}
	.mainVisual .fadeText .ttl_flex{
		display: block;
		margin-top: 4px;
	}
    .mainVisual span {
        font-size: 7.6vw;
    }
	.mainVisual .fadeText .ttl_flex span + span{
		margin-top: 4px;
	}
	.mainVisual .video_wrap{
        margin: 20px 0 0 auto;
		border-radius: 10px 0 0 10px;
        width: calc(100% - 10%);
		max-height: 400px;
		aspect-ratio: 67 / 56;
	}
	.mainVisual video {
		aspect-ratio: 67 / 56;
	}
}

/* ------------------------------------------------------------------------ */
/* #News
/* ------------------------------------------------------------------------ */
#News{
	position: relative;
	padding-top: 64px;
	padding-bottom: 100px;
}
#News .inner{
	position: relative;
	display: flex;
	justify-content: space-between;
	gap: 80px;
}
#News .inner:after{
	content: '';
	width: 442px;
	height: 89px;
	background-image: url('../img/img_news_deco.png');
	background-size: cover;
    position: absolute;
    bottom: -50px;
    left: -20px;
	z-index: -1;
}
#News .inner h2{
	width: 180px;
}
#News .inner .list_wrap{
	width: calc(100% - 180px - 80px);
}
#News .inner .list_wrap ul{
	margin-top: 34px;
	margin-bottom: 24px;
}

@media screen and (max-width: 768px) {
	#News{
		padding-top: 64px;
		padding-bottom: 40px;
	}
	#News .inner{
		display: block;
	}
	#News .inner h2{
		width: fit-content;
	}
	#News .inner .list_wrap{
		width: 100%;
	}
	#News .inner .list_wrap ul{
		margin-top: 24px;
	}
}
@media screen and (max-width: 480px) {
	#News{
		padding-top: 32px;
		padding-bottom: 56px;
	}
	#News .inner:after{
        width: 150px;
        height: 30px;
        bottom: -50px;
        left: 16%;
	}
	#News .inner a.btn{
		margin: 24px auto 0;
        max-width: 100%;
        width: 90%;
	}
}

/* ------------------------------------------------------------------------ */
/* #About
/* ------------------------------------------------------------------------ */
#About{
	padding-bottom: 220px;
}
#About .inner{
	position: relative;
}
#About .inner:after{
	content: '';
	width: 369px;
	height: 90px;
	background-image: url('../img/img_about_deco.png');
	background-size: cover;
    position: absolute;
    bottom: -20px;
    left: -20px;
    z-index: -1;
}
#About .inner .img_wrap{
	position: absolute;
	top: 0;
	left: calc(((100vw - 100%) / 2) * -1);
	width: calc((100% - 5% - 50%) + ((100vw - 100%) / 2));
	height: 400px;
	background-image: url('../img/img_about.png');
	background-position: center right;
	background-size: cover;
	background-repeat: no-repeat;
	border-radius: 0 10px 10px 0;
}
#About .inner .txt_wrap{
	width: 48.33%;
	margin: 0 0 0 auto;
}
#About .inner .txt_wrap figure{
	display: none;
}
#About .inner .txt_wrap p{
	font-size: 24px;
	margin-top: 24px;
	margin-bottom: 56px;
	line-height: calc(50px / 24px);
}
#About .inner .txt_wrap span{
	color: #f27516;
}
#About .inner .txt_wrap .btn{
	margin: 0 0 0 auto;
}

@media screen and (max-width: 1240px) {
	#About .inner .img_wrap{
		height: 32.26vw;
	}
	#About .inner .txt_wrap p{
		font-size: 20px;
		margin-top: 24px;
		margin-bottom: 56px;
	}
}
@media screen and (max-width: 1130px) {
	#About .inner .txt_wrap p br{
		display: none;
	}
}
@media screen and (max-width: 768px) {
	#About{
		padding-bottom: 96px;
	}
	#About .inner .img_wrap{
		display: none;
	}
	#About .inner .txt_wrap{
		width: 100%;
		margin: 0;
	}
	#About .inner .txt_wrap figure{
		display: block;
		text-align: center;
		width: calc(100% + 40px);
		margin: 0 -20px;
	}
	#About .inner .txt_wrap p{
		font-size: 17px;
		margin-bottom: 32px;
		line-height: 2;
	}
	#About .inner .txt_wrap .btn{
		margin: 0 auto;
	}
}
@media screen and (max-width: 480px) {
	#About .inner:after{
        width: 130px;
        height: 32px;
        bottom: -50px;
        left: 5%;
	}
}


/* ------------------------------------------------------------------------ */
/* #System
/* ------------------------------------------------------------------------ */
#System{
	position: relative;
	padding-top: 120px;
	padding-bottom: 150px;
}
#System:after{
	content: '';
	width: 369px;
	height: 90px;
	background-image: url('../img/img_system_deco.png');
	background-size: cover;
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
}
#System .layer{
    display: block;
    content: "";
    position: absolute;
	overflow: hidden;
    top: 0%;
    width: 100%;
    height: 100%;
    left: 0; 
    -webkit-transform: skewY(173deg) skewX(0) translateX(0);
    transform: skewY(173deg) skewX(0) translateX(0);
	z-index: -1;
}
#System .layer:after{
    display: block;
    content: "";
    position: absolute;
	overflow: hidden;
	background-color: #fff;
    top: -5%;
    width: 100%;
    height: 110%;
    left: 0; 
    -webkit-transform: skewY(180deg) skewX(0) translateX(0);
    transform: skewY(180deg) skewX(0) translateX(0);
    transition: 0.6s all ease-in;
	z-index: 0;
}
#System.is-active .layer:after {
    -webkit-transform: skewY(180deg) skewX(0) translateX(100%);
    transform: skewY(180deg) skewX(0) translateX(100%);
}
#System .layer div{
    display: block;
	position: absolute;
	top: -300px;
    width: 100%;
    height: 1000%;
	background-color: #D9F0FF;
	background-image: linear-gradient(90deg, #c2e8f7 1px, transparent 1px), linear-gradient(#c2e8f7 1px, transparent 1px);
	background-position: 10px 10px;
	background-size: 31px 31px;
    transform: skewY(7deg);
}
#System .inner h2{
	font-size: 48px;
	text-align: center;
}
#System .inner .link_wrap{
	display: flex;
	gap: 20px;
	margin-top: 56px;
}
#System .inner .link_wrap a{
	width: calc((100% - (20px * 2)) / 3);
	text-decoration: none;
	display: flex;
	flex-direction: column;
}
#System .inner .link_wrap a .img_wrap{
    width: calc(100% - 20px);
	margin: 0 0 0 auto;
	position: relative;
}
#System .inner .link_wrap a figure{
	overflow: hidden;
}
#System .inner .link_wrap a figure,
#System .inner .link_wrap a figure img{
	position: relative;
	z-index: 3;
}
#System .inner .link_wrap a figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
	transition: 0.3s all;
}
#System .inner .link_wrap a:hover figure img{
    transform: scale(1.1);
}
#System .inner .link_wrap a .img_wrap:after{
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0, 169, 157, 0.2);
	right: -3px;
	bottom: -3px;
	z-index: 2;
}
#System .inner .link_wrap a .txt{
	position: relative;
	width: calc(100% - 20px);
	margin-top: -68px;
	z-index: 4;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}
#System .inner .link_wrap a .txt:after{
    content: "\f105";
    font-family: 'FontAwesome';
    font-size: 12px;
    font-weight: 400;
    display: flex;
	justify-content: center;
	align-items: center;
    width: 24px;
    height: 24px;
    color: #fff;
    background-color: #fa842a;
    border-radius: 50%;
    position: absolute;
	right: 24px;
	bottom: 24px;
    vertical-align: middle;
    text-align: center;
}
#System .inner .link_wrap a .txt h3{
    width: calc(100% - 13.7%);
	color: #fff;
	background-color: #fa842a;
	font-size: 24px;
	font-weight: 500;
	border-radius: 4px 4px 0 0;
	padding: 6px 0 6px 6.6%;
}
#System .inner .link_wrap a .txt .txt_detail{
	position: relative;
	background-color: #fff;
    padding: 24px 24px 56px;
	font-size: 18px;
	flex-grow: 1;
	transition: 0.3s all;
}
#System .inner .link_wrap a:hover .txt .txt_detail{
	background-color: #ffebdb;
}
#System .inner .link_wrap a .txt .txt_detail:after{
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0, 169, 157, 0.2);
	right: -3px;
	bottom: -3px;
	z-index: -1;
}
#System .inner .link_wrap a .txt .txt_detail p{
	font-size: 18px;
	line-height: 1.777;
}
@media screen and (max-width: 1240px) {
	#System .inner .link_wrap a .txt h3{
		font-size: 1.94vw;
	}
	#System .inner .link_wrap a .txt .txt_detail{
		padding: 16px 16px 48px;
	}
	#System .inner .link_wrap a .txt .txt_detail p{
		font-size: 16px;
	}
}
@media screen and (max-width: 768px) {
	#System{
		padding-top: 72px;
		padding-bottom: 80px;
	}
	#System:after{
        width: 26.73vw;
        height: 11.72vw;
	}
	#System .inner h2{
		font-size: 30px;
	}
	#System .inner .link_wrap{
		display: block;
		max-width: 500px;
        width: 85%;
        margin: 24px auto 0;
	}
	#System .inner .link_wrap a{
		width: 100%;
	}
	#System .inner .link_wrap a + a{
		margin-top: 40px;
	}
	#System .inner .link_wrap a .txt h3{
		font-size: 22px;
		padding: 6px 0 6px 16px;
	}
}
@media screen and (max-width: 480px) {
	#System .inner h2{
		font-size: 24px;
	}
	#System .inner .link_wrap a .txt h3{
		font-size: 18px;
		padding: 6px 0 6px 16px;
	}
}
@media screen and (max-width: 375px) {
	#System .inner .link_wrap a .txt h3{
		font-size: 4.8vw;
		padding: 6px 0 6px 4.27vw;
	}
	#System .inner .link_wrap a .txt .txt_detail{
		padding: 4.27vw 4.27vw 48px;
	}
}


/* ------------------------------------------------------------------------ */
/* #Activities
/* ------------------------------------------------------------------------ */
#Activities{
	position: relative;
	padding-top: 144px;
    margin-top: 116px;
}
#Activities:after{
	content: '';
    width: 321px;
    height: 74px;
	background-image: url('../img/img_activities_deco.png');
	background-size: cover;
    position: absolute;
    top: 60px;
    left: 0;
    z-index: -1;
}
#Activities .layer{
    display: block;
    content: "";
    position: absolute;
	overflow: hidden;
    top: 30%;
    width: 100%;
    height: 55%;
    left: 0; 
    -webkit-transform: skewY(173deg) skewX(0) translateX(0);
    transform: skewY(173deg) skewX(0) translateX(0);
	z-index: -1;
}
#Activities .layer:after{
    display: block;
    content: "";
    position: absolute;
	overflow: hidden;
	background-color: #fff;
    top: -5%;
    width: 100%;
    height: 110%;
    left: 0; 
    -webkit-transform: skewY(180deg) skewX(0) translateX(0);
    transform: skewY(180deg) skewX(0) translateX(0);
    transition: 0.6s all ease-in;
	z-index: 0;
}
#Activities.is-active .layer:after {
    -webkit-transform: skewY(180deg) skewX(0) translateX(100%);
    transform: skewY(180deg) skewX(0) translateX(100%);
}
#Activities .layer div{
    display: block;
    position: fixed;
    top: -300px;
    width: 100%;
    height: 170%;
    background-image: url(../img/img_activities_back.png);
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    transform: skewY(7deg);
}

#Activities h2{
	font-size: 48px;
}
#Activities .contents_wrap{
	position: relative;
	padding-top: 270px;
	padding-bottom: 270px;
	margin-top: -64px;
}
#Activities .inner .img_main{
	position: absolute;
	top: 220px;
	right: 0;
	width: calc((100% - 14.67% - 50%) + ((100vw - 100%) / 2));
	min-width: 500px;
	height: 400px;
	background-image: url('../img/img_activities_main.png');
	background-position: center right;
	background-size: cover;
	background-repeat: no-repeat;
	border-radius: 10px 0 0 10px;
	z-index: 1;
}
#Activities .inner .img_sub{
	position: absolute;
	top: 660px;
	right: calc(((100vw - 100%) / 2) + 20px);
	width: 400px;
	height: 300px;
	background-image: url('../img/img_activities_sub.png');
	background-size: cover;
	background-repeat: no-repeat;
	border-radius: 10px;
	z-index: 1;
}
#Activities .inner .txt_wrap{
	width: 62.5%; /* 1200px中の750px */
	margin: 0;
}
#Activities .inner .txt_wrap .link_wrap{
	display: flex;
	gap: 52px;
}
#Activities .inner .txt_wrap .link_wrap a{
	width: 100%;
	position: relative;
	padding-top: 75px;
	background-color: #fff;
	transition: 0.3s all;
}
#Activities .inner .txt_wrap .link_wrap a:hover{
	text-decoration: none;
	background-color: #ffebdb;
}
#Activities .inner .txt_wrap .link_wrap a:after{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(250, 132, 42, 0.6);
    right: -3px;
    bottom: -3px;
    z-index: -1;
}
#Activities .inner .txt_wrap .link_wrap a h3{
	position: absolute;
	top: 0;
	left: 0;
	width: calc(100% - 40px);
	padding: 6px 6px 6px 40px;
	font-size: 24px;
	color: #fff;
	background-color: #fa842a;
	transition: 0.3s all;
}
#Activities .inner .txt_wrap .link_wrap a figure{
	text-align: center;
}
#Activities .inner .txt_wrap .link_wrap a .txt{
	position: relative;
	padding-bottom: 64px;
}
#Activities .inner .txt_wrap .link_wrap a .txt:after{
    content: "\f105";
    font-family: 'FontAwesome';
    font-size: 12px;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    color: #fff;
    background-color: #fa842a;
    border-radius: 50%;
    position: absolute;
    right: 40px;
    bottom: 24px;
    vertical-align: middle;
    text-align: center;
}
#Activities .inner .txt_wrap .link_wrap a p{
	width: calc(100% - (40px * 2));
	margin: 32px auto 0;
	font-size: 18px;
}
@media screen and (max-width: 1700px) {
	#Activities .inner .img_main{
        min-width: auto;
        height: auto;
        aspect-ratio: 3 / 2;
        top: auto;
        bottom: 50%;
    }
	#Activities .inner .img_sub{
        height: auto;
        aspect-ratio: 4 / 3;
        width: 23.53%;
	}
}
@media screen and (max-width: 1440px) {
	#Activities .inner .txt_wrap{
		width: 62%;
	}
	#Activities .inner .txt_wrap .link_wrap{
		gap: 3.61vw;
	}
	#Activities .inner .txt_wrap .link_wrap a h3{
		font-size: 20px;
		padding: 6px 6px 6px 2.78vw;
	}
}
@media screen and (max-width: 1023px) {
	#Activities{
		margin-top: 40px;
        margin-bottom: 116px;
	}
	#Activities .inner .img_main,
	#Activities .inner .img_sub{
		bottom: 0;
	}
	#Activities .inner .img_main{
		left: 0;
		border-radius: 0 10px 10px 0;
        width: 344px;
        height: 230px;
	}
	#Activities .inner .img_sub{
        top: auto;
        width: auto;
        height: 230px;
        right: 0;
        border-radius: 10px 0 0 10px;
	}
	#Activities .contents_wrap{
		padding-top: 230px;
		padding-bottom: 230px;
        margin-top: -100px;
	}
	#Activities .inner .txt_wrap{
		width: 90%;
		margin: 0 auto;
	}
	#Activities .inner .txt_wrap .link_wrap a h3{
		font-size: 24px;
		padding: 6px 6px 6px 3.91vw;
	}
}
@media screen and (max-width: 768px) {
	#Activities{
		margin-top: 0;
        margin-bottom: 80px;
	}
	#Activities:after{
		width: 211px;
		height: 49px;
		top: 80px;
	}
	#Activities .contents_wrap {
        padding-top: 170px;
        padding-bottom: 230px;
        margin-top: -100px;
    }
	#Activities .layer{
		top: 25%;
	}
	#Activities .inner h2{
		font-size: 30px;
	}
	#Activities .inner > p br{
		display: none;
	}
	#Activities .inner .txt_wrap .link_wrap,
	#Activities .inner .txt_wrap .link_wrap a{
		display: block;
	}
	#Activities .inner .txt_wrap .link_wrap{
        max-width: 500px;
        width: 85%;
        margin: 0 auto;
	}
	#Activities .inner .txt_wrap .link_wrap a + a{
		margin-top: 48px;
	}
	#Activities .inner .txt_wrap .link_wrap a h3 {
	    width: calc(100% - 24px);
        font-size: 20px;
        padding: 6px 6px 6px 24px;
    }
	#Activities .inner .txt_wrap .link_wrap a p{
    	width: calc(100% - (24px * 2));
    	font-size: 16px;
	}
	#Activities .inner .txt_wrap .link_wrap a .txt:after{
		right: 24px;
	}
	#Activities .inner .txt_wrap .link_wrap a figure {
		max-width: 80px;
		margin: 0 auto;
	}
}
@media screen and (max-width: 680px) {
	#Activities{
		padding-bottom: 350px;
	}
	#Activities .inner .img_sub{
		bottom: 260px;
	}
}
@media screen and (max-width: 480px) {
	#Activities .layer{
        top: 23%;
        height: 53%;
	}
	#Activities .layer div{
		height: 150%;
	}
	#Activities .contents_wrap{
		padding-bottom: 20px;
	}
	#Activities .inner h2{
		font-size: 24px;
	}
	#Activities .inner .txt_wrap .link_wrap a{
		padding-top: 56px;
	}
	#Activities .inner .txt_wrap .link_wrap a h3 {
        font-size: 18px;
        padding: 4px 6px 4px 24px;
    }
	#Activities .inner .txt_wrap .link_wrap a p{
    	font-size: 15px;
		line-height: 1.846;
    	margin: 16px auto 0;
	}
	#Activities .inner .txt_wrap .link_wrap a .txt{
		padding-bottom: 48px;
	}
	#Activities .inner .img_sub{
		bottom: 180px;
		width: 200px;
		height: 150px;
	}
	#Activities .inner .img_main{
        width: 240px;
        height: 160px;
	}
}

/* ------------------------------------------------------------------------ */
/* #Magazine
/* ------------------------------------------------------------------------ */
#Magazine{
	position: relative;
}
#Magazine:after{
    content: '';
    width: 400px;
    height: 139px;
    background-image: url(../img/img_magazine_deco.png);
    background-size: cover;
    position: absolute;
    top: -70px;
    right: 0;
    z-index: -1;
}
#Magazine .inner h2{
	text-align: center;
}
#Magazine .link_wrap{
	width: 100%;
	background-color: #e6f7f5;
	margin-top: 56px;
	margin-bottom: 40px;
	padding: 24px 0;
	overflow: hidden;
}
#Magazine .link_wrap .link_flex{
	position: relative;
	width: fit-content;
	display: flex;
	justify-content: center;
	gap: 20px;
	margin: 0 auto;
}
#Magazine .link_wrap .link_flex:before,
#Magazine .link_wrap .link_flex:after{
	content: '';
	width: 278px;
	height: 325px;
	background-repeat: no-repeat;
	background-size: cover;
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto 0;
}
#Magazine .link_wrap .link_flex:before{
	background-image: url('../img/img_magazine_back_left.png');
    right: calc(100% + 80px);
}
#Magazine .link_wrap .link_flex:after{
	background-image: url('../img/img_magazine_back_right.png');
    left: calc(100% + 80px);
}
#Magazine .link_wrap a{
	font-size: 20px;
	z-index: 1;
	text-align: center;
}
#Magazine .link_wrap span{
	color: #fff;
	background-color: #fa842a;
    padding: 1px 15px 4px;
}
#Magazine .link_wrap figure{
	margin: 16px 0;
	max-width: 300px;
}
#Magazine .link_wrap a:hover{
	text-decoration: none;
}
#Magazine .link_wrap a img{
	border: 2px solid #fff;
	transition: 0.3s all;
}
#Magazine .link_wrap a:hover img{
	border: 2px solid #fa842a;
}

@media screen and (max-width: 1100px) {
	#Magazine .link_wrap .link_flex:before,
	#Magazine .link_wrap .link_flex:after{
		width: 25.27vw;
		height: 29.55vw;
	}
	#Magazine .link_wrap .link_flex:before{
		right: calc(100% + 7.27vw);
	}
	#Magazine .link_wrap .link_flex:after{
		left: calc(100% + 7.27vw);
	}
}
@media screen and (max-width: 768px) {
	#Magazine:after{
        width: 210px;
        height: 55px;
        top: -30px;
	}
	#Magazine .link_wrap{
    	padding: 40px 0;
	}
	#Magazine .link_wrap span,
	#Magazine .link_wrap a p{
		font-size: 15px;
	}
	#Magazine .link_wrap .link_flex:before,
	#Magazine .link_wrap .link_flex:after{
        width: 101px;
        height: 221px;
	}
	#Magazine .link_wrap .link_flex:before{
		background-image: url('../img/img_magazine_back_left_sp.png');
        right: 90%;
        bottom: -70%;
	}
	#Magazine .link_wrap .link_flex:after{
        background-image: url('../img/img_magazine_back_right_sp.png');
        left: 90%;
        top: -50%;
	}
}
@media screen and (max-width: 480px) {
	#Magazine .link_wrap .link_flex{
		max-width: 70%;
	}
}


/* ------------------------------------------------------------------------ */
/* #Students
/* ------------------------------------------------------------------------ */
#Students{
	max-width: 1240px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 0;
	margin: 0 auto;
}
#Students .inner{
	max-width: 1200px;
	width: 100%;
	padding: 10px;
	margin: 0 auto;
	display: flex;
	background: #0BD9D2;
	background: linear-gradient(45deg,rgba(11, 217, 210, 1) 0%, rgba(46, 230, 205, 1) 40%, rgba(46, 230, 107, 1) 100%);
}
#Students .inner figure{
	position: relative;
	width: 56.78%;
	overflow: hidden;
}
#Students .inner figure img{
	transition: 0.3s all;
}
#Students .inner:hover figure img{
    transform: scale(1.05);
}
#Students .inner .txt_wrap{
	position: relative;
	background-color: #fff;
	width: 43.22%;
    display: flex;
    flex-direction: column;
    justify-content: center;
	padding-left: 20px;
	z-index: 1;
}
#Students .inner .txt_wrap::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  background: #fff;
  transform: skewX(-32deg);
  transform-origin: top;
  z-index: -1;
}
#Students .inner .txt_wrap h2{
	width: fit-content;
	font-size: 40px;
	font-weight: 500;
	border-bottom: 2px solid #a2a2a2;
	margin: 0;
}
#Students a.inner .txt_wrap h2:after{
	content: '';
	display: inline-block;
	width: 28px;
	height: 28px;
	background-image: url('../img/icon_blank.png');
	background-size: cover;
	margin-left: 16px;
}
#Students a.inner:hover{
	text-decoration: none;
}
#Students a.inner:hover .txt_wrap h2{
	border-bottom: 2px solid #fff;
}
#Students .inner .txt_wrap p{
	margin-top: 24px;
}

@media screen and (max-width: 1240px) {
	#Students .inner .txt_wrap h2{
		font-size: 3.23vw;
	}
}
@media screen and (max-width: 768px) {
	#Students .inner{
		max-width: 670px;
		padding: 5px;
		display: block;
	}
	#Students .inner figure{
		width: 100%;
	}
	#Students .inner .txt_wrap{
        width: 100%;
        text-align: right;
        padding: 0 24px 24px 0;
	}
	#Students .inner .txt_wrap::after {
		width: 100%;
		height: 100%;
    	-webkit-transform: skewY(173deg) skewX(0) translateX(0);
	    transform: skewY(173deg) skewX(0) translateX(0);
		top: -40px;
	}
	#Students .inner .txt_wrap h2{
		font-size: 20px;
		margin: 0 0 0 auto;
	}
	#Students a.inner .txt_wrap h2:after{
		width: 20px;
		height: 20px;
        margin-left: 10px;
	}
	#Students .inner .txt_wrap p{
		margin-top: 10px;
	}
}
@media screen and (max-width: 480px) {
	#Students .inner .txt_wrap::after{
        height: 57%;
        top: -30%;
	}
}