@charset "utf-8";
/*
**********************************************************************

* online.css

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

.keyv {
  height: 280px;
  background: url(../images/online/bg_keyv.png) center center no-repeat;
  background-size: cover;
  margin: 0 auto 40px auto;
}
.keyv .keyvImg {
}
/* =========================================================
Main
========================================================= */
#Main {
  padding: 29px 0 90px;
}
#Main .contSect {
}
#Main .contSect .mainTit {
  width: 1003px;
  margin: 0 0 22px -15px;
}
#Main .contSect .sectMain {
  width: 640px;
  margin: 0 auto;
  border: 1px solid #cccccc;
}
#Main .contSect .sectMain .wrap {
  border: 2px solid #ececec;
}
#Main .contSect .sectMain .sectTit {
}
#Main .contSect .sectMain .blockMain {
  padding: 26px 20px 30px;
}
#Main .contSect .sectMain .blockMain .leadTxt {
  padding-left: 16px;
  margin-bottom: 22px;
  font-size: 12px;
}
#Main .contSect .sectMain .blockMain .contBlock {
  height: 367px;
  margin-bottom: 20px;
  border: 4px solid #e8e6dd;
}
#Main .contSect .sectMain .blockMain .more {
  margin-bottom: 75px;
  text-align: right;
}
#Main .contSect .sectMain .blockMain .more a {
  padding-left: 10px;
  background: url(../images/common/icon_arrow01.gif) 0 2px no-repeat;
  color: #0a50a1;
}
#Main .contSect .sectMain .blockMain .idBlock {
  position: relative;
  width: 571px;
  margin: 0 auto 50px;
}
#Main .contSect .sectMain .blockMain .idBlock .idBox {
  position: absolute;
  top: 45px;
  left: 96px;
  display: block;
  width: 394px;
  font-size: 50px;
  font-weight: bold;
  color: #004bb2;
  line-height: 1;
  text-align: center;
}
#Main .contSect .sectMain .blockMain .idBlock.type2 {
  width:591px;
}
#Main .contSect .sectMain .blockMain .idBlock.type2 input{ 
  position:absolute;
  left: 104px;
  top: 80px;
  padding:10px;
  color:#004bb2;
  border:#004bb2 3px solid;
  border-radius:5px;
  -webkit-border-radius:5px;
  font-size:30px;
  text-align:center;
}
#Main .contSect .sectMain .blockMain .idBlock.type2 .cautionTxt{ 
  position:absolute;
  left: 108px;
  top: 155px;
  text-align:left;
  line-height:1.4;
  font-size:12px;
}
#Main .idBlock #InputError {
  color:#c00;
  font-weight:bold;
}


/* メンバーチェック */

#memberCheck,
#memberCheck .cheeckTit,
#memberCheck .cautionList {
	display: none;
}
#memberCheck.is-lucua,
#memberCheck.is-mio,
#memberCheck.is-ekie,
#memberCheck.is-lucua .-lucua,
#memberCheck.is-mio .-mio,
#memberCheck.is-ekie .-ekie {
	display: block;
}
#memberCheck {
  margin:30px 0;
}
#memberCheck .cheeckTit {
  margin-left: -20px;
  margin-right: -20px;
}
#memberCheck .members_check
{ 
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 20px;
  margin-top: 20px;
}
#memberCheck .members_check_inner{
}
#memberCheck .members_check label
{
  padding: 10px 20px;
  border: 1px solid #ccc;
  display: inline-block;

  cursor: pointer;
}
#memberCheck .members_check input
{
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-top: -2px;
  margin-right: 15px;
}
#memberCheck .cautionList {
  font-size: 14px;
}



/* コンテンツ */

div.emergencyArea {
    background-color: #f8d9d9;
    border: 1px solid #bc3838;
    margin-bottom: 15px;
    padding: 8px;	
}

div.emergencystrong {	
    font-weight: bold;
	color: #9a2414 !important;
	margin-left: 10px;
	text-decoration: underline;
}

div.emergencyArea p {
}

div.emergencyArea p a {
    background-color: #f8d9d9;
    border: 1px solid #f8d9d9;
    color: #9a2414 !important;
    font-weight: bold;
}

.mainTit {
	width: 100%;
	margin-bottom: 19px;
	text-align: center;
}
.mainTit span {
  min-width:934px;
  display:block;
background: url(../images/online/main_tit_bg.jpg) no-repeat center top;
}
.onlineSect {
}
.onlineSect .sectTit {
	margin-bottom: 29px;
}
.onlineSect .cardBlock {
}
.onlineSect .cardBlock .blockInner {
	padding-bottom: 24px;
}
.onlineSect .cardBlock .blockTit {
	margin-bottom: 24px;
}
.onlineSect .cardBlock .txt01 {
	margin: 0 0 28px 35px;
}


