.page_title_content {
    width: 100%;
    padding: 250px 0 350px;
    position: relative;
    z-index: 100;
}

.title_container{
    width: 77%;
    padding-left: 8.75%;
    border-bottom: 1px solid #E8E8E8;
    color: #E8E8E8;
}
.en{
    font-size: 100px;
    color: #000;
    display: inline-block;
    -webkit-transform: translateY(23px);
    transform: translateY(23px);
    letter-spacing: 0;
    font-family: "neue-haas-grotesk-text", sans-serif;
    font-style: normal;
    font-weight: 400;
}
.en.basic{
    font-size: 50px;
    -webkit-transform: translateY(13px);
    transform: translateY(13px);
}
.page_title_content ._vertical {
    font-size: 60px;
    display: inline-block;
    color: #000;
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    position: absolute;
    top: 150px;
    right: 10.625%;
}
.page_title_content ._vertical.basic{
    white-space: pre;
}
.common_sec{
    margin: 0 0 0 auto;
    width: 80%;
    border-top: 1px solid #000;
    padding:100px 0;
}
.mobileshop .common_sec,.interview-list .common_sec,.about_us .common_sec,.shop_detail .common_sec,.interview_detail .common_sec{
 border: none;
}
.affiliate .common_sec,.media .common_sec{
   margin-top: 150px;
   position: relative;
    overflow: hidden;
   }
.service-list .common_sec{
    margin-top: 0;
    overflow: hidden;
}
.service-list .common_sec:nth-of-type(1){
border-top: none;
}
.affiliate .common_sec img,.affiliate__right-item,.media .common_sec img{
    width:40%;
}
.affiliate__right-item{
    margin-right: 150px;
}
.service-affiliate .affiliate__right-item{
    margin-right: inherit;
}
.affiliate .common_sec img.detail{
    width: 200px;
}
.affiliate__flex-item{
    width: 80%;
}
.service__flex-item{
    position: relative;
}
.common_sec.general{
    margin-top: 110px;
}
.common_sec h3{
    font-size: 20px;
    position: relative;
}
.service_ttl{
    position: relative;
    font-size: 40px;
    
}
.service_ttl::before{
    position: absolute;
    content: "";
    background-color: #004EA2;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    top: 29%;
    left: -5%;
    }
    .media_ttl{
        position: relative;
        margin: 10px 0;
    }
    /* .media_ttl::before{
        position: absolute;
        content: "";
        background-color: #004EA2;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        top: 29%;
        left: 25%;
    } */
.common_sec-inner{
    width: 70%;
}
.common_sec-inner.service_tt{
    width: 100%;
    border-bottom: 1px solid #000;
}
.service_tt_inner{
    width: 70%;
    padding:50px 0;
}
.recruit-page .service_tt_inner{
    width: 90%;
    padding:50px 0;
}
.shop_detail .service_tt{
    font-size: 2rem;
}
.common_sec h3::before{
    position: absolute;
    top: -10px;
    left: 0px;
    height: 5px;
    width: 50px;
    background-color: #004EA2;
    content: "";
}
.common_sec .recruit_flex-item h3::before{
    position: absolute;
    background-color: transparent;

}
.common_sec-inner-content{
    margin-bottom: 30px;
}
.background-text{
    font-size: 250px;
    position: fixed;
    overflow: hidden;
    white-space: nowrap;
    left: 10px;
    top: 50%;
    z-index:-1;
}
.background-text2{
    font-size: 250px;
    position: fixed;
    overflow: hidden;
    white-space: nowrap;
    left: 10px;
    top: 70%;
    z-index:-1;
}
/* .official_account .background-text{
    top: 85%;
} */
.background-text.pos_stic{
    position: sticky;
}
.background-text.p-ab{
    position: absolute;
}

