@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=Noto+Sans+JP:wght@100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@font-face {
  font-family: "Serendie Office";
  font-style: normal;
  src: url("../../../../global/sharehouse/serendie/fonts/serendie-office-240912vf.woff") format("woff");
}
/* -------------------------------------------------

common css

------------------------------------------------*/
.gs21-MainContents * {
    box-sizing: border-box;
}
.cmp-text p {line-height: 1.8;}
.cmp-separator {padding: 60px 0 0 0;}
.image .cmp-image__title {    font-size: 14px;}
/* button */
.serendie__title .gs21-MediaBlock__TextCol .gs21-CUS-LinkList .gs21-CUS-LinkListItem .gs21-CUS-Link,
.button:not(.cmp-button--link-arrow-prev) .cmp-button{
border: 1px solid #4291b3!important;border-radius: 30px;color: #4291b3;padding: 8px 30px;
transition: 0.3s all;font-weight: 400;}
.serendie__title .gs21-MediaBlock__TextCol .gs21-CUS-LinkList .gs21-CUS-LinkListItem .gs21-CUS-Link,
.button:not(.cmp-button--link-arrow-prev) .cmp-button .cmp-button__text{color: #4291b3; font-size: 0.8rem;}
.serendie__title .gs21-MediaBlock__TextCol .gs21-CUS-LinkList .gs21-CUS-LinkListItem .gs21-CUS-Link::before{content: none;}
.serendie__title .gs21-MediaBlock__TextCol .gs21-CUS-LinkList .gs21-CUS-LinkListItem .gs21-CUS-Link:hover,
.button:not(.cmp-button--link-arrow-prev) .cmp-button:hover{background: #4291b3;color: #d2ecdd;}
.button:not(.cmp-button--link-arrow-prev) .cmp-button:hover .cmp-button__text{color: #d2ecdd!important;}
.button:not(.cmp-button--link-arrow-prev) .cmp-button[target=_blank]{
	display: inline-block;
	white-space: nowrap;
	line-height: 0;
	padding-bottom: 15px;
}
.button:not(.cmp-button--link-arrow-prev) .cmp-button[target=_blank]:after{
	content: none;
}

.cmp-container .cmp-button[target=_blank] .cmp-button__text{width: 100%;}




/* MemberRegistration-------------------------------------------
------------------------------------------------*/
#MemberRegistrationArea{position: relative;}
#MemberRegistration{
	position: absolute;
	top: 0;
	right: 0;
	width: 260px;
	height: 46px;
	display: block;
	text-align: center;
	box-sizing: border-box;
	transition: 0.3s all;
}
#MemberRegistration .cmp-button__text {
	font-size: 1rem;
	font-weight: 400;
	text-align: center;
}
#MemberRegistration[target=_blank]:after{content: none;}

/* title-------------------------------------------
------------------------------------------------*/
#title__page .cmp-title__text{
	font-family: "Serendie Office";
	font-weight: 300;
	font-size: 2.6rem;
}
#title__line {
	padding: 10px 0;
	border-top: 1px solid #989898;
	border-bottom: 1px solid #989898;
	margin-bottom: 50px;
	position: relative;
}
#title__line .cmp-title__text {
	font-size: 1.4rem;
	font-weight: 400;
	position: relative;
}
/* contentsnav-------------------------------------------
------------------------------------------------*/
.contentsnav{	margin-bottom: 60px;}
.contentsnav .gs21-ContentsNav {
	position: relative;
	padding: 5px 0;
	border-color: #ccc;
}
.contentsnav ul .gs21-ContentsNavListItem a.gs21-Link {
	padding: 10px 10px 10px 30px;
}
.contentsnav ul .gs21-ContentsNavListItem a.gs21-Link:hover{
	color: #000;
	background: none;
	font-weight: 400;
}
.contentsnav ul .gs21-ContentsNavListItem a.gs21-Link::before{display: none;}
.contentsnav ul .gs21-ContentsNavListItem a.gs21-Link {
	padding: 10px 10px 10px 30px;
}
/* lead-------------------------------------------
------------------------------------------------*/
#lead p b{
	font-size: 1.3rem;
	font-weight: 500;
}
#lead__narrow{
	max-width: 600px;
	margin: 0 auto;
	font-weight: 400;;
}
#lead__narrow p{font-weight: 400;}


