* {

  margin: 0;

  padding: 0;

  list-style: none;

}



html {

  font-size: 16px;

}



.img-box {

  position: relative;

}



.gray-container {

  background-image: url('/images/0) COMMON/common/background.png');

  margin: auto 2% auto 2%;

  padding-bottom: 50px;

}



.contact-page .gray-container.fix-gray {

  padding-bottom: 20%;

  padding-top: 5%;

}



.part-title-box {

  margin: 8% 5%;

  display: inline-block;

  width: 15rem;

  vertical-align: top;

}



.part-title {

  height: 1.5rem;

  padding-bottom: 1.5rem;

  vertical-align: bottom;

}



.contact-page .second-title {

  height: 3rem;

  margin: 8% 5%;

  vertical-align: bottom;

}



.part-title-box .border-bot {

  border-bottom: 1px solid rgb(186, 147, 108);

  width: 0;

  opacity: 0;

  transition: all .5s;

}



.part-title-box .border-bot.lineAppear {

  width: 100%;

  opacity: 1;

}



.send {

  width: 30%;

  display: inline-block;

  text-align: start;

  position: absolute;

}



.send img:first-child {

  width: 30%;

  margin-right: 10px;

}



.send span.play {

  width: 12%;

  margin-bottom: -.5%;

  display: inline-block;

  position: relative;

  transition: ease .5s;

  vertical-align: bottom;

}



.send span.play::before {

  content: '';

  display: block;

  background-color: black;

  width: 0;

  height: 1px;

  position: absolute;

  top: 50%;

  left: 1rem;

  transition: ease .5s;

}



.contact-page .gray-container .gray-2-container form .sumit-btn input:hover~.send span.play {

  margin-left: 2rem;

}



.contact-page .gray-container .gray-2-container form .sumit-btn input:hover~.send span.play::before {

  left: -1rem;

  width: 2rem;

}



#contact-page {

  width: 100%;

  overflow: hidden;

}



#contact-page .about-page {

  width: 100%;

}



.contact-page .menu-box {

  width: 100%;

  position: fixed;

  background-color: #fff;

  z-index: 15;

}



.contact-page header {

  display: flex;

  justify-content: space-between;

}



.contact-page header #main-logo {

  height: 100%;

}



.contact-page header .main-menu {

  display: flex;

}



.contact-page header .main-menu img {

  height: 3rem;

  vertical-align: bottom;

  transition: .3s;

}



#contact-page header .main-menu img:hover {

  opacity: .5;

  transform: scale(1.05);

}



.contact-page header .main-menu a {

  width: 6rem;

  text-decoration: none;

  text-align: center;

  font: .85rem bold;

  line-height: 2rem;

  letter-spacing: .2rem;

  color: black;

  padding: .5rem 5px;

  margin: .5rem 15px;

  opacity: 0;

}



.contact-page header .main-menu a:first-child {

  animation-duration: .5s;

}



.contact-page header .main-menu a:nth-child(2) {

  animation-duration: .7s;

}



.contact-page header .main-menu a:nth-child(3) {

  animation-duration: .9s;

}



.contact-page header .main-menu a:nth-child(4) {

  animation-duration: 1.1s;

}



.contact-page header .main-menu a:nth-child(5) {

  animation-duration: 1.3s;

}



.contact-page header .main-menu a:nth-child(6) {

  animation-duration: 1.5s;

}



.contact-page header .main-menu a:last-child {

  width: 3rem;

  margin: auto;

  padding: 0;

  padding-right: .6rem;

}



.contact-page header .main-menu a:nth-child(5) {

  letter-spacing: .1rem;

}



.contact-page header .main-menu a:hover,

.contact-page header .main-menu .active {

  color: white;

  font-size: .75rem;

  background-color: rgb(23, 33, 72);

}



.contact-page header .main-menu a:last-child:hover {

  background-color: transparent;

}



.contact-page .main-img {

  margin-bottom: -5%;

}



.contact-page .computer.main-img img:first-child {

  width: 75%;

  position: relative;

  z-index: 2;

}



.contact-page .computer.main-img img:nth-child(2) {

  width: 33%;

  position: absolute;

  left: 64.6%;

  top: 56%;

  z-index: 3;

}



