@charset "utf-8";

/**
 *
 * trip
 *
 */

/*--------------------------------------------------------------------------
 all-trip
--------------------------------------------------------------------------*/
#all-trip {
  padding: 150px 0 50px;
  background: #F6F6F6;
  position: relative;
}

#all-trip .en-bg {
  text-align: center;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}

#all-trip .en-bg span {
  letter-spacing: .05em;
  line-height: 1.1;
  color: #FFF;
  font-size: 13vw;
  font-family: 'Marcellus', serif;
  font-weight: 400;
}

#all-trip .search-wrap {}

#all-trip .search-wrap .search {
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  position: absolute;
  top: -177px;
}

#all-trip .search-wrap .search .search-tit {
  padding: 0 1.5em;
  line-height: 58px;
  color: #FFF;
  font-size: 16px;
  background: #262626;
}

#all-trip .search-wrap .search #select_box {
  width: 300px;
  padding: 0 1.5em;
  line-height: 58px;
  font-size: 16px;
  box-shadow: 0 0 0 1px #111 inset;
  background: #FFF;
  cursor: pointer;
  position: relative;
}

#all-trip .search-wrap .search::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-top: 1px solid #111;
  border-right: 1px solid #111;
  position: absolute;
  right: 25px;
  top: 22px;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  pointer-events: none;
}

#all-trip .trip-list {
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

#all-trip .trip-list::before {
  content: "";
  display: block;
  width: 28.5714%;
  order: 1;
}

#all-trip .trip-list::after {
  content: "";
  display: block;
  width: 28.5714%;
}

#all-trip .trip-list li {
  width: 28.5714%;
  margin-bottom: 100px;
}

#all-trip .trip-list li a {
  display: block;
}

#all-trip .trip-list li a figure {
  overflow: hidden;
}

#all-trip .trip-list li a .txt-wrap {
  padding-top: 30px;
  position: relative;
}

#all-trip .trip-list li a .txt-wrap .label-area {
  position: absolute;
  top: -54px;
  left: -18px;
}

#all-trip .trip-list li a .txt-wrap .fac-name {
  line-height: 1.40625;
  color: #111;
  font-size: 18px;
  font-weight: 600;
}
#all-trip .trip-list li a .txt-wrap .trip-copy {
  margin-top: 1.25em;
  text-align: justify;
  line-height: 1.9;
  color: #111;
  font-weight: 400;
}

#all-trip .trip-list li a .txt-wrap .trip-copy span {
  padding-bottom: .25em;
  background: linear-gradient(transparent calc(100% - 1px), #111 0);
}

@media screen and (max-width: 1200px) {
  #all-trip {
    padding: 100px 0 50px;
  }

  #all-trip .search-wrap .search {
    top: -124px;
  }

  #all-trip .search-wrap .search .search-tit {
    font-size: 14px;
    line-height: 48px;
  }

  #all-trip .search-wrap .search #select_box {
    width: 240px;
    line-height: 48px;
    font-size: 14px;
  }

  #all-trip .search-wrap .search::after {
    width: 8px;
    height: 8px;
    right: 19px;
    top: 18px;
  }

  #all-trip .trip-list li {
    margin-bottom: 70px;
  }

  #all-trip .trip-list li a .txt-wrap {
    padding-top: 25px;
  }

  #all-trip .trip-list li a .txt-wrap .label-area {
    top: -45px;
    left: -15px;
  }

  #all-trip .trip-list li a .txt-wrap .fac-name {
    font-size: 16px;
  }

  #all-trip .trip-list li a .txt-wrap .trip-copy {
    margin-top: 1.5em;
    text-align: justify;
    color: #111;
    font-weight: 400;
  }
}

@media screen and (max-width: 768px) {
  #all-trip {
    padding: 70px 0 45px;
  }

  #all-trip .search-wrap .search {
    width: 100%;
    top: -94px;
  }

  #all-trip .search-wrap .search .search-tit {
    width: 6em;
    padding: 0;
    text-align: center;
  }

  #all-trip .search-wrap .search #select_box {
    width: -webkit-calc(100% - 6em);
    width: calc(100% - 6em);
    padding: 0 1em;
    -webkit-flex-shrink: 2;
    flex-shrink: 2;
  }

  #all-trip .en-bg {
    top: 32px;
  }

  #all-trip .en-bg span {
    font-size: 14vw;
  }

  #all-trip .trip-list {
    width: 65.333vw;
    margin: 0 auto;
    display: block;
  }

  #all-trip .trip-list::before,
  #all-trip .trip-list::after {
    content: none;
  }

  #all-trip .trip-list li {
    width: 100%;
    margin-bottom: 45px;
  }

  #all-trip .trip-list li a .txt-wrap {
    padding-top: 20px;
  }

  #all-trip .trip-list li a .txt-wrap .label-area {
    top: -36px;
    left: -12px;
  }

  #all-trip .trip-list li a .txt-wrap .fac-name {
    font-size: 14px;
  }

  #all-trip .trip-list li a .txt-wrap .trip-copy {
    font-size: 12px;
  }
}

