@charset "UTF-8";

/*==========会社案内==========*/
#company .message_box {
    background: linear-gradient(to bottom, rgba(31, 76, 137, 1.0) 0, rgba(67, 109, 175, 1.0) 50%, rgba(14, 54, 109, 1.0) 100%);
    background: -webkit-linear-gradient(top, rgba(31, 76, 137, 1.0) 0, rgba(67, 109, 175, 1.0) 50%, rgba(14, 54, 109, 1.0) 100%);
    padding-bottom: 50px;
}
#company .message_box h2 {
    color: #fff;
}
#company .message_box .flex_box {
    display: flex;
    justify-content: space-between;
    width: 1000px;
    margin: 0 auto;
}
#company .message_box .flex_box .image_wrap {
    width: 30%;
    padding-top: 10px;
}
#company .message_box .flex_box .image_wrap img {
    width: 100%;
    height: auto;
    margin-bottom: 10px;
}
#company .message_box .flex_box .image_wrap .heading {
    color: #fff;
}
#company .message_box .flex_box .text_wrap {
    width: 65%;
}
#company .message_box .flex_box .text_wrap h3 {
background: none;
    color: #fff;
    font-size: 25px;
    padding: 0;
    margin-bottom: 30px;
}
#company .message_box .flex_box .text_wrap p {
    color: #fff;
}
#company .message_box .flex_box .text_wrap h3:before,
#company .message_box .flex_box .text_wrap h3:after {
display: none;
}

#company .table1 col.col1 { width:25%; }
#company .table1 col.col2 { width:15%; }
#company .table1 col.col3 { width:10%; }
#company .table1 col.col4 { width:45%; }

@media  print, screen and (max-width: 767px) {
    #company main .table_scroll table.table1 {
        min-width:550px;
    }
  #company main .table_scroll table.table2 {
        min-width:630px;
    }
#company .table1 col.col1 { width:20%; }
#company .table1 col.col2 { width:20%; }
#company .table1 col.col3 { width:10%; }
#company .table1 col.col4 { width:45%; }
    #company .message_box .flex_box {
        width:100%;
        flex-wrap: wrap;
    }
    #company .message_box .flex_box .image_wrap,
    #company .message_box .flex_box .text_wrap {
        width:100%;
    }
    
    #company .message_box .flex_box .image_wrap {
        text-align: center;
        margin-bottom: 30px;
    }
    #company .message_box .flex_box .image_wrap img {
        width:70%;
        margin-bottom: 20px;
    }
    #company .message_box .flex_box .text_wrap h3 {
        font-size: 20px;
        margin-bottom: 20px;
    }
}

#company .philosophy {
    position: relative;
    background: rgba(255, 255, 255, 1.0);
    filter: drop-shadow(20px 20px 0 rgba(255, 255, 255, 0.2));
    outline: 10px solid #fff;
    outline-offset: -10px;
    width: 900px;
    padding: 50px;
    margin: 0 auto;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

#company .philosophy:after {
    width: 100%;
    height: 300px;
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: none;
    opacity: .6;
    background: linear-gradient(
        to bottom,
        rgba(230, 236, 244, 1.0) 0,
        rgba(230, 236, 244, 1.0) 200px,
        transparent 100%
    );
    z-index: -2;
}

/* ===== ここからリスト ===== */

#company .philosophy ol {
    list-style: none;          /* markerを無効化 */
    counter-reset: num;        /* カウンター初期化 */
    padding: 0;
    margin: 0;
}

#company .philosophy ol li {
    counter-increment: num;
    position: relative;
    padding-left: 3.5rem;
    padding-bottom: 20px;
    padding-top: 20px;
    border-bottom: 1px solid #DCE0DE;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.7;
}

#company .philosophy ol li::before {
        content: counter(num);
    position: absolute;
    left: -6px;
    top: 9px;
    font-family: "Antonio", sans-serif;
    color: #3ebbba;
    font-size: 42px;
    line-height: 1;
    width: 3rem;
    text-align: right;
}

