/*	INDEX
-------------------------------------------------
	RESET
	BASE
	HEADER
	NAVIGATION
	CONTENT
	SIDE BAR
	WIDGET
	FOOTER
	COMMENT TEMPLATE
	MISC
	HACK
*/

@charset "utf-8";
/*	BASE
-------------------------------------------------*/
*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-size: 18px;
}

html{
	margin: 0;
	padding: 0;
	color: #333333;
	line-height: 1.5;
	font-size: 16px;
	font-size: 18px !important;
	font-family: "Yu Gothic", YuGothic, "メイリオ", -apple-system,
		BlinkMacSystemFont, "Helvetica Neue", "ヒラギノ角ゴ ProN W3",
		Hiragino Kaku Gothic ProN, Arial, Meiryo, sans-serif;
}

body {
}
h1{font-size:2rem;}
h2{
	font-size:1.5rem;
	text-align:center;
	margin-bottom:2rem;
}
h3{font-size:1.2rem;}
header{
	background-color:#65BCFF;
	margin:0 auto 2rem;
}
header h1{
	font-size:2rem;
	color:#fff;
	text-align:center;
	padding:2rem;
}

main{
	max-width:1200px;
	padding:0 2rem;
	margin:0 auto 2rem;
}

/*トップページ*/
.top_page{}
.top_page .top_section{}
.top_page .top_section .login_mess{text-align:center;}
.top_page .top_section .error_message{
	text-align:center;
	color:#ff2626;
}
.top_page form{padding:0;}
.top_page form dl{
	max-width:320px;
	margin:2rem auto;
}
.top_page form dl dt{
	font-weight:bold;
	margin-bottom:0.5rem;
}
.top_page form dl dd{
	margin-bottom:1rem;
}
.top_page form dl dd input{
	width:100%;
	padding:0.2rem;
}
.top_page form div{text-align:center;}

.top_page .order_info{
	max-width:640px;
	margin:2rem auto 0;
	padding:1rem;
	border:2px solid #ccc;
	background-color:#efefef;
}
.top_page .order_info h3{
	text-align:center;
	margin:0 0 1rem;
}
.top_page .order_info dl dt{font-weight:bold;}
.top_page .order_info dl dd{margin-bottom:0.5rem;}

/*商品一覧*/
.item_list article{
	margin:0 auto 2rem;
}
.item_list article h2{
	color:#FFFFFF;
	padding:1rem 2rem;
	margin:0 0 1rem;
	background-color:#65BCFF;
	border-radius:5rem;
}
.item_list article .detail_wrap{
	display:flex;
	padding:0 1rem;
}
.item_list article .detail_wrap figure.main_images{
	width:calc(100% - 80% - 1rem);
	margin:auto 0.5rem auto 0;
}


.item_list article .detail_wrap .sub_images_wrap{
	display:flex;
	width:calc(100% - 20% - 1rem);
	margin:0 0.5rem 0 0;
}
.item_list article .detail_wrap figure.sub_images{
	width:calc(100% / 4 - 1rem);
	margin:auto 0.5rem;
}

.item_list article .detail_wrap figure img{width:100%;height:auto;}
.item_list article .detail_wrap form{
	width:240px;
	margin:auto 0 0;
}
.item_list article .detail_wrap form button{
	font-size:1.2rem;
	color:#FFF;
	font-weight:bold;
	padding:1rem 0.5rem;
	width:100%;
	background-color:#1bd834;
	border:1px solid #1bd834;
	cursor:pointer;
}

/*商品申し込み*/
.item_order_form{}
.item_order_form table{
	border-collapse:collapse;
	max-width:980px;
	width:100%;
	margin:0 auto 2rem;
	text-align:left;
}
.item_order_form table tr{
	border-bottom:2px solid #999;
}
.item_order_form table tr th{
	/*width:30%;*/
	min-width:240px;
	padding:1rem;
}
.item_order_form table tr td{
	width:100%;
	padding:1rem;
}
.item_order_form table tr td.sub_table_wrap{padding:0;}
.item_order_form table tr td.sub_table_wrap .send_info_items.hidden{display:none;}
.item_order_form table.sub_table{margin:0;}
.item_order_form table.sub_table tr th{width:auto;min-width:initial;}
.item_order_form table.sub_table tr td{width:auto;min-width:initial;}
.item_order_form table.sub_table tr:last-of-type{border:none;}
.item_order_form table tr td .order_item_info{
	display:flex;
	align-items:center;
}
.item_order_form table tr td .order_item_info img{
	display:inline-block;
	width:4rem;
	height:4rem;
	margin-right:0.5rem;
}
.item_order_form table tr td .order_item_info h3{
	margin-right:1rem;
}
.item_order_form table tr td .order_item_info a{font-weight:bold;}



