@charset "UTF-8";

/*このCSSファイルにおける、メディアクエリの分け方
※各画面サイズ共通クラス

※PC*******1081~　tablet横、PC　
※タブレット******415~1080　タブレット縦　スマホ横　及びiPad miniなど 
※スマホ縦　iphone6,7,8及び　pluse*********~414
*/
/*******************************************************************************PC、tab*/
@media screen and (min-width : 600px ) {
body {
	margin:0;
	background-image: url("../images/top_bg.jpg");
	background-position: center top;
	background-repeat: no-repeat;
	
			background-size:contain;
	-webkit-background-size:contain;
       -moz-background-size:contain;
         -o-background-size:contain;
        -ms-background-size:contain;
	}
}
/*******************************************************************************スマホサイズ*/
@media screen and (max-width : 599px ){
	body {
	margin:0;
	background-image: url("../images/top_bg.jpg");
	background-position: center top;
	background-repeat: no-repeat;
	
			background-size:160% auto;
	-webkit-background-size:160% auto;
       -moz-background-size:160% auto;
         -o-background-size:160% auto;
        -ms-background-size:160% auto;
	}
}

body#top {
	-webkit-text-size-adjust:100%;
	text-size-adjust:100%;
}
/*=============================================================
header
=============================================================*/

#top header h1 {
	color:#c67452;
	text-shadow: 0 0 5px #666;
}


/*******************************************************************************PC*/
@media screen and (min-width : 1081px ) {
	#top main {
		width:90vw;
		min-width:1000px;
		margin:0 auto;
		//border:solid 1px blue;
	}
	#top header {
		margin-top:4rem;
		width:100%;
		//height:6rem;
		//position:fixed;
		//border:solid 1px red;
	}
	#top header h1 {
		width:100%;
		text-align:right;
	}
	#top header h2 {
		width:100%;
		text-align:left;
	}
	
	#logo {
		width:32%;
	}
}
/*******************************************************************************タブレット*/
@media screen and ( min-width : 600px ) and (max-width : 1080px ){
	#top main {
		width:90vw;
		min-width:40rem;
		margin:0 auto;
		//border:solid 1px blue;
	}
	#top header {
		margin-top:2.5rem;
		width:100%;
		//height:6rem;
		//position:fixed;
		//border:solid 1px red;
	}
	#top header h1 {
		width:100%;
		text-align:right;
	}
	#top header h2 {
		width:100%;
		text-align:left;
	}
	#logo {
		width:25%;
	}
}
/*******************************************************************************スマホサイズ*/
@media screen and (max-width : 599px ){
	
	#top main {
		width:100%;
		margin:0 auto;
	}
	#top header{
		margin:1rem auto 0;
		width:100%;
		height:auto;
		padding:0 0.75rem;
		text-align:center;
		display:flex;
		flex-direction:column;
		align-items:center;
		gap:0.75rem;
		//position:fixed;
		//border:solid 1px red;
		}
	#top header h1 {
		width:100%;
		font-size:1.2rem;
		line-height:1.3;
		text-align:center;
	}
	#top header h2 {
		width:100%;
		text-align:center;
	}
	#logo {
		width:min(72vw, 18rem);
		margin-top:0;
	}
	body#top {
		max-width:none;
	}
}


/*=======================================
#top nav
=========================================*/
/*******************************************************************************共通サイズ*/
#top nav#master li a{
	display:block;
}

#top nav#master li:hover{
	//padding-bottom:0.5rem;
	background-color:rgba(0, 0, 0, .4);
	//border-bottom:2px solid #136097;
}

#top nav#master li.active{
	//padding-bottom:0.5rem;
	border-bottom:2px solid #00fcff;
}

#top nav#master li.is-open{
	background-color:rgba(0, 0, 0, .4);
	border-bottom:2px solid #00fcff;
}

#sub ul.is-open {
	display:block;
}


