@charset "UTF-8";
@-webkit-keyframes loop {
0% {
   transform: translateX(100%);
}

to {
   transform: translateX(-100%);
}
}

@keyframes loop {
0% {
   transform: translateX(100%);
}

to {
   transform: translateX(-100%);
}
}

@-webkit-keyframes loop2 {
0% {
   transform: translateX(0);
}

to {
   transform: translateX(-200%);
}
}

@keyframes loop2 {
0% {
   transform: translateX(0);
}

to {
   transform: translateX(-200%);
}
}

/* ========================================
   @media screen and (min-width: 768px),print
======================================== */
@media screen and (min-width: 768px),print {
#staff .main-ttl-wrap {
   margin-bottom: 0;
}
#staff .seo_bread_list {
   max-width: 1200px;
   padding: 16px 0;
}
#staff .seo_bread_list,
#staff .seo_bread_list a {
   color: #fff;
}
/* mv
-------------------------------------*/
.mv {
   background: url(../images/staff/mv-bg.png)no-repeat;
   background-size: cover;
   padding-bottom: 295px;
}
.mv h2 {
   font-weight: 500;
   font-size: 36px;
   letter-spacing: 0.05em;
   text-align: center;
   color: #fff;
   padding: 77px 0 0;
   margin-bottom: 31px;
}
.mv .txt {
   font-weight: 500;
   font-size: 14px;
   letter-spacing: 0.05em;
   line-height: 2.285714;
   text-align: center;
   color: #fff;
}
.mv .loop {
   overflow: hidden;
   padding: 53px 0 79px;
}
.mv .loop .loop__box {
   display: flex;
   width: 100vw;
}
.mv .loop .loop__box img {
   min-width: 106.25vw;
}
.mv .loop .loop__box img:first-child {
   -webkit-animation: loop 50s -25s linear infinite;
   animation: loop 50s -25s linear infinite;
}
.mv .loop .loop__box img:last-child {
   -webkit-animation: loop2 50s linear infinite;
   animation: loop2 50s linear infinite;
}
.mv .lead {
   font-weight: 500;
   font-size: 36px;
   letter-spacing: 0.12em;
   line-height: 1.6111;
   text-align: center;
   color: #fff;
   padding-left: 5px;
}

/* section-wrap
-------------------------------------*/
.section-wrap {
   background: url(../images/staff/sec-bg.png)no-repeat;
   background-size: cover;
}

