@charset "UTF-8";


/*全体の設定
---------------------------------------------------------------------------*/
* {
    margin: 0;
    padding: 0;
}

body {
	font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
	-webkit-text-size-adjust: none;
	background: #fff;	/*背景色*/
	color: #666;		/*全体の文字色*/
	font-size: 16px;	/*基準となるフォントサイズの上書き*/
	line-height: 2;		/*行間*/
	overflow-x: hidden;
}

main {
	max-width: 1200px;
	text-align: center;
	margin: 0 auto;
}

/*table全般の設定*/
table {border-collapse:collapse;}

/*画像全般の設定*/
img {border: none;max-width: 100%;height: auto;vertical-align: middle;}

/*youtube　レスポンス*/
.youtube_res{
  position:relative;
  width:100%;
  padding-top:56.25%;
}
.youtube_res iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
  margin: 30px 0;
}

/*リンクテキスト全般の設定
---------------------------------------------------------------------------*/
a {
	color: #666;	/*文字色*/
	transition: 0.3s;
}

a:hover {
	opacity: 0.7;	/*マウスオン時に70%の透明度にする*/
}

/*header（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
	background: #ffb9fd;	/*背景色*/
	position: relative;
}

/*ロゴ画像*/
header #logo {margin: 0;}

/*ロゴ画像（※トップページ以外）*/
.page header #logo img {
	display: block;
	height: 75px;	/*画像の高さ。*/
	margin: 0 auto;	/*左右中央に配置*/
}

.wrap-a {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 70px;
/*
	display: flex;
	justify-content:space-between;
	align-items: center;
*/
}

/*WEBサイトへのボタン設定
---------------------------------------------------------------------------*/
.contact-btn {
	margin-left: 15px;
}

.contact-btn a {
	text-decoration: none;border: none;
	display: block;
	border-radius: 10px;
	font-size: 18px;
	font-weight: 900;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
	background: #d7003a;
/*	background: #FFC042;*/
	letter-spacing: 0.05em;	/*文字間隔を少し広くする指定*/
	color: #fff;			/*文字色*/
	transition: 0.3s;		/*hoverまでにかける時間。0.3秒。*/
	padding: 9px 12px;	/*上下、左右へのボタン内の余白*/
}

/*ボタンのマウスオン時*/
.contact-btn a:hover {
	cursor: pointer;
	opacity: 1;
	filter: brightness(1.2);	/*少しだけ明るく。*/
	transform: scale(1.02);		/*実寸の102%に拡大*/
}


/*sectionタグ*/
section,
main > article,
.c2,
#footermenu {
	padding: 3% 2px;		/*上下、左右へのボックス内の余白*/
}

/*mainブロック設定
---------------------------------------------------------------------------*/
/*mainブロックの設定*/
main {	
	padding: 60px 0px;	/*上下、左右へのブロック内の余白*/
}


/*mainブロックのpタグ*/
main p {
	margin: 0 20px 30px;	/*上、左右、下へ空けるスペース*/
}

main p + p {margin-top: -10px;}


/*テーブル
---------------------------------------------------------------------------*/
/*テーブル１行目に入った見出し部分（※caption）*/
.area1 caption {
	font-weight: bold;		/*太字*/
	padding: 10px 5px;		/*上下、左右へのボックス内の余白。*/
	border: 3px solid #4d9c08;	/*枠線の幅、線種、色*/
	color: #4d9c08;			/*文字色*/
	background: #fff8d5;	/*背景色*/
	font-size: 1.2em;		/*文字サイズ。親要素の1.2倍。*/
	margin-bottom: 15px;	/*下に空けるスペース*/
	border-radius: 5px;		/*角を丸くする指定*/
}

/*area1テーブルブロック設定*/
.area1 {
	border-top: 1px solid #ccc;	/*テーブルの一番上の線。幅、線種、色*/
	width: 100%;
	margin: 0 auto 30px;		/*最後の「30px」がテーブルの下に空けるスペースです*/
}

