@charset "UTF-8";
/* CSS Document */
<!--












　　　　　 ∩　　　∩
　　　　　 |つ　　⊂|
　　　　　 ヽっ＿ｃノ
　　　　　⊂ノ> <　＼
　　　　　　|　＿＿▼
　　　　　　|･･　 |













-->

.hidden{ display: none !important;}

/*
------------------------------------------------
resize
------------------------------------------------
*/
@media (min-width: 600px) {
}
@media (min-width: 780px) {
}
@media (min-width: 1000px) {
}

ul.resizeul {
	list-style-type: none;
	text-align:center;
}
ul.resizeul li {
	display: inline-block;
}
ul.resizeul li img {
	width: auto;
}

.container img {
	width: auto;
}

/*
------------------------------------------------
通用
------------------------------------------------
*/
@media screen and (max-width: 1200px) {/*フォントサイズアップ*/
	.quality-con .container p,
	.store-con .content-area
	{font-size: 100%; line-height: 160%;}
	.about-con .container p
	{font-size: 100%; line-height: 160%;}
}
@media screen and (max-width: 1000px) {

	ul li{display: block;}
	.container {
		padding: 0 40px;
	}
	.hr-img img{ width: 90%; }
	ul.resizeul li.wbox {width:auto;}
}

@media screen and (max-width: 700px) {
	body{
		font-size: 120%;
		line-height: 160%;
		text-align:inherit;
	}
}
/*====個別指定====*/

/*
------------------------------------------------
HEADER & NEWS
------------------------------------------------
*/
@media screen and (max-width: 840px) {
	.top-logo .main_da-logo{width: 100%;}
	#header {height: 600px;}
	.sp-pick,.sp-pick img{ width: 88%;margin-top:-40px;}
	.sp-to-con {height: 80px; margin-top:-80px;}
	.spedit img{
		width: 400px !important;
	}
	.top-logo {padding-top: 100px;}/*80px menu移動後的空間補回值 = for MOBILE*/
	.top-logo .main_da-logo{
		width: 300px;}
	#info {margin: 20px 0 80px 0;}
}
@media screen and (max-width: 640px) {
	.sp-pick,.sp-pick img{ width: 92%}
}

