@CHARSET "UTF-8";
/********************************************************************/
/*ベース                                                            */
/********************************************************************/
/********************************/
/*カスタム変数                  */
/********************************/
:root {
	/*変わらない色*/
	--logo-facebook-color: #1778f2;		/*青系(ブランドカラー)*/
	--logo-twitter-color: #000;		/*青系(ブランドカラー)*/
	
	/*スタイル変更用で固定*/
	--black: #000;			/*黒*/
	--yellow: #ff0;			/*黄色*/
	--blue: #00f;			/*青*/

}
/********************************/
/*基本タグ、class関連の上書き   */
/********************************/
/*フォント設定*/
/*色*/
html,
body{
	color: var(--base-font-color) !important;
	font-family:Meiryo, "Helvetica Neue", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;/*"Segoe UI", */
	word-wrap : break-word;
	overflow-wrap : break-word;
}
body{
	height: 100%;
	background-color:var(--base-bg-color) ;
}

a{
	text-decoration:none;
}

a:not(.btn) {
	color:var(--base-link-color)  !important;
}

/*疑似要素*/
a:hover ,
.btn:hover{
	opacity: 0.5;
}

/*無効時は透過させない*/
.btn:disabled{
	opacity: 1;
}

.btn-primary,
.btn-primary:hover,
.btn-primary:active,
a.btn-primary,
a.btn-primary:hover,
a.btn-primary:active,
.dropdown-item.active, 
.dropdown-item:active,
.list-group-item.active,
.page-item.active .page-link{
	color: var(--primary-btn-font-color)  !important;
	background-color: var(--primary-color) !important;
	border-color: var(--primary-color) !important;
}


.btn-outline-primary,
.btn-outline-primary:hover,
.btn-outline-primary:active,
a.btn-outline-primary,
a.btn-outline-primary:hover,
a.btn-outline-primary:active,
.dropdown-menu,
.page-link{
	color: var(--primary-color) ;
	background-color: var(--outline-bg-color) ;
	border-color: var(--primary-color);
}

.page-item.disabled .page-link{
	background-color: var(--outline-bg-color) ;
	border-color: var(--primary-color);
}

.dropdown-menu.show {
    z-index: 3000;
}

.card{
	background-color:var(--base-bg-color);
	border-color:var(--base-border-color);
}

.accordion-item,
.accordion-button,
.list-group-item{
	background-color:var(--base-bg-color);
	border-color:var(--base-border-color);
	color:var(--base-font-color) ;
}


/*チェックボックス*/
.form-check-input:checked {
	background-color:var(--primary-color);
	border-color:var(--primary-color);
}

/*プレースホルダ*/
input::placeholder{
	color:var(--base-font-color) ;
}

.material-icons {
	font-size: 1rem  !important;
}

/*管理画面のタグで設定する*/
a.tagLink{
	color: var(--base-link-color) !important;		/*青*/
	text-decoration: underline;
}
/*背景タグ*/
mark.spTag{
	display:block;
	margin:1.6em 0 0;		/*line-heightが1.6なのでtop1.6改行でbrが入るのでbottomは0*/
	padding: 2em 3em;
}
body.size_xs mark.spTag{
	margin:1.6em 0 0;
	padding: 0.5em 1em;
}
/*見出しタグ*/
h3.spTag{
	padding:0.25em 0 0.25em 0.5em;
	border-left:3px solid var(--primary-color);
}

/*パンクズ */
.breadcrumb{
	background-color:transparent;
	font-size:0.875rem;
	margin-bottom: 0rem;
}
.breadcrumb-item.active{
	color:var(--base-font-color);
}

/*区切り/→>に変更*/
.breadcrumb-item + .breadcrumb-item::before {
	content: ">";
}

/*非表示*/
.hide{
	display: none;
}

/****************************/
/*snsアイコン               */
/****************************/
/*背景色つける場合*/
.snsLink.d-flex{
	width: 2.5rem;
	height: 2.5rem;
}

/*基本サイズ*/
.snsLink svg {
	width: 2rem;
	height: 2rem;
}

