@charset "UTF-8";

/* CSS Document */

/* common */

body #g-main {

  font-family: "ヒラギノ角ゴ Pro", Hiragino Kaku Gothic Pro, "メイリオ",

 Meiryo, sans-serif;

  font-weight: 300;

}



body #g-main a:hover,

body #g-main input[type="button"]:hover {

  -webkit-transition: all 0.5s;

  -moz-transition: all 0.5s;

  -ms-transition: all 0.5s;

  -o-transition: all 0.5s;

  opacity: 0.7;

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

}



body #g-main #case a:visited {

  color: #333;

}



body #g-main .sc-card-container {

  width: 100%;

  margin: 0 0 15px 0;

  padding: 0 0 15px 0;

  display: -webkit-box;

  display: -moz-box;

  display: -ms-box;

  display: -webkit-flexbox;

  display: -moz-flexbox;

  display: -ms-flexbox;

  display: -webkit-flex;

  display: -moz-flex;

  display: -ms-flex;

  display: flex;

  -webkit-box-lines: multiple;

  -moz-box-lines: multiple;

  -webkit-flex-wrap: wrap;

  -moz-flex-wrap: wrap;

  -ms-flex-wrap: wrap;

  flex-wrap: wrap;

}



body #g-main #sc-results {

  margin: 0 -15px;

  padding: 30px 15px;

  background-color: #f7f8f8;

}



body #g-main .sc-card {

  position: relative;

  width: 23%;

  margin-left: 1%;

  margin-right: 1%;

  margin-bottom: 15px;

  padding-bottom: 5px;

  background-color: #fff;

  border-bottom: 1px solid #f2f2f2;

  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.1);

  cursor: pointer;

  transition: 0.2s all ease;

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

}



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

  body #g-main .sc-card {

    width: 48%;

  }

}



body #g-main .sc-card:hover {

  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.3);

  transform: translateY(-5px);

  background-color: rgba(48, 146, 225, 0.1);

}



body #g-main .sc-card figure {

  width: 100%;

  margin: 0;

  line-height: 0;

  overflow: hidden;

}



body #g-main .sc-card figure img {

  width: 100%;

  margin: 0;

}



body #g-main .sc-card.restaurant figure::before {

  position: absolute;

  display: block;

  content: "";

  top: 0;

  left: 0;

  width: 99%;

  padding-top: 58%;

  border: 2px solid #f7c429;

}



body #g-main .sc-card.restaurant figure::after {

  position: absolute;

  display: block;

  content: "";

  top: -3px;

  right: 10px;

  width: 18%;

  padding-top: 18%;

  background: 0 0 no-repeat url("/-/media/Project/Daikin/ac_daikin_co_jp/kanki/case/assets/images/mark_restaurant svg");

  background-size: 100% auto;

}



body #g-main .sc-card .sc-card-details {

  padding: 0;

  color: #333;

}



body #g-main .sc-card .sc-card-details .sc-card-market,

body #g-main .sc-card .sc-card-details .sc-card-city {

  display: inline-block;

  padding: 3px 0;

  float: left;

  width: 50%;

  font-size: 0.8em;

  text-align: center;

}



body #g-main .sc-card .sc-card-details .sc-card-market {

  background-color: #727b81;

  color: #fff;

}



body #g-main .sc-card .sc-card-details .sc-card-city {

  background-color: #f7f8f8;

}



body #g-main .sc-card .sc-card-details .sc-card-name {

  clear: both;

  padding: 10px;

}



body #g-main .sc-card a:hover {

  color: #333;

  text-decoration: none !important;

}



body #g-main .sc-card .sc-card-tabelog {

  text-align: center;

  line-height: 0;

}



body #g-main .sc-card .sc-card-tabelog img {

  width: 90%;

}



body #g-main .sc-card .sc-card-tabelog a {

  display: block;

  width: 100%;

  height: 27px;

  background: center 0 no-repeat url("/-/media/Project/Daikin/ac_daikin_co_jp/kanki/case/assets/images/bt_tabelog svg");

}



/* more　-------kanki踏襲 */

#more {

  background: #f7f8f8;

  margin: auto -15px;

  padding: 90px 20px 120px;

  text-align: center;

}



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

  #more {

    padding: 60px 0 60px;

  }

}



.more__logo {

  margin: 0 auto 40px;

  width: 480px;

  transform: translateY(20px);

}



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

  .more__logo {

    width: 280px;

  }

}



.more__logo[data-scrollanm="show"] {

  opacity: 1;

  transition: opacity 1s ease 0s, transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;

  transform: translateY(0);

}



.more__title {

  font-size: 39px;

  letter-spacing: 0.1em;

  line-height: 60px;

  margin: 0 0 40px;

  transform: translateY(20px);

}



.more__title[data-scrollanm="show"] {

  opacity: 1;

  transition: opacity 1s ease 0s, transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;

  transform: translateY(0);

}



.more__subtitle {

  font-size: 24px;

  letter-spacing: 0.1em;

  line-height: 45px;

  margin: 0 0 25px;

  transform: translateY(20px);

}



.more__subtitle[data-scrollanm="show"] {

  opacity: 1;

  transition: opacity 1s ease 0s, transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;

  transform: translateY(0);

}



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

  .more__subtitle {

    font-size: 18px;

    line-height: 2em;

    margin: 0 0 15px;

  }

}



