@charset "UTF-8";
/* font
   ========================================================================== */
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
body {
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans Japanese", "¥Ò¥é¥®¥Î½Ç¥´ ProN W3", Hiragino Kaku Gothic ProN, Arial, Meiryo, sans-serif;
  color: #655858;
  line-height: 1.7; }

/* common
   ========================================================================== */
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

section {
  clear: both; }

figure {
  margin: 0; }

img {
  max-width: 100%; }

a {
  text-decoration: none;
  -webkit-transition: all  0.3s ease;
  transition: all  0.3s ease; }

section:before, section:after {
  content: "";
  display: table; }

section:after {
  clear: both; }

a.icon {
  display: inline-block;
  padding-left: 13px;
  background: url(/sapa/common/pasar/img/icn_link_arrow_sapa_01.png) no-repeat 0 0.4em; }

p {
  margin-top: 0; }

/* layout
   ========================================================================== */
.container {
  max-width: 1070px;
  margin: 0 auto; }
  .container.wide {
    max-width: 1280px; }

@media screen and (max-width: 767px) {
  .container {
    padding: 0 10px; } }

@media print, screen and (min-width: 768px) {
  .main {
    float: left;
    width: 72%; }
  .aside {
    float: right;
    width: 26.16%; } }

/* header
   ========================================================================== */