.snsLink .logoFacebook{
	--circle-color:var(--logo-facebook-color);
	--path-color:var(--bs-white);
}

.snsLink .logoTwitter{
	fill:var(--logo-twitter-color);
}


/********************************/
/*言語変更ドロップダウン    */
/********************************/
.dropdownLang .dropdown-toggle::after {
	content: none;
}

.dropdownLang .dropdown-toggle i.material-icons{
	font-size: 1.5rem !important;
}

/********************************/
/*スタイル変更共通              */
/********************************/
#menuSp .bgWhite,
.dropdownStyle .dropdown-menu .bgWhite{
	background-color: var(--bs-white);
}

#menuSp .bgWhite a,
.dropdownStyle .dropdown-menu .bgWhite a{
	color: var(--black) !important;
}

#menuSp .bgBlack,
.dropdownStyle .dropdown-menu .bgBlack{
	background-color: var(--black);
}

#menuSp .bgBlack a,
.dropdownStyle .dropdown-menu .bgBlack a{
	color: var(--yellow) !important;
}

#menuSp .bgBlue,
.dropdownStyle .dropdown-menu .bgBlue{
	background-color: var(--blue);
}

#menuSp .bgBlue a,
.dropdownStyle .dropdown-menu .bgBlue a{
	color: var(--bs-white) !important;
}

/********************************/
/*スタイル変更ドロップダウン    */
/********************************/
.dropdownStyle .dropdown-toggle::after {
	content: none;
}

.dropdownStyle .dropdown-toggle i.material-icons{
	font-size: 1.5rem !important;
}

.dropdownStyle .dropdown-menu{
	min-width: 13rem;
}


/********************************/
/*スタイル変更スマホメニュー    */
/********************************/
#fontSizeOuter,
#bgColorOuter{
	width: 15rem;
	max-width:350px;
}

/********************************/
/*クッキーモーダル              */
/********************************/
body.size_xs #cookieAgree .modal-dialog,
body.size_sm #cookieAgree .modal-dialog{
	max-width: 93vw;/*5sで縦が見切れるので幅広に設定*/
	margin: 0 auto;
}
#cookieAgree .modal-body a{
	text-decoration:underline;
}
/*ボタン幅*/
#cookieAgree .modal-footer .btn{
	width:10rem;
}


/********************************/
/*ページャー                    */
/********************************/
/*間隔の調整*/
ul.pagination li.page-item{
	margin:0 0.5rem;
	padding:0;
}
/*サイズの調整*/
ul.pagination li.page-item a{
	padding:0;
	margin:0;
	min-width: 2rem;
	height: 2rem;
	font-size:1.2rem;
	font-weight:bold;
	display: flex;
	justify-content: center;
	align-items: center;
}
/*矢印は少し大きくする*/
ul.pagination li.page-item a .material-icons{
	font-size:2rem !important;
}

/*無効時の色を薄くする*/
ul.pagination li.disabled a{
	color: var(--bs-gray) !important;
}

.page-item:first-child .page-link{
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.page-item:last-child .page-link {
    border-top-right-radius:0;
    border-bottom-right-radius:0;
}


/********************************/
/*ヘッダー                      */
/********************************/
.offcanvas-end {
	background-color: var(--base-bg-color);
}


/********************************/
/*フッター                      */
/********************************/
/*bootstrap sticky footer*/
html {
  position: relative;
  min-height: 100%;
}
body {
  margin-bottom: 2rem;
}

footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 1.7rem;
	line-height: 1.7rem;
	font-size: 0.9rem;
}

/********************************/
/*クッキーモーダル              */
/********************************/
body.size_xs #cookieAgree .modal-dialog,
body.size_sm #cookieAgree .modal-dialog{
	max-width: 93vw;/*5sで縦が見切れるので幅広に設定*/
	margin: 0 auto;
}
#cookieAgree .modal-body a{
	text-decoration:underline;
}
/*ボタン幅*/
#cookieAgree .modal-footer .btn{
	width:10rem;
}

/********************************/
/*ページTOPアイコン             */
/********************************/
/*デフォルトグレーでsite.cssで上書き*/

