@charset "utf-8";
/* CSS Document */

#container														{ position:relative;margin-top:111px; }
#container .sub_bg											{position:relative;display:block;background:linear-gradient(to bottom,transparent, #f2f7ee);padding-top:22em;height:0;}
#container .sub_bg::before									{content:'';position:absolute;left:0;bottom:0;display:block;width:100%;background:url('/resource/camping/images/common/typo.png') no-repeat center bottom -2% / 100%;height:100%;}


@media all and (max-width:1568px){
    #container													{ margin-top:100px;  }
    #container .sub_bg										{padding-top:18em;}
}


@media all and (max-width:1268px){
    #container													{ margin-top:90px;}
    #container .sub_bg										{padding-top:12em;}
}

@media all and (max-width:868px){
    #container													{ margin-top:85px; }
    #container .sub_bg										{padding-top:8em;}
  .between													{ gap:0 !important; }
}

@media all and (max-width:468px){
    #container													{ margin-top:80px;  }
    #container .sub_bg										{padding-top:6em;}
}

@media all and (max-width:468px){
    #container													{ margin-top:80px;  }
    #container .sub_bg										{padding-top:6em;}
}

@media all and (max-width:368px){
    #container .sub_bg										{padding-top:5em;}
}





/**********************************************************************

 							기본 리스트 스타일

**********************************************************************/
.basic_ul li						                              { position:relative; padding-left:13px; line-height:1.35em; margin-top:10px;font-size:1.063em;}
.basic_ul li::before  				                             { content:''; position:absolute; top:9px; left:0; width:5px; height:5px; background:var(--color-point); border-radius:100%; }
.basic_ul li:first-child                                          {margin-top:0;}

@media all and (max-width:1024px){
    .basic_ul li                                                   {padding-left:12px;}
    .basic_ul li::before                                         {width:4px;height:4px;top:7px;}
}
@media all and (max-width:468px){
    .basic_ul li                                                  {font-size:1em;}
    .basic_ul li::before                                         {top:6.5px;}
}


/**********************************************************************

 								visual 

**********************************************************************/
.visual											                  { position:relative;padding-top:70px;display:flex;justify-content:space-between;align-items: flex-start;--sizeWidth:666px;font-family:var(--font-paperlogy);}
.visual .txt														{width:calc(100% - var(--sizeWidth));margin-top:2.5em;}
.visual .txt .green												{display:block;color:var(--color-point);font-size:1.325em;font-weight:500;margin-bottom:1em;line-height:1;}
.visual .txt .ti													{display:flex;gap:2.5em;align-items: flex-end;flex-wrap:wrap; }
.visual .txt .ti h2												{display:block;font-weight:700;color:var(--color-base);font-size:3.438em;line-height:1;}
.visual	.img													{position:relative;width:var(--sizeWidth);height:267px;background:url('/resource/camping/images/sub/sub_visual.png') no-repeat bottom right / 100%;z-index:8;}