/********************************************************************************PC*/
@media screen and (min-width : 1081px ) {
	
	#top nav#master {
		float:right;
		/*width:26.2rem;*/
		font-size:1.2rem;
		line-height:1.2rem;
		//border:solid 1px green;
	}
	#top nav#master ul {
		//border:solid 1px yellow;
	}

	#top nav#master li {
		margin:0 0 0 0.3rem;
		padding:0.6rem 0.3rem 0.4rem 0.6rem;
		float:left;
		transition: 1.5s;
		//border:solid 1px blue;
	}
	#sub {
		clear:both;
		height:2.5rem;
		font-size:1.2rem;
		line-height:1.2rem;
		background-color:rgba(0,0,0, 0.4);
		
		//border:solid 1px green;
	}
	ul#about  {
		display:none;
		margin-left:50%;
		padding:0.7rem 0.5rem 0;
		//border:solid 1px green;
	}
	#about li {
		display:inline;
		margin:0 0 0 0.3rem;
		padding:0.6rem 0.3rem 0.4rem 0.6rem;
		background-color:rgba(9,9,9, 0.2);
		//border:solid 1px blue;
	}
	ul#works {
		display:none;
		margin-left:20%;
		padding:0.7rem 0.5rem 0;
	}
	#works li {
		display:inline;
		margin:0 0 0 0.3rem;
		padding:0.6rem 0.3rem 0.4rem 0.6rem;
		background-color:rgba(9,9,9, 0.2);
		//border:solid 1px blue;
	}
}
/********************************************************************************TABLET*/
@media screen and ( min-width : 600px ) and (max-width : 1080px ){
	#top nav#master {
		float:right;
		width:auto;
		max-width:100%;
		font-size:1rem;
		//border:solid 1px green;
	}
	#top nav#master ul {
		//border:solid 1px yellow;
	}
	#top nav#master li{
		margin:0 0 0rem 0.3rem;
		padding:0.6rem 0.3rem 0.4rem 0.4rem;
		float:left;
		background-color:rgba(0, 0, 0, 0);
		transition: 1.5s;
		//border:solid 1px blue;
	}
	#sub {
		clear:both;
		height:auto;
		min-height:1.8rem;
		font-size:1rem;
		line-height:1rem;
		background-color:rgba(0, 0, 0, 0.4);
		
		//border:solid 1px green;
	}
	ul#about  {
		display:none;
		margin-left:0;
		padding:0.5rem;
		//border:solid 1px green;
	}
	#about li {
		display:inline;
		margin:0 0 0rem 0.3rem;
		//padding:0.6rem 0.3rem 0.4rem 0.6rem;
		//border:solid 1px blue;
	}
	ul#works {
		display:none;
		margin-left:0;
		padding:0.5rem;
	}
	#works li {
		display:inline;
		//margin:0 0 0rem 0.3rem;
		padding:0.6rem 0.3rem 0.4rem 0rem;
		//border:solid 1px blue;
	}
	#sub ul.is-open {
		display:flex;
		flex-wrap:wrap;
		justify-content:center;
		gap:0.35rem 0.7rem;
		padding:0.5rem 0.75rem;
	}
	#about li,
	#works li {
		display:block;
		margin:0;
		padding:0.2rem 0.45rem;
		white-space:nowrap;
	}
}

/*
#navi li.spacer{
	width:1px;
	margin:2px 0;
	background:#fff;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}

参考
white-space:nowrap
ソース中のホワイトスペースを無視
ソース中の改行を1つの半角スペースとして表示
ボックスサイズが指定されている場合にも自動改行しない
*/




/*******************************************************************************スマホサイズ*/
@media screen and (max-width : 599px ){
	
	#top nav#master li{
	width:calc(50% - 0.5rem);
	margin:0;
	padding:0.55rem 0.5rem;
	text-align:center;
		float:left;
		font-size:1.0rem;
		background-color:rgba(0, 0, 0, 0.25);
	}
	
	/*
	#navi li.spacer{
	width:1px;
	margin:2px 0;
	background:#fff;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	}
	
	参考
	white-space:nowrap
	ソース中のホワイトスペースを無視
	ソース中の改行を1つの半角スペースとして表示
	ボックスサイズが指定されている場合にも自動改行しない
	*/
	

	
	#top nav#master {
		float:none;
		width:100%;
		max-width:none;
		font-size:1rem;
		//border:solid 1px green;
	}
	#top nav#master ul {
		display:flex;
		flex-wrap:wrap;
		justify-content:center;
		gap:0.5rem;
		//border:solid 1px yellow;
	}
	/*
	#top nav#master li{
		margin:0 0 0rem 0.3rem;
		padding:0.6rem 0.3rem 0.4rem 0.4rem;
		float:left;
		background-color:rgba(0, 0, 0, 0);
		transition: 1.5s;
		//border:solid 1px blue;
	}*/
	#sub {
		clear:both;
		height:auto;
		min-height:0;
		font-size:1rem;
		line-height:1.2rem;
		padding:0.5rem 0.75rem;
		background-color:rgba(0, 0, 0, 0.4);
		
		//border:solid 1px green;
	}
	ul#about  {
		display:none;
		margin-left:0;
		padding:0;
		//border:solid 1px green;
	}
	#about li {
		display:block;
		margin:0;
		padding:0.25rem 0;
		white-space:normal;
		//border:solid 1px blue;
	}
	ul#works {
		display:none;
		margin-left:0;
		padding:0;
	}
	#works li {
		display:block;
		padding:0.25rem 0;
		//border:solid 1px blue;
	}
	#sub ul.is-open {
		display:flex;
		flex-direction:column;
		align-items:center;
		gap:0.25rem;
	}
	#sub li {
		width:100%;
		text-align:center;
	}
}



