@charset "utf-8";
/* CSS Document */

#pageContents.xmasCnt{width: 100%!important; height: 700px; background:#c9c5c0; color:#584839; margin: 0 auto; position: relative;}
#pageContents.xmasCnt div#spcontents{width:480px; height: 700px; z-index: 100; margin: 0 auto; position: absolute; top: 0; right: 35%; overflow-y: scroll; background-color: #c9c5c0;}
#pageContents.xmasCnt a{text-decoration:none; background: none; padding: 0; margin: 0;}
#pageContents.xmasCnt a:hover{color:#333;}

#pageContents p {line-height: 1.7em;}
#pageContents .ttlCnt p {padding: 3% 4% 5%;}
#pageContents.xmasCnt ul.itemCnt li.widecol{width: 360px;}
#pageContents.xmasCnt ul.itemCnt li{width: 176px;}

#pageContents .spOnly{display: none;}

#pageContents div.black{background-color: #000; width: 100%; height: 700px;position: absolute;top: 0; left: 0; opacity: 0.55;}

#pageContents div.box{
	  width: 100%;
	  height: 700px;;
		background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	  animation: image_anime 15s 0s infinite;
	animation-fill-mode: forwards;
	animation-timing-function: ease-in-out;
	animation-direction:alternate;
  -ms-overflow-style: none;
scrollbar-width: none;}

#pageContents div.box::-webkit-scrollbar{display: none;}

@keyframes image_anime {
  0% {background-image: url("../images/xmas25/xmas25-pc01.jpg");}
  40% {background-image: url("../images/xmas25/xmas25-pc02.jpg");}
  80% {background-image: url("../images/xmas25/xmas25-pc03.jpg");}
  100% {background-image: url("../images/xmas25/xmas25-pc04.jpg");}
}

/*titel*/
#pageContents div#ttlCnt{width: 100%; background-color: #c9c5c0;}
#pageContents #ttlCnt img{width: 100%; margin: 0 auto;}
#pageContents #ttlCnt h1{text-align:center; font-size:25px; line-height:1.7em; display: block; width: 100%;}
#pageContents #ttlCnt p.ttl_txt{display: block; width:94%; margin: 0 auto; padding: 0;} 

/*MENU*/
#menuCnt{width:100%; overflow:hidden; _zoom:1; margin-top: 30px;  background-color: #c9c5c0;}
#menuCnt{font-family: 'Trebuchet MS',sans-serif; font-size:3.0em; text-align:center;}
#menuCnt ul{width:90%; margin: 0 auto;}
#menuCnt ul li{width:100%; margin: 0 0 10px;}
#menuCnt ul li img{width: 100%;}
#menuCnt p.menuttl{font-size: 20px; text-align: center; border-bottom: 3px solid #584839; display: inline-block; margin-bottom: 20px;}
#menuCnt img.attention{width: 90%; margin: 40px 0 auto;}

/*コンテンツ*/
.ctgCnt{padding-bottom:10px;}

.itembox{width:95%!important; margin: 10px auto; display:flex; flex-wrap:wrap; padding: 5px;  position: relative; text-align: center;}
#pageContents.xmasCnt .widecol h3{font-size:18px; font-weight: 500; padding:10px;text-align:center; line-height:1.5em;}
#pageContents.xmasCnt h3{font-size:14px;  font-weight: 500; padding:10px; text-align:center; line-height:1.5em;}
.itembox .name,.itembox .price{padding:5px 0 0 0; width:100%; text-align:center; font-size:0.9em;}
.itembox .price small{font-size:0.9em;}
#pageContents p.smallttl{font-family: 'Trebuchet MS',sans-serif; font-size: 20px; text-align: center; margin: 0 auto; position: relative;z-index: 200;}
ul.itemCnt{background-color: transparent;}
ul.itemCnt li{position: relative;}

