/* 村山市一般公開用(トップページ・マップページ)のcss */
/* マップページ：村山市仕様のために作成or上書きするスタイルのみ、このファイルに記述する。
　　通常仕様への修正については、いつも通りmapfullview.cssに記述。*/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
    margin:0;
    padding:0;
}

body {
    background-color: #ffffff;
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
    /*font-family: "ＭＳ Ｐゴシック","MS PGothic",Sans-Serif,verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka;*/
    line-height: 1.5;
    color: #333333;
    min-width: 0rem;
    /*text-align: center;*/
}

button {
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
    margin: 0.5rem 0.1rem;
    cursor: pointer;
    text-align: center;
    padding: 0.1rem 0.9rem;
    font-size:14px;
    background: #e5ebee;
    border: 0px solid #cfcfcf;
    border-radius: 1px;
}
/* ===================================================================================
/* 反映先
/* map_public_murayama.tpl (一般公開トップページ)
/* terms_publicmap.tpl (一般公開用地図)
/* ===================================================================================*/

/* ==================================================
/* map_public_murayama で反映されるもの
/* ==================================================*/

/* =================
/* 共通設定
/* =================*/

/* info_box(お知らせ等)・widemap(地図)・desc,describer(紹介項目) */
#info_box,#widemap_box,#describe_box,#contact_box{
    width: 960px;
    margin: 20px auto;
}
#info_box_chitose{
    width: 960px;
    margin: 20px auto;
}
#widemap_header,#desc_header,#contact_header{
    width:100%;
    margin:10px 0;
    padding:15px 0; 
    border: 1px solid #dedede;
    background: -moz-linear-gradient(bottom, #9fd990, #ecf9e1);
    background: -webkit-linear-gradient(bottom, #9fd990, #ecf9e1);
    background: linear-gradient(to top, #9fd990, #ecf9e1);
}
#widemap_header_yurihonjo,#desc_header_yurihonjo,#contact_header_yurihonjo{
    width:100%;
    margin:10px 0;
    padding:15px 0; 
    border: 1px solid #dedede;
    background: -moz-linear-gradient(bottom, #228b22, #ecf9e1);
    background: -webkit-linear-gradient(bottom, #228b22, #ecf9e1);
    background: linear-gradient(to top, #228b22, #ecf9e1);
}
#widemap_header_ozora,#desc_header_ozora,#contact_header_ozora{
    width:100%;
    margin:10px 0;
    padding:15px 0; 
    border: 1px solid #dedede;
    background: -moz-linear-gradient(bottom, #b3efff, #ffffff);
    background: -webkit-linear-gradient(bottom, #b3efff, #ffffff);
    background: linear-gradient(to top, #b3efff, #ffffff);
}
#widemap_header label,#desc_header label,#contact_header label,#widemap_header_yurihonjo label,#desc_header_yurihonjo label,#contact_header_yurihonjo label
,#widemap_header_ozora,#desc_header_ozora,#contact_header_ozora{
    padding: 5px 15px;
    font-size: 18px;
    font-weight: bold;
}

/* =================
/* お知らせ・利用規約・対応端末ブラウザ
/* =================*/
input[name="tab"] {
  display: none;
}
.tabLabel{
    font-size:15px;
    font-weight:bold;
    letter-spacing: 1px;
    margin-right: 7px;
    padding: 8px 30px 3px;
    background:#aaaaaa;
    color: #ffffff;
    border-radius: 5px 5px 0px 0px / 5px 5px 0px 0px;
}
.tabLabel:hover {
  opacity: 0.75;
}
#info_tab:checked + .tabLabel,#system_tab:checked + .tabLabel {
  background-color: #6ca176;
}
#info_tab_yurihonjo:checked + .tabLabel,#system_tab_yurihonjo:checked + .tabLabel {
  background-color: #228b22;
}
#info_tab_ozora:checked + .tabLabel,#system_tab_ozora:checked + .tabLabel {
  background-color: #87cefa;
}
#info_tab:checked + .tabLabel,#link_tab:checked + .tabLabel {
  background-color: #6ca176;
}
#terms_tab:checked + .tabLabel{
   background-color: #ce5151;
}

