@charset "utf-8";
/* CSS Document */
body {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 1.5px;
  color: #000;
  background: #fff;
  position: relative;
}
img {
  display: block;
  max-width: 100%;
  height: auto;
}
/*------------------------
      Font Family
------------------------*/
/*.poppins-bold {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.noto-sans-jp-<uniquifier> {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

.nunito-<uniquifier> {
  font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}

.cabin-<uniquifier> {
  font-family: "Cabin", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-variation-settings:
    "wdth" <width>;
}
*/




@media screen and (min-width: 768px) {
 .gnav_list{
    /*font-size: 20px;*/
	 font-size: clamp(18px, 1vw, 20px);
  }
}

@media screen and (min-width: 768px) {
  .gnav .btn{
   	 font-size: clamp(18px, 1vw, 20px);

  }
}

@media screen and (min-width: 768px) {
  .nav_list {
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
  }
}
.top_title_deco {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  /*font-size: 36px;*/
  color: #FFD54F;
  font-size: clamp(36px, 8vw, 128px);
}
@media screen and (min-width: 768px) {
  .top_title_deco {
   /*font-size: 128px;*/
  }
}
.txt {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  font-size: 14px;
}
@media screen and (min-width: 768px) {
  .txt {
    font-size: 20px;
  }
}
.catchcopy {
  font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  /*font-size: 24px;*/
  color: #fff;
  font-size: clamp(24px, 4vw, 64px);
	
}
@media screen and (min-width: 1779px) {
  .catchcopy {
    /*font-size: 64px;*/
  }
}
.title {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(20px, 3vw, 32px);

  /*font-size: 20px;*/
}
@media screen and (min-width: 768px) {
  .title {
    /*font-size: 32px;*/
  }
}
.message .top_title_deco {
  color: #B2D6FF;
}
.message .title, .message .txt {
  color: #fff;
}
.top_message_lead {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  font-size: 16px;
  color: #fff;
}
@media screen and (min-width: 768px) {
  .top_message_lead {
    font-size: 24px;
  }
}
.staff_comment p {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #fff;
}

@media screen and (min-width: 768px) {
  .staff_comment p  {
	  
    font-size: clamp(16px, 1vw, 24px);
  }
}


.recruit_flow_step {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-style: normal;
  color: #fff;
  font-size: clamp(14px, 1vw, 20px);
}

@media screen and (min-width: 768px) {
   .recruit_flow_step{
    /*font-size: 24px;*/
  }
}



.recruit_flow_mission {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  color: #30B1AA;
  font-size: clamp(14px, 1vw, 20px);
}

@media screen and (min-width: 768px) {
.recruit_flow_mission {
    /*font-size: 24px;*/
  }
}


.qanda .title {
  color: #fff;
}

.en{
font-family: "Inter", sans-serif;
font-weight: 600;
/*font-size: 24px;*/
font-size: clamp(24px, 2vw, 32px);
}

@media screen and (min-width: 768px) {
.en{
font-family: "Inter", sans-serif;
font-weight: 600;
/*font-size: 32px;*/
  }
}
.question{
  color: inherit;
  background-color: #fff; /* すでに指定済みだけど明示的に */
  -webkit-tap-highlight-color: transparent;
}

.question::after{
font-family: "Inter", sans-serif;
font-weight: 600;
font-size: clamp(24px, 2vw, 32px);
/*font-size: 24px;*/
}


@media screen and (min-width: 768px) {
.question::after{
font-family: "Inter", sans-serif;
font-weight: 600;
/*font-size: 32px;*/
  }
}

.question_txt {
   font-size: clamp(14px, 2vw, 20px);
   
    }



