@charset "UTF-8";
/* general */
body { font-family: 'Pretendard', sans-serif; letter-spacing: -0.02em; --ellipsis:1; }
img { max-width: 100%; }
.inner { width: 100%; margin: auto; max-width: 1200px; }
.thin { font-weight: 300; }
.mark { background: linear-gradient(to bottom, transparent 40%, var(--mark) 40%) ; padding-right: 0.2em; padding-left: 0.2em; }
.font { font-family: 'Jalnan'; }
.ellipsis { overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: var(--ellipsis); -webkit-box-orient: vertical; word-break: keep-all; }


/* color var() */
body {
--theme: #ff5d0d;
--theme2: #ff871d;
--lighter: #FFEBCE;
--light: #FFB06D;
--dark: #B72A06;
--darker: #7A0B02;
/* blue */   --informative: #3667F9;
/* green */  --positive: #44DD60;
/* red */    --negative: #ff0d35;
/* yellow */ --notice: #FFE123;
}
.color { color: var(--theme); }

/* container */
.container { padding: 6em 0; margin-top: 7em; }
.container-tit { text-align: center; margin-bottom: 3em; }
.container-tit h2 { font-size: 2.25em; font-weight: 700; }

/* header */
.header { padding: 0.675em 0; position: fixed; left: 0; top: 0; width: 100%; background-color: #fff; border-bottom: 1px solid #ddd; z-index: 999; }
.header .inner { display: flex; justify-content: space-between; align-items: center; }
.header .logo { width: 7.5%; }
.header .nav { font-size: 1.25em; font-weight: 600; display: flex; align-items: center; }
.header .gnb { display: flex; align-items: center; }
.header .gnb li { margin-right: 2em; padding: 0.5em 0; position: relative; }
.header .gnb li.active,
.header .gnb li:hover { color: var(--theme); }
.header .gnb .lnb { padding: 0.25em 1em; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); text-align: center; background-color: #fff; border: 1px solid var(--theme); white-space: nowrap; -webkit-border-radius: 0.5em;-moz-border-radius: 0.5em;border-radius: 0.5em; font-size: 0.875em; color: #666; font-weight: 400; display: none; }
.header .gnb .lnb li { margin: 0; line-height: 1.8; padding: 0; }
.header .chat { position: relative; }
.header .chat dt { display: flex; align-items: center; padding: 0 1em; height: 2.375em; line-height: 2.375; border-radius: 5em; overflow: hidden; background-color: var(--theme2); color: #fff; position: relative; z-index: 10; cursor: pointer; transition: box-shadow 0.4s; }
.header .chat dt span { margin: 0 0.5em; }
.header .chat dt .xi-angle-down-min { transition: 0.4s; }
.header .chat dd { position: absolute; top: 50%; left: 0; width: 100%; background-color: var(--theme2); color: #fff; padding-top: 1.5em; padding-bottom: 0.5em; border-radius: 0 0 1em 1em; display: none; }
.header .chat dd a { display: block; line-height: 2; padding: 0 1em; opacity: 0.6; font-size: 0.875em; }
.header .chat dd a:hover { opacity: 1; }
.header .chat.open dt { box-shadow: 3px 3px 15px rgba(0,0,0,0.15); }
.header .chat.open dt .xi-angle-down-min { transform: rotate(180deg); }
.header.idx { background-color: transparent; border-bottom: 0; }

/* footer */
.footer { padding: 2em 0 4em; background-color: #222; color: #aaa; text-align: center; }
.footer i { margin: 0 0.5em; font-size: 0.875em; }
.footer .logo { width: 5.5%; margin: auto; }
.footer address { font-size: 1em; margin: 1em 0; line-height: 1.4; }
.footer h6 { font-size: 0.875em; }

/* content */
.bgc { background-color: #fafafa; }
.section { text-align: center; padding: 8em 0; }
.section h2 { font-size: 3.75em; }
.section h3 { font-size: 3em; font-weight: 700; }
.section .tit { margin-bottom: 3em; }
.sub { margin-top: 7em; }
.sub-visual { background: #FFEBCE no-repeat center/cover; }
.sub-visual h3 { color: #fff; text-align: center; }

/* company */
.company .txt { margin: 2em 0; }
.company .txt p { font-size: 1.25em; line-height: 1.6; }
.company .img { display: flex; }
.company .img img { width: 25%; vertical-align: top; }

/* location */
.location li:last-child { margin-bottom: 0 !important; }
.location .list > li { margin-bottom: 5em; }
.location .list h4 { font-size: 1.5em; font-weight: 700; }
.location .list h4::before { content:""; width: 1.5em; height: 0.1em; background-color: #000; display: block; margin: 0 auto 0.675em; }
.location .con { margin-top: 2em; display: flex; align-items: flex-start; justify-content: center; }
.location .con > * { width: 50%; }
.location .map { position: relative; padding-top: 30%; border: 1px solid #ccc; background-color: #fff; }
.location .map iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.location .desc { text-align: left; padding: 1.5em 2em; }
.location .desc li { margin-bottom: 0.5em; display: flex; align-items: flex-start; }
.location .desc .ico { font-size: 1.5em; width: 1.875em; height: 1.875em; line-height: 1.875; text-align: center; background-color: var(--theme); color: #fff; border-radius: 5em; }
.location .desc .ico i { line-height: inherit; }
.location .desc .txt { padding: 0.5em 0.875em; }
.location .desc .txt h5 { font-size: 1.25em; font-weight: 700; }
.location .desc .txt p { font-size: 1.125em; margin-top: 0.5em; }

/* guide */
.guide .list { display: flex; flex-wrap: wrap; justify-content: center; }
.guide .list h5 { font-size: 1.875em; font-weight: 700; }
.guide .list p { font-size: 1.125em; }
.guide .list small { font-size: 0.875em; }

/* merit */
.merit .list li { width: 31.3333%; margin: 1%; padding: 3em 1em; border: 1px solid #ddd; }
.merit .list .ico { max-width: 35%; }
.merit .list .txt h5 { margin: 1em 0 0.25em; }

/* process */
.process { background-color: #fcf3ec; }
.process .list { align-items: center; flex-wrap: nowrap; justify-content: space-between; }
.process .list li:nth-child(odd) { width: 25%; padding-top: 25%; background-color: var(--theme); color: #fff; position: relative; border-radius: 15em; }
.process .list li:nth-child(even) { width: 8%; }
.process .list li:nth-child(even) img { width: 100%; }
.process .list .box { position: absolute; width: 100%; top: 50%; transform: translateY(-50%);}
.process .list .ico { max-width: 27%; }
.process .list .txt span { font-size: 1.25em; margin: 1em 0 0.375em; font-weight: 700; color: var(--light); display: block; }

/* reservation */
.reservation li { width: 31.3333%; margin: 1%; padding: 3em 1em; border: 1px solid #ddd; }
.reservation .ico { width: 2.5em; line-height: 2.5; font-size: 3em; font-style: italic; text-align: center; background-color: #333333; color: #fff; margin: auto; border-radius: 5em; }
.reservation .ico b { margin-left: -0.25em; }
.reservation .txt { margin-top: 1em; }
.reservation .txt p { font-size: 1.25em; }

/* transport */
.transport .con { border: 0.5em solid #eee; padding: 3em 2em; }
.transport .con p { font-size: 1.5em; margin-top: 1em; color: #666; }

/* review */
.review .list { display: flex; flex-wrap: wrap; }
.review .list li { width: 31.333%; margin: 1%; border: 1px solid #ddd; position: relative; -webkit-border-radius: 0.5em;-moz-border-radius: 0.5em;border-radius: 0.5em; }
.review .list .chk_box { position: absolute; left: 0; top: 0; margin: 3%; }
.review .list .thumb { width: 100%; padding-top: 65%; background: no-repeat center/cover; border-radius: 0.5em 0.5em 0 0; }
.review .list .txt { border-top: 1px solid #ddd; padding: 1em; border-radius: 0 0 0.5em 0.5em; background-color: #fff; }
.review .list .txt h5 { font-size: 1.37em; font-weight: 700; }
.review .list .txt .desc { font-size: 1em; margin-top: 0.5em; line-height: 1.4; --ellipsis:4; }
.review .list .txt .info { display: flex; justify-content: space-between; font-size: 0.875em; color: #999; margin-top: 0.675em; }

.review .best { padding: 1em; border-radius: 1em; overflow: hidden; text-align: left; background: url(../img/bg_review_best.png) no-repeat center/cover; display: flex; align-items: center; justify-content: space-around; margin-bottom: 3em; }
.review .best .font { width: 25%; }
.review .best .img { width: 32%; }
.review .best .list { width: 31%; position: relative; display: block; }
.review .best .label { position: absolute; top: -0.5em; left: -0.5em; width: 20%; }

/* store */
.store .list { display: flex; flex-wrap: wrap; text-align: center; }
.store .list li { width: 23%; margin: 1%; position: relative; }
.store .list .chk_box { position: absolute; left: 0; top: 0; margin: 3%; }
.store .list .thumb { width: 100%; padding-top: 65%; background: no-repeat center/cover; }
.store .list .txt { border-top: 1px solid #ddd; padding: 1em; }
.store .list .txt h5 { font-size: 1.25em; font-weight: 700; }

/* main */
.main .visual { padding-top: 13em; background: url(../img/bg_main_visual.png) no-repeat center/cover; }
.main .visual .txt { margin: 2em 0; }
.main .visual .txt p { font-size: 1.25em; line-height: 1.6; }

.latest:nth-child(odd) { background-color: #fafafa; }
.latest-tit { display: flex; justify-content: space-between; align-items: flex-end; padding: 0 0.5em; }
.latest-tit h4 { font-size: 1.875em; font-weight: 700; }
.latest-tit h4::before { content:""; width: 1.5em; height: 0.05em; background-color: #000; margin-bottom: 0.75em; display: block; }
.latest-tit a { background-color: var(--theme2); color: #fff; -webkit-border-radius: 0.3em;-moz-border-radius: 0.3em;border-radius: 0.3em; padding: 0 1em; line-height: 2.4; display: inline-block; }
.latest-con { margin-top: 3em; }

#bo_cate { margin-top: 0 !important; }


.mb { display: none; }
/* responsive */
@media screen and (max-width: 1280px){
    .inner { padding-left: 2%; padding-right: 2%; }
    .header, .footer { font-size: 1.25vw; }
    .main, .sub { font-size: 1.125vw; }
}
@media screen and (max-width: 769px){
    body { font-size: 0.875em; word-break: keep-all; }

    .header, .footer { font-size: 0.875em; }
    .header .chat { position: fixed; right: 3%; bottom: 5%; z-index: 999; }
    .header .gnb li:last-child { margin-right: 0; }

    .main, .sub { font-size: 1em; }

    .sub { margin-top: 5em; }
    .main .visual { padding-top: 10em; }
    .main .visual .font .color { display: block; }
    .main .visual .txt p br { display: none; }

    .company .font .color { display: block; }
    .company .txt p br { display: none; }
    .company .img { flex-wrap: wrap; }
    .company .img img { width: 50%; }

    .location .con { flex-wrap: wrap; }
    .location .con > * { width: 100%; }
    .location .map { padding-top: 45%; }


    .store .list li { width: 48%; }

    .review .best .font { font-size: 2.5em; }
    .review .list li { width: 48%; }

    #bo_v_info .profile_info,
    .bo_v_com { margin: 0.5em 0 !important; }

    .section h2 { font-size: 3.25em; }
    .section h3 { font-size: 2.5em; }

    .merit .list li { width: 48%; }
    .process .list li:nth-child(odd) { width: 28%; padding-top: 28%; -webkit-border-radius: 0.5em;-moz-border-radius: 0.5em;border-radius: 0.5em; }
    .process .list li:nth-child(even) { width: 5%; }

    .guide .list h5 { font-size: 1.5em; }
    .guide .list p { font-size: 1.25em; }
    .guide .list p br { display: none; word-break: keep-all; }
}
@media screen and (max-width: 586px){
    body { font-size: 0.675em; }
    .header .logo { width: 12%; }
    .mb { display: block; }
    .header .gnb.pc { display: none; }
    .header .chat { bottom: auto; right: 12%; font-size: 1.125em; }
    .header .chat dd { padding-top: 1.875em; }

    .sub { margin-top: 4em; }
    .review .best { justify-content: space-between; align-items: flex-start; }

    .review .best .font { width: 50%; }
    .review .best .img { display: none; }
    .review .best .list { width: 50%; }

    .process .list { flex-wrap:wrap; }
    .process .list li:nth-child(odd) { width: 100%; padding: 2em 0; }
    .process .list li:nth-child(even) { width: 6em; height: 9em; margin: auto; transform: rotate(90deg); transform-origin: 50% 50%; text-align: center; display: flex; align-items: center; justify-content: center; }
    .process .list .box { transform: translate(0,0); position: static; }
    .process .list .ico { max-width: 15%; }

    .reservation .list { flex-wrap:wrap; }
    .reservation li { width: 100%; }
    .merit .list li { width: 100%; }

    #bo_cate a { line-height: 1.8 !important; }

    .header .mnb-btn { font-size: 3em; position: relative; z-index: 20; }
    .header .mnb-btn .xi-bars { display: block; }
    .header .mnb-btn .xi-close { display: none; }
    .header .mnb-nav { position: fixed; right: 0; top: 0; width: 100%; height: 100vh; background-color: rgba(0,0,0,0.5); z-index: 15; display: none; }
    .header .mnb-nav .mnb { background-color: #fff; padding: 7em 2em 2em; width: 80%; height: 100vh; position: absolute; right: -80%; top: 0; transition: 0.4s;}
    .header .mnb-nav .mnb > li { margin-bottom: 3em; }
    .header .mnb-nav .mnb > li > a { font-size: 2em; font-weight: 700; }
    .header .mnb-nav .mnb .lnb { padding: 0 1em; }
    .header .mnb-nav .mnb .lnb li { font-size: 1.5em; margin-top: 1em; }

    .header .mnb-btn.open .xi-bars { display: none; }
    .header .mnb-btn.open .xi-close { display: block; }
    .header .mnb.open { right: 0; }
}

@media screen and (max-width: 320px){
    .main,.sub { font-size: 0.875em; }
}