.tatete {
  writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  text-orientation: upright;
}

.hogehoge {
  padding-top: clamp(20px, 5.3333333333vw, 40.96px);
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .hogehoge {
    padding-top: clamp(60px, 7.8125vw, 80px);
  }
}
@media only screen and (min-width: 1025px) {
  .hogehoge {
    padding-top: clamp(76.8px, 7.5vw, 120px);
  }
}

.job_in {
  position: relative;
  z-index: 1000;
  margin: auto;
  padding: 0 5vw 0 15vw;
}
@media screen and (max-width: 767px) {
  .job_in {
    padding: 0 5vw;
  }
}
.job_in .jobnav {
  container-type: inline-size;
}
.job_in .jobnav ul {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 0.5rem;
}
@container (max-width: 1100px) {
  .job_in .jobnav ul {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media screen and (max-width: 767px) {
  .job_in .jobnav ul {
    grid-template-columns: 1fr 1fr;
  }
}
.job_in .jobnav ul li.job01 a {
  background: #C74D4D;
}
.job_in .jobnav ul li.job02 a {
  background: #C74D4D;
}
.job_in .jobnav ul li.job03 a {
  background: #C1AA33;
}
.job_in .jobnav ul li.job04 a {
  background: #4378B1;
}
.job_in .jobnav ul li.job05 a {
  background: #6EA762;
}
.job_in .jobnav ul li.job06 a {
  background: #D6802C;
}
.job_in .jobnav ul li.job07 a {
  background: #2F9F9A;
}
.job_in .jobnav ul li.job08 a {
  background: #857BA8;
}
.job_in .jobnav ul li a {
  display: block;
  background: #C74D4D;
  font-feature-settings: "palt";
  font-size: 0.9rem;
  color: #ffffff;
  text-align: center;
  padding: 1rem 0;
  position: relative;
  line-height: 1.5;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.job_in .jobnav ul li a:after {
  content: "";
  position: absolute;
  right: 5px;
  top: 50%;
  transform: translateY(-50%);
  vertical-align: middle;
  font-size: 1.2rem;
  color: #ffffff;
  display: inline-block;
  width: 1.2em;
  height: 1.2em;
  margin: 0 0 0 0.2em;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' d='m7 10l5 5l5-5' stroke-width='1'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.under_titles {
  margin-bottom: 3rem;
}
.under_titles h2 {
  font-size: var(--font-size-xl);
}

.job_wrap {
  position: relative;
  z-index: 10;
  padding: 8rem 5vw 0 15vw;
}
@media screen and (max-width: 767px) {
  .job_wrap {
    padding: 5vw;
  }
}
.job_wrap .jobs {
  margin: 0 0 5rem 0;
  background: rgba(199, 77, 77, 0.05);
}
@media screen and (max-width: 767px) {
  .job_wrap .jobs {
    margin: 0 0 2rem 0;
  }
}
.job_wrap .jobs:last-child {
  margin: 0;
}
.job_wrap .jobs h3 {
  color: #C74D4D;
  margin: 0 0 2rem 0;
}
.job_wrap .jobs#job03 {
  background: rgba(193, 170, 51, 0.05);
}
.job_wrap .jobs#job03 h3 {
  color: #C1AA33;
}
.job_wrap .jobs#job03 .in .images:hover .arrow, .job_wrap .jobs#job03:hover .arrow {
  background: #C1AA33;
}
.job_wrap .jobs#job04 {
  background: rgba(67, 120, 177, 0.05);
}
.job_wrap .jobs#job04 h3 {
  color: #4378B1;
}
.job_wrap .jobs#job04 .in .images:hover .arrow, .job_wrap .jobs#job04:hover .arrow {
  background: #4378B1;
}
.job_wrap .jobs#job05 {
  background: rgba(110, 167, 98, 0.05);
}
.job_wrap .jobs#job05 h3 {
  color: #6EA762;
}
.job_wrap .jobs#job05 .in .images:hover .arrow, .job_wrap .jobs#job05:hover .arrow {
  background: #6EA762;
}
.job_wrap .jobs#job06 {
  background: rgba(47, 159, 154, 0.05);
}
.job_wrap .jobs#job06 h3 {
  color: #2F9F9A;
}
.job_wrap .jobs#job06 .in .images:hover .arrow, .job_wrap .jobs#job06:hover .arrow {
  background: #2F9F9A;
}
.job_wrap .jobs#job07 {
  background: rgba(214, 128, 44, 0.05);
}
.job_wrap .jobs#job07 h3 {
  color: #D6802C;
}
.job_wrap .jobs#job07 .in .images:hover .arrow, .job_wrap .jobs#job07:hover .arrow {
  background: #D6802C;
}
.job_wrap .jobs#job08 {
  background: rgba(133, 123, 168, 0.05);
}
.job_wrap .jobs#job08 h3 {
  color: #857BA8;
}
.job_wrap .jobs#job08 .in .images:hover .arrow, .job_wrap .jobs#job08:hover .arrow {
  background: #857BA8;
}
.job_wrap .jobs .in {
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
  align-items: stretch;
  padding: 0 3rem 0 0;
}
@media screen and (max-width: 767px) {
  .job_wrap .jobs .in {
    display: block;
    padding: 0;
  }
}
.job_wrap .jobs .in .images {
  width: 40%;
  transform: translateY(-2rem);
  position: relative;
  display: flex;
}
@media screen and (max-width: 767px) {
  .job_wrap .jobs .in .images {
    width: 100%;
    transform: none;
  }
}
.job_wrap .jobs .in .images .arrow {
  background: #ffffff;
  position: absolute;
}
.job_wrap .jobs .in .images .arrow span.c-icon {
  color: #000;
}
.job_wrap .jobs .in .images img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.job_wrap .jobs .in:hover .arrow {
  background: #C74D4D;
  transform: scale(1.2);
}
@media screen and (max-width: 767px) {
  .job_wrap .jobs .in:hover .arrow {
    transform: scale(1);
  }
}
.job_wrap .jobs .in:hover span.c-icon.befores {
  animation-name: transformRightLeft;
}
.job_wrap .jobs .in:hover span.c-icon.afters {
  animation-name: transformLeftRight;
  animation-delay: 0.2s;
}
.job_wrap .jobs .in .txt {
  flex: 1;
  padding: 3rem;
}
@media screen and (max-width: 767px) {
  .job_wrap .jobs .in .txt {
    padding: 1.5rem;
  }
}

