@charset "UTF-8";



/* --------------------　アクセス　-------------------- */


/*駅アクセス：アコーディオン リセット*/

#access section#slideBl2 .ui-accordion .ui-accordion-content{
padding:20px 10px 20px;
border:0;
line-height:auto;
max-width:100%;
}

#access section#slideBl2 .ui-helper-reset {
  line-height: 1.6;
  font-size: 100%;
  list-style: none;
  font-weight: 600;
}

#access section#slideBl2 .ui-icon {
  width: 0px;
  height: 0px;
}

#access section#slideBl2 .ui-state-active .ui-icon, .ui-button:active .ui-icon {background-image: none;}
#access section#slideBl2 .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {border-top-right-radius: 0px;}
#access section#slideBl2 .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { border-top-left-radius: 0px;}
#access section#slideBl2 .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {border-bottom-right-radius: 0px;}
#access section#slideBl2 .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {border-bottom-left-radius: 0px;}

#access section#slideBl2 #station-root {
    display: table;
  }
  
#access section#slideBl2 .root {
    font-size: 12px;
  }
  
#access section#slideBl2 .content a,
#access section#slideBl2 .content a:hover,
#access section#slideBl2 .content a:active,
#access section#slideBl2 .content a:visited {
    font-size: 14px;
    line-height: 25px;
    color: #f5f0d7;
  }
  

#access section#slideBl2 dt#rootA,
#access section#slideBl2 dt#rootB,
#access section#slideBl2 dt#rootC,
#access section#slideBl2 dt#rootD,
#access section#slideBl2 dt#rootE,
#access section#slideBl2 dt#rootF,
#access section#slideBl2 dt#rootG,
#access section#slideBl2 dt#rootH,
{
   font-size: 15px;
  border: none;
  background: #df0b4d url("/img/common/ui/accordion_arrow.png") 98% 50% no-repeat;
  font-weight: 700;
  color: #fff;
  margin-top:30px;
}

#access section#slideBl2 dt#rootB .root span.f10{
font-size:10px;
}

/*
#access section#slideBl2 dt#rootB{
   font-size: 15px;
  border: none;
  background: #e99e10 url("/img/common/ui/accordion_arrow.png") 98% 50% no-repeat;
  font-weight: 700;
  color: #fff;
}

#access section#slideBl2 dt#rootC{
   font-size: 15px;
  border: none;
  background: #144ad0 url("/img/common/ui/accordion_arrow.png") 98% 50% no-repeat;
  font-weight: 700;
  color: #fff;
}
*/

#access section#slideBl2.accordion ul{
    display:flex;
      flex-direction:column;
      background:#ddd;
      width: 100%;
      height:auto;
      padding:10px;
}

#access section#slideBl2 .accordion ul li,
#access section#slideBl2 .accordion ul li.set{
    width:90%;
    font-size:12px;
    line-height: 1.6;
    margin: 0 auto;
}

#access section#slideBl2 .accordion ul li.set .hold{display: block;}

#access section#slideBl2 .accordion ul li img{
    width:100%;
    margin-bottom:8px;
    text-align: center;
}

#access section#slideBl2 .accordion ul li img.no-margin{
    width:100%;
    margin-bottom:0px;
    text-align: center;
}

#access section#slideBl2 .accordion ul li.set .or{
    width:auto;
    padding-top:10px;
    text-align: center;
}

#access section#slideBl2 .accordion ul li.set .photo{
    width:auto;
}

#access section#slideBl2 .accordion ul li.set .or img{ width:26px;}

#access section#slideBl2 .accordion ul li.set .txt{ display: block;}
#access section#slideBl2 .accordion ul li.arrow{
    width:100%;
    height: 40px;
    text-align:center;
    background:url(/yokohama/img/access/station/arrow_sp.png)  top no-repeat;
    background-position: 50% 50%;
}

