@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Heebo&family=Noto+Serif+JP:wght@400;500;700&display=swap');

a:hover{
	color: #666;
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

body {
	font-family: "Noto Sans Japanese", -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "游ゴシック  Medium", meiryo, sans-serif;
	font-size: 14px;
	-webkit-text-size-adjust: 100%;
	color: #000;
}

img {
	max-width: 100%;
	height: auto;
}

#wrap {
	width: 100%;
}

#wrap header {
	width: 100%;
	color: #fff;
	padding: 14px 0;
	background: #000;
}

#wrap header #headerBox {
	display: table;
	max-width: 1000px;
	margin: auto;
}

#wrap header #headerBox h1 {
	display: table-cell;
	width: 53.5%;
	vertical-align: middle;
}

#wrap header #headerBox h1 img {
	width: 21.5%;
	vertical-align: middle;
	margin-right: 15px;
}

#wrap header #headerBox #headerNav {
}

#wrap header #headerBox #headerNav > ul {
}

#wrap header #headerBox #headerNav > ul > li {
	float: left;
	padding: 15px;
}

#wrap header #headerBox #headerNav > ul > li:nth-child(n+5) {
	width: 6%;
	padding: 15px 5px;
}

#wrap header #headerBox #headerNav ul li a {
	color: #fff;
}

#wrap header #headerBox #headerNav > ul > li > a:hover {
	border-bottom: 2px solid #fff;
}

#wrap header #headerBox #headerNav > ul > li:nth-child(n+5) a:hover {
	border-bottom: none;
}

#wrap header #headerBox #headerNav ul li .arrow:before {
  font-family: 'FontAwesome';
  content: "\f107";
	padding-right: 5px;
}

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

	#wrap header #headerBox {
		display: block;
		max-width: 95%;
		padding-left: 5%;
	}

	#wrap header #headerBox h1 {
		display: block;
		width: 100%;
		font-size: 11px;
	}
	
	#wrap header #headerBox h1 img {
		display: block;
		width: 15%;
		margin-right: 0;
		margin-bottom: 5px;
	}

	#wrap header #headerBox #headerNav > ul {
		position: absolute;
	}

	#wrap header #headerBox #headerNav > ul > li {
		float: none;
		width: 85%;
		font-size: 22px;
		text-align: right;
		padding: 7% 10% 7% 5%;
	}

	#wrap header #headerBox #headerNav > ul > li:nth-child(n+5) {
		float: right;
		width: 11%;
	}

	#wrap header #headerBox #headerNav > ul > li:nth-child(5) {
		padding: 2.5% 10% 2.5% 0;
	}

	#wrap header #headerBox #headerNav > ul > li:nth-child(6) {
		padding: 2.5% 5% 2.5% 0;
	}

	#wrap header #headerBox #headerNav > ul > li:last-child {
		text-align: left;
	}

	#wrap header #headerBox #headerNav > ul > li > a:hover {
		border-bottom: none;
	}
}

#wrap #pankuzu {
	font-family: 'Heebo', sans-serif;
	font-size: 12px;
	max-width: 1000px;
	margin: 0 auto 90px;
	padding-top: 20px;
}

#wrap #pankuzu a {
	color: #000;
	text-decoration: underline;
}

#wrap #pankuzu a:after {
	display: inline-block;
	content: '＞';
	text-decoration: none;
	padding: 0 12px;
}

#wrap #pankuzu a:hover {
	text-decoration: none;
}

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

	#wrap #pankuzu {
		max-width: 90%;
		margin: 0 auto 9%;
		padding: 3% 5% 0;
	}
}

#wrap #contents {
	max-width: 1000px;
	margin: 0 auto 130px;
}

/* 一覧共通 */
#wrap #contents h2 {
	font-size: 0;
	text-align: center;
	padding-bottom: 20px;
	margin: 0 auto 20px;
	border-bottom: 1px solid #000;
}

#wrap #contents #ttlLantiki img {
	max-width: 20%;
}

#wrap #contents #ttlMinotaur img {
	max-width: 30%;
}

#wrap #contents #ttlQuadro img {
	max-width: 30%;
}

#wrap #contents #ttlNewBalance img {
	max-width: 25%;
}

#wrap #contents #ttlCpCompany img {
	max-width: 9%;
}

#wrap #contents #ttlMbasebar img {
	max-width: 35%;
}

#wrap #contents .brandCopy {
	font-size: 16px;
}

/* 詳細共通 */
#wrap #contents.details h2 {
	padding-bottom: 0;
	margin-bottom: 80px;
	border-bottom: none;
}

#wrap #contents.details #ttlLantiki img {
	max-width: 20%;
}