/*ページTOP位置*/
#gotoPageTop {
	display:none;
	position: fixed;
	right: 1.1rem;
    bottom: 0.4rem;
	width: 4rem;
	height: 4rem;
	z-index:2500;
}

/*丸のベース（白の透過設定）*/
#gotoPageTop svg{
	height:4rem; 
	width:4rem; 
}
#gotoPageTop #svgGotoPageCircleBase{
	fill: var(--outline-bg-color) ;
	opacity: 0.7;
}
#gotoPageTop #svgGotoPageCircleLine{
	fill: none;
	stroke: var(--primary-color);
	stroke-width: 1.5px;
}
#gotoPageTop #svgGotoPageCircleLineOuter{
	stroke: none;
}
#gotoPageTop #svgGotoPageCircleLineInner{
	fill: none;
}
/*上矢印*/
#gotoPageTop #svgGotoPageArrow{
	fill: none;
	stroke: var(--primary-color);
	stroke-width: 1.5px;
	stroke-miterlimit: 10;   

}
/*TOPのフォント設定*/
#gotoPageTop #svgGotoPageTopText{
	fill: var(--primary-color);
	font-size: 0.8rem;
	font-weight:bold;
	font-family:arial, sans-serif;
}

/*文字サイズを大きくするとページャーにかかるので位置を変更*/
body[id$="_List"].size_xs #gotoPageTop,
body[id$="_List"].size_sm #gotoPageTop{
    bottom: 3.5rem !important;
}

/********************************/
/*カルーセル上書き              */
/********************************/
/*左右矢印コントロール*/
.carousel-control-prev,
.carousel-control-next {
	opacity:1;
}
.carousel-control-next-icon,
.carousel-control-prev-icon{
	background-image:none;
	width:auto;
}
.carousel-control-prev-icon:before,
.carousel-control-next-icon:before{
	font-family: 'Material Icons';
    font-size: 4rem !important;
    color: var(---base-link-color);
}
.carousel-control-next-icon:before{
	content:'navigate_next';
}
.carousel-control-prev-icon:before{
	content:'navigate_before';
}

/*左右矢印コントロール(スマホ)*/
body.size_xs .carousel-control-next-icon:before,
body.size_sm .carousel-control-next-icon:before,
body.size_xs .carousel-control-prev-icon:before,
body.size_sm .carousel-control-prev-icon:before{
    font-size: 3rem !important;
}

/*ドットインジケーター*/
.dot.carousel-indicators button, 
#dot.carousel-indicators button {
	width: 0.8rem;
	height: 0.8rem;
	border-radius: 100%;
	border: none;
	background-color:var(--outline-bg-color);
	border: 2px solid var(--base-link-color);
	opacity: 1;
}
.dot.carousel-indicators button.active,
#dot.carousel-indicators button.active{
	background-color:var(--base-link-color);	/*青系*/
}

.autoPlayCtrBtn button{
	padding:0;
	width: 1.1rem !important;
	height: 1.1rem !important;
	border-radius: 0% !important;
	color:var(--base-link-color);	/*青系*/
}

.autoPlayCtrBtn .play{
	display:none;
}

/********************************/
/*その他部品                    */
/********************************/
/*共通SVG、サイトSVG非表示*/
#comSvg,
#siteSvg{
	display:none;
}

/*画像カバー*/
img.objFitCover{
	object-fit: cover;
}

/*バッジ*/
.comBadge{
	color:var(--primary-btn-font-color);
	padding:.35em .4em;
    font-size: 0.7rem;
    font-weight:normal;
    border-radius:0;
}
.comBadge.NEW{
	background:var(--color-attention);
}
.comBadge.END{
	background:var(--color-end);
}

/*三角*/
.triangleMark{
	position:absolute;
	top: 0;
	left:0;
	
	color:var(--primary-btn-font-color);
    font-weight:normal;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 3.5rem 3.5rem;
}

/*NEW*/
.triangleMark.NEW{
	border-color: transparent transparent transparent var(--color-attention);
}
/*END*/
.triangleMark.END{
	border-color: transparent transparent transparent var(--color-end);
}