/* separator-------------------------------------------
------------------------------------------------*/
.cmp-separator__horizontal-rule {
	border: none;
	width: 100%;
	height: 1px;
	background: #ccc;
}




/* -------------------------------------------------

page css

------------------------------------------------*/

/* TOP-------------------------------------------
------------------------------------------------*/
#page__top {background: #d2ecdd;}
#page__top .cmp-separator__horizontal-rule {background: #ccdfd3;}
#page__top .title .cmp-title h3{text-align: left;}

/* CUSTOM-001 ：ボックス */
#serendie__h1{text-indent: -9999px;height: 0;}
.serendie__title{
	background: url("../../../../global/sharehouse/serendie/img/view-background.svg") no-repeat;
	background-size: cover;
	padding: 50px 0;
	align-items: center;
}
.serendie__title .gs21-MediaBlock__TextCol .gs21-Text{font-weight: 400;font-size: 1.6rem;}
.serendie__title .gs21-MediaBlock__ImageCol .gs21-ImageUnit .gs21-ImageUnit__ImageCol{background: none; }
.serendie__title .gs21-MediaBlock__ImageCol .gs21-ImageUnit .gs21-ImageUnit__ImageCol .gs21-ImageUnit__ImageCol-Desktop img{height: 300px;}

/* ブロック部分*/
/* CP-CMN-001 ：タイトル */
#serendie__title--01 .cmp-title__text,
#serendie__title--02 .cmp-title__text,
#serendie__title--03 .cmp-title__text,
#serendie__title--04 .cmp-title__text,
#serendie__title--05 .cmp-title__text,
#serendie__title--06 .cmp-title__text{font-weight: 400;}

#serendie__title--01 .cmp-title__text::before,
#serendie__title--02 .cmp-title__text::before,
#serendie__title--03 .cmp-title__text::before,
#serendie__title--04 .cmp-title__text::before,
#serendie__title--05 .cmp-title__text::before,
#serendie__title--06 .cmp-title__text::before{
	content: "";
	font-family: "Serendie Office";
	font-size: 2.8rem;
	padding-right: 20px;
}
#serendie__title--01 .cmp-title__text::before{content: "1";}
#serendie__title--02 .cmp-title__text::before{content: "2";}
#serendie__title--03 .cmp-title__text::before{content: "3";}
#serendie__title--04 .cmp-title__text::before{content: "4";}
#serendie__title--05 .cmp-title__text::before{content: "5";}
#serendie__title--06 .cmp-title__text::before{content: "M";}

#solution__header,
#stories__header,
#news__header{
	position: relative;
}
#solution__header .cmp-button,
#stories__header .cmp-button,
#news__header .cmp-button{
	position: absolute;
	top: 20px;
	left: 300px;
}
/* 0609add */
#solution__header .button,
#stories__header .button,
#news__header .button{
	margin-top: 0;
}