.contentsDisplay{
    display: none;
    overflow-y: auto;
    height: 230px;
    padding: 10px;
    border: 2px solid #6ca176; 
}

.contentsDisplay_info_chitose{
    display: none;
    overflow-y: auto;
    padding: 0px;
    border: 2px solid #6ca176; 
}

#info_tab:checked ~ #info_contents,
#system_tab:checked ~ #system_contents,
#info_tab_yurihonjo:checked ~ #info_contents_yurihonjo,
#system_tab_yurihonjo:checked ~ #system_contents_yurihonjo,
#info_tab_ozora:checked ~ #info_contents_ozora,
#system_tab_ozora:checked ~ #system_contents_ozora {
  display: block;
}

#link_tab:checked ~ #link_contents{
  display: block;
  border-color: #6ca176;
}

#terms_tab:checked ~ #terms_contents{
  display: block;
  border-color: #ce5151;
}

.top_button_img{
    padding-left:5px;
    padding-right:5px;
    padding-top:1px;
    padding-bottom:1px;
    margin:5px 3px;
    vertical-align: middle;
    background:#e5f0e1;
    border:1px solid #9fc392;
    border-bottom: 4px solid #9fc392;
    border-radius: 20px;
    font-weight: normal;
    margin: 5px 3px;
}

.systemLabel {
    width:20%;
    margin: 20px 0 10px 40px;
    padding: 4px 15px;
    font-size: 14px;
    font-weight: bold;
    border-left: 5px solid #6ea97c;
    background: #f5f9fb;
}

.system_indent {
    padding-left: 90px;
}

/* 小さいアイコン関連 */
.infoIcon{
    width:20px;
    vertical-align:sub;
}
.browserIcon img{
    width:25px;
    padding-right:5px;
    vertical-align:bottom;
}

/* =================
/* 広域図
/* =================*/
#widemap_contents{
    padding: 10px 10px 0;
}

.widemapLabel {
    font-size: 18px;
    padding: 8px 70px 4px;
    background: #369e44;
}

.widemapInfo{
    padding-left: 2%;
}

.widemapInfo span{
    cursor: pointer;
    margin:0 3px;
    color: #49a9c7;
    border-bottom:1px solid #49a9c7;
}
.widemapInfo span:hover{
    color: #c74972;
    border-color: #c74972;
}

#widemap_map{
    width:850px;
    height:450px;
    margin:10px auto;
    position:relative;    
}

#widemap_map_yurihonjo{
    width:400px;
    height:700px;
    margin:10px auto;
    position:relative;    
}

#widemap_map_ozora{
    width:520px;
    height:538px;
    margin:10px auto;
    position:relative;    
}

#widemap_map_shari{
    width:520px;
    height:538px;
    margin:10px auto;
    position:relative;    
}

#widemap_map_chitose{
    width:960px;
    height:1473px;
    position:relative;    
}

#widemap_map_chitose_single{
    width:960px;
    height:553px;
    position:relative;
}

.widemapBtn_top label:not(.widemapText){
    position: absolute;
    padding: 3px 12px;
    border-radius: 20px;
    border: 1px solid #d2d5d5;
    border-bottom: 3px solid #cbcdcb;
    font-size: 16px;
    letter-spacing: 1px;
    text-decoration: none;
    color: #243444;
    background: #f5f8de;
    transition: .1s;
}
.widemapBtn_top label:not(.widemapText):hover{
    font-weight: bold;
    background: #ffd87e;
    border-color: #bda85f;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
}
.widemapBtn_top label:not(.widemapText):active{
    opacity: 0.8;
    border-bottom-width: 1px;
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
}
.widemapBtn_top input{
    display:none;
}
.widemapBtn_top_yurihonjo label:not(.widemapText_yurihonjo){
    position: absolute;
    padding: 3px 12px;
    border-radius: 20px;
    border: 1px solid #d2d5d5;
    border-bottom: 3px solid #cbcdcb;
    font-size: 16px;
    letter-spacing: 1px;
    text-decoration: none;
    color: #243444;
    background: #f5f8de;
    transition: .1s;
    
}
.widemapBtn_top_yurihonjo label:not(.widemapText_yurihonjo):hover{
    font-weight: bold;
    background: #ffd87e;
    border-color: #bda85f;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
}
.widemapBtn_top_yurihonjo label:not(.widemapText_yurihonjo):active{
    opacity: 0.8;
    border-bottom-width: 1px;
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
}
.widemapBtn_top_yurihonjo input{
    display:none;
}

