@charset "utf-8";



.mb15 {margin-bottom: 15px !important;}
.mb25 {margin-bottom: 25px !important;}
.mb35 {margin-bottom: 35px !important;}
.mb45 {margin-bottom: 45px !important;}
.mb55 {margin-bottom: 55px !important;}
.mb65 {margin-bottom: 65px !important;}

.mb110 {margin-bottom: 110px !important;}
.mb120 {margin-bottom: 120px !important;}
.mb130 {margin-bottom: 130px !important;}
.mb140 {margin-bottom: 140px !important;}
.mb150 {margin-bottom: 150px !important;}
.mb160 {margin-bottom: 160px !important;}
.mb170 {margin-bottom: 170px !important;}
.mb180 {margin-bottom: 180px !important;}
.mb190 {margin-bottom: 190px !important;}
.mb200 {margin-bottom: 200px !important;}

@media screen and (min-width:897px) {
.mbP15 {margin-bottom: 15px !important;}
.mbP25 {margin-bottom: 25px !important;}
.mbP35 {margin-bottom: 35px !important;}
.mbP45 {margin-bottom: 45px !important;}
.mbP55 {margin-bottom: 55px !important;}
.mbP65 {margin-bottom: 65px !important;}
	
.mbP110 {margin-bottom: 110px !important;}
.mbP120 {margin-bottom: 120px !important;}
.mbP130 {margin-bottom: 130px !important;}
.mbP140 {margin-bottom: 140px !important;}
.mbP150 {margin-bottom: 150px !important;}
.mbP160 {margin-bottom: 160px !important;}
.mbP170 {margin-bottom: 170px !important;}
.mbP180 {margin-bottom: 180px !important;}
.mbP190 {margin-bottom: 190px !important;}
.mbP200 {margin-bottom: 200px !important;}
}

@media screen and (max-width:896px) {
.mbS15 {margin-bottom: 15px !important;}
.mbS25 {margin-bottom: 25px !important;}
.mbS35 {margin-bottom: 35px !important;}
.mbS45 {margin-bottom: 45px !important;}
.mbS55 {margin-bottom: 55px !important;}
.mbS65 {margin-bottom: 65px !important;}
	
.mbS110 {margin-bottom: 110px !important;}
.mbS120 {margin-bottom: 120px !important;}
.mbS130 {margin-bottom: 130px !important;}
.mbS140 {margin-bottom: 140px !important;}
.mbS150 {margin-bottom: 150px !important;}
.mbS160 {margin-bottom: 160px !important;}
.mbS170 {margin-bottom: 170px !important;}
.mbS180 {margin-bottom: 180px !important;}
.mbS190 {margin-bottom: 190px !important;}
.mbS200 {margin-bottom: 200px !important;}
}

.mAuto{margin: auto !important;}
@media screen and (min-width:897px) {
.mAutoPC{margin: auto !important;}
}
@media screen and (max-width:896px) {
.mAutoSP{margin: auto !important;}
}

	.w100 {
		width: 100% !important;
	}
	.w90 {
		width: 90% !important;
	}
	.w80 {
		width: 80% !important;
	}
	.w70 {
		width: 70% !important;
	}
	.w60 {
		width: 60% !important;
	}
	.w50 {
		width: 50% !important;
	}
	.w40 {
		width: 40% !important;
	}
	.w30 {
		width: 30% !important;
	}
	.w20 {
		width: 20% !important;
	}
	.w10 {
		width: 10% !important;
	}

.lh11 {
    line-height: 1.1 !important;
}
.lh12 {
    line-height: 1.2 !important;
}
.lh13 {
    line-height: 1.3 !important;
}
.lh14 {
    line-height: 1.4 !important;
}
.lh15 {
    line-height: 1.5 !important;
}
.lh16 {
    line-height: 1.6 !important;
}
.lh17 {
    line-height: 1.7 !important;
}
.lh18 {
    line-height: 1.8 !important;
}
.lh19 {
    line-height: 1.9 !important;
}
.lh20 {
    line-height: 2.0 !important;
}