.serendie__about:hover,
.serendie__boxlist:hover{background: #fff;}

.serendie__about .gs21-CUS-Link{font-size: 1.6rem;font-weight: 400;}
.serendie__about a.gs21-CUS-Link:hover{color: #4291b3!important;}
.serendie__about .gs21-CUS-Link::before{display: none;}

.serendie__boxlist {align-items: center;}
.serendie__boxlist .gs21-MediaBlock__TextCol .gs21-CUS-LinkList .gs21-CUS-LinkListItem .gs21-CUS-Link{
border: 1px solid #4291b3;border-radius: 30px;color: #4291b3;padding: 10px 30px;font-size: 0.8rem;
transition: 0.3s all;margin-top: 50px;}
.serendie__boxlist .gs21-MediaBlock__TextCol .gs21-CUS-LinkList .gs21-CUS-LinkListItem .gs21-CUS-Link::before{display: none;}
.serendie__boxlist .gs21-MediaBlock__TextCol .gs21-CUS-LinkList .gs21-CUS-LinkListItem .gs21-CUS-Link:hover{background: #4291b3;color: #d2ecdd;}
.serendie__boxlist .gs21-ImageUnit__ImageCol {aspect-ratio: 16 / 9;}
.serendie__boxlist .gs21-ImageUnit__ImageCol img {height: 100%;object-fit: cover;}
.serendie__news .gs21-ImageUnit{position: relative;}
.serendie__news .gs21-ImageUnit::before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: 1;
}
#serendie__news{
	display: flex;
	gap: 30px;
	margin: auto;
	max-width: 90pc;
	padding: 5px;
	width: 100%;
}
#serendie__news:hover{
	background: #fff;
}
/* edit0609 start*/
#serendie__news > .container:nth-of-type(1){
	width: 33.3333%;
	background: #fff;
	text-align: center;
	position: relative;
	aspect-ratio: 16 / 9;
}
#serendie__news > .container:nth-of-type(1) .cmp-text{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}


#serendie__news > .container:nth-of-type(1) .cmp-text p{
	margin: 0;
	color: #4291b3;
	font-size: 1.2rem;
	font-weight: 600;
	
}

#serendie__news > .container:nth-of-type(2){
	width: calc(66.6667% - 30px);
}
/* edit0609 end*/
   



/* ブロック部分白*/
.serendie__whitebox,
#container-pickup1,
#container-pickup2,
#container-pickup3{
	background: #fff;
	padding: 50px;
	align-items: center;
	box-sizing: border-box;
	transition: 0.3s all;
}
#container-pickup1 .container,
#container-pickup2 .container,
#container-pickup3 .container{margin-top: 0;}
#container-pickup1 .cmp-container,
#container-pickup2 .cmp-container,
#container-pickup3 .cmp-container{align-items: center;}
#container-pickup1 .container .cmp-container .image,
#container-pickup2 .container .cmp-container .image,
#container-pickup3 .container .cmp-container .image{margin-top: 0;}
.serendie__whitebox--inner{align-items: center;}
#serendie__title--pickup1,
#serendie__title--pickup2,
#serendie__title--pickup3{border-bottom: 1px solid #000;padding-bottom: 20px;}
#serendie__title--pickup1 .cmp-title__text,
#serendie__title--pickup2 .cmp-title__text,
#serendie__title--pickup3 .cmp-title__text{font-weight: 400;}
#serendie__title--pickup1small .cmp-title__text,
#serendie__title--pickup2small .cmp-title__text,
#serendie__title--pickup3small .cmp-title__text{font-weight: 400;margin-top: 20px;}

.serendie__whitebox--inner .gs21-MediaBlock__TextCol .gs21-CUS-LinkList .gs21-CUS-LinkListItem .gs21-CUS-Link,
.serendie__whitebox .gs21-MediaBlock__TextCol .gs21-CUS-LinkList .gs21-CUS-LinkListItem .gs21-CUS-Link{
border: 1px solid #4291b3;border-radius: 30px;color: #4291b3;padding: 8px 30px;
transition: 0.3s all;margin-top: 50px;}
.serendie__whitebox--inner .gs21-MediaBlock__TextCol .gs21-CUS-LinkList .gs21-CUS-LinkListItem .gs21-CUS-Link::before,
.serendie__whitebox .gs21-MediaBlock__TextCol .gs21-CUS-LinkList .gs21-CUS-LinkListItem .gs21-CUS-Link::before{display: none;}
.serendie__whitebox--inner .gs21-MediaBlock__TextCol .gs21-CUS-LinkList .gs21-CUS-LinkListItem .gs21-CUS-Link:hover,
.serendie__whitebox .gs21-MediaBlock__TextCol .gs21-CUS-LinkList .gs21-CUS-LinkListItem .gs21-CUS-Link:hover{background: #4291b3;color: #d2ecdd;}

/* about-------------------------------------------
------------------------------------------------*/
#page__about{	background: #fceccd;}
#page__about .contentsnav .gs21-ContentsNav::before,
#page__aboutProgram .contentsnav .gs21-ContentsNav::before,
#page__aboutCommunity .contentsnav .gs21-ContentsNav::before,
#page__aboutInnovation .contentsnav .gs21-ContentsNav::before{
	content: "1";
	padding-right: 20px;
	display: inline-block;
	position: absolute;
	top: 12px;
	left: 0;
	font-size: 1.6rem;
	font-family: "Serendie Office";
	
}
#title__about .cmp-title__text{
	border-bottom: 1px solid #000;display: inline-block;margin-bottom: 20px;font-weight: 400;font-size: 1.8rem;
}
#whats-serendie{
	max-width: 600px;
	width: 63.8%;
	margin: 50px auto 50px auto;
}

