@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent
}

body {
    line-height: 1
}
body {
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
    display: block
}

nav ul {
    list-style: none
}

blockquote,q {
    quotes: none
}

blockquote:after,blockquote:before,q:after,q:before {
    content: "";
    content: none
}

a {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent
}

/ change colours to suit your needs / ins {
    background-color: #ff9;
    color: #000;
    text-decoration: none
}

/ change colours to suit your needs / mark {
    background-color: #ff9;
    color: #000;
    font-style: italic;
    font-weight: 700
}

del {
    text-decoration: line-through
}

abbr[title],dfn[title] {
    border-bottom: 1px dotted;
    cursor: help
}

table {
    border-spacing: 0
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0
}

input,select {
    vertical-align: middle
}

body,html {
    font-size: 14px;
    font-family: ヒラギノ角ゴ ProN W3,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,Hiragino Kaku Gothic ProN,游ゴシック,YuGothic,meiryo,メイリオ,ＭＳ\ Ｐゴシック,MS PGothic,Sans-Serif;
    color: #000;
    width: 100%;
    height: 100%;
    line-height: 1.4;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    position: relative
}

body,h1,h2,h3,h4,h5,h6,html {
    margin: 0;
    padding: 0
}

li {
    list-style-type: none
}

ol,ul {
    margin: 0;
    padding: 0
}

table {
    margin: 0;
    border-collapse: collapse;
    width: 100%
}

a {
    outline: none;
    opacity: 1;
    -webkit-tap-highlight-color: transparent;
    -webkit-transition-duration: .1s;
    transition-duration: .1s;
    color: #000
}

a:link,a:visited {
    text-decoration: none
}

a:hover {
    text-decoration: none;
    outline: none;
    color: #514c47
}

a:hover img {
    opacity: .7;
    -webkit-opacity: .7;
    -moz-opacity: .7;
    filter: alpha(opacity = 50);
    -ms-filter: "alpha(opacity=50)"
}

a img {
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out
}

a:active {
    outline: none
}

.cf:after,.cf:before {
    display: table;
    content: ""
}

.cf:after {
    clear: both
}

.cf {
    zoom:1}

.tx10 {
    font-size: 77%!important
}

.tx11 {
    font-size: 85%!important
}

.tx12 {
    font-size: 93%!important
}

.tx14 {
    font-size: 108%!important
}

.tx15 {
    font-size: 116%!important
}

.tx16 {
    font-size: 123.1%!important
}

.tx17 {
    font-size: 131%!important
}

.tx18 {
    font-size: 138.5%!important
}

.tx19 {
    font-size: 146.5%!important
}

.tx20 {
    font-size: 153.9%!important
}

.tx21 {
    font-size: 161.6%!important
}

.tx22 {
    font-size: 167%!important
}

.tx23 {
    font-size: 174%!important
}

.tx24 {
    font-size: 182%!important
}

.tx25 {
    font-size: 189%!important
}

.tx26 {
    font-size: 197%!important
}

.tx_L {
    text-align: left!important
}

.tx_C {
    text-align: center!important
}

.tx_R {
    text-align: right!important
}

.tx_j {
    text-align: justify;
    text-justify: inter-ideograph!important
}

.va_T {
    vertical-align: top!important
}

.va_M {
    vertical-align: middle!important
}

.va_B {
    vertical-align: bottom!important
}

.fl_L {
    float: left!important
}

.fl_R {
    float: right!important
}

.fl_n {
    float: none!important
}

.hidden {
    overflow: hidden!important
}

.scroll {
    overflow: scroll!important
}

.scroll-y {
    overflow-y: scroll!important
}

.lh0 {
    line-height: 0!important
}

.lh10 {
    line-height: 1!important
}

.lh11 {
    line-height: 1.1!important
}

.lh12 {
    line-height: 1.2!important
}

.lh13 {
    line-height: 1.3!important
}

.lh14 {
    line-height: 1.4!important
}

.lh15 {
    line-height: 1.5!important
}

.lh16 {
    line-height: 1.6!important
}

.lh17 {
    line-height: 1.7!important
}

.lh175 {
    line-height: 1.75!important
}

.lh18 {
    line-height: 1.8!important
}

.lh19 {
    line-height: 1.9!important
}

.lh20 {
    line-height: 2!important
}

.m0 {
    margin: 0!important
}

.m1 {
    margin: 1px!important
}

.m2 {
    margin: 2px!important
}

.m3 {
    margin: 3px!important
}

.m4 {
    margin: 4px!important
}

.m5 {
    margin: 5px!important
}

.m6 {
    margin: 6px!important
}

.m7 {
    margin: 7px!important
}

.m8 {
    margin: 8px!important
}

.m9 {
    margin: 9px!important
}

.m10 {
    margin: 10px!important
}

.m15 {
    margin: 15px!important
}

.m20 {
    margin: 20px!important
}

.m25 {
    margin: 25px!important
}

.m30 {
    margin: 30px!important
}

.m35 {
    margin: 35px!important
}

.m40 {
    margin: 40px!important
}

.m45 {
    margin: 45px!important
}

.m50 {
    margin: 50px!important
}

.m55 {
    margin: 55px!important
}

.m60 {
    margin: 60px!important
}

.m65 {
    margin: 65px!important
}

.m70 {
    margin: 70px!important
}

.m75 {
    margin: 75px!important
}

.m80 {
    margin: 80px!important
}

.m85 {
    margin: 85px!important
}

.m90 {
    margin: 90px!important
}

.m95 {
    margin: 95px!important
}

.m100 {
    margin: 100px!important
}

.m110 {
    margin: 110px!important
}

.m120 {
    margin: 120px!important
}

.m130 {
    margin: 130px!important
}

.m140 {
    margin: 140px!important
}

.m150 {
    margin: 150px!important
}

.m160 {
    margin: 160px!important
}

.m170 {
    margin: 170px!important
}

.m180 {
    margin: 180px!important
}

.m190 {
    margin: 190px!important
}

.m200 {
    margin: 200px!important
}

.m220 {
    margin: 220px!important
}

.m240 {
    margin: 240px!important
}

.m260 {
    margin: 260px!important
}

.m280 {
    margin: 280px!important
}

.m300 {
    margin: 300px!important
}

.m0A {
    margin: 0 auto!important
}

.mt0 {
    margin-top: 0!important
}

.mt1 {
    margin-top: 1px!important
}

.mt3 {
    margin-top: 3px!important
}

.mt5 {
    margin-top: 5px!important
}

.mt7 {
    margin-top: 7px!important
}

.mt10 {
    margin-top: 10px!important
}

.mt15 {
    margin-top: 15px!important
}

.mt20 {
    margin-top: 20px!important
}

.mt25 {
    margin-top: 25px!important
}

.mt30 {
    margin-top: 30px!important
}

.mt35 {
    margin-top: 35px!important
}

.mt40 {
    margin-top: 40px!important
}

.mt45 {
    margin-top: 45px!important
}

.mt50 {
    margin-top: 50px!important
}

.mt55 {
    margin-top: 55px!important
}

.mt60 {
    margin-top: 60px!important
}

.mt65 {
    margin-top: 65px!important
}

.mt70 {
    margin-top: 70px!important
}

.mt75 {
    margin-top: 75px!important
}

.mt80 {
    margin-top: 80px!important
}

.mt85 {
    margin-top: 85px!important
}

.mt90 {
    margin-top: 90px!important
}

.mt95 {
    margin-top: 95px!important
}

.mt100 {
    margin-top: 100px!important
}

.mrA {
    margin-right: auto!important
}

.mr0 {
    margin-right: 0!important
}

.mr1 {
    margin-right: 1px!important
}

.mr3 {
    margin-right: 3px!important
}

.mr5 {
    margin-right: 5px!important
}

.mr7 {
    margin-right: 7px!important
}

.mr10 {
    margin-right: 10px!important
}

.mr15 {
    margin-right: 15px!important
}

.mr20 {
    margin-right: 20px!important
}

.mr25 {
    margin-right: 25px!important
}

.mr30 {
    margin-right: 30px!important
}

.mr35 {
    margin-right: 35px!important
}

.mr40 {
    margin-right: 40px!important
}

.mr45 {
    margin-right: 45px!important
}

.mr50 {
    margin-right: 50px!important
}

.mr55 {
    margin-right: 55px!important
}

.mr60 {
    margin-right: 60px!important
}

.mr65 {
    margin-right: 65px!important
}

.mr70 {
    margin-right: 70px!important
}

.mr75 {
    margin-right: 75px!important
}

.mr80 {
    margin-right: 80px!important
}

.mr85 {
    margin-right: 85px!important
}