/* 공유 */
.visual .page_util										{ display:flex; align-items:center; gap:5px;--sizeHig:36px;}
.visual .page_util>li									{ position:relative; }
.visual .page_util>li>button								{ display:flex; width:var(--sizeHig); height:var(--sizeHig); border-radius:100%; background:var(--color-point); }
.visual .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%;    }
.visual .page_util>li .share_bt:before					{ background-image:url(/resource/camping/images/sub/ico_share.svg); background-size:16px;}
.visual .page_util>li>button.copy:before					{ background-image:url(/resource/camping/images/sub/ico_copy_link.svg);}
.visual .page_util>li>button.print:before				{ background-image:url(/resource/camping/images/sub/ico_print.svg); background-size:17px 16px;}
.visual .page_util>li>button.braille:before				{ background-image:url(/resource/camping/images/sub/ico_bx_link.svg); background-size:19px 10px;}
.visual .page_util>li>button.braille_down:before			{ background-image:url(/resource/camping/images/sub/ico_bx_down.svg); background-size:21px 13px; background-position:50% 55%}
.visual .page_util>li.share .share_drop												{ display:none; position:absolute; top:-1px; left:-1px; z-index:10; width:calc(var(--sizeHig) + 2px); box-sizing:border-box; background-color:var(--color-white);
    border:1px solid #e5e5e5;  text-align:center;  border-radius:10px;}
.visual .page_util > li.share .share_drop ul											{ padding-top:10px; display:flex; flex-flow:column; gap:7px; }
.visual .page_util > li.share .share_drop ul > li a									{ display:flex; justify-content:center; align-items:center; width:100%; height:100%;}
.visual .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%;}
.visual .page_util > li.share .share_drop ul > li[data-share="blog"] a:before		{ background-image:url(/resource/camping/images/sub/icon_blog.svg); background-color:#32b44a;}
.visual .page_util > li.share .share_drop ul > li[data-share="youtube"] a:before		{ background-image:url(/resource/camping/images/sub/icon_youtube.svg); background-color:#e03232;}
.visual .page_util > li.share .share_drop ul > li[data-share="facebook"] a:before	{ background-image:url(/resource/camping/images/sub/icon_facebook.svg); background-color:#385691;}
.visual .page_util > li.share .share_drop ul > li[data-share="instar"] a:before		{ background:url(/resource/camping/images/sub/icon_instar.svg) no-repeat 50% 50% / cover, linear-gradient(to bottom right, #4a48e8 20% , #ee3183 60%, #f0c05c 100%);}
.visual .page_util > li.share .share_drop ul > li[data-share="kakao"] a:before		{ background-image:url(/resource/camping/images/sub/icon_kakaoch.svg); background-color:#ffde00; }
.visual .page_util > li.share .share_drop ul > li[data-share="twitter"] a:before		{ background-image:url(/resource/camping/images/sub/icon_twitter.png); background-color:#000;}
.visual .page_util > li.share .share_drop ul > li[data-share="band"] a:before		{ background-image:url(/resource/camping/images/sub/icon_band.png); background-color:#50b748;}
.visual .page_util > li.share .share_drop ul > li[data-share="copy"] a:before		{ background-image:url(/resource/camping/images/sub/icon_copy.svg); background-color:#555555;}
.visual .page_util > li.share .share_close											{ position:relative; width:30px; height:30px; margin-top:10px; margin-bottom:5px; background:#e5e5e5; border-radius:100%;}
.visual .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); }
.visual .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);}
.visual .page_util > li.share .share_close:hover										{ transform:rotate(90deg); }

@media all and (max-width:1368px){
    .visual															{--sizeWidth:620px;padding-top:60px;}
    .visual .txt													{margin-top: 2em;}
    .visual .txt .green										        {font-size:1.25em;}
    .visual .txt .ti                                                    {gap:.75em 1.5em;}
    .visual .txt .ti h2									                {font-size:3.25em;}
    .visual	.img													{height:256px;}
}

@media all and (max-width:1268px){
    .visual															{--sizeWidth:560px;padding-top:50px;flex-wrap: wrap; justify-content: flex-end;}
    .visual .txt													{width:100%;margin-top: 0;}
    .visual .txt .ti h2									            {font-size:3em;}
    .visual	.img													{height:231px;}
}
@media all and (max-width:1024px){
    .visual															{--sizeWidth:520px;padding-top:40px;}
    .visual	.img													{height:215px;}

}

@media all and (max-width:968px){
    .visual															{--sizeWidth:480px;}
    .visual .txt .ti h2									            {font-size:2.75em;}
    .visual	.img													{height:198px;}
}

@media all and (max-width:868px){
    .visual															{--sizeWidth:400px;}
    .visual .txt .green										    {font-size:1.125em;}
    .visual .txt .ti h2								            {font-size:2.5em;}
    .visual	.img													{height:165px;}
}

@media all and (max-width:768px){
    .visual															{padding:40px 0;}
    .visual	.img													{display:none;}
    .visual	.txt														{width:100%;}
}


@media all and (max-width:668px){
    .visual .txt .green									            	{font-size:1.063em;}
    .visual .txt .ti h2									                {font-size:2.375em;}
    .visual  .page_util>li.share .share_drop							{ width:calc(var(--sizeHig) + 12px); left:-6px; }
}


@media all and (max-width:468px){
    .visual															{padding:30px 0;}
    .visual .txt .green									        	{font-size:1em;}
    .visual .txt .ti h2									            {font-size:2em;}
    .visual .page_util												{--sizeHig:32px;}
}


/**********************************************************************

 								location 

**********************************************************************/

/* 위치 */
.location_wrap													{ width:100%; margin-top: -5.1em;background:var(--color-point);border-radius:2.5em;display:flex; align-items:center; justify-content:space-between; --sizeHig:80px; height:var(--sizeHig) }
.location_wrap .lco												{ display:flex; align-items:center;flex-wrap:wrap; }
.location_wrap .lco>li											{ position:relative;z-index:9;}
.location_wrap .lco>li::after									{content:''; position: absolute;top: 50%;right:0;transform: translateY(-50%);display:block;width:1px;height:13px;background:#fff;opacity:.3;}
.location_wrap .lco>li:last-child::after						{display:none;}
.location_wrap .lco [data-location="home"]				{padding:.625em;padding-right:0;}
.location_wrap .lco [data-location="home"]::after		{display:none;}
.location_wrap .lco [data-location="home"] a					{ display:flex; font-size:0px; width:calc(var(--sizeHig) - 20px); height:calc(var(--sizeHig) - 20px);  border-radius:100%;background:#fff;}
.location_wrap .lco [data-location="home"] a::before			{ content:''; display:block; width:100%; height:100%; background:url(/resource/camping/images/sub/icon_home.svg) no-repeat 50% 50%; background-size:auto 20px; opacity:1; }
.location_wrap .lco>li>button									{ display:flex; height:var(--sizeHig); align-items:center;padding:0 50px;padding-right:calc(50px + 2.5em);color:#fff;line-height:1; }
.location_wrap .lco>li:last-child>button						{opacity:1;}
.location_wrap .lco>li>button::before							{ position:absolute; right:0; top:50%; width:7px; height:7px; border-style:solid; border-width:0 1px 1px 0; border-color:#fff; transform:translateY(-80%) rotate(45deg); transition:var(--trans-ani); content:''; vertical-align:middle;  top:50%; right:2.5em; }
.location_wrap .lco>li.active>button::before					{ transform:translateY(-40%) rotate(225deg); }
.location_wrap .lco>li:not(:has(button))						{ padding:0;min-width:auto; }
.location_wrap .lco>li .loc_wrap								{ position:absolute; display:none; top: calc(var(--sizeHig) - 1.125em);left:-1px; z-index:112; width:calc(100% + 2px); padding:1.25em; background:var(--color-white); box-shadow: 0 0 10px rgba(0, 0, 0, .1);border-radius:10px;}
.location_wrap .lco>li .loc_wrap li > a							{ width:100%;display:inline-flex; justify-content:flex-start; align-items:center; padding:5px 0px; color:var(--color-base); transition:var(--trans-ani); opacity:.64; 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/camping/images/common/icon_blank.svg) no-repeat 50% 50% / auto 10px; }
.location_wrap .lco>li .loc_wrap li > a:hover,
.location_wrap .lco>li .loc_wrap li > a:focus					{ opacity:1; color:var(--color-point);}



@media all and (max-width:1368px){
    .location_wrap														{margin-top:-4.8em;}
    .location_wrap .lco>li .loc_wrap li > a							{ font-size:.9rem; }
}


@media all and (max-width:1268px){
    .location_wrap														{margin-top:-4.3em;--sizeHig:70px;}
}
@media all and (max-width:1168px){
    .location_wrap .lco>li>button									{ font-size:.9rem; padding:0 2.5em;padding-right:5em;}
    .location_wrap .lco>li .loc_wrap								{ padding:1em; }
    .location_wrap .lco>li .loc_wrap li > a							{ font-size:.85rem; }
}

@media all and (max-width:1024px){
    .location_wrap														{margin-top:-4.6em;}
}

@media all and (max-width:968px){
    .location_wrap														{margin-top:-4.3em;}
}

@media all and (max-width:868px){
    .location_wrap														{margin-top:-3.55em;}
}

@media all and (max-width:768px){
    .location_wrap													{margin-top:0;--sizeHig:60px;}
    .location_wrap .lco>li>button									{ padding:0 2em;padding-right:4.5em; }
}

@media all and (max-width:668px){
    .location_wrap .lco>li											{ font-size:.95em; }
}
@media all and (max-width:568px){
    .location_wrap													{--sizeHig:50px;}
    .location_wrap .lco [data-location="home"]				{padding:0 .5em 0 1em;}
    .location_wrap .lco [data-location="home"]::after		{display:block;}
    .location_wrap .lco [data-location="home"] a			{background:transparent;width:var(--sizeHig);height:var(--sizeHig);}
    .location_wrap .lco [data-location="home"] a::before {filter: brightness(0) invert(1);background-size:auto 16px;}
    .location_wrap .lco>li>button								{padding:0 1.5em;padding-right:3.25em;}
  	.location_wrap .lco>li>button::before						{right:2em;}
}

@media all and (max-width:468px){
    .location_wrap												{flex-wrap:wrap;border-radius:12px;height:auto;--sizeHig:30px;padding: 10px;}
    .location_wrap .lco [data-location="home"]					{padding: 0;padding-right: 10px;margin-right: 10px;}
    .location_wrap .lco [data-location="home"]::after			{right: 0;transform:translateY(-50%) rotate(45deg);border-width: 1px 1px 0 0;opacity:1;background:none;border-style: solid;border-color: #fff;width: 7px;height: 7px;}
    .location_wrap .lco [data-location="home"] a				{width:25px;}  
  	.location_wrap .lco>li::after								{display:none;}
    .location_wrap .lco>li>button								{padding:0;padding-right: 10px;margin-right: 10px;pointer-events:none;}
  	.location_wrap .lco>li:last-child>button						{padding-right:0;margin-right:0;}
    .location_wrap .lco>li>button::before						{right: 10px;transform:translateY(-50%) rotate(45deg);border-width: 1px 1px 0 0;}
    .location_wrap .lco>li:last-child>button::before			{display:none;}
}



/**********************************************************************

 									title 

**********************************************************************/

.h3_title														{ position:relative;text-align:center; margin:2em 0 1.5em;font-size:2.5em; font-weight:700; line-height:1;color:var(--color-base);font-family:var(--font-paperlogy);}

@media all and (max-width:1368px){
    .h3_title													{ font-size:2.375em; margin:1.875em 0 1.375em;}

}
@media all and (max-width:968px){
    .h3_title													{ font-size:2em; margin:1.75em 0 1.25em;}
}

@media all and (max-width:668px){
    .h3_title													{ font-size:1.875em;margin:1.5em 0 1.125em; }
}

@media all and (max-width:468px){
    .h3_title													{ font-size:1.625em;margin:1.375em 0 1em; }
}