#page__about .cmp-separator__horizontal-rule {background: #efe0c3;}
.title .cmp-title h3{margin: 50px 0 30px 0;font-size: 1.4rem;font-weight: 400; text-align: center;}
#newservice {gap: 30px 0;}
#newservice > .container{	border-top: 1px solid #efe0c3;}
#newservice > .container:nth-child(even) {    border-top: none;}
#newservice > .container .text p {    margin-top: 0;}
#newservice .title .cmp-title .cmp-title__text {text-align: left;margin: 30px 0 20px;}
#businessArea{padding: 50px 0;}
#businessArea .cmp-container{text-align: center;position: relative;margin: 20px 0 50px 0;}
#businessArea .cmp-container::before{
	content: "";
	width: 150px;
	height: 150px;
	border: 1px solid #000;
	border-radius: 50%;
	position: absolute;
	top: 37%;
	left: 50%;
	transform: translate(-50%,-50%);
}
#businessArea .cmp-container .title {font-size: 0.8rem;font-weight: normal;}
#businessArea .cmp-container .title .cmp-title__text {
	position: relative;
	z-index: 1;
}
#businessArea .cmp-container .image{max-width: 50px;margin: 10px auto;}


/* page__aboutProgram---*/
#page__aboutProgram{	background: #fef8c2;}
#approach__image img{margin: 0 auto;}
#Features {
	border-right: 1px solid #000;
	padding-right: 30px;
}
#Features .cmp-container{
	border-left: 1px solid #000;
	padding-left: 30px;
}
#Features .cmp-container .title h4{
	font-size: 1.8rem;
	font-weight: 400;
	font-family: "roboto";
}
#Features .cmp-container .title h5{
	font-size: 1.0rem;
	line-height: 1.8;
	margin: 30px 0;
	font-weight: 500;
}

#approach__card{
	margin: 50px 0;
}
#approach__card .container{
	border: 1px solid #000;
	border-radius: 15px;
	padding: 40px;
}
#approach__card .container:nth-of-type(1) {
	border: none;
	width: 22%;
}
#approach__card .container .title .cmp-title .cmp-title__text{
	text-align: center;
	font-size: 1.2rem;
	font-weight: 400;
}

/* designsystem---*/
#designsystem .button{text-align: center;}
#designsystem .image{text-align: center;}
#designsystem .image .cmp-image__image{max-width: 450px;}



/* page__aboutCommunity---*/
#page__aboutCommunity{background: #ecebe6;}
.cmp-container--3col>#community__members{gap: 80px;}
.cmp-container--3col>#community__members>* {width: calc(33.3% - 54px);}
#community__members>.container .image {padding: 6%;}
#community__members .container .image .cmp-image .cmp-image__image {border-radius: 15px;}
#community__members .container .title .cmp-title{	text-align: center;}
#community__members .cmp-text p{
	margin-top: 10px;
	font-size: 0.8rem;
}
#community__members .cmp-text p b{	color: #4291b3;}
#community__partners {
	margin-top: 80px;
	background: #fff;
	padding: 10px 80px 80px 80px;
}
#community__partners .cmp-container--4col .cmp-container{	gap: 70px;}
#community__partners .cmp-container--4col .cmp-container .image{width: calc(25% - 55px);}