/* ====================================
.cardBlock .goldBox,
.cardBlock .expressBox, 
.cardBlock .basicBox
.cardBlock .otherBox
======================================= */

.onlineSect .cardBlock .goldBox,
.onlineSect .cardBlock .expressBox,
.onlineSect .cardBlock .basicBox,
.onlineSect .cardBlock .otherBox
 {
	width: 576px;
	margin: 0 auto 22px;
	border: solid 10px #e9e6dd;
}
.onlineSect .cardBlock .goldBox .boxTit,
.onlineSect .cardBlock .expressBox .boxTit,
.onlineSect .cardBlock .basicBox .boxTit,
.onlineSect .cardBlock .otherBox .boxTit
 {
	margin-bottom: 10px;
	padding-top: 20px;
	text-align: center;
}
.onlineSect .cardBlock .goldBox .leadTxt,
.onlineSect .cardBlock .expressBox .leadTxt,
.onlineSect .cardBlock .basicBox .leadTxt,
.onlineSect .cardBlock .otherBox .leadTxt
 {
	margin-bottom: 15px;
	text-align: center;
}
.onlineSect .cardBlock .goldBox .serviceList,
.onlineSect .cardBlock .expressBox .serviceList,
.onlineSect .cardBlock .basicBox .serviceList,
.onlineSect .cardBlock .otherBox .serviceList
 {
	width: 480px;
	margin: 0 auto;
}
.onlineSect .cardBlock .goldBox .serviceList li,
.onlineSect .cardBlock .expressBox .serviceList li {
	float: left;
	width: 240px;
	text-align: center;
}
.onlineSect .cardBlock .basicBox .serviceList li,
.onlineSect .cardBlock .otherBox .serviceList li
 {
	text-align: center;
}
.onlineSect .cardBlock .goldBox .selectcardList + .serviceList {
	margin-top: 32px;
}
.onlineSect .cardBlock .goldBox .selectcardList {
	width: 220px;
	margin: 0 auto 18px;
}
.onlineSect .cardBlock .expressBox .selectcardList,
.onlineSect .cardBlock .basicBox .selectcardList,
.onlineSect .cardBlock .otherBox .selectcardList
 {
	width: 520px;
	margin: 0 auto 18px;
}
.onlineSect .cardBlock .expressBox .selectcardList:first-child,
.onlineSect .cardBlock .basicBox .selectcardList:first-child,
.onlineSect .cardBlock .otherBox .selectcardList:first-child
{
   margin-top: 20px;
}
.onlineSect .cardBlock .expressBox .selectcardList li,
.onlineSect .cardBlock .basicBox .selectcardList li,
.onlineSect .cardBlock .otherBox .selectcardList li
 {
	float: left;
  display:inline;
	width: 210px;
	margin: 0 5px;
	padding: 0px 20px 20px;
}
.onlineSect .cardBlock .goldBox .selectcardList li input,
.onlineSect .cardBlock .expressBox .selectcardList li input,
.onlineSect .cardBlock .basicBox .selectcardList li input,
.onlineSect .cardBlock .otherBox .selectcardList li input
 {
	margin-right: 6px;
	vertical-align: top;
	margin-top: 0;
}
.onlineSect .cardBlock .goldBox .selectcardList .balloon,
.onlineSect .cardBlock .expressBox .selectcardList .balloon,
.onlineSect .cardBlock .basicBox .selectcardList .balloon,
.onlineSect .cardBlock .otherBox .selectcardList .balloon
 {
	background: url('../images/online/bg_balloon.gif') no-repeat top left;
}
.onlineSect .cardBlock .goldBox .selectcardList li .thumb {
	display: block;
	margin: 0 auto 10px;
}
.onlineSect .cardBlock .expressBox .selectcardList li .thumb,
.onlineSect .cardBlock .basicBox .selectcardList li .thumb,
.onlineSect .cardBlock .otherBox .selectcardList li .thumb
 {
	display: block;
	margin-bottom: 10px;
}

.onlineSect .selectcardList li label .label-image {
  display: flex;
  align-items: start;
}


.onlineSect .cardBlock .basicBox .note,
.onlineSect .cardBlock .otherBox .note
 {
	margin: 0 15px 20px 0;
	font-size: 77%;
	text-align: right;
}
.onlineSect .cardBlock .goldBox .note {
	margin-bottom: 24px;
	font-size: 10px;
	text-align: center;
}
.onlineSect .cardBlock .goldBox .noteTxt {
	position: relative;
	margin: 32px 16px 24px;
	padding-left: 3em;
	font-size: 12px;
}
.onlineSect .cardBlock .goldBox .noteTxt span {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
}
.onlineSect .cardBlock .goldBox .noteTxt a {
	color: #0072bc;
}


