@CHARSET "UTF-8";
/********************************************************************/
/*ベース                                                            */
/********************************************************************/
/********************************/
/*基準フォントサイズ            */
/********************************/
/*基準スマホ14px 576p以上で16px*/
html,
body{
	font-size:14px;
	line-height:1.5rem !important;
	font-family:"Yu Gothic Medium",YuGothic,"ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN,Arial,"メイリオ", Meiryo, sans-serif;
	
}
/*ドロップダウン、チェックボックスは高さ揃える為に小さくする*/
.dropdown-toggle,
.form-check{
	line-height:1.5rem !important;
}
/*マテリアルアイコンデフォルト上書き*/
.material-icons{
	font-size:14px;
	line-height:1.5rem !important;
	vertical-align: middle;
}
/*iosズーム対策*/
input{
	font-size:16px;
}


@media (min-width: 576px) {
	html,
	body,
	.material-icons{
		font-size: 16px;
		line-height:2rem !important;
	}
	.dropdown-toggle{
		line-height:1.15rem !important;
	}
	.form-check{
		line-height:1.4rem !important;
	}

}

/********************************/
/*基本タグ、class関連の上書き   */
/********************************/
/*色*/
body{
	color: #222 !important;
}

a{
	color: #222 !important;
}

.active > a{
	color: #fff !important;
}


/*疑似要素*/
a:hover {
	text-decoration: none;
	opacity: 0.5;
}
.btn:focus,
.btn:not(:disabled):not(.disabled):active:focus{
	box-shadow: none;
}
.btn:hover {
	opacity: 0.5;
}
/*無効時は透過させない*/
.btn:disabled{
	opacity: 1;
}
/*ボタンは基本太文字で角丸なし*/
.btn{
	font-weight:bold;
	border-radius: 0; 
}

/*管理画面のタグで設定するリンク違う色がいい時はsite.cssで上書き*/
a.tagLink{
	color: #00f !important;		/*青*/
	text-decoration: underline;
}

/*入力時のデフォルト打ち消し*/
input[type="text"]:focus{
	outline: 0 none;
}

/*GoogleMapのチェックボックスレイアウト修正*/
.gm-style .gm-style-mtc div span img{
	transform: translateY(-0.1em) !important;
}

.gm-style .gm-style-mtc label{
	margin-bottom: 0 !important;
}

/********************************/
/*ヘッダー                      */
/********************************/
/*ヘッダー固定為の設定*/
header nav{
	background-color:#fff;	/*設定しないと透ける*/
}
header nav .navbar-nav{
	font-size:0.875rem;
	font-weight:bold;
}
/*padding-top設定(ヘッダーの高さの計算が不明の為今の所px指定)*/
body {
	padding-top: 50px; /*ヘッダーの高さ49.25*/ 
}
@media (min-width: 576px) {
	body{
		padding-top: 65px; /*ヘッダーの高さ56*/ 
	}
}

/*メニュー開く・閉じる処理*/
header .navbar{
	/*スマホ時のハンバーガーメニューの関係でpadding0にする*/
	padding-left:0;
	padding-right:0;
}

header .navbar-toggler>.close {
    display:inline;
	width: 1.25em;
	height: 1.25em;
}

header .navbar-toggler.collapsed>.close,
header .navbar-toggler:not(.collapsed)>.navbar-toggler-icon {
    display:none;
}

/*幅が狭い時メニューの色を変更 .collapsingはアニメーション中、アニメ終わると.collapse.show*/
header .collapsing #leftNavi,
header .collapse.show #leftNavi{
	background-color:#575757;

}
header .collapsing #leftNavi a,
header .collapse.show #leftNavi a{
	color:#fff !important;
	border-bottom:1px solid #fff;
	/*タグで指定すると影響が大きいのでここで指定*/
	padding:0.2rem 0.5rem;
	margin:0.2rem;
}

