@charset 'UTF-8';

/* Slider */
.slick-loading .slick-list{    background: #fff url('./ajax-loader.gif') center center no-repeat;}

/* Icons */
@font-face {    font-family: 'slick';    font-weight: normal;    font-style: normal;
    src: url('./fonts/slick.eot');
    src: url('./fonts/slick.eot?#iefix') format('embedded-opentype'), 
         url('./fonts/slick.woff') format('woff'), url('./fonts/slick.ttf') format('truetype'), url('./fonts/slick.svg#slick') format('svg');
}



/* 상설전시 슬라이드 이미지  */
.multiple-items img{    display: block; width: 100%; height: 150px;  border: 3px solid #fff;}

.multiple-items p{font-weight: bold; margin-top:10px; text-align: center; }
.multiple-items div > a {position: relative; display: block; width: 100%; height:100%;}
.multiple-items div > a:hover:after {display:block; content:""; box-sizing:border-box; position:absolute; 
    top:0; left:0; border:5px solid #e0e0e0; width:100%; height:100%; 
    background:url("./../../design_image/sub/show/click_hover.png") no-repeat center rgba(0,0,0,0.6); 
    -webkit-transition:all 0.2s; transition:all 0.2s}

/* .multiple-items div > a:after {display:block; content:""; position:absolute; top:0; left:0; 
    width:100%; height:100%; background:url("../images/common/exhibit/icon-search.png") no-repeat center center; 
    opacity:0; -webkit-transition:all 0.2s; transition:all 0.2s} */





/* Arrows */ 

.slick-prev, .slick-next{     font-size: 0;     line-height: 0;    position: absolute;    top: 43%;     display: block;
    width: 40px;     height: 40px;    padding: 0;
    -webkit-transform: translate(0, -50%);    -ms-transform: translate(0, -50%);    transform: translate(0, -50%);
    cursor: pointer;    color: transparent;    border: none;    outline: none;   background: transparent;}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {     outline: none;   }

.slick-prev:hover:before,.slick-prev:focus:before,.slick-next:hover:before, .slick-next:focus:before{    opacity: 1;}
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before{    opacity: .25;}


/* 버튼 색상 및 동그라미 각자 class 다르게 넣어야 버튼 다르게 나온다. ======================================================== */

/* 대관안내 슬라이드 내부 사진 */
.multiple-items_lent img{    display: block; width: 100%; height: 125px;  border: 3px solid #fff;}
.multiple-items_lent .slick-prev:before, .multiple-items_lent .slick-next:before{
    font-family: 'slick';     font-size: 35px;     line-height: 1;    opacity: .75;    color:#c3c3c3; 
    -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;}

.multiple-items_lent .slick-prev, .multiple-items_lent .slick-next{     font-size: 0;     line-height: 0;    position: absolute;
	top: 54%;     display: block;	width: 40px;     height: 40px;    padding: 0;
	-webkit-transform: translate(0, -50%);    -ms-transform: translate(0, -50%);    transform: translate(0, -50%);
	cursor: pointer;    color: transparent;    border: none;    outline: none;   background: transparent;}

.multiple-items_lent a {position: relative; display: block; width: 100%; height: 100%;}
.multiple-items_lent a:hover:after {display:block; content:""; box-sizing:border-box; position:absolute; 
        top:0; left:0; border:5px solid #e0e0e0; width:100%; height:100%; 
        background:url("./../../design_image/sub/show/click_hover.png") no-repeat center rgba(0,0,0,0.6); 
        -webkit-transition:all 0.2s; transition:all 0.2s}

        


/* main sns */
.socialSlide .slick-prev, 
	 .socialSlide .slick-next {top:107% !important; }

/* 전시관 조감도 및 슬라이드 내부 사진 */
.multiple-items .slick-prev:before, .multiple-items .slick-next:before{
    font-family: 'slick';     font-size: 35px;     line-height: 1;    opacity: .75;    color:#c3c3c3; 
    -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;}

/* 전시관  sub2-1-6 메인사진 슬라이드*/
.single-item .slick-prev:before, .single-item  .slick-next:before{
    font-family: 'slick';     font-size: 35px;    line-height: 1;    opacity: .95;    color:#fff; 
    -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;} 

/* 전시관  sub2-1-7 메인사진 슬라이드2*/
.single-item2 .slick-prev:before, .single-item2  .slick-next:before{
    font-family: 'slick';     font-size: 35px;    line-height: 1;    opacity: .95;    color:#fff; 
    -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;} 
    


/* 교육사진 게시판 슬라이드 */
.in_slid_box .slider-nav {background:#fafafa; box-sizing:border-box; padding:2% 5%;}
.in_slid_box .slick-prev:before, .in_slid_box .slick-next:before{
		font-family: 'slick';     font-size: 35px;     line-height: 1;    opacity: .75;    color:#828282; 
		-webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;}

.in_slid_box .slick-prev,
.in_slid_box .slick-next {top:52%;}
.in_slid_box  .slick-list {height: 100%;}
.in_slid_box  .slick-list img.slider-nav-img  {width: 250px; height:150px; margin:0 5px;}
.in_slid_box .slick-dots {left:0;}


.slick-prev {    left: 5px; z-index:10;}
[dir='rtl'] 

.slick-prev{    right: 0px;    left: auto;}

.slick-prev:before {    content: '←';}
[dir='rtl'] .slick-prev:before{    content: '→';}

.slick-next {    right: 5px;}
[dir='rtl'] 

.slick-next{    right: auto;    left: 0px;}
.slick-next:before{    content: '→';}
[dir='rtl'] .slick-next:before{    content: '←';}

/* Dots */
.slick-dotted.slick-slider {    margin-bottom: 30px; }

.slick-dots {    position: absolute;    bottom: -25px;    display: block;
    width: 100%;    padding: 0;    margin: 0;    list-style: none;    text-align: center;}
.slick-dots li {    position: relative;    display: inline-block;
    width: 20px;     height: 20px;    margin: 0 5px;    padding: 0;    cursor: pointer;}
.slick-dots li button {    font-size: 0;    line-height: 0;    display: block;    width: 20px;
    height: 20px;    padding: 5px;    cursor: pointer;    color: transparent;    border: 0;
    outline: none;    background: transparent;}
.slick-dots li button:hover, .slick-dots li button:focus{     outline: none;}
.slick-dots li button:hover:before, .slick-dots li button:focus:before{    opacity: 1;}
.slick-dots li button:before{    font-family: 'slick';    font-size: 6px;    line-height: 20px;
    position: absolute;    top: 0;    left: 0;    width: 20px;    height: 20px;    content: '•';
    text-align: center;    opacity: .25;    color: black;
    -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;}
.slick-dots li.slick-active button:before {    opacity: .75;    color: black;}



/* 320 모바일 사이즈 시작===================================================================================================================== */
@media screen and (min-width:320px)and (max-width:767px){

.in_slid_box .slider-nav {margin-top:20px;} 
.in_slid_box  .slick-list img.slider-nav-img  {width: 250px; max-height:110px !important; margin:0 5px;}
.in_slid_box  .slick-list img.slider-for-img {min-height:250px ; max-height:250px ;}


}