/*============================
#main
============================*/
#main {
  background: #fff;
  position: relative;
  /*============================
  .obi-ttl
  ============================*/
  /*============================
  #person-ttl
  ============================*/
}

#main .obi-ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0.3472222222vw 0;
  border-bottom: 0.2777777778vw solid #000;
  background: #fff;
}

@media screen and (max-width: 767px) {
  #main .obi-ttl {
    padding: 4px 0;
    border-bottom: 4px solid #000;
  }
}

#main .obi-ttl span {
  font-family: "Raleway", sans-serif !important;
  font-weight: 400 !important;
  font-size: 1.8055555556vw;
  letter-spacing: 0.04em;
  line-height: 2.5vw;
  text-transform: uppercase;
  padding: 0 1em;
}

@media screen and (max-width: 767px) {
  #main .obi-ttl span {
    font-size: 14px;
    line-height: 32px;
  }
}

@media screen and (max-width: 767px) {
  #main .obi-ttl span:nth-of-type(1) {
    display: none;
  }
}

#main .obi-ttl span:nth-of-type(2) {
  border-left: 2px solid #000;
  border-right: 2px solid #000;
}

@media screen and (max-width: 767px) {
  #main .obi-ttl span:nth-of-type(2) {
    margin-left: 23px;
  }
}

#main #person-ttl {
  background-image: url("../img/mainvis_bg.jpg");
  background-size: cover;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  border-bottom: 2px solid #000;
  position: relative;
  margin-bottom: 24.1666666667vw;
}

@media screen and (max-width: 767px) {
  #main #person-ttl {
    background: none;
    display: block;
    border: none;
    padding: 20px;
    margin-bottom: 25px;
  }
}

#main #person-ttl p.big-name {
  position: absolute;
  /* right: 0.2777777778vw; */
  right: -1.2vw;
  top: 0;
  /* width: 7.7083333/333vw; */
  width: 11.5vw;
  z-index: 1;
}

@media screen and (max-width: 767px) {
  #main #person-ttl p.big-name {
    display: none;
  }
}

#main #person-ttl figure.mainvis {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 57.3611111111vw;
  flex: 0 0 57.3611111111vw;
  margin-bottom: 7.9166666667vw;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
}

@media screen and (max-width: 767px) {
  #main #person-ttl figure.mainvis {
    margin: auto;
    border: 2px solid #000;
  }
}

#main #person-ttl .prof {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 32.9861111111vw;
  flex: 0 0 32.9861111111vw;
  background: #D5957D;
  border: 2px solid #000;
  margin-bottom: 4.2361111111vw;
  margin-left: -0.1388888889vw;
  position: relative;
  padding: 5.3472222222vw 2.3611111111vw 4.1666666667vw;
  font-family: "Noto Sans JP", sans-serif !important;
  font-weight: 500 !important;
}

@media screen and (max-width: 767px) {
  #main #person-ttl .prof {
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 67px;
    padding: 40px 22px;
    margin-top: -2px;
  }
}

#main #person-ttl .prof dl {
  position: absolute;
  left: -0.1388888889vw;
  top: -4.1666666667vw;
}

@media screen and (max-width: 767px) {
  #main #person-ttl .prof dl {
    left: -2px;
    top: -49.5px;
  }
}

#main #person-ttl .prof dl dt span,
#main #person-ttl .prof dl dd span {
  line-height: 2.5694444444vw;
  display: inline-block;
  padding: 0 1em;
  border: 2px solid #000;
  margin-right: 3px;
}

@media screen and (max-width: 767px) {

  #main #person-ttl .prof dl dt span,
  #main #person-ttl .prof dl dd span {
    font-size: 13px;
    line-height: 29px;
    white-space: nowrap;
  }
}

#main #person-ttl .prof dl dt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

#main #person-ttl .prof dl dt span {
  background: #000;
  color: #fff;
  font-size: 1.1111111111vw;
}

@media screen and (max-width: 767px) {
  #main #person-ttl .prof dl dt span {
    font-size: 3.467vw;
    line-height: 7.733vw;
  }
}

#main #person-ttl .prof dl dd span {
  background: #F0CBB8;
}

#main #person-ttl .prof p.organization {
  font-size: 1.0416666667vw;
  line-height: 1.7333;
}

@media screen and (max-width: 767px) {
  #main #person-ttl .prof p.organization {
    font-size: 13px;
    line-height: 1.5384615385;
  }
}