header {
  background-image: url(/sapa/common/pasar/img/bg_header.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center bottom;
  position: relative;
  z-index: 9;
  color: white; }
  header ul {
    list-style: none;
    padding: 0; }

.header-logo {
  position: absolute;
  top: 10px;
  left: 10px;
  margin: 0; }

.header-navi {
  width: 100%; }

.header-menu a {
  color: #fff;
  display: block;
  position: relative;
  display: inline-block;
  text-decoration: none; }
  .header-menu a span {
    display: block; }

@media screen and (min-width: 480px) {
  .header-navi {
    max-width: 80%; } }

@media screen and (min-width: 600px) {
  .header-navi {
    max-width: 60%; } }

@media screen and (max-width: 767px) {
  header {
    height: 100px; }
    header .container {
      z-index: 1;
      position: relative;
      padding: 0; }
  .header-logo {
    max-width: 120px; }
    .header-logo a:hover {
      opacity: .8; }
  .sp-menu-btn {
    position: absolute;
    top: 5px;
    right: 10px;
    padding-right: 20px;
    cursor: pointer;
    -webkit-transition: .3s;
    transition: .3s;
    z-index: 12; }
    .sp-menu-btn span {
      display: block;
      position: absolute;
      top: 50%;
      right: 0;
      width: 14px;
      height: 2px;
      margin: -1px 0 0 -7px;
      background: white;
      -webkit-transition: .2s;
      transition: .2s; }
      .sp-menu-btn span:before, .sp-menu-btn span:after {
        display: block;
        content: "";
        position: absolute;
        top: 50%;
        right: 0;
        width: 14px;
        height: 2px;
        background: white;
        -webkit-transition: .3s;
        transition: .3s; }
      .sp-menu-btn span:before {
        margin-top: -6px; }
      .sp-menu-btn span:after {
        margin-top: 4px; }
    .sp-menu-btn.close {
      color: transparent; }
      .sp-menu-btn.close span {
        background: transparent; }
        .sp-menu-btn.close span:before, .sp-menu-btn.close span:after {
          margin-top: 0;
          top: 10px; }
        .sp-menu-btn.close span:before {
          width: 30px;
          transform: rotate(-45deg);
          -webkit-transform: rotate(-45deg); }
        .sp-menu-btn.close span:after {
          width: 30px;
          transform: rotate(-135deg);
          -webkit-transform: rotate(-135deg); }
  .header-navi {
    position: absolute;
    right: 0;
    font-weight: 400;
    line-height: 1.3;
    background: #00a73c;
    padding: 50px 15px 20px;
    display: none;
    z-index: 10; }
  .header-menu > li {
    padding: 7px 0;
    border-bottom: 1px solid #fff;
    min-height: 1.3;
    position: relative;
    font-size: .9em; }
    .header-menu > li span {
      font-size: 1.2em; }
    .header-menu > li:first-child {
      border-top: 1px solid #fff; }
    .header-menu > li ul {
      margin: 5px 2px;
      display: none; }
      .header-menu > li ul li {
        position: relative;
        padding-left: 15px;
        margin-bottom: 3px; }
        .header-menu > li ul li:before {
          content: '◇';
          display: inline-block;
          color: white;
          font-size: .5em;
          margin-right: 3px;
          opacity: .8;
          position: absolute;
          top: 5px;
          left: 0; }
  .sp-submenu-btn {
    position: absolute;
    top: 15px;
    right: 0;
    cursor: pointer;
    font-size: 0.95em !important; }
    .sp-submenu-btn:before {
      content: '▼';
      margin-right: 3px;
      font-size: .8em; }
    .sp-submenu-btn.close:before {
      content: '▲'; }
  .header-sns li {
    display: inline-block;
    max-width: 25px; }
    .header-sns li:first-child {
      margin-right: 5px; }
  .header-sns a img {
    max-width: 100%; } }

@media print, screen and (min-width: 768px) {
  header {
    height: 140px;
    white-space: nowrap; }
    header .container {
      z-index: 1;
      padding: 15px 7.5% 0 18.5%;
      position: relative; }
  .header-logo {
    width: 17%;
    max-width: 230px; }
    .header-logo a:hover {
      opacity: .8; }
  .sp-menu-btn,
  .sp-submenu-btn {
    display: none; }
  .header-navi {
    max-width: 100%;
    text-align: center;
    margin: 2px auto;
    font-weight: 500;
    line-height: 1.3;
    display: block !important; }
  .header-menu {
    margin: 0;
    display: table;
    margin: auto;
    font-size: .85em;
    width: 100%; }
    .header-menu li {
      display: table-cell;
      vertical-align: middle; }
      .header-menu li:first-child {
        display: none; }
      .header-menu li ul {
        display: none; }
    .header-menu a::after {
      content: '';
      position: absolute;
      top: 50%;
      left: 0;
      width: 100%;
      height: 1px;
      -webkit-transform: scaleX(0);
              transform: scaleX(0);
      background-color: white;
      -webkit-transition: all .3s ease;
      transition: all .3s ease; }
    .header-menu a:hover::after {
      -webkit-transform: scaleX(1);
              transform: scaleX(1); }
  .header-sns {
    position: absolute;
    top: 0;
    right: 0;
    text-align: right;
    width: 7%; }
    .header-sns li {
      width: 50%;
      display: inline-block;
      max-width: 35px; }
    .header-sns img {
      max-width: 100%; } }

@media screen and (min-width: 980px) {
  header {
    height: 160px; }
  .header-menu {
    width: auto;
    font-size: .95em; }
    .header-menu li {
      padding: 0 20px 0 0; }
  .header-sns li:first-child {
    margin-right: 5px; } }

@media screen and (min-width: 1180px) {
  header {
    height: 190px; }
  .header-menu {
    font-size: 1em; }
    .header-menu li {
      padding: 0 30px 0 0; } }

/* mainvisual
   ========================================================================== */
#mainvisual {
  position: absolute;
  top: 0;
  width: 100%;
  height: 300px; }
  #mainvisual:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 50%;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(white));
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), white);
    z-index: -1; }
  #mainvisual .slide {
    z-index: -2;
    height: 300px; }

#catchphrase {
  font-family: Georgia, 'Hiragino Mincho ProN', 'Yu Mincho', serif;
  font-weight: 600;
  margin-top: 200px; }

@media screen and (min-width: 600px) {
  #mainvisual {
    height: 410px; }
    #mainvisual .slide {
      height: 410px; }
  #catchphrase {
    margin-top: 300px;
    color: black; } }

@media print, screen and (min-width: 768px) {
  #mainvisual {
    height: 510px; }
    #mainvisual .slide {
      height: 510px; }
  #catchphrase {
    color: #fff;
    font-size: 1.2em;
    line-height: 2;
    margin-top: 0px;
    position: relative;
    z-index: 1;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
    margin-bottom: 180px; } }

