@import url("../top/shared-site.css");
@charset "UTF-8";

/*
沖縄市
ベースカラー：#183380
*/

/*レスポンシブで色が変わる部分については後半に*/

/* =====================================
	全体のリンク色
====================================== */
a {
	color:#000099;
}
a:hover {
	color:#ff9935;
}

/* =====================================
	topページ
====================================== */
.Portal {
  background:linear-gradient(to bottom, transparent, #DFF4EF 90%, #fff) no-repeat;
}

header #headerInner h1 {
        background: url(../../../../Content/images/site/portal/47211/header_title.png) left top no-repeat;
}

/*headerが無地の背景時に使用
------------------------------*/
body #header {
    background: #fff;
}

.btn-help{
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    height: 60px;
}

#topicPath {
    border-top: 1px solid #dcdcdc;
    box-shadow: inset 0 1px 0px #fff;
    /*background-color: #DFF4EF;*/
    
}



/*
#headerInner > a:first-child{
        width: 524px;
        height: 60px;
        display: block;
}
#headerInner > a:first-child > h1{
        width: 100%;
        height: 100%;
}
*/

/*キューナの画像*/
#headerInner .recpas {
    position: absolute;
    top: 0;
    right:100px;
}

#headerInner .recpas img{
    height: 58px;
    margin-top: 0px;
}

/*キューナの画像ここまで*/

.wrapContens {
    box-shadow:inset 0 0px 0 0 #e7d0e6;
    border-top: 0px solid #183380;
    /*background: linear-gradient(to right, #FFF, #DFF4EF 1%, #DFF4EF 99%, #fff);*/
    background: transparent;
}
/*メインイメージ背景色*/
.wrapFirst{
	/*background: #f5f5f5;*/
	background: url(../../../../Content/images/site/portal/47211/imageMain_bg.png) center top  no-repeat;
    /*background-position-y: -32vw;*/
    /*background-size: 1480px;*/
    background-size: min(100vw, 2000px);
    padding: 0px 0;
    background-position: bottom 28% left 50%;
}

.contentsPortal {
    width: 960px;
    position: relative;
    margin: -4px auto 0;
}

.boxExplain {
    /*border: 1px solid #ccc;
    box-shadow: inset 0 0 0 1px #f5f5f5;*/
    border-radius: 0px;
    /*background: url(../../../../Content/images/site/portal/47211/imageMain.jpg) left top no-repeat;*/
    height: 170px;
}
/*mainimageに白い帯をつけるとき
.boxExplain:after {
    content:'';
    background:rgba(255,255,255,0.4);
    width: 100%;
    height: 37px;
    display:block;
    position:absolute;
    bottom: 0px;
    left: 0;
    z-index: 2;
}*/
/*メインイメージのテキスト部分左寄せか真ん中寄せ*/
.boxExplain h2 {
    margin: 0 auto 0 15px;
		background: url(../../../../Content/images/site/portal/47211/imageMain_txt.png) center center no-repeat;
}
/*カテゴリ選択モーダルの見出し*/
#modalWrapper h1{
    background: #183380;
}



/* お知らせ
レスポンシブ対応あり
------------------------------ */
.mdsNews {
    color: #183380;
}
.listNews {
    border-left: 2px solid #183380;
}

.bdrNews {
    border: 1px solid #ddd; /*#183380*/
}

/* 掲載マップ一覧
------------------------------ */
/*（掲載マップ一覧枠含め）マップカテゴリが4枠ない時*/
.clearfix-sp {
    display: none;
}

/*枠*/
.bdrMap {
    border: 3px solid #183380;
}

/*画像の表示領域*/
.imageMap {
	height: 140px;
}

/*地図検索ボタン*/
.linkSearchmap {
    background:url(../../../../Content/images/site/mds_module_list.png) 5px center no-repeat #183380;
    background-size: 16px 16px;
    color: #fff;
    border:1px solid #183380;
}
/*掲載マップ一覧*/
.boxModule.moduleTitle {
    background: #183380;
    border: 3px solid #183380;
}

.boxModule a {
    color: #000;
}
/*
.map1 {
    background: url(../../../../Content/images/site/thumMap1.png) 50% 50% no-repeat;
}
*/

