@charset "utf-8";

#con1 .sld1{background-image: url(/images/smwel/main/sm_a_bg.png);}
#con1 .sld2{}
#con1 .sld3{}
#con1 .sld4{}



#con1 {height:470px; width: 1380px;}
#con1 .inner_box { top : 110px;}
#con1 .popup .grap .obj .item {height:500px;}
.mgllry .popup .grap .obj {position: relative; width: 95%; height: 355px;}
.mgllry {height:360px;}
@media(max-width:500px){
.mgllry .popup .grap .obj {width:100%}
#con1 {width: 400px; height: 470px;}
#con1 .inner_box {top: 110px; left: 295px;}
.icon {position: relative; top: 475px;}
.icon a {position: relative; left: 10px;}
#con2 {top: 68px;}
#con3 {top: 77px;}
 }


/*gallery*/
#gallery{background: url(/images/common/c/hak_c/gallery_bg.png) no-repeat 50% 50%;width:100%;background-size: cover;}
#gallery .inner{padding:50px 0}
#gallery h2{margin-bottom: 28px;color: #000;font-size: 28px;line-height: 24px;font-weight: 600;letter-spacing: -4px;text-align: center;}
#gallery h2 span{display: block;color: #555555;font-size: 16px;font-weight: normal;letter-spacing: 0;}
#gallery .depgallery .grap{margin:0 auto;max-width:1200px;height:370px;overflow:hidden}
#gallery .depgallery .grap .inner{position:relative;width:100%;padding: 0}
#gallery .depgallery .grap .obj{position: relative;float: left;width: 100%;height:370px;}
#gallery .depgallery .grap .obj .item{overflow: hidden;display:inline-block;position: relative;float: left;width:50%;height:370px;padding:0 23px}
#gallery .depgallery .grap .obj .item a{display: block;position: relative;width: 100%;height: 100%;background-color: #fff;}
#gallery .depgallery .grap .obj .item a .img{display:block;overflow: hidden;position: relative;width: 100%;height:196px;text-align: center;background:#fff}
#gallery .depgallery .grap .obj .item a .img img{display: block;max-width: none;width: 100%;height: 100%;transition: all .4s ease-in-out;}
#gallery .depgallery .grap .obj .item a .img img:hover,#gallery .depgallery .grap .obj .item a .img img:focus{transform: scale(1.2);}
#gallery .depgallery .grap .obj .item a .info{display: block;padding:35px 20px;width: 100%;text-transform: uppercase;-webkit-transition: -webkit-transform 0.35s;transition: transform 0.35s}
#gallery .depgallery .grap .obj .item a .tit{display: block;overflow: hidden;margin-bottom: 15px;height: 38px;font-family: 'nsr';font-size: 17px;line-height: 1.2;color: #000;letter-spacing: -1px;}
#gallery .depgallery .grap .obj .item a .tit:hover{text-decoration:underline}
#gallery .depgallery .grap .obj .item a .text{display: block;overflow: hidden;height:33px;color: #555; font-size: 14px;line-height: 1.2;margin-bottom:15px}
#gallery .depgallery .grap .obj .item a .date{display:block;margin-top:15px;color: #767676;font-size: 12px;line-height: 1;}
#gallery  .control{margin: 18px auto 0;width: 170px}
#gallery  .control .more{float:left;display:block;border: 1px solid #26303d;color: #222;padding: 6px 20px;font-size: 14px;height: 38px;width:82px;line-height: 1.5;text-align:center}
#gallery  .control .more:hover,#gallery  .control .more:focus{background-color:#26303d;color:#fff}
#gallery  .control .ctl_ir{background: url(/images/common/c/hak_c/m_ir.png) no-repeat;}
#gallery  .control [type^=button]{float:left;width: 38px;height: 38px;padding: 8px 0;font-size: 0;border: 1px solid #26303d;margin-left:6px}
#gallery  .control [data-control=prev]{background-position: 3px -30px;}
#gallery  .control [data-control=next]{background-position: -40px -30px;}
#gallery  .control [type^=button]:hover,#gallery  .control [type^=button]:focus{border:2px solid #26303d}
#gallery .wrapper{padding-right: 0px;}


@media (max-width:450px) {
#gallery .depgallery .grap .obj .item:first-of-type{width:255px;padding-left:50px;}
}


@media (min-width:768px) {
#gallery .inner{padding:80px 0 60px}
#gallery h2{text-align: left;margin-left:25px;margin-bottom: 60px;}
#gallery h2 span{display:inline;margin-left:10px}
#gallery  .control{position: absolute;top: -8px;right: 18px;margin-top: 0;}
#gallery .depgallery .grap .obj .item{width:33%;padding: 0 13px;}
#gallery .depgallery .grap .obj .item a .tit{height:45px}
#gallery .depgallery .grap .obj .item a .text{height:48px}
#gallery .depgallery .grap .obj .item a .img{height:162px}
#gallery .depgallery .grap .obj .item a .date{font-size:14px}
}
@media (min-width:1024px) {
#gallery .depgallery .grap{max-width:1050px;}
#gallery .depgallery .grap .obj .item{width:25.5%}

}
@media (min-width:1200px) {
#gallery .depgallery .grap .obj .item {width:20%;padding: 0 1%;}
#gallery h2{text-align:center;margin-left:0}
#gallery h2 span{display:block}
#gallery .control{right: 85px;}
}

@media (min-width:1400px) {
#gallery .depgallery .grap .obj .item {width:20%;}
#gallery  .control [type^=button]{display:none}
#gallery  .control{width:120px;right:33px;}
#gallery  .control .more{width:120px}
}

@media (min-width:1201px) and (max-width:1399px){
#gallery .depgallery .grap, 
#gallery .depgallery .grap .obj{width:1155px}   
}

@media (max-width:480px){
    #gallery .depgallery .grap .obj .item{width:100%}
}