@charset "UTF-8";
/* ここでは全ページ共通の動作を記入する */
/* 個別のページで独自の動作が必要な場合は各ページ用のcssファイルに記述 */

/* レスポンシブ設定：～1280px */
@media screen and ( max-width : 1280px){
	.product_box,
	.information .support_box .information_item{
	    width: calc(100% / 2);
		max-width:  calc(100% / 2);
		flex-basis: calc(100% / 2);
	}
	.product_name{
		font-size:100%;
	}
	.product_table_index .product_name .product_name_inner,
	.product_table_category .product_name .product_name_inner {
		height: 2.4em;
	}
	/* ハンバーガーメニュー */
	.hbg_menu_btn{
		display:none;
	}
	/* ドロワーメニュー背景 */
	.hbg_menu_back{
		display:none;
	}
}

/* レスポンシブ設定：～800px */
@media screen and ( max-width : 800px){
	/* Edgeのみ */
	@supports (-ms-ime-align: auto) {
		body{
			margin-top: 0px;
			margin-bottom: 0px;
		}
	}

	/* メインカラム（中央＋右） */
	#maincontents{
		width: 100%;
	}
	/* ヘッダー */
	.header_back{
		height: 20vmin;
	}
	.header_back .header_image{
		background-image: url(https://img.amiami.jp/images/sitecontents/header/sp_header_j.png);
		background-size: contain;
		background-repeat: no-repeat;
		height: 20vmin;
		width: 100%;
		background-position: center;
	}
	.header_back .header_logo {
		opacity: 0;
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.header_back .header_logo img {
		max-width: none;
	}
	/* ヘッダーバナー */
	.headerbanner {
		width: 100%;
		max-width: 100%;
		height: auto;
		position: relative;
		top: auto;
		right: auto;
		margin-bottom: 2px;
		padding: 2px 4px;
		box-sizing: border-box;
		border-top: 1px solid #cccccc;
		border-bottom: 1px solid #cccccc;
	}
	.headerbanner .viewport {
	    margin: 4px 0px;
	}
	.headerbanner .viewport #flipsnap .item{
		width: calc(100vw - 80px);
		max-width: 468px;
		height: auto;
	}
	/* 検索窓 */
	.searchbox{
		margin: 0;
		margin-top: 2px;
		margin-bottom: 5px;
	}
	.searchbox_left{
		width: 0%;
		flex-basis: 0%;
		max-width: 0%;
	}
	.searchbox_center{
		width: 72%;
		flex-basis: 72%;
		max-width: 72%;
	}
	.searchbox_right .header_btn.cart,
	.searchbox_right .header_btn.mylist{
	 	background-position-x: center;
	 	padding: 0;
	}
	.searchbox_right .header_btn.cart:before,
	.searchbox_right .header_btn.mylist:before{
		content: "";
	}
	/* インデックスアンカー */
	.index_anchor_area_pc{
		display:none;
	}
	.index_anchor_area_sp{
		display:block;
	}
	.index_anchor{
		flex-basis: 100% !important;
		width: 100% !important;
		position: relative !important;
		height: auto !important;
	}
	.index_anchor dt{
		margin-bottom: 2px;
		font-size: 80%;
	}
	.index_anchor dt div {
		padding: 0px 5px;
	}
	.index_anchor dd{
		display: inline-grid;
		flex-basis: 50%;
		width: 50%;
	}
	/* ユーザーインフォ */
	.userinfo {
		float: none;
		width: 100%;
	}
	.userinfo .userinfo_notice .userinfo_notice_inner{
		background-size: contain;
		text-align: center;
		padding: 4px;
	}
	.userinfo .userinfo_notice .userinfo_notice_inner:hover{
		background-size: contain;
		background-position: left 3% top 50%;
	}
	.userinfo .userinfo_data2{
		float:left
	}
	/* ランキング */
	.ranking_to_all a{
		display: block;
		text-align: center;
	}
	.productrank .rank img {
		height: 5vw;
	}
	/* 中央バナー */
	#flipsnap_center .item {
		width: calc(80vw - 12px);
	}
	/* お知らせ */
	.view_attention_history a{
		display: block;
		text-align: center;
	}

	/* 商品ボックス */
	.product_box{
		width: calc(100% / 4);
		max-width: calc(100% / 4);
		flex-basis: calc(100% / 4);
	}
	.product_img{
		float: left;
		display: block;
		width: 100%;
		height: auto;
	}
	.product_img img {
		max-width: unset;
	}
	.product_icon {
		position: absolute;
		top: 0px;
		left: 0px;
		margin: 1px;
		max-width: calc(100% - 112px);
		z-index: 1;
		overflow: unset;
	}
	.product_name{
		width: 100%;
		position: relative;
		top: 0;
		left: 0;
		padding: 1px;
		background-color: rgba(255,255,255,0.75);
	}
	.product_day {
		position: absolute;
		top: 0;
		right: 0;
		width: 100%;
		height: 1.5em;
		padding: 2px;
		color: #666666;
		font-size: 76%;
		text-align: right;
		white-space: nowrap;
		overflow: hidden;
		background-color: rgba(255,255,255,0.75);
		border:none;
		padding: 4px 5px;
	}
	.product_text {
		float:left;
		width: 100%;
	}
	.product_price {
		width: auto;
		height: auto;
		margin: 0px;
		padding: 0px 3px;
		background-color: rgba(255,255,255,0.75);
	}
	.product_off {
		float: left;
		min-width: calc(100% - 100px);
		font-size: 76%;
		margin: 0;
		padding: 0 3px;
		text-align: right;
		white-space: unset;
	}
	.product_table_index .product_name .product_name_inner,
	.product_table_category .product_name .product_name_inner{
		height: 3.6em;
	}
	.product_table_list .product_name .product_name_inner {
		height: 3.6em;
	}
	/* アイコン */
	.icon_preorder{width:25px;}
	.icon_backorder{width:25px;}
	.icon_instock{width:25px;}
	.icon_stock{width:25px;}
	.icon_newitem{width:25px;}
	.icon_preowned{width:25px;}
	.icon_pickup{width:25px;}
	.icon_imageupdate{width:25px;}
	.icon_addmovie{width:25px;}
	.icon_freeship{width:25px;}
	.icon_amibonus{width:25px;}
	.icon_sale{width:25px;}
	.icon_text{width:25px;}

	.icon_backorder:before{content:"取寄";}
	.icon_freeship:before{content:"送０";}
	.icon_amibonus:before{content:"特典";}
	.icon_sale:before{content:"SALE";}

	/* ハンバーガーメニュー */
	.hbg_menu_btn{
		display:block;
	}
	/* ドロワーメニュー */
	.hbg_menu_area{
		display: block;
		position: absolute;
		top: 0;
		left: -100vw;
		z-index: 12;
		width: 87vw;
		height:100vh;
		border-top: 20px solid #eeeeee;
		transition: left 0.3s ease-out;
		box-sizing: border-box;
	}
	.hbg_menu_area .inc_txt2{
		display:block;
		border-top: 1px solid rgba(128,128,128,1);
	}
	.drawer_back{
		display:block;
		top: 0;
		left: -100vw;
	}

	/* 検索条件 */
	.search_condition_index{
		text-align: center;
		font-size: 100%;
		font-weight: bold;
	}
	.search_condition .condition_title {
		border-radius: 0 !important;
		-webkit-border-radius: 0 !important;
		-moz-border-radius: 0 !important;
	}
	.navigation_menu #navigation {
		padding: 0px;
	}
	.navigation_menu #navigation li {
		border-top: none;
		flex-basis: 100%;
		max-width: 100%;
		width: 100%;
	}
	.navigation_menu #navigation .navi_01{
		border: none;
		border-bottom: solid 1px #cccccc;
	}
	#header #navigation{
		display:none;
	}
	.navigation_menu #drawer{
		display:block;
		border-top: 1px solid rgba(128,128,128,1);
	}
	.navigation_menu .navi_01,
	.navigation_menu .navi_02,
	.navigation_menu .navi_03,
	.navigation_menu .navi_04,
	.navigation_menu .navi_05,
	.navigation_menu #drawer #drawer_genre dt,
	.navigation_menu #drawer #drawer_genre dd{
		background-color: rgba(255,255,255,0.9);
	}

	.browsenode {
		padding: 0px;
		margin-bottom: 0px;
	}
	.browsenode dt {
		margin-top: -1px;
		border-radius: 0px;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		height: 8vmin;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		-webkit-justify-content: center;
		justify-content: center;
		background-color: rgba(255,255,255,0.9);
		border-color: rgba(192,192,192,1);
		text-align: center;
		font-size: 130%;
	}
	.browsenode dd {
		padding-left: 0px;
		background-color: rgba(255,255,255,0.9);
		border-radius: 0px;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
	}
	.browsenode dd ul {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		background: none;
		justify-content: start;
		box-sizing: border-box;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.browsenode dd ul li ,
	.browsenode dd ul div li {
		height: 50px;
		width: 50%;
		flex-basis: 50%;
		font-size: 100%;
		float: left;
		line-height: 1em;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		-webkit-justify-content: center;
		justify-content: center;
	}
	.browsenode dd ul li .text,
	.browsenode dd ul div li .text{
		padding-left: 0;
		text-align: center;
	}
	.browsenode dd ul li a,
	.browsenode dd ul div li a{
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		-webkit-justify-content: center;
		justify-content: center;
	}
	.browsenode .grouptitle{
		font-size: 100%;
		text-align: center;
	}
	.browsenode .grouplist li{
		font-size: 100%;
	}
	/* バナー */
	.banner_area{
		padding: 16px 4px;
		border-top: 1px solid #cccccc;
		width: 100%;
		max-width: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		justify-content: space-around;
		box-sizing: border-box;
	}

	/* レフトナビ */
	.leftnavi {
		padding: 16px 0px;
		border-top: 2px solid #cccccc;
		width: 100%;
		max-width: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		justify-content: space-around;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.leftnavi .inc_txt2{
		display:none;
	}
	.leftnavi_blank {
		display: none;
	}
	.leftnavi_a,
	.leftnavi_b,
	.news_area,
	.sns_area {
		float: left;
		width: 100% !important;
		max-width: 100% !important;
	}
	/* SNS */
	.parts_ahn {
		max-width: 100%;
	}
	.blog_table_inner {
		width: 100%;
	}
	.blog_table_inner:hover {
		transform: scale(1.0);
		background-color: initial;
	}
	.blog_table_inner .blog_title {
		line-height: 1em;
		max-height: 100%;
	}
	.blog_table_inner:hover .blog_title {
		width: 100%;
		max-height: fit-content;
		left: 0%;
		bottom: auto;
	}
	.blog_table_inner:hover .blog_title div {
		background-color: #ffffff;
		font-size: 100%;
		border: none;
	}
	.blog_table_inner:hover .blog_date{
		color:#ffffff;
	}
	.blog_table_inner:hover .blog_image img{
	}
	.blog_table_inner:hover .blog_tag {
		left: 0;
		width: auto;
	}
	.blog_image {
		width: 100%;
		max-width: 40%;
		float: left;
	}
	.blog_title {
		bottom: 0;
		font-size: 100%;
		position: relative;
		max-width: 60%;
		float: right;
	}
	.blog_date {
		font-size: 80%;
		position: absolute;
		right: 0;
		bottom: -2px;
	}

	/* カレンダー */
	.calendar_area{
		padding: 16px 6px;
		width: 100%;
		max-width: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		justify-content: space-around;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.calendar_header{
		width: 100%;
		max-width: 100%;
	}
	.calendar_main{
		max-width: 48%;
		box-sizing: border-box;
	}

	/* インフォメーション */
	.information{
		width: 100%;
		clear: both;
	}
	.information .heading_07 {
		clear: both;
	}
	.information .support_box .information_item{
		width: 100%;
		max-width: 100%;
		flex-basis: 100%;
	}

	/* フッター */
	#footer .contents_list li {
		clear: left;
		width: 100%;
		text-align: center;
	}
	#footer .contents_list li:after{
		content:"";
	}
}

/* レスポンシブ設定：～480px */
@media screen and ( max-width : 480px){
	/* 商品ボックス */
	.product_box{
		width: calc(100% / 2);
		max-width: calc(100% / 2);
		flex-basis: calc(100% / 2);
	}
	.product_table_index .product_name .product_name_inner,
	.product_table_category .product_name .product_name_inner{
		height: 2.4em;
	}
	.product_table_list .product_name .product_name_inner {
		height: 2.4em;
	}
	.product_off {
		font-size: 100%;
	}
}
