/* ----------------------------------------------------------
General Settings
---------------------------------------------------------- */


/* ----------------------------------------------------------
Style for PCs
---------------------------------------------------------- */
@media screen and (min-width: 1025px) {

/* Tab */
.cctab_base {
  width:100%;
  height: auto;
  display: block;
  border-bottom: 1px solid var(--color-ccc);
}
.contents_tab {
width:98%;
height: auto;
display: flex;
margin:0 auto;
margin-bottom: 10px;
}
.contents_tab li {
  flex:1;
  font-size:14px;
  line-height: 1.5em;
  margin:0 1px;
}
.contents_tab li a {
  width: 100%;
  height: auto;
  display: block;
  padding:10px 5px;
  text-align: center;
  text-decoration: none;
  color:var(--color-black);
  border-top:1px solid var(--color-ccc);
  border-right:1px solid var(--color-ccc);
  border-bottom:none;
  border-left:1px solid var(--color-ccc);
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  transition: .4s all;
}
.contents_tab li a:hover {
  color:var(--color-white);
  background-color: var(--color-666);
}

/* AccessMap */
.mapmm, .mapmm iframe {
  width: 100%;
  height: 500px;
  margin:0 auto
}

.contents_main_a,
.contents_main_b,
.contents_main_c {
    display: none;
}

.tab_active {
    cursor: default;
}

.tab_active a {
  width: 100%;
  height: auto;
  display: block;
  padding:10px 5px;
  text-align: center;
  text-decoration: none;
  color:var(--color-white)!important;
  background-color: var(--color-black);
  border-top:1px solid var(--color-ccc);
  border-right:1px solid var(--color-ccc);
  border-bottom:none;
  border-left:1px solid var(--color-ccc);
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}

/* Access address */
.acc_address {
  width:100%;
  height: auto;
  display: block;
  padding:50px 0 20px;
  text-align: center;
}
.acc_address h2 {
  font-size:20px;
  font-weight: 600;
  line-height: 1.5em;
  margin-bottom: 1em;
}
.acc_address p {
  font-size:12px;
  line-height: 2em;
}
.acc_address p.acc_ad_01 {
  margin-bottom: 1em;
}
.acc_address p.acc_ad_tel {
  width:fit-content;
  height: 30px;
  display: block;
  font-size:20px;
  font-weight: 400;
  font-family: var(--font-en);
  margin:0 auto 1em;
}
.acc_address p.acc_ad_tel a {
  width:100%;
  height: auto;
  display: block;
  text-decoration: none;
  padding-left:30px;
  background-image: url(../img/header/ic-tel_b.svg);
  background-repeat: no-repeat;
  background-position: left center;
  background-size:auto 30px;

}
.acc_address p.acc_ad_02 {
  margin-bottom: 0;
}

/* Route */
.routeinfomm {
  width:100%;
  height: auto;
  display: flex;
  flex-wrap: wrap;
}
.routeinfomm .routecc {
  flex:1;
  padding:20px 2.5% 20px;
}
.routeinfomm .routecc:first-of-type {
  border-right: 1px dotted var(--color-ccc);
}

.routetitle {
  width:fit-content;
  height: auto;
  display: flex;
}
.routetitle h3 {
  width:fit-content;
  height: auto;
  display: block;
  font-size:10px;
  font-weight: 400;
  color: var(--color-333);
  line-height: 20px;
  margin:0 0 20px 0;
  order:2;
}
.routetitle p {
  width:fit-content;
  height: auto;
  display: block;
  font-size:12px;
  font-family: var(--font-en);
  color: var(--color-black);
  font-weight: 400;
  line-height: 20px;
  margin:0 10px 0 0;
  order:1;
}
.routecc ul {
  width:100%;
  height: auto;
  display: block;
  margin:0 0 0 1em;
}
.routecc ul li {
  font-size:12px;
  line-height: 1.5em;
  margin:0 0 1em 1em;
  list-style-image: url(../img/lidot.png);
}

}