/* message
-------------------------------------*/
.message {
   width: min(95%, 1600px);
   margin-inline: auto;
   position: relative;
   top: -220px;
   padding-top: 100px;
   border-radius: 100px;
   background: #FFFFFF;
   margin-bottom: -62px;
}
.message .enttl {
   font-size: 12px;
   text-align: center;
   color: #3b8461;
   letter-spacing: 0;
}
.message h2 {
   font-weight: 500;
   font-size: 28px;
   letter-spacing: 0.05em;
   line-height: 2.25;
   text-align: center;
   margin-bottom: 64px;
}
.message h3 {
   font-weight: 500;
   font-size: 28px;
   letter-spacing: 0.05em;
   line-height: 1.785714;
   margin-bottom: 39px;
}
.message .txt {
   font-weight: 500;
   font-size: 16px;
   letter-spacing: 0.05em;
   line-height: 2.25;
   margin-bottom: 28px;
}
.message .txt:last-of-type {
   margin-bottom: 0;
}
.message .txt.bold {
   font-weight: 700;
   display: inline-block;
   background-position: top 30px center;
}
.message .txt.bold span {
   background: linear-gradient(transparent 60%, #E6FF00 40%);
}
.message .inBox01 {
   width: min(95%, 1200px);
   margin-inline: auto;
   display: grid;
   grid-template-columns: 48.3333% 46.6666%;
   gap: 60px;
   padding-bottom: 74px;
}
.message .inBox01 .photo {
   margin: 5px 0 0;
}
.message .inBox02 {
   width: min(95%, 1020px);
   margin-inline: auto;
   display: grid;
   grid-template-columns: 35.2941% 58.8235%;
   gap: 60px;
   padding-bottom: 90px;
}
.message .inBox02 .txt-box {
   margin: 16px 0 0;
}
.message .inBox02 .name {
   font-weight: 500;
   font-size: 22px;
   letter-spacing: 0.05em;
   line-height: 2.2727;
   text-align: right;
   padding: 36px 0 0;
}
.message .inBox02 .name span{
   font-weight: 500;
   font-size: 14px;
   letter-spacing: 0.05em;
   line-height: 1;
   display: block;
}
.message img {
   width: 100%;
   height: auto;
}

/* staff
-------------------------------------*/
.staff {
   text-align: center;
   margin-bottom: -106px;
}
.staff h2{
   font-weight: 500;
   font-size: 36px;
   letter-spacing: 0.05em;
   text-align: center;
   position: relative;
   margin-bottom: 2px;
   display: inline-block;
}
.staff h2::before {
   position: absolute;
   content: "";
   background: url(../images/staff/staff-ttl-deco.png)no-repeat;
   background-size: contain;
   width: 287px;
   height: 115px;
   top: -78px;
   left: -210px;
}
.staff h3{
   font-size: 24px;
   letter-spacing: 0.05em;
   line-height: 2.625;
   text-align: center;
   margin-bottom: 66px;
}
.staff .system-contents {
   width: min(95%, 1200px);
   margin-inline: auto;
   padding: 0 0 260px;
}
.staff .system-list {
   display: grid;
   grid-template-columns: repeat(1, minmax(0, 1fr));
   gap: 56px;
}
.staff .system-list li {
   background: #fff;
   box-shadow: 0px 20px 40px rgba(29, 29, 31, 0.1);
}
.staff .system-list li .inBox {
   padding: 56px 80px 44px;
   display: grid;
   grid-template-columns: 53.8461% 40.38%;
   gap: 60px;
   text-align: left;
}
.staff .system-job {
   font-weight: 500;
   font-size: 16px;
   letter-spacing: 0.05em;
   line-height: 2;
   margin-bottom: 2px;
}
.staff .system-ttl {
   font-weight: 500;
   font-size: 22px;
   letter-spacing: 0.05em;
   line-height: 1.45454;
   margin-bottom: 30px;
}
.staff .system-pic img {
   height: 480px;
}
.staff .pic {
   position: relative;
   padding: 4px 0 0;
}
.staff .system-list li .pic::after  {
   position: absolute;
   content: "";
   background-size: contain;
   width: 35px;
   height: 100%;
   top: -26px;
   right: 16px;
}
.staff .system-list li:nth-child(1) .pic::after  {
   background: url(../images/staff/staff01-subt.svg)no-repeat;
   background-size: contain;
}
.staff .system-list li:nth-child(2) .pic::after  {
   background: url(../images/staff/staff02-subt.svg)no-repeat;
   background-size: contain;
}
.staff-list {
   width: 100%;
   border-top: 1px solid #d8d8d8;
   font-size: 14px;
   letter-spacing: 0.05em;
   line-height: 1.714285714;
}
.staff-list .row {
   display: flex;
   border-bottom: 1px solid #d8d8d8;
}
.staff-list .label {
   background: #f6f6f6;
   width: 28.6%;
   padding: 12px 20px;
   font-weight: 500;
}
.staff-list .text {
   width: 71.4%;
   padding: 12px 20px;
   box-sizing: border-box;
}

.staff-list .row--2col {
   display: flex;
}

.staff-list .row--2col .item {
   display: flex;
   flex: 1;
}
.staff-list .row--2col .label {
   width: 160px;
}
.staff-list .row--2col .text {
   width: 120px;
}
}

