* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
	font-family: 'Noto Sans JP', sans-serif;
}

@font-face {
    font-family: 'Kaushan Script';
    font-style: normal;
    font-weight: 400;
    src: url(https://themes.googleusercontent.com/static/fonts/kaushanscript/v1/qx1LSqts-NtiKcLw4N03IFhlQWQpSCpzb2Peu3I-Q34.woff) format('woff');
  }
  .myfont{
    font-family:'Kaushan Script';
  }

/* --header--- */

header {
	background-image: url(img/background.png);
	background-size: cover;
	width: 100%;
	height: 100%;
	text-align: center;
}

header .head {
	position: absolute;
	right: 0;
	left: 0;
	margin: auto;
	width: 95%;
	z-index: 2;
}

header .head img {
    width: 100%;
}




header .logo {
    position: absolute;
    right: 0;
    left: 0;
    top: 10px;
    margin: auto;
    width: 100%;
    z-index: 3;
}

header .logo img {
    width: 17%;
}

header .top {
    width: 100%;
    position: relative;
}

header .top img {
    width: 90%;
	width: 100%;
    height: 100%;
    margin: 0 auto;
}

header .top h2 {
	font-size: 83px;
	font-size: 8vw;
	font-weight: normal;
	color: #fff;
	position: absolute;
	top: 60%;
	right: 10%;
	transform: rotate(-10deg);
	font-family: 'Lobster', cursive;
}

header .top .steam-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    z-index: 5;
  }

  @keyframes steam-move-01 {
    0% {
      filter: blur(15px);
      transform: scale(0.8, 0.8) rotateY(0deg);
      opacity: 0;
      bottom: -1300px;
    }
    6% {
      opacity: 0.20;
    }
    33% {
      transform: scale(0.9, 1.1) rotateY(30deg);
      opacity: 0.5;
    }
    66% {
      transform: scaleY(1, 0.8) rotateY(4deg);
    }
    100% {
      filter: blur(18px);
      transform: scaleY(1.5, 1.3) rotateY(50deg);
      opacity: 0;
      bottom: 0;
    }
  }

  .steam-01 {
    left: calc(50% - 350px);
    -webkit-animation: steam-move-01 20s infinite linear;
    animation: steam-move-01 20s infinite linear;
  }

  @keyframes steam-move-02 {
    0% {
      filter: blur(12px);
      transform: scale(0.8, 0.8) rotateY(0deg);
      opacity: 0;
      bottom: -1300px;
    }
    6% {
      opacity: 0.20;
    }
    33% {
      transform: scale(0.9, 1.1) rotateY(30deg);
      opacity: 0.5;
    }
    66% {
      transform: scaleY(1, 0.8) rotateY(4deg);
    }
    100% {
      filter: blur(18px);
      transform: scaleY(1.5, 1.3) rotateY(50deg);
      opacity: 0;
      bottom: 0;
    }
  }

  .steam-02 {
    left: calc(50% - 350px);
    -webkit-animation: steam-move-02 20s infinite linear;
    animation: steam-move-02 18s infinite linear;
  }


/* --header--- */


/* --main--- */

main {
	background: #D8758A;
	width: 100%;
	border-top: solid 12px #DB5372;
}

main .monochrome img{
    width: 100%;
}

main .monochrome-top img{
    margin:0;
}

main .arrow {
    text-align: center;
    position: absolute;
    right: 0;
    left: 0;
    margin: auto;
    margin-top: -30px;
}

.mono_koushi {
	width: auto;
	height: 70px;
	background: url(./img/mono_koushi.png) repeat-x center top;
}


/* --main--- */


/* --menu--- */

.menu {
	width: 90%;
	max-width: 1100px;
	margin: 50px auto 100px;
}

.menu-top {
	text-align: center;
	margin:0 auto 60px;
	width: 100%;
}

.menu_title {
	color: #fff;
	font-size: 40px;
	font-family: 'Lobster', cursive;
	letter-spacing: 0.05em;
	position: relative;
/*	display: inline-block;*/
}
.menu_title:before,
.menu_title:after {
	content: '';
	position: absolute;
	bottom: -15px;
	display: inline-block;
	width: calc(50% - 2em);
	height: 5px;
	top: 50%;
	background-color: #33AFB9;
	border-radius: 2.5px;
}
.menu_title:before {
	left: 0;
}
.menu_title:after {
	right: 0;
}

.menu-container {
/*
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	width: 90%;
	margin: 0 auto;*/
	display: flex;
	justify-content: space-between;
}

.menu-box {
	text-align: center;
	width: 30%;
	margin: 0;
}

.menu_img {
	text-align: center;
}
.menu_img img {
	max-width: 100%;
	border-radius: 20px;
}

.menu-box .price {
	margin: 10px 0;
	font-size: 30px;
	font-weight: 600;
	text-align: center;
	font-family: 'Lobster', cursive;
	letter-spacing: 0.05em;
}

.menu-box .txt p {
	line-height: 1.5rem;
	font-size: 14px;
	text-align: left;
	display: inline-block;
}