/* ====================================
.cardBlock .linkTxt, 
.cardBlock .btnBox
======================================= */

.onlineSect .cardBlock .linkTxt {
	margin-bottom: 60px;
	text-align: right;
}
.onlineSect .cardBlock .linkTxt a {
	background: url(../images/online/mark_arrow.gif) no-repeat left center;
  padding-left:15px;
	color: #0a51a1;
}
.onlineSect .cardBlock .btnBox {
	width: 596px;
	height:59px;
	margin: 0 auto;
  box-sizing: content-box;
	padding: 14px 0 13px;
	background: url('../images/online/bg_btnarea_jcbvisa.gif') no-repeat center center #f2f1ec;
	text-align: center;
  line-height:1;
}
.onlineSect .cardBlock #btnSubmit {
	display: none;
}
.onlineSect .cardBlock .btnBox img {
  vertical-align:top;
}


/* カード選択 */
.selectcardBox {
  width:576px;
  margin:0 auto;
  border:solid 10px #e9e6dd;
}

.selectcardBox .inner {
	padding: 20px 10px !Important;
	border: 0 !Important;
	background-color: #fff;
	zoom: 1;
	

}

.selectcardBox .inner .serviceList {
	width: 480px;
	margin:30px auto 0;
}
.selectcardBox .inner .serviceList li {
	width: 240px;
	float: left;
	text-align: center;
}

#card_j-west .inner .serviceList li {
	width: 480px;
}

.selectcardBox .selectcardList {
	padding:0 5px;
	margin: 0 auto;
}

.selectcardBox .selectcardList li {
	width: 270px;
	padding: 5px 3px 10px;
	margin: 0 auto;
	_margin: 0;

}
.selectcardBox .selectcardList li.disabled {
  opacity: 0.4;
}
.selectcardBox .selectcardList li .thumb {
	display: block;
	margin:0 auto;

}


.selectcardBox .selectcardList li input {
  margin:2px 5px 0 50px;
  vertical-align: top;
}

.selectcardBox .selectcardList li input.input_bland {
  margin:2px 5px 0 0;
  vertical-align: top;
}



.cardBlock .cautionTxt {
  font-size:10px;
  padding-bottom:20px;
  width: 520px;
  margin: 0 auto;
}

.cardtypeBox .boxTit {
  font-size:20px;
  font-weight:bold;
  text-align:center;
  margin-bottom:15px;
}
.cardtypeBox .selectcardList {
	display: flex;
	overflow: hidden;
	position: relative;
	justify-content: center;
}

.cardtypeBox .selectcardList li {
  width:33.333333%;
  padding:0;
  margin: 0;
  text-align:center;
	border: dotted #999999;
	border-width: 0 1px;
	box-sizing: border-box;
	background-color: #fff;
	margin-left: -1px;
}

.cautionBox {
  border: 10px solid #cc0000;
  font-size: 14px;
  width: 576px;
  margin:0 auto 30px;
}
.cautionBox li p,
.cautionBox li {
  line-height:1.4 !important;
}
.cautionBox .boxTit {
  background: #cc0000;
  color: #ffffff;
  display: inline-block;
  font-weight: bold;
  font-size: 20px;
  line-height: 1;
  padding: 0 15px 8px 5px;
}
.cautionBox .cautionInner {
  padding: 0px;
}
.cautionBox .cautionLarge {
  font-size:105%;
  color:#cc0000;
}
.cautionBox .cautionInner .cautionMark {
  font-size:25px;
  font-weight:bold;
}

.cautionBox .cautionInner .linkTxt2 a {
	color: #0a51a1;
}

.cautionBox .cautionMain {
  padding: 20px;
}

.cautionBox .cautionInner .importantRed,
ul.importantRed li{
	color:#b31a1a !important;
	background-color:auto;
}
.cautionList li {
  margin-top:6px;
  padding-left:1em;
  text-indent:-1em;
}
#Caution1,
#Caution2 {
  display: none;
}

.cardtypeBox .selectcardList li .onlyvisa {
  display:none;
}
.cardtypeBox .selectcardList li.bicselected img {
  display:none;
}
.cardtypeBox .selectcardList li.bicselected .thumb.onlyvisa {
  display:block;
}
.cardtypeBox .selectcardList li.bicselected .onlyvisa {
  display:inline;
}
#CautionBox.bicselected .mastercardTxt{
  display:none;
}


.cautionInner span.mastercardTxt span.r_mark{
vertical-align:-15%;
}

.text-red {
  color: #DF0101;
}

.tx14 {
  font-size: 14px;
}
.tx12 {
  font-size: 12px;
}

.blank-icon {
  vertical-align: middle;
}

.text-link {
  text-decoration: underline;
}

.text-link:hover {
  text-decoration: none;
}