@charset "utf-8";

/*==================================================================
	980px
==================================================================-*/

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

/* ---------------------------------------------------✁ 
	COMMON
------------------------------------------------------*/

body {
	min-width: 100%;
}

.content {
	padding-right: 15px;
	padding-left: 15px;
	box-sizing: border-box;
}



}

/*==================================================================
	800px
==================================================================-*/

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

#wpadminbar {
	top: -46px !important;
}

html {
	margin: 0 !important;
}

body {
	overflow-x: hidden;
}

.sp {
	display: block;
}

.pc {
	display: none;
}

p {
	font-size: 13px;
}

/* ---------------------------------------------------✁ 
	HEADER
------------------------------------------------------*/

#header {
	padding: 10px 0;
}

#header nav {
	display: none;
}

#header h1 img {
	height: 70px;
}


/* ---------------------------------------------------✁ 
	MODAL
------------------------------------------------------*/

.menu-trigger,
.menu-trigger span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}

.menu-trigger {
	width: 70px;
	height: 70px;
	cursor: pointer;
	z-index: 10000;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	right: 0;
	top: 10px;
	
	transform: scale(0.8);
	right: -5px;
}

.menu-trigger div {
	width: 30px;
	height: 30px;
	position: relative;
	__transform: scale(1.2);
}

.menu-trigger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 4px;
	background-color: #FFF;
	__border-radius: 4px;
}

.menu-trigger span:nth-of-type(1) {
	top: 0;
}

.menu-trigger span:nth-of-type(2) {
	top: 13px;
}

.menu-trigger span:nth-of-type(3) {
	bottom: 0;
}

.openmenu .menu-trigger span:nth-of-type(1) {
	transform: translateY(13px) rotate(-45deg);
}

.openmenu .menu-trigger span:nth-of-type(2) {
	opacity: 0;
}

.openmenu .menu-trigger span:nth-of-type(3) {
	transform: translateY(-13px) rotate(45deg);
}

#mask {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.9);
	z-index: 1000;
	cursor: pointer;
}

body.openmenu #mask {
	display: block;
}

.modal-window {
	display: none;
}

body.openmenu .modal-window  {
	display: block;
}

body.openmenu .menu-trigger span {
	background-color: #FFF;
}

#nav {
	position: fixed;
	width: 100%;
	pointer-events: visible;
	z-index: 10001;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
}

#nav li {
	text-align: center;
	margin: 10px 0;
	
}

#nav li a {
	color: #FFF;
	font-size: 30px;
	font-weight: bold;
}



/* ---------------------------------------------------✁ 
	FOOTER
------------------------------------------------------*/

#footer .logo {
	float: none;
	width: 90px;
}

#footer nav {
	padding: 10px 0;
}

#footer nav ul {
	float: none;
	margin-top: 20px;
	flex-wrap: wrap;
}

#footer nav ul li {
	margin: 0 10px 0 0;

}

#footer nav ul li a {
	display: inline-block;
	padding: 5px 0;
	margin-right: 10px;

}

#footer .copyright {
	padding: 20px 0;
}

#footer .copyright span {
	float: none;
}

#footer .copyright .sns {
	float: none;
	margin: 15px 0 0;
	
}


/* ---------------------------------------------------✁ 
	HOME
------------------------------------------------------*/

#home section {
	padding: 40px 0;
}

#home .visual h2 {
	font-size: 15vw;
}

#home .visual h3 {
	font-size: 20px;
}

#home .visual p {
	font-size: 14px;
}

#home .visual .scroll {
	font-size: 12px;
	bottom: 80px;
}

#home .title h2 {
	font-size: 25px;
}

#home .title p {
	font-size: 13px;
}

#home .concept {
	padding-top: 0;
}

#home .concept .content {
	display: block;
	width: 100%;
	padding: 0;
}

#home .concept .image {
	width: 100%;
	padding-bottom: 60%;
	margin: 0;
}

#home .concept .text {
	width: 100%;
	padding: 25px 15px 0;
}

#home .concept .image .product {
	width: 80px;
    right: 0px;
    bottom: -30px;
}

#home .concept .text strong {
	font-size: 20px;
}

#home .menu h3 {
	font-size: 15px;
}

