@charset "utf-8";
/* CSS Document */
/*★★★★★★★★テンプレート[始]★★★★★★★★*/

/*===============================================
	reset
===============================================*/
*{margin:0; padding:0; color:#000;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
} 
h1,h2,h3,h4,h5,h6,p,address,
ul,ol,li,dl,dt,dd,
table,caption,th,td,img,form{margin:0; padding:0; border:none; font-style:normal; font-weight:normal; font-size:100%; text-align:left;}
textarea{font-size:100%;}
img{vertical-align:bottom;}
li{list-style:none;}
/*===============================================
	a,text
===============================================*/
a:hover{text-decoration:underline;}
a{text-decoration:none; color:#1800ff;}
/*=============================================== 
	base
===============================================*/
html,body{height:100%;}
/*===============================================
	font
===============================================*/
body{font-family: 'Noto Sans JP', sans-serif;}
input,textarea,select{font-family: 'Noto Sans JP', sans-serif; font-size:12px;}
/* for IE6 */
* html body{font-family: 'Noto Sans JP', sans-serif;}
* html input, * html textarea{font-family: 'Noto Sans JP', sans-serif;}
h1,h2,h3,h4{font-family: 'Noto Sans JP', sans-serif; font-weight: bold; }
/*===============================================
	align
===============================================*/
.center{text-align:center !important; margin: 0 auto !important;}
.textleft{text-align:left !important;}
.textright{text-align:right !important;}

/*===============================================
	他span
===============================================*/
.underL{text-decoration:underline !important;}
.displayN{display:none !important;}
.bold{font-weight:bold !important;}

/*===============================================
	cFix
===============================================*/
/*Opera Fix*/
body:before{content:""; height:100%; float:left; width:0; margin-top:-32767px; background: }
/*cFix*/
.cFix:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
* html .cFix {height:1%;}
.cFix {display:block;}

/*===============================================
	共通部分
===============================================*/
#wrap{width: 100%;}
/* img mouse hover */
a:hover img {opacity: 0.7;filter: alpha(opacity=70);-ms-filter: "alpha(opacity=70)";}
.sp{display:none;}
.pc{display: inline;}
p{line-height: 2rem;}
.mb20{margin-bottom: 20px !important;}
.mt80{margin-top: 80px !important;}
.under_red{text-decoration: underline; text-decoration-color: red; text-decoration-style: double; }
/*===============================================
	個別
===============================================*/

#wrap{width: 100%; background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/bk.jpg) no-repeat top, #f5f5f5; position: fixed; bottom: 0; height: 100%; z-index: -1;}
#index{width: 640px !important; margin: 0 auto; background: #fff;}
main img,section img{width: 100%;}

/* hanbaisuu */
#totalNO{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/totalBK.png) no-repeat, #3f2106; background-size: contain; width: 100%; position: relative; height: 151px;}
#totalNO .NO{ width: 65%; position: absolute;  left: 20%; top: 28%;}
#totalNO .NO img{ width: 100%; }


/* CTA */
.cta12{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/cta_12_.jpg) no-repeat top center; background-size: contain; width: 100%; position: relative; height: 602px;}
.cta12 .btn{ width: 90%; position: absolute;  left: 5%; bottom: 5px;}
.cta12 .btn img{ width: 100%;}

.cta12_24{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/cta_12x24_.jpg) no-repeat top center; background-size: contain; width: 100%; position: relative; height: 1110px;}
.cta12_24 .btn_12x24_12{ width: 90%; position: absolute;  left: 5%; bottom: 385px;}
.cta12_24 .btn_12x24_24{ width: 90%; position: absolute;  left: 5%; bottom: 5px;}
.cta12_24 img{ width: 100%;}

.ctakuro{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/cta_kuro_.jpg) no-repeat top center; background-size: contain; width: 100%; position: relative; height: 602px;}
.ctakuro .btn{ width: 90%; position: absolute;  left: 5%; bottom: 5px;}
.ctakuro .btn img{ width: 100%;}

.ftctakuro{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/ftcta_kuro_.png) no-repeat top center; background-size: contain; width: 100%; position: relative; height: 345px; margin-bottom: 20px;}
.ftctakuro .btn{ width: 63%; position: absolute;  left: 31%; bottom: 20px;}
.ftctakuro .btn img{ width: 100%;}

.ftcta12{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/ftcta_12_.png) no-repeat top center; background-size: contain; width: 100%; position: relative; height: 345px; margin-bottom: 20px;}
.ftcta12 .btn{ width: 63%; position: absolute;  left: 31%; bottom: 20px;}
.ftcta12 .btn img{ width: 100%;}