/*インテリア*/
#pageContents #interior,#pageContents #kids{background-color: #948560; color: #fff; position: relative;margin-top: 220px; padding-bottom: 400px;}
#pageContents #interior h2,#pageContents #kids h2{font-size: 22px; background-color: #948560; font-weight: 600; line-height: 1.7em; z-index: 400; position: relative;}
#pageContents #interior div.dome,#pageContents #kids div.dome{background: #948560; width: 100%; height: 140px; margin: 0 auto; position: absolute; top: -70px; z-index: 0;border-radius: 50%;}

#pageContents #interior div.nuki{position: relative;}
#pageContents #interior .santa-g{width: 10%; position: absolute; z-index: 500; left: 22px; top: -170px;}
#pageContents #interior .santa-r{width: 12%; position: absolute; z-index: 500; left: 16%; top: -110px;}
#pageContents #interior .snowdome{width: 20%; position: absolute; z-index: 500; right: 32px; top: -136px;}

/*スイーツ*/
#pageContents #sweets,#pageContents #gift,#pageContents #wrapping{background-color: #c9c5c0; color: #584839; position: relative; margin-top: -200px; padding-bottom: 100px;}
#pageContents #sweets h2,#pageContents #gift h2{font-size: 22px; background-color: transparent; font-weight: 600; line-height: 1.7em; z-index: 400; position: relative; color: #584839}
#pageContents #sweets div.dome,#pageContents #gift div.dome{background: #c9c5c0; width: 100%; height: 140px; margin: 0 auto; position: absolute; top: -70px; z-index: 0;border-radius: 50%;}
#pageContents #sweets div.nuki{position: relative;}
#pageContents #sweets .sweetsA{width: 27%; position: absolute; z-index: 500; left: 14px; top: -110px;}
#pageContents #sweets .sweetsB{width: 27%; position: absolute; z-index: 500; right: 14px; top: -90px;}

/*キッズ*/
#pageContents #kids div.nuki{position: relative;}
#pageContents #kids .kidsA{width: 22%; position: absolute; z-index: 500; left: 20px; top: -160px;}
#pageContents #kids .kidsB{width: 27%; position: absolute; z-index: 500; right: 9px; top: -130px;}

/*ギフト*/
#pageContents #gift div.nuki{position: relative;}
#pageContents #gift .giftA{width: 27%; position: absolute; z-index: 500; left: 14px; top: -120px;}
#pageContents #gift .giftB{width: 27%; position: absolute; z-index: 500; right: 20px; top: -120px;}

/*ラッピング*/
#pageContents #wrapping{margin-top: 200px; padding-bottom: 200px;}
#pageContents #wrapping div.dome{background: #c9c5c0; width: 99%; height: 140px; margin: 0 auto; position: absolute; top: -70px; z-index: 0;
	border-radius: 50%;
	border-style: solid;
	border-color:#fff;
	border-width: 2px;}
#pageContents #wrapping p.smallttl{background-color: #c9c5c0; padding-bottom: 30px;}
#pageContents #wrapping h2{font-size: 22px; background-color: #c9c5c0; font-weight: 600; line-height: 1.7em; z-index: 400; position: relative; color: #584839; padding-top: 0;}
#pageContents #wrapping img{width: 100%;}
#pageContents #wrapping p span{font-weight: 600; border-bottom: 2px solid #584839; color:#584839; }


/*アイコン*/
div.itembox mark.renewalicon{text-align: center;
color: #fff;
background-color: #5a9dc0;
font-weight: 500;
padding: 3px 5px;
font-size: 1em;
position: absolute;
top: 14px;
right: 14px;
border-radius: 6px;
z-index: 10;}

div.itembox mark.newicon{text-align: center;
color: #fff;
background-color: #dc8f5a;
font-weight: 500;
padding: 3px 5px;
font-size: 1em;
position: absolute;
top: 14px;
right: 14px;
border-radius: 6px;
z-index: 10;}
