@charset "UTF-8";

/* ▼▼▼ トップ
======================================================*/
/*-- 共通 --*/
section {
	padding: 65px 0;
	}
	section.bg_white {background: #fff;}
		section .container > p {
			text-align: center;
			}
.btn {
	max-width: 350px;
	width: 27vw;
	margin: 0 auto;
	}
/* ▼ スライダー
----------------------------------------*/
#mainVisual {
	background: #FFFDE0;
	width: 100%;
	margin: 0 auto 50px;
	position: relative;
	overflow: hidden;
	}
	.slick-slide {
		height: auto!important;
		}
		#mainVisual .slick-slide.slick-current {
			padding: 0 10px;
			}
			#mainVisual .slick-slide:not(.slick-current) {
				opacity: .2;
				}
/*-- お知らせ --*/
#caution{
	width: 90%;
	max-width: 1000px;
	margin: 0 auto 50px;
	}
	#caution{
		background: #1D2087;
		border: 6px solid #1D2087;
		border-top: none;
		overflow: hidden;
		}
		#caution p{
			padding: 9px;
			color: #fff;
			font-size: 120%;
			font-weight: bold;
			text-align: center;
			}
			#caution p:first-child:before{
				content: "";
				display: inline-block;
				width: 25px;
				height: 25px;
				background: url(../img/top/caution_icon.svg) no-repeat;
				background-size: contain;
				vertical-align: middle;
				margin-right: 20px;
				}
				#caution .news{
					background: #fff;
					padding: 15px;
					font-size: 150%;
					}
					#caution .news a{
						color: #FF3842;
						text-decoration: underline;
						}
/* サブナビ */
#sub_nav {
	max-width: 870px;
	margin: 0 auto 50px;
	overflow: hidden;
	}
	#sub_nav  li{
		float: left;
		width: 16.5%;
		text-align: center;
		}
		#sub_nav li a{
			background: #FFF580;
			border-radius: 10px;
			width: 138px;
			height: 138px;
			padding: 15px 0;
			font-size: 15px;
			text-align: center;
			line-height: 1.1;
			}
			#sub_nav li a span{
				display: flex;
				align-items: center;
				width: 75px;
				height: 75px;
				margin: 0 auto 3px;
				}
				#sub_nav li a span img{
					width: 75px;
					}

/*-- イベント・キャンペーン --*/
#event {
	background: url(../img/grain_bg.jpg)repeat top center;
	background-size: 25%;
	}
	ul.list{
		position: relative;
		overflow: hidden;
		}
		ul.list li{
			float: left;
			width: 22%;
			margin-right: 30px;
			margin-bottom: 20px;
			position: relative;
			}
			ul.list li:last-child{
				margin-right: 0px;
				}
					ul.list .photo {
						display: block;
						width: 23vw;
						height: 23vw;
						max-width: 230px;
						max-height: 230px;
						margin-bottom: 15px;
						}
						ul.list li p.photo + p{
							margin-bottom: 3px;
							color: #999999;
							font-size: 18px;
							}
/*-- インフォメーション --*/
#info {
	position: relative;
	}
	#info::before {
		display: block;
		content: "";
		width: 100%;
		height: 7px;
		background: url(../img/border01.png) repeat-x top center;
		background-size: contain;
		}
			#info ul {
				margin-bottom: 55px;
				}
				#info ul .news_list {
					border-top: 1px solid #CCCCCC;
					position: relative;
					}
					#info ul .news_list:last-child {
						border-bottom: 1px solid #CCCCCC;
						}
						#info ul .news_list::after {
							display: block;
							content: "";
							width: 13px;
							height: 13px;
							background: url(../img/arrow_blue.png) no-repeat top center;
							background-size: contain;
							position: absolute;
							top: 40%;
							right: 10%;
							}
							#info ul .news_list a {
								display: block;
								padding: 20px 0;
								}
								#info ul .news_list .date {
									float: left;
									width: 12%;
									color: #999999;
									}
/*-- ショップニュース --*/
#news ul.list {
	margin-bottom: 55px;
	}
	#news ul.list li{
		width: 30%;
		}
		#news ul.list .photo {
			max-width: 313px;
			max-height: 190px;
			margin-bottom: 30px;
			}
			#news ul.list .photo + p{
				color: #050090;
				font-size: 14px;
				font-weight: bold;
				margin-bottom: 0;
				}
				#news ul.list .photo + p + p{
					color: #999;
					font-size: 10px;
					}
/*-- ショップ紹介 --*/
#shop .container {
	text-align: center;
	}
