@charset 'UTF-8';
@import url('https://fonts.googleapis.com/css?family=Rubik');
@import url('https://fonts.googleapis.com/css?family=Quicksand');
@import url('https://fonts.googleapis.com/css?family=Lato');



/* ================================================================================

	PC・スマホ共通

================================================================================ */
.nav_menu{
	/*font-family: "a-otf-ryumin-pr6n"!important;*/
}

.menu a {
	display: block;
	width: 100%;
	height: 100%;
	text-decoration: none;
}

.nav-button {
	position: fixed;
	width: 76px;
	height: 76px;
	top: 8px;
/* 	left: 8px; */
	right: 8px;
	z-index: 101;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border-radius: 2px;
	overflow: hidden;
}

.nav-button:hover {

}

#nav-icon {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 14.4px;
	left: 8px;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .2s linear;
	transition: .2s linear;
}

#nav-icon span {
	background: #000;
	display: block;
	position: absolute;
	height: 1px;
	width: 40px;
	border-radius: 1px;
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	left: 0;
	margin: auto;
	margin-left:10px;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s linear;
	transition: .25s linear;
}

#nav-icon span:nth-child(1) {
	top: 0px;
}

#nav-icon span:nth-child(2),
#nav-icon span:nth-child(3) {
	top: 16px;
}

#nav-icon span:nth-child(4) {
	top: 32px;
}

#nav-icon.open span:nth-child(1) {
	top: 15px;
	width: 0%;
	left: 45%;
}

#nav-icon.open span:nth-child(2) {
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

#nav-icon.open span:nth-child(3) {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

#nav-icon.open span:nth-child(4) {
	top: 15px;
	width: 0%;
	left: 45%;
}







.menu-head {
	position: fixed;
	top: 8px;
	left: 8px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	width: 0px;
	background-color: transparent;
	-webkit-transition: width .5s cubic-bezier(0.4, 0.0, 0.6, 1), background-color .5s linear;
	transition: width .5s cubic-bezier(0.4, 0.0, 0.6, 1), background-color .5s linear;
	overflow: hidden;
	-webkit-transition-property: all;
	transition-property: all;
	-webkit-transition: background-color .2s linear, .4s height linear;
	transition: background-color .2s linear, .4s height linear;
	z-index: 100;
}

.menu-head.open {
	width: calc(100% - 1rem);
	z-index: 100;
	border-radius: 2px 2px 0 0;
	-webkit-transition: background-color .2s linear .1s, .4s height linear .1s;
	transition: background-color .2s linear .1s, .4s height linear .1s;
}

.menu-head-inner {
	background-color: rgba(239,233,221,0.97);
	display:inline-block;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	list-style-type: none;
	width:100%;
	height:84px;
	margin: 0;
	padding: 0;
	-webkit-transition: background-color .2s linear .1s, .4s height linear .1s;
	transition: background-color .2s linear .1s, .4s height linear .1s;
}

.menu-head-link {
	display:inline-block;
	-webkit-box-flex: 1;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	font-size: 32px;
	font-weight: 700;
	height: 100%;
	text-align: center;
	padding: 16px 0;
	padding: 1rem 0;
	color: transparent;
	-webkit-transition: color .25s linear;
	-webkit-transition: color .25s ease-in-out;
	transition: color .25s ease-in-out;
	-webkit-transition-property: all;
	transition-property: all;
	-webkit-transition-delay: .5s;
	transition-delay: .5s;
	/*font-family: 'Lato', sans-serif;*/
}

.menu-head-link.open {
	color: #fff;
		-webkit-transition: color .25s linear;
		transition: color .25s linear;
}

.menu-head-link li {

}


.maholo_search:hover {
	color:#999999 !important;
	transition: color .3s !important;
}








/* カートボタン */

ul.cart_btn{
	margin: 0px;
	padding: 0px;
	top:10px;
	right:80px;
	position:fixed;
	z-index:9;
}
ul.cart_btn li {
	display: inline-block;
	vertical-align: top;
	letter-spacing:normal;
	font-size: 12px;
	list-style:none;
	margin-top:10px!important;
	margin-top:1000px;
}
.header-cartbutton li a{
	background-color:none!important;
	margin-top:-5px!important;
}

.heart{
	margin-left:5px;
}