.sitemap a{
    color: #000;
}
.circle{
    width: 50px;
    height: 50px;
    font-size: 20px;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 7px;
    color: #004EA2;
    font-weight: bold;
}
.circle.trans{
    transform: rotate(90deg);
    padding-left: 6px;
    padding-top: 2px;

}
.sitemap p{
    display: flex;
    align-items: center;
    font-size: 25px;
    font-weight: bold;
    margin: 30px 0;
}
.sitemap_text{
    margin-left: 30px;
}
.common_sec-inner-content.sitemap:not(:first-child){
    border-top: 1px solid #000;
}
.common_sec-inner-content.sitemap ul{
    flex-wrap: wrap;
}
.common_sec-inner-content.sitemap ul li{
    align-items: center;
    font-size: 18px;
    margin-right: 10px;
    margin-bottom: 10px;
}
.common_sec-inner-content.sitemap ul li .circle{
margin-right: 30px;
}
.common_sec-inner.official_account{
    width: 90%;
}
.official_account .flex-item{
    opacity: 0;
}
.common_sec-inner.official_account .flex-item{
    width: 30%;
}
.common_sec-inner.official_account .flex-item a{
    display: block;
    margin-top: 50px;
    text-decoration:underline;
}
.sub-title{
    background-color: #fff;
    opacity: 0.8;
    padding: 100px 300px;
    top:22%;
    left: 0%;
    font-size: 1.5rem;
}

.media-item{
    width: 40%;
    position: relative;
    margin-top: 55px;
}
.media .common_sec .media-item img{
    width: 100%;
}
.media-item::before{
    position: absolute;
    left: -20%;
    bottom: -25%;
    content: url(../images/media/before.png);
}
.interview-list .media-item::before{
    content: "";
}
.interview-list .recruit{
overflow: hidden;
background-color: transparent;
}
.interview-list-item{
    position: relative;
}

.interview-list-item-btn {
    position: absolute;
    right: 0;
    bottom:-43px;
}
.for_customer h4{
    position: relative;
    font-size: 32px;
}
.for_customer h4::before{
    position: absolute;
    content: url(../images/check_before.png);
    left: -4%;
    top: 4px;
    transform: scale(0.5);
}
.common_sec-inner.sub_inner{
    width: 90%;
    margin: 0 0 0 auto;
}
.sub_inner h4{
    margin-top: 50px;
    width: 100%;
    font-size: 28px;
    border-bottom: 1px solid #000;
}
.sub_inner ul{
    margin: 30px 0;
}
.about_us .left,.about_us .right{
    width: 48%;
}
.about_us .-flex{
    margin: 50px 0;
}

.shop_detail dl{
    margin: 20px 0;
}

.shop_detail dt,.shop_detail .left,.shop_detail .right{
    width: 50%;
}
.shop_detail dd{
    width:100%;
}
.google_map{
    width: 100%;
    height: 100%;
}
.shop_list-area{
    padding: 30px 0;
}
.shop_list-area ul{
    margin: 30px 0
}
.shop_list-area-item li{
    width: 33%;   
}
.shop_list-area-item button{
    background-color: #004EA2;
    color:#fff;
    border-radius: 50px;
    padding: 5px 50px;
    text-align: center;
    border: none;
}
.news-ariticle{
    display: flex;
    justify-content: space-between;
    max-width: 1300px;
    width: 100%;
    margin: 100px auto;
}
.news-ariticle .left{
    width: 60%;
    background-color: #fff;
    padding: 30px;
}
.news-ariticle.list .left{
    width: 60%;
    background-color: transparent;
    padding: 30px;
}

.news-ariticle .right{
    width: 30%;
}
.news-ariticle-date,.news-ariticle-category{
    font-size: 0.7rem;
    display: flex;
    align-items: center;
}
.news-ariticle-category{
    background-color: #004EA2;
    color: #fff;
    text-align: center;
    padding: 3px 10px;
    border-radius: 50px;
    margin-left: 10px;
}
.news-ariticle-sub{
    margin-bottom: 10px;
}
.thumbnail{
    margin-bottom: 50px;
}
aside p{
    border-top: 1px solid #000;
    margin: 30px 0;
    padding-top: 30px;
    font-size: 1.3rem;
}
aside ul{
    border-top: 1px solid #000;
    padding: 30px 0 ;
}
aside ul li{
    background-color: #fff;
    border: none;
    font-size: 1rem;
    text-align: center;
    padding: 3px 10px;
    border-radius: 50px;
    margin: 10px;
}
aside ul li.checked{
    background-color: #004EA2;
    color: #fff;
}

