@charset "utf-8";
html,body,div,span,iframe,h1,h2,h3,h4,h5,h6,p,img,small,strong,b,dl,dt,dd,ol,ul,li,
form,label,legend,table,tbody,tfoot,thead,tr,th,td,footer,header,menu,nav,section,video {
  margin:0; padding:0; border:0; outline:0; vertical-align:bottom; background:transparent;
}
body { line-height:1; -webkit-text-size-adjust: 100%;}
ul li { list-style:none;}
img { width: 100%;}
a { margin:0; padding:0; color: #666; text-decoration: none; vertical-align:baseline;}
a:hover { opacity: 0.7;}
table { border-spacing:0;}
/* ===================================================================================
  resetここまで
=================================================================================== */
body * {
	font-family: '游明朝', 'Yu Mincho', '游明朝体', 'YuMincho', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', serif;
	color: #333;
	font-size: 3.7vw;
}
.pc_none { display: block;}
.sp_none { display: none;}

.sec01 { background: url("../img/sp_bg01.jpg") no-repeat top center/100%;}
.sec02 { background: url("../img/sp_bg02.jpg") no-repeat top center/100%; height: 98.7vw;}
.sec03 { background: url("../img/sp_bg03.jpg") no-repeat top center/100%; height: 70.4vw;}
.sec04 {
  background:
    url("../img/sp_bg_deco.png") repeat-y top center/100%,
    url("../img/sp_bg04.jpg") repeat-y top center/100%;
}


.sec02 .rank_area {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 92vw;
  margin: 0 auto;
  padding-top: 18.4vw;
}
.sec02 .rank_area li {
  position: relative;
  margin-right: 2.7vw;
}
.sec02 .rank_area li:nth-child(-n+3) { margin-bottom: 16vw;}
.sec02 .rank_area li:nth-child(3),
.sec02 .rank_area li:last-child { margin-right: 0;}
.sec02 .rank_area li .rank {
  text-align: center;
  width: 28.8vw;
  position: absolute;
  top: -11.7vw;
  left: 0;
  right: 0;
  z-index: 5;
  filter: drop-shadow(0.3vw 0.3vw 0.4vw rgba(0,0,0,0.1));
}
.sec02 .rank_area li .rank img { width: 100%;}
.sec02 .rank_area li .rank_img {
  background: #fff;
  border-radius: 0.5vw;
  padding: 1.3vw;
  filter: drop-shadow(0.5vw 0.5vw 0.8vw rgba(0,0,0,0.1));
}
.sec02 .rank_area li .rank_img img { width: 26.1vw;}

.sec03 .inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 92vw;
  margin: 0 auto;
  padding-top: 6.3vw;
}
.sec03 .inner p { margin-right: 2.7vw;}
.sec03 .inner p:nth-child(-n+3) { margin-bottom: 5.1vw;}
.sec03 .inner p:nth-child(3),
.sec03 .inner p:last-child { margin-right: 0;}
.sec03 .inner p img { width: 28.8vw;}

.sec04 .inner {
  width: 94.7vw;
  margin: 0 auto;
}
.sec04 .inner > div { padding-bottom: 3.3vw;}
.sec04 h2 {
  font-size: 9.3vw;
  font-weight: bold;
  text-align: center;
  letter-spacing: 3.3vw;
  padding: 7.3vw 0 5.3vw;
}
.sec04 .box {
  margin-top: 4vw;
  border-left: 1px solid #b48f42;
  border-right: 1px solid #b48f42;
  background: #fff;
  box-shadow: 0.5vw 0.5vw 0.8vw rgba(0,0,0,0.1);
}
.sec04 .box:first-child { margin-top: 0;}
.sec04 .box::before,
.sec04 .box::after{
  content: "";
  display: block;
  height: 1px;
  background: -webkit-linear-gradient(left, rgba(180,143,66,1) 0%, rgba(236,204,128,1) 25%, rgba(255,233,206,1) 50%, rgba(236,204,128,1) 75%, rgba(180,143,66,1) 100%);
  background: -o-linear-gradient(left, rgba(180,143,66,1) 0%, rgba(236,204,128,1) 25%, rgba(255,233,206,1) 50%, rgba(236,204,128,1) 75%, rgba(180,143,66,1) 100%);
  background: linear-gradient(to right, rgba(180,143,66,1) 0%, rgba(236,204,128,1) 25%, rgba(255,233,206,1) 50%, rgba(236,204,128,1) 75%, rgba(180,143,66,1) 100%);
}