#main #person-ttl .prof p.namae {
  font-size: 2.7777777778vw;
  line-height: 1.5;
  margin-bottom: 0.8em;
}

@media screen and (max-width: 767px) {
  #main #person-ttl .prof p.namae {
    font-size: 26px;
    line-height: 2.5;
  }
}

#main #person-ttl .prof p.history {
  font-size: 1.0416666667vw;
  line-height: 1.7333;
}

@media screen and (max-width: 767px) {
  #main #person-ttl .prof p.history {
    font-size: 13px;
    line-height: 1.5384615385;
  }

  #main #person-ttl .prof p.history br {
    display: none;
  }
}

#main #person-ttl p.num {
  position: absolute;
  left: 4.7222222222vw;
  bottom: 4.8611111111vw;
  font-family: "Raleway", sans-serif !important;
  font-weight: 400 !important;
  font-size: 13.8888888889vw;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #fff;
  text-shadow: 2px 2px 0 #000, -2px -2px 0 #000, -2px 2px 0 #000, 2px -2px 0 #000, 0px 2px 0 #000, 0 -2px 0 #000, -2px 0 0 #000, 2px 0 0 #000;
}

@media screen and (max-width: 767px) {
  #main #person-ttl p.num {
    font-size: 67px;
    letter-spacing: 0.04em;
    line-height: 1;
    left: 33px;
    bottom: 418px;
    bottom: auto;
    top: 70px;
    top: 100px;
    text-shadow: 1px 1px 0 #000, -1px -1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, 0px 1px 0 #000, 0 -1px 0 #000, -1px 0 0 #000, 1px 0 0 #000;
  }
}

#main #person-ttl p.label-copy {
  position: absolute;
  left: 4.7222222222vw;
  bottom: -16.6666666667vw;
}

@media screen and (max-width: 767px) {
  #main #person-ttl p.label-copy {
    position: relative;
    left: auto;
    bottom: auto;
    margin-top: -20px;
  }
}

#main #person-ttl p.label-copy span {
  font-family: "Noto Sans JP", sans-serif !important;
  font-weight: 700 !important;
  font-size: 3.9583333333vw;
  letter-spacing: 0.02em;
  line-height: 6.5972222222vw;
  display: inline-block;
  background: #fff;
  border: 2px solid #000;
  margin-top: -0.1388888889vw;
  padding: 0 1.25vw;
  white-space: nowrap;
}

@media screen and (max-width: 767px) {
  #main #person-ttl p.label-copy span {
    font-size: 21px;
    font-size: 5.6vw;
    letter-spacing: 0.02em;
    line-height: 41px;
    margin: -2px 0 0 0;
    padding: 0 0.3em;
  }
}

#main #person-ttl p.label-copy span strong {
  color: #CC0033;
}

#main .content {
  position: relative;
}

@media screen and (max-width: 767px) {
  #main .content {
    padding: 0 22px !important;
    width: auto !important;
    margin: 0 auto 67px !important;
  }
}

#main .content .ttl-group h2.ttl1 {
  line-height: 1;
}

@media screen and (max-width: 767px) {
  #main .content .ttl-group h2.ttl1 {
    position: static !important;
    text-align: center;
  }
}

#main .content .ttl-group h2.ttl1 span {
  font-family: "Noto Sans JP", sans-serif !important;
  font-weight: 700 !important;
  display: inline-block;
  line-height: 3.0555555556vw;
  font-size: 1.5972222222vw;
  border: 0.1388888889vw solid #000;
  padding: 0 0.7em;
  letter-spacing: 0.04em;
}

@media screen and (max-width: 767px) {
  #main .content .ttl-group h2.ttl1 span {
    font-size: 18px;
    letter-spacing: 0.04em;
    line-height: 35px;
    border: 2px solid #000;
  }
}

@media screen and (max-width: 767px) {
  #main .content .ttl-group h2.ttl1::after {
    content: "";
    display: block;
    width: 1px;
    height: 25px;
    background: #000;
    margin: 20px auto;
  }
}

@media screen and (max-width: 767px) {
  #main .content .ttl-group h3.ttl2 {
    -webkit-transform: none !important;
    transform: none !important;
    position: static !important;
    margin-bottom: 31px !important;
  }
}

