@charset "utf-8";

/************************************************************
 * 初期化
 ************************************************************/

body, form, img, div, p, ul, ol, li, dl, dt, dd, h1, h2, h3 ,h4 , h5, h6, table, th ,td ,select, hr {
	margin: 0;
	padding: 0;
}

ul, ol	{ list-style: none; }
img		{ border: none; vertical-align: bottom; }
table	{ border-spacing: 0; }
th		{ text-align: left; }

input, select, label {
	vertical-align: middle;
}
/* clearfix */
.cFix:after {
	content: '';
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
/************************************************************
 * アンカー
 ************************************************************/

a:link,
a:visited { color: #4C4C80; }
.linkPink:link,
.linkPink:visited { color: #CD4D72; }
.linkGray:link,
.linkGray:visited { color: #555555; }
.linkWhite:link,
.linkWhite:visited { color: #FFFFFF; }

/************************************************************
 * フォント
 ************************************************************/

body, input, select, textarea, table {
	color: #666666;
	font-size: 12px;
	line-height: 1.5;
	font-family: Helvetica;
}
html{
	-webkit-text-size-adjust: none;
}
/* WebFonts */
@font-face	{ font-family: 'Open Sans Condensed'; font-style: normal; font-weight: 300; src: local('Open Sans Cond Light'), local('OpenSans-CondensedLight'), url(//themes.googleusercontent.com/static/fonts/opensanscondensed/v6/gk5FxslNkTTHtojXrkp-xGAzD5WKQVN4wSyA0MYYi4rr7w4p9aSvGirXi6XmeXNA.woff) format('woff'); }
.ffOpenSansCond	{ font-family: 'Open Sans Condensed'; }

/************************************************************
 * フォーム
 ************************************************************/

input,
textarea {
	-webkit-box-sizing: border-box;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]):not([type="hidden"]):not([type="range"]),
textarea {
	min-height: 30px;
	line-height: 20px;
	padding: 5px 10px;
	border: 1px solid #BBBBBB;
	border-radius: 5px;
}
/************************************************************
 * CLASSES(コンポーネント)
 ************************************************************/

/* ラッパー */
html,
body {
	height: 100%;
	min-height: 100%;
}

/* ヘッダー */
.logCond .btnClose:before {
	content: '×';
	background: 0;
	vertical-align: -2px;
	line-height: 1;
	font-size: 20px;
	margin-right: 2px;
	font-weight: normal !important;
}
.headerLogin {
	display: inline-block;
	line-height: 41px;
	padding: 0 15px;
	color: #666666 !important;
	text-decoration: none !important;
	border-left: 1px solid #DDDDDD;
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#FFFFFF),
		to(#DEDEDE),
		color-stop(0.6, #FFFFFF)
	);
	background: -webkit-linear-gradient(
		linear,
		left top,
		left bottom,
		from(#FFFFFF),
		to(#DEDEDE),
		color-stop(0.6, #FFFFFF)
	);
	background: gradient(
		linear,
		left top,
		left bottom,
		from(#FFFFFF),
		to(#DEDEDE),
		color-stop(0.6, #FFFFFF)
	);
}
.loginUser {
	display: block;
	margin-left: auto;
	line-height: 27px;
	text-align: right;
	color: #666666 !important;
	text-decoration: underline !important;
	padding: 7px 10px 3px 10px;
	font-size: 14px;
}
.loginUser:after{
	content: url(/CSP/img/bt/smb/icons/icn_usermenu.png?switch=2025071615);
	padding: 3px 0;
	background-color: #FFFFFF;
}
.loginUserMenu {
	background-color: #FFFFFF;
}
.loginUserMenu > li:last-child a {
	border-bottom: 1px solid #E0E1E2;
}
.dottedBorderTop{ border-top: 1px dotted #cccccc; }
.loginUserMenuChild,
.loginUserMenuSubChild {
	align-items: center;
	border-top: 1px solid #E0E1E2;
	color: #333333 !important;
	display: flex;
	height: 44px;
	padding: 0 12px;
	position: relative;
	text-decoration: none !important;
}
.loginUserMenuChild {
	padding: 0 12px;
}
.loginUserMenuSubChild {
	padding: 0 12px 0 44px;
}
.loginUserMenuChild::before {
	background: center / contain no-repeat;
	content: "";
	display: block;
	height: 28px;
	margin-right: 4px;
	width: 28px;
}
a.loginUserMenuChild::after,
a.loginUserMenuSubChild::after {
	background: url(/CSP/img/my/smb/icons/common/icon_arrow.png?switch=2025071615) center / contain no-repeat;
	content: "";
	height: 20px;
	position: absolute;
	right: 8px;
	top: 50%;
	transform: translateY(-50%);
	width: 20px;
}
.loginUserMenuItemTop .loginUserMenuChild::before {
	background-image: url(/CSP/img/my/smb/icons/myarea/icon_maypage_top.png?switch=2025071615);
}
.loginUserMenuItemReserveHistory .loginUserMenuChild::before {
	background-image: url(/CSP/img/my/smb/icons/myarea/icon_reserve_history.png?switch=2025071615);
}
.loginUserMenuItemGift .loginUserMenuChild::before {
	background-image: url(/CSP/img/my/smb/icons/myarea/icon_gift.png?switch=2025071615);
}
.loginUserMenuItemReview .loginUserMenuChild::before {
	background-image: url(/CSP/img/my/smb/icons/myarea/icon_review.png?switch=2025071615);
}
.loginUserMenuItemBookmark .loginUserMenuChild::before {
	background-image: url(/CSP/img/my/smb/icons/myarea/icon_bookmark.png?switch=2025071615);
}
.loginUserMenuItemMessage .loginUserMenuChild::before {
	background-image: url(/CSP/img/my/smb/icons/myarea/icon_message.png?switch=2025071615);
}
.loginUserMenuItemPoint .loginUserMenuChild::before {
	background-image: url(/CSP/img/my/smb/icons/myarea/icon_point.png?switch=2025071615);
}
.loginUserMenuItemUser .loginUserMenuChild::before {
	background-image: url(/CSP/img/my/smb/icons/myarea/icon_user.png?switch=2025071615);
}
.loginUserMenuItemCreditCard .loginUserMenuChild::before {
	background-image: url(/CSP/img/my/smb/icons/myarea/icon_creditCard.png?switch=2025071615);
}
.loginUserMenuItemSetting .loginUserMenuChild::before {
	background-image: url(/CSP/img/my/smb/icons/myarea/icon_setting.png?switch=2025071615);
}
.loginUserMenuItemLogout .loginUserMenuChild::before {
	background-image: url(/CSP/img/my/smb/icons/myarea/icon_logout.png?switch=2025071615);
}
.loginUserMenuItemLogin .loginUserMenuChild::before {
	background-image: url(/CSP/img/my/smb/icons/myarea/icon_login.png?switch=2025071615);
}
.loginUserMenu > li:first-child a {
	border-top: none;
}
.loginUserMenuCnt {
	background-color: #FD7F34;
	border-radius: 9px;
	box-sizing: border-box;
	color: #FFFFFF;
	display: inline-block;
	font-size: 12px;
	font-weight: normal;
	line-height: 18px;
	margin-left: 12px;
	min-width: 18px;
	padding: 0 4px;
	text-align: center;
}
.unread {
	color: #FF0000 !important;
}
.arrowBGrayR {
	background: url("/CSP/img/bt/smb/b_arrow_grayR.png?switch=2025071615") no-repeat center left;
	padding-left: 10px;
}
.arrowR {
	background: url("/CSP/img/bt/smb/b_arrow_grayR.png?switch=2025071615") no-repeat center left;
	padding-left: 10px;
}
.personalInformation{
	margin-top:2px;
	font-size:10px;
	text-align:center;
}
.personalInformation span {
	color:#CC0000;

}
.headerUtil	{
	position: relative;
	z-index: 1;
	padding: 4px;
	background-color: #BFB4AB;
	color: #FFFFFF;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
}
.headerUtilHC {
	background-color: #665555;
	color: #FFFFFF;
	font-size: 14px;
	font-weight: bold;
	line-height: 1;
	padding: 8px 0;
	text-align: center;
}
.headerUtilLower	{
	position: relative;
	z-index: 1;
	padding: 3px;
	color: #FFFFFF;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#e35c80),
		to(#be3c5f),
		color-stop(.15, #e35c80),
		color-stop(.99, #be3c5f)
	);
}
.pageHeadline {
	display: table !important;
	margin-right: auto;
	line-height: 32px;
	font-size: 16px;
	text-align: left !important;
	text-indent: 6px;
}
.pageHeadlineLower {
	margin-right: auto;
	font-size: 16px;
	text-align: center !important;
	text-indent: 6px;
}

.subPageHeadline {
	display: table !important;
	margin: auto;
	line-height: 30px;
	font-size: 16px;
	text-align: center !important;
	text-indent: 6px;
}

.btnHeaderBack + .pageHeadline {
	display: inline-block !important;
}

.btnHeaderBack {
	position: absolute;
	top: 3px;
	left: 5px;
	width: 89px;
	height: 30px;
	padding-top: 4px;
	font-size: 12px;
	line-height: 14px;
	padding-left: 4px;
	background: url("/CSP/img/hc/smb/buttons/b_btn_header_back.png?switch=2025071615") no-repeat;
	background-size: 89px 34px;
	-webkit-background-size: 89px 34px;
	color: #FFFFFF !important;
	text-decoration: none !important;
	text-indent: 0 !important;
	font-weight: normal;
}

.backToTopBtn {
	display: inline-block;
	margin-bottom: 8px;
	padding: 1px 8px 1px 28px;
	position: relative;
	text-decoration: none;
}
.backToTopBtn:link,
.backToTopBtn:visited {
	color: #333333;
}
.backToTopBtn::before {
	background: url("/CSP/img/hc/smb/icons/icn_arrow_left.png?switch=2025071615") no-repeat center / cover;
	content: "";
	height: 16px;
	left: 14px;
	position: absolute;
	top: 2px;
	width: 9px;
}

/* コンテンツ */
.contents {
	position: relative;
	padding-bottom: 3.5em;
	background-color: #FFFFFF;
	overflow: hidden;
}
.pageDescription {
	position: absolute;
	bottom: 10px;
	width: 100%;
	height: 3em;
	font-size: 10px;
	font-weight: normal;
	display: block;
	vertical-align: top;
	padding: 10px 10px 0;
	margin: 0 auto;
	color: #666666;
	text-align: center;
	-webkit-box-sizing: border-box;
}

/* CSS3ボタン */
.btn1 {
	display: block;
	vertical-align: middle;
	margin-left: auto;
	margin-right: auto;
	padding-left: 5px;
	padding-right: 5px;
	font-size: 14px;
	color: #5B5A5A !important;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	background: 0;
	border-radius: 4px;
	background: -webkit-gradient(linear, left top, left bottom, to(#E1E1E1), color-stop(.25, white));
	border: 1px solid #D5C6C7;
	-webkit-box-sizing: border-box;
}
.btn3 {
	display: block;
	vertical-align: middle;
	margin-left: auto;
	margin-right: auto;
	padding-left: 5px;
	padding-right: 5px;
	font-size: 14px;
	color: white !important;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	border: solid 1px #BFB4AB;
	background: 0;
	border-radius: 4px;
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#CCC4C4),
		to(#8A7C7C),
		color-stop(.2, #CCC4C4)
	);
	-webkit-box-shadow: inset 0px 1px 0px 0 rgba(255, 255, 255, .5), inset 0px 0px 5px 0 rgba(255, 255, 255, .75);
	-webkit-box-sizing: border-box;
}
.btnSaveToMyStyle {
	position: absolute;
	bottom: 16px;
	right: 16px;
	font-size: 10px;
}
.btnSaveToMyStyleDone {
	display: none ;
	position: absolute;
	bottom: 8px;
	right: 10px;
	font-size: 10px;
	vertical-align: middle;
	margin-left: auto;
	margin-right: auto;
	padding-left: 5px;
	padding-right: 5px;
	font-size: 10px;
	color: #FFF !important;
	text-align: center;
	text-decoration: none;

	font-weight: normal;
	border: 0;
	background: 0;
	border-radius: 4px;
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%;
	font-weight: bold;
}

/* ボタン */
.btn {
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	border: none;
}

/* 縦リンク一覧 */
.verticalLinkList {
	position: relative;
}
.verticalLinkList > .normalSplitLineT {
	display: block;
	position: relative;
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.verticalLinkList > .normalSplitLineT:last-child {
	border-bottom: 2px solid #BFB9B0;
}
.verticalLinkList > .normalSplitLineT > a,
.verticalLinkList > .normalSplitLineT > span,
.verticalLinkList > .normalSplitLineT > label {
	display: block;
	padding: 20px 30px 20px 10px;
	text-decoration: none !important;
	color: #666666 !important;
}
.verticalLinkList > .normalSplitLineT > a.moreFocus {
	display: block;
	padding: 22px 30px 22px 10px;
	text-decoration: none !important;
	color: #666666 !important;
}
.verticalLinkList > .normalSplitLineT > label,
.jscShowSliderContentsList > table > tbody > tr > td > label {
	padding: 8px 35px 8px 20px;
}
.verticalLinkList > .normalSplitLineT:first-child > label,
.jscShowSliderContentsList > table > tbody > tr:first-child > td > label {
	border-radius: 10px 10px 0 0;
}
.verticalLinkList > .normalSplitLineT:last-child > label,
.jscShowSliderContentsList > table > tbody > tr:last-child > td > label {
	border-radius: 0 0 10px 10px;
}
.jscShowSliderContentsList > table > tbody > tr > td > input:checked + label,
.horizontalLinkList > .normalSplitLineT > input:checked + label,
.verticalLinkList > .normalSplitLineT > input:checked + label {
	background: #BFB4AB;
	color: #FFFFFF !important;
}
.jscShowSliderContentsList > table > tbody > tr > td > input:checked + label:after,
.horizontalLinkList > .normalSplitLineT > input:checked + label:after,
.verticalLinkList > .normalSplitLineT > input:checked + label:after {
	content: url(/CSP/img/bt/smb/icons/icn_checked.png?switch=2025071615);
	display: block;
	position: absolute;
	top: 50%;
	right: 10px;
	margin-top: -7.5px;
}
.jscShowSliderContentsList > table > tbody > tr > td > input,
.horizontalLinkList > .normalSplitLineT > input,
.verticalLinkList > .normalSplitLineT > input {
	position: absolute;
	z-index: 200;
	width: 100%;
	height: 100%;
	opacity: 0;
	-webkit-box-sizing: border-box;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.verticalLinkList > .normalSplitLineT > a::after,
.verticalLinkList > .normalSplitLineT > span::after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	width: 9px;
	height: 14px;
	line-height: 1;
	margin-top: -6.5px;
	right: 10px;
	color: #7C7C7C;
	font-weight: bold;
	background: url(/CSP/img/common/smb/icon_link2.png?switch=2025071615) no-repeat 0 0;
	-webkit-background-size: 9px 14px;
	background-size: 9px 14px;
}

.showSliderContents {
	z-index: 0 !important;
	text-decoration: none !important;
	display: block;
}
.showSliderContentsList {
	z-index: 0 !important;
}
.showSliderContents > span::after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	width: 9px;
	height: 14px;
	line-height: 1;
	margin-top: -6.5px;
	right: 10px;
	color: #7C7C7C;
	font-weight: bold;
	background: url(/CSP/img/common/smb/icon_link2.png?switch=2025071615) no-repeat 0 0;
	-webkit-background-size: 9px 14px;
	background-size: 9px 14px;
	-webkit-transform: rotate(90deg);
}
.showSliderContentsOpened > span::after {
	-webkit-transform: rotate(-90deg) !important;
}
.verticalLinkList > .normalSplitLineT > a.link3:after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	width: 9px;
	height: 14px;
	line-height: 1;
	margin-top: -6.5px;
	right: 10px;
	color: #7C7C7C;
	font-weight: bold;
	background: url(/CSP/img/common/smb/icon_link3.png?switch=2025071615) no-repeat 0 0;
	-webkit-background-size: 9px 14px;
	background-size: 9px 14px;
	-webkit-background-size: 9px 14px;
	background-size: 9px 14px;
}
.verticalLinkList > .normalSplitLineT > a.link4:after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	width: 9px;
	height: 14px;
	line-height: 1;
	margin-top: -6.5px;
	right: 10px;
	color: #7C7C7C;
	font-weight: bold;
	background: url(/CSP/img/common/smb/icon_link4.png?switch=2025071615) no-repeat 0 0;
	-webkit-background-size: 9px 14px;
	background-size: 9px 14px;
	-webkit-background-size: 9px 14px;
	background-size: 9px 14px;
}
.verticalLinkList > .normalSplitLineT > a.link5:after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	width: 9px;
	height: 14px;
	line-height: 1;
	margin-top: -6.5px;
	right: 10px;
	color: #7C7C7C;
	font-weight: bold;
	background: url(/CSP/img/common/smb/icon_link5.png?switch=2025071615) no-repeat 0 0;
	-webkit-background-size: 9px 14px;
	background-size: 9px 14px;
	-webkit-background-size: 9px 14px;
	background-size: 9px 14px;
}
.verticalLinkList input[type="checkbox"] {
	margin-right: 5px;
}

/* ブロックの区切り線 */
.normalSplitLineT	{ border-top: 1px solid #BFB9B0; }
.normalSplitLineR	{ border-right: 1px solid #DADADA; }
.normalSplitLineB	{ border-bottom: 1px solid #BFB9B0; }
.normalSplitLineL	{ border-left: 1px solid #DADADA; }

/* 写真のシャドウ */
.imgBorder {
	outline: 1px solid #CCC;
	margin-bottom: 5px;
}
/* アイコン */
.icnPCSite {
	display: inline-block;
	padding-left: 20px;
	background: url(/CSP/img/bt/smb/icons/icn_pcsite.png?switch=2025071615) no-repeat left center;
}

/* アクションエリア */
.bottomActionAreaWrapper {
	width: 100%;
	position:relative;
	z-index:100;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.bottomActionArea {
	background-color: rgba(172, 153, 153, .8);
}

/************************************************************
 * CLASSES(プロパティ)
 ************************************************************/

/* WIDTH */
.w10p	{ width: 10%; }
.w12p	{ width: 12%; }
.w15p	{ width: 15%; }
.w16p	{ width: 16%; }
.w18p	{ width: 18%; }
.w19p	{ width: 19%; }
.w20p	{ width: 20%; }
.w25p	{ width: 25%; }
.w30p	{ width: 30%; }
.w33p	{ width: 33.3%; }
.w37p	{ width: 37%; }
.w40p	{ width: 40%; }
.w49p	{ width: 49%; }
.wQrtr	{ width: 25%; }
.w26p 	{ width: 26%; }
.w31p 	{ width: 31%; }
.w34p 	{ width: 34%; }
.wHalf	{ width: 50%; }
.w70p	{ width: 70%; }
.w75p	{ width: 75%; }
.w85p	{ width: 85%; }
.w90p 	{ width: 90%; }
.w95p 	{ width: 95%; }
.w96p 	{ width: 96%; }
.w97p 	{ width: 97%; }
.w97_5p	{ width: 97.5%; }
.w98p 	{ width: 98%; }
.wFull	{ width: 100%; }

.w13	{ width: 13px; }
.w18	{ width: 18px; }
.w30	{ width: 30px; }
.w40	{ width: 40px; }
.w45	{ width: 45px; }
.w50	{ width: 50px; }
.w60	{ width: 60px; }
.w66	{ width: 66px; }
.w70	{ width: 70px; }
.w77	{ width: 77px; }
.w78	{ width: 78px; }
.w80	{ width: 80px; }
.w81	{ width: 81px; }
.w90	{ width: 90px; }
.w94	{ width: 94px; }
.w95	{ width: 95px; }
.w98	{ width: 98px; }
.w99	{ width: 99px; }
.w100	{ width: 100px; }
.w101	{ width: 101px; }
.w115	{ width: 115px; }
.w119	{ width: 119px; }
.w120	{ width: 120px; }
.w123	{ width: 123px; }
.w130	{ width: 130px; }
.w150	{ width: 150px; }
.w154	{ width: 154px; }
.w180	{ width: 180px; }
.w200	{ width: 200px; }
.w210	{ width: 210px; }
.w220	{ width: 220px; }
.w236	{ width: 236px; }
.w240	{ width: 240px; }
.w245	{ width: 245px; }
.w260	{ width: 260px; }
.w262	{ width: 262px; }
.w280	{ width: 280px; }
.w290	{ width: 290px; }
.w300	{ width: 300px; }
.w315	{ width: 315px; }
.w320	{ width: 320px; }
.w159	{ width: 159px; }
.w171	{ width: 171px; }
.w172	{ width: 172px; }
.w500	{ width: 500px; }
.w560	{ width: 560px; }

/* HEIGHT */
.h30	{ height: 30px; }
.h44	{ height: 44px; }
.h50	{ height: 50px; }
.h52	{ height: 52px; }
.h60	{ height: 60px; }
.h73	{ height: 73px; }
.h90	{ height: 90px; }
.h103	{ height: 103px; }
.h104	{ height: 104px; }
.h118	{ height: 118px; }
.h133	{ height: 133px; }
.h153	{ height: 153px; }
.h205	{ height: 205px; }
.h209	{ height: 209px; }
.h255	{ height: 255px; }
.hFull	{ height: 100%; }

/* LINE-HIEGHT */
.lh14	{ line-height: 14px; }
.lh18	{ line-height: 18px; }

/* MARGIN */
.mT2	{ margin-top: 2px }
.mT3	{ margin-top: 3px }
.mT4	{ margin-top: 4px }
.mT5	{ margin-top: 5px }
.mT8	{ margin-top: 8px }
.mT9	{ margin-top: 9px }
.mT10	{ margin-top: 10px }
.mT12	{ margin-top: 12px }
.mT14	{ margin-top: 14px }
.mT15	{ margin-top: 15px }
.mT16	{ margin-top: 16px }
.mT18	{ margin-top: 18px }
.mT20	{ margin-top: 20px }
.mT24	{ margin-top: 24px }
.mT30	{ margin-top: 30px }
.mT32	{ margin-top: 32px }

.mR2	{ margin-right: 2px }
.mR3	{ margin-right: 3px }
.mR10	{ margin-right: 10px }
.mR13	{ margin-right: 13px }
.mR15	{ margin-right: 15px }
.mR20	{ margin-right: 20px }

.mB5	{ margin-bottom: 5px }
.mB15	{ margin-bottom: 15px }
.mB20	{ margin-bottom: 20px }
.mB40	{ margin-bottom: 40px }

.mL3	{ margin-left: 3px }
.mL5	{ margin-left: 5px }
.mL8	{ margin-left: 8px }
.mL10	{ margin-left: 10px }

.m0		{ margin: 0 !important; }

.mHA	{ margin-right: auto; margin-left: auto; }
.mH10	{ margin-left: 10px; margin-right: 10px; }

/* PADDING */
.pT2	{ padding-top: 2px; }
.pT7	{ padding-top: 7px; }
.pT10	{ padding-top: 10px; }
.pT20	{ padding-top: 20px; }
.pT32	{ padding-top: 32px; }

.pR5	{ padding-right: 5px; }
.pR8	{ padding-right: 8px; }

.pB5	{ padding-bottom: 5px; }
.pB10	{ padding-bottom: 10px; }
.pB18	{ padding-bottom: 18px; }
.pB20	{ padding-bottom: 20px; }
.pB40	{ padding-bottom: 40px; }

.pL5	{ padding-left: 5px; }
.pL10	{ padding-left: 10px; }

.pV2	{ padding-top: 2px; padding-bottom: 2px; }
.pV3	{ padding-top: 3px; padding-bottom: 3px; }
.pV5	{ padding-top: 5px; padding-bottom: 5px; }
.pV6	{ padding-top: 6px; padding-bottom: 6px; }
.pV8	{ padding-top: 8px; padding-bottom: 8px; }
.pV10	{ padding-top: 10px; padding-bottom: 10px; }

.pH10	{ padding-right: 10px; padding-left: 10px; }
.pH16	{ padding-right: 16px; padding-left: 16px; }

.p3		{ padding: 3px; }
.p5		{ padding: 5px; }

/* DISPLAY */
.dn		{ display: none; }
.db		{ display: block; }
.di		{ display: inline; }
.dib	{ display: inline-block !important; }
.dibBL	{ display: inline-block !important; *display: inline !important; zoom: 1; }
.dt		{ display: table; }
.dtc	{ display: table-cell; }
.offL	{ text-indent: -9999px; overflow: hidden; }
.fgClear{ *padding-top: 9999px; text-indent: -9999px; *text-indent: 0; overflow: hidden; }
.oh		{ overflow: hidden; }
.nowrap	{ white-space: nowrap; }

.o0	{ opacity: 0; }

/* POSITION */
.fl		{ float: left; }
.fr		{ float: right; }
.cb		{ clear: both; }

.taR	{ text-align: right !important; }
.taC	{ text-align: center !important; }
.taL	{ text-align: left !important; }

.baR	{ margin-left: auto !important; }
.baC	{ margin-left: auto !important; margin-right: auto !important; }
.baL	{ margin-right: auto!important; }

.vaT	{ vertical-align: top; }
.vaM	{ vertical-align: middle; }
.vaB	{ vertical-align: bottom; }

.pr			{ position: relative; zoom: 1; }
.pa			{ position: absolute; }
.top8		{ top: 8px; }
.right0		{ right: 0px; }
.right8		{ right: 8px; }
.bottom5	{ bottom: 5px; }

/* FOREGROUND */
.fgWhite		{ color: #FFFFFF; }
.fgDRed		{ color: #DD0000; }
.fgPink		{ color: #CC4466; }
.fgBrown	{ color: #632523; }
.fgGray		{ color: #666666; }
.fgLGray		{ color: #757575; }
.fgLLLGray	{ color: #CCCCCC; }
.fgDPurple	{ color: #AE2B5B; }

.b	{ font-weight: bold !important; }
.n	{ font-weight: normal !important; }

.fs10	{ font-size: 10px; }
.fs12	{ font-size: 12px; }
.fs14	{ font-size: 14px; }
.fs16	{ font-size: 16px; }
.fs18	{ font-size: 18px !important; }

/* BACKGROUND */
.bgLGray	{ background-color: #EEEEEE; }
.bgLLGray	{ background-color: #F0EEEC; }
.bgLBrown	{ background-color: #DDD8D3; }
.bgWhite	{ background-color: #FFFFFF; }

.hlCN { -webkit-tap-highlight-color: rgba(0,0,0,0); }

/* Login */
.bgErrorMsg {
	padding: 5px 5px;
	background-color: #F5DDDD;
}

.errorMsg {
	border: 1px solid #D36985;
	border-radius: 10px;
	background-color: #F5F3EF;
	color: #FF0000;
	font-weight: bold;
	padding: 8px 10px;
	margin-right: 10px;
	margin-left: 10px;
}

#searchStationName {
	ime-mode: active;
}

/* ページトップへ */
.pageTopLink > a {
	display: block;
	float: right;
	vertical-align: middle;
	padding: 0 4px;
	margin: 0 10px 10px 0;
	width: 100px;
	height: 24px;
	white-space: nowrap;
	line-height: 24px;
	font-size: 10px;
	color: #423535 !important;
	text-align: center;
	text-decoration: none;
	border-radius: 4px;
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%;
	border: solid 2px #BFB4AB;
}
.pageTopLink > a:before {
	content: '';
	display: inline-block;
	width: 0;
	height: 0;
	border: solid 3px transparent;
	border-bottom-color: #423535;
	margin: 0 4px 2px 0;
}

.searchListGrid {
	margin: 0 auto;
	max-width: 465px;
	border-top: solid 1px #BFB4AB;
	border-left: solid 1px #BFB4AB;
}
.searchListGrid > li {
	float: left;
	width: 33.3%;
}
.searchListGrid > li > a {
	display: block;
}
.searchListGrid > li > a > img {
	max-width: 99%;
	height: auto !important;
	border-right: solid 1px #BFB4AB;
	border-bottom: solid 1px #BFB4AB;
}

.imageCasetteWrapper > ul {
	display: flex;
	flex-wrap: wrap;
}
/* 縦向き: 3カラム */
@media only screen and (orientation:portrait) {
	.imageCasetteWrapper > ul li {
		width: calc(1 / 3 * 100%);
		height: calc(100vw / 3 / 3 * 4);
	}
}
/* 横向き: 4カラム */
@media screen and (orientation:landscape) {
	.imageCasetteWrapper > ul li {
		width: calc(1 / 4 * 100%);
		height: calc(100vw / 4 / 3 * 4);
	}
}
/* カタログに含まれるベストスタイルリボンの位置がaタグの基準のため、aタグにli分の高さをもたせるためにheight: 100%を指定する */
.imageCasetteWrapper > ul > li > a {
	height: 100%;
}
.imageCasetteWrapper > ul a > *, /* 外郭の調整 div.jscImgCopyGuardCover */
.imageCasetteWrapper > ul img {
	width: 100%;
}

/* for modalUpBox Styles */
.modalUpBox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
	z-index: 100;
	-webkit-transition: all .8s ease;
	/*-webkit-transform: scale(.9) translateY(50px) translateZ(1px);*/
	/*background-color: rgba(255, 255, 255, 0);*/
	background-color: rgba(230, 230, 230, 0.82);
	-webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, .3);
	-webkit-box-sizing: border-box;
	overflow: hidden;
	opacity: 0;

}
.modalUpBox.scaleToNormal {
	/*-webkit-transform: scale(1) translateY(0) translateZ(1px);*/
	opacity: 1;
}
.modalUpBox.scaleToNormal4Android {
	position: static;
}

#jsiChangeRulesBox {
	padding: 20px 15px;
}
.modalUpBox .modalInnerBox	{
	height: 100%;
}
.modalUpBox .modalInnerContents {
	height: 100%;
}
.modalInnerContentsHeader {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	padding: 4px;
	background-color: #8A7C7C;
	color: #FFFFFF;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	padding: 4px 0;
}
.modalInnerContentsMenu {
	height: 100%;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	line-height: 1.4em;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	background-color: #FFF;
}

.changeDirectionButtons {
	font-size: 0;
	height: 42px;
	line-height: 40px;
	text-align: center;
	white-space: nowrap;
	width: 100%;
}
.changeDirectionButtons > li {
	border-bottom: solid 1px rgba(152, 137, 137, 0.8);
	border-left: solid 1px rgba(152, 137, 137, 0.8);
	border-top: solid 1px rgba(152, 137, 137, 0.8);
	box-sizing: border-box;
	display: inline-block;
	font-size: 14px;
	font-weight: bold;
	width: 100px;
}
.changeDirectionButtons > li:first-child {
	border-bottom-left-radius: 8px;
	border-top-left-radius: 8px;
}
.changeDirectionButtons > li:last-child {
	border-bottom-right-radius: 8px;
	border-right: solid 1px rgba(152, 137, 137, 0.8);
	border-top-right-radius: 8px;
}
.changeDirectionButtons > li > a {
	background-color: rgba(255, 255, 255, 0.8);
	color: #555555;
	display: block;
}
.changeDirectionButtons > li:last-child > a {
	border-right: 0;
}
.changeDirectionButtons > li > .current {
	background-color: rgba(152, 137, 137, 0.8);
	color: #FFFFFF;
}
.changeDirectionButtons > li:first-child > a {
	border-bottom-left-radius: 6px;
	border-top-left-radius: 6px;
}
.changeDirectionButtons > li:last-child > a {
	border-bottom-right-radius: 6px;
	border-top-right-radius: 6px;
}

.changeAreaBox {
	border-radius: 10px;
	background: #BFB4AB;
}
.changeAreaBox select {
	font-size: 14px;
}
.changeAreaBox > dt {
	font-size: 16px;
	font-weight: bold;
	padding: 8px 10px 4px;
	border-radius: 10px 10px 0 0;
	color: #FFF;
}
.spinner {
	-webkit-transform: transformZ(10000000px) !important;
	position: fixed !important;
	top: 50% !important;
	left: 50% !important;
	z-index: 2000000000000000 !important;
}
.bgStripe {
	background: url('/CSP/img/hc/repeat/bg_contents_heading.png?switch=2025071615');
}
.keywordInputWrapper {
	padding: 0 10px;
	overflow: hidden;
}
.alertMsg {
	padding: 10px;
	margin-bottom: 10px;
}
.alertMsgInner {
	position: relative;
	border: 2px solid #DDC8CE;
	padding: 10px;
	background-color: #FEFEFE;
	border-radius: 8px;
	color: #CC4466;
}
.icnUp {
    border: 1px solid #E6AA61;
    color: #E6AA61 !important;
    display: inline-block;
    font-size: 10px;
    letter-spacing: 2px;
    line-height: 10px;
    padding-bottom: 1px;
    text-align: center;
    text-decoration: none !important;
    text-indent: 2px;
    width: 28px;
}
/* 20131029 add */
.gnavHc {
	background-color: #F0F0F0;
}
.gnavHc ul li {
	background-color: #F0F0F0;
}
.gnavHc ul li a {
	background-color: #FFFFFF;
}

/* sideMenu */
.sideMenu {
	background-color: #F5F3F1;
	bottom: 0;
	height: 100%;
	overflow-y: scroll;
	position: fixed;
	right: 0;
	top: 0;
	transform: translateX(300px);
	transition: transform 0.2s;
	width: 300px;
	z-index: 3001;
}
.sideMenu > ul {
	font-size: 13px;
	font-weight: bold;
}
.sideMenu + .wrapper {
	background-color: #FFF;
}
.sideMenu + .wrapper .header {
	overflow: hidden;
}
.sideMenu.isOpened {
	transform: translateX(0);
}
.sideMenu.isOpened + .wrapper {
	left: 0;
	position: fixed !important;
	width: 100%;
}
.sideMenu + .wrapper .wrapperCover {
	display: none;
}
.sideMenu.isOpened + .wrapper .wrapperCover {
	background-color: rgba(51, 51, 51, 0.8);
	bottom: 0;
	display: block;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 20;
}
.sideMenu.isOpened + .wrapper .wrapperCover::before {
	background: url(/CSP/img/my/smb/icons/common/icon_close.png?switch=2025071615) center / contain no-repeat;
	content: "";
	height: 24px;
	position: absolute;
	right: 312px;
	top: 12px;
	width: 24px;
}
.sideMenu.isOpened ~ .bottomActionAreaWrapper {
	display: none;
}
/* 374px以下(初代SE) */
@media (max-width: 374px) {
	.sideMenu {
		transform: translateX(275px);
		width: 275px;
	}
	.sideMenu.isOpened + .wrapper .wrapperCover::before {
		right: 287px;
	}
}

/* BOOKMARK */
.btnBmBefore,
.btnBmAfter {
	align-items: center;
	background-color: #FFFFFF;
	border: 1px solid #E0E1E2;
	border-radius: 8px;
	box-sizing: border-box;
	color: #333333 !important;
	display: flex;
	font-size: 13px;
	font-weight: bold;
	height: 44px;
	justify-content: center;
	margin: 0 auto;
	text-decoration: none;
	width: 177px;
 }
.btnBmAfter {
	color: #CC4466 !important;
}
.btnBmBefore::before,
.btnBmAfter::before {
	background-size: contain;
	content: "";
	height: 24px;
	margin-right: 4px;
	width: 24px;
}
.btnBmBefore::before {
	background-image: url(/CSP/img/svg/sp/icon_bookmark_off.svg?switch=2025071615);
}
.btnBmAfter::before {
	background-image: url(/CSP/img/svg/sp/icon_bookmark_on_bt.svg?switch=2025071615);
}

.fwInput {
	width: 100%;
	height: 44px;
	border: 1px solid #E0E1E2 !important;
	border-radius: 8px !important;
	color: #333333;
	box-sizing: border-box;
	appearance: none;
}
.fwInput::placeholder {
	color: #909090;
}

/* エリア選択モーダル */
body.isFixed {
	overflow: hidden;
}
.hcAreaSelectModalWrapper {
	background-color: #FFFFFF;
	display: none;
	height: 100%;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 1000;
}
.hcAreaSelectModalWrapper.isOpened,
.hcAreaSelectModalWrapper.isClosed {
	display: block;
}
.hcAreaSelectModalWrapper.isOpened {
	animation: slideUp 0.3s;
}
.hcAreaSelectModalWrapper.isClosed {
	animation: slideDown 0.3s;
}
@keyframes slideUp {
	0% {
		transform: translateY(120%);
	}
	100% {
		transform: translateY(0);
	}
}
@keyframes slideDown {
	0% {
		transform: translateY(0);
	}
	100% {
		transform: translateY(120%);
	}
}
.hcAreaSelectModalHeader {
	background-color: #FFFFFF;
	border-bottom: 1px solid #E0E1E2;
	display: flex;
	justify-content: center;
	padding: 16px 0;
	position: relative;
	z-index: 1002;
}
.hcAreaSelectModalHeader > span {
	color: #665555;
	font-size: 16px;
	font-weight: bold;
}
.hcAreaSelectModalHeader > a {
	background: url(/CSP/img/svg/sp/icon_close_bt.svg?switch=2025071615) center / contain;
	height: 24px;
	left: 16px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 24px;
}
.hcAreaSelectModalHeader > a::before {
	content: "";
	height: 44px;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 44px;
}
.hcAreaSelectInputWrapper.isFixed {
	background-color: rgba(51, 51, 51, 0.8);
	bottom: 0;
	height: 100%;
	left: 0;
	overflow: auto;
	position: fixed;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 1001;
}
.hcAreaSelectInputContainer {
	align-items: center;
	background-color: #FFFFFF;
	box-sizing: border-box;
	display: flex;
	padding: 12px 16px;
}
.hcAreaSelectInputWrapper.isFixed > .hcAreaSelectInputContainer {
	border-bottom: 1px solid #E0E1E2;
	position: fixed;
	top: 57px;
	width: 100%;
	z-index: 1;
}
.hcAreaSelectInput {
	-webkit-appearance: none;
	appearance: none;
	background: url(/CSP/img/svg/sp/icon_search_gray.svg?switch=2025071615) 8px / 18px no-repeat;
	border: 1px solid #E0E1E2 !important;
	border-radius: 8px !important;
	box-sizing: border-box;
	height: 36px;
	flex: 1;
	line-height: 36px !important;
	padding: 0 34px 0 30px !important;
	position: relative;
}
.hcAreaSelectInput[type="search"]::-webkit-search-cancel-button {
	-webkit-appearance: none;
	appearance: none;
	background: url(/CSP/img/svg/sp/icon_close_gray.svg?switch=2025071615) center / 14px 14px no-repeat;
	height: 44px;
	margin: 0;
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 36px;
}
.hcAreaSelectInput::placeholder {
	color: #909090;
}
.hcAreaSuggestClose {
	color: #333333 !important;
	display: none;
	font-weight: bold;
	margin-left: 12px;
	position: relative;
	text-decoration: none;
}
.hcAreaSuggestClose::before {
	content: "";
	height: 44px;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
}
.hcAreaSelectInputWrapper.isFixed .hcAreaSuggestClose {
	display: block;
}
.hcAreaSuggestResult {
	background-color: #FFFFFF;
	display: none;
	overflow-y: scroll;
	padding-top: 117px;
}
.hcAreaSelectInputWrapper.isFixed .hcAreaSuggestResult {
	display: block;
}
.hcAreaSuggestResultList > li {
	border-top: 1px solid #E0E1E2;
}
.hcAreaSuggestResultList > li:last-child {
	border-bottom: 1px solid #E0E1E2;
}
.hcAreaSuggestResultList > li > a {
	color: #333333;
	display: block;
	font-weight: bold;
	overflow: hidden;
	padding: 12px 10px 12px 52px;
	position: relative;
	text-decoration: none;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.hcAreaSuggestResultList > li.isMiddleArea > a {
	background: url(/CSP/img/svg/sp/icon_area_bt.svg?switch=2025071615) 12px center / 20px auto no-repeat;
	padding-left: 40px;
}
.hcAreaSuggestResultList > li.isSmallArea > a::before {
	border: solid #333333;
	border-width: 0 0 2px 2px;
	content: "";
	display: block;
	height: 6px;
	left: 40px;
	position: absolute;
	top: 18px;
	width: 6px;
}
.hcAreaSelectModalTtl {
	background-color: #EEEEEE;
	color: #333333;
	font-size: 14px;
	font-weight: bold;
	line-height: 1;
	padding: 7px 16px;
}
.hcAreaSelectBoxContainer {
	display: flex;
	flex-direction: column;
	padding: 0 16px;
}
.hcAreaSelectBoxContainer > select {
	align-items: center;
	-webkit-appearance: none;
	appearance: none;
	background: url(/CSP/img/svg/sp/icon_arrow_down_gray.svg?switch=2025071615) top 7px right 8px / 20px no-repeat;
	background-color: #FFFFFF;
	border: 1px solid #E0E1E2;
	border-radius: 8px;
	color: #333333;
	display: flex;
	height: 36px;
	margin-top: 12px;
	padding: 8px 28px 8px 8px;
	width: 100%;
}
.hcAreaSelectBoxContainer > select:disabled {
	opacity: 0.3;
}
.hcAreaSelectModalBottom {
	background-color: #FFFFFF;
	border-top: 1px solid #E0E1E2;
	bottom: 0;
	box-sizing: border-box;
	left: 0;
	padding: 12px 16px;
	position: fixed;
	width: 100%;
}
.hcAreaSelectModalBottomList {
	display: flex;
}
.hcAreaSelectModalBottomList > li {
	align-items: center;
	border-radius: 8px;
	box-sizing: border-box;
	display: flex;
	font-weight: bold;
	height: 44px;
	justify-content: center;
}
.hcAreaSelectModalBottomList > li + li {
	margin-left: 8px;
}
.hcAreaSelectClearBtn {
	width: calc(117 / 375 * 100vw);
}
.hcAreaSelectDecideBtn {
	flex: 1;
}
.hcAreaSelectModalBottomList > li > a {
	width: 100%;
}

/* 新ボタン */
.btnFilled,
.btnOutlinedNegative {
	align-items: center;
	-webkit-appearance: none;
	appearance: none;
	border: 1px solid;
	border-radius: 8px;
	box-sizing: border-box;
	display: flex;
	font-size: 14px;
	font-weight: bold;
	justify-content: center;
	line-height: 1;
	min-height: 44px;
	outline: none;
	padding: 0;
	text-decoration: none;
}
.btnFilled {
	background-color: #D36985;
	border-color: #D36985;
	color: #FFFFFF !important;
}
.btnOutlinedNegative {
	background-color: #FFFFFF;
	border-color: #E0E1E2;
	color: #333333 !important;
}

/* テキストリンク */
.commonTextLinkWithHelpIcon {
	background: url(/CSP/img/svg/sp/icon_help_navy.svg?switch=2025071615) left center / 14px no-repeat;
	display: inline-block;
	font-size: 11px;
	line-height: 16px;
	padding-left: 18px;
	text-decoration: none;
}

/* テキストリンクに付随するクラス（クリッカブルエリア拡張する） */
.clickableAreaSmall {
	position: relative;
}
.clickableAreaSmall::after {
	content: "";
	height: 28px;
	left: 0;
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
}