/*--------------------------------------------------------------------------
 hero
--------------------------------------------------------------------------*/
#hero {
  width: 100%;
  height: 100vh;
  min-height: 768px;
  display: flex;
  position: relative;
  -webkit-align-items: center;
  align-items: center;
}

#hero::before {
  content: "";
  width: 60%;
  height: 100%;
  background: #F6F6F6;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

#hero .cover-image {
  width: 45vw;
  height: 70vh;
  line-height: 0;
  position: absolute;
  overflow: hidden;
  top: 50%;
  right: 7.8125vw;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

#hero .cover-image img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}

#hero .txt-wrap {}

#hero .txt-wrap .fac-name {
  line-height: 1.40625;
  color: #111;
  font-size: 34px;
  font-weight: 600;
}

#hero .txt-wrap .trip-copy {
  letter-spacing: .1em;
  line-height: 2;
  font-size: 20px;
  /* font-weight: 600; */
  position: relative;
}

#hero .txt-wrap .trip-copy span {
  display: block;
  position: relative;
  left: .8em;
  padding: .6em 0;
  color: #111;
  background: #FFF;
  filter: drop-shadow(-.8em 0 0 #FFF) drop-shadow(.8em 0 0 #FFF);
  width: 40%;
  font-size: 13px;
}

@media screen and (max-width: 1200px) {
  #hero {
    min-height: 614px;
  }

  #hero .cover-image {
    width: 50vw;
    height: 77.777vh;
    right: 0;
  }

  #hero .txt-wrap .fac-name {
    font-size: 26px;
  }

  #hero .txt-wrap .trip-copy,
  #hero .txt-wrap .trip-p {
    font-size: 18px;
  }
}

@media screen and (max-width: 768px) {
  #hero {
    padding: 100px 0 70px;
    height: auto;
    min-height: initial;
    display: block;
  }
#hero .txt-wrap .trip-copy span {

    width: 100%;
	}
  #hero::before {
    width: 100%;
  }

  #hero .cover-image {
    width: 89.3333%;
    height: auto;
    margin: 0 0 0 auto;
    top: 100px;
    right: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  #hero .cover-image img {
    position: relative;
    top: auto;
    left: auto;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  #hero .txt-wrap {
    width: 100%;
    padding-top: 117vw;
    position: relative;
  }

  #hero .txt-wrap .label-area {
    position: absolute;
    left: 10.667%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }

  #hero .txt-wrap .fac-name {
    width: 78.666%;
    margin-top: 35px;
    margin-left: 10.667%;
    font-size: 20px;
  }

  #hero .txt-wrap .trip-tag {
    width: 78.666%;
    margin: 1em auto 0;
  }
  #hero .txt-wrap .trip-p {
    width: 78.666%;
    margin: 35px auto 0 auto;
    font-size: 16px;
  }
  #hero .txt-wrap .trip-copy {
    margin-top: 0;
    margin-left: -19px;
    font-size: 16px;
    /* font-feature-settings: normal; */
    /* -ms-writing-mode: tb-rl; */
    /* writing-mode: vertical-rl; */
    position: absolute;
    top: 210px;
    left: 10.667%;
	padding: 1rem;
    background-color: #fff;
  }

  #hero .txt-wrap .trip-copy span {
    left: auto;
    padding: 0 2px;
    display: inline-block;
    filter: none;
  }

  #hero .txt-wrap .trip-copy span::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-color: #FFF;
    z-index: -1;
  }
}

/*--------------------------------------------------------------------------
 overview
---------------------------------------------------------------------------*/
#overview {
  margin-top: 150px;
  margin-bottom: 150px;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
}

#overview.start {
  -webkit-align-items: flex-start;
  align-items: flex-start;
}

#overview .fac-image {
  width: 34.616%;
  line-height: 0;
  overflow: hidden;
}