/*=======================================
article
=========================================*/
#plug_article {
	background-color:rgba(0, 0, 0, .3);
}
/*******************************************************************************PC*/
@media screen and (min-width : 1081px ) {
	#article_top {
		clear:both;
		display: -ms-grid;
		display: grid;
		gap:1rem;
		grid-template-areas:"col_1 col_2 col_3";
		grid-template-columns:minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1fr);
		justify-content: center; /* 横方向は中央に */
		align-items:start;
		padding:0rem 1rem 1rem;
		background-color:rgba(0, 0, 0, .4);
		
		font-size:1.2rem;
		line-height:2.0rem;
	}
}
/*******************************************************************************タブレット*/
@media screen and ( min-width : 600px ) and (max-width : 1080px ){
	#article_top {
		clear:both;
		display: -ms-grid;
		display: grid;
		gap:1rem;
		grid-template-areas:"col_1 col_2 col_3";
		grid-template-columns:repeat(3, minmax(0, 1fr));
		align-items:start;
		padding:1rem 1rem 1rem;
		background-color:rgba(0, 0, 0, .4);
		font-size:1.0rem;
		line-height:2.0rem;
	}
}

/*******************************************************************************スマホサイズ*/
@media screen and (max-width : 599px ){
	#article_top {
		clear:both;
		display: -ms-grid;
		display: grid;
		gap:1rem;
		grid-template-areas:
				"col_1"
				"col_2"
				"col_3";
		grid-template-columns:minmax(0, 1fr);
		grid-template-rows:auto auto auto;
		align-items:start;
		margin-top:1rem;
		padding:1rem;
		background-color:rgba(0, 0, 0, .4);
	}
}

//article {display:none;}


/*=======================================
article section
=========================================*/
/*******************************************************************************共通事項*/

/*******************************************************************************PC、tab*/
@media screen and (min-width : 600px ) {
#col_1 {
	grid-area:col_1;
	min-width:0;
}
#col_2 {
	grid-area:col_2;
	background-color:rgba(0, 70, 10, .3);
	padding:1rem;
	text-align:left;
	min-width:0;
}
#col_3 {
	grid-area:col_3;
	padding:1rem;
	background-color:rgba(10, 10, 20, .4);
	min-width:0;
}

/*section #col_1 配下*/
#col_1 img {
	width:100%;
	object-fit:contain;
}
#col_1 dl {
	display: -ms-grid;
	display:grid;
	row-gap:0.7rem;
	column-gap:1.2rem;
	grid-template:
		"newest newest newest" 2vw
		"new_1 new_2 new_3" auto / 1fr 1fr 1fr;
	margin-top:0.5rem;
	padding:0.5rem;
	font-size:1.2rem;
	background-color:rgba(70, 70, 70, .3);
	border:solid 2px #554;
	border-radius:2px;
	}
/*最新刊一つをクローズアップするレイアウト*/	
#col_1 dl#banner {
		display:block;
	}
#col_1 dl#banner dd {
		width:100%;
	}
#col_1 dl#banner img {
	display:block;
	width:100%;
	height:auto;
	max-width:100%;
}
	
#col_1 dd {
	transition: 3.0s;
	}
#col_1 dd:hover {
	filter: brightness(130%) contrast(70%);
	box-shadow: 0 0 10px yellow;
	}