.widemapBtn_top_ozora label:not(.widemapText_ozora){
    position: absolute;
    padding: 3px 12px;
    border-radius: 20px;
    border: 1px solid #d2d5d5;
    border-bottom: 3px solid #cbcdcb;
    font-size: 14px;
    letter-spacing: 1px;
    text-decoration: none;
    color: #243444;
    background: #f5f8de;
    transition: .1s;
    
}
.widemapBtn_top_ozora label:not(.widemapText_ozora):hover{
    font-weight: bold;
    background: #ffd87e;
    border-color: #bda85f;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
}
.widemapBtn_top_ozora label:not(.widemapText_ozora):active{
    opacity: 0.8;
    border-bottom-width: 1px;
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
}
.widemapBtn_top_ozora input{
    display:none;
}

.widemapBtn_top_shari label:not(.widemapText_shari){
    position: absolute;
    padding: 3px 12px;
    border-radius: 20px;
    border: 1px solid #d2d5d5;
    border-bottom: 3px solid #cbcdcb;
    font-size: 14px;
    letter-spacing: 1px;
    text-decoration: none;
    color: #243444;
    background: #f5f8de;
    transition: .1s;
    
}
.widemapBtn_top_shari label:not(.widemapText_shari):hover{
    font-weight: bold;
    background: #ffd87e;
    border-color: #bda85f;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
}
.widemapBtn_top_shari label:not(.widemapText_shari):active{
    opacity: 0.8;
    border-bottom-width: 1px;
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
}
.widemapBtn_top_shari input{
    display:none;
}

.widemapBtn_top_chitose label:not(.widemapText){
    position: absolute;
    padding: 3px 12px;
    border-radius: 20px;
    border: 1px solid #d2d5d5;
    border-bottom: 3px solid #cbcdcb;
    font-size: 24px;
    letter-spacing: 1px;
    text-decoration: none;
    color: #ff0000;
    background: #f5f8de;
    transition: .1s;
    font-weight: bold;
}
.widemapBtn_top_chitose label:not(.widemapText):hover{
    font-weight: bold;
    background: #ffd87e;
    border-color: #bda85f;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
}
.widemapBtn_top_chitose label:not(.widemapText):active{
    opacity: 0.8;
    border-bottom-width: 1px;
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
}
.widemapBtn_top_chitose input{
    display:none;
}

.widemapBtn_top_chitose_single label:not(.widemapText){
    position: absolute;
    padding: 3px 8px;
    border-radius: 20px;
    border: 1px solid #d2d5d5;
    border-bottom: 3px solid #cbcdcb;
    font-size: 14px;
    letter-spacing: 1px;
    text-decoration: none;
    color: #000000;
    background: #f5f8de;
    transition: .1s;
    font-weight: bold;
}
.widemapBtn_top_chitose_single label:not(.widemapText):hover{
    font-weight: bold;
    border-color: #bda85f;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
}
.widemapBtn_top_chitose_single label:not(.widemapText):active{
    opacity: 0.8;
    border-bottom-width: 1px;
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
}
.widemapBtn_top_chitose_single input{
    display:none;
}

.widemapText{
    position: absolute;
    top: 35%;
    left: 23%;
    font-size: 25px;
    font-weight: bold;
    letter-spacing: 2px;
    color: #000000;
}
.widemapText_yurihonjo{
    position: absolute;
    top: 47%;
    left: 43%;
    font-size: 25px;
    font-weight: bold;
    letter-spacing: 2px;
    color: #000000;
}
.widemapText_ozora{
    position: absolute;
    top: 50%;
    left: 23%;
    font-size: 25px;
    font-weight: bold;
    letter-spacing: 2px;
    color: #000000;
}
.widemapText_shari{
    position: absolute;
    top: 90%;
    left: 70%;
    font-size: 25px;
    font-weight: bold;
    letter-spacing: 2px;
    color: #000000;
}
.widemapText_itoigawa{
    position: absolute;
    top: 50%;
    left: 23%;
    font-size: 25px;
    font-weight: bold;
    letter-spacing: 2px;
    color: #000000;
}
#widemapText_aomori{
    top: 65%;
    left: 32%;
}