#overview .txt-wrap {
  width: 65%;
  padding: 0 8% 0 6%;
  position: relative;
}

#overview .txt-wrap::before {
  content: "";
  width: 60px;
  height: 6px;
  margin-bottom: 40px;
  display: block;
  background:#c2a991;
}

#overview .en-tit {
  letter-spacing: 0.6em;
  line-height: 1;
  font-size: 20px;
  font-family: 'Marcellus', serif;
  font-weight: 400;
  position: absolute;
  top: -60px;
  right: 0;
}

#overview .txt-wrap h2 {
  line-height: 1.7;
  font-size: 22px;
  font-weight: 600;
}

#overview .txt-wrap h2+p {
  margin-top: 2em;
  text-align: left;
  line-height: 2.2;
}

@media screen and (max-width: 1200px) {
  #overview {
    margin-top: 120px;
    -webkit-align-items: flex-start;
    align-items: flex-start;
  }

  #overview .txt-wrap::before {
    content: "";
    width: 50px;
    height: 5px;
    margin-bottom: 30px;
  }

  #overview .en-tit {
    font-size: 16px;
  }

  #overview .txt-wrap h2 {
    font-size: 17px;
  }

  #overview .txt-wrap h2+p {
    line-height: 2;
  }
}

@media screen and (max-width: 768px) {
  #overview {
    margin-top: 70px;
    display: block;
    position: relative;
  }

  #overview .fac-image {
    width: 66.666%;
    margin: 0 auto;
  }

  #overview .txt-wrap {
    width: 100%;
    padding: 0;
    margin-top: 40px;
  }

  #overview .txt-wrap::before {
    content: none;
  }

  #overview .en-tit {
    font-size: 14px;
  }

  #overview .txt-wrap h2 {
    font-size: 16px;
    position: relative;
  }

  #overview .txt-wrap h2::after {
    content: "";
    width: 40px;
    height: 4px;
    margin: 25px 0;
    display: block;
    background:#c2a991;
  }

  #overview .txt-wrap h2+p {
    margin-top: 0;
  }
}

/*--------------------------------------------------------------------------
 movie
---------------------------------------------------------------------------*/
#movie {
  margin-top: 120px;
  padding-top: 120px;
  position: relative;
}

#movie .movie {
  width: 60%;
  margin: 60px auto 0;
}

#movie .movie a {
  display: block;
  position: relative;
  line-height: 0;
  cursor: pointer;
}

#movie .movie a video {
  width: 100%;
  line-height: 0;
}

#movie .movie a figure {
  position: relative;
}

#movie .movie a figure::before {
  content: "";
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .2);
  position: absolute;
  top: 0;
  right: 0;
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -ms-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

#movie .movie a:hover figure::before {
  background: rgba(0, 0, 0, 0);
}

#movie .movie a .btn {
  margin-top: 35px;
  text-align: center;
  line-height: 1;
  color: #FFF;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  -webkit-transform: translateY(-64%) translateX(-50%);
  -ms-transform: translateY(-64%) translateX(-50%);
  transform: translateY(-64%) translateX(-50%);
}

#movie .movie a .btn span {
  width: 150px;
  display: block;
  line-height: 1;
}

#movie .movie a .btn p {
  padding-top: 1.5em;
  font-size: 14px;
  font-family: 'Marcellus', serif;
  font-weight: 400;
}

@media screen and (max-width: 1200px) {
  #movie {
    margin-top: 90px;
    padding-top: 90px;
  }

  #movie .movie a .btn {
    margin-top: 30px;
  }

  #movie .movie a .btn span {
    width: 120px;
  }

  #movie .movie a .btn p {
    font-size: 12px;
  }
}

@media screen and (max-width: 768px) {
  #movie {
    margin-top: 70px;
    padding-top: 70px;
  }

  #movie .movie {
    width: 100%;
    margin-top: 30px;
    position: relative;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  #movie .movie a .btn {
    margin-top: 25px;
  }

  #movie .movie a .btn span {
    width: 90px;
  }

  #movie .movie a .btn p {
    font-size: 10px;
  }
}

/*--------------------------------------------------------------------------
 facility / location
---------------------------------------------------------------------------*/
#facility {
  margin-top: 120px;
  padding-top: 120px;
  position: relative;
}

#location,
#gallery {
  padding: 120px 0;
  position: relative;
}