.contact-page .computer.main-img img:nth-child(3) {

  width: 24%;

  position: absolute;

  top: 68%;

  margin-left: 2%;

}



.contact-page .computer.main-img img:nth-child(4) {

  width: 5%;

  position: absolute;

  top: 70%;

  margin-left: 2%;

}



.contact-page .computer.main-img img:nth-child(5) {

  width: 35%;

  position: absolute;

  top: 75%;

  left: 75%;

  margin-left: -5%;

  opacity: 0;

}



.contact-page .computer.main-img img:nth-child(6) {

  width: 30%;

  position: absolute;

  top: 0;

  bottom: 0;

  right: 0;

  left: 0;

  margin: 35% auto auto;

  z-index: 7;

}



.contact-page .computer.main-img img:nth-child(7) {

  width: 1%;

  position: absolute;

  top: 0;

  bottom: 0;

  right: 0;

  left: 0;

  margin: 43% auto auto 50%;

  z-index: 7;

}



.contact-page .gray-container .gray-2-container {

  width: 85%;

  background-color: rgba(186, 147, 108, 0.1);

  margin-left: 5%;

  position: relative;

}



.contact-page .gray-container .gray-2-container .description {

  width: 45%;

  text-align: center;

  display: inline-block;

  vertical-align: top;

}



.contact-page .gray-container .gray-2-container .description .mark {

  width: 2%;

  margin: 7% auto 3%;

}



.contact-page .gray-container .gray-2-container .description p {

  font-size: .9rem;

  line-height: 2.2rem;

  letter-spacing: .2rem;

}



.contact-page .gray-container .gray-2-container .img1 {

  width: 55%;

  position: absolute;

  right: -5%;

  top: -5%;

}



.contact-page .gray-container .gray-2-container form {

  width: 80%;

  margin: auto;

  padding: 10% 0 5%;

  position: relative;

}



.contact-page .gray-container .gray-2-container form br {

  clear: both;

}



.contact-page .gray-container .gray-2-container form .row {

  margin: 4% 0;

  border-bottom: 1px solid rgb(23, 33, 72);

}



.contact-page .gray-container .gray-2-container form label {

  color: rgb(23, 33, 72);

  vertical-align: sub;

}



.contact-page .gray-container .gray-2-container form .input {

  width: 80%;

  float: right;

  background-color: transparent;

  border: none;

  text-align: end;

  font-size: 1.12rem;

  line-height: 2rem;

  outline: none;

}



.contact-page .gray-container .gray-2-container form input:focus,

.contact-page .gray-container .gray-2-container form textarea:focus {

  outline-color: rgb(186, 147, 108);

  padding-left: 5px;

  text-align: start;

}



.contact-page .gray-container .gray-2-container form .method {

  border-bottom: 2px solid rgb(23, 33, 72);

  display: flex;

  justify-content: space-between;

  padding-bottom: 3%;

}



.contact-page .gray-container .gray-2-container form .method .method-select {

  display: flex;

  align-items: center;

  flex-wrap: nowrap;

  padding-right: 5%;

}



.contact-page .gray-container .gray-2-container form .method .method-select label {

  position: relative;

  padding-left: 7%;

  white-space: nowrap;

  color: black;

}



.contact-page .gray-container .gray-2-container form .method .method-select label input {

  position: absolute;

  left: 0;

  width: 1.12rem;

  height: 1.12rem;

  cursor: pointer;

  z-index: 3;

}



.contact-page .gray-container .gray-2-container form .method .method-select label input::before {

  display: block;

  content: '';

  background-color: #fff;

  width: 100%;

  height: 100%;

  border-radius: 50%;

  position: absolute;

}



.contact-page .gray-container .gray-2-container form .method .method-select label input:checked::before {

  background-color: #000;

}



/* .contact-page .gray-container .gray-2-container form .method .method-select label input:checked ~.checkmark{

  background-color: black;

} */

/* .contact-page .gray-container .gray-2-container form .method .method-select .checkmark{

  position: absolute;

  top: 0;

  left: 0;

  width: 1.12rem;

  height: 1.12rem;

  border-radius: 50%;

  background-color: #fff;

} */

.contact-page .gray-container .gray-2-container form .method .method-select .checkmark::after {

  content: '';

  position: absolute;

  display: none;

}