.lh30 {
    line-height: 3.0 !important;
}
@media only screen and (min-width: 897px) {
.lhP30 {
    line-height: 3.0 !important;
}
}

@media only screen and (min-width: 897px) {
	.flexPcrr {
		flex-direction: row-reverse;
	}
	.wPC100 {
		width: 100% !important;
	}
	.wPC90 {
		width: 90% !important;
	}
	.wPC80 {
		width: 80% !important;
	}
	.wPC75 {
		width: 75% !important;
	}
	.wPC70 {
		width: 70% !important;
	}
	.wPC65 {
		width: 65% !important;
	}
	.wPC60 {
		width: 60% !important;
	}
	.wPC52 {
		width: 52% !important;
	}
	.wPC50 {
		width: 50% !important;
	}
	.wPC42 {
		width: 42% !important;
	}
	.wPC44 {
		width: 44% !important;
	}
	.wPC45 {
		width: 45% !important;
	}
	.wPC46 {
		width: 46% !important;
	}
	.wPC49 {
		width: 49% !important;
	}
	.wPC48 {
		width: 48% !important;
	}
	.wPC47 {
		width: 47% !important;
	}
	.wPC40 {
		width: 40% !important;
	}
	.wPC35 {
		width: 35% !important;
	}
	.wPC32 {
		width: 32% !important;
	}
	.wPC30 {
		width: 30% !important;
	}
	.wPC25 {
		width: 25% !important;
	}
	.wPC20 {
		width: 20% !important;
	}
	.wPC15 {
		width: 15% !important;
	}
	.wPC10 {
		width: 10% !important;
	}
	.wPC270{
		width: 270px !important;
	}
	.wPC300{
		width: 300px !important;
	}
	.hPC55{
		height: 55px;
	}	
	.fzP60{
		font-size: 60px;
	}
	.fzP66{
		font-size: 66px;
	}
	.fzP72{
		font-size: 72px;
	}
	.mbP150{
		margin-bottom: 150px;
	}
	.mtP110{
		margin-top: 110px;
	}
	.mlP35{
		margin-left: 35px;
	}
	.plP70{
		padding-left: 70px;
	}
	.mtP5{
		margin-top: 5px;
}
	
	
	.fzPl22{
		font-size: 22px !important;
	}
	.fzPl12{
		font-size: 12px !important;
	}
}

@media only screen and (max-width: 896px) {
	
	.wSP100 {
		width: 100% !important;
	}
	.wSP90 {
		width: 90% !important;
	}
	.wSP80 {
		width: 80% !important;
	}
	.wSP70 {
		width: 70% !important;
	}
	.wSP65 {
		width: 65% !important;
	}
	.wSP60 {
		width: 60% !important;
	}
	.wSP50 {
		width: 50% !important;
	}
	.wSP40 {
		width: 40% !important;
	}
	.wSP30 {
		width: 30% !important;
	}
	.wSP20 {
		width: 20% !important;
	}
	.wSP10 {
		width: 10% !important;
	}
	.taCSP{
		text-align: center;
	}
	.taLSP{
		text-align: center;
	}
	.fzS60{
		font-size: 60px;
	}
	.mbS100{
		margin-bottom: 100px;
	}
	.mtSP16{
		margin-top: 16px;
	}
	.pbS0{
		padding-bottom: 0 !important;
	}
	.mbS150{
		margin-bottom: 150px;
	}
	.mtS150{
		margin-top: 150px !important;
	
	}
}

/* text-align*/
.taJ {
  text-align: justify !important;
}

@media only screen and (min-width: 897px) {
  .taJPC {
    text-align: justify !important;
  }	
}

@media only screen and (max-width: 896px) {
  .taJSP {
    text-align: justify !important;
  }	
}


/*justify-content*/
.justify-contentS{
	justify-content: start !important;
  }
.justify-contentC{
	justify-content: center !important;
  }

@media only screen and (min-width: 897px) {
.justify-contentSPC{
	justify-content: start !important;
  }
.justify-contentCPC{
	justify-content: center !important;
  }
}