#facility::before,
#location::before,
#service::before,
#gallery::before {
  content: "";
  width: 85%;
  height: 100%;
  background: #F6F6F6;
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
}

.swiper-container {
  padding-bottom: 56px;
  position: relative;
}

.swiper-container .swiper-slide {
  width: 37.55%;
  max-width: 720px;
  margin: 0 3.125%;
  overflow: hidden;
}
/* .swiper-container .swiper-slide img{
  height: 320px;
} */
.swiper-container .swiper-slide p {
  margin-top: 30px;
  line-height: 1.6;
}

.swiper-container .swiper-slide p i {
  letter-spacing: .06em;
  line-height: 1;
  font-family: 'Marcellus', serif;
  font-size: 20px;
  font-weight: 400;
  font-style: normal;
}

.swiper-container .swiper-slide p span {
  padding-left: .75em;
  line-height: 1.3;
  font-size: 14px;
}

.swiper-container .swiper-slide p span::before {
  content: "- ";
  line-height: 1.3;
  font-size: 14px;
}

.swiper-container .controll {
  width: 445px;
  margin: 60px auto 0;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
  position: relative;
}

.swiper-container .controll .swiper-button-prev,
.swiper-container .controll .swiper-button-next {
  width: 56px;
  height: 56px;
  margin-top: 0;
  background-image: none;
  position: relative;
  left: auto;
  top: auto;
  border: 1px solid rgba(17, 17, 17, .5);
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.swiper-container .controll .swiper-button-prev {
  position: absolute;
  top: 0;
  left: 0;
}

.swiper-container .controll .swiper-button-prev::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-top: 1px solid #111;
  border-right: 1px solid #111;
  position: absolute;
  left: 25px;
  top: 22px;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

.swiper-container .controll .swiper-button-next {
  position: absolute;
  top: 0;
  right: 0;
}

.swiper-container .controll .swiper-button-next::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-top: 1px solid #111;
  border-right: 1px solid #111;
  position: absolute;
  right: 25px;
  top: 22px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.swiper-container .controll .swiper-button-prev::after,
.swiper-container .controll .swiper-button-next::after {
  content: none;
}

.swiper-container .controll .swiper-pagination-fraction {
  width: auto;
  letter-spacing: .06em;
  line-height: 56px;
  font-family: 'Marcellus', serif;
  font-size: 20px;
  font-weight: 400;
  font-style: normal;
  position: relative;
  left: auto;
  bottom: auto;
}

@media screen and (max-width: 1200px) {
  #facility {
    margin-top: 90px;
    padding-top: 90px;
  }

  #location,
  #gallery {
    padding: 90px 0;
  }

  .swiper-container {
    padding-bottom: 45px;
  }

  .swiper-container .swiper-slide {
    width: 50%;
  }

  .swiper-container .swiper-slide p {
    margin-top: 20px;
  }

  .swiper-container .swiper-slide p i {
    font-size: 16px;
  }

  .swiper-container .swiper-slide p span {
    font-size: 12px;
  }

  .swiper-container .swiper-slide p span::before {
    font-size: 12px;
  }

  .swiper-container .controll {
    width: 356px;
    margin: 45px auto 0;
  }

  .swiper-container .controll .swiper-button-prev,
  .swiper-container .controll .swiper-button-next {
    width: 45px;
    height: 45px;
  }

  .swiper-container .controll .swiper-button-prev::before {
    width: 8px;
    height: 8px;
    left: 19px;
    top: 18px;
  }

  .swiper-container .controll .swiper-button-next::before {
    width: 8px;
    height: 8px;
    right: 19px;
    top: 18px;
  }

  .swiper-container .controll .swiper-pagination-fraction {
    line-height: 45px;
    font-size: 16px;
  }
}

@media screen and (max-width: 768px) {
  #facility {
    margin-top: 70px;
    padding-top: 70px;
  }

  #location,
  #gallery {
    padding: 70px 0;
  }

  #facility::before,
  #location::before,
  #service::before,
  #gallery::before {
    width: 75%;
  }

  .swiper-container {
    padding-bottom: 36px;
  }

  .swiper-container .swiper-slide {
    width: 66.666%;
    margin: 0 5.333%;
  }

  .swiper-container .swiper-slide p {
    margin-top: 15px;
  }

  .swiper-container .controll {
    width: 75%;
    margin: 35px auto 0;
  }

  .swiper-container .controll .swiper-button-prev,
  .swiper-container .controll .swiper-button-next {
    width: 36px;
    height: 36px;
  }

  .swiper-container .controll .swiper-button-prev::before {
    width: 5px;
    height: 5px;
    left: 15px;
    top: 15px;
  }

  .swiper-container .controll .swiper-button-next::before {
    width: 5px;
    height: 5px;
    right: 15px;
    top: 15px;
  }

  .swiper-container .controll .swiper-pagination-fraction {
    line-height: 36px;
    font-size: 16px;
  }
}