/*#company .philosophy {
    position: relative;
    background: rgba(255, 255, 255, 1.0);
    filter: drop-shadow(20px 20px 0 rgba(255, 255, 255, 0.2));
    outline: 10px solid #fff;
    outline-offset: -10px;
    width: 900px;
    padding: 50px;
    margin: 0 auto;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
#company .philosophy:after {
    width: 100%;
    height: 300px;
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: none;
    opacity: .6;
    background: -moz-linear-gradient(top, rgba(230, 236, 244, 1.0) 0, rgba(230, 236, 244, 1.0) 200px, transparent 100%);
    background: -webkit-linear-gradient(top, rgba(230, 236, 244, 1.0) 0, rgba(230, 236, 244, 1.0) 200px, transparent 100%);
    background: linear-gradient(to bottom, rgba(230, 236, 244, 1.0) 0, rgba(230, 236, 244, 1.0) 200px, transparent 100%);
    z-index: -2;
}
#company .philosophy ol {
list-style-position: inside;
}
#company .philosophy ol li::marker {
    font-family: "Antonio", sans-serif;
    color: #3ebbba;
    font-size: 35px;
}
#company .philosophy ol li {
    padding-bottom: 20px;
    border-bottom: 1px solid #DCE0DE;
    font-size: 18px;
    font-weight: bold;
    padding-left: 2rem;
}*/
@media  print, screen and (max-width: 767px) {
    #company .philosophy {
        width:100%;
        padding: 10px;
    }
    #company .philosophy ol li {
        padding: 10px;
        font-size: 14px;
        padding-left: 38px;
        line-height: 1.5;
    }
    #company .philosophy ol li::before {
    left: 0;
    width: 1.7rem;
}
}
.award_box {
    display: flex;
    gap:50px;
}
.award_box .text_wrap {
    width: 70%;
}
.award_box .text_wrap table {
    width: 100%;
}
.award_box .image_wrap {
    width: 30%;
}
.award_box .image_wrap img {
    width: 100%;
}
@media  print, screen and (max-width: 767px) {
.award_box {
    gap: 8px;
}
    .award_box .text_wrap {
    width: 65%;
}
.award_box .image_wrap {
    width: 35%;
}
}


/*==========私たちの仕事==========*/

#business .contents_head_navi {
    background: none;
    margin-bottom: 50px!important;
}
#business .contents_head_navi li {
    width: calc((100% - 50px) / 3); font-size: 18px; 
}
#business .contents_head_navi li:nth-child(3) {
    margin-left: 0!important;
}
#business main table tbody th,
#business main table tbody td {
    width: auto;
    padding: 10px;
    line-height: 1.5;
}
@media  print, screen and (max-width: 767px) {
    #business .contents_head_navi{
            margin-bottom: 16px !important;
    }
    #business .contents_head_navi ul{
        justify-content: flex-start;
    }
    #business .contents_head_navi li {
    width: 48%;
    font-size: 15px;
}
}

/*==========CSR活動==========*/
#csr .csr_box {
    padding: 35px 50px 25px 50px;
    box-sizing: border-box;
    background: #fff;
    z-index: 0;
    filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.1));  
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 30px;
}
#csr .csr_box .text_wrap {
    width: 60%;
}
#csr .csr_box .text_wrap.w100 {
    width: 100%;
}
#csr .csr_box .image_wrap {
    width: 38%;
}
#csr .csr_box .image_wrap img {
    width: 100%;
}
#csr .csr_box .gallery_wrap {
    width: 100%;
}
#csr .csr_box .grid_content.jc_c ul {
    justify-content: center;
    gap:20px;
}
@media  print, screen and (max-width: 767px) {
    #csr section.transMv01.mt_3em.mv01 {
        margin-top: 0!important;
    }
    #csr .csr_box {
        padding:30px;
    }
    #csr .csr_box .image_wrap {
        display:none;
    }
    #csr .csr_box .text_wrap {
        width: 100%;
    }
    #csr .csr_box .text_wrap img {
        width: 100%;
        margin-bottom: 20px;
    }
}

/*==========仕事の魅力==========*/
#appeal .intro_box {
    background-image: url("../appeal/images/intro_bg.jpg");
    background-repeat: no-repeat;
    background-size: 100% auto;
}
#appeal .intro_box:after {
    display: none;
}
#appeal .intro_box p {
    padding-bottom: 90px!important;
}

#appeal .appeal_box .colbox .text_wrap {
    position: relative;
    top: 80px;
}
#appeal .appeal_box .colbox {
    margin-bottom: 140px;
}
@media  print, screen and (max-width: 767px) {
    #appeal .intro_box {
    background-size: auto 110%;
}
    #appeal .appeal_box .colbox {
        margin-bottom: 0;
    }
    #appeal .intro_box p {
    padding-bottom: 30px!important;
        font-size: 18px!important;
}
    #appeal .appeal_box .colbox .text_wrap {
        top:0;
    }
}