@media only screen and (max-width: 896px) {
.justify-contentSSP{
	justify-content: start !important;
  }
.justify-contentCSP{
	justify-content: center !important;
  }
}



/*---------------------------------
slider slick
---------------------------------*/


    .slider{
        width:100%;
        margin:0 auto;
    }
    .slider img{
        width:100%;
		/*padding:  !important;*/
		/*margin:0 auto;
		padding: 0 10px;*/
    }
    .slider .slick-slide{
        height:auto!important;
		/*width:95%;*/
		padding: 0 5px;
				margin:0 auto;

    }
	.slick-prev:before {
    /*content: '←';*/
		margin-left: -50px;
	}
	.slick-next:before {
    /*content: '→';*/
		margin-left: 20px;

	}
	
	.slick-slide a:hover{
		opacity: 0.7;
	}

	
	
/* Dots */
.slick-dotted.slick-slider
{
    margin-bottom: /*30*/50px;
}

.slick-dots
{
    position: absolute;
    bottom: /*-25*/-35px;

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

    text-align: center;
}
@media screen and (max-width: 896px){
.slick-dots{
	    bottom: -40px;
	}	
}
	
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    font-family: 'slick';
    font-size: /*6*/10px;
    line-height: 20px;

    position: absolute;
    top: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '•';
    text-align: center;

    opacity: .25;
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
    opacity: .75;
    color: /*black*/#b91440;
}

/*
@media screen and (min-width: 897px){
.slick-prev, .slick-next {
	display: none !important;
}
}
*/

@media screen and (min-width: 897px){
.typeB .slick-prev, .typeB .slick-next {
	    top: 33%;
}
	
.typeB .slick-prev:before, .typeB .slick-next:before {
	    background-size: 44px 64px;
}	
	
}

/*---------------------------------
slider slick end
---------------------------------*/


.cardStyle02 .cs02-box:hover img{
opacity: 0.7;
	        -webkit-transition: all .4s;
        transition: all .4s;
}

	.cardStyle02 .cs02-box .overray:after,
	.cardStyle02 .cs02-box:hover .overray:after{
		background: rgba(0, 0, 0, 0);
		
	}


.cardStyle02 .cs02-box .ttl,   
.cardStyle02 .cs02-box .txt{
	color: #000;
}

@media screen and (max-width: 896px){
	.cardStyle02 .cs02-box .txt	{
		width: 70%;
	}
	
}

	.cardStyle02 .cs02-box .linkStyle02_black{
		color: #000;
	}

@media screen and (max-width: 896px){
	.cardStyle02 .cs02-box .linkStyle02_black{
		padding-right: 16px;
	}
}
	.cardStyle02 .cs02-box:hover .linkStyle02_black{
		color: #b91440;
	}
