@charset "utf-8";
/* CSS Document */

/**********************************************************************
                          공통 사용
**********************************************************************/
.content .title_wrap                              { display:flex; flex-flow:column; align-items:center; justify-content:center; margin-top:5em; margin-bottom:2.5em; line-height:1.1; text-align:center}                     
.content .title_wrap .sub_tit                     { font-size:1.38em; font-weight:300; }
.content .title_wrap .h3_title                    { font-size:2.81em; margin-top:.5em; font-family: var(--font-ttt);}
.content .h4_title                                { font-family:var(--font-ttt); font-size:2.222em; color:var(--color-black); margin-top:1.125em}

.content strong                                   { font-weight:600 }

.basic_p { font-size:1.125em }

.list_type01 li                                   { position:relative; padding-left:1.25em; font-size:1.125em}
.list_type01 li:before                            { content:''; position:absolute; top:9px; left:0; background:url("/resource/tour/images/contents/list_type01.svg") no-repeat; opacity: .5; width:12px; height:14px;}
.list_type01 li+li                                { margin-top:5px; }

.mb2em{margin-bottom:2em;}

.color_red										  { color:var(--color-red) !important; }


/*
.image_list                                       { display:flex; flex-wrap:wrap; gap:2em;  }
.image_list li                                    { width:calc(100% / 4 - 1.5em); position:relative; }
.image_list li figure                             { position:relative; overflow:hidden; border-radius:12px }
.image_list li:before                             { display:block; content:""; width:100%; height:100%; border:1px solid var(--color-line); position:absolute; bottom:0; left:0; border-radius:10px 30px 10px 10px; }
.image_list img                                   { position:relative; width: 100%; height: 100%; object-fit: cover; transition: .4s; }
.image_list figcaption                            { font-size:1.375em; padding:1em; font-weight:700 }
*/

.tar + .mob_info + .scrollTable table.basic_table	{margin-top:0}
table.basic_table.tal td,
table.basic_table td:has(.basic_ul)					{text-align:left;}

@media all and (max-width:1280px){  
  .content .title_wrap                            { margin-top:2.5em; }
  .content .title_wrap .h3_title                  { font-size:2.3em; }
  .content .h4_title                              { font-size:1.875em }
}

@media all and (max-width:1024px){  
  .content .title_wrap                            { margin-top:2.5em; }
  .content .title_wrap .h3_title                  { font-size:2.3em; }
  .content .h4_title                              { font-size:1.75em }
/*  
  .image_list li                                  { width:calc(100% / 3 - 1.34em) !important; }
*/
}

@media all and (max-width:768px){  
  .content .title_wrap                            { margin-top:2em;margin-bottom:2em;}
  .content .title_wrap .h3_title                  { font-size:2em; }
  .content .title_wrap .sub_tit                   { font-size:1em }
  .content .h4_title                              { font-size:1.563em }
  
  .fs20                                           { font-size:1em }
  .basic_p,
  .list_type01 li                                 { font-size:1em; }
  .list_type01 li:before                          { top:5px }

  /*
  .image_list                                     { gap:1em; }
  .image_list li                                  { width:calc(100% / 2 - .5em) !important; }
  .image_list figcaption                          { font-size:1.125em; }
  */
}

@media all and (max-width:468px){  
  /*
    .image_list li                                { width:100% !important; }
  */
  .content .title_wrap .h3_title                  { font-size:1.88em; }
}

