@charset "UTF-8";
/*!* -------------------------------
    interview
------------------------------- *!*/

#content .page_title {
    margin-bottom: 85px
}

#content .page_title .num img {
    width: 28%
}

#content .page_title .label {
    background-color: #588b87;
}

#content #movie {
    width: 74.47%;
    margin: 0 auto 80px
}

#content #movie .inner {
    position: relative;
    height: 0;
    padding-bottom: 56.25%
}

#content #movie iframe {
    position: absolute;
    width: 100%;
    height: 100%
}

#content #movie .info {
    margin-top: 40px
}

#content #movie .info .movie_title {
    margin-bottom: 20px;
    font-size: 1.5em
}

#content #movie .info .movie_info {
    margin-bottom: 30px
}

#content #movie .info .movie_info span {
    display: inline-block;
    padding-right: 20px;
    line-height: 1.8;
}

#content #movie .info .interviewer {
    margin-bottom: 20px
}

#content #interview {
    margin-bottom: 40px
}

#content #interview .item {
    padding: 60px 0 50px;
    border-bottom: 1px solid #a4ba88
}

#content #interview .item:first-child {
    border-top: 1px solid #a4ba88
}

#content #interview .item .name {
    margin-bottom: 20px;
    font-size: 2em
}

#content #interview .item .name .en {
    padding-left: 25px;
    font-size: .63em;
    vertical-align: .15em
}

#content #interview .item .interview_row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

#content #interview .item .interview_row .col {
    width: 71.28%
}

#content #interview .item .interview_row .col + .col {
    width: 23.4%;
    margin-left: 50px
}

#content #interview .item .interview_row .profile .label {
    font-size: 1.13em;
    margin-bottom: 5px
}

#content #interview .item .interview_row .profile .text {
    font-size: .88em
}

#content #interview .item .interview_row .bt_more {
    margin-top: 20px
}

#content #interview .item .interview_row .bt_more a {
    display: inline-block;
    padding: 12px 75px 12px 15px;
    border: 1px solid #a4ba88;
    text-decoration: none;
    background: url(../../shared/img/arr_btn.png) no-repeat right 0;
    -webkit-background-size: auto 100%;
    background-size: auto 100%
}

#content #interview .item .interview_row .bt_more a span {
    margin-right: 10px
}

#content.under .under_page_title {
    margin-bottom: 50px
}

#content.under .under_page_title .lead {
    margin-bottom: 40px;
    font-size: 1.13em;
    line-height: 1.8
}

#content.under .under_page_title dl {
    width: 100%
}

#content.under .under_page_title dl dd,
#content.under .under_page_title dl dt {
    display: block;
    border: 1px solid #86a361
}

#content.under .under_page_title dl dt {
    padding: 18px 18px
}

#content.under .under_page_title dl dt .label {
    font-size: 2.13em;
    line-height: 1.6
}

#content.under .under_page_title dl dt .label em {
    font-weight: 600
}

#content.under .under_page_title dl dd {
    padding: 14px 18px;
    border-top: none
}

#content.under .under_page_title dl dd .name {
    font-size: 1.31em
}

#content.under .under_page_title dl dd .name span {
    margin-left: 10px;
    font-size: 1.14em
}

#content.under .under_page_title dl dd .name em {
    margin-right: 5px;
    font-size: 1.62em;
    font-weight: 600
}

#content.under .article + .article {
    margin-top: 40px
}

#content.under .article .q {
    margin-bottom: 30px;
    color: #86a361
}

#content.under .article .q:before {
    display: inline-block;
    content: "";
    width: 2.5em;
    height: 1px;
    margin-right: .5em;
    background-color: #86a361;
    vertical-align: .3em
}

#content.under .article .a .has_image + p,
#content.under .article .a p + .img_c,
#content.under .article .a p + p {
    margin-top: 30px
}

#content.under .article .a p + .has_image {
    margin-top: 25px
}

#content.under .article .a .has_image {
    display: inline-block
}

#content.under .article .a .has_image:after {
    content: ".";
    display: block;
    height: 0;
    font-size: 0;
    clear: both;
    visibility: hidden
}

#content.under .article .a .img_l {
    width: 39.74%;
    float: left;
    margin: .5em 30px 20px 0
}

#content.under .article .a .img_r {
    width: 39.74%;
    float: right;
    margin: .5em 0 20px 30px
}

#content.under .article .a .img_r .note {
    text-align: right
}

#content.under .article .a .img_c {
    text-align: center;
    letter-spacing: -.4em
}