@media screen and (max-width: 1000px) {
	div.news_for-mobile{
		width: 100%;
		text-align: center;
		display: block;
		margin: 0;
	}
	div.news_for-mobile img{
		width: 80%;
	}
}
@media screen and (max-width: 1000px) {
	.news .slider,.news_more{ display: none;}
}
/*top-logoサイズ指定*/
@media screen and (min-width: 840px) {
	.top-logo .main_da-logo{
		width: 420px;/*基本width: 400px;*/
		margin-top: -20px;
		margin-bottom: 50px;
		padding-top: 0px;}
}
/*
------------------------------------------------
1[ニュース]
------------------------------------------------
*/
@media screen and (min-width: 960px) {
	.slides {
			width: 600px;/*2 news*/
			/*width: 850px; 3 news*/
	}
}
@media screen and (max-width: 960px) {
	.news{
		text-align:center;
		padding-bottom: 50px;
		}
	.slides {
			/*height: 500px;ORG*/
			width: 500px;
			overflow: hidden;
	}
	.slides img{
		width: 500px;
	}
}
@media screen and (max-width: 560px) {
	.slides {
			list-style-type: none;
			/*height: 400px;ORG*/
			width: 400px;
			overflow: hidden;
			margin: 0px auto 0px auto;
	}
	.slides img{
		width: 400px;
	}
ul+a.news_btn_bk{
		top: 20px !important;
}
}
/*
------------------------------------------------
2[メニュー]
------------------------------------------------
*/
@media screen and (min-width: 700px) {
	.menu-list .item span.price br{display: none;}/*価格BR無効*/
	.menu-info br{display: none;}/*価格BR無効*/
	.menu-list .item span.price{width: 10px;}
}
@media screen and (min-width: 1100px) {
	.menu-info{width:90%;}
	.menu-list>ul>li{
		display: inline-block;
		width: 45%;
		*width: 44.9%; /* IE7 Hack */
		_width: 44%; /* IE6 Hack */
		padding: 0 20px;
	}
}
@media screen and (min-width: 2000px) {
	.menu-info{width:90%;}
	.menu-list>ul>li{
		display: inline-grid;
		width: 20%;
		padding: 0 25px;
	}
}
@media screen and (max-width: 1000px) {
	.menu-info{width:100%;}
	.menu-con{
		padding: 50px 50px;
		}
	.menu-con .container{
		width: 100%;
		margin: 30px auto 50px auto;
		padding: 0;
		}
	.menu-list,.series-title{
		font-size: 110% !important;
	}
	.menu-list ul ul{
		width: 100%;
		padding: 20px 0;
	}
	.menu-list .item{
		min-height: 70px;
		border-bottom: 2px dotted #676767;
		padding: 10px 0;
	}
	.menu-list .item:last-child {
		border-bottom: 0px;
	}
	.menu-list .item .en{font-size: 100%; line-height: 140%; padding: 5px 0 0 0;}
	.menu-list .item span.info{width: 70%;}
	.menu-list .item span.price{width: 30%;}
}
/*
------------------------------------------------
3[ジ・アレイについて]
------------------------------------------------
*/
@media screen and (max-width: 1200px) {
	.about ul li img{
		width: 100%;
	}
	.about>ul li img {
		display:none;
	}
	.about>ul li{
		width: 100%;
	}
	.about-con .box-3 img{
		width: 28%;
		top:-250px;
		right: 5%;
	}
	.about-con .box-1 {
		text-align: center;
	}
}
@media screen and (max-width: 730px) {
	.about ul li img{
		width: 100%;
	}
	.about>ul li img {
		display:none;
	}
	.about>ul li{
		width: 100%;
	}
	.about-con{
		padding-bottom: 230px;
		}
	.about-con .container{
		grid-template-columns: 1fr;
    grid-template-rows: auto;
	}
	.about-con .box-1 {
		text-align: left;
	}
	.about-con .box-1,.about-con .box-2,.about-con .box-3 {
		grid-column: 1;
    grid-row: auto;
	}
	.about-con .box-1 h1 {line-height: 50px;}
	.about-con .box-1 p br {display: none;}
	.about-con .box-3 img{
		width: 50%;
		top:20px;
		right:24%;
	}
	.about-con .box-2 p{
		margin: 40px 0 0 0;
		width: 100%;
	}
}
/*
------------------------------------------------
4[こだわり]
------------------------------------------------
*/
@media screen and (max-width: 1200px) {
	.quality-con .container{
		width: 85%;
		}
		.quality-con .box-1b img{left: -100px;}
		.quality-con .box-2b img{left: -100px;}
		.quality-con .box-3b img{left: -200px;}
		.quality-con .info {
			display: block;
			position:relative;
			top:-250px;
			left:550px;
			width: 45%;
		}
}
@media screen and (max-width: 840px) {
	.quality-con .container{
		grid-template-columns: 1fr;
		grid-template-rows: auto;
	}
	.quality-con .box-1a,
	.quality-con .box-1b,
	.quality-con .box-1c,
	.quality-con .box-2a,
	.quality-con .box-2b,
	.quality-con .box-2c,
	.quality-con .box-3a,
	.quality-con .box-3b,
	.quality-con .box-3c{
		grid-column: 1;
    grid-row: auto;
	}
	.quality-con span.qutitle-1,
	.quality-con span.qutitle-2,
	.quality-con span.qutitle-3{
		margin: 0;
	}
	.quality-con span.title,
	.quality-con span.title-b{
		margin: 0 auto;
	}
	.quality-con .info {
		display: block;
		position:relative;
		top:-80px;
		left:0;
		width: 100%;
	}
	.quality-con .box-1c{
		height: 400px;
	}
	.quality-con .box-2c{
		height: 360px;
	}
	.quality-con .box-1b img{
		margin: 0 auto;
		top:-80px;
		width: 90%;
		left: 5%;
	}
	.quality-con .box-2b img{
		margin: 0 auto;
		top:550px;
		width: 70%;
		left: 15%;
	}
	.quality-con .box-3b img{
		margin: 0 auto;
		top:1200px;
		width: 100%;
		left: 0px;
	}
}
@media screen and (max-width: 630px) {
	.quality-con .box-1c{
		height: 460px;
	}
	.quality-con .box-2c{
		height: 360px;
	}
	.quality-con .box-1b img{
		margin: 0 auto;
		top:-50px;
		width: 120%;
		left: -8%;
	}
	.quality-con .box-2b img{
		margin: 0 auto;
		top:600px;
		width: 80%;
		left: 10%;
	}
	.quality-con .box-3b img{
		margin: 0 auto;
		top:1280px;
		width: 100%;
		left: 0px;
	}
}

/*
------------------------------------------------
6[店鋪一覽]
------------------------------------------------
*/
@media screen and (max-width: 1100px) {
	ul.store-list li.wbox-map {
		width:auto;
		padding-left: 20px;
	}
	ul.tab-area{
		margin:0 auto 30px auto;
		padding: 0;
		text-align: center;
		}
	ul.store-list li.wbox-text{
		width: 420px;
		}
}
@media screen and (max-width: 830px) {
	.store .content-area ul.store-list{
		padding: 0 10%;
		text-align: left;
	}
	ul.store-list li {
		display:block;
	}
	.wbox-stbox br{display: none;}
	ul.store-list li.wbox-stbox {
		margin: 0;
		padding:0 0 20px 0;
		width:auto;
		text-align: center;
	}
	ul.store-list li.wbox-stbox p{
		font-size: 20px;
		padding: 15px 20px;
		margin: 0 20px 0 0;
	}
	ul.store-list li.wbox-text{
		width: auto;
	}
	.store li.wbox-text p{
		font-size: 90% !important;
	}
	ul.store-list li.wbox-map {
		text-align:left;
		padding-left: 0px;
	}
}
/*
------------------------------------------------
[営業のお知らせ]
------------------------------------------------
*/
@media screen and (min-width: 2000px) {
	.open-time{
		max-width: 1000px;
	}
}
@media screen and (max-width:700px) {
	.open-time .title{
		height:18px;
		margin-bottom: 5px;
		margin-left: -5px;
	}
	.open-time{
		padding: 20px 30px;
		width: 85%;
	}
	.open-time p{color: #fff;	}
	.open-time .title{
		padding: 5px;
	}
}
/* ------------------------------------------
MENU
--------------------------------------------- */

/*
------------------------------------------------
for PC
*/

.inner {
    margin: 0 auto;
		height: 110px;
}
.inner:after {
    content: "";
    clear: both;
    display: block;
}
/*決定不同尺寸的表示寬*/
@media screen and (min-width: 1220px) {
	.inner {width: 80%;}
	#menu-nav ul li a {
		padding: 0 6px;
	}
}