#wrap #contents.details #ttlMinotaur img {
	max-width: 30%;
}

#wrap #contents.details #ttlQuadro img {
	max-width: 30%;
}

#wrap #contents.details #ttlNewBalance img {
	max-width: 25%;
}

#wrap #contents.details #ttlCpCompany img {
	max-width: 9%;
}

#wrap #contents.details #ttlMbasebar img {
	max-width: 35%;
}

#wrap .event #contents.details h2 {
	font-size: 48px;
	font-weight: bold;
}

#wrap #contents.details .brandCopy {
	padding-bottom: 10px;
	margin-bottom: 20px;
	border-bottom: 1px solid #000;
}

#wrap #contents.details .brand {
	display: inline-block;
  background: #000;
  color: #fff;
  line-height: 1.1;
  padding: 6px 10px;
  margin-bottom: 20px;
	border-radius: 4px;
}

#wrap #contents.details .date {
  margin-bottom: 40px;
}

#wrap #contents.details h3 {
	font-size: 24px;
	font-weight: bold;
	line-height: 1;
	padding-bottom: 15px;
  margin-bottom: 90px;
	border-bottom: 1px solid #000;
}

#wrap #contents.details .detailsBox p {
  margin-bottom: 20px;
}

#wrap #contents.details .detailsBox p:last-of-type {
  margin-bottom: 70px;
}

#wrap #contents.details .detailsBox a {
	color: #069;
	text-decoration: underline;
}

#wrap #contents.details .detailsBox a:hover {
	text-decoration: none;
}

#wrap #contents.details .photo {
	max-width: 648px;
  margin-bottom: 50px !important;
}


#wrap #contents .listBox {
	margin-top: 80px;
}

#wrap .pagination {
	max-width: 1000px;
	margin: auto;
	padding-top: 20px;
	border-top: 1px solid #000;
}

#wrap .pagination li {
	float: left;
	text-align: center;
	margin-right: 10px;
}

#wrap .pagination li:last-child {
	margin-right: 0;
}

#wrap .pagination li a {
	display: block;
	color: #000;
	font-weight: bold;
	line-height: 1;
	padding: 5px 7px;
	border: 1px solid #000;
	border-radius: 3px;
}

#wrap .pagination li .current {
	color: #fff;
	background: #000;
}

#wrap #contents .paging {
	text-align: center;
	padding-top: 20px;
	border-top: 1px solid #000;
}

#wrap #contents .paging li {
	display: inline-block;
	text-align: center;
}

#wrap #contents .paging .articleBack {
	float: left;
}

#wrap #contents .paging .articleNext {
	float: right;
}

#wrap #contents .paging li a {
	display: inline-block;
	color: #000;
	font-weight: bold;
	line-height: 1;
	text-align: center;
	padding: 5px 7px;
	border-radius: 3px;
}

#wrap #contents .paging .articleBack a, #wrap #contents .paging .articleNext a {
	color: #fff;
	background: #000;
}

#wrap #contents .paging .articleBack a:before {
	content: '<';
	padding-right: 5px;
}

#wrap #contents .paging .articleNext a:after {
	content: '>';
	padding-left: 5px;
}

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

	#wrap #contents {
		max-width: 90%;
		margin: 0 auto 20%;
		padding: 0 5%;
	}

	#wrap #contents #ttlLantiki img {
		max-width: 35%;
	}

	#wrap #contents #ttlMinotaur img {
		max-width: 45%;
	}

	#wrap #contents #ttlQuadro img {
		max-width: 45%;
	}

	#wrap #contents #ttlNewBalance img {
		max-width: 40%;
	}

	#wrap #contents #ttlCpCompany img {
		max-width: 24%;
	}

	#wrap #contents #ttlMbasebar img {
		max-width: 50%;
	}
	
	#wrap #contents.details h2 {
		margin-bottom: 10%;
	}

	#wrap #contents.details #ttlLantiki img {
		max-width: 30%;
	}

	#wrap #contents.details #ttlMinotaur img {
		max-width: 45%;
	}

	#wrap #contents.details #ttlQuadro img {
		max-width: 45%;
	}

	#wrap #contents.details #ttlNewBalance img {
		max-width: 40%;
	}

	#wrap #contents.details #ttlCpCompany img {
		max-width: 24%;
	}

	#wrap #contents.details #ttlMbasebar img {
		max-width: 50%;
	}

	#wrap .event #contents.details h2 {
		font-size: 24px;
	}

	#wrap #contents.details h3 {
		margin-bottom: 7%;
	}

	#wrap #contents.details .photo {
		max-width: 100%;
		margin-bottom: 7%;
	}

	#wrap #contents.details .txt:last-of-type {
		margin-bottom: 10%;
	}

	#wrap .pagination {
		max-width: 100%;
	}
}

