@charset "Shift_JIS";

body {margin: 0; padding: 0;}
#wrapper img {border: 0; vertical-align: bottom;}
#wrapper a{ text-decoration:none; }

/* Header */
.incle_head {
    width: 94%;
    max-width: 550px;
    margin: 5% auto 8%;
}


/*
* styles
*/

#Main {
	display: block;
	width: 100%;
    max-width: 1000px;
	margin:0 auto 7%;
	position:relative;
}


#wrapper {
    margin: 0 auto 0;
    padding: 0;
	width: 100%;
	position: relative;
	text-align: center;
	font-family: 'Noto Sans JP', sans-serif;
    color: #000000;
    /*background-image: url("../images/top.png");*/
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
}

#wrapper img {width: 100%;}

/*#bk {
    width: 100%;
    margin: 0 auto 2%;
    padding: 2% 0 4%;
    background-image: url("../images/top.png");
    background-size: cover;
    background-position: center bottom;
    overflow: hidden;
}*/

section {
	margin: 0 0 6%;
	padding: 1%;
	text-align: center;
}

article {
	width: 100%;
	margin: 0 auto;
	padding: 2% 0;
	text-align: center;
	position: relative;
}

.bk01 {background-color: #dae3f4;	}
.col1 {color: #5cb5b4;}
.col2 {color: #6A5C24;}


#wrapper p{
	font-size:14px;
	line-height:1.8em;
	margin: 3px 0 3px;
}

#wrapper h1 {
    width: 50%;
	font-size: 23px;
	font-weight: 700;
	text-align: center;
	letter-spacing: 0.038em;
	margin: 1% auto ;
	line-height: 1.5em;
}

#wrapper h2 {
    font-family: 'Lato', sans-serif;
	font-weight: 600;
	font-size: 22px;
    line-height: 1.4em;
    letter-spacing: 0.056em;
	margin: 3% auto 0;
    padding: 5% 0 0;
	text-align: center;
    border-top: solid 1px #ccc;
}

#wrapper h3 {
	width: 98%;
	font-size: 30px;
	letter-spacing: 1.5px;
	font-weight: 600;
    line-height: 1.4em;
	margin: 0 auto 10%;
	text-align: center;
    color: #000;
	/* position: relative;*/
 /* padding: 1rem .5rem;*/
}

#wrapper h4 {
	font-weight: 600;
	font-size: 15px;
    line-height: 1.5em;
	margin: 2% auto 0;
	color: #740c23;
}

.reco_no{font-size: 35px;}
.line_pic {
    padding: 0.1rem 0;
    margin-bottom: 0.2rem;
    border-bottom: 6px double #740c23;
}
/*.sub_txt{width: 98%; margin: 15% auto 2%; font-size: 25px; font-weight: 500; letter-spacing: 0.5px; text-align: center;}*/

/*.line_G{background:linear-gradient(transparent 60%, #d1f5e9 60%);}
.line_O{background:linear-gradient(transparent 60%, #fde6ba 60%);}
.line_Y{background:linear-gradient(transparent 60%, #fffabe 60%);}*/

/*.bk_G{background-color: #d1f5e9; padding: 5px 22px;}
.bk_O{background-color: #fde6ba; padding: 5px 22px;}
.bk_Y{background-color: #fffabe; padding: 5px 22px;}*/

/*.stripe{ 
  position: relative;
  padding: 0.3em;
}
.stripe:after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 7px;
  background: repeating-linear-gradient(-45deg, skyblue, skyblue 2px, white 2px, white 4px);
}*/

/*#wrapper h3:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3px;
  content: '';
  background-image: -webkit-gradient(linear, left top, right top, from(#000), to(#000));
  background-image: -webkit-linear-gradient(left, #000 0%, #000 100%);
  background-image: linear-gradient(to right, #000 0%, #000 100%);
}*/


/*.line_r{border-bottom: 2px solid #bb0303; background-color: #FFEBCA; padding: 1.5% 3%;}
*/


.wrap_content {
    margin: 0 auto 0;
    padding: 4% 0 0;
	width: 100%;
    max-width: 1200px;
}

.ttl {width: 100%; max-width: 1000px; margin: 2% auto 12%;}
/*.ttl strong {    color: #EE8E90;    font-size: 120%;}
.ttl span {    font-size: 50%;    font-style: normal;}*/

.Lead {
	font-size: 24px; 
	font-weight: 600;
	line-height: 1.5em;
	text-align: center;
	margin: 4% auto 2%;
}