.cta_lead {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size:clamp(18px, 2vw, 48px);
  /*font-size: 18px;*/
}
@media screen and (min-width: 768px) {
  .cta_lead {
    /*font-size: 48px;*/
  }
}
.cta_txt {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  font-size:clamp(14px, 2vw, 32px);
  /*font-size: 14px;*/
}
@media screen and (min-width: 768px) {
  .cta_txt {
    /*font-size: 32px;*/
  }
}
.footer_gnav_list {
  font-size: 20px;
  color: #fff;
}
footer .txt {
  color: #fff;
  font-size: 14px;
  font-weight: 400;
}
@media screen and (min-width: 1500px) {
  footer .txt {
    font-size: 20px;
  }
}
.copyright {
  color: #fff;
  font-size: 10px;
}

@media screen and (min-width: 1500px) {
  .copyright {
    font-size: 12px;
  }
}

/*------------------------
      common parts
------------------------*/
.btn{
  width: calc(150 / 375 * 100%);
  padding: 10px 0;
  max-width: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  border-radius: 50px;
  background: linear-gradient(90deg, #E65C00 0%, #EBC300 100%);
  color: #fff;
  /*height: 39px;*/
  /*width:calc( 150 / 375 * 100%);
	display: inline-block;
	font-size:16px;
	border-radius:50px;
	background: linear-gradient(90deg, #E65C00 0%, #EBC300 100%);
	color: #fff;
	height: 39px;*/
}

@media screen and (min-width: 768px) {
  .btn{
   
	padding: 15px 0px;
    max-width: 315px;
	font-size: 20px;
	
  }
}



.btn::after {
  content: '';
  display: inline-block;
  margin-left: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  padding: 4px;
  transform: rotate(-45deg);
}


.map {
  display: inline-block;
  box-sizing: border-box;
}
/*------------------------
      common section
------------------------*/
header {
  /*padding-top: 10px;
  padding-bottom: 10px;*/
  position: fixed;
  z-index: 1000;
  width: 100%;
  max-height: 75px;
}


@media screen and (min-width: 1500px) {
  header {
   /* padding-top: 30px;
    padding-bottom: 30px;*/
    max-height: 170px;
	

  }
}
.header_inner {
  width: calc(362 / 375 * 100%);
  max-width: 362px;
  margin-left: 15px;
  margin-right: auto;
  height: 75px;
  margin-top: auto;
  margin-bottom: auto;
  /*margin: 0 auto;*/
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (min-width: 1500px) {
  .header_inner {
    width: calc(1761 / 1920 * 100%);
	max-width: 1761px;
	margin-left: 85px;
    margin-right: auto;
    height: 175px;
    justify-content: space-between;
    align-items: center;
  }
}
h1 {
  width: calc(268 / 362 * 100%);
  max-width: 268px;
}
@media screen and (min-width: 1500px) {
  h1 {
    width: calc(485 / 1761 * 100%);
	max-width: 485px;
  }
}
h1 a {}
#header_logo {}
.gnav {
  display: none;
}



@media screen and (min-width: 1500px) {
  .gnav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: calc( 1100 / 1761 * 100%);
  /*flexの左端に謎の余白*/
}
}




@media screen and (min-width: 1500px) {
  .gnav_list {
	 width: calc( 570 / 1022 * 100%);  
    display: flex;
    justify-content: space-between;
  }
}


@media screen and (min-width: 1500px) {
  .gnav .btn{
   width: calc( 314 / 1022 * 100%);
   width: 100%;
   padding: 20px 40px;
  }
}


nav ul li {}
nav ul li a {}
.hamburger {
  width: calc(75 / 375 * 100%);
  aspect-ratio: 1 / 1;
  max-width: 75px;
  background-color: #005CC4; /* 青い四角 */
  border: none;
  cursor: pointer;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1100;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (min-width: 1500px) {
  .hamburger {
    display: none; /* ハンバーガーは非表示 */
  }
}

.hamburger span {
  display: block;
  width: 25px;
  height: 2px;
  margin: 5px auto;
  background: #fff; /* 好きな色に変更 */
  border-radius: 2px;
  transition: 0.6s;
}
.hamburger .toggle span:nth-of-type(1) {}
.hamburger .toggle span:nth-of-type(2) {
  opacity: 1;
}
.hamburger .toggle span:nth-of-type(3) {}
.hamburger.active .toggle span {
  background: #fff;
}
.hamburger.active .toggle span:nth-of-type(1) {
  transform: translateY(7px) rotate(45deg);
  /*transform-origin: center;
	transform: rotate(45deg);*/
}
.hamburger.active .toggle span:nth-of-type(2) {
  opacity: 0;
}
.hamburger.active .toggle span:nth-of-type(3) {
  transform: translateY(-7px) rotate(-45deg);
  /*transform-origin: center;
		transform: rotate(-45deg);*/
}
.spnav {
  width: 0;
  height: 0;
  position: fixed;
  top: 0;
  right: 0;
  opacity: 0;
  transition: opacity 0.6s;
}
.spnav.active {
  width: 100%;
  height: 100%;
  background-color: #E9F3FA;
  opacity: 1;
  z-index: 900;
  
}
.nav_list{
  padding-top: 100px;
  margin-bottom: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 25px;
}

@media screen and (min-width: 768px) {
  .nav_list {
      padding-top: 150px;
  margin-bottom: 50px;
	  gap: 40px;

  }
}



.btn_wrapper {
  max-width: 315px;
  width: calc(150 / 375 * 100%);
  display: flex;
  align-items: center;
  justify-content: center;
flex-direction: column;
 margin: 0 auto;
 /* margin: 0 auto;*/
  

}
.nav_list_btn {
  width: 100%;
  text-align: center;
}

.nav_list_btn:nth-child(1)
{   
	margin-bottom: 22px;}


@media screen and (min-width: 768px) {
  .nav_list_btn:nth-child(1){
    margin-bottom: 30px; 
  }
}




footer {
  padding-top: 30px;
  padding-bottom: 20px;
  background-color: #2C80E0;
}

@media screen and (min-width: 1500px) {
  footer {
   padding-top: 50px;
   padding-bottom: 65px;

  }

}




.footer_wrapper {
  width: calc(270 / 375 * 100%);
  margin: 0 auto calc(20 / 375 * 100%) 12px;
  max-width: 370px;
}

@media screen and (min-width: 1500px) {
  .footer_wrapper {
    width: calc(1687 / 1920 * 100%);
    margin: 0 auto 0 calc(85 / 1920 * 100%);
	max-width: 1687px;
  }
}
.footer_logo_gnav {}

@media screen and (min-width: 1500px) {
  .footer_logo_gnav {
    width: calc(1687 / 1687 * 100%);
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
}

#footer_logo{
  width: calc(270 / 270 * 100%);
  margin-bottom: 12px;
  max-width: 370px;
  
}


.footer_gnav {
  display: none;
}


@media screen and (min-width: 1500px) {
  .footer_gnav {
	width:calc( 570 / 1687 * 100%);
	min-width: 520px;
    display: block;
  }
}
@media screen and (min-width: 1500px) {
  .footer_gnav_list {
    display: flex;
	justify-content: space-between;
  }
}
.footer_txt {
  width:calc( 230 / 270 * 100%);
  margin-left: calc(45/ 270 *100%);
 /*カンプと違って改行かかってしまうのははテキストサイズ？なぜ？*/ 
}
@media screen and (min-width: 1500px) {
  .footer_txt {
    width: calc( 320 / 1687 * 100%);
	min-width:320px;
/*カンプと違って改行かかってしまうのははテキストサイズ？なぜ？*/
    margin-left: 70px;;
    margin-right: auto;
  }
}
.adress, .tel {
  margin-bottom: 12px;
}
.map {
  width:calc( 120 / 230 * 100%);
  padding: 10px 12px;
  border: #fff solid 1px;
  border-radius: 100px;
  margin-bottom: 30px;
  text-align: center;
  max-width: 151px;
}

@media screen and (min-width: 1500px) {
  .map {
      width:calc( 170 / 320 * 100%);
	  /*カンプと違って改行かかってしまうのははテキストサイズ？なぜ？*/
      padding: 10px 20px;
	  max-width: 200px;
  }
}

.copyright {}
footer p {}