@charset "UTF-8";
/*
Theme Name: JNThema
Author: PAPAPA
Version: 1.2
*/

/* ============================================================
   style.css — common.css / main.css / phone.css 統合版
   ------------------------------------------------------------
   構成:
   1. カスタムプロパティ・全メディア共通(旧 common.css)
   2. PC・スマホ共通(旧 main.css / phone.css の重複を統合)
   3. PC用  @media screen and (min-width: 642px)   (旧 main.css)
   4. SP用  @media screen and (min-width: 319px)
            and (max-width: 641px)                 (旧 phone.css)

   カラーパレット(:root の変数を書き換えると全体に反映):
     --white        #FFFFFF(白)  背景・文字・枠線
     --blue         #009FC9(青)  リンク・見出し・ボタン
     --red          #E52387(赤)  強調・見出し・送信ボタン
     --yellow       #FF8E1E(黄)  CTA・メニュー・アクセント
     --blue-btn     #00BAEB      ボタン用の明るい青
     --yellow-light #FFBA75      黄のホバー色
     --yellow-pale  #FFA44B      Q&A見出しのオレンジ
   ============================================================ */

/* ============================================================
   1. カスタムプロパティ・全メディア共通(旧 common.css)
   ============================================================ */
:root {
	/* Color Palette */
	--white:  #FFFFFF;
	--blue:   #009FC9;
	--red:    #E52387;
	--yellow: #FF8E1E;
	--blue-btn:     #00BAEB;
	--yellow-light: #FFBA75;
	--yellow-pale:  #FFA44B;

	/* Typography */
	--fs-base: clamp(14px, 1.1vw + 10px, 16px);
	--fs-sm:   clamp(12px, 0.8vw + 9px, 14px);
	--fs-lg:   clamp(16px, 1.4vw + 12px, 20px);
	--fs-xl:   clamp(20px, 2.0vw + 14px, 28px);

	/* Spacing */
	--space-1: clamp(4px, 0.5vw, 8px);
	--space-2: clamp(8px, 1.0vw, 16px);
	--space-3: clamp(12px, 1.5vw, 24px);
	--space-4: clamp(16px, 2.0vw, 32px);

	/* Layout */
	--radius: 16px;
	--container: min(1100px, 92vw);
	--shadow: 0 10px 30px rgba(0,0,0,.08);
	--border: 1px solid rgba(0,0,0,.08);
}

body {
	font-size: var(--fs-base);
	line-height: 1.6;
}

.container {
	width: var(--container);
	margin-inline: auto;
	padding-inline: var(--space-3);
}

/* reCAPTCHAのバッジを非表示にする */
.grecaptcha-badge { visibility: hidden; }

/* ============================================================
   2. PC・スマホ共通
      (main.css と phone.css で完全に同一だった宣言を統合)
   ============================================================ */
@media screen and (min-width: 319px) {

	/* ---------- リセット ---------- */
	body {
		margin: 0;
		padding: 0;
		background-color: #f5f5f5;
		font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
		font-size: 14px;
	}
	header, footer, h1, h2, h3, h4, p, table, tr, th, td, ul, ol, li, dl, dd, dt {
		margin: 0;
		padding: 0;
	}
	a img {
		text-decoration: none;
		border-style: none;
	}

	/* ---------- 基本エフェクト ---------- */
	html {
		scroll-behavior: smooth;
	}
	a {
		transition: 0.3s;
		color: var(--blue);
	}
	a:hover {
		transition: 0.3s;
		color: var(--yellow);
	}
	a:active {
		color: var(--blue);
	}
	a:focus-visible {
		outline: 2px solid var(--blue);
		outline-offset: 2px;
	}

	/* ---------- エントリーボタン ---------- */
	p.entry-btn {
		display: block;
		width: 70%;
		margin: 20px auto;
	}
	p.entry-btn a {
		font-size: 95%;
		background-color: var(--yellow);
		text-decoration: none;
		color: var(--white);
		text-align: center;
		display: block;
		line-height: 1.7em;
		border-radius: 999px;
		border: rgba(0,0,0,0.10) 1px solid;
		border-bottom: rgba(0,0,0,0.10) 2px solid;
		box-shadow: 0 4px 12px rgba(255,142,30,0.25);
	}
	p.entry-btn a:hover {
		transform: translateY(-2px);
		box-shadow: 0 8px 18px rgba(255,142,30,0.35);
	}

	/* ---------- ヘッダ(共通部分) ---------- */
	#head #tel-mail-box p a {
		color: var(--red);
	}
	#head #tel-mail-box:target .close a:before {
		content: "x";
	}

	/* ---------- メニュー ---------- */
	#menu input[type="radio"] {
		display: none;
	}

	/* ---------- コンテンツメニュー ---------- */
	#cnt-menu {
		list-style-type: none;
		line-height: 20px;
		min-height: 40px;
	}
	#cnt-menu li a {
		text-decoration: none;
	}
	#cnt-menu2 {
		list-style-type: none;
	}
	#cnt-menu2 li a {
		display: block;
		float: left;
		width: 60px;
		margin-right: 5px;
		text-align: center;
		border-radius: 3px;
		background-color: var(--white);
	}
	#cnt-menu2 li a:hover {
		background-color: #e6e6e6;
	}

	/* ---------- ボタンリスト ---------- */
	ul.btn-list {
		width: 100%;
		box-sizing: border-box;
		list-style: none;
		display: flex;
		display: -webkit-flex;
		flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		justify-content: space-around;
		-webkit-justify-content: space-around;
	}
	ul.btn-list li {
		display: block;
		margin: 0 0 20px;
		line-height: 40px;
		text-align: center;
		background-color: #E0ECEF;
	}
	ul.btn-list li a {
		display: block;
		color: var(--blue-btn);
		text-decoration: none;
	}
	ul.btn-list li a:hover {
		background-color: rgba(0,0,0,0.16);
	}

	/* ---------- セクション ---------- */
	.index-section,
	.event-section {
		margin: 0 0 30px;
	}
	.index-section h2 + span,
	.event-section h3 + span {
		display: block;
		width: 100%;
		overflow: hidden;
	}
	.index-section h2 + span img,
	.event-section h3 + span img {
		width: 100%;
		height: auto;
	}

	/* ---------- 勤務地 ---------- */
	img.shop {
		position: relative;
		top: 25px;
		background-color: var(--white);
		box-shadow: rgba(0,0,0,0.30) 0px 2px 3px 0px;
		display: block;
		margin: auto auto;
		width: 92%;
		height: auto;
		padding: 5px;
		border-radius: 3px;
	}
	span.shop {
		position: relative;
		top: 25px;
		left: 70%;
		display: block;
		width: 24px;
		height: 25px;
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/shop-icon.png);
	}

	/* ---------- コンセプト(装飾画像) ---------- */
	.romantic:after {
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/concept-Romantic.png);
	}
	.modern:after {
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/concept-Modern.png);
	}
	.pop:after {
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/concept-Pop.png);
	}
	.casual:after {
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/concept-CasualChic.png);
	}
	.girly:after {
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/concept-girly.png);
	}

	/* ---------- スタッフ紹介 ---------- */
	dl.staff {
		padding: 10px;
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/bg-stripe-white.png);
		background-color: beige;
		border: 1px solid rgba(219,219,129,1.00);
		position: relative;
		border-radius: 3px;
	}
	dl.staff:before {
		position: absolute;
		content: "";
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 10px 15px 10px;
		border-color: transparent transparent #dcda81 transparent;
		top: -15px;
		right: 0;
		left: 0;
		margin: auto;
	}
	dl.staff dt {
		background-color: rgba(207,207,90,1.00);
		padding: 5px 10px;
		margin: 0 0 10px;
		border-radius: 5px;
		color: var(--white);
	}
	dl.staff dd {
		padding: 0 10px;
		color: #CCC949;
		margin: 0 0 15px;
		line-height: 1.8em;
	}

	/* ---------- SNS ---------- */
	.sns_list {
		display: flex;
		list-style: none;
	}
	.sns_list li + li {
		margin: 0 0 0 15px;
	}
	.sns_list li a {
		border-radius: 50%;
		background: #333;
		display: block;
		vertical-align: middle;
		text-align: center;
		width: 30px;
		height: 30px;
		line-height: 30px;
		font-size: 24px;
		transition: .3s;
		color: var(--white);
		padding: 4px;
		box-shadow: #666 1px 1px 3px;
	}
	i.fab.fa-instagram, i.fab.fa-tiktok {
		line-height: 1.2em;
	}

	/* ---------- twitter ---------- */
	#twit-main {
		margin-bottom: 10px;
	}
	#twit-main h3 {
		margin: 0;
		padding: 0;
		font-size: 14px;
	}
	#twit-main h4 {
		margin: 0;
		padding: 0;
		font-size: 12px;
	}
	.twtr-hd { /* ツイッターヘッダ */
		display: none;
	}
	.twtr-hd img {
		float: left;
	}
	.twtr-tweets { /* ツイッターささやき個別 */
		margin-right: auto;
		margin-left: auto;
		border-radius: 5px;
	}
	.twtr-tweets a:link,
	.twtr-tweets a:hover,
	.twtr-tweets a:visited,
	.twtr-tweets a:active {
		color: var(--white);
	}

	/* ---------- SlideShow ---------- */
	.slide {
		width: 100%;
		margin: auto;
		background-color: rgba(240,240,240,1.00);
	}
	.slide-shadow {
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/slide-box-shadow.png);
		background-position: center top;
		background-size: 98% auto;
		background-repeat: no-repeat;
		height: 20px;
		display: block;
	}
	.bx-pager {
		display: none;
	}
	a.bx-prev {
		display: none;
	}
	a.bx-next {
		display: none;
	}

	/* ---------- wheel ---------- */
	.wheel-box01 a {
		text-decoration: none;
	}
	.wheel li a {
		display: block;
	}

	/* ---------- ブログ ---------- */
	iframe {
		width: 100%;
	}
	div.postmetadata {
		display: block;
		background-color: rgba(237,237,237,1.00);
		font-size: 90%;
	}
	#root .alignright {
		text-align: right;
	}
	#right-box ul li.widget {
		list-style: none;
		line-height: 1.8em;
	}
	#right-box ul li.widget h2 {
		color: var(--white);
		padding: 10px;
		font-size: 16px;
		font-weight: normal;
		background-color: rgba(26,26,26,1.00);
		margin: 0;
	}
	#right-box ul li.widget ul {
		list-style: none;
		margin: 0 0 30px 0;
		padding: 10px;
	}
	#right-box ul li.widget ul li {
		border-bottom: rgba(0,0,0,0.12) 1px dashed;
		padding: 0 0 5px 0;
		margin: 0 0 5px 0;
	}
	#right-box ul li.widget ul li a {
		text-decoration: none;
	}
	#right-box ul li.widget #calendar_wrap {
		padding: 10px 10px 30px;
	}
	#right-box ul li.widget #calendar_wrap table {
		width: 100%;
		height: auto;
	}
	#right-box ul li.widget #calendar_wrap table td {
		text-align: center;
	}
	div.tags {
		font-size: 85%;
		margin: 0 0 30px;
	}
	div.tags a {
		background-color: rgba(0,156,197,0.78);
		color: var(--white);
		padding: 5px;
		margin: 0 0 5px;
		text-decoration: none;
		display: inline-block;
		border-radius: 4px;
	}

} /* end 共通 */

