@CHARSET "UTF-8";

/*-------------------------------------------------------
 全体
 ------------------------------------------------------*/

/** LP用に画面幅制御なしにする */
#LP .topGroupName {
	width:100%;
	padding: 0;
}
.contents .beforeFormArea {
	max-width: 1000px;
	padding-bottom: 0;
}
.lp_tab_contents {
	margin-top: 40px;
}
.contents .table {
	border: 1px solid #D2D6D9;
}
.radiobuttonLabel {
	padding-right: 28px;
}
.radiobuttonLabel + .radiobuttonLabel {
	margin-top: 0;
}
.formArea > .set-group:not(:first-of-type) {
	margin-top: 25px;
}
.formArea > .set-group#destinationSelectGroup,
.formArea > .set-group#destinationGroup,
.formArea > .set-group#destinationOptionGroup,
.formArea > .set-group#amazonPayLogoutGroup {
	margin-top: 0;
}

input[readonly] {
	background-color:#f0f0f0 !important;
}

/* amazon用 */
#amazonWalletGroup{
	margin-top: 20px;
}
#amazonAddressWidgetItemWrap{
	margin-top: 10px;
}


/** 画像 */
@media screen and (max-width: 960px) {
	.htmlTextItemWrap img {
		width: 100%;
	}
	.beforeFormArea {
		padding: 0 2%;
	}
}

/*-------------------------------------------------------
 商品選択エリア
 ------------------------------------------------------*/
.selectedSalesGoodsCodesThSurround {
	width: 300px;
}
@media screen and (max-width: 960px) {
	.selectedSalesGoodsCodesThSurround {
		display: block;
		width: 100%;
		padding: 10px 2%;
	}
}

/*-------------------------------------------------------
 ログインエリア
 ------------------------------------------------------*/
/** ログインボタン */
#content_2 .submitArea {
	width:100%;
}
#loginButtonItemWrap {
	vertical-align: top;
	padding-top: 10px;
}
#loginButtonItemWrap input.btn_lg[type="button"] {
	margin: 0 auto;
	max-width: 500px;
	height: auto;
	line-height: 1.5;
}
a.memberReminderLink {
	display: inline-block;
}

/** ソーシャルログインボタン **/
.socialLoginArea {
	display: flex;
    justify-content: center;
    align-items: flex-end;
    flex-wrap: wrap;
    max-width: 720px;
    margin: 20px auto;
}
.socialLoginArea > div {
    padding: 5px 10px;
    max-width: 220px;
    width: 100%;
}

.checkbox_deco {
	margin-top: 10px;
	margin-left: 3px;
}

a#memberReminderLink_link.link_arrow.memberReminderLink {
	display: flex;
	flex-wrap: wrap;
	margin-top: 10px;
}

#password {
	font-family: "YuGothic", "Yu Gothic", sans-serif;
}

/*-------------------------------------------------------
 入力フォーム
 ------------------------------------------------------*/
 #salesGoodsGroup {
	 display: none;
 }

/** 商品選択 */
.selectedSalesGoodsCodesTdSurround .radiobuttonLabel + .radiobuttonLabel {
	margin-top: 5px;
}

/** フォーム */
.customerInfoGroup {
	position: relative;
}
.orderPostCodeTdSurround .items {
	display: flex;
	flex-wrap: wrap;
}
.orderPostCodeItemWrap input[type="text"] {
	width: calc(100% - 130px);
	display: inline-block;
}
.orderPostCodeItemWrap input[type="button"] {
	width: 120px;
	display: inline-block;
	margin-left: 10px;
}
.orderTelNoItemWrap input[type="text"] {
	display: inline-block;
	width: calc((100% - 86px) / 3);
}

/** オプトイン */
#isOptin1ItemWrap .checkboxLabel > .checkboxStyle,
#isOptin2ItemWrap .checkboxLabel > .checkboxStyle,
#isOptin1ItemWrap .checkboxLabel > .MIXED,
#isOptin2ItemWrap .checkboxLabel > .MIXED {
    display: inline;
}
#optinGroup2 {
	margin-top:10px;
}

#customerInfoInputLayout.table.th_30 .td,
#customerInfoInputLayout.table.th_30 td {
	background:transparent;
}

