@charset "UTF-8";



#menulist_type {
	display: block;
	margin-bottom: 70px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 70px;
}

#menulist_typeSp { display: none; }



/* ----------------------
   
   #menulist
   
   ---------------------- */
.menulist { 
		margin-right: auto;
		margin-left: auto;
         background:#fff; }
/* ----- .menuArea ----- */
.menulist .menuArea { margin: -40px -2% 0; font-size: 0; }


/* .menuBox */
.menulist .menuArea .menuBox {
	display: inline-block;
    *display: inline; *zoom: 1; 		
	width: 70%;
	margin: 40px 2% 0;
	text-align: left;
	position: relative;
	top: -4px;
	left: -1px;
}
.menulist .menuArea .menuBox h4.category { font-size: 13px; font-weight: 600; letter-spacing: .1em; line-height: 2; }

.menulist .menuArea .menuBox p { font-size: 13px; }
/* .categoryArea */
.menulist .menuArea .menuBox .categoryArea { text-align: center; border: #ededed 1px solid; border-bottom: none; padding: 20px 0; /*background: #f8f8f8;*/ }
.menulist .menuArea .menuBox .categoryArea h4.en { font-size: 18px; font-family: 'apercubold'; font-style: normal; letter-spacing: .1em; line-height: 1.7; text-transform: uppercase; }
.menulist .menuArea .menuBox .categoryArea h4.jp { font-size: 13px; font-weight: 700; letter-spacing: .1em; line-height: 1.7; }




/* .info table */
.menulist .menuArea .menuBox .info {
	margin: 0 0 10px;
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
	letter-spacing: .1em;
	line-height: 1.5;
	text-align: left;
	border: solid 1px #000000;
}
.menulist .menuArea .menuBox .info tr { 
    background: #fff; 
}
.menulist .menuArea .menuBox .info th {
	vertical-align: top;
	border: #fff 1px solid;
	font-size: 13px;
	padding-bottom: -1px;
	padding-left: 1px;
	padding-right: 5px;
	padding-top: -1px;
}
.menulist .menuArea .menuBox .info th b { 
    font-size: 12.5px; 
	font-weight: bold;
}
/*#menulist .menuArea .menuBox .info th span { display: block; font-size: .9em; }*/
.menulist .menuArea .menuBox .info td {
	font-weight: normal;
	border: #fff 1px solid;
	padding: 1px -1px;
	width: 750px;
	text-align: left;
}
.menulist .menuArea .menuBox .info td b { 
    font-size: 14px; 
	font-weight: normal; 
}
.menulist .link { 
    text-align: center; 
	}






.menulist span.circleMarkBlack,
.menulist span.circleMarkRed,
.menulist span.circleMarkGreen,
.menulist span.circleMarkBlue,
.menulist span.circleMarkYellow { margin-left:5px; display: inline-block; *display: inline; *zoom: 1; width:15px; height:15px; vertical-align: -2px;-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; }

.menulist span.circleMarkBlack { background:#222; }
.menulist span.circleMarkRed{ background:#db2626; }
.menulist span.circleMarkGreen{ background:#17aa17; }
.menulist span.circleMarkBlue{ background:#2b6abf; }
.menulist span.circleMarkYellow{ background:#e1e310; }




/* ************************************************************************************************

   @media screen and (max-width: 768px)

   ************************************************************************************************ */
	  	   	 
@media screen and (max-width: 768px) {
	
#page { height: auto; }

/* ----------------------
   
   #menulist
   
   ---------------------- */
   
.menulist { background:#fefefe; padding:40px 7.5%; }
/* ----- .menuArea ----- */
.menulist .menuArea { margin: -40px 0 0; }
/* .menuBox */
.menulist .menuArea .menuBox { width: 100%; margin: 40px 0 0; }
.menulist .menuArea .menuBox h4.category { font-size: 13px; font-weight: 600; letter-spacing: .1em; line-height: 2; }
.menulist .menuArea .menuBox p { font-size: 13px; }
/* .categoryArea */
.menulist .menuArea .menuBox .categoryArea { padding: 20px 0; background: #f8f8f8; }
.menulist .menuArea .menuBox .categoryArea h4.en { font-size: 18px; line-height: 1.5; }
.menulist .menuArea .menuBox .categoryArea h4.jp { font-size: 13px; line-height: 1.5; }
/* .info table */
.menulist .menuArea .menuBox .info { margin: 0 0 10px; width: 100%; border-collapse: collapse; font-size: 13px; letter-spacing: .1em; line-height: 1.8; text-align: left; border: solid 1px #000000; }
.menulist .menuArea .menuBox .info th { padding: 10px 5%; font-size: 12px; }
.menulist .menuArea .menuBox .info th b { font-size: 12px; }
.menulist .menuArea .menuBox .info td { padding: 10px 5%; }
.menulist .menuArea .menuBox .info td b { font-size: 12px; }

}


   











#main-area { /*TOPページのみ*/
	width: 100%;
	margin-bottom: 6em;
	padding-top: 0px !important;
}

.top-contents { /*コンテンツの区切り*/
	padding: 3em 0;
	background-color: #fff;
}
@media screen and (max-width: 480px) {
.top-contents {
	padding: 1.5em 0;
}
}

/*======================================================================*/

#firstview {
	width:100%;
	position:relative;
}
#firstview .firstview-logo {
	width:auto;
	height:120px;
	margin:-60px 0 0 -130px;
	position:absolute;
	top:50%;
	left:50%;
	opacity:0.8;
	display:none;
}
@media screen and (max-width: 480px) {
#firstview .firstview-logo {
	width:auto;
	height:60px;
	margin:-30px 0 0 -65px;
	position:absolute;
	top:50%;
	left:50%;
	opacity:0.8;
	display:none;
}
}

/*======================================================================*/


#btn-welcome {
	width:100%;
	background-color:#91837a;
	position:absolute;
	bottom:0;
	padding:25px 0;
	text-align:center;
	display:block;
	cursor:pointer;
	transition: opacity 300ms ease-out 0s;
	opacity:0.5;
}
#btn-welcome:hover {
	opacity:0.7;
}
#btn-welcome img {
	width:auto;
	height:10px;
}

/* 点滅 */
.blinking{
	-webkit-animation:blink 4s ease-in-out infinite alternate;
    -moz-animation:blink 4s ease-in-out infinite alternate;
    animation:blink 4s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0.5;}
	30% {opacity:0.5;}
	50% {opacity:1;}
	70% {opacity:0.5;}
    100% {opacity:0.5;}
}
@-moz-keyframes blink{
    0% {opacity:0.5;}
	30% {opacity:0.5;}
	50% {opacity:1;}
	70% {opacity:0.5;}
    100% {opacity:0.5;}
}
@keyframes blink{
    0% {opacity:0.5;}
	30% {opacity:0.5;}
	50% {opacity:1;}
	70% {opacity:0.5;}
    100% {opacity:0.5;}
}

/*======================================================================*/

.main-menu {
	margin-right: -2%;
	margin-bottom:3em;
    overflow: hidden;
}
.main-menu li {
	float: left;
    margin-right: 2%;
    width: 18%;
	text-align:center;
}
.main-menu li .buttun {
	display:table;
	width:100%;
	height:auto;
	text-decoration:none;
}
.main-menu li .buttun div {
	font-size:1.7em;
	display:table-cell;
	vertical-align:middle;
	border:solid 1px #f3f3f3;
	border-radius: 50%;
	background-color:#fff;
	transition: background-color 300ms ease-out 0s;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:contain;
	text-indent:-9999px;
}
.main-menu li .buttun div:hover {
	background-color:#f3f3f3;
}
.main-menu li .buttun div span.en {
	display:block;
	line-height:1em;
	margin-top:0.5em;
}
.main-menu li .buttun div span.ja {
	display:block;
	font-size:0.6em;
	line-height:1em;
	margin-top:0.5em;
}
.main-menu li .disc {
	margin-top:0.5em;
	line-height:1.4em;
}

.main-menu li .buttun div#concept {
	background-image:url(../img/btn-concept.png);	
}
.main-menu li .buttun div#howtoorder {
	background-image:url(../img/btn-howtoorder.png);	
}
.main-menu li .buttun div#materials {
	background-image:url(../img/btn-materials.png);	
}
.main-menu li .buttun div#maintenance {
	background-image:url(../img/btn-maintenance.png);	
}
.main-menu li .buttun div#onlinestore {
	background-image:url(../img/btn-onlinestore.png);	
}

