@charset "UTF-8";

/*
	ページタイトル
-----------------------------------------------------------------------------------------------*/
#guide #titPageOut{
	background:url(../images/bg_slash.png) top left repeat,-moz-linear-gradient(135deg, rgba(152, 74, 160, 0.7), rgba(231, 86, 133, 0.7) 90%),url(../images/bg_examIdx_top_pc.png) center center no-repeat;
	background:url(../images/bg_slash.png) top left repeat,-webkit-linear-gradient(135deg, rgba(152, 74, 160, 0.7), rgba(231, 86, 133, 0.7) 90%),url(../images/bg_examIdx_top_pc.png) center center no-repeat;
	background:url(../images/bg_slash.png) top left repeat,linear-gradient(-45deg, rgba(152, 74, 160, 0.7), rgba(231, 86, 133, 0.7) 90%),url(../images/bg_examIdx_top_pc.png) center center no-repeat;
	background-size:18px 18px,cover,cover;
}
@media screen and (max-width:667px){
	#guide #titPageOut{
		background:url(../images/bg_slash.png) top left repeat,-moz-linear-gradient(135deg, rgba(152, 74, 160, 0.7), rgba(231, 86, 133, 0.7) 90%),url(../images/bg_examIdx_top_sp.png) center center no-repeat;
		background:url(../images/bg_slash.png) top left repeat,-webkit-linear-gradient(135deg, rgba(152, 74, 160, 0.7), rgba(231, 86, 133, 0.7) 90%),url(../images/bg_examIdx_top_sp.png) center center no-repeat;
		background:url(../images/bg_slash.png) top left repeat,linear-gradient(-45deg, rgba(152, 74, 160, 0.7), rgba(231, 86, 133, 0.7) 90%),url(../images/bg_examIdx_top_sp.png) center center no-repeat;
		background-size:18px 18px,cover,cover;
	}
}


/*
settlement
-----------------------------------------------------------------------------------------------*/
.settlementFlowH{
	padding-top:30px;
}
@media screen and (max-width: 667px){
	.settlementFlowH{
		padding-top:15px;
	}
}
.settlementArea{
	border:1px #ddd solid;
}
/*
.settlementArea.creditTab {
	border:4px #E75685 solid;
}
.settlementArea.conviniTab {
	border:4px #E75685 solid;
}*/

@media screen and (max-width: 667px){
	.settlementArea{
		margin-top:0px;
	}
}


.textApply {
	margin-bottom:20px;
}

.creditTit{
	background: #e60012;
	display: block;
	padding: 0px;
	color: #FFF;
	font-size:1.8rem;
	text-align: center;
	padding: 6px;
}
@media screen and (max-width: 667px){
	.creditTit{
		width: 100%;
		font-size: 1.8rem;
	}
}
.conviniTit{
	background: #32338c;
	display: block;
	padding: 0px;
	color: #FFF;
	font-size: 1.8rem;
	text-align: center;
	padding: 6px;
}
@media screen and (max-width: 667px){
	.conviniTit{
		width: 100%;
		font-size: 1.8rem;
	}
}
.settlementCts{
	padding:15px;
}
.settlementCts02{
	padding:0;
}
.flex{
	display: flex;
	justify-content: space-between;

}
@media screen and (max-width: 667px){
	.settlementCts{
		display:block;
	}
	.settlementCts02{
		display:block;
	}
}
.settlementBox{
	flex-grow:1;
	position:relative;
}
.settlementBox:nth-child(n+2){
	margin-left: 40px;
}
@media screen and (max-width: 667px){
	.settlementBox:nth-child(n+2){
		margin: 70px 0 0;
	}
}
.settlementBox.settlementGrow {
	width: 100%;
}

.settlementDetail{
	padding: 0px 30px 20px 26px;
}
@media screen and (max-width: 667px){
	.settlementDetail{
		padding:0;
	}
}
.settlementDetail02{
	display: flex;
	justify-content: space-between;
}
@media screen and (max-width: 667px){
	.settlementDetail02{
		display:block;
	}
}
.settlementDetail02 > div{
	width: 100%;
	justify-content: space-between;
	padding: 0 20px;
}
@media screen and (max-width: 667px){
	.settlementDetail02 > div{
		padding:0;
	}
}
.settlementDetail > div:nth-child(n+2){
	padding: 0px 30px 20px 0px;
}
.settlementDetail div img{
}
.settlementImg{
	width:200px;
	margin:0 auto 20px;
	display: block;
}
@media screen and (max-width: 667px){
	.settlementImg{
		width:100%;
		margin:20px 0 5px;
	}
}

/*.creditImg {
	height: 250px;
}*/