@media screen and (min-width: 980px) {
  #mainvisual {
    height: 710px; }
    #mainvisual .slide {
      height: 710px; }
  #catchphrase {
    margin-bottom: 280px; } }

@media screen and (min-width: 1180px) {
  #mainvisual {
    height: 810px; }
    #mainvisual .slide {
      height: 810px; }
  #catchphrase {
    margin-bottom: 380px; } }

/* mainvisual
   ========================================================================== */
#mainvisual-shop {
  width: 100%; }
  #mainvisual-shop .slider {
    height: 300px; }
    #mainvisual-shop .slider .slide {
      height: inherit; }

@media screen and (max-width: 767px) {
  #mainvisual-shop {
    position: relative;
    margin-top: 30px; } }

@media print, screen and (min-width: 768px) {
  #mainvisual-shop {
    position: absolute;
    top: 0;
    max-width: 649px;
    width: 100%;
    padding-left: 10px; }
    #mainvisual-shop .slider {
      height: 747px; }
      #mainvisual-shop .slider .slide {
        height: inherit; } }

/* slider
   ========================================================================== */
.slider .slide {
  width: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: absolute; }
  .slider .slide:not(:first-child) {
    display: none; }

/* information-index
   ========================================================================== */
#info-index .col {
  padding: 0 10px 20px; }

#info-index .info-entry {
  background: #fff;
  position: relative;
  padding: 13px 13px 5px; }

#info-index a {
  display: block; }
  #info-index a:hover {
    opacity: .8; }

#info-index figure {
  width: 100%;
  overflow: hidden;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  margin-bottom: .3em;
  height: 180px; }
  #info-index figure img {
    display: none; }

#info-index .entry-cat {
  position: absolute;
  top: 0;
  left: 0; }

#info-index .entry-title {
  font-size: 1em;
  color: #9bc88c;
  line-height: 1.6em;
  border-bottom: 1px solid #ccc;
  margin: 0;
  padding-bottom: 5px; }

#info-index .entry-date {
  text-align: right;
  margin: 5px 0 2px;
  color: #4c4c4c;
  font-size: .8em; }

@media screen and (max-width: 479px) {
  #info-index .col {
    float: none;
    width: 100%; } }

@media screen and (max-width: 767px) {
  #info-index .col:nth-child(2n+1) {
    clear: both; } }

@media print, screen and (min-width: 768px) {
  #info-index .col:nth-child(3n+1) {
    clear: both; } }

@media screen and (min-width: 980px) {
  #info-index figure {
    height: 230px; } }

/* shopguide-index
   ========================================================================== */
@media screen and (max-width: 767px) {
  #shopguide-navi {
    display: none; } }

@media print, screen and (min-width: 768px) {
  #shopguide-navi {
    clear: both;
    border: 1px solid #ccc;
    padding: 10px;
    position: relative;
    margin: 30px 0; }
    #shopguide-navi h3 {
      color: #61c084;
      font-size: 3em;
      margin: 0;
      float: left;
      font-weight: 900;
      margin: 0 20px 10px 0; }
    #shopguide-navi p {
      margin: 10px; }
  .shopguide-container {
    width: 100%;
    overflow: hidden;
    margin-bottom: 20px;
    height: auto !important; }
    .shopguide-container.colse {
      margin-bottom: 20px; }
  .more-shop {
    display: none;
    -webkit-animation: fadein 0.5s linear 0s 1; }
  .more-shop p {
    padding: 10px 0 0; }
  @-webkit-keyframes fadein {
    0% {
      opacity: 0; }
    100% {
      opacity: 1; } }
  .more-out {
    display: none;
    -webkit-animation: fadeout 0.5s linear 0s 1; }
  @-webkit-keyframes fadeout {
    0% {
      opacity: 1; }
    100% {
      opacity: 0; } }
  .shopguide-list {
    clear: both;
    padding: 0;
    margin: 0; }
    .shopguide-list li {
      float: left;
      width: 11.1%;
      list-style: none;
      padding: 0 4px 0px 4px;
      margin-bottom: 20px; }
      .shopguide-list li:nth-child(9n+1) {
        clear: both; }
    .shopguide-list a {
      color: #717271;
      display: block; }
      .shopguide-list a:hover {
        opacity: .8; }
    .shopguide-list figure {
      width: 100%; }
    .shopguide-list img {
      max-width: 100%;
      height: auto; }
    .shopguide-list h4 {
      margin: 3px 0;
      font-size: .9em;
      font-weight: 500;
      line-height: 1.5; }
  .shopguide-button {
    width: 60px;
    height: 60px;
    background: #87d7a4;
    position: absolute;
    bottom: -30px;
    left: 0;
    right: 0;
    margin: auto;
    border-radius: 50%;
    border: 3px solid #fff;
    -webkit-box-shadow: 0 0 0 1px #cccccc;
            box-shadow: 0 0 0 1px #cccccc;
    cursor: pointer;
    -webkit-transition: .7s;
    transition: .7s; }
    .shopguide-button:after {
      content: '';
      display: block;
      width: 20px;
      height: 20px;
      border-right: 2px solid #fff;
      border-bottom: 2px solid #fff;
      position: absolute;
      top: 11px;
      left: 0;
      right: 0;
      margin: auto;
      -webkit-transform: rotate(45deg);
              transform: rotate(45deg);
      cursor: pointer; }
    .shopguide-button:hover {
      opacity: .8; }
    .shopguide-button.close {
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg); } }

