@charset "utf-8";
/* CSS Document */
body {
	font-family: 'azuki';
	line-height: 1.5;
	font-size: 12px;
color: #fff;
-webkit-animation: fadeIn 1s;
	        animation: fadeIn 1s;
	
}
@-webkit-keyframes fadeIn {
	0% {
		opacity: 0;
	}
	
	
	100% {
		opacity: 1;
	}
}
@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	
	100% {
		opacity: 1;
	}
}
@font-face {
	font-family: 'TanukiMagic';
	src: url("../TanukiMagic.ttf");
	
}
@font-face {
	font-family: "MkPOP";
	src: url("../851MkPOP.ttf");
}
@font-face {
	font-family: "azuki";
	src: url("../azuki.ttf");
}
img {
	max-width: 100%;
	height: auto;
	 -o-object-fit: cover;
	    object-fit: cover;
	vertical-align: bottom;
	
}
.bx-pager {
	display: none;
}
#wrapper {
	width: 100%;
}
.grade {
	background: transparent -o-linear-gradient(266deg, #FFFFFF 0%, #FF8856 25%, #FFDBC9 50%, #FF8856 75%,#FFDBC9 100%) 0% 0% no-repeat padding-box;
	background: transparent linear-gradient(184deg, #FFFFFF 0%, #FF8856 25%, #FFDBC9 50%, #FF8856 75%,#FFDBC9 100%) 0% 0% no-repeat padding-box;
}
.chach{
  position   : absolute;
  display    : inline-block;
	font-size: 23px;
	font-weight: bold;
  color      : #fff;
  top        : 50%;                               /* 中央寄せ */
  left       : 50%;
  -webkit-transform  : translate(-50%,-50%);
      -ms-transform  : translate(-50%,-50%);
          transform  : translate(-50%,-50%);
	-ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
	        writing-mode: vertical-rl;
	 -webkit-text-orientation: upright;
  text-orientation: upright;
	height: 90%;
	-webkit-animation: fade 2s;
	        animation: fade 2s;
}
@-webkit-keyframes fade {
	0% {
		opacity: 0;
	}
	
	80% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@keyframes fade {
	0% {
		opacity: 0;
	}
	80% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
#top_main {
	margin-bottom: 16.94%;
}
#top_main  {
	width: 100%;
	height: 475px;
    border-bottom: 3px solid #42210B;
}
#concept {
	position: relative;
	/*margin-bottom: 28.54%;*/
	margin-bottom: 16.94%;
}
#concept img {
	width: 100%;
	height: auto;
	
}

#concept h2 {
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	line-height: 40px;
	font-family: "TanukiMagic";
}
#concept_text {
	/*width: calc(100% - 14px);*/
	height: 99%;
	padding: 0 2px;
	background:  rgba(0,102,51,0.30);
	position: absolute;
	top: 0;
	line-height: 25px;
	border-top: 3px solid #42210B;
	border-bottom: 3px solid #42210B;
}
#concept_text p {
	font-family: "TanukiMagic";
	font-size: 16px;
}
.menu img,.menu_2 img {
		width: 100%;
	height: auto;
	border-bottom: 3px solid #42210B;
	} 