.mr90 {
    margin-right: 90px!important
}

.mr95 {
    margin-right: 95px!important
}

.mr100 {
    margin-right: 100px!important
}

.mb0 {
    margin-bottom: 0!important
}

.mb1 {
    margin-bottom: 1px!important
}

.mb3 {
    margin-bottom: 3px!important
}

.mb5 {
    margin-bottom: 5px!important
}

.mb6 {
    margin-bottom: 6px!important
}

.mb7 {
    margin-bottom: 7px!important
}

.mb10 {
    margin-bottom: 10px!important
}

.mb15 {
    margin-bottom: 15px!important
}

.mb13 {
    margin-bottom: 13px!important
}

.mb20 {
    margin-bottom: 20px!important
}

.mb25 {
    margin-bottom: 25px!important
}

.mb30 {
    margin-bottom: 30px!important
}

.mb35 {
    margin-bottom: 35px!important
}

.mb40 {
    margin-bottom: 40px!important
}

.mb45 {
    margin-bottom: 45px!important
}

.mb50 {
    margin-bottom: 50px!important
}

.mb55 {
    margin-bottom: 55px!important
}

.mb60 {
    margin-bottom: 60px!important
}

.mb65 {
    margin-bottom: 65px!important
}

.mb70 {
    margin-bottom: 70px!important
}

.mb75 {
    margin-bottom: 75px!important
}

.mb80 {
    margin-bottom: 80px!important
}

.mb85 {
    margin-bottom: 85px!important
}

.mb90 {
    margin-bottom: 90px!important
}

.mb95 {
    margin-bottom: 95px!important
}

.mb100 {
    margin-bottom: 100px!important
}

.mlA {
    margin-left: auto!important
}

.ml0 {
    margin-left: 0!important
}

.ml1 {
    margin-left: 1px!important
}

.ml3 {
    margin-left: 3px!important
}

.ml5 {
    margin-left: 5px!important
}

.ml7 {
    margin-left: 7px!important
}

.ml10 {
    margin-left: 10px!important
}

.ml15 {
    margin-left: 15px!important
}

.ml20 {
    margin-left: 20px!important
}

.ml25 {
    margin-left: 25px!important
}

.ml30 {
    margin-left: 30px!important
}

.ml35 {
    margin-left: 35px!important
}

.ml40 {
    margin-left: 40px!important
}

.ml45 {
    margin-left: 45px!important
}

.ml50 {
    margin-left: 50px!important
}

.ml55 {
    margin-left: 55px!important
}

.ml60 {
    margin-left: 60px!important
}

.ml65 {
    margin-left: 65px!important
}

.ml70 {
    margin-left: 70px!important
}

.ml75 {
    margin-left: 75px!important
}

.ml80 {
    margin-left: 80px!important
}

.ml85 {
    margin-left: 85px!important
}

.ml90 {
    margin-left: 90px!important
}

.ml95 {
    margin-left: 95px!important
}

.ml100 {
    margin-left: 100px!important
}

.p0 {
    padding: 0!important
}

.p1 {
    padding: 1px!important
}

.p2 {
    padding: 2px!important
}

.p3 {
    padding: 3px!important
}

.p4 {
    padding: 4px!important
}

.p5 {
    padding: 5px!important
}

.p6 {
    padding: 6px!important
}

.p7 {
    padding: 7px!important
}

.p8 {
    padding: 8px!important
}

.p9 {
    padding: 9px!important
}

.p10 {
    padding: 10px!important
}

.p15 {
    padding: 15px!important
}

.p20 {
    padding: 20px!important
}

.p25 {
    padding: 25px!important
}

.p30 {
    padding: 30px!important
}

.p35 {
    padding: 35px!important
}

.p40 {
    padding: 40px!important
}

.p45 {
    padding: 45px!important
}

.p50 {
    padding: 50px!important
}

.p55 {
    padding: 55px!important
}

.p60 {
    padding: 60px!important
}

.p65 {
    padding: 65px!important
}

.p70 {
    padding: 70px!important
}

.p75 {
    padding: 75px!important
}

.p80 {
    padding: 80px!important
}

.p85 {
    padding: 85px!important
}

.p90 {
    padding: 90px!important
}

.p95 {
    padding: 95px!important
}

.p100 {
    padding: 100px!important
}

.p110 {
    padding: 110px!important
}

.p120 {
    padding: 120px!important
}

.p130 {
    padding: 130px!important
}

.p140 {
    padding: 140px!important
}

.p150 {
    padding: 150px!important
}

.p160 {
    padding: 160px!important
}

.p170 {
    padding: 170px!important
}

.p180 {
    padding: 180px!important
}

.p190 {
    padding: 190px!important
}

.p200 {
    padding: 200px!important
}

.p220 {
    padding: 220px!important
}

.p240 {
    padding: 240px!important
}

.p260 {
    padding: 260px!important
}

.p280 {
    padding: 280px!important
}

.p300 {
    padding: 300px!important
}

.pt0 {
    padding-top: 0!important
}

.pt1 {
    padding-top: 1px!important
}

.pt3 {
    padding-top: 3px!important
}

.pt5 {
    padding-top: 5px!important
}

.pt7 {
    padding-top: 7px!important
}

.pt10 {
    padding-top: 10px!important
}

.pt15 {
    padding-top: 15px!important
}

.pt20 {
    padding-top: 20px!important
}

.pt25 {
    padding-top: 25px!important
}

.pt30 {
    padding-top: 30px!important
}

.pt35 {
    padding-top: 35px!important
}

.pt40 {
    padding-top: 40px!important
}

.pt45 {
    padding-top: 45px!important
}

.pt50 {
    padding-top: 50px!important
}

.pt55 {
    padding-top: 55px!important
}

.pt60 {
    padding-top: 60px!important
}

.pt65 {
    padding-top: 65px!important
}

.pt70 {
    padding-top: 70px!important
}

.pt75 {
    padding-top: 75px!important
}

.pt80 {
    padding-top: 80px!important
}

.pt85 {
    padding-top: 85px!important
}

.pt90 {
    padding-top: 90px!important
}

.pt95 {
    padding-top: 95px!important
}

.pt100 {
    padding-top: 100px!important
}

.pr0 {
    padding-right: 0!important
}

.pr1 {
    padding-right: 1px!important
}

.pr3 {
    padding-right: 3px!important
}

.pr5 {
    padding-right: 5px!important
}

.pr7 {
    padding-right: 7px!important
}

.pr10 {
    padding-right: 10px!important
}

.pr15 {
    padding-right: 15px!important
}

.pr20 {
    padding-right: 20px!important
}

.pr25 {
    padding-right: 25px!important
}

.pr30 {
    padding-right: 30px!important
}

.pr35 {
    padding-right: 35px!important
}

.pr40 {
    padding-right: 40px!important
}

.pr45 {
    padding-right: 45px!important
}

.pr50 {
    padding-right: 50px!important
}

.pr55 {
    padding-right: 55px!important
}

.pr60 {
    padding-right: 60px!important
}

.pr65 {
    padding-right: 65px!important
}

.pr70 {
    padding-right: 70px!important
}

.pr75 {
    padding-right: 75px!important
}

.pr80 {
    padding-right: 80px!important
}

.pr85 {
    padding-right: 85px!important
}

.pr90 {
    padding-right: 90px!important
}

.pr95 {
    padding-right: 95px!important
}

.pr100 {
    padding-right: 100px!important
}

.pb0 {
    padding-bottom: 0!important
}

.pb1 {
    padding-bottom: 1px!important
}

.pb3 {
    padding-bottom: 3px!important
}

.pb5 {
    padding-bottom: 5px!important
}

.pb7 {
    padding-bottom: 7px!important
}

.pb10 {
    padding-bottom: 10px!important
}

.pb15 {
    padding-bottom: 15px!important
}

.pb20 {
    padding-bottom: 20px!important
}

.pb25 {
    padding-bottom: 25px!important
}

.pb30 {
    padding-bottom: 30px!important
}

.pb35 {
    padding-bottom: 35px!important
}

.pb40 {
    padding-bottom: 40px!important
}

.pb45 {
    padding-bottom: 45px!important
}

.pb50 {
    padding-bottom: 50px!important
}

.pb55 {
    padding-bottom: 55px!important
}

.pb60 {
    padding-bottom: 60px!important
}

.pb65 {
    padding-bottom: 65px!important
}

.pb70 {
    padding-bottom: 70px!important
}

.pb75 {
    padding-bottom: 75px!important
}

.pb80 {
    padding-bottom: 80px!important
}

.pb85 {
    padding-bottom: 85px!important
}

