/*
 Theme Name:   MWSP
 Description:  shusei mochizuki wp-theme
 Author:       LATHREAP.DESIGN
 Version:      1.0.0
*/

/* ==========================================================================
   /*! normalize.css v3.0.1 | MIT License | git.io/normalize */
   ========================================================================== */

html {
	font-family: sans-serif;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}
body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,
b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td, br {
	background: transparent;
	border: 0;
	margin: 0px;
	padding: 0px;
	vertical-align: baseline;
	list-style-type:none;
}
h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	font-size: 100%;
}
ol,ul,li {
	list-style: none;
	margin: 0px;
	padding: 0px;
}



/* ==========================================================================
	FONT
========================================================================== */

body {
	font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Osaka,Roboto, Meiryo, sans-serif;
	color:#333;
}
.ja {
    font-family: 'Noto Sans Japanese', sans-serif;
}
.en {
	font-family: 'Noto Sans', sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    color: #363636;
}



/* ==========================================================================
   LINK
   ========================================================================== */

a, a.inverse:active, a.inverse:focus, a.inverse:hover, button, input[type="submit"], input[type="button"], input[type="reset"], .entry-summary .readon, .comment-author .fn, .comment-author .url, .comment-reply-link, .comment-reply-login, #content .tags-links a:active, #content .tags-links a:focus, #content .tags-links a:hover, .nav-menu li a:active, .nav-menu li a:focus, .nav-menu li a:hover, ul.nav-menu ul a:hover, .nav-menu ul ul a:hover, .gk-social-buttons a:hover::before, .format-gallery .entry-content .page-links a:hover, .format-audio .entry-content .page-links a:hover, .format-status .entry-content .page-links a:hover, .format-video .entry-content .page-links a:hover, .format-chat .entry-content .page-links a:hover, .format-quote .entry-content .page-links a:hover, .page-links a:hover, .paging-navigation a:active, .paging-navigation a:focus, .paging-navigation a:hover, .comment-meta a:hover, .social-menu li:hover::before, .social-menu-topbar li:hover::before, .entry-title a:hover {
    color: #91a3af;
}
a {
    transition: all 0.3s ease-out 0s;
}
a:hover, a:active {
    outline: 0 none;
}
a.inverse, a:active, a:focus, a:hover {
    color: #363636;
    text-decoration:none;
}



/* ==========================================================================
   LABEL & BUTTON
   ========================================================================== */

.label {
    font-size: 0.85em;
    font-weight: normal;
    padding: 0.05em 1em;
}
.gray {
    background: #91a3af;
    color: #fff;
}
.blue {
    background: #6093b6;
    color: #fff;
}
.view,
.concept {
    border: 1px solid #6093b6;
    color: #6093b6;
}
.view:hover,
.concept:hover {
    background: #6093b6;
    color: #fff;
}
.concept {
    padding: 4px 12px 6px;
}
.concept:after {
	font-family: 'FontAwesome';
    content:"\f08e";
    margin-left :8px;
    display: inline-block;
    width: 1.2857142857142858em;
    text-align: center;
    vertical-align: middle;
}
.map {
    font-size: 0.85em;
    border: 1px solid #91a3af;
    padding: 2px 10px 1px;
    vertical-align: baseline;
    margin-left: 8px;
}
.map:hover {
    background: #91a3af;
    color: #fff;
}
.new {
    padding: 0.25em 1.5em;
    background: #333;
    font-size: 0.85em;
    letter-spacing: 2px;
    color: #fff;
    position: absolute;
    top: 0;
    left: 0;
}
.time:before {
	font-family: 'FontAwesome';
    content:"\f017";
    margin-right : 0.75em;
    display: inline-block;
    width: 1em;
    text-align: center;
    vertical-align: text-top; 
    font-size: 0.85em;
    color: #91A3AF;
}
.place:before {
	font-family: 'FontAwesome';
    content:"\f19c";
    margin-right : 0.75em;
    display: inline-block;
    width: 1em;
    text-align: center;
    vertical-align: text-top;
    font-size: 0.85em;
    color: #91A3AF;
}
.single .place a,
.archive .place a {
    text-decoration: underline;
    color: #333;
}
.single .place a:hover,
.archive .place a:hover {
    text-decoration: none;
    color: #91a3af;
}
.address:before {
	font-family: 'FontAwesome';
    content:"\f276";
    margin-right : 0.75em;
    display: inline-block;
    width: 1em;
    text-align: center;
    vertical-align: text-top;
    font-size: 0.85em;
    color: #91A3AF;
}
.attention:before {
	font-family: 'FontAwesome';
    content:"\f05a";
    margin-right : 0.75em;
    display: inline-block;
    width: 1em;
    text-align: center;
    vertical-align: text-top;
    font-size: 0.85em;
    color: #91A3AF;
}
.fa-external-link {
    width: 1.2857142857142858em!important;
    margin-left: 8px;
}