#newest {
		grid-area:newest;
		align-self:center;
		padding-top:1rem;
		color:gold;
		font-size:clamp(1.35rem, 2.6vw, 2rem);
		line-height:1.2;
		text-align:center;
		align-self:end;
		//border:solid 1px yellow;
}
#new_1 {grid-area:new_1;}
#new_2 {grid-area:new_2;}
#new_3 {grid-area:new_3;}

/*section #col_2 配下*/
#col_2 h4 {
	width:100%;
	font-size:1.0rem;
	text-align:right;
}
#col_2 h4 img {
	position:relative;
	top:10px;
	width:0.5rem;
	margin-right:0.5rem;
}
#col_2 dt {
	margin-top:1rem;
}
#col_2 dt span {
	position:relative;
	top:-0.2rem;
	margin-right:0.5rem;
	color:#089210;
	font-size:0.9rem;

}

/*section #col_3 配下*/
#col_3 h3 {
	font-size:1.8rem;
	color:#b36442;
	text-shadow: 0 0 5px #666;
}
#col_3 h4 {
	color:#b36442;
	text-shadow: 0 0 5px #666;
}
#col_3 .btc-menu-board {
	width:80%;
	margin:1.1rem auto 1.35rem;
	display:flex;
	flex-direction:column;
	gap:0.55rem;
}
#col_3 .btc-menu-tag {
	display:block;
	position:relative;
	overflow:hidden;
	padding:0.6rem 1rem 0.68rem 1rem;
	text-align:left;
	background:linear-gradient(90deg, rgba(92, 66, 50, .44), rgba(38, 35, 42, .14));
	border-left:solid 5px #7b6658;
	border-bottom:solid 1px rgba(213, 188, 162, .16);
	transition:0.55s;
	opacity:1;
	transform:translateY(0) scale(1);
	filter:brightness(1) saturate(1);
}
#col_3 .btc-menu-tag:hover {
	transform:translateX(3px);
	background:linear-gradient(90deg, rgba(120, 84, 59, .58), rgba(64, 58, 60, .22));
	filter:brightness(1.03) saturate(1.02);
}
#col_3 .btc-menu-tag--counter {
	border-left-color:#ba8c63;
}
#col_3 .btc-menu-tag--ten {
	border-left-color:#7f3f4e;
}
#col_3 .btc-menu-tag--chi {
	border-left-color:#5b8a6e;
}
#col_3 .btc-menu-tag--kai {
	border-left-color:#4c79a0;
}
#col_3 .btc-menu-tag--ten:hover,
#col_3 .btc-menu-tag--ten:focus-visible {
	border-left-color:#9a4156;
}
#col_3 .btc-menu-tag--chi:hover,
#col_3 .btc-menu-tag--chi:focus-visible {
	border-left-color:#6ea082;
}
#col_3 .btc-menu-tag--kai:hover,
#col_3 .btc-menu-tag--kai:focus-visible {
	border-left-color:#5d95c3;
}
#col_3 .btc-menu-tag__eyebrow {
	display:block;
	margin-bottom:0.1rem;
	color:#bda48d;
	font-size:0.68rem;
	letter-spacing:0.24em;
	text-transform:uppercase;
}
#col_3 .btc-menu-tag__title {
	display:block;
	font-size:1.3rem;
	line-height:1.15;
}
#col_3 .btc-menu-tag__hint {
	position:absolute;
	right:1rem;
	bottom:0.62rem;
	transform:translateX(12px);
	display:block;
	max-width:46%;
	font-size:1rem;
	line-height:1.28;
	text-align:right;
	letter-spacing:.05em;
	color:rgba(223, 210, 196, .78);
	opacity:0;
	pointer-events:none;
	transition:.78s ease;
	text-shadow:0 0 8px rgba(0,0,0,.14);
}
#col_3 .btc-menu-tag--counter .btc-menu-tag__title {
	color:#f1dfc8;
}
#col_3 .btc-menu-tag--ten .btc-menu-tag__title {
	color:#d8a9b2;
}
#col_3 .btc-menu-tag--chi .btc-menu-tag__title {
	color:#b8d7c9;
}
#col_3 .btc-menu-tag--kai .btc-menu-tag__title {
	color:#b8cfe0;
}
#col_3 .btc-menu-tag:hover .btc-menu-tag__hint,
#col_3 .btc-menu-tag:focus-visible .btc-menu-tag__hint {
	opacity:1;
	transform:translateX(0);
}
#col_3 .btc-menu-board.is-entering .btc-menu-tag {
	animation:btc-menu-rise 1.45s cubic-bezier(.19, 1, .22, 1) both;
}
#col_3 .btc-menu-board.is-entering .btc-menu-tag:nth-child(1) {
	animation-delay:.18s;
}
#col_3 .btc-menu-board.is-entering .btc-menu-tag:nth-child(2) {
	animation-delay:.36s;
}
#col_3 .btc-menu-board.is-entering .btc-menu-tag:nth-child(3) {
	animation-delay:.54s;
}
#col_3 .btc-menu-board.is-entering .btc-menu-tag:nth-child(4) {
	animation-delay:.72s;
}
#col_3 .btc-account-line {
	width:80%;
	margin:0 auto 1.45rem;
	padding-top:0.2rem;
}
#col_3 .btc-account-line__links {
	display:flex;
	flex-direction:column;
	gap:0.45rem;
	text-align:left;
}
#col_3 .btc-account-line__link {
	display:block;
	position:relative;
	padding:0.45rem 0 0.5rem 0.9rem;
	border-left:2px solid rgba(171, 143, 116, .42);
	border-bottom:1px solid rgba(171, 143, 116, .12);
	color:#d7bfa5;
	text-align:left;
}
#col_3 .btc-account-line__eyebrow {
	display:block;
	margin-bottom:0.08rem;
	color:#a8927c;
	font-size:0.62rem;
	letter-spacing:0.2em;
	text-transform:uppercase;
}
#col_3 .btc-account-line__title {
	display:block;
	font-size:1.02rem;
	line-height:1.18;
}
#col_3 .btc-account-line__hint {
	position:absolute;
	right:0.95rem;
	bottom:0.54rem;
	display:block;
	max-width:46%;
	font-size:0.98rem;
	line-height:1.28;
	text-align:right;
	letter-spacing:.04em;
	color:rgba(223, 210, 196, .76);
	opacity:0;
	transform:translateX(12px);
	pointer-events:none;
	transition:.78s ease;
}
#col_3 .btc-account-line__link:hover {
	border-left-color:rgba(219, 177, 137, .78);
	color:#fff1dc;
}
#col_3 .btc-account-line__link:hover .btc-account-line__title {
	text-shadow:0 0 5px rgba(255, 236, 205, .14);
}
#col_3 .btc-account-line__link:hover .btc-account-line__hint,
#col_3 .btc-account-line__link:focus-visible .btc-account-line__hint {
	opacity:1;
	transform:translateX(0);
}
#col_3 dl {
	overflow:auto;	
	width:1.2rem;
}
#col_3 dl.regist {
	width:80%;
	margin:0 10%;
	padding:0.5rem 1.5rem;
	background:
		linear-gradient(180deg, rgba(68, 51, 43, .36), rgba(31, 24, 21, .22)),
		rgba(23, 18, 17, .18);
	border:1px solid rgba(193, 160, 132, .06);
	box-shadow:inset 0 1px 0 rgba(255, 245, 230, .04), 0 8px 18px rgba(0, 0, 0, .12);
	backdrop-filter:blur(7px);
	-webkit-backdrop-filter:blur(7px);
	}
	#col_3 dl#support {
	width:80%;
	margin:2rem 10%;
	padding:0.5rem 1.5rem;
	background:
		linear-gradient(180deg, rgba(68, 51, 43, .36), rgba(31, 24, 21, .22)),
		rgba(23, 18, 17, .18);
	border:1px solid rgba(193, 160, 132, .06);
	box-shadow:inset 0 1px 0 rgba(255, 245, 230, .04), 0 8px 18px rgba(0, 0, 0, .12);
	backdrop-filter:blur(7px);
	-webkit-backdrop-filter:blur(7px);
}
#col_3 dt {
		width:2rem;
		//border:solid 1px #0D639A;

}
#col_3 dt img {
	position:relative;
	top:10px;
	width:0.5rem;
		margin-right:1rem;
	}
	#col_3 dd {
		
	width:87%;
	text-align:left;
	//border:solid 1px #0D639A;
}

}
/*******************************************************************************スマホサイズ*/
@media screen and (max-width : 599px ){
#col_1 {
	grid-area:col_1;
	min-width:0;
}
#col_2 {
	grid-area:col_2;
	background-color:rgba(0, 70, 10, .3);
	padding:1rem;
	text-align:left;
	min-width:0;
}
#col_3 {
	margin-top:2rem;
	grid-area:col_3;
	padding:1rem;
	background-color:rgba(10, 10, 20, .4);
	min-width:0;
	}
	
	/*section #col_1 配下*/
