html,body{
    margin:0;
    padding:0;
}
.wrap {
    margin: 0 auto;
    width: 960px; }

h2.ttl {
    background-color: #000;
    color: #fff;
    font-size: 200%;
    font-weight: bold;
    margin-bottom: 80px;
    text-align: center;
    padding: 60px 21%;
    position: relative; }
h2.ttl:before {
    content: "";
    border-top: 3px solid #fff;
    width: 20%;
    top: 75px;
    left: 0;
    position: absolute; }
h2.ttl:after {
    content: "";
    border-top: 3px solid #fff;
    width: 20%;
    top: 75px;
    right: 0;
    position: absolute; }
h2.ttl.underlayer {
    margin-bottom: 0; }
h2.ttl span {
    display: block;
    font-size: 55%;
    margin: 0 -20%;
    padding-top: 10px;
    position: relative; }
h2.ttl span:before {
    content: "";
    border-top: 3px solid #fff;
    position: absolute;
    width: 73%;
    top: 0;
    left: 0;
    right: 0;
    margin: auto; }
h2.sbttl {
    border-bottom: 3px solid #000;
    font-size: 200%;
    font-weight: bold;
    margin: 0 auto 30px;
    text-align: center;
    max-width: 700px; }


#interesting {
    background: #ffef94 url("../img/top/interesting_bg.png") repeat 0 0;
    overflow: hidden; }
#interesting .wrap {
    max-width: 1100px;
    margin-bottom: 80px;
    width: initial; }
#interesting .interesting_list {
    text-align: center; }
#interesting .interesting_list a {
    display: inline-block;
    margin-left: 15px;
    margin-right: 15px;
    margin-bottom: 30px;
    line-height: 0; }

#movie {
    background: #ffef94 url("../img/top/movie_bg.png") repeat 0 0;
    overflow: hidden; }
#movie .wrap {
    margin-bottom: 80px; }
#movie .movie_list {
    text-align: center;
    width: 640px;
    margin: auto;}
#movie .movie_list a {
    display: inline-block;
    margin-left: 3px;
    margin-right: 3px;
    margin-bottom: 50px;
    line-height: 0; }




#cboxLoadedContent {
    border: none; }

#cboxOverlay {
    background: url("../img/top/colorbox_bg.png") repeat 0 0; }

#cboxTitle {
    display: none !important; }

.interesting_modal {
    padding: 40px; }
.interesting_modal h2 {
    margin: 20px 0px 10px;
    font-size: 200%;
    font-weight: bold; }
.interesting_modal p {
    font-size: 120%;
    font-weight: bold; }



/* SP */

@media screen and (max-width: 960px) {
    html {
        font-size: 62.5%; }

    body {
        font-size: 1.4rem; }

    img {
        max-width: 100%; }

    .wrap {
        width: 100%;
        box-sizing: border-box;
        padding: 1rem; }

    h2.ttl {
        margin-bottom: 40px;
        padding: 40px 20px; }
    h2.ttl:before {
        display: none; }
    h2.ttl:after {
        display: none; }
    h2.ttl span {
        margin: 0; }
    h2.sbttl {
        margin: 0 1rem 30px; }


    #interesting .interesting_list {
        margin: 0 auto;
        width: 90%; }
    #interesting .interesting_list a {
        float: left;
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 15px;
        width: calc(50% - 10px);
        text-align: center; }

    #movie {
        background: #ffef94 url("/recruit/2018/img/top/movie_bg.png") repeat 0 0;
        overflow: hidden; }
    #movie .wrap {
        margin-bottom: 40px; }
    #movie .movie_list {
        margin: 0 auto;
        width: 90%; }
    #movie .movie_list a {
        float: left;
        margin-left: 3px;
        margin-right: 3px;
        margin-bottom: 30px;
        width: calc(50% - 6px);
        text-align: center; }
    #movie .movie_list a.bnr_big {
        width: 100%;
        max-width: 960px; }


    .interesting_modal {
        padding: 20px; }
    .interesting_modal h2 {
        font-size: 150%; }
    .interesting_modal h2 p {
        font-size: 110%;
        font-weight: normal; }

    div.responsive_box {
        width: 100%; }

    div.responsive_wrap {
        padding-bottom: 56.25%;
        position: relative; }

    .responsive_wrap iframe {
        width: 100%;
        height: 100% !important;
        left: 0;
        position: absolute;
        top: 0; }

    .visible-sp {
        display: block; }

    .hidden-sp {
        display: none; }
}