:root {
  --white: #fff;
  --offwhite: #FDFDFD;
  --offwhite2: #DFDFDF;
  --pop_orange1: #FDEFDD;
  --pop_orange2: #FEDFB6;
  --pop_orange3: #F9AA5C;
  --pop_orange4: #FB8650;
  --pop_yellow: #ffe669;
  --pop_yellow1: #FFE145;
  --pop_yellow2: #FFC225;
  --title_color: #3D3D3D;
  --text_color: #4D4D4D;
  --tab_text_color: #919191;
  --line: #e5e5e5;
  --sans: Noto Sans JP;
}

.main_visual_box {
  background: var(--offwhite);
}

.title > p {
  color: var(--pop_orange4);
}

.flow_title > p,
.flow_title > h1,
.faq_title > p,
.faq_title > h1 {
  color: var(--white);
}

h1 {
  color: var(--title_color);
}

p {
  color: var(--text_color);
}

.job_listing_tab {
  border: 3px solid var(--pop_orange3);
}

.job_listing_box {
  background: var(--pop_orange4);
}

.job_listing_wrap {
  background: var(--white);
}

.job_listing_content_point {
  color: var(--pop_yellow2);
}

.job_listing_content_number {
  color: var(--pop_yellow2);
}

.job_listing_content_h3 {
  color: var(--pop_orange4);
}

.job_listing_content_headline {
  color: var(--pop_orange4);
  display: inline-block;
  font-size: 20px;
  font-family: var(--sans);
  font-weight: 600;
  letter-spacing: 1px;
  line-height: 32px;
  margin: 16px 0;
  position: relative;
  padding: 16px 32px;
  word-wrap: break-word;
  width: 100%;
}

.job_listing_img_headline_box {
  width: 100%;
  margin: 48px 0 16px 0;
}

.job_listing_img_headline {
  margin: 0 auto;
  width: 249px;
  display: block;
}

.bbl_style02 {
  border: 2px solid var(--pop_orange2);
}

.bbl_style02::before {
  border-left: 2px solid var(--pop_orange2);
  border-bottom: 2px solid var(--pop_orange2);
  background: #fff;
}

.slide-arrow {
  background-color: #333;
}

.prev-arrow {
  border-bottom: 10px solid #333;
  border-right: 10px solid #fff;
  border-top: 10px solid #333;
}

.next-arrow {
  border-bottom: 10px solid #333;
  border-left: 10px solid #fff;
  border-top: 10px solid #333;
}

.staff_voice_box {
  background: var(--pop_orange1);
}

.staff_carousel_content {
  background: var(--white);
}

.staff_details {
  background: var(--white);
}

.staff_info {
  border-bottom: 2px dashed var(--pop_orange3);
}

.staff_name_wrap {
  color: var(--title_color);
  background-image: linear-gradient(120deg, rgba(251, 134, 80, 0.2), rgba(251, 134, 80, 0.2));
}

.staff_name {
  color: var(--title_color);
}

.staff_name2 {
  color: var(--pop_orange4);
}

.staff_honorific {
  color: var(--title_color);
}

.staff_question_left {
  color: var(--pop_orange4);
}

.staff_question_right {
  color: var(--pop_orange4);
}

.staff_ask_left {
  color: var(--title_color);
}

.staff_ask_right {
  color: var(--title_color);
}

.schedule_box {
  background: var(--pop_yellow1);
}

.schedule_verticalline {
  background: var(--line);
}

.schedule_content {
  background: var(--white);
}

.schedule_time > p {
  color: var(--title_color);
}


.schedule_circle > span {
  background-color: var(--pop_yellow1);
}

.schedule_wrap > h3 {
  color: var(--title_color);
}

.schedule_contents > p {
  color: var(--title_color);
}

.schedule_tab-list-item {
  color: var(--pop_yellow2);
  background-color: var(--white);
}

.schedule_tab-contents {
  background-color: var(--white);
}

.schedule_is-btn-active {
  background-color: var(--pop_yellow2);
  color: var(--white);
}

.schedule_is-btn-active:after {
  border-top-color: var(--pop_yellow2);
}

.requirement_box {
  background: var(--white);
}

.requirement {
  background: var(--white);
}

.requirement_tab-list-item {
  color: var(--pop_orange3);
  background-color: var(--white);
}

.requirement_tab-contents {
  background-color: var(--white);
}

.requirement_is-btn-active {
  background-color: var(--pop_orange3);
  color: var(--white);
}

.requirement_is-btn-active:after {
  border-top-color: var(--pop_orange3);
}

.requirement_heading {
  background-color: var(--pop_orange4);
}

.requirement_heading > p {
  color: var(--white);
}

.requirement_text > p {
  color: var(--title_color);
}

.requirement_text_heading {
  color: var(--title_color);
}

.emp-cond-tab dt:after {
  background: var(--pop_orange3);
}

.emp-cond-tab dt {
  color: var(--title_color);
}

.emp-cond-tab dd {
  color: var(--title_color);
}

.flow_box {
  background: var(--pop_orange3);
}

.flow {
  background: var(--pop_orange3);
}

.flow_wrap {
  background: var(--white);
}

.flow_h2 {
  color: var(--pop_orange4);
}

.flow_text {
  color: var(--title_color);
}

.faq_box {
  background: var(--pop_orange4);
}

.faq {
  background: var(--pop_orange4);
}

.faq_accordion {
  background: var(--white);
}

.faq_heading_text {
  color: var(--title_color);
}

.faq_heading::after,
.faq_heading::before {
  background-color: var(--pop_orange4);
}

.faq_wrap p {
  color: var(--title_color);
}

.faq_wrap p span {
  color: var(--title_color);
}

.faq_accordion span {
  color: var(--title_color);
}

