@charset "utf-8";

.eventLinkBox {
    display: flex;
    flex-direction: column;
}

p.eventLinkTit {
    font-weight: 600;
    margin-bottom: 20px;
    font-size: 1.2em;
}

a.eventLink {
    font-weight: 600;
    margin-bottom: 10px;
    font-size: 1.2em;
}

/* CSS Document */
body {
    text-align: center;
}

img {
    width: auto;
    max-width: 100%;
}

/*----- header ----- */
header h1 {
    margin: 1% 0;
}

nav li {
    display: inline-block;
    margin: 0 1.5%;
}

header .drawer-hamburger {
    display: none;
}

/*----- footer ----- */
footer {
    margin-top: 5%;
}

footer .reserve_comm {
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 2%;
}

footer .reserve a {
    border-right: solid 3px #1d1818;
    border-left: solid 3px #1d1818;
    max-width: 312px;
    margin: 0 auto;
    display: block;
}

footer .reserve h4 {
    margin: 3% 0;
}

footer .sns_icon li {
    display: inline-block;
    margin: 3% 0.5%;
}

footer .googlemap {
    max-width: 1365px;
    width: 100%;
    height: 227px;
    margin-bottom: 3%;
}

footer .tel {
    margin: 1.5% 0;
}

footer .tel a {
    font-size: 2.0rem;
    font-weight: bold;
}

footer .address {
    max-width: 450px;
    text-align: left;
    margin: 2% auto;
}

footer .address li {
    font-size: 0.9rem;
    font-weight: bold;
}

footer nav {
    border-top: solid 2px #efefef;
    padding: 2% 0;
}

footer .copy {
    padding: 1% 0;
}

footer .copy li {
    display: inline-block;
    font-size: 0.9rem;
    font-weight: bold;
}

footer .copy .privacy {
    border-right: solid 2px #1d1818;
    border-left: solid 2px #1d1818;
    height: 14px;
    position: relative;
    left: 1%;
}

footer .copy .privacy a {
    font-size: 0.8rem;
    font-weight: bold;
    margin: 0;
    width: 120px;
    display: block;
    position: relative;
    top: -2px;
}

.fixedBnr {
    position: fixed;
    z-index: 99999;
    bottom: 150px;
    right: 0;
}

.fixedBnr a {
    background: #820202;
    color: #fff;
    display: block;
    font-size: .85em;
    padding: .6em;
    border-left: .6em solid #000;
    border-radius: 6px 0 0 6px;
}

.fixedBnr a:hover {
    opacity: .6;
}

.fixedBnr a span {
    display: block;
    font-size: 1.38em;
    font-weight: bold;
}

/*----- 共通パーツ ----- */
.middle_ph {
    max-width: 1365px;
    width: 100%;
    margin: 0 auto;
}

.middle_ph img {
    width: 100%;
}

.menu_list {
    max-width: 1365px;
    margin: 3.5% auto 5% auto;
}

.menu_list li {
    margin: 2.5% 2.5% 2.5% 2.5%;
    width: 20%;
    display: inline-block;
    vertical-align: top;
}

.menu_list li .photo {
    width: 85%;
}

.menu_list li h4 {
    margin: 10% 0 5% 0;
}

.menu_list li h5 {
    margin: 0% 0 8% 0;
    font-size: .9rem;
    min-height: 40px;
}

.main {
    height: 212px;
    position: relative;
    max-width: 2500px;
    margin: 0 auto;
}

.main h2 {
    position: absolute;
    top: 40%;
    left: 0;
    right: 0;
    max-width: 330px;
    margin-right: auto;
    margin-left: auto;
}

.inner {
    max-width: 940px;
    margin: 5% auto;
}

.inner_box {
    margin: 3% 1% 8% 1%;
    text-align: left;
}

.bnr_wrap {
    margin: 3% 1% 8% 1%;
}

.menu_btn li {
    display: inline-block;
    margin: 2% 0.5%;
}

.com_txt,
.com_txt a {
    font-size: 1.2rem !important;
    font-weight: bold !important;
    color: #820202 !important;
    margin: 10px auto;
    text-align: center;
    text-decoration: none !important;
}

.com_xs a {
    font-size: 1rem !important;
    font-weight: bold !important;
    color: #820202 !important;
    margin: 10px auto;
    text-align: center;
    text-decoration: none !important;
}

/*---- table ---*/
.table {
    border-top: solid 1px #545151;
}