#access section#slideBl2 .accordion ul li.or{
    width:100%;
    text-align:center;
    background:url(/yokohama/img/access/station/arrow_or.png)  top no-repeat;
    background-position: 50% 50%;
}

#access section#slideBl2 .accordion ul li.arrow img{
    width:17px;
    padding-top:10px;
}

#access section#slideBl2 .accordion .info { font-size: 12px;}


/* 駅アクセス：追加要素 */

#access section#slideBl2 .accordion {
  margin: 3em auto;
  /*max-width: 60vw;　　SP時の横幅制限の解除*/
}
#access section#slideBl2 .toggle {
  display: none;
}
#access section#slideBl2 .option {
  position: relative;
  margin-bottom: 1em;
}
#access section#slideBl2 .title,
#access section#slideBl2 .content {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform: translateZ(0);
  transition: all 0.3s;
}

#access section#slideBl2 .title {
  /*border: solid 1px #ccc;*/
  padding: 1em 2em 1em 1em;
  color: #fff;
  background-color: #638fa2;
  font-weight: bold;
  min-height: 45px;
  display: flex;
  align-items: center;
}

#access section#slideBl2 .title::after,
#access section#slideBl2 .title::before {
  content: "";
  position: absolute;
  right: 1.25em;
  /*top: 2em;*/
  top: 3em;
  width: 2px;
  height: 1em;
  color: #fff;
  background-color: #fff;
  transition: all 0.3s;
}
#access section#slideBl2 .title::after {
  transform: rotate(90deg);
}

#access section#slideBl2 .title .root {
  width: 80px;
  font-size: 14px;
  padding: 0px 5px 5px;
  margin-right: 0.5em;
  color: #fff;
  background-color: #000;
  border-radius: 8px;
  float: left;
  text-align: center;
  line-height: 1.3;
  }

#access section#slideBl2 .title .root span{
  font-size:10px;
}

#access section#slideBl2 .content {
  max-height: 0;
  overflow: hidden;
  color: #fff;
  background-color: #638fa2;
  margin-bottom: 1em;
  clear: both;
}

#access section#slideBl2 .content p {
  margin: 0;
  padding: 0.5em 1em 1em;
  font-size: 0.9em;
  line-height: 1.5;
  color: yellow;
  padding: 1px 1em 1em;
  font-size: 12px;
}

#access section#slideBl2 .toggle:checked + .title + .content {
  /*max-height: 500px;    SP時の縦長制限の解除*/
  max-height: none;
  transition: all 1.5s;
  /*padding: 10px 10px 30px;*/
  padding: 10px 0 30px;
}
#access section#slideBl2 .toggle:checked + .title::before {
  transform: rotate(90deg) !important;
}

#access section#slideBl2 .link-navi {
line-height: 1.8;
  padding: 15px 0px 0;
  border-top: 1px dotted #fff;
  display: inline-block;
  margin: 10px 20px 0;
}

#access section .rad {
    color:#f00;
}



/*media Queries tab(ipad mini)
----------------------------------------------------*/
@media only screen and (min-width:600px) {

#access section#slideBl2 #slideSet .long {
    max-width: 600px;
    margin: 0 auto;
}

#access section#slideBl2 #slideSet .long2 {
    max-width: 480px;
    margin: 10px auto 0;
}

#access section#slideBl2 .accordion ul li.arrow {
  width: 80%;
  }
  
#access section#slideBl2 #station-root {
    width:100%;
    display: block;
  }
  
#access section#slideBl2 .accordion ul li img{max-width:80%;}
#access section#slideBl2 .accordion ul li.set .hold{ max-width:800px;}
#access section#slideBl2 .accordion ul li{  padding:0 10%;}

#access section#slideBl2 dt#rootB .root span.f10{
font-size:auto;
}

}



