@charset 'UTF-8';

@media only screen and (max-width: 1280px){
	/* HEADER */
	header#header{
		padding: 1em 0 0 1em;
		padding-left: calc(1em + 100px);
	}
	a#toggle{
		top: 1em;
		left: 1em;
	}
}

@media only screen and (min-width: 992px) and (max-height: 790px){
	/* SUPER */
	#super #item-modal .item-sec{
		margin: 0;
	    height: 100vh;
	    top: 0;
	    padding-top: 6em;
	    transform: translateX(-50%);
	    overflow-y: scroll;
	}
	#super #item-modal .item-sec .item-back-btn{
		top: 1em;
	    bottom: inherit;
	    z-index: 2;
	}
	#super #item-modal .item-sec .item-back-btn a.item-close:before,
	#super #item-modal .item-sec .item-back-btn a.item-close:after{
		display: none;
	}
	#super #item-modal .item-sec .item-back-btn a.item-close{
		color: #FFF;
	    background: darkorange;
	    border-radius: .6em;
	    padding: .8em 3em;
	    display: inline-block;
	}
}

@media only screen and (max-width: 991px){
	/* SUPER */
	#super{
		padding-top: 8em;
		padding-bottom: 12em;
		display: flex;
    	flex-wrap: wrap;
	}
	#super #map{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	#super #map img{
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
	}
	#super .ornament{
		display: none;
	}
	#super .cat {
    	cursor: pointer;
    	position: relative;
    	margin-bottom: 1em;
    	width: 50%;
	}
	#super .cat>img{
		position: absolute;
    	width: 5em;
    	left: 1em;
    	top: 0;
    	z-index: 3;
    	animation-name: breathingpin;
    	animation-duration: 3s;
    	animation-delay: 0s;
    	animation-timing-function: ease;
    	animation-iteration-count: infinite;
	}
	#super .pin{
		position: relative;
		padding: 10px 20px;
	}
	#super .pin>img{
		display: none;
	}
	#super .pin h2{
		display: block;
	    position: relative;
	    padding: 1em;
	    padding-left: 6em;
	    border-radius: 10px;
	}
	#super .cart-btn{
		top: 2em;
		right: 3em;
	}
	#super a#search-open{
		bottom: 2em;
		right: 3em;
	}

	#super #overlay .inner{
		width: 100%;
	}
	#super #overlay #search-items input[type="button"].searchbtn{
		display: none;
	}
	#super #overlay #search-items{
		display: flex;
	}
	#super #overlay #search-items input{
		padding: .8em;
	}

	#super #item-modal .item-sec{
		position: relative;
	    top: 0;
	    left: 0;
	    transform: none;
	    margin: 0;
	    height: 100vh;
	    overflow-y: scroll;
	    padding-top: 5em;
	    padding-bottom: 7em;
	}
	#super #item-modal .item-sec .item-back-btn{
		left: 50%;
	    transform: translateX(-50%);
	    top: 1em;
	    bottom: inherit;
	    width: auto;
	    text-align: center;
	    z-index: 3;
	}
	#super #item-modal .item-sec .item-back-btn a.item-close{
		font-size: 14px;
		padding: 12px 2em 12px;
    	background: darkorange;
    	color: #FFF;
    	border-radius: 1em;
	}
	#super #item-modal .item-sec .item-back-btn a.item-close:before,
	#super #item-modal .item-sec .item-back-btn a.item-close:after{
		content: none;
	}
}

