@charset "utf-8";
/* 共通 */
.content_area::before{display: none;}
.content_box{padding-top: 0;}
.page_title {
    font-size: 3.2rem;
	line-height: 4.6rem;
    font-weight: bold;
    letter-spacing: 1.6px;
}
h2{
	font-weight: bold;
	text-align: center;
}
/* プロフィール */
.profile_area{
	background: #C1DC93;
    border-radius: 20px;
	margin-top: 60px;
	padding: 69px 20px 80px;
}
.profile_area h2{margin: 0 0 36px;}
.profile_box{
	display: flex;
    justify-content: space-between;
    gap: 40px;
    max-width: 940px;
    margin: auto;
}
.profile_box div{
	width: 50%;
	border-radius: 20px;
	background: #fff;
	padding: 50px 50px 25px;
}
.profile_box div img{
	width: 180px;
	margin: 0 auto 28px;
}
.profile_box div p{
	line-height: 2.88rem;
	margin-bottom: 27px;
}
.profile_box div p.profile_ttl{
    width: 60px;
    border-radius: 5px;
    line-height: 2.2rem;
    color: #fff;
    text-align: center;
	margin-bottom: 5px;
}
.profile_box div:first-child .profile_ttl{background: #008A32;}
.profile_box div:nth-child(2) .profile_ttl{background: #DB002A;}

/* 誕生のきっかけ */
.birth_area h2{margin: 100px 0 40px;}
.birth_area p{
	font-size:2rem;
	letter-spacing: 1px;
	line-height: 3.9rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 31px;
}
.birth_area img{
	width: 478px;
    margin: 65px auto 0;
}

/* コンセプト */
.concept_area{margin-bottom: 100px;}
.concept_area h2{margin:117px 0 30px;}
.concept_area p{
	text-align: center;
	margin-bottom: 17px;
}
.consept_box{
	display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 30px;
    padding-left: 0;
    margin:44px 0 0;
}
.consept_box li{
	margin-bottom: 0;
	list-style: none;
}

/* おすすめコンテンツ紹介 */
.contents_area{
	background: #F0C19B;
	padding: 67px 50px 70px;
	border-radius: 20px;
}
.contents_area h2{margin: 0 0 31px;}
.contents_area p{text-align: center;}
.contents_list{
	display: flex;
	flex-wrap: wrap;
    justify-content: center;
	max-width: 1060px;
	margin: 36px auto 0;
	padding-left: 0;
}
.contents_list li{
	width: 50%;
	list-style: none;
	margin-bottom: 42px;
}
.contents_list li:nth-child(odd){padding-right: 30px;}
.contents_list li:nth-child(even){padding-left: 30px;}
.contents_list li:nth-child(5){
	width: calc(50% - 30px);
	padding: 0;
	margin-bottom: 0;
}
.contents_list li img{transition: transform 0.3s;}
.contents_list li:hover img{transform: scale(1.05);}

/* これからの活動 */
.activity_area h2{margin:96px 0 34px;}
.activity_area p{
	text-align: center;
	margin-bottom: 14px;
}
.activity_area img{
	width: 394px;
    margin: 48px auto 0;
}

/* 公式SNS */
.sns_area{
	background: url(https://fkd.web-siance01.com/wp-content/uploads/mascot/bg.png) center top / cover;
	padding:60px 30px 70px;
	margin-top: 100px;
	border-radius: 20px;
}
.sns_area h2{margin:0;}
.sns_list{
    display: flex;
    justify-content: space-between;
	max-width:465px;
	padding-left: 0;
    margin: 58px auto 0;
}
.sns_area li{
	padding-left: 0;
	margin-bottom:0;
	list-style: none;
}
.sns_area li a{
	display: block;
	text-decoration: none;
}
.sns_area li img{
	width:68px;
	margin: 0 auto 6px;
	transition: opacity 0.3s;
}
.sns_area li:hover img{
	opacity: 0.5;
}
.sns_area li p{
	font-weight: 500;
	margin-bottom: 0;
	text-align: center;
}

@media screen and (max-width:1023px){
/* プロフィール */
.profile_area{padding: 44px 20px 30px;}
.profile_box{gap: 20px;}

/* おすすめコンテンツ紹介 */
.contents_area {
	padding: 55px 30px;
	border-radius: 10px;
}
}

@media screen and (max-width:767px){
/* 共通 */
.page_title {
    font-size: 2.1rem;
    letter-spacing: 1.05px;
	line-height: 3.2rem;
}

/* プロフィール */
.profile_area{
    border-radius: 10px;
	margin-top: 33px;
}
.profile_area h2{margin-bottom: 21px;}
.profile_box{
	flex-direction: column;
    gap: 17px;
}
.profile_box div{
	width: 100%;
	border-radius: 10px;
	padding: 30px 30px 0;
}
.profile_box div img{
	width: 140px;
	margin-bottom: 30px;
}
.profile_box div p{
	line-height: 2.52rem;
	margin-bottom: 24px;
}
.profile_box div p.profile_ttl{margin-bottom: 5px;}

/* 誕生のきっかけ */
.birth_area h2{margin: 80px 0 17px;}
.birth_area p{
	font-size:1.6rem;
	letter-spacing: 0.8px;
	line-height: 3.2rem;
	margin-bottom: 33px;
	padding: 0 30px;
}
.birth_area img{
	width: 315px;
    margin-top: 47px;
}

/* コンセプト */
.concept_area{margin-bottom: 70px;}
.concept_area h2{margin:80px 0 15px;}
.concept_area p{margin-bottom: 20px;}
.consept_box{
    grid-gap: 20px;
    margin-top:26px;
}
.contents_list li:nth-child(odd){padding-right: 20px;}
.contents_list li:nth-child(even){padding-left: 20px;}
.contents_list li:nth-child(5){width: calc(50% -20px);}

/* おすすめコンテンツ紹介 */
.contents_area{
	padding: 45px 30px;
	border-radius: 10px;
}
.contents_area h2{margin-bottom: 16px;}
.contents_list{
	margin-top: 24px;
}

/* これからの活動 */
.activity_area h2{margin:75px 0 15px;}
.activity_area p{margin-bottom: 20px;}
.activity_area img{
	width: 265px;
    margin-top: 37px;
}

/* 公式SNS */
.sns_area{
	padding:45px 20px 50px;
	margin-top: 80px;
	border-radius: 10px;
}
.sns_list{
	padding-left: 0;
    margin-top: 31px;
	max-width: 265px;
}
.sns_area li img{
	width:40px;
	margin-bottom: 9px;
}

}

@media screen and (max-width:599px){
/* コンセプト */
.consept_box{
    grid-template-columns: 1fr;
}

/* おすすめコンテンツ紹介 */
.contents_list{
	display: block;
}
.contents_list li{
	width: 100%;
	margin-bottom: 30px;
}
.contents_list li:nth-child(odd){padding-right: 0;}
.contents_list li:nth-child(even){padding-left: 0;}
.contents_list li:nth-child(5){width: 100%;}

}