#shop ul.list {
	margin-bottom: 60px
	}
	#shop ul.list li{
		width: 50%;
		margin: 0 0 20px;
		}
		#shop ul.list li:nth-child(odd)::after {
			content: "";
			display: block;
			width: 200%;
			height: 1px;
			background: #DBDBDB;
			}
		#shop ul.list .photo {
			float: left;
			max-width: 250px;
			max-height: 190px;
			}
			#shop ul.list .photo + p {
				float:right;
				max-width: 250px;
				padding: 40px 20px 0;
				color: #050090;
				font-size: 14px;
				font-weight: normal;
				}
				#shop ul.list .photo + p span{
					display: block;
					height: 60px;
					color: #707070;
					font-size: 26px;
					font-weight: bold;
					line-height: 1;
					}




/* ▼▼▼ 480px〜768px
======================================================*/
@media screen and (max-width: 768px) {
/*-- 共通 --*/
section {
	padding: 30px 0;
	}
.btn {
	width: 37vw;
	}
/* ▼ スライダー
----------------------------------------*/
#mainVisual {
	margin: 0 0 20px;
	}
	#mainVisual .slick-slide.slick-current {
		padding: 0;
		}
		#mainVisual .slick-dots {
			bottom: -30px;
			}
			#mainVisual .slick-dots li button:before {
				color: #050090;
				font-size: 40px;
				}
/*-- お知らせ --*/
#caution{
	margin-bottom: 30px;
	}
/* サブナビ */
#sub_nav {
	padding: 0 3vw;
	margin-bottom: 40px;
	}
	#sub_nav  li{
		width: 33.333%;
		margin-bottom: 15px;
		}
		#sub_nav  li:nth-child(n+4) {
			margin-bottom: 0;
			}
		#sub_nav li a{
			width: 90%;
			height: auto;
			padding: 10px 0;
			font-size: 11px;
			}
			#sub_nav li a span{
				width: 50px;
				height: 50px;
				margin: 0 auto 3px;
				}
/*-- イベント・キャンペーン --*/
#event {
	background-size: 70%;
	}
	ul.list li{
		width: 48%;
		margin-right: 3.5vw;
		}
		ul.list li:nth-child(even){
			margin-right: 0px;
			}
			ul.list li:last-child{
				margin-right: 0px;
				}
				ul.list .photo {
					display: block;
					width: 44vw;
					height: 44vw;
					margin-bottom: 6px;
					}
					ul.list li p.photo + p{
						font-size: 10px;
						}

/*-- インフォメーション --*/

	#info .container {
		padding: 0;
		}
	#info::before {
		display: block;
		content: "";
		width: 100%;
		height: 7px;
		background: url(../img/border01.png) repeat-x top center;
		background-size: contain;
		}
			#info ul {
				margin-bottom: 30px;
				}
				#info ul .news_list {
					}
					#info ul .news_list:last-child {
						border-bottom: 1px solid #CCCCCC;
						}
						#info ul .news_list::after {
							width: 10px;
							height: 10px;
							right: 20px;
							}
							#info ul .news_list a {
								padding: 15px;
								font-size: 16px;
								}
								#info ul .news_list .date {
									display: block;
									margin-bottom: 3px;
									float: none;
									font-size: 12px;
									}
/*-- ショップニュース --*/
#news ul.list {
	margin-bottom: 30px;
	}
	#news ul.list li{
		width: 100%;
		margin: 0 auto 40px;
		font-size: 16px;
		}
		#news ul.list li:last-child{
			margin-bottom: 0;
			}
			#news ul.list .photo {
				width: 100vw;
				height: 53vw;
				max-width: 100%;
				max-height: 100%;
				margin-bottom: 10px;
				}
/*-- ショップ紹介 --*/
#shop .container {
	padding: 0;
	}
	#shop ul.list {
		margin-bottom: 30px
		}
		#shop ul.list li{
			width: 100%;
			margin: 0 0 15px;
			border-bottom: 1px solid #DBDBDB;
			}
			#shop ul.list li:nth-child(odd)::after {
				display: none;
				}
				#shop ul.list li a {
					width: 100%;
					padding: 0 15px;
					}
			#shop ul.list .photo {
				width: 44vw;
				height: 36vw;
				max-width: 250px;
				max-height: 190px;
				}
				#shop ul.list .photo + p {
					padding: 30px 15px 0;
					font-size: 10px;
					width: 50%;
					}
					#shop ul.list .photo + p span{
						height: auto;
						margin-bottom: 10px;
						font-size: 18px;
						line-height: 1.2;
						}
						#shop ul.list li a::after {
							display: block;
							content: "";
							width: 10px;
							height: 10px;
							background: url(../img/arrow_blue.png) no-repeat top center;
							background-size: contain;
							position: absolute;
							top: 40%;
							right: 20px;
							}

}