@charset "UTF-8";
*{
margin: 0;
padding: 0;
}

header{
position: relative;
background:url(../material/pagetop/concept.png)no-repeat;
width: 1280px;
height: 560px;
margin: 0 auto;
}

.header-txt{
position: absolute;
top: 50%;;
left: 50%;
transform: translate(-50%,-50%);
}

body{
margin: 0 auto;
background:#fdfdfd;
font-family: 'Noto Sans', sans-serif,YuGothic,'Yu Gothic','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','Helvetica','Arial';
}

p{
font-size: 13px;
color: #707070;
}

.wrapper{
width: 1000px;
margin: 0 auto;
}

main{
position: relative;
background-color: #fdfdfd;
overflow: hidden;
width: 980px;
height: 540px;
margin: 100px auto;
z-index: 0;
}

/*mainを半透明にする*/
main::before{
position: absolute;
content: '';
background: #fdfdfd url(../material/concept/people.png) no-repeat;
opacity: 0.7;/*半透明カラーの透明度*/
filter: blur(3px);/*ぼかし度*/
top: -8px;
bottom: -8px;
left: -8px;
right: -8px;
z-index: -1;
}

/*mainの周り（内側）をぼかす*/
main::after{
position: absolute;
content: "";
top: 0;
bottom: 0;
left: 0;
right: 0;
box-shadow: inset 0 0 8px 8px #fdfdfd;
}

main h1{
color: #363333;
margin-top: 80px;
margin-left: 40px;
}

.concept-txt{
margin-top: 20px;
margin-left: 40px;
}

.concept-txt p{
line-height: 1.5;
color: #201F1F;
font-size: 14px;
}

.concept-txt p span{
color: #fdfdfd;
}

.concept-container{
width: 100%;
margin: 100px auto;
}
.concept-box-left{
width: 50%;
float: left;
}
.concept-box-txt{
width: 100%;
margin: 40px auto;
padding: 20px 50px 0;
box-sizing: border-box;
}

.concept-box-txt h2{
color: #707070;
margin-bottom: 8px;
}

.concept-box-txt h2 span{
font-size: 20px;
}

.concept-box-right{
position: relative;
background: url(../material/concept/canvus.png) no-repeat;
width: 50%;
height: 480px;
margin: 0 auto;
float: left;
}

/*スライダー用画像を上に重ねる*/
#slide{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
width: 400px;
height: 340px;
}

#slide ul{
position: relative;
list-style: none;
}
#slide ul li{
position: absolute;
width: 100%;
}

.concept-box-img{
width: 100%;
height: 100%;
}

/*
#button{
position: absolute;
width: 100%;
bottom: 0;
left: 30%;
}

#button ul li{
margin: 12px;
float: left;
}

#button ul li a{
text-indent: -9999px;/*ブラウザ上”a”に入っている数字が表示されない
text-decoration: none;
display: block;
width: 12px;
height: 12px;
border-radius: 6px;
background: #fdfdfd;
}
*/