#photograph {
		width:100%;
		height:60vw;
		object-fit:cover;
		object-position: 50% 10%;
}	

#col_1 dl {
	display: -ms-grid;
	display:grid;
	column-row:0.5rem;
	column-gap:1.2rem;
	grid-template:
		"newest newest newest" 1.5rem
		"new_1 new_2 new_3" auto / 1fr 1fr 1fr;
	margin-top:0.5rem;
	padding:0.5rem;
	font-size:1.2rem;
	background-color:rgba(70, 70, 70, .3);
	border:solid 2px #554;
	border-radius:2px;
	}
	
/*最新刊一つをクローズアップするレイアウト*/	
#col_1 dl#banner {
		display:block;
	}
#col_1 dl#banner dd {
		width:100%;
	}
#col_1 dl#banner img {
	display:block;
	width:100%;
	height:auto;
	max-width:100%;
}
	
#col_1 dd {
	transition: 3.0s;
	}
#col_1 dd:hover {
	filter: brightness(130%) contrast(70%);
	box-shadow: 0 0 10px yellow;
	}
#newest {
	grid-area:newest;
		align-self:center;
		padding-top:0.6rem;
		font-size:clamp(1.3rem, 8vw, 1.85rem);
		line-height:1.2;
		text-align:center;
	//border:solid 1px yellow;
	}
