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

/*-----------------------------
body
-----------------------------*/

body {
	width: 100%;
	max-width: 1920px;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFF;
	color: #000;
	font-size: 4.267vw;
 	font-family: "游ゴシック Medium", "Yu Gothic Medium" , "游ゴシック体", YuGothic, sans-serif; 
	line-height: 2;
	animation: fadeIn 2s ease 0s 1 normal;/*ページ読み込み時フェードイン*/
}


	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:768px){
	body { 
		font-size: 16px;
		}
	}



/*-----------------------------
text_style, box_style
-----------------------------*/

/*スマホ向けレイアウトの指定*/

img { vertical-align: bottom; }
a:hover img { opacity: 0.7; }

.mincho {
	font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.fs_12_sp { font-size: 12px;}
.fs_14_sp { font-size: 14px;}
.fs_16_sp { font-size: 16px;}
.fs_18_sp { font-size: 18px;}
.fs_20_sp { font-size: 20px;}
.fs_24_sp { font-size: 24px;}
.fs_30_sp { font-size: 30px;}
.fs_34_sp { font-size: 34px;}
.fs_40_sp { font-size: 40px;}
.fs_50_sp { font-size: 50px;}

.fs_12_vw{ font-size: 0.75em;}
.fs_14_vw{ font-size: 0.875em;}
.fs_16_vw{ font-size: 1em;}
.fs_18_vw{ font-size: 1.125em;}
.fs_20_vw{ font-size: 1.25em;}
.fs_24_vw{ font-size: 1.5em;}
.fs_30_vw{font-size: 1.875em;}
.fs_34_vw{ font-size: 2.125em;}
.fs_40_vw{font-size: 2.5em;}
.fs_50_vw{ font-size: 3.125em;}

.ta_center_sp { text-align: center; }
.ta_left_sp { text-align: left; }
.ta_right_sp { text-align: right; }

.fw_bold { font-weight: bold; }

.fc_white { color: #fff; }
.fc_black { color: #000; }
.fc_base { color: #660099; }
.fc_yellow { color: #f79617; }
.fc_red { color: #ff0000; }
.fc_blue { color: #0000ff;}

.line_base { border-bottom: solid 1px #0c9444; }

.space2 { letter-spacing: 2px; }
.space5 { letter-spacing: 5px; }

.only_sp { display: block; }
.only_tb { display: none; }
.only_pc { display: none; }
.only_sptb { display: block; }
.only_tbpc { display: none; }

.lh_10 { line-height: 1; }
.lh_12 { line-height: 1.2; }
.lh_15 { line-height: 1.5; }
.lh_17 { line-height: 1.7; }

.mb10 { margin-bottom: 0.625em; }
.mb20 { margin-bottom: 1.25em; }
.mb30 { margin-bottom: 1.875em; }
.mb40 { margin-bottom: 2.5em; }
.mb60 { margin-bottom: 3.75em; }
.mb80 { margin-bottom: 5em; }
.mb100 { margin-bottom: 6.25em; }
.mb200 { margin-bottom: 12.5em; }
.mb300 { margin-bottom: 18.75em; }

.mt10 { margin-top: 0.625em; }
.mt20 { margin-top: 1.25em; }
.mt30 { margin-top: 1.875em; }
.mt40 { margin-top: 2.5em; }
.mt60 { margin-top: 3.75em; }
.mt100 { margin-top: 6.25em; }

.ml10 { margin-left: 0.625em; }
.ml20 { margin-left: 1.25em; }
.ml30 { margin-left: 1.875em; }
.ml40 { margin-left: 2.5em; }
.ml60 { margin-left: 3.75em; }
.ml100 { margin-left: 6.25em; }

.mr10 { margin-right: 0.625em; }
.mr20 { margin-right: 1.25em; }
.mr30 { margin-right: 1.875em; }
.mr40 { margin-right: 2.5em; }
.mr60 { margin-right: 3.75em; }
.mr100 { margin-right: 6.25em; }

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

.link_01 {
    vertical-align:baseline;
    background:transparent;
	text-decoration: none;
	color: #000;
}

.link_02 {
    vertical-align:baseline;
   	background:transparent;
	text-decoration: none;
}

.link_01:hover, .link_02:hover {
	opacity: 0.7;
}

.list_01 {
	list-style: none;
	text-indent: -1em;
	padding-left: 1em;
}

.list_02 {
	list-style: none;
}

.word_wrap {
	word-wrap: break-word;
}


	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:768px){
	.fs_12_tb { font-size: 12px; }
    .fs_14_tb { font-size: 14px; }
	.fs_16_tb { font-size: 16px; }
	.fs_18_tb { font-size: 18px; }
	.fs_20_tb { font-size: 20px; }
	.fs_24_tb { font-size: 24px; }
	.fs_30_tb { font-size: 30px; }
	.fs_34_tb { font-size: 34px; }
	.fs_40_tb { font-size: 40px; }
	.fs_50_tb { font-size: 50px; }
	.fs_80_tb { font-size: 80px; }

	.ta_center_tb { text-align: center; }
	.ta_left_tb { text-align: left; }
	.ta_right_tb { text-align: right; }

	.only_sp { display: none; }
	.only_tb { display: block; }
	.only_pc { display: none; }
	.only_sptb { display: block; }
	.only_tbpc { display: block; }
	}

		/*PC向けおよび大型PCの指定*/
		@media only screen and (min-width:1080px){
		body { min-width: 1080px; }

		.fs_12_pc { font-size: 12px; }
		.fs_14_pc { font-size: 14px; }
		.fs_16_pc { font-size: 16px; }
		.fs_18_pc { font-size: 18px; }
		.fs_20_pc { font-size: 20px; }
		.fs_24_pc { font-size: 24px; }
		.fs_30_pc { font-size: 30px; }
		.fs_34_pc { font-size: 34px; }
		.fs_40_pc { font-size: 40px; }
		.fs_50_pc { font-size: 50px; }
        .fs_70_pc { font-size: 70px; }
		.fs_80_pc { font-size: 80px; }

		.ta_center_pc { text-align: center; }
		.ta_left_pc { text-align: left; }
		.ta_right_pc { text-align: right; }

		.only_sp { display: none; }
		.only_tb { display: none; }
		.only_pc { display: block; }
		.only_sptb { display: none; }
		.only_tbpc { display: block; }
			
		/*ＰＣで横並びの時に、スマホで設定したmargin-bottomが不要になった時に使用*/
		.mb_clear_pc {
			margin-bottom: 0;
		}
		}

/*-----------------------------
responsive_grid
-----------------------------*/

/*スマホ向けレイアウトの指定*/
.inner01 {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

.inner02 {
	width: 92%;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

/*クラスタイムで使用*/
.inner03 {
	width: 92%;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}


.flex_box_sp {
	display: flex;
	flex-wrap: wrap;
}

.col_01_sp {
	width: 69%;
}

.col_02_sp {
	width: 32%;
}

.col_03_sp {
	width: 47%;
}

.col_04_sp {
	width: 23%;
}
	
.col_05_sp { 
	width: 60%;
}

	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:768px){
	.flex_box_tb {
		display: flex;
		flex-wrap: wrap;
	}

	.col_01_tb {
		width: 69%;
	}

	.col_02_tb {
		width: 32%;
	}

	.col_03_tb {
		width: 47%;
	}

	.col_04_tb {
		width: 23%;
	}
	
	.col_05_tb { 
		width: 60%;
	}
	}

		/*PC向けの指定*/
		@media only screen and (min-width:1200px){
		.inner01 {
			width: 80%;
		}

		.inner02 {
			width: 80%;
		}

		.inner03 {
			width: 960px;
		}

		.flex_box_pc {
			display: flex;
			flex-wrap: wrap;
		}

		.col_01_pc {
			width: 64%;
		}

		.col_02_pc {
			width: 32%;
		}

		.col_03_pc {
			width: 47%;
		}

		.col_04_pc {
			width: 23%;
		}
		
		.col_05_pc { 
			width: 60%;
	}

		.flex_reverse_pc {
			flex-direction:row-reverse;
		}
		}

/*-----------------------------
header
-----------------------------*/
/*.header_wrap {
	width: 100%;
	max-width: 1920px;
	margin-left: auto;
	margin-right: auto;
}*/

header {
	text-align: center;
}

.top_h1 {
	width: 30%;
	margin-top: 1em;
	margin-bottom: 1em;
	margin-left: auto;
	margin-right: auto;
}

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

header p {
	width: 55%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}

header p img {
	width: 100%;
	height: auto;
}
	
.mainimg img {
	width: 100%;
	height: auto;
}


	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:768px){
	header {
		width: 30%;
		position: relative;
	}

	.top_h1 {
		margin-top: 3em;
		width: 45%;
	}
	
	header p {
		position: absolute;
		bottom: 0;
		margin-bottom: 1em;
		width: 65%;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
	}
	
	.mainimg {
		width: 70%;
	}
	
	}





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


/*-----------------------------
totopボタン
-----------------------------*/

#totop {
	position: fixed;
	bottom: 1em;
	right: 0;
	height: auto;
	opacity: 0.7;
	z-index: 999;
}

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


/*-----------------------------
top_lead
-----------------------------*/
.lead {
	background: url("../images/bg_lead.jpg") no-repeat;
	background-size: cover;
	padding: 5em 0;
}

/*-----------------------------
twitter
-----------------------------*/
.news {
	padding: 5em 0;
}

.img_twitter_01, .img_twitter_02 {
	display: none;
}


	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:1020px){
	
	.twitter {
		width: 500px;
		margin-left: auto;
		margin-right: auto;
 	}

	.img_twitter_01 {
		display: block;
		position: absolute;
		top: 1em;
		left: 0;
}

	.img_twitter_02 {
		display: block;
		position: absolute;
		right: 0;
		bottom: 1em;
	}
}

	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:1600px){
	.img_twitter_01 {
		display: block;
		position: absolute;
		top: 1em;
		left:2em;
}

	.img_twitter_02 {
		display: block;
		position: absolute;
		right: 2em;
		bottom: 1em;
	}
}


/*-----------------------------
メニュー
-----------------------------*/
.menu_ttl {
	padding: 0.2em 0;
	background-color: #333;
	color: #fff;
	font-size: 1.2em;
	font-weight: lighter;
}

.box_menu_01 {
	padding: 0.4em 0;
}

.menu_txt_01 {
	font-size: 1.2em;
	padding: 0.2em 0;
}


.menu_table tr td {
	padding: 0 0.5em;
}

.menu_table, .menu_table_02 {
	width: 100%;
	border-collapse: collapse;
}

.menu_table tr {
	border-bottom: solid 1px;
}

.menu_table_02 tr {
	border: none;
}


.menu_table tr td, .menu_table_02 tr td {
	padding: 0.2em 0;
}

.menu_table tr td:last-child, .menu_table_02 tr td:last-child {
	text-align: right;
}


.kodawari_1 {
	padding-top: 1em;
	background: url("../images/kodawari1.png") no-repeat top right;
	background-size: 40%;
}

.kodawari_2 {
	padding-top: 1em;
	background: url("../images/kodawari2.png") no-repeat top right;
	background-size: 40%;
}

	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:768px){
	.kodawari_1 {
		padding-top: 2em;
		background: url("../images/kodawari1.png") no-repeat top right;
		background-size: 30%;
	}
	
	.kodawari_2 {
		padding-top: 2em;
		background: url("../images/kodawari2.png") no-repeat top right;
		background-size: 30%;
	}
	}

		/*タブレットレイアウトの指定*/
		@media only screen and (min-width:1330px){
		.flex_box_1330 {
			display: flex;
			flex-wrap: wrap;
		}
		

		.col_03_1330 {
			width: 48%;
		}
		}

/*-----------------------------
大将ごあいさつ
-----------------------------*/

.greeting {
	padding: 5em 0;
	background: url("../images/bg_greeting.jpg") no-repeat center center;
	background-size: cover;
	color: #ffffff;
}



/*-----------------------------
店舗情報
-----------------------------*/
.info {
	padding: 5em 0;
}

.table_info {
	width: 100%;
	border-collapse: collapse;
}

.table_info tr {
	border-bottom: solid 1px;
}

.table_info tr th {
	vertical-align: top;
	white-space: nowrap;
	text-align: left;
}

.table_info tr td {
	padding-left: 1em;
}

	/*PCレイアウトの指定*/
	@media only screen and (min-width:1200px){
	.table_info {
		font-size: 1.3em;
	}
	
	.table_info tr td {
		padding-left: 3em;
	}
	}

/*-----------------------------
アクセス
-----------------------------*/
.access {
	padding: 5em 0;
	background-color: #fbf6ec;
}

.list_access {
	list-style: none;
	padding-left: 1em;
	text-indent: -1em;
}

.googlemap {
	position: relative;
	padding-bottom: 50%;
	height: 0;
	overflow: hidden;
}

.googlemap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height:100% !important;
}


/*-----------------------------
お問い合わせ
-----------------------------*/
.form_title {
	padding: 5px 10px;
	background-color: #338811;
	margin-bottom: 20px;
	border-radius: 5px;
	text-align: center;
	color: #ffffff;
}

.form_input {
	padding: 5px 10px;
	border: 1px solid;
	border-radius: 5px;
	margin-bottom: 20px;
}

input, textarea, select{
 	outline: none;
	font-size: 16px;
	overflow: hidden;
	border: none;
}

input[type="text"], textarea[type="text"] {
	width: 100%;
	box-sizing: border-box;
}

input.birth[type="text"] {
	width: 5em;
	box-sizign: content-box;
}

.outline {
	border: solid 1px #818181;
}


.form_submit {
	text-align: center;
}

.form_submit input {		
	background-color: #338811;
	padding: 10px 100px;
	border-radius: 5px;
	font-size: 19px;
	color: #fff;
	letter-spacing: 5px;
}
	
	/*タブレットレイアウトの指定*/
	@media only screen and (min-width:769px){
	.form_title {
		float: left;
		width: 30%;
		text-align: left;
	}

	.form_input {
		float: right;
		width: 63%;
	}
	}
	
		/*PC向けおよび大型PCの指定*/
		@media only screen and (min-width:1080px){
		.form_contact01 {
			width: 90%;
			margin-left: auto;
			margin-right: auto;
		}
		}