/* --menu--- */



/* -- gallery --- */
.gallery {
	width: 90%;
	max-width: 1100px;
	margin: 50px auto 100px;
}

.gallery_title {
	margin-bottom: 40px;
	color: #fff;
	font-size: 40px;
	font-family: 'Lobster', cursive;
	letter-spacing: 0.05em;
	position: relative;
/*	display: inline-block;*/
	text-align: center;
}
.gallery_title:before,
.gallery_title:after {
	content: '';
	position: absolute;
	bottom: -15px;
	display: inline-block;
	width: calc(50% - 2.6em);
	height: 5px;
	top: 50%;
	background-color: #33AFB9;
	border-radius: 2.5px;
}
.gallery_title:before {
	left: 0;
}
.gallery_title:after {
	right: 0;
}

.gallery_slide img,
.gallery_nav img {
	max-width: 100%;
}
.gallery_slide {
	margin: 0 auto 20px;
	max-width: 800px;
	background: #fff;
	padding: 8px;
	box-shadow: 0 0 4px rgba(0,0,0,0.4);
}
.gallery_nav {
	margin: 0 auto;
	max-width: 800px;
}
.slide_img img {
	margin: 0 auto;
}
.slide_img {
	
}
.nav_img {
	margin: 0 5px;
	background: #fff;
	padding: 5px;
	box-shadow: 0 0 4px rgba(0,0,0,0.4);
}
/* -- gallery --- */



/* --about--- */

.about-container {
	width: 90%;
	max-width: 1100px;
	margin: 30px auto 100px;
}

.about-top {
}

.about-top h2 span {
	display: block;
}
.title_jp {
	font-size: 15px;
}
.title_en {
	display: block;
	color: #fff;
	font-family: 'Lobster', cursive;
	font-size: 40px;
	letter-spacing: 0.05em;
	position: relative;
}
.title_en:before {
	content: '';
	position: absolute;
	bottom: -15px;
	display: inline-block;
	height: 5px;
	top: 50%;
	right: 0;
	background-color: #33AFB9;
	border-radius: 2.5px;
}
.store_manager .title_en:before {
	width: calc(100% - 7em);
}
.what_store .title_en:before {
	width: calc(100% - 11em);
}
/*
.about-top p {
    font-size: 15px;
    font-weight: bolder;
}

.about-top .about-border {
    margin-top: 30px;
    text-align: right;
}

.about-top .about-border img {
    width: 95%;
}*/

.about-box {
	display: flex;
	justify-content: space-between;
	margin: 50px 0;
}

.about-box .about-img {
	width: 40%;
	margin-right: 5%;
	flex-shrink: 0;
}
.about-box img {
	max-width: 100%;
}

.about-box .txt p {
	margin: 0;
	text-align: left;
	line-height: 2.5;
	font-size: 18px;
	font-weight: 400;
}

/* --about--- */


/* --contact--- */

.contact {
	padding: 60px 0;
	background: #DB5372;
	text-align: center;
	color: #fff;
}

.contact_container {
	width: 90%;
	max-width: 1100px;
	margin: 0 auto;
}

.contact_title {
	display: flex;
	align-items: center;
	margin:0 0 60px;
	color: #33AFB9;
	font-size: 40px;
	font-family: 'Lobster', cursive;
}
.contact_title_en {
	flex-shrink: 0;
	flex-grow: 0;
	margin: 0 1em;
	font-family: 'Lobster', cursive;
}

/*
.contact_title span {
	position: absolute;
	left: 0;
	top: 50%;
	width: 50px;
	height:3px;
	background: #fff;
	border-radius: 1.5px;
}*/
.contact_title span.border_left,
.contact_title span.border_right {
	display: block;
	flex-shrink: 1;
	flex-grow: 1;
	width: calc(50% - 5em);
	height:3px;
	background: #fff;
	border-radius: 1.5px;
	position: relative;
}
.contact_title span.border_left::before,
.contact_title span.border_right::before,
.contact_title span.border_left::after,
.contact_title span.border_right::after {
	content: '';
	display: inline-block;
	position: absolute;
	left: 0;
	
	width: 100%;
	height:3px;
	background: #fff;
	border-radius: 1.5px;
}

.contact_title span.border_left::before,
.contact_title span.border_right::before {
	top: -15px;
}
.contact_title span.border_left::after,
.contact_title span.border_right::after {
	bottom: -15px;
}


.contact .add,
.contact .info {
	font-size: 20px;
	margin-bottom: 1em;
	line-height: 2;
}


.contact .tel {
	font-size: 50px;
	font-weight: 600;
	letter-spacing: 0.05em;
}
.contact .tel a {
	text-decoration: none;
	color: #fff;
}

.contact .tel i {
	padding-right:10px;
	font-size: 45px;
}

.eigyo_time {
	margin: 30px 0 0;
}
.eigyo_time dl {
	margin-bottom: 1em;
	line-height: 2;
}
.eigyo_time dt {
	font-weight: 600;
	font-size: 1.2rem;
}
.contact .map iframe {
	width: 100%;
	margin-top: 50px;
}