.more__bar {

  background: #dcdddd;

  height: 5px;

  margin: 0 auto 45px;

  width: 50px;

  transform: translateY(20px);

}



.more__bar[data-scrollanm="show"] {

  opacity: 1;

  transition: opacity 1s ease 0s, transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;

  transform: translateY(0);

}



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

  .more__bar {

    margin: 0 auto 35px;

  }

}



.more__lead {

  font-feature-settings: "palt";

  font-size: 18px;

  letter-spacing: 0.1em;

  line-height: 2em;

  margin: 0 auto 45px;

  transform: translateY(20px);

}



.more__lead[data-scrollanm="show"] {

  opacity: 1;

  transition: opacity 1s ease 0s, transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;

  transform: translateY(0);

}



.more__movie {

  height: calc((100vw - 40px) * 0.563);

  margin: 0 auto;

  max-height: 540px;

  max-width: 960px;

  width: 100%;

  transform: translateY(20px);

}



.more__movie[data-scrollanm="show"] {

  opacity: 1;

  transition: opacity 1s ease 0s, transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;

  transform: translateY(0);

}



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

  .more__movie {

    height: 56.3vw;

  }

}



.more__movie iframe {

  height: 100%;

  width: 100%;

}



.more__text {

  font-size: 18px;

  letter-spacing: 0.1em;

  line-height: 2em;

  margin: 0 auto 25px;

  transform: translateY(20px);

}



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

  .more__text {

    margin: 0 auto 20px;

  }

}



.more__text[data-scrollanm="show"] {

  opacity: 1;

  transition: opacity 1s ease 0s, transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;

  transform: translateY(0);

}



.more__subtitle {

  color: #43c7f4;

  font-size: 30px;

  font-weight: 700;

  transform: translateY(20px);

}



.more__subtitle[data-scrollanm="show"] {

  opacity: 1;

  transition: opacity 1s ease 0s, transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;

  transform: translateY(0);

}



.more__bn {

  margin: -5px auto 80px;

  max-width: 960px;

  transform: translateY(20px);

}



.more__bn[data-scrollanm="show"] {

  opacity: 1;

  transition: opacity 1s ease 0s, transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;

  transform: translateY(0);

}



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

  .more__bn {

    margin: -15px auto 45px;

    max-width: 345px;

    padding: 0 15px;

  }

}



.more__bn a {

  display: block;

  transition: all 250ms ease;

}



.more__bn a .hover,

.more__bn a:hover {

  opacity: 0.7;

}



.more__bn img {

  width: 100%;

}



.more__links {

  max-width: 960px;

}



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

  .more__links {

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    -ms-flex-pack: justify;

    justify-content: space-between;

    margin: 45px auto 0;

  }

}



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

  .more__links {

    margin: 0 15px;

  }

}



.more__links li {

  transform: translateY(20px);

}



.more__links li[data-scrollanm="show"] {

  opacity: 1;

  transition: opacity 1s ease 0s, transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;

  transform: translateY(0);

}



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

  .more__links li {

    max-width: 460px;

    width: calc(50% - 20px);

  }

}



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

  .more__links li + li {

    margin: 40px 0 0;

  }

}



.more__links li:nth-of-type(1) {

  transition-delay: 0s;

}



.more__links li:nth-of-type(2) {

  transition-delay: 150ms;

}



.more__links a {

  -ms-flex-align: center;

  align-items: center;

  box-sizing: border-box;

  display: -ms-flexbox;

  display: flex;

  -ms-flex-direction: column;

  flex-direction: column;

  height: 100%;

  -ms-flex-pack: start;

  justify-content: flex-start;

  padding: 10px 10px 30px;

  position: relative;

  text-decoration: none;

}



.more__links a::before {

  background: #fff;

  bottom: 0;

  box-shadow: 0 0 6px rgba(0, 0, 0, 0.4);

  content: "";

  left: 0;

  position: absolute;

  right: 0;

  top: 0;

  z-index: 1;

  transition: all 250ms ease;

}



.more__links a::after {

  border: 1.5px solid #43c7f4;

  bottom: 10px;

  box-sizing: border-box;

  content: "";

  left: 10px;

  margin: auto;

  position: absolute;

  right: 10px;

  top: 10px;

  z-index: 1;

  transition: all 250ms ease;

}



.more__links a:visited {

  color: #000;

}



.more__links a .hover,

.more__links a:hover {

  text-decoration: none;

}



.more__links a .hover::before,

.more__links a:hover::before {

  bottom: -10px;

  left: -10px;

  right: -10px;

  top: -10px;

}



.more__links a .hover::after,

.more__links a:hover::after {

  bottom: 0;

  left: 0;

  right: 0;

  top: 0;

}



.more__links a::after {

  content: none;

}



.more__links a div,

.more__links a img {

  position: relative;

  z-index: 10;

}



.more__links a img {

  width: 100%;

  -ms-flex-negative: 0;

  flex-shrink: 0;

}



.more__links a div {

  -ms-flex-align: center;

  align-items: center;

  border: 1px solid #43c7f4;

  border-radius: 50px;

  color: #43c7f4;

  display: -ms-flexbox;

  display: flex;

  font-size: 15px;

  height: 50px;

  -ms-flex-pack: center;

  justify-content: center;

  letter-spacing: 0.1em;

  margin: 30px 0 0;

  width: 240px;

  transition: all 250ms ease;

}



.more__links a .hover div,

.more__links a:hover div {

  background: #43c7f4;

  color: #fff;

}