/*--------------------------------------------------------------------------
 gallery
---------------------------------------------------------------------------*/
#gallery {}

#gallery .lg {
  padding: 0;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

#gallery .lg div {
  width: 16.666%;
}

#gallery .lg div figure {
  overflow: hidden;
  cursor: pointer;
}

#gallery .lg div figure img {
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

#gallery .lg div figure:hover img {
  opacity: 0.8;
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -o-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05);
}

@media screen and (max-width: 1200px) {
  #gallery .lg {
    width: 100vw;
  }
}

@media screen and (max-width: 768px) {
  #gallery .lg {
    padding: 0;
  }

  #gallery .lg div {
    width: 33.333%;
  }
}

/*--------------------------------------------------------------------------
 schedule
---------------------------------------------------------------------------*/
#schedule {
  margin-top: 120px;
  margin-bottom: 120px;
}

/* #schedule .schedule-wrap {
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
} */

/* #schedule .schedule-wrap.center {
  -webkit-justify-content: center;
  justify-content: center;
} */

/* #schedule .schedule-wrap .schedule-table {
  width: 47.5%;
} */

#schedule .schedule-wrap .schedule-table h3 {
  margin-bottom: 15px;
  text-align: center;
  line-height: 2.5;
  color: #FFF;
  font-family: 'Marcellus', serif;
  font-size: 22px;
  font-weight: 400;
  background:#c2a991;
}

#schedule .schedule-wrap .schedule-table table {
  width: 100%;
}

#schedule .schedule-wrap .schedule-table table tr {
  background: url(../image/dotline.png) left bottom repeat-x;
  -webkit-background-size: 4px auto;
  -o-background-size: 4px auto;
  background-size: 4px auto;
}

#schedule .schedule-wrap .schedule-table table tr th {
  width: 4.2em;
  text-align: left;
  color: #111;
  font-weight: 600;
  font-family: 'Marcellus', serif;
}

#schedule .schedule-wrap .schedule-table table tr td {
  padding: .6em 0 .6em 2em;
  font-size: 14px;
  text-align: center;
  color: #5E5D5D;
}
#schedule .schedule-wrap .schedule-table.study table tr td {
  padding: .6em 0 .6em 0;
  font-size: 14px;
  text-align: center;
}
#schedule .schedule-wrap .schedule-table p {
  font-size: 14px;
}

@media screen and (max-width: 1200px) {
  #schedule {
    margin-top: 90px;
  }

  #schedule .schedule-wrap .schedule-table h3 {
    margin-bottom: 12px;
    font-size: 18px;
  }
}

@media screen and (max-width: 768px) {
  #schedule {
    margin-top: 70px;
  }

  #schedule .schedule-wrap {
    display: block;
  }

  #schedule .schedule-wrap .schedule-table {
    width: 100%;
  }

  #schedule .schedule-wrap .schedule-table:last-child {
    margin-top: 35px;
  }

  #schedule .schedule-wrap .schedule-table h3 {
    margin-bottom: 10px;
    font-size: 16px;
  }

  #schedule .schedule-wrap .schedule-table table tr th,
  #schedule .schedule-wrap .schedule-table table tr td {
    font-size: 12px;
  }
  #schedule .schedule-wrap .schedule-table.study table tr th,
  #schedule .schedule-wrap .schedule-table.study table tr td {
    font-size: 10px;
  }

  #schedule .schedule-wrap .schedule-table p {
    font-size: 11px;
  }
}
/* plan-detail */
#plan-detail{
  padding: 100px 0;
  background-color: #f8f8f8;
}
/*--------------------------------------------------------------------------
 access
---------------------------------------------------------------------------*/
#access {
  margin-top: 120px;
  position: relative;
}

#access .map {
  width: 100%;
  height: 0;
  padding-bottom: 50%;
  overflow: hidden;
  position: relative;
}

.map iframe,
.map object,
.map embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#access .access-list {
  display: flex;
  -webkit-align-items: flex-start;
  align-items: flex-start;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