/*size_xs時の調整*/
body.size_xs header .navbar #spNavBar{
	margin-left:0.5rem;
	margin-right:0.5rem;
}
body.size_xs header .navbar #spNavBar .navbar-brand{
	font-size:1rem;
	margin-right:0.5rem;
}
body.size_xs header .navbar #spNavBar .dropdown-toggle,
body.size_xs header .navbar #spNavBar .navbar-toggler{
	padding:0.2rem;
}
/********************************/
/*パンクズ                      */
/********************************/
.breadcrumb{
	background-color:transparent;
	font-size:0.875rem;
	margin-bottom: 0rem;
}
.breadcrumb-item.active{
	color:#222;
}
/********************************/
/*ページャー                    */
/********************************/
/*間隔の調整*/
ul.pagination li.page-item{
	margin:0 0.5rem;
}
ul.pagination li.page-item:first-child,
ul.pagination li.page-item:last-child{
	margin:0;
}

/*先頭,最後の矢印の調整*/
ul.pagination li.page-item:first-child a,
ul.pagination li.page-item:last-child a{
	position: relative;
	/*枠・背景を消す*/
	border:none;
	border-radius:0;
	background-color:transparent;
}
ul.pagination li.page-item:first-child a i,
ul.pagination li.page-item:last-child a i{
	font-size: 1.6rem;
	position:absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

ul.pagination li.page-item a{
	box-shadow: none;
}

/*無効時の色を薄くする*/
ul.pagination li.disabled a{
	color: #999 !important;
}

/********************************/
/*カルーセル上書き              */
/********************************/
/*左右矢印コントロール*/
.carousel-control-next-icon,
.carousel-control-prev-icon{
	background-image:none;
	width:auto;
	opacity: .7;
	font-feature-settings: 'liga';	/* IE、エッジ対応 https://stackoverflow.com/questions/53355488/internet-explorer-material-icons-in-pseudo-element-not-working */
}
.carousel-control-next-icon:before{
	font-family: 'Material Icons';
	content:'navigate_next';
    font-size: 4rem !important;
    color: #3c3c3c;
}
.carousel-control-prev-icon:before{
	font-family: 'Material Icons';
	content:'navigate_before';
    font-size: 4rem !important;
    color: #3c3c3c;
}

/*左右矢印コントロール(スマホ)*/
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;
}

/**************/
/*マルチカラム*/
/**************/
/*デフォルトのスタイルの関係でPCで縛る*/

/*共通*/
body.size_md .carouselMulti3 .carousel-item .itemCol,
body.size_lg .carouselMulti3 .carousel-item .itemCol,
body.size_xl .carouselMulti3 .carousel-item .itemCol,
body.size_md .carouselMulti4 .carousel-item .itemCol,
body.size_lg .carouselMulti4 .carousel-item .itemCol,
body.size_xl .carouselMulti4 .carousel-item .itemCol{
	float: left;
}

/*3カラム*/
body.size_md .carouselMulti3 .carousel-inner .carousel-item-right.active,
body.size_md .carouselMulti3 .carousel-inner .carousel-item-next,
body.size_lg .carouselMulti3 .carousel-inner .carousel-item-right.active,
body.size_lg .carouselMulti3 .carousel-inner .carousel-item-next,
body.size_xl .carouselMulti3 .carousel-inner .carousel-item-right.active,
body.size_xl .carouselMulti3 .carousel-inner .carousel-item-next{
  transform: translateX(33.33%);
}

body.size_md .carouselMulti3 .carousel-inner .carousel-item-left.active, 
body.size_md .carouselMulti3 .carousel-inner .carousel-item-prev,
body.size_lg .carouselMulti3 .carousel-inner .carousel-item-left.active, 
body.size_lg .carouselMulti3 .carousel-inner .carousel-item-prev,
body.size_xl .carouselMulti3 .carousel-inner .carousel-item-left.active, 
body.size_xl .carouselMulti3 .carousel-inner .carousel-item-prev{
  transform: translateX(-33.33%)
}