#map {
	width: 100%;
	height: 550px;
}
.map_area {
	position: relative;
}
.map_btn {
	position: absolute;
	bottom: 20px;
	left: 50px;
	right: 50px;
	text-align: center;
}
.map_btn a {
	display: inline-block;
	padding: 0 2em;
	color: #fff;
	background: #009BA7;
	line-height: 2.6em;
	border-radius: 1.3em;
	text-decoration: none;
	font-family: 'Lobster', cursive;
	font-weight: 600;
	font-size: 1.4rem;
	box-shadow: 0 0 5px rgba(0,0,0,0.2);
}




/* parking */
.parking_info {
	margin: 80px 0 0;
}
.parking_title {
	margin-bottom: 40px;
	color: #fff;
	font-size: 40px;
	font-family: 'Lobster', cursive;
	letter-spacing: 0.05em;
	position: relative;
/*	display: inline-block;*/
}
.parking_title:before,
.parking_title:after {
	content: '';
	position: absolute;
	bottom: -15px;
	display: inline-block;
	width: calc(50% - 3em);
	height: 5px;
	top: 50%;
	background-color: #33AFB9;
	border-radius: 2.5px;
}
.parking_title:before {
	left: 0;
}
.parking_title:after {
	right: 0;
}
.parking_txt {
	margin-bottom: 40px;
	font-size: 110%;
	line-height: 1.6;
}
.parking_img {
	text-align: center;
}
.parking_img img {
	max-width: 100%;
}


/* 営業日カレンダー*/
.cal_h {
	margin:40px 0 10px;
	font-size: 30px;
	font-family: 'Lobster', cursive;
	letter-spacing: 0.05em;
}
.cal_tbl {
	margin: 0 auto;
	font-size: 20px;
	border-collapse: collapse;
	border: none;
	border-spacing: 0;
	border-bottom: 1px solid #fff;
}

table.cal_tbl th,
table.cal_tbl td {
	width: 3em;
	padding: 0.7em 0.2em;
	font-family: 'Lobster', cursive;
}
.cal_tbl th {
	padding: 0.2em;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
}
table.cal_tbl td.closed {
	background: url(./img/closed.png) no-repeat center center;
	background-size: 2.2em;
}
.cal_closed {
	margin-top: 10px;
	font-size: 18px;
	font-family: 'Lobster', cursive;
	text-align: center;
}
.cal_closed img {
	width: 24px;
	margin-right: 0.5em;
	vertical-align: bottom;
}


/* --contact--- */


/* --footer--- */
footer {
	min-height: 130px;
	background: #009BA7 url(./img/footer.png) repeat-x center top;
}
footer img {
    width: 100%;
}

/* --footer--- */



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

    /* ---header--- */

    header .top h2 {
    }

    /* ---header--- */


    /* ---main--- */

    main .arrow {
        margin-top: -20px;
    }

    main .arrow img {
        width: 41px;
        height: auto;
    }
	
	.mono_koushi {
		height: 35px;
		background-size: auto 100%;
	}

    /* ---main--- */


	/* ---menu--- */

	.menu {
		margin-bottom: 100px;
	}

	.menu-top {
	}

	.menu-container {
		display: block;
	}
		

	.menu-box {
		width: auto;
		margin-bottom: 30px;
	}

	
	

    /* ---menu--- */

	
	/*gallery*/
	.gallery_title {
		font-size: 30px;
	}
	.nav_img {
		padding: 4px;
	}

    /* ---about--- */

    
    .about-box {
        display: block;
    }
	.about-box .txt p {
		line-height: 2;
		font-size: 16px;
	}

	.title_en {
		font-size: 30px;
	}
	.about-box .about-img {
		width: auto;
		margin: 0 0 20px;
		text-align: center;
	}
	
	
    /* ---about--- */


    /* ---contact--- */
	.contact_title_en {
		font-size: 30px;
	}
	.contact_title span.border_left,
	.contact_title span.border_right {
		height:2px;
		border-radius: 1px;
	}
	.contact_title span.border_left::before,
	.contact_title span.border_right::before,
	.contact_title span.border_left::after,
	.contact_title span.border_right::after {
		height:2px;
		border-radius: 1px;
	}

	.contact_title span.border_left::before,
	.contact_title span.border_right::before {
		top: -10px;
	}
	.contact_title span.border_left::after,
	.contact_title span.border_right::after {
		bottom: -10px;
	}

	.contact .tel {
		font-size: 30px;
	}
	.contact .tel i {
		font-size: 30px;
	}

	.parking_title {
		font-size: 30px;
	}
	.parking_txt {
		font-size: 100%;
	}
    /* ---contact--- */

}

@media screen and (max-width: 479px) {
	
	.menu_title {
		font-size: 30px;
	}
	
	.cal_h {
		font-size: 24px;
	}
	.cal_tbl {
		font-size: 16px;
	}
	
	.map_btn a {
		font-size: 1.2rem;
	}
}