.table tr {
    border-bottom: solid 1px #545151;
}

.table th {
    text-align: center;
    background: #e4cccc;
    padding: 2% 5%;
    width: 20%;
    vertical-align: middle;
}

.table td {
    padding: 2% 5%;
    text-align: left;
}

.menu_page .inner {
    max-width: 940px;
    width: 90%;
    margin: 5% auto;
}

.menu_page .menu_01 .menu_table th {
    width: 100%;
    display: block;
}

.menu_page .menu_01 .menu_table td {
    width: 100%;
    padding: 0 2% 2%;
    display: block;
}

/*---- MENU DRINK COURSE table ---*/
.menu_table,
.menu_table02,
.menu_table03 {
    border-top: solid 1px #CFCFCF;
    width: 100%;
    margin: 1% 0;
}

.menu_table tr,
.menu_table02 tr,
.menu_table03 tr {
    border-bottom: solid 1px #CFCFCF;
}

.menu_table th,
.menu_table td,
.menu_table02 th,
.menu_table02 td,
.menu_table03 th,
.menu_table03 td {
    padding: 2% 2%;
    width: 50%;
    text-align: left;
}

.menu_table td,
.menu_table02 td,
.menu_table03 td {
    text-align: right;
}

.menu_table th:before,
.menu_table02 th:before,
.menu_table03 th:before {
    content: url(../images/drink/icon_square.png);
    margin-right: 5px;
}

.menu_table .other:before,
.menu_table02 .other:before {
    content: none;
}

.menu_table .other,
.menu_table02 .other {
    text-align: right;
    padding: 2% 5%;
}

.menu_table th,
.menu_table02 th,
.menu_table03 th {
    color: #820202;
    font-size: 1rem;
    font-weight: bold;
    text-align: left;
}

.menu_table02 th {
    width: 17%;
    padding: 0 1.5%;
    text-align: left;
}

.menu_table03 th {
    width: 33%;
    padding: 1% 0.5% 1% 2.0%;
    text-align: left;
}

.eventWrap {
    margin-top: 70px;
}

.ttl01 {
    background: url(../images/drink/icon.png) no-repeat center top;
    font-size: 1.4rem;
    font-weight: bold;
    padding: 40px 0 1% 0;
    border-bottom: solid 1px #1d1818;
}

.menuImg {
    margin-top: 50px;
}

.pc_only {
    display: inline;
}

.sp_only {
    display: none;
}

/* --------------------
	  top
--------------------- */
.top_main {
    background: url(../images/index/main_20251128.png) no-repeat center top;
    height: 525px;
    background-size: cover;
    position: relative;
    max-width: 2500px;
    margin: 0 auto;
}

.top_main h2 {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    max-width: 695px;
    margin-right: auto;
    margin-left: auto;
}

.top_main h2 img {
    width: 100%;
}

.top_01 {
    margin: 3% 0;
}

.top_01 h3 {
    max-width: 940px;
    border-bottom: solid 2px #1d1818;
    margin: 0 auto 2% auto;
    padding-bottom: 1.5%;
}

.top_01 h4 {
    font-size: 20px;
    font-weight: 700;
}

.top_01 p {
    font-size: 1.2rem;
}

.bn_reserve {
    margin-bottom: 3%;
    max-width: 707px;
    margin-right: auto;
    margin-left: auto;
}

.bn_reserve img {
    width: 100%;
}

.news {
    margin: 3% auto;
    max-width: 940px;
    text-align: left;
}

.news h3 {
    border-bottom: solid 2px #1d1818;
    padding-bottom: 3%;
    text-align: center;
}

.news dl {
    width: 53%;
    display: inline-block;
    vertical-align: top;
    height: 450px;
    overflow-y: scroll;
    margin: 3% 2%;
    padding-right: 2%;
}

.news dl dt {
    font-weight: bold;
    color: #820202;
}

.news dl dd {
    margin-bottom: 8%;
}

.news .facebook {
    display: inline-block;
    vertical-align: top;
    width: 38%;
    margin: 3% 2%;
}

.news .fb-page {
    width: 100%;
}

.bn_list li {
    display: inline-block;
    margin: 0 0.5%;
}

/* --------------------
	  drink
--------------------- */
.drink {
    background: url(../images/drink/main.png) no-repeat center top;
    background-size: cover;
}

.free_area {
    margin: 3% 1% 8% 1%;
    text-align: left;
}

.free_area dl {
    width: 69%;
    display: inline-block;
}

