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

body { width:100%; font-size:100%; overscroll-behavior: none;}

#content{ width:100%;}
#footer { width:100%;}

#wrapper {  border-top:none;}
#base { width:100%; margin:0 !important;}
    
#main{ margin-top: 10px;}
#browseMain{ 
	margin-top: 10px;
	user-select: none; /* CSS3 */
	-moz-user-select: none;
}



/* PHONE NAV */
    
.sm{ display: block;}
.pc{ display: none;}

#header { position: relative;}
#header #Navi { display: block;}
#header .nav_btn,
#header .nav_btn span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
#header .nav_btn {
  position:absolute; top:10px; right: 15px;
  width: 30px;
  height: 25px;
  background: none;
  border: none;
  appearance: none;
  cursor: pointer;
}
#header .nav_btn span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 4px;
  background-color:#2559A6;
  border-radius: 4px;
}
#header .nav_btn span:nth-of-type(1) { top: 0;}
#header .nav_btn span:nth-of-type(2) { top: 10.5px;}
#header .nav_btn span:nth-of-type(3) { bottom: 0;}
#header .nav_btn.active span:nth-of-type(1) { transform: translateY(10.5px) rotate(-45deg);}
#header .nav_btn.active span:nth-of-type(2) { opacity: 0;}
#header .nav_btn.active span:nth-of-type(3) { transform: translateY(-10.5px) rotate(45deg);}
#header .type_list { position: relative; z-index: 999; background: #f5f5f5; border-bottom: 1px solid #dedede;}
#header .type_list ul { padding:20px; overflow:hidden;}
#header .type_list ul li { margin:1%; background:#fff;}
#header .type_list ul li a { display: block; padding:15px 20px; color: #333; text-decoration: none;}
#header .type_list ul li a:hover { background: rgba(255,255,255,0.10);}
#header .type_list ul li a img { margin-left:20px; padding: 0 !important; width:25px !important; height:25px !important; vertical-align: middle;}
#header .type_list ul li a i.material-icons { margin-left:20px;}

#header .headerlogo { float: left;}
#header .logo_img {float:left;}
#header .logo_txt { float:left; width:180px; 
    word-wrap: break-word;
    overflow-wrap: break-word;
}
#header .logo_img {margin:7px 0 0 5px; padding:10px 0;}
#header .logo_img a { display: block; width:100px; height:25px; background-size: 100px auto; }
#header .logo_txt { margin:10px; padding:5px; font-size:11px; border-left:1px solid #ddd;}

#header .headernav p { display: none;}
#header .headernav p#cartParent { 
    display:block;
    position: absolute !important; top:5px!important; right:80px!important;
}
#header .headernav a img { width:30px; height: auto;}
#header .headernav p#cartParent b { display:none;}
#header .headernav #numItems .iconbadge { position: absolute; top:3px; right:-25px;}
#header .headernav i.material-icons { font-size: 30px!important;}


#header .h_box1 { padding:0 15px 0;}
#header .h_box2 { padding:5px 15px;}
#header .breadcrumb,
#header .gnav { float:none; width:100%; font-size:12px; line-height:20px;}
#header .gnav ul li:nth-child(2),
#header .gnav ul li:nth-child(3){ display:none !important;}
#header .gnav ul li img { width:25px;}
#header .gnav ul li i.material-icons  { font-size:24px!important;}
#header #goPage { width:80px; height:30px; font-size: 14px; }
#header #goPageButton { height:30px; font-size:12px !important; line-height:12px;}


#footer ul { float:none; padding:5px 0 20px; text-align: center;}
#footer ul li+li { margin-left:10px;}
#footer ul li a:link {font-size: 70%;}
#footer .copy { float:none; padding: 20px 0 0; text-align: center; border-top:1px solid #dedede;}	