/* ========================================
@media screen and (min-width:768px) and (max-width:1280px)
======================================== */
@media screen and (min-width:768px) and (max-width:1280px) {
/* message
-------------------------------------*/
.message h2 {
   font-size: clamp(1.625rem, 1.438rem + 0.39vw, 1.75rem);
   margin-bottom: 5vw;
}
.message h3 {
   font-size: clamp(1.625rem, 1.438rem + 0.39vw, 1.75rem);
   margin-bottom: 3.047vw;
}
.message .txt {
   font-size: clamp(0.875rem, 0.688rem + 0.39vw, 1rem);
   margin-bottom: 2.188vw;
}
.message .txt.bold {
   background-position: top 2.344vw center;
}
.message .inBox01 {
   width: 90.75vw;
   grid-template-columns: 48.3333% 46.6666%;
   gap: 4.688vw;
   padding-bottom: 5.781vw;
}
.message .inBox01 .photo {
   margin: 0.391vw 0 0;
}
.message .inBox02 {
   width: 79.688vw;
   grid-template-columns: 35.2941% 58.8235%;
   gap: 4.688vw;
   padding-bottom: 7.031vw;
}
.message .inBox02 .txt-box {
   margin: 1.25vw 0 0;
}
.message .inBox02 .name {
   font-size: clamp(1.25rem, 1.063rem + 0.39vw, 1.375rem);
   padding: 2.813vw 0 0;
}
.message .inBox02 .name span{
   font-size: clamp(0.75rem, 0.563rem + 0.39vw, 0.875rem);
}
  
/* staff
-------------------------------------*/
.staff h2{
   font-size: 2.813vw;
   margin-bottom: 0.156vw;
}
.staff h2::before {
   width: 22.422vw;
   height: 8.984vw;
   top: -6.094vw;
   left: -16.406vw;
}
.staff h3{
   font-size: 1.875vw;
   margin-bottom: 5.156vw;
}
.staff .system-contents {
   width: 93.75vw;
   padding: 0 0 20.313vw;
}
.staff .system-list {
   gap: 4.375vw;
}
.staff .system-list li .inBox {
   padding: 4.375vw 6.25vw 3.438vw;
   grid-template-columns: 53.8461% 40.38%;
   gap: 4.688vw;
}
.staff .system-job {
   font-size: clamp(0.875rem, 0.688rem + 0.39vw, 1rem);
   margin-bottom: 0.156vw;
}
.staff .system-ttl {
   font-size: clamp(1.25rem, 1.063rem + 0.39vw, 1.375rem);
   margin-bottom: 2.344vw;
}
.staff .system-pic img {
   height: 37.5vw;
}
.staff .pic {
   padding: 0.313vw 0 0;
}
.staff .system-list li .pic::after  {
   width: 2.734vw;
   top: -2.031vw;
   right: 1.25vw;
}
.staff-list {
   font-size: clamp(0.75rem, 0.563rem + 0.39vw, 0.875rem);
}
.staff-list .label {
   width: 28.6%;
   padding: 0.938vw 1.563vw;
}
.staff-list .text {
   width: 71.4%;
   padding: 0.938vw 1.563vw;
}
.staff-list .row--2col .label {
   width: 12.5vw;
}
.staff-list .row--2col .text {
   width: 9.375vw;
}
}

/* ========================================
   @media screen and (max-width: 767px)
======================================== */
@media screen and (max-width: 767px) {
#staff .main-ttl-wrap {
   margin-bottom: 0;
}
/* mv
-------------------------------------*/
.mv {
   background: url(../images/staff/mv-bg_sp.png)no-repeat;
   background-size: cover;
   padding-bottom: 32vw;
}
.mv h2 {
   font-weight: 500;
   font-size:5.314vw;
   letter-spacing: 0.05em;
   text-align: center;
   color: #fff;
   padding: 14.2vw 0 0;
   margin-bottom: 5.5vw;
}
.mv .txt {
   font-weight: 500;
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 2.142857;
   text-align: center;
   color: #fff;
   margin-bottom: 3.5vw;
}
.mv .loop {
   overflow: hidden;
   padding: 5vw 0 9vw;
}
.mv .loop .loop__box {
   display: flex;
   width: 100vw;
}
.mv .loop .loop__box img {
   min-width: 271.05vw;
}
.mv .loop .loop__box img:first-child {
   -webkit-animation: loop 50s -25s linear infinite;
   animation: loop 50s -25s linear infinite;
}
.mv .loop .loop__box img:last-child {
   -webkit-animation: loop2 50s linear infinite;
   animation: loop2 50s linear infinite;
}
.mv .lead {
   font-weight: 500;
   font-size:6.28vw;
   letter-spacing: 0.12em;
   line-height: 1.6153846;
   text-align: center;
   color: #fff;
}

/* section-wrap
-------------------------------------*/
.section-wrap {
   background: url(../images/staff/sec-bg_sp.png)no-repeat;
   background-size: cover;
}