.cardStyle02 .cs02-box .linkElem:after {
    background: url(https://assets.jpn.pioneer/ja/assets/img/icon_arrow01.svg) no-repeat;
    background-size: 8px;
    margin-top: 5px;
    height: 13px;
	padding-bottom: 2px;
}

.cardStyle02 .cs02-box:hover .linkElem:after {
    background: url(https://assets.jpn.pioneer/ja/assets/img/icon_arrow01_r.svg) no-repeat;
    background-size: 8px;
    margin-top: 5px;
    height: 13px;
	padding-bottom: 2px;
}

@media screen and (max-width: 896px){
	.cardStyle02 .cs02-box .linkElem:after,
	.cardStyle02 .cs02-box:hover .linkElem:after{
			padding-bottom: 0px;
		
	}
	
}



@media screen and (max-width: 896px){
	.cardStyle02 .cs02-box{
		/*margin-bottom: 30px;*/
		color: #000;
	}
	
	
}




	
	
.bgGray06 .ttlStyle02:after {
    position: absolute;
    bottom: 0;
    width: 40px;
    height: 1px;
    content: "";
    background: #fff;
    left: 0;
    right: 0;
    margin: auto;
}

/*
@media screen and (min-width: 897px) {
.bgGray06 .ttlStyle02:after {
        width: 60px;
        height: 2px;
    }
}*/

@media screen and (min-width: 897px){
	.fBlackPC{color: #000 !important;}
}

.linkStyle01_white.btnBlack{
    background: #000 !important;
    color: #fff;
    border-color: #000 !important;
}
.linkStyle01_white.btnBlack:hover{
    background: #b91440 !important;
    border-color: #b91440 !important;
}

@media screen and (min-width: 897px){
.linkStyle01_white.btnBlackPC{
    background: #000 !important;
    color: #fff;
    border-color: #000 !important;
}
.linkStyle01_white.btnBlackPC:hover{
    background: #b91440 !important;
    border-color: #b91440 !important;
}
	
}/*min-width: 897px*/


@media screen and (min-width: 897px){
	
#container .mainVisual .swiper-slide.mv_01 .mv-txtBox{
    position: absolute;
    background: none;
    left: /*3.02*/10%;
    width: /*42%*/auto;
    padding: 40px 2% 40px 3%;
	transform: translateY(-60%);

}	
#container .mainVisual .swiper-slide.mv_02 .mv-txtBox{
    position: absolute;
    background: rgba(51, 51, 51, 0.6);
    left: /*3.02*/10%;
    width: /*42%*/auto;
    padding: 40px 2% 40px 3%;
	transform: translateY(-70%);
}
	
#container .mainVisual .swiper-slide.mv_03 .mv-txtBox{
    position: absolute;
    background: none;
    left: /*3.02*/12%;
    width: /*42%*/auto;
    padding: 40px 2% 40px 3%;
	transform: translateY(-55%);
}
	
	#container .mainVisual .swiper-slide.mv_04 .mv-txtBox{
    position: absolute;
    background: none;
    left: /*3.02*/7%;
    width: /*42%*/auto;
    padding: 40px 2% 40px 3%;
	transform: translateY(-60%);
}

	
}/*min-width: 897px*/


	#container .mainVisual .swiper-slide.mv_04 .mv-txtBox .m-txt01{
    font-family: 'Noto Serif JP', serif;

}




@media screen and (min-width:897px) {
.unitStyle05 .cardStyle01 .imgBox{
padding: 0 2px;
}
}

@media screen and (max-width: 896px) {
.unitStyle05.sp-twoCol {
    display: flex;
    flex-wrap: wrap;
}
.unitStyle05.sp-twoCol .us05-box {
    width: 50%;
    padding-top: 3vw;
}
.unitStyle05.sp-twoCol .imgBox {
    padding: 0 5%;
}
.unitStyle05.sp-twoCol .cardStyle01 .cs01-content{
    padding: 2vw 0 0;
}
.unitStyle05.sp-twoCol .cardStyle01 .cs01-content .ttl {
    font-size: 4vw;
    line-height: 1.4;
    padding: 0 0 2vw;
}
.unitStyle05.sp-twoCol .cardStyle01 .cs01-content .txt {
    font-size: 3.6vw;
    line-height: 1.4;
    padding-bottom: 3vw;
}
.unitStyle05.sp-twoCol .cardStyle01 .cs01-content .small.linkStyle01,
.unitStyle05.sp-twoCol .cardStyle01 .cs01-content .small.linkStyle01_black,
.unitStyle05.sp-twoCol .cardStyle01 .cs01-content .small.linkStyle01_white {
    width: 100%;
    font-size: 3vw;
}
}