/*media Queries PC
----------------------------------------------------*/
@media only screen and (min-width:769px) {


/* --------------------　アクセス　-------------------- */

/* ---------------------　TOPタイトル　*/

#access section#topImg {
	background:url(/yokohama/img/access/h1_bg.jpg) center top no-repeat;
	background-size: cover;
}

section#slideBl2.parking {
	margin-top:20px;
}

#access section#slideBl2 #slideSet .long,
#access section#slideBl2 #slideSet .long2 {
    max-width: 100%;
}

#access section#slideBl2.parking .caption {
    font-size: 14px;
}

#access section#slideBl2 .title {
  padding: 0.8em 2em 0.8em 1em;
  min-height: 40px;
  font-size: 17px;
}


#access section#slideBl2 .title::after,
#access section#slideBl2 .title::before {
  content: "";
  position: absolute;
  right: 1.25em;
  top: 2.4em;
  width: 2px;
  height: 0.75em;
  color: #fff;
  background-color: #fff;
  transition: all 0.3s;
}

#access section#slideBl2 .title .root{
  width: 80px;
  font-size: 14px;
  padding: 0 10px 5px;
  margin-right: 1em;
  color: #fff;
  background-color: #000;
  border-radius: 8px;
  float: left;
  text-align: center;
  line-height: 1.4;
}

#access section#slideBl2 .root {
    font-size: 14px;
  }
  
#access section#slideBl2 .root a {
    font-size: 15px;
    line-height: 30px;
  }

#access section#slideBl2 .content p {
  font-size: 16px;
    padding:0 20px 20px 20px;
}

#access section#slideBl2 dt#rootA{
   background:#df0b4d;
   max-width:1000px;
    font-size: 20px;
    border: none;
    font-weight: 700;
    color: #fff;
    margin: 30px 0 20px 0;
    padding: .5em .5em .5em .7em;
    text-align:center;
}

#access section#slideBl2 dt#rootB{
   background:#e99e10;
   max-width:1000px;
    font-size: 20px;
    border: none;
    font-weight: 700;
    color: #fff;
    margin: 35px 0 20px 0;
    padding: .5em .5em .5em .7em;
    text-align:center;
}

#access section#slideBl2 dt#rootC{
   background:#144ad0;
   max-width:1000px;
    font-size: 20px;
    border: none;
    font-weight: 700;
    color: #fff;
   margin: 35px 0 20px 0;
    padding: .5em .5em .5em .7em;
    text-align:center;
}


#access section#slideBl2 #station-root {
    width:auto;
    display: table;
  }

#access section#slideBl2 .accordion ul{
    display: -webkit-flex;
    display: flex;
    /*max-width:780px;*/
    max-width:960px;
    padding: 0px 20px 10px;
    flex-wrap: nowrap;
    float: left;
}

#access section#slideBl2 .accordion ul li{
    width:160px;
    font-size:12px;
    line-height: 1.6;
    padding:0;
    justify-content: flex-start; /* 左寄せ */
    align-items: flex-start;
}

#access section#slideBl2 .accordion ul li.set{
    width:376px;
    font-size:12px;
    line-height: 1.6;
}

#access section#slideBl2 .accordion ul li.set .hold{
display: flex;
max-width:auto}

#access section#slideBl2 .accordion ul li img{
    width:100%;
    max-width:100%;
   margin-bottom:5px;
}

#access section#slideBl2 .accordion ul li.set .photo{ width:173px;}

#access section#slideBl2 .accordion ul li.set .or{
    width:30px;
    padding-top:80px;
    text-align: center;
}
#access section#slideBl2 .accordion ul li.set .or img{ width:26px;}

#access section#slideBl2 .accordion ul li.set .txt{ display: block;}
#access section#slideBl2 .accordion ul li.arrow{
    width:30px;
    height:164px;
    text-align:center;
    background:url(/yokohama/img/access/station/arrow_pc.png)  top no-repeat;
    background-position: 50% 50%;
}