.triangleMark>span{
	position:absolute;
	top: 1.4rem;
	left:-3.5rem;
	transform-origin:left top;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	font-size:0.8rem;
	font-family:"ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN,Arial,"メイリオ", Meiryo, sans-serif;	/*斜めにすると、見にくいのでフォントを変える*/
}


/********************************************************************/
/*各ページ                                                          */
/********************************************************************/

/********************************/
/*course,event,point,download共通*/
/********************************/
/*-------------------
カード関連
--------------------*/
/*画像の高さを揃える*/
.card.comLayout .card-img-top{
	width: 100%;
	height: 12rem;
	object-fit: cover;
}
/*期間の高さを設定するポジション指定*/
.card.comLayout{
	 position:relative;
}
.card.comLayout .card-title{
	margin-bottom: 3rem;
}
.card.comLayout .card-text{
	position:absolute;
	bottom:1rem;
	left:0.5rem;	/*.card-bodyの横側のpaddingに合わせる　1.25remがブートストラップのデフォルト*/
	right:0.5rem;	/*.card-bodyの横側のpaddingに合わせる　1.25remがブートストラップのデフォルト*/
}
.card.comLayout .card-text p{
	margin-bottom: 0.2rem;
	line-height:1.15rem;
}
/*カードの*/
.card.comLayout .imgCardOuter{
	position:relative;
}

/*カードBody*/
.card.comLayout .card-body{
	 position:relative;
	 padding: 1.25rem 0.5rem;
}

/*カードのカテゴリは３点リード*/
.card.comLayout .card-body .card-text .category{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#p_Event_List .card.comLayout .card-title{
	margin-bottom: 3.5rem;
}
#p_Point_Detail #relateEvent .card.comLayout .card-title{
	margin-bottom: 4.5rem;
	
}

/*-------------------
検索関連
--------------------*/
/*サイドバー*/
#sidebar-container .sticky-top{
	top: 100px;	/*スクロール時固定する高さ*/
}

#sidebar-container #searchConditions.hide{
	display:none;
}

/*検索条件の折り返し対応*/
#sidebar-container #searchConditions .list-inline .list-inline-item{
	word-break : break-all;
}

/*キーワード*/
#sidebar-container #refineFrm #keywordArea{
	position:relative;
}

#sidebar-container #refineFrm #keywordArea label{
	position:absolute;
	right:1rem;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

#sidebar-container #refineFrm #keywordArea input#keyword[type='text'] {
	border-radius: 1rem;
	border:2px solid var(--base-link-color);
	background-color: var(--outline-bg-color) ;
	color: var(--base-font-color) ;
	height: 2.2rem;
}

/*スマホ時のキーワード*/
body.size_xs.isRefine #sidebar-container #refineFrm #keywordArea input#keyword[type='text'],
body.size_sm.isRefine #sidebar-container #refineFrm #keywordArea input#keyword[type='text'] {
	height:3rem;
	border-radius:2rem;
}




/*カテゴリ*/
#sidebar-container #refineFrm #searchCategory{
	overflow-y:auto;
	overflow-x:hidden;
	word-break : break-all;
}
/*カテゴリのマーカー画像*/
#sidebar-container #refineFrm #searchCategory img.searchMaker{
	width: 1.5rem;
	height:1.5rem;
}


/*カテゴリがsize_mdの時、幅が狭いので 調整*/
body.size_md  #searchCategory li{
	padding: 0.75rem 0.25rem;
}

body.size_md #sidebar-container #refineFrm #searchCategory img.searchMaker{
	width: 1.2rem;
	height:1.2rem;
}

/*MAP上の再検索ボタンのz-index関係で設定*/
body.size_xs.isRefine #searchCategory ul.list-group,
body.size_sm.isRefine #searchCategory ul.list-group,	
body.size_xs.isRefine #searchCategory .categoryGroup,
body.size_sm.isRefine #searchCategory .categoryGroup{
	position: relative;
}

