/*
Theme Name: Men's Club MASA
Theme URI: https://polyphonic.me/
Author: Graph Paper Press
Author URI: https://polyphonic.me/
Description: Wall Street is a responsive WordPress business theme for savvy entrepreneurs and startups.
Version: 1.1.10
License: GNU General Public License, V2
License URI: license.txt
Text Domain: wallstreet
Domain Path: /languages/
Tags: black, white, light, dark, right-sidebar, fluid-layout, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Wall Street is based on Underscores http://underscores.me/, (C) 2012-2013 Automattic, Inc.

Resetting and rebuilding styles have been helped along thanks to the fine work of
Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
and Blueprint http://www.blueprintcss.org/
*/
	

/* =Reset
-------------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500;600;700;800&family=Ultra&display=swap');

html, 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, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
	font-style: normal;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
	color: #222;
}
body {
	background: #f6f6f6;
	font-size: clamp(14px, 1vw, 16px);
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section {
	display: block;
}
ol, ul {
	list-style: none;
}
a img {
	border: 0;
}

button,
input,
select,
textarea {
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
	font-style: normal;
	font-size: 16px;
	line-height: 1.8;
}

img {
	height: auto; /* Make sure images are scaled correctly. */
	max-width: 100%; /* Adhere to container width. */
}

/* Links */
a {
	text-decoration: none;
	-webkit-transition: color 0.07s ease-in;
	-moz-transition: color 0.07s ease-in;
	-o-transition: color 0.07s ease-in;
	transition: color 0.07s ease-in;
}
a:visited {

}
a:hover,
a:focus,
a:active {
	-webkit-transition: color 0.07s ease-in;
	-moz-transition: color 0.07s ease-in;
	-o-transition: color 0.07s ease-in;
	transition: color 0.07s ease-in;
}

.grecaptcha-badge {
	opacity: 0;
}

/* =Title
----------------------------------------------- */
.logo {
    position: absolute;
    top: 2.5em;
    left: calc(50vw - 17.5vw / 2);
    z-index: 1000;
}

h1.site-title img {
	width: 17.5vw;
	height: auto;
}
.site-description {
	font-size: 0.6vw;
	line-height:3;
	display: block;
	font-weight:700;
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
	font-style: normal;
	margin: 0;
	letter-spacing:-0.005vw;
	color: #fff;
}

/* =Menu
----------------------------------------------- */
#menu-wrap {
	width: 100vw;
	height: 80px;
	padding: 0;
  	margin: 20vh 0 0;
	contain: paint;
	z-index: 999;
}

.main-navigation ul {
    margin: 0 0 0 0;
    padding: 0;
    display: flex;
    justify-content: center;

}
.main-navigation li {
    float: none;
    position: relative;
    font-size: clamp(16px, 2vw, 24px);
    text-align: center;
    margin: 15px 3vw;
    padding: 10px 0;

}
.main-navigation li.home-link {
	background: url('https://polyphonic.me/2025/img/logo-999.png') no-repeat;
	background-size: cover;
	width: 310px;
	height: 50px;
	text-indent: -9999px;
	transition: all 0.4s ease;
}
.main-navigation a {
	display: block;
	text-decoration: none;
	padding: 0 0;
	color: #222;
	font-family: "Ultra", serif;
	font-weight: 400;
	font-style: normal;
	line-height: 2.4;
	text-transform: uppercase;;
}
.navigation {
	float: left;
	width: 100%;
	display: none;
}

/* 404
----------------------------------------------- */
body.error404 #page {
	margin-top: 10vh;
}
h2.nf404 {
	text-align: center;
	font-family: "Ultra", serif;
	font-weight: 400;
	font-style: normal;
	line-height: 2.4;
	text-transform: uppercase;;
	font-size: clamp(16px, 2vw, 24px);
}
h3.nf404 {
	text-align: center;
	font-weight: 400;
	font-style: normal;
	line-height: 2.4;
	font-size: clamp(16px, 2vw, 24px);
}

/* Home Slider
----------------------------------------------- */
#masthead-wrap {
	width: 100%;
	height: 100%;
	top: 30vh;
	left: 0px;
	position: absolute;
	z-index: 0;
}
#masthead-wrap.slideshow-sp {
	display: none;
}
.flexslider {
	height: 100%;
	overflow: visible !important;
}
.flexslider .slides > li {
	background-position: center center;
}
#home-slider-wrap {
	width: 100%;
	height: 100%;
	max-width: 100%;
	position: absolute;
	top: 0;
	z-index: 0;
}
#home-slider .flex-direction-nav {
	display: none;
}
#home-slider {
	float: left;
	width: 100%;
	height:100%;
	max-height: 100%;
}
#home-slider .flex-caption .slider-caption {
	font-size: 0.8em;
	font-family: Blair;
}
.flex-caption {
	padding-bottom: 2% !important;
}
.flex-caption .home-slide-title {
	font-size: 5em;
	text-transform: uppercase;
	margin-bottom: 0.8em;
}
.flex-caption .home-slide-title a {
	text-decoration: none;
}
.flex-caption .slider-caption {
	padding-left: 20%;
}
.flex-caption .home-slide-title {
}

.flexslider ul.slides {
    width: 100%;
    margin-top: 1vw;
}
.flexslider .slides > li img {
	width: 100vw !important;
	height: auto !important;
}
#home-slider .flex-caption {
	display: none;
}

