@charset "UTF-8";
 
.interview_main_bk{
padding: 0 0 80px;
} 

.oneday_main_bk{
  padding:0 0;
   }

.interview_main{
    max-width: 760px;
    margin:0 auto 0;
}

.title_interview{
    font-size: 2.5em;
    display: inline-block;
    width: auto;
    font-weight:bold;
    line-height: 1em;
    margin-bottom: 10px;
}

.title_interview span{
  font-size: 0.5em;
  font-weight: normal;
}

.title_interview_box{
  
}

.interview_bk{
text-align: right;
margin-top: 30px;
color: #00608b;
display: inline-block;
width: auto;
}

.bt_interview{
  width: 65%;
}

.bt_interview a{
  text-align: center;
  width: 48%;
  border-bottom: solid 1px #d3d3d3;
  display: inline-block;
  margin-left: 1%;
  margin-top: 3rem;
  color: #333;
}

.bt_interview .active{
  border-bottom: solid 3px #006699;
  color: #00608b;
}

.bt_interview a::after{
    padding: 0 0 0 0.2rem;
    display: inline-block;
    width: 1rem;
    content:url('../../../common/img/icon/arrowblackR.svg');

}

.bt_interview .noactive:hover{
  text-align: center;
  width: 48%;
  border-bottom: solid 3px #00608b;
  display: inline-block;
  margin-left: 1%;
  margin-top: 3rem;
  color: #00608b;
}

.bt_interview .active::after{
  padding: 0 0 0 0.2rem;
  display: inline-block;
  width: 1rem;
  content:url('../../../common/img/icon/arrowblueR.svg');
}

.interview_bt {
    display: block;
    padding: 30px;
}

.interview_bt span{
    display: inline-block;
    color: #fff;
}

.interview_bt_box{

    text-align: center;
    display: block;
    background: #00608b;
}

.interview_bt span::after{
    padding: 0 0 0.2rem;
    display: inline-block;
    width: 1rem;
    content:url('../../../common/img/icon/arrowwhiteR.svg');
    vertical-align: sub;
}

/* ページメイン */

.interview_title{
  font-size: 1.6rem;
  line-height: 1.3em;
  margin: 30px auto 30px;
  font-weight: 600;
}

.head-border {
  display: flex;
  font-size: 1.3rem;
  align-items: center;
  line-height: 1em;
  margin-top: 50px;
}

.head-border:before{
  width: 30px;
  content:url('../img/icon_Q.png');
  vertical-align: sub;
}


.head-border:after {
  content: "";
  height: 1px;
  flex-grow: 1;
  background-color: #666;
}

.head-border:before {
  margin-right: 1rem;
}

.head-border:after {
  margin-left: 1rem;
}

.title_answer{
  font-size: 1.6rem;
  color: #00608b;
  margin-top: 15px;
  margin-bottom: 20px;
  font-weight: bold;
  line-height: 1.3em;
}

.answer_txt{
  line-height: 2rem;
  font-size: 1rem;
}

.pic_box{
  margin-top: 30px;
}

.pic_box_foot{
  min-height: 400px;
  height: 35vw;
  left: 0;
  top: 0;
  width: 100%;
  overflow: hidden;
}


/* トップイメージ タイトル */

.page_head{
    padding:0;
    position: relative;
    background: var(--col-sky03);
}

.head_img{
    position: relative;
    left: 0;
    top: 0px;
    width: 100%;
    max-width: 1314px;
 margin: auto;
    background: var(--col-sky03);
    padding: 0;
  }
  .head_img picture{
    left: 0;
    position: absolute;
    top: -80px;
    padding: 0 0 0 150px
}