/*チェックボックス（デフォルトの設定を初期化）*/
#sidebar-container #refineFrm .form-check-input{
	position: static;	/*元はabsolute*/
	margin-left:0;	/*元は-1.25rem;*/
	min-width: 1rem;
}


/*スマホ検索時に非表示*/
/*ヘッダー画像*/
body.size_xs.isRefine #headerImg,
body.size_sm.isRefine #headerImg,
/*絞り込みボタングループ*/
body.size_xs.isRefine #refineBtnGroup,
body.size_sm.isRefine #refineBtnGroup,
/*検索件数*/
body.size_xs.isRefine #resultStats,
body.size_sm.isRefine #resultStats,
/*検索結果*/
body.size_xs.isRefine #resultList,
body.size_sm.isRefine #resultList,
/*ページャー*/
body.size_xs.isRefine #bottomPager,
body.size_sm.isRefine #bottomPager,
/*フッター*/
body.size_xs.isRefine footer,
body.size_sm.isRefine footer,
/*MAPページのMAP*/
#p_Point_Map.size_xs.isRefine #mapDiv,
#p_Point_Map.size_sm.isRefine #mapDiv{
	display:none !important;
}

/*スマホ検索時に表示*/
/*検索フォーム*/
body.size_xs.isRefine #refineFrm,
body.size_sm.isRefine #refineFrm,
/*閉じるボタン*/
body.size_xs.isRefine #closeBtn,
body.size_sm.isRefine #closeBtn{
	display:block !important;
}

/*スマホ検索時のフッター表示*/
body.size_xs.isRefine #searchBtnGroup,
body.size_sm.isRefine #searchBtnGroup{
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	z-index:1000;
	background:var(--base-bg-color);
}


/*MAP・リストの遷移ボタン*/
#p_Point_Map .btn.linkBtnShowList,
#p_Point_List .btn.linkBtnShowMap{
	position:relative;
}

/*PC版はボーダーを太くする*/
#p_Point_Map.size_md .btn.linkBtnShowList,
#p_Point_List.size_md .btn.linkBtnShowMap,
#p_Point_Map.size_lg .btn.linkBtnShowList,
#p_Point_List.size_lg .btn.linkBtnShowMap,
#p_Point_Map.size_xl .btn.linkBtnShowList,
#p_Point_List.size_xl .btn.linkBtnShowMap{
	border-width:2px;
}

#p_Point_Map .btn.linkBtnShowList > i.material-icons,
#p_Point_List .btn.linkBtnShowMap > i.material-icons{
	line-height: 1rem !important;
	font-size: 1.5rem;
	position:absolute;
	top: 50%;
	right:0.25rem;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	vertical-align: bottom;
}
/*英語でぎりぎりの為調整*/
#p_Point_List.size_md .btn.linkBtnShowMap > i.material-icons{
	right: -0.1rem;
}

/*iosのバウンス対策をjsで行ったらスクロールしなくなったのでスタイル追加*/
#p_Point_Map.size_xs.isRefine,
#p_Point_Map.size_sm.isRefine{
	margin-bottom: 3rem;
}
#p_Point_Map.size_xs.isRefine #contents,
#p_Point_Map.size_sm.isRefine #contents{
	height: 100%;
	overflow-y: auto;
}


#p_Point_Map.size_xs #preViewList .detailLink, 
#p_Point_Map.size_sm #preViewList .detailLink{
	margin-right:1rem;		/*スライダーコントロールと被るのでずらす*/
}

/*スライダーのコントロール*/
#p_Point_Map #spControl .carousel-control-next, 
#p_Point_Map #spControl .carousel-control-prev {
	width: 3rem;
	margin:0;
}


/*-------------------
詳細MAP関連
--------------------*/
/*共通MAP設定*/
#mapDiv.comMap{
	width: 100%;
	height:30rem;
}

/*-------------------
詳細ポイントリスト関連
--------------------*/
#pointList .row{
	position:relative;
	border-width: 2px !important;
}


/*ポイントリスト画像*/
#pointList .row .leftCol img{
	width: 100%;
	height: 10rem;
	object-fit: cover;
}

#pointList .row .rightCol > div{
	padding-right:2rem;
}

