@charset "UTF-8";

/********************************************


work


**********************************************/

.work .link_btn__list{
	margin:50px 0 60px;
}
.work .link_btn__list li{
	width: 100%;
	margin-bottom:20px;
}
.work .link_btn__list a{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	   -ms-flex-align: center;
	      align-items: center;
	width:100%;
	min-height:100%;
	padding: 30px 100px 30px 40px;
	position:relative;
	text-decoration:underline;
	font-size:2rem;
	font-weight: 600;
	box-shadow: none;
	border: 3px solid;
	-webkit-justify-content: center;
			justify-content: center;
	background: #003894;
	background: -moz-linear-gradient(left, #003894 0%, #00b9ef 100%);
	background: -webkit-linear-gradient(left, #003894 0%,#00b9ef 100%);
	background: linear-gradient(to right, #003894 0%,#00b9ef 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003894', endColorstr='#00b9ef',GradientType=1 );
	color: #FFF;
	box-shadow: 0px 2px 4px rgba(0,0,0,0.18);
}
.work .link_btn__list a::after{
	top:32%;
	right: 20px;
	width: 30px;
	height: 30px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}





.l-work__inner{
	width: 90%;
	margin: 0 auto;
}
.work-overview__container{
	display: flex;
	padding-top: 30px;

	margin-bottom: 6vw;
}
.work__img{
	width: 60%;
}
.work__img img{
	width: 100%;
}
.work__text{
	width: 47%;
	line-height: 2em;
	background: #FFF;
	padding: 4vw 4vw 3vw;
	transform: translate(-7%,7%);
}

.work__text .work__text-title{
	font-size: 1.4rem;
	color: #FFF;
	text-align: center;
	margin-bottom: 2vh;
	background: #003894;
    background: -moz-linear-gradient(left, #003894 0%, #00b9ef 100%);
    background: -webkit-linear-gradient(left, #003894 0%,#00b9ef 100%);
    background: linear-gradient(to right, #003894 0%,#00b9ef 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003894', endColorstr='#00b9ef',GradientType=1 );
} 
.work__text .work__text-read{
	display: inline;
	font-size: 2rem;
	line-height: 2em;
	position: relative;
	background: linear-gradient(transparent 70%, #ffff33 70%);

}
.work__text .work__text-read span{
	display: inline-block;
	font-size: 2.6rem;
	padding: 0 .2em;
}
.work__text p{
	margin-top: 1.5vw;
}


.work-point__container{
	display: flex;
	flex-wrap: wrap;
}
.work-point__container li{
	width: 48%;
	margin-right: 4%;
	margin-bottom: 40px;
}
.work-point__container li.work-point__wide{
	width: 100%;
	margin-right: 0;
}	
.work-point__container li:nth-child(2){
	margin-right: 0;
}
.work-point__container li.w100{
	width: 100%;
}
.work-point__box{
}
.work-point__box dt{
background: #003894; /* Old browsers */
background: -moz-linear-gradient(left,  #003894 0%, #00b9ef 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #003894 0%,#00b9ef 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #003894 0%,#00b9ef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003894', endColorstr='#00b9ef',GradientType=1 ); /* IE6-9 */
	padding: 8px 0;
	font-size: 2rem;
	font-weight: bold;
	color: #FFF;
	text-align: center;
	margin-bottom: 20px;
}
.work-point__box dt span{
	margin-right: 20px;
	font-family: 'Sawarabi Mincho', sans-serif!important;
	font-size: 1.2rem;
	vertical-align: middle;
}
.work-point__box dd {
	min-height: 7vw;
	margin: 20px auto 0;
}
.work-point__box dd.work-point__read{
	color: #4991c6;
	font-size: 2.3rem;
	display: inline;
	min-height: inherit;
	line-height: 1.6em;
	position: relative;
	background: linear-gradient(transparent 70%, #ffff33 70%);
}

.work-point__box dd.img-block{
	width: 100%;
	padding: 3vw 10%;
	background: #DFDFDF;
}
.work-point__box dd.img-keeper{
	width: 100%;
	position: relative;
}
.work-point__box dd.img-keeper .keeper_text{
	position: absolute;
	left: 2%;
	bottom: 5%;
	background: #FFF;
	padding: 5px 20px;
}
.work-point__box dd.img-keeper .keeper_text p{
	display: inline;
	font-size: 2rem;
	line-height: 2em;
	position: relative;
	background: linear-gradient(transparent 70%, #ffff33 70%);

}
.work-point__box dd.img-keeper .keeper_text p span{
	display: inline-block;
	font-size: 2.6rem;
	padding: 0 .2em;
}



.work-point__box dd.img-block img ,
.work-point__box dd.img-keeper img{
	display: block;
	width: 100%;
}

h3.work-point__title {
font-size: 2.3rem;
text-align: center;
padding: 20px 0;
width: 100%;
background: #FFF;
color: #003894;
margin-bottom: 4vw;
position: relative;

}
h3.work-point__title::after {
	content: "";
	width: 100%;
	height: 4px;
background-image: linear-gradient(to right,  #003894 0%,#00b9ef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
position: absolute;
bottom: 0;
left: 0;

}

.work-business__title{
background-image: linear-gradient(to right,  #003894 0%,#00b9ef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
background-repeat: no-repeat;
background-size: 100% 10%;
background-position: bottom;
font-size: 2.2rem;
padding: 15px 5px;
margin-bottom: 40px;
color: #003894;

}
.work-business__container{
	margin-bottom: 40px;
}
.work-business__container li{
	margin-bottom: 40px;
	border-bottom: 1px dotted #666;
	padding:0 5px 40px;
}
.work-business__box{
	display: flex;
	align-items: center;
}
.work-business__box dt{
	width: 32%;
	margin-right: 2%;
	font-size: 2.2rem;
	display: flex;
	align-items: center;
}
.work-business__box dt span{
	font-size: 3.5rem;
	color: #003894;
	font-family: 'Sawarabi Mincho', sans-serif!important;
	margin-right: 1em;
}
.work-business__box dd{
	width: 66%;
}
.work .l-main-visual {
margin-bottom: 115px;
}
.work h2.main-visual__title {
/*	display: flex;
	justify-content: center;
	align-items: center;*/
	position: absolute;
	top: 500px;
	left: 0;
	background: #4991C6;
	color: #FFF;
	font-family: 'd-din_condensedregular';
	font-weight: bold;
	font-size: 3rem;
	width: 100%;
	height: 115px;
	padding-bottom: 0;
	border-bottom: none;
	text-align: center;
}
.work h2.main-visual__title span {
	font-size: 1.6rem;
}
.qualification{
	display: flex;
	margin-top: 1em;
}
.qualification span{
	display: flex;
	align-items: center;
	justify-content: center;
	background: #4991C6;
	color: #FFF;
	padding: 5px;
	font-weight: bold;
	margin-right: 3%;
	width: 17%;
}
.qualification p{
	width: 80%;
}
.work-point__box{
	margin-bottom: 10px;
}
.w100 .work-point__box{
	width: 100%;
}
.w100 .work-point__box dd img{
	width: 100%;
}
.w100 .work-point__box dd{
	margin-bottom: 30px;
}

/*work03*/

ul.consumer-interview__container{
    display: flex;
    padding: 50px 30px 30px;
    margin-bottom: 40px;
    background:#fff
}

ul.consumer-interview__container .consumer-interview-name__box {
    padding: 0 0 20px;
    width: 28%;
    margin-right: 4%;
    min-height: 200px;
    color: #0079c1;
    font-weight: 700;
    font-size: 1.4rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    line-height:1em
}

ul.consumer-interview__container .consumer-interview-name__box span {
    display: inline-block;
    padding: 2px 5px;
    line-height: 1em;
    background:#fff
}

ul.consumer-interview__container .consumer-interview-name__box span.interview-picktitle {
    font-size: 1.5rem;
    letter-spacing: .05em;
    font-weight: 600;
    margin:0 0 .2em
}

ul.consumer-interview__container .consumer-interview-name__box span.interview-picktitle.smallsize {
    font-size: 1.2rem;
    margin-top:.6em
}

ul.consumer-interview__container .consumer-interview-name__box span.interview-name {
    font-size: 1.3rem;
    font-weight: 600;
    margin:.4em 0 0
}

ul.consumer-interview__container .consumer-interview-name__box span.interview-prof {
    font-size: 1.2rem;
    margin:0 0 .1em
}

ul.consumer-interview__container .consumer-interview-name__box span.interview-prof.prof-top {
    margin:.8em 0 .1em
}


ul.consumer-interview__container .consumer-interview-text__box {
    width: 68%;
    display: flex;
    -webkit-align-items: center;
    align-items:center
}

ul.consumer-interview__container .consumer-interview-text__box dt {
    color: #0079c1;
    font-weight: 600;
    font-size: 2rem;
    margin-bottom: .7em;
    line-height:1.7em
}

ul.consumer-interview__container .consumer-interview-text__box dd {
    font-size: 1.4rem;
    line-height:1.8em
}

ul.consumer-interview__container .consumer-interview-text__box dd.subtitle {
    color: #0079c1;
    font-weight: 600;
    font-size: 1.5rem;
    margin:.7em 0 .2em
}





ul.consumer-interview__container.reparing-interview {
    background: #fff no-repeat 5% 30px;
    background-size:contain;

}

ul.consumer-interview__container.reparing-interview.is-show {

    background-size:contain;
    transition:3s all ease 3s;
    animation: key-fadeIn 3s forwards;

}

@keyframes key-fadeIn {
    0% {
    	background: #FFF;
    }
    60% {
    	background: #fff url(../work/images/repairing-interview-img.jpg) no-repeat;
    	background-size:contain;
    }
    100% {
    	background: #fff url(../work/images/repairing-interview-img.jpg) no-repeat;
    	background-size:contain;
    }
}

ul.consumer-interview__container.reparing-interview .consumer-interview-text__box dd {
    font-size: 1.3rem;
    line-height:1.6em
}

ul.consumer-interview__container.reparing-interview .consumer-interview-text__box dd.subtitle {
    color: #0079c1;
    font-weight: 600;
    font-size: 1.5rem;
    margin:.7em 0 .2em
}

ul.consumer-interview__container.inspection-interview {
    background: #fff 2% 40px;
    background-size:contain
}
 
ul.consumer-interview__container.inspection-interview.is-show{
/*    background: #fff url(../consumer/images/inspection-interview-img.jpg) no-repeat 2% 40px;*/
    background-size:contain
}

ul.consumer-interview__container.inspection-interview .consumer-interview-text__box dd {
    font-size: 1.3rem;
    line-height:1.6em
}

ul.consumer-interview__container.inspection-interview .consumer-interview-text__box dd.subtitle {
    color: #0079c1;
    font-weight: 600;
    font-size: 1.5rem;
    margin:.7em 0 .2em
}


/* -- Media query	767px以下の場合 スマートフォン設定------------*/

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




/*	.l-work__inner{
		width: 90%;
		margin: 0 auto;
	}*/
	.work-overview__container{
		/*display: flex;*/
		flex-wrap: wrap;
/*		padding-top: 30px;
		margin-bottom: 40px;*/
	}
	.work__img{
		width: 100%;
		margin-right: 0;
	}
	.work__img img{
		width: 100%;
	}
	.work__text{
		width: 100%;
	line-height: 2em;
	background: #FFF;
	padding: 4vw 8vw 3vw;
	transform: translate(0);
	}
	.work__text .work__text-read{
		display: inline;
		font-size: 1.6rem;
		line-height: 2em;
		position: relative;
		background: linear-gradient(transparent 70%, #ffff33 70%);
	
	}	
/*	.work__text span{
		display: block;
		color: #4991c6;
		font-size: 2rem;
		margin-bottom: 20px;
	}*/
	.work-point__container{
		/*display: flex;*/
		flex-wrap: wrap;
		/*margin-bottom: 40px;*/
	}
	.work-point__container li{
		width: 100%;
		margin-right: 0;
	}
/*	.work-point__container li:last-child{
		margin-right: 0;
	}*/
/*	.work-point__container li.w100{
		width: 100%;
	}*/
/*	.work-point__box dt{
	background: #003894;
	background: -moz-linear-gradient(left,  #003894 0%, #00b9ef 100%);
	background: -webkit-linear-gradient(left,  #003894 0%,#00b9ef 100%);
	background: linear-gradient(to right,  #003894 0%,#00b9ef 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003894', endColorstr='#00b9ef',GradientType=1 );
		padding: 5px;
		font-size: 2rem;
		font-weight: bold;
		color: #FFF;
		text-align: center;
		margin-bottom: 20px;
	}*/
/*	.work-point__box dt span{
		margin-right: 20px;
		font-family: 'Sawarabi Mincho', sans-serif!important;
		font-size: 1.4rem;
		vertical-align: middle;
	}*/
/*	.work-point__box dd span{
		display: block;
		color: #4991c6;
		font-size: 2rem;
		margin-bottom: 10px;
	}*/

	.work-point__box dd img{
		width: 100%;
		/*margin-top: 40px;*/
	}

/*	.img-right {
		text-align: right;
	}*/

h3.work-point__title {
font-size: 1.8rem;
text-align: center;
padding: 20px;
width: 100%;
background: #FFF;
color: #003894;
margin-bottom: 4vw;
position: relative;

}

/*	.work-business__title{
	background-image: linear-gradient(to right,  #003894 0%,#00b9ef 100%);
	background-repeat: no-repeat;
	background-size: 100% 10%;
	background-position: bottom;
	font-size: 2rem;
	padding-bottom: 10px;
	margin-bottom: 40px;
	color: #003894;
	font-weight: bold;
	}*/
/*	.work-business__container{
		margin-bottom: 40px;
	}*/
/*	.work-business__container li{
		margin-bottom: 40px;
		border-bottom: 1px dotted #666;
		padding-bottom: 40px;
	}*/
	.work-business__box{
		/*display: flex;*/
		flex-wrap: wrap;
	}
	.work-business__box dt{
		width: 100%;
		margin-right: 0;
		/*font-size: 2rem;*/
		margin-bottom: 1em;
	}
	.work-business__box dt span{
/*		font-size: 3rem;
		color: #003894;
		font-family: 'Sawarabi Mincho', sans-serif!important;*/
		margin-right: 0;
	}
	.work-business__box dd{
		width: 100%;
	}
/*	.work .l-main-visual {
		margin-bottom: 115px;
	}*/
	.work h2.main-visual__title {
		position: absolute;
		top: 30vh;
		left: 0;
		background: #4991C6;
		color: #FFF;
		font-family: 'd-din_condensedregular';
		font-weight: bold;
		font-size: 2rem;
		width: 100%;
		height: 115px;
		padding-bottom: 0;
		border-bottom: none;
		text-align: center;
	}
/*	.work h2.main-visual__title span {
		font-size: 1.6rem;
	}*/
/*	.qualification{
		display: inline-block;
		background: #4991C6;
		color: #FFF;
		padding: 5px;
		margin-top: 10px;
		font-weight: bold;
	}*/
	.qualification{
		display: block;
	}
	.qualification span{
		width: auto;
	}
/*	.work-point__box{
		margin-bottom: 50px;
	}*/


.work h2.main-visual__title {
	font-family: 'd-din_condensedregular';
	font-weight: bold;
	/*order: 2;*/
	font-size: 2.1rem;
	letter-spacing: 0;
	top: auto;
	bottom: -10vh;
	margin-bottom: 0;
}
.work-point__box dd.img-keeper .keeper_text{
	position: relative;
	left: 0;
	bottom: inherit;
	background: #FFF;
	padding: 5px 20px 10px;
}
.work-point__box dd.img-keeper .keeper_text p{
	display: inline;
	font-size: 1.8rem;
	line-height: 2em;
	position: relative;
	background: linear-gradient(transparent 70%, #ffff33 70%);

}
.work-point__box dd.img-keeper .keeper_text p span{
	display: inline-block;
	font-size: 2.2rem;
	padding: 0 .2em;
}



.qualification p{
	width: 100%;
	font-size: 1.3rem;
	line-height: 1.8em;
}



/*work03*/

.work04 ul.consumer-interview__container{
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -ms-flex-direction: column;
           flex-direction: column;
    padding:30px;
    margin-bottom: 40px;
    background:#fff;
}

.work04 ul.consumer-interview__container .consumer-interview-name__box {
    padding: 20px 0 20px;
    width: 100%;
    margin-right:0;
    min-height: auto;
    color: #0079c1;
    font-weight: 700;
    font-size: 1.4rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    line-height:1em;
    order:2;
    position: relative;
}
.work04 ul.consumer-interview__container .consumer-interview-name__box::before{
	content:"";
	width: 100%;
	padding-top: 200%;
	background: #fff url(../work/images/repairing-interview-img.jpg) no-repeat;
	-webkit-background-size: 80%;
	     -o-background-size: 80%;
	        background-size: 80%;
	margin-bottom: -50px;
}

/*
ul.consumer-interview__container .consumer-interview-name__box span {
    display: inline-block;
    padding: 2px 5px;
    line-height: 1em;
    background:#fff
}

ul.consumer-interview__container .consumer-interview-name__box span.interview-picktitle {
    font-size: 1.5rem;
    letter-spacing: .05em;
    font-weight: 600;
    margin:0 0 .2em
}

ul.consumer-interview__container .consumer-interview-name__box span.interview-picktitle.smallsize {
    font-size: 1.2rem;
    margin-top:.6em
}
*/
ul.consumer-interview__container .consumer-interview-name__box span.interview-name {
    font-size: 2.4rem;
    font-weight: 600;
    margin:.4em 0 0
}
ul.consumer-interview__container .consumer-interview-name__box span.interview-prof {
    font-size: 1.2rem;
    margin:0;
}

ul.consumer-interview__container .consumer-interview-name__box span.interview-prof.prof-top {
    margin:0;
}

ul.consumer-interview__container .consumer-interview-text__box {
    width: 100%;
    display: flex;
    -webkit-align-items: center;
    align-items:center;
    order:1;
}
/*
ul.consumer-interview__container .consumer-interview-text__box dt {
    color: #0079c1;
    font-weight: 600;
    font-size: 2rem;
    margin-bottom: .7em;
    line-height:1.7em
}

ul.consumer-interview__container .consumer-interview-text__box dd {
    font-size: 1.4rem;
    line-height:1.8em
}

ul.consumer-interview__container .consumer-interview-text__box dd.subtitle {
    color: #0079c1;
    font-weight: 600;
    font-size: 1.5rem;
    margin:.7em 0 .2em
}



*/

ul.consumer-interview__container.reparing-interview {
    background: #fff url(../work/images/repairing-interview-img.jpg) no-repeat 5% 30px;
    background-image: none;
    background-size:contain;
    display: flex;
    -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
/*
ul.consumer-interview__container.reparing-interview .consumer-interview-text__box dd {
    font-size: 1.3rem;
    line-height:1.6em
}

ul.consumer-interview__container.reparing-interview .consumer-interview-text__box dd.subtitle {
    color: #0079c1;
    font-weight: 600;
    font-size: 1.5rem;
    margin:.7em 0 .2em
}

ul.consumer-interview__container.inspection-interview {
    background: #fff url(../consumer/images/inspection-interview-img.jpg) no-repeat 2% 40px;
    background-size:contain
}

ul.consumer-interview__container.inspection-interview .consumer-interview-text__box dd {
    font-size: 1.3rem;
    line-height:1.6em
}

ul.consumer-interview__container.inspection-interview .consumer-interview-text__box dd.subtitle {
    color: #0079c1;
    font-weight: 600;
    font-size: 1.5rem;
    margin:.7em 0 .2em
}*/

}



/********************************************


work04


**********************************************/


.dance-main-visual{
	width: 100%;
	display: block;
	position:relative;
	background: url("../work/images/dance-main-visual.jpg")no-repeat center center;
	background-size: cover;
	height: 100vh;
	z-index:0;
}

.dance-main-visual::after{
	content:'';
	position:absolute;
	background: linear-gradient(180deg,rgba(84,180,231,1) 0,rgba(20,59,141,1) );
	height: 100%;
	width: 20px;
	top:0;
	left:0;
	z-index:-1;
}
.dance-main-visual::before{
	content:'';
	position:absolute;
	background: url("../work/images/dance-main-dot.png")no-repeat center center;
	background-size: cover;
	height: 100%;
	width: 50%;
	top:0;
	left:0;
	z-index:-1;
}

dl.dance-main-visual-box{
	width: 100%;
	display: flex;
	height: 100%;
}
dl.dance-main-visual-box dt{
	width: 50%;
	position:relative;
}
dl.dance-main-visual-box dt {
	width: 50%;
	position:relative;
	display: block;
}
dl.dance-main-visual-box dd{
	width: 50%;
	position:relative;
	display: flex;
	flex-direction: column;
	justify-content:right;
}

.dance-main-visual-title-en{
	width: 90%;
	margin-bottom: 8vh;
	z-index:1;
}
.dance-main-visual-title-en{
}

h2.dance-main-visual-title{
	color: #FFF;
	font-size: 3rem;
	font-weight: 700;
	margin-left: 5vw;
}

.dance-movie-btn{
	width: 250px;
	height: 70px;
	color: #FFF;
	margin-right: 0;
	border-radius: 50px 0px 0px 50px;
	font-size: 1.7rem;
	font-weight: 600;
	display: flex;
	position:relative;
	align-items:center;
	margin-top: 10vh;
	margin-right: 0;
	margin-left: auto;
	background: linear-gradient(90deg,rgba(84,180,231,1) 0,rgba(20,59,141,1) );
}
.dance-movie-btn p{
	display: block;
}
.dance-movie-btn::after{
	content:'';
	position: absolute;
	height: 60px;
	width: 60px;
	top:5px;
	left:5px;
	background: url("../work/images/movie-btn.svg")no-repeat center center;
	z-index:0;

}
.dance-movie-btn:hover{
	opacity:.6;
}

img.logo{
	position:absolute;
	width: 30%;
	bottom:-2%;
	right:10%;
}

dl.dance-team-logo{
	width: 100%;
	display: flex;
	padding: 6vh 0;
}

dl.dance-team-logo dt{
	width: 50%;
}
dl.dance-team-logo dt img{
	width: 100%;
}

dl.dance-team-logo dd{
	width: 50%;
	display: block;
}

h6.team-info-title{
	background: linear-gradient(90deg,rgba(84,180,231,1) 0,rgba(20,59,141,1) );
	width: 100%;
	color: #FFF;
	margin-bottom: 4vh;
	padding: 25px 20px 20px;
	font-size: 3.5rem;
	font-weight: 600;
	line-height:2.3rem;
}
h6.team-info-title span{
	font-size: 1.4rem;
	letter-spacing:10px;
}


dl.dance-team-imfo{
	width: 100%;
	color: #003893;
	padding-left: 35px;
	padding-right: 20%;
	position:relative;
}

dl.dance-team-imfo::before{
	content:'POINT!';
	color: #003893;
	position:absolute;
	height: 40%;
	width: 30px;
	font-weight: 600;
	left:-10px;
	top:0;
	writing-mode: vertical-rl;
}
dl.dance-team-imfo::after{
	content:'';
	border-left:1px solid #003893;
	position:absolute;
	height: 60%;
	width: 30px;
	font-weight: 600;
	left:5px;
	bottom:0;
	writing-mode: vertical-rl;
}

dl.dance-team-imfo dt{
	width: 100%;
	font-size: 2rem;
	margin-bottom: 1.5vh;
}

dl.dance-team-imfo dd{
	width: 100%;
}

.dance-green{
	background: #52caba;
	width: 100%;
	padding: 10vh 10%;
	display: flex;
	flex-wrap:wrap;
	overflow: hidden;
}


h6.dance-topic-title{
	color: #FFF;
	text-align:center;
	font-size: 3rem;
	margin-bottom: 10vh;
	position:relative;
	width: 100%;
}
h6.dance-topic-title::after{
	content:'';
	position:absolute;
	width: 60px;
	height: 2px;
	background: #FFF;
	bottom: -1.5vh;
	left:50%;
	transform:translateX(-50%);
}
h6.dance-topic-title.black::after{
	background: linear-gradient(90deg,rgba(84,180,231,1) 0,rgba(20,59,141,1) );
}
.interview-text-box{
	width: 60%;
	color: #FFF;
	margin: 20vh 0 40vh 0;
	z-index:1;
}

.interview-text-box:nth-child(2n-1){
	margin: 20vh 0 20vh 0;
}

.interview-text-box dl dt{
	font-size: 2.3rem;
	font-weight: 600;
	margin-bottom: 1.5rem;
}

.interview-text-box dl dd{
	line-height:3rem;
	margin-bottom: 5vh;
}

p.dance-profire{
	display: inline-block;
	background: #000;
	padding: 2px 14px;
}

.dia-img-box{
	width: 40%;
}

.interview-dia-img-big{
	width: 600px;
	height: 600px;
	background: #c8c8c8;
	transform:rotate(45deg);
	z-index:-1;
	overflow:hidden;
}

.interview-dia-img-small{
	width: 400px;
	height: 400px;
	margin-left: -18%;
	transform:rotate(45deg);
	background: #c8c8c8;
	overflow:hidden;
}
.interview-dia-img-big img{
	width: 142%;
	transform:rotate(-45deg)translateY(-21%);
}
.interview-dia-img-small img{
	width: 142%;
	transform:rotate(-45deg)translateY(-21%);
}
.dance-black{
	background: #000;
	padding: 10vh 0;
	display: flex;
	flex-wrap:wrap;
	justify-content:center;
	overflow: hidden;
}


.slider-section{
	width: 120%;
	display: flex;
}

ul.slider-box{
	width: 100%;
	display: flex;
	overflow:hidden;
}
ul.slider-box li{
	width: 300px;
	background: #FFF;
	height: auto;
	opacity:.6;
	margin-bottom: 10vh;
}
ul.slider-box li:hover{
	opacity:1;
}
ul.slider-box li img{
	width: 100%;
}

.slick-slide .photo {
  width: 18.5vw;
  overflow: hidden;
  position: relative;
}

.slick-slide .photo img {
  width: 100%;
  background: #FFF;
  margin: auto;
}

.three-photos .slick-slide .photo {
  width: 18.5vw;
}


.center { margin: 0 0 50px;}
.center img { width: 100%; height: auto;}
.center .slick-next { right: 20px; z-index: 99;}
.center .slick-prev { left: 15px; z-index: 100;}



*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
.content{
    margin: 0 auto;
    padding: 40px;
}
.modal{
    display: none;
    height: 100vh;
    position: fixed;
    top: 0;
    width: 100%;
}
.modal__bg{
    background: rgba(0,0,0,0.8);
    height: 100vh;
    position: absolute;
    width: 100%;
}
.modal__content{
    background: #000;
    left: 50%;
    padding: 40px;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 80%;
}
.modal__content iframe{
	width: 100%;
}


a.js-modal-open{
	display: block;
	color: #FFF;
	width: 100%;
	padding-left: 80px;
	z-index:2;
}


.bg-dia01{
	width: 100%;
	position:relative;
	height: 10px;
}
.bg-dia01::before{
	position:absolute;
	content:'';
	background: url("../work/images/bg-dia-dot.svg")no-repeat center center;
	background-size: cover;
	width: 650px;
	height: 650px;
	left:-200px;
	top:-150px;
}
.bg-dia01::after{
	position:absolute;
	content:'';
	border:1px solid #000;
	background-size: cover;
	width: 250px;
	height: 250px;
	right:10%;
	top:-60px;
	transform:rotate(45deg);
}

.bg-dia02{
	width: 100%;
	position:relative;
	height: 10px;
}
.bg-dia02::before{
	position:absolute;
	content:'';
	background: url("../work/images/bg-dia-dot.svg")no-repeat center center;
	background-size: cover;
	width: 600px;
	height: 600px;
	right:0px;
	bottom:-800px;
}
.bg-dia02::after{
	position:absolute;
	content:'';
	border:1px solid #FFF;
	background-size: cover;
	width: 600px;
	height: 600px;
	right:-100px;
	bottom:-1000px;
	transform:rotate(45deg);
}

.bg-dia03{
	width: 100%;
	position:relative;
	height: 10px;
	z-index:10;
}
.bg-dia03::after{
	position:absolute;
	content:'';
	background: rgba(250, 250, 250, .5);
	width: 150px;
	height: 150px;
	right:2%;
	top:-17vh;
	transform:rotate(45deg);
}
.bg-dia03::before{
	position:absolute;
	content:'';
	background: rgba(250, 250, 250, .5);
	width: 100px;
	height: 100px;
	left:-80px;
	bottom:-0px;
	transform:rotate(45deg);
}

.bg-dia04{
	width: 100%;
	position:relative;
	height: 10px;
}
.bg-dia04::after{
	position:absolute;
	content:'';
	border:1px solid #000;
	background-size: cover;
	width: 250px;
	height: 250px;
	right:50px;
	top:-60px;
	transform:rotate(45deg);
}
.bg-dia04::before{
	position:absolute;
	content:'';
	border:1px solid #FFF;
	background-size: cover;
	width: 300px;
	height: 300px;
	left:-60px;
	top:-400px;
	transform:rotate(45deg);
	z-index:0;
}



.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
}
.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    margin-left: auto;
    margin-right: auto;
}


.interview-content-box{
	display: flex;
	width: 100%;
	-webkit-flex-direction: row;
	    -ms-flex-direction: row;
	        flex-direction: row;
}

.interview-content-box.right {
	-webkit-flex-direction: row-reverse;
	    -ms-flex-direction: row-reverse;
	        flex-direction: row-reverse;
}

/* -- Media query	767px以下の場合 スマートフォン設定------------*/

@media screen and (max-width: 768px ) {
dl.dance-main-visual-box{
	display: block;
	flex-wrap:wrap;
}
dl.dance-main-visual-box dt{
	width: 100%;
}
dl.dance-main-visual-box dd{
	width: 100%;
}

dl.dance-team-logo{
	display: block;
}
dl.dance-team-logo dt{
	width: 100%;
	margin-bottom: 1rem;
}
dl.dance-team-logo dd{
	width: 100%;
}


.interview-text-box{
	width: 100%;
	order:2;
	margin: 5vh 0 5vh 0;
	z-index:1;
}
.dia-img-box{
	width: 100%;
	order:1;
	    overflow: unset;
}

img.logo{
	bottom:-100%;
}

h2.dance-main-visual-title{
	font-size: 2.5rem;
}


h6.team-info-title{
	width: 80%;
	margin: 0 auto 2rem	;
	font-size: 3.3rem;
	line-height:4.4rem;
}
h6.team-info-title span{
	font-size: 5px;
	letter-spacing:7px;
	line-height:0.4rem;
}

dl.dance-team-imfo{
	width: 80%;
	margin:0 auto;
	color: #003893;
	padding-left: 0;
	padding-right: 0;
	padding-top: 30px;
	position:relative;
}

dl.dance-team-imfo::before{
	content:'POINT!';
	color: #003893;
	position:absolute;
	height: 40%;
	width: 30px;
	font-weight: 600;
	left:0;
	top:0;
	writing-mode: horizontal-tb;
}
dl.dance-team-imfo::after{
	content:'';
	display: none;
	border-left:0px solid #003893;
	border-bottom: 1px solid #003893;
	position:absolute;
	height: 1px;
	width: 60%;
	font-weight: 600;
	left:90px;
	bottom:0;
	writing-mode: vertical-rl;
}

.interview-dia-img-big {
    width: 300px;
    height: 300px;
}
.interview-dia-img-big img{
}

.interview-dia-img-small{
	width: 300px;
	height: 300px;
	margin-left: 0;
}

.modal__content{
	width: 100%;
	z-index:200;
}
.modal__content iframe {
    height: 100%;
    width: auto;
}

.interview-content-box{
	display: flex;
	width: 100%;
	-webkit-flex-direction: column;
	    -ms-flex-direction: column;
	        flex-direction: column;
}

.interview-content-box.right {
	-webkit-flex-direction: column;
	    -ms-flex-direction: column;
	        flex-direction: column;
}




.bg-dia01{
	width: 100%;
	position:relative;
	height: 10px;
}
.bg-dia01::before{
	position:absolute;
	content:'';
	background: url("../work/images/bg-dia-dot.svg")no-repeat center center;
	background-size: cover;
	width: 400px;
	height: 400px;
	left:-200px;
	top:-100px;
}
.bg-dia01::after{
	position:absolute;
	content:'';
	border:1px solid #000;
	background-size: cover;
	width: 140px;
	height: 140px;
	right:-4%;
	top:-30px;
	transform:rotate(45deg);
}

.bg-dia02{
	width: 100%;
	position:relative;
	height: 10px;
}
.bg-dia02::before{
	position:absolute;
	content:'';
	background: url("../work/images/bg-dia-dot.svg")no-repeat center center;
	background-size: cover;
	width: 400px;
	height: 400px;
	right:0px;
	bottom:-800px;
}
.bg-dia02::after{
	position:absolute;
	content:'';
	border:1px solid #FFF;
	background-size: cover;
	width: 200px;
	height: 200px;
	right:-100px;
	bottom:-1000px;
	transform:rotate(45deg);
}

.bg-dia03{
	width: 100%;
	position:relative;
	height: 10px;
	z-index:10;
}
.bg-dia03::after{
	position:absolute;
	content:'';
	background: rgba(250, 250, 250, .5);
	width: 50px;
	height: 50px;
	right:2%;
	top:5vh;
	transform:rotate(45deg);
}
.bg-dia03::before{
	position:absolute;
	content:'';
	background: rgba(250, 250, 250, .5);
	width: 60px;
	height: 60px;
	left:5px;
	bottom:150vh;
	transform:rotate(45deg);
}

.bg-dia04{
	width: 100%;
	position:relative;
	height: 10px;
}
.bg-dia04::after{
	position:absolute;
	content:'';
	border:1px solid #000;
	background-size: cover;
	width: 250px;
	height: 250px;
	right:-50px;
	top:-300px;
	transform:rotate(45deg);
}
.bg-dia04::before{
	position:absolute;
	content:'';
	border:1px solid #FFF;
	background-size: cover;
	width: 100px;
	height: 100px;
	left:-20px;
	top:-1100px;
	transform:rotate(45deg);
	z-index:0;
}


.dance-main-visual{
	margin-top: 60px;
}









}