@charset "utf-8";
/*
Theme Name: usedliving/
Description: lifestyle webmagazine used living theme
Author: office MONARCH
*/


/* Let's default this puppy out
-------------------------------------------------------------------------------*/

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

article, aside, figure, footer, header, hgroup, nav, section {display: block;}



/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
   If this default setting for images is causing issues, you might want to replace it with a .responsive class instead. */
img, object, embed {max-width: 100%; height:auto;}



/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;}



/* we use a lot of ULs that aren't bulleted. 
	don't forget to restore the bullets within content. */
ul {list-style: none;}

blockquote, q {quotes: none;}

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

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

del {text-decoration: line-through;}

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



/* tables still need cellspacing="0" in the markup */
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

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

input, select {vertical-align: middle;}

pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}

select, input, textarea {font: 99% sans-serif;}

table {font-size: inherit; font: 100%;}
 


/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {outline: none;}

small {font-size: 85%;}

strong, th {font-weight: bold;}

td, td img {vertical-align: top;} 



/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}



/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}



/* hand cursor on clickable elements */
.clickable,
label, 
input[type=button], 
input[type=submit], 
button {cursor: pointer;}



/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}



/* make buttons play nice in IE */
button {width: auto; overflow: visible;}
 


/* scale images in IE7 more attractively */
.ie7 img {-ms-interpolation-mode: bicubic;}



/* prevent BG image flicker upon hover */
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}



/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  



/* youtube iframe */

.video-container,
.vvqbox,
.vvqyoutube {
width: 100%!important;
height: 100%!important;
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
}

.video-container iframe,
.video-container object,
.video-container embed,
.vvqbox iframe,
.vvqbox object,
.vvqbox embed,
.vvqyoutube iframe,
.vvqyoutube object,
.vvqyoutube embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.trans {
  -moz-transform: rotate(90deg);  /* FireFox */
  -o-transform: rotate(90deg);  /* Opera */
  -webkit-transform: rotate(90deg);  /* webkit */ 
  -ms-transform: rotate(90deg);  /* IE9 */
  transform: rotate(90deg);
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); /* IE5.5+ */
}



/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* new Linux- and Windows-friendly sans-serif font stack: http://mky.be/fontstack */
body {
	font: 13px Tahoma, Verdana,'Lucida Grande','Hiragino Kaku Gothic ProN',メイリオ, Meiryo, sans-serif;
	letter-spacing:1px; 
	line-height: 200%;
background: white;
}



/* using local fonts? make sure to read up on Paul Irish's 
	Bulletproof @font-face syntax: http://mky.be/font-face/bulletproof/ */



/* we like off-black for text */
body, select, input, textarea {color: #000;}

a {color: #000; text-decoration:none;}
a:hover {color:#CEC3A8;}
a.noneOutline{outline:none;}
a:focus, *:focus { outline:none; }


/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #fcd700; color: #fff; text-shadow: none;}
::selection {background: #f5f5f5; color: #f5f5f5; text-shadow: 1px 1px 1px black;} 



/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;} 

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}



/* HTML5 Reset end
-------------------------------------------------------------------------------*/

/*
Standard Classes
*/
strong{font-weight:bold}
.nomargin{margin:0!important}
.noborder{border:0!important}
.alignleft{text-align:left}
.aligncenter{text-align:center}
.alignright{text-align:right}
.clear, .clearboth{clear:both}
.clearleft{clear:left}
.clearright{clear:right}
img.alignleft,.floatleft{float:left;margin:0 10px 10px 0}
img.alignright,.floatright{float:right;margin:0 0 10px 10px}
.wp-caption{width:100%!important;}
.wp-caption-text{width: 100%; color: #999; font-size: 11px; margin-bottom: 15px; padding: 0;}
.gallery img{border:none!important; -moz-box-shadow: 2px 2px 12px rgba(0,0,0,0.1); -webkit-box-shadow: 2px 2px 12px rgba(0,0,0,0.1); box-shadow: 2px 2px 12px rgba(0,0,0,0.1); padding: 5px;}
#gallery-1 .gallery-item {float: left; margin: 20px 0; text-align: center; width: 33%;}
#gallery-1 .gallery-caption { display:none; }
img.mono{-webkit-filter: contrast(75%) brightness(100%) grayscale(0%) saturate(0%) hue-rotate(0deg) sepia(0%)  invert(0%) blur(0px);}
.error404{text-align:center;}
.vvqbox, .vvqbox object {max-width: 100%; height: 100%; margin:15px 0 25px 0!important; text-align:center;}



/* Customize
-------------------------------------------------------------------------------*/


/*
wrapper
------------------------------------------*/

#wrapper{
	visibility:hidden;
	width: 100%;
	max-width: 960px;
	margin: 10px auto;
	padding: 3px;
}

#fade {
	position:absolute; /* ie6 */
	position:fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
}



/*
header
------------------------------------------*/

#header{
	width: 100%;
	height: 140px;
	padding: 5px;
	z-index:10;
}

#masthead{
	width: 100%;
	margin: 0 auto;
	padding: 10px 0;
	position: fixed;
	top: 0;
	left: 0;
	text-align: center;
	background: #fff;
	z-index:1000;
}

