@charset "utf-8";
/* story css */

body {
background: #D1E0F3;
}
main {
padding-top: 100px;
}
#haikei {
background-image: url("../img/people/bg.jpg");
background-repeat: repeat;
background-position: left top;
width: 100%;
border-radius: 50px;
padding-bottom: 60px;
margin-bottom: 40px;
}
.intro_title {
max-width: 440px;
height: auto;
margin: 0px auto 40px;
padding-top: 30px;
}
.inner_content {
max-width: 900px;
margin: 0 auto;
background: #fff;
border-radius: 30px;
padding: 0 40px 30px;
position: relative;
}

@media all and (max-width : 980px ){
.inner_content {
margin: 0 20px;
}
}
.circle_box {
width: 80px;
height: 80px;
border-radius: 50%;
background: #EB6DA0;
position: absolute;
top: -30px;
left: 15px;
z-index: 10;
}
.story_box {
display: flex;
flex-direction: column;
align-items: center;

color: #fff;
font-family: "Quicksand", serif;
font-weight: 500;
letter-spacing: 0.05em;
padding-top: 16px;
}
.story_box dt {
font-size: 1.0rem;
line-height: 100%;
margin-bottom: 1px;
}
.story_box dd {
font-size: 3.6rem;
line-height: 100%;
}

@media all and (max-width : 767px ){
.circle_box {
width: 60px;
height: 60px;
top: -30px;
left: 15px;
}
.story_box dd {
font-size: 2.4rem;
}
}

.intro_copy{
font-size: 2.4rem;
font-weight: 700;
color:rgb(95,57,64);
line-height: 160%;
padding-top: 60px;
margin-bottom: 20px;
}
.sec01 {
position: relative;
}
.main_imgbox {
position: relative;
width: 100%;
height: auto;
z-index: 1;
}
.main_imgbox img {
width: 100%;
}
.profile_box {
width: 42.22%;
background: #fff;
border-radius: 10px;
box-shadow: 2px 2px 4px 2px rgb(0 0 0 / 5%);
padding: 20px;
position: relative;
z-index: 2;
margin: -10% 0 30px auto;
right: 20px;
}
.name {
font-size: 2.2rem;
font-weight: 700;
margin-bottom: 20px;
line-height: 100%;
display: block;
text-align: center;
}
.city {
width: 80%;
display: flex;
align-items: center;
justify-content: center;
background: #d4719d;
border-radius: 20px;
padding: 5px 10px;
color: #fff;
margin: 0 auto 10px;
}
.city li {
margin-right: 15px;
display: inline-block;
}
.property_txt {
font-size: 1.3rem;
text-align: center;
}
.txt {
font-size: 1.4rem;
line-height: 200%;
margin-bottom: 30px;
}
.sub-image {
max-width: 518px;
margin: 0 auto 30px;
}
.sub-image img {
width: 100%;
}
.link_btn_box {
margin-bottom: 50px;
}

@media all and (max-width : 767px ){
main {
padding-top: 80px;
}
#haikei {
border-radius: 20px;
padding-bottom: 20px;
margin-bottom: 20px;
}
.intro_title {
max-width: 240px;
margin: 0px auto 40px;
padding-top: 20px;
}
.inner_content {
border-radius: 20px;
padding: 0 20px 30px;
}
.intro_copy{
font-size: 1.6rem;
padding-top: 40px;
margin-bottom: 15px;
}
.profile_box {
width: 95%;
border-radius: 10px;
padding: 15px;
position: relative;
z-index: 2;
margin: -5% auto 20px auto;
right: 0px;
}
.name {
font-size: 1.6rem;
margin-bottom: 10px;
}
.city {
width: 100%;
border-radius: 20px;
padding: 5px 10px;
font-size: 1.3rem;
}
.city li {
margin-right: 10px;
}
.txt {
line-height: 180%;
margin-bottom: 20px;
}
.sub-image {
margin: 0 auto 20px;
}
.sub-image:last-of-type {
margin-bottom: 0;
}
.link_btn_box {
margin-bottom: 30px;
}
}

/*-------------------------------------------------
関連記事
-------------------------------------------------*/

.sec_relation {
margin-bottom: 50px;
}
.sec_relation h4 {
font-size: 2.4rem;
font-weight: 700;
color: #222;
letter-spacing: 0.2em;
line-height: 100%;
margin-bottom: 30px;
margin-left: 5px;
}
.content_box {
width: calc(33.3333333% - 40px / 3);
margin-right: 20px;
margin-bottom: 30px;
}
.content_box:nth-child(3n) {
margin-right: 0px;
}
.content_imgbox {
width: 100%;
border-radius: 15px;
overflow: hidden;
margin-bottom: 15px;
}
.content_imgbox img {
width: 100%;
transition-duration: 0.7s;
border-radius: 15px;
}
.content_imgbox img:hover {
transform: scale(1.05);
transition-duration: 0.7s;
opacity: .8;
}
.sec_relation h5 {
font-size: 1.8rem;
line-height: 160%;
letter-spacing: 0.15em;
color: #222;
margin-bottom: 15px;
}
.re_profile_box dt {
font-size: 1.6rem;
font-weight: 700;
color: #222;
margin-bottom: 15px;
}
.re_profile_box dd {
font-size: 1.4rem;
color: #222;
margin-bottom: 5px;
}
.re_profile_box dd span {
color: rgb(251, 128, 61);
}
.content_box_wrap {
display: flex;
flex-wrap: wrap;
}

@media all and (max-width : 820px ){
.sec_relation h5 {
font-size: 1.6rem;
letter-spacing: 0.1em;
margin-bottom: 10px;
}
.re_profile_box dt {
font-size: 1.5rem;
margin-bottom: 10px;
}
}

@media all and (max-width : 767px ){
.sec_relation {
margin-bottom: 20px;
padding-top: 10px;
}
.sec_relation h4 {
font-size: 1.8rem;
margin-bottom: 20px;
}
.content_box {
width: 100%;
margin-right: 0px;
margin-bottom: 20px;
}
.content_imgbox {
border-radius: 10px;
margin-bottom: 10px;
}
.content_imgbox img {
border-radius: 10px;
}
.sec_relation h5 {
font-size: 1.6rem;
line-height: 150%;
letter-spacing: 0.1em;
}
.re_profile_box dt {
font-size: 1.4rem;
}
.re_profile_box dd {
font-size: 1.4rem;
margin-bottom: 5px;
}
.content_box_wrap {
display: flex;
flex-direction: column;
}
}