.menu_text {
	
	/*width: 361px;*/
	/*width: 96.27%;*/
	
	height: 300px;
	padding: 0 0.53%;
	background:  rgba(0,102,51,0.55);
	font-family: "TanukiMagic";
	
}
section h1 {
	font-size: 20px;
}
section p {
	font-size: 16px;
}
section {

	padding-bottom:80px;
}
.news_ticker2 {
	width: 100%;
	overflow:hidden;
	white-space:nowrap;
	border-top: 3px solid #944c38;
	border-bottom: 3px solid #944c38;

}
@-webkit-keyframes hscroll2 {
	0% { -webkit-transform:translateX(4px); transform:translateX(4px); }
	100% { -webkit-transform:translateX(-100%); transform:translateX(-100%); }
}
@keyframes hscroll2 {
	0% { -webkit-transform:translateX(4px); transform:translateX(4px); }
	100% { -webkit-transform:translateX(-100%); transform:translateX(-100%); }
}
.news_ticker2 ul {
	display:inline-block;
	-webkit-filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.6));
	        filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.6));
	padding:0;
	-webkit-animation:hscroll2 8s linear infinite;
	        animation:hscroll2 8s linear infinite;
}
.news_ticker2 li {
	display:inline-block;
	padding: 20px 20px 20px 0;
	font-size: 30px;
	font-weight: bold;
	font-family: "MkPOP";
}
.infiniteslide ul{
	margin-bottom: 30px;
	overflow: hidden;
	-webkit-filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.6));
	        filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.6));
}
.infiniteslide ul li {
	font-family: "MkPOP";
	font-size: 30px;
	padding: 20px 20px 20px 0;
	display: block;
	font-weight: bold;
	border-top: 3px solid #944c38;
	border-bottom: 3px solid #944c38;
	float: left;
}
.onimg2 p,.onimg p{
	display: none;
}
footer {
	background: transparent -webkit-gradient( linear, left top, left bottom, from(#FFDBC9), color-stop(85%), to(#FF570D)) 0% 0% no-repeat padding-box;
	background: transparent -o-linear-gradient( #FFDBC9 0%, 85%, #FF570D 100%) 0% 0% no-repeat padding-box;
	background: transparent linear-gradient( #FFDBC9 0%, 85%, #FF570D 100%) 0% 0% no-repeat padding-box;
	width: 100%;
}
footer h3 {
	font-size: 20px;
	font-weight: bold;
	line-height: 30px;
	text-align: center;
}
footer h2 {
	font-weight: bold;
	font-size: 16px;
}
.access {
	margin-bottom: 50px;
}
.map{
	margin-bottom: 15px;
}
footer h3 {
	font-size: 30px;
	padding-top: 50px;
	margin-bottom: 15px;
}
footer .map_text {
	padding: 0 0.5em;
	line-height: 30px;
}
footer small {
	font-size: 8px;
	display: block;
	text-align: center;
	padding-bottom: 50px;
	color: #000;
}



@media only screen and (max-width: 599px) { 
.pc { display:none  !important; } 
.tab { display: none !important; } 
.sp { display: block !important; } 
}
@media only screen and (min-width: 600px) { 
.pc { display: none !important; } 
.tab { display: block !important; } 
.sp { display:none  !important; } 
}

@media only screen and (min-width: 960px) { 
.pc { display: block !important; } 
.tab { display: none !important; } 
.sp { display: none !important; } 
}




@media screen and (min-width:600px){
	#wrapper {
		width: 100%;
	}
	header {
		width: 100%;
		
	}	
	header h1 {
		width:  58.59%;
		position: relative;
		z-index: 999;
		
	}
	.chach{
		height: auto;
		font-size: 40px;
		top: 50%;
		-webkit-writing-mode:horizontal-tb;
	-ms-writing-mode:lr-tb;
	writing-mode:horizontal-tb;
	}
	#top_main {
		/*margin-bottom: 11.82%;*/
		height: 868px;
		border-top: 5px solid #42210B;
		border-bottom: 5px solid #42210B;
		position: absolute;
		top: 50px;
	}
	#concept {
		margin-top: 948px;
	}
	#concept img {
		width: 100%;
		border-top: 5px solid #42210B;
		border-bottom: 5px solid #42210B;
	}
	#concept_text {
		height: 98.92%;
		font-size: 16px;
		
	}
	#concept_text h2{
		/*margin-top: 70px;*/
		margin-top: 14.58%;
		font-size: 25px;
	}
	#concept_text p {
		font-size: 20px;
		line-height: 40px;
	}
	.news_ticker2 {
		margin-bottom: 30px;
	}
	.menu {
		
		position: relative;
	}
	.menu img,.menu_2 img {
		width: 68.36%;
		margin-bottom: 10.73%;
		border: 5px solid #42210B;
	} 
	.menu_text {
		padding: 0;
		width: 47.01%;
		height: 73.1%;
		z-index:999;
		border-top: 5px solid #001100;
		border-bottom: 5px solid #001100;
		-webkit-box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.3);
		        box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.3);
	}
	.menu img {
		margin-left: 1.56%;
		/*margin-bottom: 65px;*/
		
		
	}
	.menu .menu_text {
		position: absolute;
		/*top: 60px;*/
		top: 18.29%;
		left: 49.35%;
		background:  rgba(0,102,51,0.60);
		padding: 0.5em;
	}
	.menu_2 {
		position: relative;
	}
	.menu_2 img {
		position: relative;
		/*left: 228px;*/
	left:  29.69%;
		top: 0;
	}
	.menu_2 .menu_text {
		position: absolute;
		top: 60px;
		left: 1.56%;
		background:  rgba(0,102,51,0.60);
		padding: 0.5em;
	}
	footer {
		width: 100%;
	}
	footer h3 {
		font-size: 20px;
		font-weight: bold;
		text-align: center;
		line-height: 40px;
		margin-bottom:1.88%;
	}
	.access {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-pack: distribute;
		    justify-content: space-around;
		margin-bottom: 18.81%;
	}
	footer .map {
		width: 49.48%;
	}
	footer .map_text {
		width: 44.53%;
	}
}





