@charset "utf-8";
.article .col-main {line-height: 1.75rem;}
.shinrai-svg{max-width:460px; height:auto; padding-top:2em; padding-bottom:2em;}
.text-darkgold{color:#6f5f2d;}

.menu1200{width:1200px;max-width:1200px;margin:0 auto;}
.navbar-bg{background-color:#CFD8DC;}
.navbar{padding: .2rem .5rem; background-color:#EEE;border-top: 1px solid #ccc;}
.nav-link {padding: .25rem 1rem;}
.navbar-light .navbar-nav .nav-link.active {color:#33691E;}

.recruit_navbar{padding: 0.5rem 0.5rem; background-color: #4c4c4c;}
.navbar-dark .navbar-nav .nav-link { color: rgb(255 209 58 / 70%);}

#cover{ background: linear-gradient(to bottom, rgba(15,32,39,0.6) 0%, rgba(32,58,67,0.6) 100%), url(/corporate/recruit/img/recruit_top.jpg) center center / cover;
background-attachment: fixed; padding-top: 80px; padding-bottom: 80px;}

@media only screen and (max-width: 640px) {  
  #cover{background-attachment: scroll;}
}


.recruit-area-ttl{
background: linear-gradient(to bottom, rgba(15,32,39,0.2) 0%, rgba(32,58,67,0.2) 100%), url(/corporate/recruit/img/recruit_top.jpg) center no-repeat !important;
    background-size: cover !important;
    padding: 0px 0px;
    position: relative;
}
.recruit-area-ttl01{
  background:linear-gradient(to bottom, rgba(15,32,39,0.6) 0%, rgba(32,58,67,0.6) 100%),  url(/corporate/recruit/img/recruit_top.jpg) center no-repeat !important;
  background-size: cover !important;
  padding-top: 45.72%;
  position: relative; /*中の要素の基準値*/
}
.recruit-area-ttl02{
    background: linear-gradient(-135deg, #00CDAC,#02AAB0);
    padding: 80px 0px;
    position: relative;
}
.recruit-area-ttl002{
  background: #e6e6e6;
  padding: 300px 0px;
  position: relative; /*中の要素の基準値*/
  z-index: 1000;
}
.recruit-area-ttl03{
    background: linear-gradient(to left top, rgba(31,55,64,0.9) 50%, rgba(31,31,31,0.9) 100%), url(/img/Sengokuyama07.jpg) center bottom no-repeat !important;
    background-size: cover !important;
    padding: 130px 0px;
    position: relative;
}
.recruit-area-ttl07 {
    background: white;
    background-size: cover !important;
    padding: 80px 0px; /*背景画像の高さを確保*/
    position: relative; /*中の要素の基準値*/
    overflow: hidden;
}
.recruit-box_inner{
    top: 50%;
    left: 50%;
    margin-right: -21%;
    transform: translate(-50%, -50%);
    padding-top: 30px;
    padding-bottom: 10px;
    background-color: white;
    position: absolute; /*中の要素の基準値*/
    z-index; 1003;
}
.recruit-box_inner h1{
    border-bottom: solid 3px #689f38;
}
.recruit-box_inner1 {
    background-color: white;
    border-bottom: solid 3px #689f38;
}
.recruit-box_inner2 {
    background-color: white;
    color: #f57c00;
    padding: 0px 0px 0px 20px;
    margin-bottom: 30px;
}
.l-top-work {
    position: relative;
    padding-bottom: 100px;
    background-color: #fff;
}

.l-top-list {
    position: relative;
    margin-left: 15.4285714286%;
    margin-bottom: 110px;
    padding: 80px 0 80px;
    background-color: #e6e6e6;
}

.l-top-coporation {
    max-width: 1200px;
    overflow: hidden;
    position: relative;
    margin-left: 5%;
}
.corporation-info{
    padding: 80px 0px;
}

.top-matsue-inner {
    overflow: hidden;
    position: relative;
    display: block;
    min-height: 460px;
    text-decoration: none;
    background-color: #f57c00;
}
.top-matsue-info {
    overflow: hidden;
    width: 50%;
    max-width: 700px;
    margin-left: 50%;
    padding: 100px;
}
.top-work-img {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    float: right;
    width: 50%;
    height: 460px;
    height: 32.8571428571vw;
    min-height: 460px;
}
.recruit-area-ttl04{
  background:url(/corporate/recruit/img/matsue_info_banner.jpg) center top no-repeat !important;
  background-size: cover !important;
  padding: 130px 0px; /*背景画像の高さを確保*/
  position: relative; /*中の要素の基準値*/
}

.matsue-area-ttl{
  background: url(/corporate/recruit/img/matsue_top.jpg) center no-repeat !important;
  background-size: cover !important;
  padding-top: 37.38%;
  position: relative; /*中の要素の基準値*/
}
.l-matsue-top {
    position: absolute;
    top: 35%;
}
.l-matsue-top h1 {
	width: 100%;
	color: white;
    text-align: left;
    padding: 15px;
}
.matsue-area-ttl01{
  background: #f57c00;
  padding: 200px 0px;
  position: relative; /*中の要素の基準値*/
  z-index: 1000;
}
.matsue-area-ttl02{
  background: #f57c00;
  padding: 200px 0px;
  position: relative; /*中の要素の基準値*/
  z-index: 1000;
}
/* 松江コンテンツ背景 */
.flex{
    display: flex;
    flex-wrap: wrap;
}
.matsue-ga {
    background: #f57c00 !important;
}
.matsue-ga-b {
    overflow: hidden;
    margin: 0 0 10px;
    padding: 35px;
    border-radius: 5px;
    background: #fff;
}
.matsue-ga-b1 {
    overflow: hidden;
    margin: 0 0 10px;
    padding: 35px;
    border-radius: 5px;
    background: #fff;
}
.matsue-ga-b1 p {
    overflow: hidden;
    margin: 0 0 10px;
    padding: 10px;
    border-radius: 5px;
    background: #fffbdd;
}
.matsue-ga-b h2 {
    border-bottom: solid 3px #f57c00;
}
.matsue-ga-b h3 {
    color: #f57c00;
}
.matsue-ga-b1 h2 {
    border-bottom: solid 3px #f57c00;
}
.matsue-ga-b1 h3 {
    color: #f57c00;
}
@media only screen and (max-width: 767px) {　
  .matsue-ga-b {
      padding: 15px;
  }
}
.matsue-box-inner{
    top: 20%;
    left: 50%;
    margin-right: -21%;
    transform: translate(-50%, 0%);
    max-width: 1200px;
    padding: 40px;
    background-color: white;
    position: absolute; /*中の要素の基準値*/
    z-index; 1003;
}
.matsue-box-inner h1{
    border-bottom: solid 3px #f57c00;
}
.clearfix:after{
	content: "";
	clear: both;
	display: block;
}
.m-introduction-area-ttl{
  background:url(/corporate/recruit/img/matsue_introduction.jpg) center top no-repeat !important;
  background-size: cover !important;
  padding: 130px 0px; /*背景画像の高さを確保*/
  position: relative; /*中の要素の基準値*/
}
.blog-btn {
    display: inline-block;
    position: relative;
    width: 250px;
    padding: 12px 25px;
    border-radius: 30px;
    color: #000;
    font-size: 12px;
    text-align: left;
    background: #eee;
}
.blog-btn:after {
    content: "\F285";
    position: absolute;
    top: 50%;
    right: 15px;
    font-family: 'bootstrap-icons';
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
/* 新卒採用TOP画像 */
.recruit-area-ttl05{
  background:linear-gradient(to left top, rgba(173,217,176,0.3) 0%, rgba(18,52,88,0.4) 100%), url(/corporate/recruit/img/top_shinsotsu.jpg) center no-repeat !important;
  background-size: cover;
  padding: 150px 0px; /*背景画像の高さを確保*/
  position: relative; /*中の要素の基準値*/
}

.recruit-area-ttl05a{
  background:linear-gradient(to left top, rgba(173,217,176,0.3) 0%, rgba(18,52,88,0.4) 100%), url('/corporate/recruit/img/1263348490.jpg') center no-repeat !important;
  background-size: cover;
  padding: 150px 0px; /*背景画像の高さを確保*/
  position: relative; /*中の要素の基準値*/
}

/* キャリア採用TOP画像 */
.recruit-area-ttl06{
  background:linear-gradient(to left top, rgba(173,217,176,0.6) 0%, rgba(18,52,88,0.7) 100%),  url(/corporate/recruit/img/career_top.jpg) center no-repeat !important;
  background-size: cover !important;
  padding: 150px 0px; /*背景画像の高さを確保*/
  position: relative; /*中の要素の基準値*/
}

/*働き方改革ページKV*/
.workstyle-jumbotron {
    background: linear-gradient(to bottom, rgba(15,32,39,0.6) 0%, rgba(32,58,67,0.6) 100%), url(https://www.cybertrust.co.jp/itrust/img/642031390.jpg) center 50% no-repeat;
    background-size: cover;
    color: #fff;
    margin-bottom: 0;
    padding: 3em 0 3em;
    min-height: 400px;
    display: flex;
    align-items: center;
}

/*グリッドシステム高さそろえる*/
.row-eq-height {
    display: flex;
    flex-wrap: wrap;
}

/*働き方改革ページ BG*/
.workstyle-qa {
    background:#f57c00 !important;
}
.workstyle-qa h3 {
    margin: 0 -15px 70px;
    padding: 0;
    color: #fff;
    font-size: 32px;
    border: none;
}

.consulting-qa-category {
    position: relative;
    margin: 0 0 70px;
}

.consulting-qa-category h3 {
    position: absolute;
    top: -40px;
    left: -10px;
    margin: 0;
    padding: 15px 20px;
    border: none;
    color: #0097c1;
    font-size: 16px;
    font-weight: bold;
    background: #dff2fb;
    box-shadow: 5px 5px 0 rgba(4, 88, 158, .4);
    z-index: 10;
}

@media only screen and (max-width: 767px){
    .consulting-qa-category h3 {
        position: static;
        margin: 0 0 10px;
        padding: 10px 15px;
        font-size: 14px;
    }
}
.consulting-qa-q {
    overflow: hidden;
    margin: 5px;
    padding: 15px;
    border-radius: 5px;
    background: #fff;
}
@media only screen and (max-width: 767px){
    .consulting-qa-q {
        padding: 15px;
    }
}
.consulting-qa-a {
    position: relative;
    margin: 5px;
    padding: 25px;
    border-radius: 5px;
    background: #fffbdd;
}

.consulting-qa-a:before {
    content: "";
    position: absolute;
    top: 50%;
    left: -15px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 10px 0;
    border-color: transparent #fffbdd transparent transparent;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

@media only screen and (max-width: 767px){
    .consulting-qa-a {
        padding: 15px;
    }

    .consulting-qa-a:before {
        top: -10px;
        left: 50%;
        border-width: 0 5px 10px 5px;
        border-color: transparent transparent #fffbdd transparent;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
    }
}

.telework-interview-jumbotron {
    background: url(https://www.cybertrust.co.jp/linux-oss/img/oss-cover.jpg) center 50% no-repeat;
    background-size: cover;
    margin-bottom: 0;
    padding: 3em 0 3em;
    min-height: 350px;
    display: flex;
    align-items: center;
}


.container {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

.telework-interview-jumbotron .container {
    vertical-align: middle;
    padding: 1em 0.5em;
    background-color: rgba(255,255,255,0.5);
}



/* 企業情報ボタン */
.row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}
.bottom-nav-list__img {
    position: relative;
    margin: 0 0 15px;
}
.bottom-nav-list__img figcaption {
    position: absolute;
    bottom: -10px;
    left: -4px;
    line-height: 1;
    color: #fff;
    font-size: 45px;
    font-weight: bold;
}
.bottom-nav-list__ttl {
    margin: 0;
    font-weight: bold;
}
.bottom-nav-list__ttl i {
    float: right;
    color: #689f38;
}

/* ナビゲーション */
ul.topnav {
	overflow: hidden;
	margin: 0;
	padding: 0;
	list-style-type: none;
	background-color: rgba(0,0,0,0.7);
}
ul.topnav li {
	float: left;
    width: 16.66%;
}
ul.topnav li a {
	display: block;
	padding: 20px 20px;
	text-align: center;
	text-decoration: none;
	color: white;
}

ul.topnav li a:hover {
	background-color: #000;
}

.blue-cell {
    background-color: rgba(25,118,210,0.6);
    float: right;
}
.red-cell {background-color: rgba(218,60,65,0.6);float: right;}

ul.topnav li.right {
	float: right;
}
/*
ul.topnav li a:hover:not(.active) {
	background-color: #000;
} */

@media screen and (max-width: 480px) {
	ul.topnav li.right, ul.topnav li {
		float: left;
        width: 16.66%
	}
    ul.topnav li a {padding: 10px 10px;}
    ul.topnav li a.blue {line-height:normal !important;}
    ul.topnav li a.active {line-height:normal !important;}
}

/* ナビゲーションここまで */



.header-nav__item--corp > a:after {
  left: 0;
  width: 100%;
}

.header-nav__item--info > a:after {
  left: 50% !important;
  width: 0 !important;
}



.area-ttl {
  background: url(/corporate/img/bg-ttl-01.jpg) no-repeat 50% 50% !important;
  background-size: cover !important;
}

.area-ttl__ttl {
  background: url(/img/common/icon-nav-01.png) no-repeat 50% 0 !important;
  background-size: 32px auto !important;
}

.area-sub-ttl {
  background: url(/corporate/img/top.png) no-repeat 0 0;
  background-size: cover;
  height: 400px;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
  text-align: center;
}

.area-sub-ttl__ttl {
  font-size: 2.4rem;
  margin-bottom: 0;
  color: #fff;
}

/* 採用ボタン */
.annimation_button {
  text-align: center;
  padding-top: 44px;
}

/* 採用ボタン設定 */
.btn-animation {
  display: inline-block;
  width: 70%;
  min-width: 300px;
  text-align: center;
  background-color: rgba(200,200,200,0.3);
  border: 2px solid #FFF;
  font-size: 16px;
  color: #FFF;
  text-decoration: none;
  font-weight: bold;
  font-size: xx-large;
  padding: 44px 24px;
  border-radius: none;
  position: relative;
}

.btn-animation span {
  position: relative;
  z-index: 1;
}

.btn-animation::before,
.btn-animation::after {
  content: "";
  display: block;
  background-color: #689f38;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
}
.btn-animation::before {
  left: 0;
}
.btn-animation::after {
  right: 0;
}

.btn-animation:hover:before,
.btn-animation:hover:after {
  width: 0;
  background-color: #689f38;
}

.btn-animation:hover {
  color: #333;
}

/* 新卒採用ボタン */
.annimation_button1 {
  text-align: center;
  padding-top: 44px;
}

/* 新卒採用ボタン設定 */
.btn-animation-01 {
  display: inline-block;
  width: 70%;
  min-width: 280px;
  text-align: center;
  background-color: rgba(255,255,255,0.3);
  border: 2px solid #FFF;
  font-size: 16px;
  color: #FFF;
  text-decoration: none;
  font-weight: bold;
  font-size:x-large;
  padding: 44px 24px;
  border-radius: none;
  position: relative;
}

.btn-animation-01 span {
  position: relative;
  z-index: 1;
}

.btn-animation-01::before,
.btn-animation-01::after {
  content: "";
  display: block;
  background-color: #da3c41;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
}
.btn-animation-01::before {
  left: 0;
}
.btn-animation-01::after {
  right: 0;
}

.btn-animation-01:hover:before,
.btn-animation-01:hover:after {
  width: 0;
  background-color: #da3c41;
}

.btn-animation-01:hover {
  color: #FFF;
}

/* 中途採用ボタン */
.annimation_button2 {
  text-align: center;
  padding-top: 44px;
}


/* 中途採用ボタン設定 */
.btn-animation-02 {
  display: inline-block;
  width: 70%;
  min-width: 280px;
  text-align: center;
  background-color: rgba(255,255,255,0.3);
  border: 2px solid #FFF;
  font-size: 16px;
  color: #FFF;
  text-decoration: none;
  font-weight: bold;
  font-size:x-large;
  padding: 44px 24px;
  border-radius: none;
  position: relative;
}

.btn-animation-02 span {
  position: relative;
  z-index: 1;
}

.btn-animation-02::before,
.btn-animation-02::after {
  content: "";
  display: block;
  background-color: #1976D2;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
}
.btn-animation-02::before {
  left: 0;
}
.btn-animation-02::after {
  right: 0;
}

.btn-animation-02:hover:before,
.btn-animation-02:hover:after {
  width: 0;
  background-color: #1976D2;
}

.btn-animation-02:hover {
  color: #FFF;
}


/* 企業情報ボタン */
.annimation_button3 {
  text-align: center;
  padding-top: 10px;
}


/* 企業情報ボタン設定 */
.btn-animation-03 {
  display: inline-block;
  width: 50%;
  min-width: 350px;
  text-align: center;
  background-color: rgba(0,0,0,0.4);
  border: 2px solid #FFF;
  color: #FFF;
  text-decoration: none;
  font-weight: bold;
  padding: 14px 10px;
  border-radius: none;
  position: relative;
}

.btn-animation-03 span {
  position: relative;
  z-index: 1;
}

.btn-animation-03::before,
.btn-animation-03::after {
  content: "";
  display: block;
  background-color: rgba(255,255,255,0.3);
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
}
.btn-animation-03::before {
  left: 0;
}
.btn-animation-03::after {
  right: 0;
}

.btn-animation-03:hover:before,
.btn-animation-03:hover:after {
  width: 0;
  background-color: rgba(255,255,255,0.1);
}

.btn-animation-03:hover {
  color: #FFF;
}

/* 新卒採用エントリーボタン */
.annimation_button4 {
  text-align: center;
  padding-top: 44px;
}

/* 新卒採用エントリーボタン設定 */
.btn-animation-04 {
  display: inline-block;
  width: 70%;
  min-width: 350px;
  text-align: center;
  background-color: rgba(255,255,255,0.3);
  border: 2px solid #FFF;
  font-size: 16px;
  color: #FFF;
  text-decoration: none;
  font-weight: bold;
  font-size:large;
  padding: 24px 24px;
  border-radius: none;
  position: relative;
}

.btn-animation-04 span {
  position: relative;
  z-index: 1;
}

.btn-animation-04::before,
.btn-animation-04::after {
  content: "";
  display: block;
  background-color: #da3c41;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
}
.btn-animation-04::before {
  left: 0;
}
.btn-animation-04::after {
  right: 0;
}

.btn-animation-04:hover:before,
.btn-animation-04:hover:after {
  width: 0;
  background-color: #da3c41;
}

.btn-animation-04:hover {
  color: #FFF;
}

/* 中途採用ボタン */
.annimation_button5 {
  text-align: center;
  padding-top: 44px;
}


/* 中途採用ボタン設定 */
.btn-animation-05 {
  display: inline-block;
  width: 50%;
  min-width: 350px;
  text-align: center;
  background-color: rgba(255,255,255,0.3);
  border: 2px solid #FFF;
  font-size: 16px;
  color: #FFF;
  text-decoration: none;
  font-weight: bold;
  font-size:large;
  padding: 24px 24px;
  border-radius: none;
  position: relative;
}

.btn-animation-05 span {
  position: relative;
  z-index: 1;
}

.btn-animation-05::before,
.btn-animation-05::after {
  content: "";
  display: block;
  background-color: #1976D2;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
}
.btn-animation-05::before {
  left: 0;
}
.btn-animation-05::after {
  right: 0;
}

.btn-animation-05:hover:before,
.btn-animation-05:hover:after {
  width: 0;
  background-color: #1976D2;
}

.btn-animation-05:hover {
  color: #FFF;
}


/* トップ空間調整用 */
.top-area{
    padding-top: 40px;
}

/* 空間調整用 */
.area-ippai{
    padding: 300px 0px;
}


/* 新卒募集要項エントリーボタン */
.annimation_button7 {
  text-align: left;
  padding-top: 44px;
}

/* 新卒募集要項エントリーボタン設定 */
.btn-animation-07 {
  display: inline-block;
  width: 70%;
  min-width: 350px;
  text-align: center;
  background-color: rgba(0,0,0,0.3);
  border: 2px solid #FFF;
  font-size: 16px;
  color: #FFF;
  text-decoration: none;
  font-weight: bold;
  font-size:large;
  padding: 24px 24px;
  border-radius: none;
  position: relative;
}

.btn-animation-07 span {
  position: relative;
  z-index: 1;
}

.btn-animation-07::before,
.btn-animation-07::after {
  content: "";
  display: block;
  background-color: #d32f2f;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
}
.btn-animation-07::before {
  left: 0;
}
.btn-animation-07::after {
  right: 0;
}

.btn-animation-07:hover:before,
.btn-animation-07:hover:after {
  width: 0;
  background-color: #d32f2f;
}

.btn-animation-07:hover {
  color: #FFF;
}

/* 中途募集要項エントリーボタン */
.annimation_button9 {
  text-align: left;
  padding-top: 44px;
}

/* 中途募集要項エントリーボタン設定 */
.btn-animation-09 {
  display: inline-block;
  width: 70%;
  min-width: 350px;
  text-align: center;
  background-color: rgba(0,0,0,0.3);
  border: 2px solid #FFF;
  font-size: 16px;
  color: #FFF;
  text-decoration: none;
  font-weight: bold;
  font-size:large;
  padding: 24px 24px;
  border-radius: none;
  position: relative;
}

.btn-animation-09 span {
  position: relative;
  z-index: 1;
}

.btn-animation-09::before,
.btn-animation-09::after {
  content: "";
  display: block;
  background-color: #1976D2;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
}
.btn-animation-09::before {
  left: 0;
}
.btn-animation-09::after {
  right: 0;
}

.btn-animation-09:hover:before,
.btn-animation-09:hover:after {
  width: 0;
  background-color: #1976D2;
}

.btn-animation-09:hover {
  color: #FFF;
}


/* エントリーボタン */
.annimation_button8 {
  text-align: left;
}

/* エントリーボタン設定 */
.btn-animation-08 {
  display: inline-block;
  width: 70%;
  min-width: 350px;
  text-align: center;
  background-color: rgba(0,0,0,0.3);
  border: 2px solid #FFF;
  font-size: 16px;
  color: #FFF;
  text-decoration: none;
  font-weight: bold;
  font-size:large;
  padding: 24px 24px;
  border-radius: none;
  position: relative;
}

.btn-animation-08 span {
  position: relative;
  z-index: 1;
}

.btn-animation-08::before,
.btn-animation-08::after {
  content: "";
  display: block;
  background-color: #489f93;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
}
.btn-animation-08::before {
  left: 0;
}
.btn-animation-08::after {
  right: 0;
}

.btn-animation-08:hover:before,
.btn-animation-08:hover:after {
  width: 0;
  background-color: #489f93;
}

.btn-animation-08:hover {
  color: #FFF;
}
/* 緑アニメーションボタン */
.annimation_button10 {
    text-align: center;
    padding-top: 10px;
}

/* 緑アニメーションボタン */
.btn-animation-010 {
    display: inline-block;
    width: 50%;
    min-width: 350px;
    text-align: center;
    background-color: rgba(200,200,200,0.3);
    border: 2px solid #FFF;
    color: #FFF;
    text-decoration: none;
    font-weight: bold;
    padding: 14px 10px;
    border-radius: none;
    position: relative;
}

.btn-animation-010 span {
    position: relative;
    z-index: 1;
}

.btn-animation-010::before,
.btn-animation-010::after {
    content: "";
    display: block;
    background-color: #689f38;
    width: 50%;
    height: 100%;
    position: absolute;
    top: 0;
    transition: .2s;
}

.btn-animation-010::before {
    left: 0;
}

.btn-animation-010::after {
    right: 0;
}

.btn-animation-010:hover:before,
.btn-animation-010:hover:after {
    width: 0;
    background-color: #689f38;
}

.btn-animation-010:hover {
    color: #333;
}


/* test */

.top-box1 {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
}
.top-box1 p {
	width: 100%;
	padding: 30px 50px;
	border: solid 5px white;
	font-size: 5vw;
	color: white;
	text-align: center;
    @media (max-width: 480px) {
    font-size: 20px;
 }
}
/* 採用プロセス */
.career_step-line {
    content: "";
    height: 7px;
    left: 69.5%;
    line-height: 5px;
    margin: 0;
    overflow: hidden;
    position: absolute;
    right: -39%;
    top: 50px;
}

@media only screen and (max-width: 576px) {
    .career_step-line {
        display: none;
    }
}
.career_step-line .line {
    background: #e8eaed;
    display: inline-block;
    height: 5px;
    margin: 1px 9px 4px 3.5px;
    vertical-align: bottom;
    width: 300px;
}
.career_step {
    margin-bottom: 30px;
    padding-top: 16px;
    position: relative;
    width: 100%;
}
.career_step__number {
    border-radius: 50%;
    color: #689f38;
    font-size: 35px;
    height: 70px;
    line-height: 50px;
    margin: 0 auto;
    padding: 8px;
    width: 70px;
    border: solid 5px #689f38;
}
.career_step-description {
    color: #5f6368;
    font-size: .82353rem;
    letter-spacing: .2px;
    line-height: 1.5;
    margin: 0 auto 28px;
    max-width: 260px;
    padding: 1px 0 1.5em;
    position: relative;
}

/* 採用プロセス */


/* 働き方改革インタビュー */
.interview-member-overview {
    padding: 0 32px;
    max-width: 864px;
    margin-bottom: 80px;
    margin: 40px auto 176px;
    font-size: 1.4rem;
}
/* 働き方改革インタビューおわり */


#timeline {
  list-style: none;
  position: relative;
}
#timeline:before {
  top: 0;
  bottom: 0;
  position: absolute;
  content: " ";
  width: 2px;
  background-color: #4997cd;
  left: 50%;
  margin-left: -1.5px;
}
#timeline .clearFix {
  clear: both;
  height: 0;
}
#timeline .timeline-badge {
  color: #fff;
  width: 50px;
  height: 50px;
  line-height: 1.4;
  text-align: center;
  position: absolute;
  top: 20px;
  left: 50%;
  margin-left: -25px;
  padding-top: 3px;
  background-color: #4997cd;
  z-index: 100;
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
}
#timeline .timeline-badge span.timeline-balloon-date-day {
  display: block;
  font-size: 1.4em;
}
#timeline .timeline-badge span.timeline-balloon-date-month {
  font-size: .7em;
  position: relative;
  top: -10px;
}
#timeline .timeline-badge.timeline-filter-movement {
  background-color: #ffffff;
  font-size: 1.7em;
  height: 35px;
  margin-left: -18px;
  width: 35px;
  top: 40px;
}
#timeline .timeline-badge.timeline-filter-movement a span {
  color: #4997cd;
  font-size: 1.3em;
  top: -1px;
}
#timeline .timeline-badge.timeline-future-movement {
  background-color: #ffffff;
  height: 35px;
  width: 35px;
  font-size: 1.7em;
  top: -16px;
  margin-left: -18px;
}
#timeline .timeline-badge.timeline-future-movement a span {
  color: #4997cd;
  font-size: .9em;
  top: 2px;
  left: 1px;
}
#timeline .timeline-movement {
  border-bottom: dashed 1px #4997cd;
  position: relative;
}
#timeline .timeline-movement.timeline-movement-top {
  height: 60px;
}
#timeline .timeline-movement .timeline-item {
  padding: 20px 0;
}
#timeline .timeline-movement .timeline-item .timeline-panel {
  border: 1px solid #d4d4d4;
  border-radius: 3px;
  background-color: #FFFFFF;
  color: #666;
  padding: 10px;
  position: relative;
  -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
}
#timeline .timeline-movement .timeline-item .timeline-panel .timeline-panel-ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#timeline .timeline-movement .timeline-item .timeline-panel.credits .timeline-panel-ul {
  text-align: right;
}
#timeline .timeline-movement .timeline-item .timeline-panel.credits .timeline-panel-ul li {
  color: #666;
}
#timeline .timeline-movement .timeline-item .timeline-panel.credits .timeline-panel-ul li span.importo {
  color: #468c1f;
  font-size: 1.3em;
}
#timeline .timeline-movement .timeline-item .timeline-panel.debits .timeline-panel-ul {
  text-align: left;
}
#timeline .timeline-movement .timeline-item .timeline-panel.debits .timeline-panel-ul span.importo {
  color: #e2001a;
  font-size: 1.3em;
}