#main .content .ttl-group h3.ttl2 strong {
  font-family: "Noto Sans JP", sans-serif !important;
  font-weight: 700 !important;
  display: inline-block;
  line-height: 4.5138888889vw;
  font-size: 2.6388888889vw;
  border: 0.1388888889vw solid #000;
  margin-top: 1.1111111111vw;
  background: #CC0033;
  color: #ffffff;
  padding: 0 0.35em;
  white-space: nowrap;
}

@media screen and (max-width: 767px) {
  #main .content .ttl-group h3.ttl2 strong {
    font-size: 22px;
    font-size: 5.867vw;
    font-size: 5.3vw;
    letter-spacing: 0.02em;
    line-height: 41px;
    border: 2px solid #000;
    margin-top: -2px;
  }
}

#main .content .ttl-group h3.ttl2 strong:nth-of-type(1) {
  margin-top: 0;
}

#main .content p {
  font-family: "Noto Sans JP", sans-serif !important;
  font-weight: 500 !important;
  font-size: 1.1111111111vw;
  letter-spacing: 0.04em;
  line-height: 1.875;
  margin-bottom: 1em;
}

@media screen and (max-width: 767px) {
  #main .content p {
    font-size: 14px;
    line-height: 1.8571428571;
    position: static !important;
    float: none !important;
  }
}

#main .content p strong {
  font-family: "Noto Sans JP", sans-serif !important;
  font-weight: 900 !important;
}

#main .content p small {
  font-size: 0.7638888889vw;
  letter-spacing: 0.04em;
  line-height: 1.6363636364;
  display: inline-block;
}

#main .content.content1 {
  width: 60.1388888889vw;
  padding-left: 14.3055555556vw;
  margin-left: 11.4583333333vw;
}

#main .content.content1 .ttl-group h2 {
  margin-bottom: 4.1666666667vw;
}

#main .content.content1 .ttl-group h3 {
  position: absolute;
  left: 0;
  top: -10.9027777778vw;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
}

#main .content.content2 {
  width: 49.2361111111vw;
  padding-left: 12.6388888889vw;
  margin-top: 18.8055555556vw;
  margin-left: 29.0277777778vw;
  margin-bottom: 5.6805555556vw;
}

#main .content.content2 .ttl-group h2 {
  position: absolute;
  left: 0;
  top: 0;
}

#main .content.content2 .ttl-group h3 {
  margin-bottom: 3.6111111111vw;
}

#main .content.schedule {
  padding: 2.9861111111vw 6.9444444444vw 10.7638888889vw;
}

#main .content.schedule .ttl-group {
  margin-bottom: 4.4444444444vw;
}

@media screen and (max-width: 767px) {
  #main .content.schedule figure {
    overflow-x: auto;
  }
}

@media screen and (max-width: 767px) {
  #main .content.schedule figure img {
    width: 1000px;
  }
}

#main .content.content3 {
  width: 73.0555555556vw;
  margin-left: 10vw;
  margin-bottom: 6.6805555556vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}

@media screen and (max-width: 767px) {
  #main .content.content3 {
    display: block;
  }
}

#main .content.content3 .ttl-group {
  margin-right: 2em;
}

#main .content.content3 .ttl-group h2 {
  margin-bottom: 4.2361111111vw;
}

#main .content.content3 p {
  float: right;
}

@media screen and (max-width: 767px) {
  #main .content.content3 p {
    float: none;
  }
}

#main .content.scenery {
  padding: 0 6.9444444444vw 11.1111111111vw;
}

#main .content.scenery .ttl-group {
  margin-bottom: 3.3333333333vw;
}

#main .content.scenery .flex {
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

@media screen and (max-width: 767px) {
  #main .content.scenery .flex {
    display: block;
  }
}

#main .content.scenery .flex figure {
  position: relative;
  border: 1px solid #000;
  border-right: none;
}

@media screen and (max-width: 767px) {
  #main .content.scenery .flex figure {
    border: 1px solid #000;
    margin-bottom: 18px;
  }
}

#main .content.scenery .flex figure figcaption {
  position: absolute;
  left: -1px;
  bottom: 0;
  line-height: 1;
}

@media screen and (max-width: 767px) {
  #main .content.scenery .flex figure figcaption {
    left: -1px !important;
    bottom: -1px !important;
    top: auto !important;
    right: auto !important;
    text-align: left !important;
  }
}

#main .content.scenery .flex figure figcaption span {
  display: inline-block;
  background: #ffffff;
  color: #CC0033;
  font-size: 0.9722222222vw;
  line-height: 1.875vw;
  border: 1px solid #000;
  padding: 0 0.5em;
  margin-bottom: -1px;
}