#visual_header .bg02 {
  display: block;
  position: absolute;
  width: 40%;
  height: 100%;
  top: 0;
  right: 10vw;
  content: "";
  z-index: 1;
  background: rgba(199, 77, 77, 0.6);
  -webkit-backdrop-filter: blur(40px);
          backdrop-filter: blur(40px);
}
@media screen and (max-width: 767px) {
  #visual_header .bg02 {
    opacity: 0.5;
    width: 50%;
    right: 0;
  }
}

.field_intro {
  position: relative;
  z-index: 300;
  padding: 0 5vw 0 15vw;
}
@media screen and (max-width: 767px) {
  .field_intro {
    padding: 0 5vw;
  }
}
.field_intro h2 {
  margin: 0 0 3rem 0;
}
@media screen and (max-width: 767px) {
  .field_intro h2 {
    margin: 0 0 2rem 0;
  }
  .field_intro h2 br {
    display: none;
  }
}

.fimage {
  position: relative;
  z-index: 30;
  width: 60%;
  margin: 5rem 0 0 0;
}
@media screen and (max-width: 767px) {
  .fimage {
    width: 100%;
    margin: 3rem 0 0 0;
  }
}
.fimage .image {
  position: relative;
  z-index: 39;
}
.fimage:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 30%;
  left: 60%;
  content: "";
  z-index: 5;
  background: rgba(199, 77, 77, 0.3);
  -webkit-backdrop-filter: blur(15px);
          backdrop-filter: blur(15px);
}
@media screen and (max-width: 767px) {
  .fimage:after {
    display: none;
  }
}

.features_wrap {
  background: #EBE7CF;
}
.features_wrap .cont .cont_inner {
  padding: 0 5vw;
}

.feature_in {
  max-width: 1600px;
  padding: 0 8vw;
  margin: auto;
}

.feature_layout {
  position: relative;
  flex-wrap: wrap;
  gap: 6%;
}

.feature_box {
  width: 45%;
  margin-left: auto;
}
@media screen and (max-width: 767px) {
  .feature_box {
    width: 100%;
  }
}
.feature_box.f1 {
  margin-bottom: 170px;
}
@media screen and (max-width: 767px) {
  .feature_box.f1 {
    margin-bottom: 4rem;
  }
}
.feature_box.left {
  position: absolute;
  left: 0;
  top: 15%;
}
@media screen and (max-width: 767px) {
  .feature_box.left {
    margin: 0 0 3rem 0;
    position: static;
  }
}
@media screen and (max-width: 767px) {
  .feature_box.right02 {
    margin: 0 0 3rem 0;
  }
}
.feature_box .txt {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  align-items: stretch;
  border-left: 1px solid #1d1d1d;
  margin: 0 0 2rem 0;
}
.feature_box .maintxt {
  margin: 0 0 2rem 0;
}
.feature_box .maintxt h3 {
  margin: 0 0 2rem 0;
}
.feature_box .maintxt h3 span {
  color: #000;
  padding: 0.6rem;
}

.tateen {
  height: 100%;
}
.tateen p {
  transform: rotate(90deg);
  white-space: nowrap;
  font-size: 0.875rem;
  display: flex;
  align-items: center;
  height: 100%;
  width: 100%;
  margin: 1.5rem 0 0 0;
}

