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

body{
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

h2{
	font-size:2.7em;
}


.box_harf{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
  
	box-sizing:border-box;
  
	width:100%;
	height:auto;
	min-height:100vh;  
  
	background-size:cover;
	background-position:center top;
}

/*menu page*/
.menu_page h3{
	margin-bottom:20px;
}

.menu_page section{
	max-width:400px;
}

#system, #accordion{
	margin:0 auto 60px;
	padding:0;
}

.menu_page ul,.menu_page li{
	margin:0;
	padding:0;
}


.menu_page h4{
	margin:0 0 10px;
	padding:0;
}

#accordion h4{
	margin:0 0 15px;
	padding-bottom:5px;
	border-bottom:solid 1px #ce1125;
}
#tgl2{
	cursor: pointer;
}

#accordion span{
	display:inline-block;
	font-weight:normal;
	color:#666;
}

#system ul{
	margin:5px auto;
}

#system li{
	font-size:1.1em;
	font-weight:bold;
	text-align:left;
	margin:0 auto 5px;
	padding-left: 17px;
	width:15em;
}

#accordion ul{
	margin:5px auto 80px;
}
#accordion ul#whisky{
	margin-bottom:30px;
}

.caption{
	text-align:left;
	font-size:0.9em;
	margin-bottom:80px;
	padding:0 10px;
}
	

#accordion li{
	/*font-family:"Consolas", "Courier New", "ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospace;*/
	text-align:left;
	font-size:0.95em;
	margin:0 auto;
	padding:10px 10px;
	width:22em;
	border-bottom:dotted 1px #ccc;
}

#accordion li li{
	color:#222;
	font-weight:normal;
}

#accordion .cocktail_base{
	color:#900;
	font-size:1em;
	font-weight:bold;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	text-align:center;
	margin:0 auto 15px;
	padding:10px 10px;
	border-bottom:dotted 1px #ce1125;
	cursor:pointer;
}

#accordion .tgl li{
	cursor:text;
}

#accordion .tgl{
	display:none;
	margin:5px auto 50px;
}

#accordion .tgl li{
	cursor:pointer;
}

.al_name {
	text-align: left;
	width: 82%;
	white-space: nowrap;
}

.al_name.-akkeshi {
	width: 78%;
	white-space:normal;
}
.al_plice {
  text-align: right;
  width: 18%;
}
.al_plice.-akkeshi {
	width: 22%;
}


/*information page*/
.information section{
	width:100%;
}

.infolist{
	text-align:left;
}

.infolist ul{
	margin:20px 0;
	padding:0;
}

.infolist li{
	margin:0;
	padding:10px 25px 10px 10px;
	border-bottom:solid 1px #ccc;
}

.infolist li:first-child{
	border-top:solid 1px #ccc;
}

.infolist li a{
	color:#222;
	background-color:#666;
}

.infolist li a:hover{
	background-color:#ccc;

}

.infolist li{
	margin:0;
	padding:10px 5px;
	border-bottom:solid 1px #ccc;
	background-image:url('http://reddoor.xyz/wp/wp-content/themes/reddoor/images/arrow-right.svg');
	background-repeat:no-repeat;
	background-position:center right;
	background-size:5% auto;
}

.infolist li h3{
	font-size:1em;
	margin:0;
}
.infolist li p{
	font-size:0.9em;
	margin:0 0 5px;
}

a.page-numbers,span.page-numbers{
	color:#ca1125;
	width:30px;
	height:30px;
	font-size:1em;
	text-align:center;
	margin-right:2px;
	padding:5px;
	border:solid 1px #ccc;
}

a.next.page-numbers,a.prev.page-numbers{
	width:4em;
	float:none;
}

/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 769px) {
/*information page*/
.information section{
	width:500px;
}

.infolist li h3{
	font-size:1.2em;
}

}

@media screen and (max-width: 375px){
/*menu page*/
.menu_page section{
	max-width:100%;
}

#accordion li{
	width:99%;
	font-size:0.8em;
}

#accordion .cocktail_base{
	font-size:0.95em;
}

.caption{
	font-size:0.8em;
}



}