@charset "UTF-8";

/* -----------------------------------------------------------
	company
----------------------------------------------------------- */
.page-mv {
    margin-top: 95px;
    position: relative;
    background-image: url(../images/company_mv.jpg);
    background-repeat: no-repeat;
    background-size: contain;
}
.page-mv.anzen {
    background-image: url(../images/anzen_mv.jpg);
}
.company .page-mv{
    padding-top: 36.66%;
}


.company h4{
    position: relative;
    font-size: clamp(1.125rem, -0.318rem + 3.01vw, 2.5rem);
    line-height: 1.4;
    color: #0175C5;
    padding-left: clamp(5rem, -37.5rem + 50vw, 22.5rem);
  padding-bottom: clamp(0.563rem, -0.028rem + 1.23vw, 1.125rem);
  border-bottom: 3px solid #EBEBEB;
    width: 50%;
}

.company h4:before {
  position: absolute;
  bottom: -3px;
  left: 0;
  width: clamp(5rem, -37.5rem + 50vw, 22.5rem);
  min-width: 50px;
  height: 3px;
  content: '';
  background: #0175C5;
}


@media screen and (max-width: 1360px) {
    .company h4 {
        padding-left: clamp(1.172rem, -0.001rem + 5.01vw, 3.75rem);
    }
    .company h4:before {
        width: clamp(1.172rem, -0.001rem + 5.01vw, 3.75rem);
    }
}

.company_textbox {
    width: 90%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.4;
}

.company_textbox th {
    color: #0175C5;
    text-align: left;
    padding: 15px 0;
    width: clamp(8.75rem, -2.401rem + 23.2vw, 15rem);
}

.company_mvvbox {
    width: 90%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.4;
}

.company_mvvbox th {
    font-weight: bold;
    color: #333;
    text-align: left;
    padding: 15px 0;
    width: clamp(2rem, -2rem + 20.2vw, 10rem);
}
.company_mvvbox td {
    text-align: left;
    padding: 15px;
}
.company_mvvbox b {
    color:#0175C5;
}


.history {
  list-style: none;
}
  .history > li {
    overflow: hidden;
    position: relative;
  }
  .history-date {
      color: #0175C5;
    width: 100px;
    float: left;
    margin-top: 0;
  }
  .history-content {
    width: calc(96% - 100px);
    float: left;
    border-left: 1px #0175C5 solid;
    padding-left: 30px;
    margin-left:10px;
    padding-bottom: 40px;
      line-height: 1.4;
  }
  .history-content:before {
    content: '';
    width: 20px;
    height: 20px;
    background: #0175C5;
    position: absolute;
    left: 101px;
    top: 0px;
    border-radius: 100%;
  }
.history li:last-child .history-content{
    border-left: none;
}

.company_textbox h5 {
    color: #0175C5;
    font-size: clamp(1.25rem, 0.682rem + 2.42vw, 2.5rem);/* 20-40px 375-1200px */
    text-align: center;
}
.company_textbox h5 span {
    color: #000000;
    font-size: clamp(0.938rem, 0.511rem + 1.82vw, 1.875rem);/* 15-30px 375-1200px */
    display: block;
    margin-bottom: 10px;
}
.company_line_box {
    border: 1px #0175C5 solid;
    border-radius: 30px;
    padding: 20px;
}
.company_line_box h6{
    font-size: clamp(0.813rem, 0.5rem + 1.33vw, 1.5rem);/* 13-24px 375-1200px */
    font-weight: 700;
    text-align: center;
}
.company_line_box ul li{
    text-indent: -1rem;
    padding-left: 1rem;
    margin-bottom: 10px;
}
.company_line_box ul li span{
    color: #0175C5;
    font-weight: 700;
}


.company_img_box {
    display: flex;
}
.company_img_box a{
    width: 50%;
    max-width: 450px;
    margin-right: 10px;
}
.company .movie_box{
    width: 80%;
    margin: auto;
}
h5.meihou {
  font-size: 1.5rem;
}

@media screen and (max-width: 768px) {
    .company_img_box {
        flex-direction: column-reverse;
}
    .company_img_box a{
    width: 100%;
    margin-right: auto;
        margin-left: auto;
        margin-bottom: 10px;
}
}


.company_access_box {
    display: flex;
    justify-content: space-between;
}
.company_access_box.access_top_line{
    padding-top: clamp(1.563rem, 0.852rem + 3.03vw, 3.125rem);
    border-top: 1px solid #cccccc;
}

.company_access_box h5 {
    font-size: clamp(0.75rem, 0.523rem + 0.97vw, 1.25rem);/* 12-20px 375-1200px */
    width: 15%;
    min-width: 100px;
    text-align: left;
}
.company_access_box div.address{
    width: auto;
}
.company_access_box div.map{
    width: 40%;
    max-width: 400px;
}
.company_access_box div.map .gmap_iframe{
    aspect-ratio: 4 / 3;
    max-width: 400px;
    width: 100%;
    height: auto;
}

.company_textbox.graph h5 {
    font-size: clamp(0.75rem, 0.523rem + 0.97vw, 1.25rem);/* 12-20px 375-1200px */
    text-align: left;
}
.company_textbox.graph h5 span {
    font-size: clamp(0.625rem, 0.398rem + 0.97vw, 1.125rem);/* 10-18px 375-1200px */
    font-weight: 300;
    margin-left: 1rem;
}
.company_textbox.graph .graph_size img{
    width: 80%;
    max-width: 630px;
    margin-left: auto;
    margin-right: auto;
}