/*tr（１行分）タグ設定*/
.area1 tr {
	border-bottom: 1px solid #ccc;	/*テーブルの下線。幅、線種、色*/
}

/*th（左側）、td（右側）の共通設定*/
.area1 th, .area1 td {
	padding: 20px 15px;		/*上下、左右へのボックス内の余白*。基本的に数行上の「.area1 caption」のpaddingと揃えておけばOKです。*/
	word-break: break-all;	/*英語などのテキストを改行で自動的に折り返す設定。これがないと、テーブルを突き抜けて表示される場合があります。*/
}

/*th（左側）のみの設定*/
.area1 th {
	width: 20%;			/*幅*/
	text-align: left;	/*左よせにする*/
}





/*PAGE TOP（↑）設定
---------------------------------------------------------------------------*/
.pagetop-show {display: block;}

/*ボタンの設定*/
.pagetop a {
	display: block;text-decoration: none;text-align: center;z-index: 99;
	background: rgba(230,86,70,0.6);	/*背景色。*/
	position: fixed;		/*スクロールに追従しない(固定で表示)為の設定*/
	right: 20px;			/*右からの配置場所指定*/
	bottom: 20px;			/*下からの配置場所指定*/
	color: #fff;			/*文字色*/
	font-size: 1.5em;		/*文字サイズ*/
	width: 60px;			/*幅*/
	line-height: 60px;		/*高さ*/
	border-radius: 50%;		/*円形にする*/
}





/*フッター設定
---------------------------------------------------------------------------*/
footer small {font-size: 100%;}

footer {
	margin-top: 60px;
	font-size: 0.6em;		/*文字サイズ*/
	background: #333;		/*背景色*/
	color: #fff;			/*文字色*/
	text-align: center;		/*内容をセンタリング*/
	padding: 20px;			/*ボックス内の余白*/
}

/*リンクテキスト*/
footer a {color: #fff;text-decoration: none;}





h2,.about {
	padding: 5px 20px;		/*上下、左右への余白*/
	margin: 0 0 20px;		/*上、左右、下に空けるスペース*/
	background: #1e90ff;	/*背景色*/
	border-radius: 5px;		/*角を丸くする指定*/
	border: 1px solid #ddd;	/*枠線の幅、線種、色*/
	font-size: 1.6em;
	color: #fff;
	letter-spacing: 0.7rem;
}


h3,.alignwide{
	font-size: 1.8em;
	text-align: left;
    border-bottom: 2px solid #1e90ff;
    color: #1e90ff;
    width: 100%;
	margin-bottom: 20px;
    padding: 0.5rem 0 0 2rem;
    position: relative;
    font-weight: bold;
}

.shoparea {
	max-width: 1200px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.entry-content > div.shoparea > .shopbox{
	width: 32%;
    border: solid 2px #ff5ec7;
    margin: 0.5% 0.5% 1%;
    padding: 0;
    overflow: hidden;
}

.shoparea .shopbox .name {
    background: #ff5ec7;
    color: #fff;
    padding: 0.1rem 0.3rem 0.1rem 1rem;
    margin: 0;
    font-size: 1.3rem;
	font-weight: 600;
	text-align: center;
}

.shoparea .shopbox div {
	padding: 0.5rem 0rem 0.5rem 5rem;
    font-size: 1.1rem;
	letter-spacing: 0.05rem;
    position: relative;
	text-align: left;
}

.shoparea span.komoku {
	font-size: 0.9rem;
    position: absolute;
    left: 3px;
    top: 4px;
    font-weight: bold;
    color: #ff5ec7;
}

.detail {
	background: #fbfbfb;
    border-top: 1px solid #eeeeee;
	padding: 10px 0!important;
	display: flex;
	justify-content: center;
}

.detail a{
	display: inline-block;
    background: #808080;
    border-radius: 0.5rem;
    padding: 0.3rem 1.5rem;
    font-weight: bold;
    color: #fff;
    font-size: 1rem;
	text-decoration: none;
}




/*media Queries PCサイズ（960px）以上で適応したいCSS - PCのみ
---------------------------------------------------------------------------------------------------*/
@media print, screen and (min-width: 960px) {


	/*-- ここまで --*/
}


/*media Queries タブレットサイズ（600px～959px）のみで適応したいCSS -タブレットのみ
---------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 600px) and (max-width: 959px) {

	
/*全体の設定
---------------------------------------------------------------------------*/
html, body {
	font-size: 13px;	/*基準となるフォントサイズの上書き*/
}
	
/*mainブロック設定
---------------------------------------------------------------------------*/
/*mainブロックの設定*/
main {	
	padding: 80px 2px;	/*上下、左右へのブロック内の余白*/
}

	
/*header（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
	background: #ffb9fd;	/*背景色*/
	position: relative;
}

/*ロゴ画像*/
header #logo {margin: 0;}

/*ロゴ画像（※トップページ以外）*/
.page header #logo img {
	display: block;
	height: 70px;	/*画像の高さ。*/
	margin: 0 auto;	/*左右中央に配置*/
}