body.size_md .carouselMulti3 .carousel-inner .carousel-item-right,
body.size_md .carouselMulti3 .carousel-inner .carousel-item-left,
body.size_lg .carouselMulti3 .carousel-inner .carousel-item-right,
body.size_lg .carouselMulti3 .carousel-inner .carousel-item-left,
body.size_xl .carouselMulti3 .carousel-inner .carousel-item-right,
body.size_xl .carouselMulti3 .carousel-inner .carousel-item-left{ 
  transform: translateX(0);
}

/*4カラム*/
body.size_md .carouselMulti4 .carousel-inner .carousel-item-right.active,
body.size_md .carouselMulti4 .carousel-inner .carousel-item-next,
body.size_lg .carouselMulti4 .carousel-inner .carousel-item-right.active,
body.size_lg .carouselMulti4 .carousel-inner .carousel-item-next,
body.size_xl .carouselMulti4 .carousel-inner .carousel-item-right.active,
body.size_xl .carouselMulti4 .carousel-inner .carousel-item-next{
  transform: translateX(25%);
}

body.size_md .carouselMulti4 .carousel-inner .carousel-item-left.active, 
body.size_md .carouselMulti4 .carousel-inner .carousel-item-prev,
body.size_lg .carouselMulti4 .carousel-inner .carousel-item-left.active, 
body.size_lg .carouselMulti4 .carousel-inner .carousel-item-prev,
body.size_xl .carouselMulti4 .carousel-inner .carousel-item-left.active, 
body.size_xl .carouselMulti4 .carousel-inner .carousel-item-prev{
  transform: translateX(-25%)
}

body.size_md .carouselMulti4 .carousel-inner .carousel-item-right,
body.size_md .carouselMulti4 .carousel-inner .carousel-item-left,
body.size_lg .carouselMulti4 .carousel-inner .carousel-item-right,
body.size_lg .carouselMulti4 .carousel-inner .carousel-item-left,
body.size_xl .carouselMulti4 .carousel-inner .carousel-item-right,
body.size_xl .carouselMulti4 .carousel-inner .carousel-item-left{ 
  transform: translateX(0);
}

/********************************/
/*フッター                      */
/********************************/
/*bootstrap sticky footer*/
html {
  position: relative;
  min-height: 100%;
}
body {
  margin-bottom: 3rem;	/* margin-bottom、height、line-heightを合わせる*/
}
footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 3rem;
  line-height: 3rem;
  background-color: #f5f5f5;
  font-size: 0.9rem;
}

/********************************/
/*その他部品                    */
/********************************/
/*バッジ*/
.comBadge{
	color:#fff;
	padding:.35em .4em;
    font-size: 70%;
    font-weight:normal;
    border-radius:0;
}
.comBadge.NEW{
	background:#FF0000;	/*赤*/
}
.comBadge.END{
	background:#595757;	/*グレー*/
}

/*三角*/
.triangleMark{
	position:absolute;
	top: 0;
	left:0;
	
	color: #FFF;
    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 #FF0000;	/*赤*/
}
/*END*/
.triangleMark.END{
	border-color: transparent transparent transparent #595757;	/*グレー*/
}

.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;	/*斜めにすると、見にくいのでフォントを変える*/
}


/*プリントボタンアイコン*/
a.printBtn i{
	font-size:1.5rem;
}

/*ページTOP位置*/
#gotoPageTop {
	display:none;
	position: fixed;
	right: 1.5rem;
	bottom: 1.5rem;
	width: 4rem;
	height: 4rem;
	z-index:2500;
}

/*共通SVG、サイトSVG非表示*/
#comSvg,
#siteSvg{
	display:none;
}