.free_area .bn_course {
    width: 34.2%;
    display: inline-block;
    vertical-align: top;
}

.free_area .bn_freeplan {
    max-width: 914px;
    width: 100%;
}

.free_area .bn_freeplan img {
    width: 100%;
}

.free_area .bn_course {
    width: 30%;
    display: inline-block;
    vertical-align: top;
}

.free_area .bn_course img {
    width: 100%;
}

.free_area dt {
    font-size: 1.7rem;
    font-weight: bold;
}

.free_area dd {
    font-size: 1.1rem;
    font-weight: bold;
}

.drink_01 .left {
    width: 66%;
    margin-right: 3%;
    display: inline-block;
    vertical-align: top;
    text-align: left;
}

.drink_01 .right {
    width: 30%;
    margin-top: 6.2%;
    display: inline-block;
    vertical-align: top;
}

.drink_01 .right img {
    width: 100%;
}

.drink_01 .left h4 {
    font-size: 2.0rem;
    padding-left: 4%;
    display: block;
    position: relative;
}

.drink_01 .left h5 {
    font-size: 1.3rem;
    padding-left: 4%;
    margin-bottom: 20px;
}

.drink_01 .left h4 .price {
    position: absolute;
    right: 5%;
    bottom: 17%;
}

.drink_01 .left .type {
    background: #faf5f5;
}

.drink_01 .left .type {
    padding: 2.5% 5%;
    margin: 3% 0 0 0;
}

.drink_01 .left .type li {
    color: #820202;
    margin: 0 2.5%;
    font-size: 1.1rem;
    font-weight: bold;
    display: inline-block;
}

.drink_01 .left .type li:before {
    content: url(../images/drink/icon_square.png);
    margin-right: 5px;
}

/* --------------------
	  menu
--------------------- */
.menu {
    background: url(../images/menu/main.png) no-repeat center top;
    background-size: cover;
}

.menu_01 .takeout {
    margin: 40px 0;
}

.menu_01 .takeout dt {
    font-size: 1.5rem;
    font-weight: bold;
}

.menu_01 .takeout dd {
    font-weight: bold;
}

.menu_01 .takeout dd span {}

.menu_01 h4 {
    font-size: 2.0rem;
    padding-left: 4%;
    display: block;
    position: relative;
}

.menu_01 h5 {
    font-size: 1.3rem;
    padding-left: 4%;
    margin-bottom: 20px;
}

.menu_01 .photo_list {
    text-align: center;
    margin: 40px 0 40px 0;
}

.menu_01 .photo_list li {
    display: inline-block;
    margin: 0 0.5% 1%;
}

.menu_01 .menu_table th {
    width: 60%;
}

.seasonMenuTxt {
    display: block;
    font-size: 13px;
}

.seasonLunchTxt {
    margin: 0 0.5em 0 0;
    color: #f01010;
    font-weight: 700;
}

/* --------------------
	  course
--------------------- */
.course {
    background: url(../images/course/main.png) no-repeat center top;
    background-size: cover;
}

.course_01 {
    margin-bottom: 60px;
}

.course_01 h4 {
    font-size: 2.0rem;
    padding-left: 4%;
    display: block;
    position: relative;
}

.course_01 .left {
    width: 65%;
    margin: 0 auto;
    padding: 0 0% 2% 0%;
}

.course_01 .left h4 {
    background: #faf5f5;
    font-size: 2.5rem;
    font-weight: bold;
    padding: 2% 0;
    margin: 2% 0 2% 0;
    text-align: center;
}

.course_01 .left h4 span {
    font-size: 1.1rem;
    margin-right: 5%;
}

.course_01 .right {
    width: 45%;
    padding: 0 4%;
    margin: 0 auto 3% auto;
    vertical-align: top;
}

.monthTxt {
    text-align: center;
    margin-bottom: 25px;
    font-weight: bold;
    font-size: 20px;
}

.course_01 .right img {
    width: 100%;
}

.course_01 .photo_list {
    text-align: center;
    margin: 40px 0 40px 0;
}

.course_01 .photo_list li {
    display: inline-block;
    margin: 0 0.2% 0.8%;
}

.course_01 .atention {
    font-size: 1.1rem;
    margin: 2% 0 0 4%;
}

.course_01 .photo_list img {
    height: auto;
    max-width: 340px;
}

.phLi {
    width: 23%;
}

.phLi img {
    width: 200px;
}