.wanted-jobs {
  margin: 0 0 30px;
}

.wanted-jobs a {
  display: block;
  position: relative;
  /* min-height: 220px; */
  overflow: hidden;
  color: inherit;
  box-shadow: 0 0 3px rgba(0, 0, 0, .2);
}

.wanted-jobs a:hover {
  text-decoration: none;
}

.wanted-jobs a:hover .data {
  -webkit-transform: translateY(1px);
          transform: translateY(1px);
}

.wanted-jobs a figure {
  margin: 0;
}

.wanted-jobs .data {
  position: absolute;
  bottom: 0;
  width: 100%;
  -webkit-transform: translateY(calc(60px + 1em));
          transform: translateY(calc(60px + 1em));
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

.wanted-jobs .data .content {
  padding: 0 15px 15px;
  position: relative;
  z-index: 1;
}

.wanted-jobs .title {
  display: table-cell;
  height: 4em;
  vertical-align: middle;
  margin: 0;
  font-weight: bold;
  color: #0741a9;
}

.wanted-jobs .text {
  height: 60px;
  margin: 0;
}

.wanted-jobs .content {
  background: #ffffffaa;
  backdrop-filter: blur(5px);
  box-shadow: 0 5px 30px 10px rgba(0, 0, 0, 0.3);
}

.test {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-around;
    justify-content: space-around;
}　

.border-double {
    margin : 3em 0 1.5em ;
    padding : 1em 1.5em ;
    line-height : 1.8 ;
    border : double 4px #333 ; 
}


@media only screen and (max-width: 1024px) {
  .wanted-jobs .data {
    position: static;
    -webkit-transform: none;
            transform: none;
  }
  
  .wanted-jobs .title {
    display: block;
    height: auto;
    padding: 15px 0;
  }
  
  .wanted-jobs .text {
    height: auto;
  }
}




@media only screen and (max-width: 767px) {
  .area-ttl__ttl {
    background-size: 24px auto !important;
  }
  .matsue-ga-b h2 {
    font-size: 5vw;
  }
}

/* 働き方改革interview パーツ */
.workstyle-interview-contents {
    padding: 0 32px;
    max-width: 864px;
    margin-bottom: 80px;
    margin: 40px auto 176px;
    font-size: 1.4rem;
}

/* 採用インタビュー */
.interview-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 15px;
}

