@charset 'utf-8';

/*  -------------------------------------
			TOTAL　SETTING
 -------------------------------------*/
/*.sec_aboutus::after,.service_headsec::after,.service_details::after {
	width:110vw;
  position:absolute;
  height:100%;
  z-index:-1;
  border-bottom: 1px solid #DEE2E8;
  left:-10vw;
  top:0;
  content:'';
}
.sec_aboutus::after{
	left:-10vw;
}
.service_headsec::after{
	left:-15vw;
}
.service_details::after{
	left:-10vw;
}*/

.top_main_wrap{
  width: 100%;
  max-width: 1920px;
 overflow: hidden;
    padding: 0 5%;
  position:relative;
    display: block;
      margin: 70px auto 0;
      padding-top: 28px;
}
/*.top_main_wrap::after{
  content:'';
  top:0%;
    left: 5%;
    width: 90%;
  border-right:1px solid #DEE2E8;
    border-left:1px solid #DEE2E8;
  height:100%;
  position:absolute;
  z-index:-1;
}*/
h3{
margin-top:2rem;
}
img {
  z-index: 9980;
}
.mdl_fv{
color:#fff;
}
.mdl_fv h3{
font-size:clamp(2rem, 1.654rem + 1.54vw, 3.5rem);
}
.ifame.chatbot{
    right: -8vw !important;
}
/*  -------------------------------------
				main-visual
 -------------------------------------*/