@media screen and (max-width: 667px){
	.creditImg {
		height:auto;
	}
}
.settlementFlow{
	width: calc(100% - 20px);
	padding: 7px 0px 5px;
	font-size: 1.8rem;
	font-weight: bold;
	color: #FFFFFF;
	text-align: center;
	background: -moz-linear-gradient(left,rgba(231, 86, 133, 1) 60%, rgba(152, 74, 160, 1));
	background: -webkit-linear-gradient(left,rgba(231, 86, 133, 1) 60%, rgba(152, 74, 160, 1));
	background: linear-gradient(to right,rgba(231, 86, 133, 1) 60%, rgba(152, 74, 160, 1));
	border-radius: 5px 0 0 5px;
	position: relative;
	margin:0 0 15px;
}
@media screen and (max-width: 667px){
	.settlementFlow{
		width: 100%;
		padding: 7px;
		margin: 0 0 7px;
		font-size: 1.5rem;
		background: -moz-linear-gradient(135deg, rgba(152, 74, 160, 1), rgba(231, 86, 133, 1) 90%);
		background: -webkit-linear-gradient(135deg, rgba(152, 74, 160, 1), rgba(231, 86, 133, 1) 90%);
		background: linear-gradient(-45deg, rgba(152, 74, 160, 1), rgba(231, 86, 133, 1) 90%);
		border-radius: 4px;
	}
}
@media screen and (min-width: 668px){
	.settlementFlow::after{
		content: ' ';
		width: 0;
		height: 0;
		border-top:17px solid transparent;
		border-bottom:17px solid transparent;
		border-left: 20px solid #984AA0;
		position: absolute;
		right:-20px;
		top: 0px;
	}
}
@media screen and (max-width: 667px){
	.settlementBox::after{
		content: ' ';
		width: 0;
		height: 0;
		border-left: 50px solid transparent;
		border-right: 50px solid transparent;
		border-top: 30px solid rgba(231, 86, 133, 0.5);
		position: absolute;
		bottom: -50px;
		left: 50%;
		-webkit-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
}
.settlementBox.settlementArrow{
	width:100%;
}
.settlementArrow::after{
	display:none;
}
.methodPayment li{
	list-style-image:url(../images/icon_settlement_arrow01.svg);
	list-style-position: inside;
	color:#0b3199;
	text-decoration:underline;
}

/*
attention
-----------------------------------------------------------------------------------------------*/
.attentionDetailList li{
	list-style: decimal inside;
}
.paymentList {
	border: 1px #ddd solid;
	padding: 15px;
	margin: 15px 0;
}
.paymentList p{
	margin-top:20px;
}
.paymentList ul.methodPayment a{
	float:left;
	display:inline-block;
}
.paymentList ul.methodPayment a:nth-child(n+2){
	padding-left: 20px;
}
.paymentList ul.methodPayment a:last-child{
	padding-left:0;
}
@media screen and (max-width: 667px){
	.paymentList ul.methodPayment a{
		float:none;
		display:block;
		padding:0
	}
	.paymentList ul.methodPayment a:nth-child(n+2){
		padding-left:0px;
	}
}
.paymentListAttention{
	font-size:1.8rem;
	color:#e60012;
	font-weight:bold;
	margin-bottom:30px;
}
.conviniOnline{
	margin-top:30px;
}
.deadlineTit{
	background: #ddd;
	display: block;
	padding: 0px;
	color: #000;
	font-size: 1.8rem;
	width: 300px;
	text-align: center;
	padding: 6px;
}
.deadline{
	width: 95%;
	margin: 10px auto 20px;
}
a.deadlineDetail{
	color: #0b3199;
	text-decoration: underline;
}
a.deadlineDetail p img{
	margin: 5px 5px 0 0;
	width:19px;
	height:13px;
}
.internetAttention{
	background:#ddd;
	padding:30px;
}
.pageSubCtsArea .privacyBox{
	margin:0;
}
.pageSubCtsArea .privacyBox ul{
	padding:0;
}
.pageSubCtsArea .privacyBox ul li{
	padding:5px 0;
}

.pageSubCtsArea.errorInquiryBox{
	margin:0;
	border:1px solid #999;
}


.privacyBoxIndent{
	color:#e75685
}
.iconFreeDial img{
	width:30px;
}
.btnAreaTxt{
	text-align:center;
}
.tellAreaTxt{
	margin:40px 0 10px;
}


/*
完了画面の文言
-----------------------------------------------------------------------------------------------*/
#guide .finishBox #titMain span{
	color:#E75685;
}
#guide .finishBox #titMain span::after{
	background:none;
}


/*
	タブ（決済方法の説明）
-----------------------------------------------------------------------------------------------*/

/*タブの中身を初期非表示に*/
.ChangeElem_Panel {
	display:none;
}
.ChangeElem_Panel .settlementArea{
	border:2px #E75685 solid;
	border-top:2px #E75685 solid;	
}
/*タブ横並び*/
.ChangeElem_Btn_Content {
	font-size:0;
	/*border-bottom:1px solid #FFB94F;*/
}
/*通常時のタブ装飾*/
.ChangeElem_Btn {
	padding:10px 0px;
	margin-bottom:0px;
	font-size:1.8rem;
	font-weight:bold;
	border:none;
	cursor:pointer;
	width: 49.5%;
	color: #ffffff;
	border-radius: 6px 6px 0px 0px;
	position:relative;
}