@media screen and (min-width:960px){
	header{
		width: 100%;
		
	}
	header h1 {
		margin: 0;
		
	}
	header h1 img{
		top: 30px;
		width: 62%;
		
		-webkit-box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.3);
		
		        box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.3);
       left: 15.63%;
		position: relative;
		z-index: 999;
	}
	.chach{
		font-size: 50px;
	}
	#top_main {
		position: absolute;
  top: 80px;
  left: 0;
  right: 0;
  margin: auto;
		width: 72.92%;
		/*height: 85.13%;*/
		height: 800px;
		border: 20px double #42210B;
		-webkit-box-shadow: 3px 3px 15px 15px rgba(0, 0, 0, 0.3);
		        box-shadow: 3px 3px 15px 15px rgba(0, 0, 0, 0.3);
		
}
	
	#concept{
		margin-top: 1000px;
		/*margin-top: 51.33%;*/
		/*margin-bottom: 13.33%;*/
		margin-bottom: 300px;
	}
	/*#concept img {
		width: 62.5%;
		max-width: 1200px;
		position: relative;
		left: 6.25%;
		border: 10px solid #42210B;
	}*/
	.concept_img {
		 
		width: 62.5%;
		max-width: 1200px;
		position: relative;
		left: 6.25%;
		border: 10px solid #42210B;
	
	}
.concept_img img{
  display:block;
  width:100%;
}
.concept_img:before{
  content:"";
  display:block;
  width:100%;
  height:100%;
  position:absolute;
  z-index:2;
  background:#000;/*好みの色に変えてください。*/
  opacity:0;
  -webkit-transition:0.3s;
  -o-transition:0.3s;
  transition:0.3s;
}
.concept_img:after{
  content:"CONCEPT";/*好みの文章に変更してください。*/
  display:block;
  color:#fff;
	width: 50%;
	margin: auto;
	font-size: 70px;
  position:absolute;
  top:53%;
  left:50%;
-webkit-transform  : translate(-50%,-50%);
    -ms-transform  : translate(-50%,-50%);
        transform  : translate(-50%,-50%);
  margin-top:-1em;
  margin-left:-90px;
  opacity:0;
  z-index:3;
  -webkit-transition:0.3s;
  -o-transition:0.3s;
  transition:0.3s;
  font-weight:bold;
  letter-spacing:0.2em;
}
.concept_img:hover:before{
  opacity:0.5;
}
.concept_img:hover:after{
  opacity:1;
  margin-top:-0.5em;
}
	#concept h2 {
		margin: 0 0 20px;
		font-size: 35px;
	}
	#concept_text p {
		font-size: 25px;
	}
	#concept_text {
		max-width: 805px;
		width: 805px;
		width: 41.93%;
		height:auto;
		padding: 25px 10px;
		max-height: 420px;
		left: 51.82%;
	top: 180px;
	top: 24%;
		background:  rgba(0,102,51,0.60);
		border-top: 7px solid #001100;
		border-bottom: 7px solid #001100;
		-webkit-box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.3);
		        box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.3);
		overflow: hidden;
	z-index: 999;
	}
	#concept_text:hover {
		color: #00CC00;
	}
	#concept_text:before {
		position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	background: #001100;
	-webkit-transition: -webkit-transform .3s;
	transition: -webkit-transform .3s;
	-o-transition: transform .3s;
	transition: transform .3s;
	transition: transform .3s, -webkit-transform .3s;
	content: "";
	-webkit-transform-origin: left top;
	    -ms-transform-origin: left top;
	        transform-origin: left top;
	-webkit-transform:   scale(1, 0);
	    -ms-transform:   scale(1, 0);
	        transform:   scale(1, 0);
	}
	#concept_text::after {
		position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -2;
	background:  rgba(0,102,51,0.60);
	content: "";
	}
	#concept_text:hover:before{
		-webkit-transform-origin: right top;
		    -ms-transform-origin: right top;
		        transform-origin: right top;
	-webkit-transform: scale(1, 1);
	    -ms-transform: scale(1, 1);
	        transform: scale(1, 1);
	content: "";
		
	}
	section {
		border-bottom: 3px solid #944c38;
		padding-bottom: 50px;
		position: relative;
	-webkit-box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.3);
	        box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.3);
	}
	section:first-child {
		border-top: 3px solid #944c38;
		border-bottom: 3px solid #944c38;
		-webkit-box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.3);
		        box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.3);
	}

	section h1 {
		font-size: 30px;
	}
	section p {
		font-size: 20px;
	}
	

