@charset "UTF-8";

/* =====================================
	Media New
===================================== */

html{
	scroll-behavior:smooth;
	scroll-padding-top:70px;
}

.media.new .wrapper {
	background-color:#EBEBEB;
}

.media.new section h2 {
	width:100%;
	margin:0;
	padding:30px 70px;
	box-sizing:border-box;
	display:inline-flex;
	align-items:center;
	position:relative;
	overflow:hidden;
	text-align:left;
	font-size:2.5vw;
    background:url(../img/media/new/title_wh.png) right bottom / cover no-repeat;
}

.media.new section h2 span {
	margin-left:15px;
	font-size:1vw;
	font-weight:bold;
	letter-spacing:0;
	color:#757575;
}

.activityList {
	display:-webkit-box;
	display:flex;
	flex-wrap:wrap;
}

.activityList li {
	width:24%;
	height:auto;
	margin-top:30px;
	aspect-ratio:508 / 608;
    background:url(../img/media/new/article_wh.png) top left / cover no-repeat;	
}

.activityList li a {
	padding:24% 6% 0;
	display:block;
	position:relative;
}

.activityList li p:nth-of-type(1) {
	padding:0 6% 0 0;
	position:absolute;
	top:8.2%;
	right:0;
	font-size:0.8333333333333334vw;
	line-height:1.3;
	text-align:right;
}

.activityList li.project02 p:nth-of-type(1), .activityList li.project04 p:nth-of-type(1) {
	top:7%;
}

.activityList li p:nth-of-type(2) {
	margin-top:9%;
	font-size:1.1666666666666667vw;
	font-weight:bold;
}

.cnt {
	padding:70px 70px 30px;
	border-bottom:#E0E0E0 1px solid;
}

.media.new #activity .partner_link {
	margin-top:30px;
}

.media.new #activity .partner_link a {
	width:auto;
	padding:6px 35px;
	font-size:1.1666666666666667vw;
}

.media.new section#partner .inr {
    width:100%;
    margin:0 auto;
    padding:0;
	box-sizing:border-box;
}

.media.new .partnerList li {
	width:24%;
	margin-bottom:0;
}

.media.new .partnerList li:nth-of-type(3n+2) {
	margin-right:0;
	margin-left:0;
}

.media.new .partnerList li p {
	margin-top:10px;
	font-size:1vw;
}

.media.new section#partner h2 span.notice {
	margin-left:0;
	margin-top:-10px;
	display:block;
	font-size:1vw;
	font-weight:normal;
}

.media.new section h3 {
	width:100%;
	margin:60px auto 50px;
	padding:12px;
	box-sizing:border-box;
	display:inline-flex;
	justify-content:center;
	align-items:center;
	align-items:center;
	font-size:2vw;
	font-weight:bold;
	text-align:center;
	background-color:#999999;
	color:#FFFFFF;
}

.media.new section h3 span {
	margin-left:10px;
	font-size:1vw;
	font-weight:normal;
}

.media.new section#project {
	background-color:#000000;
	background-image: url(../img/media/new/bg_projject_02.png), url(../img/media/new/bg_projject_01.jpg);
	background-repeat:no-repeat, no-repeat;
	background-size:contain, contain;
	background-position:right bottom, right top;
}

.media.new section#project h2 {
    background:none;
	color:#FFFFFF;
}

.media.new section#project h2 span {
	color:#FFFFFF;
}

#project .cnt {
	padding:40px 70px 140px;
	border-bottom:none;
}

.projectList > li {
	width:100%;
	position:relative;
	--cut:30px;
	--top-w:63.5%;
	--top-y:-30px;
}

.projectList > li + li {
	margin-top:75px;
}

.projectList >li > .card_top {
	width:var(--top-w);
	height:32px;
	margin:0;
	padding:0;
	position:absolute;
	top:var(--top-y);
	left:0;
	z-index:2;
	background:#fff;
	clip-path:polygon(
	var(--cut) 0,
	calc(100% - var(--cut)) 0,
	100% var(--cut),
	100% 100%,
	0 100%,
	0 var(--cut)
	);
}

