/*================================================================================
socialmedia style
================================================================================*/

/*common
------------------------------------------------*/
@media only screen and (min-width: 897px) {
	.wPC100 {
		width: 100% !important;
	}
	.wPC90 {
		width: 90% !important;
	}
	.wPC80 {
		width: 80% !important;
	}
	.wPC70 {
		width: 70% !important;
	}
	.wPC60 {
		width: 60% !important;
	}
	.wPC50 {
		width: 50% !important;
	}
	.wPC40 {
		width: 40% !important;
	}
	.wPC30 {
		width: 30% !important;
	}
	.wPC20 {
		width: 20% !important;
	}
	.wPC10 {
		width: 10% !important;
	}
}

@media only screen and (max-width: 896px) {
	.wSP100 {
		width: 100% !important;
	}
	.wSP90 {
		width: 90% !important;
	}
	.wSP80 {
		width: 80% !important;
	}
	.wSP70 {
		width: 70% !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;
	}
}


@media only screen and (min-width: 897px) {
.mtP110{margin-top: 110px}
.mtP120{margin-top: 120px}
.mtP130{margin-top: 130px}
.mtP140{margin-top: 140px}
.mtP150{margin-top: 150px}
}
@media only screen and (max-width: 896px) {
.mtS110{margin-top: 110px}
.mtS120{margin-top: 120px}
.mtS130{margin-top: 130px}
.mtS140{margin-top: 140px}
.mtS150{margin-top: 150px}
}

/*mainVisual
------------------------------------------------*/
#container .mv-txtBox .m-txt01 {
    line-height: 1.8 !important;
}

@media only screen and (max-width: 896px) {
#container .blur.smallH {
    height: 120px;
}
#container .mv-txtBox.smallH, #container .mv-txtBox_right {
    height: 120px;
	padding:20px 18px 20px;
}
}

@media screen and (min-width: 897px){
#container .mainVisual.white .mv-txtBox {
    background: rgba(255, 255, 255, 0.96);
}
}

.t-attention {
    color: #000;
}

@media only screen and (max-width: 896px){
#container .blur.smallH {
    height: 140px;
}
#container .mv-txtBox.smallH {
    height: 140px;
    padding: 20px 18px 20px;
}

}


/* 実施中・実施予定
------------------------------------------------*/
/*@media screen and (min-width: 897px){
.boxStyle01 a {
    padding: 0 0 25px;
	}
}
@media screen and (max-width: 896px){
.boxStyle01 {
    padding: 0 4% 25px;
	}
}
	
.boxStyle01 .ttl {
    min-height: 4em;
	line-height: 1.5em;
}
@media screen and (max-width: 896px){
.boxStyle01 .ttl {
    min-height: 100px;
}}
@media screen and (min-width: 897px){
.boxStyle01 .link {
    bottom: 0px;
}
}
.period {
padding: 15px 0 15px;
}
@media screen and (max-width: 896px){
.period {
	font-size: 12px;
	margin: 0;
}
}*/