.infiniteslide2 ul {
	position:absolute;
	left: 88.54%;
	white-space:nowrap;
	border-right: 5px solid #832;
	border-left: 5px solid #832;
    overflow:hidden;
	height: 100%;
	width: 7.81%;
	/*filter: drop-shadow(-10px 10px 10px rgba(0,0,0,0.6));*/
}

.infiniteslide2 li {
	-ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
	        writing-mode: vertical-rl;
	padding: 0 20px 30px 20px;
	text-align: center;
	margin: auto;
	font-size: 50px;
	font-weight: bold;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    color:#fff;              /*文字の色*/
    -webkit-animation:hscroll3 2s linear infinite;
            animation:hscroll3 2s linear infinite;
	font-family: "MkPOP";
}
	.infiniteslide ul li {
	padding-left: 30px;
	font-size: 30px;
		border-top: 5px solid #944c38;
	border-bottom: 5px solid #944c38;
}

.menu_text {
	width: 26.04%;
	height: 68%;
	border-top: 7px solid #001100;
		border-bottom: 7px solid #001100;
	}
	.menu img {
		margin-left: 1.56%;
		/*margin-bottom: 140px;*/
		margin-bottom: 7.5%;
		/*margin-top: 30px;*/
		margin-top: 1.6%;
		border: 10px solid #42210B;
	}
	.menu .menu_text {
		/*top: 240px;*/
        left: 58.33%;
		top: 21.92%;
	}
	.menu .menu_text:hover {
		color: #00CC00;
	}
	.menu .menu_text:before {
		position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	background: #001100;
	-webkit-transition: -webkit-transform .3s;
	transition: -webkit-transform .3s;
	-o-transition: transform .3s;
	transition: transform .3s;
	transition: transform .3s, -webkit-transform .3s;
	content: "";
	-webkit-transform-origin: left bottom;
	    -ms-transform-origin: left bottom;
	        transform-origin: left bottom;
	-webkit-transform:   scale(1, 0);
	    -ms-transform:   scale(1, 0);
	        transform:   scale(1, 0);
	}
	.menu .menu_text::after {
		position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -2;
	background:  rgba(0,102,51,0.60);
	content: "";
	}
	.menu .menu_text:hover:before{
		-webkit-transform-origin: right bottom;
		    -ms-transform-origin: right bottom;
		        transform-origin: right bottom;
	-webkit-transform: scale(1, 1);
	    -ms-transform: scale(1, 1);
	        transform: scale(1, 1);
	content: "";
		
	}
	.menu_2 img {
   margin-top: 1.6%;
    left: 35.73%;
	margin-bottom: 7.5%;
		border: 10px solid #42210B;
	}
	.menu_2 .menu_text {
		top: 21.92%;
    left: 15.63%;
	}
	.menu_2 .menu_text:hover {
		color: #00CC00;
	}
	.menu_2 .menu_text:before {
		position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	background: #001100;
	-webkit-transition: -webkit-transform .3s;
	transition: -webkit-transform .3s;
	-o-transition: transform .3s;
	transition: transform .3s;
	transition: transform .3s, -webkit-transform .3s;
	content: "";
	-webkit-transform-origin: left top;
	    -ms-transform-origin: left top;
	        transform-origin: left top;
	-webkit-transform:   scale(1, 0);
	    -ms-transform:   scale(1, 0);
	        transform:   scale(1, 0);
	}
	.menu_2 .menu_text::after {
		position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -2;
	background:  rgba(0,102,51,0.60);
	content: "";
	}
	.menu_2 .menu_text:hover:before{
		-webkit-transform-origin: right top;
		    -ms-transform-origin: right top;
		        transform-origin: right top;
	-webkit-transform: scale(1, 1);
	    -ms-transform: scale(1, 1);
	        transform: scale(1, 1);
	content: "";
		
	}
	.menu_text h1 {
		text-align: center;
	}
	
	