/*矢印*/
#pointList .row i.material-icons.arrow{
	position:absolute;
	right:0;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	font-size: 2rem !important;
	width: auto;
}

/*コースの区間情報*/
#pointList .row .courseSpan{
	 position:absolute;
	 bottom:-0.75rem;
	 width: auto;
	background-color: var(--base-link-color) ;
	color: var(--primary-btn-font-color)  !important;

}
/*コースの区間アイコン*/
#pointList .row .courseSpan i.material-icons{
	line-height: 1rem !important;
}



/*各詳細の画像設定*/
#mainImage,
#p_Point_Detail #carouselSlide{
	height: 25em;	/*本体高さ設定*/
}
body.size_sm #mainImage,
body.size_xs #mainImage,
#p_Point_Detail.size_sm #carouselSlide,
#p_Point_Detail.size_xs #carouselSlide{
	max-height: 200px;	/*ここはピクセル 3:2の画像サイズで調整*/
}
/*画像のサイズを縦横比維持して縮小*/
#mainImage img,
#p_Point_Detail #carouselSlide .carousel-inner .carousel-item img,
#p_Point_Detail ol#carouselThumb li img{
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
}

/*-------------------
その他
--------------------*/


/*カテゴリの色*/
.category{
	color:var(--base-font-color);
}

/********************************/
/*ダウンロードlist              */
/********************************/
#p_Download_List .row .leftCol{
	display:block;
}
/*ダウンロードは画像を全部表示する*/
#p_Download_List .row .leftCol img{
	width: 100%;
	object-fit: contain;
	object-position: top;
}


/*スマホの時だけ縦の幅を指定する*/
#p_Download_List .listImgOuter{
	position: relative;
}
#p_Download_List.size_sm .listImgOuter,
#p_Download_List.size_xs .listImgOuter{
	margin:0 auto;
	max-width:16rem;	/*高さ12で4対3*/
}



/********************************/
/*ダウンロードCard             */
/********************************/
/*ダウンロードは画像を全部表示する*/
#p_Download_Card .card.comLayout .card-img-top{
	object-fit: contain;	
	padding-top:0.5rem;
}
/*ボタンの高さ調整*/
#p_Download_Card .card.comLayout .card-title{
	margin-bottom: 3rem;
}
/*ボタン*/
#p_Download_Card .card.comLayout .card-text {
	/*センタリングしたいので設定*/
	left: 0;
	right: 0;
}
#p_Download_Card .card.comLayout .card-text a{
	display:inline;	/*block設定を戻す、inline-blockだと縦が広い*/
}

/*newマーク*/
#p_Download_Card .card.comLayout .cardImgOuter{
	position: relative;
}

/********************************/
/*コースlist                    */
/********************************/
/*高さ調整*/
/*カテゴリなし*/
#p_Course_List .card.comLayout .card-title{
	margin-bottom: 2rem;
}
#p_Course_List.size_md .card.comLayout .card-title,
#p_Course_List.size_xs .card.comLayout .card-title,
#p_Course_List.size_sm .card.comLayout .card-title{
	margin-bottom: 3rem;	/*スマホは距離と時間を違う行で表示する為*/
}

/*カテゴリあり*/
#p_Course_List .card.comLayout .card-title.hasCategory{
	margin-bottom: 3rem;
}
#p_Course_List.size_xs .card.comLayout .card-title.hasCategory,
#p_Course_List.size_sm .card.comLayout .card-title.hasCategory{
	margin-bottom: 4rem;	/*スマホは距離と時間を違う行で表示する為*/
}

/********************************/
/*イベントlist                  */
/********************************/


/********************************/
/*ポイントlist                  */
/********************************/

/********************************/
/*ポイントMAP                   */
/********************************/
body#p_Point_Map{
	margin-bottom:0;	/*フッター用のマージンを打ち消す*/
}

/* このエリアを検索（あとから追加してDOMの構造を変えたくなかったのでjsで位置を制御）*/
#p_Point_Map #mapContents #areaSearch{
	position:fixed;
	bottom:0;
	left: 50%;
	transform:translateX(-50%);
	-webkit- transform:translateX(-50%);
	display:none;
}