@media screen and (max-width: 480px) {
.main-menu {
	margin-right: 0;
    overflow: hidden;
	text-align:left;
}
.main-menu li {
	float:inherit;
    margin:0 auto 0.5em;
    width: 100%;
	display:block;
	text-align:left;
}
.main-menu li .buttun div {
	font-size:1.2em;
	vertical-align:middle;
	border:solid 1px #f3f3f3;
	border-radius: 5px;
	padding:1.3em 1.3em 1.3em 2em;
	text-indent:inherit;
	background-image:url("../img/ico-bkarr.png") !important;
	background-repeat:no-repeat;
	background-position:center left;
	background-size:30px 30px;
}

.main-menu li .disc {
	display:none;
}
}

/*======================================================================*/

.contact-us p {
	line-height: 1.8em;
	text-align: center;
}

.contact-us .btn-bk-center {
	font-size:1.2em;
	line-height:1.8em;
	width:100%;
	max-width:400px;
}
.contact-us .btn-bk-center .btn-ico {
	background-image:url(../img/.png);
	background-position:left center;
	background-repeat:no-repeat;
	background-size:20x 20px;
	padding-left:2em;
}



.contact-us pl {
	line-height: 1.8em;
	text-align: left;
}


/*======================================================================*/

.works-post {
	margin-right: -2%;
    overflow: hidden;
}
.works-post li {
	float: left;
    margin-right: 2%;
	margin-bottom: 1em;
    width: 23%;
}
.works-post li a img {
	width:100%;
	height:auto;
}
.works-post li a {
	transition: opacity 300ms ease-out 0s;
}
.works-post li a:hover {
	opacity:0.7;
}
.works-post li p {
	margin-top:0.25em;
	line-height:1.2em;
}
@media screen and (max-width: 480px) {
.works-post {
	margin-right: -2%;
}
.works-post li {
    width: 48%;
}
}

