/* responsive web design area */
@media screen and (max-width:1500px) {
#in_img{width:80%; height:auto}
}

@media screen and (max-width:1300px) {
#top_menu div{width:100%;}
 #visual_images,#visual_images_in{background-color:#ffffff;}
#in_img{width:100%}

#contents_wrap{width:100%}


#sub_img1, #sub_img2, #sub_img3, #sub_img4, #sub_img5, #sub_img6, #sub_img7, #sub_img8, #sub_img9, #sub_img10{display:none}
#sub_img1_m{display:block; background:url('/images/contents/img1.jpg') no-repeat; height:350px; background-size:cover; }
#sub_img2_m{display:block; background:url('/images/contents/img2.jpg') no-repeat; height:350px; background-size:cover; }
#sub_img3_m{display:block; background:url('/images/contents/img3.jpg') no-repeat; height:350px; background-size:cover; }
#sub_img4_m{display:block; background:url('/images/contents/img4.jpg') no-repeat; height:350px; background-size:cover; }
#sub_img5_m{display:block; background:url('/images/contents/img5.jpg') no-repeat; height:350px; background-size:cover; }
#sub_img6_m{display:block; background:url('/images/contents/img6.jpg') no-repeat; height:350px; background-size:cover; }
#sub_img7_m{display:block; background:url('/images/contents/img7	.jpg') no-repeat; height:350px; background-size:cover; }
#sub_img8_m{display:block; background:url('/images/contents/img8	.jpg') no-repeat; height:350px; background-size:cover; }
#sub_img9_m{display:block; background:url('/images/contents/img9	.jpg') no-repeat; height:350px; background-size:cover; }
#sub_img10_m{display:block; background:url('/images/contents/img10.jpg') no-repeat; height:350px; background-size:cover; }
}

@media screen and (max-width:1280px) {
.table_book li{height:450px}
}

@media screen and (max-width:1024px) {
.table_book .img img{width:100%; height:300px}

#sub_img1, #sub_img2, #sub_img3, #sub_img4, #sub_img5, #sub_img6, #sub_img7, #sub_img8, #sub_img9, #sub_img10{display:none}
#sub_img1_m{height:300px;}
#sub_img2_m{height:300px;}
#sub_img3_m{height:300px;}
#sub_img4_m{height:300px;}
#sub_img5_m{height:300px;}
#sub_img6_m{height:300px;}
#sub_img7_m{height:300px;}
#sub_img8_m{height:300px;}
#sub_img9_m{height:300px;}
#sub_img10_m{height:300px;}

#contents{padding:20px;}
#contents2{padding:20px;margin-top:10px}
.table_book li{width:32.7%}

#login_box{width:80%}
#search_box{width:100%;box-sizing:border-box}
}
@media screen and (max-width:980px) {
.table_book li{height:500px}
#footer{text-align:center; }
#footer_wrap{width:100%}
  #footer_wrap .left{float:none;margin-bottom:20px}
}

@media screen and (max-width:785px) {
#navi{display:none}
#top_menu{background-color:#ffffff;}
#top_wrap{width:100%; padding:1em 1em 0 1em; box-sizing:border-box;}
#m_mavi{display:inline; font-size:2em;cursor:pointer}
#top_menu li{color:#000000}
#visual_images{display:none}
#contents_wrap{border-top:5px solid #666666}
#logo{margin:10px; text-align:right}
#logo img{width:100px}
}



@media screen and (max-width:768px) {

.table_book .img img{width:100%; height:200px}

  #contents_1024{display:none}
  #contents_780{display:block}
  #contents_340{display: none}

#sub_img1_m{height:400px;}
#sub_img2_m{height:400px;}
#sub_img3_m{height:400px;}
#sub_img4_m{height:400px;}
#sub_img5_m{height:400px;}
#sub_img6_m{height:400px;}
#sub_img7_m{height:400px;}
#sub_img8_m{height:400px;}
#sub_img9_m{height:400px;}
#sub_img10_m{height:400px;}

.table_ex li:nth-child(1){width:40%;}
.table_ex li:nth-child(2){width:60%;}
.table_book li{height:400px}

}

@media screen and (max-width:670px) {

.table_book .img img{width:100%; height:330px}
.m_img{display:block}


#owl-demo .in_img_02{display:block}
#owl-demo .in_img_01{display:none}


#title_1, #title_2, #title_3{text-align:left; width:100%;color:#ffffff; border:0px; padding:5px 10px; font-size:1.8em; box-sizing:border-box}
#title_1{background-color:#ee8100;}
#title_2{background-color:#009fe9}
#title_3{background-color:#333333;}
#sub_tab_1, #sub_tab_2, #sub_tab_3{margin-left:0px}


#in_icon{width:100%}
#ii_2 li{margin:2px}
.table_book li{width:49%}

.book_left{float:default; width:100%; }
.book_right{float:default; width:100%;}
.book_right {padding:0px;}
#s_icon ul li.sns_icon_mobile{display:block;}

.table_ex li:nth-child(1){width:100%;}
.table_ex li:nth-child(2){width:100%;padding:20px 0 0 0}

.table_writer li:nth-child(1){width:30%;}
.table_writer li:nth-child(2){width:70%;}

.table_pro li:nth-child(1){width:30%;}
.table_pro li:nth-child(2){width:70%;}
.table_book li{height:500px}

#search_input{width:78%}

/* Å×ÀÌºí ±âº» */
.table_con .no{display:none}
.table_con .write{}
.table_con .w_date{display:none}
.table_con .hit{display:none}
.table_con .cate	 {display:none}
#board-search_input{display:none}

#login_box{width:90%}
.login_txt2{width:100%}
#ii_1{ margin:-20px 0 10px 0}
#ii_1 li{padding:0px  5px;}

.book_m{float:none;}
.book_m2{margin:0px 0 20px 10px; float:none}

#footer_pc{display:none}
#footer_m{display:block; font-size:0.9em; margin:-20px 0}
}

@media screen and (max-width:500px) {
.table_book li{height:400px}
.table_book .img img{width:100%; height:230px}
}


@media screen and (max-width:460px) {
.table_book li{height:400px}
.table_book .img img{width:100%; height:200px}
#ii_1 li{padding:0px 5px 15px;}
#ii_1 li img{height:76px;}
}

@media screen and (max-width:420px) {
#view_pc{display:none}
#view_m{display:block; text-align:center}
#view_m li{padding: 8px 15px}
  #contents_1024{display: none}
  #contents_780{display:none}
  #contents_340{display:block}

#top_member li{padding:10px 5px; }
#ii_2 li{ letter-spacing:-0.1em; font-size:0.9em; padding-left:8px; padding-right:8px;}
.table_book li{width:100%; height:auto}
.table_book .img img{width:100%; height:auto}
.table_writer li:nth-child(1){width:100%;}
.table_writer li:nth-child(2){width:100%;padding:20px 0 0 0}

.table_pro li:nth-child(1){width:100%;}
.table_pro li:nth-child(2){width:100%;padding:20px 0 0 0}

#search_input{float:default;width:100%}
.search_btn{float:default;margin:0 auto; width:30% }
#search_input dt{float:default; width:100%; text-align:left}

#m_popup{display:block; width:100%; border:1px solid #cccccc}
#popup{display:none}

.table_book li{height:auto}
}

@media screen and (max-width:350px) {
#ii_1 li{padding:15px 3px}
#ii_1 li img{height:70px;}
#ii_2 li{margin:10px 0px}

}


@media screen and (max-width:320px) {



}