/* ==========================================================================
   MAIN
   ========================================================================== */

body {
	min-width:320px;
}
.site-header {
    background: #fff;
    color: #000;
    min-height: 4.5em;
    text-align: center;
}
.site-title {
    color: #333;
    font-family: 'Noto Sans Japanese', sans-serif;
    font-size: 1.428571428em;
    font-weight: 100;
    letter-spacing: 0.25em;
    line-height: 4.5em;
    margin: 0;
   	text-transform: uppercase;
}
.site-description {
    color: #91a3af;
    font-family: Arial,sans-serif;
    font-size: 0.785714285em;
    font-weight: 300;
    margin: -2.4em 0 2em;;
    text-transform: uppercase;
}
.site-header .home-link {
	color:#363636;
    display: block;
    margin: 0 auto;
    text-decoration: none;
    width: 100%;
}
.site-main {
    background-color: #f1f1f1;
    width: 100%;
}
.site-main #page {
    margin: 0 auto;
    overflow: hidden;
    padding: 2.5em 0 0;
    width: 100%;
}
#footer {
    color: #999;
    margin: 0 auto;
    padding: 4.5em 0 5em;
    text-align: center;
    width: 100%;
    max-width:750px;
}
#bottom, #gk-bottom .widget {
    color: #8e9798;
}
#footer .widget-area {
    text-align: left;
}
#footer .widget-title {
    color: #91a3af;
    font-weight: 400;
    letter-spacing: 1px;
    margin: 0 0 1em;
    text-transform: uppercase;
}
.widget .textwidget li {
    font-size:0.875em;
    font-weight: 200;
    letter-spacing: 0.1em;
    padding: 0.25em 0;
}
.widget .textwidget li a:hover {
    text-decoration:none;
}
.widget .textwidget li .fa {
    font-size: 0.875em;
    padding-right: 4px;
}
#copyrights {
    padding: 4.5em 0 0;
    text-align: center;
}
#footer .widget {
    color: #fff;
    margin: 0 0 2em;
    padding: 0 2.5em;
    width:50%;
}
.widget {
    margin: 0 0 2.5em;
    padding: 2em;
    word-wrap: break-word;
}



/* ==========================================================================
   COMMON
   ========================================================================== */

#primary {
    width: 700px;
    margin: 0 auto 3em;
}
.home #primary, .tag #primary, .search #primary, .attachment #primary,
#art #primary,
#news.archive #primary,
#movies #primary,
#store #primary{
    width: auto;
}
#content > .article > div {
    background: #fff;
    box-shadow: 0 0 13px rgba(0, 0, 0, 0.07);
}
.article-helper {
    background:#fff;
    height:380px;
    box-shadow: 0 0 13px rgba(0, 0, 0, 0.07);
}
.site-content.archive {
    overflow: hidden;
    padding-bottom: 60px;
}



/* ==========================================================================
   ENTRY
   ========================================================================== */

