@charset "utf-8";
/* RESET */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
        margin: 0;
        padding: 0;
        border: 0;
        vertical-align: baseline;
}
a{
text-decoration:none;
}

body{
        font-family: Lato, "Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size:16px;
  color:#6c5445;
  display:flex;
  flex-direction: column;
  min-height:100vh;
  height:100vh;
  background-color:#fff;
}

header{
  /**  flex:0; **/
  background-image:url("../images/background.png");
  background-repeat: no-repeat;
  background-size:cover;
  background-position:center top;
}
main{

  flex: 1 0 auto;
  background-image:url("../images/back_line2.png");
  background-position: center top;
  background-repeat:repeat-y;
  padding-bottom:20px;
  background-size:contain;
}

header .inner{
  height:200px;
}

footer{
  font-size:12px;
  flex:0;
  text-align:center;
  line-height:3em;
}

/** ヘッダー画像 **/
header .inner{
  text-align:center;
}
header .inner img {
  margin-top:55px;
}
/** 本文 **/
main{

}
article{
  text-align:justify;
  line-height:1.5em;
  margin: 0 7px;
}
/** マップ **/
.mapbox{
  margin: 20px 7px;
}
.mapbox h2{
  border-bottom: solid 1px #6c5445;
  margin-bottom:10px;
  background-image:url("../images/parts_10icon.png");
  background-repeat:no-repeat;
  background-position: left center;
  height:40px;
  position:relative;
}
.mapbox h2 div{
  font-size:20px;
  position:absolute;
  bottom:5px;
  left:55px;
}
.mapbox img{
  width:100%;
  height:auto;
}
/** リンク **/
a.link1{
  display:flex;
  height:40px;
  margin: 40px 20px 20px 20px;
}
a.link1 .col1{
  width:40px;
  height:40px;
  background-color:#f6ad41;
}
a.link1 .col1 .inner{
  width:40px;
  height:40px;
  background-color:#fff;
  border-radius: 0 20px 20px 0;
  position:relative;
}
a.link1 .col1 .inner img{
  width:20px;
  height:20px;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
}
a.link1 .col2{
  height:40px;
  flex-grow:1;
  background-color:#f6ad41;
  border-radius: 0 20px 20px 0;
}
a.link1 .col2 .inner{
  line-height:40px;
  color:#fff;
  margin-left:1em;
}

p.discription{
  margin:20px 40px;
  font-size:14px;
  line-height:1.4em;
}
/** サブページ **/
main.sub{
  padding-bottom:20px;
}
main.sub h1{
  margin-bottom:10px;
  background-image:url("../images/parts_10icon.png");
  background-repeat:no-repeat;
  background-position: left center;
  height:40px;
  position:relative;
}
main.sub h1 div{
  width:300px;
  font-size:18px;
  position:absolute;
  top:2px;
  left:55px;
}
main.sub h1 div span{
  position:absolute;
  display:block;
  font-size:12px;
  top:18px;
}
main.sub .city-type{
  font-size:12px;
  color:#fff;
  text-align:center;
  line-height:25px;
  width:70px;
}
main.sub .pink{
  background-color:#f2a4b4;
}
main.sub .blue{
  background-color:#54b1e0;
}
main.sub .green{
  background-color:#8ec877;
  width:80px;
}
main.sub .photo img{
  width:100%;
  height:auto;
  margin:20px 0;
}
main.sub .feature{
  font-size:18px;
  font-weight:bold;
  text-align:center;
  line-height:40px;
}
main.sub .access{
  position:relative;
  margin-top:20px;
  border:solid 1px #b4d0ed;
  border-top:solid 5px #00a0e8;
}
main.sub .access .title{
  position:absolute;
  left: 0px;
  background-color:#00a0e8;
  color:#fff;
  font-size:14px;
  width:150px;
  text-align:center;
}
main.sub .access .inner{
  font-size:14px;
  margin:36px 5px 5px 5px;
}
main.sub .access .inner dl{
  display: flex;
}
main.sub .access .inner dl dt{
  width:60px;
  min-width:60px;
  text-align:justify;
}
main.sub .access .inner dl dd{
  flex-grow:1;
}
main.sub .nav{
  margin:40px 0 20px 0;
}
main.sub .nav a{
  display:block;
  line-height:40px;
  background-color: #00a0e8;
  color:#fff;
  border-radius:20px;
  text-align:center;
  margin: 10px;
}
main.sub .nav a.return{
  margin-top:20px;
  background-color:#b4d0ed;
}
/** パンくずリスト **/
ul.breadcrumb {
  display:flex;
  list-style: none;
}
ul.breadcrumb li{
font-size:12px;
}
ul.breadcrumb li:after{/* >を表示*/
  content: '>';
  padding: 0 3px;
  color: #555;
}
.breadcrumb li:last-child:after{
  content: '';
}
.breadcrumb li a {
  text-decoration: none;
  color:#6c5445;
}

/** フッター **/
footer p{ 
  font-size:12px;
  text-align:center;
  color:#fff;
  margin-bottom:2px;
 }

/** フロート解除 **/
.clearfix:after{ 
  display:block;
  clear:both;
  height:0px;
  visibility:hidden;
  content:".";
 }

.clearfix{ 
  min-height:1px;
}

* html .clearfix{ 
  height: 1px;
  height: auto;
  overflow: hidden;
}

/** 768px 以上 **/
@media (min-width:768px){ 
  header > .inner, main > .inner{
    width:768px;
    margin-left:auto;
    margin-right:auto;
 }
}