﻿@charset "utf-8";

body {
	background-color:#FFF;
	color:#000;
}

body {
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}


#pagetop {
	margin:0px;
	padding:0px;
	width:0px;
	height:0px;
}
/*-----------------------header---------------------------*/

#crnav {
	display: block;
}
#crnav-head {
	width:100%;
	position:absolute;
	top:0px;
	right:0px;
	z-index:102;
	height:100px;
}
#crnav-head .logo {
	text-align:center;
	margin:5px auto;
	width:70%;
	max-width:180px
}
#crnav-open {
	width:80px;
	height:100px;
	margin:0px 0px;
	background-color:#002766;
	padding:17.5px 15px;
	position:fixed;
	top:0px;
	right:0px;
	cursor: pointer
}
#crnav-body {
	position:fixed;
	top:100px;
	z-index:103;
	background-color:#002766;
	width:100%;
	padding:30px;
	display:none;
}
#crnav-body ul {
	list-style-type: none;
}
#crnav-body ul li {
	font-size:2.5rem;
	color:#FFF;
	padding:5px;
}
#crnav-body ul li ul li {
	border-bottom:#FFF 1px dashed;
}
#crnav-body ul li ul li.crna_shop_line {
	border-bottom:none;
}
#crnav-body ul li a {
	color:#000;
	line-height: 200%;
	text-decoration: none;
	color:#FFF;
	display:block;
	width:100%;
}




@media (min-width: 45rem) {

#crnav-head {
	height:120px;
}

#crnav-head .logo {
	text-align:center;
	margin:10px auto;
	max-width:220px
}

#crnav-open {
	width:120px;
	height:120px;
	padding:20px ;
	position:fixed;
	top:0px;
	right:50px;
}
#crnav-body {
	position:fixed;
	top:120px;
	right:50px;
	z-index:103;
	width:400px;
	padding:30px;
	display:none;
}

}
 @media (min-width: 60rem) {
}
/*-----------------------header---------------------------*/


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

footer .ordermade {
	background-attachment: fixed;
	background-image: url(../img/footer_workshopimg.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size:cover;
	padding:50px 0px;
}
footer .ordermade .text1 {
	background-color:#FFF;
	padding:20px;
	text-align:center;
	margin:50px 20px;
	font-weight:bold;
	font-size: 2.5rem;
	color:#002666;

	}
footer .ordermade .workshop_ordermade_link {
	float:right;}
footer .ordermade .workshop_ordermade_link a {
	background-color:#002766;
	display:block;
	padding:15px;
	color:#FFF;
	width:13em;
	font-size: 2rem;
}
footer .googlemap {
	margin:0px;
	padding:0px;
	font-size:0;}
footer .googlemap iframe {
	width:100%;}
footer .bizenyainfo {
	background-color:#002766;
	color:#FFF;
	padding:20px;}
footer .bizenyainfo .address .logo {
	width:200px;
	text-align:center;
	margin:10px auto;}

 @media (min-width: 45rem) {
footer .ordermade {
	padding:150px 0px 50px 0px;
}
footer .ordermade .text1 {
	background:none;
	text-align:center;
	}	 
footer .ordermade .text1 span {
	background-color:#FFF;
	padding:10px 20px;
	text-align:center;
	font-weight:bold;
	font-size: 2.5rem;

	}	 
	 
footer .bizenyainfo {
	background-image:url(../img/footer_bg.png);
	background-position:bottom left;
	background-repeat:no-repeat;
	background-size:15% auto;}	 

footer .bizenyainfo .address {
	margin:50px auto;
	text-align:center;}
footer .bizenyainfo .address p {
	display: inline-block;
	text-align:left;
	margin:0px 20px;
	}
	 
}
/*-----------------------footer---------------------------*/


/*-----------------------amin---------------------------*/
main {
	margin-top:100px;}

 @media (min-width: 45rem) {
main {
	margin-top:120px;}
}


.anime_up {
  opacity: 0;
  visibility: hidden;
  transform: translateY(40px);
  transition: all 1s;
}
.anime_up.is-show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}


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


#page_top_link {
	position:fixed; /*固定*/
	bottom:10px;
	right:-20px;
	z-index:200;
}
#page_top_link img {
	width:70%;
}


/*-----------------------/main---------------------------*/
.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

.clearfix:before {
　　　　content: "";
	display: block;
	clear: both;
}

.clearfix {
	display: block;
}