/*======================================================================*/

.blog-post {
	border-top:dotted 1px #dfdfdf;
}
.blog-post li {
	padding:1em 0;
	line-height:1.4em;
	border-bottom:dotted 1px #ffffff;
}
.blog-post li a:link,
.blog-post li a:visited {
	text-decoration:none;
}
.blog-post li a:hover {
	text-decoration:underline;
}
.blog-post .date {
	display:block;
}

.border{
	border-top:dotted 1px #dfdfdf;
}




/*TOP店舗写真=======*/

.location {
	width:100%;
	overflow:hidden;
}
.location li {
	float:left;
	width:50%;
}
.location li:first-child .shop-img,
.location li:first-child .map {
	border-right:solid 1px #fff;
}
.location a:link.btn-bk-center,
.location a:visited.btn-bk-center {
	max-width:160px;
	margin:1em auto;
}
.shop-img{
	position: relative;
}
.shop-img .thumb {
	width:100%;
	height:auto;
}
.kanazawa .shop-img .logo {
	width:100%;
	height:100%;
	position:absolute;
	z-index:9;
	background-image:url(../img/);
	background-position:center center;
	background-repeat:no-repeat;
	background-size:25%;
	text-indent:-9999px;
}
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
  .kanazawa .shop-img .logo {
	background-image:url(../img/logo-kanazawa@2x.png);
	}
}
.kaga .shop-img .logo {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 9;
	background-image: url(../img/);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 50%;
	text-indent: -9999px;
	left: -314px;
	top: -2px;
}
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
  .kaga .shop-img .logo {
	background-image:url(../img/logo-kaga@2x.png);
	}
}



.map {
	height:10%;
	min-height:260px;
}
.shop-data {
	letter-spacing:0.05em;
	text-align:center;
}
.shop-data dt {
	font-size:1.6em;
	line-height:1.4em;
	
	margin:1em auto 0.5em;
}
.shop-data dd {
	line-height:1.8em;
}