.jobtype {
  position: relative;
  z-index: 300;
  padding: 0 8vw 0 8vw;
  margin: auto;
  max-width: 1600px;
}
@media screen and (max-width: 767px) {
  .jobtype {
    padding: 0 5vw;
  }
}
.jobtype .jobtypetxt {
  border-bottom: 10px solid #C74D4D;
}
.jobtype .jobtypetxt.single {
  width: 25%;
  border-color: #777;
  text-align: center;
  border-radius: 4px 4px 0 0;
  background-color: #aaa;
  padding: 0.5rem 0 0;
  color: #fff;
}
.jobtype .jobtype-tags {
  display: flex;
  gap: 1px;
}
.jobtype .jobtype-tags .jobtypetxt {
  width: 25%;
  border-color: #777;
  cursor: pointer;
  text-align: center;
  border-radius: 4px 4px 0 0;
  background-color: #aaa;
  padding: 0.5rem 0;
}
.jobtype .jobtype-tags .jobtypetxt.active {
  border-color: #C74D4D;
  background-color: #C74D4D;
  color: #fff;
}
.jobtype .tabwrapper {
  display: none;
}
.jobtype .tabwrapper.active {
  display: block;
}
.jobtype .jobwrapper {
  background: #EBE7CF;
  padding: 3vw;
}
.jobtype .jobwrapper .cont {
  display: grid;
  grid-template-columns: 1fr 5fr;
  border-top: 1px solid #C74D4D;
  padding: 2rem 0 0 0;
  margin: 0 0 2rem 0;
}
@media screen and (max-width: 767px) {
  .jobtype .jobwrapper .cont {
    display: block;
    margin: 0 0 2rem 0;
  }
}
.jobtype .jobwrapper h3 {
  font-size: 1.4rem;
}
@media screen and (max-width: 767px) {
  .jobtype .jobwrapper h3 {
    margin: 0 0 1rem 0;
  }
}
.jobtype .jobwrapper .txts {
  margin: 0 0 0 0;
  display: flex;
  flex-direction: column-reverse;
  flex-wrap: wrap;
  padding-bottom: 2rem;
}
.jobtype .jobwrapper ul.cat {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 1rem;
}
@media screen and (max-width: 767px) {
  .jobtype .jobwrapper ul.cat {
    grid-template-columns: 1fr 1fr;
  }
}
.jobtype .jobwrapper ul.cat li {
  background: #C74D4D;
  border-radius: 3rem;
  text-align: center;
  color: #ffffff;
  padding: 0.8rem 0;
}
.jobtype .jobwrapper ul.cat li.off {
  background: #707070;
}
.jobtype .cont-mt {
  margin-top: 2rem;
}
.jobtype .subjob h3 {
  font-size: 1.2rem;
  margin-bottom: 0.5rem;
}
.jobtype .subjob .txts b {
  font-weight: bold;
}
.jobtype .subjob .txts p {
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
}

.aruaru {
  width: 90%;
  margin: auto;
  position: relative;
  z-index: 200;
  padding: 3vw;
  border: 1px dotted #C74D4D;
  background: #ffffff;
}
.aruaru .title {
  max-width: 400px;
  margin: 0 auto 4rem auto;
}
@media screen and (max-width: 767px) {
  .aruaru .title {
    max-width: 280px;
  }
}

.aruwrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 100%;
  padding: 0;
}
@media screen and (max-width: 767px) {
  .aruwrap {
    display: block;
  }
}
.aruwrap .aru {
  width: 45%;
  background: #ffffff;
  margin: 0 0 4rem 0;
  padding: 2rem 0;
  border: 1px dotted #C74D4D;
  position: relative;
  padding: 2rem;
}
@media screen and (max-width: 767px) {
  .aruwrap .aru {
    width: 100%;
    margin: 0 0 2rem 0;
  }
}
.aruwrap .aru.mid {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .aruwrap .aru.mid {
    width: 100%;
  }
}
.aruwrap .aru.wide {
  width: 70%;
  margin: 0 0 0 15%;
}
@media screen and (max-width: 767px) {
  .aruwrap .aru.wide {
    width: 100%;
    margin: 0;
  }
}
.aruwrap .aru:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0.5rem;
  left: 0.5rem;
  content: "";
  z-index: 0;
  border: 1px dotted #C74D4D;
}
.aruwrap .titles {
  font-size: 500;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .aruwrap .titles {
    text-align: left;
    margin: 0 0 1rem 0;
    font-weight: 500;
  }
}
.aruwrap .titles span {
  color: #C74D4D;
  font-size: 2rem;
}
.aruwrap .contents {
  text-align: center;
}
@media screen and (max-width: 767px) {
  .aruwrap .contents {
    text-align: left;
  }
}

.people_wrap {
  position: relative;
  z-index: 300;
  padding: 0 20vw 0 15vw;
}
.people_wrap .people_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}
.people_wrap .people_grid.grid-3 {
  grid-template-columns: 1fr 1fr 1fr;
}
@media screen and (max-width: 1060px) {
  .people_wrap .people_grid.grid-3 {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 767px) {
  .people_wrap .people_grid {
    display: block;
  }
}
.people_wrap .people_grid a {
  display: block;
}
@media screen and (max-width: 767px) {
  .people_wrap .people_grid a {
    margin: 0 0 2rem 0;
  }
}
.people_wrap .people_grid a .name {
  font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
  .people_wrap .people_grid a .name {
    font-size: 1.4rem;
  }
}
.people_wrap .people_grid a .jobs {
  font-size: 0.875rem;
}
.people_wrap .people_grid a .txt {
  margin: 0 0 1rem 0;
}

.career_zu {
  position: relative;
  z-index: 300;
  padding: 0 0 0 15vw;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .career_zu {
    padding: 0 0 0 5vw;
  }
}
.career_zu .in {
  overflow-x: scroll;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch !important;
}
.career_zu .in::-webkit-scrollbar {
  height: 8px;
}
.career_zu .in::-webkit-scrollbar-track {
  background: #f1f1f1;
}
.career_zu .in::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 4px;
}
.career_zu .in::-webkit-scrollbar-thumb:hover {
  background: #555;
}
.career_zu .in .ins {
  width: 1400px;
  display: flex;
  -webkit-transform: translateZ(0px);
  white-space: nowrap;
}
.career_zu .in .ins.wide {
  width: 1800px;
}
@media screen and (max-width: 767px) {
  .career_zu .in .ins {
    width: 1000px;
  }
  .career_zu .in .ins.wide {
    width: 1200px;
  }
}

