@charset "utf-8";
/* CSS Document */

#container									{ position:relative;overflow:hidden;padding-bottom:7em;}		
#content									{z-index:3;}
#boardWrap									{ width:94%; max-width:1500px; }
.headList .SearchInfo .data_list>li 		{ background:none; min-height:inherit; padding:0; border-radius:inherit; min-width:inherit; flex:inherit; }
@media (max-width: 1280px) { 
	#container  							{ padding-bottom:5em; }
}

@media (max-width: 1024px) { 
	#container  							{ padding-bottom:4em; }
}

@media (max-width: 768px) { 
	#container  							{ padding-bottom:3em; }
}

/*다이어그램*/
.area_diagram .list > li:before				{background-image:url(/resource/tour/images/sub/icon_diagram_arr.svg) !important;z-index:1 !important;}

/* 농가체험 보드 */
.gallery_list>ul>li .gl_info>dd.homepage>a	{ position:absolute; right:1%; top:1%; font-size:0.001px; width:40px; height:40px; border-radius:100%; overflow:hidden; text-indent:-9999em; background:var(--color-point); z-index:3 }
.gallery_list>ul>li .gl_info>dd.homepage>a::before	{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; background:url(/resource/common/images/bbs/icon_homepage.svg) no-repeat 50% 50% / auto 15px }
.gallery_list>ul>li .gl_info>dd.add,
.gallery_list>ul>li .gl_info>dd.tel					{ display:flex; gap:5px 10px; align-items:flex-start; line-height:1.3; color:var(--color-base2); margin-top:5px; }
.gallery_list>ul>li .gl_info>dd .icon_add,
.gallery_list>ul>li .gl_info>dd .icon_tel			{ display:flex; width:22px; height:22px; position:relative; }
.gallery_list>ul>li .gl_info>dd .icon_add::before,
.gallery_list>ul>li .gl_info>dd .icon_tel::before	{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; background-position:50%; background-repeat:no-repeat; border-radius:100%; background-color:var(--color-board-base5); margin-top:-1px; }
.gallery_list>ul>li .gl_info>dd .icon_add::before	{ background-image:url(/resource/common/images/bbs/icon_add.svg); background-size:auto 12px; }
.gallery_list>ul>li .gl_info>dd .icon_tel::before	{ background-image:url(/resource/common/images/bbs/icon_tel.svg); background-size:auto 12px;}
.gallery_list>ul>li .gl_info>dd.cont				{ border-radius:8px; background:var(--color-board-gray1); padding:10px; margin-top:10px; display:flex; align-items:center; justify-content:center; word-break:break-all; }


@media (max-width: 468px) {
  .gallery_list>ul>li .gl_info>dd.homepage>a::before	{width:36px;height:36px;}
}

/* tour_view 스킨 공통 */
@media (max-width: 868px) {
  .tour_view .tour_view_top .area_text .info_list>li>strong{min-width: 6em;}
  .tour_view .tour_view_top .area_text .info_list>li>span{width: calc(100% - 7em);}
}