/* オープンデータカタログ
------------------------------ */
.bdrLink {
    border: 3px solid #183380;
		border-radius: 3px;
		position: relative;
}
.bdrLink h2 {
		font-size: 140%;
		left: 1px;
		padding: 0 7px;
		position: absolute;
		top: 145px;
}
.bdrLink p {
		text-align: left;
		width: auto;
		box-sizing: border-box;
		font-size: 100%;
		left: 1px;
		padding: 0 7px;
		position: absolute;
		top: 170px;
}

/* QRコード
------------------------------ */
.boxQr {
    background: #183380;
    border: 1px solid #183380;
}
.boxQr h2 {
    color: #fff;
    border-bottom: 1px solid #fff;
}
.boxQr p {
    color: #fff;
}

/* 県地形図更新履歴
------------------------------ */
.bdrDownload {
    background-color: #E3F2FD;
    background: url("../../../../Content/images/site/mapct-thumbnail/47211/thumDownload.png") no-repeat 50% 50%;
    border: 3px solid #2C5AAC;
    border-radius: 3px;
    letter-spacing: 1px;
}
.bdrDownload h2 {
    background-color: rgba(255, 255, 255, 0.85);
    background-color: rgba(35, 71, 148, 0.8);
    color: #fff;
    border-bottom: 1px solid #fff;
}
.bdrDownload h2 div {
    height: 50px;
    line-height: 50px;
    margin: 0px auto 0;
    text-align: center;
    overflow: hidden;
    white-space:nowrap;
    text-overflow: ellipsis;
    width: 96%;
    padding-right: 4px;
    font-size: 150%;
}
.bdrDownload h2 div span {
    font-size: 100%;
    font-weight: normal;
}
.bdrDownload p {
    background-color:  rgba(35, 71, 148, 0.05);
    padding: 1.2em 1em;
    text-align: left;
    font-size: 100%;
    font-weight: bold;
    color: #2b2b2b;
    line-height: 1.8;
    text-shadow: 2px 2px 1px #fff, -2px 2px 1px #fff, 2px -2px 1px #fff, -2px -2px 1px #fff;
}
.bdrDownload .note a {
    display: inline-block;
    background-color: #C7691B;
    border: 1px solid #bf6012;
    border-radius: 4px;
    width: auto;
    height: 35px;
    line-height: 35px;
    font-size: 120%;
    margin-top: 15px;
    padding: 0 1em;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 1px 1px 1px #ccc;
}
.bdrDownload .note a:hover {
    background-color: #1BADC7;
    border: 1px solid #1BADC7;
}


/* =====================================
	位置選択ページ
====================================== */

.column-left h3 , .column-right h3 {
    background-color: #183380;
    color: #fff;
    border: 1px solid #dcdcdc;
    background: url("../../../../Content/images/pages/menu/btn_icon_all.png") no-repeat scroll 0 -2px #183380;
    padding-left: 30px;
}

.area.area_e img{
    display: block;
    margin: 0 auto;
}

.layerct_li ul li.layer_li {
		background-color: #d8e2f6;
}

/*目標物から探すリストを2列表示*/
.area_c .layerct ul {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
}
.area_c .layerct ul li {
		width: 50%;
		margin-top: 3px;
}


/* =====================================
	住所一覧ページ
====================================== */

/* 頭文字で絞り込み検索
------------------------------ */
.selectmap-inner #PqList {
    background: #f4e8d9;
    border: 2px solid #efdfcb;
}

.selectmap-inner h4.mds_h4_int {
    background: #efdfcb;
}


/* 大字・町名一覧
------------------------------ */
#Area_F #Title {
    background-color: #183380;
    color: #fff;
}

#Area_F .CTName {
    border: 1px solid #c6d3f1;
    background-color: #d8e2f6;
    color: #343434;
}