/* =Home Contents
----------------------------------------------- */
#primary {
	width: 100%;
	margin: 0 0;
}
#content {
	width: 100%;
	margin: 10vh 0 0;
}
body.home #content {
	width: 100%;
	margin: 0 0 0;
}
.homepage-section {
	padding-top: 20vh;
	position: relative;
}

#concept-section {
	clear: both;
}

.section-title-name {
	clear: left;
	display: block;
	position: relative;
}

/* CONTACT Section
----------------------------------------------- */
#contact h2.section-title {
	text-align: center;
	font-size: 3vw;
	padding: 0 0 .5em;
}
#contact h2.section-title .section-title-name {
	color: #222;
	font-family: Ultra, serif;
    font-weight: 400;
    font-style: normal;
	text-transform: uppercase;
}
#contact article {
	padding-bottom: 0;
	width: 90%;
	margin: 0 auto;
}
.contact-content p {
	text-align: left;
}
.contact-content span {
	letter-spacing: 0;
	color: #222;
	text-transform: uppercase;
	line-height: 2;
	font-size: 1.1em;
}
.contact-left {
	width: 48%;
	margin: 0 2% 0 0;
	float: left;
}
.contact-right {
	width: 48%;
	margin: 0 0 0 2%;
	float: left;
}
.contact-content input[type="text"],
.contact-content input[type="email"] {
	width: 100%;
    padding: 15px;
    background: #eee;
    border: 1px solid #222;
    margin-bottom: 35px;
    color: #222;
    border-radius: 10px;
}
.contact-content textarea {
	width: 100%;
	padding: 15px 15px 15px;
	background: #eee;
    border: 1px solid #222;
	color: #222;
	border-radius: 10px;
}
.contact-content p.contactbtn {
	text-align: center;
	clear: both;
}
.contact-content button {
	background: #2f3166;
	color: #f6f6f6 !important;
	border: solid 1px #f6f6f6;
	position: relative;
	height: auto;
	font-family: Ultra, serif;
    font-weight: 400;
    font-style: normal;
	font-size: 2vw;
	padding: 0 1.5em;
	cursor: pointer;
	transition: 800ms ease all;
	outline: none;
	margin-top: 0.8em;
	text-transform: uppercase;
	border-radius: 8px;
	box-shadow: 0px 0px 0px 5px #2f3166;
	text-indent: 5px;
}
.contact-content button:hover{
	background: #f6f6f6;
	color: #2f3166 !important;
}

div.wpcf7-mail-sent-ok {
	background: rgba(240,255,0,1) !important;
	text-align: center !important;
	border: none !important;
	padding: 1em;
}

/* CONTACT Section SP
----------------------------------------------- */
@media only screen and (max-width: 480px) {
	#contact article {
		width: 90%;
	}
	#contact h2.section-title {
		font-size: 5.4vw;
	}
	.contact-left {
		width: 100%;
		margin: 0px 0px 0px 0px;
		float: none;
	}
	.contact-right {
		width: 100%;
		margin: 0px 0px 0px 0px;
		float: none;
	}
	.contact-content button {
		font-size: 5.4vw;
	}
}

/* =NEWS Section
----------------------------------------------- */
#news {
	
}
#news h2.section-title .section-title-name {
  	text-align: center;
	font-size: 3vw;
	padding: 0 0 .5em;
	color: #222;
	font-family: Ultra, serif;
    font-weight: 400;
    font-style: normal;
	text-transform: uppercase;
}
#news article {
	width: 60%;
	margin: 0 auto;
}
#news article dl {
	display: flex;
	margin-bottom: 1.2em;
}
#news article dl dt {
	font-family: Ultra, serif;
    font-weight: 400;
    font-style: normal;
	font-size: 1.5vw;
	line-height: 1.4;
	width: 30%;
}
#news article dl dd {
	font-size: 1.5vw;
	line-height: 1.4;
	width: 70%;
}

/* =NEWS Single
----------------------------------------------- */
body.news.single article.news {
	width: 100%;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
body.news.single article.news h1.entry-title {
	font-size: 2vw;
	font-weight: 700;
	text-align: center;
	margin-bottom: 1em;
	width: 100%;
}
body.news.single article.news .entry-meta {
	font-family: Ultra, serif;
    font-weight: 400;
    font-style: normal;
	font-size: 1vw;
	line-height: 1.4;
	text-align: center;
	margin-bottom: 1.5em;
	width: 100%;
}
body.news.single article.news .entry-header {
	width: 100%;
}
body.news.single article.news .entry-content {
	font-size: 1.2vw;
	line-height: 2;
	margin-bottom: 15vh;
}
body.news.single article.news .entry-content p a {
	text-decoration: underline;
}

body.news.single #news article {
	width: 60%;
	margin: 0 auto;
	display: block;
}
body.news.single #news article h1.entry-title {
	font-size: 2vw;
	font-weight: 700;
	text-align: center;
	margin-bottom: 1em;
}
body.news.single #news article .entry-meta {
	font-family: Ultra, serif;
    font-weight: 400;
    font-style: normal;
	font-size: 1vw;
	line-height: 1.4;
	text-align: center;
	margin-bottom: 1.5em;
}
body.news.single #news article .entry-header {
	width: 100%;
}
body.news.single #news article .entry-content {
	font-size: 1.2vw;
	line-height: 2;
}