/* message
-------------------------------------*/
.message {
   width: 94.20vw;
   margin-inline: auto;
   position: relative;
   top: -18.2vw;
   padding-top: 12vw;
   border-radius: 9.66vw;
   background: #FFFFFF;
   margin-bottom: 6.2vw;
}
.message .enttl {
   font-size:2.898vw;
   text-align: center;
   color: #3b8461;
   letter-spacing: 0;
   margin-bottom: 1.2vw;
}
.message h2 {
   font-weight: 500;
   font-size:5.314vw;
   letter-spacing: 0.05em;
   text-align: center;
   margin-bottom: 8.5vw;
}
.message h3 {
   font-weight: 500;
   font-size:4.348vw;
   letter-spacing: 0.05em;
   line-height: 1.777777;
   order: 1;
}
.message .txt {
   font-weight: 500;
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 2;
   margin-bottom: 6.8vw;
}
.message .txt:last-of-type {
   margin-bottom: 0;
}
.message .txt.bold {
   font-weight: 700;
   display: inline-block;
   background-position: top 30px center;
   margin: 1vw 0 7.8vw;
}
.message .txt.bold span {
   background: linear-gradient(transparent 60%, #E6FF00 40%);
}
.message .inBox01 {
   display: grid;
   padding: 0 6vw 13.5vw;
   gap: 6.2vw;
}
.message .inBox01 .txt-box {
   display: contents;
}
.message .inBox01 .sp-txt {
   order: 3;
}
.message .inBox01 .photo {
   width: 77.29vw;
   order: 2;
   margin-inline: auto;
}
.message .inBox02 {
   display: grid;
   padding: 0 6.03vw 11vw;
   gap: 6.4vw;
}
.message .inBox02 .txt-box {
   order: 2;
}
.message .inBox02 .photo {
   order: 1;
}
.message .inBox02 .name {
   font-weight: 500;
   font-size:3.865vw;
   letter-spacing: 0.05em;
   line-height: 3.125;
   text-align: right;
   padding: 5.5vw 0 0;
   display: flex;
   justify-content: flex-end;
   gap: 2vw;
   align-items: baseline;
}
.message .inBox02 .name span{
   font-weight: 500;
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 1;
}

/* staff
-------------------------------------*/
.staff {
   text-align: center;
   margin-bottom: -13vw;
}
.staff h2{
   font-weight: 500;
   font-size:5.314vw;
   letter-spacing: 0.05em;
   text-align: center;
   position: relative;
   margin-bottom: 3vw;
   display: inline-block;
}
.staff h2::before {
   position: absolute;
   content: "";
   background: url(../images/staff/staff-ttl-deco.png)no-repeat;
   background-size: contain;
   width: 34.54vw;
   height: 13.77vw;
   top: -19.5vw;
   left: -2.5vw;
}
.staff h3{
   font-size:3.865vw;
   letter-spacing: 0.05em;
   line-height: 2;
   text-align: center;
   margin-bottom: 8.5vw;
}
.staff .system-contents {
   width: 94.20vw;
   margin-inline: auto;
   padding: 0 0 37vw;
}
.staff .system-list {
   display: grid;
   grid-template-columns: repeat(1, minmax(0, 1fr));
   gap: 9.7vw;
}
.staff .system-list li {
   background: #fff;
   box-shadow: 0px 10px 20px rgba(29, 29, 31, 0.1);
}
.staff .system-list li .inBox {
   padding: 7vw 6.03vw 9.2vw;
   display: grid;
   text-align: left;
}
.staff .system-list li .inBox .txt-box {
   display: contents;
}
.staff .ttl-frame {
   display: flex;
   align-items: baseline;
   order: 1;
   gap: 2.5vw;
}
.staff .system-job {
   font-weight: 500;
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 2.285714;
}
.staff .system-ttl {
   font-weight: 500;
   font-size:4.348vw;
   letter-spacing: 0.05em;
   line-height: 1.7777;
}
.staff .system-pic img {
   height: 57.97vw;
}
.staff .pic {
   position: relative;
   order: 2;
   margin-bottom: 3.9vw;
}
.staff .system-list li .pic::after  {
   position: absolute;
   content: "";
   background-size: contain;
   width: 100%;
   height:9.66vw;
   bottom: -2.2vw;
   left: 0;
}
.staff .system-list li:nth-child(1) .pic::after  {
   background: url(../images/staff/staff01-subt_sp.svg)no-repeat;
   background-size: contain;
}
.staff .system-list li:nth-child(2) .pic::after  {
   background: url(../images/staff/staff02-subt_sp.svg)no-repeat;
   background-size: contain;
}
.staff-list {
   width: 100%;
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 1.714285714;
   order: 3;
}
.staff-list .row {
   display: flex;
   border-bottom: 0.2vw solid #d8d8d8;
}
.staff-list .label {
   width: 20.63vw;
   padding: 4.8vw 0;
   font-weight: 500;
}
.staff-list .text {
   padding: 5.2vw 0 5.2vw 3.5vw;
   box-sizing: border-box;
   width: 57.97vw;
}
.staff-list .row--2col {
   display: grid;
}
.staff-list .row--2col .item {
   display: flex;
   flex: 1;
}
.staff-list .row--2col .item:first-child{
   border-bottom: 0.2vw solid #d8d8d8;
}

}