/* =====================================
	タブ使用時
	:afterがついているのは下線部分の設定
	検索窓の設定あり
	.map-select .map-select-body span.btn-map-select-bodyに表示非表示
======================================

#tab ul > li a {
    background:none;
    width: 135px;
    height: 30px;
    border-right: none;
    margin: 0 auto;
    position:relative;
    box-sizing: border-box;
    color: #183380;
    background:#fff;
    border: 1px solid #183380;
    border-bottom: 0px;
    font-weight: bold;
}

#tab ul > li {
    margin-right: 10px;
    width: 135px;
    height: 30px;
}


#tab .map-select-tab .map-select,
#tab .map_click_change_Wrap .map_click_change {
    width: 100%;
    border-bottom: 5px solid #183380;
}

.frame-map .header {
    margin-top: 0;
    margin-left: 0px;
}

#tab ul > li a.current_navi1,
#tab ul > li a.current_navi2,
#tab ul > li a.current_navi3,
#tab ul > li a.current_navi4,
#tab ul > li a.current_navi5,
#tab ul > li a.current_navi6,
#tab ul > li a.current_navi7
{
    background:#183380;
    color:#fff;
}

#tab ul > li a:after {
    content:'';
    width: 110px;
    height: 20px;
    display: block;
    border-bottom: 2px solid #183380;
    position:absolute;
    top:3px;
    left: 50%;
    margin-left: -55px;
}
#tab ul > li a:hover:after {
    border-bottom: 2px solid #a3e6fd;
}

#tab ul > li a.navi1:after,
#tab ul > li a.navi2:after,
#tab ul > li a.navi3:after,
#tab ul > li a.navi4:after,
#tab ul > li a.navi5:after,
#tab ul > li a.navi6:after,
#tab ul > li a.navi7:after{
    width: 96px;
    margin-left: -48px;
}

#tab ul > li a.current_navi1:after,
#tab ul > li a.current_navi2:after,
#tab ul > li a.current_navi3:after,
#tab ul > li a.current_navi4:after,
#tab ul > li a.current_navi5:after,
#tab ul > li a.current_navi6:after,
#tab ul > li a.current_navi7:after
{
    border-bottom-color:#ff9900;
}

.frame-info .search{
    height: 39px;
}
.frame-info .search .srch {
    padding: 5px 0;
}
.srch input[type="text"]{
    background: #fff4c2;
}

.srch input[type="text"].placeholder{
    color: #888888;
}

.srch input[type="text"]:focus{
    background:#fff;
}

*/
/* =====================================
	地図ページ
====================================== */
#header-map {
    background:#fff;
}
.frame-map .header {
    background-color: #183380;
}

.header .backgroundmap{
    background: #183380;
}

.header .backgroundmap + .frame-close {
    background: url("../../../../Content/images/pages/ulaydel.png") no-repeat scroll center center #183380;
}
/*ロゴ画像をcss表示にする設定*/
#header-map h1 {
  background: url(../../../../Content/images/site/portal/47211/logo_map.png) center left no-repeat;
  width: 380px;
  height: 50px;
  margin: 0;
  top: 4px;
  left: 4px;
}

#header-map h1 a{
    width: 100%;
    height: 100%;
    display: block;
}
#header-map h1 a img{
    display: none;
}


/* 左ナビ
------------------------------ */


/* 左ナビの枠 */
.layer-tree .tree-wrap {
    border: 4px solid #183380;
    border-top: none;
}

/* 検索ボタン */

.frame-info .search .btn-adrsrc {
    background-color: #AE3737;
    color: #fff;
}
.frame-info .search .btn-adrsrc:hover {
    background-color: #AE3737;
    opacity: 0.7;
}


/* 地図のタイトル */
.mapNameTab h2.map-title , .map-select h2.map-title {
    height: 40px;
    background-color: #f7f7f7;
    color: #333333;
    line-height: 40px;
}
h2.map-title.size-m {
    line-height: 1.4;
}
h2.map-title.size-s {
    line-height: 1.6;
}

/* iボタンの表示・非表示 */
.map-select .map-info .btn-map-info {
    display: none;
}

/** iボタンが非表示の時はwidthを大きめに設定 **/
.map-select h2.map-title {
    width: 200px;/*iボタン表示の時：170px*/
}

/* マップ切り替え */
.map-select .map-select-body span.btn-map-select-body {
    background: url("../../../../Content/images/pages/menu/btn_icon_chg.png") no-repeat scroll left center #AE3737;
    color: #fff;
    /*display:none;タブ機能使用時*/
}
.map-select .map-select-body span.btn-map-select-body:hover {
    background: url("../../../../Content/images/pages/menu/btn_icon_chg.png") no-repeat scroll left center #AE3737;
    opacity: 0.7;
}

.map-select .map-select-body {
    border-left: none;
    border-right: none;
}