/*==========働く仲間==========*/
#staff .interview-list {
   display: flex;
    justify-content: flex-start;
    gap:48px;
 }
#staff .interview-list .index_menu_half_wrap {
    background:#fff;
    width: 48%;
    padding: 30px;  
    box-sizing: border-box;
}

#staff .interview-list a {
   text-decoration: none;
 }
#staff .interview-list .index_menu_half_wrap .inner_photo {
    width: 100%;
 }
#staff .interview-list .index_menu_half_wrap .inner_photo img {
        width: 500px;
    height: auto;
    margin: 0 auto;
    display: block;
    margin-bottom: 20px;
 }
#staff .interview-list .index_menu_half_wrap .inner_text p {
  font-size: 20px;
        font-weight: bold;
 }
#staff .interview-list .index_menu_half_wrap .inner_text p.catch {
    box-shadow: 0 4px 0 rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 0 rgba(0, 0, 0, 0.08);
    margin-bottom: 20px;
    position: relative;
    font-size: 25px;
 }
#staff .interview-list .index_menu_half_wrap .inner_text p.catch:after {
    display: block;
     content: '';
    position: absolute;
    top: auto;
    display: inline-block;
    left: 50%;
    transform: translateX(-50%);
    background-color: #3ebbba;
    background-image: none;
bottom: -4px;
        width: 160px;
        height: 4px;
 }
#staff .interview-list .index_menu_half_wrap .number {
width: 100px;
    height: 100px;
    font-size: 50px;
}
@media  print, screen and (max-width: 767px) {
  #staff .interview-list {
   flex-wrap: wrap;
          gap: 15px;
 }
    #staff .interview-list .index_menu_half_wrap {
    padding: 15px;
        width: 100%;
}
    #staff .interview-list a {
        display:flex;
        gap:10px;
    }
    #staff .interview-list .index_menu_half_wrap .inner_photo,
    #staff .interview-list .index_menu_half_wrap .inner_text {
    width: 50%;
}
    #staff .interview-list .index_menu_half_wrap .inner_photo img {
    width: 100%;
        margin-bottom: 0;
}
    #staff .interview-list .index_menu_half_wrap .inner_text p.catch {
    margin-bottom: 10px;
    line-height: 1;
    box-shadow:none;
}
    #staff .interview-list .index_menu_half_wrap .inner_text p {
    font-size: 14px;
    font-weight: normal;
        padding-bottom: 0;
}
    #staff .interview-list .index_menu_half_wrap .inner_text p.catch:after {
    width: 100%;
    height: 2px;
}
    #staff .interview-list .index_menu_half_wrap .number {
    width: 50px;
    height: 50px;
    font-size: 30px;
        padding-bottom: 0;
}
} 



/*各個人interview*/
#staff .intro_box p {
    text-shadow: none;
}
#staff .interview .intro_area {
    display: flex;
    gap: 60px;
    margin-bottom: 50px;
    justify-content: center;
}
#staff .interview .intro_area .text_wrap h2:before {
    display: none;
}
#staff .interview .intro_area .text_wrap .heading {
        font-family: Antonio, sans-serif;
    color: #fff;
    font-weight: 500;
    background: #3ebbba;
        width: auto;
        min-width: 90px;
        font-size: 20px;
        top: 30px;
        left: 520px;
        line-height: 44px;
        letter-spacing: 0.05em;
        padding: 0 30px;
        filter: drop-shadow(5px 5px 0 rgba(40, 41, 96, 0.2));
        z-index: 10;
        display: flex;
        justify-content: center;
        position: static;
}
#staff .interview.intro_box .text_wrap h2 {
    line-height: 1.5;
    border-bottom: 1px solid #202124;
    margin: 0 0 20px;
    padding: 30px 0 30px 0;
}
#staff .interview.intro_box .text_wrap h2 span {
    display: block;
    font-size: 18px;
    font-weight: normal;
    letter-spacing: 0;
}
#staff .interview.intro_box .text_wrap img {
    display: none;
}
#staff .interview.intro_box .text_wrap p.catch {
   color: #202124;
}
#staff .interview.intro_box .image_wrap {
    position: static;
    transform: none;
}
#staff .interview.intro_box .image_wrap:after {
    display: none;
}
#staff .interview.intro_box .image_wrap:before {
    outline: none;
    outline-offset: 0;
}
#staff .interview h3.staff-ttl{
   display: block;
    text-align: center;
}
#staff .interview h3.staff-ttl:before,
#staff .interview h3.staff-ttl:after{
   display: none;
}
#staff .interview img.floatR,
#staff .interview img.floatL {
   width: 400px;
}
#staff .message_area {
    width: auto;
    text-align: center;
    box-sizing: border-box;
    background: -webkit-linear-gradient(left, #4277be 0, #76dedd 100%);
    background: linear-gradient(left, #4277be 0, #76dedd 100%);
    outline: 5px solid rgba(255, 255, 255, 0.2);
    outline-offset: -5px;
    color: #fff;
    padding: 28px 50px 14px;
    margin: 0 auto 35px;
    font-size: 17px;
}
#staff .message_area h4 {
        font-size: 24px;
        margin: 5px auto 20px;
        padding: 0 10px 25px;
        line-height: 1.0;
        letter-spacing: 0.05em;
        background-image: linear-gradient(to right, #fff 2px, transparent 2px);
        background-size: 8px 2px;
        background-repeat: repeat-x;
        background-position: left bottom;
    text-align: center;
    color: #fff;
    }
#staff .message_area h4:after {
    display: none;
}
#staff .message_area p {
text-align: left;
    color: #fff;
    }