.contact-page .gray-container .gray-2-container form .sumit-btn {

  width: 100%;

  position: absolute;

  top: 105%;

  left: 95%;

}



.contact-page .gray-container .gray-2-container form .sumit-btn input {

  width: 20%;

  position: absolute;

  cursor: pointer;

  z-index: 2;

  opacity: 0;

  height: 2rem;

}



.contact-page .gray-container .gray-2-container form .sumit-btn .send-img {

  width: 20%;

  position: absolute;

  display: flex;

  align-items: center;

  transition: all .5s;

}



.contact-page .gray-container .gray-2-container form .sumit-btn input:hover~.send-img {

  transform: scale(1.2);

}



.contact-page .gray-container .gray-2-container form .sumit-btn .send-img img:nth-child(1) {

  width: 35%;

}



.contact-page .gray-container .gray-2-container form .sumit-btn .send-img img:nth-child(2) {

  width: 30%;

  margin-left: 5%;

}



.contact-page .gray-container .gray-2-container form .sumit-btn .send-img img:nth-child(3) {

  width: 16%;

  margin-left: -12.5%;

}



/* .contact-page .gray-container .gray-2-container form .submit{



} */

.contact-page .gray-container .information-container {

  width: 95%;

  white-space: nowrap;

  overflow: hidden;

  margin: auto;

  opacity: 0;

}



.contact-page .gray-container .information-container .map {

  width: 58%;

  display: inline-block;

  vertical-align: top;

  position: relative;

}



.contact-page .gray-container .information-container img:first-child {

  width: 58%;

  display: inline-block;

  position: relative;

}



.contact-page .gray-container .information-container img:nth-child(2) {

  width: 43.6%;

  display: inline-block;

  position: relative;

}



.contact-page .gray-container .computer.infortmation-part {

  width: 95%;

  margin: auto;

  margin-top: 1rem;

  opacity: 0;

  display: flex;

  justify-content: space-around;

}



.contact-page .gray-container .infortmation-part .line-box {

  width: 58%;

  margin: auto;

  display: inline-block;

}



.contact-page .gray-container .infortmation-part .line-box img {

  display: block;

  width: 6rem;

  margin: 5rem auto;

}



/* .contact-page .gray-container .infortmation-part img:nth-child(1),

.contact-page .gray-container .infortmation-part img:nth-child(3){

  width: 1%;

  position: relative;

  vertical-align: top;

} */

.contact-page .gray-container .infortmation-part .resturant-info {

  display: inline-block;

  vertical-align: top;

  cursor: pointer;

}



.contact-page .gray-container .infortmation-part .resturant-info.gray {

  filter: grayscale(1);

  opacity: .5;

}



.contact-page .gray-container .infortmation-part .resturant-info caption {

  color: #B6936D;

  text-align: start;

  font-size: 2rem;

  letter-spacing: .8rem;

  font-weight: bold;

  padding-bottom: 7%;

  padding-top: 2%;

}



.contact-page .gray-container .infortmation-part .resturant-info tr {

  line-height: 3rem;

}



.contact-page .gray-container .infortmation-part .resturant-info tr:last-child {

  vertical-align: bottom;

}



.contact-page .gray-container .infortmation-part .resturant-info td:first-child {

  padding-right: 5%;

}



.contact-page .page-end {

  width: 104%;

  margin-left: -2%;

  position: relative;

  opacity: 0;

}



.contact-page .page-end img:first-child {

  width: 100%;

}



.contact-page .page-end .item-1 {

  text-decoration: none;

  color: #fff;

  width: 45%;

  position: absolute;

  top: -130%;

  left: 10%;

  z-index: 3;

}



.contact-page .page-end .item-1 img {

  width: 100%;

  filter: brightness(.4);

  transition: all .7s;

}



.contact-page .page-end .item-1 .content {

  text-align: center;

  position: absolute;

  top: 35%;

  left: 0;

  right: 0;

  margin: auto;

}



.contact-page .page-end .item-1 .content h3 {

  font-size: 2rem;

  letter-spacing: .5rem;

}



.contact-page .page-end .item-1 .content h4 {

  width: 5rem;

  display: block;

  margin: 1.5rem auto;

  font-size: 1.2rem;

  letter-spacing: .1rem;

  border: .05rem solid #fff;

  position: relative;

}