/* =NEWS Section SP
----------------------------------------------- */
@media only screen and (max-width: 480px) {
	#news h2.section-title .section-title-name {
		font-size: 5.4vw;
	}
	#news article {
		width: 90%;
		margin: 0 auto;
	}
	#news article dl {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	#news article dl dt {
		font-size: 4vw;
		width: 100%;
		text-align: center;
	}
	#news article dl dd {
		font-size: 4vw;
		width: 100%;
		text-align: center;
	}
	body.news.single #news article {
		width: 90%;
		margin: 0 auto;
		display: block;
	}
	body.news.single article.news h1.entry-title {
		font-size: 4.4vw;
	}
	body.news.single article.news .entry-meta {
		font-size: 3.6vw;
	}
	body.news.single article.news .entry-content {
		font-size: 3.6vw;
		width: 90%;
		margin: 0 auto;
	}
}


/* =COMPANY Section
----------------------------------------------- */
#company {
	
}
#company h2.section-title .section-title-name {
  	text-align: center;
	font-size: 3vw;
	padding: 0 0 .5em;
	color: #222;
	font-family: Ultra, serif;
    font-weight: 400;
    font-style: normal;
	text-transform: uppercase;
}
#company .company {
	display: flex;
}
#company .company dl {
	width: 40%;
	display: flex;
	flex-wrap: wrap;
	margin-left: 20%;
}
#company .company dl dt {
	font-weight: 700;
	width: 30%;
	margin-bottom: 0.5em;
}
#company .company dl dd {
	width: 70%;
	margin-bottom: 0.5em;
}
#company .company dl:nth-of-type(2) {
	margin-left: 0;
}

/* =COMPANY Section SP
----------------------------------------------- */
@media only screen and (max-width: 480px) {
	#company h2.section-title .section-title-name {
		font-size: 5.4vw;
	}
	#company .company {
		display: flex;
		flex-wrap: wrap;
	}
	#company .company dl {
		width: 90%;
		display: flex;
		flex-wrap: wrap;
		margin: 0 auto;
	}
	#company .company dl:nth-of-type(2) {
		margin: 0 auto;
	}
}

/* =SERVICE Section
----------------------------------------------- */
#service-section {
}
#service-section h2.section-title .section-title-name {
  	text-align: center;
	font-size: 1.6vw;
	padding: 0 0 .5em;
	color: #999;
	font-family: 'Blair';
}
#service-section .about-content h3 {
	font-family: Arial, Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; 
	font-size: 1.4em;
	letter-spacing: 3px;
	margin-bottom: 1em;
	padding-top: 2em;
	text-align: center;
	font-weight: bold;
	color: #777;
}
#service-section .about-content {
	font-family: Arial, Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; 
	font-size: 1.0em;
	letter-spacing: 2px;
	line-height: 2;
	text-align: center;
	color: #777;
}

/* =SERVICE Section SP
----------------------------------------------- */
@media only screen and (max-width: 480px) {
	#service-section h2.section-title .section-title-name {
		font-size: 4.4vw;
	}
}

/* =SHOP Section
----------------------------------------------- */
#shop {
	width: 90%;
	margin: 0 auto;
	clear: both;
}
#shop h2.section-title {
  	text-align: center;
	font-size: 3vw;
	padding: 0 0 .5em;
}
#shop h2.section-title a {
 	color: #222;
	font-family: Ultra, serif;
    font-weight: 400;
    font-style: normal;
	text-transform: uppercase;
}
#shop .wrapper.grid-3 {
	display: inline-block;
    width: 100%;
}
#shop .wrapper.grid-3 article {
	vertical-align: top;
    float: left;
    margin: 0 6.5% 6.5% 0;
    padding: 0;
    width: 29%;
    position: relative;
}
#shop .wrapper.grid-3 article:nth-of-type(3n) {
	margin: 0 0 2% 0;
}
#shop .wrapper.grid-3 article:nth-of-type(3n+3) {
	margin-right: 0;
}
#shop .wrapper.grid-3 article:nth-of-type(3n+1) {
	clear: left;
}
.entry-image, .entry-image img {
	margin: 0 auto;
	display: block;
	width: 100%;
}
#shop article .entry-image, #shop article .entry-image img {
	width: 100%;
	float: left;
	height: auto;
	margin-bottom: 0;
}
.archive .entry-image, .grid-3 .entry-image, .grid-4 .entry-image {
	margin-bottom: 0.5em;
	position: relative;
}

#shop article h3.entry-title {
	font-size: 1.4vw;
	font-weight: 700;
	padding: 0 0 0.5em;
	margin-top: 0.25em;
	display: inline-block;
}
#shop article p.phonenumber {
	font-family: Ultra, serif;
    font-weight: 400;
    font-style: normal;
	text-transform: uppercase;
	font-size: 1.4vw;
	margin-bottom: 0.8em;
}
#shop article p.shopinfo {
	margin-bottom: 1em;
}
#shop article p.shopinfo a {
	background: #2f3166;
	color: #f6f6f6 !important;
	border: solid 1px #f6f6f6;
	position: relative;
	height: 50px;
	font-family: Ultra, serif;
    font-weight: 400;
    font-style: normal;
	font-size: 1.4vw;
	padding: 0 1.5em;
	cursor: pointer;
	transition: 800ms ease all;
	outline: none;
	margin-top: 0.8em;
	text-transform: uppercase;
	border-radius: 8px;
	box-shadow: 0px 0px 0px 5px #2f3166;
	text-indent: 5px;
}
#shop article p.shopinfo a:hover {
	background: #f6f6f6;
	color: #2f3166 !important;
}
#shop article p.recbtn a {
	border: solid 1px #222;
	padding: 0 1.5em;
	font-family: Ultra, serif;
    font-weight: 400;
    font-style: normal;
	text-transform: uppercase;
	border-radius: 8px;
}
#shop article p.recbtn a:hover {
	background: #222;
	color: #f6f6f6 !important;
}
#shop article p.recbtn a:nth-of-type(2) {
	border: none;
	font-size: 1.75em;
	padding: 0;
	position: relative;
	top: 0.2em;
	color: #821212;
}
#shop article p.recbtn a:nth-of-type(2):hover {
	background: none;
	color: #222 !important;
}

