@charset "utf-8";
/* =============================================================================
   SAUNA CLOUD 共通ボタン（2026）※gymcloud.jp の gc_button.css をベースにサウナ用の色を追加
   使い方：<a class="gcBtn gcSauna" href="..."><span class="gcBtnIcon"><i class="material-icons">search</i></span><span class="gcBtnLabel">ラベル</span></a>
   色：gcSauna（サウナのオレンジ） / gcPink / gcRed / gcBlue / gcOrange / gcPurple / gcGreen / gcBlack / gcYellow / gcGray
   ============================================================================= */
.gcBtn{position:relative;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:58px;padding:10px 44px;box-sizing:border-box;border:0;border-radius:10px;color:#fff !important;font-size:16px;font-weight:700;letter-spacing:.04em;line-height:1.3;text-align:center;text-decoration:none !important;background:var(--gc-c2);box-shadow:0 3px 0 var(--gc-c3),0 6px 14px rgba(0,0,0,.12);transition:transform .15s ease,box-shadow .15s ease,filter .15s ease;cursor:pointer;}
.gcBtn::after{content:"";position:absolute;right:18px;top:50%;width:8px;height:8px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:translateY(-50%) rotate(45deg);opacity:.8;}
.gcBtn:hover{transform:translateY(-2px);filter:brightness(1.06);box-shadow:0 5px 0 var(--gc-c3),0 10px 18px rgba(0,0,0,.16);}
.gcBtn:active{transform:translateY(2px);box-shadow:0 1px 0 var(--gc-c3),0 3px 8px rgba(0,0,0,.12);}
.gcBtnIcon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.2);}
.gcBtnIcon .material-icons{margin:0;font-size:20px;color:inherit;line-height:1;}

/* 色 */
.gcSauna{--gc-c2:#fca315;--gc-c3:#c47a00;}
.gcPink{--gc-c2:#cc1a6e;--gc-c3:#9e1254;}
.gcRed{--gc-c2:#ec3642;--gc-c3:#b51f2a;}
.gcBlue{--gc-c2:#005799;--gc-c3:#003f70;}
.gcOrange{--gc-c2:#f26522;--gc-c3:#c54d12;}
.gcPurple{--gc-c2:#6f42b0;--gc-c3:#522f86;}
.gcGreen{--gc-c2:#009a43;--gc-c3:#007332;}
.gcBlack{--gc-c2:#222;--gc-c3:#000;}
.gcYellow{--gc-c2:#ffbe00;--gc-c3:#c99600;}
.gcGray{--gc-c2:#e8e8e8;--gc-c3:#c4c4c4;}
.gcBtn.gcYellow{color:#222 !important;}
.gcBtn.gcYellow .gcBtnIcon{background:rgba(255,255,255,.4);}
.gcBtn.gcGray{color:#757575 !important;font-weight:500;}
.gcBtn.gcGray .gcBtnIcon{background:rgba(0,0,0,.06);}

/* タブ切替用（選択中は .fcs。選択中は既存CSSの木目画像、未選択はベージュ） */
.gcBtn.gcTab{--gc-c2:#efe3cf;--gc-c3:#c9b28c;display:flex;padding:10px 20px;line-height:1.3;background:var(--gc-c2);color:#3f3127 !important;}
.gcBtn.gcTab .gcBtnIcon{background:rgba(63,49,39,.08);}
.gcBtn.gcTab::after{display:none;}
.gcBtn.gcTab.fcs{--gc-c2:#3f3127;--gc-c3:#241a13;color:#fff !important;}
.gcBtn.gcTab.fcs .gcBtnIcon{background:rgba(255,255,255,.15);}

/* 個人／法人の切替タブ（黒背景のため選択中ピンク・未選択オレンジ） */
.rizinContentsView .headerBox a.gcBtn.gcTab{--gc-c2:#fca315;--gc-c3:#c47a00;display:flex;background:var(--gc-c2);line-height:1.3;color:#fff !important;}
.rizinContentsView .headerBox a.gcBtn.gcTab .gcBtnIcon{background:rgba(255,255,255,.2);}
.rizinContentsView .headerBox a.gcBtn.gcTab.fcs{--gc-c2:#cc1a6e;--gc-c3:#9e1254;color:#fff !important;}
.rizinContentsView .headerBox a.gcBtn.gcTab.fcs .gcBtnIcon{background:rgba(255,255,255,.2);}

/* カテゴリーボタン（ul.categoryListBox に .gcCatList を付与。こげ茶地・黄文字） */
.categoryListBox.gcCatList li a{position:relative;overflow:hidden;border-radius:10px;background:#3f3127;box-shadow:0 3px 0 #241a13,0 6px 14px rgba(0,0,0,.12);transition:transform .15s ease,box-shadow .15s ease,filter .15s ease;}
.categoryListBox.gcCatList li a:hover{opacity:1;transform:translateY(-2px);filter:brightness(1.06);box-shadow:0 5px 0 #241a13,0 10px 18px rgba(0,0,0,.16);}
.categoryListBox.gcCatList li a:active{transform:translateY(2px);box-shadow:0 1px 0 #241a13,0 3px 8px rgba(0,0,0,.12);}
.categoryListBox.gcCatList li a::after{content:"";position:absolute;right:16px;top:50%;width:7px;height:7px;border-top:2px solid #ffbe00;border-right:2px solid #ffbe00;transform:translateY(-50%) rotate(45deg);opacity:.7;}
.categoryListBox.gcCatList li a .titleWrap{box-sizing:border-box;padding-right:28px;}
.categoryListBox.gcCatList li .title{color:#ffbe00;font-weight:700;}

/* 2つ並びボタン（ul.doubleContactButton）のすき間 */
.doubleContactButton li:first-child .gcBtn{width:calc(100% - 5px);}
.doubleContactButton li:last-child .gcBtn{width:calc(100% - 5px);margin-left:auto;}

/* スマホ */
@media screen and (max-width:767px){
	.gcBtn{min-height:52px;padding:8px 32px;gap:6px;font-size:14px;}
	.gcBtn::after{right:12px;width:6px;height:6px;}
	.gcBtnIcon{width:28px;height:28px;}
	.gcBtnIcon .material-icons{font-size:17px;}
	.gcBtn.gcTab{padding:8px 12px;}
}
@media screen and (max-width:800px){
	.categoryListBox.gcCatList li a::after{display:none;}
	.categoryListBox.gcCatList li a .titleWrap{padding-right:0;}
}
@media screen and (max-width:500px){
	.doubleContactButton li:first-child .gcBtn,
	.doubleContactButton li:last-child .gcBtn{width:100%;}
}