.news-ariticle-list-item{
    width: 45%;
}
.news-ariticle-list-item ul{
    margin-top: 20px;
}
.news-ariticle-list-item li{
    margin-left: 5px;
}
.news-ariticle-list-item a img{
    width: 300px;
    height: 214px;
    object-fit: cover;
}
.news-list__ariticle-title{
    margin-bottom: 20px;
}
.history_list{
    margin: 0 auto;
    display: block;
    max-width: 1200px;
    width: 100%;
}
/*タイムライン全体の設定*/
.timeline{
    width:100%;
    margin:50px auto;
    padding:50px;
    background-color: #fff;
  }
  
  .timeline li{
    line-height: 6;
      position: relative;
    list-style: none;
    margin-bottom: 10px;
    /* width: 80%; */
  }
  
  .timeline dl{
    align-items: center;
  }
  
  .timeline dd strong{
    display: block;
    padding:10px 0;
  }
  .timeline dd{
    border-bottom: 1px solid #333;
    width: 70%;
    display: flex;
    align-items: center;
  }
  
  /*絶対配置で線を設定*/
  .border-line {
      /*線の位置*/
    position: absolute;
    left:6.2em;
    top:0;
    width:2px;/*線の太さ*/
    height:0;/*はじめは高さを0に*/
    background: #ccc;
  }
  
  /*タイムラインの見出し横の丸の位置と形状*/
  .timeline li dl dt{
    background: #004EA2;
    color: #fff;
    height: 70px;
    padding: 10px 14px;
    text-align: center;
    width: 70px;
    display: flex;
    border-radius: 50%;
    font-size: 12px;
    align-items: center;
  }
  .timeline li dl dd ul li{
    line-height: 1;
    margin: 20px 0;
  }
  .timeline .list_n{
    line-height: 1.5;
    margin: 20px 0 0 0;
    padding: 20px 0 0 0;
  }
  .timeline .list_n dt{
    margin-bottom: 25px;
  }
  .timeline .list_n dd{
    padding-bottom:33px;
  }
.under-company-list{
     max-width: 1200px;
    display: block;
    margin: 50px auto;
    width: 100%;
    padding:100px 50px;
    background-position: center top;
}
.under-company-list
.under-company-wrapper {
    padding: 4% 0 4% 4%;
    border-bottom: 1px solid #000;
    display: flex;
    justify-content: left;
}
.under-company-wrapper:nth-child(2){
    border-top: 1px solid #000;
}
.under-company-wrapper dt {
    font-family: 'NotoSansJP-Bold', "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "游ゴシック体", "Yu Gothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-weight: 800;
    font-style: normal;
    width: 20%;
}
.under-company-wrapper dd {
    width: 75%;
}
.under-company-list h2{
    position: relative;
    font-size: 2rem;
}
.oh{
    overflow: hidden;
}
.under-company-list h2 span{
    position: absolute;
    top: -30px;
    left: 0;
    font-size: 1.1rem;
}
.company_head{
    margin: 50px auto;
    position: relative;
}
.company_head h2{
    text-align: center;
    font-size: 8rem;
    margin-bottom: -50px;
    z-index: 5;
    position: inherit;
    color: #004EA2;
    text-shadow: 3px 3px #fff;
}
.img-box{
    width: 100%;
    position: relative;
    height: 43vw;
}
.img-box img {
    width: 100%;
}
/* .img-box img:nth-child(2){
    margin-top: 50px;

margin-bottom: -30px;} */
.company_head img{
    display: block;
    margin: 0 auto;
}
.service_name h2{
    font-size: 5rem;
    color: #004EA2;
    font-weight: bold;
    position: relative;
}
.service_name span{
    position: absolute;
    color: #004EA2;
    font-size: 1rem;
    bottom:-50px;
    left: 0;
}
.service_list-images{
    position: absolute;
    right: 0;
    top:6vw;
}
.common_sec .service__flex-item .service_list-images{
    width: 70%;
}
.service__flex-item .service_tt{
    margin: 100px 0;
}