.wrap-a {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 40px;
/*
	display: flex;
	justify-content:space-between;
	align-items: center;
*/
}

/*WEBサイトへのボタン設定
---------------------------------------------------------------------------*/
.contact-btn {
	margin-left: 15px;
}

.contact-btn a {
	text-decoration: none;border: none;
	display: block;
	border-radius: 10px;
	font-size: 16px;
	font-weight: 800;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
	background: #d7003a;
/*	background: #FFC042;*/
	letter-spacing: 0.05em;	/*文字間隔を少し広くする指定*/
	color: #fff;			/*文字色*/
	transition: 0.3s;		/*hoverまでにかける時間。0.3秒。*/
	padding: 8px 10px;	/*上下、左右へのボタン内の余白*/
}

/*ボタンのマウスオン時*/
.contact-btn a:hover {
	cursor: pointer;
	opacity: 1;
	filter: brightness(1.2);	/*少しだけ明るく。*/
	transform: scale(1.02);		/*実寸の102%に拡大*/
}
	
	
	
	
/*テーブル
---------------------------------------------------------------------------*/
/*テーブル１行目に入った見出し部分（※caption）*/
.area1 caption {
	font-weight: bold;		/*太字*/
	padding: 10px 5px;		/*上下、左右へのボックス内の余白。*/
	border: 3px solid #4d9c08;	/*枠線の幅、線種、色*/
	color: #4d9c08;			/*文字色*/
	background: #fff8d5;	/*背景色*/
	font-size: 1.2em;		/*文字サイズ。親要素の1.2倍。*/
	margin-bottom: 15px;	/*下に空けるスペース*/
	border-radius: 5px;		/*角を丸くする指定*/
}

/*area1テーブルブロック設定*/
.area1 {
	border-top: 1px solid #ccc;	/*テーブルの一番上の線。幅、線種、色*/
	width: 100%;
	margin: 0 auto 30px;		/*最後の「30px」がテーブルの下に空けるスペースです*/
}

/*tr（１行分）タグ設定*/
.area1 tr {
	border-bottom: 1px solid #ccc;	/*テーブルの下線。幅、線種、色*/
}

/*th（左側）、td（右側）の共通設定*/
.area1 th, .area1 td {
	padding: 10px 5px;		/*上下、左右へのボックス内の余白*。基本的に数行上の「.area1 caption」のpaddingと揃えておけばOKです。*/
	word-break: break-all;	/*英語などのテキストを改行で自動的に折り返す設定。これがないと、テーブルを突き抜けて表示される場合があります。*/
}

/*th（左側）のみの設定*/
.area1 th {
	width: 30%;			/*幅*/
	text-align: left;	/*左よせにする*/
}	

	
	

