/*문체부 정체 글씨체 */
@font-face {
    font-family: 'moon';

    src: local('../../fonts/moon_fonts/converted-files');
    src: url('../../mn.eot?#iefix') format('embedded-opentype'),
         url('../../fonts/moon_fonts/converted-files/ttf') format('truetype'),
         url('../../fonts/moon_fonts/converted-files/woff') format('woff');
    font-weight: normal;
    font-style: normal;
    }

/*G마켓 글씨체*/ 
@font-face {
    font-family: 'gmar';
    src: local('../../fonts/gmarket_fonts/medium');
    src: url('../../fonts/gmarket_fonts/medium/GmarketSansTTFMedium.eot?#iefix') format('embedded-opentype'),
         url('../../fonts/gmarket_fonts/medium/GmarketSansTTFMedium.ttf') format('truetype'),
         url('../../fonts/gmarket_fonts/medium/GmarketSansTTFMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
  }

/*배달의 민족 글씨체*/  
@font-face {
    font-family: 'baemin2';
    src: local('../../fonts/baemin_fonts2/converted-files');
    src: url('BMHANNAAir_ttf.eot?#iefix') format('embedded-opentype'),
         url('../../fonts/baemin_fonts2/converted-files/BMHANNAAir.ttf') format('truetype'),
         url('../../fonts/baemin_fonts2/converted-files/BMHANNAAir.woff') format('woff');
    /* font-weight: normal;
    font-style: normal; */
  }

 /* 탑 버튼 */
    .top_btn {
        width: 60px;
        height: 60px;
        line-height: 60px;
        text-align: center;
        color: #839e69;
        display: none;
        z-index: 99999999999;
        cursor: pointer;

        position: fixed;
        right: 30px;
        bottom: 50px;
        border-radius: 50%;
        background: #eeeee2;
    
    }
    .top_btn:hover{
        background: #839e69;
        color: #fff;
    }
/* SNS 아이콘 */
.sns_box{
    width: 100%;
    height: 100px;
    margin-top: 50px;
}
.sns_box > p{
    width: 100%;
    height: 36px;
    font-size: 27px;
    line-height: 36px;
    font-family: "baemin2";
    font-weight: 600;
    text-align: center;
}
.sns_icon_box{
    width: 1200px;
    height: 64px;
    margin: 0 auto;
    padding: 0 400px;
    box-sizing: border-box;
    margin-top: 20px;
}
.sns_items {
    width: 64px;
    height: 64px;
    float: left;
    margin-right: 16px;
    cursor: pointer;
} 
.sns_items:hover .sns_btn_icon{
    display: none;
}
.sns_items:hover .sns_btn_hov{
    display: block;
}
.sns_items > div {
    width: 100%;
    height: 100%;
}
.sns_btn_hov {
    display: none;
}
.sns_icon1{background: url(../../img/icon/gre_fac_icon.png) no-repeat center /cover;}
.sns_icon2{background: url(../../img/icon/gre_ins_icon.png) no-repeat center /cover;}
.sns_icon3{background: url(../../img/icon/gre_you_icon.png) no-repeat center /cover;}
.sns_icon4{background: url(../../img/icon/gre_blog_icon.png) no-repeat center /cover;}
.sns_icon5{background: url(../../img/icon/gre_talk_icon.png) no-repeat center /cover;
margin-right: 0;}


.sns_hov1{background: url(../../img/icon/color_fac_icon.png) no-repeat center /cover;}
.sns_hov2{background: url(../../img/icon/color_ins_icon.png) no-repeat center /cover;}
.sns_hov3{background: url(../../img/icon/color_you_icon.png) no-repeat center /cover;}
.sns_hov4{background: url(../../img/icon/color_blog_icon.png) no-repeat center /cover;}
.sns_hov5{background: url(../../img/icon/color_talk_icon.png) no-repeat center /cover;}


/* 인스타 이미지 슬라이드 */
.ins_banner{
    width: 100%;
    height: 260px;
    margin: auto;
    margin-top: 50px;
    position: relative;
    overflow: hidden;
}

.ins_img{
    width: 260px;
    height: 260px;

    position: absolute;
    top: 0;
}
.ins_img1{background: url(../../img/ins_img/ins_img1.jpg) no-repeat center / cover;}
.ins_img2{background: url(../../img/ins_img/ins_img2.jpg) no-repeat center / cover;}
.ins_img3{background: url(../../img/ins_img/ins_img3.jpg) no-repeat center / cover;}
.ins_img4{background: url(../../img/ins_img/ins_img4.jpg) no-repeat center / cover;}
.ins_img5{background: url(../../img/ins_img/ins_img5.jpg) no-repeat center / cover;}
.ins_img6{background: url(../../img/ins_img/ins_img6.jpg) no-repeat center / cover;}
.ins_img7{background: url(../../img/ins_img/ins_img7.jpg) no-repeat center / cover;}
.ins_img8{background: url(../../img/ins_img/ins_img8.jpg) no-repeat center / cover;}
.ins_img9{background: url(../../img/ins_img/ins_img9.jpg) no-repeat center / cover;}
.ins_img10{background: url(../../img/ins_img/ins_img10.jpg) no-repeat center / cover;}


.btn_slide{
    position: absolute;
    top: 0;

    width: 50px;
    height: 300px;
    border: none;
    background: transparent;
    color: #000;
    font-size: 30px;
    font-weight: 800;
    outline: none;
    cursor: pointer;

}
.ins_banner:hover #right_btn{
    background: linear-gradient(to left, rgba(0,0,0,0.5),transparent);
}
.ins_banner:hover #left_btn{
    background: linear-gradient(to right, rgba(0,0,0,0.5),transparent);
}
#left_btn{
    left: 0;
}
#right_btn{
    right: 0;
}