nav{
height:30px;
position: relative;
overflow: hidden;
z-index:100;
}

nav ul{
position: relative;
left: 50%;
float: left;
}

nav ul li{
position: relative;
left: -50%;
margin-right: 30px;
float: left;
font-size: 13px;
letter-spacing:2px;
}

nav ul li:last-child {
margin-right: 0;
}

nav ul li a,
nav ul li a:link,
nav ul li a:active,
nav ul li a:visited{
color:#000;
}

nav ul li a:hover{
color:#000;
border-bottom:solid 1px #000;
}

.lifestylewebmagazine{
  position: fixed;
  top: 50%;
  left: 10px;
  margin-top: -121px;
}

ul.sns-icon{
	width:90px;
	position:absolute;
	top:15px;
	right:10px;
	z-index:100;
}

ul.sns-icon li{
	margin:0 5px;
	float:left;
}

ul.sns-icon li a:hover{
	border:none;
}

.logo{
	position:absolute;
	top:70px;
	left:50%;
	margin-left:-55px;
	z-index:1;
}



/*
main
------------------------------------------*/

#main{
	width:100%;
	max-width:960px;
	padding:3px;

}

#content{
	padding:0 0 0px 0;
}

#content.category{
	display: inline-block;
	width: 100%;
	padding:80px 0 150px 0;
}

#content.single,
#content.page{
	padding:50px 0 80px;
}

#content.single-mado{
	padding:0 0 5px;
}

.concept{
	width: 100%;
	margin: 0 auto;
	margin-bottom: 30px;
	padding-bottom: 30px;
	font-size: 14px;
	text-align: center;
	border-bottom: solid 1px #eee;
}

.concept img{
	margin-bottom:30px;
}

.concept .catch{
	font-size:20px;
	margin:0 0 30px 0;
}

.concept p{
	margin-bottom:20px;
}



/*
index slider
*/

.slide{
	position: absolute!important;
	left: 0;	
	margin-top:15px;
}

.leftNav{
	background: url(/img/arrow_prev.png) no-repeat;
	background-position: right center;
}

.rightNav{
	background: url(/img/arrow_next.png) no-repeat;
	background-position: left center;
}

#container.index{
	margin-top:400px;
}



/*
category list
------------------------------------------*/

section{
	padding:80px 0 100px;
}

.cat-name{
	width:300px;
	margin: 0 auto;
	margin-bottom: 50px;
	padding-bottom: 15px;
	font-size: 22px;
	font-weight: normal;
	letter-spacing: 12px;
	border-bottom: solid 1px #000;
	text-align: center;
}

article.post-list{
	clear: both;
	width: 100%;
	height: 300px;
	margin-bottom: 50px;
	text-align: left;
}

.middle{
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	width: 480px;
	height: 300px;
	overflow: hidden;
	float:left;
}

div#container.index .thumb div.middle img{
	width: auto;
	height: auto;
	max-width:none;
	min-height:300px;
}

div.overlay{
	height:100%;
	background: url(/img/overlay.png) repeat 0 0;
	background: none\9;
	position: relative;
	top: -55%;
	left: 0;
	padding-bottom: 35%;
	-webkit-transition: opacity .3s linear;
	-moz-transition: opacity .3s linear;
	-o-transition: opacity .3s linear;
	transition: opacity .3s linear;
	opacity: 0;
	filter: alpha(opacity=0);
}

div.overlay:hover {
	opacity: 1;
	filter: alpha(opacity=100);
}

p.read{
	margin-bottom:25px;
	text-align:center;
}

p.read a{
	color: #fff;
	font-size:16px;
	padding:5px 20px;
	background:#333;
}

p.read a:hover{
	color: #000;
	font-size:16px;
	padding:5px 20px;
	border:solid 1px #eee;
	background:#eee;
}

.overlay p.sns-fb{
	width: 160px;
	margin: 0 auto;
	text-align: center;
}

.overlay p.sns-tw{
	width: 110px;
	margin: 0 auto;
	text-align: center;
}



/*
thumbnail / overlay
--------------------------------------------------- */

.thumb{
	width: 480px;
	height: 300px;
	overflow: hidden;
	float:left;
	position: relative;
}

figure {
	height: 300px;
	position: relative;
	overflow: hidden;
	text-align:center;
	color:black;
}

figure div{
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}

figcaption {
width: 96%;
height: 94%;
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	background: url(/img/overlay.png) repeat center center;
	border: solid 10px #eee;
	-webkit-transition: .8s;
	transition: .8s;
	opacity: 0;
	z-index: 2;
}

figure:hover figcaption {
	opacity: 1;
}

figcaption .read{
	margin-top: -20px;
	position: relative;
	top: 50%;
	margin-bottom: 15px;
	text-align: center;
}

figcaption p {
	position: relative;
	top: 50%;
	font-size: 0.7rem;
	line-height: 150%;
	text-align: center;
}

figcaption p.sns-tw{
width: 100px;
margin: 0 auto;
}

figure p.read a,
figure p.read a:link,
figure p.read a:visited,
figure p.read a:active{
	color: white;
	font-size:16px;
	padding:5px 20px;
	border:solid 1px black;
	background:black;
	text-decoration:none;
}

