/* CSS Document euc-kr */

/*portfolio*/


/*ÅǸ޴º*/
.port_tab_01{ border-bottom:1px solid #86ca1a; font-size:0px; margin:0 18px; }
.port_tab_01 li{ min-height:39px; display:inline-block; width:14.285%; background:#ffffff;  font-family:"NanumGothic", "µ¸¿ò", sans-serif; font-size:14px; line-height:18px; text-align:center;  }


.port_tab_01 li a{ text-decoration:none; display:block; padding:10px 0px 10px 0px; border:1px solid #e5e5e5; border-bottom:none;margin:0 0px 0px 1px;}
.port_tab_01 li:first-child a{ margin-left:0px; }


.port_tab_01 li a:link, .port_tab_01 li a:visited { color:#222222; text-decoration:none; }
.port_tab_01 li a:hover, .port_tab_01 li a:active { color:#222222; text-decoration:none; }


/*ÅǸ޴º on*/
.port_tab_01 li.on a{  background:#86ca1a; border:1px solid #86ca1a; border-bottom:none; color:#ffffff;}





/*Æ÷Æ®Æú¸®¿À ¸ñ·Ï*/
.port_tab_content_01{ margin:0 18px; }


.portfolio_group{ font-size:0px; padding:0 0 7% 0; padding:0 0 0 0; }
.portfolio_group li{ display:inline-block; width:32.8%;  /*margin:0 0 0.8% 0;*/ margin:0 0 10px 0; font-size:12px; text-align:center; vertical-align:top;}

/*Æ÷Æ®Æú¸®¿À ù¹ø° ¿­*/
.port_list_first{ padding:0 0.8% 0 0; }

/*Æ÷Æ®Æú¸®¿À ¼¼¹ø° ¿­*/
.port_list_end{ padding:0 0 0 0.8%; }

.port_wrap{ position:relative; }

/*pc¿¡¼­¸¸ ³ëÃâ*/
.port_skin{ display:block; }
.port_up_txt{ display:none;}


/*¸¶¿ì½º ¿Ã·ÈÀ»¶§ »çÀÌÆ®¸í ³ëÃâ*/
.port_on_txt{ display:block;position:absolute; top:0px; width:100%; height:100%; background:url(../images/contents/port_on_gay_bg.png) repeat 0px 0px;/*background:#000000; *//*opacity:0.85; filter:alpha(opacity=85); -ms-filter:alpha(opacity=85);*/ }

.port_wrap .port_img{ border:1px solid #e5e5e5; width:379px; height:260px; overflow:hidden; font:0/0 arial; display:block; cursor:default;}

/*°¡·Î ±æÀÌ Àâ¾ÆÁà¾ßÇÔ...ie8¿¡¼­ ¼Óµµ ´À·ÁÁü*/
.port_wrap .port_img img{ width:379px; /*min-height:260px;*/}


.port_wrap .port_img_org{ display:none;}


.port_on_txt .site_name{ font-family:"NanumGothic", "µ¸¿ò", sans-serif;min-width:4%; max-width:90%; font-weight:normal; font-size:24px; line-height:30px; color:#ffffff; margin:50px auto 15px auto;}
.port_on_txt .open_year{font-family:"NanumGothic", "µ¸¿ò", sans-serif; font-weight:normal; font-size:12px; line-height:15px; color:#ffffff; margin:0 0 4px 0; }

.port_on_txt .site_link{display:block; font-size:12px; line-height:15px; margin:0 0 30px 0; padding:0px 20px; word-break:break-all; word-wrap:break-word;}

.port_on_txt .site_link a{ }
.port_on_txt .site_link a:link, .port_on_txt .site_link a:visited { color:#ffffff; text-decoration:none; }
.port_on_txt .site_link a:hover, .port_on_txt .site_link a:active { color:#86ca1a; text-decoration:none; }

.port_on_txt a.port_more{ font:0/0 arial;}


/*¸ð¹ÙÀϱâ±â¿¡¼­ ¼±ÅÃµÈ À̹ÌÁö Å׵θ®¼± º¯°æ(pc¿¡¼­ °¡·Î È®Àå½Ã ±âº»Å׵θ® º¸ÀÌ°Ô)*/
.port_wrap .port_pad_on{ border:1px solid #e5e5e5; /*border:4px solid red;*/}


/*Æ÷Æ®Æú¸®¿À »ó¼¼ ³»¿ë*/
/*°øÅë, 2¹ø°*/
.port_detail { display:none; position:relative; /*background:pink;*/ width:305%; text-align:left; left:-102.5%; margin:0px; padding:10px 0 0 0; }

/*ù¹ø°*/
.port_first{ position:relative;/* background:blue;*/ left:0%; }

/*¼¼¹ø°*/
.port_end{ position:relative;  left:-205%; /*background:#090;*/}


.port_close{ position:absolute; top:40px; right:40px;}
.port_close img{ width:50px; height:50px;}


.port_detail_con{ /*border:1px solid red;*/ padding:40px 0px 40px 40px; background:url(../images/contents/port_detail_bg.png) repeat 0px 0px;}
.port_detail_con li{display: inline-block; text-align:left;}
.port_detail_con li.port_in_img{width:420px;}
.port_in_img img{ width:379px;}

.port_detail_con li.port_in_txt{width:640px; font-family:"NanumGothic", "µ¸¿ò", sans-serif; }

.port_detail_con li .site_name{ font-size:24px; line-height:30px; color:#86ca1a; margin:12px 0px 50px 0px;}

.port_detail_con li.port_in_txt .port_info{ }
.port_detail_con li.port_in_txt .port_info li{font-size:14px; line-height:18px; color:#ffffff; /*border:1px solid red;*/ width:100%; padding:0px; }
.port_detail_con li.port_in_txt .port_info li a{ }

.port_detail_con li.port_in_txt .port_info li a:link, .port_detail_con li.port_in_txt .port_info li a:visited { color:#ffffff; text-decoration:none; }
.port_detail_con li.port_in_txt .port_info li a:hover, .port_detail_con li.port_in_txt .port_info li a:active { color:#86ca1a; text-decoration:none; }


.port_detail_con li.port_in_txt .port_info .port_info_link{word-break:break-all;}
.port_detail_con li.port_in_txt .port_info .port_info_year{}
.port_detail_con li.port_in_txt .port_info .port_info_part{}
.port_detail_con li.port_in_txt .port_info .port_info_language{ }
.port_detail_con li.port_in_txt .port_info .port_info_explain{line-height:24px; margin:50px 0 0 0;}


/*Æ÷Æ®Æú¸®¿À ´õº¸±â ¹öÆ°*/
.port_more_btn{ display:block; border:1px solid #c4c4c4; background:#f8f8f8;  margin:2% 18px 5% 18px; padding:10px; text-align:center; font-family:"NanumGothic", "µ¸¿ò", sans-serif; font-size:16px; line-height:22px;}
.port_more_btn:hover, .port_more_btn:active { text-decoration:none; }



/*pc*/
@media all and (max-width:1200px){



.portfolio_group li{ width:32.3%; /*margin:0 0 1.48% 0;*/ margin:0 0 16px 0; }


.port_list_first{ padding:0 1.48% 0 0;}
.port_list_end{ padding:0 0 0 1.48%;}


.port_on_txt{ }


.port_wrap .port_img{ width:auto; height:210px; }
.port_wrap .port_img img{ width:100%; /*min-height:210px;*/ }



.port_on_txt .site_name{ margin:38px auto 10px auto; font-size:22px; line-height:28px;}

.port_on_txt .site_link{margin:0 0 20px 0;}


.port_on_txt a.port_more img{ width:45px; height:45px;}


.port_detail { width:308.9%; left:-104.4%; }
.port_first{ left:0%; }
.port_end{left:-209%;}


.port_detail_con{ padding:40px 0px 40px 30px;}

.port_detail_con li.port_in_img{width:auto; margin:0 40px 0 0; }
.port_detail_con li.port_in_txt{width:54%;  }


.port_detail_con li.port_in_txt .port_info li{}

}

@media all and (max-width:1110px){

.port_detail_con li.port_in_txt{width:50%;  }
}



/*ipad °¡·Î*/
@media all and (max-width:1030px){

.portfolio_group li{  margin:0 0 1.48% 0; }



.port_skin{ display:none; }

.port_wrap .port_img{ cursor:pointer; height:179px; }


.port_wrap .port_pad_on{ border:1px solid #a3a3a3; }


.port_detail { margin:0px 0 0 0; }

.port_close{ position:absolute; top:34px; right:34px;}
.port_close img{ width:40px; height:40px;}


.port_detail_con li.port_in_img{width:40%; margin:0 3% 0 0; }
.port_detail_con li.port_in_img img{ width:100%;}
.port_detail_con li.port_in_txt{width:50%;  }


.port_detail_con li .site_name{ margin:5px 0px 30px 0px;}

.port_detail_con li.port_in_txt .port_info .port_info_language{ }

.port_detail_con li.port_in_txt .port_info .port_info_explain{ text-align:justify; margin:30px 0 0 0;}


}


/*tablet °¡·Î*/
@media all and (max-width:900px){



.portfolio_group{ }

.port_wrap .port_img{ height:160px; }

.port_more_btn{ margin:2% 2% 5% 2%; }



}



/*ipad ¼¼·Î*/
@media all and (max-width:800px){



.port_tab_01{ margin:0; }
.port_tab_01 li{ letter-spacing:-1px;  }

.port_tab_content_01{ margin:0px; }

.port_wrap .port_img{ height:145px; }


.port_more_btn{ margin:2% 0px 5% 0px; }

}



/*³ª¸ÓÁöÆù °¡·Î¡Ú */
@media all and (max-width:700px){



.port_tab_01{ border-bottom:none; }
.port_tab_01 li{ width:25%;letter-spacing:0px;}
.port_tab_01 li a{border:1px solid #e5e5e5; margin:1px 1px 0 0 ;}

.port_tab_01 li:first-child a{  }

.port_tab_01 li.on a{ border-bottom:1px solid #86ca1a;}



.portfolio_group {}
.portfolio_group li{ /*width:49.1%;*/ margin:0 0 5% 0; width:100%; width:auto;}

.port_list_first{ padding:0 0 0 0;}
.port_list_end{ padding:0 0 0 0; }



.port_detail_con{ background:none; padding:5px; }

.port_detail { left:0%;position:static;  width:80%; margin:0 auto;  display:block;  padding: 12px 10px 0px 10px;  border:1px solid #e5e5e5; border-top:none; background:#e5e5e5;}
.port_first{ left:0%; }
.port_end{left:0%;}


.port_detail_con { }





.port_detail_con li.port_in_img{display:none;}
.port_in_img img{}


.port_detail_con li.port_in_txt{width:100%; }

.port_detail_con li.port_in_txt .port_info li{font-size:14px; line-height:18px; color:#333333; width:100%; margin:0px 0 2px 0;}


.port_detail_con li.port_in_txt .port_info .port_info_link{ text-align:center;}
.port_detail_con li.port_in_txt .port_info .port_info_year{ display:none;}
.port_detail_con li.port_in_txt .port_info .port_info_part{display:none;}
.port_detail_con li.port_in_txt .port_info .port_info_language{display:none; }

.port_detail_con li.port_in_txt .port_info .port_info_explain{ margin:10px 0 0 0; font-size:12px; line-height:18px;  color:#666666;}



.port_detail_con li .site_name{ font-size:24px; line-height:30px; text-align:center; color:#000000; margin:0px 0px 10px 0px; }


.port_detail_con li.port_in_txt .port_info li a{}

.port_detail_con li.port_in_txt .port_info li a:link, .port_detail_con li.port_in_txt .port_info li a:visited { color:#222222; text-decoration:none; }
.port_detail_con li.port_in_txt .port_info li a:hover, .port_detail_con li.port_in_txt .port_info li a:active { color:#222222; text-decoration:none; }



.port_close{ display:none;}


.port_wrap .port_img{ display:none; }

.port_wrap .port_img_org{ display:block; /*max-width:400px;*/ width:80%; margin:0 auto; border:1px solid #e5e5e5; border-bottom:none; padding:10px 10px 12px 10px; background:#e5e5e5;}
.port_wrap .port_img_org img{ width:100%;}



.port_more_btn{ width:80%; margin:2% auto 5% auto; }

}



/*iphone5 °¡·Î*/
@media all and (max-width:600px){





.port_tab_01 li{ width:33.3333%;}

.port_detail { width:auto;}

.port_wrap .port_img_org{ width:auto;}


.port_detail {  padding-top:5px; }

.port_detail_con li .site_name{ font-size:20px; line-height:24px; }


.port_wrap .port_img_org{ padding-bottom:5px; }

.port_more_btn{ width:auto; margin:2% auto 5% auto; }

}




/*iphone4, 5 ¼¼·Î*/
@media all and (max-width:350px){




.port_tab_01 li{ font-size:12px; line-height:18px;  }



}








/*¸ð¹ÙÀÏ ¼¼·ÎÀ϶§*/
@media all and (orientation:portrait) {



}



/*¸ð¹ÙÀÏ °¡·ÎÀ϶§*/
@media all and (orientation:landscape) {



}