@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600&family=Zen+Kaku+Gothic+Antique:wght@300;400;500;700;900&display=swap');

*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body{
	color: #040000;
	font-family: 'Zen Kaku Gothic Antique', sans-serif;
}

a{
	text-decoration: none;
}

a:hover{
	opacity: 0.8;
}

p,li{
	font-size:16px;
	line-height:1.5;
}

.sp{
	display: none;
}

.js-scrollable {
   overflow-x: scroll;
}

.wrapper{
	width: 100%;
	max-width: 960px;
	margin-left: auto;
	margin-right: auto;
}

.wrapper_1120{
	width: 100%;
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
}

.relative{
	position: relative;
}

#top_bg{
	background-image: url("../images/top_bg.jpg?0222");
	background-size: cover;
	background-position: center;
	height: 420px;
	width: 100%;
	text-align: center;
	padding-top: 120px;
	margin-bottom: 80px;
}

#top_copy{
	text-align: center;
	font-family: 'Orbitron', sans-serif;
	color: #999;
	font-size: 22px;
	letter-spacing:10px;
	text-shadow: 0 0 10px #fff,0 0 30px #fff;
}

h1{
	font-size: 36px;
	line-height: 1.5;
	margin-bottom: 20px;
	font-weight: 700;
	text-shadow: 0 0 10px #fff,0 0 30px #fff;
}

.optm_banner{
	margin-bottom: 50px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.optm_banner img{
	width: 750px;
}



/*■■■■■■■■■■■■■■■■トップページ地図部分■■■■■■■■■■■■■■*/

#map_txt{
	text-align: center;
	margin-bottom: 70px;
}

#japan_map{
	background-image: url("../images/japan_map.svg");
	background-repeat: no-repeat;
	background-position: center;
	width: 840px;
	height: 850px;
}

#area_1,#area_2,#area_3,#area_4,#area_5,#area_6,#area_7,#area_8{
	padding: 10px 15px 15px;
	border-radius: 10px;
	background-color: #fff;
	width: 190px;
	position: absolute;
}

#area_1{
	border: solid 2px #6f9ed4;
	top: 240px;
	left: 730px;
}

#area_2{
	border: solid 2px #64b72f;
	top: 450px;
	left: 680px;
}

#area_3{
	border: solid 2px #23c2ac;
	top: 570px;
	left: 680px;
}

#area_4{
	border: solid 2px #a386cd;
	top: 240px;
	left: 350px;
}

#area_5{
	border: solid 2px #f199ad;
	top: 700px;
	left: 480px;
}

#area_6{
	border: solid 2px #f18900;
	top: 750px;
	left: 270px;
}

#area_7{
	border: solid 2px #dfba4c;
	top: 380px;
	left: 210px;
}

#area_8{
	border: solid 2px #ec7088;
	top: 470px;
	left: 0px;
}

#area_1::before,#area_2::before,#area_3::before,#area_4::before,#area_5::before,#area_6::before,#area_7::before,#area_8::before{
	content: "";
	background-repeat: no-repeat;
	position: absolute;
}

#area_1::before{
	background-image: url("../images/area_1_arrow.svg");
	top: 100px;
	left: -52px;
	width: 52px;
	height: 24px;
}

#area_2::before{
	background-image: url("../images/area_2_arrow.svg");
	top: 60px;
	left: -52px;
	width: 52px;
	height: 24px;
}

#area_3::before{
	background-image: url("../images/area_3_arrow.svg");
	top: 20px;
	left: -52px;
	width: 52px;
	height: 24px;
}

#area_4::before{
	background-image: url("../images/area_4_arrow.svg");
	bottom: -52px;
	left: 130px;
	width: 24px;
	height: 52px;
}

#area_5::before{
	background-image: url("../images/area_5_arrow.svg");
	top: -52px;
	left: 20px;
	width: 24px;
	height: 52px;
}

#area_6::before{
	background-image: url("../images/area_6_arrow.svg");
	top: -52px;
	left: 120px;
	width: 24px;
	height: 52px;
}

#area_7::before{
	background-image: url("../images/area_7_arrow.svg");
	bottom: -52px;
	left: 100px;
	width: 24px;
	height: 52px;
}

#area_8::before{
	background-image: url("../images/area_8_arrow.svg");
	bottom: -52px;
	left: 130px;
	width: 24px;
	height: 52px;
}