h2,.about {
	padding: 5px 20px;		/*上下、左右への余白*/
	margin: 0 0 20px;		/*上、左右、下に空けるスペース*/
	background: #1e90ff;	/*背景色*/
	border-radius: 5px;		/*角を丸くする指定*/
	border: 1px solid #ddd;	/*枠線の幅、線種、色*/
	font-size: 1.6em;
	color: #fff;
	letter-spacing: 0.7rem;
}


h3,.alignwide{
	font-size: 1.8em;
	text-align: left;
    border-bottom: 2px solid #1e90ff;
    color: #1e90ff;
    width: 100%;
	margin-bottom: 20px;
    padding: 0.5rem 0 0 2rem;
    position: relative;
    font-weight: bold;
}

/*
.shoparea {
	max-width: 1200px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
*/

.entry-content > div.shoparea > .shopbox{
	width: 47%;
    border: solid 2px #ff5ec7;
    margin: 0.5% 1% 1%;
    padding: 0;
    overflow: hidden;
}

.shoparea .shopbox .name {
    background: #ff5ec7;
    color: #fff;
    padding: 0.1rem 0.3rem 0.1rem 1rem;
    margin: 0;
    font-size: 1.3rem;
	font-weight: 600;
	text-align: center;
}

.shoparea .shopbox div {
	padding: 0.5rem 0rem 0.5rem 5.5rem;
    font-size: 1.2rem;
	letter-spacing: 0.05rem;
    position: relative;
	text-align: left;
}

.shoparea span.komoku {
	font-size: 1rem;
    position: absolute;
    left: 3px;
    top: 4px;
    font-weight: bold;
    color: #ff5ec7;
}

.detail {
	background: #fbfbfb;
    border-top: 1px solid #eeeeee;
	padding: 10px 0!important;
	display: flex;
	justify-content: center;
}

.detail a{
	display: inline-block;
    background: #ff5ec7;
    border-radius: 0.5rem;
    padding: 0.3rem 1.5rem;
    font-weight: bold;
    color: #fff;
    font-size: 1.15rem;
	text-decoration: none;
}	
	
	
	
	
	
	
	
	
	
	

	/*-- ここまで --*/
	/*　※注意！　下の閉じカッコ　}　はこのブロックに必要なので、削除しないで！*/
}	
	


/*media Queries スマホサイズ（599px）以下で適応したいCSS - スマホのみ
---------------------------------------------------------------------------------------------------*/
@media print, screen and (max-width: 599px) {

/*全体の設定
---------------------------------------------------------------------------*/
html, body {
	font-size: 13px;	/*基準となるフォントサイズの上書き*/
}

	
	
/*sectionタグ*/
section,
main > article,
.c2,
#footermenu {
	padding: 3% 50px;		/*上下、左右へのボックス内の余白*/
}	
	
/*header（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
	background: #ffb9fd;	/*背景色*/
	position: relative;
}

/*ロゴ画像*/
header #logo {margin: 0;}

/*ロゴ画像（※トップページ以外）*/
body:not(.home) header #logo img {
	display: block;
	height: 45px;	/*画像の高さ。*/
	margin: 0 auto;	/*左右中央に配置*/
}



.wrap-a {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 15px;
/*
	display: flex;
	justify-content:space-between;
	align-items: center;
*/
}

/*WEBサイトへのボタン設定
---------------------------------------------------------------------------*/
.contact-btn {
	margin-left: 0px;
}

.contact-btn a {
	text-decoration: none;border: none;
	display: block;
	border-radius: 10px;
	font-size: 13px;
	font-weight: 800;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
	background: #d7003a;
/*	background: #FFC042;*/
	letter-spacing: 0.05em;	/*文字間隔を少し広くする指定*/
	color: #fff;			/*文字色*/
	transition: 0.3s;		/*hoverまでにかける時間。0.3秒。*/
	padding: 4px 8px;	/*上下、左右へのボタン内の余白*/
}

/*ボタンのマウスオン時*/
.contact-btn a:hover {
	cursor: pointer;
	opacity: 1;
	filter: brightness(1.2);	/*少しだけ明るく。*/
	transform: scale(1.02);		/*実寸の102%に拡大*/
}
	
	
	
	
	