a.reserve_btn {
    background: #820202;
    font-size: 1.4rem;
    font-weight: bold;
    color: #fff;
    display: block;
    max-width: 400px;
    text-align: center;
    padding: 1.5% 0;
    margin: 5% auto;
    border: solid 1px #820202;
}

a.reserve_btn:hover {
    background: #fff;
    color: #820202;
    border: solid 1px #820202;
}

.smorgasbord .left {
    /* margin: 0 0 0 0; */
    display: inline-block;
    width: 66%;
}

.smorgasbord .left h4 {
    padding: 2% 6%;
    text-align: left;
    position: relative;
    width: 100%;
    display: inline-block;
    margin: 0;
}

.smorgasbord .left h4 .child {
    font-size: 1rem;
    font-weight: bold;
    color: #820202;
    position: absolute;
    right: 0%;
    bottom: 10%;
}

.smorgasbord .left h4 .icon {
    position: absolute;
    top: -40px;
    right: 0;
}

.smorgasbord .right {
    display: inline-block;
    width: 28%;
    padding: 0;
    margin: 0 0 0 5%;
}

.course_01 .atention02 {
    background: #faf5f5;
    font-weight: bold;
    padding: 3% 10%;
    margin: 2% 0 3% 0;
    text-align: center;
}

.course_01 .atention02 h4 {
    font-size: 1.7rem;
    font-weight: bold;
    color: #820202;
    padding: 0 0 0 0;
    margin: 0 5% 10px 2%;
    text-align: left;
}

.course_01 .atention02 h4 span {
    background: #820202;
    color: #fff;
    font-size: 1.8rem;
    padding: 5px 10px;
    margin: 0 10px 0 0;
}

.course_01 .atention02 li {
    text-align: left;
    width: 49%;
    display: inline-block;
    vertical-align: top;
}

.course_01 .atention02 li:before {
    content: "・";
}

.course_01 .atention03 {
    text-align: left;
}

.course_01 .atention03 p {
    padding-left: 2%;
    font-weight: bold;
}

.course_01 .atention03 span {
    padding-left: 3%;
    font-weight: normal;
}

.smorgasbord .reserve_btn {
    text-align: center;
}

.smorgasbord .reserve_btn li {
    display: inline-block;
    width: 400px;
}

h5 {
    font-size: 1.2rem;
    font-weight: bold;
    color: #820202;
    padding: 0 0 0 0;
    margin: 0 auto;
    text-align: center
}

/* --------------------
	  ACCESS
--------------------- */
.access {
    background: url(../images/access/main.png) no-repeat center top;
    background-size: cover;
}

.access_01 {
    margin-bottom: 60px;
}

.access_01 .left {
    width: 51%;
    margin: 4% 0% 4% 1.5%;
    display: inline-block;
    text-align: left;
    vertical-align: top;
}

.access_01 .left table {
    width: 100%;
}

.access_01 .left table th {
    width: 30%;
}

.access_01 .right {
    display: inline-block;
    width: 41.5%;
    margin: 4% 1.5% 4% 3.5%;
    vertical-align: top;
}

.access_01 .right img {
    width: 100%;
}

.access_01 .access_ph li {
    display: inline-block;
    text-align: left;
    vertical-align: top;
}

.access_01 .access_ph li img {
    width: 100%;
}

.access_01 .access_ph li:nth-child(1) {
    margin-right: 1.5%;
    width: 64%;
}

.access_01 .access_ph li:nth-child(2) {
    width: 31%;
}

.access_01 .access_ph li span {
    display: block;
}

.access_02 .googlemap {
    width: 100%;
    height: 474px;
    margin: 4% 0;
}

/* --------------------
	  RECRUIT
--------------------- */
.recruit {
    background: url(../images/recruit/main.png) no-repeat center top;
    background-size: cover;
}

.recruit_01 .middle_ph {
    margin: 2% auto;
    width: 96% !important;
}

.recruit_01 .middle_ph img {
    width: 350px !important
}

.recruit_01 .table {
    width: 96%;
    margin: 4% auto;
}

.recruit_01 h4 {
    font-size: 1.4rem;
    font-weight: bold;
    color: #820202;
    margin: 40px 0 20px 0;
}

.recruit_01 .tel a {
    font-size: 2.4rem;
    font-weight: bold;
}

.recruit_01 .address li {
    font-size: 1.1rem;
}