.ftcta24{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/ftcta_24_.png) no-repeat top center; background-size: contain; width: 100%; position: relative; height: 345px;}
.ftcta24 .btn{ width: 63%; position: absolute;  left: 31%; bottom: 20px;}
.ftcta24 .btn img{ width: 100%;}



/* Animation */
.target {
  animation: floating-y .8s ease-in-out infinite alternate-reverse;
}
@keyframes floating-y {
  0% {
    transform: translateY(-3%);
  }
  100% {
    transform: translateY(3%);
  }
}


/*光アニメーション*/
.name {
  width:400px;
}

.name p {
    font-size:85px;
    line-height: 80px;
    text-align: left;
    color: #d3b871;
    position: relative;
    font-family: arno-pro,serif;
    font-weight: 400;
    font-style: normal;
    background-image: linear-gradient(
		70deg,
		rgb(211, 184, 113, 0.8) 65%, 
		#fff 50%,
		rgb(211, 184, 113, 0.8) 75% 
	  );
	  background-size: 500% 100%;
    background-clip: text;
  	-webkit-background-clip: text;
	  color: transparent;
    animation: shine 2s infinite;
    filter: drop-shadow(0 0px 3px rgba(0, 0, 0, .9));
}

@keyframes shine {
	0% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.btn,.btn_12x24_12,.btn_12x24_24{
display:inline-block;
position:relative;
overflow:hidden;
}

.btn:after,.btn_12x24_12:after,.btn_12x24_24:after{
content:"";
height:100%;
width:30px;
position:absolute;
top:-180px;
left:0;
background-color: #fff;
opacity:0;
-webkit-transform: rotate(70deg);
-webkit-animation: btn 2s ease-in-out infinite;
}

@keyframes btn {
0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}




@media screen and (max-width:640px) {
	#wrap{display: none;}
	#index{width: 100% !important; margin: 0 auto;}

	/* hanbaisuu */
	#totalNO{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/totalBK.png) no-repeat, #3f2106; background-size: contain; width: 100%; position: relative; height: 24vw;}
	#totalNO .NO{ width: 65%; position: absolute;  left: 20%; top: .5rem;}
	#totalNO .NO img{ width: 100%; }


	/* CTA */
	.cta12{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/cta_12_.jpg) no-repeat top center; background-size: contain; width: 100%; position: relative; height: 95vw;}
	.cta12 .btn{ width: 90%; position: absolute;  left: 5%; bottom: 5px;}
	.cta12 .btn img{ width: 100%;}

	.cta12_24{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/cta_12x24_.jpg) no-repeat top center; background-size: contain; width: 100%; position: relative; height: 174vw;}
	.cta12_24 .btn_12x24_12{ width: 90%; position: absolute;  left: 5%; bottom: 61vw;}
	.cta12_24 .btn_12x24_24{ width: 90%; position: absolute;  left: 5%; bottom: 3vw;}
	.cta12_24 img{ width: 100%;}

	.ctakuro{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/cta_kuro_.jpg) no-repeat top center; background-size: contain; width: 100%; position: relative; height: 95vw;}
	.ctakuro .btn{ width: 90%; position: absolute;  left: 5%; bottom: 5px;}
	.ctakuro .btn img{ width: 100%;}

	.ftctakuro{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/ftcta_kuro_.png) no-repeat top center; background-size: contain; width: 100%; position: relative; height: 54vw; margin-bottom: 20px;}
	.ftctakuro .btn{ width: 63%; position: absolute;  left: 31%; bottom: 3vw;}
	.ftctakuro .btn img{ width: 100%;}

	.ftcta12{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/ftcta_12_.png) no-repeat top center; background-size: contain; width: 100%; position: relative; height: 54vw; margin-bottom: 20px;}
	.ftcta12 .btn{ width: 63%; position: absolute;  left: 31%; bottom: 3vw;}
	.ftcta12 .btn img{ width: 100%;}

	.ftcta24{background: url(https://www.primedirect.jp/user_data/packages/raku2pc/item/kinsyo_ichizen_001/ftcta_24_.png) no-repeat top center; background-size: contain; width: 100%; position: relative; height: 54vw;}
	.ftcta24 .btn{ width: 63%; position: absolute;  left: 31%; bottom: 3vw;}
	.ftcta24 .btn img{ width: 100%;}


.name p {
    font-size:3.1rem;
}

}