#new_1 img,#new_2 img,#new_3 img {
		width:100%;
	object-fit:contain;
}
#new_1 {grid-area:new_1;}
#new_2 {grid-area:new_2;}
#new_3 {grid-area:new_3;}
	
	/*section #col_2 配下*/
#col_2 h3 {font-size:1rem;}
#col_2 h4 {
	width:100%;
	font-size:0.8rem;
	text-align:right;
}
#col_2 h4 img {
	//position:relative;
	//top:5px;
	width:0.5rem;
	margin-right:0.5rem;
	}
#col_2 dl {
		font-size:1.0rem;
		line-height:1.5rem;
	}
#col_2 dt {
	margin-top:1rem;
}
#col_2 dt span {
	position:relative;
	top:-0.2rem;
	margin-right:0.5rem;
	color:#089210;
	font-size:0.9rem;
	}
/*section #col_3 配下*/
#col_3 h3 {
	font-size:1.8rem;
	color:#b36442;
	text-shadow: 0 0 5px #666;
}
	#col_3 h4 {
	font-size:1.0rem;
	color:#b36442;
	text-shadow: 0 0 5px #666;
}
#col_3 .btc-menu-board {
	width:88%;
	margin:1rem auto 1.25rem;
	display:flex;
	flex-direction:column;
	gap:0.45rem;
}
#col_3 .btc-menu-tag {
	display:block;
	position:relative;
	overflow:hidden;
	padding:0.52rem 0.82rem 0.58rem 0.82rem;
	text-align:left;
	background:linear-gradient(90deg, rgba(92, 66, 50, .44), rgba(38, 35, 42, .14));
	border-left:solid 4px #7b6658;
	border-bottom:solid 1px rgba(213, 188, 162, .16);
	opacity:1;
	transform:translateY(0) scale(1);
	filter:brightness(1) saturate(1);
}
#col_3 .btc-menu-tag:hover {
	transform:translateX(2px);
	background:linear-gradient(90deg, rgba(120, 84, 59, .58), rgba(64, 58, 60, .22));
	filter:brightness(1.03) saturate(1.02);
}
#col_3 .btc-menu-tag--counter {
	border-left-color:#ba8c63;
}
#col_3 .btc-menu-tag--ten {
	border-left-color:#7f3f4e;
}
#col_3 .btc-menu-tag--chi {
	border-left-color:#5b8a6e;
}
#col_3 .btc-menu-tag--kai {
	border-left-color:#4c79a0;
}
#col_3 .btc-menu-tag--ten:hover,
#col_3 .btc-menu-tag--ten:focus-visible {
	border-left-color:#9a4156;
}
#col_3 .btc-menu-tag--chi:hover,
#col_3 .btc-menu-tag--chi:focus-visible {
	border-left-color:#6ea082;
}
#col_3 .btc-menu-tag--kai:hover,
#col_3 .btc-menu-tag--kai:focus-visible {
	border-left-color:#5d95c3;
}
#col_3 .btc-menu-tag__eyebrow {
	display:block;
	margin-bottom:0.08rem;
	color:#bda48d;
	font-size:0.6rem;
	letter-spacing:0.18em;
	text-transform:uppercase;
}
#col_3 .btc-menu-tag__title {
	display:block;
	font-size:1.12rem;
	line-height:1.1;
}
#col_3 .btc-menu-tag__hint {
	position:absolute;
	right:0.82rem;
	bottom:0.5rem;
	transform:translateX(10px);
	display:block;
	max-width:46%;
	font-size:0.8rem;
	line-height:1.28;
	text-align:right;
	letter-spacing:.04em;
	color:rgba(223, 210, 196, .76);
	opacity:0;
	pointer-events:none;
	transition:.74s ease;
}
#col_3 .btc-menu-tag--counter .btc-menu-tag__title {
	color:#f1dfc8;
}
#col_3 .btc-menu-tag--ten .btc-menu-tag__title {
	color:#d8a9b2;
}
#col_3 .btc-menu-tag--chi .btc-menu-tag__title {
	color:#b8d7c9;
}
#col_3 .btc-menu-tag--kai .btc-menu-tag__title {
	color:#b8cfe0;
}
#col_3 .btc-menu-tag:hover .btc-menu-tag__hint,
#col_3 .btc-menu-tag:focus-visible .btc-menu-tag__hint {
	opacity:1;
	transform:translateX(0);
}
#col_3 .btc-menu-board.is-entering .btc-menu-tag {
	animation:btc-menu-rise-mobile 1.18s cubic-bezier(.19, 1, .22, 1) both;
}
#col_3 .btc-menu-board.is-entering .btc-menu-tag:nth-child(1) {
	animation-delay:.14s;
}
#col_3 .btc-menu-board.is-entering .btc-menu-tag:nth-child(2) {
	animation-delay:.28s;
}
#col_3 .btc-menu-board.is-entering .btc-menu-tag:nth-child(3) {
	animation-delay:.42s;
}
#col_3 .btc-menu-board.is-entering .btc-menu-tag:nth-child(4) {
	animation-delay:.56s;
}
#col_3 .btc-account-line {
	width:88%;
	margin:0 auto 1.3rem;
	padding-top:0.14rem;
}
#col_3 .btc-account-line__links {
	display:flex;
	flex-direction:column;
	gap:0.38rem;
	text-align:left;
}
#col_3 .btc-account-line__link {
	display:block;
	position:relative;
	padding:0.36rem 0 0.42rem 0.72rem;
	border-left:2px solid rgba(171, 143, 116, .42);
	border-bottom:1px solid rgba(171, 143, 116, .12);
	color:#d7bfa5;
	text-align:left;
}
#col_3 .btc-account-line__eyebrow {
	display:block;
	margin-bottom:0.05rem;
	color:#a8927c;
	font-size:0.56rem;
	letter-spacing:0.16em;
	text-transform:uppercase;
}
#col_3 .btc-account-line__title {
	display:block;
	font-size:0.92rem;
	line-height:1.14;
}
#col_3 .btc-account-line__hint {
	position:absolute;
	right:0.72rem;
	bottom:0.42rem;
	display:block;
	max-width:46%;
	font-size:0.78rem;
	line-height:1.24;
	text-align:right;
	letter-spacing:.03em;
	color:rgba(223, 210, 196, .74);
	opacity:0;
	transform:translateX(10px);
	pointer-events:none;
	transition:.74s ease;
}
#col_3 .btc-account-line__link:hover {
	border-left-color:rgba(219, 177, 137, .78);
	color:#fff1dc;
}
#col_3 .btc-account-line__link:hover .btc-account-line__hint,
#col_3 .btc-account-line__link:focus-visible .btc-account-line__hint {
	opacity:1;
	transform:translateX(0);
}
#col_3 dl {
		font-size:1.2rem;
	}
