@charset "utf-8";
/* CSS Document */
/*■ベースはスマートフォン■*/

/*
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/
/*■■*/

[id$="wrap"] {width:100%;
position:relative; margin:auto; min-height:80vh; padding-top:50px;position:relative;}


/*■■*/
div.ss_contents {max-width:1000px; width:95%; margin:auto;padding-bottom:20vh; text-align:center;}


/*■終点カラーは#f2efcf■*/
#sale1912_topimage_wrap {
background: rgb(214, 25, 5);
background: url(https://ic4-a.wowma.net/mi/w/1280/h/1280/q/90/bcimg1-a.wowma.net/plus/u11386081/pc/sale1912/backtree.png),
linear-gradient(180deg, rgba(229,0,18,1) 0%, rgba(231,43,52,1) 84%, rgba(242,239,207,1) 100%);
background-repeat: no-repeat,no-repeat;
background-position: bottom -20px right 0px,center;/* 最前面の背景レイヤーから対応 */
background-size: 100% auto, 100%;
background-attachment:scroll,scroll;

}
#sale1912_today_wrap {
background: rgb(60, 181, 173);
background: url(https://ic4-a.wowma.net/mi/w/1280/h/1280/q/90/bcimg1-a.wowma.net/plus/u11386081/pc/sale1912/backtree.png),
 linear-gradient(180deg, rgba(60, 181, 173, 1) 0%, rgba(144, 208, 189, 1) 50%, rgba(195, 224, 198, 1) 84%, rgba(242, 239, 207, 1) 100%);
background-repeat: no-repeat,no-repeat;
background-position: bottom -20px right 0px,center;/* 最前面の背景レイヤーから対応 */
background-size: 100% auto, 100%;
background-attachment:scroll,fixed;

}
#sale1912_sale_wrap {
background: rgb(214, 25, 5);
background: url(https://ic4-a.wowma.net/mi/w/1280/h/1280/q/90/bcimg1-a.wowma.net/plus/u11386081/pc/sale1912/backtree.png),
 linear-gradient(180deg, rgba(214, 25, 5, 1) 0%, rgba(220, 68, 45, 1) 50%, rgba(229, 136, 110, 1) 84%, rgba(242, 239, 207, 1) 100%);
background-repeat: no-repeat,no-repeat;
background-position: bottom -20px right 0px,center;/* 最前面の背景レイヤーから対応 */
background-size: 100% auto, 100%;
background-attachment:scroll,fixed;
}
#sale1912_daily_wrap {
background: rgb(250, 214, 4);
background: url(https://ic4-a.wowma.net/mi/w/1280/h/1280/q/90/bcimg1-a.wowma.net/plus/u11386081/pc/sale1912/backtree.png),
 linear-gradient(180deg, rgba(250, 214, 4, 1) 0%, rgba(238, 216, 46, 1) 50%, rgba(241, 231, 149, 1) 84%, rgba(242, 239, 207, 1) 100%);
background-repeat: no-repeat,no-repeat;
background-position: bottom -20px right 0px,center;/* 最前面の背景レイヤーから対応 */
background-size: 100% auto, 100%;
background-attachment:scroll,fixed;

}
#sale1912_point_wrap {
background: rgb(84,2,2);
background: url(https://ic4-a.wowma.net/mi/w/1280/h/1280/q/90/bcimg1-a.wowma.net/plus/u11386081/pc/sale1912/backtree.png),
 linear-gradient(180deg, rgba(84,2,2,1) 0%, rgba(208,4,21,1) 100%);
 background-repeat: no-repeat,no-repeat;
 background-position: bottom -20px right 0px,center;/* 最前面の背景レイヤーから対応 */
background-size: 100% auto, 100%;
background-attachment:scroll,fixed;

}

#sale1912_happybag_wrap {
background: rgb(84,2,2);
background: url(https://ic4-a.wowma.net/mi/w/1280/h/1280/q/90/bcimg1-a.wowma.net/plus/u11386081/pc/sale1912/backtree.png),
 linear-gradient(180deg, rgba(84,2,2,1) 0%, rgba(208,4,21,1) 100%);
 background-repeat: no-repeat,no-repeat;
 background-position: bottom -20px right 0px,center;/* 最前面の背景レイヤーから対応 */
background-size: 100% auto, 100%;
background-attachment:scroll,fixed;

}


div.sale1912_navi_w,
div.sale1912_navi_b {
width:90%; max-width:1000px; margin:5% auto 5% auto; text-align:center;
 color:#FFF;font-size:2em;
border:0 solid #FFF;
border-radius:10px;
padding:2% 5px 1% 5px 1%; 
position:relative;
z-index:1;
line-height:1.5em;
font-weight:bold;
}