.pb90 {
    padding-bottom: 90px!important
}

.pb95 {
    padding-bottom: 95px!important
}

.pb100 {
    padding-bottom: 100px!important
}

.pl0 {
    padding-left: 0!important
}

.pl1 {
    padding-left: 1px!important
}

.pl3 {
    padding-left: 3px!important
}

.pl5 {
    padding-left: 5px!important
}

.pl7 {
    padding-left: 7px!important
}

.pl10 {
    padding-left: 10px!important
}

.pl15 {
    padding-left: 15px!important
}

.pl20 {
    padding-left: 20px!important
}

.pl25 {
    padding-left: 25px!important
}

.pl30 {
    padding-left: 30px!important
}

.pl35 {
    padding-left: 35px!important
}

.pl40 {
    padding-left: 40px!important
}

.pl45 {
    padding-left: 45px!important
}

.pl50 {
    padding-left: 50px!important
}

.pl55 {
    padding-left: 55px!important
}

.pl60 {
    padding-left: 60px!important
}

.pl65 {
    padding-left: 65px!important
}

.pl70 {
    padding-left: 70px!important
}

.pl75 {
    padding-left: 75px!important
}

.pl80 {
    padding-left: 80px!important
}

.pl85 {
    padding-left: 85px!important
}

.pl90 {
    padding-left: 90px!important
}

.pl95 {
    padding-left: 95px!important
}

.pl100 {
    padding-left: 100px!important
}

.w5 {
    width: 5px!important
}

.w10 {
    width: 10px!important
}

.w15 {
    width: 15px!important
}

.w20 {
    width: 20px!important
}

.w25 {
    width: 25px!important
}

.w30 {
    width: 30px!important
}

.w35 {
    width: 35px!important
}

.w40 {
    width: 40px!important
}

.w45 {
    width: 45px!important
}

.w50 {
    width: 50px!important
}

.w55 {
    width: 55px!important
}

.w60 {
    width: 60px!important
}

.w65 {
    width: 65px!important
}

.w70 {
    width: 70px!important
}

.w75 {
    width: 75px!important
}

.w80 {
    width: 80px!important
}

.w85 {
    width: 85px!important
}

.w90 {
    width: 90px!important
}

.w95 {
    width: 95px!important
}

.w100 {
    width: 100px!important
}

.w110 {
    width: 110px!important
}

.w120 {
    width: 120px!important
}

.w130 {
    width: 130px!important
}

.w140 {
    width: 140px!important
}

.w150 {
    width: 150px!important
}

.w160 {
    width: 160px!important
}

.w170 {
    width: 170px!important
}

.w180 {
    width: 180px!important
}

.w190 {
    width: 190px!important
}

.w200 {
    width: 200px!important
}

.w210 {
    width: 210px!important
}

.w220 {
    width: 220px!important
}

.w230 {
    width: 230px!important
}

.w240 {
    width: 240px!important
}

.w250 {
    width: 250px!important
}

.w260 {
    width: 260px!important
}

.w270 {
    width: 270px!important
}

.w280 {
    width: 280px!important
}

.w290 {
    width: 290px!important
}

.w300 {
    width: 300px!important
}

.w5p {
    width: 5%!important
}

.w10p {
    width: 10%!important
}

.w15p {
    width: 15%!important
}

.w20p {
    width: 20%!important
}

.w25p {
    width: 25%!important
}

.w30p {
    width: 30%!important
}

.w33p {
    width: 33%!important
}

.w35p {
    width: 35%!important
}

.w40p {
    width: 40%!important
}

.w45p {
    width: 45%!important
}

.w50p {
    width: 50%!important
}

.w55p {
    width: 55%!important
}

.w60p {
    width: 60%!important
}

.w65p {
    width: 65%!important
}

.w70p {
    width: 70%!important
}

.w75p {
    width: 75%!important
}

.w80p {
    width: 80%!important
}

.w85p {
    width: 85%!important
}

.w90p {
    width: 90%!important
}

.w95p {
    width: 95%!important
}

.w100p {
    width: 100%!important
}

.l-inner {
    max-width: 1500px;
    padding: 0 2.631579rem;
    margin: 0 auto;
}

.l-header .fixed {
    position: fixed;
    top: 0;
    right: 10px;
    z-index: 1
}

.l-header #Menu_btn {
    width: 30px;
    height: 30px;
    background-color: #000
}

.l-header #menu {
    position: fixed;
    top: 0;
    right: -370px;
    width: 300px;
    height: 100%;
    padding: 20px;
    transition: left .5s,right .5s;
    background-color: #f2f2f2
}

.l-header #menu label i {
    position: absolute;
    right: 17px;
    top: 14px
}

.l-header #menu label p {
    position: absolute;
    left: -26px;
    top: 50%;
    padding: 30px 3px;
    writing-mode: vertical-rl;
    background-color: #f2f2f2;
    font-size: 12px;
    font-family: Noto Sans Japanese,sans-serif
}

.l-header #menu ul {
    margin-left: 20px
}

.l-header #menu ul li {
    transition-timing-function: ease-out
}

.l-header #menu ul li a {
    padding: 5px 0
}

.l-header #menu ul li a:hover {
    margin-left: -5px;
    transition-duration: .3s
}

.l-header .toggle {
    font-size: 30px;
    cursor: pointer
}

.l-header .toggle:hover {
    text-decoration: underline
}

.l-header #open {
    display: none
}

.l-header #open:checked+#menu {
    right: 0
}

.l-header .vertical_writing {
    writing-mode: vertical-rl;
    display: flex
}

.l-header .vertical_writing li {
    font-family: Noto Sans Japanese,sans-serif;
    font-size: 14px;
    display: inline-block;
    justify-content: flex-start;
    margin-bottom: 24px;
    vertical-align: sub
}

.l-header .vertical_writing li#pagetop {
    font-size: 11px
}

.l-header .vertical_writing li#pagetop i.fa-play:before {
    content: "\f04b"
}

.l-header .logo img {
    width: 116px
}

.l-header-media {
    font-family: Noto Sans Japanese,sans-serif;
    background: url(img/media/media_header_bg.png) 50%;
    background-size: cover
}

.l-header-media .l-inner {
    position: relative;
    padding: 10px 0 30px
}

.l-header-media .text-box {
    text-align: center;
    color: #fff;
}

.l-header-media .text-box .title {
    font-size: 48px;
    color: #fff;
}

.l-header-media .text-box .discription {
    font-size: 11px;
    margin-bottom: 5px;
    color: #fff;
}
.l-header-media .text-box aside p{
  color: #fff;
}

.l-header-media .text-box aside,.l-header-media .to-monocyte {
    font-family: HelveticaNeue-Light,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif
}

.l-header-media .to-monocyte {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #fff;
    padding-left: 20px;
    background: url(img/media/icon_to_monocyte.png) no-repeat 0;
    background-size: 13px
}

.l-media-nav {
    font-family: Noto Sans Japanese,sans-serif;
    border-bottom: 1px solid #ccc;
    /* margin-bottom:118px */
}

.page-movie-post .l-media-nav {
    margin-bottom:118px
}

.l-media-nav .l-inner {
    padding: 20px 0
}

.l-media-nav .l-inner {
    max-width: 1500px;
    padding: 20px 2.631579rem;
    margin: 0 auto;
}

.l-media-nav .title {
    font-size: 19px;
    font-weight: 700;
    float: left;
    margin-right: 20px
}

.l-media-nav .media-list .media-item {
    float: left;
    padding: 0 30px;
    border-left: 1px solid #ccc;
    font-size: 15px;
    line-height: 15px;
    margin-top: 7px
}

.l-media-nav .media-list .media-item:last-child.l-media-nav .media-list li:last-child a {
    border-right: 1px solid #ccc
}

.l-media-nav .search-input {
    float: right;
    margin-top: 10px
}

.l-media-nav .search-input input[type=text] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    border-bottom: 1px solid #ccc;
    border-top: none;
    border-right: none;
    border-left: none
}

.l-media-nav .search-input input[type=text]:focus {
    outline: 0
}

.l-media-nav .search-input .searchsubmit {
    width: 35px;
    height: 30px;
    padding: 0;
    font-family: FontAwesome;
    font-size: 17px;
    border: none;
    background: transparent;
    cursor: pointer
}

.l-media-nav .search-input input[type=submit] {
    margin: 10px;
    padding-right: 30px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    border: none;
    background: #fff;
    position: relative;
    top: -8px;
    height: 16px;
    cursor: pointer
}

.l-media-nav .search-input span {
    position: relative;
    border-bottom: 1px solid #ccc;
    height: 19px;
    box-sizing: border-box;
    display: block;
    float: right
}

