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

/* icomoon */
@font-face {
  font-family: 'icomoon';
  src:  url('../eot/icomoon7719.eot?md06yz');
  src:  url('../eot/icomoon7719.eot?md06yz#iefix') format('embedded-opentype'),
url('../ttf/icomoon7719.ttf?md06yz') format('truetype'),
url('../woff/icomoon7719.woff?md06yz') format('woff'),
url('../svg/icomoon7719-2.svg?md06yz#icomoon') format('svg');
  font-weight: normal;font-style: normal;}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important; speak: none;  font-style: normal;  font-weight: normal;  font-variant: normal;  text-transform: none;  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;}
.icon-triangle-down:before {content: "\f05b";}
.icon-triangle-left:before {content: "\f044";}
.icon-triangle-right:before {content: "\f05a";}
.icon-triangle-up:before {content: "\f0aa";}

html { -webkit-text-size-adjust: none; -webkit-font-smoothing: aliased; -webkit-overflow-scrolling: touch; font-size: 62.5%; font-family: 'Roboto Slab', serif; overflow-y: auto; overflow-x: hidden; }
body {margin: 0 auto; width:100%; padding: 0; background:#000; font-size: 2.3rem; font-weight: 400; color:#fff; line-height:160%;}

/*FONT*/
p{margin:16px 0; font-size: 100%;}
.ss-font{font-size:75%; line-height: 150%;}
.center{text-align: center;}
strong{ font-weight: 600;}
H1{font-weight: 600; font-size: 3.2rem; line-height: 120%; margin:10px 0 26px 0; padding:0;}
H2{font-weight: 600; font-size: 3.2rem; line-height: 120%; margin:10px 0 26px 0; padding:0;}
H3{font-weight: 600; font-size: 3rem; line-height: 120%; margin:33px 0 10px 0; padding:0;}
.mark:before {content:"◼︎"; font-size:80%;  padding-right: 8px;}
.pictext p{text-align: center;padding: 12px 0; margin: 0;}
.inline{display: inline;}

/*WIDTH, MARGIN, PADDING*/
section, article, header, footer, div{ width: 100%; margin:0 auto; padding:0; -moz-box-sizing: border-box;-webkit-box-sizing: border-box; box-sizing: border-box; }
header, footer, div, ul{ max-width: 1600px;}
div{padding:30px 0;}
ul{width: 100%; margin:0 auto; padding:0; list-style-type:none;}
li{margin:0 auto; -moz-box-sizing: border-box;-webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; padding:0; margin-bottom: 10px; line-height: 130%; float: left;}
li a{padding:10px 20px;}
.line-box-wh{border:#fff 1px solid;}
.line-box-bk{border:#999 1px solid;} .line-box-bk a{color: #111;}
.pad-up{padding-bottom:60px;}
.wd-100{width: 100%; max-width: 100%; }
.wd-95{width: 95%; margin-left: auto; margin-right: auto;}
.wd-90, .wd-60{width: 90%; max-width: 1400px; margin-left: auto; margin-right: auto;}
@media screen and (min-width:960px) {.wd-60{width: 60%;}}
.pat-0{padding-top: 0;}

/*mobile-2ko PC-4ko*/
li.bl4{width: 50%; padding-right:10px;} 
@media screen and (min-width:760px) {
	li.bl2{width: 50%; padding-right:10px;} /*mobile-1ko PC-2ko*/
	li.bl3{width: 33%; padding-right:10px;} /*mobile-1ko PC-3ko*/
	li.bl4{width: 25%; padding-right:10px;} /*mobile-2ko PC-4ko*/
}

/*BACKGROUND*/
.bg-wh{background: #fff; color: #111; font-weight: 500;} 
.bg-bk{background: #000; color: #fff;}
.bg-red{background: darkred; color: #fff;}
.bg-ye{background:#987D10; color: #fff;}
.bg-nby{background:#072B40; color: #fff;}
.bg-tea {color: #FFF; background: url(../png/contents-bg-3.png) repeat;}
.bg-ye-2 {background:#a29135;color: #fff; }

/*LINK, BUTTON*/
a{text-decoration:none;display:block; color: #fff;}
a:link{text-decoration:none;display:block;}
a:hover{text-decoration:underline;}
a:hover img{ opacity: 0.9;}
a:visited{text-decoration:none;}

a.in-dash{border: 1.2px dashed; display:inline-block; margin: 4px; padding: 0 12px;}
a.bt-100{padding: 12px 5px; margin: 0; text-align: center;}
div.bt-center{text-align: center;margin: 16px auto; width: auto; border-radius: 6px;}
div.bt-center a{padding: 24px 46px; width: auto; height: auto; text-align: center; display: inline; line-height: 100%;}
div.bt-100{text-align: center;margin: 16px auto 0 auto; width: 100%;padding: 18px 5px;border-radius: 6px;}
div.bt-100 a{ margin: 0; text-align: center; display: inline; line-height: 100%;}

/*IMAGE, FLOAT*/
img{ width:100%; height:auto; display:block; margin:0; padding:0;border:0px;}

.clearfix:after { /*floatの解除*/
display:block;clear:both;height:0px;visibility:hidden;content:".";}
.clearfix {min-height: 1px; }
* html .clearfix {height: 1px; height: auto; overflow: hidden;}

.clear{clear: both; padding: 0;}
.clear_r{clear:right; padding: 0;}
.left{float:none;padding: 0;margin-bottom: 16px;-moz-box-sizing: border-box;-webkit-box-sizing: border-box; box-sizing: border-box;} 
.right{float:none;padding: 0;-moz-box-sizing: border-box;-webkit-box-sizing: border-box; box-sizing: border-box;}
a.left, a.right{padding: 0 14px; }
/*picture in text*/
.in-left, .in-right{float:none;padding: 0;margin-top: 16px;margin-bottom: 16px;-moz-box-sizing: border-box;-webkit-box-sizing: border-box; box-sizing: border-box;} 

@media screen and (min-width:960px) {
	.left{float: left; width: 49%; margin-right: 1%;margin-bottom: 0; } 
	.right{float: right; width: 49%; margin-left: 1%; }
	.in-left{float: left; width: 50%; padding: 0; margin-right:40px; margin-bottom: 12px; }
	.in-right{float: right; width: 50%; padding: 0; margin-left:40px; margin-bottom: 12px; } 
	.m-pic{width: 30%;}
	br.mo{display:none;} /*mobile-kaigyo PC-no*/
}

/*HEADER*/
header{width:100%; height:148px; position:relative; z-index: 9999;}
.logo01{display: block; height:60px; width:auto; margin: 5px;}
header H1{font-size:1.2rem; margin:0 0 0 5px;}


table.menu{ width:100%; font-size:12px; margin-top:12px;}
table.menu th{width:16%;}
table.menu img{width:60px; height:auto; margin:0 auto;}
table.menu a{line-height:110%;}
table.menu a.maikoya{background:#999900; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; width:85%; height:35px; padding-top:5px;}
table.menu th.branch{width:32%;}
table.menu th.branch a{ -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; font-size: 120%; height:36px; line-height: 110%; padding-top: 5px; margin-right: 4%;}
table.menu th.tea{width:32%;}
table.menu th.tea a{ border: #fff 1px solid; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; font-size: 120%; height:35px; line-height: 35px;margin-right: 4%;}

ul.ham{position: absolute; top:6px; right:12px; padding:0; margin:0; display:table; table-layout:fixed; width:36px; height:36px;}
ul.ham li img{width: 36px; height: 36px;  padding: 0;margin: 0; }
ul.ham li{font-size:1.6rem; display: table-cell; text-align: center; position: relative; }
ul.ham li a{display: block;}
ul.dropdown-content{list-style: none;position: absolute;visibility: collapse;width:260px;left:-210px;top: 100%;margin: 0; margin-top: 18px;padding: 0;z-index: 300;}
ul.dropdown-content li{width: 260px!important;display: list-item;color: #fff; -moz-transition: .2s; -webkit-transition: .2s; -o-transition: .2s;-ms-transition: .2s; transition: .2s; line-height: 28px;margin: 0;font-size: 2.0rem!important;}
ul.dropdown-content li:nth-child(even) a{ padding: 15px; background: #696969; text-align: left;}
ul.dropdown-content li:nth-child(odd) a{ padding: 15px; background: #333333; text-align: left;padding-top: 20px; padding-bottom: 20px;}
ul.ham li:hover > a{background: #000; color: #e0dc62; }
ul.ham li:hover .dropdown-content li{visibility: visible;}
ul.dropdown-content li:first-child{ margin-top: 0;}

@media screen and (min-width: 600px) {
header{height:148px;}
.logo01{display: block; width:380px; height:auto; margin: 5px 0 0 5px;}
header H1{position:absolute; top:10px; left: 400px; margin:0; width:25%;}
}

@media screen and (min-width: 900px) {
header{height:100px;}
header H1{position:absolute; top:10px; left: 400px; width:400px;}
table.menu{width:400px; position:absolute; top:40px; left: 400px; margin:0;}
}

@media screen and (min-width: 1050px) {
header{height:110px;}
.logo01{display: block; height:110px; width:auto; }
header H1{position:absolute; top:10px; left: 550px; margin-top:0;}
table.menu{width:400px; position:absolute; top:50px; left: 550px; margin:0;}
}


/*FOOTER*/
footer { text-align:center; margin-bottom:80px;}
footer div{padding: 0;}
footer a.blog{padding:2px 5px; border:1px solid #FFF; text-align:center; display:inline;}
footer span{padding-right:12px;}
iframe.map {width: 100%; height:360px;}
p.dot-line{border-bottom:2px dotted #666;font-size: 2.0rem;line-height:110%;}


@media screen and (min-width: 960px) {
p.dot-line{display: inline-block; margin: 16px;}
footer .ss-font{text-align: left;}
}

/*footer ３列わけ*/
ul.three{width:100%; margin-bottom: 30px;} 
ul.three li{width: 100%; margin:16px 0; margin-bottom: 10px; font-size:85%; line-height:130%; padding:0;-moz-box-sizing: border-box;-webkit-box-sizing: border-box; box-sizing: border-box; border: #fff 1px solid;}
@media screen and (min-width:960px)  {
ul.three {overflow: hidden;}
ul.three li{ float: left; width: 31%; margin-right: 2%;}
}


/*booking*/
#booking-fixed a{position: fixed; bottom:0; left:0; width:100%; height:70px;  z-index:2000; background:maroon; color:#FFF; text-align:center; font-weight: 500; line-height:70px;}
@media screen and (min-width: 960px) {#booking-fixed a{left:50%;width:50%;}}

/*2block*/
#booking-fixed-2bl {position: fixed; bottom:0; right:0; width:100%; height:70px; z-index:2000;font-family: Arial, Helvetica, "sans-serif"!important;font-weight: bold;line-height:70px;}
#booking-fixed-2bl a{width:100%; height:100%;font-size:18px; text-align:center; }
#booking-fixed-2bl a.l-bl{float:left; width:50%; }
#booking-fixed-2bl a.r-bl{float:right;width:50%; }
#booking-fixed-2bl .ss{font-size:14px;} #booking-fixed-2bl em{font-size:18px;}

@media screen and (min-width: 960px) {
#booking-fixed-2bl{width:600px; height: 80px;line-height:80px;}}

/*n-blocks dropdown 20250930 */
#booking-alt {
  position: fixed;
  bottom: 0;
  right: 0;
  height: 70px;
  width: unset;
  background: white;
  z-index: 2000;
}
#booking-alt > ul {
  list-style: none;
  margin: 0;
  padding: 0;
  height: 100%;

  display: flex;
  flex-direction: row;
}
#booking-alt > ul > li {
  list-style: none;
  margin: 0;
  padding: 0;
  height: 100%;

  flex: 1;
  position: relative;

  width: 200px;
  line-height: initial;
}
#booking-alt > ul > li > a {
  position: block;
  height: 100%;
  color: white;
  text-align: center;
  padding: 10px 2px;
}
#booking-alt > ul > li > a > span {
  text-transform: uppercase;
  display: block;
  margin: 3px 0;
}
#booking-alt > ul > li > a > span > em {
  display: inline-block;
  vertical-align: middle;
  padding-bottom: 4px;
  padding-left: 4px;
}
#booking-alt > ul > li > a > span:nth-of-type(1) {
  font-size: 13px;
}
#booking-alt > ul > li > a > span:nth-of-type(2) {
  font-size: 18px;
  overflow: hidden;
  line-height: 1.3em;
  height: 1.3em;
}
#booking-alt > ul > li:nth-of-type(1) > a { background: #960D4B; }
#booking-alt > ul > li:nth-of-type(2) > a { background: #2F4F4F; }
#booking-alt > ul > li > a.blue { background: #333A68; }
#booking-alt > ul > li > a.green { background: #444A29; }
#booking-alt > ul > li > a.red { background: #692016; }
#booking-alt > ul > li > ul.dropdown-content {
  position: absolute;
  bottom: 70px;
  right: 0;
  left: unset;
  top: unset;
  width: 200px;
}
#booking-alt > ul > li > ul.dropdown-content > li {
  display: block;
  width: unset !important;
}
#booking-alt > ul > li > ul.dropdown-content > li > a {
  color: white;
  text-decoration: none;
  padding: 8px 16px;
  line-height: 2.5rem;
}
#booking-alt > ul > li > ul.dropdown-content > li > a:hover {
  background: #000;
  color: #e0dc62;
  text-decoration: underline;
}
#booking-alt > ul > li.active > ul.dropdown-content,
#booking-alt > ul > li:hover > ul.dropdown-content {
  visibility: visible;
  height: auto;
}
@media screen and (max-width: 960px) {
  #booking-alt {
    width: 100%;
    left: 0;
  }

  #booking-alt > ul > li > ul.dropdown-content {
    width: 100%;
  }
}

/*basic ticket infomation*/
ul.basic-list {display: flex; flex-direction: row;flex-wrap: wrap;align-content: space-between;}
ul.basic-list li{flex-basis:50%;padding-right:10px;}
@media screen and (min-width:960px) {ul.basic-list li{flex-basis:25%;padding-right:10px;}}
.ticket-info{background:#072B40; padding:20px 30px; border-radius:6px;} 
.ticket-info h2{margin: 0;}

/*link to each page on bottom*/
.link-samurai{position: relative;}
.sq-text{padding:20px; padding-top: 6px; background: rgba(0,0,0,1); width: 100%; height: auto; margin: 0; color: #fff; line-height: 150%;}
.sq-text .learn-more{padding: 6px 16px;} .sq-text p{color: #fff;}
@media screen and (min-width: 960px) {
.sq-text{position: absolute; top:40px; left: 30px; height: 370px; width: 380px;background: rgba(0,0,0,0.7); overflow: hidden;padding:0px 30px; }
.sq-text p{font-size: 2rem;line-height: 140%;}
.sq-text .learn-more{position: absolute; left:30px; bottom:20px; width: 260px;}
.sq-text.ninja{top:45%; left: 15px; height: 45%; width : -webkit-calc(100% - 30px) ; width : calc(100% - 30px) ;}
.sq-text.ninja .learn-more{left:70%; top:20px; height:30px; width: 25%; line-height:30px;}
.sq-text.museum{top:-webkit-calc(50% - 185px); top:calc(50% - 185px); left:25%; height: 370px; width: 400px;}
}
@media screen and (min-width: 1100px) {.sq-text{top:10%; } .sq-text.ninja{top:50%; height: 40%; }}
@media screen and (min-width: 1350px) {.sq-text.ninja{top:60%; height: 30%; }}

/*Ninja Facts*/
.bg-ninja{ background: #000;}
.facts-image{display: block; padding: 0;}
.facts-cont{ width:90%; margin:0 auto; padding: 0;}
@media screen and (min-width: 960px) {
.bg-ninja{ background: #000 url("../jpg/ninja-facts-pc.jpg") no-repeat left top/50%;}
.facts-image{display: none;}
.facts-cont{ width:45%; margin-top:20px; margin-left:50%; padding: 10px 0;}
}

/*About Page*/
.map-wrapper{text-align:center;font-size:2.3rem; }
.map-wrapper a{display: inline-block; }
.map-txt span{padding-right:12px;}
.map iframe {width: 100%; height:400px;}
.map-txt p.dot-line{border-bottom:2px dotted #fff;}
@media screen and (min-width: 960px) {
.map-txt p.dot-line{display: inline-block; margin:0 16px;}
}