#col_3 dl.regist {
	width:80%;
	margin:0 10%;
	padding:0.5rem 1.5rem;
	background:
		linear-gradient(180deg, rgba(68, 51, 43, .36), rgba(31, 24, 21, .22)),
		rgba(23, 18, 17, .18);
	border:1px solid rgba(193, 160, 132, .06);
	box-shadow:inset 0 1px 0 rgba(255, 245, 230, .04), 0 8px 18px rgba(0, 0, 0, .12);
	backdrop-filter:blur(7px);
	-webkit-backdrop-filter:blur(7px);
	}
#col_3 dl#support {
	width:80%;
	margin:2rem 10%;
	padding:0.5rem 1.5rem;
	background:
		linear-gradient(180deg, rgba(68, 51, 43, .36), rgba(31, 24, 21, .22)),
		rgba(23, 18, 17, .18);
	border:1px solid rgba(193, 160, 132, .06);
	box-shadow:inset 0 1px 0 rgba(255, 245, 230, .04), 0 8px 18px rgba(0, 0, 0, .12);
	backdrop-filter:blur(7px);
	-webkit-backdrop-filter:blur(7px);
	}

@keyframes btc-menu-rise {
	0% {
		opacity:0;
		transform:translateY(26px) scale(.975);
		filter:brightness(.72) saturate(.82) blur(1.5px);
		background-position:130% 0, 0 0;
		box-shadow:none;
	}
	48% {
		opacity:1;
		transform:translateY(0) scale(1.005);
		filter:brightness(1.08) saturate(1.06) blur(0);
		background-position:38% 0, 0 0;
		box-shadow:0 14px 26px rgba(0,0,0,.22);
	}
	100% {
		opacity:1;
		transform:translateY(0) scale(1);
		filter:brightness(1) saturate(1) blur(0);
		background-position:0 0, 0 0;
		box-shadow:none;
	}
}