@media screen and (max-width: 768px) {
	
.location {
	width:100%;
	overflow:hidden;
}
.location li {
　float:none;
	width:100%;
}
.location li:first-child .shop-img,
.location li:first-child .map {
	border-right:none;
}
.kanazawa {
	margin-bottom:2em;
}




}





@media screen and (max-width: 480px) {
	
.location {
	width:100%;
	overflow:hidden;
}
.location li {
	float:inherit;
	width:100%;
}
.location li:first-child .shop-img,
.location li:first-child .map {
	border-right:none;
}
.kanazawa {
	margin-bottom:2em;
}




}



/*======================================================================*/

.service-varie {
	margin-right: -3%;
    overflow: hidden;
}
.service-varie li {
	float: left;
    margin-right: 3%;
    width: 30.3333%;
	text-align:center;
	line-height:1.8em;
}
.service-varie h3 {
	font-size:1.2em;
}
.service-img {
	overflow: hidden;
    position: relative;
    width: 100%;
	height:100px;
	margin-bottom:0.5em;
}
.service-img .ttl {
	position:absolute;
	z-index:9;
	top:50%;
	left:50%;
	width:160px;
	height:40px;
	margin-top:-20px;
	margin-left:-80px;
}
.service-img .thumb {
	height: 100%;
    width: 100%;
}
/*サムネール マウスオーバーエフェクトの指定------------------------*/
.service-img .thumb {
  transition: 0.5s;
}
.service-img .thumb:hover {
  -moz-transform: scale(1.1,1.1);
  -webkit-transform: scale(1.1,1.1);
  -o-transform: scale(1.1,1.1);
  -ms-transform: scale(1.1,1.1);
  opacity:0.7;
}
@media screen and (max-width: 480px) {
.service-varie {
	margin-right: 0;
}
.service-varie li {
	float:inherit;
    margin-right: 0;
	margin-bottom: 1em;
    width: 100%;
}
.service-varie li p {
	text-align:left;
}
}

/*======================================================================*/
#tol {
	background-image:url(../img/bg-grunge.jpg);
	background-position:center 6em;
	background-repeat:repeat-x;
	background-size:cover;
	width:100%;
}

#tol .tol-header {
	width:100%;
	text-align:center;
}
.tol-header .h-tol {
	width:auto;
	max-height:90px;
}
.tol-header p {
	margin:2em auto;
	letter-spacing:0.05em;
}
.tol-post {
	margin-right: -3%;
    overflow: hidden;
}
.tol-post li {
	float: left;
    margin-right: 3%;
    width: 30.3333%;
	min-height:200px;
	text-align:center;
	background-color:none;
	border: solid 1px #aba891;
	box-sizing:border-box;
	background-image:url(../img/bg-code.png);
	background-position:center bottom;
	background-repeat:no-repeat;
	transition: background-color 300ms ease-out 0s;
}
.tol-post li:hover{
	background-color:rgba(255,255,255,0.5)
}
.tol-post li a:link,
.tol-post li a:visited {
	display:block;
	padding:3em 2em;
	text-decoration:none;
	
}

.tol-post li a .post-date {
	font-family:"Times New Roman", Times, serif;
	font-size:1.1em;
	line-height:1em;
}
.tol-post li a .post-ttl {
	font-size:1.3em;
	font-weight:normal;
	line-height:1.4em;
	padding:1em 0;
	margin-top:0.5em;
	background-image:url(../img/ico-book.png);
	background-position:center top;
	background-repeat:no-repeat;
	background-size:12px 10px;
}
.tol-post li a .post-body {
	font-size:1.1em;
	line-height:1.8em;
	text-align:left;
	margin-bottom:1em;
}
.tol-post li a .post-thumb {
	margin-bottom:1em;
}
.tol-post li a .post-thumb img {
	width:100%;
	height:auto;
}
@media screen and (max-width: 768px) {
.tol-post li a:link,
.tol-post li a:visited {
	padding:1.5em 1.5em 3em;
}
}
@media screen and (max-width: 480px) {
#tol {
	background-position:center 4em;
}
.tol-header .h-tol {
	max-height:60px;
}
.tol-post {
	margin-right: 0;
}
.tol-post li {
	float:inherit;
    margin-right: 0;
	margin-bottom:1.5em;
    width: 100%;
}
}
