@charset "UTF-8";






/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
ページレイアウト
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

/*フレーム*/
#wrapper { min-width: 1000px; position: relative; margin: 0 auto; text-align: left; }
#container { width: 100%; overflow-x: hidden; margin-top: 165px; background-color: #F4F4F4; }
.adminView #container { margin-top: 0; }

/*コンテンツエリア*/
#contentsArea { width: 100%; max-width: 1180px; margin: 0 auto; padding: 40px 0; display: flex; justify-content: space-between; box-sizing: border-box; }
@media all and (max-width: 1280px) {
	#contentsArea { max-width: none; padding-left: 50px; padding-right: 50px; box-sizing: border-box; }
}
@media (max-width: 1100px) {
	#contentsArea { padding-left: 20px; padding-right: 20px; }
}

/*メインエリア*/
#mainArea { order: 2; flex: 1; margin-left: 40px; }

/*サイドバーエリア*/
#sidebarArea { order: 1; flex-grow: 0; flex-shrink: 0; flex-basis: 280px; }
.sideNav { background-color: #FFF; }
.sideNav ul { list-style: none; }
.sideNav ul li { border-bottom: 1px solid #DDD; }
.sideNav ul li:nth-last-of-type(1) { border-bottom: none; }
.sideNav ul li a { display: block; padding: 25px 25px; text-decoration: none; line-height: 1; }
.sideNav ul li a span { padding: 5px 0 5px 38px; background-repeat: no-repeat; font-size: 17px; font-weight: normal; transition: color ease 0.3s; }
.sideNav ul li.nav1 a span { background-image: url("../common-img/sidenav_ico1.png"); background-position: left 3px center; }
.sideNav ul li.nav2 a span { background-image: url("../common-img/sidenav_ico2.png"); background-position: left center; }
.sideNav ul li.nav3 a span { background-image: url("../common-img/sidenav_ico3.png"); background-position: left center; }
.sideNav ul li.nav4 a span { background-image: url("../common-img/sidenav_ico4.png"); background-position: left center; }
.sideNav ul li.nav5 a span { background-image: url("../common-img/sidenav_ico5.png"); background-position: left center; }
.sideNav ul li.nav6 a span { background-image: url("../common-img/sidenav_ico6.png"); background-position: left center; }
.sideNav ul li a:hover span { color: #2A8D67; }






/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
ヘッダーエリア
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

#headerAreaOuter { width: 100%; position: fixed; top: 0; z-index: 93; background-color: #FFF; }
.adminView #headerAreaOuter { position: static; margin-top: -60px;}
#headerAreaOuter:after { content: ""; position: absolute; bottom: -20px; display: block; width: 100%; height: 20px; background: linear-gradient(to bottom, rgba(0, 0, 0, .1) 0%,rgba(0, 0, 0, 0) 100%); }
#headerArea { position: relative; height: 165px; padding-top: 55px; padding-left: 50px; padding-right: 50px; box-sizing: border-box; display: flex; justify-content: space-between; align-items: center; }
#headerAreaInner { width: 100%; line-height: 1 !important; }
input#menuActive { display: none; }
#naviOuter { height: 141px; }
@media all and (max-width: 1100px) {
	#headerArea { padding-left: 20px; padding-right: 20px; }
}

/*ロゴ*/
#logoOuter { width: 358px; height: 34px; z-index: 2; }
#headerArea h1 { position: relative; margin: 0; width: 358px; height: 34px; }
#headerArea h1 a { width: 358px; height: 34px; display: block; overflow: hidden; background-position: 0 0; background-repeat: no-repeat; text-indent: -9999px; }
@media all and (max-width: 1180px) {
	#logoOuter { width: 204px; height: 55px; bottom: 30px; }
	#headerArea h1 { width: 204px; height: 55px; }
	#headerArea h1 a { width: 204px; height: 55px; background-image: url("../common-img/logo2.png"); }
}

/*SP用メニュー名 */
#menuSPbox { display: none; }

/*メニューボタン*/
.menuBtn { display: none; }

/*メニュー閉じるボタン*/
.menuBtnClose { display: none; }

/*オプション*/
.headerOption { position: fixed; top: 0; left: 0; width: 100%; padding-left: 50px; padding-right: 50px; display: flex !important; align-items: center; justify-content: space-between; box-sizing: border-box; background-color: #F4F4F4; border-bottom: 5px solid #2A8D67; }
.adminView .headerOption { position: absolute; display:none !important;}
.headerOptionInner { width: 100%; height: 50px; display: flex; align-items: center; justify-content: space-between; }
@media all and (max-width: 1100px) {
  .headerOption { padding-left: 20px; padding-right: 20px; }
}

/*小田原市ロゴ*/
.headerLogo { height: 26px; flex-grow: 1; flex-shrink: 1; flex-basis: auto;}
.headerLogo a { display: block; width: 137px; height: 26px; background: url("../common-img/city_logo.png") no-repeat 0 0; background-size: contain; text-indent: -9999px; }

/*サイト内検索*/
#headerSiteSearch { line-height: 1; margin-right: 20px; }
#headerSiteSearch label { cursor: default; }
#headerSiteSearch label > span { display: inline-block; margin-right: 5px; }
input.siteSearchText { -webkit-appearance: none; border-radius: 0; margin-top: -3px; margin-right: 5px; padding: 0 5px; min-width: 100px; height: 30px; font-size: 14px; cursor: text; color: #666; border: 1px solid #D9D9D9; vertical-align: middle; box-sizing: border-box; }
input.siteSearchBtn { -webkit-appearance: none; margin-top: -1px; border-radius: 3px; border: none; text-align: center; width: 100px; height: 30px; font-size: 14px; cursor: pointer; font-weight: bold; box-sizing: border-box; background-color: #3C8D67; color: #FFF; transition: opacity 0.2s; }
input.siteSearchBtn:hover,
input.siteSearchBtn:focus { opacity: 0.6; }
.extSiteSearch #searchSubmit { -webkit-appearance: none; border-radius: 0; }
.extSiteSearch table th input { -webkit-appearance: none; border-radius: 0; }

/*Language*/
#subLang { float: left; width: auto; height: 30px; }
#chgLang { position: relative; margin-right: 10px; }
#chgLang span { cursor: default; display: flex; align-items: center; justify-content: center; width: 115px; height: 30px; background-color: #FFF; color: #3C8D67 !important; border: 1px solid #3C8D67; text-decoration: none !important; border-radius: 3px; box-sizing: border-box; line-height: 1; }
#chgLang ul { display: none; position: absolute; background: #FFF; z-index: 2; border: 1px solid #E3E3E3; }
#chgLang ul li { list-style: none; margin: 0; padding: 0; }
#chgLang ul li a { text-decoration: none; padding: 8px 10px; text-align: left; display: block; color: #000 !important; font-weight: normal; white-space: nowrap; transition: all 0.2s; }
#chgLang ul li a:hover { background-color: #3C8D67; color: #FFF !important; }

/*かな*/
.ruby { margin-right: 10px; }
.btnRuby {  display: flex; align-items: center; justify-content: center; width: 75px; height: 30px; background-color: #3C8D67; color: #FFF !important; text-decoration: none !important; border-radius: 3px; line-height: 1; transition: opacity 0.2s; }
.btnRuby:hover { opacity: 0.6; }

/*読上げ*/
p[id^="readspeaker_button"] a { margin-right: 20px; display: flex; align-items: center; justify-content: center; width: 75px; height: 30px; background-color: #3C8D67; color: #FFF !important; text-decoration: none !important; border-radius: 3px; line-height: 1; transition: opacity 0.2s; }
p[id^="readspeaker_button"] a:hover { opacity: 0.6; }

/*文字サイズ*/
dl#tsBox { flex-grow: 0; flex-shrink: 0; flex-basis: auto; display: inline-flex; align-items: center; line-height: 1; }
dl#tsBox dt { color: #000; font-weight: normal; margin-right: 8px; white-space: nowrap; font-size: 1em; }
dl#tsBox dd { width: 28px; height: 28px; display: block; margin-right: 5px; }
dl#tsBox dd:nth-last-of-type(1) { margin-right: 0; }
dl#tsBox dd#tsBtnSp { width: 28px; }
dl#tsBox dd a { display: flex; align-items: center; justify-content: center; padding-top: 2px; width: 28px; height: 28px; border-radius: 28px; background: #3C8D67; color: #FFF; border-color: #3C8D67; font-weight: bold; text-decoration: none; box-sizing: border-box; font-size: .8em; line-height: 1; transition: all 0.2s; }
dl#tsBox dd a:hover,
dl#tsBox dd a.active { border: 1px solid #3C8D67; color: #3C8D67; background-color: #FFF; }






/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
グローバルナビゲーションエリア
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

#naviOuter { position: relative; }
#globalNaviAreaSection { position: relative; }
#globalNaviAreaOuter { box-sizing: border-box; }
#globalNaviAreaOuter.swiper-container { z-index: auto !important; }
#globalNaviArea { width: 100%; max-width: 100%; box-sizing: border-box; }
#globalNaviArea ul { list-style: none; display: flex; align-items: center; justify-content: space-between; padding-top: 3px; position: relative; z-index: 2; }
#globalNaviArea > ul {}
#globalNaviArea ul li { flex: 1 1 auto; line-height: 1; position: relative; }
#globalNaviArea ul li:nth-last-of-type(1) { border-right: none; }
#globalNaviArea ul li a { display: flex; align-items: center; justify-content: center; padding: 0 15px; text-decoration: none !important; font-size: 16px; font-weight: bold; letter-spacing: 0.05em; line-height: 1; transition: all 0.3s; background-color: #FFF; color: #333; }
#globalNaviArea ul li a span { display: block; width: 100%; padding: 7px 0 7px 0; text-align: center; line-height: 1; transition: all ease 0.3s; border-bottom: 3px solid transparent; }
#globalNaviArea ul li:nth-last-of-type(1) a { padding-right: 0; }
#globalNaviArea ul li a:hover span { color: #3C8D67; border-bottom: 3px solid #3C8D67; }
@media all and (max-width: 1300px) {
	#globalNaviArea { padding-left: 0; }
}
@media all and (max-width: 1100px) {
	#globalNaviAreaOuter { padding-right: 20px; }
	#globalNaviArea ul li a { font-size: 16px; }
}

/*ローカル*/
#globalNaviArea ul li ul.lnavi { display: block; position: absolute; left: 15px; visibility: hidden; opacity: 0; transition: 0.5s; background: #FFF; box-shadow: 0 0 6px 3px rgba(0,0,0,0.08); }
#globalNaviArea ul li ul.lnavi li a { padding: 10px 40px; line-height: 1.2em; height: auto; background-color: #FFF !important; color: #333 !important; font-weight: normal; font-size: 1em; }
#globalNaviArea ul li:hover > ul.lnavi { visibility: visible; opacity: 1; }
#globalNaviArea ul li ul.lnavi li a:hover { background-color: #3C8D67 !important; color: #FFF !important; }
#globalNaviArea ul li ul.lnavi li a { justify-content: flex-start; padding: 15px 20px; white-space: nowrap; }






/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
カバーエリア
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

#coverAreaOuter { z-index: 0; margin: 0 auto; width: 100% ; min-width: 980px; position: relative; }
#coverAreaOuter:after { content: ""; position: absolute; bottom: 0; display: block; width: 100%; height: 140px; background: linear-gradient(to top, rgba(0, 0, 0, .5) 0%,rgba(0, 0, 0, 0) 100%); }
#coverArea { width: 100%; }
#coverArea.clearfix:after { content: none !important; }
#coverAreaImage { overflow: hidden; }
#coverWrap { position: relative; text-align: center; height: 375px; width: 100%; overflow: visible !important; }
#coverWrap li { left: 0; background-position: center center; background-repeat: no-repeat; overflow: hidden; background-size: cover; }
#coverWrap li a { display: block; margin: 0 auto; height: 375px; width: 100%; max-width: 1200px; overflow: hidden; }
#coverWrap img { width: 100%; }
#coverWrap > p { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 51; font-size: 45px; color: #FFF; font-weight: bold; font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif; white-space: nowrap; font-feature-settings: "palt"; }
#coverWrap #itemzoom { height: 375px; }
li.bjqs-slide { width: 100%; }
ul.bjqs { overflow: visible !important; list-style: none; }
ul.bjqs li { width: 100%; height: 375px !important; position: absolute; }
#coverWrap .bx-controls { width: 980px; z-index: 1000; margin: -480px auto 0; position: relative; height: 11px; }
#coverWrap .bx-controls .bx-controls-auto { height: 11px; right: 0; width: 35px; }
#coverWrap .bx-viewport { overflow: inherit !important; }






/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
パンくずリスト
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

#breadcrumbsList { padding: 20px 50px; text-align: left; background-color: #FFF; }
#breadcrumbsList ul { width: 100%; max-width: 1180px; margin: 0 auto; }
#breadcrumbsList li { margin: 0 4px 0 0; padding: 0; display: inline; line-height: 1; font-size: 0.9em; }
#breadcrumbsList li a { margin: 0; padding: 0 13px 0 0; line-height: 1; }

/* SP用パンくずリスト（フッター) */
#breadcrumbsListF { display:none; padding: 0 0 20px 0; width: 100%; text-align: left; }
#breadcrumbsListF ul { margin: 0; padding: 0; }
#breadcrumbsListF li { margin: 0 4px 0 0; padding: 0; display: inline; }
#breadcrumbsListF li a { margin: 0; padding: 0 13px 0 0; }






/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
フッターエリア
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

#footerArea { padding: 0 0 20px 0; width: 100%; background-color: #F4F4F4; }
#footerArea .inner {}

/*ページトップボタン*/
#pPageTop { position: fixed; right: 30px; bottom: 30px; width: 58px; height: 58px; z-index: 2; }
#pPageTop a { position: relative; width: 58px; height: 58px; display: block; }
#pPageTop a span { position: absolute; width: 58px; height: 58px; transition: opacity 0.3s; cursor: pointer; z-index: 2; background-color: #3C8D67; text-indent: -9999px; }
#pPageTop a span:before { content: ""; position: absolute; right: 21px; top: 24px; width: 15px; height: 15px; border-right: solid 2px #FFF; border-top: solid 2px #FFF; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
#pPageTop a span:hover { opacity: 0.7; }

/*フッターナビゲーションエリア*/
#footerNaviArea { margin-bottom: 20px; }
#footerNaviArea ul { list-style: none; width: 100%; padding-left: 50px; padding-right: 50px; box-sizing: border-box; }
#footerNaviArea ul li { margin-right: 15px; display: inline-block; }
#footerNaviArea ul li:nth-last-of-type(1) { margin-right: 0; }
#footerNaviArea ul li a { display: block; white-space: nowrap; text-decoration: none; color: #666; font-size: 0.9em; }
#footerNaviArea ul li a span { padding-left: 10px; background: url("../common-img/footer_arrow.png") no-repeat left center; }
#footerNaviArea ul li a:hover { text-decoration: underline; }

/*フッターアドレス*/
#footerAddress { width: 100%; margin: 0 auto 20px auto; display: flex; padding-left: 50px; padding-right: 50px; box-sizing: border-box; }
#footerAddress p { font-size: 20px; font-weight: bold; margin-right: 40px; }
#footerAddress address,
#footerAddress em { font-style: normal; }
#footerAddress address { flex: 1 1 auto; }
#footerAddress address div { font-size: 13px; }
#footerAddress address div.col1,
#footerAddress address div.col2 { display: block; }

/*コピーライト*/
#pCopyright {}
#pCopyright p { width: 100%; padding-left: 50px; padding-right: 50px; box-sizing: border-box; color: #999; font-size: 0.9em; }






/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
カスタム
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

/*bVImgBanner*/
.bVImgBanner { border: none !important; }
.bVImgBanner a { display: block; position: relative !important; padding: 0 !important; box-sizing: border-box; }
.bVImgBanner a img { border-radius: 4px !important; }
.bVImgBanner a:after { content: ""; display: block; width: 100%; height: 64px; margin-top: -64px; position: relative; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; }
.bVImgBanner h5 { position: absolute !important; margin: 0 !important; bottom: 10px !important; width: 100%; text-align: center; z-index: 1; color: #FFF; text-shadow: 1px 1px 5px rgba(0, 0, 0, 1); }
.bVImgBanner p { position: absolute !important; margin: 0 !important; bottom: 32px !important; width: 100%; text-align: center; z-index: 1; color: #FFF; text-shadow: 1px 1px 5px rgba(0, 0, 0, 1); }

/*リスト*/
.bVCatList2 { overflow: hidden; margin-bottom: 55px; }
.bVCatList2 ul.items { width: auto !important; display: flex; flex-wrap: wrap; position: relative; margin-right: -15px; padding-top: 0; }
.bVCatList2 ul.items li { flex-grow: 0; flex-shrink: 0; flex-basis: calc((100% / 4) - 15px); max-width: calc((100% / 4) - 15px); margin-right: 15px; margin-bottom: 0; margin-top: 15px; }
.bVCatList2 ul.items li:nth-of-type(1),
.bVCatList2 ul.items li:nth-of-type(2),
.bVCatList2 ul.items li:nth-of-type(3),
.bVCatList2 ul.items li:nth-of-type(4) { margin-top: 0; }
.bVCatList2 ul.items li .bVCatList2Inner { border: 1px solid #DDD; background-color: #FFF; }
.bVCatList2 ul.items li .bVCatList2Inner .bVCatList2Img { position: relative; margin: 0 !important; }
.bVCatList2 ul.items li .bVCatList2Inner .bVCatList2Img a { display: block; }
.bVCatList2 ul.items li .bVCatList2Inner .inner { padding: 12px; }
.bVCatList2 ul.items li .bVCatList2Inner .inner a { color: #333; line-height: 1.4em; }
.bVCatList2 ul.items li .bVCatList2Inner .inner p { line-height: 1.4em; }
.bVCatList2 ul.items li .bVCatList2Inner .inner h5 { margin-bottom: 10px; }
.bVCatList2 ul.items li .bVCatList2Inner .inner p.bVCatList2Date { margin-bottom: 5px; }
.bVCatList2 img.newIco { position: absolute; top: 10px; right: 10px; width: 56px; height: 56px; }
.bVCatList2 ul.items li .bVCatList2Inner .inner div { display: block; width: 8em; color: #FFF; background-color: #3499DC; position: relative; margin-top: -23px; margin-bottom: 13px; line-height: 1; font-size: 0.8em; text-align: center; padding: 5px 0; }

/*bTtl*/
.bTtl h2.color10 { background-color: #2A8D67; color: #FFF; font-size: 19px; font-weight: bold; padding: 15px 20px 13px 20px; line-height: 1; }

/*.bExtCatList*/
.bExtCatList h2 span { font-weight: bold; }

/* 2024.04.22 プレビュー、アーカイブ時 */
#archiveMsgBox + #wrapper #headerAreaOuter,
#archiveMsgBox + #wrapper .headerOption,
#previewMsgBox + #wrapper #headerAreaOuter,
#previewMsgBox + #wrapper .headerOption { top: 40px; }
#previewMsgBox + #archiveMsgBox + #wrapper #headerAreaOuter,
#previewMsgBox + #archiveMsgBox + #wrapper .headerOption { top: 80px; }