@media screen and (max-width: 768px) {
    .company_access_box{
        flex-direction: column;
    }
    .company_access_box h5 {
    width: 100%;
    margin-bottom: 10px;
}
.company_access_box div.address{
    width: 100%;
    margin-bottom: 10px;
}
.company_access_box div.map{
    width: 100%;
}
.company .movie_box{
    width: 100%;
}
h5.meihou {
  font-size: 1.2rem;
}
}

/*安全への取り組み*/
.anzen_textbox {
    width: 90%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    flex-wrap: wrap;
    justify-content: space-around;
    display: flex;
}

.anzen_textbox .txtbox {
    width: 45%;
    max-width: 570px;
}

.anzen_textbox .txtbox img{
    border-radius: 15px;
}

.anzen_block{
    background-color: #80bae2;
    text-align: center;
}
.anzen_block img{
    width: 90%;
    max-width: 1000px;
}

.anzen_textbox .w_line_box{
    width: 45%;
    max-width: 520px;
    border: 1px solid #0175C5;
    border-radius: 10px;
    padding: 30px;
    margin-bottom: 50px;
    margin-left: 20px;
    margin-right: 20px;
    position: relative;
    display: flex;
    flex-flow: column;
}
.anzen_textbox .w_line_box .txtbox{
    width: 95%;
}

.w_line_box h6 {
    display: flex;
    font-size: clamp(0.875rem, 0.667rem + 0.89vw, 1.5rem);/*375-1500 14-24*/
    line-height: 1.4;
    justify-content: flex-start;
    align-items: center;
    color: #0175C5;
    position: absolute;
}
.w_line_box .w_box_img{
    width: 100%;
    text-align: center;
}
.w_line_box .w_box_img img{
    width: 100%;
    max-width: 460px;
    border-radius: 15px;
}

@media only screen and (max-width: 768px) {
    .anzen_textbox{
    flex-flow: column;
}
    .anzen_textbox .txtbox{
    width: 95%;
}
    .anzen_textbox .w_line_box{
    width: 100%;
    margin-bottom: 50px;
    margin-left: auto;
    margin-right: auto;
}
    
}

/*==================================================
アコーディオンのためのcss
===================================*/

/*アコーディオン全体*/
.accordion-area{
    list-style: none;
    width: 85%;
    max-width: 1000px;
    margin-left: 15%;
    padding: 0;
}

.accordion-area li{
    margin: 6px 0;
}

.accordion-area section h5 {
  background-color: #EBEBEB;
}


.accordion-area section h5.close {
  background-color: #B1DFFF;
}
@media screen and (max-width:767px) {
    .accordion-area{
    width: 100%;
    margin-left: 0;
    }
}

/*アコーディオンタイトル*/
.accordion-area .title {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-size:clamp(0.75rem, 0.523rem + 0.97vw, 1.25rem);/* 12-20px 375-1200px */
    padding: 5px 50px 5px 50px;
    transition: all .5s ease;
    text-align: center;
    color: #000000;
    border-radius: 30px;
}

/*アイコンの＋と×*/
.accordion-area .title::before{
    position: absolute;
    content:' + ';
    width: 24px;
    height: 24px;
    font-size:18px;
    
}
.accordion-area .title::before{
    top:3px;
    right: 15px;
    transform: rotate(0deg);
}
@media screen and (max-width:767px) {
    .accordion-area .title::before{
        top:0;
        right: 10px;
    }
}
/*　closeというクラスがついたら形状変化　*/
.accordion-area h5.title.close::before{
  transform: rotate(45deg);
}



/*アコーディオンで現れるエリア*/
.accordion-area .career_box{
    display: none;
    padding-top: clamp(1.563rem, 0.852rem + 3.03vw, 3.125rem);
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: clamp(1.563rem, 0.852rem + 3.03vw, 3.125rem);
}

.accordion-area .title.close .career_box {
    display: block;
}


.accordion-area .career_box .company_access_box h6 {
    font-size: clamp(0.75rem, 0.523rem + 0.97vw, 1.25rem);/* 12-20px 375-1200px */
    width: 20%;
    min-width: 220px;
    text-align: left;
    color: #0175C5;
}
.accordion-area .career_box .company_access_box div.address{
    text-align: left;
    width: 60%;
}
.accordion-area .career_box .company_access_box div.map_btn{
    width: 20%;
    min-width: 100px;
    text-align: right;
}
.accordion-area .career_box .company_access_box div.map_btn a{
    position: relative;
    width: 100%;
    max-width: 220px;
    border-radius: 30px;
    border: 1px solid #0175C5;
    padding: 5px 40px 5px 20px;
}
.accordion-area .career_box .company_access_box div.map_btn a::before{
    position: absolute;
    content:' + ';
    width: 18px;
    height: 18px;
    top:2px;
    right: 15px;
}
@media screen and (max-width:767px) {
    .accordion-area .career_box .company_access_box div.address{
    width: 100%;
}
.accordion-area .career_box .company_access_box div.map_btn{
    width: 100%;
    text-align: left;
}
}


@media screen and (max-width: 768px) {
    a.anker{
        padding-top:30px;
        display: block;
    }
}

@media print{
    .accordion-area .career_box{
        display: block;
    }
    .accordion-area section{
        break-inside: auto;
    }
    
}
.company08 .company_textbox h5 {
    text-align: left;
}
.company08 .company_textbox h6 {
    font-size: clamp(0.938rem, 0.511rem + 1.22vw, 1.875rem);
}
.company08 .company_textbox p.sign {
    text-align:  right;
}
.company08 .company_textbox p.small {
    font-size: clamp(0.938rem, 0.511rem + 00vw, 1.875rem);
}