/* 探す測る描くルートエリア */
.frame-info ul.nav {
    border: 1px solid #e6e6e6;
}

.frame-info ul.nav li {
    border-right: 1px solid #fff;
    background: #183380;
    /*background: -moz-linear-gradient(top, #183380 0%, #183380 49%, #065999 50%, #065999 100%);
    background: -webkit-linear-gradient(top, #183380 0%,#183380 49%,#065999 50%,#065999 100%);
    background: linear-gradient(to bottom, #183380 0%,#183380 49%,#065999 50%,#065999 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#183380', endColorstr='#065999',GradientType=0 );*/
}

.frame-info ul.nav li:hover {
/*    background: #5589bf;
    background: -moz-linear-gradient(top,rgba(85,137,191,1) 0%,rgba(85,137,191,1) 50%,rgba(86,127,168,1) 51%,rgba(86,127,168,1) 100%);
    background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(85,137,191,1)),color-stop(50%,rgba(85,137,191,1)),color-stop(51%,rgba(86,127,168,1)),color-stop(100%,rgba(86,127,168,1)));
    background: -webkit-linear-gradient(top,rgba(85,137,191,1) 0%,rgba(85,137,191,1) 50%,rgba(86,127,168,1) 51%,rgba(86,127,168,1) 100%);
    background: -o-linear-gradient(top,rgba(85,137,191,1) 0%,rgba(85,137,191,1) 50%,rgba(86,127,168,1) 51%,rgba(86,127,168,1) 100%);
    background: -ms-linear-gradient(top,rgba(85,137,191,1) 0%,rgba(85,137,191,1) 50%,rgba(86,127,168,1) 51%,rgba(86,127,168,1) 100%);
    background: linear-gradient(to bottom,rgba(85,137,191,1) 0%,rgba(85,137,191,1) 50%,rgba(86,127,168,1) 51%,rgba(86,127,168,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5589bf',endColorstr='#567fa8',GradientType=0);
*/
   opacity: 0.7;
}
/*探す測る描くルートのどれかが無効時のボタン色設定*/
.modespsearch .frame-info ul.nav li {
    background: #aaa;
}
.modespsearch .frame-info ul.nav li:first-of-type {
    background: #183380;
}
.modespsearch .frame-info ul.nav li:hover {
    opacity: 1;
}

.modespsearch .frame-info ul.nav li:first-of-type:hover {
    opacity: 0.7;
}
/**/

.frame-info ul.nav li a {
    color: #fff;
    /*text-shadow: 1px 1px 2px #144475;*/
    text-shadow: none;
}


/* 表示切替 */
.switch {
    background-color: #183380;
}

.switch p {
    /*text-shadow: 1px 1px 2px #1b5c99;*/
    text-shadow: none;
}


/* 住所一覧を表示して検索、目標物・施設一覧を表示して検索 */
.frame-info ul.link li {
    background: #183380;
    color:#fff;
    /*background: -moz-linear-gradient(top, #183380 0%, #183380 49%, #065999 50%, #065999 100%);
    background: -webkit-linear-gradient(top, #183380 0%,#183380 49%,#065999 50%,#065999 100%);
    background: linear-gradient(to bottom, #183380 0%,#183380 49%,#065999 50%,#065999 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#183380', endColorstr='#065999',GradientType=0 );*/
}


.frame-info ul.link li:hover {
    opacity: 0.7;
}

/* 検索結果 */
.search-keyadrs-multi .result .multi-result .searchinfo {
    background: #f3fbb6;
    border-top: 1px solid #222;
}
.search-keyadrs-multi .result .multi-result .searchfor {
    color: #f00;
}

.search-keyadrs-multi .result .multi-result .multi-result-title {
    background: #183380;
    color: #fff;
}

/* マップ選択 */

.fw-tabs li.category-map a {
    background :#ababab;
}

.fw-tabs li.category-map.fw-selected a, .fw-tabs li.category-map a:hover {
    background: #183380;
    color: #fff;
}

.win-map-select1 .map-select-body ul li.map-list a p.map-list-text, .win-map-select2 .map-select-body ul li.map-list a p.map-list-text {
    color: #555;
}