@media screen and (max-width: 767px) {
  #main .content.scenery .flex figure figcaption span {
    font-size: 14px;
    line-height: 1.5;
  }
}

#main .content.scenery .flex figure:nth-of-type(1) {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 27.4137931034%;
  flex: 0 0 27.4137931034%;
}

#main .content.scenery .flex figure:nth-of-type(2) {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 27.0689655172%;
  flex: 0 0 27.0689655172%;
}

#main .content.scenery2 .flex figure:nth-of-type(1) {
  -ms-flex: 0 0 48%;
  flex: 0 0 48%;
}

#main .content.scenery2 .flex figure:nth-of-type(2) {
  border-right: 1px solid #000;
  -ms-flex: 0 0 52%;
  flex: 0 0 52%;
}

#main .content.scenery .flex figure:nth-of-type(2) figcaption {
  left: auto;
  bottom: auto;
  right: -1px;
  top: 0;
  text-align: right;
}

#main .content.scenery .flex figure:nth-of-type(2) figcaption span {
  margin-top: -1px;
  margin-bottom: 0;
}

#main .content.scenery .flex figure:nth-of-type(3) {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 45.5172413793%;
  flex: 0 0 45.5172413793%;
  border-right: 1px solid #000;
}

#main .content.scenery p {
  width: 45.4310344828%;
  margin-top: -6.9444444444vw;
}

#main .content.scenery2 p {
  width: 46%;
	margin-top: 0vw;
}

@media screen and (max-width: 767px) {
  #main .content.scenery p {
    width: auto;
    margin: auto;
  }
}

#main .content.worklife {
  width: 75.3472222222vw;
  margin-left: 11.9444444444vw;
}

@media screen and (max-width: 767px) {
  #main .content.worklife {
    width: auto;
    margin-left: auto;
  }
}

#main .content.worklife .ttl-group {
  width: 25.7638888889vw;
}

@media screen and (max-width: 767px) {
  #main .content.worklife .ttl-group {
    width: auto;
  }
}

#main .content.worklife p {
  width: 25.7638888889vw;
  margin: 4.7222222222vw 0 2.7777777778vw;
}

@media screen and (max-width: 767px) {
  #main .content.worklife p {
    width: auto;
    margin: auto;
  }
}

#main .content.worklife figure.graph {
  width: 45.625vw;
  position: absolute;
  right: 0;
  top: 0;
}

@media screen and (max-width: 767px) {
  #main .content.worklife figure.graph {
    width: auto;
    position: static;
    margin: 30px 0;
  }
}

#main .content.worklife figure.photo {
  width: 25.7638888889vw;
}

@media screen and (max-width: 767px) {
  #main .content.worklife figure.photo {
    width: auto;
  }
}

#main .content.worklife figure.photo img {
  border: 1px solid #000;
}

#main .content.content4 {
  width: 68.75vw;
  padding: 0 0 14.4166666667vw 17.4305555556vw;
  margin-left: 18vw;
}

#main .content.content4 .ttl-group h2 {
  position: absolute;
  left: 0;
  top: 0;
}

#main .content.content4 .ttl-group h3 {
  margin-bottom: 3.6111111111vw;
}



/* -------------- #pserson------------------ */
#person12 .content.content1 .ttl-group h3,
#person11 .content.content1 .ttl-group h3,
#person10 .content.content1 .ttl-group h3,
#person04 .content.content1 .ttl-group h3,
#person00 .content.content1 .ttl-group h3,
#person09 .content.content1 .ttl-group h3,
#person08 .content.content1 .ttl-group h3 {
  position: absolute;
  left: 0;
  left: -4.5138888889vw;
  top: -16.6666666667vw;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
}

#person00 #person-ttl {
  background-image: url("../img/08-mainvis-bg.jpg");
}
#person01 #person-ttl {
  background-image: url("../img/09-mainvis_bg.jpg");
}

#person02 #person-ttl {
  background-image: url("../img/02-mainvis_bg.jpg");
}

#person03 #person-ttl {
  background-image: url("../img/03-mainvis_bg.jpg");
}

#person04 #person-ttl {
  background-image: url("../img/01-mainvis-bg.jpg");
}

#person05 #person-ttl {
  background-image: url("../img/05-mainvis_bg.jpg");
}