/* =WORKS Section SP
----------------------------------------------- */
@media only screen and (max-width: 480px) {
	.home #main,
	.archive #main,
	.single #main,
	.page #main {
		width: 100%;
		margin: 0 auto;
	}
	#shop h2.section-title {
		font-size: 5.4vw;
	}
	#shop .wrapper.grid-3 article,
	#shop .wrapper.grid-3 article:nth-of-type(3n) {
		width: 100%;
		margin: 0 0 15%;
	}
	#shop article h3.entry-title {
		font-size: 4.4vw;
	}
	#shop article p.phonenumber {
		font-size: 4.4vw;
	}
	#shop article p.shopinfo {
		margin-bottom: 1em;
	}
	#shop article p.shopinfo a {
		font-size: 3.6vw;
	}
}

/* =NEWS Archive
----------------------------------------------- */
header.page-header {
	margin-bottom: 0;
}
.archive h1.page-title {
	margin-bottom: 0;
	text-align: center;
}
.archive h1.page-title span {
	color: #222;
	font-family: "Ultra", serif;
	font-weight: 400;
	font-style: normal;
	line-height: 2.4;
	text-transform: uppercase;;
	font-size: 3vw;
	letter-spacing: 0;
}
.archive h1.entry-title a {
	font-family: 'Blair';
	font-weight: normal;
	color: #999;
}
.archive article.news {
	width: 60%;
	margin: 0 auto;
}
.archive article.news dl {
	display: flex;
}
.archive article.news dl dt {
	font-family: Ultra, serif;
    font-weight: 400;
    font-style: normal;
	font-size: 1.5vw;
	line-height: 1.4;
	width: 30%;
}
.archive article.news dl dd {
	font-size: 1.5vw;
	line-height: 1.4;
	width: 70%;
}

/* =WORKS Archive SP
----------------------------------------------- */
@media only screen and (max-width: 480px) {
	body.category-news #page {
		margin: 3em 0 0;
	}
	.archive h1.page-title span {
		font-size: 5.4vw;
	}
	.archive article.news {
		width: 90%;
	}
	.archive article.news dl {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.archive article.news dl dt {
		font-size: 4vw;
		width: 100%;
		text-align: center;
	}
	.archive article.news dl dd {
		font-size: 4vw;
		width: 100%;
		text-align: center;
	}
}

/* SP
----------------------------------------------- */
@media only screen and (max-width: 480px) {	
	body {
		overflow-x: visible;
	}
	.home #menu-wrap {
		height: 90px;
		padding: 15px 0;
		margin: 15vh 0 0;
	}
	#menu-wrap {
		height: 90px;
		padding: 15px 0;
		margin: 15vh 0 0;
	}
	.main-navigation {
		width: 100%;
		left: 0;
	}
	.main-navigation ul {
		display: flex;
	}
	.main-navigation li {
		position: relative;
		text-align: center;
		margin: 0;
		padding: 0.5em 0.5em 0;
		float: left;
	}
	.main-navigation a {
		font-size: 3.6vw;
	}
	.logo {
		top: 2.5em;
		left: 30vw;
		width: 40vw;
	}
	.home.has-home-slideshow h1.site-title img {
		width: 40vw;
	}
	h1.site-title img {
		width: 40vw;
	}
	.logo-fixed {
		top: 20vh;
		left: 25vw;
		position: absolute;
	}
	#content {
		width: 100%;
		margin: 10vh 0 0;
	}
	.single #content,
	.page #content,
	.archive #content{
		width: 100%;
		margin: 0 0 0;
	}
	.no-sidebar #primary {
		width: 100%;
	}

	.archive #page,
	.single #page {
		margin: 0 auto 0;
	}
	
	#masthead-wrap {
		top: 22vh;
		left: 0px;
		position: absolute;
		height: 70vh;
	}
	#masthead-wrap.slideshow-pc {
		display: none;
	}
	#masthead-wrap.slideshow-sp {
		display: block;
	}
	.flexslider ul.slides {
		width: 100%;
		margin-top: 1vw;
	}
	.flexslider .slides > li img {
		width: 100% !important;
		height: auto !important;
	}

	h2.home-slide-title {
		writing-mode: horizontal-tb;
  		-webkit-writing-mode: horizontal-tb;
 		-ms-writing-mode: horizontal-tb;
		position: absolute;
		top: 81vh;
		left: 5%;
		max-width: 90%;
		height: 0.8em;
		font-size: 4.2em;
		letter-spacing: -5px;
		overflow: hidden;
	}
	p.slider-caption {
		padding-left: 0;
		position:relative;
		top:101%;
		left: 6%;
		max-width:89%;
	}
	
	body.non-touch-screen #home-slider-wrap,
	#home-slider-wrap {
		position:absolute;
	}
	
	.page-page {
    	width: 80%;
    	border: 1px #eee solid;
    	position: absolute;
	}
}