#wrap .thumbnail .iframe {
	position: relative;
	max-width: 1000px;
	width: 100%;
	margin: auto;
}

#wrap #topics .iframe {
	height: 820px;
	/*padding-top: 56.25%;*/
}

#wrap #popup .iframe {
	height: 395px;
	overflow: hidden;
	margin-bottom: 30px;
	/*padding-top: 27.25%;*/
}


#wrap .thumbnail .iframe iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 768px) {
	#wrap #topics .iframe {
		max-width: 100%;
		height: 100%;
		padding-top: 325%;
	}

	#wrap #popup .iframe {
		height: 100%;
		padding-top: 160%;
	}
}

/*@media screen and (max-width: 1280px) {
	#wrap #popup .iframe {
		padding-top: 26.25%;
	}
}

@media screen and (max-width: 1200px) {
	#wrap #topics .iframe {
		padding-top: 60%;
		}

	#wrap #popup .iframe {
		padding-top: 29%;
	}
}

@media screen and (max-width: 1100px) {
	#wrap #topics .iframe {
		padding-top: 64%;
	}

	#wrap #popup .iframe {
		padding-top: 31%;
	}
}

@media screen and (max-width: 1040px) {
	#wrap #topics .iframe {
		padding-top: 68%;
	}

	#wrap #popup .iframe {
		padding-top: 33%;
	}
}

@media screen and (max-width: 1014px) {
	#wrap #topics .iframe {
		padding-top: 66%;
	}

	#wrap #popup .iframe {
		padding-top: 30%;
	}
}

@media screen and (max-width: 970px) {
	#wrap #topics .iframe {
		padding-top: 71%;
	}

	#wrap #popup .iframe {
		padding-top: 35%;
	}
}

@media screen and (max-width: 920px) {
	#wrap #topics .iframe {
		padding-top: 75%;
	}

	#wrap #popup .iframe {
		padding-top: 37%;
	}
}

@media screen and (max-width: 880px) {
	#wrap #topics .iframe {
		padding-top: 77%;
	}

	#wrap #popup .iframe {
		padding-top: 38%;
	}
}

@media screen and (max-width: 860px) {
	#wrap #topics .iframe {
		padding-top: 170%;
	}

	#wrap #popup .iframe {
		padding-top: 85%;
	}
}

@media screen and (max-width: 820px) {
	#wrap #topics .iframe {
		padding-top: 85%;
	}

	#wrap #popup .iframe {
		padding-top: 42%;
	}
}

@media screen and (max-width: 784px) {
	#wrap #topics .iframe {
		padding-top: 234%;
	}

	#wrap #popup .iframe {
		padding-top: 95%;
	}
}

@media screen and (max-width: 768px) {
	#wrap #topics .iframe {
		max-width: 100%;
		padding-top: 250%;
	}

	#wrap #popup .iframe {
		padding-top: 133%;
	}
}

@media screen and (max-width: 700px) {
	#wrap #topics .iframe {
		padding-top: 255%;
	}
}

@media screen and (max-width: 655px) {
	#wrap #topics .iframe {
		padding-top: 260%;
	}
}

@media screen and (max-width: 590px) {
	#wrap #topics .iframe {
		padding-top: 265%;
	}
}

@media screen and (max-width: 540px) {
	#wrap #topics .iframe {
		padding-top: 280%;
	}

	#wrap #popup .iframe {
		padding-top: 146%;
	}
}

@media screen and (max-width: 500px) {
	#wrap #topics .iframe {
		padding-top: 290%;
	}
}

@media screen and (max-width: 460px) {
	#wrap #topics .iframe {
		padding-top: 300%;
	}

	#wrap #popup .iframe {
		padding-top: 149%;
	}
}

@media screen and (max-width: 440px) {
	#wrap #topics .iframe {
		padding-top: 310%;
	}
	#wrap #popup .iframe {
		padding-top: 161%;
	}
}

@media screen and (max-width: 410px) {
	#wrap #topics .iframe {
		padding-top: 320%;
	}

	#wrap #popup .iframe {
		padding-top: 151%;
	}
}
@media screen and (max-width: 393px) {
		#wrap #topics .iframe {
		padding-top: 320%;
	}

	#wrap #popup .iframe {
		padding-top: 170%;
	}
}
@media screen and (max-width: 375px) {
		#wrap #topics .iframe {
		padding-top: 330%;
	}


	#wrap #popup .iframe {
		padding-top: 171%;
	}
}
@media screen and (max-width: 320px) {
		#wrap #topics .iframe {
		padding-top: 360%;
	}


	#wrap #popup .iframe {
		padding-top: 191%;
	}
}*/