/*ページTOPのSVG設定 デフォルトグレーでsite.cssで上書き*/
/*丸のベース（白の透過設定）*/
#gotoPageTop svg{
	height:64px; 
	width:64px;
}
#gotoPageTop #svgGotoPageCircleBase{
	fill: #fff;
	opacity: 0.7;
}
#gotoPageTop #svgGotoPageCircleLine{
	fill: none;
	stroke: #888888;
	stroke-width: 1.5px;
}
#gotoPageTop #svgGotoPageCircleLineOuter{
	stroke: none;
}
#gotoPageTop #svgGotoPageCircleLineInner{
	fill: none;
}
/*上矢印*/
#gotoPageTop #svgGotoPageArrow{
	fill: none;
	stroke: #888888;
	stroke-width: 1.5px;
	stroke-miterlimit: 10;   

}
/*TOPのフォント設定*/
#gotoPageTop #svgGotoPageTopText{
	fill: #888888;
	font-size: 18px;
	font-family:arial, sans-serif;

}

/*モーダル開いたときにBSでpadding-right: 17px;が追加される対応*/
.modal-open {
    padding-right: 0px !important;
}
.modal {
    padding-right: 0px !important;
}

/********************************************************************/
/*各ページ                                                          */
/********************************************************************/
/********************************/
/*トップページ*/
/********************************/
/*ロードマスク（今の所TOPのみ。全体にする場合はbase.cssに移植）*/
#p_Top #loadingMask{
	position: fixed;
	top:0;
	left:0;
	height:100%;
	width:100%;
	background-color: #fff;
	z-index: 110000000;
}



/********************************/
/*course,event,point,download共通*/
/********************************/
/*-------------------
カード関連
--------------------*/
/*IEでのバグ　画像の高さが高くなり崩れる現象の対策*/
.card-img-top{
	max-width: 100%;
	flex-shrink: 0;
}

/*画像の高さを揃える*/
.card.comLayout .card-img-top{
	width: 100%;
	height: 12rem;
	object-fit: cover;
	font-family: '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がブートストラップのデフォルト*/
	font-size:0.875rem;
}
.card.comLayout .card-text p{
	margin-bottom: 0.2rem;
	line-height:1.15rem;
}
/*カードのリンクblock（カード全体をリンクで囲うと高さが揃わなくなる）*/
.card.comLayout a{
	display:block;
	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;
}

/*コースの情報は色薄くする*/
.card.comLayout .card-body .card-text .courseInfo{
	color:#838383;
}


/*イベントで市町村を表示する場合(色はsaite.cssで指定 文字を透過させないために background: rgba設定)*/
.card.comLayout .city{
	position:absolute;
	bottom:0;
	color: #fff;
	font-weight:bold;
	/*３点リード*/
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/*-------------------
検索関連
--------------------*/
/*サイドバー*/
#sidebar-container .sticky-top{
	top: 100px;	/*スクロール時固定する高さ*/
}
/*検索条件*/
#sidebar-container #searchConditions{
	font-size:0.875rem;
}

#sidebar-container #searchConditions{
	line-height:1.5rem !important;
}

#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 input#keyword[type='text'] {
	border-radius: 1rem;
	border:2px solid #707070;	/*グレー*/
	height:2.2rem;	/*IEで必要*/
}

/*スマホ時のキーワード*/
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 #keywordArea i.material-icons{
	position:absolute;
	right:1rem;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	font-size: 1.4rem;
	line-height: 1rem !important;
}

/*カテゴリ*/
#sidebar-container #refineFrm #searchCategory{
	overflow-y:auto;
	overflow-x:hidden;
	
}
/*カテゴリのマーカー画像*/
#sidebar-container #refineFrm #searchCategory img.searchMaker{
	width: 1.5rem;
	height:1.5rem;
}


/*カテゴリがsize_mdの時、幅が狭いので 調整*/
/*	word-break : break-all;を設定すると全ての折り返しが対象になる為、後で個別指定*/
body.size_md  #searchCategory li{
	padding: 0.75rem 0.25rem;
}
/*ページ単位で折り返しを個別設定*/
#p_Point_List.en.size_md  #searchCategory li label#lblCategory16,			/*16:Garden/Park*/
#p_Point_List.en.size_md  #searchCategory li label#lblCategory23			/*23:Culture/History*/
{
	word-break : break-all;
}

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;
	background-color: #F5F5F5;
}

