@charset "utf-8";
/* CSS Document */

/*===============================================
●For Desktop Min Width 769px
===============================================*/
html {
	overflow:auto !important;
}

body {
	overflow: hidden !important;
	min-width: 300px !important;
}
#top {
  background-size: cover;
  font-weight: bolder;
  text-align: center;
  overflow: hidden;
}

#top .ttl {
  position: relative;
  margin: 0 auto;
  height: 300px;
  z-index: 3;
}


#top h1 {
  margin: 0;
  padding: 80px 0 0 0;
  font-size: 2.4em;
  font-weight: bolder;
  position: relative;
  z-index: 2;
}

#bg {
	/*background-image: url(images/bg_bluefuji_min2.png);*/
	background-position: center top;
	background-size: cover;
	background: #000;
	margin: 0;
	/*height: 360px;*/
}

#sale {
  font-family: 'Roboto', sans-serif;
}
#sale_header {
  position: relative;
  height: 400px;
  background: url(images/en_bg.jpg) no-repeat 50% 0%;
  /*background:url(images/lp_bg_daisale.jpg) no-repeat 50% 100%;*/
  background-size: cover;
  text-align: center;
  color: #333;
}

#top_logo {
	text-align: center;
}

#top_logo img {
	width: 300px;
	margin: 0 auto;
	display: block;
}

#dog1 {
	position: absolute;
	right: 200px;
	top: 510px;
	z-index: 10;
}

#dog2 {
	position: absolute;
	left: -150px;
	top: 800px;
	z-index: 10;
}

#sale_ttl {
  margin: 10px 0 0 0;
}

#sale_header h2 {
  font-size: 1.4rem;
  font-weight: 300;
  padding: 0 0 5px 0;
}

#sale_header p {
  font-size: 1.6rem;
  font-weight: 400;
  padding: 0 0 20px 0;
}

#header_btn {
	margin: 20px 0 0 0;
  padding: 10px 0;
}

#header_btn a {
  padding: 15px 20px;
  border: 2px solid #333;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  color: #333;
}

#header_btn a:hover {
  text-decoration: none;
  background: rgba(255,255,255,0.4)
}

#sale_content,
#hours,
#sale_bottom {
  text-align: center;
  padding: 35px 0 50px 0;
}

#sale_bottom {
	margin: 0 auto;
	max-width: 960px;
}

#sale_content h1 {
	color: #db1b11;
	font-size: 2em;
}

#sale_bottom h2 {
	padding: 10px 0;
}

#sale_bottom p {
	padding: 0 0 10px 0;
}

.sns_block {
	display: block;
	width: 46%;
	float: left;
	margin: 2%;
	text-align: center;
}

.btn_facebook {
	width: 70%;
}

#sale_content p {
  font-size: 1.2rem;
  padding: 0 0 10px 0;
}

#sale_content h2 {
  padding: 10px 0;
  font-size: 2rem;
  font-weight: 700;
}

#reason {
  background: #f1f1f1;
}

#reason_content {
  padding: 20px 0;
  margin: 0 auto;
  max-width: 960px;
  width: 100%;
}

#reason_content h2 {
  padding: 10px 0;
  font-size: 2rem;
  font-weight: 700;
  text-align: center;
}

.reason_block {
  margin: 0 1%;
  width: 31.3%;
  float: left;
}

.reason_block img {
  display: block;
  margin: 0 auto;
}

.reason_block h3 {
  padding: 0 0 10px 0;
}

.reason_block p {
  padding: 0 0 20px 0;
}

.clear {
  clear: both;
}

.button {
  padding: 20px 0;
  text-align: center;
}

.button img:hover {
  opacity: 0.7;
}

#dog_icon {
	display: block;
	margin: 20px auto 0 auto;
}

.news_block {
  max-width: 920px;
	width: 90%;
	border: 1px solid #ea4500;
	background: #fffee9;
	margin: 0 auto 10px auto;
	padding: 10px 20px 20px 20px;
}

.news_block h3 {
  text-align: center;
  font-size: 1.4em;
  padding: 10px 0;
}

#sale_content .news_block p{
  font-size: 1.1rem;
}

#note {
	border: 1px solid #fead00;
	background: #fff5df;
	padding: 10px;
	margin: 10px 50px;
}

#hours h2 {
	padding: 0 0 20px 0;
}

#store_hour {
	width: 60%;
	margin: 0 auto;
	border-top: 1px solid #e6e6e6;
	border-left: 1px solid #e6e6e6;
	text-align: left;
}

#store_hour th {
	padding: 5px;
	border-right: 1px solid #e6e6e6;
	border-bottom: 1px solid #e6e6e6;
	font-weight: 600;
	background: #f5f4f2;
	text-align: right;
	vertical-align: top;
}

#store_hour td {
	padding: 5px;
	border-right: 1px solid #e6e6e6;
	border-bottom: 1px solid #e6e6e6;]
	text-align: left;
}


#hours {
	display: block;
	width: 80%;
	background-color: #ffe955;
	margin: 20px 10%;
	padding: 20px;
}

#hours h3 {
	text-align: center;
	font-size: 1.5em;
	font-weight: bolder;
	color: #074395;
}

#hours p {
	font-size: 1.2em;
}

ul#timer {
	list-style: none;
	margin: 0 0 20px 0;
	padding: 0;
	display: block;
	text-align: center;
}
ul#timer li {
	display: inline-block;
}
ul#timer li span {
	font-size: 80px;
	font-weight: 300;
	line-height: 80px;
}
ul#timer li.seperator {
	font-size: 80px;
	line-height: 70px;
	vertical-align: top;
}
ul#timer li p {
	color: #a7abb1;
	font-size: 25px;
}