.projectList > li > .card_body {
	width:100%;
	margin:0;
	padding:0 60px 60px;
	position:relative;
	z-index:1;
	background:#fff;
	clip-path:polygon(
	0 0,
	calc(100% - var(--cut)) 0,
	100% var(--cut),
	100% calc(100% - var(--cut)),
	calc(100% - var(--cut)) 100%,
	var(--cut) 100%,
	0 calc(100% - var(--cut))
	);
}

.projectList li img {
	padding:20px 0;
	border-top:#C2C2C2 1px solid;
	border-bottom:#C2C2C2 1px solid;
}

.projectList li .card_body > p:nth-of-type(1) {
	font-size:1.1666666666666667vw;
	font-weight:bold;
}

.projectList li .card_body > p:nth-of-type(2) {
	margin:10px 0 30px;
	font-size:2.3333333333333335vw;
	line-height:1.4;
	font-weight:bold;
}

.projectList li .card_body > p:nth-of-type(3) {
	margin:25px 0 10px;
	font-size:1.3333333333333335vw;
	font-weight:bold;
}

.projectList li .card_body > p:nth-of-type(4) {
	margin-bottom:55px;
	font-size:1.1666666666666667vw;
}

#project .programLink3 a {
	width:clamp( 280px, calc( 268px + 3.2vw ), 300px );
}

.media.new.list section#main {
    position:relative;
    width:100%;
    height:300px;
    background:url(../img/project/project_news_img.jpg) center center / cover no-repeat;
}

.media.new.list section#main h2 {
    position:absolute;
    top:70px;
    left:50%;
    margin-left:-385px;
	padding:0;
    font-size:clamp( 20px, calc( -6.649746192893403px + 7.1065989847715745vw ), 48px );
	text-align:left;
    font-weight:700;
	display:block;
    color:#fff;
    line-height:1.2;
    letter-spacing:0.06em;
	background:none;
}

.media.new.list section#main h2 span {
	margin-top:15px;
	margin-left:0;
    display:block;
    font-size:2.3rem;
    letter-spacing:0.01em;
	color:#FFFFFF;
}

.media.new.list .partner_link {
	padding:70px 0;
	background-color:#FFFFFF;
}


/* ==========================================================================
	PC
========================================================================== */

@media screen and (min-width:769px){

.activityList li {
	margin-right:1.333333333333%;
}

.activityList li:nth-of-type(4n) {
	margin-right:0;
}

.activityList li:nth-of-type(-n+4) {
	margin-top:0;
}

.activityList li p {
	overflow:hidden;
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2;
	line-clamp:2;
}


.media.new #activity .partner_link {
	-webkit-box-pack:end;
	justify-content:flex-end;
}

#partner .cnt {
	padding:70px 70px 60px;
}

.media.new .partnerList li {
	width:23.5%;
	margin-right:2% !important;
	margin-top:30px;
	box-sizing:border-box;
}

.media.new .partnerList li:nth-of-type(4n) {
	margin-right:0 !important;
}

.media.new .partnerList li:nth-of-type(-n+4) {
	margin-top:0;
}

}

@media screen and (min-width:1921px){
.activityList li p:nth-of-type(1) {
	font-size:15px;
}

}


/* ==========================================================================
	Smartphone
========================================================================== */