@media screen and (max-width: 896px) {
.unitStyle05.sp-threeCol {
    display: flex;
    flex-wrap: wrap;
}
.unitStyle05.sp-threeCol .us05-box {
    width: 33%;
    padding-top: 3vw;
}
.unitStyle05.sp-threeCol .imgBox {
    padding: 0 5%;
}
.unitStyle05.sp-threeCol .cardStyle01 .cs01-content{
    padding: 2vw 0 0;
}
.unitStyle05.sp-threeCol .cardStyle01 .cs01-content .ttl {
    font-size: 4vw;
    line-height: 1.4;
    padding: 0 0 2vw;
}
.unitStyle05.sp-threeCol .cardStyle01 .cs01-content .txt {
    font-size: 3.6vw;
    line-height: 1.4;
    padding-bottom: 3vw;
}
.unitStyle05.sp-threeCol .cardStyle01 .cs01-content .small.linkStyle01,
.unitStyle05.sp-threeCol .cardStyle01 .cs01-content .small.linkStyle01_black,
.unitStyle05.sp-threeCol .cardStyle01 .cs01-content .small.linkStyle01_white {
    width: 100%;
    font-size: 3vw;
	padding: 7px 20px 8px 5px;
}
	
.unitStyle05.sp-threeCol .cardStyle01 .cs01-content .linkStyle01.window:after {
    position: absolute;
    content: "";
    width: 15px;
    height: 13px;
    background: url(https://assets.jpn.pioneer/ja/assets/img/icon_window_sp.svg) no-repeat;
    background-size: 13px;
    bottom: 0;
    top: 0;
    right: 5px;
    margin: auto;
}	
}

@media screen and (min-width: 897px) {
    .cardStyle01 .cs01-content .linkStyle01.small {
        padding: 4px 20px 6px 13px;
        width: 160px;
    }
}


@media screen and (min-width:897px) {
	.inner01{
		padding-top: 50px;
		padding-bottom: 50px;
	}
}

@media screen and (max-width:896px) {
	.inner01{
		padding-top: 30px;
		padding-bottom: 30px;
	}
}

@media screen and (min-width:897px) {
	.mBox1of3 .thumbImage > img {
        padding: 0 2px;
	}
}

@media screen and (min-width:897px) {
	.swiper_moreBtn01{
		position: absolute;
		left: 7%;
		bottom: 10%;
	}
	.swiper_moreBtn02{
		position: absolute;
		left: 7%;
		bottom: 10%;
	}	
	.swiper_moreBtn03{
		position: absolute;
		left: 7%;
		bottom: 10%;
	}
	.swiper_moreBtn04{
		position: absolute;
		left: 7%;
		bottom: 10%;
	}	
	
	
}


@media screen and (max-width:896px) {
	.swiper_moreBtn01,
	.swiper_moreBtn02,
	.swiper_moreBtn03,
	.swiper_moreBtn04{
		display: none !important;
			}
}

@media screen and (min-width:897px) {
.mainVisual .linkStyle01{
	background: #fff;
    padding: 6px 30px 7px 10px;
}
.mainVisual .linkStyle01:hover{
	background: #b91440;
}
.mainVisual .linkStyle01.btnBlackPC{
    background: #000 !important;
    color: #fff;
    border-color: #000 !important;
}
.mainVisual .linkStyle01.btnBlackPC:hover{
    background: #b91440 !important;
    border-color: #b91440 !important;
}
.mainVisual .linkStyle01.btnBlackPC.arrow:after {
        right: 20px;
        transition: right .2s;
        width: 9px;
        height: 13px;
        background: url(https://assets.jpn.pioneer/ja/assets/img/icon_arrow01_w.svg) no-repeat;
        background-size: 9px;
    }
.mainVisual .linkStyle01.btnBlackPC.arrow:hover:after {
        right: 15px;
    }	
}


@media screen and (max-width: 896px) {
   .movieArea .cardStyle01 .cs01-content {
        padding: 23px 0 0px;
	   width: 100%;
    }
}

.annotation01{
	font-size: 11px;
	padding-left: 1.0em;
    text-indent: -1.0em;
	line-height: 1.2;
	margin-top: 5px;
}

@media screen and (min-width: 897px) {
  .cardStyle01 .cs01-content {
    padding: 0 /*27*/23px;
  }
}

@media screen and (min-width: 897px) {
  .cardStyle01 .cs01-content .txt {
    /*letter-spacing: .025em;*/
    letter-spacing: 0em;
  }
}

@-moz-document url-prefix() {

}