.item_order_form table tr td .radio_wrap{
	display:flex;
	align-items:center;
	margin:0 0 0.5rem;
}
.item_order_form table tr td .radio_wrap:last-of-type{margin:0;}

.item_order_form table tr td input[type="radio"]{
	margin-right:0.2rem;
	width:1rem;
	height:1rem;
}
.item_order_form table tr td label{
	font-weight:bold;
	line-height:1;
	cursor: pointer;
}

.item_order_form table tr td input[type="text"],
.item_order_form table tr td textarea{
	padding:0.2rem;
	width:100%;
}
.item_order_form table tr td input.address-num,
.item_order_form table tr td select{
	width:200px;
	padding:0.2rem;
	margin-right:0.5rem;
}
.item_order_form table tr td .search_btn{
	font-size:0.8rem;
	padding:0.2rem 0.5rem;
}

.privacy_policy{
	padding:0;
	margin:0 auto 2rem;
}

.btn_wrap{
	text-align:center;
	padding:1rem;
	margin:0;
}
.btn_wrap button,
.btn_wrap a:link,
.btn_wrap a:visited{
	font-size:1.2rem;
	color:#FFFFFF;
	font-weight:bold;
	text-align:center;
	text-decoration:none;
	padding:1rem;
	margin:0 1rem;
	max-width:320px;
	width:100%;
	background-color: #1bd834;
	border: 1px solid #1bd834;
	border-radius:0.5rem;
	cursor: pointer;
}
.btn_wrap button.logout_btn{
	color:#FFFFFF;
	background-color: #999;
	border: 1px solid #ccc;
}
.btn_wrap a.select_btn{
	background-color:#65BCFF;
	border: 1px solid #2196f3;
}
.btn_wrap button:hover,
.btn_wrap a:hover{opacity:0.8;}
.btn_wrap button.return_btn{
	background-color:#999;
	border-color:#999;
}
.top_section .btn_wrap{margin-bottom:2rem;}

.completion_comment,
.notice_comment{text-align:center;}
.completion_comment h3,
.notice_comment h3{margin-bottom:1rem;}
.completion_comment p,
.notice_comment p{margin-bottom:0.5rem;}




@media (min-width: 881px) {
	.pc_none {display: none !important;}
}

@media (max-width: 880px) {
	.sp_none {display: none !important;}
	main{padding:0 1rem;}
	header h1{
		font-size:1.2rem;
		padding:1rem;
	}

	.item_list article h2{
		font-size:1rem;
		text-align:left;
		padding:0.5rem;
		border-radius: 0.5rem;
	}

	.item_order_form table tr th{width:100%;display:block;background-color:#EFEFEF;}
	.item_order_form table tr td{width:100%;display:block;}
	.item_order_form table tr td .send_info_items{padding:1rem;}
	.item_order_form table tr th:nth-of-type(2){border-top:2px solid #999;margin-top:1rem;}

	.btn_wrap button,
	.btn_wrap a:link,
	.btn_wrap a:visited{display:block;margin:0 auto 1rem;}

	.item_list article .detail_wrap{flex-wrap:wrap;}
	.item_list article .detail_wrap figure.main_images{width:50%;margin:0 auto 0.5rem;}
	.item_list article .detail_wrap .sub_images_wrap{width:50%;margin:0 auto 0.5rem;flex-wrap:wrap;}
	.item_list article .detail_wrap figure.sub_images{width: calc(100% / 2 - 1rem);margin: auto 0.5rem;}
	.item_list article .detail_wrap form{width:100%;}
	.item_list article .detail_wrap form button{font-size:1rem;padding:0.5rem;}
}