/* --------------------
	  COMPANY
--------------------- */
.company {
    background: url(../images/company/main_20201109.png) no-repeat center top;
    background-size: cover;
}

.company_01 .table {
    width: 96%;
    margin: 4% auto;
}

/* --------------------
	  EVENT
--------------------- */
.event {
    background: url(../images/event/main.png) no-repeat center top;
    background-size: cover;
}

.benefits {
    margin-bottom: 60px;
}

.benefits li {
    border: solid 1px #820202;
    width: 46%;
    margin: 4% 1% 0% 1%;
    display: inline-block;
    vertical-align: top;
}

.benefits dt {
    background: #820202;
    color: #fff;
    font-size: 1.2rem;
    padding: 10px 0;
}

.benefits dd {
    padding: 10px 0;
}

.benefits dd img {
    width: 96%;
}

p.lineQr {
    display: inline-block;
    width: 20%;
    margin: 4% 1.5% 4% 3.5%;
    vertical-align: top;
}

.benefits dd span {
    font-weight: bold;
}

.fair .table_fair {
    width: 90%;
    margin: 4% auto 4% auto;
}

.fair .table_fair th {
    color: #820202;
    font-size: 1.8rem;
    font-weight: bold;
    text-align: left;
    vertical-align: middle;
}

.fair .table_fair th span {
    font-size: 1.3rem;
    color: #1d1818;
    display: block;
}

.fair .table_fair td {
    vertical-align: middle;
}

.fair .table_fair td img {
    margin-bottom: 30px;
}

.fair .table_fair .price {
    font-size: 2.6rem;
    font-weight: bold;
}

.flexBox {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
}

.flexBox div {
    width: 33.333%;
}

.flexBox p {
    text-align: center;
    margin: 0 auto;
}

.flexBox .calendarImg {
    width: 33.333%;
}

.holiday {
    width: 100%;
    margin: 2% auto;
    padding: 0 0 5% 0;
}

.holiday>img {
    vertical-align: top;
}

.holiday h4 img {
    width: 45%;
}

.holiday li {
    font-size: 1.4rem;
}

.holiday li span {
    color: #820202;
    font-size: 1.4rem;
}

.season dt {
    font-size: 1.2rem;
    font-weight: bold;
    color: #820202;
    margin-top: 20px;
}

.season dt span {
    font-size: 1.2rem;
    font-weight: bold;
}

.season dd {
    font-size: 1.0rem;
    line-height: 1.2em;
    margin-bottom: 30px;
    word-wrap: break-word;
}

.season dd span {
    font-size: 2.4rem;
    color: #820202;
}

.season dd span {
    font-size: 2.4rem;
    color: #820202;
}

.season dd a {
    font-size: 1.0rem;
    color: #000;
    font-weight: 700;
}

.season dd a:hover {
    color: #820202;
}

.event_sns h5 {
    font-size: 2.0rem;
    font-weight: bold;
    margin: 30px 0 0px 0;
    color: #820202;
}

.event_sns dl {
    margin: 20px 1% 0 1%;
    display: inline-block;
    width: 15%;
}

.event_sns {
    margin: 60px 0 100px 0;
}

.event_sns dt {
    margin-bottom: 10px;
    text-align: center;
}

.event_sns dt img {
    width: 60%;
    margin: 0 auto;
    display: block;
}

.event_sns dd {
    font-size: 1.3rem;
    font-weight: bold;
    text-align: center;
}

.event_01 .middle_ph {
    margin: 30px auto 60px auto;
    width: 96% !important;
}

.edenPic img {
    width: 220px !important;
}

/* --------------------
	  RESERVE
--------------------- */
.reserve_main {
    background: url(../images/reserve/main.png) no-repeat center top;
    background-size: cover;
}

.reserve_about h4 {
    font-size: 2.3rem;
    margin: 4% 0;
}

.reserve_about h5,
.reserve_about h5 span {
    font-weight: bold;
    font-size: 1.2rem;
}

.reserve_about h5 span {
    color: #820202;
}

.reserve_about h6 {
    font-size: 1.3rem;
    margin: 20px 0;
}

.reserve_room .select_btn {
    margin: 3% 0;
}

.reserve_room .select_btn li {
    display: inline-block;
    width: 23%;
    margin: 0 .5%;
    vertical-align: top;
}

.reserve_room .select_btn li a {
    background: #820202;
    border: solid 1px #820202;
    color: #fff;
    padding: 15px 0;
    display: block;
    width: 100%;
    font-size: 1.3rem;
}