#access .access-list dt {
  width: 7em;
  margin-bottom: 12px;
  text-align: center;
  line-height: 2.2;
  font-size: 13px;
  border: 1px solid rgba(26, 26, 26, .5);
}

#access .access-list dd {
  width: -webkit-calc(100% - 7em);
  width: calc(100% - 7em);
  margin: 1px 0 12px 1em;
  text-align: justify;
  line-height: 1.8;
  font-size: 16px;
}

#access .access-list dd a {
  opacity: .5;
}

#access .access-list dd a:hover {
  opacity: 1;
}

#access .access-list dd a span {
  margin: 0 0 0 5px;
  display: inline-block;
  vertical-align: bottom;
  font-size: 18px;
  -webkit-transform: translateY(-19%);
  -ms-transform: translateY(-19%);
  transform: translateY(-19%);
}

#access .access-list dt:last-of-type,
#access .access-list dd:last-of-type {
  margin-bottom: 0;
}

@media screen and (max-width: 1200px) {
  #access {
    margin-top: 90px;
  }

  #access .access-list dt {
    margin-bottom: 10px;
    font-size: 11px;
  }

  #access .access-list dd {
    margin-bottom: 10px;
    font-size: 14px;
  }

  #access .access-list dd a span {
    margin: 0 0 0 4px;
    font-size: 16px;
  }
}

@media screen and (max-width: 768px) {
  #access {
    margin-top: 70px;
  }

  #access .map {
    width: 100vw;
    margin-left: -6.0385vw;
    height: 0;
    padding-bottom: 75%;
  }

  #access .access-list dt {
    margin-bottom: 8px;
    font-size: 10px;
  }

  #access .access-list dd {
    margin-bottom: 8px;
    text-align: justify;
    font-size: 12px;
  }

  #access .access-list dd a span {
    margin: 0 0 0 3px;
    font-size: 14px;
  }
}

/* service */
#service{
  padding: 0 10vw;
  display: flex;
  align-self: center;
  justify-content: space-between;
  position: relative;
}
#service .itm{
  width: 32%;
  padding-top: 32%;
  font-size: 14px;
  color: #5E5D5D;
  position: relative;
}
#service .itm img{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
}
@media screen and (max-width: 1200px) {
  #service {
    padding: 0 8vw;
  }
}
@media screen and (max-width: 768px) {
  #service {
    padding: 0 6vw;
  }
}
/* map-show */
#map-show{
  position: relative;
  padding-top: 10vw;
}
#map-show::before {
  content: "";
  width: 99%;
  height: 65%;
  background: #F6F6F6;
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
}
#map-show .map-img {
  width: 45vw;
  margin: 0 auto;
}
#map-show .en-tit {
  letter-spacing: .6em;
  line-height: 1;
  font-size: 20px;
  font-family: 'Marcellus', serif;
  font-weight: 400;
  font-feature-settings: normal;
  writing-mode: vertical-rl;
  position: absolute;
  top: 10vw;
  left: 6vw;
  z-index: 2;
}
@media screen and (max-width: 1200px){
  #map-show .map-img {
    width: 60vw;
  }
  #map-show .en-tit{font-size: 16px;}
}
@media screen and (max-width: 768px) {
  #map-show .map-img {
    width: 100vw;
  }
  #map-show .en-tit{font-size: 14px;}
}
 .detail-info.inner-l {
   width: 92vw;
   max-width: 1444px;
 }

 .detail-info {
   display: flex;
   -webkit-align-items: flex-end;
   align-items: flex-end;
   margin-top: 60px;
   margin-bottom: 80px;
 }

 .detail-info .line-fp {
   margin-right: 40px;
   flex: 1;
   height: 3px;
   background: url(../image/line-red.png) repeat-x;
 }

 .detail-info .btn {
   width: 223px;
   line-height: 50px;
   background:#c2a991;
   text-align: center;
   font-size:
     18px;
   color: #FFFFFF;
 }

 .detail-info .btn a {
   color: #fff;
 }

 @media screen and (max-width: 1200px) {
   .detail-info.inner-l {
     width: 96vw;
     max-width: 1100px;
   }
 }

 @media screen and (max-width: 768px) {
   .detail-info.inner-l {
     width: 87vw;
   }

   .detail-info {
     margin-top: 30px;
     margin-bottom: 50px;
   }

   .detail-info .btn {
     width: 120px;
     font-size: 14px;
     line-height: 36px;
   }
 }