@charset "utf-8";
/* CSS Document */

body {
	margin:0 auto;
	width: 100%;
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background-image: url(../img/bg.jpg);
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	font-size:1.1em;
	-webkit-text-size-adjust: none;
}

.clearfix:after {  
  content: ".";   
  display: block;   
  height: 0;   
  clear: both;   
  visibility: hidden;  
}  

img{
  vertical-align: bottom;
}

a{
	color: #000;
	text-decoration: none;
	font-weight: bold;
}

a:hover{
	color: #822426;
	text-decoration: underline;
}

/* ----- メイン ----- */
#content {

}

#main_bg1{
    background: url("../img/bg_1.png")  repeat;
}


#main_f {
    width: 800px;
    margin: 0 auto;
    background-color: #fff;
}





a img {
    border-style:none;	
}

a:hover img {
	/*opacity: 0.7;
	filter: alpha(opacity=80);*/
}

.main_img img{
	max-width: 100%;
	height: auto;
}

.main_1{

}

.main_v{
	background: url("../img/fs_main_b.jpg");
	background-size: cover;
	padding-bottom: 100px;
}

.kabobg{
	background: url("../img/kabobg.png");
	width: 100%; 
	padding-bottom: 100px;
}
.kabobg::after {
    display: block;
    content: " ";
    clear: both; 
}

.setu{
	padding:0em 1em;
	line-height: 180%;
	font-size: 0.6em;
	text-align: center;
	background-color: #F4D498
}

.tatearea{

	width: 100%; 
	padding-bottom: 100px;
	padding-top: 50px;
}
.tatearea::after {
    display: block;
    content: " ";
    clear: both; 
}



.gallery{
	background-color: #FECE26;
	background-size:100% auto;

}

.gallery_in{
	width: 80%;
	padding: 0 10%;
	padding-bottom: 20px;
}

.gallery_title{
	margin: 0 auto;
}

.gallery img{
	
	width: 30%;
	padding: 1%;

}



.bg_bottom{

}

.bottom_1{
	width: 33%;
	float: left;
}

.bottom_1 img{
	width: 100%;
}

.bottom_2{
	width: 43%;
    float: left;
    color: #7c5341;
    font-weight: bold;
    padding-top: 3em;
    padding-left: 12%;
}

.bottom_3{
    width: 40%;
    float: left;
    padding-top: 2em;
	
}

.bottom_3 img{
	width: 100%;
}

.bg_red{
	background-color: #e2523a;
}

.bg_blue{
	background-color: #47c1d9;
}

.txt_spec{
	padding: 1em 2em;
    line-height: 248%;
    font-weight: 600;
    color: #fff;
}


.txt_ftr{
	padding: 1em;
	font-size: 0.8em;
}

.txt_ftr a{
	color: #fff;
}

.txt_w{
	color: #fff;
}

.kitanlogo{

}

.konyu_txt{
	padding: 1em 0 0;
	font-size: 1.4em;
	font-weight: bold;
	color: #fff;
}


#footer{


}

#ftr_shopbtnarea{

	background-color: #e2523a;
	width: 100%;
}

.ftr_shopbtn{

	width: 1150px;
	margin: 0 auto;
}

.ftr_shopbtnareabg{
	background-color: #e2523a;
}


