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


/* =================================================================================================


	サイト共通パーツ用CSS

	@author    K.Sekioka of HEVIZ Co.,Ltd.
	@copyright HEVIZ Co.,Ltd.


	[version]

	@version   1.0 2021.02.24  New
	@version   1.1 2021.07.05  body.leftNav .siteNav 追加

	@version   2.0 2021.10.04  reset.cssに合わせて改修
	@version   2.1 2022.02.03  パンくず、２列構成（左）追加

	@version   3.0 2022.05.18  大改修（主にスマートギフト用を想定）

	@version   4.0 2022.09.30  body.headerNav廃止
	                           mainNav を siteMainNav に変更
	                           subNav を siteSubNav に変更

	@version   5.0 2023.01.23  ナビゲーション関係を全面改定
	                           .siteMainNavを.siteNav.main に変更
	                           .siteSubNav を.siteNav.sub  に変更
	                           .siteIconNavを.siteNav.icon に変更
                               .siteHeaderMenu を新設
	                           .siteNav を廃止


	[history]

	@history   2021.04.95 littaitomari.jp 実装
	@history   2022.05.18 リンベルスマートギフト実装
	@history   2022.05.18 smilehikita.com 実装


	[CSS]

	1. :root           共通パラメータ
	2. body, html      body, html

	3. .siteMainNav    サイト共通ナビパーツ1 : メインナビ
	4. .siteSubNav     サイト共通ナビパーツ2 : サブナビ
	5. .siteSNSNav     サイト共通ナビパーツ3 : SNSナビ
	6. .siteIconNav    サイト共通ナビパーツ4 : アイコン付きナビ(新規)
	7. .siteTitle      共通パーツ : サイトタイトル(ロゴ)
	8. .siteHeader     サイト共通ヘッダー     















1.          HTMLタグリセット
	        body.headerNav   PCで見たとき、ナビがヘッダーで横並びになる
	        body.leftNav     PCで見たとき左側にメニューが開いた状態で表示される
	        body.rightNav    PCで見たとき右側にメニューが開いた状態で表示される
            ※SPの時はsiteNavと同じハンバーガーメニューになる

	2.     .siteHeader       サイト共通ヘッダー
	3.     .siteMain         メインコンテンツ部分

	3-1.   .siteContent      1列構成、真ん中寄せ
	       .siteContent.hasSidebar           2列構成、右サイドバー
	       .siteContent.hasSidebar.leftbar   2列構成、左サイドバー

	3-2.   .siteContentMain  2列構成、メイン部分
	3-3.   .siteContentSide  2列構成  サイドバー部分
	3-4.   .siteBlock        コンテンツブロック
	4.     .siteBread        パンくずリスト
	5.     .siteNav          サイト共通ナビ (z-index:1100)
    6.     .siteFooter       サイト共通フッター

	7.      .mainNav         ナビ共通パーツ : メインナビ
	8.      .subNav          ナビ共通パーツ : サブナビ
	9.      .contactNav      ナビ共通パーツ : お問い合わせナビ
	10.     .snsNav          ナビ共通パーツ : SNSナビ

	11.     .pageTop         ページTOPボタン      (z-inde:900)
	12.     .siteLoading     ローディング表示     (z-index:2000)
	13.     .siteGDPR        GDPR確認ダイアログ   (z-index:1200)



==================================================================================================== **/



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


	1. 共通パラメータ root


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



:root {
	--text-color: #231815;
	--hover-color: #E80685;
}



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


	2. body, html


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



html {
	display: block;
	position: relative;
	margin: 0;
	padding: 0;
}


/* padding-topをデザインに合わせて変える */
body {
	display: block;
	position: relative;
	margin: 0;
	padding: 130px 0 0 0;
}



/** for Tablet ---------------------------------- **/

@media all and (max-width:1024px) and (min-width:768px) {
}


/** for Smart Phone ----------------------------- **/

@media all and (max-width:767px) {
}



/** for Print ----------------------------------- **/

@media print {
	
	body {
		padding: 0;
	}
}








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


	パーツ : ハンバーガーメニュー


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


.siteHumberger a {
	cursor: pointer;
}

.siteHumberger span {
	display: block;
	position: relative;
	width: 30px;
	height: 30px;
	margin: 0 auto;
	padding: 0;
	box-sizing: border-box;
}

.siteHumberger span span {
	display: block;
	position: absolute;
	left: 0;
	width: 100%;
	height: 3px;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	background-color: #000000;
	
	opacity: 1;
    transition: all 0.3s;
}
.siteHumberger span span:nth-of-type(1) { top: 15%; transform: translateY(-50%); }
.siteHumberger span span:nth-of-type(2) { top: 50%; transform: translateY(-50%); }
.siteHumberger span span:nth-of-type(3) { top: 85%; transform: translateY(-50%); }

body.openSiteMenu .siteHumberger span span:nth-of-type(1) { top: 50%; opacity: 1; transform: rotate( 45deg); }
body.openSiteMenu .siteHumberger span span:nth-of-type(2) { top: 50%; opacity: 0; transform: rotate(  0deg); }
body.openSiteMenu .siteHumberger span span:nth-of-type(3) { top: 50%; opacity: 1; transform: rotate(-45deg); }




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


	サイト共通ヘッダー


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



.siteNav {
	display: block;
	position: relative;
	margin: 50px auto 0;
	padding: 0;
}


/* タグリセット */
.siteNav a {
	display: block;
	position: relative;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	
	color: inherit;
	text-decoration: none;
	transition: all 0.3s;
}
.siteNav a:link,
.siteNav a:visited { color:inherit; }