.filter {
  margin: 60px 0 30px;
}

.filter a {
  text-decoration: none;    
  display: inline-block;
  padding: 10px;
  position: relative;
  margin-right: 20px;
  margin-bottom: 20px;
  font-size: 1.2rem;
  color: #333;
}

.filter a.active:before {
  content: '';
  position: absolute;
  left: 0;
  bottom: -2px;
  display: inline-block;
  width: 100%;
  height: 3px;
  background: #689f38;
}

.filter a:hover{
  color: #888;
}

.filter a.selected {
  color: #689f38;
}

@media only screen and (max-width: 576px){
  .filter a{
      font-size: 1rem;
  }
}

.boxes {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 991px){
  .boxes {
    justify-content: space-between;
  }  
}


.interview-contents {
  width: calc(33.333% - 60px);
  min-height: 280px;
  /*border: 2px solid #333;*/
  float: left;
  margin: 0 30px 48px !important;
  position: relative;
}

@media screen and (max-width: 991px){
  .interview-contents {
    width: calc(33.333% - 20px);
    min-height: 300px;
    margin: 0 0 20px !important;
    position: relative;
  }
  .interview_contents_odd {
    margin-right: 18px;
  }
}

@media screen and (max-width: 767px){
  .interview-contents {
    width: calc(50% - 9px);
    min-height: 350px;
    margin: 0 0 20px !important;
    position: relative;
  }
  .interview_contents_odd {
    margin-right: 18px;
  }
}