.win-map-select1 .map-select-body ul li.map-list a p.map-list-text.current, .win-map-select2 .map-select-body ul li.map-list a p.map-list-text.current, .win-map-select1 .map-select-body ul li.map-list a:hover p.map-list-text, .win-map-select2 .map-select-body ul li.map-list a:hover p.map-list-text {
    color :#183380;
}

/* テーマ検索の左ナビ */
#theme-layer-tree .tree-wrap {
    border: 0px;
}

#parent-area-select, #parent-layer-tree {
    background: #fff;
}

#theme-layer-tree ul.switch {
    background: none;
    border: none;
}

/* 右クリックメニュー */

.cm-context-menu {
    border: 1px solid #222;
}

.cm-context-menu ul {
    border: 1px solid #ccc;
}

.cm-context-menu .cm-item.cm-address {
    background: none repeat scroll 0 0 #183380;
    color: #fff;
    padding-right: 25px;
}

.cm-context-menu .cm-hr {
    border-top: #183380 1px solid;
}

.cm-context-menu .cm-close {
    top: 3px;
    right: 3px;
}


/* 属性一覧
------------------------------ */

.fdl-layer-select-area {
    background-color: #183380;
}

.fdl-title {
    border: solid 1px transparent;
    color: #fafffa;
}

.btn-fdl-close, .btn-fdl-close:hover {
    border: solid 1px #fafffa;
    color: #fafffa;
}

.btn-fdl-close:hover {
    background: #276cb2;
}

/* リンク
------------------------------ */

.win-link1.fw-f-window .fw-window-handle, .win-link2.fw-f-window .fw-window-handle {
    background: #555 url("../../../../Content/images/pages/map/ttl_link.png") no-repeat scroll 4px center;
}



/* URLリンク、外部サイトボタン */
.fw-tabs {
    background: #555;
}


.fw-tabs li.fw-selected a, .fw-tabs li a:hover {
    color: #fff;
    font-weight: bold;
    background: #dc4e4e;
}

.fw-tabs li a {
    background: #218cc2;
}

/* 画像保存
------------------------------ */
#win-save.fw-f-window .fw-window-handle {
    background: #555 url("../../../../Content/images/pages/map/ttl_save.png") no-repeat scroll 4px center;
}


/* 印刷
------------------------------ */
.map-print-content h1 {
    background-color: #f2f2f2;
    border: 1px solid #e6e6e6;
}

.map-print-content h1 span {
    color: #183380;
}


/* rotate_map
------------------------------ */

/*header部分*/
#frame-map .header {
    background: url("../../../../Content/images/pages/content_brackarea_bg.jpg") repeat-x scroll left top transparent;
    background: #555;
}


/*右上のnavボタン*/
.rotate-map #header {
    background:#fff;
    box-shadow: 0 0 5px #ddd;
}

#header ul.nav li:first-of-type {
    border-left: none;
}
#header ul.nav li {
    border-left: 1px solid #ddd;
}

/*ナビボタンのテキスト*/
.rotate-map #header ul.nav li a.measure
,.rotate-map #header ul.nav li a.draw
,.rotate-map #header ul.nav li a.route {
    text-indent: 100%;
}


/* =====================================
	利用許諾ページ
====================================== */

#policy .wrap-note {
    border: 4px solid #183380;
    background-color: #fff;
}

#policy .mds-top01 h2 {
    border-bottom: 4px solid #183380;
    color: #000;
    background: none;
}

#policy h3.mds-sub01 {
    background: #183380;
    border: 1px solid #dcdcdc;
    color: #fff;
}

#policy .box-frame2 .note2 dl dt {
    border-left: 10px solid #183380;
    padding-left: 0.5em;
    margin: 1em 0 0.5em;
}

#policy .policy-inner {
    background: none;
}


/* =====================================
	住所検索結果ページ
====================================== */

.content-wrap .condtion-title {
    background-color: #183380;
    background: url("../../../../Content/images/pages/menu/btn_icon_all.png") no-repeat scroll 0 -2px #183380;
    border-bottom: none;
    padding-left: 30px;
}

/* =====================================
	テーマ検索結果ページ
====================================== */
.reisze-wrap {
    background :#f5f5f5;
}
.frame-first {
    background: none;
}
.result-display table {
    background: #fff;
}
#theme-grid .onSelected {
    background: #FDD774;
}
#theme-grid .ui-state-hover {
    background: #78C8EB;
}


