@charset "utf-8";

/* ------------------------------
	common
------------------------------ */
body {
    color: #231815;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 500;
    font-size: 13px;
    letter-spacing: .05em;
    line-height: 1.75;
}
.noto-serif {
    font-family: 'Noto Serif JP', serif;
}
.noto-sans {
    font-family: 'Noto Sans', sans-serif;
}
.din-condensed {
    font-family: din-condensed, sans-serif;
    font-weight: 400;
    font-style: normal;
}
.w-100 {
    width: 100%!important;
}
.p-0 {
    padding: 0!important;
}
.pb-0 {
    padding-bottom: 0!important;
}
img {
    max-width: 100%;
    height: auto;
}
.sp_none {
    display: none;
}
.text_gradient span {
    background: linear-gradient(90deg, #bb8058, #ac6a3e 50%, #724628);
    background: -webkit-linear-gradient(0deg, #bb8058, #ac6a3e 50%, #724628);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.moreBtn {
    text-align: center;
}
.moreBtn a {
    display: inline-block;
    background: linear-gradient(to right, #e8d2b1 0, #a47948 100%);
    border-radius: 30px;
    color: #fff;
    font-size: 15px;
    letter-spacing: .2em;
    padding: 5px 50px;
    position: relative;
}
.moreBtn a::before {
    content: "";
    background: #c9bc9c;
    border-radius: 30px;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    bottom: -3px;
    z-index: -1;
}





/* ------------------------------
	header
------------------------------ */
#header {
    position: relative;
    z-index: 1;
}
.mv {
    background: url(../img/top/mv.jpg) no-repeat center center / cover;
    box-sizing: border-box;
    display: flex;
    width: 100%;
    height: 100vh;
    padding: 0 30px;
}
.mv_ttl {
    text-align: center;
    margin: auto;
    padding: 0 15px 20px;
    position: relative;
    z-index: 0;
}
.mv_ttl::before,
.mv_ttl::after {
    content: "";
    background: rgba(255, 255, 255, .81);
    position: absolute;
    width: 100%;
    height: 100%;
}
.mv_ttl::before {
    top: -5px;
    left: -5px;
    z-index: -1;
}
.mv_ttl::after {
    top: 5px;
    left: 5px;
    z-index: -2;
}
.mv_ttl__img {
    margin: -30px auto 0;
}
.mv_ttl__en {
    font-size: 20px;
}
.mv_ttl__jaL {
    font-size: 32px;
    line-height: 1;
    margin: -10px 0 5px;
}
.mv_ttl__jaL .large {
    display: inline-block;
    font-size: 50px;
    position: relative;
    bottom: -5px;
}
.mv_ttl__jaS {
    font-size: 21px;
}





/* ------------------------------
	main / caption
------------------------------ */
#caption {
    background: #fff;
    box-sizing: border-box;
    text-align: center;
    padding: 30px 0;
    position: relative;
    z-index: 1;
}
.caption_price {
    font-size: 32px;
    line-height: 1;
}
.caption_price .large {
    font-size: 45px;
}
.caption_price .text_gradient {
    display: inline-block;
    font-size: 60px;
    position: relative;
    bottom: -5px;
}
.caption_ttl {
    display: inline-block;
    color: #7a6a56;
    font-weight: bold;
    font-size: 20px;
    margin: 25px 0 10px;
    padding: 0 40px;
    position: relative;
}
.caption_ttl::before,
.caption_ttl::after {
    content: "";
    margin: auto;
    position: absolute;
}
.caption_ttl::before {
    background: url(../img/top/illust_tableware.png) no-repeat center center / contain;
    top: 5px;
    left: 0;
    width: 35px;
    height: 55px;
}
.caption_ttl::after {
    background: url(../img/top/illust_wine.png) no-repeat center center / contain;
    top: 10px;
    right: 0;
    width: 30px;
    height: 55px;
}
.caption_txt {
    font-size: 16px;
    line-height: 1.4;
}





/* ------------------------------
	main / info
------------------------------ */
#info {
    box-sizing: border-box;
    position: relative;
    z-index: 0;
    width: 100%;
}
.info_img {
    width: 100%;
}
.info_img__1 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.info_img__2 {
    width: 100%;
    height: 200px;
    position: relative;
}
.info_img__2 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.info_el {
    background: #fff;
    padding: 30px 15px;
    position: relative;
    z-index: 1;
}
.info_el__ttl {
    position: relative;
    display: block;
    background: linear-gradient(to right, #e8d2b1 0, #a47948 100%);
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    line-height: 25px;
    height: 60px;
    padding: 5px 50px;
}
.info_el__ttl::before,
.info_el__ttl::after {
    content: "";
    position: absolute;
    top: 0;
    width: 0px;
    height: 0px;
    border-color: transparent #fff;
    border-style: solid;
}
.info_el__ttl::before {
    left: 0;
    border-width: 30px 0px 30px 20px;
}
.info_el__ttl::after {
    right: 0;
    border-width: 30px 20px 30px 0px;
}
.info_el__txt {
    font-weight: 400;
    font-size: 15px;
    text-align: center;
    margin: 10px 0;
}
.info_el__list {
    background: linear-gradient(to right, #fdf4ea 0, #eccdb7 100%);
    padding: 10px 10px 10px 30px;
    position: relative;
}
.info_el__list::before {
    content: "";
    background: linear-gradient(to right, #fdf4ea 0, #eccdb7 100%);
    width: 20px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.info_el__list .title {
    color: #7a6a56;
    font-size: 16px;
}
.info_el__list .list {
    display: flex;
    flex-wrap: wrap;
    font-size: 15px;
}
.info_el__list .list li {
    padding: 0 15px 0 22px;
    position: relative;
}
.info_el__list .list li::before,
.info_el__list .list li::after {
    content: "";
    display: block;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
}
.info_el__list .list li::before {
    border-left: 2px solid #c30d23;
    border-bottom: 2px solid #c30d23;
    left: 3px;
    width: 6px;
    height: 3px;
    transform: rotate(-50deg);
}
.info_el__list .list li::after {
    border: 1px solid #231815;
    left: 0;
    width: 13px;
    height: 13px;
}
.info_el__plan {
    text-align: center;
    padding: 30px 0 0;
}
.info_el__plan .title {
    color: #fff;
    font-weight: bold;
    font-size: 25px;
    padding: 10px 0 5px;
    position: relative;
    z-index: 0;
}
.info_el__plan .title::before,
.info_el__plan .title::after {
    content: "";
    width: calc(100% - 5px);
    height: calc(100% - 5px);
    position: absolute;
}
.info_el__plan .title::before {
    background: linear-gradient(to right, #f29847 0, #d45e12 100%);
    top: 0;
    left: 0;
    z-index: -2;
}
.info_el__plan .title::after {
    background: linear-gradient(to right, #d45e12 0, #f29847 100%);
    bottom: 0;
    right: 0;
    z-index: -1;
}
.info_el__plan .title2 {
    color: #fff;
    font-size: 18px;
    text-align: center;
    padding: 10px 0 5px;
    position: relative;
    z-index: 0;
}
.info_el__plan .title2::before,
.info_el__plan .title2::after {
    content: "";
    width: calc(100% - 5px);
    height: calc(100% - 5px);
    position: absolute;
}
.info_el__plan .title2::before {
    background: linear-gradient(to right, #cad2c7 0, #719379 100%);
    top: 0;
    left: 0;
    z-index: -2;
}
.info_el__plan .title2::after {
    background: linear-gradient(to right, #719379 0, #cad2c7 100%);
    bottom: 0;
    right: 0;
    z-index: -1;
}
.info_el__plan .price {
    padding: 0 0 20px;
    width: 100%;
}
.info_el__plan .price li {
    color: #e94435;
    font-size: 20px;
    line-height: 1;
    margin: 10px 0 0;
}
.info_el__plan .price li .large {
    display: inline-block;
    font-size: 35px;
    padding: 0 3px;
    position: relative;
    bottom: -3px;
}
.info_el__plan .list {
    background: #fdecc9;
    font-weight: bold;
    font-size: 15px;
    padding: 10px;
}
.info_el__plan .moreBtn a {
    font-size: 20px;
    margin: 20px 0 0;
}
.info_el__plan .text {
    font-size: 14px;
    text-align: left;
    margin: 10px 0 0;
}





/* ------------------------------
	main / option
------------------------------ */
#option {
    box-sizing: border-box;
    width: 100%;
}
.option_el {
    padding: 30px 15px;
}
.option_el__ttl {
    background: #dfdbdf;
    text-align: center;
    line-height: 1.2;
    padding: 10px;
    position: relative;
    z-index: 0;
}
.option_el__ttl::before {
    content: "";
    border: 1px solid #4e4e4a;
    margin: auto;
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
}
.option_el__ttl .en {
    color: #73626e;
    font-size: 25px;
}
.option_el__ttl .ja {
    display: block;
    font-weight: 400;
    font-size: 14px;
}
.option_el__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 5px 0 0;
}
.option_el__list li {
    background: #73626e;
    color: #fff;
    font-size: 13px;
    line-height: 1.4;
    text-align: center;
    margin: 5px 0 0;
    padding: 10px 5px;
    width: 100%;
}
.option_el__price {
    margin: 20px auto 0;
    max-width: 1000px;
    width: 100%;
}
.option_el__price dl {
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #73626e;
    color: #73626e;
    font-size: 14px;
    padding: 10px 0;
}
.option_el__price dl:last-child {
    border-bottom: 1px solid #73626e;
}
.option_el__price dt {
    position: relative;
    padding: 0 0 0 20px;
}
.option_el__price dt::before {
    content: "◯";
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
}
.option_el__price dd {
    text-align: right;
}
.option_el__price dd .small {
    display: block;
    font-size: 10px;
    line-height: 1;
}





/* ------------------------------
	main / plan
------------------------------ */
#plan {
    box-sizing: border-box;
    width: 100%;
}
.plan_el {
    padding: 30px 15px;
}
.plan_el__caption {
    color: #7a6a56;
    font-size: 25px;
    line-height: 1.2;
    text-align: center;
}
.plan_el__caption .large {
    display: inline-block;
    font-size: 40px;
    padding: 0 3px;
    position: relative;
    bottom: -5px;
}
.plan_el__ttl {
    background: linear-gradient(to right, #cccac6 0, #f9f4eb 100%);
    color: #a48b78;
    font-size: 25px;
    line-height: 1.5;
    text-align: center;
    margin: 15px 0 0;
}
.plan_el__txt {
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    margin: 10px 0;
}
.plan_el__list {
    margin: 15px 0 0;
    width: 100%;
}
.plan_el__list .title {
    background: #f1f4fb;
    text-align: center;
    line-height: 1.2;
    padding: 10px;
    position: relative;
    z-index: 0;
}
.plan_el__list .title::before {
    content: "";
    border: 1px solid #bbbed4;
    margin: auto;
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
}
.plan_el__list .title .en {
    color: #171c61;
    font-size: 25px;
}
.plan_el__list .title .ja {
    display: block;
    font-weight: 400;
    font-size: 14px;
}
.plan_el__list .flex {
    margin: 10px 0 0;
}
.plan_el__list .flex_img {
    width: 100%;
}
.plan_el__list .flex_img img {
    width: 100%;
    max-height: 280px;
    object-fit: cover;
}
.plan_el__list .flex_el {
    margin: 10px 0 0;
    width: 100%;
}
.plan_el__list .flex_el__ttl {
    color: #595757;
    font-size: 17px;
    padding: 5px 0 5px 25px;
    position: relative;
}
.plan_el__list .flex_el__ttl::before {
    content: "";
    background: linear-gradient(to right, #cccac6 0, #f9f4eb 100%);
    width: 15px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.plan_el__list .flex_el__list {
    margin: 10px 0 0;
}
.plan_el__list .flex_el__list li {
    border-top: 1px solid #231815;
    font-weight: 400;
    font-size: 15px;
    padding: 5px 10px;
}
.plan_el__list .flex_el__list li:last-child {
    border-bottom: 1px solid #231815;
}
.plan_el__list .flex_el__list li .large {
    display: inline-block;
    font-weight: bold;
    font-size: 20px;
    line-height: 1;
    padding: 0 2px 0 0;
    position: relative;
    bottom: 5px;
}
.plan_el__list .item {
    margin: 10px 0 0;
}
.plan_el__list .item_txt {
    font-size: 15px;
    line-height: 1.5;
}
.plan_el__list .item_txt .large {
    color: #a48b78;
}
.plan_el__list .item_img {
    display: flex;
    justify-content: space-between;
    margin: 10px 0 0;
}
.plan_el__list .item_img .image {
    width: calc(100% / 2 - 2px);
}
.plan_el__list .item_img .image img {
    width: 100%;
}
.plan_el__list .moreBtn {
    margin: 15px 0 0;
}
.plan_pr {
    border-top: 1px dashed #917b69;
    padding: 20px 0 0;
}
.plan_pr__ttl {
    font-size: 16px;
    text-align: center;
    line-height: 1.5;
    padding: 0 15px;
}
.plan_pr__img {
    display: flex;
    margin: 20px 0 0;
}
.plan_pr__img .image {
    width: 50%;
    max-height: 420px;
}
.plan_pr__img .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}





/* ------------------------------
	main / space
------------------------------ */
#space {
    box-sizing: border-box;
    width: 100%;
}
.space_el {
    padding: 30px 15px 0;
}
.space_el__ttl {
    background: linear-gradient(to right, #cccac6 0, #f9f4eb 100%);
    color: #a48b78;
    font-size: 25px;
    line-height: 1.5;
    text-align: center;
}
.space_el__txt dt {
    color: #7a6a56;
    font-size: 15px;
    text-align: center;
    line-height: 1.5;
    position: relative;
    margin: 10px 0 0;
}
.space_el__txt dd {
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    margin: 5px 0 0;
}
.space_el__area {
    margin: 25px 0 0;
}
.space_el__area .map {
    width: 100%;
}
.space_el__area .map_ttl {
    color: #7a6a56;
    font-size: 15px;
}
.space_el__area .map_img {
    margin: 5px 0 0;
    width: 100%;
}
.space_el__area .map_img img {
    width: 100%;
}
.space_el__area .guide {
    display: flex;
    border: 2px solid #bbb;
    margin: 30px 0 0;
    width: 100%;
    height: max-content;
}
.space_el__area .guide_ttl {
    display: flex;
    align-items: center;
    background: #ddd;
    border-right: 2px solid #bbb;
    font-size: 15px;
    padding: 10px;
    width: 25%;
}
.space_el__area .guide_list {
    padding: 10px;
    width: 75%;
}
.space_el__area .guide_list li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 5px 0 0;
}
.space_el__area .guide_list li:first-child {
    margin: 0;
}
.space_el__area .guide_list li span {
    display: inline-block;
    background: #3988c0;
    border-radius: 2px;
    color: #fff;
    line-height: 1.3;
    margin: 0 3px 0 0;
    padding: 0 5px;
}
.space_el__area .guide_list li span:last-child {
    margin: 0 10px 0 0;
}
.space_img .image {
    margin: 30px 0 0;
    max-height: 420px;
    width: 100%;
}
.space_img .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}





/* ------------------------------
	main / safety
------------------------------ */
#safety {
    box-sizing: border-box;
    width: 100%;
}
.safety_el {
    padding: 30px 15px;
}
.safety_el__ttl {
    background: linear-gradient(to right, #cccac6 0, #f9f4eb 100%);
    color: #a48b78;
    font-size: 25px;
    line-height: 1.5;
    text-align: center;
}
.safety_el__txt {
    color: #7a6a56;
    font-size: 15px;
    text-align: center;
    line-height: 1.5;
    position: relative;
    margin: 10px 0 0;
}
.safety_el__list {
    margin: 10px 0 0;
}
.safety_el__list li {
    font-weight: 400;
    font-size: 14px;
    padding: 0 0 0 15px;
    position: relative;
}
.safety_el__list li::before {
    content: "・";
    position: absolute;
    top: 0;
    left: 0;
}
.safety_img {
    display: flex;
}
.safety_img .image {
    width: 50%;
    max-height: 420px;
}
.safety_img .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#safety .moreBtn a {
    font-size: 20px;
    margin: 20px 0 0;
}



/* ------------------------------
	kashikiri / info
------------------------------ */
.info_el__img {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 10px 0 0;
    width: 100%;
}
.info_el__img .image {
    margin: 4px 0 0;
    width: calc(100% / 2 - 2px);
}
.info_el__img .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}





/* ------------------------------
	kashikiri / menu
------------------------------ */
#menu {
    box-sizing: border-box;
    padding: 30px 15px 0;
    width: 100%;
}
.menu_el__ttl {
    color: #7a6a56;
    font-weight: bold;
    font-size: 16px;
    line-height: 1.5;
    text-align: center;
}
.menu_el__ttl .large {
    font-size: 20px;
    letter-spacing: .1em;
}
.menu_el__course {
    margin: 20px 0 0;
}
.menu_el__course .title {
    background: #dfdbdf;
    text-align: center;
    line-height: 1.2;
    padding: 10px;
    position: relative;
    z-index: 0;
}
.menu_el__course .title::before {
    content: "";
    border: 1px solid #4e4e4a;
    margin: auto;
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
}
.menu_el__course .title .en {
    color: #73626e;
    font-size: 25px;
}
.menu_el__course .title .ja {
    display: block;
    font-weight: 400;
    font-size: 14px;
}
.menu_el__course .menu {
    padding: 10px 10px 0;
    width: 100%;
}
.menu_el__course .menu_food {
    font-weight: 400;
    font-size: 13px;
}
.menu_el__course .menu_food__large {
    color: #a48b78;
}
.menu_el__course .menu_drink {
    background: #f0efec;
    padding: 10px 15px;
    margin: 10px 0 0;
}
.menu_el__course .menu_drink__ttl {
    border: 1px solid #4e4e4a;
    text-align: center;
    line-height: 1.2;
    padding: 10px;
}
.menu_el__course .menu_drink__ttl .en {
    color: #73626e;
    font-size: 25px;
}
.menu_el__course .menu_drink__ttl .ja {
    display: block;
    font-weight: 400;
    font-size: 14px;
}
.menu_el__course .menu_drink__list {
    background: #fff;
    border: 1px solid #4e4e4a;
    font-weight: 400;
    font-size: 13px;
    margin: 10px 0 0;
    padding: 15px 20px;
}
.menu_el__course .menu_drink__list li {
    position: relative;
    padding: 0 0 0 17px;
}
.menu_el__course .menu_drink__list li::before {
    content: "◯";
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
}
.menu_el__course .list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 5px 0 0;
}
.menu_el__course .list li {
    background: #73626e;
    color: #fff;
    font-size: 13px;
    line-height: 1.4;
    text-align: center;
    margin: 5px 0 0;
    padding: 10px 5px;
    width: 100%;
}
.menu_el__course .price {
    margin: 20px auto 0;
    max-width: 1000px;
    width: 100%;
}
.menu_el__course .price dl {
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #73626e;
    color: #73626e;
    font-size: 14px;
    padding: 10px 0;
}
.menu_el__course .price dl:last-child {
    border-bottom: 1px solid #73626e;
}
.menu_el__course .price dt {
    position: relative;
    padding: 0 0 0 20px;
}
.menu_el__course .price dt::before {
    content: "◯";
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
}
.menu_el__course .price dd {
    text-align: right;
}
.menu_el__course .price dd .small {
    display: block;
    font-size: 10px;
    line-height: 1;
}
.menu_el__img {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 10px 0 0;
    width: 100%;
}
.menu_el__img .image {
    margin: 4px 0 0;
    width: calc(100% / 2 - 2px);
}
.menu_el__img .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}





