@charset "utf-8";

/*スライダーcss*/
.slider {
    position:relative;
	z-index: 1;
	height: 100vh;
}
/*　背景画像設定　*/
.slider-item01 {background:url(../img/content-dtp.jpg);}
.slider-item02 {background:url(../img/content-pc-training.jpg);}
.slider-item03 {background:url(../img/content-web-site.jpg);}
.slider-item04 {background:url(../img/content-cs.jpg);}

.slider-item {
    width: 100%;
    height:93vh;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

/*矢印の設定*/
.slick-prev, 
.slick-next {
    position: absolute;
	z-index: 3;
    top: 49%;
    cursor: pointer;
    outline: none;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    height: 25px;
    width: 25px;
}

.slick-prev {
    left:2.5%;
    transform: rotate(-135deg);
}

.slick-next {
    right:2.5%;
    transform: rotate(45deg);
}

/*ドットナビゲーションの設定*/
.slick-dots {
	position: relative;
	z-index: 3;
    text-align:center;
	margin:-50px 0 0 0;/*ドットの位置*/
}

.slick-dots li {
    display:inline-block;
	margin:0 5px;
}

.slick-dots button {
    color: transparent;
    outline: none;
    width:8px;/*ドットボタンのサイズ*/
    height:8px;/*ドットボタンのサイズ*/
    display:block;
    border-radius:50%;
    background:#fff;/*ドットボタンの色*/
}

.slick-dots .slick-active button{background:#666;}

/*レイアウトのためのCSS */
ul{
	margin:0;
	padding: 0;
	list-style: none;
}

a{	color: #fff;}

/*
a:hover,
a:active{
	text-decoration: none;
}
*/

.content-top{
	position: absolute;
	z-index: 2;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	font-size:5rem;
	line-height: 5rem;
	letter-spacing: 0.1em;
	color: #fff;
}
@media (max-width: 576px) {
.content-top{
	font-size:3.5rem;
	line-height: 3.5rem;}}



.wrapper{
	position: relative;
}

/*
.container-dn{
	background:#555;
}

.container-dn p{
	padding: 300px 0;	
	text-align: center;
	color: #fff;
}
*/