/* =====================================
	ターゲットサーチ
	TargetSearch
====================================== */

/*イラストマップ切替がある場合
#landmark-kind-tree .ct-wrap {
    height: 366px !important;
}*/


/* =====================================
	お問い合わせページ
	Inquery
====================================== */

#contents section h1 {
    border-left: 6px solid #183380;
}

.inquiryOuter table tr th {
    padding: 2px 4px;
    background: #555;
    border: 1px solid #555;
    border-right: #fff solid 1px;
}

.inquiryOuter table tr th:last-child {
    border-right: #555 solid 1px;
}

.inquiryOuter table tr td {
    border: 1px solid #555;
}


/* =====================================
	ポータルサーチ
====================================== */
#contents > h3 , #SearchWord > h3 {
    background: #183380;
    border: 1px solid #dcdcdc;
}

#Result > #admh h4, #Result > #tpdb h4,#Result > #tgdb h4,#Result > #addb h4, #Result > #zpdb h4, #Result > #mkwd h4 {
    background: #183380;
}


/* =====================================
	フッター
====================================== */
/*フッターの電話番号の頭に電話：を表示
address > span:last-of-type:before {
    content:'電話：';
}
*/
.footer-links {
    margin: 0px 0 7px;
}

#footer a {
    margin-left: 0;
}

#footer a:first-of-type {
    margin-left: 5px;
}
#footer a:last-of-type {
    display:none;
}

#footer{
	/*max-width: 1024px;*/
	width: 100%
}

/* =====================================
	汎用ボタン
====================================== */
/*
input.buttonType {
    background: #F0F0F0;
    border: 1px solid #999;
}
input.buttonType:hover {
    border: 1px solid #666;
    color: #111;
}
*/

/* =====================================
	レスポンシブで変わる部分
====================================== */

/*  = スマートフォン用 - 1column
----------------------------------------------------------------------*/
@media only screen and (max-width: 480px) {
    /*通常ロゴが入りきれない時に使用*/
    header #headerInner h1 {
        width: 100%;
        margin-left: 0px;
        background:url(../../../../Content/images/site/portal/47211/header_title.png) left center no-repeat;
        background-size:280px auto;}


    .wrapFirst > .boxExplain {
        background: url(../../../../Content/images/site/portal/47211/imageMain_txt.png)  center center no-repeat;
        background-size: 96%;
        width: 98%;
        height: 0px;
        padding-top: 54.934%;/*高さはここで調整する*/
    }
    .contentsPortal {
        width: auto;
        position: static;
    }
    
    .bdrMap2 {
  		float: left;
  		display: block;
  		width: 98%;
  		height: auto;
  		box-sizing: border-box;
  		margin: 4px 4px;
  		background: #fff;
  		border: 3px solid #183380;
	}
	.bdrMap2 h2 {
 	 	padding: 5px 7px;
  		font-size: 140%;
  		text-align: center;
  		line-height: 1.5;
  		font-weight: bold;
  		color: #ff0000;
	}
	.bdrMap2 p {
		width: auto;
		text-align: left;
		font-size: 105%;
		padding: 0 22px 0 15px;
		box-sizing: border-box;
	}
}

/*  = 小型タブレット用 - 2column
----------------------------------------------------------------------*/
@media only screen and (min-width: 481px) {
    .wrapFirst > .boxExplain {
        background: url(../../../../Content/images/site/portal/47211/imageMain.jpg) left top no-repeat;
        /*background: #cde3fb;*/
        width: auto; height:414px;
    }

    .wrapFirst > .boxExplain h2{
        width: 90%;
        max-width: 524px; /*363px*/
				background-size: contain;
    }
    .contentsPortal {
        width: auto;
        position: relative;
    }
    
    .bdrMap2 {
  		float: left;
  		display: block;
  		width: 98%;
  		height: auto;
  		box-sizing: border-box;
  		margin: 4px 4px;
  		background: #fff;
  		border: 3px solid #183380;
	}
	.bdrMap2 h2 {
 	 	padding: 5px 7px;
  		font-size: 140%;
  		text-align: center;
  		line-height: 1.5;
  		font-weight: bold;
  		color: #ff0000;
	}
	.bdrMap2 p {
		width: auto;
		text-align: left;
		font-size: 105%;
		padding: 0 22px 0 15px;
		box-sizing: border-box;
	}

.wrapFirst{
	background-size: cover;
}
}

