@charset "utf-8";

/* 모바일 */
@media all and (max-width:640px)
{
	.b_content { padding-bottom: 15px; padding-left: 4%; padding-right: 4%; width:100%; }
	.b_content_bg { padding: 4%; }
	.b_content_title_food > div { padding: 5%; }
	.b_content_tab { padding-top: 0px; width: 100% }
	.b_content_btn.tab > div { width: 23.5%; margin-right: 0px; }
	.b_content_btn.tab > div:not(:first-child) { margin-left: 0%; }
	.b_content_btn.tab > div:not(:nth-child(4n+1)) { margin-left: 2%; }
	.b_content_btn.tab > div:nth-child(n+5) { margin-top: 8px; }
	.b_content_btn.orange.tab > div:last-child { width: 40% }
	.b_content_btn.tab2 > div { width: 28%; }

	/* 최상단 */
	.b_top_menu { align-items: center; background: #F6F6F6; font-size: 24px; font-weight: 800; display: flex; justify-content: center; padding: 19px 0px 19px 0px; position: fixed; width: 100%; z-index: 3000 }
	.b_top_menu_bg { height: 82px; width: 100%; }
	.b_top_menu > img { cursor: pointer; margin-top: 2px; }
	.b_top_menu_lang { align-items: center; background: #FFF; border: 1px solid rgba(0, 0, 0, 0.20); border-radius: 7px; box-shadow: 0 0 4px -1px rgba(0, 0, 0, 0.25);
		cursor: pointer; display: flex; font: var(--P-14); height: 24px; justify-content: center; position: absolute; right: 12px; top: 26px; width: 36px; }

	.b_top_menu.top2 { padding: 25px 0px 25px 0px; }
	.b_top_menu.top2 > img { margin-top: 0px; }

	.b_top_menu.top2:lang(en) > div:nth-child(1) { display: flex; flex-direction: column; font-size: 18px; letter-spacing: 0px;  }

	.b_back { left: 20px; position: absolute; top:15px; }
	.b_home { position: absolute; right: 20px; top:15px; }

	/* 상단 메뉴 보기 */
	.b_top_menu_list { background: #FFF; border-radius: 15px; box-shadow: 0 0 6px 1.5px rgba(0, 0, 0, 0.15); display: none; height: 142px; left: 50%; padding: 0px 40px 0px 40px;
		position: fixed; top: 90px; transform: translateX(-50%); z-index: 1000; width: 292px; }
	.b_top_menu_list > div { align-items: center; display: flex; height: 50%; justify-content: center; width: 100%; }
	.b_top_menu_list > div:nth-child(1) {  font: var(--J-18); letter-spacing: 0.19px; }
	.b_top_menu_list > div:nth-child(1) > span:nth-child(1) { color: #FF0084; padding-right: 5px; }
	.b_top_menu_list > div:nth-child(1) { border-bottom: 1px solid #D5D5D5; }
	.b_top_menu_list > div > img { cursor: pointer }

	.b_top_menu_list > div:nth-child(1):lang(en) { display: flex; flex-direction: column; font-size: 14px; letter-spacing: 0px;  }

	/* 하단 메뉴 */
	.b_bottom_menu_bg { height: 90px; }
	.b_bottom_menu { background: #FFF; bottom: 0px; box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.15); height: 90px; left: 0px; padding: 0 2% 0 2%; position: fixed; width: 100%; z-index: 2000 }
	.b_bottom_menu > div { cursor: pointer; display: inline-block; height: 100%; text-align: center; padding-top: 20px;  width: 15.7% }
	.b_bottom_menu > div > div { font: var(--P-12); padding-top: 5px; }
	.b_bottom_menu > div.sel > div { color: #FF0084 }
	.b_bottom_menu > div.sel > img { filter: invert(27%) sepia(96%) saturate(7490%) hue-rotate(315deg) brightness(101%) contrast(103%); }

	/* 하단 메뉴 전체 보기 */
	.b_bottom_menu_show { background: #ffffff; top: 0px; display: none; left: -100px; position: fixed; width: 100%; height: 100%; z-index: 3001 }
	.b_bottom_menu_show > div:nth-child(1) { background: #F0F0F0; font: var(--J-16); height: 53px; letter-spacing: -0.32px;
		padding-left: 30px; padding-top: 15px; position: relative }
	.b_bottom_menu_show > div:nth-child(1) > span:nth-child(1) { color: #FF0084; }
	.b_bottom_menu_show > div:nth-child(1) > span:nth-child(3) { background: #B5B5B5; display: inline-block; height: 16px; margin: 0px 15px 0px 15px; vertical-align: middle; width: 1px; }
	.b_bottom_menu_show > div:nth-child(1) > span:nth-child(3):lang(en) { display: none }
	.b_bottom_menu_show > div:nth-child(1) > span:nth-child(4) { color: #6C6C6C; font: var(--P-14); }
	.b_bottom_menu_show > div:nth-child(1) > img { cursor: pointer; position: absolute; top: 4px; right: 4px; }

	.b_bottom_menu_show > div:nth-child(2) { background: #fff; height: 76dvh; overflow-y: auto; padding: 10px 0px 10px 30px; }
	.b_bottom_menu_show > div:nth-child(2) > div { align-items: center; display: flex; height: 60px; position: relative }
	.b_bottom_menu_show > div:nth-child(2) > div > img:nth-child(1) { height: 22px; width: 22px; margin-right: 12px; }
	.b_bottom_menu_show > div:nth-child(2) > div > span{ font: var(--P-18); }
	.b_bottom_menu_show > div:nth-child(2) > div > img:nth-child(3) { position: absolute; top: 0px; right: 10px; }

	.b_bottom_menu_show > div:nth-child(2) > div.b_sub_menu { background: #F5F5F5; border-radius: 13.392px; cursor: pointer; display: none; height: auto; margin-right: 30px; padding: 10px 10px 10px 30px }
	.b_bottom_menu_show > div:nth-child(2) > div.b_sub_menu > div { align-items: center; display: flex; height: 30px; position: relative; opacity: 0.5 }
	.b_bottom_menu_show > div:nth-child(2) > div.b_sub_menu > div > span { font: var(--P-16); letter-spacing: -0.32px; }
	.b_bottom_menu_show > div:nth-child(2) > div.b_sub_menu > div > img { position: absolute; top: 4px; right: 4px; }

	.b_bottom_menu_show > div:nth-child(3) { background: #ffffff; position: absolute; left: 0px; bottom: 0px; width: 100% }
	.b_bottom_menu_show > div:nth-child(3) > div:nth-child(1) {	background: #000; height: 1px; opacity: 0.1; }

	.b_bottom_menu_show > div:nth-child(3) > div:nth-child(2) { background: #fff; padding: 14px 0px 14px 0px }
	.b_bottom_menu_show > div:nth-child(3) > div:nth-child(2) > div { align-items: center; cursor: pointer; float: left; display: flex; justify-content: center; width: 33% }
	.b_bottom_menu_show > div:nth-child(3) > div:nth-child(2) > div > img { width: 80px; }
	.b_bottom_menu_show > div:nth-child(3) > div:nth-child(2) > div > span { background: #000; display: inline-block; height: 16px; opacity: 0.15; vertical-align: middle; width: 1px; }
	.b_bottom_menu_show > div:nth-child(3) > div:nth-child(2) > div:nth-child(2n) { width: 1px; }
	.b_bottom_menu_show > div:nth-child(3) > div:nth-child(2) > div:nth-child(5) { font: var(--J-12); color: #FF0084; }
	.b_bottom_menu_show > div:nth-child(3) > div:nth-child(2)::after{ clear:both; content:""; display: block; }

	.b_bottom_menu_show > div:nth-child(3) > div:nth-child(3) { background: #fff; }
	.b_bottom_menu_show > div:nth-child(3) > div:nth-child(3) > div { background: rgba( 0, 0, 0, 0.05); color:#FF6200; padding: 14px 14px 17px 24px; position: relative }
	.b_bottom_menu_show > div:nth-child(3) > div:nth-child(3) > div > img { width: 120px; }
	.b_bottom_menu_show > div:nth-child(3) > div:nth-child(3) > div > div { position: absolute; right: 21px; top:9px; }
	.b_bottom_menu_show > div:nth-child(3) > div:nth-child(3) > div > div > img { cursor: pointer; margin-left: 5px; }

	/* 하단 연계사이트 보기 배경 */
	.b_bottom_menu_overlay { background: rgba(0,0,0,0.5); display: none; height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 3000; }

	/* 하단 연계사이트 */
	.b_bottom_link_show { 	background: #FFF; border-radius: 15px 15px 0 0; bottom: 0px; box-shadow: 0 -3px 6px 1.5px rgba(0, 0, 0, 0.15); display: none; height: 186px; left: 0px; padding: 27px; width: 100%; position: fixed; z-index: 3001 }

	.b_bottom_link_show > div:nth-child(1) { font: var(--P-16); padding-bottom: 20px; position: relative }
	.b_bottom_link_show > div:nth-child(1) > span { opacity: 0.6 }
	.b_bottom_link_show > div:nth-child(1) > img { cursor: pointer; opacity: 0.5; position: absolute; right: 0px; top: 0px; }
	.b_bottom_link_show > div:nth-child(2) > div { border-radius: 15px; border: 1px solid #c9c9c9; cursor: pointer; display: inline-block; font: var(--P-16);
		height: 90px; margin-right: 15px; width: 90px; padding-top: 15px; text-align: center }

	/* 하단 언어 */
	.b_bottom_lang { background: #E9E9E9; border: 1px solid #E0E0E0; border-radius: 50px; height: 50px; margin: 50px 2% 20px 2% }
	.b_bottom_lang > div { color:#8E8E8E; cursor: pointer; float: left; font: var(--P-14); margin: 4px 1% 0px 1%; padding: 10px; text-align: center; width: 48%; }
	.b_bottom_lang > div.sel { background: #ffffff; border: 1px solid #E0E0E0; border-radius: 50px; color:#040404; opacity: 1.0; }
	.b_bottom_lang::after{ clear:both; content:""; display: block; }

	/* 하단 원 메뉴 */
	.b_bottom_round > div { align-items: center; aspect-ratio: 1 / 1; background: #C9C9C9; border-radius: 15px; color: #ffffff; cursor: pointer; display: flex; flex-direction: column; float: left;
		font: var(--P-14); justify-content: center; line-height: 16px; width: 15.6%; }
	.b_bottom_round > div:not(:first-child) { margin-left: 1.28% }
	.b_bottom_round::after{ clear:both; content:""; display: block; }

	/*** index.html ***/
	.main_banner { height: auto; padding-bottom: 15px; }
	.main_banner > div { width:100%; height: auto; margin-left: 0px; }
	.main_banner > div > div > div > div > div > div:nth-child(1) { font: var(--P-35); line-height: 40px; }

	.main_banner .swiper-pagination { bottom: 30px; left: 30px; width: inherit }
	.main_banner .swiper-pagination-bullet { background-color: #FFFFFF; margin: 0px 5px 0px 5px; opacity: 1; }
	.main_banner .swiper-pagination-bullet-active { background-color: #000000; opacity: 1; }

	.main_btn_box1 > div { width: 32%; }
	.main_btn_box1 > div:not(:nth-child(3n)) { margin-right: 2% }
	.main_btn_box1 > div:nth-child(3) { margin-right: 0% }

	.b_main_content { width:100%; 	gap: 0px; }
	.b_main_content > div { width: 100%; height: auto; }
	.b_main_content > div:nth-child(2n+1) { margin-right: 0px; }

	.b_main_content .b_content_img { aspect-ratio: auto; }
	.b_main_content .b_content_img.big { aspect-ratio: auto; }

	.b_main_content .b_content_bg .b_content_img3 > img { aspect-ratio: auto }

	/*** 반려동물 ***/
	.pet_1 { margin: 0px 7% 0px 7%; width: 86% }

	/*** DJ 박스 ***/
	.dj_1 { height: 190px; margin: 0px 7% 0px 7%; width: 86% }

	/*** 스토리 ***/
	.b_story_content { width: 100%; display: block; }
	.b_story_content > div { width: auto; height: auto; }

	/*** 스토리 상세 ***/
	.story_detail img { width: 100% }

	/*** 포토존 ***/
	.photo_map > img { width: 100% }
	.photo_map .center_right { left:60%; transform:translateX(-40%); }
	.photo_map .left { left: 10% }
	.photo_map .right { right: 10%; }

	.photo_list > div { width: 100%; }

	/*** 공지사항 ***/
	.b_notice_content { width: 100%; display: block; }
	.b_notice_content > div { width: auto; height: 200px; }

	/*** 피크닉존 ***/
	.picnic_1 { height: 190px; margin: 0px 7% 0px 7%; width: 86% }
}
