@charset "utf-8";

.mainvisual {
	margin: 0 -127px 50px;
}
@media screen and (max-width: 767px){
	.mainvisual {
		margin: 0 -25px;
	}
}

.infomation {
	margin-bottom: 115px;
}
.infomation h2 {
	margin-bottom: 25px;
	text-align: center;
}
.infomation ul {
	max-width: 1000px;
	margin: 0 auto 50px;
}
.infomation li {
	border-bottom: 1px solid #080103;
}
.infomation li a {
	position: relative;
	display: block;
	padding: 18px 100px 18px 0;
	font-size: 23px;
	line-height: 1.4;
	letter-spacing: 0.075em;
}
.infomation li a:hover {
	opacity: 0.8;
}
.infomation li a::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 50px;
	width: 15px;
	height: 15px;
	border-top: 4px solid #0d367a;
	border-right: 4px solid #0d367a;
	transform-origin: right top;
	transform: rotate(45deg);
}
.infomation li .p_date {
	margin-bottom: 5px;
}
@media screen and (max-width: 767px){
	.infomation {
		margin-bottom: 80px;
	}
	.infomation h2 {
		margin-bottom: 35px;
	}
	.infomation h2 img {
		width: 105px;
	}
	.infomation ul {
		margin: 0 -10px 50px;
	}
	.infomation li a {
		padding: 15px 70px 15px 0;
		font-size: 13px;
	}
	.infomation li a::after {
		right: 10px;
		width: 8px;
		height: 8px;
		border-width: 3px;
	}
	.infomation li .p_date {
		font-size: 12px;
	}
}

.concept {
	position: relative;
	margin-bottom: 280px;
	padding: 190px 0 0 685px;
}
.concept .img {
	position: absolute;
	top: 0;
	left: -95px;
}
.concept h2 {
	position: absolute;
	top: 85px;
	right: 0;
}
.concept .text {
	margin-bottom: 50px;
	line-height: 2.25;
	letter-spacing: 0.075em;
}
@media screen and (max-width: 767px){
	.concept {
		margin-bottom: 95px;
		padding: 0;
	}
	.concept .img {
		position: static;
		margin: 0 15px 75px -50px;
	}
	.concept h2 {
		position: static;
		margin-bottom: 30px;
		padding-right: 60px;
		text-align: center;
	}
	.concept h2 img {
		width: 77px;
	}
	.concept .text {
		max-width: 295px;
		margin: 0 auto 30px;
		font-size: 13px;
	}
	.concept .btn {
		text-align: center;
	}
}

.artist {
	overflow: hidden;
}
.artist h2 {
	margin-bottom: 70px;
	text-align: center;
}
.artist ul {
	float: left;
	margin-right: 50px;
	display: flex;
}
.artist li {
	margin-right: 50px;
}
.artist li a {
	display: block;
}
.artist li a:hover {
	opacity: 0.8;
}
.artist li p {
	margin-top: 15px;
	line-height: 1.8;
	letter-spacing: 0.075em;
}
.artist .text {
	overflow: hidden;
	line-height: 2.25;
	letter-spacing: 0.075em;
}
@media screen and (max-width: 767px){
	.artist {
		margin-bottom: 140px;
	}
	.artist h2 {
		margin-bottom: 30px;
	}
	.artist h2 img {
		width: 280px;
	}
	.artist ul {
		float: none;
		display: block;
		width: 200px;
		margin: 0 auto 40px;
	}
	.artist li {
		margin: 0 0 35px;
	}
	.artist li p {
		margin-top: 5px;
		font-size: 14px;
		line-height: 1.4;
	}
	.artist li p > span {
		font-size: 12px;
	}
	.artist .text {
		max-width: 270px;
		margin: 0 auto;
		font-size: 13px;
	}
}