.reserve_room .select_btn li a:hover {
    background: #fff;
    color: #820202;
    border: solid 1px #820202;
}

.room_detail {
    width: 96%;
    margin: 4% auto;
    text-align: left;
    padding: 2% 0 7% 0;
    border-bottom: solid 1px #e4cccc;
}

.room_detail .left {
    display: inline-block;
    width: 54%;
    margin-right: 5%;
    vertical-align: top;
}

.room_detail .right {
    width: 40%;
    display: inline-block;
    vertical-align: top;
}

.room_detail .right img {
    width: 100%;
}

.room_detail h4:before {
    content: "●";
}

.room_detail h4 {
    color: #820202;
    font-size: 1.6rem;
}

.room_detail h4 span {
    font-size: 1.1rem;
    color: #1d1818;
    margin-left: 3%;
}

.room_detail p {
    font-size: 1.1rem;
    margin: 10px 0 0 0;
}

.room_detail ul {
    border-radius: 5px;
    border: solid 1px #820202;
    padding: 3% 0% 3% 15%;
    margin: 30px 0 20px 0;
}

.room_detail ul li:before {
    content: "・";
}

.room_detail ul li {
    font-size: 1.4rem;
}

.room_detail .table {
    width: 100%;
}

.room_detail .table th {
    width: 30%;
}

.reserve_attention table {
    background: #f9f3f3;
    width: 46%;
    margin: 0 1%;
    display: inline-block;
}

.reserve_attention table th {
    vertical-align: middle;
    padding: 0 0% 0 6%;
    width: 85%;
    font-size: 1.4rem;
    text-align: left;
}

.reserve_attention table th span {
    display: block;
}

.reserve_attention dl {
    width: 94.5%;
    margin: 4% auto;
}

.reserve_attention dt {
    background: #820202;
    color: #fff;
    font-size: 1.3rem;
    padding: 5px 0;
}

.reserve_attention dd {
    padding: 4% 10%;
    background: #f9f3f3;
    text-align: left;
}

.reserve_attention dd li:before {
    content: "■ ";
}

.reserve_attention dd li {
    font-size: 1.2rem;
}

.privacy h4 {
    font-size: 1.2rem;
    font-weight: bold;
    margin: 5% 0 2% 0;
}

.privacy ul li {
    list-style-type: decimal;
    margin-left: 20px;
    font-size: 1.1rem;
    line-height: 1.9em;
}

.privacy ul li ul {
    margin: 20px 0;
}

.privacy ul li ul li {
    list-style-type: none;
    list-style-position: inside;
    counter-increment: cnt;
}

.privacy ul li ul li:before {
    display: marker;
    content: "(" counter(cnt) ") ";
    margin-left: -23px;
}

/* --------------------
	  MEMBER
--------------------- */
.member {
    background: url(../images/member/main.png) no-repeat center top;
    background-size: cover;
}

.member_guide h4 {
    font-size: 1.8rem;
    font-weight: bold;
    margin: 6% 0 0 0;
}

.member_guide h5 {
    color: #820202;
    font-size: 1.4rem;
    font-weight: bold;
    margin: 0 0 4% 0;
}

.member_guide dl {
    width: 15%;
    display: inline-block;
    margin: 0 3%;
}

.member_guide dt img {
    width: 100%;
}

.member_guide dd {
    border-top: solid 1px #820202;
    border-bottom: solid 1px #820202;
    font-size: 1.0rem;
    padding: 7% 0;
    margin: 16% 0 40px 0;
}

.member_guide h6 {
    font-size: 1.2rem;
}

.mail_benefits h4 {
    font-size: 2.1rem;
    font-weight: bold;
    margin: 60px 0 20px 0;
}

.benefits_list {
    max-width: 521px;
    margin: 1% auto 6% auto;
}

.benefits_list li {
    background: url(../images/member/mail_bg.png) no-repeat center top;
    background-size: contain;
    padding: 2.0% 0 2.0% 10%;
    margin: 0 0 30px 0;
    color: #820202;
    font-size: 1.5rem;
    position: relative;
}

.benefits_list li span {
    color: #fff;
    font-size: 1.5rem;
    position: absolute;
    left: 3%;
}

.benefits_list li p {
    color: #1d1818;
    font-size: 1.2rem;
    margin: 5% 0 0 0;
    display: block;
}

.mail_benefits h5 {
    color: #820202;
    font-size: 1.5rem;
}