.ChangeElem_Btn b::after {
	font-family:"Font Awesome 5 Free";
	content:'\f078';
	font-weight:900;
	font-size:140%;
	position:absolute;
	top:20%;
	margin-left: 14px;
	-webkit-transform:translate(0, -50%);
	transform:translate(0, -50%);
}
@media screen and (max-width: 667px){
	.ChangeElem_Btn b::after{
	font-family:"Font Awesome 5 Free";
	content:'\f078';
	font-weight:900;
	font-size:120%;
	position:absolute;
	top:31%;
	margin-left: 6px;		
	-webkit-transform:translate(0, -50%);
	transform:translate(0, -50%);
	}
}

.ChangeElem_Btn:focus{
	outline:none;
}

/*クレジットのタブ（非アクティブ）*/
.ChangeElem_Btn.creditTab {
	background-color:#ababab;
	margin-right:0.5%;
}

/*コンビニのタブ*/
.ChangeElem_Btn.conviniTab{
	background-color:#ababab;
	margin-left:0.5%;
}

/*カレントとホバー時のタブ装飾
.ChangeElem_Btn.is-active{
	border-top:1px solid #ffffff;
	border-left:1px solid #ffffff;
	border-right:1px solid #ffffff;
	border-bottom:1px solid transparent;
}*/
.ChangeElem_Btn.creditTab.is-active {
	background-color:#E75685;
}
.ChangeElem_Btn.conviniTab.is-active {
	background-color:#E75685;
}


.ChangeElem_Btn.creditTab:hover{
	background-color:#E75685;
}
.ChangeElem_Btn.conviniTab:hover{
	background-color:#E75685;
}

.ChangeElem_Btn.creditTab:hover b{
	border-bottom: 2px solid #000000;
}
.ChangeElem_Btn.conviniTab:hover b{
	border-bottom: 2px solid #000000;
}

.ChangeElem_Btn figure {
	margin: 9px auto 5px auto;
	width: 80%;
	background: #ffffff;
}

.ChangeElem_Panel .settlementFlowH{
	padding-top:0px;
}
.ChangeElem_Panel #olistJyukenFlow > li{
	margin:0 0 30px;
}
@media screen and (max-width: 667px){
	.ChangeElem_Panel .settlementFlowH{
		padding-top:0px;
	}
	.ChangeElem_Panel #olistJyukenFlow > li{
	margin:0 0 50px;
	}
	.ChangeElem_Panel #olistJyukenFlow > li:last-of-type{
	margin:0 0 0;	
	}
	.ChangeElem_Panel #olistJyukenFlow > li:last-child::after{
		border-left:0px;
		border-right:0px;
		border-top:0px;
		position:static;
	}
}

.ChangeElem_Panel .creditTit{
	width: 100%;
	margin: 0px auto 0px auto;
	padding: 12px 0px;
	color:#000000;
	background: #E75685;
}
@media screen and (max-width: 667px){
	.ChangeElem_Panel .creditTit{
		width: 95%;
		margin: 18px auto 0px auto;		
	}
}

.ChangeElem_Panel .conviniTit{
	width: 100%;
	margin: 0px auto 0px auto;
	padding: 12px 0px;
	color:#000000;	
	background: #E75685;	
}
@media screen and (max-width: 667px){
	.ChangeElem_Panel .conviniTit{
		width: 95%;
		margin: 18px auto 0px auto;		
	}
}

.ChangeElem_Panel .ctsJyukenFlow {
	margin-left: 30px;
	padding:0 0 0 0px;
	width:980px;
}

.ChangeElem_Panel .jyukenBoxOut{
	width:100%;
}


.ChangeElem_Panel .settlementImg{
	width:200px;
	margin:0 auto 20px;
	display: block;
}
@media screen and (max-width: 667px){
	.ChangeElem_Panel .settlementImg{
		width:100%;
		margin:24px 0 5px;
	}
}

.ChangeElem_Panel p{
	margin-bottom: 20px;
}


@media screen and (max-width:667px){
	/*タブ
	-----------------------------------------------------------------------------------------------*/
	#levelTabArea {
	margin-top:40px;
	}
	/*通常時のタブ装飾*/
	.ChangeElem_Btn{
		padding:5px 0px;
		font-size:1.4rem;
	}

	#listLevel{
		padding:0px 0 0;
	}
	.titLevel{
		padding:0 0 5px;
		font-size:2.5rem;
	}
	
	.dlistTsst{
		padding:15px 0 0;
		font-weight:bold;
	}
	.dlistTsst dt{
		padding:5px;
		margin:0 0 5px;
	}
	.dlistTsst dd{
		padding:5px 0 10px 115px;
	}
	
	.ChangeElem_Panel .ctsJyukenFlow {
	margin-left: auto;
	width:100%;
	}
	.ChangeElem_Panel p{
	margin-bottom: auto;
	}	
}