@charset "UTF-8";
/* CSS Document */

body main { overflow: visible; }

/* mainvisual ==================== */
.page_mvWrap {background: linear-gradient(rgba(237, 247, 229, 0.2),rgba(32,54,13,0.2)),
	url("../img/history/history_mv.jpg") no-repeat center center; background-size: cover;}
.page_mv__ttl { text-align: center;}
.page_mv__ttl .jp { display: block; margin-top:2vw; color: #fff;font-size: clamp(28px, 4vw, 50px);font-weight: 400;line-height: 1;text-shadow: 0 3px 6px #000;}

/* 個別ページ内　共通スタイル ==================== */
.inner {max-width: 1680px;}
.bg_texture_white { background-image: url("../img/location/bg_texture_white.webp"); background-position: center top; background-size: cover;padding: clamp(50px, 6vw, 100px) 0; }
.bg_texture_forest {background-image: url("../img/concept/bg_texture_forest.jpg");background-position: center top;background-size: cover;padding: clamp(50px, 6vw, 100px) 0;}
.bg_texture_forest * { color: #fff;}
@media screen and (max-width: 767px) {
  .bg_texture_forest { padding-bottom: 0;}
}
.flex { display: flex; flex-flow: row wrap; justify-content: space-between;}
.flex.reverse { display: flex; flex-flow: row-reverse wrap;}
.HeadtitleWrap h3 span { display: block; font-size: clamp(13px, 1.3vw, 20px); letter-spacing: .2em; }
.HeadtitleWrap p { font-size: clamp(13px, 1.3vw, 20px); line-height: 2.6; margin: 10px auto 50px; }
p.capTxt {font-size: clamp(12px, 1.3vw, 22px); line-height: 2;}
figure + p.capTxt { margin-top: 10px;}
@media screen and (max-width: 767px) {
  .flex, .flex.reverse { flex-flow: column;}
  .HeadtitleWrap h3 { line-height: inherit;}
  .HeadtitleWrap p { margin-bottom: 30px; }
}
/* 個別ページ内　共通スタイル ==================== */



/* history_chronology ==================== */
.history_chronology {padding: clamp(50px, 6vw, 100px) 0;}
.history_chronology .flex { align-items: center;}
.chronology_left { width: 68%;}
.chronology_left .HeadtitleWrap p { margin-top: 30px;}
.chronology_right { width: 30%;}
.chronology_right .profile_photo { max-width: 80%; margin-left: auto;}
.chronology_right .residence_photo { max-width: 80%; margin-top: 30px; margin-right: auto;}
/* */
@media screen and (max-width: 767px) {
  .chronology_left,
  .chronology_right { width: 100%;}
  .chronology_left .HeadtitleWrap p { margin-top: 10px;}
  .chronology_right { display: flex; flex-flow: row wrap; justify-content: space-between;}
  .chronology_right .profile_photo,
  .chronology_right .residence_photo { width: 48%; margin: auto;}
}

/* history_inheritance ==================== */
.inheritance_box + .inheritance_box { margin-top: clamp(30px, 3vw, 60px); padding-top: clamp(30px, 3vw, 60px); border-top: 1px solid #fff;}
.inheritance_box .flex { align-items: center;}
.inheritance_left { width: 48%;}
.inheritance_right { width: 48%;}
.inheritance_box .inheritance_con02 { justify-content: space-between; align-items: flex-end; max-width: 70vw; margin: clamp(50px, 4vw, 70px) auto 0;}
.inheritance_con02 .inheritance_left { width: 40%;}
.inheritance_con02 .inheritance_right { width: 58%;}
.inheritance_con04 .capTxt { text-align: right;}
/* */
@media screen and (max-width: 767px) {
  .history_inheritance { padding-bottom: 30px;}
  .inheritance_left,
  .inheritance_right,
  .inheritance_con02 .inheritance_left,
  .inheritance_con02 .inheritance_right { width: 100%;}
  .inheritance_box .inheritance_con02 { max-width: inherit;}
  .inheritance_con02 .inheritance_left { order: 2; margin-top: 10px;}
  .inheritance_con02 .inheritance_right { order: 1;}
}


/* history_interview ==================== */
.history_interview { padding: clamp(40px, 3vw, 60px) 0;}
.interview_title { margin-bottom: clamp(40px, 3vw, 60px); padding: 5px 0 3px; border-top: 1px solid #000; border-bottom: 1px solid #000; font-size: clamp(20px, 2vw, 35px); text-align: center;}
.interview_con01.flex { align-items: flex-start;}
.interview_con01 .interview_profile { width: 30%; padding: 0 max(60px, calc((100vw - 1560px) / 2)) 30px 30px; border-left: 1px solid #000; border-bottom: 1px solid #000;}
.interview_con01 .interview_profile .title { margin: 10px 0 0; letter-spacing: .2em;}
.interview_con01 .interview_profile .position { margin-bottom: 10px;}
.interview_con01 .interview_profile .name { margin-bottom: 15px; font-size: clamp(20px, 2vw, 35px); line-height: 1;}
.interview_con01 .interview_profile .name span { display: inline-block; margin-left: 5px; font-size: clamp(13px, 1.2vw, 18px);}
.interview_con01 .interview_profile .profile { font-size: clamp(13px, 1.3vw, 20px); line-height: 2.2;}
.interview_con01 .interview_left {width: 63%;}
.interview_con01 .interview_left .interview_box { padding-left: max(60px, calc((100vw - 1560px) / 2));}
.interview_con01 .interview_left .interview_box + .interview_box { margin-top: clamp(30px, 4vw, 70px); padding-top: clamp(30px, 4vw, 70px); border-top: 1px solid #000;}

.interview_con02 { padding: clamp(40px, 3vw, 60px) 0; border-top: 1px solid #000;}
.interview_con02 .flex > div { width: 48%;}
.interview_con02 .capTxt { text-align: right;}

.interview_con03 .interview_left { width: 55%; padding-right: max(60px, calc((100vw - 1560px) / 2));}
.interview_con03 .interview_right { width: 42%;}
.interview_con03 .interview_meaning { width: 100%;}
.interview_con03 .interview_meaning p { font-size: clamp(13px, 1.4vw, 25px); line-height: 2.6; margin: 30px auto 50px; }

.interview_con04 { padding: clamp(30px, 3vw, 60px) 0; border-top: 1px solid #000;}
.interview_con04 .interview_box { width: 48%;}
.interview_con04 .capTxt { text-align: right;}

.interview_con05 { padding: clamp(30px, 3vw, 60px) 0; border-top: 1px solid #000;}
.interview_con05 .inner::after { content: ""; display: block; clear: both;}
.interview_con05 figure.fr { float: right; width: 25%; margin-top: 15vw; shape-outside: inset(15vw 0 0 0);}

.interview_con06 { padding: clamp(30px, 3vw, 60px) 0; border-top: 1px solid #000;}

/* */
@media screen and (max-width: 850px) {
  .interview_con01 .interview_profile { padding: 0 max(15px, calc((100vw - 1560px) / 2)) 15px 15px;}
  .interview_con01 .interview_left .interview_box { padding-left: max(15px, calc((100vw - 1560px) / 2));}
  .interview_con03 .interview_left { padding-right: max(15px, calc((100vw - 1560px) / 2));}
}
@media screen and (max-width: 767px) {
  .interview_con01 .interview_profile,
  .interview_con01 .interview_left,
  .interview_con03 .interview_left,
  .interview_con03 .interview_right,
  .interview_con04 .interview_box,
  .interview_con05 figure.fr { width: 100%;}
  .interview_con01 .interview_profile,
  .interview_con01 .interview_left .interview_box,
  .interview_con03 .interview_left,
  .interview_con03 .interview_right { padding: 0 15px;}
  .interview_con02 .flex { flex-flow: row wrap;}

  .interview_con01 .interview_profile { padding-bottom: 30px; border-left: none;}
  .interview_con01 .interview_left .interview_box { padding-top: 30px;}
  .interview_con03 { padding-bottom: 30px;}
  .interview_con03 .interview_right { order: 3;}
  .interview_con03 .interview_meaning { order: 2;}
  .interview_con03 .interview_meaning p { margin: 0 auto 30px;}
  .interview_con05 .inner { display: flex; flex-flow: column;}
  .interview_con05 figure.fr { float: none; margin-top: 0; order: 2;}
  .interview_con05 .HeadtitleWrap { order: 1;}
  .interview_con06 { padding-bottom: 0;}
}

/* history_feature ==================== */
.feature_con .feature_left { width: 59%;}
.feature_con .feature_right { width: 38%;}
@media screen and (max-width: 767px) {
  .feature_con .feature_left,
  .feature_con .feature_right { width: 100%;}
}






@media only screen and (min-width: 768px) and (max-width: 1300px) {}
@media only screen and (min-width: 768px) {}
@media only screen and (max-width: 767px) {}