#access section#slideBl2 .accordion ul li.or{
    width:30px;
    height:164px;
    text-align:center;
    background:url(/yokohama/img/access/station/arrow_or.png)  top no-repeat;
    background-position: 50% 50%;
}

#access section#slideBl2 .accordion ul li.arrow img{
    width:17px;
    padding-top:80px;
}

#access section#slideBl2 .accordion .info { font-size: 10px;}

#access section#slideBl2 .link-navi {
width: 96%;
}


}



/*media Queries PC
----------------------------------------------------*/
@media only screen and (min-width:1000px) {

/* --------------------　アクセス　-------------------- */

/* ---------------------　TOPタイトル　*/

/*
#access section#topImg {
	background:url(/yokohama/img/access/h1_bg.jpg) center top no-repeat;
	background-size: cover;
}

section#slideBl2.parking {
	margin-top:20px;
}

#access section#slideBl2 #slideSet .long,
#access section#slideBl2 #slideSet .long2 {
    max-width: 100%;
}



#access section#slideBl2.parking .caption {
    font-size: 14px;
}
  
#access section#slideBl2 .root a {
    font-size: 18px;
    line-height: 35px;
  }

#access section#slideBl2 dt#rootA{
   background:#df0b4d;
   max-width:1000px;
    font-size: 20px;
    border: none;
    font-weight: 700;
    color: #fff;
    margin: 40px 0 30px 0;
    padding: .5em .5em .5em .7em;
    text-align:center;
}

#access section#slideBl2 dt#rootB{
   background:#e99e10;
   max-width:1000px;
    font-size: 20px;
    border: none;
    font-weight: 700;
    color: #fff;
    margin: 45px 0 30px 0;
    padding: .5em .5em .5em .7em;
    text-align:center;
}

#access section#slideBl2 dt#rootC{
   background:#144ad0;
   max-width:1000px;
    font-size: 20px;
    border: none;
    font-weight: 700;
    color: #fff;
   margin: 45px 0 30px 0;
    padding: .5em .5em .5em .7em;
    text-align:center;
}

#access section#slideBl2 .accordion ul{
    display: flex;
    max-width:960px;
    padding: 0px 20px 20px;
    flex-wrap: nowrap;
    float: left;
}

/*.boxに指定したwidthと同じ幅を指定する
#access section#slideBl2 .accordion ul:after{
    content: "";
    display: block;
     width:190px;
    height: 0;
}
*/

#access section#slideBl2 .accordion ul li{
    width:200px;
    font-size:14px;
    line-height: 1.6;
}

#access section#slideBl2 .accordion ul li.set{
    width:480px;
    font-size:14px;
    line-height: 1.6;
}

#access section#slideBl2 .accordion ul li.set .hold{display: flex;}

#access section#slideBl2 .accordion ul li img{
    width:200px;
   margin-bottom:5px;
}

#access section#slideBl2 .accordion ul li.set .photo{ width:220px;}

#access section#slideBl2 .accordion ul li.set .or{
    /*width:40px;*/
    padding-top:80px;
    text-align: center;
}
#access section#slideBl2 .accordion ul li.set .or img{ width:60px;}

#access section#slideBl2 .accordion ul li.set .txt{ display: block;}
#access section#slideBl2 .accordion ul li.arrow{
    width:53px;
    /*width:3%;*/
    height: 250px;
    text-align:center;
    background:url(/yokohama/img/access/station/arrow_pc.png)  top no-repeat;
    background-position: 50% 50%;
}

#access section#slideBl2 .accordion ul li.or{
    width:50px;
    /*width:3%;*/
    text-align:center;
    background:url(/yokohama/img/access/station/arrow_or.png)  top no-repeat;
    background-position: 50% 50%;
}

#access section#slideBl2 .accordion ul li.arrow img{
    width:17px;
    padding-top:80px;
}

#access section#slideBl2 .accordion .info { font-size: 12px;}


}