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


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

 								공통

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

/* img_box */
[data-subarea] .img_box												{ position:relative; display:flex; align-items:center; width:100%; height:320px; overflow:hidden;margin-bottom:1.5em;border-radius:12px;overflow:hidden;}
[data-subarea] .img_box	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;} 

/* box_img */
[data-subarea] .box_img												{border:1px solid #ddd;border-radius:10px;padding:1.25em; }
[data-subarea] .box_img	img											{display:block;margin:0 auto;}


/* text_line */
[data-subarea] .text_line										{display:flex;gap:0 3.75em;flex-wrap:wrap;}
[data-subarea] .text_line > li									{width:calc((100% - 3.75em) / 2);border-bottom:1px solid #e5e5e5;padding:3em 0;}
[data-subarea] .text_line > li	dl dt							{font-size:1.625em;font-weight:400;margin-bottom: .715em;line-height: 1.2;}
[data-subarea] .text_line > li	dl dt strong					{font-weight:700;}
[data-subarea] .text_line > li	dl dd .basic_ul>li				{font-weight:300;line-height:1.5;}
[data-subarea] .text_line > li	dl dd .basic_ul>li:before	{top:12px;}


/* icon_list */
[data-subarea] .icon_list										{display:flex;gap:20px 10px;flex-wrap:wrap;align-items:center;}
[data-subarea] .icon_list > li									{flex:1 1 auto;}
[data-subarea] .icon_list > li dl								{display:flex;align-items:center;flex-wrap:wrap;gap:20px;}
[data-subarea] .icon_list > li dl dt							{display:flex;align-items:center;gap:12px;font-size:1.25em;font-weight:700;}
[data-subarea] .icon_list > li dl dt strong						{font-weight:700;}
[data-subarea] .icon_list > li dl dt .icon						{width:46px;height:46px;background:#ebf1fa;border-radius:100%;}
[data-subarea] .icon_list > li dl dt .icon::before				{content:'';display:block;width:100%;height:100%;background-repeat:no-repeat;background-position:center;background-size:100%;}
[data-subarea] .icon_list > li dl dd							{font-size:1.25em;color:#444;}

/* box_list */
[data-subarea] .box_list										{display:flex;gap:.75em;flex-wrap:wrap;}
[data-subarea] .box_list > li									{width:calc((100% - 2.25em) / 4);border:1px solid #ddd;;border-radius:12px;padding:1.875em;}
[data-subarea] .box_list.col01 > li								{width:100%;}
[data-subarea] .box_list.col02 > li								{width:calc((100% - .75em) / 2)}
[data-subarea] .box_list.col03 > li								{width:calc((100% - 1.5em) / 3)}
[data-subarea] .box_list > li dt								{font-size:1.125em;font-weight:700;margin-bottom:.5em;}
[data-subarea] .box_list > li dd								{color:var(--color-base1);}

/* 일반 링크 */
[data-subarea] .basic_newtab											{display:inline-block; position:relative;}
[data-subarea] .basic_newtab:after										{ content:''; opacity:1; display:inline-block; width:13px; height:11px; margin-left:7px; background: url(/resource/common/images/common/icon_blank.svg) no-repeat 50% 50%;background-size:100%;filter: invert(10%) sepia(97%) saturate(3995%) hue-rotate(210deg) brightness(99%) contrast(103%);}

/* 슬라이드 */
[data-subarea] .img_slide										{position:relative;}
[data-subarea] .slide_item										{border-radius:12px;overflow:hidden;}
[data-subarea] .slide_item img + span[data-alt],
[data-subarea] .slide_item picture + span[data-alt]				{ position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; z-index:2; text-indent:-9999em; white-space:nowrap; }
[data-subarea] .swiper_control	.control						{display:flex;justify-content: space-between;gap:30px;min-width:20%;border: 1px solid #e5e5e5;position: absolute;left: 50%;transform: translateX(-50%);bottom: calc(var(--sizeHig) / -2);z-index: 1;--sizeHig: 50px;height: var(--sizeHig);padding: 0 28px;border-radius: 25px;background: #fff;}
[data-subarea] .swiper_control	.control .slide_subject			{font-size:1.125em;text-align:center;}
[data-subarea] .swiper_prev,
[data-subarea] .swiper_next,
[data-subarea] .swiper_auto									{width: 24px;height: 24px;}													
[data-subarea] .swiper_prev::before,
[data-subarea] .swiper_next::before							{width: 10px;height: 14px;background-size:auto 14px;}
[data-subarea] .swiper_auto::before							{ background-size:10px 12px; }	

/* .basic_ul > */
.basic_ul li .basic_p											{font-size: initial;}

/* .basic_table */
table.basic_table thead th										{font-size:1.125rem;}
table.basic_table tbody td,
table.basic_table .basic_ul>li									{font-size:1.063rem;}
table.basic_table .basic_ul>li:before							{top:7px;}

@media all and (max-width:1568px) {
  /* .basic_table */
  table.basic_table thead th									{font-size:initial;}
  table.basic_table tbody td,
  table.basic_table .basic_ul>li								{font-size:initial;}
  table.basic_table .basic_ul>li:before							{top:6px;}
}

@media all and (max-width:1468px) {
  	/* icon_list */
  	[data-subarea] .icon_list > li											{flex: 1 1 calc((100% - 10px) / 2);}
}

@media all and (max-width:1368px) {
	/* img_box */
	[data-subarea] .img_box													{height:300px;}

	/* text_line */
	[data-subarea] .text_line												{gap: 0 3.125em;}
	[data-subarea] .text_line > li											{ width: calc((100% - 3.125em) / 2);padding:3em 0;}
	[data-subarea] .text_line > li dl dt									{font-size:1.5em;margin-bottom:.5em;}
	[data-subarea] .text_line > li dl dd .basic_ul>li:before				{top:11px;}
  
  	/* box_list */
  	[data-subarea] .box_list > li											{padding:1.5em;}
}

@media all and (max-width:1268px) {
	/* box_list */
	[data-subarea] .box_list												{gap:.7em}
	[data-subarea] .box_list > li											{width: calc((100% - 2.1em) / 4);}
	[data-subarea] .box_list.col02 > li									{width:calc((100% - .7em) / 2)}
	[data-subarea] .box_list.col03 > li									{width:calc((100% - 1.4em) / 3)}
}

@media all and (max-width:1168px) {
	/* text_line */
	[data-subarea] .text_line											{gap: 0 3em;}
	[data-subarea] .text_line > li										{ width: calc((100% - 3em) / 2);padding:2.75em 0;}
	[data-subarea] .text_line > li dl dt								{font-size:1.375em;margin-bottom:.375em;}
	[data-subarea] .text_line > li dl dd .basic_ul>li:before			{top:9px;}
}


@media all and (max-width:1024px) {
	/* img_box */
	[data-subarea] .img_box												{height:280px;margin-bottom:1em;}
  
  	/* 슬라이드 */
  	[data-subarea] .swiper_control .control							{--sizeHig:46px;padding:0 24px;}
  	[data-subarea] .swiper_prev,
  	[data-subarea] .swiper_next,
 	[data-subarea] .swiper_auto											{width:20px;height:20px;}
  	[data-subarea] .swiper_prev::before,
  	[data-subarea] .swiper_next::before									{width: 8px;height: 12px;background-size: auto 12px;}
  	[data-subarea] .swiper_auto::before									{background-size: 8px 10px;}
  
  	/* .basic_table */
  	table.basic_table .basic_ul>li:before								{top:6.5px;}
}

@media all and (max-width:968px) {
  	[data-subarea] .box_img												{padding:1em; border-radius:8px;}
  
    /* icon_list */
  	[data-subarea] .icon_list											{align-items:flex-start}		
    [data-subarea] .icon_list > li dl									{flex-flow: column;align-items: flex-start;gap:10px;}
}

@media all and (max-width:868px) {
	/* img_box */
	[data-subarea] .img_box												{height:260px;}

	/* text_line */
	[data-subarea] .text_line											{gap: 0 2.5em;}
	[data-subarea] .text_line > li										{ width: calc((100% - 2.5em) / 2);padding:2.5em 0;}
	[data-subarea] .text_line > li dl dt								{font-size:1.25em;margin-bottom:.25em;}
	[data-subarea] .text_line > li dl dd .basic_ul>li					{line-height:1.28;}
	[data-subarea] .text_line > li dl dd .basic_ul>li:before			{top:6px;}
  
 	 /* box_list */
	[data-subarea] .box_list												{gap:10px;}
	[data-subarea] .box_list > li											{width: calc((100% - 10px) / 2);border-radius:10px;}
	[data-subarea] .box_list.col02 > li										{width:calc((100% - 10px) / 2)}
	[data-subarea] .box_list.col03 > li										{width:calc((100% - 20px) / 3)}
  
  	/* 슬라이드 */
  	[data-subarea] .swiper_control	.control							{min-width:65%;}
}

@media all and (max-width:768px) {
  	/* img_box */
  	[data-subarea] .img_box											{margin-bottom:0;}
  
	/* text_line */
	[data-subarea] .text_line > li									{ width: 100%;padding:2em 0;}
	[data-subarea] .text_line > li:nth-child(2)						{border-top:none;}
  
  	/* icon_list */
  	[data-subarea] .icon_list > li dl dt							{font-size:1.125em;}
  	[data-subarea] .icon_list > li dl dt .icon						{width:40px;height:40px;}
 	[data-subarea] .icon_list > li dl dd							{font-size:1.125em;}
}

@media all and (max-width:668px) {
	/* img_box */
	[data-subarea] .img_box											{height:240px;}
  
  	/* 슬라이드 */
  	[data-subarea] .swiper_control	.control						{width:100%;justify-content: center;height:auto;padding: 8px 16px;position: inherit;transform: none;margin: 10px auto;flex-wrap: wrap;gap: 6px 12px;border-radius: 8px;}
  	[data-subarea] .swiper_control .control .slide_subject			{max-width:100%;}
}

@media all and (max-width:468px) {
	/* img_box */
	[data-subarea] .img_box											{height:200px;}
  
  	/* icon_list */
  	[data-subarea] .icon_list > li									{flex: 1 1 100%;}
  
  	/* box_list */
	[data-subarea] .box_list										{gap:6px;}
	[data-subarea] .box_list > li,
	[data-subarea] .box_list.col02 > li,
	[data-subarea] .box_list.col03 > li								{width: 100%;border-radius:8px;padding:1.25em;}
  
}


@media all and (max-width:368px) {
	/* img_box */
	[data-subarea] .img_box											{height:160px;}
}

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

 							오시는 길

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

[data-subarea="location"] .map_box					{ position:relative; overflow:hidden; width:100%; height:400px;border:1px solid rgba(0,0,0,.1); }
[data-subarea="location"] .map_box .root_daum_roughmap	{ width:calc(100% + 2px); height:calc(400px + 2px); position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}

[data-subarea="location"] .icon_list > li dl dt .icon.map::before			{background-image:url(/resource/town/images/contents/icon_map.svg);}
[data-subarea="location"] .icon_list > li dl dt .icon.bus::before			{background-image:url(/resource/town/images/contents/icon_bus.svg);}
[data-subarea="location"] .icon_list > li dl dt .icon.call::before			{background-image:url(/resource/town/images/contents/icon_call.svg);}
[data-subarea="location"] .icon_list > li dl dt .icon.fax::before			{background-image:url(/resource/town/images/contents/icon_fax.svg);}
[data-subarea="location"] .icon_list > li dl dd .basic_newtab:after			{width:15px;height:14px;}

@media all and (max-width:1024px) {
  [data-subarea="location"] .map_box				{height:350px;}
}

@media all and (max-width:768px){
  	[data-subarea="location"] .map_box				{height:300px;}
 	[data-subarea="location"] .icon_list > li dl dd .basic_newtab:after{width:13px;height:11px;}
}

@media all and (max-width:668px){
	[data-subarea="location"] .map_box				{ height:250px; }
}


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

 							문화유적

**********************************************************************/
[data-subarea="heritage"] .slide_item								{ position:relative;overflow:hidden; width:100%; height:0;padding-top: calc(100% / 2.5 * 1);}
[data-subarea="heritage"] .slide_item img,
[data-subarea="heritage"] .slide_item picture						{ 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;transition:var(--trans-ani);}


@media all and (max-width:468px){
  [data-subarea="heritage"] .slide_item								{padding-top: calc(100% / 3 * 2);}
}


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

 							특산물

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

[data-subarea="specialty"] .banner										{background:url('/resource/town/images/contents/bg_gochujang.jpg') no-repeat center bottom / cover;border-radius:12px;padding:3em;}
[data-subarea="specialty"] .banner .flex								{display:flex;gap:3.5em;--sizeImg:520px;align-items:center;}
[data-subarea="specialty"] .banner .flex .img							{position:relative;overflow:hidden;width:var(--sizeImg);height: var(--sizeImg);border-radius:12px;overflow:hidden;min-height: 180px;}
[data-subarea="specialty"] .banner .flex .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;} 
[data-subarea="specialty"] .banner .flex .text							{width:calc(100% - 3.5em - var(--sizeImg));}
[data-subarea="specialty"] .banner .flex .text .title_h4				{font-family:var(--font-esamanru);font-weight:500;font-size:2em;color:var(--color-base);margin-bottom:.75em;}
[data-subarea="specialty"] .banner .flex .text .list					{display:flex;flex-flow:column;gap:12px;}
[data-subarea="specialty"] .banner .flex .text .list > li				{display:flex;gap:1.5em;align-items:center;background:var(--color-white);border:1px solid #ece4de;border-radius:8px;padding:1.375em;--sizeNum:50px;}
[data-subarea="specialty"] .banner .flex .text .list > li .num			{width:var(--sizeNum);height:var(--sizeNum);background:#e30000;color:var(--color-white);line-height:var(--sizeNum);font-family:var(--font-esamanru);font-weight:500;font-size:1.375em;border-radius:100%;text-align:center;}
[data-subarea="specialty"] .banner .flex .text .list > li .basic_p		{width:calc(100% - 1.5em - var(--sizeNum));color:#473939;}
[data-subarea="specialty"] .banner .flex .text .list > li .basic_p strong{color:#372d2d;}


@media all and (max-width:1368px){
  [data-subarea="specialty"] .banner									{padding:2.5em;}
  [data-subarea="specialty"] .banner .flex								{gap:3em; --sizeImg: 460px;}
  [data-subarea="specialty"] .banner .flex .text						{width: calc(100% - 3em - var(--sizeImg));}
  [data-subarea="specialty"] .banner .flex .text .title_h4				{font-size:1.875em;}
  [data-subarea="specialty"] .banner .flex .text .list					{gap:10px;}
  [data-subarea="specialty"] .banner .flex .text .list > li				{padding:1.25em;gap:1.25em;--sizeNum: 46px;}
  [data-subarea="specialty"] .banner .flex .text .list > li .num		{font-size:1.25em;}
}

@media all and (max-width:1268px){
  [data-subarea="specialty"] .banner									{padding:2.25em;}
  [data-subarea="specialty"] .banner .flex								{gap:2.5em; flex-flow:column}
  [data-subarea="specialty"] .banner .flex .img							{width:100%;height:0;padding-top: calc(100% / 3  * 1);overflow:hidden;position:relative;}
  [data-subarea="specialty"] .banner .flex .img img						{transform: translate(-50%, -48%);-ms-transform: translate(-50%,-48%);-webkit-transform: translate(-50%, -48%);-moz-transform: translate(-50%,-48%);}
  [data-subarea="specialty"] .banner .flex .text						{width:100%;}
  [data-subarea="specialty"] .banner .flex .text .title_h4				{font-size:1.5em;}
  [data-subarea="specialty"] .banner .flex .text .list					{gap:8px;}
  [data-subarea="specialty"] .banner .flex .text .list > li				{padding:1.125em;gap:1em;--sizeNum: 40px;}
  [data-subarea="specialty"] .banner .flex .text .list > li .num		{font-size:1.125em;}
}

@media all and (max-width:768px){
  [data-subarea="specialty"] .banner									{padding:2em;}
  [data-subarea="specialty"] .banner .flex								{gap:2em;}
  [data-subarea="specialty"] .banner .flex .text .list					{gap:6px;}
  [data-subarea="specialty"] .banner .flex .text .list > li				{padding: 1em;--sizeNum: 40px;}
}


@media all and (max-width:468px){
	[data-subarea="specialty"] .banner									{padding:1.5em;}
	[data-subarea="specialty"] .banner .flex .text .list > li			{flex-flow:column;align-items:flex-start;--sizeNum: 36px;gap:.5em;}
	[data-subarea="specialty"] .banner .flex .text .list > li .basic_p	{width:100%;}
	[data-subarea="specialty"] .banner .flex .text .list > li .num		{font-size:1.063em;}
}