.shoplist {
  border-top: 1px solid #e5e5e5;
  margin-bottom: 30px; }
  .shoplist ul {
    padding: 0;
    font-size: .8em;
    line-height: 1.3;
    margin: 0; }
  .shoplist li {
    border-bottom: 1px solid #e5e5e5;
    padding: 5px 0;
    list-style: none; }
    .shoplist li a {
      color: #655858; }

@media screen and (max-width: 767px) {
  .shoplist ul {
    width: 50%;
    float: left;
    padding: 0 5px; }
    .shoplist ul li:first-child {
      border-top: 1px solid #e5e5e5; } }

/* facilities
   ========================================================================== */
@media print, screen and (min-width: 768px) {
  .facilities-main {
    width: 70%;
    float: left; }
  .facilities-side {
    width: 28.1%;
    float: right; } }

/* pasar-nav
   ========================================================================== */
#pasar-navi {
  background: #95cd7e;
  border-bottom: 5px solid #3ea41c;
  padding: 10px 0 10px;
  margin-top: 50px;
}
  #pasar-navi .container {
    max-width: 1084px
   }
  #pasar-navi a {
    text-decoration: none;
    color:#FFF;
    display: block;
   }
   #pasar-navi p.area_road{
     font-size: 0.9em;
     margin: 0;
   }
   #pasar-navi p.area_name{
     margin: 0;
   }
  #pasar-navi a:hover {
      opacity: .8;
    }
@media screen and (min-width:640px){
  #pasar-navi .container {
    display: flex;
    justify-content: space-between;
    /*flex-wrap: wrap;*/
    margin-top: 30px;
   }
  #pasar-navi .container:after{
    content: "";
    display: block;
    height: 0;
    /*width:24%;*/
  }
  #pasar-navi .col {
    /*width:24%;*/
    margin-bottom: 30px;
    margin-left:7px;
    margin-right: 7px;
  }
  #pasar-navi a {
    justify-content: space-between;
   }
  /*#pasar-navi a > figure {
    width:46%;
  }
  #pasar-navi a > div.area_info{
    width:50%;
  }*/
  
}

@media screen and (max-width: 639px) {
  #pasar-navi{
    padding: 0;
  }
  #pasar-navi .container {
    margin:0 -10px;
    padding: 0;
  }
  #pasar-navi .col {
    /*width: 50%; */
    width: 100%;
    float: none;
    border-bottom:1px solid #b1d6a1;
  } 
  #pasar-navi .col:first-child{
    border-top:1px solid #b1d6a1;
  }
  #pasar-navi a {
    display: flex;
    align-items: center;
   }
  #pasar-navi a > figure {
    width:80px;
    line-height: 0;
  }
  #pasar-navi p{
    display: inline-block;
  }
  #pasar-navi p.area_road{
    margin-right: 0.5em;
  }
  #pasar-navi a > div.area_info{
    text-align: left;
    /*width:50%;*/
  }
  #pasar-navi a figure{
    margin-right: 10px;
  }
}