/* 上部ピックアップ
------------------------------------------------*/
.linkStyle02_black:after{
background: url(https://assets.jpn.pioneer/ja/assets/img/icon_arrow_down01.svg) no-repeat;
    width: 11px;
}
@media screen and (min-width: 897px){
.linkHoverStyle03:not(.cs02-box):not(.cs02-box_black):hover .linkStyle02_black:not(.window):not(.window_red):after {
background: url(https://assets.jpn.pioneer/ja/assets/img/icon_arrow_down01.svg) no-repeat;
    width: 11px;
	-webkit-transform: translate3D(0, 0, 0); 
    transform: translate3D(0, 0, 0);
}
}

/* 詳しい内容
------------------------------------------------*/
@media screen and (min-width: 897px){
dt img{
width: 93% !important;
height: auto;
margin: 5px 0;
}
}
@media screen and (max-width: 896px){
dt img{
max-width: 100% !important;
height: auto;
margin: 5px auto;
display: block;
}
}
.border_dotted_pec {
    border-top: 1px dotted #cccccc;
}
.border_solid_pec {
    border-top: 1px solid #c8c8c8;
}

.module_pec a {
    text-decoration: none;
}

.module_pec a.arrow_pec {
    background: url(/assets/img/icon_arrow_op.png) left no-repeat;
    padding: 2px 0 0 12px !important;
}

.module_pec a.blank_pec {
    background: url(/assets/img/icon_blank_op.png) no-repeat left;
    padding-left: 13px;
    margin-left: -1px;
}


@media screen and (min-width: 897px){
/* reset.css 追記 */
.clearfix_pec:after{
	overflow:hidden;	
}
em{font-style:normal;}
.fl_pec{float:left;}
.fr_pec{float:right;}
.border_pec{border:1px solid #ccc; padding:2px;}
ul{list-style:none;}
ol{margin:10px 0 10px 35px;}

.module_pec {
    padding-top: 60px !important;
	font-size: 1.1em;
	border-top:1px solid #333 !important;
}

.grid3_pec .module_pec:first-child{
	border-top: none !important;
}

.grid3_pec {
    width: 90%;
	margin: 0px auto 50px;
}

/*div.border_solid_pec{
	border-top:1px solid #333 !important;
}*/
.module_pec dl dt{/*20191009*/
	float:left;
	width:12em;
	margin-bottom:8px;
	padding-top:8px;
	font-weight:bold;
}
.module_pec dl dd{/*20191009*/
	margin:0 0 8px 12em;
	padding-top:8px;
}
#container p.finish_pec{
	border:1px solid #B91440;
	padding:2px 4px;
	color:#B91440;
	text-align:center;
	margin-bottom:15px;
}
#container p.mark_pec,
#container p.mark_cam_pec{
	text-align:right;
	margin-bottom:5px;
	color: #fff;
}

/*
#container p.mark_left_pec,
#container p.mark_left_cam_pec{
	text-align:left;
	margin-bottom:5px;
}
*/

/* イベントマーク */
.mark_pec span,
.mark_left_pec span{
	background:#000;
	padding:2px 20px;
	color:#fff;
	font-size:11px;
	border-radius:2px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	display:inline-block;
	text-align:center;
	min-width:120px;
}
/* キャンペーンマーク */
.mark_cam_pec span,
.mark_left_cam_pec span{
	background:#000;
	padding:2px 20px;
	color:#fff;
	font-size:11px;
	border-radius:2px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	display:inline-block;
	text-align:center;
	min-width:120px;
}


.event_ttl_pec {
    font-size: 22px;
	margin: 10px 0;
}

}


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

/* 上書き */
img{
	width:inherit !important;
	max-width:100% !important;
}

/* float解除用 */
.spClearfix_pec:after{
	content: " ";
	display: table;
	clear: both;
	height: 0;
}
.spClearfix_pec {
/*	display: inline-block;*/
}
.spClearfix_pec {
	display: block;
}

/* reset.css 追記 */
.clearfix_pec:after{
	overflow:hidden;
	clear:both;
}
em{font-style:normal;}
.border_pec{border:1px solid #ccc; padding:2px;}
ul{list-style:none;}
ol{margin:10px 0 10px 35px;}

.module_pec {
    padding-top: 60px !important;
	font-size: 1.1em;
	border-top: 1px solid #c8c8c8;
}

.grid3_pec .module_pec:first-child{
	border-top: none;
}

.module_pec dl dt{/*20191009*/
	font-weight:bold;
	padding:5px 0 0;
}

.h-wrapper dl dt,
.f-wrapper dl dt{/*20190930*/
	font-weight:bold;
	padding:0px 0 0;
}

.module_pec dd.border_dotted_pec{/*20191009*/
	border-top:none !important;
}
.module_pec dl dd{/*20191009*/
/*	margin-bottom:12px;*/
	padding:0 0 5px;
}
#container p.finish_pec{
	border:1px solid #B91440;
	padding:2px 4px;
	color:#B91440;
	margin-bottom:10px;
	text-align: center;
}


#container p.mark_pec,
#container p.mark_cam_pec{
	text-align:right;
	margin-bottom:5px;
}

#container p.mark_left_pec,
#container p.mark_left_cam_pec{
	text-align:left;
	margin-bottom:5px;
}


/* イベントマーク *//* キャンペーンマーク */
.mark_pec span,
/*.mark_left_pec span,*/
.mark_cam_pec span/*,
.mark_left_cam_pec span*/{
	background:#000;
	padding:2px 20px;
	color:#fff;
	font-size:11px;
	border-radius:2px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	display:inline-block;
	text-align:center;
	min-width:100px;
}


.event_ttl_pec {
	font-size: 16px;
	color: #000000 !important;
}

	}


	



	/* イベントマーク *//* キャンペーンマーク */
.mark_pec span,
.mark_cam_pec span{
	color:#fff !important;
}

/*20210113 iphone11*/
/* Safari (ただし、iOSのChromeにも適用される) */
_::-webkit-full-page-media, _:future, :root .mark_pec span {
    color: #fff !important;
}
_::-webkit-full-page-media, _:future, :root .mark_cam_pec span {
    color: #fff !important;
}
.event_ttl_pec strong{
    color: #000 !important;
}


/*20210113 iphone11 end*/