/* ----------------------------------------------------------
Style for iPad Pro
---------------------------------------------------------- */
@media screen and (min-width: 769px) and (max-width: 1024px) {

/* Tab */
.cctab_base {
  width:100%;
  height: auto;
  display: block;
}
.contents_tab {
width:100%;
height: auto;
display: flex;
margin:0 auto;
margin-bottom: 10px;
}
.contents_tab li {
  flex:1;
  font-size:12px;
  line-height: 1.5em;
  margin:0 1px;
}
.contents_tab li a {
  width: 100%;
  height: auto;
  display: block;
  padding:10px 0px;
  text-align: center;
  text-decoration: none;
  color:var(--color-black);
  border-top:1px solid var(--color-ccc);
  border-right:1px solid var(--color-ccc);
  border-bottom:none;
  border-left:1px solid var(--color-ccc);
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  transition: .4s all;
}
.contents_tab li a:hover {
  color:var(--color-white);
  background-color: var(--color-666);
}

/* AccessMap */
.mapmm, .mapmm iframe {
  width: 100%;
  height: 500px;
  margin:0 auto
}

.contents_main_a,
.contents_main_b,
.contents_main_c {
    display: none;
}

.tab_active {
    cursor: default;
}

.tab_active a {
  width: 100%;
  height: auto;
  display: block;
  padding:10px 5px;
  text-align: center;
  text-decoration: none;
  color:var(--color-white)!important;
  background-color: var(--color-black);
  border-top:1px solid var(--color-ccc);
  border-right:1px solid var(--color-ccc);
  border-bottom:none;
  border-left:1px solid var(--color-ccc);
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}

/* Access address */
.acc_address {
  width:100%;
  height: auto;
  display: block;
  padding:50px 0 20px;
  text-align: center;
}
.acc_address h2 {
  font-size:20px;
  font-weight: 600;
  line-height: 1.5em;
  margin-bottom: 1em;
}
.acc_address p {
  font-size:14px;
  line-height: 2em;
}
.acc_address p.acc_ad_01 {
  margin-bottom: 1em;
}
.acc_address p.acc_ad_tel {
  width:fit-content;
  height: 30px;
  display: block;
  font-size:20px;
  font-weight: 400;
  font-family: var(--font-en);
  margin:0 auto 1em;
}
.acc_address p.acc_ad_tel a {
  width:100%;
  height: auto;
  display: block;
  text-decoration: none;
  padding-left:30px;
  background-image: url(../img/header/ic-tel_b.svg);
  background-repeat: no-repeat;
  background-position: left center;
  background-size:auto 30px;

}
.acc_address p.acc_ad_02 {
  margin-bottom: 0;
}

/* Route */
.routeinfomm {
  width:100%;
  height: auto;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}
.routeinfomm .routecc {
  flex:1;
  padding:30px 2.5% 20px;
}
.routeinfomm .routecc:first-of-type {
  border-bottom: 1px dotted var(--color-999);
  padding:10px 2.5% 20px;
}

.routetitle {
  width:fit-content;
  height: auto;
  display: flex;
}
.routetitle h3 {
  width:fit-content;
  height: auto;
  display: block;
  font-size:10px;
  font-weight: 400;
  color: var(--color-333);
  line-height: 20px;
  margin:0 0 20px 0;
  order:2;
}
.routetitle p {
  width:fit-content;
  height: auto;
  display: block;
  font-size:14px;
  font-family: var(--font-en);
  color: var(--color-black);
  font-weight: 400;
  line-height: 20px;
  margin:0 10px 0 0;
  order:1;
}
.routecc ul {
  width:100%;
  height: auto;
  display: block;
  margin:0 0 0 1em;
}
.routecc ul li {
  font-size:14px;
  line-height: 1.5em;
  margin:0 0 1em 1em;
  list-style-image: url(../img/lidot.png);
}

}


/* ----------------------------------------------------------
Style for Smartphone
---------------------------------------------------------- */
@media screen and (max-width: 768px) {

  /* Tab */
.cctab_base {
  width:100%;
  height: auto;
  display: block;
}
.contents_tab {
width:100%;
height: auto;
display: flex;
flex-direction: column;
margin:0 auto;
margin-bottom: 10px;
}
.contents_tab li {
  flex:1;
  font-size:12px;
  line-height: 1.5em;
  margin:0 0 5px;
}
.contents_tab li a {
  width: 100%;
  height: auto;
  display: block;
  padding:5px 0px;
  text-align: center;
  text-decoration: none;
  color:var(--color-black);
  border:1px solid var(--color-ccc);
  border-radius: 3px;
  transition: .4s all;
}
.contents_tab li a:hover {
  color:var(--color-white);
  background-color: var(--color-666);
}

/* AccessMap */
.mapmm, .mapmm iframe {
  width: 100%;
  height: 350px;
  margin:0 auto
}

.contents_main_a,
.contents_main_b,
.contents_main_c {
    display: none;
}

.tab_active {
    cursor: default;
}

.tab_active a {
  width: 100%;
  height: auto;
  display: block;
  padding:5px 0px;
  text-align: center;
  text-decoration: none;
  color:var(--color-white)!important;
  background-color: var(--color-black);
  border:1px solid var(--color-ccc);
  border-radius: 3px;
}

/* Access address */
.acc_address {
  width:100%;
  height: auto;
  display: block;
  padding:30px 0 20px;
  text-align: center;
}
.acc_address h2 {
  font-size:16px;
  font-weight: 600;
  line-height: 1.5em;
  margin-bottom: 1em;
}
.acc_address p {
  font-size:14px;
  line-height: 2em;
}
.acc_address p.acc_ad_01 {
  margin-bottom: 0.5em;
}
.acc_address p.acc_ad_tel {
  width:fit-content;
  height: 30px;
  display: block;
  font-size:20px;
  font-weight: 400;
  font-family: var(--font-en);
  margin:0 auto 1em;
}
.acc_address p.acc_ad_tel a {
  width:100%;
  height: auto;
  display: block;
  text-decoration: none;
  padding-left:30px;
  background-image: url(../img/header/ic-tel_b.svg);
  background-repeat: no-repeat;
  background-position: left center;
  background-size:auto 30px;

}
.acc_address p.acc_ad_02 {
  margin-bottom: 0;
}

/* Route */
.routeinfomm {
  width:100%;
  height: auto;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}
.routeinfomm .routecc {
  flex:1;
  padding:30px 2.5% 20px;
}
.routeinfomm .routecc:first-of-type {
  border-bottom: 1px dotted var(--color-999);
  padding:10px 2.5% 20px;
}

.routetitle {
  width:fit-content;
  height: auto;
  display: flex;
}
.routetitle h3 {
  width:fit-content;
  height: auto;
  display: block;
  font-size:10px;
  font-weight: 400;
  color: var(--color-333);
  line-height: 20px;
  margin:0 0 20px 0;
  order:2;
}
.routetitle p {
  width:fit-content;
  height: auto;
  display: block;
  font-size:14px;
  font-family: var(--font-en);
  color: var(--color-black);
  font-weight: 400;
  line-height: 20px;
  margin:0 10px 0 0;
  order:1;
}
.routecc ul {
  width:100%;
  height: auto;
  display: block;
  margin:0 0 0 1em;
}
.routecc ul li {
  font-size:14px;
  line-height: 1.5em;
  margin:0 0 1em 1em;
  list-style-image: url(../img/lidot.png);
}

}