.basic_box{border:1px solid #ddd; padding:2em; position:relative; display:flex; flex-wrap:wrap;}
.basic_box:before{content:""; display:block; width:calc(100% - 2em); height:calc(100% - 2em); position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; background:#fafafa; z-index:-1}
.basic_box i{display:block; width:2em; height:2em;}


/* 공공누리 */
#aside.con_inner{box-sizing:border-box;}

/**********************************************************************
                              10경
**********************************************************************/

.ten_view                                         { position:relative; margin-bottom:6.25em;}
.ten_view:before                                  { content:''; position:absolute; top:-50px; right:20px; display:block; background:url("/resource/tour/images/contents/character01.svg") no-repeat; width:300px; height:225px; z-index: 2}

.ten_view .ten_img                                { position: absolute; top: 80px; left: 0; width: 700px; height: 440px; border-radius: 20px 20px 80px 20px; overflow: hidden; box-shadow: 5px 5px 20px rgba(0,0,0,.2); z-index: 2;}
.ten_view .ten_img img                            { width: 100%; height: 100%; object-fit: cover; transition: .4s;}
.ten_view .ten_img:hover img                      { transform: scale(1.04); }

.ten_view .ten_list                               { position: relative; width: 1090px; height: 470px; margin-left: auto; background: #f3f7ff; border-radius: 20px; z-index: 1; padding: 90px 40px 40px 370px; overflow: hidden;}
.ten_view .ten_list .bg_num                       { position: absolute; right: 10px; bottom: -45px; font-family: var(--font-ttt); font-size: clamp(100px, 12vw, 14em); color: var(--color-point2); opacity: .1; pointer-events:none; user-select: none; font-weight: 700; line-height: 1; letter-spacing:-0.1em;}
.ten_view .ten_list .ten_title                    { font-family:var(--font-ttt);  }
.ten_view .ten_list .ten_title .num               { font-size: 1.563em; }
.ten_view .ten_list .ten_title .name              { font-size: 3.125em; color:var(--color-point2); line-height: 1.2em}
.ten_view .ten_list .text                         { font-size: 1.25em; margin:0.5em 0 1.5em 0; font-weight: 500}

.ten_view .ten_list .info                         { display:flex; flex-direction:column; gap:8px;  }
.ten_view .ten_list .info li                      { position: relative; padding-left: 52px; min-height: 42px; display: flex; align-items: center; font-size:1.125em;}
.ten_view .ten_list .info li:before               { content: ''; position: absolute; left: 0; top: 0; width: 42px; height: 42px; border-radius: 50%; background: var(--color-point2)  no-repeat center/40%;}
.ten_view .ten_list .info li.addr:before          { background-image: url("/resource/tour/images/contents/icon_addr_w.svg");}
.ten_view .ten_list .info li.tel:before           { background-image: url("/resource/tour/images/contents/icon_tel_w.svg");}
.ten_view .ten_list .info li.home:before          { background-image: url("/resource/tour/images/contents/icon_home_w.svg");}

@media (max-width:1550px) {
  .ten_view                                       { display:flex; justify-content:space-between;  margin-bottom:5em}
  .ten_view:before                                { top:-100px; width:230px; height:173px }
  .ten_view .ten_img                              { width:50%; top:inherit; left:inherit; border-radius: 20px 0 0 20px; position: inherit;}
  .ten_view .ten_list                             { width:50%; height:440px; padding:40px; border-radius: 0 20px 20px 0}
  .ten_view .ten_list .ten_title .name            { font-size:2.6em; }
}

@media (max-width:1024px) {
  .ten_view                                       { flex-direction:column; margin-bottom:4em;}
  .ten_view:before                                { display:none;}

  .ten_view .ten_img                              { width:100%; border-radius:20px 20px 0 0; }
  .ten_view .ten_list                             { width:100%; border-radius: 0 0 20px 20px; height:auto; padding:30px;}
  .ten_view .ten_list .bg_num                     { bottom:-25px; }  
}


@media (max-width:768px) {
  .ten_view                                       { margin-bottom:2em; }
  .ten_view .ten_img                              { height:300px; }
  .ten_view .ten_list                             { padding:20px; }
  .ten_view .ten_list .ten_title .name            { font-size:2em; }
  .ten_view .ten_list .text                       { font-size:1.125em; }
  .ten_view .ten_list .info li                    { min-height:30px;padding-left:37px;}
  .ten_view .ten_list .info li:before             { width:30px; height:30px; }
  .ten_view .ten_list .info .home a               { font-size: 0; position: relative;}
  .ten_view .ten_list .info .home a::after        { content: "홈페이지 이동"; display: inline-block; color: var(--color-point2); font-size:16px; }
}

/* 코스 */
.course       { background:#f3f3ff; border-radius:20px; padding:20px; margin-bottom:2em}
.course .lst {list-style:none;margin:0;padding:0;}
.course .lst li {position:relative;display:inline-block;vertical-align:top;border-radius:20px;line-height:38px;padding:0 15px 0 45px;margin:5px 37px 5px 0; background: var(--color-white); box-shadow: 5px 5px 10px rgba(0,0,0,.2); font-size:1.125em;}
.course .lst li a {display:flex; align-items: center; padding:10px 0}
.course .lst li .num {position:absolute;top:50%;left:5px;width:30px;height:30px;background:var(--color-point);border-radius:50%;font-size:14px;font-weight:600;color:var(--color-white);text-align:center;line-height:30px;margin-top:-15px}
.course .lst li .text   { display:block; line-height:1.2 }
.course .lst li:after {position:absolute;top:50%;right:-30px;content:"";display:block;width:15px;height:15px;background:url("/resource/tour/images/contents/course_arrow.svg") no-repeat ;transform: translateY(-50%); }
.course .lst li:last-child {margin-right:0}
.course .lst li:last-child:after {display:none}

@media (max-width:768px) {
  .course .lst li {display:block;margin:0;margin-top:30px; }
  .course .lst li:first-child {margin-top:0}
  .course .lst li:after {width:15px;height:15px;right:auto;left:50%;margin-left:-4px;top:auto;bottom:-22px; transform: rotate(90deg);}
}



.basic_box{border:1px solid #ddd; padding:4em 2.5em; position:relative; display:flex; flex-wrap:wrap; gap:2em; align-items:center; margin-bottom:3em; border-radius:1em;}
.basic_box:before{content:""; display:block; width:calc(100% - 2em); height:calc(100% - 2em); position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; background:#f3f3ff; z-index:-1; border-radius:1em;}
.basic_box i{display:block; width:20em; height:10em; background-size:contain; background-repeat:no-repeat; background-position:center;}
.basic_box i + *{max-width:calc(100% - 24em);}
.basic_box dt{font-size:2em; margin-bottom:.5em; font-family:var(--font-ttt);}
.basic_box dt strong{font-weight:600}
.basic_box dt strong.big{ font-weight:700; font-size:1.2em}
.basic_box dd{color:#444; font-size:1.1em}
@media (max-width:768px) {
  .basic_box i{width:10em; height:6em}
  .basic_box i + *{max-width:calc(100% - 12em);}
  .basic_box dt{font-size:1.7em; line-height:1.3em}
}
@media (max-width:540px) {
  .basic_box{display:block; gap:0; padding:2.5em}
  .basic_box i{width:100%;}
  .basic_box i + *{max-width:100%; margin-top:1em; text-align:center;}
  .basic_box dt{font-size:1.45em; line-height:1.3em}
  .basic_box .basic_ul{text-align:left;}
}

[data-subarea="1330"] .basic_box i{background-image:url(/resource/tour/images/contents/img_1330.png)}
[data-subarea="navigation"] .basic_box i{background-image:url(/resource/tour/images/contents/img_navigation.png)}
[data-subarea="promotional"] .basic_box i{background-image:url(/resource/tour/images/contents/img_promotional.png)}
[data-subarea="subsidy"] .basic_box i{background-image:url(/resource/tour/images/contents/img_subsidy.png)}
.basic_box.kind i{background-image:url(/resource/tour/images/contents/img_kind.png)}
.data_list{display:flex;flex-wrap:wrap;gap:2em 2em;align-items:stretch;}
.data_list>li{background:#fafafa; padding:2em; /*flex:1 0 auto;*/ min-height:200px; max-width:100%; position:relative; border-radius:1em; /*min-width:30%*/flex:1 1 30%;}
.data_list>li:before{content:""; display:block; width:1.8em; height:1.8em; background-repeat:no-repeat; background-position:center; position:absolute; top:2em; right:2em; opatity:.8;}
.data_list>li.icon_function:before{background-image:url(/resource/tour/images/contents/icon_function.svg)}
.data_list>li.icon_time:before{background-image:url(/resource/tour/images/contents/icon_time.svg)}
.data_list>li.icon_lan:before{background-image:url(/resource/tour/images/contents/icon_lan.svg)}
.data_list>li.icon_tel:before{background-image:url(/resource/tour/images/contents/icon_tel.svg)}
.data_list>li.icon_talk:before{background-image:url(/resource/tour/images/contents/icon_talk.svg)}
.data_list dt{font-size: 1.6em;font-weight: 700;margin-bottom:1em;position:relative;}
.data_list dt:before{content:""; display:block; width:1em; height:3px; background:var(--color-point); margin-bottom:.2em;}
.data_list .basic_ul li{font-size:1em;}

@media (max-width:1024px) {
  .data_list>li{min-height:auto;}
}

@media (max-width:968px) {
	.data_list{gap:1em;}
	.data_list>li{flex:1 1 calc((100% - 1em) / 2);}
}

@media (max-width:668px) {
	.data_list{gap:10px;}
	.data_list>li{flex:0 1 100%;}
}

/* 새창링크 */
.a_link{display:inline-block; position:relative;}
.a_link:before{content:""; display:block; width:100%; position:absolute; bottom:0; left:0; width:100%; height:1px; background:#222;}
.a_link:after{content:""; display:inline-block; width:12px; height:1em; margin-left:.3em;background:url(/resource/common/images/common/icon_blank.svg) no-repeat 0 .2em;}
.a_link:has(.icon_homepage)					{ vertical-align:middle; margin-left:5px; margin-top:-3px; }
.a_link:has(.icon_homepage)::after,
.a_link:has(.icon_homepage)::before			{ display:none; }
.icon_homepage								{ position:relative; display:flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:100%; background:var(--color-point); }
.icon_homepage::before						{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; /*background:url(/resource/tour/images/contents/icon_homepage.svg) no-repeat 50% 50% / auto 13px;*/ background:url(/resource/common/images/bbs/icon_homepage.svg) no-repeat 50% 50% / auto 12px; }


/* icon_list */
.icon_list{border-top:2px solid var(--color-point); border-bottom:1px solid #ddd;}
.icon_list>li{position:relative; display:flex; flex-wrap:wrap; justify-content:center; gap:5em; padding:2em 0;}
.icon_list>li:not(:first-child){border-top:1px solid #ddd;}
.icon_list>li:before{content:""; display:block; width:8em; height:8em; border-radius:1em; background-color:#ecf1f9; background-repeat:no-repeat; background-position:center; background-size:40%;}
.icon_list>li.icon_car:before{background-image:url(/resource/tour/images/contents/icon_navigation01.svg)}
.icon_list>li.icon_bus:before{background-image:url(/resource/tour/images/contents/icon_navigation02.svg)}
.icon_list>li.icon_tel:before{background-image:url(/resource/tour/images/contents/icon_navigation03.svg)}
.icon_list>li.icon_parking:before{background-image:url(/resource/tour/images/contents/icon_navigation04.svg); background-size:30%;}
.icon_list>li>*{width:calc(85% - 7em);}
.icon_list>li>dl>dt{font-size:1.8em; font-weight:800; color:var(--color-point); margin-bottom:.5em}
.icon_list dd{font-size:1.1em}
.icon_list dd dl{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.5em 1em}
.icon_list dd dt{font-size:1.1em; font-weight:600; border:1px solid #444; width:max-content; max-width:100%; padding:.5em 1em; border-radius:5px; text-align:center;}
.icon_list dd dd{margin-left:10px; flex:1 0 100%; font-size:1em;}
.icon_list dd dd,
.icon_list dd li{position:relative; padding-left:.5em;}
.icon_list dd dd:before,
.icon_list dd li:before{content:""; display:block; width:3px; height:3px; background:var(--color-point); position:absolute; top:.6em; left:0;}

[data-subarea="navigation"] .icon_list dd dt{width:24%;}
[data-subarea="navigation"] .icon_list dd dd{flex:1 0 70%}
[data-subarea="navigation"] .icon_list dd ul{display:flex; flex-wrap:wrap; gap:.5em 2em}
[data-subarea="navigation"] .icon_list dd li{width:calc((100% - 2em) / 2)}
@media (max-width:1024px) {
  .icon_list>li{gap:3em}
  .icon_list>li>*{width:calc(90% - 8em);}
  .icon_list>li>dl>dt{font-size:1.8em;}
  .icon_list dd dt{padding:.3em 1em}
  
  [data-subarea="navigation"] .icon_list dd dt{width:max-content;}
  [data-subarea="navigation"] .icon_list dd dd{flex:1 0 100%}
  [data-subarea="navigation"] .icon_list dd li{width:100%}
}
@media (max-width:460px) {
  .icon_list>li{display:block;}
  .icon_list>li:before{margin:0 auto .5em}
  .icon_list>li>*{width:100%;}
  .icon_list>li>dl>dt{text-align:center; margin-bottom:1em; font-size:1.6em}
  .icon_list>li>dl>dd{background:#f4f4f4; padding:1em;}
  .icon_list dd dt{padding:.2em .5em; font-size:1.05em}
}

/* basic_img */
.basic_img{border-radius:10px 3em 10px 3em; overflow:hidden;}
.basic_img img{width:100%;}

/* map_box */
article .map_wrap											{ position:relative; overflow:hidden; width:100%; height:550px; border:0; border-radius:20px}
article .map_wrap .root_daum_roughmap,
article .map_wrap .root_daum_roughmap .wrap_map				{ width:calc(100% + 2px); height:calc(100% + 1px) !important; left:-1px; top:-1px}

@media all and (max-width:1024px){
	article .map_wrap										{ height:280px; }
}
@media all and (max-width:668px){
	article .map_wrap										{ height:220px; }
}


/* 등록신청안내 절차도 */
[data-subarea="registration"] .area_diagram .list > li span{line-height:1.2;}
[data-subarea="registration"] .area_diagram .list > li .small{margin-top:.5em}
[data-subarea="registration"] .area_diagram .icon{display:block; width:4em; height:4em; border-radius:50%; background:#f4f4f4; margin-bottom:.5em; background-repeat:no-repeat; background-position:center; background-size:40%;}
[data-subarea="registration"] .area_diagram li:first-child .icon{background-image:url(/resource/tour/images/contents/icon_registration01.svg)}
[data-subarea="registration"] .area_diagram li:nth-child(2) .icon{background-image:url(/resource/tour/images/contents/icon_registration02.svg)}
[data-subarea="registration"] .area_diagram li:nth-child(3) .icon{background-image:url(/resource/tour/images/contents/icon_registration03.svg)}
[data-subarea="registration"] .area_diagram li:nth-child(4) .icon{background-image:url(/resource/tour/images/contents/icon_registration04.svg)}
[data-subarea="registration"] .area_diagram li:nth-child(5) .icon{background-image:url(/resource/tour/images/contents/icon_registration05.svg)}

/* 순창군 농산물직판장, 전통시장*/
[data-subarea="localfood"] .box_text_line,
[data-subarea="market"] .box_text_line{margin:2em 0;}
[data-subarea="localfood"] .box_text_line p + p,
[data-subarea="market"] .box_text_line p + p{margin-top:.5em}

/* 교통안내 */
.map_drive_wrap									{ display:flex; flex-wrap:wrap; overflow:hidden; position:relative; height:600px; padding:1.5em; border-radius:1em; background:#f3f3ff; margin-bottom:2em }
.map_drive_wrap	.list							{ display:flex; width:200px; flex-wrap:wrap; background:#fff; border-radius:1em 0 0 1em;  }
.map_drive_wrap	.list>li						{ flex:0 1 100%; }
.map_drive_wrap	.list>li+li						{ border-top:1px solid #ddd; }
.map_drive_wrap	.list>li>button					{ display:flex; position:relative; width:100%; height:100%; align-items:center; padding:0 25px; font-weight:500 }
.map_drive_wrap	.list>li>button>span			{ position:relative; z-index:3; }
.map_drive_wrap	.list>li.active>button			{ color:var(--color-white); }
.map_drive_wrap	.list>li.active>button::before	{ position:absolute; width:calc(100% + 20px); left:0; top:0; height:100%; content:''; background:var(--color-point); border-radius:15px 0; z-index:2 }
.map_drive_wrap	.list>li.active>button::after	{ position:absolute; right:0; top:50%; width:7px; height:7px; border-style:solid; border-width:2px 2px 0 0; border-color:#fff; transform:translateY(-50%) rotate(45deg); content:''; z-index:2 }
.map_drive_wrap .map_box						{ width:calc(100% - 200px); height:100%; position:relative; overflow:hidden; border-radius:0 1em 1em 0; position:relative; z-index:1 }
.map_drive_wrap .map_box .root_daum_roughmap,
.map_drive_wrap .map_box .root_daum_roughmap .wrap_map{ width:calc(100% + 2px); height:calc(100% + 1px) !important; left:-1px; top:-1px;}


@media all and (max-width:1268px){
	.map_drive_wrap								{ height:450px; }
	.map_drive_wrap	.list						{ width:150px; }
	.map_drive_wrap .map_box					{ width:calc(100% - 150px); }
}
@media all and (max-width:868px){
	.map_drive_wrap									{ height:inherit; }
	.map_drive_wrap	.list							{ width:100%; border-radius:10px; background:none }
	.map_drive_wrap .map_box						{ width:100%; margin-top:10px;height:240px;border-radius:10px; }
	.map_drive_wrap	.list							{ gap:5px; }
	.map_drive_wrap	.list>li						{ flex:0 1 calc((100% - 5px) / 2); border-radius:10px; background:#fff; }
	.map_drive_wrap	.list>li>button					{ height:45px; padding:0 15px; }
	.map_drive_wrap	.list>li+li						{ border-top-width:0; }
	.map_drive_wrap	.list>li.active>button::before	{ width:100%; border-radius:10px;}
	.map_drive_wrap	.list>li.active>button::after	{ right:15px; }
}
@media all and (max-width:668px){
	.map_drive_wrap									{ padding:1em; }
}
@media all and (max-width:468px){
	.map_drive_wrap .map_box						{height:200px; }
}


/* toggle */
#toggle_btn{display:block; width:100%; border:1px solid #ddd; padding:1em 1.5em; margin-top:1em; border-radius:10px; text-align:left; position:relative;}
#toggle_btn:before,
#toggle_btn:after{content:""; display:block; width:15px; height:3px; background:#777; position:absolute; top:0; bottom:0; right:1.5em; margin:auto;}
#toggle_btn:after{width:3px; height:15px; right:calc(1.5em + 6px)}
#toggle_btn.active{background:#f4f4f4;}
#toggle_btn.active:after{display:none;}

#toggle_wrap{border:1px solid #ddd; border-radius:10px; padding:1.5em !important; display:none;}
#toggle_wrap .basic_table{margin:0;}

/* link */
.a_link			{display:inline-block; position:relative; color:var(--color-point); word-break:break-all;}
.a_link:after	{content:"";display:inline-block;width:13px;height:13px;background:url(/resource/health/images/common/icon_blank.svg) no-repeat center;margin-left:.3em;filter: invert(11%) sepia(100%) saturate(5943%) hue-rotate(238deg) brightness(87%) contrast(98%);}

/* 문화관광 .tour_view_top */
.tour_view .tour_view_top.vertical:not(:has(.st3_tit)){padding:2em;}

@media all and (max-width: 1068px) {
  .tour_view .tour_view_top.vertical:not(:has(.st3_tit)){padding:1em;}
}

/* 문화관광 게시글 basic_ul font */
.tour_view_con .basic_ul>li {font-size:1em;}
.tour_view .tour_view_top .area_text .info_list>li a[target="_blank"] span{display:inline-block; }
.tour_view .tour_view_top .area_text .info_list>li a[target="_blank"] span::after{content:""; display:inline-block; width:12px; height:1em; margin-left:.3em;background:url(/resource/common/images/common/icon_blank.svg) no-repeat 0 .2em;vertical-align:middle;margin-top: -2px;}
.tour_view .tour_view_con h6:before{height:.85em;top:.2em;}

/* 문화관광 게시글 슬라이드 안 정보 6개 일 때 */
.tour_view .tour_view_top.vertical .area_text .info_list:has(li:nth-child(6):last-child){flex-wrap:wrap;}
.tour_view .tour_view_top.vertical .area_text .info_list:has(li:nth-child(6):last-child) li {width: calc((100% - 4em) / 3);}
@media all and (max-width: 1400px) {
    .tour_view .tour_view_top.vertical .area_text .info_list:has(li:nth-child(6):last-child) li {width: calc((100% - 2em) / 2);}
}
@media all and (max-width: 1024px) {
    .tour_view .tour_view_top.vertical .area_text .info_list:has(li:nth-child(6):last-child) li {width:100%;}
}


/* 자전거코스 */
.bike_course{margin-top:2em; position:relative;}
.bike_course:before{content:""; display:block; width:calc(100% - 5em); height:calc(100% - 11.6em); border-radius:0 40px 40px 0; background:#f0f0f0; position:absolute; top:0; right:0; bottom:0; margin:auto; z-index:-2}
.bike_course:after{content:""; display:block; width:calc(100% - 5em); height:calc(100% - 11.6em - 4em); border-radius:0 20px 20px 0; background:#fff; position:absolute; top:0; bottom:0; margin:auto; right:2em; z-index:-2}
.bike_course ol{display:flex; flex-wrap:wrap; padding:2em 0; gap:3em 0;}
.bike_course ol:first-child li:first-child,
.bike_course ol:last-child li:last-child{width:5em; height:5em; border-radius:50%; display:flex; justify-content:center; align-items:center; background:var(--color-point); color:#fff; font-size:1.4em; font-weight:700; margin:auto 0;}
.bike_course ol:first-child li:first-child:before{content:""; display:block; width:157px; height:21px; background:url(/resource/tour/images/contents/bg_bike_m.png) no-repeat 0 0; position:absolute; z-index:-1; top:1em; left:4em}
.bike_course ol:last-child{flex-direction:row-reverse; justify-content:flex-end;}
.bike_course ol:last-child li:last-child{background:var(--color-point2);}

.bike_course li{width:calc((100% / 4) - 23px - 4em); position:relative;}
.bike_course li.km{width:70px; text-align:center; margin-top:3em}
.bike_course li em{border:1px solid #ddd; text-align:center; border-radius:1em; font-size:.8em; font-weight:600; color:#777; padding:.3em .5em .2em; display:inline-block; width:max-content; background:#fff;}
.bike_course li span{width:2em; height:2em; border-radius:50%; background:#777; color:#fff; display:flex; flex-wrap:wrap; justify-content:center; align-items:center; margin:0 auto .4em; font-weight:700; font-size:.9em; padding-top:.1em}
.bike_course li strong{text-align:center; line-height:1.3; display:block;}

.bike_course li:not(:last-child):before{content:""; display:block; width:100%; height:5em; background-repeat:no-repeat; background-size:contain; background-position:center bottom; margin:auto;}
.bike_course li.km:not(:last-child):before{display:none;}
.bike_course ol:first-child li:nth-child(2):before{background-image:url(/resource/tour/images/contents/bg_bike01.png);}
.bike_course ol:first-child li:nth-child(4):before{background-image:url(/resource/tour/images/contents/bg_bike02.png);}
.bike_course ol:first-child li:nth-child(6):before{background-image:url(/resource/tour/images/contents/bg_bike03.png);}
.bike_course ol:first-child li:nth-child(8):before{background-image:url(/resource/tour/images/contents/bg_bike04.png);}
.bike_course ol:first-child li:nth-child(9){position:absolute; right:0; top:0; bottom:0; margin:auto; height:max-content; transform:rotate(90deg);}
.bike_course ol:last-child li:nth-child(1):before{background-image:url(/resource/tour/images/contents/bg_bike05.png);}
.bike_course ol:last-child li:nth-child(3):before{background-image:url(/resource/tour/images/contents/bg_bike06.png);}
.bike_course ol:last-child li:nth-child(5):before{background-image:url(/resource/tour/images/contents/bg_bike07.png);}
.bike_course ol:last-child li:nth-child(7):before{background-image:url(/resource/tour/images/contents/bg_bike08.png);}

@media all and (max-width: 1024px) {
    .bike_course ol:first-child li:first-child,
    .bike_course ol:last-child li:last-child{width:4em; height:4em;}
}
@media all and (max-width: 768px) {
    .bike_course:before{border-radius:0; display:none; right:0; border-radius:0}

    .bike_course ol{align-items:center; gap:0; padding:0}
    .bike_course ol:last-child{flex-direction:row;}

    .bike_course ol:first-child li:first-child,
    .bike_course ol:last-child li:last-child{border-radius:20px; width:5em; height:3em; font-size:1.2em; flex:0 0 auto;}
    .bike_course li{width:calc((100% / 2) - 23px - 3em); flex:1 0 auto;}
    .bike_course li:after{content:""; display:block; width:100%; height:30px; background:#f0f0f0; z-index:-1; position:absolute; top:0; bottom:0; margin:auto; left:0;}
    .bike_course li.km{margin-top:0;}
    .bike_course ol:first-child li:nth-child(9){position:relative; transform:rotate(0);}
    
}

/* 강천산군립공원 : 추천 아이콘 추가 */
.icon_best{display:inline-block;width: 1.2em;height: 1.2em;overflow:hidden;line-height:5000;background:url(/resource/tour/images/contents/icon_best.svg) no-repeat center;margin-right: .2em;clip: rect(0,0,0,0);text-indent: -1000000px;}

/* 홍보책자신청 아이콘박스 */
.box_info_top .icon{background:var(--color-white) !important;}
.box_info_top .icon img{width:60%;}

/* 농촌체험 목록 아이콘 */
.gallery_list>ul>li .gl_info>dd span:not(.icon_add, .icon_tel){width:calc(100% - 23px);}
.gallery_list>ul>li .gl_info>dd .icon_add, .gallery_list>ul>li .gl_info>dd .icon_tel{width:23px; height:23px;}
.gallery_list>ul>li .gl_info>dd .icon_add::before, .gallery_list>ul>li .gl_info>dd .icon_tel::before{background-size:.8em; background-position:center;}
.gallery_list>ul>li .gl_info>dd .icon_add::before{background-size:.6em;}

/* 주변정보 */
.tour_view .tour_view_con .custom_tab .map_wrap .map_info .map_info_list{max-height: calc(100% - 146px + 2em);padding-bottom:1em}
@media all and (max-width: 1068px) {
.tour_view .tour_view_con .custom_tab .map_wrap .map_info .map_info_list{max-height: calc(100% - 136px + 1.5em);}
}
@media all and (max-width: 568px) {
.tour_view .tour_view_con .custom_tab .map_wrap .map_info .map_info_list{max-height: calc(100% - 176px + 2em);}
}
@media all and (max-width: 420px) {
	.map_info_radio li{width:calc(100% / 2 - 1em)}
	
	.tour_view .tour_view_con .custom_tab .map_wrap .map_info .map_info_list{max-height: calc(100% - 208px + 2em);}
}