.entry-content, .entry-footer, .entry-summary, .entry-meta {
    padding: 0 4.5em;
}
.entry-header {
    padding-top: 2.5em;
    margin-bottom: 2em;
}
.entry-title {
    font-size: 2em;
    font-weight: 100;
    line-height: 1.2;
    margin: 0;
    word-break: normal;
}
.entry-content {
    padding-top: 2em;
    color: #777;
    line-height: 1.8;
}
.entry-footer {
    padding-top: 1em;
    padding-bottom: 7em;
}
.entry-bg {
    background-size: cover;
    background-position: 50% 50%;
    width: 30%;
    min-height: 200px;
}
.entry-detail {
    width: 70%;
    text-align: right;
}
.entry-date {
    font-size: 0.85em;
    color: #777;
    margin: 0.5em 0;
    text-align: right;
}
.entry-detail dl {
    text-align: left;   
}
.entry-detail-info > div {
    padding: 0.25em 0;
}
.entry-detail-info div > div {
    display: inline;
}
.entry-content span.head {
    text-align: center;
    display: block;
}



/* ==========================================================================
   PAGE
   ========================================================================== */

.page .entry-title,
.error404 .entry-title {
    padding-right: 2.25em;
    padding-left: 2.25em;
}



/* ==========================================================================
   SINGLE
   ========================================================================== */

.single .entry-header {
    padding: 0;
    margin-bottom: 0;
}
.single .entry-header img {
    width: 100%;
    vertical-align: bottom;
}
.single .entry-title {
    font-size: 1.5em;
    font-weight: 700;
    padding-top: 2.5em;
    padding-right: 3em;
    padding-left: 3em;
}
.single .entry-content {
    padding-top: 2.5em;
    padding-bottom: 1.5em;
    line-height: 2.1;
}
.single .entry-detail-info {
    padding-bottom: 2.5em;
    
}



/* ==========================================================================
   ARCHIVE
   ========================================================================== */

.archive .article {
    padding-bottom: 1.5em;
}
.archive .entry-title {
    font-size: 1.25em;
    font-weight: 700;
    padding-bottom: 2em;
}
.archive .article-helper {
    height: auto;
}
.archive .entry-bg,
.archive .entry-detail {
    float: left;
}
.archive .entry-bg {
    position: relative;
}
.archive .entry-detail {
    padding: 2em 2em 1.5em;
    position: relative;
}
.archive .entry-detail > a.btn {
    position: absolute;
    top: auto;
    left: auto;
    bottom: 2em;
    right: 2em;
}
.archive .entry-detail-info {
    padding-bottom: 4.5em;
    color: #777;
}



/* ==========================================================================
   NAVIGAITON
   ========================================================================== */

.main-navigation {
    clear: both;
    padding: 0 0 4em;
    text-align: center;
    font-family: 'Noto Sans', sans-serif;
}
.nav-menu li {
    display: inline-block;
    position: relative;
    text-align: left;
}
.nav-menu li a {
    letter-spacing: 0.1em;
    border: 1px solid transparent;
    color: #777;
    display: inline-block;
    font-weight: 400;
    line-height: 34px;
    padding: 0 20px;
}
body .nav-menu .current_page_item > a, body .nav-menu .current_page_ancestor > a, body .nav-menu .current-menu-item > a, body .nav-menu .current-menu-ancestor > a {
    border-color: #91a3af;
    color: #91a3af !important;
}
.nav-menu .current_page_item > a, .nav-menu .current_page_ancestor > a, .nav-menu .current-menu-item > a, .nav-menu .current-menu-ancestor > a {
    border-radius: 2px;
}


/* --------------------------------
   PROFILE LOCAL NAVIGATION
   -------------------------------- */

#profile-navigation.main-navigation {
    padding-bottom: 2em;
}
#profile-navigation .none-current.menu-item > a {
    border-width: 0;
    color: #777 !important;   
}
#profile-navigation .none-current.menu-item > a:hover {
    color: #91a3af!important; 
}



/* ==========================================================================
   FRONT-PAGE
   ========================================================================== */