.service_ttl{
    position: relative;
    font-size: 40px;
    margin-left: 40px;
}
.service_ttl::before{
    position: absolute;
    content: "";
    background-color: #004EA2;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    top: 29%;
    left: -2%;
    }
.service__flex-item .service_ttl{
        position: relative;
        font-size:18px; 
        margin-left: 50px;
}
.service__flex-item .service_ttl::before{
        position: absolute;
        content: "";
        background-color: #004EA2;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        top: 29%;
        left: -5%;
}
.recruit_flex-item{
    width: 30%;
    margin-bottom: 20px;
    text-align: center;
    border-bottom: 1px solid #004EA2;
    padding-bottom: 20px;
}
.recruit_flex-item h3{
    font-size: 3rem;
    font-weight: bold;
    color: #004EA2;
}
.recruit_flex-item img{
width: 50%;
margin: 10px auto;
}
.recruit_flex-item p:nth-child(2){
    height: 50px;
}
.recruit-page .under-company-list{
    background-color: #FAFAFA;
    border-radius: 10px;
    border: none;
}
.entry_btn{
    background-color: #004EA2;
    color: #fff;
    text-align: center;
    font-size: 24px;
    padding: 20px 50px;
    border: none;
    display: block;
    margin: 20px auto;
    outline: none;
}
.rec_plus{
    border-bottom: 1px solid #000;
    margin-top: 20px;
}

.inner.rec .-flex{
    padding: 50px;

}
.inner.rec img{
    width: 35%;
}
.recruit-page .service_ttl{
    margin-left:30px;
} 
.interview-title{
    right: 5%;
    padding: 50px 100px;
    bottom: -19%;
    font-size: 1rem;
    color: #fff;
}
.interview-messeage{
    padding: 150px 0;
    margin: 0 auto;
    max-width: 1200px;
    width: 100%;
}
.interview-messeage h3{
    position: relative;
    font-size: 2rem;
}
.interview_span{
    position: absolute;
    top: -30px;
    left: 0;
    font-size: 1rem;
}
.interview_sec .text-box{
    width: 40%;
    margin: 5%;
}
.interview_sec .item{
    margin: 50px 0;
}
.interview_sec h4{
    font-size: 24px;
}

.interview_detail_pic3{
    height: 400px;
    width: 100%;
    object-fit: cover;
    margin: 30px 0;
}
.interview_detail .inner{
    padding: 150px 0;
}
.big_font{
    font-size: 5rem;
}
.big_font span{
    font-size: 2rem;
    /* margin-left: 20px; */
}
.big_font span.smoothText{
 font-size:5rem;
}

.big_font span .smoothTextTrigger{
    font-size: 5rem;
}
.other_interview .item{
    width: 30%;
}
.company-messeage{
    top: 11%;
    left: 0;
    width: 90%;
    padding: 10vw 20vw;
}
.company-messeage-2{
    top: 0%;
    right: 3%;
    width: 31%;
    padding: 4% 6%;
    z-index: 6;
}
.ceo-img{
    width: 40%;
    top: 17%;
    right: 0;
    z-index: 9999;
}
.company-info-sec1,.company-info-sec2{
    padding: 300px 0 150px 0;
}
.company-info-sec2{
   padding: 150px 0; 
   overflow: hidden;
}
.company-messeage-text{
    border-left: 1px solid #fff;
    padding-left: 20px;
}
.company-info-sec1-image2{
    margin-top:500px;
}
.company-info-sec2 .-flex{
    align-items:center;
}
.company-prof-image img:nth-child(1){
    width: 300px;
}
.company-prof-image img:nth-child(2){
    width: 600px;
    margin-top:90px;
}
.ceo_message section{
    margin: 150px 0;
}
.ceo_big{
    z-index: 3;
    top: -10%;
}
.ceo_big::after{
  position: absolute;
  content: url(../images/message/identity.png);
  z-index: -1;
  top: -165px;
  left: -431px;
  transform: scale(0.4);
}
.ceo_big_2::after{
    position: absolute;
    content: url(../images/message/white_logo.png);
    z-index: -1;
    top: -186px;
    left: -270px;
    transform: scale(0.4);
  }
  .ceo_big4::after{
    position: absolute;
    content: url(../images/message/slogan.png);
    z-index: -1;
    top: -165px;
    left: -387px;
    transform: scale(0.4);
  }