.siteNav ul,
.siteNav li,
.siteNav dl,
.siteNav dt,
.siteNav dd {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

/* 矢印 */
.siteNav a::before {
	content: "";
	display: block;
	position: absolute;
	right: 10px;
	top: 50%;
	width: 10px;
	height: 10px;
	margin: 0;
	padding: 0;
	
	background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2240px%22%20height%3D%2240px%22%20viewBox%3D%220%200%2040%2040%22%20style%3D%22enable-background%3Anew%200%200%2040%2040%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20d%3D%22M18.55%2C9.1l-18%2C19.05c-1.2%2C1.28-0.3%2C3.37%2C1.45%2C3.37H38c1.75%2C0%2C2.66-2.1%2C1.45-3.37l-18-19.05%20C20.66%2C8.27%2C19.34%2C8.27%2C18.55%2C9.1z%22%2F%3E%3C%2Fsvg%3E');
	background-position: center center;
	background-size: 100% auto;
	background-repeat: no-repeat;
	
	transform: translateY(-50%) rotate(90deg);
}



/* 第一階層 */
.siteNav ul {
}

.siteNav li {
	display: block;
	position: relative;
}

.siteNav li a {
	display: block;
	position: relative;
	padding: 5px 30px 5px 10px;
	cursor: pointer;
}


/* 第2階層 */
.siteNav ul ul {
	padding: 5px 0px 5px 1em;
}

.siteNav li li {
/*	font-size: smaller; */
}



/* 第一階層に子要素がある場合 */
.siteNav li.hasChild > a {
}	

.siteNav li.hasChild > a::before {
	transform: translateY(-50%) rotate(180deg);
}



/* 第2階層を開閉する */
.siteNav li div {
	display: block;
	position: relative;
	max-height: 0px;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	overflow: hidden;
	transition: all 0.3s;
}

.siteNav li.open div {
	max-height: 1000px;
}


.siteNav li.hasChild.open > a::before {
	transform: rotate(0deg) translateY(-50%);
}


/* OPENが着いた時は開閉しない */
.siteNav.open li div {
	max-height: 1000px;
}

.siteNav.open li.hasChild > a::before {
	display: none;
}


/* アイコンがある場合 */
.siteNav svg {
	display: block;
	width: 30px;
	height: auto;
	margin: 0 auto;
	vertical-align: bottom;
}

.siteNav dt {
	text-align: center;
}

.siteNav dd {
	text-align: center;
}


/* SNSアイコン */
.siteNav .twitter svg   { fill: #1DA1F2; }
.siteNav .facebook svg  { fill: #32508E; }
.siteNav .youtube svg   { fill: #FF0000; }
.siteNav .line svg      { fill: #00B300; }
.siteNav .note svg      { fill: #41C9B4; }
.siteNav .voicy svg     { fill: #ff7d32; }




/** メインナビゲーション ------------------------------------------------------ **/

.siteNav.main li {
	border-top: 1px dashed #666666;
}
.siteNav.main li:first-child,
.siteNav.main li li {
	border-top: 0px;
}


/* リンクにアイコンを付ける場合 */
.siteNav.main dl {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

.siteNav.main dt {
	margin: 0;
	padding: 0 5px 0 0;
	box-sizing: border-box;
}



/** サブナビゲーション ------------------------------------------------------ **/

.siteNav.sub {
	font-size: smaller;
}

.siteNav.sub li a {
	padding: 0 10px;
}

.siteNav.sub a::before {
	display: none;
}



/** Icon付きナビゲーション -------------------------------------------------- **/

.siteNav.icon {
	font-size: smaller;
}

.siteNav.icon ul {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
}

.siteNav.icon li {
	margin: 10px 0 0 0;
}

.siteNav.icon li a {
	padding: 0 10px;
}

.siteNav.icon a::before {
	display: none;
}


/* SNS */
.siteNav.icon.sns dd {
	display: none;
}



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


	フリーワード検索フォーム


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


.siteNav.freeword {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: flex-end;
	width: auto;
	max-width: none;
}

.siteNav.freeword input {
	display: block;
}

.siteNav.freeword input.search-field {
	width: calc( 100% - 60px );
	border-left: 0;
	border-top: 0;
	border-right: 0;
	border-color: #ddd;
}



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


	.siteTitle		サイトタイトル


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




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


	.siteHeader      サイト共通ヘッダー

	[想定タグ]
	<header id="" class="siteHeader">
	[.siteTitle]
	[.siteMainNav]
	[.siteSubNav]
	[.siteSNSNav]
	[.siteIconNav]
	</header>


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



.siteHeader {
	display: block;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 80px;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	overflow: hidden;

	background-color: inherit;
	z-index:1000;
	transition: all 0.5s;
}


/* メニューが開く場合 */
body.openSiteMenu {
	overflow: hidden;
}

body.openSiteMenu .siteHeader {
	height: 100%;
}


/* サイトタイトル */
.siteHeaderTitle {
	display: block;
	position: relative;
	width: 300px;
	height: 80px;
	margin: 0 auto;
	padding: 0;
	
	font-size: larger;
	font-weight: inherit;
	text-align: center;
	
	z-index: 1010;
}

.siteHeaderTitle a,
.siteHeaderTitle a:link,
.siteHeaderTitle a:visited,
.siteHeaderTitle a:hover,
.siteHeadertitle a:active { color: inherit; }

.siteHeaderTitle img,
.siteHeaderTitle svg {
	display: block;
	position: absolute;
	left: 50%;
	top: 50%;
	width: auto;
	height: auto;
	
	/* ここで大きさ調整 */
	max-width: 80%;
	max-height: 80%;
	
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	vertical-align: bottom;
	transform: translate(-50%, -50%);
}


/* ハンバーガーメニュー */
.siteHeader > .siteHumberger {
	position: absolute;
	right: 30px;
	top: 25px;
	z-index: 1002;
}


/* メニュー枠 */
.siteHeaderMenu {
	display: block;
	position: relative;
	width: auto;
	height: 0;
	overflow: hidden;
/*	height: calc( 100% - 80px ); */
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	z-index: 1001;
}

body.openSiteMenu .siteHeaderMenu {
	height: calc( 100% - 80px );
}


.siteHeaderMenuInner {
	display: block;
	height: auto;
	max-height: 100%;
	margin: 0;
	padding: 20px;
	box-sizing: border-box;
	overflow: hidden;
}
.siteHeaderMenuInner > *:first-child { margin-top: 0; }
.siteHeaderMenuInner > *:last-child  { margin-bottom: 0; }




.siteHeader .siteNav {
	width: calc( 100% - 100px );
	max-width: 400px;
}



/** for Smart Phone ----------------------------- **/

@media all and (max-width:1024px) and (min-width:768px) {
	
	.siteHeader .siteNav {
		width: calc( 100% - 60px );
		max-width: none;
	}
}
	


/** for Smart Phone ----------------------------- **/

@media all and (max-width:767px) {
	
	.siteHeader .siteNav {
		width: auto;
		max-width: none;
		margin: 50px 0 0;
	}
}


/** for Print ----------------------------------- **/

@media print {

	.siteHeader {
		position: relative;
		left: auto;
		top: auto;
		width: auto;
		height: auto;
	}

	body.openSiteMenu .siteHeader {
		height: auto;
	}

	.siteHeader > .siteHumberger,
	.siteHeaderMenu {
		display: none;
	}
}



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


	.siteMain    メインコンテンツ部分

	<main id="" class="siteMain">[コンテンツ]</main>


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



.siteMain {
	display: block;
	position: relative;
	min-height: 80vh;
	margin: 0;
	padding: 0;
}
.siteMain::after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

/* .siteMain > *:first-child { margin-top: 0; } */
/* .siteMain > *:last-child  { margin-bottom: 0; } */



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


	.siteContent     コンテンツブロック

	<div class="siteContent">[コンテンツ]</div>


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



.siteContent {
	display: block;
	position: relative;
	width: calc(100% - 100px);
	max-width: 1200px;
	margin: 0 auto;
	padding: 0;
}
.siteContent::after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

.siteContent > *:first-child { margin-top: 0; }
.siteContent > *:last-child  { margin-bottom: 0; }




/* for tablet --------------------------------------------- */

@media all and (max-width:1024px) and (min-width:768px) {

	.siteContent {
		width: calc(100% - 60px);
	}
}


/* for Smart Phone ---------------------------------------- */

@media all and (max-width:767px) {

	.siteContent {
		width: auto;
		margin: 0 20px;
	}
}



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


	.siteBlock      各ブロック


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



.siteBlock {
	display: block;
	position: relative;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
.siteBlock::after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

.siteBlock > *:first-child { margin-top: 0; }
.siteBlock > *:last-child  { margin-bottom: 0; }



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


	.hasSideBar       サイトバーがある場合の配置


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



.hasSidebar {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: stretch;
}
.hasSidebar > *:first-child { margin-top: 0; }
.hasSidebar > *:last-child  { margin-bottom: 0; }

.hasSidebar > .hasSidebarMain {
	display: block;
	position: relative;
	width: calc( 100% - 320px );
	margin: 0 20px 0 0;
	padding: 0;
	box-sizing: border-box;
}
.hasSidebar > .hasSidebarMain > *:first-child { margin-top: 0; }
.hasSidebar > .hasSidebarMain > *:last-child  { margin-bottom: 0; }

.hasSidebar > .hasSidebarSide {
	display: block;
	position: relative;
    width: 300px;
    margin: 0;
    padding: 0;
	box-sizing: border-box;
} 
.hasSidebar > .hasSidebarSide > *:first-child { margin-top:0; }
.hasSidebar > .hasSidebarSide > *:last-child  { margin-bottom: 0; }



/* サイドバーがある場合(左) */
.hasSidebar.left {
	flex-direction: row-reverse;
}

.hasSidebar.left > .hasSidebarMain {
	margin: 0 0 0 20px;
}


/* for tablet --------------------------------------------- */

@media all and (max-width:1024px) and (min-width:768px) {

	.hasSidebar > .hasSidebarMain {
		width: calc( 100% - 270px );
	}

	.hasSidebar > .hasSidebarSide {
	    width: 250px;
	} 
}



/* for Smart Phone ---------------------------------------- */

@media all and (max-width:767px) {

	.hasSidebar {
		display: block;
	}

	.hasSidebar > .hasSidebarMain {
		width: auto;
		margin: 0;
	}
	.hasSidebar > .hasSidebarMain::after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

	.hasSidebar > .hasSidebarSide,
	.hasSidebar.left > .hasSidebarMain {
	    width: auto;
	    margin: 20px 0 0 0;
	}
	.hasSidebar > .hasSidebarSide::after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
}



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


	.siteFooter     サイト共通フッター


	[想定タグ]
	<footer id="" class="siteFooter">
	[.siteTitle]
	[.siteNav.main]
	[.siteNav.sns]
	[.siteNav.sub]
	<p class="copyright"><span>Copyright </span>&copy; AAAAA Co.,Ltd.<span> All Rights Reserved.</span></p>
	</footer>


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



.siteFooter {
	display: block;
	position: relative;
	margin: 0;
	padding: 50px;
	transition: all 0.5s;
}

.siteFooter a {
	color: inherit;
	text-decoration: none;
	transition: all 0.3s;
}
.siteFooter a:link,
.siteFooter a:visited,
.siteFooter a:hover,
.siteFooter a:active { color: inherit; }


.siteFooterInner {
	display: block;
	margin: 0;
	padding: 0;
}


/* ロゴ */
.siteFooterTitle {
	margin: 0;
	padding: 0;
	font-size: inherit;
	font-weight: inherit;
}

.siteFooterTitle img {}




/* メインナビ : 横に並べる */
.siteFooter .siteNav ul {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;
}

.siteFooter .siteNav.main li {
	margin-right: 10px;
	border-top: 0;
}

.siteFooter .siteNav.main li li {
	border-left: 0;
}

/* homeは消す */
.siteFooter .siteNav li.home {
	display: none;
}

/* 第2階層は開きっぱなし */
.siteFooter .siteNav ul div {
	max-height: 1000px;
}

.siteFooter .siteNav ul ul {
	display: block;
	padding: 0 0 0 1em;
}

/* 矢印を消す */
.siteFooter .siteNav a::before {
	display: none;
}


/* Copyright */
.siteFooter .copyright {
	clear: both;
	display: block;
	position: relative;
	margin: 50px 20px 0;
	padding: 0;
	font-size: smaller;
	text-align: center;
}


/* マージンを一定間隔にする */
.siteFooter > * { margin-top: 50px; }
.siteFooter > *:first-child { margin-top: 0; }
.siteFooter > *:last-child  { margin-bottom: 0; }

.siteFooterInner > * { margin-top: 50px; }
.siteFooterInner > *:first-child { margin-top: 0; }
.siteFooterInner > *:last-child  { margin-bottom: 0; }




/** for Tablet ----------------------------------- **/

@media all and (max-width:1024px) and (min-width:768px) {
}


/** for Smart Phone ------------------------------ **/

@media all and (max-width:767px) {

	.siteFooter {
		padding: 50px 30px;
	}

	/* ロゴ : サイズ小さく */
	.siteFooter .siteTitle {
		width: 150px;
		height: 40px;
	}


	/* メインナビ : 横に並べる */
	.siteFooter .siteNav.main ul {
		display: block;
	}

	.siteFooter .siteNav.main li {
		margin-top: 20px;
	}

	.siteFooter .siteNav.main li li {
		margin-top: 0;
	}


	/* サブナビ */
	/* SNSナビ */

	/* Copyright */
	.siteFooter .copyright span {
		display: none;
	}
}





/** for Print ----------------------------------- **/

@media print {
	
	.siteFooter .siteTitle,
	.siteFooter .siteNav {
		display: none;
	}
}



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


	.sitePageTop       ページTOPボタン   (z-inde:900)

	[想定タグ]
	<div class="sitePageTop"><a>PAGE TOP</a></div>


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



.sitePageTop {
	display: block;
	position: fixed;
	right: 0;
	bottom: -100px;
	margin: 0;
	padding: 0;
	opacity: 0;
	transition: all 0.5s;
	z-index: 900;
	
	font-size: 8px;
	text-align: center;
}

.sitePageTop a {
	display: block;
	position: relative;
	width: 60px;
	height: 60px;
	margin: 0;
	padding: 35px 0 0 0;
	box-sizing: border-box;
	cursor: pointer;

	color: #f0f0f0;
	text-decoration: none;
	
	background-color: rgba(0,0,0,0.6);
	transition: all 0.3s;
}
.sitePageTop a::before {
	content: "";
	display: block;
	position: absolute;
	left: 50%;
	top: 15px;
	width: 40%;
	padding: 0 0 40% 0;
	box-sizing: border-box;
	border-top:1px solid #f0f0f0;
	border-right:1px solid #f0f0f0;
	transform: translateX(-50%) rotate(-45deg);
}

.sitePageTop a:hover { 
	color: #f0f0f0;
}


/* スクロールで出てくる */
body.scrolled .sitePageTop {
	bottom: 0;
	opacity: 1;
}



/** for Tablet ---------------------------------- **/

@media all and (max-width:1024px) and (min-width:768px) {
}



/** for Smart Phone ----------------------------- **/

@media all and (max-width:767px) {
}



/** for Print ----------------------------------- **/

@media print {

	.sitePageTop {
		display: none;
	}
}



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


	body.leftHeader   ヘッダーを左に貼り付ける(PCのみ)


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



body.leftHeader {
	padding: 0 0 0 300px;
}

body.leftHeader .siteHeader {
	left: 0;
	top: 0;
	width: 300px;
	height: 100%;
}

/* タイトル */
body.leftHeader .siteHeader .siteTitle {
	width: auto;
}

/* ハンバーガーメニュー */
body.leftHeader .siteHeader > .siteHumberger {
	display: none;
}


/* メニュー枠 */
body.leftHeader .siteHeaderMenuInner {
	padding: 20px;
/*	overflow: visible; */
}

body.leftHeader .siteHeaderMenu .siteNav {
	width: auto;
	max-width: none;
}



/** for Smart Phone ----------------------------- **/

@media all and (max-width:1024px) and (min-width:768px) {
}



/** for Smart Phone ----------------------------- **/

@media all and (max-width:767px) {

	body.leftHeader {
		padding: 80px 0 0 0;
	}

	body.leftHeader .siteHeader {
		margin: 0;
		width: 100%;
		height: 80px;
	}

	body.leftHeader .siteHeader .siteTitle {
		margin: 0 50px;
		width: auto;
	}

	body.leftHeader .siteHeaderMenu {
		transform: translateX(-100%);
		transition: all 0.5s;
	}

	body.leftHeader .siteHeaderMenuInner {
	}
	
	/* ハンバーガーメニュー */
	body.leftHeader .siteHeader > .siteHumberger {
		display: block;
		right: auto;
		left: 20px;
	}
	

	/* メニュー展開 */
	body.leftHeader.openSiteMenu .siteHeader{
		height: 100%;
	}
	
	body.leftHeader.openSiteMenu .siteHeaderMenu {
		transform: translateX(0%);
	}
}



/** for Print ----------------------------------- **/

@media print {
	
	body.leftHeader {
		padding: 0;
	}

	body.leftHeader .siteHeader {
		margin: 0;
		width: auto;
		height: 80px;
	}

	body.leftHeader .siteHeader .siteTitle {
		margin: 0 50px;
		width: auto;
	}
}



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


	body.rightHeader   ヘッダーを右に貼り付ける(PCのみ)


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



body.rightHeader {
	padding: 0 300px 0 0;
}

body.rightHeader .siteHeader {
	left: auto;
	right: 0;
	top: 0;
	width: 300px;
	height: 100%;
}

/* タイトル */
body.rightHeader .siteHeader .siteTitle {
	width: auto;
}

/* ハンバーガーメニュー */
body.rightHeader .siteHeader > .siteHumberger {
	display: none;
}


/* メニュー枠 */
body.rightHeader .siteHeaderMenuInner {
	padding: 20px;
}

body.rightHeader .siteHeaderMenu .siteNav {
	width: auto;
	max-width: none;
}



/** for Smart Phone ----------------------------- **/

@media all and (max-width:1024px) and (min-width:768px) {
}



/** for Smart Phone ----------------------------- **/

@media all and (max-width:767px) {

	body.rightHeader {
		padding: 80px 0 0 0;
	}

	body.rightHeader .siteHeader {
		margin: 0;
		width: 100%;
		height: 80px;
	}

	body.rightHeader .siteHeader .siteTitle {
		margin: 0 50px;
		width: auto;
	}

	body.rightHeader .siteHeaderMenu {
		overflow: auto;
		transform: translateX(100%);
		transition: all 0.5s;
	}
	
	body.rightHeader .siteHeaderMenuInner {
		max-height: none;
		overflow: visible;
	}
	
	
	/* ハンバーガーメニュー */
	body.rightHeader .siteHeader > .siteHumberger {
		display: block;
		right: 20px;
		left: auto;
	}
	

	body.rightHeader.openSiteMenu .siteHeader{
		height: 100%;
	}
	
	body.rightHeader.openSiteMenu .siteHeaderMenu {
		transform: translateX(0%);
	}
}



/** for Print ----------------------------------- **/

@media print {
	
	body.rightHeader {
		padding: 0;
	}

	body.rightHeader .siteHeader {
		margin: 0;
		width: auto;
		height: 80px;
	}

	body.rightHeader .siteHeader .siteTitle {
		margin: 0 50px;
		width: auto;
	}
}



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


	body.topHeader     上部にメニューを付ける場合


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



body.topHeader {
	padding: 120px 0 0 0;
}

body.topHeader .siteHeader {
	height: auto;
	overflow: visible;
}

/* ハンバーガーメニュー */
body.topHeader .siteHeader > .siteHumberger {
	display: none;
}

body.topHeader .siteHeaderMenu {
	height: auto;
	position: static;
}

/*
body.topHeader .siteHeaderMenu {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 80px 0 0 0;
	overflow: visible;
}
*/

body.topHeader .siteHeaderMenuInner {
	padding: 0px;
	overflow: visible;
}

body.topHeader .siteHeader .siteNav.main {
	width: auto;
	max-width: none;
}

body.topHeader .siteHeader .siteNav.main ul {
	display: flex;
	flex-flow: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: stretch;
}

body.topHeader .siteHeader .siteNav.main li {
	margin: 0;
	border-top-width: 0;
}

body.topHeader .siteHeader .siteNav.main li div {
    position: absolute;
	left: 0;
	top: 100%;
	min-width: 200%;
	max-width: 300%;
    margin: 0;
    padding: 0;
	background-color: #ffffff;
}

body.topHeader .siteHeader .siteNav.main ul ul {
	display: block;
	padding: 10px;
}

body.topHeader .siteHeader .siteNav.main li li {
	margin: 0;
}

body.topHeader .siteHeader .siteNav.main li li.parent {
	display: none;
}



/* sub */
body.topHeader .siteHeader .siteNav.sub {
	position: absolute;
	right: 10px;
	bottom: 40px;
	margin: 0;
}

body.topHeader .siteHeader .siteNav.sub ul {
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	justify-content: flex-end;
	align-items: stretch;
}

body.topHeader .siteHeader .siteNav.sub li {
	white-space: nowrap;
}


/* SNS */
body.topHeader .siteHeader .siteNav.icon.sns {
	display: block;
	position: absolute;
	width: auto;
	right: 30px;
	top: 0;
	margin: 0;
}



/** for Smart Phone ----------------------------- **/

@media all and (max-width:1024px) and (min-width:768px) {
	
	body.topHeader .siteHeader .siteNav.main {
		font-size: smaller;
	}
}



/** for Smart Phone ----------------------------- **/

@media all and (max-width:767px) {
	
	body.topHeader {
 	   padding: 80px 0 0 0;
	}

	body.topHeader .siteHeader {
	    height: 80px;
	    overflow: hidden;
	}

	
	/* ハンバーガーメニュー */
	body.topHeader .siteHeader > .siteHumberger {
	    display: block;
	}
	

	/* メニュー枠 */
	body.topHeader .siteHeaderMenu {
		position: relative;
		left: auto;
		top: auto;
		width: 100%;
		height: calc( 100% - 80px );
		margin: 0;
		padding: 0;
		overflow: hidden;
	}

	body.topHeader .siteHeaderMenuInner {
		padding: 20px;
		overflow: hidden;
	}


	/* メインナビ */
	body.topHeader .siteHeader .siteNav.main ul {
		display: block;
		width: auto;
		max-width: none;
	}
	
	
	body.topHeader .siteHeader .siteNav.main ul {
 	   display: block;
	}
	
	body.topHeader .siteHeader .siteNav.main li {
    	margin: 0;
	    border-top-width: 1px;
	}	
	
	body.topHeader .siteHeader .siteNav.main li div {
		position: relative;
		left: auto;
		top: auto;
		min-width: 0px;
		background-color: transparent;
	}
	
	body.topHeader .siteHeader .siteNav.main ul ul {
		padding: 0;
		border: 0;
	}

	body.topHeader .siteHeader .siteNav.main li li.parent {
		display: block;
	}


	
	
	/* サブナビ */
	body.topHeader .siteHeader .siteNav.sub {
	    position: relative;
	    right: auto;
	    bottom: auto;
	    margin: 50px auto 0;
	}
	
	body.topHeader .siteHeader .siteNav.sub ul {
		display: block;
	}
	
	
	/* SNSナビ */
	body.topHeader .siteHeader .siteNav.icon.sns {
		position: relative;
		right: auto;
		top: auto;
		margin: 50px auto 0;
	}
	
	
	/* メニュー展開 */
	body.topHeader.openSiteMenu .siteHeader {
	    height: 100%;
	}
}



/** for Print ----------------------------------- **/

@media print {
}



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


	.siteBread      パンくずリスト 2022年2月3日追加

	[想定タグ]
	<div class="siteBread">
	<ul>
	<li class="home"><a href="">ホーム</a></li>
	<li><a href="">階層1</a></li>
	<li><a href="">階層2</a></li>
	<li>名称</li>
	</ul>
	</div>


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



.siteBread {
	display: block;
	position: relative;
	width: calc(100% - 100px);
	margin: 10px auto;
	padding: 0;
	font-size: smaller;
}

.siteBread a {
	display: block;
	position: relative;
	margin: 0;
	padding: 0 30px 0 0;
	color: inherit;
	text-decoration: none;
	transition: all 0.3s;
}
.siteBread a::after {
	content: "";
	display: block;
	position: absolute;
	right: 15px;
	top: 50%;
	width: 5px;
	height: 5px;
	margin: 0;
	padding: 0;
	border-top: 1px solid #888888;
	border-right: 1px solid #888888;
	transform: translateY(-50%) rotate(45deg);
}

.siteBread a:link,
.siteBread a:visted { color: inherit; }
.siteBread a:hover,
.siteBread a:active { color: inherit; text-decoration: underline; }


.siteBread ul {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style-type: none;
}

.siteBread li {
	display: block;
	position: relative;
	margin: 0;
	padding: 0;
}


/** for Smart Phone ----------------------------- **/

@media all and (max-width:1024px) and (min-width:768px) {

	.siteBread {
		width: calc(100% - 60px);
	}
}
	


/** for Mobile Phone ---------------------------- **/

@media all and (max-width:767px) {
	
	.siteBread {
		width: auto;
		margin: 0 20px 10px;
	}
}


/** for Print ----------------------------------- **/

@media print {
	
	.siteBread {
		display: none;
	}
}



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


	パーツ : ローディング表示 .siteLoading

	[想定タグ]
	<!-- start site loading -->
	<div class="siteLoading">
	<div class="logo"><img src="" alt="ロゴ"></div>

	<!-- 読み込みステータスバー表示 -->
	<div class="status"><div class="bar"></div></div>

	<!-- 読み込みクルクル -->
	<div class="circle">
	<svg width="40px" height="40px" viewBox="0 0 40 40">
	<path d="M20,7.5c-0.8,0-1.5-0.7-1.5-1.5V1.5C18.5,0.7,19.2,0,20,0s1.5,0.7,1.5,1.5V6C21.5,6.8,20.8,7.5,20,7.5z"/>
	<path d="M27,9.4c-0.3,0-0.5-0.1-0.7-0.2c-0.7-0.4-1-1.3-0.5-2L28,3.2c0.4-0.7,1.3-1,2-0.5s1,1.3,0.5,2l-2.3,3.9 C28,9.1,27.5,9.4,27,9.4z"/>
	<path d="M32.1,14.5c-0.5,0-1-0.3-1.3-0.8c-0.4-0.7-0.2-1.6,0.5-2l3.9-2.3c0.7-0.4,1.6-0.2,2,0.5c0.4,0.7,0.2,1.6-0.5,2l-3.9,2.3 C32.6,14.4,32.4,14.5,32.1,14.5z"/>
	<path d="M38.5,21.5H34c-0.8,0-1.5-0.7-1.5-1.5s0.7-1.5,1.5-1.5h4.5c0.8,0,1.5,0.7,1.5,1.5S39.3,21.5,38.5,21.5z"/>
	<path d="M36,30.8c-0.3,0-0.5-0.1-0.7-0.2l-3.9-2.3c-0.7-0.4-1-1.3-0.5-2c0.4-0.7,1.3-1,2-0.5l3.9,2.3c0.7,0.4,1,1.3,0.5,2 C37,30.5,36.5,30.8,36,30.8z"/>
	<path d="M29.3,37.5c-0.5,0-1-0.3-1.3-0.8l-2.3-3.9c-0.4-0.7-0.2-1.6,0.5-2c0.7-0.4,1.6-0.2,2,0.5l2.3,3.9c0.4,0.7,0.2,1.6-0.5,2 C29.8,37.5,29.5,37.5,29.3,37.5z"/>
	<path d="M20,40c-0.8,0-1.5-0.7-1.5-1.5V34c0-0.8,0.7-1.5,1.5-1.5s1.5,0.7,1.5,1.5v4.5C21.5,39.3,20.8,40,20,40z"/>
	<path d="M10.7,37.5c-0.3,0-0.5-0.1-0.7-0.2c-0.7-0.4-1-1.3-0.5-2l2.2-3.9c0.4-0.7,1.3-1,2-0.5c0.7,0.4,1,1.3,0.5,2L12,36.8 C11.8,37.3,11.3,37.5,10.7,37.5z"/>
	<path d="M4,30.8c-0.5,0-1-0.3-1.3-0.8c-0.4-0.7-0.2-1.6,0.5-2l3.9-2.3c0.7-0.4,1.6-0.2,2,0.5c0.4,0.7,0.2,1.6-0.5,2l-3.9,2.3 C4.5,30.7,4.2,30.8,4,30.8z"/>
	<path d="M6,21.5H1.5C0.7,21.5,0,20.8,0,20s0.7-1.5,1.5-1.5H6c0.8,0,1.5,0.7,1.5,1.5S6.8,21.5,6,21.5z"/>
	<path d="M7.9,14.5c-0.3,0-0.5-0.1-0.7-0.2L3.2,12c-0.7-0.4-1-1.3-0.5-2c0.4-0.7,1.3-1,2-0.5l3.9,2.3 c0.7,0.4,1,1.3,0.5,2C8.9,14.2,8.4,14.5,7.9,14.5z"/>
	<path d="M13,9.4c-0.5,0-1-0.3-1.3-0.8L9.5,4.7C9,4,9.3,3.1,10,2.7c0.7-0.4,1.6-0.2,2,0.5l2.3,3.9c0.4,0.7,0.2,1.6-0.5,2 C13.5,9.3,13.3,9.4,13,9.4z"/>
	</svg>
	</div>

	</div>
	<!-- end site loading -->


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



.siteLoading {
	display : block;
	position : fixed;
	left : 0;
	top : 0;
	width : 100%;
	height : 100%;
	margin : 0;
	padding : 0;
	color : #231916;
	background-color : #ffffff;
	z-index : 2000;
	transition: all 0.5s;
}

/* ロゴ等 */
.siteLoading .logo {
	display: block;
	position: absolute;
	left: 25%;
	bottom: 50%;
	width: 50%;
	margin: 0 0 10px 0;
	padding: 0;
	text-align: center;
}

.siteLoading .logo img,
.siteLoading .logo svg {
	max-width: 200px;
	vertical-align: bottom;
	fill:#a0a0a0;
}

/* ステータスバー */
.siteLoading .status {
	display : block;
	position : absolute;
	left : 0;
	top : 0;
	width : 100%;
	height : 3px;
	margin : 0;
	padding : 0;
	overflow : hidden;
}

.siteLoading .status .bar{
	display : block;
	position : absolute;
	left: 0;
	top:0;
	width : 1%;
	height : 100%;
	margin : 0;
	padding : 0;
	background-color : #000000;
	transition: all 0.5s;
}

/* Circle */
.siteLoading .circle {
	display: block;
	position: absolute;
	left: 50%;
	top:50%;
	width: 30px;
	height: 30px;
	margin: 0;
	padding: 0;
	transform: translate(-50%, -50px);
}

.siteLoading .circle svg {
    display: block;
    position: relative;
    width:100%;
    height: 100%;
    margin: 0;
    padding: 0;
    vertical-align: bottom;
}

@keyframes loadinganim {
    0%  { opacity:0; }
    70% { opacity:1; }
}

.siteLoading .circle svg path {
    fill:#000000;
    animation-name: loadinganim;
    animation-duration: 1000ms;
    animation-iteration-count: infinite;
    opacity:1;
}
.siteLoading .circle svg path:nth-of-type(1)  { animation-delay: 0; }
.siteLoading .circle svg path:nth-of-type(2)  { animation-delay: 100ms; }
.siteLoading .circle svg path:nth-of-type(3)  { animation-delay: 200ms; }
.siteLoading .circle svg path:nth-of-type(4)  { animation-delay: 300ms; }
.siteLoading .circle svg path:nth-of-type(5)  { animation-delay: 400ms; }
.siteLoading .circle svg path:nth-of-type(6)  { animation-delay: 500ms; }
.siteLoading .circle svg path:nth-of-type(7)  { animation-delay: 600ms; }
.siteLoading .circle svg path:nth-of-type(8)  { animation-delay: 700ms; }
.siteLoading .circle svg path:nth-of-type(9)  { animation-delay: 800ms; }
.siteLoading .circle svg path:nth-of-type(10) { animation-delay: 900ms; }
.siteLoading .circle svg path:nth-of-type(11) { animation-delay: 1000ms; }
.siteLoading .circle svg path:nth-of-type(12) { animation-delay: 1100ms; }


/* body.readyで引っ込む */
.siteLoading.complete {
	display: none;
}



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


	.siteSplash       パーツ : Splash画面


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


body.splash {
	overflow: hidden;
}


.siteSplash {
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	
	background-color: #f0f0f0;
	transition: all 0.5s;
	z-index: 2100;
}
body.splash .siteSplash {
	display: block;
}

.siteSplashScene {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	opacity: 0;
}






.siteSplashSkip {
	display: block;
	position: absolute;
	right: 30px;
	bottom: 30px;
	margin: 0;
	padding: 0;
	
	font-size: 24px;
	font-weight: 400;
	line-height: 1;
	
	z-index: 2100;
}

.siteSplashSkip a {
	cursor: pointer;
	text-decoration: none;
}
.siteSplashSkip a:link,
.siteSplashSkip a:visited { color: inherit; }









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


	.siteGDPR      パーツ : GDPR確認ダイアログ (z-index:1050)

	[想定タグ]
	<!-- start GDPR -->
	<div class="siteGDPR">
	<div class="desc">
	<p>当ウェブサイトでは、お客様の利便性の改善やサービス向上などを目的とした、Google Analyticsによるアクセスログ解析のためにクッキーを使用しています。詳細は<a href="#">プライバシー・ポリシー</a>をご参照ください。</p>
	</div>
	<div class="buttons"><ul>
	<li class="accept"><a>承認する</a></li>
	<li class="denied"><a>承認しない</a></li>
	</ul></div>
	<div class="close"><a><svg viewBox="0 0 40 40"><use xlink:href="#svg-close"></use></svg></a></div>
	</div>
	<!-- end GDPR -->


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



.siteGDPR {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	position: fixed;
	left: 0;
	top: 100%;
	bottom: auto;
	width: 100%;
	margin: 0;
	padding: 20px 40px;
	box-sizing: border-box;
	
	background-color:#f0f0f0;
	z-index: 1050;
	
	transform: translateY(100%);
	transition: all 1s;
}

.siteGDPR .desc {
	width: 65%;
	margin: 0;
	padding: 0 20px 0 0;
	box-sizing: border-box;
}

.siteGDPR .desc p {
	margin: 0;
}

.siteGDPR .buttons {
	width: 25%;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

.siteGDPR .buttons ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

.siteGDPR .buttons li {
/*	width: 48%; */
	margin: 1px 0;
	padding: 0;
	list-style-type: none;
	box-sizing: border-box;
}

.siteGDPR .buttons li.accept {}

.siteGDPR .buttons a {
	display: block;
	padding: 15px 10px;
	
	background-color: #444444;
	color: #ffffff;
	text-align: center;
	text-decoration: none;
	font-size: larger;
	cursor: pointer;
	
	transition: all 0.3s;
}

.siteGDPR .buttons li.denied a {
	padding: 5px 10px;
	background-color: #c0c0c0;
	font-size: inherit;
}

.siteGDPR .buttons li a:hover,
.siteGDPR .buttons li a:active  { 
	color: #fffff;
	background-color: #cc0000;
}

.siteGDPR .close {
	display: block;
	position: absolute;
	right: 10px;
	top: 10px;
}

.siteGDPR .close a {
	cursor: pointer;
}

.siteGDPR .close svg {
	width: 20px;
	height: 20px;
	fill: #444444;
	transition: all 0.3s;
}

.siteGDPR .close a svg:hover,
.siteGDPR .close a svg:active  {
	fill: #cc0000;
}


/* 表示 */
body.ready .siteGDPR.open {
	top: auto;
	bottom: 0;
	transform: translateY(0%);
}


/** for Smart Phone ----------------------------- **/

@media all and (max-width:1024px) and (min-width:768px) {
}


/** for smart phone ----------------------------- **/

@media all and (max-width:767px) {
	
	.siteGDPR {
		display: block;
		padding: 20px 40px;
	}

	.siteGDPR .desc {
		width: auto;
		padding: 0;
	}

	.siteGDPR .buttons {
		width: auto;
		margin: 20px 0 0 0;
	}
}


/** for print ----------------------------------- **/

@media print {

	.siteGDPR {
		display: none;
	}	
}



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


	モーダルWindow


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



.siteModal {
	display: block;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	z-index: 1200;
	
	transition: all 0.5s;
}

.siteModalBg {
	display: block;
	position: absolute;
	left: 0;
	top:0;
	right: 0;
	bottom: 0;
	margin: 0;
	padding: 0;
	background-color: rgba(0,0,0,0.8);
	cursor: pointer;
}

.siteModalInner {
	display: block;
	position: absolute;
	left: 50%;
	top: 50%;
/*
	min-width: 100px;
	min-height: 100px;
*/
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	
	background-color:#ffffff;
	color: #231815;
	
	transform: translate(-50%, -50%);
}

.siteModalClose {
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	margin: 0;
	padding: 0;
	transform: translate(50%, -50%);
	z-index: 1201;
}

.siteModalClose a {
	display: block;
	position: relative;
	width: 40px;
	height: 40px;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	cursor: pointer;
	z-index: 1210;
	
	border-radius: 50%;
	background-color: #888888;
	
	font-size: 1px;
	text-indent: -9999px;
	overflow: hidden;
}

.siteModalClose a::before,
.siteModalClose a::after {
	content: "";
	display: block;
	position: absolute;
	left: 20%;
	top: 50%;
	width: 60%;
	height: 2px;
	background-color: #ffffff;
	transition: all 0.3s;
}
.siteModalClose a::before { transform: rotate(45deg); }
.siteModalClose a::after  { transform: rotate(-45deg); }


/* モーダルの開閉 */
@keyframes siteModalAnim {
	0%   { top: 100%; visibility: hidden;  }
	1%   { top: 100%; visibility: visible; }
	100% { top:    0; visibility: visible; }
}
@keyframes siteModalAnimRev {
	0%   { top:    0; visibility: visible; }
	99%  { top: 100%; visibility: visible; }
	100% { top:    0; visibility: hidden;  }
}
.siteModal {
	top: 100%;
	visibility: hidden;
}

.siteModal.open {
	animation-name: siteModalAnim;
	animation-duration: 0.5s;
	animation-timing-function: ease-out;
	animation-delay: 0s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}

.siteModal.close {
	animation-name: siteModalAnimRev;
	animation-duration: 0.5s;
	animation-timing-function: ease-in;
	animation-delay: 0s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}

/* Youtube用モーダル */
.siteModal.youtube .siteModalInner{
	width: 60%;
	width: 70%;
	padding: 0 0 33.75%;
	padding: 0 0 39.375%;
}

.siteModal.youtube iframe {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	z-index: 1;
}


/** for Smart Phone ----------------------------- **/

@media all and (max-width:1024px) and (min-width:768px) {
}


/** for smart phone ----------------------------- **/

@media all and (max-width:767px) {
}


/** for print ----------------------------------- **/

@media print {
	.siteModal {
		display: none;
	}
}



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


	.siteSVG    SVGを格納しておくスペース(非表示)


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



.siteSVG {
	display:block;
	position:absolute;
	visibility:hidden;
	right:0;
	bottom:0;
	width: 0;
	height: 0
}



/** for print ----------------------------------- **/

@media print {
	
	.siteSVG {
		display:none;
	}
}



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


	.scrollBar : 疑似スクロールバー


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



/* スクロール対象 */
.scrollBarTarget {}

/* 親要素 */
.scrollBarWrapper {}

/* スクロールバー本体 */
.scrollBar {
	display: none;
	position: absolute;
	right: 0;
	top: 0;
	width: 10px;
	height: 100%;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	z-index:20;

	overflow: hidden;
	cursor: pointer;
	
	background-color: transparent;
}

/* スクロールバー中身 */
.scrollBarInner {
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	height: 90%;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	cursor: pointer;

	background-color: #d0d0d0;
	border-radius: 5px;
	transition: all 0.2s;
}

.scrollBarWrapper.scroll .scrollBar {
	display: block;
}