@media only screen and (max-width: 576px){
  .interview-contents {
    width: 85%;
    min-height: 300px;
    margin: 10px auto !important;
    position: relative;
  }
}

.boxes img {
  display: block;
  width: 100%;
  margin-bottom: 16px;
  overflow: hidden;
}

.boxes img:hover {
  opacity: 0.7 ;
}

.all {
  background: khaki;
}

.technical {
  background: #689f38;
  padding: .5% 2%;
  font-size: .8rem;
  display: inline-block;
  margin: 0 2% 8px;
  letter-spacing: .2em;
  color : white;
  font-weight: bold;
}

.sales {
  background: #f57c00;
  padding: .5% 2%;
  font-size: .8rem;
  display: inline-block;
  margin: 0 2% 8px;
  letter-spacing: .2em;
  color: white;
  font-weight: bold;
}

.interview-ttl {
  font-size: 1.2rem;
  letter-spacing: .1em;
  line-height: 1.6;
  margin-bottom: 20px;
  margin: 0 2% 8px;
  font-family: "YuGothic","Yu Gothic","Meiryo","ヒラギノ角ゴ","sans-serif";
  color: #333;  
}

.interview-ttl a{
  text-decoration: none !important;  
}

.interview-ttl:hover{
  opacity: 0.5;
}