/* =Content
----------------------------------------------- */

.sticky {
}

.byline,
.updated {
	display: none;
}
.single .byline,
.group-blog .byline {
	display: inline;
	font-style: italic;
}
.author, .vcard {
	font-style: normal;
}
.archive .entry-content {
	margin: 1.5em 0 0;
}
.team-page .entry-content {
	margin-top: 0.5em;
}
.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/* =Navigation
----------------------------------------------- */

.site-main [class*="navigation"] {
	margin: 2em 0 3em;
	overflow: hidden;
}
[class*="navigation"] .nav-previous {
	float: left;
	width: 50%;
}
[class*="navigation"] .nav-next {
	float: right;
	text-align: right;
	width: 50%;
}

.error404 .search-form {
	margin-bottom: 3em;
}
#homewidgets {
	width: 94%;
	float: left;
	padding: 4em 3% 2em 3%;
	text-align: center;
}
#homewidgets .widget {
	margin: 2em 0 4em 0;
}
.action-button .button, .slide-button .button, .nav-links a, .slide-button a {
	padding: 0.5em 1.5em;
	margin-top: 1.5em;
	text-decoration: none;
	display: inline-block;
	text-transform: uppercase;
	font-size: 1.5em;
}
.slide-button {
	float: right;
	position: relative;
	opacity: 0;
}
.slide-button a {
	margin-top: 0;
}
.action-button .button:hover, .slide-button .button:hover, .slide-button a:hover {
}
.nav-links a {
	font-size: 1em;
	text-transform: none;
	margin: 0;
	border: 0;
	padding: 0.8em 1.5em;
}
.nav-links a:hover {
}
.widget_actionwidget {
}
#homewidgets .widget-title {
	text-transform: uppercase;
	font-size: 4em;
	margin-bottom: 0.2em;
}
.widget_actionwidget .action-text {
}
.widget_actionwidget h3.button-title {
	margin: 0;
	padding: 0;
}
#custom-header-image {
	width:100%;
	float:left;
}
#custom-header-image img {
	float:left;
	width:100%;
}

/* =FOOTER
----------------------------------------------- */
#colophon {
	width: 100%;
	padding: 15vh 0 15vh;
}

p.logo-b {
	text-align: center;
}
p.logo-b img {
	width: 6vw;
	height: auto;
}
p.copy {
	text-align: center;
	font-family: Ultra, serif;
    font-weight: 400;
    font-style: normal;
	font-size: 0.8em;
	color: #222;
	padding-top: 2em;
	text-transform: uppercase;
}

/* =FOOTER SP
----------------------------------------------- */
@media only screen and (max-width: 480px) {
	p.logo-b img {
		width: 16vw;
		height: auto;
	}
}


/* ------------------------ Smooth Link ------------------------ */
.pagetop {
	display: none;
	position: fixed;
	bottom: 30px;
	right: 30px;
	z-index:888;
}
.pagetop a {
	display: block;
	width: 50px;
	height: 50px;
	background-color: #ccc;
	border-radius: 50px;
	text-align: center;
	color: #fff !important;
	font-size: 24px;
	text-decoration: none;
	line-height: 50px;
	filter:alpha(opacity=50);-moz-opacity: 0.5;opacity: 0.5;
}


/* ------------------------ RAYOUT ------------------------ */
#page {
	width: 100%;
	padding: 0;
	overflow:visible;
	clear: both;
	display: block;
	margin-top: 70vh;
}
.single #page {
	margin: 3em 0 0;
}
.archive #page {
	margin: 10em 0 0;
}

.section-title-top {
	font-size: 0.5em;
	margin-bottom: 1em;
	display: inline-block;
	padding: 5px 0;
	text-transform: none;
	font-style: italic;
}
.section-title-top p {
	margin-bottom: 0;
	font-size: 0.5em;
	line-height: 1.5em;
}

/* Services Section */
#services-section .wrapper {
	width: 100%;
	float: left;
	position: relative;
}
#services-section article {
	border-right: 0;
	border-top: 0;
}
#services-section .entry-title {
	text-align: center;
	font-size: 1.4em;
	margin: 1em 0;
}
#services-section .entry-title a {
	text-decoration: none;
}
#services-section .entry-title a:hover {
}
#services-section article .entry-image {

}
#services-section article .entry-image img {
	display: block;
	margin: 0 auto;
}
#services-section .entry-title a {
	color: #222;
}
#services-section .entry-title a:hover {
	color: #5d879c;
}

/* Clients Section */
#clients-section article {
	width: 18%;
	float: left;
	margin-right: 2.5%;
}
#clients-section article:nth-of-type(5n+5) {
	margin-right: 0;
}
#clients-section .entry-image img {
	margin: 0 auto;
	display: block;
	width: auto;
	float: none;
	filter: grayscale(1);
	-webkit-filter: grayscale(1);
	-moz-filter: grayscale(1);
	opacity: 0.7;
}
#clients-section .entry-image img:hover {
	filter: grayscale(0);
	-webkit-filter: grayscale(0);
	-moz-filter: grayscale(0);
	opacity: 1;
}

/* Testimonials */
#testimonials-section article {
	float: left;
	width: 100%;
	margin-top: 3em;
	margin-bottom: 0;
}
#testimonials-section article .entry-title a {
	text-decoration: none;
}
#testimonials-section article .entry-image {
	width: 35%;
	float: right;
}