/* footer
   ========================================================================== */
footer {
  clear: both; }

.footer-logo {
  max-width: 200px; }

.footer-copy {
  margin: 0 0 5px; }

.footer-logo:hover {
  opacity: .8; }

.footer-right a {
  color: #9bc88c;
  position: relative;
  display: inline-block;
  text-decoration: none; }
  .footer-right a:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    background-color: #9bc88c;
    -webkit-transition: all .3s ease;
    transition: all .3s ease; }
  .footer-right a:hover::after {
    -webkit-transform: scaleX(1);
            transform: scaleX(1); }

@media screen and (max-width: 767px) {
  footer {
    font-size: .7em; }
    footer .container {
      padding: 15px 10px; }
    footer > div {
      float: none;
      width: 100%;
      text-align: center; }
    footer p {
      margin: 0px; }
  .footer-logo {
    margin: 0 auto 5px; } }

@media print, screen and (min-width: 768px) {
  footer {
    font-size: .8em; }
    footer .container {
      padding: 15px 0;
      display: table;
      width: 100%; }
  .footer-copy {
    margin: 10px 0 5px; }
    .footer-copy p {
      margin: 0; }
  .footer-left {
    display: table-cell;
    min-width: 320px; }
  .footer-right {
    display: table-cell;
    text-align: right; }
    .footer-right p {
      margin: 10px 0 5px; }
  .footer-logo-top {
    margin: 10px auto 5px;
    text-align: center;
    display: table-caption; } }

/* BLOG
   ========================================================================== */
@media print, screen and (min-width: 768px) {
  .blog-main {
    padding-right: 20px; }
  .blog-side {
    margin-top: 41px; } }

.blog-entries {
  list-style: none;
  padding: 0;
  font-size: .9em; }
  .blog-entries li {
    position: relative;
    margin-bottom: 5px;
    float: left;
    clear: both;
    width: 100%; }
    .blog-entries li .left {
      width: 40%; }
      .blog-entries li .left img {
        width: 100%; }
    .blog-entries li .right {
      width: 60%;
      padding: 0 0 1.5em 5px; }
      .blog-entries li .right .category {
        background: #b2b2b2;
        color: white;
        text-align: center;
        font-size: .9em; }
      .blog-entries li .right .date {
        position: absolute;
        bottom: 0;
        font-size: .9em; }

@media print, screen and (min-width: 768px) {
  .blog-entries {
    padding-top: 20px; } }