/* page__aboutInnovation---*/
#page__aboutInnovation{background: #eaf4ec;}
#innovation__container{gap: 0;}
#innovation__container > div{
	position: relative;
	width: 50%;
}
#innovation__container > div,
#innovation__container .image{
	border-top: 1px solid #666;
	margin-top: 0;
	padding: 30px 0;
	box-sizing: border-box;
}
#innovation__container .image {
    padding-left: 30px;
}
#innovation__container .cmp-container .title .cmp-title .cmp-title__text {
    font-size: 1.4rem;
    font-weight: 400;
    margin: 10px 0;
}

#innovation__container .cmp-container .title .cmp-title h3.cmp-title__text {
	font-size: 2rem;
	text-align: left;
	font-weight: 400;
	margin-top: 0;
	line-height: 1;
}

/* SOLUTION-------------------------------------------
------------------------------------------------*/
#page__solution{background: #fbe7e6;}
#page__solution #title__line .cmp-title__text::before{
	content: "2";
	padding-right: 20px;
	display: inline-block;
	font-family: "Serendie Office";
}
#solution__container .title .cmp-title .cmp-title__text{
	text-align: left;
	font-size: 1.2rem;
}

#solution__container .button .cmp-button {
	background: #4291b3;
	border-radius: 4px;
}

#solution__container .button .cmp-button .cmp-button__text {
	color: #fff;
	font-size: 0.8rem;
	font-weight: 400;
}

/* STORIES-------------------------------------------
------------------------------------------------*/
#page__stories{background: #fafaf9;}
#page__stories #title__line .cmp-title__text::before{
	content: "2";
	padding-right: 20px;
	display: inline-block;
	font-family: "Serendie Office";
}
#stories__container .cmp-container .title .cmp-title .cmp-title__text{
	text-align: left;
	margin: 24px 0 30px 0;
	color: #4291b3;
	font-size: 1.2rem;
}
#stories__container .cmp-image {aspect-ratio: 16 / 9;}
#stories__container .cmp-image img.cmp-image__image {height: 100%;object-fit: cover;}

/* storiesDetail__lead ---*/
#storiesDetail__lead .cmp-title__text{
	color: #333;
	font-weight: 400;
	font-size: 1.6rem;
	line-height: 1.8;
}

#storiesDetail .cmp-text--date .cmp-text p{text-align: right!important;}
#storiesDetail__profile{
	padding: 20px;
	border: 1px solid #000;
}
#storiesDetail__profile > .image{
	width: calc(20% - 15px);
	margin-top: 10px;
}
#storiesDetail__profile > .container

{width: calc(80% - 15px);}
#storiesDetail__profile .container

 .text .cmp-text p{
	margin: 5px 0 0;
	font-size: 0.8rem;
}
#storiesDetail__lead--small p {
    font-size: 1.2rem;
    color: #333;
}
#storiesDetail .title.cmp-title--h-lv2 .cmp-title .cmp-title__text{color: #4291b3;}
#storiesDetail .text .cmp-text p {
	color: #333;
	font-weight: 400;
	line-height: 2.1;
}
#storiesDetail__sns{
	max-width: 300px;
	margin: 100px auto 0 auto;
	padding: 0 20px;
	border: 1px solid #4291b3;
	color: #4291b3;
	align-items: center;
}
#storiesDetail__sns .button {
	margin-top: 0;
}
#storiesDetail__sns .button .cmp-button{
	border: none!important;
	padding: 20px 20px;
	gap: 0;
}
#storiesDetail__sns .button .cmp-button:hover{
	background: none;
	filter: grayscale(100%) opacity(60%);
}

#storiesRelated{
	border-top: 1px solid #666;
	border-bottom: 1px solid #666;
	margin-top: 50px;
	padding-bottom: 50px;
}

