#wrap{position:relative;clear:both; margin:10px; }
#contents{position:relative;clear:both;}


.container {margin:0;padding:0;background:#fff;_background:url(../img/bg2.jpg) repeat center top}
#wrap h1{color:#736357;line-height:40px}
#wrap .c_text{font-size:12px;line-height:40px}
#wrap .flatbtn{color:#8c6239;text-decoration:underline;}


.footer {position:relative;height:100px;}
.footer ul.footer_wrap {max-width:1456px;margin:35px auto;padding:0;text-align:center}
.footer li {height:30px;line-height:30px}
.footer li span {font-weight:normal;color:#888;}

.thum_modal h2{color:#000;font-size:24px;margin:0 auto;padding:20px 0 10px 0;font-weight:700;background:#fff}
.thum_modal_wide h2{color:#000;font-size:24px;margin:0 auto;padding:20px 0 10px 0;font-weight:700;background:#fff}
.thum_modal h3 {padding: 10px 0;line-height:1;margin: 0; font-size:12px; font-family:dotum,'돋움',sans-serif;font-weight:normal;}


.p_c_text{font-size:12px;font-family:'굴림',Gulim;font-weight:normal;background:#fff;padding:0;margin-bottom:10px}
.p_c_text span a {color:#555;font-size:14px;font-weight:bold}
.p_c_text span a:hover {color:#000;text-decoration:underline}

.font-dotum {font-family:'dotum','돋움';color:#999}

/*
#loginmodal .login_line{margin:10px 0 0;height:80px;}
#loginmodal .box_in{float:left;margin:0 10px 0; }
#loginmodal input{width:120px;height:24px;display:block;margin:3px 0 0;}
#loginmodal .btn_login{width:72px;height:60px;background:#363636;color:#e1e1e1;float:left;line-height:60px;text-align:center;}
#loginmodal .find_join{clear:both;margin:20px 0 0 10px;}
*/

/** modal window styles **/

.lean_overlay {position:fixed;z-index:100;top:0px;left:0px;height:100%;width:100%;background:#000;display:none;}


.thum_modal {width:80%;height:100vh;margin-top:0;padding:0;text-align:center;
  -webkit-border-radius:0;
  -moz-border-radius:0;
  border-radius:0;
  background:#fff;
  box-sizing:border-box;
  left:50%;
  -ms-transform:translateX(-50%);
  -webkit-transform:translateX(-50%);
  overflow-x:hidden;
  overflow-y:auto;
  /*
  -webkit-box-shadow:0 1px 5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow:0 1px 5px rgba(0, 0, 0, 0.5);
  box-shadow:0 1px 5px rgba(0, 0, 0, 0.5);
  */
}
.thum_modal img {text-align:center;}
.thum_modal_wide {width:1235px;height:900px;margin:0;padding:0;text-align:center;
  -webkit-border-radius:0;
  -moz-border-radius:0;
  border-radius:0;
  background:#fff;
  box-sizing:border-box;
  left:50%;
  -ms-transform:translateX(-50%);
  -webkit-transform:translateX(-50%);
  overflow-y:auto; 
  /*
  -webkit-box-shadow:0 1px 5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow:0 1px 5px rgba(0, 0, 0, 0.5);
  box-shadow:0 1px 5px rgba(0, 0, 0, 0.5);
  */
}
.ssize  {width:1700px;}

.ssize img {text-align:center;margin-left:-100px}
.full {width:100%}


button.closeModalLayer{
    overflow:hidden; 
    *overflow:visible;
    padding:0;
    margin:0;
    line-height:46px;
    width:40px;
    height:40px;
    position:absolute;
    top:10px;
    right:10px;
    font-size:30px;
    background:none;
    border:none;
    color:#fff;
    z-index:101;
    background:#000;
    }

button.closeModalLayer img {width:30px;margin:0}

.thum_modal_view {}


@media screen and (max-width:1400px) {


    .grid {margin:30px auto}
	.codrops-icon span {display:none;}

    .thum_modal {width:90%;overflow-y:auto;}
    .thum_modal img {width:100%}
    .thum_modal h2 {font-size:20px;text-align:left;padding-left:10px;background:#000;color:#fff}
    .p_c_text {text-align:left;padding-left:10px;background:#fff;}
    .p_c_text span a {color:#fff}

    .thum_modal_wide {width:90%;overflow-y:auto;}
    .thum_modal_wide img {width:100%}
    .thum_modal_wide h2 {font-size:20px;text-align:left;padding-left:10px}



    button.closeModalLayer {display:block;top:5px;right:5px;border:none;font-size:20px}
    .title_wrap {margin:0 auto;_background:#000 url(../img/pattern_4.png);}
    .ssize img {margin:0}
   
}


@media screen and (max-width: 768px) { 

.grid li h3 {padding:10px 0;text-align:center;font-size:1.2em;bottom:40%;font-weight:700}

}




@media screen and (max-width:480px) {

	.p_c_text {position:relative;width:100%;padding:20px 0;text-align:center;font-size:14px}
    .p_c_text > span > a {color:#000}
    .title_wrap {}
    .thum_modal {width:100%;height:100%;top:0 !important;overflow-y:scroll;border:none}
    .thum_modal_wide {width:100%;height:100%;top:0 !important;overflow-y:scroll;border:none}
    ::-webkit-scrollbar {width:3px;}
}

