﻿/*###################################*/
/*####### Mobile - 핸드폰 -s ########*/
/*###################################*/
@media all and (min-width:1px) and (max-width:768px) {


    #IndexWrap {
        font-size: 0px;
        padding: 6px 10px 40px 10px;
    }

        #IndexWrap h3 {
            font-weight: 400;
            font-size: 18px;
            margin: 20px 5px 10px 0px;
            padding: 0px 0px 5px 0px;
            border-bottom: 1px solid #cccccc;
            color: #1e5aae;
        }

            #IndexWrap h3 i {
                font-size: 14px;
                color: #808080;
            }

        #IndexWrap span {
            display: inline-block;
            background-color: #8ca9c2;
            color: #ffffff;
            width: 70px;
            text-align: center;
            margin-right: 5px;
            font-size: 11px;
            padding: 3px 0px 2px 0px;
        }

    #IndexBoardWrap {
        width: 100%;
    }

        #IndexBoardWrap ul {
        }

        #IndexBoardWrap li {
            padding: 5px 0px 5px 0px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
            #IndexBoardWrap li > a {
                color: #000000;
            }

    #BestBoardWrap {
        font-size: 0px;
        border: 10px dashed #eeeeee;
        border-radius: 6px;
        background-color: #f5f5f5;
        padding: 5px 0px 10px 15px;
    }

        #BestBoardWrap > div {
            font-size: 12px;
        }

    #GallaryBoardWrap {
        margin: 15px 0px 0px 0px;
    }

        #GallaryBoardWrap > ul {
            font-size: 0px;
        }

            #GallaryBoardWrap > ul > li {
                display: inline-block;
                font-size: 12px;
                width: 50%;
                padding: 3px;
            }

                #GallaryBoardWrap > ul > li > div {
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                }
                    #GallaryBoardWrap > ul > li > div > a {
                        color: #000000;
                    }

                    #GallaryBoardWrap > ul > li  div > a > img {
                        width: 100%;
                        height: 120px;
                        margin-bottom: 5px;
                    }
                    #GallaryBoardWrap > ul > li:nth-child(5), #GallaryBoardWrap > ul > li:nth-child(6), #GallaryBoardWrap > ul > li:nth-child(7), #GallaryBoardWrap > ul > li:nth-child(8), #GallaryBoardWrap > ul > li:nth-child(9), #GallaryBoardWrap > ul > li:nth-child(10){
                        display:none;
                    }

                    /*#GallaryBoardWrap > ul > li:last-child {
                        display:none;
                    }*/


    #NormalBoardWrap {
        font-size: 0px;
        padding: 5px 0px 0px 5px;
    }

        #NormalBoardWrap > div {
            font-size: 12px;
            margin: 5px 0px 0px 0px;
        }




    #IndexMemoWrap {
        display:none;
    }
}
/*###################################*/
/*####### Mobile - 핸드폰 -e ########*/
/*###################################*/




/*#################################*/
/*######### PC 컴퓨터 -s ##########*/
/*#################################*/
@media all and (min-width:769px) {

    #IndexWrap{
        font-size:0px;
        padding:10px 0px 40px 10px;
    }
        #IndexWrap h3 {
            font-weight: 400;
            font-size: 18px;
            margin: 10px 18px 10px 0px;
            padding: 0px 0px 5px 0px;
            border-bottom: 1px solid #cccccc;
            color: #1e5aae;
        }
            #IndexWrap > h3 > a{
                color: #1e5aae !important;
            }
            #IndexWrap h3 i{
                font-size:14px;
                color:#808080;
            }

        #IndexWrap span {
            display: inline-block;
            background-color: #8ca9c2;
            color:#ffffff;
            width:70px;
            text-align:center;
            margin-right:5px;
            font-size:11px;
            padding:3px 0px 2px 0px;
        }


        #IndexWrap > div{
            display:inline-block;
            font-size:12px;
            vertical-align:top;
        }

    #IndexBoardWrap {
        width: 66.6%;
        border-right: 1px solid #cccccc;
    }
        #IndexBoardWrap a {
        }
        #IndexBoardWrap ul{
            padding-right:18px;
        }
            #IndexBoardWrap li{
                padding:5px 0px 5px 0px;
                overflow:hidden;
                text-overflow:ellipsis;
                white-space:nowrap;
            }
                #IndexBoardWrap li > a {
                    color: #000000;
                }

        #BestBoardWrap{
            font-size:0px;
            border: 10px dashed #eeeeee;
            border-radius:6px;
            background-color:#f5f5f5;
            padding:5px 0px 10px 15px;
            margin-right:15px;
            vertical-align:top;
        }
            #BestBoardWrap > div{
                display:inline-block;
                width:50%;
                font-size:12px;
                vertical-align:top;
            }

        #GallaryBoardWrap{
            margin:15px 0px 0px 4px;
        }
            #GallaryBoardWrap > ul{
                font-size:0px;
            }
                #GallaryBoardWrap > ul > li{
                    display:inline-block;
                    font-size:12px;
                    width:calc(25% - 0.5rem);
                    padding:3px;
                    margin-right:0.5rem;
                    margin-bottom:0.75rem;
                }
                #GallaryBoardWrap > ul > li:nth-child(4n+0) {
                    margin-right: 0rem !important;
                }
                    #GallaryBoardWrap > ul > li > div {
                        overflow: hidden;
                        text-overflow: ellipsis;
                    }
                    #GallaryBoardWrap > ul > li > div > a {
                        color:#000000;
                    }
                        #GallaryBoardWrap > ul > li > div > a > img {
                            width:100%;
                            height:120px;
                            margin-bottom:5px;
                        }


        #NormalBoardWrap{
            font-size:0px;
            padding:5px 0px 0px 10px;
        }
            #NormalBoardWrap > div{
                display:inline-block;
                font-size:12px;
                width:50%;
                margin:5px 0px 0px 0px;
                vertical-align:top;
            }




    #IndexMemoWrap {
        width: 33.3%;
        padding:0px 0px 0px 15px;
    }
        #IndexMemoWrap h3{

        }
            #IndexMemoWrap h3 > a{
                color: #1e5aae !important;
            }
        #IndexGoogleBanner02 > img{
            width:300px;
            margin:0px 0px 10px 0px;
        }
        #IndexMemoWrap ul{
            padding-bottom:7px;
        }
            #IndexMemoWrap li{
                padding:5px 20px 5px 0px;
                overflow:hidden;
                text-overflow:ellipsis;
                white-space:nowrap;
            }
            #IndexMemoWrap a{
                color:#000000;
            }

}
/*#################################*/
/*######### PC 컴퓨터 -e ##########*/
/*#################################*/