#career {
  margin-bottom: 7rem;
}

#topics {
  position: relative;
  padding-top: 0;
}
#topics .under_titles {
  margin-bottom: 0;
  position: absolute;
  width: 100%;
  top: 2rem;
}

.topics {
  position: relative;
  z-index: 300;
  padding: 0 5vw 0 5vw;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .topics {
    transform: none;
    padding: 0 5lvw;
  }
}
.topics .topics_grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1rem;
}
@media screen and (max-width: 1060px) {
  .topics .topics_grid {
    grid-template-columns: 1fr;
  }
}
@media screen and (max-width: 767px) {
  .topics .topics_grid {
    display: block;
  }
}
.topics .topics_grid .box {
  background: #EBE7CF;
  padding: 10rem 3rem 3rem 3rem;
}
.topics .topics_grid .box:nth-child(n+4) {
  padding-top: 3rem;
}
.topics .topics_grid .box p {
  font-size: var(--font-size-s);
}
.topics .topics_grid .box .imagess p {
  font-size: var(--font-size-r);
}
@media screen and (max-width: 1060px) {
  .topics .topics_grid .box {
    padding: 3rem 2rem 2rem 2rem;
    display: flex;
    gap: 5%;
  }
}
@media screen and (max-width: 1060px) and (max-width: 767px) {
  .topics .topics_grid .box {
    display: block;
  }
}
@media screen and (max-width: 1060px) {
  .topics .topics_grid .box .imagess {
    width: 50%;
  }
}
@media screen and (max-width: 1060px) and (max-width: 767px) {
  .topics .topics_grid .box .imagess {
    width: 100%;
  }
}
@media screen and (max-width: 1060px) {
  .topics .topics_grid .box > p {
    width: 50%;
  }
}
@media screen and (max-width: 1060px) and (max-width: 767px) {
  .topics .topics_grid .box > p {
    width: 100%;
  }
}
@media screen and (max-width: 1060px) {
  .topics .topics_grid .box.first {
    padding-top: 9rem;
  }
}
@media screen and (max-width: 1060px) and (max-width: 767px) {
  .topics .topics_grid .box.first {
    padding-top: 9rem;
  }
}
@media screen and (max-width: 767px) {
  .topics .topics_grid .box {
    padding: 2rem;
    margin: 0 0 3rem 0;
  }
}
.topics .topics_grid .box .imagess {
  position: relative;
  margin: 0 0 1rem 0;
}
.topics .topics_grid .box .txt {
  margin-bottom: 1rem;
}
@media screen and (max-width: 1060px) {
  .topics .topics_grid .box .txt {
    height: auto !important;
  }
}
.topics .topics_grid .box .txt span {
  color: #000 !important;
}