/*テーブル
---------------------------------------------------------------------------*/
/*テーブル１行目に入った見出し部分（※caption）*/
.area1 caption {
	font-weight: bold;		/*太字*/
	padding: 10px 5px;		/*上下、左右へのボックス内の余白。*/
	border: 3px solid #4d9c08;	/*枠線の幅、線種、色*/
	color: #4d9c08;			/*文字色*/
	background: #fff8d5;	/*背景色*/
	font-size: 1.2em;		/*文字サイズ。親要素の1.2倍。*/
	margin-bottom: 15px;	/*下に空けるスペース*/
	border-radius: 5px;		/*角を丸くする指定*/
}

/*area1テーブルブロック設定*/
.area1 {
	border-top: 1px solid #ccc;	/*テーブルの一番上の線。幅、線種、色*/
	width: 100%;
	margin: 0 auto 30px;		/*最後の「30px」がテーブルの下に空けるスペースです*/
}

/*tr（１行分）タグ設定*/
.area1 tr {
	border-bottom: 1px solid #ccc;	/*テーブルの下線。幅、線種、色*/
}

/*th（左側）、td（右側）の共通設定*/
.area1 th, .area1 td {
	padding: 10px 5px;		/*上下、左右へのボックス内の余白*。基本的に数行上の「.area1 caption」のpaddingと揃えておけばOKです。*/
	word-break: break-all;	/*英語などのテキストを改行で自動的に折り返す設定。これがないと、テーブルを突き抜けて表示される場合があります。*/
}

/*th（左側）のみの設定*/
.area1 th {
	width: 30%;			/*幅*/
	text-align: left;	/*左よせにする*/
}		
	


	
	
	
	
h2,.about {
	padding: 5px 20px;		/*上下、左右への余白*/
	margin: 0 0 20px;		/*上、左右、下に空けるスペース*/
	background: #1e90ff;	/*背景色*/
	border-radius: 5px;		/*角を丸くする指定*/
	border: 1px solid #ddd;	/*枠線の幅、線種、色*/
	font-size: 1.6em;
	color: #fff;
	letter-spacing: 0.7rem;
}


h3,.alignwide{
	font-size: 1.8em;
	text-align: left;
    border-bottom: 2px solid #1e90ff;
    color: #1e90ff;
    width: 100%;
	margin-bottom: 20px;
    padding: 0.5rem 0 0 2rem;
    position: relative;
    font-weight: bold;
}

.shoparea {
    display: flex;
    justify-content: center;
}

.entry-content > div.shoparea > .shopbox{
	width: 92%;
    border: solid 2px #ff5ec7;
    margin: 1% 0.5% 1.5%;
    padding: 0;
    overflow: hidden;
}

.shoparea .shopbox .name {
    background: #ff5ec7;
    color: #fff;
    padding: 0.1rem 0.3rem 0.1rem 1rem;
    margin: 0;
    font-size: 1.34rem;
	font-weight: 600;
	text-align: center;
}

.shoparea .shopbox div {
	padding: 0.5rem 0rem 0.5rem 5.5rem;
    font-size: 1.2rem;
	letter-spacing: 0.05rem;
    position: relative;
	text-align: left;
}

.shoparea span.komoku {
	font-size: 0.95rem;
    position: absolute;
    left: 3px;
    top: 4px;
    font-weight: bold;
    color: #ff5ec7;
}

.detail {
	background: #fbfbfb;
    border-top: 1px solid #eeeeee;
	padding: 10px 0!important;
	display: flex;
	justify-content: center;
}

.detail a{
	display: inline-block;
    background: #808080;
    border-radius: 0.5rem;
    padding: 0.3rem 1.5rem;
    font-weight: bold;
    color: #fff;
    font-size: 1.12rem;
	text-decoration: none;
}
	
	

	
	
	
	
	/*-- ここまで --*/
	/*　※注意！　下の閉じカッコ　}　はこのブロックに必要なので、削除しないで！*/
}