#home .site-main {
    min-height: 680px;
    background-image: url("images/bg.png");
    background-position: right top;
    background-size: contain;
    background-repeat: no-repeat;
}
#home .article dt {
    font-weight: normal;
    font-size: 1.15em;
    line-height: 1.2;
    padding-bottom: 0.5em;
}
#home .article dt > a {
    color: #333;
    text-decoration: underline;
}
#home .article dt > a:hover {
    color: #91a3af;
}
#home .article-helper {
    height: auto;
}
#home .entry-week {
    line-height: 1.2;
    font-weight: bold;
    font-size: 0.85em;
    padding: 0.5em 0 0.75em;
}
#home .entry-detail-info {
    font-size: 0.85em;
}
#home .entry-detail-info > div {
    padding: 0;
    line-height: 1.5;
}
#home .article ul > li {
    background: #fff;
    margin: 1em 0;
}
#home .article-helper .entry-bg,
#home .article-helper > dl {
    float: left;
}
#home .article-helper .entry-bg {
    width: 25%;
    min-height: auto;
}
#home .article-helper > dl {
    padding: 1.5em 2em 2em;
    width: 75%;
}



/* ==========================================================================
   PROFILE
   ========================================================================== */

/* --------------------------------
   profile-figure
   -------------------------------- */

#profile-figure.article .entry-figure-wrap {
    padding: 0 4.5em;
    margin-top: 2em;
}
#profile-figure.article .entry-header .entry-figure, 
#profile-figure.article .entry-header .author-info {
    float: left;
    width: 50%;
}
#profile-figure.article .entry-header {
    margin-bottom: 2.5em;
}
#profile-figure.article .entry-header .entry-figure {
    min-height: 316px;
    background-position: 50% 50%;
    background-size: cover;
}
.author-info {
    padding-left: 4em;
}
#profile-figure.article .entry-header .author-name {
    font-weight:  100;
    font-size: 2em;
    letter-spacing: 4px;
    padding-top: 2.5em;
}
.author-name > span {
    font-size: 0.5em;
    text-transform: uppercase;
    color: #91a3af;
    display: block;
    line-height: 2.5;
}
.author-detail {
    padding-top: 3em;
    font-size: 0.85em;
    color: #777;
}



/* --------------------------------
   biography
   -------------------------------- */

#biography.article {
    margin-top: 2.5em;
}
#biography h3 {
    color: #91a3af;
    font-size: 1.4em;
    padding-bottom: 0.75em;
}
#biography .entry-content > ul {
    padding-bottom: 3.5em;
}
#biography .entry-content li > div,
#biography .entry-content li > p {
    font-size: 0.85em;
    line-height: 1.5;
}
#biography .entry-content .item-title {
    font-size: 1.15em;
    color: #585858;
    /*font-weight: bold;*/
    line-height: 1.2;
    padding: 0.5em 0;
}
#biography .entry-content li {
    border-bottom: 1px solid #f2f2f2;
    padding: 0.5em 0;
}
#biography .place > div {
    display: inline-block;
}



/* ==========================================================================
   ART & MOVIES
   ========================================================================== */

#art.single #primary {
    width: 700px;
}
#art .entry-bg,
#movies .entry-bg {
    width: 100%;
    height: 100%;
    position: static!important;
}
#art .article-helper {
    height: 320px;
    position: relative;
}
#art .article-helper > a,
#movies .article-helper > a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    opacity: 0;
    z-index: 100;
}
#art .article-helper > a span,
#movies .article-helper > a span {
    font-size: 1.25em;
    font-family: 'Noto Sans Japanese', sans-serif;
    font-weight: bold;
    position: absolute;
    top: 43%;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    text-align: center;
    letter-spacing: 2px;
}
#art .article-helper > a:hover,
#movies .article-helper > a:hover {
    opacity: 0.8;
}
#art .article-helper .entry-detail,
#movies .article-helper .entry-detail {
    background: #fff;
}
.fancybox .caption,
.concept-btn {
    display: none;
}

