@charset 'UTF-8';

.kv {
position: relative;
overflow: hidden;
}

.kv .sns01 {
position: fixed;
top: 119px;
right: 35px;
z-index: 9999;
}

.kv .sns02 {
position: fixed;
top: 181px;
right: 35px;
z-index: 9999;
}

.kv .sns03 {
position: fixed;
top: 243px;
right: 35px;
z-index: 9999;
}

.kv .second ,
.kv .third ,
.kv .fourth ,
.kv .fifth {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 1;
opacity: 0;
}

.kv .second ,
.kv .third ,
.kv .fourth {
transform: scale(1.2, 1.2);
transition: 1.5s transform;
}

.kv .second.on ,
.kv .third.on ,
.kv .fourth.on {
transform: scale(1, 1);
transition: 1.5s transform;
}

.kv .first img ,
.kv .second img ,
.kv .third img ,
.kv .fourth img ,
.kv .fifth img {
max-width: inherit;
width: 100%;
}

.kv .sixth {
position: absolute;
top: 0;
left: 0;
width: 0;
padding-top:43.4vw;
overflow: hidden;
z-index: 5;
}

.kv .sixth img {
position: absolute;
top: 0;
left: 0;
max-width: inherit;
height: 100%;
}

.kv .sixth img.ov {
opacity: 0;
z-index: 2;
}

.kv .bx-wrapper {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 3;
}

.kv .bxslider01 {
display: none;
}

.kv .bxslider01 li img {
width:100%;
}

.concept {
padding: 197px 0 238px;
background: url("/img/concept_bg_01.png");
}

.concept .inner {
position: relative;
max-width: 1400px;
margin: 0 auto;
text-align: center;
}

.concept h2 {
margin: 0 0 80px;
}

.concept p {
margin: 0 0 48px;
font-size: 16px;
line-height: 3;
}

.concept p span {
font-size: 20px;
font-weight: 500;
vertical-align: baseline;
}

.concept .dl {
margin: 0;
padding: 50px 0 0;
}

.concept .slideBox {
width: 75%;
margin: 0 auto;
padding: 200px 0 0;
letter-spacing: -0.5em;
}

.concept .slideBox .bx-wrapper {
display: inline-block;
width: 30%;
margin: 0 5% 0 0;
letter-spacing: 0;
vertical-align: top;
}

.concept .slideBox .bx-wrapper:last-child {
margin: 0;
}

.concept .slideBox ul {
position: relative;
display: inline-block;
width: 30%;
margin: 0 5% 0 0;
letter-spacing: 0;
vertical-align: top;
overflow: hidden;
}

.concept .slideBox ul:last-child {
margin: 0;
}

.concept .slideBox .bx-wrapper ul {
display: block;
width: 100%;
margin: 0;
overflow: visible;
}

.concept .slideBox ul li {
position: absolute;
}

.concept .slideBox ul li:first-child {
position: relative;;
}

.concept .bg01 {
position: absolute;
top: 196px;
left: 0;
}

.concept .bg02 {
position: absolute;
top: 196px;
right: 0;
}

.concept .bg03 {
position: absolute;
top: 431px;
left: 6.2%;
}

.concept .bg04 {
position: absolute;
top: 431px;
right: 6.2%;
}

.concept .bg05 {
position: absolute;
top: 551px;
left: 26%;
}

.concept .bg06 {
position: absolute;
top: 551px;
right: 26%;
}

.concept ul li .over {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
transition: all 0.3s;
}

.concept ul li:hover .over {
opacity: 1;
transition: all 0.3s;
}


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

.concept .bg01 {
top: 250px;
}

.concept .bg02 {
top: 250px;
}

.concept .bg03 {
top: 481px;
left: 4%;
}

.concept .bg04 {
top: 481px;
right: 4%;
}

.concept .bg05 {
position: absolute;
top: 680px;
left: 13%;
}

.concept .bg06 {
position: absolute;
top: 680px;
right: 13%;
}
}

@media screen and (max-width: 900px) {
.concept .bg01 ,
.concept .bg02 ,
.concept .bg03 ,
.concept .bg04 {
width: 20%;
}

.concept .bg05 ,
.concept .bg06 {
width: 35%;
}
}

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

.kv .sixth {
padding-top:44vw;
}

.kv .sixth img {
width: auto;
}

.concept {
padding: 10% 0 20%;
background: url("/img/concept_bg_01.png");
background-size: 28px;
}

.concept .inner {
max-width: inherit;
width: 90.625%;
}

.concept h2 {
width: 30%;
margin: 0 auto 15%;
}

.concept p {
margin: 0 0 10%;
font-size: 12px;
}

.concept p span {
font-size: 14px;
}

.concept .slideBox {
width: 92%;
padding: 0;
}

.concept .slideBox .bx-wrapper {
display: inline-block;
width: 30%;
margin: 0 5% 0 0;
}

.concept .slideBox .bx-wrapper:last-child {
margin: 0;
}

.concept .dl {
width: 35%;
margin: 0 auto;
padding: 10% 0 0;
}

.concept .ico li {
display: none;
}


}
