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


スマホページ用


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

/* メインメニュー iPadサイズ以下から
------------------------------------------------------------*/
@media only screen and (max-width:1024px){}


/* ●px以下から 1カラム表示
------------------------------------------------------------*/
@media only screen and (max-width:768px){

*{box-sizing: border-box;}
body{}

body{
	text-align:center;
	position:static;
	}

#bg{
	background:none;
	}

.sub_page #bg{
background:none;

	}

/*表示・非表示*/
.sp_none{ display:none !important;}
.sp_only{ display:block;}


body,
#container,
.content{ padding:0 !important; margin:0 !important;}

#container{
overflow: hidden;
}

#content{
	padding:2% 2%;
}



#head_menu{ display:none;}




/*幅関係*/


html,body,
header,
header .inner,
#content,
.sub_page h1,
#content,
footer,
footer .inner,
#navi-footer,
#logo-footer,
.btn_pagetop,
#sidebar,
.contact_box{
	width:100% !important;
	padding:0;
	}




img{ width:100%; height:auto; }

.mainimage{ width:96%; margin:1% 1% 1% 3%;}
.mainimage .bxslider img{ width:100% ;}

.navigation .alignLeft,
.navigation .alignRight{ width:48%;}
.navigation .alignLeft img,
.navigation .alignRight img,
.prev img,
.next img,
.semBox .aR img{ width:auto;}




.inner,
#mainTopBg,
#container,
#main,
footer nav{
	width:100% !important;
	
}

#sidebar{
	float:none;
	text-align:center;


	}
#sidebar img{
	width:80%;
}


/*並び順調整*/

#container{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
 
	-webkit-flex-direction:row;
	-moz-flex-direction:row;
	-ms-flex-direction:row;
	-o-flex-direction:row;
	flex-direction:row;
 
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
 
	
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	-o-justify-content: space-between;
	justify-content: space-between;
	
	}
	
#side{ order:2;}
#main{ order:1;}
#pagetop{ order:3;}
#pagetop { padding-top:5px; text-align:center !important;}


/**/

/*サイド　詳細*/

.side_shopinfo{}
.side_shopinfo .pic{ 	float:left; width:40%; margin-right:1%;}
.side_shopinfo .indent{	float:left;	width:59% ; margin:0 0 0 0 !important;}

#sideMenu{  display:none;}
#side .bnr p{ float: left; width:24%;}


#side .blueBg{ clear:both;}






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

　ヘッダー

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


	
header{
	padding:0;
	margin-bottom:5px;
	text-align:left;
	}

header #logo {
	margin: 0 0 0px 0;
	float:none;
	padding:0;
	padding-top:3%;

	}
header #logo img{ width:80%;}	
header #logo_r{
	padding:0;
	float:none;
	text-align:center;
	}
header #logo_r img{
	width:45%;
}
header h1{ text-align:left;}

/*
header h1,
header p.h1{
	width:100%;
	font-size:11px;
	padding:1px;
	overflow:hidden;
}
header #tel{
	text-align:center;
	clear:both;
	float:none;

	}
header #tel p{float:none;}
header #tel p img{ width:auto;}
*/




/*NAVI*/
header nav{ display:none;}




.header-bnr{ padding:0; margin:0; text-align:center;}
.header-bnr img{ width:90%;}



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

　フッター

----------------------------------------------------------------------------------------*/
footer{
	background:#000 !important;
	}


.btn_pagetop{
	clear:both;
	text-align:center;
	padding:10px;
	}
.btn_pagetop img{
	width:auto;
}




footer{
	clear:both;
	padding:3%;
	
	}
	
footer .clrfix{ padding:2px 0 10px 0; }
footer .nintei{ font-size:10px; text-align:center; color:#0F0102;}


#logo-footer,
#navi-footer{ padding-top:5px;}
#logo-footer{
	text-align:center;
}
#logo-footer img{ width:auto;}


footer ul{
text-align:center;
}

footer li{
	float:left;
	padding:0px 2%;
	background:url(../images/common/icon-list1.png) no-repeat 0 7px;
}

footer li:first-child{border:0;}

footer li a{
	text-decoration:none;
	font-size:80%;
}


