@charset "UTF-8";

@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,500&display=swap&subset=japanese');

html {overflow-y:scroll;}

/* 共通 */
body {
	font-size:14px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	margin:0;
	padding:0;
}

fieldset {border:none;}

img {
	height:auto !important;
	vertical-align:bottom;
}

.hr_none {
	border:none;
	clear:both;
}

/* リンク */
a {
	color:inherit;
	text-decoration:none;
}

a:hover {
	color:orange;
	text-decoration:underline;
}

a img {border:none;} /* ie */

a:hover img {opacity:0.7;}

/* スマホ */
[data-sp-check="yes"] {display:block;}
[data-sp-check="no"]  {display:none;}

/* ヘッダーTOP */

@media not all and (max-width:1024px) {

	.h_top_line {background-color:#006400;}

	.h_top_line_list {
		margin:0 auto;
		padding:0;
		text-align:right;
		width:90%;
		max-width:1300px;
	}

	.h_top_line_item {
		background-color:#fff;
		display:inline-block;
		font-size:12px;
		line-height:28px;
		margin-left:1px;
		word-break:keep-all;

		&:hover {background-color:#ababab;}
	}

	.h_top_line_link {
		cursor:pointer;
		display:inline-block;
		margin-left:10px;
		padding:5px 5px 0;

		&:hover {
			color:inherit;
			text-decoration:none;
		}
	}

	[data-line-color] {border-bottom:4px solid transparent;}

	[data-header-icon] {
		background-size:auto 17px;
		background-position:0 10px;
		background-repeat:no-repeat;
		padding-left:20px;
	}

	[data-header-icon="icon_toroku_btn.png"] {background-image:url("../images/icon_toroku_btn.png");}

	[data-header-icon="icon_login_btn.png"] {background-image:url("../images/icon_login_btn.png");}

	[data-header-icon="icon_logout_btn.png"] {background-image:url("../images/icon_logout_btn.png");}

}

@media (max-width:1024px) {

	.h_top_line {display:none;}

}

@media (max-width: 1024px) {

	.sp_none_2 {display:none !important;}

}

/* ヘッダー */
.top_header {
	background-color:#fff;
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
	display:flow-root;
	margin-bottom:5px;
	padding-bottom:10px;
}

/* ヘッダー コンテンツ */
.h_contents {
	margin:0 auto;
	padding:10px 0 0;

	@media (max-width:1024px) {
		width:95%;
	}

	@media not all and (max-width:1024px) {
		width:95%;
		max-width:max-content;
	}

}

.logo_link {
	display:inline-block;
	vertical-align:middle;
	width:200px;

	&:hover {
		color:inherit;
		text-decoration:none;
	}
}

.logo_img {
	display:block;
	max-width:100%;
}

/* ヘッダー 検索 */
.h_search_key {
	box-sizing:border-box;
	border:2px solid orange;
	border-radius:12px 0 0 12px;
	font:inherit;
	height:40px;
	padding:3px;
	vertical-align:bottom;
	width:calc(100% - 50px);
}

.h_search_btn {
	box-sizing:border-box;
	background-color:orange;
	border:none;
	border-top-right-radius:12px;
	border-bottom-right-radius:12px;
	color:#fff;
	cursor:pointer;
	height:40px;
	margin:0;
	padding:0;
	vertical-align:bottom;
	width:40px;
}

.h_search_btn_img {
	display:block;
	font-size:25px;
}

@media (max-width:1024px) {

	.h_search {
		display:block;
		margin:0 auto;
		padding-top:10px;
		width:95%;
	}

}

@media (max-width:600px) {

	.h_search {
		margin:0;
		width:calc(100% - 130px);
	}

}

@media not all and (max-width:1024px) {

	.h_search {
		display:inline-block;
		margin:0 10px;
		vertical-align:middle;
		width:550px;
		max-width:calc(100% - 550px);
	}

}

/* ヘッダー ナビ */
.h_nav_list {
	margin:0;
	padding:0;
}

.h_nav_item {
	display:inline-block;
	list-style-type:none;
	text-align:center;
}

.h_nav_item + .h_nav_item {border-left:1px solid #707070;}

.h_nav_link {
	font-size:13px;
	line-height:1.6;
}

.h_nav_link:hover {
	color:inherit;
	text-decoration:none;
}

.h_nav_img {display:block;}

@media only all and (min-width:1025px) {

	.h_nav {
		display:inline-block;
		vertical-align:middle;
	}

	.h_nav_item {padding:0 8px;}

	.h_nav_img {margin-bottom:2px;}

}

@media only all and (max-width:1024px) {

	.h_nav {
		display:block;
		padding-top:10px;
	}

	.h_nav_img {margin:0 auto 2px;}

}

@media only all and (max-width:1024px) and (min-width:513px) {

	.h_nav {text-align:center;}

	.h_nav_item {width:16%;}

}

@media only all and (max-width:512px) {

	.h_nav_item {width:24%;}

	.h_nav_item:nth-of-type(n + 5) {display:none;}

}

/* ヘッダー 検索ワード */
.h_search_word {
	display:block;
	padding:10px 0 0;
}

.h_search_word_title, .h_search_word_item {
	display:inline-block;
	font-size:12px;
	line-height:2.1;
	word-break:keep-all;
}

.h_search_word_item {margin:5px;}

.h_search_word_link {
	border:1px solid #d2d2d2;
	border-radius:5px;
	cursor:pointer;
	display:block;
	padding:0 6px;
}

.h_search_word_link:hover {
	background:#ababab;
	color:#fff;
	text-decoration:none;
}

.h_sns_icon {
	display:block;
	float:left;
	line-height:2.4;
	margin:0 0 0 20px;
}

.h_sns_icon > * {vertical-align:bottom;}

@media not all and (max-width:1024px) {

	.h_search_word {
		float:left;
		margin:0 0 0 calc((100% - 630px) / 2);
	}

}

@media (max-width:1024px) {

	.h_search_word {
		float:left;
		margin:0 0 0 2.5%;
	}

}

/* ヘッダー sp */
@media (width <= 1024px) {

	.header_sp_box {
		background-color:#fff;
		box-shadow:0 6px 6px 0 rgba(0, 0, 0, 0.1);
		position:absolute;
		left:0;
		margin:0;
		transition:height 0.3s ease-out 0s;
		width:100%;
		z-index:99;
	}

	[data-menu-btn] {
		background-color:transparent;
		border:none;
		display:block;
		height:30px;
		line-height:1;
		margin:0;
		padding:0;
		pointer-events:auto;
		position:absolute;
		right:20px;
		width:30px;

		& span, & span::before, & span::after {
			content:'';
			display:block;
			height:3px;
			width:30px;
			border-radius:3px;
			background-color:#000;
			position:absolute;
			transition:all 0.3s;
		}
	}

	[data-menu-btn="open"] span {
		&::before {bottom:10px;}

		&::after {top:10px;}
	}

	[data-menu-btn="close"] span {
		background-color:rgba(255, 255, 255, 0);

		&::before {
			bottom:0;
			transform:rotate(45deg);
		}

		&::after {
			top:0;
			transform:rotate(-45deg);
		}
	}

	[data-page-menu-show="true"] {height:max-content;}

	[data-page-menu-show="false"] {height:0;}

	[data-page-menu-show="false"] * {display:none !important;}

	.h_top_line_list_2 {
		display: flex;
		justify-content: space-around;
		margin:10px auto;
		padding:0;
	}

	.h_top_line_item_2 {
		background-color:#fff;
		display:block;
		font-size:12px;
		line-height:28px;
		margin-left:1px;
		word-break:keep-all;
	}

	.h_top_line_link_2 {
		cursor:pointer;
		display:inline-block;
		margin-left:10px;
		padding:5px 5px 0;

		&:hover {
			color:inherit;
			text-decoration:none;
		}
	}

	[data-header-icon_2] {
		background-size:auto 17px;
		background-position:0 10px;
		background-repeat:no-repeat;
		padding-left:20px;
	}

	[data-header-icon_2="icon_toroku_btn.png"] {background-image:url("../images/icon_toroku_btn.png");}

	[data-header-icon_2="icon_login_btn.png"] {background-image:url("../images/icon_login_btn.png");}

	[data-header-icon_2="icon_logout_btn.png"] {background-image:url("../images/icon_logout_btn.png");}

	.header_sp_icon {
		position:absolute;
		right:70px;
		font-size:30px;
	}

}

@media (width > 1024px) {

	.header_sp_icon, .header_sp_box {display:none;}

}

@media (width <= 600px) {

	.header_sp_icon, [data-menu-btn] {top:80px;}

}

@media (width > 600px) {

	.header_sp_icon, [data-menu-btn] {top:10px;}

}

/* ログイン */
.sp_login {
	padding:9px 0;
	position:absolute;
	right:10px;
	text-align:center;
	top:10px;
}

.sp_login_btn {
	color:black;
	display:inline-block;
	font-size:12px;
	line-height:16px;
}

.sp_login_btn:hover {
	color:inherit;
	text-decoration:none;
}

[data-sp-icon] {
	background-size:auto 15px;
	background-position:center 0;
	background-repeat:no-repeat;
	padding:20px 5px 0;
}

[data-sp-icon="icon_login_btn.png"] {background-image:url(../images/icon_login_btn.png);}
[data-sp-icon="icon_logout_btn.png"] {background-image:url(../images/icon_logout_btn.png);}
[data-sp-icon="icon_toroku_btn.png"] {background-image:url(../images/icon_toroku_btn.png);}

/* パンくず */
.pankuzu_list {
	margin:0;
	padding:0;
}

.pankuzu_item {display:inline-block;}

.pankuzu_item + .pankuzu_item:before {
	content:'>';
	display:inline-block;
	margin:0 5px;
}

@media only all and (min-width:1025px) {

	.pankuzu_list {height:22px}

}

/* カゴの中（パンくず横） */
#cart_in {
	display:none; /* js無効時 */
	height:22px;
	margin:0;
}

@media only all and (min-width:1025px) {

	#cart_in {text-align:right;}

	.pankuzu_list + #cart_in {margin-top:-22px;}

}

@media only all and (max-width:1024px) {

	#cart_in {
		margin-top:5px;
		text-align:left;
	}

}

/* 下位ページ */
.under_main_back {
	/*background-color:#fafad2;*/
	margin:0 auto;
}

.under_main_back::after {
	clear:both;
	content:'';
	display:block;
}

@media only all and (min-width:1025px) {

	.under_main_back {
		padding:10px 20px;
		width:910px;
	}

}

@media only all and (max-width:1024px) {

	.under_main_back {
		padding:10px 2%;
		width:96%;
	}

}

/* page_body */
.page_body {
	background:#fff;
	border:1px solid #ccc;
	margin:50px 0 0;
	padding-bottom:10px;
	position:relative;
}

.page_body > .page_title + *:first-of-type {margin-top:20px;}

.page_title {
	background-color:#f0f8ff;
	font-size:16px;
	font-weight:normal;
	margin:-31px -1px 0;
}

@media only all and (min-width:1025px) {

	.page_title {
		/*background:url("../images/detail_title.png") 0 0 no-repeat;*/
		line-height:30px;
		text-indent:2em;
	}

}

@media only all and (max-width:1024px) {

	.page_title {
		/*background-color:#fff;
		border-top:3px solid #deb887;
		border-bottom:3px solid #deb887;
		border-right:1px solid #ccc;
		border-left:1px solid #ccc;*/
		line-height:24px;
		text-indent:1em;
		margin-top:-25px;
	}

}

.sub_title {
	border-bottom:1px solid #600;
	clear:both;
	font-size:16px;
	font-weight:normal;
	margin:20px 20px 10px;
	text-indent:1em;
}

.child_title {
	font-size:14px;
	margin:0 20px;
}

.child_title::before {content:'※'}

.page_para {margin:0 20px;}

.page_hr {margin:10px;}

.attention {color:red;}

.page_notice {
	display:block;
	font-size:inherit;
	margin:0 20px;
}

.page_notice_link {color:orange;}

.page_error, .page_caution {
	color:red;
	display:block;
	font-size:inherit;
	margin:10px 20px 0;
}

/* フッター */
.footer_bottom {
	clear:both;
	position:relative;

	@media (width > 1024px) {
		background-color:#f0f8ff;
		min-height:130px;
	}

}

.footer_contents {
	box-sizing:border-box;
	margin:auto;
	text-align:center;

	@media (width > 1024px) {
		bottom:0;
		padding:0 calc(50% - 475px);
		position:absolute;
		width:100%;
	}

	@media (width <= 1024px) {
		width:96%;
		max-width:950px;
	}

}

.f_nav {
	margin:10px auto 20px;
	padding:0;

	& > li {
		display:inline-block;
		margin-left:5px;

		&:not(:last-of-type)::after {content:'　';}

		& a:hover {color:inherit}
	}
}

/* コピーライト */
.copyright {font-size:12px;}

/* ページトップ */
[data-move=top] {
	bottom:20px;
	cursor:pointer;
	position:fixed;
	right:20px;
	width:40px;
}

[data-move=top]:hover {opacity:0.7;}

[data-move-top=no] {display:none;}

[data-move-top=yes] {display:block;}

.page_top {max-width:100%;}

[data-icon-link]::before {
	content:'';
	display:inline-block;
	margin:0 5px;
	vertical-align:-2px;
}

[data-icon-link=pdf]::before {content:url(../images/icon_pdf.gif);}

[data-icon-link=excel]::before {content:url(../images/icon_xls.gif);}

.foot_info_sp, .foot_info_pc {
	display:block;
	font-size:inherit;
	font-style:inherit;
	margin:10px auto;
	padding:0px;
	text-align:left;
	width:100%;
}

.foot_info_sp pre {
	font:inherit;
	font-style:inherit;
	font-size:inherit;
	margin:0;
	padding:0;
}

@media only all and (min-width:1025px) {

	.foot_info_sp {display:none;}

}

@media only all and (max-width:1024px) {

	.foot_info_pc {display:none;}

}

[data-out_link_footer] {
	position:absolute;
	top:10px;
	left:10px;
	height:50px;
}

[data-out_link_footer]:hover {opacity:0.7;}

[data-out_link_footer] > img {
	max-height:50px;
	vertical-align:bottom;
	width:auto;
}

/* */
.footer_qr_link {
	display:block;
	position:-webkit-sticky;
	position:sticky;
	bottom:36px;
	margin-left:20px;
	max-width:116px;
	max-width:min-content;
}

.footer_qr_link > img {vertical-align:bottom;}