figure p.read a:hover{
	color: black;
	font-size:16px;
	padding:5px 20px;
	border:solid 1px black;
	background:white;
	text-decoration:none;
}

/* --------------------------------------------------- */


.etxt{
	width: 100%;
	max-width: 465px;
	float: left;
	margin: 10px 0 10px 15px;
}

.date{
	font-size: 12px;
}

.category-mado .date,
.category-day .date{
	text-align:center;
}

.cat a,
.cat a:active,
.cat a:visited,
.cat a:link{
	font-size:12px;
	color:#CEC3A8;
	border:none;
}

.cat a:hover{
	font-size:12px;
	color:#999;
	border:none;
}

.title{
	font-size: 15px;
	font-weight: bold;
	margin: 15px 0;
}

.exce{
	margin-bottom:10px;
}

.more{
	width:auto;
	max-width:500px;
	margin:50px auto;
	padding:15px 0;
	background:#fff;
	border:solid 1px #000;
	text-align:center;
	font-size:14px;
}

.more:hover{
	width:auto;
	max-width:500px;
	margin:50px auto;
	padding:15px 0;
	color:#666;
	background:#eee;
	border:solid 1px #eee;
	font-size:14px;
}

.scroll-navi{
	width:200px;
	height:115px;
	margin:0 auto;
}

.up{
	width: 100px;
	height: 80px;
	background: url(/img/arrow_up.gif) no-repeat center 40px;
	margin:0 auto;
	text-align: center;
}

.wp-pagenavi,
#infscr-loading{
	margin:30px 0 100px 0;
	text-align:center;
}



/*
category day list,
category mado list
*/

.day article.post-list {
	clear:none;
	width: 100%;
	max-width: 280px;
	height: auto;
	margin: 25px 20px;
	float: left;
}

.mado article.post-list {
	clear:none;
	width: 100%;
	max-width: 280px;
	min-height: 330px;
	min-height: 350px\9;
	height: auto;
	margin: 25px 20px;
	float: left;
}

.day .thumb{
	width: 280px;
	height: 174px;
/*	padding: 30px 0;*/
	overflow: hidden;
	float: left;
}

.mado .thumb {
	width: 280px;
	height: 185px;
	padding: 0;
	overflow: hidden;
	float: left;
}

.day .title,
.mado .title {
	font-size: 40px;
	font-weight: bold;
	margin: 15px 0;
	text-align: center;
}

.day div.overlay{
	height: 100%;
	background: url(/img/overlay.png) repeat 0 0;
	background: none\9;
	position: relative;
	top: -65%;
	left: 0;
	padding-bottom: 65%;
	-webkit-transition: opacity .3s linear;
	-moz-transition: opacity .3s linear;
	-o-transition: opacity .3s linear;
	transition: opacity .3s linear;
	opacity: 0;
	filter: alpha(opacity=0);
}

.mado div.overlay {
	height: 100%;
	background: url(/img/overlay.png) repeat 0 0;
	background: none\9;
	position: relative;
	top: -70%;
	left: 0;
	padding-bottom: 60%;
	-webkit-transition: opacity .3s linear;
	-moz-transition: opacity .3s linear;
	-o-transition: opacity .3s linear;
	transition: opacity .3s linear;
	opacity: 0;
	filter: alpha(opacity=0);
}

.day div.overlay:hover,
.mado div.overlay:hover {
	opacity: 1;
	filter: alpha(opacity=10);
}

.day .etxt,
.mado .etxt {
	width: 100%;
	margin: 10px 0;
}



/*
people list(index)
------------------------------------------*/

ul.post-list li{
	width: 45%;
	min-height: 180px;
	margin: 2.5%;
	text-align: left;
	float: left;
}

ul.post-list .prof{
	width:150px;
	height:150px;
	float:left;
}

#people .prof-filter{
	position: relative;
	top: -158px;
	left: 0;
}

#people .etxt{
	width: 60%;
	max-width: 300px;
	float: left;
	margin: 0 0 10px 15px;
}

#people .author{
	font-size: 13px;
	font-weight: bold;
}

#people .title{
	font-size: 13px;
	font-weight: bold;
	margin:0;
}

#people .exce{
	font-size:12px;
	margin: 3px 0;
	line-height: 160%;
}




/*
tie up
------------------------------------------*/

article.tieuplist {
clear: none!important;
width: 100%!important;
max-width: 270px;
height: auto;
min-height: 450px;
margin: 25px 23px!important;
text-align:center;
line-height:180%;
float: left;
}

.tieup-bunner{
	margin-bottom:50px;
}

#wrapper.slider{
	width:100%;
	max-width:none;
	height:100%;
	max-height:none;
	margin: 0 0 10px 0;
	padding: 0 0 3px 0;
	overflow: hidden;
}

#wrapper.slider .sen{
	height:100%;
	max-height:1250px;
}

#wrapper.slider header{
	display:none;
}

#wrapper.slider #main{
	width:100%;
	max-width:none;
	padding:0;
}

#wrapper.slider #content.page{
	padding:0;
}

#wrapper.slider .page article {
	margin: 0 0 30px;
}