.infiniteslide3 ul {
position:absolute;
	left: 3.65%;
	white-space:nowrap;
	border-right: 5px solid #832;
	border-left: 5px solid #832;
    overflow:hidden;
	height: 100%;
	width: 7.81%;
	/*filter: drop-shadow(-10px -10px 10px rgba(0,0,0,0.6));*/
	transform: rotate( 180deg );
   -moz-transform:    rotate( 180deg );  /* Firefox用 */
   -webkit-transform: rotate( 180deg );  /* Chrome,Safari,新しいOpera用 */
   -o-transform:      rotate( 180deg );  /* 古いOpera用 */
   -ms-transform:     rotate( 180deg );  /* IE9用 */
}
	
.infiniteslide3  ul li {
	-ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
	        writing-mode: vertical-rl;
	padding: 0 20px 30px 20px;
	text-align: center;
	font-size: 50px;
	font-weight: bold;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    color:#fff;              
	margin: auto;
	-webkit-animation:hscroll3 2s linear infinite;
	        animation:hscroll3 2s linear infinite;
	font-family: "MkPOP";
	}

	
	.infiniteslide ul li {
	line-height: 100px;
	font-size: 50px;
}
	.bxslider img{
		width: 62.5%;
	}	
.onimg p {
  color: #fff;
  width: 62.5%;
	height: 79.7%;
top: 4.2%;
	position: absolute;
  margin: 0;
  left:calc(1.56% + 10px);
  background: rgba(0,0,0,0.5);
  opacity: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
	z-index: 999;
	overflow: hidden;
	font-size: 70px;
	font-weight: bold;
}
.onimg:hover p {
  opacity: 1;   
}
	
.onimg2 p {
  color: #fff;
  width: 62.5%;
	height: 79.7%;
top: 4.2%;
	position: absolute;
  margin: 0;
  right:calc(1.56% - 6px);
  background: rgba(0,0,0,0.5);
  opacity: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
	z-index: 999;
	overflow: hidden;
	font-size: 70px;
	font-weight: bold;
}
.onimg2:hover p {
  opacity: 1;   
}
	
	
	
	
	
	
	footer h3{
		font-size: 30px;
		padding-top: 50px;
	}footer h2 {
		font-size: 25px;
	}
	footer .access {
		width: 52.08%;
		height: 500px;
		margin: 0 auto;
		border: 1px solid #fff;
		background-color: rgba(255,252,252,0.36);
		border-radius: 25px;
		margin-bottom: 150px;
	}
	.map img{
		width: 80%;
		
	}
	.map {
		margin: auto;
text-align: center;
	}
	.map_text {
		margin: auto;
		font-size: 16px;
		color: #333;
	}
	footer small {
		font-size: 12px;
	}
	
}
@-webkit-keyframes hscroll3 {
	0% { -webkit-transform:translateY(4px); transform:translateY(4px); }
	100% { -webkit-transform:translateY(-100%); transform:translateY(-100%); }
}
@keyframes hscroll3 {
	0% { -webkit-transform:translateY(4px); transform:translateY(4px); }
	100% { -webkit-transform:translateY(-100%); transform:translateY(-100%); }
}