.contact-page .page-end .item-1 .content h4::before {

  content: '';

  display: block;

  background-color: #fff;

  width: 2rem;

  height: .05rem;

  right: 0;

  left: 0;

  margin: -.9rem auto 0;

  position: absolute;

}



.contact-page .page-end .item-2 {

  color: #000;

  text-decoration: none;

  width: 45%;

  position: absolute;

  top: -100%;

  left: 45%;

  z-index: 5;

}



.contact-page .page-end .item-2 img {

  width: 100%;

  transition: all .7s;

}



.contact-page .page-end .item-2 .content {

  text-align: center;

  position: absolute;

  top: 35%;

  left: 0;

  right: 0;

  margin: auto;

}



.contact-page .page-end .item-2 .content h3 {

  font-size: 2rem;

  letter-spacing: .5rem;

}



.contact-page .page-end .item-2 .content h4 {

  width: 5rem;

  display: block;

  margin: 1.5rem auto;

  font-size: 1.2rem;

  letter-spacing: .1rem;

  border: .05rem solid #000;

}



.contact-page .page-end .item-2 .content h4::before {

  content: '';

  display: block;

  background-color: #000;

  width: 2rem;

  height: .05rem;

  right: 0;

  left: 0;

  margin: -.9rem auto 0;

  position: absolute;

}



.contact-page .page-end .item-1:hover {

  color: #000;

  z-index: 8;

}



.contact-page .page-end .item-1:hover img {

  filter: brightness(1);

}



.contact-page .page-end .item-1:hover .content h4 {

  border: .05rem solid #000;

}



.contact-page .page-end .item-1:hover .content h4::before {

  background-color: #000;

}



.contact-page .page-end .item-1:hover~.item-2 {

  color: #fff;

}



.contact-page .page-end .item-1:hover~.item-2 img {

  filter: brightness(.4);

}



.contact-page .page-end .item-1:hover~.item-2 .content h4 {

  border: .05rem solid #fff;

}



.contact-page .page-end .item-1:hover~.item-2 .content h4::before {

  background-color: #fff;

}



.contact-page .footer-part {

  text-align: center;

  position: relative;

}



.contact-page .footer-part img:first-child {

  width: 2%;

  margin: 5%;

}



.contact-page .footer-part img:nth-child(3) {

  width: 15%;

}



.contact-page .footer-part img:nth-child(5) {

  width: 1%;

  position: absolute;

  top: -5%;

  left: 90%;

}