footer li a:hover{color:#999;}

footer ul ul{display:none;}



address.copyright{
font-style:normal;
clear:both;
padding:10px 0 10px 0;
text-align:center;
color:#000;
font-size:10px;
}


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

　ナビ関連

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


.btn_sp_navi{
	display:block;
	position:absolute;
	right:2px;
	top:13px;
	}
.btn_sp_navi img{
	width:40px;
}
.btn_sp_navi:hover{ cursor:pointer;}



.sb-slidebar{
	background:#000;
	padding:10px;
	z-index:10000;
} 
.sb-slidebar li{ border-bottom:1px dotted #FFF;}
.sb-slidebar li a{
	color:#FFF; padding:5px; text-decoration:none;
	font-weight:bold;
	
	display:block;
	padding:12px 0;}

.sb-toggle-left{

	 color:#FFF;
	 padding:10px;
	 cursor:pointer;

	}





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

　タイトル1  ＆　共通

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


h2,h3,h4,h5,h6{
	font-family:"Century Gothic","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	clear:both;
	}



#content h1{
	padding:1%;
	width:100%;
	font-size:47px;
	
	background:#000;
	color:#FFF;

	
	
}


#main h2{

	font-size:200%;
	padding:3% 1% 1% 1%;
	font-weight:normal;
	text-align:left;
	line-height:1.1em;
	
	margin-bottom:0;
	
}

#main h3{
	margin:0 0 5px 0;
	padding:3px 5px;
	font-size:110%;
	font-weight:bold;
	color:#2045D3;
	
}
#main h4{}


#contents .title {
	margin-bottom: 18px;
	}

blockquote{
	background:#FDEEEA;
	padding:15px 15px;
	margin-bottom:20px;
	
	}
blockquote h4{
	color:#DD4668;
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho",serif;
	font-size:18px;
	text-align:center;
	}
	
	


/* 共通　*/
.contact_box{
	margin-bottom:5px;
	
	padding:15px 2%;
	border:1px solid #FFE4E4;

}
.contact_box p img{ width:auto;}
.contact_box .bnr-tel,
.contact_box .bnr-contact{ margin:0;  width:48%; }

.contact_box .bnr-tel img,
.contact_box .bnr-contact img{ width:100%;}

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

　枠＆並び替え

----------------------------------------------------------------------------------------*/
#content #main{
	padding:0 2%;}

#content{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
 
	-webkit-flex-direction:row;
	-moz-flex-direction:row;
	-ms-flex-direction:row;
	-o-flex-direction:row;
	flex-direction:row;
 
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
 
	
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	-o-justify-content: space-between;
	justify-content: space-between;
}
#content #sidebar{order:1;}
#content #main{order:2;}
#content .banner{ display:none;}




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

　 TOP

----------------------------------------------------------------------------------------*/
#top,

.mainimage{ padding:0;}


#top .bnr{}
#top .bnr ul{
	margin-left:1%;}
#top .bnr ul li{
	width:80%;
	margin:0 2% 3px 0 ;
	
	}

.welcome .line p{
margin-bottom:5px;
}
.welcome .line img{ width:auto; }
	
#top-blog{
	float:none;
	}
		
#top h3{ text-align:center;}
#top h3 img{ width:90%;}


#top-information .btn-datail{
	display:block;
	float:right;
	margin-top:-30px;
	}
#top-information .btn-datail img{
	width:auto;
}


#top-blog h3 img{ width:auto; }



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

　 会社

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




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

　ブロック系

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