.Lead span {    border-bottom: solid 3px #c50000;}

.limit_date {
	font-size: 13px;
	font-weight: 500;
    line-height: 1.2em;
	margin: 3% 0 5%;
	text-align: center;
}

.limit_date span {
    color: #c50000;
    padding: 2px 10px 4px;
	text-align: center;
    border: solid 2px #c50000;
}

.pick_BOX {
	width: 75%;
    max-width: 1000px;
	margin: 5% auto 10%;
    display: flex;
    flex-wrap: wrap;
	justify-content: space-between;
	/*align-items: center;*/
}
.item_txt{width: 45%; position: relative; text-align: left;}
.item_mainimg{width: 55%; margin: 0; padding: 0; position: relative;}
.item_video{width: 98%; margin: 2% 0; padding: 0; position: relative;}

/*.pick_BOX:nth-child(2n+1) { flex-direction: row-reverse; } 
.pick_BOX:nth-child(2n  ) { flex-direction: row; } */

.pick_BOX:nth-child(even){
            display: flex;
            flex-direction: row-reverse; /*左右入れ替え*/
             }

.pop_item_u {width: 75%; margin: 0 auto 1%;}

/*.pop_item_u2 {
    width: 75%;
	margin: 0 auto 1%;
}*/
.seal {
    width: 23%;
    position: absolute;
    top: -2%;
    left: -2%;
}
.seal_r {
    width: 23%;
    position: absolute;
    top: -2%;
    right: -2%;
}

.seal_s {
    width: 27%;
    position: absolute;
    top: -2%;
    left: -2%;
}

.item_name {
	font-size: 23px;
	font-weight: 500;
	line-height: 1.8em;
}

.price {
	font-size: 20px;
	font-weight: 500;
	margin: 5% 0 2%;
	text-align: center;
}

.red {
    color: #c50000;
    font-size: 140%;
    font-weight: 600;
}
.Sml {
	font-size: 12px;
    line-height: 1.5em;
}


/*フォトプラスシャイニーNEO*/
.pick_box {
	width: 95%;
    max-width: 1000px;
	margin: 5% auto;
    display: flex;
    flex-wrap: wrap;
	justify-content: space-between;
}
.pickimg {width: 50%; position: relative;}

/*.pick_box2{width: 92%;}
.pickimg2 {	width: 40%;	margin: 0;	position: relative;}*/
.picktxt {	width: 45%;	margin: 0;	padding: 0;	text-align: left;    position: relative;}
.picktxt2{width: 55%;}

.pop_item {
    width: 28%;
    position: absolute;
    bottom: -5%;
    left: -10%;
    z-index: 2;
}

.award {
    width: 28%;
    position: absolute;
    top: -2%;
    right: -5%;
}


.slider_box {
    width: 99%;
    display: flex;
    gap: 10px;
    justify-content: center;
    overflow-x: auto;
    margin: 0 auto 8%;
}

.slider_box_1 {
    width: 100%;
    margin: 0 auto 8%;
}

.slide_thumb {
	width: 23.3%;
	margin: 0 auto;
}

small {
    font-size: 60%;
    padding: 0 1%;
}

/*.grybox {
    margin: 1% auto;
    padding: 2%;
    background-color: #eee;
    border-radius: 5px;
}

.grybk {
    padding: 2%;
    background-color: #eee;
    border-radius: 5px;
}*/


.staff_box {
	width: 100%;
    margin: 0 auto 0;
    padding: 1% 2%;
    text-align: left;
    position: relative;
    display: flex;
	align-items: center;
	align-content: center;
	box-sizing: border-box;
	border: solid 1px #000;
	border-radius: 10px;
}
.staff_box3 {
	width: 100%;
    margin: 0 auto 0;
    padding: 1% 2%;
    text-align: left;
    position: relative;
    display: flex;
	background-color: #eee;
	align-items: center;
	align-content: center;
	box-sizing: border-box;
}

.staff_img {
    width: 90px;
    height: 78px;
    border-radius: 50%;
    margin: 2% 0;
    overflow: hidden;
    float: left;
    border: solid 3px #fff;
    box-sizing: border-box;
}

.staff_img img {
    width: 80px!important ;
    height: 80px!important ;
}

.staff_info {
    width: 35%;
    float: right;
    padding: 3%;
}
.staff_info2 {
    width: 55%;
    float: right;
    padding: 3%;
	font-size: 15px;
	font-weight: 500;
	text-align: center;
	background-color: #C8C8C8;
	border-radius: 5px;
}

.staff_info2 a{text-decoration: none; color: #000;}

.staff_info3 {
    width: 65%;
    float: right;
    padding: 3%;
}

.staff {
    font-size: 15px;
    line-height: 1.5em;
    margin: 2% 0;
    font-weight: 600;
    text-align: left;
    border-bottom: solid 1px #777;
}

/*.sns_content {
    width: 30%;
    height: auto;
    margin: 7% auto;
    text-align: center;
}

.sns_inner {
  margin: 0 auto;
  display: flex;
  justify-content: space-evenly;
  margin-top: 10px;
}

.sns_inner button {
    border: none;
    background-color: #FFFFFF;
    padding: 5px;
}

.sns_inner button img{
    width: 60px;
}

.iglogo {
    width: 10%;
    max-width: 50px;
    margin: 5% auto;
}

.iglogo img {
    width: 100%;
}

.icon_sb {
    width: 10%;
    max-width: 60px;
    position: absolute;
    bottom: 8%;
    right: 4%;
}*/

.point_video {
    display: block;
    width: 100%;
    margin: 0 auto 2%;
}
.point_video iframe {
    width: 100%;
}



/*pick item*/
.thumb_box {
	width: 85%;
	margin: 5% auto;
    display: flex;
    flex-wrap: wrap;
    text-align: center;
}


.thumb {
    width: 32.3%;
    margin: .5%;
    font-size: 13px;
    line-height: 2.0em;
    text-align: center;
    float: left;
}

.thumb p {    font-size: 13px;    line-height: 1.4em;}
.thumb img {    width: 100%;}
/*.bdrg {
    border: solid 5px #c7a53d;
    box-sizing: border-box;
}*/



/*.icon_reveiw {
    width: 50%;
    max-width: 160px;
    margin: 3% auto;
}
*/



/* General button style (reset) */
.btn {
	border: none;
	font-size: 15px;
	color: inherit;
	background: none;
	cursor: pointer;
	padding: 10px;
	display: inline-block;
	margin: 2% auto 3%;
	letter-spacing: 1px;
	font-weight: 400;
	outline: none;
	position: relative;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	text-align: center;
	
}


/* Button 1 */
.btn-1 {
	font-size: 14px;
    font-weight: 500;
	padding: 8px 30px 10px;
	color: #fff;
	border-radius: 5px;
	background-color: #000;
	transition: .3s;
	display: block;
	width: 60%;
	margin: 7% auto 0;
}

/* Button 2 */
.btn-2 {
	width: 500px;
	font-size: 18px;
	margin: 0 auto 5%;
	padding: 12px 0 15px;
	color: #fff;
	border-radius: 5px;
	background-color: #000;
	transition: .3s;
}

a.btn:hover {background-color: #000;}

hr{width: 70%; margin: 5% auto; border: dashed 1px #eee;}
span.txt_point{margin: 1% 0 2%; color: #fff; background-color:#c39000; font-weight: 500; font-size: 14px; padding:  2px 8px 4px; border: solid 1px #c39000; text-align: center;}
span.txt_point2{margin: 1% 0 2%; color: #fff; background-color:#c39000; font-weight: 500; font-size: 13px; padding:  3px 8px 4px; border: solid 1px #c39000; text-align: center; vertical-align: middle;}
.gold {color: #c39000; font-size: 105%; font-weight: 600;}
.gold2 {color: #c39000; font-size:15px; font-weight: 500;  padding:  1px 8px 4px; border: solid 2px #c39000; vertical-align: text-top;}
.reorder {color: #740c23; font-size:15px; font-weight: 500;  padding:  1px 8px 4px; border: solid 2px #740c23; vertical-align: text-top;}


.btn_video{width: 60%; margin: 2% auto 0; padding: 6px 2%; border: 1px solid #000; border-radius: 8px;}
.video_box{ width: 90%; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; box-sizing: border-box;}
.video_img{width: 22%; margin: 0; padding: 0 5%; box-sizing: border-box;}
.video_txt{width: 73%; margin: 0; text-align: left; font-size: 15px; color: #000; box-sizing: border-box;}
.video_txt a{color: #000;}

.clear {clear: both;}
.br_pc {display: block;}
.br_sp {display: none;}
.pc {display: block;}
.sp {display:none;}
.Ctr {text-align: center;}


@media only screen and (max-width:750px){
	#wrapper {
		width: 100%;		
        margin: 0 auto 5%;
        padding: 5% 0 0;
        /*background-image: url("../images/top_sp.png");*/
	}	
	.wrap_content {overflow: hidden; padding: 0;}
	
	#Main {margin: 0 auto 10%; width: 100%;}	  
    #bk {background-position: center top; }
	
	.pc {display:none;}
	.sp {display:block;}
	/*#wrapper h1 {
        width: 80%;
		font-size: 20px;
		margin: 15% auto 6%;
		line-height: 1.4em;
	}*/
	
	#wrapper h2 {font-size: 17px; margin: 5% auto 2%; line-height: 1.6em;	}
	#wrapper h3 {width: 95%; margin: 0 auto 2%; font-size: 20px; line-height: 1.6em;}
	/*.sub_txt{font-size: 17px; margin: 17% auto 4%; font-weight: 500;}*/
	.reco_no{font-size: 25px;}   
	#wrapper h4 {font-size: 13px;}
	
	#wrapper p {
		font-size: 13px;
		line-height: 1.6em;
		margin: 8px 0 15px;
	}
    
	.ttl {width: 100%; margin: 1% auto 8%;}
	
    .limit_date {font-size: 10px;  text-align: center; margin: 3% auto 5%;line-height: 2em;}
    .thumb .limit_date {text-align: left;}
    .limit_date span {padding: 2px 5px; border: solid 1px #c50000;font-size: 14px;}
    
	.Lead {	font-size: 14px; margin: 2% auto 1%;	}
	article {width: 94%; padding: 0;	}	
	
	
	.pick_BOX {
		width: 95%;
		max-width: 1000px;
		margin: 5% auto 30%;
		display: block;
	}
	.item_txt{width: 100%; position: relative;}
	.item_mainimg{width: 100%; margin: 8% auto 1%; padding: 0; position: relative;}
	/*.item_video{width: 100%; margin: 15% auto; padding: 0; position: relative;}*/
	 
	.seal,.seal_r {
        width: 23%;
		top: -2%;
    	left: 0;
    }
	
	.item_name {
		font-size: 16px;
	}
	
	.price {
		font-size: 18px;
	}

/*フォトプラスシャイニーNEO*/	
	.pick_box {
		width: 95%;
		display: flex;
		flex-direction:column;
		margin: 10% auto 5%;
	}
	
	.pickimg {
		width: 100%;
		float: none;
		order: 1;
        z-index: 1;
	}
	
	
	/*.pickimg2 {
		width: 100%;
		float: none;
		order: 3;
        z-index: 3;
	}*/
	
	.picktxt {
		width: 100%;
		float: none;
		padding: 3% 0 1%;
		order: 2;
        z-index: 2;
	}
	
    .pop_item {
        width: 25%;
        bottom: -3%;
        left: -7%;
    }
    
    .award {
        width: 35%;
        top: -5%;
        right: -2%;
    }
    
    
	.btn {font-size: 13px;}
    
    .staff_info {
		width: 38%;
        width: auto;
        padding: 3% 2%;
    }
	
	/*.staff_info2 {
		width: 45%;
		padding: 3%;
		font-size: 14px;
	}*/
    
    .staff_img {
        width: 70px;
        height: 70px;
    }
    
    .staff_img img{
        width: 70px!important;
        height: 70px!important;
    }    

   /* .sns_content {
        width: 35%;
    }*/
    
    .staff {
        font-size: 12px;
    }  
    
    .slider_box {
        width: 95%; justify-content: flex-start;
    }
    
    .slide_thumb {
      width: 230px;
    }
        
    .slide_thumb video {
        width: 230px!important;
        max-width: inherit; 
    }
	
	.thumb_box {width: 100%; margin: 5% auto;}
    .thumb {
        width: 48%;
        margin: 1% 1% 4%;
        text-align: left;
    }
    
    .thumb p {font-size: 12px;}  
	/* Button 1 */
	.btn-1 {
		font-size: 14px;
		width: 70%;
		max-width: none;
        padding: 12px 0 14px;
		margin: 7% auto 0 ;
		display: block;
	}
	
	/* Button 2 */
	.btn-2 {
		font-size: 15px;
        width: 70%;
        padding: 7px 0 10px;
    	margin: 2% auto 8%;
		position: relative;
	}
	
	.btn_video{width: 70%; margin: 3% auto 0; padding: 4px 0; border-radius: 3px;}
	.video_box{ width: 70%; margin: 0 auto;}
	.video_img{width: 24%; margin: 0; padding: 0 5%}
	.video_txt{width: 70%; margin: 0; font-size: 14px;}
	
    .point_video {
        width: 100%;
    }

	 span.txt_point{margin: 1% 0 2%;font-size: 14px; padding:  2px 8px 2px; border: solid 1px #c39000; vertical-align: top;}
	span.txt_point2{margin: 1% 0 2%;font-size: 14px; padding:  2px 8px 2px; border: solid 1px #c39000; vertical-align: middle;}
	.gold2 {color: #c39000; font-size:13px; font-weight: 500;  padding:  1px 8px 2px; border: solid 2px #c39000; vertical-align: text-top;}
	.reorder {color: #740c23; font-size:13px; font-weight: 500;  padding:  1px 8px 2px; border: solid 2px #740c23; vertical-align: text-top;}
}