#testimonials-section article .entry-image img {
	float: left;
	width: 100%;
	height: auto;
}
#testimonials-section article:nth-child(even) .entry-image {
	float: left;
	margin-left: -20%;
}

#testimonials-section article .entry-title {
	text-align: right;
	margin-bottom: 0;
	margin-right:5%;
}
#testimonials-section article .post-meta {
	float: left;
	width: 65%;
	position: relative;
}

#testimonials-section article:nth-child(even) .post-meta {
	float: right;
	width: 65%;
	position: relative;
}
#testimonials-section article .testimonial-text {
	padding: 10%;
	border-radius: 100%;
	width: 58%;
	margin-left: 10%;
	text-align: center;
}
#testimonials-section article:nth-child(even) .testimonial-text {
	margin-right: 10%;
	margin-left: 0;
	float: right;
}
#testimonials-section article .testimonial-text p {
	font-style: italic;
	font-size: 1.5em;
}
#testimonials-section article .testimonial-bubble {
	border-radius: 100%;
	padding: 40px;
	bottom: 3%;
	right: 6%;
	position: absolute;
}
#testimonials-section article:nth-child(even) .testimonial-bubble {
	left: 6%;
	right: auto;
}
#testimonials-section article .testimonial-small-bubble {
	border-radius: 100%;
	padding: 20px;
	bottom: -2%;
	right: 0%;
	position: absolute;
}
#testimonials-section article:nth-child(even) .testimonial-small-bubble {
	left: 0;
	right: auto;
}

.grid-3 article {
	text-align: center;
}
.search article h1.entry-title, .grid-3 article h1.entry-title {
	margin-bottom: 0.2em;
	font-size: 1.0em;
	letter-spacing: 3px;
}
.search h1.entry-title a, .grid-3 h1.entry-title a {
	color:#222;
}
.search h1.entry-title a:hover, .grid-3 h1.entry-title a:hover {
}
footer.entry-meta {
	padding: 1em 0;
}
.footer-entry-wrap {
	float: left;
	padding-top: 0.5em;
}
.entry-meta a {
	font-style: normal;
	text-transform: uppercase;
}
.archive footer.entry-meta {
	display: none;
}

#secondary {
	float: left;
	width: 20%;
	margin-left: 5%;
}
#secondary .widget {
	margin-bottom: 3em;
}






.single .site-header .site-branding, .page .site-header .site-branding {
	position: absolute;
	top: 45px;
	left: 6%;
	z-index: 10;
}
.single .site-header .main-navigation, .page .site-header .main-navigation {
	clear: both;
	display: block;
	z-index:10;
	position:absolute;
	top:0;
	left:0;
}
.single .site-header h1.site-title, .page .site-header h1.site-title {
	font-size:3em;
	letter-spacing:-2px;
	margin:0;
}
.single .site-header h1.site-title span.lastname, .page .site-header h1.site-title span.lastname {
	display:inline;
}
.single .site-header .site-description, .page .site-header .site-description {
	font-size: 0.8em;
	line-height:2;
	display: block;
	letter-spacing:1px;
	margin:1em 0 0;
	text-indent:30px;
}

.archive .site-header .site-branding {
	position: absolute;
	top: 45px;
	left: 6%;
	z-index: 10;
}
.archive .site-header .main-navigation {
	clear: both;
	display: block;
	z-index:10;
	position:absolute;
	top:150px;
	left:6%;
}
.archive .site-header h1.site-title {
	font-size:3em;
	letter-spacing:-2px;
	margin:0;
}
.archive .site-header h1.site-title span.lastname {
	display:inline;
}
.single .site-header .site-description,
.page .site-header .site-description,
.archive .site-header .site-description {
	font-size: 0.8em;
	line-height:2;
	display: block;
	letter-spacing:1px;
	margin: 0 0;
	text-indent:0;
}


#secondary h1.widget-title {
	text-transform: uppercase;
	font-size: 1.5em;
}

.single-format-image .entry-image {
	float: left;
	width: 70%;
	margin-right: 3%;
	position: relative;
}
.entry-image.fullscreen {
	width: 100%;
}
.entry-image.fullscreen .featured-image-caption {
	display: none;
}
.entry-image.fullscreen img {
	max-height: 100%;
}
.image-fullscreen, .flex-full-screen {
	position: absolute;
	width: 100%;
	height: 100%;
	display: block;
	left: 0;
	top: 0;
	cursor: pointer;
}
.image-fullscreen:hover, .flex-full-screen:hover {
}
.entry-image.fullscreen .image-fullscreen:hover, .flexslider.flexslider-fullscreen .flex-full-screen:hover {
	background: transparent;
}
.featured-image-caption {
	font-style: italic;
	padding: 0.5em 3%;
	float: left;
	width: 94%;
	position: absolute;
	bottom: 0;
}
.image-entry-content {
	float: right;
	width: 27%;
}

.single-format-gallery .flexslider {
	margin-bottom: 2em;
}
.single-format-gallery .flexslider .slides {
	float: left;
	width: 70%;
	margin-right: 3%;
}
.flexslider.flexslider-fullscreen {
	margin: 0;
	height: 100% !important;
}
.flexslider.flexslider-fullscreen .flex-caption, .flexslider.flexslider-fullscreen .flexslider-grid {
	display: none;
}
.flexslider.flexslider-fullscreen .slides, .single-format-gallery .flexslider.flexslider-fullscreen .flex-direction-nav {
	width: auto;
}
.flexslider.flexslider-fullscreen .slides img {
	width: auto;
	max-height: 100%;
	margin: 0 auto;
}
.flexslider-fullscreen .slides:after {
	width: 100%;

 }