.mail_point {
    border: solid 1px #820202;
    padding: 4% 0;
    margin: 5% 0;
}

.mail_point p {
    font-size: 1.1rem;
}

.mail_point h4 {
    color: #820202;
    font-size: 1.8rem;
    margin: 20px 0 0 0;
}

.mail_point h5 {
    color: #1d1818;
    font-size: 1.6rem;
    margin: 0;
}

.entry_step h5 {
    background: #820202;
    color: #fff;
    text-align: center;
}

.entry_step {
    background: #f9f3f3;
    text-align: left;
    padding-bottom: 2%;
}

.entry_step dl {
    margin: 4% 2% 0 4%;
    width: 72%;
    display: inline-block;
}

.entry_step dl dt {
    float: left;
    margin-right: 3%;
    margin-bottom: 1%;
}

.entry_step dl dd {
    font-size: 1.2rem;
    padding: 2% 0 0 0;
}

.entry_step dl dd:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.entry_step .qr {
    display: inline-block;
    vertical-align: top;
    width: 16.5%;
    margin: 4% 0 0 0;
}

.entry_step .qr img {
    width: 100%;
}

.entry_step .attention {
    margin: 2% 0 2% 30%;
}

.entry_step .attention li:before {
    content: "■";
}

.entry_step .attention li {
    font-size: 1.1rem;
    margin: 0 0 5px 0;
}

.official_sns {
    border: solid 1px #820202;
    border-radius: 5px;
    padding: 6% 2%;
}

.official_sns h3 {
    font-size: 4.5rem;
    color: #820202;
    line-height: 1.2em;
}

.official_sns h4 {
    font-size: 1.2rem;
    margin: 10px 0;
}

.official_sns ul {
    margin: 5% 0 0 0;
}

.official_sns li {
    width: 22%;
    padding: 0% 0;
    border-right: solid 1px #bb8182;
    display: inline-block;
    vertical-align: top;
}

.official_sns li:last-child {
    border-right: none;
}

.official_sns h5 {
    width: 29%;
    margin: 0 auto;
}

.official_sns h5 img {
    width: 100%;
}

.official_sns dl {
    margin: 5% 0 0 0;
}

.official_sns dt {
    font-weight: bold;
    font-size: 1.1rem;
}

.official_sns dd {
    font-size: .9rem;
}

.official_sns p {
    width: 75%;
    margin: 0 auto;
}

.official_sns p img {
    width: 100%;
}

.white {
    color: #fff;
}

.red {
    color: #c80000;
}

.txt_c {
    text-align: center
}

/*====================================
  margin
  ====================================*/
.mt3 {
    margin-top: 3px;
}

.mt5 {
    margin-top: 5px;
}

.mt7 {
    margin-top: 7px;
}

.mt10 {
    margin-top: 10px;
}

.mt15 {
    margin-top: 15px;
}

.mt20 {
    margin-top: 20px;
}

.mt25 {
    margin-top: 25px;
}

.mt30 {
    margin-top: 30px;
}

.mt35 {
    margin-top: 35px;
}

.mt50 {
    margin-top: 50px;
}

.mt70 {
    margin-top: 70px;
}

.mt100 {
    margin-top: 100px;
}

.mb5 {
    margin-bottom: 5px;
}

.mb10 {
    margin-bottom: 10px;
}

.mb13 {
    margin-bottom: 13px;
}

.mb15 {
    margin-bottom: 15px;
}

.mb20 {
    margin-bottom: 20px;
}

.mb25 {
    margin-bottom: 25px;
}

.mb30 {
    margin-bottom: 30px;
}

.mb35 {
    margin-bottom: 35px;
}

.mb50 {
    margin-bottom: 50px;
}

.mb70 {
    margin-bottom: 70px;
}

.mb100 {
    margin-bottom: 100px;
}

.ml5 {
    margin-left: 5px;
}

.ml10 {
    margin-left: 10px;
}

.ml15 {
    margin-left: 15px;
}

.ml20 {
    margin-left: 20px;
}

.ml25 {
    margin-left: 25px;
}

.ml30 {
    margin-left: 30px;
}

.ml35 {
    margin-left: 35px;
}

.ml40 {
    margin-left: 60px;
}

.ml50 {
    margin-left: 50px;
}

.mr5 {
    margin-right: 5px;
}

.mr10 {
    margin-right: 10px;
}

.mr12 {
    margin-right: 12px;
}