.contents__share_buttons_inner {
	display: flex;
	justify-content: center;
	max-width: 300px;
	margin: 100px auto 0;
	border: 1px solid #4291b3;
	width: 90%;
	align-items: center;
	color: #4291b3;
}
.contents__share_buttons_inner ul{
	display: flex;
}
.contents__share_buttons_inner ul li{
	list-style: none;
}
.contents__share_buttons_inner ul li a{
	display: inline-block;
	margin: 0 20px;
}
.contents__share_buttons_inner ul li a svg{
	width: 30px;
	fill:#4291b3;
}





/* NEWS-------------------------------------------
------------------------------------------------*/
#page__news{	background: #fafafa;}
#page__news #title__line .cmp-title__text::before{
	content: "4";
	display: inline-block;
	margin-right: 20px;
	font-family: "Serendie Office";
}
.cmp-container--2col>#news__container>.container{
	max-width: 900px;
	width: 80%
}
.cmp-container--2col>#news__container>.image{
	max-width: 900px;
	width: calc(20%);
	margin-top: 0;
}
#news__container{gap:0; }
#news__container .container,
#news__container .image{
	border-bottom: 1px solid #666;
	padding: 30px 0;
}
#news__container .image{padding-left: 30px;}
#news__container .title .cmp-title .cmp-title__text{
	text-align: left;
	font-size: 1.1rem;
	margin: 10px 0 20px 0;
}

/* CONTACT-------------------------------------------
------------------------------------------------*/
#page__contact{	background: #fafafa;}
#page__contact #title__line .cmp-title__text::before{
	content: "3";
	display: inline-block;
	margin-right: 20px;
	font-family: "Serendie Office";
}


















@media screen and (max-width: 1440px) {
}/*1440px*/

/*ページタイトルカスタマイズ*/
@media screen and (max-width: 1023px) {

	
}/*1023px*/

@media screen and (max-width: 767px) {
	
/* common 767px-------------------------------------------
------------------------------------------------*/
#MemberRegistration{position: static;}
	
/* TOP 767px-------------------------------------------
------------------------------------------------*/
.serendie__title .gs21-ImageUnit__ImageCol-SmartPhone {
	width: 50%;
	display: block;
	margin: auto;
}
.serendie__title .gs21-MediaBlock__TextCol .gs21-Text {
	font-weight: 400;
	font-size: 1.6rem;
	line-height: 1.5;
}
.serendie__whitebox{padding: 30px;}
#solution__header .cmp-button,
#stories__header .cmp-button,
#news__header .cmp-button{
	position: absolute;
	top: 20px;
	left: auto;
	right: 0;
}
#serendie__news > .container:nth-of-type(1),
#serendie__news > .container:nth-of-type(2) {
    width: 100%;
}
/* ブロック部分白*/
.serendie__whitebox,
#container-pickup1,
#container-pickup2,
#container-pickup3{
	padding: 30px;
}
/* about 767px-------------------------------------------
------------------------------------------------*/
	#whats-serendie{		width: 100%;	}
/* page__aboutProgram 767px---*/
#Features {
	border-left: none;
	border-right: none;
}
	
/* community 767px-------------------------------------------
------------------------------------------------*/	
.cmp-container--3col>#community__members>* {width: 100%;}
#news__container .container {border: none;}
.cmp-container--2col>#news__container>.image {
	max-width: 900px;
	width: 100%;
	padding: 0 0 30px 0; 
 }
#news__container>.image	.cmp-image__image{
	width: 200px;
	margin: auto;
	display: block;
}

	#community__partners .cmp-container--4col .cmp-container{flex-direction: row;}
#community__partners .cmp-container--4col .cmp-container .image{width: calc(50% - 40px);}

/* innovation__container 767px-------------------------------------------
------------------------------------------------*/	
#innovation__container > div{
	position: relative;
	width:100%;
}
#innovation__container .cmp-container {width: 100%;}
#innovation__container .cmp-container{
	border: none;
	padding-top: 0;
}
#innovation__container .image {
    padding-left: 0;
}
/* stories 767px-------------------------------------------
------------------------------------------------*/	
#storiesDetail__profile > .image {
	width: 50%;
	margin: 0 auto;
}
#storiesDetail__profile > .container

 {
	width: 100%;
}
	
	
}/*767px*/