.bread_box{
    display: inline-block;

}


  

  .page_title{
    position: absolute;
    top:250px;
    left: -70px;
    z-index: 99;
 text-align: center;
  }

 
  .page_title_en{
font-size: 5.5em;
    list-style: none;
    transform: rotate( 90deg );
    /* キーワードで指定する場合*/
transform-origin:center top;
font-family: var(--font-family-marcellus);
  }

  .page_title_jp{
    position: absolute;
    bottom: -120px;
    display: inline-block;
    left: 50%;
    margin-left: -25%;
  }


   /* とある1日タイトル */

   .page_title.oneday .page_title_jp{
    position: absolute;
    bottom: -100px;
    display: inline-block;
    left: 50%;
    margin-left: -26%;
  }

   .page_title.oneday{
    position: absolute;
    top:205px;
    left: -33px;
    z-index: 99;
 text-align: center;
  }

  .page_title.oneday .page_title_en{
    font-size: 5.5em;
  }

  .time {
    position: relative;
    width: 14%;
    padding-right: 1%;
    text-align: right;
  }

  .time p{
    font-size: 3rem;
    font-weight: bold;
  }

  .time p span{
    font-size: 1.5rem;
  }

  .time .point{
    position: absolute;
    font-size: 1rem;
    top:17px;
    left: 70px;
    color: #0279a3;
  }


  .time_event{ 
    width: 83%;
    position: relative;
    border-left: solid 2px #0279a3;
    margin-top: 0;
    padding-bottom: 40px;
    padding-top: 40px;
  }

  .time_eventtop{
    margin-top: 45px;
    padding-top: 0;
  }

  .time_eventtop .circle{
    top:0px;
  }

  .circle{
    width: 15px;
    height: 15px;
    line-height: 200px;
    background-color: #0279a3;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    position: absolute;
    left: -8px;
    top:45px;
  }

  .imgBox{padding-left: 30px;}

  #entry .imgBox{padding-left: 0;}

  .time_title{
    padding-left: 30px;
    margin-bottom: 15px;
    line-height: 1.3em;
    color: #0279a3;
    font-size: 1.5rem;
    font-weight: bold;
  }

  .time_event .event_txt{
    padding-left: 30px;
  }

  .event_pic .imgBox{
    padding: 0;
  }

  /* キャリアストーリー */

  .page_title.career .page_title_jp{
    position: absolute;
    bottom: -195px;
    display: inline-block;
    left: 57%;
    margin-left: -26%;
  }

   .page_title.career{
    position: absolute;
    top: 275px;
    left: -100px;
    z-index: 99;
 text-align: center;
  }

  .page_title.career .page_title_en{
    font-size: 4.6em;
  }
  
  .time .point.career{
    position: absolute;
    font-size: 0.8rem;
    top:17px;
    left: 48px;
    color: #0279a3;
    letter-spacing: 0;
  }

  .career_title{
    font-size: 16px;
    font-weight: bold;
    padding:0 0 10px 30px;
    line-height: 1em;
    margin: 0;
  }


  .next_img  {

    height:auto;
    left: 0;
    top: 0;
    width: 50%;
    overflow: hidden;
}

.next_txt{
  padding:50px 0;
width: 25%;
}

.next_txt .time_title{padding: 0;}


.next_img img {

  height: 30rem;
  box-sizing: content-box;
  vertical-align: middle;
  line-height: 1;
}

.next_title{
  font-family: var(--font-family-marcellus);
  font-size: 3rem;
  color: #3e3a39;
}

/*スクロールバーが表示される閲覧環境用に設定*/


.next_main{
  background: #d2e3ef;
  padding: 0;
}

.next{
  display: flex;
  justify-content: space-between;
  max-width: 1080px;
  padding:0 40px;
  margin: auto;
}

.next img{
  width: 100%;
  height: auto;
}

.reverse{
  flex-direction: row-reverse;
}

.column{
  width: 48%;
}

/*右側へ要素を広げる（2カラム）*/
.column-outside-right{
    flex: 1;
    margin-right: calc(50% - 50vw);
    margin-left: 4%;
}

/*左側へ要素を広げる（2カラム）*/
.column-outside-left{
    flex: 1;
    margin-left: calc(50% - 50vw);
    margin-right: 4%;
}

/*右側へ要素を広げる（1カラム）*/
.outside-right{
  margin-right: calc(50% - 50vw);
}

/*左側へ要素を広げる（1カラム）*/
.outside-left{
  margin-left: calc(50% - 50vw);
}
  
@media only screen and (min-width: 768px) and (max-width: 1163px) {

    .head_img{
        height: 35rem;
      }

      .head_img picture{
        left: 150px;
        position: absolute;
        top: 0px;
    }

    .interview_main{
        margin:0 auto 0;
        max-width: 610px;
    }
    .breadcrumb a{
        color: #333;
        font-size: 1em;
      }

      .page_title{
        position: absolute;
        top:325px;
        left: -35px;
        z-index: 99;
     text-align: center;
      }

      .page_title.career .page_title_en {
        font-size: 4.3em;
        list-style: none;
        transform: rotate( 90deg );
        transform-origin: center top;
        font-family: var(--font-family-marcellus);
    }

    
    .page_title{
      position: absolute;
      top: 225px;
      left: -60px;
      z-index: 99;
   text-align: center;
    }

     /* とある1日タイトル */

     .page_title.oneday .page_title_jp{
      position: absolute;
      bottom: -70px;
      display: inline-block;
      left: 50%;
      margin-left: -28%;
    }

  .page_title.oneday{
    position: absolute;
    top:200px;
    left: -10px;
    z-index: 99;
 text-align: center;
  }

  .page_title.oneday .page_title_en{
    font-size: 5.5em;
  }



    .time .point{
  top: 1rem;
  left: 5.5rem;
  }


  .time_event{
    margin-top: 0;
    padding-top: 35px;
  }
  .time_eventtop{
    margin-top: 2.5rem;
    padding-top: 0;
  }

  .circle{
    top:38px;
  }
  .time {
    position: relative;
    width: 18%;
    padding-right: 2%;
    text-align: right;
}
    
.time_event {
  width: 80%;
}

/* キャリア */
.page_title.career{
  position: absolute;
  top:16rem;
  left:-5.3rem;
  z-index: 99;
text-align: center;
}

.page_title.career .page_title_jp{
  position: absolute;
  bottom: -12rem;
  display: inline-block;
  left: 59%;
  margin-left: -28%;
}

.time .point.career {
  position: absolute;
  font-size: 0.8rem;
  top: 17px;
  left: 55px;
  color: #0279a3;
  letter-spacing: 0;
}

.next img{
  min-width: 500px;
  height: auto;
}

.head_img picture {
  left: 0;
  position: absolute;
  top: 0px;
  padding: 0 0 0 150px;
}
}