/* ================================================================================

	PC設定

================================================================================ */
@media screen and (min-width: 768px) {

	/* カートボタン */
	.header-cartbutton i {
		font-size: 41px;
	}


	/* styling for all menu-head elements */
	.menu-head {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.1s;
		transition-delay: 0.1s;
	}
	.menu-head-inner {
		display: block;
		padding: 10px 0;
	}
	.menu-head-link {
		padding: 0;
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.1s;
		transition-delay: 0.1s;
		text-indent:-1em;
	}
	.menu-head.open {
		width: calc(100% - 1rem);
	}


	/* menu-body */
	.menu-body {
		position: fixed;
		height: 0px;
		top: 92px;
		left: .5rem;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		z-index: 100;
		width: calc(100% - 1rem);
		-webkit-transition: background-color .2s linear, .25s height linear;
		transition: background-color .2s linear, .25s height linear;
		border-radius: 0 0 2px 2px;
		overflow: hidden;
	}
	.menu-body.open {
		background-color: rgba(239,233,221,0.97);
		height:auto;
		-webkit-transition: background-color .4s linear .1s, .25s height linear .1s;
		transition: background-color .2s linear .1s, .25s height linear .1s;
		padding:16px 0;
	}
	.menu-body-inner {
		display:inline-block;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		list-style-type: none;
		margin: 0;
		padding: 0;
		width:100%;
	}
	.menu-body-link {
		color: transparent;
		display:inline-block;
		-webkit-box-flex: 1;
		-ms-flex: 1 1 auto;
		flex: 1 1 auto;
		font-size: 2rem;
		font-weight: 100;
		height: 100%;
		text-align: center;
		padding: 8px 0;
		-webkit-transition: color .25s linear;
		transition: color .25s linear;
	}
	.menu-body-link.open {
		color: #fff;
		-webkit-transition: color .25s linear .1s;
		transition: color .25s linear .1s;
	}
	.parent1 {
		margin: auto;
	}
	#parent2-1 > div{
		padding:16px 0 0;
	}


	.menu-body-inner > li{
		display:inline-block;
		width:calc(90%/4);
		vertical-align:top;
		padding-bottom:10px;
	}



	.menu-body-inner > li:hover{
		background-repeat:no-repeat;
		background-position:bottom center;
	}
	
	#accordion_panel_head dt{
		/*font-family: "a-otf-ryumin-pr6n";*/
		font-size:28px!important;
		font-weight: bold;
		line-height:1.2;
	}
	
	.nav_search{
		margin:0 auto;
		padding-top:8px;
	}
	.nav_search a{
		width:250px;
		margin:0 auto;
		line-height:40px;
	}
	.nav_search ul{
		margin:0;
	}
	.nav_search li{
		/*font-family: "a-otf-ryumin-pr6n";*/
		font-size:20px!important;
		margin:0px ;
		list-style:none;
	}
	.nav_search li a{
		/*font-family: "a-otf-ryumin-pr6n";*/
		font-size:20px!important;
		color:#000000;
		text-align:left;
	}
	#nav-icon .nav_menu{
		margin-top:32px;
		margin-left:-13px;
		/*font-family:"EB Garamond","a-otf-ryumin-pr6n"!important;*/
	}
	dt .nav_eigo,
	.search_eigo{
		font-weight:normal;
		/*font-family: "Lato", sans-serif!important;*/
		font-size:19px!important;
	}
	.head_toji{
		margin:0 !important;
	}
}