.layout-2 img{ width:auto; border:10px solid #FFF;}

.layout-2{ text-align:center;}
.layout-2 a img{
	width:90%;
	border:10px solid #E1E9F4; }
.layout-2 a:hover img{
	border:10px solid #197CF3;
	}




/*　入力部分共通　*/

.block{}
.block table{
	width:100%;
	
	}
.block table th,
.block table td{
	display:block;
	width:100%;
	padding:5px 10px;
	border:solid #D3D3D3;
	border-width:0px !important;
	vertical-align:top;
	}

.block table th{
	color:#333;
	text-align:left;
	}

.block table td{
	margin-bottom:3%;
	border-bottom-width:1px !important;
	
}




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

　フッター

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

.page_top{
	text-align:center;
	margin:0;
	clear: both;
	}
.page_top img{
	width:auto;
	}


footer{
	background:#FFF;
	text-align:center;
	}
footer *{color:#CCC;}
footer .inner{}
#foot_logo{ display:none;}


footer nav{
	float:none;
	padding:5px;
	}
	
footer nav ul {
	list-style-type: none;
	}
	
footer nav ul li {
	float:left;
	/*background: url(../images/common/list_icon01.gif) no-repeat 0 5px;
	padding-left:12px;*/
	font-size: 14px;
	margin-right:10px;
	text-align:left;
	}
	
footer nav ul li a {
	color:#333;
	
	}
	

	

footer address{
	clear:both;
	text-align:center;
	padding-bottom: 50px;
	font-size: 14px;
	font-family:"Century Gothic";
	}


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

  問合せ

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

.tbl_form th{ width:30%; text-align:left;}
.tbl_form td{ width:70%;}



input.sizeS{ width:90%;}
input.sizeM{ width:90%;}
input.sizeL{ width:90%;}


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

  管理画面用

----------------------------------------------------------------------------------------*/
section .btn{
	display:inline-block;
	text-align:center;
	position:inherit;
}

section .btn-edit-pic img,
section .btn img{
	width:auto !important;
}

.insert{
	clear:both;
	padding-top:3px;
	border-bottom:0 px dotted #EEE;
	margin-bottom:3px;
	}
.insert p{
	position:inherit;
	text-align:center;
	}
.insert a{
	position:inherit;


	filter:alpha(opacity=30);
	-moz-opacity:0.30;
	opacity:0.30;
	
	}
.insert a img{
	width:auto;
	
}




/* タブレット系　*/

/* 幅600px以下から  
------------------------------------------------------------*/
@media only screen and (max-width: 600px){

.layout-2 img{ width:96%;}

	
}





/* 幅414px以下から iphone6& plus
------------------------------------------------------------*/
@media only screen and (max-width: 414px){





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

  問合せ

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


.tbl_form th,
.tbl_form td{
	display:block;
	widows:100%;
	text-align:left;
	
	
	}
#contact th span.hissu{
	float:left;
	margin-right:10px;
	}

.tbl_form .subTbl table th,
.tbl_form .subTbl table td{
	display:table-cell;
	}

.tbl_form .subTbl table th{ width:25%; font-size:14px; vertical-align:middle;}
.tbl_form .subTbl table td{ width:75%;}





/*　共通系　*/
.contact_box{
	margin-bottom:5px;
	
	padding:15px 2%;
	border:1px solid #FFE4E4;

}
.contact_box p img{ width:auto;}
.contact_box .bnr-tel,
.contact_box .bnr-contact{ float:none; margin-bottom:5px;   width:98%; }

.contact_box .bnr-tel img,
.contact_box .bnr-contact img{ width:100%;}


#content section{
	margin:0 2%;
}



/* TOP */
 .welcome .line img{ width:80%; }

 /*TOPお知らせ*/
#top-information ul li{ display:block;}
#top-information div{ display:block; }


#top-information .date{ display:block; width:100%;}
#top-information .cate{ width:25%; float:left; }
#top-information .txt{ width:73%; padding-left:27%;}
 

/*見えにくい画像にズームボタン*/
.btn_zoom{ position:relative;}
.btn_zoom:before{

	position:absolute;

	content: url(images/icon_zoom.png);
	bottom:2%;
	left:2%;
	z-index:100;
	
}


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

  問合せ

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

.tbl_form th,
.tbl_form td{
	display:block;
	width:100%;
	}






/*
ブロック系
*/



/*　画像　＋　テキスト　*/


.layout-3 .pic,
.layout-4 .pic{ width:80%; margin:auto;}

.layout-3 .txt,
.layout-4 .txt{ width:90%;}

.layout-3 .pic img,
.layout-4 .pic img{
	width:100%;
	border:8px solid #F8F8F8;}

/* 画像　左のみ*/
.layout-3 .pic{ float:none;}
.layout-3 .txt{ float:none;}

/* 画像　右のみ*/
.layout-4 .pic{ float:none;}
.layout-4 .txt{ float:none;}



/*　ギャラリー　*/
.layout-gallery ul li{
	margin:0 5px 3px 0;
	}
.layout-gallery li a{
	border:5px solid #EEE;
	width:110px;
	height:85px;
}
	
.layout-gallery li a img{
	margin-top:-10px;
}

.layout-gallery li a:hover{

	border:5px solid #FDEC7C;

}





}




/* 幅320x以下から ヘッダー等微調節 iphone5
------------------------------------------------------------*/
@media only screen and (max-width: 320px){



/*
ブロック系
*/

/*　ギャラリー　*/
.layout-gallery ul li{
	margin:0 5px 3px 0;
	}
.layout-gallery li a{
	border:5px solid #EEE;
	width:90px;
	height:75px;
}
	
.layout-gallery li a img{
	margin-top:-10px;
}

.layout-gallery li a:hover{

	border:5px solid #FDEC7C;

}
	
	

	



}