@media (max-width: 768px) {
  .tour_search_box .search_box .input_list>li:has(select){max-width:7em;}
  .tour_search_box .search_box .input_list > li select{min-width:7em;}
  .tour_search_box .search_box .input_list > li:has(input#keyword){max-width: calc(100% - 5px - 7em);}
}

@media all and (max-width:368px){
  .tour_search_box .search_box .input_list>li select					{ min-width:inherit; width:100%; }
  .tour_search_box .search_box .input_list>li:has(select)				{ max-width:inherit; width:100%; }
  .tour_search_box .search_box .input_list > li:has(input#keyword)		{max-width: inherit;}
}


/* 공연/행사/전시 */
.gallery_list .list_poster>li>a										{align-content: space-between;}
.gallery_list .list_poster>li .cont:not(:has(.cate)) strong			{margin-top:37.59px;}

@media all and (max-width:1024px){
  .gallery_list .list_poster>li .cont .view							{top:1.5rem;}
}


/**********************************************************************
 								비주얼 
**********************************************************************/
.visual                                       	{ position:relative; width: 100%; height:430px; overflow: visible; background-size: cover; background-position: center; background-repeat: no-repeat;}
.visual::before									{ position:absolute; width:100%; height:100%; left:0; top:0; background:rgba(0,0,0,.2); content:''; }
.visual.bg1										{ background-image:url(/resource/tour/images/sub/sub_visual01.jpg); }
.visual.bg2										{ background-image:url(/resource/tour/images/sub/sub_visual02.jpg); }
.visual.bg3										{ background-image:url(/resource/tour/images/sub/sub_visual03.jpg); }
.visual.bg4										{ background-image:url(/resource/tour/images/sub/sub_visual04.jpg); }
.visual.bg5										{ background-image:url(/resource/tour/images/sub/sub_visual05.jpg); }
.visual.bg6										{ background-image:url(/resource/tour/images/sub/sub_visual06.jpg); }

.visual .text_wrap 								{ position: absolute; top: 50%; left: 50%;  transform: translate(-50%, -40%); padding: 30px 70px; border-radius: 0 0 40px 0; color: var(--color-white); display: inline-block; text-align:center; width:100%}
.visual .text_wrap span  						{ display:block; font-size:1.25rem; font-weight:400; animation: fadeSlideUp 1s 0.3s ease forwards;}
.visual .text_wrap strong  						{ font-family: var(--font-ttt); font-size:2.813rem; animation: fadeSlideUp 1s ease forwards;}
.visual .img									{ position:relative; width: 1920px; left: 50%; transform: translateX(calc(-50% + 210px)); height:340px;}
.visual .img img								{ position:absolute; top:50%; left:50%; min-width:100%; min-height:100%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); 
												-webkit-transform:translate(-50%,-50%); -moz-transform: translate(-50%,-50%); object-fit:cover; -o-object-fit:cover; z-index:1}
@keyframes fadeSlideUp {
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1600px) { 
	.visual 					{ width:100%; left:0; transform:inherit; } 
}


@media (max-width: 1024px) { 
	.visual  									{ height:300px }
	.visual .text_wrap  						{ padding:0; }
	.visual .text_wrap strong  					{ font-size:2.188rem; line-height:1}
	.visual .text_wrap span  					{ font-size:1.125rem; }

}
@media (max-width: 768px) { 
	.visual { height: 280px }
	.visual .text_wrap strong  					{ font-size:1.625rem;}
	.visual .text_wrap span  					{ font-size:initial; }
}

@media (max-width: 377px) { 
	.visual .text_wrap  						{transform: translate(-50%, -25%);}
}

.location_wrap  								{ position:absolute; bottom:0px; left:0;  width:100%; height:80px; z-index:2}	
.location_wrap .con_inner  						{ display:flex; justify-content:space-between; height:100%; align-items: center; background: rgba(0, 0, 0, .5); border-radius: 2.5em 2.5em 0 0; padding:0 1.875em;}

/* 위치 */
.location_wrap .lco												{ display:flex; align-items:center; color:var(--color-white);}
.location_wrap .lco>li											{ position:relative; margin:0 3px }
.location_wrap .lco [data-location="home"]						{ margin-left:0; }
.location_wrap .lco [data-location="home"] a					{ display:flex; font-size:0px; width:40px; height:40px; background: rgba(0, 0, 0, .6); border-radius: 40px}
.location_wrap .lco [data-location="home"] a::before			{ content:''; display:block; width:100%; height:100%; background:url(/resource/tour/images/sub/icon_home.svg) no-repeat 50% 50%; background-size:auto 16px; filter:invert(1);}
.location_wrap .lco>li>button									{ display:flex; align-items:center; border-radius: 40px; height:40px; padding:0 37px 0 20px; border:1px solid rgba(255, 255, 255, .5);}
.location_wrap .lco>li>button::before							{ position:absolute; right:20px; top:50%; width:7px; height:7px; border-style:solid; border-width:0 1px 1px 0; border-color:var(--color-white); transform:translateY(-80%) rotate(45deg); transition:var(--trans-ani); content:''; vertical-align:middle;}
.location_wrap .lco > li:nth-child(2) > button { min-width: 180px;}
.location_wrap .lco > li:nth-child(3) > button { min-width: 223px;}

.location_wrap .lco>li.active									{ border-radius:30px 30px 0 0; background:#2d269e;}
.location_wrap .lco>li.active>button 							{ background:var(--color-point); border:1px solid var(--color-point); border-radius: 20px}
.location_wrap .lco>li.active>button::before					{ transform:translateY(-20%) rotate(225deg); }

.location_wrap .lco>li:not(:has(button))						{ padding:0; }
.location_wrap .lco>li .loc_wrap								{ position:absolute; display:none; left:-1px; z-index:5; width:100%; padding:0.625em 1.25em; border-radius:0 0 20px 20px; background:#2d269e;}
.location_wrap .lco>li .loc_wrap li > a							{ display:inline-flex; justify-content:flex-start; align-items:center; padding:6px 0px; color:var(--color-white); transition:var(--trans-ani); line-height:1.2;
    word-break: break-all; }
.location_wrap .lco>li .loc_wrap li a[target='_blank']::after	{ content:""; display:inline-block; opacity:.8; transition:all .4s; margin-left:7px; vertical-align:middle; width:11px; height:10px;
    background:url(/resource/tour/images/common/icon_blank.svg) no-repeat 50% 50% / auto 10px;filter:invert(1);}
.location_wrap .lco>li .loc_wrap li > a:hover,
.location_wrap .lco>li .loc_wrap li > a:focus					{ text-decoration: underline;}

@media all and (max-width:768px){
    .location_wrap													{ border:none; height:60px}
    .location_wrap .lco												{ border:none; }
	.location_wrap .lco												{ flex-wrap:wrap; }
	.location_wrap .lco>li											{ padding:0; }
	.location_wrap .lco [data-location="home"] a					{ width:30px; min-width:30px; height:30px; }
	.location_wrap .lco [data-location="home"] a::before			{ margin-top:-1px; background-size:12px; }
	.location_wrap .lco [data-location="home"]						{ margin-right:-1px; }
	.location_wrap .lco>li												{ border-right:none; }
	.location_wrap .lco>li+li										{ padding-left:15px; margin-left:10px; }
	.location_wrap .lco>li+li::before								{ position:absolute; left:-3.5px; top:50%; width:7px; height:7px; border-style:solid; border-width:1px 1px 0 0; border-color:var(--color-white); 
																		transform:translateY(-50%) rotate(45deg); content:'';  }
																		
	.location_wrap .lco>li>button									{ height:inherit; padding:0; pointer-events:none; text-align:left; background:none; width:auto; min-width:initial !important;border:none;}
	.location_wrap .lco>li>button::before							{ display:none; }
	.location_wrap .lco>li:last-child>button::before				{ display:none; }
	.location_wrap .lco>li>button span								{ max-width:inherit; white-space:initial; text-overflow:initial; overflow:inherit; }
    .location_wrap .lco>li												{ border-right:none; }
}

/* 공유 */
.location_wrap .page_util																{ z-index:3; display:flex; justify-content:center; align-items:center; --sizeHig:40px; gap:6px;  }
.location_wrap .page_util>li															{ position:relative; }
.location_wrap .page_util>li>button														{ display:flex; width:var(--sizeHig); height:var(--sizeHig); border-radius:100%; background: rgba(0, 0, 0, .5);}
.location_wrap .page_util>li>button:before												{ content:''; flex:none; display:block; width:100%; height:100%; margin:0 auto; background-repeat:no-repeat; background-position:50% 50%; filter:invert(1);}
.location_wrap .page_util>li .share_bt:before											{ background-image:url(/resource/tour/images/sub/ico_share.svg); background-size:16px; margin-top:-.5px}
.location_wrap .page_util>li>button.copy:before											{ background-image:url(/resource/tour/images/sub/ico_copy_link.svg);}
.location_wrap .page_util>li>button.print:before										{ background-image:url(/resource/tour/images/sub/ico_print.svg); background-size:17px 16px;}
.location_wrap .page_util>li>button.braille:before										{ background-image:url(/resource/tour/images/sub/ico_bx_link.svg); background-size:18px 13px;}
.location_wrap .page_util>li>button.braille_down:before									{ background-image:url(/resource/tour/images/sub/ico_bx_down.svg); background-size:18px 13px; background-position:50% 55%}
.location_wrap .page_util>li.share .share_drop											{ display:none; position:absolute; top:-1px; left:-3px; z-index:10; width:calc(var(--sizeHig) + 6px); box-sizing:border-box; background-color:var(--color-white); 
																						border:1px solid #e5e5e5;  text-align:center; z-index:1 ; border-radius:25px;}			

.location_wrap .page_util>li.share .share_drop ul										{ padding-top:10px; display:flex; flex-flow:column; gap:7px; }
.location_wrap .page_util>li.share .share_drop ul > li a								{ display:flex; justify-content:center; align-items:center; width:100%; height:100%;}
.location_wrap .page_util>li.share .share_drop ul > li[data-share] a:before				{ content:''; display:block; width:30px; height:30px; background-repeat:no-repeat; background-position:50% 50%; background-size:auto 100%; 
																							border-radius:100%; }
.location_wrap .page_util>li.share .share_drop ul > li[data-share="blog"] a:before		{ background-image:url(/resource/tour/images/sub/icon_blog.svg); background-color:#32b44a;}
.location_wrap .page_util>li.share .share_drop ul > li[data-share="youtube"] a:before	{ background-image:url(/resource/tour/images/sub/icon_youtube.svg); background-color:#e03232;}
.location_wrap .page_util>li.share .share_drop ul > li[data-share="facebook"] a:before	{ background-image:url(/resource/tour/images/sub/icon_facebook.svg); background-color:#385691;}
.location_wrap .page_util>li.share .share_drop ul > li[data-share="instar"] a:before	{ background:url(/resource/tour/images/sub/icon_instar.svg) no-repeat 50% 50% / cover, linear-gradient(to bottom right, #4a48e8 20% , #ee3183 60%, #f0c05c 100%);}
.location_wrap .page_util>li.share .share_drop ul > li[data-share="kakao"] a:before		{ background-image:url(/resource/tour/images/sub/icon_kakaoch.svg); background-color:#ffde00; }
.location_wrap .page_util>li.share .share_drop ul > li[data-share="twitter"] a:before	{ background-image:url(/resource/tour/images/sub/icon_twitter.png); background-color:#000;}
.location_wrap .page_util>li.share .share_drop ul > li[data-share="band"] a:before		{ background-image:url(/resource/tour/images/sub/icon_band.png); background-color:#50b748;}
.location_wrap .page_util>li.share .share_drop ul > li[data-share="copy"] a:before		{ background-image:url(/resource/tour/images/sub/icon_copy.svg); background-color:#555555;}
.location_wrap .page_util>li.share .share_close											{ position:relative; width:30px; height:30px; margin-top:10px; margin-bottom:5px; background:#e5e5e5; border-radius:100%;}
.location_wrap .page_util>li.share .share_close::before									{ position:absolute; width:1px; height:11px; left:50%; top:50%; transform:translate(-50%,-50%) rotate(45deg); content:''; background:var(--color-base); }
.location_wrap .page_util>li.share .share_close::after									{ position:absolute; width:1px; height:11px; left:50%; top:50%; transform:translate(-50%,-50%) rotate(-45deg); content:''; background:var(--color-base);}
.location_wrap .page_util>li.share .share_close:hover									{ transform:rotate(90deg); }

.location_wrap .scroll_down 																		{width: 100%;text-align: center;position: absolute;bottom: 0; left: 0;display: flex;justify-content: center;filter: invert(1) brightness(10);mix-blend-mode: difference;margin-bottom: -70px;z-index:5;pointer-events: none;}
.location_wrap .scroll_down .spinner 															{width: 140px;height: 140px;display: flex;align-items: center;justify-content: center;z-index: 3;}
.location_wrap .scroll_down .spinner i 														{position:absolute;width:100%;height:100%;display:block;background:url("/resource/tour/images/sub/icon_down_arr.svg") no-repeat center center / auto 20px;animation: updown 1s alternate-reverse ease-in-out infinite;}
.location_wrap .scroll_down .spinner img 														{animation: rotate 8s infinite linear;}

@keyframes rotate {
    0% { transform:rotate(0); }
    100% { transform:rotate(360deg); }
}


@media all and (max-width:1024px){
	.location_wrap { left:50%; transform:translateX(-50%);height:60px; }
	.location_wrap .con_inner  { border-radius:1em 1em 0 0; padding:0 1em; }
}
@media all and (max-width:768px){
	.location_wrap													{ /*height:fit-content;*/ height:auto; }
	.location_wrap .con_inner  										{ padding:7px 0.625em; flex-wrap:wrap; gap:5px 1.5em}
    .location_wrap .lco > li:nth-child(2) > button,
    .location_wrap .lco > li:nth-child(3) > button  				{ width:auto; }
    .location_wrap .lco>li  										{ margin:0; }
	.location_wrap .page_util										{ --sizeHig:30px; }
  	.location_wrap .page_util>li.share .share_drop					{ width:calc(var(--sizeHig) + 8px); left:-4px; }
	.location_wrap .page_util>li.share .share_drop ul				{ padding-top:7px; gap:5px; }
  	 .location_wrap .page_util>li.share .share_drop ul > li[data-share] a:before,
  	.location_wrap .page_util>li.share .share_close					{width:26px; height:26px; }
	.location_wrap .page_util>li .share_bt:before					{ background-size:13px; }
	.location_wrap .page_util>li>button.print:before				{ background-size:auto 13px; }
	.location_wrap .page_util>li>button.braille:before				{ background-size:auto 10px; /*background-position:52% 50%*/ }
	.location_wrap .page_util>li>button.braille_down:before			{ background-size:auto 10px; /*background-position:52% 50%*/}
  	.location_wrap .page_util>li.share .share_close					{margin-top:8px;}
}

@media all and (max-width:568px){
	.visual														{height: auto;background-image: none !important;}
	.visual:before												{display:none;}
	.visual .text_wrap                                       	{position:relative;width: 100%;height: 200px;overflow: visible;background-size: cover;background-position: center;background-repeat: no-repeat;transform: none;top: 0;left: 0;display: flex;align-items: center;justify-content: center;overflow: hidden;border-radius: 0;}
    .visual .text_wrap::before									{ position:absolute; width:100%; height:100%; left:0; top:0; background:rgba(0,0,0,.2); content:''; }
    .visual.bg1	.text_wrap										{ background-image:url(/resource/tour/images/sub/sub_visual01.jpg); }
    .visual.bg2	.text_wrap										{ background-image:url(/resource/tour/images/sub/sub_visual02.jpg); }
    .visual.bg3	.text_wrap										{ background-image:url(/resource/tour/images/sub/sub_visual03.jpg); }
    .visual.bg4	.text_wrap										{ background-image:url(/resource/tour/images/sub/sub_visual04.jpg); }
    .visual.bg5	.text_wrap										{ background-image:url(/resource/tour/images/sub/sub_visual05.jpg); }
    .visual.bg6	.text_wrap										{ background-image:url(/resource/tour/images/sub/sub_visual06.jpg); }
	.visual .text_wrap h2										{margin-top:60px}
	.location_wrap												{position:initial;transform: none;left: initial;background: #111;border-radius: 0;}
  	.location_wrap .con_inner									{background: transparent;border-radius: 0;padding:10px 0;}
	.location_wrap .lco [data-location="home"] a,
	.location_wrap .page_util>li>button							{background: rgba(255, 255, 255, .15);}
}
						

/*********************************************************************
 								공통 
**********************************************************************/

		
/* 3차메뉴 */
.area_snb  										{ border-bottom:1px solid var(--color-line);}
.area_snb .sub_tab								{ display:flex; flex-flow:row wrap; justify-content:center; align-items:stretch;}
.area_snb .sub_tab > li							{ display:flex; justify-content:center; align-items:center; flex:1; min-width:150px;}
.area_snb .sub_tab > li > a,
.area_snb .sub_tab > li > button				{ display:flex; justify-content:center; align-items:center; position:relative; box-sizing:border-box; padding:20px 0; width:100%;
												line-height:1.15; color:#565656; text-align:center; transition:var(--trans-ani); font-size:1.25em; font-weight:400; letter-spacing:-.045em }
.area_snb .sub_tab > li.active > a,
.area_snb .sub_tab > li.active > button			{ color:var(--color-point); }	
.area_snb .sub_tab > li.active > a:before  		{ width:100% }

.area_snb .sub_tab > li > a:hover,
.area_snb .sub_tab > li > a:focus  				{ color:var(--color-point);  }
.area_snb .btn_snb_mob							{ display:none; justify-content:flex-start; align-items:center; position:relative; width:100%; box-sizing:border-box; padding:15px 20px 15px 15px; border-radius:8px; 
												line-height:1.15; color:var(--color-white); text-align:center; transition:var(--trans-ani); font-size:1.03em; font-weight:400; background:var(--color-point); letter-spacing:-.045em }
.area_snb .btn_snb_mob::after					{ content:''; display:block; position:absolute; width:7px; height:7px; right:17px; top:50%; border-style:solid; border-color:var(--color-point); border-width:0 1px 1px 0; 
												transform:translateY(-70%) rotate(45deg); transition:var(--trans-ani); }
.area_snb .btn_snb_mob.active::after			{ transform:translateY(-40%) rotate(-135deg);}	

.area_snb .sub_tab > li > a::before 			{ content: ""; position: absolute; bottom: 0; left: 50%; width: 0; height: 3px; background: var(--color-point); border-radius: 2px; transform: translateX(-50%); transition: width 0.3s ease;}
.area_snb .sub_tab > li > a:hover::before,
.area_snb .sub_tab > li > a:focus::before 		{ width: 100%;}


@media all and (max-width:1024px) {

	/* 탭 메뉴 */
	.area_snb									{ padding:10px; border-bottom:0;}
	.area_snb .btn_snb_mob						{ display:flex; background:var(--color-white); border:1px solid var(--color-point); color:var(--color-point); padding:15px 20px 15px 15px; width:100% }
	.area_snb .btn_snb_mob.active				{ border-radius:8px 8px 0px 0px;  }
	.area_snb .sub_tab							{ display:none; overflow-y:auto; position:absolute; left:10px; top:var(--sizeMob); z-index:1; width:calc(100% - 20px); max-height:300px; box-sizing:border-box; border-radius:0 0 8px 15px;
												padding:15px; background:var(--color-white); border:1px solid var(--color-point); border-top-color:#dcdcdc; box-shadow:0 10px 30px rgba(0,0,0,0.2);}
	.area_snb .sub_tab > li						{ height:auto; max-width:inherit; }
	.area_snb .sub_tab > li+li					{ margin-top:5px; }
	.area_snb .sub_tab > li > a,
	.area_snb .sub_tab > li > button			{ padding:12px 15px; border-radius:5px; width:100%; font-size:inherit;}

	.area_snb .sub_tab > li.active > a,
	.area_snb .sub_tab > li.active > button,
	.area_snb .sub_tab > li > a:hover,
	.area_snb .sub_tab > li > a:focus		{ color:var(--color-white); background:var(--color-point); border-radius:10px }	

	.area_snb .sub_tab > li > a::before  		{ background:none; }

}