.l-media-nav .search-input span:after {
    font-family: FontAwesome;
    content: "\f002";
    background: #fff;
    font-size: 13px;
    position: absolute;
    right: 10px;
    top: -1px;
    pointer-events: none
}

.content-2col {
    margin: 0 auto;
    max-width: 1500px;
    padding: 0 2.631579rem;
}

.content-2col .left-content {
    float: left;
    width: 70%;
}

.content-2col .right-content {
    float: right;
    width: 25%;
    margin-left: 5%;
}

.content-2col .right-content.media-sidebar {
    margin-bottom: 100px
}

.content-2col .right-content.media-sidebar .content-title {
    font-size: 20px;
    text-align: center;
    border-top: 2px solid #999;
    border-bottom: 2px solid #999;
    padding: 10px 0;
    letter-spacing: 1px
}

.content-2col .right-content.media-sidebar .popular-list {
    margin-bottom: 65px;
    counter-reset: wpp-ranking;
}

.content-2col .right-content.media-sidebar .popular-item {
    border-bottom: 2px solid #ccc;
    padding: 10px 0;
}

.content-2col .right-content.media-sidebar .popular-list li:before {
    float: left;
    font-size: 20px;
    line-height: 20px;
    padding: 30px 0;
    margin-right: 10px;
    content: counter(wpp-ranking, decimal);
    counter-increment: wpp-ranking;
    padding-right:8px;
}


.content-2col .right-content.media-sidebar p.list-cat {
    font-size: 11px;
    margin-bottom: 5px;
}

.content-2col .right-content.media-sidebar p.list-cat a {
    color: #009245;
}

.content-2col .right-content.media-sidebar .popular-item .img {
    float: left;
    width:90%;
}

.content-2col .right-content.media-sidebar .popular-item img {
    /* width:170%; */
}

.content-2col .right-content.media-sidebar .popular-item .text-box {
    float: right;
    width: 60%;
    margin-top: 10px
}

.content-2col .right-content.media-sidebar .popular-item .text-box .cat {
    font-size: 11px;
    margin-bottom: 10px
}

.content-2col .right-content.media-sidebar .popular-item .text-box .cat span.orange {
    color: #f15a24
}

.content-2col .right-content.media-sidebar .popular-item .text-box .cat span.green {
    color: #009245
}

.content-2col .right-content.media-sidebar .popular-item .text-box .cat span.blue {
    color: #0071bc
}

.content-2col .right-content.media-sidebar .popular-item .text-box .cat span.red {
    color: #c1272d
}

.content-2col .right-content.media-sidebar .popular-item .text-box .cat span.brown {
    color: #8c6239
}

.content-2col .right-content.media-sidebar .popular-item .text-box .cat span.black {
    color: #333
}

.content-2col .right-content.media-sidebar .popular-item .text-box .title {
    font-size: 10px
}

.content-2col .right-content.media-sidebar .service-box {
    border: 1px solid #ccc
}

.content-2col .right-content.media-sidebar .service-box .text-box-01 {
    width: 227px;
    margin: 0 auto;
    border-bottom: 1px solid #ccc
}

.content-2col .right-content.media-sidebar .service-box .text-box-01 .title {
    font-family: HelveticaNeue-Light,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif;
    font-size: 30px;
    text-align: center;
    margin: 20px 0 10px
}

.content-2col .right-content.media-sidebar .service-box .text-box-01 .discription {
    font-size: 14px;
    text-align: center;
    line-height: 25px;
    margin-bottom: 30px
}

.content-2col .right-content.media-sidebar .service-box .text-box-02 {
    width: 227px;
    margin: 0 auto
}

.content-2col .right-content.media-sidebar .service-box .text-box-02 .title {
    font-size: 16px;
    font-weight: 700;
    margin: 30px 0 20px
}

.content-2col .right-content.media-sidebar .service-box .text-box-02 .discription {
    font-size: 11px;
    margin-bottom: 30px
}

.content-2col .right-content.media-sidebar .keywords {
    margin-top: 60px
}

.content-2col .right-content.media-sidebar .keyword-list .keyword-item {
    width: 50%;
    box-sizing: border-box
}

.content-2col .right-content.media-sidebar .keyword-list .keyword-item a {
    display: block;
    padding: 15px 0 15px 10%
}

.content-2col .right-content.media-sidebar .keyword-list .keyword-item:nth-child(odd) {
    float: left;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc
}

.content-2col .right-content.media-sidebar .keyword-list .keyword-item:nth-child(2n) {
    float: right;
    border-bottom: 1px solid #ccc
}

.l-footer .top_inner {
    background-color: #333338;
    height: 245px;
    display: flex;
    align-items: center
}

.l-footer .top_inner a,.l-footer .top_inner p {
    color: #b3b3b3;
    font-family: Noto Sans Japanese,sans-serif
}

.l-footer .top_inner .l-inner {
    display: flex;
    align-items: center
}

.l-footer .top_inner .l-inner .inner_in .block p {
    font-size: 10px
}

.l-footer .top_inner .l-inner .inner_in .block.flex {
    width: 270px;
    display: flex;
    justify-content: space-between
}

.l-footer .top_inner .l-inner .inner_in .block.flex p {
    font-size: 19px;
    margin-bottom: 7px
}

.l-footer .top_inner .l-inner .inner_in .block.flex .block_in {
    //:230px;//:flex;//:wrap}

.l-footer .top_inner .l-inner .inner_in .block.flex .block_in img {
    //:33px}

.l-footer .top_inner .l-inner .inner_in .block.flex .block_in li {
    font-size: 12px
}

.l-footer .bottom_inner {
    background-color: #3f3f41;
    height: 100px;
    display: flex;
    align-items: center
}

.l-footer .bottom_inner a,.l-footer .bottom_inner p {
    color: #b3b3b3;
    font-family: Noto Sans Japanese,sans-serif
}

.l-footer .bottom_inner .l-inner {
    display: flex;
    align-items: center
}

.l-footer .bottom_inner .l-inner .inner_in {
    width: 396px;
    display: flex;
    justify-content: space-between
}

.l-footer .bottom_inner .l-inner .inner_in .block p {
    font-size: 10px
}

.l-footer .bottom_inner .l-inner .inner_in .block a {
    display: block
}

.read_more {
    width: 227px;
    @include transition_botton;margin-top: 60px
}

.read_more a {
    color: #fff;
    padding: 20px 60px;
    background-color: #000
}

.read_more a img,.transition_botton img {
    width: 14px;
    height: 9px;
    margin-left: 20px
}

.m-pagenation {
    display: flex;
    justify-content: center;
    align-content: center;
    font-size: 23px;
    margin-bottom: 100px
}

.m-pagenation .pagenation-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: space-between
}

.m-pagenation .pagenation-item {
    margin-right: 10px;
    border: 1px solid #000
}

.m-pagenation .page-numbers,.m-pagenation .pagenation-item a {
    display: block;
    padding: 5px 15px
}

.m-pagenation .pagenation-item:last-child {
    margin-right: 0
}

.pager {
    display: flex;
}

.m-pagenation .prev a {
    color: gray
}

.m-pagenation .active,.m-pagenation .current {
    background: #000;
    color: #fff
}

.m-title-en {
    text-align: center;
    font-size: 32px
}

.m-title-jp {
    font-size: 13px;
    padding-bottom: 40px;
    text-align: center;
    margin-bottom: 40px;
    background: url(img/title_border.png) no-repeat bottom
}

.breadcrumb-wrap {
    width: 100%;
    background-color: #f9f9f9;
    font-size: 14px
}

.breadcrumb-wrap ul {
    padding: 10px 0
}

.breadcrumb-wrap li {
    float: left;
    margin-right: 10px
}

.breadcrumb-wrap li:after {
    content: ">";
    position: relative;
    left: 5px
}

.breadcrumb-wrap li:last-child:after {
    content: ""
}

.gray-area {
    background: #ccc;
    color: #fff;
    margin-bottom: 150px
}

.gray-area .inner {
    max-width: 900px;
    margin: 0 auto;
    padding: 50px 0
}

.gray-area .left-area {
    float: left
}

.gray-area .left-area .title {
    font-size: 27px;
    font-family: HelveticaNeue-Light,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif;
    margin-bottom: 20px
}

.gray-area .left-area .discription {
    width: 560px;
    float: left;
    line-height: 30px;
    font-size: 12px;
    border-right: 1px solid #fff;
    padding-right: 30px;
    color: #fff
}

.gray-area .right-area {
    float: left;
    padding-left: 60px
}

.gray-area .right-area .title {
    font-size: 16px;
    margin-bottom: 20px;
    color: #fff
}

.gray-area .right-area .menu-list a {
    color: #fff
}

.gray-area .right-area .menu-item {
    margin-bottom: 5px;
    font-size: 12px
}

.creative-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: space-between
}

