@charset "Shift_JIS";
/* ========================================

OUTLINE

	クレディセゾン・UCカード：カード選択

	カード詳細

	「ＵＣカード」


======================================== */



/* キャンペーンバナー */



#bnr1206 {
	border:1px solid #4253A3;
	width:579px;
	margin:30px auto 0 auto;
	}
	
	
#bnr1206 .ttl{
	background: url(/card/lineup/wr_css/wr_img/uc/bnr1206_ttlbg.jpg) repeat-x #E8F5FD;
	font-size:large;
	color:#FFFFFF;
	font-weight:bold;
	padding:8px 12px 0 12px;
	height:38px;
	}
	
#bnr1206 .txt{
	background: url(/card/lineup/wr_css/wr_img/uc/bnr1206_txtbg.jpg) no-repeat bottom #E8F5FD;
	padding:0 20px 0 175px;
	}
	
#bnr1206 .imgArea{
	background: url(/card/lineup/wr_css/wr_img/uc/bnr1206_imgbg.jpg) no-repeat top #FFFFFF;
	padding:68px 20px 8px 176px;
	}
	
#bnr1206 .imgArea .none{
	display:none;
	}
	
#bnr1206 .imgArea .cpday{
	color:#FFFFFF;
	background: #435DA8;
	padding:3px 10px;
	text-align:center;
	font-size:larger;
	}
	
.bnr1206-attention {
	width:610px;
	margin:5px auto 40px auto;
	color:#666666;
	font-size:smaller;
	}



.cpBnr{
	margin: 2em auto;
}

.cpBnr a img{
	width:100%;
	border: 1px solid #CCC;
}





/* modal
-----------------------------------------------*/
.modalOpen{
	font-size: 13px;
	display:block;
}
.modal{
	display:none;
	position:fixed;
	z-index:100;
	width:100%;
	height:100%;
	top:0;
	left:0;
	text-align:center;
	box-sizing:border-box;
	padding:0 20px;
}
.modal .bg{
	position:fixed;
	top:0;
	left:0;
	z-index:1;
	background: rgba(21, 21, 21, 0.8);
	width:100%;
	height:100%;
	opacity:0.8;
}
.modal .modalInner{
	position:relative;
	z-index:11;
	top:50%;
	left:0;
	max-width:720px;
	-webkit-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	transform:translateY(-50%);
	box-sizing:padding-box;
	margin:0 auto;
	max-height:90%;
	overflow:auto;
}
.modal .modalBox{
	position:relative;
	background:#fff;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	text-align:left;
	padding:15px;
	font-size: .875em;
}

.modal .modalBox .info-s{
	margin-top:20px;
	font-size:90%;
	line-height:1.4;
	text-indent: -1em;
	padding-left: 1em;
}

.modal .modalBox .modalClose{
	position:absolute;
	right:15px;
	top:15px;
	display:block;
	width:20px;
	height:20px;
	background:url( "../img/modal-closeBtn.png") no-repeat;
	/*background-size:30px;*/
	font-size:0;
	ppacity:1 !important;
}
.modal.min{
	overflow-y:scroll;
}
.modal.min .modalInner{
	top:0;
	-webkit-transform:translateY(0);
	-ms-transform:translateY(0);
	transform:translateY(0);
	margin-top:30px;
	margin-bottom:30px;
}
.modal .img{
	margin:24px auto 0 auto;
}
.modal .img img{
	width:100%;
	height:auto;
}
.modal .containor{
	display: flex;
	justify-content: space-around;
	margin-top: 2em;
}
.modal .containor .content{
	width: 50%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	text-align: center;
	padding: 20px;
	background: #f5f5f5;
	border-radius:10px;
	margin:0 10px;
}
.modal .containor .btn{
	font-size: 1.2rem;
	background-color: #E00;
}
.modal .containor .btn a,
.modal .containor .btn a:active,
.modal .containor .btn a:hover {
	color: #FFF !important;
	font-weight: bold;
}
.modal .containor .tex{
	font-size: 1.0rem;
	background: none;
	border: 2px solid #E00;
}
.modal .containor .tex a {
	color: #555 !important;
	font-weight: normal;
}

.modal .content .card_img {
	padding: 15px 0;
}
.modal .content a {
	display: inline-block;
	margin-left: 0;
	padding-right: 0;
	background: none;
	width: 100%;
}
.modal .content a img{
	width: 100%;
	height: auto;
}

.pc{
	display:block;
}
.sp{
	display:none;
}


@media screen and (max-width: 767px) {
	.modal .containor .content {
		width: auto;
		margin: 12px 0 0;
	}	
	.modal .content h2 {
		text-align: center;
	}
	.modal .containor {
		display: flex;
		flex-direction: column;
		justify-content: space-around;
	}
	.modal .containor {
		margin-top: 0.2em;
	}
	.modal .modalBox{
		padding:10px 20px 10px 20px;
	}
	.modal .modalBox h4{
		font-size:17px;
	}
	.modal .modalBox p{
		font-size:15px;
		margin-top:16px;
		line-height:1.5;
	}
	.modal ul li{
		font-size:15px;
	}
	.modal .content .card_img {
    	padding: 0;
		height: 110px;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.slide_dl_02 dt.underline .icon:before,
	.slide_dl_03 dt.underline .icon:before{
	  left: 27%;
	}
	.pcbr,
	.pc{
		display:none;
	}
	.sp{
		display:block;
	}
}