﻿@charset "utf-8";
/*==================================================
	タブレットのみ適応
==================================================*/
@media only screen and (max-width: 768px) and (min-width: 641px){
	.dsp_smt { display: none; }
	#footer .contact .txt span {
		display: inline-block;
		margin-left: 10px;
	}
	#navi_line {
		line-height: 53px;
		font-size: 20px;
		width: 40%;
		margin: 0 auto;
	}
	#navi_instagram {
		width: 40%;
		margin: 0 auto;
	}
}
/*==================================================
	タブレット・スマホに適応
==================================================*/
@media only screen and (max-width: 768px) {
	.dsp_hp { display: none; }

	/* ヘッダ */
	#header {
		overflow: hidden;
		height: auto;
		padding: 0;
		background: #fff;
	}
	#header h1 {
		width: 100%;
		background: #fff;
		color: #999;
		font-size: 10px;
		line-height: 1;
		text-align: right;
	}
	#header p.title {
		height: 50px;
		padding-left: 10px;
	}
	#header p.title img {
		width: auto;
		max-height: 40px;
	}
	#sticky {
		position: relative;
		z-index: 9997;
	}
	#sticky.sticky {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		background: #fff;
		box-shadow: 0 0 5px rgba(0,0,0,0.2);
	}
	/* お問い合わせ */
	#header .contact {
		position: relative;
	}
	#header .contact .tel,
	#header .contact .btn {
		position: absolute;
		top: 0;
		right: 90px;
		display: block;
		width: 24px;
		height: 50px;
		padding: 0 11px;
		/* 縦方向中央揃え */
		display: -webkit-flex;
		display: flex;
		-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
		align-items: center; /* 縦方向中央揃え */
		-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
		justify-content: center; /* 横方向中央揃え */
	}
	#header .contact .btn {
		right: 44px;
	}
	#header .contact .txt,
	#header .contact .tel span,
	#header .contact .btn span {
		display: none;
	}
	/* コンテナ */
	#container h3.sub {
		margin-bottom: 30px;
		font-size: 20px;
	}
	.main {
		padding-left: 15px;
		padding-right: 15px;
	}
	#main, #navi {
		clear: both;
		padding-bottom: 30px;
	}
	#main {
		margin-top:40px;
	}
	/* フッター */
	#footer .box dt {
		margin-bottom: 20px;
	}
	#copyright {
		height: 30px;
		line-height: 30px;
	}
	/* パンくずリスト */
	#page_navi {
		margin-bottom: 20px;
		padding-top: 15px;
		font-size: 11px;
	}
	/* 枠のマージン・パディング */
	.mb { margin-bottom: 40px; }
	.pt { padding-top: 40px; }
	.pb { padding-bottom: 40px; }
	/* アンカーリンク用上部スペース */
	.pad_anchor {
		margin-top: -50px;
		padding-top: 50px;
	}
	/*--------------------------------------------------
  	サイドメニュー
	--------------------------------------------------*/
	#navi_01 {
		padding: 15px;
		margin-bottom: 35px;
		text-align: center;
	}
	#navi_01 p {
		text-align: center;
	}
	#navi_01 .txt7 {
		font-size: 20px;
		padding: 5px 0;
		margin-bottom: 10px;
	}
	#navi_01 .txt8 {
		font-size: 21px;
		margin-bottom: 10px;
	}
	#navi_01 .txt9 {
		font-size: 25px;
		margin-bottom: 0;
	}
	#navi_01 .txt9 img {
		width: 25px;
		margin-right: 8px;
		margin-top: -4px;
	}
	#navi_01 .txt10 {
		font-size: 12px;
	}
	#navi_01 a.btn {
		width:40%;
		font-size: 16px;
		line-height: 37px;
		text-align: center;
	}
	#navi_01 a.btn img {
		width: 24px;
		margin-right: 10px;
	}
	#navi_02 {
		text-align: center;
		margin-bottom: 35px;
	}
	#navi_02 .txt11 img {
		margin-right: 20px;
		margin-top: -2px;
	}
	#navi_02 .txt11 a.btn {
		width:40%;
		line-height: 53px;
		font-size: 20px;
	}
	#navi_line,
	#navi_instagram {
		line-height: 53px;
		font-size: 20px;
	}
	#navi_03 {
		padding: 50px 0;
	}
	#navi_03 p {
		text-align: center;
	}
	#navi_03 .txt12 {
		font-size: 31px;
		margin-bottom: 20px;
	}
	#navi_03 .txt13 {
		font-size: 20px;
	}
	#navi_04 {
		padding: 4px;
	}
	#navi_04 .inner {
		padding: 15px 10px 10px 10px;
		text-align: center;
	}
	#navi_04 .inner img {
		width: 156px;
	}
	#navi_04 div.txt {
		display: inline-block;
		margin-left: 10px;
	}
	#navi_04 .inner p {
		font-size: 14px;
		margin-bottom: 0;
	}
	#navi_05 {
		text-align: center;
	}
	#navi_instagram p {
		margin-bottom: 0;
	}
	/*--------------------------------------------------
	トップページ
	--------------------------------------------------*/
	#top_concept {
		padding: 5px;
	}
	#top_concept .box {
		background:
			url("../img/top/concept_inner01.png") left 5px top 5px no-repeat, url("../img/top/concept_inner02.png") right 5px bottom 5px no-repeat;
		padding: 30px 0;
	}
	#top_concept .txt1 {
		font-size: 24px;
		text-align: center;
		padding-bottom: 20px;
	}
	#top_concept .txt1:before {
		left: 50%;
		bottom: 0;
		width: 40px;
		height: 2px;
		margin-left: -25px;
	}
	#top_concept .txt2 {
		font-size: 14px;
		text-align: center;
		margin-bottom: 0;
	}
	#top_first h3.sub2 {
		font-size: 24px;
		padding-bottom: 10px;
		margin-bottom: 20px;
	}
	#top_first .box {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		margin-bottom: 25px;
	}
	#top_first .box .left {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
	}
	#top_first .box .left span {
		font-size: 25px;
		padding: 0 20px;
	}
	#top_first .box .right {
		padding: 20px;
	}
	#top_first .box .top {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}
	#top_first .box .bottom {
		padding-top: 20px;
	}
	#top_first .txt4 {
		font-size: 18px;
	}
	#top_first .txt5 {
		padding: 0 5px;
	}
	#top_about {
		padding-top: 40px;
		padding-bottom: 20px;
	}
	#top_about img {
		float: right;
		margin-left: 10px;
	}
	#top_about h3.sub3 {
		font-size: 21px;
		line-height: 50px;
		margin-bottom: 20px;
	}
	#top_menu ul {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	}
	#top_menu ul li {
		width:49%;
		margin-right: 2%;
	}
	#top_menu ul li:nth-child(2) {
		margin-right: 0;
	}
	#top_menu .txt6 span {
		font-size: 23px;
	}
	#top_menu .txt6 {
		font-size: 14px;
		line-height: 50px;
		padding-left: 20px;
		margin-bottom: 0;
	}
	#top_menu .textarea {
		margin: 0;
		padding: 20px;
		text-align: center;
	}
	#top_menu .btn {
		padding: 7px 20px;
		font-size: 14px;
		border-radius: 20px;
	}
	#top_info h3.sub4 {
		font-size: 21px;
		margin-bottom: 30px;
		padding-left: 10px;
	}
	/*--------------------------------------------------
	店舗案内・スタッフ紹介
	--------------------------------------------------*/
	
	.tbl_full{
		width:100%!important;
	}
	.tbl_flcolumn{
		flex-direction:column;
	}
	.tbl_flcolumn > *:first-child{
		margin-bottom:20px;
	}
	#price .grad{
		font-size:14px;
	}
	#price .package .introduce .content{
		width:50%;
	}
	#price .package .tbl_half{
		width:49%;
	}
	#price .package .tbl_thirty{
		width:30%;
	}
	/*--------------------------------------------------
		お問い合せ
	--------------------------------------------------*/
	#mailform .tbl {
		border-bottom: 1px solid #BBB;
	}
	#mailform .tbl th,
	#mailform .tbl td {
		display: block;
		width: auto;
		border-bottom: none;
	}
	#mailform .tbl input[type="text"],
	#mailform .tbl textarea {
		font-size: 120%;
	}
	#mailform .btn input {
		width: 120px;
	}

/*------------------------------------------------*/
}