/*===============================================================================
hero
===============================================================================*/
@media screen and (min-width: 751px) {
  .hero_ttl { height: 100px; background-color: #f63e00; color: #ffffff; font-size: 30px; font-weight: bold; text-align: center; line-height: 100px; }
  .hero_bg { background: url(../img/staff/hero_bg_pc.png) no-repeat center; background-size: cover; padding: 43px 0 51px;}
  .hero_main {width: 679px; margin: 0 auto;}
  .hero .imgbox {display: flex; align-items: center; justify-content: space-between; width: 830px; margin: 16px auto 0;}
  .hero .img01 {width: 287px;}
  .hero .img02 {width: 279px; margin: 23px 0 0;}
  .hero .container02 {display: flex; flex-wrap: wrap; justify-content: space-between; width: 507px;}
  .staff_img {width: 155px; margin: 12px 0 0;}
  .hero .img03 {width: 155px;}
  .hero .txt01 {font-size: 18px; text-align: center; font-weight: bold; line-height: 1.2; margin: 5px 0 0;}
  .hero .txt02 {position: absolute; font-size: 12px; bottom: 5px; right: 0;}

}

@media screen and (max-width: 750px) {
  .hero_ttl { height: 8rem; background-color: #f63e00; color: #ffffff; font-size: 2.5rem; text-align: center; line-height: 8rem; }
  .hero_bg {position: relative; background: #ffc30c; background-size: cover; padding: 2.15rem 0 3.95rem; }
  .hero_main { width: 34.5rem; margin: 0 auto; } 
  .hero .imgbox {margin: .6rem 0 0;}
  .hero .container01 {display: flex; margin: 0 0 0 -.3rem;}
  .hero .img01 {width: 17.55rem;}
  .hero .container02 {display: flex; flex-wrap: wrap; justify-content: space-between; width: 32.9rem; margin: 1rem 0 0;}
  .staff_img {width: 10rem; margin: 1rem 0 0;}
  .hero .img03 {width: 10rem;}
  .hero .txt01 {font-size: 1.4rem; text-align: center; font-weight: bold; line-height: 1.2; margin: .3rem 0 0;}
  .hero .img04 {width: 10rem;}
  .hero .txt02 {font-size: 1rem; text-align: right; margin: 1rem 0 0;}
  .yellow {position: absolute; width: 100%; height: 2.6rem; background: #ffe600; clip-path: polygon(100% 0, 0 100%, 100% 100%); bottom: -.1rem; left: 0;}
}

/*===============================================================================
voice
===============================================================================*/
@media screen and (min-width: 751px) {
  .voice_bg {background: #ffe600; padding: 83px 0 72px;}
  .voice_ttl {width: 681px; margin: 0 auto;}
  .voice .img01 {width: 230px; margin: 27px auto 0;}
  .voice_list {margin: 22px 0 0;}
  .voice_item {width: 1000px; background: #fff;}
  .voice_top {position: relative; font-size: 32px; font-weight: bold; text-align: center; background: #f63e00; padding: 16px 0 ;}
  .voice_top::after {position: absolute; content: ""; width: 134px; height: 52px; background: url(../img/staff/voice_img03_pc.png); background-size: cover; top: -20px; left: 20px;}
  .voice_bottom {display: flex; padding: 20px;}
  .voice_img01 {width: 324px;}
  .voice_bottom .txt01 {width: 605px; font-size: 16px; line-height: 1.8; margin: 0 0 0 20px;}
  .voice_bottom .orange {font-weight: bold;}
  .voice_item:nth-child(n+2) {margin: 57px 0 0;}
  .voice_top02::after {position: absolute; content: ""; width: 134px; height: 52px; background: url(../img/staff/voice_img05_pc.png); background-size: cover; top: -40px; left: 20px;}
  .voice_top03::after {position: absolute; content: ""; width: 134px; height: 52px; background: url(../img/staff/voice_img07_pc.png); background-size: cover; top: -40px; left: 20px;}
}
@media screen and (max-width: 750px) {
  .voice_bg {background: #ffe600; padding: 3.5rem 0 5.2rem;}
  .voice_ttl {width: 34.5rem;}
  .voice .img01 {width: 21.35rem; margin: 1.4rem auto 0;}
  .voice_item {width: 34.5rem; background: #fff; margin: 3.5rem 0 0;}
  .voice_top {position: relative; font-size: 2.3rem; font-weight: bold; text-align: center; letter-spacing: -.03em; background: #f63e00; padding: .8rem 0 ;}
  .voice_top::after {position: absolute; content: ""; width: 10.1rem; height: 4rem; background: url(../img/staff/voice_img03_pc.png); background-size: cover; top: -3rem; left: 2rem;}
  .voice_bottom {padding: 1.5rem 1.5rem 3.5rem;}
  .voice_bottom .txt01 {font-size: 1.4rem; line-height: 1.8; margin: 20px 0 0;}
  .voice_bottom .orange {font-weight: bold;}
  .voice_item:nth-child(n+2) {margin: 5.65rem 0 0;}
  .voice_top02 {font-size: 2.1rem;}
  .voice_top02::after {position: absolute; content: ""; width: 10.1rem; height: 4rem; background: url(../img/staff/voice_img05_pc.png); background-size: cover; top: -3rem; left: 2rem;}
  .voice_top03::after {position: absolute; content: ""; width: 10.1rem; height: 4rem; background: url(../img/staff/voice_img07_pc.png); background-size: cover; top: -3rem; left: 2rem;}
}
/*===============================================================================
cta
===============================================================================*/
.cta .txt01 {position: absolute; font-size: 1.5rem; font-weight: bold; top: 1.5rem; left: 9rem; letter-spacing: -.05em;}
.cta .img01 {width: 55rem; margin: 0 0 0 -2.5rem;}
.cta .thumb01__txt {top: 9.1rem; right: 5.5rem;}

@media screen and (max-width: 750px) {
  .cta .txt01 { position: absolute; font-size: 1.9rem; font-weight: bold; top: 8rem; left: 3rem; line-height: 1.2; }
  .cta .img01 {width: 37.5rem; margin: 0;} 
  .cta .thumb01__txt { color: #000; left: 3rem; top: 37rem; }
  .cta .txt02 { font-size: 1.2rem; margin: 0 0 0 1.5rem;}
}


@media (min-width: 751px){
    #container {padding-top: 7.75rem}
}