@charset "UTF-8";

a{ transition: all .3s ease-in-out;}

/*MV*/
.globalMv_info{ background-image: url(/info/img/mv@2x.jpg);}
.globalMv_works{ background-image: url(/works/img/mv@2x.jpg);}

/*間隔調整*/
.mainEria > .wrap{ margin-bottom:6%;}


/*TAB*/
.tab{ margin:0 auto 3.5%;}
.tab ul{ display:flex; justify-content:space-between; border:1px solid #000; border-width:1px 0 0 1px;}
.tab ul > li{ /*width:32.7%;*/ width:33.333%; border:1px solid #000; border-width:0 1px 1px 0; text-align:center; transition: all .3s ease-in-out; box-sizing:border-box;}
.tab ul > li a{ display:block; padding:7.5% 0; color:#000;}
.tab ul > li:hover{ background:#333;}
.tab ul > li.current{ background:#000;}
.tab ul > li:hover a,
.tab ul > li.current a{ color:#fff;}
@media only screen and (min-width: 768px) {
  .tab ul > li{ font-size:125%;}
}

/*PAGER*/
.pager{ width:100%; overflow:hidden; margin:4% auto; line-height:1; text-align:center;}
.pager li{ display:inline-block; margin:0 3px; overflow:hidden; border:1px solid #000;}
.pager li a{ width:33px; height:33px; background:none; color:#000; text-decoration:none; display:flex; align-items:center; justify-content:center;}
.pager li.current a,
.pager li a:hover{ background:#000; color:#fff;}



/*お知らせ 一覧*/
.infoList > li{ border-bottom:solid 1px #b6b6b6; cursor:pointer; background:none;}
.infoList > li:not(:first-child){ border-top:none!important;}
.infoList > li:first-child{ border-top: solid 1px #b6b6b6;}
.infoList > li > a{ padding:21px 15px; display:flex; align-items:flex-start; color:#000; transition: all 0.5s ease-in-out;}
.infoList > li .ctgry{ display:inline-block; width:120px; padding:2px 0 0; margin-right:20px; background-color:#dc000c; color:#fff; text-align:center;}
.infoList > li .ctgry.update{ background-color:#ffa60a;}
.infoList > li .ctgry.recruit{ background-color:#444;}
.infoList > li .time{ width:90px;}
.infoList > li .text{ width:calc(100% - 230px);}
.infoList > li > a:hover{ color: #c91629; transition: all 0.5s ease-in-out;}
@media only screen and (max-width: 768px) {
  .infoList > li > a{ display:block; font-size:14px;}
  .infoList > li .ctgry{ margin:0 8px 10px 0;}
  .infoList > li .time{}
  .infoList > li .text{ display:block; width:auto;}
}

/*詳細ページ*/
.infoEitorBox .ctgry{ display: inline-block; width: 120px; padding:2px 0 0; margin-right: 10px; background-color: #dc000c; color: #fff; text-align: center;}
.infoEitorBox .ctgry.update{ background-color: #ffa60a;}
.infoEitorBox .ctgry.recruit{ background-color: #444;}
.infoEitorBox .time { color:#c91629; font-weight:bold;}
.infoEitorBox .title { font-size:26px; font-weight:bold; padding:8px 0; border-bottom:1px solid #b6b6b6; position:relative;}
.infoEitorBox .mainPh{ max-width: 750px; margin:4% auto;}
@media only screen and (max-width: 768px) {
  .infoEitorBox .title{ font-size:22px;}
}

/*エディタ====================*/
.articleBox{ padding:4% 0 6%;}
.articleBox p{ margin:20px 0;}
.articleBox iframe{ display:block; max-width:100%; margin:15px auto;}
.articleBox em{ font-style:italic;}

/*ボタン*/
.articleBox .btn01{ width:200px; margin-top:20px; color:#fff; font-size:12px; border-radius:4px; background-color:#DC000C;}
.articleBox .btn01 a{ color:#fff !important; display:block; padding: 5px 10px; padding-right:30px; background: url(/common/img/white_arrow.svg) no-repeat right center; background-position:95% 13px; transition: all .7s ease-in-out;}
.articleBox .btn01 a:hover{ background-color:black; border-radius:4px; transition: all .7s ease-in-out;}

/*テーブル*/
.articleBox .tbl01 { width:100%; border-collapse:collapse; border:1px solid #d6d6d6; font-size: 16px;}
.articleBox .tbl01 a{ color:#DC000C;}
.articleBox .tbl01 .global_tenList{ margin-left: 18px;}
.articleBox .tbl01 .btn01{ margin-bottom:0;}
.articleBox .tbl01 th{ background:#d6d6d6; padding:25px 20px; border:1px solid #fff; width:30%;}
.articleBox .tbl01 td{ padding:30px 20px; border:1px solid #d6d6d6; font-size:14px;}
@media only screen and (max-width: 768px) {
  .articleBox .tbl01 th{ width:100%; padding:20px 15px; display:block; border:1px solid #d6d6d6; font-size:14px;}
  .articleBox .tbl01 td{ padding:20px 15px; display:block; border:1px solid #d6d6d6; font-size:14px;} 
}

/*見出しパターン*/
.articleBox h1{ margin:4% 0 25px; padding:20px 20px 17px 37px; font-size:2rem; font-weight:600; background:#e2e2e2; letter-spacing:0px; color:#333; border-bottom:solid 4px #d6d6d6; position:relative;}
.articleBox h1::before{ width:6px; height:20px; left:20px; top:50%; transform:translate(0,-50%); background:#DC000C; content:""; position:absolute;}
.articleBox h2{ margin:4% 0 25px; font-size:1.8rem; font-weight:600; line-height:1.2; padding-bottom:18px; letter-spacing:0.04em; border-bottom:2px solid #e8e8e8; position:relative;}
.articleBox h2::before{ background-color:#DC000C; content:""; height:2px; width:100px; display:inline-block; position:absolute; bottom:-2px; left:0;}
.articleBox h3{ margin:4% 0 25px; font-size:2rem; padding:18px; letter-spacing:1px; color:white; border-left:10px solid #c91629; background:#272727; position:relative;}
.articleBox h3::before{ content:url("/recruit/common/img/triangle_icon.svg"); position:absolute; top:-10px; right:-2px;}

/*カラム*/
.articleBox .clmBox{ padding:0 0 1%; text-align:center;}
.articleBox .clmBox ul{ display:flex; flex-wrap:wrap;}
.articleBox .clmBox .ph{ margin-bottom:0;}
.articleBox .clmBox .txt{ margin:13px 0 0; text-align:left;}

.articleBox .clm1{ max-width:750px; margin:0 auto;}
.articleBox .clm1 .ph img{ width:100%;}
.articleBox .clm2 ul{ justify-content:space-between;}
.articleBox .clm2 ul > li{ width:48.5%;}
.articleBox .clm3 ul > li{ width:32%; margin-right:2%;}
.articleBox .clm3 ul > li:nth-child(3n){ margin-right:0;}
@media only screen and (max-width: 768px) {
  .articleBox .clmBox ul{ display:block;}
  .articleBox .clmBox ul > *{ width:auto !important;}
}


/*実績紹介 共通*/
.mainImg{ position:relative;}
.mainImg a{ display:block;}
.mainImg .txtBox{ width:100%; position:absolute; left:0; bottom:0; padding:4.5% 3.5%; background:linear-gradient(to top, rgba(0,0,0,1), rgba(0,0,0,0) 100%); box-sizing:border-box;}
.mainImg .txtBox .ctgry{ font-size:110%; margin:0 0 8px; color:#fff; line-height:1;}
.mainImg .txtBox .ctgry span{ display:inline-block; border:1px solid #fff; padding:4px 8px;}
.mainImg .txtBox .title{ font-size:150%; color:#fff; line-height:1.2;}
@media only screen and (max-width: 768px) {
  .mainImg .txtBox{ position:inherit; background:none; padding:12px 0;}
  .mainImg .txtBox .ctgry{ font-size:70%; color:#000;}
  .mainImg .txtBox .ctgry span{ border-color:#000;}
  .mainImg .txtBox .title{ font-size:14px; color:#000;}
}

.fitImg{ height:auto; position:relative; overflow:hidden;}
.fitImg::after{ content:""; display:block; padding-top:70%;}
.fitImg img{ position:absolute; display:block; left:0; top:0; width:100%; height:100%; object-fit:cover; transition:all 1.3s ease-out;}
/*hover*/
a:hover .fitImg{ transition:all 1s ease-out; background:#000;}
a:hover .fitImg img{ -moz-transform:scale(1.05,1.05); -webkit-transform:scale(1.05,1.05); -ms-transform:scale(1.05,1.05); -o-transform:scale(1.05,1.05); transform:scale(1.05,1.05);}


/*実績紹介一覧*/
ul.worksList{ display:flex; flex-wrap:wrap;}
ul.worksList > li{ width:32%; margin:0 2% 2% 0;}
ul.worksList > li:nth-child(3n){ margin-right:0;}
@media only screen and (max-width: 768px) {
  ul.worksList{ justify-content:space-between;}
  ul.worksList > li{ width:49%; margin:0 0 2%;}
}







/*トップページ*/
#top .informationBox{ width:90%; margin:0 auto; padding:7% 0 0;}
#top .informationBox .titleBox_title{ max-width:inherit; border-right: none; margin-bottom:2%; color:#000;}
#top .informationBox .global_btn{ background:#000;}
#top .informationBox .global_btn::before{ content:url(/common/img/btn_arrow_white.svg);}
@media only screen and (max-width: 768px) {
  #top .informationBox .titleBox_title{ font-size:16vw;}
}

.worksBox{ display:flex; justify-content: space-between; margin:3% 0 0;}
.worksBox .bigBox{ width:75%;}
.worksBox .bigBox .fitImg::after{ padding-top:80%;}
.worksBox .subBox{ width:24%;}
.worksBox .subBox .fitImg::after{ padding-top:60%;}
.worksBox .subBox > li:not(:first-child){ margin-top:3.5%;}
.worksBox .mainImg .txtBox .ctgry,
.worksBox .mainImg .txtBox .title{color:#fff !important;}
.worksBox .mainImg .txtBox .ctgry span{ border-color:#fff !important;}
@media only screen and (max-width: 768px) {
  .worksBox{ display:block; padding:0 5%;}
  .worksBox > *{ width:auto !important;}
  .worksBox .subBox{ display:flex; justify-content:space-between; flex-wrap:wrap;}
  .worksBox .subBox > li{ width:49%; margin-top:13px !important;}
  .worksBox .bigBox .fitImg::after,
  .worksBox .subBox .fitImg::after{ padding-top:70%;}
}


/*採用トップページ*/
.topMv_infoBox_textBox a{ display:block;}
.topMv_infoBox_textBox .ctgry{ display:inline-block; width:80px; font-size:90%; padding:4px 0; margin-right:10px; background-color:#fff; color:#c91629; text-align:center; line-height:1; font-family: "Barlow Condensed";}
.topMv_infoBox_time{ display:inline-block;}
.topMv_infoBox_text{ display:block;}

.topinfo .topi.sampleBoxnfo_list li:first-child{ border-top-color:#e0dfdf;}
.topinfo .topinfo_list li .ctgry{ font-family: "Barlow Condensed"; letter-spacing:1px;}
.topinfo .topinfo_list li time{ display:inline !important;}