.widemapImg{
    background: #f5f9fb;
    position: absolute;
    background: -moz-radial-gradient(#dbf3d3, #fff);
    background: -webkit-radial-gradient(#dbf3d3, #fff);
    background: radial-gradient(#dbf3d3, #fff);
}

#widemapImg_aomori {
    width:57%;
    height:95%;
    left:3%;
    top:4%;
}

#widemapBtn_aomori_chunan {
    top: 64%;
    left: 23%;
}
#widemapBtn_aomori_tosei {
    top: 54%;
    left: 28%;
}
#widemapBtn_aomori_seihoku {
    top: 52%;
    left: 18%;
}

#josetsusya_aomori {
    width: 26%;
    left: -4%;
    top: 73%;
    position: absolute;
    opacity: 0.5;
}

/* 説明の改行 スマホの場合のみ改行したい */
.line_break {
    display: none;
}

/* =================
/* 確認マップの特徴・できること
/* =================*/
/* 見出し+テキストで1つのかたまり */
.descItem{
    width:95%;
    margin:20px auto;
}
.descItem > div:nth-of-type(1){
    /*display:table-cell;*/
    width:100%;
}
.descItem > div:nth-of-type(2){
    /*横に画像いれる場合に解放・widthの比率を変える*/
    /*display:table-cell;*/
    /*width:35%;*/
}

/* 見出し部分 */
.describeLabel {
    width:50%;
    padding: 8px 15px;
    font-size: 15px;
    font-weight: bold;
    border-left: 7px solid #6ea97c;
    background: #f5f9fb;
}

/* テキスト部分 */
.descText{
    width:90%;
    margin:7px auto;
}

/* =================
/* 問い合わせ先
/* =================*/
#contact_box {
    padding-top: 40px;
}

#contact_contents{
    height:300px;
    padding-left:2%;
}

.contact_number{
    margin:5px auto;
    width: 90%;
    height: 60px;
    background: #f5f9fb;
    border: 1px solid #e2e2e2;
    border-left: 10px solid #a7b6bd;
    border-right: 10px solid #a7b6bd;
    padding: 10px 0 0 35px;
}

.contact_number_aomori {
    margin: 5px auto;
    width: 90%;
    background: #f5f9fb;
    border: 1px solid #e2e2e2;
    border-left: 10px solid #a7b6bd;
    border-right: 10px solid #a7b6bd;
    padding: 10px 0 10px 35px;
}

/* ==================================================
/* terms_publicmap(利用規約) で反映されるもの
/* ==================================================*/
.linkLine{
    cursor: pointer;
    color: #1577af;
    border-bottom: 1px solid #1577af;
}
.linkLine:hover{
    color: #c74972;
    border-color:#c74972;
}

/* ===================================================================================
/* 反映先
/* map_murayama.tpl (村山市用一般公開用マップページ)
/* ===================================================================================*/

/* 地図のズームボタン (上書き)*/
.ol-control button{
    background: rgba(108,161,118,0.8);
}
.ol-control button:hover{
    background: #d4b366;
}

/* ==================================================
/* リスト関連 (上書き)
/* ==================================================*/
table.t th,table.t2 th{
    border: 1px solid #c3c3c3;
}
.data{
    top:75px;
}
.machinelist_th {
    background: #6ca176;
}
.list{
    width:625px;
}
.data{
    width:620px;
}
.hidelist{
    margin-left: 630px;
}
.list2{
    width:1000px;
}
.data2{
    width:995px;
}
.hidelist2{
    margin-left:1005px;
}