.creative-list .creative-item {
    width: 49%;
    margin-bottom: 50px
}

li.creative-item img {
    width: 49%;
}

.creative-list .text-box {
    width: 49%;
    float: right
}

.creative-list .cat-en {
    font-size: 13px;
    font-weight: 700;
    margin-top: 10px
}

.creative-list .cat-jp {
    font-size: 13px;
    margin-bottom: 20px
}

.creative-list .title {
    font-size: 13px;
    font-weight: 400
}

.contact-area-footer {
    width: 584px;
    margin: 40px auto 90px
}

.contact-area-footer .works {
    display: block;
    float: left;
    border: 1px solid #1a1a1a;
    width: 290px;
    padding: 20px 0;
    text-align: center;
    background: url(img/arrow_blk.svg) no-repeat 235px;
    background-size: 13px;
}

.contact-area-footer .contact {
    display: block;
    float: right;
    border-top: 1px solid #1a1a1a;
    border-bottom: 1px solid #1a1a1a;
    border-right: 1px solid #1a1a1a;
    background: url(img/arrow_blk.svg) no-repeat 235px;
    background-size: 13px;
    width: 251px;
    padding: 20px 0 20px 40px
}

.single {
    font-family: Noto Sans Japanese,sans-serif
}

.single .left-content {
    margin-top: 60px
}

.single .left-content .info {
    margin-bottom: 20px
}

.single .left-content .info .date {
    font-size: 12px;
    float: left
}

.single .left-content .info .cat {
    font-size: 12px;
    float: left;
    margin-left: 20px
}

.single .left-content .info .cat.orange {
    color: #f15a24
}

.single .left-content .info .cat.green {
    color: #009245
}

.single .left-content .info .cat.blue {
    color: #0071bc
}

.single .left-content .info .cat.red {
    color: #c1272d
}

.single .left-content .info .cat.brown {
    color: #8c6239
}

.single .left-content .info .cat.black {
    color: #333
}

.single .left-content .top-text .title {
    font-size: 25px;
    font-weight: 400;
    margin-bottom: 20px;
    border-bottom: 2px solid #999;
}
.single .left-content .top-text .discription img {
    width: 100%;
    height: auto;
}

.single .left-content .top-text .discription h2 {
    margin-top:  100px;
    font-size: 25px;
    display:  block;
    border-bottom:  1px solid #000;
    padding-bottom:  10px;
}

.single .left-content .top-text .discription {
    font-size: 16px;
    padding: 20px 0;
    letter-spacing: .5px;
    line-height: 30px;
    margin-bottom: 50px;
    width: 90%;
}

.single .left-content .top-text .discription iframe,.single .left-content .top-text .discription img {
    display: block;
    margin: 10px auto
}

.single .right-content {
    margin-top: 150px
}

.category,.page-media-archive {
    font-family: Noto Sans Japanese,sans-serif
}

.category .left-content,.page-media-archive .left-content {
    margin-top: 60px
}

.category .left-content .top-text,.page-media-archive .left-content .top-text {
    text-align: left!important;
    color: #000!important
}

.category .left-content .top-text .title,.page-media-archive .left-content .top-text .title {
    font-size: 25px;
    font-weight: 400;
    margin-bottom: 20px
}

.category .left-content .top-text .discription,.page-media-archive .left-content .top-text .discription {
    font-size: 13px;
    border-top: 2px solid #999;
    border-bottom: 2px solid #999;
    padding: 20px 0;
    letter-spacing: .5px;
    line-height: 20px;
    margin-bottom: 50px
}

.page-allpost .left-content .archive-list,.category .left-content .archive-list,.page-media-archive .left-content .archive-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: space-between
}

.page-allpost .left-content .archive-list .archive-item,.category .left-content .archive-list .archive-item,.page-media-archive .left-content .archive-list .archive-item {
    width: 49%;
    padding-bottom: 50px;
}

.page-allpost .left-content .archive-list .text-box,.category .left-content .archive-list .text-box,.page-media-archive .left-content .archive-list .text-box {
    font-size: 10px;
    margin-bottom: 5px
}

.page-allpost .left-content .archive-list .text-box .cat,.category .left-content .archive-list .text-box .cat,.page-media-archive .left-content .archive-list .text-box .cat {
    float: left;
    margin-right: 30px;
    display: none;
}

.category .left-content .archive-list .text-box .cat.orange,.page-media-archive .left-content .archive-list .text-box .cat.orange {
    color: #f15a24
}

.category .left-content .archive-list .text-box .cat.green,.page-media-archive .left-content .archive-list .text-box .cat.green {
    color: #009245
}

.category .left-content .archive-list .text-box .cat.blue,.page-media-archive .left-content .archive-list .text-box .cat.blue {
    color: #0071bc
}

.category .left-content .archive-list .text-box .cat.red,.page-media-archive .left-content .archive-list .text-box .cat.red {
    color: #c1272d
}

.category .left-content .archive-list .text-box .cat.brown,.page-media-archive .left-content .archive-list .text-box .cat.brown {
    color: #8c6239
}

.category .left-content .archive-list .text-box .cat.black,.page-media-archive .left-content .archive-list .text-box .cat.black {
    color: #333
}

.category .left-content .archive-list .text-box .date,.page-media-archive .left-content .archive-list .text-box .date {
    float: left
}

.category .left-content .archive-list .title,.page-media-archive .left-content .archive-list .title {
    font-size: 14px;
    margin-bottom: 5px
}

.category .left-content .archive-list .discription,.page-media-archive .left-content .archive-list .discription {
    font-size: 12px
}

.category .right-content,.page-media-archive .right-content {
    margin-top: 115px
}

.top .l-media-nav {
    margin-bottom: 120px
}

.archive,.page-movie-post,.top {
    font-family: Noto Sans Japanese,sans-serif
}

.archive .top-text,.page-movie-post .top-text,.top .top-text {
    text-align: center;
    color: gray;
    margin-bottom: 45px
}

.archive .top-text .title,.page-movie-post .top-text .title,.top .top-text .title {
    font-size: 28px
}

.archive .top-text .title span,.page-movie-post .top-text .title span,.top .top-text .title span {
    font-size: 21px;
    margin: 0 10px
}

.archive .top-text .discription,.page-movie-post .top-text .discription,.top .top-text .discription {
    font-size: 13px;
    margin-top: 10px
}

.archive .under-text,.page-movie-post .under-text,.top .under-text {
    text-align: center;
    color: gray;
    font-size: 13px;
    margin-bottom: 120px
}

.archive .under-text .bold-text,.page-movie-post .under-text .bold-text,.top .under-text .bold-text {
    font-weight: 700;
    margin-bottom: 20px
}

.archive .under-text .text,.page-movie-post .under-text .text,.top .under-text .text {
    line-height: 27px
}

.archive .archive-list,.page-movie-post .archive-list,.top .archive-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: space-between
}

.archive .archive-list .archive-item,.page-movie-post .archive-list .archive-item,.top .archive-list .archive-item {
    width: 49%;
    margin-bottom: 100px;
    position: relative;
}

.page-allpost .archive-list .archive-item img,.archive .archive-list .archive-item img,.page-movie-post .archive-list .archive-item img,.top .archive-list .archive-item img {
    width: 100%;
    height: auto
}

.page-allpost .archive-list .archive-item article .thumb,.archive .archive-list .archive-item article .thumb,.page-movie-post .archive-list .archive-item article .thumb,.top .archive-list .archive-item article .thumb {
    display: block;
    height: 250px;
    overflow: hidden
}

.archive .archive-list .text-box,.page-movie-post .archive-list .text-box,.top .archive-list .text-box {
    font-size: 10px;
    margin-bottom: 5px
}

.archive .archive-list .text-box .cat,.page-movie-post .archive-list .text-box .cat,.top .archive-list .text-box .cat {
    float: left;
    margin-right: 30px
}

.archive .archive-list .text-box .cat.orange,.page-movie-post .archive-list .text-box .cat.orange,.top .archive-list .text-box .cat.orange {
    color: #f15a24;
    display: none;
}

.archive .archive-list .text-box .cat.green,.page-movie-post .archive-list .text-box .cat.green,.top .archive-list .text-box .cat.green {
    color: #009245
}

.archive .archive-list .text-box .cat.blue,.page-movie-post .archive-list .text-box .cat.blue,.top .archive-list .text-box .cat.blue {
    color: #0071bc
}