/*  = 大型タブレット用 - 3column
----------------------------------------------------------------------*/
@media only screen and (min-width: 769px) {
    .wrapFirst {
        box-shadow: none;
        border-bottom: none;
    }
		/*メインイメージ下のライン。3カラム以上専用*/
    .wrapContens {
        overflow-x: hidden;
		}
    .boxExplain:after{
        content: '';
        width: 300%;
        height: 1px;
        box-shadow: inset 0 -1px 0 0 #ddd;
        border-bottom: 1px solid #fff;
        top: 100%;
        left: -100%;
        position: absolute;

    }

    .wrapFirst > .boxExplain h2{
        width: 533px; /*363px*/
        
    }
		.mdsNews {
        float :none;
        width: auto;
        text-align: left;
        border-bottom: 2px solid #183380;
    }
    .listNews {
        width: auto;
        max-height: 123px;
        float :none;
        border: none;
    }
    .bdrNews {
        max-height: 148px;
        height: 148px;
        width: 220px;
        position: absolute;
        right: 0px;
        top: 15px;
    }
    
    .bdrMap2 {
  		float: left;
  		display: block;
  		width: 98%;
  		height: auto;
  		box-sizing: border-box;
  		margin: 4px 4px;
  		background: #fff;
  		border: 3px solid #183380;
	}
	.bdrMap2 h2 {
 	 	padding: 5px 7px;
  		font-size: 140%;
  		text-align: center;
  		line-height: 1.5;
  		font-weight: bold;
  		color: #ff0000;
	}
	.bdrMap2 p {
		width: auto;
		text-align: left;
		font-size: 105%;
		padding: 0 22px 0 15px;
		box-sizing: border-box;
	}
	.bdrNews {
  max-height: 148px;
  height: 148px;
  width: 220px;
  position: absolute;
  right: 0px;
  top: 76px;
  left: calc(50% + 167px);
}

.wrapFirst{
	background-size: min(100vw, 1600px);
}

}
/*  = 通常PC用 - 4column
----------------------------------------------------------------------*/
@media only screen and (min-width: 961px) {
    .wrapFirst > .boxExplain {
        /*background: url(../../../../Content/images/site/portal/47211/imageMain.jpg) right top no-repeat;*/
        background: linear-gradient(90deg, rgba(199,227,246, 1) calc(50vw - 900px) , rgba(199,227,246, 0) calc(50vw - 500px) , rgba(199,227,246, 0) calc(50vw + 500px), rgba(199,227,246, 1) calc(50vw + 900px));
        /*background: #cde3fb;*/
        /*width: 952px;*/
        height: 414px;
        position: relative;
        /*max-width: 1024px;*/
  		width: 100%;
    }
    .wrapFirst > .boxExplain h2{
        width: 533px;/*363px*/
        margin-left: calc(50vw - 500px);
		top: -9%;
		position: absolute;
    }
    .contentsPortal {
        /*width: 960px;*/
        width: 100%;
        position: relative;
    }
    
    .bdrMap2 {
  		float: left;
  		display: block;
  		width: 950px;
  		height: 260px;
  		box-sizing: border-box;
  		margin: 4px 4px;
  		background: #fff;
  		border: 3px solid #183380;
	}
	.bdrMap2 h2 {
 	 	padding: 5px 7px;
  		font-size: 140%;
  		text-align: center;
  		line-height: 1.5;
  		font-weight: bold;
  		color: #ff0000;
	}
	.bdrMap2 p {
		width: auto;
		text-align: left;
		font-size: 105%;
		padding: 0 22px 0 15px;
		box-sizing: border-box;
	}
	
	.bdrNews {
  max-height: 148px;
  height: 148px;
  width: 220px;
  position: absolute;
  right: 0px;
  top: 76px;
  left: calc(50% + 270px);
}

.wrapSecond {
	max-width: 1024px;
	width: 100%;
}

.boxModule{
	width: calc( 100% / 4 - 8px );
}
header #headerInner {
  max-width: 1024px;
  width: 100%;
}

.footer-inner {
  max-width: 1024px;
  width: 100%;
}

.wrapFirst{
	background-size: min(100vw, 2000px);
}

}