.flexslider-fullscreen, .flexslider-fullscreen .slides, .flexslider-fullscreen .slides li, .flexslider-fullscreen .slides li img {

	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;

	-webkit-box-pack: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
}
.flexslider-fullscreen .flex-direction-nav {
	position: static !important;
}
.single-format-gallery .flexslider .flexslider-grid {
	float: right;
	width: 27%;
	margin: 0;
	list-style: none;
	overflow-x: hidden;
	overflow-y: auto;
}
.single-format-gallery .flexslider .flexslider-grid li {
	margin-bottom: 8%;
	width: 25%;
	margin-right: 8%;
}
.single-format-gallery .flexslider .flexslider-grid li:hover {
	cursor: pointer;
	opacity: 0.8;
}
.single-format-gallery .flexslider .flexslider-grid li img {
	width: 100%;
	height: auto;
	float: left;
}
.single-format-gallery .flexslider .flex-direction-nav {
	width: 70%;
	position: absolute;
	top: 47%;
}

span.post-format-icon {
	position: absolute;
	left: 0;
	padding: 0.5em;
	top: 0;
	line-height: 1em;
	z-index: 2;
	display: none;
}
.blog-category span.post-format-icon, .portfolio-category span.post-format-icon, .blog-page span.post-format-icon {
	display: block;
}
.portfolio-category .entry-content {
	display: none;
}

.archive .portfolio-category article {
	margin-bottom: 2%;
}


/* Blog Section */
#blog-section article, #primary.blog-page-list article {
	float: left;
	width: 100%;
	margin: 0;
	text-align: left;
}
#primary.blog-page-list article {
	margin-bottom: 3em;
}
#blog-section .entry-image, #primary.blog-page-list .entry-image {
	float: left;
	width: 45%;
	margin-right: 5%;
	position: relative;
}

#blog-section .entry-image img, #primary.blog-page-list .entry-image img {
	width: 100%;
	height: auto;
}
#blog-section .entry-content, #primary.blog-page-list .entry-content {
	float: left;
	width: 50%;
	margin: 0;
	position:relative;
}

#blog-section .entry-title, #primary.blog-page-list .entry-title {
	text-transform: uppercase;
	font-size: 2.5em;
	margin: 0 0 0.5em 0;
}
#blog-section .entry-title a {
}
#blog-section .entry-title a:hover {
}
#blog-section .entry-meta, #primary.blog-page-list .entry-meta {
	margin-bottom: 1em;
}
/*******************************
COLUMN
*******************************/
#services-section article {
	width: 24%;
	padding: 4%;
	margin-bottom: 2%;
}
#services-section article:hover {
}
#services-section article .entry-image img {
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	filter: grayscale(100%);
}
#services-section article:hover .entry-image img {
	-webkit-filter: grayscale(0);
	-moz-filter: grayscale(0);
	filter: grayscale(0);
}
#services-section article:hover .entry-title a {
}
#services-section article p {
	margin-bottom: 0;
}
#work-section article:nth-of-type(3n+3), #services-section article:nth-of-type(3n+3) {
	margin-right: 0;
}

.fullwidth .article {
	display: inline-block;
	width: 100% !important;
	margin-left: 0 !important;
}
/* grid4 col */
.grid-4 article {
	float:left;
	width: 21%; /* 256px / 1024px */
	margin:0 5% 2% 0;
}
.grid-4 article:nth-of-type(4n) {
	margin:0 0 2% 0;
}
/* grid3 col */
.grid-3 .col {
	display: inline-block;
	width: 33.333333333333333%; /* 341.3333333px / 1024px */
}
/* grid2 col */
.grid-2 .col {
	display: inline-block;
	width: 50%; /* 512px / 1024px */
}
/* clear col */
.grid-4 article:nth-of-type(4n+1),
.grid-3 article:nth-of-type(3n+1),
.grid-2 article:nth-of-type(2n+1) {
}


/* Preloader */
#preloader {
	position: fixed;
	display: block;
	width: 100%;
	height: 100%;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: #FFF;
	z-index: 999;
}

#spinner {
	position: relative;
	height: 35px;
	width: 35px;
	top: 50%;
	margin-bottom: -12px;
	margin: 0 auto;
	border: 3px solid rgba(226, 226, 226, 0.75);
	border-radius: 100%;
	-webkit-animation: rotation .6s infinite linear;
	-moz-animation: rotation .6s infinite linear;
	-o-animation: rotation .6s infinite linear;
	animation: rotation .6s infinite linear;
}
#spinner:before {
	content: "";
	display: block;
	position: absolute;
	left: -3px;
	top: -3px;
	height: 100%;
	width: 100%;
	border-top: 3px solid rgba(0,0,0,1);
	border-left: 3px solid transparent;
	border-bottom: 3px solid transparent;
	border-right: 3px solid transparent;
	border-radius: 100%;
}
@-webkit-keyframes rotation {
   from {-webkit-transform: rotate(0deg);}
   to {-webkit-transform: rotate(359deg);}
}
@-moz-keyframes rotation {
   from {-moz-transform: rotate(0deg);}
   to {-moz-transform: rotate(359deg);}
}
@-o-keyframes rotation {
   from {-o-transform: rotate(0deg);}
   to {-o-transform: rotate(359deg);}
}
@keyframes rotation {
   from {transform: rotate(0deg);}
   to {transform: rotate(359deg);}
}