.archive .archive-list .text-box .cat.red,.page-movie-post .archive-list .text-box .cat.red,.top .archive-list .text-box .cat.red {
    color: #c1272d
}

.archive .archive-list .text-box .cat.brown,.page-movie-post .archive-list .text-box .cat.brown,.top .archive-list .text-box .cat.brown {
    color: #8c6239
}

.archive .archive-list .text-box .cat.black,.page-movie-post .archive-list .text-box .cat.black,.top .archive-list .text-box .cat.black {
    color: #333
}

.archive .archive-list .text-box .date,.page-movie-post .archive-list .text-box .date,.top .archive-list .text-box .date {
    float: left
}

.archive .archive-list .title,.page-movie-post .archive-list .title,.top .archive-list .title {
    font-size: 14px;
    margin-bottom: 5px
}

.archive .archive-list .discription,.page-movie-post .archive-list .discription,.top .archive-list .discription {
    font-size: 12px;
    word-wrap: break-word
}

.archive .full-bg,.page-movie-post .full-bg,.top .full-bg {
    background: url(img/media/media_post_bg.png) no-repeat;
    background-size: cover;
    padding: 70px 0;
    margin-bottom: 100px;
    color: #fff
}

.archive .full-bg a,.page-movie-post .full-bg a,.top .full-bg a {
    color: #fff
}

.archive .full-bg .text-box,.page-movie-post .full-bg .text-box,.top .full-bg .text-box {
    font-size: 12px
}

.archive .full-bg .text-box .cat,.page-movie-post .full-bg .text-box .cat,.top .full-bg .text-box .cat {
    float: left;
    margin: 0 100px 10px 0
}

.archive .full-bg .text-box .date,.page-movie-post .full-bg .text-box .date,.top .full-bg .text-box .date {
    float: left
}

.archive .full-bg .header-text,.page-movie-post .full-bg .header-text,.top .full-bg .header-text {
    font-size: 37px;
    margin-bottom: 50px
}

.archive .full-bg .title,.page-movie-post .full-bg .title,.top .full-bg .title {
    font-size: 18px;
    margin-bottom: 10px
}

.archive .full-bg .discription,.page-movie-post .full-bg .discription,.top .full-bg .discription {
    font-size: 14px
}

.archive .rank-list,.page-movie-post .rank-list,.top .rank-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: space-between
}

.archive .rank-list .rank-item,.page-movie-post .rank-list .rank-item,.top .rank-list .rank-item {
    width: 32%;
    margin-bottom: 50px
}

.archive .rank-list .rank-item img,.page-movie-post .rank-list .rank-item img,.top .rank-list .rank-item img {
    width: 100%;
}

.archive .rank-list .text-box,.page-movie-post .rank-list .text-box,.top .rank-list .text-box {
    font-size: 10px;
    margin-bottom: 5px
}

.archive .rank-list .text-box .cat,.page-movie-post .rank-list .text-box .cat,.top .rank-list .text-box .cat {
    float: left;
    margin-right: 30px
}

.archive .rank-list .text-box .cat.orange,.page-movie-post .rank-list .text-box .cat.orange,.top .rank-list .text-box .cat.orange {
    /* color: #f15a24 */
}

.archive .rank-list .text-box .cat.green,.page-movie-post .rank-list .text-box .cat.green,.top .rank-list .text-box .cat.green {
    color: #009245
}

.archive .rank-list .text-box .cat.blue,.page-movie-post .rank-list .text-box .cat.blue,.top .rank-list .text-box .cat.blue {
    color: #0071bc
}

.archive .rank-list .text-box .cat.red,.page-movie-post .rank-list .text-box .cat.red,.top .rank-list .text-box .cat.red {
    color: #c1272d
}

.archive .rank-list .text-box .cat.brown,.page-movie-post .rank-list .text-box .cat.brown,.top .rank-list .text-box .cat.brown {
    color: #8c6239
}

.archive .rank-list .text-box .cat.black,.page-movie-post .rank-list .text-box .cat.black,.top .rank-list .text-box .cat.black {
    color: #333
}

.archive .rank-list .text-box .date,.page-movie-post .rank-list .text-box .date,.top .rank-list .text-box .date {
    float: left
}

.archive .rank-list .rank,.page-movie-post .rank-list .rank,.top .rank-list .rank {
    font-size: 40px;
    border-bottom: 1px solid #000;
    float: left;
    line-height: 40px;
    padding-bottom: 10px
}

.archive .rank-list .title,.page-movie-post .rank-list .title,.top .rank-list .title {
    font-size: 14px;
    margin-bottom: 5px;
    float: left;
    margin-left: 60px;
    width: 80%;
    line-height: 25px
}



/* ランキング */
.page-movie-post .rank-list {
counter-reset: wpp-ranking;
}
.page-movie-post .rank-item {
position: relative;
}
.page-movie-post .rank-list li:before {
content: counter(wpp-ranking, decimal-leading-zero);
counter-increment: wpp-ranking;
font-size: 50px;
border-bottom: 1px solid #000;
float: left;
line-height: 40px;
padding-bottom: 10px;
position: absolute;
bottom: 59px;
}

.page-movie-post .archive-item .transform,.page-movie-post .rank-list .transform {
    transform: rotate(-270deg);
    position: absolute;
    /* bottom: 103px;
    left: -16px; */
    transform-origin: top left;
}


