/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
  padding-bottom: 3rem;
  color: #5a5a5a;
}

/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
  margin-bottom: 1.5rem;
  text-align: center;
}
.marketing h2 {
  font-weight: 400;
}
/* rtl:begin:ignore */
.marketing .col-lg-4 p {
  margin-right: .75rem;
  margin-left: .75rem;
}
/* rtl:end:ignore */


/* Featurettes
------------------------- */

.featurette-divider {
  margin: 5rem 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  /* rtl:remove */
  letter-spacing: -.05rem;
}

/* Google font Icon */
@import url(https://fonts.googleapis.com/icon?family=Material+Icons);
@import url(https://fonts.cdnfonts.com/css/cinzel);
@import url(https://fonts.cdnfonts.com/css/chewy);

.lead-text {
 text-align: center;
 background-color: #DE2D2B;
 padding: 4px o;
 color: white;
}

.navbar-toggle {
  z-index: 2;
}

.navbar-brand-center {
  position: absolute;
  left: calc(50% - 99px);
  top: 0;
  text-align: center;
  margin: auto;
}
.navbar-brand-center img {
  width: 198px;
  height: 116px;
}
nav .nav-link, .menu-text {
 color: #DE2D2B;
 font-family: Cinzel;
 font-size: 1.2rem;
 font-weight: 600;
}
nav a:hover.nav-link {
  color: #a60c09;
}

.home-link:before{
	position:relative;
	top: 12px;
	right: 4px;
	content: "\e88a";
	font-family: "Material Icons";
  font-size: 40px;
	transition: 0.4s;
  line-height: 20px;
}
.company-link:before{
	position:relative;
	top: 12px;
	right: 4px;
	content: "\ea40";
	font-family: "Material Icons";
  font-size: 40px;
	transition: 0.4s;
  line-height: 20px;
}
.contact-link:before{
	position:relative;
	top: 12px;
	right: 4px;
	content: "\e94c";
	font-family: "Material Icons";
  font-size: 40px;
	transition: 0.4s;
  line-height: 20px;
}
nav .nav-link.sns-link{
  font-size: 32px;
  color: #DE2D2B;
  padding: 0 0.5rem;
  line-height: 32px;
}
.nav-sns .navbar-nav {
  display: flex;
  flex-direction:row;
}
.menu-icon svg {
  width: 29px;
  fill:#DE2D2B;
}
.navbar-toggler {
  padding: 0.25rem 0;
}
.modal-body{
  background-color: #DE2D2B;
  color: #ffffff;
}
.modal-header {
  display: block;
  padding: 1rem 0.5rem;
  border-bottom: none;
  color: #DE2D2B;
  text-align: center;
}
.modal-body .btn-close {
  box-sizing: content-box;
  height: 1em;
  padding: 0 0 20px 0;
  color: #fff;
  background: none;
  border: 0;
  opacity: 1;
  position: fixed;
  right: 0;
  width: 130px;
  font-family: 'Cinzel';
  font-size: 1.25rem;
  font-weight: 600;
}
.modal-body .btn-close:after{
  position:relative;
	top: 13px;
	left: 0;
	content: "\e5cd";
	font-family: "Material Icons";
  font-size: 40px;
  line-height: 0;
}
.modal-nav{
  margin-top: 60px;
  width: 100%;
}
.modal-brand{
  margin-left: calc(50% - 72px);
}
ul.modal-menu{
  width: 260px;
  margin-left: calc(50% - 120px);
  padding-left:0;
}
ul.modal-menu li{
  list-style:none;
  padding: 10px 0;
}
ul.modal-menu li a{
  color: #fff;
  text-decoration: none;
  font-size: 1.25rem;
  line-height: 2rem;
}
ul.modal-menu li a:before{
	position:relative;
	top: 12px;
	right: 4px;
	content: "\e94c";
	font-family: "Material Icons";
  font-size: 40px;
  line-height: 20px;
}
ul.modal-menu li a.modal-home:before, ul.footer-menu li a.footer-home:before{
	content: "\e88a";
}
ul.modal-menu li a.modal-company:before, ul.footer-menu li a.footer-company:before{
	content: "\ea40";
}
ul.modal-menu li a.modal-contact:before, ul.footer-menu li a.footer-contact:before{
	content: "\e94c";
}
ul.modal-menu li a.modal-mail:before, ul.footer-menu li a.footer-mail:before{
	content: "\e158";
}
ul.modal-menu li a.modal-privacy:before, ul.footer-menu li a.footer-privacy:before{
	content: "\ea17";
}
ul.modal-sns, ul.footer-sns{
  padding-left:0;
  text-align:center;
}
ul.modal-sns li, ul.footer-sns li{
  list-style:none;
  display: inline-block; 
  padding: 0 5px;
}
ul.modal-sns a{
  color: #fff;
}
ul.modal-sns i, ul.footer-sns i{
  font-size: 40px;
  line-height: 40px;
}

ul.footer-sns a{
  color: #DE2D2B;
}

ul.footer-menu li a{
  color:#DE2D2B;
  text-decoration: none;
  font-size: 1.25rem;
  line-height: 3rem;
}
ul.footer-menu li a:hover, ul.footer-sns a:hover{
   color: #a60c09;
 }

ul.footer-menu{
  padding-left:0;
  text-align: center;
}
ul.footer-menu li{
  list-style:none;
  padding: 10px;
  display:block;
  white-space: nowrap;
}

ul.footer-menu li a:before{
	position:relative;
	top: 12px;
	right: 4px;
	content: "\e94c";
	font-family: "Material Icons";
  font-size: 40px;
  line-height: 20px;
}

header {
  min-height: 168px;
}
.marketing{
  background-color:#ffffcb;
  background-image: url(../images/bg-overlay-dog.png), url(../images/sunburst-yellow.png);
  background-position: bottom right, -2px 130px;
  background-repeat: no-repeat, no-repeat;
  opacity: 1, 1;
}
.element1 {
  position: relative;
}
.element1 img {
  margin-top: 60px;
  height: auto;
  max-width: 100%;
  border: none;
}
.element2 {
  text-align: center;
}
.element2 img {
  margin-top: 30px;
  height: auto;
  max-width: 100%;
  border: none;
}
.element2 .btn {
  background-color: #DE2D2B;
  color: #fff;
}
.lineups{
  margin: 80px 0;
  text-align: center;
}
.lineups .en{
  font-family: 'Cinzel';
  font-weight: 600;
}
.lineups h2{
  color: #DE2D2B;
  padding: 20px 0;
}
.lineups h3{
  color: #000;
  padding: 20px 0;
}
.lineup-row {
  width: 100%;
  display: flex;
  margin-bottom: 40px;
  flex-wrap: wrap;
}
.lineup {
  position: relative;
  display: flex;
  width: 50%;
  padding: 6px;
}
.lineup img{
  width: 100%;
}
.lineup p {
  position: absolute;
  text-align: center;
  width: calc(100% - 12px);
  top: 2.4rem;
  font-size: 1.25rem;
  font-family: 'Cinzel';
  color: #000;
  font-weight: 600;
}
.news{
  text-align: center;
  padding: 60px 0;
  background-color: #44D295;
}
.news h2{
  color: #3757FF;
  padding: 20px 0 40px;
  font-weight: 600;
}
.news dt {
  color: #3757FF;
  font-weight: 500;
}
.news dd {
  padding: 10px 0 40px;
}
.news a {
  color: #000;
  text-decoration:none;
}
.news a:hover {
  color: #3757FF;
  text-decoration:underline;
}
.features{
  text-align: center;
  padding: 60px 0;
  background-color: #FCE8CB;
}
.features h2{
  color: #000;
  padding: 20px 0 40px;
  font-weight: 600;
}
.point-row {
  width: 100%;
  display: flex;
  margin: 40px 0;
  flex-wrap: wrap;
}
.points {
  max-width: 960px;
  margin: 0 auto;
}
.point {
  position: relative;
  width: 50%;
  padding: 6px;
}
.point1 img, .point3 img{
  width: 100%;
  height: auto;
}
.point2 img, .point4 img{
  width: 86%;
  height: auto;
  margin: 0 7%;
}
.reviews{
  text-align: center;
  padding: 60px 0;
  background-color:#DE2D2B;
  color: #fff;
}
.reviews h2{
  padding: 20px 0 40px;
  font-weight: 600;
}
.review-row {
  width: 100%;
  display: flex;
  margin-bottom: 40px;
  flex-wrap: wrap;
}
.review {
  position: relative;
  width: 100%;
  padding: 20px;
}
.review-content{
  color: #000;
  background-color: #fff;
  text-align: left;
  padding: 16px;
  border-radius: 20px;
  margin-bottom: 12px;
}
.review-content:after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  background-color: #FFFFFF;
  left: 50%;
  position: absolute;
  -webkit-transform: scaleX(.75) rotate(45deg);
  -ms-transform: scaleX(.75) rotate(45deg);
  transform: scaleX(.75) rotate(45deg);
  border-width: 0;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  margin-top: 7px;
}
.reporter {
  color: #FFFFFF;
  font-family: "Chewy", Sans-serif;
  font-size: 32px;
  font-weight: 300;
}
.mail-entry{
  text-align: center;
  padding: 60px 0;
  background-color:#F5E751;
  background-image: url(../images/bg-overlay-dog-on-beach2.jpg);
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: 100%;
  opacity: 1;
}
.mail-entry h2{
  padding: 20px 0 40px;
  color: #DE2D2B;
  font-weight: 600;
}
.footer-nav{
  padding: 40px 0 0;
}
.title{
  padding: 32px 0;
  background-color: #DE2D2B;
  color: #fff;
  text-align: center;
}
.title h1 .en, .title h2 .en{
  font-family: 'Cinzel';
}
.title h1 .ja, .title h2 .ja{
  font-size: calc(1rem + 1vw);
}
.news-info article {
  margin: 40px 0;
 }
.news-info article header {
 height: auto;
 margin: 0 0 40px;
}
.news-info .date {
  color: #87796F;
 }
 .news-info a {
  color:#DE2D2B;
 }
 .news-info a:hover {
  color:#a60c09;
 }
.company-info{
  margin: 20px 0;
  text-align: center;
}
.company-info dt{
  padding: 20px 0 0;
}
.company-info dd{
  border-bottom: solid #000 1px;
  padding: 20px 0;
  margin-bottom: 0;
}
.contact{
  background-color: #ffffcb;
  padding: 40px 0;
  text-align: center;
}
.contact .btn{
  background-color:#DE2D2B;
  color: #fff;
}
.privacy{
  margin: 40px 0;
}
.privacy h2{
  font-size: calc(1.25rem + .9vw);
  margin: 2rem 0 0.5rem;
}
.thanks-info{
  margin: 40px 0;
}

@media (min-width: 576px) {
  .point {
    width: 25%;
  }
  .review {
    width: 50%;
  }
  .review3 {
    margin-left: 25%;
  }
  .company-info{
    text-align: left;
  }
  .company-info dt{
    border-bottom: solid #000 1px;
    padding: 20px 0;
  }
}

@media (min-width: 768px) {
  .nav-sns {
    display: none;
  }
  ul.footer-menu li{
    display: inline;
  }
  .lineup {
    width: 33%;
  }
  .review {
    width: 33%;
  }
  .review3 {
    margin-left: 0;
  }
  nav .nav-link {
    margin-top: 38px;
  }
  nav .nav-link.sns-link {
    padding: 10px 0.5rem 0;
  }
  .contact{
    text-align: right;
  }
}

@media (min-width: 992px) {
  .lineup {
    width: 20%;
  }
  .raw-dinner{
    margin-left: 10%;
  }
}


/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 40em) {
  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 1.25rem;
    font-size: 1.25rem;
    line-height: 1.4;
  }

  .featurette-heading {
    font-size: 50px;
  }
}

@media (min-width: 62em) {
  .featurette-heading {
    margin-top: 7rem;
  }
}