.ceo_big_2{
    z-index: 3;
    top: -19%;
}
.ceo_big3 {
    z-index: 3;
    top: -6.3%;
    left: 11%;
}
.ceo_big4{
    z-index: 3;
    top: -8%;
    /* left: 10%; */
}
.message-line{
    position: absolute;
    z-index: -1;
    top: -50px;
    right: 20%;
}
.identity_text{
    margin: 50px 0;
    width: 60%;
}
.identity_text h3{
    font-size: 3rem;
}
.identity_text p{
    font-size: 1rem;
    line-height: 2;
}
.identity_text_2{
    margin: 50px 0;
    width: 68%;
}
.identity_text_2 h4{
    font-size: 1.2rem;
    margin-top: 20px;
}
.identity_text_2 p{
    font-size: 1rem;
    line-height: 2;
}
.align-center{
    align-items: center;
}
.ceo_logo{
    width: 20%;
}

.office h2{
    font-size: 1.5rem;
    position: relative;
}
.office h2 span{
    position: absolute;
    top: -77%;
    font-size: 1rem;
}
.office .left{
    width: 40%;
}
.office .right{
    width: 60%;
}
.office .right iframe{
    height: 500px;
}
.swiper.company{
    width: 44%;
}
.swiper2{
    margin-top: 120px;
    overflow: hidden;
}
.office h3:nth-child(2){
    margin-top: 40px;
}
.tab-item,.tab-itemAll{
    background-color: #fff;
    color: #004EA2;
    text-align: center;
    box-shadow:0px 5px 0px #004EA2;
    font-weight: bold;
    border-radius: 50px;
    padding: 10px 30px;
    width: 18%;
    transition: all 0.3s;
}

/* .tab-item.active{
    background-color: #004EA2;
    color: #fff;
    box-shadow:none;
} */

.z-in02{
    z-index: -2;
}
.tab-content {
    display: none;
}
.tab-content.active {
    display: block;
  } 

  .recruit h2{
    font-size: 5rem;
  }
  .c-messe{
   margin-top: 50px;
   margin-bottom: 50px; 
   line-height: 2;
  }
  .c-messe .fb{
    margin-top: 40px;
  }

  .detail_btn{
    align-items: center;
    margin-top: 20px;
    margin-bottom: 20px;
    justify-content: right;
    transition: all 0.3s;
  }
  .detail_btn img{
    width:100px;
    margin-left: 20px;
    transition: all 0.3s;
  }

  .detail_btn:hover img{
    transform: translateX(20px);
  }
  .detail_btn p{
    transition: all 1s;
  }
  .detail_btn:hover p{
    text-decoration: underline;
  }
  .about_us-h4{
    font-size: 24px;
    margin-bottom:10px;
  }
  .about_us .left img, .about_us .right img{
    margin-bottom: 20px;
  }
  .news-ariticle p{
    line-height: 3;
  }
  .news-ariticle.list p{
    line-height: 1;
  }
  .service-mobile .service_tt_inner p{
    margin: 10px 0;    
  }
  .common_sec.service-mobile{
    position: relative;
    overflow: hidden;
  }
  .service-affiliate p{
    margin: 10px 0;    
  }
  .service-affiliate p.mt50{
    margin-top: 50px;
  }
  .recruit .background-text{
    top: -18%;
  }
  .company-messeage-text .detail_btn{
    justify-content: left;
  }
  .big_font3::after{
    position: absolute;
    content: url(../images/company-info/white_interview.png);
    z-index: -1;
    top: -138px;
    left: -548px;
    transform: scale(0.5);
  }

  .cross_line{
    position: absolute;
    right: 3%;
    bottom: -79%;
    height: 1000px;
  }
  .tate_line{
    position: absolute;
    left: 50%;
    bottom: 56%;
    height: 1000px;
    z-index: -1;
  }
  .company-big{
    top: 3%;
    left: 5%;
    z-index: -1;
  }
  .company-info-sec3{
    overflow: hidden;
    padding-top: 70px;
  }
  .button_02 p{
    top: 20%;
    right: 3%;
    display: flex;
  }
  .button_02 p span{
    font-size: 12px;
    margin-right: 10px;
  }
  .button_02 p img{
    width: 50px;
  }
  .company-messeage-text h2{
    font-size: 3rem;
  }
  .company-list_tate{
    left: 50%;
    height: 98%;
  }
  .company-list_tate2{
     left: 5%;
     height: 98%;
  }
  .company-list_tate3{
    right: 5%;
    height: 98%;
  }
  .company-list_wide{
    top:3%;
    width: 96%;
    margin: 0 28px;
  }
  .news-item .mask{
    display: inline-block;
  }