#area_1 h2,#area_2 h2,#area_3 h2,#area_4 h2,#area_5 h2,#area_6 h2,#area_7 h2,#area_8 h2{	
	border-radius: 10px;
	text-align: center;
	margin-bottom: 5px;
}

#area_1 h2{	
	background-color: #6f9ed4;
}

#area_2 h2{	
	background-color: #64b72f;
}

#area_3 h2{	
	background-color: #23c2ac;
}

#area_4 h2{	
	background-color: #a386cd;
}

#area_5 h2{	
	background-color: #f199ad;
}

#area_6 h2{	
	background-color: #f18900;
}

#area_7 h2{	
	background-color: #dfba4c;
}

#area_8 h2{	
	background-color: #ec7088;
}

#area_1 h2 a,#area_2 h2 a,#area_3 h2 a,#area_4 h2 a,#area_5 h2 a,#area_6 h2 a,#area_7 h2 a,#area_8 h2 a{
	color: #fff;
	padding: 5px;
	display: block;
	font-size: 18px;
	font-weight: bold;
}

#map{
	margin-bottom: 150px;
}

#map li{
	display: inline-block;
}

#map li::after{
	content: "｜";
}

#map li:last-child::after{
	content: "";
}

#map li a{
	color: #040000;
}



/*■■■■■■■■■■■■■■■■店舗一覧■■■■■■■■■■■■■■*/


.return_btn{
	text-align: center;
	background-color: #004898;
	color: #fff;
	display: inline-block;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 60px;
	border-radius: 10px;
}

.return_btn a{
	color: #fff;
	display: block;
	padding: 20px 40px;
}

#area h1{
	font-size: 36px;
	line-height: 1.5;
	margin-bottom: 60px;
	font-weight: 700;
	text-align: center;
	margin-top: 100px;
}

#area_top_txt{
	font-size: 18px;
	text-align: center;
	margin-bottom: 60px;
}

.blue_big{
	color: #004898;
	font-size: 36px;
	font-weight: bold;
}

#area h2{
	font-size: 21px;
	font-weight: bold;
	text-align: center;
	background-color: #eee;
	padding: 15px;
	margin-bottom: 40px;
}

#area td{
	vertical-align: middle;
}

.fixed_item{
	width: 900px!important;
}

.fixed_item td{
	background-color: #eee!important;
	position: -webkit-sticky; /* safari対応 */
	position: sticky;
	top: 0px;
	font-weight: bold;
}

.fixed_item td:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: solid 1px #000;
  z-index: -1;
}

.over_visible{
	overflow: visible!important;
	border-collapse : collapse;
	text-align: center;
	margin-bottom: 80px;
}

.over_scroll{
	 overflow-y: visible!important;
}

.store_item td{
	width: 7%;
}

.store_item td:first-child{
	width: 30%!important;
}

.table_left{
	float: left;
	width: 20%;
}

.table_right{
	float: left;
	text-align: left!important;
	margin-left: 5%;
	line-height: 1.6;
	color: #000!important;
	word-break:break-all!important;
	width: 75%;
}

.store_item td{
	color: #004898;
	border: solid 1px #000;
}

.fixed_top{
	width: 100%;
	border-collapse: separate;
	border-spacing:0;
	z-index: 500;
}

.fixed_top td{
	padding: 5px;
	font-size: 11px;
}

.fixed_top p{
	font-size: 11px;
}

.fixed_top img{
	width: 100%;
}

.fixed_2{
	width: 20%;
}

.fixed_1{
	width: 10%;
}

.fixed_3{
	width: 30%;
}

.fixed_beside{
	position: sticky;
	position: -webkit-sticky;
	left: 0;
	z-index: 1000!important;
}

.fixed_beside:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: solid 1px #000;
  z-index: -1;
}

.fixed_beside2{
	position: sticky;
	position: -webkit-sticky;
	left: 0;
	z-index: 1100!important;
}

.fixed_beside2:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: solid 1px #000;
  z-index: -1;
}

.storyca_table_wrap{
	height: 650px;
	margin-bottom: 5px;
}
	
.storyca_table{
	margin-bottom: 0px;
	box-sizing: border-box;
	width: 1400px;
	overflow-x: hidden;
}

.storyca_table td{
	background-color: #fff;
}

.top_alignment{
	vertical-align: top!important;
}