#p_Point_Map #mapContents #areaSearch button.bg-white{
	background-color: var(--outline-bg-color) !important;
}

/*-------------------
Map用の右ナビ
--------------------*/
/*右ナビワイヤー*/
#p_Point_Map #mapNavi{
	background-color: var(--bg-light);
	border-left:2px solid;
	/*位置調整jsで制御*/
	position: fixed;
	right:0px;
	width:300px;
	/*アニメーション*/
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

/*右ナビワイヤー スマホ時は透過*/
#p_Point_Map.size_xs #mapNavi, 
#p_Point_Map.size_sm #mapNavi{
	background-color:transparent;
	/*レイアウト計算時に遅延してMAPの高さがずれるのでoff*/
	-webkit-transition:none;
	transition:none;
	width:100% !important;
}

/*タブ位置調整*/
#p_Point_Map #mapNavi .nav-tabs{
	position:absolute;
	right:300px;
	top:0.5em;
	border-bottom: none;
	/*縦表示*/
	writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	padding:0;	/*vertical-rlで発生するマージンを打ち消し*/
	margin: 0;
}
/*タブ共通*/
#p_Point_Map #mapNavi .nav-tabs li{
	height:6em;
	margin-top:0.5em;
	padding-top:0.5em;
	border:none;
	background-color: var(--base-bg-color);
}

#p_Point_Map #mapNavi .nav-tabs li a{
	position:relative;
	display: block;
	height: 100%;
}
/*タブアクティブ*/
#p_Point_Map #mapNavi .nav-tabs li.active{
	background-color: var(--bg-light);
	border-style: solid;
	border-width:2px 0 2px 2px;
	margin-right: -2px;
}
/*タブアイコンの位置調整*/
#p_Point_Map #mapNavi .nav-tabs li i{
	position: absolute;
	bottom: 0;	/*英語で被るのでマイナスにした*/
	/*horizontal-tbにしたら必要になった*/
	right:0;
	left:0;
	text-align:center;
	writing-mode: horizontal-tb; /*IE、エッジでアイコンも向きが変わるので戻す*/
}

/*デフォルトは検索条件選択*/
#p_Point_Map #mapNavi .nav-tabs #preViewTab .closeSbar,
#p_Point_Map #mapNavi .nav-tabs #searchTab .openSbar{
	display:none;
}

/*スマホはデフォルトリスト非表示*/
#p_Point_Map.size_xs #mapNavi #preView,
#p_Point_Map.size_sm #mapNavi #preView{
	display:none;
}
/*スマホはデフォルト検索のみ表示*/
#p_Point_Map.size_xs #mapNavi #search,
#p_Point_Map.size_sm #mapNavi #search{
	display:block;
}

/*スマホはボーダーなし*/
#p_Point_Map.size_xs #mapNavi,
#p_Point_Map.size_sm #mapNavi{
	border:none;
}


#p_Point_Map.size_xs #mapNavi .detail,
#p_Point_Map.size_sm #mapNavi .detail{
	height: 8rem;
	overflow-y: auto;
}




/*-------------------
Map用リスト
--------------------*/
#p_Point_Map #mapNavi #sidebar-container{
	height:100%;
}
/*プレビューリスト*/
#p_Point_Map #mapNavi #sidebar-container #preView{
	overflow-x:hidden;
	overflow-y:auto;
}

#p_Point_Map #mapNavi #sidebar-container #preView #preViewList #preViewClearBtn{
	display:none;
}

/*各カラム*/
#p_Point_Map #mapNavi #sidebar-container #preView .preViewCol{
	background-color:var(--base-bg-color);
	color:var(--base-font-color) !important;
	line-height: 1.15;
}
/*画像*/
#p_Point_Map #mapNavi #sidebar-container #preView .preViewCol img{
	height:10rem;
	width: 100%;
	object-fit: cover;
}