#wrapper.slider .page .etxt{
	width:100%;
	margin:0;
	padding:0;
	max-width:none;
	float:left;
}

#wrapper.slider #slider ul li{
	width: 100%;
	height: 100%;
	background:black;
	overflow: hidden;
	float: left;
	display: block;
	text-align: center;
}

#wrapper.slider #slider ul li img{
/*	width: auto;*/
	height: auto;
	margin:0 auto;
	text-align:center;
}

#wrapper.slider #carousel .flex-viewport{
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
}

#wrapper.slider #carousel ul li{
	height: auto;
	float: left;
	margin-right: 5px;
	display: block;
}

#wrapper.slider #carousel ul li img{
	width:100%;
	height:auto;
	margin:0;
	cursor:pointer;
}

#wrapper.slider .snslist{
	width: auto;
	padding: 20px 0 0;
	margin: 0;
	text-align: right;
	border-top: solid 1px #eee;
}

#wrapper.slider img.tieuplogo{
	width: 250px;
	position: absolute;
	left: 50%;
	margin-left: -125px;
}

#wrapper.slider img.windowclose{
	width:60px;
	margin-left:10px;
	float: left;
}

img.windowlogo{
	width: 60px;
	height: auto;
	position:relative;
	bottom:30px;
	left: 50%;
	margin-left: -30px!important;
}

.soon{
	width: 120px;
	height: auto;
	margin:-5px 5px 0 0;
	float: left;
}

img.pagedown{
	width: 60px!important;
	height: 60px!important;
	margin: 0 auto!important;
	margin-top: -120px!important;
	margin-bottom: 100px!important;
	z-index: 100;
}

#lean_overlay {
/*    position: fixed;*/
    z-index:0;
    top: 0px;
    left: 0px;
    height:100%;
    width:100%;
    background: #000;
    display: none;
}

div.exc{
	width: 40%;
	position: relative;
	top: -300px;
	left: 50%;
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-weight:bold;
	line-height: 200%;
	color: #fff;
	text-align: left;
}

div.exc a,
div.exc a:link,
div.exc a:active,
div.exc a:visited{
	color:#fff;
	font-size: 16px;
	padding: 0 3px;
	float:right;
}

div.exc a:hover{
	background:#000;
	padding: 0 3px;
}

#text {
	display:none;
	width: 800px;
	height:450px;
	overflow-y: scroll;
	position: relative;
	top: -100px;
	margin: 0 auto;
	margin-bottom: 50px;
	padding: 30px; 
	border-top: solid 1px #ccc;
	border-bottom: solid 1px #ccc;
	text-align: left;
}

#text p {
	color: #000;
	text-shadow: none;
}

.modal_close{
	display: block;
	width: 40px;
	height: 40px;
	background: url(/tieup/modal_close.png);
	z-index: 2;
	position: relative;
	left: 50%;
	margin-left: -20px;
}



/*
single post
------------------------------------------*/

.utility{
	clear:both;
	padding:10px 0;
	border-top:solid 1px #eee;
	text-align: center;
}

.single .snslist{
	width: 310px;
	padding: 10px 0 0 50px;
}

.single .date,
.single .cat,
.single .author,
.single .snslist{
	margin:0 auto;
	text-align:center;
	font-size: 12px;
}

.single-navi{
	width:100%;
	margin:5px auto;
	font-size:14px;
}

.pre{
	width:100px;
	text-align:left;
	float:left;
}

.nex{
	width:100px;
	text-align:right;
	float:right;
}

.page-navi{
	text-align: right;
	font-size: 14px;
	letter-spacing: 2px;
}

.page-link{
	margin: 50px auto;
	color:#000;
	text-align: center;
	font-size: 18px;
	letter-spacing: 5px;
}

.page-navi a,
.page-link a{
	padding:3px 5px;
	color:#CEC3A8;
}

.page-navi a:hover,
.page-link a:hover{
	padding:3px 5px;
	color:#000;
}

.post img{
	margin:10px 0;
}



/*
topic
*/

.single-topic .title{
	width:100%;
	margin: 0 auto;
	margin-bottom: 15px;
	padding-bottom: 15px;
	font-size: 20px;
	font-weight: normal;
	letter-spacing: 8px;
	border-bottom: solid 1px #000;
	text-align: center;
}

.single-topic article{
	clear: both;
	display: inline-block;
	width: 100%;
	margin:30px 0 0;
	padding-bottom:40px;
}

.single-topic .thumb{
	width: 100%;
	max-width:480px;
	height: auto;
	float:left;
}

.single-topic .thumb img{
width: 100%;
height: auto;
}

.stop-parent{
	position: relative;
	width: 480px;
	height: 1500px;
	background:none;
	float: left;
}

.stop{
	position: absolute;
	top:0;
}

.single-topic .etxt{
	width: 100%;
	max-width: 465px;
	float: right;
	margin: 10px 0 10px 15px;
  font-size: 0.9rem;
}

.single-topic .etxt img{
	width:auto;
	max-width:465px;
	height:auto;
	margin:5px 0;
}

.single-topic .cat a,
.single-topic .cat a:active,
.single-topic .cat a:visited,
.single-topic .cat a:link{
	text-align:center;
	color:#CEC3A8;
	border:none;
}