.blog-categories {
  border: 1px solid #ccc;
  list-style: none;
  padding: 10px;
  font-size: .9em; }
  .blog-categories li a {
    color: #5d5d5d; }
    .blog-categories li a:hover {
      color: #25ad55; }

/* module
   ========================================================================== */
.icon-arrow {
  position: relative;
  padding-left: 18px; }
  .icon-arrow:before {
    content: '';
    position: absolute;
    left: 0;
    top: 2px;
    width: 15px;
    height: 15px;
    background: #87d7a4;
    line-height: inherit; }
  .icon-arrow:after {
    content: '';
    display: block;
    width: 5px;
    height: 5px;
    border-bottom: 1px solid #fff;
    border-right: 1px solid #fff;
    position: absolute;
    top: 7px;
    left: 3px;
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg); }

.bg-content {
  position: relative; }
  .bg-content:after {
    content: '';
    display: block;
    width: 100%;
    height: 600px;
    background-image: url(/sapa/common/pasar/img/bg_content.png);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center bottom;
    position: absolute;
    bottom: 0;
    z-index: -1; }
  .bg-content.top {
    padding-top: 30px; }
    .bg-content.top:after {
      -webkit-transform: rotate(-180deg);
              transform: rotate(-180deg);
      top: 0; }
    @media screen and (max-width: 767px) {
      .bg-content.top {
        margin-top: 30px; } }
    @media print, screen and (min-width: 768px) {
      .bg-content.top {
        padding-top: 100px; } }
  .bg-content.bottom {
    margin-bottom: 30px; }
    @media print, screen and (min-width: 768px) {
      .bg-content.bottom {
        margin-bottom: 60px; } }

.pickup-box {
  border: 3px solid #fda202;
  margin-bottom: 5px; }
  .pickup-box .pickup-title {
    background: #fda202;
    color: white;
    margin: 0;
    padding: 0 4px 0 0;
    float: left;
    width: 100%; }
  .pickup-box .cat {
    text-align: right;
    font-size: 0.7em;
    float: right;
    width: 40%; }
  .pickup-box .pickup-img {
    clear: both;
    padding: 5px;
    text-align: center; }
  .pickup-box .pickup-txt {
    font-size: .8em;
    padding: 10px; }

.blog-title .entry-title {
  margin-bottom: 0;
  border-bottom: 2px solid #25ad55;
  padding: 0 0 10px;
  margin: 0 0 10px; }

.blog-title .category {
  background: #87d7a4;
  color: #fff;
  display: inline-block;
  padding: 0 15px;
  border-radius: 5px;
  font-weight: 500;
  font-size: 1.2em;
  line-height: 1.6;
  margin-bottom: 5px; }

.blog-title .date {
  text-align: right;
  margin-bottom: 5px; }

.page-navi {
  text-align: center; }
  .page-navi a {
    display: inline-block;
    background: #3e010d;
    color: white;
    padding: 0 25px;
    border-radius: 20px;
    margin: 30px 5px; }

/* headline
   ========================================================================== */
.breadcrumbs {
  font-size: 0.8em;
  margin: 0 0 20px; }
  .breadcrumbs a {
    color: #000; }

@media screen and (max-width: 479px) {
  .breadcrumbs {
    margin: 0 0 10px; } }

.section-title {
  font-size: 1.7em;
  text-align: center;
  color: #87d7a4;
  margin-bottom: 2em;
  font-weight: bold;
  line-height: 1.2; }
  .section-title span {
    display: block;
    color: #655858;
    font-size: .8em;
    font-weight: 600; }

.entry-title {
  font-size: 2em;
  line-height: 1.1em;
  color: #25ad55;
  margin: 0; }

.shop-entry {
  min-height: 650px; }

@media screen and (max-width: 479px) {
  .shop-entry {
    min-height: auto; } }

.contents .cont_h2_cafe, .contents .cont_h2_souvenir, .contents .cont_h2_gas, .contents .cont_h2_chargestation, .contents .cont_h2_life, .contents .cont_h2_hotel, .contents .cont_h2_medical, .contents .cont_h2_barrierfree, .contents .cont_h2_etc, .contents .cont_h2_child, .contents .cont_h2_pet {
  padding-top: 2px;
  padding-left: 42px;
  min-height: 30px;
  font-size: 1.3em; }

.contents .cont_h2_cafe {
  background: url(/sapa/common/pasar/img/icn_h2_cafe.png) no-repeat 0 0; }

.contents .cont_h2_souvenir {
  background: url(/sapa/common/pasar/img/icn_h2_souvenir.png) no-repeat 0 0; }

.contents .cont_h2_gas {
  background: url(/sapa/common/pasar/img/icn_h2_gas.png) no-repeat 0 0; }

.contents .cont_h2_chargestation {
  background: url(/sapa/common/pasar/img/icn_h2_chargestation.png) no-repeat 0 0; }

.contents .cont_h2_life {
  background: url(/sapa/common/pasar/img/icn_h2_life.png) no-repeat 0 0; }

.contents .cont_h2_hotel {
  background: url(/sapa/common/pasar/img/icn_h2_hotel.png) no-repeat 0 0; }

.contents .cont_h2_medical {
  background: url(/sapa/common/pasar/img/icn_h2_medical.png) no-repeat 0 0; }

.contents .cont_h2_barrierfree {
  background: url(/sapa/common/pasar/img/icn_h2_barrierfree.png) no-repeat 0 0; }

.contents .cont_h2_etc {
  background: url(/sapa/common/pasar/img/icn_h2_etc.png) no-repeat 0 0; }

.contents .cont_h2_child {
  background: url(/sapa/common/pasar/img/icn_h2_child.png) no-repeat 0 0; }

.contents .cont_h2_pet {
  background: url(/sapa/common/pasar/img/icn_h2_pet.png) no-repeat 0 0; }

/* ¥µ¥¤¥É¥¨¥ê¥¢
======================================================= */
/* Çéˆó¥¨¥ê¥¢ */
.contents .cont_information {
  border: 1px solid #DDDDDD;
  border-radius: 6px;
  font-size: 0.8em;
  background: #fff; }

.contents .cont_information .cont_information-text {
  padding: 9px;
  border-bottom: 1px solid #DDDDDD; }

.contents .cont_information .cont_information-text h2 {
  margin: 20px 0 0;
  font-size: 114.2%;
  line-height: 1.2; }

.contents .cont_information .cont_information-text p {
  margin: 5px 0 0; }

.contents .cont_information dl {
  margin: 15px 0;
  padding: 0 15px 0 56px;
  min-height: 32px;
  line-height: 1.4; }

.contents .cont_information dt {
  color: #907B4A; }

.contents .cont_information dd {
  margin: 0; }

.contents .cont_information .cont_information-info {
  background: url(/sapa/common/pasar/img/icn_info.png) no-repeat 15px 0; }

.contents .cont_information .cont_information-park {
  background: url(/sapa/common/pasar/img/icn_park.png) no-repeat 15px 0; }

.contents .cont_information .cont_information-toilet {
  background: url(/sapa/common/pasar/img/icn_toilet.png) no-repeat 15px 0; }

.contents .cont_information .cont_information-handicap {
  background: url(/sapa/common/pasar/img/icn_handicap.png) no-repeat 15px 0; }

.contents .cont_information .cont_information-link {
  margin-top: 0;
  padding: 9px;
  border-top: 1px solid #DDDDDD;
  text-align: right; }

@media screen and (max-width: 767px) {
  .contents .cont_information-map {
    margin-left: auto;
    margin-right: auto;
    max-width: 280px; } }

/* roadmap */
.contents .cont_roadmap {
  margin-top: 10px;
  border: 1px solid #DDDDDD;
  border-radius: 6px;
  line-height: 1.2;
  font-size: 0.8em;
  background: #fff; }

.contents .cont_roadmap h2 {
  margin-top: 0;
  padding: 12px 14px 10px 14px;
  border-bottom: 2px solid #9cb71e;
  font-size: 114.2%;
  line-height: 1.2; }

.contents .cont_roadmap .cont_roadmap-body {
  padding: 15px;
  overflow: hidden; }

.contents .cont_roadmap h3 {
  margin-top: 18px;
  padding: 10px 10px 8px 10px;
  border-bottom: 2px solid #9cb71e;
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
  background-color: #f4f8e1;
  text-align: center; }

.contents .cont_roadmap .cont_roadmap-direction {
  margin-top: 10px;
  padding: 0;
  padding-bottom: 10px;
  border-bottom: 1px solid #E5E5E5; }

.contents .cont_roadmap .cont_roadmap-direction:before,
.contents .cont_roadmap .cont_roadmap-direction:after {
  content: "";
  display: table; }

.contents .cont_roadmap .cont_roadmap-direction:after {
  clear: both; }

.contents .cont_roadmap .cont_roadmap-direction li {
  margin: 0;
  padding: 0;
  list-style: none;
  float: left;
  width: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
  font-weight: bold; }

.contents .cont_roadmap .cont_roadmap-direction .cont_roadmap-prev {
  padding: 0 3px 0 20px;
  background: url(/sapa/common/pasar/img/icn_arrow_prev.png) no-repeat 0 50%; }

.contents .cont_roadmap .cont_roadmap-direction .cont_roadmap-next {
  padding: 0 20px 0 3px;
  background: url(/sapa/common/pasar/img/icn_arrow_next.png) no-repeat 100% 50%; }

.contents .cont_roadmap .cont_roadmap-arrow {
  margin: 10px -6px 0 -6px;
  padding: 0; }

.contents .cont_roadmap .cont_roadmap-arrow li {
  margin: 0;
  padding: 0;
  list-style: none;
  float: left;
  width: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

.contents .cont_roadmap .cont_roadmap-arrow li img {
  max-width: 100%;
  height: auto; }

.contents .cont_roadmap .cont_roadmap-arrow .cont_roadmap-prev {
  padding-right: 3px; }

.contents .cont_roadmap .cont_roadmap-arrow .cont_roadmap-next {
  padding-left: 3px;
  text-align: right; }

.contents .cont_roadmap .cont_roadmap-ic {
  margin-top: 15px;
  padding: 0 0 10px 0;
  border-bottom: 2px solid #E5E5E5; }

.contents .cont_roadmap .cont_roadmap-ic li {
  margin: 0;
  padding: 0;
  list-style: none;
  padding: 0 3px;
  float: left;
  width: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center; }

/* add 20160205 szk*/
.contents .cont_roadmap .cont_roadmap_ic {
  margin-top: 15px;
  padding: 0 0 10px 0;
  border-bottom: 2px solid #E5E5E5; }

.contents .cont_roadmap .cont_roadmap_ic:after {
  content: "";
  display: block;
  clear: both; }

.contents .cont_roadmap .cont_roadmap_ic .cont_roadmap-ic_prev, .contents .cont_roadmap .cont_roadmap_ic .cont_roadmap-ic_next {
  margin: 0;
  padding: 0;
  width: 50%;
  float: left; }

.contents .cont_roadmap .cont_roadmap_ic li {
  margin: 0;
  padding: 0;
  list-style: none;
  padding: 0 3px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center; }

/* /add 20160205 szk*/
.contents .cont_roadmap h4 {
  margin-top: 15px;
  text-align: center;
  position: relative; }

.contents .cont_roadmap h4 span {
  display: inline-block;
  padding: 7px 30px 5px 30px;
  background-color: #f4f8e1;
  border: 2px solid #9cb71e; }

.contents .cont_roadmap h4:after {
  content: "";
  width: 10px;
  height: 6px;
  background: url(/sapa/common/pasar/img/bg_cont_roadmap_h4.png) no-repeat 0 0;
  position: absolute;
  bottom: -6px;
  left: 50%;
  margin-left: -5px; }

.contents .cont_roadmap .cont_roadmap-sapa ul {
  margin: 0 0 -10px 0;
  padding: 0;
  width: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

.contents .cont_roadmap .cont_roadmap-sapa li {
  margin: 0;
  padding: 0;
  list-style: none;
  padding: 10px 0;
  border-top: 1px dashed #CCC;
  line-height: 1.6; }

.contents .cont_roadmap .cont_roadmap-sapa li:first-child {
  border-top: 0; }

.contents .cont_roadmap .cont_roadmap-sapa li span {
  display: block; }

.contents .cont_roadmap .cont_roadmap-sapa a {
  font-weight: bold; }

.contents .cont_roadmap .cont_roadmap-sapa a:hover {
  text-decoration: underline; }

.contents .cont_roadmap .cont_roadmap-sapa .cont_roadmap-sapa_prev {
  float: left;
  padding-right: 3px; }

.contents .cont_roadmap .cont_roadmap-sapa .cont_roadmap-sapa_next {
  float: right;
  padding-left: 3px; }

.contents .cont_roadmap .cont_roadmap-sapa .cont_roadmap-sapa_next li {
  padding-left: 10px; }

.contents .cont_roadmap .cont_roadmap-sapa .cont_roadmap-sapa_small {
  padding-left: 13px;
  font-size: 85.7%; }

@media screen and (max-width: 767px) {
  .contents .cont_roadmap h3 {
    margin-top: 0; } }

/* print
   ========================================================================== */
@page {
  size: A4;
  margin: 10mm; }

@media print {
  .header-logo {
    max-width: 100px; }
  .header-menu {
    font-size: .75em; }
  header .container {
    padding-left: 15%; }
  .bg-content.top {
    padding-top: 50px; } }