@media only screen and (min-width: 768px) and (max-width: 959px) {}

/*==========================================================================================
ここからSP
==========================================================================================*/

@media only screen and (max-width: 767px) {



.interview_title{
  font-size: 1.55rem;
  line-height: 1.3em;
  margin: 40px auto;

}

    .title_interview{
        font-size: 2.5em;
        width: 100%;
        text-align: center;
    }

.bt_interview{
  width: 100%;
}

    .interview_bk{
        margin-top: 20px;
    }

    .interview_main_bk{
   padding-top: 0px;
    }


    dt, dd{
    
        display: block;
        width: 100%;
    }

    dt{
    padding:20px 20px 0;
    }

    dd{
        padding:10px 20px 20px;
        }

        .welfare_box ul li {
            width: 49%;
            margin: 0 2% 2% 0;
        }
        .welfare_box ul li:nth-child(even){
            margin-right: 0;
        }
        .welfare_box ul li:nth-child(5n){
            margin-right: 2%;
        }
        .welfare_box ul li:nth-child(10n){
            margin-right: 0%;
        }

        .bread_box{
            left:35px;
            top:6rem;
        }

        .page_title{
            top:10rem;
            left: -50px;
            z-index: 99;
         text-align: center;
          }
        .page_title_en{
            font-size:3.2rem;

              }

            
              .head_img {
                height: 370px;
                width: 83%;
                margin-left: 17%;
              }
              .head_img picture {
                left: -130%;
                position: absolute;
                top: -20px;
                width: 65rem;
              }

              .head_img .manager {
                left: -107%;
                position: absolute;
                top: -20px;
                width: 65rem;
              }

              .page_title_jp{
                position: absolute;
                bottom: -5.5rem;
                display: inline-block;
                left: 50%;
                margin-left: -28%;
                font-size: 0.75rem;
              }
            
              .pic_box_foot{
                min-height: 200px;
                height: 50vw;
              }

                /* とある1日タイトル */

     .page_title.oneday .page_title_jp{
      position: absolute;
      bottom: -55px;
      display: inline-block;
      left: 50%;
      margin-left: -28%;
    }

  .page_title.oneday{
    position: absolute;
    top:10rem;
    left: -45px;
    z-index: 99;
 text-align: center;
  }

  .page_title.oneday .page_title_en{
    font-size: 4em;
  }

  .time {
    position: relative;
    width:22%;
    text-align: right;
    padding-right: 2%;
  }
  .time_event{ 
    width: 76%;
    position: relative;
    border-left: solid 2px #0279a3;
    margin-top: 0;
    padding-bottom: 40px;
    padding-top: 40px;
  }
  .time_eventtop{
    margin-top: 45px!important;
    padding-top: 0;
  }

  .time p {
    font-size: 1.8rem;
    font-weight: bold;
    padding-top: 30px;
}

.time p span{
  font-size: 1.2rem;
}

.time .point{
  top:0px;
  left:3.5rem;
  font-size: 1rem;
}

.event_pic .imgBox{
  padding: 20px 0 0 30px;
}

/* キャリア */

.page_title.career .page_title_en {
  font-size: 2.7rem;
}

.page_title.career{
  position: absolute;
  top:11rem;
  left:-5.5rem;
  z-index: 99;
text-align: center;
}

.page_title.career .page_title_jp{
  position: absolute;
  bottom: -9rem;
  display: inline-block;
  left: 59%;
  margin-left: -29%;
}


.time .point.career {
  position: absolute;
  font-size: 0.6rem;
  top: 5px;
  left: 37px;
  color: #0279a3;
  letter-spacing: 0;
}
.column-outside-right,
.next_txt{width: 100%;}

.column-outside-right {
  flex:none;
  margin-right:0;
  margin-left: 0;
}

.next {display: block;
padding: 0;}

.oneday_main_bk{
  padding:0px 0 0;
   }
    
}