/*■■■■■■■■■■■■■■■■■■■■スマホ用■■■■■■■■■■■■■■■■■■■■■■■*/

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

body{
	font-weight: 500;
}

.wrapper,.wrapper_1120{
	width: 94%;
	margin-left: 3%;
	margin-right: 3%;
}

wrapper_1120

img{
	width: 100%!important;
}

p,li{
	font-size:16px;
	line-height:1.7;
}
	
.pc{
	display: none;
}

.sp{
	display: block;
}
	
#top_bg{
	background-image: url("../images/top_bg_sp.jpg?0222");
	background-position: center;
	height: calc(100vw / 1.2);
	min-height: 360px;
	width: 100%;
	text-align: center;
	padding-top: 50px;
	margin-bottom: 60px;
}

#top_copy{
	font-size: 18px;
	letter-spacing:8px;
}

h1{
	font-size: 27px;
	line-height: 1.3;
	margin-bottom: 15px;
}

.txt16{
	font-size: 16px!important;
}
	
.mb50{
	margin-bottom: 30px;
}
	
.optm_banner{
	margin-bottom: 30px;
}

.optm_banner img{
	width: 100%;
}
	
	
	
/*■■■■■■■■■■■■■■■■トップページ地図部分SP■■■■■■■■■■■■■■*/

#map_txt{
	text-align: center;
	margin-bottom: 40px;
}

#japan_map{
	background-image: url("../images/japan_map.svg");
	background-repeat: no-repeat;
	background-position: center;
	width: 100%;
	height: calc(100vw / 1);
}

#area_1,#area_2,#area_3,#area_4,#area_5,#area_6,#area_7,#area_8{
	padding: 10px;
	border-radius: 10px;
	background-color: #fff;
	width: 100%;
	position: static;
	margin-bottom: 10px;;
}



#area_1::before,#area_2::before,#area_3::before,#area_4::before,#area_5::before,#area_6::before,#area_7::before,#area_8::before{
	content: "";
	background-image: none;
	background-repeat: no-repeat;
	position: static;
}

#area_1 h2,#area_2 h2,#area_3 h2,#area_4 h2,#area_5 h2,#area_6 h2,#area_7 h2,#area_8 h2{	
	border-radius: 8px;
}

#area_1 h2 a,#area_2 h2 a,#area_3 h2 a,#area_4 h2 a,#area_5 h2 a,#area_6 h2 a,#area_7 h2 a,#area_8 h2 a{
	font-size: 16px;
}

#map{
	margin-bottom: 80px;
}

#map li{
	display: inline-block;
}

#map li::after{
	content: "｜";
}

#map li a{
	color: #040000;
}


	
/*■■■■■■■■■■■■■■■■店舗一覧SP■■■■■■■■■■■■■■*/

.return_btn{
	font-size: 16px;
	margin-bottom: 40px;
}

.return_btn a{
	padding: 15px 30px;
}	
	
#area h1{
	font-size: 30px;
	line-height: 1.5;
	margin-bottom: 40px;
	margin-top: 70px;
}

#area_top_txt{
	font-size: 16px;
	margin-bottom: 40px;
}

.blue_big{
	font-size: 30px;
}

#area h2{
	font-size: 18px;
	padding: 12px;
	margin-bottom: 30px;
}
	


.fixed_item td{
	background-color: #eee!important;
	position: -webkit-sticky; /* safari対応 */
	position: sticky;
	top: 0px;
}

.table_left{
	float: none;
	text-align: left!important;
	width: 100%;
}
	
.table_left img{
	width: 30%!important;
	margin-bottom: 5px;
}

.table_right{
	float: none;
	text-align: left!important;
	margin-left: 0px;
	line-height: 1.4;
	width: 100%;
	font-size: 14px!important;
}

.storyca_table_wrap{
	height: 540px;
}
	
.storyca_table{
	margin-bottom: 0px;
	box-sizing: border-box;
	overflow-x: hidden;
	width: 1000px!important;
}
	
.store_item .fixed_beside{
	padding: 3px;
}
	
.storyca_table td{
	line-height: 1.4!important;
}
	
.fixed_beside{
	position: sticky;
	position: -webkit-sticky;
	left: 0;
	z-index: 2;
	width: 200px!important;
}
	
.fixed_beside2{
	white-space: nowrap;
	padding: 5px;
	width: 200px!important;
}

.fixed_top{
	width: 900px!important;
}
	
}