.sale_content {
  padding: 20px 0;
  margin: 0 auto;
  max-width: 960px;
  width: 100%;
}

.point {
  display: block;
  width: 50%;  
  padding: 2.5%;
  float: left;
  background-color: #f1f1f1;
text-align: center;
}

.point img {
  width: 100%;
}

.point h3 {
  color: #000;
  padding: 15px;
  margin: 15px 15px;
  font-size: 1.3em;
  line-height: 1.4em;
  clear: both;
  text-align: center;
}

.point p {
  font-size: 0.9em;
  margin: 15px 15px;
  padding: 15px 25px;
  text-align: center;
}


.point2 {
  display: block;
  width: 50%;  
  padding: 2.5%;
  float: left;
  background-color: #fff;
text-align: center;
}

.point2 img {
  width: 100%;
}

.point2 h3 {
  color: #000;
  padding: 15px;
  margin: 15px 15px;
  font-size: 1.3em;
  line-height: 1.4em;
  clear: both;
  text-align: center;
}

.point2 p {
  font-size: 0.9em;
  margin: 15px 15px;
  padding: 15px 25px;
  text-align: center;
}



.point3 {
  display: block;
  width: 50%;  
  padding: 2.5%;
  float: left;
  background-color: #fff;
text-align: center;
}

.point3 img {
  width: 100%;
}

.point3 h3 {
  color: #000;
  padding: 15px;
  margin: 15px 15px;
  font-size: 1.3em;
  line-height: 1.4em;
  clear: both;
  text-align: center;
}

.point3 p {
  font-size: 0.9em;
  margin: 15px 15px;
  padding: 15px 25px;
  text-align: center;
}



.point4 {
  display: block;
  width: 50%;  
  padding: 2.5%;
  float: left;
  background-color: #f1f1f1;
}

.point4 img {
  width: 100%;
}

.point4 h3 {
  color: #000;
  padding: 15px;
  margin: 15px 15px;
  font-size: 1.3em;
  line-height: 1.4em;
  clear: both;
  text-align: center;
}

.point4 p {
  font-size: 0.9em;
  margin: 15px 15px;
  padding: 15px 25px;
  text-align: left;
}


/*===============================================
●For Tablet Max Width 768px
===============================================*/
@media screen and (max-width: 768px){
#top .ttl {
	height: auto;
}

.swiper-button-prev,
.swiper-button-next {
  	display: none;
}

.sliding {
    width: 100%;
    top: 0px;
}

.btn_facebook {
	width: 80%;
}

#bg {
		height: 400px;
}

#top .ttl {
	width: 80%;
    margin: 30px auto 0 auto;
}

#top h1 {
	font-size: 1.2em;
}

#hatsuyume_content img {
  	width: 100%;
}

  #sale_header {
    height: 350px;
  }

  #sale_ttl {
    width: 80%;
    margin: 60px 0 0 0;
  }

  #sale_header h2 {
    font-size: 1.2rem;
    font-weight: 300;
    padding: 0 0 5px 0;
  }

  #sale_header p {
    font-size: 1.4rem;
    font-weight: 400;
    padding: 0 0 20px 0;
  }

  #sale_content h2 {
    font-size: 2.4rem;
  }

}

/*===============================================
●For Mobile Max Width 640px
===============================================*/
@media screen and (max-width:640px){
  #sale_header {
    height: 210px;
  }


	#bg {
			height: 170px;
		}

	  #top .ttl {
	  	width: 80%;
	    margin: 20px auto 0 auto;
	  }

.sns_block {
	width: 80%;
	margin: 10px 10%;
}

.btn_facebook {
	width: 80%;
}


  #dog1 {
    position: absolute;
    right: -150px;
    top: 350px;
    z-index: 10;
  }

  #dog2 {
    position: absolute;
    left: -200px;
    top: 250px;
    z-index: 10;
  }

  #sale_ttl {
    width: 65%;
    margin: 10px 0 0 0;
  }
  #sale_header h2 {
    font-size: 0.9rem;
    font-weight: 300;
    padding: 0 0 5px 0;
  }

  #sale_header p {
    font-size: 1.2rem;
    font-weight: 400;
    padding: 0 0 20px 0;
  }

  #header_btn {
    display: none;
  }

  #sale_content p {
    font-size: 1.2rem;
  }

  #sale_content h2 {
    font-size: 1.8rem;
  }

  #reason_content h2 {
    font-size: 1.6rem;
  }

.reason_block {
  margin: 0 1%;
  width: 98%;
  float: none;
  text-align: center;
}

.button img {
  width: 90%;
}

.bnr_sale {
	width: 100%;
}

ul#timer li span {
	font-size: 40px;
	font-weight: 300;
	line-height: 40px;
}
ul#timer li.seperator {
	font-size: 40px;
	line-height: 40px;
	vertical-align: top;
}
ul#timer li p {
	color: #a7abb1;
	font-size: 18px;
}

.point {
  display: block;
	width: 100%;
min-height: auto;
  float: none;
text-align: center;
}

.point img {
  width: 100%;
}



.point2 {
  display: block;
	width: 100%;
min-height: auto;
  float: none;
  background-color: #fff;
text-align: center;
}

.point2 img {
  width: 100%;
}


.point3 {
  display: block;
width: 100%;
min-height: auto;
float: none;
  background-color: #fff;
text-align: center;
}

.point3 img {
  width: 100%;
}


.point4 {
  display: block;
width: 100%;
min-height: auto;
 float: none;
}

.point4 img {
  width: 100%;
}


}