/* Reset-----------------------------------------------------------*/

html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, address, big, code, em, font, img,  small, strong,
ol, ul, li, form, label, table,  tr, th, td, dl, dd, dt,
article, aside, footer, header, menu, nav, section, summary, textarea,main,
figure,figcaption
{margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;}
i{font-style:normal;}
.clx:after {clear: both;content: ' ';display: block;font-size: 0;line-height: 0;visibility: hidden;width: 0;height: 0;}
.clx { display: block; }
* html .clx { height: 1%; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
html {-webkit-text-size-adjust:none;-webkit-touch-callout: none;}
a {outline:none;text-decoration:none;}
iframe {border:none;}
ul, ol { list-style: none;}
img { border: none; vertical-align:bottom;max-width: 100%;height: auto;width /***/:auto;}
:focus { outline: 0;}
table { border-collapse: collapse;border-spacing:0;font-size:inherit;font:100%;}
h1, h2, h3, h4, h5, h6 {line-height:1.4;}
html {
	height: 100%;
}
body {
font: 14px/1.231 "Helvetica Neue","helvetica","���S�V�b�N��","Yu Gothic",YuGothic,"�q���M�m�p�S Pro W3","Hiragino Kaku Gothic Pro","Verdana",Meiryo,"�l�r �o�S�V�b�N","MS PGothic", sans-serif;
*font-size: small;
*font: x-small;
color:#3e3e40;
letter-spacing: 0.12em;
background:#FFF;
height: 100%;
}

/* common -----------------------------------------------------------*/
.parallax {-moz-transition: 0.5s ease-out;-o-transition: 0.5s ease-out;-webkit-transition: 0.5s ease-out;transition: 0.5s ease-out;}
a {color: #3e3e40;-moz-transition:0.2s;-o-transition:0.2s;-webkit-transition:0.2s;transition:0.2s;}
p {line-height: 1.6;}
i{letter-spacing: 0;}
.indent {display:block;	font-size:x-small;line-height:0;overflow:hidden;text-indent:-9999px}

.flt_l { float:left; }
.flt_r { float:right; }
.clear { clear:both; }

.flex {display: flex;}

.txt_al { text-align:left; }
.txt_ar { text-align:right; }
.txt_ac, .center{ text-align:center; }

/* font -------------------------------------*/
.ofont{	font-family: 'Oswald', "Helvetica Neue","helvetica","���S�V�b�N��","Yu Gothic",YuGothic,"�q���M�m�p�S Pro W3","Hiragino Kaku Gothic Pro","Verdana",Meiryo,"�l�r �o�S�V�b�N","MS PGothic", sans-serif;font-weight:300;letter-spacing: 0.2em;
}
.wfont, .link_box, .ov.new:before, .sort-link li{	font-family: 'Work Sans', "Helvetica Neue","helvetica","���S�V�b�N��","Yu Gothic",YuGothic,"�q���M�m�p�S Pro W3","Hiragino Kaku Gothic Pro","Verdana",Meiryo,"�l�r �o�S�V�b�N","MS PGothic", sans-serif;font-weight:500;letter-spacing: 0.1em;}
.jpfont {font-family: "Sawarabi Mincho", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho",serif;}

/* 20170922 kemi snapshot -------------------------------------*/
.link_box {
    margin-right: 10px;
    display: inline-block;
}
.link_box:last-child {
    margin-right: 0px;
}


/* layout -------------------------------------*/
#wrap{ width:100%; display:block;}
.inner{ width:1120px; margin:0 auto; position:relative;}

/* resp -------------------------------------*/
.pc{}
.sp{ display:none !important;}


/* #header -------------------------------------*/
#header { position:fixed; width:100%; z-index:9000;}

	#header .inner{width:100%; height:90px;}
	#header h1, #header h1 a{padding:2em;width:160px;height:35px;}
		#header h1 a{background:url(../img/logo.png)left top no-repeat;	background-size:160px 35px;}

		#header #nav {position:relative; position:absolute; right:2em; top:0; font-weight:600;}
		#header #nav li a, #header #nav li span{ color: #FFF;  height:90px; line-height:90px; display:block; font-weight:600;}

		#header #nav li ul{top:90px;}

/* #header.hs -------------------------------------*/
#header.hs { position:fixed; width:100%; z-index:9000;}

	#header.hs .inner{height:65px; background:#FFF; display:block;}
	#header.hs h1, #header.hs h1 a{ padding:1.2em 2em;width:130px;height:28px;}
		#header.hs h1 a{background:url(../img/logo02.png)left top no-repeat;background-size:130px 28px;}

		#header.hs #nav { position:relative; position:absolute; right:2em; top:0;}
		#header.hs #nav li a, #header.hs #nav li span{ color: #252526; height:65px; line-height:65px; display:block;}

		#header.hs #nav li ul{top:65px;}


/* #nav -------------------------------------*/
	#nav .dl-menu > li{ display:inline-block; margin:0 0 0 2em;letter-spacing: 0.2em; position:relative;}
	#nav li a:hover , #nav li span:hover{ color: #cc3d3d !important;}
	#nav li span{cursor:pointer;}
	#nav .dl-menu > li ul{ border-top:2px solid #cc3d3d;background:#252526; position:absolute; top:40px; left:0; display:none;}
		#nav .dl-menu > li ul li{ width:200px;font-size:86%;}
		#header #nav li ul li a, #header.hs #nav li ul li a{ padding:0 1em; height:40px;line-height:40px; color:#FFF;}


/* footer -------------------------------------*/
footer { text-align: center;background:#252526; padding:2em 0; }
	footer .copy {font-size:93%; color:#808080;}

#pagetop {position:fixed;z-index:1000;right:20px;bottom:20px;text-align:center;}
#pagetop a {background:#252526;	color:#FFF;	padding:1em;display:block;}

@media screen and (min-width: 641px) and (max-width: 1120px)  {

	#wrap{ width:1120px; display:block;}
	.inner{ width:1080px;}

}

@media screen and (max-width:640px) {
.parallax {-moz-transition: 0;-o-transition: 0;-webkit-transition: 0;transition: 0;}
body {font: 13px/1.231 "Helvetica Neue","helvetica","���S�V�b�N��","Yu Gothic",YuGothic,"�q���M�m�p�S Pro W3","Hiragino Kaku Gothic Pro","Verdana",Meiryo,"�l�r �o�S�V�b�N","MS PGothic", sans-serif;
overflow-x: hidden;}
.fade {position:fixed;width:100%;height:100%;z-index:-1;}
/* inner -------------------------------------*/
#wrap{ width:100%; display:block; overflow:hidden;}
.inner{ width:92%; margin:0 auto; position:relative;}

.pc{ display:none !important;}
.sp{ display:inline !important;}


#header, #header.hs { position:fixed; width:100%; z-index:9000;}

	#header .inner, #header.hs .inner{width:100%; height:50px; background:#FFF; display:block;box-shadow: 0 0 2px rgba(0,0,0,0.5);}

	#header h1, #header h1 a, #header.hs h1, #header.hs h1 a{ padding:1em; width:100px;height:22px;}
		#header h1 a, #header.hs h1 a{background:url(../img/logo02.png)left top no-repeat;	background-size:100px 22px;}


	.dl-menuwrapper button {width:50px;height:50px;background:none;font-size:140%;cursor:pointer;border:none;outline:0;padding:0; position:absolute; right:0; top:0;}

	.dl-menuwrapper .dl-menu {
		pointer-events:none;-webkit-transform:translateX(120%);-moz-transform:translateX(120%);transform:translateX(120%);-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden;
		margin:50px 0 0;position:absolute;width:100%;opacity:0;}

		.dl-menuwrapper .dl-menu.dl-menuopen {opacity:1;pointer-events:auto;-webkit-transform:translateX(30%);-moz-transform:translateX(30%);transform:translateX(30%);}


#nav li a:hover , #nav li span:hover{ color: #FFF !important;}

	#header #nav, #header.hs #nav{right:0; top:0; position:static;}
	#header #nav ul, #header.hs #nav ul{ right:0; top:0; background:#252526; height:100vh;padding:1em 0 35vh 2em; box-shadow: 0 2px 2px rgba(0,0,0,0.5); overflow-y:scroll;-webkit-overflow-scrolling: touch;box-sizing:border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;}

		#header #nav li, #header.hs #nav li{ display:block;margin:0; width:100%;border-bottom:1px solid #525252;}
		#header #nav li a, #header.hs #nav li a, #header #nav li span, #header.hs #nav li span{ color:#FFF; display:block; padding:0;height:50px; line-height:50px;}
		#header #nav li ul, #header.hs #nav li ul{ position:static;box-shadow: 0 0 0 rgba(0,0,0,0);height:auto; display:none; margin:0; padding:0; border:none;}
			#header #nav li ul li, #header.hs #nav li ul li{ border:none;}
			#header #nav li ul li a, #header.hs #nav li ul li a{color:#FFF; display:block; padding:0;height:50px; line-height:50px;}

		#header #nav li:hover ul, #header.hs #nav li:hover ul{ display:block;}

/* footer -------------------------------------*/
footer {padding:1em 0 2em; margin: 0 0 50px;}
	footer .copy {}

#pagetop {position:relative;top:0;left:0; width:100%;background:#252526;opacity:1 !important;}
#pagetop a {padding:1em 0 0;}

}



/* common -------------------------------------*/

main{text-align:center;}

small{font-size:79%;}
main h2{ margin:0 0 0.5em; color:#252526; font-size:320%;}
hr.hr{ border:none; border-bottom:2px solid #252526; width:3em; height:0;}
p{ padding:0 0 1.5em; line-height:180%;}


#infscr-loading{ display:block; width:100%; overflow:hidden;}
	#infscr-loading img{ width:150px;}

.link_box a{padding:0.8em 1.3em 0.8em 1.5em; display:inline-block; background:#252526;border:2px solid #252526; color:#FFF;letter-spacing: 0.2em; font-weight:600;}
.link_box.fm a{padding:0.8em 1.3em 0.8em 1.5em; display:inline-block; background:none;border:2px solid #252526; color:#252526;letter-spacing: 0.2em;}
.link_box.icon a{padding:0.8em 1em;}
	.link_box a:hover{background:#cc3d3d;border:2px solid #cc3d3d;}
	.link_box.fm a:hover{color:#FFF;}

@media screen and (max-width:640px) {
/* common -------------------------------------*/

main[role="main"] {text-align:center; padding:50px 0 0;}

small{font-size:79%;}
main h2{ margin:0 0 0.5em; color:#252526; font-size:200%;}
hr.hr{ border:none; border-bottom:2px solid #252526; width:2.5em; height:0;}
p{ padding:0 0 1.5em; line-height:180%;}


.link_box a{padding:0.8em 1.3em 0.8em 1.5em; display:inline-block; background:#252526;border:2px solid #252526; color:#FFF;letter-spacing: 0.2em;font-size:93%;}
.link_box.fm a{padding:0.8em 1.3em 0.8em 1.5em; display:inline-block; background:none;border:2px solid #252526; color:#252526;letter-spacing: 0.2em;}
.link_box.icon a{padding:0.8em 1em;}
	.link_box a:hover{background:#cc3d3d;border:2px solid #cc3d3d;}
	.link_box.fm a:hover{color:#FFF;}
}


/* #style-list -------------------------------------*/
#style-list{width:100%;position:relative;background:#fffaf7;  padding:6em 0;}

	#style-list .inner > div{ padding:1em 0;}

	#style-list .ov{-moz-transition:0.2s;-o-transition:0.2s;-webkit-transition:0.2s;transition:0.2s;
	margin:0 1% 2em; display:inline-block;position:relative;float:left; width:21.5%; padding:0 0;}
			#style-list .ov > div {position: absolute; top:0; left: 0; padding: 0; height: 100%; width: 100%;}
			#style-list .ov > div a{display: table; height: 100%; width: 100%; background-color:rgba(0, 0, 0, .5); opacity: 0; color:#FFF;}
			#style-list .ov > div a div{padding:0 1em;height: 100%; display:table-cell; vertical-align: middle;}
			#style-list .ov > div a:hover {opacity: 1;}

	#style-list .ov h3{ padding:0 0 1em;}
	#style-list .ov p{letter-spacing: 0.2em;font-size:86%;}

	#style-list .ov.new:before{ content:"NEW"; position:absolute; top:0.5em; left:0.5em; background:#cc3d3d;font-size:72%; padding:0.5em 0.7em; color:#FFF;}

/* #snapshot -------------------------------------*/
			#instafeed .ov div {position: absolute; top:0; left: 0; padding: 0; height: 100%; width: 100%;}
			#instafeed .ov div a{height: 100%; width: 100%; background:url(../img/mark01.png) center center no-repeat; background-color:rgba(0, 0, 0, .5); opacity: 0;}
			#instafeed .ov div a:hover {opacity: 1;}

@media screen and (max-width:640px) {
/* #style-list -------------------------------------*/
#style-list{padding:2.5em 0;}

	#style-list .inner > div{ padding:1em 0 0;}

	#style-list .ov{margin:0 2.5% 1.2em;width:44%;}
			#style-list .ov > div a:hover {opacity: 0;}

/* #snapshot -------------------------------------*/
			 #instafeed .ov div {position: absolute; top:0; left: 0; padding: 0; height: 100%; width: 100%;}
			 #instafeed .ov div a{}
			 #instafeed .ov div a:hover {opacity: 0;}
}


/* #no-ttl -------------------------------------*/
#no-ttl{ padding:9em 0 4em; background:#f2f2f5; margin:0 0 4em;}
	#no-ttl h2{ font-size:140%; font-weight:bold;}
		#no-ttl h2 span{ font-size:70%; font-weight:bold;}

/* #no-detail -------------------------------------*/
#no-detail{ padding:0 0 4em; height:600px;}

@media screen and (max-width:640px) {
/* #no-ttl -------------------------------------*/
#no-ttl{ padding:2em 0 2em;  margin:0 0 2em;}
	#no-ttl h2{ font-size:115%; font-weight:bold;}
#no-detail{ padding:0 0 4em; height:auto;}

#no-detail img{ width:50%;}

.link_box {
    margin-right: 0px;
    margin-bottom: 10px;
}
.link_box:last-child {
    margin-bottom: 0px;
}

}


/* ��\�� -------------------------------------*/

/*.rev_btn{ display:none !important;}*/