@charset "utf-8";




.dxc__hero{
	margin: 0px 0 0;
	height: calc(100vh - 80px);
	position: relative;
	overflow: hidden;
}
.dxc__hero__wrapper{
	height: 100%;
    overflow: hidden;
    
	
}
.dxc__hero__inner{
	display: block;
	position: relative;
	width: 100%;
	height: calc(100vh - 80px);
	background: #fff;
	background-position: center bottom;
	
    background:center top/cover no-repeat;

    

    background-size: 120%;/*サイズをひきのばす*/
    animation: bgmove 25s ease infinite;

    
    
}

@keyframes bgmove{
    0% {
      background-position: 0% 0%;
    }
    50% {
      background-position: 12% 0%;
    }
    100% {
      background-position: 0% 0%;
    }
  }

@media (max-width: 640px) {
    
    @keyframes bgmove{
        0% {
          background-position: 40% 0%;
        }
        50% {
          background-position: 60% 0%;
        }
        100% {
          background-position: 40% 0%;
        }
      }
    }


.dxc__hero__inner::after {
    content: '';
    display: block;
    width: 100%; /* 幅を親要素と同じに設定 */
    height: 100%; /* 高さを親要素と同じに設定 */
    position: absolute;
    top: 0;
    left: 0; /* 左端から開始させるために追加 */
    background-image: radial-gradient(#000000 30%, transparent 30%);
    
    background-color: #bcbcbc;
    background-position: 0 0;
    background-size: 4px 4px;
    mix-blend-mode: multiply; 
 
    transform: scale(1.03);
}

background-image: radial-gradient(#000000 25%, transparent 20%);

background-image: linear-gradient(-90deg, #e9e9e9 25%, transparent 20%),linear-gradient(#e9e9e9 75%, transparent 20%);

background-image: linear-gradient(-90deg, #dfdfdf 60%, transparent 0%),linear-gradient(#dfdfdf 60%, transparent 0%);



.slick-initialized .slick-slide {
	display: block;
}
.dxc__hero__inner:focus {
	outline: none;
}
.dxc__hero__img{
	position: relative;
	z-index: 0;
}
.dxc__hero__info{
	margin: 10% 10% 0;
}
.dxc__hero__name{
	font-family: "";
	font-size: 60px;
    font-weight: bold;
    letter-spacing: -0.05em;
    text-shadow
    2px 0 0 #fff,
    0 2px 0 #fff,
    -2px 0 0 #fff,
    0 -2px 0 #fff;
    color: #333333;
    
    

}
.dxc__hero__text{
	margin: 20px 0 0;
	font-family: "";
	font-size: 36px;
    font-weight: bold;
	line-height: 1.2em; 
    width: 100%;
    text-align: left;
    text-shadow
    2px 0 0 #fff,
    0 2px 0 #fff,
    -2px 0 0 #fff,
    0 -2px 0 #fff;
    color: #333333;
}
.dxc__hero__text2{
	margin: 40px 0 0;
	font-family: "";
	font-size: 21px;
    font-weight: bold;
	line-height: 1.4em;
    text-shadow
    2px 0 0 #fff,
    0 2px 0 #fff,
    -2px 0 0 #fff,
    0 -2px 0 #fff;
    color: #333333;
}

.dxc__hero__name_color{
	font-family: "";
	font-size: 60px;
    font-weight: bold;
    letter-spacing: -0.05em;
    color: white;

}
.dxc__hero__text_color{
	margin: 20px 0 0;
	font-family: "";
	font-size: 36px;
    font-weight: bold;
	line-height: 1.2em; 
    width: 100%;
    text-align: left;
    color: white;
}
.dxc__hero__text2_color{
	margin: 40px 0 0;
	font-family: "";
	font-size: 21px;
    font-weight: bold;
	line-height: 1.4em;
    color: white;
    
}



.dxc__hero__inner a{
	display: inline-block;
    text-align: center;
    border: 2px solid white
    border-radius: 30px;
    font-size: 24px;
    font-weight: bold;
    padding: 10px 30px;
    position:absolute;	
    margin: 20px 0 0;
    background: #ff6347;
    color: #fff;
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .3);
}

.dxc__hero__scroll{
    width: 120px;
    position:absolute;	
    bottom:8%;
    right:15%;
}

@media (max-width: 950px) {
    .dxc__hero__info{
	margin: 25% 5% 0;
    }
    
    .dxc__hero__inner{
	display: block;
	position: relative;
	width: 100%;
	height: calc(100vh);
	background: #fff;
	background-position: center ;
	background-repeat: no-repeat;
    background-size: 200% ;/*サイズをひきのばす*/
    
    }
}

@media (max-width: 640px) {

    
    
    .dxc__hero__info{
	margin: 25% 5% 0;
    }
    
    .dxc__hero__inner{
	display: block;
	position: relative;
	width: 100%;
	height: calc(100vh);
	background: #fff;
	background-position: center ;
	background-repeat: no-repeat;
    background-size: 340% ;/*サイズをひきのばす*/
    
    }
    
	.dxc__hero{
		height: calc(90vh);
	}
	.slick-list,
	.dxc__hero__wrapper{
		height: 100%;
	}
	.dxc__hero__inner{
        background-position: top;
	}

	.dxc__hero__name{
		font-family: "";
		font-size: 40px;
	}
	.dxc__hero__text{
		margin: 14px 0 0;
		font-family: "";
		font-size: 20px;
		line-height: 1.2em;
	}
    .dxc__hero__text2{
	margin: 28px 0 0;
	font-family: "";
	font-size: 15px;
    font-weight: bold;
	line-height: 1.4em;
    text-shadow
    2px 0 0 #fff,
    0 2px 0 #fff,
    -2px 0 0 #fff,
    0 -2px 0 #fff;
    color: #333333;
        
    }
    
    .dxc__hero__name_color{
		font-family: "";
		font-size: 40px;
        color: white;
	}
	.dxc__hero__text_color{
		margin: 14px 0 0;
		font-family: "";
		font-size: 20px;
		line-height: 1.2em;
        color: white;
	}
    .dxc__hero__text2_color{
	margin: 28px 0 0;
	font-family: "";
	font-size: 15px;
    font-weight: bold;
	line-height: 1.4em;
    color: white;
    }
    
    
    .dxc__hero__inner a{
	display: inline-block;
    text-align: center;
    border: 1.5px solid black
    border-radius: 100px;
    font-size: 18px;
    font-weight: bold;
    padding: 8px 18px;
    margin: 15px 0 0;
    background: #ff6347;
    
    }
    
    .dxc__hero__scroll{
    width: 80px;
    position:absolute;	
    bottom:8%;
    right:10%;  
}
}




/*事業紹介ボックスボタン*/

.dcd__detail__text__toolbox-c a{
	display: inline-block;
    text-align: center;
    color: #ffffff;
    font-size: 18px;
    font-weight: normal;
    padding: 6px 16px;
    margin: 5px 0px;
    background-color: #333333;
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .3);
    }

@media (max-width: 640px) {
    .dcd__detail__text__toolbox-c a{
        font-size: 16px;
        }
}





/*hero動画再生*/
.dxc__hero_mov{
	margin: 0px 0 0;
	width: auto;
	height: calc(100vh - 100px);
	overflow: hidden;
	position: relative;
    background-color: #000000;
    
    
}
.dxc__hero_mov video{
	width: 130%;
    overflow: hidden;
	
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
    vertical-align: bottom;
}
.dxc__hero_mov-inner{
	position: absolute;
	bottom: 5%;
	right: 7%;
	color: #fff;
	text-align: right;
	text-shadow:0px 0px 5px rgba(0,0,0,0.6);
}
.dxc__hero_mov-inner2{
	position: absolute;
    top: 50%; /* 上辺から50%の位置に */
    left: 50%; /* 左辺から50%の位置に */
    transform: translate(-50%, -50%); /* 本体の50%分戻して真ん中に配置 */
    color: #fff;
    text-align: center;
    text-shadow: 0px 0px 5px rgba(0,0,0,0.6);
    width: 100%; /* 全幅を使う場合、または必要な幅に設定 */
}

.dxc__hero_mov-title{
	font-size: 36px;
    font-weight: bold;
    letter-spacing: 0em;
    text-shadow
    2px 0 0 #fff,
    0 2px 0 #fff,
    -2px 0 0 #fff,
    0 -2px 0 #fff;
    color: #ffffff;
	
}

.dxc__hero_mov-title2{
    margin-top: 40px;
	font-size: 36px;
    font-weight: bold;
    letter-spacing: 0em;
    text-shadow
    2px 0 0 #fff,
    0 2px 0 #fff,
    -2px 0 0 #fff,
    0 -2px 0 #fff;
    color: #ffffff;
	
}

.dxc__hero_mov-text{
	
	

    margin: 40px 0 0;
	
	font-size: 16px;
    font-weight: bold;
	line-height: 1.4em;
    text-shadow
    2px 0 0 #fff,
    0 2px 0 #fff,
    -2px 0 0 #fff,
    0 -2px 0 #fff;
    color: #ffffff;
	
}


@media (max-width: 950px) {
    



}


@media (max-width: 640px) {
    

	.dxc__hero_mov{
        width: 100%;
		
        height: calc(100vh - 0px);
        
        
	}

    .dxc__hero_mov video{
        
        width: 105%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        
    }

	.dxc__hero_mov-inner{
        bottom: 10%;
        right: 7%;
	}
    
	.dxc__hero_mov-title{
		font-size: 24px;
	}
    .dxc__hero_mov-title2{
		font-size: 27px;
	}
	.dxc__hero_mov-text{
		font-size: 14px;
		line-height: 1.2em;
		margin: 5% 0 0;
	}
}





/*hero編みかけなし*/

.dxc__hero__inner2{
	display: block;
	position: relative;
	width: 120%;
	height: calc(100vh - 80px);
	background: #fff;
	background-position: center bottom;
	
    background:center top/cover no-repeat;
    align-items: center;
    

    
    animation: bgmove 25s ease infinite;
    
    
    
    
}

.dxc__hero__inner2::after {
    content: '';
    display: block;
    width: 100%; /* 幅を親要素と同じに設定 */
    height: 100%; /* 高さを親要素と同じに設定 */
    position: absolute;
    top: 0;
    left: 0; /* 左端から開始させるために追加 */
    
    
   
 
    transform: scale(1.03);
}

.dxc__hero__inner2:focus {
	outline: none;
}

.dxc__hero__inner2 a{
	display: inline-block;
    text-align: center;
    border: 2px solid white
    border-radius: 30px;
    font-size: 24px;
    font-weight: bold;
    padding: 10px 30px;
    position:absolute;	
    margin: 20px 0 0;
    background: #ff6347;
    color: #fff;
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .3);
}


@media (max-width: 950px) {

    
    .dxc__hero__inner2{
	display: block;
	position: relative;
	width: 100%;
	height: calc(100vh);
	background: #fff;
	background-position: center ;
	background-repeat: no-repeat;
    background-size: 200% ;/*サイズをひきのばす*/
    
    }
}


@media (max-width: 640px) {

    

    
    .dxc__hero__inner2{
	display: block;
	position: relative;
	width: 100%;
	height: calc(100vh);
	background: #fff;
	background-position: center ;
	background-repeat: no-repeat;
    background-size: 450% ;/*サイズをひきのばす*/
    
    }

    .dxc__hero__inner2{
        background-position: top;
	}

    .dxc__hero__inner2 a{
        display: inline-block;
        text-align: center;
        border: 1.5px solid black
        border-radius: 100px;
        font-size: 18px;
        font-weight: bold;
        padding: 8px 18px;
        margin: 15px 0 0;
        background: #ff6347;
        
        }


}