.sec04 .box .top {
  width: 86.7vw;
  margin: 0 auto;
  padding: 4vw 0;
}
.sec04 .box .top .img { width: 86.7vw;}
.sec04 .box .top .img img { width: 100%;}
.sec04 .box .top .text_area { width: 86.7vw;}
.sec04 .box .top .text_area h3 {
  font-size: 5.1vw;
  line-height: 1.1;
  padding-bottom: 2vw;
  margin: 4vw 0 2.7vw;
  border-bottom: 1px solid #333;
}
.sec04 .box .top .text_area .text {
  text-align: justify;
  line-height: 1.42;
  margin-bottom: 3.3vw;
}
.sec04 .box .top .text_area .sale_text {
  font-size: 4.3vw;
  text-align: center;
  font-weight: bold;
  margin: 2vw 0 1.3vw;
}
.sec04 .box .top .text_area .price_area {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 2.7vw;
}
.sec04 .box .top .text_area .price_area li.free {
  color: #fff;
  font-size: 3.7vw;
  line-height: 6.7vw;
  text-align: center;
  background: #d43535;
  width: 20vw;
  height: 6.7vw;
}
.sec04 .box .top .text_area .price_area li:last-child {
  color: #d43535;
  font-size: 10.7vw;
  text-align: right;
  font-weight: bold;
  width: 50vw;
}
.sec04 .box .top .text_area .price_area li:last-child .en {
  color: #d43535;
  font-size: 8vw;
  vertical-align: 0.7vw;
}
.sec04 .box .top .text_area .price_area li:last-child .tax {
  color: #d43535;
  font-size: 3.2vw;
  vertical-align: 0.8vw;
}
.sec04 .box .top .text_area .more a {
  display: block;
  color: #2f6048;
  font-size: 4.8vw;
  font-weight: bold;
  text-align: center;
  line-height: 12vw;
  border: solid 1px #2f6048;
  background: #fff;
  border-radius: 0.5vw;
  width: 74.7vw;
  margin: 0 auto;
}

.sec04 .box .relation {
  padding: 1.3vw 0;
  background: #f5f1e9;
}
.sec04 .box .relation .block {
  width: 86.7vw;
  margin: 0 auto;
  padding: 4vw 0;
  border-top: solid 1px #a8a39b;
  box-sizing: border-box;
}
.sec04 .box .relation .block:first-child { border-top: none;}
.sec04 .box .relation .block .tit {
  font-size: 4.3vw;
  font-weight: bold;
  margin-bottom: 1.3vw;
}
.sec04 .box .relation .block .sale_text {
  font-size: 4.3vw;
  font-weight: bold;
  text-align: center;
  margin: 2vw 0 1.3vw;
}
.sec04 .box .relation .block .tit span {
  color: #d43535;
  font-size: 4.3vw;
  font-weight: bold;
}

.sec04 .box .relation .block .price_area {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-bottom: 2vw;
}
.sec04 .box .relation .block .price_area li.free {
  color: #fff;
  font-size: 3.7vw;
  line-height: 6.7vw;
  text-align: center;
  background: #d43535;
  width: 20vw;
  height: 6.7vw;
  margin-right: 2.7vw;
  box-sizing: border-box;
}
.sec04 .box .relation .block .price_area li:last-child {
  color: #d43535;
  font-size: 9.3vw;
  font-weight: bold;
}
.sec04 .box .relation .block .price_area li:last-child .en {
  color: #d43535;
  font-size: 6.7vw;
  vertical-align: 0.7vw;
}
.sec04 .box .relation .block .price_area li:last-child .tax {
  color: #d43535;
  font-size: 3.2vw;
  vertical-align: 0.8vw;
}
.sec04 .box .relation .block .more a {
  display: block;
  color: #2f6048;
  font-size: 4.8vw;
  font-weight: bold;
  text-align: center;
  line-height: 10.7vw;
  border: solid 1px #2f6048;
  background: #fff;
  border-radius: 0.5vw;
  width: 74.7vw;
  margin: 0 auto;
}