/* (주)한신정보기술 김지혜 - 2015.06.11 */
/* 컨텐츠 그룹 */
body{font-family:"openS","OpenSans","나눔 바른 고딕","NanumBarunGothic","NanumBG","맑은 고딕","MalgunGothic","돋움","Dotum",sans-serif;}
#container{position:relative;width:100%;padding:0;margin:0;}
.colgroup1{}
.colgroup2{}
@media all and (max-width:640px) {
    .colgroup1{}
    .colgroup2{}
}
/* 퀵메뉴 */
/*
#floating{position:absolute;top:170px;left:1026px;width:55px;z-index:20;}
#floating ul{width:55px;}
#floating ul li{display:block;position:relative;width:55px;margin:0 0 0 0;height:50px;padding:0 0 0 112px;z-index:20;text-align:right;}
#floating ul li.on{width:167px;margin:0;padding:0;background:url('/site/eng/images/main/quick_on.png') no-repeat left top;}
#floating ul li a{display:inline-block;width:55px;height:34px;padding:15px 0 0 0;background-color:#9e9e9e;background-repeat:no-repeat;background-position:50% 50%;border-bottom:1px solid #b5b5b5;font-size:0;line-height:0;text-align:left;text-decoration:none;}
#floating ul li a:hover{width:140px;padding-left:15px;background-color:#ffc40e;background-position:114px 50%;border-color:#7d7d7d;color:#fff;font-size:14px;letter-spacing:-1px;line-height:16px;}
#floating ul li.qk1 a{background-image:url('/site/eng/images/main/quick1.png');}
#floating ul li.qk2 a{background-image:url('/site/eng/images/main/quick2.png');}
#floating ul li.qk3 a{background-image:url('/site/eng/images/main/quick3.png');}
#floating ul li.qk4 a{background-image:url('/site/eng/images/main/quick4.png');}
#floating .top{width:55px;margin:0 0 0 0;padding:0 0 0 112px;font-size:0;line-height:0;overflow:hidden;}
@media only screen and (max-width: 640px){
    #floating{display:none;}
}
*/
/* visual */
@keyframes visual_effect{
  0%{opacity:0;}
  10%{opacity:0.1;}
  20%{opacity:0.2;}
  30%{opacity:0.3;}
  40%{opacity:0.4;}
  50%{opacity:0.5;}
  60%{opacity:0.6;}
  70%{opacity:0.7;}
  80%{opacity:0.8;}
  90%{opacity:0.9;}
  100%{opacity:1;}
}
.visual{display:block;position:relative;width:100%;height:570px;margin:0;padding:0;font-family:"openSL","OpenSans-Lright";}
.visual_wrap{width:100%;overflow:hidden;height:410px;}
.visual_list{position:relative;left:-20%;width:180%;height:100%;overflow:hidden;}
.visual_list li{display:block;float:left;position:relative;width:11.111111%;height:100%;background-repeat:no-repeat;background-position:50% top;z-index:0;animation:visual_effect 0.5s;}
.visual_list .visual_blind{display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:url('/site/eng/images/main/visual_blind.png') repeat;}
.visual_list li.active{z-index:1;}
.visual_list li.active .visual_blind{display:none;}
.visual_list li > div{display:block;width:100%;height:95px;margin:0 auto;margin:315px 0 0 0;padding:0;color:#b5b6b9;font-size:0;font-weight:bold;line-height:0;text-align:center;overflow:hidden;}
.visual_list li.active > div{background:url('/site/eng/images/main/visual_blind.png') repeat;font-size:23px;line-height:25px;}
.visual_list div strong{display:none;width:90%;height:54px;margin:0 auto;font-size:19px;line-height:21px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.visual_list div strong .em_yellow{display:block;color:#fffdc3;}
.visual_list .more{display:none;width:71px;height:21px;margin:5px auto 0 auto;padding:0 10px 0 0;background:url('/site/eng/images/main/more_bul.png') no-repeat 65px 50%;border:2px solid #90a5d0;color:#90a5d0;font-size:12px;font-weight:bold;line-height:21px;text-align:center;border-radius:12px;}
.visual_list li.active div strong{display:block;}
.visual_list li.active .more{display:block;}
.visual_txt{display:block;position:absolute;left:0;bottom:0;width:100%;background:url('/site/eng/images/main/visual_pattern.gif') repeat;color:#fff;font-size:18px;line-height:24px;}
.visual_txt > div{width:1300px;margin:0 auto;background:url('/site/eng/images/main/visual_txt_lpattern.png') no-repeat left bottom;}
.visual_txt .wrap{height:170px;padding:50px 0 0 0;background:url('/site/eng/images/main/visual_txt_rpattern.png') no-repeat 740px top;text-align:center;}
.visual_txt span{display:block;}

.visual .visual_ctrl{position:absolute;right:0;top:70px;}
.visual .visual_ctrl button{display:block;float:left;width:73px;height:38px;margin:0;padding:0;background-repeat:no-repeat;background-position:50%;border:1px solid #9ab0da;font-size:0;line-height:0;text-indent:-9999px;overflow:hidden;vertical-align:middle;}
.visual .visual_ctrl button.visual_prev{background-image:url('/site/eng/images/main/visual_prev.png');}
.visual .visual_ctrl button.visual_next{background-image:url('/site/eng/images/main/visual_next.png');border-left:0;}
@media all and (max-width:1024px) {
  .visual_list{left:-33.333333%;width:299.999997%;}
  .visual_list li{}
  .visual_txt > div{width:100%;}
  .visual_txt .wrap{width:100%;}
}
@media all and (max-width:800px) {
  .visual_list{left:0;width:100%;}
  .visual_list li{width:100%;background-position:50%;background-size:100% auto;}
  .visual_txt span{display:inline;}
  .visual .visual_ctrl{top:15px;right:10px;z-index:1;background-color:rgba(255,255,255,0.3);}
  .visual .visual_ctrl button{border-color:rgba(255,255,255,0.6);}
}
@media all and (max-width:400px) {
  .visual{height:492px;}
  .visual_wrap{height:314px;}
  .visual_list li{width:100%;}
  .visual_list li > div{margin:217px 0 0 0;}
  .visual .visual_ctrl{top:auto;bottom:10px;left:0;right:0;width:150px;margin:0 auto;z-index:10;}
  .visual_txt > div{background-size:200px auto;}
  .visual_txt .wrap{height:120px;padding:10px 0 50px;}
  .visual_txt .wrap img{width:95%;}
}
/* colgroup1 */
.colgroup1{height:500px;padding:70px 0 0 0;background:url('/site/eng/images/main/colgroup_bg.jpg') no-repeat 50% top;}
.colgroup1 .wrap > div{display:block;float:left;width:25%;height:380px;}

/* Investment */
.im {background:url('/site/eng/images/main/colgroup1_bg1.jpg') no-repeat 50% top;}
.im .im_in {height:100%;padding:0 25px;background:url('/site/eng/images/main/im_in.png') no-repeat left bottom;}
.im h2{padding:30px 0 0 0;color:#d3f1ff;font-size:30px;font-weight:300;line-height:34px;}
.im h2 span{display:block;}
.im h2 strong{color:#fff799;font-weight:600;}
.im ul{margin:35px 0 0 0;}
.im ul li{background:rgba(255,255,255,0.1);border:1px solid #ccc; border-top:none;}
.im ul li:first-child{border-top:1px solid #ccc;}
.im ul li a{display:block; padding:5px 5px 5px 30px;background:url('/site/eng/images/main/mayor_bul.png') no-repeat 12px 12px;color:#fff; letter-spacing:-1px;}

/* Oriental Medicine */
.om{margin:50px 0 0 0;background:url('/site/eng/images/main/om_bg.jpg') no-repeat 50% top;text-align:center;}
.om h2 {margin:30px 0 27px 0; color:#b5b4b2; font-size:27px; font-weight:300; line-height:31px;}
.om a{display:block; position:relative;width:160px;margin:0 auto; color:#fff;font-size:16px;font-weight:600;line-height:20px;text-align:center;}
.om a.om_list1 {z-index:2; height:120px; padding:40px 0 0 0; background:url('/site/eng/images/main/vision_bg.png') no-repeat 50%;}
.om a.om_list2 {z-index:1; top:-40px; height:100px; padding:60px 0 0 0; background:url('/site/eng/images/main/vision_off_bg.png') no-repeat 50%;}
.om a .em_yellow {color:#ffff00;}
.om a .em_pastel {color:#88fffe;}

/* Sancheong-gun */
.sg{background:url('/site/eng/images/main/colgroup1_bg3.jpg') no-repeat 50% top;}
.sg h2{height:100px;background:url('/site/eng/images/main/traffic_bg.png') repeat;color:#fff;font-size:28px;font-weight:normal;line-height:100px;text-align:center;}
.sg ul{margin:15px auto 0 auto; padding-left:30px;}
.sg ul li{margin:5px 0;}
.sg ul li a{color:#fff;font-size:18px;font-weight:bold;line-height:22px;vertical-align:middle;}
.sg ul li a span.circle {display:inline-block;float:left;width:75px;height:75px;margin:0 15px 0 0;background-color:rgba(0,46,129,0.5);background-repeat:no-repeat;background-position:50%;border-radius:38px;vertical-align:middle;}
.sg ul li a span.sg_text {float:left; width:auto; padding-top:18px;}
.sg ul li a:hover span.sg_text {text-decoration:underline;}
.sg ul .icon1 span.circle {background-image:url('/site/eng/images/main/sg_icon1.png');}
.sg ul .icon2 span.circle {background-image:url('/site/eng/images/main/sg_icon2.png');}
.sg ul .icon3 span.circle {background-image:url('/site/eng/images/main/sg_icon3.png');}
.sg ul .icon3 span.sg_text {padding-top:12px;}

/* Information for Multicultural Family Support */
.fs{position:relative; margin:50px 0 0 0;background:url('/site/eng/images/main/fs_bg.gif') no-repeat left top;}
.fs .fs_in {height:100%; background:url('/site/eng/images/main/fs_bg2.png') no-repeat center 161px;}
.fs h2{padding:25px 0 0 0;color:#252525;font-size:26px;line-height:30px;font-weight:normal;text-align:center;}
.fs h2 span{display:block;color:#8042a4;}
.fs a{display:inline-block; position:absolute; bottom:44px; right:24%; margin:5px 0;color:#252525;font-size:15px;line-height:17px;}

.rowgroup .ct ul li {display:table; float:left; width:50%; height:75px; text-align:left;}
.rowgroup .ct ul li a {display:table-cell; vertical-align:middle; padding-left:30%; font-size:13px;}
.rowgroup .ct ul li.ct_icon1 {background:url('/site/eng/images/main/ct_icon1.gif') no-repeat left center; background-size:25% auto;}
.rowgroup .ct ul li.ct_icon2 {background:url('/site/eng/images/main/ct_icon2.gif') no-repeat left center; background-size:25% auto;}
.rowgroup .ct ul li.ct_icon3 {background:url('/site/eng/images/main/ct_icon3.gif') no-repeat left center; background-size:25% auto;}
.rowgroup .ct ul li.ct_icon4 {background:url('/site/eng/images/main/ct_icon4.gif') no-repeat left center; background-size:25% auto;}

.rowgroup .ti .ti_blank, .rowgroup .ti .ti_text {float:left;}
.rowgroup .ti {height:111px; margin:32px 0;}
.rowgroup .ti .ti_blank {width:26%; height:100%; background:url('/site/eng/images/main/ti_blank.gif') no-repeat center center #003686;}
.rowgroup .ti .ti_text {width:74%; height:100%; background:url('/site/eng/images/main/ti_img.png') no-repeat left top;}
.rowgroup .ti .ti_text h2 {margin:0 0 10px 10%; padding-top:20px; font-size:22px; font-weight:600;}
.rowgroup .ti .ti_text .em_blue {color:#ddf1f3;}
.rowgroup .ti .ti_text .em_yellow {color:#ebf0b5;}
.rowgroup .ti .ti_text .more {display:block; width: 71px; height: 21px; margin-left:10%; padding: 0 10px 0 0; border: 2px solid #dddddc; border-radius: 12px; background:url('/site/eng/images/main/ti_bu.png') no-repeat 65px 50%; color: #dddddc; font-size: 12px; font-weight: 600; line-height: 21px; text-align: center;}
.rowgroup #banner img {width:100%; height:62px;}
.rowgroup #banner a {display:inline-block; width:50%; box-sizing:border-box;}
.rowgroup #banner a:first-child {padding-right:5px;}

@media all and (max-width:1024px) {
  .im .im_in {padding:0 15px;background-size:70% auto;}
  .sg ul {padding-left:10px;}
  .sg ul li a span.sg_text {width:calc(100% - 80px);}
  .sg ul li a span.circle {margin-right:5px;}
  .fs h2 {font-size:25px; letter-spacing:-1px;}
  .fs {background-size:100% 100%;}
  .fs .fs_in {background-size:auto 50%; background-position:center 90%;}
  .fs a {bottom:5%; right:24%;}
  .fs a img {width:33px; height:33px;}
}

@media all and (max-width:800px) {
  .colgroup1{padding:10px;}
  .colgroup1 .wrap > div{width:50%;height:242px;background-position:50%;background-size:100% auto;}
  .om,.fs{margin:0;}
  .im .im_in{background-size:40% auto;}
  .im ul {margin-top:10px;}
  .im h2{font-size:25px;line-height:27px;}
  .im h2 span{display:inline;}
  .im p{width:60%;}
  .om a {width:100%; height:auto !important; padding:10px 0 !important; border-radius:50px; background-size:200% auto !important;}
  .om a.om_list1 {margin-bottom:10px;}
  .om a.om_list2 {top:0;}
  .om a .em_yellow {display:block;}
  .om a .em_yellow br {display:none;}
  .sg ul{padding-left:0; margin:45px 0 0 0;}
  .sg ul li a span.sg_text {display:none;}
  .sg ul li{float:left;width:33.333333%;box-sizing:border-box;}
  .sg ul li a{font-size:15px;line-height:17px; text-align:center;}
  .sg ul li a span{float:none !important;}
  .fs h2 span{display:inline;margin:0 0 0 10px;}
  .fs ul{margin:30px 0 0 0;padding:10px 0 10px 160px;background-position:10% top;background-size:120px;text-align:left;}
  .rowgroup .ti .ti_text h2 {font-size:18px;}
  .rowgroup .ti {margin:29px 0;}
  .rowgroup .ti .ti_blank {background-size:auto 50%;}
}
@media all and (max-width:640px) {
  .fs h2{font-size:21px;line-height:25px;}
  .fs ul{padding:10px 0 10px 40px;background:none;}

}
@media all and (max-width:400px) {
  .colgroup1{height:inherit;background-size:auto 100%;}
  .colgroup1 .wrap > div{width:100%;height:200px;margin:10px 0 0 0;}
  .om h2{margin:15px 0;}
  .sg ul {margin-top:10px;}
}

/* 게시판 */
.colgroup2{width:1200px;height:480px;margin:0 auto;padding:55px 0 0 0;}
.colgroup2 h2{margin:0 0 20px;color:#252525;font-family:"openSL","OpenSans-Lright";font-size:22px;line-height:24px;}
.colgroup2 div div{position:relative;}
.colgroup2 .more2{display:block;position:absolute;top:0;right:0;width:29px;height:29px;background:url('/site/eng/images/main/board_more.png') no-repeat 50%;border:1px solid #e1e1e1;font-size:0;line-height:0;}
@media all and (max-width:1024px) {
  .colgroup2{width:100%;}
}
@media all and (max-width:400px) {
  .colgroup2{height:inherit;padding:20px 0 0 0;}
}
.rowgroup{display:block;float:left;width:40%;}
.notice{margin:10px 0 0 0;}
.notice .ti{display:block;color:#111;font-size:17px;line-height:19px;}
.notice .txt{display:block;margin:20px 0 0 0;color:#787878;font-size:13px;line-height:15px;}
.notice .date{display:block;margin:15px 0 0 0;color:#969696;font-size:11px;line-height:13px;}
.notice ul{margin:20px 0 0 0;}
.notice ul li{position:relative;margin:7px 0;padding:0 0 0 7px;background:url('/site/eng/images/main/brd_bul.png') no-repeat left 50%;}
.notice ul a{display:block;width:85%;color:#5d5d5d;font-size:13px;line-height:15px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.notice ul span{display:block;position:absolute;right:0;top:0;bottom:0;height:13px;margin:auto 0;color:#969696;font-size:11px;line-height:13px;}
.video{margin:45px 0 0 0;background:url('/site/eng/images/main/video_bg.jpg') no-repeat left top;}
.video div{width:100%;height:150px;background:url('/site/eng/images/main/video_img.png') no-repeat 310px 50%;}
.video h2{padding:20px 0 0 0;margin:0 0 0 25px;color:#fff;font-family:"openSL";font-size:17px;font-weight:normal;line-height:19px;}
.video h2 span{display:block;color:#eac143;font-family:"openS";font-size:26px;font-weight:bold;line-height:28px;}
.video .more{display:inline-block;width:71px;height:21px;margin:10px 0 0 25px;padding:0 10px 0 0;background:url('/site/eng/images/main/more_bul.png') no-repeat 65px 50%;border:2px solid #90a5d0;color:#90a5d0;font-size:12px;font-weight:bold;line-height:21px;text-align:center;border-radius:12px;}
@media all and (max-width:1024px) {
  .notice .ti{height:38px;overflow:hidden;}
  .notice .txt{height:30px;overflow:hidden;}
  .notice ul a{width:75%;}
  .video div{background-position:90% 50%;}
}
@media all and (max-width:640px) {
  .rowgroup{width:50%;}
}
@media all and (max-width:400px) {
  .rowgroup{width:100%;padding:0 10px;box-sizing:border-box;}
}
.board{display:block;float:right;width:57%;}
.board > div{display:block;float:left;position:relative;width:50%;height:434px;text-align:center;}
.board > div h2{text-align:left;}
.views h2{margin-left:20px;}
.board ul{position:relative;width:100%;height:388px;margin:0;padding:0;border:1px solid #e1e1e1;overflow:hidden;box-sizing:border-box;}
.board .views ul{border-left:0;}
.board ul li{display:none;position:absolute;top:0;left:0;right:0;width:81.871345%;margin:25px auto;z-index:0;}
.board ul li.active{display:block;z-index:10;}
.board .ti{display:block;width:90%;margin:25px auto;color:#111;font-size:18px;line-height:20px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.board .txt {display:block; position:relative; overflow:hidden; height:65px;}
.board .more{display:block;width:71px;height:21px;margin:25px auto 0 auto;padding:0 10px 0 0;background:url('/site/eng/images/main/more_bul2.png') no-repeat 65px 50%;border:2px solid #bfbfbf;color:#bfbfbf;font-size:12px;font-weight:bold;line-height:21px;text-align:center;border-radius:12px;}
.board .brd_ctrl{position:absolute;top:250px;left:0;width:100%;height:0;}
.brd_ctrl button{display:block;position:absolute;top:0;width:32px;height:44px;margin:0;padding:0;background-repeat:no-repeat;background-position:50%;border:1px solid #e1e1e1;font-size:0;line-height:0;}
.brd_ctrl .brd_prev{left:0;background-image:url('/site/eng/images/main/board_prev.png');border-left:0;}
.brd_ctrl .brd_next{right:0;background-image:url('/site/eng/images/main/board_next.png');border-right:0;}
@media all and (max-width:1024px) {
  .board ul li a img{width:100%;}
  .board ul li a span.txt{display:block;height:88px;overflow:hidden;}
}
@media all and (max-width:800px) {
  .board div{width:100%;height:217px;text-align:left;}
  .board .brd_ctrl{top:105px;}
  .board ul{height:165px;}
  .board .views ul{border-left:1px solid #e1e1e1;}
  .board ul li{width:86%;}
  .board ul li a{display:block;position:relative;padding:0 0 0 180px;}
  .board ul li a img{position:absolute;top:0;bottom:0;left:5px;width:40%;margin:auto 0;}
  .board .ti{margin:0;}
  .board ul li a span.txt{height:60px;margin:5px 0;font-size:13px;line-height:15px;}
  .board .more{margin:0;}
  .views h2{margin-left:0;}
}
@media all and (max-width:640px) {
  .board{width:45%;}
  .board ul li a{padding:0 20px;}
  .board ul li a img{display:none;}
}
@media all and (max-width:400px) {
  .board{width:100%;margin:20px 0 0 0;padding:0 10px; box-sizing:border-box;}
}