@media  print, screen and (max-width: 767px) {
    #staff .interview .intro_area {
    margin-bottom: 10px;
}
    #staff .interview .intro_area .text_wrap .heading {
    font-size: 15px;
    line-height: 37px;
}
    #staff .interview.intro_box .text_wrap {
    padding: 0;
}
    #staff .interview.intro_box .text_wrap h2 {
    padding: 15px 0;
                margin-bottom: 0;
        border-bottom: none;
}
    #staff .interview.intro_box .text_wrap h2 span {
    font-size: 16px;
}
    #staff .interview.intro_box .text_wrap img {
    margin-top: 20px;
        display: block;
}
    #staff .interview.intro_box .image_wrap {
    display: none;
}
    #staff .interview h3 {
    font-size: 16px;
}
   #staff .interview img.floatR,
    #staff .interview img.floatL {
    width: 100%;
}
    
   #staff .interview p.mb_2em {
    margin-bottom: 0!important;
}
    #staff .message_area {
    padding: 25px 20px;
        margin-top: 10px !important;
}
    #staff .message_area h4 {
    font-size: 18px;
}
    
    
    
    
  } 

/*==========採用情報==========*/
#recruit p.catch {
    font-size: 25px;
    font-weight: bold;
    color: #fff;
    line-height: 2;
}
#recruit .column_list li {
    position: relative;
    padding: 15px;
}
#recruit .column_list li .image_wrap {
  outline: 5px solid rgba(255, 255, 255, .5);
}
#recruit .column_list li .image_wrap img {
 width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
}
#recruit .column_list li .number {
  padding: 0;
}
#recruit .benefits-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0 auto;
    column-gap: 60px;
}
#recruit .benefits-list li {
    width: 200px;
    height: 200px;
    text-align: center;
    border-radius: 50%;
    display: flex;
    align-items: center;      /* 縦中央 */
    justify-content: center;  /* 横中央 */
    background: -moz-linear-gradient(#4277be 0, #76dedd 100%);
    background: -ms-linear-gradient(#4277be 0, #76dedd 100%);
    background: -moz-linear-gradient(#4277be 0, #76dedd 100%);
    background: -webkit-linear-gradient(#4277be 0, #76dedd 100%);
    background: linear-gradient(#4277be 0, #76dedd 100%);
    color: #fff;
    font-weight: bold;
    font-size: 25px;
}
@media  print, screen and (max-width: 767px) {
    #recruit .contents_head_navi li {
        width:48%;
    }
    #recruit .contents_head_navi li a {
    background: #1f4c89 url(../images/arrow_y.svg) no-repeat center right 10px;
    font-size: 14px;
    }
    #recruit p.catch {
        font-size:16px;
    }

  #recruit .benefits-list {
    display: flex!important;
      justify-content: center;
      gap:15px;
  }
  #recruit .benefits-list.pc {
      display: none!important;
  }
  #recruit .benefits-list li {
    width: 95px;
    height: 95px;
    font-size: 12px;
  }
    #recruit .column_list li .image_wrap {
        min-width: 100%;
        max-width: 100%;
       height: auto;
        display: block;
        aspect-ratio: auto;
    }
    #recruit .column_list li .image_wrap img {
       height: auto;
    }

    
  } 


/*==========お問い合わせ==========*/
@media  print, screen and (max-width: 767px) {
#contact p.txtC {
    text-align: left!important;
}
}