/* 공통 */
.bg-gradation { color: #fff; background: linear-gradient(90deg, var(--main, #C25D99) 0%, var(--blue, #5E7BAF) 100%); } 

.bbs-list-wrap4 .no-data { margin: 0 21px; } 
.no-data { width: 100%; margin: 0 21px; padding: 70px 0; border-top: 2px solid var(--main); border-bottom: 1px solid var(--gray-e5); text-align: center; } 
.no-data p { } 

.cont-tit { position: relative; display: inline-block; font-size: 3.9rem; font-weight: 600; margin-bottom: 30px; color: #222; } 
.cont-tit span { position: absolute; top: -20px; right: -170%; white-space: nowrap; font-family: var(--head-font); font-size: 5rem; font-weight: 500; color: var(--main); opacity: .1; letter-spacing: -2px; } 
.cont-sm-txt { font-size: 1.8rem; font-weight: 400; color: #555; line-height: 1.7; } 
.gr-box { padding: 50px; background: #f9f9f9; } 
.gr-box .tit { font-size: 2rem; color: var(--main); font-weight: 600; } 
.no-bd { border-bottom: none; padding-bottom: 0; } 
@media only screen and (max-width:1400px){
 .cont-tit { font-size: 3.5rem; } 
 }
@media only screen and (max-width:1023px){
 .cont-tit { font-size: 3rem; } 
 .cont-tit span { font-size: 3.5rem; right: -160%; } 
 .gr-box { padding: 30px; } 
 }
@media only screen and (max-width:767px){
 .cont-tit { font-size: 2.6rem; } 
 .cont-tit span { font-size: 2rem; right: -110%; top: unset; bottom: 2px; } 
 }

/********************* 통합검색 ************************/
.total-search .top { margin-bottom: 60px; padding-bottom: 50px; border-bottom: 1px solid var(--gray-e5); } 
.total-search .srch-box { width: 850px; border: 1px solid var(--bd-color); } 

.total-search .tab { flex-wrap: wrap; justify-content: center; } 
.total-search .tab a { white-space: nowrap; } 


.tab-st1 > .tab { display: flex; flex-wrap: wrap; gap: 8px; } 
.tab-st1 > .tab li a { display: block; padding: 10px 25px; font-weight: 500; font-size: 2rem; color: #666; background: #efefef; border-radius: 5px; transition: all .3s; } 
.tab-st1 > .tab li a:hover { color: #fff; background-color: var(--main); border: 2px solid var(--main); } 
.tab-st1 > .tab li.active a { font-weight: 600; color: #fff; background-color: var(--main); } 

.result-wrap { position: relative; } 
.result-wrap + .result-wrap { margin-top: 60px; } 
.result-wrap .title { display: flex; justify-content: space-between; align-items: baseline; padding: 20px 0; border-bottom: 2px solid var(--main); } 
.result-wrap .title strong { font-size: 3rem; } 
.result-wrap .title strong span { font-size: 1.8rem; color: var(--main); } 
.result-wrap .no-result { padding: 40px; border-bottom: 1px solid var(--gray-e5); font-size: 1.8rem; text-align: center; } 

.result-wrap div.result-list { padding: 20px; } 
.result-wrap ul.result-list > li { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 20px; border-bottom: 1px solid var(--gray-e5); } 
.result-wrap ul.result-list > li .lf em { position: relative; display: inline-block; margin-bottom: 15px; padding-left: 14px; font-size: 1.8rem; color: #888; } 
.result-wrap ul.result-list > li .lf em::before { content: ""; position: absolute; left: 0; top: 50%; width: 4px; height: 4px; background-color: var(--main); transform: translateY(-50%); } 
.result-wrap ul.result-list > li .lf a { font-weight: 600; line-height: 1.4; font-size: 2.2rem; color: #666; } 
.result-wrap ul.result-list > li > span { font-size: 1.6rem; color: var(--sub); } 

@media only screen and (max-width: 767px){
 .total-search .tab-st1 > .tab li a { font-size: 1.8rem; } 
.result-wrap .title strong { font-size: 2.5rem; } 

.result-wrap ul.result-list > li { flex-flow: column wrap; align-items: flex-start; } 
.result-wrap ul.result-list > li > span { align-self: flex-end; } 
 }
@media only screen and (max-width: 400px){
 .total-search .tab { flex-flow: column wrap; } 
.total-search .tab li { width: 100%; text-align: center; } 
 }

.result-wrap .more { position: absolute; top: 14px; right: 0; display: flex; align-items: center; gap: 10px; flex-shrink: 0; height: 40px; padding: 0 15px 0 20px; line-height: 40px; font-weight: 600; font-size: 1.8rem; color: var(--main); } 
.result-wrap .more::before { content: ""; position: absolute; left: 0; top: -1px; width: 40px; height: 40px; background-color: var(--main); border-radius: 20px; opacity: 0.1; transition: all 0.3s; } 
.result-wrap .more:hover::before { width: 100%; } 
.result-wrap .more i::before { font-weight: 600 !important; } 

@media only screen and (max-width: 767px){
 .result-wrap .more { justify-content: center; align-items: center; width: 40px; height: 40px; padding: 0; } 
 .result-wrap .more span { display: none; } 
 }
/********************* sub01 ************************/
/** 사업소개 **/
.intro-page { } 
.intro-page .part1 { margin-top: 80px; } 
.intro-page .part1 .top-txt { text-align: center; } 
.intro-page .part1 .top-txt p { line-height: 1.5; font-size: 3.5rem; font-weight: 500; color: #222; word-break: keep-all; } 
.intro-page .part1 .top-txt p strong { font-weight: 700; } 
.intro-page .part1 .deco-txt { font-family: 'montserrat'; font-size: 7rem; font-weight: 800; color: rgba(86, 114, 255, 0.1); text-align: center; transform: translateY(86px); } 
.intro-page .part1 .full-img-wrap { position: relative; margin-top: 70px; } 
.intro-page .part1 .full-img-wrap .img { width: 700px; height: 300px; margin: 0 auto; border-radius: 10px; transform: scale(1); transition: all .1s; -webkit-transition: all 1s; } 
.intro-page .part1 .full-img-wrap.on .img { width: 100%; margin: 0 auto 0; transform: scale(1); transition: all 1s; -webkit-transition: all 1s; } 
.intro-page .part1 .bottom-txt { margin-top: 100px; display: flex; justify-content: center; gap: 10px; } 
.intro-page .part1 .bottom-txt p { line-height: 1.5; font-size: 3.5rem; font-weight: 500; color: #222; word-break: keep-all; text-align: center; } 
.intro-page .part1 .bottom-txt .icn-quote-lf { display: block; width: 20px; height: 20px; background: url(../img/content/icn-quote-lf.svg)no-repeat center center / cover; flex-shrink: 0; } 
.intro-page .part1 .bottom-txt .icn-quote-rg { display: block; width: 20px; height: 20px; background: url(../img/content/icn-quote-rg.svg) no-repeat center center / cover; flex-shrink: 0; } 
.intro-page .part1 .bottom-txt p strong { font-weight: 700; } 
.intro-page .line { display: flex; justify-content: center; width: 1px; height: 60px; background: #b1b1b1; margin: 80px auto; } 
.intro-page .part2 { } 
.intro-page .part2 .tit { display: flex; justify-content: center; gap: 70px; align-items: center; } 
.intro-page .part2 .tit .icn-left { display: block; width: 28px; height: 113px; background: url(../img/content/icn-tit-lf.svg) no-repeat center center / cover; flex-shrink: 0; } 
.intro-page .part2 .tit .icn-right { display: block; width: 28px; height: 113px; background: url(../img/content/icn-tit-rg.svg) no-repeat center center / cover; flex-shrink: 0; } 
.intro-page .part2 .tit p { display: flex; flex-direction: column; align-items: center; width: 270px; overflow: hidden; } 
.intro-page .part2 .tit p strong { display: block; width: 100%; font-size: 4.5rem; font-weight: 500; color: #444; font-family: 'Montserrat'; } 
.intro-page .part2 .tit p span { display: block; width: 100%; font-size: 22px; font-weight: 500; text-align: right; color: #444; margin-top: 10px; } 
.intro-page .part2 .detail-wrap { margin-top: 100px; } 
.intro-page .part2 .detail-wrap p { line-height: 1.5; margin-top: 35px; font-size: 30px; font-weight: 500; color: #222; word-break: keep-all; } 
.intro-page .part2 .detail-wrap p strong { font-weight: 600; } 
.intro-page .part2 .detail-wrap .dt-01 { display: flex; justify-content: space-between; gap: 70px; } 
.intro-page .part2 .detail-wrap .dt-01 .lf { } 
.intro-page .part2 .detail-wrap .dt-01 .lf .img-wrap { border-radius: 10px; max-width: 448px; max-height: 601px; width: 100%; } 
.intro-page .part2 .detail-wrap .dt-01 .rg { display: flex; flex-direction: column; align-items: end; margin-top: 500px; text-align: right; } 
.intro-page .part2 .detail-wrap .dt-01 .rg .img-wrap { border-radius: 10px; max-width: 562px; max-height: 375px; width: 100%; } 
.intro-page .part2 .detail-wrap .dt-02 { text-align: left; margin-top: 70px; } 
.intro-page .part2 .detail-wrap .dt-02 .img-wrap { width: fit-content; border-radius: 10px; } 
.intro-page .part2 .detail-wrap .dt-03 { display: flex; flex-direction: column; align-items: end; text-align: right; margin-top: 70px; } 
.intro-page .part2 .detail-wrap .dt-03 .img-wrap { width: fit-content; border-radius: 10px; } 
.intro-page .part3 { margin-top: 100px; } 
.intro-page .part3 .tit-wrap { } 
.intro-page .part3 .tit-wrap span { display: block; font-family: 'Montserrat'; font-style: normal; font-weight: 600; font-size: 20px; color: var(--main); } 
.intro-page .part3 .tit-wrap p { font-size: 4rem; font-weight: 600; margin-top: 10px; } 
.intro-page .part3 .bottom-cont { display: flex; gap: 60px; margin-top: 40px; } 
.intro-page .part3 .bottom-cont .lf { width: 50%; } 
.intro-page .part3 .bottom-cont .lf .img-wrap { width: 100%; height: 100%; border-radius: 10px; } 
.intro-page .part3 .bottom-cont .lf .img-wrap img { width: 100%; height: 100%; object-fit: cover; } 
.intro-page .part3 .bottom-cont .rg { width: calc(100% - 50% - 50px); } 
.intro-page .part3 .bottom-cont .rg .project-list { display: flex; flex-wrap: wrap; } 
.intro-page .part3 .bottom-cont .rg .project-list li { position: relative; flex: 1 1 50%; display: flex; flex-direction: column; align-items: center; gap: 20px; padding: 30px; border-bottom: 1px solid #e5e5e5; } 
.intro-page .part3 .bottom-cont .rg .project-list li:nth-child(odd)::before { content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 1px; height: 100px; background: #e5e5e5; } 
.intro-page .part3 .bottom-cont .rg .project-list li i { display: block; width: 50px; height: 50px; } 
.intro-page .part3 .bottom-cont .rg .project-list li strong { display: block; line-height: 1.5; font-size: 2.2rem; font-weight: 500; color: #444; text-align: center; } 

@media only screen and (max-width: 1300px){
 .intro-page .part3 .bottom-cont { flex-direction: column; gap: 0; } 
.intro-page .part3 .bottom-cont .lf { width: 100%; } 
.intro-page .part3 .bottom-cont .rg { width: 100%; } 
 }
@media only screen and (max-width: 1023px){
 .intro-page .part1 { margin-top: 0; } 
.intro-page .part1 .top-txt p { font-size: 3rem; } 
.intro-page .part1 .top-txt p br { display: none; } 
.intro-page .part1 .deco-txt { font-size: 4.5rem; transform: unset; } 
.intro-page .part1 .full-img-wrap { margin-top: 0; } 
.intro-page .part2 .detail-wrap .dt-01 { gap: 50px; } 
.intro-page .part2 .tit p { width: 170px; } 
.intro-page .part2 .tit p strong { font-size: 3.5rem; } 
 }
@media only screen and (max-width: 767px){
 .intro-page .part1 .top-txt p { font-size: 2.5rem; } 
.intro-page .part1 .bottom-txt p { font-size: 2.5rem; } 

.intro-page .part2 .detail-wrap .dt-01 { flex-direction: column; } 
.intro-page .part2 .detail-wrap .dt-01 .rg { margin-top: 40px; } 
.intro-page .part2 .detail-wrap .dt-01 .lf .img-wrap { width: 100%; height: 279px; } 
.intro-page .part2 .detail-wrap .dt-01 .lf .img-wrap img { width: 100%; height: 100%; object-fit: cover; } 
.intro-page .part2 .detail-wrap .dt-01 .rg .img-wrap { width: 100%; height: 279px; } 
.intro-page .part2 .detail-wrap .dt-01 .rg .img-wrap img { width: 100%; height: 100%; object-fit: cover; } 
.intro-page .part2 .detail-wrap .dt-02 { margin-top: 40px; } 
.intro-page .part2 .detail-wrap .dt-03 { margin-top: 40px; } 
.intro-page .part2 .tit .icn-left { width: 15px; height: 75px; } 
.intro-page .part2 .tit .icn-right { width: 15px; height: 75px; } 
.intro-page .part2 .detail-wrap p { font-size: 2.4rem; } 

.intro-page .line { margin: 50px auto; } 

.intro-page .part3 { margin-top: 50px; } 
.intro-page .part3 .tit-wrap span { font-size: 16px; } 
.intro-page .part3 .tit-wrap p { font-size: 3rem; } 
.intro-page .part3 .bottom-cont { margin-top: 30px; } 
.intro-page .part3 .bottom-cont .rg .project-list li strong { font-size: 1.9rem; } 
 }
@media only screen and (max-width: 480px){
 .intro-page .part3 .bottom-cont .rg .project-list li { flex: 1 1 100%; } 
.intro-page .part3 .bottom-cont .rg .project-list li:nth-child(odd)::before { content: none; } 
.intro-page .part2 .tit { gap: 30px; } 
 }
/************************************** 블루리본 선정 맛집_상세 **************************************/

/* -------------------
 이미지 스와이퍼
------------------- */
.res-img { overflow: hidden; width: 500px; height: 438px; border-radius: .5rem; } 
.res-img .swiper-slide img { display: block; object-fit: cover; width: 100%; height: 100%; } 

@media only screen and (max-width:1400px){
 .res-img { width: 400px; } 
 }
@media only screen and (max-width:1200px){
 .res-img { overflow: hidden; width: 100%; max-width: 100%; height: 360px; border-radius: 20px; } 
 }

/* -------------------
 bbs 가게정보
------------------- */
.bbs-blue-right { width: calc(100% - 550px); } 
.bbs-blue-right .hotel-list { padding-top: 30px; border-top: 2px solid var(--main); } 
.bbs-top-wrap { display: flex; gap: 50px; } 

.bbs-list-wrap4.blu { flex-direction: column; gap: 45px; margin: 0; } 
.hotel-list {  } 
.bbs-list-wrap4.blu .gallery-item.blu { width: 100%; margin-bottom: 0; padding: 0; } 
.bbs-list-wrap4.blu .gallery-item.blu .tit { position: relative; justify-content: space-between;} 
.bbs-list-wrap4.blu .gallery-item.blu .tit::after {content: ""; display: block; width: 60px; height: 40px; background: url(../img/common/blue-ribbon.svg) no-repeat center / contain;} 
.bbs-list-wrap4.blu .gallery-item.blu .txt-wrap .tit span { color: #B1B1B1; } 

.bbs-tags { margin-top: 15px; color: var(--main); } 
.bbs-tags a { font-size: 1.8rem; } 

.bbs-options { display: flex; gap: 8px; } 
.bbs-options .bbs-card { display: flex; flex-direction: column; padding: 18px; border: 1px solid #ddd; border-radius: .3rem; } 
.bbs-options .bbs-card .icon img { width: 16px; height: 16px; object-fit: contain; } 
.bbs-options .card-content { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 10px; word-break: keep-all; } 
.bbs-options .status { margin-top: 10px; color: var(--main); font-size: 1.8rem; } 

/* 한중일양 구분 카테고리 */
.res-cate { display: inline-block; padding: 4px 10px; color: #fff; border-radius: 5px; font-weight: 500; background: var(--main); } 


@media only screen and (max-width:1640px){
 .bbs-list-wrap4.blu { gap: 35px; } 
 .bbs-list-wrap4.blu .gallery-item.blu .txt-wrap .hotel-list { padding-top: 20px; margin-top: 20px; } 
 .bbs-list-wrap4.blu .gallery-item.blu .txt-wrap .tit span { display: block; } 
 }
@media only screen and (max-width:1504px){
 .bbs-list-wrap4.blu { gap: 20px; } 

 .bbs-options { gap: 20px; } 
 .bbs-options .card-content { flex-wrap: wrap; } 
 .bbs-options .bbs-card { padding: 17px 18px; } 
 .bbs-options .status { margin-top: 2px; } 
 }
@media only screen and (max-width:1412px){
 .bbs-options { gap: 15px; } 
 }
@media only screen and (max-width:1400px){
 .bbs-list-wrap4.blu { gap: 40px; } 
 .bbs-blue-right { width: calc(100% - 450px); } 
 }
@media only screen and (max-width:1330px){
 .bbs-options { display: flex; gap: 20px; } 
 .bbs-options .bbs-card { display: flex; flex-direction: column; align-items: flex-start; padding: 12px 15px 8px 15px; } 
 .bbs-options .card-content { flex-direction: column; align-items: flex-start; gap:9px; margin-bottom: 0; word-break: keep-all; } 
 .bbs-options .status { margin-top: 7px; color: var(--main); font-size: 1.8rem; } 
 }
@media only screen and (max-width:1200px){
 .bbs-blue-right { width:100%; } 
 .bbs-top-wrap { flex-direction: column; } 
 .bbs-list-wrap4.blu { gap: 20px; } 

 .bbs-options { display: flex; flex-wrap: wrap; flex-direction: row; gap: 18px; } 
 .bbs-options .bbs-card { padding:15px 20px 10px 20px; } 
 .bbs-options .card-content { display: flex; } 
 .bbs-options .status { color: var(--main); font-size: 1.8rem; } 
 }
@media only screen and (max-width:639px){
 .bbs-list-wrap4.blu .gallery-item.blu .txt-wrap .tit span { display: block; } 
 .bbs-list-wrap4.blu .gallery-item.blu .tit { font-size: 2.5rem; } 
/*  .bbs-list-wrap4.blu .gallery-item.blu .tit::after {width: 31px; height: 42px; }  */
 .bbs-list-wrap4.blu .gallery-item.blu .txt-wrap .tit span { font-size: 2rem; } 
 }
 @media only screen and (max-width:502px){
 .bbs-options { flex-direction: column; gap: 8px; } 
 .bbs-options .bbs-card { flex-direction: row; justify-content: center; } 
 .bbs-options .card-content { flex-direction: row; gap: 13px; } 
 .bbs-options .status { margin-top: 0; margin-left: 8px; } 
 }

/* -------------------
 설명
------------------- */
.bbs-description { margin: 40px 0; } 
.bbs-description img { width: 100%; height: 100%; object-fit: cover; } 
.bbs-description p { line-height: 1.5; } 

/* -------------------
 지도
------------------- */
.map-wrap.blu { margin-bottom: 50px; padding-top: 50px; border-top: 1px solid var(--bd-color); } 

/* -------------------
 블로그 리뷰
------------------- */
.bbs-blog-reviews { margin-bottom: 50px; } 
.bbs-blog-reviews h3 { margin-bottom: 15px; font-size: 3rem; font-weight: 600; } 
.bbs-review-list { display: flex; margin: 0 -15px; flex-wrap: wrap; } 
.bbs-review-list li { width: 33.3%; padding: 0 15px; } 
.bbs-review-list li a { display: block; width: 100%; height: 100%; } 
.bbs-review { display: flex; flex-direction: column; padding: 30px; width: 33.3%; border: 1px solid #E5E5E5; transition: 0.2s; } 
.bbs-review:hover { background: #fff; box-shadow: 0 2px 6px rgba(0,0,0,0.1); } 
.bbs-review h4 { margin-bottom: 30px; font-size: 2rem; font-weight: 500; } 
.bbs-review p { margin-bottom: 20px; color: #555; line-height: 1.5; } 
.bbs-review span { position: relative; margin-left: auto; margin-top: auto; padding-left: 35px; } 
.bbs-review span::before { position: absolute; content: ""; top: 0; left: 0; width: 25px; height: 24px; background-position: center center; background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.6677 0H3.3478C1.50341 0 0 1.55407 0 3.46061V14.7076C0 16.6142 1.50341 18.1682 3.3478 18.1682H9.81091L12.0118 23.5354C12.0118 23.5354 12.1668 24 12.5232 24C12.8952 24 13.0347 23.5354 13.0347 23.5354L15.2356 18.1682H21.6522C23.4966 18.1682 25 16.6142 25 14.7076V3.46061C25 1.55407 23.4966 0 21.6522 0M7.85803 9.93324C7.85803 11.984 5.79665 12.0481 5.79665 12.0481C5.0062 12.0481 4.55673 11.5033 4.55673 11.5033V11.8718H3.05332V5.49533C3.14631 5.51135 4.55673 5.49533 4.55673 5.49533V7.93057C4.91321 7.30574 5.92064 7.32176 5.92064 7.32176C8.13701 7.53004 7.85803 9.93324 7.85803 9.93324ZM10.4929 7.51402V11.8879H9.02046V7.56208C9.02046 6.96929 8.3075 6.80908 8.3075 6.80908V5.28705C10.6479 5.38318 10.4774 7.51402 10.4774 7.51402M13.9647 12.0481C12.6007 12.0481 11.5158 11.0067 11.5158 9.70895C11.5158 8.41121 12.6162 7.36983 13.9647 7.36983C15.3131 7.36983 16.4135 8.41121 16.4135 9.70895C16.4135 11.0067 15.3131 12.0481 13.9647 12.0481ZM21.9932 12.0481C21.9932 12.0481 22.0087 14.275 19.8388 14.275H19.1723V12.8331H19.5753C19.5753 12.8331 20.4898 12.9132 20.4743 11.4553C20.4743 11.4553 20.2883 12.0481 19.0019 12.0481C19.0019 12.0481 17.173 11.9199 17.173 10.0774V9.3725C17.173 9.3725 17.2195 7.46595 19.2188 7.30574C19.2188 7.30574 20.0093 7.22563 20.4898 7.89853V7.43391H21.9777V12.0481H21.9932Z' fill='%2336B44A'/%3E%3Cpath d='M5.45567 8.8497C4.9752 8.8497 4.58772 9.25023 4.58772 9.74689C4.58772 10.2436 4.9752 10.6441 5.45567 10.6441C5.93614 10.6441 6.32362 10.2436 6.32362 9.74689C6.32362 9.25023 5.93614 8.8497 5.45567 8.8497Z' fill='%2362BC47'/%3E%3Cpath d='M13.9647 8.75351C13.4532 8.75351 13.0347 9.18637 13.0347 9.71543C13.0347 10.2445 13.4532 10.6774 13.9647 10.6774C14.4761 10.6774 14.8946 10.2445 14.8946 9.71543C14.8946 9.18637 14.4761 8.75351 13.9647 8.75351Z' fill='%2362BC47'/%3E%3Cpath d='M19.6683 8.78557C19.1724 8.78557 18.7694 9.20213 18.7694 9.71481C18.7694 10.2275 19.1724 10.644 19.6683 10.644C20.1643 10.644 20.5673 10.2275 20.5673 9.71481C20.5673 9.20213 20.1643 8.78557 19.6683 8.78557Z' fill='%2362BC47'/%3E%3C/svg%3E%0A"); } 


@media only screen and (max-width:1300px){
 .bbs-review { padding: 20px; } 
 }
@media only screen and (max-width:1024px) { } 
@media only screen and (max-width:767px){
 .bbs-blog-reviews { margin-bottom: 50px; } 
 .bbs-blog-reviews h3 { font-size: 2.5rem; } 
.bbs-review-list li { width: 100%; } 
.bbs-review-list li + li { margin-bottom: 20px; } 
 .bbs-review { padding: 25px; width: auto; max-width: 100%; } 
 }

/************************************** 블루리본 선정 맛집_상세 **************************************/
.night-picnic-wrap { } 
.night-picnic-wrap .title-box { display: flex; flex-direction: column; gap: 30px; padding: 40px; background: url(../img/content/night-picnic-bg.png) no-repeat center center / cover; border-radius: 10px; } 
.night-picnic-wrap .title-box i { display: block; width: 30px; height: 30px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' fill='none'%3E%3Cpath fill='%23fff' d='M13.125 13.125V26.25H0V12.937c0-9 8.438-10.124 8.438-10.124l1.124 2.624S5.813 6 5.063 9c-.75 2.25.75 4.125.75 4.125h7.313Zm16.875 0V26.25H16.875V12.937c0-9 8.438-10.124 8.438-10.124l1.125 2.624S22.688 6 21.938 9c-.75 2.25.75 4.125.75 4.125H30Z' opacity='.5'/%3E%3C/svg%3E"); } 
.night-picnic-wrap .title-box .tit {  } 
.night-picnic-wrap .title-box .detail-txt { color: rgba(255, 255, 255, .8); font-size: 25px; font-weight: 500; line-height: 1.4; } 
.night-picnic-wrap .tit-wrap { display: flex; gap: 10px; align-items: center; font-size: 28px; font-weight: 600; color: #222; flex-wrap: wrap; } 
.night-picnic-wrap .tit-wrap .line-tit { position: relative; } 
.night-picnic-wrap .tit-wrap .line-tit::before { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 15px; background: var(--main); opacity: .2; } 



.night-picnic-wrap .tab-wrap { display: flex; } 
.night-picnic-wrap .tab-wrap { } 
.night-picnic-wrap .tab-wrap li { flex: 1; text-align: center; } 
.night-picnic-wrap .tab-wrap li a { display: block; width: 100%; height: 100%; padding: 15px; border-bottom: 1px solid var(--main); font-weight: 500; color: #777; word-break: keep-all; } 
.night-picnic-wrap .tab-wrap li a.on { border: 1px solid var(--main); border-bottom: none; color: var(--main); font-weight: 600; } 

.night-picnic-wrap .tab-cont { } 
.night-picnic-wrap .tab-cont img { width: 100%; } 

.night-picnic-wrap .tab-conts .no-cont img { max-width: 500px; } 
.night-picnic-wrap .tab-conts .no-cont p { font-size: 2rem; } 

@media only screen and (max-width: 767px){
 .night-picnic-wrap .title-box { padding: 30px; } 
.night-picnic-wrap .title-box .tit { font-size: 25px; } 
.night-picnic-wrap .title-box .detail-txt { font-size: 18px; } 
 }


/********************* sub02 ************************/
/* 음식점 찾기 */
.find-wrap { } 
.find-wrap .bg-box { gap: 40px; } 
.find-wrap .bg-box .lf { } 
.find-wrap .bg-box .lf .tit { color: var(--main); word-break: keep-all; line-height: 1.4; } 
.find-wrap .bg-box .lf .main-txt { font-weight: 500; margin-bottom: 20px; font-size: 2rem; color: var(--sub); line-height: 1.4; word-break: keep-all; } 
.find-wrap .bg-box .lf .txt { font-weight: 500; font-size: 16px; word-break: keep-all; line-height: 1.4; } 
.find-wrap .bg-box .rg { width: fit-content; } 
.find-wrap .bg-box .rg img { width: 200px; } 
@media only screen and (max-width: 1400px){
 .find-wrap .bg-box .rg img { width: 150px; } 
 }
@media only screen and (max-width: 1023px){
 .find-wrap .bg-box .lf .main-txt { font-size: 1.8rem; } 
.find-wrap .bg-box .rg img { width: 100px; } 
 }
 @media only screen and (max-width: 767px){
 .find-wrap .bg-box { flex-direction: column-reverse; } 
.find-wrap .bg-box { gap: 20px; } 
.find-wrap .bg-box .rg img { width: 80px; } 
.find-wrap .bg-box .lf .main-txt { font-size: 16px; } 
.find-wrap .bg-box .lf .txt { font-size:14px; } 
 }
/********************* sub03 ************************/
/* 여행코스 상세 */
.bbs-box { width: 100%; height: 350px; border: 1px solid #ededed; margin-bottom: 50px; } 

.course-box { } 
.course-box ul { position: relative; display: flex; flex-wrap: wrap; justify-content: center; padding-bottom: 50px; margin: 20px -20px 0; } 
.course-box ul::before { content: ""; position: absolute; top: 196px; left: 50%; transform: translate(-50%); width: calc(100% - 40px); height: 1px; background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%238F9FC8' stroke-width='2' stroke-dasharray='2%2c 8' stroke-dashoffset='0' stroke-linecap='round'/%3e%3c/svg%3e"); } 
.course-box ul:nth-child(2)::before { content: ""; position: absolute; top: 152px; left: 50%; transform: translate(-50%); width: calc(100% - 40px); height: 1px; background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%238F9FC8' stroke-width='2' stroke-dasharray='2%2c 8' stroke-dashoffset='0' stroke-linecap='round'/%3e%3c/svg%3e"); } 
.course-box ul li { flex: 0 0 calc(100% / 6); position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 1rem; padding: 0 20px; font-size: 1.8rem; font-weight: 500; color: #444; } 
.course-box ul li .mark { flex-shrink: 0; padding: 6px 20px; font-size: 16px; font-weight: 600; color: #fff; background: var(--main); border-radius: 50px; } 
.course-box ul li .top { position: relative; width: fit-content;} 
.course-box ul li .top::after { content: ""; position: absolute; top: 89%; left: 50%; transform: translateX(-50%); width: 20px; height: 20px; background: url("data:image/svg+xml,%3Csvg width='21' height='20' viewBox='0 0 21 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.9641 18C12.4245 20.6667 8.5755 20.6667 7.0359 18L0.540708 6.74999C-0.998892 4.08333 0.92561 0.749998 4.00481 0.749998L16.9952 0.749999C20.0744 0.749999 21.9989 4.08333 20.4593 6.75L13.9641 18Z' fill='%23DCE6FF'/%3E%3C/svg%3E%0A") no-repeat center center / cover; z-index: -1; }
.course-box ul li .top .img-wrap { width: 120px; height: 120px; border-radius: 100px; border: 7px solid var(--light-main); } 
.course-box ul li p { position: relative; line-height: 1.2; margin-top: 15px; padding-top: 40px; font-size: 2rem; font-weight: 600; color: #222; text-align: center; white-space: nowrap;} 
.course-box ul li.start p::before { content:"출발"; position: absolute; top: -20px; right: calc(100% + 64px); width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; font-weight: 500; font-size: 16px; color: var(--main); background: #fff; border: 2px solid var(--main); border-radius: 100%; white-space: nowrap; } 
.course-box ul li.end p::before { content:"도착"; position: absolute; top: -20px; left: calc(100% + 64px); width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; font-weight: 500; font-size: 16px; color: var(--main); background: #fff; border: 2px solid var(--main); border-radius: 100%; white-space: nowrap; } 
.course-box ul li p::after { content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 15px; height: 15px; border-radius: 10px; background: var(--main); border: 3px solid var(--light-main); } 

.course-info-box { display:flex; align-items: center; padding: 30px; border: 1px solid var(--bd-color); border-radius: 1rem; } 
.course-info-box + .course-info-box { margin-top: 30px; } 
.course-info-box .img-slide-box { width: 40%; border-radius: 10px; margin-right: 50px; } 
.course-info-box .img-slide-box .swiper-slide { height: 300px; } 
.course-info-box .img-slide-box .swiper-slide img { width: 100%; height: 100%; object-fit: cover; } 

/* .course-info-box .info-box { width: calc(100% - 40% ); }  */
.course-info-box .info-box .txt-24 { position: relative; } 
.course-info-box .info-box .txt-24::before { content: ""; position: absolute; top: 0; left: 0; width: 40px; height: 3px; background: var(--main); opacity: .6; } 
.course-info-box .info-box .info-txt {  } 
.course-info-box .info-box .info-box-list { margin-top: 30px; } 
.course-info-box .info-box .info-box-list li { display: flex; align-items: center; gap: 10px; } 
.course-info-box .info-box .info-box-list li + li { margin-top: 8px; } 
.course-info-box .info-box .info-box-list li em { display: inline-block; width: 110px; font-size: 15px; font-weight: 500; padding: 5px 15px; border: 1px solid var(--main); color: var(--main); border-radius: 100px; text-align: center; } 
.course-info-box .info-box .info-box-list li a, .course-info-box .info-box .info-box-list li span { font-size: 1.7rem; font-weight: 500; } 

@media only screen and (max-width:1500px){
	.course-box ul { margin: 20px -10px 0; }
	.course-box ul::before { top: 170px; }
	.course-box ul:nth-child(2)::before {top: 132px;}
	.course-box ul li { padding: 0 10px; }
	.course-box ul li .mark { padding: 4px 15px; font-size: 15px; }
	.course-box ul li .top .img-wrap { width: 100px; height: 100px; border-width: 5px; }
	.course-box ul li p { padding-top: 30px; font-size: 17px; }
	.course-box ul li.start p::before { right: calc(100% + 45px); width: 50px; height: 50px; font-size: 14px; }
	.course-box ul li.end p::before { left: calc(100% + 45px); width: 50px; height: 50px; font-size: 14px; }
}
@media only screen and (max-width:800px){
	.course-box { margin-bottom: 120px; } 
	.course-box ul { flex-direction: column; align-items: usnet; gap: 10px; padding-bottom: unset; margin: 0; } 
	.course-box ul::before { width: 1px; height: 100%; top: 0; left: 0; } 
	.course-box ul:nth-child(2)::before {width: 1px; height: calc(100% + 40px); top: 0; left: 0;}
	.course-box ul li { position: relative; gap: 1rem; flex-direction: row; justify-content: flex-start; align-items: center; margin-top: 20px; padding-left: 10px; } 	
	.course-box ul li::before { content: ""; position: absolute; top: 50%; left: -9px; transform: translateY(-50%); width: 15px; height: 15px; border-radius: 10px; background: var(--main); border: 3px solid var(--light-main); } 
	.course-box ul li .top::after { top: 38%; left: -11px; transform: rotate(90deg); } 
	.course-box ul li .top .img-wrap { width: 80px; height: 80px; border-width: 3px; }
	.course-box ul li p { margin-top: 0; padding-top: 0; text-align: left; } 
	.course-box ul li p::after { display: none; } 
	.course-box ul li.start p::before {top: -80px; right: 420%; width: fit-content; height: fit-content; padding: 6px 12px; border-radius: 30px;}
	.course-box ul li.end p::before {top: 80px; left: -200%; width: fit-content; height: fit-content; padding: 6px 12px; border-radius: 30px;}
 }
/********************* sub04 ************************/
/* 숙박정보 상세 */
.hotel-view { } 
.hotel-view .hotel-detail-box { padding: 30px; background: #f7f7f7; } 
.hotel-view .hotel-detail-box .tit-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 2px solid var(--main); } 
.hotel-view .hotel-detail-box .tit-top .tit { display: flex; gap: 10px; align-items: flex-end; color: #222; line-height: 1; font-size: 3rem; font-weight: 600; } 
.hotel-view .hotel-detail-box .tit-top .tit .eng-tit { color: #b1b1b1; font-size: 2.5rem; font-weight: 600; } 
.hotel-view .hotel-detail-box .tit-top .star { font-size: 2.2rem; color: var(--main); } 
.hotel-view .hotel-detail-box .tit-top .star img { width: 20px; } 
.hotel-view .hotel-detail-box .tit-top .text { font-weight: 600 } 
.hotel-view .hotel-detail-box .tit-top i { display: block; width: 30px; height: 30px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='35' height='41' viewBox='0 0 35 41' fill='none'%3E%3Cg clip-path='url(%23clip0_289_615)'%3E%3Cpath d='M0 41H7.00518V31.7884H13.9553V41H20.9605V0L0 5.7882V41ZM13.3338 8.18842H17.9662V12.7926H13.3338V8.18842ZM13.3338 16.1999H17.9662V20.8073H13.3338V16.1999ZM13.3338 24.2081H17.9662V28.8155H13.3338V24.2081ZM2.99436 8.18842H7.62671V12.7926H2.99436V8.18842ZM2.99436 16.1999H7.62671V20.8073H2.99436V16.1999ZM2.99436 24.2081H7.62671V28.8155H2.99436V24.2081Z' fill='%233169F7'/%3E%3Cpath d='M22.3232 2.28809V41.0005H34.9999V5.78867L22.3232 2.28809ZM32.0088 28.816H27.3764V24.2086H32.0088V28.816ZM32.0088 20.8045H27.3764V16.1971H32.0088V20.8045ZM32.0088 12.7931H27.3764V8.18889H32.0088V12.7931Z' fill='%233169F7'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_289_615'%3E%3Crect width='35' height='41' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat center center / contain; } 
.hotel-view .hotel-detail-box .img-slide-box .hotel-img { position: relative; } 
.hotel-view .hotel-detail-box .img-slide-box .hotel-img .swiper-wrapper .swiper-slide { width: fit-content; height: 100%; } 
.hotel-view .hotel-detail-box .img-slide-box .hotel-img .swiper-wrapper .swiper-slide img { width: 100%; height: 100%; max-height: 400px; object-fit: cover; } 
.hotel-view .hotel-detail-box .img-slide-box .hotel-img .swiper-control { display: flex; gap: 10px; width: fit-content; margin: 20px auto 0; padding: 10px 20px; border-radius: 100px; background: rgba(0, 0, 0, 0.3); } 
.hotel-view .hotel-detail-box .img-slide-box .hotel-img .swiper-control a { display: block; text-align: center; } 
.hotel-view .hotel-detail-box .img-slide-box .hotel-img .swiper-control .swiper-pagination { width: fit-content; } 

.swiper-btn { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); display: flex; gap: 10px; width: fit-content; margin: 20px auto 0; padding: 5px 8px; border-radius: 100px; background: rgba(0, 0, 0, 0.70); z-index: 1; } 
.swiper-btn a { display: block; text-align: center; } 
.swiper-btn .swiper-pagination { position: relative; bottom: unset; display: flex; align-items: center; gap: 4px; font-size: 16px; font-weight: 600; } 
.swiper-btn .swiper-paging { display: flex; align-items: center; gap: 15px; color: #fff; } 
.swiper-btn .swiper-paging a { } 
.swiper-btn .swiper-paging a i { display: block; width: 20px; height: 20px; } 
/* .swiper-btn .swiper-paging a.swiper-prev-btn i { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='21' viewBox='0 0 20 21' fill='none'%3E%3Cpath d='M12.5 15.1104L7.5 10.1104L12.5 5.11035' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")no-repeat center center; }  */
.swiper-btn .swiper-paging a.swiper-next-btn i { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='21' viewBox='0 0 20 21' fill='none'%3E%3Cpath d='M7.5 15.1104L12.5 10.1104L7.5 5.11035' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center center; } 
.swiper-btn a.swiper-button-disabled i { opacity: 0.4; } 

.hotel-view .hotel-detail-box .info-list li { display: flex; gap: 12px; padding-bottom: 15px; border-bottom: 1px solid var(--bd-color); } 
.hotel-view .hotel-detail-box .info-list li + li { margin-top: 15px; } 
.hotel-view .hotel-detail-box .info-list li em { display: flex; gap: 10px; align-items: center; color: #222; font-weight: 600; } 
.hotel-view .hotel-detail-box .info-list li em i { display: block; width:18px; height: 18px; } 
.hotel-view .hotel-detail-box .info-list li em i.loca { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='19' viewBox='0 0 14 19' fill='none'%3E%3Cpath d='M7 18.5C7 18.5 14 12.1033 14 7.25C14 5.45979 13.2625 3.7429 11.9497 2.47703C10.637 1.21116 8.85651 0.5 7 0.5C5.14348 0.5 3.36301 1.21116 2.05025 2.47703C0.737498 3.7429 2.76642e-08 5.45979 0 7.25C0 12.1033 7 18.5 7 18.5ZM7 10.625C6.07174 10.625 5.1815 10.2694 4.52513 9.63649C3.86875 9.00355 3.5 8.14511 3.5 7.25C3.5 6.35489 3.86875 5.49645 4.52513 4.86351C5.1815 4.23058 6.07174 3.875 7 3.875C7.92826 3.875 8.8185 4.23058 9.47487 4.86351C10.1313 5.49645 10.5 6.35489 10.5 7.25C10.5 8.14511 10.1313 9.00355 9.47487 9.63649C8.8185 10.2694 7.92826 10.625 7 10.625Z' fill='%233169F7'/%3E%3C/svg%3E") no-repeat center center / 14px; } 
.hotel-view .hotel-detail-box .info-list li em i.tel { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='15' viewBox='0 0 18 15' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.12109 0.946419C2.31793 0.79354 2.55429 0.674946 2.81451 0.598495C3.07473 0.522044 3.35287 0.489483 3.6305 0.502969C3.90812 0.516456 4.17889 0.575681 4.42486 0.676722C4.67083 0.777762 4.88639 0.91831 5.05725 1.08905L7.07656 3.10689C7.44667 3.47704 7.57717 3.95918 7.43092 4.4142L6.81557 6.33054C6.78397 6.42981 6.7858 6.53373 6.82088 6.63228C6.85595 6.73084 6.92309 6.8207 7.01581 6.89319L9.77985 9.04317C9.87316 9.11543 9.98888 9.16774 10.1158 9.19503C10.2427 9.22232 10.3765 9.22366 10.5043 9.19892L12.9669 8.72028C13.2556 8.66446 13.5568 8.66026 13.8479 8.708C14.139 8.75574 14.4124 8.85418 14.6476 8.99591L17.2417 10.5657C18.1743 11.1301 18.2598 12.2021 17.4251 12.8505L16.2619 13.7553C15.4294 14.4028 14.1852 14.6872 13.0254 14.3695C10.0562 13.558 7.36066 12.236 5.13937 10.5019C2.91011 8.77431 1.21049 6.67791 0.167025 4.3687C-0.240213 3.46741 0.125401 2.49874 0.957875 1.85121L2.12109 0.946419Z' fill='%233169F7'/%3E%3C/svg%3E")no-repeat center center / 16px; } 
.hotel-view .hotel-detail-box .info-list li em i.page { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='17' viewBox='0 0 14 17' fill='none'%3E%3Cpath d='M5.38462 15.9286V11.9231C5.38462 11.6432 5.65385 11.3575 5.92308 11.3575H8.07692C8.34615 11.3575 8.61539 11.6432 8.61539 11.9289V15.9286C8.61539 16.0802 8.67212 16.2255 8.7731 16.3326C8.87408 16.4398 9.01104 16.5 9.15385 16.5H13.4615C13.6043 16.5 13.7413 16.4398 13.8423 16.3326C13.9433 16.2255 14 16.0802 14 15.9286V7.92912C14.0001 7.85403 13.9863 7.77965 13.9593 7.71024C13.9323 7.64083 13.8927 7.57773 13.8428 7.52457L12.3846 5.97839V2.2152C12.3846 2.06366 12.3279 1.91832 12.2269 1.81116C12.1259 1.70401 11.989 1.64381 11.8462 1.64381H10.7692C10.6264 1.64381 10.4895 1.70401 10.3885 1.81116C10.2875 1.91832 10.2308 2.06366 10.2308 2.2152V3.69282L7.38123 0.667868C7.33121 0.614656 7.27179 0.572438 7.20638 0.543633C7.14096 0.514827 7.07083 0.5 7 0.5C6.92917 0.5 6.85904 0.514827 6.79363 0.543633C6.72821 0.572438 6.66879 0.614656 6.61877 0.667868L0.157232 7.52457C0.10726 7.57773 0.0676532 7.64083 0.0406745 7.71024C0.0136957 7.77965 -0.000125515 7.85403 8.58841e-07 7.92912V15.9286C8.58841e-07 16.0802 0.0567314 16.2255 0.157713 16.3326C0.258694 16.4398 0.395653 16.5 0.538462 16.5H4.84615C4.98896 16.5 5.12592 16.4398 5.2269 16.3326C5.32789 16.2255 5.38462 16.0802 5.38462 15.9286Z' fill='%233169F7'/%3E%3C/svg%3E")no-repeat center center / 14px; } 
.hotel-view .hotel-detail-box .info-list li p { color: #444; font-weight: 500; } 
.hotel-view .hotel-detail-box .hotel-info { display: flex; } 
.hotel-view .hotel-detail-box .hotel-info li { display: flex; gap: 15px; align-items: center; width: 50%; } 
.hotel-view .hotel-detail-box .hotel-info li:last-child { position: relative; padding-left: 60px; } 
.hotel-view .hotel-detail-box .hotel-info li:last-child::before { content: ""; position: absolute; top: 50%; left: 30px; transform: translateY(-50%); width: 1px; height: 50px; background: #d9d9d9; } 
.hotel-view .hotel-detail-box .hotel-info li strong { font-size: 4rem; font-weight: 600; color: var(--main); } 
.hotel-view .hotel-detail-box .hotel-info li p { display: flex; flex-direction: column; gap:6px; } 
.hotel-view .hotel-detail-box .hotel-info li p i { display: block; } 
.hotel-view .hotel-detail-box .hotel-info li p span { font-size: 16px; font-weight: 500; color: #666; } 
.map-wrap { width: 100%; } 

/* 지도 */
.map-wrap .root_daum_roughmap_landing, .map-wrap .root_daum_roughmap { max-width: 1380px !important; width: 100% !important; } 
.root_daum_roughmap_landing { width: 100%; z-index: 0; } 
.root_daum_roughmap_landing .cont { display: none; } 

/* 호텔 서비스 */
.hotel-service { display: flex; padding-top: 20px; gap: 30px; } 
.hotel-service strong { color: #222; font-size: 2rem; font-weight: 600; } 
.hotel-service .service-list { display: flex; gap: 20px; flex-wrap: wrap; } 
.hotel-service .service-list li { line-height: 1.4; padding-left: 25px; color: #444; font-size: 1.8rem; font-weight: 500; background-size: 18px; background-repeat: no-repeat; background-position: center left; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%233169F7' class='bi bi-check-lg' viewBox='0 0 16 16'%3E%3Cpath d='M12.736 3.97a.733.733 0 0 1 1.047 0c.286.289.29.756.01 1.05L7.88 12.01a.733.733 0 0 1-1.065.02L3.217 8.384a.757.757 0 0 1 0-1.06.733.733 0 0 1 1.047 0l3.052 3.093 5.4-6.425z'/%3E%3C/svg%3E"); } 

@media only screen and (max-width: 1400px){
 .hotel-view .hotel-detail-box .tit-top .tit { font-size: 3.5rem; } 
.hotel-view .hotel-detail-box .tit-top i { } 
.hotel-view .hotel-detail-box .info-list li em { font-size: 1.8rem; } 
.hotel-view .hotel-detail-box .info-list li p { font-size: 1.8rem; } 
.hotel-view .hotel-detail-box .hotel-info li strong { font-size: 4rem; } 
 }
@media only screen and (max-width: 1023px){
 .hotel-view .hotel-detail-box { padding: 30px; } 
 .hotel-view .hotel-detail-box .tit-top .tit { font-size: 3.3rem; } 
 .hotel-view .hotel-detail-box .hotel-info li strong { font-size: 3rem; } 
 }
 @media only screen and (max-width: 767px){
 .hotel-view .hotel-detail-box .hotel-info { flex-direction: column; } 
.hotel-view .hotel-detail-box .hotel-info li { width: 100%; flex-direction: row-reverse; } 
.hotel-view .hotel-detail-box .hotel-info li:last-child { padding-left: unset; } 
.hotel-view .hotel-detail-box .hotel-info li:last-child::before { display: none; } 
.hotel-view .hotel-detail-box .hotel-info li p { flex-direction: row; } 
.hotel-view .hotel-detail-box .hotel-info li + li { margin-top: 10px; } 
.hotel-view .hotel-detail-box .tit-top .tit { flex-direction: column-reverse; align-items: unset; } 
 }
 @media only screen and (max-width: 500px){
 .hotel-view .hotel-detail-box .info-list li { flex-direction: column; } 
 }
 
 
 
 
 
 .gradient-reveal {
  display: block;
  -webkit-background-clip: text !important;
  --progress: 0%;
  background: linear-gradient(110deg, #222 0%, #222 var(--progress), #888 var(--progress), #888 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
}


.txt-54 { display: block; line-height: 1.4; font-size: 5.4rem; word-break: keep-all; }
.txt-48 { display: block; line-height: 1.4; font-size: 4.8rem; word-break: keep-all; }
.txt-40 { display: block; line-height: 1.4; font-size: 4rem; word-break: keep-all; }
.txt-36 { display: block; line-height: 1.4; font-size: 3.6rem; word-break: keep-all; }
.txt-30 { display: block; line-height: 1.4; font-size: 3rem; word-break: keep-all; }
.txt-28 { display: block; line-height: 1.4; font-size: 2.8rem; word-break: keep-all; }
.txt-24 { display: block; line-height: 1.4; font-size: 2.4rem; word-break: keep-all; }
.txt-22 { display: block; line-height: 1.4; font-size: 2.2rem; word-break: keep-all; }
.txt-20 { display: block; line-height: 1.4; font-size: 2rem; word-break: keep-all; }
.txt-18 { display: block; line-height: 1.4; font-size: 18px; word-break: keep-all; }
.txt-17 { display: block; line-height: 1.4; font-size: 17px; word-break: keep-all; }
.txt-16 { display: block; line-height: 1.4; word-break: keep-all; }
.txt-15 { display: block; line-height: 1.4; font-size: 15px; word-break: keep-all; }
.txt-14 { display: block; line-height: 1.4; font-size: 14px; word-break: keep-all; }
.txt-13 { display: block; line-height: 1.4; font-size: 13px; word-break: keep-all; }


.img-box { position: relative; display: flex; flex-direction: column; align-items: center; height: 0; padding-bottom: 60%; }
.img-box .bg { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 50%; height: 100%; overflow: hidden; }
.img-box .bg .img-wrap { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%; max-width: 1380px; height: 100%; }
.img-box .bg .img-wrap img { width: 100%; height: 100%; object-fit: cover; }


.grid-main { --aside: 300px; display: flex; align-items: flex-start; }
.grid-main .main-aside { flex: 0 0 var(--aside); padding-top: 30px; }
.grid-main .con-body { flex: 1 1 0; }

@media only screen and (max-width: 1200px) {
    .grid-main .main-aside { --aside: 200px; }
    .grid-main .con-body { flex-basis: auto; }
}
@media only screen and (max-width: 1023px) {
    .grid-main { flex-direction: column; }
    .grid-main .main-aside { flex-basis: auto; width: 100%; } 
}