.single-topic .cat a:hover{
	text-align:center;
	color:#999;
	border:none;
}



/*
collect & mado
*/

.single-collect .title{
	width:100%;
	margin: 0 auto;
	margin-bottom: 15px;
	padding-bottom: 15px;
	font-size: 20px;
	font-weight: normal;
	letter-spacing: 8px;
	border-bottom: solid 1px #000;
	text-align: center;
}

.single-cpllect article,
.single-mado article{
	clear: both;
	display: inline-block;
	width: 100%;
	margin:30px 0;
}

.single-collect .thumb{
	width: 100%;
	height: auto;
}

.single-collect .thumb img{
width: 100%;
height: auto;
}

.single-collect .etxt,
.single-mado .etxt{
	width: 100%;
	max-width:950px;
	height:auto;
	margin: 10px auto;
	padding:0 5px;
  font-size: 0.9rem;
}

.single-collect .etxt img{
	width:auto;
	height:auto;
	margin:5px auto;
	text-align:center;
}

.single-collect .cat a,
.single-collect .cat a:active,
.single-collect .cat a:visited,
.single-collect .cat a:link,
.single-mado .cat a,
.single-mado .cat a:active,
.single-mado .cat a:visited,
.single-mado .cat a:link{
	text-align:center;
	color:#CEC3A8;
	border:none;
}

.single-collect .cat a:hover,
.single-mado .cat a:hover{
	text-align:center;
	color:#999;
	border:none;
}

.single-collect .utility,
.single-mado .utility{
	clear:both;
	padding:10px 0;
	border-top:solid 1px #eee;
}

.copy{
	width:100%;
	margin:15px 0;
	padding:10px;
	text-align:center;
	font-size:24px;
	letter-spacing:3px;
}

.read{
	margin:10px 0;
}

.film{
margin-bottom: 30px;
}

.client{
	margin: 30px 0 0;
	padding: 30px;
	line-height: 200%;
	letter-spacing: 1px;
	border-top: dashed 1px #999;
}

.postscript{
	margin-bottom: 30px;
	padding: 30px;
	background: #f0f0f0;
}

.single-collect .gallery{
	margin:20px auto;
}

.edit{
	width:;
	margin-bottom:30px;
	padding:15px 40px;
	border:solid 1px #999;
	text-align:center;
}



/*
観光とローカルの間
*/

.single-between .slide  ul li img{
	margin-top:-160px;
}
.single-between .slide ul li img.first{
	margin:0;
}

.single-between article{
display: inline-block;
position: relative;
margin-top: 450px;
}

.googlemap {
width: 100%;
height: 400px;
/*position: absolute!important;*/
/*left: 0;*/
/*margin-top: 440px;*/
/*overflow: hidden;*/
}

.accessmap{
margin-bottom: 30px;
padding-bottom: 30px;
border-bottom: dashed 1px #999;
}

.acf-map {
width: 100%;
height: 400px;
}

#map_canvas{
width:960px;
height:400px;
}

#map_canvas img{
max-width:none;
}



/*
mado
*/

.madopre a{
width:45px;
height:45px;
background:url(/img/arrowprev.gif) no-repeat center center;
float:left;
margin-right:74px;
text-indent:1000%;
white-space:nowrap;
}

.madolist a{
width:45px;
height:45px;
background:url(/img/arrowlist.gif) no-repeat center center;
float:left;
margin-right:74px;
text-indent:1000%;
white-space:nowrap;
}

li.madolist-ie{
display:none\9;
}

.madonex a{
width:45px;
height:45px;
background:url(/img/arrownext.gif) no-repeat center center;
float:left;
margin-right:0;
text-indent:1000%;
white-space:nowrap;
}

.down{
	width: 45px;
	height: 40px;
	position: relative;
	bottom: 125px;
	left: 50%;
	margin-left: -23px!important;
}

.vol{
	margin-bottom:50px;
	font-size:70px;
}

.single-mado .title{
	width:90%;
	margin: 0 auto;
	margin-bottom: 15px;
	padding-bottom: 15px;
	font-size: 20px;
	font-weight: normal;
	letter-spacing: 4px;
	line-height: 180%;
	text-align: center;
}

.single-mado .title span{
	font-size:16px;
}

.single-mado .etxt {
	width: 100%;
	max-width: 950px;
	height: auto;
	margin: 10px auto;
	padding: 3% 0 0;
	line-height: 200%;
	letter-spacing: 1px;
	float:none;
}

.shopdate{
	position: relative;
	width:30%;
	height: 2500px;
	margin: 0;
	padding-right: 5%;
	color: #990000;
	border-right: solid 1px #eee;
	float:left;
}

.single-mado .date,
.single-mado .cat{
	text-align:left;
	font-size: 12px;
}

.writing{
	width:60%;
	margin: 0;
	padding: 0;
	float:right;	
}

.flex-direction-nav a.flex-prev {
	display: block;
	background: url(/img/arrow_prev.png) no-repeat center;
	width: 50px;
	height: 70px;
	position: absolute;
	margin-top: -360px;
	left:10%;
	padding: 0;
	z-index: 1000;
	overflow: hidden;
	opacity: 1;
	cursor: pointer;
	text-indent:100%;
white-space:nowrap;
overflow:hidden;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	transition: all .3s ease;
}