@media only screen and (max-width: 767px){
	/* HEADER */
	header#header{
		padding-left: calc(2em + 48px);
		width: 100%;
    	padding-bottom: 1em;
    	background: #FFF;
	}
	header#header .logo a img{
		max-height: 48px;
	}

	a#toggle{
		width: 48px;
		height: 48px;
	}
	a#toggle span{
		height: 3px;
		width: 30px;
		left: 10px;
	}
	a#toggle span:nth-of-type(1),
	a#toggle:hover span:nth-of-type(1){
		top: 13px;
	}
	a#toggle span:nth-of-type(2){
		top: 24px;
	}
	a#toggle span:nth-of-type(3),
	a#toggle:hover span:nth-of-type(3){
		top: 35px;
	}
	a#toggle.open span:nth-of-type(1){
		top: 23px;
	}
	a#toggle.open span:nth-of-type(3){
		top: 23px;
	}

	div#drawer{
		padding: 6em 2em 2em;
    	width: 100%;
	}
	div#drawer .inner{
		height: calc(100vh - 7em);
	}
	div#drawer .welcart_menu li a{
		font-size: 14px;
	}
	div#drawer .welcart_menu li a{
		padding: 6px 12px;
	}
	div#drawer .main_menu{
		max-width: 220px;
	}
	div#drawer .main_menu li a{
		font-size: 13px;
		padding: 6px;
	}
	div#drawer .ec_menu li a{
		font-size: 12px;
	}

	/* FOOTER */
	footer#footer .footer-01{
		padding: 2em 0;
	}
	footer#footer .footer-01 .logo{
		width: 100%;
	    margin: 0 0 1em;
	    text-align: center;
	}
	footer#footer .footer-01 .logo img{
		max-width: 320px;
	}
	footer#footer .footer-01 .menu{
		width: 100%;
	}
	footer#footer .footer-01 .menu ul.f-menu-01 li{
		width: 100%;
		margin: 0 0 1%;
	}
	footer#footer .footer-01 .menu ul.f-menu-01 li a{
		font-size: 12px;
	}
	footer#footer .footer-02 ul.f-menu-02{
		display: block;
	}
	footer#footer .footer-02 ul.f-menu-02 li a{
		font-size: 10px;
	}
	footer#footer .footer-02 .copyright{
		font-size: 10px;
	}

	/* PAGE */
	#content{
		padding: 0;
	}
	main.pad-top{
		padding-top: 6.2em;
	}
	#content .type-page h1.entry-title, .member-page h1.member_page_title, .cart-page h1.cart_page_title{
		font-size: 14px;
	}
	.wp-block-table table th,
	.wp-block-table table td,
	.wpcf7 table.inquiry th,
	.wpcf7 table.inquiry td{
		display: block;
		width: 100% !important;
		padding: 6px 12px;
		font-size: 13px;
	}

	/* SUPER */
	#super{
		padding-bottom: 4em;
	}
	#super .cat {
    	cursor: pointer;
    	position: relative;
    	margin-bottom: 1em;
    	width: 100%;
	}
	#super .cart-btn{
		position: relative;
	    top: 0;
	    left: 0;
	    right: 0;
	    bottom: 0;
	    text-align: center;
	    display: block;
	    width: 100%;
	    max-width: 220px;
	    margin: 1em auto;
	}
	#super a#search-open{
		position: relative;
	    display: block;
	    max-width: 220px;
	    width: 100%;
	    height: auto;
	    top: 0;
	    left: 0;
	    right: 0;
	    bottom: 0;
	    border-radius: 6px;
	    padding: 1em 2em;
	    margin: 0 auto;
	}
	#super a#search-open i{
		font-size: 14px;
		margin: 0;
		margin-right: 1em;
	}
	#super a#search-open p {
	    font-size: 14px;
	    display: inline-block;
	}

	#super #overlay h2.cat-name{
		font-size: 14px;
	}
	#super #overlay .product-list .product-box{
		width: 48%;
	}
	#super #overlay .product-list .product-box .title h3{
		font-size: 12px;
	}
	#super #overlay .product-list .product-box .title .meta{
		font-size: 10px;
	}

	#super #item-modal .item-sec .item-flex .thumb{
		width: 100%;
		margin: 0 0 2%;
	}
	#super #item-modal .item-sec .item-flex .thumb ul{
		height: auto;
		margin-bottom: 1em;
	}
	#super #item-modal .item-sec .item-flex .detail{
		width: 100%;
	}
	#super #item-modal .item-sec .item-flex .detail .detail-description{
		height: auto;
	}
	#super #item-modal .item-sec .item-flex .detail .detail-nameprice{
		display: block;
	}
	.detail-nameprice .item-name{
		font-size: 18px;
		margin-bottom: 8px;
	}
	.detail-nameprice .item-price{
		float: none;
	    margin: 0 0 1em;
	    font-size: 16px;
	    text-align: right;
	}
	#super #item-modal .item-sec .item-info .zaikostatus{
		float: none;
	    text-align: right;
	    font-size: 12px;
	    margin-bottom: 1em;
	}

	/* WELCART */
	#cart{
		overflow-x: scroll;
	}
	div.cart_navi li {
	    margin: 3px 0;
	    width: 100%;
	}
	#cart_table {
        min-width: 400px;
        font-size: 11px;
    }
    #confirm_table {
        font-size: 12px;
    }

    #super .cart-btn {
		margin: 0em auto 1em;
	}

	#super a#search-open {
		height: 51px;
	}

	#toTop {
		z-index: 9999;
	}

	.history-area {
		overflow-x: scroll;
	}
}