@charset "UTF-8";

/* sub01_02 연혁*/
.history_a01 .his_img .his_img1{background: url(/images/jp/sub01/sub01_02_img01.jpg) no-repeat;background-size: cover;}
.history_a01 .his_img .his_img2{background: url(/images/jp/sub01/sub01_02_img02.jpg) no-repeat;background-size: cover;}

/* 마을소개 */
.ui-topbox-txt{position:relative;padding:25px 10px}
.ui-topbox-txt.main.intro .tit{margin-top:0;margin-bottom:15px;padding-top:0;background:none;font-size:30px;line-height:35px;font-weight:500;letter-spacing:-2px;}
.ui-topbox-txt.main.intro .inner .tit:before{display:none;}
.ui-topbox-txt.main.intro .inner:after{content:"";clear:both;display:block;visibility:hidden}
.ui-topbox-txt.main.intro .tit em{display:inline-block;color:#3264bb;margin-left: 10px;}
.ui-topbox-txt.main.intro .txtwrap .small_tit {font-size:20px;font-weight: 400;}
.ui.uic.intro{margin-top:70px;}
.ui.uic.intro .box_col .col .item .tit_inner{margin:0;font-weight:normal;}
.ui.uic.intro .box_col .col{margin-bottom:15px;}
.ui.uic.intro h3{font-size:18px;}
.ui.uic.intro .thm_caption{padding:40px;background-color:#f9f9f9;border:1px solid #e7e7e7;}

.ui.uib{ }
.ui.uib.jp_sub02 .uibodo2 .box:after,
.ui.uib.jp_sub02 .uibodo:after{content:"";clear:both;display:block;visibility:hidden}
.ui.uib.jp_sub02 .uibodo{} 
.ui.uib.jp_sub02 .uibodo .box,
.ui.uib.jp_sub02 .uibodo2 .box{display:inline-block;margin-bottom:30px;}
.ui.uib.jp_sub02 .box p{margin-top:0;}
.ui.uib.jp_sub02 .thm_figure{display:block;overflow:hidden;/*background:#fbfbfb;border:1px solid #e0dbd9;*/}
.ui.uib.jp_sub02 .thm_figure img{display:block;margin:0 auto;max-width:100%;}
.ui.uib.jp_sub02 .thm_caption{display:block;}
.ui.uib.jp_sub02 .thm_caption p{font-size: 14px; color:#5c5c5c;}
.ui.uib.jp_sub02 .uibodo .thm_caption .no_blit {margin:0; background:none; font-size:1.714em; color:#121212; }
.ui.uib.jp_sub02 .thm_caption{float:none;width:100%;margin-top: 20px; }
.ui.uib.jp_sub02 .uibodo {padding: 45px 0;border-top: 1px solid #ddd;border-bottom: 1px solid #ddd;}
.ui.uib.jp_sub02 .uibodo2 {padding: 45px 0;border-bottom: 1px solid #ddd;}
.ui.uib.jp_sub02 .thm_caption .tit_inner{font-size: 21px;color: #2549a1;text-align: center;}
.ui.uib.jp_sub02 .thm_caption .btn{margin-top: 20px;} 

@media only screen and (min-width:768px){
.ui-topbox-txt{position:relative;padding:45px 35px}
.ui.uib .uibodo .thm_caption{float:right;}
.ui.uib.jp_sub02 .thm_caption .tit_inner{text-align: left}
.ui.uib.jp_sub02 .thm_figure,
.ui.uib.jp_sub02 .thm_figure{float:left;width: 28%;}
.ui.uib.jp_sub02 .uibodo2.dif .thm_caption,
.ui.uib.jp_sub02 .uibodo.dif .thm_figure{float:right;width:33.3%;}

.ui.uib.jp_sub02 .thm_caption{float:right;width:68.5%;margin-top: 0;}
.ui.uib.jp_sub02 .uibodo2.dif .thm_caption,
.ui.uib.jp_sub02 .uibodo.dif .thm_caption{float:left;width:60%;}

.ui-topbox-txt.main.intro .tit{float:left;}
.ui-topbox-txt.main.intro .tit em{display:block;margin-left: 0;}
.ui-topbox-txt.main.intro .txtwrap{padding-left:330px;}
.ui.uic.intro .thm_caption{height:171px;}
}



/*지명유래*/

.place_wrap {}
.place_wrap .place_top {margin-bottom:30px; width:100%; position:relative;  text-align: right;}
.place_wrap .place_top .pl_left {position:absolute; left:0; top:0;padding:30px; width:325px; height:270px; text-align:left; background:#678dc3 url(/images/jp/sub02/sub02_01_02_img01.png)no-repeat 95% 92%;}
.place_wrap .place_top .pl_left .inner {padding:35px 0 0 15px;background:url(/images/jp/sub02/sub02_01_02_img02.png)no-repeat left 12px;}
.place_wrap .place_top .pl_left p {color:rgba(255,255,255,0.5); font-size:19px;}
.place_wrap .place_top .pl_left p.lett {letter-spacing: 0.08em;}
.place_wrap .place_top .pl_left p.tit {color:#fff; font-size:24px; font-weight: 400; line-height:1.3;}
.place_wrap .place_top .pl_left p.tit em {display:inline-block;}
/*.place_wrap .place_top .pl_right {margin-left:325px; height:270px;background-size:cover;}*/
.place_wrap .pl_text {padding-bottom:40px; border-bottom:1px solid #ddd;}
.color_bb {color:#303a7c;}

@media (max-width:1360px){
	.place_wrap .place_top .pl_left {width:45%;}
}

@media (max-width:650px){
	.place_wrap .place_top .pl_left {position:static;padding:15px 15px 30px; width:100%; height:auto;}
}

@media (max-width:410px){
	.place_wrap .place_top .pl_left {padding:15px 15px 30px; width:100%; }
	.place_wrap .place_top .pl_left p.tit { font-size:22px; }
}

/* sub01_05_01 유래 및 배경 */
.bg_wrap{padding: 70px 60px;background: #eff1f2}
.bg_wrap .txt{margin-bottom: 25px;text-align: center;}
.bg_wrap .txt strong{display: block;margin-bottom: 20px;font-size: 26px;color: #121212;font-weight: 500}
.bg_wrap .txt p{}
.bg_wrap .img{}
.bg_wrap .img .img_list{}
.bg_wrap .img .img_list:after{content: '';display: block;visibility: hidden;clear: both;}
.bg_wrap .img .img_list li{float: left;position: relative;width: 33.3%;}
.bg_wrap .img .img_list li img{width: 100%;}
.bg_wrap .img .img_list li span{position: absolute;right: 0;bottom: 0;width: 27px;height: 27px;background: #394256;color: #fff;font-weight: 500;text-align: center;line-height: 27px}
.bg_wrap .img .txt_list{margin-top: 40px;}
.bg_wrap .img .txt_list:after{content: '';display: block;visibility: hidden;clear: both;}
.bg_wrap .img .txt_list li{float: left;position: relative;width:33.3%;padding-left:11.5%;border-left: 1px dashed #9fa0a3;}
.bg_wrap .img .txt_list li:first-child{border-left: 0}
.bg_wrap .img .txt_list li span{display: block;position: absolute;top:-5px;left: 16%;width: 30px;height: 30px;background: #394256;border-radius: 50%;color: #fff;text-align: center;line-height: 30px;font-weight: 500}

@media (max-width:767px){
	.bg_wrap .img .img_list li{width: 50%;}
	.bg_wrap .img .txt_list li{width: 50%;padding-left: 60px;margin-bottom: 20px}
	.bg_wrap .img .txt_list li:last-child{border-left: 0;}
	.bg_wrap .img .txt_list li span{left: 25px;}
}
@media (max-width:500px){
	.bg_wrap{padding: 30px}
	.bg_wrap .img .img_list li{width: 100%;}
	.bg_wrap .img .txt_list li{width: 100%;border-left: 0px} 
}


/* sub01_05_02 마을자랑비 */
.stone_wrap{padding: 70px 60px;background: #eff1f2}
.stone_wrap .txt{margin-bottom: 25px;text-align: center;}
.stone_wrap .txt strong{display: block;margin-bottom: 20px;font-size: 26px;color: #121212;font-weight: 500}
.stone_wrap .img{}
.stone_wrap .img .img_wrap{background: url(/images/jp/sub01/sub01_05_02_bg.png) no-repeat bottom right;}
.stone_wrap .img .img_wrap:after{content: '';display: block;visibility: hidden;clear: both;}
.stone_wrap .img .img_wrap .img_list{float: left;margin-left: -2%}
.stone_wrap .img .img_wrap .img_list.left{width: 75.5%;}
.stone_wrap .img .img_wrap .img_list.right{width: 25.5%;margin-left: 0}
.stone_wrap .img .img_wrap .img_list:after{content: '';display: block;visibility: hidden;clear: both;}
.stone_wrap .img .img_wrap .img_list li{float: left;position: relative;width: 31.3%;margin:0 0 2% 2%;}
.stone_wrap .img .img_wrap .img_list.right li{width: 96%;margin-left: 4%;}
.stone_wrap .img .img_wrap .img_list li span{position: absolute;right: 0;bottom: 0;width: 27px;height: 27px;background: #394256;color: #fff;font-weight: 500;text-align: center;line-height: 27px}
.stone_wrap .img .txt_list{margin-top: 40px;}
.stone_wrap .img .txt_list:after{content: '';display: block;visibility: hidden;clear: both;}
.stone_wrap .img .txt_list li{float: left;position: relative;width:33.3%;margin-bottom: 20px;padding:0 0 0px 11.5%;border-right: 1px dashed #9fa0a3;}
.stone_wrap .img .txt_list li:nth-child(3n){border-right: 0}
.stone_wrap .img .txt_list li span{display: block;position: absolute;top:-6px;left: 16%;width: 30px;height: 30px;background: #394256;border-radius: 50%;color: #fff;text-align: center;line-height: 30px;font-weight: 500}

@media (max-width:767px){
	.stone_wrap .img .img_wrap .img_list{float: none;}
	.stone_wrap .img .img_wrap .img_list.left{width: auto;}
	.stone_wrap .img .img_wrap .img_list.right{width: auto;margin-left: -2%;}
	.stone_wrap .img .img_wrap .img_list.right li{width: 31.3%;margin-left: 2%}
	.stone_wrap .img .txt_list li{width: 50%;padding-left: 70px;}
	.stone_wrap .img .txt_list li:nth-child(3n){border-right: 1px dashed #9fa0a3;}
	.stone_wrap .img .txt_list li:nth-child(2n){border-right: 0}
	.stone_wrap .img .txt_list li:last-child{border-left: 0;}
	.stone_wrap .img .txt_list li span{left: 35px;}
}
@media (max-width:540px){
	.stone_wrap{padding: 30px}
	.stone_wrap .img .img_wrap .img_list li,
	.stone_wrap .img .img_wrap .img_list.right li{width: 48%;}
	.stone_wrap .img .img_wrap .img_list li img{width: 100%}
	.stone_wrap .img .txt_list li{width: 100%;padding-left: 50px;border-right: 0px} 
	.stone_wrap .img .txt_list li:nth-child(3n){border-right:0}
	.stone_wrap .img .txt_list li span{left: 15px;}
}