.flex-direction-nav a.flex-next {
	display: block;
	background: url(/img/arrow_next.png) no-repeat center;
	width: 50px;
	height: 70px;
	position: absolute;
	margin-top: -360px;
	right:10%;
	padding: 0;
	z-index: 1000;
	overflow: hidden;
	opacity: 1;
	cursor: pointer;
	text-indent:100%;
white-space:nowrap;
overflow:hidden;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	transition: all .3s ease;
}

#wrapper.slider img.windowclose {
width: 60px;
margin-left: 10px;
float:none;
}

.madoprof{
clear: both;
display: inline-block;
width: 80%;
padding: 0 10%;
margin-bottom: 30px;
padding-bottom: 30px;
border-bottom: solid 1px #eee;
}

.madoprof img{
width: 200px;
margin: 0;
float:left;
}

.madoprof p{
width: auto;
margin-left: 30px;
font-size: 12px;
line-height: 200%;
float: left;
}

.madoprof p.profinfo{
margin: 30px 0 0;
width: 100%;
}




/*
day
*/

.single-day h3{
	margin:30px 0;
	font-weight:normal;
	font-size:20px;
}

.day-month,
.day-title{
	margin:0 0  30px;
	text-align: center;
	font-size: 180%;
	letter-spacing: 10px;
}

ul.day-list{
	display: inline-block;
	width: 100%;
	margin: 50px auto;
}

ul.day-list li{
	width: 90%;
	margin-bottom: 100px;
	padding: 3%;
	border: solid 15px #f9f9f9;
}

div.thumb div.eyecatch{
/*	margin-top:-60px;*/
}

p.name{
	font-size: 36px;
	font-weight: bold;
	margin: 14px 0 30px 0;
	text-align: center;
	letter-spacing: 8px;
}

.day-image{
	width:30%;
	margin:1%!important;
}

div.question{
	margin:0 0 20px 0;
}

div.question div{
	border-bottom: dashed 1px #999;
	margin-bottom: 10px;
	padding-bottom: 10px;
}

dl.detail{
	display:inline-block;
	width:100%;
}

dl.detail.clear dt{
	clear:both;
	width: 50%;
	float: left;
}

dl.detail.clear dd{
	width: 45%;
	float: left;
	margin-left: 5%;
}

dl.detail p{
	border-bottom: dashed 1px #999;
	margin-bottom: 10px;
	padding-bottom: 10px;
}

dl.detail img.prof,
dl.detail img.watch{
	width: 150px;
	height: auto;
}

#day-archive{
	margin-bottom:50px;
}

#day-archive li{
	list-style:none;
}

#day-archive .widget-title{
	width:100%;
	margin:0 auto;
	margin-bottom:30px;
	text-align:center;
	font-size:30px;
	font-weight:normal;	
}

#day-archive .list{
	width: 100%;
	max-width: 280px;
	margin: 0 20px 40px;
	float: left;
}

#day-archive .eyecatch{
	width:100%;
	height:auto;
	max-width:280px;
	max-height:105px;
	overflow:hidden;
}

#day-archive .eyecatch img{
	width:100%;
	height:auto;
	margin-top:-35px;
}

.archive-month{
	margin: 10px;
	text-align: center;
	font-size: 28px;
	letter-spacing: 2px;
}

.archive-title{
	margin: 5px 0;
	padding-top: 10px;
	text-align: center;
	font-size: 13px;
	font-weight:bold;
	letter-spacing: 1px;
	border-top: solid 1px #eee;
}

.madolisttitle{
	line-height:150%;
}



/*
cutomfield
------------------------------------------*/

.fieldtitle{
	font-size: 16px;
	font-weight:bold;
	margin-bottom:30px;
	padding-bottom:30px;
	border-bottom:dashed 1px #000;
}

.fieldgaiyou{
	margin:50px 0;
	border-top:dashed 1px #000;
}



/*
page
------------------------------------------*/

.page .title{
	width:100%;
	max-width:300px;
	margin: 0 auto;
	margin-bottom: 15px;
	padding-bottom: 15px;
	font-size: 20px;
	font-weight: normal;
	letter-spacing: 8px;
	border-bottom: solid 1px #000;
	text-align: center;
}

.page article{
	clear: both;
	display: inline-block;
	width: 100%;
	margin:30px 0;
}

.page .etxt{
	width: 100%;
	max-width:950px;
	height:auto;
	margin: 10px auto;
	padding:0 5px;
}

.page .etxt img{
	width:auto;
	height:auto;
	margin:5px auto;
	text-align:center;
}

.page .date,{
	margin:0 auto;
	text-align:center;
	font-size: 12px;
}

.page .utility{
	clear:both;
	padding:10px 0;
	border-top:solid 1px #eee;
}



/*
us
*/

.team-prof{
	width: 100%;
	max-width: 280px;
	margin: 25px 18px 50px 18px;
	text-align:center;
	float: left;
}

li.social{
	margin:0 43px;
	float:left;
	text-align:center;
}



/*
people
*/