/* ==================================================
/* ヘッダ・共通ボタン関連 (上書き)
/* ==================================================*/
/* ヘッダ */
#fullviewheader{
    width: 100vw;
    background-color:#3c8243;
    background: -moz-linear-gradient(bottom,#6ca176 25%,#a8d49e);
    background: -webkit-linear-gradient(bottom,#6ca176 25%,#a8d49e);
    background: linear-gradient(to top,#6ca176 25%,#a8d49e);
    position:absolute;
}
#fullviewheader.yurihonjo{
    width: 100vw;
    background-color:#3c8243;
    background: -moz-linear-gradient(bottom,#228b22 25%,#6ca176);
    background: -webkit-linear-gradient(bottom,#228b22 25%,#6ca176);
    background: linear-gradient(to top,#228b22 25%,#6ca176);
    position:absolute;
}
#fullviewheader.gmap{
    width: 100vw;
    background-color:#3c8243;
    background: -moz-linear-gradient(bottom,#6ca176 25%,#a8d49e);
    background: -webkit-linear-gradient(bottom,#6ca176 25%,#a8d49e);
    background: linear-gradient(to top,#6ca176 25%,#a8d49e);
    position: static;
}
#fullviewheader.yurihonjo.gmap{
    width: 100vw;
    background-color:#3c8243;
    background: -moz-linear-gradient(bottom,#228b22 25%,#6ca176);
    background: -webkit-linear-gradient(bottom,#228b22 25%,#6ca176);
    background: linear-gradient(to top,#228b22 25%,#6ca176);
    position: static;
}

.animation_panel_sp{
    background-color:#3c8243;
    background: -moz-linear-gradient(bottom,#6ca176 25%,#a8d49e);
    background: -webkit-linear-gradient(bottom,#6ca176 25%,#a8d49e);
    background: linear-gradient(to top,#6ca176 25%,#a8d49e);
}
.animation_panel_sp.yurihonjo{
    background-color:#3c8243;
    background: -moz-linear-gradient(bottom,#228b22 25%,#6ca176);
    background: -webkit-linear-gradient(bottom,#228b22 25%,#6ca176);
    background: linear-gradient(to top,#228b22 25%,#6ca176);
}

/* ボタン */
.btn_base{
    color: #194821;
    background: #e5f0e1;
    border: 1px solid #9fc392;
    border-bottom: 4px solid #9fc392;
    border-radius: 20px;
    font-weight: normal;
    margin: 5px 3px;
}
.btn_navi{
    color:#295782;
    background: #c4d8eb;
    border-color: #67a5da;
}
.btn_base:hover, .btn_navi:hover{
    font-weight: bold;
    background:#ffd87e;
    border-color: #bda85f;
}
.btn_base:active, .btn_navi:active{
    opacity:0.7;
}

.btn_reload{
    padding:2px 5px;
}

/* ==================================================
/* 各機能ウィンドウ関連
/* ==================================================*/

/* ヘッダ (上書き)*/
.minimizableWindow > .title, .minimizableWindow > .controlbox_button{
    background: #6ca176;
}
/* コンテンツ (上書き)*/
.win_legendcss{
    background: #eef7f1;
}

/* =================
/* 広域図
/* =================*/

/* ヘッダ(上書き) */
.ui-widget-header {
    border: 3px solid #6ca176;
    background: #6ca176;
}

/* 地区ボタン */
.widemapBtn_map a{
    position: absolute;
    padding: 3px 12px;
    border-radius: 20px;
    border: 1px solid #d2d5d5;
    border-bottom: 3px solid #cbcdcb;
    font-size: 16px;
    letter-spacing: 1px;
    text-decoration: none;
    color: #243444;
    background: #f5f8de;
    transition: .1s;
}
.widemapBtn_map a:hover{
    font-weight: bold;
    background: #ffd87e;
    border-color: #bda85f;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
}
.widemapBtn_map a:active{
    opacity: 0.8;
    border-bottom-width: 1px;
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
}

/* ==================================================
/* ナビゲーション関連 (上書き)
/* ==================================================*/

div#driver-popover-item .driver-popover-footer button {
    border-radius:20px;
}


/* ヘッダ画像 */
#header_img {
    margin: 0 auto;
    width: 960px;
}