/* マイル利用選択表示調整 */
#pointLayoutGroup .radiobuttonLabel {
	display: block;
	top: 0;
	text-align:left;
	margin-bottom: 5px;
}
#usePointFlg_0_label {
	display:block;
}
#usePointFlg_1_label {
	display: inline-block;
	margin-top:0px;
	position: relative;top:20px;
	padding-right:0;
}
#usePoint {
	display: inline-block;
	width:100px;
}
#usePointLimit_innerId {
	font-size: 11px;
}
@media screen and (max-width: 960px) {
	.customerInfoGroup {
		padding-top: 42px;
	}
	#usePointFlg_0_label {
		line-height: 1.4em;
		height: auto;
		padding: 10px 10px 10px 30px;
	}
	#usePointFlg_1_label {
		padding: 10px 10px 10px 27px;
	}
	#usePointLimit_innerId {
		display:block;
		padding-top:20px;
	}
}
/*-------------------------------------------------------
 クーポン入力エリア
 ------------------------------------------------------*/
.td.couponCodeTdSurround .items {
	display: flex;
	align-items: center;
}
#couponCodeApplyButton,
#couponCodeCancelButton {
	width: calc(100% - 220px);
	display: flex;
	justify-content: center;
	margin-left: 3%;
	background-color: #3A70A7;
	color: white;
	font-size: larger;
}

/*.readonly {
	background-color:#f0f0f0;
}*/
/*-------------------------------------------------------
 お支払い方法エリア
 ------------------------------------------------------*/
.paymentMethodGroup {
	margin: 0 0px 20px 0px;
    padding: 15px;
    border: 1px solid #D3D3D3;
    background: #FFFFFF;
}
.contents .table.paymentLayoutGroup {
	border: none;
	margin-bottom: 7px;
}
.contents .table.th_30 .td.selectedPaymentMethodTdSurround {
	padding: 0;
}
.paymentMethodExpIncludeItemWrap {
	background: none repeat scroll 0 0 #FAFAFA;
    border: 1px solid #DADADA;
    margin: 7px 0 0 0;
    padding: 10px 10px 5px 10px;
    width: auto;
}
.paymentMethodExpIncludeItemWrap .items {
	background: none repeat scroll 0 0 #f1f1f1;
    border: 1px solid #DADADA;
    margin: 0 0 5px 0;
    padding: 10px;
    width: auto;
}
.atoneExpIncludeItemWrap {
	background: none repeat scroll 0 0 #FAFAFA;
    border: 1px solid #DADADA;
    margin: 7px 0 0 0;
    padding: 10px 10px 5px 10px;
    width: auto;
}
.atoneExpIncludeItemWrap .items {
	background: none repeat scroll 0 0 #f1f1f1;
    border: 1px solid #DADADA;
    margin: 0 0 5px 0;
    padding: 10px;
    width: auto;
}


/** 確認ボタン */
#memberInputButtonGroup {
	margin: 25px auto 0;
}
#memberInputButtonGroup input.btn_lg[type="button"] {
	max-width: 500px;
	height: auto;
	line-height: 1.5;
	margin: 0 auto;
}

/** 生年月日テキストエリア */
#birthdayYear {
	width: 130px;
}

select.birthdayMonth,
select.birthdayDay {
	width: 80px;
}

div#selectedSalesGoodsCodesItemWrap {
	display:block;
	vertical-align: middle;
}

div#nullThSurround {
	padding: 10px 20px;
}

.td[class*="sexTdSurround"] input[type="radio"] {
    display: inherit !important;
}

@media screen and (max-width: 960px) {
	.td[class*="sexTdSurround"] input[type="radio"] {
		margin-right: 10px;
	}
}

.td[class*="sexTdSurround"] .radiobuttonLabel {
    border: 0px !important;
    padding: 10px 10px 10px 20px;
    height: auto !important;
}

.td[class*="sexTdSurround"] .radiobuttonLabel.checked {
	color: inherit;
    background: inherit;
}

.td[class*="sexTdSurround"] .radiobuttonLabel::before {
	display: none !important;;
}


#sex_0_label{
	width: auto;
	line-height: 10px !important;
}
#sex_1_label{
	width: auto;
	line-height: 10px !important;
}
#sex_2_label{
	width: auto;
	line-height: 10px !important;
}

#selectedSalesGoodsCodesTdSurround .items .radiobuttonLabel{
	height: inherit;
	line-height: 30px;
    padding: 10px 10px 10px 50px;
}

.alertMessageContent {
	white-space: break-spaces;
}

#pointTitleItemWrap{
	width: 40%;
    float: left;
}

#easiitMileIncludeItemWrap{
	width: 55%;
    float: right;
    margin-bottom: 10px;
}
#pagePartsHtmlText_AboutMilePoint_innerId > div{
	display: flex;
}

@media screen and (max-width: 960px) {
	#pointTitleItemWrap{
		width: 100%;
	    float: inherit;
	}

	#easiitMileIncludeItemWrap{
		width: 100%;
	    float: inherit;
	    margin-bottom: 10px;
	}
}