/*チェックボックス（デフォルトの設定を初期化）*/
#sidebar-container #refineFrm .form-check-input{
	position: static;	/*元はabsolute*/
	margin-left:0;	/*元は-1.25rem;*/
}

/*スマホ検索時に非表示*/
/*ヘッダー画像*/
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{
	background-color: #fff; /*ボタンが透過するので設定*/
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	z-index:1000;
	background:#F7F7F7;		/*グレー*/
}
/*ボタンの幅*/
body.size_xs.isRefine #searchBtnGroup #searchBtn,
body.size_sm.isRefine #searchBtnGroup #searchBtn,
body.size_xs.isRefine #searchBtnGroup #closeBtn,
body.size_sm.isRefine #searchBtnGroup #closeBtn{
	width: 50% !important;
}
/*スマホ時のボタンの高さ*/
body.size_xs.isRefine #searchBtnGroup #searchBtn,
body.size_sm.isRefine #searchBtnGroup #searchBtn,
body.size_xs.isRefine #searchBtnGroup #closeBtn,
body.size_sm.isRefine #searchBtnGroup #closeBtn,
#p_Point_Map.size_xs .btn.linkBtnShowList,
#p_Point_Map.size_sm .btn.linkBtnShowList,
#p_Point_List.size_xs .btn.linkBtnShowMap,
#p_Point_List.size_sm .btn.linkBtnShowMap,
body.size_xs #showRefineBtn,
body.size_sm #showRefineBtn{
	padding: .75rem .75rem;
}

/*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;
}




/*-------------------
詳細MAP関連
--------------------*/
/*共通MAP設定*/
#mapDiv.comMap{
	width: 100%;
	height:30rem;
}

/*-------------------
詳細ポイントリスト関連
--------------------*/
#pointList .row{
	position:relative;
	border-width: 2px !important;
}
/*ポイントの説明文*/
#pointList .row .pointListInfo{
	font-size:0.875rem;
}

/*ポイントの住所等バージョン*/
#pointList .row .pointListInfo div{
	word-break : break-all;
}


/*ポイントリスト画像*/
#pointList .row .leftCol img{
	width: 100%;
	height: 10rem;
	object-fit: cover;
	font-family: 'object-fit: cover;';
}
/*IEの背景印刷対応*/
#pointList .row .leftCol img.iePrintImg{
	display:none;
}

/*矢印*/
#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;
}

/*コースの区間情報*/
#pointList .row .courseSpan{
	 position:absolute;
	 bottom:-0.6rem;
	 left:0;	/*IEで必要*/
}
/*コースの区間アイコン*/
#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;
}

/*-------------------
その他
--------------------*/
/*背景*/
body#p_Point_List,
body#p_Course_List,
body#p_Event_List,
body#p_Download_List,
body#p_Download_Card ,
#p_Point_Map.size_xs.isRefine,
#p_Point_Map.size_sm.isRefine{
	background:#F7F7F7;		/*グレー*/
}

/*カテゴリの色*/
.category{
	color:#4F81D9;			/*藍色*/
}

/********************************/
/*ダウンロードlist              */
/********************************/
#p_Download_List .row .leftCol{
	display:block;
}
/*ダウンロードは画像を全部表示する*/
#p_Download_List .row .leftCol img{
	width: 100%;
	height: 12rem;
	object-fit: contain;
	object-position: top;
	font-family: 'object-fit: contain; object-position: top;';
	background-color:#fff;
}

#p_Download_List a.btn{
	display:inline;	/*inline-blockだと縦が広い*/
}

/*スマホの時だけ縦の幅を指定する*/
#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;	
	font-family: 'object-fit: contain;';
	background-color:#fff;
	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                  */
/********************************/
#p_Event_List .card.comLayout .card-title{
	margin-bottom: 3rem;
}