/* TOPICS POP-UP 共通 */
#wrap .thumbnail {
	margin-bottom: 130px;
}

#wrap .thumbnail h2 {
	font-size: 32px;
	font-weight: bold;
	text-align: center;
	margin-bottom: 40px;
}

#wrap .thumbnail .listBox {
	max-width: 1000px;
	margin: 0 auto 15px;
}

#wrap .thumbnail .listBox li {
	float: left;
	width: 235px;
	margin: 0 20px 40px 0;
}

#wrap .thumbnail .listBox li:nth-child(4n) {
	margin: 0 0 40px;
}

#wrap .thumbnail .listBox li:nth-child(4n+1) {
	clear: both;
}

#wrap .thumbnail .listBox li dl {
	position: relative;
}

#wrap .thumbnail .listBox li dl .pht {
	margin-bottom: 15px;
}

#wrap .thumbnail .listBox li dl dt .new {
	position: absolute;
	top: 0;
	left: 0;
	width: 22%;
}

#wrap .thumbnail .listBox li dl dd dl {
	display: table;
	width: 100%;
	margin-bottom: 10px;
}

#wrap .thumbnail .listBox li dl dd dl dt, #wrap .thumbnail .listBox li dl dd dl dd {
	display: table-cell;
	vertical-align: top;
}

#wrap .thumbnail .listBox li dl dd dl .brand {
	width: 42%;
}

#wrap .thumbnail .listBox li dl dd dl .brand a {
	display: inline-block;
	font-size: 12px;
	color: #fff;
	line-height: 1;
	padding: 5px 10px;
	background: #000;
}

#wrap .thumbnail .listBox li dl dd dl .date {
	width: 58%;
	font-size: 12px;
	text-align: right;
	margin-bottom: 15px;
}

#wrap .thumbnail .listBox li dl dd p {
	font-size: 13px;
	line-height: 1.5;
}

#wrap .thumbnail .listBox li dl dd p a {
	text-decoration: underline;
}

#wrap .thumbnail .listBox li dl dd p a:hover {
	text-decoration: none;
}

#wrap .thumbnail .more {
	text-align: center;
	max-width: 1000px;
	margin: 0 auto;
}

#wrap .thumbnail .more img {
	width: 8.6%;
}

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

	#wrap .thumbnail {
		margin-bottom: 20%;
		padding: 0 5%;
	}

	#wrap .thumbnail h2 {
		margin-bottom: 5%;
	}

	#wrap .thumbnail .listBox {
		max-width: 100%;
		margin: 0 auto 2%;
	}
	
	.listBox li dl dd dl .brand a {
		padding: 5px;
	}

	#wrap .thumbnail .listBox li {
		width: 48%;
		margin: 0 2% 5% 0;
	}

	#wrap .thumbnail .listBox li:nth-child(4n) {
		margin: 0 0 5%;
	}

	#wrap .thumbnail .listBox li:nth-child(even) {
		margin: 0 0 5% 2%;
	}

	#wrap .thumbnail .listBox li:nth-child(4n+1) {
		clear: none;
	}

	#wrap .thumbnail .listBox li:nth-child(odd) {
		clear: both;
	}

	#wrap .thumbnail .listBox li dl dd dl .brand {
		width: 50%;
	}

	#wrap .thumbnail .listBox li dl dd dl .brand a {
		font-size: 11px;
	}

	#wrap .thumbnail .listBox li dl dd dl .date {
		width: 50%;
	}

	#wrap .thumbnail .more {
		max-width: 100%;
	}

	#wrap .thumbnail .more img {
		width: 24%;
	}
}


/* SNS */
#wrap #sns {
	width: 100%;
	padding: 50px 0 80px;
	background: #eee;
}

#wrap #sns h2 {
	font-size: 32px;
	font-weight: bold;
	text-align: center;
	margin-bottom: 52px;
}

#wrap #sns section {
	display: table;
	table-layout:fixed;
	max-width: 1000px;
	margin: auto;
}

#wrap #sns section .snsBox {
	display: table-cell;
	max-width: 500px;
	vertical-align: top;
}

#wrap #sns section .snsBox:first-child {
	padding-right: 2%;
}

#wrap #sns section .snsBox:last-child {
	padding-left: 2%;
}

#wrap #sns section .snsBox h3 {
	font-size: 22px;
	font-weight: bold;
	text-align: center;
	margin-bottom: 27px;
}

