@charset "utf-8";
/*************************************************************
CSS information
style info :  カテゴリごとに異なる背景画像を指定する
**************************************************************/

/* 
====================
↓メインビジュアル
====================
*/

.main_visual {
  box-sizing: border-box;
  position: relative;
  height: 400px;
	background: url(https://gsx-co-jp.s3.ap-northeast-1.amazonaws.com/services/cybersecurityorganization/images/bg_cybersecurityorganization.jpg) no-repeat center;
	background-size: cover;  
}

.main_visual::after {
  position: absolute;
  content: '';
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  height: 400px;
  /* background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.40448) 62.31%, rgba(0, 0, 0, 0) 100%);
  -webkit-linear-background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 62%, rgba(0, 0, 0, 0) 100%);
  -ms-linear-background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 62%, rgba(0, 0, 0, 0) 100%); */
  z-index: 0;
  background: rgba(0, 0, 0, 0.6);
}

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

  .main_visual {
    width: 100%;
    height: 220px;
    margin-top: 0px;
  }

  .main_visual::after {
    height: 220px;
    background: rgba(0, 0, 0, 0.6);
  }

}