/********************************/
/*ポイントlist                  */
/********************************/
#p_Point_List .card.comLayout .card-title{
	margin-bottom: 2rem;
}

/********************************/
/*ポイント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;
}

/*0件のメッセージ*/
#p_Point_Map #resultNone{
	font-size:0.875rem;
}

/*-------------------
Map用の右ナビ
--------------------*/
/*右ナビワイヤー*/
#p_Point_Map #mapNavi{
	background-color: #F5F5F5;
	/*位置調整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;
}

/*タブ位置調整*/
#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:8em;
	margin-top:0.5em;
	padding:0.5em;	/*IE対応*/
	padding-top:0.5em;
	border:none;
}

#p_Point_Map #mapNavi .nav-tabs li a{
	position:relative;
	display: block;
	height: 100%;
	line-height:1.2rem !important;	/*IEが元の設定効くので上書き*/
}
/*タブアクティブ*/
#p_Point_Map #mapNavi .nav-tabs li.active{
	background-color:#F5F5F5;
	border-style: solid;
	border-width:2px 0 2px 2px;
	margin-right: -2px;
}
/*タブアイコンの位置調整*/
#p_Point_Map #mapNavi .nav-tabs li i{
	position: absolute;
	bottom: -0.5rem;	/*英語で被るのでマイナスにした*/
	/*horizontal-tbにしたら必要になった*/
	right:0;
	left:0;
	text-align:center;
	writing-mode: horizontal-tb; /*IE、エッジでアイコンも向きが変わるので戻す*/
}
/*IEが上記だけではダメなのでIEのみ適応*/
@media all and (-ms-high-contrast: none){
	#p_Point_Map #mapNavi .nav-tabs li i{
		writing-mode: lr-tb;
	}
}

/*デフォルトは検索条件選択*/
#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;
}

/*-------------------
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:#fff; 
	color: #222 !important;
	line-height: 1.15;
}
/*画像*/
#p_Point_Map #mapNavi #sidebar-container #preView .preViewCol img{
	height:10rem;
	width: 100%;
	object-fit: cover;
	font-family: 'object-fit: cover;'
}

/*ポイント詳細*/
#p_Point_Map #mapNavi #sidebar-container #preView .preViewCol .detail{
	font-size:0.875rem;
	word-break : break-all;
}
/*詳細リンク*/
#p_Point_Map #mapNavi #sidebar-container #preView .preViewCol .detailLink{
	font-size:0.875rem;
}

/*スマホ プレビューリスト*/
#p_Point_Map.size_xs.showMapList #mapNavi #preView,
#p_Point_Map.size_sm.showMapList #mapNavi #preView {
	display: block;
	position:fixed;
	bottom:0;
	left:0;
	right:0;
	z-index:2000;
	background-color:#F5F5F5;
	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:12.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 h2{
	font-size:1.5rem;
}
#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 h2{
	font-size:1.5rem;
}
#p_Point_Detail #carouselCaption .img_title{
	font-size:0.875rem;
}
#p_Point_Detail #carouselCaption .img_detail{
	font-size:0.875rem;
}
#p_Point_Detail #detailArea{
	font-size:0.875rem;
}
#p_Point_Detail #pointInfo{
	background-color:#F3F1F3 !important;/*!importantすることで印刷時背景色がつきます*/
	font-size:0.875rem;
}

#p_Point_Detail #pointInfo dl{
	border-bottom:1px dotted #ccc;
}

/*イベントのカード*/
#p_Point_Detail .card.comLayout{
	margin-left:0.5em;
	margin-right:0.5em;
}
#p_Point_Detail.size_xs .card.comLayout,
#p_Point_Detail.size_sm .card.comLayout{
	margin-left:0;
	margin-right:0;
}

/********************************/
/*コースdetail                */
/********************************/
#p_Course_Detail h2{
	font-size:1.5rem;
}

/********************************/
/*お知らせdetail                */
/********************************/
#p_Announce_Detail h2{
	font-size:1.5rem;
}