.image-container {
	position: relative;
    left: 0;
    height: 100%;
    width:30%;
    max-width: 30%;
}
.image-container:nth-child(2){
    position:absolute;
    left: 21%;
    max-width: 30%;
}
.image-container:nth-child(3){
    left: 70%;
    position:absolute;
    max-width: 30%;
}
.image {
    position: absolute;
    left: 0%;
	opacity: 0;
	animation: change-img-anim 15s infinite;
}
.image2 {
    position: absolute;
    left: 50%;
    top: 3%;
	opacity: 0;
	animation: change-img-anim2 15s infinite;
}
.image3 {
    position: absolute;
   right:0%;
	opacity: 0;
	animation: change-img-anim3 15s infinite;
}

.image:nth-of-type(1) {
	animation-delay: 0s;
}
.image:nth-of-type(2) {
	animation-delay: 2s;
}
.image:nth-of-type(3) {
	animation-delay: 4s;
}
.image:nth-of-type(4) {
	animation-delay: 6s;
}
.image:nth-of-type(5) {
	animation-delay:8s;
}
.image:nth-of-type(6) {
	animation-delay:10s;
}

.image2:nth-of-type(1) {
	animation-delay: 0s;
}
.image2:nth-of-type(2) {
	animation-delay: 3s;
}
.image2:nth-of-type(3) {
	animation-delay: 5s;
}
.image2:nth-of-type(4) {
	animation-delay: 7s;
}
.image2:nth-of-type(5) {
	animation-delay:9s;
}
.image2:nth-of-type(6) {
	animation-delay:11s;
}

.image3:nth-of-type(1) {
	animation-delay: 0s;
}
.image3:nth-of-type(2) {
	animation-delay: 4s;
}
.image3:nth-of-type(3) {
	animation-delay: 6s;
}
.image3:nth-of-type(4) {
	animation-delay:8s;
}
.image3:nth-of-type(5) {
	animation-delay: 10s;
}
.image3:nth-of-type(6) {
	animation-delay: 12s;
}


@keyframes change-img-anim {
	0%{ opacity: 0;}
	10%{ opacity: 1;}
	90%{ opacity: 1;}
	100%{ opacity: 0;}
}
@keyframes change-img-anim2 {
	0%{ opacity: 0;}
	10%{ opacity: 1;}
	90%{ opacity: 1;}
	100%{ opacity: 0;}
}
@keyframes change-img-anim3 {
	0%{ opacity: 0;}
	10%{ opacity: 1;}
	90%{ opacity: 1;}
	100%{ opacity: 0;}
}

.shop_img-three img{
    margin-left: 8px;
}



.fade-img-box {
    width: 65%;
    height: 27vw;
    margin-left: auto;
    position:relative;
   }
   
   .fade-img-box img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit:cover;
   }