@keyframes fadein {
from {
    opacity: 0;
    transform: translateY(10px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}

.animation2{
    opacity: 0; //不透明度0%
    -webkit-transform: translate3d(0, 0, 0); 
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 30px, 0);
    transform: translate3d(0, 30px, 0);
    -webkit-transition: all 6s ease; 
    transition: all 3s ease;
}
 
.animation2.active{
    opacity: 1; 
    -webkit-transform: translate3d(0, 0, 0); //戻す
    transform: translate3d(0, 0, 0);
}

/* ------------------------------
   説明
------------------------------ */

.disp_pc{
	display: block;
}
.disp_smp{
	display: none;
}

/* ------------------------------
   タブレット・スマホ
------------------------------ */

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

	body {
		font-size:1em;
	}

	#content {
		width: 100%;
		min-width: 100%;
	}

	#main_f{
		width: 100%;
		margin:0 auto;
	}

	.bottom_1{
		width: 25%;
		float: left;
		padding-top: 6em;
	}

	.bottom_1 img{
		width: 100%;
	}

	.bottom_2{
		width: 35%;
		float: left;
		color: #7c5341;
		font-weight: bold;

		font-size: 1em;
	}

	.bottom_3{
		width: 35%;
		float: left;
		padding-top: 5em;
	}

	.bottom_3 img{
		width: 100%;
	}

	.ftr_shopbtn{
		width: 100%;
	}

}

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

	body {
		font-size:1em;
	}

	#content {
		width: 100%;
		min-width: 100%;
	}

	#main_f{
		width: 100%;
		margin:0 auto;
	}
	.bottom_1{
		width: 25%;
		float: left;
		padding-top: 6em;
	}

	.bottom_1 img{
		width: 100%;
	}

	.bottom_2 {
		width: 49%;
		padding-left: 10%;
		float: left;
		color: #7c5341;
		font-weight: bold;
		padding-top: 1em;
		font-size: 0.8em;
	}

	.bottom_3{
		width: 35%;
		float: left;
		padding-top: 2em;
	}

	.bottom_3 img{
		width: 100%;
	}

	.tate_l{
		width:30%;
		padding-left: 5%;
		float: left;
	}

	.tate_l img{
		padding-top: 1em;
	}

	.tate_r{
		width:65%;
		float: right;
	}



	.gallery{
		background-color: #fece26;
	}
	
	.gallery_in{
		padding-bottom: 50px;
	}

	.gallery img {
		width: 29.6%;
		margin: 0.3em 0%;
	}
	
	.gallery_title{
		width: 70%;
		margin: 0 auto;
	}



}

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

	.cut_setu {
		background-color: #000;
		padding: 1px;
		color: #fff;
		text-align: left;
		font-size: 0.4em;
	}
	
/*	.bottom_2{
		padding-top:3em;
		font-size: 0.7em;
		padding-left:2em;
	}
	.bottom_3{
		width: 100%;
		float: none;
		padding-top: 0;
		text-align: center;
	}
	.bottom_3 img{
		width:70%;
	}*/
	
}


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

	.main_v{
		background: url("../img/fs_main_b.jpg");
		background-size: cover;
		padding-bottom: 0px;
	}

	body {
		font-size:0.9em;
		line-height: 1.4em;
	}

	#content {
		width: 100%;
		min-width: 100%;
	}

	.main_1{
	}


	.cut_setu {
		background-color: #000;
		padding: 1px;
		color: #fff;
		text-align: left;
		font-size: 0.3em;
	}


	.disp_smp{
		display: block;
	}
	
	.disp_pc{
		display: none;
	}

	.gallery{

	}

	.gallery_in{
		padding-bottom: 10px;
	}

	.gallery_title{
		width: 90%;
		margin: 0 auto;
	}

	.gallery img {
		width: 29.6%;
		margin: 0.3em 0%;
	}

	.cutarea_waku{

		width: 100% !important;
		margin: 0 auto;
		text-align: center;
	}

	.cutarea_waku2{
		width: 100% !important;
		margin: 0 auto;
		text-align: center;
		display: block;
		justify-content: inherit;
	}

	.cutarea{
		width: 80%;
		float: none;
		padding: 15px 10%;
	}

	.cutarea img{
		width: 100%;
	}

	.cut_setuwaku{
		background: url("../img/cut_setu.jpg");
		background-size:100% auto;
		padding: 2px;
		margin-top: 10px;
		}
		
	.cut_setu{
		background-color: #000;
		padding: 15px;
		color: #fff;
		text-align: left;
		font-size: 0.8em;
	}


	.bottom_1{
		width: 100%;
		float: none;
		padding-top: 2em;
		text-align: center;
	}

	.bottom_1 img{
		width: 60%;
	}

	.bottom_2{
		width: 90%;
		float: none;
		color: #7c5341;
		font-weight: bold;
		padding-top:1em;
		font-size: 0.8em;
	}

	.bottom_3{
		width: 100%;
		float: none;
		padding-top: 0;
		text-align: center;
	}

	.bottom_3 img{
		width: 80%;
	}

	.kitanlogo img{
		width: 60%;
	}

}