/*-------------------
カルーセルスライダー
--------------------*/
/*高さ指定は共通の所に記載*/

/*ドットインジケーター*/
#p_Point_Detail #dot.carousel-indicators li {
	width: 11px;
	height: 11px;
	display: inline-block;
	flex: none;
	border-radius: 100%;
	border: 0px solid #F5F4F4;
	background-color:#F5F4F4;
}
#p_Point_Detail #dot.carousel-indicators li.active{
	width: 7px;
	height: 7px;
	background-color:#2A93BC;	/*藍色*/
	border: 2px solid #f5f5f5;
}
#p_Point_Detail.size_xs #dot.carousel-indicators li {
	width: 9px;
	height: 9px;
	background-color:#ccc;
}
#p_Point_Detail.size_xs #dot.carousel-indicators li.active{
	width: 7px;
	height: 7px;
	background-color:#2A93BC;	/*藍色*/
	border: 1px solid #fff;	
}


/*サムネイルインジケーター*/
#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%);
}

/********************************/
/*TOPとapp共通                  */
/********************************/
/*メイン画像*/
#appMainImage{
	background:url(./../../img/app/bg_intro.jpg)center center no-repeat;
	background-size:cover;
	margin-bottom:0;
	padding-bottom:0;
	/*padding-top:5rem!important;*/
}

/*アプリロゴのキャプション*/
#appMainImage #appSlogan{
	font-size:2rem;
}
body.size_sm #appMainImage #appSlogan{
	font-size:1.5rem;
	letter-spacing:normal;
}
body.size_xs #appMainImage #appSlogan{
	font-size:1.125rem;
	letter-spacing:normal;
}

/*PC版：上部ストアバナーとQR*/
#appMainImage .banner_app{
	width:37.5%;
}
#appMainImage .banner_googleplay{
	width:41.5%;
}
#appMainImage .icon_qr{
	width:21%;
}

/*SP版：上部ストアバナーとQR*/
#storeLink .spbanner_app{
	width: 44%;/*43.57%*/
}
#storeLink .spbanner_googleplay{
	width:49.5%;
}

/********************************/
/*p_App(アプリ紹介)             */
/********************************/
/*パンクズ非表示*/
#p_App #breadcrumb{
	display:none;
}
#p_App #contents{
	padding:0 !important;	/*全画面表示用に共通のpadding打ち消し*/
}

/*-------------------
サブナビ
--------------------*/
#p_App #appSubNavi{
	background:#575757;
	border-top:1px solid #707070;
}
#p_App #appSubNavi a{
	color:#fff !important;
}

/*-------------------
各説明共通
--------------------*/
/*
#p_App section{
	padding:2rem 1rem;
}*/

#p_App section h2{
	font-family: "Century",Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
	font-size:2.3rem;
}
#p_App section h2 span{
	display: inline-block;
	margin-bottom:0.6rem;	/*spanと両方指定しないとboxがおかしくなる*/
	position:relative;
	line-height:2.7rem;
}
#p_App #About h2 span:before,
#p_App #Cource h2 span:before,
#p_App #Navi h2 span:before,
#p_App #Fun h2 span:before{
	content: '';
	position: absolute;
	left: 50%;
	bottom: -0.5rem;
	display: inline-block;
	width: 7.5rem;
	height: 0.1875rem;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	background-color: black;
	border-radius: 0.125rem;
}
#p_App section h3{
	font-size:1rem;
	margin-bottom:0;
}
#p_App section h4{
	font-size:1.125rem;
	font-weight:bold;
	padding-bottom:0.5rem;
	line-height: 1.6;
}
/*リストの数字*/
#p_App section ol{
	/*デフォルト打ち消し*/
	padding: 0;
	margin:0;
	/*番号書き換え準備*/
	counter-reset: li; /* カウンタをセットする(値もリセット) */
	list-style: none;	/*非表示にして疑似要素で表示*/
	/*折り返しの調整*/
	padding-left: 1.125rem;
	text-indent: -1.125rem;
}
#p_App.size_xs section ol{/*スマホ時のインデント*/
	/*折り返しの調整*/
	padding-left: 1.25rem;
	text-indent: -1.25rem;
}