/* ============================================================
   3. PC用(旧 main.css / min-width: 642px)
   ============================================================ */
@media screen and (min-width: 642px) {

	@-webkit-keyframes PRanime {
		0%   { left: 0px; }
		25%  { left: -5px; }
		50%  { left: 5px; }
		75%  { left: -5px; }
		100% { left: 0px; }
	}
	@-webkit-keyframes PRanime2 {
		0% { top: -200px; }
	}
	@-webkit-keyframes FeedAnime {
		0%   { bottom: -100px; }
		50%  { bottom: -400px; }
		75%  { bottom: -380px; }
		100% { bottom: -400px; }
	}

	/* ---------- リセット ---------- */
	body {
		color: rgba(73,73,73,1.00);
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/body-bg.webp);
		background-repeat: repeat;
		background-position: left top;
	}
	.pc-none {
		display: none;
	}
	.clearfix:after {
		content: ".";
		display: block;
		height: 0;
		font-size: 0;
		clear: both;
		visibility: hidden;
	}

	/* ---------- 基本エフェクト ---------- */
	strong {
		color: var(--red);
	}
	p.entry-btn {
		margin: 20px auto !important;
	}
	p.entry-btn a {
		padding: 15px;
	}

	/* ---------- ヘッダ ---------- */
	header {
		height: 102px;
		width: 100%;
		position: absolute;
		top: 0px;
	}
	#head {
		width: 840px;
		height: 102px;
		margin-right: auto;
		margin-left: auto;
		position: relative;
		z-index: 50;
	}
	#head h1 {
		font-size: 12px;
		font-weight: normal;
		color: rgba(147,147,147,1.00);
		position: absolute;
		left: 140px;
		line-height: 20px;
	}
	#head a img.logo {
		background-color: var(--white);
		height: 101px;
		width: auto;
		padding: 0 3px 1px;
		box-shadow: #333 1px 1px 4px, inset #EAEAEA 0px -15px 40px;
		border-radius: 0px 0px 3px 3px;
		position: absolute;
		right: 0px;
		top: 0px;
		-webkit-animation-name: PRanime2;
		-webkit-animation-delay: 0s;
		-webkit-animation-duration: 1s;
		-webkit-animation-iteration-count: 1;
	}
	#head a img:hover {
		opacity: 0.8;
	}
	#head #tel-mail {
		background-color: var(--yellow);
		box-shadow: 1px 1px 4px #666;
		border-right: 1px var(--white) solid;
		border-bottom: 1px var(--white) solid;
		border-left: 1px var(--white) solid;
		border-radius: 0px 0px 3px 3px;
		position: absolute;
		top: 0px;
		width: 130px;
		line-height: 20px;
		transition: 0.5s;
		text-align: center;
		background-image: -webkit-linear-gradient(270deg,rgba(255,255,255,0.09) 0%,rgba(0,0,0,0.09) 100%);
		background-image: linear-gradient(180deg,rgba(255,255,255,0.09) 0%,rgba(0,0,0,0.09) 100%);
	}
	#head #tel-mail a {
		margin: 0;
		padding: 0;
		text-decoration: none;
		display: block;
		color: var(--white);
	}
	#head #tel-mail a:hover {
		background-color: var(--yellow-light);
	}
	#head #tel-mail-box {
		position: absolute;
		top: -430px;
		left: -20px;
		padding: 15px;
		width: 270px;
		height: 380px;
		transition: 0.5s;
		line-height: 20px;
		color: var(--blue);
		z-index: 120;
	}
	#head #tel-mail-box textarea {
		font-size: 14px;
		line-height: 20px;
		width: 100%;
		max-width: 100%;
		height: 60px;
		max-height: 60px;
	}
	#head #tel-mail-box #submit-btn {
		background-color: var(--red);
		border: rgba(0,0,0,0.12) 1px solid;
		border-bottom-width: 2px;
		line-height: 40px;
		color: var(--white);
		cursor: pointer;
		padding: 0 20px;
	}
	#head #tel-mail-box input {
		font-size: 14px;
		line-height: 20px;
		margin-left: auto;
		margin-right: auto;
	}
	#head #tel-mail-box:target {
		top: 0px;
		transition: 0.5s;
		box-shadow: #666 3px 2px 3px;
		background-color: var(--white);
	}
	#head #tel-mail-box:target .close a {
		font-size: 75%;
		position: absolute;
		bottom: 0;
		right: 0;
		color: var(--white);
		text-decoration: none;
		background-color: var(--blue);
		display: block;
		text-align: center;
		opacity: 1;
		padding: 10px;
		margin-right: auto;
		margin-left: auto;
	}
	#head #tel-mail-box:target .close a:hover {
		opacity: 0.6;
	}
	#head #line {
		background-color: var(--yellow);
		box-shadow: 1px 1px 4px #666;
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/line.png), -webkit-linear-gradient(270deg,rgba(255,255,255,0.09) 0%,rgba(0,0,0,0.09) 100%);
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/line.png), linear-gradient(180deg,rgba(255,255,255,0.09) 0%,rgba(0,0,0,0.09) 100%);
		background-size: auto 80%, auto;
		background-position: 5px center, left top;
		background-repeat: no-repeat, repeat;
		border: none;
		border-right: 1px solid var(--white);
		border-bottom: 1px solid var(--white);
		border-left: 1px solid var(--white);
		border-radius: 0px 0px 3px 3px;
		display: none;
		position: absolute;
		top: 0px;
		left: 134px;
		width: 130px;
		line-height: 20px;
		transition: 0.5s;
		text-align: center;
	}
	#head #line a {
		margin: 0;
		padding: 0;
		text-decoration: none;
		display: block;
		color: var(--white);
	}

	/* ---------- wrapper ---------- */
	#wrapper {
		width: 100%;
		position: absolute;
		top: 122px;
		z-index: 25;
	}

	/* ---------- メニュー ---------- */
	#menu ul {
		list-style-type: none;
		height: 50px;
	}
	#menu li {
		display: block;
		float: left;
		height: 50px;
		width: 12.5%;
	}
	#menu li a {
		text-align: center;
		display: block;
		line-height: 50px;
		background-color: var(--white);
		text-decoration: none;
		font-size: 90%;
		border-left: 1px solid rgba(0,0,0,0.02);
		list-style-type: none;
	}
	#menu li:first-child a {
		border-left: none;
	}
	#menu li:last-child a {
		border-radius: 0 4px 0 0;
		color: var(--white);
		background-color: var(--yellow);
	}
	#menu li a:hover {
		box-shadow: inset 0 -3px 0 var(--blue);
		color: var(--blue);
	}
	#menu li:last-child a:hover {
		background-color: var(--blue);
		box-shadow: inset 0px 20px 40px #0096BB;
		text-shadow: -1px -1px 1px #0086A8;
	}

	/* ---------- メイン ---------- */
	#main {
		background-color: var(--white);
		width: 840px;
		margin-right: auto;
		margin-left: auto;
		border-radius: var(--radius);
		padding: 0 0 32px;
		margin-bottom: 32px;
		border: var(--border);
		box-shadow: var(--shadow);
		overflow: hidden;
	}

	/* ---------- ルートボックス ---------- */
	#root {
		line-height: 20px;
		padding: 10px 20px;
		margin: 24px 14px;
		background-color: #1a1a1a;
		color: var(--white);
		border-radius: 999px;
		font-size: 90%;
	}
	#root a {
		color: var(--white);
	}

	/* ---------- 左ボックス ---------- */
	#left-box {
		background-color: rgba(255,255,255,0.75);
		float: left;
		margin: 14px 0 24px 10px;
		padding: 28px 24px;
		box-sizing: border-box;
		width: 568px; /* コンテンツ幅520px+左右padding48px */
		position: relative;
		border-radius: 12px;
		box-shadow: 0 6px 20px rgba(0,0,0,0.06);
		z-index: 22;
		letter-spacing: 0.05em;
		line-height: 1.8;
	}
	#left-box .text-box + .text-box {
		margin-top: 48px;
		padding-top: 8px;
	}
	#left-box .img-full {
		display: block;
		background-color: var(--white);
		padding: 10px 0;
		height: auto;
		width: 500px;
		margin: auto;
		border-radius: 10px;
	}
	#left-box p {
		padding: 0 10px;
		margin: 0 0 26px;
		font-size: 15px;
		line-height: 1.9;
	}
	#left-box p.btn {
		text-align: center;
		display: block;
		width: 70%;
		padding: 40px 0;
		margin: auto;
	}
	#left-box p.btn a {
		display: block;
		color: var(--white);
		background-color: var(--blue-btn);
		line-height: 45px;
		text-decoration: none;
		border: 1px rgba(0,0,0,0.10) solid;
		border-bottom: 2px rgba(0,0,0,0.15) solid;
		border-radius: 999px;
		box-shadow: 0 4px 12px rgba(0,186,235,0.25);
	}
	#left-box p.btn a:hover {
		transform: translateY(-2px);
		box-shadow: 0 8px 18px rgba(0,186,235,0.35);
	}
	#left-box h2 {
		font-weight: normal;
		line-height: 1.6em;
		margin: 36px 0 24px;
		padding-bottom: 12px;
		border-bottom: 2px solid #FBE4F0;
		border-bottom: 2px solid color-mix(in srgb, var(--red) 12%, transparent);
		min-height: 80px;
		color: var(--red);
		box-sizing: border-box;
		padding: 10px 0 0 90px;
		vertical-align: bottom;
		clear: both;
		font-size: 1.8rem;
		position: relative;
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/icon-heart01.png);
		background-repeat: no-repeat;
	}
	#left-box h2 a {
		color: var(--red);
		text-decoration: none;
		font-size: 1.8rem;
	}
	#left-box h3 {
		font-weight: 600;
		font-size: 18px;
		color: var(--red);
		padding: 10px 16px;
		position: relative;
		margin: 40px 0 18px;
		line-height: 1.5;
		letter-spacing: 0.06em;
		background-color: #FDF3F8;
		background-color: color-mix(in srgb, var(--red) 6%, var(--white));
		border-left: 4px solid var(--red);
		border-radius: 0 10px 10px 0;
	}
	#left-box h4 {
		color: #59c1dc;
		padding-left: 18px;
		line-height: 1.5;
		font-size: 1.5em;
		margin: 28px 0 12px;
		position: relative;
	}
	#left-box h4::before {
		content: "";
		position: absolute;
		left: 0;
		top: 0.55em;
		width: 8px;
		height: 8px;
		border-radius: 50%;
		background-color: var(--blue-btn);
	}
	#left-box #letter {
		background-color: var(--white);
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/letter-bg.png);
		border-radius: 3px;
		padding: 10px;
		color: #0E809C;
		border: 1px solid var(--blue);
	}
	#left-box #letter h3 {
		margin-bottom: 20px;
	}
	#left-box .n-table {
		width: 98%;
		box-sizing: border-box;
		margin: 30px auto;
		background-color: #A8AEB0;
		line-height: 25px;
		padding: 1px;
	}
	#left-box .n-table th {
		color: var(--white);
		padding: 10px;
		background-color: #C3C3C3;
	}
	#left-box .n-table td {
		padding: 10px;
		text-align: center;
		color: #000;
		background-color: rgba(255,255,255,0.89);
	}
	ul.btn-list {
		padding: 30px 10px 0;
	}
	ul.btn-list li {
		width: 42%;
		border-radius: 10px;
		overflow: hidden;
	}
	.n-list {
		padding: 10px;
		list-style-position: inside;
	}
	.n-list li {
		color: #333;
		padding-left: 30px;
		list-style-type: none;
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/icon-heart02.png);
		background-repeat: no-repeat;
		background-position: 0px top;
		line-height: 20px;
		background-size: auto 20px;
		padding-bottom: 5px;
	}
	.index-section h2 + span,
	.event-section h3 + span {
		margin: 0 0 20px;
	}

	/* ---------- 勤務地テーブル ---------- */
	.shop-table {
		width: 92%;
		margin: 0 auto 30px;
		background-color: var(--white);
		padding: 5px;
		border-radius: 3px;
		border: rgba(0,0,0,0.10) 1px solid;
		border-bottom: rgba(0,0,0,0.10) 2px solid;
	}
	.shop-table th {
		width: 80px;
		padding: 10px;
		background-color: #F7EEF3;
	}
	.shop-table tr {
		background-color: var(--white);
	}
	.shop-table td {
		padding: 10px;
	}
	.shop-table tr ul {
		list-style-type: none;
	}
	.concept {
		padding: 20px;
		border: 1px solid rgba(0,0,0,0.10);
		border-radius: 3px;
		background-color: beige;
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/bg-stripe-white.png);
		position: relative;
	}
	.concept h4 {
		font-size: 140%;
		font-weight: 400;
	}
	.concept:after {
		content: "";
		display: block;
		width: 240px;
		height: 55px;
		background-repeat: no-repeat;
		background-position: right top;
		position: absolute;
		top: -20px;
		right: -10px;
	}
	span.staff {
		display: block;
		width: 200px;
		height: 200px;
		border-radius: 100%;
		border: 3px solid var(--white);
		box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.10);
		overflow: hidden;
		position: relative;
		margin: auto;
	}
	span.staff img {
		height: 100%;
		position: absolute;
		left: -25%;
	}
	dl.staff {
		font-size: 110%;
	}

	/* ---------- 良くある質問と回答 ---------- */
	#QandA dt {
		line-height: 1.5;
		margin: 32px 10px 0;
		color: var(--white);
		background-color: var(--yellow-pale);
		position: relative;
		z-index: 10;
		font-size: 125%;
		border-radius: 28px;
		padding: 12px 24px 12px 60px;
		box-sizing: border-box;
	}
	#QandA dt:first-child {
		margin-top: 16px;
	}
	#QandA dt::before {
		content: "Q";
		position: absolute;
		left: 14px;
		top: 50%;
		transform: translateY(-50%);
		width: 32px;
		height: 32px;
		line-height: 32px;
		text-align: center;
		background-color: var(--white);
		color: var(--yellow-pale);
		border-radius: 50%;
		font-weight: 700;
		font-size: 85%;
	}
	#QandA dt:after {
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 15px 10px 0 10px;
		border-color: var(--yellow-pale) transparent transparent transparent;
		position: absolute;
		left: 40px;
		bottom: -13px;
		content: " ";
	}
	#QandA dd {
		min-height: 70px;
		margin-left: 30px;
		padding: 20px 10px 20px 90px;
		position: relative;
		z-index: 11;
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/QA-dd.png);
		background-repeat: no-repeat;
		background-position: 0px center;
		background-size: 70px auto;
		font-size: 110%;
		line-height: 1.7em;
	}
	#QandA dd a {
		color: var(--red);
	}
	#QandA dd ul {
		margin: 12px 0 0;
		padding-left: 1.6em;
	}
	#QandA dd ul li {
		line-height: 1.8;
		margin-bottom: 4px;
	}

	/* ---------- 登録メールフォーム ---------- */
	#mail_Form {
		background-color: var(--white);
		border-radius: 3px;
		padding: 20px 20px 40px;
		font-size: 120%;
	}
	#mail_Form p {
		background-color: var(--white);
		border-radius: 3px;
		padding: 10px;
		font-size: 90%;
		margin: 20px 0 0 0;
		color: var(--blue);
	}
	#mail_Form select {
		height: 30px;
		vertical-align: middle;
	}
	#mail_Form input[type="text"],
	#mail_Form input[type="email"],
	#mail_Form input[type="tel"] {
		line-height: 30px;
	}
	p.entry input[type="submit"] {
		margin: 20px 0 0 0;
		color: var(--white);
		background-color: var(--red);
		padding: 20px;
		width: 60%;
		border: none;
		cursor: pointer;
	}
	#mail_Form dt {
		font-size: 130%;
		line-height: 1.7em;
		background-color: #D7EAEF;
		padding: 10px;
		border-radius: 2px;
		color: rgba(128,128,128,1.00);
	}
	#mail_Form dd {
		padding: 10px;
		margin-bottom: 20px;
	}

	/* ---------- 右ボックス ---------- */
	#right-box {
		float: right;
		width: 240px;
		padding: 10px 0 0 0;
		margin-right: 10px;
		margin-bottom: 20px;
		z-index: 25;
	}
	#right-box h3 {
		color: var(--white);
		padding: 12px 14px;
		background-color: rgba(26,26,26,1.00);
		margin: 0 0 20px 0;
		border-radius: 10px;
		letter-spacing: 0.08em;
		font-weight: 600;
	}
	#right-box h4 {
		font-size: 14px;
		color: var(--red);
		margin: 24px 0 12px 0;
		letter-spacing: 0.06em;
	}
	#right-box #main-banner {
		position: relative;
		-webkit-animation-name: PRanime;
		-webkit-animation-delay: 1s;
		-webkit-animation-duration: 1.5s;
		-webkit-animation-iteration-count: 1;
	}
	#right-box #main-banner img,
	#right-box #banner img {
		display: block;
		height: auto;
		width: 236px;
		border: 2px solid var(--white);
		box-shadow: 0 3px 10px rgba(0,0,0,0.12);
		border-radius: 10px;
		margin-bottom: 14px;
		transition: 0.3s;
	}
	#right-box #main-banner img:hover,
	#right-box #banner img:hover {
		opacity: 0.9;
		transform: translateY(-3px);
		box-shadow: 0 8px 18px rgba(0,0,0,0.18);
	}
	#under-box {
		clear: both;
		padding: 20px;
		margin-right: 10px;
		margin-left: 10px;
	}

	/* ---------- blog ---------- */
	#rss-box-jn {
		background-color: var(--red);
		border-radius: 3px;
		padding: 5px;
		width: 140px;
		margin: 0 auto 10px;
		box-shadow: inset 0px 0px 20px 1px #C41772, 1px 1px 3px 1px #333;
		position: absolute;
		top: 40px;
		right: -5px;
		z-index: 1000;
	}
	.rss-title {
		padding: 5px;
		font-size: 80%;
		background-color: var(--white);
		border-radius: 3px;
		margin-bottom: 5px;
	}
	.rss-text {
		text-decoration: none;
		font-weight: bold;
	}

	/* ---------- SNS BOX ---------- */
	#right-box iframe {
		background-color: rgba(244,244,244,1.00);
		width: 96%;
		padding: 2%;
		height: 40px;
		border-radius: 3px;
		margin-left: auto;
		margin-right: auto;
		color: var(--white);
	}
	.sns_list li a:hover {
		background: #5e5e5e;
		transform: translateY(-2px);
	}

	/* ---------- フッタ ---------- */
	#foot {
		clear: both;
		line-height: 20px;
		color: var(--white);
		background-color: #000;
		padding: 44px 20px 28px;
	}
	#foot p {
		text-align: center;
		clear: both;
	}
	#foot #foot-menu {
		width: 840px;
		margin-right: auto;
		margin-left: auto;
	}
	#foot #foot-menu ul {
		list-style-type: none;
		width: 840px;
		margin-right: auto;
		margin-left: auto;
	}
	#foot #foot-menu li a {
		display: block;
		float: left;
		width: 90px;
		text-align: center;
		font-size: 90%;
		line-height: 20px;
		margin-bottom: 30px;
		text-decoration: none;
	}
	#foot #foot-menu li a:hover {
		color: var(--yellow);
	}

	/* ---------- wheel ---------- */
	.wheel-box01 {
		width: 100px;
		position: fixed;
		bottom: 100px;
		left: 300px;
		z-index: 100000000;
		display: none;
	}
	.wheel-button {
		background-color: rgba(0,0,0,1.00);
		font-size: 70%;
		position: relative;
		width: 80px;
		height: 80px;
		line-height: 80px;
		border-radius: 50%;
		text-align: center;
		display: block;
	}
	.wheel {
		margin: 0;
		padding: 0;
		list-style: none;
		width: 200px; /* this will determine the diameter of the circle */
		height: 200px; /* this will determine the diameter of the circle */
		visibility: hidden;
		position: relative;
		display: none;
	}
	.wheel li {
		background-color: rgba(0,0,0,1.00);
		width: 70px;
		height: 70px;
		line-height: 70px;
		text-align: center;
		border-radius: 50%;
		overflow: hidden;
		float: left;
	}

	/* ---------- SlideShow ---------- */
	.slide img {
		display: block;
		width: 100%;
		height: auto;
	}
	#slide {
		display: none;
	}

	/* ---------- ブログのみ使用 ---------- */
	iframe {
		height: 317px;
	}
	div.postmetadata {
		padding: 10px;
		margin: 0 0 10px 0;
	}
	p.next-blog {
		display: block;
		line-height: 40px;
		width: 500px;
		padding: 0;
		margin: 0 auto 30px;
		text-align: right;
	}
	p.next-blog a {
		display: block;
		text-decoration: none;
		font-size: 120%;
		color: var(--yellow);
	}

	/* ---------- feed ---------- */
	.feed-box {
		position: fixed;
		bottom: -400px;
		left: 60px;
		z-index: 100000;
		background-color: var(--white);
		border-left: rgba(0,0,0,0.20) 1px solid;
		border-top: rgba(0,0,0,0.20) 1px solid;
		border-right: rgba(0,0,0,0.20) 1px solid;
		border-radius: 3px 3px 0 0;
		box-shadow: rgba(0,0,0,0.20) 0px 3px 8px 0px;
		transition: 0.3s;
		-webkit-animation-name: FeedAnime;
		-webkit-animation-delay: 0s;
		-webkit-animation-duration: 4s;
		-webkit-animation-iteration-count: 1;
	}
	.feed-box:hover {
		bottom: 0px;
	}
	.feed-box h3 {
		border-radius: 3px 3px 0 0;
		font-weight: normal;
		font-size: 12px;
		line-height: 40px;
		padding: 0 15px;
		color: var(--yellow);
		border-bottom: 1px rgba(232,232,232,1.00) solid;
		background-color: rgba(226,226,226,0.50);
	}
	#feed {
		padding: 0;
		margin: 0 auto;
		width: 320px;
		height: 400px;
		overflow: auto;
		background: var(--white);
		line-height: 1.5em;
	}
	#feed ul li {
		font-size: 110%;
		padding: 10px;
		line-height: 1.7em;
	}
	#feed ul li:nth-child(even) {
		background-color: rgba(249,249,249,1.00);
	}
	#feed ul li a {
		text-decoration: none;
	}
	.wpcf7-spinner {
		display: none !important;
	}
	.eyecatching img {
		width: 100% !important;
	}

} /* end PC */