li.people-prof{
	width: 100%;
	max-width: 240px;
	height: 480px;
	margin: 30px 18px;
	padding: 20px;
	text-align: center;
	float: left;
}

li.people-prof .prof{
	height:210px;
}

.prof-filter{
	position: relative;
	top: -218px;
	left: 0;
}

.people .author {
	margin:10px 0 15px;
	padding-bottom: 10px;
	font-size: 16px;
	font-weight: normal;
	border-bottom: dotted 1px #999;
}

.people .date{
	font-size: 12px;
	line-height: 150%;
}

.people .title{
	margin:10px 0 15px;
	padding-bottom: 10px;
	font-weight: bold;
	font-size: 12px;
	letter-spacing: 2px;
	border-bottom: dotted 1px #999;
}

.people .exce {
	margin-bottom: 10px;
	padding-bottom: 10px;
	font-size: 12px;
	font-weight: normal;
	border-bottom: dotted 1px #999;
}



/*
camera
*/

div#instafeed{
display: inline-block;
margin:50px 0;
}

.instalist{
max-width: 250px;
height: auto;
overflow: hidden;
float: left;
margin: 0 33px 50px;
}

.instaoverlay{
	height:100%;
	background: url(/img/overlay.png) repeat 0 0;
	background: none\9;
	position: relative;
	-webkit-transition: opacity .3s linear;
	-moz-transition: opacity .3s linear;
	-o-transition: opacity .3s linear;
	transition: opacity .3s linear;
	opacity: 0;
	filter: alpha(opacity=0);
}

.instaoverlay:hover {
	opacity: 1;
	filter: alpha(opacity=100);
}

img.instauser{
margin: 0!important;
}

.instameta{
}

.instameta-item.heart{
width: 35px;
height: 30px;
padding: 2px 0 0 35px;
float: left;
background:url(/img/heart.gif) no-repeat left center;
font-size: 0.8rem;
}

.instameta-item.bubble{
width: 35px;
height: 30px;
padding: 2px 0 0 35px;
float: left;
background:url(/img/bubble.gif) no-repeat left center;
font-size: 0.8rem;
}

.instameta-item.owner{
width: 30px;
height:30px;
float: right;
text-align: center;
}

.instaowner{
max-width: 30px;
max-height: 30px;
margin: 0!important;
}


.instagram-placeholder{
width: 200px;
height: 200px;
margin: 18px;
padding: 0;
float: left;
}

.instagram-placeholder img.instagram-image{
width: 200px;
max-width:200px;
height: 200px;
margin:0!important;
}



/*
policy
*/

p a.browser img {
	margin: 0 0 -3px 0!important;
}



/*
form
------------------------------------------*/

.wpcf7 p{
	clear:both;
}

.formbox{
	width:50%;
	min-width:280px;
	font-size:14px;
	letter-spacing:1px;
	margin-bottom: 15px;
	padding: 3px 5px;
	border: none;
	background: #f0f0f0;
}


/*
footer
------------------------------------------*/

#footer-menu{
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
	position:relative;
	bottom:20px;
	text-align: center;
	list-style:none;
}

#menu-footer-menu{
	width: 220px;
	margin: 0 auto;
	text-align: center;
	list-style: none;
}

ul#menu-footer-menu li{
	margin:0 10px;
	float:left;
}

.footer-sns{
	width: 355px;
	width: 370px\9;
	height: 25px;
	margin: 0 auto;
	margin-bottom:45px;
	position: relative;
}

.footer-sns .sns-fb{
	float:left;
}
.footer-sns .sns-tw{
	float:right;
}

.copyright{
	width:100%;
	color:#eee;
	position:fixed;
	bottom:5px;
	text-align:center;
}

.day-logo{
	position:absolute;
	top:70px;
	right:10px;
}

.miru-logo{
	position:relative;
	bottom:50px;
	left:0;
}

div#topcontrol div{
width: 30px;
height: 30px;
position: fixed;
bottom: 30px;
right: 30px;
background: url(/image/pagetop.svg) no-repeat center center;
background-size: 30px 30px;
text-indent:100%;
white-space:nowrap;
overflow:hidden;
z-index:1000;
}

div#topcontrol div:hover{
-webkit-transition: -webkit-transform 0.s;
-webkit-transition: transform 0s;
transition: transform 0s;
-webkit-animation: fuwafuwa 0.8s linear 0s infinite;
animation: fuwafuwa 0.8s linear 0s infinite;
}

@-webkit-keyframes fuwafuwa {
to {
-webkit-transform: translate(0px, 0px);
transform: translate(0px, 0px);
}
50% {
-webkit-transform: translate(0px, -15px);
transform: translate(0px, -15px);
}
}
@keyframes fuwafuwa {
to {
-webkit-transform: translate(0px, 0px);
transform: translate(0px, 0px);
}
50% {
-webkit-transform: translate(0px, -15px);
transform: translate(0px, -15px);
}
}



/*
Google Map
------------------------------------------*/

