/* ////////////////////////////////////////////////////////////////////////////////
//
//  /works/css/style.css
//
//////////////////////////////////////////////////////////////////////////////// */
/* add & override
================================================================================ */
/* #main + .inner
================================================================================ */
#main {
    position: relative;
    width: 100%;
    padding: 0 0 45px 0;
    background-color: #000122;
    background-image: url(../../img/common/base_visual.png);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: right 165px;
    background-size: 761px 704px;
}

#main .inner {
    width: 1010px;
    margin: 0 auto;
    padding: 115px 0 0 0;
    color: #ffffff;
}

@media only screen and (max-width: 667px) {
    #main {
        width: auto;
        padding: 0 12px 30px 12px;
    }
    #main .inner {
        width: auto;
        padding: 70px 0 0 0;
    }
}

/* #main + #anchor
================================================================================ */
#main #anchor ul {
    display: inline-block;
    float: left;
}

#main #anchor ul:not(:first-child) {
    margin: 0 0 0 50px;
}

#main #anchor li {
    float: left;
    margin: 6px 0 0 50px;
}

#main #anchor li a {
    -webkit-transition: all 0.25s;
            transition: all 0.25s;
}

#main #anchor li a:hover {
    opacity: 0.8;
}

#main #anchor li:first-child {
    margin: 6px 0 0 0;
}

@media only screen and (max-width: 667px) {
    #main #h1 {
        float: none;
        padding: 15px 0 15px 0;
        text-align: center;
        border-bottom: 1px solid #fefefe;
        background-image: url(../../img/common/hr.png);
        background-repeat: repeat-x;
        background-position: 0 0;
        background-size: 50px 3px;
    }
    #main #anchor {
        float: left;
    }
    #main #anchor ul {
        display: block;
        float: none;
        background: #669900;
    }
    #main #anchor ul:not(:first-child) {
        margin: 0 0 0 0;
    }
    #main #anchor li {
        margin: 6px 0 0 25px;
        text-align: left;
    }
    #main #anchor #anchor01 img {
        width: 67px;
    }
    #main #anchor #anchor02 img {
        width: 67px;
    }
    #main #anchor #anchor03 img {
        width: 110px;
    }
    #main #anchor #anchor04 img {
        width: 67px;
    }
    #main #anchor #anchor05 img {
        width: 67px;
    }
    #main .hr2 {
        margin: 20px 0 0 0;
    }
}

/* #main + .block
================================================================================ */
#main .block h3 {
    width: 100%;
    padding: 45px 0 0 0;
}

#main .block .thumbs {
    width: 953px;
    margin: 0 auto;
}

#main .block .thumbs ul {
    display: inline-block;
    margin: 50px 0 0 0;
}

#main .block .thumbs ul:first-child {
    margin: 25px 0 0 0;
}

#main .block .thumbs li {
    float: left;
    width: 271px;
    margin: 0 0 0 70px;
    background-image: url(../../img/common/dot_ffffff.png);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: 271px 179px;
}

#main .block .thumbs li a {
    display: block;
    -webkit-transition: all 0.25s;
            transition: all 0.25s;
}

#main .block .thumbs li a:hover {
    opacity: 0.8;
}

#main .block .thumbs li p {
    padding: 12px 0 0 0;
    font-size: 11px;
    line-height: 18px;
}

#main .block .thumbs li img {
    width: 271px;
    height: 179px;
}

#main .block .thumbs li:first-child {
    margin: 0 0 0 0;
}

@media only screen and (max-width: 667px) {
    #main .block h3 {
        width: 100%;
        padding: 15px 0 0 0;
    }
    #main .block .thumbs {
        width: auto;
    }
    #main .block .thumbs ul {
        display: block;
        margin: 15px 0 0 0;
    }
    #main .block .thumbs ul:first-child {
        margin: 20px 0 0 0;
    }
    #main .block .thumbs li {
        float: none;
        width: auto;
        margin: 15px 0 0 0;
        padding: 0 15px;
        background: none;
    }
    #main .block .thumbs li p {
        padding: 5px 0 0 0;
        font-size: 11px;
        line-height: 12px;
    }
    #main .block .thumbs li img {
        width: 100%;
        height: auto;
    }
}