/* ============================================================
   4. スマホ用(旧 phone.css / min-width: 319px, max-width: 641px)
   ============================================================ */
@media screen and (min-width: 319px) and (max-width: 641px) {

	@-webkit-keyframes PRanime {
		0%   { left: -200px; }
		4%   { left: -250px; }
		12%  { left: -250px; }
		20%  { left: -250px; }
		25%  { left: -500px; }
		50%  { left: -1000px; }
		75%  { left: -250px; }
		100% { left: -200px; }
	}
	@-webkit-keyframes wrapAnime {
		0%   { opacity: 0.0; }
		100% { opacity: 1.0; }
	}

	/* ---------- リセット ---------- */
	body {
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/body-bg.webp), url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/body-bg2.webp);
		background-repeat: repeat, no-repeat;
		background-position: left top, center -10px;
		background-size: 60px auto, 100% auto;
		color: rgba(92,92,92,1.00);
	}
	.phone-none {
		display: none;
	}

	/* ---------- 基本エフェクト ---------- */
	img {
		transition: 1s;
	}
	p.entry-btn a {
		padding: 10px;
	}

	/* ---------- ヘッダ ---------- */
	#head {
		position: relative;
		box-shadow: rgba(0,0,0,0.30) 0 1px 3px 1px;
		z-index: 101;
		height: 85px;
		background-color: var(--white);
	}
	#head h1 {
		font-size: 12px;
		display: block;
		height: 30px;
		padding: 10px 0;
		margin: 0 55px 0 0;
		font-weight: normal;
		color: rgba(125,125,125,1.00);
	}
	#head a img.logo {
		background-color: var(--white);
		display: block;
		height: 50px;
		width: auto;
		box-sizing: border-box;
		padding: 0px 3px 1px;
		float: left;
	}
	#head #tel-mail {
		position: absolute;
		top: 50px;
		left: 0%;
		height: 35px;
		width: 50%;
		text-align: center;
		background-color: #2f2f2f;
		line-height: 35px;
		display: block;
		background-image: url(/img/mail.png);
		background-size: auto 50%;
		background-position: 10px center;
		background-repeat: no-repeat;
	}
	#head #tel-mail a {
		display: block;
		text-decoration: none;
		color: var(--white);
	}
	#head #tel-mail a:hover {
		color: #005266;
	}
	#head #tel-mail-box {
		position: absolute;
		top: -485px;
		height: 380px;
		width: 90%;
		background-color: var(--white);
		line-height: 20px;
		z-index: 50;
		transition: 1s;
	}
	#head #tel-mail-box img {
		display: block;
		height: 40px;
		width: auto;
		position: relative;
		margin: 0 auto;
		top: -6px;
		box-shadow: rgba(0,0,0,0.40) 0px 1px 1px 1px;
	}
	#head #tel-mail-box form {
		color: var(--blue);
	}
	#head #tel-mail-box textarea {
		line-height: 30px;
		height: 90px;
		max-height: 90px;
		width: 90%;
		max-width: 90%;
	}
	#head #tel-mail-box #submit-btn {
		display: block;
		width: 80px;
		color: var(--white);
		background-color: var(--red);
		margin-right: auto;
		margin-left: auto;
		line-height: 35px;
		text-align: center;
		margin-bottom: 10px;
		border-style: none;
	}
	#head #tel-mail-box input {
		line-height: 30px;
		width: 90%;
	}
	#head #tel-mail-box:target {
		position: absolute;
		top: 0px;
		height: 400px;
		width: 90%;
		padding: 5px;
		transition: 1s;
		box-shadow: #333 1px 1px 3px;
	}
	#head #tel-mail-box:target .close a {
		font-size: 80%;
		position: absolute;
		bottom: 0;
		right: 0;
		display: block;
		width: 80px;
		color: var(--white);
		text-decoration: none;
		background-color: var(--blue);
		margin-right: auto;
		margin-left: auto;
		line-height: 35px;
		text-align: center;
	}
	#head #line {
		position: absolute;
		top: 50px;
		left: 50%;
		height: 35px;
		width: 50%;
		text-align: center;
		background-color: #2f2f2f;
		line-height: 35px;
		display: block;
		background-image: url(https://jewel-nagoya.com/img/line.png);
		background-size: auto 70%;
		background-position: 10px center;
		background-repeat: no-repeat;
	}
	#head #line a {
		display: block;
		text-decoration: none;
		color: var(--white);
		border-left: 1px solid #ffffff87;
	}

	/* ---------- wrapper ---------- */
	#wrapper {
		padding: 0px;
		position: relative;
		width: 100%;
		border-radius: 3px;
		-webkit-animation-name: wrapAnime;
		-webkit-animation-delay: 0s;
		-webkit-animation-duration: 2s;
		-webkit-animation-iteration-count: 1;
	}

	/* ---------- メニュー ---------- */
	#menu {
		width: auto;
		height: auto;
		padding: 0;
		margin: 0;
	}
	#menu input[type="radio"] + label {
		background-color: var(--yellow);
		color: rgba(0,0,0,0.40);
		width: 50px;
		height: 50px;
		position: fixed;
		top: 0px;
		right: 0px;
		z-index: 10000;
		background-image: url(//jewel-nagoya.com/img/icon-burger.png);
		background-repeat: no-repeat;
		background-position: center center;
		box-shadow: rgba(0,0,0,0.30) 0px 3px 8px 0px;
	}
	#menu input[type="radio"]:checked + label {
		background-color: rgba(9,161,202,1.00);
		color: var(--white);
		background-image: url(//jewel-nagoya.com/img/icon-x.png);
		background-repeat: no-repeat;
		background-position: center center;
	}
	#menu input[type="radio"] + label + ul {
		position: fixed;
		left: -100%;
		top: 0;
		z-index: 10000;
	}
	#menu input[type="radio"]:checked + label + ul {
		left: 0%;
		top: 0;
	}
	#menu ul {
		padding: 0;
		height: 100%;
		width: calc(100% - 50px);
		background-color: rgba(0,183,232,1.00);
		list-style: none;
		box-shadow: rgba(0,0,0,0.10) 0px 3px 8px 0px;
		transition: 0.3s;
		overflow: auto;
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/bg-stripe-white.png);
	}
	#menu ul li {
		width: auto;
		margin: 10px 5px;
		display: block;
	}
	#menu ul li a {
		background-color: var(--blue);
		display: block;
		width: auto;
		height: 40px;
		line-height: 40px;
		text-align: center;
		overflow: hidden;
		color: var(--white);
		text-decoration: none;
		font-size: 90%;
		padding: 0 10px;
		border-radius: 25px;
		border: rgba(0,0,0,0.08) solid 1px;
		border-bottom: rgba(0,0,0,0.08) solid 2px;
		box-sizing: border-box;
	}

	/* ---------- 上部バナー ---------- */
	#top-pr {
		position: relative;
		padding: 0;
		margin: 0;
	}
	#top-pr img {
		width: 100%;
		height: auto;
		margin: 0;
		padding: 0;
	}

	/* ---------- ルートボックス ---------- */
	#root {
		line-height: 30px;
		padding: 0 16px;
		background-color: #1a1a1a;
		color: var(--white);
		font-size: 80%;
		margin: 10px 12px;
		border-radius: 999px;
	}
	#root a {
		color: var(--white);
	}
	#root a:hover {
		color: var(--white);
	}

	/* ---------- 左ボックス ---------- */
	#left-box {
		background-color: var(--white);
		margin: 0px 10px 24px;
		padding: 32px 16px;
		border-radius: 12px;
		box-shadow: 0 4px 14px rgba(0,0,0,0.05);
	}
	#cnt-menu {
		padding: 5px;
	}
	#left-box .img-full {
		display: block;
		background-color: var(--white);
		padding: 5px 0;
		height: auto;
		width: 100%;
		margin: auto;
		border-radius: 3px;
	}
	#left-box section {
		padding-top: 10px;
		padding-bottom: 10px;
		border-bottom: 3px solid var(--red);
	}
	#left-box p {
		padding: 10px;
		margin: 0 0 10px;
		line-height: 1.9;
		letter-spacing: 0.05em;
	}
	p.btn {
		text-align: center;
		display: block;
		width: 60%;
		padding: 0;
		margin: 0 auto 30px;
	}
	p.btn a {
		display: block;
		color: var(--white);
		background-color: var(--blue-btn);
		line-height: 45px;
		text-decoration: none;
		border: 1px rgba(0,0,0,0.10) solid;
		border-bottom: 2px rgba(0,0,0,0.15) solid;
		border-radius: 999px;
		box-shadow: 0 4px 12px rgba(0,186,235,0.25);
	}
	#left-box h2 {
		border: 1px solid rgba(0,0,0,0.35);
		background-image: url(/img/bg-kikagaku-white.png);
		background-size: auto 60px;
		background-color: var(--red);
		text-align: center;
		line-height: 50px;
		color: var(--white);
		margin: 30px auto 20px;
		padding: 0px 15px;
		font-size: 16px;
		font-weight: normal;
		text-overflow: ellipsis;
		overflow: hidden;
		height: 50px;
		border-radius: 10px;
		position: relative;
	}
	#left-box h2 a {
		color: var(--white);
		text-decoration: none;
	}
	#left-box h3 {
		font-weight: 600;
		color: var(--red);
		margin: 36px 10px 20px;
		padding: 12px 10px;
		line-height: 1.5;
		text-align: center;
		letter-spacing: 0.06em;
		background-color: #FDF3F8;
		background-color: color-mix(in srgb, var(--red) 6%, var(--white));
		border-radius: 10px;
	}
	#left-box h4 {
		color: #59c1dc;
		padding-top: 20px;
		padding-left: 10px;
		font-size: 1.8em;
	}
	#left-box #letter {
		color: #007593;
	}
	#left-box #letter h3 img {
		display: block;
		width: 100%;
	}
	#left-box .n-table {
		width: 90%;
		box-sizing: border-box;
		padding: 1px;
		color: #888;
		background-color: #F3F3F3;
		background-position: 0px 0px;
		margin: 10px auto 20px;
		font-size: 90%;
	}
	#left-box .n-table th {
		padding: 5px;
		background-color: #C0BDBF;
		color: var(--white);
	}
	#left-box .n-table td {
		padding: 5px;
		background-color: var(--white);
	}
	ul.btn-list {
		padding: 20px 10px;
	}
	ul.btn-list li {
		border-radius: 3px;
		width: 78%;
		font-size: 80%;
	}
	ul.btn-list li a {
		margin: auto;
	}
	.n-list {
		padding: 30px 20px;
		margin: 0 auto 20px;
		background-image: url(/img/bg-naname-white.png);
		background-color: #dbd7cf;
		width: 90%;
		max-width: 450px;
		box-sizing: border-box;
		border-radius: 5px;
		color: #645a45;
		font-size: 110%;
	}
	.n-list li {
		line-height: 1.8em;
		margin-left: 25px;
	}
	.index-section h2 + span,
	.event-section h3 + span {
		margin: 0;
	}

	/* ---------- 勤務地テーブル ---------- */
	.shop-table {
		width: 90%;
		margin-left: auto;
		margin-right: auto;
		font-size: 85%;
		line-height: 20px;
		border-radius: 3px;
		border: rgba(0,0,0,0.10) 1px solid;
		border-bottom: rgba(0,0,0,0.10) 2px solid;
	}
	.shop-table th,
	.shop-table td {
		display: block;
		width: 100%;
		box-sizing: border-box;
	}
	.shop-table th {
		padding: 3px;
		background-color: #F7EEF3;
	}
	.shop-table td {
		padding: 6px;
		background-color: var(--white);
		color: #6B8990;
	}
	.shop-table tr ul {
		margin-left: 35px;
	}
	.concept {
		padding: 20px 10px;
		margin: 20px 10px;
		border: 1px solid rgba(0,0,0,0.10);
		border-radius: 3px;
		background-color: beige;
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/bg-stripe-white.png);
		position: relative;
	}
	.concept h4 {
		font-size: 110%;
		font-weight: 400;
		margin: 0;
		padding: 0 10px !important;
	}
	.concept:after {
		content: "";
		display: block;
		width: 120px;
		height: 40px;
		background-repeat: no-repeat;
		background-position: right top;
		background-size: 100% auto;
		position: absolute;
		top: -5px;
		right: -5px;
	}
	span.staff {
		width: 100%;
	}
	span.staff img {
		width: 100%;
	}
	dl.staff {
		font-size: 85%;
	}

	/* ---------- 良くある質問と回答 ---------- */
	#QandA dt {
		padding: 12px 14px;
		line-height: 1.6;
		color: var(--white);
		background-color: var(--yellow-pale);
		text-align: center;
		position: relative;
		font-size: 110%;
		margin: 24px 0 0;
		border-radius: 10px 10px 0 0;
	}
	#QandA dt:first-child {
		margin-top: 8px;
	}
	#QandA dt:after {
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 12px 8px 0 8px;
		border-color: var(--yellow-pale) transparent transparent transparent;
		position: absolute;
		left: 50%;
		margin-left: -8px;
		bottom: -12px;
		content: " ";
	}
	#QandA dd {
		background-image: url(https://jewel-nagoya.com/blog/wp-content/themes/JNThema/img/QA-dd.png);
		background-repeat: no-repeat;
		background-position: right bottom;
		background-size: auto 40px;
		background-color: var(--white);
		color: #5B5B5B;
		padding: 16px 12px 44px;
		line-height: 1.8;
		border: 1px solid rgba(0,0,0,0.06);
		border-top: none;
		border-radius: 0 0 10px 10px;
	}
	#QandA dd ul {
		margin: 12px 0 0;
		padding-left: 1.6em;
	}
	#QandA dd ul li {
		line-height: 1.8;
		margin-bottom: 4px;
	}

	/* ---------- 登録メールフォーム ---------- */
	#mail_Form {
		background-color: var(--white);
		border-radius: 3px;
		padding: 3px;
	}
	#mail_Form p {
		background-color: var(--white);
		border-radius: 3px;
		padding: 10px;
		font-size: 80%;
		color: var(--blue);
		margin: 10px 0 0 0;
	}
	#mail_Form input {
		line-height: 35px;
		font-size: 120%;
		height: auto;
	}
	#mail_Form input[type="text"],
	#mail_Form input[type="tel"],
	#mail_Form input[type="email"] {
		width: 90%;
	}
	#mail_Form input[type="radio"] {
		display: none;
	}
	#mail_Form input[type="radio"] + label {
		background-color: rgba(0,0,0,0.10);
		color: rgba(0,0,0,0.21);
		padding: 5px 10px;
		border-radius: 2px;
	}
	#mail_Form input[type="radio"]:checked + label {
		background-color: var(--red);
		color: var(--white);
		border: rgba(0,0,0,0.12) 1px solid;
	}
	#mail_Form select {
		height: 35px;
		line-height: 35px;
		font-size: 120%;
	}
	#mail_Form input:focus {
		border-color: #D7D7D7;
	}
	#mail_Form select:focus {
		border-color: var(--red);
		box-shadow: #666 1px 1px 3px;
	}
	p.entry input[type="submit"] {
		margin: 0 auto;
		color: var(--white);
		background-color: var(--red);
		padding: 20px;
		width: 70%;
		border-radius: 3px;
		border: rgba(0,0,0,0.10) 1px solid;
		border-bottom: rgba(0,0,0,0.10) 2px solid;
		cursor: pointer;
	}
	#mail_Form dt {
		color: rgba(113,113,113,1.00);
		background-color: #D7EAEF;
		padding: 10px;
		margin: 0 0 10px;
		border-radius: 2px;
	}
	#mail_Form dd {
		padding: 10px;
		margin-bottom: 15px;
	}

	/* ---------- 右ボックス ---------- */
	#right-box {
		background-color: var(--white);
		margin: 12px 10px;
		padding: 16px 14px;
		border-radius: 12px;
		box-shadow: 0 4px 14px rgba(0,0,0,0.05);
	}
	#right-box h3 {
		font-weight: normal;
		padding: 5px;
		margin: 0;
		color: rgba(79,79,79,1.00);
	}
	#right-box h4 {
		padding: 5px 10px;
		background-color: rgba(173,173,173,1.00);
		color: var(--white);
		margin: 10px 0 5px 0;
		clear: both;
		border-radius: 2px;
		font-weight: normal;
	}
	#right-box #main-banner {
		padding-top: 5px;
	}
	#right-box #main-banner img {
		display: block;
		width: 48%;
		height: auto;
		float: left;
		margin: 0px 1% 5px;
		background-color: var(--white);
	}
	#right-box #banner {
		display: none;
	}
	#under-box {
		clear: both;
		line-height: 40px;
		background-color: var(--blue);
		width: 100%;
		box-sizing: border-box;
		border: solid 1px rgba(0,0,0,0.08);
		border-bottom: solid 2px rgba(0,0,0,0.08);
	}
	#under-box a {
		color: var(--white);
		text-decoration: none;
	}

	/* ---------- blog ---------- */
	.rss-box-jn {
		display: none;
	}

	/* ---------- SNS BOX ---------- */
	.sns-box {
		width: 100%;
		padding: 30px 0px;
		display: block;
		margin: 10px auto 30px;
		border-radius: 4px;
		background-color: rgba(0,0,0,0.03);
	}
	.sns-box ul.sns {
		width: 100%;
		font-size: 80%;
		margin: 0;
		padding: 0;
		overflow: hidden;
	}
	.sns-box ul.sns li {
		display: block;
		width: 20%;
		padding: 0px 5px;
		font-size: 9px;
		box-sizing: border-box;
		float: left;
		text-align: center;
	}
	.sns-box ul.sns li a {
		margin: auto;
	}
	.sns-box ul.sns li img {
		display: block;
		width: auto;
		margin: auto;
		max-width: 30px;
		height: auto;
	}
	.sns {
		padding: 20px 10px;
	}
	#right-box iframe {
		padding: 0 0;
		width: 100%;
		height: 30px;
		border-radius: 3px;
		margin: 0;
		color: var(--white);
	}

	/* ---------- twitter ---------- */
	#twit-main {
		display: none;
		clear: both;
	}

	/* ---------- フッタ ---------- */
	#foot {
		clear: none;
		background-color: #000;
		color: var(--white);
		box-sizing: border-box;
		width: 100%;
		padding: 0 0 30px;
	}
	#foot p {
		font-size: 80%;
		padding: 0px 20px;
		text-align: center;
	}
	#foot p a {
		color: var(--white);
		text-decoration: none;
	}
	#foot #foot-menu {
		margin: 0 0 20px;
		overflow: hidden;
	}
	#foot #foot-menu ul {
		list-style-type: none;
		font-size: 85%;
	}
	#foot #foot-menu li {
		display: block;
		float: left;
		width: 50%;
	}
	#foot #foot-menu li a {
		line-height: 40px;
		display: block;
		text-align: center;
		color: var(--white);
		text-decoration: none;
		background-color: var(--red);
		border-left: rgba(255,255,255,0.1) solid 1px;
		border-right: 1px solid rgba(0,0,0,0.03);
		border-top: rgba(255,255,255,0.1) solid 1px;
		border-bottom: 1px solid rgba(0,0,0,0.03);
		background-image: -webkit-linear-gradient(270deg,rgba(255,255,255,0.06) 0%,rgba(255,255,255,0.06) 46.63%,rgba(0,0,0,0.02) 51.29%,rgba(0,0,0,0.02) 100%);
		background-image: linear-gradient(180deg,rgba(255,255,255,0.06) 0%,rgba(255,255,255,0.06) 46.63%,rgba(0,0,0,0.02) 51.29%,rgba(0,0,0,0.02) 100%);
	}

	/* ---------- wheel(通常時:画面下中央) ---------- */
	.wheel-box01 {
		position: fixed;
		left: 50%;
		bottom: 10px;
		transform: translateX(-50%);
		width: 60px;
		z-index: 100000000;
		display: none;
	}
	.wheel-box01 a {
		color: var(--white);
	}
	.wheel-button {
		background-color: var(--yellow);
		font-size: 70%;
		position: relative;
		width: 60px;
		height: 60px;
		line-height: 60px;
		border-bottom: rgba(0,0,0,0.10) 2px solid;
		border-radius: 50%;
		text-align: center;
		display: block;
		box-shadow: rgba(0,0,0,0.20) 3px 6px 8px 0px;
	}
	.wheel {
		margin: 0;
		padding: 0;
		list-style: none;
		width: 160px; /* this will determine the diameter of the circle */
		height: 130px; /* this will determine the diameter of the circle */
		visibility: hidden;
		position: relative;
		display: none;
		box-sizing: content-box;
	}
	.wheel li {
		background-color: rgba(252,243,233,1.00);
		width: 60px;
		height: 60px;
		line-height: 60px;
		text-align: center;
		border-radius: 50%;
		overflow: hidden;
		float: left;
		font-size: 80%;
		border-bottom: rgba(0,0,0,0.10) 2px solid;
		box-shadow: rgba(0,0,0,0.20) 3px 6px 8px 0px;
	}
	.wheel li a {
		text-decoration: none;
		color: var(--yellow);
	}

	/* メニューOPEN時:メニュー領域(ul)の中へ"同じ動き"で入れる */
	body.sp-menu-open .wheel-box01 {
		/* メニュー ul が width: calc(100% - 50px) なのでそれに合わせる */
		left: 0;
		bottom: 0;
		width: calc(100% - 50px);
		max-width: none;
		/* 中央寄せ */
		transform: none;
		display: flex;
		justify-content: center;
		/* 縦位置:下から少し上に */
		padding: 0 0 90px; /* ←ここで上下位置を調整(数値を増やすと上に行く) */
		box-sizing: border-box;
		z-index: 10001; /* #menu ul と同じ/少し上に */
	}
	body.sp-menu-open .wheel-button {
		margin: 0 auto;
	}
	/* wheel本体はJSがactive付けるまで非表示でOK */
	#wheel {
		display: none;
		visibility: hidden;
	}
	/* wheelmenu.js が showIcon() で position:fixed / top/left を付けるので邪魔しない */
	#wheel.wheel {
		width: 240px;
		height: 240px;
		overflow: visible;
	}
	/* active時だけ表示(JSと同期) */
	#wheel.wheel.active {
		display: block !important;
		visibility: visible !important;
	}

	/* ---------- SlideShow ---------- */
	#slide img {
		width: 100%;
		height: auto;
		display: block;
	}
	.bx-pager {
		width: 96%;
		position: absolute;
		top: 0;
		background-color: rgba(255,255,255,0.70);
		line-height: 16px;
		font-size: 14px;
		padding: 1% 2%;
	}
	.bx-pager a {
		margin-right: 10px;
	}

	/* ---------- ブログのみ使用 ---------- */
	iframe {
		height: 250px;
	}
	div.postmetadata {
		padding: 5px;
		margin: 0 0 20px 0;
	}
	p.next-blog {
		display: block;
		line-height: 40px;
		width: 70%;
		padding: 0;
		margin: 0 auto 30px;
		text-align: center;
		background-color: var(--yellow);
	}
	p.next-blog a {
		display: block;
		text-decoration: none;
		color: var(--white);
	}
	#right-box ul li.widget h2 {
		border-radius: 2px;
	}
	#right-box ul li.widget ul li {
		font-size: 90%;
	}
	#right-box ul li.widget ul li a {
		display: block;
	}

	/* ---------- feed ---------- */
	.feed-section {
		margin: 0 0 40px;
		position: relative;
	}
	.feed-box {
		position: absolute;
		top: -60px;
		width: 100%;
		margin: 0 auto;
		box-sizing: border-box;
		overflow-x: scroll;
	}
	.feed-box h3 {
		font-weight: normal;
		background-color: var(--red);
		color: var(--white);
		font-size: 12px;
		line-height: 25px;
		padding: 0 10px;
		box-sizing: border-box;
		position: relative;
		width: 100px;
		text-align: center;
	}
	#feed {
		padding: 0;
		margin: 0 auto;
		width: calc(800vw + 100px);
		display: block;
	}
	#feed ul li a {
		font-size: 0.8em;
		text-decoration: none;
		color: var(--white);
	}
	#feed ul li {
		border-radius: 5px;
		float: left;
		display: block;
		margin: 5px;
		width: 80vw;
		line-height: 20px;
		padding: 10px;
		border: #00000026 2px solid;
		box-sizing: border-box;
		background-color: var(--yellow);
		position: relative;
		box-shadow: 2px 2px 1px 0px rgba(0,0,0,0.1);
		background-image: url("/img/bg-kikagaku-white.png");
		height: 70px;
	}
	#feed ul li:nth-child(3n+2) {
		background-color: #bbaa99;
	}
	#feed ul li:nth-child(3n+3) {
		background-color: #2bc4ee;
	}
	.eyecatching img {
		width: 100%;
		height: auto;
	}

} /* end SP */