#home .menu ul li {
	width: 100%;
}

#home .menu ul li article .image .product {
    width: 160px;
    margin-left: -80px;
}

#home .menu ul li article .image .bg {
	padding-bottom: 56%;
}

#home .menu ul li article .text {
	padding: 60px 20px 20px;
}

#home .menu ul li article .text h4 {
	font-size: 18px;
}

.post-list li {
	width: 100%;
}

#home .shop .alert {
	margin: 20px 0;
}

.shop ul li article {
	display: block;
	padding: 20px 0;
}

.shop ul li .image {
	width: 100%;
}

.shop ul li .text {
	width: 100%;
	padding: 15px 0;
}

.shop ul li .text h3 {
	font-size: 18px;
	margin: 0 0 10px;
}

.shop ul li .text .button {
	margin: 2px;
	padding: 6px 15px 5px;
	font-size: 14px;
}

.shop ul li .text .button i {
	font-size: 18px;
}

.shop ul li .text dl {
	display: block;
}

.shop ul li .text dl dt {
	display: inline-block;
}

.shop ul li .text dl dd {
	display: inline-block;
}

/* ---------------------------------------------------✁ 
	PAGE
------------------------------------------------------*/

.page-title {
	padding: 120px 20px 40px;
}

.page-title h2 {
	font-size: 35px;
}

.page-title p {
	font-size: 13px;
}



/* ---------------------------------------------------✁ 
	MENU
------------------------------------------------------*/

#menu .category header {
	display: block;
	text-align: center;
}

#menu .category header .name {
	text-align: center;
	width: 100%;
}

#menu .category header .image {
	margin: 10px auto;
}

#menu .category header .text {
	text-align: left;
}

#menu ul {
	margin: 0;
}

#menu ul li {
	width: 50%;
}

#menu ul li article {
	padding: 15px 10px;
}

#menu ul li article .text h4 {
	font-size: 14px;
}

#menu ul li article .text p {
	font-size: 12px;
}

#menu ul li article .text span {
	font-size: 14px;
}

#menu ul li article .text i {
	width: 20px;
	line-height: 20px;
}


/* ---------------------------------------------------✁ 
	CONCEPT
------------------------------------------------------*/

#concept .message {
	padding: 70px 0;
}

#concept .message p {
	text-align: left;
}

#concept .message p br {
	display: none;
}

#concept .message h3 {
	font-size: 20px;
}

#concept .kushitani {
    
}

#concept .kushitani .text {
	padding: 30px 20px;
	text-shadow: 0px 0px 20px rgba(0,0,0,0.8);
	font-weight: bold;
}

#concept .kushitani .text h4 {
	font-size: 18px;
}

#concept .point {
	padding: 0;
}

#concept .point li article {
	display: block;
}

#concept .point li article .image,
#concept .point li:nth-child(even) article .image {
	width: calc(100% + 30px);
	margin: 0 -15px;
}

#concept .point li article .text {
	width: 95%;
	padding: 20px;
	margin: -20px auto 0;
	position: relative;
}

#concept .point li article .text span {
	font-size: 50px;
}

#concept .point li article .text h3 {
	font-size: 18px;
}

/* ---------------------------------------------------✁ 
	EVENT
------------------------------------------------------*/

#event.list .title h2 {
	font-size: 18px;
}

#event.list .post-list {
	margin: 30px 0;
}

#event.detail .content {
	display: block;
	margin: 20px auto;
}

#event .main-content {
	width: 100%;
	margin: 0 0 40px;
}

#event .side {
	width: 100%;
	padding: 0;
}

#event .main-content article header h1 {
	font-size: 18px;
}

/* ---------------------------------------------------✁ 
	SHOP
------------------------------------------------------*/

#shop .shop ul li {
	margin: 25px 0 50px
}


#shop .shop ul li article section {
	display: block;
}

#shop .shop ul li article .info {
	width: 100%;
}

#shop .shop ul li article .text {
	padding: 20px;
}

#shop .shop ul li article .map {
	width: 100%;
	
}

#shop .shop ul li article .map iframe {
	height: calc(100vw - 30px);
}

#shop .shop ul li article .timeline {
	padding: 15px;
}



}

/*==================================================================
	340px
==================================================================-*/

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



}