#person06 #person-ttl {
  background-image: url("../img/04-mainvis-bg.jpg");
}

#person07 #person-ttl {
  background-image: url("../img/05-mainvis-bg.jpg");
}

#person08 #person-ttl {
  background-image: url("../img/02-mainvis_bg.jpg");
}

#person09 #person-ttl {
  background-image: url("../img/06-mainvis_bg.jpg");
}

#person10 #person-ttl {
  background-image: url("../img/10-mainvis_bg.jpg");
}

#person11 #person-ttl {
  background-image: url("../img/11-mainvis_bg.jpg");
}

#person12 #person-ttl {
  background-image: url("../img/12-mainvis_bg.jpg");
}
/*

#person13 #person-ttl {
  background-image: url("../img/14-mainvis_bg.jpg");
}

#person14 #person-ttl {
  background-image: url("../img/15-mainvis_bg.jpg");
}

*/








/* #even .flex-even-block */
.flex-even {
  display: flex;
  max-width: 100%;
  margin-inline: auto;
  align-items: flex-start;
}

@media screen and (max-width: 767px) {
  .flex-even {
    display: flex;
    flex-direction: column;
  }
}

@media screen and (max-width: 767px) {
  .flex-even-block {
    display: contents;
  }
}

.flex-even-block {
  display: content;
}

@media screen and (max-width: 767px) {
  .flex-even-block {
    display: contents;
  }
}

.even-1-image {
  position: relative;
  border-right: none;
  flex: 0 0 47.4137%;
  border: 1px solid #000;
  border-right: none;

}

@media screen and (max-width: 767px) {
  .even-1-image {
    order: 1;
    margin-bottom: 18px;
    border: 1px solid #000;
  }
}

.flex-even-text {
  font-size: 16px;
  letter-spacing: 0.04em;
  line-height: 1.875;
  width: 80%;
  font-family: "Noto Sans JP", sans-serif !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em;
  font-size: 1.1111111111vw;
  line-height: 1.875;
  margin-bottom: 1em;
  margin-top: 60px;
  margin-top: 3.9444444444vw;
}

@media screen and (max-width: 767px) {
  .flex-even-text {
    order: 3;
    width: auto;
    margin: auto;
    font-size: 14px;
  }
}

.even-2-image {
  position: relative;
  flex: 0 0 52.5862%;
}

.even-2-image img {
  border: 1px solid #000;
}

@media screen and (max-width: 767px) {
  .even-2-image {
    order: 2;
    margin-bottom: 18px;
  }
}

.flex-even figcaption {
  position: absolute;
}

.flex-even .even-1-image figcaption {
  top: 0px;
  right: 0;
}

.flex-even .even-2-image figcaption {
  bottom: 0;
  left: 0;
}


@media screen and (max-width: 767px) {

  .flex-even .even-1-image figcaption,
  .flex-even .even-2-image figcaption {
    top: auto;
    right: auto;
    bottom: 0;
    left: 0;
  }
}

.even-1-image span,
.even-2-image span {
  display: inline-block;
  background: #00B6AB;
  font-size: 0.9722222222vw;
  line-height: 1.875vw;
  border: 1px solid #000;
  padding: 0 0.5em;
  margin-bottom: -1px;
}

@media screen and (max-width: 767px) {

  .even-1-image span,
  .even-2-image span {
    font-size: 14px;
    line-height: 1.5;
  }
}

.content_block {
	position: absolute;
  top: -11vw;
  left: 0;
  font-family: "Raleway", sans-serif !important;
  font-weight: 400 !important;
  font-size: 8vw;
  letter-spacing: 0.04em;
  line-height: 1;
  color: #fff;
  text-shadow: 2px 2px 0 #000, -2px -2px 0 #000, -2px 2px 0 #000, 2px -2px 0 #000, 0px 2px 0 #000, 0 -2px 0 #000, -2px 0 0 #000, 2px 0 0 #000;
}

.schedule .content_block {
	top: -8vw;
	left: 6.9444444444vw;
}

@media screen and (max-width: 767px) {
	.content_block {
		position: relative;
		top: auto;
		left: auto;
		text-align: center;
		text-shadow: 1px 1px 0 #000, -1px -1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, 0px 1px 0 #000, 0 -1px 0 #000, -1px 0 0 #000, 1px 0 0 #000;
		margin-bottom: 20px;
  font-size: 12vw;
	}
	
	.schedule .content_block {
		top: auto;
		left: auto;
	}
}