:root {
     /* --base-color: #0db353; */
     /* --base-color: #5d4c9c; */
     --gray-people: #23385b9e;
 }

 .base-color {
     color: var(--base-color);
 }

 /* 1100px以下で右端の余白を回避 */
 @media screen and (max-width: 1100px) {
     body {
         width: fit-content !important;
     }
 }

 .head-set-h1 {
     background-color: var(--base-color);
 }

 .head-pic-set .head-tit-set {
     background-color: var(--gray-people);
     padding: 30px 20px;
     width: 400px;
     top: 50%;
     right: 2%;
     transform: translateY(-50%);
 }

 .head-pic-set .head-tit-set h2 {
     border-left: 4px solid #fff;
     padding-left: 15px;
     margin-bottom: 1.5em;
 }

 h2 {
     color: var(--base-color)
 }

 h2::after {
     background: var(--base-color);
 }

 .peoples-wrap {
     background-color: var(--base-color);
 }

 .peoples {
     display: flex;
     justify-content: center;
     align-items: center;
     color: #fff;
 }

 .peoples:first-child {
     transform: translateX(4%);
 }

 .peoples-wrap .col-2-colmn {
     padding-top: 50px;
     padding-bottom: 50px;
 }

 .peoples img {
     width: auto;
     height: 100%;
 }

 p.circle-img {
     width: 130px;
     height: 130px;
     border-radius: 50%;
     background-position: center;
     display: inline-block;
     background-size: cover;
     box-sizing: border-box;
 }

 .peoples p {
     padding-left: 30px;
     font-size: 14px;
     font-weight: normal;
     line-height: 2.2rem;
 }

 .peoples p span {
     display: inline-block;
     font-size: 24px;
     font-weight: normal;
     padding-bottom: 1em;
 }

 div.txt-x {
     text-align: center;
 }

 div.txt-x img {
     font-weight: 100;
     text-align: center;
     position: absolute;
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
     width: 50px;
     height: auto;
 }

 .lead {
     overflow-wrap: break-word;
     width: 70%;
     margin: 0 auto 50px;
     text-align: center;
 }

 .lead p {
     text-align: left;
     margin-bottom: 30px;
     width: 100%;
 }

 .lead img {
     width: 100%;
 }

 /* .cross-talk */
 .cross-talk {
     margin-bottom: 40px;
 }

 .cross-talk p {
     font-weight: bold;
     margin-bottom: 15px;
 }

 .cross-talk dl {
     display: flex;
     margin-bottom: 20px;
 }

 .cross-talk dt {
     width: 45px;
     height: 20px;
     line-height: 20px;
     margin-right: 25px;
     text-align: center;
     border-radius: 1px;
     margin-top: 4px;
 }

 .cross-talk dt.a {
     background-color: var(--base-color);
     color: white;
 }

 .cross-talk dt.b {
     background-color: #e8e8e8;
     color: var(--base-color)
 }

 .cross-talk dd {
     width: calc(100% - 70px);
 }

 /* .pic-bnr-box */
 .pic-bnr-box {
     display: flex;
     justify-content: center;
     align-items: center;
     width: 100%;
     height: 100px;
     transition: all 0.2s;
 }

 .pic-bnr-box:hover {
     background-color: #41669f;
 }

 .pic-bnr-box p {
     height: auto;
     padding: 0;
 }

 .col-2-colmn.under {
     display: flex;
     flex-direction: column;
     flex-wrap: wrap;
     height: 650px;
 }

 .col-2-colmn.under .col-2-box {
     width: 520px;
 }

 .col-2-colmn.under .col-2-box:first-child {
     padding-right: 60px;
 }

 .col-2-box p {
     font-size: 13px;
 }

 .contents-wrap.talk {
     padding-bottom: 0;
 }

 .txt-center {
     text-align: center;
 }


 @media screen and (max-width: 812px),
 only screen and (-webkit-min-device-pixel-ratio: 2) and (max-device-width: 667px) and (min-device-width: 375px) and (orientation: landscape),
 only screen and (-webkit-min-device-pixel-ratio: 3) and (max-device-width: 736px) and (min-device-width: 414px) and (orientation: landscape) {

     .lead {
         width: calc(100% + 30px);
         position: relative;
         left: -15px;
     }

     .lead p {
         width: calc(100% - 30px);
         padding: 0 15px;
     }

     .contents-wrap.talk {
         padding-top: 20px;
         padding-bottom: 30px;
     }

     /* .peoples {
         justify-content: flex-start;
         padding-left: 27%;
     } */

     .peoples-wrap .col-2-colmn {
         padding-top: 30px;
         padding-bottom: 30px;
     }

     .peoples p {
         padding-left: 35px;
     }

     .peoples p.text {
         width: 152px
     }

     p.circle-img {
         margin-left: 30px;
     }

     .head-pic-set .head-tit-set {
         width: 100%;
         padding: 20px;
         transform: none;
     }

     div.txt-x {
         padding: 20px;
     }

     div.txt-x img {
         text-align: center;
         position: static;
         transform: none;
         width: 40px;
     }

     .col-2-colmn.under {
         display: block;
         height: auto;
     }

     .col-2-colmn.under .col-2-box {
         width: 100%;
     }

     .col-2-colmn.under .col-2-box:first-child {
         padding-right: 0;
     }

     .peoples:first-child {
         transform: translateX(0);
     }
 }