#p_App section ol li:before {
	counter-increment: li; /* li カウンタの値に1加える */
	content: counter(li)". "; /* before擬似要素のcontentで出力（ドット付き） */
}

/*-------------------
個別設定
--------------------*/
#p_App #About .txt{
	line-height:2.5rem;
}
#p_App.size_sm #About .txt{
	line-height:2rem;
}
#p_App section#Cource{
	background:#fff8f8;	/*薄いピンク*/
}
#p_App section#Cource ol li:before {
	color: #FC7E7E;	/*ピンク*/
	font-size:1.125rem;
	font-weight:bold;
}
#p_App section#Navi{
	background:#eef6f1;	/*薄いグリーン*/
}
#p_App section#Navi ol li:before {
	color: #62AF84;	/*グリーン*/
	font-size:1.125rem;
	font-weight:bold;
}
#p_App section#Fun .border-bottom{
	border-bottom:1px solid #707070 !important;
}
#p_App section#appLink{
	background:#d1eef7;	/*水色*/
}
#p_App section#appLink .txt{
	font-size:1.125rem;
}

/*-------------------
下部ストアバナーとQR領域
--------------------*/
#p_App #contents #appLink .banner_app{
	width:38%;
}
#p_App #contents #appLink .banner_googleplay{
	width:42.3%;
}
#p_App #contents #appLink .icon_qr{
	width:12.5%;
}

/*-------------------
右から出てくるドロワーメニュー
--------------------*/
.drawer button:focus {
    outline: 1px dotted;
    outline: none;
}
.drawer .drawer-nav{
	width:18rem;
}
.drawer .drawer-nav li a{
	margin:0 0 0 1rem;
	padding:1rem 1rem 1rem 0;
	width: 95%;
	height: 100%;
	border-bottom: 1px solid #e6d9c0;
	display: inline-block;
}
.drawer--right.drawer-open .drawer-hamburger{
	right:18rem;
}
.drawer-hamburger{
	z-index:1000000;
}
.drawer--right .drawer-nav {
    right: -18rem;
}


/*-------------------
印刷用css
--------------------*/
@media print{
	body {
		padding-top: 2rem;
		-webkit-print-color-adjust: exact;
	}
	#contents{
		width:100% !important;
		padding-top:5rem;
	}
	h3{
		font-size:2rem !important;
	}
	#carouselSlide{
		height:22rem !important;
	}
	header,/*ヘッダー 非表示*/
	#headerImg,/*ページイメージ 非表示*/
	#breadcrumb,/*ぱんくず 非表示*/
	.comBadge,/*NEWマーク 非表示*/
	footer,/*フッター 非表示*/
	.printBtn,/*印刷ボタン 非表示*/
	#dot,/*サムネイル一覧は非表示*/
	#carouselThumb{/*サムネイル一覧は非表示*/
		display:none !important;
	}
	#p_Point_Detail #detailArea{/*説明文の上を詰める*/
		margin-top:1rem !important;
	}
	#mapDiv{
		z-index:10000000;
	}
	
	#mapDiv div > img {
		position: absolute;	/*MAPの表示がおかしくなる対策*/
	}
	
  }

/*IEの背景が表示されない対策（印刷用の画像を切り替える）*/
@media print and (-ms-high-contrast: none){
	/*コース、イベントのポイントリスト*/
	#pointList .row .leftCol img.object_fit_img{
		display:none;
	}
	#pointList .row .leftCol img.iePrintImg{
		display:block;
	}
}

/********************************/
/*動画                          */
/********************************/
#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;
}

#p_Movie_List #videoModal{
	z-index:20000000; /*ヘッダーにzindex設定してある場合がある為*/
}

/********************************/
/*特殊タグ(管理画面入力)        */
/********************************/
/*背景タグ*/
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 #000;
}



