@charset "utf-8";
/* マイページ css */

/* 共通 */
.page-ttl { margin-bottom: 3.5rem; }
.hello { 
	text-align: center;
	border-bottom: 1px solid #cccccc;
    padding-bottom: 0.5rem;
    margin-bottom: 4rem;
	font-weight: bold;
}
.caption { margin-bottom: 4rem; }
.logout { 
	text-align: right;
}
.logout a { display: inline; }
#share { padding-top: 10rem; }

/* マイページ下層共通 */
.menu-bottom {
	background: #F9F9F7;
    padding: 2rem 2rem 1rem;
	margin-top: 6rem;
}
.menu-bottom ul li {
	width: calc(50% - 5px);
	margin-bottom: 10px;
}
.menu-bottom ul li:nth-child(even) { margin-left: 10px; }

/* ページャー */
.pager { 
	display: inline-block;
	float: none;
}
#area div:first-of-type .pager { margin-bottom: 2.5rem; }
#area div:last-of-type .pager, #area section > .pager { margin-top: 2.5rem; text-align: center; }
.pager { margin-top: 1.4rem; }
.pager a { text-align: center; }

h3 { margin-bottom: 1.5rem; }

/* テーブル */
td > .btn-str { line-height: 3rem; }
#delivery_wrap .td-1, #delivery_wrap .td-5, #delivery_wrap .td-6 { width: 100px; }
#delivery_wrap .td-2 { width: 180px; }
#delivery_wrap .td-3 { width: 120px; }
#delivery_wrap .td-4 { min-width: 180px; }
#delivery_wrap .td-7 { width: 120px; }
#delivery_wrap .td-8 { width: 120px; }
td .btn-str a { letter-spacing: 0; }
table td p a {
    clear: both;
    line-height: 2rem;
}

/* マイページトップ */
#mypage-top ul li a {
	height: 5.6rem;
	line-height: 5.6rem;
	position: relative;
	display: inline-block;
	padding: 0 0 0 16px;
	color: #1e1e1e;
	vertical-align: middle;
	text-decoration: none;
	font-size: 15px;
}
#mypage-top ul li a::before,
#mypage-top ul li a::after{
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}
#mypage-top ul li a::before{
	right: 20px;
	box-sizing: border-box;
	width: 4px;
	height: 5px;
	border: 5px solid transparent;
	border-left: 7px solid #1e1e1e;
}
#mypage-top ul li p {
	margin-left: 18px;
}
#mypage-top ul li a img {
	margin: 1.5rem 5px 0 0;
    display: inline;
    float: left;
}

/* 購入・配送履歴 */
#delivery_wrap p.caption:first-of-type { margin-bottom: 2rem; }

/* 購入・配送キャンセル */
#deli-check_wrap .caption { margin-bottom: 1.5rem; }
#deli-check_wrap td img {
	width: auto;
    height: 175px;
}
#deli-check_wrap h3, #cart-pay-check_wrap h3 { margin-bottom: 1.5rem; }
#deli-check_wrap table .td-1 { width: 284px; }
#deli-check_wrap table .td-2 { width: 220px; }
#deli-check_wrap table .td-3 { width: 240px; }
#deli-check_wrap table .td-4, #deli-check_wrap table .td-6 { width: 90px; }
#deli-check_wrap table .td-5 { width: 70px; }
#deli-check_wrap table .code { 
	float: none;
	margin-bottom: 8px;
    letter-spacing: 0;
    line-height: 2rem;
}

/* 購入・配送キャンセル完了 */
#cancel_fix { margin: 8rem 0 0; }
#cancel_fix p { text-align: center; }


@media screen and (max-width:1024px){
	/* テーブル */
	#delivery_wrap .td-1, #delivery_wrap .td-5 { width: 90px; }
}

@media screen and (max-width:999px) {
	/* 全体 */
	.page-ttl { margin-bottom: 2.5rem; }	
	.logout {
		font-size: 10px;
		font-size: 1rem;
		margin-top: 0.5rem;
	}
	.page-ttl_wrap { margin: 2rem auto 3rem; }
	 table.default tr { border-top: 3px solid #ccc; }
	 table.default tr:first-child { border-top: none; }
	table.default td {
		display: table;
		width: 100%;
		border-left: none;
		border-top: 1px dashed #c2bdbb;
		border-bottom: 0;
		max-width: none;
		margin: 0;
		text-align: left !important;
		padding: 1rem 10px;
	}
	 table.default td:first-child { border-top: none; }
	 table.default td span, table.default p { 
		display: table-cell;
		float: left;
	}
	 table.default td span { padding: 1rem 0 0 10px; }
	 table.default td span.write { padding: 1rem 0 1rem 10px; }
	 table.default p	{ padding: 1rem 10px; }
	 table.default td.cancel { 
	 	display: block;
		padding: 1rem 10px !important;
	}
	table.default td.cancel div { 
		width: 70%;
		margin: 0 auto;
	}
}

@media screen and (max-width: 999px) {
	/* 共通 */
	.hello { margin-bottom: 3rem; }
	.caption { margin-bottom: 3rem; }
	#share { padding-top: 0; }
	
	/* マイページ下層共通 */	
	.menu-bottom ul li:nth-child(even) { margin-left: 0; }
	.menu-bottom { 
		margin-top: 3.5rem;
		padding: 1rem;
	}
	#mypage-top ul li a {
		height: 4.8rem;
		line-height: 4.4rem;
	}
	#mypage-top ul li a img { margin-top: 1rem; }
	
	/* テーブル */
	table.default td.td-btn {
		display: block;
		padding: 1rem 10px !important;
	}
	table.default td.td-btn .btn-border {
		display: block;
		float: none;
		padding: 0;
	}
	table.default div {
		clear: both;
		overflow: hidden;
		margin: 1rem 10px;
	}		
	
	/* マイページトップ */
	#mypage-top ul li { 
		width: 100%;
		margin-bottom: 0;
	}	
	#mypage-top ul li p { display: none; }
	
	/* 購入・配送キャンセル確認 */
	table.default td:first-of-type img {
		float: none;
		display: block;
		margin: 0 auto;
		padding-top: 0.5rem;
	}
	#deli-check_wrap table .code { 
		padding: 0 10px;
		margin-bottom: 0.5rem;
		float: left !important;
	}
	#deli-check_wrap { margin-bottom: 2rem; }
	
}