/*登録フォーム用*/
body {
	font-family:游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:15px;
}

/*--------------------------------
バー式ステップ表示
--------------------------------*/
	.step_bar_box {
	    text-align: center;
	    overflow: hidden;

	}

	.step_bar {
	    list-style: none;
	    margin:0;
	    padding:0;
	}

	.step_bar li {
	    background: #eee none repeat scroll 0 0;
	    color: #a6a6a6;
	    display: inline-block;
	    font-size: 11px;
	    line-height: 32px;
	    margin: 2px;
	    padding: 0 6px 0 3px;
	    text-decoration: none;
	}

	.step_bar li small {
	    font-size: 80%;
	}

	.step_bar li::after {
	    position: relative;
	    display: block;
	    margin-top: -18px;
	    margin-left: auto;
	    margin-right: -14px;
	    height: 15px;
	    width: 11px;
	    content: " ";
	    -webkit-transform: skew(-23deg);
	    -moz-transform: skew(-23deg);
	    -ms-transform: skew(-23deg);
	    -o-transform: skew(-23deg);
	    transform: skew(-23deg);
	    background: #eee;
	    border-right: 1px solid white;
	}

	.step_bar li::before {
	    float: right;
	    display: block;
	    margin-bottom: -25px;
	    margin-left: auto;
	    margin-right: -14px;
	    height: 15px;
	    width: 11px;
	    content: " ";
	    -webkit-transform: skew(23deg);
	    -moz-transform: skew(23deg);
	    -ms-transform: skew(23deg);
	    -o-transform: skew(23deg);
	    transform: skew(23deg);
	    background: #eee;
	    border-right: 1px solid white;
	}

	.step_bar li:first-child {
	    padding-left: 3px;
	    -webkit-border-radius: 5px 0 0 5px;
	    -moz-border-radius: 5px 0 0 5px;
	    -ms-border-radius: 5px 0 0 5px;
	    -o-border-radius: 5px 0 0 5px;
	    border-radius: 5px 0 0 5px;
	}

	.step_bar li:last-child {
	    padding-left: 0px;
	    padding-right: 3px;
	    -webkit-border-radius: 0 5px 5px 0;
	    -moz-border-radius: 0 5px 5px 0;
	    -ms-border-radius: 0 5px 5px 0;
	    -o-border-radius: 0 5px 5px 0;
	    border-radius: 0 5px 5px 0;
	}

	.step_bar li:last-child::before {
	    border: 0;
	    background: transparent !important;
	}

	.step_bar li:last-child::after {
	    border: 0;
	    background: transparent !important;
	}

	.step_bar li.current {
	    background: #5cb85c;
	    color: #fff;
	}

	.step_bar li.current::before {
	    background: #5cb85c;
	}

	.step_bar li.current::after {
	    background: #5cb85c;
	}

	.step_bar li.current:last-child {
	    margin-right: -35px;
	}

	.step_bar li.current:last-child::before {
	    border: 0;
	    background: transparent !important;
	}

	.step_bar li.current:last-child::after {
	    border: 0;
	    background: transparent !important;
	}
	@media (min-width: 768px) {
	 .step_bar li {
	    line-height: 46px;
	    color: #a6a6a6;
	    padding: 0 15px 0 35px;
	    background: #eee;
	    font-size: 14px;
	}
	 

	 
	.step_bar li::after {
	    margin-top: -25px;
	    margin-right: -25px;
	    height: 22px;
	    width: 20px;
	    content: " ";
	    -webkit-transform: skew(-30deg);
	    -moz-transform: skew(-30deg);
	    -ms-transform: skew(-30deg);
	    -o-transform: skew(-30deg);
	    transform: skew(-30deg);
	}
	 
	.step_bar li::before {

	    margin-right: -25px;
	    height: 21px;
	    width: 20px;
	    content: " ";
	    -webkit-transform: skew(30deg);
	    -moz-transform: skew(30deg);
	    -ms-transform: skew(30deg);
	    -o-transform: skew(30deg);
	    transform: skew(30deg);
	    border-right: 1px solid white;
	}
	 
	.step_bar li:first-child {
	    padding-left: 20px;
	}
	 
	.step_bar li:last-child {
	    padding-left: 35px;
	    padding-right: 40px;
	}
	   
	}


	.checkbox-inline , .radio-inline {
	    margin-top: 0;
	    margin-right: 10px;
	    margin-left: 0px;
	}
	.checkbox-inline + .checkbox-inline, .radio-inline + .radio-inline{
	    margin-top: 0;
	    margin-right: 10px;
	    margin-left: 0px;

	}


/*--------------------------------
チェックボックスのサイズ
--------------------------------*/
	.checkbox-lg{
		padding-bottom: 8px;
	}

	.checkbox-lg span{
		margin-left: 8px;
		cursor: pointer;
		font-size: 120%;
		font-weight: normal;
	}

	/* ボックスのスタイル */
	.checkbox-lg span:before {
		content:		'';
		width:			22px;			/* ボックスの横幅 */
		height:			22px;			/* ボックスの縦幅 */
		display:		inline-block;
		position:		absolute;
		left:			0;
		background-color:	#fff;
		border: 1px solid #aaa;
		border-radius:		6px;
		line-height: 1;
	}
	/* 元のチェックボックスを表示しない */
	.checkbox-lg input[type=checkbox] {
		-ms-filter: "alpha(opacity=0)"; /* IE 8,9 */
		-moz-opacity:0; /* FF , Netscape */
		-khtml-opacity: 0; /* Safari 1.x */
		opacity:0;
	}
	.checkbox-lg:focus-within {
		border:1px solid #66afe9;
		border-radius: 4px;
		box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
	}	
	/* チェックした時のスタイル */
	.checkbox-lg input[type=checkbox]:checked + span:after {
		font-family: 'FontAwesome' ;
		content:		'\f00c';		/* チェックの文字 */ 
		font-size:		24px;			/* チェックのサイズ */
		color:			#444;			/* チェックの色 */
		display: block;
		position: absolute;
		top: 0px;
		left: 0px;
	}

	.has-error.checkbox-lg span:before {
		background-color:	#fee;
		border-color: #a94442;
	}