/* PAGENATION */
.pagination { margin:10px 0 20px; max-width:160px; border-radius:0 !important;}
.pagination>li  { display: none;}
.pagination>li.first,
.pagination>li.prev,
.pagination>li.next,
.pagination>li.last { display: block;}
.page-item .page-link { border: none!important;}
.page-item.disabled .page-link i.material-icons  { color: #B5B5B5 !important;}

	
/* PHONE CATEGORY NAV */	
.head_sbnav { position:relative; z-index: 9999;}
.head_sbnav .tab {}
.head_sbnav .tab::after { /*float_clear*/ display:block; clear:both; content:"";}
.head_sbnav .tab li a,
.head_sbnav .tab li {
	display: block;
	float:left;
	width: 33.3%;
	height: 45px;
	line-height: 45px;
	border: none;
	color: #fff;
	text-align: center;
	border-right:1px solid #eee;
	border-bottom:1px solid #eee;
	box-sizing: border-box;
	font-size: 100%;
}
.head_sbnav .tab li a {width: 100%;}
.head_sbnav .tab li:nth-child(3n) { border-right:none;}
.head_sbnav .content { position: absolute; width: 100%;}
.head_sbnav .content div { padding-bottom: 20px; height:auto; background: rgba(0,0,0,0.80);}
.head_sbnav .content div ul { padding: 20px; }
.head_sbnav .content div ul li+li { margin-top: 1px;}
.head_sbnav .content div ul li a { display: block; padding: 15px; color: #222; text-decoration: none; background: #fff url(../../image/arrow7.png) no-repeat 96% center; background-size: 10px auto;}
.head_sbnav .hide { display:none;}
.head_sbnav .close {
	margin:10px auto 0;
	width:50%;
	padding: 20px;
	text-align: center;
	color: #000;
	background: #fff url(../../image/close.png) no-repeat 20px center;
	background-size: 10px auto;
	border: none;
	box-sizing: border-box;
}	    
    
    
/* 商品カテゴリー 大 */

h2.category{ font-size:1.2em; margin-bottom: 40px;}

.cate-box{ margin: 0 5%;}
.cate-box li{
    width:45%;
    margin-right:10%;
    display:block;
    float: left;
    margin-bottom: 20px;
}
.cate-box li:nth-child(2n){ margin-right: 0;}
.cate-box li:nth-child(3n){ margin-right: 10%;}
.cate-box li:nth-child(6n){ margin-right: 0;}
.cate-box li .img{ width:100%; height:auto;}
.cate-box li img{ width: 100%;}
    

/* 商品カテゴリー 小 */
    
.cate-box-sub{ margin: 0 5%;}
.cate-box-sub li{
    width:45%;
    margin-right: 10%;
    margin-bottom: 20px;
    display:block;
    float: left;
}
.cate-box-sub li:nth-child(2n){ margin-right: 0;}
.cate-box-sub li:nth-child(3n){ margin-right: 10%;}
.cate-box-sub li:nth-child(6n){ margin-right: 0;}
.cate-box-sub li .img{ width:100%; height:auto;}
.cate-box-sub li img{ width: 100%;}

.topCategory {
    height:100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}


    
/* 検索画面 */
    
h2.search{ font-size:1.2em; margin-bottom: 40px;}
.search-area{ padding-top: 0;}
 .search-area th{
    display: block;
    width:100%;
    font-weight:bold;
    padding:0.5em 1.0em 0 0;
    text-align:left;
}
.search-area td{
    display: block;
    width:100%;
    padding:0.5em 1.0em 0 0;
}
.search-area td span{ display: block;}
.search-area td span+span{ margin:0.5em 0 0;}


/* 検索結果画面 */
    
.search-result-area{ margin:0 4%;}
.search-result-area th{ background: #EEE; text-align: left!important;}
.search-result-area th .sm{ padding-left:1.0em;}
.search-result-area th table{ display: none;}

.search-result-area td table{ border-right: none!important;}
.search-result-area td td{ border-top: none!important; display: block; padding: 0; }
.search-result-area td td:nth-child(1){ padding: 0; width: 100%; text-align: left; }
.search-result-area td td:nth-child(2){ padding: 0; width: 100%; border-left: none;}

    
/* カートイン画面 */
.list-area table{ display: none;}
.list-area { height: calc(100vh - 130px) !important; overflow: scroll;}
.cart_list{ display: block;} 
.cart_list .cart_in{
	position: relative;
    border-bottom: 1px solid #000;
    padding:0.5em 0.5em 1.5em;
    overflow-x: hidden;
}
.cart_list .cart_in:last-child { border-bottom: none;} 
.cart_list .cart_in .del{ position: absolute; bottom:5px; right:5px;}
.cart_list .cart_in .del input{ background: #c9caca; border: none;}
.cart_list .cart_in .zaiko{ clear: both; padding-top:0; float: left;}
.cart_list .cart_in .num{ float: right; text-align: right; width: 150px;}
.cart_list .cart_in .num input{ margin: 0 0.5em; }  
.cartDetail .photo { float: left; width: 100px; margin-right: 0.5em !important; text-align:center !important; overflow: hidden;}
.cartDetail .photo img { border: 1px solid #000;}    
.cartDetail ul { overflow: hidden;}
.cartDetail div.info,
.cartDetail div.zaiko,
.cartDetail ul li { position: relative !important; padding-left:70px; text-align: left;}
.cartDetail div.info span,
.cartDetail div.zaiko span,
.cartDetail ul li span {
	display:block;
	position: absolute !important; top:5px !important; left:0;
	margin-right:5px;
	padding: 2px 0;
	width: 60px;
	font-size: 10px;
	line-height: 12px;
	color: #fff;
	text-align: center;
	background: #333;
}
.cartDetail div.zaiko b { margin:0; padding: 0;}
.cartDetail .s_code li { float: left; margin-bottom: 10px; width: 50%;}

/* カートインボタン
.btn-area .btn,
.btn-area .btn a{ display:block; }
 
.btn-area .btn,
.btn-area .btn a.search{ display:block;}  */
	
/* 閉じるボタン */
.cloce_btn { top:50px !important;}

/* ページめくりボタン */
#prevPageButtonSP {
	opacity: 0.5;
	position: fixed;
	left:0;
	top: 50%;
	width: 25px;
	height: 50px;
	z-index: 9999;
	text-indent: -9999px;
	background:#000 url(../images/common/book_arrow.png) no-repeat left center;
	background-size: auto 100%;
}

#nextPageButtonSP {
	opacity: 0.5;
	position: fixed;
	right:0;
	top: 50%;
	width: 25px;
	height: 50px;
	z-index: 9999;
	text-indent: -9999px;
	background:#000 url(../images/common/book_arrow.png) no-repeat right center;
	background-size: auto 100%;
}
    


#cartList {
  overflow-y: scroll;
  display: block;
	table-layout: fixed;
	word-wrap: break-word;
  border: solid 1.1px;
}
#cartListSM {
  overflow-y: scroll;
  display: block;
	table-layout: fixed;
	word-wrap: break-word;
  border: solid 1.1px;
}

#modal-content {
	position: fixed ;
	width:100vw !important;
	height:100vh !important;
	padding:50px 20px !important;
	z-index:999999999999 !important;
	user-select: none !important; /* CSS3 */
	-webkit-user-select: none !important;
	-moz-user-select: none !important;
}  
#modal-overlay {
	display: none ;
	position: fixed ;
	top: 0 ;
	left: 0 ;
	width:100vw !important;
	height:100vh !important;
	background-color: rgba( 0,0,0, 0.75 ) ;
	z-index:9999999 !important;
	user-select: none !important; /* CSS3 */
	-webkit-user-select: none !important;
	-moz-user-select: none !important;
}
#messageModal {}
#addToCartButton {
    position:fixed;
    bottom:0px;
    right:0px;
    z-index:999999999 !important;
	width: 100%;
    background-color:none;
}
#addToCartButton .cart-btn .btn  { padding:0; border: none; border-radius:0; width: 100% !important;}
#addToCartButton .cart-btn .btn a { display: block; border-radius:0; width: 100% !important;}