/* ================================================================================

	スマホ設定

================================================================================ */

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

	.nav-button{
		/*
		background-color:rgba(255,255,255,0.90);
		*/
	}



	/* styling for all menu-head elements */
	.menu-head {
		height: 76px;
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.6s;
		transition-delay: 0.6s;
	}
	.menu-head-inner {
		display: block;
		padding: 10px 0;
	}
	.menu-head-link {
		padding: 0;
		font-size: 20px;
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.6s;
		transition-delay: 0.6s;
	}
	.menu-head-link li{
		line-height:64px;
		/*font-family: 'Lato', sans-serif;*/
		font-size:26px;
	}
	.menu-head.open {
		width: calc(100% - 1rem);
	}
	/* styling for all menu-body elemets */
	.menu-body {
		position: fixed;
		top: 4.5rem;
		left: .5rem;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		z-index: 100;
		width: calc(100% - 1rem);
		overflow: hidden;
		visibility: hidden;
	}
	.menu-body.open {
		visibility: visible;
	}
	.menu-body-inner {
		height: 100%;
		list-style-type: none;
		margin: 0;
		padding: 0;
		display: block;
	}
	.menu-body-link {
		padding:0;
		font-size: 20px;
		text-align: center;
		color: #fff;
	}
	/* animation for all menu-body elemets */
	.parent1 {
		-webkit-transition: height .5s;
		transition: height .5s;
		-webkit-perspective: 250px;
		perspective: 250px;
	}
	.parent2 {
		height:100%;
		padding:8px 0;
		-webkit-transition-duration: .5s;
		transition-duration: .5s;
		-webkit-transform: rotateX(-90deg);
		transform: rotateX(-90deg);
		-webkit-transform-origin: top;
		transform-origin: top;
	}
	.parent1.open .parent2 {
		-webkit-transform: rotateX(0deg);
		transform: rotateX(0deg);
		background-color: rgba(239,233,221,0.97);
	}
	/* adjusting for last menu-body element */
	.parent2.last-menu {
		border-radius: 0 0 2px 2px;
	}
	/* menu-body elements while closing */
	.parent2 {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-duration: .25s;
		transition-duration: .25s;
		-webkit-transition-timing-function: cubic-bezier(0.4, 0.0, 0.6, 1);
		transition-timing-function: cubic-bezier(0.4, 0.0, 0.6, 1);
		padding:16px 0;
	}
	#parent2-1 {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.4s;
		transition-delay: 0.4s;
	}
	#parent2-2 {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.35s;
		transition-delay: 0.35s;
	}
	#parent2-3 {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.3s;
		transition-delay: 0.3s;
	}
	#parent2-4 {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.25s;
		transition-delay: 0.25s;
	}
	#parent2-5 {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.2s;
		transition-delay: 0.2s;
	}
	#parent2-6 {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.15s;
		transition-delay: 0.15s;
	}
	#parent2-7 {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.1s;
		transition-delay: 0.1s;
	}
	#parent2-8 {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.05s;
		transition-delay: 0.05s;
	}
	/* menu-body elements while opening */
	#parent2-1.open {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.05s;
		transition-delay: 0.05s;
	}
	#parent2-2.open {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.1s;
		transition-delay: 0.1s;
	}
	#parent2-3.open {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.15s;
		transition-delay: 0.15s;
	}
	#parent2-4.open {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.2s;
		transition-delay: 0.2s;
	}
	#parent2-5.open {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.25s;
		transition-delay: 0.25s;
	}
	#parent2-6.open {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.3s;
		transition-delay: 0.3s;
	}
	#parent2-7.open {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.35s;
		transition-delay: 0.35s;
	}
	#parent2-8.open {
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: 0.4s;
		transition-delay: 0.4s;
	}

	#parent2-1 > div{
		padding:10px 0 0;
	}

	#accordion_panel_head{
		width:260px;
		margin:0 auto;
	}
	#accordion_panel_head dt{
		/*font-family: "a-otf-ryumin-pr6n" !important;*/
		font-size:20px!important;
		text-align:left;
		margin-left:10px;
		overflow:auto;
		background:url(../gr_img/next_arrow.png) right 10px no-repeat;
		background-size:10px;
		padding-right:20px;
	}
	#accordion_panel_head dt.search_dt{
		background:url(../gr_img/under_arrow.png) no-repeat;
		background-position:right 2px top 10px;
		background-size:9px;
		padding-right:20px;
	}
	#accordion_panel_head dt:before {
		display: block;
		clear: both;
		height: 0px;
		line-height: 0px;
		visibility: hidden;
		content: ".";
		overflow: hidden;
		float: none;
	}/* フロート回り込み解除 */

	.nav_ja{
		width:160px;
		float:left;
	}
	.nav_eigo{
		float:left;
		font-size:14px!important;
		/*font-family: 'Lato', sans-serif !important;*/
	}
	
	.nav_search{
		margin:0 auto;
		padding-top:8px;
		text-align:center;
	}
	.nav_search a{
		width:176px;
		margin:0 auto;
	}
	.nav_search ul{
		margin:0 !important;
	}
	.nav_search li{
		/*font-family: "a-otf-ryumin-pr6n"!important;*/
		margin:0px;
		list-style:none;
		padding:8px 0;
	}
	.nav_search li:nth-child(3){
		padding:8px 0 0;
	}
	.nav_search li a{
		/*font-family: "a-otf-ryumin-pr6n"!important;*/
		font-size:15px!important;
		color:#000000;
		text-align:left;
	}
	.search_eigo{
		font-size:13px!important;
		/*font-family: 'Lato', sans-serif !important;*/
	}
	#nav-icon .nav_menu{
		margin-top:32px;
		margin-left:-13px;
		/*font-family:"EB Garamond","a-otf-ryumin-pr6n"!important;*/
	}



	.about_maholo{
		margin-bottom:0!important;
		line-height:26px;
	}
	.about_maholo dt{
		margin-bottom:0!important;
	}
	.about_maholo dt:hover{
	}
	.head_toji{
		margin:0 !important;
	}




	/* カートボタン */
	ul.cart_btn{
		/*
		background-color:rgba(255,255,255,0.90);
		*/
		border-radius:2px;
	}
}