.mr15 {
    margin-right: 15px;
}

.mr20 {
    margin-right: 20px;
}

.mr25 {
    margin-right: 25px;
}

.mr30 {
    margin-right: 30px;
}

.mr35 {
    margin-right: 35px;
}

.mr50 {
    margin-right: 50px;
}

.mtb10 {
    margin-top: 10px;
    margin-bottom: 10px;
}

.mtb20 {
    margin-top: 20px;
    margin-bottom: 20px;
}

.mtb30 {
    margin-top: 30px;
    margin-bottom: 30px;
}

.mtb40 {
    margin-top: 40px;
    margin-bottom: 40px;
}

.mtb50 {
    margin-top: 50px;
    margin-bottom: 50px;
}

.mtb100 {
    margin-top: 100px;
    margin-bottom: 100px;
}

.mlr10 {
    margin-left: 10px;
    margin-right: 10px;
}

.mlr20 {
    margin-left: 20px;
    margin-right: 20px;
}

/*====================================
  padding
  ====================================*/
.pt5 {
    padding-top: 5px;
}

.pt7 {
    padding-top: 7px;
}

.pt10 {
    padding-top: 10px;
}

.pt15 {
    padding-top: 15px;
}

.pt20 {
    padding-top: 20px;
}

.pt25 {
    padding-top: 25px;
}

.pt30 {
    padding-top: 30px;
}

.pt35 {
    padding-top: 35px;
}

.pt50 {
    padding-top: 50px;
}

.pt70 {
    padding-top: 70px;
}

.pt100 {
    padding-top: 100px;
}

.pb5 {
    padding-bottom: 5px;
}

.pb7 {
    padding-bottom: 7px;
}

.pb10 {
    padding-bottom: 10px;
}

.pb15 {
    padding-bottom: 15px;
}

.pb20 {
    padding-bottom: 20px;
}

.pb25 {
    padding-bottom: 25px;
}

.pb30 {
    padding-bottom: 30px;
}

.pb35 {
    padding-bottom: 35px;
}

.pb50 {
    padding-bottom: 50px;
}

.pb70 {
    padding-bottom: 70px;
}

.pb100 {
    padding-bottom: 100px;
}

.pl5 {
    padding-left: 5px;
}

.pl10 {
    padding-left: 10px;
}

.pl15 {
    padding-left: 15px;
}

.pl20 {
    padding-left: 20px;
}

.pl25 {
    padding-left: 25px;
}

.pl30 {
    padding-left: 30px;
}

.pl35 {
    padding-left: 35px;
}

.pl50 {
    padding-left: 50px;
}

.pl70 {
    padding-left: 70px;
}

.pl100 {
    padding-left: 100px;
}

.pr5 {
    padding-right: 5px;
}

.pr10 {
    padding-right: 10px;
}

.pr15 {
    padding-right: 15px;
}

.pr20 {
    padding-right: 20px;
}

.pr25 {
    padding-right: 25px;
}

.pr30 {
    padding-right: 30px;
}

.pr35 {
    padding-right: 35px;
}

.pr50 {
    padding-right: 50px;
}

.pr70 {
    padding-right: 70px;
}

.pr100 {
    padding-right: 100px;
}

.ft_70 {
    font-size: 70%;
}

.ft_100 {
    font-size: 100%;
}

.ft_150 {
    font-size: 150%;
}

.w100 {
    width: 100% !important;
}

.box01 {
    width: 87%;
    text-align: center;
    margin: 2em auto;
    position: relative;
    padding: 0.25em 1em;
    border: solid 3px #820202;
    border-radius: 3px 0 3px 0;
}

.box01:before,
.box01:after {
    content: '';
    position: absolute;
    width: 15px;
    height: 15px;
    border: solid 3px #820202;
    border-radius: 50%;
}

.box01:after {
    top: -15px;
    left: -15px;
}

.box01:before {
    bottom: -15px;
    right: -15px;
}

.box01 p {
    text-align: center;
    margin: 2%;
    padding-bottom: 10px;
    font-weight: 700;
    font-size: 117%;
}

@media screen and (max-width: 768px) {
    footer {
        margin-bottom: 60px;
    }

    .fixedBnr {
        position: fixed;
        bottom: 0;
        width: 100%;
    }

    .fixedBnr a {
        border: none;
        border-radius: 0;
    }

    .phLi {
        width: 100%;
    }

    .phLi img {
        width: 292px;
    }
}