/* header */
#menu-bar {
    position: absolute;
    width: 100%;
    line-height: 1;
    z-index: 999;
}
#menu-bar a,
#menu-bar {
    color: #fff;
    text-decoration: none;
}
#menu-bar .inner {
    position: relative;
}
#menu-bar .menu-sb {
    float: left;
		padding: 32px 0 0 20px;
}
#menu-nav{
}
#menu-nav ul {
    list-style: none;
    position: absolute;
    right: 0;
    bottom: 0;
    font-size: 14px;
		top:35px;
}
#menu-nav ul li {
    float: left;
}
#menu-nav ul li a {
}
/* snbox */
#menu-nav li.snbox{width: 120px;margin: 5px auto 10px auto;}
#menu-nav li.snbox img{width: 28px; height: 28px;}
#menu-nav li.snbox a{ width: auto;margin: 0 5px; padding: 0; display: inline-block;}
@media screen and (max-width: 840px) {
	#menu-bar #menu-nav ul li.snbox a,
	#menu-bar.fixed #menu-nav ul li.snbox a {
		display: none;
}
}
/* Toggle Button */
#nav-toggle {
    display: none;
    position: absolute;
    right: 12px;
    top: 5px;
    width: 34px;
    height: 36px;
    cursor: pointer;
    z-index: 101;
		background: url("../images/menu-btn.svg") no-repeat 50% 33%;
		margin: 20px 10px 10px 0;
		user-select: none;
		-webkit-transition: .35s ease-in-out;
		-moz-transition: .35s ease-in-out;
		transition: .35s ease-in-out;
}
#nav-toggle div {
    position: relative;
}
.snbox-mobile{
	display: none;
}
/*
------------------------------------------------
for MOBILE
*/
@media screen and (max-width: 840px) {
    #menu-bar,
    .inner {
        width: 100%;
        padding: 0;
				height: auto;
    }
    #menu-bar {
        top: 0;
        position: fixed;
        margin-top: 0;
    }
    #mobile-head {
        background: #fff;
        width: 100%;
        height: 80px;
        z-index: 999;
        position: relative;
    }
    #menu-bar.fixed .menu-sb,
    #menu-bar .menu-sb {
        position: absolute;
        left: 13px;
        top: 23px;
        color: #fff;
				padding: 0;
    }
    #menu-nav {
        position: absolute;
        top: -500px;
        background: #e7e7e7;
        width: 100%;
        text-align: center;
        padding: 10px 0;
        -webkit-transition: .5s ease-in-out;
        -moz-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
    }
    #menu-nav ul {
        list-style: none;
        position: static;
        right: 0;
        bottom: 0;
        font-size: 14px;
				margin-top:50px;
    }
    #menu-nav ul li {
        float: none;
        position: static;
    }
    #menu-bar #menu-nav ul li a,
    #menu-bar.fixed #menu-nav ul li a {
        width: 100%;
        display: block;
        color: #000;
        padding: 12px 0;
    }
    #nav-toggle {
        display: block;
    }
    .open #menu-nav {
        -moz-transform: translateY(556px);
        -webkit-transform: translateY(556px);
        transform: translateY(556px);
    }
		.snbox-mobile{
			display:block;
			margin: 22px 0 0 0;
			list-style-type: none;
			position: absolute;
			right:80px;
			border-right: 1px solid #000;
			padding-right: 20px;
		}
		.snbox-mobile li{
			display:inline-block !important;

			}
		.snbox-mobile a img{
			width: 40px;
		}
		/* #nav-toggle Animation */
    .open #nav-toggle{
			background: url("../images/menu-btn_close.svg") no-repeat 50% 33%;
			-webkit-transform: rotate(-180deg);
			-moz-transform: rotate(-180deg);
			transform: rotate(-180deg);
		}

		/* #menu-name */
		.menu-name:after {
		content:attr(data-label);
		font-size: 20px;
		}
		.menu-name img {
		display:none;
		}

}

/*
------------------------------------------------
期間限定 SP BOX[b menu]
------------------------------------------------
*/
@media screen and (max-width: 1000px) {
	.spup-box_A li.a{ margin-top: 50px; margin-right: 0;width: 90%;display: block;}
	.spup-box_A li a img{
		text-align: center;
	}
	.spup-box_B li.b{ width: 90%; }
}