#wrap #sns section .snsBox #facebookBox {
	width: 500px;
}

#wrap #sns section .snsBox #facebookBox iframe {
	margin: auto;
}

#wrap #sns section .instagram ul {
	width: 100%;
}

#wrap #sns section .instagram ul li {
	float: left;
	width: 48%;
	margin: 0 0 2%;
}

#wrap #sns section .instagram ul li:nth-child(odd) {
	margin: 0 2% 4% 0;
}

#wrap #sns section .instagram ul li:nth-child(even) {
	margin: 0 0 4% 2%;
}

#wrap #sns section .instagram ul li img {
	width: 100%;
}

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

	#wrap #sns {
		width: 90%;
		padding: 5%;
	}

	#wrap #sns h2 {
		margin-bottom: 5%;
	}
	
	#wrap #sns section {
		display: block;
		max-width: 100%;
	}

	#wrap #sns section .snsBox {
		display: block;
		max-width: 100%;
	}

	#wrap #sns section .snsBox:first-child {
		margin-bottom: 7%;
		padding-right: 0;
	}

	#wrap #sns section .snsBox:last-child {
		padding-left: 0;
	}

	#wrap #sns section .snsBox #facebookBox {
		width: 100%;
	}

	#wrap #sns section .snsBox #facebookBox > .fb-page {
		width: 100%;
	}

	#wrap #sns section .snsBox #facebookBox > .fb-page > span,
	#wrap #sns section .snsBox #facebookBox iframe {
		width: 100% !important;
	}

	#wrap #sns section .instagram ul li {
		float: left;
		width: 48%;
		margin: 0 0 2%;
	}
}


/* BLAND LIST & LOCATION */
#wrap #shopDetails {
	width: 100%;
	padding: 50px 0 80px;
	background: url(../../img/footer_bg_pc.png) repeat center top;
}

#wrap #shopDetails section {
	display: table;
	table-layout:fixed;
	max-width: 1000px;
	margin: auto;
}

#wrap #shopDetails section .shopDetailsBox {
	display: table-cell;
	width: 48%;
	vertical-align: top;
}

#wrap #shopDetails section .shopDetailsBox:first-child {
	padding-right: 2%;
}

#wrap #shopDetails section .shopDetailsBox:last-child {
	padding-left: 2%;
}

#wrap #shopDetails section .shopDetailsBox h2 {
	font-size: 32px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	margin-bottom: 52px;
}

#wrap #shopDetails section .brandList ul {
}

#wrap #shopDetails section .brandList ul li {
	float: left;
	width: 48%;
	margin: 0 2% 4% 0;
}

#wrap #shopDetails section .brandList ul li:nth-child(even) {
	margin: 0 0 4% 2%;
}

#wrap #shopDetails section .brandList ul li:nth-child(odd) {
	clear: both;
}

#wrap #shopDetails section .location {
	font-size: 13px;
	font-weight: bold;
	color: #fff;
}

#wrap #shopDetails section .location p {
	margin-bottom: 15px;
}

#wrap #shopDetails section .location p img {
	width: 100%;
}

#wrap #shopDetails section .location .concept {
	margin: 20px 0 30px;
}

#wrap #shopDetails section .location .concept a {
	color: #000;
	text-align: center;
	padding: 7px 30px;
	background: #fff;
}

#wrap #shopDetails section .location .concept a:before {
	display: inline-block;
	width: 20px;
	height: 15px;
	content: '';
	margin-right: 10px;
	background: url(../../img/icon_arrow.png) no-repeat center center;
	background-size: contain;
}

#wrap #shopDetails section .location .tel {
	color: #fff;
	text-decoration: underline;
	cursor: default;
	pointer-events: none;
}

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

	#wrap #shopDetails {
		width: 100%;
		padding: 7% 0 10%;
		background: url(../../img/footer_bg_sp.png) repeat center top;
		background-size: contain;
	}

	#wrap #shopDetails section {
		display: block;
		max-width: 90%;
		padding: 0 5%;
	}

	#wrap #shopDetails section .shopDetailsBox {
		display: block;
		width: 100%;
	}

	#wrap #shopDetails section .shopDetailsBox:first-child {
		margin-bottom: 12%;
		padding-right: 0;
	}

	#wrap #shopDetails section .shopDetailsBox:last-child {
		padding-left: 0;
	}

	#wrap #shopDetails section .shopDetailsBox h2 {
		margin-bottom: 5%;
	}

	#wrap #shopDetails section .brandList ul li {
		width: 31%;
		margin: 0 1.75% 4%;
	}

	#wrap #shopDetails section .brandList ul li:nth-child(even) {
		margin: 0 1.75% 4%;
	}

	#wrap #shopDetails section .brandList ul li:nth-child(odd) {
		clear: none;
	}

	#wrap #shopDetails section .brandList ul li:nth-child(3n) {
		margin: 0 0 4% 1.75%;
	}

	#wrap #shopDetails section .brandList ul li:nth-child(3n+1) {
		clear: both;
		margin: 0 1.75% 4% 0;
	}

	#wrap #shopDetails section .location .tel {
		color: #fff;
		cursor: default;
		pointer-events: auto;
	}
}