#main {margin-bottom:70px;}
	
#p_index .box dd p { width:18.2%;}
#p_index_cate { padding: 5% 2%;}
#p_index_cate a { 
    display: block;
    padding: 5px 0;
    color: #222;
    text-align: center;
    text-decoration: none;
    background: #ddd;
    border-radius: 5px;
}	

.search-box {
    text-align: center;
    width: 90vw;
}

.inquery-box {
    text-align: left;
    width: 100%;
    height: 4em;
}
.inquiry-kyozai {
    text-align: left;
    margin-left: 0em !important;
}


.movieIcon {
    flex-wrap: wrap; /* 端まで来たら折り返す */
    justify-content: center; /* センター寄せ */
}

.movieIcon a {
    max-height: 200px;
    border-radius: 40px;
     background-color: blue;
      width: 100%; /* 黒い枠一つ分のサイズ */
      height: 300px;
      margin-bottom: 10px; /* まわりのマージン */
      background: #2559A6;
      color: #FFF;
      display: flex; /* 内包するspanの位置調整のためのflex【重要】 */
      align-items: center; /* aの要素の中の縦の中心に揃える指定【重要】 */
}

.movieIcon a span {
    font-size: 21px;
    width: 100%; /* 横幅いっぱいに表示 */
    text-align: center; /* 横の中央揃え */
    padding: 10px; /* 余白の指定 */
    box-sizing: border-box; /* 全体のwidthから余白分がはみ出さないように（念のため） */
}

.infoBox {
    max-height: 25vh;
    overflow: scroll;
    max-width: 100%;
    margin-left: 4%;
    margin-right: 4%;
}


}