main.job01 #visual_header .bg02 {
  background: rgba(199, 77, 77, 0.6);
}
main.job01 .fimage:after {
  background: rgba(199, 77, 77, 0.3);
}
main.job01 .under_titles .line {
  background: #C74D4D;
}
main.job01 .under_titles p.en::before {
  background: #C74D4D;
}
main.job01 .under_titles h2::before {
  background: #C74D4D;
}
main.job01 .features_wrap .feature_box .txt {
  border-left: 1px solid #C74D4D;
}
main.job01 .jobtype .jobtypetxt {
  border-bottom: 10px solid #C74D4D;
}
main.job01 .jobtype .jobtypetxt.single {
  border-color: #C74D4D;
  background-color: #C74D4D;
}
main.job01 .jobtype .jobtypetxt.single + .jobwrapper {
  border-top: 10px solid #C74D4D;
}
main.job01 .jobtype .jobwrapper .cont {
  border-top: 1px solid #C74D4D;
}
main.job01 .jobtype .jobwrapper ul.cat li {
  background: #C74D4D;
}
main.job01 .aruaru {
  border: 1px dotted #C74D4D;
}
main.job01 .aruwrap .aru {
  border: 1px dotted #C74D4D;
}
main.job01 .aruwrap .aru:after {
  border: 1px dotted #C74D4D;
}
main.job01 .aruwrap .titles span {
  color: #C74D4D;
}
main.job01 .modal .modal_conts .profile .text .name {
  color: #C74D4D;
}
main.job01 .modal .modal_conts .career dl dt {
  color: #C74D4D;
}
main.job01 .modal .modal_conts .detail dt {
  border-top: 1px solid #C74D4D;
  color: #C74D4D;
}
main.job01 .modal .modal_conts .detail dd {
  border-top: 1px solid #C74D4D;
}
main.job01 .modal .modal_conts .detail dd ul li .time {
  color: #C74D4D;
}
main.job02 #visual_header .bg02 {
  background: rgba(199, 77, 77, 0.6);
}
main.job02 .fimage:after {
  background: rgba(199, 77, 77, 0.3);
}
main.job02 .under_titles .line {
  background: #C74D4D;
}
main.job02 .under_titles p.en::before {
  background: #C74D4D;
}
main.job02 .under_titles h2::before {
  background: #C74D4D;
}
main.job02 .features_wrap .feature_box .txt {
  border-left: 1px solid #C74D4D;
}
main.job02 .jobtype .jobtypetxt {
  border-bottom: 10px solid #C74D4D;
}
main.job02 .jobtype .jobtypetxt.single {
  border-color: #C74D4D;
  background-color: #C74D4D;
}
main.job02 .jobtype .jobtypetxt.single + .jobwrapper {
  border-top: 10px solid #C74D4D;
}
main.job02 .jobtype .jobwrapper .cont {
  border-top: 1px solid #C74D4D;
}
main.job02 .jobtype .jobwrapper ul.cat li {
  background: #C74D4D;
}
main.job02 .aruaru {
  border: 1px dotted #C74D4D;
}
main.job02 .aruwrap .aru {
  border: 1px dotted #C74D4D;
}
main.job02 .aruwrap .aru:after {
  border: 1px dotted #C74D4D;
}
main.job02 .aruwrap .titles span {
  color: #C74D4D;
}
main.job02 .modal .modal_conts .profile .text .name {
  color: #C74D4D;
}
main.job02 .modal .modal_conts .career dl dt {
  color: #C74D4D;
}
main.job02 .modal .modal_conts .detail dt {
  border-top: 1px solid #C74D4D;
  color: #C74D4D;
}
main.job02 .modal .modal_conts .detail dd {
  border-top: 1px solid #C74D4D;
}
main.job02 .modal .modal_conts .detail dd ul li .time {
  color: #C74D4D;
}
main.job03 #visual_header .bg02 {
  background: rgba(193, 170, 51, 0.6);
}
main.job03 .fimage:after {
  background: rgba(193, 170, 51, 0.3);
}
main.job03 .under_titles .line {
  background: #C1AA33;
}
main.job03 .under_titles p.en::before {
  background: #C1AA33;
}
main.job03 .under_titles h2::before {
  background: #C1AA33;
}
main.job03 .features_wrap .feature_box .txt {
  border-left: 1px solid #C1AA33;
}
main.job03 .jobtype .jobtypetxt {
  border-bottom: 10px solid #C1AA33;
}
main.job03 .jobtype .jobtypetxt.single {
  border-color: #C1AA33;
  background-color: #C1AA33;
}
main.job03 .jobtype .jobtypetxt.single + .jobwrapper {
  border-top: 10px solid #C1AA33;
}
main.job03 .jobtype .jobwrapper .cont {
  border-top: 1px solid #C1AA33;
}
main.job03 .jobtype .jobwrapper ul.cat li {
  background: #C1AA33;
}
main.job03 .aruaru {
  border: 1px dotted #C1AA33;
}
main.job03 .aruwrap .aru {
  border: 1px dotted #C1AA33;
}
main.job03 .aruwrap .aru:after {
  border: 1px dotted #C1AA33;
}
main.job03 .aruwrap .titles span {
  color: #C1AA33;
}
main.job03 .modal .modal_conts .profile .text .name {
  color: #C1AA33;
}
main.job03 .modal .modal_conts .career dl dt {
  color: #C1AA33;
}
main.job03 .modal .modal_conts .detail dt {
  border-top: 1px solid #C1AA33;
  color: #C1AA33;
}
main.job03 .modal .modal_conts .detail dd {
  border-top: 1px solid #C1AA33;
}
main.job03 .modal .modal_conts .detail dd ul li .time {
  color: #C1AA33;
}
main.job04 #visual_header .bg02 {
  background: rgba(67, 120, 177, 0.6);
}
main.job04 .fimage:after {
  background: rgba(67, 120, 177, 0.3);
}
main.job04 .under_titles .line {
  background: #4378B1;
}
main.job04 .under_titles p.en::before {
  background: #4378B1;
}
main.job04 .under_titles h2::before {
  background: #4378B1;
}
main.job04 .features_wrap .feature_box .txt {
  border-left: 1px solid #4378B1;
}
main.job04 .jobtype .jobtypetxt {
  border-bottom: 10px solid #4378B1;
}
main.job04 .jobtype .jobtypetxt.single {
  border-color: #4378B1;
  background-color: #4378B1;
}
main.job04 .jobtype .jobtypetxt.single + .jobwrapper {
  border-top: 10px solid #4378B1;
}
main.job04 .jobtype .jobwrapper .cont {
  border-top: 1px solid #4378B1;
}
main.job04 .jobtype .jobwrapper ul.cat li {
  background: #4378B1;
}
main.job04 .aruaru {
  border: 1px dotted #4378B1;
}
main.job04 .aruwrap .aru {
  border: 1px dotted #4378B1;
}
main.job04 .aruwrap .aru:after {
  border: 1px dotted #4378B1;
}
main.job04 .aruwrap .titles span {
  color: #4378B1;
}
main.job04 .modal .modal_conts .profile .text .name {
  color: #4378B1;
}
main.job04 .modal .modal_conts .career dl dt {
  color: #4378B1;
}
main.job04 .modal .modal_conts .detail dt {
  border-top: 1px solid #4378B1;
  color: #4378B1;
}
main.job04 .modal .modal_conts .detail dd {
  border-top: 1px solid #4378B1;
}
main.job04 .modal .modal_conts .detail dd ul li .time {
  color: #4378B1;
}
main.job05 #visual_header .bg02 {
  background: rgba(110, 167, 98, 0.6);
}
main.job05 .fimage:after {
  background: rgba(110, 167, 98, 0.3);
}
main.job05 .under_titles .line {
  background: #6EA762;
}
main.job05 .under_titles p.en::before {
  background: #6EA762;
}
main.job05 .under_titles h2::before {
  background: #6EA762;
}
main.job05 .features_wrap .feature_box .txt {
  border-left: 1px solid #6EA762;
}
main.job05 .jobtype .jobtypetxt {
  border-bottom: 10px solid #6EA762;
}
main.job05 .jobtype .jobtypetxt.single {
  border-color: #6EA762;
  background-color: #6EA762;
}
main.job05 .jobtype .jobtypetxt.single + .jobwrapper {
  border-top: 10px solid #6EA762;
}
main.job05 .jobtype .jobwrapper .cont {
  border-top: 1px solid #6EA762;
}
main.job05 .jobtype .jobwrapper ul.cat li {
  background: #6EA762;
}
main.job05 .aruaru {
  border: 1px dotted #6EA762;
}
main.job05 .aruwrap .aru {
  border: 1px dotted #6EA762;
}
main.job05 .aruwrap .aru:after {
  border: 1px dotted #6EA762;
}
main.job05 .aruwrap .titles span {
  color: #6EA762;
}
main.job05 .modal .modal_conts .profile .text .name {
  color: #6EA762;
}
main.job05 .modal .modal_conts .career dl dt {
  color: #6EA762;
}
main.job05 .modal .modal_conts .detail dt {
  border-top: 1px solid #6EA762;
  color: #6EA762;
}
main.job05 .modal .modal_conts .detail dd {
  border-top: 1px solid #6EA762;
}
main.job05 .modal .modal_conts .detail dd ul li .time {
  color: #6EA762;
}
main.job06 #visual_header .bg02 {
  background: rgba(214, 128, 44, 0.6);
}
main.job06 .fimage:after {
  background: rgba(214, 128, 44, 0.3);
}
main.job06 .under_titles .line {
  background: #D6802C;
}
main.job06 .under_titles p.en::before {
  background: #D6802C;
}
main.job06 .under_titles h2::before {
  background: #D6802C;
}
main.job06 .features_wrap .feature_box .txt {
  border-left: 1px solid #D6802C;
}
main.job06 .jobtype .jobtypetxt {
  border-bottom: 10px solid #D6802C;
}
main.job06 .jobtype .jobtypetxt.single {
  border-color: #D6802C;
  background-color: #D6802C;
}
main.job06 .jobtype .jobtypetxt.single + .jobwrapper {
  border-top: 10px solid #D6802C;
}
main.job06 .jobtype .jobwrapper .cont {
  border-top: 1px solid #D6802C;
}
main.job06 .jobtype .jobwrapper ul.cat li {
  background: #D6802C;
}
main.job06 .aruaru {
  border: 1px dotted #D6802C;
}
main.job06 .aruwrap .aru {
  border: 1px dotted #D6802C;
}
main.job06 .aruwrap .aru:after {
  border: 1px dotted #D6802C;
}
main.job06 .aruwrap .titles span {
  color: #D6802C;
}
main.job06 .modal .modal_conts .profile .text .name {
  color: #D6802C;
}
main.job06 .modal .modal_conts .career dl dt {
  color: #D6802C;
}
main.job06 .modal .modal_conts .detail dt {
  border-top: 1px solid #D6802C;
  color: #D6802C;
}
main.job06 .modal .modal_conts .detail dd {
  border-top: 1px solid #D6802C;
}
main.job06 .modal .modal_conts .detail dd ul li .time {
  color: #D6802C;
}
main.job07 #visual_header .bg02 {
  background: rgba(47, 159, 154, 0.6);
}
main.job07 .fimage:after {
  background: rgba(47, 159, 154, 0.3);
}
main.job07 .under_titles .line {
  background: #2F9F9A;
}
main.job07 .under_titles p.en::before {
  background: #2F9F9A;
}
main.job07 .under_titles h2::before {
  background: #2F9F9A;
}
main.job07 .features_wrap .feature_box .txt {
  border-left: 1px solid #2F9F9A;
}
main.job07 .jobtype .jobtypetxt {
  border-bottom: 10px solid #2F9F9A;
}
main.job07 .jobtype .jobtypetxt.single {
  border-color: #2F9F9A;
  background-color: #2F9F9A;
}
main.job07 .jobtype .jobtypetxt.single + .jobwrapper {
  border-top: 10px solid #2F9F9A;
}
main.job07 .jobtype .jobwrapper .cont {
  border-top: 1px solid #2F9F9A;
}
main.job07 .jobtype .jobwrapper ul.cat li {
  background: #2F9F9A;
}
main.job07 .aruaru {
  border: 1px dotted #2F9F9A;
}
main.job07 .aruwrap .aru {
  border: 1px dotted #2F9F9A;
}
main.job07 .aruwrap .aru:after {
  border: 1px dotted #2F9F9A;
}
main.job07 .aruwrap .titles span {
  color: #2F9F9A;
}
main.job07 .modal .modal_conts .profile .text .name {
  color: #2F9F9A;
}
main.job07 .modal .modal_conts .career dl dt {
  color: #2F9F9A;
}
main.job07 .modal .modal_conts .detail dt {
  border-top: 1px solid #2F9F9A;
  color: #2F9F9A;
}
main.job07 .modal .modal_conts .detail dd {
  border-top: 1px solid #2F9F9A;
}
main.job07 .modal .modal_conts .detail dd ul li .time {
  color: #2F9F9A;
}
main.job08 #visual_header .bg02 {
  background: rgba(133, 123, 168, 0.6);
}
main.job08 .fimage:after {
  background: rgba(133, 123, 168, 0.3);
}
main.job08 .under_titles .line {
  background: #857BA8;
}
main.job08 .under_titles p.en::before {
  background: #857BA8;
}
main.job08 .under_titles h2::before {
  background: #857BA8;
}
main.job08 .features_wrap .feature_box .txt {
  border-left: 1px solid #857BA8;
}
main.job08 .jobtype .jobtypetxt {
  border-bottom: 10px solid #857BA8;
}
main.job08 .jobtype .jobtypetxt.single {
  border-color: #857BA8;
  background-color: #857BA8;
}
main.job08 .jobtype .jobtypetxt.single + .jobwrapper {
  border-top: 10px solid #857BA8;
}
main.job08 .jobtype .jobwrapper .cont {
  border-top: 1px solid #857BA8;
}
main.job08 .jobtype .jobwrapper ul.cat li {
  background: #857BA8;
}
main.job08 .aruaru {
  border: 1px dotted #857BA8;
}
main.job08 .aruwrap .aru {
  border: 1px dotted #857BA8;
}
main.job08 .aruwrap .aru:after {
  border: 1px dotted #857BA8;
}
main.job08 .aruwrap .titles span {
  color: #857BA8;
}
main.job08 .modal .modal_conts .profile .text .name {
  color: #857BA8;
}
main.job08 .modal .modal_conts .career dl dt {
  color: #857BA8;
}
main.job08 .modal .modal_conts .detail dt {
  border-top: 1px solid #857BA8;
  color: #857BA8;
}
main.job08 .modal .modal_conts .detail dd {
  border-top: 1px solid #857BA8;
}
main.job08 .modal .modal_conts .detail dd ul li .time {
  color: #857BA8;
}
main.job01 .features_wrap {
  background-color: #EDD5D5;
}
main.job01 .jobtype .jobwrapper {
  background-color: #EDD5D5;
}
main.job01 .topics .topics_grid .box {
  background-color: #EDD5D5;
}
main.job01 .modal .modal_conts .career dl {
  background-color: #EDD5D5;
}
main.job02 .features_wrap {
  background-color: #EDD5D5;
}
main.job02 .jobtype .jobwrapper {
  background-color: #EDD5D5;
}
main.job02 .topics .topics_grid .box {
  background-color: #EDD5D5;
}
main.job02 .modal .modal_conts .career dl {
  background-color: #EDD5D5;
}
main.job03 .features_wrap {
  background-color: #EBE7CF;
}
main.job03 .jobtype .jobwrapper {
  background-color: #EBE7CF;
}
main.job03 .topics .topics_grid .box {
  background-color: #EBE7CF;
}
main.job03 .modal .modal_conts .career dl {
  background-color: #EBE7CF;
}
main.job04 .features_wrap {
  background-color: #D9E4F0;
}
main.job04 .jobtype .jobwrapper {
  background-color: #D9E4F0;
}
main.job04 .topics .topics_grid .box {
  background-color: #D9E4F0;
}
main.job04 .modal .modal_conts .career dl {
  background-color: #D9E4F0;
}
main.job05 .features_wrap {
  background-color: #DDE9D8;
}
main.job05 .jobtype .jobwrapper {
  background-color: #DDE9D8;
}
main.job05 .topics .topics_grid .box {
  background-color: #DDE9D8;
}
main.job05 .modal .modal_conts .career dl {
  background-color: #DDE9D8;
}
main.job06 .features_wrap {
  background-color: #EDD9CD;
}
main.job06 .jobtype .jobwrapper {
  background-color: #EDD9CD;
}
main.job06 .topics .topics_grid .box {
  background-color: #EDD9CD;
}
main.job06 .modal .modal_conts .career dl {
  background-color: #EDD9CD;
}
main.job07 .features_wrap {
  background-color: #D8E9E7;
}
main.job07 .jobtype .jobwrapper {
  background-color: #D8E9E7;
}
main.job07 .topics .topics_grid .box {
  background-color: #D8E9E7;
}
main.job07 .modal .modal_conts .career dl {
  background-color: #D8E9E7;
}
main.job08 .features_wrap {
  background-color: #E5DFF5;
}
main.job08 .jobtype .jobwrapper {
  background-color: #E5DFF5;
}
main.job08 .topics .topics_grid .box {
  background-color: #E5DFF5;
}
main.job08 .modal .modal_conts .career dl {
  background-color: #E5DFF5;
}