.point_pop_fill {
  fill: var(--pop_yellow2);
}

.point_pop_stroke {
  stroke: var(--pop_yellow2);
}

.clock_simple_fill {
  fill: var(--pop_yellow2);
}

.clock_simple_stroke {
  stroke: var(--pop_yellow2);
}

.tab-schedule {
  border: 3px solid var(--pop_yellow2);
}

.tab_requirement {
  border: 3px solid var(--pop_orange3);
}

.tab-list-item {
  color: var(--pop_orange3);
  background-color: var(--white);
}

.tab-contents {
  background-color: var(--white);
}

.is-btn-active {
  background-color: var(--pop_orange3);
  color: var(--white);
}

.is-btn-active:after {
  border-top-color: var(--pop_orange3);
}

.charm_box {
  background: var(--pop_orange2);
}

.charm_h2 {
  color: var(--pop_orange4);
}

.charm_loopslide {
  background-color: var(--pop_yellow);
}

.tab-wrap .tab-box {
  display: flex;

}

.tab-box .tab-btn-wrap h2 {
  color: var(--pop_orange4);
  font-size: 17px;
}

.tab-btn-wrap {
  background-color: var(--pop_orange1);
}

.tab-btn.show {
  background-color: var(--white);
  color: var(--pop_orange4);
  border: 2px solid var(--pop_orange3);
}

.tab-contents.show {
  border-top: 2px solid var(--pop_orange3);
}

.show-more-button.schedule-more-button {
  border-color: var(--pop_orange4);
  color: var(--pop_orange4);
}

.schedule-more-button::before {
  content: none;
}

.slick-dotted .slick-dots li.slick-active button:before {
  color: var(--pop_orange4);
}

.slick-prev-recruit:before {
  background: url('../img/recruit/button_left_pop3.svg');
}

.slick-next-recruit:before {
  background: url('../img/recruit/button_right_pop3.svg');
}

.main_background_img {
  background: url('../img/recruit/main_background_3.svg');
  background-size: cover;
}

@media only screen and ( min-width : 1201px ) {
  .tree_img {
    background-image: url('../img/recruit/tree_3.svg');
    background-size: cover;
    background-position: center;
    height: 100px;
    width: 100%;
  }

  .tree_img_left {
    background-image: url('../img/recruit/tree_left_3.svg');
    width: 100%;
    height: 0;
    padding-bottom: 8%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
  }

  .tree_img_right {
    background-image: url('../img/recruit/tree_right_3.svg');
    width: 100%;
    height: 0;
    padding-bottom: 8%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
  }
}

@media only screen and ( max-width : 1200px ) {
  .tree_img {
    background: url('../img/recruit/tree_3.svg');
    background-size: cover;
    height: 70px;
    width: 100%;
  }

  .tree_img_left {
    background: url('../img/recruit/tree_left_3.svg');
    background-size: cover;
    height: 70px;
    width: 100%;
  }

  .tree_img_right {
    background: url('../img/recruit/tree_right_3.svg');
    background-size: cover;
    height: 70px;
    width: 100%;
  }
}

@media only screen and ( max-width : 428px ) {
  .tree_img_sp {
    background: url('../img/recruit/tree_sp_3.svg');
    background-size: cover;
    background-position: center;
    height: 64px;
    width: 100%;
  }

  .tree_img_left_sp {
    background: url('../img/recruit/tree_left_sp_3.svg');
    background-size: cover;
    background-position: center;
    height: 64px;
    width: 100%;
  }

  .tree_img_right_sp {
    background: url('../img/recruit/tree_right_sp_3.svg');
    background-size: cover;
    background-position: center;
    height: 64px;
    width: 100%;
  }
}


@media only screen and ( max-width : 375px ) {
  .tree_img_sp {
    background: url('../img/recruit/tree_sp_3.svg');
    background-size: cover;
    background-position: center;
    height: 54px;
    width: 100%;
  }

  .tree_img_left_sp {
    background: url('../img/recruit/tree_left_sp_3.svg');
    background-size: cover;
    background-position: center;
    height: 54px;
    width: 100%;
  }

  .tree_img_right_sp {
    background: url('../img/recruit/tree_right_sp_3.svg');
    background-size: cover;
    background-position: center;
    height: 54px;
    width: 100%;
  }
}

.job_listing_img_headline {
  background: url('../img/recruit/job_listing_headline3.svg');
  background-size: cover;
  height: 38px;
  width: 100%;
}

@media only screen and ( min-width : 429px ) {
  .staff_town {
    background: url('../img/recruit/town_3.svg');
    background-size: cover;
    height: 100px;
    width: 100%;
  }
}

@media only screen and ( max-width : 428px ) {
  .staff_town_sp {
    background: url('../img/recruit/town_sp_3.svg');
    background-size: cover;
    height: 50px;
    width: 100%;
  }
}

.flow_wave_img {
  background: url('../img/recruit/wave_3.svg');
  background-size: cover;
  height: 100px;
  width: 100%;
}

.charm_title_box {
  position: absolute;
  top: -140px;
  line-height: 0;
  overflow: hidden;
  width: 100%;
} 

@media only screen and ( min-width : 429px ) {
  .cloud {
    background: url('../img/recruit/cloud.svg');
    background-size: cover;
    background-position: center;
    height: 140px;
    width: 100%;
  }
}

@media only screen and ( max-width : 428px ) {
  .cloud_sp {
    background: url('../img/recruit/cloud_sp.svg');
    background-size: cover;
    background-position: center;
    height: 100px;
    width: 100%;
  }
}

.tab-content {
  border-top-color: var(--pop_orange3);
}

.tab-content .flex-box:first-of-type {
  display: none;
}

.recruit-order-h {
  display: none;
}