footer {
	color: #fff;
	padding: 50px 0;
	background: #000;
}

footer #footerBox {
	max-width: 1000px;
	margin: auto;
}

footer a:link {
  color: #fff;
  text-decoration: none;
}

footer a:visited {
  color: #fff;
  text-decoration: none;
}

footer a:hover {
  color: #fff;
  text-decoration: underline;
  opacity: 1;
}

footer #footerMbase {
	margin-bottom: 30px;
}

footer #footerMbase dl {
	display: table;
}

footer #footerMbase dl dt, footer #footerMbase dl dd {
	display: table-cell;
	vertical-align: top;
}

footer #footerMbase dl dt {
	width: 16.4%;
}

footer #footerMbase dl dt img {
	width: 100%;
}

footer #footerMbase dl dd {
	width: 83.6%;
	padding: 0 240px 0 50px;
}

footer #footerMbase dl dd .footerList {
	float: left;
	margin: 0 20px;
}

footer #footerMbase dl dd .footerList .ttl {
	font-size: 15px;
	font-weight: bold;
}

footer #footerMbase dl dd .footerList ul {
	margin-top: 15px;
}

footer #footerMbase dl dd .footerList ul li {
	font-size: 12px;
	margin-bottom: 15px;
}

footer #footerMbase dl dd .footerList ul li:before {
	content: 'ー';
	margin-right: 10px;
}

footer #footerMbase dl dd .footerList:last-child {
	width: 12%;
}

footer #footerMbase dl dd .footerList:last-child p img {
	width: 32%;
}

footer #footerMbase dl dd .footerList:last-child p img:first-child {
	margin-right: 17%;
}

footer #footerKobe {
	padding-top: 42px;
	border-top: 1px solid #fff;
}

footer #footerKobe h2 {
	text-align: center;
}

footer #footerKobe h2 img {
	width: 25.8%;
}

footer #footerKobe .siteMap {
  width: 100%;
  font-size: 12px;
  line-height: 34px;
  text-align: center;
  margin: 25px auto 0;
}

footer #footerKobe .siteMap a {
	padding: 0 15px;
}

footer #footerKobe .siteMap a:first-child {
	padding: 0 15px 0 0;
}

footer #footerKobe .siteMap a:last-child {
	padding: 0 0 0 15px;
}

footer #footerKobe .copy {
  font-size: 10px;
  text-align: center;
  margin-top: 15px;
}

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

	footer #footerBox {
		max-width: 90%;
		padding: 0 5%;
	}

	footer #footerMbase dl {
		display: block;
	}

	footer #footerMbase dl dt, footer #footerMbase dl dd {
		display: block;
	}

	footer #footerMbase dl dt {
		width: 25%;
		margin-bottom: 7%;
	}

	footer #footerMbase dl dd {
		width: 100%;
		padding: 0;
	}

	footer #footerMbase dl dd .footerList {
		width: 22%;
		margin: 0 2%;
	}

	footer #footerMbase dl dd .footerList:first-child {
		width: 15%;
		margin: 0 2% 0 0;
	}

	footer #footerMbase dl dd .footerList:nth-child(2) {
		width: 29%;
	}

	footer #footerMbase dl dd .footerList:nth-child(3) {
		width: 15%;
	}

	footer #footerMbase dl dd .footerList:last-child {
		clear: both;
		float: none;
		width: 25%;
		margin: 0 auto;
	}

	footer #footerMbase dl dd .footerList:last-child p img {
		width: 40%;
	}

	footer #footerMbase dl dd .footerList:last-child p img:first-child {
		margin-right: 10%;
	}

	footer #footerKobe h2 img {
		width: 55%;
	}

	footer #footerKobe .siteMap a:nth-child(3) {
		display: block;
	}

	footer #footerKobe .siteMap span {
		display: block;
		margin-top: 20px;
	}
}


/* CONCEPT */
.pc_none { display: none; }
.sp_none { display: block; }

@media screen and (max-width: 768px) {
	.pc_none { display: block; }
	.sp_none { display: none; }
}