.fancybox-skin {
    border-radius: 0!important;
}
.fancybox-title {
    text-align: right;
    font-weight: bold;
}
.fancybox-title p {
    text-align: center;
    font-size: 1.25em;
    line-height: 2.4;
}
#infinitescrollMsgs {
    display: none;
}
#infscr-loading {
    text-align: center;
    color: #91a3af;
    clear: both;
}
.navigation {
    display: block;
    text-align: center;
    clear: both;
    line-height: 6;
}
.navigation a {
    border: 1px solid #91a3af;
    padding: 6px 12px;
    border-radius: 4px;
}



/* --------------------------------
   ART - SINGLE
   -------------------------------- */

#art.single .entry-title {
    text-align: center;
}
#art.single .entry-date,
#art.single .concept-btn {
    float: left;
    width: 50%;
}
#art.single .concept-btn {
    display: block;
}
#art.single .concept-btn {
    text-align: right;
}
#art.single .entry-date {
    text-align: left;
}



/* ==========================================================================
   NEWS
   ========================================================================== */

#news .entry-bg {
    width: 30%;
    min-height: 320px;
}
#news .entry-detail {
    width: 70%;
}
.entry-week {
    line-height: 1;
}
.single .entry-week,
.archive .entry-week {
    padding: 1.5em 0;
    font-weight: bold;
    color: #333;
}
.ending-archive {
    font-size: 0.85em;
    display: inline;
    color: #91A3AF;
}

#news .view {
    margin-top: 1em;
}



/* ==========================================================================
   STORE
   ========================================================================== */

#store .tax-title {
    text-align: center;
    padding-bottom: 2em;
    color: #777;
}
#store .tax-content {
    padding-bottom: 2.5em;
}
#line .entry-title {
    color: #00C300;
}



/* ==========================================================================
   MOVIES
   ========================================================================== */

#movies .article-helper {
    height: 200px;
    position: relative;
}
#movies .entry-bg:after {
    content: "\f144";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
	font-family: 'FontAwesome';
    font-size: 5em;
    line-height: 200px;
    color: #fff;
    opacity: 0.65;
    margin: auto;
    width: 100%;
    text-align: center;
}



/* ==========================================================================
   statement
   ========================================================================== */

#statement .entry-detail dd {
    color: #777;
}
#statement .article.col-md-6 {
    width: 100%;
}
#statement.archive .entry-title {
    padding-bottom: 1em;
}



/* ==========================================================================
   PREV & NEXT
   ========================================================================== */

#prev-post, #next-post {
    height: 54px;
    left: 0;
    position: fixed;
    top: 50%;
    width: 54px;
}
#prev-post {
    left: auto;
    right: 0;
}
#prev-post > a, #next-post > a {
    background: #333 none repeat scroll 0 0;
    border-radius: 0 50% 50% 0;
    display: block;
    height: 54px;
    margin-left: -12px;
    transition: all 0.3s ease-out 0s;
    width: 54px;
}
#prev-post > a {
    border-radius: 50% 0 0 50%;
    margin-left: auto;
    margin-right: -12px;
}
#prev-post i, #next-post i {
    color: #fff;
    font-size: 24px;
    line-height: 54px;
    text-align: center;
    text-indent: 6px;
    transition: all 0.3s ease-out 0s;
    width: 54px;
}
#prev-post i {
    text-indent: -6px;
}
#prev-post > a:hover, #next-post > a:hover {
    background: #91a3af;
    margin-left: 0;
}
#prev-post > a:hover {
    margin-left: auto;
    margin-right: 0;
}



/* ========================================================================== */
   @media only screen and (max-width: 1024px) {
/* ========================================================================== */

    /* ------------------------------
        FRONT-PAGE
    ------------------------------ */

    #home .article-helper .entry-bg {
        min-height: 20px;
    }


}