@media screen and (max-width:768px){

html{
	scroll-padding-top:60px;
}

.media.new section h2 {
	width:100%;
	margin:0;
	padding:15px;
    background:url(../img/media/new/title_wh_sp.png) right bottom / cover no-repeat;
}

.cnt {
	padding:20px 20px 30px;
}

.activityList li {
	width:49%;
	margin-top:20px;
	aspect-ratio:690 / 940;
    background:url(../img/media/new/article_wh_sp.png) top left / cover no-repeat;	
}

.activityList li a {
	padding:30% 6% 0;
	line-height:1.2;
}

.activityList li:nth-of-type(-n+2) {
	margin-top:0;
}

.activityList li:nth-of-type(odd) {
	margin-right:1%;
}

.activityList li:nth-of-type(even) {
	margin-left:1%;
}

.media.new #activity .partner_link a {
	width:300px;
	padding:10px 0;
	font-size:clamp( 14px, calc( 10.666666666666666px + 0.2777777777777778vw ), 16px );
}

.activityList li p {
	overflow:hidden;
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:3;
	line-clamp:3;
}


.media.new section#partner h2 span.notice {
	margin-top:-5px;
}

.media.new .partnerList li {
	width:49%;
	margin-top:20px;
}

.media.new .partnerList li:nth-of-type(-n+2) {
	margin-top:0;
}

.media.new .partnerList li:nth-of-type(odd) {
	margin-right:1% !important;
}

.media.new .partnerList li:nth-of-type(even) {
	margin-left:1% !important;
}

.media.new section h3 {
	margin:30px auto 15px;
}

#project .cnt {
	padding:25px 10px 40px;
	border-bottom:none;
}

.projectList > li {
	--cut:18px;
	--top-y:-18px;
}

.projectList > li + li {
	margin-top:38px;
}

.projectList >li > .card_top {
	height:22px;
}

.projectList > li > .card_body {
	padding:0 20px 35px;
}

.projectList li .card_body > p:nth-of-type(2) {
	margin:5px 0 10px;
}

.projectList li .card_body > p:nth-of-type(3) {
	margin:25px 0 10px;
}

.projectList li .card_body > p:nth-of-type(4) {
	margin-bottom:25px;
}

.media.new.list section#main {
	aspect-ratio: 10 / 4;
    height:auto;
    background:url(../img/project/project_news_img_sp.jpg) center center / cover no-repeat;
}

.media.new.list section#main h2 {
    top:10vw;
    left:7.33vw;
    margin-left:0;
    background:none;

}

.media.new.list section#main h2 span {
	margin-top:10px;
    font-size:3.07vw;
}

.media.new.list .partner_link {
	padding:35px 0;
}


/* ==========================================================================
	Font-size Adjust
========================================================================== */

.media.new section h2 {
	font-size:clamp( 14px, calc( 4.4px + 2.56vw ), 30px );
}

.media.new section h2 span {
	font-size:clamp( 8px, calc( 5.6px + 0.64vw ), 12px );
}

.activityList li p:nth-of-type(1) {
	font-size:clamp( 8px, calc( 6.8px + 0.32vw ), 10px );
}

.activityList li p:nth-of-type(2) {
	font-size:clamp( 12px, calc( 10.8px + 0.32vw ), 14px );
}

.media.new .partnerList li p {
	font-size:clamp( 11px, calc( 10.4px + 0.16vw ), 12px );
}

.media.new section#partner h2 span.notice {
	font-size:clamp( 8px, calc( 5.6px + 0.64vw ), 12px );
}

.media.new section h3 {
	font-size:clamp( 17px, calc( 12.8px + 1.1199999999999999vw ), 24px );
}

.media.new section h3 span {;
	font-size:clamp( 8px, calc( 5.6px + 0.64vw ), 12px );
}

.projectList li .card_body > p:nth-of-type(1) {
	font-size:clamp( 8px, calc( 4.4px + 0.96vw ), 14px );
}

.projectList li .card_body > p:nth-of-type(2) {
	font-size:clamp( 15px, calc( 7.2px + 2.08vw ), 28px );
}

.projectList li .card_body > p:nth-of-type(3) {
	font-size:clamp( 12px, calc( 9.6px + 0.64vw ), 16px );
}

.projectList li .card_body > p:nth-of-type(4) {
	font-size:clamp( 10px, calc( 7.6px + 0.64vw ), 14px );
}

}