@media screen and (max-width: 767px) {
  .modal .modal__overlay {
    padding-top: 5rem;
  }
  .modal .modal__close {
    top: -4rem;
  }
}
.modal .modal__container {
  max-width: calc(1160px + 16vw);
}
@media screen and (max-width: 767px) {
  .modal .modal__container {
    max-width: 100%;
    padding: 0;
  }
}
.modal .modal_conts {
  background-color: #fff;
  padding: 100px 5vw;
  color: #000;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts {
    padding: 1rem 5vw;
  }
}
.modal .modal_conts .profile {
  display: flex;
  margin-bottom: 60px;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .profile {
    flex-direction: column-reverse;
    margin: 0 0 2rem 0;
  }
}
.modal .modal_conts .profile .text {
  width: 30%;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .profile .text {
    width: 100%;
  }
}
.modal .modal_conts .profile .text .name {
  color: #C1AA33;
  font-weight: 500;
  font-size: var(--font-size-lg);
}
.modal .modal_conts .profile .text p {
  margin: 1rem 0 0 0;
  font-size: var(--font-size-s);
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .profile .text p {
    font-size: 1rem;
  }
}
.modal .modal_conts .profile .image {
  width: 70%;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .profile .image {
    width: 100%;
  }
}
.modal .modal_conts .profile .image p {
  font-size: var(--font-size-xs);
  text-align: right;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .profile .image p {
    font-size: 0.8rem;
    text-align: left;
    margin-bottom: 1rem;
  }
}
.modal .modal_conts .career {
  margin-bottom: 80px;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .career {
    margin: 0 0 2rem 0;
  }
}
.modal .modal_conts .career dl {
  background-color: #EBE7CF;
  margin-bottom: 10px;
  padding: 35px 40px;
  display: flex;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .career dl {
    display: block;
    padding: 1rem;
  }
}
.modal .modal_conts .career dl dt {
  width: 30%;
  font-size: var(--font-size-r);
  color: #C1AA33;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .career dl dt {
    width: 100%;
  }
}
.modal .modal_conts .career dl dd {
  width: 70%;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .career dl dd {
    width: 100%;
  }
}
.modal .modal_conts .career dl dd h3 {
  font-size: var(--font-size-r);
  font-weight: 500;
  margin-bottom: 0.5rem;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .career dl dd h3 {
    font-size: 1.2rem;
  }
}
.modal .modal_conts .career dl dd p {
  font-size: var(--font-size-s);
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .career dl dd p {
    font-size: 1rem;
  }
}
.modal .modal_conts .detail {
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .detail {
    display: block;
  }
}
.modal .modal_conts .detail dt {
  width: 20%;
  border-top: 1px solid #C1AA33;
  padding: 30px 0;
  color: #C1AA33;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .detail dt {
    width: 100%;
    padding: 1rem 0;
  }
}
.modal .modal_conts .detail dd {
  width: 80%;
  border-top: 1px solid #C1AA33;
  padding: 30px 0 30px 30px;
  font-size: var(--font-size-s);
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .detail dd {
    width: 100%;
    font-size: 1rem;
    padding: 1rem 0;
  }
}
.modal .modal_conts .detail dd ul {
  -moz-columns: 2;
       columns: 2;
  -moz-column-gap: 15px;
       column-gap: 15px;
}
@media screen and (max-width: 1060px) {
  .modal .modal_conts .detail dd ul {
    -moz-columns: 1;
         columns: 1;
  }
}
.modal .modal_conts .detail dd ul li {
  background-color: #EAEAEA;
  display: flex;
  font-size: var(--font-size-s);
  padding: 13px 20px;
  -moz-column-break-inside: avoid;
       break-inside: avoid;
  border-bottom: 1px solid #ddd;
  margin-bottom: 4px;
}
.modal .modal_conts .detail dd ul li .time {
  color: #C1AA33;
  width: 60px;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .detail dd ul li .time {
    font-size: 1rem;
  }
}
.modal .modal_conts .detail dd ul li .det {
  flex: 1;
}
@media screen and (max-width: 767px) {
  .modal .modal_conts .detail dd ul li .det {
    font-size: 1rem;
  }
}
.modal .modal_conts .detail dd ul li:nth-child(odd) {
  border-right: 1px solid #ddd;
}