@media screen and (max-width: 767px){
  .interview-ttl{
      font-size: 1rem;
  }
}
@media only screen and (max-width: 576px){
  .interview-ttl{
      font-size: .9rem;
  }
}

.is-animated {
  animation: .6s zoom-in;
}

@keyframes zoom-in {
  0% {
   transform: scale(.1);
  } 
  100% {
    transform: none;
  }
}

.interview-blog-ga {
  background: #689f38 !important;
}

.container-blog{
  max-width: 900px;
  margin: 0 auto;
  padding: 0 15px;
  border: 2px solid #689f38;
}

.container-interview{
  max-width: 900px;
  margin: 0 auto;
  padding: 0 15px;
  border: 2px solid #DDD;
  background: #FFF;
}

.container-blog img:hover{
  opacity: 0.5;
}

.container-blog p:hover{
  opacity: 0.5;
}

.interview_jumbtron {
  width: 100%;
  height: 0;
  padding-top: 25%;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 767px){
  .interview_jumbtron {
    width: 100%;
    height: auto;
    padding: 0;
  }  
}

.interview_main {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

@media screen and (max-width: 767px){
  .interview_main {
    width: 100%;
    height: auto;
    position: static;
  }
  
}

.interview_main img {
  width: 100%;
}


.interview_main_ttl {
  width: 36%;
  position: absolute;
  top: 40%;
  left: 58%;
}

@media screen and (max-width: 767px){
  .interview_main_ttl {
    width: calc(100% - 10px);
    position: static;
    padding: 0 20px;
    margin-top: 20px;
  }
  
}
.interview_main_txt{
  font-size: 1.2rem;
  letter-spacing: .1em;
  line-height: 2;
  margin-bottom: 20px;
  margin: 0 2% 8px;
  font-family: "YuGothic","Yu Gothic","Meiryo","ヒラギノ角ゴ","sans-serif";
  color: #333;  
}

@media screen and (max-width: 767px){
  .interview_main_txt{
      font-size: 1rem;
  }
}
@media only screen and (max-width: 576px){
  .interview_main_txt{
      font-size: .9rem;
  }
}

.interview-top-ttl {
  font-size: 1.3rem;
  letter-spacing: .1em;
  line-height: 1.6;
  margin-bottom: 20px;
  margin: 0 2% 8px;
  font-family: "YuGothic","Yu Gothic","Meiryo","ヒラギノ角ゴ","sans-serif";
  color: #333;  
}
@media screen and (max-width: 767px){
  .interview-top-ttl{
      font-size: 1.3rem;
  }
}

@media only screen and (max-width: 576px){
  .interview-top-ttl{
    font-size: 1.1rem;
}
}


@media only screen and (max-width: 767px) {
  .pc { display: none !important; }
  .sp { display: block !important; }
}
/* 採用インタビューここまで */


/* 採用ブログ */
.info-row__col a:hover .info-row__img:after {
  border: 3px solid #c2185b;
}

.info-row__cat {
  width: 150px;
  line-height: 18px;
  margin: 0 0 5px;
  color: #fff;
  font-size: 10px;
  text-align: center;
}
.info-row__cat.workstyle {background:#01579B;}
.info-row__cat.hr {background:#E65100;}
.info-row__cat.miracle-news {background:#388E3C;}
.info-row__cat.community {background:#FF8F00;}
.info-row__cat.asahikawa {background:#37474F;}
.info-row__cat.matsue {background:#7B1FA2;}
.info-row__cat.newgraduate {background:#0097A7;}
.info-row__cat.well-being {background:#eee3ad; color:#636151;}






@media only screen and (max-width: 767px) {  
  .info-row__col:nth-child(5) {
    display: none;
  }

  .info-row__date .cat-info {
    width: auto;
  }

}



div.imagethumblist{
  display: flex;
  flex-wrap: wrap;
}

div.imagethumblist div{
  border: 3px double #bbb;
  background-color: #fff;
  position: relative;
  width: 32%;
  margin: 0.5%;
  overflow:hidden;
}
@media only screen and (max-width: 500px) {  
  div.imagethumblist div{
    width: 49%;
    margin: 0.5%;
  }
}

div.imagethumblist div:before{
  content: "";
  display: block;
  padding-top: 100%;
}

div.imagethumblist div img{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  object-fit: cover;
  transition-duration: 0.5s;
}

div.imagethumblist div img:hover{
  transform: scale(1.1);
  transition-duration: 0.5s;
}






figcaption{text-align:center; font-size: 10.5pt; color: var(--bs-gray); margin-top: 1rem;}


.text-member{color:#5c8fa0;}
.image-member{border-radius:50%;}
.main-title{color:#6f5f2d; border-top: 3px solid #6f5f2d; border-bottom: 3px solid #6f5f2d; padding: 0.25rem 0;}
.block-title{ color: #44a8ce;  padding: 0.15rem 0;  border-bottom: 1px solid #44a8ce; margin-bottom: 1rem;}
.descriptions {background-color:#e7e7e7; padding: 0.5rem; margin: 1.5rem 0; border-radius: 0.25rem;}


.flex-icon{min-width:72px;}
.flex-icon>img{border-radius:0.25rem; margin-top: 0.25rem; max-width: 72px; width: 100%;}
.flex-icon>p{text-align:center; font-size:10pt; margin:0; color:#5c8fa0;}
.line-height-small{line-height:1.25rem;}
.inline-image-sq {border-radius:0.33rem; margin-top: 0.5rem;}
.float-right {float:right; margin-left:1rem; margin-bottom:0.5rem;}


@media (max-width: 768px) { 
  .flex-icon{min-width:54px;}
  .article .col-main {line-height: 1.5rem;}
}


#interview-deck .card {border-radius: 0.5rem;}
#interview-deck .card .card-img-top {border-radius: 0.5rem 0.5rem 0 0;}

#interview-deck .card:hover img{transform: scale(1.1); transition:0.5s;}
#interview-deck .card:hover a{color:#37404a;}
#interview-deck img{transition:0.5s;}