div.sale1912_navi_w span,
div.sale1912_navi_b span
 {
     position: relative;
     display: inline-block;
     padding: 0 01em;
     font-size:0.7em;
          font-weight:normal;
          margin:1.5% auto 2% auto;
          color:#FFF;

}
div.sale1912_navi_w span::before,
div.sale1912_navi_b span::before {
     position: absolute;
     content: '';
     top:0;
     right:0.2em;
     width: 0.2em;
     height:70%;
     border: solid 1px #FFF;
     border-left: none;
}
div.sale1912_navi_w span::after,
div.sale1912_navi_b span::after {
     position: absolute;
     content: '';
     top:0;
     left:0;
     width: 0.2em;
     height:70%;
     max-width:800px;
     border: solid 1px #FFF;
     border-right: none;
}
div.sale1912_navi_b,
div.sale1912_navi_b::after,
div.sale1912_navi_b span,
div.sale1912_navi_b span::before,
div.sale1912_navi_b span::after {color:#003; border-color:#003;}




.navi-plus {
  width: 100%;
  margin: 5% auto -2% auto;
  padding: 10px 0;
  font-family: sans-serif;
  font-size: 1.25em;
  font-weight:bold;
  color:#000;
}
.navi-plus_text {
  margin: 10px 0
}
.navi-plus .navi-plus_text {
  color: #000;
  text-align: center;
  overflow: hidden;
}
.navi-plus .navi-plus_text span {
  display: inline-block;
  position: relative;
}
.navi-plus .navi-plus_text span:before,
.navi-plus .navi-plus_text span:after {
  content: "";
  border-bottom: 2px solid #000;
  width: 45px;
  margin: 0 15px;
  position: absolute;
  bottom: 1em;
}
.navi-plus .navi-plus_text span:before {
  right: 100%;
}
.navi-plus .navi-plus_text span:after {
  left: 100%;
}

html body div.white {color:#FFF; border-bottom:#FFF 1px solid;}


/*■■*/
#sale1912_topimage {width:100%; max-width:1200px; margin:auto;}
#sale1912_topimage .mainimage {border-radius:10px 10px; width:100%;}


/*■■*/
div.sale1912_wrapline {
	position: relative;
	height: 50px;
	background: #FFF;
	z-index:1;
}
div.sale1912_wrapline::after {
	position: absolute;
	content: '';
	bottom: -100px;
	display: block;
	width: 100%;
	height: 100px;
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath fill='%23FFFFFF' d='M0,0 Q50,50 100,0'%3E%3C/path%3E%3C/svg%3E");
	/* ↑[fill='%2380deea']部分がカラー指定[80deea]部分を変更 */
	/* svgファイルを外部読み込みする場合は下記を[ファイル名.svg]として保存してurl(ファイル名.svg)で指定 */
	/* <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="none">
	<path fill="#80deea" d="M0,0 Q50,50 100,0"></path>
	</svg> */
}

/*■■*/
div.topbox {background:#FFF; border-radius:10px 10px; margin:5% auto; padding:8px 10px; width:80%; min-height:120px; z-index:100; }
div.topbox p {display:block; background:#F33; padding:0px; margin:5px; color:#FFF; font-weight:bold; font-size:1.3em; border-radius:5px 5px; text-align:center;}
div.topbox li {font-size:1.7rem;}
div.topbox li:first-child {font-weight:bold; padding-left:10px; color:#222; vertical-align:middle 10px; display:none;}
div.topbox h1 {font-size:1.5em; padding:5px; margin:5px auto;color:#000;}

/*■スマートフォンサーチバー設定■*/
#sale_search { background:none; padding:0% 2%; margin:30px auto 0 auto; text-align:center;}

dl.sma_search{
	margin:8px auto;
	position:relative;
	background-color:#fff;
	border:0px solid #AAA;

	border-radius:8px;
	width:95%;
	max-width:600px;

}
dl.sma_search dt{
	padding:0;
}
dl.sma_search dt input{
	width:100%;
	height:50px;
	line-height:25px;
	background:none;
	border:none;
	font-size:16px;
	vertical-align:middle;
	padding-left:10px;
}
dl.sma_search dd{
	position:absolute;
	top:0;
	right:0;

}
dl.sma_search dd button{
	display:block;
	padding:0;
	background:#ED0;
	border-radius:0 8px 8px 0;
	border:none;
}
dl.sma_search dd button span{
	display:block;
	width:60px;
	height:50px;
	background:url('https://ic4-a.wowma.net/mi/w/1280/h/1280/q/90/riverall.cranky.jp/wowma/search_gray.png') no-repeat scroll 55% 60%;
	background-size:40px auto;
}
#sale_search p.go_osusume {display:inline-block; background:#FD3; padding:10px;
font-weight:bold; border-radius:5px; margin:2.5px 5px; font-size:1.2em;}
#sale_search p.go_osusume a {display:block; width:100%; height:auto;}
#sale_search p.go_search {border-top:double 3px #FFF; padding-top:10px; margin:-3% auto 30px auto; width:95%; max-width:600px; color:#FFF; font-size:1em;}
/*
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
■PC用■
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/

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


div.sale1912_navi_w,div.sale1912_navi_b {font-size:3em;}
div.sale1912_navi_w span, div.sale1912_navi_b span {font-size:0.6em;}

div.topbox li:first-child { display:inline-block;}

.navi-plus {font-size: 2em;}

div.ss_contents {padding-bottom:50vh;}
dl.sma_search dt input{font-size:24px;}
#sale_search p.go_osusume {padding:15px;  font-size:1.5em;}




/*■消さない■*/
}
/*■消さない■*/