/*スマホ プレビューリスト*/
#p_Point_Map.size_xs.showMapList #mapNavi #preView,
#p_Point_Map.size_sm.showMapList #mapNavi #preView {
	display: block;
	position:fixed;
	bottom:3rem;
	left:0;
	right:0;
	z-index:2000;
	overflow:hidden !important;
	height:13.5rem !important;		/*スマホ時のプレビュー高さ調整 代える場合は#spControlCloseも変更 */
}
#p_Point_Map.size_xs.showMapList #mapNavi #preView #preViewList, 
#p_Point_Map.size_sm.showMapList #mapNavi #preView #preViewList, 
#p_Point_Map.size_xs.showMapList #mapNavi #preView #preViewList .preViewCol, 
#p_Point_Map.size_sm.showMapList #mapNavi #preView #preViewList .preViewCol{
	height:100%;
}


/*スマホ時はタイトル省略*/
#p_Point_Map.size_xs.showMapList #mapNavi #preView #preViewList .preViewCol dt,
#p_Point_Map.size_sm.showMapList #mapNavi #preView #preViewList .preViewCol dt{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
/*スマホ時の閉じる*/
#p_Point_Map  #spControlClose{
	display: none;
}
#p_Point_Map.size_xs.showMapList #spControlClose,
#p_Point_Map.size_sm.showMapList #spControlClose{
	display: block;
	width:2rem;height:2rem;
	position:fixed;
	bottom:15.5rem;	/*スマホ時のプレビュー高さ調整15-1（高さの半分）*/
	right:0;		
	z-index:3000;
}

/********************************/
/*お知らせlist                  */
/********************************/
#p_Announce_List ul.list-group li.list-group-item{
	border-style: dotted;
	border-top:0;
	margin-bottom:0.1rem;/*これが無いと下線が見えなくなる*/
}

/********************************/
/*イベントdetail                */
/********************************/
#p_Event_Detail #detailArea{
	padding:0 3em;
}
#p_Event_Detail #detailArea div.spTagDiv{
	margin: 0 -3em;	/*画像は大きくする*/
}
#p_Event_Detail.size_xs #detailArea{
	padding:0 1.5em;
}
#p_Event_Detail.size_xs #detailArea div.spTagDiv{
	margin: 0 -1.5em;	/*画像は大きくする*/
}

/********************************/
/*ポイントdetail                */
/********************************/
#p_Point_Detail #pointInfo dl{
	border-bottom:1px dotted var(--base-border-color);
}

/*-------------------
カルーセルスライダー
--------------------*/

#p_Point_Detail #carouselSlide{
	margin-bottom: 1.5rem;
}

#p_Point_Detail #dot.carousel-indicators{
	margin-bottom:-1.2rem;
}

/*サムネイルインジケーター*/
#p_Point_Detail ol#carouselThumb{
	position:static;	/*デフォルト設定打ち消し*/
}
#p_Point_Detail ol#carouselThumb li{
	height: 4em;	/*サムネイル高さ指定*/
	cursor: pointer;
	/*デフォルト設定打ち消し*/
	text-indent:0;
	width: auto;
	border:none;
}

/*メイン画像センター*/
#p_Point_Detail #carouselSlide .carousel-inner .carousel-item img{
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}


/********************************/
/*コースdetail                */
/********************************/


/********************************/
/*お知らせdetail                */
/********************************/


/********************************/
/*動画                          */
/********************************/
#p_Movie_List .card.comLayout > div {
	position: relative;
}

#p_Movie_List .card.comLayout .card-img-top {
	height: 15rem;
}

#p_Movie_List .card.comLayout .card-title {
	margin-bottom: 0;
}

#p_Movie_List .card.comLayout span.iconArea{
	position: absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	display: flex;
	justify-content: center;
	align-items: center;
}

#p_Movie_List .card.comLayout span.iconArea i {
	font-size: 7rem !important;
}

#p_Movie_List #videoModal{
	z-index:20000000; /*ヘッダーにzindex設定してある場合がある為*/
}

#p_Movie_List #videoModal .modal-header .btn{
	line-height: 1 !important;
	margin-bottom:-1rem;
	z-index:20000100; /*ヘッダーにzindex設定してある場合がある為*/
}