/*--------------------------------
ラジオボタンのサイズ
--------------------------------*/
	.radio-lg{
		padding-bottom: 8px;
	}

	.radio-lg span{
		margin-left: 8px;
		cursor: pointer;
		font-size: 120%;
		font-weight: normal;
	}

	/* ボックスのスタイル */
	.radio-lg span:before {
		content: "";
		display: block;
		position: absolute;
		top: 8px;
		left: 0;
		width: 22px;
		height: 22px;
		border: 1px solid #999;
		border-radius: 50%;
	}
	/* 元のチェックボックスを表示しない */
	.radio-lg input[type=radio] {
		-ms-filter: "alpha(opacity=0)"; /* IE 8,9 */
		-moz-opacity:0; /* FF , Netscape */
		-khtml-opacity: 0; /* Safari 1.x */
		opacity:0;
	}
	.radio-lg:focus-within {
		border:1px solid #66afe9;
		border-radius: 4px;
		box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
	}
	/* チェックした時のスタイル */
	.radio-lg input[type=radio]:checked + span::after{
		content: "";
		display: block;
		position: absolute;
		top: 13px;
		left: 5px;
		width: 12px;
		height: 12px;
		background: #444;
		border-radius: 50%;
	}

/*--------------------------------
必須
--------------------------------*/
	.nec .control-label:after{
		content:'必須';
		border-radius: 0.25em;
	    color: #fff;
	    display: inline;
	    font-size: 75%;
	    font-weight: 700;
	    line-height: 1;
	    padding: 0.2em 0.6em 0.3em;
	    text-align: center;
	    vertical-align: baseline;
	    white-space: nowrap;
	    background-color: #f0ad4e;
	    margin-left: 4px;
	}

	.has-error input,.has-error textarea,.has-error select{
		background: #FEE;
	}



/*-------------------
v-table(2列の表をスマホ時縦に並べる）
---------------------*/
	.v-table{
	    width: 100%;
	    margin-bottom:20px;
	}

	.v-table th, .v-table td  { 
	    padding: 8px; border: 1px solid #ddd; }

	.v-table th { background: #f4f4f4; width: 30%; text-align: left; vertical-align: top;}
	 
	@media only screen and (max-width:500px){
	.v-table th, .v-table td{
	    width: 100%;
	    display: block;
	    border-top: none;
	    }
	    .v-table tr:first-child th { border-top: 1px solid #ddd; }
	}

	/*v-tableをサイドバーで使う時用*/
	@media only screen and (min-width:970px){
	.v-side th, .v-side td{
	    width: 100%;
	    display: block;
	    border-top: none;
	    }
	    .v-side tr:first-child th { border-top: 1px solid #ddd; }
	}


	.v-table-th2{
	    background-color: #666666 !important;
	    color:#fff;
	}
	.v-table-th3{
	    background-color: #f5f5e9 !important;
	    color:#000;
	    font-size:17px;
	        text-align: right !important;
	}

.text-center td,.text-center th{
	text-align: center;
}



.DME_test_mode_area{
/*登録フォームをテストモードで使用時*/
	border:1px solid #CC9966;
	background-color:#FF9966;
	color:#FFFFFF;
	font-size:16;
	font-weight:bold;
	margin:10px;
	padding:10px;
}

.DME_bg_003{
/*背景３*/
/*カートテーブルのタイトル*/
	color:#666666;
	background-color:#fafdff;
}
.DME_bg_004{
/*背景４*/
/*カートテーブルのボディ*/
	color:#666666;
	background-color:#FFFFFF;
	font-size: 14px;
}
.DME_bg_005{
/*背景５*/
/*カートテーブルの合計*/
	padding:10px;
	color:#666666;
	background-color:#fafdff;
	font-size: 18px;
}

.DME_order_comment{
/*カートテーブルの商品名*/
	font-size:13px;
	font-weight:normal;
	color:#999999;
}

.DME_footer{
/*フッター*/
	text-align:center;
}




.DME_kessai_title{
/*決済選択*/
	padding:3px;
	background-color:#DDDDDD;
}
.DME_kessai_comment{
/*決済選択の説明*/
	padding:3px;
}

.DME_hidden{
	display:none;
}
.DME_view{
	display:;
}

/*------------------
snsログイン
---------------------*/
.btn-sns {
	display: block;
	width: 100%;
	padding: 6px 12px;
	margin-bottom: 5px;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.42857143;
	text-align: left;
	white-space: nowrap;
	vertical-align: middle;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-image: none;
	border: 1px solid transparent;
	border-radius: 4px;
	position: relative;
	color: #ffffff;
}
.btn-sns i {
	float: right;
	position: absolute;
	right: 12px;
	top: 11px;
}
.btn-line {
	background-color: #19bc03;
}
.btn-sns:hover {
	color: #ffffff;
	opacity: 0.8;
}
.btn-facebook {
	background-color: #3b5998;
}
.btn-twitter {
	background-color: #55acee;
}
.btn-gplus {
	background-color: #df4a32;
}