@keyframes btc-menu-rise-mobile {
	0% {
		opacity:0;
		transform:translateY(20px) scale(.98);
		filter:brightness(.76) saturate(.86) blur(1px);
		background-position:130% 0, 0 0;
	}
	48% {
		opacity:1;
		transform:translateY(0) scale(1.004);
		filter:brightness(1.07) saturate(1.04) blur(0);
		background-position:40% 0, 0 0;
	}
	100% {
		opacity:1;
		transform:translateY(0) scale(1);
		filter:brightness(1) saturate(1) blur(0);
		background-position:0 0, 0 0;
	}
}
#col_3 dt {
	width:0.75rem;
}
#col_3 dt img {
	position:relative;
	top:10px;
	width:0.5rem;
	margin-right:0.8rem;
}
#col_3 dd {
	//width:10em;
	text-align:left;
	//border:solid 1px #0D639A;
}

#col_3 dl.regist dd {
	overflow-wrap:break-word;
	line-height:1.6;
}

#col_3 .break-email {
	display:inline-block;
	max-width:100%;
	overflow-wrap:anywhere;
}
}

@media screen and (max-width : 599px ){
	body#top footer {
		font-size:1rem;
	}
	body#top footer ul {
		width:min(92vw, 26rem);
		margin:0 auto;
		padding:0.75rem 0 0;
	}
	body#top footer li,
	body#top footer li:first-child,
	body#top footer li:last-child {
		width:100%;
		margin:0;
	}
	body#top footer dl {
		width:min(100%, 21rem);
		margin:1.1rem auto;
	}
	body#top footer .copyright {
		width:min(92vw, 20rem);
		margin:1.5rem auto 0;
		padding:0 0 1rem;
	}
}
/*=======================================
aside
=========================================*/

/********************************************************************************PC*/
@media screen and (min-width : 1081px ) {
	#update {
	width:200px;
	margin:30px auto;
		font-size:1rem;

}
}
/*******************************************************************************タブレット*/
@media screen and ( min-width : 415px ) and (max-width : 1080px ){
	#update {
	width:160px;
	margin:20px auto;
	font-size:0.8rem;
}
}
/*******************************************************************************スマホサイズ*/
@media screen and (max-width : 414px ){
	#update {
	width:140px;
	margin:10px auto;
	font-size:0.8rem;
}
}