.fadein {
  opacity: 0;
  -webkit-transform: translate(0, 50px);
          transform: translate(0, 50px);
  transition: all .3s .3s ease-out;
}

.fadein.scrollin {
  opacity: 1;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
}

@keyframes fadein {
    100% {
			opacity: 1;
	}
}

#wrap #conceptBox *, #wrap #conceptInner *, #wrap #conceptInner *:before, #wrap #conceptInner *:after {
	box-sizing: border-box;
}

#wrap #conceptBox figure, #wrap #conceptInner figure {
	display: block;
	width: 100%;
	line-height: 1;
	margin: 0;
	padding: 0;
}

#wrap #conceptBox {
  background: url("../../concept/img/concept_bg_pc.png") no-repeat center top;
	background-size: cover;
}

#wrap #conceptBox #pankuzu {
	margin-bottom: 70px;
}

#wrap #conceptBox .thumbnail {
	margin-bottom: 80px;
}

#wrap #conceptMain {
	max-width: 1000px;
	margin: auto;
	opacity: 0;
}

.onloaded #conceptMain {
  position: relative;
  visibility: visible;
  animation: page 1.5s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}

@keyframes page {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

#wrap #conceptMain h2 {
	max-width: 100px;
	margin: 0 auto 55px;
}

#wrap #conceptMain p {
	font-family: 'Noto Serif JP', serif;
	font-size: 20px;
	line-height: 2.5;
	text-align: center;
	margin-bottom: 45px;
}

#wrap #conceptMain p:last-child {
	margin-bottom: 0;
	padding-bottom: 95px;
}

#wrap #conceptContents {
	max-width: 1000px;
	margin: auto;
}

#wrap #conceptContents > p {
	text-align: center;
}

#wrap #conceptInner #ttlBox {
  margin-bottom: 140px;
  padding-bottom: 130px;
  background: url("../../concept/img/mbase_bg.png") repeat-x center bottom;
  animation-name: slide_img;
  animation-duration: 40s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes slide_img {
  100% {
    background-position: -2000px bottom;
  }
}

#wrap .flexBox {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}

#wrap #conceptInner #ttlBox dl {
	max-width: 1000px;
	margin: 0 auto;
	opacity: 0;
  animation: fadein 3s ease forwards;
	animation-delay: 2.5s;
}

#wrap #conceptInner #ttlBox dl dt {
	width: 42%;
	padding-right: 15%;
}

#wrap #conceptInner #ttlBox dl dd {
	width: 58%;
}

#wrap #conceptInner #ttlBox dl dd p {
	font-size: 16px;
	font-weight: 400;
	line-height: 2.5;
}

#wrap #conceptInner #ttlBox dl dd p:not(:last-of-type) {
	margin-bottom: 30px;
}

@media screen and (max-width: 768px) {
	#wrap #conceptInner .thumbnail {
		padding: 0;
	}

	#wrap #conceptInner #ttlBox {
		margin-bottom: 25%;
		padding-bottom: 15%;
		background: url("../../concept/img/mbase_bg.png") repeat-x center bottom;
		background-size: contain;
	}

	#wrap #conceptInner #ttlBox dl {
		max-width: 90%;
	}
	
	#wrap #conceptInner #ttlBox dl dt {
		width: 100%;
		margin-bottom: 15%;
		padding-right: 35%;
	}
	
	#wrap #conceptInner #ttlBox dl dd {
		width: 100%;
	}
	
	#wrap #conceptInner #ttlBox dl dd p {
		font-size: 14px;
	}
	
	#wrap #conceptInner #ttlBox dl dd p:not(:last-of-type) {
		margin-bottom: 5%;
	}
}

#wrap #conceptInner .conceptContents {
	width: 100%;
	margin-bottom: 180px;
}

#wrap #conceptInner .conceptContents dl {
	width: 100%;
}

#wrap #conceptInner .conceptContents .flexBox2 {
	max-width: 1090px;
	margin: 0 auto;
}

#wrap #conceptInner .conceptContents dl dt {
	width: 48%;
}

#wrap #conceptInner .conceptContents .flexBoxR dt {
	order: 1;
}

#wrap #conceptInner .conceptContents .flexBox2 dt {
	width: 52%;
}

#wrap #conceptInner .conceptContents dl dt figure {
	overflow: hidden;
}

#wrap #conceptInner .conceptContents dl dt img {
	transition: opacity .5s linear,-webkit-transform 1s cubic-bezier(.36,.14,0,1);
	transition: transform 1s cubic-bezier(.36,.14,0,1),opacity .5s linear;
	transition: transform 1s cubic-bezier(.36,.14,0,1),opacity .5s linear,-webkit-transform 1s cubic-bezier(.36,.14,0,1);
	opacity: 0;
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
}