.fv {
background:linear-gradient(20deg, #0F4E90 1%, rgba(15, 78, 144, 0.31), transparent 64%);
  background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  color: #FFF;
  width: 100vw;
    transform: translateX(-5vw);
  position:relative;
}

.fv::before {
  content:"";
  position:absolute;
  width:100%;
  height:100%;
  background: linear-gradient(20deg, #0F4E90 1%, #0F4E9060, transparent 64%) center/cover;
}
.fv_h1box {
  font-size: clamp(2rem, 1.273rem + 2.42vw, 4rem);
  line-height: 1.6;
  background: linear-gradient(transparent 95%, #fff 0%);
  display: inline;
  padding-bottom: clamp(0.2rem, 0.2rem + 0.31vw, 0.8rem);
  color: #FFF;
  margin-bottom: 1.9rem;
  font-weight: 900;

}

.fv_h1box p {
  font-weight: 900;
  line-height: 1.25;

}

.p_fv {
    font-size: 18px;
    line-height: 1.75;
    color: #FFF;
    margin-top: 3rem;
}

/*  -------------------------------------
				about-us
 -------------------------------------*/
.sec_aboutus{
width: 95%;
    max-width: inherit;
    margin: clamp(2rem, 1.423rem + 2.56vw, 4.5rem) 0 0;
    display: flex;
    justify-content: right;
    align-items: center;
    gap: 5rem;
    position: relative;
    margin-left: 5vw;
    padding-bottom: clamp(2rem, 1.423rem + 2.56vw, 4.5rem);
}
.h3_aboutus {
  line-height: 1.5;
  background: linear-gradient(transparent 95%, #020239 0%);
  display: inline;
  padding-bottom: 0.4rem;
  letter-spacing: 0.96px;
}

.title_aboutus {
  margin-top: 24px;
  font-weight: 900;
  font-size: clamp(2.5rem, 2.269rem + 1.03vw, 3.5rem);
  line-height: 1.4;
  margin-bottom: 48px;
}

.p_aboutus {
  font-size: 18px;
  line-height: 2.2;
  width: clamp(30rem, 28.409rem + 7.95vw, 36rem);
  height: auto;
  margin-bottom: 28px;
}

.contact_navy p {
  color: #fff;
}

.aboutus_right {
  width: 56%;
  margin-bottom:clamp(2rem, 1.423rem + 2.56vw, 4.5rem);
}

.aboutus_right img:nth-of-type(1) {
  margin-bottom: 48px;
  width: 64.6%;
  max-width: 620px;
  object-fit: contain;
}

.aboutus_right img:nth-of-type(2) {
  margin-left: 12%;
  width: 89%;
  object-fit: contain;
}

/*  -------------------------------------
				service
 -------------------------------------*/

.accent-font {
  font-family: "Montserrat", serif;
  font-style: SemiBold;
}

.service_headsec {
  display: flex;
    margin-left: 6%;
align-items: center;
  border: 1px 0 1px 0 solid #DEE2E8;
  position:relative;
    padding-bottom: 5rem;
}

.service_headsec h3 {
  letter-spacing: 0.96px;
}

.service_headsec_left {
  margin-right: 160px;
  padding: 80px 0;
}

.service_headsec_left h2 {
  line-height: 1.5;
  background: linear-gradient(transparent 95%, #020239 0%);
  display: inline;
  padding-bottom: 0.4rem;
  font-family: "Montserrat", serif;
  font-style: SemiBold;
}

.ttl_weightblack {
  font-weight: 900;
}

.ttl_service {
    margin-top: 6px;
    font-size: clamp(2.5rem, 2.269rem + 1.03vw, 3.5rem);
    width: 224px;
}
.top_main_wrap .btm_vis .fv_inbox{
  background: linear-gradient(55deg, #0F4E90 1%, #0F4E9060, transparent 64%);
      width: 133.5%;
    height: 800px;
    position: absolute;
    top:0;
    left: 0;
    z-index: 100;
    aspect-ratio: 12 / 5;
  display: flex;
    align-items: center;
}
.service_p_right {
  line-height: 1.75;
  font-size: 16px;
  margin-right: 12%;
  margin-top: 20px;
}

.container_service_dtl {
  margin: 0 0 0 auto;
}

.service_details {
  display: flex;
  justify-content: space-between;
  	gap:2rem;
    position: relative;
	width: 100%;
    margin-left: auto;
}

.service_detail_num {
  display: flex;
  margin-bottom: clamp(0.75rem, 0.75rem + 1vw, 3rem);
      padding-top: 4rem;

}

.service_detail_num p {
  font-weight: bold;
  font-size: clamp(1.5rem, 1.269rem + 1.03vw, 2.5rem);
  margin-right: 16px;

}

.service_detail_num h3 {
  font-size: clamp(2.25rem, 2.1rem + 1.79vw, 4.5rem);
        margin-top: 0;
}

.service_details_left {
    margin-left: 5%;
      padding-bottom: 4rem;
}

.service_details_left_p {
    padding-top: 1rem;
    line-height: 1.75;
    padding-bottom: clamp(1rem, 0.538rem + 2.05vw, 3rem);
}

.btn_service {
  margin: 0 0 0 auto;
}

.service_details img {
  width: 50%;
  object-fit: cover;
}
.svc_box{
    width: 100%;
    display: block;
    margin: 0 0 0 auto;
    padding-bottom: clamp(2rem, 1.654rem + 1.54vw, 3.5rem);
}
.pdng_und_serv {
  height: 80px;
  width: 90%;
  margin: 0 auto;
  border: 1px solid #DEE2E8;
}

/*  -------------------------------------
				recruit
 -------------------------------------*/
.btm_vis {
    margin-bottom: clamp(2rem, 1.654rem + 1.54vw, 3.5rem);
      width: 111%;
  transform: translateX(-5vw);
        background-size: cover;
    aspect-ratio:4/5;
 height:800px;
  display:block;
  position:relative;
}

.btm_vis_txts {
  max-width: 70%;
  color: #fff;
    padding: 5% 0;
      margin-left: 5%;
}

.btm_vis_txts h2 {
  line-height: 1.5;
  background: linear-gradient(transparent 95%, #fff 0%);
  display: inline;
  padding-bottom: 0.4rem;
  letter-spacing: 0.96px;
}

.btm_vis_txts h3 {
  margin-top: 3%;
  font-size: clamp(1.25rem, 1.5rem + 1.75vw, 3.5rem);
  margin-bottom: 2rem;
  line-height: 1.4;
  font-weight: 900;
}

.recruit_p {
  font-size: 18px;
  line-height: 2.2;
  color: #fff;
  margin-bottom: 6%;
}

.btm_vis .btn_navy {
  margin: 0 0 0 auto;
}

.btn_vis p {
  font-size: 16px;
  font-weight: medium;
}

.pdng_undr_rcrt {
  height: 80px;
  width: 90%;
  margin: 0 auto;
  border: 1px solid #DEE2E8;
}
.btm_vis .fv_img{
  display:flex;
  align-items:flex-start;
     justify-content: center;
  overflow:hidden;
      height: auto;
  object-fit:cover;
    position: relative;
    z-index: -1;
}
.btm_vis .fv_img img{
    height: 800px;
  width:auto;
  aspect-ratio:4/5;
object-fit:cover;
  
}
/*  -------------------------------------
				company
 -------------------------------------*/
.company {
  padding-top: 80px;
  border: 1px 0 1px 0 solid #DEE2E8;
  position:relative;
      width: 70%;
    margin: 0 auto;
      margin-top: 32px;
}
/*.company::after{
    width: 127vw;
    position: absolute;
    height: 100%;
    z-index: -1;
    border-top: 1px solid #DEE2E8;
    left: -21vw;
  top:0;
    content:'';
}*/
.company h2 {
  margin-bottom: 24px;
  line-height: 1.5;
  letter-spacing: 0.96px;
  background: linear-gradient(transparent 95%, #020239 0%);
  display: inline;
  padding-bottom: 0.6rem;
}

.company h3 {
  font-size: 56px;
  line-height: 1.4;
  font-weight: 900;
}

.comp_ttl {
  display: flex;
  justify-content: space-between;
  height: 65px;
}
.comp_ttl  p:first-child{
    font-size: clamp(2.5rem, 2.269rem + 1.03vw, 3.5rem);
    font-weight: 900;
}
.comp_ttl  .btn_navy p:first-child{
      font-size: 1rem;
    font-weight: inherit;
}
.comp_flex_pbox h3{
    font-size: 1.25rem;
      font-weight: bold;
}
.comp_flexbox {
  display: flex;
  justify-content: center;
    max-width: 100%;
    margin: 0 auto;
    margin-bottom: 104px;
    gap: clamp(1rem, 0.5rem + 4vw, 6rem);
}
.comp_ttl a.btn_navy {
    transform: translateY(40px);
}
.top_map {
  max-width: 620px;
  max-height: 620px;
  display: block;
  aspect-ratio: 1/1;
}

.top_map iframe {
  width: 100%;
  height: 100%;
  border: none;
}
.comp_flex_left {
  width: 50%;
  max-height: 1186px;
}
.comp_flex_left iframe {
  margin-top: auto;
}

.comp_flx_l_ttl {
  max-width: 100%;
  margin: 0 auto 64px;
}
.comp_flex_left .comp_flex_pbox {
  width: 100%;
  height: 180px;
}

.comp_flex_right .comp_flex_pbox {
  width: 100%;
  height: 180px;
}
.comp_flex_left p:nth-of-type(2) {
  font-size: 1rem;
  line-height: 1.5;
  margin-bottom: 8px;
  align-items: bottom;
}

.comp_flex_right {
  width: 50%;
  max-height: 182px;
}

.comp_flex_pbox a {
  color: inherit;
}

.comp_flex_right .btn_navy {
  margin-bottom: 56px;
}

.comp_flex_right p:nth-child(1) {
  font-size: px;
  margin-bottom: 16px
}

.comp_flex_right p:nth-child(1) {
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 8px;
  line-height: 1.5;
}
    .comp_flex_pbox p,.comp_flex_pbox a {
  font-size: 1rem;
  line-height: 2;
}

.btm_fixed {
  display: none;
}

.btn_navy{
    margin: 0 0 0 auto;
}
.p_topcmpttl{
    margin-top: 1.25rem;
    margin-bottom: 1rem;
}
  .service_details_left_p {
    margin-left: 5%; 
   //width: 25.6vw;
    max-width: 90%;
  }
.btm_vis_sldup{
color:#fff;
}
/*  -------------------------------------
				responsive
 -------------------------------------*/
@media (max-width:1440px) {
  .service_details_left {
    margin-left: 8%;
  }
  .sec_aboutus {
    gap: 2rem;
  }
}

@media (max-width:1280px) {

.comp_flx_l_ttl {
  max-width: 85%;
}
  .service_detail_num h3 {
    min-width: 290px;
  }
.company {
      width: 100%;
}
 
.pdng_und_serv {
    width: 90%;
    margin: 0 auto;
    height: 32px;
    border: 1px solid #DEE2E8;
  }
  .recruit_p {
    margin-bottom: 3%;
  }


  .comp_ttl {
    display: flex;
    justify-content: space-between;
    margin-top: 16px;
  }
   .service_details {
    display: block;
    width: 90%;
    margin: 0 auto;

  }
  .service_details img {
        width: 111%;
        display: block;
        margin: 0 auto;
        transform: translateX(-5%);
            height: clamp(11.5rem, 6.077rem + 24.1vw, 35rem);
  }
  .service {
    margin-bottom: 0px;
  }
  .service_p_right {
    width: 90%;
    margin-right: auto;
    margin-left: auto;
  }
  .service_details_left {
    padding-top: 32px;
    margin-right: 0;
    margin-left: 10%;
  }
  .service_details_left_p {
    margin-right: 8%;
    margin-left: 3%;
  }
  .service_details_left {
        margin-left: 4%;
        padding-top: 12%;
        padding-bottom: 6%;
        margin: 0 auto 0;
  }
  .service_details_left_p {
    margin-bottom: 14px;
  }
  .service_detail_num {
    margin-bottom: 12px;
        padding-top: 0;
  }
  .service_p_right {
    margin-right: 8%;
            line-height: 2;
  }
  .service_headsec {
    margin-left: 8%;
    padding-top: clamp(3.5rem, 1.423rem + 2.56vw, 4.5rem);
    display: block;
    padding-bottom: 48px;
  }
  .service_headsec_left {
    margin-right: 80px;
    padding: 0 0 28px;
  }
        .service_details_left_p {
        width: 95%;
margin-bottom: 1.5rem;
        margin-top: 0;
        padding: 1rem 0 0;
  }
      .service_details_left {
        padding-bottom: 0;
                width: 90%;
                margin-bottom: 2rem;
  }
  .comp_flexbox {
    width: 85%;
  }
}

@media (max-width:1024px) {
  .top_main_wrap {
     padding-top: 0; 
}
  
    .comp_flx_l_ttl {
        max-width: 80%;
  }
.btm_vis {
         aspect-ratio: 12 / 5;
  background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        height: 800px;
        width: 100vw;
        transform: translateX(-5%);
        margin-bottom: clamp(0.7rem, 0.7rem + 7vw, 3rem);
        display: flex;
        flex-direction: column;
        justify-content: center;      
  position:relative;
  padding:0;
  }
  .comp_flexbox {
    max-width: 80%;
  }
  
  .btm_vis .fv_img{
    display:flex;
    gap:0;
    align-items:flex-start;
  }
  .comp_flex_pbox p, .comp_flex_pbox a {
    line-height: 1.75;
  }
  .sec_aboutus {
    padding-bottom: 72px;
  }
  .p_aboutus {
    width: 428px;
  }
  
  h3{
margin-top: 0px;
  }
    .sec_aboutus {
    padding-top: 74px;
    padding-bottom: 0px;
    display: block;
    padding-right: 10%;
    margin: 72px auto 0;
  }
  .aboutus_right {
            width: 110%;
    padding-bottom: 6rem;
            margin-bottom: 0;
  }
  .aboutus_left {
        width: 80%;
        display: block;
        margin: 0 auto 3rem;
  }
  .aboutus_right img{
    height:clamp(8.625rem, 2.976rem + 25.11vw, 23.063rem);
  }
  .p_aboutus {
    width: 100%;
  }
  .title_aboutus {
    margin-bottom: 32px;
  }        
    .sec_aboutus {
        padding: 0 5% 0 0;
  }
  .aboutus_right img:nth-of-type(2) {
    margin-left: 19%;
    width: 89%;
  }
}


@media (max-width:820px) {
  .fv p:nth-child(1) {
    font-size: 48px;
    padding-bottom: 0.56rem;
  }
  .pdng_und_serv {
    height: 48px;
  }

  .pdng_undr_rcrt {
    height: 48px;
  }

  .comp_ttl {
    align-items: center;
    margin-top: 24px;
  }

    .aboutus_left a.btn_navy,.service_details a.btn_navy,.btm_vis a.btn_navy{
    display:block;
        margin: 0 0 clamp(2rem, 1.423rem + 2.56vw, 4.5rem) auto;
  }
  .p_aboutus{
          margin-bottom: 0.75rem;
}
  .company iframe{
  width:100%;
    max-width:inherit;
    max-height:inherit;
  }

    .comp_flexbox {
    max-width: 100%;
            flex-direction: column;
            align-items: center;
            width: 80%;
  }
    .comp_flex_left .comp_flex_pbox {
    height: fit-content;
           margin: 0 0 1rem;
  }
  .comp_flx_l_ttl {
    margin: 0 auto 96px;
  }
  .comp_flex_left {
    width: 100%;
                margin-bottom: 4rem;
  }

  .comp_flex_right .comp_flex_pbox {
    margin: 0 0 1rem;
            height: fit-content;
  }
  .comp_flex_right {
    width: 100%;
            max-height: inherit;
  }
  .btm_vis_txts {
  
        width: 78%;
        margin-right: auto;
  }
      .comp_flex_pbox p, .comp_flex_pbox a {
        line-height: 2;
  }
  .top_main_wrap .btm_vis .fv_inbox {
    align-items: flex-end;
  }
        .aboutus_left {
        width: 90%;
  }
  .btm_vis_txts {
    max-width: 555px;
  }
      .service_p_right {
        width: 95%;
  }
      .service_headsec {
        margin-left: 5%;
  }
      .service_details_left {
        width: 100%;
  }
      .service_details_left_p {
        margin-left: 1%;
  }
      .service_details_left_p {
        width: 100%;
  }
}



@media (max-width:768px) {

      .btm_vis {
        margin-bottom: 0;
        height: 660px;
  }
      .btm_vis .fv_img {
flex-direction: column;
        height: 660px;
        aspect-ratio: 393 / 660;
        align-items: center;
        justify-content: center;
  }
      .btm_vis .fv_img img{
        aspect-ratio: 393 / 220;
        width:100%;
  }
 .top_main_wrap .btm_vis .fv_inbox {
  height:660px;
    background: linear-gradient(55deg, #0F4E90 1%, #0F4E9065, transparent 93%);
  }

  .btm_vis .btn_navy {
    margin-right: 0%;
  }

  .comp_flexbox {
    gap: 5%;
    max-width: 80%;
  }

  .fv p:first-child {
    font-size: 2rem;
    line-height: 1.7;
    padding-bottom: 0.1rem;
  }
  .p_fv {
    font-size: 14px;
        line-height: 1.75;
    margin-top: 1rem;
  }
  .title_aboutus {
    font-size: 40px;
  }

  .p_aboutus {
    font-size: 14px;
    margin-bottom: 24px;
    margin-top: 1rem;
  }

  .sec_aboutus {
    padding-bottom: 48px;
    gap: 4%;
  }

  .title_aboutus {
    margin-bottom: 12px;
  }
  .service {
        padding: 0 5%;
  }
  .service_details {
            width: 100%;
  }
  .service_details_left{
  padding-left:5vw;
        gap: 0.5rem;
  }
  .recruit_p {
    font-size: 14px;
            margin-bottom: 7%;
  }
  .company h3 {
            margin-bottom: 1rem;
  }

  .comp_ttl {
    display: block;
  }
  .service_headsec {
    display: block;
        margin-left: 0;
  }

  .service_p_right {
    margin-top: 0;
        width: 100%;
  }
  .service_headsec_left {
    margin-right: 160px;
    padding: 0 0 24px;
  }
  .pdng_und_serv {
    height: 32px;
  }
  .pdng_undr_rcrt {
    height: 32px;
  }
  .fv_h1box {
    padding-bottom: 0.4rem;
    
  }
      .service_details_left {
        padding-right: 0%;
        padding-left: 0%;
}
      .service_details img {
        width: 100%;
        transform: translateX(0%);
  }
  .service_detail_num p {
    margin-right: 0.25rem;
}
}

@media (max-width:767px) {
  .fv{
            height: 80vh;
    max-height:600px;
  }
.fv_img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.fv .fv_inbox{
    top:70%;
  }
}
@media(max-width:468px){
  .p_aboutus br{
  display:none;
  }
 .top_main_wrap .btm_vis  .fv_inbox {
    padding-left: 0;
        margin: 0 auto;
    width: 100%;
        align-items: flex-end;
  }
      .service_details_left_p {
        width: 100%;
  }
    .company {
        width: 90%;
  }
  .cntfin_box h3 {
        margin-bottom: 1.25rem;
  }
  .btm_vis {
      background: linear-gradient(20deg, #0F4E90 1%, #0F4E9060 10%, transparent 50%);
         height: 660px;
padding: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-end;
            background-size: cover;
  }
  .comp_flexbox {
      max-width: 100%;
  }
  .btm_vis_txts {
        width: 85%;
        margin-left: auto;
  }
        .aboutus_right {
        padding-bottom: 0;
                  width: 100%;
  }
    .sec_aboutus {
              padding: 0 0 48px;
              width: 100%;
  }
  .service_detail_num {
    padding-top: 0rem;
  }
  .comp_flex_pbox p, .comp_flex_pbox a {
    font-size: 1rem;
  }
      .comp_flexbox {
        width: 100%;
  }
  .comp_ttl .btn_navy p:first-child {
    font-size: 1rem;
  }
      a.btn_navy {
        padding: 0.75rem 1rem;
        width: 158px;
  }
      .aboutus_left {
        width: 88%;
                margin-bottom: 4rem;
  }
  
  .p_aboutus {
        width: 100%;
  }
      .service_details_left_p {
        margin-right: 0;
                margin-left: 0;
                font-size: 14px;
        max-width: 100%;
  }
  .p_topcmpttl {
    margin-bottom: 0;
  }
      .service_p_right {
        margin-left: 0;
                font-size: 14px;
  }
  .comp_flx_l_ttl {
    max-width: 100%;
  }
}