/* ========================================================================== */
   @media only screen and (max-width: 991px) {
/* ========================================================================== */

	body {
		font-size:12px;
	}
	#profile-figure.article .entry-header .author-name {
	    padding-top: 4em;
	}
	#news .entry-bg {
	    min-height: 240px;
	}
    .archive .entry-detail-info {
        padding-bottom: 0;
    }


    /* ------------------------------
        FRONT-PAGE
    ------------------------------ */

    #home .site-main {
        background-image: url("images/bg-tb.png");
        background-size: cover;
    }


}



/* ========================================================================== */
   @media only screen and (max-width: 767px) {
/* ========================================================================== */

    /* ------------------------------
        MAIN
    ------------------------------ */

    #primary {
        width: 100%!important;
    }
    #footer .widget {
        width: 100%;
    }
    .entry-content, .entry-footer, .entry-summary, .entry-meta {
        padding-right: 2em;
        padding-left: 2em;
    }
    .btn {
        font-size: 0.85em;
    }
    .new {
        padding: 0.25em 2em;
        font-size: 1em;
    }
    #home #primary {
        padding-top: 0em;
    }
    #home .site-main {
        min-height: 100px;
        background-image: url("images/bg-sp.png");
        background-size: contain;
        background-position: center 6em;
    }

    /* ------------------------------
        ENTRY
    ------------------------------ */

    .entry-content, .entry-summary, .entry-meta {
        padding-right: 2em;
        padding-left: 2em;
    }
    .entry-bg,
    .entry-detail {
        width: 100%;   
    }
    .entry-bg {
        min-height: 120px;
    }
    .entry-content span.head {
        text-align: left;
    }
    .entry-footer {
        padding-bottom: 3.5em;
    }

    /* ------------------------------
        ARCHIVE
    ------------------------------ */

    .archive .entry-detail > a.btn {
        position: static;
    }

    .archive .entry-detail > .view {
        margin-top: 1em;
    }
    .archive .entry-detail {
        padding: 2em;
    }
    .archive .entry-detail-info {
        padding-bottom: 0;
    }
    .archive .article-helper {
	margin-bottom: 1.5em;
    }

    /* ------------------------------
        SINGLE
    ------------------------------ */

    .single .entry-title {
        padding-right: 1.6em;
        padding-left: 1.6em;
    }


    /* ------------------------------
        PAGE
    ------------------------------ */

    .page .entry-title,
    .error404 .entry-title {
        padding-right: 1em;
        padding-left: 1em;      
    }


    /* ------------------------------
        FRONT-PAGE
    ------------------------------ */

    #home .article-helper > dl {
        padding: 1.5em 1.25em;
    }


    /* ------------------------------
        ART
    ------------------------------ */

    #art .article-helper {
        height: 256px;
        margin-bottom: 1.5em;
    }
    #art.single .entry-title {
        font-size: 1.25em;
    }
    #art.single .entry-footer {
        padding-bottom: 3.5em;
    }


    /* ------------------------------
        PROFILE
    ------------------------------ */

    #profile-figure.article .entry-header .entry-figure, 
    #profile-figure.article .entry-header .author-info {
        float: none;
        width: 100%;
    }
    #profile-figure.article .entry-header .author-name {
        padding: 1em 0 0;
        font-size: 2em;
        font-weight: 200;
    }
    #profile-figure.article .entry-figure-wrap {
        padding-right: 2em;
        padding-left: 2em;
    }
    .author-info {
        text-align: center;
        padding: 0;
    }
    .author-detail {
        padding: 0;
    }


    /* ------------------------------
        EVENT
    ------------------------------ */

    #news .entry-bg,
    #news .entry-detail {
        width: 100%;
    }
    #news .entry-bg {
        min-height: 180px;
    }



}



/* clearfix */
.clearfix:after{
    content: "."; 
    display: block; 
    height: 0; 
    font-size:0;	
    clear: both; 
	visibility:hidden;
}
.clearfix{
	display: inline-block;
} 
/* Hides from IE Mac */
* html .clearfix{
	height: 1%;
}
.clearfix{
	display:block;
}