#wrap #conceptInner .conceptContents dl .scrollin img {
	opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

#wrap #conceptInner .conceptContents dl dd {
	width: 52%;
}

#wrap #conceptInner .conceptContents .flexBoxL dd {
	padding-left: 120px;
}

#wrap #conceptInner .conceptContents .flexBoxR dd {
	order: 0;
}

#wrap #conceptInner .conceptContents .flexBox2 dd {
	width: 48%;
}

#wrap #conceptInner .conceptContents dl dd h3 {
	font-family: 'Noto Serif JP', serif;
	font-size: 28px;
	line-height: 1;
	margin-bottom: 70px;
}

#wrap #conceptInner .conceptContents dl dd p {
	font-size: 16px;
	line-height: 2.5;
}

#wrap #conceptInner .conceptContents dl dd p:not(:last-of-type) {
	margin-bottom: 15px;
}

@media screen and (max-width: 768px) {
	#wrap #conceptInner .conceptContents {
		width: 90%;
		margin: 0 auto 25%;
	}
	
	#wrap #conceptInner .conceptContents .flexBox2 {
		max-width: 100%;
	}
	
	#wrap #conceptInner .conceptContents dl dt {
		width: 100%;
		margin-bottom: 7%;
	}
	
	#wrap #conceptInner .conceptContents .flexBoxR dt {
		order: 0;
	}
	
	#wrap #conceptInner .conceptContents .flexBox2 dt {
		width: 100%;
	}
	
	#wrap #conceptInner .conceptContents dl dd {
		width: 100%;
	}
	
	#wrap #conceptInner .conceptContents .flexBoxL dd {
		padding-left: 0;
	}
	
	#wrap #conceptInner .conceptContents .flexBoxR dd {
		order: 1;
	}
	
	#wrap #conceptInner .conceptContents .flexBox2 dd {
		width: 100%;
	}
	
	#wrap #conceptInner .conceptContents dl dd h3 {
		font-size: 24px;
		margin-bottom: 10%;
	}
	
	#wrap #conceptInner .conceptContents dl dd p {
		font-size: 14px;
	}
	
	#wrap #conceptInner .conceptContents dl dd p:not(:last-of-type) {
		margin-bottom: 3%;
	}
}

#wrap #conceptContents #conceptPhoto {
	max-width: 454px;
	margin: 80px auto 0;
}

#wrap #conceptContents #conceptPhoto dl {
}

#wrap #conceptContents #conceptPhoto dl dt {
	margin-bottom: 32px;
}

#wrap #conceptContents #conceptPhoto dl dd {
	padding-bottom: 80px;
}

#wrap #conceptContents #conceptPhoto dl dd:last-of-type {
	padding-bottom: 0;
}

#wrap #conceptContents #conceptPhoto dl dd h3 {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 25px;
}

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

	#wrap #conceptBox {
		background: url("../../concept/img/concept_bg_sp.png") repeat-x center top;
		background-size: cover;
	}
	
	#wrap #conceptBox .thumbnail {
		margin-bottom: 10%;
	}

	#wrap #conceptMain {
		max-width: 100%;
	}

	#wrap #conceptMain p {
		font-size: 16px;
		margin-bottom: 10%;
	}

	#wrap #conceptMain p:last-child {
		padding-bottom: 17%;
	}

	#wrap #conceptContents {
		max-width: 100%;
	}

	#wrap #conceptContents #conceptPhoto {
		max-width: 100%;
		margin: 10% auto 0;
	}

	#wrap #conceptContents #conceptPhoto dl dt {
		margin-bottom: 7%;
	}

	#wrap #conceptContents #conceptPhoto dl dd, #wrap #conceptContents #conceptPhoto dl dd:last-of-type {
		padding-bottom: 20%;
	}
}


#pageTop {
  width: 1200px;
  position: fixed;
  bottom: 0;
  left: 50%;
  margin-left: -600px;
  z-index: 10;
  text-align: right;
}

#pageTop a {
  display: inline-block;
  width: 80px;
  height: 80px;
  background: url("../../img/icon_top.png") no-repeat 0 0;
  background-size: contain;
}

@media screen and (max-width: 768px) {
  #pageTop {
    width: 100%;
    left: 50%;
    margin-left: -50%;
  }
  #pageTop a {
    display: inline-block;
    width: 4.4em;
    height: 4.4em;
  }
}

/* 20230427 追記 */
.slide_stop {
	margin: 0 auto;
	text-align: center;
	background-color: #000;
}