.recommend {
	position: relative;
	margin-bottom: 170px;
	padding: 675px 0 0;
}
.recommend .img {
	position: absolute;
	top: 0;
	right: -100px;
}
.recommend h2 {
	position: absolute;
	top: 525px;
	left: 0;
}
.recommend .mainCateg {
	margin-bottom: 125px;
	padding-left: 230px;
	overflow: hidden;
}
.recommend .mainCateg li {
	float: left;
	margin-bottom: 75px;
}
.recommend .mainCateg li:nth-child(even) {
	float: right;
}
.recommend .mainCateg li:nth-child(2) {
	margin-top: 170px;
}
.recommend .mainCateg a {
	position: relative;
	display: block;
}
.recommend .mainCateg a:hover {
	opacity: 0.8;
}
.recommend .mainCateg a > span {
	position: absolute;
	top: calc(50% - 15px);
	left: 0;
	right: 0;
	text-align: center;
	color: #fff;
	font-size: 24px;
	letter-spacing: 0.25em;
}
.recommend .subCateg {
	margin-bottom: 50px;
	display: flex;
	justify-content: space-between;
}
.recommend .subCateg li {
	/*width: 21.9%;*/
	width: 32.25%;
}
.recommend .subCateg a {
	display: block;
	background-color: #0d367a;
	height: 100%;
	padding: 50px 40px 30px;
	color: #fff;
	font-size: 16px;
	line-height: 1.6;
	letter-spacing: 0.075em;
}
.recommend .subCateg a:hover {
	opacity: 0.8;
}
.recommend .subCateg .title {
	position: relative;
	margin-bottom: 30px;
	padding-bottom: 34px;
	height: 88px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-size: 25px;
	line-height: 1.1;
	letter-spacing: 0.25em;
}
.recommend .subCateg .title::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	border-bottom: 4px solid #fff;
}
.recommend .btnList {
	display: flex;
	justify-content: space-between;
}
.recommend .btnList li {
	width: 32.25%;
}
.recommend .btnList a {
	display: block;
	border: 1px solid #0d367a;
	padding: 10px 5px;
	text-align: center;
	color: #003686;
	font-size: 24px;
}
.recommend .btnList a[href]:hover {
	opacity: 0.8;
}
.recommend .btnList a img {
	vertical-align: middle;
	margin-right: 15px;
}
.recommend .btnList a > span {
	vertical-align: middle;
}
.recommend .btnList small {
	font-size: 16px;
}
@media screen and (max-width: 767px){
	.recommend {
		margin-bottom: 75px;
		padding: 0;
	}
	.recommend .img {
		position: static;
		margin-bottom: 40px;
	}
	.recommend h2 {
		position: static;
		margin-bottom: 35px;
		padding-right: 10px;
		text-align: center;
	}
	.recommend h2 img {
		width: 105px;
	}
	.recommend .mainCateg {
		width: 86.2%;
		min-width: 280px;
		max-width: 400px;
		margin: 0 auto 40px;
		padding-left: 0;
	}
	.recommend .mainCateg li {
		margin-bottom: 50px;
		width: 250px;
	}
	.recommend .mainCateg li:nth-child(2) {
		margin-top: 0;
	}
	.recommend .mainCateg a > span {
		top: calc(50% - 10px);
		font-size: 15px;
	}
	.recommend .subCateg {
		width: 86.2%;
		min-width: 280px;
		margin: 0 auto 25px;
		flex-wrap: wrap;
	}
	.recommend .subCateg li {
		/*width: 44.6%;*/
		width: 100%;
		margin-bottom: 25px;
	}
	.recommend .subCateg a {
		padding: 15px 10px;
		font-size: 12px;
		line-height: 1.3;
	}
	.recommend .subCateg .title {
		margin-bottom: 15px;
		padding-bottom: 14px;
		height: 50px;
		font-size: 15px;
		line-height: 1.2;
		letter-spacing: 0;
	}
	.recommend .subCateg .title::after {
		left: 13px;
		right: 13px;
		border-width: 2px;
	}
	.recommend .btnList {
		display: block;
		width: 86.2%;
		min-width: 280px;
		margin: 0 auto;
	}
	.recommend .btnList li {
		width: auto;
		margin-bottom: 25px;
	}
	.recommend .btnList a {
		padding: 7px 5px;
		font-size: 15px;
	}
	.recommend .btnList a[href]:hover {
		opacity: 0.8;
	}
	.recommend .btnList a img {
		width: 30px;
		margin-right: 0;
	}
	.recommend .btnList small {
		font-size: 12px;
	}
}

.shopInfo {
	position: relative;
	margin-bottom: 100px;
	padding-left: 995px;
}
.shopInfo h2 {
	margin-bottom: 90px;
	text-align: right;
}
.shopInfo .img {
	position: absolute;
	left: -127px;
	bottom: 0;
}
.shopInfo .sec {
	margin-top: 70px;
	letter-spacing: 0.05em;
}
.shopInfo .sec p {
	margin-top: 25px;
}
.shopInfo .sec strong {
	font-size: 38px;
	letter-spacing: 0.1em;
}
@media screen and (max-width: 767px){
	.shopInfo {
		margin-bottom: 40px;
		padding-left: 0;
	}
	.shopInfo h2 {
		margin-bottom: 55px;
		text-align: center;
	}
	.shopInfo h2 img {
		width: 130px;
	}
	.shopInfo .img {
		position: static;
		margin: 0 -25px 45px;
	}
	.shopInfo .sec {
		width: 200px;
		margin: 30px auto 0;
		font-size: 13px;
	}
	.shopInfo .sec p {
		margin-top: 15px;
	}
	.shopInfo .sec strong {
		font-size: 25px;
	}
}

.map {
	margin-left: calc(840px - 50vw);
}
.map iframe {
	width: 100%;
	height: 800px;
	border: none;
}
@media screen and (max-width: 1720px){
	.map {
		margin-left: -20px;
	}
}
@media screen and (max-width: 767px){
	.map {
		margin: 0 -25px;
	}
	.map iframe {
		height: 400px;
	}
}