@media screen and (max-width: 600px) {





  .gray-container {

    padding-top: 3%;

  }



  .part-title-box {

    text-align: center;

    display: block;

    width: 25rem;

    margin: 2rem auto 1.5rem;

  }



  .part-title {

    height: 3rem;

    padding-bottom: 2rem;

  }



  .contact-page .second-title {

    height: 5.5rem;

    display: block;

    margin: 0 auto 5%;

  }



  .contact-page .gray-container.space {

    padding-top: 30%;

  }



  .contact-page header {

    width: 100%;

    height: 35px;

    position: fixed;

    top: 0;

    z-index: 10;

    background-color: #fff;

  }



  .contact-page header #main-logo1 {

    height: 1.5rem;

    padding: 5px 0.5rem;

    margin: auto 3%;

  }



  .contact-page header .main-menu {

    width: 100%;

    height: 100vh;

    position: absolute;

    top: 35px;

    text-align: center;

    flex-direction: column;

    background-color: rgb(32, 46, 100);

    transition: all .5s;

  }



  .contact-page header .main-menu.close {

    transform: translate(100%, 0);

    opacity: 0;

  }



  .contact-page header .main-menu a {

    width: 100%;

    color: #fff;

    font-size: 2rem;

    letter-spacing: .5rem;

    padding: .5rem 0;

    margin: 3rem 0;

    position: relative;

    opacity: 1;

  }



  .contact-page header .main-menu a:hover {

    font-size: 2rem;

  }



  .contact-page header .main-menu a::before {

    content: '';

    display: block;

    background-color: #eee;

    height: 5.5rem;

    width: .1rem;

    position: absolute;

    left: 50%;

    bottom: -6rem;

  }



  .contact-page header .main-menu a:nth-child(6)::before {

    display: none;

  }



  .contact-page header .main-menu a:last-child::before {

    display: none;

  }



  .contact-page header .main-menu a:nth-child(5) {

    letter-spacing: .5rem;

  }



  .contact-page header .main-menu a img {

    display: block;

    height: 2rem;

    margin: auto;

    padding-top: 1rem;

  }



  .contact-page header .main-menu a:nth-child(6) img {

    height: 8rem;

  }



  .contact-page header .main-menu a:hover {

    background-color: rgb(40, 58, 128);

  }



  .contact-page header img:nth-child(2) {

    height: 1.2rem;

    padding: 5px 0.5rem;

    margin: auto 3%;

  }



  /* .news-page header img:nth-child(4){

    height: 1.2rem;

    padding: 5px 0.5rem;

    margin: auto 3%;

  } */

  .contact-page header .bar {

    display: inline-block;

    width: 3rem;

    height: 3rem;

    margin: auto 3%;

  }



  .contact-page header .bar .bar1 {

    width: 95%;

    height: .2rem;

    background-color: #333;

    margin: .9rem auto 1.2rem auto;

    transition: all .5s;

  }



  .contact-page header .bar .bar2 {

    width: 95%;

    height: .2rem;

    background-color: #333333;

    margin: auto;

    transition: all .5s;

  }



  .contact-page header .change.bar .bar1 {

    width: 95%;

    height: .2rem;

    transform: rotate(-45deg);

    background-color: #333;

    margin-top: 1.5rem;

    margin-bottom: -.2rem;

  }



  .contact-page header .change.bar .bar2 {

    width: 95%;

    height: .2rem;

    transform: rotate(45deg);

    background-color: #333;

  }



  .contact-page .main-img.phone {

    margin-left: -90%;

    margin-top: 35px;

  }



  .contact-page .phone.main-img img:first-child {

    width: 23.25%;

    position: relative;

    z-index: 2;

  }



  .contact-page .phone.main-img img:nth-child(2) {

    width: 51.75%;

    position: relative;

    z-index: 2;

  }



  .contact-page .phone.main-img img:nth-child(3) {

    width: 30%;

    position: absolute;

    top: 43%;

    left: 66%;

    z-index: 3;

    opacity: 0;

  }



  .contact-page .phone.main-img img:nth-child(4) {

    width: 24%;

    position: absolute;

    top: 59%;

    margin-left: 4%;

  }



  .contact-page .phone.main-img img:nth-child(5) {

    width: 7%;

    position: absolute;

    top: 62%;

    margin-left: 4%;

  }



  .contact-page .phone.main-img img:nth-child(6) {

    position: absolute;

    left: 80%;

    width: 28%;

    top: 67%;

    margin-left: -5%;

    z-index: 1;

  }



  .contact-page .gray-container img.arrow {

    display: block;

    margin: 0 auto 20%;

    width: 1%;

  }



  .contact-page .gray-container img.slogan {

    display: block;

    margin: 2% auto;

    width: 60%;

  }



  .contact-page .gray-container .gray-2-container {

    width: 104%;

    margin-left: -2%;

    padding-bottom: 10%;

  }



  .contact-page .gray-container .gray-2-container .description {

    width: 100%;

    display: block;

    margin: auto;

    position: relative;

  }



  .contact-page .gray-container .gray-2-container .img1 {

    width: 100%;

    opacity: .2;

    position: static;

  }



  .contact-page .gray-container .gray-2-container .description .mark {

    position: absolute;

    width: 1.8rem;

    top: 4rem;

    left: 0;

    right: 0;

    margin: auto;

  }



  .contact-page .gray-container .gray-2-container .description p {

    position: absolute;

    width: 100%;

    top: 8rem;

    font-size: 1.8rem;

    letter-spacing: .6rem;

    line-height: 3.5rem;

  }



  .contact-page .gray-container .gray-2-container .description p::before {

    content: '';

    display: block;

    background-color: black;

    width: 1.6rem;

    height: 0.6rem;

    position: absolute;

    top: -3rem;

    left: 0;

    right: 0;

    margin: auto;

  }



  .contact-page .gray-container .gray-2-container .description::before {

    content: '';

    display: block;

    background-color: black;

    position: absolute;

    width: 1px;

    height: 10rem;

    left: 50%;

    bottom: -5rem;

  }



  .contact-page .gray-container .gray-2-container form {

    width: 90%;

  }



  .contact-page .gray-container .gray-2-container form .row {

    width: 100%;

    border: 1px solid rgb(23, 33, 72);

  }



  .contact-page .gray-container .gray-2-container form .salutation-box {

    position: relative;

  }



  .contact-page .gray-container .gray-2-container form label {

    color: rgb(23, 33, 72);

    display: inline-block;

    font-size: 1.8rem;

    letter-spacing: .3rem;

    line-height: 2rem;

    box-sizing: border-box;

    padding: 1.5rem 1rem;

    width: 150px;

  }



  .contact-page .gray-container .gray-2-container form .input {

    width: 60%;

    font-size: 2rem;

    letter-spacing: .3rem;

    line-height: 2rem;

    box-sizing: border-box;

    padding: 1.5rem 2rem;

    outline: none;

  }



  .contact-page .gray-container .gray-2-container form .salutation-box .input {

    width: 50%;

  }



  .contact-page .gray-container .gray-2-container form .salutation-box .input:focus {

    text-align: end;

  }



  .contact-page .gray-container .gray-2-container form .row:nth-child(n+4) {

    background-color: transparent;

  }



  .contact-page .gray-container .gray-2-container form .row:nth-child(n+4) .input {

    color: #333;

  }



  .contact-page .gray-container .gray-2-container form .input.detail {

    width: 95%;

  }



  .contact-page .gray-container .gray-2-container form .method-box {

    position: relative;

  }



  .contact-page .gray-container .gray-2-container form .row .salutation input,

  .contact-page .gray-container .gray-2-container form .row .method-select input {

    display: block;

    box-sizing: border-box;

    width: 100%;

    border: 1px solid burlywood;

    font-size: 2rem;

    letter-spacing: .5rem;

    line-height: 2rem;

    font-weight: bold;

    text-align: center;

    padding: 1rem 0;

    outline: none;

  }



  .contact-page .gray-container .gray-2-container form .method-box .hidden-select,

  .contact-page .gray-container .gray-2-container form .salutation-box .hidden-select {

    display: inline-block;

    width: 40%;

    background-color: transparent;

    border: none;

    /* float: right; */

    font-size: 1.5rem;

    line-height: 2rem;

    padding: 1.5rem 1rem;

    outline: none;

  }



  .contact-page .gray-container .gray-2-container form .method-box .hidden-select option,

  .contact-page .gray-container .gray-2-container form .salutation-box .hidden-select option {

    font-size: 2rem;

    letter-spacing: .3rem;

    line-height: 2rem;

    box-sizing: border-box;

    padding: 1.5rem 1rem;

    text-align: center;

    text-align-last: center;

    outline: none;

    /* border: 1px solid rgb(186,147,108); */

    box-shadow: none;

  }



  .contact-page .gray-container .gray-2-container form .sumit-btn {

    left: 50%;

    top: 100%;

  }



  .send img:first-child {

    width: 50%;

    margin-right: 6px;

  }



  .send span.play {

    width: 16%;

  }



  .contact-page .gray-container .information-container {

    width: 100%;

    overflow: hidden;

  }



  .contact-page .gray-container .information-container img:first-child {

    width: 1rem;

    vertical-align: top;

  }



  .contact-page .gray-container .information-container img:nth-child(2) {

    width: 35%;

    margin-top: -5%;

    margin-left: 0;

  }



  .contact-page .gray-container .phone.information-container .infortmation-part {

    width: 65%;

    display: inline-block;

    vertical-align: top;

  }



  .contact-page .gray-container .map {

    width: 104%;

    margin-left: -2%;

  }



  .contact-page .gray-container .map img {

    width: 100%;

  }



  .contact-page .gray-container .infortmation-part .resturant-info {

    position: relative;

  }



  .contact-page .gray-container .infortmation-part .resturant-info::before {

    content: '';

    display: block;

    background-color: burlywood;

    width: 4rem;

    height: .1rem;

    bottom: -1rem;

    position: absolute;

    left: 0;

    right: 0;

    margin: auto;

  }



  .contact-page .gray-container .infortmation-part .resturant-info tr {

    line-height: 3rem;

  }



  .contact-page .gray-container .infortmation-part .resturant-info tr td {

    letter-spacing: .2rem;

  }



  .contact-page .gray-container .infortmation-part .resturant-info tr td:nth-child(2) {

    font-size: 1.5rem;

  }



  .contact-page .gray-container .infortmation-part .resturant-info tr:first-child td {

    line-height: 2rem;

    white-space: initial;

  }



  .contact-page .gray-container .infortmation-part .resturant-info td:first-child {

    padding-right: .5rem;

  }



  #swiper9.swiper-container {

    overflow: visible;

  }



  #swiper9 .swiper-button-prev,

  #swiper9 .swiper-button-next {

    color: burlywood;

    outline: none;

  }



  #swiper9 .swiper-button-next,

  #swiper9 .swiper-container-rtl .swiper-button-prev {

    right: 0;

    margin-right: -3%;

  }



  #swiper9 .swiper-button-prev,

  #swiper9 .swiper-container-rtl .swiper-button-next {

    left: 0;

    margin-left: -3%;

  }



  #swiper9 .swiper-button-prev:after,

  #swiper9 .swiper-button-next:after {

    font-size: 3rem;

  }









  .contact-page .page-end .item-1 {

    width: 50%;

    top: -130%;

    left: 0px;

  }



  .contact-page .page-end .item-1:hover img {

    filter: brightness(.4);

  }

  .contact-page .page-end .item-1:hover .content h4 {

    border: .05rem solid #fff;

    color: #fff;

  }

  .contact-page .page-end .item-1:hover .content h4::before {

    background-color: #fff;

  }

  .contact-page .page-end .item-1:hover .content h3 {

    color: #fff;

  }



  .contact-page .page-end .item-1 .content {

    opacity: 0.85;

    top: 15%;

  }



  .contact-page .page-end .item-1 .content h3 {

    font-size: 2rem;

    letter-spacing: 1.2rem;

  }



  .contact-page .page-end .item-1 .content h4 {

    width: 5.5rem;

    letter-spacing: 0.3rem;

    margin: 2rem auto 0px;

  }



  .contact-page .page-end .item-1 .content h4::before {

    width: 3rem;

    margin: -1.2rem auto 0px;

  }



  .contact-page .page-end .item-2 {

    width: 50%;

    left: 49.99%;

    top: -130%;

    color: #fff;

  }



  .contact-page .gray-container.fix-gray {

    margin: -25% 2% auto 2%;

    padding-top: 25%;

    padding-bottom: 15%;

  }



  .contact-page .page-end .item-2 .content {

    opacity: .85;

    top: 15%;

  }



  .contact-page .page-end .item-2 img {

    filter: brightness(.4);

  }



  .contact-page .page-end .item-2 .content h3 {

    font-size: 2rem;

    letter-spacing: 1.2rem;

  }



  .contact-page .page-end .item-2 .content h4 {

    border: .05rem solid #fff;

    width: 6.5rem;

    letter-spacing: .3rem;

    margin: 2rem auto 0;

  }



  .contact-page .page-end .item-2 .content h4::before {

    background-color: #fff;

    width: 3rem;

    margin: -1.2rem auto 0;

  }



  .contact-page .footer-part img:first-child {

    display: none;

  }



  .contact-page .gray-container .computer.infortmation-part {

    display: none;

  }



  .contact-page .footer-part img:nth-child(3) {

    width: 25%;

  }



  .contact-page .footer-part footer {

    font-size: 1.5rem;

  }

}









/* 隱藏phone部分 */

@media screen and (min-width: 600px) {

  .contact-page header.phone {

    display: none;

  }



  .contact-page .phone {

    display: none;

  }



  .contact-page .gray-container img.arrow {

    display: none;

  }



  .contact-page .gray-container img.slogan {

    display: none;

  }



  .contact-page .gray-container .CPmap {

    display: none;

  }

}







/* 隱藏computer部分 */

@media screen and (max-width: 600px) {

  .contact-page header.computer {

    display: none;

  }



  .contact-page .computer:not(.gray-2-container) {

    display: none;

  }

}