/* class */
.w100p {
	width:100%;
}
.cf:after { content:"."; display:block; clear:both; visibility:hidden; line-height:0; height:0; }
.cf { display:inline-block; }
html[xmlns] .cf { display:block; }
* html .cf { height:1%; }
.size {
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	-o-box-sizing:border-box;
}
.shadow {
	box-shadow:1px 1px 2px #888;
	-webkit-box-shadow:1px 1px 2px #888;
	-moz-box-shadow:1px 1px 2px #888;
	-ms-box-shadow:1px 1px 2px #888;
	-o-box-shadow:1px 1px 2px #888;
}
/* map_canvas */
#map_canvas { width:auto;}
#showappendix #map_canvas { display:none; }
#content.category #map_canvas {
	width: 100%;
	max-width: 450px;
	min-height: 210px;
	position: relative;
	bottom: 0;
	left: 0;
	float: left;
}
#zoomlevel span { font-weight:bold; font-size:120%; }
#res { color:red; }
/* infowindow */
dl#infowin1 { margin:0; padding:0; }
dl#infowin1 dt { margin:0; padding:0; font-weight:bold; }
dl#infowin1 dd { margin:5px 0 0 0; padding:0; line-height:1.5; }
dl#infowin1 dd img { padding:2px; background:#fff; border:1px solid #ccc; margin-right:5px;}

dl#infowin2 { margin:0; padding:0; }
dl#infowin2 dt { margin:0; padding:0; font-weight:bold; }
dl#infowin2 dd { margin:5px 0 0 0; padding:0; line-height:1.5; }
dl#infowin2 dd img { padding:2px; background:#fff; border:1px solid #ccc; margin-right:5px;}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
	#map_canvas { width:80%; height:100%; }
}
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
#map_canvas { width:80%; height:100%; }
	textarea#res { width:100%; }
}

/* map */
#map {
	width:100%; height:100%; margin:0; padding:0;
}
/* infowindow */
.infowin {
	font-size:11px;
	overflow:visible;
	line-height:1;
}
.infowin p {
	margin:5px 0; padding:0;
}
.infowin .picframe {
	overflow:hidden;
	text-align:center;
}
.infowin .picframe img {
	border:2px solid #fff;
	overflow:hidden;
	margin:5px;
}
.infowin .ttl {
	width:96%;
	overflow:hidden;
}
.infowin .ttl b {
	font-size:130%;
	overflow:hidden;
}
.infowin .ttl img {
	margin-right:10px;
	width:16px; height:16px;
	float:left;
	overflow:hidden;
}
.infowin ul {
	margin:0; padding:0;
	list-style:none;
}
.infowin li {
	margin:0; padding:0;
	list-style:none;
}
.infowin table {
	margin:5px 0; padding:0;
	border:1px solid #ccc;
	border-collapse:collapse;
	width:100%;
}
.infowin th {
	margin:0; padding:0;
	border:1px solid #ccc;
	width:6em;
	white-space:nowrap;
	text-align:center;
}
.infowin td {
	margin:0; padding:0 0 0 1em;
	border:1px solid #ccc;
	text-align:left;
}
.infowin th span {
	display:block;
	font-weight:normal;
}
.infowin .comment {
	margin:5px 0; padding:0;
	height:100px;
	background:#eee;
	overflow:auto;
}
/* panowin */
.panowin {
	font-size:11px;
	overflow:visible;
	line-height:1;
	margin:0; padding:0;
}
.panowin .thumb {
	text-align:center;
}
.panowin .thumb img {
	border:2px solid #fff;
}
.panowin p {
	margin:5px 0 0 0; padding:0;
}
/* custom infowindow */
.customwin {
	border:1px solid #a0a0a4;
	line-height:1;
	margin:0; padding:0;
	padding:5px;
	background:#fff;
	margin-bottom:33px;
	margin-top:33px;
	font-size:11px;
}
.customwin a {
	color:#666;
}
.customwin .logo {
	width:119px; height:25px;
}
.customwin .author {
	margin:0; padding:0;
}
.customwin .thumb {
	margin:0 auto 5px auto; padding:0;
	width:100%;
}
.customwin .thumb img {
	display:block;
	width:100%;
}


pre {
	overflow:auto;
}



/*
other
---------------------------------------------------------*/

/*
light box
*/

#imageDataContainer {
width: 100%!important;
font: 1rem Verdana,Helvetica,sans-serif;
color:white;
background: none!important;
margin: 0 auto;
line-height: 1.4em;
}

#controls {
white-space: nowrap;
font-size: 0.7rem!important;
}

#outerImageContainer {
position: relative;
background: none!important;
width: 250px;
height: 250px;
margin: 0 auto;
}

#jqlb_closelabel {
width: 60px!important;
height: 60px!important;
background: url('/img/close.png') no-repeat center center!important;
position: fixed;
top: 20px;
right: 20px;
z-index: 10;
}

#nextLink:hover, #nextLink:visited:hover {
background: url('/img/arrow_next.png') no-repeat right center!important;
}

#prevLink:hover, #prevLink:visited:hover {
background: url('/img/arrow_prev.png') no-repeat left center!important;
}

#imageData #imageDetails {
width: 100%!important;
float: none!important;
text-align:center!important;
}

#imageData #caption {
font: 0.9rem normal!important;
line-height: 1.2rem!important;
}

#imageData #numberDisplay {
display:none!important;
}

#imageContainer {
padding: 0!important;
}