#content.under .article .a .img_c > div {
    display: inline-block;
    width: 39.74%;
    margin: 0 1.92%;
    letter-spacing: normal;
    vertical-align: top
}

#content.under .article .a .img_c .note {
    text-align: left
}

#content.under .article .a .img_c .note.align_right {
    text-align: right
}

#content.under .article .a .img_c + .img_c {
    margin-top: 30px
}

#content.under .article .a .img_c.col3 > div {
    width: 30.77%;
    margin: 0 0 0 3.72%;
    letter-spacing: normal;
    vertical-align: top
}

#content.under .article .a .img_c.col3 > div:first-child {
    margin-left: 0
}

#content.under .article .a .type_v {
    width: 29.49%
}

#content.under .article + .note {
    margin-top: 30px
}

#content.under .article + .note li + li {
    margin-top: 10px
}

#content.under .pager {
    margin-top: 60px;
    text-align: center
}

#content.under .pager ul {
    letter-spacing: -.4em
}

#content.under .pager ul li {
    display: inline-block;
    margin: 0 20px;
    letter-spacing: normal
}

#content.under .pager ul li a {
    opacity: .5;
    -webkit-transition: opacity .25s ease-out;
    transition: opacity .25s ease-out
}

#content.under .pager ul li a:hover {
    opacity: 1
}

#content.under .pager ul li img {
    width: auto;
    height: 26px
}

#content.under .pager ul li:nth-child(2) img {
    height: 25px
}

#content.under .pager .return {
    margin-top: 30px
}

#content.under .pager .return a {
    display: inline-block;
    padding-right: 30px;
    background: url(../../shared/img/arr.png) no-repeat right 0;
    -webkit-background-size: 1.25em auto;
    background-size: 1.25em auto;
    line-height: 1.5
}

@media only screen and (max-width:767px) {
    #content .page_title {
        margin-bottom: 30px
    }

    #content #movie {
        width: 100%;
        margin: 0 0 40px
    }

    #content #movie .info {
        margin-top: 20px
    }

    #content #movie .info .movie_title {
        font-size: 1.38em
    }

    #content #movie .info .movie_info {
        margin-bottom: 20px
    }

    #content #movie .info .movie_info span {
        display: block;
        margin-bottom: 4px;
        line-height: 0.2;
    }

    #content #interview {
        margin-bottom: 0
    }

    #content #interview .item {
        padding: 40px 0 30px
    }

    #content #interview .item .name {
        font-size: 1.63em
    }

    #content #interview .item .name .en {
        padding-left: 20px;
        font-size: .69em
    }

    #content #interview .item .interview_row {
        display: block
    }

    #content #interview .item .interview_row .col {
        width: 100%
    }

    #content #interview .item .interview_row .col + .col {
        width: 70%;
        margin: 30px auto 0
    }

    #content.under .under_page_title {
        margin-bottom: 30px
    }

    #content.under .under_page_title .lead {
        margin-bottom: 20px;
        font-size: 100%
    }

    #content.under .under_page_title dl dt .label {
        font-size: 1.57em
    }

    #content.under .under_page_title dl dd .name {
        font-size: 1em
    }

    #content.under .under_page_title dl dd .name span {
        font-size: 1.14em
    }

    #content.under .under_page_title dl dd .name em {
        font-size: 1.57em
    }

    #content.under .article .q {
        margin-bottom: 20px
    }

    #content.under .article .a .has_image + p,
    #content.under .article .a p + .img_c,
    #content.under .article .a p + p {
        margin-top: 20px
    }

    #content.under .article .a p + .has_image {
        margin-bottom: 15px
    }

    #content.under .article .a .img_l {
        width: 100%;
        margin: 0 0 10px
    }

    #content.under .article .a .img_l .note {
        margin-top: 5px
    }

    #content.under .article .a .img_r {
        width: 100%;
        margin: 0 0 10px
    }

    #content.under .article .a .img_r .note {
        margin-top: 5px;
        text-align: left
    }

    #content.under .article .a .img_c > div {
        width: 100%;
        margin: 0
    }

    #content.under .article .a .img_c > div + div {
        margin-top: 20px
    }

    #content.under .article .a .img_c .note {
        margin-top: 5px
    }

    #content.under .article .a .img_c .note.align_right {
        text-align: left
    }

    #content.under .article .a .img_c + .img_c {
        margin-top: 20px
    }

    #content.under .article .a .img_c.col3 > div {
        width: 100%;
        margin: 0
    }

    #content.under .article .a .img_c.col3 > div + div {
        margin-top: 20px
    }

    #content.under .article .a .type_v {
        width: 100%
    }

    #content.under .pager {
        margin-top: 40px
    }
}