/* ------------------------------
	kashikiri / layout
------------------------------ */
#layout {
    box-sizing: border-box;
    padding: 30px 15px;
    width: 100%;
}
.layout_el__ttl {
    color: #fff;
    font-size: 18px;
    text-align: center;
    padding: 10px 0 5px;
    position: relative;
    z-index: 0;
}
.layout_el__ttl::before,
.layout_el__ttl::after {
    content: "";
    width: calc(100% - 5px);
    height: calc(100% - 5px);
    position: absolute;
}
.layout_el__ttl::before {
    background: linear-gradient(to right, #cad2c7 0, #719379 100%);
    top: 0;
    left: 0;
    z-index: -2;
}
.layout_el__ttl::after {
    background: linear-gradient(to right, #719379 0, #cad2c7 100%);
    bottom: 0;
    right: 0;
    z-index: -1;
}
.layout_el__list {
    width: 100%;
}
.layout_el__list li {
    margin: 15px 0 0;
}
.layout_el__list li .title {
    color: #73626e;
    font-size: 15px;
}
#layout .moreBtn a {
    font-size: 20px;
    margin: 10px 0 0;
}





/* ------------------------------
	footer
------------------------------ */
#footer {
    box-sizing: border-box;
    padding: 30px 15px;
    width: 100%;
}
.footer_el__info {
    text-align: center;
    width: 100%;
}
.footer_el__info .tel {
    font-size: 30px;
    margin: 10px 0 0;
}
.footer_el__info .adress {
    font-weight: 400;
    font-size: 13px;
}
.footer_el__time {
    margin: 20px auto 0;
    max-width: 450px;
    width: 100%;
}
.footer_el__time .title {
    background: linear-gradient(to right, #cccac6 0, #f9f4eb 100%);
    font-weight: bold;
    font-size: 20px;
    text-align: center;
}
.footer_el__time .time {
    font-weight: bold;
    font-size: 17px;
    line-height: 1.3;
    margin: 10px 0 0;
    padding: 0 20px;
}