.about {
    //:100%}

.about .contents {
    padding-top: 155px;
    //:160px}

.about .contents p.first {
    font-family: Libre Baskerville,serif;
    font-size: 66px
}

.about .contents p.subheading_bottom {
    font-family: Noto Sans Japanese,sans-serif
}

.about .contents p.subheading_bottom span {
    width: 120px;
    border-top: 1px solid #000;
    margin: 9px 3px 0 4px;
    display: inline-block
}

.about .contents {
    //:200px}

.about .contents .heading .number_wrap {
    display: flex
}

.about .contents .heading .number_wrap span {
    width: 60px;
    border-top: 1px solid #000;
    margin: 9px 3px 0 4px
}

.about .contents .heading .number_wrap h2,.about .contents .heading .number_wrap p.number {
    font-family: Libre Baskerville,serif;
    font-size: 13px;
    line-height: 20px
}

.about .contents .heading .number_wrap img {
    width: 60px;
    display: none
}

.about .contents .heading p.heading_text {
    font-family: Noto Sans Japanese,sans-serif;
    font-size: 32px;
    margin-bottom: 60px;
    font-weight: 700;
    line-height: 60px
}

.about .contents .heading p.heading_text span.subheading {
    font-size: 13px;
    padding-left: 13px
}

.about .contents .flex p.subheading {
    font-family: noto;
    font-size: 27px;
    font-weight: 700;
    display: flex;
    align-items: center;
    margin-bottom: 60px;
    margin-left: -30px
}

.about .contents .flex p.subheading span {
    font-family: Libre Baskerville,serif;
    font-size: 39px;
    padding-left: 25px;
    line-height: 20px;
    align-items: center
}

.about .contents .flex p.subheading span.big {
    font-size: 60px;
    display: flex
}

.about .contents p.concept_description {
    font-family: Noto Sans Japanese,sans-serif;
    font-size: 15px;
    margin-bottom: 20px;
    line-height: 30px
}

.about .section00 {
    min-height: 400px;
    padding-top: 50px;
    display: flex;
    align-items: center
}

.about .section00 .l-inner {
    padding-top: 47px
}

.about .section01 {
    height: 570px
}

.about .section02 {
    background-image: url(/images/bg_02.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50px
}

.about .section02 .right_contents {
    float: right;
    margin-bottom: 50px
}

.about .section02 .right_contents p.heading_text {
    margin-bottom: 20px
}

.about .section02 ul.works_wrap {
    clear: both;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.about .section02 ul.works_wrap li {
    width: 455px;
    height: 300px;
    margin-bottom: 20px
}

.about .section02 ul.works_wrap li p {
    line-height: 20px;
    font-family: Noto Sans Japanese,sans-serif;
    font-size: 14px
}

.about .section03 {
    background-image: url(/images/bg_03.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    height: 514px;
    margin-bottom: 80px;
    display: flex;
    align-items: center
}

.about .section03 .l-inner {
    display: flex;
    justify-content: center;
    align-items: center
}

.about .section03 .l-inner .number_wrap span {
    border-top: 1px solid #fff
}

.about .section03 .l-inner h2,.about .section03 .l-inner p {
    color: #fff
}

.about .section03 .l-inner p.heading_text {
    margin-bottom: 20px
}

.about .section03 .l-inner .text_box {
    display: flex;
    flex-direction: row
}

.about .section03 .l-inner .text_box p {
    color: #fff;
    line-height: 20px;
    margin-left: 20px
}

.about .section03 .l-inner .transition_botton {
    margin-left: 88px
}

.about .section03 .l-inner .transition_botton a {
    width: 327px;
    height: 80px;
    color: #fff;
    padding: 20px 60px;
    background-color: #000
}

.about .section04 {
    padding-top: 0
}

.about .section04 .heading {
    text-align: center;
    width: 424px;
    margin: 0 auto;
    margin-bottom: 63px
}

.about .section04 .heading p.heading_text {
    font-size: 32px;
    line-height: 30px;
    margin-bottom: 0
}

.about .section04 .heading h2 {
    display: table;
    text-align: center;
    white-space: nowrap
}

.about .section04 .heading h2:after,.about .section04 .heading h2:before {
    content: "";
    display: table-cell;
    width: 50%;
    background: linear-gradient(transparent 50%,currentColor 0,currentColor calc(50% + 2px),transparent calc(50% + 2px));
    background-clip: padding
}

.about .section04 .heading h2:after {
    border-left: 1em solid transparent
}

.about .section04 .heading h2:before {
    border-right: 1em solid transparent
}

.about .section04 ul.post_wrap {
    clear: both;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.about .section04 ul.post_wrap li {
    width: 455px;
    height: 421px;
    margin-bottom: 84px;
    position: relative
}

.about .section04 ul.post_wrap li a {
    display: block
}

.about .section04 ul.post_wrap li a p {
    line-height: 20px;
    font-family: Libre Baskerville,serif;
    font-size: 14px
}

.about .section04 ul.post_wrap li a p.date {
    position: absolute;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    top: 190px;
    left: -20px
}

.about .section04 ul.post_wrap li a p.category {
    position: absolute;
    top: 250px;
    left: 20px;
    background-color: #fff;
    padding: 5px 20px
}

.about .section04 ul.post_wrap li a h3.title {
    height: 50px;
    text-overflow: ellipsis;
    font-size: 17px;
    line-height: 25px;
    margin: 20px 0 10px;
    font-family: Noto Sans Japanese,sans-serif
}

.about .section04 ul.post_wrap li a p.description {
    font-family: Noto Sans Japanese,sans-serif;
    font-size: 14px
}

.about .section04 ul.post_wrap li a .post_read_more {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    justify-content: flex-end;
    border-bottom: 1px solid #000;
    margin: 27px 0 0;
    padding-bottom: 8px
}

.about .section5 {
    height: 405px;
    display: flex;
    align-items: center;
    background-color: #f2f2f2;
    margin-bottom: 0
}

.about .section5 .heading {
    text-align: center
}

.about .section5 .heading p {
    font-size: 14px;
    font-family: Noto Sans Japanese,sans-serif
}

.about .section5 .heading p.heading_text {
    font-size: 44px;
    font-family: libre;
    margin-bottom: 20px
}

.about .section5 .heading .transition_botton {
    margin-top: 15px
}

.about .section5 .heading .transition_botton a {
    display: inline-block;
    padding: 20px 40px;
    border: 1px solid #000
}

.top .contents {
    padding-top: 155px;
    //:160px}

.top .contents p.first {
    font-family: Libre Baskerville,serif;
    font-size: 66px;
    margin-bottom: 29px
}

.top .contents p.second {
    font-family: Noto Sans Japanese,sans-serif;
    font-size: 11px;
    margin-bottom: 60px;
    line-height: 20px
}

.top .contents p.third {
    font-family: Noto Sans Japanese,sans-serif;
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 46px;
    line-height: 25px
}

.top .contents p.forth {
    font-family: Libre Baskerville,serif;
    font-size: 11px
}

.top .contents {
    //:200px}

.top .contents .heading .number_wrap {
    display: flex
}

.top .contents .heading .number_wrap span {
    width: 60px;
    border-top: 1px solid #000;
    margin: 9px 3px 0 4px
}

.top .contents .heading .number_wrap h2,.top .contents .heading .number_wrap p.number {
    font-family: Libre Baskerville,serif;
    font-size: 18px;
    line-height: 20px
}

.top .contents .heading .number_wrap img {
    width: 60px;
    display: none
}

.top .contents .heading p.heading_text {
    font-family: Noto Sans Japanese,sans-serif;
    font-size: 70px;
    margin-bottom: 60px;
    font-weight: 700;
    line-height: 60px
}

.top .contents .flex p.subheading {
    font-family: noto;
    font-size: 27px;
    font-weight: 700;
    display: flex;
    align-items: center;
    margin-bottom: 37px
}

.top .contents .flex p.subheading span {
    font-family: Libre Baskerville,serif;
    font-size: 39px;
    padding-left: 25px;
    line-height: 20px;
    align-items: center
}

.top .contents .flex p.subheading span.big {
    font-size: 60px;
    display: flex
}

.top .contents p.description {
    font-family: Noto Sans Japanese,sans-serif;
    font-size: 14px
}

.top .section00 {
    min-height: 400px;
    padding-top: 50px;
    display: flex;
    align-items: center
}

.top .section00 .l-inner {
    padding-top: 47px
}

.top .section01 {
    background-image: url(img/bg_01.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    height: 570px
}

.top .section02 {
    background-image: url(img/bg_02.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50px
}

.top .section02 .right_contents {
    float: right;
    margin-bottom: 50px
}

.top .section02 .right_contents p.heading_text {
    margin-bottom: 20px
}

.top .section02 ul.works_wrap {
    clear: both;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.top .section02 ul.works_wrap li {
    width: 455px;
    height: 300px;
    margin-bottom: 20px
}

.top .section02 ul.works_wrap li p {
    line-height: 20px;
    font-family: Noto Sans Japanese,sans-serif;
    font-size: 14px
}

.top .section03 {
    background-image: url(img/bg_03.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    height: 514px;
    margin-bottom: 80px;
    display: flex;
    align-items: center
}

.top .section03 .l-inner {
    display: flex;
    justify-content: center;
    align-items: center
}

.top .section03 .l-inner .number_wrap span {
    border-top: 1px solid #fff
}

.top .section03 .l-inner h2,.top .section03 .l-inner p {
    color: #fff
}

.top .section03 .l-inner p.heading_text {
    margin-bottom: 20px
}

.top .section03 .l-inner .text_box {
    display: flex;
    flex-direction: row
}

.top .section03 .l-inner .text_box p {
    color: #fff;
    line-height: 20px;
    margin-left: 20px
}

.top .section03 .l-inner .transition_botton {
    margin-left: 88px
}

.top .section03 .l-inner .transition_botton a {
    width: 327px;
    height: 80px;
    color: #fff;
    padding: 20px 60px;
    background-color: #000
}

.top .section04 {
    padding-top: 0
}

.top .section04 .heading {
    text-align: center;
    width: 424px;
    margin: 0 auto;
    margin-bottom: 63px
}

.top .section04 .heading p.heading_text {
    font-size: 32px;
    line-height: 30px;
    margin-bottom: 0
}

.top .section04 .heading h2 {
    display: table;
    text-align: center;
    white-space: nowrap
}

.top .section04 .heading h2:after,.top .section04 .heading h2:before {
    content: "";
    display: table-cell;
    width: 50%;
    background: linear-gradient(transparent 50%,currentColor 0,currentColor calc(50% + 2px),transparent calc(50% + 2px));
    background-clip: padding
}

.top .section04 .heading h2:after {
    border-left: 1em solid transparent
}

.top .section04 .heading h2:before {
    border-right: 1em solid transparent
}

.top .section04 ul.post_wrap {
    clear: both;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.top .section04 ul.post_wrap li {
    width: 455px;
    height: 421px;
    margin-bottom: 84px;
    position: relative
}

.top .section04 ul.post_wrap li a {
    display: block
}

.top .section04 ul.post_wrap li a p {
    line-height: 20px;
    font-family: Libre Baskerville,serif;
    font-size: 14px
}

.top .section04 ul.post_wrap li a p.date {
    position: absolute;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    top: 190px;
    left: -20px
}

.top .section04 ul.post_wrap li a p.category {
    position: absolute;
    top: 250px;
    left: 20px;
    background-color: #fff;
    padding: 5px 20px
}

.top .section04 ul.post_wrap li a h3.title {
    height: 50px;
    text-overflow: ellipsis;
    font-size: 17px;
    line-height: 25px;
    margin: 20px 0 10px;
    font-family: Noto Sans Japanese,sans-serif
}

.top .section04 ul.post_wrap li a p.description {
    font-family: Noto Sans Japanese,sans-serif;
    font-size: 14px
}

.top .section04 ul.post_wrap li a .post_read_more {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    justify-content: flex-end;
    border-bottom: 1px solid #000;
    margin: 27px 0 0;
    padding-bottom: 8px
}

.top .section5 {
    height: 405px;
    display: flex;
    align-items: center;
    background-color: #f2f2f2;
    margin-bottom: 0
}

.top .section5 .heading {
    text-align: center
}

.top .section5 .heading p {
    font-size: 14px;
    font-family: Noto Sans Japanese,sans-serif
}

.top .section5 .heading p.heading_text {
    font-size: 44px;
    font-family: libre;
    margin-bottom: 20px
}

.top .section5 .heading .transition_botton {
    margin-top: 15px
}

.top .section5 .heading .transition_botton a {
    display: inline-block;
    padding: 20px 40px;
    border: 1px solid #000
}

/*# sourceMappingURL=style.css.map */


/* 追記 */
#Secondcontents .center {
    min-height: 630px;
    padding-top: 50px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 auto;
    width: 100%;
    -webkit-justify-content: center;
    /* Safari */
    justify-content: center;
}
/* media-top */
.page-movie-post .archive-item .transform{
  /* bottom: -48px; */
  display: flex;
  /* left: -7px; */
  flex-direction: row;
}
.page-movie-post .archive-item .transform ul{
  margin-right: 15px;
}

.page-movie-post .archive-list .title{
  margin-top: 10px;
}
.page-movie-post .transition_botton {
    margin: 20px;
    margin: 0 auto 80px;
    width: 500px;
}
.page-movie-post .transition_botton a {
    width: 500px;
}

.page-allpost .left-content .archive-list .archive-item, .category .left-content .archive-list .archive-item, .page-media-archive .left-content .archive-list .archive-item {
    width: 48%;
    margin-bottom: 5%;
    position: relative;
}

.page-allpost .left-content .archive-list .text-box, .category .left-content .archive-list .text-box, .page-media-archive .left-content .archive-list .text-box {
    font-size: 10px;
    /* margin-bottom: 5px; */
    position: absolute;
    display: flex;
    transform: rotate(-270deg);
    position: absolute;
    /* bottom: -39px;
    left: -13px; */
    transform-origin: top left;
}
h2.title_big {
    position: absolute;
    top: 231px;
    z-index: 1;
    font-size: 21px;
    left: -3px;
    line-height: 25px;
    /* background-color: #ffffffc7; */
    padding: 10px;
    width: 90%;
    /* display: none; */
}

.page-movie-post .rank-list .title {
    font-size: 17px;
    margin-left: 80px;
    width: 85%;
}


/* ホバーアクション */
/* figure.snip1194 img:hover{
-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
-o-filter: grayscale(0%);
-ms-filter: grayscale(0%);
filter: grayscale(0%);
}

figure.snip1194 img{
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-o-filter: grayscale(100%);
-ms-filter: grayscale(100%);
filter: grayscale(100%);

} */

@import url(https://fonts.googleapis.com/css?family=Raleway:400,500,800);
figure.snip1194 {
  font-family: 'Raleway', Arial, sans-serif;
  color: #fff;
  position: relative;
  float: left;
  overflow: hidden;
  margin: 10px 1%;
  width: 100%;
  background: #ffffff;
  color: #000000;
  text-align: center;
}
figure.snip1194 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
}
figure.snip1194 img {
  opacity: 1;
  width: 100%;
  -webkit-transition: opacity 0.35s;
  transition: opacity 0.35s;
}
figure.snip1194 figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
figure.snip1194 h2,
figure.snip1194 p {
  margin: 0;
  position: absolute;
  width: 100%;
  left: 0;
  opacity: 0;
}
figure.snip1194 h2 {
  padding: 0 30px;
  display: inline-block;
  font-weight: 400;
  text-transform: uppercase;
  bottom: 50%;
  -webkit-transform: translate3d(0%, -100%, 0);
  transform: translate3d(0%, -100%, 0);
}
figure.snip1194 h2 span {
  font-weight: 400;
}
figure.snip1194 p {
  top: 50%;
  padding: 0 50px;
  font-size: 0.8em;
  font-weight: 500;
  -webkit-transform: translate3d(0%, 100%, 0);
  transform: translate3d(0%, 100%, 0);
}
figure.snip1194 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
}
figure.snip1194:hover img,
figure.snip1194.hover img {
  opacity: 0.3;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}
figure.snip1194:hover figcaption h2,
figure.snip1194.hover figcaption h2,
figure.snip1194:hover figcaption p,
figure.snip1194.hover figcaption p {
  -webkit-transform: translate3d(0%, 0%, 0);
  transform: translate3d(0%, 0%, 0);
}
figure.snip1194:hover figcaption h2,
figure.snip1194.hover figcaption h2 {
  opacity: 0.9;
}
figure.snip1194:hover figcaption p,
figure.snip1194.hover figcaption p {
  opacity: 0.6;
}

/* 動きをつける */
.rank-item img{
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-o-filter: grayscale(100%);
-ms-filter: grayscale(100%);
filter: grayscale(100%);
transition:0.4s;
transition:0.4s;
}

.rank-item :hover img,.service_box :hover img{
-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
-o-filter: grayscale(0%);
-ms-filter: grayscale(0%);
filter: grayscale(0%);
opacity: 1;
}

.text-box .post_read_more  {
    -webkit-transform: translateX(-220%);
    transform: translateX(-220%);
    display: block;
    text-align: right;
}

section.works_inner {
    margin-top: 100px;
}

.page-movie-post .top-text .title svg {
    fill: #3c3c3c;
    width: 172px;
}

ul.page-numbers li {
    float: left;
}
.full-bg.full-bg-01 p {
    color: #fff;
}

.page-movie-post .full-bg .header-text {
    color: #fff;
}

.page-movie-post .full-bg .title {
    color: #fff;
}

@media screen and (max-width:999px) {
body header.l-header {
    margin-top: 0%;
}


  .archive .archive-list, .page-movie-post .archive-list, .top .archive-list {
    padding: 3%;
}
.archive .archive-list .archive-item, .page-movie-post .archive-list .archive-item, .top .archive-list .archive-item {
    width: 48%;
    margin-bottom: 100px;
    position: relative;
}
.gray-area .left-area .discription {
    width: 100%;
}

.gray-area .right-area {width:  32%;}

.gray-area .left-area {
    width: 40%;
    margin-left:  7%;
}

.archive .rank-list .rank-item, .page-movie-post .rank-list .rank-item, .top .rank-list .rank-item {
    width: 48%;
}

.page-movie-post .rank-list .title {
    width:  75%;
}

.page-movie-post .rank-list {
    padding:  3%;
}
/* 下層 */
.right-content.media-sidebar {
    display:  none;
}

.content-2col .left-content {
    width:  100%;
    float:  none;
}
}

/* 追加11/27 */
.l-content .post_wrap {
 clear: both;
 display: -webkit-box;
 display: -webkit-flex;
 display: -ms-flexbox;
 display: flex;
 -webkit-flex-wrap: wrap;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 -webkit-box-pack: justify;
 -webkit-justify-content: space-between;
 -ms-flex-pack: justify;
 justify-content: space-between;
}

.l-content .post_wrap .inner {
 width: 31%;
 height: auto;
 margin-bottom: 24px;
 position: relative;
}

.l-content .post_wrap .inner a {
 display: block;
}

.top .post_read_more p {
 line-height: 20px;
 font-family: 'Prompt', sans-serif;
 font-size: 14px;
}
.l-content .post_wrap .inner .transform{
 position: absolute;
 top: 0;
 left: 4px;
}


.l-content .post_wrap .inner a p.date {
   -webkit-transform: rotate(-270deg);
   -ms-transform: rotate(-270deg);
   transform: rotate(-270deg);
   transform-origin: top left;
   font-size: 10px;
   line-height: 32px;
}

.l-content .post_wrap .inner a .story_img img {
   width: 100%;
   height: 270px;
   max-width: 483px;
}

.l-content .post_wrap .inner a h2.title {
 height: auto;
 -o-text-overflow: ellipsis;
 text-overflow: ellipsis;
 font-size: 17px;
 line-height: 25px;
 margin: 0px 0 10px 0;
 font-family: 'Prompt', sans-serif;
}

.l-content .post_wrap .inner a p.description {
 font-family: 'Prompt', sans-serif;
 font-size: 14px;
 line-height: 24px;
 margin-top: 5px;
}

.l-content .left-content .post_wrap .inner {
 width: 49%;
 height: auto;
 margin-bottom: 24px;
 position: relative;
}