@charset "utf-8";
/*--------------------------------------

	[0]リセット設定
	
---------------------------------------*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, address, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strong, sub, sup, tt, var,
b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align:baseline;
	background:transparent;
}

body {
	line-height: 0;
}

/* HTML5 追加要素 */
article, aside, details, figcaption,
footer, header, hgroup, menu, nav, section {
	display: block;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

th, td {
	vertical-align:middle;
	}

*, *:before, *:after {/*padding border対策*/
    -webkit-box-sizing: border-box;
      /* -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;*/
            box-sizing: border-box;
}
/*--------------------------------------

	[1]基本設定
	
---------------------------------------*/
html{/*1rem=10px*/
	font-size: 62.5%;
	font-family: 'Noto Sans JP', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;	
}

span,p {
	line-height:1.5;
	letter-spacing: 0.05em;
        font-feature-settings: "palt"; 
}

img{
-webkit-backface-visibility: hidden;/*chrome 画像滲み対策*/
	vertical-align:bottom;/*画像の余白対策*/
}

strong{
	font-weight:700;
}

small{
	font-size:0.6em;
}

.pc_Obj {
        display: block;
}

.sp_Obj {
        display: none;
}

@media only screen and (max-width : 750px)  {
    .pc_Obj {
        display: none;
    }

    .sp_Obj {
        display: block;
    }
}

/*　link 
---------------------------------------*/

a{transition:all 1s ease-out;}
a:link {color: #000;text-decoration: none;}
a:visited {color: #000; text-decoration: none;}
a:hover {color:#ccc;}
a img{transition:all 1s ease-out;}
a:hover img{opacity: 0.5;}

/*--------------------------------------

	[2]汎用設定
	
---------------------------------------*/

.inner{
	width:100%;
        margin: auto;
        text-align: center;
}

.btn {
        margin-bottom: 3%;
}

.container_shopinfo{
        text-align: left;
	padding: 1.2rem 1.7rem;
}

.container_shopinfo > p{
	font-size: calc(100vw / 36);
        line-height: 1.6;
}

figure{
	display: flex;
        flex-wrap: wrap;
}

figure div{
	width:50%;
	margin: 0;
}



	/*--------------------------------------

	[3]SP
	
---------------------------------------*/

.pc_hide {display: inline-block}

.sp_hide {display: none }

img{
	width: 100%;
	}

/*-- header-------------------------*/

header {
	background-color: #000;
}

header > div {
	margin: 0;
	padding: 1rem;
}

header img{
	width:30%; 
}

/*-- title----------------------*/

h2 {
	font-size: calc(100vw / 12);
	font-weight: 700;
	line-height:1;
        margin: 5% 0;
}

h2 strong{
	font-size: calc(100vw / 24);
        color: #000;
	font-weight: 400;
	line-height: 2;
}

h2 span{
	font-size: calc(100vw / 26);
	font-weight: 400;
        display: block;
}

h3 {
	position: relative;
	padding: 0 17px;
	text-align: center;
	font-size: calc(100vw / 24);
	font-weight: 700;
	line-height:2;     
}

h3:before {
	position: absolute;
	top: calc(50% - 1px);
	left: 0;
	width: 100%;
	height: 2px;
	content: '';
	background: #000;
}

h3 span {
	position: relative;
	padding: 0 1em;
	background: #fff;
}

/*-- kv-----------------------*/

.kv .inner{
	width:100%;
        padding: 0;
}


/*-- rakuten-----------------------*/

.rakuten .inner{
        padding-top: 0;
}

.rakuten .inner h2 {
        color: #bf0000;
}

.rakuten .inner h2 strong{
        color: #000;
}

.rakuten .inner h2 span{
	color: #fff;
        background: #bf0000;
}

.rakuten .inner p {
        margin: 5% 0;
	font-size: calc(100vw / 24);
}


/*-- item box-----------------------*/


.price{
	font-size: calc(100vw / 20);
	font-weight: 400;
        letter-spacing: 0.05em;
        margin-bottom: 3%;
}

figcaption{
	line-height:1.3;
	font-size: calc(100vw / 16);
}

figcaption span{
        line-height: 1.6;
        display:block;
        font-size: 0.7em;
}

.item_box .container_shopinfo{
        background: #fff;
	border: 2px solid #bf0000;
}

.container_shopinfo > p strong{
        font-size: 1.2em;
}

.reserve_time {
        font-weight: bold;
	font-size: calc(100vw / 28);
	color:#bf0000;
        margin: 1% 0 10%;
}


/*-- footer-----------------------*/

footer{
        text-align: center;
}

footer .btn{
        max-width: 750px;
        padding: 10% 0;
        margin-top: 3%;
}

.copyright{
	background-color: #000;
	color: #fff;
	text-align: center;
}


	/*--------------------------------------

	[3]PC
	
---------------------------------------*/


@media screen and (min-width: 750px) {
.inner{
	max-width:990px;
}

.sp_hide {display: inline-block;}
.pc_hide {display: none;}

.copyright{
	 font-size: 1.6rem;
}
	
.btn {

}

.container_shopinfo{
	max-width:960px;
	margin-bottom:5%;
	padding: 2%;
}

.container_shopinfo > p{
	font-size: 14px;
}

	
/*-- header-------------------------*/

header > div {
	max-width: 960px;
	width: 100%;
	margin: 0 auto;
}

header img{
	width:18%;
}
	
	
/*-- title----------------------*/

h2 {
	font-size: 44px;
	line-height:2;
        margin-bottom: 15px;
}

h2 strong{
	font-size: 28px;
        vertical-align: middle;
        margin-right: 10px;
}

h2 span{
	max-width:960px;
	font-size: 22px;
}

h3 {
	font-size: 28px;    
}

/*-- kv-----------------------*/

.kv {
        background-image: url(https://www.rakuten.ne.jp/gold/mtgec-beauty/reserve/images/bg_kv_refa.jpg);
        background-size: cover;
        background-repeat: no-repeat;
}
	
/*-- item box-----------------------*/


figcaption{
	font-size: 40px;
}

figcaption span{
        font-size: 0.7em;
}

.price{
	font-size: 32px;
}

/*-- footer-----------------------*/

footer .btn{
        padding: 50px 0;
}

.copyright{
	background-color: #000;
	color: #fff;
	text-align: center;
}
}