/* =Responsiveness: Readers
----------------------------------------------- */

@media screen and (max-width: 1500px) {
	.home #menu-wrap:before {
		width: 180%;
		height: 120%;
		margin: 0% 0 0;
	}

}


@media screen and (max-width: 800px) {
}

/* iPads （縦と横向き ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
	.home #menu-wrap:before {
		width: 200%;
		height: 120%;
	}
}


/* =Responsiveness: Tablet (Portrait)
================================================== */

/* Note: Design for a width of 768px */

@media only screen and (min-width: 768px) and (max-width: 959px) {

}


/* =Responsiveness: Mobile (Portrait)
================================================== */


/* =Responsiveness: Mobile (Landscape)
================================================== */

/* Note: Design for a width of 480px */

@media only screen and (max-width: 480px) {
}

@media only screen and (max-width: 380px) {
}

@media only screen and (max-width: 320px) {
}


/* Parallax effect for non touch sceen devices only */
	
	/* in view animations */
	body.non-touch-screen #testimonials-section article .entry-image {
		margin-right: -20%;
		opacity:0;
	}
	body.non-touch-screen #testimonials-section article.in-view .entry-image {
		opacity:1;
		margin-right:-3%;
		 transition: all 0.4s ease-in;
		-webkit-transition: all 0.4s ease-in;
		-moz-transition: all 0.4s ease-in;
		-o-transition: all 0.4s ease-in;
	 }

	body.non-touch-screen #testimonials-section article.in-view:nth-child(even) .entry-image {
		margin-left:-3%;
		opacity:1;
		transition: all 0.4s ease-in;
		-webkit-transition: all 0.4s ease-in;
		-moz-transition: all 0.4s ease-in;
		-o-transition: all 0.4s ease-in;
	 }

	body.non-touch-screen #testimonials-section article .post-meta {
		opacity:0;
	}
	body.non-touch-screen #testimonials-section article.in-view .post-meta {
		opacity:1;
		transition: all 0.4s ease-in;
		-webkit-transition: all 0.4s ease-in;
		-moz-transition: all 0.4s ease-in;
		-o-transition: all 0.4s ease-in;
	}
	body.non-touch-screen #blog-section .entry-image,
	body.non-touch-screen #primary.blog-page-list .entry-image {
		left:-100px;
	}
	body.non-touch-screen #blog-section .in-view .entry-image,
	body.non-touch-screen #primary.blog-page-list .in-view .entry-image {
		left:0;
		transition: left 0.3s ease-in;
		-webkit-transition: left 0.3s ease-in;
		-moz-transition: left 0.3s ease-in;
		-o-transition: left 0.3s ease-in;
	}
	body.non-touch-screen #blog-section .entry-content,
	body.non-touch-screen #primary.blog-page-list .entry-content {
		right:-150px;
	}
	body.non-touch-screen #blog-section .in-view .entry-content,
	body.non-touch-screen #primary.blog-page-list .in-view .entry-content {
		right:0;
		transition: right 0.2s ease-in;
		-webkit-transition: right 0.2s ease-in;
		-moz-transition: right 0.2s ease-in;
		-o-transition: right 0.2s ease-in;
	}

	body.non-touch-screen #testimonials-section article {
		opacity:0;
	}
	body.non-touch-screen #testimonials-section article.in-view {
		opacity:1;
		transition: all 0.3s ease-in;
		-webkit-transition: all 0.3s ease-in;
		-moz-transition: all 0.3s ease-in;
		-o-transition: all 0.3s ease-in;
	}

	body.non-touch-screen .in-view {
		transition: all 0.3s ease-in;
		-webkit-transition: all 0.3s ease-in;
		-moz-transition: all 0.3s ease-in;
		-o-transition: all 0.3s ease-in;
	}

	body.non-touch-screen.home article,
	body.non-touch-screen.archive article,
	body.non-touch-screen .blog-page article,
	body.non-touch-screen .action-button,
	body.non-touch-screen .team-page article {
		transition: all 0.3s ease-in;
		-webkit-transition: all 0.3s ease-in;
		-moz-transition: all 0.3s ease-in;
		-o-transition: all 0.3s ease-in;
		-moz-opacity: 0;
		opacity: 0;
		-moz-transform: scale(0.01);
		-webkit-transform: scale(0.01);
		-o-transform: scale(0.01);
		-ms-transform: scale(0.01);
		transform: scale(0.01);
	}
	body.non-touch-screen #primary.blog-page-list article,
	body.non-touch-screen #blog-section article {
		-moz-transform: scale(1);
		-webkit-transform: scale(1);
		-o-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}
	body.non-touch-screen article.in-view,
	body.non-touch-screen .action-button.in-view,
	body.non-touch-screen .team-page article.in-view {
		transition: all 0.3s ease-in;
		-webkit-transition: all 0.3s ease-in;
		-moz-transition: all 0.3s ease-in;
		-o-transition: all 0.3s ease-in;
		-moz-opacity: 1;
		opacity: 1;
		-moz-transform: scale(1);
		-webkit-transform: scale(1);
		-o-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}